/* ============================================================
   LEARNBAY — Tresmarescapital-Style Complete Redesign
   Dark institutional hero · Playfair serif · parallax scroll
   · clean white body · fine borders · gold accents
   ============================================================ */

/* ── TOKENS ─────────────────────────────────────────────── */
:root {
  --night:     #08090D;
  --dark:      #0E1017;
  --dark-2:    #12151F;
  --dark-3:    #181C2A;
  --surface-d: #1E2335;
  --white:     #FFFFFF;
  --off-white: #F4F3F0;
  --cream:     #EDE9E2;
  --light-mid: #E4E0D8;
  --gold:      #0072BC;
  --gold-lt:   #1A8FD8;
  --gold-dim:  rgba(0,114,188,.15);
  --t-lt:      #FFFFFF;
  --t-lt2:     rgba(255,255,255,.60);
  --t-lt3:     rgba(255,255,255,.30);
  --t-dk:      #08090D;
  --t-dk2:     #2D3142;
  --t-mid:     #6B6F80;
  --bd-dk:     rgba(255,255,255,.09);
  --bd-dk2:    rgba(255,255,255,.15);
  --bd-lt:     rgba(0,0,0,.08);
  --bd-lt2:    rgba(0,0,0,.14);
  --serif:     'Playfair Display', Georgia, 'Times New Roman', serif;
  --sans:      'DM Sans', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --s1:4px; --s2:8px; --s3:16px; --s4:24px; --s5:32px;
  --s6:48px; --s7:64px; --s8:80px; --s9:96px; --s10:128px;
  --expo: cubic-bezier(.16,1,.3,1);
  --ease: cubic-bezier(.4,0,.2,1);
  --t1:200ms; --t2:400ms; --t3:800ms; --t4:1200ms;
  --mw:1280px; --pad:64px;
}

/* ── KINETIC TYPOGRAPHY LOADER ──────────────────────────────────── */
#lb-loader {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: 900px;
  transition: opacity 0.55s cubic-bezier(.4,0,.2,1), visibility 0.55s;
}
#lb-loader.lb-loader--hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
#lb-loader-text {
  display: flex;
  font-family: 'DM Sans', 'Inter', -apple-system, sans-serif;
  font-size: clamp(52px, 10vw, 120px);
  font-weight: 800;
  letter-spacing: -0.03em;
  white-space: nowrap;
  transform-style: preserve-3d;
}
#lb-loader-text .lb-char {
  display: inline-block;
  animation-duration: 0.7s;
  animation-fill-mode: both;
  animation-timing-function: cubic-bezier(.16,1,.3,1);
  transform-origin: center center;
}
/* "Learn" (chars 1-5) = Learnbay blue, "bay" (chars 6-8) = near-black */
#lb-loader-text .lb-char:nth-child(-n+5) { color: #0072BC; }
#lb-loader-text .lb-char:nth-child(n+6)  { color: #08090D; }

@keyframes lb-fly-in {
  from {
    transform: var(--lb-from);
    opacity: 0;
  }
  to {
    transform: translate3d(0,0,0) rotateX(0deg) rotateY(0deg);
    opacity: 1;
  }
}
@keyframes lb-fly-out {
  from {
    transform: translate3d(0,0,0) rotateX(0deg) rotateY(0deg);
    opacity: 1;
  }
  to {
    transform: var(--lb-to);
    opacity: 0;
  }
}

/* Lock scroll while loader is active */
body.lb-loading {
  overflow: hidden;
}

/* Thin progress bar at bottom of loader */
#lb-loader::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  background: linear-gradient(90deg, #08090D 0%, #0072BC 60%, #1A8FD8 100%);
  animation: lb-progress 7.5s linear forwards;
}
@keyframes lb-progress {
  from { width: 0; }
  to   { width: 100%; }
}

/* ── RESET ──────────────────────────────────────────── */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--sans);background:var(--white);color:var(--t-dk);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;line-height:1.6}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button{font-family:inherit;cursor:pointer}
address{font-style:normal}

/* ── UTILITIES ──────────────────────────────────────────── */
.container{max-width:var(--mw);margin:0 auto;padding:0 var(--pad)}
.label{
  display:block;font-family:var(--sans);font-size:10.5px;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:14px
}
.label--lt{color:rgba(255,255,255,.38)}
.label--mid{color:var(--t-mid)}
.h-display{font-family:var(--serif);font-weight:700;line-height:1.04;letter-spacing:-.02em}
.h-xl{font-size:clamp(52px,8.5vw,110px)}
.h-lg{font-size:clamp(36px,5.5vw,72px)}
.h-md{font-size:clamp(26px,4vw,52px)}
.h-sm{font-size:clamp(20px,2.5vw,34px)}
.h-lt{color:var(--white)}
.h-dk{color:var(--t-dk)}

/* ── BUTTONS ────────────────────────────────────────────── */
.btn-link{
  display:inline-flex;align-items:center;gap:10px;
  font-size:12.5px;font-weight:500;letter-spacing:.06em;
  color:var(--t-dk);position:relative
}
.btn-link::after{
  content:'';position:absolute;bottom:-2px;left:0;width:0;height:1px;
  background:currentColor;transition:width var(--t2) var(--expo)
}
.btn-link:hover::after{width:100%}
.btn-link .arr{display:inline-block;transition:transform var(--t2) var(--expo)}
.btn-link:hover .arr{transform:translateX(5px)}
.btn-link--lt{color:var(--white)}

.btn-outline{
  display:inline-flex;align-items:center;gap:10px;
  padding:13px 26px;border:1px solid currentColor;
  font-family:var(--sans);font-size:11px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;
  transition:background var(--t1),color var(--t1),transform var(--t2) var(--expo)
}
.btn-outline:hover{transform:translateY(-2px)}
.btn-outline--lt{color:var(--white);border-color:rgba(255,255,255,.32)}
.btn-outline--lt:hover{background:var(--white);color:var(--night)}
.btn-outline--dk{color:var(--t-dk);border-color:rgba(0,0,0,.22)}
.btn-outline--dk:hover{background:var(--t-dk);color:var(--white)}
.btn-outline--gold{color:var(--gold);border-color:var(--gold)}
.btn-outline--gold:hover{background:var(--gold);color:var(--white)}

.btn-fill{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 30px;background:var(--white);color:var(--night);
  font-family:var(--sans);font-size:11px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;
  transition:background var(--t1),transform var(--t2) var(--expo)
}
.btn-fill:hover{background:var(--off-white);transform:translateY(-2px)}
.btn-fill--gold{background:var(--gold);color:var(--white)}
.btn-fill--gold:hover{background:var(--gold-lt)}

/* ── SCROLL ANIMATIONS ──────────────────────────────────── */
.reveal{opacity:0;transform:translateY(48px);
  transition:opacity var(--t3) var(--expo),transform var(--t3) var(--expo)}
.reveal.in{opacity:1;transform:translateY(0)}
.reveal-l{opacity:0;transform:translateX(-48px);
  transition:opacity var(--t3) var(--expo),transform var(--t3) var(--expo)}
.reveal-l.in{opacity:1;transform:translateX(0)}
.reveal-r{opacity:0;transform:translateX(48px);
  transition:opacity var(--t3) var(--expo),transform var(--t3) var(--expo)}
.reveal-r.in{opacity:1;transform:translateX(0)}
.d1{transition-delay:.08s}.d2{transition-delay:.18s}.d3{transition-delay:.30s}
.d4{transition-delay:.44s}.d5{transition-delay:.60s}.d6{transition-delay:.78s}

/* Underline draw */
.udraw{position:relative}
.udraw::after{
  content:'';position:absolute;left:0;bottom:-3px;
  width:0;height:1px;background:var(--gold);
  transition:width var(--t4) var(--expo)
}
.udraw.in::after{width:100%}

@media(prefers-reduced-motion:reduce){
  .reveal,.reveal-l,.reveal-r{opacity:1;transform:none;transition:none}
}

/* ── NAVIGATION ─────────────────────────────────────────── */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:500;
  transition:background var(--t2) var(--ease),border-color var(--t2) var(--ease);
  border-bottom:1px solid transparent
}
.nav.scrolled{
  background:rgba(8,9,13,.97);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border-bottom-color:var(--bd-dk)
}
.nav__inner{
  max-width:var(--mw);margin:0 auto;padding:0 var(--pad);
  height:72px;display:flex;align-items:center;gap:var(--s6)
}
.nav__logo{
  display:flex;align-items:center;gap:10px;flex-shrink:0;
  transition:opacity var(--t1)
}
.nav__logo:hover{opacity:.7}
.nav__logo-mark{
  width:30px;height:30px;background:var(--gold);
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:15px;color:var(--white)
}
.nav__wordmark{
  font-size:14.5px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--white)
}
.nav__links{
  display:flex;align-items:center;gap:var(--s6);flex:1;justify-content:center
}
.nav__link{
  font-size:12.5px;font-weight:500;letter-spacing:.04em;
  color:rgba(255,255,255,.52);transition:color var(--t1)
}
.nav__link:hover{color:var(--white)}
.nav__right{display:flex;align-items:center;gap:var(--s4);flex-shrink:0}
.nav__phone{
  font-size:12px;color:rgba(255,255,255,.35);letter-spacing:.03em;transition:color var(--t1)
}
.nav__phone:hover{color:rgba(255,255,255,.7)}
.nav__cta{
  padding:9px 20px;border:1px solid rgba(255,255,255,.26);
  font-size:10.5px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--white);
  transition:background var(--t1),border-color var(--t1)
}
.nav__cta:hover{background:var(--white);color:var(--night);border-color:var(--white)}

.nav__burger{
  display:none;background:none;border:none;
  width:28px;height:18px;flex-direction:column;
  justify-content:space-between;margin-left:auto;flex-shrink:0
}
.nav__burger span{
  display:block;height:1.5px;background:var(--white);
  transition:transform var(--t2) var(--expo),opacity var(--t1)
}
.nav__mobile{display:none;background:rgba(8,9,13,.98);border-bottom:1px solid var(--bd-dk)}
.nav__mobile.open{display:block}
.nav__mobile-inner{
  padding:24px var(--pad) 36px;display:flex;flex-direction:column;gap:16px
}
.nav__mobile-inner a{
  font-size:15px;font-weight:500;color:rgba(255,255,255,.6);
  letter-spacing:.04em;transition:color var(--t1)
}
.nav__mobile-inner a:hover{color:var(--white)}

/* ── HERO ────────────────────────────────────────────────── */
.hero{
  position:relative;height:100vh;min-height:700px;
  display:flex;flex-direction:column;background:var(--night);overflow:hidden
}
/* Matrix background effect */
.matrix-container {
  width: 100%;
  height: 100%;
  perspective: 1500px;
  position: absolute;
  inset: 0;
  background-color: #0d0d1a;
  overflow: hidden;
  z-index: 1;
}

