.landing-page { background: var(--ink); }

/* Header sticky na landing mantém paleta escura */
.landing-page .site-header.is-stuck { color: var(--white); background: rgba(21,23,17,.92); border-bottom: 1px solid rgba(255,255,255,.1); box-shadow: none; }
.landing-page .site-header.is-stuck .text-link { color: var(--white); }
.landing-page .site-header.is-stuck .menu-button { color: var(--white); border-color: rgba(255,255,255,.35); }
.landing-page .site-header.is-stuck .menu-button:hover { color: var(--ink); background: var(--acid); border-color: var(--acid); }

/* ─── Hero — completamente estático ─── */
.hero { position: relative; min-height: 100svh; overflow: hidden; display: flex; align-items: flex-end; padding: calc(var(--header-h) + 64px) var(--pad) clamp(70px, 10vh, 110px); color: var(--white); background: #1b2019; isolation: isolate; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -4; background: linear-gradient(130deg, #191e17 15%, #252b21 100%); }
.hero-grid { position: absolute; inset: 0; z-index: -3; opacity: .09; background-image: linear-gradient(rgba(255,255,255,.1) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.1) 1px, transparent 1px); background-size: 8vw 8vw; mask-image: linear-gradient(to right, transparent, black 50%); }
.hero-blueprint { position: absolute; z-index: -2; top: 7%; right: 3vw; width: min(43vw, 590px); height: 86%; opacity: .62; }
.hero-blueprint svg { width: 100%; height: 100%; overflow: visible; }
.plan-primary, .plan-openings, .plan-dimensions { fill: none; stroke: rgba(255,255,255,.38); stroke-width: 1; stroke-linecap: square; stroke-linejoin: miter; vector-effect: non-scaling-stroke; }
.plan-dimensions { stroke: rgba(186,255,82,.38); stroke-width: .8; }
.plan-line { stroke-dasharray: 1; stroke-dashoffset: 1; animation: plan-draw-loop 12s cubic-bezier(.4,0,.2,1) infinite; }
.plan-2 { animation-duration: 13.5s; animation-delay: .35s; }.plan-3 { animation-duration: 11s; animation-delay: .7s; }.plan-4 { animation-duration: 15s; animation-delay: .2s; }
.plan-5 { animation-duration: 10.5s; animation-delay: 1.1s; }.plan-6 { animation-duration: 14s; animation-delay: .8s; }.plan-7 { animation-duration: 16s; animation-delay: .4s; }.plan-8 { animation-duration: 12.5s; animation-delay: 1.25s; }
.plan-point { fill: var(--acid); opacity: .25; animation: cad-point-pulse 4.8s ease-in-out infinite; }
.plan-point-b { animation-duration: 6.2s; animation-delay: -1.8s; }
.plan-north { fill: var(--acid); opacity: .45; animation: cad-note-cycle 8.5s -2s ease-in-out infinite; }
.plan-calculations { fill: var(--acid); font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 9px; letter-spacing: .08em; }
.cad-note { opacity: 0; animation: cad-note-cycle 9s ease-in-out infinite; }
.cad-note-2 { animation-duration: 11s; animation-delay: -3s; }.cad-note-3 { animation-duration: 13s; animation-delay: -6s; }
.cad-note-4 { animation-duration: 8s; animation-delay: -1s; }.cad-note-5 { animation-duration: 12s; animation-delay: -8s; }.cad-note-6 { animation-duration: 10s; animation-delay: -4s; }
.cad-mark { fill: none; stroke: var(--acid); stroke-width: .7; stroke-dasharray: 1; stroke-dashoffset: 1; opacity: .55; animation: cad-mark-loop 9s ease-in-out infinite; }
.cad-mark-2 { animation-duration: 12s; animation-delay: -5s; }
.cad-cursor { fill: none; stroke: var(--acid); stroke-width: .65; opacity: 0; transform-origin: 274px 318px; animation: cad-cursor-cycle 7.5s ease-in-out infinite; }
.cad-scan { fill: none; stroke: var(--acid); stroke-width: .65; opacity: 0; animation: cad-scan-cycle 10s linear infinite; }
.hero-copy { position: relative; z-index: 2; max-width: 900px; }
.hero .eyebrow { color: var(--acid); }
.hero-title { max-width: 880px; margin: 0; font-family: var(--font-display); font-size: clamp(38px, 5.8vw, 88px); font-weight: 300; line-height: .91; letter-spacing: -.065em; }
.hero-title em { color: var(--acid); font-family: Georgia, serif; font-weight: 400; }
.hero-subtitle { max-width: 500px; margin: 28px 0 0 clamp(0px, 17vw, 220px); color: rgba(255,255,255,.68); font-size: clamp(15px, 1.35vw, 19px); line-height: 1.55; }
.hero-actions { display: flex; gap: 12px; margin: 35px 0 0 clamp(0px, 17vw, 220px); }
.hero-index { position: absolute; margin: 0; right: var(--pad); bottom: 78px; font-size: 10px; letter-spacing: .16em; }
.hero-index span { color: var(--acid); }
.scroll-cue { position: absolute; left: var(--pad); bottom: 30px; display: flex; align-items: center; gap: 15px; font-size: 9px; text-transform: uppercase; letter-spacing: .15em; writing-mode: vertical-rl; }
.scroll-cue i { width: 1px; height: 28px; background: rgba(255,255,255,.4); overflow: hidden; }
.scroll-cue i::after { content: ""; display: block; height: 12px; background: var(--acid); animation: scroll-trace 2.8s cubic-bezier(.45,0,.55,1) infinite; }

