/*
COPYTO: /public_html/assets/styles.css
*/
:root{
  --bg:#0a0f0d;
  --ink:#0c0c0c;
  --base:#ffffff;
  --muted:#6b7280;
  --brand:#0c6c4f;
  --brand-2:#11a57a;
  --paper:#f7faf9;
  --border:#e6ece9;
  --shadow: 0 8px 24px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.06);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;color:#111;background:#fff}

.wrap{width:min(1100px,calc(100% - 2rem));margin-inline:auto}
.site-header{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--border);z-index:30}
.site-header .wrap{display:flex;gap:1rem;align-items:center;justify-content:space-between;padding:.8rem 0}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:#111}
.brand img{display:block}
.brand span{font-weight:800;letter-spacing:.5px}
.brand small{color:var(--muted);display:block;margin-left:.25rem;margin-top:-.2rem;font-size:.8rem}

.site-nav{display:flex;gap:1rem;align-items:center}
.site-nav a{color:#111;text-decoration:none}
.button{display:inline-block;border-radius:.6rem;padding:.72rem 1rem;border:1px solid transparent;background:var(--brand);color:#fff;font-weight:700;text-decoration:none;box-shadow:var(--shadow)}
.button.ghost{background:#fff;color:#111;border-color:var(--border);box-shadow:none}
.button.sm{padding:.45rem .7rem;border-radius:.5rem}
.button.lg{padding:.9rem 1.1rem;border-radius:.7rem}
.button:focus-visible{outline:2px solid var(--brand-2);outline-offset:2px}

.hero{background:
  radial-gradient(1100px 400px at 10% -10%, rgba(17,165,122,.10), transparent 60%),
  linear-gradient(180deg, #fff, #f7fcfa 40%, #fff 100%);
  border-bottom:1px solid var(--border);
}
.hero-grid{display:grid;grid-template-columns:1fr;gap:2rem;align-items:center;padding:3rem 0}
.hero-copy h1{font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.2;margin:.2rem 0 1rem}
.hero-copy p{color:#374151;max-width:48ch}
.cta-row{display:flex;gap:.7rem;margin:1rem 0 0}
.trust{display:flex;gap:1rem;padding:0;margin:1rem 0 0;list-style:none;color:var(--muted)}
.trust li{display:flex;gap:.4rem}
.hero-card .card{background:#fff;border:1px solid var(--border);border-radius:1rem;box-shadow:var(--shadow);padding:1rem}
.card-head{display:flex;align-items:center;gap:.7rem;margin-bottom:.6rem}
.card-head .pill{background:#e8fbf4;color:#0c6c4f;border:1px solid #bdf0e1;padding:.2rem .5rem;border-radius:999px;font-size:.75rem}
.mini-grid{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;padding:0;margin:0}
.mini-grid li{border:1px solid var(--border);border-radius:.8rem;padding:.6rem}
.mini-grid .tile{height:80px;border-radius:.5rem;background:linear-gradient(135deg,#f0f4f2,#e5efe9)}
.tile.t1{background-image:linear-gradient(135deg,#f6f7ea,#eaefe0)}
.tile.t2{background-image:linear-gradient(135deg,#efe7e3,#e8ded9)}
.tile.t3{background-image:linear-gradient(135deg,#e6eef8,#d8e7f5)}
.tile.t4{background-image:linear-gradient(135deg,#f2e6f7,#eadcf3)}
.mini-grid span{display:block;font-weight:700;margin-top:.5rem}
.mini-grid small{color:var(--muted)}

.how{padding:3rem 0}
.how h2,.categories h2,.why h2,.waitlist h2{font-size:1.8rem;margin:0 0 1rem}
.steps{display:grid;grid-template-columns:1fr;gap:1rem}
.steps article{border:1px solid var(--border);border-radius:.9rem;padding:1rem;background:#fff}
.steps .num{width:34px;height:34px;border-radius:999px;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:800;margin-bottom:.5rem}

.categories{padding:2rem 0;background:#fcfefd;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.cat-grid{display:grid;grid-template-columns:1fr;gap:.8rem;list-style:none;padding:0;margin:0}
.cat-grid li{border:1px solid var(--border);border-radius:.9rem;padding:1rem;background:#fff}
.cat-grid span{font-weight:700}
.cat-grid small{display:block;color:var(--muted)}

.why{padding:2.5rem 0}
.reasons{display:grid;grid-template-columns:1fr;gap:1rem}
.reasons article{border:1px solid var(--border);border-radius:.9rem;padding:1rem;background:#fff}

.waitlist{padding:2.5rem 0;background:#fff;border-top:1px solid var(--border)}
form{display:grid;grid-template-columns:1fr;gap:.8rem;max-width:520px}
label span{display:block;font-weight:700;margin-bottom:.2rem}
input[type="text"],input[type="email"]{
  width:100%;padding:.75rem .8rem;border:1px solid var(--border);border-radius:.6rem;background:#fff
}
input:focus{outline:2px solid #c7f0e3;border-color:#a0e7d2}

.form-msg{min-height:1.2rem;color:#0c6c4f;margin:.25rem 0 0}

.site-footer{border-top:1px solid var(--border);padding:1.2rem 0;background:#fff}
.site-footer .wrap{display:flex;gap:1rem;align-items:center;justify-content:space-between;flex-wrap:wrap}
.foot-brand{display:flex;align-items:center;gap:.5rem}
.foot-brand strong{letter-spacing:.5px}
.foot-brand small{color:var(--muted);margin-left:.2rem}
.foot-links{display:flex;gap:1rem;flex-wrap:wrap}
.foot-links a{text-decoration:none;color:#111}
.copy{color:var(--muted)}

@media (min-width: 760px){
  .hero-grid{grid-template-columns:1.2fr .8fr;gap:3rem;align-items:center;padding:4rem 0}
  .steps{grid-template-columns:repeat(3,1fr)}
  .cat-grid{grid-template-columns:repeat(4,1fr)}
  .reasons{grid-template-columns:repeat(3,1fr)}
}