.matrix-grid {
  width: 100%;
  height: 100%;
  background: linear-gradient(#262645 1px, transparent 1px),
    linear-gradient(90deg, #262645 1px, transparent 1px),
    repeating-linear-gradient(
      45deg,
      rgba(0, 255, 170, 0.05) 0px 1px,
      transparent 1px 12px
    ),
    repeating-linear-gradient(
      -45deg,
      rgba(0, 255, 170, 0.05) 0px 1px,
      transparent 1px 12px
    ),
    radial-gradient(circle at center, #0a0a1a 0%, #000 100%);
  background-size:
    28px 28px,
    28px 28px,
    50px 50px,
    50px 50px,
    cover;
  border: 1px solid rgba(0, 255, 170, 0.1);
  box-shadow:
    inset 0 0 40px rgba(0, 255, 170, 0.1),
    0 0 60px rgba(0, 255, 170, 0.15);
  transform-style: preserve-3d;
  transition: all 0.6s ease-in-out;
  position: relative;
}

.matrix-grid::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(0, 255, 170, 0.4),
    transparent
  );
  animation: borderFlow 6s linear infinite;
  pointer-events: none;
  mask:
    linear-gradient(#fff 0 0) padding-box,
    linear-gradient(#fff 0 0);
  mask-composite: exclude;
}

.matrix-grid::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 160px;
  height: 160px;
  background: radial-gradient(
    circle,
    rgba(0, 255, 170, 0.15) 0%,
    transparent 70%
  );
  transform: translate(-50%, -50%);
  animation: pulse 3.5s ease-in-out infinite alternate;
  z-index: 1;
}

@keyframes borderFlow {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 200% 50%;
  }
}

@keyframes pulse {
  0% {
    transform: translate(-50%, -50%) scale(0.85);
    opacity: 0.2;
  }
  100% {
    transform: translate(-50%, -50%) scale(1.1);
    opacity: 0.5;
  }
}

/* Parallax bg — translated via JS */
.hero__bg{
  position:absolute;inset:-25% 0;
  background:
    radial-gradient(ellipse 65% 55% at 20% 45%,rgba(30,55,140,.22) 0%,transparent 65%),
    radial-gradient(ellipse 45% 35% at 85% 75%,rgba(184,134,42,.07) 0%,transparent 55%),
    linear-gradient(160deg,#0D1020 0%,#070910 45%,#0A0810 100%);
  will-change:transform
}
/* Subtle dot grid overlay */
.hero__dots{
  position:absolute;inset:0;
  background-image:radial-gradient(circle,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:40px 40px;
  mask-image:radial-gradient(ellipse 75% 70% at 40% 50%,black,transparent);
  -webkit-mask-image:radial-gradient(ellipse 75% 70% at 40% 50%,black,transparent);
  pointer-events:none
}
/* Content area — also has parallax */
.hero__content{
  flex:1;display:flex;align-items:center;
  padding-top:72px;position:relative;z-index:2;
  will-change:transform,opacity
}
.hero__text{padding-top:var(--s5);max-width:860px}
.hero__eyebrow{
  display:flex;align-items:center;gap:14px;
  font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(255,255,255,.35);margin-bottom:var(--s5)
}
.hero__eyebrow-rule{width:36px;height:1px;background:var(--gold);flex-shrink:0}
.hero__title{
  font-family:var(--serif);
  font-size:clamp(60px,9.5vw,128px);
  font-weight:700;line-height:.93;letter-spacing:-.03em;
  color:var(--white);margin-bottom:var(--s5)
}
.hero__title em{
  font-style:italic;font-weight:400;
  color:rgba(255,255,255,.45)
}
.hero__sub{
  font-size:clamp(15px,1.6vw,19px);color:rgba(255,255,255,.5);
  line-height:1.75;max-width:520px;margin-bottom:var(--s6)
}
.hero__actions{display:flex;align-items:center;gap:var(--s5);flex-wrap:wrap;margin-bottom:var(--s9)}

/* Stats bar — standalone dark section below hero */
.hero__bar{
  background:linear-gradient(160deg,#0D1020 0%,#070910 100%);
  border-bottom:1px solid rgba(255,255,255,.06)
}
.hero__bar-inner{
  max-width:var(--mw);margin:0 auto;padding:0 var(--pad);
  display:grid;grid-template-columns:repeat(5,1fr)
}
.hstat{
  padding:36px var(--s4);
  border-right:1px solid rgba(255,255,255,.09);
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px
}
.hstat:last-child{border-right:none}
.hstat__num{
  font-family:var(--serif);font-size:clamp(26px,3.5vw,44px);
  font-weight:700;color:var(--white);line-height:1;letter-spacing:-.025em
}
.hstat__num sup{font-size:.45em;font-weight:400;color:var(--gold-lt);letter-spacing:0;vertical-align:super}
.hstat__label{
  font-size:10.5px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:rgba(255,255,255,.38)
}

/* ── MARQUEE ─────────────────────────────────────────────── */
.marquee-wrap{
  border-bottom:1px solid var(--bd-lt);
  padding:24px 0 20px;overflow:hidden;background:var(--white)
}
.marquee-ttl{
  text-align:center;font-size:9.5px;font-weight:700;letter-spacing:.22em;
  text-transform:uppercase;color:var(--t-mid);opacity:.5;margin-bottom:16px
}
.marquee{display:flex;overflow:hidden;user-select:none}
.mtrack{
  display:flex;flex-shrink:0;
  animation:mscroll 50s linear infinite
}
.marquee:hover .mtrack{animation-play-state:paused}
.mitem{
  display:inline-flex;align-items:center;
  padding:0 36px;font-size:13px;font-weight:600;
  letter-spacing:.05em;color:var(--t-mid);white-space:nowrap;opacity:.6;transition:opacity var(--t1)
}
.mitem:hover{opacity:1}
.mdot{
  display:inline-block;width:3px;height:3px;border-radius:50%;
  background:var(--gold);opacity:.45;flex-shrink:0;align-self:center
}
@keyframes mscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── INTRO STRIP ─────────────────────────────────────────── */
.intro{padding:var(--s10) 0;border-bottom:1px solid var(--bd-lt)}
.intro__grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s8);align-items:end}
.intro__body p{
  font-size:clamp(16px,1.8vw,20px);line-height:1.8;
  color:var(--t-dk2);margin-top:var(--s4);max-width:480px
}
.intro__right{display:flex;flex-direction:column;gap:var(--s4);justify-content:flex-end}
.intro__stat{
  display:flex;align-items:baseline;gap:var(--s2);
  padding:var(--s4) 0;border-bottom:1px solid var(--bd-lt)
}
.intro__stat:first-child{border-top:1px solid var(--bd-lt)}
.intro__stat-num{
  font-family:var(--serif);font-size:clamp(32px,4vw,52px);
  font-weight:700;color:var(--t-dk);line-height:1;letter-spacing:-.025em;flex-shrink:0;width:90px
}
.intro__stat-label{font-size:13px;color:var(--t-mid);line-height:1.55}

/* ── PROGRAMS SECTION ────────────────────────────────────── */
.programs{padding:var(--s10) 0;border-bottom:1px solid var(--bd-lt)}
.programs__head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:var(--s6);margin-bottom:var(--s7);
  padding-bottom:var(--s5);border-bottom:1px solid var(--bd-lt)
}
.programs-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--bd-lt);border-left:1px solid var(--bd-lt)
}
.pcard{
  border-right:1px solid var(--bd-lt);border-bottom:1px solid var(--bd-lt);
  padding:var(--s5);display:flex;flex-direction:column;
  position:relative;overflow:hidden;transition:background var(--t1)
}
.pcard:hover{background:var(--off-white)}
.pcard::before{
  content:'';position:absolute;top:0;left:0;
  width:0;height:2px;background:var(--gold);
  transition:width var(--t3) var(--expo)
}
.pcard:hover::before{width:100%}
.pcard__num{
  font-family:var(--serif);font-size:12px;font-weight:400;
  color:var(--t-mid);opacity:.4;margin-bottom:var(--s3)
}
.pcard__dur{
  font-size:10px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold);display:block;margin-bottom:var(--s2)
}
.pcard__title{
  font-family:var(--serif);font-size:clamp(17px,1.8vw,22px);
  font-weight:700;line-height:1.2;color:var(--t-dk);
  margin-bottom:var(--s3);flex:1
}
.pcard__desc{font-size:13px;color:var(--t-mid);line-height:1.65;margin-bottom:var(--s4)}
.pcard__tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:var(--s4)}
.pcard__tag{
  font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  padding:3px 9px;border:1px solid var(--bd-lt2);color:var(--t-mid)
}
.pcard__foot{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:var(--s3);border-top:1px solid var(--bd-lt);margin-top:auto
}
.pcard__fee{font-family:var(--serif);font-size:17px;font-weight:700;color:var(--t-dk)}

/* VIDEO TESTIMONIALS */
.video-testimonials{
  padding:var(--s10) 0;
  background:var(--white);
  border-bottom:1px solid var(--bd-lt)
}
.video-testimonials__hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,340px);
  gap:var(--s8);
  align-items:center;
  padding-bottom:var(--s8);
  border-bottom:1px solid var(--bd-lt)
}
.video-testimonials__copy{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--s4);
  max-width:640px
}
.video-testimonials__copy h2{text-align:left;margin:0}
.video-testimonials__copy p{
  font-size:clamp(15px,1.6vw,18px);
  color:var(--t-mid);
  line-height:1.8;
  max-width:520px;
  margin:0
}
.vtest-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:var(--s6);
  align-items:start;
  padding-top:var(--s8)
}
.vtest-card{
  position:relative;
  display:block;
  overflow:hidden;
  border-radius:22px;
  background:#1d1d1d;
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 20px 60px rgba(0,0,0,.12);
  cursor:pointer;
  aspect-ratio:240/425;
  isolation:isolate;
  transition:transform var(--t2) var(--expo),box-shadow var(--t2) var(--expo)
}
.vtest-card--feature{
  width:min(100%,300px);
  justify-self:end
}
.vtest-card--drop{margin-top:3vh}
.vtest-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform var(--t3) var(--expo),filter var(--t2)
}
.vtest-card::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,0) 42%,rgba(0,0,0,.18) 100%);
  z-index:1;
  pointer-events:none
}
.vtest-card:hover,
.vtest-card:focus-visible{
  transform:translateY(-8px);
  box-shadow:0 28px 76px rgba(0,0,0,.18);
  outline:none
}
.vtest-card:hover img,
.vtest-card:focus-visible img{transform:scale(1.035);filter:saturate(1.04)}
.video-modal{
  position:fixed;
  inset:0;
  z-index:1000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px
}
.video-modal.is-open{display:flex}
.video-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(8,10,14,.78);
  backdrop-filter:blur(8px)
}
.video-modal__dialog{
  position:relative;
  z-index:1;
  width:min(980px,100%);
  background:#070707;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 34px 100px rgba(0,0,0,.45)
}
.video-modal__frame{
  position:relative;
  width:100%;
  aspect-ratio:16/9
}
.video-modal__frame iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0
}
.video-modal__close{
  position:absolute;
  right:-14px;
  top:-14px;
  z-index:2;
  width:38px;
  height:38px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:50%;
  background:var(--white);
  color:var(--t-dk);
  font-size:26px;
  line-height:1;
  cursor:pointer;
  box-shadow:0 12px 34px rgba(0,0,0,.28)
}

