/* ============================================================
   Albakio homepage
   ============================================================ */
.ab-home{
  --ink:#111820; --ink-2:#38404a; --muted:#6a7480;
  --brand:#ED1C24; --brand-dk:#b9121a;
  --forest:#0c3b31; --forest-2:#124e41; --forest-lt:#2b8f74;
  --cream:#FBF7F0; --cream-2:#F3ECE1;
  --line:rgba(17,24,32,.1);
  --clay-lt:rgba(255,255,255,.72); --clay-dk:rgba(8,40,33,.3);
  --ease:cubic-bezier(.22,1,.36,1);
  --spring:cubic-bezier(.34,1.56,.64,1);
  font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  color:var(--ink); overflow-x:clip;
}
.ab-home *,.ab-home *::before,.ab-home *::after{box-sizing:border-box;}
.ab-home .ab-wrap{max-width:1240px; margin:0 auto; padding:0 clamp(20px,4vw,40px);}
.ab-home .ab-center{text-align:center; margin-top:46px;}

/* print-like grain, so the dark panels do not read as flat digital colour */
.ab-home .ab-hero::after,.ab-home .ab-tl::after,.ab-home .ab-final::after{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:2;
  opacity:.26; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/></filter><rect width='160' height='160' filter='url(%23n)' opacity='.5'/></svg>");
}

