/* GTL — "La montaña de Brady". Preview layer on top of site.css.
   The page reads as one descent: summit (hero) → trail → community. */
:root{
  --sky:#CFE1EF; --air:#EEF3F6; --serif:"Instrument Serif",Georgia,"Times New Roman",serif;
  --trail:#2F6A9A; --pad:clamp(96px,12vw,168px);
}
.pv-body{background:var(--air)}
.pv-main{position:relative}
.eyebrow{margin:0;font:500 14px/1.4 var(--sans);color:var(--muted)}
.pv-h2{margin:0;font:400 clamp(56px,8.4vw,148px)/.88 var(--display);text-transform:uppercase;letter-spacing:-.005em}
.pv-h2 em,.st-title em{font:italic 400 1.02em/.9 var(--serif);text-transform:none;letter-spacing:-.01em;color:var(--steel)}
.pv-h3{margin:0;font:400 clamp(44px,4.8vw,80px)/.92 var(--display);text-transform:uppercase}
.pv-topo{position:absolute;inset:0;width:100%;height:100%;opacity:.5;pointer-events:none}
.pv-sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:28px 48px}
.pv-sec-head p{margin:0;max-width:420px}
.hw-dot{font-family:var(--sans);font-size:.42em;vertical-align:.62em;opacity:.55}

/* ---------- Header over the light summit ---------- */
.pv-body .site-header:not(.scrolled){color:var(--ink)}
.pv-body .site-header:not(.scrolled) .btn-ghost{color:var(--ink);border-color:rgba(11,28,44,.4);background:rgba(255,255,255,.35)}
.logo .logo-ink{display:none}
.pv-body .site-header:not(.scrolled) .logo .logo-ink{display:block}
.pv-body .site-header:not(.scrolled) .logo .logo-white{display:none}

