* { box-sizing: border-box; }
:root {
  --bg: #F8FAFC;
  --surface: #FFFFFF;
  --text: #0F172A;
  --muted: #475569;
  --primary: #1E3A8A;
  --primary-dark: #172E6D;
  --accent: #0F766E;
  --line: #E2E8F0;
  --ok: #0F766E;
  --error: #B91C1C;
  --radius: 22px;
  --shadow: 0 20px 40px rgba(15, 23, 42, 0.06);
  --container: 1160px;
  --header-h: 78px;
}
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, Manrope, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
  line-height: 1.65;
}
a { color: var(--primary); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid rgba(30,58,138,.35);
  outline-offset: 2px;
}
.container { width: min(var(--container), calc(100% - 2rem)); margin-inline: auto; }

.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(248,250,252,.96);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
.header-inner { min-height: var(--header-h); display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand { display:flex; align-items:center; gap:.7rem; text-decoration:none; color:var(--text); }
.brand-mark {
  width: 42px; height: 42px; border-radius: 12px; display:grid; place-items:center;
  background: linear-gradient(145deg, var(--primary), #304fa5); color:#fff; font-weight:800; font-size:.84rem;
}
.brand-text { display:grid; line-height:1.2; }
.brand-text strong { font-size:.97rem; }
.brand-text small { font-size:.78rem; color:var(--muted); font-weight:600; }

.menu-toggle {
  display:none; width:44px; height:44px; border:1px solid var(--line); border-radius:12px; background:#fff; cursor:pointer;
}
.menu-toggle span { display:block; width:18px; height:2px; margin:4px auto; background:var(--text); transition:.2s; }

.header-panel { display:flex; align-items:center; gap:1.1rem; }
.menu { display:flex; align-items:center; gap:1rem; }
.menu a { color:var(--muted); text-decoration:none; font-weight:600; font-size:.93rem; padding:.25rem .35rem; border-radius:8px; }
.menu a:hover { color:var(--primary); background:#EEF2FF; }
.header-actions { display:flex; align-items:center; gap:.6rem; }

.btn {
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:14px; border:1px solid transparent; text-decoration:none;
  font-weight:700; padding:.82rem 1.08rem; min-height:48px; cursor:pointer; transition:.18s ease;
}
.btn:hover { transform: translateY(-1px); }
.btn.primary { background:var(--primary); color:#fff; }
.btn.primary:hover { background:var(--primary-dark); }
.btn.ghost { background:#fff; color:var(--text); border-color:var(--line); }
.btn.ghost:hover { border-color:#c7d2fe; }
.btn.ghost.accent { color:var(--accent); border-color:#99F6E4; background:#F0FDFA; }
.btn-sm { min-height:38px; padding:.52rem .85rem; font-size:.86rem; }

.hero { padding: 2.5rem 0 1.5rem; }
.hero-grid { display:grid; grid-template-columns: 1.25fr .9fr; gap:1rem; align-items:stretch; }
.hero-main, .card, .doctor-card, .hero-card, .form, .about-card, .trust-item {
  background: var(--surface); border:1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow);
}
.hero-main { padding: clamp(1.45rem, 3vw, 2.2rem); }
.eyebrow { margin:0 0 .55rem; text-transform:uppercase; letter-spacing:.04em; font-size:.84rem; color:var(--primary); font-weight:800; }
h1 { margin:0; font-size: clamp(2rem, 4vw, 3.2rem); line-height:1.12; letter-spacing:-.02em; }
.lead { color:var(--muted); margin:1rem 0 0; font-size:clamp(1rem, 2.2vw, 1.08rem); max-width:62ch; }
.lead-secondary { margin-top:.65rem; }
.cta-row { margin-top:1.3rem; display:flex; flex-wrap:wrap; gap:.65rem; }

.hero-side { display:grid; gap:.85rem; }
.doctor-card { padding:1rem; display:flex; gap:.9rem; align-items:center; }
.doctor-photo { width:72px; height:72px; border-radius:18px; background:#EEF2FF; border:1px solid #C7D2FE; display:grid; place-items:center; font-weight:800; color:var(--primary); }
.doctor-name { margin:0; font-size:1rem; font-weight:800; }
.doctor-role, .doctor-meta { margin:.18rem 0 0; color:var(--muted); font-size:.9rem; }
.hero-card { padding:1rem 1.1rem; }
.hero-card h2 { margin:0 0 .7rem; font-size:1.2rem; }
.schedule-item + .schedule-item { margin-top:.65rem; padding-top:.65rem; border-top:1px dashed var(--line); }
.schedule-place { margin:0; color:var(--primary); font-weight:800; }
.schedule-city, .schedule-time { margin:.15rem 0 0; color:var(--muted); }

.trust-strip { margin-top:1rem; display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:.8rem; }
.trust-item { padding:.9rem 1rem; display:flex; align-items:center; gap:.55rem; font-weight:700; color:#1e293b; }
.trust-item::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--accent); flex-shrink:0; }

.section { padding: 3.2rem 0; }
.section.soft { background:#F1F5F9; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.section-head { margin-bottom:1rem; }
.section h2 { margin:0; font-size: clamp(1.55rem, 3.2vw, 2.1rem); letter-spacing:-.01em; }
.section-intro { margin:.45rem 0 0; color:var(--muted); max-width:75ch; }

.grid { display:grid; gap:.9rem; }
.services-grid, .grid-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.locations-grid, .education-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.tile-grid { align-items: stretch; }
.tile-grid .tile, .tile-grid .edu-card {
  display:flex; flex-direction:column; height:100%;
}
.tile-grid .tile p, .tile-grid .edu-card p { flex-grow:1; margin:0; }
.card { padding:1.15rem; }
.card h3, .edu-card h2 { margin:0 0 .55rem; font-size:1.12rem; }
.edu-card h2 { font-size:1.08rem; line-height:1.35; }
.card p, .card li { color:var(--muted); }
.card ul { margin:.2rem 0 0; padding-left:1rem; }
.section-cta-wrap { margin-top:1.2rem; text-align:center; }

.location-card { border-top:4px solid #BFDBFE; }
.location-card h2, .location-card h3 { margin:0 0 .55rem; font-size:1.12rem; }
.card h2 { margin:0 0 .55rem; font-size:1.12rem; }
.location-actions { margin-top:.8rem; display:flex; flex-wrap:wrap; gap:.55rem; }

.about-card { padding:1.25rem; }
.about-card p:last-of-type { margin-bottom:.8rem; }
.about-full h2 { margin:1.5rem 0 .6rem; font-size:1.25rem; }
.about-preview { text-align:center; }
.about-preview-inner { max-width:68ch; margin-inline:auto; }
.about-preview h2 { margin:0 0 .75rem; }
.about-preview p { color:var(--muted); margin:0 0 1.1rem; }
.page-content { max-width:78ch; }
.edu-disclaimer { margin-top:1rem; }
.about-tags { display:flex; flex-wrap:wrap; gap:.45rem; }
.about-tags span { background:#EEF2FF; color:#1e3a8a; border:1px solid #C7D2FE; border-radius:999px; padding:.25rem .58rem; font-size:.82rem; font-weight:700; }

.form { padding:1.15rem; }
.form-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:.8rem; }
label { display:grid; gap:.4rem; margin-bottom:.85rem; font-weight:600; }
label span { font-size:.92rem; }
input, select, textarea {
  width:100%; border:1px solid #CBD5E1; border-radius:12px; padding:.72rem .78rem; font:inherit; background:#fff;
}
textarea { resize:vertical; min-height:110px; }
.checkbox { grid-template-columns:auto 1fr; align-items:start; gap:.65rem; font-weight:500; }
.checkbox input { width:18px; height:18px; margin-top:.15rem; }
.disclaimer {
  border-left:4px solid var(--primary); background:#EFF6FF; color:#1e293b; border-radius:12px; padding:.85rem 1rem; margin-bottom:1rem;
}
.small { color:var(--muted); font-size:.9rem; margin:0 0 .85rem; }
.form-status { margin:.65rem 0 0; font-size:.92rem; font-weight:700; color:var(--muted); }
.form-status.success { color:var(--ok); }
.form-status.error { color:var(--error); }

.final-cta { text-align:center; }
.final-cta p { max-width:78ch; margin:.6rem auto 0; color:var(--muted); }
.final-cta .cta-row { justify-content:center; }

.site-footer {
  background:#0F172A; color:#94A3B8; padding:2.4rem 0 0;
}
.site-footer a { color:#BFDBFE; text-decoration:none; }
.site-footer a:hover { color:#fff; }
.footer-inner {
  display:grid; grid-template-columns: 1.2fr 1fr 1fr; gap:1.5rem;
  padding-bottom:1.8rem; border-bottom:1px solid rgba(148,163,184,.2);
}
.footer-name { margin:0; color:#F8FAFC; font-weight:700; font-size:1rem; }
.footer-spec { margin:.35rem 0 0; color:#CBD5E1; font-size:.92rem; }
.footer-note { margin:.25rem 0 0; font-size:.85rem; }
.footer-nav { display:flex; flex-direction:column; gap:.45rem; }
.footer-nav a { font-size:.92rem; font-weight:600; }
.footer-contact p { margin:0 0 .35rem; font-size:.92rem; }
.footer-bottom { padding:1rem 0 1.6rem; }
.footer-bottom p { margin:0; font-size:.82rem; color:#64748B; }

.mobile-cta {
  display:none; position:fixed; left:50%; transform:translateX(-50%); bottom:.8rem; z-index:90;
  width:min(420px,calc(100% - 1.2rem)); text-align:center; background:var(--primary); color:#fff;
  text-decoration:none; font-weight:800; border-radius:14px; padding:.9rem 1rem;
  box-shadow:0 14px 30px rgba(30,58,138,.35);
}

@media (max-width: 980px) {
  .menu-toggle { display:block; }
  .header-panel {
    position:fixed; inset:var(--header-h) 0 auto 0; background:#fff; border-bottom:1px solid var(--line);
    padding:1rem .75rem 1.1rem; flex-direction:column; align-items:stretch; gap:.9rem;
    transform:translateY(-120%); opacity:0; pointer-events:none; transition:.22s ease;
  }
  body.menu-open .header-panel { transform:translateY(0); opacity:1; pointer-events:auto; }
  body.menu-open .menu-toggle span:nth-child(1){ transform:translateY(6px) rotate(45deg);} 
  body.menu-open .menu-toggle span:nth-child(2){ opacity:0;} 
  body.menu-open .menu-toggle span:nth-child(3){ transform:translateY(-6px) rotate(-45deg);} 
  .menu { flex-direction:column; align-items:stretch; gap:.2rem; }
  .menu a { padding:.7rem .55rem; border-radius:10px; }
  .menu a:hover { background:#F1F5F9; }

  .hero-grid, .services-grid, .grid-3, .locations-grid, .education-grid, .form-grid, .trust-strip, .footer-inner { grid-template-columns:1fr; }
  .cta-row .btn { flex:1 1 calc(50% - .35rem); min-width:140px; }
  body { padding-bottom:5.3rem; }
  .mobile-cta { display:block; }
}

@media (max-width: 520px) {
  .container { width:min(var(--container), calc(100% - 1rem)); }
  .brand-text strong { font-size:.9rem; }
  .cta-row .btn { flex:1 1 100%; }
}