/* ── WHY SECTION (dark) ─────────────────────────────────── */
.why{background:var(--dark);padding:var(--s10) 0;border-top:1px solid var(--bd-dk)}
.why__head{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s7);align-items:end;
  margin-bottom:var(--s8);padding-bottom:var(--s7);border-bottom:1px solid var(--bd-dk)
}
.why__desc{
  font-size:clamp(15px,1.6vw,18px);color:rgba(255,255,255,.42);
  line-height:1.8;max-width:460px;align-self:end
}
.why-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--bd-dk)
}
.witem{
  padding:var(--s7) var(--s5);
  border-right:1px solid var(--bd-dk);
  display:flex;flex-direction:column;gap:var(--s4)
}
.witem:first-child{padding-left:0}
.witem:last-child{border-right:none;padding-right:0}
.witem__n{
  font-family:var(--serif);font-size:48px;font-weight:300;
  color:rgba(255,255,255,.05);line-height:1;margin-bottom:var(--s2)
}
.witem__title{font-size:16px;font-weight:600;color:var(--white);line-height:1.3}
.witem__text{font-size:13.5px;color:rgba(255,255,255,.38);line-height:1.8}

/* ── STATS (counter) ─────────────────────────────────────── */
.counters{padding:var(--s10) 0;border-bottom:1px solid var(--bd-lt)}
.counters__wrap{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s10);align-items:center
}
.counters__text p{font-size:16px;color:var(--t-mid);line-height:1.8;margin-top:var(--s4)}
.counters__text{
  padding-right:var(--s7);border-right:1px solid var(--bd-lt)
}
.cstat-grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:1px;background:var(--bd-lt2);border:1px solid var(--bd-lt2)
}
.cstat{
  background:var(--white);padding:var(--s6);
  display:flex;flex-direction:column;gap:var(--s2)
}
.cstat__n{
  font-family:var(--serif);font-size:clamp(40px,5vw,64px);
  font-weight:700;color:var(--t-dk);line-height:1;letter-spacing:-.03em;
  display:flex;align-items:baseline;gap:4px
}
.cstat__suf{font-size:.45em;font-weight:400;color:var(--gold);letter-spacing:0}
.cstat__lbl{
  font-size:10.5px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--t-mid);opacity:.6
}
.cstat__sub{font-size:12.5px;color:var(--t-mid);line-height:1.5;margin-top:2px}

/* ── CERTIFICATIONS / PARTNERS ──────────────────────────── */
.certs{
  padding:var(--s10) 0;border-bottom:1px solid var(--bd-lt);
  background:var(--off-white)
}
.certs__head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:var(--s6);margin-bottom:var(--s7);
  padding-bottom:var(--s5);border-bottom:1px solid var(--bd-lt)
}
.cert-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:1px;background:var(--bd-lt2);border:1px solid var(--bd-lt2);
  margin-bottom:var(--s8)
}
.cert-item{
  background:var(--off-white);padding:var(--s5) var(--s5);
  display:flex;flex-direction:column;gap:var(--s3);
  transition:background var(--t1)
}
.cert-item:hover{background:var(--white)}
.cert-item__logo{height:40px;display:flex;align-items:center}
.cert-item__logo svg{height:100%;width:auto;max-width:140px}
.cert-item__name{font-size:13px;font-weight:600;color:var(--t-dk2)}
.cert-item__type{
  font-size:10px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--t-mid)
}

/* Hiring sub-head */
.hire-head{margin-bottom:var(--s5);padding-bottom:var(--s4);border-bottom:1px solid var(--bd-lt)}
.hire-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:1px;background:var(--bd-lt2);border:1px solid var(--bd-lt2)
}
.hire-item{
  background:var(--off-white);padding:28px 32px;
  display:flex;align-items:center;justify-content:center;
  min-height:90px;transition:background var(--t1),transform var(--t2) var(--expo)
}
.hire-item:hover{background:var(--white);transform:translateY(-2px)}
.hire-item svg{height:28px;width:auto;max-width:140px;display:block}
.hire-item .logo-text{
  font-size:14px;font-weight:700;letter-spacing:.05em;color:var(--t-mid);
  transition:color var(--t1)
}
.hire-item:hover .logo-text{color:var(--t-dk)}

.flow-art-wrap{
  position:relative;
  background:var(--white);
  z-index:1
}
.flow-art-wrap [data-flow-section]{
  position:sticky;top:0;height:100vh;min-height:100vh;width:100%;overflow:hidden;
  will-change:transform,opacity
}
.flow-art-container{
  position:relative;height:100vh;min-height:100vh;width:100%;
  display:flex;flex-direction:column;justify-content:center;
  gap:var(--s5);padding-top:clamp(36px,6vw,56px);padding-bottom:clamp(36px,4vw,56px);
  transform-origin:bottom left;will-change:transform
}
.flow-panel{
  border-top:none;border-bottom:none
}
.flow-panel.why,
.flow-panel.counters,
.flow-panel.certs{padding:0}

.flow-panel.counters{background:var(--white)}
.flow-panel.certs{background:var(--off-white)}
.flow-panel--hiring{
  background:var(--white);
  box-shadow:0 -1px 0 var(--bd-lt) inset
}
.flow-panel .why__head,
.flow-panel .certs__head{margin-bottom:0}
.flow-panel .why-grid,
.flow-panel .cert-grid,
.flow-panel .hire-grid{flex:0 1 auto}
.flow-panel .cert-grid{margin-bottom:0}
.flow-panel .hire-head{margin-bottom:var(--s5)}
.flow-panel .media-strip{margin-top:var(--s5)}
.flow-panel .why__head{padding-bottom:var(--s5)}
.flow-panel .witem{padding:var(--s5) var(--s4);gap:var(--s3)}
.flow-panel .witem__n{font-size:38px;margin-bottom:0}
.flow-panel .witem__text{font-size:13px;line-height:1.65}
.flow-panel .cstat{padding:var(--s5)}
.flow-panel .cert-item{padding:var(--s4)}
.flow-panel .hire-item{min-height:78px;padding:22px 26px}
.testi,
.cta,
.footer{
  position:relative;
  z-index:5
}

@media(max-width:900px){
  .flow-art-wrap [data-flow-section]{position:relative;top:auto;height:auto;min-height:auto}
  .flow-art-container{height:auto;min-height:auto;padding-top:var(--s8);padding-bottom:var(--s8)}
}

/* Media bar */
.media-strip{
  display:flex;align-items:center;gap:var(--s6);
  margin-top:var(--s7);padding-top:var(--s5);
  border-top:1px solid var(--bd-lt);flex-wrap:wrap
}
.media-strip__lbl{
  font-size:10px;font-weight:700;letter-spacing:.2em;
  text-transform:uppercase;color:var(--t-mid);opacity:.5;flex-shrink:0
}
.media-strip__items{display:flex;gap:var(--s5);flex-wrap:wrap}
.media-strip__items span{font-size:12.5px;font-weight:600;color:var(--t-mid);opacity:.55}


/* ── TESTIMONIALS (dark) ─────────────────────────────────── */
.testi{background:var(--night);padding:var(--s10) 0;border-top:1px solid var(--bd-dk)}
.testi__head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:var(--s6);margin-bottom:var(--s8);
  padding-bottom:var(--s6);border-bottom:1px solid var(--bd-dk)
}
.testi-wrap{overflow:hidden;position:relative}
.testi-track{display:flex;transition:transform .65s var(--expo)}
.tslide{
  min-width:100%;padding:var(--s7) 0;border-bottom:1px solid var(--bd-dk)
}
.tslide__q{
  font-family:var(--serif);font-style:italic;
  font-size:clamp(18px,2.5vw,30px);font-weight:400;
  color:rgba(255,255,255,.82);line-height:1.55;
  max-width:800px;margin-bottom:var(--s5);
  position:relative;padding-left:60px
}
.tslide__q::before{
  content:'\201C';position:absolute;left:0;top:-12px;
  font-size:80px;line-height:1;color:var(--gold);opacity:.3;font-style:normal
}
.tslide__meta{display:flex;align-items:center;gap:var(--s4);padding-left:60px}
.tslide__av{
  width:44px;height:44px;border-radius:50%;
  background:var(--dark-3);border:1px solid var(--bd-dk2);
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:13px;color:var(--white);flex-shrink:0
}
.tslide__name{font-size:14px;font-weight:600;color:var(--white)}
.tslide__role{font-size:12px;color:rgba(255,255,255,.35);margin-top:2px}
.tslide__co{
  margin-left:auto;font-size:10.5px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--gold);border:1px solid rgba(184,134,42,.28);padding:5px 12px
}
.testi-ctrl{display:flex;align-items:center;gap:var(--s4);padding-top:var(--s5)}
.tarr{
  width:44px;height:44px;border:1px solid var(--bd-dk2);background:none;
  color:rgba(255,255,255,.45);display:flex;align-items:center;justify-content:center;
  font-size:18px;transition:border-color var(--t1),color var(--t1),background var(--t1)
}
.tarr:hover{border-color:rgba(255,255,255,.5);color:var(--white);background:rgba(255,255,255,.04)}
.tdots{display:flex;gap:8px}
.tdot{
  width:6px;height:6px;border-radius:50%;
  background:rgba(255,255,255,.2);border:none;padding:0;
  transition:background var(--t1),width var(--t2) var(--expo)
}
.tdot.on{background:var(--white);width:24px;border-radius:3px}

