/* International Media Festival of the Palm Beaches · landing page */
@font-face{font-family:Gloock;src:url(../fonts/gloock-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Work Sans";src:url(../fonts/worksans-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Work Sans";src:url(../fonts/worksans-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Work Sans";src:url(../fonts/worksans-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Lora;src:url(../fonts/lora-400i.woff2) format("woff2");font-style:italic;font-weight:400;font-display:swap}

:root{
  --paper:#fff; --tint:#F4F8F9; --rule:#E3E8EB; --rule2:#EEF1F3;
  --ink:#12454F; --body:#4E5F68; --muted:#7F8D93;
  --teal:#0B7C93; --pink:#D6336C; --coral:#EE5A6A; --amber:#F5A623; --amberInk:#B87809;
  --blue:#2D9CDB; --green:#2EAF62; --gold:#B8893A; --violet:#9655E0;
  --rainbow:linear-gradient(90deg,#F7C948,#F5A927,#F26E57,#E3456D,#C63B8B,#9655E0,#4989DC,#29A7D6);
  --serif:Gloock,Georgia,serif; --sans:"Work Sans",system-ui,-apple-system,"Segoe UI",sans-serif; --ital:Lora,Georgia,serif;
  --wrap:1180px; --gut:clamp(20px,5vw,56px);
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--body);font:400 17px/1.65 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--teal)}
b,strong{color:var(--ink);font-weight:600}
h1,h2,h3{font-family:var(--serif);font-weight:400;color:var(--ink);margin:0;letter-spacing:-.005em}
h2{font-size:clamp(34px,5.2vw,64px);line-height:1.04}
h3{font-size:clamp(22px,2.4vw,28px);line-height:1.15}
p{margin:0 0 1em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--ink);color:#fff;padding:8px 14px;border-radius:4px}
.skip:focus{left:8px}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--pink);margin:0 0 14px}
.kicker{display:flex;align-items:center;gap:12px;font-size:12px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--teal);margin:0 0 18px}
.kicker span{font-family:var(--serif);font-size:18px;letter-spacing:0;color:var(--pink)}
.kicker:after{content:"";width:60px;height:1px;background:var(--rule)}
.sub{font-family:var(--ital);font-style:italic;color:var(--pink);font-size:clamp(18px,2vw,22px);line-height:1.4;margin:14px 0 0}
.lead{font-size:clamp(17px,1.6vw,20px);line-height:1.7}
.sec-head{max-width:780px;margin-bottom:clamp(40px,6vw,72px)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 26px;border-radius:40px;font:600 14px/1 var(--sans);letter-spacing:.06em;text-decoration:none;cursor:pointer;border:0;transition:transform .3s var(--ease),box-shadow .3s,background .3s}
.btn.primary{background:var(--ink);color:#fff;box-shadow:0 10px 30px rgba(18,69,79,.22)}
.btn.primary:hover{transform:translateY(-2px);box-shadow:0 14px 36px rgba(18,69,79,.3)}
.btn.ghost{background:rgba(255,255,255,.75);color:var(--ink);border:1px solid var(--rule);backdrop-filter:blur(6px)}
.btn.ghost:hover{background:#fff;transform:translateY(-2px)}
.btn:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--blue);outline-offset:3px}

/* progress + nav */
.progress{position:fixed;inset:0 0 auto 0;height:4px;z-index:60;background:rgba(255,255,255,.4)}
.progress span{display:block;height:100%;width:100%;background:var(--rainbow);transform-origin:0 50%;transform:scaleX(0)}
.nav{position:fixed;top:4px;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:14px var(--gut);transition:background .4s,box-shadow .4s,padding .4s}
.nav.solid{background:rgba(255,255,255,.92);backdrop-filter:blur(12px);box-shadow:0 1px 0 var(--rule2);padding:10px var(--gut)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font:600 14px/1 var(--sans);letter-spacing:.24em;opacity:0;transform:translateY(-6px);transition:.4s var(--ease)}
.nav.solid .brand{opacity:1;transform:none}
.brand img{width:44px;height:auto}
.nav ul{list-style:none;display:flex;gap:30px;margin:0;padding:0;align-items:center}
.nav ul a{color:var(--ink);text-decoration:none;font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;position:relative}
.nav ul a:not(.pill):after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--rainbow);transform:scaleX(0);transform-origin:0;transition:transform .35s var(--ease)}
.nav ul a:hover:after,.nav ul a.active:after{transform:scaleX(1)}
.nav ul a.pill{background:var(--ink);color:#fff;padding:10px 18px;border-radius:30px}
.menu-btn{display:none}

/* reveal */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}.d4{transition-delay:.32s}.d5{transition-delay:.4s}

