
:root {
  --ink: #14221b;
  --muted: #53635a;
  --paper: #fffdf8;
  --soft: #f2f8f3;
  --green: #19733b;
  --green-dark: #0f5a2b;
  --lime: #dff19a;
  --line: #d7e3d9;
  --shadow: 0 18px 48px rgba(20, 34, 27, .10);
  --radius: 24px;
  --rainbow: linear-gradient(90deg,#ef4444 0 14%,#f59e0b 14% 28%,#eab308 28% 42%,#22c55e 42% 57%,#3b82f6 57% 71%,#8b5cf6 71% 85%,#ec4899 85% 100%);
}
* { 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(--ink);
  background: var(--paper);
  line-height: 1.65;
  text-rendering: optimizeLegibility;
}
a { color: var(--green-dark); text-decoration-thickness: 2px; text-underline-offset: 3px; }
a:hover { color: var(--green); }
img, svg { max-width: 100%; }
button, input, textarea, select { font: inherit; }
:focus-visible { outline: 4px solid #f5b7e3; outline-offset: 3px; }
.skip-link { position:absolute; left:-9999px; top:auto; }
.skip-link:focus { left: 1rem; top: 1rem; z-index: 999; background:#fff; padding:.8rem 1rem; border-radius:10px; }
.rainbow-strip { height: 8px; background: var(--rainbow); }
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,253,248,.94); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(215,227,217,.9); }
.nav-wrap { max-width: 1180px; margin: 0 auto; padding: .85rem 1.25rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand { display:flex; align-items:center; gap:.7rem; text-decoration:none; color:var(--ink); min-width:0; }
.brand-mark { width:52px; height:52px; flex:0 0 auto; }
.brand-copy { line-height:1.05; }
.brand-name { display:block; font-weight:900; font-size:1.08rem; letter-spacing:-.03em; }
.brand-tag { display:block; margin-top:.25rem; color:var(--muted); font-size:.78rem; }
.nav-toggle { display:none; border:1px solid var(--line); background:#fff; padding:.7rem .8rem; border-radius:12px; color:var(--ink); }
.nav-links { display:flex; align-items:center; gap:.25rem; }
.nav-links a { text-decoration:none; color:var(--ink); padding:.65rem .8rem; border-radius:999px; font-weight:700; font-size:.92rem; }
.nav-links a:hover, .nav-links a[aria-current="page"] { background:var(--soft); color:var(--green-dark); }
.nav-links a.cta-nav { color:#fff; background:var(--green); }
.nav-links a.cta-nav:hover { background:var(--green-dark); color:#fff; }
.container { width:min(1180px, calc(100% - 2.5rem)); margin-inline:auto; }
.hero { position:relative; overflow:hidden; padding:5.6rem 0 4.4rem; background:
  radial-gradient(circle at 85% 20%, rgba(223,241,154,.7), transparent 24rem),
  radial-gradient(circle at 15% 10%, rgba(236,72,153,.09), transparent 20rem),
  var(--paper);
}
.hero-grid { display:grid; grid-template-columns:1.15fr .85fr; align-items:center; gap:3rem; }
.eyebrow { display:inline-flex; align-items:center; gap:.5rem; padding:.45rem .7rem; background:#fff; border:1px solid var(--line); border-radius:999px; color:var(--green-dark); font-weight:800; font-size:.84rem; box-shadow:0 6px 18px rgba(20,34,27,.05); }
.eyebrow::before { content:""; width:.65rem; height:.65rem; border-radius:50%; background:var(--rainbow); }
h1, h2, h3 { line-height:1.1; letter-spacing:-.045em; margin-top:0; }
h1 { font-size:clamp(2.8rem, 6.8vw, 6.2rem); max-width:12ch; margin:.9rem 0 1.2rem; }
h2 { font-size:clamp(2rem, 4vw, 3.5rem); margin-bottom:1rem; }
h3 { font-size:1.35rem; margin-bottom:.55rem; }
.lede { font-size:clamp(1.1rem, 2vw, 1.3rem); color:var(--muted); max-width:62ch; }
.actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.6rem; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:.78rem 1.05rem; border-radius:999px; font-weight:850; text-decoration:none; border:2px solid transparent; transition:transform .15s ease, box-shadow .15s ease, background .15s ease; }
.btn:hover { transform:translateY(-2px); }
.btn-primary { color:#fff; background:var(--green); box-shadow:0 10px 24px rgba(25,115,59,.25); }
.btn-primary:hover { background:var(--green-dark); color:#fff; }
.btn-secondary { background:#fff; border-color:var(--line); color:var(--ink); }
.btn-secondary:hover { color:var(--green-dark); box-shadow:0 10px 24px rgba(20,34,27,.08); }
.hero-card { background:#fff; border:1px solid var(--line); border-radius:32px; padding:1.6rem; box-shadow:var(--shadow); position:relative; }
.hero-card::before { content:""; position:absolute; inset:0 0 auto 0; height:8px; background:var(--rainbow); border-radius:32px 32px 0 0; }
.hero-card h2 { font-size:1.55rem; margin-top:.5rem; }
.check-list { list-style:none; padding:0; margin:1rem 0 0; display:grid; gap:.7rem; }
.check-list li { display:flex; gap:.65rem; align-items:flex-start; }
.check-list li::before { content:"✓"; color:#fff; background:var(--green); width:1.35rem; height:1.35rem; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; font-weight:900; font-size:.78rem; margin-top:.15rem; }
.trust-bar { padding:1rem 0; background:var(--ink); color:#fff; }
.trust-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:.75rem; text-align:center; font-weight:800; font-size:.92rem; }
.section { padding:5rem 0; }
.section.soft { background:var(--soft); }
.section-head { max-width:760px; margin-bottom:2rem; }
.kicker { color:var(--green-dark); text-transform:uppercase; letter-spacing:.12em; font-size:.78rem; font-weight:900; }
.grid-3 { display:grid; grid-template-columns:repeat(3, 1fr); gap:1rem; }
.grid-2 { display:grid; grid-template-columns:repeat(2, 1fr); gap:1.2rem; }
.card { background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:1.4rem; box-shadow:0 10px 30px rgba(20,34,27,.05); }
.card p:last-child { margin-bottom:0; }
.card .icon { width:2.8rem; height:2.8rem; border-radius:15px; background:linear-gradient(135deg,#eaf8dc,#fff0fb); display:grid; place-items:center; font-size:1.35rem; margin-bottom:1rem; }
.card-link { display:inline-flex; margin-top:.5rem; font-weight:850; }
.callout { padding:2rem; border-radius:30px; background:var(--ink); color:#fff; position:relative; overflow:hidden; }
.callout::after { content:""; position:absolute; width:220px; height:220px; border-radius:50%; right:-80px; top:-100px; background:var(--rainbow); filter:blur(10px); opacity:.35; }
.callout h2 { max-width:14ch; }
.callout p { color:#d9e7df; max-width:60ch; }
.callout .btn-secondary { border-color:#fff; }
.story { display:grid; grid-template-columns:.85fr 1.15fr; gap:2.5rem; align-items:center; }
.story-panel { min-height:430px; padding:2rem; border-radius:32px; display:flex; align-items:flex-end; background:
 linear-gradient(180deg,transparent,rgba(20,34,27,.82)),
 repeating-linear-gradient(115deg,#e4417c 0 13%,#f28b30 13% 26%,#f6cf3d 26% 39%,#49a95f 39% 52%,#4c7fd6 52% 65%,#8057b6 65% 78%,#e4417c 78% 91%);
 color:#fff; box-shadow:var(--shadow); }
.story-panel p { font-size:1.25rem; font-weight:850; max-width:22ch; margin:0; }
.quote { border-left:5px solid var(--green); padding-left:1rem; font-size:1.25rem; font-weight:750; color:var(--ink); }
.area-list { display:flex; flex-wrap:wrap; gap:.65rem; }
.area-pill { padding:.6rem .8rem; border-radius:999px; background:#fff; border:1px solid var(--line); font-weight:800; text-decoration:none; color:var(--ink); }
.area-pill:hover { border-color:#9ebaa5; color:var(--green-dark); }
.page-hero { padding:4.5rem 0 3.4rem; background:linear-gradient(180deg,#f4f9f2 0%,#fffdf8 100%); }
.page-hero h1 { font-size:clamp(2.6rem, 6vw, 5rem); max-width:15ch; }
.breadcrumbs { font-size:.88rem; color:var(--muted); margin-bottom:1rem; }
.breadcrumbs a { color:var(--muted); }
.content-grid { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:2rem; align-items:start; }
.sidebar { position:sticky; top:100px; }
.sidebar .card + .card { margin-top:1rem; }
.prose { font-size:1.05rem; }
.prose h2 { margin-top:2.3rem; font-size:clamp(1.8rem,3vw,2.7rem); }
.prose h3 { margin-top:1.6rem; }
.prose ul { padding-left:1.2rem; }
.prose li + li { margin-top:.4rem; }
.faq-list { display:grid; gap:.8rem; }
details { background:#fff; border:1px solid var(--line); border-radius:18px; padding:1rem 1.1rem; }
summary { cursor:pointer; font-weight:850; }
details p { color:var(--muted); }
.form-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.field { display:grid; gap:.35rem; }
.field.full { grid-column:1 / -1; }
label { font-weight:800; }
input, textarea, select { width:100%; padding:.85rem .9rem; border:1px solid #b8c8bc; border-radius:14px; background:#fff; color:var(--ink); }
textarea { min-height:160px; resize:vertical; }
.form-note { color:var(--muted); font-size:.9rem; }
.footer { border-top:1px solid var(--line); padding:3rem 0 2rem; background:#fbfcf7; }
.footer-grid { display:grid; grid-template-columns:1.3fr .7fr .7fr; gap:2rem; }
.footer h3 { font-size:1rem; letter-spacing:0; }
.footer ul { list-style:none; padding:0; margin:0; }
.footer li + li { margin-top:.35rem; }
.footer a { color:var(--muted); }
.footer-bottom { margin-top:2rem; padding-top:1.2rem; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:1rem; color:var(--muted); font-size:.88rem; }
.mobile-quote { display:none; }
.notice { border:1px solid #ead898; background:#fff9df; padding:1rem; border-radius:14px; color:#65561f; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; background:#fff; border-radius:16px; overflow:hidden; }
th, td { text-align:left; padding:.85rem; border-bottom:1px solid var(--line); }
th { background:var(--soft); }
@media (max-width: 900px) {
  .hero-grid, .story, .content-grid, .footer-grid { grid-template-columns:1fr; }
  .sidebar { position:static; }
  .grid-3 { grid-template-columns:1fr 1fr; }
  .trust-grid { grid-template-columns:1fr 1fr; }
  .nav-toggle { display:inline-flex; }
  .nav-links { display:none; position:absolute; left:1rem; right:1rem; top:calc(100% + .5rem); flex-direction:column; align-items:stretch; background:#fff; border:1px solid var(--line); border-radius:18px; padding:.6rem; box-shadow:var(--shadow); }
  .nav-links.open { display:flex; }
  .nav-links a { border-radius:12px; }
}
@media (max-width: 620px) {
  .container { width:min(100% - 1.5rem, 1180px); }
  .brand-tag { display:none; }
  .brand-mark { width:44px; height:44px; }
  .hero { padding-top:3.4rem; }
  h1 { font-size:clamp(2.55rem, 14vw, 4.2rem); }
  .grid-3, .grid-2, .form-grid { grid-template-columns:1fr; }
  .field.full { grid-column:auto; }
  .trust-grid { font-size:.82rem; }
  .section { padding:3.6rem 0; }
  .footer-bottom { flex-direction:column; }
  .mobile-quote { display:flex; position:fixed; left:1rem; right:1rem; bottom:.6rem; z-index:45; background:var(--green); color:#fff; min-height:44px; padding:.55rem 1rem; border-radius:999px; align-items:center; justify-content:center; font-size:.95rem; line-height:1.1; font-weight:900; text-decoration:none; box-shadow:0 8px 22px rgba(15,90,43,.32); }
  body { padding-bottom:4rem; }
  body.no-sticky-quote { padding-bottom:0; }
  body.no-sticky-quote .mobile-quote { display:none; }
}
@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior:auto !important; transition:none !important; }
}
