:root {
  --bg: #f7f8f5;
  --surface: #ffffff;
  --surface-soft: #f0f3ee;
  --text: #101410;
  --muted: #5f675f;
  --muted-2: #858d86;
  --line: #dfe5dd;
  --line-strong: #cbd4cb;
  --green: #1ea85b;
  --green-dark: #0e703b;
  --ink: #111812;
  --shadow: 0 18px 48px rgba(20, 29, 20, .08);
  --radius: 8px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background: var(--bg);
  overflow-x: hidden;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background:
    linear-gradient(rgba(16, 20, 16, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(16, 20, 16, .035) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, black, transparent 640px);
}

::selection { background: rgba(30, 168, 91, .18); }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }
svg { display: block; }
.hero-orb, .cursor-glow, .noise { display: none; }

.scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  z-index: 90;
  transform: scaleX(0);
  transform-origin: left;
  background: var(--green);
}

.shell { width: min(1120px, calc(100% - 44px)); margin: 0 auto; }
.section-pad { position: relative; padding: 96px 0; }
.compact-top { padding-top: 70px; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(247, 248, 245, .88);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(14px);
}
.site-header.scrolled { box-shadow: 0 10px 30px rgba(16, 20, 16, .06); }
.nav-wrap { height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-size: 17px; font-weight: 800; letter-spacing: 0; }
.brand-mark { width: 31px; height: 31px; display: grid; place-items: center; color: var(--green); }
.brand-mark svg { width: 100%; }
.desktop-nav { display: flex; align-items: center; gap: 26px; margin-left: auto; }
.desktop-nav a { color: #555f57; font-size: 14px; font-weight: 600; }
.desktop-nav a:hover { color: var(--text); }

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border-radius: var(--radius);
  font-weight: 750;
  border: 1px solid transparent;
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.button:hover { transform: translateY(-1px); }
.button svg { width: 18px; height: 18px; }
.button-small { padding: 10px 14px; font-size: 13px; }
.button-dark { color: white; background: var(--ink); }
.button-primary { padding: 14px 18px; background: var(--green); color: #fff; box-shadow: 0 10px 24px rgba(30, 168, 91, .20); }
.button-primary:hover { background: #168f4b; }
.chrome-icon { width: 20px !important; height: 20px !important; }
.text-link { font-size: 14px; font-weight: 750; color: #344137; display: inline-flex; align-items: center; gap: 7px; }
.text-link span { transition: transform .2s ease; }
.text-link:hover span { transform: translateY(2px); }

.hero { padding-top: 86px; overflow: clip; }
.hero-grid { display: grid; grid-template-columns: .95fr 1.05fr; gap: 54px; align-items: center; }
.hero-copy { padding-top: 8px; }
.eyebrow, .kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--green-dark);
}
.eyebrow {
  border: 1px solid var(--line);
  background: #fff;
  padding: 9px 11px;
  border-radius: var(--radius);
}
.pulse-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); }
.hero h1 {
  font-size: clamp(48px, 6vw, 84px);
  line-height: .96;
  letter-spacing: -.04em;
  margin: 28px 0 22px;
  max-width: 720px;
}
.hero-lede { font-size: 18px; line-height: 1.65; color: var(--muted); max-width: 620px; margin: 0; }
.hero-actions { display: flex; align-items: center; gap: 20px; margin-top: 32px; flex-wrap: wrap; }
.hero-proof { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 28px; color: #526059; font-size: 12px; font-weight: 700; }
.hero-proof div {
  display: flex;
  align-items: center;
  gap: 7px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 8px 10px;
}
.check { width: 16px; height: 16px; border-radius: 50%; display: grid; place-items: center; font-size: 10px; background: rgba(30,168,91,.12); color: var(--green-dark); }

.hero-visual { min-width: 0; perspective: 1200px; }
.browser-card {
  position: relative;
  min-height: 522px;
  border: 1px solid var(--line-strong);
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--shadow);
  overflow: visible;
  transform-style: preserve-3d;
  transition: transform .15s ease-out;
}
.browser-topbar {
  height: 56px;
  display: grid;
  grid-template-columns: 1fr 2.2fr 1fr;
  align-items: center;
  gap: 12px;
  padding: 0 16px;
  border-bottom: 1px solid var(--line);
  background: #f8faf7;
  border-radius: 12px 12px 0 0;
}
.browser-dots { display: flex; gap: 6px; }
.browser-dots i { width: 9px; height: 9px; background: #cfd7cf; border-radius: 50%; }
.browser-url {
  height: 32px;
  border-radius: var(--radius);
  border: 1px solid var(--line);
  background: #fff;
  color: #768078;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 12px;
  font-size: 11px;
}
.lock { color: #5e6c62; font-size: 15px; }
.browser-actions { text-align: right; color: #8e9891; }
.browser-body { display: grid; grid-template-columns: 82px 1fr; min-height: 466px; overflow: hidden; border-radius: 0 0 12px 12px; }
.page-sidebar { border-right: 1px solid var(--line); display: flex; flex-direction: column; align-items: center; gap: 22px; padding: 24px 16px; background: #fbfcfa; }
.page-sidebar span:not(.side-logo) { width: 32px; height: 8px; border-radius: 99px; background: #e2e7e1; }
.side-logo { width: 30px; height: 21px; border-radius: 6px; background: #d84f4f; margin-bottom: 12px; }
.video-area { padding: 26px 24px; background: #fff; }
.video-canvas { position: relative; height: 268px; border-radius: var(--radius); overflow: hidden; background: #152018; }
.video-canvas::before { content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,.38)); }
.video-sheen { display: none; }
.play-button { position: absolute; inset: 0; margin: auto; width: 52px; height: 52px; border-radius: 50%; background: #f6f8f5; display: grid; place-items:center; color: #152018; font-size: 15px; padding-left: 3px; }
.clean-badge { position: absolute; left: 16px; bottom: 16px; background: rgba(16, 20, 16, .82); color: #fff; border-radius: var(--radius); padding: 8px 10px; font-size: 10px; font-weight: 650; display:flex; align-items:center; gap:6px; }
.clean-badge span { width:6px; height:6px; border-radius:50%; background:#57d784; }
.content-lines { display:flex; flex-direction:column; gap:12px; padding:18px 2px; }
.content-lines b { width:64%; height:15px; border-radius:4px; background:#e7ece6; }
.content-lines span { width:84%; height:10px; border-radius:4px; background:#f0f3ee; }
.content-lines span:last-child { width:52%; }

.popup-card {
  position: absolute;
  width: 318px;
  right: -20px;
  top: 92px;
  background: #fff;
  border: 1px solid var(--line-strong);
  border-radius: 12px;
  box-shadow: 0 22px 52px rgba(16,20,16,.14);
  padding: 18px;
  transform: translateZ(36px);
}
.popup-header, .domain-row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.mini-brand { display:flex; align-items:center; gap:9px; }
.mini-shield { width:34px; color:var(--green); }
.mini-shield svg { width:100%; }
.mini-brand div { display:flex; flex-direction:column; gap:2px; }
.mini-brand strong { font-size:13px; }
.mini-brand small, .domain-row small { color:#7f8a82; font-size:10px; }
.power-toggle, .switch { width:38px; height:22px; border-radius:999px; background:#dfe6df; padding:3px; display:flex; transition:.2s; flex: none; }
.power-toggle i, .switch i { display:block; width:16px; height:16px; border-radius:50%; background:#fff; box-shadow:0 1px 4px rgba(0,0,0,.18); transition:.2s; }
.power-toggle.on, .switch.on { background:var(--green); justify-content:flex-end; }
.domain-row { margin-top:16px; padding:12px; border-radius:var(--radius); background:#f7f9f6; border:1px solid var(--line); }
.domain-row > div:nth-child(2) { flex:1; display:flex; flex-direction:column; gap:3px; }
.domain-row strong { font-size:11px; }
.domain-icon { width:30px; height:30px; border-radius:7px; display:grid !important; place-items:center; flex:none !important; color:#fff; background:#d84f4f; font-weight:800; font-size:10px; }
.status-pill { font-size:9px; font-weight:750; color:#0e703b; background:rgba(30,168,91,.10); padding:6px 8px; border-radius:999px; }
.popup-list { padding: 12px 0 6px; display:flex; flex-direction:column; }
.popup-list > div { display:grid; grid-template-columns:18px 1fr auto; align-items:center; gap:5px; padding:9px 2px; border-bottom:1px solid var(--line); }
.feature-dot { width:7px; height:7px; border-radius:50%; background:var(--green); }
.popup-list b { font-size:10px; font-weight:700; }
.popup-list em { font-style:normal; font-size:9px; color:#227344; font-weight:800; }
.popup-bottom { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding-top:10px; }
.popup-bottom button { border:0; border-radius:var(--radius); padding:9px; font-size:10px; font-weight:750; background:#111812; color:#fff; }
.popup-bottom .ghost-button { background:#eef2ec; color:#536158; }
.float-card { animation: panelFloat 8s ease-in-out infinite; }
.floating-chip { position:absolute; z-index:5; border:1px solid var(--line); background:#fff; border-radius:var(--radius); padding:9px 11px; font-size:10px; font-weight:750; box-shadow:0 12px 28px rgba(16,20,16,.10); display:flex; align-items:center; gap:7px; }
.floating-chip span { width:17px; height:17px; display:grid; place-items:center; border-radius:50%; background:rgba(30,168,91,.12); color:var(--green-dark); }
.chip-a { left:18px; bottom:44px; }
.chip-b { right:56px; bottom:-14px; }

.trusted-strip { margin-top: 74px; display:flex; align-items:center; gap:22px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); height:64px; overflow:hidden; color:#707a72; }
.trusted-strip > span { flex:none; padding-left:2px; font-size:10px; letter-spacing:.09em; text-transform:uppercase; font-weight:850; }
.marquee { flex:1; overflow:hidden; mask-image:linear-gradient(90deg, transparent, black 5%, black 95%, transparent); }
.marquee-track { width:max-content; display:flex; align-items:center; gap:20px; animation:marquee 34s linear infinite; }
.marquee-track b { font-size:12px; color:#5f6b62; white-space:nowrap; font-weight:700; }
.marquee-track i { font-style:normal; color:#b1bab3; }

.section-heading { max-width:720px; margin-bottom:42px; }
.section-heading.centered { text-align:center; margin-left:auto; margin-right:auto; }
.section-heading h2, .privacy-copy h2, .install-card h2 { margin:18px 0 16px; font-size:clamp(34px, 4.6vw, 58px); line-height:1.04; letter-spacing:-.035em; }
.section-heading p, .privacy-copy > p, .install-card p { color:var(--muted); font-size:16px; line-height:1.7; margin:0; }

.bento-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:16px; }
.feature-card {
  --spot-x:50%;
  --spot-y:50%;
  position:relative;
  min-height:310px;
  border-radius:var(--radius);
  border:1px solid var(--line);
  background:#fff;
  padding:28px;
  overflow:hidden;
  box-shadow:0 10px 34px rgba(16,20,16,.04);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.feature-card:hover { transform:translateY(-2px); box-shadow:0 16px 42px rgba(16,20,16,.07); border-color:var(--line-strong); }
.feature-large { display:grid; grid-template-columns:.78fr 1.22fr; gap:24px; }
.feature-wide { grid-column:1/-1; display:grid; grid-template-columns:.72fr 1.28fr; min-height:340px; gap:28px; align-items:center; }
.feature-copy { position:relative; z-index:2; }
.icon-box { width:40px; height:40px; display:grid; place-items:center; border-radius:var(--radius); background:#edf5ee; color:var(--green-dark); }
.icon-box svg { width:21px; height:21px; }
.feature-card h3 { margin:22px 0 10px; font-size:21px; letter-spacing:-.02em; }
.feature-card p { margin:0; color:var(--muted); line-height:1.65; font-size:14px; max-width:440px; }
.layers-visual { position:relative; min-height:260px; }
.layer-card { position:absolute; left:0; right:0; margin:auto; height:70px; display:grid; grid-template-columns:38px 1fr auto; align-items:center; gap:12px; padding:0 16px; background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:0 12px 28px rgba(16,20,16,.06); font-size:12px; font-weight:750; }
.layer-card span { width:28px; height:28px; border-radius:7px; display:grid; place-items:center; background:#f0f3ee; color:#737e76; font-size:10px; }
.layer-card b { color:#168c48; font-size:10px; }
.l1 { top:20px; transform:translateX(-8px); }
.l2 { top:96px; z-index:2; transform:translateX(10px); }
.l3 { top:172px; transform:translateX(-2px); }
.mini-control { position:absolute; left:28px; right:28px; bottom:28px; display:flex; justify-content:space-between; align-items:center; padding:15px 16px; border-radius:var(--radius); background:#f6f8f5; color:#536159; font-size:12px; font-weight:750; border:1px solid var(--line); }
.dark-card { background:#111812; color:#fff; border-color:#111812; box-shadow:0 16px 42px rgba(16,24,19,.13); }
.dark-card p { color:#a8b2aa; }
.dark-icon { color:#91e5ad; background:rgba(82,217,131,.10); }
.mode-stack { position:absolute; left:28px; right:28px; bottom:27px; display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.mode-stack span { padding:12px 7px; border:1px solid rgba(255,255,255,.10); border-radius:var(--radius); text-align:center; color:#87938b; background:rgba(255,255,255,.03); font-size:10px; font-weight:750; }
.mode-stack .selected { color:#e1ffe9; border-color:rgba(117,237,161,.24); background:rgba(87,218,135,.10); }
.chart-visual { position:relative; height:260px; border-radius:var(--radius); background:#f7f9f6; border:1px solid var(--line); overflow:hidden; }
.chart-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(21,53,31,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(21,53,31,.055) 1px,transparent 1px); background-size:56px 46px; }
.chart-visual svg { position:absolute; left:0; right:0; bottom:0; width:100%; height:85%; }
.chart-line { fill:none; stroke:#1ea85b; stroke-width:3; vector-effect:non-scaling-stroke; }
.chart-area { fill:#1ea85b; opacity:.08; }
.chart-label { position:absolute; top:18px; left:20px; display:flex; flex-direction:column; gap:4px; }
.chart-label strong { font-size:13px; }
.chart-label span { font-size:10px; color:#768078; }

.privacy-section { background:#eef2ec; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.split-grid { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }
.privacy-window { border-radius:12px; background:#fff; border:1px solid var(--line-strong); box-shadow:var(--shadow); overflow:hidden; }
.privacy-header { height:50px; display:flex; gap:6px; align-items:center; padding:0 16px; background:#f9fbf8; border-bottom:1px solid var(--line); }
.privacy-header span { width:9px; height:9px; border-radius:50%; background:#cfd7cf; }
.privacy-center { padding:46px; text-align:center; }
.lock-ring { width:74px; height:74px; display:grid; place-items:center; margin:0 auto 24px; border-radius:50%; color:var(--green-dark); background:rgba(30,168,91,.09); }
.lock-ring svg { width:30px; }
.privacy-center h3 { margin:0 0 11px; font-size:24px; letter-spacing:-.02em; }
.privacy-center > p { margin:0 auto; color:var(--muted); font-size:13px; line-height:1.6; max-width:350px; }
.privacy-rows { margin-top:32px; display:flex; flex-direction:column; text-align:left; border-top:1px solid var(--line); }
.privacy-rows div { display:flex; justify-content:space-between; gap:15px; padding:14px 3px; border-bottom:1px solid var(--line); font-size:12px; }
.privacy-rows span { color:#667169; }
.privacy-rows b { color:#8c948e; }
.privacy-rows .positive { color:#198b49; }
.privacy-copy h2 { max-width:560px; }
.bullet-list { margin-top:34px; display:flex; flex-direction:column; gap:0; }
.bullet-list > div { display:grid; grid-template-columns:42px 1fr; gap:15px; padding:17px 0; border-top:1px solid var(--line-strong); }
.bullet-list > div:last-child { border-bottom:1px solid var(--line-strong); }
.bullet-list span { width:32px; height:32px; display:grid; place-items:center; border-radius:var(--radius); background:#fff; color:#6f7a72; font-size:10px; font-weight:850; }
.bullet-list p { margin:2px 0 0; font-size:13px; line-height:1.6; color:var(--muted); }
.bullet-list strong { color:var(--text); }

.control-demo { border:1px solid var(--line-strong); border-radius:12px; background:#fff; box-shadow:var(--shadow); display:grid; grid-template-columns:230px 1fr; overflow:hidden; min-height:500px; }
.control-sidebar { background:#f7f9f6; border-right:1px solid var(--line); padding:24px 18px; display:flex; flex-direction:column; gap:7px; }
.sidebar-brand { display:flex; align-items:center; gap:9px; margin-bottom:24px; padding:0 8px; font-size:14px; }
.sidebar-brand .mini-shield { width:28px; }
.control-sidebar button { border:0; background:transparent; text-align:left; border-radius:var(--radius); padding:11px 12px; font-size:12px; color:#67736b; font-weight:700; cursor:default; }
.control-sidebar button.active { background:#fff; color:#16221a; box-shadow:0 4px 14px rgba(16,20,16,.05); }
.control-main { padding:34px; }
.control-title { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); padding-bottom:22px; }
.control-title span { font-size:11px; color:#7b857e; text-transform:uppercase; letter-spacing:.09em; font-weight:850; }
.control-title h3 { margin:6px 0 0; font-size:28px; letter-spacing:-.03em; }
.switch.large { transform:scale(1.18); }
.settings-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:22px; }
.setting-card { min-height:92px; border:1px solid var(--line); border-radius:var(--radius); padding:18px; display:flex; align-items:center; justify-content:space-between; gap:14px; }
.setting-card > span { display:flex; flex-direction:column; gap:5px; }
.setting-card b { font-size:13px; }
.setting-card small { font-size:11px; color:#7d877f; }
.site-rule { margin-top:22px; border:1px solid var(--line); border-radius:var(--radius); padding:16px; display:flex; align-items:center; justify-content:space-between; gap:18px; }
.site-rule > div:first-child { display:flex; align-items:center; gap:12px; }
.site-avatar { width:34px; height:34px; display:grid; place-items:center; border-radius:var(--radius); background:#edf4ef; color:#59655d; font-size:11px; font-weight:850; }
.site-rule span { display:flex; flex-direction:column; gap:4px; }
.site-rule b { font-size:12px; }
.site-rule small { font-size:10px; color:#7f8982; }
.rule-actions { display:flex; gap:7px; flex-wrap:wrap; justify-content:flex-end; }
.rule-actions button { border:1px solid var(--line); background:#fafcfb; border-radius:var(--radius); padding:8px 10px; font-size:10px; font-weight:750; color:#4f5d54; }

.install-section { padding-top:68px; }
.install-card { position:relative; overflow:hidden; text-align:center; padding:76px 30px; border-radius:12px; color:#fff; background:#111812; box-shadow:0 24px 70px rgba(16,24,19,.18); }
.install-glow { display:none; }
.install-logo { position:relative; width:70px; color:#44d87d; margin:0 auto 22px; }
.install-logo svg { width:100%; }
.light-kicker { color:#91eeb1; position:relative; }
.install-card h2 { position:relative; margin-left:auto; margin-right:auto; max-width:760px; }
.install-card p { position:relative; color:#b6c0b8; max-width:600px; margin:0 auto 28px; }
.button-white { position:relative; background:#fff; color:#0d1a11; padding:14px 18px; }

.seo-hub-section { padding-top:70px; }
.seo-link-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.seo-link-grid a { min-height:120px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; padding:17px; box-shadow:0 8px 26px rgba(16,20,16,.04); transition:transform .18s ease, border-color .18s ease; }
.seo-link-grid a:hover { transform:translateY(-2px); border-color:var(--line-strong); }
.seo-link-grid span { display:block; font-size:14px; font-weight:800; letter-spacing:-.01em; }
.seo-link-grid small { display:block; margin-top:10px; color:var(--muted); font-size:12px; line-height:1.5; }

.faq-grid { display:grid; grid-template-columns:.7fr 1.3fr; gap:64px; align-items:start; }
.faq-section .section-heading { position:sticky; top:116px; }
.accordion { border-top:1px solid var(--line); }
details { border-bottom:1px solid var(--line); }
summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:20px; padding:23px 0; font-size:15px; font-weight:750; }
summary::-webkit-details-marker { display:none; }
summary span { font-size:20px; color:#7f8b82; transition:transform .2s ease; }
details[open] summary span { transform:rotate(45deg); }
details p { margin:-4px 40px 23px 0; color:var(--muted); font-size:14px; line-height:1.7; max-width:670px; }

.policy-hero { padding:86px 0 44px; }
.policy-shell { max-width:860px; }
.policy-back { margin-bottom:32px; }
.policy-hero h1 { margin:18px 0 14px; font-size:48px; line-height:1.12; letter-spacing:0; overflow-wrap:anywhere; }
.policy-updated { margin:0 0 24px; color:#727c75; font-size:13px; font-weight:750; }
.policy-intro { margin:0; max-width:760px; color:var(--muted); font-size:17px; line-height:1.7; }
.policy-section { padding:0 0 88px; }
.policy-card { border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:0 12px 40px rgba(16,20,16,.05); padding:40px; }
.policy-card h2 { margin:34px 0 10px; font-size:22px; letter-spacing:-.02em; }
.policy-card h2:first-child { margin-top:0; }
.policy-card p { margin:0; color:var(--muted); font-size:14px; line-height:1.8; }

footer { padding:24px 0 48px; }
.footer-wrap { display:grid; grid-template-columns:1fr auto; gap:30px; padding-top:30px; border-top:1px solid var(--line); align-items:start; }
.footer-brand p { margin:9px 0 0 42px; font-size:12px; color:#737d76; }
.footer-links { display:flex; gap:20px; flex-wrap:wrap; justify-content:flex-end; max-width:760px; }
.footer-links a { color:#59655d; font-size:12px; font-weight:700; }
.copyright { grid-column:1/-1; margin:14px 0 0; color:#858d86; font-size:11px; }

.reveal { opacity:1; transform:none; }
.reveal.visible { opacity:1; transform:translateY(0); }
.delay-1 { transition-delay:.05s; }
.delay-2 { transition-delay:.1s; }

@keyframes panelFloat { 0%,100%{transform:translateZ(36px) translateY(0)} 50%{transform:translateZ(36px) translateY(-5px)} }
@keyframes marquee { to{transform:translateX(-50%)} }

@media (max-width: 1020px) {
  .hero { padding-top:54px; }
  .hero-grid { grid-template-columns:1fr; gap:52px; }
  .hero-copy { text-align:center; max-width:760px; margin:auto; }
  .hero-lede { margin:auto; }
  .hero-actions, .hero-proof { justify-content:center; }
  .hero-visual { width:min(760px, 100%); margin:auto; }
  .popup-card { right:20px; }
  .split-grid { gap:46px; }
  .feature-large { grid-template-columns:1fr; }
  .layers-visual { min-height:244px; }
}

@media (max-width: 820px) {
  .section-pad { padding:78px 0; }
  .desktop-nav { display:none; }
  .split-grid, .faq-grid { grid-template-columns:1fr; }
  .privacy-copy { order:-1; }
  .faq-section .section-heading { position:static; }
  .bento-grid { grid-template-columns:1fr; }
  .seo-link-grid { grid-template-columns:1fr 1fr; }
  .feature-wide { grid-column:auto; grid-template-columns:1fr; }
  .control-demo { grid-template-columns:1fr; }
  .control-sidebar { border-right:0; border-bottom:1px solid var(--line); flex-direction:row; overflow:auto; align-items:center; }
  .sidebar-brand { margin:0 14px 0 0; flex:none; }
  .control-sidebar button { flex:none; }
  .settings-grid { grid-template-columns:1fr; }
  .footer-wrap { grid-template-columns:1fr; }
  .footer-links { justify-content:flex-start; }
}

@media (max-width: 640px) {
  .shell { width:min(100% - 28px, 1120px); }
  .nav-wrap { height:66px; }
  .site-header .button-small { padding:10px 12px; }
  .site-header .button-small svg { display:none; }
  .hero { padding-top:44px; }
  .hero h1 { font-size:44px; }
  .hero-lede { font-size:16px; }
  .hero-actions { flex-direction:column; }
  .button-primary { width:100%; }
  .hero-proof { gap:8px; }
  .browser-card { min-height:430px; border-radius:10px; }
  .browser-topbar { grid-template-columns:1fr 2.6fr .4fr; padding:0 12px; border-radius:10px 10px 0 0; }
  .browser-body { grid-template-columns:58px 1fr; min-height:374px; }
  .page-sidebar { padding:18px 10px; gap:16px; }
  .page-sidebar span:not(.side-logo) { width:25px; }
  .video-area { padding:16px 13px; }
  .video-canvas { height:198px; }
  .popup-card { width:252px; right:7px; top:90px; padding:14px; }
  .floating-chip { display:none; }
  .trusted-strip { margin-top:58px; }
  .trusted-strip > span { display:none; }
  .section-heading h2, .privacy-copy h2, .install-card h2 { font-size:36px; }
  .feature-card { min-height:290px; padding:23px; }
  .feature-large, .feature-wide { display:block; }
  .layers-visual { margin-top:20px; }
  .chart-visual { margin-top:28px; }
  .privacy-center { padding:36px 22px; }
  .control-main { padding:23px 17px; }
  .control-title h3 { font-size:24px; }
  .site-rule { align-items:flex-start; flex-direction:column; }
  .rule-actions { justify-content:flex-start; }
  .install-card { padding:64px 22px; }
  .policy-hero { padding:66px 0 34px; }
  .policy-hero h1 { font-size:40px; }
  .policy-card { padding:28px 22px; }
  .footer-links { display:grid; grid-template-columns:1fr 1fr; }
  .seo-link-grid { grid-template-columns:1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; animation:none !important; transition:none !important; }
  .reveal { opacity:1; transform:none; }
}

/* Reading guides remain usable without scripts or animation support. */
.mobile-menu { display:none; position:relative; margin-left:auto; border:0; }
.mobile-menu summary { display:grid; place-items:center; justify-content:center; width:42px; height:42px; padding:0; gap:0; cursor:pointer; list-style:none; border:1px solid var(--line); border-radius:6px; font-size:24px; background:white; }
.mobile-menu summary span, .mobile-menu[open] summary span { transform:none; line-height:1; color:var(--text); }
.mobile-menu summary::-webkit-details-marker { display:none; }
.mobile-menu nav { position:fixed; top:76px; left:14px; right:14px; width:auto; max-height:calc(100dvh - 90px); overflow:auto; padding:8px; background:white; border:1px solid var(--line); border-radius:6px; box-shadow:0 10px 25px #0002; z-index:30; }
.mobile-menu nav a { display:block; padding:12px; font-size:15px; color:var(--text); border-radius:4px; }
.mobile-menu nav a:hover { background:#edf3f0; }
.mobile-menu summary:focus-visible, a:focus-visible { outline:2px solid #2677b6; outline-offset:4px; }
.policy-card { border:0; border-radius:0; padding:0; box-shadow:none; background:transparent; }
.policy-card p, .reading-guide p { font-size:16px; line-height:1.85; color:var(--muted); }
.policy-card h2, .reading-guide h2 { letter-spacing:0; line-height:1.35; overflow-wrap:anywhere; }
.policy-card, .policy-intro, .guide-toc { overflow-wrap:anywhere; }
.policy-back { display:flex; width:fit-content; }
.guide-expansion > h2:first-child { margin-top:38px; }
.policy-card h2 { margin-top:38px; scroll-margin-top:120px; }
.policy-card h3, .reading-guide h3 { font-size:18px; letter-spacing:0; line-height:1.5; margin:26px 0 8px; }
.policy-card a, .reading-guide p a { color:#146b49; text-decoration:underline; text-underline-offset:3px; }
.guide-toc { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:22px 0; margin-bottom:30px; }
.guide-toc strong { font-size:14px; }
.guide-toc ul { columns:2; padding-left:20px; margin:12px 0 0; }
.guide-toc li { break-inside:avoid; padding:5px 16px 5px 0; font-size:14px; line-height:1.6; }
.guide-source { padding-top:24px; font-size:14px !important; }
.reading-guide { border-top:1px solid var(--line); }
.reading-guide h2 { font-size:32px; margin:16px 0; }
@media (max-width:1100px) {
  .desktop-nav { display:none; }
  .mobile-menu { display:block; }
  .nav-wrap { gap:12px; }
}
@media (max-width:640px) {
  .policy-hero h1 { font-size:34px; }
  .guide-toc ul { columns:1; }
  .reading-guide h2 { font-size:28px; }
}