/* 1 hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;padding:96px var(--gut) 80px}
.hero-bg{position:absolute;inset:-8% 0 -8% 0;background-size:cover;background-position:62% 60%;will-change:transform;transform:scale(1.08)}
.hero-wash{position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.9) 38%,rgba(255,255,255,.3) 70%,rgba(255,255,255,0) 100%),linear-gradient(0deg,#fff 0%,rgba(255,255,255,0) 28%)}
.hero-inner{position:relative;z-index:2;max-width:var(--wrap);width:100%;margin:0 auto}
.hero-logo{width:clamp(120px,12vw,170px);height:auto;margin-bottom:clamp(18px,3vw,30px)}
.hero h1{font-size:clamp(54px,9vw,118px);line-height:.95;letter-spacing:-.015em}
.tagline{font-family:var(--ital);font-style:italic;color:var(--pink);font-size:clamp(19px,2.2vw,26px);line-height:1.4;max-width:600px;margin:22px 0 0}
.hero-dates{display:flex;flex-wrap:wrap;gap:14px;margin-top:clamp(24px,3vw,34px)}
.chip{background:rgba(255,255,255,.94);border:1px solid var(--rule);border-left:4px solid var(--c);border-radius:6px;padding:14px 20px 15px;min-width:220px;box-shadow:0 10px 30px rgba(18,69,79,.08)}
.chip span{display:block;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--c)}
.chip b{display:block;font:400 26px/1.15 var(--serif);color:var(--ink);margin-top:4px}
.chip i{font-family:var(--ital);color:var(--pink);font-size:14px}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.scroll-cue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);width:26px;height:42px;border:2px solid var(--ink);border-radius:14px;z-index:3;opacity:.6}
.scroll-cue span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--ink);animation:cue 1.8s infinite}
@keyframes cue{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(14px)}}

/* ribbons background */
.ribbons{position:absolute;inset:-10% -10%;background:url(../img/ribbons.svg) center/cover no-repeat;opacity:.9;animation:drift 26s ease-in-out infinite alternate;pointer-events:none}
@keyframes drift{from{transform:translate3d(-2%,0,0) rotate(-1deg)}to{transform:translate3d(2%,-2%,0) rotate(1deg)}}

/* 2 converge */
.converge{position:relative;background:var(--tint)}
.converge-track{height:240vh}
.converge-stage{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;align-items:center;justify-content:center}
.orbit{position:absolute;inset:0}
.orbit .w{position:absolute;left:50%;top:50%;font:400 clamp(26px,4.4vw,58px)/1 var(--serif);color:var(--c);white-space:nowrap;will-change:transform,opacity;transform:translate(-50%,-50%)}
.converge-core{position:relative;z-index:2;max-width:760px;text-align:center;padding:0 var(--gut);opacity:0;transform:scale(.94);will-change:opacity,transform}
.converge-core .kicker{justify-content:center}
.converge-core .kicker:after{display:none}
.converge-core h2 em{font-family:var(--ital);font-style:italic;color:var(--pink);font-size:.62em;line-height:1.3;display:inline-block;margin-top:10px}
.converge-core .lead{margin-top:26px}

