/* ============================================================
   OPTIIIMUM × LIQUID GLASS — global material layer (v1)
   Loaded last on every page. Re-skins existing components;
   no markup, routes, forms or scripts are changed.
   Layers: 1 environment · 2 glass surfaces · 3 type/controls
   ============================================================ */

/* ---------- 1. Tokens ---------- */
:root{
  --glass-intensity:1;            /* balanced (default) */
  --gi:var(--glass-intensity);
  --glass-blur:28px;
  --glass-saturation:175%;
  --glass-tint:255 255 255;
  --glass-clear:rgb(var(--glass-tint) / calc(.42 * var(--gi)));
  --glass-standard:rgb(var(--glass-tint) / min(.94, calc(.58 * var(--gi))));
  --glass-elevated:rgb(var(--glass-tint) / min(.96, calc(.74 * var(--gi))));
  --glass-heavy:rgb(var(--glass-tint) / min(.97, calc(.86 * var(--gi))));
  --glass-border:rgb(16 20 36 / .08);
  --glass-border-hi:rgb(16 20 36 / .14);
  --glass-sheen:linear-gradient(180deg, rgb(255 255 255 / .55) 0%, rgb(255 255 255 / .12) 38%, rgb(255 255 255 / 0) 62%);
  --glass-spot:rgb(255 255 255 / .55);
  --glass-highlight:inset 0 1px 0 rgb(255 255 255 / .9), inset 0 0 0 1px rgb(255 255 255 / .38), inset 0 -1px 0 rgb(16 20 36 / .05);
  --glass-shadow:0 1px 1px rgb(16 20 36 / .04), 0 8px 24px -10px rgb(16 20 36 / .14), 0 28px 56px -28px rgb(16 20 36 / .18);
  --glass-shadow-hi:0 1px 1px rgb(16 20 36 / .05), 0 14px 32px -12px rgb(16 20 36 / .2), 0 40px 80px -36px rgb(16 20 36 / .26);
  --glass-focus:0 0 0 4px rgb(229 85 200 / .14), 0 0 24px -4px rgb(229 85 200 / .35);
  --ease-glass:cubic-bezier(.22,.8,.24,1);
  --r-card:28px;--r-feature:32px;--r-sm-card:24px;
  --font-sans:-apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "DM Sans", Inter, Arial, "IBM Plex Sans Arabic", "Tajawal", "Noto Sans Arabic", sans-serif;
  --lg-safe-top:env(safe-area-inset-top, 0px);
  --lg-safe-bottom:env(safe-area-inset-bottom, 0px);
}
html[data-glass="clear"]{--glass-intensity:.62}
html[data-glass="tinted"]{--glass-intensity:1.4}

html[data-theme="light"]:not([data-lg="cs"]){
  --bg:#F1F2F5;--bg-band:rgb(255 255 255 / .34);--bg-elev:var(--glass-standard);
  --line:rgb(16 20 36 / .08);--line-strong:rgb(16 20 36 / .16);
  --ink-2:#3A3B40;--ink-3:#6B6D74;
}
html[data-theme="dark"]:not([data-lg="cs"]){
  --glass-tint:30 30 34;
  --glass-clear:rgb(var(--glass-tint) / calc(.46 * var(--gi)));
  --glass-standard:rgb(var(--glass-tint) / min(.92, calc(.56 * var(--gi))));
  --glass-elevated:rgb(var(--glass-tint) / min(.95, calc(.74 * var(--gi))));
  --glass-heavy:rgb(20 20 23 / min(.97, calc(.86 * var(--gi))));
  --glass-border:rgb(255 255 255 / .08);
  --glass-border-hi:rgb(255 255 255 / .16);
  --glass-sheen:linear-gradient(180deg, rgb(255 255 255 / .09) 0%, rgb(255 255 255 / .02) 40%, rgb(255 255 255 / 0) 64%);
  --glass-spot:rgb(255 255 255 / .09);
  --glass-highlight:inset 0 1px 0 rgb(255 255 255 / .14), inset 0 0 0 1px rgb(255 255 255 / .04), inset 0 -1px 0 rgb(0 0 0 / .45);
  --glass-shadow:0 1px 1px rgb(0 0 0 / .4), 0 10px 28px -10px rgb(0 0 0 / .55), 0 30px 60px -30px rgb(0 0 0 / .6);
  --glass-shadow-hi:0 1px 1px rgb(0 0 0 / .45), 0 16px 36px -12px rgb(0 0 0 / .65), 0 44px 84px -36px rgb(0 0 0 / .7);
  --glass-focus:0 0 0 4px rgb(255 143 224 / .16), 0 0 26px -4px rgb(229 85 200 / .45);
  --bg:#09090B;--bg-band:rgb(255 255 255 / .018);--bg-elev:var(--glass-standard);
  --line:rgb(255 255 255 / .08);--line-strong:rgb(255 255 255 / .16);
}

