/* ── PRODUCT + GLASS-TYPE PAGE UPLIFT (.csu-prodpage) ──
   Editorial rhythm for long spec pages: accent-barred section headings,
   branded tables, measured text, breathing room between sections. */
.csu-prodpage .entry-content > h2,.csu-prodpage .uv-wrap > h2{position:relative;font-size:1.7rem;letter-spacing:-.02em;margin:64px 0 6px;padding-top:38px}
.csu-prodpage .entry-content > h2:not(:first-of-type)::before,.csu-prodpage .uv-wrap > h2:not(:first-of-type)::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,var(--gray-3),transparent 70%)}
.csu-prodpage .sbar{display:block!important;width:54px;height:4px;border-radius:3px;background:var(--grad);margin:12px 0 20px}
.csu-prodpage h2 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.csu-prodpage .entry-content > p,.csu-prodpage .uv-wrap > p{max-width:78ch;line-height:1.75}
.csu-prodpage .entry-content > h2 + .sbar + p,.csu-prodpage .uv-wrap > h2 + .sbar + p{font-size:1.02rem;color:var(--text-soft)}
.csu-prodpage .tbl th{background:linear-gradient(135deg,#0f1d3a,#1e3a5f);color:#fff;border-bottom:none}
.csu-prodpage .tbl tr:nth-child(even) td{background:#fafbfd}
.csu-prodpage .tbl tr:hover td{background:rgba(14,165,233,.06)}
.csu-prodpage .tbl-wrap{border-radius:16px;box-shadow:0 6px 26px rgba(15,23,42,.06)}
.csu-prodpage .entry-content ul:not([class]),.csu-prodpage .uv-wrap ul:not([class]){list-style:none;padding-left:0}
.csu-prodpage .entry-content ul:not([class]) > li,.csu-prodpage .uv-wrap ul:not([class]) > li{position:relative;padding-left:26px;margin:9px 0;line-height:1.7}
.csu-prodpage .entry-content ul:not([class]) > li::before,.csu-prodpage .uv-wrap ul:not([class]) > li::before{content:'';position:absolute;left:2px;top:.62em;width:10px;height:10px;border-radius:3px;background:var(--grad);opacity:.85}
.csu-prodpage .info-box{border-radius:16px;box-shadow:0 4px 18px rgba(15,23,42,.05)}
.csu-prodpage .page-hero{background:linear-gradient(160deg,#f8fbff 0%,#eef6ff 55%,#e8f2fd 100%);padding:64px 40px 60px;min-height:340px}
.csu-prodpage .page-hero-icon{margin-bottom:18px}
.csu-prodpage .page-hero .bc{margin-bottom:14px}
/* legacy overview two-column blocks: pin the short spec/CTA column so it travels
   with the reader instead of leaving a dead column below itself */
.csu-prodpage .g2:not(.csu-figs) > div:last-child{position:sticky;top:96px}
/* pages built from .section wrappers already carry their own padding — don't
   stack the flat-page h2 spacing on top of it */
.csu-prodpage .section .uv-wrap > h2,.csu-prodpage .section-alt .uv-wrap > h2{margin-top:8px;padding-top:0}
.csu-prodpage .section .uv-wrap > h2::before,.csu-prodpage .section-alt .uv-wrap > h2::before{display:none}
.csu-prodpage .section,.csu-prodpage .section-alt{padding-top:52px;padding-bottom:52px}
.csu-prodpage .section{padding-top:44px}
.csu-prodpage .section:first-of-type{padding-top:36px}
.csu-prodpage .page-hero h1{letter-spacing:-.035em}
.csu-prodpage .chip{background:#fff;border:1px solid #dbeafe;box-shadow:0 2px 8px rgba(30,64,175,.06)}
.csu-prodpage figure.csu-fig{margin-top:34px;margin-bottom:34px}
/* media rows — section text and image side-by-side, alternating direction */
.csu-mrow{display:grid;grid-template-columns:1.12fr .88fr;gap:40px;align-items:center;margin:6px 0 10px}
.csu-mrow-txt > p{margin-top:0}
.csu-mrow figure.csu-fig{margin:0;background:none;border:none;padding:0;max-width:none;float:none;width:auto}
.csu-mrow figure.csu-fig img{width:100%;max-width:none;height:100%;min-height:280px;max-height:420px;object-fit:cover;border-radius:16px}
.csu-mrow.flip figure.csu-fig{order:-1}
@media(max-width:860px){.csu-mrow{grid-template-columns:1fr;gap:18px}.csu-mrow.flip figure.csu-fig{order:0}.csu-mrow figure.csu-fig img{max-height:320px}}
/* leftover narrow figures not converted to rows: centered card, modest width */
.csu-prodpage figure.csu-fig-med,.csu-prodpage figure.csu-fig-sm{max-width:560px}
.csu-prodpage figure.csu-fig-med img,.csu-prodpage figure.csu-fig-sm img{max-width:100%}
.csu-prodpage .entry-content > h2,.csu-prodpage .uv-wrap > h2{clear:both}
.csu-prodpage .tbl-wrap,.csu-prodpage .info-box,.csu-prodpage .g2,.csu-prodpage .g3,.csu-prodpage .spec-tbl,.csu-prodpage .faq-item,.csu-prodpage .csu-dg{clear:both}
.csu-prodpage figure.csu-fig-wide{clear:both}
@media(max-width:820px){.csu-prodpage figure.csu-fig-med,.csu-prodpage figure.csu-fig-sm{float:none;width:auto;max-width:440px;margin:22px auto}}
/* diagram + photo duo rows */
.csu-duo{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:stretch;margin:26px 0;clear:both}
.csu-duo .csu-dg{max-width:none;margin:0;height:100%;display:flex;flex-direction:column}
.csu-duo .csu-dg .csu-dg-body{flex:1;display:flex;flex-direction:column;justify-content:center}
.csu-duo > div[style*="margin"]{margin:0!important}
.csu-duo figure.csu-fig{margin:0;max-width:none;display:flex;flex-direction:column}
.csu-duo figure.csu-fig img{width:100%;max-width:none;height:100%;min-height:320px;object-fit:cover;border-radius:16px;flex:1}
@media(max-width:900px){.csu-duo{grid-template-columns:1fr}.csu-duo figure.csu-fig img{min-height:0;height:auto}}
/* figure + table side-by-side rows */
.csu-side{display:grid;grid-template-columns:minmax(260px,350px) 1fr;gap:26px;align-items:start;margin:26px 0;clear:both}
.csu-side figure.csu-fig{float:none!important;width:auto!important;margin:0!important}
.csu-side .tbl-wrap{margin:0;clear:none}
@media(max-width:900px){.csu-side{grid-template-columns:1fr}.csu-side figure.csu-fig{max-width:440px;margin:0 auto!important}}
@media(max-width:768px){.csu-prodpage .entry-content > h2,.csu-prodpage .uv-wrap > h2{font-size:1.35rem;margin-top:44px;padding-top:26px}}

/* ── CONTENT FIGURES — placed product/install imagery ── */
.csu-fig{margin:28px auto;text-align:center;display:block}
.csu-fig img{border-radius:14px;display:block;margin:0 auto;width:100%;height:auto;transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s ease}
.csu-fig:hover img{transform:scale(1.02) translateY(-3px);box-shadow:0 14px 34px rgba(15,23,42,.14)}
.csu-fig figcaption{font-size:.72rem;color:var(--subtle);margin-top:9px}
.csu-fig-wide{max-width:900px}
.csu-fig-med{max-width:660px;background:linear-gradient(180deg,#f8fafc,#f1f5f9);border:1px solid #e8eef5;border-radius:20px;padding:16px 16px 12px}
.csu-fig-med img{max-width:520px}
.csu-fig-sm{max-width:560px;background:linear-gradient(180deg,#f8fafc,#f1f5f9);border:1px solid #e8eef5;border-radius:20px;padding:16px 16px 12px}
.csu-fig-sm img{max-width:380px}
.csu-figs{margin:28px 0;align-items:stretch}
.csu-figs .csu-fig{margin:0;display:flex;flex-direction:column;justify-content:flex-start}
.csu-figs.eq .csu-fig img{height:260px;object-fit:cover}
@media(max-width:640px){.csu-fig-med,.csu-fig-sm{padding:10px}.csu-figs.eq .csu-fig img{height:200px}}
/* Font Awesome loads async — reserve icon box before its CSS arrives so icons
   don't pop in at zero width and shift surrounding text (CLS) */
i[class^="fa-"],i[class*=" fa-"]{display:inline-block;min-width:1em;text-align:center;font-style:normal}
/* ── METRIC-MATCHED FALLBACK FONTS — kill font-swap CLS ── */
@font-face{font-family:'Inter Fallback';src:local('Arial');size-adjust:107.34%;ascent-override:90.25%;descent-override:22.47%;line-gap-override:0%}
@font-face{font-family:'DM Sans Fallback';src:local('Arial');size-adjust:105.58%;ascent-override:93.96%;descent-override:29.36%;line-gap-override:0%}
@font-face{font-family:'Source Serif 4 Fallback';src:local('Georgia');size-adjust:101.61%;ascent-override:101.96%;descent-override:32.97%;line-gap-override:0%}
/* ── HIDE BLOCKSY HEADER & FOOTER — we inject our own ── */
.ct-header,[data-id="header"],.header-wrapper,.site-header,#site-header,.entry-header{display:none!important}
.ct-footer,[data-id="footer"],.site-footer,#site-footer,.footer-wrapper{display:none!important}
/* Zero Blocksy's auto padding-top/bottom on the main content wrapper */
.ct-container-full{padding-top:0!important;padding-bottom:0!important}
/* Remove Blocksy sticky-header offset (we use our own fixed header) */
#main.site-main,#main{padding-top:0!important;margin-top:0!important}
/* Zero-height hero-section stub left by Blocksy before entry-content */
.hero-section{margin:0!important;padding:0!important;min-height:0!important}
#wpadminbar{display:block!important}
body.admin-bar{padding-top:32px!important}

/* ── DESIGN TOKENS (v3.0 — editorial refinement) ── */
:root{
  /* Refined neutral scale — closer to Vercel/Stripe */
  --ink:#0a0a0a;--ink-2:#171717;--ink-3:#262626;--ink-4:#404040;
  --gray-1:#fafafa;--gray-2:#f5f5f5;--gray-3:#e5e5e5;--gray-4:#d4d4d4;--gray-5:#a3a3a3;--gray-6:#737373;--gray-7:#525252;
  /* D3·3 "Light Glass" accent — cyan → deep blue */
  --accent:#0ea5e9;--accent-2:#38bdf8;--accent-3:#1e40af;
  --accent-glow:0 0 0 4px rgba(14,165,233,.14);
  /* Legacy aliases for v2.x components — remap to v3 tokens */
  --navy:#0a1224;--navy-light:#0f1d3a;--navy-dark:#070b16;
  --steel:#0ea5e9;--steel-light:#38bdf8;--steel-50:#f0f7ff;
  --dark:#0a0a0a;--dark2:#171717;--dark3:#404040;
  --text:#0a0a0a;--text-soft:#171717;--muted:#525252;--subtle:#a3a3a3;
  --bg:#fff;--bg2:#fafafa;--bg3:#f5f5f5;--bg4:#e5e5e5;
  --bdr:#e5e5e5;--bdr2:#d4d4d4;
  --green:#10b981;--green-dark:#059669;--green-50:#ecfdf5;
  --amber:#f59e0b;--amber-50:#fffbeb;
  --red:#ef4444;
  /* Radius scale */
  --r:10px;--r2:8px;--r3:6px;--r-lg:14px;--r-xl:20px;--r-2xl:28px;
  /* Shadow — sharper, less spread */
  --shadow-xs:0 1px 2px rgba(0,0,0,.04);
  --shadow:0 1px 3px rgba(0,0,0,.06),0 4px 8px rgba(0,0,0,.04);
  --shadow2:0 4px 16px rgba(0,0,0,.08);
  --shadow-lg:0 12px 40px rgba(0,0,0,.12);
  --shadow-pop:0 24px 60px -12px rgba(0,0,0,.18);
  /* Signature gradient — cyan → deep blue (D3·3) */
  --grad:linear-gradient(90deg,#0ea5e9,#1e40af);
  --grad2:linear-gradient(135deg,#0ea5e9 0%,#38bdf8 100%);
  --grad-ink:linear-gradient(180deg,#0a0a0a,#000);
  /* Type scale (modular) */
  --t-xs:.75rem;--t-sm:.85rem;--t-base:1rem;--t-lg:1.125rem;--t-xl:1.25rem;--t-2xl:1.5rem;--t-3xl:2rem;--t-4xl:2.75rem;--t-5xl:3.75rem;--t-6xl:5rem;--t-7xl:6.5rem;
  /* Easing */
  --ease:cubic-bezier(.4,0,.2,1);--ease-out:cubic-bezier(.16,1,.3,1);--ease-spring:cubic-bezier(.34,1.56,.64,1);
}

/* ── BASE ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'DM Sans','DM Sans Fallback',system-ui,-apple-system,sans-serif!important;background:var(--bg);color:var(--text);line-height:1.65;-webkit-font-smoothing:antialiased}
h1,h2{font-family:'Source Serif 4','Source Serif 4 Fallback',Georgia,serif!important;line-height:1.15;letter-spacing:-.02em;text-rendering:optimizeLegibility;color:var(--dark)}
h3,h4,h5,h6{font-family:Inter,Inter Fallback,system-ui,sans-serif!important;line-height:1.2;text-rendering:optimizeLegibility;color:var(--dark)}
a{color:var(--steel);text-decoration:none;transition:color .2s}
a:hover{color:var(--navy)}
img{max-width:100%;height:auto;display:block}

/* ── TOPBAR — v2.7 ── */
.csu-tbar{background:linear-gradient(135deg,#0a1426 0%,#0f172a 50%,#1e1b4b 100%);padding:8px 28px;display:flex;justify-content:space-between;align-items:center;font-size:.76rem;flex-wrap:wrap;gap:10px;position:relative;z-index:1001;border-bottom:1px solid rgba(255,255,255,.05);overflow:hidden}
.csu-tbar::before{content:'';position:absolute;top:0;right:0;width:400px;height:100%;background:radial-gradient(ellipse at right,rgba(124,58,237,.15),transparent 70%);pointer-events:none}
.csu-tbar > *{position:relative;z-index:1}
.csu-tbar a,.csu-tbar span{color:#cbd5e1;display:inline-flex;align-items:center;gap:6px;transition:color .18s var(--ease),transform .2s var(--ease);text-decoration:none;font-weight:500}
.csu-tbar a:hover{color:#fff;transform:translateY(-1px)}
.csu-tbar a i,.csu-tbar span i{opacity:.65;font-size:.78rem;color:#60a5fa}
.csu-tbar a:hover i{opacity:1}
.csu-tbar-l{display:flex;gap:22px;flex-wrap:wrap;align-items:center}
.csu-tbar-r{display:flex;gap:14px;align-items:center;color:#94a3b8}
.csu-tbar-r > span:first-child{padding-right:14px;border-right:1px solid rgba(255,255,255,.08);margin-right:2px}
.csu-tbar .badge,.csu-tbar .badge-blue{padding:4px 12px;border-radius:999px;font-weight:600;font-size:.68rem;letter-spacing:.04em;gap:6px;backdrop-filter:blur(8px)}
.csu-tbar .badge{background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.25);color:#86efac;text-transform:uppercase}
.csu-tbar .badge-blue{background:rgba(124,58,237,.14);border:1px solid rgba(124,58,237,.3);color:#a78bfa;text-transform:uppercase}
.csu-tbar .badge i,.csu-tbar .badge-blue i{opacity:.95;font-size:.7rem;color:inherit!important}

/* ── HEADER ── */
.csu-header{background:rgba(255,255,255,.96);backdrop-filter:saturate(180%) blur(12px);-webkit-backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--bdr);position:sticky;top:0;z-index:1000;box-shadow:var(--shadow-xs);transition:box-shadow .3s var(--ease),background .3s var(--ease)}
body.admin-bar .csu-header{top:32px}
.csu-header.scrolled{box-shadow:0 4px 20px rgba(15,23,42,.08);background:rgba(255,255,255,.98)}
.csu-hdr-inner{display:flex;align-items:center;justify-content:space-between;height:72px;max-width:1400px;margin:0 auto;padding:0 28px;gap:20px}
.csu-logo{display:flex;align-items:center;gap:11px;cursor:pointer;flex-shrink:0;text-decoration:none;transition:opacity .2s var(--ease)}
.csu-logo:hover{opacity:.85}
.csu-logo img{height:48px;width:auto}
.csu-nav{display:flex;align-items:center;gap:1px}
.csu-nav-item{position:relative;background:none;border:none;color:var(--text-soft);font-family:Inter,Inter Fallback,sans-serif;font-size:.84rem;font-weight:550;padding:9px 13px;cursor:pointer;border-radius:var(--r3);transition:color .18s var(--ease),background .18s var(--ease);white-space:nowrap;text-decoration:none;display:flex;align-items:center;gap:5px}
.csu-nav-item:hover{color:var(--navy)!important;background:var(--bg2)!important}
.csu-nav-item.active{color:var(--steel)!important;background:transparent!important;font-weight:700}
.csu-nav-item.active::after{content:'';position:absolute;left:13px;right:13px;bottom:2px;height:2px;background:var(--steel);border-radius:2px}
.csu-nav-item .dd{font-size:.55rem;opacity:.45;transition:transform .25s var(--ease)}
.csu-has-drop{position:relative}
.csu-has-drop:hover .csu-dropdown{opacity:1;visibility:visible;transform:translateY(0)}
.csu-has-drop:hover .dd{transform:rotate(180deg);opacity:.8}
.csu-has-drop:hover > .csu-nav-item{color:var(--navy)!important;background:var(--bg2)!important}

/* ── DROPDOWN with animation ── */
.csu-dropdown{opacity:0;visibility:hidden;transform:translateY(-6px) scale(.985);transition:opacity .22s var(--ease-out),transform .22s var(--ease-out),visibility .22s;position:absolute;top:calc(100% + 6px);left:0;background:#fff;border:1px solid rgba(15,23,42,.06);border-radius:var(--r-lg);min-width:260px;padding:10px;z-index:1002;box-shadow:var(--shadow-lg);transform-origin:top left}
.csu-drop-group{padding:4px 0}
.csu-drop-sep{border-top:1px solid var(--bg3);margin:6px 0;padding-top:6px}
.csu-drop-label{padding:8px 12px 4px;font-size:.64rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--subtle);display:block}
.csu-drop-link{display:flex;align-items:center;gap:9px;padding:9px 12px;font-size:.83rem;color:var(--text-soft);font-weight:500;border-radius:var(--r2);transition:color .15s var(--ease),background .15s var(--ease),padding-left .15s var(--ease);text-decoration:none;line-height:1.3}
.csu-drop-link:hover{color:var(--navy)!important;background:var(--bg2)!important;padding-left:16px}
.csu-drop-link.active{color:var(--steel)!important;background:var(--steel-50)!important;font-weight:700}

.csu-nav-right{display:flex;align-items:center;gap:12px}

/* ── CTA button — subtle 3-pulse then settle ── */
@keyframes csu-pulse{0%,100%{box-shadow:0 2px 10px rgba(43,108,176,.22)}50%{box-shadow:0 4px 22px rgba(43,108,176,.42)}}
.csu-hdr-cta{background:var(--grad)!important;color:#fff!important;font-weight:700!important;border-radius:999px!important;padding:9px 20px!important;animation:csu-pulse 2.6s var(--ease) 3;text-decoration:none!important;font-size:.83rem!important;font-family:Inter,Inter Fallback,sans-serif!important;letter-spacing:-.005em!important;display:inline-flex!important;align-items:center!important;gap:6px!important;transition:transform .2s var(--ease),box-shadow .2s var(--ease)!important;border:none!important;cursor:pointer!important;box-shadow:0 2px 10px rgba(43,108,176,.22)!important}
.csu-hdr-cta:hover{transform:translateY(-2px)!important;animation:none!important;box-shadow:0 8px 26px rgba(43,108,176,.45)!important;color:#fff!important}
.csu-hdr-cta i{font-size:.78rem!important}

.csu-ham{display:none;background:none;border:1px solid var(--bdr);border-radius:var(--r3);color:var(--navy);width:40px;height:40px;cursor:pointer;font-size:1.05rem;align-items:center;justify-content:center;transition:background .18s var(--ease),border-color .18s var(--ease)}
.csu-ham:hover{background:var(--bg2);border-color:var(--bdr2)}

/* ── TRUST STRIP — v2.7 light glass treatment ── */
.csu-trust{background:linear-gradient(135deg,#0a1628 0%,#1a365d 100%);padding:12px 28px;display:flex;justify-content:center;align-items:center;gap:40px;flex-wrap:wrap;position:relative;border-bottom:1px solid rgba(255,255,255,.06)}
.csu-trust::before{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(59,130,246,.35),transparent)}
.csu-trust-item{display:inline-flex;align-items:center;gap:10px;color:rgba(255,255,255,.75);font-size:.78rem;font-weight:600;font-family:Inter,Inter Fallback,sans-serif;letter-spacing:-.005em;position:relative;transition:color .2s ease}
.csu-trust-item:hover{color:#fff}
.csu-trust-item i{width:28px;height:28px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;font-size:.8rem;transition:transform .25s ease;background:rgba(255,255,255,.08);color:rgba(255,255,255,.7)}
.csu-trust-item:hover i{transform:scale(1.1);background:rgba(255,255,255,.15);color:#fff}
.csu-trust-item:nth-child(1) i{background:rgba(59,130,246,.2);color:#93c5fd}
.csu-trust-item:nth-child(2) i{background:rgba(34,197,94,.18);color:#86efac}
.csu-trust-item:nth-child(3) i{background:rgba(251,191,36,.18);color:#fde68a}
.csu-trust-item:nth-child(4) i{background:rgba(167,139,250,.18);color:#c4b5fd}
.csu-trust-item:nth-child(5) i{background:rgba(248,113,113,.18);color:#fca5a5}
@media(max-width:768px){.csu-trust{gap:18px;padding:10px 14px}.csu-trust-item{font-size:.72rem}.csu-trust-item i{width:26px;height:26px;font-size:.75rem}}

/* ── MOBILE NAV ── */
.csu-mob-nav{display:none;background:#fff;border-top:1px solid var(--bdr);padding:10px 20px 24px;max-height:calc(100vh - 110px);overflow-y:auto;animation:csu-fade .25s var(--ease)}
.csu-mob-nav.open{display:block}
.csu-mob-link{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:12px 4px;font-family:Inter,Inter Fallback,sans-serif;font-size:.95rem;color:var(--dark);border-bottom:1px solid var(--bg3);text-decoration:none;transition:color .15s var(--ease),padding-left .15s var(--ease)}
.csu-mob-link:hover{color:var(--steel);padding-left:8px}
.csu-mob-link:last-child{border-bottom:none}
.csu-mob-link--main{font-weight:600}
.csu-mob-sub{padding:2px 0 6px 8px;display:none;border-left:2px solid var(--steel-50);margin-left:4px}
.csu-mob-sub.open{display:block}
.csu-mob-sub a{display:flex;align-items:center;min-height:42px;padding:8px 12px;font-size:.85rem;color:var(--muted);text-decoration:none;border-radius:var(--r3);transition:background .15s var(--ease),color .15s var(--ease)}
.csu-mob-sub a:hover{color:var(--navy);background:var(--bg2)}
.csu-mob-toggle{width:100%;background:none;border:none;text-align:left;padding:12px 4px;min-height:48px;font-family:Inter,Inter Fallback,sans-serif;font-size:.95rem;font-weight:600;color:var(--dark);cursor:pointer;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--bg3);transition:color .15s var(--ease)}
.csu-mob-toggle:hover{color:var(--steel)}

/* ── MAIN CONTENT ── */
main,.site-main,#content{min-height:60vh}

/* ── FOOTER — v2.7 richer ── */
.csu-footer{background:linear-gradient(180deg,#0a1426 0%,#0f172a 50%,#1e1b4b 100%);color:#94a3b8;padding:0;position:relative;overflow:hidden}
.csu-footer::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(66,153,225,.4),rgba(124,58,237,.3),rgba(66,153,225,.4),transparent)}
.csu-footer::after{content:'';position:absolute;top:0;right:-200px;width:700px;height:700px;background:radial-gradient(circle,rgba(124,58,237,.18),transparent 65%);pointer-events:none}
/* brand strip */
.csu-footer-certs{background:rgba(255,255,255,.02);border-bottom:1px solid rgba(255,255,255,.05);padding:20px 28px;display:flex;justify-content:center;align-items:center;gap:36px;flex-wrap:wrap;position:relative;z-index:2}
.csu-cert-label{font-family:Inter,Inter Fallback,sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.4)}
.csu-cert-item{display:inline-flex;align-items:center;gap:8px;color:#cbd5e1;font-family:Inter,Inter Fallback,sans-serif;font-size:.78rem;font-weight:600;letter-spacing:-.005em;transition:color .2s var(--ease)}
.csu-cert-item:hover{color:#fff}
.csu-cert-item i{font-size:1rem;color:#60a5fa}
.csu-footer-inner{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:48px;padding:64px 28px 28px;position:relative;z-index:2}
@media(max-width:1024px){.csu-footer-inner{grid-template-columns:repeat(2,1fr);gap:36px}}
@media(max-width:640px){.csu-footer-inner{grid-template-columns:1fr;gap:32px}.csu-footer-certs{gap:20px;padding:16px 14px}}
.csu-footer h4,.csu-footer .csu-fh{color:#fff;font-family:Inter,Inter Fallback,sans-serif!important;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.08);position:relative}
.csu-footer h4::after,.csu-footer .csu-fh::after{content:'';position:absolute;left:0;bottom:-1px;width:40px;height:1px;background:linear-gradient(90deg,#60a5fa,#a78bfa)}
.csu-footer a{color:#94a3b8;font-size:.85rem;transition:color .18s var(--ease),transform .18s var(--ease);display:flex;align-items:center;gap:8px;padding:5px 0;text-decoration:none;line-height:1.4}
.csu-footer a:hover{color:#fff!important;transform:translateX(4px)}
.csu-footer p{font-size:.85rem;line-height:1.75;margin-bottom:10px;color:#94a3b8}
.csu-footer-cta-block{margin-top:24px;padding:20px;background:linear-gradient(135deg,rgba(43,108,176,.2),rgba(124,58,237,.12));border:1px solid rgba(96,165,250,.25);border-radius:var(--r-lg);backdrop-filter:blur(10px);position:relative;overflow:hidden}
.csu-footer-cta-block::before{content:'';position:absolute;top:-30px;right:-30px;width:120px;height:120px;background:radial-gradient(circle,rgba(96,165,250,.3),transparent 70%);pointer-events:none}
.csu-footer-cta-block p{font-size:.82rem;color:#dbeafe;margin-bottom:12px;line-height:1.5;font-weight:500;position:relative;z-index:1}
.csu-footer-cta-block a{background:#fff;color:#0f172a!important;padding:11px 20px;border-radius:999px;font-weight:700;font-size:.8rem;display:inline-flex!important;align-items:center;gap:8px;width:auto;box-shadow:0 4px 14px rgba(0,0,0,.2);transition:transform .2s var(--ease),box-shadow .2s var(--ease)!important;position:relative;z-index:1}
.csu-footer-cta-block a:hover{transform:translateY(-2px)!important;box-shadow:0 10px 26px rgba(0,0,0,.3);color:#0f172a!important}
/* social row */
.csu-social{display:flex;gap:10px;margin-top:20px}
.csu-social a{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);display:flex!important;align-items:center;justify-content:center;color:#94a3b8;font-size:.92rem;padding:0!important;transition:all .25s var(--ease-out)}
.csu-social a:hover{background:rgba(96,165,250,.2);border-color:rgba(96,165,250,.4);color:#fff!important;transform:translateY(-3px)!important}
.csu-footer-bottom{max-width:1400px;margin:0 auto;padding:24px 28px;border-top:1px solid rgba(255,255,255,.06);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;font-size:.76rem;color:#64748b;background:rgba(0,0,0,.2);position:relative;z-index:2}
.csu-footer-bottom a{color:#94a3b8;display:inline!important;padding:0!important;font-size:.76rem;transform:none!important}
.csu-footer-bottom a:hover{color:#60a5fa!important;transform:none!important}
.csu-hours-box{margin-top:18px;padding:16px 18px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:var(--r-lg);position:relative;overflow:hidden}
.csu-hours-box::before{content:'';position:absolute;top:0;left:0;width:3px;height:100%;background:linear-gradient(180deg,#60a5fa,#a78bfa)}
.csu-hours-box .lbl{font-size:.7rem;font-weight:700;color:#60a5fa;margin-bottom:8px;letter-spacing:.1em;text-transform:uppercase;display:inline-flex;align-items:center;gap:6px}
.csu-hours-box p{font-size:.82rem;margin:3px 0!important;line-height:1.6;color:#cbd5e1}

/* Contrast: inline var(--accent) text links (#0ea5e9 = 2.6:1 on white) darkened to AA-passing blue. Buttons/backgrounds unaffected. */
.entry-content p a[style*="--accent"],.entry-content li a[style*="--accent"]{color:#0369a1!important}

/* ── SUPPRESS WPAUTOP EMPTY P TAGS + style-in-p ── */
.entry-content>p:empty,.entry-content>p:blank{display:none!important;margin:0!important;padding:0!important;height:0!important}
.entry-content>p:has(>style),.entry-content>p:has(>script){display:none!important;margin:0!important;padding:0!important;height:0!important}
/* Pages only: their real copy lives inside section divs, so a direct-child text-only p is wpautop junk. Posts (single-post) carry genuine plain paragraphs — must stay visible. */
body.page .entry-content>p:not(:has(*)):not(:has(br)){display:none!important}

/* ═══════ GLASS SPEC FINDER QUIZ ═══════ */
.csu-quiz{background:#fff;border:1px solid #e2e8f0;border-radius:20px;padding:40px 36px;box-shadow:0 12px 40px rgba(15,23,42,.06);text-align:left;position:relative;min-height:340px}
.quiz-step,.quiz-result{display:none;opacity:0;transition:opacity .35s ease}
.quiz-step.active,.quiz-result.active{display:block;opacity:1}
.quiz-label{font-family:Inter,Inter Fallback,sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#2b6cb0;margin-bottom:8px}
.quiz-title{font-family:'Source Serif 4','Source Serif 4 Fallback',Georgia,serif;font-size:1.5rem;font-weight:800;color:#0f172a;letter-spacing:-.02em;margin-bottom:24px;line-height:1.2}
.quiz-opts{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.quiz-opt{background:#fff;border:1.5px solid #e2e8f0;border-radius:12px;padding:18px 16px;cursor:pointer;text-align:left;display:flex;align-items:center;gap:12px;font-family:Inter,Inter Fallback,sans-serif;font-size:.92rem;font-weight:600;color:#0f172a;transition:all .2s ease}
.quiz-opt i{width:36px;height:36px;border-radius:9px;background:#eff6ff;color:#2b6cb0;display:flex;align-items:center;justify-content:center;font-size:.95rem;flex-shrink:0;transition:all .2s ease}
.quiz-opt:hover{border-color:#2b6cb0;background:#f8fafc;transform:translateY(-1px)}
.quiz-opt:hover i{background:#2b6cb0;color:#fff;transform:scale(1.05)}
.quiz-result-card{background:linear-gradient(135deg,#0a1628,#1a365d);color:#fff;border-radius:16px;padding:36px 32px;text-align:center;position:relative;overflow:hidden}
.quiz-result-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#60a5fa,#a78bfa,#34d399)}
.quiz-result-label{font-family:Inter,Inter Fallback,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:8px}
.quiz-result-title{font-family:'Source Serif 4','Source Serif 4 Fallback',Georgia,serif;font-size:1.7rem;font-weight:800;color:#fff;letter-spacing:-.025em;margin-bottom:10px;line-height:1.15}
.quiz-result-desc{color:rgba(255,255,255,.75);font-size:.95rem;line-height:1.55;margin-bottom:24px;max-width:480px;margin-left:auto;margin-right:auto}
.quiz-result-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.quiz-result-actions .btn{padding:12px 22px!important;border-radius:10px!important;font-weight:600!important;font-size:.9rem!important;text-decoration:none;font-family:Inter,Inter Fallback,sans-serif}
.quiz-result-actions .btn-primary{background:#3b82f6!important;color:#fff!important;border:1px solid #3b82f6!important}
.quiz-result-actions .btn-white{background:rgba(255,255,255,.1)!important;color:#fff!important;border:1px solid rgba(255,255,255,.25)!important}
.quiz-restart{background:none;border:none;color:#64748b;font-family:Inter,Inter Fallback,sans-serif;font-size:.82rem;cursor:pointer;margin-top:18px;display:inline-flex;align-items:center;gap:6px;padding:8px 12px}
.quiz-restart:hover{color:#2b6cb0}
.quiz-progress{height:4px;background:#e2e8f0;border-radius:2px;margin-top:24px;overflow:hidden}
.quiz-progress-bar{height:100%;background:linear-gradient(90deg,#2b6cb0,#3b82f6);border-radius:2px;transition:width .4s ease}
@media(max-width:600px){.quiz-opts{grid-template-columns:1fr}.csu-quiz{padding:28px 22px}.quiz-title{font-size:1.25rem}}

/* ═══════ COLLAPSIBLE PRODUCT GRID ═══════ */
.prod-grid-wrap{position:relative}
.prod-grid-wrap[data-collapsed="true"] .prod-grid{max-height:540px;overflow:hidden;transition:max-height .5s ease}
.prod-grid-wrap[data-collapsed="false"] .prod-grid{max-height:5000px;overflow:visible;transition:max-height .8s ease}
.prod-grid-fade{position:absolute;bottom:62px;left:0;right:0;height:120px;background:linear-gradient(transparent,#f5f5f5);pointer-events:none;transition:opacity .3s}
.prod-grid-wrap[data-collapsed="false"] .prod-grid-fade{opacity:0}
.prod-grid-toggle{display:flex;align-items:center;justify-content:center;gap:8px;margin:24px auto 0;background:#fff;border:1.5px solid #1a365d;color:#1a365d;font-family:Inter,Inter Fallback,sans-serif;font-size:.92rem;font-weight:700;padding:14px 28px;border-radius:12px;cursor:pointer;transition:all .2s ease}
.prod-grid-toggle:hover{background:#1a365d;color:#fff;transform:translateY(-2px);box-shadow:0 8px 24px rgba(26,54,93,.18)}
.prod-grid-toggle i{transition:transform .25s ease}
.prod-grid-wrap[data-collapsed="false"] .prod-grid-toggle i{transform:rotate(180deg)}
/* Category filter chips */
.prod-filter-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}
.prod-filter-chip{background:#fff;border:1.5px solid var(--gray-3);border-radius:999px;padding:10px 18px;min-height:40px;font-family:Inter,Inter Fallback,sans-serif;font-size:.85rem;font-weight:600;color:var(--gray-7);cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center}
.prod-filter-chip:hover{border-color:#1a365d;color:#1a365d}
.prod-filter-chip.active{background:#1a365d;border-color:#1a365d;color:#fff}
/* Quiz progress segments (replaces the old single continuous bar) — thin
   visual bar with generous invisible padding so the tap target clears 40px
   without bulking the bar itself. */
.quiz-progress-segs{display:flex;gap:6px;margin-top:18px}
.quiz-seg{flex:1;padding:17px 0;background:none;border:none;cursor:default;-webkit-tap-highlight-color:transparent}
.quiz-seg::before{content:'';display:block;height:6px;border-radius:3px;background:#e2e8f0;transition:background .2s ease}
.quiz-seg.active::before{background:linear-gradient(90deg,#2b6cb0,#0ea5e9)}
.quiz-seg.done::before{background:#2b6cb0}
.quiz-seg.done{cursor:pointer}
.quiz-seg.done:hover::before{background:#1a365d}
.quiz-alt-link{text-align:center;margin-top:16px;font-size:.82rem;color:var(--gray-7)}
.quiz-alt-link a{color:#2b6cb0;font-weight:600;text-decoration:none}
.quiz-alt-link a:hover{text-decoration:underline}

/* ═══════ STICKY BOTTOM CTA BAR (homepage only, after scroll) ═══════ */
.csu-sticky-cta{position:fixed;bottom:0;left:0;right:0;background:linear-gradient(135deg,#0a1628,#1a365d);color:#fff;padding:14px 24px;display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;z-index:9000;transform:translateY(100%);transition:transform .35s cubic-bezier(.16,1,.3,1);box-shadow:0 -8px 32px rgba(0,0,0,.2);border-top:1px solid rgba(59,130,246,.3)}
.csu-sticky-cta.show{transform:translateY(0)}
.csu-sticky-cta-text{font-family:Inter,Inter Fallback,sans-serif;font-size:.95rem;font-weight:600;color:#fff}
.csu-sticky-cta-text small{display:block;font-size:.75rem;color:rgba(255,255,255,.6);font-weight:400;margin-top:2px}
.csu-sticky-cta-btns{display:flex;gap:8px}
.csu-sticky-cta-btn{padding:10px 18px;border-radius:8px;font-family:Inter,Inter Fallback,sans-serif;font-size:.85rem;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:all .2s ease;border:1px solid transparent}
.csu-sticky-cta-btn.primary{background:#3b82f6;color:#fff}
.csu-sticky-cta-btn.primary:hover{background:#2563eb;transform:translateY(-1px)}
.csu-sticky-cta-btn.secondary{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.2)}
.csu-sticky-cta-btn.secondary:hover{background:rgba(255,255,255,.18)}
.csu-sticky-cta-close{background:none;border:none;color:rgba(255,255,255,.5);cursor:pointer;font-size:1rem;padding:6px;margin-left:6px;transition:color .2s}
.csu-sticky-cta-close:hover{color:#fff}
@media(max-width:768px){.csu-sticky-cta{padding:10px 14px;gap:10px;flex-direction:column}.csu-sticky-cta-text{font-size:.85rem;text-align:center}.csu-sticky-cta-btns{width:100%;justify-content:center}.csu-sticky-cta-btn{flex:1;justify-content:center}}

/* ═══════ FAQ ACCORDION (upgrade existing) ═══════ */
.faq-item.open .faq-q i{transform:rotate(180deg)}
.faq-q i{transition:transform .25s ease}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease}
.faq-item.open .faq-a{max-height:500px}

/* ── FULL WIDTH OVERRIDE — beat WP is-layout-constrained and Blocksy ── */
.entry-content .section,.entry-content .section-full,.entry-content .kpi-bar,.entry-content .brand-strip,.entry-content .slider,.entry-content .bento,.is-layout-constrained>.section,.is-layout-constrained>.section-full,.is-layout-constrained>.kpi-bar,.is-layout-constrained>.brand-strip,.is-layout-constrained>.slider{max-width:100%!important;width:100%!important;margin-left:0!important;margin-right:0!important}

/* ── SECTIONS — Editorial (v3.0) ── */
/* inline style overrides — force all sections to 80px vertical padding */
.entry-content .section[style*="padding-top"]{padding-top:80px!important}
.entry-content .section[style*="padding-bottom"]{padding-bottom:80px!important}
.section{width:100%!important;max-width:100%!important;padding:80px 60px;position:relative;box-sizing:border-box}
/* ── unified container for design-system content pages (excl. homepage) ── */
.csu-ds-page .uv-wrap{max-width:1240px;width:100%;margin:0 auto;padding:0 40px;box-sizing:border-box}
.csu-ds-page .page-hero{padding-left:0;padding-right:0}
.csu-ds-page .page-hero-inner{max-width:1240px;padding:0 40px;box-sizing:border-box}
.csu-ds-page .section,.csu-ds-page .section-alt,.csu-ds-page .section-navy,.csu-ds-page .section-full{padding-left:0;padding-right:0}
.csu-ds-page .kpi-bar-inner{max-width:1240px;margin:0 auto;padding:0 40px;box-sizing:border-box}
@media(max-width:768px){.csu-ds-page .uv-wrap,.csu-ds-page .page-hero-inner,.csu-ds-page .kpi-bar-inner{padding-left:22px;padding-right:22px}}
.section + .section{background:var(--gray-1)}
.section + .section + .section{background:#fff}
.section-full{padding:100px 0;width:100%}
/* override any inline max-width on section inner divs */
.section > div[style*="max-width:1320"],.section > div[style*="max-width: 1320"],.section-full > div[style*="max-width:1320"],.section-full > div[style*="max-width: 1320"]{max-width:100%!important;width:100%!important}
.section-alt{background:var(--gray-1)}
.section-dark{background:linear-gradient(135deg,#0f172a 0%,#1e1b4b 100%);color:#fff;position:relative;overflow:hidden}
.section-dark::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.08) 1px,transparent 1px);background-size:32px 32px;opacity:.4;pointer-events:none}
.section-dark::after{content:'';position:absolute;top:0;right:0;width:600px;height:600px;background:radial-gradient(circle,rgba(124,58,237,.25),transparent 70%);transform:translate(30%,-30%);pointer-events:none}
.section-dark > *{position:relative;z-index:1}
.section-dark h2,.section-dark h3{color:#fff}
.section-dark .sh em{color:#60a5fa;font-style:italic}
.section-dark .eyebrow,.section-navy .eyebrow{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.8)}
.section-dark p,.section-dark li{color:rgba(255,255,255,.7)}
.section-navy{background:linear-gradient(135deg,#0f172a 0%,#1e1b4b 50%,#1a365d 100%)!important;color:#fff;position:relative;overflow:hidden;padding:72px 24px!important;text-align:center}
.section-navy::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.06) 1px,transparent 1px);background-size:32px 32px;opacity:.4}
.section-navy::after{content:'';position:absolute;top:50%;left:50%;width:600px;height:600px;background:radial-gradient(circle,rgba(124,58,237,.25),transparent 70%);transform:translate(-50%,-50%);pointer-events:none}
.section-navy > div{position:relative;z-index:1}
.section-navy h2{color:#fff!important;font-family:'Source Serif 4','Source Serif 4 Fallback',Georgia,serif!important;font-size:clamp(1.8rem,3vw,2.6rem)!important;font-weight:800;letter-spacing:-.025em;margin-bottom:12px!important;line-height:1.15}
.section-navy p{font-size:1.02rem!important;color:rgba(255,255,255,.75)!important;max-width:560px;margin:0 auto 22px!important;line-height:1.6}
.section-navy .btn,.section-navy .btn-white,.section-navy .btn-primary{padding:12px 22px!important;border-radius:999px!important;font-weight:700!important;font-size:.86rem!important;letter-spacing:-.005em;box-shadow:0 4px 16px rgba(0,0,0,.2)}
.section-navy .btn-white{background:#fff!important;color:#0f172a!important;border:none!important}
.section-navy .btn-white:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(0,0,0,.3)}
@media(max-width:768px){.section{padding:60px 20px}.section-full{padding:60px 0}.kpi-bar-inner{padding:0 20px}}
@media(max-width:640px){.ib-photo-row{grid-template-columns:1fr!important}}

/* ── TYPOGRAPHY COMPONENTS — Editorial (v3.0) ── */
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:Inter,Inter Fallback,sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:#2b6cb0;background:#eff6ff;border:1px solid #bfdbfe;padding:5px 12px;border-radius:999px;margin-bottom:16px;position:relative}
.eyebrow::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px rgba(0,112,243,.4)}
.eyebrow i{font-size:.68rem;color:var(--accent)}
.sh{font-family:'Source Serif 4','Source Serif 4 Fallback',Georgia,serif!important;font-size:clamp(2rem,3.8vw,3.2rem);font-weight:800;letter-spacing:-.025em;margin-bottom:20px;line-height:1.1;color:var(--ink)}
.sh em{font-style:italic;font-weight:800;color:#2b6cb0;position:relative;display:inline-block}
.sh em::after{display:none}
.sbar{display:none}
.lead{font-size:1.18rem;color:var(--gray-7);line-height:1.5;max-width:680px;margin-bottom:32px;letter-spacing:-.005em;font-weight:400}

/* ── PAGE HERO — Editorial (v3.0) ── */
.page-hero{background:#fff;padding:120px 40px 140px;color:var(--ink);position:relative;overflow:hidden;min-height:520px;display:flex;align-items:flex-end;border-bottom:1px solid var(--gray-3)}
/* full-bleed bands on all pages — same 50vw trick as homepage slider [HI-5b].
   !important needed: WP .is-layout-constrained>* forces margin:auto!important + content max-width */
.entry-content .page-hero,.page-hero,
.entry-content .section-full,.section-full,
.entry-content .section-navy,.section-navy,
.entry-content .kpi-bar,.kpi-bar{margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;max-width:none!important;width:auto!important}
/* band content stays on the shared 1240px grid even without a .uv-wrap inside */
.section-navy{padding-left:max(24px,calc(50vw - 620px))!important;padding-right:max(24px,calc(50vw - 620px))!important}
.section-full{padding-left:max(20px,calc(50vw - 620px));padding-right:max(20px,calc(50vw - 620px))}
.page-hero::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(0,0,0,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.025) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse 90% 90% at 50% 30%,#000 0%,transparent 75%);-webkit-mask-image:radial-gradient(ellipse 90% 90% at 50% 30%,#000 0%,transparent 75%);pointer-events:none}
.page-hero::after{content:'';position:absolute;top:-100px;right:-100px;width:600px;height:600px;background:radial-gradient(circle,rgba(0,112,243,.08),transparent 65%);pointer-events:none}
.page-hero-inner{max-width:1320px;width:100%;margin:0 auto;position:relative;z-index:2}
.page-hero-icon{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;background:#fff;border:1px solid var(--gray-3);border-radius:999px;font-family:Inter,Inter Fallback,sans-serif;font-size:.78rem;font-weight:600;color:var(--ink);margin-bottom:32px;box-shadow:var(--shadow-xs);height:auto;width:auto;line-height:1}
.page-hero-icon i{width:24px;height:24px;border-radius:50%;background:var(--ink);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:.7rem;margin:0}
.page-hero .bc{font-family:Inter,Inter Fallback,sans-serif;font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gray-6);margin-bottom:24px}
.page-hero .bc a{color:var(--gray-7);transition:color .15s var(--ease)}
.page-hero .bc a:hover{color:var(--ink)}
.page-hero .bc .sep{margin:0 10px;opacity:.4;color:var(--gray-5)}
.page-hero h1{font-family:Inter,Inter Fallback,sans-serif!important;font-size:clamp(2.8rem,6.4vw,5.5rem);font-weight:700;letter-spacing:-.045em;color:var(--ink);margin-bottom:28px;line-height:.98;max-width:1000px}
.page-hero h1 em{font-style:normal;font-weight:700;color:var(--ink);position:relative;display:inline-block}
.page-hero h1 em::after{content:'';position:absolute;bottom:.08em;left:0;right:0;height:.18em;background:var(--accent);z-index:-1;border-radius:2px;opacity:.85}
.page-hero .sub{font-size:1.2rem;color:var(--gray-7);max-width:660px;line-height:1.55;margin-bottom:40px;font-weight:400;letter-spacing:-.005em}
.hero-chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{background:#fff;border:1px solid var(--gray-3);border-radius:999px;padding:7px 14px;font-size:.8rem;font-weight:550;color:var(--ink);display:inline-flex;align-items:center;gap:7px;transition:border-color .2s var(--ease),box-shadow .2s var(--ease),transform .2s var(--ease)}
.chip:hover{border-color:var(--ink);box-shadow:var(--shadow);transform:translateY(-1px)}
.chip i{color:var(--accent);font-size:.72rem}
.chip.green{background:#fff;border-color:var(--gray-3);color:var(--ink)}
.chip.green i{color:var(--green)}
@media(max-width:768px){.page-hero{padding:80px 20px 80px;min-height:400px}.page-hero h1{font-size:clamp(2rem,8vw,3rem);letter-spacing:-.03em}}

/* ── GRIDS ── */
.g2{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media(max-width:1024px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.g2,.g3,.g4{grid-template-columns:1fr}}
/* labelled visual placeholders → intentional branded panels (not broken boxes) */
.img-ph{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;padding:32px;background:linear-gradient(150deg,#f0f7ff,#e6f3ff);border:1px dashed #bcd9ee;border-radius:16px;color:#5b7a9b;font:600 .9rem/1.5 'Inter','Inter Fallback',sans-serif}
.img-ph::before{content:"\f03e";font-family:"Font Awesome 6 Free";font-weight:900;font-size:1.7rem;color:#9cc4e4}
/* downloadable PDF cards (Technical Downloads) */
.dl-card{display:block;text-decoration:none;border-radius:var(--r2);transition:transform .18s var(--ease-out),box-shadow .18s}
.dl-card > div{transition:border-color .18s var(--ease-out)}
.dl-card:hover{transform:translateY(-2px)}
.dl-card:hover > div{border-color:var(--steel)!important;box-shadow:0 8px 20px rgba(15,23,42,.08)}
.dl-card > div::after{content:"\f019";font-family:"Font Awesome 6 Free";font-weight:900;color:var(--steel);font-size:.85rem;margin-left:auto;opacity:.5;transition:opacity .18s,transform .18s}
.dl-card:hover > div::after{opacity:1;transform:translateY(2px)}
/* gallery / case-study project tiles: empty .card-img photo areas → branded gradient tiles */
body.page-id-29 .card-img,body.page-id-20 .card-img{display:flex;align-items:flex-end;padding:16px 18px;min-height:200px;background:linear-gradient(150deg,#1a365d,#2b6cb0 75%,#0ea5e9);color:#fff;font:700 .92rem/1.3 'Inter','Inter Fallback',sans-serif;letter-spacing:-.01em;position:relative;overflow:hidden}
body.page-id-29 .card-img::before,body.page-id-20 .card-img::before{content:"\f03e";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;top:16px;right:18px;font-size:1.3rem;color:rgba(255,255,255,.35)}
body.page-id-29 .card-img::after,body.page-id-20 .card-img::after{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 80% 20%,rgba(255,255,255,.12),transparent 45%);pointer-events:none}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;gap:7px;padding:12px 24px;border-radius:var(--r2);font-family:Inter,Inter Fallback,sans-serif;font-weight:600;font-size:.88rem;cursor:pointer;transition:all .25s;border:none;text-decoration:none}
.btn-primary{background:var(--grad);color:#fff;box-shadow:0 2px 10px rgba(43,108,176,.2)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 24px rgba(43,108,176,.35);color:#fff}
.btn-outline{background:transparent;color:var(--navy);border:2px solid var(--navy)}
.btn-outline:hover{background:var(--navy);color:#fff;transform:translateY(-2px)}
.btn-white{background:#fff;color:var(--navy);box-shadow:var(--shadow)}
.btn-white:hover{transform:translateY(-2px);box-shadow:var(--shadow2);color:var(--navy)}
.btn-sm{padding:9px 18px;font-size:.82rem}
.csu-btn{display:inline-flex;align-items:center;gap:7px;padding:10px 22px;border-radius:22px;font-family:Inter,Inter Fallback,sans-serif;font-weight:700;font-size:.83rem;cursor:pointer;transition:all .25s;border:none;text-decoration:none;background:var(--grad);color:#fff;box-shadow:0 2px 10px rgba(43,108,176,.2)}
.csu-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(43,108,176,.4);color:#fff}

/* ── CARDS — Bold Premium (v2.3) ── */
.card{background:#fff;border-radius:var(--r-lg);overflow:hidden;transition:all .35s var(--ease-out);border:1px solid rgba(15,23,42,.06);box-shadow:var(--shadow-xs);padding:32px}
.card:hover{transform:translateY(-6px);box-shadow:0 24px 48px -12px rgba(15,23,42,.14);border-color:rgba(43,108,176,.16)}
.card-tag{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border-radius:999px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;background:var(--steel-50);color:var(--steel);margin-bottom:14px}
.card-title{font-family:Inter,Inter Fallback,sans-serif;font-size:1.1rem;font-weight:700;margin-bottom:8px;color:var(--dark);letter-spacing:-.01em}
.card-text{font-size:.9rem;color:var(--muted);line-height:1.7;margin-bottom:14px}
.card-link{font-size:.85rem;font-weight:700;color:var(--steel);display:inline-flex;align-items:center;gap:6px;transition:gap .25s var(--ease-out)}
.card-link:hover{gap:10px;color:var(--navy)}

/* ── FEATURE BOXES — Editorial (v3.0) ── */
.fbox{padding:32px;border-radius:var(--r-xl);background:#fff;border:1px solid var(--gray-3);transition:all .3s var(--ease-out);position:relative;overflow:hidden;box-shadow:var(--shadow-xs)}
.fbox::before{display:none}
.fbox::after{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,transparent 60%,rgba(0,112,243,.04));opacity:0;transition:opacity .3s var(--ease-out);pointer-events:none}
.fbox:hover{transform:translateY(-4px);border-color:var(--ink);box-shadow:var(--shadow-pop)}
.fbox:hover::after{opacity:1}
/* fbox with image thumbnail at top */
.fbox.fbox-img{padding:0;background:#fff}
.fbox.fbox-img .fbox-thumb{height:180px;background-size:cover;background-position:center;position:relative;overflow:hidden}
.fbox.fbox-img .fbox-thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(15,23,42,.45));transition:opacity .35s var(--ease-out)}
.fbox.fbox-img:hover .fbox-thumb{transform:scale(1.04)}
.fbox.fbox-img .fbox-thumb{transition:transform .55s var(--ease-out)}
.fbox.fbox-img .fbox-thumb .fbox-icon{position:absolute;bottom:14px;left:14px;z-index:2;margin:0;backdrop-filter:blur(12px);background:rgba(255,255,255,.92)!important}
.fbox.fbox-img .fbox-body{padding:24px 28px 28px}
.fbox.fbox-img .fbox-title{margin-bottom:8px}
.fbox::before{display:none}
.fbox:hover{transform:translateY(-6px);background:#fff;box-shadow:0 24px 48px -12px rgba(15,23,42,.15)}
.fbox-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:24px;font-size:1.1rem;background:var(--gray-1);color:var(--ink);border:1px solid var(--gray-3);transition:all .3s var(--ease-out)}
.fbox:hover .fbox-icon{background:var(--ink);color:#fff;border-color:var(--ink)}
.fbox-icon.navy,.fbox-icon.green,.fbox-icon.amber,.fbox-icon.red,.fbox-icon.purple{background:var(--gray-1);color:var(--ink)}
.fbox:hover .fbox-icon.navy,.fbox:hover .fbox-icon.green,.fbox:hover .fbox-icon.amber,.fbox:hover .fbox-icon.red,.fbox:hover .fbox-icon.purple{background:var(--ink);color:#fff}
.fbox-title{font-family:Inter,Inter Fallback,sans-serif;font-size:1.1rem;font-weight:600;margin-bottom:8px;color:var(--ink);letter-spacing:-.015em;line-height:1.3}
.fbox-text{font-size:.92rem;color:var(--gray-7);line-height:1.55}
.section-dark .fbox{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.08)}
.section-dark .fbox:hover{background:rgba(255,255,255,.07);border-color:rgba(167,139,250,.3);box-shadow:0 24px 48px -12px rgba(0,0,0,.4)}
.section-dark .fbox-icon.navy{background:linear-gradient(135deg,rgba(96,165,250,.18),rgba(167,139,250,.12));color:#a78bfa;border:1px solid rgba(167,139,250,.2)}
.section-dark .fbox-title{color:#fff}
.section-dark .fbox-text{color:rgba(255,255,255,.6)}

/* ── TABLES — Modern SaaS (v2.6) ── */
.tbl-wrap{overflow-x:auto;margin:24px 0;border-radius:var(--r-lg);border:1px solid rgba(15,23,42,.06);background:#fff;box-shadow:0 4px 20px rgba(15,23,42,.04);position:relative}
/* Right-edge shadow so a table that now genuinely scrolls (see the .tbl
   min-width fix above) doesn't look like it simply ends at the card border.
   An inset shadow rather than a white-fade gradient, since table cells are
   white and a white-to-white fade was invisible against them — the shadow
   reads as a scroll hint regardless of the cell background underneath. */
@media(max-width:768px){.tbl-wrap::after{content:'';position:absolute;top:0;right:0;bottom:0;width:16px;pointer-events:none;box-shadow:inset -10px 0 10px -8px rgba(15,23,42,.22);border-top-right-radius:var(--r-lg);border-bottom-right-radius:var(--r-lg)}}
.tbl{width:100%;border-collapse:collapse;font-size:.88rem}
.tbl th{background:linear-gradient(135deg,#f8fafc,#f1f5f9);color:var(--dark);padding:14px 18px;text-align:left;font-weight:700;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid rgba(15,23,42,.08)}
.tbl td{padding:13px 18px;border-bottom:1px solid rgba(15,23,42,.04);color:var(--text-soft);transition:background .15s var(--ease)}
.tbl tr:last-child td{border-bottom:none}
.tbl tr:hover td{background:rgba(43,108,176,.04)}
.tbl td:first-child{font-weight:700;color:var(--dark)}
/* .tbl-wrap already had overflow-x:auto, but .tbl{width:100%} meant the table
   always shrank to match the wrapper instead of ever exceeding it — so the
   scroll affordance never actually triggered, and 3-4 column tables with real
   sentence content just crammed each column into unreadable fragments at
   mobile widths instead of scrolling. min-width restores the overflow. */
@media(max-width:768px){.tbl{min-width:560px}}
.spec-tbl{border:1px solid rgba(15,23,42,.06);border-radius:var(--r-lg);overflow:hidden;margin:24px 0;background:#fff;box-shadow:0 4px 20px rgba(15,23,42,.04)}
.spec-row{display:flex;border-bottom:1px solid rgba(15,23,42,.05);font-size:.92rem;transition:background .15s var(--ease)}
.spec-row:last-child{border-bottom:none}
.spec-row:hover{background:rgba(43,108,176,.025)}
.spec-key{flex:0 0 240px;padding:16px 22px;font-weight:700;color:var(--dark);background:linear-gradient(135deg,#f8fafc,#f1f5f9);letter-spacing:-.005em;font-size:.85rem}
.spec-val{flex:1;padding:16px 22px;color:var(--text-soft);font-weight:500}
@media(max-width:640px){.spec-row{flex-direction:column}.spec-key{flex:none}}

/* ── STEPS — Editorial (v3.0) ── */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--gray-3);border-radius:var(--r-xl);background:#fff;overflow:hidden}
.step{padding:36px 28px;position:relative;transition:background .25s ease;border-right:1px solid var(--gray-3)}
.step:last-child{border-right:none}
.step:hover{background:var(--gray-1)}
.step:hover .step-num{background:#1a365d;color:#fff;border-color:#1a365d}
.step-num{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:50%;font-family:Inter,Inter Fallback,sans-serif;font-weight:700;font-size:.78rem;color:#1a365d;margin-bottom:20px;transition:all .2s ease;letter-spacing:-.02em}
.step h4,.step .step-h4{font-family:Inter,Inter Fallback,sans-serif;font-size:1.1rem;font-weight:600;color:var(--ink);margin-bottom:10px;letter-spacing:-.015em;margin-top:0}
.step p{font-size:.9rem;color:var(--gray-7);line-height:1.6}
@media(max-width:768px){.steps{grid-template-columns:1fr}.step{border-right:none;border-bottom:1px solid var(--gray-3)}.step:last-child{border-bottom:none}}

/* ── TESTIMONIALS — Editorial (v3.1) ── */
.tcard{background:#fff;border:1px solid var(--gray-3);border-radius:var(--r-xl);padding:32px;transition:all .3s ease-out;position:relative;border-top:3px solid #2b6cb0}
.tcard:hover{border-color:#2b6cb0;border-top-color:#2b6cb0;box-shadow:0 12px 40px rgba(43,108,176,.12);transform:translateY(-4px)}
.tcard-stars{color:#f59e0b;font-size:.9rem;margin-bottom:16px;letter-spacing:2px;font-weight:700}
.tcard-quote{font-family:Inter,Inter Fallback,sans-serif;font-size:1rem;color:var(--ink);line-height:1.65;font-style:normal;margin-bottom:24px;font-weight:400;letter-spacing:-.01em}
.tcard-quote::before{display:none}
.tcard-author{font-size:.82rem;color:var(--gray-7);font-weight:600;padding-top:16px;border-top:1px solid var(--gray-3);letter-spacing:-.005em}

/* ── FAQ — Modern SaaS (v2.6) ── */
.faq-list{display:flex;flex-direction:column;gap:8px}
.faq-item{border:1px solid rgba(15,23,42,.06);background:#fff;border-radius:var(--r-lg);overflow:hidden;transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}
.faq-item:hover{border-color:rgba(43,108,176,.16);box-shadow:0 4px 16px rgba(15,23,42,.04)}
.faq-item.open{border-color:rgba(43,108,176,.28);box-shadow:0 8px 24px rgba(43,108,176,.08)}
.faq-q{width:100%;background:none;border:none;text-align:left;padding:20px 24px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;font-family:Inter,Inter Fallback,sans-serif;font-size:.95rem;font-weight:600;color:var(--dark);transition:color .2s var(--ease);letter-spacing:-.005em}
.faq-q:hover{color:var(--steel)}
.faq-q .arrow{color:var(--steel);font-size:.85rem;transition:transform .35s var(--ease-out);flex-shrink:0;width:32px;height:32px;border-radius:50%;background:var(--bg2);display:flex;align-items:center;justify-content:center}
.faq-item.open .faq-q{color:var(--steel)}
.faq-item.open .faq-q .arrow{transform:rotate(180deg);background:var(--steel-50);color:var(--navy)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s var(--ease-out)}
.faq-item.open .faq-a{max-height:600px}
.faq-a-inner{padding:0 24px 22px;font-size:.92rem;color:var(--muted);line-height:1.75}

/* ── INFO BOXES — Modern SaaS (v2.6) ── */
.info-box{padding:22px 26px;border-radius:var(--r-lg);margin:24px 0;font-size:.92rem;line-height:1.7;position:relative;border:1px solid transparent;transition:transform .25s var(--ease-out),box-shadow .25s var(--ease-out)}
.info-box::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;border-radius:var(--r-lg) 0 0 var(--r-lg)}
.info-box:hover{transform:translateX(2px)}
.info-box.blue{background:linear-gradient(135deg,#eff6ff,#dbeafe);color:#1e3a8a;border-color:rgba(43,108,176,.15)}
.info-box.blue::before{background:linear-gradient(180deg,#3b82f6,#1e40af)}
.info-box.green{background:linear-gradient(135deg,#f0fdf4,#dcfce7);color:#14532d;border-color:rgba(34,197,94,.15)}
.info-box.green::before{background:linear-gradient(180deg,#22c55e,#15803d)}
.info-box.amber{background:linear-gradient(135deg,#fefce8,#fef3c7);color:#713f12;border-color:rgba(217,119,6,.15)}
.info-box.amber::before{background:linear-gradient(180deg,#f59e0b,#b45309)}
.info-box.red{background:linear-gradient(135deg,#fef2f2,#fee2e2);color:#7f1d1d;border-color:rgba(239,68,68,.15)}
.info-box.red::before{background:linear-gradient(180deg,#ef4444,#b91c1c)}
.info-box h4{font-family:Inter,Inter Fallback,sans-serif;font-size:1rem;font-weight:700;margin-bottom:6px;letter-spacing:-.01em}

/* ── STATS BAR ── */
.stats-bar{background:#fff;border-bottom:1px solid var(--bdr);box-shadow:0 2px 8px rgba(0,0,0,.04)}
.stats-inner{max-width:1400px;margin:0 auto;padding:16px 48px;display:flex;gap:36px;flex-wrap:wrap;align-items:center;justify-content:center}
.stat{display:flex;align-items:center;gap:10px}
.stat-icon{color:var(--steel);font-size:1.1rem}
.stat-num{font-size:1.2rem;font-weight:800;font-family:Inter,Inter Fallback,sans-serif;color:var(--dark);line-height:1}
.stat-label{font-size:.72rem;color:var(--muted)}

/* ── SCROLL ANIMATIONS (v2.9 — safe defaults, content always visible) ── */
@media(prefers-reduced-motion:reduce){.csu-animate,.csu-anim-l,.csu-anim-r,.csu-anim-scale,.csu-anim-blur{transition:none!important;animation:none!important;opacity:1!important;transform:none!important;filter:none!important}}
/* Only hide when body has csu-js-ready (JS confirmed) AND not yet visible */
body:not(.csu-js-ready) .csu-animate,
body:not(.csu-js-ready) .csu-anim-l,
body:not(.csu-js-ready) .csu-anim-r,
body:not(.csu-js-ready) .csu-anim-scale,
body:not(.csu-js-ready) .csu-anim-blur{opacity:1!important;transform:none!important;filter:none!important}
body.csu-js-ready .csu-animate{opacity:0;transform:translateY(28px);transition:opacity .65s var(--ease-out),transform .65s var(--ease-out)}
body.csu-js-ready .csu-anim-l{opacity:0;transform:translateX(-36px);transition:opacity .65s var(--ease-out),transform .65s var(--ease-out)}
body.csu-js-ready .csu-anim-r{opacity:0;transform:translateX(36px);transition:opacity .65s var(--ease-out),transform .65s var(--ease-out)}
body.csu-js-ready .csu-anim-scale{opacity:0;transform:scale(.94);transition:opacity .6s var(--ease-out),transform .6s var(--ease-out)}
body.csu-js-ready .csu-anim-blur{opacity:0;filter:blur(10px);transform:translateY(18px);transition:opacity .65s var(--ease-out),transform .65s var(--ease-out),filter .65s var(--ease-out)}
.csu-animate.visible,.csu-anim-l.visible,.csu-anim-r.visible,.csu-anim-scale.visible,.csu-anim-blur.visible{opacity:1!important;transform:none!important;filter:none!important}
/* stagger delays */
.csu-d1{transition-delay:.06s!important}.csu-d2{transition-delay:.12s!important}.csu-d3{transition-delay:.18s!important}
.csu-d4{transition-delay:.24s!important}.csu-d5{transition-delay:.30s!important}.csu-d6{transition-delay:.36s!important}
.csu-d7{transition-delay:.42s!important}.csu-d8{transition-delay:.48s!important}.csu-d9{transition-delay:.54s!important}
.csu-d10{transition-delay:.60s!important}.csu-d11{transition-delay:.66s!important}.csu-d12{transition-delay:.72s!important}

/* ── HERO entrance — fires on page load ── */
@media(prefers-reduced-motion:no-preference){
  .page-hero .page-hero-icon{animation:csu-rise .7s var(--ease-out) .05s both}
  .page-hero .bc{animation:csu-rise .7s var(--ease-out) .15s both}
  .page-hero h1{animation:csu-rise .8s var(--ease-out) .25s both}
  .page-hero .sub{animation:csu-rise .8s var(--ease-out) .4s both}
  .page-hero .hero-chips{animation:csu-rise .8s var(--ease-out) .55s both}
  .page-hero .hero-chips .chip{animation:csu-rise-chip .6s var(--ease-out) both}
  .page-hero .hero-chips .chip:nth-child(1){animation-delay:.65s}
  .page-hero .hero-chips .chip:nth-child(2){animation-delay:.72s}
  .page-hero .hero-chips .chip:nth-child(3){animation-delay:.79s}
  .page-hero .hero-chips .chip:nth-child(4){animation-delay:.86s}
  .page-hero .hero-chips .chip:nth-child(5){animation-delay:.93s}
}
@keyframes csu-rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes csu-rise-chip{from{opacity:0;transform:translateY(8px) scale(.94)}to{opacity:1;transform:none}}
@keyframes csu-fade{from{opacity:0}to{opacity:1}}
@keyframes csu-slide-r{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}

/* ══════════ SCROLL REVEAL (GPU-only, observer-driven) ══════════ */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.reveal.in{opacity:1;transform:translateY(0)}
.reveal-l{opacity:0;transform:translateX(-40px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)}
.reveal-l.in{opacity:1;transform:translateX(0)}
.reveal-r{opacity:0;transform:translateX(40px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)}
.reveal-r.in{opacity:1;transform:translateX(0)}
.reveal-scale{opacity:0;transform:scale(.92);transition:opacity .6s ease-out,transform .6s cubic-bezier(.16,1,.3,1)}
.reveal-scale.in{opacity:1;transform:scale(1)}
/* Stagger delays — 8 children */
.reveal-stagger>*{opacity:0;transform:translateY(24px);transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1)}
.reveal-stagger.in>*{opacity:1;transform:translateY(0)}
.reveal-stagger.in>*:nth-child(1){transition-delay:0s}
.reveal-stagger.in>*:nth-child(2){transition-delay:.06s}
.reveal-stagger.in>*:nth-child(3){transition-delay:.12s}
.reveal-stagger.in>*:nth-child(4){transition-delay:.18s}
.reveal-stagger.in>*:nth-child(5){transition-delay:.24s}
.reveal-stagger.in>*:nth-child(6){transition-delay:.3s}
.reveal-stagger.in>*:nth-child(7){transition-delay:.36s}
.reveal-stagger.in>*:nth-child(8){transition-delay:.42s}
.reveal-stagger.in>*:nth-child(9){transition-delay:.48s}
.reveal-stagger.in>*:nth-child(10){transition-delay:.54s}
.reveal-stagger.in>*:nth-child(11){transition-delay:.6s}
.reveal-stagger.in>*:nth-child(12){transition-delay:.66s}
.reveal-stagger.in>*:nth-child(13){transition-delay:.72s}
.reveal-stagger.in>*:nth-child(14){transition-delay:.78s}
.reveal-stagger.in>*:nth-child(15){transition-delay:.84s}
/* Reduced motion override */
@media(prefers-reduced-motion:reduce){
  .reveal,.reveal-l,.reveal-r,.reveal-scale,.reveal-stagger>*{opacity:1!important;transform:none!important;transition:none!important}
}

/* ══════════ CARD TILT HOVER ══════════ */
.prod-card{transform-style:preserve-3d;will-change:transform}
.prod-card:hover{transform:translateY(-3px) perspective(800px) rotateX(2deg)}

/* ══════════ ANIMATED COUNT-UP ══════════ */
.count-up{display:inline-block;font-variant-numeric:tabular-nums}

/* ══════════ KPI HOVER GLOW ══════════ */
.kpi-cell{cursor:default;overflow:hidden}
.kpi-cell::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(96,165,250,.18),transparent 50%);opacity:0;transition:opacity .3s;pointer-events:none}
.kpi-cell:hover::before{opacity:1}

/* ══════════ PROD-CARD shimmer sweep on hover ══════════ */
.prod-card::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(105deg,transparent 40%,rgba(96,165,250,.08) 50%,transparent 60%);transition:left .8s ease;pointer-events:none}
.prod-card:hover::after{left:100%}

/* ══════════ EYEBROW pulse dot ══════════ */
.eyebrow i{animation:csu-soft-pulse 2.4s ease-in-out infinite}

/* ── Gradient text shimmer on .sh em ── */
@media(prefers-reduced-motion:no-preference){
  .sh em{background-size:200% auto;animation:csu-shimmer 6s linear infinite}
  .page-hero h1 em{background-size:200% auto;animation:csu-shimmer 8s linear infinite}
}
@keyframes csu-shimmer{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}

/* ── Floating decorations on hero ── */
@media(prefers-reduced-motion:no-preference){
  .page-hero::before{animation:csu-float-slow 18s ease-in-out infinite}
}
@keyframes csu-float-slow{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-12px) scale(1.02)}}

/* ── Component hover micro-animations ── */
.csuh-gc:hover{transform:translateY(-5px)!important;box-shadow:0 14px 44px rgba(26,54,93,.15)!important}
.csuh-rv{transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.csuh-rv:hover{transform:translateY(-4px)!important;box-shadow:0 12px 40px rgba(0,0,0,.25)!important}
.csuh-step{transition:transform .25s var(--ease),box-shadow .25s var(--ease)!important}
.csuh-step:hover{transform:translateY(-4px)!important;box-shadow:0 8px 32px rgba(26,54,93,.12)!important}

/* ── Button hover ripple ── */
.btn,.csu-btn,.csu-hdr-cta,.btn-primary,.btn-outline,.btn-white{position:relative;overflow:hidden}
.btn::after,.csu-btn::after,.btn-primary::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at center,rgba(255,255,255,.4),transparent 60%);transform:scale(0);opacity:0;transition:transform .55s var(--ease-out),opacity .35s}
.btn:active::after,.csu-btn:active::after,.btn-primary:active::after{transform:scale(2);opacity:.8;transition:transform 0s,opacity 0s}

/* ── Card lift smoother — already defined but add subtle scale on hero chips ── */
.chip{will-change:transform}

/* ── Link underline reveal ── */
.card-link,.csu-drop-link{position:relative}

/* ── Stat number count-up state ── */
.csuh-stat-num,.fbox .num,.stat-num{font-variant-numeric:tabular-nums}

/* ── Pulse for green status dots ── */
@media(prefers-reduced-motion:no-preference){
  .csu-tbar .badge i,.csu-trust-item i{animation:csu-soft-pulse 2.4s ease-in-out infinite}
}
@keyframes csu-soft-pulse{0%,100%{opacity:.95}50%{opacity:.55}}

/* ── Footer link gradient hover bar ── */
.csu-footer h4{position:relative}

/* ── Header subtle shadow grow on scroll already handled in JS ── */


/* ── CONTAINER ── */
.container{max-width:1400px;margin:0 auto;padding:0 24px}

/* ── RESPONSIVE ── */
@media(max-width:1024px){.csu-nav,.csu-nav-right .csu-hdr-cta{display:none!important}.csu-ham{display:block!important}}
@media(max-width:768px){.section{padding:48px 16px}.steps{grid-template-columns:1fr}.csu-tbar{display:none}}
@media(max-width:480px){.section{padding:32px 16px}}

/* ═══════════════════════════════════════════════
   V3 NEW COMPONENTS — Brand strip, Bento, Marquee, KPI strip
═══════════════════════════════════════════════ */

/* ── BRAND STRIP — supplier logos marquee ── */
.brand-strip{background:linear-gradient(135deg,#0a1628 0%,#1a365d 100%);border:none;padding:32px 0;position:relative;overflow:hidden}
.brand-strip::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:48px 48px;pointer-events:none}
.brand-strip-label{text-align:center;font-family:Inter,Inter Fallback,sans-serif;font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.35);margin-bottom:20px;position:relative;z-index:1}
.brand-marquee{display:flex;align-items:center;gap:72px;animation:csu-marquee 36s linear infinite;width:max-content;position:relative;z-index:1}
.brand-strip:hover .brand-marquee{animation-play-state:paused}
.brand-item{font-family:Inter,Inter Fallback,sans-serif;font-size:1.3rem;font-weight:700;color:rgba(255,255,255,.35);letter-spacing:-.02em;white-space:nowrap;transition:color .2s ease}
.brand-item:hover{color:rgba(255,255,255,.85)}
.brand-item small{font-size:.65rem;font-weight:700;color:rgba(255,255,255,.25);letter-spacing:.08em;text-transform:uppercase;margin-left:5px;vertical-align:middle}
@keyframes csu-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.brand-marquee{animation:none}}

/* ── BENTO GRID — asymmetric product grid ── */
/* ── PRODUCT GRID — clean 3-column uniform layout (all-spans for wpautop safety) ── */
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.prod-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:28px;text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:14px;transition:all .25s ease;position:relative;overflow:hidden}
.prod-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#2b6cb0,#6366f1);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.prod-card:hover{border-color:#1a365d;box-shadow:0 12px 32px rgba(15,23,42,.08);transform:translateY(-3px)}
.prod-card:hover::before{transform:scaleX(1)}
.prod-card .prod-icon{display:flex;width:44px;height:44px;border-radius:11px;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;transition:transform .25s ease}
.prod-card:hover .prod-icon{transform:scale(1.08)}
.prod-card .prod-tag{display:block;font-family:Inter,Inter Fallback,sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#64748b}
.prod-card .prod-title{display:block;font-family:Inter,Inter Fallback,sans-serif;font-size:1.15rem;font-weight:700;color:#0f172a;letter-spacing:-.02em;line-height:1.25;margin:0}
.prod-card .prod-desc{display:block;font-family:Inter,Inter Fallback,sans-serif;font-size:.88rem;color:#64748b;line-height:1.55;margin:0;flex:1}
.prod-card .prod-arrow{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#f1f5f9;color:#0f172a;font-size:.78rem;transition:all .25s ease;margin-top:auto;align-self:flex-start}
.prod-card:hover .prod-arrow{background:#1a365d;color:#fff;transform:translateX(4px)}
@media(max-width:1024px){.prod-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.prod-grid{grid-template-columns:1fr}}

.bento{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:minmax(220px,auto);gap:16px}
.bento-card{background:#fff;border:1px solid var(--gray-3);border-radius:var(--r-xl);padding:32px;position:relative;overflow:hidden;transition:all .3s var(--ease-out);text-decoration:none;color:inherit;display:flex;flex-direction:column;justify-content:space-between}
.bento-card:hover{border-color:var(--ink);box-shadow:var(--shadow-pop);transform:translateY(-4px)}
.bento-card-hero{grid-column:span 4;grid-row:span 2;background:var(--ink);color:#fff;padding:48px;justify-content:space-between}
.bento-card-hero:hover{border-color:var(--ink);background:#171717}
.bento-card-half{grid-column:span 2}
.bento-card-third{grid-column:span 2;grid-row:span 1}
.bento-card-wide{grid-column:span 3}
.bento-card-img{padding:0;overflow:hidden}
.bento-card-img .bento-img{height:100%;background-size:cover;background-position:center;border-radius:inherit;transition:transform .55s var(--ease-out)}
.bento-card-img:hover .bento-img{transform:scale(1.06)}
.bento-card-img .bento-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.75));border-radius:inherit;padding:28px;display:flex;flex-direction:column;justify-content:flex-end;color:#fff}
.bento-tag{display:inline-flex;align-items:center;gap:6px;font-family:Inter,Inter Fallback,sans-serif;font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--gray-6);margin-bottom:18px}
.bento-card-hero .bento-tag,.bento-card-img .bento-tag{color:rgba(255,255,255,.6)}
.bento-tag i{font-size:.62rem;color:var(--accent)}
.bento-title{font-family:Inter,Inter Fallback,sans-serif;font-size:1.6rem;font-weight:600;color:var(--ink);letter-spacing:-.025em;line-height:1.15;margin-bottom:10px}
.bento-card-hero .bento-title{font-size:2.2rem;color:#fff;font-weight:600;letter-spacing:-.03em;line-height:1.05;max-width:480px}
.bento-card-hero .bento-title em{color:var(--accent-2);font-style:normal}
.bento-card-img .bento-title{color:#fff;font-size:1.4rem}
.bento-text{font-size:.92rem;color:var(--gray-7);line-height:1.55;margin-bottom:0}
.bento-card-hero .bento-text,.bento-card-img .bento-text{color:rgba(255,255,255,.75)}
.bento-arrow{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--gray-2);color:var(--ink);font-size:.85rem;transition:all .25s var(--ease-out);align-self:flex-start;margin-top:16px}
.bento-card-hero .bento-arrow,.bento-card-img .bento-arrow{background:rgba(255,255,255,.1);color:#fff;backdrop-filter:blur(20px)}
.bento-card:hover .bento-arrow{background:var(--ink);color:#fff;transform:rotate(-45deg)}
.bento-card-hero:hover .bento-arrow{background:var(--accent);transform:rotate(-45deg)}
.bento-card-img:hover .bento-arrow{background:#fff;color:var(--ink);transform:rotate(-45deg)}
@media(max-width:1024px){.bento{grid-template-columns:repeat(2,1fr)}.bento-card-hero,.bento-card-half,.bento-card-third,.bento-card-wide{grid-column:span 2;grid-row:auto}}

/* ── KPI BAR — dark stats strip ── */
.kpi-bar{background:linear-gradient(135deg,#0a1628 0%,#1a365d 100%);border:none;padding:0;position:relative;overflow:hidden}
.kpi-bar::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:48px 48px;pointer-events:none}
.kpi-bar-inner{width:100%;padding:0 60px;box-sizing:border-box;display:grid;grid-template-columns:repeat(4,1fr);position:relative;z-index:1}
.kpi-cell{padding:44px 32px;border-right:1px solid rgba(255,255,255,.08);position:relative;transition:background .2s ease}
.kpi-cell:last-child{border-right:none}
.kpi-cell:hover{background:rgba(255,255,255,.05)}
.kpi-val{font-family:Inter,Inter Fallback,sans-serif;font-size:clamp(2.2rem,3.6vw,3.2rem);font-weight:700;color:#fff;letter-spacing:-.035em;line-height:1;margin-bottom:10px}
.kpi-val sup{font-size:.5em;color:#60a5fa;font-weight:600;letter-spacing:0;margin-left:2px;top:-.5em}
.kpi-val small{font-size:.5em;font-weight:500;color:rgba(255,255,255,.5);letter-spacing:-.02em}
.kpi-label{font-family:Inter,Inter Fallback,sans-serif;font-size:.78rem;font-weight:550;color:rgba(255,255,255,.55);letter-spacing:.02em;text-transform:uppercase}
@media(max-width:768px){.kpi-bar-inner{grid-template-columns:repeat(2,1fr)}.kpi-cell{padding:32px 24px;border-bottom:1px solid rgba(255,255,255,.08)}.kpi-cell:nth-child(even){border-right:none}}

/* ═══════════════════════════════════════════════
   HOMEPAGE SLIDER — v2.8 (rebuilt for imported home.html)
═══════════════════════════════════════════════ */
.hero-slider{position:relative;min-height:680px;overflow:hidden;background:linear-gradient(135deg,#0a1628 0%,#1a365d 55%,#0f2347 100%);border-bottom:none}
.hero-slider::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:80px 80px;pointer-events:none;z-index:1}
.hero-slider::after{content:'';position:absolute;top:-150px;right:-100px;width:700px;height:700px;background:radial-gradient(circle,rgba(59,130,246,.18),transparent 65%);pointer-events:none;z-index:1}
/* Slider crossfade — SINGLE coherent mechanism (holistic fix 2026-07-08).
   OPACITY-ONLY crossfade, driven solely by the .active class. Every slide stays
   rendered (NO visibility:hidden, NO transition:0s hack) — both were freeze hazards:
   transitioning opacity while a slide is un-hidden (visibility hidden->visible), or
   while leaving a 0s-duration state, makes Chrome skip the transition and freeze
   opacity at its start value, so slides accumulated at opacity 1. An opacity+z-index
   transition between two always-rendered elements is rock-solid and never freezes.
   Inactive: opacity 0, z-index 1, pointer-events none (can't be seen or clicked),
   position absolute (out of flow). Active: opacity 1, z-index 2 (on top),
   position relative (its content defines the slider height). */
.slide{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:60px 32px;opacity:0;z-index:1;pointer-events:none;transition:opacity .55s ease-out}
.slide.active{opacity:1;z-index:2;pointer-events:auto;position:relative;inset:auto}
.slide-bg,.slide-overlay{display:none}
.slide-content{max-width:1100px;margin:0 auto;text-align:center;position:relative;z-index:2}
.slide-tag{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:999px;font-family:Inter,Inter Fallback,sans-serif;font-size:.78rem;font-weight:600;color:rgba(255,255,255,.9);margin-bottom:32px;letter-spacing:-.005em}
.slide-tag::before{content:'';width:8px;height:8px;background:#60a5fa;border-radius:50%;display:inline-block;box-shadow:0 0 12px rgba(96,165,250,.6);animation:csu-soft-pulse 2s infinite}
.slide-content h1,.slide-content h2.slide-h1{font-family:Inter,Inter Fallback,sans-serif!important;font-size:clamp(2.8rem,6.4vw,5.5rem);font-weight:700;letter-spacing:-.045em;color:#fff;margin:0 0 28px;line-height:.98;max-width:1000px;margin-left:auto;margin-right:auto}
.slide-content h1 em,.slide-content h2.slide-h1 em{font-style:normal;font-weight:700;color:#fff;position:relative;display:inline-block;animation:none;background:none;-webkit-background-clip:initial;background-clip:initial}
.slide-content h1 em::after,.slide-content h2.slide-h1 em::after{content:'';position:absolute;bottom:.08em;left:0;right:0;height:.18em;background:#3b82f6;z-index:-1;border-radius:2px;opacity:.85}
.slide-content p{font-size:1.22rem;color:rgba(255,255,255,.75);line-height:1.5;max-width:680px;margin:0 auto 40px;font-weight:400;letter-spacing:-.005em}
.slide-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:40px}
.slide-btns .btn-primary{background:#3b82f6!important;color:#fff!important;padding:14px 24px!important;border-radius:10px!important;font-weight:600!important;font-size:.95rem;letter-spacing:-.005em;box-shadow:0 4px 20px rgba(59,130,246,.4);transition:transform .2s ease-out,box-shadow .2s ease-out!important;border:1px solid #3b82f6!important}
.slide-btns .btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(59,130,246,.5);color:#fff!important}
.slide-btns .btn-white{background:rgba(255,255,255,.1)!important;color:#fff!important;border:1px solid rgba(255,255,255,.25)!important;padding:14px 24px!important;border-radius:10px!important;font-weight:600!important;font-size:.95rem;letter-spacing:-.005em;transition:all .2s ease-out!important;backdrop-filter:blur(8px)}
.slide-btns .btn-white:hover{background:rgba(255,255,255,.18)!important;border-color:rgba(255,255,255,.4)!important;transform:translateY(-2px);color:#fff!important}
.slide-chips{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.slide-chips .chip{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.9);padding:7px 14px;border-radius:999px;font-size:.8rem;font-weight:550}
/* Slider nav dots */
.slider-dots{position:absolute;bottom:32px;left:50%;transform:translateX(-50%);display:flex;gap:0;z-index:3}
/* 24px+ hit area for tap-target accessibility; visual dot drawn via ::after */
.slider-dot{width:24px;height:24px;border-radius:50%;background:transparent;border:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center}
.slider-dot::after{content:'';width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.3);transition:all .25s ease-out}
.slider-dot.active{width:36px}
.slider-dot.active::after{width:28px;border-radius:999px;background:linear-gradient(135deg,#2b6cb0,#6366f1)}
.slider-dot:hover::after{background:rgba(255,255,255,.6)}
.slider-dot.active:hover::after{background:linear-gradient(135deg,#2b6cb0,#6366f1)}
/* Slider arrows */
.slider-arrow{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.7);backdrop-filter:blur(20px);border:1px solid rgba(15,23,42,.08);box-shadow:0 4px 16px rgba(15,23,42,.08);color:#0f172a;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:3;transition:all .25s var(--ease-out)}
.slider-arrow:hover{background:#fff;transform:translateY(-50%) scale(1.08);box-shadow:0 8px 24px rgba(15,23,42,.15)}
.slider-arrow-l{left:24px}
.slider-arrow-r{right:24px}
@media(max-width:768px){.hero-slider{min-height:520px}.slider-arrow{display:none}.slide{padding:40px 20px}.slide-content p{font-size:1rem}}

/* Raw inline 2-column grids (homepage sections built as one-off HTML, not a
   component class) have no responsive companion of their own — attribute
   selectors catch them by their literal inline style value so this is a
   single global fix rather than editing page content. Confirmed via a DB
   scan that these exact literal values only occur on the homepage; other
   pages' grids already use repeat(auto-fill,minmax()) or a min-width-scoped
   override and self-collapse safely, so this rule can't affect them. */
@media(max-width:768px){
  div[style*="grid-template-columns:1.2fr 1fr"],
  div[style*="grid-template-columns:1fr 1.4fr"],
  div[style*="grid-template-columns:1fr 1fr"]{
    grid-template-columns:1fr!important;
  }
}

/* ══════════ CASE STUDIES CAROUSEL — v3.1 ══════════ */
/* Own namespace (.case-*) — must NOT reuse .slide/.slider or the hero slider JS hijacks it */
.case-carousel{position:relative;max-width:1320px;margin:0 auto}
.case-track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;padding:4px;scrollbar-width:none}
.case-track::-webkit-scrollbar{display:none}
.case-card{flex:0 0 calc((100% - 48px)/3);scroll-snap-align:start;background:#fff;border:1px solid var(--gray-3);border-radius:var(--r-xl);overflow:hidden;display:flex;flex-direction:column;box-shadow:0 1px 3px rgba(15,23,42,.06);transition:transform .25s var(--ease-out),box-shadow .25s var(--ease-out)}
.case-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-pop)}
.case-card-img{position:relative;aspect-ratio:16/10;background:var(--gray-2,#eef1f5) center/cover no-repeat}
.case-tag{position:absolute;top:14px;left:14px;background:rgba(10,10,10,.78);color:#fff;font-family:Inter,Inter Fallback,sans-serif;font-size:.74rem;font-weight:600;padding:6px 12px;border-radius:999px;letter-spacing:-.005em;backdrop-filter:blur(6px)}
.case-body{padding:24px;display:flex;flex-direction:column;gap:14px;flex:1}
.case-title{font-family:Inter,Inter Fallback,sans-serif;font-size:1.15rem;font-weight:600;color:var(--ink);letter-spacing:-.02em;line-height:1.25;margin:0}
.case-stats{display:flex;gap:18px;border-top:1px solid var(--gray-3);border-bottom:1px solid var(--gray-3);padding:14px 0;margin-top:auto}
.case-stats span{display:flex;flex-direction:column;font-size:.72rem;color:var(--gray-7);text-transform:uppercase;letter-spacing:.05em}
.case-stats strong{font-size:1.1rem;color:var(--ink);font-weight:600;letter-spacing:-.02em;text-transform:none;margin-bottom:2px}
.case-outcome{font-size:.9rem;color:var(--gray-7);line-height:1.5;margin:0}
.case-dots{display:flex;gap:0;justify-content:center;margin-top:32px}
.case-dot{width:24px;height:24px;border-radius:50%;background:transparent;border:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center}
.case-dot::after{content:'';width:8px;height:8px;border-radius:50%;background:var(--gray-3);transition:all .25s var(--ease-out)}
.case-dot.active{width:36px}
.case-dot.active::after{width:28px;border-radius:999px;background:linear-gradient(135deg,#2b6cb0,#6366f1)}
.case-arrow{position:absolute;top:38%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.92);border:1px solid var(--gray-3);box-shadow:var(--shadow-pop);color:var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:3;transition:all .25s var(--ease-out)}
.case-arrow:hover{background:#fff;transform:translateY(-50%) scale(1.08)}
.case-arrow-l{left:-20px}.case-arrow-r{right:-20px}
@media(max-width:1024px){.case-card{flex:0 0 calc((100% - 24px)/2)}}
@media(max-width:680px){.case-card{flex:0 0 88%}.case-arrow{display:none}}

/* ════════════════════════════════════════════════════════════
   HOMEPAGE REDESIGN — "D3·3 Light Glass" (scoped to page-id-34)
   Restyle only; content unchanged. Other pages unaffected.
   ════════════════════════════════════════════════════════════ */
body.page-id-34{
  --csu-glass-bg:linear-gradient(160deg,#f0f7ff 0%,#e6f3ff 55%,#dbeafe 100%);
  --csu-band:linear-gradient(135deg,#0a1f44,#103a8a);
}
/* HERO: dark slider → light glass */
body.page-id-34 .hero-slider{background:var(--csu-glass-bg)!important;border-bottom:1px solid #dbeafe}
body.page-id-34 .hero-slider::before{background-image:linear-gradient(rgba(14,165,233,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(14,165,233,.05) 1px,transparent 1px)}
body.page-id-34 .hero-slider::after{background:radial-gradient(circle,rgba(14,165,233,.22),transparent 65%)}
body.page-id-34 .slide-content h1,.slide-content h2.slide-h1{color:var(--ink)!important;font-family:Inter,Inter Fallback,sans-serif!important}
body.page-id-34 .slide-content h1 em,.slide-content h2.slide-h1 em{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#1e40af}
body.page-id-34 .slide-content h1 em::after,.slide-content h2.slide-h1 em::after{display:none}
body.page-id-34 .slide-content p{color:#475569!important}
body.page-id-34 .slide-tag{background:rgba(255,255,255,.72);border:1px solid rgba(14,165,233,.25);color:#0369a1;backdrop-filter:blur(8px)}
body.page-id-34 .slide-tag::before{background:#0ea5e9}
body.page-id-34 .slide-chips .chip{background:rgba(255,255,255,.7);border:1px solid #cbd5e1;color:#475569}
body.page-id-34 .slide-btns .btn-white{background:rgba(255,255,255,.8)!important;color:#0f172a!important;border:1px solid #cbd5e1!important;backdrop-filter:blur(8px)}
body.page-id-34 .slide-btns .btn-primary{background:var(--grad)!important;border:none!important;box-shadow:0 8px 24px rgba(14,165,233,.32)}
body.page-id-34 .slider-arrow{background:rgba(255,255,255,.85);color:#0f172a}
body.page-id-34 .slider-dot.active{background:var(--grad)}
/* ══════════ TOUGHGLAZE-INSPIRED IRIDESCENT ACCENTS (homepage, light theme) ══════════ */
/* hero: rainbow glass-dispersion glow (replaces the plain cyan radial), slowly shifting */
body.page-id-34 .hero-slider::after{
  top:-240px;right:-180px;width:860px;height:860px;
  background:conic-gradient(from 200deg at 68% 22%,#38bdf8,#818cf8,#c084fc,#f472b6,#fbbf24,#34d399,#38bdf8)!important;
  filter:blur(80px);opacity:.24;animation:csuIriShift 20s linear infinite;
}
/* second, smaller iridescent flare bottom-left for balance */
body.page-id-34 .hero-slider{position:relative}
body.page-id-34 .slide::after{content:'';position:absolute;left:-120px;bottom:-140px;width:420px;height:420px;
  background:conic-gradient(from 20deg,#22d3ee,#a78bfa,#f472b6,#22d3ee);filter:blur(72px);opacity:.12;
  pointer-events:none;z-index:0;animation:csuIriShift 26s linear infinite reverse}
@keyframes csuIriShift{to{filter:blur(75px) hue-rotate(360deg)}}
/* chromatic CTA — shifting blue→cyan→violet sheen */
body.page-id-34 .btn-primary,body.page-id-34 .slide-btns .btn-primary{
  background:linear-gradient(90deg,#1e40af,#0ea5e9,#6366f1,#0ea5e9,#1e40af)!important;
  background-size:220% 100%!important;border:none!important;
  animation:csuBtnIri 7s linear infinite;
}
body.page-id-34 .btn-primary:hover,body.page-id-34 .slide-btns .btn-primary:hover{
  animation-duration:2.5s;box-shadow:0 10px 30px rgba(124,58,237,.35)!important;
}
@keyframes csuBtnIri{to{background-position:220% 0}}
/* iridescent hairline divider at the top of alternating sections */
body.page-id-34 .section{position:relative}
body.page-id-34 .section + .section::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:min(1240px,88%);height:2px;border-radius:2px;
  background:linear-gradient(90deg,transparent,#38bdf8,#818cf8,#c084fc,#f472b6,#22d3ee,transparent);opacity:.3}
/* eyebrow / trust chips get a subtle iridescent ring */
body.page-id-34 .eyebrow{background:linear-gradient(#fff,#fff) padding-box,linear-gradient(90deg,#38bdf8,#818cf8,#c084fc,#f472b6) border-box;border:1px solid transparent}
@media(prefers-reduced-motion:reduce){
  body.page-id-34 .hero-slider::after,body.page-id-34 .slide::after,
  body.page-id-34 .btn-primary,body.page-id-34 .slide-btns .btn-primary{animation:none!important}
}
/* ── iridescent roll-out to the rest of the site ── */
/* hero glass-dispersion glow on all page-hero heroes (content, calc, tabbed) */
.csu-ds-page .page-hero::after,
body.page-id-32 .page-hero::after,
body.page-id-224 .page-hero::after{
  background:conic-gradient(from 200deg at 72% 26%,#38bdf8,#818cf8,#c084fc,#f472b6,#fbbf24,#34d399,#38bdf8)!important;
  filter:blur(72px)!important;opacity:.18!important;
  width:760px!important;height:760px!important;top:-210px!important;right:-150px!important;
  animation:csuIriShift 22s linear infinite;
}
/* chromatic CTA sheen site-wide */
.btn-primary{
  background:linear-gradient(90deg,#1e40af,#0ea5e9,#6366f1,#0ea5e9,#1e40af);
  background-size:220% 100%;border:none;animation:csuBtnIri 7s linear infinite;
}
.btn-primary:hover{animation-duration:2.5s}
/* iridescent hairline where content-page sections meet */
.csu-ds-page .section{position:relative}
.csu-ds-page .section + .section::before,
.csu-ds-page .section-alt::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:min(1240px,88%);height:2px;border-radius:2px;pointer-events:none;
  background:linear-gradient(90deg,transparent,#38bdf8,#818cf8,#c084fc,#f472b6,#22d3ee,transparent);opacity:.28}
/* iridescent ring on section eyebrows */
.csu-ds-page .eyebrow{background:linear-gradient(#eff6ff,#eff6ff) padding-box,linear-gradient(90deg,#38bdf8,#818cf8,#c084fc,#f472b6) border-box;border:1px solid transparent}
@media(prefers-reduced-motion:reduce){.page-hero::after,.btn-primary{animation:none!important}}
/* ── iridescent extension: cards, footer, content links (2026-07-06) ── */
/* cards: dormant iridescent top hairline, blooms + slides on hover */
.card{position:relative}
.card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;z-index:2;pointer-events:none;
  background:linear-gradient(90deg,transparent,#38bdf8,#818cf8,#c084fc,#f472b6,#22d3ee,transparent);
  background-size:220% 100%;opacity:.32;transition:opacity .35s var(--ease-out)}
.card:hover::before{opacity:1;animation:csuBtnIri 4s linear infinite}
/* footer: upgrade the plain hairline + glow to the full ToughGlaze conic, slowly shifting */
.csu-footer::before{height:2px!important;opacity:.55;
  background:linear-gradient(90deg,transparent,#38bdf8,#818cf8,#c084fc,#f472b6,#22d3ee,transparent)!important}
.csu-footer::after{right:-180px!important;width:620px!important;height:620px!important;
  background:conic-gradient(from 160deg,#38bdf8,#818cf8,#c084fc,#f472b6,#34d399,#38bdf8)!important;
  filter:blur(90px);opacity:.16!important;animation:csuIriShift 28s linear infinite}
/* footer nav + card links: chromatic underline reveals left-to-right on hover */
.csu-footer-inner a,.card a:not(.btn){
  background-image:linear-gradient(90deg,#38bdf8,#818cf8,#c084fc,#f472b6);
  background-repeat:no-repeat;background-position:0 100%;background-size:0% 2px;
  transition:color .18s var(--ease),background-size .4s var(--ease-out)}
.csu-footer-inner a:hover,.card a:not(.btn):hover{background-size:100% 2px}
@media(prefers-reduced-motion:reduce){
  .card:hover::before,.csu-footer::after{animation:none!important}
  .csu-footer-inner a,.card a:not(.btn){transition:color .18s var(--ease)}}
/* ── iridescent extension 2: top-nav underline + site-wide gradient headings (2026-07-06) ── */
/* top-nav: iridescent underline reveals on hover; always-on (rainbow) for the active item */
.csu-nav-item::after{content:'';position:absolute;left:13px;right:13px;bottom:2px;height:2px;border-radius:2px;pointer-events:none;
  background:linear-gradient(90deg,#38bdf8,#818cf8,#c084fc,#f472b6,#22d3ee);
  transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease-out)}
.csu-nav-item:hover::after,.csu-has-drop:hover > .csu-nav-item::after{transform:scaleX(1)}
.csu-nav-item.active::after{transform:scaleX(1);
  background:linear-gradient(90deg,#38bdf8,#818cf8,#c084fc,#f472b6,#22d3ee)!important}
/* gradient heading emphasis rolled out to every page (was homepage-only); activates the existing csu-shimmer */
.sh em{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;background-size:200% auto}
.section-navy .sh em,.section-dark .sh em,.section-full .sh em{
  background:linear-gradient(90deg,#7dd3fc,#a5b4fc,#c4b5fd);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
@media(prefers-reduced-motion:reduce){.csu-nav-item::after{transition:none}}
/* ── iridescent extension 3: FAQ accordion + secondary buttons (2026-07-07) ── */
/* FAQ: iridescent left accent on hover/open + gradient arrow chip when open (::before free; ::after unused here) */
.faq-item{position:relative}
.faq-item::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,#38bdf8,#818cf8,#c084fc,#f472b6);
  opacity:0;transition:opacity .3s var(--ease-out)}
.faq-item:hover::before,.faq-item.open::before{opacity:.9}
.faq-item.open .faq-q .arrow{background:conic-gradient(from 140deg,#38bdf8,#818cf8,#c084fc,#f472b6,#38bdf8)!important;color:#fff!important}
/* secondary buttons: iridescent bottom sheen (::before — ::after reserved for the ripple) + hover glow */
.btn-white::before,.btn-outline::before{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,#38bdf8,#818cf8,#c084fc,#f472b6,#22d3ee);
  transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease-out)}
.btn-white:hover::before,.btn-outline:hover::before{transform:scaleX(1)}
.btn-white:hover,.btn-outline:hover{box-shadow:0 8px 22px rgba(129,140,248,.25)}
@media(prefers-reduced-motion:reduce){
  .faq-item::before,.btn-white::before,.btn-outline::before{transition:none}}
/* ── iridescent extension 4: form focus rings (calculators + any text field site-wide) (2026-07-07) ── */
/* text inputs/textarea: rainbow gradient border (padding-box keeps radius) + layered iridescent glow */
input[type=text]:focus,input[type=email]:focus,input[type=number]:focus,input[type=tel]:focus,input[type=search]:focus,textarea:focus{
  outline:none!important;border-color:transparent!important;
  background:linear-gradient(#fff,#fff) padding-box,linear-gradient(90deg,#38bdf8,#818cf8,#c084fc,#f472b6) border-box!important;
  box-shadow:0 0 0 3px rgba(129,140,248,.16),0 0 0 6px rgba(192,132,252,.08),0 4px 14px rgba(56,189,248,.14)!important}
/* selects: keep native arrow bg — ring + border only, no bg replacement */
select:focus{outline:none!important;border-color:#818cf8!important;
  box-shadow:0 0 0 3px rgba(129,140,248,.16),0 0 0 6px rgba(192,132,252,.08)!important}
/* ── rotating "leaders in glass" badge (homepage hero) ── */
.csu-spin-badge{position:absolute;right:4.5%;bottom:9%;width:138px;height:138px;z-index:3;pointer-events:none}
.csu-spin-badge-ring{width:100%;height:100%;animation:csuBadgeSpin 22s linear infinite;transform-origin:50% 50%}
.csu-spin-badge-ring text{font:700 12.5px 'Inter','Inter Fallback',sans-serif;letter-spacing:2.2px;fill:#1e40af;text-transform:uppercase}
.csu-spin-badge-core{position:absolute;inset:0;margin:auto;width:58px;height:58px;border-radius:50%;
  background:linear-gradient(135deg,#1e40af,#0ea5e9);display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:1.25rem;box-shadow:0 10px 26px rgba(14,165,233,.4)}
.csu-spin-badge-core::before{content:'';position:absolute;inset:-6px;border-radius:50%;
  background:conic-gradient(#38bdf8,#818cf8,#c084fc,#f472b6,#38bdf8);filter:blur(6px);opacity:.5;z-index:-1;animation:csuBadgeSpin 8s linear infinite reverse}
@keyframes csuBadgeSpin{to{transform:rotate(360deg)}}
@media(max-width:1150px){.csu-spin-badge{display:none}}
@media(prefers-reduced-motion:reduce){.csu-spin-badge-ring,.csu-spin-badge-core::before{animation:none!important}}
/* Section headings → Inter, gradient em */
body.page-id-34 .sh{font-family:Inter,Inter Fallback,sans-serif!important;font-weight:800;letter-spacing:-.03em;color:var(--ink)}
body.page-id-34 .sh em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
body.page-id-34 .eyebrow{color:#0369a1;background:#f0f7ff;border:1px solid rgba(14,165,233,.2)}
/* Product bento + cards: accent top bar */
body.page-id-34 .bento-card:not(.bento-card-hero):not(.bento-card-img){border-top:3px solid var(--accent)}
body.page-id-34 .bento-card-hero{background:var(--csu-band)!important}
body.page-id-34 .bento-tag{color:var(--accent)}
/* KPI numbers → gradient */
body.page-id-34 .kpi-val{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
/* Testimonials → frosted glass cards on light band */
body.page-id-34 .tcard{background:rgba(255,255,255,.7);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.9);box-shadow:0 8px 30px rgba(14,165,233,.10)}
body.page-id-34 .tcard-stars{color:#f59e0b}
/* Final CTA band → bright cyan→blue gradient, Inter heading */
body.page-id-34 .section-navy,body.page-id-34 .section-full.section-navy{background:var(--grad)!important}
body.page-id-34 .section-navy h2{font-family:Inter,Inter Fallback,sans-serif!important;font-weight:800;letter-spacing:-.03em;color:#fff!important}
body.page-id-34 .section-navy h2 em{font-style:normal!important;color:#bae6fd!important;background:none!important;-webkit-text-fill-color:#bae6fd!important}
/* Fold KPI numbers into the hero: hide standalone KPI bar, show hero stat strip */
body.page-id-34 .kpi-bar{display:none}
body.page-id-34 .hero-kpi{display:flex;gap:38px;flex-wrap:wrap;max-width:1100px;margin:0 auto;padding:0 32px 8px;justify-content:center}
body.page-id-34 .hero-kpi .hk{display:flex;flex-direction:column;align-items:center}
body.page-id-34 .hero-kpi .hk b{font-size:1.7rem;font-weight:800;letter-spacing:-.03em;font-family:Inter,Inter Fallback,sans-serif;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
body.page-id-34 .hero-kpi .hk span{font-size:.72rem;color:#64748b;text-transform:uppercase;letter-spacing:.06em;font-weight:600}
/* Case-study cards align to accent-bar tone (visual only — JS untouched) */
body.page-id-34 .case-card{border-top:3px solid var(--accent)}
/* Process steps: gradient step numbers */
body.page-id-34 .step-num{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:800}
/* Soft section tint alternation */
body.page-id-34 .section-alt{background:linear-gradient(160deg,#f8fbff,#eef6ff)}

/* ══════════ GLASS WEIGHT CALCULATOR (.gwc) ══════════ */
/* [GWC3] polish — iridescent hairline replaces solid accent border-top */
.gwc{max-width:980px;margin:0 auto 8px;background:#fff;border:1px solid #e8edf3;border-radius:18px;box-shadow:0 10px 40px rgba(15,23,42,.08);overflow:hidden;position:relative}
.gwc::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#38bdf8,#818cf8,#c084fc,#f472b6,#22d3ee,transparent);opacity:.3;pointer-events:none;z-index:1}
.gwc-head{padding:28px 28px 4px}
.gwc-head h2{font-family:Inter,Inter Fallback,sans-serif;font-size:1.6rem;font-weight:800;letter-spacing:-.03em;color:var(--ink);margin:0}
.gwc-head h2 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.gwc-head p{color:#64748b;font-size:.92rem;margin:6px 0 0}
.gwc-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:0}
/* Root cause of the mobile overflow across .gwc-types/.gwc-dims/.gwc-actions/
   .gwc-preset-chips: .gwc-form is a CSS grid item (child of .gwc-grid), and
   grid items default to min-width:auto — which means the item refuses to
   shrink below whatever its widest un-wrapping descendant needs (a long
   preset-chip label or the thickness <select>'s content), dragging the
   entire form card, and everything block-level inside it, wider than the
   viewport. min-width:0 on the actual grid item fixes it at the source
   instead of chasing every individual child that happened to overflow. */
.gwc-form{padding:24px 28px 28px;min-width:0}
.gwc-form label{display:block;font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#475569;margin:18px 0 8px}
.gwc-form label:first-child{margin-top:6px}
/* [GWC3] polish — section label eyebrow: iridescent vertical bar + tighter small-caps */
.gwc-form > label{position:relative;padding-left:14px;letter-spacing:.08em;color:#374151}
.gwc-form > label::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:4px;height:18px;border-radius:3px;background:linear-gradient(90deg,#38bdf8,#818cf8,#c084fc)}
.gwc-types{display:flex;gap:8px;flex-wrap:wrap}
.gwc-type{flex:1;min-width:92px;background:#f1f5f9;border:1px solid #e2e8f0;color:#475569;font-family:Inter,Inter Fallback,sans-serif;font-weight:600;font-size:.85rem;padding:11px 10px;border-radius:10px;cursor:pointer;transition:all .18s ease}
/* [GWC3] polish — type button active: chromatic gradient */
.gwc-type.active{background:linear-gradient(90deg,#1e40af,#0ea5e9);color:#fff;border-color:transparent;box-shadow:0 6px 16px rgba(14,165,233,.28)}
.gwc-panes{display:grid;gap:10px;margin-top:8px}
/* Same min-width:auto grid-item default as .gwc-form, one level deeper —
   .gwc-pane is itself a grid item of .gwc-panes, so it independently
   refused to shrink below its own rigid children's combined minimum
   (label + fixed-width thickness select), leaving the glass-type select
   an 8px sliver past the viewport even after every child was fixed. */
.gwc-pane{display:flex;align-items:center;gap:10px;min-width:0}
.gwc-pane span{font-size:.8rem;color:#64748b;min-width:64px}
/* [GWC3] polish — styled selects + inputs: subtle inner shadow, hover shift */
.gwc select,.gwc input{width:100%;min-width:0;font-family:Inter,Inter Fallback,sans-serif;font-size:.92rem;padding:11px 12px;border:1px solid #cbd5e1;border-radius:10px;background:#fff;color:var(--ink);box-shadow:inset 0 1px 3px rgba(15,23,42,.05);transition:border-color .18s ease}
.gwc select:hover,.gwc input:hover{border-color:#94a3b8}
.gwc select:focus,.gwc input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(14,165,233,.14)}
.gwc-dims{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.gwc-result{background:linear-gradient(160deg,#f0f7ff,#e6f3ff);padding:28px;display:flex;flex-direction:column;gap:18px;border-left:1px solid #e2e8f0;min-width:0}
.gwc-big{text-align:center;padding:8px 0 4px}
.gwc-big .gwc-total{display:block;font-family:Inter,Inter Fallback,sans-serif;font-size:3rem;font-weight:800;letter-spacing:-.04em;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.gwc-big small{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:#64748b;margin-top:8px;font-weight:600}
.gwc-rows{display:flex;flex-direction:column;gap:2px}
.gwc-rows div{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-top:1px solid rgba(15,23,42,.07);font-size:.86rem}
.gwc-rows span{color:#64748b}
.gwc-rows b{color:var(--ink);font-weight:600}
.gwc-handle{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:14px 16px}
.gwc-handle-method{font-family:Inter,Inter Fallback,sans-serif;font-weight:700;font-size:.95rem;color:var(--ink);display:flex;align-items:center;gap:8px}
.gwc-handle-method::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--accent);flex-shrink:0}
.gwc-handle-equip{font-size:.82rem;color:#64748b;margin-top:6px;padding-left:17px}
.gwc-section .gwc-note{max-width:980px;margin:14px auto 0;font-size:.78rem;color:#94a3b8;line-height:1.5;padding:0 4px}
.gwc-diagram{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-height:128px;padding:4px 0 2px}
.gwc-diagram svg{max-width:100%;height:auto;overflow:visible}
.gwc-diagram .gwc-dlabel{font-size:.7rem;color:#64748b;margin-top:8px;font-weight:600;letter-spacing:.02em}
.gwc-diagram .gwc-dlabel b{color:#1e40af}
.gwc-scale{display:flex;align-items:flex-end;justify-content:center;gap:30px;min-height:150px;padding:6px 0 8px;border-top:1px solid rgba(15,23,42,.06);margin-top:6px}
.gwc-scale-person{display:flex;flex-direction:column;align-items:center;color:#cbd5e1;line-height:0}
.gwc-scale-person i{line-height:1}
.gwc-scale-person span{font-size:.6rem;color:#94a3b8;margin-top:4px;line-height:1.2}
.gwc-scale-box{position:relative;background:linear-gradient(135deg,rgba(159,212,245,.5),rgba(74,166,224,.32));border:2px solid #4aa6e0;border-radius:3px;align-self:flex-end;transition:width .45s var(--ease-out),height .45s var(--ease-out)}
.gwc-scale-w{position:absolute;bottom:-17px;left:0;right:0;text-align:center;font-size:.6rem;color:#475569;font-weight:600;white-space:nowrap}
.gwc-scale-h{position:absolute;top:50%;left:-7px;transform:translate(-100%,-50%);font-size:.6rem;color:#475569;font-weight:600}
@media(prefers-reduced-motion:reduce){.gwc-scale-box{transition:none}}
.gwc-gauge{margin:2px 0 4px}
.gwc-gauge-track{position:relative;height:8px;background:#e2e8f0;border-radius:999px}
.gwc-gauge-fill{position:absolute;left:0;top:0;height:100%;border-radius:999px;background:var(--grad);transition:width .5s var(--ease-out)}
/* [ANIM] Feature 3: gauge marker spring transition */
.gwc-gauge-marker{position:absolute;top:50%;width:15px;height:15px;border-radius:50%;background:#fff;border:3px solid #1e40af;transform:translate(-50%,-50%);transition:left .5s cubic-bezier(.34,1.56,.64,1);box-shadow:0 2px 6px rgba(15,23,42,.25);z-index:2}
/* [GWC2] Labels row: extra top margin to clear threshold labels */
.gwc-gauge-labels{display:flex;justify-content:space-between;margin-top:18px;font-size:.62rem;color:#94a3b8;font-weight:600}
.gwc-handle-method i{color:var(--accent);margin-right:2px}
.gwc-cta{display:block;text-align:center;background:var(--grad);color:#fff!important;font-weight:700;font-family:Inter,Inter Fallback,sans-serif;font-size:.9rem;padding:13px;border-radius:11px;text-decoration:none;box-shadow:0 8px 24px rgba(14,165,233,.3);transition:transform .2s var(--ease-out),box-shadow .2s}
.gwc-cta:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(14,165,233,.4)}
.gwc-warn{background:#fffbeb;border:1px solid #fde68a;color:#92400e;font-size:.8rem;padding:10px 12px;border-radius:10px;margin-top:10px;display:none;align-items:flex-start;gap:8px}
.gwc-warn.show{display:flex}
.gwc-actions{display:flex;gap:8px;margin-top:10px}
/* [GWC3] polish — secondary buttons: navy outline style, hover invert */
.gwc-actions button{flex:1;background:#fff;border:1.5px solid #1e40af;color:#1e40af;font-family:Inter,Inter Fallback,sans-serif;font-weight:600;font-size:.82rem;padding:10px 14px;border-radius:10px;cursor:pointer;transition:all .18s ease}
.gwc-actions button:hover{background:#1e40af;color:#fff;border-color:#1e40af}
.gwc-compare{display:none;margin-top:14px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:16px}
.gwc-compare.show{display:block}
.gwc-cmp-head{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#94a3b8;margin-bottom:10px}
.gwc-cmp-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.gwc-cmp-col{background:#f8fbff;border:1px solid #e2e8f0;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:3px}
.gwc-cmp-col.gwc-cmp-b{background:#f0f7ff;border-color:rgba(14,165,233,.3)}
.gwc-cmp-tag{font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#64748b;margin-bottom:4px}
.gwc-cmp-col b{font-family:Inter,Inter Fallback,sans-serif;font-size:1.3rem;font-weight:800;letter-spacing:-.03em;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.gwc-cmp-col span{font-size:.76rem;color:#64748b}
.gwc-cmp-delta{margin-top:10px;font-size:.82rem;color:#475569;text-align:center}
.gwc-cmp-delta b{color:var(--ink)}
@media(max-width:760px){.gwc-grid{grid-template-columns:1fr}.gwc-result{border-left:none;border-top:1px solid #e2e8f0}}
/* .gwc-dims (Width/Height/Qty) and .gwc-actions (Print/Compare/Add) both
   overflowed the card at mobile widths — grid/flex children default to
   min-width:auto, which respects the number input's/button's own content
   size and refuses to shrink below it even inside a 1fr track or flex:1
   item, so the row pushed past the card edge instead of the columns ever
   truly sharing space evenly. min-width:0 lets them actually shrink; below
   400px there just isn't room for 3 real inputs/buttons side by side even
   shrunk, so those two rows stack fully per house convention. */
.gwc-dims>div,.gwc-actions button{min-width:0}
@media(max-width:400px){
  .gwc-dims{grid-template-columns:1fr}
  .gwc-actions{flex-direction:column}
}
@media(prefers-reduced-motion:reduce){.gwc-gauge-fill,.gwc-gauge-marker{transition:none}}
/* ════ [ANIM] WAVE 3 — animations + interactivity ════════════════════ */
/* Feature 6: person icon font-size transition (parallels .gwc-scale-box width/height) */
.gwc-scale-person i,.gwc-scale-person2 i{transition:font-size .45s var(--ease-out)}
@media(prefers-reduced-motion:reduce){.gwc-scale-person i,.gwc-scale-person2 i{transition:none}}
/* Feature 3: gauge threshold-label CSS tooltip (uses title attr) */
.gwc-gauge-thresh-lbl{cursor:help;position:relative}
.gwc-gauge-thresh-lbl::after{content:attr(title);position:absolute;bottom:calc(100% + 7px);left:50%;transform:translateX(-50%);background:#1e293b;color:#f8fafc;font-size:.58rem;font-weight:600;padding:4px 8px;border-radius:6px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s ease;z-index:20}
.gwc-gauge-thresh-lbl:hover::after{opacity:1}
@media(prefers-reduced-motion:reduce){.gwc-gauge-thresh-lbl::after{transition:none}}
/* Feature 4: preset chip press feedback (scale) */
.gwc-preset:active{transform:scale(.95)}
/* [ANIM] Feature 4: affected-input iridescent ring pulse */
@keyframes gwc-input-ring{0%{box-shadow:0 0 0 0 rgba(14,165,233,0),0 0 0 0 rgba(192,132,252,0)}40%{box-shadow:0 0 0 4px rgba(14,165,233,.45),0 0 0 7px rgba(192,132,252,.2)}100%{box-shadow:0 0 0 0 rgba(14,165,233,0),0 0 0 0 rgba(192,132,252,0)}}
.gwc-input-flash{animation:gwc-input-ring .6s var(--ease) forwards!important}
@media(prefers-reduced-motion:reduce){.gwc-input-flash{animation:none!important}}
/* [ANIM] Feature 1: ghost chip flies from button toward list panel */
.gwc-ghost-chip{position:fixed;pointer-events:none;z-index:9999;background:linear-gradient(90deg,#38bdf8,#818cf8,#c084fc);color:#fff;font-family:Inter,Inter Fallback,sans-serif;font-size:.72rem;font-weight:700;padding:5px 12px;border-radius:999px;box-shadow:0 4px 14px rgba(14,165,233,.35);white-space:nowrap;transform:translateX(-50%);animation:gwc-ghost-fly .6s var(--ease) forwards}
@keyframes gwc-ghost-fly{0%{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}70%{opacity:.75}100%{opacity:0;transform:translateX(-50%) translateY(52px) scale(.7)}}
@media(prefers-reduced-motion:reduce){.gwc-ghost-chip{display:none!important}}
/* [ANIM] Feature 1: add-to-list button spring pulse */
@keyframes gwc-btn-pulse{0%{transform:scale(1)}35%{transform:scale(.96)}100%{transform:scale(1)}}
.gwc-btn-anim{animation:gwc-btn-pulse .35s cubic-bezier(.34,1.56,.64,1)}
@media(prefers-reduced-motion:reduce){.gwc-btn-anim{animation:none}}
/* [ANIM] Feature 1: new list row slides in + iridescent left-border flash */
@keyframes gwc-row-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes gwc-cell-hl{0%{box-shadow:inset 3px 0 0 rgba(56,189,248,.9)}33%{box-shadow:inset 3px 0 0 rgba(129,140,248,.9)}66%{box-shadow:inset 3px 0 0 rgba(192,132,252,.9)}100%{box-shadow:inset 3px 0 0 transparent}}
.gwc-list-row-new{animation:gwc-row-in .3s var(--ease-out) both}
.gwc-list-row-new td:first-child{animation:gwc-cell-hl 1s ease .3s both}
@media(prefers-reduced-motion:reduce){.gwc-list-row-new,.gwc-list-row-new td:first-child{animation:none}}
/* [ANIM] Feature 2: result card / rating crossfade on threshold crossing */
@keyframes gwc-xfade-in{from{opacity:0}to{opacity:1}}
.gwc-handle.gwc-xfade,.uvc-rate.gwc-xfade{animation:gwc-xfade-in .25s ease}
@media(prefers-reduced-motion:reduce){.gwc-handle.gwc-xfade,.uvc-rate.gwc-xfade{animation:none}}
/* [ANIM] Feature 5: UVC cross-section diagram fade-swap */
.uvc .gwc-diagram{transition:opacity .12s ease}
.uvc .gwc-diagram.gwc-diag-hidden{opacity:0}
@media(prefers-reduced-motion:reduce){.uvc .gwc-diagram{transition:none}}
/* Feature 7: drag resize handles on GWC scale glass box */
.gwc-drag-h,.gwc-drag-v{position:absolute;z-index:10;background:transparent;border-radius:2px}
.gwc-drag-h{right:0;top:0;width:12px;height:100%;cursor:ew-resize;touch-action:manipulation}
.gwc-drag-v{bottom:0;left:0;width:100%;height:12px;cursor:ns-resize;touch-action:manipulation}
.gwc-drag-h:hover,.gwc-drag-v:hover{background:rgba(14,165,233,.18)}
/* ════════════════════════════════════════════════════════════════ */
/* [GWC2] Gauge: zone gradient + iridescent hairline + threshold markers */
.gwc-gauge-track::after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:linear-gradient(90deg,#10b981 0%,#10b981 20.83%,#0ea5e9 20.83%,#0ea5e9 33.33%,#3b82f6 33.33%,#3b82f6 50%,#f59e0b 50%,#f59e0b 83.33%,#ef4444 83.33%,#ef4444 100%);opacity:.18;border-radius:999px;z-index:0}
.gwc-gauge-track::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:100%;height:2px;background:linear-gradient(90deg,#38bdf8,#818cf8,#c084fc,#f472b6);opacity:.32;border-radius:999px;z-index:0;pointer-events:none}
.gwc-gauge-fill{z-index:1}
.gwc-gauge-thresh{position:absolute;top:-3px;width:2px;height:calc(100% + 6px);border-radius:2px;background:rgba(15,23,42,.22);z-index:3;transform:translateX(-50%)}
.gwc-gauge-thresh-lbl{position:absolute;top:calc(100% + 3px);transform:translateX(-50%);font-size:.5rem;color:#94a3b8;font-weight:700;white-space:nowrap;letter-spacing:.02em}
/* [GWC2] Odometer digit slots — height:1em clips to one digit row */
/* Note: background-clip:text applied to .gwc-odo-d (direct text holder) not slot parent */
.gwc-odo-slot{display:inline-block;overflow:hidden;vertical-align:top;height:1em;line-height:1}
.gwc-odo-col{display:flex;flex-direction:column;transition:transform .4s ease-out;line-height:1}
.gwc-odo-d{display:block;text-align:center;height:1em;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.gwc-odo-lit{display:inline-block;vertical-align:top;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
@media(prefers-reduced-motion:reduce){.gwc-odo-col{transition:none}}
/* [GWC2] Scale: second person + mechanical badge */
.gwc-scale-person2{display:flex;flex-direction:column;align-items:center;color:#cbd5e1;line-height:0;opacity:0;transition:opacity .35s ease}
.gwc-scale-person2 i{line-height:1}
.gwc-scale-person2 span{font-size:.6rem;color:#94a3b8;margin-top:4px;line-height:1.2}
.gwc-scale-person2.show{opacity:1}
.gwc-scale-mech{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;color:#f59e0b;font-size:.6rem;font-weight:700;letter-spacing:.02em;opacity:0;transition:opacity .35s ease;gap:3px;text-transform:uppercase}
.gwc-scale-mech.show{opacity:1}
@media(prefers-reduced-motion:reduce){.gwc-scale-person2,.gwc-scale-mech{transition:none}}
/* [GWC2] Print spec-sheet (#gwc-sheet) — [UVC2] also targets #uvc-sheet */
#gwc-sheet,#uvc-sheet{display:none;padding:28px 32px;font-family:Inter,Inter Fallback,sans-serif;color:#0f172a;background:#fff;line-height:1.5}
#gwc-sheet h1,#uvc-sheet h1{font-size:1.05rem;font-weight:800;color:#1e40af;margin:10px 0 3px}
#gwc-sheet .gwc-sh-meta,#uvc-sheet .gwc-sh-meta{font-size:.74rem;color:#64748b;margin:0 0 14px;line-height:1.5}
#gwc-sheet table,#uvc-sheet table{width:100%;border-collapse:collapse;margin-bottom:10px;font-size:.8rem}
#gwc-sheet th,#uvc-sheet th{background:#f1f5f9;padding:6px 10px;text-align:left;font-weight:700;border:1px solid #e2e8f0;color:#334155}
#gwc-sheet td,#uvc-sheet td{padding:6px 10px;border:1px solid #e2e8f0;color:#0f172a}
#gwc-sheet td:first-child,#uvc-sheet td:first-child{color:#475569;font-weight:600}
#gwc-sheet .gwc-sh-formula,#uvc-sheet .gwc-sh-formula{font-size:.7rem;color:#64748b;border-top:1px solid #e8edf3;padding-top:9px;margin-top:4px;line-height:1.55}
#gwc-sheet .gwc-sh-footer,#uvc-sheet .gwc-sh-footer{margin-top:12px;padding-top:10px;border-top:1px solid #e8edf3;font-size:.7rem;color:#64748b;line-height:1.7}
#gwc-sheet .gwc-sh-logo,#uvc-sheet .gwc-sh-logo{height:34px;width:auto;display:block;margin-bottom:6px}
/* [GWC2] Print: body.gwc-printing → show spec sheet only */
/* [UVC2] Print: body.uvc-printing → show #uvc-sheet only */
@media print{
  body{background:#fff!important}
  /* Default Ctrl+P (no button): show .gwc-section or .uvc-section via visibility.
     Scoped with :has() to pages that actually contain a calculator — without it this
     blanked EVERY other page's Ctrl+P (and the trade-quote print sheet). */
  body:has(.gwc-section,.uvc-section):not(.gwc-printing):not(.uvc-printing):not(.tq-printing) *{visibility:hidden!important}
  body:has(.gwc-section,.uvc-section):not(.gwc-printing):not(.uvc-printing):not(.tq-printing) :is(.gwc-section,.uvc-section),body:has(.gwc-section,.uvc-section):not(.gwc-printing):not(.uvc-printing):not(.tq-printing) :is(.gwc-section,.uvc-section) *{visibility:visible!important}
  body:has(.gwc-section,.uvc-section):not(.gwc-printing):not(.uvc-printing):not(.tq-printing) :is(.gwc-section,.uvc-section){position:absolute;left:0;top:0;width:100%}
  body:not(.gwc-printing):not(.uvc-printing):not(.tq-printing) .gwc{box-shadow:none!important;border:1px solid #cbd5e1!important;max-width:100%!important}
  body:not(.gwc-printing):not(.uvc-printing):not(.tq-printing) .gwc-actions,body:not(.gwc-printing):not(.uvc-printing):not(.tq-printing) .gwc-cta,body:not(.gwc-printing):not(.uvc-printing):not(.tq-printing) .gwc-types,body:not(.gwc-printing):not(.uvc-printing):not(.tq-printing) .csu-tbar,body:not(.gwc-printing):not(.uvc-printing):not(.tq-printing) .csu-header,body:not(.gwc-printing):not(.uvc-printing):not(.tq-printing) #csu-preloader{display:none!important}
  body:not(.gwc-printing):not(.uvc-printing):not(.tq-printing) .gwc-result{background:#fff!important}
  body:not(.gwc-printing):not(.uvc-printing):not(.tq-printing) .gwc-form select,body:not(.gwc-printing):not(.uvc-printing):not(.tq-printing) .gwc-form input{border:1px solid #cbd5e1!important}
  /* GWC print button: show spec sheet only. display:none (not visibility) collapses page
     height to one sheet; position:static (NEVER fixed — fixed repeats on every printed page) */
  body.gwc-printing > *:not(#gwc-sheet){display:none!important}
  body.gwc-printing #gwc-sheet{display:block!important;position:static;width:100%;box-sizing:border-box;box-shadow:none}
  /* [UVC2] UVC print button: same pattern — display:none collapses page height to one sheet */
  body.uvc-printing > *:not(#uvc-sheet){display:none!important}
  body.uvc-printing #uvc-sheet{display:block!important;position:static;width:100%;box-sizing:border-box;box-shadow:none}
}
/* [PDF2] @page margin — friendlier margins for spec sheets */
@page{margin:14mm 12mm}
/* [PDF2] Sheet header band */
.sh-header{display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:9px;border-bottom:2px solid #1e40af;margin-bottom:14px;gap:14px}
.sh-header-left{display:flex;align-items:center}
.sh-header-right{text-align:right}
.sh-doc-title{font-family:Inter,Inter Fallback,sans-serif;font-size:.92rem;font-weight:800;color:#1e40af;margin:0 0 2px;letter-spacing:-.01em;line-height:1.2}
.sh-doc-date{font-family:Inter,Inter Fallback,sans-serif;font-size:.7rem;color:#64748b;margin:0;line-height:1.3}
/* [PDF2] 2-col body row: table left, diagram right */
.sh-body-row{display:flex;gap:18px;align-items:flex-start;margin:0 0 12px}
.sh-table-col{flex:1;min-width:0}
.sh-diagram-col{width:210px;flex-shrink:0;text-align:center}
.sh-diagram-legend{margin-top:6px;font-family:Inter,Inter Fallback,sans-serif;font-size:.68rem;color:#475569;line-height:1.6;text-align:left}
.sh-diagram-legend .sh-leg-loe{display:inline-block;width:12px;height:3px;background:#f59e0b;vertical-align:middle;margin-right:3px}
/* [PDF2] Handling pictogram row */
.sh-handling-row{margin:10px 0 4px;display:flex;align-items:center;gap:8px}
.sh-handling-label{font-family:Inter,Inter Fallback,sans-serif;font-size:.72rem;color:#475569;font-weight:600;line-height:1.4}
/* [PDF2] Sheet footer band */
.sh-footer{margin-top:14px;padding-top:9px;border-top:1px solid #e2e8f0;font-family:Inter,Inter Fallback,sans-serif;display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap}
.sh-footer-contact{font-size:.7rem;color:#334155;font-weight:600}
.sh-footer-url{font-size:.7rem;color:#1e40af}
.sh-footer-small{font-size:.63rem;color:#94a3b8;font-style:italic;width:100%}
@media print{.sh-body-row{page-break-inside:avoid}}
/* [GWC3] polish — Quick preset chips */
.gwc-preset-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.gwc-preset{background:#f8fbff;border:1.5px solid #dbeafe;color:#1e40af;font-family:Inter,Inter Fallback,sans-serif;font-weight:600;font-size:.78rem;padding:7px 13px;border-radius:999px;cursor:pointer;transition:all .18s ease;line-height:1.3}
.gwc-preset:hover{background:#1e40af;color:#fff;border-color:#1e40af}
@media(prefers-reduced-motion:reduce){.gwc-preset{transition:none}}
.gwc-preset-note{margin-top:12px;font-size:.75rem;color:#94a3b8;background:#f8fafc;border:1px solid #e8edf3;border-radius:10px;padding:10px 14px;line-height:1.55;margin-bottom:4px}
/* [GWC4] unit list panel */
.gwc-list-panel{max-width:980px;margin:16px auto 40px;background:#fff;border:1px solid #e8edf3;border-radius:18px;box-shadow:0 10px 40px rgba(15,23,42,.08);overflow:hidden;position:relative;padding:28px 28px 24px}
.gwc-list-panel::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#38bdf8,#818cf8,#c084fc,#f472b6,#22d3ee,transparent);opacity:.4;pointer-events:none;z-index:1}
.gwc-list-eyebrow{margin-bottom:18px}
.gwc-list-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.gwc-list-table{width:100%;border-collapse:collapse;font-size:.82rem;min-width:480px}
.gwc-list-table th{background:#f8fafc;font-size:.69rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#475569;padding:8px 10px;border-bottom:1px solid #e2e8f0;text-align:left}
.gwc-list-table td{padding:9px 10px;border-bottom:1px solid #f1f5f9;color:#1e293b;vertical-align:top}
.gwc-list-table tbody tr:last-child td{border-bottom:none}
.gwc-list-table tfoot td{border-top:2px solid #e2e8f0;font-size:.82rem;padding:10px;background:#f8fafc;color:#1e293b}
.gwc-list-build{font-weight:600}
.gwc-list-spec{display:block;font-size:.7rem;color:#64748b;font-weight:400;margin-top:2px}
.gwc-list-rm{background:none;border:none;color:#94a3b8;font-size:1.1rem;cursor:pointer;padding:2px 6px;border-radius:6px;line-height:1;transition:color .15s,background .15s}
.gwc-list-rm:hover{color:#ef4444;background:#fef2f2}
.gwc-list-bottom{margin-top:18px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:space-between}
.gwc-list-handling{font-size:.8rem;color:#475569;display:flex;align-items:center;gap:7px}
.gwc-list-handling i{color:#1e40af}
.gwc-list-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.gwc-list-pdf-btn{background:#fff;border:1.5px solid #1e40af;color:#1e40af;font-family:Inter,Inter Fallback,sans-serif;font-weight:600;font-size:.82rem;padding:9px 16px;border-radius:10px;cursor:pointer;transition:all .18s ease;display:flex;align-items:center;gap:6px}
.gwc-list-pdf-btn:hover{background:#1e40af;color:#fff}
.gwc-list-clear{color:#94a3b8;font-size:.78rem;text-decoration:underline;cursor:pointer;white-space:nowrap}
.gwc-list-clear:hover{color:#ef4444;text-decoration:none}
@media(max-width:600px){.gwc-list-panel{padding:18px 14px 16px}.gwc-list-bottom{flex-direction:column;align-items:flex-start;gap:10px}}
/* [UVC3] window schedule — Part-L verdict badges + amber note */
.uvc-list-pass{color:#10b981;font-weight:700}
.uvc-list-fail{color:#ef4444;font-weight:700}
.uvc-list-amber{font-size:.78rem;color:#b45309;background:#fefce8;border:1px solid #fde68a;border-radius:8px;padding:8px 14px;margin-top:10px;display:flex;align-items:center;gap:8px}
/* [P9] cross-calc subtle link */
.gwc-cross-link{display:block;text-align:center;margin-top:8px;font-size:.78rem;color:#0ea5e9;text-decoration:none;opacity:.85;transition:opacity .15s,color .15s}
.gwc-cross-link:hover{opacity:1;color:#1e40af}
/* [P10] Editable label cells in GWC/UVC schedules */
.gwc-list-lbl{cursor:pointer;display:inline-flex;align-items:center;gap:5px;border-radius:4px;padding:2px 4px;transition:background .15s}
.gwc-list-lbl:hover,.gwc-list-lbl:focus{background:#f0f7ff;outline:none}
.gwc-lbl-ico{font-size:.58rem;color:#94a3b8;opacity:0;transition:opacity .15s;flex-shrink:0;margin-left:3px}
.gwc-list-lbl:hover .gwc-lbl-ico,.gwc-list-lbl:focus .gwc-lbl-ico{opacity:1}
.gwc-lbl-inp{font-family:inherit;font-size:inherit;font-weight:inherit;border:1.5px solid #0ea5e9;border-radius:6px;padding:2px 6px;width:140px;max-width:100%;outline:none;color:#0f172a;background:#fff;box-shadow:0 0 0 3px rgba(14,165,233,.15)}
/* ══════════ U-VALUE CALCULATOR (.uvc — reuses .gwc shell) ══════════ */
.uvc-rate{display:inline-flex;align-items:center;gap:7px;font-family:Inter,Inter Fallback,sans-serif;font-weight:700;font-size:.82rem;padding:7px 13px;border:1.5px solid currentColor;border-radius:999px;line-height:1.2;margin:2px auto 0}
.uvc-rate::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;flex-shrink:0}
.uvc .gwc-pane{flex-wrap:nowrap}
.uvc .gwc-pane .gwc-thk{flex:0 0 88px;width:auto}
.uvc .gwc-pane .uvc-pane-glass{flex:1 1 auto;width:auto;min-width:0}
.uvc .gwc-pane .uvc-cav{flex:1 1 auto;width:auto;min-width:0}
.gwc-spacer-row{display:grid;grid-template-columns:1fr 1.3fr;gap:10px;margin-top:4px}
.uvc-cavity-lab{font-size:.62rem;fill:#2b6cb0;font-weight:700;font-family:Inter,Inter Fallback,sans-serif}
.uvc-coat{stroke:#f59e0b;stroke-width:2.4}
/* [UVC2] Part L note below gauge */
.uvc-partl-note{font-size:.65rem;color:#94a3b8;text-align:center;margin:2px 0 6px;line-height:1.4;padding:0 4px}
@media print{
  .uvc-section,.uvc-section *{visibility:visible!important}
  .uvc-section{position:absolute;left:0;top:0;width:100%}
  .uvc-section .gwc-actions,.uvc-section .gwc-cta,.uvc-section .gwc-types{display:none!important}
  .uvc-section::before{content:"Clear Sealed Units Ltd — U-Value Spec Sheet";display:block;font:700 14px Inter,sans-serif;color:#1e40af;padding:0 0 8px}
}
/* ════════ GLASS WEIGHT CALC PAGE (32) — D3·3 polish ════════ */
/* shared inner container so every band aligns to the same edges (matches page 224) */
body.page-id-32 .uv-wrap{max-width:1240px;width:100%;margin:0 auto;padding:0 40px;box-sizing:border-box}
body.page-id-32 .page-hero-inner{max-width:1240px;padding:0 40px;box-sizing:border-box}
body.page-id-32 .section,body.page-id-32 .gwc-section{padding-left:0!important;padding-right:0!important}
body.page-id-32 .gwc-section .gwc-note{max-width:980px;margin:14px auto 0}
@media(max-width:768px){body.page-id-32 .uv-wrap,body.page-id-32 .page-hero-inner{padding-left:22px;padding-right:22px}}
/* calc: stack pane label above its select so the thickness box left-aligns with the W/H/Qty boxes */
#glass-weight-calc .gwc-pane{display:block}
#glass-weight-calc .gwc-pane > span{display:block;min-width:0;margin:0 0 7px;font-size:.8rem;color:#64748b}
#glass-weight-calc .gwc-pane .gwc-thk{width:100%}
body.page-id-32 .page-hero{background:linear-gradient(160deg,#f0f7ff 0%,#e6f3ff 55%,#dbeafe 100%);min-height:auto;padding:84px 0 64px;border-bottom:1px solid #dbeafe}
body.page-id-32 .page-hero::after{background:radial-gradient(circle,rgba(14,165,233,.20),transparent 65%)}
body.page-id-32 .page-hero::before{background-image:linear-gradient(rgba(14,165,233,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(14,165,233,.06) 1px,transparent 1px)}
body.page-id-32 .page-hero-icon{background:rgba(255,255,255,.78);border-color:rgba(14,165,233,.28);backdrop-filter:blur(8px);color:#0369a1}
body.page-id-32 .page-hero-icon i{background:var(--grad);width:28px;height:28px;font-size:.85rem}
body.page-id-32 .page-hero .sub{color:#475569}
/* section headings (plain h2 above each table) → Inter + gradient bar */
body.page-id-32 .section{padding-top:48px;padding-bottom:8px}
body.page-id-32 .section > h2{font-family:Inter,Inter Fallback,sans-serif!important;font-weight:800;letter-spacing:-.03em;color:var(--ink);font-size:clamp(1.5rem,3vw,2rem);margin:0}
body.page-id-32 .section > h2 + .sbar,body.page-id-32 .sbar{display:block!important;width:54px;height:4px;border-radius:3px;background:var(--grad);margin:12px 0 2px}
/* premium tables */
body.page-id-32 .tbl-wrap{border:1px solid #e2e8f0;box-shadow:0 8px 30px rgba(14,165,233,.08);border-radius:16px}
body.page-id-32 .tbl th{background:linear-gradient(135deg,#0a1f44,#103a8a);color:#fff;border-bottom:none}
body.page-id-32 .tbl tr:nth-child(even) td{background:#f6fafe}
body.page-id-32 .tbl tr:hover td{background:rgba(14,165,233,.09)}
body.page-id-32 .tbl td:first-child{color:#1e40af}

/* ════════ U-VALUE CALC PAGE (224) — rich card redesign ════════ */
/* one shared inner container so EVERY band aligns to the same edges */
body.page-id-224 .uv-wrap{max-width:1240px;width:100%;margin:0 auto;padding:0 40px;box-sizing:border-box}
body.page-id-224 .page-hero{background:linear-gradient(160deg,#f0f7ff 0%,#e6f3ff 55%,#dbeafe 100%);min-height:auto;padding:84px 0 60px;border-bottom:1px solid #dbeafe}
body.page-id-224 .page-hero::after{background:radial-gradient(circle,rgba(14,165,233,.20),transparent 65%)}
body.page-id-224 .page-hero::before{background-image:linear-gradient(rgba(14,165,233,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(14,165,233,.06) 1px,transparent 1px)}
body.page-id-224 .page-hero-inner{max-width:1240px;padding:0 40px;box-sizing:border-box}
body.page-id-224 .page-hero-icon{background:rgba(255,255,255,.78);border-color:rgba(14,165,233,.28);backdrop-filter:blur(8px);color:#0369a1}
body.page-id-224 .page-hero-icon i{background:var(--grad);width:28px;height:28px;font-size:.85rem}
body.page-id-224 .page-hero h1{margin:0}
body.page-id-224 .page-hero .sub{color:#475569;max-width:640px}
body.page-id-224 .page-hero .hero-chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}
/* full-bleed bands: background spans edge-to-edge, content sits in .uv-wrap */
body.page-id-224 .section,body.page-id-224 .section-alt,body.page-id-224 .section-navy,body.page-id-224 .uvc-section,body.page-id-224 .kpi-bar{padding-left:0!important;padding-right:0!important}
body.page-id-224 .section,body.page-id-224 .section-alt{padding-top:62px;padding-bottom:62px}
body.page-id-224 .uvc-section{padding-top:46px;padding-bottom:22px}
body.page-id-224 .kpi-bar-inner{max-width:1240px;margin:0 auto;padding:0 40px;box-sizing:border-box;grid-template-columns:repeat(4,1fr)}
body.page-id-224 .kpi-cell{padding:38px 28px}
body.page-id-224 .uvc-section .gwc-note{max-width:980px;margin:14px auto 0}
body.page-id-224 .section h2,body.page-id-224 .section-alt h2{font-family:Inter,Inter Fallback,sans-serif!important;font-weight:800;letter-spacing:-.03em;color:var(--ink);font-size:clamp(1.5rem,3vw,2rem);margin:0}
body.page-id-224 .sbar{display:block!important;width:54px;height:4px;border-radius:3px;background:var(--grad);margin:12px 0 24px}
body.page-id-224 .uv-lead{color:#64748b;max-width:720px;margin:0 0 32px;font-size:1.04rem;line-height:1.65}
@media(max-width:768px){body.page-id-224 .uv-wrap,body.page-id-224 .page-hero-inner,body.page-id-224 .kpi-bar-inner{padding-left:22px;padding-right:22px}
/* This page's own kpi-bar-inner rule above forces repeat(4,1fr) at every
   width (not just desktop) with higher specificity than the shared
   .kpi-bar-inner mobile rule elsewhere in this file, so it silently beat
   the site's normal 2-column mobile behaviour and squeezed each label
   ("Best triple-glazed unit" etc.) into single-syllable-wide columns. */
body.page-id-224 .kpi-bar-inner{grid-template-columns:repeat(2,1fr)}}
body.page-id-224 .tbl-wrap{border:1px solid #e2e8f0;box-shadow:0 8px 30px rgba(14,165,233,.08);border-radius:16px;margin-top:6px}
body.page-id-224 .tbl th{background:linear-gradient(135deg,#0a1f44,#103a8a);color:#fff;border-bottom:none}
body.page-id-224 .tbl tr:nth-child(even) td{background:#f6fafe}
body.page-id-224 .tbl tr:hover td{background:rgba(14,165,233,.09)}
body.page-id-224 .tbl td:first-child{color:#1e40af}
/* icon-led factor cards */
.uv-card-ico{width:46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:linear-gradient(150deg,#e0f2fe,#dbeafe);color:#0369a1;font-size:1.15rem;margin-bottom:18px}
.card .uv-stat{margin-top:auto;padding-top:12px;font-family:Inter,Inter Fallback,sans-serif;font-weight:800;font-size:1rem;color:#0ea5e9;letter-spacing:-.02em}
body.page-id-224 .card{display:flex;flex-direction:column}
/* feature spec cards (inline flag — no overflow clipping) */
.card.uv-spec{display:flex;flex-direction:column;padding:26px 26px 24px}
.uv-spec-head{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:24px;margin-bottom:16px}
.uv-spec-label{font-family:Inter,Inter Fallback,sans-serif;font-weight:700;font-size:.7rem;text-transform:uppercase;letter-spacing:.07em;color:#64748b}
.uv-spec-flag{display:inline-flex;align-items:center;gap:5px;background:var(--grad);color:#fff;font-family:Inter,Inter Fallback,sans-serif;font-weight:700;font-size:.62rem;text-transform:uppercase;letter-spacing:.05em;padding:5px 10px;border-radius:999px;white-space:nowrap;box-shadow:0 4px 12px rgba(14,165,233,.3)}
.uv-spec-flag i{font-size:.6rem}
.uv-spec-u{font-family:Inter,Inter Fallback,sans-serif;font-weight:800;font-size:2.7rem;letter-spacing:-.04em;line-height:1;color:#0ea5e9;display:flex;align-items:baseline;gap:6px;margin-bottom:14px}
.uv-spec-u span{font-size:.78rem;font-weight:600;color:#94a3b8;letter-spacing:0}
.uv-spec-build{font-family:Inter,Inter Fallback,sans-serif;font-weight:700;font-size:.92rem;color:var(--ink);margin-bottom:8px;letter-spacing:-.01em}
.uv-spec-desc{font-size:.88rem;color:#64748b;line-height:1.6;margin:0 0 20px}
.uv-spec-verdict{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:7px;font-size:.76rem;font-weight:600;color:#0369a1;background:#eff6ff;border:1px solid #dbeafe;border-radius:999px;padding:7px 13px}
.uv-spec-verdict i{color:#10b981}
.card.uv-spec--star{border:1.5px solid rgba(14,165,233,.45);box-shadow:0 18px 44px -12px rgba(14,165,233,.32);background:linear-gradient(180deg,#f6fcff,#fff 55%)}
.card.uv-spec--star .uv-spec-u{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.card.uv-spec--star .uv-spec-u span{-webkit-text-fill-color:#94a3b8}
/* Part L cards */
.uv-partl{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:6px}
@media(max-width:900px){.uv-partl{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.uv-partl{grid-template-columns:1fr}}
.uv-pl{background:#fff;border:1px solid rgba(15,23,42,.06);border-top:3px solid var(--c,#0ea5e9);border-radius:14px;padding:20px;box-shadow:var(--shadow-xs);transition:transform .2s var(--ease-out),box-shadow .2s}
.uv-pl:hover{transform:translateY(-4px);box-shadow:0 16px 32px -12px rgba(15,23,42,.16)}
.uv-pl-val{font-family:Inter,Inter Fallback,sans-serif;font-weight:800;font-size:1.7rem;letter-spacing:-.03em;color:var(--c,#0ea5e9);line-height:1}
.uv-pl-app{font-size:.86rem;color:var(--ink);font-weight:600;margin-top:9px;line-height:1.35}
.uv-pl-std{font-size:.74rem;color:#94a3b8;margin-top:4px}

/* ── INCLUDED AS STANDARD trust strip — v2.8 ── */
.included-strip{background:linear-gradient(135deg,#f0fdf4,#dcfce7)!important;border-top:none!important;padding:28px 24px!important;position:relative;overflow:hidden}
.included-strip::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(34,197,94,.08) 1px,transparent 1px);background-size:20px 20px;mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,#000 0%,transparent 70%)}
.included-strip > *{position:relative;z-index:1}

/* ═══════════════════════════════════════════════
   HOMEPAGE DESIGN V3
═══════════════════════════════════════════════ */

/* ── HERO ── */
.csu-hero-slide{
  background:linear-gradient(135deg,#0a1628 0%,#1a365d 55%,#0f2347 100%)!important;
  min-height:620px!important
}
.csu-hero-slide::after{
  content:'';position:absolute;inset:0;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:80px 80px!important;
  pointer-events:none;z-index:0
}
.csu-hero-heading{
  font-family:'Source Serif 4','Source Serif 4 Fallback',Georgia,serif!important;
  font-size:clamp(2.1rem,4.2vw,3.4rem)!important;
  line-height:1.06!important;letter-spacing:-.03em!important;font-weight:800!important
}
.csu-hero-body{font-size:1.05rem!important;line-height:1.78!important;color:rgba(255,255,255,.82)!important}
.csu-hero-badge{border:1px solid rgba(255,255,255,.2)!important;background:rgba(255,255,255,.1)!important;backdrop-filter:blur(10px)!important}
.csu-hero-btn--primary{background:#fff!important;color:#0d1b2a!important;font-weight:700!important;letter-spacing:-.01em!important}
.csu-hero-btn--secondary{border-color:rgba(255,255,255,.45)!important;font-weight:600!important}

/* ── STATS ── */
.elementor-element-hp-stats,
.elementor-element-hp-stats>.elementor-container,
.elementor-element-hp-stats .elementor-column-wrap,
.elementor-element-hp-stats .elementor-widget-wrap{
  padding-top:0!important;padding-bottom:0!important;
}
.csuh-stats{background:linear-gradient(135deg,#0d1b2a 0%,#1a365d 100%);position:relative;overflow:hidden}
.csuh-stats::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(-55deg,transparent,transparent 36px,rgba(255,255,255,.012) 36px,rgba(255,255,255,.012) 37px);pointer-events:none}
.csuh-stats-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(6,1fr);position:relative;z-index:1}
.csuh-stat{padding:32px 12px;text-align:center;border-right:1px solid rgba(255,255,255,.08);transition:background .25s;cursor:default}
.csuh-stat:last-child{border-right:none}
.csuh-stat:hover{background:rgba(255,255,255,.05)}
.csuh-si{display:block;font-size:1.3rem;color:#60a5fa;margin-bottom:10px;opacity:.8}
.csuh-sn{font-family:Inter,Inter Fallback,sans-serif;font-size:2.3rem;font-weight:900;color:#fff;line-height:1;margin-bottom:5px;letter-spacing:-.02em}
.csuh-sn span{font-size:1.1rem;font-weight:600;opacity:.55;letter-spacing:0}
.csuh-sl{font-family:Inter,Inter Fallback,sans-serif;font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.38)}
@media(max-width:900px){.csuh-stats-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:480px){.csuh-stats-grid{grid-template-columns:repeat(2,1fr)}}

/* ── ABOUT ── */
.elementor-element-hp-about{background:#fff}
.csuh-about{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.csuh-ey{display:inline-flex;align-items:center;gap:8px;font-family:Inter,Inter Fallback,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#2b6cb0;background:#eff6ff;padding:5px 14px;border-radius:20px;margin-bottom:20px;border:1px solid #bfdbfe}
.csuh-about-h{font-family:'Source Serif 4','Source Serif 4 Fallback',Georgia,serif;font-size:clamp(1.7rem,3vw,2.5rem);font-weight:800;color:#0d1b2a;line-height:1.1;letter-spacing:-.025em;margin:0 0 18px}
.csuh-about-p{font-family:'DM Sans','DM Sans Fallback',sans-serif;font-size:.97rem;color:#475569;line-height:1.8;margin:0 0 22px}
.csuh-feats{display:flex;flex-direction:column;gap:10px;margin-bottom:28px}
.csuh-feat{display:flex;align-items:flex-start;gap:10px;font-family:'DM Sans','DM Sans Fallback',sans-serif;font-size:.9rem;color:#334155;line-height:1.5}
.csuh-feat i{color:#16a34a;font-size:.95rem;margin-top:3px;flex-shrink:0}
.csuh-about-btns{display:flex;gap:12px;flex-wrap:wrap}
.csuh-btn-p{display:inline-flex;align-items:center;gap:8px;padding:13px 28px;background:linear-gradient(135deg,#1a365d,#2b6cb0);color:#fff;border-radius:8px;font-family:Inter,Inter Fallback,sans-serif;font-size:.9rem;font-weight:700;text-decoration:none;box-shadow:0 4px 16px rgba(26,54,93,.25);transition:all .2s}
.csuh-btn-p:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(26,54,93,.4);color:#fff}
.csuh-btn-o{display:inline-flex;align-items:center;gap:8px;padding:13px 28px;background:transparent;color:#1a365d;border:2px solid #1a365d;border-radius:8px;font-family:Inter,Inter Fallback,sans-serif;font-size:.9rem;font-weight:700;text-decoration:none;transition:all .2s}
.csuh-btn-o:hover{background:#1a365d;color:#fff;transform:translateY(-2px)}
.csuh-about-img-wrap{position:relative;border-radius:20px;overflow:hidden;box-shadow:0 24px 80px rgba(0,0,0,.18)}
.csuh-about-img-wrap img{width:100%;height:500px;object-fit:cover;display:block}
.csuh-img-ov{position:absolute;inset:0;background:linear-gradient(to bottom,transparent 40%,rgba(10,20,40,.65));pointer-events:none}
.csuh-badges{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);display:flex;gap:12px;z-index:2;white-space:nowrap}
.csuh-badge{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.14);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.28);border-radius:12px;padding:12px 18px;color:#fff}
.csuh-badge i{font-size:1.2rem;color:#60a5fa}
.csuh-badge strong{display:block;font-family:Inter,Inter Fallback,sans-serif;font-size:.88rem;font-weight:700;color:#fff;line-height:1.2}
.csuh-badge span{display:block;font-family:'DM Sans','DM Sans Fallback',sans-serif;font-size:.72rem;color:rgba(255,255,255,.6)}
@media(max-width:900px){.csuh-about{grid-template-columns:1fr;gap:36px}.csuh-about-img-wrap img{height:300px}}

/* ── WHY ── */
.elementor-element-hp-why{background:linear-gradient(180deg,#f0f7ff 0%,#f8fafc 100%)}
.csuh-why{max-width:1200px;margin:0 auto}
.csuh-sh{text-align:center;margin-bottom:52px}
.csuh-ey2{display:inline-flex;align-items:center;gap:8px;font-family:Inter,Inter Fallback,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#2b6cb0;background:#eff6ff;padding:5px 14px;border-radius:20px;margin-bottom:16px;border:1px solid #bfdbfe}
.csuh-sh-h{font-family:'Source Serif 4','Source Serif 4 Fallback',Georgia,serif;font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;color:#0d1b2a;letter-spacing:-.025em;line-height:1.1;margin:0 0 12px}
.csuh-sh-p{font-family:'DM Sans','DM Sans Fallback',sans-serif;font-size:.97rem;color:#64748b;max-width:520px;margin:0 auto;line-height:1.7}
.csuh-why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.csuh-wc{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:32px 28px;box-shadow:0 2px 16px rgba(0,0,0,.05);transition:all .3s;position:relative;overflow:hidden}
.csuh-wc:hover{transform:translateY(-6px);box-shadow:0 16px 48px rgba(26,54,93,.13);border-color:#bfdbfe}
.csuh-wi{width:58px;height:58px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:18px;flex-shrink:0}
.csuh-wi-blue{background:linear-gradient(135deg,#dbeafe,#eff6ff);color:#1d4ed8;border:1px solid #bfdbfe}
.csuh-wi-teal{background:linear-gradient(135deg,#ccfbf1,#f0fdfa);color:#0d9488;border:1px solid #99f6e4}
.csuh-wi-green{background:linear-gradient(135deg,#dcfce7,#f0fdf4);color:#16a34a;border:1px solid #86efac}
.csuh-wi-amber{background:linear-gradient(135deg,#fef3c7,#fffbeb);color:#d97706;border:1px solid #fcd34d}
.csuh-wi-red{background:linear-gradient(135deg,#fee2e2,#fff5f5);color:#dc2626;border:1px solid #fca5a5}
.csuh-wt{font-family:Inter,Inter Fallback,sans-serif;font-size:1.05rem;font-weight:800;color:#0f172a;margin:0 0 10px}
.csuh-wb{font-family:'DM Sans','DM Sans Fallback',sans-serif;font-size:.88rem;color:#475569;line-height:1.75;margin:0}
@media(max-width:900px){.csuh-why-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.csuh-why-grid{grid-template-columns:1fr}}

/* ── HOW TO ── */
.elementor-element-hp-howto{background:#fff}
.csuh-howto{max-width:1200px;margin:0 auto}
.csuh-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.csuh-step{padding:0 20px;text-align:center}
.csuh-step-top{display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.csuh-step-n{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#1a365d,#3b82f6);display:flex;align-items:center;justify-content:center;font-family:Inter,Inter Fallback,sans-serif;font-size:1.3rem;font-weight:900;color:#fff;box-shadow:0 4px 20px rgba(26,54,93,.35);flex-shrink:0;z-index:1}
.csuh-step-line{flex:1;height:2px;background:linear-gradient(90deg,#3b82f6,#93c5fd);margin-left:6px;opacity:.35}
.csuh-step-last .csuh-step-top{justify-content:flex-start;padding-left:calc(50% - 28px)}
.csuh-step-last .csuh-step-line{display:none}
.csuh-step-icon{width:52px;height:52px;background:#f0f7ff;border:1px solid #bfdbfe;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:#1d4ed8;margin:0 auto 16px}
.csuh-step-t{font-family:Inter,Inter Fallback,sans-serif;font-size:1rem;font-weight:800;color:#0f172a;margin:0 0 10px}
.csuh-step-b{font-family:'DM Sans','DM Sans Fallback',sans-serif;font-size:.86rem;color:#475569;line-height:1.7;margin:0}
.csuh-howto-cta{text-align:center;margin-top:44px}
.csuh-btn-p2{display:inline-flex;align-items:center;gap:8px;padding:14px 36px;background:linear-gradient(135deg,#1a365d,#2b6cb0);color:#fff;border-radius:8px;font-family:Inter,Inter Fallback,sans-serif;font-size:1rem;font-weight:700;text-decoration:none;box-shadow:0 4px 20px rgba(26,54,93,.3);transition:all .2s}
.csuh-btn-p2:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(26,54,93,.4);color:#fff}
@media(max-width:768px){.csuh-steps{grid-template-columns:1fr 1fr;gap:28px}.csuh-step-line{display:none}.csuh-step-last .csuh-step-top{justify-content:center;padding-left:0}}
@media(max-width:480px){.csuh-steps{grid-template-columns:1fr}}

/* ── GLASS TYPES ── */
.elementor-element-hp-glass{background:#f8fafc}
.csuh-glass{max-width:1200px;margin:0 auto}
.csuh-glass-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.csuh-gc{background:#fff;border:1px solid #e8eef4;border-radius:14px;padding:22px;text-decoration:none;transition:all .25s;display:block;position:relative;overflow:hidden}
.csuh-gc::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#3b82f6,#60a5fa);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.csuh-gc:hover{border-color:#93c5fd;box-shadow:0 8px 32px rgba(59,130,246,.13);transform:translateY(-4px)}
.csuh-gc:hover::after{transform:scaleX(1)}
.csuh-gi{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;margin-bottom:14px}
.csuh-gi-blue{background:linear-gradient(135deg,#dbeafe,#eff6ff);color:#1d4ed8;border:1px solid #bfdbfe}
.csuh-gi-sky{background:linear-gradient(135deg,#e0f2fe,#f0f9ff);color:#0284c7;border:1px solid #bae6fd}
.csuh-gi-green{background:linear-gradient(135deg,#dcfce7,#f0fdf4);color:#16a34a;border:1px solid #86efac}
.csuh-gi-amber{background:linear-gradient(135deg,#fef3c7,#fffbeb);color:#d97706;border:1px solid #fcd34d}
.csuh-gi-teal{background:linear-gradient(135deg,#ccfbf1,#f0fdfa);color:#0d9488;border:1px solid #99f6e4}
.csuh-gi-purple{background:linear-gradient(135deg,#ede9fe,#faf5ff);color:#6366f1;border:1px solid #c4b5fd}
.csuh-gi-slate{background:linear-gradient(135deg,#f1f5f9,#f8fafc);color:#475569;border:1px solid #cbd5e1}
.csuh-gt{font-family:Inter,Inter Fallback,sans-serif;font-size:.9rem;font-weight:800;color:#0f172a;margin:0 0 5px}
.csuh-gs{font-family:'DM Sans','DM Sans Fallback',sans-serif;font-size:.78rem;color:#64748b;margin:0;line-height:1.5}
@media(max-width:900px){.csuh-glass-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.csuh-glass-grid{grid-template-columns:repeat(2,1fr)}}

/* ── REVIEWS (dark section) ── */
.elementor-element-hp-reviews{background:linear-gradient(160deg,#0d1b2a 0%,#1a2744 50%,#1e293b 100%);color:#fff}
.csuh-reviews{max-width:1200px;margin:0 auto}
.csuh-ey-lt{display:inline-flex;align-items:center;gap:8px;font-family:Inter,Inter Fallback,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.7);background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);padding:5px 14px;border-radius:20px;margin-bottom:16px}
.csuh-sh-h-lt{font-family:'Source Serif 4','Source Serif 4 Fallback',Georgia,serif;font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;color:#fff;letter-spacing:-.025em;line-height:1.1;margin:0 0 16px}
.csuh-global-stars{display:flex;align-items:center;justify-content:center;gap:5px;color:#fbbf24;font-size:1rem}
.csuh-global-stars span{font-family:'DM Sans','DM Sans Fallback',sans-serif;font-size:.85rem;color:rgba(255,255,255,.5);margin-left:6px}
.csuh-rv-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.csuh-rv{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:28px;backdrop-filter:blur(8px);transition:all .3s}
.csuh-rv:hover{background:rgba(255,255,255,.1);transform:translateY(-4px);box-shadow:0 16px 48px rgba(0,0,0,.25);border-color:rgba(255,255,255,.2)}
.csuh-rv-q{font-size:1.8rem;color:rgba(255,255,255,.18);margin-bottom:12px;line-height:1}
.csuh-rv-txt{font-family:'DM Sans','DM Sans Fallback',sans-serif;font-size:.87rem;color:rgba(255,255,255,.78);line-height:1.75;margin:0 0 14px;font-style:italic}
.csuh-rv-stars{color:#fbbf24;font-size:.78rem;letter-spacing:2px;margin-bottom:16px}
.csuh-rv-auth{display:flex;align-items:center;gap:10px}
.csuh-rv-av{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#2b6cb0,#3b82f6);display:flex;align-items:center;justify-content:center;font-family:Inter,Inter Fallback,sans-serif;font-size:.9rem;font-weight:700;color:#fff;flex-shrink:0}
.csuh-rv-auth strong{display:block;font-family:Inter,Inter Fallback,sans-serif;font-size:.85rem;font-weight:700;color:#fff;line-height:1.3}
.csuh-rv-auth span{display:block;font-family:'DM Sans','DM Sans Fallback',sans-serif;font-size:.74rem;color:rgba(255,255,255,.45)}
@media(max-width:900px){.csuh-rv-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.csuh-rv-grid{grid-template-columns:1fr}}

/* ── PARTNERS ── */
.elementor-element-hp-partners{background:var(--bg3);border-top:1px solid var(--bdr);border-bottom:1px solid var(--bdr)}
.elementor-element-hp-partners img{filter:grayscale(60%) opacity(.55);transition:filter .3s}
.elementor-element-hp-partners img:hover{filter:grayscale(0%) opacity(1)}

/* ── CTA ── */
.elementor-element-hp-cta{padding:0!important}
.elementor-element-hp-cta .elementor-column-wrap,
.elementor-element-hp-cta .elementor-widget-wrap{padding:0!important}
.csuh-cta{background:linear-gradient(135deg,#0d1b2a 0%,#1a365d 50%,#1e3a8a 100%);padding:88px 40px;text-align:center;position:relative;overflow:hidden}
.csuh-cta-glow{position:absolute;inset:0;background:radial-gradient(ellipse 70% 70% at 50% 50%,rgba(59,130,246,.14) 0%,transparent 70%);pointer-events:none}
.csuh-cta-glow::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(-45deg,transparent,transparent 36px,rgba(255,255,255,.01) 36px,rgba(255,255,255,.01) 37px)}
.csuh-cta-inner{max-width:680px;margin:0 auto;position:relative;z-index:1}
.csuh-cta-badge{display:inline-flex;align-items:center;gap:8px;font-family:Inter,Inter Fallback,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#93c5fd;background:rgba(59,130,246,.15);border:1px solid rgba(59,130,246,.3);padding:6px 16px;border-radius:20px;margin-bottom:20px}
.csuh-cta-h{font-family:'Source Serif 4','Source Serif 4 Fallback',Georgia,serif;font-size:clamp(1.9rem,3.5vw,2.7rem);font-weight:800;color:#fff;letter-spacing:-.025em;line-height:1.08;margin:0 0 16px}
.csuh-cta-p{font-family:'DM Sans','DM Sans Fallback',sans-serif;font-size:1rem;color:rgba(255,255,255,.68);margin:0 0 36px;line-height:1.75}
.csuh-cta-btns{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-bottom:22px}
.csuh-cta-bw{display:inline-flex;align-items:center;gap:8px;padding:14px 32px;background:#fff;color:#1a365d;border-radius:8px;font-family:Inter,Inter Fallback,sans-serif;font-size:1rem;font-weight:700;text-decoration:none;box-shadow:0 4px 20px rgba(0,0,0,.2);transition:all .2s}
.csuh-cta-bw:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,0,0,.3);color:#0d1b2a}
.csuh-cta-bo{display:inline-flex;align-items:center;gap:8px;padding:14px 32px;background:transparent;color:#fff;border:2px solid rgba(255,255,255,.32);border-radius:8px;font-family:Inter,Inter Fallback,sans-serif;font-size:1rem;font-weight:700;text-decoration:none;transition:all .2s}
.csuh-cta-bo:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.6);color:#fff;transform:translateY(-2px)}
.csuh-cta-note{font-family:'DM Sans','DM Sans Fallback',sans-serif;font-size:.8rem;color:rgba(255,255,255,.35);margin:0;display:flex;align-items:center;justify-content:center;gap:6px}

/* ═══════════════════════════════════════════════
   HOMEPAGE DESIGN — POLISH PASS
═══════════════════════════════════════════════ */

/* ── HERO: taller, bigger type, right glow via multi-background ── */
.csu-hero-slide{
  min-height:680px!important;
  background:
    radial-gradient(ellipse 55% 80% at 78% 50%,rgba(59,130,246,.10) 0%,transparent 65%),
    linear-gradient(135deg,#0a1628 0%,#1a365d 55%,#0f2347 100%)!important
}
.csu-hero-heading{font-size:clamp(2.2rem,4.5vw,3.6rem)!important;letter-spacing:-.035em!important}
.csu-hero-content{position:relative;z-index:2}
.csu-hero-badge-wrap{z-index:2!important}

/* ── STATS: gradient top accent ── */
.csuh-stats::before{
  content:'';display:block;height:4px;
  background:linear-gradient(90deg,#0d1b2a 0%,#3b82f6 25%,#60a5fa 50%,#3b82f6 75%,#0d1b2a 100%)
}

/* ── ABOUT: left-edge vertical accent bar ── */
.csuh-about-text{position:relative;padding-left:24px}
.csuh-about-text::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:4px;
  background:linear-gradient(180deg,#3b82f6,#1a365d);
  border-radius:4px
}

/* ── WHY: always-on colored top border per card ── */
.csuh-wc{border-top-width:4px!important;border-top-style:solid!important}
.csuh-why-grid>.csuh-wc:nth-child(1),
.csuh-why-grid>.csuh-wc:nth-child(5){border-top-color:#2563eb!important}
.csuh-why-grid>.csuh-wc:nth-child(2){border-top-color:#0d9488!important}
.csuh-why-grid>.csuh-wc:nth-child(3){border-top-color:#16a34a!important}
.csuh-why-grid>.csuh-wc:nth-child(4){border-top-color:#d97706!important}
.csuh-why-grid>.csuh-wc:nth-child(6){border-top-color:#dc2626!important}

/* ── WHY: hover lift glow per icon color ── */
.csuh-why-grid>.csuh-wc:nth-child(1):hover,
.csuh-why-grid>.csuh-wc:nth-child(5):hover{box-shadow:0 16px 48px rgba(37,99,235,.14)!important}
.csuh-why-grid>.csuh-wc:nth-child(2):hover{box-shadow:0 16px 48px rgba(13,148,136,.14)!important}
.csuh-why-grid>.csuh-wc:nth-child(3):hover{box-shadow:0 16px 48px rgba(22,163,74,.14)!important}
.csuh-why-grid>.csuh-wc:nth-child(4):hover{box-shadow:0 16px 48px rgba(217,119,6,.14)!important}
.csuh-why-grid>.csuh-wc:nth-child(6):hover{box-shadow:0 16px 48px rgba(220,38,38,.14)!important}

/* ── GLASS: bigger icons ── */
.csuh-gi{width:56px!important;height:56px!important;font-size:1.35rem!important}

/* ── REVIEWS: decorative large quote mark behind section ── */
.elementor-element-hp-reviews{position:relative;overflow:hidden}
.elementor-element-hp-reviews::after{
  content:'"';position:absolute;
  top:-80px;left:-10px;font-size:24rem;
  color:rgba(255,255,255,.025);font-family:Georgia,serif;
  line-height:1;pointer-events:none;z-index:0;
  user-select:none
}
.csuh-reviews{position:relative;z-index:1}

/* ── CTA: decorative circles ── */
.csuh-cta::before{
  content:'';position:absolute;
  top:-120px;right:-120px;
  width:440px;height:440px;border-radius:50%;
  background:radial-gradient(circle,rgba(59,130,246,.12) 0%,transparent 70%);
  pointer-events:none
}
.csuh-cta-h{font-size:clamp(2rem,3.8vw,3rem)!important}

/* ── TYPOGRAPHY: ensure Source Serif 4 on all section headings ── */
.csuh-about-h,.csuh-sh-h,.csuh-sh-h-lt,.csuh-cta-h,.csuh-sec-h3{
  font-family:'Source Serif 4','Source Serif 4 Fallback',Georgia,serif!important
}

/* ── PARTNER logos ── */
.elementor-element-hp-partners{background:#f8fafc;border-top:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0}
.elementor-element-hp-partners img{filter:grayscale(70%) opacity(.5);transition:filter .35s}
.elementor-element-hp-partners img:hover{filter:none}