/* =========================
   /services/web-development/ — Unified Dark Theme
   ========================= */
body.page-slug-web-development{
  /* Global palette */
  --wd-bg:#0b0e14;
  --wd-panel:#111520;
  --wd-border:#1c2333;
  --wd-text:#e6edf7;
  --wd-muted:#8ea0b6;
  --wd-brand:#4f8cff;
  --wd-brand-2:#00c2a8;
  --wd-shadow:0 10px 30px rgba(0,0,0,.35);

  /* Estimator palette */
  --est-bg:#0a1020;
  --est-panel:#101a2e;
  --est-border:#203251;
  --est-title:#eaf2ff;
  --est-btn-bg:#ffffff;
  --est-btn-text:#0b0e14;
  --est-btn-border:#cfe3ff;
  --est-btn-alt-bg:#e9fff8;
  --est-btn-alt-border:#b7f1e7;

  color:var(--wd-text);
  background:var(--wd-bg);
}

/* ------- Hero ------- */
body.page-slug-web-development .wd-hero{
  background:linear-gradient(180deg,#0b0e14 0%,#0c1220 100%);
  padding:72px 0;
}
body.page-slug-web-development .wd-title-gradient{
  background:linear-gradient(90deg,var(--wd-brand),var(--wd-brand-2));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* ------- Cards / Badges / Buttons ------- */
#wd-scope .ls-card{background:var(--wd-panel);border:1px solid var(--wd-border);border-radius:14px;box-shadow:var(--wd-shadow);padding:18px}
#wd-scope .ls-badge{display:inline-block;padding:6px 10px;border-radius:999px;background:#1a2235;color:#c9d6ea;font-size:.85rem}

/* Buttons (independent of Bootstrap) */
#wd-scope .ls-btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border-radius:12px;font-weight:700;border:1px solid var(--est-btn-border);background:var(--est-btn-bg);color:var(--est-btn-text);text-decoration:none}
#wd-scope .ls-btn:hover{filter:brightness(1.03);transform:translateY(-1px);text-decoration:none}
#wd-scope .ls-btn-alt{background:var(--est-btn-alt-bg);border-color:var(--est-btn-alt-border)}
#wd-scope .ls-btn-ghost{background:transparent;color:var(--wd-text);border:1px solid #2b3347}

/* KPIs */
#wd-scope .wd-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
#wd-scope .wd-kpis .ls-card{text-align:center}
#wd-scope .wd-kpis .n{font-size:1.6rem;font-weight:800}

/* Packages */
#wd-scope .wd-packages .ls-card h3{margin:0 0 8px}

/* =========================
   INSTANT ESTIMATE (High-contrast)
   ========================= */
body.page-slug-web-development #estimator{ 
  color-scheme:dark;
  background:linear-gradient(180deg,var(--est-bg),#0b1124);
}
body.page-slug-web-development #estimator h2{color:var(--est-title)}
body.page-slug-web-development #estimator .ls-card{
  background:var(--est-panel);border:1px solid var(--est-border)
}

/* Make ALL texts readable */
body.page-slug-web-development #estimator h2,
body.page-slug-web-development #estimator p,
body.page-slug-web-development #estimator label,
body.page-slug-web-development #estimator .form-label,
body.page-slug-web-development #estimator .form-check-label,
body.page-slug-web-development #estimator small,
body.page-slug-web-development #estimator .ls-hint,
body.page-slug-web-development #estimator .text-secondary{
  color:#ffffff !important; opacity:.96;
}

/* Inputs / selects */
body.page-slug-web-development #estimator .form-control,
body.page-slug-web-development #estimator .form-select{
  background:#0f1523;border:1px solid #2a3960;color:#ffffff !important;border-radius:10px;
}
body.page-slug-web-development #estimator .form-control::placeholder{color:#d6e4ff;opacity:.85}
body.page-slug-web-development #estimator .form-control:disabled,
body.page-slug-web-development #estimator .form-select:disabled{
  color:#c7d5f1 !important;background:#0c1220;opacity:.85
}
body.page-slug-web-development #estimator .form-control:focus,
body.page-slug-web-development #estimator .form-select:focus{
  outline:2px solid var(--wd-brand-2);box-shadow:0 0 0 3px rgba(0,194,168,.18)
}

/* Checkboxes / radios */
body.page-slug-web-development #estimator input[type="checkbox"],
body.page-slug-web-development #estimator input[type="radio"]{
  accent-color:var(--wd-brand-2);
}
body.page-slug-web-development #estimator .form-check-input{border-color:#3b4e7a}
body.page-slug-web-development #estimator .form-check-input:checked{
  background-color:var(--wd-brand-2);border-color:var(--wd-brand-2)
}

/* Output box */
body.page-slug-web-development #estimator #estimate-output{
  color:#ffffff !important;background:#0b1426;border:1px dashed #2d3f69;border-radius:12px;padding:14px
}

/* Buttons inside estimator (light buttons with dark text) */
body.page-slug-web-development #estimator .ls-btn{background:var(--est-btn-bg);color:var(--est-btn-text);border-color:var(--est-btn-border)}
body.page-slug-web-development #estimator .ls-btn.ls-btn-alt{background:var(--est-btn-alt-bg);border-color:var(--est-btn-alt-border);color:#0b0e14}

/* ------- Process ------- */
#wd-scope .wd-step .i{font-weight:800;color:#bcd4ff}

/* ------- Responsive ------- */
@media (max-width:980px){
  #wd-scope .wd-kpis{grid-template-columns:repeat(2,1fr)}
}