/* ---------- 2. Environment (Layer 1) ---------- */
html,body{font-family:var(--font-sans)}
html[lang="ar"],html[lang="ar"] body{font-family:var(--font-ar)}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
html[data-theme="light"] body:not(.intro-active){background:var(--bg)}
html:not([data-lg="cs"]) body::before{
  inset:0;filter:none;opacity:1;will-change:auto;
  background:
    radial-gradient(60vmax 44vmax at 8% -6%, rgb(229 85 200 / .11), transparent 62%),
    radial-gradient(54vmax 40vmax at 104% 8%, rgb(84 179 236 / .12), transparent 60%),
    radial-gradient(60vmax 46vmax at 92% 104%, rgb(255 150 109 / .09), transparent 62%),
    radial-gradient(50vmax 40vmax at -6% 96%, rgb(0 254 255 / .06), transparent 60%),
    linear-gradient(180deg, #F5F6F8 0%, #EEF0F3 100%);
  animation:lgDrift 40s ease-in-out infinite alternate;
}
html[data-theme="dark"]:not([data-lg="cs"]) body::before{
  background:
    radial-gradient(60vmax 44vmax at 8% -6%, rgb(229 85 200 / .14), transparent 62%),
    radial-gradient(54vmax 40vmax at 104% 8%, rgb(84 179 236 / .12), transparent 60%),
    radial-gradient(60vmax 46vmax at 92% 104%, rgb(190 111 210 / .1), transparent 62%),
    radial-gradient(50vmax 40vmax at -6% 96%, rgb(255 150 109 / .07), transparent 60%),
    linear-gradient(180deg, #0B0B0E 0%, #070708 100%);
}
body::after{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
html[data-theme="dark"] body::after{opacity:.05}
@keyframes lgDrift{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(0,-2.5%,0) scale(1.04)}}

/* Let the environment show: flat section fills become transparent / washes */
.section,.proof,.foot,.logos-section,.pre-footer,.tst-section,.final-cta-section,.page-hero,.svc-section,.gb-marquee-section,.aaa-section,
html[data-theme="light"] .proof,html[data-theme="light"] .cs-stats-band{background:transparent}
.section.band{background:var(--bg-band)}
.section.band::before{display:none}
.section + .section{border-top-color:transparent}
.foot{border-top:1px solid var(--line)}

/* ---------- 3. Typography (Layer 3) ---------- */
h1,h2,h3{font-family:var(--font-sans);font-weight:700;color:var(--ink)}
h1{letter-spacing:-.034em;line-height:1}
h2{letter-spacing:-.028em;line-height:1.04}
h3{letter-spacing:-.018em;line-height:1.14}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3{letter-spacing:0;line-height:1.25}
p,.lede{text-wrap:pretty}
.lede{font-size:clamp(16px,1.25vw,19px);line-height:1.55;max-width:60ch;letter-spacing:-.005em}
.eyebrow{letter-spacing:.16em}
.section{padding:clamp(80px,10vw,144px) 0}
.section-head{margin-bottom:clamp(36px,4.5vw,64px)}
::selection{background:rgb(229 85 200 / .22)}
:focus-visible{outline:2px solid rgb(229 85 200 / .7);outline-offset:3px;border-radius:12px}

/* ---------- 4. Material primitives (Layer 2) ---------- */
.lg-clear,.lg-standard,.lg-elevated,.lg-heavy{
  border:1px solid var(--glass-border);
  box-shadow:var(--glass-highlight),var(--glass-shadow);
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturation));
  backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturation));
}
.lg-clear{background:var(--glass-sheen),var(--glass-clear)}
.lg-standard{background:var(--glass-sheen),var(--glass-standard)}
.lg-elevated{background:var(--glass-sheen),var(--glass-elevated)}
.lg-heavy{background:var(--glass-sheen),var(--glass-heavy)}

