:root {
  --ink:#16242b; --ink-2:#26383f; --green:#547a70; --green-dark:#35584f;
  --mint:#e8f0ed; --cream:#f7f3eb; --gold:#c89b58; --paper:#fffefb;
  --muted:#68757a; --line:#dbe2df; --shadow:0 22px 64px rgba(22,36,43,.1);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.55; -webkit-font-smoothing:antialiased; }
body.menu-open { overflow:hidden; }
a { color:inherit; }
button,input,textarea,select { font:inherit; }
.container { width:min(1120px,calc(100% - 40px)); margin:0 auto; }
.site-header { position:sticky; top:0; z-index:40; border-bottom:1px solid rgba(219,226,223,.8); background:rgba(255,254,251,.9); backdrop-filter:blur(16px); }
.nav { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:22px; }
.logo { display:inline-flex; align-items:center; gap:12px; text-decoration:none; font-weight:850; letter-spacing:-.025em; }
.logo-mark { width:42px; height:42px; display:block; flex:0 0 auto; filter:drop-shadow(0 5px 12px rgba(22,36,43,.16)); transition:transform .2s ease,filter .2s ease; }
.logo:hover .logo-mark { transform:translateY(-1px) rotate(-2deg); filter:drop-shadow(0 7px 16px rgba(22,36,43,.22)); }
.nav-links { display:flex; align-items:center; gap:26px; }
.nav-links a { text-decoration:none; font-size:.9rem; font-weight:750; }
.nav-toggle { display:none; width:44px; height:44px; border:1px solid var(--line); border-radius:12px; background:white; }
.button { min-height:49px; display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:0 20px; border:1px solid var(--ink); border-radius:13px; color:white; background:var(--ink); text-decoration:none; font-weight:850; cursor:pointer; transition:transform .2s ease,background .2s ease; }
.button:hover { transform:translateY(-2px); background:var(--green-dark); }
.button-gold { color:var(--ink); border-color:var(--gold); background:var(--gold); }
.button-light { color:var(--ink); border-color:var(--line); background:white; }
.button-small { min-height:42px; padding:0 16px; font-size:.86rem; }
.eyebrow { margin:0 0 14px; color:var(--green-dark); font-size:.75rem; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { line-height:1.08; letter-spacing:-.035em; }
h1 { max-width:760px; margin-bottom:22px; font-size:clamp(3rem,7vw,5.7rem); }
h2 { margin-bottom:18px; font-size:clamp(2.15rem,4.4vw,3.8rem); }
h3 { margin-bottom:9px; font-size:1.3rem; }
.lead { max-width:650px; color:var(--muted); font-size:clamp(1.05rem,2vw,1.25rem); }
.hero { padding:84px 0 74px; overflow:hidden; background:radial-gradient(circle at 90% 15%,rgba(200,155,88,.18),transparent 27%),radial-gradient(circle at 7% 85%,rgba(84,122,112,.14),transparent 28%),var(--paper); }
.hero-grid { display:grid; grid-template-columns:1.12fr .78fr; gap:60px; align-items:center; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin:29px 0 22px; }
.local-note { display:flex; align-items:center; gap:9px; color:var(--muted); font-size:.88rem; }
.local-note::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 0 5px var(--mint); }
.hero-panel { padding:29px; border-radius:26px; color:white; background:var(--ink); box-shadow:var(--shadow); }
.panel-label { display:block; margin-bottom:28px; color:#a9beb8; font-size:.7rem; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
.metric { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; padding:18px 0; border-bottom:1px solid rgba(255,255,255,.13); }
.metric:last-child { border-bottom:0; }
.metric strong { font-size:2rem; letter-spacing:-.05em; }
.metric span { max-width:155px; color:#bdcbc7; text-align:right; font-size:.8rem; }
.browser-mock { padding:12px; border-radius:22px; background:var(--ink); box-shadow:var(--shadow); }
.browser-top { display:flex; gap:5px; padding:8px 7px 13px; }
.browser-top i { width:8px; height:8px; border-radius:50%; background:#718078; }
.browser-screen { min-height:325px; padding:24px; border-radius:14px; background:var(--cream); }
.browser-nav { width:68%; height:9px; margin-bottom:45px; border-radius:99px; background:#cbd6d2; }
.browser-title { width:90%; height:44px; margin-bottom:13px; border-radius:9px; background:var(--green); }
.browser-copy { width:75%; height:11px; margin-bottom:8px; border-radius:99px; background:#d8dfdc; }
.browser-button { width:42%; height:35px; margin-top:25px; border-radius:9px; background:var(--gold); }
.section { padding:96px 0; }
.section-soft { background:var(--cream); }
.section-head { max-width:740px; margin-bottom:40px; }
.package-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.package-grid.three { grid-template-columns:repeat(3,1fr); }
.package { padding:32px; border:1px solid var(--line); border-radius:24px; background:white; }
.package.featured { color:white; border-color:var(--ink); background:var(--ink); }
.tag { display:inline-block; margin-bottom:25px; padding:7px 10px; border-radius:999px; color:var(--green-dark); background:var(--mint); font-size:.66rem; font-weight:900; letter-spacing:.09em; text-transform:uppercase; }
.featured .tag { color:var(--ink); background:var(--gold); }
.price { display:flex; align-items:baseline; gap:6px; margin:14px 0 24px; }
.price strong { font-size:2.8rem; line-height:1; letter-spacing:-.06em; }
.price span { color:var(--muted); }
.featured .price span { color:#aebdb8; }
.checklist { margin:0 0 27px; padding:0; list-style:none; }
.checklist li { position:relative; padding:9px 0 9px 27px; border-bottom:1px solid var(--line); font-size:.91rem; }
.featured .checklist li { border-color:rgba(255,255,255,.12); }
.checklist li::before { content:"✓"; position:absolute; left:0; color:var(--green); font-weight:900; }
.featured .checklist li::before { color:var(--gold); }
.package .button { width:100%; }
.featured .button { color:var(--ink); border-color:var(--gold); background:var(--gold); }
.notice { margin-top:20px; padding:20px 22px; border-left:4px solid var(--gold); border-radius:0 15px 15px 0; background:var(--mint); }
.notice strong { display:block; margin-bottom:3px; }
.notice span { color:var(--muted); font-size:.88rem; }
.custom-grid { display:grid; grid-template-columns:.86fr 1.14fr; gap:60px; align-items:start; }
.rate-basis { margin:30px 0 0; padding:0; list-style:none; border-top:1px solid #cdd7d3; }
.rate-basis li { display:flex; justify-content:space-between; gap:18px; padding:13px 0; border-bottom:1px solid #cdd7d3; color:var(--muted); font-size:.88rem; }
.rate-basis strong { color:var(--ink); }
.calculator { padding:30px; border:1px solid var(--line); border-radius:24px; background:white; box-shadow:var(--shadow); }
.calculator fieldset { margin:0 0 25px; padding:0; border:0; }
.calculator legend { margin-bottom:11px; font-size:.79rem; font-weight:900; }
.segmented { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.segment,.platform-option { position:relative; cursor:pointer; }
.segment input,.platform-option input { position:absolute; opacity:0; pointer-events:none; }
.segment span { min-height:46px; display:grid; place-items:center; border:1px solid var(--line); border-radius:11px; background:#fbfcfb; font-weight:850; }
.segment input:focus-visible + span,.platform-option input:focus-visible + span { outline:3px solid rgba(84,122,112,.24); outline-offset:2px; }
.segment input:checked + span { color:white; border-color:var(--green-dark); background:var(--green-dark); }
.platform-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
.platform-option span { min-height:54px; display:flex; align-items:center; justify-content:center; padding:8px; border:1px solid var(--line); border-radius:11px; background:#fbfcfb; text-align:center; font-size:.82rem; font-weight:800; }
.platform-option input:checked + span { color:var(--green-dark); border-color:var(--green); background:var(--mint); box-shadow:inset 0 0 0 1px var(--green); }
.estimate { margin-top:8px; padding:23px; border-radius:17px; color:white; background:var(--ink); }
.estimate-top { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:12px; }
.estimate-top span { color:#aebdb8; font-size:.76rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.estimate-top strong { font-size:2.2rem; line-height:1; letter-spacing:-.05em; }
.estimate p { margin:0 0 18px; color:#cfdbd7; font-size:.86rem; }
.estimate .button { width:100%; color:var(--ink); border-color:var(--gold); background:var(--gold); }
.calculator-note { margin:12px 0 0; color:var(--muted); font-size:.74rem; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; counter-reset:steps; }
.step { padding:28px; border:1px solid var(--line); border-radius:20px; background:white; }
.step::before { counter-increment:steps; content:"0" counter(steps); display:block; margin-bottom:32px; color:var(--gold); font-size:.72rem; font-weight:900; letter-spacing:.14em; }
.step p { margin-bottom:0; color:var(--muted); }
.split { display:grid; grid-template-columns:.82fr 1.18fr; gap:60px; align-items:start; }
.feature-list { border-top:1px solid var(--line); }
.feature-row { padding:21px 0; border-bottom:1px solid var(--line); }
.feature-row strong { display:block; margin-bottom:5px; }
.feature-row p { margin:0; color:var(--muted); }
.faq { max-width:820px; }
details { border-bottom:1px solid var(--line); }
summary { padding:22px 0; display:flex; justify-content:space-between; gap:18px; cursor:pointer; font-weight:850; list-style:none; }
summary::-webkit-details-marker { display:none; }
summary::after { content:"+"; color:var(--green); font-size:1.25rem; }
details[open] summary::after { content:"–"; }
details p { margin:-3px 0 23px; color:var(--muted); }
.cta { padding:90px 0; color:white; background:var(--ink); }
.cta-grid { display:grid; grid-template-columns:1fr auto; gap:45px; align-items:center; }
.cta .eyebrow { color:#acc1bb; }
.cta h2 { max-width:770px; margin-bottom:0; }
.cta .button { white-space:nowrap; }
footer { padding:40px 0; border-top:1px solid var(--line); }
.footer-grid { display:flex; align-items:center; justify-content:space-between; gap:22px; }
.footer-copy { margin:0; color:var(--muted); font-size:.8rem; }
.footer-links { display:flex; flex-wrap:wrap; gap:18px; }
.footer-links a { color:var(--muted); text-decoration:none; font-size:.8rem; font-weight:750; }
@media (max-width:920px) {
  .hero-grid,.split,.custom-grid { grid-template-columns:1fr; }
  .hero-panel,.browser-mock { max-width:600px; }
  .package-grid.three { grid-template-columns:1fr; }
  .package-grid.three .package { max-width:none; }
  .cta-grid { grid-template-columns:1fr; }
}
@media (max-width:720px) {
  .container { width:min(100% - 28px,1120px); }
  .section { padding:72px 0; }
  .hero { padding:55px 0 62px; }
  h1 { font-size:clamp(2.55rem,12vw,3.8rem); }
  .nav-toggle { display:grid; place-items:center; }
  .nav-links { position:fixed; inset:76px 0 auto; display:none; padding:22px 18px 28px; flex-direction:column; align-items:stretch; background:var(--paper); border-bottom:1px solid var(--line); box-shadow:0 18px 30px rgba(22,36,43,.08); }
  .nav-links.open { display:flex; }
  .nav-links a { padding:7px 0; font-size:1rem; }
  .hero-grid { gap:38px; }
  .hero-actions .button { width:100%; }
  .package-grid,.steps { grid-template-columns:1fr; }
  .package { padding:26px 22px; }
  .calculator { padding:24px 20px; }
  .segmented { grid-template-columns:repeat(2,1fr); }
  .platform-grid { grid-template-columns:1fr; }
  .estimate-top { align-items:flex-start; flex-direction:column; }
  .cta { padding:72px 0; }
  .cta .button { width:100%; }
  .footer-grid { align-items:flex-start; flex-direction:column; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none!important; } }