/* ===================== CARDONAL — cinematic landing ===================== */
/* Palette from the official brand manual. One rationed accent: olive/oro. */
:root{
--ink:#14180F;            /* warm near-black */
--ink-2:#28301F;
--paper:#DED9CE;          /* piedra / arena — bone */
--paper-2:#E8E3D8;
--verde:#33452C;          /* 364 U · deep forest green */
--verde-2:#3F5236;
--olive:#8A7F45;          /* 3995 U · olive/oro mate — the ONLY saturated color */
--olive-2:#A99A57;
--stone:#7C7566;          /* muted text on light */
--stone-d:var(--paper);        /* muted text on dark */
--line:rgba(20,24,15,.15);
--line-d:rgba(222,217,206,.16);
--ease:cubic-bezier(.16,1,.3,1);
--serif:"Fraunces",Georgia,serif;
--sans:"Roboto",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
--maxw:1320px;
--pad:clamp(20px,5vw,84px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
html,body{width:100%;max-width:100%}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);line-height:1.6;font-weight:300;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
::selection{background:var(--olive);color:#fff}
/* film grain */
body::before{content:"";position:fixed;inset:0;z-index:9000;pointer-events:none;opacity:.05;mix-blend-mode:multiply;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ===================== TYPE ===================== */
.eyebrow{font-family:var(--sans);font-weight:500;font-size:.72rem;letter-spacing:.28em;text-transform:uppercase;color:var(--olive)}
.eyebrow.muted{color:var(--stone)}
h1,h2,h3{font-family:var(--serif);font-weight:430;line-height:1.03;letter-spacing:-.012em;font-optical-sizing:auto}
.thin{font-weight:300;font-style:italic;letter-spacing:-.005em}
.display{font-size:clamp(2.8rem,8.5vw,8rem)}
.h2{font-size:clamp(2rem,5vw,4.4rem);line-height:1.04}
.lead{font-size:clamp(1.05rem,1.5vw,1.32rem);color:var(--ink-2);max-width:46ch;font-weight:300;line-height:1.6}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad)}

/* ===================== CHROME ===================== */
.progress{position:fixed;top:0;left:0;height:2px;width:100%;transform:scaleX(0);transform-origin:0 50%;background:var(--olive);z-index:8000}
header.nav{position:fixed;top:0;left:0;width:100%;z-index:7000;display:flex;align-items:center;justify-content:space-between;
padding:22px var(--pad);transition:padding .5s var(--ease),background .5s var(--ease),color .5s var(--ease);color:var(--paper)}
@media(hover:hover){header.nav{mix-blend-mode:difference}}
/* Mobile: lower the nav so logo isn't hidden by notch/status bar */
@media(max-width:640px){
  header.nav{padding-top:max(36px, env(safe-area-inset-top, 0px) + 22px)}
  .brand-logo{height:36px}
}
header.nav.solid{mix-blend-mode:normal;background:rgba(20,24,15,.92);backdrop-filter:blur(12px);color:var(--paper);padding:14px var(--pad);border-bottom:1px solid var(--line-d)}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--serif);font-weight:500;font-size:1.24rem;letter-spacing:.06em}
.brand .mark{width:30px;height:auto;display:block}
.brand .mark path{fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.brand-logo{height:44px;width:auto;display:block}
.nav-links{display:flex;gap:34px;align-items:center}
.nav-links a{font-size:.8rem;letter-spacing:.08em;font-weight:500;text-transform:uppercase;opacity:.85;transition:opacity .3s}
.nav-links a:hover{opacity:1}
.nav-cta{border:1px solid currentColor;border-radius:100px;padding:9px 20px;font-size:.72rem;letter-spacing:.1em}
header.nav.solid .nav-cta:hover{background:var(--olive);color:#fff;border-color:var(--olive)}
@media(max-width:820px){.nav-links a:not(.nav-cta){display:none}}


/* custom cursor */
.cursor{position:fixed;top:0;left:0;z-index:9500;pointer-events:none;display:flex;align-items:center;gap:8px;
background:var(--olive);color:#fff;border-radius:100px;padding:10px 20px;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600;
transform:translate(-50%,-50%) scale(.4);opacity:0;transition:opacity .3s,transform .3s var(--ease);white-space:nowrap}
.cursor.show{opacity:1;transform:translate(-50%,-50%) scale(1)}
@media(hover:none),(pointer:coarse){.cursor{display:none}}

/* route rail */
.rail{position:fixed;left:26px;top:50%;transform:translateY(-50%);z-index:6000;pointer-events:none;display:flex;flex-direction:column;align-items:center;gap:16px;color:var(--rail-fg,#DED9CE);transition:color .6s var(--ease)}
.rail .rcap{font-size:.56rem;letter-spacing:.28em;text-transform:uppercase;writing-mode:vertical-rl;min-height:120px;display:flex;align-items:center;justify-content:center;font-weight:600}
.rail .rtrack{width:1px;height:150px;background:currentColor;opacity:.4;position:relative}
.rail .rdot{position:absolute;left:50%;top:0;width:7px;height:7px;margin-left:-3px;border-radius:50%;background:var(--olive);box-shadow:0 0 0 4px rgba(138,127,69,.18)}
.rail .rlabel{font-size:.5rem;letter-spacing:.34em;writing-mode:vertical-rl;opacity:.55;font-weight:500}
@media(max-width:980px){.rail{display:none}}

/* veil */
.veil{position:fixed;inset:0;z-index:9999;background:var(--ink);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:24px;color:var(--paper)}
.veil .vmark{font-family:var(--serif);font-size:clamp(2rem,6vw,3.4rem);letter-spacing:.14em;font-weight:500;overflow:hidden}
.veil .vbar{width:min(220px,50vw);height:1px;background:var(--line-d);position:relative;overflow:hidden}
.veil .vbar i{position:absolute;inset:0;background:var(--olive);transform:scaleX(0);transform-origin:0 50%}

/* ===================== HERO ===================== */
.hero{position:relative;width:100%;height:100svh;min-height:580px;overflow:hidden;background:var(--ink);color:var(--paper)}
.hero-media{position:absolute;inset:-8% -4%;will-change:transform}
.hero-media img,.hero-media video{width:100%;height:100%;object-fit:cover}
.hero-media video{position:absolute;inset:0}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(16,19,11,.75) 0%,rgba(16,19,11,.32) 34%,rgba(16,19,11,.45) 60%,rgba(16,19,11,.92) 100%)}
.hero-inner{position:relative;z-index:3;height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding:0 var(--pad) clamp(40px,8vh,90px);max-width:var(--maxw);margin-inline:auto;width:100%}
.hero .eyebrow{margin-bottom:24px;color:#fff}
.hero h1{font-size:clamp(2.4rem,6vw,5.2rem);max-width:15ch;margin-top:2px}
.hero .line-wrap{overflow:hidden;display:block;padding-bottom:.12em;margin-bottom:-.12em}
.hero .ln{display:block}
.hero-sub{display:flex;flex-wrap:wrap;gap:26px;align-items:flex-end;justify-content:space-between;margin-top:34px}
.hero-sub .lead{color:rgba(222,217,206,.86);max-width:38ch}
.cta-split{display:flex;align-items:center;gap:14px;flex-shrink:0}
.pill{display:inline-flex;align-items:center;gap:10px;background:var(--olive);color:#fff;border-radius:100px;padding:16px 28px;font-weight:500;font-size:.92rem;letter-spacing:.01em;transition:transform .4s var(--ease),background .4s var(--ease);will-change:transform}
.pill:hover{background:var(--olive-2)}
.disc{width:54px;height:54px;border-radius:50%;border:1px solid rgba(222,217,206,.5);display:grid;place-items:center;color:var(--paper);flex-shrink:0;transition:.4s var(--ease)}
.disc:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.disc svg{width:18px;height:18px}
.scrollcue{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:4;display:flex;flex-direction:column;align-items:center;gap:10px;color:rgba(222,217,206,.7)}
.scrollcue .ln{width:1px;height:48px;background:rgba(222,217,206,.4);position:relative;overflow:hidden}
.scrollcue .ln::after{content:"";position:absolute;left:0;top:0;width:100%;height:40%;background:var(--olive);animation:cue 2.1s var(--ease) infinite}
@keyframes cue{0%{transform:translateY(-110%)}60%,100%{transform:translateY(260%)}}
.scrollcue span{font-size:.6rem;letter-spacing:.3em;text-transform:uppercase}
@media(max-width:760px){.scrollcue{display:none}}
@media(max-width:600px){
  .hero{min-height:100svh}
  .hero-media{inset:0}
  .hero h1{font-size:clamp(2.4rem,10vw,3.8rem)}
  .hero-sub{flex-direction:column;align-items:flex-start;gap:16px;margin-top:20px}
  .hero-sub .lead{max-width:100%;font-size:.98rem}
  .cta-split{width:100%}
  .pill{font-size:.85rem;padding:14px 22px}
}


/* ===================== MANIFESTO ===================== */
.manifesto{position:relative;padding:clamp(110px,16vh,210px) 0;background:var(--paper);overflow:hidden}
.manifesto .ghost{position:absolute;top:70%;left:50%;transform:translate(-50%,-50%);font-family:var(--serif);font-weight:500;font-size:clamp(10rem,33vw,35rem);color:var(--ink);opacity:.04;letter-spacing:-.04em;pointer-events:none;white-space:nowrap;z-index:0}

.manifesto .wrap{position:relative;z-index:1}
.statement{font-family:var(--serif);font-weight:400;font-size:clamp(1.9rem,4.6vw,4rem);line-height:1.1;letter-spacing:-.02em;max-width:20ch}
.statement em{color:var(--olive);font-style:italic;font-weight:400}
.manifesto .body{margin-top:48px;display:grid;grid-template-columns:1fr 1fr;gap:40px;max-width:760px}
.manifesto .body p{color:var(--ink-2);font-weight:300;font-size:1.02rem}
@media(max-width:680px){.manifesto .body{grid-template-columns:1fr}}

/* ===================== JOURNEYS (horizontal) ===================== */
.journeys{background:var(--ink);color:var(--paper)}
.jpin{height:100svh;overflow:hidden;display:flex;align-items:center}
.jtrack{display:flex;gap:clamp(20px,3vw,46px);padding:0 var(--pad);align-items:stretch;will-change:transform}
.jpanel{flex:0 0 auto;width:min(78vw,540px);display:flex;flex-direction:column;justify-content:center}
.jpanel h2{font-size:clamp(2.2rem,5vw,4.2rem)}
h2 em{color:var(--olive);font-style:italic;font-weight:400;font-optical-sizing:auto}
.jpanel .lead{color:var(--stone-d);margin-top:22px}
.jpanel .eyebrow{margin-bottom:18px}
.jcard{flex:0 0 auto;width:min(70vw,430px);position:relative;display:flex;flex-direction:column;justify-content:flex-end}
.jcard .frame{position:relative;width:100%;aspect-ratio:4/5;overflow:hidden;background:var(--ink-2);transform:translate3d(0,0,0);backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:12px}
.jcard .frame img{position:absolute;inset:-8% 0;width:100%;height:116%;object-fit:cover;will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.jcard .frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 20%,rgba(16,19,11,.92) 100%);pointer-events:none;transform:translate3d(0,0,0);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.jcard .meta{position:absolute;left:24px;right:24px;bottom:24px;z-index:2}
.jcard .coord{font-size:.68rem;letter-spacing:.16em;color:var(--olive-2);font-weight:600;text-transform:uppercase}
.jcard h3{font-size:clamp(1.6rem,2.4vw,2.3rem);margin:8px 0 6px}
.jcard .note{font-size:.92rem;color:var(--stone-d);font-weight:300}
.jcard .idx{position:absolute;top:18px;left:24px;z-index:2;font-size:.7rem;letter-spacing:.12em;color:rgba(222,217,206,.7);font-weight:600}
.jhint{position:absolute;bottom:30px;right:var(--pad);z-index:5;color:var(--stone-d);font-size:.64rem;letter-spacing:.26em;text-transform:uppercase;display:flex;align-items:center;gap:10px}
.jhint .bar{width:42px;height:1px;background:var(--line-d);position:relative;overflow:hidden}
.jhint .bar i{position:absolute;inset:0;background:var(--olive);transform-origin:0 50%;transform:scaleX(0)}
.journeys.mobile .jpin{height:auto;padding:90px 0;display:block}
.journeys.mobile .jtrack{overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:20px;transform:none!important}
.journeys.mobile .jcard,.journeys.mobile .jpanel{scroll-snap-align:center}
.journeys.mobile .jhint{display:none}

/* ===================== EXPERIENCE (card stacking) ===================== */
.exp{background:var(--paper-2);padding:clamp(90px,12vh,150px) 0}
.exp .head{margin-bottom:clamp(40px,7vh,80px)}
.exp .head h2{max-width:20ch;margin-top:18px}
.stack-container{display:flex;flex-direction:column;gap:clamp(30px,6vh,60px);padding-bottom:12vh}
.stack-card{position:sticky;top:clamp(80px,15vh,130px);height:clamp(420px,68svh,640px);width:100%;border-radius:12px;overflow:hidden;background:var(--ink-2);display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(24px,5vw,50px);box-shadow:0 -10px 30px rgba(0,0,0,.15);will-change:transform,opacity}
.stack-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform 1s var(--ease);border-radius:12px}
.stack-card:hover img{transform:scale(1.04)}
.stack-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(20,24,15,.88) 100%);z-index:1}
.stack-card-content{position:relative;z-index:2;max-width:44ch}
.stack-card-content .num{font-family:var(--serif);font-size:clamp(2.4rem,4.5vw,4rem);color:var(--olive);line-height:1;display:block;margin-bottom:12px;font-weight:300}
.stack-card-content h3{font-size:clamp(1.5rem,2.8vw,2.4rem);margin-bottom:10px;color:#fff}
.stack-card-content p{font-size:.96rem;line-height:1.5;color:var(--paper);font-weight:300;opacity:.9}
@media(max-width:640px){
  .stack-card{
    height:56svh;
    padding:24px;
    top:70px;
    box-shadow:0 -4px 20px rgba(0,0,0,.35);
  }
  .stack-container{
    gap:40px;
    padding-bottom:10vh;
  }
  .stack-card-content .num{font-size:2rem}
  .stack-card-content h3{font-size:1.5rem}
}


/* ===================== STAY (split info) ===================== */
.stay{background:var(--paper);padding:clamp(90px,13vh,170px) 0}
.stay-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,72px);align-items:center}
.stay-media{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:12px;background:var(--ink)}
.stay-media img{position:absolute;inset:-6% 0;width:100%;height:112%;object-fit:cover;will-change:transform;border-radius:12px}
.stay-copy h2{margin:18px 0 26px}
.stay-copy .lead{margin-bottom:26px}
.stay-copy .ledger{position:relative;width:100%}
.ledger-row{position:relative;padding:15px 0;font-size:.92rem}
.ledger-line{position:absolute;top:0;left:0;right:0;height:1px;background:rgba(20,24,15,.35);transform-origin:left center;transform:scaleX(0);will-change:transform}
.ledger-line.bottom{top:auto;bottom:0}
.ledger-content{display:flex;justify-content:space-between;gap:20px;opacity:1;will-change:transform,opacity}
.stay-copy .ledger span:first-child{color:var(--stone);letter-spacing:.04em}
.stay-copy .ledger span:last-child{font-weight:500}
@media(max-width:780px){.stay-grid{grid-template-columns:1fr}.stay-media{order:-1}}

