:root{
  --bg:#f6f8fb;
  --card:#ffffff;
  --card2:#eef4f8;
  --text:#162033;
  --muted:#5e6b7d;
  --muted2:#7d8896;
  --border:#dce4ec;
  --accent:#1170ad;
  --accent2:#0b4d78;
  --deep:#123e66;
  --max:1180px;
  --radius:8px;
  --shadow:0 12px 30px rgba(22,32,51,.10);
  --font:ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

*{
  box-sizing:border-box;
}

html{
  background:var(--bg);
}

body{
  margin:0;
  background:var(--bg) !important;
  color:var(--text) !important;
  font-family:var(--font) !important;
  line-height:1.55;
}

a{
  color:inherit;
}

.container{
  max-width:var(--max) !important;
  margin:0 auto;
  padding-left:28px !important;
  padding-right:28px !important;
}

header{
  position:sticky;
  top:0;
  z-index:20;
  background:#fff !important;
  border-bottom:1px solid var(--border) !important;
  box-shadow:0 2px 12px rgba(22,32,51,.04) !important;
  backdrop-filter:none !important;
}

.nav{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:22px !important;
  min-height:84px !important;
  padding:12px 0 !important;
}

.brand{
  display:flex !important;
  align-items:center !important;
  flex-shrink:0;
  gap:10px !important;
  min-height:auto !important;
}

.brand > a{
  display:block;
  flex-shrink:0;
  line-height:0;
  padding:6px 8px !important;
  border-radius:8px !important;
  background:#0e1828 !important;
}

.site-logo{
  display:block !important;
  width:144px !important;
  height:70px !important;
  object-fit:contain !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

.brand > div > div:first-child{
  color:var(--accent) !important;
  font-size:13px !important;
  font-weight:800 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
}

.brand > div > div:last-child{
  color:var(--text) !important;
  font-size:17px !important;
  font-weight:850 !important;
  margin-top:-2px !important;
}

.navlinks{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  flex:1 1 auto;
  min-width:0;
  gap:4px !important;
  flex-wrap:nowrap !important;
}

.navlinks a{
  flex-shrink:0;
  padding:10px 9px !important;
  border:1px solid transparent !important;
  border-radius:6px !important;
  color:var(--muted) !important;
  font-size:13px !important;
  font-weight:700 !important;
  line-height:1.2;
  text-decoration:none !important;
  white-space:nowrap;
}

.navlinks a:hover{
  color:var(--text) !important;
  background:var(--card2) !important;
  border-color:transparent !important;
  text-decoration:none !important;
}

main.container{
  padding-top:0 !important;
}

.card,
details{
  background:#fff !important;
  border:1px solid var(--border) !important;
  border-radius:var(--radius) !important;
  box-shadow:var(--shadow) !important;
}

.hero,
.blog-hero{
  display:grid !important;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.78fr) !important;
  align-items:stretch !important;
  gap:28px !important;
  padding:46px 0 30px !important;
}

.blog-hero{
  display:block !important;
}

.hero-main,
.blog-card{
  padding:34px !important;
}

.hero-main{
  background:#fff !important;
}

.kicker,
.blog-kicker{
  display:block !important;
  width:auto !important;
  margin:0 0 14px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--accent) !important;
  font-size:13px !important;
  font-weight:850 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
}

h1,
.blog-title{
  margin:0 0 16px !important;
  color:#111827 !important;
  font-size:46px !important;
  line-height:1.06 !important;
  letter-spacing:0 !important;
}

h2,
.section-title{
  color:#111827 !important;
  letter-spacing:0 !important;
}

.section-title{
  margin:0 0 18px !important;
  font-size:28px !important;
  line-height:1.2 !important;
}

.sub,
.blog-sub,
.blog-p{
  color:var(--muted) !important;
}

.sub,
.blog-sub{
  max-width:70ch;
  margin:0 0 13px !important;
  font-size:17px !important;
}

.sub strong{
  color:var(--text);
}

.cta-row{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin:22px 0 0 !important;
}

.btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:46px !important;
  padding:12px 18px !important;
  border:1px solid var(--border) !important;
  border-radius:6px !important;
  background:#fff !important;
  color:var(--text) !important;
  font-weight:800 !important;
  text-decoration:none !important;
  box-shadow:0 2px 8px rgba(22,32,51,.05) !important;
}