.testi .testi-wrap,
.testi .testi-ctrl{display:none}
.scroll-reel{
  --reel-cell:121.33px;
  --reel-gap:8px;
  position:relative;display:flex;align-items:stretch;gap:10px;
  width:100%;max-width:1060px;min-height:320px;overflow:hidden;
  border:1px solid var(--bd-dk2);border-radius:12px;
  background:#f1f0ec;color:var(--t-dk);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.95),0 28px 80px rgba(0,0,0,.22);
  outline:none
}
.scroll-reel:focus-visible{box-shadow:inset 0 2px 0 rgba(255,255,255,.95),0 0 0 2px rgba(207,160,66,.55),0 28px 80px rgba(0,0,0,.22)}
.scroll-reel__data{display:none}
.scroll-reel__media{
  position:relative;width:380px;min-height:320px;flex-shrink:0;overflow:hidden;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 14%,#000 86%,transparent 100%),linear-gradient(to bottom,transparent 0%,#000 10%,#000 90%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0%,#000 14%,#000 86%,transparent 100%),linear-gradient(to bottom,transparent 0%,#000 10%,#000 90%,transparent 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect
}
.scroll-reel__cols{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:var(--reel-gap)}
.scroll-reel__col{display:flex;flex-direction:column;gap:var(--reel-gap);flex-shrink:0;will-change:transform}
.scroll-reel.is-mounted .scroll-reel__col{transition:transform .8s cubic-bezier(.65,0,.35,1)}
.scroll-reel__cell,
.scroll-reel__featured{width:var(--reel-cell);height:var(--reel-cell);flex-shrink:0;border-radius:12px}
.scroll-reel__cell{
  border:1px solid rgba(0,0,0,.08);
  background:linear-gradient(180deg,#dedbd4,#f8f7f4);
  filter:blur(1px);
  box-shadow:0 1px 2px rgba(0,0,0,.05),inset 0 2px 0 rgba(255,255,255,1)
}
.scroll-reel__featured{
  position:relative;overflow:hidden;background:#d8d5ce;
  box-shadow:0 1.008px .705px -.563px rgba(0,0,0,.18),0 2.389px 1.672px -1.125px rgba(0,0,0,.17),0 4.357px 3.05px -1.688px rgba(0,0,0,.17),0 7.244px 5.07px -2.25px rgba(0,0,0,.16),0 11.698px 8.188px -2.813px rgba(0,0,0,.15),0 19.148px 13.404px -3.375px rgba(0,0,0,.13),0 32.972px 23.08px -3.938px rgba(0,0,0,.09),0 60px 42px -4.5px rgba(0,0,0,.02),inset 0 1px 0 rgba(255,255,255,.7),inset 0 -1px 0 rgba(0,0,0,.6)
}
.scroll-reel__featured img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.scroll-reel__featured::before{content:'';position:absolute;inset:0;z-index:2;background:#fff;mix-blend-mode:saturation;pointer-events:none}
.scroll-reel__featured::after{
  content:'';position:absolute;inset:0;z-index:3;pointer-events:none;filter:blur(6px);mix-blend-mode:overlay;
  background:linear-gradient(220.99deg,rgba(108,92,255,0) 32%,rgb(108,92,255) 41%,rgb(173,177,255) 47%,rgba(130,189,237,.57) 54%,rgba(130,189,237,0) 65%)
}
.scroll-reel__content{min-width:0;flex:1;display:flex;flex-direction:column;justify-content:space-between;padding:40px 32px 32px;color:var(--t-dk)}
.scroll-reel__quote-mark{width:48px;height:48px;color:rgba(107,111,128,.38);margin-bottom:9px}
.scroll-reel__stage{position:relative;width:100%;max-width:430px;overflow:hidden}
.scroll-reel__sizer{visibility:hidden;min-height:140px;display:flex;flex-direction:column;gap:19px}
.scroll-reel__text{position:absolute;top:0;left:0;right:0;display:flex;flex-direction:column;gap:19px;will-change:transform,opacity}
.scroll-reel__quote{margin:0;font-family:var(--sans);font-size:22px;font-weight:600;line-height:1.3;letter-spacing:0;color:#101218}
.scroll-reel__author{margin:0;font-size:14px;font-weight:600;line-height:1.3;color:var(--t-mid)}
.scroll-reel__word{display:inline-block;white-space:nowrap}
.scroll-reel__char{display:inline-block;opacity:0;transform:translateY(1em);animation:scrollReelChar .46s cubic-bezier(.22,1,.36,1) forwards}
.scroll-reel__text.is-exiting{animation:scrollReelExit .24s ease forwards}
.scroll-reel__text.is-exiting .scroll-reel__char{animation:none;opacity:1;transform:none}
.scroll-reel__controls{display:flex;align-items:center;gap:6px;margin-top:24px}
.scroll-reel__btn{
  width:26px;height:26px;border-radius:50%;border:1px solid rgba(8,9,13,.18);
  display:grid;place-items:center;background:transparent;color:#101218;padding:0;
  transition:opacity var(--t1),transform var(--t1),border-color var(--t1),background var(--t1)
}
.scroll-reel__btn svg{width:12px;height:12px;opacity:.7}
.scroll-reel__btn:not(:disabled):hover{transform:scale(1.08);border-color:rgba(8,9,13,.35);background:rgba(8,9,13,.04)}
.scroll-reel__btn:not(:disabled):active{transform:scale(.94)}
.scroll-reel__btn:disabled{cursor:default;opacity:.4}
.scroll-reel__btn:focus-visible{outline:none;box-shadow:0 0 0 2px rgba(184,134,42,.45)}

@keyframes scrollReelChar{to{opacity:1;transform:translateY(0)}}
@keyframes scrollReelExit{to{opacity:0;transform:translateY(-10px)}}

/* ── PRESENCE (Tresmarescapital expansion style) ────────── */
.presence{padding:var(--s10) 0;border-bottom:1px solid var(--bd-lt);background:var(--white)}
.presence__hdr{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s7);align-items:end;
  padding-bottom:var(--s7);border-bottom:1px solid var(--bd-lt);margin-bottom:var(--s7)
}
.presence__hdr h2{margin-bottom:0}
.presence__hdr-right{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:var(--s4)}
.presence__hdr-right p{font-size:16px;color:var(--t-mid);line-height:1.8;max-width:420px}
/* India map */
.pres-map-wrap{
  position:relative;width:100%;
  min-height:620px;
  background:#0f1219;
  border:1px solid var(--bd-lt);
  overflow:hidden
}
.pres-map-wrap::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(circle at 52% 42%, rgba(255,255,255,.08), transparent 34%),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:auto, 64px 64px, 64px 64px;
  opacity:.55;pointer-events:none
}
.pres-map{position:relative;width:100%;height:auto;display:block;z-index:1}
.india-land{
  fill:rgba(42,48,64,.34);
  stroke:rgba(255,255,255,.42);
  stroke-width:2.2;
  stroke-linejoin:round;
  stroke-linecap:round;
  filter:drop-shadow(0 28px 46px rgba(0,0,0,.32))
}
.india-island{
  fill:none;
  stroke:rgba(255,255,255,.28);
  stroke-width:1.4;
  stroke-linecap:round
}
.india-state{
  fill:none;
  stroke:rgba(255,255,255,.23);
  stroke-width:1.35;
  stroke-linecap:round;
  stroke-linejoin:round
}
.india-neighbour{
  fill:none;
  stroke:rgba(255,255,255,.08);
  stroke-width:.8
}
.india-route{
  fill:none;
  stroke:rgba(255,255,255,.18);
  stroke-width:.8;
  stroke-dasharray:5 8
}
.map-pin{
  cursor:pointer;
  fill:var(--white);
  stroke:#0f1219;
  stroke-width:2.4;
  filter:drop-shadow(0 0 10px rgba(255,255,255,.42));
  transition:r .18s var(--ease),filter .18s var(--ease)
}
.map-pin--hq{fill:var(--white);stroke:var(--gold);stroke-width:2.2}
.map-pin:hover{r:8;filter:drop-shadow(0 0 18px rgba(255,255,255,.65))}
.map-label{
  font-family:var(--sans);
  font-size:11px;
  font-weight:600;
  letter-spacing:.04em;
  fill:rgba(255,255,255,.76)
}
.map-label--hq{fill:var(--gold-lt);font-weight:700}
.map-note{
  position:absolute;left:32px;bottom:28px;z-index:2;
  max-width:280px;color:rgba(255,255,255,.58);
  font-size:12.5px;line-height:1.7
}
.map-note strong{
  display:block;color:var(--white);font-family:var(--serif);
  font-size:24px;line-height:1.1;margin-bottom:8px
}
.map-tooltip{
  position:absolute;
  background:var(--white);
  border:1px solid var(--bd-lt);
  padding:10px 16px 12px;
  pointer-events:none;
  opacity:0;
  transition:opacity .15s;
  white-space:nowrap;
  box-shadow:0 6px 24px rgba(0,0,0,.10);
  transform:translateY(-50%);
  z-index:10
}
.map-tooltip.visible{opacity:1}
.map-tooltip__city{
  font-family:var(--serif);font-size:17px;font-weight:700;
  color:var(--t-dk);line-height:1.2
}
.map-tooltip__sub{
  font-size:9.5px;font-weight:600;letter-spacing:.11em;
  text-transform:uppercase;color:var(--t-mid);margin-top:4px
}

/* ── CTA ─────────────────────────────────────────────────── */
.cta{background:var(--dark);padding:var(--s10) 0;border-top:1px solid var(--bd-dk)}
.cta__inner{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s8);align-items:center;
  padding-bottom:var(--s8);margin-bottom:var(--s7);border-bottom:1px solid var(--bd-dk)
}
.cta__title{
  font-family:var(--serif);font-size:clamp(32px,5vw,64px);
  font-weight:700;color:var(--white);line-height:1.05;letter-spacing:-.02em
}
.cta__right{display:flex;flex-direction:column;gap:var(--s5);align-items:flex-start}
.cta__right p{font-size:16px;color:rgba(255,255,255,.42);line-height:1.75}
.cta__contacts{display:flex;gap:var(--s6);flex-wrap:wrap}
.cta__contacts a{
  font-size:12.5px;color:rgba(255,255,255,.35);
  letter-spacing:.03em;transition:color var(--t1)
}
.cta__contacts a:hover{color:rgba(255,255,255,.8)}

/* ── FOOTER ─────────────────────────────────────────────── */
.footer{background:var(--night);border-top:1px solid var(--bd-dk)}
.footer__top{
  display:grid;grid-template-columns:2.2fr 1fr 1fr 1fr 1.4fr;
  gap:var(--s6);padding:var(--s9) 0 var(--s7);border-bottom:1px solid var(--bd-dk)
}
.footer__brand{padding-right:var(--s7)}
.footer__logo{display:flex;align-items:center;gap:10px;margin-bottom:var(--s4)}
.footer__logo-mark{
  width:28px;height:28px;background:var(--gold);
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:14px;color:var(--white)
}
.footer__wordmark{
  font-size:14px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--white)
}
.footer__tagline{
  font-size:12.5px;color:rgba(255,255,255,.32);
  line-height:1.7;margin-bottom:var(--s5);max-width:250px
}
.footer__socials{display:flex;gap:6px}
.fsoc{
  width:36px;height:36px;border:1px solid var(--bd-dk);
  display:flex;align-items:center;justify-content:center;
  color:rgba(255,255,255,.32);
  transition:border-color var(--t1),color var(--t1),background var(--t1)
}
.fsoc svg{width:15px;height:15px}
.fsoc:hover{border-color:rgba(255,255,255,.38);color:var(--white);background:rgba(255,255,255,.04)}
.footer__col h4{
  font-size:9.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(255,255,255,.25);margin-bottom:var(--s4)
}
.footer__col ul{display:flex;flex-direction:column;gap:11px}
.footer__col a{font-size:12.5px;color:rgba(255,255,255,.4);transition:color var(--t1);line-height:1.5}
.footer__col a:hover{color:var(--white)}
.footer__col address p{font-size:12.5px;color:rgba(255,255,255,.32);line-height:1.75}
.footer__col address a{font-size:12.5px;color:rgba(255,255,255,.4);transition:color var(--t1)}
.footer__col address a:hover{color:var(--white)}
.footer__bottom{
  padding:20px 0;display:flex;align-items:center;
  justify-content:space-between;gap:var(--s4);flex-wrap:wrap
}
.footer__bottom p{font-size:11px;color:rgba(255,255,255,.18);letter-spacing:.03em}
.footer__btm-links{display:flex;gap:var(--s5)}
.footer__btm-links a{
  font-size:11px;color:rgba(255,255,255,.18);transition:color var(--t1)
}
.footer__btm-links a:hover{color:rgba(255,255,255,.55)}