/* ===================== INTERLUDE ===================== */
.interlude{position:relative;min-height:100svh;display:flex;align-items:center;background:var(--ink);color:var(--paper);overflow:hidden}
.interlude .bg{position:absolute;inset:-8% 0;will-change:transform}
.interlude .bg img,.interlude .bg video{width:100%;height:116%;object-fit:cover;opacity:.32}
.interlude::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 40%,rgba(20,24,15,.2) 30%,rgba(20,24,15,.86) 100%)}
.interlude .wrap{position:relative;z-index:2;text-align:center}
.interlude .eyebrow{margin-bottom:26px;color:var(--olive-2)}
.interlude .big{font-family:var(--serif);font-weight:400;font-size:clamp(1.9rem,4.6vw,3.9rem);line-height:1.18;max-width:20ch;margin-inline:auto}
.interlude .big em{font-style:italic;color:var(--olive-2)}
.interlude .fieldnote{margin-top:40px;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--stone-d)}

/* ===================== NUMBERS ===================== */
.numbers{position:relative;padding:clamp(100px,15vh,190px) 0;overflow:hidden;background:var(--ink);color:var(--paper)}
.numbers .bg{position:absolute;inset:-12% 0;will-change:transform}
.numbers .bg img{width:100%;height:124%;object-fit:cover;opacity:.24}
.numbers::after{content:"";position:absolute;inset:0;background:rgba(20,24,15,.42)}
.numbers .wrap{position:relative;z-index:2}
.numbers .head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:clamp(50px,8vh,90px)}
.numbers .head h2{max-width:15ch}
.nledger{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-d);border:1px solid var(--line-d)}
.nstat{background:var(--ink);padding:38px 30px;display:flex;flex-direction:column;gap:14px}
.nstat .v{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,3.8vw,3.8rem);line-height:.9;color:var(--paper);white-space:nowrap}
.nstat.lead-stat .v{color:var(--olive-2)}
.nstat .k{font-size:.84rem;color:var(--stone-d);font-weight:300}
@media(max-width:860px){.nledger{grid-template-columns:repeat(2,1fr)}}

