
/* Base Reset */
*{box-sizing:border-box}
:root{
  --brand:#0f766e; /* teal-700 */
  --accent:#84cc16; /* lime-500 */
  --bg:#0b1114;
  --text:#e6f3ef;
  --muted:#9fb8b2;
}
html,body{margin:0;padding:0;background:#ffffff;color:#0b1114;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;line-height:1.6}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:24px}
.header{position:sticky;top:0;background:#fff;border-bottom:1px solid #e5e7eb;z-index:10}
.nav{display:flex;align-items:center;gap:18px}
.nav img{height:44px}
.nav-links{margin-left:auto;display:flex;gap:16px}
.btn{display:inline-block;padding:12px 18px;border-radius:12px;border:1px solid var(--brand);color:#fff;background:var(--brand);font-weight:600}
.btn.secondary{background:transparent;color:var(--brand)}
.hero{background:linear-gradient(180deg, #e6f7f4, #ffffff);padding:64px 0;border-bottom:1px solid #eef2f7}
.hero h1{font-size:40px;line-height:1.1;margin:0 0 12px}
.hero p{max-width:800px;font-size:18px;color:#334155}
.grid{display:grid;gap:18px}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{border:1px solid #e5e7eb;border-radius:16px;padding:18px;background:#fff;box-shadow:0 1px 1px rgba(0,0,0,0.03)}
.footer{background:#0b1114;color:#cfe6e0;padding:40px 0;margin-top:64px}
.footer a{color:#cfe6e0}

/* Before/After Slider */
.ba-slider{position:relative;overflow:hidden;border-radius:16px;border:1px solid #e5e7eb}
.ba-before img,
.ba-after img{display:block;width:100%;height:auto;user-select:none;pointer-events:none}
.ba-after{position:absolute;inset:0}
.ba-after img{position:absolute;inset:0}
.ba-handle{position:absolute;top:0;bottom:0;width:3px;background:var(--accent);box-shadow:0 0 0 2px rgba(255,255,255,0.9)}
.ba-slider input[type="range"]{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:ew-resize}
.badge{display:inline-block;background:#ecfeff;color:#0b7285;border:1px solid #99f6e4;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700}
.section{padding:48px 0}
h2{margin-top:0}
ul.checks{list-style:none;padding:0;margin:0}
ul.checks li{padding-left:28px;position:relative;margin:8px 0}
ul.checks li:before{content:'✓';position:absolute;left:0;top:0;color:var(--accent);font-weight:900}
label{display:block;margin-bottom:6px;font-weight:600}
input,select,textarea{width:100%;padding:12px;border:1px solid #e5e7eb;border-radius:10px}
form .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
