/* ============================================================
   SCROLLKIT v1.0 - drop-in scroll animation sections
   Requires: GSAP 3 + ScrollTrigger (free, standard license)
   Fonts: Sora + Instrument Serif via Google Fonts (OFL)
   All styles scoped under .sk-* classes. Override via vars:
   ============================================================ */
:root{
  --sk-bg:#0b0b0e;
  --sk-bg2:#121218;
  --sk-ink:#f2f0ea;
  --sk-muted:#9b988f;
  --sk-accent:#d8ff4a;
  --sk-font:'Sora',system-ui,-apple-system,sans-serif;
  --sk-serif:'Instrument Serif',Georgia,serif;
  --sk-radius:22px;
}
[class*="sk-"]{box-sizing:border-box;}
.sk{position:relative;background:var(--sk-bg);color:var(--sk-ink);
  font-family:var(--sk-font);
  -webkit-font-smoothing:antialiased;}
.sk img{display:block;max-width:100%;}
.sk__tag{position:absolute;top:78px;left:28px;z-index:5;
  font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--sk-muted);font-weight:400;}
.sk__tag b{color:var(--sk-accent);font-weight:600;margin-right:.6em;}
.sk h1,.sk h2,.sk h3{margin:0;font-weight:700;line-height:1.02;
  letter-spacing:-.02em;}
.sk em{font-family:var(--sk-serif);font-style:italic;font-weight:400;
  letter-spacing:0;}

/* ---------- 01 pinned reveal ---------- */
.sk-pr{height:100vh;overflow:hidden;}
.sk-pr__pin{position:relative;height:100vh;display:grid;
  place-items:center;}
.sk-pr__media{position:absolute;inset:0;}
.sk-pr__media img{width:100%;height:100%;object-fit:cover;
  clip-path:inset(14% 14% 14% 14% round 28px);}
.sk-pr__title{position:relative;z-index:2;text-align:center;
  font-size:clamp(44px,8.5vw,124px);color:#fff;
  text-shadow:0 4px 60px rgba(0,0,0,.45);}
.sk-pr__title .ln{display:block;overflow:hidden;}
.sk-pr__title .ln>span{display:inline-block;transform:translateY(115%);}
.sk-pr__title em{color:var(--sk-accent);text-shadow:none;}

/* ---------- 02 text mask ---------- */
.sk-tm{min-height:120vh;display:grid;place-items:center;padding:14vh 5vw;}
.sk-tm h2{font-size:clamp(52px,11vw,170px);text-align:center;
  text-transform:uppercase;line-height:.94;font-weight:800;
  background-image:url('../assets/img/mist.jpg');
  background-size:cover;background-position:50% 0%;
  -webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent;}
.sk-tm p{grid-column:1/-1;color:var(--sk-muted);text-align:center;
  max-width:520px;margin:4vh auto 0;font-size:15px;line-height:1.7;}

/* ---------- 03 horizontal gallery ---------- */
.sk-h{overflow:hidden;}
.sk-h__head{padding:12vh 5vw 5vh;}
.sk-h__head h2{font-size:clamp(34px,5vw,72px);}
.sk-h__track{display:flex;gap:3vw;padding:0 5vw 12vh;
  width:max-content;will-change:transform;}
.sk-h__card{position:relative;width:min(62vw,760px);flex:none;}
.sk-h__card img{width:100%;height:min(58vh,540px);object-fit:cover;
  border-radius:var(--sk-radius);}
.sk-h__card figcaption{margin-top:14px;color:var(--sk-muted);
  font-size:13px;letter-spacing:.04em;}
.sk-h__card figcaption b{color:var(--sk-ink);display:block;
  font-size:17px;letter-spacing:0;margin-bottom:3px;}

/* ---------- 04 parallax layers ---------- */
.sk-px{height:100vh;overflow:hidden;}
.sk-px__stage{position:relative;height:100vh;overflow:hidden;}
.sk-px__layer{position:absolute;will-change:transform;}
.sk-px__layer img{border-radius:var(--sk-radius);object-fit:cover;
  box-shadow:0 30px 80px rgba(0,0,0,.5);}
