.journey-preview{background:#0d2518}
.journey-scroll{position:relative;height:100svh;background:#0d2518}
.journey-sticky{position:relative;height:100svh;min-height:700px;overflow:hidden;isolation:isolate;background:#0d2518;color:#fff}
.journey-scroll.journey-enhanced{height:360svh}
.journey-enhanced .journey-sticky{position:sticky;top:0}
.journey-landscape,.journey-jungle{position:absolute;inset:0;overflow:hidden;will-change:transform,opacity;backface-visibility:hidden;transform:translateZ(0);contain:paint}
.journey-landscape{z-index:1;background:#123021}
.journey-jungle{z-index:10}
.journey-landscape img,.journey-jungle img{position:absolute;max-width:none;pointer-events:none;user-select:none;will-change:transform,opacity;backface-visibility:hidden;transform:translateZ(0)}
.journey-landscape-master,.journey-jungle-master{inset:0;width:100%;height:100%;object-fit:cover}
.journey-landscape-master{z-index:1;object-position:center 52%;filter:saturate(.88) contrast(1.04) brightness(.8);transform:scale(1.14)}
.journey-ridge-wide{z-index:2;left:-6%;bottom:-10%;width:112%;height:61%;object-fit:cover;object-position:center bottom;filter:saturate(.72) brightness(.62)}
.journey-ridge-left{z-index:3;left:-18%;bottom:-8%;width:74%;height:78%;object-fit:contain;object-position:left bottom;filter:saturate(.74) brightness(.63)}
.journey-ridge-right{z-index:3;right:-16%;bottom:-5%;width:74%;height:78%;object-fit:contain;object-position:right bottom;filter:saturate(.74) brightness(.61)}
.journey-mountain{z-index:4;left:50%;bottom:13%;width:min(68vw,1120px);height:auto;transform:translateX(-50%);filter:saturate(.86) brightness(.86) drop-shadow(0 30px 40px rgba(27,44,39,.22))}
.journey-river{z-index:5;left:6%;bottom:-19%;width:88%;height:76%;object-fit:contain;object-position:center bottom;filter:saturate(.78) brightness(.78)}
.journey-clouds{z-index:6;left:-6%;top:6%;width:112%;height:48%;object-fit:cover;opacity:.68}
.journey-mist{z-index:7;left:-7%;top:15%;width:114%;height:70%;object-fit:cover;opacity:.3;filter:blur(3px)}
.journey-jungle-master{z-index:1;object-position:center 48%;filter:saturate(.98) contrast(1.01);transform:scale(1.025)}
.journey-canopy{z-index:2;right:-21%;bottom:-18%;width:78%;height:80%;object-fit:contain;object-position:right bottom;filter:saturate(.96) brightness(.88)}
.journey-philodendron{z-index:3;left:-22%;top:-17%;width:74%;height:78%;object-fit:contain;object-position:left top;filter:saturate(.98) brightness(.9)}
.journey-bromeliads{z-index:4;left:15%;top:-24%;width:72%;height:66%;object-fit:contain;object-position:center top;filter:saturate(.94) brightness(.88)}
.journey-orchid{z-index:4;left:-11%;bottom:-21%;width:54%;height:60%;object-fit:contain;object-position:left bottom;filter:saturate(.94) brightness(.88)}
.journey-snake{z-index:7;left:-12%;bottom:-1%;width:54%;height:48%;object-fit:contain;object-position:left center;filter:saturate(.98) brightness(.92) drop-shadow(0 25px 34px rgba(0,0,0,.18))}
.journey-toucan{z-index:7;right:-10%;top:7%;width:42%;height:55%;object-fit:contain;object-position:right top;filter:saturate(1.02) brightness(.98) drop-shadow(0 24px 32px rgba(0,0,0,.16))}
.journey-forest-frame{z-index:6;inset:-10%;width:120%;height:120%;object-fit:cover;object-position:center bottom;opacity:.45;filter:saturate(.96) brightness(.82)}
.journey-brand,.journey-beat,.journey-final,.journey-progress{position:absolute;z-index:20}
.journey-brand{inset:0;display:grid;place-content:start center;padding-top:13vh;text-align:center;pointer-events:none;text-shadow:0 4px 36px rgba(3,20,11,.74)}
.journey-brand span,.journey-brand em{font-size:.66rem;font-weight:800;letter-spacing:.24em;text-transform:uppercase;font-style:normal}
.journey-brand strong{display:block;margin:8px 0 15px;font-family:var(--display);font-size:clamp(5.6rem,13vw,12rem);font-weight:400;line-height:.78;letter-spacing:-.07em}
.journey-brand em{color:#f1d678}
.journey-beat{left:clamp(28px,7vw,112px);bottom:clamp(62px,8vh,98px);width:min(670px,calc(100% - 56px));opacity:0;transform:translateY(32px);pointer-events:none;text-shadow:0 3px 34px rgba(3,20,11,.72)}
.journey-beat span{display:block;margin-bottom:15px;color:#f1d678;font-size:.64rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase}
.journey-beat h1,.journey-beat h2{max-width:720px;margin:0;font-family:var(--display);font-size:clamp(3.6rem,7.2vw,7.6rem);font-weight:400;line-height:.84;letter-spacing:-.055em}
.journey-beat p{max-width:520px;margin:21px 0 0;color:rgba(255,255,255,.88);font-size:clamp(.95rem,1.24vw,1.12rem)}
.journey-beat-water{left:auto;right:clamp(28px,7vw,112px);text-align:right}
.journey-beat-water p{margin-left:auto}
.journey-final{left:clamp(28px,6vw,96px);bottom:clamp(46px,6vh,76px);width:min(750px,calc(100% - 56px));opacity:0;transform:translateY(28px);text-shadow:0 3px 32px rgba(5,24,13,.64)}
.journey-final .eyebrow{color:#f3d97e}
.journey-final h2{max-width:780px;margin:0;font-family:var(--display);font-size:clamp(4.1rem,8vw,8.4rem);font-weight:400;line-height:.82;letter-spacing:-.06em}
.journey-final h2 span{color:#d9b847;font-style:italic;font-weight:400}
.journey-final>p:not(.eyebrow){max-width:590px;margin:22px 0;color:rgba(255,255,255,.92);font-size:clamp(.98rem,1.25vw,1.14rem)}
.journey-final .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:25px}
.journey-final .btn-secondary{background:rgba(12,35,22,.26)}
.journey-trust{display:flex;flex-wrap:wrap;gap:25px;margin-top:23px;padding-top:17px;border-top:1px solid rgba(255,255,255,.34);font-size:.6rem;font-weight:760;letter-spacing:.1em;text-transform:uppercase}
.journey-trust strong{margin-right:6px;font-family:var(--display);font-size:1.18rem;font-weight:500;letter-spacing:0}
.journey-progress{right:23px;top:50%;width:1px;height:210px;background:rgba(255,255,255,.3);transform:translateY(-50%)}
.journey-progress span{display:block;width:2px;height:100%;background:#f0d269;transform:scaleY(0);transform-origin:top}
.journey-progress small{position:absolute;top:50%;left:14px;white-space:nowrap;font-size:.52rem;font-weight:760;letter-spacing:.17em;text-transform:uppercase;transform:rotate(90deg) translateY(-50%);transform-origin:left top}
.journey-preview .site-header{z-index:9000}
.journey-preview .collections{background:url("assets/img/tex/paper-card.webp?v=128") repeat 0 0/620px,var(--cream);background-blend-mode:multiply}
.journey-preview .concern-section{background:linear-gradient(180deg,#f4f0e7,#faf9f6);color:var(--charcoal)}
.journey-preview .concern-section .section-head h2{color:var(--forest)}
.journey-preview .concern-tile{background:rgba(255,255,255,.72);border-color:rgba(31,58,42,.14)}
@media(max-width:980px){.journey-mountain{width:88vw}.journey-river{left:-2%;width:104%}.journey-toucan{right:-20%;width:58%}.journey-snake{left:-20%;width:70%}.journey-canopy{right:-30%;width:92%}.journey-philodendron{left:-30%;width:88%}.journey-final h2{font-size:clamp(4rem,11vw,7rem)}}
@media(max-width:720px){.journey-scroll{height:100svh}.journey-sticky{height:100svh;min-height:640px}.journey-landscape-master{object-position:53% center;filter:saturate(.9) brightness(.78);transform:scale(1.08)!important}.journey-ridge-wide,.journey-ridge-left,.journey-ridge-right,.journey-mountain,.journey-river,.journey-clouds,.journey-mist,.journey-jungle-master,.journey-bromeliads,.journey-orchid,.journey-snake,.journey-toucan{display:none}.journey-jungle{opacity:0!important}.journey-canopy{display:none}.journey-philodendron{display:none}.journey-forest-frame{display:none}.journey-beat{display:none}.journey-brand strong{font-size:clamp(3.4rem,17vw,5.4rem)}.journey-final{left:22px;right:22px;bottom:38px;width:auto}.journey-static .journey-final{opacity:1!important;visibility:visible!important;transform:none!important}.journey-final h2{font-size:clamp(3.7rem,18vw,5.7rem)}.journey-final>p:not(.eyebrow){font-size:.92rem}.journey-final .btn{padding:0 16px;font-size:.66rem}.journey-trust{gap:12px;font-size:.5rem}.journey-progress{display:none}}
@media(prefers-reduced-motion:reduce){.journey-scroll{height:auto}.journey-sticky{height:100svh}.journey-jungle{opacity:.28!important}.journey-jungle-master,.journey-snake,.journey-toucan,.journey-bromeliads,.journey-orchid{display:none}.journey-brand,.journey-beat{display:none}.journey-final{opacity:1!important;transform:none!important}.journey-progress{display:none}}

/* v23 reversed journey: summit opening */
.journey-summit{position:absolute;inset:0;z-index:3}
.journey-sky{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.journey-peak{position:absolute;left:50%;bottom:-6%;width:min(72vw,1100px);height:auto;transform:translateX(-50%)}
.journey-static .journey-summit{display:none}

/* v27 figma scenes */
.j3{position:absolute;inset:0;overflow:hidden}
.j3l{position:absolute;object-fit:contain;will-change:transform,opacity;max-width:none}
.j3l[data-l$="-base"],.j3l[data-l="s1-sky"]{object-fit:cover}
.journey-static .j3-s2,.journey-static .j3-s3{display:none}

/* v28: display title between clouds and peak */
.j3-title{position:absolute;left:50%;top:30%;transform:translate(-50%,-50%);z-index:2;
  font-family:'Fraunces','Cormorant Garamond',Georgia,serif;font-weight:500;
  font-size:clamp(38px,5.6vw,108px);letter-spacing:.09em;text-transform:uppercase;color:#fdf9ee;
  text-shadow:0 4px 40px rgba(30,40,30,.35), 0 0 90px rgba(255,244,214,.4);
  white-space:nowrap;pointer-events:none}
/* the nested title replaces the old center wordmark */

.journey-preview .journey-brand{top:18%}

/* v33: title behind the mountain; premium display serif everywhere */
.j3-s1 .j3l[data-l="s1-shoulder"],.j3-s1 .j3l[data-l="s1-peak"]{z-index:3}
.j3-title{z-index:2}
/* second rotating ribbon between hero and body */
.mid-ribbon{overflow:hidden;background:var(--forest,#123420);color:#f2efe2;border-block:1px solid rgba(255,255,255,.12)}
.mid-ribbon .trust-track{display:flex;gap:34px;white-space:nowrap;padding:11px 0;font-size:.62rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;animation:midTicker 30s linear infinite;width:max-content}
.mid-ribbon i{font-style:normal;color:#d9b64a}
@keyframes midTicker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* 9:16 botanical plates under the philosophy statement */
.herb-plates{grid-template-columns:repeat(4,1fr)}
.herb-plate{aspect-ratio:9/16 !important;border-radius:20px !important}
.herb-plate img{object-fit:cover}
@media(max-width:720px){.herb-plate{aspect-ratio:9/16 !important}}

/* v34: mobile static hero polish + 2-up botanical plates */
@media(max-width:720px){
.herb-plates{grid-template-columns:repeat(2,1fr);gap:12px;margin-top:40px}
.journey-static .j3-title{top:26%;font-size:clamp(42px,12.5vw,60px);letter-spacing:.12em}
.journey-final .btn{min-height:48px;padding:0 18px;font-size:.68rem}
.journey-final .hero-actions{gap:10px}
.journey-trust{gap:10px 20px;font-size:.54rem;padding-top:14px}
.journey-trust strong{font-size:1.05rem}
.mid-ribbon .trust-track{font-size:.56rem;gap:24px;padding:9px 0}
}

/* v37: single-environment rise (Scene FINAL) */
.j4{position:absolute;inset:0;overflow:hidden}
.j4l{position:absolute;will-change:transform;max-width:none}
.j4-band{left:0;width:100%;object-fit:cover}
.j4-obj{width:auto}
.journey-static .j4l{transform:none!important}

/* v41: Scene0->FINAL true-aspect stage (comp 1940x1725, aspect .8892) */
.j5{position:absolute;inset:0;overflow:hidden}
.journey-mobile-scene{display:none}
.j5-stage{position:absolute;top:0;left:50%;width:max(100vw,112.47svh);margin-left:calc(max(100vw,112.47svh)/-2);aspect-ratio:1940/1725;will-change:transform}
.j5l{position:absolute;will-change:transform;max-width:none}
.journey-static .j5-stage{top:auto;bottom:0;transform:none!important}
.journey-static .j5l{transform:none!important}


/* v46: brand hero statement + tagline */
.journey-brand{z-index:24}
.journey-brand strong{font-size:clamp(6rem,14vw,13rem);text-shadow:0 6px 44px rgba(3,20,11,.55)}
.journey-brand em{font-family:var(--display);font-style:italic;font-size:clamp(1.05rem,1.8vw,1.5rem);letter-spacing:.1em;text-transform:none;color:#f7e9b8}

/* v48: philosophy spotlight + mobile journey stage */
.philosophy{position:relative}
.philo-spotlight{position:absolute;inset:0;pointer-events:none;z-index:1;opacity:0;transition:opacity .5s;background:radial-gradient(340px circle at var(--sx,50%) var(--sy,50%),rgba(212,175,55,.16),rgba(212,175,55,.05) 45%,transparent 70%)}


/* v49: hero scroll cue */
.journey-scrollcue{position:absolute;left:50%;bottom:34px;transform:translateX(-50%);z-index:22;display:grid;justify-items:center;gap:10px;color:#fff;text-shadow:0 2px 18px rgba(3,20,11,.6);pointer-events:none}
.journey-scrollcue .cue-ring{width:46px;height:46px;border:1.5px solid rgba(255,255,255,.75);border-radius:50%;display:grid;place-items:center;backdrop-filter:blur(4px);background:rgba(13,37,24,.18);animation:cue-bounce 2.1s ease-in-out infinite}
.journey-scrollcue svg{width:20px;height:20px;color:#fff}
.journey-scrollcue small{font-size:.62rem;font-weight:800;letter-spacing:.22em;text-transform:uppercase}
@keyframes cue-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(9px)}}
.journey-static .journey-scrollcue{display:none}
@media(max-width:720px){.journey-scrollcue small{font-size:.55rem}}
/* v113: the scroll journey now runs on phones too (Raisa/Shreyas ask). The
   static scene image is only the no-JS / reduced-motion fallback. */
@media(max-width:720px){.journey-static .j5{display:none}.journey-static .journey-brand{display:none}.journey-static .journey-mobile-scene{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% center;filter:saturate(.92) brightness(.68)}.journey-brand strong{font-size:clamp(3.2rem,16vw,5rem)}}

/* v70: Figma keyframes - page opens on Scene FINAL Compressed, scroll expands to Scene FINAL */
.j5-stage{position:absolute;top:0;left:50%;width:max(100vw,102.55svh);margin-left:calc(max(100vw,102.55svh)/-2);aspect-ratio:1933/1885;will-change:transform}
.j5l[data-n="s-sky"]{left:0.57%;top:40.74%;width:98.71%;height:56.98%}
.j5l[data-n="v-sky"]{left:0.62%;top:0.0%;width:99.28%;height:67.85%}
.j5l[data-n="cloud-d"]{left:54.99%;top:23.29%;width:18.05%;height:9.28%}
.j5l[data-n="condor"]{left:7.76%;top:5.09%;width:25.3%;height:19.47%}
.j5l[data-n="cloud-e"]{left:21.57%;top:17.03%;width:24.0%;height:12.57%}
.j5l[data-n="cloud-b"]{left:64.98%;top:5.94%;width:34.92%;height:15.28%}
.j5l[data-n="cotopaxi"]{left:3.26%;top:5.09%;width:92.86%;height:53.58%}
.j5l[data-n="valley"]{left:0.62%;top:32.57%;width:98.76%;height:42.97%}
.j5l[data-n="branch"]{left:0.41%;top:30.29%;width:49.61%;height:33.9%}
.j5l[data-n="branch-2"]{left:49.72%;top:35.54%;width:49.61%;height:33.9%}
.j5l[data-n="moss"]{left:0.0%;top:42.76%;width:100.0%;height:57.24%}
.j5l[data-n="mossbranch"]{left:0.57%;top:44.46%;width:93.17%;height:53.79%}
.j5l[data-n="monstera"]{left:0.0%;top:42.28%;width:55.87%;height:57.29%}
.j5l[data-n="orchid-brom"]{left:63.94%;top:50.82%;width:33.64%;height:45.95%}
.j5l[data-n="orchids-left"]{left:59.86%;top:75.54%;width:17.59%;height:24.03%}

/* v72: end of scroll - scene blurs back, copy comes forward */
.j5-stage{transition:none}
.journey-final{text-shadow:0 4px 30px rgba(4,18,10,.55)}
.journey-final h2{text-shadow:0 6px 40px rgba(4,18,10,.6)}

/* v78: edge sprites flush to the viewport, no gap on right or bottom */
.j5l[data-n="orchid-brom"]{left:auto!important;right:0!important;top:auto!important;bottom:0!important}
.j5l[data-n="orchids-left"]{left:auto!important;right:14.5%!important;top:auto!important;bottom:0!important}
.j5l[data-n="monstera"]{left:0!important;top:auto!important;bottom:0!important}
.j5l[data-n="moss"]{left:0!important;top:auto!important;bottom:0!important;width:100%!important}

/* v80: cloud drifting in FRONT of the wordmark */
.j5-cloudfront{position:absolute;z-index:21;left:26%;top:34%;width:34%;height:auto;pointer-events:none;opacity:.92;will-change:transform}
@media(max-width:720px){.j5-cloudfront{left:8%;width:62%;top:38%}}

/* v82: an EXISTING cloud passes in front of the wordmark (no extra cloud added) */
.j5l[data-n="cloud-e"]{z-index:21}
.journey-brand{z-index:20}

/* v82: philosophy-style edge sprites bleed cleanly off the frame */

/* The constant-radius veil is rasterized once; scroll only changes opacity. */
.j5-veil{position:absolute;inset:0;z-index:19;pointer-events:none;opacity:0;
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  will-change:opacity;transform:translateZ(0);contain:paint}
.journey-scroll{background:#0d2518}

/* v133: native sticky now owns the hero hold instead of ScrollTrigger's pin
   spacer. This keeps the full scene attached to the viewport in both scroll
   directions and removes the blank green spacer exposure on upward re-entry. */

/* v96: branch.webp has a straight bottom crop, so on narrow viewports the
   branch / mirrored branch-2 layers cut a hard horizontal line through the
   jungle. Feather the BOTTOM edge only (a vertical mask is unaffected by the
   scaleX(-1) flip on branch-2). Side edges stay untouched: feathering those
   previously landed on the screen edges and blurred the frame. */
.j5l[data-n="branch"],.j5l[data-n="branch-2"]{
  -webkit-mask-image:linear-gradient(to bottom,#000 74%,rgba(0,0,0,.55) 90%,transparent 99%);
  mask-image:linear-gradient(to bottom,#000 74%,rgba(0,0,0,.55) 90%,transparent 99%)}

/* v96: "Scroll to begin the descent" overflowed the right edge at 390px */
@media(max-width:520px){
  .journey-scrollcue small{font-size:11px;letter-spacing:.14em;text-align:center}
  .journey-scrollcue{width:min(92vw,320px)}
}

/* v96b: GSAP tweens .journey-scrollcue's y, and writing that transform wipes the
   CSS translateX(-50%) this element used for horizontal centring, so the cue sat
   half its own width to the RIGHT of centre on every viewport (it just only
   overflowed visibly on narrow ones). Centre with auto margins instead, leaving
   the transform channel free for GSAP. */
.journey-scrollcue{left:0;right:0;width:min(92vw,340px);margin-inline:auto;transform:none}

/* v98: now that the summit is composed at scroll 0, the Kawsaypac wordmark was
   landing white-on-white across the glacier. Lift the brand block into the sky
   band above the peak. Pairs with cotopaxi data-dyp 14, which eases the cone
   down ~60px to open that band without costing the full-cone framing. */
.journey-preview .journey-brand{top:1%}

/* v112: the sky plate had baked rounded transparent corners and sat 0.6% inset,
   leaking the dark stage as a left strip + curved hero corners. Overscan it. */
.j5l[data-n="v-sky"]{left:-0.6%!important;top:-0.6%!important;width:101.4%!important;height:69%!important}
.j5l[data-n="s-sky"]{left:-0.6%!important;width:101.4%!important}

/* v114: mobile hero, hide the yellowish sunrise band at the frame bottom.
   Push the plate's crop upward and blend the hero out into the page cream
   so the second section starts clean (all phones). */
@media(max-width:720px){
  .journey-landscape-master{object-position:53% 24%;transform:scale(1.16)!important}
  .journey-sticky{min-height:590px}
  /* v132: the 96px white fade at the hero bottom read as a "white overlay" on phones (Shreyas). Removed; the hero now meets the next section clean. */
  .journey-final{bottom:56px}
}

/* v134: phone browser chrome and DevTools viewport resizing can briefly make
   the lower terrain handoff taller than the composed foreground. Overscan both
   existing foreground sprites upward and past the side/bottom edges so the
   warm s-sky plate can never appear as a rectangular band. Desktop geometry
   and GSAP's transform channel remain untouched. */
@media(max-width:720px){
  .j5l[data-n="moss"]{
    left:-4%!important;
    bottom:-2%!important;
    width:108%!important;
    height:64%!important;
  }
  .j5l[data-n="mossbranch"]{
    left:-3%!important;
    top:auto!important;
    bottom:-2%!important;
    width:106%!important;
    height:61%!important;
  }
}