/* ===================== QUOTE ===================== */
.quote{background:var(--verde);color:#fff;padding:clamp(90px,16vh,190px) 0;position:relative;overflow:hidden}
.quote .wrap{position:relative;z-index:2;max-width:980px}
.quote q{font-family:var(--serif);font-weight:400;font-size:clamp(1.8rem,4.4vw,3.5rem);line-height:1.18;letter-spacing:-.01em;display:block;quotes:none}
.quote q em{font-style:italic;color:inherit}
.quote q::before{content:"\201C";font-family:var(--serif);position:absolute;top:-.38em;left:-.38em;font-size:clamp(6rem,16vw,15rem);opacity:.08;line-height:1;z-index:-1}
.quote .who{margin-top:36px;font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;opacity:.9;padding-left:clamp(50px,9vw,110px)}

/* ===================== MARQUEE ===================== */
.marquee{background:var(--paper);padding:clamp(46px,8vh,84px) 0;overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.mrow{display:flex;white-space:nowrap;width:max-content;will-change:transform}
.mrow+.mrow{margin-top:16px}
.mrow span{font-family:var(--serif);font-size:clamp(1.6rem,3.4vw,2.7rem);font-weight:500;padding:0 26px;color:var(--ink);display:inline-flex;align-items:center;gap:26px;letter-spacing:-.01em}
.mrow span::after{content:"\2022";color:var(--olive);font-size:.5em}
.mrow.dim span{color:transparent;-webkit-text-stroke:1px var(--line)}

/* ===================== FINAL CTA ===================== */
.final{position:relative;min-height:100svh;display:flex;align-items:flex-end;padding-bottom:clamp(50px,10vh,110px);background:var(--ink);color:var(--paper);overflow:hidden}
.final .bg{position:absolute;inset:-8% 0;will-change:transform}
.final .bg img,.final .bg video{width:100%;height:116%;object-fit:cover;opacity:.5}
.final::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(16,19,11,.72),rgba(16,19,11,.42) 45%,rgba(16,19,11,.92))}
.final .wrap{position:relative;z-index:2;width:100%}
.final-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(30px,5vw,80px);align-items:flex-end}
.final .eyebrow{margin-bottom:22px;color:var(--olive-2)}
.final h2{font-size:clamp(2.4rem,5.5vw,4.8rem);max-width:15ch;line-height:1.05}
.final .lead{color:rgba(222,217,206,.84);margin:24px 0 0}
.final-form{width:100%}
.signup{display:flex;flex-direction:column;gap:16px;max-width:400px;width:100%}
.signup input{width:100%;background:transparent;border:1px solid rgba(222,217,206,.4);border-radius:100px;padding:16px 24px;color:var(--paper);font-family:var(--sans);font-size:.95rem;outline:none;transition:border-color .3s}
.signup input::placeholder{color:rgba(222,217,206,.5)}
.signup input:focus{border-color:var(--olive)}
.signup .pill{cursor:pointer;border:none;font-family:var(--sans);width:100%;justify-content:center}
.signup-note{margin-top:16px;font-size:.74rem;letter-spacing:.06em;color:var(--stone-d);max-width:400px}
@media(max-width:780px){
  .final-grid{grid-template-columns:1fr;gap:40px;align-items:stretch}
  .final{align-items:center;padding:90px 0}
  .final .lead{margin-bottom:0}
}

