/* =========================================================
   Zoom Academy — Event Planner & Project Launch (EN)
   Design tokens → BEM components → sections → responsive
   ========================================================= */

/* ---------- 1. TOKENS ---------- */
:root{
  --ink:#1C1A17;
  --navy:#021836;
  --blue:#3C89F3;
  --blue-dark:#2D74DA;
  --blue-tint:#E1EEFF;
  --sand:#F3F1EF;
  --white:#FFFFFF;
  --muted:#5D6270;
  --muted-2:#9097A5;
  --grey:#656565;
  --placeholder:#8F8A85;
  --input:#F7F7F7;
  --line:#E6E3DF;
  --red:#F20634;
  --mic:#0060FF;

  --font-display:"Clash Display","Clash Display Variable",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-body:"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;

  --r-card:16px;
  --r-sm:8px;
  --r-md:12px;
  --r-pill:100px;

  --container:1240px;
  --gutter:clamp(20px,7vw,100px);
  --section-y:clamp(56px,7vw,100px);

  --shadow-card:0 10px 30px rgba(28,26,23,.06);
  --shadow-pop:0 24px 70px rgba(2,24,54,.28);
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ---------- 2. RESET ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.5;
  color:var(--ink);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg,picture{max-width:100%;display:block}
img{height:auto}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
ul,ol{margin:0;padding:0;list-style:none}
p{margin:0}
h1,h2,h3,h4{margin:0;font-weight:600}
input,select,textarea{font:inherit}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:4px}

/* ---------- 3. LAYOUT PRIMITIVES ---------- */
.container{width:100%;max-width:calc(var(--container) + var(--gutter)*2);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:var(--section-y)}
.section--tight{padding-block:clamp(40px,5vw,80px)}
.section--sand{background:var(--sand)}
.section--navy{background:var(--navy)}
.section--blue{background:var(--blue-tint)}
.center{display:flex;justify-content:center}
.stack{display:flex;flex-direction:column;gap:16px}
.stack--center{align-items:center;text-align:center}
.stack--narrow{max-width:784px;margin-inline:auto}

.split{display:grid;grid-template-columns:minmax(0,615px) minmax(0,533px);gap:clamp(32px,7vw,92px);align-items:start}
.split--top{grid-template-columns:minmax(0,689px) minmax(0,491px)}
.split__left{display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.split__right{display:flex;flex-direction:column;gap:24px}

/* ---------- 4. TYPE ---------- */
.h2{
  font-family:var(--font-display);
  font-weight:600;
  font-size:clamp(30px,3.8vw,55px);
  line-height:1.03;
  letter-spacing:-.01em;
}
.h2--md{font-size:clamp(28px,3vw,40px);line-height:1.1}
.h2--center{text-align:center}
.h2--white{color:var(--white)}
.h3{font-family:var(--font-body);font-weight:700;font-size:clamp(22px,2.2vw,32px);line-height:1.2}
.lead{font-size:clamp(15px,1.25vw,18px);line-height:1.55;color:var(--ink)}
.lead--center{text-align:center}
.eyebrow{font-weight:600;font-size:clamp(15px,1.6vw,24px);color:var(--blue);margin:0}
.eyebrow--spaced{letter-spacing:.12em;text-transform:uppercase;font-size:clamp(13px,1.15vw,18px)}
.accent{color:var(--blue)}
.underlink{font-weight:500;border-bottom:1px solid currentColor;padding-bottom:2px;text-transform:uppercase;letter-spacing:.06em;font-size:.92em}
.h2--max-w {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

/* ---------- 5. BUTTONS ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:12px 26px;
  border-radius:var(--r-pill);
  font-weight:600;font-size:13px;line-height:1.2;
  letter-spacing:.08em;text-transform:uppercase;
  transition:transform .25s var(--ease),background-color .2s,box-shadow .25s var(--ease);
  will-change:transform;
}
.btn--lg{padding:14px 32px;font-size:clamp(13px,1vw,15px)}
.btn--sm{padding:9px 18px;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.btn--block{width:100%}
.btn--grow{flex:1}
.btn--primary{background:var(--blue);color:var(--white)}
.btn--primary:hover{background:var(--blue-dark);transform:translateY(-2px);box-shadow:0 12px 26px rgba(60,137,243,.35)}
.btn--primary:active{transform:translateY(0)}
.btn--ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn--ghost:hover{background:var(--sand)}
.btn__arrow,.btn__download{width:19px;height:19px;flex:none;background:currentColor;
  -webkit-mask:no-repeat center/contain;mask:no-repeat center/contain}
.btn__arrow{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.2 5.4 11.8 6.8 16 11H3v2h13l-4.2 4.2 1.4 1.4L19.8 12 13.2 5.4Z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.2 5.4 11.8 6.8 16 11H3v2h13l-4.2 4.2 1.4 1.4L19.8 12 13.2 5.4Z'/%3E%3C/svg%3E")}
.btn__download{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 3h2v9.2l3.3-3.3 1.4 1.4L12 16 6.3 10.3l1.4-1.4L11 12.2V3ZM5 19h14v2H5v-2Z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 3h2v9.2l3.3-3.3 1.4 1.4L12 16 6.3 10.3l1.4-1.4L11 12.2V3ZM5 19h14v2H5v-2Z'/%3E%3C/svg%3E")}
.btn:hover .btn__arrow{animation:nudge .5s var(--ease)}
@keyframes nudge{50%{transform:translateX(4px)}}

/* ---------- 6. CHIPS / TAGS ---------- */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;padding:5px 14px;border-radius:var(--r-pill);background:var(--sand);font-size:clamp(13px,1.1vw,16px)}
.chip--blue{background:var(--blue-tint);color:var(--blue);font-weight:600;padding:9px 18px}
.tag{display:inline-flex;align-items:center;padding:8px 16px;border-radius:var(--r-pill);background:var(--white);font-size:14px;font-weight:600;box-shadow:var(--shadow-card)}
.alertbox{display:inline-flex;align-items:center;padding:12px 20px;border-radius:var(--r-pill);background:var(--blue-tint);color:var(--blue);font-weight:600;font-size:15px}

/* ---------- 7. PLAY BUTTON ---------- */
.playdot{
  position:absolute;left:50%;top:50%;translate:-50% -50%;
  width:74px;height:74px;border-radius:50%;
  background:var(--white);
  display:grid;place-items:center;
  transition:scale .35s var(--ease),box-shadow .35s var(--ease);
  box-shadow:0 8px 24px rgba(0,0,0,.22);
}
.playdot::before{
  content:"";width:0;height:0;margin-left:5px;
  border-left:20px solid var(--ink);
  border-top:12px solid transparent;
  border-bottom:12px solid transparent;
}
.playdot::after{
  content:"";position:absolute;inset:-6px;border-radius:50%;
  border:2px solid rgba(255,255,255,.75);
  opacity:0;transform:scale(.8);
  transition:opacity .4s var(--ease),transform .5s var(--ease);
}
.playdot--sm{position:static;translate:none;width:29px;height:29px;box-shadow:none;flex:none}
.playdot--sm::before{border-left-width:9px;border-top-width:5px;border-bottom-width:5px;margin-left:2px;border-left-color:var(--blue)}
.playdot--dark::before{border-left-color:var(--ink)}
[data-video]:hover .playdot,[data-video] .playdot:hover{scale:1.12;box-shadow:0 14px 38px rgba(0,0,0,.32)}
[data-video]:hover .playdot::after{opacity:1;transform:scale(1.12)}

/* ---------- 8. TOPBAR ---------- */
.topbar{background:var(--navy);color:var(--white)}
.topbar__inner{display:flex;align-items:center;justify-content:center;gap:19px;flex-wrap:wrap;min-height:48px;padding:8px var(--gutter);font-size:clamp(11px,1vw,14px)}
.topbar__item{display:inline-flex;align-items:center;gap:8px}
.topbar__item svg{width:18px;height:18px;fill:currentColor;flex:none}
.topbar__dot{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:.7}

/* ---------- 9. HERO ---------- */
.hero{position:relative;background:var(--navy);color:var(--white);isolation:isolate;padding-bottom:96px}
.hero__bg{position:absolute;inset:0;z-index:-2;background:url("assets/img/hero-bg.webp") center 38%/cover no-repeat}
.hero__scrim{position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,#021836 0%,rgba(2,24,54,.86) 26%,rgba(2,24,54,.42) 48%,rgba(2,24,54,.30) 72%,rgba(2,24,54,.55) 100%)}
.hero__inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;padding-top:clamp(40px,5vw,70px)}
.hero__logo{margin-bottom:clamp(28px,4vw,48px)}
.hero__logo img{width:clamp(120px,11vw,164px);height:auto}
.hero__eyebrow{font-size:clamp(14px,1.7vw,24px);font-weight:500;letter-spacing:.14em;text-transform:uppercase;margin-bottom:14px}
.hero__title{
  font-family:var(--font-display);font-weight:600;
  font-size:clamp(32px,4.4vw,60px);line-height:1.06;letter-spacing:-.015em;
  max-width:16ch;
}
.hero__lead{margin-top:clamp(20px,2.4vw,34px);max-width:718px;font-size:clamp(14px,1.25vw,18px);font-weight:500;line-height:1.5}
.hero__cta{margin-top:clamp(24px,2.8vw,40px)}
.hero__portrait{
  position:absolute;right:calc(50% - 720px + 12px);bottom:0;z-index:3;
  width:341px;height:auto;pointer-events:none;
}
.hero__facts{position:relative;z-index:2;margin-top:clamp(36px,5vw,74px)}
.hero__pill-wrap{position:relative;z-index:4;display:flex;justify-content:center;margin-top:-22px}

.facts{
  background:var(--white);color:var(--ink);border-radius:var(--r-card);
  padding:34px 48px;display:grid;
  grid-template-columns:repeat(4,max-content) 318px;
  justify-content:start;
  gap:24px 64px;max-width:1129px;
  box-shadow:var(--shadow-card);
}
.facts__item{display:flex;flex-direction:column;gap:8px;position:relative}
.facts__item+.facts__item::before{content:"";position:absolute;left:-32px;top:4px;bottom:4px;width:1px;background:var(--line)}
.facts__icon{width:36px;height:36px;display:grid;place-items:center}
.facts__icon svg{width:32px;height:32px;fill:var(--blue)}
.facts__value{font-family:var(--font-display);font-weight:600;font-size:clamp(19px,1.8vw,24px);line-height:1.15;margin-top:6px}
.facts__value--sm{font-size:clamp(15px,1.35vw,18px)}
.facts__label{font-size:clamp(13px,1.1vw,16px);line-height:1.4}

.storypill{
  display:inline-flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center;
  background:var(--blue);color:var(--white);
  padding:8px 22px;border-radius:var(--r-pill);
  font-size:clamp(12px,1.1vw,16px);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
  box-shadow:0 10px 26px rgba(60,137,243,.32);
}
.storypill:has(.playdot){padding-left:12px}
button.storypill:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(60,137,243,.42)}
.storypill strong{font-weight:600}
.storypill em{font-style:italic;font-weight:600}
.storypill__before{opacity:.92}
.storypill__arrow{width:16px;height:16px;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.2 5.4 11.8 6.8 16 11H3v2h13l-4.2 4.2 1.4 1.4L19.8 12 13.2 5.4Z'/%3E%3C/svg%3E") no-repeat center/contain;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.2 5.4 11.8 6.8 16 11H3v2h13l-4.2 4.2 1.4 1.4L19.8 12 13.2 5.4Z'/%3E%3C/svg%3E") no-repeat center/contain}

/* ---------- 10. GRAD FEST ---------- */
.swiper--cards{margin-top:clamp(32px,4vw,56px)}
.statcard{background:var(--white);border-radius:var(--r-card);padding:26px 24px;height:100%;display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow-card)}
.statcard__value{font-family:var(--font-display);font-weight:600;font-size:clamp(26px,2.4vw,32px);line-height:1.1}
.statcard__text{font-size:15px;line-height:1.5;color:var(--ink)}

