
:root{
 --pad:48px;
 --brand:#0C1D4E;
 --bg:#070A12;
 --ink:#0A0E1C;
 --max:1840px;
 
 --radius:24px;
 --radius2:16px;
 --line:rgba(0,0,0,0.08);
 --lineW:rgba(255,255,255,0.14);
 --shadow:0 18px 70px rgba(0,0,0,0.12);
 --shadowD:0 40px 120px rgba(12,29,78,0.36);
}
*{box-sizing:border-box}
html,body{height:100%;}
html{font-size:20px;}
body{
 margin:0;
 font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
 color:var(--ink);
 background:#fff;
 -webkit-font-smoothing:antialiased;
 text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}
.section{width:100%}
.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
@media(max-width:980px){:root{--pad:18px}}
.header{
 position:sticky;top:0;z-index:60;
 background:rgba(255,255,255,0.86);
 backdrop-filter:none;
 border-bottom:1px solid rgba(0,0,0,0.05);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0}
.nav{display:none;gap:22px;align-items:center}
.nav a{font-size:18px;font-weight:720;color:rgba(0,0,0,0.62)}
.nav a:hover{color:rgba(0,0,0,0.9)}
.nav a.active{color:rgba(0,0,0,0.92);text-decoration:underline;text-underline-offset:10px;text-decoration-thickness:2px}
@media(min-width:1040px){.nav{display:flex}}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;
 padding:14px 20px;font-size:18px;font-weight:780;border:1px solid rgba(0,0,0,0.10);
 background:#fff;color:var(--ink);transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease}