/* ---------- Trail ---------- */
.trail{position:absolute;left:0;top:0;width:100%;pointer-events:none;z-index:6;overflow:visible}
#trail-base{stroke:rgba(47,106,154,.16);stroke-width:1.5;stroke-dasharray:2 7;stroke-linecap:round}
#trail-path{stroke:var(--trail);stroke-width:2;stroke-dasharray:2 7;stroke-linecap:round}
.trail-dots{position:absolute;inset:0;pointer-events:none;z-index:7}
.way{position:absolute;display:flex;align-items:center;gap:10px;transform:translate(-6px,-6px);font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--trail);white-space:nowrap}
.way i{width:12px;height:12px;border-radius:50%;border:2px solid var(--trail);background:var(--air);transition:background .5s var(--ease),transform .5s var(--ease)}
.way span{opacity:0;transform:translateX(-6px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.way.on i{background:var(--trail);transform:scale(1.15)}
.way.on span{opacity:1;transform:none}
.way.dark{color:var(--ice)}
.way.dark i{border-color:var(--ice);background:var(--night)}
.way.dark.on i{background:var(--ice)}
@media (max-width:1000px){.way span{display:none}}

/* ---------- 01 Summit (hero) ---------- */
.pv-hero{position:relative;height:100svh;min-height:640px;overflow:hidden;background:linear-gradient(180deg,var(--sky) 0%,#E4EDF3 55%,var(--air) 100%);color:var(--ink);isolation:isolate}
.pv-hero .pv-topo{opacity:.35}
.hw{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:center;gap:0;padding-bottom:6vh}
.hw-row{overflow:hidden;white-space:nowrap;line-height:.84}
.hw-track{display:inline-flex;gap:.28em;align-items:center;will-change:transform;transform:translate3d(var(--x,0px),0,0)}
.hw-item{margin:0;font:400 clamp(120px,21vw,360px)/.84 var(--display);text-transform:uppercase;letter-spacing:-.01em;color:var(--deep)}
.hw-b .hw-item{color:transparent;-webkit-text-stroke:1.5px rgba(47,106,154,.55)}
.hw-b .hw-dot,.hw-a .hw-dot{-webkit-text-stroke:0;color:var(--steel)}
.brady{position:absolute;z-index:2;bottom:0;right:0;height:min(82svh,1080px,calc((100vw - var(--gutter) - 380px) / 1.35));width:auto;max-width:none;transform-origin:60% 100%;will-change:transform;filter:drop-shadow(0 30px 60px rgba(11,28,44,.18))}
.pv-hero-copy{position:absolute;z-index:3;left:var(--gutter);bottom:clamp(36px,7vh,80px);width:340px}
.pv-hero-copy .eyebrow{color:var(--ink);font-weight:600}
.pv-hero-body{margin:14px 0 26px;font-size:18px;line-height:1.55;color:#1F3A52}
.pv-hero-copy .btn-row{flex-direction:column;align-items:flex-start}
.btn-ghost-dark{background:rgba(255,255,255,.4)}
.descend{position:absolute;z-index:3;right:var(--gutter);bottom:28px;display:flex;align-items:center;gap:12px;font:500 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--ink);min-height:44px}
.descend i{width:1px;height:44px;background:rgba(11,28,44,.25);position:relative;overflow:hidden}
.descend i::after{content:"";position:absolute;left:0;top:-50%;width:1px;height:50%;background:var(--ink);animation:drip 1.8s var(--ease) infinite}
@keyframes drip{to{top:110%}}
/* load-in */
.pv-ready .hw-row{animation:rowIn 1.3s var(--ease) both}
.pv-ready .hw-b{animation-delay:.12s}
.pv-ready .brady{animation:bradyIn 1.4s var(--ease) .15s both}
.pv-ready .pv-hero-copy{animation:fadeUp 1s var(--ease) .55s both}
@keyframes rowIn{from{clip-path:inset(100% 0 0 0);translate:0 30%}to{clip-path:inset(0 0 0 0);translate:0 0}}
@keyframes bradyIn{from{opacity:0;translate:0 6%}to{opacity:1;translate:0 0}}
@keyframes fadeUp{from{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}
@media (max-width:900px){
  .pv-hero{height:auto;min-height:0;padding-top:88px;display:flex;flex-direction:column}
  .hw{position:relative;inset:auto;padding:4vh 0 0;z-index:1}
  .hw-item{font-size:30vw}
  .brady{position:relative;align-self:flex-end;height:auto;width:118%;max-width:none;margin:-40vw 0 0 -18%;right:auto}
  .pv-hero-copy{position:relative;left:auto;bottom:auto;width:auto;padding:28px var(--gutter) 40px;background:var(--air);margin-top:-1px}
  .pv-hero-copy .btn-row{flex-direction:column;align-items:stretch}
  .descend{display:none}
}

/* ---------- 02 Mantra (pinned) ---------- */
.pv-mantra{position:relative;height:420vh;background:var(--glacier);color:var(--ink)}
.m-pin{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;align-items:center}
.pin-grid{position:relative;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:56px;align-items:center}
.mantra-stage{position:relative}
.m-count{margin:0 0 18px;font:500 13px/1 var(--mono);letter-spacing:.14em;color:var(--muted)}
.m-count b{color:var(--ink);font-weight:500}
.m-lines{list-style:none;margin:0;padding:0;display:grid}
.m-lines li{grid-area:1/1;font:400 clamp(72px,11.5vw,210px)/.86 var(--display);text-transform:uppercase;letter-spacing:-.01em;clip-path:inset(0 0 100% 0);translate:0 40%;transition:clip-path .9s var(--ease),translate .9s var(--ease),color .6s}
.m-lines li:nth-child(even){color:var(--steel)}
.m-lines li.on{clip-path:inset(0 0 -10% 0);translate:0 0}
.m-lines li.past{clip-path:inset(0 0 100% 0);translate:0 -40%}
.m-bar{margin-top:32px;width:min(360px,60%);height:2px;background:rgba(11,28,44,.12)}
.m-bar i{display:block;height:100%;width:0;background:var(--ink)}
.pv-polaroid{position:relative;margin:0;background:#fff;padding:12px 12px 54px;box-shadow:0 30px 70px rgba(11,28,44,.18);rotate:calc(-4deg + var(--pp,0)*5deg);translate:0 calc((1 - var(--pp,0))*-60px);opacity:calc(.2 + var(--pp,0)*.8)}
.pv-polaroid::before{content:"";position:absolute;z-index:2;top:-14px;left:50%;width:110px;height:28px;margin-left:-55px;background:rgba(243,245,246,.8);box-shadow:0 1px 3px rgba(0,0,0,.12);rotate:3deg}
.pv-polaroid img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.pv-polaroid figcaption{position:absolute;left:16px;bottom:18px;font:italic 400 20px/1 var(--serif);color:var(--muted)}
@media (max-width:900px){
  .pin-grid{grid-template-columns:1fr;gap:28px}
  .m-lines li{font-size:13.2vw}
  .pv-polaroid{width:min(300px,72%);justify-self:end}
}

/* ---------- 03 Story ---------- */
.pv-story{background:var(--snow);color:var(--ink);padding:var(--pad) 0}
.st-head{max-width:900px}
.st-title{margin:16px 0 0;font:400 clamp(60px,9vw,160px)/.86 var(--display);text-transform:uppercase}
.st-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(40px,6vw,96px);margin-top:clamp(56px,8vw,110px)}
.st-media{position:sticky;top:110px;align-self:start}
.st-frame{position:relative;width:100%;max-height:72svh;aspect-ratio:var(--ar);margin-inline:auto;transition:aspect-ratio .9s var(--ease);overflow:hidden;border-radius:2px;background:var(--glacier)}
.st-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;scale:1.04;transition:opacity .9s var(--ease),scale 1.4s var(--ease)}
.st-frame img.on{opacity:1;scale:1}
.st-step{margin:14px 0 0;font:500 12px/1 var(--mono);letter-spacing:.14em;color:var(--muted)}
.st-step b{color:var(--ink);font-weight:500}
.st-ch{min-height:58svh;padding:8px 0 40px;border-top:1px solid rgba(11,28,44,.14);opacity:.35;transition:opacity .6s var(--ease)}
.st-ch.on{opacity:1}
.st-num{margin:18px 0 0;font:500 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--steel)}
.st-ch h3{margin:16px 0 0;font:400 clamp(40px,4vw,64px)/.95 var(--display);text-transform:uppercase}
.st-ch .body{margin:20px 0 0;font-size:19px;line-height:1.65;color:#2A4157;max-width:520px}
.dropcap::first-letter{float:left;font:400 4.6em/.8 var(--display);margin:.06em .1em 0 0;color:var(--steel)}
.st-quote{margin:24px 0 0;padding-top:40px;border-top:2px solid var(--ink)}
.st-quote blockquote{margin:0;font:italic 400 clamp(40px,4.4vw,72px)/1 var(--serif)}
.st-quote figcaption{margin-top:20px;color:var(--muted);font-size:17px}
.ink-words .iw{color:rgba(11,28,44,.16);transition:color .35s}
.ink-words .iw.on{color:inherit}
@media (max-width:900px){
  .st-grid{grid-template-columns:1fr}
  .st-media{top:76px;z-index:2;background:var(--snow);padding-bottom:12px}
  .st-frame{max-height:36svh;width:auto;max-width:100%}
  .st-ch{min-height:0;padding-bottom:56px}
}

/* ---------- Kinetic band ---------- */
.pv-band{position:relative;background:var(--night);color:var(--snow);padding:clamp(56px,8vw,110px) 0;overflow:hidden}
.band-row{display:inline-flex;gap:.3em;align-items:center;white-space:nowrap;font:400 clamp(84px,13vw,230px)/.9 var(--display);text-transform:uppercase;will-change:transform;transform:translate3d(var(--x,0px),0,0)}
.band-alt{color:transparent;-webkit-text-stroke:1.5px rgba(169,203,232,.6)}
.band-alt .hw-dot{-webkit-text-stroke:0;color:var(--ice)}
.pv-band .band-row:first-child .hw-dot{color:var(--ice)}

/* ---------- 04 Map ---------- */
.pv-map .head{padding-top:var(--pad)}
.pv-map .pv-h2{color:var(--snow)}
.pv-map .pv-h2 em{color:var(--ice)}
.pv-map .pv-sec-head p{color:var(--mist);margin-bottom:20px}

/* ---------- 05 Scholarship ---------- */
.pv-apply{background:var(--glacier);color:var(--ink);padding:var(--pad) 0 0}
.ap-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(40px,6vw,96px);align-items:center}
.ap-photo{margin:0;position:relative;aspect-ratio:3/4;overflow:hidden;border-radius:2px;background:var(--mist);clip-path:polygon(0 calc(100% - var(--ridge,112%)),12% calc(100% - var(--ridge,112%) + 6%),24% calc(100% - var(--ridge,112%) + 1%),38% calc(100% - var(--ridge,112%) + 9%),52% calc(100% - var(--ridge,112%) - 2%),66% calc(100% - var(--ridge,112%) + 7%),80% calc(100% - var(--ridge,112%) + 2%),100% calc(100% - var(--ridge,112%) + 8%),100% 100%,0 100%)}
.ap-photo img{width:100%;height:100%;object-fit:contain;display:block}
.ap-title{margin-top:18px}
.ap-copy .intro{margin:28px 0 0;font-size:21px;line-height:1.5;max-width:560px}
.pv-chips{list-style:none;margin:30px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px}
.pv-chips li{font:italic 400 22px/1.3 var(--serif);color:var(--deep)}

.ap-form{padding:clamp(56px,7vw,96px) var(--gutter) var(--pad);max-width:860px}
.ap-note{margin:16px 0 0;font-size:14px;color:var(--muted)}
@media (max-width:900px){.ap-grid{grid-template-columns:1fr}.ap-photo{max-width:520px}}

/* ---------- Quote ---------- */
.pv-quote{background:var(--snow);color:var(--ink);padding:var(--pad) 0;text-align:center}
.pv-quote .eyebrow{margin-bottom:28px}
.pv-quote .q-words{margin:0 auto;max-width:1200px;font:400 clamp(52px,7.6vw,132px)/.92 var(--display);text-transform:uppercase}
.pv-quote .q-words #quote-accent{display:block;font:italic 400 .82em/1 var(--serif);text-transform:none;color:var(--steel);margin-top:.12em}

/* ---------- 06 Shop rail ---------- */
.pv-shop{background:var(--air);color:var(--ink);padding:var(--pad) 0}
.drag-hint{display:flex;align-items:center;gap:12px;font:500 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.drag-hint i{width:42px;height:1px;background:currentColor}
.rail{display:flex;gap:18px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:48px var(--gutter) 24px;scrollbar-width:none;cursor:grab}
.rail::-webkit-scrollbar{display:none}
.rail.dragging{cursor:grabbing;scroll-snap-type:none}
.rail.dragging a{pointer-events:none}
.rail .tile{flex:0 0 clamp(260px,28vw,420px);scroll-snap-align:start;border-radius:2px;background:var(--glacier);transform:perspective(900px) rotateY(var(--ry,0deg)) rotateX(var(--rx,0deg));transition:transform .5s var(--ease)}
.rail .tile img{aspect-ratio:4/5}
.rail .tile .info{background:none;color:var(--ink);position:static;padding:16px 4px 0;display:flex}
.rail .tile h3{font-size:28px}
.rail .tile .add{top:14px;right:14px}
.rail .state{margin:0 var(--gutter)}
@media (max-width:900px){.rail .tile{flex-basis:78vw}}

/* ---------- 07 Community ---------- */
.pv-duo .events{padding:var(--pad) var(--gutter)}
.pv-duo .donate{padding:var(--pad) var(--gutter)}

/* ---------- Footer / base camp ---------- */
.pv-foot{padding-top:0}
.foot-marquee{overflow:hidden;padding:clamp(48px,7vw,96px) 0 0;color:var(--snow)}
.foot-marquee .band-row{font-size:clamp(90px,16vw,280px)}
.pv-foot-logo{display:block;width:clamp(110px,13vw,170px);height:auto;margin:56px auto 64px;-webkit-mask:linear-gradient(0deg,#000 40%,transparent 60%) 0 0/100% 250% no-repeat;mask:linear-gradient(0deg,#000 40%,transparent 60%) 0 0/100% 250% no-repeat;transition:-webkit-mask-position 1.6s var(--ease),mask-position 1.6s var(--ease)}
.pv-foot-logo.on{-webkit-mask-position:0 100%;mask-position:0 100%}
.pv-foot .legal span:last-child{font:500 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase}


/* ---------- Hero integration: sun, light wrap and a haze that seats Brady in the scene ---------- */
.sun{position:absolute;z-index:0;left:44%;top:78px;translate:-50% -50%;width:min(52vw,720px);aspect-ratio:1;pointer-events:none;background:radial-gradient(circle,rgba(255,255,255,1) 0 2.6%,rgba(255,252,240,.75) 5%,rgba(255,248,230,.32) 13%,rgba(207,225,239,0) 46%);animation:sunPulse 9s ease-in-out infinite alternate}
.sun::after{content:"";position:absolute;inset:-25%;background:conic-gradient(from 205deg,transparent 0 8deg,rgba(255,255,255,.22) 10deg,transparent 14deg 64deg,rgba(255,255,255,.14) 67deg,transparent 71deg 150deg,rgba(255,255,255,.16) 153deg,transparent 157deg 250deg,rgba(255,255,255,.12) 253deg,transparent 257deg);-webkit-mask:radial-gradient(circle,#000 6%,transparent 52%);mask:radial-gradient(circle,#000 6%,transparent 52%);animation:sunSpin 120s linear infinite}
@keyframes sunPulse{to{opacity:.82;scale:1.05}}
@keyframes sunSpin{to{rotate:360deg}}
.brady{filter:drop-shadow(0 0 26px rgba(225,236,245,.75)) drop-shadow(0 28px 54px rgba(11,28,44,.2))}
.brady-haze{position:absolute;z-index:3;left:0;right:0;bottom:0;height:24%;pointer-events:none;background:linear-gradient(180deg,rgba(238,243,246,0) 0%,rgba(232,239,244,.5) 45%,rgba(238,243,246,.92) 85%,var(--air) 100%)}
.pv-hero-copy,.descend{z-index:4}
@media (max-width:900px){
  .sun{left:28%;top:86px;width:110vw}
  .brady-haze{position:relative;inset:auto;height:22vw;margin-top:-22vw;flex:none}
}

/* ---------- Color rhythm: steel band, night quote ---------- */
.pv-map,.pv-shop{position:relative}
.pv-band{background:var(--deep)}
.pv-band .band-row:first-child{color:var(--snow)}
.pv-band .band-row:first-child .hw-dot{color:var(--ice)}
.pv-band .band-alt{-webkit-text-stroke-color:rgba(243,245,246,.5)}
.pv-band .band-alt .hw-dot{color:var(--snow)}
.pv-quote{background:var(--night);color:var(--snow)}
.pv-quote .pv-topo{opacity:.6}
.pv-quote .wrap{position:relative;z-index:1}
.pv-quote .eyebrow{color:var(--ice)}
.pv-quote .q-mark{display:block;height:.38em;margin:0 auto .04em;font:italic 400 clamp(240px,30vw,460px)/.78 var(--serif);color:var(--ice);opacity:.95}
/* the italic quote mark carries its ink right of its box: pull it back to the true centre */
.pv-quote .q-mark{position:relative;left:-.036em}
.pv-quote .q-words{color:var(--snow)}
.pv-quote .q-words #quote-accent{color:var(--ice)}
.pv-quote .ink-words .iw{color:rgba(243,245,246,.16)}
.pv-quote .ink-words .iw.on{color:inherit}

/* ---------- Mantra: shorter pin, the four lines assemble at the end ---------- */
.pv-mantra{height:300vh}
.m-lines.all li{grid-area:auto;animation:mAssemble .85s var(--ease) both}
.m-lines.all li:nth-child(2){animation-delay:.09s}
.m-lines.all li:nth-child(3){animation-delay:.18s}
.m-lines.all li:nth-child(4){animation-delay:.27s}
@keyframes mAssemble{from{clip-path:inset(0 0 100% 0);translate:0 40%}to{clip-path:inset(0 0 -10% 0);translate:0 0}}
.m-lines.all li{font-size:clamp(52px,7.4vw,140px);white-space:nowrap}
@media (max-width:900px){.m-lines.all li{font-size:11.6vw}}

/* ---------- Scholarship: values first, the form lives in a side panel ---------- */
.pv-apply2{background:var(--snow);color:var(--ink);padding:var(--pad) 0}
.ap2-head{max-width:1100px}
.ap2-head .pv-h2{margin-top:16px}
.ap2-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(40px,6vw,104px);align-items:center;margin-top:clamp(40px,5vw,72px)}
.ap2-photo{margin:0;overflow:hidden;border-radius:2px;aspect-ratio:3/4;background:var(--glacier)}
.ap2-photo img{display:block;width:100%;height:100%;object-fit:cover;scale:calc(1.14 - var(--ap,1)*.14);transform-origin:50% 60%}
.ap2-intro{margin:0;font-size:21px;line-height:1.55;max-width:580px;color:#1F3A52}
.ap2-label{margin:44px 0 0;font:500 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.ap2-values{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:40px}
.ap2-values li{display:flex;align-items:baseline;gap:16px;padding:20px 0;border-top:1px solid rgba(11,28,44,.14);font:400 clamp(22px,2.1vw,32px)/1.05 var(--display);text-transform:uppercase}
.ap2-values li span{flex:none;min-width:24px;font:500 12px/1 var(--mono);letter-spacing:.14em;color:var(--steel)}
.ap2-cta{margin-top:40px;display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}
.ap2-cta .btn{min-height:60px;padding:0 34px;font-size:17px}
.ap2-cta .ap-note{margin:0;max-width:300px}
#apply-drawer{width:min(580px,100%)}
.ap2-head .pv-h2 em{display:block}
#apply-drawer .kicker{color:var(--muted)}
#apply-drawer .progress{background:rgba(11,28,44,.12)}
#apply-drawer .progress i{background:var(--ink)}
@media (max-width:900px){
  .ap2-grid{grid-template-columns:1fr}
  .ap2-photo{max-width:560px}
  .ap2-values{grid-template-columns:1fr}
  .ap2-cta .btn{width:100%}
}

/* ---------- Shop rail in motion ---------- */
.rail.auto{scroll-snap-type:none}
/* ---------- Moments: past GTL events (one calm row, equal heights, no crops) ---------- */
.pv-moments{background:var(--midnight);color:var(--snow);padding:var(--pad) 0}
.pv-moments .pv-h2{color:var(--snow)}
.pv-moments .pv-h2 em{color:var(--ice)}
.mo-row{display:flex;gap:12px;margin-top:clamp(40px,5vw,64px);align-items:flex-start}
.mo-group{flex:var(--ar) 1 0;min-width:0;margin:0}
.mo-pair-row{display:flex;gap:12px}
.mo-pair-row .mo-zoom{flex:var(--ar) 1 0;min-width:0}
.mo-zoom{display:block;width:100%;padding:0;border:0;background:var(--night);border-radius:2px;overflow:hidden;cursor:zoom-in}
.mo-zoom img{display:block;width:100%;height:auto;transition:opacity .4s var(--ease)}
.mo-group figcaption{margin-top:14px;font:500 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mist)}
@media (max-width:900px){
  .mo-row{flex-direction:column;gap:28px}
  .mo-group{flex:none;width:100%}
  .mo-pair-row{gap:8px}
}

/* Hover grows the photo (mouse only); it scales toward the inside of the page and dims its neighbours */
@media (hover:hover) and (pointer:fine){
  .mo-zoom{position:relative;z-index:1;cursor:default;transform-origin:50% 50%;transition:transform .6s var(--ease),box-shadow .6s var(--ease)}
  .mo-row>.mo-group:first-child .mo-zoom{transform-origin:0 50%}
  .mo-pair-row .mo-zoom:last-child{transform-origin:100% 50%}
  .mo-zoom:hover{z-index:5;transform:scale(1.45);box-shadow:0 30px 80px rgba(0,0,0,.55);transition-delay:.1s}
  .mo-row:has(.mo-zoom:hover) .mo-zoom:not(:hover) img{opacity:.35}
}
/* Full-screen view (tap on phones, click anywhere) */
.mo-lb{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:clamp(16px,4vw,48px);background:rgba(6,12,22,.94);animation:moFade .35s var(--ease)}
.mo-lb[hidden]{display:none}
.mo-lb-panel{position:relative;margin:0;outline:0;max-width:100%;max-height:100%;display:flex;flex-direction:column;align-items:center}
.mo-lb-panel img{display:block;max-width:100%;max-height:calc(100vh - 120px);max-height:calc(100dvh - 120px);width:auto;height:auto;border-radius:2px}
.mo-lb-panel figcaption{margin-top:16px;font:500 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mist)}
.mo-lb-x{position:fixed;top:14px;right:14px;width:44px;height:44px;border:1px solid rgba(255,255,255,.25);border-radius:50%;background:transparent;color:var(--snow);font-size:24px;line-height:1;cursor:pointer}
@keyframes moFade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.mo-zoom:hover{transform:none}.mo-lb{animation:none}}

/* ---------- Loader: the official logo assembles from its own layers (outline, mountain, letters) ---------- */
@property --il-sw{syntax:'<angle>';inherits:false;initial-value:180deg}
html.intro-on #intro{animation:introOut .8s var(--ease) 3s forwards}
#intro .il{position:relative;width:clamp(140px,17vw,210px);aspect-ratio:891/963;animation:ilGlow 1.4s var(--ease) 1.75s both}
#intro .il img{position:absolute;inset:0;width:100%;height:100%;-webkit-mask:none;mask:none;animation:none}
#intro .il .il-ring{-webkit-mask:conic-gradient(from 180deg at 50% 54%,#000 0 var(--il-sw),transparent var(--il-sw) calc(360deg - var(--il-sw)),#000 calc(360deg - var(--il-sw)));mask:conic-gradient(from 180deg at 50% 54%,#000 0 var(--il-sw),transparent var(--il-sw) calc(360deg - var(--il-sw)),#000 calc(360deg - var(--il-sw)));animation:ilSweep 1.15s cubic-bezier(.65,0,.35,1) .15s both}
#intro .il .il-mtn{animation:ilRise .85s var(--ease) .8s both}
#intro .il .il-t{animation:ilDrop .75s var(--ease) 1.1s both}
#intro .il .il-g{animation:ilLeft .75s var(--ease) 1.22s both}
#intro .il .il-l{animation:ilRight .75s var(--ease) 1.22s both}
#intro p{letter-spacing:.34em;animation:ilTag 1s var(--ease) 1.7s both}
@keyframes ilSweep{from{--il-sw:0deg}to{--il-sw:180deg}}
@keyframes ilRise{from{clip-path:inset(82% 0 0 0);transform:translateY(5%)}to{clip-path:inset(0 0 0 0);transform:none}}
@keyframes ilDrop{from{opacity:0;transform:translateY(-14%);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes ilLeft{from{opacity:0;transform:translateX(-10%);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes ilRight{from{opacity:0;transform:translateX(10%);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes ilGlow{0%,100%{filter:drop-shadow(0 0 0 rgba(160,200,235,0))}45%{filter:drop-shadow(0 0 22px rgba(160,200,235,.55))}}
@keyframes ilTag{from{opacity:0;letter-spacing:.75em}to{opacity:1;letter-spacing:.34em}}
/* ---------- Loader exit: a skier carves down the screen and the cut opens onto the page ---------- */
html.intro-on #intro{animation:introOut .8s var(--ease) 6s forwards}
html.intro-on #intro.il-cv-on{background:transparent}
#intro .il-cv{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#intro .il-sk{position:absolute;left:0;top:0;height:auto;opacity:0;pointer-events:none;will-change:transform;z-index:2}
#intro .il-geo{position:absolute;width:0;height:0;overflow:hidden}
#intro .il,#intro p{position:relative;z-index:1}
#intro.il-leave .il,#intro.il-leave p{opacity:0;transform:scale(.96);transition:opacity .35s var(--ease),transform .35s var(--ease)}
/* ---------- Separators: drawn asterisk instead of a text glyph (iOS/macOS turn it into a green emoji) ---------- */
html{font-variant-emoji:text}
.hw-dot .dot-ico{display:inline-block;width:.92em;height:.92em;vertical-align:-.035em;position:relative;top:.06em;fill:none;stroke:currentColor;stroke-width:1.15;stroke-linecap:butt;overflow:visible}
.pv-chips li::before{content:"";display:inline-block;width:10px;height:10px;margin-right:8px;background:var(--steel);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5v19M2.5 12h19M5.3 5.3l13.4 13.4M18.7 5.3 5.3 18.7' stroke='%23000' stroke-width='2.4' stroke-linecap='round' fill='none'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5v19M2.5 12h19M5.3 5.3l13.4 13.4M18.7 5.3 5.3 18.7' stroke='%23000' stroke-width='2.4' stroke-linecap='round' fill='none'/%3E%3C/svg%3E") center/contain no-repeat}

/* ---------- Phone polish (desktop untouched) ---------- */
@media (max-width:900px){
  /* Story: chapter text fades under the pinned photo instead of being cut */
  .st-media::after{content:"";position:absolute;left:0;right:0;top:100%;height:32px;background:linear-gradient(to bottom,var(--snow),rgba(243,245,246,0));pointer-events:none}
  /* Donate: readable label on the blue panel */
  .pv-duo .donate .eyebrow{color:rgba(255,255,255,.8)}
  /* Comfortable tap targets */
  .pv-foot nav a{display:inline-block;padding:11px 0}
  .pv-foot .handle{display:inline-block;padding:6px 0}
  .pv-map .maplibregl-ctrl-group button{width:40px;height:40px}
}

/* ---------- Shop the drop: link to the full shop ---------- */
.pv-shop-cta{display:flex;margin-top:clamp(28px,3.5vw,48px)}
.pv-shop-cta .btn span{transition:transform .3s var(--ease)}
.pv-shop-cta .btn:hover span{transform:translateX(4px)}

/* ---------- Drop tiles: show the whole product ---------- */
.rail .tile img[data-edge]{object-fit:contain;background:#EEF1F3}

/* ---------- Story: chapter copy keeps its paragraph breaks (CMS line breaks) ---------- */
.st-ch .body{white-space:pre-line}

/* ---------- GTL Rocks: take the energy, pass it on ---------- */
.pv-rocks{background:var(--sky);color:var(--ink);padding:var(--pad) 0}
.rk-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(40px,7vw,120px);align-items:center}
.rk-media{margin:0;max-width:520px}
.rk-media img{display:block;width:100%;height:auto;border-radius:2px;box-shadow:0 30px 60px -30px rgba(11,28,44,.45)}
.rk-copy{max-width:600px}
.rk-kicker{margin:0 0 24px;font:500 12px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--deep)}
.rk-title{color:var(--ink);font-size:clamp(52px,6vw,104px)}
.rk-title em{display:block;color:var(--deep)}
.rk-body{margin-top:clamp(24px,3vw,36px)}
.rk-body p{margin:0 0 14px;font-size:clamp(18px,1.4vw,20px);line-height:1.6;color:#2A4157}
.rk-cta{margin-top:clamp(20px,2.4vw,30px)}
.rk-cta svg{transition:transform .3s var(--ease)}
.rk-cta:hover svg{transform:translateY(2px)}
.rk-note{margin:14px 0 0;font-size:14px;color:var(--muted)}
.rk-copy.rise{transition-delay:.12s}
@media (max-width:900px){
  .rk-grid{grid-template-columns:minmax(0,1fr);gap:36px}
  .rk-media{max-width:440px;order:2}
  .rk-copy{order:1}
  .rk-cta{width:100%}
}


/* ---------- GTL Rocks: transparent cutout on the section colour, drifting with the scroll (parallax) ---------- */
.rk-media img{box-shadow:none;border-radius:0;filter:drop-shadow(0 28px 34px rgba(11,28,44,.28));will-change:transform}
/* ---------- Grain + reduced motion ---------- */
.pv-body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:80;opacity:.05;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")}
@media (prefers-reduced-motion:reduce){
  .pv-mantra{height:auto}
  .m-pin{position:relative;height:auto;padding:var(--pad) 0}
  .m-lines{display:block}
  .m-lines li{clip-path:none!important;translate:none!important}
  .m-bar,.m-count{display:none}
  .pv-polaroid{rotate:-2deg;translate:none;opacity:1}
  .ap-photo{clip-path:none}
  .ink-words .iw{color:inherit}
  .pv-foot-logo{-webkit-mask:none;mask:none}
  .way span{opacity:1;transform:none}
}

/* ---------- Nov 13 updates ---------- */

/* 01 · the G of "Get to living" in dark blue */
.hw-a .g1{color:var(--navy)}

/* 02 · faded mountain with ski trails behind the hero */
.pv-hero .pv-topo{opacity:.18}
.hero-mtn{position:absolute;left:0;right:0;bottom:0;width:100%;height:100%;z-index:0;pointer-events:none}
.hero-mtn .mtn-trails{opacity:.75}
.hero-mtn .mtn-heads{opacity:.7}
@media (max-width:900px){.hero-mtn{top:0;bottom:auto;height:min(150vw,100%)}}
.hero-mtn .tr-m path{stroke-dasharray:1 1;stroke-dashoffset:1}
.pv-ready .hero-mtn .tr-m path{animation:mtnDraw 2.6s var(--ease) .7s forwards}
@keyframes mtnDraw{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.hero-mtn .tr-m path,.pv-ready .hero-mtn .tr-m path{animation:none;stroke-dashoffset:0}}

/* 10-11 · map introduction: comfortable measure */
.pv-map .pv-sec-head .map-intro{max-width:470px;line-height:1.6}

/* 13 · Showing up together: room for a short description under each item, invisible while empty */
.mo-desc{margin:10px 0 0;max-width:46ch;color:var(--mist);font-size:15px;line-height:1.55}
.mo-desc:empty{display:none}

/* Share form · "Add photos" (up to 2) in place of the photo link */
.ph-pick{margin:4px 0 6px;padding:2px 0;border-radius:4px;transition:background .2s}
.ph-pick.drop{background:var(--glacier)}
.ph-row{display:flex;flex-wrap:wrap;gap:10px}
.ph-thumbs{display:contents}
.ph-thumb,.ph-add{position:relative;width:104px;height:104px;border-radius:4px;overflow:hidden}
.ph-thumb{background:#E8EEF2;border:1px solid #9FB0BF}
.ph-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.ph-thumb.noprev img{display:none}
.ph-name{position:absolute;inset:8px 8px 30px;font-size:12px;line-height:1.3;color:var(--muted);word-break:break-all;overflow:hidden}
.ph-x{position:absolute;top:4px;right:4px;width:32px;height:32px;border:0;border-radius:50%;background:rgba(11,28,44,.78);color:#fff;font-size:20px;line-height:1;cursor:pointer}
.ph-x:focus-visible{outline:2px solid #fff;outline-offset:-4px}
.ph-add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border:1px dashed var(--ink);background:#fff;color:var(--ink);font-size:14px;font-weight:500;cursor:pointer;margin:0}
.ph-add:hover{background:var(--glacier)}
.ph-add:focus-within{outline:2px solid var(--deep);outline-offset:2px}
.ph-add input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.ph-add.off{display:none}

/* Map · a card with a single photo shows it whole (no one cropped out) */
.adv-card .gal.one img:first-child{height:auto;max-height:360px}

/* Hero copy: a soft wash of the sky behind the text (from the "In memory of Brady" line down) so the outline words, the star and the trail fade out; the big title above is untouched (desktop) */
@media (min-width:901px){
  .pv-hero-copy{isolation:isolate}
  .pv-hero-copy::before{content:"";position:absolute;z-index:-1;left:-150px;right:-30px;top:-6px;bottom:-70px;pointer-events:none;background:radial-gradient(farthest-side at 42% 38%,rgba(236,242,246,.94) 0%,rgba(236,242,246,.86) 55%,rgba(236,242,246,.5) 78%,rgba(236,242,246,0) 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 10px);mask-image:linear-gradient(to bottom,transparent 0,#000 10px)}
}

/* Upcoming events on phones: the date on its own line, so the event name and place are not squeezed */
@media (max-width:600px){.ev{flex-wrap:wrap;gap:8px 16px}.ev .when{flex:0 0 100%;min-width:0}.ev .what{min-width:0}}

/* Upcoming events: the event poster, whole, above its row */
.ev:has(.ev-img){flex-wrap:wrap}
.ev .ev-img{display:block;flex:0 0 100%;max-width:360px}
.ev .ev-img img{display:block;width:100%;height:auto;border-radius:3px;box-shadow:0 14px 30px rgba(11,28,44,.18)}