/* ===================== FOOTER ===================== */
footer.foot{background:var(--ink);color:var(--paper);padding:clamp(70px,10vh,120px) 0 50px}
.foot-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;padding-bottom:60px;border-bottom:1px solid var(--line-d)}
.foot .brand{font-size:1.7rem;display:inline-flex;margin-bottom:16px;color:var(--paper)}
.foot-top p{color:var(--stone-d);font-weight:300;max-width:34ch;font-size:.95rem}
.foot-col h4{font-family:var(--sans);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--stone-d);font-weight:600;margin-bottom:18px}
.foot-col a{display:block;padding:7px 0;font-size:.95rem;opacity:.85;transition:.3s}
.foot-col a:hover{opacity:1;color:var(--olive-2);transform:translateX(4px)}
.foot-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:30px;font-size:.78rem;color:var(--stone-d)}
@media(max-width:760px){.foot-top{grid-template-columns:1fr 1fr}}

/* ===================== REVEAL DEFAULTS ===================== */
.reveal{opacity:0;transform:translateY(28px)}
.line-wrap{display:block;overflow:hidden;padding-bottom:.18em;margin-bottom:-.18em}
.ln{display:block;padding-bottom:.02em}

/* Line-reveal: lines start pushed below clip mask */
.line-reveal .ln{transform:translateY(108%);transition:transform 1.2s cubic-bezier(0.16,1,0.3,1)}
/* Stagger delays — targeting .line-wrap (the direct child) nth-child */
.line-reveal .line-wrap:nth-child(1) .ln{transition-delay:0s}
.line-reveal .line-wrap:nth-child(2) .ln{transition-delay:0.15s}
.line-reveal .line-wrap:nth-child(3) .ln{transition-delay:0.30s}
.line-reveal .line-wrap:nth-child(4) .ln{transition-delay:0.45s}
.line-reveal .line-wrap:nth-child(5) .ln{transition-delay:0.60s}
/* When .is-visible is added by IntersectionObserver, lines rise up */
.line-reveal.is-visible .ln{transform:translateY(0)}
/* For elements without .line-wrap children (plain text elements with .line-reveal) */
.line-reveal:not(:has(.line-wrap)).is-visible{opacity:1;transform:translateY(0)}
.line-reveal:not(:has(.line-wrap)){opacity:0;transform:translateY(24px);transition:opacity 1s ease,transform 1s cubic-bezier(0.16,1,0.3,1)}