.sk-px__l1{left:6%;top:14%;width:34vw;z-index:1;}
.sk-px__l1 img{width:100%;height:52vh;}
.sk-px__l2{right:8%;top:6%;width:28vw;z-index:2;}
.sk-px__l2 img{width:100%;height:64vh;}
.sk-px__l3{left:38%;bottom:-8%;width:26vw;z-index:3;}
.sk-px__l3 img{width:100%;height:44vh;}
.sk-px__title{position:absolute;z-index:4;left:50%;top:44%;
  transform:translate(-50%,-50%);text-align:center;
  font-size:clamp(38px,6.5vw,96px);width:90vw;
  text-shadow:0 4px 40px rgba(0,0,0,.6);}

/* ---------- 05 split pin ---------- */
.sk-sp{display:grid;grid-template-columns:1fr 1fr;}
.sk-sp__media{position:sticky;top:0;height:100vh;overflow:hidden;}
.sk-sp__media img{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;opacity:0;transition:opacity .6s ease;}
.sk-sp__media img.on{opacity:1;}
.sk-sp__items{padding:24vh 6vw 30vh;display:flex;flex-direction:column;
  gap:38vh;}
.sk-sp__item h3{font-size:clamp(26px,3vw,44px);margin-bottom:14px;}
.sk-sp__item p{color:var(--sk-muted);font-size:15px;line-height:1.75;
  max-width:42ch;}
.sk-sp__item .n{font-size:12px;color:var(--sk-accent);
  letter-spacing:.25em;display:block;margin-bottom:16px;}

/* ---------- 06 sticky cards ---------- */
.sk-cd{padding:14vh 5vw 22vh;}
.sk-cd__head{text-align:center;margin-bottom:10vh;}
.sk-cd__head h2{font-size:clamp(34px,5vw,72px);}
.sk-cd__card{position:sticky;background:var(--sk-bg2);
  border:1px solid rgba(255,255,255,.08);border-radius:28px;
  padding:56px 6vw;margin:0 auto 6vh;max-width:900px;
  display:grid;grid-template-columns:auto 1fr;gap:40px;
  align-items:center;box-shadow:0 -20px 60px rgba(0,0,0,.35);}
.sk-cd__card .big{font-size:clamp(40px,6vw,84px);font-weight:800;
  color:var(--sk-accent);line-height:1;}
.sk-cd__card h3{font-size:clamp(20px,2.4vw,32px);margin-bottom:10px;}
.sk-cd__card p{color:var(--sk-muted);font-size:15px;line-height:1.7;
  margin:0;}

/* ---------- 07 stats ---------- */
.sk-st{padding:20vh 5vw;text-align:center;}
.sk-st__row{display:flex;justify-content:center;gap:8vw;flex-wrap:wrap;}
.sk-st__num{font-size:clamp(56px,9vw,140px);font-weight:800;
  line-height:1;font-variant-numeric:tabular-nums;}
.sk-st__num sup{font-size:.35em;color:var(--sk-accent);
  vertical-align:super;}
.sk-st__lbl{color:var(--sk-muted);font-size:13px;letter-spacing:.18em;
  text-transform:uppercase;margin-top:14px;}

/* ---------- 08 zoom transition ---------- */
.sk-zm{height:100vh;}
.sk-zm__pin{position:relative;height:100vh;display:grid;
  place-items:center;overflow:hidden;}
.sk-zm__img{width:min(60vw,880px);will-change:transform;}
.sk-zm__img img{width:100%;height:min(56vh,520px);object-fit:cover;
  border-radius:32px;}
.sk-zm__cap{position:absolute;bottom:8vh;left:0;right:0;
  text-align:center;color:var(--sk-muted);font-size:14px;
  letter-spacing:.06em;}

/* ---------- 09 before/after scrub ---------- */
.sk-ba{height:100vh;}
.sk-ba__pin{position:relative;height:100vh;display:grid;
  place-items:center;}
.sk-ba__frame{position:relative;width:min(78vw,1080px);
  height:min(62vh,600px);border-radius:var(--sk-radius);
  overflow:hidden;}
.sk-ba__frame img{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;}
.sk-ba__top{clip-path:inset(0 0 0 0);will-change:clip-path;}
.sk-ba__line{position:absolute;top:0;bottom:0;left:0;width:2px;
  background:#fff;box-shadow:0 0 24px rgba(0,0,0,.6);
  will-change:left;}
.sk-ba__lab{position:absolute;top:20px;font-size:11px;
  letter-spacing:.2em;text-transform:uppercase;color:#fff;
  background:rgba(0,0,0,.45);padding:7px 12px;border-radius:100px;
  backdrop-filter:blur(6px);}