.storycard{
  margin-top:clamp(28px,3.5vw,48px);
  background:var(--white);border-radius:var(--r-card);
  padding:clamp(20px,2.6vw,42px);
  display:grid;grid-template-columns:minmax(0,480px) minmax(0,1fr);
  gap:clamp(24px,3.5vw,46px);align-items:center;
  box-shadow:var(--shadow-card);
}
.storycard__media{position:relative;border-radius:var(--r-card);overflow:hidden;display:block;width:100%}
.storycard__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.storycard__media:hover img{transform:scale(1.04)}
.storycard__body{display:flex;flex-direction:column;gap:20px;align-items:flex-start}

.bullets{display:flex;flex-direction:column;gap:10px}
.bullets li{position:relative;padding-left:22px;font-size:clamp(15px,1.35vw,20px);line-height:1.45}
.bullets li::before{content:"";position:absolute;left:4px;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--blue)}
.bullets--plain li{font-size:clamp(14px,1.2vw,18px)}
.bullets--plain li::before{background:var(--ink)}

.quote{margin:0;border-left:3px solid var(--blue);padding-left:20px;display:flex;flex-direction:column;gap:10px}
.quote p{font-weight:600;font-style:italic;font-size:clamp(16px,1.6vw,24px);line-height:1.3}
.quote cite{font-style:normal;font-weight:600;font-size:clamp(13px,1.15vw,18px);color:var(--blue)}

/* ---------- 11. TABS: PATHS ---------- */
.sectionhead{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:clamp(24px,3vw,40px)}
.tabs{display:grid;grid-template-columns:minmax(0,446px) minmax(0,1fr);gap:clamp(24px,3vw,40px);align-items:start}
.tabs__list{display:flex;flex-direction:column;gap:24px}
.tabs__tab{
  position:relative;text-align:left;
  padding:16px 20px;border-radius:var(--r-sm);
  font-size:clamp(16px,1.7vw,24px);line-height:1.35;color:var(--ink);
  transition:background-color .25s var(--ease),color .25s var(--ease),transform .25s var(--ease);
}
.tabs__tab::before{content:"";position:absolute;left:-5px;top:50%;translate:0 -50%;width:5px;height:0;border-radius:4px;background:var(--blue);transition:height .3s var(--ease)}
.tabs__tab:hover{background:rgba(225,238,255,.55)}
.tabs__tab.is-active{background:var(--blue-tint);font-weight:500}
.tabs__tab.is-active::before{height:79px}
.tabs__panels{position:relative;min-height:464px}

.pathpanel{position:relative;border-radius:var(--r-card);overflow:hidden;animation:fadeUp .45s var(--ease) both}
.pathpanel[hidden]{display:none}
.pathpanel__img{width:100%;height:464px;object-fit:cover}
.pathpanel__person{position:absolute;left:46px;bottom:36px;color:var(--white);max-width:260px;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.pathpanel__name{font-size:clamp(18px,1.7vw,24px);font-weight:600}
.pathpanel__before{font-size:15px}
.pathpanel__after{font-size:15px;font-weight:600;font-style:italic}
.pathpanel__site{font-size:15px;opacity:.9;margin-top:4px}
.pathpanel__card{
  position:absolute;right:32px;top:30px;width:389px;max-width:calc(100% - 64px);
  background:var(--white);border-radius:var(--r-card);padding:32px;
  display:flex;flex-direction:column;gap:16px;align-items:flex-start;
  box-shadow:0 18px 44px rgba(2,24,54,.18);
}
.pathpanel__title{font-weight:700;font-size:clamp(20px,2.2vw,32px);line-height:1.15}
.pathpanel__text{font-size:15px;line-height:1.5}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}


/* ---------- ICON MASKS ---------- */
.i-clock,.i-check,.i-bell,.i-globe,.i-heart,.i-cap,.i-laptop,.i-book,.i-sign{
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-size:contain;mask-size:contain;
}

.highlights__dot{-webkit-mask:none!important;mask:none!important}
.highlights__dot::before{content:"";width:14px;height:14px;background:var(--white);
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;
  -webkit-mask-image:inherit;mask-image:inherit}