@media(prefers-reduced-motion:reduce){
.reveal{opacity:1!important;transform:none!important}
.hero-media,.stack-card img,.jcard .frame img,.stay-media img,.interlude .bg,.numbers .bg,.final .bg{transform:none!important}
.scrollcue .ln::after{animation:none}
.veil{display:none}
.line-reveal .ln{transform:none!important;transition:none!important}
}

/* ===================== MOBILE RESPONSIVE ===================== */

/* ---- Nav ---- */
@media(max-width:820px){
  .nav-links a:not(.nav-cta){display:none}
}

/* ---- Hero ---- */
@media(max-width:600px){
  .hero h1{font-size:clamp(2.2rem,9vw,3.4rem)}
  .hero-sub{flex-direction:column;align-items:flex-start;gap:20px;margin-top:24px}
  .hero-sub .lead{max-width:100%;font-size:1rem}
  .cta-split{width:100%}
  .pill{font-size:.85rem;padding:14px 22px}
}

/* ---- Manifesto ---- */
@media(max-width:680px){
  .manifesto .body{grid-template-columns:1fr;gap:20px}
  .statement{font-size:clamp(1.7rem,7vw,2.6rem)}
}

/* ---- Journeys (El Método) ---- */
@media(max-width:640px){
  .jpanel{width:min(88vw,380px)}
  .jcard{width:min(84vw,360px)}
  .jpanel h2{font-size:clamp(1.8rem,7vw,2.8rem)}
}

