/* JTECH SOLS — theme v3. Original design + premium typography. */
/* self-hosted fonts (SIL Open Font License) */
@font-face{font-family:'Archivo';font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url(fonts/archivo-latin-wdth-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/barlow-condensed-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/barlow-condensed-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-condensed-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/barlow-condensed-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:300;font-display:swap;src:url(fonts/barlow-latin-300-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/barlow-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/barlow-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-mono-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/ibm-plex-mono-latin-500-normal.woff2) format('woff2')}

:root{
  --lime:#e4ff5c; --cyan:#63eaff; --violet:#a77bff; --gold:#f2dfae;
  --ink:#080b14; --ink-2:#111731; --white:#fff; --grey:#a6b0c6;
  --edge:rgba(228,255,92,.22); --edge-2:rgba(255,255,255,.13);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  color:var(--white);overflow-x:clip;line-height:1.6;
  font-family:'Plus Jakarta Sans','Segoe UI',system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;letter-spacing:-.005em;
  background:
    radial-gradient(56vw 56vw at 86% 0%,rgba(167,123,255,.15),transparent 60%),
    radial-gradient(48vw 48vw at 4% 46%,rgba(99,234,255,.10),transparent 62%),
    radial-gradient(54vw 54vw at 74% 92%,rgba(242,223,174,.08),transparent 62%),
    var(--ink);
  background-attachment:fixed;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}

#ai{position:fixed;inset:0;z-index:1;pointer-events:none;width:100%;height:100%}
#vign{position:fixed;inset:0;z-index:2;pointer-events:none;
  background:radial-gradient(ellipse at 50% 46%,transparent 46%,rgba(8,11,20,.66) 100%)}

.wrap{max-width:1340px;margin:0 auto;padding:0 5vw;position:relative;z-index:4}
section{position:relative;z-index:4;padding:78px 0}
/* ═══ SMALL LABELS — larger, calmer tracking, higher contrast ═══ */
.eyebrow{display:inline-flex;align-items:center;gap:18px;font-size:12.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--lime);font-weight:700;margin-bottom:18px}
.eyebrow::before{content:'';width:34px;height:1.5px;background:var(--lime);flex:0 0 auto}

/* ═══ HEADLINES keep the original face; body uses Plus Jakarta Sans ═══ */
h1,h2{font-family:'Segoe UI',system-ui,-apple-system,'Plus Jakarta Sans',sans-serif}

/* ═══ ACCENT WORD — white headline with a live gradient sweep ═══ */
h1 .lime,h2 .lime{
  background:linear-gradient(100deg,#e4ff5c 0%,#f6ffd0 18%,#e4ff5c 34%,#63eaff 58%,#e4ff5c 80%,#f6ffd0 100%);
  background-size:280% auto;-webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent;
  animation:sweep 6s linear infinite}
@keyframes sweep{to{background-position:280% center}}
@media (prefers-reduced-motion:reduce){h1 .lime,h2 .lime{animation:none}}

/* ═══ KINETIC HEADLINES — words lift and rotate in, site-wide ═══ */
.kw-w{display:inline-block;opacity:0;transform:translateY(24px) rotateX(-48deg);
  transform-origin:50% 100%;will-change:transform,opacity}
.kin-go .kw-w{animation:kinIn .75s cubic-bezier(.22,1,.36,1) forwards}
@keyframes kinIn{to{opacity:1;transform:none}}
h1 .kw-w,h2 .kw-w{padding-bottom:.04em}
@media (prefers-reduced-motion:reduce){.kw-w{opacity:1!important;transform:none!important}}

/* ═══════ SHARED SLOW-MO HORIZONTAL RAIL ═══════ */
.marq{overflow:hidden;position:relative;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.marq-in{display:flex;gap:20px;width:max-content;padding:14px 0 24px;
  animation:slide var(--dur,90s) linear infinite}
.marq:hover .marq-in{animation-play-state:paused}
@keyframes slide{to{transform:translateX(-50%)}}
h2{font-size:clamp(32px,4.6vw,58px);font-weight:850;letter-spacing:-.04em;line-height:1.03;margin-bottom:18px}
.lede{color:var(--grey);max-width:680px;font-size:15.5px;margin-bottom:34px}
.lime{color:var(--lime)}
.outline{color:transparent;-webkit-text-stroke:1.5px var(--lime)}

nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:15px 5vw;display:flex;align-items:center;
  justify-content:space-between;gap:18px;background:rgba(8,11,20,.72);backdrop-filter:blur(22px);
  border-bottom:1px solid var(--edge-2)}
.brand{display:flex;align-items:center;gap:11px;font-weight:850;font-size:15px;letter-spacing:-.02em}
.brand span{width:31px;height:31px;border-radius:9px;display:grid;place-items:center;
  background:var(--lime);color:#000;font-size:14px;font-weight:900}
.links{display:flex;gap:22px;font-size:13px;color:var(--grey);font-weight:600;flex-wrap:wrap}
.links a{transition:color .25s}.links a:hover{color:var(--lime)}
.links a.sep{padding-left:22px;border-left:1px solid var(--edge-2);color:var(--lime)}
.nav-cta{padding:11px 22px;border-radius:8px;font-size:12.5px;font-weight:800;color:#000;
  background:var(--lime);white-space:nowrap;transition:transform .3s,box-shadow .3s}
.nav-cta:hover{transform:translateY(-2px);box-shadow:0 14px 34px -10px rgba(228,255,92,.8)}
@media(max-width:1050px){.links{display:none}}

#hero{min-height:100vh;display:flex;align-items:center;padding-top:130px;padding-bottom:70px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;width:100%}
@media(max-width:1000px){.hero-grid{grid-template-columns:1fr}}
.hero-copy{max-width:610px}
.tagline{display:inline-flex;align-items:center;gap:9px;padding:8px 16px;border-radius:100px;
  background:rgba(255,255,255,.07);border:1px solid var(--edge);font-size:11.5px;font-weight:700;
  color:var(--lime);letter-spacing:.1em;text-transform:uppercase;margin-bottom:26px}
.pip{width:6px;height:6px;border-radius:50%;background:var(--lime);animation:blink 1.9s infinite}
@keyframes blink{50%{opacity:.25}}
h1{font-size:clamp(38px,5.4vw,74px);font-weight:900;line-height:.98;letter-spacing:-.05em;margin-bottom:24px}
.hero-p{color:var(--grey);font-size:16.5px;max-width:540px;margin-bottom:30px}
.hero-p b{color:var(--white);font-weight:700}
.hero-p.two{font-size:15px;max-width:520px;margin-bottom:34px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:42px}
.btn{padding:15px 30px;border-radius:9px;font-weight:800;font-size:14px;display:inline-block;cursor:pointer;
  border:none;transition:transform .3s cubic-bezier(.2,.9,.3,1),box-shadow .3s,background .3s,color .3s}
.btn.solid{background:var(--lime);color:#000}
.btn.solid:hover{transform:translateY(-3px);box-shadow:0 20px 44px -12px rgba(228,255,92,.8)}
.btn.line{border:1.5px solid var(--edge);color:var(--lime);background:rgba(255,255,255,.05)}
.btn.line:hover{transform:translateY(-3px);background:var(--lime);color:#000}
.hero-stats{display:flex;gap:34px;flex-wrap:wrap}
.hs b{display:block;font-size:30px;font-weight:900;color:var(--lime);letter-spacing:-.03em;line-height:1}
.hs small{color:var(--grey);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700}

.strip{border-block:1px solid var(--edge-2);padding:20px 0;overflow:hidden;margin-bottom:54px;
  background:rgba(255,255,255,.045);backdrop-filter:blur(10px);position:relative;z-index:4;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.strip-in{display:flex;gap:46px;width:max-content;animation:run 34s linear infinite}
@keyframes run{to{transform:translateX(-50%)}}
.strip span{font-size:14.5px;font-weight:800;color:var(--grey);display:flex;align-items:center;
  gap:46px;white-space:nowrap;letter-spacing:-.005em}
.strip span::after{content:'';width:6px;height:6px;border-radius:50%;background:var(--lime);flex:0 0 auto}

/* ═══════ SERVICES — pinned rail ═══════ */
#services{padding:0}
.pinwrap{position:relative}
.pin{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;
  justify-content:center;overflow:hidden;padding-top:56px;perspective:2000px;
  perspective-origin:50% 44%}
.pinhead{max-width:1340px;margin:0 auto 34px;padding:0 5vw;width:100%;
  display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.counter{font-size:13px;font-weight:850;color:var(--grey);letter-spacing:.1em}
.counter b{color:var(--lime);font-size:30px;letter-spacing:-.03em}
/* the cards sit on a 3D ring that turns around the neural object */
.track{position:relative;width:330px;height:384px;margin:0 auto;
  transform-style:preserve-3d;will-change:transform}
.scard{position:absolute;left:0;top:0;width:330px;height:384px;border-radius:24px;padding:24px 24px;
  will-change:transform,opacity;backface-visibility:hidden;
  background:linear-gradient(158deg,rgba(255,255,255,.12),rgba(255,255,255,.035));
  border:1px solid var(--edge-2);backdrop-filter:blur(18px) saturate(150%);
  box-shadow:0 30px 70px -28px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.2);
  display:flex;flex-direction:column;overflow:hidden;
  transition:border-color .5s,box-shadow .5s,background .5s}
.scard::before{content:'';position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .6s;
  background:radial-gradient(440px circle at 50% 0%,rgba(228,255,92,.20),transparent 62%)}
.scard.mid::before{opacity:1}
.scard.mid{border-color:var(--lime);
  box-shadow:0 50px 110px -30px rgba(228,255,92,.5), inset 0 1px 0 rgba(255,255,255,.34);
  background:linear-gradient(158deg,rgba(228,255,92,.15),rgba(255,255,255,.045))}
.scard .no{position:absolute;right:20px;top:16px;font-size:50px;font-weight:900;letter-spacing:-.06em;
  color:rgba(255,255,255,.07);line-height:1;transition:color .5s}
.scard.mid .no{color:rgba(228,255,92,.22)}
.scard .ico{width:56px;height:56px;margin-bottom:auto;
  transition:transform .6s cubic-bezier(.22,1,.36,1)}
.scard.mid .ico{transform:scale(1.1) rotate(-6deg)}
.scard .ico svg{width:100%;height:100%;filter:drop-shadow(0 10px 22px rgba(0,0,0,.65))}
.scard .tag{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--lime)}
.scard h3{font-size:21px;font-weight:850;letter-spacing:-.03em;line-height:1.15;margin:8px 0 9px}
.scard p{color:var(--grey);font-size:12.8px;line-height:1.55}
.scard .go{margin-top:14px;padding-top:12px;border-top:1px solid var(--edge-2);
  font-size:12px;font-weight:800;color:var(--lime);letter-spacing:.02em;
  display:flex;align-items:center;justify-content:space-between;gap:10px}
.scard .go em{font-style:normal;font-size:16px;transition:transform .35s cubic-bezier(.22,1,.36,1)}
.scard:hover .go em{transform:translateX(6px)}
.hintscroll{font-size:11.5px;color:var(--grey);letter-spacing:.16em;text-transform:uppercase;
  font-weight:700;margin-top:12px;display:flex;align-items:center;gap:9px}
.hintscroll::before{content:'';width:26px;height:1.5px;background:var(--lime)}
/* direct links to every service — the ring exposes only one card at a time */
#services{scroll-margin-top:88px}
.svcnav{padding:96px 0 30px}
.svcnav-lbl{display:block;font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:800;color:var(--grey);margin-bottom:15px}
.svcnav ul{list-style:none;display:flex;flex-wrap:wrap;gap:9px}
.svcnav a{display:inline-block;padding:9px 16px;border-radius:100px;text-decoration:none;
  font-size:13px;font-weight:750;color:#c4cde2;
  background:rgba(255,255,255,.05);border:1px solid var(--edge-2);
  transition:color .3s,background .3s,border-color .3s,transform .3s}
.svcnav a:hover{color:var(--ink);background:var(--lime);border-color:var(--lime);
  transform:translateY(-2px)}
.svcnav a:focus-visible{outline:2px solid var(--lime);outline-offset:3px}
@media(max-width:700px){
  .pinwrap{height:auto!important}
  .pin{position:static;height:auto;padding:100px 0 90px;perspective:none}
  .track{position:static;width:auto;height:auto;display:flex;gap:16px;overflow-x:auto;
    scroll-snap-type:x mandatory;padding:0 5vw;transform:none!important;
    scrollbar-width:none;transform-style:flat}
  .track::-webkit-scrollbar{display:none}
  .scard{position:static!important;flex:0 0 80vw;width:auto;height:440px;scroll-snap-align:center;
    transform:none!important;opacity:1!important;pointer-events:auto!important}
}

/* ═══════ PROJECTS ═══════ */
.wcard{position:relative;flex:0 0 420px;border-radius:18px;overflow:hidden;aspect-ratio:16/11;
  border:1px solid var(--edge-2);display:block;background:var(--ink-2);
  transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .45s,border-color .4s}
.wcard:hover{transform:translateY(-8px);box-shadow:0 40px 84px -30px rgba(228,255,92,.45);border-color:var(--lime)}
/* the gradient sits under the screenshot, so a not-yet-uploaded image leaves a
   deliberate-looking panel rather than a flat black rectangle */
.wcard .shot{position:absolute;inset:0;background-size:cover;background-position:top center;
  background-color:#111731;background-blend-mode:normal;
  filter:brightness(.55) saturate(.9);transition:transform .85s cubic-bezier(.22,1,.36,1),filter .5s}
.wcard:hover .shot{transform:scale(1.08);filter:brightness(.85) saturate(1.1)}
.wcard .veil{position:absolute;inset:0;
  background:linear-gradient(to top,rgba(8,11,20,.97) 4%,rgba(8,11,20,.4) 48%,transparent 80%)}
.wcard .info{position:absolute;left:22px;right:22px;bottom:20px}
.wcard .kind{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--lime);font-weight:800}
.wcard h3{font-size:20px;font-weight:800;margin-top:6px;letter-spacing:-.025em}
/* attribution line — matches the credit on the service-page portfolio cards */
.wbuilt{font-size:11px;font-weight:650;letter-spacing:.03em;color:var(--lime);
  opacity:.88;margin-top:5px}
.wbuilt b{font-weight:800;opacity:1}
.wcard p{color:var(--grey);font-size:13px;max-height:0;opacity:0;overflow:hidden;
  transition:max-height .5s cubic-bezier(.22,1,.36,1),opacity .4s,margin .45s}
.wcard:hover p{max-height:92px;opacity:1;margin-top:8px}
.wcard.slot{display:grid;place-items:center;text-align:center;padding:28px;border-style:dashed;
  border-color:var(--edge);background:rgba(255,255,255,.05)}
.wcard.slot h3{font-size:19px;margin:8px 0 6px}
.wcard.slot small{color:var(--grey);font-size:12.5px;max-width:280px;display:block}

/* ═══════ INSTITUTE ═══════ */
#institute{position:relative;z-index:4;padding:0 5vw}
.inst-card{max-width:1340px;margin:0 auto;border-radius:28px;padding:68px 5% 64px;overflow:hidden;
  background:linear-gradient(154deg,rgba(167,123,255,.17),rgba(99,234,255,.07) 52%,rgba(255,255,255,.035));
  border:1px solid var(--edge-2);backdrop-filter:blur(16px)}
.inst-head{display:grid;grid-template-columns:1.2fr 1fr;gap:42px;align-items:end;margin-bottom:44px}
@media(max-width:900px){.inst-head{grid-template-columns:1fr;gap:24px}}
.inst-badges{display:flex;flex-wrap:wrap;gap:8px}
.inst-badges span{padding:9px 15px;border-radius:100px;background:rgba(255,255,255,.09);
  border:1px solid var(--edge-2);font-size:12px;font-weight:700}
.explorer{display:grid;grid-template-columns:1fr 1.08fr;gap:26px;align-items:start}
@media(max-width:940px){.explorer{grid-template-columns:1fr;gap:18px}}
.plist{display:flex;flex-direction:column;gap:2px}
.pitem{display:grid;grid-template-columns:30px 1fr auto;gap:14px;align-items:center;
  padding:15px 16px;border-radius:12px;cursor:pointer;border:1px solid transparent;
  background:none;text-align:left;width:100%;transition:background .3s,border-color .3s,padding .3s}
.pitem .n{font-size:10.5px;font-weight:900;color:var(--grey);letter-spacing:.1em}
.pitem .t{font-size:15.5px;font-weight:750;letter-spacing:-.02em}
.pitem .d{font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--grey)}
.pitem:hover{background:rgba(255,255,255,.06)}
.pitem.on{background:rgba(228,255,92,.13);border-color:var(--lime);padding-left:22px}
.pitem.on .n,.pitem.on .d{color:var(--lime)}
.pdetail{position:relative;border-radius:20px;padding:34px 32px;min-height:396px;overflow:hidden;
  background:linear-gradient(158deg,rgba(255,255,255,.10),rgba(255,255,255,.03));
  border:1px solid var(--edge-2);backdrop-filter:blur(18px);
  box-shadow:0 26px 60px -28px rgba(0,0,0,.85)}
.pdetail .pico{width:66px;height:66px;margin-bottom:22px}
.pdetail .pico svg{width:100%;height:100%;filter:drop-shadow(0 8px 18px rgba(0,0,0,.6))}
.pdetail h3{font-size:27px;font-weight:850;letter-spacing:-.03em;margin-bottom:6px}
.pdetail .meta{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 18px}
.pdetail .meta span{padding:7px 13px;border-radius:100px;font-size:11px;font-weight:800;
  background:rgba(228,255,92,.14);border:1px solid var(--edge);color:var(--lime)}
.pdetail p{color:var(--grey);font-size:14.5px;line-height:1.7;margin-bottom:20px}
.pdetail ul{list-style:none;display:grid;gap:9px;margin-bottom:26px}
.pdetail li{color:var(--grey);font-size:13.5px;padding-left:22px;position:relative}
.pdetail li::before{content:'';position:absolute;left:4px;top:8px;width:7px;height:7px;border-radius:2px;
  background:var(--lime);transform:rotate(45deg)}
.fade{animation:fadein .45s cubic-bezier(.22,1,.36,1)}
@keyframes fadein{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.inst-cta{margin-top:42px;display:flex;gap:12px;flex-wrap:wrap}

/* ═══════ REELS ═══════ */
.reel{position:relative;flex:0 0 244px;aspect-ratio:9/16;border-radius:20px;overflow:hidden;
  display:block;border:1px solid var(--edge-2);background:var(--ink-2);
  transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .5s,border-color .45s}
.reel:hover{transform:translateY(-10px);border-color:var(--lime);
  box-shadow:0 40px 80px -26px rgba(228,255,92,.55)}
/* optional poster image — drops in behind everything when a URL is supplied */
.reel .rimg{position:absolute;inset:0;background-size:cover;background-position:center;
  filter:brightness(.72);transition:transform .9s cubic-bezier(.22,1,.36,1),filter .5s}
.reel:hover .rimg{transform:scale(1.06);filter:brightness(.9)}
.reel .rv{position:absolute;inset:0;
  background:linear-gradient(158deg,var(--r1,rgba(167,123,255,.4)) 0%,rgba(8,11,20,.55) 46%,rgba(8,11,20,.94) 100%);
  display:flex;flex-direction:column;justify-content:space-between;padding:15px}
.reel .plat{align-self:flex-start;padding:6px 12px;border-radius:100px;font-size:9.5px;font-weight:900;
  letter-spacing:.14em;text-transform:uppercase;background:rgba(8,11,20,.82);color:var(--lime);
  border:1px solid var(--edge);backdrop-filter:blur(10px)}
.reel .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:56px;height:56px;
  border-radius:50%;background:var(--lime);color:#000;display:grid;place-items:center;font-size:18px;
  box-shadow:0 0 36px rgba(228,255,92,.75);
  transition:transform .4s cubic-bezier(.22,1,.36,1)}
.reel:hover .play{transform:translate(-50%,-50%) scale(1.14)}
.reel .rt{font-size:12.5px;font-weight:800;line-height:1.4;display:flex;
  justify-content:space-between;align-items:center;gap:8px}
.reel .rt em{font-style:normal;color:var(--lime);font-size:14px;
  transition:transform .35s cubic-bezier(.22,1,.36,1)}
.reel:hover .rt em{transform:translateX(5px)}
.reel-note{margin-top:16px;color:var(--grey);font-size:12.5px}

/* ═══════ TEAM ═══════ */
.team{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(235px,1fr))}
.mem{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:3/4;
  border:1px solid var(--edge-2);background:var(--ink-2);
  transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .45s}
.mem:hover{transform:translateY(-8px);box-shadow:0 40px 84px -28px rgba(228,255,92,.45)}
.mem .pic{position:absolute;inset:0;background-size:cover;background-position:center top;
  filter:grayscale(1) brightness(.78);transition:transform .85s cubic-bezier(.22,1,.36,1),filter .55s}
.mem:hover .pic{transform:scale(1.07);filter:grayscale(0) brightness(1.02)}
.mem .veil{position:absolute;inset:0;
  background:linear-gradient(to top,rgba(8,11,20,.98) 6%,rgba(8,11,20,.4) 46%,transparent 76%)}
.mem .who{position:absolute;left:19px;right:19px;bottom:19px}
.mem h4{font-size:17.5px;font-weight:800;letter-spacing:-.02em}
.mem .role{color:var(--lime);font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:800;margin-top:3px}
.mem .bio{color:var(--grey);font-size:12.3px;line-height:1.55;max-height:0;opacity:0;overflow:hidden;
  transition:max-height .5s cubic-bezier(.22,1,.36,1),opacity .4s,margin .45s}
.mem:hover .bio{max-height:120px;opacity:1;margin-top:9px}

/* ═══════ TESTIMONIALS — text + country ═══════ */
.tcard{position:relative;flex:0 0 340px;display:flex;flex-direction:column;
  padding:28px 26px;border-radius:20px;
  background:linear-gradient(158deg,rgba(255,255,255,.09),rgba(255,255,255,.03));
  border:1px solid var(--edge-2);backdrop-filter:blur(14px);
  transition:transform .4s cubic-bezier(.22,1,.36,1),border-color .4s,box-shadow .45s}
.tcard:hover{transform:translateY(-7px);border-color:var(--lime);
  box-shadow:0 34px 72px -28px rgba(228,255,92,.42)}
.stars{display:flex;gap:3px;margin-bottom:12px}
.stars svg{width:17px;height:17px;flex:0 0 auto}
.tcard blockquote{color:var(--grey);font-size:14px;line-height:1.68;margin:0 0 22px;
  font-style:italic;flex:1}
.tcard blockquote.todo{color:rgba(228,255,92,.62);font-style:normal;font-size:12.8px;
  padding:12px 14px;border:1px dashed var(--edge);border-radius:10px}
.who2{display:flex;align-items:center;gap:12px;padding-top:18px;border-top:1px solid var(--edge-2)}
.flag{width:40px;height:28px;border-radius:6px;flex:0 0 auto;display:grid;place-items:center;
  font-size:11px;font-weight:900;letter-spacing:.06em;color:#0b0f18;
  background:linear-gradient(150deg,var(--lime),#a8d92c);
  box-shadow:0 4px 12px -4px rgba(228,255,92,.7)}
.who2 .nm{font-size:14.5px;font-weight:800;letter-spacing:-.015em;line-height:1.3}
.who2 .cy{font-size:11.5px;color:var(--grey);font-weight:700;letter-spacing:.04em}
.tcard .svc{position:absolute;right:24px;top:26px;font-size:9.5px;font-weight:900;
  letter-spacing:.14em;text-transform:uppercase;color:var(--grey);
  padding:6px 11px;border-radius:100px;border:1px solid var(--edge-2)}
.tnote{margin-top:22px;color:var(--grey);font-size:12.5px}

/* ═══════ FORM ═══════ */
.form-shell{display:grid;grid-template-columns:.85fr 1.15fr;gap:44px;align-items:start}
@media(max-width:940px){.form-shell{grid-template-columns:1fr;gap:34px}}
.fbox{padding:34px;border-radius:22px;background:rgba(255,255,255,.06);border:1px solid var(--edge-2);
  backdrop-filter:blur(22px)}
.switch{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:6px;border-radius:13px;
  background:rgba(8,11,20,.55);border:1px solid var(--edge-2);margin-bottom:28px}
.switch button{padding:14px 10px;border-radius:9px;background:none;border:none;cursor:pointer;
  font-weight:800;font-size:13.5px;color:var(--grey);transition:background .3s,color .3s}
.switch button.on{background:var(--lime);color:#000}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){.fgrid{grid-template-columns:1fr}}
.f{display:flex;flex-direction:column;gap:7px}
.f.full{grid-column:1/-1}
.f label{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--lime)}
.f input,.f select,.f textarea{padding:13px 14px;border-radius:10px;background:rgba(8,11,20,.6);
  border:1px solid var(--edge-2);font-size:14px;outline:none;width:100%;
  transition:border-color .3s,background .3s}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--lime);background:rgba(8,11,20,.85)}
