:root {
  --ink:#071d27;
  --deep:#092b3b;
  --blue:#0e6786;
  --aqua:#29a9b8;
  --paper:#f6fbfc;
  --white:#ffffff;
  --muted:#58717b;
  --line:#cfe0e5;
  --hot:#e45c3b;
  --good:#0b6c3e;
  --warn:#a23120;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0;
  color:var(--ink);
  background:var(--paper);
  font:16px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
a { color:inherit; }
button,input,select,textarea { font:inherit; }
.topbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px clamp(18px,5vw,64px);
  background:var(--deep);
  color:var(--white);
}
.brand { font-weight:900; letter-spacing:.08em; }
.phone { font-weight:800; text-decoration:none; }
main { max-width:1120px; margin:0 auto; }
.hero {
  min-height:430px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:64px clamp(20px,6vw,82px);
  background:linear-gradient(135deg,#0a3143,#0e6786);
  color:var(--white);
}
.eyebrow {
  letter-spacing:.13em;
  font-size:.78rem;
  font-weight:900;
  opacity:.78;
}
h1 {
  font-size:clamp(2.5rem,7vw,5rem);
  line-height:.95;
  max-width:780px;
  margin:.2em 0;
}
h2 {
  font-size:clamp(1.8rem,4vw,2.8rem);
  line-height:1.05;
  margin:.2em 0 .45em;
}
.lede { max-width:650px; font-size:clamp(1.05rem,2.5vw,1.4rem); }
.button {
  display:inline-block;
  width:fit-content;
  border:0;
  border-radius:10px;
  padding:14px 20px;
  background:var(--hot);
  color:white;
  font-weight:900;
  text-decoration:none;
  cursor:pointer;
}
.button.secondary { background:white; color:var(--deep); }
.button.ghost { background:transparent; color:white; border:1px solid rgba(255,255,255,.55); }
.button.small { padding:8px 11px; font-size:.88rem; }
.hero-actions,.close-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.close-actions { justify-content:center; margin:12px 0 20px; }
.proof {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--line);
  border-bottom:1px solid var(--line);
}
.proof div { background:white; padding:26px; }
.proof strong,.proof span { display:block; }
.proof strong { font-size:1.08rem; margin-bottom:4px; }
.proof span { color:var(--muted); }
.form-wrap {
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:42px;
  padding:64px clamp(20px,6vw,82px);
}
form.panel, #lead-form {
  background:white;
  padding:26px;
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:0 12px 35px rgba(9,43,59,.08);
}
label { display:block; font-weight:800; margin:0 0 14px; }
label span { color:var(--muted); font-weight:500; font-size:.82rem; }
input,select,textarea {
  width:100%;
  margin-top:6px;
  padding:12px;
  border:1px solid #adc4cc;
  border-radius:8px;
  background:white;
  color:var(--ink);
}
textarea { resize:vertical; }
.honeypot {
  position:absolute;
  left:-10000px;
  width:1px;
  height:1px;
  opacity:0;
}
.offer-note {
  margin:4px 0 18px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#eef8f9;
}
.offer-note strong,.offer-note span { display:block; }
.offer-note span { margin-top:4px; color:var(--muted); font-size:.86rem; }
.form-note { color:var(--muted); font-size:.82rem; }
#form-status { margin-top:12px; font-weight:800; }
.success { color:var(--good); }
.error { color:var(--warn); }
.service-detail {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:var(--line);
  border-block:1px solid var(--line);
}
.service-detail > div {
  background:white;
  padding:42px clamp(20px,6vw,64px);
}
.service-detail p { color:var(--muted); }
.close {
  text-align:center;
  padding:60px 20px 74px;
  background:#dff2f4;
}
.promo-banner {
  display:grid;
  grid-template-columns:1fr auto;
  gap:6px 18px;
  align-items:center;
  padding:16px clamp(20px,5vw,64px);
  background:#ffd86b;
  color:#092b3b;
  border-bottom:1px solid #d8b64f;
}
.promo-banner strong { font-size:clamp(1.25rem,3vw,2rem); line-height:1; }
.promo-banner span { display:block; font-weight:800; }
.promo-banner a {
  grid-row:1 / span 2;
  grid-column:2;
  padding:10px 16px;
  border-radius:999px;
  background:#092b3b;
  color:white;
  text-decoration:none;
  font-weight:900;
  white-space:nowrap;
}
.promo-banner small { grid-column:1 / -1; color:#5d4a12; }
.leak-hero {
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:26px;
  align-items:center;
  padding:58px clamp(20px,6vw,82px);
  background:linear-gradient(135deg,#0a3143,#0e6786);
  color:white;
}
.leak-hero h1 { max-width:620px; }
.pool-graphic {
  width:100%;
  max-width:520px;
  justify-self:end;
  filter:drop-shadow(0 18px 24px rgba(0,0,0,.14));
}
.leak-highlights {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--line);
}
.leak-highlights div { background:white; padding:24px; }
.leak-highlights strong,.leak-highlights span { display:block; }
.leak-highlights strong { font-size:1.05rem; margin-bottom:5px; }
.leak-highlights span { color:var(--muted); }
.leak-flow,.bucket-test,.leak-signs {
  padding:58px clamp(20px,6vw,82px);
}
.leak-flow { background:#eef8f9; }
.flow-grid { max-width:760px; margin:28px auto 0; }
.flow-card {
  position:relative;
  background:white;
  border:1px solid var(--line);
  border-radius:16px;
  padding:22px 22px 22px 68px;
  box-shadow:0 10px 26px rgba(9,43,59,.06);
}
.flow-card b {
  position:absolute;
  left:20px;
  top:20px;
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:50%;
  background:var(--blue);
  color:white;
}
.flow-card strong,.flow-card span { display:block; }
.flow-card strong { font-size:1.08rem; }
.flow-card span { color:var(--muted); margin-top:4px; }
.flow-card.alert { border:2px solid var(--hot); }
.flow-arrow { text-align:center; font-size:2rem; color:var(--aqua); font-weight:900; line-height:1.2; }
.bucket-test {
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:42px;
  background:white;
}
.bucket-steps { margin:0; padding-left:1.4rem; }
.bucket-steps li { margin:0 0 14px; padding-left:6px; }
.leak-signs { background:#f6fbfc; }
.sign-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:26px;
}
.sign-grid span {
  background:white;
  border:1px solid var(--line);
  border-radius:12px;
  padding:18px;
  font-weight:800;
}
.brand { color:inherit; text-decoration:none; }

.close .button { margin:12px auto 20px; display:block; }
.review-link { display:block; color:var(--blue); font-weight:800; }
footer {
  text-align:center;
  padding:26px;
  color:var(--muted);
  font-size:.86rem;
}
.admin-shell { max-width:1320px; margin:0 auto; padding:24px; }
.admin-header {
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:flex-start;
  margin-bottom:24px;
}
.admin-header h1 { font-size:clamp(2rem,5vw,3.4rem); margin:0; }
.token-box { max-width:440px; }
.token-row { display:flex; gap:8px; }
.token-row input { margin:0; }
.kpis {
  display:grid;
  grid-template-columns:repeat(6,minmax(120px,1fr));
  gap:10px;
  margin:18px 0 26px;
}
.kpi {
  background:white;
  border:1px solid var(--line);
  border-radius:12px;
  padding:14px;
}
.kpi strong { display:block; font-size:1.55rem; }
.kpi span { color:var(--muted); font-size:.82rem; }
.admin-grid {
  display:grid;
  grid-template-columns:320px 1fr;
  gap:18px;
}
.leads { display:grid; gap:12px; }
.lead-card {
  background:white;
  border:1px solid var(--line);
  border-radius:12px;
  padding:16px;
}
.lead-card.overdue { border-left:6px solid var(--hot); }
.lead-top {
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
}
.lead-card h3 { margin:0; }
.meta {
  display:flex;
  flex-wrap:wrap;
  gap:6px 12px;
  color:var(--muted);
  font-size:.87rem;
  margin:8px 0;
}
.badge {
  display:inline-block;
  padding:4px 8px;
  border-radius:999px;
  background:#e6f3f6;
  color:var(--deep);
  font-size:.75rem;
  font-weight:900;
  text-transform:uppercase;
}
.actions {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:12px;
}
.actions button {
  border:1px solid #abc4cc;
  border-radius:8px;
  padding:8px 10px;
  background:white;
  cursor:pointer;
  font-weight:800;
}
.actions button.primary { background:var(--deep); color:white; border-color:var(--deep); }
.admin-note { color:var(--muted); font-size:.88rem; }
.inline-link { color:var(--blue); font-weight:800; }
.empty { padding:30px; text-align:center; color:var(--muted); background:white; border:1px solid var(--line); border-radius:12px; }
@media (max-width:900px) {
  .kpis { grid-template-columns:repeat(3,1fr); }
  .admin-grid { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  .proof,.form-wrap,.service-detail,.leak-hero,.bucket-test,.leak-highlights,.sign-grid { grid-template-columns:1fr; }
  .promo-banner { grid-template-columns:1fr; }
  .promo-banner a { grid-row:auto; grid-column:auto; justify-self:start; }
  .pool-graphic { justify-self:center; max-width:420px; }
  .hero { min-height:380px; }
  .proof div { padding:20px; }
  .form-wrap { gap:16px; padding:42px 18px; }
  #lead-form { padding:18px; }
  .topbar { gap:12px; }
  .phone { font-size:.9rem; }
  .admin-shell { padding:16px; }
  .admin-header { display:block; }
  .kpis { grid-template-columns:repeat(2,1fr); }
}