:root {
  --ink: #102820;
  --ink-2: #2f473f;
  --paper: #f6f7f2;
  --paper-2: #eef1e9;
  --white: #ffffff;
  --accent: #d8f06b;
  --accent-2: #b5d83f;
  --line: rgba(16,40,32,.12);
  --soft: #dce8e0;
  --shadow: 0 22px 60px rgba(16,40,32,.11);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; font-family:"DM Sans",system-ui,-apple-system,sans-serif; color:var(--ink); background:var(--paper); line-height:1.55; }
a { color:inherit; text-decoration:none; }
.wrap { width:min(1180px, calc(100% - 44px)); margin:0 auto; }
.site-header { position:sticky; top:0; z-index:20; backdrop-filter: blur(14px); background:rgba(246,247,242,.88); border-bottom:1px solid rgba(16,40,32,.08); }
.nav-wrap { height:76px; display:flex; align-items:center; justify-content:space-between; }
.brand { display:inline-flex; align-items:center; gap:11px; font-family:"Manrope",sans-serif; font-weight:800; letter-spacing:.13em; font-size:14px; }
.brand-mark { width:28px; height:28px; border:1.5px solid var(--ink); border-radius:50%; display:grid; place-items:center; position:relative; }
.brand-mark:before { content:""; width:8px; height:8px; background:var(--accent); border-radius:50%; position:absolute; top:4px; right:4px; }
.brand-mark span { width:11px; height:1.5px; background:var(--ink); transform:rotate(-35deg); border-radius:2px; }
.nav { display:flex; align-items:center; gap:30px; font-size:14px; color:var(--ink-2); }
.nav a:hover { color:var(--ink); }
.nav-cta { border:1px solid var(--ink); border-radius:999px; padding:9px 15px; font-weight:600; }
.hero { padding:84px 0 90px; overflow:hidden; }
.hero-grid { display:grid; grid-template-columns:1.03fr .97fr; gap:64px; align-items:center; }
.eyebrow,.micro { font-family:"Manrope",sans-serif; font-size:12px; letter-spacing:.18em; font-weight:800; color:#597067; }
.hero h1 { font-family:"Manrope",sans-serif; font-weight:800; font-size:clamp(54px,7vw,92px); line-height:.96; letter-spacing:-.055em; margin:20px 0 28px; }
.hero h1 span { color:#60756c; }
.hero-lead { max-width:640px; font-size:20px; color:var(--ink-2); line-height:1.55; margin:0; }
.hero-actions { display:flex; gap:12px; margin-top:34px; flex-wrap:wrap; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 20px; border-radius:999px; font-weight:700; font-size:14px; transition:.2s ease; }
.button.primary { background:var(--ink); color:white; }
.button.primary:hover { transform:translateY(-1px); }
.button.ghost { border:1px solid var(--line); background:rgba(255,255,255,.55); }
.trust-row { display:flex; gap:26px; color:#6c8179; margin-top:31px; font-size:13px; }
.trust-row span:before { content:"•"; color:#8da535; margin-right:8px; }
.hero-card { position:relative; }
.hero-card:before { content:""; position:absolute; inset:8% -11% -12% 3%; border-radius:50%; background:radial-gradient(circle at 50% 50%, rgba(216,240,107,.45), rgba(216,240,107,0) 68%); filter:blur(16px); }
.phone-shell { position:relative; z-index:2; background:#fbfcf8; border:1px solid rgba(16,40,32,.12); border-radius:34px; padding:28px; box-shadow:var(--shadow); max-width:470px; margin-left:auto; }
.phone-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:30px; }
.mini-brand { font:800 10px/1 "Manrope"; letter-spacing:.15em; }
.status-pill { background:#e9efd8; border-radius:999px; padding:6px 10px; font-size:11px; font-weight:700; }
.phone-greeting .micro { font-size:10px; }
.phone-greeting h2 { font:800 27px/1.1 "Manrope"; letter-spacing:-.03em; margin:9px 0 10px; }
.phone-greeting p { margin:0 0 22px; color:#60756c; font-size:13px; }
.action-card { display:grid; grid-template-columns:38px 1fr auto; gap:12px; align-items:start; padding:16px 0; border-top:1px solid var(--line); }
.action-card.featured { padding:17px 15px; background:#eff4dd; border:0; border-radius:18px; margin:0 0 4px; }
.action-index { font:800 11px/1 "Manrope"; color:#8a9a91; padding-top:4px; }
.action-title { font:700 14px/1.25 "Manrope"; }
.action-copy { color:#6b7b74; font-size:12px; margin-top:5px; }
.confidence { font-size:10px; font-weight:800; color:#60756c; text-transform:uppercase; letter-spacing:.08em; }
.phone-footer { margin-top:17px; color:#7a8b83; font-size:11px; text-align:center; }
.problem-strip { background:var(--ink); color:white; padding:62px 0; }
.problem-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:end; }
.problem-grid .micro { color:#b9c8c1; }
.problem-grid h2 { font:700 clamp(34px,4vw,50px)/1.08 "Manrope"; letter-spacing:-.035em; margin:10px 0 0; }
.problem-grid p { margin:0; color:#cad7d1; font-size:18px; }
.problem-grid strong { color:white; }
.section { padding:100px 0; }
.section.alt { background:#eef1e9; }
.section-head { display:grid; grid-template-columns:1.2fr .8fr; gap:60px; align-items:end; margin-bottom:52px; }
.section-head h2,.data-copy h2,.principles h2,.beta h2 { font:800 clamp(38px,5vw,61px)/1.03 "Manrope"; letter-spacing:-.045em; margin:12px 0 0; }
.section-head p { margin:0; font-size:18px; color:var(--ink-2); }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.step-card { background:white; border:1px solid var(--line); border-radius:24px; padding:30px; min-height:280px; }
.step-number { width:44px; height:44px; border-radius:50%; display:grid; place-items:center; background:var(--paper-2); font:800 12px "Manrope"; }
.step-card h3 { font:700 22px/1.2 "Manrope"; margin:60px 0 12px; letter-spacing:-.02em; }
.step-card p { color:#60756c; margin:0; }
.data-grid { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }
.data-copy > p { color:var(--ink-2); font-size:18px; max-width:580px; }
.data-notes { display:grid; gap:18px; margin-top:34px; }
.data-notes > div { display:grid; grid-template-columns:38px 1fr; gap:12px; border-top:1px solid var(--line); padding-top:15px; }
.data-notes span { font:800 11px "Manrope"; color:#87978f; }
.data-notes p { margin:0; color:#60756c; }
.data-notes strong { color:var(--ink); }
.data-visual { min-height:520px; position:relative; border-radius:50%; }
.orbit { position:absolute; border:1px solid rgba(16,40,32,.12); border-radius:50%; left:50%; top:50%; transform:translate(-50%,-50%); }
.orbit-a { width:390px; height:390px; }
.orbit-b { width:270px; height:270px; }
.data-node { position:absolute; background:#fafbf7; border:1px solid var(--line); box-shadow:0 10px 30px rgba(16,40,32,.06); border-radius:18px; padding:13px 15px; min-width:116px; }
.data-node b { display:block; font:700 13px "Manrope"; }
.data-node small { color:#7b8a83; }
.data-node.center { width:150px; height:150px; border-radius:50%; left:50%; top:50%; transform:translate(-50%,-50%); display:grid; place-items:center; text-align:center; background:var(--ink); color:white; }
.data-node.center span { width:48px; height:48px; border-radius:50%; background:var(--accent); color:var(--ink); display:grid; place-items:center; font:800 20px "Manrope"; }
.data-node.center small { color:#cbd6d1; margin-top:-22px; }
.n1{left:42%;top:4%;}.n2{right:3%;top:27%;}.n3{right:7%;bottom:14%;}.n4{left:8%;bottom:10%;}.n5{left:0;top:28%;}
.section-head.compact { grid-template-columns:1fr; margin-bottom:38px; }
.principle-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.principle-grid article { padding:26px; border-top:1px solid var(--line); }
.icon-dot { width:12px; height:12px; border-radius:50%; background:var(--accent-2); }
.principle-grid h3 { font:700 18px "Manrope"; margin:18px 0 10px; }
.principle-grid p { margin:0; color:#60756c; font-size:14px; }
.beta { background:#14352b; color:white; padding:86px 0; }
.beta-inner { display:grid; grid-template-columns:1.1fr .9fr; gap:72px; align-items:center; }
.eyebrow.light { color:#b9c8c1; }
.beta p { max-width:670px; color:#c8d5cf; font-size:18px; }
.beta-card { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:24px; padding:28px; }
.beta-label { font:800 11px "Manrope"; letter-spacing:.14em; color:#b9c8c1; }
.beta-card ul { margin:18px 0 0; padding:0; list-style:none; display:grid; gap:12px; }
.beta-card li { padding:14px 0; border-top:1px solid rgba(255,255,255,.12); }
footer { background:#0f2b23; color:#cbd6d1; padding:34px 0; border-top:1px solid rgba(255,255,255,.08); }
.footer-wrap { display:flex; justify-content:space-between; gap:30px; align-items:flex-end; }
.footer-wordmark { color:white; }
.footer-wordmark .brand-mark { border-color:white; }
.footer-wordmark .brand-mark span { background:white; }
.footer-brand p { margin:10px 0 0; font-size:13px; }
.footer-links { display:flex; gap:24px; font-size:13px; flex-wrap:wrap; justify-content:flex-end; }
.legal { padding:80px 0 120px; }
.legal .wrap { max-width:850px; }
.legal h1 { font:800 clamp(44px,6vw,70px)/1 "Manrope"; letter-spacing:-.04em; }
.legal h2 { font:700 24px "Manrope"; margin-top:38px; }
.legal p,.legal li { color:#4f675e; }
.legal-note { background:#edf1e6; border:1px solid var(--line); border-radius:18px; padding:18px 20px; margin:28px 0; }
@media (max-width: 900px) {
  .nav a:not(.nav-cta){display:none;}
  .hero { padding-top:54px; }
  .hero-grid,.problem-grid,.section-head,.data-grid,.beta-inner { grid-template-columns:1fr; gap:42px; }
  .phone-shell { margin:0 auto; }
  .steps { grid-template-columns:1fr; }
  .step-card { min-height:auto; }
  .step-card h3 { margin-top:35px; }
  .principle-grid { grid-template-columns:1fr 1fr; }
  .data-visual { min-height:460px; }
  .footer-wrap { align-items:flex-start; flex-direction:column; }
  .footer-links { justify-content:flex-start; }
}
@media (max-width: 560px) {
  .wrap { width:min(100% - 28px, 1180px); }
  .nav-wrap { height:66px; }
  .hero h1 { font-size:54px; }
  .hero-lead { font-size:18px; }
  .trust-row { gap:10px 18px; flex-wrap:wrap; }
  .phone-shell { padding:20px; border-radius:26px; }
  .section { padding:74px 0; }
  .principle-grid { grid-template-columns:1fr; }
  .data-visual { transform:scale(.88); margin-inline:-28px; }
  .problem-grid { gap:28px; }
}