.f textarea{resize:vertical;min-height:96px}
.f select option{background:#111731;color:var(--white)}
.err{color:#ff8b6b;font-size:12px;margin-top:10px;min-height:16px}
.wa{width:100%;margin-top:20px;padding:16px;border-radius:11px;background:var(--lime);color:#000;
  font-weight:850;font-size:14.5px;border:none;cursor:pointer;transition:transform .3s,box-shadow .3s}
.wa:hover{transform:translateY(-3px);box-shadow:0 20px 44px -12px rgba(228,255,92,.8)}
.fnote{color:var(--grey);font-size:12px;margin-top:13px;text-align:center}
.cinfo div{padding:18px 20px;border-radius:14px;background:rgba(255,255,255,.06);
  border:1px solid var(--edge-2);margin-bottom:11px;backdrop-filter:blur(14px)}
.cinfo b{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--lime);
  font-weight:800;margin-bottom:5px}
.cinfo p{color:var(--grey);font-size:13.5px;line-height:1.7}

footer{position:relative;z-index:4;padding:84px 0 34px;border-top:1px solid var(--edge-2);
  background:rgba(8,11,20,.72);backdrop-filter:blur(14px);margin-top:60px}
.f-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.3fr;gap:42px}
@media(max-width:900px){.f-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.f-grid{grid-template-columns:1fr}}
footer h5{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--lime);
  margin-bottom:19px;font-weight:800}
footer p,footer li{color:var(--grey);font-size:13.5px;line-height:1.9;list-style:none}
footer li a{transition:color .25s}footer li a:hover{color:var(--lime)}
.socials{display:flex;gap:9px;margin-top:19px;flex-wrap:wrap}
.socials a{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;font-size:12px;
  font-weight:800;border:1px solid var(--edge-2);color:var(--grey);
  transition:transform .3s cubic-bezier(.2,.9,.3,1),background .3s,color .3s}
.socials a:hover{transform:translateY(-4px);background:var(--lime);color:#000}
.office{margin-bottom:13px}
.office b{color:var(--white);display:block;font-size:12.5px;font-weight:700}
/* footer map — Maps Embed API is free and unlimited */
.fmap{position:relative;border-radius:16px;overflow:hidden;border:1px solid var(--edge-2);
  margin-bottom:16px;background:var(--ink-2);
  box-shadow:0 18px 44px -22px rgba(0,0,0,.9);transition:border-color .35s}
.fmap:hover{border-color:var(--lime)}
.fmap iframe{display:block;width:100%;height:190px;border:0;
  filter:invert(92%) hue-rotate(180deg) contrast(.92) saturate(.75)}
.fmap .fpin{position:absolute;left:12px;top:12px;z-index:2;padding:7px 13px;border-radius:100px;
  font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  background:rgba(8,11,20,.86);border:1px solid var(--edge);color:var(--lime);
  backdrop-filter:blur(10px);pointer-events:none}
.fmap .fgo{position:absolute;right:12px;bottom:12px;z-index:2;padding:8px 14px;border-radius:100px;
  font-size:11.5px;font-weight:800;background:var(--lime);color:#000;
  transition:transform .3s,box-shadow .3s}
.fmap .fgo:hover{transform:translateY(-2px);box-shadow:0 10px 24px -8px rgba(228,255,92,.8)}
.f-base{margin-top:52px;padding-top:25px;border-top:1px solid var(--edge-2);display:flex;
  justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--grey);font-size:12.5px}

/* ═══════ VERIFICATION ═══════ */
.vshell{display:grid;grid-template-columns:1fr 1.05fr;gap:40px;align-items:center}
@media(max-width:940px){.vshell{grid-template-columns:1fr;gap:30px}}
.vbox{padding:38px 34px;border-radius:24px;
  background:linear-gradient(158deg,rgba(255,255,255,.11),rgba(255,255,255,.035));
  border:1px solid var(--edge-2);backdrop-filter:blur(20px);
  box-shadow:0 30px 70px -30px rgba(0,0,0,.9)}
