/* Tetra Lead Engine: Tetra family navy, with an "engine" green accent */
:root{
  --navy:#000056;--navy-2:#0a0a6e;--blue:#006aff;--blue-dk:#0052cc;
  --green:#2ee6a6;--green-dk:#0f9d74;
  --ink:#0d1030;--text:#3b3f5c;--muted:#626785;--line:#e3e6f0;--tint:#f4f6fb;--white:#fff;
  --ok:#0f9d58;--err:#c62828;--radius:14px;
  --shadow:0 10px 30px rgba(0,0,86,.10),0 2px 6px rgba(0,0,86,.06);
  --font-h:"Poppins",system-ui,sans-serif;--font-b:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;font-family:var(--font-b);color:var(--text);background:var(--white);line-height:1.6;font-size:17px;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%}
a{color:var(--blue)}
h1,h2,h3{font-family:var(--font-h);color:var(--ink);line-height:1.15;margin:0 0 .5em}
h1{font-size:clamp(2.1rem,5vw,3.4rem);font-weight:800;letter-spacing:-.02em}
h2{font-size:clamp(1.6rem,3vw,2.3rem);font-weight:700;letter-spacing:-.01em}
h3{font-size:1.1rem;font-weight:600}
p{margin:0 0 1em}
.wrap{max-width:1140px;margin:0 auto;padding:0 20px}
.narrow{max-width:780px}
.muted{color:var(--muted)}
.eyebrow{font:600 .8rem/1 var(--font-h);letter-spacing:.12em;text-transform:uppercase;color:var(--green-dk);margin-bottom:12px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:99;background:#fff;padding:8px 12px;border-radius:8px}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 1rem/1 var(--font-h);padding:14px 22px;border-radius:10px;border:2px solid transparent;text-decoration:none;cursor:pointer;transition:background .15s,transform .15s}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--blue);color:#fff;box-shadow:0 6px 18px rgba(0,106,255,.3)}
.btn-primary:hover{background:var(--blue-dk)}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn-ghost:hover{background:rgba(255,255,255,.1)}
.btn[disabled]{opacity:.6;cursor:wait}

/* header */
.header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.header-in{display:flex;align-items:center;gap:20px;height:68px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--navy);font:700 1.15rem/1 var(--font-h);white-space:nowrap}
.brand img{width:38px;height:38px;object-fit:contain}
.brand i{font-style:normal;color:var(--blue);font-weight:800}
.brand b{color:var(--navy);font-weight:800;margin-left:.28em}
.nav{display:flex;gap:22px;margin-left:auto}
.nav a{color:var(--text);text-decoration:none;font-weight:500;font-size:.95rem}
.nav a:hover{color:var(--navy)}
.header .btn{padding:11px 16px;font-size:.95rem}
@media (max-width:860px){.nav{display:none}.header .btn{margin-left:auto}}
@media (max-width:520px){.brand{font-size:1rem}.header .btn{padding:10px 12px;font-size:.88rem}.long{display:none}}
@media (min-width:521px){.short{display:none}}

/* hero */
.hero{background:radial-gradient(1200px 500px at 85% -10%,#1b1b9a 0%,transparent 60%),var(--navy);color:#d7d9f5;padding:72px 0 80px}
.hero h1{color:#fff}
.hero h1 em{font-style:normal;color:var(--green)}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.hero .lead{font-size:1.15rem;max-width:36em}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 18px}
.hero-note{font-size:.9rem;color:#a9acd9}
.panel{background:#fff;color:var(--text);border-radius:var(--radius);box-shadow:0 20px 50px rgba(0,0,0,.35);padding:22px}
.panel h3{margin-bottom:14px}
.feed{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.feed li{display:flex;gap:12px;align-items:flex-start;padding:12px;border:1px solid var(--line);border-radius:10px;font-size:.93rem;line-height:1.4}
.feed .t{font:600 .75rem/1 var(--font-h);color:var(--muted);white-space:nowrap;padding-top:3px;min-width:44px}
.feed b{color:var(--ink)}
.dot{width:10px;height:10px;border-radius:50%;background:var(--green);flex:none;margin-top:5px}
@media (max-width:900px){.hero-grid{grid-template-columns:1fr}.hero{padding:52px 0 60px}}

/* sections */
.section{padding:84px 0}
.section.tint{background:var(--tint)}
.section-head{max-width:720px;margin:0 0 40px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media (max-width:960px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.grid-3,.grid-4{grid-template-columns:1fr}.section{padding:60px 0}}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.card p{margin:0;font-size:.97rem}
.ic{width:42px;height:42px;border-radius:10px;background:#e7fbf4;color:var(--green-dk);display:grid;place-items:center;margin-bottom:14px}
.ic svg{width:22px;height:22px;fill:currentColor}
.step{position:relative;padding-top:8px}
.step .n{font:800 2.4rem/1 var(--font-h);color:var(--blue);opacity:.25;margin-bottom:8px}
.problems{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.problems .card{border-left:4px solid var(--err)}
@media (max-width:860px){.problems{grid-template-columns:1fr}}
.pill-row{display:flex;flex-wrap:wrap;gap:10px}
.pill{background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 16px;font-weight:500;color:var(--ink)}
.proof{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
@media (max-width:860px){.proof{grid-template-columns:1fr}}
.checks{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.checks li{padding-left:30px;position:relative}
.checks li:before{content:"";position:absolute;left:0;top:5px;width:18px;height:18px;border-radius:50%;background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z' fill='%23000056'/%3E%3C/svg%3E") center/14px no-repeat}

/* faq */
.faq details{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 20px;margin-bottom:10px}
.faq summary{cursor:pointer;font:600 1.02rem/1.4 var(--font-h);color:var(--ink)}
.faq details p{margin:12px 0 0}

/* contact */
.contact{background:var(--navy);color:#d7d9f5}
.contact h2{color:#fff}
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:start}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr}}
form.box{background:#fff;color:var(--text);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:560px){.row{grid-template-columns:1fr}}
label{display:block;font-weight:600;font-size:.9rem;color:var(--ink);margin:0 0 6px}
.field{margin-bottom:14px}
input,select,textarea{width:100%;font:inherit;font-size:1rem;padding:12px 14px;border:1px solid #cfd3e3;border-radius:10px;background:#fff;color:var(--ink)}
textarea{min-height:96px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--blue);outline:none;box-shadow:0 0 0 3px rgba(0,106,255,.15)}
.consent{font-weight:400;display:flex;gap:10px;align-items:flex-start;font-size:.82rem;color:var(--muted);margin:6px 0 16px}
.consent input{width:18px;height:18px;margin-top:2px;flex:none}
.hp{position:absolute;left:-9999px}
.form-msg{margin-top:12px;font-weight:600}
.form-msg.ok{color:var(--ok)}.form-msg.err{color:var(--err)}
.contact-grid > div a{color:#fff}
form.box a{color:var(--blue)}

/* footer */
.footer{background:#00003a;color:#a9acd9;font-size:.9rem;padding:28px 0}
.footer a{color:#fff}
.footer-in{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between}

/* legal pages */
.legal{max-width:780px;margin:0 auto;padding:56px 20px 80px}
.legal h2{font-size:1.3rem;margin-top:1.8em}