/* ---------- 5. Navigation ---------- */
.topbar{top:max(14px, calc(var(--lg-safe-top) + 8px))}
.topbar-inner,html[data-theme="light"] .topbar-inner{
  --np:var(--lg-nav-p,0);
  background:var(--glass-sheen),rgb(var(--glass-tint) / calc(.5 + .34 * var(--np)));
  border:1px solid var(--glass-border);
  box-shadow:var(--glass-highlight),0 6px 18px -8px rgb(0 0 0 / calc(.10 + .14 * var(--np))),0 24px 48px -28px rgb(0 0 0 / calc(.14 + .2 * var(--np)));
  -webkit-backdrop-filter:blur(30px) saturate(180%);backdrop-filter:blur(30px) saturate(180%);
  transition:background-color .4s var(--ease-glass),box-shadow .4s var(--ease-glass);
}
html[data-theme="dark"] .topbar-inner{background:var(--glass-sheen),rgb(22 22 26 / calc(.55 + .3 * var(--np)))}
.topbar-actions .icon-btn{border-radius:999px;background:var(--glass-clear);border:1px solid var(--glass-border);box-shadow:var(--glass-highlight);transition:background .2s,border-color .2s,transform .14s}
.topbar-actions .icon-btn:hover{border-color:var(--glass-border-hi)}
.topbar-actions .icon-btn:active{transform:scale(.94)}
.nav-cta{box-shadow:inset 0 1px 0 rgb(255 255 255 / .55),inset 0 -1px 0 rgb(0 0 0 / .08),0 6px 18px -6px rgb(229 85 200 / .4)}
.nav-cta:active{transform:scale(.97)}

.nav-flyout,html[data-theme="light"] .nav-flyout,.mobile-menu,.bottom-nav,html[data-theme="light"] .bottom-nav{
  background:var(--glass-sheen),var(--glass-elevated);
  border:1px solid var(--glass-border);
  box-shadow:var(--glass-highlight),var(--glass-shadow-hi);
  -webkit-backdrop-filter:blur(36px) saturate(180%);backdrop-filter:blur(36px) saturate(180%);
}
.nav-flyout{border-radius:28px}
html[data-theme="dark"] .nav-flyout,html[data-theme="dark"] .bottom-nav{background:var(--glass-sheen),rgb(24 24 28 / .82)}
.bottom-nav{bottom:max(14px, calc(var(--lg-safe-bottom) + 8px))}
.mobile-menu{border:0;border-radius:0;background:var(--glass-heavy);padding-top:max(80px, calc(var(--lg-safe-top) + 72px));padding-bottom:max(40px, calc(var(--lg-safe-bottom) + 24px))}
.mobile-menu a{border-bottom-color:var(--line);transition:opacity .2s}
.mobile-menu a:active{opacity:.6}