.vrow{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.vrow input{flex:1 1 220px;padding:16px 16px;border-radius:12px;background:rgba(8,11,20,.62);
  border:1px solid var(--edge-2);font-size:15px;outline:none;transition:border-color .3s}
.vrow input:focus{border-color:var(--lime);background:rgba(8,11,20,.85)}
.vrow button{padding:16px 30px;border-radius:12px;background:var(--lime);color:#000;border:none;
  font-weight:850;font-size:14px;cursor:pointer;transition:transform .3s,box-shadow .3s}
.vrow button:hover{transform:translateY(-3px);box-shadow:0 18px 40px -12px rgba(228,255,92,.8)}
.vhint{color:var(--grey);font-size:12.5px;margin-top:14px}
.vout{margin-top:20px;padding:20px 22px;border-radius:14px;display:none;
  border:1px solid var(--edge-2);background:rgba(8,11,20,.5);font-size:14px;line-height:1.7}
.vout.show{display:block;animation:fadein .4s cubic-bezier(.22,1,.36,1)}
.vout b{color:var(--lime)}
.vsteps{display:grid;gap:12px}
.vstep{display:flex;gap:15px;align-items:flex-start;padding:18px 20px;border-radius:15px;
  background:rgba(255,255,255,.05);border:1px solid var(--edge-2)}
.vstep i{flex:0 0 auto;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;
  background:var(--lime);color:#000;font-style:normal;font-weight:900;font-size:13px}
.vstep b{display:block;font-size:15px;font-weight:800;letter-spacing:-.02em;margin-bottom:3px}
.vstep p{color:var(--grey);font-size:13px;line-height:1.55}

/* ═══════ BLOG — full-bleed image behind a glass panel ═══════ */
.bcard{flex:0 0 380px;height:520px;border-radius:24px;overflow:hidden;position:relative;
  border:1px solid var(--edge-2);background:var(--ink-2);display:flex;flex-direction:column;
  justify-content:flex-end;isolation:isolate;
  transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .5s,border-color .45s}
.bcard:hover{transform:translateY(-10px);border-color:var(--lime);
  box-shadow:0 46px 92px -30px rgba(228,255,92,.5)}
/* the picture fills the whole card */
.bcard .bimg{position:absolute;inset:0;z-index:0;background-size:cover;
  background-position:center 22%;background-repeat:no-repeat;
  filter:brightness(.82) saturate(1.02);
  transition:transform .9s cubic-bezier(.22,1,.36,1),filter .55s}
.bcard:hover .bimg{transform:scale(1.06);filter:brightness(1) saturate(1.14)}
.bcard .bimg::after{content:'';position:absolute;inset:0;
  background:linear-gradient(to top,rgba(8,11,20,.92) 8%,rgba(8,11,20,.35) 46%,rgba(8,11,20,.05))}
.bcard .cat{position:absolute;left:18px;top:18px;z-index:3;padding:8px 15px;border-radius:100px;
  font-size:9.5px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;
  background:rgba(228,255,92,.16);border:1px solid var(--edge);color:var(--lime);
  backdrop-filter:blur(14px) saturate(160%);-webkit-backdrop-filter:blur(14px) saturate(160%)}
/* glassmorphism panel, same palette as the rest of the site */
.bcard .bbody{position:relative;z-index:2;margin:0 14px 14px;padding:22px 20px 20px;
  border-radius:18px;display:flex;flex-direction:column;
  background:linear-gradient(158deg,rgba(255,255,255,.13),rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(22px) saturate(165%);-webkit-backdrop-filter:blur(22px) saturate(165%);
  box-shadow:0 20px 46px -22px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.24);
  transition:background .45s,border-color .45s}
.bcard:hover .bbody{background:linear-gradient(158deg,rgba(228,255,92,.16),rgba(255,255,255,.06));
  border-color:rgba(228,255,92,.4)}
.bcard .bdate{font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  color:var(--lime);margin-bottom:9px}
.bcard h3{font-size:19.5px;font-weight:850;letter-spacing:-.028em;line-height:1.28;margin-bottom:9px}
.bcard p{color:rgba(255,255,255,.78);font-size:13px;line-height:1.6}
.bcard .bgo{margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.18);
  font-size:12px;font-weight:850;color:var(--lime);display:flex;justify-content:space-between;
  align-items:center;letter-spacing:.03em}
.bcard .bgo em{font-style:normal;font-size:15px;transition:transform .35s cubic-bezier(.22,1,.36,1)}
.bcard:hover .bgo em{transform:translateX(6px)}

/* ═══════ STUDENT / GOOGLE REVIEWS ═══════ */
.gcard{position:relative;flex:0 0 350px;display:flex;flex-direction:column;padding:28px 26px;
  border-radius:20px;background:linear-gradient(158deg,rgba(255,255,255,.10),rgba(255,255,255,.035));
  border:1px solid var(--edge-2);backdrop-filter:blur(16px);
  transition:transform .4s cubic-bezier(.22,1,.36,1),border-color .4s,box-shadow .45s}
.gcard:hover{transform:translateY(-7px);border-color:var(--lime);
  box-shadow:0 34px 72px -28px rgba(228,255,92,.42)}
.ghead{display:flex;align-items:center;gap:13px;margin-bottom:15px}
.gav{width:48px;height:48px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;
  font-size:17px;font-weight:800;color:#0b0f18;overflow:hidden;position:relative;
  background:linear-gradient(150deg,var(--lime),#a8d92c);
  box-shadow:0 0 0 2px rgba(228,255,92,.35), 0 6px 16px -6px rgba(0,0,0,.8)}
.gav img{width:100%;height:100%;object-fit:cover;display:block}
/* small Google badge on the avatar */
.gav::after{content:'';position:absolute;right:-1px;bottom:-1px;width:15px;height:15px;
  border-radius:50%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='%234285F4' d='M45 24c0-1.6-.1-2.7-.4-4H24v8h12c-.2 2-1.5 5-4.4 7l6.7 5.2C42.2 36.6 45 30.9 45 24z'/%3E%3Cpath fill='%2334A853' d='M24 46c5.9 0 10.9-2 14.5-5.3l-6.9-5.4C29.7 36.6 27.1 37.5 24 37.5c-5.8 0-10.7-3.9-12.5-9.1l-7.1 5.5C8 41.4 15.4 46 24 46z'/%3E%3Cpath fill='%23FBBC05' d='M11.5 28.4c-.5-1.4-.7-2.9-.7-4.4s.3-3 .7-4.4l-7.1-5.5C3 17 2 20.4 2 24s1 7 2.4 9.9l7.1-5.5z'/%3E%3Cpath fill='%23EA4335' d='M24 10.5c3.3 0 6.2 1.1 8.4 3.4l6.3-6.3C34.9 4 29.9 2 24 2 15.4 2 8 6.6 4.4 14.1l7.1 5.5c1.8-5.2 6.7-9.1 12.5-9.1z'/%3E%3C/svg%3E") center/10px no-repeat;
  border:1.5px solid var(--ink-2)}
.gmeta .gn{font-size:15px;font-weight:750;letter-spacing:-.015em;line-height:1.3}
.gmeta .gd{font-size:12px;color:var(--grey);font-weight:600}
.gstars{display:flex;gap:3px;margin-bottom:12px}
.gstars svg{width:16px;height:16px}
/* fixed height + 2-line clamp keeps every card identically aligned */
.gcard{height:268px}
.gcard p{color:rgba(255,255,255,.8);font-size:13.8px;line-height:1.68;margin:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gcard p.none{color:var(--grey);font-style:italic}
.gmore{align-self:flex-start;margin-top:10px;padding:0;background:none;border:none;cursor:pointer;
  font-size:12.5px;font-weight:800;color:var(--lime);letter-spacing:.02em;
  border-bottom:1px solid rgba(228,255,92,.45);transition:border-color .3s,opacity .3s}
.gmore:hover{border-color:var(--lime);opacity:.85}
.gsrc{margin-top:auto;padding-top:14px;border-top:1px solid var(--edge-2);
  font-size:12px;font-weight:700;color:var(--grey);display:flex;align-items:center;gap:8px}
.gsrc b{color:var(--lime);font-weight:800}

/* full-review overlay — opens above the rail so nothing reflows */
#gmodal{position:fixed;inset:0;z-index:210;display:none;place-items:center;padding:6vh 5vw}
#gmodal.on{display:grid;animation:mfade .3s cubic-bezier(.22,1,.36,1)}
#gmodal .gback{position:fixed;inset:0;background:rgba(4,6,12,.85);backdrop-filter:blur(12px)}
.gsheet{position:relative;max-width:600px;width:100%;border-radius:24px;padding:36px 34px;
  background:linear-gradient(158deg,rgba(255,255,255,.13),rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(26px) saturate(170%);
  box-shadow:0 44px 96px -34px rgba(0,0,0,.95);max-height:88vh;overflow-y:auto}
.gsheet .gx{position:absolute;right:16px;top:16px;width:36px;height:36px;border-radius:50%;
  border:1px solid rgba(255,255,255,.24);background:rgba(8,11,20,.7);color:var(--white);
  font-size:15px;cursor:pointer;transition:background .3s,color .3s}
.gsheet .gx:hover{background:var(--lime);color:#000}
.gsheet .ghead{margin-bottom:16px}
.gsheet p{display:block;-webkit-line-clamp:unset;overflow:visible;font-size:15px;line-height:1.78;
  color:rgba(255,255,255,.88)}
.gall{display:inline-flex;align-items:center;gap:9px;padding:11px 20px;border-radius:100px;
  border:1px solid var(--edge-2);background:rgba(255,255,255,.06);font-size:13px;font-weight:750;
  color:var(--white);margin-bottom:26px;
  transition:background .3s,border-color .3s,transform .3s}
.gall:hover{background:var(--lime);color:#000;border-color:var(--lime);transform:translateY(-2px)}
.gempty{padding:34px 30px;border-radius:20px;border:1px dashed var(--edge);
  background:rgba(228,255,92,.05);color:rgba(228,255,92,.8);font-size:14px;line-height:1.75}
.gempty b{color:var(--lime)}
.gempty code{background:rgba(0,0,0,.35);padding:2px 7px;border-radius:5px;font-size:12.5px}

/* ═══════ CEO MESSAGE ═══════ */
.ceo{display:grid;grid-template-columns:.82fr 1.18fr;gap:0;border-radius:28px;overflow:hidden;
  border:1px solid var(--edge-2);
  background:linear-gradient(154deg,rgba(167,123,255,.16),rgba(99,234,255,.06) 52%,rgba(255,255,255,.035));
  backdrop-filter:blur(16px)}
@media(max-width:860px){.ceo{grid-template-columns:1fr}}
.ceo-pic{position:relative;min-height:440px;background-size:cover;background-position:center top}
.ceo-pic::after{content:'';position:absolute;inset:0;
  background:linear-gradient(to right,transparent 55%,rgba(8,11,20,.35))}
.ceo-txt{padding:56px 50px 52px;display:flex;flex-direction:column;justify-content:center}
@media(max-width:600px){.ceo-txt{padding:38px 26px 40px}}
.ceo-txt .qm{font-size:64px;line-height:.7;color:var(--lime);opacity:.34;font-weight:900;margin-bottom:18px}
.ceo-txt blockquote{font-size:clamp(17px,1.9vw,22px);line-height:1.62;font-weight:600;
  letter-spacing:-.018em;color:var(--white);margin-bottom:20px}
.ceo-txt p{color:var(--grey);font-size:14.5px;line-height:1.78;margin-bottom:14px}
.ceo-sign{margin-top:22px;padding-top:22px;border-top:1px solid var(--edge-2)}
.ceo-sign b{display:block;font-size:17px;font-weight:800;letter-spacing:-.02em}
.ceo-sign>div>div>span{font-size:12.5px;color:var(--lime);font-weight:700;letter-spacing:.1em;
  text-transform:uppercase}
.ceo-sign .li{display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border-radius:100px;
  border:1px solid var(--edge-2);background:rgba(255,255,255,.06);color:var(--white);
  font-size:12.5px;font-weight:700;letter-spacing:.02em;
  transition:background .3s,color .3s,border-color .3s,transform .3s}
.ceo-sign .li:hover{background:#0a66c2;border-color:#0a66c2;color:#fff;transform:translateY(-2px)}
.ceo-sign .li svg{flex:0 0 auto}
.memoriam{margin-top:18px;padding:16px 18px;border-radius:14px;background:rgba(255,255,255,.05);
  border:1px solid var(--edge-2);color:var(--grey);font-size:13.2px;line-height:1.7}
.memoriam b{color:var(--white)}

/* ═══════ PROJECT DETAIL MODAL ═══════ */
#pmodal{position:fixed;inset:0;z-index:200;display:none;padding:5vh 5vw;overflow-y:auto}
#pmodal.on{display:block;animation:mfade .35s cubic-bezier(.22,1,.36,1)}
@keyframes mfade{from{opacity:0}to{opacity:1}}
#pmodal .pback{position:fixed;inset:0;background:rgba(4,6,12,.84);backdrop-filter:blur(14px)}
.psheet{position:relative;max-width:1100px;margin:0 auto;border-radius:26px;overflow:hidden;
  background:linear-gradient(158deg,rgba(255,255,255,.11),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(26px) saturate(170%);
  box-shadow:0 50px 110px -34px rgba(0,0,0,.95)}
.psheet .pclose{position:absolute;right:16px;top:16px;z-index:3;width:40px;height:40px;
  border-radius:50%;border:1px solid rgba(255,255,255,.24);background:rgba(8,11,20,.72);
  color:var(--white);font-size:17px;cursor:pointer;transition:background .3s,color .3s}
.psheet .pclose:hover{background:var(--lime);color:#000}
.phero{height:300px;background-size:cover;background-position:top center;position:relative}
.phero::after{content:'';position:absolute;inset:0;
  background:linear-gradient(to top,rgba(8,11,20,.96),rgba(8,11,20,.15) 70%,transparent)}
.pinner{padding:0 42px 44px;margin-top:-70px;position:relative;z-index:2}
@media(max-width:600px){.pinner{padding:0 24px 34px}}
.pinner .kind{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--lime);font-weight:700}
.pinner h3{font-size:clamp(26px,3.2vw,38px);font-weight:850;letter-spacing:-.032em;margin:8px 0 16px}
.pinner .pdesc{color:var(--grey);font-size:15px;line-height:1.78;margin-bottom:26px;max-width:760px}
.pcols{display:grid;grid-template-columns:1fr 1fr;gap:28px}
@media(max-width:760px){.pcols{grid-template-columns:1fr}}
.pinner h4{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--lime);margin-bottom:14px}
.pinner ul{list-style:none;display:grid;gap:9px}
.pinner li{color:var(--grey);font-size:13.6px;padding-left:22px;position:relative}
.pinner li::before{content:'';position:absolute;left:4px;top:8px;width:7px;height:7px;border-radius:2px;
  background:var(--lime);transform:rotate(45deg)}
.prev{padding:20px 22px;border-radius:16px;background:rgba(255,255,255,.06);
  border:1px solid var(--edge-2);margin-bottom:12px}
.prev .gstars{margin-bottom:10px}
.prev p{color:rgba(255,255,255,.82);font-size:13.6px;line-height:1.66;font-style:italic;margin-bottom:12px}
.prev .pwho{display:flex;align-items:center;gap:11px}
.prev .pwho .fl{width:36px;height:26px;border-radius:6px;display:grid;place-items:center;
  font-size:10.5px;font-weight:900;color:#0b0f18;background:linear-gradient(150deg,var(--lime),#a8d92c)}
.prev .pwho b{font-size:13.5px;font-weight:750}
.prev .pwho span{font-size:11.5px;color:var(--grey);font-weight:600}
/* review badge sitting on the project card image */
.wcard .rbadge{position:absolute;left:16px;top:16px;z-index:3;display:flex;align-items:center;gap:8px;
  padding:8px 13px;border-radius:100px;
  background:linear-gradient(158deg,rgba(255,255,255,.16),rgba(255,255,255,.07));
  border:1px solid rgba(255,255,255,.24);backdrop-filter:blur(18px) saturate(170%);
  font-size:11.5px;font-weight:750}
.wcard .rbadge .rs{display:flex;gap:2px}
.wcard .rbadge .rs svg{width:12px;height:12px}
.wcard .rquote{position:absolute;left:16px;right:16px;top:56px;z-index:3;padding:14px 15px;
  border-radius:14px;opacity:0;transform:translateY(-8px);
  background:linear-gradient(158deg,rgba(255,255,255,.15),rgba(255,255,255,.06));
  border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(20px) saturate(170%);
  color:rgba(255,255,255,.9);font-size:12.4px;line-height:1.55;font-style:italic;
  transition:opacity .45s cubic-bezier(.22,1,.36,1),transform .45s cubic-bezier(.22,1,.36,1)}
.wcard:hover .rquote{opacity:1;transform:none}

.rise{opacity:0;transform:translateY(30px);
  transition:opacity .85s cubic-bezier(.22,1,.36,1),transform .85s cubic-bezier(.22,1,.36,1)}
.rise.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition-duration:.01ms!important}.rise{opacity:1;transform:none}
}

/* ═══ SUB-PAGE COMPONENTS (from service page) ═══ */
/* breadcrumb */
.crumb{display:flex;gap:9px;align-items:center;font-size:12px;color:var(--grey);
  font-weight:700;letter-spacing:.06em;margin-bottom:24px}
.crumb a:hover{color:var(--lime)}
.crumb i{font-style:normal;opacity:.5}

/* hero */
#shero{padding-top:150px;padding-bottom:70px}
.shero{display:grid;grid-template-columns:1.15fr .85fr;gap:52px;align-items:center}
@media(max-width:960px){.shero{grid-template-columns:1fr;gap:38px}}
#shero h1{font-size:clamp(34px,5vw,64px);font-weight:900;line-height:1;letter-spacing:-.045em;margin-bottom:20px}
.stag{display:inline-flex;align-items:center;gap:9px;padding:8px 16px;border-radius:100px;
  background:rgba(255,255,255,.07);border:1px solid var(--edge);font-size:11.5px;font-weight:800;
  color:var(--lime);letter-spacing:.14em;text-transform:uppercase;margin-bottom:22px}
.sdesc{color:var(--grey);font-size:17px;line-height:1.75;margin-bottom:30px;max-width:600px}
.sicon{display:grid;place-items:center}
.sicon .box{width:min(340px,74%);aspect-ratio:1;border-radius:34px;display:grid;place-items:center;
  background:linear-gradient(158deg,rgba(255,255,255,.12),rgba(255,255,255,.035));
  border:1px solid var(--edge-2);backdrop-filter:blur(18px) saturate(150%);
  box-shadow:0 40px 90px -30px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.2)}
.sicon svg{width:52%;height:52%;filter:drop-shadow(0 14px 30px rgba(0,0,0,.7));
  animation:bob 6s ease-in-out infinite alternate}
@keyframes bob{to{transform:translateY(-14px) rotate(-4deg)}}

/* includes + platforms — slow horizontal drift, pause on hover */
@keyframes slide{to{transform:translateX(-50%)}}

.incell{flex:0 0 330px;padding:26px 24px;border-radius:18px;background:rgba(255,255,255,.06);
  border:1px solid var(--edge-2);backdrop-filter:blur(14px);
  transition:transform .35s cubic-bezier(.22,1,.36,1),border-color .35s,box-shadow .4s}
.incell:hover{transform:translateY(-7px);border-color:var(--lime);
  box-shadow:0 30px 62px -26px rgba(228,255,92,.45)}
.incell b{display:block;font-size:17.5px;font-weight:800;letter-spacing:-.025em;
  line-height:1.25;margin-bottom:9px;color:var(--white)}
.incell p{color:var(--grey);font-size:13.4px;line-height:1.62}

/* process */
.steps{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.step{position:relative;padding:28px 24px;border-radius:18px;background:rgba(255,255,255,.05);
  border:1px solid var(--edge-2);backdrop-filter:blur(14px)}
.step .sn{font-size:11px;font-weight:900;letter-spacing:.18em;color:var(--lime);margin-bottom:12px}
.step b{display:block;font-size:17px;font-weight:800;letter-spacing:-.02em;margin-bottom:7px}
.step p{color:var(--grey);font-size:13.2px;line-height:1.6}

/* stack chips */
.chip{flex:0 0 auto;padding:13px 24px;border-radius:100px;font-size:14.5px;font-weight:750;
  background:rgba(255,255,255,.06);border:1px solid var(--edge-2);color:var(--white);
  white-space:nowrap;transition:border-color .35s,background .35s,transform .35s}
.chip:hover{border-color:var(--lime);background:rgba(228,255,92,.12);transform:translateY(-4px)}

/* other services */
.others{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.oth{display:flex;align-items:center;gap:13px;padding:16px 18px;border-radius:14px;
  background:rgba(255,255,255,.05);border:1px solid var(--edge-2);
  transition:transform .3s,border-color .3s,background .3s}
.oth:hover{transform:translateY(-5px);border-color:var(--lime);background:rgba(228,255,92,.09)}
.oth svg{width:32px;height:32px;flex:0 0 auto}
.oth span{font-size:13.8px;font-weight:750;letter-spacing:-.015em}

/* cta band */
.band{border-radius:26px;padding:64px 6%;text-align:center;
  background:linear-gradient(154deg,rgba(167,123,255,.17),rgba(99,234,255,.07) 52%,rgba(255,255,255,.035));
  border:1px solid var(--edge-2);backdrop-filter:blur(16px)}
.band h2{margin-bottom:14px}
.band p{color:var(--grey);max-width:560px;margin:0 auto 30px;font-size:15.5px}


/* ══════════════════════════════════════════════════════════════════
   PORTFOLIO — live client sites.
   Description text sits below the screenshot rather than over it:
   overlaid copy looks good but search engines and screen readers both
   do better with real, readable body text, and this section exists as
   much for ranking as for show.
   ══════════════════════════════════════════════════════════════════ */
.agrid{display:grid;gap:22px;margin-top:40px;
  grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}
.acard{position:relative;display:flex;flex-direction:column;border-radius:22px;overflow:hidden;
  text-decoration:none;color:inherit;
  background:linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.03));
  border:1px solid var(--edge-2);backdrop-filter:blur(16px) saturate(1.2);
  transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .5s,border-color .45s}
.acard:hover{transform:translateY(-9px);border-color:var(--lime);
  box-shadow:0 44px 92px -32px rgba(228,255,92,.42)}
/* The gradient shows through if a screenshot has not been uploaded yet, so a
   missing file degrades to a labelled panel instead of a broken-image icon. */
.ashot{position:relative;aspect-ratio:16/10;overflow:hidden;flex:0 0 auto;
  background:linear-gradient(150deg,var(--ink-2),rgba(228,255,92,.08))}
.ashot img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;
  filter:brightness(.92) saturate(1.02);
  font-size:12px;line-height:1.6;color:var(--grey);text-align:center;
  transition:transform 1s cubic-bezier(.22,1,.36,1),filter .5s}
.acard:hover .ashot img{transform:scale(1.06);filter:brightness(1.04) saturate(1.12)}
.ashot::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top,rgba(8,11,20,.72),transparent 46%)}
/* live badge — a small honesty signal: these are shipped, not mockups */
.alive{position:absolute;top:13px;left:13px;z-index:2;display:inline-flex;align-items:center;
  gap:7px;padding:6px 12px;border-radius:100px;font-size:10.5px;font-weight:800;
  letter-spacing:.13em;text-transform:uppercase;color:#dfffa6;
  background:rgba(8,11,20,.62);border:1px solid rgba(228,255,92,.4);backdrop-filter:blur(9px)}
.alive i{width:6px;height:6px;border-radius:50%;background:var(--lime);
  box-shadow:0 0 0 0 rgba(228,255,92,.7);animation:apulse 2.4s infinite}
.alive.case{color:var(--gold);border-color:rgba(242,223,174,.42)}
@keyframes apulse{70%{box-shadow:0 0 0 8px rgba(228,255,92,0)}100%{box-shadow:0 0 0 0 rgba(228,255,92,0)}}
.aflag{position:absolute;top:13px;right:13px;z-index:2;padding:6px 11px;border-radius:100px;
  font-size:11px;font-weight:750;color:var(--white);
  background:rgba(8,11,20,.6);border:1px solid var(--edge-2);backdrop-filter:blur(9px)}
.abody{padding:22px 22px 24px;display:flex;flex-direction:column;flex:1 1 auto}
.abody .kind{font-size:11px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--lime);font-weight:800;margin-bottom:9px}
.abody h3{font-size:19.5px;font-weight:830;letter-spacing:-.025em;line-height:1.22;
  margin-bottom:7px;color:#fff}
/* attribution line — the same claim the alt text and ItemList schema make.
   The category label above is also lime, so this stays sentence case at a
   lower weight to keep the two lines visually separate. */
.abuilt{font-size:11.5px;font-weight:650;letter-spacing:.03em;color:var(--lime);
  opacity:.88;margin-bottom:12px}
.abuilt b{font-weight:800;opacity:1}
.abody p{color:var(--grey);font-size:13.4px;line-height:1.68;margin-bottom:15px;flex:1 1 auto}
.abody p b{color:#e9eefc;font-weight:700}
.atags{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:17px}
.atags span{font-size:11px;font-weight:700;padding:5px 11px;border-radius:100px;
  color:#b9c4dc;background:rgba(255,255,255,.055);border:1px solid var(--edge-2)}
.ago{display:inline-flex;align-items:center;gap:9px;font-size:13.5px;font-weight:800;
  color:var(--lime);align-self:flex-start;transition:gap .35s}
.acard:hover .ago{gap:15px}
.ago.dim{color:var(--grey);cursor:default}
/* app cards open a detail panel, so they need to read and behave as buttons */
.acard[role=button]{cursor:pointer}
.acard[role=button]:focus-visible{outline:2px solid var(--lime);outline-offset:3px}

/* ══════ APP DETAIL PANEL ══════ */
.amodal{position:fixed;inset:0;z-index:120;display:flex;align-items:center;
  justify-content:center;padding:24px}
.amodal[hidden]{display:none}
.amback{position:absolute;inset:0;background:rgba(4,6,12,.82);
  backdrop-filter:blur(10px) saturate(1.1);animation:amfade .3s ease both}
@keyframes amfade{from{opacity:0}to{opacity:1}}
.ampanel{position:relative;z-index:1;width:min(760px,100%);max-height:calc(100vh - 48px);
  overflow-y:auto;overscroll-behavior:contain;border-radius:24px;
  background:linear-gradient(165deg,#141a30,#0b0f1c 62%);
  border:1px solid var(--edge-2);box-shadow:0 60px 120px -30px rgba(0,0,0,.8);
  animation:amrise .42s cubic-bezier(.22,1,.36,1) both}
@keyframes amrise{from{opacity:0;transform:translateY(26px) scale(.985)}to{opacity:1;transform:none}}
.amx{position:absolute;top:14px;right:14px;z-index:3;width:40px;height:40px;border-radius:50%;
  display:grid;place-items:center;cursor:pointer;color:#fff;
  background:rgba(8,11,20,.68);border:1px solid var(--edge-2);backdrop-filter:blur(10px);
  transition:background .3s,border-color .3s,transform .3s}
.amx:hover{background:var(--lime);color:var(--ink);border-color:var(--lime);transform:rotate(90deg)}
.amx:focus-visible{outline:2px solid var(--lime);outline-offset:3px}
.amx svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round}
.amshot{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:24px 24px 0 0;
  background:linear-gradient(150deg,var(--ink-2),rgba(228,255,92,.08))}
.amshot img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.amshot::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top,#0f1425,transparent 58%)}
.ambody{padding:6px 34px 34px;margin-top:-34px;position:relative;z-index:2}
/* kept left-aligned: pushing the chip to the right edge floats it over the
   bright part of the screenshot, where it reads as debris rather than a label */
.amtop{display:flex;align-items:center;gap:13px;flex-wrap:wrap;margin-bottom:11px}
.amplat{font-size:11.5px;font-weight:700;color:var(--white);padding:6px 12px;border-radius:100px;
  background:rgba(255,255,255,.07);border:1px solid var(--edge-2)}
.ampanel h2{font-size:clamp(25px,3.4vw,34px);font-weight:840;letter-spacing:-.03em;
  line-height:1.14;margin-bottom:8px;color:#fff}
.ampanel .kind{font-size:11px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--lime);font-weight:800}
.ampanel > .ambody > p{color:var(--grey);font-size:14.4px;line-height:1.76;margin-top:14px}
.amh{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--lime);
  font-weight:800;margin:26px 0 13px}
.amfeat{list-style:none;display:grid;gap:10px}
.amfeat li{position:relative;padding-left:27px;color:#c9d2e6;font-size:13.8px;line-height:1.66}
.amfeat li::before{content:'';position:absolute;left:2px;top:8px;width:8px;height:8px;
  border-radius:2px;background:var(--lime);transform:rotate(45deg)}
.amcta{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:30px}
.ambtn{display:inline-flex;align-items:center;gap:11px;padding:15px 27px;border-radius:100px;
  font-size:14.5px;font-weight:830;text-decoration:none;color:var(--ink);
  background:var(--lime);border:1px solid var(--lime);cursor:pointer;
  box-shadow:0 18px 40px -14px rgba(228,255,92,.6);transition:gap .32s,transform .32s,box-shadow .32s}
.ambtn:hover{gap:17px;transform:translateY(-2px);box-shadow:0 26px 52px -14px rgba(228,255,92,.75)}
.amghost{padding:15px 25px;border-radius:100px;font-size:14px;font-weight:750;cursor:pointer;
  color:var(--grey);background:transparent;border:1px solid var(--edge-2);
  transition:color .3s,border-color .3s}
.amghost:hover{color:#fff;border-color:var(--grey)}
.amnote{color:var(--grey);font-size:12.6px;line-height:1.66;margin-top:16px;max-width:460px}
body.amopen{overflow:hidden}
@media(max-width:620px){
  .amodal{padding:0}
  .ampanel{width:100%;max-height:100vh;border-radius:0;border:0}
  .amshot{border-radius:0;aspect-ratio:16/10}
  .ambody{padding:6px 20px 30px}
}
@media(prefers-reduced-motion:reduce){
  .amback,.ampanel{animation:none}
  .amx:hover{transform:none}
}

.acred{margin-top:38px;padding:20px 24px;border-radius:16px;font-size:13.4px;color:var(--grey);
  line-height:1.7;background:rgba(255,255,255,.04);border:1px solid var(--edge-2)}
.acred b{color:#fff;font-weight:750}

/* ══════════════════════════════════════════════════════════════════
   v3 — SAME DESIGN, PREMIUM TYPE
   Layout, colours, glass cards, 3D ring and neural sphere are unchanged.
   Only the typefaces change, plus polish for the new sub-pages.
   Display: Barlow Condensed (SpaceX / NASA style) · Body: Barlow ·
   Labels & data: IBM Plex Mono — all self-hosted.
   ══════════════════════════════════════════════════════════════════ */
:root{--f-disp:'Barlow Condensed','Arial Narrow',sans-serif;--f-body:'Barlow','Helvetica Neue',Arial,sans-serif;
  --f-mono:'IBM Plex Mono',ui-monospace,Menlo,monospace}
body{font-family:var(--f-body);font-size:16.5px;letter-spacing:0}
h1,h2,h3,h4{font-family:var(--f-disp)}
h1{text-transform:uppercase;font-weight:700;letter-spacing:-.005em;line-height:.94}
h2{text-transform:uppercase;font-weight:700;letter-spacing:0;line-height:.98}
h3{text-transform:uppercase;font-weight:600;letter-spacing:.01em}
.scard h3,.wcard h3,.pdetail h3,.bcard h3,.mem h4,.tcard .nm,.acard h3,.abody h3,.ampanel h2,.incell b,.step b,.pinner h3{
  font-family:var(--f-disp);text-transform:uppercase;font-weight:600;letter-spacing:.01em}
.scard h3{font-size:25px}.wcard h3{font-size:23px}.pdetail h3{font-size:32px}.bcard h3{font-size:23px;line-height:1.08}
.abody h3{font-size:23px;line-height:1.08}.incell b{font-size:21px}.step b{font-size:21px}.mem h4{font-size:21px}
.pitem .t{font-family:var(--f-disp);font-size:19px;font-weight:600;text-transform:uppercase;letter-spacing:.01em}
.brand{font-family:var(--f-disp);font-size:19px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.brand span{font-family:var(--f-disp);font-size:17px;letter-spacing:0}
.eyebrow,.tagline,.stag,.kind,.scard .tag,.pitem .d,.pitem .n,.hs small,.counter,.hintscroll,.svcnav-lbl,.bdate,.bcard .cat,
.abody .kind,.alive,.pdetail .meta span,.mem .role,.reel .plat,.gd,.f label,.cinfo b,footer h5,.crumb,.sn,.amh,.ampanel .kind,.fpin,.tcard .svc{
  font-family:var(--f-mono);font-weight:500;letter-spacing:.14em}
.eyebrow{font-size:11.5px}
.btn,.nav-cta,.wa,.ambtn,.switch button,.gall,.scard .go,.ago,.bgo,.fgo,.vrow button{
  font-family:var(--f-disp);font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:14.5px}
.links a{font-family:var(--f-disp);font-weight:500;text-transform:uppercase;letter-spacing:.16em;font-size:14px}
.hs b,.counter b,.scard .no{font-family:var(--f-disp);letter-spacing:0}
.hs b{font-size:38px;font-weight:700}
.hero-p,.lede,.sdesc{font-weight:400}
.hero-p{font-size:18px}.lede{font-size:16.5px}.sdesc{font-size:18px}
.ceo-txt blockquote{font-family:var(--f-disp);text-transform:uppercase;font-weight:500;letter-spacing:.01em;line-height:1.2;font-size:clamp(21px,2.2vw,28px)}
.f input,.f select,.f textarea{font-family:var(--f-body)}

/* ── header: dropdowns + mobile menu ── */
nav.site{gap:26px}
.links{align-items:center;gap:6px}
.links>a,.dd>a{padding:10px 12px;display:block}
.dd{position:relative}
.dd>a::after{content:'';display:inline-block;width:6px;height:6px;margin-left:8px;border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;transform:translateY(-3px) rotate(45deg);opacity:.6}
.ddp{position:absolute;top:100%;left:-12px;min-width:320px;padding:12px;border-radius:16px;
  background:rgba(12,16,32,.96);border:1px solid var(--edge-2);backdrop-filter:blur(22px);
  box-shadow:0 30px 70px -20px rgba(0,0,0,.9);opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .25s,transform .25s,visibility .25s;display:grid;grid-template-columns:1fr 1fr;gap:2px;width:560px}
.dd:hover .ddp,.dd:focus-within .ddp{opacity:1;visibility:visible;transform:none}
.ddp a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;font-family:var(--f-body);
  text-transform:none;letter-spacing:0;font-size:14.5px;font-weight:500;color:#dfe5f2;transition:background .2s,color .2s}
.ddp a:hover{background:rgba(228,255,92,.1);color:var(--lime)}
.ddp svg{width:24px;height:24px;flex:0 0 auto}
.ddp .all{grid-column:1/-1;border-top:1px solid var(--edge-2);margin-top:6px;padding-top:14px;border-radius:0 0 10px 10px;
  font-family:var(--f-disp);text-transform:uppercase;letter-spacing:.14em;color:var(--lime);font-size:13.5px}
.burger{display:none;width:44px;height:44px;border-radius:10px;border:1px solid var(--edge-2);background:rgba(255,255,255,.05);
  cursor:pointer;position:relative;flex:0 0 auto}
.burger span{position:absolute;left:12px;right:12px;height:1.6px;background:#fff;transition:transform .3s,top .3s}
.burger span:first-child{top:16px}.burger span:last-child{top:26px}
.burger[aria-expanded=true] span:first-child{top:21px;transform:rotate(45deg)}
.burger[aria-expanded=true] span:last-child{top:21px;transform:rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:99;padding:92px 6vw 40px;overflow-y:auto;background:rgba(8,11,20,.98);backdrop-filter:blur(20px)}
.mnav details{border-bottom:1px solid var(--edge-2)}
.mnav summary,.mnav>a{display:block;padding:18px 0;font-family:var(--f-disp);font-weight:600;font-size:26px;
  text-transform:uppercase;letter-spacing:.04em;cursor:pointer;list-style:none;border-bottom:1px solid var(--edge-2)}
.mnav details summary{border-bottom:0}
.mnav summary::-webkit-details-marker{display:none}
.mnav details a{display:block;padding:9px 0 9px 4px;color:var(--grey);font-size:16px}
.mnav details div{padding-bottom:14px}
.mnav .btn{margin-top:28px;width:100%;text-align:center}
@media(max-width:1050px){.burger{display:block}.nav-cta{display:none}}
@media(max-width:1180px) and (min-width:1051px){.links>a,.dd>a{padding:10px 8px}.links a{letter-spacing:.1em}}

/* ── sub-page shared blocks ── */
.split{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);gap:52px;align-items:start}
@media(max-width:900px){.split{grid-template-columns:1fr;gap:26px}}
.prose p{color:#c9d1e3;font-size:17.5px;line-height:1.78;margin-bottom:16px}
.prose p:last-child{margin-bottom:0}
.prose b,.prose strong{color:#fff;font-weight:600}
.glass{border-radius:22px;background:linear-gradient(158deg,rgba(255,255,255,.09),rgba(255,255,255,.03));
  border:1px solid var(--edge-2);backdrop-filter:blur(16px)}
.faq{display:grid;gap:10px}
.faq details{border-radius:16px;background:rgba(255,255,255,.05);border:1px solid var(--edge-2);transition:border-color .3s,background .3s}
.faq details[open]{border-color:var(--edge);background:rgba(228,255,92,.05)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:18px;align-items:center;
  padding:20px 22px;font-family:var(--f-disp);font-weight:600;font-size:20px;text-transform:uppercase;letter-spacing:.02em}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{flex:0 0 auto;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--edge);
  color:var(--lime);font-style:normal;font-size:18px;transition:transform .3s}
.faq details[open] summary i{transform:rotate(45deg)}
.faq details p{padding:0 22px 22px;color:var(--grey);font-size:15.5px;line-height:1.72}
.facts{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.facts span{padding:9px 15px;border-radius:100px;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;
  background:rgba(255,255,255,.07);border:1px solid var(--edge-2);color:#e7ecf7}
.facts span b{color:var(--lime);font-weight:500;margin-right:6px}
.inst .facts span b,.inst .stag{color:var(--gold)}
.inst .stag{border-color:rgba(242,223,174,.35)}
.ticks{list-style:none;display:grid;gap:11px}
.ticks li{position:relative;padding-left:26px;color:#d3dbec;font-size:15.5px;line-height:1.6}
.ticks li::before{content:'';position:absolute;left:3px;top:8px;width:8px;height:8px;border-radius:2px;background:var(--lime);transform:rotate(45deg)}
.sub-h{font-family:var(--f-disp);font-size:20px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;margin:30px 0 14px;color:#fff}
.sec-top{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.sec-top .lede{margin-bottom:34px}
.more{display:inline-flex;align-items:center;gap:9px;font-family:var(--f-disp);font-weight:600;text-transform:uppercase;letter-spacing:.14em;
  font-size:14px;color:var(--lime);margin-bottom:38px;padding:11px 18px;border-radius:100px;border:1px solid var(--edge);transition:background .3s,color .3s}
.more:hover{background:var(--lime);color:#000}
.cgrid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
.ccard{position:relative;display:flex;flex-direction:column;padding:26px 24px 24px;border-radius:20px;
  background:linear-gradient(158deg,rgba(255,255,255,.09),rgba(255,255,255,.03));border:1px solid var(--edge-2);backdrop-filter:blur(14px);
  transition:transform .4s cubic-bezier(.22,1,.36,1),border-color .4s,box-shadow .45s}
.ccard:hover{transform:translateY(-7px);border-color:var(--lime);box-shadow:0 34px 72px -28px rgba(228,255,92,.42)}
.ccard .cico{width:54px;height:54px;margin-bottom:18px}
.ccard .cico svg{width:100%;height:100%;filter:drop-shadow(0 8px 18px rgba(0,0,0,.6))}
.ccard .kind{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--lime);margin-bottom:8px}
.ccard h3{font-size:24px;line-height:1.02;margin-bottom:10px}
.ccard p{color:var(--grey);font-size:14.5px;line-height:1.62;flex:1}
.ccard .go{margin-top:16px;padding-top:13px;border-top:1px solid var(--edge-2);font-family:var(--f-disp);font-weight:600;text-transform:uppercase;
  letter-spacing:.14em;font-size:13.5px;color:var(--lime);display:flex;justify-content:space-between}
.ccard ul{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.ccard li{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:#b9c4dc;padding:6px 10px;border-radius:100px;
  border:1px solid var(--edge-2);background:rgba(255,255,255,.04)}
.inst .ccard:hover{border-color:var(--gold);box-shadow:0 34px 72px -28px rgba(242,223,174,.35)}
.inst .ccard .kind,.inst .ccard .go{color:var(--gold)}
.track-h{display:flex;align-items:center;gap:14px;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold);margin:40px 0 18px}
.track-h::after{content:'';flex:1;height:1px;background:var(--edge-2)}
.mods{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.inst .step .sn{color:var(--gold)}
.mapbox{border-radius:22px;overflow:hidden;border:1px solid var(--edge-2);aspect-ratio:4/3;background:var(--ink-2)}
.mapbox iframe{width:100%;height:100%;border:0;filter:invert(92%) hue-rotate(180deg) contrast(.92) saturate(.75)}
.revgrid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.rv-card{padding:26px 24px;border-radius:20px;background:linear-gradient(158deg,rgba(255,255,255,.09),rgba(255,255,255,.03));
  border:1px solid var(--edge-2);display:flex;flex-direction:column}
.rv-card .gstars{margin-bottom:12px}
.rv-card blockquote{color:#d7deee;font-size:15px;line-height:1.7;flex:1;margin-bottom:18px}
.rv-card .who{padding-top:14px;border-top:1px solid var(--edge-2)}
.rv-card .who b{display:block;font-family:var(--f-disp);font-size:18px;font-weight:600;text-transform:uppercase;letter-spacing:.03em}
.rv-card .who span{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey)}
.clients{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.client{display:flex;align-items:center;gap:13px;padding:16px 18px;border-radius:16px;background:rgba(255,255,255,.05);border:1px solid var(--edge-2)}
.client .nm{font-family:var(--f-disp);font-weight:600;font-size:18px;text-transform:uppercase;letter-spacing:.02em;line-height:1.1}
.client .cy{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--grey)}
.pager{display:flex;gap:8px;justify-content:center;margin-top:44px}
.pager a,.pager span{min-width:44px;height:44px;display:grid;place-items:center;border-radius:10px;border:1px solid var(--edge-2);padding:0 12px;font-family:var(--f-disp);font-weight:600}
.pager .current{background:var(--lime);color:#000;border-color:var(--lime)}
.bgrid{display:grid;gap:22px;grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.bgrid .bcard{flex:none;height:480px}
.article{max-width:800px;margin:0 auto}
.article-hero img{width:100%;border-radius:22px;border:1px solid var(--edge-2);margin-bottom:40px}
.entry{font-size:18px;line-height:1.8;color:#d3dbec}
.entry>*+*{margin-top:1.1em}
.entry h2{font-size:34px;margin-top:1.6em}.entry h3{font-size:26px;margin-top:1.4em}.entry h4{font-size:21px}
.entry a{color:var(--lime);text-decoration:underline;text-underline-offset:3px}
.entry ul,.entry ol{padding-left:1.3em}.entry ul{list-style:disc}.entry ol{list-style:decimal}
.entry img{border-radius:16px}
.entry blockquote{padding:18px 22px;border-left:3px solid var(--lime);background:rgba(255,255,255,.04);border-radius:0 14px 14px 0}
.entry table{width:100%;border-collapse:collapse}.entry td,.entry th{border:1px solid var(--edge-2);padding:10px}
.wa-float{position:fixed;right:20px;bottom:20px;z-index:90;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;
  background:#25d366;color:#fff;box-shadow:0 12px 30px -8px rgba(37,211,102,.6);transition:transform .3s}
.wa-float:hover{transform:translateY(-3px) scale(1.05)}
.wa-float svg{width:28px;height:28px}
.fnote a{color:var(--lime)}
@media(max-width:600px){#shero{padding-top:120px}.faq summary{font-size:18px}}
/* visible at rest — reveal animates position only */
.rise{opacity:1;transform:translateY(22px)}
.rise.in{transform:none}
button.wcard{padding:0;text-align:left;cursor:pointer;font:inherit;color:inherit}
.pd[hidden]{display:none}
.shot{background-size:cover}
.fgrid[hidden]{display:none!important}

/* ══ v3.1 — hero headline restored to the original face; tighter spacing ══ */
section{padding:60px 0}
#hero{min-height:auto;padding-top:120px;padding-bottom:44px}
.strip{margin-bottom:0}
.svcnav{padding:44px 0 0}
.pin{padding-top:40px}
.pinhead{margin-bottom:22px}
.lede{margin-bottom:26px}
.eyebrow{margin-bottom:12px}
h2{margin-bottom:12px}
.cta-row{margin-bottom:0}
.hero-copy .cta-row{margin-bottom:36px}
#shero{padding-top:118px;padding-bottom:36px}
.crumb{margin-bottom:16px}
.stag{margin-bottom:16px}
.sdesc{margin-bottom:22px}
.sicon .box{width:min(280px,64%)}
footer{margin-top:0;padding-top:60px}
.f-base{margin-top:34px}
.band{padding:48px 6%}
.inst-card{padding:52px 5% 50px}
.inst-head{margin-bottom:30px}
.inst-cta{margin-top:30px}
#work .marq-in,#students .marq-in,#reels .marq-in,#blogs .marq-in{padding:8px 0 14px}
.more{margin-bottom:26px}
.track-h{margin:28px 0 14px}
.split{gap:40px}
@media(max-width:700px){section{padding:44px 0}#hero{padding-top:100px}#shero{padding-top:100px}.pin{padding:44px 0 30px}}
/* menu: current page + tighter dropdown */
.links a[aria-current=page],.links .dd.on>a{color:var(--lime)}
.ddp{padding:10px;gap:0}
.ddp a{padding:9px 11px}


/* ══════════════════════════════════════════════════════════════════
   v3.2 — EARTH, HERO TYPE, GLOSS
   ══════════════════════════════════════════════════════════════════ */
:root{--f-wide:'Archivo','Barlow Condensed',sans-serif}
/* deep-space ground behind the Earth */
body{background:
  radial-gradient(60vw 50vw at 88% -6%,rgba(99,234,255,.10),transparent 60%),
  radial-gradient(50vw 44vw at 0% 52%,rgba(228,255,92,.06),transparent 62%),
  radial-gradient(56vw 50vw at 70% 100%,rgba(242,223,174,.06),transparent 62%),
  linear-gradient(180deg,#05070e 0%,#080b14 40%,#070a12 100%);background-attachment:fixed}
#ai{opacity:0;transition:opacity 1.6s ease}
#ai.ready{opacity:1}
#vign{background:radial-gradient(ellipse at 50% 46%,transparent 52%,rgba(5,7,14,.72) 100%)}

/* headline: Archivo Expanded */
h1,h2{font-family:var(--f-wide);font-stretch:125%;font-weight:800;text-transform:uppercase;letter-spacing:-.012em}
h1{font-size:clamp(34px,4.8vw,68px);line-height:1.0}
#hero h1{font-size:clamp(30px,3.9vw,58px);margin-bottom:20px;white-space:nowrap}
.hero-copy{max-width:640px}
@media(max-width:560px){#hero h1{white-space:normal}}
h2{font-size:clamp(26px,3.4vw,46px);line-height:1.04}
.pdetail h3,.ampanel h2{font-family:var(--f-disp);font-stretch:100%}
.ampanel h2{font-size:clamp(25px,3.2vw,34px)}
h1 .lime,h2 .lime{background-size:240% auto;animation:sweep 9s linear infinite}

/* Learn → Build → Earn */
.leb{display:inline-flex;align-items:center;gap:16px;margin:0 0 26px;padding:12px 22px;border-radius:100px;
  font-family:var(--f-wide);font-stretch:125%;font-weight:700;font-size:clamp(13px,1.25vw,16px);letter-spacing:.2em;text-transform:uppercase;color:#fff;
  background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 18px 40px -22px rgba(228,255,92,.45);backdrop-filter:blur(14px)}
.leb i{font-style:normal;color:var(--lime);letter-spacing:0;font-weight:400}
.leb span:last-child{color:var(--lime)}
.hero-p{font-size:17.5px;line-height:1.7}
.hero-p.two{font-size:15.5px;margin-bottom:28px}

/* mission-control readouts */
.hud{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:40px;padding-top:16px;border-top:1px solid var(--edge-2);
  font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--grey)}
.hud span::before{content:'';display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--lime);margin-right:9px;vertical-align:2px;box-shadow:0 0 8px var(--lime)}
.hud b{color:#fff;font-weight:500}

/* orbit labels that follow the satellites */
.orb-tag{position:fixed;left:0;top:0;z-index:3;pointer-events:none;opacity:0;transition:opacity .5s;padding:8px 12px;border-radius:10px;
  background:linear-gradient(180deg,rgba(14,19,36,.82),rgba(8,11,20,.72));border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(10px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.orb-tag.on{opacity:1}
.orb-tag b{display:block;font-family:var(--f-mono);font-weight:500;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--lime)}
#orbB b{color:var(--gold)}
.orb-tag span{font-size:12.5px;color:#e6ebf6}

/* phones / no WebGL: a still of the same Earth, screen-blended into space */
.no-earth #hero::before{content:'';position:absolute;z-index:0;pointer-events:none;right:-4vw;top:70px;width:min(52vw,760px);aspect-ratio:1;
  background:url(earth/still.webp) center/contain no-repeat}
#hero>.wrap{position:relative;z-index:4}
@media(max-width:700px){
  .no-earth #hero::before{content:'';position:absolute;z-index:0;pointer-events:none;left:50%;right:auto;transform:translateX(-50%);top:64px;width:112vw;aspect-ratio:1;
    background:url(earth/still.webp) center/contain no-repeat}
  #hero{overflow-x:clip}
  #hero .hero-copy{padding-top:82vw}
  .leb{gap:10px;padding:10px 16px;letter-spacing:.14em}.hud{gap:8px 18px}
}
/* ── GLOSS: specular light on glass, sheen on buttons ── */
.scard,.acard,.ccard,.step,.incell,.rv-card,.gcard,.tcard,.pdetail,.fbox,.cinfo div,.band,.inst-card,.client,.oth,.faq details,.sicon .box,.ceo,.bcard .bbody{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 -1px 0 rgba(255,255,255,.03),0 24px 60px -34px rgba(0,0,0,.9)}
.btn.solid,.nav-cta,.wa,.ambtn{background:linear-gradient(180deg,#f1ff9b 0%,#e4ff5c 46%,#cfee3a 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -1px 0 rgba(0,0,0,.12),0 12px 28px -14px rgba(228,255,92,.75);position:relative;overflow:hidden}
.btn.solid::after,.nav-cta::after,.wa::after{content:'';position:absolute;top:0;bottom:0;width:40%;left:-60%;transform:skewX(-20deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transition:left .7s cubic-bezier(.22,1,.36,1)}
.btn.solid:hover::after,.nav-cta:hover::after,.wa:hover::after{left:120%}
.btn.line{background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.02));box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
nav.site{background:linear-gradient(180deg,rgba(12,16,30,.82),rgba(8,11,20,.68));box-shadow:inset 0 -1px 0 rgba(255,255,255,.06),0 10px 30px -20px rgba(0,0,0,.8)}
.brand span{background:linear-gradient(180deg,#f1ff9b,#d7f43f);box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
#shero h1{font-size:clamp(28px,3.3vw,48px);line-height:1.04}
h2{font-size:clamp(24px,2.8vw,40px)}
html:not(.no-earth) .sicon .box{display:none}


/* ══════════════════════════════════════════════════════════════════
   v3.3 — ONE GLASS STYLE FOR EVERY CARD (like the stack pills):
   see-through, lightly frosted, so the Earth reads through.
   Hover = the same shiny flash as the lime buttons.
   ══════════════════════════════════════════════════════════════════ */
.scard,.acard,.ccard,.step,.incell,.rv-card,.gcard,.tcard,.pdetail,.fbox,.cinfo div,.band,.inst-card,.client,.oth,.faq details,
.bcard .bbody,.chip,.switch,.pitem.on,.ceo,.mem,.agrid .abody{
  background:linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.02))!important;
  border:1px solid rgba(255,255,255,.15)!important;
  -webkit-backdrop-filter:blur(7px) saturate(140%);backdrop-filter:blur(7px) saturate(140%)}
.agrid .abody{border:0!important;background:none!important;backdrop-filter:none}
.scard.mid{background:linear-gradient(160deg,rgba(228,255,92,.13),rgba(255,255,255,.03))!important;border-color:var(--lime)!important}
.pitem.on{border-color:var(--lime)!important}
.inst-card,.band{background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.015))!important}
.ashot{background:rgba(255,255,255,.03)}
/* shiny flash on hover */
.scard,.acard,.ccard,.step,.incell,.rv-card,.gcard,.tcard,.client,.oth,.faq details,.cinfo div,.chip,.mem{position:relative;overflow:hidden}
.scard::after,.acard::after,.ccard::after,.step::after,.incell::after,.rv-card::after,.gcard::after,.tcard::after,.client::after,.oth::after,
.faq details::after,.cinfo div::after,.chip::after,.mem::after{
  content:'';position:absolute;top:-10%;bottom:-10%;left:-70%;width:45%;z-index:5;pointer-events:none;transform:skewX(-20deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.08) 30%,rgba(255,255,255,.32) 50%,rgba(255,255,255,.08) 70%,transparent);
  opacity:0;transition:none}
.scard:hover::after,.acard:hover::after,.ccard:hover::after,.step:hover::after,.incell:hover::after,.rv-card:hover::after,.gcard:hover::after,
.tcard:hover::after,.client:hover::after,.oth:hover::after,.faq details:hover::after,.cinfo div:hover::after,.chip:hover::after,.mem:hover::after{
  animation:flash .85s cubic-bezier(.22,1,.36,1) forwards}
@keyframes flash{0%{left:-70%;opacity:1}100%{left:130%;opacity:1}}
.scard:hover,.acard:hover,.ccard:hover,.step:hover,.incell:hover,.rv-card:hover,.client:hover,.oth:hover,.chip:hover{
  border-color:rgba(228,255,92,.55)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 26px 60px -28px rgba(228,255,92,.35)}
@media(prefers-reduced-motion:reduce){[class]::after{animation:none!important}}
/* brand name beside the logo */
.brand{font-size:17px;letter-spacing:.1em;white-space:nowrap}
@media(max-width:420px){.brand{font-size:14px;letter-spacing:.06em}}
/* the journey's destination: a clear window onto Bannu above the footer */
.landing{min-height:100vh;display:flex;align-items:flex-end;padding:0 0 70px}
.land-in{max-width:560px;padding:28px 30px;border-radius:22px;background:linear-gradient(160deg,rgba(14,19,36,.72),rgba(8,11,20,.55));
  border:1px solid rgba(228,255,92,.35);backdrop-filter:blur(10px);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 30px 70px -30px rgba(228,255,92,.35)}
.land-in h2{font-size:clamp(22px,2.4vw,34px)}
.land-in p{color:#cfd6e6;font-size:15.5px;line-height:1.7;margin-bottom:20px}
.no-earth .landing{background:url(earth/still.webp) center 30%/min(100vw,820px) no-repeat}
@media(max-width:700px){.landing{min-height:80vh}.no-earth .landing{background:url(earth/still.webp) center 10%/120vw no-repeat}}
footer{background:rgba(6,8,15,.94)}

/* ═══════ v3.4 — CINEMATIC SERVICES (replaces the 3D ring) ═══════ */
.cine{position:relative;margin-top:26px}
.cine-pin{position:relative;height:100vh;height:100svh;overflow:hidden}
.cine-track{display:flex;gap:2.4vw;height:100%;padding:92px 5vw 34px;width:max-content;will-change:transform}
html:not(.gs) .cine-pin{height:auto;overflow-x:auto;scroll-snap-type:x mandatory}
html:not(.gs) .cine-track{height:88vh}
.cpanel{position:relative;flex:0 0 auto;width:min(84vw,1500px);height:100%;border-radius:26px;overflow:hidden;isolation:isolate;
  display:block;color:var(--white);text-decoration:none;background:#05070d;scroll-snap-align:center;
  border:1px solid rgba(255,255,255,.1);box-shadow:0 40px 90px -40px rgba(0,0,0,.9)}
.cp-intro{width:min(64vw,1100px)}
.cp-media{position:absolute;inset:0;overflow:hidden;z-index:-2}
.cp-media img,.cp-vid{position:absolute;top:0;left:-10%;width:120%;height:100%;object-fit:cover;transform:scale(1.04);transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.cp-vid{left:0;width:100%;z-index:-2}
.cpanel:hover .cp-media img{transform:scale(1.09)}
.cp-shade{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,rgba(4,6,12,.92) 0%,rgba(4,6,12,.62) 38%,rgba(4,6,12,.08) 72%),linear-gradient(0deg,rgba(4,6,12,.9) 0%,rgba(4,6,12,0) 46%),
  radial-gradient(120% 90% at 100% 0%,rgba(228,255,92,.09),transparent 60%)}
.cpanel::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:1;opacity:.16;mix-blend-mode:overlay;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.cp-copy{position:absolute;left:clamp(24px,4.4vw,72px);right:clamp(24px,4vw,72px);bottom:clamp(26px,5.5vh,64px);z-index:2;max-width:860px}
.cp-meta{display:flex;align-items:baseline;gap:10px;margin-bottom:14px;font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--grey)}
.cp-no{font-size:15px;color:var(--lime)}
.cp-tag{margin-left:12px;padding:5px 11px;border:1px solid rgba(228,255,92,.35);border-radius:99px;color:var(--lime);font-size:10.5px}
.cp-title,.cp-big{font-family:'Archivo',sans-serif;font-stretch:125%;font-weight:800;text-transform:uppercase;letter-spacing:-.025em;line-height:.92;
  font-size:clamp(40px,6.2vw,104px);margin:0 0 22px;text-wrap:balance}
.cp-big{font-size:clamp(46px,7vw,118px)}
.cp-lede{font-size:clamp(15px,1.25vw,18px);color:#c9d0de;max-width:520px;line-height:1.6}
.cp-pts{list-style:none;display:flex;flex-wrap:wrap;gap:10px 26px;margin:0 0 26px;padding:0}
.cp-pts li{font-family:'Barlow Condensed',sans-serif;font-size:clamp(15px,1.2vw,19px);letter-spacing:.06em;text-transform:uppercase;color:#e9edf6;display:flex;align-items:center;gap:10px}
.cp-pts li::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px var(--lime)}
.cp-go{display:inline-flex;align-items:center;gap:12px;font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:15px;letter-spacing:.16em;text-transform:uppercase;
  padding:13px 22px;border-radius:99px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(8px);transition:background .35s,color .35s}
.cp-go em{font-style:normal;transition:transform .35s}
.cpanel:hover .cp-go{background:var(--lime);color:#0a0d05}.cpanel:hover .cp-go em{transform:translateX(5px)}
.cp-hint{margin-top:30px;display:flex;align-items:center;gap:14px;font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--grey)}
.cp-hint span{width:54px;height:1px;background:linear-gradient(90deg,var(--lime),transparent);position:relative;overflow:hidden}
.cine-hud{position:absolute;left:5vw;right:5vw;bottom:12px;display:flex;align-items:center;gap:12px;font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--grey);letter-spacing:.14em;z-index:3}
.cine-hud b{color:var(--lime);font-weight:500;font-size:14px}
.cine-bar{flex:1;height:1px;background:rgba(255,255,255,.14);margin-left:10px}
.cine-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--cyan),var(--lime));transform-origin:0 50%;transform:scaleX(0)}
html:not(.gs) .cine-hud{display:none}
@media(max-width:700px){
  .cine-pin,html:not(.gs) .cine-pin{height:auto;overflow:visible}
  .cine-track,html:not(.gs) .cine-track{display:block;width:auto;height:auto;padding:8px 16px 10px;transform:none!important}
  .cpanel,.cp-intro{position:sticky;top:76px;width:100%;height:76vh;height:76svh;margin-bottom:18px;transform-origin:50% 0}
  .cp-media img{left:0;width:100%;top:-8%;height:116%}
  .cp-shade{background:linear-gradient(0deg,rgba(4,6,12,.95) 0%,rgba(4,6,12,.6) 50%,rgba(4,6,12,.1) 100%)}
  .cp-copy{left:20px;right:20px;bottom:22px}
  .cp-title{font-size:clamp(32px,10vw,46px);margin-bottom:16px}.cp-big{font-size:clamp(40px,13vw,58px)}
  .cp-pts{flex-direction:column;gap:8px;margin-bottom:20px}.cp-pts li{font-size:15px}
  .cine-hud{display:none}
}

/* ═══════ v3.4 — CINEMATIC REVIEW RAIL (all review sections) ═══════ */
.rvrail{margin-top:8px}
.rvrail .marq-in{gap:22px;padding:18px 0 30px}
.rv-cine{position:relative;flex:0 0 auto;width:clamp(290px,30vw,430px);margin:0;padding:30px 30px 26px;border-radius:22px;overflow:hidden;
  display:flex;flex-direction:column;gap:16px;
  background:linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.15);
  backdrop-filter:blur(7px) saturate(140%);-webkit-backdrop-filter:blur(7px) saturate(140%);transition:transform .5s cubic-bezier(.2,.7,.2,1),border-color .4s}
.rv-cine:hover{transform:translateY(-6px);border-color:rgba(228,255,92,.45)}
.rv-cine::after{content:'';position:absolute;top:0;left:-60%;width:40%;height:100%;pointer-events:none;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.16),transparent);transform:skewX(-18deg);opacity:0}
.rv-cine:hover::after{animation:jtFlash .9s ease}
.rv-q{position:absolute;right:18px;top:-18px;font-family:'Archivo',sans-serif;font-stretch:125%;font-weight:800;font-size:150px;line-height:1;
  background:linear-gradient(160deg,rgba(228,255,92,.5),rgba(99,234,255,.08));-webkit-background-clip:text;background-clip:text;color:transparent;pointer-events:none}
.rv-cine .gstars{display:flex;gap:3px}.rv-cine .gstars svg{width:15px;height:15px}
.rv-cine blockquote{margin:0;font-size:15px;line-height:1.65;color:#d9deea;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.rv-cine .who{margin-top:auto;display:flex;align-items:center;gap:12px;padding-top:6px;border-top:1px solid rgba(255,255,255,.08)}
.rv-av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;font-family:'Archivo',sans-serif;font-weight:800;color:#0a0d05;
  background:linear-gradient(140deg,var(--lime),var(--cyan))}
.rv-cine .who b{display:block;font-family:'Barlow Condensed',sans-serif;font-size:17px;letter-spacing:.04em}
.rv-cine .who em{display:block;font-style:normal;font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);margin-top:3px}
@keyframes jtFlash{from{left:-60%;opacity:1}to{left:130%;opacity:1}}

/* ═══════ v3.4 — INSTITUTE STAR MAP: Kids → Teens → Pros ═══════ */
.starpath{position:relative;height:150px;margin:6px 2% 34px}
.starpath svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.sp-line{fill:none;stroke:url(#none);stroke:var(--lime);stroke-width:1.6;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:var(--sp,0)}
.sp-glow{fill:none;stroke:var(--cyan);stroke-width:8;opacity:.16;filter:blur(6px);vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:var(--sp,0)}
.sp-node{position:absolute;transform:translate(-50%,-7px);display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;white-space:nowrap}
.sp-node:first-of-type{transform:translate(-7px,-7px);align-items:flex-start;text-align:left}
.sp-node:last-of-type{transform:translate(calc(-100% + 7px),-7px);align-items:flex-end;text-align:right}
.sp-node i{width:14px;height:14px;border-radius:50%;background:#fff;margin-bottom:8px;
  box-shadow:0 0 0 4px rgba(228,255,92,.18),0 0 18px 4px rgba(228,255,92,.7),0 0 46px 10px rgba(99,234,255,.25)}
.sp-node b{font-family:'Archivo',sans-serif;font-stretch:125%;font-weight:800;text-transform:uppercase;font-size:clamp(18px,2vw,26px);letter-spacing:.02em}
.sp-node span{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
.inst-card{position:relative}
.inst-card::before{content:'';position:absolute;inset:0 0 auto 0;height:520px;z-index:-1;pointer-events:none;opacity:.32;
  background:linear-gradient(180deg,rgba(6,8,15,.1),rgba(6,8,15,1) 92%),url(img/institute.webp) center 30%/cover no-repeat}
@media(max-width:700px){.starpath{height:130px;margin:0 0 24px}.sp-node span{display:none}.inst-card::before{background-image:linear-gradient(180deg,rgba(6,8,15,.1),rgba(6,8,15,1) 92%),url(img/institute-m.webp)}}

/* hero headline character reveal */
.ch{display:inline-block;will-change:transform}
#hero h1 .lime{display:inline-block}

@media(max-width:900px){.orb-tag{display:none!important}}
@media(max-width:700px){.cp-title{font-size:clamp(26px,8.2vw,38px);font-stretch:112%}.cp-big{font-size:clamp(36px,11.5vw,52px)}}
#work,#institute,.rvsec,#students{overflow-x:clip}

/* ═══════ v3.5 — HERO: Learn → Build → Earn motion path ═══════ */
.leb{display:none}
.lbe{position:relative;width:min(560px,100%);height:120px;margin:0 0 66px}
.lbe svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.lbe-line,.lbe-glow,.lbe-pulse{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round}
.lbe-line{stroke:url(#lbeG);stroke-width:1.6;stroke-dasharray:1;stroke-dashoffset:var(--lp,0)}
.lbe-glow{stroke:#63eaff;stroke-width:9;opacity:.14;filter:blur(7px);stroke-dasharray:1;stroke-dashoffset:var(--lp,0)}
.lbe-pulse{stroke:#fff;stroke-width:2.6;stroke-dasharray:.05 .95;stroke-dashoffset:1;opacity:0;filter:drop-shadow(0 0 6px #e4ff5c)}
.lbe.run .lbe-pulse{opacity:.95;animation:lbePulse 3.6s cubic-bezier(.55,.1,.35,1) infinite}
@keyframes lbePulse{from{stroke-dashoffset:1.05}to{stroke-dashoffset:-.05}}
.lbe-n{position:absolute;transform:translate(-50%,-7px);display:flex;flex-direction:column;align-items:center;text-align:center;white-space:nowrap}
.lbe-n:first-of-type{transform:translate(-7px,-7px);align-items:flex-start;text-align:left}
.lbe-n:last-of-type{transform:translate(calc(-100% + 7px),-7px);align-items:flex-end;text-align:right}
.lbe-n i{width:14px;height:14px;border-radius:50%;background:#fff;margin-bottom:9px;
  box-shadow:0 0 0 4px rgba(228,255,92,.16),0 0 16px 3px rgba(228,255,92,.7),0 0 40px 8px rgba(99,234,255,.22)}
.lbe-n.hit i{animation:lbeHit 1.2s ease-out}
@keyframes lbeHit{0%{box-shadow:0 0 0 4px rgba(228,255,92,.16),0 0 16px 3px rgba(228,255,92,.7)}35%{box-shadow:0 0 0 14px rgba(228,255,92,0),0 0 30px 10px rgba(228,255,92,.95)}100%{box-shadow:0 0 0 4px rgba(228,255,92,.16),0 0 16px 3px rgba(228,255,92,.7)}}
.lbe-n b{font-family:var(--f-wide);font-stretch:125%;font-weight:800;text-transform:uppercase;font-size:clamp(15px,1.5vw,20px);letter-spacing:.06em;color:#fff}
.lbe-n:last-of-type b{color:var(--lime)}
.lbe-n span{font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--grey);margin-top:3px}
@media(max-width:700px){.lbe{height:100px;margin-bottom:58px}.lbe-n span{font-size:8.5px;letter-spacing:.1em}}

/* rotating capability line */
.rtag{display:flex;align-items:center;gap:14px;margin:4px 0 28px;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--grey)}
.rtag-l{display:flex;align-items:center;gap:10px}.rtag-l::before{content:'';width:28px;height:1px;background:linear-gradient(90deg,transparent,var(--lime))}
.rtag-w{position:relative;display:inline-grid;height:1.6em;overflow:hidden;font-family:var(--f-wide);font-stretch:125%;font-weight:800;font-size:clamp(14px,1.3vw,17px);letter-spacing:.05em;color:var(--lime)}
.rtag-w b{grid-area:1/1;font-weight:800;line-height:1.6em;transform:translateY(110%);opacity:0;white-space:nowrap}
.rtag-w b.on{animation:rtIn .9s cubic-bezier(.2,.8,.2,1) forwards}.rtag-w b.out{animation:rtOut .7s cubic-bezier(.7,0,.3,1) forwards}
@keyframes rtIn{from{transform:translateY(110%);opacity:0;filter:blur(4px)}to{transform:none;opacity:1;filter:none}}
@keyframes rtOut{from{transform:none;opacity:1}to{transform:translateY(-110%);opacity:0;filter:blur(4px)}}

/* hero stats — smaller star, counters */
.hs b{display:inline-block}.hs small{display:block}
.hs-star{font-style:normal;color:var(--lime);font-size:15px;vertical-align:top;margin-left:3px;position:relative;top:4px;opacity:.9}

/* nav — active only where you are (scroll-spy on home) */
.links a.is-on,.links .dd.is-on>a,.nav-cta.is-on{color:var(--lime)}
.links>a,.links .dd>a{position:relative}
.links>a::after,.links .dd>a::after{content:'';position:absolute;left:0;right:0;bottom:-8px;height:1px;background:var(--lime);transform:scaleX(0);transform-origin:right;transition:transform .5s cubic-bezier(.7,0,.2,1)}
.links>a:hover::after,.links .dd>a:hover::after,.links a.is-on::after,.links .dd.is-on>a::after,.links a[aria-current=page]::after,.links .dd.on>a::after{transform:scaleX(1);transform-origin:left}
.nav-cta.is-on{color:#0a0d05}

/* buttons — fluent, classy motion */
.btn,.nav-cta,.cp-go{position:relative;overflow:hidden;isolation:isolate;transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,background-color .4s,color .4s,border-color .4s!important;will-change:transform}
.btn:active,.nav-cta:active{transform:scale(.97)!important;transition-duration:.12s!important}
.btn.line::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(120deg,#f1ff9b,#e4ff5c 50%,#cfee3a);
  clip-path:circle(0% at var(--mx,50%) var(--my,50%));transition:clip-path .7s cubic-bezier(.7,0,.2,1)}
.btn.line:hover::before{clip-path:circle(150% at var(--mx,50%) var(--my,50%))}
.btn.line:hover{color:#0a0d05!important;border-color:transparent!important;background:transparent!important}
.btn.solid{box-shadow:0 10px 30px -12px rgba(228,255,92,.55),inset 0 1px 0 rgba(255,255,255,.6)}
.btn.solid:hover{box-shadow:0 22px 50px -14px rgba(228,255,92,.85),inset 0 1px 0 rgba(255,255,255,.7)}
.btn.solid::before{content:'';position:absolute;inset:-1px;z-index:-1;border-radius:inherit;background:conic-gradient(from var(--ba,0deg),transparent 0 70%,rgba(255,255,255,.9) 80%,transparent 90%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:1px;animation:btnRim 4.5s linear infinite;opacity:.8}
@property --ba{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes btnRim{to{--ba:360deg}}
.btn .bt-a{display:inline-block;margin-left:10px;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.btn:hover .bt-a{transform:translateX(5px)}

/* Trusted Worldwide — horizontal moving review rail */
.tw-rail{margin-top:6px}
.tw-rail .marq-in{gap:20px;padding:16px 0 28px}
.tw-card{flex:0 0 auto;width:clamp(280px,26vw,370px);margin:0;padding:24px 24px 22px;border-radius:20px;display:flex;flex-direction:column;gap:14px;
  background:linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.15);
  backdrop-filter:blur(7px) saturate(140%);-webkit-backdrop-filter:blur(7px) saturate(140%);position:relative;overflow:hidden;transition:transform .5s cubic-bezier(.2,.7,.2,1),border-color .4s}
.tw-card:hover{transform:translateY(-6px);border-color:rgba(228,255,92,.45)}
.tw-card::after{content:'';position:absolute;top:0;left:-60%;width:40%;height:100%;pointer-events:none;background:linear-gradient(105deg,transparent,rgba(255,255,255,.16),transparent);transform:skewX(-18deg);opacity:0}
.tw-card:hover::after{animation:jtFlash .9s ease}
.tw-top{display:flex;justify-content:space-between;align-items:center}
.tw-top .flag{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;padding:5px 10px;border-radius:7px;border:1px solid rgba(99,234,255,.35);color:var(--cyan)}
.tw-src{font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#1dbf73}
.tw-card .gstars{display:flex;gap:3px}.tw-card .gstars svg{width:14px;height:14px}
.tw-card blockquote{margin:0;font-size:14.5px;line-height:1.6;color:#d9deea;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.tw-card figcaption{margin-top:auto;padding-top:12px;border-top:1px solid rgba(255,255,255,.08)}
.tw-card figcaption b{display:block;font-family:var(--f-disp);font-size:18px;letter-spacing:.03em}
.tw-card figcaption span{display:block;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);margin-top:3px}
#clients{overflow-x:clip}
@media(max-width:700px){.rtag{flex-direction:column;align-items:flex-start;gap:8px}.rtag-w{font-size:15px;max-width:100%}}
.tw-top .flag{background:transparent!important;width:auto;height:auto}

/* ═══════ v3.6 — visible call-to-action on every card ═══════ */
.ago{align-self:flex-start;margin-top:14px;padding:10px 18px;border-radius:99px;font-family:var(--f-disp);font-weight:600;font-size:13.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--lime)!important;border:1px solid rgba(228,255,92,.5);background:rgba(228,255,92,.08);transition:background .4s,color .4s,gap .4s,border-color .4s}
.acard:hover .ago,.acard:focus-visible .ago{background:var(--lime);color:#0a0d05!important;border-color:var(--lime)}
.ago.dim{color:var(--lime)!important}
.wgo{display:inline-flex;align-items:center;gap:10px;margin-top:14px;padding:9px 16px;border-radius:99px;font-family:var(--f-disp);font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  color:#0a0d05;background:var(--lime);box-shadow:0 10px 26px -12px rgba(228,255,92,.8);transition:gap .4s,transform .4s}
.wgo em{font-style:normal;transition:transform .4s}
.wcard:hover .wgo{gap:14px}.wcard:hover .wgo em{transform:translateX(3px)}
.wcard .info{display:flex;flex-direction:column;align-items:flex-start}

/* ═══════ v3.6 — ECOSYSTEM constellation ═══════ */
#ecosystem{padding-top:30px}
.eco-head{text-align:center;max-width:720px;margin:0 auto 10px}.eco-head .eyebrow{justify-content:center}
.eco{position:relative;height:640px;margin:0 auto;max-width:1180px}
.eco-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.eco-l,.eco-p{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round}
.eco-l{stroke:rgba(255,255,255,.16);stroke-width:1;stroke-dasharray:1;stroke-dashoffset:var(--ed,0)}
.eco-l.f{stroke:url(#ecoG);stroke-width:1.6;opacity:.85}
.eco-p{stroke:#fff;stroke-width:2.2;stroke-dasharray:.05 .95;stroke-dashoffset:1;opacity:0;filter:drop-shadow(0 0 5px #e4ff5c)}
.eco.run .eco-p{opacity:.9;animation:ecoPulse 4.4s cubic-bezier(.5,0,.3,1) infinite}
@keyframes ecoPulse{from{stroke-dashoffset:1.05}to{stroke-dashoffset:-.05}}
.eco-hub{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:132px;height:132px;border-radius:50%;display:grid;place-items:center;align-content:center;gap:4px;
  background:radial-gradient(circle at 35% 30%,rgba(228,255,92,.28),rgba(8,11,20,.92) 62%);border:1px solid rgba(228,255,92,.5);box-shadow:0 0 60px -6px rgba(228,255,92,.45),inset 0 0 30px rgba(99,234,255,.15);z-index:2}
.eco-hub b{font-family:var(--f-wide);font-stretch:125%;font-weight:800;font-size:38px;color:var(--lime);line-height:1}
.eco-hub em{font-style:normal;font-family:var(--f-mono);font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;color:#cfd6e4;text-align:center;max-width:100px}
.eco-ring{position:absolute;inset:-14px;border-radius:50%;border:1px solid rgba(99,234,255,.35);animation:ecoRing 3.2s ease-out infinite}
.eco-ring.r2{animation-delay:1.6s}
@keyframes ecoRing{from{transform:scale(.85);opacity:.9}to{transform:scale(1.6);opacity:0}}
.eco-n{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;width:150px;z-index:3;color:#fff;text-decoration:none}
.eco-i{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;
  background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(8px);
  transition:transform .5s cubic-bezier(.2,.8,.2,1),border-color .4s,box-shadow .4s,background .4s}
.eco-i svg{width:30px;height:30px}
.eco-t b{display:block;font-family:var(--f-disp);font-weight:600;font-size:15px;letter-spacing:.05em;text-transform:uppercase;line-height:1.15}
.eco-t small{display:block;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);margin-top:4px}
.eco-n.big .eco-i{width:70px;height:70px;border-radius:22px;border-color:rgba(228,255,92,.55);box-shadow:0 0 40px -8px rgba(228,255,92,.6)}
.eco-n.big .eco-i svg{width:40px;height:40px}
.eco-n.big .eco-t b{font-family:var(--f-wide);font-stretch:125%;font-weight:800;font-size:16px;color:var(--lime)}
.eco-n:hover .eco-i,.eco-n:focus-visible .eco-i{transform:translateY(-6px) scale(1.08);border-color:var(--lime);background:rgba(228,255,92,.14);box-shadow:0 18px 40px -12px rgba(228,255,92,.7)}
@media(max-width:900px){
  .eco{height:auto;display:grid;grid-template-columns:1fr 1fr;gap:14px;padding-top:150px}
  .eco-svg{display:none}
  .eco-hub{top:66px;width:110px;height:110px}
  .eco-n{position:relative;left:auto;top:auto;transform:none;width:auto;flex-direction:row;text-align:left;padding:12px;border-radius:16px;
    background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.13)}
  .eco-n.big{grid-column:1/-1}
  .eco-i{width:42px;height:42px;flex:0 0 auto}.eco-n.big .eco-i{width:52px;height:52px}
  .eco-t b{font-size:13.5px}.eco-n.big .eco-t b{font-size:14px}
}

/* ═══════ v3.6 — CERTIFICATE VERIFICATION ═══════ */
.verify-hero{padding-bottom:40px}
.vf-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:56px;align-items:center;margin-top:18px}
.vf-points{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:14px}
.vf-points li{display:flex;gap:16px;align-items:baseline;color:#cfd6e4;font-size:15px}
.vf-points b{font-family:var(--f-mono);font-size:12px;color:var(--lime);letter-spacing:.14em}
.vf-console{position:relative;border-radius:24px;overflow:hidden;padding:0 0 4px;
  background:linear-gradient(160deg,rgba(255,255,255,.085),rgba(255,255,255,.02));border:1px solid rgba(228,255,92,.35);
  backdrop-filter:blur(10px) saturate(140%);box-shadow:0 40px 90px -40px rgba(0,0,0,.9),0 0 60px -20px rgba(228,255,92,.35)}
.vf-top{display:flex;align-items:center;gap:10px;padding:16px 22px;border-bottom:1px solid rgba(255,255,255,.08);font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#cfd6e4}
.vf-top em{margin-left:auto;font-style:normal;color:var(--grey)}
.vf-dot{width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px var(--lime);animation:vfBlink 1.6s ease-in-out infinite}
@keyframes vfBlink{50%{opacity:.25}}
.vf-scan{position:absolute;left:0;right:0;top:52px;height:120px;pointer-events:none;overflow:hidden}
.vf-scan i{position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--lime),transparent);box-shadow:0 0 18px var(--lime);opacity:.6;animation:vfScan 3.2s cubic-bezier(.5,0,.5,1) infinite}
@keyframes vfScan{0%{top:0}50%{top:118px}100%{top:0}}
.vf-body{padding:30px 26px 22px;position:relative}
.vf-body p{font-family:var(--f-disp);font-size:15px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);margin:0 0 14px}
.vf-body form{display:flex;gap:12px;flex-wrap:wrap}
.vf-body input[type=text],.vf-body input[type=search]{flex:1 1 240px;min-width:0;padding:18px 20px;border-radius:14px;font-size:17px;color:#fff;font-family:var(--f-body);
  background:rgba(4,6,12,.7);border:1px solid rgba(255,255,255,.18);outline:none;transition:border-color .3s,box-shadow .3s}
.vf-body input:focus{border-color:var(--lime);box-shadow:0 0 0 4px rgba(228,255,92,.15)}
.vf-body button,.vf-body .button,.vf-body input[type=submit]{padding:18px 30px;border-radius:14px;border:0;cursor:pointer;font-family:var(--f-disp);font-weight:700;font-size:15px;letter-spacing:.16em;text-transform:uppercase;color:#0a0d05;
  background:linear-gradient(180deg,#f1ff9b 0%,#e4ff5c 46%,#cfee3a 100%);box-shadow:0 14px 34px -14px rgba(228,255,92,.8);transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s}
.vf-body button:hover,.vf-body .button:hover{transform:translateY(-2px);box-shadow:0 20px 44px -14px rgba(228,255,92,.95)}
.vf-body table{width:100%;border-collapse:collapse;margin-top:22px;font-size:14.5px;border-radius:14px;overflow:hidden}
.vf-body th,.vf-body td{padding:12px 14px;text-align:left;border-bottom:1px solid rgba(255,255,255,.08)}
.vf-body th{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--lime);background:rgba(228,255,92,.06)}
.vf-body td{color:#e4e8f1}
.vf-body img{max-width:100%;border-radius:12px}
.vf-foot{display:flex;justify-content:space-between;padding:12px 22px 16px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);border-top:1px solid rgba(255,255,255,.06)}
.vf-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.vf-card{padding:26px;border-radius:20px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;
  background:linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(7px)}
.vf-card b{font-family:var(--f-disp);font-size:20px;letter-spacing:.04em;text-transform:uppercase}
.vf-card p{color:#c9d0de;font-size:14.5px;line-height:1.6;margin:0 0 6px}
.vf-card .btn{margin-top:auto}
@media(max-width:900px){.vf-grid{grid-template-columns:1fr;gap:30px}.vf-cards{grid-template-columns:1fr}}
@media(max-width:700px){.vf-body{padding:24px 18px}.vf-body button,.vf-body .button{width:100%}.vf-top em{display:none}}
.eco::before{content:'';position:absolute;inset:-6% -4%;z-index:0;pointer-events:none;border-radius:50%;
  background:radial-gradient(closest-side,rgba(5,7,13,.86),rgba(5,7,13,.6) 60%,transparent 100%)}
.eco-svg,.eco-hub,.eco-n{z-index:1}.eco-n{z-index:3}
.eco-n.big .eco-t{max-width:150px}
@media(max-width:900px){.eco::before{display:none}}
.pf-chips{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 24px}
.pf-chip{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:99px;font-family:var(--f-disp);font-size:13.5px;letter-spacing:.08em;text-transform:uppercase;color:#e4e8f1;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.15);transition:border-color .3s,background .3s,color .3s}
.pf-chip svg{width:18px;height:18px}.pf-chip:hover{border-color:var(--lime);color:var(--lime);background:rgba(228,255,92,.08)}
.pf-svc{display:inline-flex;margin:-6px 0 22px;font-family:var(--f-disp);font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--lime)}
.pf-sec{scroll-margin-top:90px}

/* ═══════ v3.7 — FREE ATS CV BUILDER ═══════ */
.cv-hero{padding-bottom:26px}
.cv-intro{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:end;margin-top:14px}
.cv-ticks{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.cv-ticks li{padding:14px 18px;border-radius:14px;background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.13)}
.cv-ticks b{display:block;font-family:var(--f-disp);font-size:16px;letter-spacing:.08em;text-transform:uppercase;color:var(--lime)}
.cv-ticks span{font-size:13.5px;color:#c9d0de}
.cv-app{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:28px;align-items:start}
.cv-form,.cv-side{border-radius:22px;background:linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(10px)}
.cv-form{padding:22px}
.cv-steps{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px}
.cv-steps button{flex:1 1 auto;padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#cfd6e4;cursor:pointer;font-family:var(--f-disp);font-size:13px;letter-spacing:.1em;text-transform:uppercase;transition:all .3s}
.cv-steps button.on{background:var(--lime);color:#0a0d05;border-color:var(--lime)}
.cv-pane{border:0;margin:0;padding:0;display:grid;gap:12px;min-width:0}
.cv-pane legend{font-family:var(--f-wide);font-stretch:125%;font-weight:800;text-transform:uppercase;font-size:18px;margin-bottom:6px;color:#fff;padding:0}
.cv-pane legend small,.cv-form label small{display:block;font-family:var(--f-body);font-stretch:100%;font-weight:400;text-transform:none;font-size:12px;color:var(--grey);letter-spacing:0;margin-top:3px}
.cv-form label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;letter-spacing:.04em;color:#cfd6e4;min-width:0}
.cv-form label small{display:inline;margin:0}
.cv-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.cv-row.three{grid-template-columns:1fr 1fr 1fr}
.cv-form input,.cv-form select,.cv-form textarea{width:100%;box-sizing:border-box;padding:11px 13px;border-radius:10px;border:1px solid rgba(255,255,255,.16);background:rgba(4,6,12,.6);color:#fff;font:inherit;font-size:14px;outline:none;transition:border-color .25s,box-shadow .25s}
.cv-form textarea{resize:vertical;line-height:1.5}
.cv-form input:focus,.cv-form select:focus,.cv-form textarea:focus{border-color:var(--lime);box-shadow:0 0 0 3px rgba(228,255,92,.14)}
.cv-form select option{background:#0b0f1a}
.cv-form .cv-check{flex-direction:row;align-items:center;gap:10px;align-self:end;padding-bottom:10px}
.cv-form .cv-check input{width:18px;height:18px;accent-color:#e4ff5c}
.cv-final textarea{border-color:rgba(228,255,92,.35);background:rgba(228,255,92,.04)}
.cv-card{padding:16px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03);display:grid;gap:12px}
.cv-card-h{display:flex;justify-content:space-between;align-items:center}.cv-card-h b{font-family:var(--f-disp);letter-spacing:.1em;text-transform:uppercase;color:var(--lime)}
.cv-mini{padding:7px 12px;border-radius:8px;border:1px solid rgba(255,255,255,.18);background:transparent;color:#cfd6e4;cursor:pointer;font-size:12px}
.cv-mini:hover{border-color:var(--lime);color:var(--lime)}
.cv-add{padding:12px;border-radius:12px;border:1px dashed rgba(228,255,92,.5);background:rgba(228,255,92,.05);color:var(--lime);cursor:pointer;font-family:var(--f-disp);letter-spacing:.12em;text-transform:uppercase}
.cv-photo{display:flex;gap:10px;align-items:end;flex-wrap:wrap}.cv-file{flex:1}
.cv-themes{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.cv-themes label{cursor:pointer}.cv-themes input{position:absolute;opacity:0}
.cv-themes span{display:block;padding:14px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.04);transition:all .3s}
.cv-themes b{display:block;font-family:var(--f-disp);font-size:16px;letter-spacing:.06em;text-transform:uppercase;color:#fff}.cv-themes em{font-style:normal;font-size:11.5px;color:var(--grey)}
.cv-themes input:checked+span{border-color:var(--lime);background:rgba(228,255,92,.1);box-shadow:0 0 0 1px var(--lime)}
.cv-colors{display:flex;flex-wrap:wrap;gap:10px}
.cv-colors label{flex-direction:row;align-items:center;gap:8px;cursor:pointer;padding:7px 11px;border-radius:99px;border:1px solid rgba(255,255,255,.14)}
.cv-colors input{position:absolute;opacity:0}.cv-colors i{width:16px;height:16px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.25)}
.cv-colors label:has(input:checked){border-color:var(--lime);background:rgba(228,255,92,.08)}
.cv-actions{display:flex;gap:10px;align-items:center;margin-top:18px;flex-wrap:wrap}
.cv-actions .cv-next{margin-left:auto}
.cv-prev{background:none;border:0;color:#cfd6e4;cursor:pointer;font-family:var(--f-disp);letter-spacing:.12em;text-transform:uppercase;visibility:hidden}
.cv-note{margin:12px 0 0;font-size:12px;color:var(--grey)}
.cv-side{position:sticky;top:88px;padding:14px}
.cv-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 4px 12px;font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
.cv-bar>div{display:flex;gap:8px;align-items:center}.cv-bar .btn{padding:10px 18px;font-size:13px}
.cv-stage{position:relative;overflow:hidden;border-radius:10px;background:#d9dde5}
.cv-scale{transform-origin:0 0;width:794px;box-shadow:0 20px 50px -20px rgba(0,0,0,.6)}
.cv-modal{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:16px}
.cv-modal[hidden]{display:none}
.cv-mback{position:absolute;inset:0;background:rgba(3,5,10,.78);backdrop-filter:blur(6px)}
.cv-mbox{position:relative;width:min(460px,100%);padding:34px 30px 28px;border-radius:22px;text-align:center;background:linear-gradient(160deg,#141a28,#0b0f1a);border:1px solid rgba(228,255,92,.4);box-shadow:0 40px 90px -30px #000}
.cv-mbox h3{font-family:var(--f-wide);font-stretch:125%;font-weight:800;text-transform:uppercase;font-size:22px;margin:6px 0 10px}
.cv-mbox p{color:#c9d0de;font-size:14.5px;line-height:1.6;margin:0 0 20px}
.cv-stars{color:var(--lime);font-size:26px;letter-spacing:6px}
.cv-mx{position:absolute;right:14px;top:12px;background:none;border:0;color:#cfd6e4;font-size:18px;cursor:pointer}
.cv-skip{display:block;margin:14px auto 0;background:none;border:0;color:var(--grey);text-decoration:underline;cursor:pointer;font-size:13px}
.cv-dl{display:flex;flex-direction:column;gap:10px}.cv-thanks{margin:16px 0 0!important;color:var(--lime)!important}
#cvPrint{display:none}
@media print{
  @page{size:A4;margin:0}
  html,body{background:#fff!important}
  body>*:not(#cvPrint){display:none!important}
  #cvPrint{display:block!important}
  #cvPrint .cv-paper{width:210mm;min-height:auto;box-shadow:none}
}
@media(max-width:1000px){.cv-app{grid-template-columns:minmax(0,1fr)}.cv-side{position:relative;top:0}.cv-intro{grid-template-columns:1fr}}
@media(max-width:700px){.cv-row,.cv-row.three{grid-template-columns:1fr}.cv-themes{grid-template-columns:1fr 1fr}.cv-steps button{font-size:11px;padding:9px 6px}.cv-bar{flex-direction:column;align-items:stretch}.cv-bar>div{justify-content:space-between}}
.cvt{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center;padding:44px;border-radius:28px;
  background:linear-gradient(140deg,rgba(228,255,92,.1),rgba(99,234,255,.05) 50%,rgba(255,255,255,.02));border:1px solid rgba(228,255,92,.3);backdrop-filter:blur(10px)}
.cvt-tags{display:flex;flex-wrap:wrap;gap:8px}.cvt-tags span{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;padding:6px 10px;border-radius:99px;border:1px solid rgba(255,255,255,.18);color:#cfd6e4}
.cvt-mock{position:relative;display:grid;place-items:center}
.cvt-paper{width:min(300px,80%);aspect-ratio:210/297;background:#fff;border-radius:6px;padding:26px 24px;display:flex;flex-direction:column;gap:7px;transform:rotate(-4deg);box-shadow:0 40px 80px -30px #000;animation:cvtFloat 6s ease-in-out infinite}
.cvt-paper i{display:block;height:6px;border-radius:3px;background:#d7dbe3}
.cvt-paper i.h{height:16px;width:60%;background:#1f3a5f}.cvt-paper i.s{width:40%;background:#7d8aa3}
.cvt-paper i.sec{margin-top:10px;height:5px;width:35%;background:#1f3a5f}
.cvt-paper .w90{width:90%}.cvt-paper .w80{width:80%}.cvt-paper .w70{width:70%}.cvt-paper .w60{width:60%}.cvt-paper .w50{width:50%}
.cvt-badge{position:absolute;right:8%;bottom:14%;padding:9px 14px;border-radius:12px;background:var(--lime);color:#0a0d05;font-family:var(--f-disp);font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:13px;box-shadow:0 14px 30px -12px rgba(228,255,92,.8);animation:cvtFloat 6s ease-in-out infinite reverse}
@keyframes cvtFloat{50%{transform:translateY(-10px) rotate(-3deg)}}
@media(max-width:800px){.cvt{grid-template-columns:1fr;padding:26px}.cvt-mock{order:-1}}
.cv-pane[hidden]{display:none!important}
.cv-form,.cv-side{min-width:0}
.cv-paper h2{letter-spacing:.04em!important}
.cvt .cta-row{align-items:center}.cvt-tags{align-self:center}
.ddp a.sub{padding-left:34px;font-size:.92em;opacity:.85}.ddp a.sub svg{width:16px;height:16px}
.mnav a.sub{padding-left:22px;opacity:.8}
.dm-subs{grid-template-columns:repeat(2,1fr)}
.dm-back{display:inline-flex;gap:6px;padding:12px 18px;border-radius:12px;border:1px solid rgba(228,255,92,.35);background:rgba(228,255,92,.06);color:#e4e8f1;font-size:14.5px}
.dm-back b{color:var(--lime)}
@media(max-width:700px){.dm-subs{grid-template-columns:1fr}}

/* ═══════ v3.8 — HERO particle typography: LEARN · BUILD · EARN ═══════ */
.lbe2{position:relative;width:min(600px,100%);margin:6px 0 34px}
.lbe2-stage{position:relative;height:118px}
.lbe2-stage canvas{position:absolute;inset:0;width:100%;height:100%;cursor:crosshair}
.lbe2-fallback{position:absolute;inset:0;display:flex;align-items:center;font-family:var(--f-wide);font-stretch:125%;font-weight:800;font-size:clamp(26px,3.4vw,44px);text-transform:uppercase;color:var(--lime);opacity:0}
.lbe2.calm .lbe2-fallback{opacity:1}
.lbe2-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.lbe2-steps button{position:relative;display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:baseline;text-align:left;padding:10px 12px 12px;border-radius:12px;cursor:pointer;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);color:#cfd6e4;overflow:hidden;transition:border-color .5s,background .5s}
.lbe2-steps i{font-style:normal;font-family:var(--f-mono);font-size:11px;color:var(--grey);grid-row:span 2}
.lbe2-steps b{font-family:var(--f-wide);font-stretch:125%;font-weight:800;text-transform:uppercase;font-size:14px;letter-spacing:.05em;color:#fff;transition:color .5s}
.lbe2-steps span{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lbe2-steps em{position:absolute;left:0;bottom:0;height:2px;width:100%;background:linear-gradient(90deg,var(--cyan),var(--lime));transform:scaleX(0);transform-origin:0 50%}
.lbe2-steps .on{border-color:rgba(228,255,92,.5);background:rgba(228,255,92,.07)}
.lbe2-steps .on b,.lbe2-steps .on i{color:var(--lime)}
.lbe2-steps .on em{animation:lbeBar 3.5s linear forwards}
.lbe2-steps .done em{transform:scaleX(1);opacity:.35}
@keyframes lbeBar{to{transform:scaleX(1)}}
.lbe2.calm .lbe2-steps .on em{animation:none;transform:scaleX(1)}
@media(max-width:700px){.lbe2-stage{height:84px}.lbe2-steps{gap:6px}.lbe2-steps button{padding:8px 8px 10px;column-gap:6px}.lbe2-steps b{font-size:12px}.lbe2-steps span{font-size:8px;letter-spacing:.06em}}

/* ═══════ v3.8 — ECOSYSTEM: living network ═══════ */
.eco{height:680px}
.eco-cv{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.eco.live .eco-n{left:0;top:0;transition:opacity .6s}
.eco.live .eco-n .eco-i{transition:transform .45s cubic-bezier(.2,.8,.2,1),border-color .4s,box-shadow .4s,background .4s}
.eco:not(.seen) .eco-n,.eco:not(.seen) .eco-hub{opacity:0!important}
.eco .eco-hub{transition:opacity 1s .1s}
.eco.focus .eco-n:not(.hot){filter:saturate(.6) brightness(.75)}
.eco-n.hot .eco-i{transform:translateY(-4px) scale(1.12);border-color:var(--lime);background:rgba(228,255,92,.16);box-shadow:0 0 0 6px rgba(228,255,92,.08),0 18px 40px -12px rgba(228,255,92,.75)}
.eco-hub{width:150px;height:150px;z-index:20;background:radial-gradient(circle at 50% 40%,rgba(228,255,92,.22),rgba(6,9,16,.95) 66%);
  box-shadow:0 0 0 1px rgba(228,255,92,.45),0 0 80px -6px rgba(228,255,92,.5),inset 0 0 40px rgba(99,234,255,.18)}
.eco-hub img{width:52px;height:auto;display:block;filter:drop-shadow(0 0 14px rgba(228,255,92,.55)) drop-shadow(0 0 2px rgba(255,255,255,.6))}
.eco-hub em{margin-top:6px}
.eco-orbit{position:absolute;inset:-26px;border-radius:50%;border:1px dashed rgba(228,255,92,.35);animation:ecoSpin 24s linear infinite}
.eco-orbit::before{content:'';position:absolute;top:-4px;left:50%;width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px var(--lime)}
@keyframes ecoSpin{to{transform:rotate(360deg)}}
.eco-n .eco-t{text-shadow:0 2px 12px rgba(0,0,0,.9)}
@media(max-width:900px){.eco{height:auto}.eco-cv,.eco-orbit{display:none}.eco-hub{width:116px;height:116px}.eco-hub img{width:40px}}
.eco-n.big .eco-t b{font-size:14px;line-height:1.1}.eco-n.big{width:170px}
.eco-hub{width:136px;height:136px}.eco-hub img{width:46px}

/* ═══════ v3.8 — SERVICE PANELS: focus depth, always-visible CTA ═══════ */
@media(min-width:701px){
  .cpanel{--f:1;transform:scale(calc(.92 + .08 * var(--f)));transition:none}
  .cpanel::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:#04060c;opacity:calc((1 - var(--f)) * .55)}
  .cp-copy{bottom:clamp(22px,4.5vh,56px);top:auto;max-width:min(860px,78%)}
  .cp-title{font-size:min(6.2vw,11.5vh,104px);margin-bottom:min(22px,2.4vh)}
  .cp-pts{margin-bottom:min(26px,2.8vh)}
  .cp-num{position:absolute;right:clamp(20px,3vw,48px);top:clamp(14px,2.4vh,32px);z-index:1;font-family:var(--f-wide);font-stretch:125%;font-weight:800;font-size:min(14vw,26vh);line-height:.8;
    color:transparent;-webkit-text-stroke:1px rgba(228,255,92,.35);letter-spacing:-.04em;pointer-events:none;transform:translateX(calc((1 - var(--f)) * 60px))}
}
.cp-num{display:none}@media(min-width:701px){.cp-num{display:block}}
.cp-go{transition:background .4s,color .4s,border-color .4s,box-shadow .4s!important;transform:none!important;gap:14px;padding:12px 14px 12px 22px;
  background:rgba(8,11,20,.55);border:1px solid rgba(228,255,92,.55);color:#fff;box-shadow:0 10px 30px -14px rgba(0,0,0,.8)}
.cp-go em{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--lime);color:#0a0d05;font-weight:700;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.cpanel:hover .cp-go{background:var(--lime);color:#0a0d05;box-shadow:0 18px 40px -14px rgba(228,255,92,.8)}
.cpanel:hover .cp-go em{background:#0a0d05;color:var(--lime);transform:translateX(4px) rotate(-45deg)}
.cp-media img{max-width:none}
@media(min-width:701px){.cp-go{opacity:calc(.25 + .75 * var(--f))}}
.starpath{margin-bottom:78px}
@media(max-width:700px){.starpath{margin-bottom:56px}}

/* CV builder v2 — field, score, attachments */
.cv-field select{border-color:rgba(228,255,92,.45);background:rgba(228,255,92,.05)}
.cv-score{margin-top:16px;padding:14px 16px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03)}
.cv-score-h{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--f-disp);letter-spacing:.1em;text-transform:uppercase}
.cv-score-h span{font-family:var(--f-wide);font-stretch:125%;font-weight:800;font-size:20px;color:var(--lime)}
.cv-score i{display:block;height:6px;border-radius:6px;background:rgba(255,255,255,.08);margin:8px 0 10px;overflow:hidden}
.cv-score em{display:block;height:100%;width:0;border-radius:6px;background:linear-gradient(90deg,#ff7a59,#ffd166);transition:width .6s cubic-bezier(.2,.8,.2,1)}
.cv-score[data-level=mid] em{background:linear-gradient(90deg,#ffd166,#e4ff5c)}.cv-score[data-level=hi] em{background:linear-gradient(90deg,var(--cyan),var(--lime))}
.cv-score ul{margin:0;padding-left:18px;font-size:13px;color:#c9d0de;display:grid;gap:4px}.cv-score li.ok{color:var(--lime);list-style:none;margin-left:-18px}
.cv-drop{padding:16px;border:1px dashed rgba(99,234,255,.45);border-radius:14px;background:rgba(99,234,255,.04)}
.cv-docs{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px}
.cv-docs li{display:flex;align-items:center;gap:10px;padding:8px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03)}
.cv-docs img{width:44px;height:56px;object-fit:cover;border-radius:6px;background:#fff;flex:0 0 auto}
.cv-docs span{flex:1;min-width:0}.cv-docs b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cv-docs small{color:var(--grey);font-size:11.5px}
.cv-docs .cv-mini[disabled]{opacity:.3;cursor:default}
.cv-attp{width:794px;min-height:1123px;margin-top:14px;background:#fff;padding:40px 48px;box-sizing:border-box;display:flex;flex-direction:column;align-items:center}
.cv-attp p{align-self:flex-start;margin:0 0 12px;font:12px Arial,sans-serif;color:#5a6172}
.cv-attp img{max-width:100%;max-height:1010px;object-fit:contain;box-shadow:0 0 0 1px #e3e6ec}
@media print{#cvPrint .cv-attp{width:210mm;min-height:auto;margin:0;page-break-before:always;break-before:page;padding:12mm}#cvPrint .cv-attp img{max-height:260mm}}

/* ═══════ v3.8 — PERFORMANCE: no live blur over the moving 3D scene (it re-blurred every frame) ═══════ */
*:not(nav.site):not(.mnav):not(.cv-mback):not(.ddp){-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.acard,.ccard,.rv-cine,.tw-card,.vf-card,.vf-console,.cv-form,.cv-side,.cvt,.incell,.step,.oth,.pitem,.pdetail,.lbe2-steps button,.eco-i,.inst-card,.cv-ticks li{background-color:rgba(9,12,22,.55)!important}
.inst-card{isolation:isolate}
.plugin-page{padding:120px 0 70px;min-height:60vh}
.plugin-page .woocommerce,.plugin-page .woocommerce-page{color:#d9deea}
.plugin-page .button,.plugin-page button.button,.plugin-page a.button{background:var(--lime)!important;color:#0a0d05!important;border-radius:10px!important;font-family:var(--f-disp);letter-spacing:.1em;text-transform:uppercase}
.plugin-page input,.plugin-page select,.plugin-page textarea{background:rgba(4,6,12,.7);color:#fff;border:1px solid rgba(255,255,255,.18);border-radius:8px;padding:10px}
.plugin-page .price{color:var(--lime)}
.cv-bar .cv-mini,.cv-bar .btn{white-space:nowrap}#cvStatus{font-size:10px}
/* ecosystem: logo-only hub, calm hover */
.eco-hub img{width:58px}
.eco.focus .eco-n:not(.hot){filter:none;opacity:.55!important}
.eco.live .eco-n{transition:opacity .45s ease}

/* CV builder — alignment fixes + theme thumbnails */
.cv-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.cv-row.three{grid-template-columns:repeat(3,minmax(0,1fr))}
#cvJobs,#cvEdus,.cv-card,.cv-attach,.cv-docs,.cv-docs li{min-width:0}
.cv-docs{grid-template-columns:minmax(0,1fr)}
.cv-docs li{gap:8px}
.cv-docs .cv-mini{height:34px;min-width:34px;padding:0 10px;display:inline-grid;place-items:center;line-height:1;flex:0 0 auto}
.cv-form input[type=file]{padding:8px;cursor:pointer;color:var(--grey)}
.cv-form input[type=file]::file-selector-button{margin-right:12px;padding:9px 16px;border-radius:9px;border:0;cursor:pointer;background:var(--lime);color:#0a0d05;font-family:var(--f-disp);font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.cv-themes{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}
.cv-themes label{display:flex;min-width:0}.cv-themes span{flex:1;display:flex;flex-direction:column;gap:3px;height:100%;box-sizing:border-box}
.cv-themes em{line-height:1.35}
.cv-th{display:block;height:58px;margin-bottom:8px;border-radius:6px;background:#fff;padding:7px 8px;box-sizing:border-box;position:relative;overflow:hidden}
.cv-th u{display:block;height:4px;border-radius:2px;background:#cfd5df;margin-top:5px;text-decoration:none}
.cv-th u:first-child{height:7px;width:55%;margin-top:0;background:#1f3a5f}.cv-th u:nth-child(2){width:80%}.cv-th u:nth-child(3){width:65%}.cv-th u:nth-child(4){width:72%}
.th-executive u:first-child{margin:0 auto}.th-elegant u:first-child{margin:0 auto;background:#555;height:5px}.th-elegant u{margin-left:auto;margin-right:auto}
.th-modern{border-left:5px solid #0e6e8c}.th-modern u:first-child{background:#0e6e8c}
.th-gulf{padding-top:20px}.th-gulf::before{content:'';position:absolute;left:0;right:0;top:0;height:15px;background:#0f6b5c}
.th-minimal u:first-child{background:#222;height:5px}
.th-bold{padding-top:18px}.th-bold::before{content:'';position:absolute;left:0;right:0;top:0;height:13px;background:#f1f3f7;border-bottom:3px solid #7a1f2b}.th-bold u:first-child{background:#7a1f2b}
@media(max-width:700px){.cv-themes{grid-template-columns:repeat(2,minmax(0,1fr))}}
.eco{height:760px}@media(max-width:900px){.eco{height:auto}}

/* ══════════════════════════════════════════════════════════════════
   v3.9 — three pillars, animated J, tighter layouts, mobile rails
   ══════════════════════════════════════════════════════════════════ */

/* ── Ecosystem hub: animated J mark (no circle, no image) ── */
.eco-hub{background:none!important;box-shadow:none!important;border-radius:0;width:128px!important;height:176px!important;overflow:visible}
.eco-hub .eco-ring,.eco-hub .eco-orbit,.eco-hub img{display:none}
.jmark{position:relative;display:block;width:100%;height:100%}
.jmark svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.jm-line path{fill:none;stroke:#e4ff5c;stroke-width:2.2;stroke-linejoin:round;stroke-dasharray:1 1;stroke-dashoffset:1;opacity:0}
.jm-fill{opacity:0}
.jm-glow{opacity:0}
.jm-sweep{transform:translateX(0) skewX(-18deg);opacity:0}
.seen .jm-line path,.jm-play .jm-line path{animation:jmDraw 1.5s cubic-bezier(.65,0,.35,1) forwards;animation-delay:calc(var(--i) * .16s)}
.seen .jm-fill,.jm-play .jm-fill{animation:jmFill 1.1s ease forwards 1.35s}
.seen .jm-glow,.jm-play .jm-glow{animation:jmGlow 3.6s ease-in-out infinite 2s}
.seen .jm-sweep,.jm-play .jm-sweep{animation:jmSweep 4.8s cubic-bezier(.45,0,.2,1) infinite 2.2s}
@keyframes jmDraw{0%{stroke-dashoffset:1;opacity:1}85%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:.35}}
@keyframes jmFill{from{opacity:0;filter:blur(6px)}to{opacity:1;filter:blur(0)}}
@keyframes jmGlow{0%,100%{opacity:.35}50%{opacity:.8}}
@keyframes jmSweep{0%{transform:translateX(-40px) skewX(-18deg);opacity:0}8%{opacity:1}42%{transform:translateX(300px) skewX(-18deg);opacity:1}46%,100%{transform:translateX(300px) skewX(-18deg);opacity:0}}
.jm-parts{position:absolute;left:50%;top:50%;width:0;height:0;pointer-events:none}
.jm-parts i{position:absolute;left:0;top:0;width:4px;height:4px;margin:-2px;border-radius:50%;background:#e4ff5c;box-shadow:0 0 8px 1px rgba(228,255,92,.9);opacity:0}
.jm-parts i:nth-child(3n){background:#63eaff;box-shadow:0 0 8px 1px rgba(99,234,255,.9);width:3px;height:3px}
.jm-parts i:nth-child(4n){background:#fff;width:2px;height:2px}
.seen .jm-parts i,.jm-play .jm-parts i{animation:jmPart var(--t) cubic-bezier(.2,.7,.3,1) infinite;animation-delay:var(--w)}
@keyframes jmPart{0%{transform:rotate(var(--a)) translateY(-30px) scale(.4);opacity:0}15%{opacity:1}100%{transform:rotate(var(--a)) translateY(calc(-30px - var(--d))) scale(1);opacity:0}}
@media(prefers-reduced-motion:reduce){.jm-line path{opacity:0}.jm-fill,.jm-glow{opacity:1!important;animation:none!important}.jm-glow{opacity:.45!important}.jm-sweep,.jm-parts{display:none}}
.eco.focus .eco-n.lit{opacity:1!important;filter:none}
.eco.focus .eco-n.lit .eco-i{border-color:rgba(228,255,92,.7);box-shadow:0 0 0 4px rgba(228,255,92,.08)}

/* ── Ecosystem on phones & tablets: hub, three pillar rows, 2-col services ── */
@media(max-width:900px){
  .eco{padding-top:196px!important;gap:12px!important}
  .eco-hub{top:92px!important;width:104px!important;height:144px!important}
  .eco-n.big{width:auto!important;grid-column:1/-1;padding:14px 16px}
  .eco-n.big .eco-t{max-width:none}
  .eco-n.big .eco-t b{font-family:var(--f-disp);font-stretch:100%;font-weight:700;font-size:17px;letter-spacing:.04em;line-height:1.15}
  .eco-n.big .eco-t small{font-size:10px}
  .eco-n{min-width:0;align-items:center}
  .eco-n .eco-t{min-width:0}
  .eco-n .eco-t b{font-size:12.5px;letter-spacing:.03em;overflow-wrap:anywhere;hyphens:none}
  .eco-n .eco-t small{font-size:9px}
}
@media(max-width:380px){.eco{grid-template-columns:1fr!important}.eco-n .eco-t b{font-size:13.5px}}

/* ── Overview sections: heading on top, text + "built for" side by side (no empty column) ── */
.ovw .ovw-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:34px;align-items:start;margin-top:6px}
.ovw .rise:first-child h2{max-width:none;font-size:clamp(30px,3.6vw,50px)}
.ovw .prose p{max-width:70ch}
.ovw-side{padding:24px 24px 18px;border-radius:20px;border:1px solid rgba(255,255,255,.13);background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02))}
.ovw-side .sub-h{margin-top:0}
@media(max-width:900px){.ovw .ovw-grid{grid-template-columns:1fr;gap:22px}}
/* other two-column sections: narrower heading column that follows the reader */
@media(min-width:901px){
  .split{grid-template-columns:minmax(0,.82fr) minmax(0,1.3fr);gap:44px}
  .split>.rise:first-child{position:sticky;top:104px}
  .split>.rise:first-child h2{font-size:clamp(28px,3.1vw,44px)}
}

/* ── Course sub-label (CIT Diploma) ── */
.csub{display:inline-block;margin:2px 0 10px;padding:4px 10px;border-radius:99px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--lime);border:1px solid rgba(228,255,92,.4);background:rgba(228,255,92,.06)}
.csub-hero{display:table;margin:0 0 12px}
.pitem .t small,.pdetail .csub{display:block}
.pitem .t small{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--lime);font-weight:500;margin-top:3px;opacity:.85}

/* ── Head office card: centred ── */
.landing .wrap{display:flex;justify-content:center}
.land-in{text-align:center;max-width:620px;margin:0 auto}
.land-in .eyebrow{justify-content:center}
.land-in h2{text-wrap:balance;line-height:1.08}
.land-in h2 .lime{display:block;margin-top:4px}
.land-in .cta-row{justify-content:center}
@media(max-width:700px){.land-in{padding:24px 20px}.land-in h2{font-size:clamp(22px,6.6vw,30px)}.land-in .eyebrow{font-size:9.5px;letter-spacing:.14em}}

/* ── Rails never hide (reviews were blank on some phones) ── */
.marq{opacity:1!important}

/* ── MOBILE RAILS: portfolio, team, steps, service panels ── */
.mdots{display:none}
@media(max-width:700px){
  .mrail{display:flex!important;grid-template-columns:none!important;gap:14px!important;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;padding:6px 5vw 10px;margin-left:-5vw;margin-right:-5vw;position:relative;overscroll-behavior-x:contain}
  .mrail::-webkit-scrollbar{display:none}
  .mrail>*{flex:0 0 82%;scroll-snap-align:center;min-width:0}
  .mrail.agrid>*{flex-basis:84%}
  .mrail.team>*{flex:0 0 66%}
  .mrail.steps>*{flex:0 0 74%}
  .mrail.agrid .acard:hover,.mrail .step:hover{transform:none}
  .mdots{display:flex;justify-content:center;gap:6px;margin:10px 0 4px}
  .mdots i{width:6px;height:6px;border-radius:6px;background:rgba(255,255,255,.22);transition:width .35s,background .35s}
  .mdots i.on{width:20px;background:var(--lime)}
  .mrail.team .mem{aspect-ratio:3/4}
  .mrail.team .mem .bio{max-height:120px;opacity:1;margin-top:8px}
  /* service panels: one swipe rail instead of stacked sticky cards */
  .cine{margin-top:8px}
  .cine-pin,html:not(.gs) .cine-pin{height:auto!important;overflow:visible}
  .cine-track.mrail,html:not(.gs) .cine-track.mrail{display:flex!important;width:auto;height:auto;padding:6px 5vw 10px;margin:0;transform:none!important}
  .cine-track.mrail .cpanel{position:relative!important;top:auto;flex:0 0 84%;width:auto;height:min(118vw,520px);margin:0;transform:none!important;filter:none!important}
  .cine-track.mrail .cp-intro{flex-basis:84%}
  .cine-track.mrail .cp-media img{top:0;height:100%;transform:none!important}
  .cine-track.mrail .cp-title{font-size:clamp(26px,8vw,36px);margin-bottom:12px}
  .cine-track.mrail .cp-big{font-size:clamp(36px,11vw,48px)}
  .cine-track.mrail .cp-pts{gap:6px;margin-bottom:16px}.cine-track.mrail .cp-pts li{font-size:13.5px}
  .cine-track.mrail .cp-hint{display:none}
  #services .mdots{margin-top:12px}
}

/* ── Institute explorer on phones: the course card opens under its name ── */
@media(max-width:940px){
  .plist.acc{gap:6px}
  .plist.acc .pitem{background:rgba(9,12,22,.55);border-color:rgba(255,255,255,.08)}
  .plist.acc .pitem::after{content:'+';justify-self:end;font-family:var(--f-mono);color:var(--lime);font-size:16px;margin-left:6px;transition:transform .3s}
  .plist.acc .pitem{grid-template-columns:30px 1fr auto 14px}
  .plist.acc .pitem.on::after{transform:rotate(45deg)}
  .plist.acc .pdetail{min-height:0;padding:20px 18px 18px;margin:2px 0 8px;border-radius:16px;border:1px solid rgba(228,255,92,.35)}
  .plist.acc .pdetail .pico,.plist.acc .pdetail h3{display:none}
  .plist.acc .pdetail p{font-size:14px}
  .plist.acc .pdetail ul{gap:7px;margin-bottom:18px}
  .plist.acc .pdetail .cta-row{flex-direction:column;align-items:stretch;gap:10px}
  .plist.acc .pdetail .cta-row .btn{justify-content:center;text-align:center}
  .pdetail.drop{animation:pdDrop .45s cubic-bezier(.2,.8,.2,1)}
  @keyframes pdDrop{from{opacity:0;transform:translateY(-10px);clip-path:inset(0 0 100% 0 round 16px)}to{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 16px)}}
}

/* ── CV builder ── */
.cv-dd{position:relative;margin-bottom:14px}
.cv-dd summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:14px;border:1px solid rgba(228,255,92,.45);background:rgba(228,255,92,.05);transition:border-color .3s,background .3s}
.cv-dd summary::-webkit-details-marker{display:none}
.cv-dd[open] summary{border-color:var(--lime);background:rgba(228,255,92,.1)}
.cv-dd-k{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--grey)}
.cv-dd summary .cv-dd-k{flex:0 0 auto}
.cv-dd-cur{display:flex;align-items:center;gap:12px;flex:1;min-width:0}
.cv-dd-cur .cv-th{width:64px;height:44px;margin:0;flex:0 0 auto;padding:5px 6px}
.cv-dd-cur .cv-th u{margin-top:4px;height:3px}.cv-dd-cur .cv-th u:first-child{height:5px}
.cv-dd-cur b{display:block;font-family:var(--f-disp);font-size:16px;letter-spacing:.06em;text-transform:uppercase;color:#fff}
.cv-dd-cur em{font-style:normal;font-size:12px;color:var(--grey)}
.cv-dd-chev{width:10px;height:10px;border-right:2px solid var(--lime);border-bottom:2px solid var(--lime);transform:rotate(45deg) translate(-3px,-3px);transition:transform .3s;flex:0 0 auto;margin-right:4px}
.cv-dd[open] .cv-dd-chev{transform:rotate(-135deg) translate(-3px,-3px)}
.cv-dd .cv-themes{margin-top:10px;padding:10px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(6,9,16,.92);animation:pdDrop .35s cubic-bezier(.2,.8,.2,1)}
.cv-col-k{margin:4px 0 8px}
.cv-colors{gap:8px}
@media(max-width:700px){
  .cv-colors label{padding:6px 10px 6px 7px}
  .cv-colors span{font-size:12px}
}
.cv-row.cv-dates{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:end}
.cv-form input[type=month]{-webkit-appearance:none;appearance:none;min-height:50px;display:block;width:100%;min-width:0}
.cv-form input[type=month]::-webkit-date-and-time-value{text-align:left}
@media(max-width:560px){
  .cv-row,.cv-row.three{grid-template-columns:minmax(0,1fr)!important}
  .cv-row.cv-dates{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}
  .cv-row.cv-dates .cv-check{grid-column:1/-1;align-self:start;padding:2px 0 0}
}
.eco-hub{border:0!important;outline:0}
.plist.acc .pitem .t{font-size:15px;line-height:1.25}
@media(max-width:700px){.land-in h2{font-size:clamp(20px,5.8vw,26px)}.land-in h2 .lime{font-size:.82em}}
.eco-hub{display:block!important}.eco-hub .jmark{position:absolute;inset:0;width:auto;height:auto}
.plist.acc .pdetail .csub{display:none}
.land-in h2{margin-bottom:16px}
@media(max-width:700px){.mrail .abody p{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}.mrail .atags span:nth-child(n+4){display:none}}
.ceo-cta{margin:22px 0 0}

/* ══ v3.9.2 — complete motion on phones ══ */
.mclone{display:none!important}
@media(max-width:700px){
  .mclone{display:revert!important}
  .mrail .mclone{display:flex!important}
  .mrail.team .mclone,.mrail.steps .mclone{display:block!important}
  .mrail.drifting,.mmarq.drifting{scroll-snap-type:none!important}
  .mmarq{overflow-x:auto!important;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;-webkit-mask-image:none!important;mask-image:none!important;overscroll-behavior-x:contain}
  .mmarq::-webkit-scrollbar{display:none}
  .mmarq .marq-in{animation:none!important;transform:none!important;padding-left:5vw;padding-right:5vw}
  .mmarq .gcard{flex-basis:80vw;height:auto;min-height:230px}
  .mmarq .wcard{flex-basis:84vw}
  .mmarq .bcard{flex-basis:72vw;height:400px}
  .mmarq .reel{flex-basis:56vw}
  .mmarq .tw-card{flex-basis:78vw}
}
/* reels: no centre play button */
.reel .play{display:none}
.reel .rt em{display:inline-grid;place-items:center}
/* ══ J mark v2 — endless outline draw + glitch, no glow ══ */
.jmark svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;filter:none!important}
.jm-glow,.jm-sweep,.jm-parts{display:none!important}
.jm-line path{fill:none;stroke:#e4ff5c;stroke-width:2.4;stroke-linejoin:round;stroke-dasharray:1 1;stroke-dashoffset:1;opacity:1;animation:none}
.jm-fill{fill:#f4ffd6;opacity:0}
.jm-gh{position:absolute;inset:0;opacity:0;pointer-events:none}
.jm-gh.g1 svg{fill:#63eaff}.jm-gh.g2 svg{fill:#e4ff5c}
.seen .jm-line path,.jm-play .jm-line path{animation:jmLoop 5s cubic-bezier(.65,0,.35,1) infinite;animation-delay:calc(var(--i) * .12s)}
.seen .jm-fill,.jm-play .jm-fill{animation:jmFillLoop 5s steps(1,end) infinite}
.seen .jm-gh.g1,.jm-play .jm-gh.g1{animation:jmGl1 5s linear infinite}
.seen .jm-gh.g2,.jm-play .jm-gh.g2{animation:jmGl2 5s linear infinite}
@keyframes jmLoop{0%{stroke-dashoffset:1}36%{stroke-dashoffset:0}80%{stroke-dashoffset:0}96%,100%{stroke-dashoffset:-1}}
@keyframes jmFillLoop{0%,40%{opacity:0}41%{opacity:.7}42%{opacity:0}44%{opacity:.9}45%{opacity:.2}47%{opacity:1}70%{opacity:1}71%{opacity:.3}72%{opacity:1}84%{opacity:1}85%{opacity:0}100%{opacity:0}}
@keyframes jmGl1{0%,39%{opacity:0}40%{opacity:.85;transform:translate(-5px,0);clip-path:inset(10% 0 62% 0)}42%{transform:translate(4px,0);clip-path:inset(55% 0 20% 0)}44%{transform:translate(-3px,1px);clip-path:inset(30% 0 40% 0)}46%{transform:translate(2px,0);clip-path:inset(75% 0 5% 0)}48%{opacity:0}69%{opacity:0}70%{opacity:.8;transform:translate(6px,0);clip-path:inset(20% 0 55% 0)}72%{transform:translate(-4px,0);clip-path:inset(60% 0 15% 0)}73.5%,100%{opacity:0}}
@keyframes jmGl2{0%,40%{opacity:0}41%{opacity:.8;transform:translate(5px,0);clip-path:inset(45% 0 30% 0)}43%{transform:translate(-4px,-1px);clip-path:inset(5% 0 70% 0)}45%{transform:translate(3px,0);clip-path:inset(68% 0 8% 0)}47%{opacity:0}70%{opacity:0}71%{opacity:.75;transform:translate(-6px,0);clip-path:inset(35% 0 40% 0)}73%,100%{opacity:0}}
.jmark .jm-main{animation:none}
.seen .jmark .jm-main{animation:jmShake 5s steps(1,end) infinite}
@keyframes jmShake{0%,40%{transform:none}41%{transform:translate(2px,0) skewX(-4deg)}42%{transform:translate(-2px,0)}43%{transform:none}70%{transform:translate(-2px,0) skewX(3deg)}71%{transform:none}100%{transform:none}}
@media(prefers-reduced-motion:reduce){.jm-line path{stroke-dashoffset:0!important;animation:none!important}.jm-fill{opacity:1!important;animation:none!important}.jm-gh{display:none}}

/* ══ v3.9.3 — compact orbiting ecosystem on phones & tablets ══ */
@media(max-width:900px){
  .eco.mob{display:block!important;height:min(138vw,560px)!important;padding:0!important;margin:10px auto 0;max-width:620px}
  .eco.mob .eco-cv{display:block!important}
  .eco.mob .eco-hub{top:50%!important;left:50%;transform:translate(-50%,-50%);width:72px!important;height:100px!important;z-index:30}
  .eco.mob .eco-n{position:absolute!important;left:0!important;top:0!important;width:84px!important;padding:0!important;background:none!important;border:0!important;
    flex-direction:column!important;align-items:center!important;text-align:center!important;gap:5px!important;will-change:transform}
  .eco.mob .eco-i{width:36px!important;height:36px!important;border-radius:12px}
  .eco.mob .eco-i svg{width:21px;height:21px}
  .eco.mob .eco-t b{font-size:9.2px!important;line-height:1.15!important;letter-spacing:.04em!important;font-family:var(--f-disp)!important;font-stretch:100%!important;max-width:84px}
  .eco.mob .eco-t small{display:none}
  .eco.mob .eco-n.big{width:96px!important}
  .eco.mob .eco-n.big .eco-i{width:46px!important;height:46px!important;border-radius:15px}
  .eco.mob .eco-n.big .eco-i svg{width:27px;height:27px}
  .eco.mob .eco-n.big .eco-t b{font-size:9.5px!important;color:var(--lime)}
  .eco.mob .eco-n .eco-t{text-shadow:0 1px 8px rgba(0,0,0,1),0 0 2px rgba(0,0,0,1)}
}

/* ══ v3.9.3 — transform-driven rails (replace native-scroll rails) ══ */
@media(min-width:701px){.mtrack{display:contents}.mclone{display:none!important}}
@media(max-width:700px){
  .mx,.mrail.mx,.cine-track.mrail.mx{display:block!important;overflow:hidden!important;touch-action:pan-y;-webkit-mask-image:none!important;mask-image:none!important;scroll-snap-type:none!important;
    padding:6px 0 10px!important;width:auto!important;height:auto!important;transform:none}
  .mrail.mx{margin-left:-5vw!important;margin-right:-5vw!important}
  .cine-track.mrail.mx{margin:0!important}
  .mx-track{display:flex!important;flex-wrap:nowrap!important;gap:14px!important;width:max-content!important;padding:0 5vw!important;will-change:transform;animation:none!important;
    -webkit-user-select:none;user-select:none;grid-template-columns:none!important}
  .mx-track img{-webkit-user-drag:none;pointer-events:none}
  .mrail>.mtrack{flex:none!important}
  .mx-track>*{flex:0 0 78vw!important;width:auto!important;min-width:0;scroll-snap-align:none}
  .mrail.agrid .mx-track>*{flex-basis:82vw!important}
  .mrail.team .mx-track>*{flex-basis:62vw!important}
  .mrail.steps .mx-track>*{flex-basis:70vw!important}
  .cine-track .mx-track>*{flex-basis:84vw!important;height:min(118vw,520px)!important;position:relative!important;top:auto!important}
  .marq.mx .gcard{flex-basis:80vw!important;height:auto;min-height:230px}
  .marq.mx .wcard{flex-basis:84vw!important}
  .marq.mx .bcard{flex-basis:74vw!important}
  .marq.mx .reel{flex-basis:56vw!important}
  .marq.mx .tw-card{flex-basis:78vw!important}
  .marq.mx .chip{flex:0 0 auto!important}
  .marq.mx .incell{flex-basis:72vw!important}
  .mclone{display:revert!important}
  .mx-track>.mclone.mem,.mx-track>.mclone.step{display:block!important}
  .mx-track>.mclone.acard,.mx-track>.mclone.cpanel{display:flex!important}
}

/* ══ v3.9.3 — blog cards in the site theme: picture band on top, glass body below ══ */
.bcard{height:auto!important;justify-content:flex-start;background:linear-gradient(165deg,rgba(255,255,255,.07),rgba(255,255,255,.015))!important;border:1px solid rgba(255,255,255,.13)}
.bcard::before{content:'';position:absolute;left:0;right:0;top:0;height:190px;z-index:0;
  background:radial-gradient(120% 90% at 85% 0%,rgba(228,255,92,.28),transparent 55%),radial-gradient(90% 80% at 0% 100%,rgba(99,234,255,.22),transparent 60%),
  repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 1px,transparent 1px 26px),repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 1px,transparent 1px 26px),#0b1122}
.bcard .bimg{position:relative;inset:auto;flex:0 0 190px;height:190px;z-index:1;background-position:center;filter:none}
.bcard .bimg::after{background:linear-gradient(to top,rgba(10,14,26,.85),rgba(10,14,26,0) 60%)}
.bcard:hover .bimg{transform:scale(1.04)}
.bcard .bbody{margin:0!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;padding:18px 20px 20px!important;flex:1;
  -webkit-backdrop-filter:none;backdrop-filter:none}
.bcard:hover .bbody{background:none!important}
.bcard .bbody h3,.bcard .bbody h2{font-family:var(--f-disp);font-weight:700;font-size:20px!important;line-height:1.2!important;letter-spacing:.01em;text-transform:uppercase;margin-bottom:8px}
.bcard p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bcard .bgo{margin-top:auto;padding-top:14px}
.bcard .bbody p{margin-bottom:14px}
.bcard:hover{border-color:rgba(228,255,92,.55)}
.bgrid .bcard{height:auto!important}
@media(max-width:700px){
  .bcard::before,.bcard .bimg{height:150px;flex-basis:150px}
  .bcard .bbody{padding:14px 16px 16px!important}
  .bcard .bbody h3,.bcard .bbody h2{font-size:17px!important}
  .bcard p{font-size:12.5px;-webkit-line-clamp:2}
  /* blog page: compact 2 × 2 */
  .bgrid{grid-template-columns:1fr 1fr;gap:12px}
  .bgrid .bcard{border-radius:16px}
  .bgrid .bcard::before,.bgrid .bcard .bimg{height:96px;flex-basis:96px}
  .bgrid .bcard .cat{font-size:7.5px;padding:4px 8px;top:8px;left:8px;letter-spacing:.1em}
  .bgrid .bcard .bbody{padding:10px 11px 12px!important}
  .bgrid .bcard .bbody h2{font-size:13px!important;line-height:1.18!important}
  .bgrid .bcard p{display:none}
  .bgrid .bcard .bdate{font-size:8.5px;margin-bottom:5px}
  .bgrid .bcard .bgo{font-size:10px;padding-top:8px}
}

/* ══ v3.9.3 — CV voice agent + formats ══ */
.cv-agent{position:relative;margin:0 0 18px;padding:16px;border-radius:18px;border:1px solid rgba(228,255,92,.45);
  background:radial-gradient(120% 140% at 0% 0%,rgba(228,255,92,.16),transparent 55%),radial-gradient(120% 140% at 100% 100%,rgba(99,234,255,.14),transparent 55%),rgba(9,12,22,.7);overflow:hidden}
.cv-ag-top{display:flex;align-items:center;gap:14px}
.cv-ag-orb{position:relative;flex:0 0 52px;height:52px;border-radius:50%;display:grid;place-items:center;color:#0a0d05;background:linear-gradient(180deg,#f1ff9b,#d7f43f);box-shadow:0 0 0 1px rgba(228,255,92,.6)}
.cv-ag-orb svg{width:24px;height:24px;position:relative;z-index:2}
.cv-ag-orb i{position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(228,255,92,.6);animation:agRing 2.4s ease-out infinite}
.cv-ag-orb i+i{animation-delay:1.2s}
@keyframes agRing{from{transform:scale(1);opacity:.9}to{transform:scale(1.7);opacity:0}}
.cv-ag-copy{flex:1;min-width:0}
.cv-ag-copy b{display:block;font-family:var(--f-disp);font-size:17px;letter-spacing:.05em;text-transform:uppercase;color:#fff}
.cv-ag-copy small{display:block;font-size:11.5px;color:var(--grey);margin-top:2px}
.cv-ag-copy .cv-ag-ur{font-size:13px;color:#d9f97a;font-family:'Noto Nastaliq Urdu','Jameel Noori Nastaleeq',serif;line-height:1.9}
.cv-ag-go{flex:0 0 auto;padding:12px 18px!important}
.cv-ag-body{margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.1)}
.cv-ag-langs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.cv-ag-langs button{padding:8px 14px;border-radius:99px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);color:#e4e8f1;font-size:14px;cursor:pointer}
.cv-ag-langs button.on{background:var(--lime);color:#0a0d05;border-color:var(--lime);font-weight:700}
.cv-ag-prog{display:flex;align-items:center;gap:10px;font-family:var(--f-mono);font-size:11px;color:var(--grey);letter-spacing:.12em}
.cv-ag-prog i{flex:1;height:4px;border-radius:4px;background:rgba(255,255,255,.1);overflow:hidden}
.cv-ag-prog em{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--cyan),var(--lime));transition:width .5s}
.cv-ag-say{background:none;border:0;font-size:18px;cursor:pointer;padding:2px 4px}
.cv-ag-q{margin:12px 0 4px;font-size:18px;line-height:1.75;color:#fff;font-weight:600}
.cv-ag-q[dir=rtl]{font-family:'Noto Nastaliq Urdu','Noto Naskh Arabic','Jameel Noori Nastaleeq',serif;font-size:19px;line-height:2.1}
.cv-ag-qen{margin:0 0 12px;font-size:12.5px;color:var(--grey)}
.cv-ag-talk{display:flex;justify-content:center;margin:6px 0 12px}
.cv-ag-mic{display:inline-flex;align-items:center;gap:12px;padding:14px 24px;border-radius:99px;border:1px solid var(--lime);background:rgba(228,255,92,.1);color:#fff;cursor:pointer;font-size:15px}
.cv-ag-mic b{font-weight:700}
.cv-ag-wave{display:flex;gap:3px;align-items:center;height:20px}
.cv-ag-wave i{width:3px;height:6px;border-radius:3px;background:var(--lime)}
.cv-ag-mic.on{background:var(--lime);color:#0a0d05;box-shadow:0 0 0 6px rgba(228,255,92,.15),0 0 30px rgba(228,255,92,.45)}
.cv-ag-mic.on .cv-ag-wave i{background:#0a0d05;animation:agWave .9s ease-in-out infinite}
.cv-ag-mic.on .cv-ag-wave i:nth-child(2){animation-delay:.12s}.cv-ag-mic.on .cv-ag-wave i:nth-child(3){animation-delay:.24s}.cv-ag-mic.on .cv-ag-wave i:nth-child(4){animation-delay:.36s}.cv-ag-mic.on .cv-ag-wave i:nth-child(5){animation-delay:.48s}
@keyframes agWave{0%,100%{height:5px}50%{height:20px}}
#cvAgA{width:100%;box-sizing:border-box;font-size:16px;line-height:1.7}
.cv-ag-tip{font-size:12.5px;color:#ffd166;margin:8px 0 0}
.cv-ag-nav{display:flex;align-items:center;gap:8px;margin-top:12px}.cv-ag-nav .btn{margin-left:auto}
.cv-ag-build{width:100%;margin-top:12px;justify-content:center}
.cv-ag-busy{display:flex;flex-direction:column;align-items:center;gap:6px;padding:22px 0;text-align:center}
.cv-ag-busy small{color:var(--grey)}
.cv-ag-spin{width:38px;height:38px;border-radius:50%;border:3px solid rgba(228,255,92,.2);border-top-color:var(--lime);animation:agSpin .9s linear infinite}
@keyframes agSpin{to{transform:rotate(360deg)}}
.cv-levels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:8px 0 16px}
.cv-levels label{display:flex;cursor:pointer;min-width:0}.cv-levels input{position:absolute;opacity:0}
.cv-levels span{flex:1;display:block;padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.04);transition:all .3s}
.cv-levels b{display:block;font-family:var(--f-disp);font-size:16px;letter-spacing:.06em;text-transform:uppercase;color:#fff}
.cv-levels em{font-style:normal;font-size:11.5px;color:var(--grey);line-height:1.4;display:block;margin-top:3px}
.cv-levels input:checked+span{border-color:var(--lime);background:rgba(228,255,92,.1);box-shadow:0 0 0 1px var(--lime)}
.cv-proj{margin:2px 0 12px;border:1px dashed rgba(99,234,255,.35);border-radius:12px;padding:8px 12px}
.cv-proj summary{cursor:pointer;color:#cfe;font-size:13.5px}.cv-proj summary small{color:var(--grey);font-size:11.5px}
.cv-proj[open] summary{margin-bottom:10px}
@media(max-width:700px){.cv-levels{grid-template-columns:1fr}.cv-ag-top{flex-wrap:wrap}.cv-ag-go{width:100%;justify-content:center}.cv-ag-q{font-size:16.5px}}
.cv-agent [hidden]{display:none!important}
.cv-ag-free{margin:0 0 10px;padding:8px 12px;border-radius:10px;background:rgba(99,234,255,.08);border:1px solid rgba(99,234,255,.3);font-size:13px;color:#cfefff;line-height:1.8}
.cv-ag-tip.warn{display:flex;flex-direction:column;gap:6px;padding:10px 12px;border-radius:12px;background:rgba(255,209,102,.1);border:1px solid rgba(255,209,102,.45);color:#ffe3a1}
.cv-ag-tip.warn b{font-weight:600;color:#fff2cc}.cv-ag-tip.warn span{line-height:1.9}.cv-ag-tip.warn .cv-mini{align-self:flex-start;text-decoration:none}
/* ══ v3.11 — logo: outline draws, white flash on completion (no glitch) ══ */
.jm-gh{display:none!important}
.seen .jmark .jm-main{animation:none!important}
.jm-flash{position:absolute;left:50%;top:50%;width:160%;aspect-ratio:1;transform:translate(-50%,-50%) scale(.2);border-radius:50%;pointer-events:none;opacity:0;
  background:radial-gradient(circle,rgba(255,255,255,.95) 0%,rgba(255,255,255,.55) 22%,rgba(255,255,255,0) 62%);mix-blend-mode:screen}
.seen .jm-flash,.jm-play .jm-flash{animation:jmFlash 5s ease-out infinite}
.seen .jm-fill,.jm-play .jm-fill{animation:jmFillW 5s linear infinite!important}
@keyframes jmFlash{0%,35%{opacity:0;transform:translate(-50%,-50%) scale(.2)}37%{opacity:1;transform:translate(-50%,-50%) scale(.75)}48%{opacity:0;transform:translate(-50%,-50%) scale(1.15)}100%{opacity:0}}
@keyframes jmFillW{0%,35%{opacity:0;fill:#fff}37%{opacity:1;fill:#fff;filter:brightness(1.6)}50%{opacity:1;fill:#f4ffd6;filter:none}84%{opacity:1}92%,100%{opacity:0}}
.jm-fill{fill:#f4ffd6}
@media(prefers-reduced-motion:reduce){.jm-flash{display:none}}
/* ══ nav / footer logo ══ */
.brand .bmark{height:32px;width:auto;flex:0 0 auto;filter:drop-shadow(0 0 8px rgba(228,255,92,.3))}
.brand .bname{font-weight:inherit;white-space:nowrap}
@media(max-width:420px){.brand .bmark{height:27px}}
/* ══ footer · Find Us ══ */
.foff{display:grid;gap:10px;margin-top:14px}
.foff-c{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.015))}
.foff-i{flex:0 0 32px;height:32px;border-radius:10px;display:grid;place-items:center;color:var(--lime);background:rgba(228,255,92,.1);border:1px solid rgba(228,255,92,.3)}
.foff-i svg{width:16px;height:16px}
.foff-c b{display:block;font-family:var(--f-mono);font-size:10px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--lime);margin-bottom:3px}
.foff-c p{margin:0;font-size:13.5px;line-height:1.55;color:#d7dceb}
.fchips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.fchip{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:99px;font-size:13px;font-weight:600;color:#0a0d05;background:linear-gradient(180deg,#f1ff9b,#d7f43f);text-decoration:none}
.fchip+.fchip{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.2)}
.fchip svg{width:15px;height:15px}
.fmap{background:radial-gradient(120% 90% at 85% 0%,rgba(228,255,92,.18),transparent 55%),repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 1px,transparent 1px 22px),repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 1px,transparent 1px 22px),#0b1122!important}
/* CV design thumbnails for the two new templates */
.th-project u:first-child{margin:0 auto;width:50%}
.th-project::after{content:'';position:absolute;left:8px;right:8px;top:24px;height:22px;border:1px solid #cfd5df;
  background:linear-gradient(#1f3a5f,#1f3a5f) top/100% 5px no-repeat,linear-gradient(90deg,#eef1f5 30%,transparent 30%) 0 6px/100% 16px no-repeat,repeating-linear-gradient(180deg,transparent 0 4px,#cfd5df 4px 5px) 0 6px/100% 16px no-repeat}
.th-project u:nth-child(n+3){display:none}
.th-full u{height:3px;margin-top:3px}.th-full u:first-child{margin:0 auto;width:50%;height:6px}
.th-full::after{content:'';position:absolute;left:8px;right:8px;top:30px;bottom:6px;background:repeating-linear-gradient(180deg,#cfd5df 0 2px,transparent 2px 5px)}
.pkgs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pkg{position:relative;display:flex;flex-direction:column;gap:10px;padding:26px 22px;border-radius:20px;border:1px solid rgba(255,255,255,.14);background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02))}
.pkg.hot{border-color:var(--lime);background:linear-gradient(160deg,rgba(228,255,92,.14),rgba(255,255,255,.03));box-shadow:0 30px 70px -36px rgba(228,255,92,.6)}
.pkg-n{align-self:flex-start;padding:5px 11px;border-radius:99px;font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--lime);border:1px solid rgba(228,255,92,.4)}
.pkg h3{font-family:var(--f-disp);font-size:22px;letter-spacing:.03em;text-transform:uppercase}
.pkg p{color:#cfd6e4;font-size:14px;line-height:1.6;flex:1}
.pkg .btn{align-self:flex-start;margin-top:6px}
@media(max-width:860px){.pkgs{grid-template-columns:1fr}}

/* ══════ v3.12 — LANGUAGE SWITCH ══════ */
.lang{position:relative;flex:none}
.lang-b{display:flex;align-items:center;gap:6px;height:40px;padding:0 11px;border-radius:10px;border:1px solid var(--edge-2);background:rgba(255,255,255,.05);color:#e8edf7;font:700 11.5px/1 var(--f-mono,monospace);letter-spacing:.08em;cursor:pointer;transition:border-color .25s,background .25s}
.lang-b svg{width:17px;height:17px}
.lang-b:hover,.lang.on .lang-b{border-color:var(--lime);background:rgba(228,255,92,.08)}
.lang-m{position:absolute;right:0;top:calc(100% + 10px);z-index:60;width:230px;max-height:min(70vh,420px);overflow:auto;padding:6px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(10,14,26,.97);box-shadow:0 30px 60px -20px rgba(0,0,0,.8);display:grid;grid-template-columns:1fr 1fr;gap:2px}
.lang-m[hidden]{display:none}
.lang-m button{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:9px;border:0;background:none;color:#dfe5f1;font-size:13.5px;text-align:left;cursor:pointer}
.lang-m button b{min-width:22px;font:700 10px/1 var(--f-mono,monospace);color:var(--lime);letter-spacing:.06em}
.lang-m button:hover{background:rgba(255,255,255,.07)}
.lang-m button.cur{background:rgba(228,255,92,.12);color:#fff}
.lang-m small{grid-column:1/-1;padding:8px 10px 4px;color:#8f9ab0;font-size:11px}
@media(max-width:1050px){.lang{margin-left:auto}.lang-b{height:44px}}
@media(max-width:420px){.lang-b{padding:0 9px}.lang-m{width:min(230px,calc(100vw - 32px))}}
/* hide Google's own bar */
.skiptranslate iframe,.goog-te-banner-frame,#goog-gt-tt,.goog-te-balloon-frame,.VIpgJd-ZVi9od-ORHb-OEVmcd,.VIpgJd-ZVi9od-aZ2wEe-wOHMyf,.VIpgJd-yAWNEb-L7lbkb{display:none!important}
body{top:0!important}
font[style]{background:none!important;box-shadow:none!important}
#gt_el{display:none}

/* ══════ v3.12 — LIVE SKY (real Bannu weather + time) ══════ */
.skyl{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;opacity:0;transition:opacity 1.4s ease}
.skyl.on{opacity:1}
.skyl>*{position:absolute;inset:0;transition:opacity 2s ease}
.skyl canvas{width:100%;height:100%}
/* clouds — one canvas, one layer */
.sk-clouds{opacity:0;inset:0 auto auto 0!important;width:200vw;height:70vh;animation:skDrift 240s linear infinite;will-change:transform}
.sk-clouds canvas{display:block;width:100%;height:100%}
@keyframes skDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-100vw,0,0)}}
.skyl.wx-partly .sk-clouds{opacity:.8}
.skyl.wx-cloud .sk-clouds,.skyl.wx-drizzle .sk-clouds,.skyl.wx-rain .sk-clouds,.skyl.wx-storm .sk-clouds,.skyl.wx-snow .sk-clouds,.skyl.wx-fog .sk-clouds{opacity:1}
.skyl:not(.wx-partly):not(.wx-cloud):not(.wx-drizzle):not(.wx-rain):not(.wx-storm):not(.wx-snow):not(.wx-fog) .sk-clouds{animation:none}
/* fog */
.sk-fog{opacity:0}
.sk-fog i{position:absolute;left:-20%;width:140%;height:42vh;background:linear-gradient(180deg,transparent,rgba(200,210,225,.13),transparent)}
.skyl.wx-fog .sk-fog i{animation:skFog 40s ease-in-out infinite alternate}
.sk-fog i:nth-child(1){top:18%}.sk-fog i:nth-child(2){top:56%;animation-delay:-20s}
@keyframes skFog{to{transform:translate3d(10%,0,0)}}
.skyl.wx-fog .sk-fog{opacity:1}
/* lightning */
.sk-flash{opacity:0;background:radial-gradient(ellipse at 30% 0%,rgba(220,230,255,.5),rgba(200,215,255,.12) 50%,transparent 80%)}
.sk-flash.go{animation:skFlash 1.1s ease-out}
@keyframes skFlash{0%{opacity:0}5%{opacity:1}12%{opacity:.15}18%{opacity:.85}40%{opacity:0}}
#skyfx{z-index:1}
/* live chip */
.sky-chip{position:fixed;left:16px;bottom:18px;z-index:40;display:flex;align-items:center;gap:8px;max-width:calc(100vw - 110px);padding:8px 13px 8px 10px;border-radius:99px;border:1px solid rgba(255,255,255,.14);background:rgba(8,11,20,.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#dfe5f1;font-size:12px;line-height:1.2;cursor:default;transition:opacity .4s,transform .4s}
.sky-chip.demo{cursor:pointer}
.sky-chip.demo::after{content:'tap';margin-left:2px;padding:2px 6px;border-radius:99px;background:rgba(228,255,92,.16);color:var(--lime);font:700 9px/1.3 var(--f-mono,monospace);letter-spacing:.1em;text-transform:uppercase}
.sky-chip .sc-i{font-size:16px}
.sky-chip .sc-t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sky-chip b{color:#fff;font-weight:700}
.sky-chip.away{opacity:0;transform:translateY(12px);pointer-events:none}
@media(prefers-reduced-motion:reduce){.sk-clouds,.sk-fog i{animation:none}}
.sky-chip{left:auto;bottom:auto;right:24px;top:96px}
.sky-chip.away{transform:translateY(-10px)}
@media(max-width:900px){.sky-chip{right:16px;top:84px;font-size:11.5px;padding:7px 11px 7px 9px}}

/* ══════ v3.13 — one-line nav, white logo, tighter landing ══════ */
nav.site .links{flex-wrap:nowrap;white-space:nowrap;min-width:0}
nav.site .links a{white-space:nowrap}
.brand .bmark{filter:drop-shadow(0 0 6px rgba(255,255,255,.18))}
@media(max-width:1440px) and (min-width:1241px){nav.site{gap:18px}.links>a,.dd>a{padding:10px 9px}.links a{letter-spacing:.11em;font-size:13.5px}}
@media(max-width:1240px){.links{display:none!important}.burger{display:block}.nav-cta{display:none}.lang{margin-left:auto}}
.landing{min-height:54vh;padding-bottom:40px}
@media(max-width:700px){.landing{min-height:60vh;padding-bottom:36px}}

/* ══════ v3.14 — wordmark lockup ══════ */
.brand .bname{display:flex;flex-direction:column;gap:3px;line-height:1;font-weight:400;letter-spacing:0;text-transform:none}
.brand .bname em{font-style:normal;font-family:var(--f-wide);font-stretch:125%;font-weight:800;font-size:17px;letter-spacing:.05em;text-transform:uppercase;color:#fff}
.brand .bname small{font-family:'IBM Plex Mono',monospace;font-weight:500;font-size:9.4px;letter-spacing:.47em;text-transform:uppercase;color:#b8c0d2;padding-left:1px}
.brand .bmark{height:34px}
@media(max-width:420px){.brand .bname em{font-size:15px}.brand .bname small{font-size:8.4px;letter-spacing:.42em}.brand .bmark{height:30px}}
.tw-note{margin-top:18px;font-size:12.5px;color:#8f9ab0}
.tw-note a{color:var(--lime);text-decoration:underline;text-underline-offset:3px}

/* v3.15 — soft cloud edge + brighter daytime sky */
.sk-clouds{-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 45%,transparent 100%);mask-image:linear-gradient(180deg,#000 0%,#000 45%,transparent 100%)}
.chaty-widget,.chaty{display:none!important}

/* v3.16 — Think/Build/Scale without numbers; glass CV card */
.lbe2-steps button{grid-template-columns:1fr;row-gap:3px;text-align:left}
@media(max-width:700px){.lbe2-steps button{padding:9px 10px 11px}.lbe2-steps b{font-size:12.5px}.lbe2-steps span{font-size:9px;letter-spacing:.1em;overflow:visible}}
.cvt{background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.025))!important;border:1px solid rgba(255,255,255,.14)!important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.cvt-paper{background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.22);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 40px 80px -30px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.25)}
.cvt-paper i{background:rgba(255,255,255,.22)}
.cvt-paper i.h{background:linear-gradient(90deg,var(--lime),#9fe6c4)}.cvt-paper i.s{background:rgba(255,255,255,.45)}
.cvt-paper i.sec{background:var(--lime);opacity:.8}

.skyl .sk-sun{transition:opacity .8s ease}
.skyl.sun-away .sk-sun{opacity:0}

/* v3.18 — project cards: client name under the title, short 3-line summary */
.aclient,.wclient{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:650;color:#e9eefc;letter-spacing:.005em;margin:-1px 0 12px}
.aclient::before,.wclient::before{content:"";width:16px;height:1.5px;background:var(--lime);flex:0 0 auto}
.wclient{margin:6px 0 0;font-size:12px;color:#cdd6ea}
.acard .abody p{display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;flex:0 0 auto;margin-bottom:16px}
.acard .atags{margin-top:auto}
.pinner .aclient{margin:4px 0 14px}

/* v3.18 — translated pages (Urdu, Pashto, Arabic…): moving rails keep a left-to-right track so they never
   jump or empty out; the text inside each card still reads right-to-left. No scroll-scrubbed effects. */
html.jt-rtl :is(.marq,.marq-in,.mrail,.mtrack,.cine-track,.agrid,.team,.steps){direction:ltr!important}
html.jt-rtl :is(.marq-in,.mtrack,.cine-track,.agrid,.team,.steps)>*{direction:rtl!important;text-align:right}
html.jt-rtl :is(.marq-in,.mtrack)>* *{direction:rtl}
html.jt-tr .kw-w{animation:none!important;opacity:1!important;transform:none!important}
html.jt-tr .rise{transition-duration:.35s!important;transform:none!important}
html.jt-tr font{background:none!important;box-shadow:none!important}
html.jt-tr body{top:0!important}
html.jt-tr .goog-te-banner-frame,html.jt-tr #goog-gt-tt,html.jt-tr .skiptranslate iframe{display:none!important}
/* v3.18 — blog grid never leaves one card alone on the last row */
@media(min-width:701px){
  .bgrid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .bgrid>.bcard{grid-column:span 2}
  .bgrid>.bcard:last-child:nth-child(3n+2),.bgrid>.bcard:nth-last-child(2):nth-child(3n+1){grid-column:span 3}
  .bgrid>.bcard:last-child:nth-child(3n+1){grid-column:span 6;min-height:420px}
  .bgrid>.bcard:last-child:nth-child(3n+1) .bbody{max-width:620px}
}
@media(min-width:701px) and (max-width:1060px){
  .bgrid{grid-template-columns:1fr 1fr}
  .bgrid>.bcard,.bgrid>.bcard:last-child:nth-child(3n+2),.bgrid>.bcard:nth-last-child(2):nth-child(3n+1){grid-column:auto}
  .bgrid>.bcard:last-child:nth-child(3n+1){grid-column:auto}
  .bgrid>.bcard:last-child:nth-child(odd){grid-column:1/-1}
}
@media(max-width:700px){.bgrid>.bcard:last-child:nth-child(odd){grid-column:1/-1}}
/* ═══════ v3.18 — BLOG ARTICLE ═══════ */
.ahero{position:relative;padding:150px 0 70px;overflow:hidden;isolation:isolate}
.ahero-bg{position:absolute;inset:-40px;z-index:-1;background-size:cover;background-position:center;filter:blur(38px) saturate(1.25) brightness(.45);transform:scale(1.15);opacity:.75}
.ahero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,11,20,.35),rgba(8,11,20,.2) 40%,var(--ink) 100%)}
.ahero-in{max-width:980px}
.ahero h1{font-size:clamp(32px,4.6vw,60px);font-weight:900;line-height:1.04;letter-spacing:-.04em;margin:18px 0 26px;text-wrap:balance}
.ameta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:22px;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:#c9d2e6}
.ameta i{font-style:normal;opacity:.5}
.acat{padding:6px 13px;border-radius:99px;background:var(--lime);color:#0a0d05;font-weight:700}
.aby{display:flex;align-items:center;gap:13px;color:#dfe6f5;font-size:14.5px}
.aby small{display:block;color:var(--grey);font-size:12.5px;margin-top:2px}
.aby b{color:#fff}
.aby-logo{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(140deg,#1d2b55,#0d1430);border:1px solid var(--edge)}
.asec{padding:0 0 90px}
.aflow{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:40px;align-items:start}
.apaper{min-width:0;border-radius:28px;padding:0 0 34px;background:linear-gradient(180deg,rgba(17,23,49,.82),rgba(10,14,30,.88));border:1px solid var(--edge-2);box-shadow:0 40px 90px -40px rgba(0,0,0,.8);overflow:hidden}
.acover{margin:0 0 6px}
.acover img{display:block;width:100%;height:auto;max-height:520px;object-fit:cover}
.apaper .entry{padding:34px clamp(22px,5vw,58px) 0;font-size:17.5px;line-height:1.82;color:#d3dbec;max-width:none}
.apaper .entry>*{max-width:760px;margin-left:auto;margin-right:auto}
.apaper .entry>*+*{margin-top:1.15em}
.apaper .entry h2,.apaper .entry h3,.apaper .entry h4,.apaper .entry h5{color:#fff;font-family:var(--f-body);font-weight:850;letter-spacing:-.025em;line-height:1.2;text-transform:none}
.apaper .entry h2{font-size:clamp(25px,2.8vw,33px);margin-top:1.8em;padding-top:.2em}
.apaper .entry h2.has-text-align-center,.apaper .entry h2.has-text-align-left{text-align:left}
.apaper .entry h3{font-size:clamp(21px,2.2vw,25px);margin-top:1.6em}
.apaper .entry h4{font-size:19px;margin-top:1.4em;color:var(--lime)}
.apaper .entry h5{font-size:16.5px}
.apaper .entry h2::before{content:"";display:block;width:46px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--lime),var(--cyan));margin-bottom:16px}
.apaper .entry p{margin-bottom:0}
.apaper .entry strong,.apaper .entry b{color:#fff;font-weight:700}
.apaper .entry a{color:var(--lime);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.apaper .entry ul,.apaper .entry ol{padding-left:0;list-style:none}
.apaper .entry li{position:relative;padding-left:30px;margin-top:.55em}
.apaper .entry ul>li::before{content:"";position:absolute;left:6px;top:.72em;width:9px;height:9px;border-radius:3px;background:var(--lime);transform:rotate(45deg)}
.apaper .entry ol{counter-reset:li}
.apaper .entry ol>li{counter-increment:li}
.apaper .entry ol>li::before{content:counter(li);position:absolute;left:0;top:.25em;width:21px;height:21px;border-radius:7px;display:grid;place-items:center;font:700 11.5px/1 var(--f-mono);background:rgba(228,255,92,.14);color:var(--lime);border:1px solid var(--edge)}
.apaper .entry hr,.apaper .entry .wp-block-separator{border:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);margin:2.2em auto}
.apaper .entry figure{margin-top:1.6em;margin-bottom:0}
.apaper .entry img{display:block;max-width:100%;height:auto;border-radius:18px;border:1px solid var(--edge-2)}
.apaper .entry .wp-block-image,.apaper .entry figure.wp-block-image{text-align:center}
.apaper .entry .wp-block-image img{margin:0 auto}
.apaper .entry figcaption,.apaper .entry .wp-element-caption{margin-top:10px;font-size:13px;color:var(--grey);text-align:center}
.apaper .entry .wp-block-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.apaper .entry .wp-block-gallery figure{margin:0}
.apaper .entry .wp-block-gallery img{width:100%;height:100%;aspect-ratio:4/3;object-fit:cover}
.apaper .entry video{width:100%;border-radius:18px;border:1px solid var(--edge-2)}
.apaper .entry blockquote{padding:22px 26px;border:0;border-left:3px solid var(--lime);background:rgba(228,255,92,.06);border-radius:0 18px 18px 0;font-size:19px;color:#fff}
.apaper .entry .wp-block-columns{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px}
.apaper .entry .wp-block-buttons{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.apaper .entry .wp-block-button__link{display:inline-flex;padding:14px 26px;border-radius:99px;background:var(--lime);color:#0a0d05!important;text-decoration:none!important;font-family:var(--f-disp);font-weight:700;font-size:15px!important;letter-spacing:.12em;text-transform:uppercase}
.apaper .entry .wp-block-spacer{height:18px!important}
.apaper .entry table{display:block;overflow-x:auto;font-size:15px}
.apaper .entry .wp-block-jetpack-related-posts,.apaper .entry .sharedaddy,.apaper .entry .jp-relatedposts{display:none!important}
.apaper .entry [class*="elementor"]{max-width:760px}
.ashare{display:flex;flex-wrap:wrap;align-items:center;gap:9px;max-width:760px;margin:44px auto 0;padding:22px clamp(22px,5vw,58px) 0;border-top:1px solid var(--edge-2);box-sizing:content-box}
.ashare span{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);margin-right:6px}
.ashare a{padding:8px 15px;border-radius:99px;border:1px solid var(--edge-2);font-size:13px;font-weight:700;color:#e9eefc;transition:border-color .25s,color .25s}
.ashare a:hover{border-color:var(--lime);color:var(--lime)}
.aside{position:sticky;top:110px}
.acta{padding:28px;border-radius:24px;background:linear-gradient(150deg,rgba(228,255,92,.12),rgba(99,234,255,.05) 55%,rgba(255,255,255,.03));border:1px solid rgba(228,255,92,.3);backdrop-filter:blur(12px)}
.acta h3{font-size:26px;font-weight:850;letter-spacing:-.03em;line-height:1.1;margin:10px 0 12px}
.acta p{color:#c9d2e6;font-size:14.5px;line-height:1.65;margin-bottom:20px}
.acta .btn{display:flex;justify-content:center;width:100%;margin-top:10px}
.arel{padding:0 0 100px}
.arel h2{margin-bottom:30px}
@media(max-width:980px){.aflow{grid-template-columns:1fr}.aside{position:static}}
@media(max-width:700px){
  .ahero{padding:118px 0 40px}
  .apaper{border-radius:20px}
  .apaper .entry{font-size:16.5px;line-height:1.75;padding-top:24px}
  .apaper .entry blockquote{font-size:17px;padding:16px 18px}
  .ashare{margin-top:32px}
}

/* ═══════ TEAM — flip cards (v3.19) ═══════ */
.tflip{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:20px}
.tm{position:relative;aspect-ratio:3/4;perspective:1400px;cursor:pointer;outline:none;-webkit-tap-highlight-color:transparent}
.tm-in{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.22,1,.36,1)}
.tm.on .tm-in{transform:rotateY(180deg)}
.tm-f,.tm-b{position:absolute;inset:0;border-radius:20px;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden;
  border:1px solid var(--edge-2);box-shadow:0 30px 60px -34px rgba(0,0,0,.8)}
.tm-f{background:radial-gradient(120% 80% at 50% 105%,rgba(228,255,92,.20),transparent 60%),
  radial-gradient(90% 60% at 50% 0%,rgba(99,234,255,.14),transparent 70%),linear-gradient(180deg,rgba(17,23,49,.92),rgba(8,11,20,.96))}
.tm-glow{position:absolute;inset:auto 12% 18% 12%;height:46%;border-radius:50%;background:radial-gradient(closest-side,rgba(228,255,92,.22),transparent);filter:blur(18px)}
.tm-pic{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;
  transition:transform .9s cubic-bezier(.22,1,.36,1),filter .5s;filter:saturate(.92) brightness(.95)}
.tm-ini{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--f-disp);font-size:72px;color:var(--lime);opacity:.6}
.tm-f::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(8,11,20,.97) 4%,rgba(8,11,20,.55) 28%,transparent 52%);pointer-events:none}
.tm-name{position:absolute;left:18px;right:18px;bottom:16px;z-index:2}
.tm h4{font-size:19px;font-weight:800;letter-spacing:-.01em;line-height:1.12}
.tm-hint{display:inline-flex;align-items:center;gap:6px;margin-top:7px;font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--grey);transition:color .3s}
.tm-hint i{font-style:normal;display:inline-block;transition:transform .5s}
.tm:hover .tm-pic,.tm:focus-visible .tm-pic{transform:scale(1.05);filter:saturate(1.05) brightness(1.02)}
.tm:hover .tm-hint,.tm:focus-visible .tm-hint{color:var(--lime)}
.tm:hover .tm-hint i{transform:rotate(180deg)}
.tm:focus-visible .tm-f,.tm:focus-visible .tm-b{border-color:var(--lime);box-shadow:0 0 0 2px rgba(228,255,92,.5),0 30px 60px -34px rgba(0,0,0,.8)}
.tm-b{transform:rotateY(180deg);padding:24px 20px 18px;display:flex;flex-direction:column;gap:14px;
  background:radial-gradient(110% 70% at 100% 0%,rgba(228,255,92,.16),transparent 60%),
  radial-gradient(90% 70% at 0% 100%,rgba(99,234,255,.12),transparent 65%),rgba(14,19,40,.78);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.tm-div{font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan)}
.tm-b h4{font-size:21px;padding-bottom:12px;border-bottom:1px solid var(--edge-2)}
.tm-sec{display:flex;flex-direction:column;gap:5px}
.tm-sec span{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--grey)}
.tm-sec b{color:var(--lime);font-weight:700;font-size:14.5px;line-height:1.35}
.tm-sec b.tm-edu{color:var(--white)}
.tm-org{margin-top:auto;font-family:var(--f-disp);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.tm-b .tm-hint{margin-top:0}
@media (max-width:760px){.mrail.tflip .tm{aspect-ratio:3/4}.tm h4{font-size:18px}.tm-b{padding:20px 16px 16px;gap:11px}}
@media (max-width:700px){.mx-track>.mclone.tm,.mrail .mtrack>.mclone.tm{display:block!important}}
@media (prefers-reduced-motion:reduce){.tm-in{transition:none}.tm-pic{transition:none}}

/* Reels without a saved TikTok cover get a branded cover instead of an empty card (v3.19) */
.reel .rcover{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  background:radial-gradient(90% 60% at 50% 30%,rgba(228,255,92,.20),transparent 65%),radial-gradient(80% 60% at 50% 100%,rgba(99,234,255,.18),transparent 70%),linear-gradient(180deg,#121a3a,#080b14)}
.reel .rcover .rc-j{width:74px;height:74px;border-radius:22px;display:grid;place-items:center;font-family:var(--f-disp);font-weight:800;font-size:40px;
  color:#080b14;background:linear-gradient(135deg,#fff,#d9dee8);box-shadow:0 18px 40px -16px rgba(228,255,92,.55)}
.reel .rcover .rc-h{font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;color:var(--lime)}
.reel .rcover .rc-t{font-family:var(--f-disp);font-size:15px;text-transform:uppercase;letter-spacing:.08em;color:#fff}
/* v3.21: compact team — 5 across on wide screens (2 rows), 4 on laptops, 3 on tablets */
@media (min-width:1180px){.tflip{grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}.tflip .tm h4{font-size:17px}.tflip .tm-b{padding:18px 16px 14px;gap:10px}.tflip .tm-b h4{font-size:18px}.tflip .tm-sec b{font-size:13.5px}}
@media (min-width:901px) and (max-width:1179px){.tflip{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}}
@media (min-width:701px) and (max-width:900px){.tflip{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}}
@media (max-width:700px){.mrail.tflip .mx-track>*{flex-basis:56vw!important}}
/* v3.22 team: one gliding row + "Show all" grid */
.tm-marq .marq-in{gap:18px;padding:10px 0 22px}
.tm-marq .tm{flex:0 0 236px;width:236px}
.tm-marq:has(.tm.on) .marq-in,.tm-marq:focus-within .marq-in{animation-play-state:paused}
.tm-more{display:flex;justify-content:center;margin:6px 0 4px}
.tm-grid:not([hidden]){display:grid;gap:16px;margin-top:22px;grid-template-columns:repeat(5,minmax(0,1fr));animation:tmIn .5s cubic-bezier(.22,1,.36,1)}
@keyframes tmIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (max-width:1179px){.tm-grid:not([hidden]){grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:900px){.tm-grid:not([hidden]){grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){.tm-marq .tm,.marq.mx .tm{flex:0 0 58vw!important;width:58vw}.tm-grid:not([hidden]){grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .tm-grid .tm h4{font-size:15px}.tm-grid .tm-b{padding:14px 12px 12px;gap:8px}.tm-grid .tm-b h4{font-size:15px;padding-bottom:8px}.tm-grid .tm-sec b{font-size:12.5px}.tm-grid .tm-div,.tm-grid .tm-org{display:none}}
@media (prefers-reduced-motion:reduce){.tm-grid:not([hidden]){animation:none}}
html{overflow-x:clip}
/* v3.23: "View all" is a small highlighted text link, top-left above the row */
.tm-more{justify-content:flex-start!important;margin:-6px 0 10px!important}
.tm-all{background:none;border:0;padding:4px 0;cursor:pointer;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--lime);display:inline-flex;align-items:center;gap:8px;border-bottom:1px solid rgba(228,255,92,.35);transition:border-color .3s,gap .3s}
.tm-all i{font-style:normal;transition:transform .3s}
.tm-all:hover{border-color:var(--lime);gap:12px}.tm-all:focus-visible{outline:2px solid var(--lime);outline-offset:4px}
.tm-grid:not([hidden]){margin-top:6px}
/* v3.24 Brands We Built in Bannu (branding page) */
.bb-grid{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr))}
.bb-card{position:relative;display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:16px;border:1px solid var(--edge-2);
  background:linear-gradient(180deg,rgba(17,23,49,.75),rgba(8,11,20,.85));transition:transform .35s cubic-bezier(.22,1,.36,1),border-color .3s}
a.bb-card:hover{transform:translateY(-4px);border-color:var(--lime)}
.bb-mark{flex:0 0 54px;height:54px;border-radius:14px;display:grid;place-items:center;overflow:hidden;
  background:radial-gradient(80% 80% at 30% 20%,rgba(228,255,92,.22),transparent 70%),rgba(255,255,255,.06);border:1px solid var(--edge)}
.bb-mark b{font-family:var(--f-disp);font-size:20px;font-weight:800;color:var(--lime);letter-spacing:.02em}
.bb-mark img{width:100%;height:100%;object-fit:contain;padding:6px;background:#fff}
.bb-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.bb-txt b{font-size:15.5px;line-height:1.25;color:#fff}
.bb-txt small{font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
.bb-go{position:absolute;top:12px;right:14px;font-style:normal;color:var(--lime);font-size:13px}
@media (max-width:900px){.bb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.bb-grid{grid-template-columns:1fr}}