/* ==========================================================
   DIGIPANDA — shared styles (index, about, contact, blogs)
   1 Tokens/base · 2 Shared components · 3 Navbar · 4 Footer
   5 Index · 6 About · 7 Contact · 8 Blog
   ========================================================== */

/* ===== 1. TOKENS & BASE ===== */
:root{
  --ff-serif:"Plus Jakarta Sans",system-ui,sans-serif;--ff-h:"Inter",system-ui,sans-serif;--ff-body:"Inter",system-ui,sans-serif;
  --blue:#1F5DAD;--blue-deep:#0E2E58;--blue-dark:#081E3D;--blue-mid:#2A6FC4;--blue-soft:#E8EFF9;--blue-tint:#F4F8FD;--sky:#4C86E0;--navy:#0A1F3D;
  --green:#3DA857;--green-dark:#2D8442;--green-soft:#E5F3E9;--green-tint:#EEF8F1;--mint:#A8D6B7;
  --ink:#0A1522;--ink-2:#1E2B3D;--muted:#5E6D80;--soft:#F1F5FB;--card:#F6F8FC;
  --line:rgba(14,46,88,.08);--line-2:rgba(14,46,88,.14);
  --shadow-sm:0 2px 8px rgba(14,46,88,.06);--shadow-md:0 8px 24px rgba(14,46,88,.08);
  --shadow-lg:0 16px 40px rgba(14,46,88,.1);--shadow-xl:0 24px 60px rgba(14,46,88,.14)
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:100px;-webkit-text-size-adjust:100%}
body{font:15.5px/1.6 var(--ff-body);background:#fff;color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--ff-serif);font-weight:700;letter-spacing:-.025em;color:var(--blue-deep);line-height:1.2}
em{font-style:normal}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--green);outline-offset:3px;border-radius:6px}
section{padding:100px 0;position:relative}
.wrap{max-width:1240px;margin:0 auto;padding:0 32px}
.cv{content-visibility:auto;contain-intrinsic-size:auto 900px}
.i{width:1.2em;height:1.2em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
@keyframes floatSlow{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-14px) rotate(2deg)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes hxbob{50%{transform:translateY(-8px)}}
@keyframes orbSpin{to{transform:rotate(360deg)}}
@keyframes corePulse{0%{transform:scale(.9);opacity:.55}100%{transform:scale(1.5);opacity:0}}
@keyframes twinkle{50%{opacity:.35;transform:scale(.7)}}

/* ===== 2. SHARED COMPONENTS ===== */
.logo-mark{position:relative;display:inline-block;flex:none;width:36px;height:36px;border-radius:12px;background:linear-gradient(135deg,#3DA857,#1F5DAD);box-shadow:0 6px 14px rgba(31,93,173,.3)}
.logo-mark::after{content:"";position:absolute;inset:9px;border-radius:50%;border:3px solid #fff}
.btn-solid{background:var(--green);color:#fff;padding:15px 30px;border-radius:100px;font:600 .88rem var(--ff-h);display:inline-flex;align-items:center;gap:10px;transition:.25s;box-shadow:0 10px 26px rgba(61,168,87,.3);cursor:pointer;border:none}
.btn-solid:hover{background:var(--green-dark);transform:translateY(-2px)}
.btn-ghost{color:var(--blue-deep);background:#fff;padding:15px 30px;border-radius:100px;font:500 .88rem var(--ff-h);border:1.5px solid var(--line-2);box-shadow:var(--shadow-sm);display:inline-flex;align-items:center;gap:10px;transition:.25s}
.btn-ghost:hover{border-color:var(--blue);background:var(--blue-soft)}
.btn-ghost-light{background:rgba(255,255,255,.08);color:#fff;padding:15px 30px;border-radius:100px;font:500 .9rem var(--ff-h);border:1px solid rgba(255,255,255,.25);transition:.25s}
.btn-ghost-light:hover{background:rgba(255,255,255,.15)}
.sec-num{display:inline-flex;align-items:center;gap:8px;font:600 .72rem var(--ff-h);color:var(--green-dark);letter-spacing:.14em;text-transform:uppercase;margin-bottom:16px;background:var(--green-soft);padding:7px 14px;border-radius:100px}
.sec-num::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green)}
.sec-head{max-width:760px;margin-bottom:64px}
.sec-head h2,.h2{font-size:clamp(1.9rem,3.6vw,2.7rem);line-height:1.15;color:var(--blue-deep);margin-bottom:16px}
.sec-head h2 em,.h2 em{color:var(--green)}
.sec-head p{font-size:.98rem;color:var(--muted);line-height:1.75;max-width:600px}
.center{text-align:center;margin-left:auto;margin-right:auto}
.sec-head.center p{margin-left:auto;margin-right:auto}

/* floating button + scroll bar + reveal */
#scrollBar{position:fixed;top:0;left:0;height:4px;width:100%;transform:scaleX(0);transform-origin:0 50%;z-index:80;background:linear-gradient(90deg,var(--blue),var(--green))}
.fab{position:fixed;right:24px;bottom:24px;z-index:75;width:58px;height:58px;border-radius:50%;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.4rem;box-shadow:0 12px 30px rgba(61,168,87,.4);transition:.3s}
.fab:hover{transform:scale(1.1);background:var(--green-dark)}
.rv{opacity:0;transform:translateY(38px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.rv.from-left{transform:translateX(-50px)}.rv.from-right{transform:translateX(50px)}.rv.zoom{transform:scale(.92)}
.rv.in{opacity:1;transform:none}

/* ===== 3. NAVBAR (floating-notch tab bar, same on every page) ===== */
.nb-wrap{position:fixed;top:34px;left:0;right:0;z-index:90;padding:0 20px;pointer-events:none;transition:top .3s}
.nb-wrap.scrolled{top:24px}
.nb{--nx:-200px;pointer-events:auto;position:relative;max-width:1180px;margin:0 auto;height:76px;display:flex;align-items:stretch;justify-content:space-between;gap:20px;padding:0 12px 0 26px;filter:drop-shadow(0 14px 22px rgba(14,46,88,.18));isolation:isolate}
.nb::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(rgba(255,255,255,.12) 1px,transparent 1.4px) 0 0/14px 14px,linear-gradient(100deg,#081E3D 0%,#0E2E58 50%,#1F5DAD 130%);border-radius:26px;-webkit-mask:radial-gradient(circle at var(--nx) 0,transparent 37px,#000 38px);mask:radial-gradient(circle at var(--nx) 0,transparent 37px,#000 38px)}
/* logo: bigger */
.nb-logo{
  align-self:center;
  display:flex;
  align-items:center;
  flex:none;
  width:160px;
  height:56px;
  padding:0;
  background:none;
  box-shadow:none;
  overflow:visible;
}
.nb-logo img{
  display:block;
  width:170px;
  height:auto;
  max-width:none;
  object-fit:contain;
  transform:scale(3.2);          /* make bigger: 3.5 / 4 | smaller: 2.8 / 2.5 */
  transform-origin:0 50%;        /* grows to the right, not into the edge */
  margin-left:-34px;             /* pulls it back to the left padding; adjust if it's cut off or too far left */
}
.nb-logo em span{color:#9CC8FA}
.nb-logo .logo-mark{background:linear-gradient(135deg,#BBD6F5,#2A6FC4);box-shadow:0 6px 14px rgba(0,0,0,.3);transition:transform .4s}
.nb-logo:hover .logo-mark{transform:rotate(-12deg) scale(1.06)}
.nb-menu{display:flex;align-items:stretch;gap:4px;list-style:none;margin:0 auto}
.nb-item{position:relative;display:flex}
.nb-link{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:5px;min-width:92px;padding:0 12px 13px;border:0;background:none;font:600 .8rem var(--ff-h);color:rgba(255,255,255,.72);cursor:pointer;white-space:nowrap;transition:color .2s}
.nb-ico{display:flex;align-items:center;justify-content:center;width:26px;height:26px;transition:.3s}
.nb-i{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.nb-link:hover,.nb-item:hover>.nb-link,.nb-item.open>.nb-link{color:#fff}
.nb-link:hover .nb-ico{transform:translateY(-3px)}
.nb-link.active{color:#fff;font-weight:800}
.nb-link.active .nb-ico{position:absolute;left:50%;top:-30px;width:60px;height:60px;margin-left:-30px;border-radius:50%;color:var(--blue-deep);background:linear-gradient(135deg,#fff,#CFE2FA);box-shadow:0 12px 24px rgba(8,30,61,.45)}
.nb-link.active:hover .nb-ico{transform:none}
.nb-link.active .nb-i{width:28px;height:28px;stroke-width:1.9}
.nb-dd-wrap{position:absolute;top:100%;left:50%;padding-top:22px;opacity:0;visibility:hidden;transform:translateX(-50%) translateY(10px);transition:opacity .22s,transform .22s,visibility .22s}
.nb-item:hover .nb-dd-wrap,.nb-item.open .nb-dd-wrap,.nb-item:focus-within .nb-dd-wrap{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.nb-dd{position:relative;width:600px;display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:14px;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:0 28px 64px rgba(14,46,88,.2)}
.nb-dd::before{content:"";position:absolute;top:-7px;left:50%;width:16px;height:16px;margin-left:-8px;background:#fff;border-left:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg);border-radius:4px 0 0 0}
.nb-dd a{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;transition:background .2s,transform .2s}
.nb-dd a:hover{background:var(--blue-tint);transform:translateX(3px)}
.nb-ic{width:42px;height:42px;flex:none;border-radius:13px;display:flex;align-items:center;justify-content:center;background:var(--blue-soft);color:var(--blue);transition:.2s}
.nb-dd a:hover .nb-ic{background:linear-gradient(135deg,var(--blue-mid),var(--blue-deep));color:#fff}
.nb-dd .nb-i{width:19px;height:19px;stroke-width:1.9}
.nb-dd strong{display:block;font:600 .88rem var(--ff-h);color:var(--blue-deep);line-height:1.3}
.nb-dd span.d{display:block;font-size:.76rem;color:var(--muted);line-height:1.4}
.nb-dd a.nb-all{grid-column:1/-1;justify-content:center;margin-top:6px;background:var(--blue-soft);color:var(--blue);font:600 .84rem var(--ff-h)}
.nb-dd a.nb-all:hover{background:var(--blue);color:#fff;transform:none}
.nb-cta{align-self:center;display:inline-flex;align-items:center;gap:10px;flex:none;padding:14px 24px;border-radius:100px;background:#fff;color:var(--blue-deep);font:700 .88rem var(--ff-h);white-space:nowrap;box-shadow:0 10px 22px rgba(0,0,0,.28);transition:.25s}
.nb-cta:hover{transform:translateY(-2px)}
.nb-cta b{font-size:1.05rem;transition:transform .25s}
.nb-cta:hover b{transform:translateX(3px)}

/* ===== 4. FOOTER ===== */
footer{background:var(--blue-dark);color:rgba(255,255,255,.7);padding:80px 0 0}
.foot-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:56px;padding-bottom:56px;border-bottom:1px solid rgba(255,255,255,.1)}
.foot-brand{display:flex;align-items:center;gap:11px;font:700 1.5rem var(--ff-serif);color:#fff;margin-bottom:22px}
.foot-brand em span{color:var(--mint)}
.foot-desc{font-size:.88rem;color:rgba(255,255,255,.55);max-width:320px;line-height:1.8;margin-bottom:26px}
.foot-social{display:flex;gap:10px}
.foot-social a{width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font:600 .78rem var(--ff-h);transition:.25s;color:#fff}
.foot-social a:hover{background:var(--green);transform:translateY(-3px)}
.foot-col h4{font:700 .7rem var(--ff-h);letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:22px}
.foot-col a{display:block;font-size:.88rem;margin-bottom:12px;color:rgba(255,255,255,.65);transition:.2s}
.foot-col a:hover{color:var(--mint);padding-left:4px}
.foot-contact-item{display:flex;gap:12px;align-items:flex-start;margin-bottom:16px}
.foot-contact-item .ic{width:36px;height:36px;flex:none;border-radius:10px;background:rgba(61,168,87,.15);display:flex;align-items:center;justify-content:center;color:var(--green)}
.foot-contact-item span:last-child{font-size:.86rem;color:rgba(255,255,255,.7);line-height:1.55}
.foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;padding:26px 0;font-size:.8rem;color:rgba(255,255,255,.4)}
.foot-bottom a{color:rgba(255,255,255,.55)}.foot-bottom a:hover{color:var(--mint)}
.foot-bottom-links{display:flex;gap:26px}

/* ===== 5. INDEX ===== */
/* hero */
.hx{--pl:clamp(24px,4.5vw,72px);padding:0;overflow:hidden;position:relative;background:linear-gradient(180deg,#E2EDFB 0%,#F5FAFF 60%,#fff 100%)}
.hx-blob{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none}
.hx-blob.b1{width:440px;height:440px;left:-140px;top:70px;background:rgba(42,111,196,.26)}
.hx-blob.b2{width:540px;height:540px;right:-170px;bottom:-140px;background:rgba(31,93,173,.30)}
.hx-wrap{position:relative;z-index:1;width:100%}
.hx-card{position:relative;overflow:hidden;display:grid;grid-template-columns:1.02fr 1fr;align-items:center;min-height:720px;padding:170px 0 120px var(--pl)}
.hx-waves{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hx-waves path{fill:none;stroke:#1F5DAD;stroke-width:1.2;opacity:.12}
.hx-waves path:nth-child(even){stroke:#2A6FC4;opacity:.16}
.hx-dg{position:absolute;top:130px;right:var(--pl);width:62px;height:48px;background:radial-gradient(var(--blue) 1.7px,transparent 2.1px) 0 0/12px 12px;opacity:.45;pointer-events:none}
.hx-art{--cs:370px;position:relative;height:440px;z-index:1}
.hx-strip{position:absolute;left:0;top:0;bottom:0;width:64px;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;border-radius:18px;background:linear-gradient(180deg,#2A6FC4,var(--blue-deep));box-shadow:0 14px 30px rgba(14,46,88,.35),inset 0 0 0 1px rgba(255,255,255,.18)}
.hx-strip a{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;transition:.2s}
.hx-strip a:hover{background:#fff;color:var(--blue);transform:scale(1.12)}
.hx-strip svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.hx-band{position:absolute;left:calc(var(--pl) * -1);right:84px;top:50%;height:250px;margin-top:-125px;z-index:1;border-radius:0 26px 26px 0;background:linear-gradient(100deg,var(--blue-deep) 0%,var(--blue) 60%,var(--blue-mid) 100%);box-shadow:0 20px 44px rgba(14,46,88,.2);overflow:hidden}
.hx-band::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(255,255,255,.07) 0 2px,transparent 2px 16px)}
.hx-fl{position:absolute;z-index:3;left:84px;display:flex;align-items:center;gap:8px;padding:8px 14px 8px 8px;border-radius:100px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.4);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font:700 .74rem var(--ff-h);letter-spacing:.04em;box-shadow:0 10px 24px rgba(8,30,61,.25);animation:hxbob 4.5s ease-in-out infinite}
.hx-fl i{width:26px;height:26px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:.7rem;font-weight:800;color:var(--blue)}
.hx-fl.f1{top:calc(50% - 92px)}
.hx-fl.f2{top:calc(50% - 20px);left:104px;animation-delay:.9s}.hx-fl.f2 i{color:var(--green-dark)}
.hx-fl.f3{top:calc(50% + 52px);animation-delay:1.8s}.hx-fl.f3 i{color:#E5484D}
.hx-circ{position:absolute;right:30px;top:50%;width:var(--cs);height:var(--cs);margin-top:calc(var(--cs) / -2);z-index:2}
.hx-circ::before{content:"";position:absolute;inset:-22px;border-radius:50%;border:4px solid transparent;border-top-color:var(--blue-mid);border-left-color:var(--blue-deep);transform:rotate(-20deg)}
.hx-circ::after{content:"";position:absolute;inset:-34px;border-radius:50%;border:2px dashed rgba(31,93,173,.28)}
.hx-cv{position:absolute;inset:0;border-radius:50%;overflow:hidden;border:10px solid #fff;container-type:size;background:radial-gradient(circle at 30% 20%,#2A6FC4 0%,transparent 55%),radial-gradient(circle at 80% 90%,#3DA857 0%,transparent 45%),linear-gradient(135deg,#0A2547,#1F5DAD 70%);box-shadow:0 24px 60px rgba(8,30,61,.3)}
.hx-cv::before{content:"";position:absolute;inset:0;background:radial-gradient(rgba(255,255,255,.14) 1px,transparent 1.4px) 0 0/5cqw 5cqw;-webkit-mask-image:radial-gradient(circle,#000 30%,transparent 75%);mask-image:radial-gradient(circle,#000 30%,transparent 75%)}
.ring{position:absolute;left:50%;top:50%;border:1.5px dashed rgba(255,255,255,.3);border-radius:50%;transform:translate(-50%,-50%)}
.ring.r1{width:66cqw;height:66cqw}.ring.r2{width:92cqw;height:92cqw;border-style:solid;border-color:rgba(255,255,255,.12)}
.core{position:absolute;left:50%;top:50%;width:27cqw;height:27cqw;margin:-13.5cqw 0 0 -13.5cqw;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.2cqw;color:#fff;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 0 6cqw rgba(107,201,126,.45)}
.core::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(107,201,126,.7);animation:corePulse 2.6s ease-out infinite}
.core .mk{position:relative;width:9.5cqw;height:9.5cqw;border-radius:30%;background:linear-gradient(135deg,#3DA857,#1F5DAD);box-shadow:0 1.2cqw 2.4cqw rgba(0,0,0,.3)}
.core .mk::after{content:"";position:absolute;inset:2.4cqw;border-radius:50%;border:.9cqw solid #fff}
.core b{font:800 3.3cqw/1 var(--ff-serif);letter-spacing:.04em;text-transform:uppercase}
.orb{position:absolute;inset:0;animation:orbSpin 28s linear infinite}
.orb-i{position:absolute;left:50%;top:50%;width:17cqw;height:17cqw;margin:-8.5cqw 0 0 -8.5cqw;transform:rotate(var(--a)) translateY(-33cqw) rotate(calc(var(--a) * -1))}
.chip{width:100%;height:100%;border-radius:28%;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:0 1.6cqw 3.2cqw rgba(4,18,40,.35);animation:orbSpin 28s linear infinite reverse}
.chip svg{width:64%;height:64%}
.orb2{position:absolute;inset:0;animation:orbSpin 46s linear infinite reverse}
.orb2 i{position:absolute;left:50%;top:50%;width:2.6cqw;height:2.6cqw;margin:-1.3cqw;border-radius:50%;background:var(--mint);box-shadow:0 0 2cqw #6BC97E;transform:rotate(var(--a)) translateY(-45cqw);animation:twinkle 3s ease-in-out infinite}
.hx-circ.paused *{animation-play-state:paused!important}
.hx-pp{position:absolute;right:34px;bottom:22px;z-index:4;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:var(--blue-deep);font-size:.68rem;cursor:pointer;box-shadow:var(--shadow-md);transition:.2s}
.hx-pp:hover{background:var(--blue);color:#fff}
.hx-badge{position:absolute;left:-48px;bottom:28px;z-index:4;width:116px;height:116px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;border:6px solid #fff;background:linear-gradient(135deg,var(--blue-mid),var(--blue));box-shadow:0 18px 40px rgba(31,93,173,.45)}
.hx-badge b{font:800 1.75rem/1 var(--ff-serif);letter-spacing:-.03em}
.hx-badge span{margin-top:4px;font:700 .6rem var(--ff-h);letter-spacing:.12em;text-transform:uppercase}
.hx-chip{position:absolute;z-index:4;right:-14px;top:14px;display:flex;align-items:center;gap:10px;padding:10px 16px;border-radius:16px;background:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.95);box-shadow:0 14px 34px rgba(14,46,88,.16);animation:hxbob 5s ease-in-out infinite}
.hx-chip b{font:800 1.3rem var(--ff-serif);color:var(--blue)}
.hx-chip span{font:600 .72rem var(--ff-h);color:var(--blue-deep);line-height:1.2;max-width:80px}
.hx-text{position:relative;z-index:2;padding:0 var(--pl) 0 30px}
.hx-box{display:table;margin-bottom:12px;padding:6px 18px;border-radius:8px;background:linear-gradient(135deg,var(--blue),var(--blue-deep));color:#fff;font:800 clamp(1.05rem,1.6vw,1.4rem) var(--ff-serif);letter-spacing:.1em;text-transform:uppercase;box-shadow:0 10px 22px rgba(31,93,173,.3)}
.hx h1{margin-bottom:14px}
.hx h1 .l1,.hx h1 .l2{display:block;font-size:clamp(2.4rem,4.2vw,3.7rem);line-height:1.04;letter-spacing:-.035em;font-weight:800;color:var(--blue-deep)}
.hx h1 .l2 em{background:linear-gradient(90deg,#0E2E58,#2A6FC4);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.hx h1 .l2 small{display:block;margin-top:6px;font:700 .4em/1.2 var(--ff-serif);letter-spacing:.02em;color:var(--blue)}
.hx-tagline{font:700 1.05rem/1.5 var(--ff-serif);color:var(--ink-2);margin-bottom:10px}
.hx-tagline span{color:var(--blue)}
.hx-desc{font-size:.94rem;line-height:1.75;color:var(--muted);max-width:470px;margin-bottom:22px}
.hx-actions{display:flex;flex-wrap:wrap;gap:12px}
.hx-actions .btn-solid,.hx-actions .btn-ghost{padding:13px 26px}
.hx .btn-solid{background:linear-gradient(135deg,var(--blue),var(--blue-deep));box-shadow:0 10px 26px rgba(31,93,173,.35)}
.hx .btn-solid:hover{background:linear-gradient(135deg,var(--blue-mid),var(--blue))}
.hx-stats{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.hx-stat{min-width:112px;padding:12px 16px;border-radius:16px;background:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.95);box-shadow:var(--shadow-md)}
.hx-stat .n{display:block;font:700 1.45rem/1 var(--ff-serif);color:var(--blue-deep);letter-spacing:-.03em;margin-bottom:5px}
.hx-stat .n .sm{font:700 .72rem var(--ff-h);color:var(--blue-mid);margin-left:2px}
.hx-stat .l{font:500 .6rem var(--ff-h);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.hx-bar{position:absolute;right:0;bottom:40px;z-index:3;display:flex;align-items:center;gap:22px;padding:14px 32px 14px 36px;border-radius:100px 0 0 100px;background:linear-gradient(90deg,var(--blue-deep),var(--blue));color:#fff;font:600 .88rem var(--ff-h);box-shadow:0 14px 30px rgba(31,93,173,.3)}
.hx-bar a{display:inline-flex;align-items:center;gap:9px;white-space:nowrap}
.hx-bar svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hx-bar i{width:1px;height:20px;background:rgba(255,255,255,.4)}
.hx-ann{position:absolute;z-index:3;top:128px;left:var(--pl);display:inline-flex;align-items:center;gap:10px;padding:6px 6px 6px 16px;border-radius:100px;background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.95);box-shadow:var(--shadow-md);font:600 .8rem var(--ff-h);color:var(--blue-deep)}
.hx-ann i{width:8px;height:8px;flex:none;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(61,168,87,.22);animation:pulse 2s infinite}
.hx-ann a{flex:none;padding:7px 15px;border-radius:100px;background:linear-gradient(135deg,var(--blue),var(--blue-deep));color:#fff;font-size:.74rem;font-weight:600}
.hx-tiles{position:absolute;z-index:3;left:var(--pl);right:440px;bottom:28px;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.hx-tile{display:flex;align-items:center;gap:10px;padding:12px;border-radius:18px;background:rgba(255,255,255,.82);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.95);box-shadow:var(--shadow-md);transition:.3s}
.hx-tile:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.hx-tile i{flex:none;width:40px;height:40px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--t),var(--t2));box-shadow:0 8px 16px -4px var(--t)}
.hx-tile svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hx-tile strong{display:block;font:700 .8rem/1.2 var(--ff-h);color:var(--blue-deep)}
.hx-tile span{display:block;margin-top:2px;font:500 .67rem/1.3 var(--ff-h);color:var(--muted)}

/* highlight strip */
.hl-strip{padding:0;background:var(--blue-deep);color:#fff;overflow:hidden}
.hl-track{display:flex;width:max-content;animation:hlmove 40s linear infinite}
.hl-strip:hover .hl-track{animation-play-state:paused}
.hl-group{display:flex}
.hl-item{display:flex;align-items:center;font:600 .92rem var(--ff-h);white-space:nowrap;padding:22px 0 22px 34px}
.hl-item b{color:#6BC97E;margin-right:6px}
.hl-item::after{content:"✦";color:var(--green);margin-left:34px}
@keyframes hlmove{to{transform:translateX(-50%)}}

/* enroll */
.enroll-section{overflow:hidden;padding:150px 0 170px;background:radial-gradient(rgba(31,93,173,.13) 1.2px,transparent 1.4px) 0 0/22px 22px,var(--blue-tint)}
.enroll-section::after{content:"";position:absolute;bottom:0;left:-6%;right:-6%;height:80px;background:#fff;border-radius:50% 50% 0 0/100% 100% 0 0;z-index:1}
.en-blob{position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none}
.en-blob.b1{width:420px;height:420px;left:-120px;top:22%;background:rgba(61,168,87,.22)}
.en-blob.b2{width:480px;height:480px;right:-140px;bottom:8%;background:rgba(31,93,173,.22)}
.enroll-wrap{position:relative;z-index:2;max-width:1280px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:1fr 1.05fr;gap:88px;align-items:center}
.enroll-left p{color:var(--muted);line-height:1.75;margin-bottom:32px;max-width:480px}
.enroll-features{display:flex;flex-direction:column;gap:14px;margin-bottom:34px}
.enroll-feature{display:flex;gap:16px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px 20px;transition:.25s;box-shadow:var(--shadow-sm)}
.enroll-feature:hover{transform:translateX(6px);border-color:var(--green);box-shadow:var(--shadow-md)}
.enroll-feature .ic{width:44px;height:44px;flex:none;border-radius:14px;background:linear-gradient(135deg,var(--green),var(--green-dark));display:flex;align-items:center;justify-content:center}
.enroll-feature .ic svg{width:21px;height:21px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.enroll-feature strong{display:block;font:600 .94rem var(--ff-h);color:var(--blue-deep);margin-bottom:2px}
.enroll-feature span{font-size:.84rem;color:var(--muted)}
.en-trust{display:flex;align-items:center;gap:16px;padding-top:26px;border-top:1px dashed var(--line-2)}
.en-avatars{display:flex}
.en-avatars i{width:40px;height:40px;border-radius:50%;margin-left:-10px;border:3px solid var(--blue-tint);display:flex;align-items:center;justify-content:center;font:700 .7rem var(--ff-h);color:#fff;background:linear-gradient(135deg,var(--blue),var(--blue-deep))}
.en-avatars i:first-child{margin-left:0}
.en-avatars i:nth-child(2){background:linear-gradient(135deg,var(--green),var(--green-dark))}
.en-avatars i:nth-child(3){background:linear-gradient(135deg,var(--blue-mid),var(--blue))}
.en-avatars i:nth-child(4){background:var(--blue-deep)}
.en-trust-text{font:.82rem/1.5 var(--ff-h);color:var(--muted)}
.en-trust-text b{color:var(--blue-deep)}
.en-stars{color:#FFC93C;letter-spacing:2px}
.enroll-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:28px;padding:44px;box-shadow:var(--shadow-xl)}
.enroll-card::before{content:"";position:absolute;top:0;left:28px;right:28px;height:4px;border-radius:0 0 6px 6px;background:linear-gradient(90deg,var(--blue),var(--green))}
.enroll-card::after{content:"";position:absolute;inset:18px -14px -14px 18px;border-radius:30px;background:linear-gradient(135deg,rgba(31,93,173,.22),rgba(61,168,87,.28));z-index:-1}
.enroll-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:22px}
.enroll-card-head h3{font-size:1.4rem}
.enroll-card-head h3 em{color:var(--green)}
.enroll-card-badge{display:inline-flex;align-items:center;gap:6px;font:700 .66rem var(--ff-h);letter-spacing:.1em;text-transform:uppercase;color:var(--green-dark);background:var(--green-soft);padding:7px 13px;border-radius:100px}
.enroll-card-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green);animation:pulse 2s infinite}
.en-seats{background:var(--blue-tint);border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-bottom:26px}
.en-seats-top{display:flex;justify-content:space-between;font:.76rem var(--ff-h);color:var(--muted);margin-bottom:9px}
.en-seats-top b{color:#E5484D}
.en-seats-bar{height:7px;border-radius:100px;background:var(--line-2);overflow:hidden}
.en-seats-bar i{display:block;height:100%;width:76%;border-radius:100px;background:linear-gradient(90deg,var(--green),var(--blue))}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-group{display:flex;flex-direction:column;gap:7px}
.form-group.full{grid-column:1/-1}
.form-group label{font:600 .72rem var(--ff-h);color:var(--blue-deep);letter-spacing:.06em;text-transform:uppercase}
.form-group label span{color:var(--green)}
.form-group input,.form-group select{width:100%;padding:14px 16px;border:1.5px solid var(--line-2);border-radius:14px;font:.94rem var(--ff-body);color:var(--ink);background:var(--blue-tint);outline:none;appearance:none;-webkit-appearance:none;transition:.2s}
.form-group input:focus,.form-group select:focus{border-color:var(--blue);background:#fff;box-shadow:0 0 0 4px rgba(31,93,173,.1)}
.form-group select{background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235E6D80' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:44px;cursor:pointer}
.form-submit{grid-column:1/-1;margin-top:8px}
.form-submit button{width:100%;background:linear-gradient(135deg,var(--green),var(--green-dark));color:#fff;padding:17px;border:none;border-radius:100px;font:600 .94rem var(--ff-h);cursor:pointer;transition:.25s;box-shadow:0 12px 28px rgba(61,168,87,.35)}
.form-submit button:hover{transform:translateY(-2px)}
.form-note{grid-column:1/-1;text-align:center;font-size:.78rem;color:var(--muted)}

/* about program + placement (.pl2) */
.pl2{background:#fff;overflow:hidden}
.pl2-top{display:grid;grid-template-columns:1fr 1.05fr;gap:64px;align-items:center;margin-bottom:56px}
.pl2-intro p{color:var(--muted);line-height:1.75;max-width:460px;margin-bottom:28px}
.pl2-btn{display:inline-flex;align-items:center;gap:10px;padding:14px 28px;border-radius:100px;background:var(--blue-deep);color:#fff;font:600 .88rem var(--ff-h);box-shadow:0 12px 26px rgba(14,46,88,.25);transition:.25s}
.pl2-btn:hover{background:var(--green);gap:14px}
.pl2-partners{background:var(--blue-tint);border:1px solid var(--line-2);border-radius:26px;padding:26px;box-shadow:var(--shadow-lg)}
.pl2-ptitle{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:18px;font:600 .84rem var(--ff-h);color:var(--blue-deep)}
.pl2-ptitle span{font-weight:500;color:var(--muted);font-size:.78rem}
.pl2-logos{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-2);border:1px solid var(--line-2);border-radius:16px;overflow:hidden}
.pl2-logo{background:#fff;height:92px;display:flex;align-items:center;justify-content:center;font:800 1.15rem var(--ff-serif);color:#8995a8;transition:.25s}
.pl2-logo:hover{background:var(--blue-deep);color:#fff}
.pl2-stats{display:grid;grid-template-columns:repeat(3,1fr);background:linear-gradient(135deg,var(--blue-dark),var(--blue-deep) 60%,var(--blue));border-radius:28px;color:#fff;box-shadow:var(--shadow-xl);margin-bottom:56px;overflow:hidden;position:relative}
.pl2-stats::before{content:"";position:absolute;width:360px;height:360px;right:-100px;top:-180px;border-radius:50%;background:radial-gradient(circle,rgba(61,168,87,.4),transparent 65%)}
.pl2-stat{position:relative;padding:38px 36px;display:flex;align-items:center;gap:22px}
.pl2-stat+.pl2-stat{border-left:1px solid rgba(255,255,255,.14)}
.pl2-ring{width:76px;height:76px;flex:none;border-radius:50%;background:conic-gradient(#6BC97E 92%,rgba(255,255,255,.14) 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 8px),#000 calc(100% - 7px));mask:radial-gradient(farthest-side,transparent calc(100% - 8px),#000 calc(100% - 7px))}
.pl2-ic{width:76px;height:76px;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16)}
.pl2-ic svg{width:30px;height:30px;fill:none;stroke:var(--mint);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pl2-num{display:block;font:800 clamp(2.2rem,3.6vw,3rem)/1 var(--ff-serif);letter-spacing:-.03em;color:#fff}
.pl2-num em{font-size:.5em;color:#6BC97E;margin-left:3px}
.pl2-lbl{display:block;margin-top:8px;font:.85rem var(--ff-h);color:rgba(255,255,255,.7)}
.pl2-flowhead{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:34px}
.pl2-flowhead h3{font-size:clamp(1.4rem,2.4vw,1.8rem);max-width:460px}
.pl2-flowhead h3 em{color:var(--green)}
.pl2-flowhead p{max-width:420px;color:var(--muted);line-height:1.7;font-size:.92rem}
.pl2-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;position:relative}
.pl2-steps::before{content:"";position:absolute;left:22px;right:22px;top:21px;border-top:2px dashed rgba(31,93,173,.3)}
.pl2-step{position:relative}
.pl2-dot{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:18px;font:700 .9rem var(--ff-h);background:#fff;color:var(--blue);border:2px solid var(--blue);position:relative;z-index:1;box-shadow:0 0 0 6px #fff}
.pl2-step:last-child .pl2-dot{background:var(--green);border-color:var(--green);color:#fff}
.pl2-step h4{font:600 1rem var(--ff-h);margin-bottom:6px}
.pl2-step p{font-size:.88rem;color:var(--muted);line-height:1.65}
.about-section .pl2-top{margin-bottom:0}
.about-section .pl2-intro p{margin-bottom:16px;max-width:520px}
.about-section .pl2-intro .pl2-btn{margin-top:12px}
.glance .pl2-logo{flex-direction:column;gap:3px;text-align:center;padding:0 8px;font-size:1.5rem;color:var(--blue-deep)}
.glance .pl2-logo small{font:500 .72rem var(--ff-h);color:var(--muted)}
.glance .pl2-logo:hover{color:#fff}.glance .pl2-logo:hover small{color:rgba(255,255,255,.75)}

/* who can join */
.who-section{background:var(--blue-tint)}
.sv-wrap{container-type:inline-size;max-width:1200px;margin:0 auto}
.sv-stage{--u:calc(100cqw/1200);position:relative;width:100%;height:calc(500*var(--u))}
.sv-lines{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;overflow:visible}
.sv-card{position:absolute;left:calc(var(--x)*var(--u));top:calc(var(--y)*var(--u));width:calc(250*var(--u));height:calc(250*var(--u));border-radius:calc(30*var(--u));z-index:1;background:rgba(255,255,255,.9);padding:calc(24*var(--u)) calc(30*var(--u));display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:calc(8*var(--u));box-shadow:0 calc(22*var(--u)) calc(36*var(--u)) calc(-10*var(--u)) var(--g);transition:box-shadow .3s}
.sv-card:hover{box-shadow:0 calc(26*var(--u)) calc(44*var(--u)) calc(-6*var(--u)) var(--g)}
.sv-card h3{font:800 calc(17*var(--u))/1.2 var(--ff-h);color:var(--c);text-transform:uppercase}
.sv-card h3::before{content:attr(data-n);display:block;font-size:calc(11*var(--u));letter-spacing:.2em;opacity:.7;margin-bottom:calc(3*var(--u))}
.sv-card p{font-size:calc(12.5*var(--u));line-height:1.55;color:var(--muted)}
.sv-ic{width:calc(30*var(--u));height:calc(30*var(--u));fill:none;stroke:var(--c);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.sv-card:nth-of-type(even) .sv-ic{order:3}

/* tools */
.team-cloud-section{background:var(--green-tint);overflow:hidden;padding:140px 0}
.team-cloud-inner{max-width:800px;margin:0 auto;text-align:center;position:relative;z-index:5;padding:0 24px}
.team-cloud-inner h2{font-size:clamp(2rem,4vw,2.8rem);line-height:1.15;margin-bottom:18px;font-weight:800}
.team-cloud-inner h2 em{color:var(--green)}
.team-cloud-inner p{font-size:1.05rem;color:var(--muted);line-height:1.7;max-width:600px;margin:0 auto 28px}
.team-cloud-cta{display:inline-flex;align-items:center;gap:10px;padding:16px 32px;background:var(--green);color:#fff;font:600 .94rem var(--ff-h);border-radius:100px;transition:.25s;box-shadow:0 10px 24px rgba(61,168,87,.3)}
.team-cloud-cta:hover{background:var(--green-dark);transform:translateY(-2px)}
.team-cloud-left,.team-cloud-right{position:absolute;top:50%;transform:translateY(-50%);width:300px;height:500px;pointer-events:none;z-index:2}
.team-cloud-left{left:-40px}.team-cloud-right{right:-40px}
.team-cloud-icon{position:absolute;border-radius:22%;display:flex;align-items:center;justify-content:center;font:800 1.6rem var(--ff-serif);color:#fff;box-shadow:0 20px 40px rgba(0,0,0,.15);animation:floatSlow 6s ease-in-out infinite}
.team-cloud-left .team-cloud-icon:nth-child(1){width:90px;height:90px;top:20px;left:120px;background:linear-gradient(135deg,var(--blue),var(--blue-deep))}
.team-cloud-left .team-cloud-icon:nth-child(2){width:130px;height:130px;top:130px;left:40px;background:linear-gradient(135deg,var(--blue-mid),var(--blue));animation-delay:.5s;z-index:3}
.team-cloud-left .team-cloud-icon:nth-child(3){width:110px;height:110px;top:150px;left:-20px;background:#fff;color:var(--blue);animation-delay:1s}
.team-cloud-left .team-cloud-icon:nth-child(4){width:120px;height:120px;top:270px;left:80px;background:linear-gradient(135deg,var(--green),var(--green-dark));animation-delay:1.5s}
.team-cloud-left .team-cloud-icon:nth-child(5){width:100px;height:100px;top:380px;left:20px;background:linear-gradient(135deg,var(--blue-deep),var(--blue));animation-delay:2s}
.team-cloud-right .team-cloud-icon:nth-child(1){width:120px;height:120px;top:10px;left:80px;background:linear-gradient(135deg,var(--green),var(--green-dark));animation-delay:.2s}
.team-cloud-right .team-cloud-icon:nth-child(2){width:110px;height:110px;top:110px;left:30px;background:linear-gradient(135deg,var(--blue),var(--blue-mid));animation-delay:.7s}
.team-cloud-right .team-cloud-icon:nth-child(3){width:150px;height:150px;top:160px;left:110px;background:#fff;color:var(--green);animation-delay:1.2s;z-index:3}
.team-cloud-right .team-cloud-icon:nth-child(4){width:100px;height:100px;top:300px;left:20px;background:linear-gradient(135deg,var(--blue-deep),var(--green));animation-delay:1.7s}
.team-cloud-right .team-cloud-icon:nth-child(5){width:120px;height:120px;top:390px;left:100px;background:linear-gradient(135deg,var(--green),var(--blue));animation-delay:2.2s}
.tool-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 auto 34px;max-width:620px}
.tool-chips span{font:600 .78rem var(--ff-h);color:var(--blue-deep);background:#fff;border:1px solid var(--line-2);padding:7px 14px;border-radius:100px;box-shadow:var(--shadow-sm)}

/* live projects */
.courses-section{padding:110px 0 120px;overflow:hidden;background:radial-gradient(520px 320px at 8% 12%,rgba(61,168,87,.10),transparent 70%),radial-gradient(560px 360px at 95% 70%,rgba(31,93,173,.10),transparent 70%),linear-gradient(180deg,#fff 0%,var(--blue-tint) 100%)}
.courses-section::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(rgba(31,93,173,.10) 1.2px,transparent 1.4px) 0 0/24px 24px;-webkit-mask-image:linear-gradient(180deg,transparent,#000 25%,#000 70%,transparent);mask-image:linear-gradient(180deg,transparent,#000 25%,#000 70%,transparent)}
.courses-section>.wrap{position:relative;z-index:1}
.courses-header{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-bottom:28px}
.courses-header .sec-head{margin-bottom:0}
.scroll-controls{display:flex;gap:10px}
.scroll-btn{width:52px;height:52px;border-radius:50%;background:#fff;border:1px solid var(--line-2);cursor:pointer;color:var(--blue-deep);font-size:1.15rem;font-weight:700;box-shadow:var(--shadow-md);transition:.25s}
.scroll-btn:hover{background:var(--green);border-color:var(--green);color:#fff}
.cp-chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:40px}
.cp-chips span{font:.8rem var(--ff-h);color:var(--muted);padding:9px 18px;border-radius:100px;background:#fff;border:1px solid var(--line-2);box-shadow:var(--shadow-sm)}
.cp-chips b{color:var(--blue-deep)}
.courses-scroll{display:flex;gap:32px;overflow-x:auto;padding:14px 6px 34px;scroll-snap-type:x mandatory;scrollbar-width:none;counter-reset:proj;-webkit-overflow-scrolling:touch}
.courses-scroll::-webkit-scrollbar{display:none}
.course-tile{--a:var(--blue);--a2:var(--blue-mid);--at:var(--blue-soft);counter-increment:proj;flex:0 0 370px;scroll-snap-align:start;position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:30px;padding:42px 30px 28px;display:flex;flex-direction:column;transition:.35s;box-shadow:0 14px 36px rgba(14,46,88,.09)}
.course-tile:nth-child(2){--a:var(--green);--a2:#6BC97E;--at:var(--green-soft)}
.course-tile:nth-child(3){--a:#7B5CF0;--a2:#A48BFF;--at:#EFEAFE}
.course-tile:nth-child(4){--a:#F08A24;--a2:#FFB45E;--at:#FFF1E0}
.course-tile::before{content:"";position:absolute;top:0;left:0;right:0;height:7px;background:linear-gradient(90deg,var(--a),var(--a2))}
.course-tile::after{content:"0" counter(proj);position:absolute;top:22px;right:20px;font:800 5.2rem/1 var(--ff-serif);color:var(--a);opacity:.09;pointer-events:none}
.course-tile:hover{transform:translateY(-10px);border-color:var(--a);box-shadow:0 28px 56px rgba(14,46,88,.16)}
.course-tile-badge{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;font:700 .68rem var(--ff-h);letter-spacing:.12em;text-transform:uppercase;color:var(--a);background:var(--at);padding:7px 14px;border-radius:100px;margin-bottom:18px}
.course-tile-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--a)}
.course-tile h3{font-size:1.4rem;line-height:1.22;margin-bottom:16px;max-width:85%}
.duration-label{font:700 .64rem var(--ff-h);color:var(--muted);text-transform:uppercase;letter-spacing:.14em;padding:12px 16px 0;background:var(--at);border-radius:14px 14px 0 0}
.duration-val{font:700 .95rem var(--ff-serif);color:var(--blue-deep);padding:3px 16px 12px;background:var(--at);border-radius:0 0 14px 14px;margin-bottom:20px}
.course-tile p{font-size:.88rem;color:var(--muted);line-height:1.7;margin-bottom:18px}
.course-tile ul{list-style:none;margin:0 0 24px;flex-grow:1}
.course-tile li{position:relative;padding-left:32px;margin-bottom:11px;font-size:.86rem;color:var(--ink-2);font-weight:500;line-height:1.55}
.course-tile li::before{content:"✓";position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:50%;background:var(--at);color:var(--a);font-size:.72rem;font-weight:800;display:flex;align-items:center;justify-content:center}
.ct-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-top:20px;border-top:1px dashed var(--line-2);margin-top:auto}
.ct-meta{display:flex;gap:7px;flex-wrap:wrap}
.ct-tag{font:700 .6rem var(--ff-h);letter-spacing:.05em;text-transform:uppercase;color:var(--a);background:var(--at);padding:5px 10px;border-radius:100px}
.ct-arrow{width:42px;height:42px;flex:none;border-radius:50%;background:linear-gradient(135deg,var(--a),var(--a2));color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.1rem;font-weight:700;transition:.3s}
.course-tile:hover .ct-arrow{transform:rotate(-45deg)}

/* why choose + reviews */
.search-section{background:linear-gradient(160deg,#081E3D 0%,#0E2E58 60%,#123C73 100%);overflow:hidden}
.search-section::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(rgba(255,255,255,.07) 1.2px,transparent 1.4px) 0 0/26px 26px}
.search-section>.wrap{position:relative;z-index:1}
.search-section .sec-head{margin:0 auto 56px;text-align:center}
.search-section .sec-head p{margin:0 auto;color:rgba(255,255,255,.72)}
.search-section .sec-head h2{color:#fff}.search-section .sec-head h2 em{color:#6BC97E}
.search-section .sec-num{color:var(--mint);background:rgba(61,168,87,.16);border:1px solid rgba(61,168,87,.3)}
.search-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:center}
.search-list{display:flex;flex-direction:column;gap:12px}
.search-item{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:16px 20px;font:500 .94rem var(--ff-h);color:#fff;transition:.25s}
.search-item:hover{transform:translateX(6px);border-color:#6BC97E;background:rgba(255,255,255,.12)}
.tick{width:32px;height:32px;border-radius:50%;background:rgba(61,168,87,.25);color:#6BC97E;display:flex;align-items:center;justify-content:center;flex:none}
.tick svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.testi-avatar{width:48px;height:48px;border-radius:50%;flex:none;background:linear-gradient(135deg,var(--blue),var(--green));display:flex;align-items:center;justify-content:center;font:700 .85rem var(--ff-h);color:#fff}
.greviews{background:#fff;border-radius:24px;padding:36px;box-shadow:0 30px 60px rgba(0,0,0,.3);position:relative;overflow:hidden}
.greviews::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#4285F4,#34A853,#FBBC05,#EA4335)}
.greviews-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid var(--line);flex-wrap:wrap;gap:12px}
.greviews-head h3{font-size:1.3rem}
.g-badge{display:inline-flex;align-items:center;gap:8px;font:600 .8rem var(--ff-h);color:var(--blue-deep);background:var(--blue-soft);padding:7px 14px;border-radius:100px}
.g-badge b{font:700 1rem var(--ff-serif);color:#4285F4}
.gr-slide{display:none;min-height:160px}.gr-slide.active{display:block;animation:fadeUp .5s ease}
.gr-top{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.gr-top strong{display:block;font:.94rem var(--ff-h);font-weight:600;color:var(--blue-deep)}
.gr-stars{color:#FFC93C;font-size:.85rem;letter-spacing:2px}
.gr-slide p{font-size:.94rem;line-height:1.75;color:var(--ink-2)}
.gr-nav{display:flex;align-items:center;justify-content:space-between;margin-top:22px}
.gr-dots{display:flex;gap:8px}
.gr-dots button{width:9px;height:9px;border-radius:50%;border:none;background:var(--line-2);cursor:pointer;padding:0;transition:.25s}
.gr-dots button.active{background:var(--green);width:26px;border-radius:100px}
.gr-arrows{display:flex;gap:8px}
.gr-arrows button{width:42px;height:42px;border-radius:50%;background:var(--blue-soft);border:none;color:var(--blue);cursor:pointer;font-size:1rem;font-weight:700;transition:.2s}
.gr-arrows button:hover{background:var(--blue-deep);color:#fff}

/* career paths */
.process-section{background:#E8ECF5;overflow:hidden;padding:100px 0 120px}
.process-steps{container-type:inline-size;max-width:1200px;margin:0 auto}
.ps-stage{--u:calc(100cqw/1200);position:relative;width:100%;height:calc(580*var(--u))}
.ps-lines{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;overflow:visible}
.process-step{position:absolute;top:calc(70*var(--u));left:calc((var(--cx) - 95)*var(--u));width:calc(190*var(--u));height:calc(440*var(--u))}
.s1{--cx:140;--c:#00B4D8}.s2{--cx:370;--c:#5B4FE0}.s3{--cx:600;--c:#B14BFF}.s4{--cx:830;--c:#FF1493}.s5{--cx:1060;--c:#FF9E00}
.ps-cap{position:absolute;left:calc(7*var(--u));width:calc(176*var(--u));height:calc(250*var(--u));border-radius:calc(88*var(--u));display:flex;flex-direction:column;align-items:center;color:#fff;font:800 1rem var(--ff-h);z-index:1;box-shadow:0 calc(14*var(--u)) calc(28*var(--u)) rgba(30,40,90,.22),inset 0 0 0 calc(2*var(--u)) rgba(255,255,255,.18)}
.s1 .ps-cap,.s3 .ps-cap,.s5 .ps-cap{top:0;justify-content:flex-start;padding-top:calc(24*var(--u))}
.s2 .ps-cap,.s4 .ps-cap{bottom:0;justify-content:flex-end;padding-bottom:calc(24*var(--u))}
.ps-lbl{font-size:calc(14*var(--u));letter-spacing:.14em;text-transform:uppercase;line-height:1;opacity:.9}
.ps-num{font-size:calc(42*var(--u));line-height:1.05;opacity:.7}
.s1 .ps-cap{background:linear-gradient(180deg,#0aa9da,#0a6ea8)}
.s2 .ps-cap{background:linear-gradient(180deg,#6254d0,#4a3fb0)}
.s3 .ps-cap{background:linear-gradient(135deg,#8a3fb0,#b05ad4)}
.s4 .ps-cap{background:linear-gradient(180deg,#ff3fa0,#ff1a8a)}
.s5 .ps-cap{background:linear-gradient(180deg,#ffc400,#ff9e00)}
.ps-card{position:absolute;left:0;width:100%;height:calc(355*var(--u));border-radius:calc(95*var(--u));z-index:2;background:linear-gradient(180deg,#e7e9ee 0%,#f6f7f9 40%,#fff 75%);display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 calc(26*var(--u));box-shadow:0 calc(18*var(--u)) calc(36*var(--u)) rgba(40,50,100,.16)}
.s1 .ps-card,.s3 .ps-card,.s5 .ps-card{bottom:0;padding-top:calc(100*var(--u))}
.s2 .ps-card,.s4 .ps-card{top:0;padding-top:calc(78*var(--u))}
.ps-h{font:700 calc(11*var(--u))/1.35 var(--ff-h);letter-spacing:.1em;text-transform:uppercase;color:#8a93a5}
.ps-line{display:block;width:calc(34*var(--u));height:calc(2*var(--u));margin:calc(9*var(--u)) 0 calc(11*var(--u));border-radius:2px;background:var(--c)}
.ps-p{font-size:calc(12.5*var(--u));line-height:1.5;color:#9aa3b3}
.ps-ic{position:absolute;left:50%;transform:translateX(-50%);width:calc(34*var(--u));height:calc(34*var(--u));fill:none;stroke:var(--c);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.s1 .ps-ic,.s3 .ps-ic,.s5 .ps-ic{bottom:calc(55*var(--u))}
.s2 .ps-ic,.s4 .ps-ic{bottom:calc(100*var(--u))}
.cr-more{text-align:center;margin:8px auto 0;max-width:720px;font-size:.92rem;color:var(--muted);line-height:1.7}
.cr-more b{color:var(--blue-deep)}

/* portfolio */
.awards-section{background:var(--blue-tint)}
.awards-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;grid-template-rows:250px 250px;gap:20px}
.award{position:relative;border-radius:24px;overflow:hidden;background:linear-gradient(135deg,var(--blue-deep),var(--blue));display:flex;align-items:flex-end;transition:.35s}
.award:first-child{grid-row:1/3}
.award:nth-child(2){background:linear-gradient(135deg,var(--green),var(--green-dark))}
.award:nth-child(3){background:linear-gradient(135deg,var(--blue-mid),var(--blue))}
.award:nth-child(4){grid-column:2/4;background:linear-gradient(135deg,var(--blue),var(--green))}
.award:hover{transform:translateY(-6px);box-shadow:var(--shadow-xl)}
.award::before{content:"";position:absolute;top:-30%;right:-15%;width:280px;height:280px;background:radial-gradient(circle,rgba(255,255,255,.18),transparent 65%)}
.award .ico{position:absolute;top:22px;left:22px;width:54px;height:54px;border-radius:16px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.25);color:#fff;display:flex;align-items:center;justify-content:center;z-index:2}
.award .ico svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.award figcaption{position:relative;width:100%;padding:60px 22px 22px;background:linear-gradient(0deg,rgba(8,30,61,.85),transparent);color:#fff;z-index:1}
.award figcaption strong{display:block;font:1.1rem var(--ff-serif);font-weight:700;margin-bottom:3px}
.award figcaption span{font:.78rem var(--ff-h);color:rgba(255,255,255,.8)}

/* course details + FAQ */
.faq-section{background:#fff;border-top:1px solid var(--line)}
.faq-layout{display:grid;grid-template-columns:360px 1fr;gap:72px;align-items:start}
.faq-intro{position:sticky;top:120px}
.faq-intro p{font-size:.95rem;color:var(--muted);line-height:1.75;margin-bottom:26px}
.faq-contact{background:var(--green-soft);border-radius:18px;padding:24px}
.faq-contact p{font-size:.86rem;margin-bottom:10px;color:var(--green-dark);font-weight:500}
.faq-contact a{font:700 .88rem var(--ff-h);color:var(--green-dark)}
.faq-item{border-bottom:1px solid var(--line);padding:26px 0}
.faq-item:first-child{border-top:1px solid var(--line)}
.faq-item summary{display:flex;justify-content:space-between;gap:24px;cursor:pointer;list-style:none;font:600 1.08rem/1.45 var(--ff-serif);color:var(--blue-deep)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-size:1.5rem;font-weight:400;color:var(--green);transition:transform .3s;line-height:1;flex:none}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item p{padding:14px 40px 0 0;font-size:.92rem;color:var(--muted);line-height:1.8}
.cd-glance{position:relative;overflow:hidden;padding:32px 28px;margin-top:6px;color:#fff;border-radius:24px;background:linear-gradient(145deg,#081E3D,#0E2E58 60%,#1F5DAD 140%);box-shadow:var(--shadow-xl)}
.cd-glance h3{color:#fff;font-size:1.2rem;margin-bottom:10px}
.cd-row{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.14);font-size:.88rem}
.cd-row span{color:rgba(255,255,255,.65)}.cd-row b{text-align:right;font-weight:600}
.cd-glance .btn-solid{width:100%;justify-content:center;margin:22px 0 0}
.cd-list{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px 20px;padding-top:14px}
.cd-list li{position:relative;padding-left:22px;font-size:.9rem;color:var(--muted)}
.cd-list li::before{content:"✓";position:absolute;left:0;color:var(--green);font-weight:800}

/* location */
.testi-section{background:linear-gradient(180deg,#fff,var(--blue-tint));overflow:hidden}
.ts-ring{position:absolute;border-radius:50%;pointer-events:none;border:2px dashed rgba(31,93,173,.18)}
.ts-ring.r1{width:420px;height:420px;right:-140px;top:-120px}
.ts-ring.r2{width:300px;height:300px;left:-110px;bottom:-90px;border-color:rgba(61,168,87,.28)}
.testi-section>.wrap{position:relative;z-index:1}
.testi-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:32px;align-items:stretch}
.testi-side{display:flex;flex-direction:column;gap:28px}
.ts-author{display:flex;align-items:center;gap:14px}
.ts-author strong{display:block;font:.95rem/1.3 var(--ff-h);font-weight:700}
.ts-author span{font-size:.8rem}
.ts-feature{position:relative;overflow:hidden;padding:52px 44px 40px;border-radius:34px;color:#fff;background:linear-gradient(145deg,#081E3D 0%,#0E2E58 60%,#1F5DAD 140%);box-shadow:0 30px 60px rgba(14,46,88,.28);display:flex;flex-direction:column;justify-content:space-between}
.ts-feature::before{content:"";position:absolute;top:-120px;right:-100px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(61,168,87,.4),transparent 65%)}
.ts-chip{position:relative;align-self:flex-start;font:700 .68rem var(--ff-h);letter-spacing:.14em;text-transform:uppercase;color:var(--mint);background:rgba(61,168,87,.18);border:1px solid rgba(107,201,126,.35);padding:7px 14px;border-radius:100px;margin-bottom:22px}
.ts-big{position:relative;font:600 clamp(1.2rem,2.1vw,1.7rem)/1.5 var(--ff-serif);color:#fff;margin-bottom:20px}
.ts-sub{position:relative;color:rgba(255,255,255,.7);font-size:.92rem;line-height:1.7;margin-bottom:24px}
.ts-feature .btn-solid{position:relative;align-self:flex-start;margin-bottom:28px}
.ts-feature .ts-author{position:relative;padding-top:24px;border-top:1px solid rgba(255,255,255,.16)}
.ts-feature .ts-author strong{color:#fff}.ts-feature .ts-author span{color:rgba(255,255,255,.65)}
.ts-feature .testi-avatar{width:56px;height:56px;box-shadow:0 0 0 4px rgba(255,255,255,.14)}
.ts-bubble{display:flex;flex-direction:column;gap:22px}
.ts-bub{position:relative;background:#fff;border:1px solid var(--line);border-radius:26px;padding:28px 28px 26px;box-shadow:var(--shadow-lg);transition:.35s}
.ts-bub::before{content:"";position:absolute;left:0;top:26px;bottom:26px;width:5px;border-radius:0 6px 6px 0;background:var(--ac)}
.ts-bub::after{content:"";position:absolute;left:38px;bottom:-11px;width:22px;height:22px;background:#fff;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg);border-radius:0 0 6px 0}
.ts-bub p{font-size:.96rem;line-height:1.75;color:var(--ink-2)}
.loc-link{display:inline-block;margin-top:8px;font:700 .86rem var(--ff-h);color:var(--blue)}
.loc-link:hover{color:var(--green-dark)}
.ts-bubble .ts-author{padding-left:26px}
.ts-bubble .ts-author span{color:var(--muted)}
.b-green{--ac:var(--green)}.b-blue{--ac:var(--blue);margin-left:36px}
.b-green .testi-avatar{background:linear-gradient(135deg,var(--green),var(--green-dark))}
.b-blue .testi-avatar{background:linear-gradient(135deg,var(--blue-mid),var(--blue-deep))}
.ts-bubble:hover .ts-bub{transform:translateY(-6px);border-color:var(--ac)}

/* ===== 6. ABOUT ===== */
.alt{background:var(--blue-tint)}
.lead{color:var(--muted);margin-bottom:18px;max-width:500px}
.btn-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.sp{display:grid;grid-template-columns:1fr 1.05fr;gap:56px;align-items:center}
.tk{list-style:none;display:grid;gap:10px}
.tk li{display:flex;gap:10px;align-items:flex-start;color:#2a3a50}
.tk .i{color:var(--green);margin-top:2px;width:20px;height:20px}
.ab-hero{padding:150px 0 70px;background:linear-gradient(180deg,#EEF4FC,#fff)}
.ab-hero h1{font-size:clamp(2rem,4vw,3rem);margin-bottom:16px}
.ab-hero h1 em{background:linear-gradient(90deg,#1F5DAD,#3DA857);-webkit-background-clip:text;background-clip:text;color:transparent}
.hs{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.hs div{background:#fff;border:1px solid var(--line-2);border-radius:20px;padding:26px 22px;box-shadow:var(--shadow-lg)}
.hs b{display:block;font:800 2.2rem/1 var(--ff-serif);color:var(--blue-deep);margin-bottom:6px}
.hs b em{color:var(--green);font-size:.6em}
.hs span{font:600 .7rem var(--ff-h);color:var(--muted);letter-spacing:.1em;text-transform:uppercase}
/* ribbon */
.rb{container-type:inline-size;position:relative;max-width:520px;margin:0 auto;width:100%}
.rb svg{display:block;width:100%;height:auto;filter:drop-shadow(0 12px 12px rgba(14,46,88,.22))}
.rb text{font:800 20px "Plus Jakarta Sans",sans-serif;fill:#fff;text-anchor:middle;dominant-baseline:central}
.rt{position:absolute;top:var(--y);transform:translateY(-50%);width:23%}
.rt.r{left:77%}.rt.l{left:0;text-align:right}
.rt h4{font-size:max(.8rem,3.4cqw);color:var(--c);margin-bottom:2px}
.rt p{font-size:max(.7rem,2.6cqw);color:var(--muted);line-height:1.4}
/* notch cards */
.nr{display:grid;grid-template-columns:1fr 1fr;gap:28px 22px}.nr.n3{grid-template-columns:repeat(3,1fr);gap:26px 14px}
.nc{--c:#E5484D;text-align:center}
.nc:nth-child(2){--c:#F08A24}.nc:nth-child(3){--c:#3B5BDB}.nc:nth-child(4){--c:#7048E8}.nc:nth-child(5){--c:#14B8A6}.nc:nth-child(6){--c:#3DA857}
.n3 .nc:nth-child(1){--c:#3DA857}.n3 .nc:nth-child(2){--c:#14B8A6}.n3 .nc:nth-child(3){--c:#22B8F0}.n3 .nc:nth-child(4){--c:#1F5DAD}.n3 .nc:nth-child(5){--c:#5B4FE0}.n3 .nc:nth-child(6){--c:#8B5CF6}
.nc>div{position:relative;background:#fff;border:2px solid var(--c);border-radius:22px;padding:22px 14px 28px;box-shadow:10px 8px 22px -12px var(--c)}
.nc>div:after{content:"";position:absolute;left:50%;bottom:-12px;width:22px;height:22px;margin-left:-11px;background:#fff;border:solid var(--c);border-width:0 2px 2px 0;transform:rotate(45deg)}
.nc .i{width:30px;height:30px;color:var(--c);margin-bottom:8px}
.nc h4{font-size:1rem;color:var(--c);margin-bottom:4px}
.nc p{font-size:.8rem;color:var(--muted);line-height:1.5}
.nc b{display:block;margin-top:22px;font:800 2rem/1 var(--ff-serif);color:var(--c)}
/* hanging circles */
.hg{container-type:inline-size;position:relative;width:100%;max-width:540px;margin:0 auto;aspect-ratio:100/90}
.hi{position:absolute;left:calc(var(--x)*1cqw);top:calc(var(--t)*1cqw);width:calc(var(--d)*1cqw);aspect-ratio:1;border-radius:50%;background:var(--c);color:#fff;box-shadow:0 0 0 1.2cqw #fff,0 14px 26px rgba(8,30,61,.2);display:flex;align-items:center;padding:0 6% 0 40%}
.hi:before{content:"";position:absolute;left:50%;bottom:100%;width:1px;height:calc(var(--t)*1cqw);background:#8793a6}
.hi:after{content:"";position:absolute;left:50%;top:-1.2cqw;width:2.4cqw;height:2.4cqw;margin-left:-1.2cqw;border-radius:50%;background:#6b7688}
.hi b{position:absolute;left:-3%;top:50%;transform:translateY(-50%);font-family:var(--ff-serif);font-weight:800;font-size:calc(var(--d)*.52cqw);line-height:1;color:#f4f5f7;text-shadow:0 6px 10px rgba(0,0,0,.25)}
.hi h4{font-size:max(.62rem,2.7cqw);color:#fff;line-height:1.2}
/* winding process */
.pw{position:relative;max-width:540px;margin:0 auto;width:100%;display:grid;gap:26px}
.pw>svg{position:absolute;inset:0;width:100%;height:100%}
.pl{--c:#BFD98A;--t:var(--blue-deep);position:relative;width:84%;margin-left:auto;display:flex;align-items:center;gap:16px;padding:16px 26px 16px 16px;border-radius:100px;background:var(--c);color:var(--t);box-shadow:0 10px 22px rgba(14,46,88,.14)}
.pl:nth-of-type(2){--c:#E3C57A;margin:0 auto 0 0;flex-direction:row-reverse;text-align:right;padding:16px 16px 16px 26px}
.pl:nth-of-type(3){--c:#5B7A99;--t:#fff}
.pl:nth-of-type(4){--c:#34496A;--t:#fff;margin:0 auto 0 0;flex-direction:row-reverse;text-align:right;padding:16px 16px 16px 26px}
.pl>b{width:54px;height:54px;flex:none;border-radius:50%;background:#fff;color:var(--blue-deep);display:flex;align-items:center;justify-content:center;font:800 1.25rem var(--ff-serif);box-shadow:0 6px 14px rgba(0,0,0,.18)}
.pl h4{font-size:1.02rem;color:inherit}
.pl:nth-of-type(3) h4,.pl:nth-of-type(4) h4{color:#F2C46A}
.pl p{font-size:.8rem;line-height:1.45}
/* cta band */
.cta{background:var(--blue-tint);padding:70px 0}
.cc{background:linear-gradient(135deg,var(--blue-dark),var(--blue-deep) 50%,var(--blue));border-radius:26px;padding:50px 46px;color:#fff;display:flex;justify-content:space-between;align-items:center;gap:26px;flex-wrap:wrap}
.cc h2{color:#fff;max-width:540px;margin-bottom:8px;font-size:clamp(1.6rem,3vw,2.2rem)}.cc h2 em{color:var(--mint)}
.cc p{color:rgba(255,255,255,.75);max-width:460px}

/* ===== 7. CONTACT ===== */
.ct-hero{position:relative;min-height:800px;background:linear-gradient(120deg,#fff 0%,#F3F7FF 45%,#fff 60%);overflow:hidden}
.blobs{position:absolute;top:0;right:0;height:100%;width:64%;z-index:0}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:5fr 6fr;gap:0;min-height:800px;align-items:center;padding-top:140px;padding-bottom:110px}
.form-side{max-width:470px;position:relative}
.form-side h1{font-size:clamp(2.2rem,4vw,3rem);font-weight:800;margin-bottom:10px}
.form-side .sub{color:var(--muted);margin-bottom:34px;max-width:40ch}
.f-orb{position:absolute;top:6px;right:-34px;width:34px;height:34px;border-radius:50%;background:var(--sky);box-shadow:0 12px 24px rgba(31,93,173,.35);animation:hxbob 5s ease-in-out infinite}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.f{margin-bottom:26px;display:block}
.f>span{display:block;font-size:.72rem;font-weight:600;color:var(--blue-deep);margin-bottom:4px;letter-spacing:.02em}
.f>span i{color:#E5484D;font-style:normal;margin-left:3px}
.f input,.f select,.f textarea{width:100%;font:400 .95rem var(--ff-body);color:var(--ink);background:transparent;border:0;border-bottom:1.5px solid var(--line-2);border-radius:0;padding:8px 2px;transition:.2s;appearance:none;-webkit-appearance:none}
.f select{background:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235E6D80' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 4px center;padding-right:24px;cursor:pointer}
.f textarea{resize:vertical;min-height:64px}
.f input::placeholder,.f textarea::placeholder{color:#A3AEBF}
.f input:hover,.f select:hover,.f textarea:hover{border-color:var(--blue)}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:var(--green);box-shadow:0 8px 14px -10px rgba(61,168,87,.7)}
.submit{display:inline-flex;align-items:center;gap:26px;background:linear-gradient(135deg,var(--sky),var(--blue));color:#fff;border:0;border-radius:100px;padding:8px 8px 8px 34px;font:600 .95rem var(--ff-serif);cursor:pointer;box-shadow:0 14px 30px rgba(31,93,173,.35);transition:.25s}
.submit .go{width:42px;height:42px;border-radius:50%;background:var(--green-dark);display:grid;place-items:center;transition:.25s}
.submit:hover{transform:translateY(-2px);box-shadow:0 18px 34px rgba(31,93,173,.42)}
.submit:hover .go{transform:translateX(3px)}
.submit:disabled{opacity:.65;cursor:wait}
.thanks{display:none;padding:20px 0}
.thanks h2{font-size:2rem;margin-bottom:10px}.thanks p{color:var(--muted);margin-bottom:18px}
.thanks button{background:none;border:0;border-bottom:2px solid var(--green);font:600 .92rem var(--ff-body);color:var(--blue-deep);cursor:pointer}
.sent form{display:none}.sent .thanks{display:block}
.blob-wrap{display:flex;justify-content:center;align-items:center}
.blob-card{width:min(470px,100%);aspect-ratio:1/1.02;background:#fff;border-radius:44% 56% 52% 48% / 42% 44% 56% 58%;padding:76px 70px 64px 78px;box-shadow:0 40px 80px rgba(8,30,61,.28);display:flex;flex-direction:column;justify-content:center;margin-left:-60px}
.blob-card .bar{width:48px;height:4px;border-radius:4px;background:var(--sky);margin-bottom:18px}
.blob-card h2{font-size:1.9rem;font-weight:800;margin-bottom:18px}.blob-card h2 b{color:var(--green-dark)}
.c-line{display:flex;gap:14px;align-items:flex-start;font-size:.84rem;color:#33445A;margin-bottom:14px;line-height:1.55}
.c-line .i{color:var(--blue);margin-top:3px}
.c-line a:hover{color:var(--green-dark)}
.social{display:flex;gap:12px;margin-top:10px}
.social a{width:40px;height:40px;border-radius:50%;background:#fff;box-shadow:0 6px 18px rgba(31,93,173,.2);display:grid;place-items:center;color:var(--blue);font:700 .78rem var(--ff-serif);transition:.2s}
.social a:hover{background:var(--blue);color:#fff;transform:translateY(-3px)}
.strip{position:relative;z-index:5;margin-top:-62px;padding:0}
.strip-in{background:#fff;border-radius:18px;box-shadow:0 24px 60px rgba(10,31,61,.14);display:grid;grid-template-columns:repeat(5,1fr);padding:26px 12px}
.st{display:flex;gap:12px;align-items:center;padding:4px 20px;border-right:1px solid var(--line-2)}
.st:last-child{border:0}
.st .i{width:34px;height:34px;color:var(--blue);padding:6px;background:var(--soft);border-radius:10px;stroke-width:1.7}
.st strong{display:block;font:700 .88rem var(--ff-serif);color:var(--blue-deep);line-height:1.25}
.st small{font-size:.76rem;color:var(--muted);line-height:1.3;display:block}
.st.live .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#8593A8;margin-right:6px}
.st.live.open .dot{background:var(--green)}
.c-sec{padding:96px 0 40px}
.lbl{display:inline-flex;align-items:center;gap:10px;font:600 .82rem var(--ff-serif);color:var(--green-dark);margin-bottom:12px}
.lbl::before{content:"";width:26px;height:2px;background:var(--green)}
.c-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:36px}
.c-head h2{font-size:clamp(1.8rem,3.4vw,2.5rem);font-weight:800}
.c-head p{color:var(--muted);max-width:42ch}
.road{position:relative;border-radius:24px;background:radial-gradient(circle at 15% 20%,#fff,#EAF1FB 60%,#E3EEE8)}
.road-svg{display:block;width:100%;height:auto;aspect-ratio:1200/500;border-radius:24px;overflow:hidden}
.pins{list-style:none;position:absolute;inset:0}
.pin{position:absolute;left:var(--x,0);top:var(--y,0);width:0;height:0}
.pin-h{position:absolute;left:-16px;top:-40px;width:32px;height:32px;background:var(--green-dark);border-radius:50% 50% 50% 0;transform:rotate(-45deg);box-shadow:0 6px 12px rgba(10,31,61,.28);display:grid;place-items:center}
.pin-h::before{content:"";position:absolute;width:20px;height:20px;border-radius:50%;background:#fff}
.pin-h b{position:relative;transform:rotate(45deg);font:800 .72rem var(--ff-serif);color:var(--blue-deep)}
.pin-l{position:absolute;bottom:52px;left:50%;transform:translateX(-50%);width:max-content;text-align:center;background:#fff;border-radius:12px;padding:9px 14px;box-shadow:0 10px 26px rgba(10,31,61,.16);z-index:3}
.pin-l::after{content:"";position:absolute;left:50%;bottom:-5px;width:10px;height:10px;background:#fff;transform:translateX(-50%) rotate(45deg)}
.pin-l strong{display:block;font:700 .95rem var(--ff-serif);color:var(--blue-deep);line-height:1.25}
.pin-l small{display:block;font-size:.72rem;color:var(--muted);line-height:1.3}
.pin-l a{display:inline-block;margin-top:3px;font:600 .74rem var(--ff-serif);color:var(--green-dark)}
.pin-l a:hover{color:var(--blue-deep);text-decoration:underline}
.band{padding:56px 0 96px}
.band-in{background:linear-gradient(120deg,var(--green-dark),#1F6B34);border-radius:18px;padding:30px 40px;display:flex;align-items:center;gap:26px;flex-wrap:wrap;color:#fff;position:relative;overflow:hidden}
.band-in::after{content:"";position:absolute;right:-60px;top:-80px;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.08)}
.band-ic{width:58px;height:58px;border-radius:50%;background:rgba(255,255,255,.16);display:grid;place-items:center;font-size:1.7rem}
.band-in h2{color:#fff;font-size:1.5rem;margin-bottom:2px}.band-in p{color:rgba(255,255,255,.85);font-size:.92rem}
.band-in .txt{flex:1;min-width:240px}
.band-btn{position:relative;z-index:2;background:#fff;color:var(--green-dark);font:700 .9rem var(--ff-serif);padding:14px 28px;border-radius:100px;transition:.2s}
.band-btn:hover{background:var(--blue-deep);color:#fff}

/* ===== 8. BLOG ===== */
.page-hero{background:var(--navy);color:#fff;padding:180px 0 96px;overflow:hidden}
.page-hero::before{content:"";position:absolute;top:-20%;right:-10%;width:600px;height:600px;background:radial-gradient(circle,rgba(61,168,87,.2),transparent 65%);pointer-events:none}
.page-hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:1.3fr 1fr;gap:80px;align-items:end}
.page-hero-tag{display:inline-flex;align-items:center;gap:9px;font:700 .68rem var(--ff-h);letter-spacing:.2em;text-transform:uppercase;color:var(--green);padding:7px 15px;border-radius:100px;background:rgba(61,168,87,.1);border:1px solid rgba(61,168,87,.25);margin-bottom:28px}
.page-hero-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green)}
.page-hero h1{font-size:clamp(2.4rem,4.6vw,3.6rem);line-height:1.1;color:#fff;margin-bottom:22px}
.page-hero h1 em{color:var(--mint)}
.page-hero p{font-size:1.05rem;color:rgba(255,255,255,.72);line-height:1.7;font-weight:300;max-width:520px}
.page-hero-stats{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.page-hero-stat{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:22px 20px;transition:.3s}
.page-hero-stat:hover{background:rgba(255,255,255,.1);transform:translateY(-3px)}
.page-hero-stat strong{display:block;font:700 1.9rem/1 var(--ff-serif);color:#fff;margin-bottom:6px}
.page-hero-stat strong em{font-size:.6em;color:var(--green);margin-left:3px}
.page-hero-stat span{font:500 .72rem var(--ff-h);color:rgba(255,255,255,.55);letter-spacing:.12em;text-transform:uppercase}
.featured-section{padding:88px 0 40px}
.featured-article{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center;background:var(--card);border-radius:24px;overflow:hidden;border:1px solid var(--line-2);transition:.4s}
.featured-article:hover{transform:translateY(-4px);background:#fff;border-color:var(--green);box-shadow:0 24px 60px rgba(14,46,88,.1)}
.featured-image{aspect-ratio:1.2;background:linear-gradient(135deg,var(--blue),var(--blue-deep) 60%,var(--green) 130%);position:relative;overflow:hidden}
.featured-image::after{content:"";position:absolute;top:-30%;right:-20%;width:400px;height:400px;background:radial-gradient(circle,rgba(61,168,87,.35),transparent 65%)}
.featured-image-content{position:absolute;bottom:40px;left:40px;right:40px;color:#fff;z-index:2}
.featured-badge{display:inline-flex;align-items:center;gap:8px;font:700 .68rem var(--ff-h);letter-spacing:.2em;text-transform:uppercase;color:var(--mint);padding:6px 14px;border-radius:100px;background:rgba(61,168,87,.2);border:1px solid rgba(61,168,87,.35);margin-bottom:16px}
.featured-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green);animation:pulse 2s infinite}
.featured-image-content h3{font-size:clamp(1.5rem,2.6vw,2.1rem);color:#fff}
.featured-content{padding:52px 52px 52px 0}
.featured-meta{display:flex;align-items:center;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.featured-cat{font:700 .68rem var(--ff-h);letter-spacing:.14em;text-transform:uppercase;color:var(--green-dark);padding:5px 12px;border-radius:100px;background:var(--green-soft)}
.featured-date{font-size:.8rem;color:var(--muted)}
.featured-content h4{font-size:1.3rem;line-height:1.35;margin-bottom:14px}
.featured-content p{font-size:.95rem;color:var(--muted);line-height:1.75;margin-bottom:28px}
.featured-cta{display:inline-flex;align-items:center;gap:10px;font:600 .88rem var(--ff-h);color:var(--blue-deep);transition:gap .25s}
.featured-cta .arrow,.article-arrow{width:36px;height:36px;border-radius:50%;background:var(--blue-soft);color:var(--blue);display:flex;align-items:center;justify-content:center;flex:none;transition:.3s}
.featured-article:hover .featured-cta{gap:16px}
.featured-article:hover .featured-cta .arrow,.article-card:hover .article-arrow{background:var(--green);color:#fff;transform:rotate(-45deg)}
.filter-section{padding:24px 0 48px}
.filter-bar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;padding:20px 0;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);justify-content:center}
.filter-chip{font:600 .78rem var(--ff-h);padding:9px 18px;border-radius:100px;color:var(--muted);background:var(--card);border:1px solid var(--line-2);cursor:pointer;transition:.25s}
.filter-chip:hover{color:var(--blue-deep);border-color:var(--blue);transform:translateY(-2px)}
.filter-chip.active{background:var(--blue-deep);color:#fff;border-color:var(--blue-deep)}
.articles-section{background:var(--soft)}
.articles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.article-card{background:#fff;border-radius:20px;overflow:hidden;border:1px solid var(--line-2);transition:.35s;display:flex;flex-direction:column;position:relative}
.article-card.hide{display:none}
.article-card::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--blue),var(--green));transform:scaleX(0);transform-origin:left;transition:transform .5s;z-index:3}
.article-card:hover{transform:translateY(-6px);border-color:var(--green);box-shadow:0 20px 40px rgba(14,46,88,.1)}
.article-card:hover::before{transform:scaleX(1)}
.article-image{aspect-ratio:1.6;position:relative;overflow:hidden}
.article-image::after{content:"";position:absolute;top:-30%;right:-20%;width:300px;height:300px;background:radial-gradient(circle,rgba(255,255,255,.15),transparent 65%)}
.g1{background:linear-gradient(135deg,var(--blue),var(--blue-deep))}
.g2{background:linear-gradient(135deg,var(--green),var(--green-dark))}
.g3{background:linear-gradient(135deg,#7C5CE0,var(--blue-deep))}
.g4{background:linear-gradient(135deg,var(--blue-mid),var(--blue))}
.g5{background:linear-gradient(135deg,#E24C7C,#8B2D52)}
.g6{background:linear-gradient(135deg,var(--green),var(--blue))}
.article-cat{position:absolute;top:20px;left:20px;font:700 .62rem var(--ff-h);letter-spacing:.14em;text-transform:uppercase;color:#fff;padding:6px 13px;border-radius:100px;background:rgba(255,255,255,.18);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.25);z-index:2}
.article-body{padding:26px 26px 28px;display:flex;flex-direction:column;flex-grow:1}
.article-body h3{font-size:1.2rem;line-height:1.3;margin-bottom:10px;transition:color .2s}
.article-card:hover .article-body h3{color:var(--blue)}
.article-body p{font-size:.9rem;color:var(--muted);line-height:1.7;flex-grow:1;margin-bottom:20px}
.article-foot{display:flex;justify-content:space-between;align-items:center;padding-top:18px;border-top:1px solid var(--line-2);gap:12px}
.article-date{font:500 .74rem var(--ff-h);color:var(--muted)}
.article-date .ic{color:var(--green);margin-right:6px}
.article-arrow{width:34px;height:34px}
.newsletter-section{background:var(--blue-deep);color:#fff;padding:104px 0;overflow:hidden}
.newsletter-section::before{content:"";position:absolute;top:-20%;left:-10%;width:600px;height:600px;background:radial-gradient(circle,rgba(61,168,87,.18),transparent 65%);pointer-events:none}
.newsletter-wrap{position:relative;z-index:2;max-width:800px;margin:0 auto;text-align:center}
.newsletter-badge{display:inline-flex;align-items:center;gap:9px;font:700 .68rem var(--ff-h);letter-spacing:.2em;text-transform:uppercase;color:var(--green);padding:7px 15px;border-radius:100px;background:rgba(61,168,87,.1);border:1px solid rgba(61,168,87,.25);margin-bottom:24px}
.newsletter-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green);animation:pulse 2s infinite}
.newsletter-wrap h2{font-size:clamp(1.9rem,3.6vw,2.7rem);color:#fff;margin-bottom:18px}
.newsletter-wrap h2 em{color:var(--mint)}
.newsletter-wrap p{font-size:1rem;color:rgba(255,255,255,.7);line-height:1.7;font-weight:300;margin:0 auto 32px;max-width:520px}
.newsletter-form{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;max-width:520px;margin:0 auto}
.newsletter-form input{flex:1;min-width:240px;padding:16px 20px;border-radius:100px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.06);color:#fff;font:.92rem var(--ff-body);outline:none;transition:.2s}
.newsletter-form input::placeholder{color:rgba(255,255,255,.45)}
.newsletter-form input:focus{border-color:var(--green);background:rgba(255,255,255,.1);box-shadow:0 0 0 4px rgba(61,168,87,.15)}
.newsletter-form button{background:var(--green);color:#fff;padding:16px 32px;border:none;border-radius:100px;font:600 .9rem var(--ff-h);cursor:pointer;transition:.25s;box-shadow:0 8px 24px rgba(61,168,87,.32)}
.newsletter-form button:hover{background:var(--green-dark);transform:translateY(-2px)}
.cta-card{background:linear-gradient(135deg,var(--blue-deep),var(--blue));border-radius:24px;padding:72px 60px;color:#fff;display:grid;grid-template-columns:1.4fr 1fr;gap:56px;align-items:center;position:relative;overflow:hidden}
.cta-card::before{content:"";position:absolute;top:-40%;right:-5%;width:480px;height:480px;background:radial-gradient(circle,rgba(61,168,87,.28),transparent 65%)}
.cta-card>*{position:relative}
.cta-card h2{font-size:clamp(1.8rem,3.2vw,2.4rem);line-height:1.2;color:#fff;margin-bottom:14px}
.cta-card h2 em{color:var(--mint)}
.cta-card p{color:rgba(255,255,255,.75);max-width:460px;line-height:1.7}
.cta-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}

/* ===== 9. RESPONSIVE ===== */
@media(max-width:1180px){
  .sv-stage{--u:1px;height:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
  .sv-lines{display:none}
  .sv-card{position:relative;left:auto;top:auto;width:auto;height:auto;padding:28px 22px;border:2px solid var(--c)}
  .sv-card p{font-size:14px}
  .sv-card:nth-of-type(even) .sv-ic{order:0}
  .ps-stage{--u:1px;height:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
  .ps-lines{display:none}
  .process-step{position:relative;left:auto;top:auto;width:auto;height:auto;display:flex;flex-direction:column}
  .process-step .ps-cap{position:relative;left:auto;top:auto;bottom:auto;width:auto;height:auto;flex-direction:row;align-items:baseline;justify-content:flex-start;gap:10px;padding:14px 22px;border-radius:22px 22px 0 0}
  .process-step .ps-num{font-size:24px}
  .process-step .ps-card{position:relative;top:auto;bottom:auto;height:auto;flex:1;align-items:flex-start;text-align:left;padding:22px 22px 24px;border-radius:0 0 22px 22px}
  .process-step .ps-ic{position:static;transform:none;margin-top:16px;width:30px;height:30px}
  .ps-h{font-size:13px}.ps-p{font-size:14px}
  .hx-tiles{position:relative;left:auto;right:auto;bottom:auto;grid-column:1/-1;margin:0 var(--pl) 0 0}
}
@media(max-width:1100px){
  .enroll-wrap,.search-layout,.faq-layout{grid-template-columns:1fr;gap:48px}
  .faq-intro{position:static}
  .team-cloud-left,.team-cloud-right{opacity:.35;transform:translateY(-50%) scale(.8)}
  .awards-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .award{min-height:240px}.award:first-child{grid-row:auto;grid-column:1/-1;min-height:300px}.award:nth-child(4){grid-column:1/-1}
  .foot-top{grid-template-columns:1fr 1fr;gap:44px}
  .page-hero-inner{grid-template-columns:1fr;gap:48px;align-items:start}
  .page-hero-stats{grid-template-columns:repeat(4,1fr)}
  .featured-article{grid-template-columns:1fr;gap:0}
  .featured-image{aspect-ratio:1.8}.featured-content{padding:40px}
  .articles-grid{grid-template-columns:repeat(2,1fr)}
  .cta-card{grid-template-columns:1fr;padding:52px 40px;gap:32px}.cta-actions{justify-content:flex-start}
}
@media(max-width:1060px){
  /* tab bar moves to the bottom on tablet + phone */
  .nb-wrap,.nb-wrap.scrolled{top:auto;bottom:0;padding:0 10px calc(10px + env(safe-area-inset-bottom,0px))}
  .nb{height:74px;padding:0 6px;border-radius:24px}
  .nb::before{border-radius:24px}
  .nb-logo,.nb>.nb-cta,.nb-dd-wrap{display:none}
  .nb-menu{width:100%;justify-content:space-around;gap:0}
  .nb-item{flex:1}
  .nb-link{min-width:0;width:100%;padding:0 4px 12px;font-size:.72rem}
  body{padding-bottom:104px}
  .fab{bottom:112px}
  .nb-link.active .nb-ico{top:-28px}
}
@media(max-width:1050px){
  .ct-hero{min-height:0}.blobs{width:100%;height:560px;top:auto;bottom:0}
  .hero-grid{grid-template-columns:1fr;min-height:0;gap:56px;padding-top:120px;padding-bottom:70px}
  .form-side{max-width:560px}.f-orb{right:0}
  .blob-card{margin-left:0;aspect-ratio:auto;border-radius:36px;padding:44px 36px;width:100%;max-width:520px}
  .strip-in{grid-template-columns:1fr 1fr;gap:18px 0}.st{border:0}
}
@media(max-width:1000px){
  .hx-card{grid-template-columns:1fr;min-height:0;padding:100px 22px 110px;gap:34px}
  .hx-ann{top:26px}
  .hx-text{padding:0}
  .hx-art{--cs:310px;height:400px;max-width:560px;width:100%;margin:0 auto}
  .hx-band{height:220px;margin-top:-110px;right:70px;left:-22px}
  .hx-badge{width:100px;height:100px;left:-40px}.hx-badge b{font-size:1.5rem}
  .hx-tiles{margin:0}
  .pl2-top{grid-template-columns:1fr;gap:40px}
  .pl2-stats{grid-template-columns:1fr}.pl2-stat+.pl2-stat{border-left:0;border-top:1px solid rgba(255,255,255,.14)}
  .pl2-steps{grid-template-columns:1fr 1fr;gap:36px 24px}.pl2-steps::before{display:none}
  .sp{grid-template-columns:1fr;gap:36px}
}
@media(max-width:900px){
  .team-cloud-left,.team-cloud-right{display:none}.team-cloud-section{padding:100px 0}
  .testi-grid{grid-template-columns:1fr}.b-blue{margin-left:0}
  .page-hero-stats{grid-template-columns:1fr 1fr}
  .articles-grid{grid-template-columns:1fr}
}
@media(max-width:800px){.sv-stage,.ps-stage{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){
  .road{background:none}.road-svg{display:none}
  .pins{position:relative;inset:auto;display:flex;flex-direction:column;gap:18px;padding:8px 0 8px 34px}
  .pins::before{content:"";position:absolute;left:0;top:0;bottom:0;width:26px;border-radius:13px;background:repeating-linear-gradient(180deg,#fff 0 12px,transparent 12px 26px) center/3px 100% no-repeat,var(--blue-deep)}
  .pin{position:relative;left:auto;top:auto;width:auto;height:auto;padding-left:34px;min-height:40px}
  .pin-h{left:-52px;top:2px}
  .pin-l{position:static;transform:none;text-align:left;box-shadow:none;background:none;padding:0}
  .pin-l::after{display:none}
}
@media(max-width:640px){
  section{padding:80px 0}
  .wrap{padding:0 22px}
  .fab{right:16px;width:52px;height:52px}
  .hx-card{padding:84px 16px 108px}
  .hx-ann{top:20px;left:16px;max-width:calc(100% - 32px);font-size:.72rem;padding-left:12px}
  .hx-ann a{padding:6px 12px}
  .hx h1 .l1,.hx h1 .l2{font-size:2.1rem}
  .hx-actions{flex-direction:column}.hx-actions a{justify-content:center}
  .hx-art{--cs:min(68vw,270px);height:calc(var(--cs) + 70px)}
  .hx-strip,.hx-fl{display:none}
  .hx-band{left:-16px;right:-16px;border-radius:0;height:calc(var(--cs) * .62);margin-top:calc(var(--cs) * -.31)}
  .hx-circ{right:auto;left:50%;margin-left:calc(var(--cs) / -2)}
  .hx-circ::after{display:none}
  .hx-badge{width:84px;height:84px;left:-22px;bottom:6px;border-width:5px}
  .hx-badge b{font-size:1.2rem}.hx-badge span{font-size:.48rem}
  .hx-chip{right:-18px;top:2px;padding:8px 12px}
  .hx-pp{right:4px;bottom:0;width:34px;height:34px}
  .hx-stats{gap:8px}.hx-stat{min-width:0;flex:1;padding:10px 12px}.hx-stat .n{font-size:1.2rem}.hx-stat .l{font-size:.5rem;letter-spacing:.05em}
  .hx-bar{left:16px;gap:12px;padding:12px 18px;font-size:.76rem;bottom:26px}.hx-bar i{display:none}
  .hx-tiles{grid-template-columns:1fr 1fr;gap:10px}
  .hx-tile{padding:11px 10px;gap:8px}
  .hx-tile i{width:34px;height:34px;border-radius:11px}.hx-tile svg{width:17px;height:17px}
  .hx-tile strong{font-size:.74rem}.hx-tile span{font-size:.62rem}
  .hl-item{font-size:.84rem;padding-left:24px}
  .enroll-section{padding:100px 0 110px}.enroll-wrap{padding:0 22px;gap:40px}.enroll-card{padding:28px 20px}
  .form-grid{grid-template-columns:1fr}.form-group input,.form-group select{font-size:16px}
  .pl2-logos{grid-template-columns:repeat(2,1fr)}.pl2-steps{grid-template-columns:1fr}.pl2-stat{padding:28px 24px}
  .course-tile{flex:0 0 85vw;max-width:340px;padding:38px 24px 24px}.scroll-controls{display:none}
  .greviews{padding:26px 22px}
  .awards-grid{grid-template-columns:1fr}.award:nth-child(4){grid-column:auto}
  .faq-item{padding:20px 0}.faq-item summary{font-size:1rem}.faq-item p{padding-right:0}.cd-list{grid-template-columns:1fr}
  .ts-feature{padding:40px 26px 30px;border-radius:28px}.ts-bub{padding:24px 22px}
  .sv-stage,.ps-stage{grid-template-columns:1fr}
  .foot-top{grid-template-columns:1fr}footer{padding-top:60px}
  .foot-bottom{flex-direction:column;text-align:center}.foot-bottom-links{justify-content:center}
  .ab-hero{padding:130px 0 60px}.pl{width:94%}.nr.n3{grid-template-columns:1fr 1fr}.cc{padding:36px 24px}
  .frow{grid-template-columns:1fr;gap:0}
  .strip-in{grid-template-columns:1fr}.band-in{padding:28px 24px}
  .page-hero{padding:140px 0 70px}.page-hero h1{font-size:2rem}
  .page-hero-stats{gap:14px}.page-hero-stat{padding:18px 16px}.page-hero-stat strong{font-size:1.5rem}
  .featured-image{aspect-ratio:1.4}.featured-image-content{bottom:28px;left:28px;right:28px}.featured-content{padding:30px 24px}
  .filter-bar{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap}.filter-chip{white-space:nowrap}
  .newsletter-form{flex-direction:column}.newsletter-form input{min-width:100%}
  .cta-card{padding:44px 28px}
}
@media(max-width:360px){.nb-link{font-size:.66rem}.hx-chip{display:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}.rv{opacity:1;transform:none}}

/* ===== APPEND TO styles.css ===== */

/* ---------- LEAD POPUP ---------- */
html.lp-lock{overflow:hidden}
.lp{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;padding:16px;background:rgba(8,24,48,.62);backdrop-filter:blur(4px);opacity:0;transition:opacity .25s}
.lp[hidden]{display:none}
.lp.open{opacity:1}
.lp-box{position:relative;display:grid;grid-template-columns:1fr 1.05fr;width:min(900px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:#fff;border-radius:24px;box-shadow:0 30px 80px rgba(8,24,48,.45);transform:translateY(16px) scale(.98);transition:transform .3s}
.lp.open .lp-box{transform:none}
.lp-x{position:absolute;top:12px;right:12px;z-index:2;width:38px;height:38px;border:0;border-radius:50%;background:#EEF3FA;color:#0E2E58;font-size:24px;line-height:1;cursor:pointer}
.lp-x:hover{background:#DCE7F6}
.lp-art{position:relative;min-height:420px;background:linear-gradient(160deg,#BFE0FA 0%,#4A9BE6 55%,#1F5DAD 100%);overflow:hidden}
.lp-art svg{position:absolute;inset:0;width:100%;height:100%}
.lp-art-tx{position:absolute;left:24px;right:24px;bottom:24px;color:#fff;font:700 20px/1.25 'Plus Jakarta Sans',sans-serif;text-shadow:0 2px 12px rgba(14,46,88,.35)}
.lp-art-tx small{display:block;margin-top:6px;font:500 13px/1.4 Inter,sans-serif;opacity:.92}
.lp-form{padding:34px 32px 28px}
.lp-kicker{display:inline-block;padding:5px 12px;border-radius:99px;background:#E7F0FC;color:#1F5DAD;font:700 12px/1 Inter,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.lp-form h2{margin:12px 0 6px;font:800 26px/1.2 'Plus Jakarta Sans',sans-serif;color:#0E2E58}
.lp-form h2 em{font-style:normal;color:#1F5DAD}
.lp-form>p{margin:0 0 18px;color:#5B6B80;font-size:14px;line-height:1.5}
.lp-form form{display:grid;gap:12px}
.lp-form label{display:block;margin-bottom:5px;font:600 13px/1 Inter,sans-serif;color:#0E2E58}
.lp-form label span{color:#D93025}
.lp-form input,.lp-form select{width:100%;height:48px;padding:0 14px;border:1.5px solid #D6E0EE;border-radius:12px;background:#fff;font:500 15px Inter,sans-serif;color:#0E2E58;transition:border-color .2s,box-shadow .2s}
.lp-form input:focus,.lp-form select:focus{outline:0;border-color:#1F5DAD;box-shadow:0 0 0 4px rgba(31,93,173,.14)}
.lp-form input:user-invalid,.lp-form select:user-invalid{border-color:#D93025}
.lp-form button[type=submit]{height:50px;margin-top:4px;border:0;border-radius:12px;background:linear-gradient(135deg,#1F5DAD,#0E2E58);color:#fff;font:700 15px Inter,sans-serif;cursor:pointer;transition:transform .2s,box-shadow .2s}
.lp-form button[type=submit]:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(14,46,88,.28)}
.lp-form button[type=submit]:disabled{opacity:.6;cursor:wait}
.lp-safe{margin:0;text-align:center;color:#7A889B;font-size:12px}
.lp-form.sent form>*:not(.lead-msg){display:none}
.lp-form.sent .lead-msg{padding:28px 12px;text-align:center;font-size:17px}
.lead-msg{grid-column:1/-1;margin-top:8px;font-size:14px;font-weight:600;color:#5B6B80}
.lead-msg.ok{color:#1B7A3A}
.lead-msg.err{color:#C0392B}
@media(max-width:760px){
  .lp-box{grid-template-columns:1fr}
  .lp-art{display:none}
  .lp-form{padding:28px 20px 22px}
  .lp-form h2{font-size:22px;padding-right:30px}
}

/* ---------- FOOTER ---------- */
.ft{background:#0E2A52;color:#fff;padding:0;margin:0;border:0}
.ft-wrap{width:min(1200px,100% - 48px);margin-inline:auto}
.ft-info{background:#fff;color:#0E2E58;padding:48px 0 8px}
.ft-info .ft-wrap{display:grid;grid-template-columns:210px 1fr;gap:56px;align-items:start}
.ft-logo{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:190px;height:190px;border:3px solid #0E2E58;border-radius:50%;background:#fff;box-shadow:0 14px 30px rgba(14,46,88,.18);text-decoration:none}
.ft-mark{display:grid;place-items:center;width:60px;height:60px;border-radius:16px;background:linear-gradient(135deg,#4A9BE6,#1F5DAD)}
.ft-mark i{width:30px;height:30px;border:5px solid #fff;border-radius:50%}
.ft-logo b{margin-top:8px;font:800 24px/1 'Plus Jakarta Sans',sans-serif;color:#0E2E58}
.ft-logo b span{color:#1F5DAD}
.ft-logo small{font:600 11px/1 Inter,sans-serif;letter-spacing:.32em;color:#4F5F75;margin-left:.32em}
.ft-main h2{margin:6px 0 4px;font:800 28px/1.2 'Plus Jakarta Sans',sans-serif;color:#0E2E58}
.ft-tag{margin:0 0 16px;color:#5B6B80;font-size:15px}
.ft-grid{list-style:none;margin:0;padding:18px 0 0;border-top:2px solid #0E2E58;display:grid;grid-template-columns:1.5fr 1fr;gap:22px 40px}
.ft-grid li{display:flex;gap:14px;align-items:flex-start}
.ft-n{flex:none;display:grid;place-items:center;width:30px;height:30px;margin-top:2px;border-radius:50%;background:#0E2E58;color:#fff;font:700 13px/1 Inter,sans-serif}
.ft-grid small{display:block;margin-bottom:4px;font:600 12px/1 Inter,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#5B6B80}
.ft-grid address,.ft-grid a,.ft-grid p{margin:0;font:500 17px/1.5 Inter,sans-serif;font-style:normal;color:#0E2E58;text-decoration:none}
.ft-grid a:hover{color:#1F5DAD;text-decoration:underline}
.ft-wave{position:relative;height:clamp(90px,10vw,140px);margin-top:-6px;background:#fff}
.ft-wave svg{display:block;width:100%;height:100%}
.ft-gold{position:absolute;left:0;bottom:0;width:min(360px,25%);height:5px;background:#D4A22A}
.ft-bar{padding:0}
.ft-bar-in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0}
.ft-links{display:flex;flex-wrap:wrap;gap:8px 24px}
.ft-links a{color:#fff;text-decoration:none;font:500 16px Inter,sans-serif;opacity:.92}
.ft-links a:hover{opacity:1;text-decoration:underline}
.ft-soc{display:flex;gap:12px}
.ft-soc a{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.14);transition:background .2s,transform .2s}
.ft-soc a:hover{background:rgba(255,255,255,.28);transform:translateY(-2px)}
.ft-soc svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ft-copy{margin:0;padding:18px 0 24px;border-top:1px solid rgba(255,255,255,.14);text-align:center;font-size:14px;opacity:.85}
@media(max-width:860px){
  .ft-info .ft-wrap{grid-template-columns:1fr;gap:28px;justify-items:center;text-align:left}
  .ft-main{width:100%}
  .ft-grid{grid-template-columns:1fr}
  .ft-bar-in{flex-direction:column;align-items:flex-start}
}
@media(max-width:1060px){ .ft{padding-bottom:84px} } /* clears the bottom tab bar on mobile */

/* disabled submit button */
.form-submit button:disabled,
.lp-form button[type=submit]:disabled{
  opacity:.65;
  cursor:not-allowed;
  transform:none!important;
  box-shadow:none!important;
  filter:grayscale(.25);
}
/* ===== WHITE NAVBAR (logo visible) ===== */
.nb::before{
  background:
    radial-gradient(rgba(31,93,173,.10) 1px,transparent 1.4px) 0 0/14px 14px,
    #fff;
  box-shadow:inset 0 0 0 1px rgba(14,46,88,.08);
}

/* logo: no zoom, no crop, no pill */
.nb-logo{
  align-self:center;
  display:flex;
  align-items:center;
  flex:none;
  width:auto;
  height:56px;
  padding:0;
  background:none;
  box-shadow:none;
  overflow:visible;
}
.nb-logo img{
  display:block;
  height:100%;
  width:auto;
  max-width:170px;
  object-fit:contain;
  transform:none;
}

/* menu text + icons now dark */
.nb-link{color:var(--muted)}
.nb-link:hover,
.nb-item:hover>.nb-link,
.nb-item.open>.nb-link{color:var(--blue)}
.nb-link.active{color:var(--blue-deep)}

/* active circle: blue with white icon so it stands out on white */
.nb-link.active .nb-ico{
  color:#fff;
  background:linear-gradient(135deg,var(--blue-mid),var(--blue-deep));
  box-shadow:0 12px 24px rgba(31,93,173,.4);
}

/* CTA button: blue instead of white */
.nb-cta{
  background:linear-gradient(135deg,var(--blue),var(--blue-deep));
  color:#fff;
  box-shadow:0 10px 22px rgba(31,93,173,.35);
}
/* ===== FINAL LOGO (no zoom) ===== */
.nb .nb-logo{
  align-self:center;
  display:flex;
  align-items:center;
  flex:none;
  width:auto;
  height:auto;
  padding:0;
  background:none;
  box-shadow:none;
  overflow:visible;
}
.nb .nb-logo img{
  display:block;
  height:226px;          /* make bigger: 52px | smaller: 40px */
  width:auto;
  max-width:none;
  transform:none;
  margin:0;
}
.ft-info,.ft-wave{background:#E8F0FB}
/* footer logo image */
.ft-logo{padding:0}
.ft-logo img{
  display:block;
  width:150px;
  height:auto;
  max-width:80%;
  object-fit:contain;
}
/* ===== BRANCHES (contact page) ===== */
.br-feature{position:relative;overflow:hidden;display:grid;grid-template-columns:1.2fr 1fr;gap:36px;align-items:center;padding:40px;margin-bottom:24px;border-radius:28px;color:#fff;background:linear-gradient(135deg,#081E3D,#0E2E58 60%,#1F5DAD);box-shadow:var(--shadow-xl)}
.br-feature::before{content:"";position:absolute;top:-120px;right:-80px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(61,168,87,.4),transparent 65%)}
.br-feature>*{position:relative}
.br-chip{display:inline-block;margin-bottom:14px;padding:6px 14px;border-radius:100px;background:rgba(61,168,87,.2);border:1px solid rgba(107,201,126,.35);color:var(--mint);font:700 .7rem var(--ff-h);letter-spacing:.12em;text-transform:uppercase}
.br-feature h3{color:#fff;font-size:clamp(1.5rem,2.6vw,2rem);margin-bottom:8px}
.br-feature p{color:rgba(255,255,255,.75);line-height:1.7;max-width:46ch;margin-bottom:22px}
.br-feature-act{display:flex;flex-wrap:wrap;gap:12px}
.br-info{list-style:none;display:grid;gap:14px}
.br-info li{display:flex;gap:14px;align-items:center;padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);font-size:.9rem;color:rgba(255,255,255,.85)}
.br-info .i{width:22px;height:22px;color:var(--mint)}
.br-info b{display:block;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:2px}

.br-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.br-card{--c:var(--blue);background:#fff;border:1px solid var(--line);border-top:5px solid var(--c);border-radius:20px;padding:24px;box-shadow:var(--shadow-md);transition:.25s}
.br-card:nth-child(2){--c:var(--green)}
.br-card:nth-child(3){--c:#7B5CF0}
.br-card:nth-child(4){--c:#F08A24}
.br-card:nth-child(5){--c:#14B8A6}
.br-card:nth-child(6){--c:#E5484D}
.br-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.br-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.br-n{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--c);color:#fff;font:800 .9rem var(--ff-serif)}
.br-tags{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.br-tags span{padding:5px 10px;border-radius:100px;background:var(--blue-tint);font:600 .66rem var(--ff-h);color:var(--muted);letter-spacing:.04em}
.br-card h3{font-size:1.25rem;margin-bottom:2px}
.br-card p{font-size:.88rem;color:var(--muted);margin-bottom:18px}
.br-act{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-top:16px;border-top:1px dashed var(--line-2)}
.br-act a,.br-act button{font:700 .84rem var(--ff-h);color:var(--c);background:none;border:0;padding:0;cursor:pointer}
.br-act a:hover,.br-act button:hover{text-decoration:underline}

@media(max-width:1000px){.br-feature{grid-template-columns:1fr;padding:30px 26px}.br-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.br-grid{grid-template-columns:1fr}}
/* ===== SEO CONTENT BLOCKS (append to END of styles.css, after the hero CSS) ===== */
.ans{max-width:860px;margin:0 0 20px;padding:18px 22px;border-radius:14px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--green);box-shadow:var(--shadow-sm);color:var(--ink-2);line-height:1.75;font-size:.95rem}
.ans b{color:var(--blue-deep)}
.center .ans,.ans.mid{margin-left:auto;margin-right:auto;text-align:left}
.txt{max-width:860px;color:var(--muted);line-height:1.8;margin-bottom:18px}
.txt.mid{margin-left:auto;margin-right:auto}
.sub-h{font-size:1.15rem;margin:0 0 12px}
.btn-wrap{margin-top:26px}
.btn-wrap.mid{text-align:center}
.btn-blue{background:linear-gradient(135deg,var(--blue),var(--blue-deep));box-shadow:0 10px 26px rgba(31,93,173,.35)}

/* hero additions */
.hr-eyebrow{font:700 .78rem var(--ff-h);letter-spacing:.14em;text-transform:uppercase;color:#8CC4FF;margin-bottom:14px}
.hr-tag{color:#fff;font:700 1.25rem/1.4 var(--ff-serif);margin-bottom:14px}
.hr-tag span{color:#6BC97E}
.hr-badges{display:flex;flex-wrap:wrap;gap:10px;border-top:1px solid rgba(255,255,255,.14);padding-top:24px}
.hr-badges span{padding:9px 16px;border-radius:100px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);font:600 .8rem var(--ff-h);color:#fff}
.hr-lead{max-width:56ch}

/* tables */
.tbl-wrap{overflow-x:auto;border-radius:16px;border:1px solid var(--line-2);background:#fff;box-shadow:var(--shadow-md);margin:0 0 22px}
.seo-table{width:100%;border-collapse:collapse;font-size:.92rem;min-width:420px}
.seo-table th,.seo-table td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--line)}
.seo-table th{background:var(--blue-deep);color:#fff;font:600 .8rem var(--ff-h);letter-spacing:.04em}
.seo-table td:first-child{font-weight:600;color:var(--blue-deep);width:38%}
.seo-table tr:last-child td{border-bottom:0}

/* about */
.ab-more{margin-top:48px;display:grid;grid-template-columns:1.15fr 1fr;gap:44px;align-items:start}
.about-section .pl2-top{align-items:start}

/* enroll */
.en-addr{margin-top:18px;padding-top:18px;border-top:1px dashed var(--line-2);font-size:.82rem;color:var(--muted);line-height:1.6;text-align:center}
.en-faq{margin-top:56px;grid-column:1/-1}
.en-faq h3{font-size:1.3rem;margin-bottom:14px}
.enroll-wrap{grid-template-columns:1fr 1.05fr}
.enroll-left .ans{max-width:none}

/* who can join */
.wj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:34px}
.wj-card{background:#fff;border-radius:24px;padding:30px 26px;border-top:5px solid var(--c);box-shadow:var(--shadow-lg)}
.wj-card:nth-child(1){--c:#FF9A56}.wj-card:nth-child(2){--c:#8B5CF6}.wj-card:nth-child(3){--c:#3DA857}
.wj-card h3{font-size:1.2rem;margin-bottom:10px;color:var(--c)}
.wj-card p{font-size:.92rem;color:var(--muted);line-height:1.75}

/* why + demo card */
.search-section .ans{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14);border-left-color:#6BC97E;color:rgba(255,255,255,.88)}
.search-section .ans b{color:#fff}
.search-section .txt{color:rgba(255,255,255,.72)}
.search-item{align-items:flex-start}
.search-item .tick{margin-top:2px}
.search-item strong{display:block;font-weight:600;font-size:.96rem}
.search-item span.d{display:block;margin-top:2px;font-size:.84rem;color:rgba(255,255,255,.7);font-weight:400}
.demo-card{background:#fff;color:var(--ink);border-radius:26px;padding:36px;box-shadow:0 30px 60px rgba(0,0,0,.3);position:relative;overflow:hidden}
.demo-card::before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--blue),var(--green))}
.demo-card h3{font-size:1.5rem;margin:14px 0 10px}
.demo-card p{color:var(--muted);line-height:1.75;font-size:.94rem;margin-bottom:18px}
.demo-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.demo-chips span{padding:7px 14px;border-radius:100px;background:var(--blue-soft);color:var(--blue-deep);font:600 .76rem var(--ff-h)}

/* career paths */
.process-section{padding:100px 0}
.cp-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin:34px 0 28px}
.cp-card{background:#fff;border-radius:22px;padding:26px 20px;border-top:5px solid var(--c);box-shadow:var(--shadow-md);display:flex;flex-direction:column}
.cp-card:nth-child(1){--c:#00B4D8}.cp-card:nth-child(2){--c:#5B4FE0}.cp-card:nth-child(3){--c:#B14BFF}.cp-card:nth-child(4){--c:#FF1493}.cp-card:nth-child(5){--c:#FF9E00}
.cp-card small{font:700 .68rem var(--ff-h);letter-spacing:.14em;color:var(--c);text-transform:uppercase;margin-bottom:8px}
.cp-card h3{font-size:1.05rem;margin-bottom:10px}
.cp-card p{font-size:.86rem;color:var(--muted);line-height:1.65;margin-bottom:12px}
.cp-card p.pr{margin:auto 0 0;padding-top:12px;border-top:1px dashed var(--line-2);color:var(--ink-2)}
.cp-card p.pr b{color:var(--c)}
.cp-close{text-align:center;color:var(--ink-2);margin-bottom:6px}

/* placement */
.pl2-steps.s5{grid-template-columns:repeat(5,1fr);gap:22px;margin-top:36px}
.pl2-steps.s5 .pl2-step:last-child .pl2-dot{background:#fff;border-color:var(--blue);color:var(--blue)}

/* portfolio */
.pf-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:30px 0}
.pf-card{background:#fff;border-radius:24px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-md)}
.pf-card header{padding:22px 26px;color:#fff;background:linear-gradient(135deg,var(--blue-deep),var(--blue))}
.pf-card:nth-child(2) header{background:linear-gradient(135deg,var(--blue),var(--blue-mid))}
.pf-card:nth-child(3) header{background:linear-gradient(135deg,var(--green-dark),var(--green))}
.pf-card:nth-child(4) header{background:linear-gradient(135deg,#0E2E58,var(--green-dark))}
.pf-card h3{color:#fff;font-size:1.15rem}
.pf-card .bd{padding:22px 26px 26px}
.pf-card .bd p{color:var(--muted);line-height:1.7;font-size:.92rem;margin-bottom:12px}
.pf-card .bd p.show{color:var(--ink-2);padding:12px 14px;border-radius:12px;background:var(--green-tint);margin:0}
.pf-card .bd p.show b{color:var(--green-dark)}

/* course details */
.faq-item .mod-in{padding-top:12px;color:var(--muted);font-size:.92rem;line-height:1.7}
.faq-section .ans{max-width:none}

/* location */
.lc-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:28px;align-items:stretch;margin-top:30px}
.lc-card{background:#fff;border:1px solid var(--line);border-radius:28px;padding:34px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column}
.lc-card h3{font-size:1.4rem;margin-bottom:16px}
.lc-card address{font-style:normal}
.lc-rows{list-style:none;display:grid;gap:12px;margin-bottom:24px}
.lc-rows li{padding:14px 16px;border-radius:14px;background:var(--blue-tint);font-size:.92rem;line-height:1.55}
.lc-rows b{display:block;font:700 .7rem var(--ff-h);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.lc-rows a{color:var(--blue);font-weight:600}
.lc-act{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto}
.lc-act .btn-ghost{padding:14px 22px}
.lc-map{border-radius:18px;overflow:hidden;border:1px solid var(--line-2);margin-bottom:18px;min-height:300px;flex:1}
.lc-map iframe{display:block;width:100%;height:100%;min-height:300px;border:0}
.lc-card .online{color:var(--muted);line-height:1.7;font-size:.92rem;margin-bottom:18px}
.visit{margin-top:34px;padding:28px 30px;border-radius:24px;background:var(--green-tint);border:1px solid rgba(61,168,87,.25)}
.visit h3{font-size:1.15rem;margin-bottom:6px}

/* responsive */
@media(max-width:1100px){.cp-grid{grid-template-columns:repeat(3,1fr)}.pl2-steps.s5{grid-template-columns:repeat(3,1fr)}.ab-more,.lc-grid{grid-template-columns:1fr}}
@media(max-width:800px){.wj-grid,.pf-grid{grid-template-columns:1fr}.cp-grid,.pl2-steps.s5{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.cp-grid,.pl2-steps.s5{grid-template-columns:1fr}.lc-card,.demo-card{padding:26px 20px}}
/* ===== NEW HERO (append to END of styles.css) ===== */
.hr{position:relative;overflow:hidden;padding:168px 0 96px;color:#fff;background:
  radial-gradient(700px 420px at 85% 20%,rgba(61,168,87,.28),transparent 70%),
  radial-gradient(600px 500px at 0% 100%,rgba(42,111,196,.45),transparent 70%),
  linear-gradient(160deg,#061A36 0%,#0A2547 55%,#0E2E58 100%)}
.hr::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse at 60% 40%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse at 60% 40%,#000 20%,transparent 75%)}
.hr-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:center}

/* text side */
.hr-live{display:inline-flex;align-items:center;gap:10px;padding:7px 8px 7px 14px;border-radius:100px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);font:600 .8rem var(--ff-h);color:#fff;margin-bottom:26px}
.hr-live i{width:8px;height:8px;border-radius:50%;background:#6BC97E;box-shadow:0 0 0 4px rgba(107,201,126,.25);animation:pulse 2s infinite}
.hr-live a{padding:6px 14px;border-radius:100px;background:#fff;color:var(--blue-deep);font-weight:700;font-size:.74rem}
.hr h1{color:#fff;font-size:clamp(2.5rem,5.2vw,4.3rem);line-height:1.02;letter-spacing:-.04em;font-weight:800;margin-bottom:22px}
.hr h1 span{display:block}
.hr h1 .hr-grad{background:linear-gradient(90deg,#6BC97E,#8CC4FF);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.hr-lead{font-size:1.1rem;line-height:1.7;color:rgba(255,255,255,.76);max-width:50ch;margin-bottom:32px}
.hr-lead b{color:#fff;font-weight:600}
.hr-actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:38px}
.hr .btn-solid{padding:17px 34px;font-size:.95rem;box-shadow:0 14px 34px rgba(61,168,87,.45)}
.hr .btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.35);box-shadow:none;padding:17px 30px;font-size:.95rem}
.hr .btn-ghost:hover{background:rgba(255,255,255,.12);border-color:#fff}
.hr-proof{display:flex;flex-wrap:wrap;gap:0;border-top:1px solid rgba(255,255,255,.14);padding-top:26px}
.hr-proof div{padding-right:32px;margin-right:32px;border-right:1px solid rgba(255,255,255,.14)}
.hr-proof div:last-child{border:0;margin:0;padding:0}
.hr-proof b{display:block;font:800 1.9rem/1 var(--ff-serif);color:#fff;letter-spacing:-.03em}
.hr-proof b em{color:#6BC97E;font-size:.65em}
.hr-proof span{display:block;margin-top:6px;font:500 .78rem var(--ff-h);color:rgba(255,255,255,.62)}

/* visual side: campaign dashboard */
.hr-vis{position:relative;padding:26px 0 40px}
.hr-dash{position:relative;border-radius:26px;background:#fff;color:var(--ink);box-shadow:0 40px 90px rgba(0,0,0,.45),0 0 0 8px rgba(255,255,255,.08);overflow:hidden;transform:rotate(-1.5deg)}
.hr-bar{display:flex;align-items:center;gap:7px;padding:14px 18px;background:#EEF3FA;border-bottom:1px solid var(--line)}
.hr-bar i{width:11px;height:11px;border-radius:50%;background:#FF6B6B}
.hr-bar i:nth-child(2){background:#FFB84D}.hr-bar i:nth-child(3){background:#3DA857}
.hr-bar span{margin-left:12px;font:600 .74rem var(--ff-h);color:var(--muted)}
.hr-body{padding:24px}
.hr-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:20px}
.hr-kpi{padding:14px;border-radius:14px;background:var(--blue-tint);border:1px solid var(--line)}
.hr-kpi small{display:block;font:600 .68rem var(--ff-h);color:var(--muted);margin-bottom:6px}
.hr-kpi b{font:800 1.35rem/1 var(--ff-serif);color:var(--blue-deep);letter-spacing:-.03em}
.hr-kpi em{display:block;margin-top:6px;font:700 .7rem var(--ff-h);color:var(--green-dark)}
.hr-chart{position:relative;border-radius:16px;background:linear-gradient(180deg,#F4F8FD,#fff);border:1px solid var(--line);padding:14px 14px 6px}
.hr-chart svg{display:block;width:100%;height:auto}
.hr-line{stroke-dasharray:900;stroke-dashoffset:900;animation:hrDraw 2.2s .4s cubic-bezier(.2,.7,.2,1) forwards}
.hr-area{opacity:0;animation:hrFade 1s 1.6s forwards}
.hr-dot{opacity:0;animation:hrFade .4s 2.4s forwards}
@keyframes hrDraw{to{stroke-dashoffset:0}}
@keyframes hrFade{to{opacity:1}}
.hr-days{display:flex;justify-content:space-between;padding:6px 4px 0;font:500 .66rem var(--ff-h);color:var(--muted)}

/* floating chips */
.hr-chip{position:absolute;z-index:3;display:flex;align-items:center;gap:12px;padding:12px 18px 12px 12px;border-radius:18px;background:#fff;color:var(--blue-deep);box-shadow:0 20px 44px rgba(0,0,0,.35);animation:hxbob 5s ease-in-out infinite}
.hr-chip i{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;font:800 1rem var(--ff-serif);font-style:normal;color:#fff}
.hr-chip b{display:block;font:700 .86rem/1.2 var(--ff-h)}
.hr-chip span{display:block;font:500 .72rem var(--ff-h);color:var(--muted)}
.hr-c1{top:-6px;right:-14px}.hr-c1 i{background:linear-gradient(135deg,#4285F4,#1F5DAD)}
.hr-c2{bottom:6px;left:-26px;animation-delay:1.2s}.hr-c2 i{background:linear-gradient(135deg,var(--green),var(--green-dark))}
.hr-seal{position:absolute;z-index:4;right:-10px;bottom:-4px;width:112px;height:112px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;background:linear-gradient(135deg,#F08A24,#E5484D);border:5px solid #0A2547;box-shadow:0 18px 40px rgba(0,0,0,.4)}
.hr-seal b{font:800 1.7rem/1 var(--ff-serif);letter-spacing:-.03em}
.hr-seal span{margin-top:3px;font:700 .62rem var(--ff-h);letter-spacing:.1em;text-transform:uppercase}

/* tool marquee strip at the bottom of the hero */
.hr-tools{position:relative;z-index:2;margin-top:72px;padding-top:26px;border-top:1px solid rgba(255,255,255,.12);display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.hr-tools p{font:600 .8rem var(--ff-h);color:rgba(255,255,255,.55);flex:none}
.hr-tools ul{list-style:none;display:flex;flex-wrap:wrap;gap:10px}
.hr-tools li{padding:8px 16px;border-radius:100px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);font:600 .78rem var(--ff-h);color:rgba(255,255,255,.88)}

/* responsive */
@media(max-width:1060px){
  .hr{padding:120px 0 80px}
  .hr-grid{grid-template-columns:1fr;gap:56px}
  .hr-vis{max-width:560px;width:100%;margin:0 auto}
}
@media(max-width:640px){
  .hr{padding:90px 0 64px}
  .hr-live{font-size:.72rem}
  .hr-actions{flex-direction:column}.hr-actions a{justify-content:center}
  .hr-proof div{padding-right:18px;margin-right:18px}.hr-proof b{font-size:1.5rem}
  .hr-body{padding:16px}.hr-kpis{gap:8px}.hr-kpi{padding:10px}.hr-kpi b{font-size:1.05rem}
  .hr-c1{right:-6px}.hr-c2{left:-10px}
  .hr-seal{width:88px;height:88px;right:-4px}.hr-seal b{font-size:1.3rem}
  .hr-tools{margin-top:48px}.hr-tools p{width:100%}
}
@media(prefers-reduced-motion:reduce){.hr-line{stroke-dashoffset:0}.hr-area,.hr-dot{opacity:1}}
/* ==========================================================
   FAQ SECTION — Dark theme (light-dark background)
   ========================================================== */

.faq-media-section {
  position: relative;
  width: 100%;
  padding: 110px 0 130px;
  /* Dark “light-dark” grey background with subtle dots */
background: linear-gradient(100deg, var(--blue-deep) 0%, var(--blue) 60%, var(--blue-mid) 100%);  overflow: hidden;
  isolation: isolate;
  color: #E7ECF3;
}

/* blobs — muted for dark bg */
.fm-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(100px);
  pointer-events: none;
  z-index: 0;
}
.fm-b1 {
  width: 460px;
  height: 460px;
  left: -140px;
  top: 8%;
  background: rgba(61, 168, 87, .18);
}
.fm-b2 {
  width: 520px;
  height: 520px;
  right: -160px;
  bottom: 6%;
  background: rgba(76, 134, 224, .20);
}

/* grid */
.fm-wrap {
  position: relative;
  z-index: 2;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 32px;
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 72px;
  align-items: center;
}

/* ---------- LEFT: IMAGE ---------- */
.fm-media {
  position: relative;
  width: 100%;
}

.fm-media-frame {
  position: relative;
  border-radius: 30px;
  overflow: hidden;
  background: #2A2E36;
  box-shadow:
    0 40px 80px -20px rgba(0, 0, 0, .55),
    0 0 0 1px rgba(255, 255, 255, .06);
  aspect-ratio: 4 / 5;
  max-width: 520px;
  width: 100%;
}
.fm-media-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s cubic-bezier(.2, .7, .2, 1);
}
.fm-media:hover .fm-media-frame img {
  transform: scale(1.05);
}

/* response-time badge — keeps gradient pop on dark */
.fm-badge {
  position: absolute;
  top: 26px;
  right: -22px;
  z-index: 3;
  width: 116px;
  height: 116px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff;
  background: linear-gradient(135deg, var(--blue-mid), var(--blue-deep));
  border: 6px solid #1E2128;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .55);
}
.fm-badge b {
  font: 800 1.7rem/1 var(--ff-serif);
  letter-spacing: -.03em;
}
.fm-badge span {
  margin-top: 4px;
  font: 700 .58rem var(--ff-h);
  letter-spacing: .1em;
  text-transform: uppercase;
  max-width: 70px;
  line-height: 1.25;
}

/* floating chat chip — glassy dark version */
.fm-chip {
  position: absolute;
  left: -26px;
  bottom: 44px;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 20px 12px 12px;
  border-radius: 18px;
  background: rgba(255, 255, 255, .08);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: 0 20px 44px rgba(0, 0, 0, .45);
  animation: fmFloat 5s ease-in-out infinite;
}
.fm-chip i {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--green), var(--green-dark));
  font-size: 1.1rem;
  font-style: normal;
}
.fm-chip b {
  display: block;
  font: 700 .86rem/1.2 var(--ff-h);
  color: #fff;
}
.fm-chip span {
  display: block;
  font: 500 .72rem var(--ff-h);
  color: rgba(255, 255, 255, .6);
}

@keyframes fmFloat {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-10px); }
}

/* ---------- RIGHT: CONTENT ---------- */
.fm-content {
  display: flex;
  flex-direction: column;
}

.fm-content .sec-num {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font: 600 .72rem var(--ff-h);
  color: var(--mint);
  letter-spacing: .14em;
  text-transform: uppercase;
  background: rgba(61, 168, 87, .16);
  border: 1px solid rgba(61, 168, 87, .3);
  padding: 7px 14px;
  border-radius: 100px;
  align-self: flex-start;
  margin-bottom: 16px;
}
.fm-content .sec-num::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--green);
}

.fm-content .h2 {
  font-size: clamp(2rem, 3.6vw, 2.8rem);
  line-height: 1.12;
  margin-bottom: 14px;
  color: #fff;
}
.fm-content .h2 em {
  color: var(--mint);
}

.fm-lead {
  color: rgba(255, 255, 255, .65);
  font-size: 1rem;
  line-height: 1.75;
  max-width: 52ch;
  margin-bottom: 32px;
}

/* FAQ items — dark cards */
.fm-faq {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 36px;
}

.fm-item {
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 18px;
  padding: 0 24px;
  transition: border-color .25s, box-shadow .25s, background .25s;
}
.fm-item:hover {
  background: rgba(255, 255, 255, .07);
  border-color: rgba(76, 134, 224, .35);
}
.fm-item[open] {
  background: rgba(61, 168, 87, .08);
  border-color: rgba(61, 168, 87, .45);
  box-shadow: 0 14px 30px -14px rgba(61, 168, 87, .35);
}

.fm-item summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  cursor: pointer;
  list-style: none;
  font: 600 1.02rem/1.45 var(--ff-serif);
  color: #fff;
  padding: 20px 0;
  transition: color .2s;
}
.fm-item summary::-webkit-details-marker { display: none; }
.fm-item summary::marker { content: ""; }
.fm-item[open] summary { color: var(--mint); }

.fm-item summary::after {
  content: "+";
  font-size: 1.6rem;
  font-weight: 300;
  color: var(--green);
  line-height: 1;
  flex: none;
  transition: transform .3s;
}
.fm-item[open] summary::after {
  transform: rotate(45deg);
}

.fm-item p {
  padding: 16px 40px 22px 0;
  font-size: .93rem;
  color: rgba(255, 255, 255, .65);
  line-height: 1.8;
  border-top: 1px solid rgba(255, 255, 255, .1);
  margin-top: -2px;
  animation: fmFade .35s ease;
}

@keyframes fmFade {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: none; }
}

/* CTA buttons */
.fm-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.fm-cta .btn-solid,
.fm-cta .btn-ghost {
  padding: 15px 28px;
  font-size: .88rem;
}
/* ghost button on dark bg */
.fm-cta .btn-ghost {
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .25);
}
.fm-cta .btn-ghost:hover {
  background: rgba(255, 255, 255, .1);
  border-color: #fff;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1024px) {
  .fm-wrap {
    grid-template-columns: 1fr;
    gap: 60px;
  }
  .fm-media {
    max-width: 480px;
    margin: 0 auto;
    width: 100%;
  }
  .fm-badge { right: 10px; }
  .fm-chip  { left: 10px; }
}

@media (max-width: 640px) {
  .faq-media-section { padding: 80px 0 100px; }
  .fm-wrap {
    padding: 0 22px;
    gap: 44px;
  }
  .fm-media-frame {
    border-radius: 24px;
    aspect-ratio: 1 / 1;
  }
  .fm-badge {
    width: 92px;
    height: 92px;
    top: 16px;
    right: 8px;
    border-width: 5px;
  }
  .fm-badge b { font-size: 1.35rem; }
  .fm-badge span { font-size: .5rem; max-width: 58px; }

  .fm-chip {
    left: 8px;
    bottom: 20px;
    padding: 10px 14px 10px 10px;
  }
  .fm-chip i {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size: .95rem;
  }

  .fm-item {
    padding: 0 18px;
    border-radius: 16px;
  }
  .fm-item summary {
    font-size: .96rem;
    padding: 17px 0;
  }
  .fm-item p {
    padding-right: 0;
    font-size: .89rem;
  }

  .fm-cta { flex-direction: column; }
  .fm-cta .btn-solid,
  .fm-cta .btn-ghost {
    justify-content: center;
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fm-media:hover .fm-media-frame img,
  .fm-chip {
    animation: none !important;
    transform: none !important;
  }
}
/* ==========================================================
   ABOUT THE PROGRAM — redesigned
   ========================================================== */

/* --- base section --- */
.pl2.about-section {
  background: #fff;
  overflow: hidden;
  padding: 110px 0 120px;
}

/* --- TOP GRID: intro + glance --- */
.about-section .pl2-top {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 64px;
  align-items: start;
  margin-bottom: 64px;
}

.about-section .pl2-intro .sec-num {
  margin-bottom: 18px;
}

.about-section .pl2-intro .h2 {
  margin-bottom: 20px;
}

.about-section .pl2-intro .ans {
  margin: 0 0 20px;
  max-width: 100%;
}

.about-section .pl2-intro p {
  color: var(--muted);
  line-height: 1.8;
  font-size: .98rem;
  max-width: 56ch;
  margin-bottom: 0;
}

/* --- GLANCE CARD --- */
.glance.pl2-partners {
  position: relative;
  background: linear-gradient(160deg, #F4F8FD 0%, #E8EFF9 100%);
  border: 1px solid var(--line-2);
  border-radius: 28px;
  padding: 28px;
  box-shadow: var(--shadow-lg);
  overflow: hidden;
}
.glance.pl2-partners::before {
  content: "";
  position: absolute;
  top: -80px;
  right: -80px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(61, 168, 87, .18), transparent 65%);
  pointer-events: none;
}
.glance.pl2-partners::after {
  content: "";
  position: absolute;
  bottom: -100px;
  left: -60px;
  width: 240px;
  height: 240px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(31, 93, 173, .14), transparent 65%);
  pointer-events: none;
}

.glance .pl2-ptitle {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 22px;
  font: 600 .88rem var(--ff-h);
  color: var(--blue-deep);
}
.glance .pl2-ptitle span {
  font-weight: 500;
  color: var(--muted);
  font-size: .76rem;
  padding: 5px 12px;
  border-radius: 100px;
  background: rgba(255, 255, 255, .8);
  border: 1px solid var(--line);
}

.glance .pl2-logos {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  background: transparent;
  border: 0;
  border-radius: 0;
  overflow: visible;
}

.glance .pl2-logo {
  position: relative;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  height: auto;
  min-height: 108px;
  padding: 20px 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-align: center;
  transition: transform .25s, border-color .25s, box-shadow .25s;
  box-shadow: 0 2px 6px rgba(14, 46, 88, .04);
}
.glance .pl2-logo:hover {
  transform: translateY(-4px);
  border-color: var(--green);
  background: #fff;
  box-shadow: 0 14px 28px -14px rgba(61, 168, 87, .35);
}

.glance .pl2-logo b {
  font: 800 1.6rem/1 var(--ff-serif);
  color: var(--blue-deep);
  letter-spacing: -.03em;
  transition: color .25s;
}
.glance .pl2-logo:hover b {
  color: var(--green-dark);
}

.glance .pl2-logo small {
  font: 500 .72rem/1.3 var(--ff-h);
  color: var(--muted);
  letter-spacing: .01em;
}

/* --- BOTTOM GRID --- */
.about-section .ab-more {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 44px;
  align-items: start;
  margin-top: 0;
}

.ab-compare .txt {
  color: var(--muted);
  line-height: 1.8;
  font-size: .96rem;
  margin-bottom: 20px;
  max-width: 100%;
}
.ab-compare .txt b {
  color: var(--blue-deep);
}

.ab-compare .tbl-wrap {
  margin-bottom: 22px;
}

.ab-compare .btn-wrap {
  margin-top: 6px;
}

/* --- WHAT YOU WILL LEARN CARD --- */
.ab-learn {
  position: relative;
  background: linear-gradient(160deg, #0E2E58 0%, #081E3D 100%);
  border-radius: 28px;
  padding: 32px 30px 30px;
  color: #fff;
  overflow: hidden;
  box-shadow: var(--shadow-xl);
}
.ab-learn::before {
  content: "";
  position: absolute;
  top: -100px;
  right: -80px;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(61, 168, 87, .35), transparent 65%);
  pointer-events: none;
}
.ab-learn::after {
  content: "";
  position: absolute;
  bottom: -120px;
  left: -80px;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(42, 111, 196, .35), transparent 65%);
  pointer-events: none;
}

.ab-learn-head {
  position: relative;
  margin-bottom: 20px;
}

.ab-learn-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font: 700 .68rem var(--ff-h);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--mint);
  background: rgba(61, 168, 87, .16);
  border: 1px solid rgba(61, 168, 87, .3);
  padding: 6px 14px;
  border-radius: 100px;
  margin-bottom: 12px;
}
.ab-learn-chip::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--green);
}

.ab-learn .sub-h {
  position: relative;
  font-size: 1.4rem;
  color: #fff;
  margin: 0;
  letter-spacing: -.02em;
}

.ab-learn .cd-list {
  position: relative;
  list-style: none;
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  padding-top: 0;
  margin: 0;
}
.ab-learn .cd-list li {
  position: relative;
  padding: 12px 16px 12px 46px;
  border-radius: 14px;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .1);
  font-size: .92rem;
  color: rgba(255, 255, 255, .9);
  line-height: 1.5;
  transition: background .25s, border-color .25s, transform .25s;
}
.ab-learn .cd-list li::before {
  content: "✓";
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--green), var(--green-dark));
  color: #fff;
  font-size: .68rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 12px rgba(61, 168, 87, .35);
}
.ab-learn .cd-list li:hover {
  background: rgba(255, 255, 255, .1);
  border-color: rgba(107, 201, 126, .5);
  transform: translateX(4px);
}

/* --- TABLE (light, cleaner) --- */
.seo-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: .92rem;
  min-width: 420px;
  overflow: hidden;
  border-radius: 16px;
}
.seo-table thead th {
  background: linear-gradient(135deg, var(--blue-deep), var(--blue));
  color: #fff;
  font: 600 .78rem var(--ff-h);
  letter-spacing: .05em;
  text-transform: uppercase;
  padding: 14px 20px;
  text-align: left;
}
.seo-table tbody td {
  padding: 16px 20px;
  border-bottom: 1px solid var(--line);
  background: #fff;
  color: var(--ink-2);
  line-height: 1.55;
}
.seo-table tbody tr:last-child td {
  border-bottom: 0;
}
.seo-table tbody td:first-child {
  font-weight: 600;
  color: var(--blue-deep);
  width: 38%;
  background: #F9FBFE;
}
.seo-table tbody tr:hover td {
  background: var(--blue-tint);
}
.seo-table tbody tr:hover td:first-child {
  background: var(--blue-soft);
}

/* --- RESPONSIVE --- */
@media (max-width: 1000px) {
  .about-section .pl2-top {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .about-section .ab-more {
    grid-template-columns: 1fr;
    gap: 36px;
  }
}

@media (max-width: 640px) {
  .pl2.about-section {
    padding: 80px 0 100px;
  }
  .glance .pl2-logos {
    grid-template-columns: repeat(2, 1fr);
  }
  .glance .pl2-logo {
    min-height: 96px;
    padding: 16px 10px;
  }
  .glance .pl2-logo b {
    font-size: 1.35rem;
  }
  .ab-learn {
    padding: 26px 22px 22px;
    border-radius: 24px;
  }
  .ab-learn .sub-h {
    font-size: 1.2rem;
  }
  .seo-table thead th,
  .seo-table tbody td {
    padding: 12px 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .glance .pl2-logo:hover,
  .ab-learn .cd-list li:hover {
    transform: none;
  }
}
/* ==========================================================
   DIGIPANDA REDESIGN: append to the END of styles.css
   Stronger green · warm cream · ethnic temple-border · photos
   Images: Unsplash. Each has a gradient fallback if it fails.
   ========================================================== */
:root{
  --green:#22A04B;--green-dark:#15803D;--green-soft:#DDF3E4;--green-tint:#EAF7EE;
  --gold:#8DB8EA;--maroon:#1F5DAD;--cream:#F3F8FE;--cream-2:#E6F0FB;
  --img-about:url("https://images.unsplash.com/photo-1522202176988-66273c2fd55f?auto=format&fit=crop&w=900&q=70");
  --img-grad:url("https://images.unsplash.com/photo-1523240795612-9a054b0db644?auto=format&fit=crop&w=800&q=70");
  --img-biz:url("https://images.unsplash.com/photo-1556761175-5973dc0f32e7?auto=format&fit=crop&w=800&q=70");
  --img-restart:url("https://images.unsplash.com/photo-1573496359142-b8d87734a5a2?auto=format&fit=crop&w=800&q=70");
  --img-seo:url("https://images.unsplash.com/photo-1460925895917-afdab827c52f?auto=format&fit=crop&w=800&q=70");
  --img-ads:url("https://images.unsplash.com/photo-1551288049-bebda4e38f71?auto=format&fit=crop&w=800&q=70");
  --img-social:url("https://images.unsplash.com/photo-1611926653458-09294b3142bf?auto=format&fit=crop&w=800&q=70");
  --img-content:url("https://images.unsplash.com/photo-1542744173-8e7e53415bb0?auto=format&fit=crop&w=800&q=70");
  --img-team:url("https://images.unsplash.com/photo-1552664730-d307ca884978?auto=format&fit=crop&w=800&q=70");
  --img-web:url("https://images.unsplash.com/photo-1547658719-da2b51169166?auto=format&fit=crop&w=800&q=70");
  /* temple-border strip (gold / maroon / green diamonds) */
  --border-ethnic:
    linear-gradient(45deg,transparent 40%,var(--gold) 40% 60%,transparent 60%) 0 0/14px 14px,
    linear-gradient(-45deg,transparent 40%,var(--gold) 40% 60%,transparent 60%) 0 0/14px 14px,
    linear-gradient(90deg,var(--maroon),var(--green-dark),var(--maroon));
}

/* ---------- headings: green gradient emphasis ---------- */
.sec-head h2 em,.h2 em,.team-cloud-inner h2 em{
  background:linear-gradient(90deg,var(--green-dark),#5CC77A);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.sec-num{background:var(--green-soft);color:var(--green-dark);border:1px solid rgba(34,160,75,.3)}
.btn-solid{background:linear-gradient(135deg,var(--green),var(--green-dark));box-shadow:0 12px 28px rgba(34,160,75,.38)}
.ans{border-left:5px solid var(--green);background:linear-gradient(90deg,var(--green-tint),#fff 40%)}


/* ---------- ABOUT ---------- */
.pl2.about-section{background:
  radial-gradient(rgba(31,93,173,.14) 1.4px,transparent 1.6px) 0 0/26px 26px,var(--cream)}
.about-section .pl2-partners.glance{padding-top:230px;background:#fff;border:2px solid var(--gold)}
.about-section .pl2-partners.glance::before{
  content:"";position:absolute;inset:0 0 auto 0;top:0;right:0;width:auto;height:200px;border-radius:0;
  background:linear-gradient(180deg,rgba(8,30,61,.05),rgba(8,30,61,.55)),var(--img-about) center/cover,linear-gradient(135deg,var(--green),var(--blue-deep))}
.about-section .pl2-partners.glance::after{display:none}
.glance .pl2-logo b{color:var(--green-dark)}
.glance .pl2-logo{border-top:3px solid var(--gold)}
.ab-learn{background:linear-gradient(160deg,#0F5132 0%,#0A3622 100%);border:2px solid var(--gold)}
.ab-learn .cd-list li::before{background:linear-gradient(135deg,#6BC97E,#15803D)}
.seo-table thead th{background:linear-gradient(135deg,var(--green-dark),var(--green))}
.seo-table tbody td:first-child{background:var(--cream)}

/* ---------- WHO CAN JOIN: photo cards ---------- */
.who-section{background:linear-gradient(180deg,var(--cream-2),var(--cream));padding-top:120px}
.wj-card{position:relative;overflow:hidden;padding:200px 26px 30px;border-top:0;border:1px solid rgba(31,93,173,.45);transition:.35s}
.wj-card::before{content:"";position:absolute;inset:0 0 auto 0;height:172px;
  background:linear-gradient(180deg,transparent 40%,rgba(8,30,61,.45)),var(--bg) center/cover,linear-gradient(135deg,var(--green),var(--blue-deep))}
.wj-card:nth-child(1){--bg:var(--img-grad)}.wj-card:nth-child(2){--bg:var(--img-biz)}.wj-card:nth-child(3){--bg:var(--img-restart)}
.wj-card:hover{transform:translateY(-8px);box-shadow:0 26px 50px rgba(21,128,61,.22)}
.wj-card h3{color:var(--green-dark)}

/* ---------- TOOLS ---------- */
.team-cloud-section{background:
  radial-gradient(rgba(34,160,75,.14) 1.4px,transparent 1.6px) 0 0/24px 24px,var(--green-tint);padding-top:150px}
.team-cloud-icon{border:2px solid rgba(31,93,173,.55)}

/* ---------- LIVE PROJECTS ---------- */
.course-tile{border:1px solid rgba(31,93,173,.4)}
.course-tile::before{height:8px}

/* ---------- CAREER PATHS: photo header per role ---------- */
.process-section{background:linear-gradient(180deg,var(--cream),var(--cream-2));padding-top:120px}
.cp-card{position:relative;overflow:hidden;padding-top:128px;border-top:0;border:1px solid rgba(31,93,173,.45);transition:.3s}
.cp-card::before{content:"";position:absolute;inset:0 0 auto 0;height:106px;
  background:linear-gradient(180deg,transparent 30%,rgba(8,30,61,.5)),var(--bg) center/cover,linear-gradient(135deg,var(--c),var(--blue-deep))}
.cp-card::after{content:"";position:absolute;top:106px;left:0;right:0;height:5px;background:var(--c)}
.cp-card:nth-child(1){--bg:var(--img-seo)}.cp-card:nth-child(2){--bg:var(--img-ads)}
.cp-card:nth-child(3){--bg:var(--img-social)}.cp-card:nth-child(4){--bg:var(--img-content)}
.cp-card:nth-child(5){--bg:var(--img-team)}
.cp-card:hover{transform:translateY(-8px);box-shadow:0 22px 44px rgba(21,128,61,.2)}

/* ---------- PLACEMENT ---------- */
.pl2-dot{border-color:var(--green);color:var(--green-dark)}
.pl2-steps::before{border-top:2px dashed var(--gold)}
.pl2-steps.s5 .pl2-step:last-child .pl2-dot{background:var(--green);color:#fff}

/* ---------- PORTFOLIO: photo headers ---------- */
.awards-section{background:
  radial-gradient(rgba(31,93,173,.16) 1.4px,transparent 1.6px) 0 0/26px 26px,var(--cream);padding-top:120px}
.pf-card{border:1px solid rgba(31,93,173,.5)}
.pf-card header{min-height:150px;display:flex;align-items:flex-end;  background:linear-gradient(180deg,rgba(8,30,61,.15),rgba(10,54,34,.88)),var(--bg) center/cover,linear-gradient(135deg,var(--green-dark),var(--blue-deep))}
.pf-card:nth-child(1) header{--bg:var(--img-web)}.pf-card:nth-child(2) header{--bg:var(--img-social)}
.pf-card:nth-child(3) header{--bg:var(--img-ads)}.pf-card:nth-child(4) header{--bg:var(--img-seo)}
.pf-card:nth-child(n) header{background:linear-gradient(180deg,rgba(8,30,61,.15),rgba(10,54,34,.88)),var(--bg) center/cover,linear-gradient(135deg,var(--green-dark),var(--blue-deep))}
.pf-card .bd p.show{background:var(--green-tint);border-left:4px solid var(--green)}

/* ---------- COURSE DETAILS / LOCATION ---------- */
.cd-glance{background:linear-gradient(145deg,#0A3622,#15803D 140%);border:2px solid var(--gold)}
.faq-item[open] summary{color:var(--green-dark)}
.testi-section{background:linear-gradient(180deg,var(--cream),#fff)}
.lc-card{border:1px solid rgba(31,93,173,.5)}
.visit{background:var(--green-tint);border:2px dashed var(--green)}

/* ---------- mobile ---------- */
@media(max-width:640px){
  .about-section .pl2-partners.glance{padding-top:200px}
  .about-section .pl2-partners.glance::before{height:170px}
  .pf-card header{min-height:120px}
}
/* ==========================================================
   ABOUT PAGE: link AFTER styles.css (needs the --img-* vars
   from the redesign block at the end of styles.css)
   ========================================================== */
:root{--img-ai:url("https://images.unsplash.com/photo-1677442136019-21780ecad995?auto=format&fit=crop&w=800&q=70")}
.ab2 section{padding:96px 0}
.ab2-sec-head{max-width:760px;margin-bottom:48px}
.ab2-sec-head.center{margin-left:auto;margin-right:auto;text-align:center}
.ab2-sec-head h2{font-size:clamp(1.8rem,3.4vw,2.6rem);line-height:1.15;margin-bottom:12px}
.ab2-sec-head h2 em{background:linear-gradient(90deg,var(--green-dark),#5CC77A);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.ab2-sec-head p{color:var(--muted);line-height:1.75}

/* HERO */
.ab2 section.ab2-hero{padding:210px 0 90px;background:radial-gradient(600px 400px at 90% 10%,rgba(34,160,75,.14),transparent 70%),linear-gradient(180deg,#E6F0FB,#fff)}
.ab2-hero-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}
.ab2-eyebrow{display:inline-flex;align-items:center;gap:8px;margin-bottom:16px;padding:7px 14px;border-radius:100px;background:var(--green-soft);border:1px solid rgba(34,160,75,.3);color:var(--green-dark);font:700 .72rem var(--ff-h);letter-spacing:.14em;text-transform:uppercase}
.ab2-eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green)}
.ab2-hero h1{font-size:clamp(1.7rem,3vw,2.3rem);line-height:1.2;margin-bottom:14px}
.ab2-display{font:800 clamp(2.2rem,4.4vw,3.5rem)/1.06 var(--ff-serif);letter-spacing:-.035em;color:var(--blue-deep);margin-bottom:18px}
.ab2-display em{background:linear-gradient(90deg,var(--green-dark),#5CC77A);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.ab2-hero>.wrap p.ab2-lead,.ab2-lead{color:var(--muted);line-height:1.8;max-width:56ch;margin-bottom:18px}
.ab2-hero .ans{max-width:56ch}
.ab2-photo{position:relative;min-height:520px;border-radius:32px;overflow:hidden;box-shadow:var(--shadow-xl);
  background:linear-gradient(180deg,rgba(8,30,61,.05) 30%,rgba(8,30,61,.7)),var(--img-about) center/cover,linear-gradient(135deg,var(--green),var(--blue-deep))}
.ab2-stats{position:absolute;left:16px;right:16px;bottom:16px;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ab2-stat{padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.92);box-shadow:0 8px 20px rgba(8,30,61,.2)}
.ab2-stat b{display:block;font:800 1.5rem/1 var(--ff-serif);color:var(--green-dark);letter-spacing:-.03em}
.ab2-stat span{display:block;margin-top:4px;font:600 .72rem var(--ff-h);color:var(--muted)}

/* PROMISE */
.ab2-promise{background:linear-gradient(180deg,var(--cream),#fff)}
.ab2-grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.ab2-card{position:relative;padding:28px 22px 24px;border-radius:22px;background:#fff;border:1px solid rgba(31,93,173,.18);border-top:5px solid var(--green);box-shadow:var(--shadow-md);transition:.3s}
.ab2-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.ab2-card .n{display:grid;place-items:center;width:42px;height:42px;margin-bottom:14px;border-radius:50%;background:linear-gradient(135deg,var(--green),var(--green-dark));color:#fff;font:800 1rem var(--ff-serif)}
.ab2-card h3{font-size:1.05rem;margin-bottom:8px}
.ab2-card p{font-size:.9rem;color:var(--muted);line-height:1.7}
.ab2-not{margin-top:28px;padding:22px 26px;border-radius:20px;background:var(--cream-2);border:1px dashed var(--blue);color:var(--ink-2);line-height:1.75}
.ab2-not b{color:var(--blue-deep)}

/* JOURNEY */
.ab2-journey{background:var(--cream)}
.ab2-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:m}
.ab2-step{position:relative;overflow:hidden;background:#fff;border-radius:24px;border:1px solid rgba(31,93,173,.18);box-shadow:var(--shadow-md)}
.ab2-step .ph{height:130px;background:linear-gradient(180deg,transparent 30%,rgba(8,30,61,.6)),var(--bg) center/cover,linear-gradient(135deg,var(--green),var(--blue-deep))}
.ab2-step:nth-child(1){--bg:var(--img-web)}.ab2-step:nth-child(2){--bg:var(--img-social)}.ab2-step:nth-child(3){--bg:var(--img-ads)}.ab2-step:nth-child(4){--bg:var(--img-seo)}
.ab2-step .bd{padding:22px 22px 26px}
.ab2-step .mo{display:inline-block;margin-bottom:10px;padding:5px 12px;border-radius:100px;background:var(--green-soft);color:var(--green-dark);font:700 .7rem var(--ff-h);letter-spacing:.12em;text-transform:uppercase}
.ab2-step p{font-size:.92rem;color:var(--ink-2);line-height:1.7}

/* TRY BEFORE YOU JOIN */
.ab2-try{background:linear-gradient(160deg,#081E3D 0%,#0E2E58 60%,#1F5DAD 140%);color:#fff;overflow:hidden}
.ab2-try::before{content:"";position:absolute;inset:0;background:radial-gradient(rgba(255,255,255,.08) 1.2px,transparent 1.4px) 0 0/26px 26px;pointer-events:none}
.ab2-try .wrap{position:relative}
.ab2-try h2{color:#fff}.ab2-try .ab2-sec-head p{color:rgba(255,255,255,.75)}
.ab2-try .ab2-sec-head h2 em{background:none;-webkit-text-fill-color:#A8E6BA;color:#A8E6BA}
.ab2-try-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:28px}
.ab2-try-card{padding:26px 24px;border-radius:22px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(6px)}
.ab2-try-card h3{color:#fff;font-size:1.1rem;margin-bottom:8px}
.ab2-try-card p{color:rgba(255,255,255,.78);font-size:.92rem;line-height:1.7}
.ab2-try .note{margin-bottom:24px;color:rgba(255,255,255,.88)}
.ab2-try .btn-solid{background:#fff;color:var(--blue-deep);box-shadow:0 12px 28px rgba(0,0,0,.25)}

/* MENTORS */
.ab2-mentors{background:#fff}
.ab2-mentor{overflow:hidden;padding:0}
.ab2-mentor .ph{height:150px;background:linear-gradient(180deg,transparent 30%,rgba(8,30,61,.55)),var(--bg) center/cover,linear-gradient(135deg,var(--green),var(--blue-deep))}
.ab2-mentor:nth-child(1) .ph{--bg:var(--img-seo)}.ab2-mentor:nth-child(2) .ph{--bg:var(--img-ads)}
.ab2-mentor:nth-child(3) .ph{--bg:var(--img-social)}.ab2-mentor:nth-child(4) .ph{--bg:var(--img-ai)}
.ab2-mentor .bd{padding:22px}

/* FIT */
.ab2-fit{background:linear-gradient(180deg,var(--cream),var(--cream-2))}
.ab2-fit-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.ab2-fit-card{padding:32px 30px;border-radius:26px;background:#fff;box-shadow:var(--shadow-lg);border:1px solid rgba(31,93,173,.18)}
.ab2-fit-card.yes{border-top:6px solid var(--green)}
.ab2-fit-card.no{border-top:6px solid #8995A8}
.ab2-fit-card h3{font-size:1.2rem;margin-bottom:12px}
.ab2-fit-card p{color:var(--ink-2);line-height:1.8}
.ab2-fit-card ul{list-style:none;display:grid;gap:10px}
.ab2-fit-card li{position:relative;padding-left:30px;color:var(--ink-2);line-height:1.6}
.ab2-fit-card li::before{position:absolute;left:0;top:0;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font:800 .72rem var(--ff-h)}
.ab2-fit-card.yes li::before{content:"✓";background:var(--green-soft);color:var(--green-dark)}
.ab2-fit-card.no li::before{content:"–";background:#EDF0F5;color:#5E6D80}
.ab2-fit .btn-wrap{text-align:center;margin-top:32px}

/* CLASS FLOW */
.ab2-class{background:#fff}
.ab2-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;position:relative}
.ab2-flow::before{content:"";position:absolute;left:12%;right:12%;top:34px;border-top:2px dashed var(--green)}
.ab2-flow>div{position:relative;text-align:center}
.ab2-flow .dot{position:relative;z-index:1;display:grid;place-items:center;width:68px;height:68px;margin:0 auto 16px;border-radius:50%;background:linear-gradient(135deg,var(--green),var(--green-dark));color:#fff;font:800 1.3rem var(--ff-serif);box-shadow:0 0 0 8px #fff,0 12px 24px rgba(34,160,75,.35)}
.ab2-flow h3{font-size:1.1rem;margin-bottom:6px}
.ab2-flow p{font-size:.9rem;color:var(--muted);line-height:1.7;max-width:26ch;margin:0 auto}

/* CTA */
.ab2 section.ab2-cta{padding:70px 0;background:var(--cream)}

@media(max-width:1060px){.ab2 section.ab2-hero{padding:100px 0 70px}}
@media(max-width:1100px){.ab2-grid4,.ab2-steps{grid-template-columns:1fr 1fr}.ab2-hero-grid{grid-template-columns:1fr}.ab2-photo{min-height:440px}}
@media(max-width:800px){.ab2-try-grid,.ab2-fit-grid{grid-template-columns:1fr}.ab2-flow{grid-template-columns:1fr 1fr;row-gap:36px}.ab2-flow::before{display:none}}
@media(max-width:560px){.ab2 section{padding:72px 0}.ab2-grid4,.ab2-steps,.ab2-flow{grid-template-columns:1fr}.ab2 section.ab2-hero{padding:90px 0 60px}.ab2-photo{min-height:400px}}

/* ================= ARC CAROUSEL (promise) ================= */
.ab2-promise{background:radial-gradient(700px 360px at 12% 20%,rgba(34,160,75,.12),transparent 70%),radial-gradient(700px 400px at 90% 70%,rgba(31,93,173,.14),transparent 70%),linear-gradient(180deg,var(--cream),#fff);overflow:hidden}
.arc{--dx:236px;position:relative;max-width:1180px;margin:0 auto}
.arc-stage{position:relative;height:430px;margin-top:10px}
.arc-card{position:absolute;left:50%;top:40px;width:260px;min-height:300px;margin-left:-130px;padding:26px 24px 24px;border-radius:26px;cursor:pointer;
  background:var(--bg,#fff);border:1px solid rgba(255,255,255,.7);box-shadow:0 22px 44px rgba(14,46,88,.16);
  transform:translateX(calc(var(--o,0)*var(--dx))) translateY(calc(var(--o,0)*var(--o,0)*20px)) rotate(calc(var(--o,0)*11deg)) scale(var(--s,1));
  transition:transform .7s cubic-bezier(.2,.7,.2,1),box-shadow .4s,opacity .5s;opacity:.92;text-align:center}
.arc-card.on{opacity:1;box-shadow:0 30px 60px rgba(14,46,88,.26)}
.arc-card.c1{--bg:linear-gradient(160deg,#FFF6D6,#F7E6A8)}
.arc-card.c2{--bg:linear-gradient(160deg,#CFE3EC,#9DB8CC)}
.arc-card.c3{--bg:linear-gradient(160deg,#EADFFB,#B9B6E6)}
.arc-card.c4{--bg:linear-gradient(160deg,#D8F1DF,#A6D8B5)}
.arc-card.c5{--bg:linear-gradient(160deg,#FBE0E8,#E9B7C9)}
.arc-ic{display:grid;place-items:center;width:46px;height:46px;margin:0 auto 14px;border-radius:50%;background:#fff;color:var(--blue-deep);font:800 1.1rem var(--ff-serif);box-shadow:0 8px 16px rgba(14,46,88,.16)}
.arc-card h3{font-size:1.05rem;line-height:1.3;margin-bottom:10px;color:#0E2E58}
.arc-card p{font-size:.88rem;line-height:1.65;color:#2a3a50}
.arc-ctrl{display:flex;justify-content:center;gap:12px;margin-top:6px}
.arc-btn{width:50px;height:50px;border-radius:50%;border:1px solid var(--line-2);background:#fff;color:var(--blue-deep);font-size:1.1rem;font-weight:700;cursor:pointer;box-shadow:var(--shadow-md);transition:.25s}
.arc-btn:hover{background:var(--green);border-color:var(--green);color:#fff}

/* ================= TEAM-STYLE CARDS (mentors) ================= */
.ab2-mentors{background:linear-gradient(180deg,#fff,var(--cream))}
.tm-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:44px 30px;padding-top:44px}
.tm{position:relative;--c:var(--blue)}
.tm.t1{--c:#1F5DAD}.tm.t2{--c:#22A04B}.tm.t3{--c:#7B5CF0}.tm.t4{--c:#14B8A6}
.tm::before{content:"";position:absolute;inset:18px -10px -14px 10px;border-radius:26px;background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 55%,#fff));transform:rotate(-6deg);transition:transform .4s}
.tm:nth-child(even)::before{transform:rotate(6deg)}
.tm:hover::before{transform:rotate(0)}
.tm-card{position:relative;padding:58px 22px 28px;border-radius:24px;background:#fff;text-align:center;box-shadow:0 22px 44px rgba(14,46,88,.18);transition:transform .4s}
.tm:hover .tm-card{transform:translateY(-6px)}
.tm-av{position:absolute;left:50%;top:-40px;width:80px;height:80px;margin-left:-40px;border-radius:50%;border:4px solid #fff;box-shadow:0 10px 22px rgba(14,46,88,.22);background:var(--bg) center/cover,linear-gradient(135deg,var(--c),var(--blue-deep))}
.tm-av.p-seo{--bg:var(--img-seo)}.tm-av.p-ads{--bg:var(--img-ads)}.tm-av.p-soc{--bg:var(--img-social)}.tm-av.p-ai{--bg:var(--img-ai)}
.tm-card h3{font-size:1.05rem;line-height:1.3;margin-bottom:4px}
.tm-card em{display:block;margin-bottom:12px;font:italic 600 .84rem var(--ff-h);color:var(--c)}
.tm-card p{font-size:.88rem;line-height:1.7;color:var(--muted)}

@media(max-width:1100px){.tm-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.arc{--dx:150px}.arc-card{width:220px;margin-left:-110px;min-height:290px}.arc-stage{height:410px}}
@media(max-width:560px){.tm-grid{grid-template-columns:1fr}.arc{--dx:120px}}
@media(prefers-reduced-motion:reduce){.arc-card{transition:none}}

/* ================= CLASS FLOW: diamond zig-zag ================= */
.ab2-class{background:linear-gradient(180deg,#fff,var(--cream));overflow:hidden}
.df{display:flex;justify-content:center;align-items:center;max-width:1100px;height:520px;margin:20px auto 0;padding:0 20px}
.df-item{position:relative;flex:none;width:270px;height:270px;margin-left:-52px;transition:transform .4s}
.df-item:first-child{margin-left:0}
.df-item:nth-child(odd){transform:translateY(-78px)}
.df-item:nth-child(even){transform:translateY(78px)}
.df-item:hover{transform:translateY(-6px) scale(1.04);z-index:3}
.df-item:nth-child(even):hover{transform:translateY(72px) scale(1.04)}
.df-shape{position:absolute;inset:34px;border:2.5px solid var(--blue-deep);border-radius:40px;background:#fff;transform:rotate(45deg);box-shadow:0 18px 36px rgba(14,46,88,.14);transition:border-color .3s,box-shadow .3s}
.df-item:hover .df-shape{border-color:var(--green);box-shadow:0 24px 44px rgba(34,160,75,.25)}
.df-item:nth-child(even) .df-shape{background:var(--green-tint)}
.df-body{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 54px 0 56px}
.df-n{flex:none;font:800 3.4rem/1 var(--ff-serif);letter-spacing:-.04em;background:linear-gradient(180deg,#5CC77A,var(--green-dark));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.df-tx{min-width:0}
.df-i{display:block;width:22px;height:22px;margin-bottom:4px;fill:none;stroke:var(--blue-deep);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.df-tx h3{font:700 .8rem var(--ff-h);letter-spacing:.12em;text-transform:uppercase;color:var(--blue-deep);margin-bottom:3px}
.df-tx p{font-size:.7rem;line-height:1.45;color:var(--muted)}

@media(max-width:1000px){
  .df{flex-wrap:wrap;height:auto;gap:18px;padding:0}
  .df-item,.df-item:nth-child(odd),.df-item:nth-child(even),.df-item:hover,.df-item:nth-child(even):hover{transform:none;width:calc(50% - 9px);height:auto;margin:0}
  .df-shape{inset:0;transform:none;border-radius:24px}
  .df-body{position:relative;padding:24px 22px;justify-content:flex-start;gap:14px}
  .df-n{font-size:2.6rem}.df-tx h3{font-size:.86rem}.df-tx p{font-size:.84rem}
}
@media(max-width:560px){.df-item,.df-item:nth-child(odd),.df-item:nth-child(even){width:100%}}

/* ===== SEPARATE: "How a class works" (light) vs CTA (dark band) ===== */
.ab2 section.ab2-class{background:
  radial-gradient(rgba(31,93,173,.10) 1.4px,transparent 1.6px) 0 0/26px 26px,#fff;padding-bottom:110px}

.ab2 section.ab2-cta{position:relative;overflow:hidden;padding:120px 0 90px;text-align:center;
  background:radial-gradient(520px 320px at 85% 20%,rgba(34,160,75,.35),transparent 70%),
             radial-gradient(520px 360px at 5% 90%,rgba(42,111,196,.45),transparent 70%),
             linear-gradient(160deg,#081E3D 0%,#0E2E58 60%,#1F5DAD 140%)}
.ab2-cta::before{content:"";position:absolute;top:-1px;left:-6%;right:-6%;height:64px;background:#fff;border-radius:0 0 50% 50%/0 0 100% 100%;z-index:1}
.ab2-cta::after{content:"";position:absolute;inset:0;background:radial-gradient(rgba(255,255,255,.07) 1.2px,transparent 1.4px) 0 0/26px 26px;pointer-events:none}
.ab2-cta .wrap{position:relative;z-index:2}
.ab2-cta .cc{background:none;box-shadow:none;border-radius:0;padding:0;flex-direction:column;justify-content:center;gap:28px;max-width:760px;margin:0 auto}
.ab2-cta .cc h2{max-width:none;margin:0 auto 12px;font-size:clamp(1.9rem,3.6vw,2.7rem);color:#fff}
.ab2-cta .cc h2 em{color:#8EE0A6}
.ab2-cta .cc p{max-width:54ch;margin:0 auto;color:rgba(255,255,255,.8)}
.ab2-cta .btn-row{justify-content:center}
.ab2-cta .btn-solid{background:linear-gradient(135deg,#2FB85A,#15803D);box-shadow:0 14px 34px rgba(34,160,75,.5)}
.ab2-cta .btn-ghost-light{border-color:rgba(255,255,255,.45)}
@media(max-width:560px){.ab2 section.ab2-cta{padding:100px 0 70px}}

/* ===== tighter spacing: How a class works ===== */
.ab2 section.ab2-class{padding:70px 0 70px}
.ab2-class .ab2-sec-head{margin-bottom:0}
.ab2-class .df{height:400px;margin:0 auto}
.ab2-class .df-item:nth-child(odd){transform:translateY(-62px)}
.ab2-class .df-item:nth-child(even){transform:translateY(62px)}
.ab2-class .df-item:hover{transform:translateY(-68px) scale(1.04)}
.ab2-class .df-item:nth-child(even):hover{transform:translateY(56px) scale(1.04)}
.ab2 section.ab2-cta{padding-top:100px}
@media(max-width:1000px){
  .ab2-class .df{height:auto;margin-top:28px}
  .ab2-class .df-item,.ab2-class .df-item:nth-child(odd),.ab2-class .df-item:nth-child(even),.ab2-class .df-item:hover,.ab2-class .df-item:nth-child(even):hover{transform:none}
}
/* ===== MOBILE / TABLET BOTTOM NAV FIX ===== */
@media (max-width:1060px){

  /* hide the logo in the bottom bar (beats the .nb .nb-logo override) */
  .nb .nb-logo,
  .nb .nb-logo img{ display:none !important; }

  /* menu uses the full bar width, items spread evenly */
  .nb-menu{ width:100%; margin:0; justify-content:space-around; gap:0; }
  .nb-item{ flex:1; position:static; }
  .nb-link{ min-width:0; width:100%; }

  /* lift the chat button above the tab bar so it can't cover Contact */
  .sd{ bottom:calc(100px + env(safe-area-inset-bottom,0px)) !important; }

  /* Courses dropdown becomes a sheet above the tab bar */
  .nb-dd-wrap{
    display:block !important;
    position:absolute;
    left:0; right:0;
    bottom:calc(100% + 12px);
    top:auto;
    padding:0;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(12px);
    transition:opacity .22s, transform .22s, visibility .22s;
    z-index:95;
  }
  #nbServices.m-open .nb-dd-wrap{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
  }
  .nb-dd{
    width:100%;
    grid-template-columns:1fr;
    max-height:60vh;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }
  .nb-dd::before{ display:none; }
}
/* ==========================================================
   DIGIPANDA: MOBILE + TABLET FIXES
   Paste at the VERY END of styles.css (after the arc/tab-bar block).
   Also move the inline <style> speed-dial block into styles.css
   (section 7 below) and delete it from every HTML page.
   ========================================================== */

/* ---------- 1. GLOBAL SAFETY ---------- */
html{overflow-x:hidden}
img,svg,video,iframe{max-width:100%}
input,select,textarea,button{font-family:inherit}

/* Desktop navbar logo.
   Digipanda.png has a lot of transparent space around the artwork, so the
   image has to be rendered tall (226px) for the visible logo to look normal
   inside the 76px bar. (Do NOT shrink this to 48px: the logo becomes tiny.)
   Better long-term fix: crop the transparent padding out of the PNG, then
   use height:44px here. */
.nb .nb-logo img{height:226px;width:auto;max-width:none;margin:0;transform:none}

/* Empty <em> in the hero h1 added a blank line */
.hx h1 .l2:has(> em:empty){display:none}

/* ---------- 2. TABLET + PHONE (<= 1060px): bottom tab bar ---------- */
@media (max-width:1060px){

  html{scroll-padding-top:16px}

  /* body padding + footer padding were stacking = white gap under footer */
  body{padding-bottom:0}
  .ft{padding-bottom:96px}

  .nb{height:68px}
  .nb-link{font-size:.68rem;padding:0 2px 10px}
  .nb-link.active .nb-ico{top:-26px;width:54px;height:54px;margin-left:-27px}
  .nb-link.active .nb-i{width:26px;height:26px}

  /* ---- Courses sheet: desktop hover/focus rules were beating the
          mobile rule (opened on tap, shifted off-screen with
          translateX(-50%), and never closed). Force them off,
          then open ONLY with .m-open ---- */
  #nbServices:hover .nb-dd-wrap,
  #nbServices:focus-within .nb-dd-wrap,
  #nbServices.open .nb-dd-wrap{
    opacity:0;visibility:hidden;pointer-events:none;transform:translateY(12px)
  }
  #nbServices.m-open .nb-dd-wrap,
  #nbServices.m-open:hover .nb-dd-wrap,
  #nbServices.m-open:focus-within .nb-dd-wrap{
    opacity:1;visibility:visible;pointer-events:auto;transform:none
  }
  .nb-dd{max-height:calc(100dvh - 170px);border-radius:20px}
  .nb-dd a{padding:11px 10px}

  /* speed dial sits above the tab bar */
  .sd{bottom:calc(92px + env(safe-area-inset-bottom,0px)) !important;right:14px}

  /* glass blur is expensive on phones */
  .hx-ann,.hx-fl,.hx-stat,.hx-tile,.hx-chip,.fm-chip,.ab2-try-card,.article-cat{
    -webkit-backdrop-filter:none;backdrop-filter:none
  }
}

/* ---------- 3. HERO (<= 1000px) ---------- */
@media (max-width:1000px){
  .hx-card{padding:96px 18px 40px;gap:30px}
  .hx-ann{top:22px;left:18px;max-width:calc(100% - 36px)}
  .hx-art{margin-bottom:10px}
  .hx-badge{left:-8px}
  .hx-chip{right:-6px}

  /* contact bar: was absolute and overlapped the tiles */
  .hx-bar{
    position:relative;right:auto;bottom:auto;grid-column:1/-1;
    margin:0;justify-content:center;flex-wrap:wrap;gap:10px 22px;
    padding:14px 18px;border-radius:16px
  }
  .hx-tiles{margin:0}
}

/* ---------- 4. PHONE (<= 640px) ---------- */
@media (max-width:640px){

  /* iOS zooms into inputs under 16px */
  .lp-form input,.lp-form select,
  .cx-f input,.cx-f select,.cx-f textarea,
  .form-group input,.form-group select,
  .newsletter-form input{font-size:16px}

  section{padding:64px 0}
  .wrap{padding:0 18px}
  .sec-head{margin-bottom:36px}
  .h2,.sec-head h2{font-size:1.7rem}

  /* hero */
  .hx-card{padding:80px 16px 32px}
  .hx h1 .l1{font-size:2rem}
  .hx-box{font-size:.95rem;padding:5px 14px}
  .hx-desc{max-width:none;font-size:.92rem}
  .hx-circ::before{inset:-12px}
  .hx-tagline{font-size:.98rem}
  .hx-stat .n{font-size:1.15rem}
  .hx-bar{font-size:.78rem}

  /* highlight strip */
  .hl-item{padding:16px 0 16px 20px;font-size:.8rem}
  .hl-item::after{margin-left:20px}

  /* enroll */
  .enroll-section{padding:80px 0 90px}
  .enroll-wrap{padding:0 18px;gap:32px}
  .enroll-card{padding:26px 18px;border-radius:22px}
  .enroll-card::after{display:none}
  .enroll-feature{padding:14px}
  .enroll-feature:hover{transform:none}
  .form-grid{gap:14px}

  /* FAQ with image */
  .faq-media-section{padding:64px 0 80px}
  .fm-wrap{padding:0 18px}
  .fm-badge{right:6px;top:12px}
  .fm-chip{left:6px}
  .fm-media-frame{aspect-ratio:4/4}

  /* about / glance / tables */
  .pl2.about-section{padding:64px 0 72px}
  .about-section .pl2-top{margin-bottom:40px}
  .about-section .pl2-partners.glance{padding:196px 16px 18px}
  .glance .pl2-logos{grid-template-columns:1fr 1fr}
  .tbl-wrap{margin-left:-2px;margin-right:-2px}
  .seo-table{min-width:0;font-size:.86rem}
  .seo-table td:first-child{width:42%}
  .ans{padding:14px 16px;font-size:.9rem}

  /* who / career / portfolio cards */
  .wj-card{padding:188px 20px 24px}
  .cp-card{padding-top:122px}
  .pf-card header{min-height:110px;padding:16px 20px}
  .pf-card .bd{padding:18px 20px 22px}

  /* tools */
  .team-cloud-section{padding:80px 0}
  .team-cloud-inner{padding:0 18px}

  /* live projects scroller */
  .courses-section{padding:70px 0 80px}
  .courses-scroll{gap:16px;padding:10px 18px 28px;margin:0 -18px}
  .course-tile{flex:0 0 82vw;max-width:330px}
  .cp-chips span{font-size:.74rem;padding:7px 12px}

  /* why / demo card */
  .search-layout{gap:32px}
  .search-item{padding:14px}
  .demo-card{padding:26px 20px}

  /* placement steps / location */
  .pl2-step h4{font-size:.95rem}
  .lc-card{padding:24px 18px;border-radius:22px}
  .lc-act a{flex:1 1 100%;justify-content:center;text-align:center}
  .lc-map,.lc-map iframe{min-height:260px}
  .visit{padding:22px 18px}

  /* faq / course details */
  .faq-layout{gap:32px}
  .cd-glance{padding:24px 20px}
  .faq-item summary{font-size:.98rem}

  /* about page */
  .ab2 section{padding:60px 0}
  .ab2 section.ab2-hero{padding:80px 0 56px}
  .ab2-photo{min-height:380px;border-radius:24px}
  .ab2-stat{padding:10px 12px}
  .ab2-stat b{font-size:1.2rem}
  .arc-stage{height:400px}
  .arc-card{top:20px}
  .tm-grid{gap:56px 0}
  .ab2-fit-card{padding:24px 20px}

  /* contact page */
  .cx-banner{padding:90px 0 100px}
  .cx-ways-sec{margin-top:-56px}
  .cx-way{padding:20px 18px}
  .cx-card.form-side{padding:22px 18px;border-radius:20px}
  .cx-map,.cx-map iframe{min-height:260px}
  .cx-faq summary{padding:16px 46px 16px 16px;font-size:.96rem}

  /* blog page */
  .bl-doing{padding:26px 20px;border-radius:22px}
  .newsletter-section{padding:72px 0}

  /* CTA cards */
  .cta-card{padding:36px 22px}
  .cta-actions a{flex:1 1 100%;justify-content:center;text-align:center}

  /* footer */
  .ft-info{padding:32px 0 8px}
  .ft-info .ft-wrap{gap:22px;justify-items:stretch}
  .ft-logo{margin:0 auto;width:150px;height:150px}
  .ft-main h2{font-size:22px}
  .ft-tag{font-size:14px}
  .ft-grid address,.ft-grid a,.ft-grid p{font-size:15px}
  .ft-bar-in{align-items:center;text-align:center}
  .ft-links{justify-content:center;gap:8px 18px}
  .ft-links a{font-size:15px}
  .ft-soc a{width:44px;height:44px}

  /* lead popup */
  .lp{padding:10px;align-items:end}
  .lp-box{border-radius:20px 20px 16px 16px}
  .lp-form{padding:24px 18px 20px}
  .lp-form h2{font-size:21px}
}

/* ---------- 5. SMALL PHONES (<= 380px) ---------- */
@media (max-width:380px){
  .wrap{padding:0 14px}
  .nb-link{font-size:.62rem}
  .hx h1 .l1{font-size:1.8rem}
  .hx-tiles{grid-template-columns:1fr}
  .glance .pl2-logos{grid-template-columns:1fr 1fr;gap:8px}
  .glance .pl2-logo b{font-size:1.2rem}
  .sd-label{display:none}
}

/* ---------- 6. TOUCH DEVICES: no sticky hover jumps ---------- */
@media (hover:none){
  .course-tile:hover,.wj-card:hover,.cp-card:hover,.article-card:hover,
  .enroll-feature:hover,.search-item:hover,.hx-tile:hover,.tm:hover .tm-card,
  .cx-way:hover,.br-card:hover{transform:none}
}

/* ---------- 7. SPEED DIAL (moved from the inline <style> in every page) ---------- */
.sd{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;align-items:flex-end;gap:14px;z-index:900}
.sd-item{display:flex;align-items:center;gap:12px;text-decoration:none;border:0;background:none;padding:0;cursor:pointer;font-family:inherit;opacity:0;transform:translateY(18px) scale(.9);pointer-events:none;transition:opacity .25s,transform .25s}
.sd.open .sd-item{opacity:1;transform:none;pointer-events:auto}
.sd.open .sd-item:nth-child(3){transition-delay:0s}
.sd.open .sd-item:nth-child(2){transition-delay:.06s}
.sd.open .sd-item:nth-child(1){transition-delay:.12s}
.sd-label{background:#fff;color:#0E2E58;font:600 15px/1 'Inter',system-ui,sans-serif;padding:9px 14px;border-radius:8px;box-shadow:0 2px 10px rgba(14,46,88,.22);white-space:nowrap}
.sd-icon{width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(14,46,88,.35)}
.sd-icon svg,.sd-main svg{width:25px;height:25px;fill:#fff;stroke:none}
.sd-demo{background:#3DA857}.sd-wa{background:#25D366}.sd-call{background:#0E2E58}
.sd-main{width:60px;height:60px;border-radius:50%;border:0;background:#1F5DAD;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 14px rgba(14,46,88,.4);transition:transform .25s}
.sd-main .sd-x{display:none}
.sd.open .sd-main{transform:rotate(90deg)}
.sd.open .sd-main .sd-chat{display:none}
.sd.open .sd-main .sd-x{display:block}
.sd-main:focus-visible,.sd-item:focus-visible .sd-icon{outline:3px solid #FBBC04;outline-offset:3px}
@media (max-width:600px){.sd-label{font-size:14px;padding:8px 12px}}

/* ---------- 8. ENROLL SECTION STAYED 2 COLUMNS ON MOBILE ----------
   Cause: a later rule `.enroll-wrap{grid-template-columns:1fr 1.05fr}`
   (in the SEO block) came AFTER the @media(max-width:1100px) rule and
   overrode it. Re-assert the stacking here (this file loads last). */
@media (max-width:1100px){
  .enroll-wrap{grid-template-columns:1fr;gap:40px}
  .enroll-left p{max-width:none}
}

/* ---------- 9. "OUR PROMISE" ARC CAROUSEL ON PHONES ----------
   The fanned/rotated cards overlap and cut the text on small screens.
   On phones turn it into a clean swipe row (scroll-snap). */
@media (max-width:700px){
  .arc-stage{
    display:flex;gap:14px;height:auto;margin:0;
    overflow-x:auto;scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
    padding:8px 18px 28px;
  }
  .arc-stage::-webkit-scrollbar{display:none}
  .arc-card{
    position:relative;left:auto;top:auto;margin:0;
    flex:0 0 78vw;max-width:300px;min-height:0;
    scroll-snap-align:center;opacity:1;
    transform:none !important;z-index:auto !important;
  }
  .arc-ctrl{display:none}            /* swipe instead of arrows */
}

/* ---------- 10. NEWSLETTER FORM (blog page) ----------
   Cause of the huge inputs: `.bl-nl-form input{flex:1 1 220px}` + column
   direction on mobile made every input 220px TALL. */
.newsletter-wrap{width:100%;padding-left:18px;padding-right:18px}
.newsletter-form{width:100%}
@media (max-width:640px){
  .newsletter-section{overflow:hidden}
  .newsletter-wrap h2{font-size:1.6rem}
  .newsletter-form,
  .newsletter-form.bl-nl-form{flex-direction:column;flex-wrap:nowrap;gap:12px}
  .newsletter-form input,
  .bl-nl-form input{
    flex:none;width:100%;min-width:0;height:52px;
    padding:0 18px;border-radius:14px;font-size:16px;
  }
  .newsletter-form button,
  .bl-nl-form button{flex:none;width:100%;height:52px;border-radius:14px}
}

/* ---------- 10b. NEWSLETTER: stronger override ----------
   blogs.html has its own <style> in <head> that loads AFTER styles.css,
   so `.bl-nl-form input{flex:1 1 220px}` beat section 10. Use higher
   specificity + !important so this always wins. */
@media (max-width:640px){
  form.newsletter-form.bl-nl-form{display:flex !important;flex-direction:column !important;flex-wrap:nowrap !important;gap:12px}
  form.newsletter-form.bl-nl-form input,
  form.newsletter-form.bl-nl-form button{
    flex:0 0 auto !important;      /* flex-basis was making them 220px tall */
    width:100% !important;min-width:0 !important;
    height:52px !important;border-radius:14px !important;
  }
  .newsletter-section{padding-bottom:120px}   /* clear the bottom tab bar */
}

/* ---------- 10b. NEWSLETTER: stronger override ----------
   blogs.html has its own <style> in <head> that loads AFTER styles.css,
   so `.bl-nl-form input{flex:1 1 220px}` beat section 10. Use higher
   specificity + !important so this always wins. */
@media (max-width:640px){
  form.newsletter-form.bl-nl-form{display:flex !important;flex-direction:column !important;flex-wrap:nowrap !important;gap:12px}
  form.newsletter-form.bl-nl-form input,
  form.newsletter-form.bl-nl-form button{
    flex:0 0 auto !important;      /* flex-basis was making them 220px tall */
    width:100% !important;min-width:0 !important;
    height:52px !important;border-radius:14px !important;
  }
  .newsletter-section{padding-bottom:120px}   /* clear the bottom tab bar */
}
/* wave + decorations must never catch taps */
.ft-wave,
.ft-wave *,
.ft-gold{pointer-events:none}

/* keep real content above the wave */
.ft-info{position:relative;z-index:2}
.ft-bar{position:relative;z-index:2}
.ft-grid a{position:relative;z-index:3;display:inline-block;padding:6px 0} /* bigger tap area */
/* speed dial: the container must never block taps; only real buttons do */
.sd{pointer-events:none}
.sd-main{pointer-events:auto}
.sd.open .sd-item{pointer-events:auto}