*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0}
img,svg{display:block;max-width:100%}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
a{text-decoration:none;color:inherit}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,p{margin:0}

:root{
  --azure:#1c75bc; --violet:#6c49ce; --navy:#112e81;
  --ink:#112e81; --muted:#5D6690; --line:rgba(30,42,115,.10); --line-2:rgba(30,42,115,.17);
  --bg0:#e8ecf5; --bg1:#f1f2f2;
  --glass:linear-gradient(160deg,rgba(255,255,255,.78),rgba(255,255,255,.54));
  --glass-strong:linear-gradient(160deg,rgba(255,255,255,.93),rgba(255,255,255,.75));
  --grad:linear-gradient(135deg, #112e81 0%, #1c75bc 50%, #6c49ce 100%);
  --sh:0 24px 54px -30px rgba(26,42,115,.28);
  --sh-in:inset 0 1px 0 rgba(255,255,255,.9);
  --orange:#f47a24;
  --maxw:min(1600px,94vw); --r:24px; --r-sm:16px;
  --fd:'Cairo',system-ui,sans-serif; --fb:'Cairo',system-ui,sans-serif;
}

body{
  background:
    radial-gradient(120% 80% at 80% -10%,rgba(108,73,206,.12),transparent 55%),
    radial-gradient(110% 90% at 0% 5%,rgba(28,117,188,.12),transparent 55%),
    linear-gradient(180deg,var(--bg1),var(--bg0) 60%);
  background-attachment:fixed;
  color:var(--ink);font-family:var(--fb);line-height:1.65;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
#space{position:fixed;inset:0;z-index:0;opacity:.72;pointer-events:none}
#glow{position:fixed;top:0;left:0;width:46px;height:46px;border-radius:50%;z-index:0;pointer-events:none;background:radial-gradient(circle,rgba(46,147,210,.55),rgba(142,125,240,.38) 46%,transparent 72%);filter:blur(2px);will-change:transform;transition:opacity .3s}
@media(prefers-reduced-motion:reduce){#glow{display:none}}
.veil{position:fixed;inset:0;z-index:0;pointer-events:none;background:
  radial-gradient(120% 70% at 50% 120%,rgba(243,245,254,.92),transparent 55%),
  radial-gradient(90% 60% at 50% -10%,transparent,rgba(243,245,254,.55) 92%)}
.stage{position:relative;z-index:1}
.page:not(#page-home){padding-top:80px}

.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(28px,4vw,64px)}
section{padding-block:clamp(52px,7vw,94px)}
h1,h2,h3{font-family:var(--fd);line-height:1.14;letter-spacing:-.02em;text-wrap:balance}
html[dir="rtl"] h1,html[dir="rtl"] h2,html[dir="rtl"] h3{letter-spacing:0;line-height:1.3}
.grad-t{color:var(--azure)}
.sec-h{text-align:center;max-width:100%;margin-inline:auto}
.sec-h h2{font-size:clamp(2.1rem,4.6vw,4rem);line-height:1.12}
.sec-h p{color:var(--muted);margin-top:20px;font-size:clamp(1.05rem,1.4vw,1.3rem);line-height:1.75;max-width:78ch;margin-inline:auto}
.sec-l{max-width:52ch}
.sec-l h2{font-size:clamp(1.7rem,3.4vw,2.4rem)}
.sec-l p{color:var(--muted);margin-top:12px;font-size:1.05rem}

/* glass */
.glass{background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(16px) saturate(130%);-webkit-backdrop-filter:blur(16px) saturate(130%);box-shadow:var(--sh),var(--sh-in)}

.btn{display:inline-flex;align-items:center;gap:8px;justify-content:center;padding:14px 26px;border-radius:999px;font-family:var(--fd);font-weight:700;font-size:.95rem;transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .26s,background .2s,color .2s,border-color .2s;white-space:nowrap;will-change:transform}
.btn:active{transform:translateY(1px) scale(.98)}
.btn-primary{background:linear-gradient(135deg,#ee7a20 0%,#f47a24 55%,#fb9c3c 100%);color:#fff;box-shadow:0 14px 30px -12px rgba(244,122,36,.55),var(--sh-in)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 20px 40px -12px rgba(244,122,36,.68)}
.btn-soft{background:rgba(255,255,255,.92);color:#16204a;box-shadow:0 12px 26px -14px rgba(0,0,0,.6)}
.btn-soft:hover{transform:translateY(-2px);background:#fff}
.btn-ghost{background:rgba(30,42,115,.045);color:var(--ink);border:1.5px solid var(--line-2);backdrop-filter:blur(8px)}
.btn-ghost:hover{border-color:var(--azure);color:var(--navy)}
.cta-band .btn-ghost,.jpanel .btn-ghost{background:rgba(255,255,255,.18);color:#fff;border-color:rgba(255,255,255,.42)}
.cta-band .btn-ghost:hover,.jpanel .btn-ghost:hover{color:#fff;border-color:#fff}
.btn-sm{padding:10px 18px;font-size:.86rem}
.btn-lg{padding:15px 30px;font-size:1rem}
.btn-block{width:100%}
.btn svg{width:17px;height:17px;stroke:currentColor;flex:none}

.mark{width:46px;height:46px;flex:none}
.logo{display:flex;align-items:center;gap:12px}
.logo .wm{height:29px;width:103px;color:var(--navy);display:block}
.logo:hover .mark{animation:markspin 1.2s cubic-bezier(.4,0,.2,1)}
@keyframes markspin{from{transform:rotate(0)}to{transform:rotate(360deg)}}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:40;padding:14px 26px;transition:padding .4s cubic-bezier(.4,0,.2,1)}
.nav .bar{position:relative;display:flex;align-items:center;gap:20px;height:64px;max-width:var(--maxw);margin-inline:auto;padding-inline:16px;border-radius:999px;background:#fff;border:1px solid var(--line);border-block-start:none;box-shadow:var(--sh),var(--sh-in);transition:max-width .55s cubic-bezier(.4,0,.2,1),border-radius .5s ease,background .45s ease,padding .45s ease,box-shadow .45s ease,border-color .45s ease}
.nav.scrolled{padding:0}
.nav.scrolled .bar{max-width:100%;border-radius:0;padding-inline:clamp(20px,4vw,60px);background:#fff;border-color:var(--line);border-block-end:1px solid var(--line);box-shadow:0 12px 34px -22px rgba(26,42,115,.26)}
.nav.scrolled .nav-links{gap:18px}
.nav.scrolled .nav-links a{padding:10px 20px}
.nav.scrolled .nav-right{gap:12px}
.nav-links{display:flex;gap:14px;align-items:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.nav-links a{padding:9px 16px;border-radius:999px;font-size:1rem;font-weight:600;color:var(--muted);transition:.18s;white-space:nowrap}
.nav-links a:hover{color:var(--navy);background:rgba(30,42,115,.06)}
.nav-links a.cur{color:var(--navy);background:rgba(30,42,115,.08)}
.nav-right{display:flex;align-items:center;gap:9px;margin-inline-start:auto}
.lang{width:42px;height:42px;flex:none;border:1.5px solid var(--line-2);border-radius:999px;display:grid;place-items:center;color:var(--ink);transition:.18s;position:relative}
.lang svg{width:20px;height:20px;stroke:currentColor;fill:none}
.lang .lg{position:absolute;inset-block-end:-4px;inset-inline-end:-4px;background:var(--grad);color:#fff;font-family:'Poppins',var(--fd);font-weight:700;font-size:.58rem;line-height:1;padding:3px 5px;border-radius:999px;letter-spacing:.02em;box-shadow:0 4px 10px -4px rgba(78,110,230,.6)}
.lang:hover{border-color:var(--azure);color:var(--azure);background:rgba(46,147,210,.07)}
.burger{display:none;width:44px;height:44px;border-radius:999px;border:1px solid var(--line-2);align-items:center;justify-content:center}
.burger svg{width:22px;height:22px;stroke:var(--ink)}
.mobwrap{display:contents}

/* --- Dropdown Menus --- */
.nav-dropdown{position:relative}
.nav-dd-btn{display:inline-flex;align-items:center;gap:4px;padding:9px 16px;border-radius:999px;font-size:1rem;font-weight:600;color:var(--muted);transition:.18s;cursor:pointer;font-family:var(--fd);white-space:nowrap}
.nav-dd-btn:hover{color:var(--navy);background:rgba(30,42,115,.06)}
.dd-chevron{width:14px;height:14px;stroke:currentColor;transition:transform .25s}
.nav-dropdown.open .dd-chevron{transform:rotate(180deg)}
.dd-menu{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);min-width:320px;background:var(--glass-strong);border:1px solid var(--line);border-radius:var(--r-sm);padding:8px;backdrop-filter:blur(18px);box-shadow:0 20px 50px -14px rgba(26,42,115,.3);opacity:0;visibility:hidden;transform:translateX(-50%) translateY(6px);transition:opacity .2s,visibility .2s,transform .2s;pointer-events:none;z-index:60}
.nav-dropdown.open .dd-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);pointer-events:auto}
.dd-item{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-radius:12px;transition:.15s;text-decoration:none;color:inherit}
.dd-item:hover{background:rgba(30,42,115,.06)}
.dd-icon{width:40px;height:40px;border-radius:12px;background:rgba(30,42,115,.06);display:grid;place-items:center;flex:none}
.dd-icon svg{width:20px;height:20px;stroke:var(--azure)}
.dd-item b{display:block;font-family:var(--fd);font-size:.94rem;color:var(--ink)}
.dd-item span{font-size:.82rem;color:var(--muted);line-height:1.4}

/* --- CTA Book a Demo Button (high contrast) --- */
.cta-book{box-shadow:0 14px 30px -12px rgba(244,122,36,.6),var(--sh-in)!important}

@media(max-width:960px){
  .mobwrap{position:absolute;inset-block-start:78px;inset-inline:0;display:none;flex-direction:column;gap:6px;background:var(--glass-strong);border:1px solid var(--line);border-radius:22px;padding:16px;backdrop-filter:blur(18px);box-shadow:var(--sh);max-height:80vh;overflow-y:auto}
  .mobwrap.open{display:flex}
  .nav-links{flex-direction:column;margin:0;position:static;transform:none}.nav-links a,.nav-dd-btn{padding:12px 14px;width:100%;text-align:left}
  .nav-right{flex-direction:column;align-items:stretch;margin:0;gap:10px}.nav-right .lang{align-self:flex-start}
  .burger{display:inline-flex;margin-inline-start:auto}.nav .bar{border-radius:22px}
  .dd-menu{position:static;transform:none;opacity:1;visibility:visible;pointer-events:auto;display:none;background:rgba(30,42,115,.03);border:none;box-shadow:none;padding:4px 0 4px 20px;min-width:0}
  .nav-dropdown.open .dd-menu{display:block;transform:none}
}

/* intro */
.intro{position:fixed;inset:0;z-index:120;display:grid;place-items:center;background:radial-gradient(120% 100% at 50% 40%,#F5F7FF,#E3E9FB);transition:opacity .8s ease,visibility .8s}
.intro.gone{opacity:0;visibility:hidden}
.intro-inner{text-align:center;display:grid;justify-items:center;gap:10px}
.intro-mark{width:132px;height:132px;color:var(--navy);opacity:0;transform:scale(.4) rotate(-12deg);animation:markin .9s cubic-bezier(.2,1.2,.3,1) forwards .1s}
@keyframes markin{to{opacity:1;transform:none}}
@keyframes pop{0%{opacity:0;transform:scale(.2)}100%{opacity:1;transform:scale(1)}}
.intro-word{height:52px;width:184px;color:var(--navy);opacity:0;transform:translateY(10px);animation:up .7s ease forwards .95s;margin-top:10px}
.intro-tag{color:var(--muted);font-weight:600;opacity:0;transform:translateY(10px);animation:up .7s ease forwards 1.15s}
@keyframes up{to{opacity:1;transform:none}}
.intro-bar{width:180px;height:3px;border-radius:99px;background:rgba(30,42,115,.14);margin-top:22px;overflow:hidden}
.intro-bar i{display:block;height:100%;width:0;background:var(--grad);border-radius:99px;animation:load 2.3s ease forwards .3s}
@keyframes load{to{width:100%}}
.intro-skip{position:absolute;inset-block-end:26px;inset-inline-end:26px;color:var(--muted);font-family:var(--fd);font-weight:700;font-size:.85rem;border:1.5px solid var(--line-2);border-radius:999px;padding:8px 18px;transition:.18s}
.intro-skip:hover{color:var(--navy);border-color:var(--azure)}

/* pages */
.page[hidden]{display:none}
.page-hero{position:relative;text-align:center}
.page-hero .wrap{padding-block:clamp(46px,6vw,78px)}
.page-hero .badge{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:7px 15px;font-size:.82rem;font-weight:700;margin-bottom:20px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(12px)}
.page-hero h1{font-size:clamp(2.1rem,4.8vw,3.5rem);font-weight:800;max-width:18ch;margin-inline:auto}
.page-hero>.wrap>p{color:var(--muted);font-size:1.12rem;margin-top:16px;max-width:52ch;margin-inline:auto}
.crumb{font-size:.86rem;color:var(--muted);font-weight:700}.crumb a:hover{color:#fff}.crumb span{opacity:.5;margin-inline:6px}

/* HOME hero */
.hero{position:relative;text-align:center}
.hero .wrap{padding-block:clamp(48px,7vw,96px)}
.hero .badge{display:inline-flex;align-items:center;gap:9px;border-radius:999px;padding:7px 9px 7px 15px;font-size:.84rem;font-weight:700;margin-bottom:26px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(12px)}
.hero .badge svg{width:24px;height:24px}
.hero h1{font-size:clamp(2.5rem,6vw,4.3rem);font-weight:800;max-width:15ch;margin-inline:auto;line-height:1.05}
.hero .sub{margin:22px auto 0;font-size:1.18rem;color:var(--muted);max-width:46ch}
.hero .cta{display:flex;gap:12px;justify-content:center;margin-top:34px;flex-wrap:wrap}
.hero .chips{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:36px}
.hero .chip{border-radius:999px;padding:9px 16px;font-size:.86rem;font-weight:700;color:var(--ink);background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(10px)}
.hero .chip.v{color:var(--violet)}.hero .chip.a{color:var(--azure)}

.rail-h{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:26px}
.rail-h h2{font-family:var(--fd);font-size:clamp(1.7rem,3.4vw,2.4rem)}
.rail-h p{color:var(--muted);margin-top:8px}
.rail{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding-block:8px 20px;margin-inline:-26px;padding-inline:26px;-webkit-overflow-scrolling:touch}
.rail::-webkit-scrollbar{height:8px}.rail::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:99px}
.ccard{scroll-snap-align:start;flex:0 0 320px;border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(14px);box-shadow:var(--sh),var(--sh-in);transition:transform .22s,box-shadow .28s,border-color .2s}
.ccard:hover{transform:translateY(-6px);border-color:var(--line-2);box-shadow:0 34px 60px -30px rgba(0,0,0,.85)}
.ccard .top{height:112px;position:relative;display:grid;place-items:center}
.ccard .top .tag{position:absolute;inset-block-start:12px;inset-inline-start:12px;background:rgba(6,10,30,.6);color:#fff;font-size:.72rem;font-weight:800;padding:5px 11px;border-radius:999px;backdrop-filter:blur(6px)}
.ccard .top svg{width:44px;height:44px;stroke:#fff}
.g-navy{background:#112e81}
.g-azure{background:#1c75bc}
.g-violet{background:#6c49ce}
.g-coral{background:#ee6a4d}
.g-green{background:#2c8f4e}
.g-gold{background:#b3852a}
.g-mix{background:#2E93D4}
.g-mix2{background:#1E2E86}
.ccard .body{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}
.ccard .rate{display:flex;align-items:center;gap:5px;font-size:.8rem;font-weight:700;color:var(--muted)}
.stars{color:#FFC24B;letter-spacing:1px}
.ccard h3{font-family:var(--fd);font-size:1.08rem;font-weight:700;line-height:1.3}
.ccard .body>p{font-size:.9rem;color:var(--muted);flex:1}
.ccard .foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:4px}
.price{font-family:var(--fd);font-weight:800;font-size:1.24rem;color:var(--navy)}
.price .c{font-size:.72rem;font-weight:700;color:var(--muted);margin-inline-start:3px}

.journey .grid{display:grid;grid-template-columns:1.05fr .95fr;gap:34px;align-items:center;margin-top:36px}
@media(max-width:860px){.journey .grid{grid-template-columns:1fr;gap:24px}}
.jpanel{background:#1E2E86;border:1px solid var(--line-2);border-radius:var(--r);padding:36px;color:#fff;position:relative;overflow:hidden;backdrop-filter:blur(10px);box-shadow:var(--sh)}
.jpanel::after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(55,166,230,.55),transparent 70%);inset-block-end:-100px;inset-inline-end:-60px}
.jpanel .jm{width:64px;height:64px;position:relative;z-index:1;background:rgba(255,255,255,.14);border-radius:20px;display:grid;place-items:center}
.jpanel .jm svg{width:40px;height:40px}
.jpanel h3{font-family:var(--fd);font-size:1.6rem;margin-top:22px;position:relative;z-index:1}
.jpanel p{color:#DDE3FB;margin-top:10px;position:relative;z-index:1}
.jpanel .btn{margin-top:22px;position:relative;z-index:1}
.jsteps{display:grid;gap:14px}
.jstep{display:flex;gap:16px;align-items:flex-start;border-radius:var(--r-sm);padding:20px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(12px)}
.jstep .ic{width:48px;height:48px;border-radius:16px;flex:none;display:grid;place-items:center;background:var(--grad)}
.jstep .ic svg{width:24px;height:24px;stroke:#fff}
.jstep h4{font-family:var(--fd);font-size:1.05rem}
.jstep p{color:var(--muted);font-size:.92rem;margin-top:3px}

.tgrid{display:grid;grid-template-columns:1.25fr .75fr;gap:20px;margin-top:38px}
@media(max-width:860px){.tgrid{grid-template-columns:1fr}}
.tbig{background:#1E2E86;border:1px solid var(--line-2);border-radius:var(--r);padding:36px;color:#fff;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;backdrop-filter:blur(10px);box-shadow:var(--sh)}
.tbig::after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(142,125,240,.5),transparent 70%);inset-block-start:-70px;inset-inline-end:-50px}
.tbig .stars{font-size:1.1rem}
.tbig p{font-family:var(--fd);font-size:1.35rem;line-height:1.55;margin-top:14px;position:relative;z-index:1}
.tbig .who{margin-top:20px;display:flex;align-items:center;gap:12px;position:relative;z-index:1}
.tbig .av{width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.16);display:grid;place-items:center;font-family:var(--fd);font-weight:800}
.tbig .who b{font-family:var(--fd);display:block}.tbig .who span{color:#DDE3FB;font-size:.85rem}
.tside{display:grid;gap:20px}
.tmini{border-radius:var(--r-sm);padding:22px;display:flex;flex-direction:column;gap:10px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(12px)}
.tmini .stars{font-size:.95rem}.tmini p{font-size:.96rem;color:var(--ink);line-height:1.6}
.tmini .who{display:flex;align-items:center;gap:10px}
.tmini .av{width:38px;height:38px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;font-family:var(--fd);font-weight:800;font-size:.85rem}
.tmini .who b{font-family:var(--fd);font-size:.92rem;display:block}.tmini .who span{color:var(--muted);font-size:.78rem}

.cta-band{padding-block:clamp(20px,4vw,40px) clamp(54px,7vw,96px)}
.cta-band .box{background:#2E93D4;border:1px solid var(--line-2);border-radius:32px;padding:clamp(40px,6vw,70px);text-align:center;position:relative;overflow:hidden;box-shadow:var(--sh)}
.cta-band .box::after{content:"";position:absolute;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.24),transparent 70%);inset-block-start:-120px;inset-inline-start:-70px}
.cta-band h2{font-family:var(--fd);color:#fff;font-size:clamp(1.9rem,3.8vw,2.8rem);max-width:18ch;margin-inline:auto;position:relative;z-index:1}
.cta-band p{color:rgba(255,255,255,.92);margin-top:14px;position:relative;z-index:1;font-size:1.08rem}
.cta-band .cta{display:flex;gap:12px;justify-content:center;margin-top:28px;position:relative;z-index:1;flex-wrap:wrap}

/* how */
.steps{display:grid;gap:16px;margin-top:40px}
.step{display:grid;grid-template-columns:auto 1fr;gap:22px;border-radius:var(--r);padding:26px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(14px);box-shadow:var(--sh)}
.step .n{width:56px;height:56px;border-radius:18px;background:var(--grad);color:#fff;font-family:var(--fd);font-weight:800;font-size:1.35rem;display:grid;place-items:center;flex:none}
.step:nth-child(2) .n{background:#2E93D4}.step:nth-child(3) .n{background:#5B4EC4}.step:nth-child(4) .n{background:#2E93D4}
.step h3{font-family:var(--fd);font-size:1.25rem;font-weight:700}.step p{color:var(--muted);margin-top:6px}
.step .tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.step .tags span{font-size:.76rem;font-weight:700;color:var(--azure);background:rgba(46,147,210,.10);padding:6px 12px;border-radius:999px}
.faq{display:grid;gap:12px;margin-top:32px;max-width:820px;margin-inline:auto}
.qa{border-radius:var(--r-sm);overflow:hidden;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(12px)}
.qa summary{list-style:none;cursor:pointer;padding:20px 22px;font-family:var(--fd);font-weight:600;font-size:1.05rem;display:flex;align-items:center;justify-content:space-between;gap:14px}
.qa summary::-webkit-details-marker{display:none}
.qa summary .pm{width:24px;height:24px;flex:none;position:relative}
.qa summary .pm::before,.qa summary .pm::after{content:"";position:absolute;background:var(--azure);inset-block-start:11px;inset-inline-start:4px;width:16px;height:2px;border-radius:2px;transition:.2s}
.qa summary .pm::after{transform:rotate(90deg)}.qa[open] summary .pm::after{transform:rotate(0)}
.qa .ans{padding:0 22px 20px;color:var(--muted)}

/* courses page */
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:32px;justify-content:center}
.chip-f{border:1.5px solid var(--line-2);background:var(--glass);border-radius:999px;padding:10px 18px;font-family:var(--fd);font-weight:700;font-size:.88rem;color:var(--muted);transition:.18s;backdrop-filter:blur(10px)}
.chip-f:hover{border-color:var(--azure);color:var(--navy)}
.chip-f.on{background:var(--grad);border-color:transparent;color:#fff}
.cgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:900px){.cgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.cgrid{grid-template-columns:1fr}}
.card{border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(14px);box-shadow:var(--sh),var(--sh-in);transition:transform .22s,box-shadow .28s,border-color .2s}
.card:hover{transform:translateY(-6px);border-color:var(--line-2);box-shadow:0 34px 60px -30px rgba(0,0,0,.85)}
.card .thumb{height:128px;position:relative;display:grid;place-items:center}
.card .thumb .t{position:absolute;inset-block-start:12px;inset-inline-start:12px;background:rgba(6,10,30,.6);color:#fff;font-size:.72rem;font-weight:800;padding:5px 11px;border-radius:999px;backdrop-filter:blur(6px)}
.card .thumb svg{width:46px;height:46px;stroke:#fff}
.card .body{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}
.card h3{font-family:var(--fd);font-size:1.08rem;font-weight:700;line-height:1.3}
.card .body>p{font-size:.9rem;color:var(--muted);flex:1}
.card .foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:4px}

/* course detail */
.cd .grid{display:grid;grid-template-columns:1fr 360px;gap:36px;align-items:start;margin-top:8px}
@media(max-width:900px){.cd .grid{grid-template-columns:1fr}}
.cd h2{font-family:var(--fd);font-size:1.5rem;margin:0 0 16px}
.block{border-radius:var(--r);padding:28px;margin-bottom:20px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(14px);box-shadow:var(--sh)}
.learn{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:600px){.learn{grid-template-columns:1fr}}
.learn li{display:flex;gap:11px;align-items:flex-start;font-size:.96rem}
.learn li svg{width:20px;height:20px;stroke:var(--azure);flex:none;margin-top:2px}
.mods{display:grid;gap:10px}
.mod{border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;background:rgba(30,42,115,.025)}
.mod summary{list-style:none;cursor:pointer;padding:16px 18px;font-family:var(--fd);font-weight:600;display:flex;align-items:center;justify-content:space-between;gap:12px}
.mod summary::-webkit-details-marker{display:none}
.mod summary .meta{font-size:.8rem;color:var(--muted);font-weight:700}
.mod .lessons{padding:0 18px 16px;display:grid;gap:9px}
.mod .lessons li{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:.92rem}
.mod .lessons li svg{width:16px;height:16px;stroke:var(--azure);flex:none}
.sidecard{position:sticky;top:96px;border-radius:var(--r);padding:26px;background:var(--glass-strong);border:1px solid var(--line-2);backdrop-filter:blur(18px);box-shadow:var(--sh),var(--sh-in)}
.sidecard .pr{font-family:var(--fd);font-weight:800;font-size:2.1rem;color:var(--navy)}
.sidecard .pr .c{font-size:.9rem;color:var(--muted);font-weight:700;margin-inline-start:4px}
.sidecard .incl{display:grid;gap:11px;margin:20px 0}
.sidecard .incl li{display:flex;align-items:center;gap:11px;font-size:.92rem}
.sidecard .incl li svg{width:19px;height:19px;stroke:var(--azure);flex:none}
.inst{display:flex;gap:14px;align-items:center}
.inst .av{width:56px;height:56px;border-radius:18px;background:var(--grad);color:#fff;display:grid;place-items:center;font-family:var(--fd);font-weight:800;font-size:1.2rem;flex:none}
.inst b{font-family:var(--fd);font-size:1.05rem}.inst span{color:var(--muted);font-size:.88rem}

/* about */
.about-story{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:center}
@media(max-width:820px){.about-story{grid-template-columns:1fr;gap:30px}}
.about-panel{background:#1E2E86;border:1px solid var(--line-2);border-radius:var(--r);aspect-ratio:4/3;position:relative;overflow:hidden;backdrop-filter:blur(10px);box-shadow:var(--sh)}
.about-panel .m{position:absolute;inset:0;display:grid;place-items:center}.about-panel .m svg{width:44%;height:44%}
.about-panel .nm{position:absolute;inset-block-end:22px;inset-inline-start:22px;color:#fff;font-family:var(--fd)}
.about-panel .nm b{font-size:1.4rem;display:block}.about-panel .nm span{color:#DDE3FB;font-size:.9rem}
.vals{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
@media(max-width:760px){.vals{grid-template-columns:1fr}}
.val{border-radius:var(--r);padding:26px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(14px);box-shadow:var(--sh)}
.val .ic{width:52px;height:52px;border-radius:18px;background:var(--grad);display:grid;place-items:center;margin-bottom:16px}
.val .ic svg{width:24px;height:24px;stroke:#fff}
.val h3{font-family:var(--fd);font-size:1.1rem;font-weight:700}.val p{color:var(--muted);font-size:.92rem;margin-top:8px}

/* ai */
.ai-feat{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
@media(max-width:820px){.ai-feat{grid-template-columns:1fr}}
.aif{border-radius:var(--r);padding:26px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(14px);box-shadow:var(--sh)}
.aif .ic{width:54px;height:54px;border-radius:18px;background:var(--grad);display:grid;place-items:center;margin-bottom:16px}
.aif .ic svg{width:24px;height:24px;stroke:#fff}
.aif h3{font-family:var(--fd);font-size:1.1rem;font-weight:700}.aif p{color:var(--muted);font-size:.92rem;margin-top:8px}

/* pricing / bundles */
.trial{position:relative;overflow:hidden;border-radius:22px;padding:22px 28px;margin-top:28px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:center;text-align:center;
  background:var(--azure);color:#fff;box-shadow:0 20px 44px -22px rgba(78,110,230,.6)}
.trial::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 160% at 0% 0%,rgba(255,255,255,.28),transparent 45%);pointer-events:none}
.trial .pulse{display:inline-flex;align-items:center;gap:9px;font-family:var(--fd);font-weight:800;font-size:1.05rem;position:relative;z-index:1}
.trial .pulse b{background:#fff;color:var(--navy);border-radius:999px;padding:5px 13px;font-size:.85rem;letter-spacing:.02em;animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,255,255,.6)}50%{box-shadow:0 0 0 10px rgba(255,255,255,0)}}
.trial p{position:relative;z-index:1;font-weight:600;opacity:.95}
.trial .btn{position:relative;z-index:1}

.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px;perspective:1400px}
@media(max-width:900px){.plans{grid-template-columns:1fr;max-width:440px;margin-inline:auto}}
.plan{position:relative;border-radius:24px;padding:32px 28px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(16px);box-shadow:var(--sh),var(--sh-in);display:flex;flex-direction:column;gap:6px;transform-style:preserve-3d;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .3s,border-color .3s;will-change:transform}
.plan:hover{border-color:var(--line-2);box-shadow:0 40px 70px -34px rgba(26,42,115,.5)}
.plan .glow{position:absolute;inset:0;border-radius:24px;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(200px 200px at var(--mx,50%) var(--my,50%),rgba(55,166,230,.18),transparent 60%)}
.plan:hover .glow{opacity:1}
.plan .tier{font-family:'Poppins',var(--fd);font-weight:800;font-size:1.05rem;letter-spacing:.14em;color:var(--azure)}
.plan.max .tier{color:var(--violet)}
.plan .ptag{position:absolute;inset-block-start:-13px;inset-inline-end:22px;background:var(--grad);color:#fff;font-family:var(--fd);font-weight:800;font-size:.74rem;letter-spacing:.04em;padding:6px 14px;border-radius:999px;box-shadow:0 10px 22px -10px rgba(78,110,230,.7)}
.plan .price-row{display:flex;align-items:flex-end;gap:6px;margin-top:12px}
.plan .amt{font-family:'Poppins',var(--fd);font-weight:800;font-size:2.5rem;color:var(--navy);line-height:1}
.plan .per{color:var(--muted);font-weight:600;font-size:.9rem;margin-bottom:6px}
.plan .desc{color:var(--muted);font-size:.94rem;margin-top:8px;min-height:42px}
.plan .feats{display:grid;gap:11px;margin:20px 0 24px}
.plan .feats li{display:flex;align-items:flex-start;gap:10px;font-size:.94rem}
.plan .feats li svg{width:19px;height:19px;stroke:var(--azure);flex:none;margin-top:2px}
.plan.max{border-color:transparent;background:#1E2E86;color:#fff;box-shadow:0 40px 80px -30px rgba(46,63,160,.7)}
.plan.max .amt,.plan.max .tier{color:#fff}
.plan.max .desc,.plan.max .per{color:#DDE3FB}
.plan.max .feats li svg{stroke:#9CC6EA}
.plan.max .btn-ghost{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.4)}
.plan .btn{margin-top:auto}

/* reviews */
.rrate{display:inline-flex;align-items:center;gap:10px;margin-top:18px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(12px);border-radius:999px;padding:9px 18px;font-family:var(--fd);font-weight:700}
.rrate .stars{color:#FFC24B;font-size:1.05rem;letter-spacing:1px}
.rgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}
@media(max-width:900px){.rgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.rgrid{grid-template-columns:1fr}}
.rcard{border-radius:var(--r);padding:26px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(14px);box-shadow:var(--sh),var(--sh-in);display:flex;flex-direction:column;gap:13px;transition:transform .2s,box-shadow .26s,border-color .2s}
.rcard:hover{transform:translateY(-5px);border-color:var(--line-2);box-shadow:0 34px 60px -30px rgba(26,42,115,.4)}
.rcard .stars{color:#FFC24B;letter-spacing:1px;font-size:1rem}
.rcard p{font-size:1rem;line-height:1.7;flex:1}
.rcard .who{display:flex;align-items:center;gap:12px}
.rcard .av{width:44px;height:44px;border-radius:50%;flex:none;display:grid;place-items:center;font-family:var(--fd);font-weight:800;color:#fff;background:var(--grad)}
.rcard .who b{font-family:var(--fd);display:block}.rcard .who span{color:var(--muted);font-size:.82rem}
/* carousels */
.crl-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.crl-head h2{font-family:var(--fd);font-size:clamp(1.5rem,3vw,2.1rem)}
.crl-head p{color:var(--muted);margin-top:6px}
.crl-arrows{display:flex;gap:8px}
.crl-arrows button{width:46px;height:46px;border-radius:999px;border:1.5px solid var(--line-2);background:var(--glass);backdrop-filter:blur(10px);display:grid;place-items:center;color:var(--navy);transition:.18s;cursor:pointer}
.crl-arrows button:hover{border-color:var(--azure);color:var(--azure)}
.crl-arrows button svg{width:20px;height:20px;stroke:currentColor}
.rrail,.srail{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-block:6px 18px;margin-inline:-26px;padding-inline:26px;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}
.rrail{gap:20px}.srail{gap:18px}
.rrail::-webkit-scrollbar,.srail::-webkit-scrollbar{height:8px}
.rrail::-webkit-scrollbar-thumb,.srail::-webkit-scrollbar-thumb{background:rgba(30,42,115,.16);border-radius:99px}
.rrail .rcard{scroll-snap-align:start;flex:0 0 clamp(280px,82vw,360px)}
.shot{scroll-snap-align:start;flex:0 0 clamp(224px,68vw,262px);border-radius:24px;overflow:hidden;background:var(--glass);border:1px solid var(--line);box-shadow:var(--sh),var(--sh-in);aspect-ratio:9/16;display:flex;flex-direction:column}
.shot img{width:100%;height:100%;object-fit:cover;display:block}
.shot .ph{flex:1;display:flex;flex-direction:column;gap:11px;padding:16px;background:rgba(46,147,210,.09)}
.shot .ph .top{display:flex;align-items:center;gap:9px;margin-bottom:4px}
.shot .ph .top .d{width:34px;height:34px;border-radius:50%;background:var(--grad);flex:none}
.shot .ph .top b{font-family:var(--fd);font-size:.85rem;display:block}
.shot .ph .top span{font-size:.7rem;color:var(--muted)}
.shot .ph .bub{background:#fff;border:1px solid var(--line);border-radius:14px;border-start-start-radius:4px;height:15px;width:82%}
.shot .ph .bub.w2{width:64%}.shot .ph .bub.w3{width:73%}
.shot .ph .bub.me{align-self:flex-end;background:var(--grad);border:none;border-start-start-radius:14px;border-start-end-radius:4px;width:58%}
.shot .cap{padding:11px 14px;font-size:.76rem;color:var(--muted);font-weight:700;text-align:center;border-block-start:1px solid var(--line)}
.shot-note{text-align:center;color:var(--muted);font-size:.86rem;margin-top:16px}

/* contact */
.contact-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:32px;align-items:start}
@media(max-width:820px){.contact-grid{grid-template-columns:1fr}}
.form{border-radius:var(--r);padding:30px;display:grid;gap:16px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(16px);box-shadow:var(--sh)}
.field{display:grid;gap:7px}
.field label{font-family:var(--fd);font-weight:700;font-size:.88rem}
.field input,.field textarea{padding:13px 16px;border:1.5px solid var(--line-2);border-radius:14px;background:rgba(255,255,255,.72);color:var(--ink);font:inherit;font-size:.95rem;width:100%}
.field input::placeholder,.field textarea::placeholder{color:#9aa2c2}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field textarea:focus{outline:2px solid var(--azure);outline-offset:1px;border-color:transparent}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:520px){.row2{grid-template-columns:1fr}}
.cinfo{display:grid;gap:14px}
.cinfo .item{border-radius:var(--r-sm);padding:20px;display:flex;gap:14px;align-items:center;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(12px)}
.cinfo .item .ic{width:46px;height:46px;border-radius:15px;background:var(--grad);display:grid;place-items:center;flex:none}
.cinfo .item .ic svg{width:22px;height:22px;stroke:#fff}
.cinfo .item b{font-family:var(--fd);display:block;font-size:.95rem}.cinfo .item span{color:var(--muted);font-size:.9rem}

/* dashboard */
.dash-top{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.dash-top .hi{font-family:var(--fd);font-size:clamp(1.5rem,3vw,2.1rem);font-weight:800}
.dash-top p{color:var(--muted);margin-top:4px}
.dstats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:32px 0}
@media(max-width:720px){.dstats{grid-template-columns:1fr 1fr}}
.dstat{border-radius:var(--r-sm);padding:22px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(12px);box-shadow:var(--sh)}
.dstat .ic{width:44px;height:44px;border-radius:14px;background:var(--grad);display:grid;place-items:center;margin-bottom:12px}
.dstat .ic svg{width:22px;height:22px;stroke:#fff}
.dstat b{font-family:var(--fd);font-size:1.7rem;font-weight:800;color:var(--navy);display:block;line-height:1;font-variant-numeric:tabular-nums}
.dstat span{color:var(--muted);font-size:.86rem;font-weight:600}
.dash-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:22px}
@media(max-width:860px){.dash-grid{grid-template-columns:1fr}}
.panel-c{border-radius:var(--r);padding:26px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(14px);box-shadow:var(--sh)}
.panel-c h3{font-family:var(--fd);font-size:1.15rem;margin-bottom:16px}
.enr{display:flex;gap:14px;align-items:center;padding:14px 0;border-block-end:1px solid var(--line)}
.enr:last-child{border-block-end:0}
.enr .th{width:52px;height:52px;border-radius:16px;flex:none;display:grid;place-items:center}
.enr .th svg{width:24px;height:24px;stroke:#fff}
.enr .info{flex:1;min-width:0}.enr .info b{font-family:var(--fd);font-size:.98rem;display:block}
.enr .bar{height:8px;border-radius:99px;background:rgba(30,42,115,.09);margin-top:8px;overflow:hidden}
.enr .bar i{display:block;height:100%;background:var(--grad);border-radius:99px}
.enr .pct{font-family:var(--fd);font-weight:700;color:var(--navy);font-size:.9rem;flex:none}
.up{display:grid;gap:14px}.up .u{display:flex;gap:12px;align-items:center}
.up .u .dot{width:9px;height:9px;border-radius:50%;background:var(--azure);flex:none}
.up .u b{font-size:.92rem;font-family:var(--fd)}.up .u span{color:var(--muted);font-size:.82rem;display:block}

/* login */
.auth{display:grid;grid-template-columns:1fr 1fr;max-width:940px;margin-inline:auto;border-radius:var(--r);overflow:hidden;background:var(--glass-strong);border:1px solid var(--line-2);backdrop-filter:blur(18px);box-shadow:var(--sh),var(--sh-in)}
@media(max-width:760px){.auth{grid-template-columns:1fr}.auth .aside{display:none}}
.auth .aside{background:#1E2E86;color:#fff;padding:40px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
.auth .aside::after{content:"";position:absolute;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(55,166,230,.5),transparent 70%);inset-block-end:-120px;inset-inline-end:-70px}
.auth .aside .m{width:60px;height:60px;position:relative;z-index:1}
.auth .aside h3{font-family:var(--fd);font-size:1.6rem;margin-top:20px;position:relative;z-index:1}
.auth .aside p{color:#DDE3FB;margin-top:10px;position:relative;z-index:1}
.auth .aside ul{margin-top:20px;display:grid;gap:12px;position:relative;z-index:1}
.auth .aside li{display:flex;gap:11px;align-items:center;font-size:.95rem}
.auth .aside li svg{width:20px;height:20px;stroke:#a9dbff;flex:none}
.auth .formside{padding:38px}
.tabs{display:flex;background:rgba(30,42,115,.05);border:1px solid var(--line);border-radius:999px;padding:5px;margin-bottom:24px}
.tabs button{flex:1;padding:11px;border-radius:999px;font-family:var(--fd);font-weight:700;color:var(--muted);font-size:.92rem;transition:.18s}
.tabs button.on{background:var(--grad);color:#fff}
.formside form{display:grid;gap:16px}
.namerow{display:none}.auth[data-mode="signup"] .namerow{display:grid}

/* footer */
.foot{border-block-start:0px solid var(--line);padding-block:60px 30px;margin-top:20px;background:linear-gradient(180deg,transparent,rgba(255,255,255,.55))}
.foot .grid{display:grid;grid-template-columns:1.8fr repeat(5,1fr);gap:32px}
@media(max-width:1100px){.foot .grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:800px){.foot .grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.foot .grid{grid-template-columns:1fr}}
.foot .about{color:var(--muted);font-size:.98rem;max-width:34ch;margin-top:14px}
.foot h4{font-family:var(--fd);font-size:1.02rem;font-weight:700;margin-bottom:14px}
.foot .lk{display:grid;gap:11px}.foot .lk a{color:var(--ink);font-weight:600;font-size:1rem;opacity:.82}.foot .lk a:hover{color:var(--navy);opacity:1}
.news{display:flex;gap:8px;margin-top:12px}
.news input{flex:1;min-width:0;padding:12px 15px;border:1.5px solid var(--line-2);border-radius:999px;background:rgba(255,255,255,.72);color:var(--ink);font:inherit;font-size:.9rem}
.news input::placeholder{color:#9aa2c2}
.news input:focus{outline:2px solid var(--azure);outline-offset:1px;border-color:transparent}
.socials{display:flex;gap:9px;margin-top:16px}
.socials a{width:40px;height:40px;border:1px solid var(--line-2);border-radius:999px;display:grid;place-items:center;transition:.18s}
.socials a:hover{background:var(--grad);border-color:transparent}.socials a:hover svg{stroke:#fff}
.socials svg{width:19px;height:19px;stroke:var(--ink)}
.foot-b{margin-top:40px;padding-top:20px;border-block-start:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:.95rem}
.foot-legal{display:flex;gap:18px}
.foot-legal a{color:var(--muted);text-decoration:none;font-weight:600;transition:.15s}
.foot-legal a:hover{color:var(--navy)}

.rv{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .7s cubic-bezier(.16,1,.3,1)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}.intro-mark,.intro-word,.intro-tag,.intro-bar i{animation:none;opacity:1;transform:none}}
/* section-by-section snap on Home (desktop + mobile) */
html[data-snap]{scroll-snap-type:y mandatory}
html[data-snap] #page-home>section{scroll-snap-align:start;scroll-snap-stop:always;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding-block:96px}
html[data-snap] footer.foot{scroll-snap-align:start}
@media(max-width:600px){
  html[data-snap] #page-home>section{padding-top:74px;padding-bottom:22px}
  /* compact the tall sections so each fits one phone screen */
  #page-home .journey .grid{gap:14px}
  #page-home .jpanel{padding:22px}
  #page-home .jpanel .jm{width:52px;height:52px;border-radius:16px}
  #page-home .jpanel h3{font-size:1.3rem;margin-top:14px}
  #page-home .jpanel p{margin-top:8px;font-size:.92rem}
  #page-home .jpanel .btn{margin-top:16px}
  #page-home .jsteps{gap:9px}
  #page-home .jstep{padding:12px;gap:12px;align-items:center}
  #page-home .jstep .ic{width:38px;height:38px}
  #page-home .jstep p{display:none}
  #page-home .jstep h4{font-size:1rem}
  #page-home .journey .sec-h{margin-bottom:0}
  #page-home .journey .sec-h p{display:none}
  #page-home .journey .sec-h h2{font-size:1.6rem}
  #page-home .tgrid{gap:14px;margin-top:24px}
  #page-home .tbig{padding:24px}
  #page-home .tbig p{font-size:1.12rem;line-height:1.5}
  #page-home .tside .tmini:last-child{display:none}
}
:focus-visible{outline:2px solid var(--azure);outline-offset:2px;border-radius:8px}

/* ============================================
   SAIS HOMEPAGE SECTIONS — Brand Palette
   ============================================ */

/* Brand palette reference:
   #6c49ce purple | #112e81 navy | #1c75bc blue | #4647ae indigo
   #4382df bright-blue | #f1f2f2 light | #071827 dark-navy
   #f2802e orange | #414042 dark-gray */

/* --- Hero (dark navy, constellation hidden behind) --- */
.sais-hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(ellipse 80% 60% at 50% 40%, #0A2540 0%, #071827 100%);
  overflow: hidden;
}
.sais-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: transparent;
  z-index: 0;
}
.sais-hero .wrap {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 60px;
  align-items: center;
  padding-block: clamp(80px, 12vh, 140px);
  max-width: none;
  padding-inline: clamp(20px, 3vw, 56px);
}
@media(max-width:900px){
  .sais-hero .wrap{grid-template-columns:1fr;gap:40px;text-align:center}
}
.sais-hero h1 {
  font-size: clamp(2.5rem, 5.5vw, 4.5rem);
  font-weight: 800;
  color: #fff;
  line-height: 1.05;
  max-width: 24ch;
}
.sais-hero .sub {
  font-size: clamp(1.06rem, 1.35vw, 1.3rem);
  color: rgba(255,255,255,0.82);
  margin-top: 22px;
  max-width: 52ch;
  line-height: 1.6;
}
.sais-hero .cta {
  display: flex;
  gap: 14px;
  margin-top: 38px;
  flex-wrap: wrap;
}
@media(max-width:900px){.sais-hero .cta{justify-content:center}}
.sais-hero .btn-primary {
  background: linear-gradient(135deg, #ee7a20 0%, #f47a24 55%, #fb9c3c 100%);
  box-shadow: 0 14px 34px -10px rgba(244,122,36,.5), var(--sh-in);
}
.sais-hero .btn-ghost {
  background: rgba(255,255,255,.10);
  color: #fff;
  border-color: rgba(255,255,255,.35);
}
.sais-hero .btn-ghost:hover {
  background: rgba(255,255,255,.18);
  border-color: rgba(255,255,255,.6);
}

/* Sand particle cloud (AIS app port) */
.hero__particle-container{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero__particle-container canvas{width:100% !important;height:100% !important;display:block}
.hero__reveal{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;opacity:0;transition:opacity .45s ease;pointer-events:none;text-align:center;will-change:opacity}
.hero__reveal-text{font-size:.95rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#f1f2f2;margin-bottom:20px}
.hero__reveal-btn{padding:16px 44px;font-size:1.06rem}
@media(max-width:900px){
  .sais-hero{flex-direction:column}
  .hero__reveal{position:static;transform:none;opacity:1;pointer-events:auto;margin-top:40px}
}

/* Hero visual — conversation demo */
.hero-visual {
  display: grid;
  gap: 18px;
  width: 100%;
  max-width: 640px;
}
.conv-demo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 20px;
  padding: 18px 22px;
  backdrop-filter: blur(10px);
}
.conv-msg {
  display: flex;
  align-items: center;
  gap: 6px;
  background: rgba(255,255,255,.12);
  border-radius: 12px;
  padding: 10px 14px;
}
.conv-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255,255,255,.5);
  animation: convPulse 1.4s ease-in-out infinite;
}
.conv-dot:nth-child(2){animation-delay:.2s}
.conv-dot:nth-child(3){animation-delay:.4s}
@keyframes convPulse {
  0%,100%{opacity:.3;transform:scale(.8)}
  50%{opacity:1;transform:scale(1)}
}
.conv-label {
  font-size: .7rem;
  font-weight: 700;
  color: rgba(255,255,255,.7);
  white-space: nowrap;
}
.conv-arrow {
  color: rgba(255,255,255,.5);
  font-weight: 700;
  font-size: 1.1rem;
}
.conv-proc {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.conv-wave {
  width: 60px;
  height: 20px;
  color: rgba(255,255,255,.7);
}
.conv-out {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  background: rgba(255,255,255,.12);
  border-radius: 12px;
  padding: 10px 14px;
}
.conv-check {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(255,255,255,.5);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: .8rem;
  font-weight: 800;
}
.chat-bubble {
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 16px;
  border-end-start-radius: 4px;
  padding: 12px 16px;
  color: rgba(255,255,255,.9);
  font-size: .9rem;
  max-width: 260px;
  justify-self: start;
  animation: chatIn .6s ease backwards;
}
.chat-bubble.reply {
  background: rgba(109,95,214,.25);
  border-color: rgba(109,95,214,.4);
  border-end-start-radius: 16px;
  border-end-end-radius: 4px;
  justify-self: end;
  animation-delay: .3s;
}
@keyframes chatIn {
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:none}
}

/* --- Social Proof (light, constellation visible) --- */
.social-proof {
  position: relative;
  background: transparent;
  padding-block: clamp(40px, 5vw, 64px);
}
.social-proof::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(241, 242, 242, 0.82);
  backdrop-filter: blur(10px) saturate(110%);
  -webkit-backdrop-filter: blur(10px) saturate(110%);
  z-index: 0;
}
.social-proof .wrap {
  position: relative;
  z-index: 1;
  text-align: center;
}
.sp-head {
  font-family: var(--fd);
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--muted);
  margin-bottom: 28px;
}
.logo-bar {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: clamp(24px, 4vw, 56px);
  flex-wrap: wrap;
}
.logo-item {
  opacity: .55;
  filter: grayscale(100%);
  transition: opacity .3s, filter .3s;
}
.logo-item:hover {
  opacity: 1;
  filter: grayscale(0%);
}
.lp {
  font-family: 'Poppins', var(--fd);
  font-weight: 800;
  font-size: 1.3rem;
  letter-spacing: .08em;
  color: var(--navy);
}

/* --- Dark sections shared --- */
.dark-section {
  background: #071827;
  color: #fff;
  position: relative;
  z-index: 2;
}
.dark-section .sec-h.light h2,
.dark-section .sec-h.light h1 {
  color: #fff;
}
.dark-section .sec-h.light p {
  color: rgba(255,255,255,0.75);
}
.dark-section .btn-ghost {
  background: rgba(255,255,255,.10);
  color: #fff;
  border-color: rgba(255,255,255,.3);
}
.dark-section .btn-ghost:hover {
  background: rgba(255,255,255,.18);
  border-color: rgba(255,255,255,.55);
}
.dark-section .btn-primary {
  background: linear-gradient(135deg, #ee7a20 0%, #f47a24 55%, #fb9c3c 100%);
}

/* --- Problem section --- */
.problem { background: rgba(17, 46, 129, 0.88); }
.problem-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 48px;
}
@media(max-width:900px){.problem-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.problem-grid{grid-template-columns:1fr}}
.problem-card {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--r);
  padding: 28px;
  transition: transform .2s, background .2s;
}
.problem-card:hover {
  transform: translateY(-4px);
  background: rgba(255,255,255,.08);
}
.pc-icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.18);
  display: grid;
  place-items: center;
  margin-bottom: 18px;
}
.pc-icon svg {
  width: 24px;
  height: 24px;
  stroke: #fff;
}
.problem-card h3 {
  font-family: var(--fd);
  font-size: 1.1rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px;
}
.problem-card p {
  color: rgba(255,255,255,.65);
  font-size: .92rem;
  line-height: 1.6;
}
.problem-transition {
  text-align: center;
  margin-top: 48px;
  font-family: var(--fd);
  font-size: 1.15rem;
  font-weight: 600;
  color: rgba(255,255,255,.8);
}

/* --- SAIS Model --- */
.sais-model { background: #f1f2f2; }
.model-flow {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
  gap: 16px;
  align-items: stretch;
  margin-top: 48px;
}
@media(max-width:1000px){
  .model-flow{grid-template-columns:1fr;gap:20px}
  .model-arrow{display:none}
}
.model-step {
  background: var(--glass-strong);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 28px;
  backdrop-filter: blur(14px);
  display: flex;
  flex-direction: column;
}
.ms-num {
  font-family: 'Poppins', var(--fd);
  font-weight: 800;
  font-size: 1.1rem;
  letter-spacing: .1em;
  color: var(--azure);
  margin-bottom: 0px;
}
.model-step h3 {
  font-family: var(--fd);
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
  text-transform: uppercase;
}
.model-step p {
  color: var(--muted);
  font-size: .94rem;
  line-height: 1.6;
  flex: 1;
}
.model-arrow {
  display: grid;
  place-items: center;
  color: var(--azure);
  font-size: 1.6rem;
  font-weight: 700;
  align-self: center;
}
.act-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}
.act-tag {
  font-size: .7rem;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, #1c75bc, #6c49ce);
  padding: 6px 11px;
  border-radius: 999px;
}
.model-link {
  text-align: center;
  margin-top: 36px;
}
.model-link a {
  font-family: var(--fd);
  font-weight: 700;
  color: var(--azure);
  font-size: 1rem;
}
.model-link a:hover { color: var(--navy); }

/* Homepage model process — same-size cards that breathe */
.sais-model .wrap {
  max-width: min(2000px, 92vw);
  padding-inline: clamp(28px, 3vw, 48px);
  margin-inline: auto;
}
#page-home .model-flow {
  grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
  gap: 12px;
  margin-top: 48px;
}
#page-home .model-step {
  padding: 24px;
  min-height: 100%;
}
#page-home .model-arrow {
  font-size: 1.35rem;
}
@media(max-width:1150px){
  #page-home .model-flow{grid-template-columns:1fr;gap:20px}
  #page-home .model-arrow{display:none}
}

/* Down arrow into ACT banner */
.flow-down {
  text-align: center;
  color: var(--azure);
  font-size: 1.4rem;
  font-weight: 700;
  margin: 20px 0 0;
}

/* ACT — highlighted result banner */
.model-act {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 28px;
  align-items: center;
  margin-top: 16px;
  padding: 28px 32px;
  border-radius: var(--r);
  border: 2px solid var(--orange);
  background:
    radial-gradient(120% 60% at 50% 0%, rgba(244,122,36,.14), transparent 60%),
    var(--glass-strong);
  box-shadow: 0 18px 44px -18px rgba(244,122,36,.42), var(--sh-in);
  backdrop-filter: blur(14px);
}
.model-act .ms-num { color: var(--orange); }
.model-act h3 {
  font-family: var(--fd);
  font-size: 1.25rem;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.model-act p {
  color: var(--muted);
  font-size: .94rem;
  line-height: 1.6;
}
.model-act .act-tags {
  flex-wrap: wrap;
  justify-content: flex-end;
}
.model-act .act-tag {
  background: linear-gradient(135deg, #f47a24, #f2802e);
}
@media(max-width:860px){
  .model-act{grid-template-columns:1fr;gap:16px}
  .model-act .act-tags{justify-content:flex-start}
}

/* --- Core Solutions --- */
.core-solutions { background: #fff; }
.sol-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 48px;
}
@media(max-width:760px){.sol-grid{grid-template-columns:1fr}}
.sol-card {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 32px;
  backdrop-filter: blur(14px);
  box-shadow: var(--sh), var(--sh-in);
  transition: transform .22s, box-shadow .28s, border-color .2s;
}
.sol-card:hover {
  transform: translateY(-5px);
  border-color: var(--line-2);
  box-shadow: 0 34px 60px -30px rgba(26,42,115,.35);
}
.sol-icon {
  width: 56px;
  height: 56px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  margin-bottom: 20px;
}
.sol-icon svg { width: 26px; height: 26px; stroke: #fff; }
.sol-card h3 {
  font-family: var(--fd);
  font-size: 1.25rem;
  font-weight: 700;
  margin-bottom: 10px;
}
.sol-card p {
  color: var(--muted);
  font-size: .95rem;
  line-height: 1.65;
  margin-bottom: 16px;
}
.sol-link {
  font-family: var(--fd);
  font-weight: 700;
  font-size: .92rem;
  color: var(--azure);
}
.sol-link:hover { color: var(--navy); }

/* --- Industries --- */
.industries { background: #f1f2f2; }
.ind-tabs {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-bottom: 32px;
  flex-wrap: wrap;
}
.ind-tab {
  --ac: var(--azure);
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 11px 26px;
  border-radius: 999px;
  font-family: var(--fd);
  font-weight: 700;
  font-size: .92rem;
  color: var(--muted);
  background: var(--glass);
  border: 1.5px solid var(--line-2);
  backdrop-filter: blur(10px);
  transition: .18s;
  cursor: pointer;
}
.ind-tab::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ac);
  flex: none;
}
.ind-tab.c-healthcare{--ac:#112e81}
.ind-tab.c-education{--ac:#1c75bc}
.ind-tab.c-travel{--ac:#ee6a4d}
.ind-tab.c-fnb{--ac:#2c8f4e}
.ind-tab.c-realestate{--ac:#6c49ce}
.ind-tab.c-banking{--ac:#b3852a}
.ind-tab:hover {
  border-color: var(--ac);
  color: var(--ac);
}
.ind-tab.on {
  background: var(--ac);
  color: #fff;
  border-color: transparent;
}
.ind-tab.on::before {
  background: #fff;
}
.ind-panel {
  background: var(--glass-strong);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 40px;
  backdrop-filter: blur(16px);
  box-shadow: var(--sh), var(--sh-in);
}
.ind-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 40px;
  align-items: center;
}
@media(max-width:820px){.ind-grid{grid-template-columns:1fr}}
.ind-text h3 {
  font-family: var(--fd);
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: 14px;
}
.ind-text p {
  color: var(--muted);
  font-size: 1rem;
  line-height: 1.7;
  margin-bottom: 20px;
}
.ind-list {
  display: grid;
  gap: 10px;
  margin-bottom: 24px;
}
.ind-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: .95rem;
  color: var(--ink);
}
.ind-list li::before {
  content: '✓';
  color: var(--azure);
  font-weight: 800;
  flex: none;
}
.ind-visual {
  aspect-ratio: 4/3;
  border-radius: var(--r);
  display: grid;
  place-items: center;
}
.ind-visual svg {
  width: 64px;
  height: 64px;
  stroke: #fff;
  opacity: .9;
}

/* --- How It Works --- */
.how-it-works { background: #fff; }
.how-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 48px;
}
@media(max-width:800px){.how-grid{grid-template-columns:1fr}}
#page-home .how-grid,
#page-how-it-works .how-grid {
  grid-template-columns: repeat(3, minmax(270px, 390px));
  justify-content: center;
}
@media(max-width:800px){#page-home .how-grid,#page-how-it-works .how-grid{grid-template-columns:1fr}}
.how-step {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 32px;
  backdrop-filter: blur(14px);
  box-shadow: var(--sh), var(--sh-in);
  text-align: center;
  display: flex;
  flex-direction: column;
}
.how-num {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--grad);
  color: #fff;
  font-family: 'Poppins', var(--fd);
  font-weight: 800;
  font-size: 1.3rem;
  display: grid;
  place-items: center;
  margin: 0 auto 20px;
}
.how-step h3 {
  font-family: var(--fd);
  font-size: 1.2rem;
  font-weight: 700;
  margin-bottom: 10px;
}
.how-step p {
  color: var(--muted);
  font-size: .95rem;
  line-height: 1.65;
}
.how-cta {
  text-align: center;
  margin-top: 44px;
}

/* --- How It Works page --- */
#page-how-it-works .c-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:32px}
#page-how-it-works .c-actions .btn-ghost{background:rgba(30,42,115,.05)}
#page-how-it-works .final-cta .c-actions{justify-content:flex-start}
#page-how-it-works .micro{text-align:center;color:var(--muted);font-size:.84rem;font-weight:600;margin-top:24px}
#page-how-it-works .dark-section .micro{color:rgba(255,255,255,.55)}
#page-how-it-works .eyebrow{display:block;text-align:center;font-family:var(--fd);font-size:.76rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--azure);margin-bottom:14px}
#page-how-it-works .dark-section .eyebrow{color:#7fd6ea}
#page-how-it-works .lead-body{color:var(--muted);font-size:clamp(1.05rem,1.4vw,1.3rem);line-height:1.75;max-width:78ch;margin:22px auto 0;text-align:center}
#page-how-it-works .dark-section .lead-body{color:rgba(255,255,255,.68)}
#page-how-it-works .sec-link-row{text-align:center;margin-top:36px}
#page-how-it-works .sec-link{font-family:var(--fd);font-weight:700;color:var(--navy);text-decoration:none;font-size:1rem;transition:.18s}
#page-how-it-works .sec-link:hover{color:var(--azure)}
#page-how-it-works .dark-section .sec-link{color:#fff}
#page-how-it-works .dark-section .sec-link:hover{color:#8ed9ef}
#page-how-it-works .how-step{text-align:left}
#page-how-it-works .how-step p b{color:var(--navy)}
#page-how-it-works .ms-means{margin-top:auto;color:var(--navy);background:rgba(28,117,188,.08);border-inline-start:3px solid var(--azure);border-radius:8px;padding:10px 13px;font-size:.9rem;line-height:1.6;font-weight:600}

/* Two journeys */
.two-journeys{display:grid;gap:20px;margin-top:44px;max-width:1040px;margin-inline:auto}
.jr-track{display:grid;gap:16px;justify-items:center;text-align:center}
.jr-tag{font-family:var(--fd);font-size:.74rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.jr-tag.once{color:var(--azure)}
.jr-tag.every{color:#0fa889}
.jr-nodes{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.jr-node{padding:12px 22px;border-radius:999px;border:2px solid var(--azure);color:var(--azure);background:transparent;font-family:'Poppins',var(--fd);font-weight:700;font-size:.92rem}
.jr-node.on{border-color:transparent;color:#fff;background:linear-gradient(135deg,#10b8a0,#1c75bc);box-shadow:0 12px 24px -10px rgba(16,184,160,.5)}

/* Four stages — section 04 */
#page-how-it-works .stage-line{color:var(--azure);font-weight:700;font-size:.96rem;line-height:1.55;margin-bottom:10px}
#page-how-it-works .stage-exp{display:flex;align-items:center;justify-content:center;width:100%;flex:0 0 auto;color:#0b8f6c;background:rgba(15,185,141,.14);font-weight:700;font-size:.76rem;line-height:1.35;border-radius:999px;padding:5px 12px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Annotated conversation — section 05 */
.convo-list{display:grid;gap:14px;margin-top:44px;max-width:1020px;margin-inline:auto}
.convo-beat{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;background:var(--glass-strong);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px;backdrop-filter:blur(12px);box-shadow:var(--sh-in)}
.convo-num{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#1c75bc,#10b8a0);color:#fff;font-family:'Poppins',var(--fd);font-weight:800;font-size:.95rem;display:grid;place-items:center;flex:none}
.convo-beat h3{font-family:var(--fd);font-size:1rem;font-weight:700;margin-bottom:5px;color:var(--ink)}
.convo-beat p{color:var(--muted);font-size:.93rem;line-height:1.62}
.convo-beat.escalate{border-color:var(--orange);background:radial-gradient(120% 80% at 0% 0%,rgba(244,122,36,.12),transparent 60%),var(--glass-strong)}
.convo-beat.escalate .convo-num{background:linear-gradient(135deg,#f47a24,#ee5f2f)}
.convo-beat.done{border-color:rgba(15,185,141,.4)}
.convo-beat.done .convo-num{background:linear-gradient(135deg,#0fb98d,#14c784)}

/* What "Act" means — section 06 */
.act-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:44px}
@media(max-width:1020px){.act-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.act-grid{grid-template-columns:1fr}}
.act-card{background:var(--glass-strong);border:1px solid var(--line);border-radius:var(--r);padding:24px;backdrop-filter:blur(12px);box-shadow:var(--sh-in);transition:transform .2s}
.act-card:hover{transform:translateY(-4px)}
.act-num{display:block;font-family:'Poppins',var(--fd);font-weight:800;font-size:.86rem;letter-spacing:.12em;color:var(--azure);margin-bottom:10px}
.act-card h3{font-family:var(--fd);font-size:1.02rem;font-weight:700;margin-bottom:8px}
.act-card p{color:var(--muted);font-size:.9rem;line-height:1.62}
.act-card.last{border-color:var(--orange);background:radial-gradient(120% 80% at 0% 0%,rgba(244,122,36,.1),transparent 60%),var(--glass-strong)}

/* Control grid 2x2 — section 08 */
#page-how-it-works .diff-grid{grid-template-columns:repeat(4,1fr)}
@media(max-width:1020px){#page-how-it-works .diff-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){#page-how-it-works .diff-grid{grid-template-columns:1fr}}

/* Industry outcome chips — section 10 */
.out-chip{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:16px;padding:10px 16px;border-radius:999px;background:linear-gradient(135deg,#0fb98d,#14c784);color:#fff;font-family:var(--fd);font-weight:700;font-size:.84rem;text-align:center}
.hw-step-link{display:inline-block;margin-top:14px;font-family:var(--fd);font-weight:700;color:var(--navy);text-decoration:none;transition:.18s}
.hw-step-link:hover{color:var(--azure)}

/* Section palette — mirrors the homepage rhythm */
#page-how-it-works{background:#ffffff}
#page-how-it-works>section:nth-child(1){background:#ffffff}
#page-how-it-works>section:nth-child(2){background:#f1f2f2}
#page-how-it-works>section:nth-child(3){background:#ffffff}
#page-how-it-works>section:nth-child(4){background:#071827}
#page-how-it-works>section:nth-child(5){background:#eef2f9}
#page-how-it-works>section:nth-child(6){background:#ffffff}
#page-how-it-works>section:nth-child(7){background:#f1f2f2}
#page-how-it-works>section:nth-child(8){background:#0d2053}
#page-how-it-works>section:nth-child(9){background:#112e81}
#page-how-it-works>section:nth-child(10){background:#ffffff}
#page-how-it-works>section:nth-child(11){background:#112e81}

/* Stretched text — matches the homepage typography */
#page-how-it-works .page-hero h1{max-width:none;font-size:clamp(2.5rem,5.2vw,4.3rem);line-height:1.08}
#page-how-it-works .page-hero>.wrap>p{max-width:none;font-size:clamp(1.06rem,1.35vw,1.3rem);line-height:1.75}
#page-how-it-works .how-step h3,#page-how-it-works .act-card h3,#page-how-it-works .convo-beat h3{font-size:1.15rem}
#page-how-it-works .how-step p,#page-how-it-works .act-card p,#page-how-it-works .convo-beat p,#page-how-it-works .model-step p{font-size:.98rem;line-height:1.72}
#page-how-it-works .sol-card p{font-size:.98rem;line-height:1.72}
#page-how-it-works .diff-card p{font-size:.92rem;line-height:1.7}
#page-how-it-works .sec-link,#page-how-it-works .hw-step-link{font-size:1.05rem}

/* --- Product Demo --- */
.product-demo { background: #112e81; }
.demo-box {
  max-width: 800px;
  margin: 40px auto 0;
}
.demo-placeholder {
  aspect-ratio: 16/9;
  background: rgba(255,255,255,.06);
  border: 2px dashed rgba(255,255,255,.2);
  border-radius: var(--r);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  color: rgba(255,255,255,.6);
}
.demo-placeholder svg {
  width: 56px;
  height: 56px;
  stroke: rgba(255,255,255,.4);
}
.demo-cta {
  display: flex;
  gap: 14px;
  justify-content: center;
  margin-top: 36px;
  flex-wrap: wrap;
}

/* --- Why SAIS --- */
.why-sais { background: #071827; }
.diff-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 18px;
  margin-top: 48px;
}
@media(max-width:1020px){.diff-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.diff-grid{grid-template-columns:1fr}}
.diff-card {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--r);
  padding: 26px;
  transition: transform .2s, background .2s;
}
.diff-card:hover {
  transform: translateY(-4px);
  background: rgba(255,255,255,.08);
}
.diff-icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: rgba(28,117,188,.25);
  display: grid;
  place-items: center;
  margin-bottom: 16px;
}
.diff-icon svg {
  width: 22px;
  height: 22px;
  stroke: #1c75bc;
}
.diff-card h3 {
  font-family: var(--fd);
  font-size: 1.05rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px;
}
.diff-card p {
  color: rgba(255,255,255,.6);
  font-size: .88rem;
  line-height: 1.6;
}

/* --- Results --- */
.results { background: #f1f2f2; }
.metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 44px;
}
@media(max-width:720px){.metrics{grid-template-columns:1fr}}
.metric-card {
  background: var(--glass-strong);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 36px 28px;
  text-align: center;
  backdrop-filter: blur(14px);
  box-shadow: var(--sh), var(--sh-in);
}
.metric-num {
  font-family: 'Poppins', var(--fd);
  font-weight: 800;
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  color: var(--navy);
  display: block;
  line-height: 1.2;
  margin-bottom: 10px;
}
.metric-label {
  font-size: .95rem;
  color: var(--muted);
  font-weight: 600;
}
.results-placeholder {
  margin-top: 32px;
  text-align: center;
  background: rgba(242,128,46,.08);
  border: 1px solid rgba(242,128,46,.2);
  border-radius: var(--r-sm);
  padding: 18px 24px;
}
.results-placeholder p {
  color: var(--orange);
  font-size: .9rem;
  font-weight: 600;
}

/* --- Integrations --- */
.integrations { background: #fff; }
.integ-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  max-width: 960px;
  margin: 44px auto 0;
}
@media(max-width:640px){.integ-grid{grid-template-columns:1fr}}
.integ-col {
  background: var(--glass-strong);
  border-radius: var(--r);
  padding: 26px 28px;
  text-align: center;
  backdrop-filter: blur(12px);
  box-shadow: var(--sh-in);
  display: grid;
  gap: 18px;
  justify-items: center;
}
.integ-cat-name {
  font-family: 'Poppins', var(--fd);
  font-weight: 800;
  font-size: 1.35rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--navy);
}
.integ-cat {
  text-align: center;
}
.integ-label {
  font-family: var(--fd);
  font-weight: 800;
  font-size: .9rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--navy);
  margin-bottom: 14px;
  display: block;
}
.integ-logos {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}
.integ-logo {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: 16px 28px;
  font-family: 'Poppins', var(--fd);
  font-weight: 700;
  font-size: .95rem;
  color: var(--ink);
  backdrop-filter: blur(10px);
  box-shadow: var(--sh-in);
}

/* --- Final CTA --- */
.final-cta {
  background: #112e81;
  text-align: left;
  padding-block: clamp(80px, 12vh, 120px);
}
.final-cta h2 {
  font-size: clamp(2.4rem, 5vw, 4.4rem);
  font-weight: 800;
  color: #fff;
  max-width: 28ch;
  line-height: 1.08;
}
.final-cta p {
  color: rgba(255,255,255,.75);
  font-size: clamp(1.05rem, 1.35vw, 1.3rem);
  max-width: 72ch;
  margin-top: 20px;
  line-height: 1.7;
}
.final-cta .cta {
  display: flex;
  gap: 14px;
  justify-content: flex-start;
  margin-top: 38px;
  flex-wrap: wrap;
}

/* Override section padding for SAIS homepage */
#page-home > section { padding-block: clamp(60px, 8vw, 100px); }
#page-home .sais-hero { padding-block: 0; }
#page-home .social-proof { padding-block: clamp(40px, 5vw, 64px); }
#page-home .final-cta { padding-block: clamp(80px, 12vh, 120px); }

/* Ensure solid sections cover the constellation canvas */
#page-home .problem,
#page-home .sais-model,
#page-home .core-solutions,
#page-home .industries,
#page-home .how-it-works,
#page-home .product-demo,
#page-home .why-sais,
#page-home .results,
#page-home .integrations,
#page-home .final-cta {
  position: relative;
  z-index: 2;
}

/* Section color distribution using brand palette */
#page-home .sais-model { background: #f1f2f2; }
#page-home .core-solutions { background: #ffffff; }
#page-home .industries { background: #f1f2f2; }
#page-home .how-it-works { background: #ffffff; }
#page-home .results { background: #f1f2f2; }
#page-home .integrations { background: #ffffff; }

/* ============================================
   PRICING TOGGLE & COMPARISON TABLE
   ============================================ */
.pricing-toggle{display:flex;gap:10px;justify-content:center;margin-bottom:12px}

.comparison-table{margin-top:48px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.comparison-table table{width:100%;border-collapse:collapse;background:var(--glass);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;backdrop-filter:blur(14px);box-shadow:var(--sh)}
.comparison-table th,.comparison-table td{padding:14px 20px;text-align:center;font-size:.92rem;border-bottom:1px solid var(--line)}
.comparison-table th{background:rgba(30,42,115,.04);font-family:var(--fd);font-weight:700;color:var(--navy);font-size:.9rem}
.comparison-table th:first-child,.comparison-table td:first-child{text-align:left;font-weight:600;color:var(--ink)}
.comparison-table tr:last-child td{border-bottom:0}
.comparison-table td{color:var(--muted)}
.comparison-table td:not(:first-child){font-weight:600;color:var(--ink)}

/* ============================================
   SOLUTION DETAIL PAGES
   ============================================ */
.sol-detail-grid,.ind-detail-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:center}
@media(max-width:820px){.sol-detail-grid,.ind-detail-grid{grid-template-columns:1fr;gap:30px}}
.sol-detail-text h2,.ind-detail-text h2{font-family:var(--fd);font-size:clamp(1.6rem,3vw,2.2rem);margin-bottom:16px}
.sol-detail-text p,.ind-detail-text p{color:var(--muted);font-size:1.05rem;margin-bottom:20px;line-height:1.7}
.sol-detail-visual,.ind-detail-visual{aspect-ratio:4/3;border-radius:var(--r);display:grid;place-items:center;position:relative;overflow:hidden}
.sol-detail-visual svg,.ind-detail-visual svg{width:64px;height:64px;stroke:#fff;opacity:.9}

/* ============================================
   WIDE SCREENS — fill the sides
   ============================================ */
@media(min-width:1600px){
  .sol-grid,.how-grid{grid-template-columns:repeat(4,1fr)}
}

/* ============================================
   SOLUTIONS HUB + SOLUTION PAGES
   ============================================ */
.spg,.spg-hub{background:#ffffff}

/* page-level grey rhythm */
.spg>section:nth-child(2){background:#f8fafc}
.spg>section:nth-child(4){background:#f1f2f2}
.spg>section:nth-child(6){background:#eef2f9}
.spg>section:nth-child(7){background:#0d2053;color:#fff}
.spg>section:nth-child(9){background:#112e81}
.spg-hub>section:nth-child(2){background:#f1f2f2}
.spg-hub>section:nth-child(4){background:#eef2f9}
.spg-hub>section:nth-child(5){background:#112e81}

/* shared helpers (global so any page can reuse them) */
.eyebrow{display:block;text-align:center;font-family:var(--fd);font-size:.76rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--azure);margin-bottom:14px}
.c-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:32px}
.c-actions .btn-ghost{background:rgba(30,42,115,.045)}
.micro{text-align:center;color:var(--muted);font-size:.84rem;font-weight:600;margin-top:24px}
.sec-link-row{text-align:center;margin-top:36px}
.sec-link{font-family:var(--fd);font-weight:700;color:var(--navy);text-decoration:none;font-size:1rem;transition:.18s}
.sec-link:hover{color:var(--azure)}
.dark-section .eyebrow{color:#7fd6ea}
.dark-section .micro{color:rgba(255,255,255,.55)}

.page-hero .cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:32px}

/* split text+visual used on Problem / Solution sections */
.spg .sol-detail-text .eyebrow{text-align:left}
@media(min-width:821px){.spg .sol-flip .sol-detail-visual{order:-1}}

/* dark outcomes header copy */
.spg .dark-section .sec-h p{color:rgba(255,255,255,.75)}

/* hub: solutions overview 2x2 */
.sol-ov-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:48px;max-width:1100px;margin-inline:auto}
@media(max-width:700px){.sol-ov-grid{grid-template-columns:1fr}}
.sol-ov-card{background:var(--glass-strong);border:1px solid var(--line);border-radius:var(--r);padding:30px;box-shadow:var(--sh),var(--sh-in);display:flex;flex-direction:column}
.sol-ov-tag{font-family:var(--fd);font-size:.75rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--azure);margin-bottom:12px}
.sol-ov-card h3{font-size:1.32rem;font-weight:700;color:var(--navy);margin-bottom:10px}
.sol-ov-card>p{color:var(--muted);font-size:.97rem;line-height:1.66;margin-bottom:16px}
.sol-ov-card ul{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:9px}
.sol-ov-card li{display:flex;gap:10px;align-items:flex-start;color:var(--ink);font-size:.93rem;font-weight:600}
.sol-ov-card li::before{content:'✓';color:var(--azure);font-weight:800;flex:none}
.sol-ov-card .sec-link{margin-top:auto}

/* hub: business value 3x2 */
.val-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:48px;max-width:1200px;margin-inline:auto}
@media(max-width:860px){.val-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.val-grid{grid-template-columns:1fr}}
.val-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--sh)}
.val-num{font-family:'Poppins',var(--fd);font-weight:800;font-size:1.05rem;letter-spacing:.1em;color:var(--azure);margin-bottom:12px}
.val-card h3{font-size:1.16rem;font-weight:700;color:var(--navy);margin-bottom:8px}
.val-card p{color:var(--muted);font-size:.95rem;line-height:1.65}

/* 4-step process (how-it-works steps reused) */
.sf-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:44px;max-width:1240px;margin-inline:auto}
@media(max-width:920px){.sf-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.sf-grid{grid-template-columns:1fr}}

/* key capabilities - feature grid 3-up */
.feat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:44px}
@media(max-width:920px){.feat-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.feat-grid{grid-template-columns:1fr}}
.feat-card{background:var(--glass-strong);border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--sh-in);display:flex;flex-direction:column;transition:transform .2s,border-color .2s}
.feat-card:hover{transform:translateY(-4px);border-color:rgba(28,117,188,.4)}
.feat-card h3{font-size:1.12rem;font-weight:700;color:var(--navy);margin-bottom:8px}
.feat-card .feat-desc{color:var(--muted);font-size:.94rem;line-height:1.62;margin-bottom:14px}
.feat-val{font-size:.9rem;line-height:1.6;color:var(--ink);margin-bottom:16px}
.feat-val b{color:var(--navy);font-weight:700}
.feat-card .sec-link{margin-top:auto;font-size:.94rem}

/* use cases - 3-up */
.uc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:44px}
@media(max-width:920px){.uc-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.uc-grid{grid-template-columns:1fr}}
.uc-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--sh)}
.uc-card h3{font-size:1.12rem;font-weight:700;color:var(--navy);margin-bottom:8px}
.uc-card p{color:var(--muted);font-size:.95rem;line-height:1.65}

/* business outcomes - dark 2x2 */
.out-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:44px;max-width:1000px;margin-inline:auto}
@media(max-width:640px){.out-grid{grid-template-columns:1fr}}
.out-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--r);padding:26px}
.out-card h3{font-size:1.16rem;font-weight:700;color:#fff;margin-bottom:8px}
.out-card p{color:rgba(255,255,255,.72);font-size:.95rem;line-height:1.65}

/* related solutions - 3-up */
.rel-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:44px}
@media(max-width:860px){.rel-grid{grid-template-columns:1fr}}
.rel-card{background:var(--glass-strong);border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--sh-in);display:flex;flex-direction:column}
.rel-card h3{font-size:1.14rem;color:var(--navy);margin-bottom:8px}
.rel-card p{color:var(--muted);font-size:.95rem;line-height:1.65;margin-bottom:16px}
.rel-card .sec-link{margin-top:auto}

/* workflow examples - 2-up */
.wf-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:44px;max-width:1100px;margin-inline:auto}
@media(max-width:760px){.wf-grid{grid-template-columns:1fr}}
.wf-card{background:var(--glass-strong);border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--sh-in)}
.wf-card h3{font-size:1.16rem;color:var(--navy);margin-bottom:14px}
.wf-row{display:grid;grid-template-columns:104px 1fr;gap:14px;padding:12px 0;border-top:1px solid var(--line)}
.wf-row:first-of-type{border-top:0}
.wf-row b{font-family:var(--fd);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--azure);padding-top:2px}
.wf-row p{color:var(--muted);font-size:.93rem;line-height:1.6}

/* hub flow */
.spg-hub .model-flow{max-width:1240px;margin-inline:auto}
.final-cta .c-actions{justify-content:flex-start}

/* stretched solution heroes + small helpers */
.spg .page-hero h1,.spg-hub .page-hero h1{max-width:none;font-size:clamp(2.4rem,5vw,4.2rem);line-height:1.08}
.spg .page-hero>.wrap>p,.spg-hub .page-hero>.wrap>p{max-width:none;font-size:clamp(1.05rem,1.35vw,1.28rem);line-height:1.75}
.sol-support{font-family:var(--fd);font-weight:800;color:var(--navy);font-size:1.02rem;margin-top:-8px!important}
.sol-flow-tag{font-family:var(--fd);font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--azure);margin-bottom:8px}
.spg-hub .model-step h3{font-size:1.05rem;text-transform:uppercase;letter-spacing:.04em}

/* ============ PRICING ============ */
.ppg{background:#fff}
.ppg .page-hero h1{max-width:none;font-size:clamp(2.4rem,5vw,4.2rem);line-height:1.08}
.ppg .page-hero>.wrap>p{max-width:none;font-size:clamp(1.05rem,1.35vw,1.28rem);line-height:1.75}
.ppg>section:nth-child(2),
.ppg>section:nth-child(4),
.ppg>section:nth-child(6){background:#f1f2f2}

/* package cards */
.pkg-intro{max-width:74ch;margin-inline:auto;text-align:center;font-size:1.05rem;line-height:1.7;color:var(--muted)}
.pkg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:34px;align-items:stretch}
@media(max-width:1000px){.pkg-grid{grid-template-columns:1fr}}
.pkg-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--sh)}
.pkg-card.best{border:2px solid var(--navy);box-shadow:0 34px 70px -34px rgba(17,46,129,.55)}
.pkg-badge{position:absolute;top:-13px;left:26px;background:linear-gradient(135deg,#0fb98d,#14c784);color:#fff;font-family:var(--fd);font-weight:800;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;padding:7px 14px;border-radius:999px}
.pkg-name{font-family:var(--fd);font-size:.98rem;font-weight:800;letter-spacing:.16em;color:var(--azure);text-transform:uppercase}
.pkg-pos{margin:6px 0 0;font-family:var(--fd);font-size:1.32rem;line-height:1.22;color:var(--navy)}
.pkg-desc{color:var(--muted);margin-top:10px;font-size:.96rem;line-height:1.65}
.pkg-price{margin-top:18px;font-family:var(--fd)}
.pkg-price b{font-size:1.95rem;font-weight:800;color:var(--ink)}
.pkg-price span{display:block;font-size:.84rem;color:var(--muted);font-weight:600;margin-top:3px}
.pkg-sub{margin-top:14px;font-size:.9rem;color:var(--muted);font-style:italic;line-height:1.55;padding-top:14px;border-top:1px solid var(--line)}
.pkg-snap{margin-top:16px;background:#f6f8fb;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden}
.pkg-snap h4{margin:0;padding:11px 14px;font-family:var(--fd);font-size:.7rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);background:rgba(30,42,115,.05)}
.pkg-snap table{width:100%;border-collapse:collapse}
.pkg-snap th,.pkg-snap td{padding:9px 11px;font-size:.82rem;text-align:center;border-top:1px solid var(--line)}
.pkg-snap th{color:var(--muted);font-weight:700;font-size:.74rem}
.pkg-snap td{color:var(--ink)}
.pkg-snap td:first-child{text-align:left;font-weight:700}
.pkg-snap .valid{padding:10px 14px;font-size:.8rem;font-weight:700;color:var(--azure);border-top:1px solid var(--line)}
.pkg-benefits{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:10px;flex:1}
.pkg-benefits li{display:flex;gap:9px;align-items:flex-start;font-size:.9rem;line-height:1.5;color:var(--ink)}
.pkg-benefits li svg{width:17px;height:17px;flex:none;stroke:var(--azure);margin-top:2px}
.pkg-cta{display:flex;gap:10px;flex-direction:column;margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.pkg-strip{margin-top:26px;display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:20px 26px;text-align:center;box-shadow:var(--sh)}
.pkg-strip p{margin:0;font-size:.98rem;color:var(--ink)}
@media(max-width:700px){.pkg-strip{flex-direction:column}}

/* usage blocks (Product MIX vs Standard Product) */
.usage-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:36px}
@media(max-width:900px){.usage-grid{grid-template-columns:1fr}}
.usage-block{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--sh)}
.usage-block h3{font-family:var(--fd);font-size:1.25rem;font-weight:800;color:var(--navy)}
.usage-block>p{color:var(--muted);font-size:.95rem;line-height:1.65;margin-top:8px}
.usage-tbl{width:100%;border-collapse:collapse;margin-top:18px;font-size:.9rem}
.usage-tbl th,.usage-tbl td{padding:11px 13px;text-align:center;border-bottom:1px solid var(--line)}
.usage-tbl th{background:rgba(30,42,115,.05);font-family:var(--fd);font-weight:800;color:var(--navy);font-size:.84rem}
.usage-tbl td{color:var(--ink)}
.usage-tbl td:first-child{text-align:left;font-weight:700}
.usage-tbl tr:last-child td{border-bottom:0}
.usage-note{max-width:80ch;margin:24px auto 0;text-align:center;color:var(--muted);font-size:.9rem;line-height:1.7}

/* comparison table */
.cmp-legend{max-width:80ch;margin:16px auto 0;text-align:center;font-size:.9rem;font-weight:600;color:var(--muted)}
.cmp-wrap{margin-top:34px;overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:#fff;box-shadow:var(--sh)}
.cmp-tbl{width:100%;border-collapse:collapse;min-width:720px}
.cmp-tbl th,.cmp-tbl td{padding:13px 16px;text-align:center;border-bottom:1px solid var(--line);font-size:.9rem}
.cmp-tbl thead th{background:#0a1233;color:#fff;font-family:var(--fd);font-weight:800;font-size:.9rem}
.cmp-tbl thead th:first-child{background:transparent;color:var(--muted)}
.cmp-tbl tr.cmp-cat th{background:rgba(17,46,129,.08);color:var(--navy);font-family:var(--fd);font-weight:800;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;text-align:left}
.cmp-tbl td:first-child{text-align:left;font-weight:600;color:var(--ink)}
.cmp-tbl td:nth-child(2){text-align:left;color:var(--muted);font-weight:500}
.cmp-tbl tbody tr:nth-child(even) td{background:rgba(30,42,115,.025)}
.cmp-tbl tbody tr:last-child td{border-bottom:0}
.cmp-notes{margin:18px 0 0;display:grid;gap:7px;font-size:.85rem;color:var(--muted)}
.cmp-notes li{margin-left:1.2em}

/* trial */
.chk-list{list-style:none;margin:28px auto 0;padding:0;max-width:72ch;display:grid;gap:13px;text-align:left}
.chk-list li{position:relative;padding-left:32px;font-size:1rem;line-height:1.6;color:var(--ink)}
.chk-list li:before{content:"";position:absolute;left:0;top:5px;width:19px;height:19px;border-radius:6px;background:linear-gradient(135deg,#0fb98d,#14c784)}
.chk-list li:after{content:"";position:absolute;left:6px;top:9px;width:7px;height:4px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg)}
.trial-clarify{max-width:64ch;margin:26px auto 0;text-align:center;font-size:.92rem;font-weight:600;color:var(--navy);background:rgba(17,46,129,.06);border:1px solid rgba(17,46,129,.15);border-radius:var(--r-sm);padding:16px 22px;line-height:1.6}

/* final CTA tertiary line */
.fin-note{margin-top:18px;color:rgba(255,255,255,.6);font-size:.9rem;font-weight:600}

/* ============ FEATURES ============ */
.fg,.fgh{background:#fff}
.fg .page-hero h1,.fgh .page-hero h1{max-width:none;font-size:clamp(2.4rem,5vw,4.2rem);line-height:1.08}
.fg .page-hero>.wrap>p,.fgh .page-hero>.wrap>p{max-width:none;font-size:clamp(1.05rem,1.35vw,1.28rem);line-height:1.75}
.fg>section:nth-child(2),
.fg>section:nth-child(4),
.fg>section:nth-child(7){background:#f1f2f2}
.fg>section:nth-child(6),
.fg>section:nth-child(9){background:#eef2f9}
.fgh>section:nth-child(2){background:#f1f2f2}

/* feature section prose */
.f-sec{max-width:70ch;margin-inline:auto;text-align:center}
.f-sec .eyebrow{text-align:center}
.f-sec h2{font-family:var(--fd);font-size:clamp(1.75rem,3.4vw,2.5rem);line-height:1.22;color:var(--navy);margin-bottom:18px}
.f-sec p{color:var(--muted);font-size:1.06rem;line-height:1.75}
.f-sec .ind-list{margin:26px auto 0;max-width:58ch;text-align:left}
.f-sec .ind-list li{font-size:.98rem}

/* hub catalog */
.cat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:44px}
@media(max-width:760px){.cat-grid{grid-template-columns:1fr}}
.cat-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px;box-shadow:var(--sh-in);transition:transform .2s,border-color .2s}
.cat-card:hover{transform:translateY(-4px);border-color:rgba(28,117,188,.4)}
.cat-card .eyebrow{margin-bottom:14px}
.cat-card h3{font-family:var(--fd);font-size:1.28rem;line-height:1.25;color:var(--navy);margin-bottom:12px}
.cat-card>p{color:var(--muted);font-size:.96rem;line-height:1.68}
.cat-card .ind-list{margin:16px 0 0}
.cat-card .ind-list li{font-size:.88rem}
.cat-card .sec-link{margin-top:auto;padding-top:20px;font-size:.95rem}

/* audience (who it's for) */
.aud-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:44px}
@media(max-width:760px){.aud-grid{grid-template-columns:1fr}}
.aud-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--sh-in)}
.aud-card .eyebrow{margin-bottom:10px}
.aud-card h3{font-family:var(--fd);font-size:1.16rem;color:var(--navy);margin-bottom:10px}
.aud-card p{color:var(--muted);font-size:.95rem;line-height:1.68;margin-bottom:14px}
.aud-card .dm{font-size:.88rem;line-height:1.6;color:var(--ink)}
.aud-card .dm b{color:var(--navy)}

/* use case tag */
.uc-tag{display:inline-block;font-family:var(--fd);font-size:.68rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--azure);background:rgba(46,147,210,.1);border-radius:999px;padding:5px 12px;margin-bottom:12px}

/* connected features — 4-up reuse of rel-grid */
.rel-grid.quart{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:920px){.rel-grid.quart{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.rel-grid.quart{grid-template-columns:1fr}}

/* product visual section */
.feat-visual{margin-top:38px;max-width:860px;margin-inline:auto;position:relative;border-radius:var(--r);padding:44px 38px;background:linear-gradient(135deg,#0d2053,#112e81);display:grid;gap:14px;text-align:left;box-shadow:0 34px 70px -34px rgba(13,32,83,.7)}
.feat-visual .vb{max-width:82%;padding:15px 19px;border-radius:16px;font-size:.97rem;line-height:1.6}
.feat-visual .vb.c{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.92)}
.feat-visual .vb.a{background:#fff;color:var(--navy);margin-left:auto;box-shadow:0 18px 40px -18px rgba(0,0,0,.5)}
.feat-visual .vb .t{display:block;font-family:var(--fd);font-weight:800;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;margin-bottom:5px}
.feat-visual .vb.c .t{color:#7fd6ea}
.feat-visual .vb.a .t{color:#0fb98d}

/* outcome block */
.outcome-body{max-width:62ch;margin:6px auto 0;text-align:center;color:rgba(255,255,255,.75);font-size:clamp(1.05rem,1.35vw,1.28rem);line-height:1.7}

/* features dropdown — compact 2-column grid on desktop */
@media(min-width:901px){
  #dd-features .dd-menu{min-width:560px;display:grid;grid-template-columns:1fr 1fr;gap:2px}
  #dd-features .dd-menu .dd-item.dd-all{grid-column:1/-1;border-top:1px solid var(--line);margin-top:6px;padding-top:10px}
}

/* ============================================
   INDUSTRIES EXPERIENCE
   ============================================ */
.ig,.igh,.ibg{background:#ffffff}
.b-cloud{background:#F7FAFC}
.b-white{background:#ffffff}

/* dark CTA band variant from the industries brief */
.ig .final-cta,.igh .final-cta,.ibg .final-cta{background:linear-gradient(90deg,#071827,#0D324D 55%,#071827)}

/* ----- hero: navy (industries + hub) / light (business size) ----- */
.ig .ind-hero,.igh .ind-hero{background:#071827;color:#fff}
.ibg .ind-hero{background:#F7FAFC}
.ind-hero .wrap{padding-block:clamp(56px,7vw,96px)}
.ind-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;text-align:left}
@media(max-width:900px){.ind-hero-grid{grid-template-columns:1fr;gap:30px}}
.ind-hero-text{position:relative;z-index:1}
.ind-hero-text .eyebrow{color:#7fd6ea;text-align:left}
.ibg .ind-hero-text .eyebrow{color:var(--azure)}
.ind-hero-text h1{font-family:var(--fd);font-size:clamp(2.25rem,4.8vw,3.9rem);line-height:1.08;font-weight:800;color:#fff;max-width:20ch}
.ibg .ind-hero-text h1{color:var(--navy);max-width:24ch}
.ind-hero-text p{margin-top:18px;font-size:clamp(1.02rem,1.4vw,1.26rem);line-height:1.75;color:rgba(255,255,255,.78);max-width:56ch}
.ibg .ind-hero-text p{color:var(--muted)}
.ind-hero .c-actions{justify-content:flex-start;margin-top:30px}
.ind-hero .btn-ghost{background:rgba(255,255,255,.16);color:#fff;border-color:rgba(255,255,255,.45)}
.ind-hero .btn-ghost:hover{color:#fff;border-color:#fff}
.ibg .ind-hero .btn-ghost{background:rgba(30,42,115,.045);color:var(--ink);border-color:var(--line-2)}
.ibg .ind-hero .btn-ghost:hover{color:var(--navy);border-color:var(--azure)}
.hero-visual{position:relative;max-width:520px;margin-inline:auto;width:100%;z-index:1}
.ct-mark{position:absolute;inset-inline-start:-34px;inset-block-start:-30px;opacity:.13;pointer-events:none;z-index:0}
.ct-mark svg{width:230px;height:230px;stroke:#fff;fill:none}
.ig .ind-hero .feat-visual,.igh .ind-hero .feat-visual{margin:0;max-width:none;position:relative;z-index:1}
.feat-visual .src{display:block;margin-top:6px;font-size:.74rem;line-height:1.5;color:rgba(255,255,255,.55);font-style:normal}
.feat-visual .vb.a .src{color:var(--muted)}
.out-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.out-chip{font-family:var(--fd);font-weight:700;font-size:.78rem;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.24);color:#fff}
.out-chip.done{background:#10B981;border-color:#10B981}
.out-chip.act{background:rgba(16,168,190,.9);border-color:transparent}
.ibg .out-chip:not(.done):not(.act){background:rgba(30,42,115,.06);border-color:var(--line-2);color:var(--navy)}

/* ----- split text+diagram used on problem / helps sections ----- */
.ig .ind-detail-text .eyebrow{text-align:left}
@media(min-width:821px){.ig .flip .ind-dia,.ibg .flip .ind-dia{order:-1}}
.ind-dia{aspect-ratio:4/3;border:1px solid var(--line);border-radius:var(--r);background:#fff;box-shadow:var(--sh);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:22px}
.dia-track{display:flex;align-items:center;gap:10px;width:100%;max-width:480px;margin:0 auto}
.dia-seg{flex:1;text-align:center;padding:12px 8px;border-radius:12px;background:rgba(30,42,115,.06);color:var(--navy);font-family:var(--fd);font-weight:700;font-size:.85rem;line-height:1.3}
.dia-seg.brk{background:transparent;border:1.5px dashed var(--line-2);color:var(--muted)}
.dia-seg.act{background:rgba(16,168,190,.16);color:#0b7f93;border:1px solid rgba(16,168,190,.45)}
.dia-seg.ok{background:#10B981;color:#fff}
.dia-arr{color:var(--line-2);font-weight:800;flex:none}
.model-band .dia-seg{background:rgba(255,255,255,.08);color:#fff}
.model-band .dia-seg.brk{background:transparent;border-color:rgba(255,255,255,.35);color:rgba(255,255,255,.55)}
.model-band .dia-arr{color:rgba(255,255,255,.45)}
.ind-dia svg{width:100%;height:100%}
.ind-dia svg .lbl{font-family:var(--fd);font-weight:700;font-size:12px}
.ind-dia .lbl{font-family:var(--fd);font-weight:800;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase}

/* ----- friction / how-helps: 3-col typographic band ----- */
.fric-band{background:#F7FAFC}
.fric-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:46px;border-block:1px solid var(--line)}
@media(max-width:860px){.fric-grid{grid-template-columns:1fr;border-block:0}}
.fric-grid>div{padding:34px 30px;border-inline-start:1px solid var(--line)}
.fric-grid>div:first-child{border-inline-start:0;padding-inline-start:0}
@media(max-width:860px){.fric-grid>div{padding:26px 0;border-inline-start:0;border-bottom:1px solid var(--line)}.fric-grid>div:last-child{border-bottom:0}}
.fric-grid h3{font-family:var(--fd);font-size:1.14rem;font-weight:700;color:var(--navy);margin-bottom:10px}
.fric-grid p{color:var(--muted);font-size:.95rem;line-height:1.68}

/* ----- 4-stage cards (Talk / Understand / Think / Act) ----- */
.ig .sf-grid,.igh .sf-grid,.ibg .sf-grid{margin-top:40px}
.model-band{background:#071827;color:#fff}
.model-band .sec-h p{color:rgba(255,255,255,.72)}
.model-band .sec-h h2{color:#fff}
.model-band .how-step{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.13);box-shadow:none}
.model-band .how-step h3{color:#fff}
.model-band .how-step p{color:rgba(255,255,255,.75)}
.model-band .sec-link{color:#7fd6ea}
.model-band .sec-link:hover{color:#fff}

/* ----- use-case cards ----- */
.uc-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:860px){.uc-grid.four{grid-template-columns:1fr}}

/* ----- capability table ----- */
.cap-intro{color:var(--muted);font-size:1.02rem;text-align:center;max-width:78ch;margin:14px auto 0;line-height:1.7}

/* ----- example workflow dark band ----- */
.wf-band{background:#071827;color:#fff}
.wf-band .sec-h h2{color:#fff}
.wf-band .sec-h p{color:rgba(255,255,255,.72)}
.wf-band .wf-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-top:46px}
@media(max-width:1000px){.wf-band .wf-grid{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:620px){.wf-band .wf-grid{grid-template-columns:1fr}}
.wf-step{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.13);border-radius:16px;padding:20px 18px;display:flex;flex-direction:column;gap:11px}
.wf-art{width:34px;height:34px;border-radius:11px;background:rgba(16,168,190,.16);border:1px solid rgba(16,168,190,.35);display:grid;place-items:center}
.wf-art svg{width:18px;height:18px;stroke:#7fd6ea}
.wf-step.done .wf-art{background:rgba(16,185,129,.16);border-color:rgba(16,185,129,.4)}
.wf-step.done .wf-art svg{stroke:#4adeb5}
.wf-tag{font-family:var(--fd);font-size:.66rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#7fd6ea}
.wf-step.done .wf-tag{color:#4adeb5}
.wf-step h4{font-family:var(--fd);font-size:1rem;font-weight:700;color:#fff;line-height:1.3}
.wf-step p{font-size:.88rem;line-height:1.62;color:rgba(255,255,255,.8);margin:0}

/* ----- before / after ----- */
.ba-wrap{margin-top:44px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff;box-shadow:var(--sh)}
.ba-row{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line)}
.ba-row:last-child{border-bottom:0}
.ba-cell{padding:20px 24px;font-size:.95rem;line-height:1.7}
.ba-before{color:var(--muted);background:#F7FAFC;border-inline-end:1px solid var(--line)}
.ba-after{color:var(--navy);font-weight:600;background:#fff}
.ba-after::before{content:'✓';color:#10B981;font-weight:800;margin-inline-end:8px}
@media(max-width:560px){.ba-row{grid-template-columns:1fr}.ba-before{border-inline-end:0;border-bottom:1px solid var(--line)}}
.who-line{margin-top:28px;font-size:.9rem;color:var(--muted);font-weight:600;line-height:1.85}
.who-line b{color:var(--navy)}

/* ----- related industry & size link row ----- */
.rel-links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;margin-top:36px}
@media(max-width:760px){.rel-links{grid-template-columns:1fr 1fr}}
@media(max-width:460px){.rel-links{grid-template-columns:1fr}}
.rel-links a{background:#fff;padding:17px 22px;color:var(--navy);font-family:var(--fd);font-weight:700;font-size:.96rem;text-decoration:none;transition:.2s;display:block}
.rel-links a:hover{background:rgba(28,117,188,.07);color:var(--azure)}

/* ----- hub: four leaks ----- */
.leak-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:44px}
@media(max-width:980px){.leak-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.leak-grid{grid-template-columns:1fr}}
.leak-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--sh);display:flex;flex-direction:column}
.leak-card h3{font-size:1.06rem;font-weight:700;color:var(--navy);margin-bottom:10px;line-height:1.35}
.leak-card p{color:var(--muted);font-size:.93rem;line-height:1.66}
.trans-line{font-family:var(--fd);font-weight:700;font-size:1.1rem;color:var(--navy);text-align:center;margin-top:38px}

/* ----- hub: size cards (quiet outlined) ----- */
.size-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:44px}
@media(max-width:860px){.size-grid{grid-template-columns:1fr}}

/* ----- checklist (Other Industries signals) ----- */
.chk-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:920px;margin:42px auto 0;text-align:left}
@media(max-width:640px){.chk-grid{grid-template-columns:1fr}}
.chk-item{display:flex;gap:13px;align-items:flex-start;padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:var(--sh-in)}
.chk-item::before{content:'✓';flex:none;width:26px;height:26px;border-radius:50%;background:#10A8BE;color:#fff;display:grid;place-items:center;font-weight:800;font-size:.82rem;margin-top:1px}
.chk-item b{display:block;color:var(--navy);font-family:var(--fd);font-size:.98rem;margin-bottom:3px}
.chk-item span{color:var(--muted);font-size:.9rem;line-height:1.6;display:block}

/* ----- quiet cards on Other Industries ----- */
.cat-card.quiet{background:#fff;box-shadow:var(--sh-in)}
.cat-card.quiet:hover{transform:none}
.cat-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:960px){.cat-grid.three{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.cat-grid.three{grid-template-columns:1fr}}

/* ----- Other Industries hero: six conversation panels ----- */
.px-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:relative;z-index:1}
.px-grid .vb{padding:13px 16px;font-size:.82rem;line-height:1.55}
.px-grid .vb .t{font-size:.68rem}
@media(max-width:460px){.px-grid{grid-template-columns:1fr}}

/* ----- Business Size pages: route-map + typographic 3-col band ----- */
.route-map{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:18px}
.route-map svg{width:100%;height:auto;display:block}
.route-map .rh{font-family:var(--fd);font-size:.7rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-align:center;margin:0 0 6px}
.tcols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:1180px;margin:44px auto 0;text-align:left}
@media(max-width:820px){.tcols{grid-template-columns:1fr}}
.tcols>div{padding:4px 28px;border-inline-start:1px solid var(--line)}
.tcols>div:first-child{border-inline-start:0;padding-inline-start:0}
@media(max-width:820px){.tcols>div{padding:22px 0;border-inline-start:0;border-bottom:1px solid var(--line)}.tcols>div:last-child{border-bottom:0}}
.tcols h3{font-family:var(--fd);font-size:1.12rem;font-weight:700;color:var(--navy);margin-bottom:9px;line-height:1.35}
.tcols p{color:var(--muted);font-size:.94rem;line-height:1.66}

/* ----- industries dropdown — 3-column mega panel (desktop) ----- */
@media(min-width:961px){
  #dd-industries .dd-menu{min-width:820px;display:grid;grid-template-columns:1fr 1fr 300px;gap:2px}
  #dd-industries .mega-col{display:flex;flex-direction:column;gap:2px;padding:4px 4px 6px}
  #dd-industries .mega-h{font-family:var(--fd);font-size:.66rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--azure);padding:10px 14px 6px}
  #dd-industries .mega-feat{background:rgba(30,42,115,.045);border-radius:12px;padding:18px 16px;display:flex;flex-direction:column;gap:10px;justify-content:center}
  #dd-industries .mega-feat .mega-all{font-family:var(--fd);font-weight:800;color:var(--navy);text-decoration:none;font-size:.95rem;transition:.18s}
  #dd-industries .mega-feat .mega-all:hover{color:var(--azure)}
  #dd-industries .mega-feat b{color:var(--navy);font-family:var(--fd);font-size:1.02rem}
  #dd-industries .mega-feat p{color:var(--muted);font-size:.85rem;line-height:1.55;margin:0}
  #dd-industries .mega-feat .btn{justify-content:center}
}