/* Overrides moved from inline <style> blocks */
:root{
  --brand-blue:#1F6FEB;
  --brand-blue-soft:#EAF2FF;
  --brand-green:#22C55E;
  --ink:#0F172A;
  --muted:#475569;
  --border:#E2E8F0;
  --card:#FFFFFF;
  --bg:#F7FAFF;
}
body{ background:var(--bg); color:var(--ink); }
.card, .toggle-card, .service-card{
  background:var(--card);
  border:1px solid var(--border);
  box-shadow:0 8px 24px rgba(15,23,42,0.06);
}
.toggle-head{
  border-top:4px solid var(--brand-blue);
  background:linear-gradient(180deg, var(--brand-blue-soft), #ffffff);
}
.card-title, h1, h2, h3, h4{ color:var(--ink); }
.help, .sub{ color:var(--muted); }
.price-badge{
  background:rgba(34,197,94,0.12);
  color:#166534;
  border:1px solid rgba(34,197,94,0.25);
}
.btn.primary{
  background:var(--brand-blue);
  border-color:var(--brand-blue);
}
.btn.secondary{
  background:var(--brand-blue-soft);
  color:var(--brand-blue);
  border-color:rgba(31,111,235,0.35);
}
input[type="checkbox"]{ accent-color:var(--brand-blue); }
input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible{
  outline:2px solid rgba(31,111,235,0.45);
  outline-offset:2px;
}
#card-rugs .card{
  transition:transform .12s ease, border-color .12s ease, box-shadow .12s ease;
}
#card-rugs .card:hover{
  border-color:#CBD5E1;
  transform:translateY(-1px);
  box-shadow:0 10px 26px rgba(15,23,42,0.08);
}

.hero-proof-img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  object-position:center;
}
.hero-proof-text{
  color:var(--ink);
}
@media (max-width: 768px){
  .hero-proof-inner{
    align-items:flex-start;
  }
}
@media (max-width: 640px){
  .hero-media{ aspect-ratio:4 / 3; }
}

@media (min-width: 1024px){
  .container,
  .wrap,
  main .content,
  .page,
  .page-wrap{
    max-width:1160px;
    margin:0 auto;
    padding-left:24px;
    padding-right:24px;
  }

  .hero .btn.primary,
  .hero .primary-cta,
  .hero a.btn-primary,
  .hero button.btn-primary{
    width:100%;
    max-width:780px;
    margin-left:auto;
    margin-right:auto;
  }

  body[data-page="services"] .grid.cols-3{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:20px;
    align-items:stretch;
  }
}