/* SPEC-24: homepage-only ink landscape; existing palette is the source. */
.hero--ink { position: relative; isolation: isolate; min-height: 640px; padding: 76px 0 86px; }
.ink-landscape { position: fixed; z-index: 0; inset: 0; height: 100%; overflow: hidden; pointer-events: none; border-bottom: 1px solid var(--color-paper-line); }
.ink-landscape svg, .ink-particles { position: absolute; width: 100%; height: 100%; inset: 0; }
.ink-landscape svg { color: var(--color-text-secondary); mask-image: linear-gradient(transparent 15%, black 75%); }
.ink-mountain { fill: currentColor; }
.ink-mountain--far { opacity: .08; }
.ink-mountain--near { opacity: .12; }
.ink-copy { position: relative; }
.hero--ink h1 { font-size: clamp(38px, 5.4vw, 62px); line-height: 1.4; letter-spacing: .055em; }
.hero--ink .eyebrow { letter-spacing: .28em; }
.hero--ink .lead { max-width: 510px; font-size: 17px; line-height: 1.95; }
.ink-seal { display: inline-block; vertical-align: middle; margin-left: 14px; padding: 7px 4px; writing-mode: vertical-rl; font-size: 16px; line-height: 1.2; letter-spacing: .14em; color: var(--color-text-inverse); background: var(--color-accent); border-radius: 3px 5px 2px 4px; transform: rotate(-5deg); }
.hero--ink .hero-shot { position: relative; border: 1px solid var(--color-paper-line); background: var(--color-bg-surface); transform: rotate(2deg); }
.ink-toggle { position: fixed; z-index: 5; bottom: 18px; right: 18px; min-height: 44px; padding: 8px 12px; border: 1px solid var(--color-paper-line); border-radius: 24px; background: var(--color-bg-base); color: var(--color-text-secondary); font: inherit; font-size: 12px; cursor: pointer; }
.ink-toggle:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 4px; }
@media (max-width: 760px) {
  .hero--ink { min-height: 0; padding: 36px 0 40px; gap: 28px; }
  .hero--ink h1 { font-size: clamp(36px, 9vw, 54px); }
  .hero--ink .lead { font-size: 16px; }
  .hero--ink .hero-shot { max-width: 380px; width: 92%; justify-self: center; transform: none; }
  .ink-desktop-break { display: none; }
}

.ink-landscape.is-painted svg { visibility: hidden; }


/* Fixed viewport painting stays behind the entire homepage. */
.ink-page > .wrap { position: relative; z-index: 1; padding-bottom: 70px; }
.ink-page .nav, .ink-page section, .ink-page footer, .ink-copy {
  background: var(--color-bg-base);
  background: color-mix(in srgb, var(--color-bg-base) 86%, transparent);
  border-radius: 16px;
}
.ink-page section { margin: 20px -20px; padding: 40px 20px; }
.ink-copy { padding: 24px; margin-left: -24px; }
.ink-page footer { padding: 24px; }
@media (max-width: 760px) {
  .ink-copy { margin: 0; padding: 18px; }
  .ink-page section { margin: 16px 0; padding: 28px 16px; }
  .ink-toggle { bottom: max(12px, env(safe-area-inset-bottom)); right: 12px; }
}