/* MindCare Therapy – minimal, accessible design */
:root{ --bg:#0e1117; --card:#121826; --muted:#a8b3cf; --fg:#f6f7fb; --accent:#7cc4ff; --accent2:#b8f1da; --max:1080px; --gap:1rem; }
*{ box-sizing:border-box }
html:focus-within{ scroll-behavior:smooth }
body{ margin:0; font:16px/1.6 "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color:var(--fg); background: radial-gradient(1200px 600px at 10% -10%, #162138 0%, transparent 60%), radial-gradient(900px 500px at 100% 0%, #0b1929 0%, transparent 50%), var(--bg);}
.container{ max-width:var(--max); margin:0 auto; padding:2rem var(--gap) }
header{ padding-top:2rem }
nav{ display:grid; grid-template-columns:auto 1fr auto; gap:1rem; align-items:center }
.brand{ display:flex; align-items:center; gap:.6rem; text-decoration:none; color:var(--fg); font-weight:800 }
.logo{ width:36px; height:36px; border-radius:9px; background:linear-gradient(135deg,var(--accent),var(--accent2)); display:inline-block }
#menuBtn{ display:none; padding:.5rem .7rem; border-radius:10px; background:#0b1426; border:1px solid #1b2641; color:var(--fg) }
.nav{ list-style:none; display:flex; gap:1rem; margin:0; padding:0 }
.nav a{ color:var(--fg); text-decoration:none; opacity:.9 }
.cta{ display:flex; gap:.6rem; align-items:center }
.btn{ display:inline-block; background:var(--accent); color:#04121e; padding:.7rem 1rem; border-radius:12px; font-weight:700; text-decoration:none; border:0; cursor:pointer }
.btn.secondary{ background:#0b1426; color:var(--fg); border:1px solid #1b2641 }

.hero{ padding:6rem var(--gap) 3rem; text-align:center }
.title{ font-size:clamp(2rem,4vw,3rem); margin:0 0 .6rem }
.subtitle{ color:var(--muted); max-width:60ch; margin:0 auto 1.2rem }
.badges{ display:flex; gap:.6rem; justify-content:center; flex-wrap:wrap; margin:1rem 0 }
.badge{ border:1px solid #253255; background:#0f1a31; color:#d3ddf3; padding:.4rem .6rem; border-radius:999px; font-size:.9rem }

.section{ margin:2rem 0 }
.grid{ display:grid; gap:var(--gap) }
.grid-3{ grid-template-columns:repeat(3,1fr) }
.grid-2{ grid-template-columns:repeat(2,1fr) }
.card{ background:var(--card); border:1px solid #1b2641; border-radius:16px; padding:1.2rem }
.card h3{ margin:.2rem 0 .4rem }
.muted{ color:var(--muted) }

.about img{ width:100%; max-height:360px; object-fit:cover; border-radius:16px; border:1px solid #1b2641 }

.fees table{ width:100%; border-collapse:separate; border-spacing:0; overflow:hidden; border-radius:12px; border:1px solid #1b2641 }
.fees th, .fees td{ padding:.75rem 1rem; text-align:left }
.fees tr:nth-child(odd){ background:#0f1a31 }

details{ background:#0f1a31; border:1px solid #1b2641; border-radius:12px; padding:.8rem 1rem }
summary{ cursor:pointer; font-weight:600 }

.contact form{ display:grid; gap:.8rem }
label{ display:grid; gap:.3rem; font-weight:600 }
input, textarea{ padding:.7rem .8rem; border-radius:10px; border:1px solid #1b2641; background:#0e1526; color:var(--fg) }
.contact aside{ background:#0f1a31; border:1px solid #1b2641; border-radius:12px; padding:1rem }

.notice{ margin-top:1rem; font-size:.95rem; color:#e5e9f7 }
.notice strong{ color:#fff }

footer{ border-top:1px solid #1b2641; margin-top:3rem }
.footgrid{ display:grid; gap:1rem; grid-template-columns:2fr 1fr 1fr }
.footgrid a{ color:var(--muted); text-decoration:none }
.legal{ opacity:.85; text-align:center }

.cookie{ position:fixed; inset:auto 1rem 1rem 1rem; background:#101828; border:1px solid #1b2641; border-radius:12px; padding:1rem; display:none }

@media (max-width: 900px){
  .grid-3{ grid-template-columns:1fr }
  .grid-2{ grid-template-columns:1fr }
  .nav{ display:none }
  #menuBtn{ display:inline-block }
  .nav.show{ display:flex; flex-direction:column; align-items:flex-start }
  .hero{ padding:4rem var(--gap) 2rem }
  .footgrid{ grid-template-columns:1fr }
}