.sk-ba__lab--b{left:20px;}
.sk-ba__lab--a{right:20px;}

/* ---------- 10 batch reveal ---------- */
.sk-bt{padding:16vh 5vw 18vh;}
.sk-bt__head{display:flex;justify-content:space-between;
  align-items:end;margin-bottom:7vh;gap:20px;flex-wrap:wrap;}
.sk-bt__head h2{font-size:clamp(34px,5vw,72px);}
.sk-bt__head p{color:var(--sk-muted);max-width:34ch;font-size:15px;
  line-height:1.7;margin:0;}
.sk-bt__grid{display:grid;grid-template-columns:repeat(4,1fr);
  gap:18px;}
.sk-bt__cell{border-radius:18px;overflow:hidden;opacity:0;
  transform:translateY(50px);}
.sk-bt__cell img{width:100%;height:300px;object-fit:cover;
  transition:transform .8s cubic-bezier(.2,.6,.2,1);}
.sk-bt__cell:hover img{transform:scale(1.06);}
.sk-bt__cell:nth-child(4n+1){grid-row:span 2;}
.sk-bt__cell:nth-child(4n+1) img{height:100%;min-height:618px;}

/* ---------- 11 marquee ---------- */
.sk-mq{overflow:hidden;padding:9vh 0;border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);background:var(--sk-bg2);}
.sk-mq__inner{display:flex;width:max-content;
  animation:sk-mq 26s linear infinite;}
.sk-mq__inner span{font-size:clamp(28px,4.4vw,64px);font-weight:800;
  text-transform:uppercase;letter-spacing:-.01em;white-space:nowrap;
  padding:0 .5em;}
.sk-mq__inner .o{color:transparent;
  -webkit-text-stroke:1px rgba(242,240,234,.4);}
.sk-mq__inner i{font-style:normal;color:var(--sk-accent);
  padding:0 .2em;}
@keyframes sk-mq{to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){
  .sk-mq__inner{animation:none;}}

/* ---------- 12 curtain footer ---------- */
.sk-ct{clip-path:inset(0 0 0 0);height:92vh;}
.sk-ct__foot{position:fixed;inset:0;z-index:-1;display:grid;
  place-items:center;background:#08080a;text-align:center;padding:5vw;}
.sk-ct__foot h2{font-size:clamp(40px,7vw,110px);}
.sk-ct__foot h2 em{color:var(--sk-accent);}
.sk-ct__foot p{color:var(--sk-muted);margin:3vh 0;font-size:15px;}
.sk-ct__btn{display:inline-block;background:var(--sk-accent);
  color:#0b0b0e;font-weight:700;font-size:15px;padding:16px 34px;
  border-radius:100px;text-decoration:none;
  transition:transform .3s ease;}
.sk-ct__btn:hover{transform:scale(1.05);}
.sk-ct__fine{margin-top:5vh;font-size:12px;color:#55534d;
  letter-spacing:.05em;}

/* ---------- responsive ---------- */
@media (max-width:820px){
  .sk__tag{top:64px;left:16px;font-size:10px;}
  .sk-h__card{width:82vw;}
  .sk-h__card img{height:46vh;}
  .sk-px__l1{width:56vw;left:4%;}
  .sk-px__l2{width:48vw;right:4%;}
  .sk-px__l3{width:52vw;left:24%;}
  .sk-sp{grid-template-columns:1fr;}
  .sk-sp__media{position:relative;height:52vh;}
  .sk-sp__items{padding:8vh 6vw 12vh;gap:12vh;}
  .sk-bt__grid{grid-template-columns:repeat(2,1fr);}
  .sk-bt__cell img{height:220px;}
  .sk-bt__cell:nth-child(4n+1) img{min-height:458px;}
  .sk-cd__card{grid-template-columns:1fr;gap:18px;padding:36px 7vw;}
  .sk-zm__img{width:86vw;}
  .sk-ba__frame{width:90vw;height:52vh;}
  .sk-pr__title{font-size:clamp(38px,10.5vw,60px);}
  .sk-tm{min-height:100vh;padding:16vh 6vw;}
  .sk-tm h2{font-size:clamp(38px,12vw,66px);}
  .sk-st{padding:16vh 5vw;}
  .sk-st__num{font-size:clamp(44px,14vw,76px);}
  .sk-st__lbl{font-size:11px;margin-top:10px;}
  .sk-cd{padding:12vh 4vw 18vh;}
}