/* ── SUPPORT PAGE STYLES ─────────────────────────────────── */
.spg-hero{
  background:var(--dark);
  padding:130px var(--pad) var(--s8);
  border-bottom:1px solid var(--bd-dk)
}
.spg-hero .container{padding:0}
.spg-breadcrumb{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-size:11.5px;color:rgba(255,255,255,.3);margin-bottom:var(--s4)
}
.spg-breadcrumb a{color:rgba(255,255,255,.38);transition:color var(--t1)}
.spg-breadcrumb a:hover{color:var(--white)}
.spg-breadcrumb span{color:rgba(255,255,255,.2)}
.spg-title{
  font-family:var(--serif);font-size:clamp(36px,5.5vw,72px);
  font-weight:700;color:var(--white);line-height:1.05;letter-spacing:-.025em;
  margin-top:var(--s2)
}
.spg-body{padding:var(--s9) 0}
.spg-layout{
  display:grid;grid-template-columns:240px 1fr;gap:var(--s8);align-items:start
}
.spg-toc{position:sticky;top:90px;border-top:1px solid var(--bd-lt);padding-top:var(--s4)}
.spg-toc h5{
  font-size:9.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--t-mid);margin-bottom:var(--s3)
}
.spg-toc ul{display:flex;flex-direction:column}
.spg-toc a{
  display:block;font-size:12.5px;color:var(--t-mid);
  padding:9px 0;border-bottom:1px solid var(--bd-lt);
  transition:color var(--t1),padding-left var(--t2) var(--expo)
}
.spg-toc a:hover{color:var(--t-dk);padding-left:8px}
.spg-content h2{
  font-family:var(--serif);font-size:clamp(22px,2.5vw,34px);
  font-weight:700;color:var(--t-dk);line-height:1.15;letter-spacing:-.015em;
  margin-bottom:var(--s4);padding-top:var(--s7);border-top:1px solid var(--bd-lt)
}
.spg-content h2:first-child{padding-top:0;border-top:none}
.spg-content h3{
  font-size:16px;font-weight:600;color:var(--t-dk2);
  margin-top:var(--s5);margin-bottom:var(--s3)
}
.spg-content p{font-size:15px;color:var(--t-mid);line-height:1.8;margin-bottom:var(--s4)}
.spg-content ul,.spg-content ol{
  display:flex;flex-direction:column;gap:11px;margin-bottom:var(--s5)
}
.spg-content ul li,.spg-content ol li{
  display:flex;gap:12px;font-size:15px;color:var(--t-mid);line-height:1.65
}
.spg-content ul li::before{
  content:'';width:4px;height:4px;border-radius:50%;
  background:var(--gold);flex-shrink:0;margin-top:9px
}
.spg-content ol{counter-reset:li}
.spg-content ol li{counter-increment:li}
.spg-content ol li::before{
  content:counter(li)'.';font-size:12px;font-weight:700;
  color:var(--gold);flex-shrink:0;width:22px;margin-top:2px
}
.spg-content a{color:var(--gold);border-bottom:1px solid rgba(184,134,42,.35)}
.spg-content a:hover{color:var(--t-dk);border-bottom-color:var(--t-dk)}
.spg-content strong{color:var(--t-dk);font-weight:600}
.spg-content .info-box{
  background:var(--off-white);border:1px solid var(--bd-lt2);
  border-left:3px solid var(--gold);padding:var(--s4);margin-bottom:var(--s5)
}
.spg-content .info-box p{margin-bottom:0}

/* FAQ (support page) */
.sfaq-list{display:flex;flex-direction:column}
.sfaq-item{border-bottom:1px solid var(--bd-lt)}
.sfaq-q{
  width:100%;display:flex;justify-content:space-between;align-items:center;
  gap:var(--s4);padding:var(--s4) 0;background:none;border:none;text-align:left;
  font-family:var(--sans);font-size:15px;font-weight:600;color:var(--t-dk);
  transition:color var(--t1)
}
.sfaq-q:hover,.sfaq-item.open .sfaq-q{color:var(--gold)}
.sfaq-icon{
  width:22px;height:22px;border:1px solid var(--bd-lt2);border-radius:50%;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  color:var(--t-mid);transition:transform var(--t2) var(--expo),border-color var(--t1)
}
.sfaq-item.open .sfaq-icon{transform:rotate(45deg);border-color:var(--gold);color:var(--gold)}
.sfaq-a{max-height:0;overflow:hidden;transition:max-height .45s var(--expo)}
.sfaq-body{
  padding:0 0 var(--s4);font-size:14.5px;color:var(--t-mid);line-height:1.8
}

/* Student portal cards */
.portal-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:var(--bd-lt2);border:1px solid var(--bd-lt2);margin-bottom:var(--s7)
}
.portal-card{
  background:var(--white);padding:var(--s6);
  display:flex;flex-direction:column;gap:var(--s3);
  transition:background var(--t1)
}
.portal-card:hover{background:var(--off-white)}
.portal-card__icon{
  width:44px;height:44px;border:1px solid var(--bd-lt2);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold);margin-bottom:var(--s2)
}
.portal-card__icon svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round}
.portal-card h3{font-family:var(--serif);font-size:18px;font-weight:700;color:var(--t-dk)}
.portal-card p{font-size:13px;color:var(--t-mid);line-height:1.65;flex:1}

/* ── RESPONSIVE ─────────────────────────────────────────── */
@media(max-width:1100px){
  :root{--pad:40px}
  .programs-grid{grid-template-columns:repeat(2,1fr)}
  .video-testimonials__hero{grid-template-columns:minmax(0,1fr) minmax(230px,300px)}
  .vtest-grid{gap:var(--s4)}
  .footer__top{grid-template-columns:1fr 1fr 1fr}
  .footer__brand{grid-column:1/-1;padding-right:0}
  .counters__wrap{grid-template-columns:1fr}
  .counters__text{border-right:none;border-bottom:1px solid var(--bd-lt);padding-right:0;padding-bottom:var(--s6)}
  .cert-grid{grid-template-columns:repeat(2,1fr)}
  .hire-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:900px){
  .hero__bar-inner{grid-template-columns:repeat(3,1fr)}
  .hstat:nth-child(3){border-right:none}
  .hstat:nth-child(n+4){border-top:1px solid rgba(255,255,255,.09)}
  .intro__grid{grid-template-columns:1fr}
  .why__head{grid-template-columns:1fr}
  .why-grid{grid-template-columns:1fr}
  .witem{border-right:none;border-bottom:1px solid var(--bd-dk);padding-left:0;padding-right:0}
  .witem:last-child{border-bottom:none}
  .presence__hdr{grid-template-columns:1fr}
  .pres-map-wrap{min-height:520px}
  .map-note{left:24px;bottom:22px}
  .cta__inner{grid-template-columns:1fr}
  .spg-layout{grid-template-columns:1fr}
  .spg-toc{display:none}
  .portal-grid{grid-template-columns:1fr 1fr}
  .scroll-reel{max-width:100%;min-height:0;flex-direction:column}
  .scroll-reel__media{width:100%;height:228px;min-height:228px}
  .scroll-reel__content{padding:30px 26px 28px}
  .scroll-reel__stage{max-width:100%}
  .video-testimonials__hero{grid-template-columns:1fr;align-items:start}
  .vtest-card--feature{justify-self:start;width:min(100%,280px)}
  .vtest-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vtest-grid .vtest-card--drop{margin-top:0}
  .vtest-grid .vtest-card:nth-child(even){margin-top:3vh}
}
@media(max-width:768px){
  :root{--pad:24px}
  .nav__links,.nav__right{display:none}
  .nav__burger{display:flex}
  .nav__inner{gap:0}
  .hero__title{font-size:clamp(44px,13vw,68px)}
  .hero__bar-inner{grid-template-columns:repeat(2,1fr)}
  .hstat:nth-child(2){border-right:none}
  .hstat:nth-child(3){border-top:1px solid var(--bd-lt);border-right:1px solid var(--bd-lt)}
  .hstat:nth-child(4){border-top:1px solid var(--bd-lt);border-right:none}
  .hstat:nth-child(5){border-top:1px solid var(--bd-lt)}
  .programs-grid{grid-template-columns:1fr}
  .cstat-grid{grid-template-columns:1fr 1fr}
  .footer__top{grid-template-columns:1fr 1fr;gap:var(--s5)}
  .footer__bottom{flex-direction:column;align-items:flex-start}
  .programs__head,.certs__head,.testi__head{flex-direction:column;align-items:flex-start;gap:var(--s4)}
  .tslide__q{padding-left:var(--s4);font-size:clamp(16px,4vw,22px)}
  .tslide__meta{padding-left:var(--s4)}
  .tslide__co{display:none}
  .portal-grid{grid-template-columns:1fr}
  .hire-grid{grid-template-columns:repeat(2,1fr)}
  .pres-map-wrap{min-height:460px}
  .map-note{position:relative;left:auto;bottom:auto;margin:0 20px 24px}
  .video-testimonials__hero{gap:var(--s5);padding-bottom:var(--s6)}
  .vtest-grid{grid-template-columns:1fr 1fr;gap:16px;padding-top:var(--s6)}
  .vtest-card{border-radius:18px}
  .video-modal__close{right:8px;top:8px}
  .scroll-reel{--reel-cell:102px}
  .scroll-reel__media{height:218px;min-height:218px}
  .scroll-reel__quote{font-size:18px}
  .scroll-reel__sizer{min-height:176px}
}
@media(max-width:480px){
  .cert-grid{grid-template-columns:1fr}
  .hero__bar-inner{grid-template-columns:1fr}
  .hstat{border-right:none!important;border-bottom:1px solid var(--bd-lt)}
  .hstat:last-child{border-bottom:none}
  .cta__inner{gap:var(--s5)}
  .vtest-grid{grid-template-columns:1fr}
  .vtest-grid .vtest-card:nth-child(even){margin-top:0}
  .vtest-card--feature{width:min(100%,240px)}
  .scroll-reel{--reel-cell:88px}
  .scroll-reel__media{height:190px;min-height:190px}
  .scroll-reel__content{padding:24px 20px}
  .scroll-reel__quote-mark{width:40px;height:40px}
  .scroll-reel__quote{font-size:17px}
  .scroll-reel__sizer{min-height:210px}
}

/* ─────────────────────────────────────────────────────────────
   NEW PAGES — ADDITIONAL STYLES
   ───────────────────────────────────────────────────────────── */

/* ── SPG (SUBPAGE) HERO — supplemental ──────────────────── */
/* Base .spg-hero, .spg-breadcrumb defined above; these extend it */
.spg-hero__inner{display:flex;flex-direction:column;gap:var(--s3)}
.spg-hero__title{
  font-family:var(--serif);
  font-size:clamp(36px,5vw,64px);
  font-weight:700;
  color:var(--white);
  line-height:1.1;
  letter-spacing:-.02em
}
.spg-breadcrumb__sep{color:rgba(255,255,255,.2)}

.about-expand{
  --about-progress:0;
  --about-media-w:300px;
  --about-media-h:400px;
  --about-text-shift:0vw;
  position:relative;min-height:100dvh;overflow:hidden;background:var(--night);
  transition:background var(--t3) var(--ease)
}
.about-expand.is-expanded{overflow:visible}
.about-expand__bg{position:absolute;inset:0;z-index:0;opacity:calc(1 - var(--about-progress));transition:opacity 100ms linear}
.about-expand__bg img{width:100%;height:100%;object-fit:cover;object-position:center}
.about-expand__bg span{position:absolute;inset:0;background:rgba(0,0,0,.16)}
.about-expand__inner{position:relative;z-index:2;min-height:100dvh;display:flex;flex-direction:column;align-items:center}
.about-expand__crumb{
  position:absolute;top:96px;left:var(--pad);right:var(--pad);z-index:5;
  display:flex;align-items:center;gap:10px;color:rgba(255,255,255,.72);
  font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase
}
.about-expand__crumb a{color:rgba(255,255,255,.88)}
.about-expand__crumb span{color:rgba(255,255,255,.44)}
.about-expand__stage{position:relative;width:100%;min-height:100dvh;display:flex;align-items:center;justify-content:center}
.about-expand__media{
  position:absolute;top:50%;left:50%;z-index:1;overflow:hidden;border-radius:16px;
  width:var(--about-media-w);height:var(--about-media-h);
  max-width:95vw;max-height:85vh;transform:translate(-50%,-50%);
  box-shadow:0 0 50px rgba(0,0,0,.3)
}
.about-expand__media img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.about-expand__shade{
  position:absolute;inset:0;border-radius:inherit;background:rgba(0,0,0,calc(.50 - (var(--about-progress) * .30)));
  pointer-events:none
}
.about-expand__hints{
  position:absolute;left:50%;top:calc(100% + 16px);z-index:4;display:flex;flex-direction:column;
  align-items:center;gap:3px;width:max-content;transform:translateX(-50%);
  color:#c9ddff;text-align:center;font-weight:600
}
.about-expand__hints p:first-child{
  font-family:var(--serif);font-size:24px;font-weight:600;
  transform:translateX(calc(-1 * var(--about-text-shift)))
}
.about-expand__hints p:last-child{font-size:14px;transform:translateX(var(--about-text-shift))}
.about-expand__title{
  position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:16px;width:100%;text-align:center;mix-blend-mode:difference;pointer-events:none
}
.about-expand__title h1{
  margin:0;font-family:var(--sans);font-size:clamp(42px,6vw,82px);font-weight:800;
  line-height:.92;letter-spacing:0;color:#c9ddff
}
.about-expand__title h1:first-child{transform:translateX(calc(-1 * var(--about-text-shift)))}
.about-expand__title h1:last-child{transform:translateX(var(--about-text-shift))}