.btn:hover{transform:translateY(-1px);box-shadow:0 12px 40px rgba(0,0,0,0.12)}
.btn:active{transform:translateY(0)}
.btn-primary{border:0;background:var(--brand);color:#fff;box-shadow:0 26px 80px rgba(12,29,78,0.34)}
.btn-primary:hover{opacity:.98;box-shadow:0 34px 100px rgba(12,29,78,0.42)}
.btn-ghost{background:transparent;border:1px solid rgba(255,255,255,0.18);color:rgba(255,255,255,0.92)}
.btn-ghost:hover{background:rgba(255,255,255,0.06)}
.kicker{font-size:13px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:rgba(0,0,0,0.52)}
.kicker.light{color:rgba(255,255,255,0.62)}
.h1{margin:14px 0 0;font-size:clamp(56px,7.2vw,144px);line-height:1.02;letter-spacing:-0.05em;font-weight:900}
.h2{margin:10px 0 0;font-size:clamp(38px,4.2vw,78px);line-height:1.08;letter-spacing:-0.035em;font-weight:860}
.sub{margin:18px 0 0;font-size:clamp(18px,1.55vw,28px);line-height:1.7;color:rgba(0,0,0,0.62);max-width:880px}
.p{margin:14px 0 0;font-size:26px;line-height:1.75;color:rgba(0,0,0,0.62);max-width:920px}
.small{font-size:16px;color:rgba(0,0,0,0.55)}
.hero{position:relative;overflow:hidden;background:radial-gradient(1200px 700px at 16% 18%,rgba(255,255,255,0.10),transparent 60%),
radial-gradient(1000px 650px at 84% 52%,rgba(12,29,78,0.62),transparent 62%),
linear-gradient(180deg,#050712,var(--bg));color:#fff}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,7,18,0.25),rgba(5,7,18,0.78));opacity:.55;pointer-events:none}
.hero-inner{position:relative;padding:124px 0 88px}
.hero-grid{display:grid;gap:28px}
@media(min-width:1100px){.hero-grid{grid-template-columns:1.12fr 0.88fr;align-items:center}}
.pill{display:inline-flex;align-items:center;gap:10px;border-radius:999px;border:1px solid rgba(255,255,255,0.14);
background:rgba(255,255,255,0.06);padding:10px 14px;font-size:13px;font-weight:900;color:rgba(255,255,255,0.74)}
.pill i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,0.80);box-shadow:0 0 40px rgba(255,255,255,0.22)}
.hero-actions{margin-top:26px;display:flex;gap:12px;flex-wrap:wrap}
.trustbar{margin-top:18px;display:flex;flex-wrap:wrap;gap:10px;color:rgba(255,255,255,0.62);font-size:13px;font-weight:780}
.trustbar span{border-radius:999px;border:1px solid rgba(255,255,255,0.12);background:rgba(255,255,255,0.05);padding:8px 11px}
.hero-marquee{margin-top:26px;border-top:1px solid rgba(255,255,255,0.10);border-bottom:1px solid rgba(255,255,255,0.10);
background:rgba(255,255,255,0.03);overflow:hidden}
.marquee-track{display:flex;gap:26px;white-space:nowrap;padding:12px 0;justify-content:center;
animation:marquee 22s linear infinite;font-size:13px;font-weight:900;color:rgba(255,255,255,0.62)}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.fade{height:84px;background:linear-gradient(180deg,rgba(7,10,18,1),rgba(255,255,255,1))}
.section-pad{padding:124px 0}
.section-pad.compact{padding-top:0}
.section-dark{background:radial-gradient(900px 520px at 20% 10%,rgba(255,255,255,0.08),transparent 60%),
radial-gradient(900px 520px at 80% 80%,rgba(12,29,78,0.38),transparent 58%),
linear-gradient(180deg,#070A12,#0A0E1C);color:#fff}
.section-dark .p{color:rgba(255,255,255,0.74)}
.grid3{margin-top:28px;display:grid;gap:18px}
@media(min-width:1040px){.grid3{grid-template-columns:repeat(3,1fr)}}
.card{border-radius:var(--radius);border:1px solid var(--line);background:#fff;padding:26px;box-shadow:var(--shadow);color:#0b0f1a}
.card.dark{border:1px solid var(--lineW);background:rgba(255,255,255,0.06);box-shadow:var(--shadowD);color:#fff}
.tt{font-weight:900;font-size:20px;letter-spacing:-.01em}
.dd{margin-top:12px;color:rgba(0,0,0,0.62);font-size:20px;line-height:1.75}
.card.dark .dd{color:rgba(255,255,255,0.72)}
.pricing{margin-top:32px;display:grid;gap:18px}
@media(min-width:1040px){.pricing{grid-template-columns:repeat(3,1fr)}}
.plan{border-radius:var(--radius);border:1px solid var(--line);background:#fff;padding:28px;box-shadow:var(--shadow);color:#0b0f1a}
.plan.featured{border:2px solid rgba(12,29,78,0.45);background:linear-gradient(180deg, rgba(12,29,78,0.10), #fff)}
.price{margin-top:14px;font-size:54px;font-weight:920;letter-spacing:-.03em}
.plan ul{margin:16px 0 0;padding:0;list-style:none;display:grid;gap:10px}
.plan li{font-size:18px;color:rgba(0,0,0,0.70);display:flex;gap:10px;line-height:1.6}
.check{width:10px;height:10px;border-radius:50%;background:var(--brand);margin-top:9px;flex:none}
[data-reveal]{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease;filter:none;}
[data-reveal].reveal{opacity:1;transform:translateY(0)}
.shine{position:relative;display:inline-block}
.shine::after{content:"";position:absolute;inset:-6px -10px;border-radius:14px;
background:linear-gradient(90deg,transparent,rgba(255,255,255,0.20),transparent);
transform:translateX(-120%);opacity:.85;animation:shine 5.8s ease-in-out infinite}
@keyframes shine{0%{transform:translateX(-120%)}35%{transform:translateX(120%)}100%{transform:translateX(120%)}}
.footer{border-top:1px solid rgba(0,0,0,0.06);padding:52px 0;color:rgba(0,0,0,0.62)}
.footer-grid{display:grid;gap:18px}
@media(min-width:1040px){.footer-grid{grid-template-columns:1.6fr 1fr 1fr}}


.full-bleed{width:100%;}
.full-bleed .wrap{max-width:var(--max);}


/* Hero UI mock */
.ui-mock{
  border-radius:28px;
  border:1px solid rgba(255,255,255,0.14);
  background:linear-gradient(180deg,rgba(255,255,255,0.10),rgba(255,255,255,0.04));
  box-shadow:var(--shadowD);
  overflow:hidden;
}
.ui-top{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,0.12);
}
.ui-dots{display:flex;gap:8px}
.ui-dots span{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,0.22)}
.ui-title{font-weight:900;letter-spacing:-.02em;color:#0A0E1C;font-size:14px}
.ui-body{padding:16px;display:grid;gap:14px}
.ui-grid{display:grid;gap:12px}
@media(min-width:900px){.ui-grid{grid-template-columns:1fr 1fr}}
.ui-card{
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(255,255,255,0.05);
  padding:14px;
}
.ui-metric{font-size:12px;color:rgba(255,255,255,0.66);font-weight:800}
.ui-value{margin-top:8px;font-size:22px;color:#fff;font-weight:950;letter-spacing:-.03em}
.ui-spark{
  margin-top:10px;height:10px;border-radius:999px;
  background:linear-gradient(90deg,rgba(255,255,255,0.14),rgba(255,255,255,0.34),rgba(255,255,255,0.14));
  background-size:200% 100%;
  animation:spark 2.2s linear infinite;
}
@keyframes spark{0%{background-position:0% 0}100%{background-position:200% 0}}
.ui-feed{display:grid;gap:10px}
.ui-row{display:flex;justify-content:space-between;gap:10px;font-size:13px;color:rgba(255,255,255,0.76)}
.ui-row b{color:#fff}
.pulse{
  display:inline-block;
  background:linear-gradient(90deg,rgba(255,255,255,0.96),rgba(147,197,253,0.96),rgba(255,255,255,0.96));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  background-size:200% 100%;
  animation:shineMove 2.8s ease-in-out infinite;
}
@keyframes shineMove{0%{background-position:0% 0}50%{background-position:100% 0}100%{background-position:0% 0}}

/* Mobile menu */
.menu-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  padding:12px 14px;
  border:1px solid rgba(0,0,0,0.10);
  background:#fff;
  font-weight:900;
  font-size:16px;
}
@media(min-width:1040px){.menu-btn{display:none}}
.drawer{
  position:fixed;inset:0;
  background:rgba(0,0,0,0.45);
  backdrop-filter:none;
  opacity:0;pointer-events:none;
  transition:opacity .18s ease;
  z-index:80;
}
.drawer.open{opacity:1;pointer-events:auto}
.drawer-panel{
  position:absolute;top:0;right:0;height:100%;width:min(92vw,420px);
  background:#fff;
  padding:20px;
  box-shadow:0 40px 120px rgba(0,0,0,0.25);
  transform:translateX(14px);
  transition:transform .18s ease;
  display:flex;flex-direction:column;gap:16px;
}
.drawer.open .drawer-panel{transform:translateX(0)}
.drawer a{font-size:20px;font-weight:850;color:rgba(0,0,0,0.78);padding:10px 8px;border-radius:12px}
.drawer a:hover{background:rgba(0,0,0,0.05);color:rgba(0,0,0,0.92)}
.drawer-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.drawer-close{border:0;background:transparent;font-size:18px;font-weight:900;padding:10px 12px;border-radius:12px}
.drawer-close:hover{background:rgba(0,0,0,0.06)}


/* V11: Blur-safe reveal (visible by default) */
[data-reveal]{opacity:1;transform:none;filter:none;}
.js [data-reveal]{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease;}
.js [data-reveal].reveal{opacity:1;transform:none;}
.reveal{filter:none !important;}


/* ==== StaffAi v12 conversion + typography upgrades (locked specs) ==== */
body{font-size:20px;line-height:1.65}
p,li{font-size:20px;line-height:1.7}
.small{font-size:18px}

/* Hero headline hierarchy */



.hero-line2{position:relative;display:inline-block;transform-origin:50% 60%;animation:opPulse 5s ease-in-out infinite}
@keyframes opPulse{0%,78%{transform:scale(1)}84%{transform:scale(1.04)}92%{transform:scale(1)}100%{transform:scale(1)}}

/* Billing toggle */
.billing-toggle{display:inline-flex;gap:6px;align-items:center;border:1px solid var(--line);border-radius:999px;padding:6px;background:rgba(0,0,0,0.04)}
.billing-toggle button{border:0;background:transparent;padding:10px 14px;border-radius:999px;font-weight:850;cursor:pointer;font-size:15px}
.billing-toggle button[aria-pressed="true"]{background:#0C1D4E;color:#fff}
.billing-note{margin-left:12px;font-weight:850;color:rgba(0,0,0,0.65);font-size:15px}

/* Pricing cards */
.price{font-size:54px;font-weight:950;letter-spacing:-.04em;margin-top:10px}
.price small{display:block;font-size:15px;font-weight:850;letter-spacing:0;color:rgba(0,0,0,0.60);margin-top:6px}
.plan .who{margin-top:10px;font-size:18px;color:rgba(0,0,0,0.64);line-height:1.65;max-width:46ch}
.badge{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:8px 12px;font-weight:950;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.badge.popular{background:rgba(12,29,78,0.10);border:1px solid rgba(12,29,78,0.22);color:#0C1D4E}

/* Comparison table */
.compare{margin-top:28px;border-radius:var(--radius);border:1px solid var(--line);overflow:hidden;background:#fff;box-shadow:var(--shadow)}
.compare table{width:100%;border-collapse:separate;border-spacing:0;min-width:980px}
.compare thead th{position:sticky;top:0;background:#fff;z-index:2;border-bottom:1px solid var(--line);padding:16px 14px;text-align:left;font-weight:950;letter-spacing:-.02em}
.compare thead th.tier{white-space:nowrap}
.compare tbody th{position:sticky;left:0;background:#fff;z-index:1;border-right:1px solid var(--line);padding:14px;text-align:left;font-weight:900;color:rgba(0,0,0,0.78)}
.compare td{padding:14px;border-bottom:1px solid var(--line);text-align:center;font-weight:850;color:rgba(0,0,0,0.72)}
.compare tr:last-child td, .compare tr:last-child th{border-bottom:0}
.compare .yes{color:#0C1D4E}
.compare .muted{color:rgba(0,0,0,0.38);font-weight:800}
.compare-wrap{overflow:auto}

/* Tooltips */
.tip{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:999px;border:1px solid rgba(0,0,0,0.22);font-size:12px;font-weight:950;margin-left:8px;cursor:help;color:rgba(0,0,0,0.65)}
[data-tip]{position:relative}
[data-tip]:hover::after{content:attr(data-tip);position:absolute;left:0;top:100%;margin-top:10px;min-width:260px;max-width:420px;padding:12px 12px;border-radius:14px;background:#0B0F14;color:#E6EDF3;font-size:14px;line-height:1.5;box-shadow:0 18px 70px rgba(0,0,0,0.25);z-index:50}
[data-tip]:hover::before{content:"";position:absolute;left:18px;top:100%;margin-top:3px;border:8px solid transparent;border-bottom-color:#0B0F14;z-index:51}

/* Roadmap timeline */
.timeline{margin-top:26px;display:grid;gap:18px}
.milestone{border-radius:var(--radius);border:1px solid var(--line);background:#fff;padding:22px;box-shadow:var(--shadow)}
.milestone .ms-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.ms-status{display:inline-flex;align-items:center;gap:10px;font-weight:950}
.dot{width:12px;height:12px;border-radius:999px;background:rgba(0,0,0,0.18)}
.dot.done{background:#238636}
.dot.now{background:#2563EB;box-shadow:0 0 0 6px rgba(37,99,235,0.12)}
.dot.soon{background:rgba(0,0,0,0.22)}
.dot.future{background:transparent;border:2px solid rgba(0,0,0,0.22)}
.milestone ul{margin:14px 0 0;padding:0;list-style:none;display:grid;gap:10px}
.milestone li{font-size:18px;color:rgba(0,0,0,0.70);display:flex;gap:10px;line-height:1.6}
.milestone li::before{content:"✓";font-weight:950;color:rgba(12,29,78,0.85)}

/* Portal shell (static front end) */
.portal-shell{min-height:calc(100vh - 120px);display:grid;grid-template-columns:280px 1fr;gap:18px}
@media(max-width:980px){.portal-shell{grid-template-columns:1fr}}
.sidebar{border-radius:var(--radius);border:1px solid rgba(255,255,255,0.14);background:#0B0F14;color:#E6EDF3;padding:18px;box-shadow:var(--shadowD)}
.sidebar a{display:flex;align-items:center;justify-content:space-between;padding:12px 12px;border-radius:14px;color:#E6EDF3;opacity:.92}
.sidebar a:hover{background:rgba(255,255,255,0.06);opacity:1}
.portal-main{border-radius:var(--radius);border:1px solid var(--line);background:#fff;padding:22px;box-shadow:var(--shadow)}
.plan-badge{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:10px 12px;font-weight:950;font-size:12px;letter-spacing:.12em;text-transform:uppercase;border:1px solid rgba(0,0,0,0.12)}
.locked{opacity:.55}
.lockline{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid rgba(0,0,0,0.08)}
.lockline:last-child{border-bottom:0}
.theme-toggle{display:inline-flex;align-items:center;gap:10px}



/* === STAFFAI HERO FIXES (2026-02-15) === */
.hero .wrap{padding-left:72px;}
@media(max-width:980px){.hero .wrap{padding-left:var(--pad);}}

/* Keep the 'shine' overlay on 'Your Entire' (span.shine). Adjust hierarchy + move pulse to 24/7. */
.hero 
.hero 
.hero 


/* === STAFFAI OVERLAY FIX === */

.overlay,
.overlay-gradient,
.hero-overlay,
.background-text,
.hero-bg-text,
.watermark {
    opacity: 0.05 !important;
    z-index: 0 !important;
    pointer-events: none !important;
}

.hero-content,
.page-content,
.main-content,
.container {
    position: relative !important;
    z-index: 2 !important;
}


/* === STAFFAI CONTRAST FIX === */

.addon,
.addon-card,
.addon-item,
.addons,
.addon *,
.addon-card *,
.addon-item *,
.addons * {
    color: #0F172A !important;
    background-color: #FFFFFF !important;
}

.stat,
.stat-card,
.stats,
.stat *,
.stat-card *,
.stats * {
    color: #0F172A !important;
}

.stat-number {
    color: #0B1F44 !important;
    font-weight: 800 !important;
}


/* === STAFFAI PREMIUM FORMS === */

form input,
form textarea,
form select {
    background: #FFFFFF !important;
    color: #0F172A !important;
    border: 1px solid #D0D7E2 !important;
    border-radius: 12px !important;
    padding: 16px !important;
    font-size: 17px !important;
}

form input:focus,
form textarea:focus,
form select:focus {
    border-color: #2F81F7 !important;
    box-shadow: 0 0 0 4px rgba(47,129,247,0.15) !important;
    outline: none !important;
}


/* FIX: ensure ui-title is white only on dark backgrounds */
.section-dark .ui-title,
.hero .ui-title,
.ui-mock .ui-title{
  color:rgba(255,255,255,0.86);
}

/* FIX: ensure card text always visible */
.card, .plan, .ui-card{
  color:#0A0E1C;
}

/* FIX: prevent overlays hiding text */
.card, .ui-card{
  position:relative;
  z-index:2;
}

/* PREMIUM polish */
.card:hover, .plan:hover{
  transform:translateY(-4px);
  transition:transform .2s ease;
}

/* FINAL HERO SCALING FIX */
.hero-container {
    max-width: 1400px;
    padding-left: 80px;
    padding-right: 80px;
}

.hero-your-entire {
    font-size: clamp(48px, 5vw, 96px);
    margin-bottom: 0.08em;
}

.hero-revenue-generation {
    font-size: clamp(72px, 8vw, 150px);
    line-height: 0.88;
    margin-bottom: 0.08em;
}

.hero-247 {
    animation: pulseGlow 2.5s infinite;
    margin-top: 0.02em;
}

/* Remove overlay obstruction */
.card::before,
.card::after,
.overlay,
.gradient-overlay,
.blur-overlay {
    display: none !important;
}

.industry-card {
    position: relative;
    z-index: 1;
    background: #ffffff;
}

/* STRUCTURAL HERO FIX */
.hero, .hero-inner {
    max-width: 1100px;
    padding-left: 80px;
    padding-right: 80px;
}

.hero-headline {
    display: flex;
    flex-direction: column;
}

.hero-your {
    font-size: clamp(56px, 5vw, 96px);
    line-height: 0.90;
    margin-bottom: 0.05em;
}

.hero-revenue {
    font-size: clamp(84px, 7vw, 140px);
    line-height: 0.88;
    margin-top: 0;
    margin-bottom: 0.05em;
}

.hero-247 {
    margin-top: 0;
}

/* Remove any overlay obstruction completely */
.decor, .blob, .shape, .overlay {
    display: none !important;
}


/* ===== TRUE HERO FIX (direct override of controlling selectors) ===== */
.h1 {
    max-width: 1100px;
}

.h1 .hero-line1 {
    display:block;
    font-size: clamp(48px, 4.5vw, 90px);
    line-height: 0.92;
    margin-bottom: 0.02em;
}

.h1 .hero-line2 {
    display:block;
    font-size: clamp(72px, 6.5vw, 130px);
    line-height: 0.88;
    margin-bottom: 0.02em;
}

.h1 .hero-line3 {
    display:block;
    font-size: clamp(40px, 3.5vw, 70px);
    line-height: 0.95;
    margin-top: 0;
}

/* ===== TRUE INDUSTRIES FIX ===== */
.card {
    overflow: visible !important;
}

.card::before,
.card::after {
    content: none !important;
    display: none !important;
}




/* ===== PATCH V2: Hero sizing without changing font weight ===== */
.hero .h1{
  max-width: 1100px;
  font-size: clamp(56px, 6vw, 128px);
}

/* Keep Revenue Operation dominant but prevent edge clipping */
.hero .h1 .hero-line2{
  font-size: 1.55em;          /* relative to .h1 */
  line-height: 0.88;
  white-space: normal;         /* allow wrap if needed */
  word-break: keep-all;
}

/* Your Entire size */
.hero .h1 .hero-line1{
  font-size: 1em;
  line-height: 0.92;
  margin-bottom: 0.04em;
}

/* 24/7 unchanged in relative size, tighter spacing */
.hero .h1 .hero-line3{
  margin-top: 0;
  line-height: 0.95;
}

/* Reduce vertical gaps between all three lines */
.hero .h1 .hero-line1,
.hero .h1 .hero-line2{
  margin-bottom: 0.04em;
}

/* Industries obstruction: remove pseudo overlays + ensure cards don't clip */
.card::before,
.card::after{
  content: none !important;
  display: none !important;
}
.card{
  overflow: visible !important;
}



/* ===== FINAL HERO FULL-WIDTH FIX ===== */
.hero{
    width: 100%;
}

.hero .wrap{
    max-width: 1400px;
    margin-left: 80px;
    margin-right: 80px;
}

.hero-inner{
    width: 100%;
}

.hero-grid{
    width: 100%;
}


/* ===== Premium Typography + Layout Overrides (v12) ===== */
:root{
  --pad:56px;
  --max:1840px;
  --bg:#070A12;
  --ink:#0A0E1C;
  --brand:#0C1D4E;
  --brand2:#2B6BFF;
  --text:#EAF0FF;
  --muted:rgba(234,240,255,0.72);
  --muted2:rgba(234,240,255,0.56);
  --lineW:rgba(255,255,255,0.12);
  --radius:28px;
  --radius2:18px;
}
body{
  font-family:"Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  font-size:19px;
  line-height:1.6;
}
.h1{font-size:72px;letter-spacing:-0.02em;line-height:1.02}
.h2{font-size:44px;letter-spacing:-0.02em;line-height:1.12}
.sub{font-size:26px;color:var(--muted);max-width:66ch}
.section{padding:clamp(84px, 8vw, 160px) 0}
@media (max-width:980px){
  body{font-size:17px}
  .h1{font-size:52px}
  .h2{font-size:34px}
  .sub{font-size:20px}
}
@media (max-width:620px){
  .h1{font-size:38px}
  .h2{font-size:28px}
  .sub{font-size:18px}
}

/* Header brand sizing */
.brand-logo{height:32px;width:auto;display:block}
.footer-logo{height:28px;width:auto;opacity:.95}

/* ===== Hero intensity layers ===== */
.hero{
  position:relative;
  overflow:hidden;
}
.hero-field{
  position:absolute;inset:-120px;
  background:radial-gradient(60% 60% at 20% 25%, rgba(43,107,255,0.18), transparent 60%),
             radial-gradient(60% 60% at 80% 60%, rgba(12,29,78,0.30), transparent 55%),
             radial-gradient(50% 50% at 30% 80%, rgba(43,107,255,0.10), transparent 60%);
  filter:blur(10px);
  animation:fieldDrift 18s ease-in-out infinite alternate;
  pointer-events:none;
  opacity:.85;
}
@keyframes fieldDrift{
  0%{transform:translate3d(-1%, -1%, 0) scale(1.02)}
  100%{transform:translate3d(1.5%, 1.2%, 0) scale(1.04)}
}
.hero-glow{
  position:absolute;inset:0;
  background:radial-gradient(520px 520px at var(--gx, 50%) var(--gy, 40%), rgba(43,107,255,0.18), transparent 60%);
  pointer-events:none;
  opacity:.9;
}
.grain{
  position:absolute;inset:0;
  background-image:url("/assets/grain.png");
  opacity:0.07;
  mix-blend-mode:overlay;
  pointer-events:none;
}

/* ===== Widget (StaffAi) ===== */
.sa-widget{position:fixed;right:22px;bottom:22px;z-index:9999;font-size:15px}
.sa-fab{display:flex;align-items:center;gap:12px;background:rgba(8,10,18,0.86);border:1px solid rgba(255,255,255,0.16);color:#fff;padding:16px 18px;border-radius:999px;box-shadow:0 26px 110px rgba(0,0,0,0.44);cursor:pointer;backdrop-filter:blur(14px);min-height:56px}
.sa-fab:hover{transform:translateY(-1px)}
.sa-fab{min-height:54px}
.sa-fab-dot{width:12px;height:12px;border-radius:50%;background:rgba(43,107,255,0.92);box-shadow:0 0 0 7px rgba(43,107,255,0.14);animation:saPulse 2.4s infinite ease-in-out}
.sa-fab-label{font-weight:800;letter-spacing:-0.01em}
@keyframes saPulse{
  0%{box-shadow:0 0 0 7px rgba(43,107,255,0.14);opacity:0.88}
  55%{box-shadow:0 0 0 14px rgba(43,107,255,0.08);opacity:1}
  100%{box-shadow:0 0 0 7px rgba(43,107,255,0.14);opacity:0.88}
}
.sa-panel{position:absolute;right:0;bottom:78px;width:480px;height:700px;border-radius:22px;border:1px solid rgba(255,255,255,0.14);background:rgba(8,10,18,0.88);backdrop-filter:blur(18px);box-shadow:0 40px 160px rgba(0,0,0,0.55);overflow:hidden;transform-origin:bottom right}
.sa-panel.sa-peek{
  height:min(360px, calc(100vh - 180px));
}
.sa-top{display:flex;justify-content:space-between;gap:12px;padding:14px 14px 10px;border-bottom:1px solid rgba(255,255,255,0.10)}
.sa-title{font-weight:900;letter-spacing:-0.02em}
.sa-sub{font-size:12px;color:rgba(255,255,255,0.66)}
.sa-iconbtn{
  width:34px;height:34px;border-radius:12px;
  background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.10);
  color:#fff;cursor:pointer;
}
.sa-iconbtn:hover{background:rgba(255,255,255,0.10)}
.sa-body{padding:14px;height:calc(100% - 190px);overflow:auto}
.sa-msg{display:flex;margin:10px 0}
.sa-msg-ai{justify-content:flex-start}
.sa-msg-user{justify-content:flex-end}
.sa-bubble{
  max-width:82%;
  padding:12px 12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(255,255,255,0.06);
  color:#fff;
  white-space:pre-wrap;
}
.sa-msg-user .sa-bubble{
  background:rgba(43,107,255,0.18);
  border-color:rgba(43,107,255,0.26);
}
.sa-typing{display:flex;align-items:center;gap:10px;padding:0 14px 10px;color:rgba(255,255,255,0.66)}
.sa-typing-dots{display:flex;gap:6px}
.sa-typing-dots span{
  width:7px;height:7px;border-radius:50%;
  background:rgba(255,255,255,0.52);
  animation:dot 1.0s infinite ease-in-out;
}
.sa-typing-dots span:nth-child(2){animation-delay:.15s}
.sa-typing-dots span:nth-child(3){animation-delay:.30s}
@keyframes dot{0%,100%{transform:translateY(0);opacity:.55}50%{transform:translateY(-4px);opacity:1}}
.sa-form{display:flex;gap:10px;padding:12px 14px;border-top:1px solid rgba(255,255,255,0.10)}
.sa-input{
  flex:1;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.12);
  border-radius:14px;
  color:#fff;
  padding:12px 12px;
  outline:none;
}
.sa-send{
  padding:12px 14px;border-radius:14px;
  border:1px solid rgba(43,107,255,0.35);
  background:rgba(43,107,255,0.22);
  color:#fff;font-weight:800;cursor:pointer;
}
.sa-send:hover{background:rgba(43,107,255,0.28)}
.sa-footnote{padding:0 14px 14px;font-size:12px;color:rgba(255,255,255,0.56)}
.sa-footnote a{color:rgba(234,240,255,0.92)}

/* ===== Footer status pill ===== */
.status-pill{
  display:inline-flex;align-items:center;gap:8px;
  margin-top:16px;
  padding:10px 12px;
  border-radius:999px;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.12);
  color:rgba(234,240,255,0.88);
  font-size:13px;
}
.status-pill .dot{width:9px;height:9px;border-radius:50%;background:rgba(34,197,94,0.9);box-shadow:0 0 0 6px rgba(34,197,94,0.12)}

/* ===== Portal shell ===== */
body[data-layout="portal"]{background:var(--bg)}
.portal-topbar{
  position:sticky;top:0;z-index:20;
  background:rgba(7,10,18,0.74);
  border-bottom:1px solid rgba(255,255,255,0.10);
  backdrop-filter: blur(18px);
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 18px;
}
.portal-logo{height:26px;width:auto}
.portal-plan{
  padding:8px 10px;border-radius:999px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(255,255,255,0.06);
  color:rgba(234,240,255,0.92);
  font-weight:800;font-size:13px;
}
.btn-small{padding:10px 12px;font-size:13px}


/* ===== Pricing template utilities ===== */
.grid{display:grid;gap:18px}
.grid-3{grid-template-columns:repeat(3, minmax(0,1fr))}
.grid-5{grid-template-columns:repeat(5, minmax(0,1fr))}
@media (max-width:1200px){.grid-5{grid-template-columns:repeat(2, minmax(0,1fr))}}
@media (max-width:620px){.grid-3,.grid-5{grid-template-columns:1fr}}

.card-dark{
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(255,255,255,0.06);
  padding:26px;
  color:#fff;
  box-shadow:0 26px 110px rgba(0,0,0,0.30);
  backdrop-filter: blur(16px);
}
.pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 10px;border-radius:999px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(255,255,255,0.06);
  font-weight:800;font-size:13px;
}
.price{font-size:38px;font-weight:950;letter-spacing:-0.03em;margin-top:14px}
.price span{font-size:14px;font-weight:800;opacity:.72;margin-left:6px}
.muted{color:rgba(234,240,255,0.70);margin-top:6px}
.list{display:grid;gap:10px;margin-top:16px;color:rgba(234,240,255,0.86);font-size:17px}
.h3{font-size:22px;font-weight:900;letter-spacing:-0.02em}
.mini{padding:14px;border-radius:16px;border:1px solid rgba(0,0,0,0.08);background:rgba(255,255,255,0.8)}
.card .mini{background:#fff}
.mini-title{font-weight:900;letter-spacing:-0.02em}
.mini-sub{opacity:.72;margin-top:4px}
.trust-bar{display:flex;flex-wrap:wrap;gap:10px}
.trust-item{padding:10px 12px;border-radius:999px;border:1px solid rgba(255,255,255,0.14);background:rgba(255,255,255,0.06);color:rgba(234,240,255,0.88);font-size:13px;font-weight:700}


/* ===== Portal UI ===== */
.portal{display:grid;grid-template-columns:280px 1fr;min-height:calc(100vh - 64px)}
@media (max-width:980px){.portal{grid-template-columns:1fr}.portal-side{position:static}}
.portal-side{
  border-right:1px solid rgba(255,255,255,0.10);
  background:rgba(255,255,255,0.03);
  padding:18px;
  position:sticky;top:64px;align-self:start;height:calc(100vh - 64px);overflow:auto;
}
.portal-side-title{font-weight:950;color:#fff;letter-spacing:-0.02em}
.portal-side-sub{color:rgba(234,240,255,0.66);font-size:13px;margin-top:6px}
.portal-nav{display:grid;gap:8px;margin-top:16px}
.portal-nav a{
  padding:10px 12px;border-radius:14px;
  border:1px solid rgba(255,255,255,0.10);
  background:rgba(255,255,255,0.04);
  color:rgba(234,240,255,0.88);
  text-decoration:none;
  font-weight:700;
}
.portal-nav a:hover{background:rgba(255,255,255,0.07)}
.portal-nav a.active{border-color:rgba(43,107,255,0.32);background:rgba(43,107,255,0.14)}
.portal-nav-muted{opacity:.65}

.portal-main{padding:22px 22px 40px}
.portal-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}
@media(max-width:820px){.portal-head{flex-direction:column}}
.portal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:22px}
@media(max-width:980px){.portal-grid{grid-template-columns:1fr}}
.portal-card{
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(255,255,255,0.05);
  box-shadow:0 28px 120px rgba(0,0,0,0.32);
  padding:18px;
  color:#fff;
  backdrop-filter: blur(16px);
}
.portal-card-title{font-weight:950;letter-spacing:-0.02em;margin-bottom:10px}
.portal-meters{display:grid;gap:12px}
.meter-top{display:flex;justify-content:space-between;color:rgba(234,240,255,0.86);font-weight:800;font-size:13px}
.meter-bar{height:10px;border-radius:999px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.10);overflow:hidden}
.meter-fill{height:100%;background:rgba(43,107,255,0.45)}
.portal-roles{display:grid;gap:10px}
.role{display:flex;justify-content:space-between;align-items:center;padding:12px;border-radius:16px;border:1px solid rgba(255,255,255,0.12);background:rgba(255,255,255,0.04)}
.role-name{font-weight:900}
.role-state{font-size:12px;opacity:.72}
.portal-note{margin-top:10px;color:rgba(234,240,255,0.66);font-size:13px}
.portal-teasers{display:grid;gap:10px}
.tease{padding:12px;border-radius:16px;border:1px solid rgba(255,255,255,0.12);background:rgba(255,255,255,0.04)}
.tease-title{font-weight:950}
.tease-sub{color:rgba(234,240,255,0.66);font-size:13px;margin-top:4px}
.portal-support .support-row{display:flex;justify-content:space-between;gap:10px;padding:12px;border-radius:16px;border:1px solid rgba(255,255,255,0.12);background:rgba(255,255,255,0.04)}
.portal-support .support-row strong{font-weight:950}
.portal-support .support-row span{color:rgba(234,240,255,0.66);font-size:13px}
.locked{
  position:relative;
  filter:blur(0.8px);
  opacity:0.70;
}
.locked::after{
  content:"Locked";
  position:absolute;top:10px;right:10px;
  padding:6px 10px;border-radius:999px;
  background:rgba(0,0,0,0.48);
  border:1px solid rgba(255,255,255,0.16);
  color:#fff;font-size:12px;font-weight:900;
}


/* ===== Home hero layout ===== */
.hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:28px;align-items:start}
@media(max-width:980px){.hero-grid{grid-template-columns:1fr}}
.hero-panel{
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(255,255,255,0.06);
  box-shadow:0 40px 140px rgba(0,0,0,0.40);
  backdrop-filter: blur(18px);
  overflow:hidden;
  padding:16px;
}
.hero-panel-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.hero-panel-title{font-weight:950;color:#fff;letter-spacing:-0.02em}
.hero-panel-pill{font-size:12px;font-weight:900;color:rgba(234,240,255,0.88);padding:8px 10px;border-radius:999px;border:1px solid rgba(255,255,255,0.14);background:rgba(255,255,255,0.06)}
.chat-sim{display:grid;gap:10px;padding:10px;border-radius:18px;border:1px solid rgba(255,255,255,0.10);background:rgba(0,0,0,0.22)}
.chat-row{display:flex}
.chat-row.user{justify-content:flex-end}
.chat-row.ai{justify-content:flex-start}
.chat-bubble{
  max-width:86%;
  padding:12px 12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(255,255,255,0.06);
  color:#fff;
  font-size:14px;
}
.chat-row.user .chat-bubble{background:rgba(43,107,255,0.18);border-color:rgba(43,107,255,0.26)}
.book-card{
  margin-top:12px;
  padding:14px;
  border-radius:18px;
  border:1px solid rgba(43,107,255,0.28);
  background:radial-gradient(120% 140% at 20% 10%, rgba(43,107,255,0.20), rgba(255,255,255,0.05));
}
.book-title{font-weight:950;color:#fff}
.book-sub{color:rgba(234,240,255,0.72);margin-top:4px;font-size:13px}
.book-mini{color:rgba(234,240,255,0.66);margin-top:8px;font-size:13px}

/* ===== Premium typography refinements (v13.1) ===== */
.footer-small{font-size:18px;line-height:1.7;color:rgba(0,0,0,0.62)}
.section-dark .footer-small{color:rgba(234,240,255,0.74)}
.role-title{font-size:42px;line-height:1.10;letter-spacing:-0.03em;font-weight:950}
@media (max-width:720px){
  body{font-size:17.5px}
  p,li{font-size:17.5px}
  .p{font-size:20px}
  .role-title{font-size:34px}
}

/* Pricing toggle */
.pricing-toggle{display:inline-flex;gap:6px;border:1px solid rgba(255,255,255,0.16);background:rgba(255,255,255,0.06);padding:6px;border-radius:999px}
.pricing-toggle button{border:0;background:transparent;color:rgba(234,240,255,0.82);padding:10px 14px;border-radius:999px;font-weight:900;cursor:pointer;font-size:14px}
.pricing-toggle button[aria-pressed="true"]{background:rgba(43,107,255,0.26);color:#fff}
.pricing-note{margin-top:12px;color:rgba(234,240,255,0.70);font-weight:750}



/* ===== v15 typography + contrast enforcement ===== */
p,li{font-size:20px;line-height:1.65}
@media(max-width:720px){p,li{font-size:17.5px}}
.list{font-size:18px;line-height:1.6}
.muted,.small{font-size:18px;line-height:1.6}
@media(max-width:720px){.list,.muted,.small{font-size:16.5px}}

/* v15 contrast hardening */
.card{color:#0b0f1a}
.card *{color:inherit}
.card.card-dark,.card.dark{color:#fff}
.card.card-dark *,.card.dark *{color:inherit}
.mini{color:#0b0f1a}
.mini *{color:inherit}

/* v15 widget presence */
.sa-widget{position:fixed;right:22px;bottom:22px;z-index:9999;font-size:14px}
.sa-fab{padding:18px 20px;gap:12px}
.sa-fab{min-height:66px}
.sa-fab-dot{width:14px;height:14px}

/* v15 hero split stability */
.hero{position:relative;overflow:hidden}
.hero-grid{position:relative;z-index:2}
.hero-left-inner,.hero-right-inner{will-change:transform}
@media(min-width:1100px){.hero{min-height:calc(100vh - 84px)}.hero-grid{align-items:center}}


/* === GLOBAL THEME HARDENING === */
:root{
  --fg-dark:#ffffff;
  --fg-light:#0b0f1a;
  --muted-light:rgba(11,15,26,0.70);
  --muted-dark:rgba(255,255,255,0.74);
  --card-light:#ffffff;
  --card-dark:rgba(255,255,255,0.06);
}
.section-light{background:#ffffff;color:var(--fg-light)}
.section-light .muted,.section-light .sub,.section-light p{color:var(--muted-light)}
.section-light .card,.section-light .addon,.section-light .price-card{background:var(--card-light);color:var(--fg-light)}
.section-light .card *,.section-light .addon *,.section-light .price-card *{color:inherit}
.section-dark{background:radial-gradient(900px 520px at 20% 10%,rgba(255,255,255,0.08),transparent 60%),
             radial-gradient(900px 520px at 80% 80%,rgba(12,29,78,0.38),transparent 58%),
             linear-gradient(180deg,#050712,#06081a);
             color:var(--fg-dark)}
.section-dark .muted,.section-dark .sub,.section-dark p{color:var(--muted-dark)}
.section-dark .card,.section-dark .price-card{background:var(--card-dark);color:var(--fg-dark)}
/* ensure light cards inside dark sections have dark text */
.section-dark .card.card-light,.section-dark .price-card.card-light{background:#ffffff;color:var(--fg-light)}
.section-dark .card.card-light *,.section-dark .price-card.card-light *{color:inherit}

/* HERO full-bleed safety */
.hero{width:100%}
.hero-inner{width:100%}
.hero-grid{width:100%}
@media(min-width:1100px){
  .hero-grid{grid-template-columns:1.05fr 0.95fr}
}
/* hero effects */
.hero-field{position:absolute;inset:-120px;
  background:radial-gradient(60% 60% at 20% 25%, rgba(43,107,255,0.18), transparent 60%),
             radial-gradient(60% 60% at 80% 60%, rgba(12,29,78,0.30), transparent 55%),
             radial-gradient(40% 40% at 65% 25%, rgba(255,255,255,0.06), transparent 55%);
  pointer-events:none;opacity:1}
.hero-glow{position:absolute;inset:0;
  background:radial-gradient(520px 520px at var(--gx, 50%) var(--gy, 40%), rgba(43,107,255,0.18), transparent 60%);
  pointer-events:none;opacity:.9}

/* PORTAL theme */
.portal-shell{background:#f6f7fb;color:var(--fg-light)}
.portal-shell .panel,.portal-shell .card{background:#ffffff;color:var(--fg-light)}
.portal-shell .panel *,.portal-shell .card *{color:inherit}
.portal-shell .topbar{background:linear-gradient(180deg,#050712,#06081a);color:var(--fg-dark)}
.portal-shell .sidebar{background:linear-gradient(180deg,#050712,#06081a);color:var(--fg-dark)}
.portal-shell .sidebar a{color:rgba(255,255,255,0.78)}
.portal-shell .sidebar a.active{color:#fff}

/* LOCKED overlays */
.locked-overlay{background:rgba(255,255,255,0.66);backdrop-filter:blur(10px)}


/* === PORTAL LAYOUT FIX === */
body[data-layout="portal"]{background:#f6f7fb;color:var(--fg-light)}
body[data-layout="portal"] .portal{min-height:100vh;display:grid;grid-template-columns:280px 1fr}
body[data-layout="portal"] .portal-side{background:linear-gradient(180deg,#050712,#06081a);color:#fff}
body[data-layout="portal"] .portal-side *{color:inherit}
body[data-layout="portal"] .portal-nav a{display:flex;align-items:center;gap:10px;color:rgba(255,255,255,0.78)}
body[data-layout="portal"] .portal-nav a.active{color:#fff;background:rgba(255,255,255,0.10)}
body[data-layout="portal"] .portal-main{background:#f6f7fb;color:var(--fg-light)}
body[data-layout="portal"] .portal-main *{color:inherit}
body[data-layout="portal"] .portal-card{background:#fff;color:var(--fg-light)}
body[data-layout="portal"] .portal-card *{color:inherit}
body[data-layout="portal"] .portal-head{color:var(--fg-light)}
body[data-layout="portal"] .locked{position:relative}
body[data-layout="portal"] .locked::after{
  content:"";position:absolute;inset:0;border-radius:18px;
  background:rgba(255,255,255,0.72);
  backdrop-filter:blur(10px);
  pointer-events:none
}
body[data-layout="portal"] .lock-badge{position:relative;z-index:2}


/* ===========================
   V18 CONTRAST + HERO HARDENING
   =========================== */

/* Base text sizing for readability */
body{font-size:20px; line-height:1.65;}
p, li{font-size:20px; line-height:1.75;}
@media(max-width:980px){
  body{font-size:18px;}
  p, li{font-size:18px;}
}

/* Ensure secondary buttons are always readable (fix white-on-white) */
.btn{color:var(--ink) !important;}
.section-dark .btn:not(.btn-primary){color:var(--ink) !important; background:#fff !important; border-color:rgba(255,255,255,0.16) !important;}
.section-dark .btn:hover{opacity:.98;}

/* Subtext defaults to dark, but flips in dark sections */
.sub{color:rgba(0,0,0,0.62) !important;}
.section-dark .sub, .hero .sub{color:rgba(255,255,255,0.78) !important;}
.section-dark .p, .section-dark p{color:rgba(255,255,255,0.74) !important;}

/* Full-bleed hero background, even if a parent container constrains width */
.hero{background:transparent !important; position:relative;}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  left:50%;
  transform:translateX(-50%);
  width:100vw;
  background:
    radial-gradient(1200px 700px at 16% 18%,rgba(255,255,255,0.10),transparent 60%),
    radial-gradient(1000px 650px at 84% 52%,rgba(12,29,78,0.62),transparent 62%),
    linear-gradient(180deg,#050712,var(--bg));
  z-index:0;
}
.hero-field{z-index:1;}
.hero-glow{z-index:2;}
.grain{z-index:3;}
.hero-grid, .hero *{position:relative; z-index:4;}

/* Fix any accidental blue-on-blue surfaces */
:root{ --surface-blue:#0C1D4E; --surface-blue-ink:#ffffff; }
.surface-blue, .bg-brand{background:var(--surface-blue) !important; color:var(--surface-blue-ink) !important;}
.surface-blue *{color:inherit !important;}

/* Portal lock overlay: make it premium, not a white wash */
body[data-layout="portal"] .locked::after{
  background:rgba(255,255,255,0.18) !important;
  backdrop-filter:blur(12px) !important;
}

/* Widget: slightly larger launcher */
.sa-fab{padding:18px 20px !important; font-size:16px !important;}
.sa-fab-label{font-weight:820 !important;}


/* ===== V19 Home full-bleed + contrast hardening ===== */
body.home{
  padding:0 !important;
  display:block !important;
  gap:0 !important;
  background:#fff !important;
}
body.home main{
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  padding:0 !important;
  box-shadow:none !important;
}

/* Ensure body text is readable on dark surfaces */
.section-dark .sub,
.section-dark .p{
  color:rgba(255,255,255,0.74) !important;
}

/* Secondary buttons on dark surfaces: no invisible states */
.section-dark .btn:not(.btn-primary){
  background:rgba(255,255,255,0.10) !important;
  border:1px solid rgba(255,255,255,0.18) !important;
  color:#fff !important;
}

/* Inputs and form controls: always readable */
input, textarea, select{
  color:var(--ink);
}

/* New Home Hero (scrapped layout) */
.home-hero{
  position:relative;
  width:100%;
  min-height:100vh;
  overflow:hidden;
  background:#070A12;
  color:#fff;
}
.home-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 620px at 18% 20%, rgba(43,107,255,0.20), transparent 60%),
    radial-gradient(900px 620px at 82% 65%, rgba(12,29,78,0.55), transparent 62%),
    linear-gradient(180deg,#050712,#070A12);
  z-index:0;
}
.home-hero .grain{
  position:absolute;inset:0;
  background-image:url("/assets/grain.png");
  opacity:.10;mix-blend-mode:overlay;pointer-events:none;z-index:1;
}
.home-hero .inner{
  position:relative;
  z-index:2;
  max-width:1840px;
  margin:0 auto;
  padding:120px var(--pad) 84px;
}
.home-hero .grid{
  display:grid;
  gap:34px;
}
@media(min-width:1040px){
  .home-hero .grid{
    grid-template-columns: 1.15fr 0.85fr;
    align-items:center;
  }
}
.home-hero .kicker{letter-spacing:.16em;text-transform:uppercase;font-weight:800;font-size:13px;color:rgba(255,255,255,0.76)}
.home-hero .title{
  font-weight:920;
  line-height:0.95;
  font-size:clamp(48px,6.2vw,86px);
  max-width:18ch;
  margin-top:16px;
}
.home-hero .lede{
  font-size:clamp(18px,1.7vw,24px);
  line-height:1.7;
  color:rgba(255,255,255,0.76);
  max-width:52ch;
  margin-top:18px;
}
.home-hero .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.home-hero .chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.home-hero .chip{
  display:inline-flex;align-items:center;
  border-radius:999px;
  padding:10px 14px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.14);
  color:rgba(255,255,255,0.86);
  font-weight:700;
  font-size:13px;
}

/* Workforce panel */
.workforce-panel{
  position:relative;
  border-radius:22px;
  padding:18px;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.14);
  box-shadow:0 60px 140px rgba(0,0,0,0.48);
  backdrop-filter: blur(10px);
}
.workforce-panel .panel-top{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:12px;
}
.workforce-panel .badge{
  display:inline-flex;align-items:center;gap:8px;
  border-radius:999px;
  padding:8px 12px;
  background:rgba(255,255,255,0.10);
  border:1px solid rgba(255,255,255,0.16);
  font-weight:800;
  font-size:12px;
}
.workforce-panel .dot{
  width:9px;height:9px;border-radius:999px;background:#2b6bff;
  box-shadow:0 0 0 0 rgba(43,107,255,0.55);
  animation: pulseDot 1.8s ease-out infinite;
}
@keyframes pulseDot{
  0%{box-shadow:0 0 0 0 rgba(43,107,255,0.55)}
  70%{box-shadow:0 0 0 12px rgba(43,107,255,0)}
  100%{box-shadow:0 0 0 0 rgba(43,107,255,0)}
}
.workforce-panel .stream{
  display:grid;gap:10px;
}
.msg{
  border-radius:16px;
  padding:12px 12px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(15,23,42,0.78);
  color:rgba(255,255,255,0.90);
  font-size:14px;
  line-height:1.5;
}
.msg.user{background:rgba(43,107,255,0.14);border-color:rgba(43,107,255,0.26)}
.msg strong{font-weight:900}
.workforce-panel .panel-bottom{
  margin-top:12px;
  display:flex;gap:10px;align-items:center;
}
.input-pill{
  flex:1;
  height:44px;
  border-radius:999px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.14);
}


/* ===== V20 EXECUTIVE HOMEPAGE HERO (SCRAPPED + REBUILT) ===== */
.home-hero--executive{
  position:relative;
  min-height:100vh;
  overflow:hidden;
  background: var(--bg);
  color: #fff;
}
.home-hero--executive .hero-bg{
  position:absolute;
  inset:-20%;
  background:
    radial-gradient(1100px 760px at 18% 22%, rgba(43,107,255,0.28), transparent 62%),
    radial-gradient(1200px 860px at 82% 62%, rgba(12,29,78,0.70), transparent 64%),
    radial-gradient(900px 700px at 50% 110%, rgba(43,107,255,0.16), transparent 60%),
    linear-gradient(180deg,#050712,#070A12);
  filter:saturate(1.05) contrast(1.05);
  animation: heroField 18s ease-in-out infinite alternate;
  z-index:0;
}
@keyframes heroField{
  0%{ transform: translate3d(-1.5%, -1.0%, 0) scale(1.02); }
  100%{ transform: translate3d(1.5%, 1.0%, 0) scale(1.05); }
}
.home-hero--executive .inner{
  position:relative;
  z-index:2;
  max-width: 1600px;
  margin: 0 auto;
  padding: 110px var(--pad) 88px;
}
.home-hero--executive .kicker{
  letter-spacing:.16em;
  font-weight:800;
  font-size:12px;
  opacity:.86;
}
.home-hero--executive .hero-title{
  margin: 18px 0 18px;
  font-weight: 900;
  line-height: 0.92;
  max-width: 1400px;
  font-size: clamp(72px, 9vw, 160px);
}
.home-hero--executive .hero-title .w{
  display:inline-block;
  opacity:0;
  transform: translate3d(0,18px,0);
  animation: heroWord .72s cubic-bezier(.2,.9,.2,1) forwards;
  animation-delay: var(--d);
}
@keyframes heroWord{
  to{ opacity:1; transform: translate3d(0,0,0); }
}
.home-hero--executive .hero-lede{
  max-width: 980px;
  font-size: 22px;
  line-height: 1.55;
  color: rgba(255,255,255,0.86);
  margin: 0 0 26px;
}
.home-hero--executive .actions{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom: 22px; }
.home-hero--executive .chips{ display:flex; gap:10px; flex-wrap:wrap; }

.home-hero--executive .chip-blue{
  background: rgba(28,63,170,0.22);
  border: 1px solid rgba(28,63,170,0.45);
  color: rgba(255,255,255,0.92);
}

/* Activity layer (executive, visible motion) */
.home-hero--executive .hero-activity{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
}
.home-hero--executive .activity-card{
  position:absolute;
  width: 280px;
  background: rgba(15,23,42,0.70);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 16px;
  padding: 14px 14px 12px;
  backdrop-filter: blur(10px);
  box-shadow: 0 26px 90px rgba(0,0,0,0.40);
  animation: floaty 6.5s ease-in-out infinite;
}
@keyframes floaty{
  0%{ transform: translate3d(0,0,0); }
  50%{ transform: translate3d(0,-14px,0); }
  100%{ transform: translate3d(0,0,0); }
}
.home-hero--executive .activity-card .ac-top{
  display:flex; align-items:center; gap:8px;
  font-weight: 800;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.86);
  margin-bottom: 10px;
}
.home-hero--executive .activity-card .dot{
  width:8px; height:8px; border-radius:999px;
  background: #3b82f6;
  box-shadow: 0 0 0 6px rgba(59,130,246,0.18);
  animation: pulseDot 1.6s ease-in-out infinite;
}
@keyframes pulseDot{
  0%,100%{ transform:scale(1); opacity: 1; }
  50%{ transform:scale(1.15); opacity: .85; }
}
.home-hero--executive .activity-card .ac-line{
  font-size: 14px;
  line-height: 1.35;
  color: rgba(255,255,255,0.80);
}
.home-hero--executive .activity-card strong{ color: rgba(255,255,255,0.95); }
.home-hero--executive .activity-card.a1{ right: 8vw; top: 18vh; animation-delay: .0s; }
.home-hero--executive .activity-card.a2{ right: 12vw; top: 44vh; animation-delay: .9s; }
.home-hero--executive .activity-card.a3{ right: 6vw; top: 66vh; animation-delay: 1.8s; }

@media(max-width: 980px){
  .home-hero--executive .activity-card{ display:none; }
  .home-hero--executive .hero-title{ font-size: clamp(52px, 10vw, 92px); }
  .home-hero--executive .hero-lede{ font-size: 18px; }
}

/* Fix: blue pills/buttons must always be white text */
.btn.btn-primary{ color:#fff !important; }
.btn.btn-primary *{ color:inherit !important; }


/* Footer link reset (prevent global flex-link styles) */
.footer a{
  display:block;
  padding:6px 0;
  border-radius:0;
  justify-content:flex-start;
  gap:0;
  background:transparent;
  border:0;
  color:rgba(0,0,0,0.70);
}
.footer a:hover{color:rgba(0,0,0,0.92);text-decoration:underline}