/* ─── Manifesto — barra lateral animada ─── */
.manifesto { --manifesto-progress: 0; --manifesto-marker: 0%; position: relative; color: var(--ink); background: var(--paper); overflow: hidden; }
.manifesto-bar { position: absolute; z-index: 2; left: clamp(10px, 1.6vw, 28px); top: clamp(90px, 12vw, 180px); bottom: clamp(90px, 12vw, 180px); width: 2px; background: color-mix(in srgb, var(--ink) 13%, transparent); pointer-events: none; }
.manifesto-bar i { position: absolute; inset: 0; background: var(--ink); transform: scaleY(var(--manifesto-progress)); transform-origin: top; will-change: transform; }
.manifesto-bar span { position: absolute; top: var(--manifesto-marker); left: 50%; width: 8px; height: 8px; background: var(--acid); border: 1px solid var(--ink); border-radius: 50%; transform: translate(-50%, -50%); will-change: top; }
.section-number { padding-bottom: 24px; border-bottom: 1px solid var(--line); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; }
.manifesto-content { display: grid; grid-template-columns: minmax(0, 2.15fr) minmax(240px, .85fr); gap: clamp(50px, 8vw, 130px); align-items: end; margin-top: 70px; }
.manifesto h2 { margin: 0; font-family: var(--font-display); font-size: clamp(32px, 5vw, 68px); font-weight: 300; line-height: 1.01; letter-spacing: -.055em; }
.manifesto h2 em { font-family: Georgia, serif; font-weight: 400; }
.manifesto-side p { margin: 0 0 38px; color: #5f6059; line-height: 1.65; }
.principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 110px; background: var(--line); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.principle { min-height: 160px; padding: 28px 30px; background: var(--paper); transition: background .35s; }
.principle:hover { background: var(--paper-deep); }
.principle span { display: block; margin-bottom: 48px; font-size: 10px; letter-spacing: .1em; color: var(--muted); }
.principle h3 { margin: 0; font-family: var(--font-display); font-size: clamp(18px, 1.8vw, 24px); font-weight: 400; letter-spacing: -.02em; }

/* ─── Portal ─── */
.portal { position: relative; min-height: 740px; overflow: hidden; display: flex; align-items: center; justify-content: flex-end; color: var(--white); background: var(--sage); }
.portal::before { content: ""; position: absolute; inset: 0; opacity: .55; background: linear-gradient(120deg, #30382c, transparent 56%), repeating-linear-gradient(90deg, transparent 0 90px, rgba(255,255,255,.04) 91px); }
.portal-art { position: absolute; left: -1vw; top: 50%; width: min(58vw, 820px); height: 88%; transform: translateY(-50%); }
.portal-architecture { display: block; width: 100%; height: 100%; overflow: visible; filter: drop-shadow(0 28px 34px rgba(14,18,12,.2)); }
.portal-guides { fill: none; stroke: rgba(255,255,255,.13); stroke-width: 1; stroke-dasharray: 5 8; }
.portal-ground { fill: rgba(16,20,14,.28); stroke: rgba(255,255,255,.15); stroke-width: 1; }
.portal-shadow { fill: rgba(12,15,10,.32); transform-origin: center; animation: pavilion-shadow 12s ease-in-out infinite; }
.portal-glass { stroke: rgba(255,255,255,.35); stroke-width: 1; }
.portal-glass-left { fill: rgba(216,225,208,.16); }
.portal-glass-right { fill: rgba(232,236,225,.24); }
.portal-frames, .portal-columns { fill: none; stroke: rgba(255,255,255,.75); stroke-width: 3; stroke-linecap: square; }
.portal-frames { stroke-width: 1.2; }
.portal-slab { stroke: rgba(255,255,255,.48); stroke-width: 1; }
.portal-slab-under { fill: #30382c; transform: translateY(14px); }
.portal-slab-top { fill: #c1c7b8; }
.portal-steps path { fill: #858e7d; stroke: rgba(255,255,255,.4); stroke-width: 1; }
.portal-dimension { fill: none; stroke: var(--acid); stroke-width: 1; opacity: .65; animation: pavilion-measure 8s ease-in-out infinite; }
.portal-dimension circle { fill: var(--acid); stroke: none; }
.portal-dimension text { fill: var(--white); stroke: none; font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 10px; letter-spacing: .12em; }
.portal-copy { position: relative; z-index: 2; width: min(42%, 570px); }
.portal-copy h2 { margin: 0 0 28px; font-family: var(--font-display); font-size: clamp(32px, 4.2vw, 64px); font-weight: 300; line-height: .98; letter-spacing: -.055em; }
.portal-copy > p:not(.eyebrow) { max-width: 390px; margin: 0 0 40px; color: rgba(255,255,255,.7); font-size: 17px; line-height: 1.6; }

/* ─── Scroll reveal ─── */
.sr-hidden  { opacity: 0; transform: translateY(26px); }
.sr-visible { opacity: 1; transform: none; transition: opacity .85s ease, transform .85s cubic-bezier(.2,.7,.2,1); }

@keyframes plan-draw-loop {
  0%, 5% { stroke-dashoffset: 1; opacity: .08; }
  20%, 70% { stroke-dashoffset: 0; opacity: 1; }
  86%, 100% { stroke-dashoffset: 0; opacity: .16; }
}
@keyframes cad-point-pulse { 0%, 100% { opacity: .2; r: 4px; } 50% { opacity: 1; r: 6px; } }
@keyframes cad-note-cycle { 0%, 12%, 78%, 100% { opacity: 0; } 26%, 64% { opacity: .78; } }
@keyframes cad-mark-loop { 0%, 8% { stroke-dashoffset: 1; opacity: 0; } 28%, 68% { stroke-dashoffset: 0; opacity: .6; } 82%, 100% { opacity: 0; } }
@keyframes cad-cursor-cycle { 0%, 18%, 72%, 100% { opacity: 0; transform: scale(.65) rotate(0); } 32%, 58% { opacity: .7; transform: scale(1) rotate(90deg); } }
@keyframes cad-scan-cycle { 0%, 8% { opacity: 0; transform: translateY(0); } 15% { opacity: .4; } 68% { opacity: .18; transform: translateY(390px); } 75%, 100% { opacity: 0; transform: translateY(420px); } }
@keyframes scroll-trace {
  0% { transform: translateY(-14px); opacity: 0; }
  25% { opacity: 1; }
  75% { opacity: 1; }
  100% { transform: translateY(32px); opacity: 0; }
}
@keyframes pavilion-shadow {
  0%, 100% { transform: translate(-5px, 2px); opacity: .72; }
  50% { transform: translate(8px, 7px); opacity: .48; }
}
@keyframes pavilion-measure {
  0%, 12%, 88%, 100% { opacity: .18; }
  28%, 72% { opacity: .7; }
}

/* ─── Keyframes ─── */

/* ─── Responsive ─── */
@media (max-width: 820px) {
  .hero { min-height: 820px; align-items: center; padding-bottom: 80px; }
  .hero-blueprint { width: 82vw; right: -38vw; opacity: .32; }
  .hero-grid { background-size: 20vw 20vw; }
  .hero-subtitle, .hero-actions { margin-left: 0; }
  .hero-index { display: none; }
  .manifesto-content { grid-template-columns: 1fr; }
  .principles { grid-template-columns: 1fr; }
  .principle { min-height: 140px; }
  .principle span { margin-bottom: 28px; }
  .manifesto-bar { left: 9px; }
  .portal { flex-direction: column; align-items: flex-start; padding: 64px var(--pad) 60px; min-height: auto; }
  .portal-art { position: relative; left: auto; top: auto; width: 100%; height: auto; aspect-ratio: 760 / 580; margin: 0 0 42px; transform: none; }
  .portal-architecture { width: 108%; margin-left: -8%; }
  .portal-copy { width: 100%; }
  .portal-copy h2 { font-size: clamp(28px, 7vw, 56px); }
}

@media (max-width: 520px) {
  .principles { grid-template-columns: 1fr; }
  .portal-art { margin-bottom: 30px; }
  .portal-architecture { width: 116%; margin-left: -12%; }
}