@media(max-width:768px){
  .about-expand{--about-media-w:300px;--about-media-h:400px}
  .about-expand__crumb{top:88px}
  .about-expand__title h1{font-size:clamp(40px,13vw,58px)}
  .about-expand__hints p:first-child{font-size:22px}
}

/* ── SPG BODY LAYOUT (new pages — 2-col equal) ───────────── */
.spg-body{padding:var(--s8) 0;background:var(--white)}
.spg-layout--2col{display:grid;grid-template-columns:1fr 1fr;gap:var(--s7);align-items:start}
.spg-content{}

/* ── SUPPORT CONTACT CHANNELS ────────────────────────────── */
.support-channels{background:var(--dark);border-bottom:1px solid var(--bd-dk)}
.support-ch-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  border-left:1px solid var(--bd-dk)
}
.support-ch{
  display:block;padding:var(--s7) var(--s6);
  border-right:1px solid var(--bd-dk);
  text-decoration:none;
  transition:background var(--t2) var(--ease);
  position:relative;overflow:hidden
}
.support-ch::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(184,134,42,.06) 0%,transparent 60%);
  opacity:0;transition:opacity var(--t2)
}
.support-ch:hover{background:rgba(255,255,255,.03)}
.support-ch:hover::before{opacity:1}
.support-ch--mid{border-left:none;border-right:none;
  background:rgba(255,255,255,.025)}
.support-ch__num{
  font-family:var(--serif);font-size:11px;font-weight:700;
  letter-spacing:.2em;color:var(--gold);margin-bottom:var(--s5)
}
.support-ch__icon{
  width:28px;height:28px;color:rgba(255,255,255,.45);
  margin-bottom:var(--s4);flex-shrink:0
}
.support-ch__title{
  font-size:10px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(255,255,255,.38);
  margin-bottom:var(--s3)
}
.support-ch__value{
  font-family:var(--serif);font-size:clamp(18px,2vw,26px);
  font-weight:700;color:var(--white);line-height:1.15;
  margin-bottom:var(--s2)
}
.support-ch__meta{
  font-size:12.5px;color:rgba(255,255,255,.32);
  line-height:1.6;margin-bottom:var(--s5)
}
.support-ch__cta{
  display:inline-flex;align-items:center;gap:8px;
  font-size:11px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--gold);
  transition:gap var(--t2) var(--expo)
}
.support-ch:hover .support-ch__cta{gap:14px}
.support-ch__cta .arr{font-style:normal}
@media(max-width:768px){
  .support-ch-grid{grid-template-columns:1fr;border-left:none}
  .support-ch{border-right:none;border-bottom:1px solid var(--bd-dk)}
  .support-ch--mid{background:none}
}

/* ── FOOTER NEW STRUCTURE ────────────────────────────────── */
/* Override the old 5-col footer grid to 4-col (brand + 3) */
.footer__top{grid-template-columns:2fr 1fr 1fr 1fr}
.footer__social{display:flex;gap:12px;margin-top:var(--s4)}
.footer__social a{
  color:rgba(255,255,255,.35);transition:color var(--t1);
  display:flex;align-items:center
}
.footer__social a:hover{color:var(--white)}
.footer__heading{
  font-size:10px;font-weight:700;letter-spacing:.15em;
  text-transform:uppercase;color:rgba(255,255,255,.35);
  margin-bottom:var(--s3)
}
.footer__col{display:flex;flex-direction:column;gap:10px}
.footer__col a{font-size:13px;color:rgba(255,255,255,.45);transition:color var(--t1)}
.footer__col a:hover{color:var(--white)}
/* Fix footer bottom text visibility (was .18 — nearly invisible) */
.footer__bottom p{font-size:11px;color:rgba(255,255,255,.40)!important;letter-spacing:.03em}
.footer__btm-links a{font-size:11px;color:rgba(255,255,255,.40)!important;transition:color var(--t1)}
.footer__btm-links a:hover{color:rgba(255,255,255,.75)!important}

/* ── NAV ACTIVE LINK ─────────────────────────────────────── */
.nav__link--active{color:var(--white)!important;font-weight:600}
.nav__link--active:hover{color:var(--white)!important}

/* ── PROGRAM FILTER TABS ─────────── */
.prog-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:var(--s6)}
.prog-tab{
  padding:8px 20px;font-size:12px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;border:1px solid var(--bd-lt2);background:var(--white);
  color:var(--t-mid);cursor:pointer;transition:all var(--t1);border-radius:2px
}
.prog-tab:hover{border-color:var(--t-dk);color:var(--t-dk)}
.prog-tab--active{background:var(--t-dk);color:var(--white);border-color:var(--t-dk)}

/* ── PROGRAM CARDS ───────────────── */
.prog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--bd-lt2);border:1px solid var(--bd-lt2)}
.prog-card{background:var(--white);padding:var(--s6);display:flex;flex-direction:column;gap:var(--s3);transition:background var(--t2) var(--ease)}
.prog-card:hover{background:var(--off-white)}
.prog-card__head{display:flex;justify-content:space-between;align-items:center}
.prog-card__duration{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--t-mid)}
.prog-card__title{font-family:var(--serif);font-size:clamp(16px,1.6vw,20px);font-weight:700;color:var(--t-dk);line-height:1.2}
.prog-card__meta{display:flex;gap:8px;flex-wrap:wrap}
.prog-card__meta span{font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);border:1px solid var(--gold-dim);padding:2px 8px}
.prog-card__highlights{list-style:none;padding:0;margin:0}
.prog-card__highlights li{font-size:13px;color:var(--t-mid);padding:4px 0;border-bottom:1px solid var(--bd-lt)}
.prog-card__highlights li:last-child{border-bottom:none}
.prog-card__fee{font-family:var(--serif);font-size:20px;font-weight:700;color:var(--t-dk);margin-top:auto}
.prog-card__fee span{font-size:12px;font-weight:400;color:var(--t-mid);font-family:var(--sans)}
.prog-card__actions{display:flex;align-items:center;gap:var(--s4);flex-wrap:wrap}
.btn-fill--sm{font-size:11px;padding:9px 18px;letter-spacing:.1em}

/* ── TIMELINE ────────────────────── */
.timeline{position:relative;padding-left:48px}
.timeline::before{content:'';position:absolute;left:16px;top:0;bottom:0;width:1px;background:var(--bd-lt2)}
.timeline__item{position:relative;padding-bottom:var(--s7);opacity:0;transform:translateY(24px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.timeline__item.in{opacity:1;transform:none}
.timeline__dot{position:absolute;left:-40px;top:4px;width:10px;height:10px;border-radius:50%;background:var(--gold);border:2px solid var(--white);box-shadow:0 0 0 1px var(--gold)}
.timeline__year{font-size:11px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.timeline__title{font-family:var(--serif);font-size:18px;font-weight:700;color:var(--t-dk);margin-bottom:6px}
.timeline__text{font-size:14px;color:var(--t-mid);line-height:1.7}

/* ── ABOUT FEATURE CARDS ─────────── */
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--bd-lt2);border:1px solid var(--bd-lt2);margin-top:var(--s6)}
.feature-card{background:var(--white);padding:var(--s6);transition:background var(--t2)}
.feature-card:hover{background:var(--off-white)}
.feature-card__num{font-family:var(--serif);font-size:40px;font-weight:300;color:rgba(0,0,0,.05);line-height:1;margin-bottom:var(--s3)}
.feature-card__title{font-size:15px;font-weight:600;color:var(--t-dk);margin-bottom:8px}
.feature-card__text{font-size:13.5px;color:var(--t-mid);line-height:1.75}

/* ── QUICK SUPPORT CARDS ─────────── */
.support-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--bd-lt2);border:1px solid var(--bd-lt2);margin-bottom:var(--s8)}
.support-card{background:var(--white);padding:var(--s6);text-align:center;text-decoration:none;transition:background var(--t2)}
.support-card:hover{background:var(--off-white)}
.support-card__icon{font-size:28px;margin-bottom:var(--s3)}
.support-card__title{font-family:var(--serif);font-size:18px;font-weight:700;color:var(--t-dk);margin-bottom:6px}
.support-card__info{font-size:14px;color:var(--t-mid)}

/* ── FAQ CATEGORY TABS ───────────── */
.faq-tabs{display:flex;gap:0;border-bottom:1px solid var(--bd-lt2);margin-bottom:var(--s6)}
.faq-tab{padding:12px 20px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--t-mid);cursor:pointer;border-bottom:2px solid transparent;background:none;margin-bottom:-1px;transition:all var(--t1)}
.faq-tab:hover{color:var(--t-dk)}
.faq-tab--active{color:var(--t-dk);border-bottom-color:var(--t-dk)}
.faq-panel{display:none}
.faq-panel--active{display:block}

/* ── WHY FEATURE BLOCKS ──────────── */
.why-block{display:grid;grid-template-columns:1fr 1fr;gap:var(--s8);align-items:center;padding:var(--s8) 0;border-bottom:1px solid var(--bd-lt)}
.why-block:first-child{border-top:1px solid var(--bd-lt)}
.why-block__num{font-family:var(--serif);font-size:80px;font-weight:300;color:rgba(0,0,0,.04);line-height:1;margin-bottom:var(--s3)}
.why-block__title{font-family:var(--serif);font-size:clamp(22px,2.5vw,32px);font-weight:700;color:var(--t-dk);margin-bottom:var(--s3)}
.why-block__text{font-size:16px;color:var(--t-mid);line-height:1.8}
.why-block__img{background:var(--off-white);border:1px solid var(--bd-lt);aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;color:var(--t-mid);font-size:13px;letter-spacing:.05em}

/* ── TESTIMONIAL CARDS ───────────── */
.tcard-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--bd-lt2);border:1px solid var(--bd-lt2)}
.tcard{background:var(--white);padding:var(--s6);display:flex;flex-direction:column;gap:var(--s4)}
.tcard__quote{font-family:var(--serif);font-size:clamp(15px,1.5vw,18px);color:var(--t-dk);line-height:1.6;font-style:italic}
.tcard__author{font-size:13px;font-weight:600;color:var(--t-mid)}
.tcard__role{font-size:12px;color:var(--t-mid);opacity:.7}