.btn:hover{
  background:var(--card2) !important;
  text-decoration:none !important;
}

.btn.primary{
  background:var(--accent) !important;
  border-color:var(--accent) !important;
  color:#fff !important;
}

.btn.primary:hover{
  background:var(--accent2) !important;
  border-color:var(--accent2) !important;
  transform:none !important;
  box-shadow:0 2px 8px rgba(22,32,51,.05) !important;
}

.bullets{
  display:grid !important;
  grid-template-columns:repeat(2,1fr) !important;
  gap:1px !important;
  margin-top:28px !important;
  overflow:hidden;
  border:1px solid var(--border) !important;
  border-radius:var(--radius) !important;
  background:var(--border) !important;
  box-shadow:0 4px 16px rgba(22,32,51,.05) !important;
}

.pill{
  min-height:86px;
  padding:16px !important;
  border:0 !important;
  border-radius:0 !important;
  background:#fff !important;
  color:var(--muted) !important;
  font-size:14px !important;
}

.pill strong{
  display:block;
  margin-bottom:3px;
  color:var(--text) !important;
  font-size:15px;
}

.hero-side{
  align-self:start;
  padding:22px !important;
  background:var(--deep) !important;
  border-color:var(--deep) !important;
  border-radius:10px !important;
  color:#fff !important;
  box-shadow:var(--shadow) !important;
}

.hero-side:has(img){
  position:relative;
  align-self:stretch;
  min-height:520px;
  padding:0 !important;
  overflow:hidden;
  background:#182335 !important;
}

.hero-side img{
  display:block;
  width:100%;
  height:100%;
  min-height:520px;
  object-fit:cover;
}

.sidebox{
  margin:0 0 12px !important;
  padding:16px !important;
  border:1px solid rgba(255,255,255,.18) !important;
  border-radius:8px !important;
  background:rgba(255,255,255,.94) !important;
  color:var(--text) !important;
  box-shadow:0 8px 20px rgba(0,0,0,.12) !important;
}

.hero-side:not(:has(img)) .sidebox:last-child{
  margin-bottom:0 !important;
}

.sidebox h3{
  margin:0 0 6px !important;
  color:var(--accent2) !important;
  font-size:12px !important;
  font-weight:850 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase;
}

.bigline{
  margin:0 0 4px !important;
  color:var(--text) !important;
  font-size:17px !important;
  line-height:1.25 !important;
}

.smallline{
  margin:0 !important;
  color:var(--muted) !important;
  font-size:14px !important;
  line-height:1.45 !important;
}

section{
  padding:30px 0 !important;
}

.service-grid,
.city-grid,
.symptom-grid,
.process-grid,
.pricing-grid,
.listgrid,
.blog-nav-grid,
.meetup-grid,
.grid{
  display:grid !important;
  gap:16px !important;
}

.service-grid,
.pricing-grid,
.grid{
  grid-template-columns:repeat(3,1fr) !important;
}

.city-grid,
.symptom-grid,
.process-grid{
  grid-template-columns:repeat(4,1fr) !important;
}

.listgrid,
.blog-nav-grid{
  grid-template-columns:repeat(2,1fr) !important;
}

.meetup-grid{
  grid-template-columns:repeat(3,1fr) !important;
  gap:0 !important;
  align-items:stretch !important;
}

.meetup-grid .card{
  border-radius:0 !important;
  box-shadow:none !important;
  min-height:220px;
}

.meetup-grid .card + .card{
  margin-left:-1px;
}

.meetup-grid .card:first-child{
  border-radius:8px 0 0 8px !important;
}

.meetup-grid .card:last-child{
  border-radius:0 8px 8px 0 !important;
}

.service-card,
.city-card,
.symptom-btn,
.process-step,
.pricecard,
.blog-nav-card{
  background:#fff !important;
  border:1px solid var(--border) !important;
  border-radius:8px !important;
  box-shadow:0 4px 14px rgba(22,32,51,.04) !important;
  text-decoration:none !important;
}

.service-card,
.pricecard,
.blog-nav-card{
  min-height:170px;
  padding:22px !important;
}

