@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Sora:wght@600;700&display=swap');

:root{
  --brand-navy:#28364D;
  --brand-teal:#2BB7A9;
  --success:#6EDC5F;
  --bg:#FFFFFF;
  --bg-subtle:#F7F9FC;
  --border:#E6EAF0;
  --text:#28364D;
  --text-muted:#6B778C;
  --radius-sm:12px;
  --radius-md:16px;
  --shadow-sm:0 6px 18px rgba(40,54,77,.08);
  --container-max:1200px;
}
*{box-sizing:border-box}
body{margin:0;font-family:'Inter',sans-serif;color:var(--text);background:var(--bg);line-height:1.6}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

.container{max-width:var(--container-max);margin:0 auto;padding:0 20px}
@media (min-width:768px){.container{padding:0 32px}}
@media (min-width:1024px){.container{padding:0 48px}}

.section{padding:64px 0}
@media (min-width:1024px){.section{padding:96px 0}}
.section--subtle{background:var(--bg-subtle)}

h1,h2,h3,h4{font-family:'Sora',sans-serif;margin:0 0 16px;line-height:1.1}
h1{font-size:40px;font-weight:700}
h2{font-size:32px;font-weight:700}
h3{font-size:28px;font-weight:600}
h4{font-size:20px;font-weight:600}
@media (min-width:1024px){h1{font-size:56px}h2{font-size:40px}}
p{margin:0 0 16px;color:var(--text-muted)}
.overline{font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--brand-teal)}

.site-header{position:sticky;top:0;background:rgba(255,255,255,.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);z-index:10}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;min-height:84px;gap:24px}
.logo-area{display:flex;align-items:center;gap:16px;padding:24px 0}
.logo{width:160px;height:auto}
.nav-links{display:none;gap:20px;align-items:center}
.nav-link{font-weight:500;color:var(--text-muted)}
.nav-link:hover,.nav-link:focus-visible{color:var(--brand-navy)}
.mobile-toggle{border:1px solid var(--border);border-radius:10px;background:var(--bg);padding:10px 12px}
@media (min-width:960px){.nav-links{display:flex}.mobile-toggle{display:none}}
.mobile-menu{display:none;padding-bottom:20px}
.mobile-menu.open{display:grid;gap:12px}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:12px 18px;border-radius:var(--radius-sm);font-weight:600;transition:all .2s ease-out;border:1px solid transparent}
.btn:focus-visible,.input:focus-visible,.nav-link:focus-visible{outline:2px solid var(--brand-teal);outline-offset:2px}
.btn-primary{background:var(--brand-navy);color:#fff}
.btn-primary:hover{filter:brightness(.92)}
.btn-secondary{border-color:var(--brand-navy);color:var(--brand-navy);background:transparent}
.btn-secondary:hover{background:var(--bg-subtle)}
.btn-link{color:var(--brand-teal)}
.btn-link:hover{text-decoration:underline}

.hero{background:linear-gradient(135deg,#f7f9fc,#fff);position:relative;overflow:hidden}
.hero::after{content:'';position:absolute;inset:auto -80px -120px auto;width:380px;height:380px;background:radial-gradient(circle,rgba(43,183,169,.16),transparent 70%)}
.hero-grid{display:grid;grid-template-columns:1fr;gap:32px;align-items:center}
@media (min-width:960px){.hero-grid{grid-template-columns:7fr 5fr;gap:48px}}
.curve{height:2px;background:linear-gradient(90deg,transparent,var(--brand-teal),transparent);opacity:.5;margin:24px 0}
.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);padding:24px;box-shadow:var(--shadow-sm)}
.badge{display:inline-flex;padding:6px 10px;border-radius:999px;font-size:14px;font-weight:600}
.badge-neutral{background:var(--bg-subtle);color:var(--brand-navy)}
.badge-accent{background:rgba(43,183,169,.13);color:var(--brand-navy)}

.grid{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:16px}
@media (min-width:768px){.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}
@media (min-width:1024px){.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}}

.input{width:100%;min-height:44px;padding:12px 14px;border:1px solid var(--border);border-radius:var(--radius-sm);font:inherit;color:var(--text)}
.input:focus{border-color:var(--brand-teal);box-shadow:0 0 0 4px rgba(43,183,169,.1)}
.form-grid{display:grid;gap:12px}

.footer{background:var(--brand-navy);color:#fff;padding:48px 0}
.footer p,.footer a{color:rgba(255,255,255,.82)}
.footer a:hover{color:#fff}
.footer-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;align-items:flex-start}

.visual{border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--border)}
.stack{display:grid;gap:16px}
.m0{margin:0}
.text-center{text-align:center}
.actions{display:flex;gap:12px;flex-wrap:wrap}