/* ---------- 6. Buttons ---------- */
.btn{border-radius:999px;transition:transform .16s var(--ease-glass),background-color .25s,box-shadow .3s var(--ease-glass),border-color .25s,color .2s;position:relative;-webkit-tap-highlight-color:transparent}
.btn:active,.btn-primary:active,.btn-ghost:active{transform:scale(.98) !important;transition-duration:.12s}
html[data-theme="light"] .btn-primary{
  background:linear-gradient(180deg, rgb(255 255 255 / .16), rgb(255 255 255 / 0) 55%),rgb(12 12 14 / .92);
  color:#FFFFFF;border:1px solid rgb(0 0 0 / .6);
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .22),inset 0 -1px 0 rgb(0 0 0 / .4),0 8px 22px -8px rgb(12 12 14 / .45);
}
html[data-theme="light"] .btn-primary:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgb(255 255 255 / .3),inset 0 -1px 0 rgb(0 0 0 / .4),0 12px 28px -10px rgb(12 12 14 / .5),0 0 0 5px rgb(229 85 200 / .1)}
html[data-theme="dark"] .btn-primary{box-shadow:inset 0 1px 0 rgb(255 255 255 / .14),0 10px 26px -10px rgb(229 85 200 / .45)}
.btn-ghost,html[data-theme="dark"] .final-cta-section .opt-box .btn-ghost{
  background:var(--glass-sheen),var(--glass-clear);
  border:1px solid var(--glass-border-hi);color:var(--ink);
  box-shadow:var(--glass-highlight);
  -webkit-backdrop-filter:blur(20px) saturate(170%);backdrop-filter:blur(20px) saturate(170%);
}
.btn-ghost:hover{border-color:var(--line-strong);background:var(--glass-sheen),var(--glass-standard);transform:translateY(-1px)}
.btn::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(120px circle at var(--mx,50%) var(--my,0%), rgb(255 255 255 / .28), transparent 70%)}
.btn:hover::after{opacity:1}
.chip{background:var(--glass-sheen),var(--glass-clear);border-color:var(--glass-border);box-shadow:var(--glass-highlight);padding:6px 12px}

/* ---------- 7. Cards ---------- */
.svc-card,.amb-card,.case-card,.course-card,.blog-card,.cc-card,
html[data-theme="light"] .svc-card,html[data-theme="light"] .amb-card{
  background:
    radial-gradient(360px circle at var(--mx,50%) var(--my,-30%), var(--glass-spot), transparent 60%),
    var(--glass-sheen),var(--glass-standard);
  border:1px solid var(--glass-border);
  box-shadow:var(--glass-highlight),var(--glass-shadow);
  -webkit-backdrop-filter:none;backdrop-filter:none;
  transition:transform .45s var(--ease-glass),box-shadow .45s var(--ease-glass),border-color .3s,background-color .3s;
}
.svc-card,.amb-card{border-radius:var(--r-card)}
.case-card{border-radius:var(--r-feature)}
.course-card,.blog-card,.cc-card{border-radius:var(--r-sm-card)}
.svc-card:hover,.amb-card:hover,.case-card:hover,.course-card:hover,.blog-card:hover,.cc-card:hover{
  transform:translateY(-4px);border-color:var(--glass-border-hi);
  box-shadow:var(--glass-highlight),var(--glass-shadow-hi);
}
.course-card .thumb{border-bottom-color:var(--line)}
.rp-card,.cs-card{border-radius:var(--r-sm-card);border-color:var(--glass-border);box-shadow:var(--glass-shadow)}
.rp-card:hover{transform:translateY(-4px)}
.cs-card figcaption{
  padding:10px 14px;border-radius:16px;
  background:linear-gradient(180deg, rgb(255 255 255 / .12), rgb(255 255 255 / 0) 60%),rgb(16 16 20 / .5);
  border:1px solid rgb(255 255 255 / .14);
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .18),0 8px 20px -8px rgb(0 0 0 / .45);
  -webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);
}
.opt-box{border-radius:var(--r-feature);box-shadow:inset 0 1px 0 rgb(255 255 255 / .12),inset 0 0 0 1px rgb(255 255 255 / .06),var(--glass-shadow-hi)}
html[data-theme="light"] .opt-box{box-shadow:inset 0 1px 0 rgb(255 255 255 / .9),inset 0 0 0 1px rgb(16 20 36 / .05),var(--glass-shadow-hi)}
.proof-stat{border-top-color:var(--line)}
.svc-icon,.hpw-ic,.sc-icon{
  background:var(--glass-sheen),var(--glass-clear);
  border:1px solid var(--glass-border);
  box-shadow:var(--glass-highlight),0 4px 12px -6px rgb(0 0 0 / .2);
  border-radius:14px;
}