/* ── STAT GRID (why page dark) ───── */
.stat-dark-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--bd-dk)}
.stat-dark{padding:var(--s6);border-right:1px solid var(--bd-dk);text-align:center}
.stat-dark:last-child{border-right:none}
.stat-dark__num{font-family:var(--serif);font-size:clamp(32px,4vw,52px);font-weight:700;color:var(--white);line-height:1;letter-spacing:-.02em}
.stat-dark__label{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.35);margin-top:8px}

/* ── FAQ ACCORDION ITEMS ─────────── */
.faq-item{border-bottom:1px solid var(--bd-lt2)}
.faq-q{
  width:100%;display:flex;align-items:center;justify-content:space-between;
  gap:var(--s4);padding:18px 0;background:none;border:none;
  font-family:var(--sans);font-size:15px;font-weight:500;
  color:var(--t-dk);cursor:pointer;text-align:left;transition:color var(--t1)
}
.faq-q:hover,.faq-item.open .faq-q{color:var(--gold)}
.faq-q::after{
  content:'+';flex-shrink:0;width:20px;height:20px;
  border:1px solid var(--bd-lt2);display:flex;align-items:center;
  justify-content:center;font-size:16px;font-weight:300;
  transition:transform var(--t1),border-color var(--t1),color var(--t1);
  line-height:1
}
.faq-item.open .faq-q::after{transform:rotate(45deg);border-color:var(--gold);color:var(--gold)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .45s var(--expo)}
.faq-a p{font-size:14px;color:var(--t-mid);line-height:1.8;padding-bottom:18px}

/* ── ANIMATIONS ──────────────────── */
@keyframes fadeInUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ── RESPONSIVE (new pages) ──────── */
@media(max-width:1100px){
  .footer__top{grid-template-columns:1fr 1fr}
  .footer__brand{grid-column:1/-1}
}
@media(max-width:900px){
  .prog-grid{grid-template-columns:1fr}
  .feature-grid{grid-template-columns:1fr}
  .support-cards{grid-template-columns:1fr}
  .tcard-grid{grid-template-columns:1fr}
  .stat-dark-grid{grid-template-columns:repeat(2,1fr)}
  .why-block{grid-template-columns:1fr}
  .why-block__img{display:none}
  .spg-layout--2col{grid-template-columns:1fr;gap:var(--s5)}
  .footer__top{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
  .prog-tabs{gap:4px}
  .prog-tab{padding:6px 12px;font-size:11px}
  .faq-tabs{flex-wrap:wrap}
  .stat-dark-grid{grid-template-columns:1fr 1fr}
  .spg-hero{padding:calc(var(--s8) + 64px) 0 var(--s6)}
  .footer__top{grid-template-columns:1fr}
}

/* Homepage programs CTA */
.programs__all{display:flex;justify-content:center;margin-top:var(--s6)}

/* ══════════════════════════════════════════════════════════
   OUR PROGRAMS — Sticky heading + horizontal card reveal
   Inspired by bohdan.design "Selected Work" interaction:
   heading stays fixed, cards enter horizontally then rise up
   ══════════════════════════════════════════════════════════ */

/* Tall outer section — provides the scroll runway */
.op-section{
  position:relative;
  height:320vh;
  background:var(--white)
}

/* Pinned 100vh container */
.op-sticky{
  position:sticky;
  top:0;
  height:100vh;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  overflow:hidden;
  background:var(--white);
  border-bottom:1px solid var(--bd-lt2)
}

/* Background watermark parallax text */
.op-bg-text{
  display:none;
}

/* Bottom row layout */
.op-bottom-row{
  height:35vh;
  min-height:200px;
  display:flex;
  align-items:flex-end;
  padding-bottom:2vh;
  z-index:2;
  position:relative;
  overflow:visible;
}

.op-left-col{
  width:auto;
  flex-shrink:0;
}

/* ── Heading row ── */
.op-hdr{
  padding-top:0;
  padding-bottom:0;
  flex-shrink:0;
  border-bottom:none;
  will-change:transform;
}
.op-label{
  display:none; /* hidden as requested */
}
.op-heading{
  font-family:var(--serif);
  font-size:clamp(90px, 18vw, 260px); /* Massive size like 'WORK' */
  font-weight:700;
  color:var(--t-dk);           /* PURE BLACK */
  letter-spacing:-.04em;
  line-height:0.82;
  text-transform:uppercase;
  white-space:nowrap;
  margin:0;
  will-change:transform;
}

/* ── Horizontal card track ── */
.op-track-outer{
  flex:1;
  min-height:0;
  overflow:hidden;             /* clips cards that haven't risen yet */
  display:flex;
  align-items:center;
  padding:0 var(--pad) 0;      /* removed top padding var(--s8) */
  z-index:2;
  position:relative;
}

/* JS translates this left as scroll progresses */
.op-track{
  display:flex;
  gap:var(--s4);
  align-items:stretch;
  will-change:transform;
  /* small right padding so last card breathes */
  padding-right:var(--pad)
}

/* Each card slot clips its riser */
.op-card-wrap{
  width:clamp(300px,42vw,480px);
  flex-shrink:0;
  overflow:hidden              /* clips translateY below */
}

/* The riser — starts BELOW (hidden by overflow), rises to 0 */
.op-card-riser{
  height:100%;
  transform:translateY(calc(100% + 32px));
  transition:transform .95s cubic-bezier(.16,1,.3,1)
}
.op-card-riser.op--up{
  transform:translateY(0)
}

/* Ensure pcard fills riser height and has white background */
.op-card-wrap .pcard{
  height:100%;
  background:var(--white);
  border:1px solid var(--bd-lt2);
  /* override grid-style border-right/bottom from base pcard */
  border-right:1px solid var(--bd-lt2);
  border-bottom:1px solid var(--bd-lt2);
  gap:var(--s3)
}
.op-card-wrap .pcard:hover{background:var(--off-white)}

/* ── CTA below section ── */
.op-cta{
  padding:var(--s7) 0;
  border-top:1px solid var(--bd-lt2);
  border-bottom:1px solid var(--bd-lt2)
}
.op-cta .container{
  display:flex;
  justify-content:center;
}

/* ── Mobile / tablet: disable pin, stack vertically ── */
@media(max-width:900px){
  .op-section{height:auto}
  .op-sticky{
    position:relative;
    height:auto;
    overflow:visible;
    flex-direction:column;
  }
  .op-bg-text{
    display:none;
  }
  .op-bottom-row{
    height:auto;
    min-height:0;
    padding:0 var(--pad) var(--s5);
    order:-1;
  }
  .op-left-col{
    width:100%;
  }
  .op-hdr{
    padding-top:var(--s6); /* reduced from var(--s7) */
    border-bottom:1px solid var(--bd-lt2);
    padding-bottom:var(--s4);
  }
  .op-heading{
    white-space:normal; /* wrap heading on mobile screen */
    font-size:clamp(44px, 8vw, 68px); /* Override giant font size on mobile */
    line-height:1.1;
    letter-spacing:-.02em;
  }
  .op-track-outer{
    overflow:visible;
    padding:var(--s4) var(--pad); /* reduced top padding from var(--s5) */
    height:auto;
  }
  .op-track{
    flex-direction:column;
    transform:none!important;
    padding-right:0
  }
  .op-card-wrap{
    width:100%;
    overflow:visible
  }
  .op-card-riser{
    transform:none!important;
    height:auto
  }
  .op-card-wrap .pcard{height:auto}
}
@media(max-width:600px){
  .op-heading{font-size:clamp(36px,11vw,52px)}
}

/* ── leftover old classes (unused, kept for safety) ── */
.swiss-knife{
  background:var(--night);
  overflow:hidden;
  padding:22px 0;
  border-top:1px solid var(--bd-dk);
  border-bottom:1px solid var(--bd-dk);
  transform:skewY(-1.8deg);
  margin:40px 0
}
.swiss-knife__inner{
  transform:skewY(1.8deg);
  display:flex;flex-direction:column;gap:10px;
  pointer-events:none;user-select:none
}
.sw-track{
  display:flex;white-space:nowrap;
  width:max-content
}
.sw-track--l{animation:sw-l 40s linear infinite}
.sw-track--r{animation:sw-r 32s linear infinite}
@keyframes sw-l{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes sw-r{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.sw-item{
  font-size:11.5px;font-weight:700;letter-spacing:.2em;
  text-transform:uppercase;color:rgba(255,255,255,.42);
  padding:0 28px
}
.sw-gold{color:var(--gold-lt)!important}
.sw-sep{
  color:rgba(255,255,255,.16);font-size:10px;
  flex-shrink:0;align-self:center
}

/* ══════════════════════════════════════════════════════════
   SELECTED WORK — OUR PROGRAMS
   ══════════════════════════════════════════════════════════ */
.prog-list-section{
  background:var(--white);
  padding:var(--s9) 0 0
}
.prog-list__hdr{
  padding-bottom:var(--s7);
  border-bottom:1px solid var(--bd-lt2);
  display:grid;grid-template-columns:1fr auto;
  align-items:end;gap:var(--s5)
}
.prog-list__heading{
  font-family:var(--serif);
  font-size:clamp(60px,9vw,130px);
  font-weight:700;color:var(--t-dk);
  letter-spacing:-.03em;line-height:.9;
  text-transform:uppercase;grid-column:1/-1
}
.prog-list__sub{
  font-size:14px;color:var(--t-mid);
  line-height:1.7;max-width:340px;
  margin-top:var(--s4)
}

/* ── Rows ─────────────────────────────────────────────── */
.prog-list{position:relative}
.prog-row{
  display:block;
  border-bottom:1px solid var(--bd-lt2);
  text-decoration:none;
  position:relative;
  overflow:hidden;
  /* initial clipped state — JS reveals via .prog-row--in */
  clip-path:inset(0 0 100% 0);
  transition:clip-path .7s cubic-bezier(.16,1,.3,1),background .2s
}
.prog-row--in{clip-path:inset(0 0 0% 0)}
.prog-row:hover{background:rgba(0,0,0,.018)}

.prog-row__inner{
  display:flex;align-items:center;gap:var(--s5);
  padding:clamp(24px,3.5vw,40px) 0;
  transition:transform .35s cubic-bezier(.16,1,.3,1)
}
.prog-row:hover .prog-row__inner{transform:translateX(10px)}

/* Number */
.prog-row__num{
  font-family:var(--serif);font-size:13px;font-weight:400;
  color:var(--t-mid);min-width:36px;flex-shrink:0;
  transition:color .2s
}
.prog-row:hover .prog-row__num{color:var(--gold)}

/* Body — name + tags */
.prog-row__body{flex:1;min-width:0}
.prog-row__name{
  font-family:var(--serif);
  font-size:clamp(22px,3.2vw,46px);
  font-weight:700;color:var(--t-dk);
  line-height:1.05;margin-bottom:10px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.prog-row__name em{
  font-style:italic;font-weight:400;
  color:var(--t-mid)
}
.prog-row__tags{display:flex;gap:6px;flex-wrap:wrap}
.prog-row__tags span{
  font-size:9.5px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--t-mid);
  border:1px solid var(--bd-lt2);padding:2px 8px
}

/* Right meta */
.prog-row__right{
  display:flex;flex-direction:column;align-items:flex-end;
  gap:4px;flex-shrink:0
}
.prog-row__dur{
  font-size:10.5px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--t-mid)
}
.prog-row__fee{
  font-family:var(--serif);font-size:clamp(16px,1.6vw,22px);
  font-weight:700;color:var(--t-dk)
}

/* CTA arrow */
.prog-row__cta{
  display:inline-flex;align-items:center;gap:6px;
  font-size:10.5px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--t-mid);
  flex-shrink:0;
  opacity:0;transform:translateX(-12px);
  transition:opacity .25s,transform .35s cubic-bezier(.16,1,.3,1),color .2s
}
.prog-row:hover .prog-row__cta{opacity:1;transform:translateX(0);color:var(--t-dk)}

/* Footer CTA */
.prog-list__foot{
  padding:var(--s7) 0 var(--s9);
  border-top:1px solid var(--bd-lt2)
}

/* ── Responsive ───────────────────────────────────────── */
@media(max-width:900px){
  .prog-list__hdr{grid-template-columns:1fr}
  .prog-row__name{white-space:normal}
  .prog-row__cta{display:none}
}
@media(max-width:600px){
  .prog-row__right{display:none}
  .prog-list__heading{font-size:clamp(48px,13vw,80px)}
  .prog-row__name{font-size:clamp(18px,5vw,28px)}
}

/* ══════════════════════════════════════════════════════════
   3D CARD STACK FOR WHY PAGE
   ══════════════════════════════════════════════════════════ */

.why-stack-section {
  position: relative;
  height: 480vh; /* Runway height for 6 cards */
  background: var(--white);
}

.why-stack-sticky {
  position: sticky;
  top: 72px; /* navigation height */
  height: calc(100vh - 72px);
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: 1200px;
  overflow: hidden;
  background: var(--white);
}

.why-stack-container {
  position: relative;
  width: clamp(800px, 75vw, 1100px);
  height: clamp(400px, 50vh, 520px);
  transform-style: preserve-3d;
}

.why-card {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--white);
  border: 1px solid var(--bd-lt2);
  border-radius: 16px;
  padding: var(--s6) var(--s7);
  box-shadow: 0 24px 50px rgba(0,0,0,0.06), 0 2px 8px rgba(0,0,0,0.02);
  display: grid;
  grid-template-columns: 1.25fr 0.75fr;
  gap: var(--s6);
  align-items: center;
  transform-style: preserve-3d;
  will-change: transform, opacity;
  box-sizing: border-box;
}