.service-card:hover,
.city-card:hover,
.symptom-btn:hover,
.blog-nav-card:hover{
  background:#fff !important;
  border-color:#9fc7df !important;
  box-shadow:0 12px 24px rgba(22,32,51,.10) !important;
  transform:translateY(-2px);
  text-decoration:none !important;
}

.service-card-top{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  margin-bottom:10px !important;
}

.service-card svg,
.city-card svg,
.symptom-btn svg{
  color:var(--accent) !important;
}

.service-card h3,
.blog-nav-title{
  margin:0 0 8px !important;
  color:var(--text) !important;
  font-size:18px !important;
  line-height:1.25 !important;
}

.service-card p,
.blog-nav-text,
.tile p,
.process-step p,
.pricecard p{
  margin:0;
  color:var(--muted) !important;
  font-size:15px;
}

.tile{
  padding:24px !important;
}

.tile h3,
.tile h4,
.pricecard h4,
.process-step h3{
  margin:0 0 7px !important;
  color:var(--text) !important;
  font-size:18px !important;
  line-height:1.25 !important;
}

.city-card,
.symptom-btn{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  min-height:60px;
  padding:15px 14px !important;
  color:var(--text) !important;
  font-weight:800 !important;
  text-align:left !important;
}

.process-step{
  padding:22px !important;
}

.process-step .step-num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  margin-bottom:10px;
  border-radius:999px;
  background:var(--deep) !important;
  color:#fff !important;
  font-weight:800;
}

.price{
  color:var(--accent2) !important;
}

details{
  padding:18px 20px !important;
  color:var(--muted) !important;
}

summary{
  color:var(--text) !important;
  font-weight:800;
  cursor:pointer;
}

pre,
.codebox{
  border-radius:8px !important;
  background:#111827 !important;
  color:#f8fafc !important;
}

.emphasis-card,
.blog-callout{
  padding:34px !important;
  background:var(--deep) !important;
  border-color:var(--deep) !important;
  color:#fff !important;
}

.emphasis-card .section-title,
.emphasis-card .sub,
.blog-callout .blog-p,
.blog-callout li{
  color:#fff !important;
}

footer{
  margin-top:28px !important;
  padding:26px 0 34px !important;
  border-top:1px solid var(--border) !important;
  color:var(--muted2) !important;
}

footer a{
  color:var(--muted) !important;
}

footer a:hover{
  color:var(--text) !important;
  text-decoration:none !important;
}

.fineprint{
  color:var(--muted2) !important;
}

@media (max-width:1100px){
  h1,
  .blog-title{
    font-size:40px !important;
  }

  .hero{
    grid-template-columns:1fr !important;
  }

  .service-grid,
  .pricing-grid,
  .grid,
  .city-grid,
  .symptom-grid,
  .process-grid,
  .meetup-grid{
    grid-template-columns:repeat(2,1fr) !important;
  }

  .navlinks a{
    padding:8px 6px !important;
    font-size:12px !important;
  }
}

@media (max-width:760px){
  .container{
    padding-left:18px !important;
    padding-right:18px !important;
  }

  .nav{
    align-items:flex-start !important;
    flex-direction:column !important;
    gap:10px !important;
  }

  .site-logo{
    width:115px !important;
    height:56px !important;
  }

  .brand > div > div:first-child,
  .brand > div > div:last-child{
    display:block !important;
  }

  .navlinks{
    width:100%;
    justify-content:flex-start !important;
    overflow-x:auto;
    padding-bottom:6px;
  }

  h1,
  .blog-title{
    font-size:32px !important;
  }

  .hero,
  .blog-hero{
    padding-top:28px !important;
    gap:22px !important;
  }

  .hero-main,
  .blog-card{
    padding:24px !important;
  }

  .bullets,
  .service-grid,
  .pricing-grid,
  .grid,
  .city-grid,
  .symptom-grid,
  .process-grid,
  .listgrid,
  .blog-nav-grid,
  .meetup-grid{
    grid-template-columns:1fr !important;
  }

  .meetup-grid{
    gap:12px !important;
  }

  .meetup-grid .card,
  .meetup-grid .card:first-child,
  .meetup-grid .card:last-child{
    border-radius:8px !important;
    min-height:auto;
  }

  .meetup-grid .card + .card{
    margin-left:0;
  }

  .hero-side:has(img),
  .hero-side img{
    min-height:360px;
  }
}