/* ---------- 8. Forms ---------- */
:where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]):not([type="button"]):not([type="hidden"]),textarea,select){
  border-radius:14px;border:1px solid var(--glass-border-hi);
  background:var(--glass-sheen),var(--glass-standard);color:var(--ink);
  box-shadow:var(--glass-highlight);
  transition:border-color .25s,box-shadow .25s,background-color .25s;
}
:where(input,textarea,select):focus{outline:none;border-color:rgb(229 85 200 / .55);box-shadow:var(--glass-highlight),var(--glass-focus)}
:where(input,textarea)::placeholder{color:var(--ink-3);opacity:.75}
.wf-f input,.wf-f textarea,.nl-form input{border-radius:16px;box-shadow:var(--glass-highlight);transition:border-color .25s,box-shadow .25s}
.wf-f input:focus,.wf-f textarea:focus,.nl-form input:focus{border-color:rgb(229 85 200 / .55);box-shadow:var(--glass-highlight),var(--glass-focus)}
.wf-f.bad input,.wf-f.bad textarea{box-shadow:0 0 0 4px rgb(255 80 80 / .14)}
input[type="checkbox"],input[type="radio"]{accent-color:#E555C8}

/* ---------- 9. Media ---------- */
.cs-card img,.rp-card img,.course-card .thumb,.cc-image{border-radius:inherit}
iframe,video{border-radius:inherit}

/* ---------- 10. Hero light ---------- */
.hero{isolation:isolate}
.lg-hero-light{
  position:absolute;inset:-10%;z-index:-1;pointer-events:none;
  background:
    radial-gradient(38vmax 30vmax at calc(30% + var(--hx,0) * 6%) calc(30% + var(--hy,0) * 6%), rgb(229 85 200 / .16), transparent 62%),
    radial-gradient(34vmax 28vmax at calc(76% - var(--hx,0) * 5%) calc(46% - var(--hy,0) * 5%), rgb(84 179 236 / .14), transparent 62%);
  transition:background-position .6s var(--ease-glass);
}
html[data-theme="dark"] .lg-hero-light{opacity:.9}

/* ---------- 11. Scroll reveal ---------- */
html.lg-js .lg-reveal{opacity:0;transform:translate3d(0,20px,0);filter:blur(8px);transition:opacity .7s var(--ease-glass),transform .7s var(--ease-glass),filter .7s var(--ease-glass)}
html.lg-js .lg-reveal.lg-in{opacity:1;transform:none;filter:none}
html.lg-js .lg-reveal.lg-done{transition:none}

/* ---------- 12. Fallbacks, motion, contrast ---------- */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  :root,html[data-theme="light"]{--glass-clear:rgb(255 255 255 / .86);--glass-standard:rgb(255 255 255 / .92);--glass-elevated:rgb(255 255 255 / .96)}
  html[data-theme="dark"]{--glass-clear:rgb(28 28 32 / .9);--glass-standard:rgb(26 26 30 / .94);--glass-elevated:rgb(24 24 28 / .97)}
}
@media (prefers-reduced-transparency:reduce){
  :root{--glass-intensity:1.5}
}
@media (prefers-contrast:more){
  :root{--glass-intensity:1.6;--glass-border:rgb(0 0 0 / .3)}
  html[data-theme="dark"]{--glass-border:rgb(255 255 255 / .35)}
}
@media (prefers-reduced-motion:reduce){
  html body::before{animation:none}
  html.lg-js .lg-reveal{opacity:1;transform:none;filter:none;transition:none}
  .svc-card:hover,.amb-card:hover,.case-card:hover,.course-card:hover,.blog-card:hover,.cc-card:hover,.rp-card:hover{transform:none}
}

/* ---------- 13. Responsive ---------- */
@media (max-width:1024px){
  :root{--r-card:24px;--r-feature:28px;--r-sm-card:22px}
}
@media (max-width:640px){
  :root{--glass-blur:22px}
  .section{padding:clamp(64px,16vw,96px) 0}
  .topbar{top:max(8px, calc(var(--lg-safe-top) + 6px))}
  .lede{font-size:16px}
  h1{letter-spacing:-.03em}
  .svc-card:hover,.amb-card:hover,.case-card:hover,.course-card:hover,.blog-card:hover,.cc-card:hover{transform:none}
}
@media (hover:none){.btn::after{display:none}}

