:root { --bg:#fbfcff; --fg:#23233a; --muted:#5d5f7a; --line:#e0e3f1; --violet:#5b5ecf; --sky:#3fa9e6; --body:"Noto Sans Gujarati","Shruti","Nirmala UI",system-ui,sans-serif; color-scheme: light; }
* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--bg); color: var(--fg); font: 400 18px/1.85 var(--body); overflow-x: hidden; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--sky); outline-offset: 3px; border-radius: 4px; }
.wrap { max-width: 860px; margin: 0 auto; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.dark { position: relative; overflow: hidden; color: #ecedf8; background: radial-gradient(120% 90% at 85% 0%, #2a2d63 0%, #181a38 55%, #12132a 100%); }
.dark .orb { position: absolute; border-radius: 50%; filter: blur(26px); pointer-events: none; }
.o1 { width: 480px; height: 480px; right: -140px; top: -200px; background: linear-gradient(135deg, #4a4ea8, #2a74a6); opacity: .8; }
.o2 { width: 300px; height: 300px; right: 180px; top: 120px; background: #2a74a6; opacity: .45; }
header { padding-block: 22px; position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
header img { height: 52px; width: auto; display: block; }
.lang { color: #ecedf8; text-decoration: none; border: 1px solid #4a4d7a; border-radius: 999px; padding: 8px 16px; font: 500 14px/1 system-ui, sans-serif; }
.hero { position: relative; z-index: 1; padding-block: 36px 64px; }
h1 { font: 500 clamp(28px, 6vw, 46px)/1.35 var(--body); margin: 0 0 16px; text-wrap: balance; }
.hero p { margin: 0 0 28px; color: #c3c5de; max-width: 40ch; }
.btn { display: inline-block; text-decoration: none; background: linear-gradient(100deg, #8d90f2, #5fbaf0); color: #12132a; font: 600 17px/1.2 var(--body); padding: 16px 26px; border-radius: 999px; text-align: center; }
.btn.alt { background: transparent; color: var(--fg); border: 1px solid var(--line); font-weight: 500; }
.note { margin: 36px 0 8px; color: var(--muted); font-size: 16px; }
.list { padding-bottom: 8px; }
.list h3 { font: 600 17px/1.4 var(--body); color: var(--violet); margin: 36px 0 10px; }
.list details { border-bottom: 1px solid var(--line); }
.list h3 + details { border-top: 1px solid var(--line); }
.list summary { cursor: pointer; list-style: none; padding: 18px 40px 18px 0; font: 500 19px/1.6 var(--body); position: relative; }
.list summary::-webkit-details-marker { display: none; }
.list summary::after { content: "+"; position: absolute; right: 4px; top: 14px; font: 300 30px/1.2 system-ui, sans-serif; color: var(--violet); transition: transform .2s; }
.list details[open] summary::after { transform: rotate(45deg); }
.list details p { margin: 0 0 18px; color: var(--muted); }
.list details ul { margin: 0 0 20px; padding-left: 22px; color: var(--muted); display: grid; gap: 8px; }
.list details p + ul { margin-top: -6px; }
.clinic { margin-top: 56px; padding: 30px 26px; background: #f2f4fc; border-radius: 20px; display: grid; gap: 14px; }
.clinic h2 { font: 500 clamp(24px, 5vw, 32px)/1.4 var(--body); margin: 0; }
.clinic p { margin: 0; color: var(--muted); }
.clinic strong { color: var(--fg); font-weight: 500; }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
footer { padding-block: 36px 40px; color: var(--muted); font-size: 15px; display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: space-between; }
footer a { color: var(--violet); text-decoration: none; }
@media (max-width: 560px) {
  body { font-size: 17px; }
  header { padding-block: 14px; }
  header img { height: 38px; }
  .hero { padding-block: 20px 48px; }
  .btn { display: block; }
  .actions { flex-direction: column; }
  .clinic { padding: 24px 20px; border-radius: 16px; }
  .list summary { font-size: 18px; }
}