.highlights__dot::before{-webkit-mask-image:var(--ic);mask-image:var(--ic)}
.planstep__icon{width:25px;height:25px;flex:none;background:currentColor}
.i-clock{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3.5 2'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3.5 2'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3.5 2'/%3E%3C/svg%3E")}
.i-check{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm-1.2 14.4-4.2-4.2 1.4-1.4 2.8 2.8 6-6 1.4 1.4-7.4 7.4Z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm-1.2 14.4-4.2-4.2 1.4-1.4 2.8 2.8 6-6 1.4 1.4-7.4 7.4Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm-1.2 14.4-4.2-4.2 1.4-1.4 2.8 2.8 6-6 1.4 1.4-7.4 7.4Z'/%3E%3C/svg%3E")}
.i-bell{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 22a2.5 2.5 0 0 0 2.5-2.5h-5A2.5 2.5 0 0 0 12 22Zm7-6v-5a7 7 0 0 0-5.5-6.84V3a1.5 1.5 0 0 0-3 0v1.16A7 7 0 0 0 5 11v5l-2 2v1h18v-1l-2-2Z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 22a2.5 2.5 0 0 0 2.5-2.5h-5A2.5 2.5 0 0 0 12 22Zm7-6v-5a7 7 0 0 0-5.5-6.84V3a1.5 1.5 0 0 0-3 0v1.16A7 7 0 0 0 5 11v5l-2 2v1h18v-1l-2-2Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 22a2.5 2.5 0 0 0 2.5-2.5h-5A2.5 2.5 0 0 0 12 22Zm7-6v-5a7 7 0 0 0-5.5-6.84V3a1.5 1.5 0 0 0-3 0v1.16A7 7 0 0 0 5 11v5l-2 2v1h18v-1l-2-2Z'/%3E%3C/svg%3E")}
.i-globe{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm6.9 6h-2.6a15.6 15.6 0 0 0-1.4-3.6A8 8 0 0 1 18.9 8ZM12 4.1c.7 1 1.3 2.3 1.7 3.9h-3.4c.4-1.6 1-2.9 1.7-3.9ZM4.3 14a8 8 0 0 1 0-4h3a17 17 0 0 0 0 4h-3Zm.8 2h2.6c.3 1.3.8 2.5 1.4 3.6A8 8 0 0 1 5.1 16Zm2.6-8H5.1a8 8 0 0 1 4-3.6A15.6 15.6 0 0 0 7.7 8ZM12 19.9c-.7-1-1.3-2.3-1.7-3.9h3.4c-.4 1.6-1 2.9-1.7 3.9ZM14.1 14H9.9a15 15 0 0 1 0-4h4.2a15 15 0 0 1 0 4Zm.8 5.6c.6-1.1 1.1-2.3 1.4-3.6h2.6a8 8 0 0 1-4 3.6ZM16.7 14a17 17 0 0 0 0-4h3a8 8 0 0 1 0 4h-3Z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm6.9 6h-2.6a15.6 15.6 0 0 0-1.4-3.6A8 8 0 0 1 18.9 8ZM12 4.1c.7 1 1.3 2.3 1.7 3.9h-3.4c.4-1.6 1-2.9 1.7-3.9ZM4.3 14a8 8 0 0 1 0-4h3a17 17 0 0 0 0 4h-3Zm.8 2h2.6c.3 1.3.8 2.5 1.4 3.6A8 8 0 0 1 5.1 16Zm2.6-8H5.1a8 8 0 0 1 4-3.6A15.6 15.6 0 0 0 7.7 8ZM12 19.9c-.7-1-1.3-2.3-1.7-3.9h3.4c-.4 1.6-1 2.9-1.7 3.9ZM14.1 14H9.9a15 15 0 0 1 0-4h4.2a15 15 0 0 1 0 4Zm.8 5.6c.6-1.1 1.1-2.3 1.4-3.6h2.6a8 8 0 0 1-4 3.6ZM16.7 14a17 17 0 0 0 0-4h3a8 8 0 0 1 0 4h-3Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm6.9 6h-2.6a15.6 15.6 0 0 0-1.4-3.6A8 8 0 0 1 18.9 8ZM12 4.1c.7 1 1.3 2.3 1.7 3.9h-3.4c.4-1.6 1-2.9 1.7-3.9ZM4.3 14a8 8 0 0 1 0-4h3a17 17 0 0 0 0 4h-3Zm.8 2h2.6c.3 1.3.8 2.5 1.4 3.6A8 8 0 0 1 5.1 16Zm2.6-8H5.1a8 8 0 0 1 4-3.6A15.6 15.6 0 0 0 7.7 8ZM12 19.9c-.7-1-1.3-2.3-1.7-3.9h3.4c-.4 1.6-1 2.9-1.7 3.9ZM14.1 14H9.9a15 15 0 0 1 0-4h4.2a15 15 0 0 1 0 4Zm.8 5.6c.6-1.1 1.1-2.3 1.4-3.6h2.6a8 8 0 0 1-4 3.6ZM16.7 14a17 17 0 0 0 0-4h3a8 8 0 0 1 0 4h-3Z'/%3E%3C/svg%3E")}
.i-heart{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-8-4.9-8-10.4A4.9 4.9 0 0 1 12 7.3a4.9 4.9 0 0 1 8 3.3C20 16.1 12 21 12 21Z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-8-4.9-8-10.4A4.9 4.9 0 0 1 12 7.3a4.9 4.9 0 0 1 8 3.3C20 16.1 12 21 12 21Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-8-4.9-8-10.4A4.9 4.9 0 0 1 12 7.3a4.9 4.9 0 0 1 8 3.3C20 16.1 12 21 12 21Z'/%3E%3C/svg%3E")}
.i-cap{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3 1 8l11 5 9-4.09V16h2V8L12 3ZM5 13.18v3.5L12 20l7-3.32v-3.5L12 16l-7-2.82Z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3 1 8l11 5 9-4.09V16h2V8L12 3ZM5 13.18v3.5L12 20l7-3.32v-3.5L12 16l-7-2.82Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3 1 8l11 5 9-4.09V16h2V8L12 3ZM5 13.18v3.5L12 20l7-3.32v-3.5L12 16l-7-2.82Z'/%3E%3C/svg%3E")}
.i-laptop{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5h16v10H4V5Zm0-2a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2H4Zm-3 16h22v2H1v-2Z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5h16v10H4V5Zm0-2a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2H4Zm-3 16h22v2H1v-2Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5h16v10H4V5Zm0-2a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2H4Zm-3 16h22v2H1v-2Z'/%3E%3C/svg%3E")}
.i-book{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h13a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6a3 3 0 0 1-3-3V5a3 3 0 0 1 3-3Zm0 2a1 1 0 0 0-1 1v11.2c.3-.1.7-.2 1-.2h12V4H6Zm0 14a1 1 0 0 0 0 2h12v-2H6Z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h13a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6a3 3 0 0 1-3-3V5a3 3 0 0 1 3-3Zm0 2a1 1 0 0 0-1 1v11.2c.3-.1.7-.2 1-.2h12V4H6Zm0 14a1 1 0 0 0 0 2h12v-2H6Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h13a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6a3 3 0 0 1-3-3V5a3 3 0 0 1 3-3Zm0 2a1 1 0 0 0-1 1v11.2c.3-.1.7-.2 1-.2h12V4H6Zm0 14a1 1 0 0 0 0 2h12v-2H6Z'/%3E%3C/svg%3E")}
.i-sign{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h8l4 4v5h-2V7h-4V4H6v16h4v2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2Zm14.7 9.3 1 1a1 1 0 0 1 0 1.4l-1 1-2.4-2.4 1-1a1 1 0 0 1 1.4 0ZM12 20.6l5.9-5.9 2.4 2.4-5.9 5.9H12v-2.4Z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h8l4 4v5h-2V7h-4V4H6v16h4v2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2Zm14.7 9.3 1 1a1 1 0 0 1 0 1.4l-1 1-2.4-2.4 1-1a1 1 0 0 1 1.4 0ZM12 20.6l5.9-5.9 2.4 2.4-5.9 5.9H12v-2.4Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h8l4 4v5h-2V7h-4V4H6v16h4v2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2Zm14.7 9.3 1 1a1 1 0 0 1 0 1.4l-1 1-2.4-2.4 1-1a1 1 0 0 1 1.4 0ZM12 20.6l5.9-5.9 2.4 2.4-5.9 5.9H12v-2.4Z'/%3E%3C/svg%3E")}

/* ---------- 12. CURRICULUM ---------- */
.highlights{display:flex;flex-direction:column;gap:16px}
.highlights__row{display:inline-flex;align-self:flex-start;align-items:center;gap:12px;background:var(--white);border-radius:var(--r-pill);padding:8px 18px;font-size:15px;font-weight:500;box-shadow:0 4px 12px rgba(28,26,23,.05)}
.highlights__dot{width:24px;height:24px;border-radius:50%;background:var(--ink);color:var(--white);display:grid;place-items:center;font-size:11px;flex:none}

.modules{margin-top:clamp(36px,4.5vw,72px);display:flex;flex-direction:column;gap:20px}
.module{background:var(--white);border-radius:var(--r-card);padding:24px 32px;display:grid;grid-template-columns:94px minmax(0,1fr);align-items:start;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.module:hover{transform:translateY(-3px);box-shadow:var(--shadow-card)}
.module__num{font-family:var(--font-display);font-weight:600;font-size:clamp(24px,2.4vw,32px);line-height:1}
.module__body{display:flex;flex-direction:column;gap:10px}
.module__head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap}
.module__title{font-weight:600;font-size:clamp(16px,1.6vw,20px);line-height:1.3}
.module__weeks{font-size:14px;font-weight:500;color:var(--ink);white-space:nowrap}

.included{margin-top:clamp(28px,3vw,44px);display:flex;flex-wrap:wrap;align-items:center;gap:14px 42px}
.included__label{font-weight:600;font-size:clamp(15px,1.25vw,18px)}
.included__item{position:relative;padding-left:16px;font-size:15px}
.included__item::before{content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;border-radius:50%;background:var(--blue)}

/* ---------- 13. LAUNCH PACKAGE TABS ---------- */
.tabs--bar{display:block;margin-top:clamp(28px,3.4vw,50px)}
.tabs__list--bar{
  flex-direction:row;flex-wrap:nowrap;gap:0;
  background:var(--blue-tint);border-radius:var(--r-md);padding:8px;
  overflow-x:auto;scrollbar-width:none;
}
.tabs__list--bar::-webkit-scrollbar{display:none}
.tabs__list--bar .tabs__tab{
  flex:1 0 auto;text-align:center;white-space:nowrap;
  padding:10px 22px;border-radius:var(--r-sm);
  font-size:clamp(13px,1.25vw,18px);font-weight:500;text-transform:uppercase;letter-spacing:.04em;
}
.tabs__list--bar .tabs__tab::before{display:none}
.tabs__list--bar .tabs__tab.is-active{background:var(--white);box-shadow:0 2px 8px rgba(2,24,54,.08)}

.kitpanel{display:grid;grid-template-columns:minmax(0,514px) minmax(0,666px);gap:clamp(24px,3.5vw,60px);align-items:center;margin-top:clamp(28px,3.4vw,50px);animation:fadeUp .45s var(--ease) both}
.kitpanel[hidden]{display:none}
.kitpanel__body{display:flex;flex-direction:column;gap:18px}
.kitpanel__title{font-weight:700;font-size:clamp(22px,2.2vw,30px);line-height:1.2}
.kitpanel__text{font-size:clamp(15px,1.5vw,24px);line-height:1.4}
.kitpanel__media{border-radius:var(--r-card);overflow:hidden;background:var(--ink)}
.kitpanel__media img{width:100%;height:560px;object-fit:cover}

.kitfooter{margin-top:clamp(28px,3.4vw,50px);display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}

/* ---------- 14. REVIEWS ---------- */
.rating{display:flex;align-items:center;gap:14px}
.rating__score{font-weight:600;font-size:clamp(24px,2.6vw,33px)}
.rating__stars{font-size:clamp(20px,2.1vw,28px);color:var(--ink);letter-spacing:2px}
.rating__half{color:#B9B6B1}
.reviews{margin-top:clamp(28px,3.4vw,48px);display:flex;flex-direction:column;gap:24px}
.review{background:var(--white);border-radius:var(--r-card);padding:clamp(20px,2.6vw,48px);display:grid;grid-template-columns:minmax(0,472px) minmax(0,1fr);gap:clamp(20px,3vw,72px);align-items:center;box-shadow:var(--shadow-card)}
.review__media{border-radius:var(--r-sm);overflow:hidden}
.review__media img{width:100%;height:270px;object-fit:cover}
.review__body{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.review__logo{height:38px;width:auto}
.review__logo--fb{height:28px}
.review__quote{font-size:clamp(17px,1.9vw,32px);line-height:1.25;font-style:italic}
.review__author{font-weight:500;font-size:clamp(16px,1.7vw,28px)}
.reviews+.center{margin-top:clamp(24px,3vw,44px)}

/* ---------- 15. VIDEO TESTIMONIALS ---------- */
.swiper--videos{margin-top:clamp(28px,3.4vw,52px)}
.vidcard{display:flex;flex-direction:column;gap:14px;height:100%}
.vidcard__thumb{position:relative;display:block;border-radius:var(--r-card);overflow:hidden;background:var(--ink);width:100%;aspect-ratio:292/468}
.vidcard__thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.vidcard__thumb:hover img{transform:scale(1.05)}
.vidcard__name{font-weight:700;font-size:clamp(18px,1.7vw,24px);color:var(--blue)}
.vidcard__quote{font-size:15px;font-weight:500;font-style:italic;line-height:1.35}

/* ---------- 16. STORIES ---------- */
.swiper--stories{margin-top:clamp(28px,3.4vw,52px);border-radius:var(--r-card)}
.bigstory{position:relative;border-radius:var(--r-card);overflow:hidden;background:var(--blue-tint);min-height:464px;display:flex}
.bigstory__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center}
.bigstory__body{position:relative;z-index:2;padding:clamp(24px,3.2vw,58px);max-width:640px;display:flex;flex-direction:column;gap:20px;justify-content:center}
.bigstory__head{display:flex;align-items:center;gap:14px;font-weight:600;font-size:clamp(17px,1.7vw,24px);text-align:left}
.bigstory__quote{font-size:clamp(14px,1.6vw,22px);line-height:1.45}
.bigstory__author{display:flex;align-items:center;gap:24px}
.bigstory__score{background:var(--ink);color:var(--white);border-radius:var(--r-sm);padding:12px 20px;font-size:clamp(20px,2.2vw,32px);font-weight:500;white-space:nowrap}
.bigstory__author strong{font-size:clamp(17px,1.7vw,24px);font-weight:600}
.bigstory__tags{position:absolute;right:24px;bottom:24px;z-index:2;display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.storiesfoot{margin-top:clamp(24px,3vw,44px);display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.navbtns{display:flex;gap:16px}
.navbtn{width:75px;height:48px;border-radius:var(--r-pill);background:var(--white);display:grid;place-items:center;box-shadow:var(--shadow-card);transition:transform .25s var(--ease),background-color .2s}
.navbtn:hover{transform:translateY(-2px);background:var(--blue);}
.navbtn:hover .navbtn__arrow{background:var(--white)}
.navbtn__arrow{width:22px;height:22px;background:var(--ink);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.2 5.4 11.8 6.8 16 11H3v2h13l-4.2 4.2 1.4 1.4L19.8 12 13.2 5.4Z'/%3E%3C/svg%3E") no-repeat center/contain;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.2 5.4 11.8 6.8 16 11H3v2h13l-4.2 4.2 1.4 1.4L19.8 12 13.2 5.4Z'/%3E%3C/svg%3E") no-repeat center/contain}
.navbtn__arrow--left{rotate:180deg}

/* ---------- 17. HORIZONTAL SCROLL ---------- */
.hscroll{position:relative;background:var(--navy)}
.hscroll__sticky{
  position:sticky;top:0;
  height:100vh;height:100svh;
  display:grid;grid-template-rows:auto minmax(0,1fr) auto;
  /* no grid gap: the head->viewport and viewport->bar gaps are set per row so
     the bar can sit closer to the art than the head sits to the art, and still
     keep real breathing room below itself */
  gap:0;
  padding-top:100px;
  padding-bottom:clamp(22px,3.6vh,34px);
  overflow:hidden;
}
.hscroll__head{display:flex;flex-direction:column;gap:clamp(10px,1.8vh,22px)}
.hscroll__head .h2{font-size:clamp(24px,2.7vw,46px)}
.hscroll__viewport{overflow:hidden;width:100%;min-height:0;display:flex;align-items:safe center;margin-top:clamp(22px,4.4vh,52px)}
.hscroll__track{display:flex;align-items:flex-start;gap:clamp(28px,4vw,80px);padding-inline:var(--gutter);min-height:0;will-change:transform}
.planstep{flex:0 0 618px;max-width:618px;min-height:0;color:var(--white);display:flex;flex-direction:column;gap:clamp(8px,1.4vh,16px)}
.planstep__eyebrow{display:flex;align-items:center;gap:10px;font-size:clamp(14px,1.25vw,18px);font-weight:500;letter-spacing:.16em;text-transform:uppercase;opacity:.92;position:relative}
.planstep__eyebrow::after{content:"";flex:1;height:1px;background:rgba(255,255,255,.28)}
.planstep__title{font-weight:700;font-size:clamp(22px,2.2vw,32px)}
.planstep__text{font-size:clamp(14px,1.35vw,21px);line-height:1.4;opacity:.94}
.planstep__media{margin:0;position:relative;min-height:0;border-radius:var(--r-card);overflow:hidden}
.planstep__media img{width:100%;object-fit:contain}
.planstep__cta{position:absolute;right:20px;bottom:20px;font-size:clamp(14px,1.4vw,20px);padding:12px 24px}

.callstack{position:relative;flex:1;min-height:0;margin-top:0}
.callstack:has(> img){flex:0 1 auto}
.callstack > img,
.planstep__media > img{display:block;width:100%;height:auto;
  max-height:clamp(200px,calc(84vh - 400px),520px);
  object-fit:contain;object-position:left top}
.callstack > img{border-radius:clamp(12px,2.2vh,24px)}
.callstack figure{margin:0;position:absolute;border-radius:clamp(12px,2.2vh,24px);overflow:hidden}
.callstack figure img{width:100%;height:100%;object-fit:cover}
.callstack__a{left:0;top:0;width:51.78%;height:80.4%}
.callstack__b{left:48.22%;top:19.6%;width:51.78%;height:80.4%}
.callstack--wide .callstack__a{left:0;top:14.07%;width:61.49%;height:80.4%}
.callstack--wide .callstack__b{left:51.29%;top:34.42%;width:48.71%;height:73.87%}
.micbadge{position:absolute;left:20px;top:20px;width:40px;height:40px;border-radius:50%;background:var(--mic);display:grid;place-items:center;z-index:3}
.micbadge::before{content:"";width:25px;height:25px;background:var(--white);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 14a3 3 0 0 0 3-3V5a3 3 0 1 0-6 0v6a3 3 0 0 0 3 3Zm5-3a5 5 0 0 1-10 0H5a7 7 0 0 0 6 6.92V21h2v-3.08A7 7 0 0 0 19 11h-2Z'/%3E%3C/svg%3E") no-repeat center/contain;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 14a3 3 0 0 0 3-3V5a3 3 0 1 0-6 0v6a3 3 0 0 0 3 3Zm5-3a5 5 0 0 1-10 0H5a7 7 0 0 0 6 6.92V21h2v-3.08A7 7 0 0 0 19 11h-2Z'/%3E%3C/svg%3E") no-repeat center/contain}
.micbadge--off{background:var(--red)}
.micbadge--off::after{content:"";position:absolute;width:26px;height:2px;background:var(--white);rotate:-45deg}
.callstack__label{position:absolute;left:50%;bottom:4%;translate:-50% 0;background:var(--white);color:var(--ink);border-radius:var(--r-pill);padding:9px 18px;font-size:14px;font-weight:700;white-space:nowrap;z-index:3}
.chatbubble{position:absolute;left:35.44%;top:1%;width:64.56%;background:var(--white);color:var(--ink);border-radius:var(--r-md);padding:14px;display:flex;gap:14px;z-index:4;box-shadow:0 14px 34px rgba(0,0,0,.2)}
.chatbubble__avatar{width:38px;height:38px;border-radius:50%;object-fit:cover;flex:none}
.chatbubble__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-size:15px}
.chatbubble__head strong{font-weight:600;color:#222}
.chatbubble__head span{font-size:12px;font-weight:500;color:#3F3F3F}
.chatbubble__text{font-size:15px;color:#3F3F3F;line-height:1.35}

.hscroll__progress{width:min(320px,60vw);height:4px;border-radius:4px;background:rgba(255,255,255,.18);margin-inline:auto;margin-top:clamp(12px,1.8vh,20px)}
.hscroll__progress span{display:block;height:100%;width:0;border-radius:4px;background:var(--blue);transition:width .1s linear}

/* Compositor-driven horizontal run.
   Scrolling is threaded: the compositor moves the page before the main thread
   ever hears about it, so a scroll-linked transform written from JS is always
   at least one frame behind — that lag is the judder. A scroll-driven
   animation is evaluated on the compositor, so it cannot fall behind.
   JS (script.js, initHorizontalScroll) sets --hs-distance / --hs-end and keeps
   its own scroll handler as the fallback where this is unsupported. */
@supports (animation-timeline: view()) {
  @media (min-width:768px){
    .hscroll{view-timeline-name:--hs;view-timeline-axis:block}
    .hscroll__track{
      animation:hs-run linear both;
      animation-timeline:--hs;
      animation-range:contain 0% contain var(--hs-end,100%);
    }
    .hscroll__progress span{
      width:100%;transform:scaleX(0);transform-origin:left center;transition:none;
      animation:hs-bar linear both;
      animation-timeline:--hs;
      animation-range:contain 0% contain var(--hs-end,100%);
    }
  }
  @keyframes hs-run{to{transform:translate3d(calc(-1 * var(--hs-distance,0px)),0,0)}}
  @keyframes hs-bar{to{transform:scaleX(1)}}
}

/* ---------- 18. BENEFITS ---------- */
.swiper--benefits{margin-top:clamp(28px,3.4vw,52px)}
/* above 768 Swiper is not mounted, so the wrapper is a plain CSS grid:
   rows stretch to the tallest card, which is what makes the heights equal */
.swiper--benefits:not(.swiper-initialized) .swiper-wrapper{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-auto-rows:1fr;
  gap:18px;
  transform:none!important;
}
.swiper--benefits:not(.swiper-initialized) .swiper-slide{width:auto!important;margin:0!important;height:auto}
.swiper:not(.swiper-initialized) .swiper-pagination{display:none}
@media (max-width:1023px){
  .swiper--benefits:not(.swiper-initialized) .swiper-wrapper{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.benefit{background:var(--sand);border-radius:var(--r-card);padding:32px;height:100%;display:flex;flex-direction:column;gap:12px}
.benefit__num{font-family:var(--font-display);font-weight:600;font-size:32px;color:var(--blue);line-height:1}
.benefit__title{font-weight:700;font-size:clamp(18px,1.8vw,24px);line-height:1.2}
.benefit__text{font-size:15px;line-height:1.5;color:var(--muted)}

/* ---------- 19. CERTIFICATE ---------- */
.certificate{display:grid;grid-template-columns:minmax(0,522px) minmax(0,497px);gap:clamp(28px,5vw,90px);align-items:center;justify-content:center}
.certificate__media{position:relative;display:grid;place-items:center}
.certificate__glow{position:absolute;inset:-14% 0;border-radius:50%;
  background:radial-gradient(closest-side,rgba(60,137,243,.28),rgba(60,137,243,0) 70%);filter:blur(8px)}
.certificate__media img{position:relative;width:100%;border-radius:12px;filter: drop-shadow(0 26px 60px rgba(2, 24, 54, .16));}
.certificate__body{display:flex;flex-direction:column;gap:22px}

/* ---------- 20. GUARANTEE ---------- */
.guarantee{background:var(--sand);border-radius:var(--r-card);padding:clamp(32px,5vw,80px) clamp(20px,4vw,60px);display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center}
.guarantee .h2{max-width:928px}
.guarantee__note{font-size:clamp(14px,1.25vw,18px)}
.guarantee__note .btn__arrow{width:15px;height:15px;display:inline-block;vertical-align:-2px;background:var(--ink)}

/* ---------- 21. NETWORK ---------- */
.network{margin-top:clamp(28px,3.6vw,60px);display:grid;grid-template-columns:minmax(0,439px) minmax(0,724px);gap:clamp(28px,4vw,77px);align-items:start}
.network__left{display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.network__quote{margin:0;font-size:clamp(16px,1.7vw,24px);line-height:1.4;font-style:italic}
.network__portrait{width:291px;max-width:100%;border-radius:var(--r-card);object-fit:cover}
.network__name{font-weight:600;font-size:clamp(18px,1.7vw,24px)}
.network__role{font-size:15px}
.network__right{display:flex;flex-direction:column;gap:16px}
.netcard{background:var(--blue-tint);border-radius:var(--r-card);padding:clamp(22px,2.4vw,32px)}
.netcard__title{font-weight:600;font-size:clamp(18px,1.7vw,24px);margin-bottom:10px}
.netcard__text{font-size:clamp(15px,1.6vw,24px);line-height:1.4}
.gallery{margin-top:clamp(28px,3.6vw,56px);display:grid;grid-template-columns:213fr 455fr 252fr 253fr;gap:24px}
.gallery img{width:100%;height:381px;object-fit:cover;border-radius:var(--r-sm)}

/* ---------- 22. COMPARE ---------- */
.swiper--compare{margin-top:clamp(28px,3.6vw,56px);padding-block:10px}
.swiper--compare .swiper-slide{height:auto;display:flex;align-items:center}
.plan{background:var(--blue-tint);border-radius:var(--r-card);padding:32px;width:100%;display:flex;flex-direction:column;gap:16px;min-height:642px}
.plan--featured{background:var(--white);min-height:724px;box-shadow:0 22px 60px rgba(0,0,0,.28)}
.plan__title{font-family:var(--font-display);font-weight:600;font-size:clamp(22px,2.2vw,30px);line-height:1.1}
.plan__logo{width: 114px;height: auto;margin: 0 auto;margin-bottom: 20px;}
.plan__duration{display:flex;align-items:center;gap:8px;font-size:15px}
.plan__clock{width:18px;height:18px;flex:none;background:var(--ink);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3.5 2'/%3E%3C/svg%3E") no-repeat center/contain;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3.5 2'/%3E%3C/svg%3E") no-repeat center/contain}
.plan__list{display:flex;flex-direction:column;gap:16px;flex:1}
.plan__list li{position:relative;padding-left:28px;font-size:15px;line-height:1.3}
.plan__list li::before{position:absolute;left:0;top:0;width:18px;height:18px;font-weight:700;text-align:center;line-height:18px}
.plan__list .is-yes{color:var(--ink)}
.plan__list .is-yes::before{content:"✓";color:var(--ink)}
.plan__list .is-no{color:var(--muted)}
.plan__list .is-no::before{content:"✕";color:var(--muted-2)}
.plan__price{display:flex;gap:8px;font-size:clamp(15px,1.25vw,18px)}

/* ---------- 23. BOOKING ---------- */
.booking{display:grid;grid-template-columns:minmax(0,540px) minmax(0,636px);gap:clamp(28px,4vw,64px);align-items:start}
.booking__left{display:flex;flex-direction:column;gap:22px;align-items:flex-start}
.cohort{background:var(--white);border-radius:var(--r-pill);padding:9px 20px;font-weight:700;font-size:clamp(13px,1.15vw,16px);text-transform:uppercase;letter-spacing:.04em}
.advisors{display:flex;align-items:center;gap:22px}
.advisors img{width:182px;height:auto}
.advisors p{font-size:clamp(15px,1.25vw,18px);line-height:1.35}
.advisors strong{font-weight:600}
.afterbook{background:var(--white);border-radius:var(--r-card);padding:24px;width:100%}
.afterbook__title{font-weight:700;font-size:clamp(16px,1.25vw,18px);margin-bottom:8px}
.afterbook__text{font-size:15px;line-height:1.5}
.booking__right .formcard{background:var(--white);border-radius:var(--r-card);padding:clamp(22px,2.6vw,48px)}

/* ---------- 24. FORM ---------- */
.bookform{display:flex;flex-direction:column;gap:26px}
.steps{position:relative;padding-top:6px}
.steps__line{position:absolute;left:11%;right:11%;top:22px;height:2px;background:var(--line)}
.steps__fill{display:block;height:100%;width:0;background:var(--ink);transition:width .4s var(--ease)}
.steps__list{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.steps__item{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.steps__dot{width:33px;height:33px;border-radius:50%;background:var(--white);border:1px solid var(--line);color:var(--muted-2);display:grid;place-items:center;font-weight:600;font-size:15px;transition:background-color .3s,color .3s,border-color .3s}
.steps__item.is-active .steps__dot,.steps__item.is-done .steps__dot{background:var(--ink);border-color:var(--ink);color:var(--white)}
.steps__label{font-size:13px;font-weight:500;color:var(--muted-2);line-height:1.25;max-width:16ch}
.steps__item.is-active .steps__label,.steps__item.is-done .steps__label{color:var(--ink)}

.fstep{border:0;margin:0;padding:0;min-inline-size:0;display:flex;flex-direction:column;gap:16px}
.fstep[hidden]{display:none}
.fstep__actions{display:flex;gap:12px;align-items:center}
.field{display:flex;flex-direction:column;gap:6px}
.input{width:100%;background:var(--input);border:1px solid transparent;border-radius:var(--r-sm);padding:14px 18px;font-size:15px;color:var(--ink);transition:border-color .2s,background-color .2s}
.input::placeholder{color:var(--placeholder)}
.input:focus{outline:none;border-color:var(--blue);background:var(--white)}
.input.is-invalid{border-color:var(--red);background:#FEF2F4}
.phonegroup{display:grid;grid-template-columns:92px minmax(0,1fr);gap:10px}
.phonegroup__country{background:var(--input);border-radius:var(--r-sm);display:grid;place-items:center;font-size:15px;font-weight:600}
.field__error{font-size:12.5px;color:var(--red);min-height:0}
.field__error:empty{display:none}

.qblock{display:flex;flex-direction:column;gap:12px}
.qblock__label{font-size:clamp(14px,1.15vw,16px);font-weight:600;line-height:1.4;display:flex;flex-direction:column;gap:4px}
.qblock__n{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
/* step 2 answers: native select — one tap on mobile, keyboard-native on desktop */
.selectwrap{position:relative}
.selectwrap::after{
  content:"";position:absolute;right:18px;top:50%;translate:0 -50%;
  width:11px;height:7px;background:var(--ink);pointer-events:none;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5'  fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/contain;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/contain;
  transition:translate .2s var(--ease);
}
.selectwrap:focus-within::after{translate:0 -50%;opacity:.6}
.select{
  appearance:none;-webkit-appearance:none;
  padding-right:44px;cursor:pointer;
  text-overflow:ellipsis;
}
.select.is-placeholder{color:var(--placeholder)}
.select option{color:var(--ink)}
.select option[value=""]{color:var(--placeholder)}

.fstep--cal{gap:14px}
.calwrap{width:100%;min-height:720px;border-radius:var(--r-sm);overflow:hidden}
.calwrap>div,.calwrap .calendly-inline-widget{min-width:280px;width:100%;height:100%}
.calwrap iframe{width:100%!important;height:100%!important;min-height:inherit;border:0;display:block}

/* ---------- 25. FAQ ---------- */
.faq{margin-top:clamp(28px,3.4vw,52px);max-width:890px;margin-inline:auto}
.faq__item{border-bottom:1px solid var(--line)}
.faq__q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 0;text-align:left;font-size:clamp(15px,1.25vw,18px);font-weight:500;color:#0C0C0D;transition:color .2s}
.faq__q:hover{color:var(--blue)}
.faq__sign{position:relative;width:18px;height:18px;flex:none}
.faq__sign::before,.faq__sign::after{content:"";position:absolute;left:50%;top:50%;background:currentColor;translate:-50% -50%;transition:opacity .25s var(--ease),rotate .3s var(--ease)}
.faq__sign::before{width:16px;height:2px}
.faq__sign::after{width:2px;height:16px}
.faq__item.is-open .faq__sign::before{rotate:45deg}
.faq__item.is-open .faq__sign::after{rotate:45deg}
.faq__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s var(--ease)}
.faq__a>p{overflow:hidden;font-size:15px;line-height:1.55;color:var(--grey)}
.faq__item.is-open .faq__a{grid-template-rows:1fr}
.faq__item.is-open .faq__a>p{padding-bottom:26px}

/* ---------- 26. FOOTER ---------- */
.footer{background:var(--navy);color:var(--white);padding-block:60px 40px}
.footer__grid{display:grid;grid-template-columns:minmax(0,428px) minmax(0,1fr);gap:40px;align-items:start}
.footer__brand img{width:137px;height:auto;margin-bottom:18px}
.footer__brand p{font-size:14px;line-height:1.5;color:#F7F7F8;max-width:400px}
.footer__nav{display:flex;flex-direction:column;gap:26px}
.footer__cols{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;font-weight:700;font-size:16px}
.footer__links{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:center;font-size:14px;font-weight:600;color:#F7F7F8}
.footer__links a:hover{color:var(--blue)}
.footer__social{display:flex;gap:26px;justify-content:flex-end}
.footer__social svg{width:22px;height:22px;fill:var(--blue);transition:transform .25s var(--ease)}
.footer__social a:hover svg{transform:translateY(-2px)}
.footer__copy{margin-top:36px;padding-top:24px;border-top:1px solid rgba(255,255,255,.16);text-align:center;font-size:14px;font-weight:600;color:#F7F7F8}

/* ---------- 27. MODALS ---------- */
.modal{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:20px}
.modal[hidden]{display:none}
.modal__backdrop{position:absolute;inset:0;background:rgba(2,24,54,.72);backdrop-filter:blur(4px);animation:fade .3s var(--ease) both}
.modal__dialog{position:relative;z-index:2;width:100%;animation:pop .35s var(--ease) both}
.modal__dialog--video{max-width:1000px}
.modal__dialog--form{max-width:660px;max-height:calc(100vh - 40px);overflow:auto;background:var(--white);border-radius:var(--r-card);box-shadow:var(--shadow-pop);-webkit-overflow-scrolling:touch}
.modal__dialog--form .formcard{padding:clamp(22px,4vw,40px)}
.modal__close{position:absolute;top:-46px;right:0;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.16);color:var(--white);font-size:24px;line-height:1;display:grid;place-items:center;transition:background-color .2s}
.modal__close:hover{background:rgba(255,255,255,.3)}
.modal__close--dark{top:12px;right:12px;background:var(--sand);color:var(--ink);z-index:3}
.modal__close--dark:hover{background:var(--line)}
.modal__video{position:relative;aspect-ratio:16/9;background:#000;border-radius:var(--r-card);overflow:hidden}
.modal__video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes pop{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
body.is-locked{overflow:hidden}

/* ---------- 28. SCROLL REVEAL ---------- */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.is-in{opacity:1;transform:none}

/* ---------- 29. SWIPER TWEAKS ---------- */
.swiper{width:100%}
/* clip sideways so off-screen slides never widen the page, but let card
   shadows breathe vertically (overflow:clip is the only value that pairs
   with overflow-y:visible) */
.swiper--cards,.swiper--videos,.swiper--benefits,.swiper--compare{overflow:hidden}
@supports (overflow:clip){
  .swiper--cards,.swiper--videos,.swiper--benefits,.swiper--compare{overflow-x:clip;overflow-y:visible}
}
.swiper-slide{height:auto}
.swiper--cards .swiper-slide,.swiper--benefits .swiper-slide,.swiper--videos .swiper-slide{display:flex}
.swiper--cards .swiper-slide>*,.swiper--benefits .swiper-slide>*,.swiper--videos .swiper-slide>*{width:100%}
.swiper-pagination{position:static;margin-top:20px}
.swiper-pagination-bullet{background:var(--ink);opacity:.22;width:8px;height:8px}
.swiper-pagination-bullet-active{background:var(--blue);opacity:1;width:22px;border-radius:4px}
.section--navy .swiper-pagination-bullet{background:var(--white)}
.section--navy .swiper-pagination-bullet-active{background:var(--blue)}

/* =========================================================
   30. RESPONSIVE
   ========================================================= */
@media (max-width:1439px){
  .hero__portrait{right:0;width:clamp(200px,24vw,341px)}
}
@media (max-width:1200px){
  .facts{grid-template-columns:repeat(4,max-content) minmax(220px,1fr);padding:28px 32px;gap:22px 32px}
  .facts__item:nth-child(4)::before,.facts__item:nth-child(1)::before{display:none}
  .facts__item--wide{grid-column:span 3}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .gallery img{height:280px}
}
@media (max-width:1024px){
  .split,.split--top,.tabs,.kitpanel,.certificate,.network,.booking,.storycard,.review{grid-template-columns:minmax(0,1fr)}
  .tabs__panels{min-height:0}
  .footer__grid{grid-template-columns:minmax(0,1fr)}
  .footer__links{grid-template-columns:1fr 1fr auto}
  .footer__social{justify-content:flex-start}
  .hero__portrait{opacity:.9}
  .pathpanel{background:var(--white);box-shadow:var(--shadow-card)}
  .pathpanel__img{
    height: 280px;
        width: 100%;
        object-fit: cover;
        object-position: top center;
  }
  .pathpanel__person{position:static;padding:18px 32px 0;color:var(--ink);text-shadow:none;max-width:none}
  .pathpanel__card{position:static;width:100%;max-width:none;padding:14px 32px 32px;border-radius:0 0 var(--r-card) var(--r-card);box-shadow:none}
  /* tab list becomes full-width pills once the two-column layout collapses */
  .tabs__list{gap:10px}
  .tabs__tab{padding:14px 18px;border-radius:var(--r-sm);background:var(--sand);font-size:clamp(15px,1.9vw,18px);font-weight:500}
  .tabs__tab::before{display:none}
  .tabs__tab.is-active{background:var(--blue);color:var(--white)}
  .tabs__list--bar{background:var(--blue-tint)}
  .tabs__list--bar .tabs__tab{background:transparent;font-size:13px}
  .tabs__list--bar .tabs__tab.is-active{background:var(--white);color:var(--ink)}
  .planstep{flex-basis:min(618px,84vw)}
}
@media (max-width:900px){
  .storycard{grid-template-columns:minmax(0,1fr)}
  .storycard__media img{height:420px}
  .review__media img{height:240px}
  .kitpanel__media img{height:300px}
  .bigstory{min-height:0;flex-direction:column}
  .bigstory__bg{position:relative;height:260px;object-position:center}
  .bigstory__body{max-width:none}
  .bigstory__tags{position:static;flex-direction:row;flex-wrap:wrap;align-items:flex-start;padding:0 clamp(24px,3.2vw,58px) clamp(24px,3.2vw,58px)}
  .swiper {
    overflow: visible;
  }
}

.main-content {
  /* clip, not hidden: `hidden` makes this a scroll container, which turns
     .hscroll__sticky into the child of a non-scrolling scrollport and kills
     the pin. `clip` cuts the same overflow without creating one. */
  overflow-x: clip;
}
@media (max-width:767px){
  :root{--section-y:56px}
  .hero{padding-bottom:70px}
  .hero__portrait{display:none}
  .hero__scrim{background:linear-gradient(180deg,#021836 0%,rgba(2,24,54,.82) 34%,rgba(2,24,54,.55) 62%,rgba(2,24,54,.88) 100%)}
  .hero__title{max-width:none}
  .facts{grid-template-columns:1fr 1fr;padding:20px;gap:14px;background:rgba(255,255,255,.08);backdrop-filter:blur(10px);color:var(--white);box-shadow:none}
  .facts__item{background:rgba(255,255,255,.06);border-radius:var(--r-md);padding:14px}
  .facts__item::before{display:none!important}
  .facts__item--wide{grid-column:span 2}
  .facts__icon svg{width:26px;height:26px}
  .hero__pill-wrap{margin-top:18px}
  .storypill{flex-direction:row;padding:10px 18px;text-align:left; display: none;}
  .storypill__before,.storypill__arrow{display:none}

  .sectionhead{flex-direction:column;align-items:flex-start;gap:16px}
  .sectionhead .chips{order:-1}

  .tabs__list--bar{background:transparent;padding:0;flex-direction:column;gap:10px;overflow:visible}
  .tabs__list--bar .tabs__tab{width:100%;text-align:left;background:var(--sand)}
  .tabs__list--bar .tabs__tab.is-active{background:var(--blue);color:var(--white);box-shadow:none}
  .kitpanel{display:flex;flex-direction:column-reverse;gap:20px}
  .kitpanel__media img{height:220px}

  .module{grid-template-columns:minmax(0,1fr);gap:10px;padding:20px}
  .module__head{flex-direction:row;align-items:flex-start}
  .module__num{color:var(--blue)}
  .included{flex-direction:column;align-items:flex-start;gap:10px}

  .storycard__media img{height:300px}
  .review{gap:18px}
  .review__media img{height:200px}
  .review__body{gap:12px}
  .review__logo{order:2;height:26px}
  .review__quote{order:0}
  .review__author{order:1}

  .certificate__media{order:-1}
  .gallery{grid-template-columns:1fr 1fr;gap:12px}
  .gallery img{height:auto; width: 100%;}

  .kitfooter,.storiesfoot{flex-direction:column;align-items:stretch}
  .kitfooter .btn,.storiesfoot .btn{width:100%}
  .alertbox{justify-content:center}
  .navbtns{justify-content:center}

  /* horizontal scroll → vertical stack */
  .hscroll{background:var(--navy)}
  .hscroll__sticky{position:static;height:auto;min-height:0;display:flex;flex-direction:column;gap:36px;padding-block:56px;overflow:visible}
  .hscroll__viewport{overflow:visible;align-items:stretch;margin-top:0}
  .hscroll__track{flex-direction:column;gap:44px;transform:none!important;padding-inline:var(--gutter)}
  /* stack is static here, so the viewport-height cap must not shrink the art */
  .callstack:has(> img){flex:none}
  .callstack > img,
  .planstep__media > img{max-height:none}
  .planstep{flex:1 1 auto;max-width:none}
  .planstep__eyebrow::after{display:none}
  .callstack{flex:none;height:auto;display:flex;flex-direction:column;gap:14px;position:relative}
  .callstack figure,
  .callstack .callstack__a,
  .callstack .callstack__b,
  .callstack--wide .callstack__a,
  .callstack--wide .callstack__b{position:relative;left:auto;right:auto;top:auto;width:100%;height:auto;aspect-ratio:4/3}
  .callstack--wide .callstack__b{aspect-ratio:1/1}
  .chatbubble{position:absolute;left:auto;right:0;top:calc(50% - 40px);width:min(340px,92%);z-index:5}
  .planstep__media{flex:none}
  .planstep__media img,.planstep__media--cta img{
    width: 100%;
    height: auto;
  }
  .planstep__cta{position:static;margin-top:14px;width:100%}
  .hscroll__progress{display:none}

  .plan{min-height:0;padding:24px}
  .plan--featured{min-height:0}
  .booking__right .formcard{padding:22px}
  .advisors{gap:14px}
  .advisors img{width:140px}
  .steps__label{font-size:11px;max-width:12ch}
  .steps__line{left:16%;right:16%}
  .calwrap{min-height:1050px}
  .faq__q{padding:20px 0}
  .footer__cols,.footer__links{grid-template-columns:1fr 1fr}
  .footer__social{grid-column:span 2;justify-content:flex-start;margin-top:8px}
  .modal__close{top:-42px}
}
@media (max-width:520px){
  .facts{gap:10px}
  .facts__value{font-size:17px}
  .facts__label{font-size:12.5px}
  .gallery{grid-template-columns:1fr}
  .rating__score{font-size:22px}
  .fstep__actions{flex-direction:column-reverse;align-items:stretch}
}

/* ---------- 31. MOTION SAFETY ---------- */
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
}

/* =========================================================
   32. LEGAL PAGE (guarantee terms / privacy-notice style)
   Used by launch-guarantee.html
   ========================================================= */
.legalbar{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.legalbar__inner{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:14px}
.legalbar__logo img{width:118px;height:auto}
.legalbar__actions{display:flex;align-items:center;gap:14px}
.legalbar__back{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);transition:color .2s}
.legalbar__back:hover{color:var(--blue)}
.legalbar__back .btn__arrow{width:15px;height:15px;background:currentColor;rotate:180deg}

.legalhero{background:var(--sand);padding-block:clamp(44px,6vw,84px)}
.legalhero__inner{max-width:820px}
.legalhero__eyebrow{font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin:0 0 14px}
.legalhero__title{font-family:var(--font-display);font-weight:600;font-size:clamp(30px,4.6vw,60px);line-height:1.03;letter-spacing:-.01em}
.legalhero__claim{margin-top:18px;font-size:clamp(17px,1.7vw,24px);font-weight:600;line-height:1.35;color:var(--ink)}
.legalhero__meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.legalhero__meta span{display:inline-flex;align-items:center;padding:7px 16px;border-radius:var(--r-pill);background:var(--white);font-size:13px;font-weight:600;color:var(--muted)}

.legal{padding-block:clamp(40px,5vw,72px)}
.legal__grid{display:grid;grid-template-columns:minmax(0,238px) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:start}

.legaltoc{position:sticky;top:88px}
.legaltoc__title{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2);margin:0 0 14px}
.legaltoc ol{counter-reset:toc;display:flex;flex-direction:column;gap:2px}
.legaltoc a{display:flex;gap:10px;padding:8px 12px;border-radius:var(--r-sm);font-size:14px;line-height:1.35;color:var(--muted);transition:background-color .2s,color .2s}
.legaltoc a::before{counter-increment:toc;content:counter(toc);font-weight:700;color:var(--muted-2);font-variant-numeric:tabular-nums}
.legaltoc a:hover{background:var(--sand);color:var(--ink)}
.legaltoc a.is-active{background:var(--blue-tint);color:var(--blue)}
.legaltoc a.is-active::before{color:var(--blue)}

.legalbody{max-width:760px;font-size:16px;line-height:1.65;color:var(--ink)}
.legalbody p{margin:0 0 18px}
.legalbody p:last-child{margin-bottom:0}
.legalbody strong{font-weight:600}
.legalbody a:not(.btn){color:var(--blue);font-weight:500;border-bottom:1px solid rgba(60,137,243,.35)}
.legalbody a:not(.btn):hover{border-bottom-color:currentColor}

.legalsec{padding-top:clamp(34px,3.6vw,52px);margin-top:clamp(34px,3.6vw,52px);border-top:1px solid var(--line);scroll-margin-top:96px}
.legalsec:first-of-type{padding-top:0;margin-top:0;border-top:0}
.legalsec__num{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--blue-tint);color:var(--blue);font-size:14px;font-weight:700;margin-bottom:14px}
.legalsec__title{font-family:var(--font-body);font-weight:700;font-size:clamp(21px,2.1vw,28px);line-height:1.25;margin:0 0 18px}
.legalsec__sub{font-weight:600;font-size:clamp(16px,1.4vw,18px);margin:26px 0 12px}

.legallist{display:flex;flex-direction:column;gap:12px;margin:0 0 18px}
.legallist li{position:relative;padding-left:30px;font-size:15.5px;line-height:1.6;color:var(--grey)}
.legallist li::before{content:"";position:absolute;left:0;top:.42em;width:18px;height:18px;border-radius:50%;background:var(--blue-tint)}
.legallist li::after{content:"";position:absolute;left:4.5px;top:.72em;width:9px;height:5px;border-left:2px solid var(--blue);border-bottom:2px solid var(--blue);rotate:-45deg}
.legallist--plain li::before{width:6px;height:6px;left:6px;top:.72em;background:var(--muted-2)}
.legallist--plain li::after{display:none}

.legalsteps{counter-reset:ls;display:flex;flex-direction:column;gap:16px;margin:0 0 18px}
.legalsteps li{position:relative;padding-left:46px;font-size:15.5px;line-height:1.6;color:var(--grey)}
.legalsteps li::before{counter-increment:ls;content:counter(ls);position:absolute;left:0;top:0;width:30px;height:30px;border-radius:50%;background:var(--navy);color:var(--white);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700}

.callout{border-radius:var(--r-card);padding:clamp(22px,2.6vw,34px);margin:0 0 26px}
.callout--sand{background:var(--sand)}
.callout--blue{background:var(--blue-tint)}
.callout--navy{background:var(--navy);color:var(--white)}
.callout--navy .callout__label{color:#9CC4FA}
.callout--navy p{color:#F1F5FB}
.callout__label{display:block;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-bottom:12px}
.callout p:last-child{margin-bottom:0}

.legalcta{margin-top:clamp(38px,4vw,60px);background:var(--sand);border-radius:var(--r-card);padding:clamp(26px,3.4vw,44px);display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.legalcta h2{font-family:var(--font-body);font-weight:700;font-size:clamp(19px,1.9vw,26px);line-height:1.25}
.legalcta p{color:var(--grey);margin:0}

.legalsign{margin-top:clamp(30px,3vw,44px);padding-top:22px;border-top:1px solid var(--line);font-size:14px;color:var(--muted-2)}

@media (max-width:960px){
  .legal__grid{grid-template-columns:1fr;gap:28px}
  .legaltoc{position:static;background:var(--sand);border-radius:var(--r-card);padding:20px}
  .legaltoc ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px}
  .legalbody{max-width:none}
}
@media (max-width:520px){
  .legaltoc ol{grid-template-columns:1fr}
  .legalbar__back span.legalbar__backtext{display:none}
  .legalcta .btn{width:100%}
}