
:root {
  --brand:#0EA5E9; --navy:#0B1020; --teal:#14B8A6;
  --gray50:#F8FAFC; --coral:#FB923C;
  --ink:#0f172a; --muted:#64748b;
}
*{box-sizing:border-box} html,body{margin:0;padding:0}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;line-height:1.6;color:var(--ink);background:#fff}
a{color:var(--brand);text-decoration:none} a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:0 1.2rem}
.site-header{position:sticky;top:0;background:#fff;border-bottom:1px solid #e5e7eb;z-index:10}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{font-weight:700;display:flex;align-items:center;gap:.5rem;color:inherit}
.logo-mark{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:6px;background:var(--brand);color:#fff;font-weight:900}
.nav{display:flex;gap:1rem;align-items:center}
.nav a{padding:.4rem .6rem;border-radius:.4rem}
.btn{display:inline-block;padding:.6rem 1rem;border-radius:.5rem;background:var(--brand);color:#fff;font-weight:600;border:1px solid var(--brand)}
.btn.ghost{background:#fff;color:var(--brand);border-color:var(--brand)}
.hero{position:relative;background:linear-gradient(180deg,var(--gray50), #fff);border-bottom:1px solid #e5e7eb;overflow:hidden}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.2;pointer-events:none}
.hero-inner{position:relative;padding:4rem 0;text-align:center}
.lead{font-size:1.125rem;color:var(--muted);max-width:60ch;margin:0 auto 1rem}
.cta-row{display:flex;gap:.8rem;justify-content:center;margin:1rem 0 2rem}
.hero-badges{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center}
.hero-badges span{font-size:.9rem;background:#f1f5f9;border:1px solid #e2e8f0;padding:.3rem .6rem;border-radius:.5rem}
.features.three{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;padding:2rem 0}
.feature{border:1px solid #e5e7eb;border-radius:.8rem;padding:1rem;background:#fff;text-align:center}
.icon{width:40px;height:40px;display:block;margin:0 auto .6rem}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;padding:2rem 0}
.card{border:1px solid #e5e7eb;border-radius:.8rem;padding:1rem;background:#fff}
.card-img{width:100%;height:120px;object-fit:cover;border-radius:.6rem;margin-bottom:.6rem;background:var(--gray50)}
.price{font-weight:800;font-size:1.2rem;margin-top:.6rem}
.prose{padding:2rem 0;max-width:75ch}
.muted{color:var(--muted)} .small{font-size:.9rem}
.site-footer{border-top:1px solid #e5e7eb;background:#f8fafc;margin-top:2rem}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:1rem;padding:2rem 0}
.table-wrap{padding:1rem 0;position:relative}
.roi-bg{position:absolute;right:0;top:-10px;width:260px;opacity:.25}
.table-scroll{overflow-x:auto}
.table{width:100%;border-collapse:collapse}
.table th,.table td{border:1px solid #e5e7eb;padding:.6rem;text-align:left}
.table th{background:#f8fafc}
.nav-toggle{display:none;flex-direction:column;gap:6px;background:transparent;border:0}
.nav-toggle .bar{width:24px;height:2px;background:#0f172a;border-radius:2px}
@media (max-width: 860px){
  .nav{display:none;position:absolute;top:64px;right:0;left:0;background:white;border-bottom:1px solid #e5e7eb;flex-direction:column;padding:1rem}
  .nav a{padding:.8rem 1rem}
  .nav.show{display:flex}
  .nav-toggle{display:flex}
  .features.three{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
}
.contact-form{display:grid;gap:.8rem;max-width:520px}
.contact-form input,.contact-form textarea{width:100%;padding:.6rem .7rem;border:1px solid #cbd5e1;border-radius:.5rem}
.contact-form input:focus,.contact-form textarea:focus{outline:2px solid rgba(14,165,233,.35);border-color:var(--brand)}
.price-grid{display:grid;gap:1rem;grid-template-columns:repeat(2,1fr)}
.price-card{border:1px solid #e5e7eb;border-radius:.8rem;padding:1rem;background:#fff}
@media(max-width:900px){.price-grid{grid-template-columns:1fr}}
.contact-section{padding-top:0}
.contact-grid{display:grid;grid-template-columns:1fr 340px;gap:2rem;align-items:center}
.contact-art{width:100%}
.blog-list{list-style:none;padding-left:0}
.blog-list li{margin-bottom:.6rem}

.roi-photo{width:100%;border-radius:.6rem;margin:.6rem 0;display:block;opacity:.9}
.blog-hero{width:100%;border-radius:.8rem;margin:1rem 0}
.hero .hero-bg{object-fit:cover}

/* Inline SVG accents */
.hero-accent{position:absolute;left:0;right:0;top:0;height:360px;width:100%;pointer-events:none}
.icon-accent{display:block;margin:0 auto .6rem}
.card-accent{height:60px;margin:-.4rem -.4rem .6rem;border-radius:.6rem;overflow:hidden}
.card{position:relative;padding-top:.6rem}
.roi-accent{width:100%;height:80px;margin:.2rem 0 .6rem;display:block}
.contact-accent{width:100%;max-width:340px;margin:0 auto}
/* Tidy spacing after removing images */
.cards .card h4{margin-top:.2rem}

.hidden{display:none}

/* --- Icon fixes --- */
.features.three .feature{position:relative;text-align:center;padding-top:1.2rem}
.icon-wrap{display:inline-grid;place-items:center;width:56px;height:56px;border-radius:14px;background:#ffffff;border:1px solid #e5e7eb;box-shadow:0 1px 2px rgba(2,6,23,.04)}
.icon-wrap .icon-svg{display:block}
.features.three .feature h3{margin-top:.6rem}