/* Alternating card backgrounds: 1st (odd) is dark blue, 2nd (even) is white */
.why-card:nth-child(odd) {
  background: #0B122C;
  border-color: rgba(255,255,255,0.08);
  box-shadow: 0 24px 50px rgba(0,0,0,0.18), 0 2px 8px rgba(0,0,0,0.05);
}
.why-card:nth-child(odd) .why-card__num {
  color: rgba(255,255,255,0.07);
}
.why-card:nth-child(odd) .why-card__title {
  color: var(--white);
}
.why-card:nth-child(odd) .why-card__text {
  color: rgba(255,255,255,0.7);
}

.why-card__body {
  display: flex;
  flex-direction: column;
}

.why-card__num {
  font-family: var(--serif);
  font-size: 54px;
  font-weight: 300;
  color: rgba(0,0,0,0.05);
  line-height: 1;
  margin-bottom: var(--s3);
}

.why-card__title {
  font-family: var(--serif);
  font-size: clamp(22px, 2.2vw, 32px);
  font-weight: 700;
  color: var(--t-dk);
  margin-bottom: var(--s3);
  line-height: 1.2;
}

.why-card__text {
  font-size: 14.5px;
  color: var(--t-mid);
  line-height: 1.7;
}

.why-card__visual {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Mockups Styling */
.why-card__mockup {
  width: 100%;
  height: 250px;
  background: var(--off-white);
  border: 1px solid var(--bd-lt2);
  border-radius: 10px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.04);
  position: relative;
  overflow: hidden;
}

/* Card 1: Live Mockup */
.mockup-live {
  display: flex;
  flex-direction: column;
}
.mockup-window {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.mockup-header {
  padding: 8px 12px;
  border-bottom: 1px solid var(--bd-lt2);
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--white);
}
.mockup-header .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #ff5f56;
}
.mockup-header .dot:nth-child(2) { background: #ffbd2e; }
.mockup-header .dot:nth-child(3) { background: #27c93f; }
.mockup-header .badge--live {
  margin-left: auto;
  font-size: 8px;
  font-weight: 700;
  background: #ff3b30;
  color: white;
  padding: 2px 6px;
  border-radius: 4px;
  letter-spacing: 0.05em;
  animation: pulse 1.5s infinite;
}
.mockup-body {
  flex: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 12px;
  gap: 12px;
  background: #1e1e1e;
}
.mockup-code {
  font-family: monospace;
  font-size: 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: #abb2bf;
}
.line--blue { color: #61afef; }
.line--purple { color: #c678dd; }
.line--green { color: #98c379; }
.mockup-video {
  background: #2d2d2d;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  border: 1px solid rgba(255,255,255,0.05);
}
.mockup-video .avatar {
  width: 36px;
  height: 36px;
  background: var(--gold);
  border-radius: 50%;
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 6px;
}
.mockup-video .label-name {
  font-size: 8.5px;
  color: rgba(255,255,255,0.7);
}
.mockup-video .waves {
  position: absolute;
  bottom: 8px;
  display: flex;
  gap: 2px;
}
.mockup-video .waves .w {
  width: 2px;
  height: 8px;
  background: var(--gold);
  animation: soundWave 0.8s ease infinite alternate;
}
.mockup-video .waves .w:nth-child(2) { animation-delay: 0.15s; }
.mockup-video .waves .w:nth-child(3) { animation-delay: 0.3s; }

/* Card 2: Curriculum */
.mockup-curriculum {
  padding: 16px;
  background: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
}
.curriculum-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 8px;
  width: 100%;
}
.partner-logo {
  font-size: 11px;
  font-weight: 700;
  padding: 6px 12px;
  border-radius: 4px;
  border: 1px solid var(--bd-lt2);
  text-align: center;
  background: var(--off-white);
  color: var(--t-dk);
}
.curriculum-tag {
  font-size: 10px;
  font-weight: 600;
  padding: 6px 10px;
  border-radius: 4px;
  background: rgba(184, 134, 42, 0.08);
  color: var(--gold);
  border: 1px dashed rgba(184, 134, 42, 0.4);
  text-align: center;
}

/* Card 3: Projects */
.mockup-projects {
  padding: 16px;
  background: var(--white);
}
.project-board {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.project-board__title {
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--t-mid);
  letter-spacing: 0.05em;
  margin-bottom: 2px;
}
.project-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 10px;
  border-radius: 6px;
  border: 1px solid var(--bd-lt2);
  background: var(--off-white);
}
.project-item .bullet {
  width: 6px;
  height: 6px;
  border-radius: 50%;
}
.bullet.green { background: #27c93f; }
.bullet.gold { background: var(--gold); }
.bullet.blue { background: #61afef; }
.project-item .info {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.project-item .info .name {
  font-size: 10.5px;
  font-weight: 600;
  color: var(--t-dk);
}
.project-item .info .tech {
  font-size: 8px;
  color: var(--t-mid);
}
.project-item .percent {
  font-size: 10px;
  font-weight: 700;
  color: var(--t-dk);
}

/* Card 4: Mentor Chat */
.mockup-mentor {
  background: var(--off-white);
  padding: 0;
  display: flex;
  flex-direction: column;
}
.chat-window {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.chat-header {
  padding: 10px 12px;
  background: var(--white);
  border-bottom: 1px solid var(--bd-lt2);
  display: flex;
  align-items: center;
  gap: 10px;
}
.chat-avatar {
  width: 24px;
  height: 24px;
  background: #27c93f;
  border-radius: 50%;
  color: white;
  font-size: 9px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.chat-info {
  display: flex;
  flex-direction: column;
}
.chat-name {
  font-size: 10.5px;
  font-weight: 600;
  color: var(--t-dk);
}
.chat-status {
  font-size: 8px;
  color: var(--t-mid);
}
.chat-messages {
  flex: 1;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.msg {
  max-width: 80%;
  padding: 6px 10px;
  border-radius: 8px;
  font-size: 9.5px;
  line-height: 1.3;
}
.msg.left {
  background: var(--white);
  color: var(--t-dk);
  align-self: flex-start;
  border-bottom-left-radius: 2px;
  border: 1px solid var(--bd-lt2);
}
.msg.right {
  background: var(--dark);
  color: var(--white);
  align-self: flex-end;
  border-bottom-right-radius: 2px;
}

/* Card 5: Placement */
.mockup-placement {
  padding: 16px;
  background: var(--white);
}
.placement-tracker {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tracker-header {
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--t-mid);
  letter-spacing: 0.05em;
}
.tracker-steps {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.tracker-steps .step {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 10.5px;
  color: var(--t-mid);
}
.tracker-steps .step.done {
  color: #27c93f;
  font-weight: 600;
}
.tracker-steps .step.active {
  color: var(--t-dk);
  font-weight: 600;
}
.tracker-steps .step .check {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 1px solid var(--bd-lt2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 8px;
}
.tracker-steps .step.done .check {
  background: #eafaf1;
  border-color: #27c93f;
}
.tracker-steps .step.active .check {
  background: rgba(184,134,42,0.1);
  border-color: var(--gold);
  color: var(--gold);
}

/* Card 6: Certifications */
.mockup-cert {
  background: var(--white);
  padding: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cert-frame {
  width: 100%;
  height: 100%;
  border: 4px double var(--bd-lt2);
  padding: 8px;
  box-sizing: border-box;
}
.cert-body {
  border: 1px solid var(--bd-lt2);
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--off-white);
  padding: 10px;
  text-align: center;
}
.cert-body .badge-gold {
  color: var(--gold);
  font-size: 20px;
  line-height: 1;
  margin-bottom: 4px;
}
.cert-body .title {
  font-family: var(--serif);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--t-dk);
}
.cert-body .recipient {
  font-size: 9px;
  color: var(--t-mid);
  margin-bottom: 6px;
}
.cert-body .logos {
  display: flex;
  gap: 12px;
  font-size: 8px;
  font-weight: 700;
  color: var(--t-mid);
  opacity: 0.6;
}

/* Animations */
@keyframes pulse {
  0% { opacity: 0.4; }
  50% { opacity: 1; }
  100% { opacity: 0.4; }
}

@keyframes soundWave {
  0% { height: 2px; }
  100% { height: 12px; }
}

/* ── Mobile/Tablet Stack Fallback ──────────────────────── */
@media(max-width:900px){
  .why-stack-section {
    height: auto;
    padding: var(--s8) 0;
  }
  .why-stack-sticky {
    position: relative;
    top: 0;
    height: auto;
    overflow: visible;
    background: transparent;
  }
  .why-stack-container {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    gap: var(--s5);
  }
  .why-card {
    position: relative;
    width: 100% !important;
    height: auto !important;
    transform: none !important;
    opacity: 1 !important;
    display: flex;
    flex-direction: column;
    gap: var(--s4);
    padding: var(--s5);
    pointer-events: auto !important;
  }
  .why-card__mockup {
    height: 180px;
  }
}