:root{
  --bg:#F7FAFB; --ink:#0F1B1E; --muted:#5E6A6E;
  --brand:#12CFC5; --brand-2:#FF6A2A; --card:#FFFFFF;
  --border:#cfd8db; --ring: rgba(11,91,74,.20);
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#0f1418; --ink:#F5F7FA; --muted:#c2c9ce; --card:#121a20; --border:#33424a; }
}
*{box-sizing:border-box} html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Helvetica,Arial,sans-serif;line-height:1.5}
img{max-width:100%;height:auto}
a{color:var(--brand);text-decoration:none} a:hover{text-decoration:underline}
.container{max-width:1100px;margin:auto;padding:clamp(16px,3vw,28px)}
header{position:sticky;top:0;background:#ffffffd9;backdrop-filter:saturate(150%) blur(8px);border-bottom:1px solid #e6ecef;z-index:50}
@media (prefers-color-scheme: dark){ header{background:#0f1418cc;border-bottom-color:#24313a}}
.nav{display:flex;align-items:center;justify-content:space-between;gap:12px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800}
.logo .mark{width:32px;height:32px;border-radius:9px;background:linear-gradient(135deg,var(--brand),#18DACF 60%,var(--brand-2));box-shadow:0 6px 16px var(--ring)}
.nav a{font-weight:600;color:var(--ink)}
.links{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.btn{display:inline-block;border-radius:14px;background:var(--brand);color:#fff;padding:12px 16px;font-weight:700;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 22px var(--ring)}
.btn:hover{background:var(--brand-2)} .btn-outline{background:#fff;color:var(--brand);border:1px solid var(--brand)}
main .hero{background:radial-gradient(900px 380px at 10% -20%, #d7f2ec, transparent 65%),linear-gradient(#fff,#f6f7f8)}
.hero h1{font-size:clamp(26px,5vw,44px);line-height:1.1;margin:8px 0}
.hero p.lead{color:var(--muted);margin:0 0 16px}
.grid{display:grid;gap:16px}
.grid.cols-2{grid-template-columns:1fr}
.grid.cols-3{grid-template-columns:1fr}
@media (min-width:760px){ .grid.cols-2{grid-template-columns:1fr 1fr} .grid.cols-3{grid-template-columns:repeat(3,1fr)} }
.card{background:var(--card);border:1px solid var(--border);border-radius:18px;box-shadow:0 8px 24px var(--ring);padding:16px}
.badge{display:inline-block;background:#fff;border:1px solid #e7ecef;color:var(--muted);padding:8px 12px;border-radius:999px;font-size:14px;margin-right:8px}
.section{padding:40px 0}
h2{font-size:clamp(22px,3.2vw,32px);margin:0 0 8px}
.lead{color:var(--muted);margin:0 0 18px}
/* FORM: strong visible borders & focus */
form .row{display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width:760px){ form .row{grid-template-columns:repeat(2,1fr)} }
label{font-weight:600;color:#233}
input,select,textarea{width:100%;margin-top:6px;border-radius:12px;border:1.6px solid var(--border);padding:12px 12px;background:#fff;color:var(--ink);font:inherit}
@media (prefers-color-scheme: dark){ input,select,textarea{background:#0f1418;color:var(--ink)}}
input::placeholder,textarea::placeholder{color:#8a9aa0}
input:focus,select:focus,textarea:focus{outline:3px solid color-mix(in oklab, var(--brand) 40%, #000 0%);border-color:var(--brand-2)}
small.muted{color:var(--muted)}
/* Footer */
footer{background:#0d1515;color:#dfe7e7} footer a{color:#a6f0da}
/* Mobile polish */
.tap-target{min-height:44px;min-width:44px}
.sticky-cta{position:fixed;left:0;right:0;bottom:10px;display:flex;justify-content:center;z-index:60}
.sticky-cta .btn{border-radius:999px;padding:14px 22px}