/* Get Unhooked — static site styles (GitHub Pages). Light design system. */
:root{
  --bg:#EEF3F7; --bg2:#F1F0EC; --surface:#fff; --ink:#161B22; --muted:#5F6B78;
  --green:#14C896; --green-dk:#0B9C74; --hero1:#0E3B34; --hero2:#0A2C2A; --line:#E2E8EE;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; color:var(--ink); background:linear-gradient(180deg,var(--bg),var(--bg2));
  font-family:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.65; -webkit-font-smoothing:antialiased;
}
a{color:var(--green-dk); text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:760px; margin:0 auto; padding:0 22px}
header.site{display:flex; align-items:center; gap:12px; padding:22px; max-width:980px; margin:0 auto}
header.site .mark{width:40px;height:40px;border-radius:11px;display:block}
header.site .name{font-weight:700; font-size:18px; letter-spacing:.2px}
header.site nav{margin-left:auto; display:flex; gap:18px; font-size:14px}
header.site nav a{color:var(--muted); font-weight:600}
.hero{background:linear-gradient(150deg,var(--hero1),var(--hero2)); color:#fff; border-radius:28px;
  padding:54px 34px; margin:8px 0 28px; text-align:center}
.hero h1{font-size:42px; line-height:1.1; margin:0 0 12px; font-weight:800}
.hero p{font-size:18px; color:#bfe9da; margin:0 auto; max-width:520px}
.cta{display:inline-flex; gap:12px; margin-top:26px; flex-wrap:wrap; justify-content:center}
.btn{background:linear-gradient(150deg,#14C896,#0B9C74); color:#062b20; font-weight:700;
  padding:13px 22px; border-radius:999px; font-size:15px}
.btn.ghost{background:rgba(255,255,255,.12); color:#eafff7}
.tracks{display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin:0 0 30px}
.chip{background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:8px 16px;
  font-size:14px; font-weight:600}
.card{background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:22px 26px; margin:16px 0;
  box-shadow:0 16px 32px -24px rgba(26,40,80,.35)}
h2{font-size:24px; color:var(--green-dk); margin:34px 0 10px}
h3{font-size:17px; margin:20px 0 6px}
p,li{font-size:16px; color:#26303a}
.muted{color:var(--muted)}
.lead{font-size:18px}
.eyebrow{font-size:12px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color:var(--green-dk)}
.callout{background:#E1F5EE; border-left:3px solid var(--green); border-radius:8px; padding:14px 16px; margin:16px 0}
.crisis{background:#FBEAEA; border-left:3px solid #D8443C}
footer.site{border-top:1px solid var(--line); margin-top:48px; padding:26px 22px; text-align:center; color:var(--muted); font-size:14px}
footer.site a{color:var(--muted); margin:0 10px}
.back{display:inline-block; margin:24px 0 0; font-weight:600}

/* Contact form */
form.card{display:flex; flex-direction:column; gap:2px}
.field{display:flex; flex-direction:column; margin:10px 0}
.field label{font-size:14px; font-weight:700; color:var(--ink); margin-bottom:6px}
.field .opt{font-weight:500; color:var(--muted)}
.field .req{color:var(--green-dk)}
.field input, .field textarea{
  font-family:inherit; font-size:15px; color:var(--ink); background:#fff;
  border:1px solid var(--line); border-radius:12px; padding:12px 14px; width:100%;
  transition:border-color .15s, box-shadow .15s;
}
.field input:focus, .field textarea:focus{
  outline:none; border-color:var(--green); box-shadow:0 0 0 3px rgba(20,200,150,.15);
}
.field textarea{resize:vertical; min-height:120px}
.field .err{color:#C0392B; font-size:13px; margin:6px 0 0}
.field .err:empty{display:none}
.cf-turnstile{margin:12px 0 4px}
.btn.submit{border:0; cursor:pointer; width:100%; margin-top:8px; font-size:15px;
  color:#062b20; padding:14px 22px}
.btn.submit:disabled{opacity:.6; cursor:default}
.form-status{font-size:14px; font-weight:600; margin:12px 0 0; text-align:center}
.form-status.good{color:var(--green-dk)}
.form-status.bad{color:#C0392B}

@media(max-width:560px){.hero h1{font-size:32px}.hero{padding:40px 22px}}