:root { --ink:#10233a; --ink-deep:#081728; --paper:#f7f7f2; --white:#fff; --line:#d9dedb; --mint:#d7f04a; --teal:#087d79; --teal-deep:#075f5c; --muted:#5a6876; --radius:8px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.55 "DM Sans",Arial,sans-serif; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { font-family:Manrope,Arial,sans-serif; letter-spacing:0; line-height:1.04; }
h1 { max-width:840px; font-size:clamp(2.7rem,5.5vw,5.55rem); font-weight:800; }
h2 { font-size:clamp(2rem,3.6vw,3.45rem); font-weight:800; }
h3 { font-size:1.22rem; font-weight:800; }
a { color:inherit; }
.container { width:min(1180px,calc(100% - 48px)); margin-inline:auto; }

.site-header { position:relative; z-index:3; display:flex; align-items:center; justify-content:space-between; min-height:76px; padding:0 max(24px,calc((100vw - 1180px)/2)); background:var(--white); border-bottom:1px solid #e6e9e7; }
.brand { display:inline-flex; align-items:center; gap:11px; color:var(--ink); font-family:Manrope,Arial,sans-serif; font-size:.98rem; font-weight:800; text-decoration:none; white-space:nowrap; }
.brand-mark { display:block; width:35px; height:35px; object-fit:contain; background:transparent; border-radius:7px; }
.main-nav { display:flex; align-items:center; gap:28px; font-size:.92rem; font-weight:600; }
.main-nav a { text-decoration:none; }
.main-nav a:not(.nav-cta):hover,.text-link:hover { color:var(--teal); }
.nav-cta { padding:10px 15px; color:var(--white); background:var(--ink); border-radius:5px; }
.nav-toggle { display:none; padding:8px; border:0; background:transparent; }
.nav-toggle span { display:block; width:24px; height:2px; margin:4px; background:var(--ink); }

.hero { position:relative; display:flex; align-items:center; min-height:690px; overflow:hidden; color:var(--white); }
.hero-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-shade { position:absolute; inset:0; background:rgba(5,21,37,.64); }
.hero-content { position:relative; padding:110px 0 126px; }
.eyebrow { margin-bottom:17px; color:var(--teal); font-size:.73rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.eyebrow.light { color:var(--mint); }
.hero-copy { max-width:610px; margin:26px 0 32px; color:#e6edf1; font-size:1.18rem; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:13px; padding:13px 18px; border:0; border-radius:5px; font:700 .93rem "DM Sans",sans-serif; text-decoration:none; cursor:pointer; transition:transform .18s ease,background .18s ease; }
.button:hover { transform:translateY(-2px); }
.button-primary { color:#12222e; background:var(--mint); }
.button-primary:hover { background:#e2f765; }
.button-quiet { color:var(--white); border:1px solid rgba(255,255,255,.55); }
.button-light { color:var(--ink); background:var(--white); }
.hero-note { position:absolute; right:max(24px,calc((100vw - 1180px)/2)); bottom:25px; display:flex; align-items:center; gap:8px; font-size:.78rem; }
.status-dot { width:8px; height:8px; background:var(--mint); border-radius:50%; }

.section { padding:120px 0; }
.intro { display:grid; grid-template-columns:1.1fr .9fr; gap:10%; align-items:end; }
.section-lead h2 { max-width:710px; }
.intro-copy { max-width:500px; color:var(--muted); font-size:1.15rem; }
.text-link { display:inline-block; margin-top:10px; color:var(--ink); font-weight:700; text-decoration:none; }

.feature-band { padding:110px 0; background:#e7eeec; }
.section-heading { max-width:790px; }
.split-heading { display:flex; align-items:end; justify-content:space-between; gap:48px; max-width:none; }
.split-heading > div { max-width:690px; }
.split-heading > p { max-width:340px; margin-bottom:8px; color:var(--muted); }
.feature-grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:57px; border-top:1px solid #b7c4c0; }
.feature-item { min-height:264px; padding:28px 24px 20px 0; border-right:1px solid #b7c4c0; }
.feature-item:not(:first-child) { padding-left:24px; }
.feature-item:last-child { border-right:0; }
.feature-number { color:var(--teal); font-family:Manrope,sans-serif; font-size:.82rem; font-weight:800; }
.feature-item h3 { margin:44px 0 10px; }
.feature-item p { margin-bottom:0; color:var(--muted); font-size:.93rem; }

.workflow { display:grid; grid-template-columns:.95fr 1.05fr; gap:10%; align-items:center; }
.workflow-copy > p:not(.eyebrow) { max-width:520px; color:var(--muted); font-size:1.1rem; }
.check-list { display:grid; gap:12px; padding:0; margin:30px 0 0; font-weight:600; list-style:none; }
.check-list li::before { display:inline-grid; width:21px; height:21px; margin-right:10px; background:var(--mint); border-radius:50%; place-items:center; content:"OK"; font-size:.57rem; }
.workflow-panel { padding:26px; color:var(--white); background:var(--ink-deep); border-radius:var(--radius); box-shadow:13px 16px 0 var(--mint); }
.workflow-panel-header { display:flex; justify-content:space-between; padding-bottom:18px; border-bottom:1px solid #294157; font:700 .84rem Manrope,sans-serif; }
.live-label { color:#b8dbd8; font-family:"DM Sans",sans-serif; font-size:.74rem; }
.live-label i { display:inline-block; width:7px; height:7px; margin-right:5px; background:#67d3b1; border-radius:50%; }
.workflow-row { display:grid; grid-template-columns:34px 1fr auto; gap:12px; align-items:center; padding:18px 0; border-bottom:1px solid #294157; font-size:.93rem; }
.workflow-row b { color:var(--mint); font:700 .77rem Manrope,sans-serif; }
.workflow-row em { color:#b8dbd8; font-size:.75rem; font-style:normal; }
.workflow-bottom { display:flex; align-items:center; justify-content:space-between; padding-top:20px; font-weight:700; }
.workflow-bottom strong { display:grid; width:30px; height:30px; color:var(--ink); background:var(--mint); border-radius:50%; place-items:center; }

.insights-section { padding:115px 0; color:var(--white); background:var(--teal); }
.insights-wrap { display:grid; grid-template-columns:.95fr 1.05fr; gap:10%; align-items:center; }
.insights-copy h2 { max-width:530px; }
.insights-copy > p:not(.eyebrow) { max-width:490px; color:#d5eeec; font-size:1.08rem; }
.insights-copy .button { margin-top:14px; }
.metrics-board { display:grid; grid-template-columns:1.03fr .97fr; gap:12px; min-height:390px; padding:16px; background:var(--teal-deep); border-radius:var(--radius); }
.dashboard-main,.metric-small,.access-mix,.heatmap-preview { padding:19px; border:1px solid rgba(255,255,255,.22); border-radius:6px; }
.dashboard-main { display:flex; flex-direction:column; justify-content:flex-end; min-height:214px; }
.metrics-board span { display:block; color:#b6dfdb; font-size:.76rem; }
.metrics-board strong { display:block; margin:7px 0; font:800 clamp(2.2rem,4vw,4rem) Manrope,sans-serif; line-height:1.1; }
.metrics-board small { color:#d9f1ef; }
.dashboard-chips { display:flex; gap:8px; margin-top:22px; }
.dashboard-chips b { padding:5px 7px; color:#d9f1ef; background:rgba(255,255,255,.1); border-radius:3px; font-size:.67rem; letter-spacing:.05em; }
.dashboard-chips em { display:inline; margin-left:4px; color:var(--mint); font-style:normal; }
.dashboard-side { display:grid; grid-template-rows:1fr 1fr; gap:12px; }
.metric-small { display:flex; flex-direction:column; justify-content:center; min-height:101px; }
.metric-small strong { font-size:1.65rem; }
.access-mix { grid-column:span 2; }
.panel-title { display:flex; align-items:center; justify-content:space-between; margin-bottom:13px; }
.panel-title span { color:var(--white); font-weight:700; }
.panel-title small { color:#b6dfdb; font-size:.7rem; }
.mix-row { display:grid; grid-template-columns:1fr auto; gap:3px 10px; align-items:center; margin-top:8px; color:#d9f1ef; font-size:.69rem; }
.mix-row b { font-size:.68rem; }
.mix-row i { grid-column:span 2; height:4px; overflow:hidden; background:rgba(255,255,255,.16); border-radius:20px; }
.mix-row i em { display:block; height:100%; background:var(--mint); border-radius:inherit; }
.heatmap-preview { grid-column:span 2; }
.heatmap-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:5px; }
.heatmap-grid i { display:block; height:12px; background:rgba(255,255,255,.14); border-radius:2px; }
.heatmap-grid i.mid { background:#4caaa3; }
.heatmap-grid i.high { background:#9fd04e; }
.heatmap-grid i.peak { background:var(--mint); }
.heatmap-labels { display:flex; justify-content:space-between; margin-top:7px; color:#b6dfdb; font-size:.62rem; }
.heatmap-labels span { font-size:.62rem; }

.security { display:grid; grid-template-columns:.8fr 1.2fr; gap:10%; align-items:start; }
.security-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; padding-top:40px; }
.security-grid > div { padding-top:17px; border-top:2px solid var(--ink); }
.security-icon { color:var(--teal); font-size:1.65rem; }
.security-grid h3 { margin:14px 0 8px; }
.security-grid p { margin:0; color:var(--muted); font-size:.91rem; }

.deployment { padding:103px 0; background:#f0ad7e; }
.deployment-inner { display:grid; grid-template-columns:1fr 230px; gap:10%; align-items:center; }
.deployment-inner h2 { max-width:690px; }
.deployment-inner > div > p:not(.eyebrow) { max-width:710px; font-size:1.12rem; }
.brand-emblem { display:block; justify-self:end; width:190px; max-height:230px; object-fit:contain; }
.contact { display:grid; grid-template-columns:.9fr 1.1fr; gap:11%; align-items:start; }
.contact-copy p:not(.eyebrow) { max-width:460px; color:var(--muted); font-size:1.1rem; }
.contact-card { padding:30px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); }
.contact-card-label { color:var(--teal); font-size:.75rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.contact-card h3 { margin:17px 0 9px; font-size:1.65rem; }
.contact-card > p:not(.form-note) { max-width:440px; color:var(--muted); }
.contact-card .button { margin:13px 0 19px; }
.form-note { margin:0; color:var(--muted); font-size:.82rem; }
.form-note a { font-weight:700; }
.site-footer { padding:28px 0; color:#d8e1e5; background:var(--ink-deep); }
.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:20px; font-size:.78rem; }
.footer-inner .brand { color:var(--white); }
.footer-inner .brand-mark { background:var(--white); }
.footer-inner > span { color:#a9b9c4; }

@media (max-width:820px) {
  .main-nav { position:absolute; top:76px; right:0; left:0; display:none; flex-direction:column; align-items:flex-start; gap:17px; padding:18px 24px 25px; background:var(--white); border-bottom:1px solid #e6e9e7; }
  .main-nav.open { display:flex; }
  .nav-toggle { display:block; }
  .hero { min-height:625px; }
  .section { padding:84px 0; }
  .intro,.workflow,.insights-wrap,.security,.contact { grid-template-columns:1fr; gap:45px; }
  .feature-grid { grid-template-columns:1fr 1fr; }
  .feature-item:nth-child(2) { border-right:0; }
  .feature-item:nth-child(3) { padding-left:0; border-top:1px solid #b7c4c0; }
  .feature-item:nth-child(4) { border-top:1px solid #b7c4c0; }
  .split-heading { display:block; }
  .split-heading > p { margin-top:18px; }
  .security-grid { padding-top:0; }
  .deployment-inner { grid-template-columns:1fr; }
  .brand-emblem { justify-self:start; width:145px; max-height:180px; }
  .footer-inner { flex-wrap:wrap; }
  .hero-note { right:24px; }
}

@media (max-width:540px) {
  .container { width:min(100% - 32px,1180px); }
  .site-header { padding:0 16px; }
  .brand { font-size:.86rem; }
  .hero-content { padding:84px 0 115px; }
  .hero-copy { font-size:1.04rem; }
  .feature-band { padding:78px 0; }
  .feature-grid { grid-template-columns:1fr; margin-top:32px; }
  .feature-item,.feature-item:not(:first-child) { min-height:auto; padding:23px 0; border-right:0; border-bottom:1px solid #b7c4c0; }
  .feature-item h3 { margin:22px 0 9px; }
  .workflow-panel { padding:20px; box-shadow:8px 10px 0 var(--mint); }
  .metrics-board { grid-template-columns:1fr; min-height:0; }
  .dashboard-main { min-height:180px; }
  .access-mix,.heatmap-preview { grid-column:auto; }
  .security-grid { grid-template-columns:1fr; gap:23px; }
  .footer-inner { flex-direction:column; align-items:flex-start; gap:12px; }
  .hero-note { font-size:.67rem; }
  .deployment { padding:76px 0; }
}

.legal-nav { display:flex; align-items:center; gap:22px; font-size:.9rem; font-weight:600; }
.legal-nav a { text-decoration:none; }
.legal-nav a:not(.nav-cta):hover,.legal-nav a[aria-current="page"] { color:var(--teal); }
.legal-hero { padding:104px 0 78px; color:var(--white); background:var(--ink-deep); }
.legal-hero .eyebrow { color:var(--mint); }
.legal-hero h1 { margin-bottom:15px; }
.legal-hero p:last-child { margin:0; color:#b6c4cc; }
.legal-layout { display:grid; grid-template-columns:230px minmax(0,760px); justify-content:space-between; gap:9%; padding:88px 0 120px; }
.legal-aside { align-self:start; padding:20px; background:#e7eeec; border-radius:var(--radius); }
.legal-aside p { margin-bottom:7px; font-family:Manrope,Arial,sans-serif; font-weight:800; }
.legal-aside a { display:block; color:var(--teal); font-weight:700; }
.legal-aside small { display:block; margin-top:16px; color:var(--muted); font-size:.75rem; }
.legal-copy { font-size:.98rem; }
.legal-copy .legal-intro { margin-bottom:40px; color:var(--muted); font-size:1.15rem; }
.legal-copy h2 { margin:38px 0 12px; font-size:1.5rem; }
.legal-copy p { max-width:760px; }
.legal-copy ul { display:grid; gap:8px; padding-left:20px; }
.legal-copy a { color:var(--teal); font-weight:700; }

@media (max-width:820px) {
  .legal-layout { grid-template-columns:1fr; gap:32px; padding:64px 0 84px; }
  .legal-aside { max-width:390px; }
}

@media (max-width:540px) {
  .legal-nav { gap:14px; font-size:.78rem; }
  .legal-nav .nav-cta { display:none; }
  .legal-hero { padding:72px 0 56px; }
  .legal-copy .legal-intro { font-size:1.05rem; }
}