/* ============================================================
   14. Page families — same material, each page's own palette
   ============================================================ */
/* Dark-glass tokens must also exist for cs page (gold tint) */
html[data-lg="cs"]{--glass-tint:255 252 244;--glass-border:rgb(120 90 30 / .14);--glass-border-hi:rgb(120 90 30 / .24);--glass-focus:0 0 0 4px rgb(201 162 75 / .18),0 0 24px -4px rgb(201 162 75 / .4)}
html[data-lg="cs"][data-theme="dark"]{
  --glass-tint:34 30 22;
  --glass-clear:rgb(34 30 22 / calc(.5 * var(--gi)));
  --glass-standard:rgb(30 27 20 / min(.94, calc(.62 * var(--gi))));
  --glass-elevated:rgb(26 23 17 / min(.96, calc(.78 * var(--gi))));
  --glass-heavy:rgb(20 18 13 / min(.97, calc(.88 * var(--gi))));
  --glass-border:rgb(231 200 120 / .1);--glass-border-hi:rgb(231 200 120 / .22);
  --glass-sheen:linear-gradient(180deg, rgb(255 240 200 / .08) 0%, rgb(255 240 200 / .02) 40%, transparent 64%);
  --glass-spot:rgb(255 230 170 / .08);
  --glass-highlight:inset 0 1px 0 rgb(255 236 190 / .14), inset 0 0 0 1px rgb(255 236 190 / .04), inset 0 -1px 0 rgb(0 0 0 / .45);
  --glass-shadow:0 1px 1px rgb(0 0 0 / .4), 0 10px 28px -10px rgb(0 0 0 / .55), 0 30px 60px -30px rgb(0 0 0 / .6);
  --glass-shadow-hi:0 1px 1px rgb(0 0 0 / .45), 0 16px 36px -12px rgb(0 0 0 / .65), 0 44px 84px -36px rgb(0 0 0 / .7);
}
html[data-lg="cs"] body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(60vmax 44vmax at 90% -8%, rgb(231 200 120 / .12), transparent 62%),radial-gradient(54vmax 40vmax at -6% 100%, rgb(201 162 75 / .08), transparent 60%)}
html[data-lg="cs"] body{position:relative;isolation:isolate}
.cs-head{background:var(--glass-sheen),var(--glass-elevated);-webkit-backdrop-filter:blur(30px) saturate(170%);backdrop-filter:blur(30px) saturate(170%);box-shadow:inset 0 -1px 0 var(--glass-border),0 10px 30px -18px rgb(0 0 0 / .3);border-bottom:0;padding-top:var(--lg-safe-top)}
.cs-card,.cs-form,.cs-pill,.cs-chip{background:radial-gradient(360px circle at var(--mx,50%) var(--my,-30%), var(--glass-spot), transparent 60%),var(--glass-sheen),var(--glass-standard);border:1px solid var(--glass-border);box-shadow:var(--glass-highlight),var(--glass-shadow)}
.cs-card{border-radius:var(--r-sm-card);transition:transform .45s var(--ease-glass),box-shadow .45s var(--ease-glass),border-color .3s}
.cs-card:hover{transform:translateY(-4px);border-color:var(--glass-border-hi);box-shadow:var(--glass-highlight),var(--glass-shadow-hi)}
.cs-form{border-radius:var(--r-feature)}
.cs-pack{border-radius:var(--r-feature);box-shadow:var(--glass-highlight),var(--glass-shadow-hi)}
.cs-chip{-webkit-backdrop-filter:blur(20px) saturate(160%);backdrop-filter:blur(20px) saturate(160%);border-radius:20px}
.cs-btn{box-shadow:inset 0 1px 0 rgb(255 255 255 / .5),inset 0 -1px 0 rgb(0 0 0 / .12),var(--shadow-gold);transition:transform .16s var(--ease-glass),box-shadow .3s}
.cs-btn:active{transform:scale(.98)}
.cs-sticky{background:var(--glass-sheen),var(--glass-elevated);-webkit-backdrop-filter:blur(30px) saturate(170%);backdrop-filter:blur(30px) saturate(170%);border-top:0;box-shadow:inset 0 1px 0 var(--glass-border-hi),0 -10px 30px -18px rgb(0 0 0 / .4);padding-bottom:calc(11px + var(--lg-safe-bottom))}
.cs-band,.cs-tabs{background:transparent}

