/* =========================================================
   Synca — Cloud Operations Platform
   Restrained enterprise Japanese SaaS aesthetic
   ========================================================= */

:root{
  /* Ink / text */
  --ink:#0E1726;
  --ink-2:#1F2A3D;
  --ink-3:#2E3A50;
  --muted:#5B6478;
  --muted-2:#8893A6;
  --muted-3:#A8B0BF;

  /* Lines / surfaces */
  --line:#E5E8EE;
  --line-2:#EEF0F4;
  --line-3:#F4F5F8;
  --bg:#FAFBFC;
  --bg-2:#FFFFFF;
  --bg-3:#F4F6FA;

  /* Brand — calm enterprise indigo */
  --brand:#1E50E2;
  --brand-2:#1A45C2;
  --brand-deep:#0F308C;
  --brand-soft:#EAF0FD;
  --brand-mist:#F5F8FE;
  --brand-line:#D6E2F8;

  /* Accents — subtle */
  --cyan:#0FA3B1;
  --cyan-soft:#E6F4F6;
  --positive:#0E8F6E;
  --positive-soft:#E5F4EF;
  --warn:#B7791F;
  --danger:#C03A3A;

  /* Typography */
  --ff-sans:"Inter","Noto Sans JP","Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3",-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  --ff-disp:"Inter","Noto Sans JP","Hiragino Kaku Gothic ProN",system-ui,sans-serif;
  --ff-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  /* Radius — restrained */
  --r-4:4px; --r-6:6px; --r-8:8px; --r-10:10px; --r-12:12px;
  --r-pill:999px;

  /* Shadows — minimal */
  --sh-xs:0 1px 2px rgba(14,23,38,.04);
  --sh-sm:0 1px 3px rgba(14,23,38,.06), 0 1px 2px rgba(14,23,38,.04);
  --sh-md:0 4px 12px rgba(14,23,38,.06);
  --sh-pop:0 8px 24px rgba(14,23,38,.08);

  /* Sizes */
  --max:1180px;
  --nav-h:64px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;font-family:var(--ff-sans);font-size:15px;
  color:var(--ink);background:var(--bg-2);
  line-height:1.75;-webkit-font-smoothing:antialiased;
  font-feature-settings:"palt" 1;
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}
ul{list-style:none;padding:0;margin:0}
h1,h2,h3,h4{margin:0;font-family:var(--ff-disp);letter-spacing:-.005em;line-height:1.45;font-weight:700}
p{margin:0}

.W{max-width:var(--max);margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:16px;background:var(--ink);color:#fff;padding:10px 14px;border-radius:6px;z-index:9999}

/* ====================== NAV ====================== */
#nav{
  position:fixed;top:0;left:0;right:0;height:var(--nav-h);z-index:80;
  background:rgba(255,255,255,.96);
  border-bottom:1px solid transparent;
  transition:border-color .2s;
}
#nav.scrolled{border-bottom-color:var(--line)}
.NW{display:flex;align-items:center;justify-content:space-between;height:var(--nav-h);gap:32px}
.Logo{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:18px;letter-spacing:-.01em;color:var(--ink)}
.Logo-mark{
  width:28px;height:28px;display:inline-grid;place-items:center;
  color:var(--brand);
}
.Logo-mark svg{display:block;width:100%;height:100%}
.NLinks{display:flex;gap:28px;align-items:center}
.NLinks a{font-size:13.5px;color:var(--ink-2);font-weight:500;transition:color .15s}
.NLinks a:hover{color:var(--brand)}
.NRight{display:flex;align-items:center;gap:18px}
.NLogin{font-size:13.5px;font-weight:500;color:var(--ink-2)}
.NLogin:hover{color:var(--brand)}
.NCta{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--brand);color:#fff;
  padding:9px 16px;border-radius:6px;
  font-size:13.5px;font-weight:600;
  transition:background .15s;
}
.NCta:hover{background:var(--brand-2)}
.Burger{display:none;width:38px;height:38px;border-radius:6px;background:var(--bg-3);align-items:center;justify-content:center}
.Burger span{width:18px;height:1.5px;background:var(--ink);position:relative;display:block}
.Burger span::before,.Burger span::after{content:"";position:absolute;left:0;width:18px;height:1.5px;background:var(--ink)}
.Burger span::before{top:-5px}.Burger span::after{top:5px}

.Scrim{position:fixed;inset:0;background:rgba(14,23,38,.45);z-index:90;opacity:0;visibility:hidden;transition:opacity .2s}
.Scrim.on{opacity:1;visibility:visible}
.Drawer{position:fixed;top:0;right:0;bottom:0;width:288px;background:#fff;z-index:100;padding:28px 24px;transform:translateX(100%);transition:transform .25s;display:flex;flex-direction:column;gap:4px}
.Drawer.on{transform:translateX(0)}
.Drawer a{padding:14px 0;border-bottom:1px solid var(--line-2);font-size:14px;font-weight:500;color:var(--ink-2)}
.DClose{position:absolute;top:16px;right:16px;width:32px;height:32px;border-radius:6px;background:var(--bg-3);display:grid;place-items:center;color:var(--ink-2)}

/* ====================== HERO ====================== */
#hero{
  position:relative;padding:calc(var(--nav-h) + 80px) 0 96px;
  background:#FFFFFF;
  border-bottom:1px solid var(--line);
}
.HG{display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:center}
.HBadge{
  display:inline-flex;align-items:center;gap:10px;
  padding:5px 12px 5px 6px;border-radius:var(--r-pill);
  background:var(--brand-soft);border:1px solid var(--brand-line);
  font-size:12.5px;font-weight:500;color:var(--brand-deep);
}
.HBadge-chip{padding:2px 8px;border-radius:var(--r-pill);background:#fff;color:var(--brand);font-size:11px;font-weight:600;letter-spacing:.02em}
.HH1{
  font-size:clamp(30px,4.2vw,46px);font-weight:700;
  margin:24px 0 22px;line-height:1.35;letter-spacing:-.015em;color:var(--ink);
}
.HH1 em{font-style:normal;color:var(--brand);font-weight:700}
.HH1 .br{display:block}
.HSub{font-size:15.5px;color:var(--ink-3);line-height:1.95;max-width:520px}
.HSub b{color:var(--ink);font-weight:600}
.HActs{margin-top:32px;display:flex;gap:12px;flex-wrap:wrap}
.HMeta{margin-top:32px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);padding-top:24px;border-top:1px solid var(--line-2)}
.HMeta-item{display:inline-flex;align-items:center;gap:7px}
.HMeta-item svg{color:var(--brand);flex-shrink:0}