/* 3 season */
.season{padding:clamp(90px,12vw,150px) 0}
.timeline{position:relative;height:96px;margin:0 0 54px}
.tl-band{position:absolute;left:0;right:0;top:20px;height:30px;border-radius:20px;background:linear-gradient(90deg,rgba(238,90,106,.12),rgba(11,124,147,.12));border:1px dashed rgba(11,124,147,.35)}
.tl-band span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--teal);white-space:nowrap}
.tl-line{position:absolute;left:0;right:0;top:34px;height:3px;background:var(--rule)}
.tl-line i{display:block;height:100%;background:var(--rainbow);transform-origin:0;transform:scaleX(0)}
.tl-months{position:absolute;left:0;right:0;top:66px;display:grid;grid-template-columns:repeat(7,1fr);list-style:none;margin:0;padding:0}
.tl-months li{text-align:center;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.tl-pin{position:absolute;top:16px;width:40px;height:40px;margin-left:-20px;border-radius:50%;border:4px solid #fff;display:flex;align-items:center;justify-content:center;color:#fff;font:400 16px/1 var(--serif);box-shadow:0 6px 18px rgba(18,69,79,.2);transform:scale(0);transition:transform .6s var(--ease)}
.tl-pin.on{transform:scale(1)}
.tl-pin.p1{left:calc(100%/14);background:var(--coral)}
.tl-pin.p2{left:calc(100%*11/14);background:var(--teal)}
.moments{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.moment{border:1px solid var(--rule);border-top:5px solid var(--c);border-radius:0 0 10px 10px;padding:32px 34px 30px;background:#fff;box-shadow:0 18px 50px rgba(18,69,79,.07);transition:transform .5s var(--ease),box-shadow .5s}
.moment:hover{transform:translateY(-6px);box-shadow:0 26px 60px rgba(18,69,79,.12)}
.moment .eyebrow{color:var(--c)}
.moment h3{font-size:clamp(32px,3.6vw,46px)}
.moment .where{font-family:var(--ital);font-style:italic;color:var(--pink);font-size:18px;margin:4px 0 18px;padding-bottom:18px;border-bottom:1px solid var(--rule2)}

/* 4 program */
.program{padding:clamp(80px,10vw,130px) 0;background:linear-gradient(180deg,#fff 0%,var(--tint) 100%)}
.themes{display:flex;gap:16px;height:min(64vh,560px)}
.theme{position:relative;flex:1;min-width:0;border:0;padding:0;border-radius:10px;overflow:hidden;cursor:pointer;text-align:left;background:var(--ink);color:#fff;transition:flex 1s var(--ease),opacity .9s var(--ease),transform .9s var(--ease);font:inherit}
.theme .ph{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform 1.4s var(--ease)}
.theme:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,69,79,0) 30%,rgba(10,35,42,.88) 100%)}
.theme:before{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--c);z-index:3}
.theme>span:not(.ph){position:absolute;left:24px;right:24px;z-index:2}
.theme .num{bottom:116px;font:400 20px/1 var(--serif);color:var(--c)}
.theme .tt{bottom:72px;font:400 clamp(22px,2.2vw,30px)/1.1 var(--serif)}
.theme .tx{bottom:-200px;font-size:15px;line-height:1.55;color:#DCEBEE;opacity:0;transition:bottom .7s var(--ease),opacity .5s}
.theme.open,.theme:hover{flex:2.4}
.theme.open .ph,.theme:hover .ph{transform:scale(1.06)}
.theme.open .num,.theme:hover .num{bottom:auto;top:24px}
.theme.open .tt,.theme:hover .tt{bottom:118px}
.theme.open .tx,.theme:hover .tx{bottom:26px;opacity:1}
.hint{margin-top:18px;font-size:13px;color:var(--muted);letter-spacing:.06em}

/* 5 different */
.different{padding:clamp(90px,12vw,150px) 0}
.isnot{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.row{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--rule)}
.row>span{padding:22px 0;font-size:clamp(17px,1.7vw,21px);line-height:1.4;position:relative}
.row .is{color:var(--ink);font-weight:500;padding-right:28px;padding-left:28px}
.row .is:before{content:"";position:absolute;left:4px;top:31px;width:10px;height:10px;border-radius:50%;background:var(--teal);transform:scale(0);transition:transform .5s var(--ease) .3s}
.row .not{color:var(--muted);padding-left:28px;border-left:1px solid var(--rule2);background:linear-gradient(var(--muted),var(--muted)) 28px 50%/0 1px no-repeat;transition:background-size .9s var(--ease),color .6s}
.row .not:before{content:"Not";display:block;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:2px}
.row.in .is:before{transform:scale(1)}
.row.in .not{background-size:calc(100% - 56px) 1px;color:#A9B4B8}
.row{opacity:0;transform:translateX(-24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.row.in{opacity:1;transform:none}
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:clamp(60px,8vw,96px)}
.pillar{border-top:3px solid var(--c);padding-top:20px}
.pillar .ro{font:400 20px/1 var(--serif);color:var(--c)}
.pillar h3{margin:8px 0 10px}
.pillar p{font-size:15px;line-height:1.6;margin:0}

/* 6 join */
.join{position:relative;overflow:hidden;background:var(--ink);color:#D7E7EA;padding:clamp(90px,12vw,150px) 0}
.join .ribbons{opacity:.5}
.join:after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--rainbow)}
.join-grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(40px,6vw,90px);align-items:start}
.join h2{color:#fff}
.join .kicker{color:#F7C948}.join .kicker:after{background:rgba(255,255,255,.2)}
.join .lead{color:#D7E7EA;margin-top:22px}
.contacts{list-style:none;padding:0;margin:34px 0 0;border-top:1px solid rgba(255,255,255,.15)}
.contacts li{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.15)}
.contacts span{font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#9FC4CC}
.contacts a{color:#fff;text-decoration:none}
.contacts a:hover{text-decoration:underline}
.signup{background:#fff;color:var(--body);border-radius:12px;padding:clamp(24px,3.4vw,40px);box-shadow:0 30px 80px rgba(0,0,0,.25)}
.interests{border:0;padding:0;margin:0 0 20px;display:flex;flex-wrap:wrap;gap:8px}
.interests legend{font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--teal);margin-bottom:12px;padding:0}
.interests label{cursor:pointer}
.interests input{position:absolute;opacity:0;pointer-events:none}
.interests span{display:inline-block;padding:9px 16px;border:1px solid var(--rule);border-radius:30px;font-size:14px;font-weight:500;color:var(--ink);transition:.25s}
.interests input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff}
.interests input:focus-visible+span{outline:3px solid var(--blue);outline-offset:2px}
.field{margin-bottom:16px}
.field label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin-bottom:6px}
.field small{font-weight:400;color:var(--muted)}
.field input,.field textarea{width:100%;font:400 16px/1.4 var(--sans);color:var(--ink);padding:13px 14px;border:1px solid var(--rule);border-radius:8px;background:var(--tint);transition:border-color .2s,background .2s}
.field input:focus,.field textarea:focus{border-color:var(--teal);background:#fff;outline:none}
.hp{position:absolute;left:-9999px}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.5;margin:6px 0 22px;cursor:pointer}
.consent input{margin-top:3px;accent-color:var(--teal);width:16px;height:16px;flex:0 0 auto}
.signup .btn{width:100%;justify-content:center}
.form-status{margin:14px 0 0;font-size:14px;min-height:1.4em}
.form-status.ok{color:var(--green)}.form-status.err{color:var(--pink)}

/* footer */
.foot{padding:48px 0 56px;background:#fff}
.foot-grid{display:flex;gap:32px;align-items:center}
.foot-grid img{width:110px;height:auto}
.foot-line{font:400 24px/1.2 var(--serif);color:var(--ink);margin-bottom:8px}
.fine{font-size:13px;color:var(--muted);margin:0 0 4px;max-width:720px}

/* responsive */
@media (max-width:900px){
  body{font-size:16px}
  .menu-btn{display:flex;flex-direction:column;gap:6px;background:rgba(255,255,255,.9);border:1px solid var(--rule);border-radius:50%;width:46px;height:46px;align-items:center;justify-content:center;cursor:pointer;padding:0}
  .menu-btn span:not(.sr){width:18px;height:2px;background:var(--ink);transition:.3s}
  .menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(4px) rotate(45deg)}
  .menu-btn[aria-expanded="true"] span:nth-child(2){transform:translateY(-4px) rotate(-45deg)}
  .nav ul{position:fixed;inset:0;background:rgba(255,255,255,.98);flex-direction:column;justify-content:center;gap:28px;opacity:0;pointer-events:none;transition:opacity .35s}
  .nav ul.open{opacity:1;pointer-events:auto}
  .nav ul a{font-size:18px}
  .menu-btn{position:relative;z-index:2}
  .hero-wash{background:linear-gradient(180deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.88) 55%,rgba(255,255,255,.55) 80%,#fff 100%)}
  .hero-bg{background-position:70% 50%}
  .moments{grid-template-columns:1fr}
  .timeline{height:84px}
  .tl-band span{font-size:9px;letter-spacing:.14em}
  .themes{flex-direction:column;height:auto}
  .theme{flex:none;height:220px;transition:height .8s var(--ease),opacity .9s var(--ease),transform .9s var(--ease)}
  .theme.open,.theme:hover{flex:none;height:340px}
  .pillars{grid-template-columns:1fr 1fr}
  .join-grid{grid-template-columns:1fr}
  .foot-grid{flex-direction:column;align-items:flex-start}
}
@media (max-width:560px){
  .row{grid-template-columns:1fr}
  .row .is{padding:18px 0 8px 24px}
  .row .not{border-left:0;padding:0 0 18px 24px;background-position:24px 70%}
  .row .is:before{top:26px}
  .row.in .not{background-size:calc(100% - 24px) 1px}
  .pillars{grid-template-columns:1fr}
  .chip{min-width:0;flex:1 1 100%}
  .tl-months li{font-size:10px;letter-spacing:.06em}
  .converge-track{height:200vh}
}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal,.row{opacity:1;transform:none}
  .converge-track{height:auto}
  .converge-stage{position:relative;height:auto;min-height:100svh;padding:120px 0}
  .orbit{display:none}
  .converge-core{opacity:1;transform:none}
}

/* ===== HERO v2 · cinematic intro + pinned scroll ===== */
.hero-track{position:relative;height:210vh}
.hero{position:sticky;top:0;height:100svh;min-height:600px;padding:90px var(--gut) 70px;display:flex;align-items:center;overflow:hidden}
.hero-bg{inset:0;transform:scale(1.18);transform-origin:62% 55%;animation:kb 2.8s var(--ease) both}
@keyframes kb{from{transform:scale(1.32);filter:saturate(.6)}to{transform:scale(1.18);filter:none}}
.hero-wash{transition:none}
.hero-shade{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 55%,rgba(10,35,42,.35) 0%,rgba(10,35,42,.72) 100%);opacity:0;pointer-events:none}
.hero-ribbon{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}
.hero-ribbon .rb{fill:none;stroke:url(#hr);stroke-linecap:round;stroke-dasharray:2200;stroke-dashoffset:2200;animation:draw 2.6s var(--ease) forwards}
.hero-ribbon .r1{stroke-width:3;opacity:.85;animation-delay:.2s}
.hero-ribbon .r2{stroke-width:1.8;opacity:.55;animation-delay:.45s}
.hero-ribbon .r3{stroke-width:1.1;opacity:.35;animation-delay:.7s}
@keyframes draw{to{stroke-dashoffset:0}}
.hero-inner{will-change:transform,opacity}
.hero-logo{width:clamp(110px,11vw,160px)}

/* staged intro */
.intro{opacity:0;transform:translateY(22px)}
.ready .intro{animation:rise 1s var(--ease) forwards}
.ready .i1{animation-delay:.15s}.ready .i2{animation-delay:.35s}
.ready .i3{animation-delay:1.45s}.ready .i4{animation-delay:1.7s}.ready .i5{animation-delay:1.9s}
@keyframes rise{to{opacity:1;transform:none}}

.hero-title{font-size:clamp(56px,10.5vw,148px);line-height:.92;letter-spacing:-.02em;margin:0}
.hero-title .ln{display:block;overflow:hidden;padding-bottom:.06em}
.hero-title .wd{display:inline-block;transform:translateY(110%);opacity:0}
.ready .hero-title .wd{animation:wordup 1.1s var(--ease) forwards;animation-delay:calc(.5s + var(--i) * .14s)}
@keyframes wordup{to{transform:none;opacity:1}}
.hero-title .lifestyle{background:linear-gradient(90deg,#12454F 0%,#12454F 45%,#E3456D 62%,#9655E0 78%,#29A7D6 100%);background-size:220% 100%;background-position:0 0;-webkit-background-clip:text;background-clip:text;color:transparent}
.ready .hero-title .lifestyle{animation:wordup 1.1s var(--ease) forwards,sheen 3.2s var(--ease) 1.6s forwards;animation-delay:calc(.5s + 3 * .14s),1.6s}
@keyframes sheen{to{background-position:100% 0}}

.rotator{font-family:var(--ital);font-style:italic;font-size:clamp(20px,2.4vw,30px);color:var(--ink);margin:22px 0 0;line-height:1.3}
.rot-box{display:inline-block;position:relative;vertical-align:bottom;overflow:hidden;height:1.3em;min-width:3.2em}
.rot{display:inline-block;color:var(--pink);font-weight:400;transition:transform .5s var(--ease),opacity .5s}
.rot.out{transform:translateY(-100%);opacity:0}
.rot.in0{transform:translateY(100%);opacity:0;transition:none}

.hero-statement{position:absolute;left:var(--gut);right:var(--gut);top:50%;transform:translateY(-40%);text-align:center;z-index:3;opacity:0;pointer-events:none}
.hero-statement p{margin:0;font-family:var(--serif);color:#fff;line-height:1.08;text-shadow:0 4px 30px rgba(0,0,0,.25)}
.hs1{font-size:clamp(30px,4.6vw,64px);max-width:1000px;margin:0 auto!important}
.hs2{font-family:var(--ital)!important;font-style:italic;font-size:clamp(22px,2.6vw,34px)!important;color:#F7C948!important;margin-top:22px!important}
.scroll-cue{z-index:4}

@media (max-width:900px){
  .hero-track{height:190vh}
  .hero{padding:84px var(--gut) 60px;align-items:flex-start}
  .hero-inner{margin-top:4vh}
  .hero-title{font-size:clamp(54px,15vw,92px)}
}
@media (prefers-reduced-motion:reduce){
  .hero-track{height:auto}
  .hero{position:relative;height:auto;min-height:100svh}
  .intro,.hero-title .wd{opacity:1;transform:none}
  .hero-ribbon .rb{stroke-dashoffset:0}
  .hero-statement{display:none}
}
.hero-shade{background:radial-gradient(ellipse at 50% 50%,rgba(18,69,79,.28) 0%,rgba(12,48,56,.66) 100%)}
@media (max-width:900px){.scroll-cue{display:none}}