/* /grow landing (lp.css) */
.lp-card,.lp-case{background:radial-gradient(360px circle at var(--mx,50%) var(--my,-30%), var(--glass-spot), transparent 60%),var(--glass-sheen),var(--glass-standard);border:1px solid var(--glass-border);box-shadow:var(--glass-highlight),var(--glass-shadow);border-radius:var(--r-sm-card);transition:transform .45s var(--ease-glass),box-shadow .45s var(--ease-glass),border-color .3s}
.lp-card:hover,.lp-case:hover{transform:translateY(-4px);border-color:var(--glass-border-hi);box-shadow:var(--glass-highlight),var(--glass-shadow-hi)}
.lp-vcard{border-radius:var(--r-sm-card);border-color:var(--glass-border);box-shadow:var(--glass-shadow)}
.lp-price,.lp-feature{border-radius:var(--r-feature);box-shadow:var(--glass-highlight),var(--glass-shadow-hi)}
.lp-offer{border-radius:var(--r-sm-card);box-shadow:var(--glass-highlight),var(--glass-shadow)}
.lp-chip,.lp-tab{background:var(--glass-sheen),var(--glass-clear);border-color:var(--glass-border);box-shadow:var(--glass-highlight)}
.lp-head,.lp-sticky{background:var(--glass-sheen),var(--glass-elevated);-webkit-backdrop-filter:blur(30px) saturate(175%);backdrop-filter:blur(30px) saturate(175%);border-color:var(--glass-border)}
.lp-btn,.wbtn,.rc-btn{transition:transform .16s var(--ease-glass),box-shadow .3s var(--ease-glass),background-color .25s,border-color .25s}
.lp-btn:active,.wbtn:active,.rc-btn:active{transform:scale(.98)}
.lp-btn-grad,.wbtn-p{box-shadow:inset 0 1px 0 rgb(255 255 255 / .5),inset 0 -1px 0 rgb(0 0 0 / .1),0 14px 40px -16px rgb(229 85 200 / .65)}
.lp-btn-ghost,.rc-btn-ghost{background:var(--glass-sheen),var(--glass-clear);border:1px solid var(--glass-border-hi);box-shadow:var(--glass-highlight);-webkit-backdrop-filter:blur(20px) saturate(170%);backdrop-filter:blur(20px) saturate(170%)}
.wbtn-g{box-shadow:inset 0 1px 0 rgb(255 255 255 / .22),0 8px 22px -10px rgb(0 0 0 / .4);-webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%)}
.lp-lb{-webkit-backdrop-filter:blur(20px) saturate(140%);backdrop-filter:blur(20px) saturate(140%)}
.lp-float{box-shadow:inset 0 1px 0 rgb(255 255 255 / .45),0 14px 34px -10px rgb(37 211 102 / .6)}

/* Rate calculator + legal */
.rc-card,.rc-box{border-color:var(--glass-border);box-shadow:var(--glass-highlight),var(--glass-shadow);border-radius:var(--r-sm-card)}
.rc-box{border-radius:var(--r-feature)}
.rc-in:focus,.rc-opt:focus-visible{border-color:rgb(229 85 200 / .55);box-shadow:var(--glass-focus);outline:none}
html[data-theme="light"] .rc-btn-primary{background:linear-gradient(180deg, rgb(255 255 255 / .16), transparent 55%),rgb(12 12 14 / .92);color:#fff;box-shadow:inset 0 1px 0 rgb(255 255 255 / .22),0 8px 22px -8px rgb(12 12 14 / .45)}
.legal-note{background:var(--glass-sheen),var(--glass-clear);border-style:solid;border-color:var(--glass-border);box-shadow:var(--glass-highlight);border-radius:18px}