/* ---- Stack cards (El Norte) ---- */


/* ---- Terroir ---- */
@media(max-width:780px){
  .stay-grid{grid-template-columns:1fr}
  .stay-media{order:-1;aspect-ratio:3/2}
  .stay-copy h2{margin-top:12px}
}
@media(max-width:500px){
  .stay-media{aspect-ratio:4/3}
  .ledger-content{flex-direction:column;gap:2px}
}

/* ---- Numbers ---- */
@media(max-width:860px){.nledger{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){
  .nledger{grid-template-columns:1fr}
  .numbers .head{flex-direction:column;align-items:flex-start;gap:16px}
  .nstat{padding:28px 20px}
}

/* ---- Quote ---- */
@media(max-width:600px){
  .quote q{font-size:clamp(1.5rem,7vw,2.2rem)}
  .quote .who{padding-left:0;margin-top:28px}
  .quote q::before{font-size:clamp(5rem,20vw,8rem)}
}

/* ---- Final CTA ---- */
@media(max-width:780px){
  .final-grid{grid-template-columns:1fr;gap:40px;align-items:stretch}
  .final{align-items:center;padding:90px 0}
  .final h2{font-size:clamp(2rem,8vw,3rem)}
  .signup{max-width:100%}
}

/* ---- Footer ---- */
@media(max-width:760px){
  .foot-top{grid-template-columns:1fr 1fr;gap:30px}
}
@media(max-width:480px){
  .foot-top{grid-template-columns:1fr;gap:24px}
  .foot-bottom{flex-direction:column;gap:8px}
}

/* ---- Interlude ---- */
@media(max-width:600px){
  .interlude .big{font-size:clamp(1.5rem,7vw,2.2rem)}
}