/* Buttons */
.Btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:12px 22px;border-radius:6px;
  font-size:14px;font-weight:600;
  transition:background .15s,color .15s,border-color .15s;
}
.Btn-A{background:var(--brand);color:#fff}
.Btn-A:hover{background:var(--brand-2)}
.Btn-O{background:#fff;color:var(--ink);border:1px solid var(--line)}
.Btn-O:hover{border-color:var(--brand);color:var(--brand)}
.Btn-G{background:var(--ink);color:#fff}
.Btn-G:hover{background:var(--brand-deep)}

/* Hero dashboard mock */
.HMock{position:relative}
.Dash{
  background:#fff;border-radius:8px;border:1px solid var(--line);
  overflow:hidden;box-shadow:var(--sh-pop);
}
.Dash-bar{
  display:flex;align-items:center;gap:8px;padding:10px 14px;
  background:var(--bg-3);border-bottom:1px solid var(--line);
}
.Dash-dot{width:8px;height:8px;border-radius:50%;background:#D7DCE5}
.Dash-dot.r,.Dash-dot.y,.Dash-dot.g{background:#D7DCE5}
.Dash-url{margin-left:12px;padding:4px 10px;background:#fff;border-radius:4px;font-family:var(--ff-mono);font-size:10.5px;color:var(--muted);border:1px solid var(--line-2)}
.Dash-body{display:grid;grid-template-columns:148px 1fr;min-height:328px}
.Dash-side{background:#FBFCFD;border-right:1px solid var(--line-2);padding:14px 10px;display:flex;flex-direction:column;gap:2px}
.Dash-brand{display:flex;align-items:center;gap:7px;font-weight:700;font-size:13px;padding:4px 6px 10px;color:var(--ink)}
.Dash-brand-mark{width:18px;height:18px;border-radius:4px;background:var(--brand);display:grid;place-items:center;color:#fff;font-size:9px;font-weight:700}
.Dash-nav{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:5px;font-size:12px;color:var(--muted);font-weight:500}
.Dash-nav.is-on{background:#fff;color:var(--brand);font-weight:600;box-shadow:inset 0 0 0 1px var(--brand-line)}
.Dash-nav svg{width:12px;height:12px;flex-shrink:0}
.Dash-main{padding:18px;display:flex;flex-direction:column;gap:12px;background:#fff}
.Dash-row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.Dash-h{font-size:13px;font-weight:700;color:var(--ink)}
.Dash-pill{padding:2px 8px;border-radius:var(--r-pill);background:var(--positive-soft);color:var(--positive);font-size:10px;font-weight:600;letter-spacing:.04em}
.Dash-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.Dash-stat{background:#fff;border:1px solid var(--line-2);border-radius:6px;padding:10px 12px}
.Dash-stat-l{font-size:10px;color:var(--muted);font-weight:500;letter-spacing:.02em}
.Dash-stat-v{font-size:18px;font-weight:700;color:var(--ink);margin-top:4px;letter-spacing:-.01em}
.Dash-stat-d{font-size:10.5px;color:var(--positive);font-weight:600;margin-top:2px}
.Dash-chart{background:#FBFCFD;border:1px solid var(--line-2);border-radius:6px;padding:12px;height:92px;position:relative;overflow:hidden}
.Dash-chart svg{position:absolute;inset:12px;width:calc(100% - 24px);height:calc(100% - 24px)}
.Dash-list{background:#fff;border:1px solid var(--line-2);border-radius:6px;overflow:hidden}
.Dash-li{display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid var(--line-2);font-size:11.5px}
.Dash-li:last-child{border-bottom:0}
.Dash-av{width:22px;height:22px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-size:10px;font-weight:700}
.Dash-li-n{font-weight:600;color:var(--ink)}
.Dash-li-t{font-size:10.5px;color:var(--muted);margin-top:1px}
.Dash-li-s{font-size:10px;font-weight:600;color:var(--brand);padding:2px 7px;background:var(--brand-soft);border-radius:var(--r-pill)}

/* ====================== TRUST ====================== */
#trust{padding:64px 0;background:var(--bg);border-bottom:1px solid var(--line)}
.T-lbl{text-align:center;font-size:12px;color:var(--muted);letter-spacing:.12em;font-weight:600;margin-bottom:32px}
.T-row{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:var(--line-2);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.T-card{
  display:flex;align-items:center;justify-content:center;
  padding:22px 12px;background:#fff;
  font-size:13px;font-weight:600;color:var(--muted);
  letter-spacing:.01em;transition:color .15s;
}
.T-card:hover{color:var(--ink)}

/* ====================== SECTION COMMON ====================== */
section{padding:104px 0;position:relative}
.SecHead{max-width:740px;margin:0 auto 56px;text-align:center}
.SecHead-eyebrow{
  display:inline-block;padding:4px 10px;
  border-radius:4px;background:var(--brand-soft);color:var(--brand);
  font-family:var(--ff-mono);font-size:11px;font-weight:600;letter-spacing:.08em;
}
.SecHead h2{margin:18px 0 14px;font-size:clamp(24px,2.6vw,32px);font-weight:700;letter-spacing:-.015em;line-height:1.45}
.SecHead h2 em{font-style:normal;color:var(--brand)}
.SecHead p{font-size:14.5px;color:var(--muted);line-height:1.9}

/* ====================== PAIN ====================== */
#pain{background:var(--bg);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.PG{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px}
.PC{
  background:#fff;border:1px solid var(--line);border-radius:8px;padding:28px;
  transition:border-color .15s;
}
.PC:hover{border-color:var(--brand-line)}
.PC-illust{display:block;width:100%;height:auto;border-radius:10px;margin:-4px 0 18px;background:var(--brand-mist)}
.PC-num{font-family:var(--ff-mono);font-size:11px;color:var(--brand);font-weight:600;letter-spacing:.06em}
.PC-h{font-size:17px;font-weight:700;margin:10px 0 10px;color:var(--ink)}
.PC-p{font-size:13.5px;color:var(--muted);line-height:1.85}

/* ====================== MODULES ====================== */
#modules{background:#fff}
.MG{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.MC{
  background:#fff;padding:32px 28px;
  display:flex;flex-direction:column;gap:14px;
  transition:background .15s;
}
.MC:hover{background:var(--bg)}
.MC-top{display:flex;align-items:center;gap:14px}
.MC-ic{
  width:40px;height:40px;border-radius:8px;
  background:var(--brand-soft);color:var(--brand);
  display:grid;place-items:center;flex-shrink:0;
}
.MC-illust{display:block;margin:-4px -4px 18px;border-radius:10px;overflow:hidden}
.MC-illust svg{display:block;width:100%;height:auto}
.MC-tag{font-family:var(--ff-mono);font-size:10.5px;color:var(--muted);font-weight:600;letter-spacing:.08em}
.MC-h{font-size:17px;font-weight:700;color:var(--ink)}
.MC-p{font-size:13.5px;color:var(--muted);line-height:1.85;margin:0}
.MC-list{margin-top:6px;display:flex;flex-direction:column;gap:6px}
.MC-list li{font-size:13px;color:var(--ink-3);display:flex;align-items:center;gap:8px}
.MC-list li::before{content:"";flex-shrink:0;width:14px;height:14px;border-radius:3px;background:var(--brand-soft);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%231E50E2' stroke-width='3' stroke-linecap='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center}

/* ====================== FEATURES (deep dive) ====================== */
#features{background:var(--bg);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.FR{display:grid;grid-template-columns:1fr 1.05fr;gap:64px;align-items:center;padding:72px 0;border-bottom:1px solid var(--line)}
.FR:last-child{border-bottom:0}
.FR.flip{grid-template-columns:1.05fr 1fr}
.FR.flip .FR-txt{order:2}
.FR.flip .FR-vis{order:1}
.FR-num{font-family:var(--ff-mono);font-size:12px;color:var(--brand);font-weight:600;letter-spacing:.08em}
.FR-h{font-size:26px;font-weight:700;margin:12px 0 16px;letter-spacing:-.012em;line-height:1.4}
.FR-p{font-size:14.5px;color:var(--muted);line-height:1.9;max-width:500px}
.FR-feats{margin-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.FR-feat{display:flex;gap:12px;align-items:flex-start}
.FR-feat-ic{flex-shrink:0;width:28px;height:28px;border-radius:6px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center}
.FR-feat-l{font-size:13.5px;font-weight:700;color:var(--ink)}
.FR-feat-s{font-size:12.5px;color:var(--muted);line-height:1.65;margin-top:2px}

.FR-vis{position:relative}
.Mock{
  background:#fff;border-radius:8px;border:1px solid var(--line);
  box-shadow:var(--sh-md);overflow:hidden;
}
.Mock-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;background:var(--bg-3);border-bottom:1px solid var(--line)}
.Mock-body{padding:22px;background:#fff}

/* Reservation calendar */
.cal-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.cal-m{font-weight:700;color:var(--ink);font-size:14.5px}
.cal-ctl{display:flex;gap:6px}
.cal-btn{width:26px;height:26px;border-radius:4px;background:var(--bg);display:grid;place-items:center;color:var(--muted);font-size:12px;border:1px solid var(--line-2)}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal-day{aspect-ratio:1;border-radius:4px;display:grid;place-items:center;font-size:12px;color:var(--muted-2);font-weight:500;background:var(--bg-3)}
.cal-day.has{background:var(--brand-soft);color:var(--brand);font-weight:600;position:relative}
.cal-day.has::after{content:"";position:absolute;bottom:4px;width:3px;height:3px;border-radius:50%;background:var(--brand)}
.cal-day.full{background:var(--brand);color:#fff;font-weight:600}
.cal-day.full::after{background:#fff}
.cal-day.dow{background:transparent;font-size:10.5px;color:var(--muted-2);font-weight:500}

/* CRM rows */
.crm-grid{display:flex;flex-direction:column;gap:8px}
.crm-row{display:grid;grid-template-columns:32px 1fr auto;gap:12px;align-items:center;padding:10px 12px;background:var(--bg);border:1px solid var(--line-2);border-radius:6px}
.crm-av{width:32px;height:32px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-weight:700;font-size:12px}
.crm-n{font-size:13px;font-weight:600;color:var(--ink)}
.crm-m{font-size:11.5px;color:var(--muted);margin-top:1px}
.crm-tag{font-size:10.5px;font-weight:600;padding:2px 8px;border-radius:var(--r-pill);letter-spacing:.02em}
.crm-tag.vip{background:#FBF1DA;color:#8C6312}
.crm-tag.new{background:var(--positive-soft);color:var(--positive)}
.crm-tag.reg{background:var(--brand-soft);color:var(--brand)}

/* Payment summary — flat */
.pay-card{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:22px;color:var(--ink)}
.pay-l{font-size:11.5px;color:var(--muted);font-weight:600;letter-spacing:.04em}
.pay-v{font-size:28px;font-weight:700;margin:6px 0 18px;color:var(--ink);letter-spacing:-.015em}
.pay-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding-top:18px;border-top:1px solid var(--line-2)}
.pay-cell-l{font-size:10.5px;color:var(--muted);letter-spacing:.04em;font-weight:600}
.pay-cell-v{font-size:14px;font-weight:700;margin-top:4px;color:var(--ink)}
.pay-meth{display:flex;gap:6px;margin-top:18px;flex-wrap:wrap}
.pay-chip{padding:5px 10px;border-radius:4px;background:#fff;border:1px solid var(--line-2);font-size:11px;font-weight:500;color:var(--ink-3)}

/* Reports — flat */
.rep-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}
.rep-stat{background:var(--bg);border:1px solid var(--line-2);border-radius:6px;padding:12px}
.rep-stat-l{font-size:11px;color:var(--muted);font-weight:500}
.rep-stat-v{font-size:20px;font-weight:700;color:var(--ink);margin-top:4px;letter-spacing:-.01em}
.rep-stat-d{font-size:11px;color:var(--positive);margin-top:2px;font-weight:600}
.rep-chart{background:var(--bg);border:1px solid var(--line-2);border-radius:6px;padding:16px 14px;height:128px;position:relative}
.rep-bars{display:flex;align-items:flex-end;gap:6px;height:100%}
.rep-bar{flex:1;background:var(--brand);border-radius:2px 2px 0 0;position:relative;opacity:.9}
.rep-bar:nth-child(odd){opacity:.65}
.rep-bar::after{content:attr(data-l);position:absolute;bottom:-18px;left:50%;transform:translateX(-50%);font-size:10px;color:var(--muted-2)}

/* ====================== INDUSTRIES ====================== */
#industries{background:#fff}
.IG{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:48px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.IC{
  background:#fff;padding:28px;display:flex;flex-direction:column;gap:14px;
  transition:background .15s;
}
.IC:hover{background:var(--bg)}
.IC-top{display:flex;align-items:center;justify-content:space-between}
.IC-ic{width:40px;height:40px;border-radius:8px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center}
.IC-num{font-family:var(--ff-mono);font-size:11px;color:var(--muted);font-weight:600;letter-spacing:.06em}
.IC-h{font-size:16px;font-weight:700;color:var(--ink)}
.IC-p{font-size:13px;color:var(--muted);line-height:1.8;margin:0}
.IC-foot{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:14px;border-top:1px solid var(--line-2)}
.IC-tag{padding:3px 9px;border-radius:4px;background:var(--bg);font-size:11.5px;color:var(--ink-3);font-weight:500;border:1px solid var(--line-2)}

/* ====================== WORKFLOW ====================== */
#workflow{background:var(--bg);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.WG{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:48px}
.WC{background:#fff;border:1px solid var(--line);border-radius:8px;padding:26px;position:relative}
.WC-step{
  width:34px;height:34px;border-radius:6px;
  background:var(--brand-soft);color:var(--brand);
  font-weight:700;font-size:14px;
  display:grid;place-items:center;margin-bottom:16px;
}
.WC-day{font-family:var(--ff-mono);font-size:10.5px;color:var(--muted);font-weight:600;letter-spacing:.04em;margin-bottom:6px}
.WC-h{font-size:15.5px;font-weight:700;color:var(--ink);margin-bottom:10px}
.WC-p{font-size:13px;color:var(--muted);line-height:1.8}

/* ====================== STATS ====================== */
#stats{background:#fff;border-top:1px solid var(--line)}
.StatG{
  display:grid;grid-template-columns:repeat(2,1fr);gap:1px;
  margin-top:48px;background:var(--line);
  border:1px solid var(--line);border-radius:12px;overflow:hidden;
}
.StatC{
  padding:36px;background:#fff;display:flex;flex-direction:column;gap:20px;
  position:relative;transition:background .15s;
}
.StatC:hover{background:#FBFCFE}
.StatC-head{display:flex;align-items:center;gap:12px}
.StatC-ic{
  width:36px;height:36px;border-radius:8px;
  background:var(--brand-soft);color:var(--brand);
  display:grid;place-items:center;flex-shrink:0;
}
.StatC-cat{font-family:var(--ff-mono);font-size:11px;color:var(--muted);font-weight:600;letter-spacing:.06em}

/* visual area */
.StatC-vis{padding:8px 0}

/* before/after bars */
.StatC-bars{display:flex;flex-direction:column;gap:12px}
.StatC-bar{display:grid;grid-template-columns:68px 1fr 56px;align-items:center;gap:12px}
.StatC-bar-l{font-size:11.5px;color:var(--muted);font-weight:600}
.StatC-bar-t{height:8px;background:var(--bg-3);border-radius:4px;overflow:hidden}
.StatC-bar-f{display:block;height:100%;border-radius:4px;background:#D4DAE3}
.StatC-bar.aft .StatC-bar-f{background:var(--brand)}
.StatC-bar-v{font-size:12px;font-weight:700;color:var(--ink);text-align:right;font-variant-numeric:tabular-nums}
.StatC-bar.aft .StatC-bar-v{color:var(--brand)}

/* frequency dots */
.StatC-freq{display:grid;grid-template-columns:68px 1fr;gap:12px;align-items:center}
.StatC-freq-l{font-size:11.5px;color:var(--muted);font-weight:600}
.StatC-freq-row{display:flex;gap:6px;align-items:center}
.StatC-freq-dot{width:10px;height:10px;border-radius:50%;background:var(--bg-3)}
.StatC-freq-dot.on{background:var(--brand)}
.StatC-freq + .StatC-freq{margin-top:10px}

/* reduction chip row */
.StatC-redu{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.StatC-pill{padding:6px 12px;border-radius:var(--r-pill);background:var(--bg-3);color:var(--muted);font-size:12px;font-weight:600}
.StatC-pill.pos{background:var(--brand-soft);color:var(--brand)}
.StatC-arrow{color:var(--muted)}

/* calendar dots */
.StatC-cal{display:flex;gap:6px}
.StatC-cal-day{
  flex:1;aspect-ratio:1;max-width:36px;border-radius:6px;
  background:var(--bg-3);display:grid;place-items:center;
  font-size:11px;font-weight:600;color:var(--muted);
}
.StatC-cal-day.on{background:var(--brand-soft);color:var(--brand)}
.StatC-cal-day.done{background:var(--brand);color:#fff}

/* foot block */
.StatC-foot{display:flex;flex-direction:column;gap:6px;padding-top:18px;border-top:1px solid var(--line-2);margin-top:auto}
.StatC-v{font-size:24px;font-weight:700;letter-spacing:-.015em;color:var(--ink);line-height:1.25}
.StatC-v em{font-style:normal;color:var(--brand)}
.StatC-l{font-size:12.5px;color:var(--muted);line-height:1.65}

/* ====================== VOICES ====================== */
#voices{background:var(--bg);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.VG{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px}
.VC{
  background:#fff;border:1px solid var(--line);border-radius:8px;padding:28px;
  display:flex;flex-direction:column;gap:16px;
}
.VC-illust{display:block;width:100%;height:auto;border-radius:10px;margin:-8px 0 18px;background:var(--brand-mist)}
.VC-cat{font-family:var(--ff-mono);font-size:11px;color:var(--brand);font-weight:600;letter-spacing:.06em}
.VC-h{font-size:15.5px;font-weight:700;color:var(--ink);line-height:1.55}
.VC-p{font-size:13.5px;color:var(--muted);line-height:1.85}
.VC-foot{display:flex;align-items:center;gap:12px;padding-top:18px;margin-top:auto;border-top:1px solid var(--line-2)}
.VC-av{width:36px;height:36px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-weight:700;font-size:13px}
.VC-n{font-size:13px;font-weight:600;color:var(--ink)}
.VC-r{font-size:11.5px;color:var(--muted);margin-top:2px}

/* ====================== PRICING ====================== */
#pricing{background:#fff}
.PrG{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px;align-items:stretch}
.PrC{
  background:#fff;border:1px solid var(--line);border-radius:10px;
  padding:32px 28px;display:flex;flex-direction:column;position:relative;
}
.PrC.is-feat{border:1px solid var(--brand);box-shadow:var(--sh-md)}
.PrC-rec{
  position:absolute;top:-10px;left:24px;
  background:var(--brand);color:#fff;
  padding:3px 10px;border-radius:4px;
  font-size:11px;font-weight:600;letter-spacing:.04em;
}
.PrC-n{font-family:var(--ff-mono);font-size:11px;color:var(--brand);font-weight:600;letter-spacing:.08em}
.PrC-h{font-size:20px;font-weight:700;margin:6px 0 6px;color:var(--ink);letter-spacing:-.01em}
.PrC-s{font-size:13px;color:var(--muted);line-height:1.7}
.PrC-price{margin:22px 0 4px;display:flex;align-items:baseline;gap:4px}
.PrC-price-v{font-size:34px;font-weight:700;color:var(--ink);letter-spacing:-.02em}
.PrC-price-u{font-size:13px;color:var(--muted)}
.PrC-note{font-size:12px;color:var(--muted);margin-bottom:24px;padding-bottom:18px;border-bottom:1px solid var(--line-2)}
.PrC-list{display:flex;flex-direction:column;gap:10px;margin-bottom:28px;flex-grow:1}
.PrC-li{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--ink-3)}
.PrC-li svg{flex-shrink:0;color:var(--brand);margin-top:3px}
.PrC-btn{
  display:flex;justify-content:center;align-items:center;gap:6px;
  padding:11px;border-radius:6px;
  background:#fff;color:var(--brand);
  border:1px solid var(--brand-line);
  font-weight:600;font-size:13.5px;
  transition:background .15s,color .15s;
}
.PrC-btn:hover{background:var(--brand);color:#fff}
.PrC.is-feat .PrC-btn{background:var(--brand);color:#fff;border-color:var(--brand)}
.PrC.is-feat .PrC-btn:hover{background:var(--brand-2);border-color:var(--brand-2)}

/* On-Premise band — flat enterprise card */
.OnPrem{
  margin-top:48px;display:grid;grid-template-columns:1.05fr 1fr;
  background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;
}
.OnPrem-l{padding:40px 36px;border-right:1px solid var(--line-2)}
.OnPrem-tag{
  display:inline-block;padding:4px 10px;border-radius:4px;
  background:var(--brand-soft);color:var(--brand);
  font-family:var(--ff-mono);font-size:11px;font-weight:600;letter-spacing:.08em;
}
.OnPrem-h{font-size:22px;font-weight:700;letter-spacing:-.012em;margin:14px 0 14px;color:var(--ink)}
.OnPrem-p{font-size:14px;color:var(--muted);line-height:1.9}
.OnPrem-list{margin-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}
.OnPrem-list li{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--ink-3)}
.OnPrem-list li svg{flex-shrink:0;color:var(--brand);margin-top:3px}
.OnPrem-r{padding:40px 36px;background:var(--bg);display:flex;flex-direction:column;gap:18px}
.OnPrem-n{font-family:var(--ff-mono);font-size:11px;color:var(--brand);font-weight:600;letter-spacing:.08em}
.OnPrem-card-h{font-size:18px;font-weight:700;color:var(--ink);margin-top:4px}
.OnPrem-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:18px 0;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2)}
.OnPrem-cell-l{font-size:11px;color:var(--muted);font-weight:600;letter-spacing:.04em}
.OnPrem-cell-v{font-size:22px;font-weight:700;color:var(--ink);margin-top:6px;letter-spacing:-.012em}
.OnPrem-cell-v span{font-size:13px;color:var(--muted);font-weight:600;margin-left:3px}
.OnPrem-cell-s{font-size:11.5px;color:var(--muted);margin-top:5px;line-height:1.55}
.OnPrem-note{font-size:12.5px;color:var(--muted);line-height:1.75}
.OnPrem-btn{
  display:flex;align-items:center;justify-content:center;gap:6px;
  padding:11px;background:var(--brand);color:#fff;
  border-radius:6px;font-weight:600;font-size:13.5px;
  transition:background .15s;
}
.OnPrem-btn:hover{background:var(--brand-2)}

/* ====================== FAQ ====================== */
#faq{background:var(--bg);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.FAQwrap{max-width:780px;margin:0 auto}
.FQ{
  background:#fff;border:1px solid var(--line);border-radius:8px;
  margin-bottom:8px;overflow:hidden;
}
.FQ[open]{border-color:var(--brand-line)}
.FQ summary{
  list-style:none;cursor:pointer;
  padding:18px 22px;display:flex;align-items:center;gap:16px;
  font-weight:600;font-size:14.5px;color:var(--ink);
}
.FQ summary::-webkit-details-marker{display:none}
.FQ-q{flex-grow:1}
.FQ-tag{font-family:var(--ff-mono);font-size:12px;color:var(--brand);font-weight:600;letter-spacing:.04em;flex-shrink:0;min-width:28px}
.FQ-arr{
  width:24px;height:24px;border-radius:4px;background:var(--bg);
  display:grid;place-items:center;flex-shrink:0;transition:transform .2s,background .2s;color:var(--muted);
}
.FQ[open] .FQ-arr{transform:rotate(180deg);background:var(--brand-soft);color:var(--brand)}
.FQ-a{padding:0 22px 22px 66px;color:var(--muted);line-height:1.95;font-size:13.5px}
.FQ-a a{color:var(--brand);text-decoration:underline}

/* ====================== CTA ====================== */
#cta{padding:80px 0;background:#FFFFFF;border-top:1px solid var(--line)}
.CTAbox{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg, #0F308C 0%, #1E50E2 60%, #0F308C 100%);
  border:1px solid var(--brand-deep);
  border-radius:20px;padding:64px 56px;
  text-align:center;color:#FFFFFF;
  box-shadow:0 30px 90px -40px rgba(15,48,140,.6), inset 0 1px 0 rgba(255,255,255,.12);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;
}
.CTAbox::before{
  content:"";position:absolute;top:-40%;right:-10%;width:520px;height:520px;
  background:radial-gradient(circle, rgba(255,255,255,.22), transparent 70%);
  pointer-events:none;
}
.CTAbox::after{
  content:"";position:absolute;bottom:-30%;left:-10%;width:420px;height:420px;
  background:radial-gradient(circle, rgba(157,184,255,.28), transparent 70%);
  pointer-events:none;
}
.CTAbox > *{position:relative;z-index:1;margin:0}
.CTAbox .SecHead-eyebrow{color:#FFFFFF;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.40);font-weight:800;letter-spacing:.12em;padding:7px 16px;display:inline-block}
.CTAbox h2{font-size:clamp(26px,3vw,38px);font-weight:800;letter-spacing:-.02em;line-height:1.45;color:#FFFFFF;text-shadow:0 2px 24px rgba(0,0,0,.22);max-width:780px}
.CTAbox p{font-size:15.5px;color:rgba(255,255,255,.94);max-width:600px;line-height:1.9;font-weight:500}
.CTAbox .CTAacts{margin-top:14px;display:inline-flex;gap:14px;flex-wrap:wrap;justify-content:center}
.CTAbox .Btn-A{background:#FFFFFF;color:var(--brand-deep);font-weight:800;padding:15px 28px;box-shadow:0 12px 32px -12px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.6)}
.CTAbox .Btn-A:hover{background:#FFFFFF;color:var(--brand-deep);transform:translateY(-2px);box-shadow:0 20px 40px -16px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.6)}
.CTAbox .Btn-O{background:rgba(255,255,255,.10);color:#FFFFFF;border:1.5px solid rgba(255,255,255,.7);font-weight:700;padding:15px 28px;backdrop-filter:blur(6px)}
.CTAbox .Btn-O:hover{background:rgba(255,255,255,.22);color:#FFFFFF;border-color:#FFFFFF;transform:translateY(-2px)}

/* ====================== CONTACT ====================== */
#contact{padding:104px 0;background:var(--bg);border-top:1px solid var(--line)}
.CTwrap{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:start}
.CT-l h2{font-size:28px;font-weight:700;margin-top:14px;margin-bottom:14px;letter-spacing:-.012em;line-height:1.45}
.CT-l p{color:var(--muted);font-size:14px;line-height:1.9;margin-bottom:32px}
.CT-info{display:flex;flex-direction:column;gap:18px;margin-top:24px}
.CT-info-item{display:flex;gap:14px;align-items:flex-start}
.CT-info-ic{width:36px;height:36px;border-radius:6px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex-shrink:0}
.CT-info-l{font-size:11px;color:var(--muted);letter-spacing:.04em;font-weight:600}
.CT-info-v{font-size:14px;font-weight:600;color:var(--ink);margin-top:2px;line-height:1.55}

.CTform{background:#fff;border:1px solid var(--line);border-radius:10px;padding:36px}
.CTrow{margin-bottom:18px}
.CTrow-g{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.CTlbl{display:block;font-size:12.5px;font-weight:600;color:var(--ink-2);margin-bottom:7px}
.CTlbl em{font-style:normal;color:var(--danger);margin-left:3px}
.CTin,.CTta,.CTsel{
  width:100%;padding:11px 13px;border:1px solid var(--line);
  border-radius:6px;font-size:13.5px;color:var(--ink);
  font-family:inherit;background:#fff;
  transition:border-color .15s,box-shadow .15s;
}
.CTin:focus,.CTta:focus,.CTsel:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.CTta{min-height:120px;resize:vertical}
.CTsubmit{
  width:100%;padding:13px;background:var(--brand);color:#fff;
  border-radius:6px;font-weight:600;font-size:14px;
  transition:background .15s;
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.CTsubmit:hover{background:var(--brand-2)}
.CTagree{font-size:12px;color:var(--muted);margin-top:12px;line-height:1.65;text-align:center}
.CTagree a{color:var(--brand);text-decoration:underline}

/* ====================== FOOTER ====================== */
#footer{background-color:#0B1424;color:rgba(255,255,255,.88);padding:72px 0 32px}
.FtG{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,.16)}
.FtLogo{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:18px;color:#fff;letter-spacing:-.01em}
.FtLogo .Logo-mark{color:#fff}
.FtTag{margin-top:14px;font-size:13px;color:rgba(255,255,255,.82);line-height:1.85;max-width:320px}
.FtCo{margin-top:14px;font-size:12px;color:rgba(255,255,255,.68);font-weight:600}
.FtCH{font-size:12px;color:#FFFFFF;font-weight:800;letter-spacing:.1em;margin-bottom:18px;text-transform:uppercase}
.FtLinks{display:flex;flex-direction:column;gap:11px}
.FtLinks a{font-size:13.5px;color:rgba(255,255,255,.85);font-weight:500;transition:color .15s,padding-left .2s;position:relative;padding-left:0}
.FtLinks a:hover{color:#FFFFFF;padding-left:6px}
.FtBot{padding-top:24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px}
.FtCopy{font-size:11.5px;color:rgba(255,255,255,.7);font-weight:500}
.FtLgl{display:flex;gap:18px}
.FtLgl a{font-size:11.5px;color:rgba(255,255,255,.7);font-weight:500;transition:color .15s}
.FtLgl a:hover{color:#FFFFFF}

/* ====================== HUB DIAGRAM (centralized mgmt) ====================== */
#hub{background:#fff}
.Hub{
  margin-top:48px;display:grid;grid-template-columns:1fr 1.4fr 1fr;gap:24px;align-items:stretch;
}
.Hub-col{display:flex;flex-direction:column;gap:10px}
.Hub-col-h{font-family:var(--ff-mono);font-size:11px;color:var(--muted);font-weight:600;letter-spacing:.06em;margin-bottom:6px;text-align:center}
.Hub-node{
  background:#fff;border:1px solid var(--line);border-radius:8px;
  padding:14px 16px;display:flex;align-items:center;gap:11px;
  font-size:13px;font-weight:600;color:var(--ink-2);
  transition:border-color .15s,background .15s;
}
.Hub-node:hover{border-color:var(--brand-line);background:var(--brand-mist)}
.Hub-node-ic{flex-shrink:0;width:28px;height:28px;border-radius:6px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center}
.Hub-core{
  background:linear-gradient(180deg,#FAFBFC 0%,#EAF0FD 100%);
  border:1px solid var(--brand-line);border-radius:12px;
  padding:32px 24px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:14px;
  position:relative;text-align:center;
}
.Hub-core-mark{
  width:56px;height:56px;border-radius:12px;background:var(--brand);color:#fff;
  display:grid;place-items:center;font-weight:700;font-size:22px;
  box-shadow:0 6px 18px rgba(30,80,226,.20);
}
.Hub-core-l{font-family:var(--ff-mono);font-size:11px;color:var(--brand);font-weight:600;letter-spacing:.08em}
.Hub-core-h{font-size:17px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.Hub-core-p{font-size:12.5px;color:var(--muted);line-height:1.7}
.Hub-core-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;width:100%;margin-top:8px}
.Hub-core-cell{background:#fff;border:1px solid var(--line-2);border-radius:6px;padding:8px 10px;display:flex;align-items:center;gap:7px;font-size:11.5px;font-weight:600;color:var(--ink-2)}
.Hub-core-cell svg{color:var(--brand);flex-shrink:0}

/* ====================== OPERATIONAL FLOW ====================== */
#opsflow{
  background:#fff;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  position:relative;
}
.OF-wrap{position:relative;margin-top:56px;padding-top:0}
.OF{
  display:grid;grid-template-columns:repeat(5,1fr);gap:16px;
  position:relative;z-index:1;
}
.OF::before{
  content:"";position:absolute;left:6%;right:6%;top:16px;height:2px;
  background-image:linear-gradient(90deg,var(--brand-line) 50%,transparent 50%);
  background-size:12px 2px;background-repeat:repeat-x;
  z-index:0;
}
.OF-track{display:none}
.OF-step{display:flex;flex-direction:column;position:relative}

/* Header strip: number + step label inline above card */
.OF-head{
  display:flex;align-items:center;gap:10px;
  padding:0 4px;margin-bottom:14px;position:relative;z-index:2;
}
.OF-num{
  width:32px;height:32px;border-radius:50%;
  background:var(--brand);color:#fff;
  display:grid;place-items:center;font-weight:700;font-size:13px;
  font-family:var(--ff-disp);flex-shrink:0;
  box-shadow:0 0 0 4px #fff,0 2px 6px rgba(30,80,226,.30);
}
.OF-label{
  font-family:var(--ff-mono);font-size:10.5px;color:var(--brand);
  font-weight:600;letter-spacing:.08em;
  background:#fff;padding:4px 8px;border-radius:4px;
  position:relative;z-index:2;
}

/* Card body */
.OF-card{
  background:#fff;border:1px solid var(--line);border-radius:10px;
  padding:24px 22px;flex-grow:1;
  display:flex;flex-direction:column;gap:12px;
  transition:border-color .2s,box-shadow .2s,transform .2s;
}
.OF-step:hover .OF-card{border-color:var(--brand-line);box-shadow:var(--sh-sm);transform:translateY(-2px)}

.OF-card-ic{
  width:44px;height:44px;border-radius:10px;
  background:var(--brand-soft);color:var(--brand);
  display:grid;place-items:center;
}
.OF-illust{display:block;margin:-4px -4px 14px;border-radius:8px;overflow:hidden}
.OF-illust svg{display:block;width:100%;height:auto}
.OF-h{font-size:15px;font-weight:700;color:var(--ink);letter-spacing:-.005em;line-height:1.5}
.OF-p{font-size:12.5px;color:var(--muted);line-height:1.85;text-align:left}

/* ====================== BEFORE / AFTER ====================== */
#compare{background:#fff}
.Cmp{margin-top:48px;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.Cmp-col{background:#fff;padding:36px 32px}
.Cmp-col.before{background:#FAFBFC}
.Cmp-illust{display:block;width:100%;height:auto;border-radius:10px;margin:-8px 0 18px}
.Cmp-tag{
  display:inline-flex;align-items:center;gap:6px;
  padding:3px 10px;border-radius:4px;
  font-family:var(--ff-mono);font-size:11px;font-weight:600;letter-spacing:.06em;
}
.Cmp-tag.b{background:#F3EEEA;color:#7C5A3F}
.Cmp-tag.a{background:var(--brand-soft);color:var(--brand)}
.Cmp-h{font-size:18px;font-weight:700;margin:12px 0 18px;color:var(--ink);letter-spacing:-.01em}
.Cmp-list{display:flex;flex-direction:column;gap:14px}
.Cmp-li{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--ink-3);line-height:1.75}
.Cmp-li-ic{flex-shrink:0;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;margin-top:1px;font-size:11px;font-weight:700}
.Cmp-li-ic.b{background:#F3EEEA;color:#7C5A3F}
.Cmp-li-ic.a{background:var(--brand-soft);color:var(--brand)}
.Cmp-foot{margin-top:24px;padding-top:18px;border-top:1px solid var(--line-2);display:grid;grid-template-columns:1fr 1fr;gap:14px}
.Cmp-stat-l{font-size:11px;color:var(--muted);font-weight:600}
.Cmp-stat-v{font-size:20px;font-weight:700;color:var(--ink);margin-top:3px;letter-spacing:-.01em}
.Cmp-stat-v.pos{color:var(--brand)}

/* ====================== MULTI-STORE BLOCK ====================== */
#multi{background:var(--bg);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.MS{margin-top:48px;display:grid;grid-template-columns:1fr 1.2fr;gap:48px;align-items:center}
.MS-l h3{font-size:24px;font-weight:700;margin-bottom:14px;letter-spacing:-.012em}
.MS-l p{font-size:14.5px;color:var(--muted);line-height:1.9}
.MS-l ul{margin-top:22px;display:flex;flex-direction:column;gap:11px}
.MS-l ul li{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--ink-3)}
.MS-l ul li svg{flex-shrink:0;color:var(--brand);margin-top:3px}
.MSpanel{
  background:#fff;border:1px solid var(--line);border-radius:8px;
  padding:24px;box-shadow:var(--sh-sm);
}
.MSpanel-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid var(--line-2)}
.MSpanel-h-l{font-size:13px;font-weight:700;color:var(--ink)}
.MSpanel-h-r{font-family:var(--ff-mono);font-size:11px;color:var(--muted)}
.MStable{display:flex;flex-direction:column;gap:1px;background:var(--line-2);border:1px solid var(--line-2);border-radius:6px;overflow:hidden}
.MStr{display:grid;grid-template-columns:1.4fr 1fr 1fr 80px;gap:12px;padding:11px 14px;background:#fff;font-size:12.5px;align-items:center}
.MStr.head{background:var(--bg);font-family:var(--ff-mono);font-size:10.5px;color:var(--muted);font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:9px 14px}
.MStr-shop{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--ink)}
.MStr-shop-d{width:8px;height:8px;border-radius:50%;background:var(--positive)}
.MStr-shop-d.warn{background:var(--warn)}
.MStr-v{color:var(--ink-2);font-weight:600}
.MStr-d{color:var(--positive);font-weight:600;font-size:11.5px}
.MStr-d.dn{color:var(--danger)}
.MStr-bar{height:5px;background:var(--bg-3);border-radius:3px;overflow:hidden;position:relative}
.MStr-bar > i{display:block;height:100%;background:var(--brand);border-radius:3px}

/* ====================== DEVICE PREVIEW ====================== */
#devices{background:#fff;border-top:1px solid var(--line)}
.Dev{
  margin-top:48px;
  background:linear-gradient(180deg,#F5F8FE 0%,#FFFFFF 100%);
  border:1px solid var(--line);border-radius:14px;
  padding:56px 40px 0;overflow:hidden;
  display:flex;justify-content:center;align-items:flex-end;gap:24px;
  min-height:380px;position:relative;
}
.Dev-laptop{flex:0 0 60%;max-width:560px}
.Dev-laptop-screen{
  background:#fff;border:1px solid var(--line);border-radius:8px 8px 0 0;
  overflow:hidden;box-shadow:var(--sh-pop);
}
.Dev-laptop-base{
  height:14px;background:linear-gradient(180deg,#E5E8EE,#D5D9E2);
  border-radius:0 0 12px 12px;margin:0 -28px;
  position:relative;
}
.Dev-laptop-base::after{
  content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:80px;height:3px;background:rgba(14,23,38,.08);border-radius:0 0 6px 6px;
}
.Dev-phone{
  flex:0 0 180px;align-self:flex-end;margin-bottom:14px;
  background:#fff;border:6px solid #1F2A3D;border-radius:24px;
  padding:8px;box-shadow:var(--sh-pop);
}
.Dev-phone-screen{background:#fff;border-radius:16px;overflow:hidden;min-height:340px}
.Dev-phone-bar{background:var(--brand);color:#fff;padding:10px;text-align:center;font-size:11px;font-weight:600}
.Dev-phone-body{padding:14px 10px}
.Dev-phone-card{background:var(--bg);border:1px solid var(--line-2);border-radius:6px;padding:10px;margin-bottom:8px}
.Dev-phone-card-l{font-size:10px;color:var(--muted);font-weight:600}
.Dev-phone-card-v{font-size:14px;font-weight:700;color:var(--ink);margin-top:2px}
.Dev-phone-card-d{font-size:10px;color:var(--positive);font-weight:600;margin-top:2px}
.Dev-phone-list{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.Dev-phone-li{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;background:var(--bg);border-radius:5px;font-size:11px}
.Dev-phone-li-n{font-weight:600;color:var(--ink)}
.Dev-phone-li-t{font-size:10px;color:var(--muted);margin-top:1px}
.Dev-phone-li-s{padding:1px 6px;border-radius:var(--r-pill);background:var(--brand-soft);color:var(--brand);font-size:9.5px;font-weight:600}

/* ====================== METRICS BLOCK (light) ====================== */
.MetG{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-top:48px}
.MetC{background:#fff;padding:22px 22px 24px;display:flex;flex-direction:column;gap:0;transition:background .2s}
.MetC:hover{background:var(--brand-mist)}
.MetC-illust{display:block;margin-bottom:16px;border-radius:8px;overflow:hidden}
.MetC-illust svg{display:block;width:100%;height:auto}
.MetC-ic{width:32px;height:32px;border-radius:6px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;margin-bottom:14px}
.MetC-v{font-size:22px;font-weight:700;color:var(--ink);letter-spacing:-.015em;line-height:1.2}
.MetC-l{font-size:12.5px;color:var(--muted);margin-top:8px;font-weight:500;line-height:1.7}
@media (max-width:840px){.MetG{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.MetG{grid-template-columns:1fr}}

/* ====================== ANIMATIONS ====================== */
.fi{opacity:0;transform:translateY(8px);transition:opacity .5s ease,transform .5s ease}
.fi.in{opacity:1;transform:translateY(0)}
.d1{transition-delay:.06s}.d2{transition-delay:.12s}.d3{transition-delay:.18s}.d4{transition-delay:.24s}
.d5{transition-delay:.30s}.d6{transition-delay:.36s}

/* ====================== RESPONSIVE ====================== */
@media (max-width:1024px){
  .HG{grid-template-columns:1fr;gap:48px}
  .MG{grid-template-columns:1fr}
  .IG{grid-template-columns:repeat(2,1fr)}
  .WG{grid-template-columns:repeat(2,1fr)}
  .StatG{grid-template-columns:repeat(2,1fr)}
  .StatC{padding:28px 24px}
  .VG{grid-template-columns:1fr;max-width:560px;margin-left:auto;margin-right:auto}
  .T-row{grid-template-columns:repeat(3,1fr)}
  .CTwrap{grid-template-columns:1fr;gap:40px}
  .FR{grid-template-columns:1fr;gap:40px;padding:56px 0}
  .FR.flip .FR-txt{order:1}.FR.flip .FR-vis{order:2}
  .OnPrem{grid-template-columns:1fr}
  .OnPrem-l{border-right:0;border-bottom:1px solid var(--line-2)}
  .Hub{grid-template-columns:1fr;gap:18px}
  .OF{grid-template-columns:repeat(2,1fr);gap:18px}
  .OF::before{display:none}
  .MS{grid-template-columns:1fr;gap:32px}
  .MetG{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:720px){
  section{padding:72px 0}
  #hero{padding:calc(var(--nav-h) + 48px) 0 64px}
  .NLinks,.NLogin{display:none}
  .Burger{display:flex}
  .PG{grid-template-columns:1fr}
  .IG{grid-template-columns:1fr}
  .WG{grid-template-columns:1fr}
  .PrG{grid-template-columns:1fr}
  .StatG{grid-template-columns:1fr}
  .StatC-bar{grid-template-columns:60px 1fr 50px;gap:10px}
  .StatC-freq{grid-template-columns:60px 1fr;gap:10px}
  .T-row{grid-template-columns:repeat(2,1fr)}
  .FR-feats{grid-template-columns:1fr}
  .CTAbox{padding:40px 24px}
  .CTform{padding:24px 20px}
  .CTrow-g{grid-template-columns:1fr}
  .FtG{grid-template-columns:1fr 1fr;gap:28px}
  .OnPrem-l,.OnPrem-r{padding:28px 22px}
  .OnPrem-list{grid-template-columns:1fr}
  .OnPrem-row{grid-template-columns:1fr}
  .Cmp{grid-template-columns:1fr}
  .Cmp-col{padding:28px 22px}
  .OF{grid-template-columns:1fr;gap:14px}
  .Dev{padding:32px 16px 0;flex-direction:column;align-items:center;gap:0;min-height:auto}
  .Dev-laptop{flex:0 0 auto;width:100%;max-width:none}
  .Dev-phone{display:none}
  .MetG{grid-template-columns:1fr 1fr}
  .MStr{grid-template-columns:1.4fr 1fr 60px;gap:8px;font-size:11.5px;padding:9px 10px}
  .MStr > :nth-child(3),.MStr.head > :nth-child(3){display:none}
}

/* ====================== PLANS ====================== */
#pricing{background:var(--bg);border-top:1px solid var(--line)}
.pricing-toggle{display:inline-flex;align-items:center;background:#fff;border:1px solid var(--line);border-radius:100px;padding:4px;gap:0;margin-top:22px}
.PrT{font-family:var(--ff-mono);font-size:12px;letter-spacing:.06em;padding:8px 18px;border-radius:100px;cursor:pointer;transition:background .15s,color .15s;color:var(--muted);background:transparent;border:0;font-weight:600}
.PrT.on{background:var(--ink);color:#fff}
.PrT:hover:not(.on){color:var(--ink)}
.Plans{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px}
.PlanC{position:relative;background:#fff;border:1px solid var(--line);border-radius:14px;padding:32px 28px;display:flex;flex-direction:column;gap:14px;transition:border-color .15s,box-shadow .15s}
.PlanC:hover{border-color:var(--brand-line);box-shadow:0 8px 32px -16px rgba(30,80,226,.15)}
.PlanC.is-pop{border-color:var(--brand);box-shadow:0 12px 40px -20px rgba(30,80,226,.4)}
.PlanC-pop{position:absolute;top:-12px;right:24px;background:var(--brand);color:#fff;font-size:11px;font-weight:700;padding:5px 12px;border-radius:999px;letter-spacing:.04em}
.PlanC-tag{font-family:var(--ff-mono);font-size:11px;color:var(--brand);font-weight:600;letter-spacing:.08em}
.PlanC-h{font-size:20px;font-weight:700;color:var(--ink);letter-spacing:-.012em}
.PlanC-p{font-size:13px;color:var(--muted);line-height:1.85}
.PlanC-list{list-style:none;padding:0;margin:4px 0 12px;display:flex;flex-direction:column;gap:9px;border-top:1px solid var(--line-2);padding-top:18px}
.PlanC-list li{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--ink-3);line-height:1.55}
.PlanC-list li svg{flex-shrink:0;color:var(--brand);margin-top:3px}
.PlanC-price{margin-top:auto;padding:16px 0;border-top:1px solid var(--line-2);display:flex;align-items:baseline;justify-content:space-between}
.PlanC-price-l{font-size:11px;color:var(--muted);font-weight:600;letter-spacing:.04em}
.PlanC-price-v{font-size:18px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.PlanC-btn{display:inline-flex;justify-content:center;align-items:center;padding:13px 16px;border-radius:8px;background:var(--bg-3);color:var(--ink);font-size:13px;font-weight:700;border:1px solid var(--line);transition:background .15s,color .15s,border-color .15s;cursor:pointer}
.PlanC-btn:hover{background:var(--brand-mist);color:var(--brand);border-color:var(--brand-line)}
.PlanC-btn.pri{background:var(--brand);color:#fff;border-color:var(--brand)}
.PlanC-btn.pri:hover{background:var(--brand-2);color:#fff;border-color:var(--brand-2)}
.Plans-note{text-align:center;margin-top:28px;font-size:12.5px;color:var(--muted);line-height:1.85}
@media (max-width:840px){.Plans{grid-template-columns:1fr}}

.EntBand{margin-top:48px;display:grid;grid-template-columns:minmax(280px,420px) 1fr;gap:48px;align-items:center;background:#fff;border:1px solid var(--brand-line);border-radius:18px;padding:36px;background:linear-gradient(180deg,#fff,var(--brand-mist))}
.EntBand-l img{display:block;width:100%;height:auto;border-radius:12px}
.EntBand-tag{font-family:var(--ff-mono);font-size:11px;color:var(--brand);font-weight:600;letter-spacing:.08em}
.EntBand-h{font-size:24px;font-weight:700;color:var(--ink);letter-spacing:-.015em;margin:12px 0 14px}
.EntBand-p{font-size:14px;color:var(--muted);line-height:1.9}
.EntBand-list{list-style:none;padding:0;margin:18px 0 22px;display:flex;flex-direction:column;gap:8px}
.EntBand-list li{font-size:13.5px;color:var(--ink-3);padding-left:22px;position:relative}
.EntBand-list li::before{content:"";position:absolute;left:0;top:8px;width:12px;height:2px;background:var(--brand)}
.EntBand-btn{display:inline-flex;gap:8px;align-items:center;padding:13px 22px;background:var(--brand);color:#fff;border-radius:8px;font-size:13.5px;font-weight:700;transition:background .15s}
.EntBand-btn:hover{background:var(--brand-2)}
@media (max-width:840px){.EntBand{grid-template-columns:1fr;gap:24px;padding:24px}}

/* ====================== SECURITY ====================== */
#security{background:#fff}
.SecG{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-top:48px}
.SecC{background:#fff;padding:30px 26px}
.SecC-ic{width:44px;height:44px;border-radius:10px;background:var(--brand-mist);color:var(--brand);display:grid;place-items:center;margin-bottom:14px}
.SecC-h{font-size:16px;font-weight:700;color:var(--ink);margin-bottom:8px}
.SecC-p{font-size:13px;color:var(--muted);line-height:1.85}
@media (max-width:840px){.SecG{grid-template-columns:1fr}}

/* ====================== INTEGRATIONS ====================== */
#integrations{background:var(--bg);border-top:1px solid var(--line)}
.IntG{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:48px}
.IntC{background:#fff;border:1px solid var(--line);border-radius:12px;padding:22px 20px;transition:border-color .15s,transform .15s,box-shadow .15s}
.IntC:hover{border-color:var(--brand-line);transform:translateY(-2px);box-shadow:0 8px 24px -16px rgba(30,80,226,.2)}
.IntC-ic{width:40px;height:40px;border-radius:10px;background:var(--brand-mist);color:var(--brand);display:grid;place-items:center;margin-bottom:14px;transition:background .15s,color .15s}
.IntC:hover .IntC-ic{background:var(--brand);color:#fff}
.IntC-h{font-size:14.5px;font-weight:700;color:var(--ink);margin-bottom:8px}
.IntC p{font-size:12.5px;color:var(--muted);line-height:1.8;margin:0}
@media (max-width:840px){.IntG{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.IntG{grid-template-columns:1fr}}

/* ====================== ILLUSTRATIONS ====================== */
.HAccent{position:absolute;top:-44px;right:-56px;width:300px;height:300px;pointer-events:none;opacity:.55;z-index:0;mix-blend-mode:multiply}
.HG-r{position:relative}
.HG-r .HMock{position:relative;z-index:1}
.OnPremIllust{margin:32px 0 22px;display:flex;justify-content:center;background:linear-gradient(180deg,var(--brand-mist),#fff);border:1px solid var(--brand-line);border-radius:14px;padding:24px;overflow:hidden}
.OnPremIllust img{width:100%;max-width:520px;height:auto;display:block}
@media (max-width:840px){
  .HAccent{display:none}
  .OnPremIllust{padding:14px}
}
@media (prefers-reduced-motion:reduce){.HAccent{opacity:.3}}

/* ====================== VISUAL POLISH LAYER (bunridge-style) ====================== */

:root{
  --soft:#F4F6FA;            /* alt section bg */
  --soft-2:#EEF2F8;          /* deeper soft */
  --watermark:rgba(30,80,226,.07);
  --watermark-dark:rgba(122,160,255,.10);
}

/* GIANT SECTION WATERMARK utility — apply via class="has-wm" data-wm="Features" data-wm-pos="right" */
.has-wm{position:relative;overflow:hidden}
.has-wm > .W{position:relative;z-index:1}
.has-wm::before{
  content:attr(data-wm);
  position:absolute;
  font-family:'Manrope','Plus Jakarta Sans','Inter',sans-serif;
  font-weight:900;
  font-size:clamp(110px,18vw,260px);
  letter-spacing:-.05em;
  line-height:.78;
  color:transparent;
  -webkit-text-stroke:1.5px var(--watermark);
  pointer-events:none;
  user-select:none;
  z-index:0;
  white-space:nowrap;
  text-transform:capitalize;
}
.has-wm[data-wm-pos="right"]::before{top:48px;right:-2vw}
.has-wm[data-wm-pos="left"]::before{top:48px;left:-2vw}
.has-wm[data-wm-pos="bottom-right"]::before{bottom:48px;right:-2vw}
.has-wm[data-wm-pos="bottom-left"]::before{bottom:48px;left:-2vw}
.has-wm[data-wm-pos="center"]::before{top:50%;left:50%;transform:translate(-50%,-50%)}
@media (max-width:840px){.has-wm::before{font-size:clamp(64px,22vw,140px);top:24px}}

/* HERO — clean white w/ angled blue accent panel behind */
#hero{
  background:#FFFFFF;
  overflow:hidden;
  position:relative;
}
#hero::before{
  content:"";position:absolute;
  top:-10%;left:-20%;width:55%;height:120%;
  background:linear-gradient(135deg, rgba(30,80,226,.07) 0%, rgba(15,48,140,.04) 100%);
  border-radius:0 60% 60% 0;
  transform:skewY(-6deg);
  pointer-events:none;
  z-index:0;
}
#hero::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(15,48,140,.12),transparent);
  pointer-events:none;
}
#hero .W{position:relative;z-index:1}

/* ALTERNATING BAND PATTERN (bunridge rhythm: white / soft / white / soft) */
#trust{background:#FFFFFF}
#pain{background:var(--soft)}
#hub{background:#FFFFFF}
#modules{background:var(--soft)}
#features{background:#FFFFFF}
#multi{background:var(--soft)}
#devices{background:#FFFFFF}
#industries{background:var(--soft)}
#workflow{background:#FFFFFF}
#voices{background:var(--soft)}
#security{background:#FFFFFF}
#integrations{background:var(--soft)}
#pricing{background:#FFFFFF}
#faq{background:var(--soft)}
#contact{background:#FFFFFF}

/* STATS — dark contrast band w/ refined blue-only highlight (no gold mush) */
#stats{
  background:
    radial-gradient(900px 500px at 80% -10%, rgba(122,160,255,.16), transparent 60%),
    linear-gradient(180deg, #0B1424 0%, #16223C 100%);
  color:#FFFFFF;border-top:none;position:relative;overflow:hidden;
}
#stats.has-wm::before{-webkit-text-stroke-color:rgba(157,184,255,.20);opacity:.6}
#stats .SecHead h2{color:#FFFFFF}
#stats .SecHead h2 em{color:#9DB8FF}
#stats .SecHead p{color:rgba(255,255,255,.88)}
#stats .SecHead-eyebrow{color:#9DB8FF;background:rgba(157,184,255,.14);border-color:rgba(157,184,255,.3)}
.StatC{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(8px);transition:background .2s,border-color .2s,transform .2s}
.StatC:hover{background:rgba(255,255,255,.10);border-color:rgba(157,184,255,.55);transform:translateY(-2px)}
.StatC-cat{color:rgba(255,255,255,.78);font-weight:700}
.StatC-ic{background:rgba(157,184,255,.22);color:#C7D6FF}
.StatC-v{color:#FFFFFF}
.StatC-v em{color:#9DB8FF;font-style:normal}
.StatC-l{color:rgba(255,255,255,.82);line-height:1.7}
.StatC-bar-l{color:rgba(255,255,255,.85);font-weight:700}
.StatC-bar-v{color:#FFFFFF;font-weight:700}
.StatC-bar-t{background:rgba(255,255,255,.14)}
.StatC-bar-f{background:rgba(255,255,255,.3) !important}
.StatC-bar.aft .StatC-bar-f{background:#9DB8FF !important}
.StatC-bar.aft .StatC-bar-v{color:#9DB8FF}
.StatC-freq-l{color:rgba(255,255,255,.85);font-weight:700}
.StatC-freq-dot{background:rgba(255,255,255,.2)}
.StatC-freq-dot.on{background:#9DB8FF}
.StatC-pill{background:rgba(157,184,255,.18);color:#FFFFFF;border:1px solid rgba(157,184,255,.4);font-weight:700}
.StatC-pill.pos{background:rgba(121,240,179,.22);color:#9DF5C2;border-color:rgba(121,240,179,.5)}
.StatC-arrow{color:rgba(255,255,255,.7)}
.StatC-arrow svg{color:rgba(255,255,255,.7)}
.StatC-cal-day{background:rgba(255,255,255,.08);color:rgba(255,255,255,.75);border-color:rgba(255,255,255,.16);font-weight:700}
.StatC-cal-day.done{background:rgba(157,184,255,.22);color:#C7D6FF;border-color:rgba(157,184,255,.4)}
.StatC-cal-day.on{background:#9DB8FF;color:#0B1424;border-color:#9DB8FF}
.StatC-foot{border-top-color:rgba(255,255,255,.14) !important}
#stats .StatG{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14)}
#stats .SecHead h2{font-size:clamp(28px,3.2vw,40px);letter-spacing:-.015em;line-height:1.4}
#stats .SecHead p{font-size:15.5px;max-width:640px;margin:0 auto}
#stats .StatC{padding:34px 30px}
#stats .StatC-head{margin-bottom:4px}
#stats .StatC-v{font-size:22px;color:#FFFFFF}

/* CARD HOVER REFINEMENTS */
.T-lbl{color:var(--muted);font-size:12px;font-weight:600;letter-spacing:.04em;text-align:center;text-transform:uppercase}
.T-card{transition:border-color .2s,transform .2s,box-shadow .2s}
.T-card:hover{border-color:var(--brand-line);transform:translateY(-2px);box-shadow:0 8px 24px -16px rgba(30,80,226,.2)}
.MC{transition:background .2s,transform .2s,box-shadow .2s}
.MC:hover{background:#FFFFFF;transform:translateY(-2px);box-shadow:0 16px 40px -20px rgba(30,80,226,.18)}
.IC{transition:border-color .2s,transform .2s,box-shadow .2s,background .2s}
.IC:hover{border-color:var(--brand-line);transform:translateY(-3px);box-shadow:0 12px 32px -16px rgba(30,80,226,.2)}
.WC{transition:border-color .2s,transform .2s,box-shadow .2s,background .2s}
.WC:hover{border-color:var(--brand);transform:translateY(-2px);box-shadow:0 12px 32px -16px rgba(30,80,226,.25)}
.VC{transition:border-color .2s,transform .2s,box-shadow .2s}
.VC:hover{border-color:var(--brand-line);transform:translateY(-3px);box-shadow:0 16px 40px -20px rgba(30,80,226,.22)}
.SecC{transition:background .2s,transform .2s}
.SecC:hover{background:var(--brand-mist);transform:translateY(-2px)}
.FQ{transition:border-color .2s,box-shadow .2s}
.FQ:hover{border-color:var(--brand-line);box-shadow:0 4px 16px -8px rgba(30,80,226,.1)}

/* CTA / Contact */
#cta{padding:80px 0 96px;background:#FFFFFF}
#contact{padding-top:96px}

/* ====================== BUTTON REFINEMENT ====================== */
.Btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:13px 22px;border-radius:10px;font-size:13.5px;font-weight:700;
  letter-spacing:.005em;
  transition:transform .15s,box-shadow .2s,background .15s,color .15s,border-color .15s;
  cursor:pointer;
}
.Btn-A{
  background:linear-gradient(135deg,var(--brand),var(--brand-deep));
  color:#FFFFFF;border:1px solid var(--brand);
  box-shadow:0 6px 20px -8px rgba(30,80,226,.5), inset 0 1px 0 rgba(255,255,255,.18);
}
.Btn-A:hover{transform:translateY(-1px);box-shadow:0 12px 28px -10px rgba(30,80,226,.6)}
.Btn-A:active{transform:translateY(0)}
.Btn-O{
  background:#FFFFFF;color:var(--ink);
  border:1px solid var(--line);
}
.Btn-O:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-mist)}

/* ====================== CARD ELEVATION TIERS ====================== */
.PC{transition:border-color .2s,transform .2s,box-shadow .2s}
.PC:hover{transform:translateY(-3px);box-shadow:0 16px 40px -20px rgba(30,80,226,.18)}

/* ====================== SECTION HEAD POLISH ====================== */
.SecHead-eyebrow{
  display:inline-block;padding:5px 12px;border-radius:999px;
  background:var(--brand-soft);color:var(--brand);
  border:1px solid var(--brand-line);
  font-family:var(--ff-mono);font-size:11px;font-weight:700;letter-spacing:.1em;
  margin-bottom:18px;
}

/* ====================== NAV REFINEMENT ====================== */
#nav{
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  background:rgba(255,255,255,.78);
  transition:background .2s,border-color .2s,box-shadow .2s;
}
#nav.scrolled{
  background:rgba(255,255,255,.92);
  box-shadow:0 1px 0 var(--line),0 8px 32px -24px rgba(15,48,140,.18);
}
.NCta{box-shadow:0 4px 14px -6px rgba(30,80,226,.5)}
.NCta:hover{box-shadow:0 8px 20px -8px rgba(30,80,226,.65);transform:translateY(-1px)}

/* ====================== FOOTER REFINEMENT ====================== */
#footer{
  background-color:#0B1424;
  background-image:
    radial-gradient(900px 400px at 88% -10%, rgba(30,80,226,.30), transparent 65%),
    radial-gradient(700px 400px at 5% 100%, rgba(122,160,255,.10), transparent 60%),
    linear-gradient(180deg, #0B1424 0%, #060B17 100%);
  position:relative;
}
#footer .Logo-mark svg rect:first-child{fill:rgba(255,255,255,.12);stroke:rgba(255,255,255,.4)}
.FtLinks a{transition:color .15s}
.FtLinks a:hover{color:#FFFFFF}

/* ====================== HERO MOCK ELEVATION ====================== */
.HMock,.Dash{box-shadow:0 30px 80px -30px rgba(15,48,140,.4),0 12px 24px -16px rgba(15,48,140,.18)}

/* ====================== HUB CORE EMPHASIS ====================== */
.Hub-core{box-shadow:0 20px 60px -24px rgba(30,80,226,.35);position:relative}
.Hub-core::before{
  content:"";position:absolute;inset:-2px;border-radius:inherit;
  background:linear-gradient(135deg,rgba(30,80,226,.4),rgba(15,48,140,.2));
  z-index:-1;filter:blur(20px);opacity:.55;
}

/* ====================== ACCESSIBILITY: REDUCED MOTION ====================== */
@media (prefers-reduced-motion:reduce){
  *{transition:none !important;animation:none !important}
  .Btn-A:hover,.NCta:hover,.WC:hover,.IC:hover,.MC:hover,.PC:hover,.VC:hover,.SecC:hover,.T-card:hover,.IntC:hover{transform:none}
}

/* ====================== MOBILE NAV TWEAKS ====================== */
@media (max-width:840px){
  #hero{padding-top:calc(var(--nav-h) + 48px)}
  #stats{padding-bottom:64px}
}