/* -- shared section furniture -------------------------------- */
.ab-home .ab-sec-head{max-width:720px; margin:0 0 clamp(34px,4.6vw,56px);}
.ab-home .ab-kicker{
  display:inline-flex; align-items:center; gap:9px; margin:0 0 14px;
  font-size:.74rem; font-weight:700; letter-spacing:.15em;
  text-transform:uppercase; color:var(--brand);
}
.ab-home .ab-kicker::before{
  content:""; width:26px; height:2px; background:var(--brand); border-radius:2px;
}
.ab-home .ab-kicker--light{color:#7fe3c0;}
.ab-home .ab-kicker--light::before{background:#7fe3c0;}
.ab-home .ab-sec-head h2{
  margin:0 0 14px; font-size:clamp(1.95rem,4.2vw,3.15rem); font-weight:800;
  line-height:1.06; letter-spacing:-.03em; color:var(--ink);
}
.ab-home .ab-sub{margin:0; max-width:56ch; font-size:clamp(.98rem,1.15vw,1.1rem);
  color:var(--muted);}
.ab-home .ab-sub--light{color:rgba(255,255,255,.76);}

/* -- clay call to action ------------------------------------- */
.ab-home .ab-cta{
  display:inline-flex; align-items:center; gap:11px; padding:17px 32px;
  border-radius:22px; border:0; cursor:pointer; text-decoration:none;
  background:linear-gradient(145deg,#ff3a42,#cf1018);
  color:#fff !important; font-weight:700; font-size:1rem; letter-spacing:-.01em;
  box-shadow:inset 2px 2px 5px rgba(255,255,255,.4),
             inset -3px -4px 9px rgba(120,0,6,.5),
             0 12px 28px rgba(237,28,36,.38);
  transition:transform .38s var(--spring), box-shadow .38s var(--ease);
  will-change:transform;
}
.ab-home .ab-cta svg{width:19px; height:19px; transition:transform .38s var(--ease);}
.ab-home .ab-cta:hover{transform:translateY(-3px);
  box-shadow:inset 2px 2px 5px rgba(255,255,255,.45),
             inset -3px -4px 9px rgba(120,0,6,.5),
             0 20px 40px rgba(237,28,36,.46);}
.ab-home .ab-cta:hover svg{transform:translateX(5px);}
.ab-home .ab-cta:active{transform:translateY(0) scale(.98);}
.ab-home .ab-cta--dark{
  background:linear-gradient(145deg,#1b2a33,#0c161c);
  box-shadow:inset 2px 2px 5px rgba(255,255,255,.17),
             inset -3px -4px 9px rgba(0,0,0,.6),
             0 12px 28px rgba(12,22,28,.3);}
.ab-home .ab-cta--dark:hover{box-shadow:inset 2px 2px 5px rgba(255,255,255,.2),
  inset -3px -4px 9px rgba(0,0,0,.6), 0 20px 40px rgba(12,22,28,.36);}

.ab-home .ab-ghost{
  display:inline-flex; align-items:center; gap:7px; margin-top:auto;
  padding-top:18px; color:var(--brand); font-weight:700; font-size:.93rem;
  text-decoration:none; position:relative; width:fit-content;
}
.ab-home .ab-ghost::after{
  content:""; position:absolute; left:0; bottom:12px; width:100%; height:2px;
  background:currentColor; transform:scaleX(0); transform-origin:left;
  transition:transform .4s var(--ease);
}
.ab-home .ab-ghost:hover::after{transform:scaleX(1);}
.ab-home .ab-ghost--lg{
  padding:17px 28px; margin:0; border-radius:22px; color:#fff;
  border:1px solid rgba(255,255,255,.26);
  background:rgba(255,255,255,.07);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
}
.ab-home .ab-ghost--lg::after{display:none;}
.ab-home .ab-ghost--lg:hover{background:rgba(255,255,255,.14);}

/* ============================================================
   1. HERO  — aurora mesh + clay controls + glass dots
   ============================================================ */
.ab-home .ab-hero{
  position:relative; overflow:hidden; isolation:isolate;
  min-height:clamp(500px,60vw,660px);
  background:
    radial-gradient(900px 620px at 12% 8%, #17604f 0%, transparent 62%),
    radial-gradient(760px 540px at 88% 92%, #0f4a3d 0%, transparent 60%),
    linear-gradient(150deg,#0d4338 0%,#0a3129 56%,#07241e 100%);
}
.ab-home .ab-blob{position:absolute; border-radius:50%; filter:blur(62px);
  opacity:.46; pointer-events:none; z-index:0;}
.ab-home .ab-blob-1{width:470px; height:470px; left:-140px; top:-160px;
  background:radial-gradient(circle,#1f8a6f,transparent 68%);
  animation:ab-drift1 21s ease-in-out infinite;}
.ab-home .ab-blob-2{width:420px; height:420px; right:3%; bottom:-160px;
  background:radial-gradient(circle,rgba(237,28,36,.5),transparent 68%);
  animation:ab-drift2 26s ease-in-out infinite;}
.ab-home .ab-blob-3{width:320px; height:320px; left:44%; top:-120px;
  background:radial-gradient(circle,#36c79e,transparent 70%);
  animation:ab-drift1 31s ease-in-out infinite reverse;}
@keyframes ab-drift1{50%{transform:translate(74px,62px) scale(1.16)}}
@keyframes ab-drift2{50%{transform:translate(-84px,-54px) scale(1.12)}}

.ab-home .ab-track{position:relative; z-index:1; min-height:clamp(500px,60vw,660px);}
.ab-home .ab-slide{position:absolute; inset:0; opacity:0; visibility:hidden;
  transition:opacity .66s var(--ease), visibility .66s;}
.ab-home .ab-slide.is-active{opacity:1; visibility:visible;}
.ab-home .ab-inner{
  max-width:1240px; margin:0 auto; height:100%;
  padding:clamp(40px,5vw,72px) clamp(20px,4vw,40px);
  display:grid; grid-template-columns:minmax(0,1.04fr) minmax(0,1fr);
  gap:clamp(24px,3.6vw,56px); align-items:center;
}
.ab-home .ab-copy{min-width:0;}

/* the eyebrow is glass — it sits over the aurora, so blur has work to do */
.ab-home .ab-eyebrow{
  display:inline-block; margin:0 0 16px; padding:8px 16px; border-radius:999px;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2);
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  color:#9fe9cf; font-size:.73rem; font-weight:700; letter-spacing:.13em;
  text-transform:uppercase;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3);
}
.ab-home .ab-title{
  margin:0 0 18px; color:#fff; font-weight:800; line-height:1;
  font-size:clamp(2.3rem,5.4vw,4.3rem); letter-spacing:-.035em;
  text-shadow:0 4px 24px rgba(0,0,0,.28);
}
.ab-home .ab-lead{margin:0 0 28px; max-width:48ch; color:rgba(255,255,255,.84);
  font-size:clamp(.98rem,1.2vw,1.1rem);}

/* clay stat pills */
.ab-home .ab-stats{display:flex; flex-wrap:wrap; gap:12px; margin-bottom:32px;}
.ab-home .ab-stat{
  padding:14px 20px; border-radius:20px; text-align:center;
  background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.07));
  box-shadow:inset 2px 2px 6px var(--clay-lt),
             inset -3px -4px 8px var(--clay-dk),
             0 8px 20px rgba(0,0,0,.2);
  transition:transform .4s var(--spring);
}
.ab-home .ab-stat:hover{transform:translateY(-5px) scale(1.045);}
.ab-home .ab-stat b{display:block; color:#fff; font-size:1.2rem; font-weight:800;
  line-height:1.15; letter-spacing:-.02em;}
.ab-home .ab-stat span{display:block; margin-top:3px; color:rgba(255,255,255,.66);
  font-size:.69rem; letter-spacing:.09em; text-transform:uppercase;}

/* fanned covers, with a spine edge so they read as objects not thumbnails */
.ab-home .ab-art{position:relative; height:clamp(310px,35vw,450px);
  transform-style:preserve-3d; perspective:1300px; min-width:0;
  transition:transform .5s var(--ease);}
.ab-home .ab-cover{
  position:absolute; margin:0; left:50%; top:50%;
  width:clamp(132px,16vw,204px); aspect-ratio:3/4;
  border-radius:4px 13px 13px 4px; overflow:hidden; background:#fff; opacity:0;
  box-shadow:0 22px 48px rgba(0,0,0,.44), 0 3px 10px rgba(0,0,0,.3);
  transition:transform .55s var(--spring), box-shadow .4s var(--ease);
}
.ab-home .ab-cover::after{
  content:""; position:absolute; left:0; top:0; bottom:0; width:9px;
  background:linear-gradient(90deg,rgba(0,0,0,.34),rgba(0,0,0,.05) 62%,transparent);
}
.ab-home .ab-cover img{width:100%; height:100%; object-fit:cover; display:block;}
.ab-home .ab-slide.is-active .ab-cover{
  animation:ab-fan .9s var(--ease) forwards;}
.ab-home .ab-c0{--r:-21deg; --x:-238px; --y:16px;  --z:0;    animation-delay:.07s;}
.ab-home .ab-c1{--r:-10deg; --x:-124px; --y:-14px; --z:42px; animation-delay:.15s;}
.ab-home .ab-c2{--r:0deg;   --x:-6px;   --y:-28px; --z:84px; animation-delay:.23s;}
.ab-home .ab-c3{--r:10deg;  --x:112px;  --y:-14px; --z:42px; animation-delay:.31s;}
.ab-home .ab-c4{--r:21deg;  --x:226px;  --y:16px;  --z:0;    animation-delay:.39s;}
@keyframes ab-fan{
  from{opacity:0; transform:translate(-50%,-50%) translate3d(0,80px,0) rotate(0) scale(.84);}
  to  {opacity:1; transform:translate(-50%,-50%)
        translate3d(var(--x),var(--y),var(--z)) rotate(var(--r));}
}
.ab-home .ab-cover:hover{
  transform:translate(-50%,-50%) translate3d(var(--x),calc(var(--y) - 26px),
            calc(var(--z) + 70px)) rotate(var(--r)) scale(1.07) !important;
  box-shadow:0 34px 64px rgba(0,0,0,.5); z-index:6;}

/* TickLearn devices */
.ab-home .ab-art--devices{display:grid; place-items:center;}
.ab-home .ab-laptop,.ab-home .ab-phone,.ab-home .ab-appicon{
  position:absolute; margin:0; opacity:0;}
.ab-home .ab-laptop{width:clamp(290px,37vw,490px);}
.ab-home .ab-phone{width:clamp(100px,12vw,156px); right:3%; bottom:3%;}
.ab-home .ab-appicon{width:clamp(54px,6.2vw,84px); left:2%; top:7%;
  border-radius:21px; overflow:hidden;
  box-shadow:0 16px 34px rgba(0,0,0,.42), inset 2px 2px 6px rgba(255,255,255,.3);}
.ab-home .ab-laptop img,.ab-home .ab-phone img{width:100%; height:auto;
  display:block; filter:drop-shadow(0 24px 44px rgba(0,0,0,.48));}
.ab-home .ab-appicon img{width:100%; height:auto; display:block;}
.ab-home .ab-slide.is-active .ab-laptop{
  animation:ab-rise .86s var(--ease) .08s forwards, ab-float 7s ease-in-out 1s infinite;}
.ab-home .ab-slide.is-active .ab-phone{
  animation:ab-rise .86s var(--ease) .26s forwards, ab-float 6s ease-in-out 1.3s infinite reverse;}
.ab-home .ab-slide.is-active .ab-appicon{
  animation:ab-pop .74s var(--spring) .44s forwards, ab-float 8s ease-in-out 1.6s infinite;}
@keyframes ab-rise{from{opacity:0; transform:translateY(58px) scale(.92);}
                   to{opacity:1; transform:translateY(0) scale(1);}}
@keyframes ab-pop{from{opacity:0; transform:scale(.46) rotate(-20deg);}
                  to{opacity:1; transform:scale(1) rotate(0);}}
@keyframes ab-float{50%{transform:translateY(-16px);}}

/* glass dot rail */
.ab-home .ab-dots{
  position:absolute; left:50%; bottom:clamp(18px,2.6vw,34px); z-index:3;
  transform:translateX(-50%); display:flex; gap:10px; padding:9px;
  border-radius:999px; background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.17);
  backdrop-filter:blur(16px) saturate(150%);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3), 0 8px 26px rgba(0,0,0,.26);
}
.ab-home .ab-dot{
  position:relative; display:inline-flex; align-items:center; gap:9px;
  padding:9px 17px 9px 11px; border:0; border-radius:999px; cursor:pointer;
  background:transparent; color:rgba(255,255,255,.72);
  font:inherit; font-size:.8rem; font-weight:600; line-height:1;
  transition:background .34s var(--ease), color .34s;
}
.ab-home .ab-dot svg{width:19px; height:19px; transform:rotate(-90deg); flex:none;}
.ab-home .ab-dot circle{fill:none; stroke-width:3.4;}
.ab-home .ab-ring-bg{stroke:rgba(255,255,255,.26);}
.ab-home .ab-ring{stroke:#fff; stroke-dasharray:100.5; stroke-dashoffset:100.5;}
.ab-home .ab-dot.is-active{color:#fff;
  background:linear-gradient(145deg,rgba(255,255,255,.22),rgba(255,255,255,.08));
  box-shadow:inset 1px 1px 3px rgba(255,255,255,.34),
             inset -2px -2px 6px rgba(0,0,0,.24);}
.ab-home .ab-dot.is-active .ab-ring{animation:ab-ring var(--dur,7s) linear forwards;}
@keyframes ab-ring{to{stroke-dashoffset:0;}}
.ab-home .ab-dot:focus-visible{outline:2px solid #fff; outline-offset:3px;}

/* ============================================================
   2. FIGURES  — neumorphism, the one flat light surface
   ============================================================ */
.ab-home .ab-figs{background:var(--cream); padding:clamp(54px,6vw,86px) 0;}
.ab-home .ab-figs .ab-wrap{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:clamp(16px,2.4vw,28px);}
.ab-home .ab-fig{
  padding:30px 26px; border-radius:26px; background:var(--cream);
  box-shadow:9px 9px 20px rgba(176,164,146,.4),
             -9px -9px 20px rgba(255,255,255,.95);
  transition:box-shadow .45s var(--ease), transform .45s var(--spring);
}
.ab-home .ab-fig:hover{transform:translateY(-4px);
  box-shadow:13px 13px 28px rgba(176,164,146,.5),
             -13px -13px 28px rgba(255,255,255,1);}
.ab-home .ab-fig b{display:block; font-size:clamp(2rem,3.4vw,2.9rem);
  font-weight:800; line-height:1; letter-spacing:-.04em; color:var(--forest);}
.ab-home .ab-fig-k{display:block; margin-top:9px; font-size:1rem;
  font-weight:700; color:var(--ink);}
.ab-home .ab-fig-s{display:block; margin-top:3px; font-size:.85rem;
  color:var(--muted);}

/* ============================================================
   3. ABOUT  — clay cards, deliberately uneven columns
   ============================================================ */
.ab-home .ab-about{padding:clamp(66px,8vw,110px) 0; background:#fff;}
.ab-home .ab-cards{
  display:grid; grid-template-columns:1.15fr 1fr 1fr;
  gap:clamp(18px,2.4vw,30px); align-items:start;}
.ab-home .ab-card{
  display:flex; flex-direction:column; padding:30px 28px 26px;
  border-radius:30px; background:var(--cream);
  box-shadow:inset 3px 3px 7px rgba(255,255,255,.95),
             inset -5px -6px 13px rgba(176,164,146,.4),
             0 16px 38px rgba(17,24,32,.08);
  transition:transform .5s var(--spring), box-shadow .5s var(--ease);
}
.ab-home .ab-card:hover{transform:translateY(-7px);
  box-shadow:inset 3px 3px 7px rgba(255,255,255,.95),
             inset -5px -6px 13px rgba(176,164,146,.4),
             0 28px 56px rgba(17,24,32,.13);}
.ab-home .ab-card:nth-child(2){margin-top:clamp(0px,2.4vw,30px);}
.ab-home .ab-card:nth-child(3){margin-top:clamp(0px,4.6vw,58px);}
.ab-home .ab-card-ico{
  width:92px; height:92px; margin-bottom:20px; border-radius:24px;
  overflow:hidden; flex:none;
  box-shadow:0 10px 24px rgba(17,24,32,.16),
             inset 0 1px 0 rgba(255,255,255,.5);}
.ab-home .ab-card-ico img{width:100%; height:100%; object-fit:cover; display:block;}
.ab-home .ab-card h3{margin:0 0 14px; font-size:1.34rem; font-weight:800;
  letter-spacing:-.02em; color:var(--ink);}
.ab-home .ab-card p{margin:0 0 12px; color:var(--ink-2); font-size:.96rem;}
.ab-home .ab-card--rose .ab-card-ico{box-shadow:0 10px 24px rgba(166,74,52,.3);}
.ab-home .ab-card--mint .ab-card-ico{box-shadow:0 10px 24px rgba(106,166,104,.3);}
.ab-home .ab-card--amber .ab-card-ico{box-shadow:0 10px 24px rgba(186,142,66,.3);}
.ab-home .ab-ticks{list-style:none; margin:0 0 10px; padding:0;}
.ab-home .ab-ticks li{position:relative; padding:7px 0 7px 30px;
  color:var(--ink-2); font-size:.95rem;}
.ab-home .ab-ticks li::before{
  content:""; position:absolute; left:0; top:11px; width:18px; height:18px;
  border-radius:50%; background:var(--forest-lt);
  box-shadow:inset 0 -2px 4px rgba(0,0,0,.18), 0 2px 5px rgba(43,143,116,.4);}
.ab-home .ab-ticks li::after{
  content:""; position:absolute; left:5.5px; top:15.5px; width:7px; height:4px;
  border-left:2px solid #fff; border-bottom:2px solid #fff;
  transform:rotate(-45deg);}
.ab-home .ab-verse{
  margin:16px 0 6px !important; padding:16px 18px; border-radius:18px;
  background:linear-gradient(145deg,#fff,var(--cream-2));
  font-size:1.18rem; line-height:2; text-align:center; color:var(--forest);
  box-shadow:inset 2px 2px 5px rgba(255,255,255,.9),
             inset -3px -3px 8px rgba(176,164,146,.36);}

/* ============================================================
   4. SERIES  — glass tiles over cover art
   ============================================================ */
.ab-home .ab-series{
  position:relative; padding:clamp(66px,8vw,110px) 0;
  background:linear-gradient(180deg,#fff 0%,var(--cream) 100%);}
.ab-home .ab-tiles{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(236px,1fr));
  gap:clamp(16px,2.2vw,26px);}
/* break the rhythm so the grid does not read as a template */
.ab-home .ab-tile:nth-child(5n+1){grid-column:span 2;}
@media(max-width:760px){.ab-home .ab-tile:nth-child(5n+1){grid-column:span 1;}}
.ab-home .ab-tile{
  position:relative; display:flex; flex-direction:column; overflow:hidden;
  border-radius:26px; text-decoration:none; background:var(--forest);
  min-height:270px; isolation:isolate;
  box-shadow:0 14px 34px rgba(17,24,32,.14);
  transition:transform .5s var(--spring), box-shadow .5s var(--ease);
}
.ab-home .ab-tile:hover{transform:translateY(-8px);
  box-shadow:0 30px 60px rgba(17,24,32,.22);}
.ab-home .ab-tile-img{position:absolute; inset:0; z-index:0;}
.ab-home .ab-tile-img img{width:100%; height:100%; object-fit:cover;
  display:block; transition:transform 1.1s var(--ease); transform:scale(1.02);}
.ab-home .ab-tile:hover .ab-tile-img img{transform:scale(1.1);}
.ab-home .ab-tile-img::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(7,36,30,.1) 0%,rgba(7,36,30,.5) 48%,
             rgba(7,36,30,.9) 100%);}
/* the glass plate — real blur, because there is an image behind it */
.ab-home .ab-tile-txt{
  position:relative; z-index:1; margin:auto 14px 14px; padding:16px 18px;
  border-radius:18px; background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.2);
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.34);
}
.ab-home .ab-tile-txt h3{margin:0 0 4px; color:#fff; font-size:1.08rem;
  font-weight:800; letter-spacing:-.015em;}
.ab-home .ab-tile-txt p{margin:0; color:rgba(255,255,255,.76); font-size:.84rem;}
.ab-home .ab-tile-go{
  position:absolute; z-index:2; right:16px; top:16px;
  width:40px; height:40px; display:grid; place-items:center; border-radius:50%;
  background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.26);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  color:#fff; opacity:0; transform:translateX(-7px);
  transition:opacity .42s var(--ease), transform .42s var(--spring);}
.ab-home .ab-tile-go svg{width:17px; height:17px;}
.ab-home .ab-tile:hover .ab-tile-go{opacity:1; transform:translateX(0);}

/* ============================================================
   5. TICKLEARN  — dark band, overlapping the section above
   ============================================================ */
.ab-home .ab-tl{
  position:relative; isolation:isolate; overflow:hidden;
  margin-top:clamp(-40px,-4vw,-20px); padding:clamp(78px,9vw,126px) 0;
  border-radius:clamp(30px,4vw,56px) clamp(30px,4vw,56px) 0 0;
  background:
    radial-gradient(760px 520px at 84% 14%, rgba(237,28,36,.26) 0%, transparent 62%),
    radial-gradient(700px 500px at 10% 86%, #15624f 0%, transparent 60%),
    linear-gradient(160deg,#0d4338,#07241e);
}
.ab-home .ab-tl-grid{position:relative; z-index:1;
  display:grid; grid-template-columns:1.1fr .9fr;
  gap:clamp(30px,4.4vw,64px); align-items:center;}
.ab-home .ab-tl h2{margin:0 0 16px; color:#fff; font-weight:800;
  font-size:clamp(1.95rem,4.2vw,3.1rem); line-height:1.05; letter-spacing:-.03em;}
.ab-home .ab-feats{display:grid; gap:14px; margin:30px 0 34px;}
.ab-home .ab-feat{
  padding:18px 22px; border-radius:20px;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2);
  transition:transform .42s var(--spring), background .42s;}
.ab-home .ab-feat:hover{transform:translateX(7px); background:rgba(255,255,255,.11);}
.ab-home .ab-feat h4{margin:0 0 4px; color:#fff; font-size:1rem; font-weight:700;}
.ab-home .ab-feat p{margin:0; color:rgba(255,255,255,.68); font-size:.9rem;}
.ab-home .ab-tl-art{position:relative; display:grid; place-items:center;
  min-height:clamp(300px,34vw,430px);}
.ab-home .ab-tl-phone{width:clamp(170px,20vw,260px); height:auto;
  filter:drop-shadow(0 30px 56px rgba(0,0,0,.5));
  animation:ab-float 7s ease-in-out infinite;}
.ab-home .ab-tl-icon{position:absolute; right:8%; top:12%;
  width:clamp(56px,6.4vw,86px); height:auto; border-radius:20px;
  box-shadow:0 18px 38px rgba(0,0,0,.44);
  animation:ab-float 9s ease-in-out 1s infinite reverse;}

/* ============================================================
   6. SCHOOLS  — marquee
   ============================================================ */
.ab-home .ab-schools{padding:clamp(60px,7vw,96px) 0; background:var(--cream);
  overflow:hidden;}
.ab-home .ab-schools .ab-sec-head{text-align:center; margin-inline:auto;}
.ab-home .ab-schools .ab-kicker{justify-content:center;}
.ab-home .ab-marquee{
  position:relative;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);}
.ab-home .ab-marquee-row{display:flex; gap:clamp(20px,3vw,46px); width:max-content;
  animation:ab-slide 42s linear infinite;}
.ab-home .ab-marquee:hover .ab-marquee-row{animation-play-state:paused;}
@keyframes ab-slide{to{transform:translateX(-50%);}}
.ab-home .ab-logo{
  flex:none; width:clamp(122px,13vw,168px); height:84px; padding:16px 20px;
  display:grid; place-items:center; border-radius:20px; background:#fff;
  box-shadow:6px 6px 15px rgba(176,164,146,.34),
             -6px -6px 15px rgba(255,255,255,.95);
  transition:transform .4s var(--spring);}
.ab-home .ab-logo:hover{transform:translateY(-4px) scale(1.04);}
.ab-home .ab-logo img{max-width:100%; max-height:100%; object-fit:contain;
  filter:grayscale(1); opacity:.62; transition:filter .4s, opacity .4s;}
.ab-home .ab-logo:hover img{filter:grayscale(0); opacity:1;}

/* ============================================================
   7. FINAL CTA
   ============================================================ */
.ab-home .ab-final{position:relative; isolation:isolate; overflow:hidden;
  padding:clamp(60px,7vw,100px) 0 clamp(70px,8vw,112px);
  background:linear-gradient(170deg,var(--cream) 0%,var(--cream-2) 100%);}
.ab-home .ab-final-card{
  position:relative; z-index:1; padding:clamp(40px,5.4vw,76px) clamp(26px,4vw,64px);
  border-radius:clamp(28px,3.6vw,44px); text-align:center; overflow:hidden;
  background:
    radial-gradient(640px 420px at 82% 16%, rgba(237,28,36,.3) 0%, transparent 62%),
    linear-gradient(150deg,#123f35,#07241e);
  box-shadow:0 34px 76px rgba(7,36,30,.34),
             inset 0 1px 0 rgba(255,255,255,.14);}
.ab-home .ab-final-card h2{margin:0 0 14px; color:#fff; font-weight:800;
  font-size:clamp(1.9rem,4vw,3rem); line-height:1.06; letter-spacing:-.03em;}
.ab-home .ab-final-card p{margin:0 auto 32px; max-width:56ch;
  color:rgba(255,255,255,.78); font-size:clamp(.98rem,1.15vw,1.08rem);}
.ab-home .ab-final-btns{display:flex; flex-wrap:wrap; gap:14px;
  justify-content:center;}

/* ============================================================
   scroll reveal
   ============================================================ */
.ab-home [data-reveal]{opacity:0; transform:translateY(32px);
  transition:opacity .85s var(--ease), transform .85s var(--ease);}
.ab-home [data-reveal].is-in{opacity:1; transform:none;}
.ab-home .ab-cards [data-reveal]:nth-child(2),
.ab-home .ab-tiles [data-reveal]:nth-child(2){transition-delay:.09s;}
.ab-home .ab-cards [data-reveal]:nth-child(3),
.ab-home .ab-tiles [data-reveal]:nth-child(3){transition-delay:.18s;}
.ab-home .ab-tiles [data-reveal]:nth-child(4){transition-delay:.27s;}
.ab-home .ab-tiles [data-reveal]:nth-child(5){transition-delay:.36s;}
.ab-home .ab-figs [data-reveal]:nth-child(2){transition-delay:.08s;}
.ab-home .ab-figs [data-reveal]:nth-child(3){transition-delay:.16s;}
.ab-home .ab-figs [data-reveal]:nth-child(4){transition-delay:.24s;}

/* ============================================================
   responsive
   ============================================================ */
@media(max-width:1040px){
  .ab-home .ab-cards{grid-template-columns:1fr 1fr;}
  .ab-home .ab-card:nth-child(3){grid-column:span 2; margin-top:0;}
  .ab-home .ab-tl-grid{grid-template-columns:1fr;}
  .ab-home .ab-tl-art{order:-1;}
}
@media(max-width:980px){
  .ab-home .ab-inner{grid-template-columns:1fr; text-align:center;
    padding-bottom:96px;}
  .ab-home .ab-lead{margin-inline:auto;}
  .ab-home .ab-stats{justify-content:center;}
  .ab-home .ab-art{height:clamp(230px,48vw,320px); order:-1;}
  .ab-home .ab-cover{width:clamp(100px,23vw,146px);}
  .ab-home .ab-c0{--x:-156px;} .ab-home .ab-c1{--x:-82px;}
  .ab-home .ab-c3{--x:78px;}   .ab-home .ab-c4{--x:152px;}
}
@media(max-width:680px){
  .ab-home .ab-cards{grid-template-columns:1fr;}
  .ab-home .ab-card:nth-child(2),.ab-home .ab-card:nth-child(3){
    margin-top:0; grid-column:auto;}
  .ab-home .ab-dot span{display:none;}
  .ab-home .ab-dot{padding:9px;}
  .ab-home .ab-c0,.ab-home .ab-c4{display:none;}
  .ab-home .ab-c1{--x:-68px;} .ab-home .ab-c3{--x:66px;}
  .ab-home .ab-phone{display:none;}
}

/* ============================================================
   anyone who asked for less motion gets a still page
   ============================================================ */
@media(prefers-reduced-motion:reduce){
  .ab-home *,.ab-home *::before,.ab-home *::after{
    animation:none !important; transition:none !important;}
  .ab-home [data-reveal]{opacity:1; transform:none;}
  .ab-home .ab-cover,.ab-home .ab-laptop,.ab-home .ab-phone,
  .ab-home .ab-appicon{opacity:1;}
  .ab-home .ab-cover{transform:translate(-50%,-50%)
    translate3d(var(--x),var(--y),var(--z)) rotate(var(--r));}
}