/* =====================================================================
   SECTIONS — one block per section, all following the same pattern:
     .section            vertical spacing (+ --mist / --compact)
     .container-xl       Bootstrap container (max 1280px)
     .section-head       eyebrow + title + lead
     .<section>-…        the section's own parts (BEM: block__element)
   Brand colours: navy #0B2C55 · navy-900 #061A36 · teal #0E7C99 · mist #F3F7FA
   Breakpoints: sm 640 · md 768 · lg 1024 · xl 1280
   ===================================================================== */

/* ---------- Shared: section shell ---------- */
.section { padding: 5rem 0; }
.section--mist { background: #F3F7FA; }
@media (min-width: 1024px) {
  .section { padding: 7rem 0; }
  .section--compact { padding: 6rem 0; }
}

/* ---------- Shared: section heading ---------- */
.section-head--split { display: grid; gap: 1.5rem; align-items: end; }
.section-head--center { max-width: 42rem; margin: 0 auto; text-align: center; }
.section-title { margin-top: 1rem; font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 2.1rem; line-height: 1.25; color: #061A36; }
.section-lead { color: #475569; font-size: 1.125rem; line-height: 1.75rem; }
@media (min-width: 640px) { .section-title { font-size: 3rem; line-height: 1; } }
@media (min-width: 1024px) {
  .section-head--split { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .section-head--split .section-lead { max-width: 28rem; justify-self: end; }
}

/* ---------- Shared: pill button ---------- */
.btn-pill { display: inline-flex; align-items: center; gap: .5rem; padding: .625rem 1.25rem; border-radius: 9999px; font-size: .875rem; line-height: 1.25rem; font-weight: 600;
  transition: color .15s, background-color .15s, box-shadow .15s, transform .15s; }
.btn-pill svg { width: 1rem; height: 1rem; }
.btn-pill--navy { background: #0B2C55; color: #fff; }
.btn-pill--navy:hover { background: #123A6B; }


/* =====================================================================
   SYMPTOMS — "What are you feeling?"  (components/symptoms.php)
   ===================================================================== */
.symptom-grid { margin-top: 3rem; display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; }
@media (min-width: 400px)  { .symptom-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 640px)  { .symptom-grid { gap: 1.25rem; } }
@media (min-width: 1024px) { .symptom-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.symptom-tile { position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; min-height: 210px; padding: 1.25rem;
  background: #fff; border: 1px solid #E2E8F0; border-radius: 1.5rem;
  transition: transform .4s cubic-bezier(.22,1,.36,1), box-shadow .4s cubic-bezier(.22,1,.36,1), border-color .4s; }
.symptom-tile::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(150deg, #0B2C55 0%, #0E7C99 100%); opacity: 0; transition: opacity .35s ease; }

.symptom-tile__num { position: absolute; top: .75rem; right: 1.25rem; font: 800 3rem/1 'Poppins', sans-serif; letter-spacing: -.015em; color: #F1F5F9; }
.symptom-tile__icon { width: 3rem; height: 3rem; display: grid; place-items: center; border-radius: 1rem; background: #F0F8FB; color: #0E7C99; }
.symptom-tile__icon svg { width: 1.5rem; height: 1.5rem; }
.symptom-tile__title { margin-top: 1.25rem; font-family: 'Poppins', sans-serif; font-weight: 600; letter-spacing: -.015em; line-height: 1.375; color: #061A36; }
.symptom-tile__foot { margin-top: auto; padding-top: 1rem; display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.symptom-tile__label { font-size: .75rem; line-height: 1rem; color: #64748B; }
.symptom-tile__arrow { width: 2rem; height: 2rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 9999px; background: #F3F7FA; color: #0B2C55; }
.symptom-tile__arrow svg { width: 1rem; height: 1rem; }
.symptom-tile__num, .symptom-tile__icon, .symptom-tile__title, .symptom-tile__label, .symptom-tile__arrow { transition: all .35s ease; }

@media (min-width: 640px) {
  .symptom-tile { min-height: 240px; padding: 1.75rem; }
  .symptom-tile__icon { width: 3.5rem; height: 3.5rem; }
  .symptom-tile__icon svg { width: 1.75rem; height: 1.75rem; }
  .symptom-tile__title { font-size: 1.125rem; line-height: 1.75rem; }
  .symptom-tile__label { font-size: .875rem; line-height: 1.25rem; }
}
@media (max-width: 399px) { .symptom-tile { min-height: 0; } .symptom-tile__num { font-size: 2.25rem; } }
@media (min-width: 400px) and (max-width: 639px) { .symptom-tile { padding: 1rem; } .symptom-tile__num { font-size: 2rem; right: .75rem; } }

/* hover: tile fills with the navy→teal gradient */
.symptom-tile:hover { transform: translateY(-8px); box-shadow: 0 30px 60px -25px rgba(11,44,85,.55); border-color: transparent; }
.symptom-tile:hover::before { opacity: 1; }
.symptom-tile:hover .symptom-tile__title { color: #fff; }
.symptom-tile:hover .symptom-tile__label { color: rgba(255,255,255,.75); }
.symptom-tile:hover .symptom-tile__num { color: rgba(255,255,255,.12); }
.symptom-tile:hover .symptom-tile__icon { background: rgba(255,255,255,.15); color: #fff; }
.symptom-tile:hover .symptom-tile__arrow { background: #F5B82E; color: #061A36; transform: rotate(-45deg); }
.symptom-tile:active { transform: scale(.985); transition-duration: .1s; }

.symptoms-cta { margin-top: 2.5rem; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .75rem; text-align: center; }
.symptoms-cta__text { color: #475569; }
@media (min-width: 640px) { .symptoms-cta { flex-direction: row; } }


/* =====================================================================
   BOOKING — appointment section + form  (components/booking.php)
   ===================================================================== */
.booking { position: relative; overflow: hidden; background: linear-gradient(160deg, #EAF5FA 0%, #F5FAFD 55%, #E3F1F7 100%); }
.booking__dots { position: absolute; inset: 0; opacity: .6; pointer-events: none; background-image: radial-gradient(rgba(11,44,85,.08) 1px, transparent 1px); background-size: 24px 24px; }
.booking__ring { position: absolute; left: -8rem; bottom: -8rem; width: 420px; height: 420px; border-radius: 9999px; border: 1px solid rgba(14,124,153,.15); }
.booking__glow { position: absolute; right: -6rem; top: -6rem; width: 340px; height: 340px; border-radius: 9999px; background: radial-gradient(circle, rgba(14,124,153,.14), transparent 65%); }
.booking__grid { position: relative; display: grid; gap: 3rem; align-items: center; }
@media (min-width: 1024px) {
  .booking__grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .booking__intro { grid-column: span 5 / span 5; }
  .booking__form-col { grid-column: span 7 / span 7; }
}

/* left: doctor, heading, contact cards */
.booking__intro { color: #334155; }
.booking__doctor { display: flex; align-items: center; gap: 1rem; }
.booking__doctor-img { width: 4rem; height: 4rem; border-radius: 1rem; object-fit: cover; object-position: top;
  box-shadow: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1); }
.booking__doctor-name { font-family: 'Poppins', sans-serif; font-weight: 600; letter-spacing: -.015em; font-size: 1.125rem; line-height: 1.75rem; color: #061A36; }
.booking__doctor-role { font-size: .875rem; line-height: 1.25rem; color: #64748B; }
.booking__eyebrow { margin-top: 2.5rem; }
.booking__lead { margin-top: 1rem; }
.booking__contacts { margin-top: 2rem; }
.booking__contacts > * + * { margin-top: .75rem; }
.booking__contact { display: flex; align-items: center; gap: 1rem; padding: 1rem; border-radius: 1rem; background: #fff; border: 1px solid #E2E8F0;
  box-shadow: 0 1px 2px 0 rgba(0,0,0,.05); transition: border-color .15s, box-shadow .15s; }
.booking__contact:hover { border-color: #0E7C99; box-shadow: 0 4px 6px -1px rgba(0,0,0,.1), 0 2px 4px -2px rgba(0,0,0,.1); }
.booking__contact-icon { width: 3rem; height: 3rem; display: grid; place-items: center; border-radius: .75rem; background: #0B2C55; color: #fff; }
.booking__contact-icon--wa { background: #25D366; }
.booking__contact-icon svg { width: 1.25rem; height: 1.25rem; }
.booking__contact-label { display: block; font-size: .875rem; line-height: 1.25rem; color: #64748B; }
.booking__contact-value { font-family: 'Poppins', sans-serif; font-weight: 600; letter-spacing: -.015em; color: #061A36; }
.booking__note { margin-top: 2rem; display: flex; gap: .5rem; font-size: .875rem; line-height: 1.25rem; color: #64748B; }
.booking__note svg { width: 1rem; height: 1rem; flex-shrink: 0; margin-top: .125rem; }

/* right: the form */
.booking-form { padding: 1.5rem; background: #fff; border: 1px solid #E2E8F0; border-radius: 2rem; box-shadow: 0 40px 80px -40px rgba(11,44,85,.35); }
@media (min-width: 640px) { .booking-form { padding: 2.5rem; } }
.booking-form__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.75rem; }
.booking-form__title { font-family: 'Poppins', sans-serif; font-weight: 600; letter-spacing: -.015em; font-size: 1.5rem; line-height: 2rem; color: #061A36; }
.booking-form__badge { display: none; align-items: center; gap: .375rem; padding: .375rem .75rem; border-radius: 9999px; background: #F0F8FB; color: #0E7C99; font-size: .75rem; line-height: 1rem; font-weight: 700; }
.booking-form__badge svg { width: .875rem; height: .875rem; }
.booking-form__grid { display: grid; gap: 1.25rem; }
.booking-form__ptype { display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; }
@media (min-width: 640px) {
  .booking-form__badge { display: inline-flex; }
  .booking-form__grid, .booking-form__ptype { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .booking-form__full { grid-column: span 2 / span 2; }
}
.booking-form__consent { display: flex; gap: .75rem; font-size: .875rem; line-height: 1.25rem; color: #475569; cursor: pointer; }
.booking-form__consent input { margin-top: .25rem; width: 1rem; height: 1rem; accent-color: #0E7C99; }
.booking-form__consent a { color: #0E7C99; text-decoration: underline; }
.booking-form__error { margin-top: 1rem; font-size: .875rem; line-height: 1.25rem; font-weight: 500; color: #DC2626; }
.booking-form__submit { margin-top: 1.75rem; width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: 1rem 0;
  border-radius: 9999px; font-weight: 600; font-size: 16px; }
.booking-form__submit svg:first-child { width: 1.25rem; height: 1.25rem; }
.booking-form__submit svg:last-child { width: 1rem; height: 1rem; }
.booking-form__submit:active { transform: scale(.96); transition-duration: .08s; }
.booking-form__note { margin-top: .75rem; text-align: center; font-size: .75rem; line-height: 1rem; color: #64748B; }

/* fields (also used by other forms) */
.field { width: 100%; border: 1.5px solid #E2E8F0; border-radius: .9rem; padding: .85rem 1rem; background: #F8FAFC; font-size: 16px; transition: border-color .2s, box-shadow .2s, background-color .2s; }
.field:focus { outline: none; border-color: var(--teal); background: #fff; box-shadow: 0 0 0 4px rgba(14,124,153,.15); }
.field.invalid { border-color: #DC2626; box-shadow: 0 0 0 4px rgba(220,38,38,.1); }
label.lbl { display: block; font-size: .85rem; font-weight: 700; color: #334155; margin-bottom: .45rem; }
.ptype-opt { display: flex; align-items: center; gap: .7rem; padding: .8rem 1rem; border: 1.5px solid #E2E8F0; border-radius: .9rem; background: #F8FAFC; cursor: pointer; transition: border-color .2s, background-color .2s, box-shadow .2s; }
.ptype-opt input { width: 1.05rem; height: 1.05rem; accent-color: #0E7C99; flex-shrink: 0; }
.ptype-opt:has(input:checked) { border-color: var(--teal); background: #F0F8FB; box-shadow: 0 0 0 4px rgba(14,124,153,.12); }
.ptype-opt:focus-within { border-color: var(--teal); }
#f-ptype.invalid .ptype-opt { border-color: #DC2626; }
.ptype-opt span span:last-child { line-height: 1.35; }
span.lbl { display: block; font-size: .85rem; font-weight: 700; color: #334155; margin-bottom: .45rem; }
.ptype-opt__title { display: block; font-weight: 600; color: #061A36; white-space: nowrap; }
.ptype-opt__sub { display: block; font-size: .75rem; line-height: 1.35; color: #64748B; }


/* =====================================================================
   TREATMENT PAGES — content bands between the hero and "Where to consult"
   (overview + at a glance, symptoms, when, causes, diagnosis, treatment, living, children)
   ===================================================================== */
.tp-band { padding: 4.5rem 0; }
@media (min-width: 1024px) { .tp-band { padding: 6rem 0; } }
.section-title--md { font-size: 1.9rem; line-height: 1.2; }
@media (min-width: 640px) { .section-title--md { font-size: 2.5rem; line-height: 1.15; } }
.tp-text { margin-top: 1.1rem; font-size: 1.0625rem; line-height: 1.75; color: #475569; max-width: 68ch; }
.tp-lead { margin-top: 1rem; }

/* check lists (used in several bands) */
.tp-checks { margin-top: 1.75rem; display: grid; gap: .8rem; }
.tp-checks li { display: flex; gap: .8rem; font-size: 1rem; line-height: 1.6; color: #334155; }
.tp-checks__icon { width: 1.6rem; height: 1.6rem; margin-top: .05rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: #E6F4F8; color: #0E7C99; }
.tp-checks__icon svg { width: .9rem; height: .9rem; stroke-width: 2.5; }
@media (min-width: 768px) { .tp-checks--cols { grid-template-columns: 1fr 1fr; column-gap: 2rem; } }

/* 02 overview + "At a glance" card */
.tp-overview { display: grid; gap: 2.5rem; align-items: start; }
@media (min-width: 1024px) { .tp-overview { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 4rem; } }
.tp-facts { position: relative; overflow: hidden; padding: 1.75rem; border-radius: 1.75rem; color: #fff;
  background: radial-gradient(circle at 100% 0%, rgba(34,181,214,.35), transparent 55%), linear-gradient(155deg, #061A36 0%, #0B2C55 60%, #0E5F78 120%);
  box-shadow: 0 30px 60px -30px rgba(6,26,54,.65); }
@media (min-width: 1024px) { .tp-facts { padding: 2rem; } }
.tp-facts__head { display: flex; align-items: center; gap: .9rem; }
.tp-facts__badge { width: 3rem; height: 3rem; display: grid; place-items: center; border-radius: 1rem; background: linear-gradient(145deg, #0E7C99, #22B5D6); }
.tp-facts__badge svg { width: 1.5rem; height: 1.5rem; }
.tp-facts__title { font: 600 1.25rem/1.3 'Poppins', sans-serif; }
.tp-facts__list { margin-top: 1.5rem; display: grid; gap: 1.1rem; }
.tp-facts__item { display: flex; gap: .85rem; padding-top: 1.1rem; border-top: 1px solid rgba(255,255,255,.1); }
.tp-facts__ic { width: 2.1rem; height: 2.1rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .7rem; background: rgba(255,255,255,.08); color: #7FE3F7; }
.tp-facts__ic svg { width: 1.05rem; height: 1.05rem; }
.tp-facts__label { font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #F5B82E; }
.tp-facts__value { margin-top: .2rem; font-size: .975rem; line-height: 1.5; color: rgba(255,255,255,.88); }
.tp-facts__btn { margin-top: 1.75rem; width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: .55rem; padding: .9rem 1.25rem; border-radius: 9999px; font-weight: 600; }
.tp-facts__btn svg { width: 1.05rem; height: 1.05rem; }

/* 03 symptoms grid (7 signs + 1 call-to-action tile) */
.tp-signs { margin-top: 2.75rem; display: grid; gap: 1rem; }
@media (min-width: 640px)  { .tp-signs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .tp-signs { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; } }
.tp-sign { position: relative; display: flex; flex-direction: column; gap: 1rem; min-height: 9.5rem; padding: 1.4rem; border-radius: 1.4rem; background: #fff; border: 1px solid #E2E8F0;
  transition: border-color .3s, box-shadow .35s, translate .35s cubic-bezier(.22,1,.36,1); }
.tp-sign__icon { width: 3rem; height: 3rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 1rem; background: #E6F4F8; color: #0E7C99;
  transition: background-color .3s, color .3s, transform .35s cubic-bezier(.22,1,.36,1); }
.tp-sign__icon svg { width: 1.5rem; height: 1.5rem; }
.tp-sign--cta .tp-sign__icon { background: rgba(255,255,255,.14); color: #F5B82E; }
.tp-sign__text { font-family: 'Poppins', sans-serif; font-weight: 600; line-height: 1.45; color: #061A36; }
.tp-sign--cta { justify-content: flex-start; border-color: transparent; background: linear-gradient(150deg, #0B2C55 0%, #0E7C99 100%); }
.tp-sign--cta .tp-sign__text { color: #fff; }
.tp-sign__link { display: inline-flex; align-items: center; gap: .45rem; font-weight: 600; font-size: .95rem; color: #F5B82E; }
.tp-sign__link svg { width: 1rem; height: 1rem; transition: transform .25s; }
@media (hover: hover) {
  .tp-sign:hover { border-color: rgba(14,124,153,.35); box-shadow: 0 22px 40px -28px rgba(11,44,85,.45); translate: 0 -4px; }
  .tp-sign:not(.tp-sign--cta):hover .tp-sign__icon { background: linear-gradient(145deg, #0E7C99, #22B5D6); color: #fff; transform: scale(1.06); }
  .tp-sign--cta:hover .tp-sign__link svg { transform: translateX(4px); }
}

@media (max-width: 639.98px) {
  .tp-sign { flex-direction: row; align-items: center; min-height: 0; padding: 1rem 1.15rem; gap: 1rem; }
  .tp-sign__icon { width: 2.6rem; height: 2.6rem; border-radius: .85rem; }
  .tp-sign__icon svg { width: 1.3rem; height: 1.3rem; }
  .tp-sign--cta { flex-wrap: wrap; }
  .tp-sign--cta .tp-sign__text { flex: 1 1 0; min-width: 0; }
  .tp-sign--cta .tp-sign__link { flex-basis: 100%; padding-left: 3.6rem; }
}

/* 04 when to see + emergency (or "bring to your visit") card */
.tp-when { display: grid; gap: 2.5rem; align-items: start; }
@media (min-width: 1024px) { .tp-when { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4rem; } }
.tp-alert, .tp-prep { padding: 1.75rem; border-radius: 1.75rem; }
.tp-alert { background: #FEF2F2; border: 1px solid #FECACA; }
.tp-prep { background: linear-gradient(140deg, #E8F6FA, #FFFFFF); border: 1px solid rgba(14,124,153,.18); }
.tp-alert__head { display: flex; align-items: center; gap: .9rem; }
.tp-alert__icon, .tp-prep__icon { width: 3rem; height: 3rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 1rem; color: #fff; }
.tp-alert__icon { background: #DC2626; box-shadow: 0 14px 28px -14px rgba(220,38,38,.8); }
.tp-prep__icon { background: linear-gradient(145deg, #0E7C99, #22B5D6); }
.tp-alert__icon svg, .tp-prep__icon svg { width: 1.5rem; height: 1.5rem; }
.tp-alert__title { font: 600 1.125rem/1.4 'Poppins', sans-serif; color: #991B1B; }
.tp-prep__title { font: 600 1.125rem/1.4 'Poppins', sans-serif; color: #061A36; }
.tp-alert .tp-checks, .tp-prep .tp-checks { margin-top: 1.25rem; }
.tp-checks--alert li { color: #7F1D1D; }
.tp-checks--alert .tp-checks__icon { background: #FEE2E2; color: #DC2626; }
.tp-checks--light .tp-checks__icon { background: #fff; }

/* 05 causes */
.tp-causes { display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 1024px) { .tp-causes { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 4rem; } }
.tp-causes__list { display: grid; gap: .85rem; }
@media (min-width: 640px) { .tp-causes__list { grid-template-columns: 1fr 1fr; } }
.tp-cause { display: flex; align-items: center; gap: .85rem; padding: 1.1rem 1.25rem; border-radius: 1.1rem; background: #fff; border: 1px solid #E2E8F0; font-weight: 500; line-height: 1.5; color: #334155; }
.tp-cause__dot { width: .65rem; height: .65rem; flex-shrink: 0; border-radius: 50%; background: linear-gradient(135deg, #0E7C99, #F5B82E); box-shadow: 0 0 0 4px #E6F4F8; }
.tp-note { margin-top: 1.5rem; padding: 1.1rem 1.25rem; border-radius: 1rem; background: #fff; border-left: 4px solid #F5B82E; }
.tp-note__title { display: flex; align-items: center; gap: .5rem; font-weight: 600; color: #061A36; }
.tp-note__title svg { width: 1.1rem; height: 1.1rem; color: #F5B82E; }
.tp-note__text { margin-top: .35rem; color: #475569; line-height: 1.6; }

/* 06 diagnosis (dark band) */
.tp-dark { position: relative; overflow: hidden; color: #fff; background: linear-gradient(160deg, #04122A 0%, #0B2C55 100%); }
.tp-dark::before { content: ""; position: absolute; inset: 0; opacity: .07; background-image: radial-gradient(#fff 1px, transparent 1px); background-size: 22px 22px; }
.tp-dark .container-xl { position: relative; }
.tp-dark .section-title { color: #fff; }
.tp-dark .tp-text { color: rgba(255,255,255,.72); }
.tp-diag { display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 1024px) { .tp-diag { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4rem; } }
.tp-tests { display: grid; gap: 1rem; }
.tp-test { display: flex; align-items: center; gap: 1.1rem; padding: 1.25rem 1.4rem; border-radius: 1.25rem; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12);
  transition: background-color .3s, border-color .3s; }
.tp-test__icon { width: 3rem; height: 3rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 1rem; background: linear-gradient(145deg, #0E7C99, #22B5D6); }
.tp-test__icon svg { width: 1.4rem; height: 1.4rem; }
.tp-test__name { font: 600 1.1rem/1.3 'Poppins', sans-serif; color: #fff; }
.tp-test__text { margin-top: .25rem; font-size: .95rem; line-height: 1.5; color: rgba(255,255,255,.68); }
@media (hover: hover) { .tp-test:hover { background: rgba(255,255,255,.1); border-color: rgba(127,227,247,.35); } }

/* 07 treatment: intro + doctor card (left), vertical timeline (right) */
.tp-treat { position: relative; overflow: hidden; background: radial-gradient(circle at 85% 15%, rgba(34,181,214,.10), transparent 45%), radial-gradient(circle at 5% 95%, rgba(245,184,46,.10), transparent 40%), #fff; }
.tp-treat__grid { display: grid; gap: 3rem; align-items: start; }
@media (min-width: 1024px) { .tp-treat__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 4.5rem; }
  .tp-treat__intro { position: sticky; top: 110px; } }
.tp-treat__doctor { margin-top: 1.75rem; display: flex; align-items: center; gap: 1rem; padding: 1rem; border-radius: 1.25rem; background: #F3F7FA; border: 1px solid #E8EEF4; }
.tp-treat__doctor-img { width: 4.25rem; height: 4.25rem; flex-shrink: 0; border-radius: 1rem; object-fit: cover; object-position: top; box-shadow: 0 10px 20px -12px rgba(11,44,85,.5); }
.tp-treat__doctor-name { font: 600 1.05rem/1.3 'Poppins', sans-serif; color: #061A36; }
.tp-treat__doctor-role { margin-top: .1rem; font-size: .8rem; font-weight: 600; color: #0E7C99; }
.tp-treat__doctor-note { margin-top: .25rem; font-size: .9rem; line-height: 1.45; color: #475569; }
.tp-treat__warn { margin-top: 1rem; display: flex; gap: .6rem; align-items: flex-start; padding: .85rem 1rem; border-radius: 1rem; background: #FFF8E6; border: 1px solid rgba(245,184,46,.45); font-size: .925rem; line-height: 1.5; color: #7C5A0B; }
.tp-treat__warn svg { width: 1.15rem; height: 1.15rem; flex-shrink: 0; margin-top: .1rem; color: #D99A0B; }
.tp-treat__btn { margin-top: 1.5rem; display: inline-flex; align-items: center; gap: .55rem; padding: .9rem 1.6rem; border-radius: 9999px; font-weight: 600; }
.tp-treat__btn svg { width: 1.05rem; height: 1.05rem; }

.tp-plan { position: relative; display: grid; gap: 1.25rem; }
.tp-plan__step:not(:last-child)::before { content: ""; position: absolute; left: 1.75rem; top: 3.5rem; bottom: -1.25rem; width: 2px; translate: -50% 0;
  background: linear-gradient(180deg, rgba(14,124,153,.55), rgba(34,181,214,.35)); }
.tp-plan__step:nth-last-child(2)::before { background: linear-gradient(180deg, rgba(34,181,214,.45), rgba(245,184,46,.6)); }
.tp-nowrap { white-space: nowrap; }
.tp-plan__step { position: relative; display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); gap: 1.1rem; align-items: start; }
.tp-plan__node { position: relative; z-index: 1; width: 3.5rem; height: 3.5rem; display: grid; place-items: center; border-radius: 1.1rem; color: #fff;
  background: linear-gradient(145deg, #0B2C55, #0E7C99); box-shadow: 0 0 0 6px #fff, 0 14px 28px -14px rgba(14,124,153,.8);
  transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s; }
.tp-plan__node svg { width: 1.5rem; height: 1.5rem; }
.tp-plan__step:nth-child(even) .tp-plan__node { background: linear-gradient(145deg, #0E7C99, #22B5D6); }
.tp-plan__step:last-child .tp-plan__node { background: linear-gradient(145deg, #FFD06A, #F5B82E); color: #071E3D; box-shadow: 0 0 0 6px #fff, 0 14px 28px -14px rgba(245,184,46,.8); }
.tp-plan__card { padding: 1.25rem 1.4rem; border-radius: 1.4rem; background: #fff; border: 1px solid #E2E8F0; box-shadow: 0 18px 40px -34px rgba(11,44,85,.5);
  transition: border-color .3s, translate .35s cubic-bezier(.22,1,.36,1), box-shadow .35s; }
.tp-plan__kicker { font-size: .72rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: #D99A0B; }
.tp-plan__title { margin-top: .3rem; font: 600 1.2rem/1.35 'Poppins', sans-serif; color: #061A36; }
.tp-plan__text { margin-top: .45rem; font-size: 1rem; line-height: 1.65; color: #475569; }
@media (min-width: 640px) { .tp-plan__card { padding: 1.5rem 1.75rem; } }
@media (hover: hover) {
  .tp-plan__step:hover .tp-plan__card { border-color: rgba(14,124,153,.35); translate: 4px 0; box-shadow: 0 26px 50px -30px rgba(11,44,85,.5); }
  .tp-plan__step:hover .tp-plan__node { transform: scale(1.06); }
}

/* 08 living with it + first-aid card */
.tp-living { display: grid; gap: 2.5rem; align-items: start; }
@media (min-width: 1024px) { .tp-living { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4rem; } }
.tp-living--single { display: block; }
.tp-aid { padding: 1.75rem; border-radius: 1.75rem; background: #fff; border: 1px solid rgba(14,124,153,.18); box-shadow: 0 24px 50px -36px rgba(11,44,85,.5); }
.tp-aid__title { display: flex; align-items: center; gap: .8rem; font: 600 1.2rem/1.35 'Poppins', sans-serif; color: #061A36; }
.tp-aid__icon { width: 2.8rem; height: 2.8rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .9rem; background: #E6F4F8; color: #0E7C99; }
.tp-aid__icon svg { width: 1.35rem; height: 1.35rem; }
.tp-aid__list { margin-top: 1.25rem; display: grid; gap: .75rem; }
.tp-aid__list li { display: flex; align-items: flex-start; gap: .85rem; font-size: 1rem; line-height: 1.55; color: #334155; }
.tp-aid__num { width: 1.75rem; height: 1.75rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .55rem; font: 700 .85rem/1 'Poppins', sans-serif; background: #0B2C55; color: #fff; }

/* 09 in children */
.tp-kids { display: flex; flex-direction: column; gap: 1.5rem; padding: 2rem; border-radius: 2rem; background: linear-gradient(150deg, #E8F6FA 0%, #FFF8E6 100%); border: 1px solid rgba(14,124,153,.12); }
@media (min-width: 768px) { .tp-kids { flex-direction: row; gap: 2rem; padding: 3rem; } }
.tp-kids__icon { width: 4rem; height: 4rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 1.25rem; background: #fff; color: #0E7C99; box-shadow: 0 10px 25px -15px rgba(11,44,85,.4); }
.tp-kids__icon svg { width: 2rem; height: 2rem; }
.tp-kids__link { margin-top: 1.25rem; display: inline-flex; align-items: center; gap: .5rem; font-weight: 600; color: #0E7C99; }
.tp-kids__link svg { width: 1rem; height: 1rem; transition: transform .25s; }
.tp-kids__link:hover svg { transform: translateX(4px); }


/* Treatment hero heading: at most 2 lines. The size follows the column width (container query) and the
   heading length (--chars, written by the page template): short headings stay large, long ones shrink. */
.tp-hero-copy { container-type: inline-size; }
.tp-hero-title { margin-top: 1.5rem; font-family: 'Poppins', sans-serif; font-weight: 700; letter-spacing: -.015em; line-height: 1.1;
  font-size: clamp(1.6rem, calc(100cqi * 2.75 / var(--chars, 30)), 2.3rem); text-wrap: balance; }
@media (min-width: 640px)  { .tp-hero-title { font-size: clamp(2rem, calc(100cqi * 2.75 / var(--chars, 30)), 3.1rem); } }
@media (min-width: 1024px) { .tp-hero-title { font-size: clamp(2.1rem, calc(100cqi * 2.75 / var(--chars, 30)), 3.6rem); } }


/* =====================================================================
   PATIENT GUIDE  (patient-guide.php)
   Re-uses the treatment-page bands (.tp-band, .tp-checks, .tp-alert, .tp-prep, .tp-kids, .tp-dark)
   ===================================================================== */
/* hero: quick checklist card */
.pg-hero-card { padding: 1.75rem; border-radius: 1.75rem; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 40px 80px -40px rgba(0,0,0,.7); }
.pg-hero-card__head { display: flex; align-items: center; gap: .85rem; }
.pg-hero-card__icon { width: 3rem; height: 3rem; display: grid; place-items: center; border-radius: 1rem; background: linear-gradient(145deg, #FFD06A, #F5B82E); color: #071E3D; }
.pg-hero-card__icon svg { width: 1.5rem; height: 1.5rem; }
.pg-hero-card__title { font: 600 1.25rem/1.3 'Poppins', sans-serif; color: #fff; }
.pg-hero-card__list { margin-top: 1.25rem; display: grid; gap: .1rem; }
.pg-hero-card__list li { display: flex; align-items: center; gap: .75rem; padding: .7rem 0; border-top: 1px solid rgba(255,255,255,.1); font-size: 1rem; color: rgba(255,255,255,.88); }
.pg-hero-card__list svg { width: 1.15rem; height: 1.15rem; flex-shrink: 0; padding: .2rem; border-radius: 50%; background: rgba(127,227,247,.18); color: #7FE3F7; box-sizing: content-box; }

/* 01 what to bring: 3 x 2 icon cards */
.pg-bring { margin-top: 2.75rem; display: grid; gap: 1rem; }
@media (min-width: 640px)  { .pg-bring { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .pg-bring { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; } }
.pg-bring__item { padding: 1.5rem; border-radius: 1.4rem; background: #fff; border: 1px solid #E2E8F0;
  transition: border-color .3s, box-shadow .35s, translate .35s cubic-bezier(.22,1,.36,1); }
.pg-bring__icon { width: 3rem; height: 3rem; display: grid; place-items: center; border-radius: 1rem; background: #E6F4F8; color: #0E7C99; transition: background-color .3s, color .3s; }
.pg-bring__icon svg { width: 1.5rem; height: 1.5rem; }
.pg-bring__title { margin-top: 1.1rem; font: 600 1.15rem/1.35 'Poppins', sans-serif; color: #061A36; }
.pg-bring__text { margin-top: .45rem; font-size: .975rem; line-height: 1.6; color: #475569; }
@media (hover: hover) {
  .pg-bring__item:hover { border-color: rgba(14,124,153,.35); box-shadow: 0 22px 40px -28px rgba(11,44,85,.45); translate: 0 -4px; }
  .pg-bring__item:hover .pg-bring__icon { background: linear-gradient(145deg, #0E7C99, #22B5D6); color: #fff; }
}

/* questions to ask */
.pg-questions { margin-top: 2rem; display: grid; gap: 1.5rem; padding: 1.75rem; border-radius: 1.75rem; color: #fff;
  background: radial-gradient(circle at 100% 0%, rgba(34,181,214,.35), transparent 55%), linear-gradient(155deg, #061A36 0%, #0B2C55 60%, #0E5F78 120%); }
@media (min-width: 1024px) { .pg-questions { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 3rem; padding: 2.5rem; align-items: center; } }
.pg-questions__intro { display: flex; gap: 1rem; align-items: flex-start; }
.pg-questions__icon { width: 3rem; height: 3rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 1rem; background: linear-gradient(145deg, #0E7C99, #22B5D6); }
.pg-questions__icon svg { width: 1.5rem; height: 1.5rem; }
.pg-questions__title { font: 600 1.3rem/1.3 'Poppins', sans-serif; }
.pg-questions__text { margin-top: .4rem; color: rgba(255,255,255,.72); line-height: 1.6; }
.pg-questions__list { display: grid; gap: .65rem; }
@media (min-width: 640px) { .pg-questions__list { grid-template-columns: 1fr 1fr; } }
.pg-questions__list li { position: relative; padding: .8rem 1rem .8rem 2.4rem; border-radius: .9rem; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); font-size: .975rem; line-height: 1.5; color: rgba(255,255,255,.9); }
.pg-questions__list li::before { content: "?"; position: absolute; left: .85rem; top: .8rem; width: 1.1rem; height: 1.1rem; display: grid; place-items: center; border-radius: 50%; background: #F5B82E; color: #071E3D; font: 700 .7rem/1 'Poppins', sans-serif; }

/* 02 diaries: two cards with a sample table */
.pg-diaries { margin-top: 3rem; display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
@media (max-width: 639.98px) { .pg-diary { padding: 1.4rem; } }
@media (min-width: 1024px) { .pg-diaries { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pg-diary { min-width: 0; display: flex; flex-direction: column; padding: 1.75rem; border-radius: 1.75rem; background: #fff; border: 1px solid #E2E8F0; box-shadow: 0 24px 50px -40px rgba(11,44,85,.5); }
.pg-diary__head { display: flex; align-items: center; gap: 1rem; }
.pg-diary__icon { width: 3.25rem; height: 3.25rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 1rem; color: #fff; background: linear-gradient(145deg, #0B2C55, #0E7C99); }
.pg-diary__icon--amber { background: linear-gradient(145deg, #FFD06A, #F5B82E); color: #071E3D; }
.pg-diary__icon svg { width: 1.6rem; height: 1.6rem; }
.pg-diary__kicker { font-size: .75rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #0E7C99; }
.pg-diary__title { margin-top: .2rem; font: 600 1.35rem/1.3 'Poppins', sans-serif; color: #061A36; }
.pg-diary .tp-checks { margin-top: 1.4rem; }
.pg-table-wrap { margin-top: 1.5rem; overflow-x: auto; border-radius: 1rem; border: 1px solid #E2E8F0; }
.pg-table { width: 100%; min-width: 30rem; border-collapse: collapse; font-size: .9rem; }
.pg-table caption { caption-side: top; padding: .75rem 1rem; text-align: left; font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #64748B; background: #F3F7FA; }
.pg-table th { padding: .65rem 1rem; text-align: left; font-weight: 600; color: #0B2C55; background: #E6F4F8; }
.pg-table td { padding: .7rem 1rem; color: #334155; border-top: 1px dashed #CBD5E1; height: 2.6rem; }
.pg-diary__link { margin-top: auto; padding-top: 1.4rem; display: inline-flex; align-items: center; gap: .5rem; font-weight: 600; color: #0E7C99; }
.pg-diary__link svg { width: 1rem; height: 1rem; transition: transform .25s; }
.pg-diary__link:hover svg { transform: translateX(4px); }

/* 03 children */
.pg-kids__body { flex: 1; min-width: 0; }

/* 04 on the day: 4 icon columns on the dark band */
.pg-day { margin-top: 3rem; display: grid; gap: 2rem; text-align: center; }
@media (min-width: 640px)  { .pg-day { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .pg-day { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
  .pg-day__item { padding: 0 1.75rem; }
  .pg-day__item + .pg-day__item { border-left: 1px solid rgba(255,255,255,.12); } }
.pg-day__icon { width: 4rem; height: 4rem; margin: 0 auto; display: grid; place-items: center; border-radius: 50%; color: #fff;
  background: linear-gradient(145deg, #0E7C99, #22B5D6); box-shadow: 0 0 0 8px rgba(34,181,214,.12), 0 18px 36px -16px rgba(34,181,214,.8); }
.pg-day__item:nth-child(even) .pg-day__icon { background: linear-gradient(145deg, #FFD06A, #F5B82E); color: #071E3D; box-shadow: 0 0 0 8px rgba(245,184,46,.12), 0 18px 36px -16px rgba(245,184,46,.7); }
.pg-day__icon svg { width: 1.7rem; height: 1.7rem; }
.pg-day__title { margin-top: 1.25rem; font: 600 1.15rem/1.35 'Poppins', sans-serif; color: #fff; }
.pg-day__text { margin: .45rem auto 0; max-width: 16rem; font-size: .975rem; line-height: 1.6; color: rgba(255,255,255,.7); }

/* 05 after your visit */
.pg-after { display: grid; gap: 2.5rem; align-items: start; }
@media (min-width: 1024px) { .pg-after { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4rem; } }
.pg-after__cards { display: grid; gap: 1.25rem; }
.pg-after__call { margin-top: 1.25rem; display: inline-flex; align-items: center; gap: .5rem; padding: .65rem 1.2rem; border-radius: 9999px; background: #0B2C55; color: #fff; font-weight: 600; transition: background-color .2s; }
.pg-after__call:hover { background: #0E7C99; }
.pg-after__call svg { width: 1rem; height: 1rem; }

.pg-note { margin-top: 3.5rem; padding-top: 1.5rem; border-top: 1px solid #DCE5EE; font-size: .875rem; color: #64748B; }


/* =====================================================================
   CONTACT  (contact.php) — hero card re-uses .pg-hero-card from PATIENT GUIDE
   ===================================================================== */
/* hero: contact rows */
.ct-hero-card__list { margin-top: 1.25rem; display: grid; gap: .65rem; }
.ct-hero-card__row { display: flex; align-items: center; gap: .9rem; padding: .85rem 1rem; border-radius: 1.1rem; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
  transition: background-color .25s, border-color .25s; }
.ct-hero-card__row:hover { background: rgba(255,255,255,.12); border-color: rgba(127,227,247,.35); }
.ct-hero-card__ic { width: 2.6rem; height: 2.6rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .85rem; background: linear-gradient(145deg, #0E7C99, #22B5D6); color: #fff; }
.ct-hero-card__ic--wa { background: #25D366; }
.ct-hero-card__ic svg { width: 1.2rem; height: 1.2rem; }
.ct-hero-card__label { display: block; font-size: .75rem; color: rgba(255,255,255,.6); }
.ct-hero-card__value { display: block; font: 600 1.02rem/1.35 'Poppins', sans-serif; color: #fff; word-break: break-word; }

/* 02 ways to reach: 4 cards */
.ct-ways { margin-top: 2.75rem; display: grid; gap: 1rem; }
@media (min-width: 640px)  { .ct-ways { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .ct-ways { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; } }
.ct-ways > li { display: flex; }
.ct-way { width: 100%; display: flex; flex-direction: column; padding: 1.6rem; border-radius: 1.5rem; background: #fff; border: 1px solid #E2E8F0;
  transition: border-color .3s, box-shadow .35s, translate .35s cubic-bezier(.22,1,.36,1); }
.ct-way__icon { width: 3.2rem; height: 3.2rem; display: grid; place-items: center; border-radius: 1rem; background: #E6F4F8; color: #0E7C99; transition: background-color .3s, color .3s; }
.ct-way__icon svg { width: 1.55rem; height: 1.55rem; }
.ct-way__title { margin-top: 1.2rem; font: 600 1.2rem/1.3 'Poppins', sans-serif; color: #061A36; }
.ct-way__text { margin-top: .45rem; font-size: .95rem; line-height: 1.6; color: #475569; }
.ct-way__value { margin-top: auto; padding-top: 1.2rem; font: 600 1.05rem/1.3 'Poppins', sans-serif; color: #0E7C99; word-break: break-word; }
.ct-way__value--sm { font-size: .9rem; }
.ct-way--wa .ct-way__icon { background: #E7F9EE; color: #16A34A; }
.ct-way--wa .ct-way__value { color: #16A34A; }
.ct-way--navy { border-color: transparent; background: linear-gradient(150deg, #0B2C55 0%, #0E7C99 100%); }
.ct-way--navy .ct-way__icon { background: rgba(255,255,255,.14); color: #F5B82E; }
.ct-way--navy .ct-way__title { color: #fff; }
.ct-way--navy .ct-way__text { color: rgba(255,255,255,.75); }
.ct-way--navy .ct-way__value { color: #F5B82E; }
@media (hover: hover) {
  .ct-way:hover { border-color: rgba(14,124,153,.35); box-shadow: 0 22px 40px -28px rgba(11,44,85,.45); translate: 0 -4px; }
  .ct-way:not(.ct-way--navy):not(.ct-way--wa):hover .ct-way__icon { background: linear-gradient(145deg, #0E7C99, #22B5D6); color: #fff; }
  .ct-way--wa:hover .ct-way__icon { background: #25D366; color: #fff; }
}

/* 03 clinics list + map */
.ct-clinics { margin-top: 2.75rem; display: grid; gap: 1.5rem; }
@media (min-width: 1024px) { .ct-clinics { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: stretch; } }
.ct-clinic-list { display: grid; gap: 1rem; }
.ct-clinic { padding: 1.4rem; border-radius: 1.4rem; background: #fff; border: 1.5px solid #E2E8F0; transition: border-color .3s, box-shadow .3s; }
.ct-clinic.is-active { border-color: #0E7C99; box-shadow: 0 22px 40px -30px rgba(14,124,153,.7); }
.ct-clinic__select { width: 100%; display: flex; align-items: center; gap: .9rem; padding: 0; text-align: left; background: none; border: 0; cursor: pointer; }
.ct-clinic__select--static { cursor: default; }
.ct-clinic__num { width: 2.8rem; height: 2.8rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .9rem; font: 700 .95rem/1 'Poppins', sans-serif; background: #E6F4F8; color: #0E7C99; transition: background-color .3s, color .3s; }
.ct-clinic__num svg { width: 1.3rem; height: 1.3rem; }
.ct-clinic.is-active .ct-clinic__num { background: linear-gradient(145deg, #0B2C55, #0E7C99); color: #fff; }
.ct-clinic--online .ct-clinic__num { background: #FFF4D6; color: #B7791F; }
.ct-clinic__area { display: block; font-size: .72rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #0E7C99; }
.ct-clinic__name { display: block; margin-top: .15rem; font: 600 1.15rem/1.3 'Poppins', sans-serif; color: #061A36; }
.ct-clinic__line { margin-top: .75rem; display: flex; gap: .55rem; font-size: .925rem; line-height: 1.5; color: #475569; }
.ct-clinic__line svg { width: 1rem; height: 1rem; flex-shrink: 0; margin-top: .2rem; color: #94A3B8; }
.ct-clinic__actions { margin-top: 1.1rem; display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.ct-clinic__btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; padding: .7rem .9rem; border-radius: 9999px; font-size: .875rem; font-weight: 600;
  border: 1px solid #CBD5E1; color: #0B2C55; transition: background-color .2s, border-color .2s, color .2s; }
.ct-clinic__btn svg { width: 1rem; height: 1rem; }
.ct-clinic__btn:hover { border-color: #0E7C99; color: #0E7C99; }
.ct-clinic__btn--primary { border-color: transparent; background: #0B2C55; color: #fff; }
.ct-clinic__btn--primary:hover { background: #0E7C99; color: #fff; }

.ct-map { position: relative; min-height: 22rem; overflow: hidden; border-radius: 1.75rem; border: 1px solid #E2E8F0; background: #E6F4F8; box-shadow: 0 30px 60px -40px rgba(11,44,85,.6); }
.ct-map__frame { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ct-map__label { position: absolute; left: 1rem; bottom: 1.5rem; display: inline-flex; align-items: center; gap: .45rem; padding: .5rem .9rem; border-radius: 9999px;
  background: rgba(255,255,255,.95); box-shadow: 0 10px 25px -12px rgba(11,44,85,.5); font-size: .875rem; font-weight: 600; color: #0B2C55; pointer-events: none; }
.ct-map__label svg { width: 1rem; height: 1rem; color: #0E7C99; }

/* 04 before you come + emergency */
.ct-notes { display: grid; gap: 1.25rem; }
@media (min-width: 1024px) { .ct-notes { grid-template-columns: 1fr 1fr; } }
.ct-note { display: flex; gap: 1.1rem; padding: 1.75rem; border-radius: 1.75rem; }
.ct-note__icon { width: 3.2rem; height: 3.2rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 1rem; color: #fff; }
.ct-note__icon svg { width: 1.55rem; height: 1.55rem; }
.ct-note__title { display: block; font: 600 1.2rem/1.3 'Poppins', sans-serif; }
.ct-note__text { display: block; margin-top: .45rem; line-height: 1.6; }
.ct-note--guide { background: linear-gradient(140deg, #E8F6FA, #FFFFFF); border: 1px solid rgba(14,124,153,.18); transition: box-shadow .3s, translate .35s cubic-bezier(.22,1,.36,1); }
.ct-note--guide .ct-note__icon { background: linear-gradient(145deg, #0E7C99, #22B5D6); }
.ct-note--guide .ct-note__title { color: #061A36; }
.ct-note--guide .ct-note__text { color: #475569; }
.ct-note__link { margin-top: 1rem; display: inline-flex; align-items: center; gap: .45rem; font-weight: 600; color: #0E7C99; }
.ct-note__link svg { width: 1rem; height: 1rem; transition: transform .25s; }
@media (hover: hover) { .ct-note--guide:hover { translate: 0 -3px; box-shadow: 0 22px 40px -30px rgba(11,44,85,.45); }
  .ct-note--guide:hover .ct-note__link svg { transform: translateX(4px); } }
.ct-note--alert { background: #FEF2F2; border: 1px solid #FECACA; }
.ct-note--alert .ct-note__icon { background: #DC2626; }
.ct-note--alert .ct-note__title { color: #991B1B; }
.ct-note--alert .ct-note__text { color: #7F1D1D; }


/* =====================================================================
   BLOG  (blog.php) — topic chips, featured article, article grid, question CTA
   ===================================================================== */
.bl-hero { max-width: 48rem; }

/* topic filter chips */
.bl-filters { display: flex; flex-wrap: wrap; gap: .55rem; }
.bl-chip { display: inline-flex; align-items: center; gap: .45rem; padding: .6rem 1rem; border-radius: 9999px; background: #fff; border: 1px solid #E2E8F0;
  font-size: .9rem; font-weight: 600; color: #334155; cursor: pointer; transition: background-color .2s, border-color .2s, color .2s, box-shadow .2s; }
.bl-chip svg { width: 1rem; height: 1rem; color: #0E7C99; transition: color .2s; }
.bl-chip:hover { border-color: #0E7C99; color: #0E7C99; }
.bl-chip.is-active { background: #0B2C55; border-color: #0B2C55; color: #fff; box-shadow: 0 12px 24px -14px rgba(11,44,85,.7); }
.bl-chip.is-active svg { color: #F5B82E; }
@media (max-width: 639.98px) {
  .bl-filters { flex-wrap: nowrap; overflow-x: auto; margin: 0 -1rem; padding: .25rem 1rem .75rem; scrollbar-width: none; }
  .bl-filters::-webkit-scrollbar { display: none; }
  .bl-chip { flex-shrink: 0; }
}

/* card artwork: photo, or a gradient with the topic icon */
.bl-art { position: relative; overflow: hidden; display: grid; place-items: center; aspect-ratio: 16 / 9; background: linear-gradient(140deg, var(--c1), var(--c2)); }
.bl-art::before { content: ""; position: absolute; inset: 0; opacity: .14; background-image: radial-gradient(#fff 1px, transparent 1px); background-size: 18px 18px; }
.bl-art__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.22,1,.36,1); }
.bl-art--img .bl-art__icon { display: none; }
.bl-art__icon { position: relative; width: 5rem; height: 5rem; display: grid; place-items: center; border-radius: 1.5rem; background: rgba(255,255,255,.2); color: #fff;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: transform .5s cubic-bezier(.22,1,.36,1); }
.bl-art__icon svg { width: 2.5rem; height: 2.5rem; }
.bl-art__tag { position: absolute; left: 1rem; top: 1rem; padding: .3rem .75rem; border-radius: 9999px; background: #fff; color: var(--c1); font-size: .75rem; font-weight: 700; }

/* featured article */
.bl-featured { margin-top: 2.25rem; display: grid; overflow: hidden; border-radius: 1.75rem; background: #fff; border: 1px solid #E2E8F0; box-shadow: 0 30px 60px -45px rgba(11,44,85,.6);
  transition: box-shadow .35s, translate .35s cubic-bezier(.22,1,.36,1); }
@media (min-width: 1024px) { .bl-featured { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
  .bl-featured .bl-art { aspect-ratio: auto; min-height: 22rem; } }
.bl-featured__body { display: flex; flex-direction: column; padding: 1.75rem; }
@media (min-width: 1024px) { .bl-featured__body { padding: 2.5rem; justify-content: center; } }
.bl-featured__kicker { display: inline-flex; align-items: center; gap: .4rem; font-size: .75rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #D99A0B; }
.bl-featured__kicker svg { width: 1rem; height: 1rem; }
.bl-featured__title { margin-top: .75rem; font: 700 1.6rem/1.25 'Poppins', sans-serif; color: #061A36; transition: color .25s; }
@media (min-width: 640px) { .bl-featured__title { font-size: 2rem; } }
.bl-featured__text { margin-top: .85rem; font-size: 1.05rem; line-height: 1.7; color: #475569; }
.bl-featured .bl-card__foot { margin-top: 1.5rem; }

/* article grid */
.bl-grid { margin-top: 2rem; display: grid; gap: 1.5rem; }
@media (min-width: 640px)  { .bl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .bl-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.bl-card { display: flex; flex-direction: column; overflow: hidden; border-radius: 1.6rem; background: #fff; border: 1px solid #E2E8F0;
  transition: border-color .3s, box-shadow .35s, translate .35s cubic-bezier(.22,1,.36,1), opacity .3s; }
.bl-card[hidden], .bl-featured[hidden] { display: none; }
.bl-card__body { flex: 1; display: flex; flex-direction: column; padding: 1.5rem; }
.bl-card__title { font: 600 1.15rem/1.4 'Poppins', sans-serif; color: #061A36; transition: color .25s; }
.bl-card__text { margin-top: .55rem; margin-bottom: 1.25rem; font-size: .95rem; line-height: 1.6; color: #475569; }
.bl-card__foot { margin-top: auto; padding-top: 1.1rem; display: flex; align-items: center; justify-content: space-between; gap: .75rem; border-top: 1px solid #F1F5F9; font-size: .875rem; }
.bl-card__more { display: inline-flex; align-items: center; gap: .35rem; font-weight: 600; color: #0E7C99; }
.bl-card__more svg { width: 1rem; height: 1rem; transition: transform .25s; }
.bl-card__time { display: inline-flex; align-items: center; gap: .35rem; color: #64748B; }
.bl-card__time svg { width: .95rem; height: .95rem; }
@media (hover: hover) {
  .bl-card[href]:hover, .bl-featured[href]:hover { border-color: rgba(14,124,153,.35); box-shadow: 0 26px 50px -32px rgba(11,44,85,.5); translate: 0 -4px; }
  .bl-card[href]:hover .bl-card__title, .bl-featured[href]:hover .bl-featured__title { color: #0E7C99; }
  .bl-card[href]:hover .bl-art__img, .bl-featured[href]:hover .bl-art__img { transform: scale(1.05); }
  .bl-card[href]:hover .bl-art__icon { transform: scale(1.1); }
  .bl-card[href]:hover .bl-card__more svg, .bl-featured[href]:hover .bl-card__more svg { transform: translateX(4px); }
}
.bl-empty { margin-top: 2rem; padding: 2rem; border-radius: 1.25rem; background: #F3F7FA; text-align: center; color: #475569; }

/* question CTA */
.bl-cta { display: grid; gap: 1.5rem; align-items: center; padding: 2rem; border-radius: 1.75rem; color: #fff;
  background: radial-gradient(circle at 100% 0%, rgba(34,181,214,.35), transparent 55%), linear-gradient(155deg, #061A36 0%, #0B2C55 60%, #0E5F78 120%); }
@media (min-width: 1024px) { .bl-cta { grid-template-columns: auto minmax(0, 1fr) auto; gap: 2rem; padding: 2.5rem 3rem; } }
.bl-cta__icon { width: 3.6rem; height: 3.6rem; display: grid; place-items: center; border-radius: 1.1rem; background: linear-gradient(145deg, #0E7C99, #22B5D6); }
.bl-cta__icon svg { width: 1.8rem; height: 1.8rem; }
.bl-cta__title { font: 700 1.5rem/1.3 'Poppins', sans-serif; }
.bl-cta__text { margin-top: .45rem; color: rgba(255,255,255,.75); line-height: 1.6; }
.bl-cta__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; }
.bl-cta__link { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; color: #7FE3F7; }
.bl-cta__link svg { width: 1rem; height: 1rem; }


/* =====================================================================
   CLINICS  (clinics.php) — hero card re-uses .pg-hero-card / .ct-hero-card
   ===================================================================== */
.ct-hero-card__ic { font: 700 .9rem/1 'Poppins', sans-serif; }
.ct-hero-card__ic--amber { background: linear-gradient(145deg, #FFD06A, #F5B82E); color: #071E3D; }
.cl-jump__text { flex: 1; min-width: 0; }
.cl-jump__go { width: 1.1rem; height: 1.1rem; flex-shrink: 0; color: rgba(255,255,255,.5); transition: transform .25s, color .25s; }
.ct-hero-card__row:hover .cl-jump__go { color: #F5B82E; transform: translateY(3px); }

/* 02 clinic blocks: photo + details, alternating sides */
.cl-list { display: grid; gap: 4.5rem; }
@media (min-width: 1024px) { .cl-list { gap: 6rem; } }
.cl-clinic { display: grid; gap: 2rem; align-items: center; scroll-margin-top: 100px; }
@media (min-width: 1024px) {
  .cl-clinic { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4rem; }
  .cl-clinic--reverse .cl-clinic__media { order: 2; }
}
.cl-clinic__media { position: relative; overflow: hidden; border-radius: 2rem; aspect-ratio: 4 / 3; background: #E6F4F8; box-shadow: 0 40px 70px -45px rgba(11,44,85,.7); }
.cl-clinic__media::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(11,44,85,.08); pointer-events: none; }
.cl-clinic__img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.22,1,.36,1); }
@media (hover: hover) { .cl-clinic__media:hover .cl-clinic__img { transform: scale(1.04); } }
.cl-clinic__badge { position: absolute; left: 1.25rem; bottom: 1.25rem; display: inline-flex; align-items: center; gap: .6rem; padding: .45rem 1rem .45rem .45rem; border-radius: 9999px;
  background: rgba(255,255,255,.95); box-shadow: 0 14px 30px -14px rgba(11,44,85,.6); font-weight: 600; color: #0B2C55; }
.cl-clinic__num { width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(145deg, #0B2C55, #0E7C99); color: #fff; font: 700 .8rem/1 'Poppins', sans-serif; }

.cl-info { margin-top: 1.75rem; display: grid; gap: .25rem; }
.cl-info__row { display: flex; gap: .9rem; padding: .85rem 0; border-bottom: 1px solid #EEF2F6; }
.cl-info__icon { width: 2.4rem; height: 2.4rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .8rem; background: #E6F4F8; color: #0E7C99; }
.cl-info__icon svg { width: 1.15rem; height: 1.15rem; }
.cl-info__label { display: block; font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #94A3B8; }
.cl-info__value { display: block; margin-top: .15rem; font-size: 1rem; line-height: 1.5; color: #1E293B; }
.cl-info__link { font-weight: 600; color: #0E7C99; }
.cl-info__link:hover { color: #0B2C55; }

.cl-areas__label { margin-top: 1.5rem; font-size: .875rem; font-weight: 600; color: #475569; }
.cl-areas { margin-top: .65rem; display: flex; flex-wrap: wrap; gap: .45rem; }
.cl-areas li { padding: .35rem .8rem; border-radius: 9999px; background: #F3F7FA; border: 1px solid #E2E8F0; font-size: .85rem; color: #334155; }

.cl-actions { margin-top: 1.75rem; display: flex; flex-wrap: wrap; gap: .75rem; }
.cl-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .85rem 1.5rem; border-radius: 9999px; font-weight: 600; }
.cl-btn svg { width: 1.05rem; height: 1.05rem; }
.cl-btn--ghost { border: 1.5px solid #CBD5E1; color: #0B2C55; transition: border-color .2s, color .2s; }
.cl-btn--ghost:hover { border-color: #0E7C99; color: #0E7C99; }
.cl-btn--glass { border: 1px solid rgba(255,255,255,.25); background: rgba(255,255,255,.08); color: #fff; transition: background-color .2s; }
.cl-btn--glass:hover { background: rgba(255,255,255,.16); }

/* 03 online: text + 3 steps on the dark band */
.cl-online { display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 1024px) { .cl-online { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4rem; } }
#online { scroll-margin-top: 80px; }
.cl-steps { display: grid; gap: 1rem; }
.cl-step { display: flex; align-items: center; gap: 1.1rem; padding: 1.25rem 1.4rem; border-radius: 1.25rem; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); }
.cl-step__icon { width: 3rem; height: 3rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 1rem; background: linear-gradient(145deg, #0E7C99, #22B5D6); color: #fff; }
.cl-step:nth-child(2) .cl-step__icon { background: linear-gradient(145deg, #FFD06A, #F5B82E); color: #071E3D; }
.cl-step__icon svg { width: 1.4rem; height: 1.4rem; }
.cl-step__title { font: 600 1.1rem/1.3 'Poppins', sans-serif; color: #fff; }
.cl-step__text { margin-top: .25rem; font-size: .95rem; line-height: 1.55; color: rgba(255,255,255,.7); }

/* 04 treatments at every clinic */
.cl-treats { margin-top: 2.75rem; display: grid; gap: .75rem; }
@media (min-width: 640px)  { .cl-treats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .cl-treats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.cl-treat { display: flex; align-items: center; gap: .8rem; padding: .9rem 1rem; border-radius: 1.1rem; background: #fff; border: 1px solid #E2E8F0;
  transition: border-color .25s, box-shadow .3s, translate .3s cubic-bezier(.22,1,.36,1); }
.cl-treat__icon { width: 2.4rem; height: 2.4rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .8rem; background: #E6F4F8; color: #0E7C99; transition: background-color .25s, color .25s; }
.cl-treat__icon svg { width: 1.15rem; height: 1.15rem; }
.cl-treat__name { flex: 1; min-width: 0; font-weight: 600; font-size: .95rem; color: #061A36; }
.cl-treat__go { width: 1rem; height: 1rem; flex-shrink: 0; color: #CBD5E1; transition: color .25s, transform .25s; }
@media (hover: hover) {
  .cl-treat:hover { border-color: rgba(14,124,153,.35); box-shadow: 0 16px 30px -24px rgba(11,44,85,.5); translate: 0 -2px; }
  .cl-treat:hover .cl-treat__icon { background: linear-gradient(145deg, #0E7C99, #22B5D6); color: #fff; }
  .cl-treat:hover .cl-treat__go { color: #0E7C99; transform: translate(2px, -2px); }
}


/* =====================================================================
   PENDING DETAILS — only while SHOW_PENDING is true (components/config.php)
   <mark class="todo">  a placeholder still to be filled in (stays as plain text when switched off)
   .todo--note          a reminder for the team, hidden when switched off
   ===================================================================== */
mark.todo { padding: 0; background: none; color: inherit; }
.todo--note { display: none; }
.todos-on .todo { display: inline; padding: .05rem .4rem; border-radius: .35rem; background: #FEF08A; color: #713F12 !important; outline: 2px dashed #EAB308; outline-offset: 1px;
  font-weight: 600; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.todos-on .todo::before { content: "✎ "; }
.todos-on .todo--note { font-size: .8rem; line-height: 1.6; letter-spacing: 0; text-transform: none; }
.todos-on .todo--block { display: block; margin-top: 1.5rem; padding: .75rem 1rem; }
.todos-on .todo.is-focus { animation: todoPulse 1.2s ease 2; }
@keyframes todoPulse { 50% { outline-color: #DC2626; background: #FDE047; } }

/* floating "details to add" button */
.todo-fab { position: fixed; z-index: 60; left: 1.25rem; bottom: 5.5rem; display: inline-flex; align-items: center; gap: .5rem; padding: .6rem 1rem; border-radius: 9999px;
  background: #FEF08A; color: #713F12; border: 2px dashed #EAB308; font: 600 .85rem/1.2 'Plus Jakarta Sans', sans-serif; cursor: pointer;
  box-shadow: 0 14px 30px -14px rgba(113,63,18,.6); }
.todo-fab:hover { background: #FDE047; }
.todo-fab__count { min-width: 1.5rem; height: 1.5rem; padding: 0 .35rem; display: grid; place-items: center; border-radius: 9999px; background: #713F12; color: #FEF08A; font-size: .75rem; }
@media (max-width: 1023.98px) { .todo-fab { left: .75rem; bottom: 5rem; } }
@media print { .todo-fab { display: none; } }


/* =====================================================================
   CLINIC PAGES  (neurologist-in-<area>.php) — re-uses CLINICS (.cl-*), CONTACT (.ct-map) and treatment bands
   ===================================================================== */
/* 02 at a glance: 4 facts */
.cp-glance-band { padding-bottom: 3rem; }
@media (min-width: 1024px) { .cp-glance-band { padding-bottom: 4rem; } }
.cp-glance { display: grid; gap: 1rem; }
@media (min-width: 640px)  { .cp-glance { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .cp-glance { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; } }
.cp-glance__item { padding: 1.5rem; border-radius: 1.4rem; background: #fff; border: 1px solid #E2E8F0; box-shadow: 0 18px 40px -34px rgba(11,44,85,.5); }
.cp-glance__icon { width: 3rem; height: 3rem; display: grid; place-items: center; border-radius: 1rem; background: linear-gradient(145deg, #0E7C99, #22B5D6); color: #fff; }
.cp-glance__item:nth-child(2) .cp-glance__icon { background: linear-gradient(145deg, #FFD06A, #F5B82E); color: #071E3D; }
.cp-glance__icon svg { width: 1.45rem; height: 1.45rem; }
.cp-glance__label { margin-top: 1rem; font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #94A3B8; }
.cp-glance__value { display: block; margin-top: .3rem; font: 600 1.05rem/1.45 'Poppins', sans-serif; color: #061A36; }
.cp-glance__link { color: #0E7C99; }
.cp-glance__link:hover { color: #0B2C55; }

/* 03 address + map */
.cp-where { display: grid; gap: 2.5rem; align-items: stretch; }
@media (min-width: 1024px) { .cp-where { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 4rem; } }
.cp-map { min-height: 24rem; }

/* 04 areas served */
.cp-areas { display: grid; gap: 2rem; align-items: center; }
@media (min-width: 1024px) { .cp-areas { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4rem; } }
.cp-areas__box { padding: 1.75rem; border-radius: 1.75rem; background: linear-gradient(140deg, #E8F6FA, #FFFFFF); border: 1px solid rgba(14,124,153,.18); }
.cp-areas__box .cl-areas__label { margin-top: 0; }
.cp-areas__box .cl-areas li { background: #fff; }
.cp-areas__also { margin-top: 1.4rem; padding-top: 1.2rem; display: flex; gap: .55rem; border-top: 1px solid rgba(14,124,153,.15); font-size: .95rem; line-height: 1.6; color: #475569; }
.cp-areas__also svg { width: 1.1rem; height: 1.1rem; flex-shrink: 0; margin-top: .2rem; color: #0E7C99; }
.cp-areas__also a { font-weight: 600; color: #0E7C99; }
.cp-areas__also a:hover { color: #0B2C55; }
.cp-link { color: #7FE3F7; text-decoration: underline; text-underline-offset: 2px; }


/* =====================================================================
   LEGAL PAGES  (privacy-policy.php, medical-disclaimer.php) — text column + contact card
   ===================================================================== */
.doc-hero { max-width: 46rem; }
.doc-hero__meta { margin-top: 1.25rem; display: inline-flex; align-items: center; gap: .45rem; padding: .4rem .9rem; border-radius: 9999px; background: rgba(255,255,255,.1); font-size: .875rem; color: rgba(255,255,255,.8); }
.doc-hero__meta svg { width: 1rem; height: 1rem; color: #F5B82E; }
.doc-layout { display: grid; gap: 2.5rem; align-items: start; }
@media (min-width: 1024px) { .doc-layout { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 4rem; } .doc-aside { position: sticky; top: 110px; } }
.doc { max-width: 46rem; }
.doc > .todo--block:first-child { margin-top: 0; margin-bottom: 1.5rem; }
.doc h2 { margin-top: 2.25rem; padding-top: 2rem; border-top: 1px solid #EEF2F6; font: 600 1.35rem/1.35 'Poppins', sans-serif; color: #061A36; }
.doc-summary + h2, .doc-alert + h2 { border-top: 0; padding-top: 0; }
.doc p { margin-top: .85rem; font-size: 1.0625rem; line-height: 1.75; color: #475569; }
.doc ul { margin-top: .85rem; display: grid; gap: .55rem; }
.doc li { position: relative; padding-left: 1.6rem; font-size: 1.0625rem; line-height: 1.65; color: #334155; }
.doc li::before { content: ""; position: absolute; left: .2rem; top: .62rem; width: .55rem; height: .55rem; border-radius: 50%; background: linear-gradient(135deg, #0E7C99, #F5B82E); }
.doc a { font-weight: 600; color: #0E7C99; text-decoration: underline; text-underline-offset: 2px; }
.doc a:hover { color: #0B2C55; }

.doc-summary { padding: 1.5rem 1.75rem; border-radius: 1.5rem; background: linear-gradient(140deg, #E8F6FA, #FFFFFF); border: 1px solid rgba(14,124,153,.18); }
.doc-summary__title { display: flex; align-items: center; gap: .55rem; font: 600 1.15rem/1.3 'Poppins', sans-serif; color: #061A36; }
.doc-summary__title svg { width: 1.3rem; height: 1.3rem; color: #0E7C99; }
.doc .doc-summary__list { margin-top: 1rem; }
.doc .doc-summary__list li::before { background: #0E7C99; }

.doc-alert { display: flex; gap: 1rem; padding: 1.5rem; border-radius: 1.5rem; background: #FEF2F2; border: 1px solid #FECACA; }
.doc-alert__icon { width: 3rem; height: 3rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 1rem; background: #DC2626; color: #fff; }
.doc-alert__icon svg { width: 1.5rem; height: 1.5rem; }
.doc-alert__title { font: 600 1.1rem/1.4 'Poppins', sans-serif; color: #991B1B; }
.doc .doc-alert__text { margin-top: .4rem; font-size: 1rem; color: #7F1D1D; }

.doc-card { padding: 1.75rem; border-radius: 1.75rem; color: #fff;
  background: radial-gradient(circle at 100% 0%, rgba(34,181,214,.35), transparent 55%), linear-gradient(155deg, #061A36 0%, #0B2C55 60%, #0E5F78 120%); }
.doc-card__icon { width: 3rem; height: 3rem; display: grid; place-items: center; border-radius: 1rem; background: linear-gradient(145deg, #0E7C99, #22B5D6); }
.doc-card__icon svg { width: 1.5rem; height: 1.5rem; }
.doc-card__title { margin-top: 1.1rem; font: 600 1.2rem/1.35 'Poppins', sans-serif; }
.doc-card__text { margin-top: .4rem; color: rgba(255,255,255,.75); line-height: 1.6; }
.doc-card__row { margin-top: .75rem; display: flex; align-items: center; gap: .6rem; padding: .75rem 1rem; border-radius: 1rem; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1);
  font-weight: 600; color: #fff; word-break: break-word; transition: background-color .2s; }
.doc-card__row:first-of-type { margin-top: 1.25rem; }
.doc-card__row:hover { background: rgba(255,255,255,.14); }
.doc-card__row svg { width: 1.05rem; height: 1.05rem; flex-shrink: 0; color: #7FE3F7; }
.doc-card__btn { margin-top: 1.25rem; width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .85rem 1.25rem; border-radius: 9999px; font-weight: 600; }
.doc-card__btn svg { width: 1.05rem; height: 1.05rem; }
.doc-link { margin-top: 1rem; display: flex; align-items: center; gap: .6rem; padding: 1rem 1.25rem; border-radius: 1.25rem; background: #fff; border: 1px solid #E2E8F0; font-weight: 600; color: #0B2C55;
  transition: border-color .2s, color .2s; }
.doc-link svg { width: 1.1rem; height: 1.1rem; color: #0E7C99; }
.doc-link svg:last-child { margin-left: auto; transition: transform .25s; }
.doc-link:hover { border-color: #0E7C99; color: #0E7C99; }
.doc-link:hover svg:last-child { transform: translateX(4px); }


/* =====================================================================
   FAQS  (faqs.php) — topic chips (re-use .bl-chip) + one block per topic
   ===================================================================== */
.fq-topics { margin-bottom: .5rem; }
.fq-groups { display: grid; }
.fq-group { display: grid; gap: 1.5rem; padding: 3rem 0; border-top: 1px solid #EEF2F6; scroll-margin-top: 90px; }
.fq-group:first-child { border-top: 0; }
@media (min-width: 1024px) { .fq-group { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 3.5rem; } .fq-group__head { position: sticky; top: 110px; align-self: start; } }
.fq-group__icon { width: 3.2rem; height: 3.2rem; display: grid; place-items: center; border-radius: 1rem; background: linear-gradient(145deg, #0B2C55, #0E7C99); color: #fff; }
.fq-group__icon svg { width: 1.55rem; height: 1.55rem; }
.fq-group__title { margin-top: 1rem; font: 700 1.6rem/1.25 'Poppins', sans-serif; color: #061A36; }
.fq-group__intro { margin-top: .5rem; color: #475569; line-height: 1.6; }
.fq-group__count { margin-top: .9rem; display: inline-block; padding: .25rem .7rem; border-radius: 9999px; background: #E6F4F8; font-size: .8rem; font-weight: 600; color: #0E7C99; }
.fq-group--alert .fq-group__icon { background: #DC2626; }
.fq-group--alert .fq-group__count { background: #FEE2E2; color: #B91C1C; }


/* =====================================================================
   THANK YOU  (thank-you.php)  +  404  (404.php)
   ===================================================================== */
.ty-hero { max-width: 44rem; margin: 0 auto; text-align: center; }
.ty-hero .todo--block { margin-left: auto; margin-right: auto; }
.ty-hero__check { width: 5rem; height: 5rem; margin: 0 auto; display: grid; place-items: center; border-radius: 50%; color: #fff;
  background: linear-gradient(145deg, #16A34A, #22C55E); box-shadow: 0 0 0 10px rgba(34,197,94,.15), 0 20px 40px -16px rgba(34,197,94,.8); animation: tyPop .6s cubic-bezier(.22,1.6,.36,1) both; }
.ty-hero__check svg { width: 2.6rem; height: 2.6rem; stroke-width: 3; }
@keyframes tyPop { from { transform: scale(.4); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .ty-hero__check { animation: none; } }

.ty-steps { margin-top: 3rem; display: grid; gap: 1.25rem; }
@media (min-width: 768px) { .ty-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ty-step { position: relative; padding: 1.75rem; border-radius: 1.5rem; background: #fff; border: 1px solid #E2E8F0; box-shadow: 0 18px 40px -34px rgba(11,44,85,.5); }
.ty-step__num { position: absolute; right: 1.5rem; top: 1.25rem; font: 800 2.4rem/1 'Poppins', sans-serif; color: #F1F5F9; }
.ty-step__icon { position: relative; width: 3.2rem; height: 3.2rem; display: grid; place-items: center; border-radius: 1rem; background: linear-gradient(145deg, #0E7C99, #22B5D6); color: #fff; }
.ty-step:nth-child(2) .ty-step__icon { background: linear-gradient(145deg, #FFD06A, #F5B82E); color: #071E3D; }
.ty-step__icon svg { width: 1.5rem; height: 1.5rem; }
.ty-step__title { margin-top: 1.2rem; font: 600 1.2rem/1.3 'Poppins', sans-serif; color: #061A36; }
.ty-step__text { margin-top: .45rem; font-size: .975rem; line-height: 1.6; color: #475569; }

.ty-clinics { margin-top: 2.5rem; display: grid; gap: 1.25rem; }
@media (min-width: 1024px) { .ty-clinics { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ty-clinics--one { grid-template-columns: minmax(0, 1fr); max-width: 44rem; } }
.ty-clinic { display: flex; gap: 1.1rem; padding: 1.6rem; border-radius: 1.5rem; background: #fff; border: 1px solid #E2E8F0; }
.ty-clinics--one .ty-clinic { border: 1.5px solid #0E7C99; box-shadow: 0 24px 50px -34px rgba(14,124,153,.7); }
.ty-clinic__icon { width: 3rem; height: 3rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 1rem; background: linear-gradient(145deg, #0B2C55, #0E7C99); color: #fff; }
.ty-clinic__icon svg { width: 1.4rem; height: 1.4rem; }
.ty-clinic__body { min-width: 0; }
.ty-clinic__area { font-size: .72rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #0E7C99; }
.ty-clinic__name { margin-top: .2rem; font: 600 1.2rem/1.3 'Poppins', sans-serif; color: #061A36; }
.ty-clinic__address { margin-top: .5rem; font-size: .975rem; line-height: 1.6; color: #475569; }
.ty-clinic .cl-actions { margin-top: 1.25rem; }
.ty-clinic .cl-btn { padding: .7rem 1.2rem; font-size: .9rem; }

/* 404 */
.nf-code { display: inline-flex; align-items: center; gap: .1em; font: 800 clamp(4.5rem, 14vw, 8rem)/1 'Poppins', sans-serif; letter-spacing: -.02em;
  background: linear-gradient(135deg, #FFFFFF 20%, #7FE3F7 60%, #F5B82E 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nf-code__o { width: .9em; height: .9em; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(145deg, #0E7C99, #22B5D6); box-shadow: 0 0 0 .08em rgba(34,181,214,.2); }
.nf-code__o svg { width: .55em; height: .55em; color: #fff; }


/* =====================================================================
   BOOK APPOINTMENT  (book-appointment.php) — form is the shared BOOKING section
   ===================================================================== */
/* hero: 3 steps in a glass card (re-uses .pg-hero-card) */
.ba-hero-steps { display: grid; gap: .1rem; }
.ba-hero-steps__item { display: flex; align-items: center; gap: 1rem; padding: .95rem 0; border-top: 1px solid rgba(255,255,255,.1); }
.ba-hero-steps__item:first-child { border-top: 0; padding-top: 0; }
.ba-hero-steps__item:last-child { padding-bottom: 0; }
.ba-hero-steps__num { width: 2.8rem; height: 2.8rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; font: 700 1.05rem/1 'Poppins', sans-serif;
  background: linear-gradient(145deg, #0E7C99, #22B5D6); color: #fff; }
.ba-hero-steps__item:nth-child(2) .ba-hero-steps__num { background: linear-gradient(145deg, #FFD06A, #F5B82E); color: #071E3D; }
.ba-hero-steps__title { display: block; font: 600 1.1rem/1.3 'Poppins', sans-serif; color: #fff; }
.ba-hero-steps__text { display: block; margin-top: .15rem; font-size: .9rem; color: rgba(255,255,255,.7); }

/* other ways: 3 cards (re-uses .ct-way) */
@media (min-width: 1024px) { .ba-ways { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ba-way--pending { border-style: dashed; }

/* what to bring + clinics */
.ba-prep { display: grid; gap: 2.5rem; align-items: start; }
@media (min-width: 1024px) { .ba-prep { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 4rem; } }
.ba-bring { padding: 2rem; border-radius: 1.75rem; background: linear-gradient(140deg, #E8F6FA, #FFFFFF); border: 1px solid rgba(14,124,153,.18); }
.ba-bring__icon { width: 3.2rem; height: 3.2rem; display: grid; place-items: center; border-radius: 1rem; background: linear-gradient(145deg, #FFD06A, #F5B82E); color: #071E3D; }
.ba-bring__icon svg { width: 1.55rem; height: 1.55rem; }
.ba-bring__title { margin-top: 1.1rem; font: 700 1.5rem/1.25 'Poppins', sans-serif; color: #061A36; }
.ba-bring .tp-checks { margin-top: 1.25rem; }
.ba-clinics { margin-top: 1.75rem; display: grid; gap: .9rem; }
.ba-clinic { display: flex; gap: 1rem; padding: 1.25rem 1.4rem; border-radius: 1.25rem; background: #fff; border: 1px solid #E2E8F0; }
.ba-clinic__icon { width: 2.8rem; height: 2.8rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .9rem; background: linear-gradient(145deg, #0B2C55, #0E7C99); color: #fff; }
.ba-clinic__icon--amber { background: linear-gradient(145deg, #FFD06A, #F5B82E); color: #071E3D; }
.ba-clinic__icon svg { width: 1.3rem; height: 1.3rem; }
.ba-clinic__body { min-width: 0; }
.ba-clinic__name { font: 600 1.08rem/1.35 'Poppins', sans-serif; color: #061A36; }
.ba-clinic__address { margin-top: .3rem; font-size: .93rem; line-height: 1.55; color: #475569; }
.ba-clinic__links { margin-top: .55rem; font-size: .9rem; color: #94A3B8; }
.ba-clinic__links a { font-weight: 600; color: #0E7C99; }
.ba-clinic__links a:hover { color: #0B2C55; }

/* emergency strip */
.ba-emergency-band { padding-top: 3rem; }
.ba-emergency__text { margin-top: .4rem; color: #7F1D1D; line-height: 1.6; }


/* =====================================================================
   VISITING CLINICS — Mansa & Sumerpur (clinics.php #visiting, contact note, footer line)
   ===================================================================== */
.cl-visits { margin-top: 2.75rem; display: grid; gap: 1.25rem; }
@media (min-width: 1024px) { .cl-visits { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; } }
#visiting { scroll-margin-top: 80px; }
.cl-visit { display: flex; flex-direction: column; padding: 1.75rem; border-radius: 1.75rem; background: #fff; border: 1px solid #E2E8F0; box-shadow: 0 24px 50px -40px rgba(11,44,85,.5); }
.cl-visit__top { display: flex; align-items: center; gap: 1rem; }
.cl-visit__icon { width: 3.2rem; height: 3.2rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 1rem; background: linear-gradient(145deg, #0B2C55, #0E7C99); color: #fff; }
.cl-visit__icon--amber { background: linear-gradient(145deg, #FFD06A, #F5B82E); color: #071E3D; }
.cl-visit__icon svg { width: 1.5rem; height: 1.5rem; }
.cl-visit__place { font-size: .72rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #0E7C99; }
.cl-visit__name { margin-top: .15rem; font: 600 1.3rem/1.3 'Poppins', sans-serif; color: #061A36; }
.cl-visit__host { margin-top: .1rem; font-size: .9rem; color: #64748B; }
.cl-visit__when { margin-top: 1.25rem; display: flex; align-items: center; gap: .6rem; padding: .8rem 1rem; border-radius: 1rem; background: #FFF8E6; border: 1px solid rgba(245,184,46,.4); color: #5B4208; }
.cl-visit__when svg { width: 1.2rem; height: 1.2rem; flex-shrink: 0; color: #D99A0B; }
.cl-visit__when strong { color: #061A36; }
.cl-visit__line { margin-top: .75rem; display: flex; gap: .6rem; font-size: .95rem; line-height: 1.55; color: #475569; }
.cl-visit__line svg { width: 1.05rem; height: 1.05rem; flex-shrink: 0; margin-top: .2rem; color: #94A3B8; }
.cl-visit__line a { font-weight: 700; color: #0E7C99; }
.cl-visit__actions { margin-top: auto; padding-top: 1.4rem; display: flex; flex-wrap: wrap; gap: .65rem; }
.cl-btn--primary-sm { background: #0B2C55; color: #fff; transition: background-color .2s; }
.cl-btn--primary-sm:hover { background: #0E7C99; color: #fff; }

/* contact page: one-line note under the clinic cards */
.ct-visiting { display: flex; align-items: center; gap: .85rem; padding: 1rem 1.2rem; border-radius: 1.2rem; background: #FFF8E6; border: 1px dashed rgba(217,154,11,.55); color: #5B4208; font-size: .925rem; line-height: 1.5;
  transition: background-color .2s; }
.ct-visiting:hover { background: #FFF1CC; }
.ct-visiting strong { color: #061A36; }
.ct-visiting__icon { width: 2.4rem; height: 2.4rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .8rem; background: linear-gradient(145deg, #FFD06A, #F5B82E); color: #071E3D; }
.ct-visiting__icon svg { width: 1.15rem; height: 1.15rem; }
.ct-visiting__text { flex: 1; min-width: 0; }
.ct-visiting__go { width: 1.05rem; height: 1.05rem; flex-shrink: 0; color: #D99A0B; transition: transform .25s; }
.ct-visiting:hover .ct-visiting__go { transform: translateX(3px); }

/* footer: line under "Our Clinics" */
.f-visiting { margin-top: 1rem; display: flex; align-items: center; gap: .65rem; padding: .85rem 1.1rem; border-radius: 1rem; background: rgba(255,255,255,.05); border: 1px dashed rgba(255,255,255,.18);
  font-size: .875rem; line-height: 1.5; color: rgba(255,255,255,.75); transition: background-color .2s, border-color .2s; }
.f-visiting:hover { background: rgba(255,255,255,.09); border-color: rgba(245,184,46,.5); }
.f-visiting strong { color: #fff; }
.f-visiting svg { width: 1.05rem; height: 1.05rem; flex-shrink: 0; color: #F5B82E; }
.f-visiting > span { flex: 1; min-width: 0; }

/* Booking form: hint under the date / time lists (days and hours of the chosen clinic) */
.booking-form__hint { margin-top: .45rem; display: flex; align-items: center; gap: .4rem; font-size: .78rem; line-height: 1.4; color: #0E7C99; }
.booking-form__hint svg { width: .95rem; height: .95rem; flex-shrink: 0; }
.booking-form__hint[hidden] { display: none; }
select.field:disabled { opacity: .6; cursor: not-allowed; }

/* Booking form: date field opens a calendar (flatpickr, assets/vendor/flatpickr) — only the clinic's days are active */
.date-field { position: relative; }
.date-field .field { padding-right: 2.75rem; cursor: pointer; background-color: #fff; }
.date-field .field:disabled { cursor: not-allowed; }
.date-field__icon { position: absolute; right: 1rem; top: 50%; width: 1.15rem; height: 1.15rem; translate: 0 -50%; color: #0E7C99; pointer-events: none; }
.flatpickr-calendar { font-family: 'Plus Jakarta Sans', sans-serif; border-radius: 1.1rem; border: 1px solid #E2E8F0; box-shadow: 0 24px 50px -20px rgba(11,44,85,.45); }
.flatpickr-calendar.arrowTop::before, .flatpickr-calendar.arrowTop::after { display: none; }
.flatpickr-months { padding: .4rem .25rem 0; }
.flatpickr-current-month { font-size: 1rem; font-weight: 700; color: #061A36; }
.flatpickr-current-month .numInputWrapper { width: 4.5ch; }
.flatpickr-months .flatpickr-prev-month:hover svg, .flatpickr-months .flatpickr-next-month:hover svg { fill: #0E7C99; }
span.flatpickr-weekday { font-weight: 700; color: #64748B; }
.flatpickr-day { border-radius: .7rem; font-weight: 600; color: #061A36; }
.flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover { color: #CBD5E1; font-weight: 400; background: none; }
.flatpickr-day:not(.flatpickr-disabled):not(.selected) { background: #E6F4F8; border-color: #E6F4F8; }
.flatpickr-day:not(.flatpickr-disabled):not(.selected):hover { background: #CDEBF3; border-color: #CDEBF3; }
.flatpickr-day.today { border-color: #F5B82E; }
.flatpickr-day.selected, .flatpickr-day.selected:hover { background: #0B2C55; border-color: #0B2C55; color: #fff; }
.flatpickr-day.prevMonthDay, .flatpickr-day.nextMonthDay { visibility: hidden; }


/* =====================================================================
   HEADER — Treatments mega menu: promo card with Dr. Mehta's photo (components/header.php)
   The photo keeps its own 3:4 shape (no stretching or heavy crop); text sits on navy below it.
   ===================================================================== */
.mm-promo { position: relative; display: flex; flex-direction: column; overflow: hidden; border-radius: 1rem; color: #fff;
  background: linear-gradient(180deg, #0B2C55 0%, #061A36 100%); box-shadow: 0 18px 40px -24px rgba(6,26,54,.6); }
.mm-promo__photo { position: relative; display: block; aspect-ratio: 900 / 1193; overflow: hidden; background: #E6F4F8; }
.mm-promo__photo picture, .mm-promo__photo img { display: block; width: 100%; height: 100%; }
.mm-promo__photo img { object-fit: cover; object-position: center top; transition: transform .7s cubic-bezier(.22,1,.36,1); }
.mm-promo__photo::after { content: ""; position: absolute; inset: auto 0 0 0; height: 45%; background: linear-gradient(to top, #0B2C55 0%, rgba(11,44,85,0) 100%); }
.mm-promo__body { position: relative; flex: 1; display: flex; flex-direction: column; justify-content: flex-end; padding: 0 1.25rem 1.3rem; margin-top: -2.25rem; }
.mm-promo__tag { align-self: flex-start; padding: .2rem .6rem; border-radius: 9999px; background: #F5B82E; color: #061A36; font-size: .68rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.mm-promo__title { margin-top: .55rem; font: 600 1.15rem/1.3 'Poppins', sans-serif; color: #fff; }
.mm-promo__text { margin-top: .3rem; font-size: .85rem; line-height: 1.45; color: rgba(255,255,255,.8); }
@media (hover: hover) { .mm-promo:hover .mm-promo__photo img { transform: scale(1.04); } }

/* Two-column sections: main.js (initStickySides) pins the shorter side on desktop */
.sides-measuring > * { align-self: start !important; }
@media (min-width: 1024px) { .is-sticky-side { position: sticky; top: 110px; align-self: start; } }

/* Footer: the two visiting clinics as separate cards under "Our Clinics" */
.f-visit-head { margin-top: 2rem; }
.f-visits { display: grid; gap: 1rem; }
@media (min-width: 768px) { .f-visits { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.f-visit { display: flex; gap: 1rem; padding: 1.25rem 1.4rem; border-radius: 1rem; background: rgba(255,255,255,.05); border: 1px dashed rgba(255,255,255,.18);
  transition: background-color .2s, border-color .2s; }
.f-visit:hover { background: rgba(255,255,255,.09); border-color: rgba(245,184,46,.5); }
.f-visit__icon { width: 2.6rem; height: 2.6rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .8rem; background: rgba(34,181,214,.15); color: #7FE3F7; }
.f-visit__icon--amber { background: rgba(245,184,46,.15); color: #F5B82E; }
.f-visit__icon svg { width: 1.2rem; height: 1.2rem; }
.f-visit__body { min-width: 0; display: grid; gap: .3rem; }
.f-visit__place { font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #7FE3F7; }
.f-visit__name { font: 600 1.05rem/1.3 'Poppins', sans-serif; color: #fff; }
.f-visit__when, .f-visit__phone { display: flex; align-items: center; gap: .45rem; font-size: .85rem; line-height: 1.45; color: rgba(255,255,255,.72); }
.f-visit__when svg, .f-visit__phone svg { width: .95rem; height: .95rem; flex-shrink: 0; color: #F5B82E; }


/* =====================================================================
   FOOTER — dark navy, compact (components/footer.php)
   CTA band · Treatments + Clinics glass panels · bottom bar
   ===================================================================== */
.ft { position: relative; overflow: clip; background: #061A36; color: rgba(255,255,255,.72); }
.ft-cta { position: relative; z-index: 1; background: linear-gradient(90deg, #0B6A84, #0E7C99 50%, #0B6A84); }
.ft-cta__inner { display: flex; flex-direction: column; gap: 1rem; padding-top: 1.4rem; padding-bottom: 1.4rem; }
@media (min-width: 992px) { .ft-cta__inner { flex-direction: row; align-items: center; justify-content: space-between; gap: 2rem; } }
.ft-cta__title { font: 700 1.2rem/1.3 'Poppins', sans-serif; color: #fff; }
.ft-cta__text { margin-top: .2rem; font-size: .92rem; color: rgba(255,255,255,.85); }
.ft-cta__actions { display: flex; flex-wrap: wrap; gap: .6rem; flex-shrink: 0; }
.ft-btn { display: inline-flex; align-items: center; gap: .5rem; padding: .65rem 1.1rem; border-radius: .7rem; font-weight: 600; font-size: .92rem; transition: background-color .2s, color .2s; }
.ft-btn svg { width: 1rem; height: 1rem; }
.ft-btn--ghost { border: 1px solid rgba(255,255,255,.35); background: rgba(255,255,255,.1); color: #fff; }
.ft-btn--ghost:hover { background: rgba(255,255,255,.2); color: #fff; }
.ft-btn--light { background: #fff; color: #0B2C55; }
.ft-btn--light:hover { background: #0B2C55; color: #fff; }

.ft-glow { position: absolute; width: 420px; height: 420px; border-radius: 50%; pointer-events: none; }
.ft-glow--a { left: -8rem; top: 30%; background: radial-gradient(circle, rgba(14,124,153,.3), transparent 65%); }
.ft-glow--b { right: -8rem; bottom: 10%; background: radial-gradient(circle, rgba(34,181,214,.18), transparent 65%); }

.ft-main { position: relative; z-index: 1; display: grid; gap: 1.25rem; padding-top: 2.25rem; padding-bottom: 2rem; }
@media (min-width: 992px) { .ft-main { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ft-panel { min-width: 0; padding: 1.4rem 1.5rem; border-radius: 1.25rem; }
.ft-panel__head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.ft .f-head { margin-bottom: 1rem; padding-bottom: .6rem; }
.ft-more { font-size: .85rem; font-weight: 600; color: #5FD0E6; }
.ft-more:hover { color: #fff; }

.ft-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .15rem 1rem; }
@media (min-width: 640px) { .ft-links { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 992px) { .ft-links { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ft-link { display: flex; align-items: center; gap: .5rem; padding: .4rem 0; font-size: .9rem; line-height: 1.3; color: rgba(255,255,255,.82); transition: color .2s; }
.ft-link svg { width: .95rem; height: .95rem; flex-shrink: 0; color: #5FD0E6; }
.ft-link:hover { color: #fff; }

.ft-places { display: grid; gap: .1rem 1.25rem; }
@media (min-width: 640px) { .ft-places { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ft-place { display: grid; gap: .15rem; padding: .55rem 0; border-top: 1px solid rgba(255,255,255,.08); }
.ft-place:first-child { border-top: 0; padding-top: 0; }
@media (min-width: 640px) { .ft-place:nth-child(2) { border-top: 0; padding-top: 0; } }
.ft-place__name { font-weight: 600; font-size: .92rem; color: #fff; }
.ft-place__name:hover { color: #5FD0E6; }
.ft-place__meta { display: flex; align-items: center; gap: .4rem; font-size: .8rem; color: rgba(255,255,255,.6); }
.ft-place__meta svg { width: .85rem; height: .85rem; flex-shrink: 0; color: #F5B82E; }
.ft-place__links { font-size: .8rem; color: rgba(255,255,255,.4); }
.ft-place__links a { color: #5FD0E6; }
.ft-place__links a:hover { color: #fff; text-decoration: underline; }

.ft-bottom { position: relative; z-index: 1; border-top: 1px solid rgba(255,255,255,.1); background: #04122A; font-size: .82rem; color: rgba(255,255,255,.55); }
.ft-bottom__inner { display: flex; flex-direction: column; gap: .5rem; padding-top: 1rem; padding-bottom: .6rem; }
@media (min-width: 992px) { .ft-bottom__inner { flex-direction: row; justify-content: space-between; align-items: center; gap: 1.5rem; } }
.ft-bottom__links { display: flex; flex-wrap: wrap; gap: .3rem 1.1rem; }
.ft-bottom a { color: rgba(255,255,255,.8); }
.ft-bottom a:hover { color: #fff; }
.ft-bottom__note { padding-bottom: 1rem; font-size: .75rem; line-height: 1.5; color: rgba(255,255,255,.4); }
@media (max-width: 1023.98px) { .ft-bottom__note { padding-bottom: 5.5rem; } }   /* room for the mobile action bar */

/* footer: a little tighter everywhere, and much tighter on phones */
.ft-main { padding-top: 1.75rem; padding-bottom: 1.5rem; }
.ft-panel { padding: 1.2rem 1.35rem; }
.ft .f-head { margin-bottom: .75rem; }
.ft-link { padding: .3rem 0; }
.ft-place { padding: .45rem 0; }
@media (max-width: 639.98px) {
  .ft-cta__inner { gap: .75rem; padding-top: 1.1rem; padding-bottom: 1.1rem; }
  .ft-cta__title { font-size: 1.05rem; }
  .ft-cta__text { display: none; }
  .ft-cta__actions { flex-wrap: nowrap; }
  .ft-btn { padding: .55rem .8rem; font-size: .85rem; white-space: nowrap; }
  .ft-main { gap: .9rem; padding-top: 1.25rem; padding-bottom: 1rem; }
  .ft-panel { padding: 1rem 1.1rem; border-radius: 1rem; }
  .ft-link { padding: .25rem 0; font-size: .84rem; }
  .ft-link svg { display: none; }
  .ft-place__links { display: none; }
  .ft-bottom__inner { gap: .3rem; }
  .ft-bottom__note { font-size: .7rem; }
}

/* footer clinics panel: two groups (Ahmedabad / visiting), icon + name + timing + small actions */
.ft-places { display: grid; gap: 1rem 1.25rem; }
@media (min-width: 640px) { .ft-places { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.ft-places__label { margin-bottom: .35rem; font-size: .7rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.45); }
.ft-places__group ul { display: grid; gap: .15rem; }
.ft-place { display: grid; grid-template-columns: 2.1rem minmax(0, 1fr); gap: .7rem; align-items: start; padding: .5rem .55rem; margin: 0 -.55rem; border: 0 !important; border-radius: .8rem; transition: background-color .2s; }
.ft-place:hover { background: rgba(255,255,255,.05); }
.ft-place__icon { width: 2.1rem; height: 2.1rem; display: grid; place-items: center; border-radius: .65rem; background: rgba(95,208,230,.12); color: #5FD0E6; }
.ft-place__icon svg { width: 1rem; height: 1rem; }
.ft-place__icon--online { background: rgba(37,211,102,.12); color: #4ADE80; }
.ft-place__icon--visit { background: rgba(245,184,46,.14); color: #F5B82E; }
.ft-place__body { min-width: 0; display: grid; gap: .15rem; }
.ft-place__name { font-weight: 600; font-size: .9rem; line-height: 1.35; color: #fff; }
.ft-place__links { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .3rem; }
.ft-place__links a { padding: .12rem .55rem; border-radius: .4rem; border: 1px solid rgba(95,208,230,.3); font-size: .74rem; font-weight: 600; color: #5FD0E6; text-decoration: none !important; transition: background-color .2s, color .2s; }
.ft-place__links a:hover { background: #0E7C99; border-color: #0E7C99; color: #fff; }
@media (max-width: 639.98px) { .ft-place__links { display: flex; } }


/* Pending details are hidden until "details to add" is clicked (adds .todos-on to <html>) */
.todo-only { display: none !important; }
.todos-on .ft-place__meta.todo-only { display: flex !important; }
.todo-fab-wrap { position: fixed; z-index: 60; left: 1.25rem; bottom: 5.5rem; display: inline-flex; align-items: center; gap: .35rem; }
@media (max-width: 1023.98px) { .todo-fab-wrap { left: .75rem; bottom: 5rem; } }
.todo-fab-wrap .todo-fab { position: static; }
.todo-fab-off { width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: 50%; background: #713F12; color: #FEF08A; font-size: 1rem; line-height: 1; border: 0; cursor: pointer; }
.todo-fab-off[hidden] { display: none; }


/* =====================================================================
   TREATMENT HERO ANIMATIONS — 2D line-art SVG in the hero frame (scratchpad tp_anim.py → treatment pages)
   ===================================================================== */
.tp-hero-anim__panel { position: relative; overflow: hidden; aspect-ratio: 16 / 9; border-radius: 1.45rem;
  background: radial-gradient(circle at 35% 40%, rgba(34,181,214,.16), transparent 55%), #07203F; }
.tp-hero-anim__panel::before { content: ""; position: absolute; inset: 0; opacity: .5;
  background-image: linear-gradient(rgba(127,227,247,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(127,227,247,.06) 1px, transparent 1px); background-size: 32px 32px; }
.ta { position: relative; display: block; width: 100%; height: 100%; }
.ta-line { fill: none; stroke: #7FE3F7; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.ta-brain { fill: rgba(34,181,214,.14); stroke: #7FE3F7; stroke-width: 2.4; stroke-linejoin: round; }
.ta-folds path { fill: none; stroke: #7FE3F7; stroke-width: 1.8; stroke-linecap: round; opacity: .45; }
.ta-net { fill: none; stroke: #22B5D6; stroke-width: 1.5; stroke-dasharray: 4 5; opacity: .75; }
.ta-nodes circle { fill: #07203F; stroke: #7FE3F7; stroke-width: 2.2; }
.ta-core { fill: #F5B82E; }
.ta-runner { fill: #F5B82E; filter: drop-shadow(0 0 4px rgba(245,184,46,.8)); }
.ta-burst circle { fill: none; stroke: #F5B82E; stroke-width: 2.4; transform-box: fill-box; transform-origin: center; animation: taBurst 2.4s ease-out infinite; }
.ta-burst circle:nth-child(2) { animation-delay: .8s; }
.ta-burst circle:nth-child(3) { animation-delay: 1.6s; }
.ta-wire { fill: none; stroke: #F5B82E; stroke-width: 2; stroke-dasharray: 3 7; stroke-linecap: round; opacity: .8; animation: taFlow 1.2s linear infinite; }
.ta-monitor rect { fill: #0B2C55; stroke: #7FE3F7; stroke-width: 2.2; }
.ta-monitor .ta-screen { fill: #061A36; stroke: rgba(127,227,247,.35); stroke-width: 1.4; }
.ta-monitor text { font: 700 11px 'Plus Jakarta Sans', sans-serif; letter-spacing: .16em; fill: rgba(127,227,247,.75); }
.ta-live { fill: #F87171; animation: taBlink 1.4s ease-in-out infinite; }
.ta-trace { fill: none; stroke: #5FD0E6; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; animation: taTrace 3.2s ease-in-out infinite; }
.ta-stand { fill: none; stroke: #7FE3F7; stroke-width: 2.2; stroke-linecap: round; opacity: .6; }
.ta-stars circle { fill: #7FE3F7; animation: taBlink 3s ease-in-out infinite; }
.ta-stars circle:nth-child(2n) { animation-delay: 1.2s; }
.ta-stars circle:nth-child(3n) { animation-delay: 2s; fill: #F5B82E; }
.ta-draw { stroke-dasharray: 1; stroke-dashoffset: 1; animation: taDraw 1.8s ease forwards; }
.ta-draw--2 { animation-delay: .5s; }
@keyframes taDraw { to { stroke-dashoffset: 0; } }
@keyframes taTrace { 0% { stroke-dashoffset: 1; } 55%, 80% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -1; } }
@keyframes taBurst { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(3.4); opacity: 0; } }
@keyframes taFlow { to { stroke-dashoffset: -20; } }
@keyframes taBlink { 50% { opacity: .25; } }
@media (prefers-reduced-motion: reduce) {
  .ta *, .ta { animation: none !important; }
  .ta-draw, .ta-trace { stroke-dashoffset: 0; }
  .ta-burst, .ta-runner { display: none; }
}

/* no frame around the animation — it sits straight on the hero background */
.tp-hero-figure.tp-hero-anim { padding: 0; background: none; box-shadow: none; border-radius: 0; }
.tp-hero-anim__panel { overflow: visible; border-radius: 0; background: none; }
.tp-hero-anim__panel::before { display: none; }


/* =====================================================================
   EXPLAINER — multi-step isometric SVG animation (treatment pages; tp_steps.py)
   Stage with status bar + SVG + caption + arrows/dots · numbered steps grouped by phase
   ===================================================================== */
.mx { display: grid; gap: 1.75rem; margin-top: 2.75rem; align-items: start; }
@media (min-width: 1024px) { .mx { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 2.5rem; } }
.mx-stage-wrap { margin: 0; padding: 1.25rem; border-radius: 1.5rem; background: #fff; border: 1px solid #E2E8F0; box-shadow: 0 30px 60px -48px rgba(11,44,85,.55); }
@media (min-width: 640px) { .mx-stage-wrap { padding: 1.5rem 1.75rem; } }

/* status: step n / total · phase · title · progress */
.mx-status { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .25rem 1rem; align-items: center; }
.mx-status__now { display: flex; align-items: baseline; gap: .3rem; font-size: .8rem; font-weight: 600; color: #64748B; }
.mx-status__now b { font: 800 1.9rem/1 'Poppins', sans-serif; color: #0E7C99; }
.mx-status__name small { display: block; font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #D99A0B; }
.mx-status__name strong { display: block; font: 600 1.15rem/1.3 'Poppins', sans-serif; color: #061A36; }
.mx-status__bar { grid-column: 1 / -1; height: 4px; margin-top: .6rem; border-radius: 4px; background: #E6F4F8; overflow: hidden; }
.mx-status__bar i { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, #0E7C99, #22B5D6); transition: width .5s ease; }

.mx-svg { display: block; width: 100%; height: auto; margin-top: .5rem; }
.mx-caption { min-height: 3.3em; margin-top: .25rem; font-size: 1rem; line-height: 1.65; color: #334155; }
.mx-nav { margin-top: 1rem; display: flex; align-items: center; justify-content: center; gap: .9rem; }
.mx-arrow, .mx-play { width: 2.6rem; height: 2.6rem; display: grid; place-items: center; border-radius: 50%; border: 1px solid #CBD5E1; background: #fff; color: #0B2C55; transition: background-color .2s, color .2s, border-color .2s; }
.mx-arrow:hover, .mx-play:hover { background: #0B2C55; border-color: #0B2C55; color: #fff; }
.mx-arrow svg, .mx-play svg { width: 1.1rem; height: 1.1rem; }
.mx-dots { display: flex; gap: .4rem; }
.mx-dots i { width: .5rem; height: .5rem; border-radius: 50%; background: #CBD5E1; transition: background-color .3s, width .3s; }
.mx-dots i.is-on { width: 1.4rem; border-radius: 99px; background: #0E7C99; }

/* steps list */
.mx-steps { position: relative; display: grid; gap: 1.25rem; padding-left: 1.4rem; }
.mx-rail { position: absolute; left: .35rem; top: .5rem; bottom: .5rem; width: 3px; border-radius: 3px; background: #E2E8F0; overflow: hidden; }
.mx-rail i { display: block; width: 100%; height: 0; background: linear-gradient(180deg, #0E7C99, #F5B82E); transition: height .5s ease; }
.mx-phase { display: flex; align-items: center; gap: .55rem; margin-bottom: .5rem; font-size: .78rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #0B2C55; }
.mx-phase__ic { width: 1.8rem; height: 1.8rem; display: grid; place-items: center; border-radius: .55rem; background: #0B2C55; color: #fff; }
.mx-phase__ic svg { width: .95rem; height: .95rem; }
.mx-group ol { display: grid; gap: .3rem; }
.mx-step { width: 100%; display: flex; align-items: center; gap: .7rem; padding: .55rem .7rem; border-radius: .8rem; border: 1px solid transparent; background: none; text-align: left; color: #334155; transition: background-color .25s, border-color .25s, color .25s; }
.mx-step:hover { background: #F3F7FA; }
.mx-step__no { width: 1.7rem; height: 1.7rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: #EEF2F6; font: 700 .8rem/1 'Poppins', sans-serif; color: #475569; transition: background-color .25s, color .25s; }
.mx-step__label { flex: 1; min-width: 0; font-weight: 600; font-size: .95rem; line-height: 1.35; }
.mx-step svg { width: 1.05rem; height: 1.05rem; flex-shrink: 0; color: #94A3B8; }
.mx-step.is-done .mx-step__no { background: #E6F4F8; color: #0E7C99; }
.mx-step.is-active { background: #fff; border-color: rgba(14,124,153,.35); box-shadow: 0 12px 26px -20px rgba(11,44,85,.6); color: #061A36; }
.mx-step.is-active .mx-step__no { background: linear-gradient(145deg, #0E7C99, #22B5D6); color: #fff; }
.mx-step.is-active svg { color: #0E7C99; }
@media (max-width: 1023.98px) {
  .mx-steps { padding-left: 0; }
  .mx-rail { display: none; }
  .mx-group ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639.98px) {
  .mx-group ol { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- SVG scene ---------- */
.mx-top { fill: url(#mx-top); }
.mx-side-l { fill: #C4E0EA; }
.mx-side-r { fill: #A9D2E0; }
.mx-grid { fill: none; stroke: rgba(14,124,153,.12); stroke-width: 1; }
.mx-shadow { fill: rgba(11,44,85,.22); }
.mx-shadow-s { fill: rgba(11,44,85,.12); }
.mx-ped { fill: url(#mx-ped); }
.mx-ped-top { fill: #EAF6FA; stroke: #9CC9DA; stroke-width: 1.2; }
.mx-head-back { fill: #9CC9DA; stroke: #0B2C55; stroke-width: 3; stroke-linejoin: round; }
.mx-head { fill: none; stroke: #0B2C55; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.mx-head-shine { fill: none; stroke: #fff; stroke-width: 6; stroke-linecap: round; opacity: .8; }
.mx-brain { fill: url(#mx-brain); stroke: #B5546D; stroke-width: 2.6; stroke-linejoin: round; }
.mx-folds path { fill: none; stroke: #A84862; stroke-width: 1.8; stroke-linecap: round; opacity: .5; }
.mx-folds .mx-sulcus { stroke-width: 2.6; opacity: .75; }
.mx-brain-gloss, .mx-head-shade { pointer-events: none; }
.mx-brain-gloss { fill: url(#mx-gloss); }
.mx-head-shade { fill: url(#mx-shade); }
.mx-face path { fill: none; stroke: #0B2C55; stroke-width: 2.2; stroke-linecap: round; opacity: .55; }
.mx-stem { fill: #E9A5B5; stroke: #B5546D; stroke-width: 2; }
.mx-cbl { fill: #E38AA0; stroke: #B5546D; stroke-width: 2.2; stroke-linejoin: round; }
.mx-cbl-lines path { fill: none; stroke: #A84862; stroke-width: 1.4; opacity: .55; }
.mx-net { fill: none; stroke: #0E7C99; stroke-width: 2; stroke-dasharray: 5 6; opacity: .7; }
.mx-dot { fill: #0E7C99; }
.mx-vessel { fill: none; stroke: #DC2626; stroke-width: 3; stroke-linecap: round; opacity: .85; animation: mxSwell 1.6s ease-in-out infinite; }
.mx-vessel--2 { animation-delay: .4s; }
.mx-nerve { fill: none; stroke: #F5B82E; stroke-width: 3.2; stroke-linecap: round; stroke-dasharray: 8 6; animation: mxFlow .9s linear infinite; filter: drop-shadow(0 0 3px rgba(245,184,46,.8)); }
.mx-pain { transform-box: fill-box; transform-origin: center; animation: mxThrob 1.1s ease-in-out infinite; }
.mx-waves path { fill: none; stroke: #EF4444; stroke-width: 4; stroke-linecap: round; opacity: 0; animation: mxWave 1.8s ease-out infinite; }
.mx-waves path:nth-child(2) { animation-delay: .3s; }
.mx-waves path:nth-child(3) { animation-delay: .6s; }
.mx-bubble circle { fill: #fff; stroke: #CFE3EC; stroke-width: 2; }
.mx-bubble text, .mx-note { font: 600 13px 'Plus Jakarta Sans', sans-serif; fill: #334155; }
.mx-note { font-weight: 500; fill: #64748B; }
.mx-ic path, .mx-ic circle { fill: none; stroke: #D97706; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.mx-bubble { animation: mxFloat 3.2s ease-in-out infinite; }
.mx-bubble:nth-of-type(2n) { animation-delay: -1.6s; }
.mx-flow { fill: none; stroke: #F5B82E; stroke-width: 2.4; stroke-dasharray: 4 7; stroke-linecap: round; animation: mxFlow 1s linear infinite; }
.mx-chip rect { fill: #fff; stroke: #D6E6EE; stroke-width: 1.5; }
.mx-chip circle { fill: #0E7C99; }
.mx-chip text { font: 600 13px 'Plus Jakarta Sans', sans-serif; fill: #0B2C55; }
.mx-chip--red rect { fill: #FEF2F2; stroke: #FECACA; } .mx-chip--red circle { fill: #DC2626; } .mx-chip--red text { fill: #991B1B; }
.mx-chip--amber rect { fill: #FFF8E6; stroke: rgba(245,184,46,.5); } .mx-chip--amber circle { fill: #D99A0B; } .mx-chip--amber text { fill: #7C5A0B; }
.mx-aura { fill: none; stroke: url(#mx-aura); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 26 10; animation: mxShimmer 1.2s linear infinite; }
.mx-aura--2 { opacity: .7; animation-duration: 1.6s; }
.mx-spark path { fill: none; stroke: #F5B82E; stroke-width: 2.4; stroke-linecap: round; animation: mxBlink 1.2s ease-in-out infinite; }
.mx-spark path:nth-child(2) { animation-delay: .4s; } .mx-spark path:nth-child(3) { animation-delay: .8s; }
.mx-cal__card { fill: #fff; stroke: #D6E6EE; stroke-width: 1.5; }
.mx-cal__top { fill: #0B2C55; }
.mx-cal__title { font: 700 11px 'Plus Jakarta Sans', sans-serif; letter-spacing: .14em; fill: #fff; }
.mx-cal__day { fill: #EEF2F6; }
.mx-layer.on .mx-cal__day--hit { animation: mxPop .4s ease both; animation-delay: var(--d); }
@keyframes mxPop { 0% { fill: #EEF2F6; } 100% { fill: #EF4444; } }
.mx-ring { fill: none; stroke: #D99A0B; stroke-width: 3; stroke-dasharray: 14 12; stroke-linecap: round; opacity: .8; animation: mxOrbit 2.4s linear infinite; }
.mx-ring--2 { stroke: #0E7C99; }
.mx-spin--rev .mx-ring { animation-direction: reverse; animation-duration: 1.8s; }
.mx-check circle { fill: #22C55E; }
.mx-check path { fill: none; stroke: #fff; stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; }

/* layers fade in/out with the step */
.mx-layer { opacity: 0; transition: opacity .55s ease; }
.mx-layer.on { opacity: 1; }
.mx-layer:not(.on) * { animation-play-state: paused; }

@keyframes mxSwell { 50% { stroke-width: 6; } }
@keyframes mxFlow { to { stroke-dashoffset: -28; } }
@keyframes mxThrob { 50% { transform: scale(1.12); opacity: .75; } }
@keyframes mxWave { 0% { opacity: 0; transform: translateX(-6px); } 30% { opacity: .9; } 100% { opacity: 0; transform: translateX(10px); } }
@keyframes mxFloat { 50% { transform: translateY(-6px); } }
@keyframes mxShimmer { to { stroke-dashoffset: -72; } }
@keyframes mxBlink { 50% { opacity: .2; } }
@keyframes mxOrbit { to { stroke-dashoffset: -104; } }
@media (prefers-reduced-motion: reduce) {
  .mx-svg * { animation: none !important; }
  .mx-layer { transition: none; }
  .mx-waves path { opacity: .8; }
  .mx-layer.on .mx-cal__day--hit { fill: #EF4444; }
}


/* =====================================================================
   TREATMENT PAGES v5 — sections between the explainer and "In children" (tp_v5.py, .nx-*)
   ===================================================================== */
.nx-num { flex-shrink: 0; min-width: 2.2rem; font: 700 .95rem/1.6 'Poppins', sans-serif; color: #0E7C99; letter-spacing: .02em; }

/* 02 what it is: heading | lead text, then a facts strip */
.nx-what__grid { display: grid; gap: 1rem 4rem; align-items: start; }
@media (min-width: 1024px) { .nx-what__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }
.nx-what__lead { margin-top: 1rem; font-size: 1.3rem; line-height: 1.6; font-weight: 500; color: #0B2C55; }
@media (min-width: 1024px) { .nx-what__lead { margin-top: 2.1rem; } }
.nx-facts { margin-top: 3rem; padding: 1.5rem; border-radius: 1.5rem; background: linear-gradient(135deg, #F3F8FB, #EAF4F8); display: grid; gap: 1.25rem; }
@media (min-width: 1024px) { .nx-facts { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; padding: 1.75rem 2rem; gap: 2rem; } }
.nx-facts__title { display: flex; align-items: center; gap: .7rem; font: 700 1.05rem/1.2 'Poppins', sans-serif; color: #061A36; }
@media (min-width: 1024px) { .nx-facts__title { flex-direction: column; align-items: flex-start; max-width: 6rem; } }
.nx-facts__title span { width: 2.6rem; height: 2.6rem; display: grid; place-items: center; border-radius: .8rem; background: #0B2C55; color: #fff; }
.nx-facts__title svg { width: 1.25rem; height: 1.25rem; }
.nx-facts__list { display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 1024px) { .nx-facts__list { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; } .nx-facts__list li { padding: 0 1.5rem; border-left: 1px solid #CFE0E8; } }
.nx-facts__ic { color: #0E7C99; }
.nx-facts__ic svg { width: 1.2rem; height: 1.2rem; }
.nx-facts__label { margin-top: .4rem; font-size: .7rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #64748B; }
.nx-facts__value { margin-top: .2rem; font-weight: 600; font-size: .95rem; line-height: 1.45; color: #061A36; }
.nx-facts__btn { justify-self: start; display: inline-flex; align-items: center; gap: .5rem; padding: .85rem 1.4rem; border-radius: 99px; background: #0B2C55; color: #fff; font-weight: 700; font-size: .95rem; white-space: nowrap; transition: background-color .2s; }
.nx-facts__btn:hover { background: #0E7C99; color: #fff; }
.nx-facts__btn svg { width: 1rem; height: 1rem; }

/* 03 symptoms: items on both sides of a head outline */
.nx-center-lead { margin-top: 1rem; }
.nx-map { margin-top: 3rem; display: grid; gap: 1.5rem; align-items: center; }
@media (min-width: 1024px) { .nx-map { grid-template-columns: minmax(0, 1fr) 380px minmax(0, 1fr); gap: 0; } }
.nx-map__fig { margin: 0 auto; width: min(100%, 280px); order: -1; }
@media (min-width: 1024px) { .nx-map__fig { width: 100%; grid-column: 2; grid-row: 1; } .nx-map__col--l { grid-column: 1; grid-row: 1; } .nx-map__col--r { grid-column: 3; grid-row: 1; } }
.nx-map__svg { display: block; width: 100%; height: auto; }
.nx-map__col { display: grid; gap: 1rem; }
.nx-map__item { position: relative; display: flex; align-items: center; gap: .9rem; font-weight: 600; font-size: 1rem; line-height: 1.45; color: #0B2C55; }
.nx-map__ic { width: 3rem; height: 3rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: #fff; border: 1.5px solid #CFE3EC; color: #0E7C99; box-shadow: 0 10px 24px -18px rgba(11,44,85,.6); }
.nx-map__ic svg { width: 1.25rem; height: 1.25rem; }
@media (min-width: 1024px) {
  .nx-map__col { gap: 2.25rem; }
  .nx-map__col--l .nx-map__item { flex-direction: row-reverse; text-align: right; padding-right: 3.5rem; }
  .nx-map__col--r .nx-map__item { padding-left: 3.5rem; }
  .nx-map__item::after { content: ""; position: absolute; top: 50%; width: 3rem; border-top: 2px dashed #9CC9DA; }
  .nx-map__col--l .nx-map__item::after { right: 0; }
  .nx-map__col--r .nx-map__item::after { left: 0; }
  .nx-map__col--l .nx-map__item:nth-child(2), .nx-map__col--l .nx-map__item:nth-child(3) { margin-right: -1.5rem; }
  .nx-map__col--r .nx-map__item:nth-child(2) { margin-left: -1.5rem; }
}
.nx-map__ring { fill: none; stroke: #CFE3EC; stroke-width: 1.5; stroke-dasharray: 4 8; }
.nx-map__brain { fill: #F7C6D1; stroke: #C26A80; stroke-width: 2; opacity: .75; }
.nx-map__pain { animation: mxThrob 1.6s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.nx-map__head { fill: none; stroke: #0B2C55; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.nx-map__face { fill: none; stroke: #0B2C55; stroke-width: 2.2; stroke-linecap: round; opacity: .5; }
.nx-map__aura { fill: none; stroke: #F5B82E; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.nx-map__waves path { fill: none; stroke: #EF4444; stroke-width: 3; stroke-linecap: round; opacity: .55; }
.nx-map__cta { margin-top: 2.5rem; text-align: center; color: #475569; font-size: 1rem; }
.nx-map__cta a { margin-left: .4rem; display: inline-flex; align-items: center; gap: .35rem; font-weight: 700; color: #0E7C99; }
.nx-map__cta svg { width: 1rem; height: 1rem; transition: transform .2s; }
.nx-map__cta a:hover svg { transform: translateX(3px); }

/* 04 when: one panel split into "book a visit" and "emergency" */
.nx-split { margin-top: 2.5rem; display: grid; border-radius: 1.75rem; overflow: hidden; border: 1px solid #E2E8F0; background: #fff; box-shadow: 0 30px 60px -50px rgba(11,44,85,.5); }
@media (min-width: 1024px) { .nx-split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .nx-split--single { grid-template-columns: 1fr; } }
.nx-split__side { padding: 1.75rem; }
@media (min-width: 640px) { .nx-split__side { padding: 2.5rem; } }
.nx-split__side--alert { background: linear-gradient(160deg, #FFF5F5, #FDECEC); border-top: 1px solid #FBD5D5; }
@media (min-width: 1024px) { .nx-split__side--alert { border-top: 0; border-left: 1px solid #FBD5D5; } }
.nx-split__title { display: flex; align-items: center; gap: .8rem; font: 700 1.2rem/1.3 'Poppins', sans-serif; color: #061A36; }
.nx-split__side--alert .nx-split__title { color: #991B1B; }
.nx-split__badge { width: 2.6rem; height: 2.6rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .8rem; background: #DC2626; color: #fff; }
.nx-split__badge--teal { background: #0E7C99; }
.nx-split__badge svg { width: 1.2rem; height: 1.2rem; }
.nx-numlist { margin-top: 1.25rem; }
.nx-numlist li { display: flex; gap: .75rem; padding: .85rem 0; border-bottom: 1px solid #E2E8F0; font-size: 1rem; line-height: 1.6; color: #334155; }
.nx-numlist li:last-child { border-bottom: 0; }
.nx-split__link { margin-top: 1rem; display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; color: #0E7C99; }
.nx-split__link svg { width: 1rem; height: 1rem; }
.nx-alert-list { margin-top: 1.25rem; display: grid; gap: .25rem; }
.nx-alert-list li { display: flex; gap: .75rem; padding: .65rem 0; border-bottom: 1px solid rgba(220,38,38,.14); font-size: 1rem; line-height: 1.55; color: #7F1D1D; }
.nx-alert-list li:last-child { border-bottom: 0; }
.nx-alert-list svg { width: 1.1rem; height: 1.1rem; flex-shrink: 0; margin-top: .2rem; color: #DC2626; }
.nx-split__call { margin-top: 1.25rem; display: inline-flex; align-items: center; gap: .5rem; padding: .75rem 1.25rem; border-radius: 99px; background: #DC2626; color: #fff; font-weight: 700; font-size: .95rem; }
.nx-split__call:hover { background: #B91C1C; color: #fff; }
.nx-split__call svg { width: 1rem; height: 1rem; }

/* 05 causes: numbered list + trigger icon row */
.nx-causes { display: grid; gap: 2rem 4rem; align-items: start; }
@media (min-width: 1024px) { .nx-causes { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }
.nx-numlist--cols { margin-top: 0; display: grid; column-gap: 2.5rem; }
@media (min-width: 640px) { .nx-numlist--cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } .nx-numlist--cols li:nth-last-child(2):nth-child(odd) { border-bottom: 0; } }
.nx-numlist--cols li { border-color: #D6E2EA; font-weight: 500; color: #0B2C55; }
.nx-triggers { margin-top: 3.5rem; padding-top: 2.5rem; border-top: 1px solid #D6E2EA; }
.nx-triggers__title { display: flex; align-items: center; gap: .5rem; font: 700 1.05rem/1.3 'Poppins', sans-serif; color: #061A36; }
.nx-triggers__title svg { width: 1.2rem; height: 1.2rem; color: #D99A0B; }
.nx-triggers__list { margin-top: 1.5rem; display: grid; grid-template-columns: repeat(auto-fit, minmax(6.2rem, 1fr)); gap: 1.5rem .75rem; }
.nx-triggers__list li { display: flex; flex-direction: column; align-items: center; gap: .7rem; text-align: center; font-size: .92rem; font-weight: 600; line-height: 1.35; color: #334155; }
.nx-triggers__ic { width: 3.6rem; height: 3.6rem; display: grid; place-items: center; border-radius: 50%; background: #FFF8E6; border: 1.5px solid rgba(245,184,46,.55); color: #B7791F; transition: transform .25s; }
.nx-triggers__list li:hover .nx-triggers__ic { transform: translateY(-4px); }
.nx-triggers__ic svg { width: 1.45rem; height: 1.45rem; }

/* 06 diagnosis: path of numbered nodes */
.nx-path { margin-top: 3.5rem; display: grid; gap: 2.25rem; position: relative; }
@media (min-width: 768px) {
  .nx-path { grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: 2rem; }
  .nx-path::before { content: ""; position: absolute; top: 2.25rem; left: 2.25rem; right: calc(100% / var(--n, 3) - 2.25rem); border-top: 2px dashed rgba(255,255,255,.25); }
}
.nx-path__step { position: relative; }
.nx-path__node { position: relative; width: 4.5rem; height: 4.5rem; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(145deg, #0E7C99, #22B5D6); color: #fff; box-shadow: 0 0 0 8px rgba(34,181,214,.12); }
.nx-path__node svg { width: 1.6rem; height: 1.6rem; }
.nx-path__node b { position: absolute; top: -.2rem; right: -.2rem; width: 1.6rem; height: 1.6rem; display: grid; place-items: center; border-radius: 50%; background: #F5B82E; color: #061A36; font: 700 .8rem/1 'Poppins', sans-serif; }
.nx-path__name { margin-top: 1.25rem; font: 600 1.2rem/1.3 'Poppins', sans-serif; color: #fff; }
.nx-path__text { margin-top: .4rem; font-size: 1rem; line-height: 1.6; color: rgba(255,255,255,.7); }

/* 08 living: habit row */
.nx-tips { margin-top: 3rem; display: grid; gap: 1.5rem .5rem; grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr)); }
@media (min-width: 1024px) { .nx-tips { gap: 0; grid-template-columns: repeat(var(--n, 5), minmax(0, 1fr)); } .nx-tips__item + .nx-tips__item { border-left: 1px solid #D6E2EA; } }
.nx-tips__item { display: flex; flex-direction: column; align-items: center; text-align: center; padding: .5rem .5rem 1rem; }
@media (min-width: 1024px) { .nx-tips__item { padding: .5rem 1.25rem 1rem; } }
.nx-tips__ic { width: 4.5rem; height: 4.5rem; display: grid; place-items: center; border-radius: 1.4rem; background: #fff; color: #0E7C99; box-shadow: 0 18px 36px -24px rgba(11,44,85,.55); transition: transform .25s, background-color .25s, color .25s; }
.nx-tips__item:hover .nx-tips__ic { transform: translateY(-4px); background: #0E7C99; color: #fff; }
.nx-tips__ic svg { width: 1.7rem; height: 1.7rem; }
.nx-tips__no { margin-top: 1.1rem; font-size: .72rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #D99A0B; }
.nx-tips__text { margin-top: .4rem; font-weight: 600; font-size: 1rem; line-height: 1.5; color: #0B2C55; }
@media (prefers-reduced-motion: reduce) { .nx-map__pain { animation: none; } }


/* =====================================================================
   TREATMENT PAGES v6 — headache types · threshold glass · diary · care cycle (tp_v6.py, .nv-*)
   ===================================================================== */
.nv-intro { display: grid; gap: 1rem 4rem; align-items: end; }
@media (min-width: 1024px) { .nv-intro { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }
.nv-intro__lead { font-size: 1.25rem; line-height: 1.65; font-weight: 500; color: #0B2C55; }
.nv-intro__lead--sm { font-size: 1.1rem; font-weight: 400; color: #475569; }
.nv-sub { margin-top: 3.5rem; display: flex; align-items: center; gap: 1rem; font-size: .78rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #64748B; }
.nv-sub::after { content: ""; flex: 1; height: 1px; background: #E2E8F0; }

/* headache types: head outlines */
.nv-types { margin-top: 2rem; display: grid; gap: 2.5rem 1rem; grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr)); }
@media (min-width: 1024px) { .nv-types { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; } }
.nv-types__item { text-align: center; }
.nv-head { display: block; width: min(100%, 210px); height: auto; margin: 0 auto; }
.nv-head__bg { fill: #F3F8FB; }
.nv-head__line { fill: none; stroke: #0B2C55; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.nv-head__face { fill: none; stroke: #0B2C55; stroke-width: 3; stroke-linecap: round; opacity: .5; }
.nv-pain { transform-box: fill-box; transform-origin: center; animation: mxThrob 1.6s ease-in-out infinite; }
.nv-pain--soft { opacity: .55; animation-duration: 2.4s; }
.nv-waves path { fill: none; stroke: #EF4444; stroke-width: 4; stroke-linecap: round; opacity: .55; }
.nv-band { fill: none; stroke: #EF4444; stroke-width: 10; stroke-dasharray: 18 10; opacity: .6; animation: mxFlow 1.4s linear infinite; }
.nv-tear { fill: #7DD3FC; stroke: #0E7C99; stroke-width: 2; }
.nv-pill rect { fill: #fff; stroke: #DC2626; stroke-width: 4; }
.nv-pill path { stroke: #DC2626; stroke-width: 4; }
.nv-types__name { margin-top: 1rem; font: 600 1.15rem/1.3 'Poppins', sans-serif; color: #061A36; }
.nv-types__text { margin: .5rem auto 0; max-width: 18rem; font-size: .97rem; line-height: 1.6; color: #475569; }

/* why it happens: threshold glass */
.nv-why { display: grid; gap: 2.5rem 4rem; align-items: center; }
@media (min-width: 1024px) { .nv-why { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); } }
.nv-why__lead { margin-top: 1.25rem; font-size: 1.1rem; line-height: 1.75; color: #334155; }
.nv-why .nx-triggers { margin-top: 2rem; padding-top: 1.75rem; }
.nv-why .nx-triggers__list { grid-template-columns: repeat(auto-fill, minmax(5.6rem, 1fr)); }
.nv-why__fig { margin: 0; }
.nv-glass { display: block; width: 100%; max-width: 560px; height: auto; margin: 0 auto; overflow: visible; }
.nv-glass__body { fill: rgba(255,255,255,.25); stroke: #0B2C55; stroke-width: 3; stroke-linejoin: round; }
.nv-glass__shine { stroke: #fff; stroke-width: 6; stroke-linecap: round; opacity: .7; }
.nv-glass__layer { stroke: rgba(255,255,255,.6); stroke-width: 2; transform-box: fill-box; transform-origin: bottom; transform: scaleY(0); transition: transform .6s cubic-bezier(.2,.8,.2,1); transition-delay: calc(var(--i) * .35s + .2s); }
.nv-glass__layer--risk { fill: #0B2C55; }
.nv-glass__layer--risk:nth-child(2) { fill: #1D4B7E; }
.nv-glass__layer--trig { fill: #0E7C99; }
.nv-glass__layer--trig:nth-child(4) { fill: #1599B8; }
.nv-glass__layer--trig:nth-child(5) { fill: #E8A317; }
.nv-glass__layer--trig:nth-child(6) { fill: #E2554F; }
.nv-glass__label { font: 600 14px 'Plus Jakarta Sans', sans-serif; fill: #fff; opacity: 0; transition: opacity .4s; transition-delay: calc(var(--i) * .35s + .55s); }
.nv-glass__thr { stroke: #DC2626; stroke-width: 2.5; stroke-dasharray: 8 6; }
.nv-glass__thr-t { font: 700 13px 'Plus Jakarta Sans', sans-serif; fill: #B91C1C; }
.nv-glass__burst { opacity: 0; transform-box: fill-box; transform-origin: center; transform: scale(.4); transition: opacity .4s 2.5s, transform .5s 2.5s cubic-bezier(.3,1.6,.5,1); }
.nv-glass__burst circle { fill: #DC2626; }
.nv-glass__burst path { stroke: #fff; stroke-width: 5; stroke-linecap: round; }
.nv-glass__brace { fill: none; stroke: #0B2C55; stroke-width: 2; opacity: .5; }
.nv-glass__brace--trig { stroke: #0E7C99; }
.nv-glass__side { font: 700 14px 'Poppins', sans-serif; fill: #0B2C55; }
.nv-glass__side--s { font: 500 12px 'Plus Jakarta Sans', sans-serif; fill: #64748B; }
.nv-glass__side--trig { fill: #0E7C99; }
.aos-animate .nv-glass__layer { transform: none; }
.aos-animate .nv-glass__label { opacity: 1; }
.aos-animate .nv-glass__burst { opacity: 1; transform: none; }
.nv-why__cap { margin-top: .75rem; text-align: center; font-size: .85rem; color: #64748B; }

/* finding the cause: diary + steps */
.nv-diag { margin-top: 3rem; display: grid; gap: 2.5rem 4rem; align-items: center; }
@media (min-width: 1024px) { .nv-diag { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); } }
.nv-diary { margin: 0; padding: 1.5rem; border-radius: 1.5rem; background: #FFFDF6; border: 1px solid #F1E3BC; box-shadow: 0 30px 60px -45px rgba(11,44,85,.5); transform: rotate(-1.2deg); background-image: repeating-linear-gradient(transparent 0 46px, rgba(217,154,11,.12) 46px 47px); }
@media (min-width: 640px) { .nv-diary { padding: 2rem; } }
.nv-diary__head { display: flex; align-items: center; gap: .9rem; }
.nv-diary__head > span { width: 2.8rem; height: 2.8rem; display: grid; place-items: center; border-radius: .8rem; background: #F5B82E; color: #061A36; }
.nv-diary__head svg { width: 1.3rem; height: 1.3rem; }
.nv-diary__title { font: 700 1.15rem/1.2 'Poppins', sans-serif; color: #061A36; }
.nv-diary__sub { margin-top: .15rem; font-size: .82rem; color: #8A6D1F; }
.nv-diary__cols, .nv-diary__rows li { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr) minmax(0, 1.2fr); gap: .75rem; align-items: center; }
.nv-diary__cols { margin-top: 1.5rem; padding-bottom: .5rem; border-bottom: 2px solid #F1E3BC; font-size: .7rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #8A6D1F; }
.nv-diary__rows li { padding: .8rem 0; border-bottom: 1px dashed #EAD9A8; }
.nv-diary__day { font-weight: 700; font-size: .92rem; color: #0B2C55; }
.nv-diary__day small { display: block; font-weight: 500; font-size: .75rem; color: #64748B; }
.nv-diary__pain { display: flex; align-items: center; gap: .5rem; }
.nv-diary__pain i { flex: 1; height: .5rem; border-radius: 99px; background: linear-gradient(90deg, #22B5D6 var(--v), #EEF2F6 var(--v)); }
.nv-diary__pain i.is-mid { background: linear-gradient(90deg, #F5B82E var(--v), #EEF2F6 var(--v)); }
.nv-diary__pain i.is-high { background: linear-gradient(90deg, #EF4444 var(--v), #EEF2F6 var(--v)); }
.nv-diary__pain b { font-size: .8rem; color: #334155; }
.nv-diary__trig { font-size: .9rem; color: #334155; font-style: italic; }
.nv-diary__foot { margin-top: 1rem; display: flex; align-items: center; gap: .5rem; font-size: .88rem; color: #8A6D1F; }
.nv-diary__foot svg { width: 1rem; height: 1rem; }
.nv-steps { display: grid; }
.nv-steps li { display: flex; gap: 1.1rem; padding: 1.25rem 0; border-bottom: 1px solid #E2E8F0; }
.nv-steps li:first-child { padding-top: 0; }
.nv-steps li:last-child { border-bottom: 0; }
.nv-steps__ic { width: 3rem; height: 3rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: #E6F4F8; color: #0E7C99; }
.nv-steps__ic svg { width: 1.3rem; height: 1.3rem; }
.nv-steps__name { font: 600 1.1rem/1.35 'Poppins', sans-serif; color: #061A36; }
.nv-steps__text { margin-top: .3rem; font-size: .98rem; line-height: 1.6; color: #475569; }
.nv-tag { display: inline-block; margin-left: .35rem; padding: .15rem .55rem; border-radius: 99px; background: #FFF4D6; color: #8A6D1F; font: 700 .68rem/1.4 'Plus Jakarta Sans', sans-serif; letter-spacing: .06em; text-transform: uppercase; vertical-align: middle; }

/* treatment: care cycle */
.nv-cycle { margin-top: 3.5rem; display: grid; gap: 1.75rem; align-items: center; }
@media (min-width: 1024px) { .nv-cycle { grid-template-columns: minmax(0, 1fr) 300px minmax(0, 1fr); gap: 2.5rem; } }
.nv-cycle__col { display: grid; gap: 1.75rem; }
@media (min-width: 1024px) { .nv-cycle__col { gap: 3.5rem; } }
.nv-cycle__item { display: flex; gap: 1rem; align-items: flex-start; }
@media (min-width: 1024px) { .nv-cycle__col--l .nv-cycle__item { flex-direction: row-reverse; text-align: right; } }
.nv-cycle__ic { width: 3.6rem; height: 3.6rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 1.1rem; background: #fff; color: #0E7C99; box-shadow: 0 18px 36px -24px rgba(11,44,85,.55); transition: background-color .25s, color .25s; }
.nv-cycle__item:hover .nv-cycle__ic { background: #0E7C99; color: #fff; }
.nv-cycle__ic svg { width: 1.5rem; height: 1.5rem; }
.nv-cycle__no { font-size: .72rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #D99A0B; }
.nv-cycle__name { margin-top: .25rem; font: 600 1.15rem/1.3 'Poppins', sans-serif; color: #061A36; }
.nv-cycle__text { margin-top: .35rem; font-size: .98rem; line-height: 1.6; color: #475569; }
.nv-cycle__hub { position: relative; width: min(100%, 300px); margin: 0 auto; aspect-ratio: 1; order: -1; }
@media (min-width: 1024px) { .nv-cycle__hub { order: 0; } }
.nv-cycle__ring { position: absolute; inset: 0; width: 100%; height: 100%; }
.nv-cycle__track { fill: #fff; stroke: #DCEBF1; stroke-width: 10; }
.nv-cycle__spin { transform-origin: 120px 120px; animation: nvSpin 14s linear infinite; }
.nv-cycle__arc { fill: none; stroke: #0E7C99; stroke-width: 5; stroke-linecap: round; stroke-dasharray: 260 67; }
.nv-cycle__head { fill: none; stroke: #0E7C99; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }
.nv-cycle__core { position: absolute; inset: 22%; display: grid; place-content: center; justify-items: center; gap: .6rem; border-radius: 50%; background: linear-gradient(145deg, #0B2C55, #0E7C99); color: #fff; text-align: center; box-shadow: 0 20px 40px -20px rgba(11,44,85,.7); }
.nv-cycle__core svg { width: 1.8rem; height: 1.8rem; color: #F5B82E; }
.nv-cycle__core p { font: 600 .98rem/1.35 'Poppins', sans-serif; }
.nv-cycle__foot { margin-top: 3rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1rem 1.5rem; }
.nv-cycle__warn { display: flex; align-items: center; gap: .5rem; font-size: .95rem; color: #8A6D1F; }
.nv-cycle__warn svg { width: 1.1rem; height: 1.1rem; flex-shrink: 0; color: #D99A0B; }
@keyframes nvSpin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .nv-pain, .nv-band, .nv-cycle__spin { animation: none; }
  .nv-glass__layer, .nv-glass__label, .nv-glass__burst { transition: none; }
}


/* ---------- v6: trigger chips + everyday tips as a day timeline ---------- */
.nx-chips { margin-top: 1.1rem; display: flex; flex-wrap: wrap; gap: .55rem; }
.nx-chips li { display: inline-flex; align-items: center; gap: .45rem; padding: .5rem .9rem .5rem .7rem; border-radius: 99px; background: #fff; border: 1px solid #E5D3A1; font-size: .9rem; font-weight: 600; color: #5B4512; box-shadow: 0 8px 18px -16px rgba(11,44,85,.5); }
.nx-chips svg { width: 1rem; height: 1rem; color: #D99A0B; }
.nv-why .nx-triggers { margin-top: 1.75rem; padding-top: 1.5rem; }

.nv-day { position: relative; margin-top: 3.5rem; }
.nv-day__track { display: none; }
.nv-day__stops { display: grid; gap: 0; position: relative; }
.nv-day__stop { position: relative; display: grid; grid-template-columns: 3.4rem minmax(0, 1fr); column-gap: 1.1rem; padding-bottom: 1.75rem; }
.nv-day__stop::before { content: ""; position: absolute; left: 1.7rem; top: 3.4rem; bottom: 0; width: 2px; transform: translateX(-1px); background: linear-gradient(#F5B82E, #0E7C99); opacity: .45; }
.nv-day__stop:last-child::before { display: none; }
.nv-day__dot { grid-row: span 3; width: 3.4rem; height: 3.4rem; display: grid; place-items: center; border-radius: 50%; background: #fff; border: 2px solid var(--c, #0E7C99); color: var(--c, #0E7C99); box-shadow: 0 0 0 6px #fff, 0 14px 28px -18px rgba(11,44,85,.6); transition: background-color .25s, color .25s; }
.nv-day__stop:hover .nv-day__dot { background: var(--c, #0E7C99); color: #fff; }
.nv-day__dot svg { width: 1.4rem; height: 1.4rem; }
.nv-day__stop:nth-child(1) { --c: #E8A317; }
.nv-day__stop:nth-child(2) { --c: #D97706; }
.nv-day__stop:nth-child(3) { --c: #0E7C99; }
.nv-day__stop:nth-child(4) { --c: #1D4B7E; }
.nv-day__stop:nth-child(5) { --c: #0B2C55; }
.nv-day__time { align-self: end; font-size: .72rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--c); }
.nv-day__name { margin-top: .15rem; font: 600 1.1rem/1.3 'Poppins', sans-serif; color: #061A36; }
.nv-day__text { margin-top: .3rem; font-size: .95rem; line-height: 1.55; color: #475569; }
@media (min-width: 1024px) {
  .nv-day__track { display: flex; align-items: center; gap: 1rem; position: absolute; left: 0; right: 0; top: 1.7rem; transform: translateY(-50%); }
  .nv-day__track span { flex: 1; height: 4px; border-radius: 4px; background: linear-gradient(90deg, #F5B82E, #F59E0B 25%, #22B5D6 50%, #1D4B7E 75%, #0B2C55); opacity: .35; }
  .nv-day__track svg { width: 1.6rem; height: 1.6rem; flex-shrink: 0; }
  .nv-day__track svg:first-child { color: #E8A317; }
  .nv-day__track svg:last-child { color: #0B2C55; }
  .nv-day__stops { grid-template-columns: repeat(var(--n, 5), minmax(0, 1fr)); padding: 0 2.6rem; gap: 1.5rem; }
  .nv-day__stop { display: flex; flex-direction: column; align-items: center; text-align: center; padding-bottom: 0; }
  .nv-day__stop::before { display: none; }
  .nv-day__dot { grid-row: auto; }
  .nv-day__time { margin-top: 1.1rem; align-self: center; }
}
.nv-day__note { margin: 2.75rem auto 0; max-width: 46rem; display: flex; align-items: center; gap: .9rem; padding: 1rem 1.25rem; border-radius: 1rem; background: #FEF2F2; color: #7F1D1D; font-size: .98rem; line-height: 1.55; }
.nv-day__note span { width: 2.4rem; height: 2.4rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .7rem; background: #DC2626; color: #fff; }
.nv-day__note svg { width: 1.1rem; height: 1.1rem; }
.nv-day__note strong { color: #991B1B; }
.nv-day__note em { font-style: normal; }

/* Two white sections in a row share one gap instead of two paddings */
.tp-band:not(.section--mist):not(.tp-dark) + .tp-band:not(.section--mist):not(.tp-dark) { padding-top: 0; }


/* =====================================================================
   TREATMENT PAGES v7 — children · where to consult · FAQ · related (tp_v7.py, .nw-*)
   ===================================================================== */
.nw-link { display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; color: #0E7C99; white-space: nowrap; }
.nw-link svg { width: 1rem; height: 1rem; transition: transform .2s; }
.nw-link:hover { color: #0B2C55; }
.nw-link:hover svg { transform: translateX(3px); }
.nv-intro__lead .nw-link { margin-left: .4rem; }
.nw-btn { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; padding: .7rem 1.2rem; border-radius: 99px; background: #0B2C55; color: #fff; font-weight: 700; font-size: .92rem; white-space: nowrap; border: 1.5px solid #0B2C55; transition: background-color .2s, color .2s, border-color .2s; }
.nw-btn:hover { background: #0E7C99; border-color: #0E7C99; color: #fff; }
.nw-btn svg { width: 1rem; height: 1rem; }
.nw-btn--ghost { background: transparent; color: #0B2C55; border-color: #CBD5E1; }
.nw-btn--ghost:hover { background: #F3F7FA; border-color: #0B2C55; color: #0B2C55; }
.nw-btn--light { background: #fff; color: #0B2C55; border-color: #fff; }
.nw-btn--light:hover { background: #F5B82E; border-color: #F5B82E; color: #061A36; }
.nw-btn--wa { background: #25D366; border-color: #25D366; }
.nw-btn--wa:hover { background: #1EB457; border-color: #1EB457; }

/* children */
.nw-kids__grid { display: grid; gap: 2.5rem 4rem; align-items: center; }
@media (min-width: 1024px) { .nw-kids__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } }
.nw-kids__lead { margin-top: 1.25rem; font-size: 1.2rem; line-height: 1.6; font-weight: 500; color: #0B2C55; }
.nw-kids__creds { margin-top: 1.5rem; display: flex; flex-wrap: wrap; gap: .6rem; }
.nw-kids__creds span { display: inline-flex; align-items: center; gap: .45rem; padding: .5rem .9rem; border-radius: 99px; background: #fff; border: 1px solid #D6E2EA; font-size: .88rem; font-weight: 700; color: #0B2C55; }
.nw-kids__creds svg { width: 1rem; height: 1rem; color: #0E7C99; }
.nw-kids__grid > div > .nw-link { margin-top: 1.5rem; }
.nw-kids__check { padding: 2rem; border-radius: 1.75rem; background: linear-gradient(160deg, #FFF8E6, #FFF1D0); border: 1px solid rgba(245,184,46,.45); }
.nw-kids__check-title { font: 700 1.15rem/1.35 'Poppins', sans-serif; color: #061A36; }
.nw-kids__check ul { margin-top: 1.25rem; }
.nw-kids__check li { display: flex; align-items: center; gap: .85rem; padding: .8rem 0; border-bottom: 1px dashed rgba(217,154,11,.35); font-weight: 600; font-size: 1rem; line-height: 1.45; color: #5B4512; }
.nw-kids__check li:last-child { border-bottom: 0; }
.nw-kids__check li span { width: 2.5rem; height: 2.5rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: #fff; color: #D97706; box-shadow: 0 8px 18px -14px rgba(11,44,85,.5); }
.nw-kids__check li svg { width: 1.15rem; height: 1.15rem; }
.nw-kids__btn { margin-top: 1.25rem; display: inline-flex; align-items: center; gap: .45rem; padding: .8rem 1.3rem; border-radius: 99px; background: #061A36; color: #fff; font-weight: 700; font-size: .95rem; }
.nw-kids__btn:hover { background: #0E7C99; color: #fff; }
.nw-kids__btn svg { width: 1rem; height: 1rem; }

/* where to consult: one list of places */
.nw-places { margin-top: 2.75rem; border-top: 1px solid #E2E8F0; }
.nw-place { display: grid; grid-template-columns: 3.2rem minmax(0, 1fr); gap: .9rem 1.25rem; align-items: center; padding: 1.6rem 0; border-bottom: 1px solid #E2E8F0; }
@media (min-width: 1024px) { .nw-place { grid-template-columns: 3.6rem minmax(0, 1.6fr) minmax(0, .8fr) auto; gap: 2rem; padding: 1.75rem .5rem; transition: background-color .25s; } .nw-place:hover { background: #F8FBFC; } }
.nw-place__ic { width: 3.2rem; height: 3.2rem; display: grid; place-items: center; border-radius: 1rem; background: #E6F4F8; color: #0E7C99; }
@media (min-width: 1024px) { .nw-place__ic { width: 3.6rem; height: 3.6rem; } }
.nw-place__ic--online { background: #0B2C55; color: #fff; }
.nw-place__ic svg { width: 1.4rem; height: 1.4rem; }
.nw-place__area { font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #0E7C99; }
.nw-place__name { margin-top: .2rem; font: 600 1.2rem/1.3 'Poppins', sans-serif; color: #061A36; }
.nw-place__addr { margin-top: .3rem; font-size: .95rem; line-height: 1.55; color: #64748B; }
.nw-place__time { grid-column: 2; display: flex; align-items: flex-start; gap: .5rem; font-size: .9rem; color: #475569; }
.nw-place__time svg { width: 1rem; height: 1rem; flex-shrink: 0; margin-top: .15rem; color: #0E7C99; }
.nw-place__time b { display: block; font-weight: 600; color: #0B2C55; }
.nw-place__act { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: .6rem; }
@media (min-width: 640px) { .nw-place__act { grid-column: 2; } }
@media (min-width: 1024px) { .nw-place__time { grid-column: auto; } .nw-place__act { grid-column: auto; justify-content: flex-end; } }

/* FAQ: heading + help card | hairline accordion */
.nw-faq { display: grid; gap: 2.5rem 4rem; align-items: start; }
@media (min-width: 1024px) { .nw-faq { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }
.nw-ask { margin-top: 2rem; padding: 1.75rem; border-radius: 1.5rem; background: linear-gradient(150deg, #061A36, #0B2C55 60%, #0E7C99 140%); color: #fff; }
.nw-ask__ic { width: 2.8rem; height: 2.8rem; display: grid; place-items: center; border-radius: .9rem; background: rgba(255,255,255,.12); color: #F5B82E; }
.nw-ask__ic svg { width: 1.3rem; height: 1.3rem; }
.nw-ask__title { margin-top: 1rem; font: 600 1.2rem/1.3 'Poppins', sans-serif; }
.nw-ask__text { margin-top: .4rem; font-size: .95rem; line-height: 1.6; color: rgba(255,255,255,.72); }
.nw-ask__btns { margin-top: 1.25rem; display: flex; flex-wrap: wrap; gap: .6rem; }
.nw-faq__list { border-top: 1px solid #D6E2EA; }
.nw-faq__item { border-bottom: 1px solid #D6E2EA; transition: background-color .25s; }
.nw-faq__item.open { background: transparent; box-shadow: none; }
.nw-faq__btn { width: 100%; display: flex; align-items: center; gap: 1rem; padding: 1.4rem 0; background: none; border: 0; text-align: left; }
.nw-faq__no { flex-shrink: 0; font: 700 .9rem/1 'Poppins', sans-serif; color: #94A3B8; transition: color .25s; }
.nw-faq__q { flex: 1; font: 600 1.08rem/1.45 'Poppins', sans-serif; color: #061A36; }
.nw-faq__icon { width: 2.4rem; height: 2.4rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: #fff; border: 1px solid #D6E2EA; color: #0B2C55; }
.nw-faq__icon svg { width: 1.1rem; height: 1.1rem; }
.nw-faq__item.open .nw-faq__no { color: #0E7C99; }
.nw-faq__btn:hover .nw-faq__q { color: #0E7C99; }
.nw-faq__a { padding: 0 3.4rem 1.5rem 2.1rem; font-size: 1rem; line-height: 1.7; color: #475569; }
@media (max-width: 639.98px) { .nw-faq__a { padding: 0 0 1.4rem; } }

/* related treatments */
.nw-related__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem; }
.nw-rels { margin-top: 2.5rem; display: grid; gap: 1rem; }
@media (min-width: 768px) { .nw-rels { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; } }
.nw-rel { height: 100%; display: flex; flex-direction: column; align-items: flex-start; padding: 1.75rem; border-radius: 1.5rem; background: #F3F7FA; color: inherit; transition: background-color .3s, transform .3s, box-shadow .3s; }
.nw-rel:hover { background: #fff; transform: translateY(-4px); box-shadow: 0 26px 50px -34px rgba(11,44,85,.55); color: inherit; }
.nw-rel__ic { width: 3.2rem; height: 3.2rem; display: grid; place-items: center; border-radius: 1rem; background: #fff; color: #0E7C99; box-shadow: 0 12px 24px -18px rgba(11,44,85,.6); transition: background-color .3s, color .3s; }
.nw-rel:hover .nw-rel__ic { background: #0E7C99; color: #fff; }
.nw-rel__ic svg { width: 1.4rem; height: 1.4rem; }
.nw-rel__name { margin-top: 1.25rem; font: 600 1.2rem/1.3 'Poppins', sans-serif; color: #061A36; }
.nw-rel__text { margin-top: .5rem; font-size: .95rem; line-height: 1.6; color: #475569; }
.nw-rel__go { margin-top: auto; padding-top: 1.25rem; display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; font-size: .92rem; color: #0E7C99; }
.nw-rel__go svg { width: 1rem; height: 1rem; transition: transform .2s; }
.nw-rel:hover .nw-rel__go svg { transform: translateX(3px); }
.nw-foot { margin-top: 2.5rem; display: flex; flex-wrap: wrap; align-items: center; column-gap: .5rem; }

/* Footer without the CTA band: more room on top; clinic items padded and spaced */
.ft-main { padding-top: 3rem; }
.ft-places__group ul { gap: .6rem; }
.ft-place { margin: 0; padding: .75rem .85rem; background: rgba(255,255,255,.03); }
.ft-place:hover { background: rgba(255,255,255,.07); }
@media (max-width: 639.98px) { .ft-main { padding-top: 2rem; } }
.ft-places .ft-place, .ft-places .ft-place:first-child { padding: .75rem .85rem; }
.ft-logo { position: relative; z-index: 1; display: flex; justify-content: center; padding-top: 2.5rem; }
.ft-logo img { height: 3rem; width: auto; }
.ft-logo + .ft-main { padding-top: 1.75rem; }
.ft-logo + .ft-main { padding-bottom: 2.5rem; }


/* ---------- v6 generic sections (pages without the migraine-only visuals, tp_gen.py) ---------- */
.nv-intro--top { align-items: start; }
@media (min-width: 1024px) { .nv-intro--top .nv-intro__lead { margin-top: 2.1rem; } }

/* at a glance: icon row */
.nv-glance { margin-top: 2rem; display: grid; gap: 1.5rem 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 1024px) { .nv-glance { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; } .nv-glance__item + .nv-glance__item { border-left: 1px solid #E2E8F0; } .nv-glance__item { padding: 0 1.75rem; } .nv-glance__item:first-child { padding-left: 0; } }
.nv-glance__ic { width: 3.2rem; height: 3.2rem; display: grid; place-items: center; border-radius: 1rem; background: #E6F4F8; color: #0E7C99; }
.nv-glance__ic svg { width: 1.4rem; height: 1.4rem; }
.nv-glance__label { margin-top: 1rem; font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #64748B; }
.nv-glance__value { margin-top: .3rem; font-weight: 600; font-size: 1rem; line-height: 1.5; color: #061A36; }

/* symptoms: icon disc in place of the head */
.nx-map__disc { position: relative; width: min(100%, 300px); aspect-ratio: 1; margin: 0 auto; display: grid; place-items: center; }
.nx-map__disc-ring { position: absolute; inset: 0; border-radius: 50%; border: 1.5px dashed #BFD9E4; animation: nvSpin 40s linear infinite; }
.nx-map__disc-ring--2 { inset: 16%; border: 0; background: radial-gradient(circle, #fff 55%, #EAF4F8 100%); box-shadow: 0 30px 60px -40px rgba(11,44,85,.5); animation: none; }
.nx-map__disc-ic { position: relative; width: 38%; aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(145deg, #0B2C55, #0E7C99); color: #fff; box-shadow: 0 0 0 10px rgba(14,124,153,.1); }
.nx-map__disc-ic svg { width: 44%; height: 44%; }

/* when: calm right side for pages without an emergency list */
.nx-split__side--calm { background: linear-gradient(160deg, #F3F8FB, #E9F3F7); border-top: 1px solid #D6E6EE; }
@media (min-width: 1024px) { .nx-split__side--calm { border-top: 0; border-left: 1px solid #D6E6EE; } }
.nx-split__badge--navy { background: #0B2C55; }
.nx-alert-list--calm li { color: #334155; border-color: #D6E6EE; }
.nx-alert-list--calm svg { color: #0E7C99; }

/* causes: icon list panel */
.nv-causes { padding: 2rem; border-radius: 1.75rem; background: #fff; box-shadow: 0 30px 60px -48px rgba(11,44,85,.55); }
.nv-causes__title { font: 700 1.1rem/1.3 'Poppins', sans-serif; color: #061A36; }
.nv-causes ul { margin-top: 1.1rem; display: grid; column-gap: 1.75rem; }
@media (min-width: 640px) { .nv-causes ul { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.nv-causes li { display: flex; align-items: center; gap: .85rem; padding: .85rem 0; border-bottom: 1px solid #EEF2F6; font-weight: 500; font-size: .98rem; line-height: 1.45; color: #0B2C55; }
.nv-causes li span { width: 2.6rem; height: 2.6rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: #E6F4F8; color: #0E7C99; }
.nv-causes li svg { width: 1.15rem; height: 1.15rem; }

/* diagnosis: "bring to your first visit" notepad */
.nv-prep { background-image: none; background-color: #FFFDF6; }
.nv-prep__list { margin-top: 1.25rem; }
.nv-prep__list li { display: flex; align-items: center; gap: .85rem; padding: .95rem 0; border-bottom: 1px dashed #EAD9A8; font-weight: 500; font-size: 1rem; line-height: 1.45; color: #334155; }
.nv-prep__list li:last-child { border-bottom: 0; }
.nv-prep__box { width: 1.6rem; height: 1.6rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .45rem; border: 2px solid #D99A0B; color: #D99A0B; }
.nv-prep__box svg { width: 1rem; height: 1rem; }

/* living: first aid steps */
.nv-aid { margin-top: 3rem; padding: 1.75rem; border-radius: 1.75rem; background: linear-gradient(160deg, #FFF5F5, #FDECEC); border: 1px solid #FBD5D5; }
@media (min-width: 640px) { .nv-aid { padding: 2.25rem; } }
.nv-aid__title { display: flex; align-items: center; gap: .8rem; font: 700 1.2rem/1.3 'Poppins', sans-serif; color: #991B1B; }
.nv-aid__title span { width: 2.6rem; height: 2.6rem; display: grid; place-items: center; border-radius: .8rem; background: #DC2626; color: #fff; }
.nv-aid__title svg { width: 1.2rem; height: 1.2rem; }
.nv-aid__list { margin-top: 1.5rem; display: grid; gap: 1rem 1.5rem; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); }
@media (min-width: 1024px) { .nv-aid__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.nv-aid__list li { display: flex; gap: .8rem; align-items: flex-start; }
.nv-aid__no { width: 2rem; height: 2rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: #fff; color: #DC2626; font: 700 .9rem/1 'Poppins', sans-serif; box-shadow: 0 6px 14px -10px rgba(127,29,29,.6); }
.nv-aid__list p { font-size: 1rem; line-height: 1.5; font-weight: 500; color: #7F1D1D; padding-top: .2rem; }

/* children without a sign list */
@media (min-width: 1024px) { .nw-kids__grid--single { grid-template-columns: minmax(0, 1fr); max-width: 52rem; } }
@media (min-width: 1024px) { .nw-kids__grid--single { max-width: none; } .nw-kids__grid--single > div { max-width: 52rem; } }
@media (min-width: 1024px) { .nv-types { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); } }
.nv-causes--wide { margin-top: 2.5rem; }
.nv-causes--wide ul { margin-top: 0; }
@media (min-width: 1024px) { .nv-causes--wide ul { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 2.5rem; } }
@media (min-width: 1024px) { .nv-causes--wide li:nth-last-child(-n+3) { border-bottom: 0; } }
/* causes panel on a white section: tinted, no shadow (white-on-white looked flat) */
.section:not(.section--mist) .nv-causes { background: #F3F7FA; box-shadow: none; }
.section:not(.section--mist) .nv-causes li { border-color: #E2EAF0; }
.section:not(.section--mist) .nv-causes li span { background: #fff; }

/* Flatter look: no large drop shadows on treatment-page cards — thin borders instead */
.mx-stage-wrap, .nx-split, .nv-diary, .nv-causes, .nx-map__disc-ring--2, .nw-rel:hover { box-shadow: none; }
.nv-causes { border: 1px solid #E2EAF0; }
.nv-diary { transform: none; }
.mx-step.is-active { box-shadow: none; }
.nx-tips__ic, .nv-cycle__ic, .nw-rel__ic, .nw-kids__check li span, .nx-map__ic, .nx-chips li, .nv-aid__no { box-shadow: none; border: 1px solid #DCE8EE; }
.nw-kids__check li span { border-color: rgba(217,154,11,.3); }
.nv-aid__no { border-color: #FBD5D5; }
.nx-map__disc-ring--2 { border: 1px solid #DCEBF1; }
.nv-cycle__core { box-shadow: none; }
.nw-rel:hover { transform: none; border-color: #CFE0E8; }
.nw-rel { border: 1px solid transparent; }
.ct-hero-sub { margin-top: .9rem; font-size: 1.1rem; font-weight: 600; color: rgba(255,255,255,.75); }
/* contact page: "Before you come" + emergency stacked beside the booking form */
.ct-notes--booking { margin-top: 1.75rem; grid-template-columns: 1fr !important; gap: .9rem; }
.ct-notes--booking .ct-note { padding: 1.25rem 1.35rem; border-radius: 1.25rem; }
/* contact map: square (1:1), no heavy shadow; it keeps its place at the top while the clinic list scrolls */
.ct-clinics .ct-map { aspect-ratio: 1 / 1; min-height: 0; height: auto; align-self: start; box-shadow: none; }
.section--mist .nw-rel { background: #fff; }
.booking-form { box-shadow: 0 20px 40px -32px rgba(11,44,85,.25); background: #FBFDFE; }
/* booking section: white only after a light-blue section (so the two stand apart); after a white section it keeps its light-blue gradient */
.section--mist + .booking, .u-bg-mist + .booking { background: #fff; }
.section--mist + .booking > .booking__dots, .section--mist + .booking > .booking__ring, .section--mist + .booking > .booking__glow,
.u-bg-mist + .booking > .booking__dots, .u-bg-mist + .booking > .booking__ring, .u-bg-mist + .booking > .booking__glow { display: none; }


/* =====================================================================
   PATIENT GUIDE v2 (.pg2-*) — same look as the treatment pages; re-uses nv-/nx-/nw- pieces
   ===================================================================== */
.pg2-before { margin-top: 2.75rem; display: grid; gap: 2.5rem 4rem; align-items: start; }
@media (min-width: 1024px) { .pg2-before { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } }
.pg2-bring { display: grid; column-gap: 2.5rem; }
@media (min-width: 640px) { .pg2-bring { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pg2-bring li { display: flex; gap: 1rem; padding: 1.25rem 0; border-bottom: 1px solid #DCE6EE; }
@media (min-width: 640px) { .pg2-bring li:nth-last-child(-n+2) { border-bottom: 0; } }
.pg2-bring__ic { width: 2.9rem; height: 2.9rem; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: #fff; border: 1px solid #DCE8EE; color: #0E7C99; }
.pg2-bring__ic svg { width: 1.25rem; height: 1.25rem; }
.pg2-bring h3 { font: 600 1.08rem/1.3 'Poppins', sans-serif; color: #061A36; }
.pg2-bring p { margin-top: .3rem; font-size: .95rem; line-height: 1.6; color: #475569; }
.pg2-notes .nv-prep__box { border-radius: .35rem; }

.pg2-diaries { margin-top: 3rem; display: grid; gap: 3rem; }
@media (min-width: 1024px) { .pg2-diaries { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3.5rem; } }
.pg2-diary .nx-numlist { margin-top: 1.5rem; }
.pg2-diary .nw-link { margin-top: .75rem; }
.pg2-diary__ic--teal { background: #0E7C99 !important; color: #fff !important; }
.pg2-sheet { margin-top: 1.25rem; overflow-x: auto; }
.pg2-sheet__row { display: grid; grid-template-columns: 1.1fr .8fr 1.3fr 1.2fr; gap: .75rem; min-width: 30rem; padding: .8rem 0; border-bottom: 1px dashed #EAD9A8; font-size: .9rem; line-height: 1.45; color: #334155; }
.pg2-sheet__row--head { padding-top: 0; border-bottom: 2px solid #F1E3BC; font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #8A6D1F; }
.pg2-sheet__row--blank { min-height: 2.4rem; border-bottom: 0; }
.pg2-pain { display: inline-block; width: 3rem; height: .45rem; margin-right: .45rem; border-radius: 99px; vertical-align: middle; background: linear-gradient(90deg, #EF4444 var(--v), #EEF2F6 var(--v)); }

.pg2-day .nv-day__track span { background: linear-gradient(90deg, #0E7C99, #F5B82E); }
.pg2-day .nv-day__stop:nth-child(1) { --c: #0E7C99; }
.pg2-day .nv-day__stop:nth-child(2) { --c: #1599B8; }
.pg2-day .nv-day__stop:nth-child(3) { --c: #D97706; }
.pg2-day .nv-day__stop:nth-child(4) { --c: #0B2C55; }
@media (min-width: 1024px) { .pg2-day .nv-day__stops { padding: 0; } }

.pg2-call { margin-top: 1.5rem; display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.25rem; padding: 1.25rem 1.5rem; border-radius: 1.25rem; background: #fff; border: 1px solid #DCE8EE; }
.pg2-call__ic { width: 2.6rem; height: 2.6rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .8rem; background: #E6F4F8; color: #0E7C99; }
.pg2-call__ic svg { width: 1.2rem; height: 1.2rem; }
.pg2-call p { flex: 1; min-width: 14rem; font-size: 1rem; line-height: 1.55; color: #334155; }
.pg2-call strong { color: #061A36; }
.pg2-diary, .pg2-diary .nv-diary { min-width: 0; }


/* =====================================================================
   CLINICS v2 (.cl2-*) — simple hero, jump strip, flatter cards, light online timeline
   ===================================================================== */
.cl2-jump { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: 1px solid #E2E8F0; border-radius: 1.25rem; overflow: hidden; margin-bottom: 3.5rem; }
@media (min-width: 1024px) { .cl2-jump { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.cl2-jump a { display: grid; grid-template-columns: auto 1fr; column-gap: .8rem; align-items: center; padding: 1.1rem 1.25rem; font: 600 1rem/1.3 'Poppins', sans-serif; color: #061A36; transition: background-color .2s; }
.cl2-jump a + a { border-left: 1px solid #E2E8F0; }
@media (max-width: 1023.98px) { .cl2-jump a:nth-child(3) { border-left: 0; } .cl2-jump a:nth-child(n+3) { border-top: 1px solid #E2E8F0; } }
.cl2-jump a:hover { background: #F3F7FA; color: #0E7C99; }
.cl2-jump span { grid-row: span 2; width: 2.4rem; height: 2.4rem; display: grid; place-items: center; border-radius: .75rem; background: #E6F4F8; color: #0E7C99; font: 700 .85rem/1 'Poppins', sans-serif; }
.cl2-jump span svg { width: 1.1rem; height: 1.1rem; }
.cl2-jump small { font: 500 .8rem/1.3 'Plus Jakarta Sans', sans-serif; color: #64748B; }

/* flatter clinic photos + visiting cards */
.cl-clinic__media, .cl-clinic__img, .cl-visit { box-shadow: none !important; }
.cl-visit { border: 1px solid #E2E8F0; }

/* online */
.cl2-online { margin-top: 3rem; }
@media (min-width: 1024px) { .cl2-online .nv-day__stops { padding: 0 6rem; } }
.cl2-online__actions { margin-top: 2.5rem; display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; }

/* care available: plain list with hairlines */
.cl-treats { gap: 0 2rem !important; }
.cl-treat { background: transparent !important; border: 0 !important; border-bottom: 1px solid #D6E2EA !important; border-radius: 0 !important; box-shadow: none !important; padding: 1rem 0 !important; }
.cl-treat:hover { color: #0E7C99; }
.cl-treat__icon { background: #fff !important; border: 1px solid #DCE8EE; }
/* care list hover: row stays put; icon fills teal (visible), name + arrow turn teal, line turns teal */
.cl-treat:hover { translate: none; border-bottom-color: #0E7C99 !important; }
.cl-treat:hover .cl-treat__icon { background: #0E7C99 !important; border-color: #0E7C99; color: #fff; }
.cl-treat:hover .cl-treat__name { color: #0E7C99; }


/* =====================================================================
   CLINIC PAGES v2 (.cp2-*) — photo + facts, flat map, light timeline, hairline FAQ
   ===================================================================== */
.cp2-glance { display: grid; gap: 2.5rem 4rem; align-items: center; }
@media (min-width: 1024px) { .cp2-glance { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); } }
.cp2-glance__photo { margin: 0; overflow: hidden; border-radius: 1.5rem; border: 1px solid #E2E8F0; aspect-ratio: 4 / 3; }
.cp2-glance__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cp2-glance__lead { margin-top: 1rem; }
.cp2-facts { margin-top: 1.5rem; display: grid; column-gap: 2rem; border-top: 1px solid #E2E8F0; }
@media (min-width: 640px) { .cp2-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.cp2-facts li { display: flex; gap: .85rem; align-items: flex-start; padding: 1rem 0; border-bottom: 1px solid #E2E8F0; }
.cp2-facts__ic { width: 2.5rem; height: 2.5rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .8rem; background: #E6F4F8; color: #0E7C99; }
.cp2-facts__ic svg { width: 1.15rem; height: 1.15rem; }
.cp2-facts__label { display: block; font-size: .7rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #64748B; }
.cp2-facts__value { display: block; margin-top: .2rem; font-weight: 600; font-size: .98rem; line-height: 1.45; color: #061A36; }
.cp2-facts__link { color: #0E7C99; }
.cp2-glance__actions { justify-content: flex-start; margin-top: 1.75rem; }
/* map square + flat; areas box flat */
.cp-map { aspect-ratio: 1 / 1; min-height: 0 !important; height: auto !important; box-shadow: none !important; }
.cp-areas__box { box-shadow: none !important; }

/* ONLINE VIDEO CONSULTATION page (gen_online.py) */
.pg2-online-alert { margin-top: 1.25rem; display: flex; gap: .7rem; align-items: flex-start; padding: 1rem 1.1rem; border-radius: 1rem; background: #FEF2F2; border: 1px solid #FBD5D5; font-size: .95rem; line-height: 1.55; color: #7F1D1D; }
.pg2-online-alert svg { width: 1.15rem; height: 1.15rem; flex-shrink: 0; margin-top: .15rem; color: #DC2626; }
.pg2-online-alert strong { color: #991B1B; }
.pg2-ready { margin-top: 0; }
.pg2-ready__lead { margin: 1rem 0 1.25rem; }
.tr2-jump { margin-bottom: 3rem; background: #fff; }
/* honeypot field in forms (bots fill it, people never see it) */
.hp-field { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
/* footer: "Last Updated On" pill */
.ft-bottom__upd { display: inline-flex; align-self: flex-start; align-items: center; gap: .45rem; padding: .3rem .8rem; border-radius: 999px; background: rgba(34,181,214,.12); color: #5FD0E6; font-weight: 600; }
.ft-bottom__upd svg { width: .85rem; height: .85rem; }
@media (min-width: 1024px) { .ft-bottom__inner { flex-direction: row; align-items: center; justify-content: space-between; flex-wrap: wrap; } .ft-bottom__upd { align-self: center; } }
/* footer treatments: more room between items (they looked cramped) */
.ft-links { gap: .35rem 1.75rem; margin-top: .4rem; }
.ft-link { padding: .5rem 0; }
/* phones: treatments as one tidy list — icon chip, name, divider (two narrow columns broke every name onto two lines) */
@media (max-width: 639.98px) {
  .ft-links { grid-template-columns: 1fr; gap: 0; margin-top: .5rem; }
  .ft-link { gap: .75rem; padding: .55rem 0; font-size: .9rem; border-bottom: 1px solid rgba(255,255,255,.07); }
  .ft-links li:last-child .ft-link { border-bottom: 0; }
  .ft-link svg { display: block; box-sizing: content-box; width: .9rem; height: .9rem; padding: .4rem; border-radius: .55rem;
    background: rgba(34,181,214,.12); box-shadow: inset 0 0 0 1px rgba(34,181,214,.2); }
}

/* ---------- footer clinics: one even grid (2 x 2 + online full width), equal-height cards ---------- */
.ft-clinics { display: grid; gap: .6rem; margin-top: .3rem; }
@media (min-width: 640px) { .ft-clinics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ft-clinic { display: grid; grid-template-columns: 2.2rem minmax(0, 1fr); gap: .75rem; align-items: start; padding: .85rem .95rem; border-radius: .9rem; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.06); transition: background-color .2s, border-color .2s; }
.ft-clinic:hover { background: rgba(255,255,255,.07); border-color: rgba(95,208,230,.18); }
.ft-clinic__ic { width: 2.2rem; height: 2.2rem; display: grid; place-items: center; border-radius: .65rem; background: rgba(95,208,230,.12); color: #5FD0E6; }
.ft-clinic__ic svg { width: 1rem; height: 1rem; }
.ft-clinic__ic--visit { background: rgba(245,184,46,.14); color: #F5B82E; }
.ft-clinic__ic--online { background: rgba(37,211,102,.12); color: #4ADE80; }
.ft-clinic__body { min-width: 0; height: 100%; display: flex; flex-direction: column; }
.ft-clinic__name { font-weight: 600; font-size: .92rem; line-height: 1.3; color: #fff; }
.ft-clinic__name:hover { color: #5FD0E6; }
.ft-clinic__meta { margin-top: .2rem; font-size: .78rem; line-height: 1.4; color: rgba(255,255,255,.55); }
.ft-clinic__links { margin-top: auto; padding-top: .55rem; display: flex; flex-wrap: wrap; gap: .35rem; }
.ft-clinic__links a { padding: .14rem .6rem; border-radius: .4rem; border: 1px solid rgba(95,208,230,.3); font-size: .74rem; font-weight: 600; color: #5FD0E6; transition: background-color .2s, color .2s, border-color .2s; }
.ft-clinic__links a:hover { background: #0E7C99; border-color: #0E7C99; color: #fff; }
@media (min-width: 640px) {
  .ft-clinic--wide { grid-column: 1 / -1; align-items: center; }
  .ft-clinic--wide .ft-clinic__body { flex-direction: row; flex-wrap: wrap; align-items: center; column-gap: .9rem; }
  .ft-clinic--wide .ft-clinic__meta { margin-top: 0; }
  .ft-clinic--wide .ft-clinic__links { margin: 0 0 0 auto; padding-top: 0; }
}
.ft-clinic__name { font-size: .88rem; }
@media (min-width: 640px) { .ft-clinic--wide .ft-clinic__body { flex-wrap: nowrap; } .ft-clinic--wide .ft-clinic__meta { flex: 1; min-width: 0; } .ft-clinic--wide .ft-clinic__links { flex-wrap: nowrap; } }

/* clinics page: card without a photo yet (Aartham Hospital) + 3 visiting clinics in a row */
.cl-clinic__media--blank { display: grid; place-items: center; background: linear-gradient(150deg, #E6F4F8, #D7ECF3); }
.cl-clinic__blank-ic { width: 6rem; height: 6rem; display: grid; place-items: center; border-radius: 1.75rem; background: #fff; color: #0E7C99; border: 1px solid #CFE3EC; }
.cl-clinic__blank-ic svg { width: 2.6rem; height: 2.6rem; }
@media (min-width: 1024px) { .cl-visits { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }

/* home: online + visiting clinics strip under the Ahmedabad clinic cards */
.hm-more { margin-top: 1.5rem; display: grid; gap: .75rem; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); }
.hm-more__item { display: flex; align-items: center; gap: .8rem; padding: .9rem 1rem; border-radius: 1.1rem; background: #F3F7FA; border: 1px solid #E2EAF0; color: inherit; transition: border-color .2s, background-color .2s; }
.hm-more__item:hover { background: #fff; border-color: #CFE0E8; color: inherit; }
.hm-more__item strong { display: block; font: 600 .95rem/1.3 Poppins, sans-serif; color: #061A36; }
.hm-more__item small { display: block; margin-top: .15rem; font-size: .82rem; color: #64748B; }
.hm-more__ic { width: 2.6rem; height: 2.6rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .8rem; background: #FFF4D6; color: #B7791F; }
.hm-more__ic--online { background: #E6F4F8; color: #0E7C99; }
.hm-more__ic svg { width: 1.2rem; height: 1.2rem; }

/* treatment pages "where to consult": no timing column any more + visiting clinics row */
@media (min-width: 1024px) { .nw-place { grid-template-columns: 3.6rem minmax(0, 1fr) auto; } }
.nw-place__ic--visit { background: #FFF4D6; color: #B7791F; }
.nw-visiting { margin-top: 1.25rem; display: flex; align-items: center; gap: 1.25rem; padding: 1.1rem 1.25rem; border-radius: 1.25rem; background: #FFFBF0; border: 1px solid #F1E3BC; color: inherit; transition: border-color .2s; }
.nw-visiting:hover { border-color: #E5C878; color: inherit; }
.nw-visiting > span:nth-child(2) { flex: 1; min-width: 0; }
.nw-visiting__text { display: block; margin-top: .25rem; font-size: .95rem; line-height: 1.55; color: #334155; }
.nw-visiting__go { width: 1.1rem; height: 1.1rem; flex-shrink: 0; color: #B7791F; }
/* about hero: experience chip (plain amber text — the gradient text style is invisible on the glass chip) */
.ab-exp { color: #F5B82E; }


/* ---------- booking form: custom dropdowns (enhanceSelects in main.js) ---------- */
.cs-native { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; border: 0 !important; min-height: 0 !important; opacity: 0 !important; pointer-events: none !important; overflow: hidden; clip: rect(0 0 0 0); }
.cs { position: relative; }
.cs-btn { width: 100%; display: flex; align-items: center; gap: .75rem; padding: .7rem .7rem .7rem 1rem; border: 1.5px solid #E2E8F0; border-radius: .9rem; background: #F8FAFC; font-size: 16px; line-height: 1.4; color: #0F172A; text-align: left; cursor: pointer; transition: border-color .2s, box-shadow .2s, background-color .2s; }
.cs-btn:hover:not(:disabled) { border-color: #CBD5E1; background: #fff; }
.cs-btn:focus-visible, .cs.is-open .cs-btn { outline: none; border-color: var(--teal, #0E7C99); background: #fff; box-shadow: 0 0 0 4px rgba(14,124,153,.15); }
.cs-btn:disabled { opacity: .6; cursor: not-allowed; }
.cs-btn.is-placeholder .cs-val { color: #94A3B8; }
.cs-btn.invalid { border-color: #DC2626; box-shadow: 0 0 0 4px rgba(220,38,38,.1); }
.cs-val { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs-chev { flex-shrink: 0; display: grid; place-items: center; width: 1.85rem; height: 1.85rem; border-radius: .55rem; background: #E6F4F8; color: #0E7C99; transition: transform .25s, background-color .2s, color .2s; }
.cs.is-open .cs-chev { transform: rotate(180deg); background: #0E7C99; color: #fff; }
.cs-list { position: absolute; z-index: 40; left: 0; right: 0; top: calc(100% + .45rem); max-height: 17rem; overflow-y: auto; margin: 0; padding: .4rem; list-style: none; border-radius: 1rem; background: #fff; border: 1px solid #E2E8F0; box-shadow: 0 24px 48px -20px rgba(11,44,85,.35); animation: csIn .16s ease-out; overscroll-behavior: contain; }
.cs-list[hidden] { display: none; }
.cs-opt { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .7rem .85rem; border-radius: .7rem; font-size: .95rem; line-height: 1.35; color: #1E293B; cursor: pointer; }
.cs-opt.is-active { background: #F0F8FB; color: #0B2C55; }
.cs-opt[aria-selected="true"] { background: #E6F4F8; color: #0E7C99; font-weight: 600; }
.cs-opt svg { flex-shrink: 0; color: #0E7C99; }
.cs-list::-webkit-scrollbar { width: 8px; }
.cs-list::-webkit-scrollbar-thumb { background: #CBD5E1; border-radius: 8px; border: 2px solid #fff; }
@keyframes csIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .cs-list { animation: none; } }


/* ---------- visiting clinics: three small items instead of one long line ---------- */
.vc-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem 1.25rem; margin-top: .45rem; }
.vc-item { display: block; min-width: 0; padding-left: .75rem; border-left: 2px solid #F1D48A; }
.vc-town { display: block; font-weight: 600; color: #0B2C55; font-size: .95rem; line-height: 1.35; }
.vc-meta { display: block; margin-top: .1rem; font-size: .84rem; line-height: 1.45; color: #64748B; }
.ct-visiting__text > strong, .ct-visiting__text > .vc-list { display: block; }
.ct-visiting__text .vc-list, .ba-clinic__address .vc-list { grid-template-columns: 1fr; gap: .55rem; }
.ct-visiting { align-items: flex-start; }
.ct-visiting__go { margin-top: .65rem; }
@media (max-width: 767.98px) { .vc-list { grid-template-columns: 1fr; gap: .55rem; } }

/* ---------- home hero stats ---------- */
.hm-stat { display: block; min-width: 0; }
.hm-stat__title { display: block; font-family: var(--font-display, inherit); font-weight: 600; line-height: 1.25; white-space: nowrap; }
.hm-stat__sub { display: block; margin-top: .2rem; font-size: .75rem; line-height: 1.4; color: rgba(255,255,255,.6); }
@media (max-width: 767.98px) { .nw-visiting { align-items: flex-start; } .nw-visiting__go { margin-top: .5rem; } }

/* contact: visiting clinics under the map */
.ct-mapcol { display: grid; gap: 1rem; align-self: start; min-width: 0; }
.ct-mapcol .ct-map { align-self: auto; }
@media (min-width: 768px) { .ct-mapcol .ct-visiting__text .vc-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem 1.25rem; } }

/* footer: online consultation as a full-width strip under both panels (logo removed) */
.ft-online { display: flex; align-items: center; gap: 1rem 1.25rem; flex-wrap: wrap; }
@media (min-width: 992px) { .ft-online { grid-column: 1 / -1; flex-wrap: nowrap; } }
.ft-online__ic { width: 3rem; height: 3rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .9rem; background: rgba(37,211,102,.12); color: #4ADE80; }
.ft-online__ic svg { width: 1.35rem; height: 1.35rem; }
.ft-online__body { flex: 1; min-width: 14rem; }
.ft-online__title { font-family: var(--font-display, inherit); font-weight: 600; font-size: 1.05rem; color: #fff; }
.ft-online__title:hover { color: #5FD0E6; }
.ft-online__text { margin: .2rem 0 0; font-size: .85rem; line-height: 1.5; color: rgba(255,255,255,.6); }
.ft-online__btns { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .6rem; }
.ft-online__btn { display: inline-flex; align-items: center; gap: .4rem; padding: .55rem 1rem; border-radius: 999px; border: 1px solid rgba(95,208,230,.35); font-size: .85rem; font-weight: 600; color: #5FD0E6; transition: background-color .2s, border-color .2s, color .2s; }
.ft-online__btn svg { width: 1rem; height: 1rem; }
.ft-online__btn:hover { background: rgba(95,208,230,.12); color: #fff; }
.ft-online__btn--primary { background: #0E7C99; border-color: #0E7C99; color: #fff; }
.ft-online__btn--primary:hover { background: #0B6A83; border-color: #0B6A83; }
.ft-online__link { font-size: .85rem; font-weight: 600; color: rgba(255,255,255,.7); padding: 0 .25rem; }
.ft-online__link:hover { color: #fff; }
@media (max-width: 991.98px) { .ft-online__btns { width: 100%; } }
@media (max-width: 991.98px) { .ft-online { align-items: flex-start; } }

/* ---------- about: certificates (degree + GMC certificate per qualification) + viewer ---------- */
.cert-block { margin-top: 3.5rem; }
.cert-block__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: .75rem 2rem; }
.cert-block__title { margin: .6rem 0 0; font-family: var(--font-display, inherit); font-weight: 600; font-size: clamp(1.4rem, 1.1rem + 1vw, 1.85rem); line-height: 1.25; color: #0B2C55; }
.cert-block__note { margin: 0; display: inline-flex; align-items: center; gap: .45rem; font-size: .9rem; color: #64748B; }
.cert-block__note svg { width: 1rem; height: 1rem; color: #0E7C99; }
.cert-groups { margin-top: 1.75rem; display: grid; gap: 1.25rem; }
@media (min-width: 992px) { .cert-groups { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.cert-group { min-width: 0; padding: 1.25rem; border-radius: 1.5rem; background: #fff; border: 1px solid #E2E8F0; }
.cert-group__head { display: flex; align-items: center; gap: .85rem; }
.cert-group__ic { width: 2.75rem; height: 2.75rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .9rem; background: #E6F4F8; color: #0E7C99; }
.cert-group__ic svg { width: 1.3rem; height: 1.3rem; }
.cert-group__title { margin: 0; font-family: var(--font-display, inherit); font-weight: 600; font-size: 1.1rem; color: #0B2C55; }
.cert-group__sub { margin: .15rem 0 0; font-size: .82rem; line-height: 1.45; color: #64748B; }
.cert-group__docs { margin-top: 1.1rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.cert-doc { display: block; width: 100%; padding: 0; border: 0; background: none; text-align: left; cursor: zoom-in; color: inherit; }
.cert-doc__frame { position: relative; display: grid; place-items: center; aspect-ratio: 4 / 5; padding: .6rem; border-radius: 1rem; background: linear-gradient(160deg, #F4F8FB, #E9F1F6); border: 1px solid #E2E8F0; overflow: hidden; transition: border-color .25s, box-shadow .25s; }
.cert-doc__frame img { position: absolute; inset: .6rem; width: calc(100% - 1.2rem); height: calc(100% - 1.2rem); object-fit: contain; filter: drop-shadow(0 10px 14px rgba(11,44,85,.22)); transition: transform .35s ease; }
.cert-doc__zoom { position: absolute; right: .55rem; bottom: .55rem; width: 2.1rem; height: 2.1rem; display: grid; place-items: center; border-radius: 999px; background: #0B2C55; color: #fff; opacity: 0; transform: translateY(4px); transition: opacity .25s, transform .25s; }
.cert-doc__zoom svg { width: 1rem; height: 1rem; }
.cert-doc__label { display: block; margin-top: .55rem; font-size: .8rem; font-weight: 600; line-height: 1.35; color: #334155; }
.cert-doc:hover .cert-doc__frame, .cert-doc:focus-visible .cert-doc__frame { border-color: rgba(14,124,153,.45); box-shadow: 0 16px 32px -22px rgba(11,44,85,.55); }
.cert-doc:hover .cert-doc__frame img { transform: scale(1.03); }
.cert-doc:hover .cert-doc__zoom, .cert-doc:focus-visible .cert-doc__zoom { opacity: 1; transform: none; }
.cert-doc:focus-visible { outline: none; }
.cert-doc:focus-visible .cert-doc__frame { outline: 3px solid rgba(14,124,153,.35); outline-offset: 2px; }
@media (hover: none) { .cert-doc__zoom { opacity: 1; transform: none; } }

.cert-lb { width: 100%; max-width: 100%; height: 100%; max-height: 100%; margin: 0; padding: 0; border: 0; background: transparent; color: #fff; }
.cert-lb::backdrop { background: rgba(4,16,34,.88); backdrop-filter: blur(4px); }
.cert-lb[open] { display: grid; place-items: center; animation: certIn .2s ease-out; }
.cert-lb__inner { position: relative; display: flex; align-items: center; justify-content: center; gap: 1rem; width: 100%; height: 100%; padding: 4.5rem 1rem 1.5rem; box-sizing: border-box; }
.cert-lb__fig { margin: 0; display: flex; flex-direction: column; align-items: center; gap: .9rem; max-width: min(100%, 1000px); max-height: 100%; min-width: 0; }
.cert-lb__img { display: block; max-width: 100%; max-height: calc(100vh - 9rem); max-height: calc(100dvh - 9rem); width: auto; height: auto; border-radius: .5rem; box-shadow: 0 30px 60px -20px rgba(0,0,0,.6); background: #fff; }
.cert-lb__cap { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .4rem .9rem; font-size: .95rem; text-align: center; }
.cert-lb__title { font-weight: 600; }
.cert-lb__count { font-size: .8rem; color: rgba(255,255,255,.6); }
.cert-lb__close, .cert-lb__nav { display: grid; place-items: center; border: 1px solid rgba(255,255,255,.2); border-radius: 999px; background: rgba(255,255,255,.08); color: #fff; cursor: pointer; transition: background-color .2s; }
.cert-lb__close:hover, .cert-lb__nav:hover { background: rgba(255,255,255,.2); }
.cert-lb__close { position: absolute; top: 1rem; right: 1rem; width: 2.75rem; height: 2.75rem; }
.cert-lb__nav { flex-shrink: 0; width: 3rem; height: 3rem; }
.cert-lb__close svg, .cert-lb__nav svg { width: 1.3rem; height: 1.3rem; }
@media (max-width: 640px) {
  .cert-lb__inner { padding: 4rem .75rem 1.25rem; }
  .cert-lb__nav { position: absolute; bottom: 1.1rem; width: 2.75rem; height: 2.75rem; }
  .cert-lb__nav--prev { left: 1rem; } .cert-lb__nav--next { right: 1rem; }
  .cert-lb__img { max-height: calc(100vh - 11rem); max-height: calc(100dvh - 11rem); }
  .cert-lb__cap { padding: 0 3.5rem; }
}
@keyframes certIn { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .cert-lb[open] { animation: none; } .cert-doc__frame img { transition: none; } }

/* certificates: 4 portrait on top, 2 landscape below (replaces the grouped cards) */
.cert-row { margin-top: 1.5rem; display: grid; gap: 1.25rem; }
.cert-row--portrait { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cert-row--landscape { grid-template-columns: 1fr; }
@media (min-width: 768px) { .cert-row--portrait { grid-template-columns: repeat(4, minmax(0, 1fr)); } .cert-row--landscape { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.cert-row--portrait .cert-doc__frame { aspect-ratio: 8 / 11; }
.cert-row--landscape .cert-doc__frame { aspect-ratio: 11 / 8; }
.cert-row .cert-doc__frame { padding: 0; background: #fff; border-radius: 1.1rem; }
.cert-row .cert-doc__frame img { inset: .75rem; width: calc(100% - 1.5rem); height: calc(100% - 1.5rem); }
.cert-row .cert-doc__label { margin-top: .75rem; font-family: var(--font-display, inherit); font-size: .95rem; font-weight: 600; color: #0B2C55; }
.cert-doc__sub { display: block; margin-top: .15rem; font-size: .8rem; line-height: 1.4; color: #64748B; }

/* certificates heading centred, note below the title */
.cert-block__head { flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: .6rem; }
.cert-block__head .eyebrow { justify-content: center; }
.cert-row .cert-doc { text-align: center; }

/* ---------- blog article (articles/*.php, URL blog/<slug>) — prefix ar- ---------- */
.ar-title { max-width: 22ch; font-size: clamp(2rem, 1.4rem + 2.6vw, 3.4rem); line-height: 1.12; }
.ar-meta { margin: 1.1rem 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; font-size: .9rem; color: rgba(255,255,255,.72); }
.ar-meta > span { display: inline-flex; align-items: center; gap: .4rem; }
.ar-meta svg { width: 1rem; height: 1rem; }
.ar-meta__tag { padding: .3rem .75rem; border-radius: 999px; background: rgba(245,184,46,.16); border: 1px solid rgba(245,184,46,.45); color: #FCD34D; font-weight: 600; }

.ar-layout { display: grid; gap: 2.5rem; }
@media (min-width: 1100px) { .ar-layout { grid-template-columns: minmax(0, 1fr) 320px; gap: 3.5rem; align-items: start; } }
.ar-body { min-width: 0; max-width: 760px; font-size: 1.05rem; line-height: 1.8; color: #334155; }
.ar-body > p { margin: 0 0 1.1rem; }
.ar-body strong { color: #0B2C55; }
.ar-h2 { margin: 2.75rem 0 1rem; font-family: var(--font-display, inherit); font-weight: 600; font-size: clamp(1.45rem, 1.2rem + .9vw, 1.9rem); line-height: 1.25; color: #0B2C55; scroll-margin-top: 6.5rem; }

.ar-cover { margin: 0 0 1.75rem; border-radius: 1.5rem; overflow: hidden; border: 1px solid #E2E8F0; background: #F1F5F9; }
.ar-cover img { display: block; width: 100%; height: auto; }

.ar-answer { padding: 1.4rem 1.5rem; border-radius: 1.25rem; background: linear-gradient(135deg, #0B2C55, #0E5C7A); color: #E2EEF5; }
.ar-answer__label { margin: 0 0 .5rem; display: inline-flex; align-items: center; gap: .45rem; font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #FCD34D; }
.ar-answer__label svg { width: 1rem; height: 1rem; }
.ar-answer__text { margin: 0; font-size: 1.05rem; line-height: 1.75; }
.ar-answer__text strong { color: #fff; }

.ar-fast { list-style: none; margin: 1.25rem 0 1.4rem; padding: 0; display: grid; gap: .85rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 768px) { .ar-fast { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ar-fast__item { position: relative; padding: 1.1rem 1.1rem 1.15rem; border-radius: 1.1rem; background: #fff; border: 1px solid #E2E8F0; }
.ar-fast__letter { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: .8rem; background: #E6F4F8; color: #0E7C99; font-family: var(--font-display, inherit); font-weight: 700; font-size: 1.35rem; }
.ar-fast__name { display: block; margin-top: .7rem; font-family: var(--font-display, inherit); font-weight: 600; font-size: 1.05rem; color: #0B2C55; }
.ar-fast__text { display: block; margin-top: .25rem; font-size: .88rem; line-height: 1.5; color: #64748B; }
.ar-fast__item--time { background: #FEF2F2; border-color: #FBD5D5; }
.ar-fast__item--time .ar-fast__letter { background: #DC2626; color: #fff; }
.ar-fast__item--time .ar-fast__name { color: #991B1B; }
.ar-fast__item--time .ar-fast__text { color: #B91C1C; }

.ar-dodont { display: grid; gap: 1rem; margin: 1.25rem 0 1.4rem; }
@media (min-width: 768px) { .ar-dodont { grid-template-columns: 1.25fr 1fr; } }
.ar-dodont__col { padding: 1.25rem 1.35rem; border-radius: 1.2rem; border: 1px solid #E2E8F0; background: #fff; }
.ar-dodont__col--do { border-color: #BFE3EC; background: #F4FAFC; }
.ar-dodont__col--dont { border-color: #FBD5D5; background: #FFF8F8; }
.ar-dodont__title { margin: 0 0 .75rem; display: inline-flex; align-items: center; gap: .45rem; font-family: var(--font-display, inherit); font-weight: 600; font-size: 1.1rem; color: #0B2C55; }
.ar-dodont__title svg { width: 1.2rem; height: 1.2rem; }
.ar-dodont__col--do .ar-dodont__title svg { color: #0E7C99; }
.ar-dodont__col--dont .ar-dodont__title svg { color: #DC2626; }
.ar-steps { margin: 0; padding: 0; list-style: none; counter-reset: ar; display: grid; gap: .7rem; font-size: .95rem; line-height: 1.6; }
.ar-steps li { counter-increment: ar; position: relative; padding-left: 2.2rem; }
.ar-steps li::before { content: counter(ar); position: absolute; left: 0; top: .05rem; width: 1.55rem; height: 1.55rem; display: grid; place-items: center; border-radius: 999px; background: #0E7C99; color: #fff; font-size: .8rem; font-weight: 700; }
.ar-donts { margin: 0; padding: 0; list-style: none; display: grid; gap: .7rem; font-size: .95rem; line-height: 1.6; }
.ar-donts li { position: relative; padding-left: 1.6rem; }
.ar-donts li::before { content: ""; position: absolute; left: .2rem; top: .7rem; width: .7rem; height: 2px; border-radius: 2px; background: #DC2626; }

.ar-note { display: flex; gap: .9rem; padding: 1.15rem 1.25rem; border-radius: 1.1rem; background: #FFF8E6; border: 1px solid #F6DFA3; }
.ar-note p { margin: 0; font-size: .98rem; line-height: 1.7; color: #5C3D00; }
.ar-note strong { color: #4A3300; }
.ar-note__ic { flex-shrink: 0; width: 2.3rem; height: 2.3rem; display: grid; place-items: center; border-radius: .75rem; background: #F5B82E; color: #0B2C55; }
.ar-note__ic svg { width: 1.15rem; height: 1.15rem; }

.ar-risk { list-style: none; margin: 1rem 0 1.25rem; padding: 0; display: grid; gap: .6rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .ar-risk { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ar-risk li { display: flex; align-items: center; gap: .65rem; padding: .7rem .9rem; border-radius: .85rem; background: #F6F9FB; font-size: .95rem; line-height: 1.4; color: #1E293B; }
.ar-risk svg { flex-shrink: 0; width: 1.05rem; height: 1.05rem; color: #0E7C99; }

.ar-link-card { margin-top: .5rem; display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.25rem; border-radius: 1.1rem; background: #fff; border: 1px solid #E2E8F0; color: inherit; transition: border-color .2s, box-shadow .2s; }
.ar-link-card:hover { border-color: rgba(14,124,153,.45); box-shadow: 0 16px 32px -24px rgba(11,44,85,.5); color: inherit; }
.ar-link-card__ic { flex-shrink: 0; width: 2.75rem; height: 2.75rem; display: grid; place-items: center; border-radius: .9rem; background: #0E7C99; color: #fff; }
.ar-link-card__ic svg { width: 1.3rem; height: 1.3rem; }
.ar-link-card__title { display: block; font-family: var(--font-display, inherit); font-weight: 600; color: #0B2C55; line-height: 1.35; }
.ar-link-card__text { display: block; margin-top: .15rem; font-size: .88rem; line-height: 1.5; color: #64748B; }
.ar-link-card__go { flex-shrink: 0; margin-left: auto; width: 1.15rem; height: 1.15rem; color: #0E7C99; transition: transform .2s; }
.ar-link-card:hover .ar-link-card__go { transform: translateX(3px); }

.ar-faq { margin-top: .5rem; }

.ar-author { margin-top: 2.75rem; display: flex; align-items: center; gap: 1.1rem; padding: 1.25rem; border-radius: 1.25rem; background: #F4FAFC; border: 1px solid #DCE8EF; }
.ar-author__img { flex-shrink: 0; width: 5rem; height: 5rem; border-radius: 999px; object-fit: cover; object-position: top; border: 3px solid #F5B82E; }
.ar-author__label { margin: 0; font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #0E7C99; }
.ar-author__name { margin: .15rem 0 0; font-family: var(--font-display, inherit); font-weight: 600; font-size: 1.15rem; color: #0B2C55; line-height: 1.3; }
.ar-author__role { margin: .2rem 0 0; font-size: .86rem; line-height: 1.5; color: #64748B; }
.ar-author__link { margin-top: .45rem; display: inline-flex; align-items: center; gap: .35rem; font-size: .88rem; font-weight: 600; color: #0E7C99; }
.ar-author__link svg { width: .95rem; height: .95rem; }
.ar-disclaimer { margin: 1rem 0 0 !important; display: flex; gap: .5rem; font-size: .82rem; line-height: 1.55; color: #94A3B8; }
.ar-disclaimer svg { flex-shrink: 0; margin-top: .15rem; width: .95rem; height: .95rem; }

.ar-side { min-width: 0; }
.ar-side__sticky { display: grid; gap: 1rem; }
@media (min-width: 1100px) { .ar-side__sticky { position: sticky; top: 6.5rem; } }
@media (max-width: 1099.98px) { .ar-toc { display: none; } }
.ar-toc { padding: 1.25rem 1.3rem; border-radius: 1.25rem; background: #fff; border: 1px solid #E2E8F0; }
.ar-toc__title { margin: 0 0 .65rem; font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #64748B; }
.ar-toc ol { margin: 0; padding: 0; list-style: none; display: grid; gap: .15rem; }
.ar-toc a { display: block; padding: .45rem .7rem; border-radius: .6rem; border-left: 2px solid transparent; font-size: .9rem; line-height: 1.4; color: #334155; transition: background-color .2s, color .2s, border-color .2s; }
.ar-toc a:hover, .ar-toc a.is-active { background: #F0F8FB; color: #0E7C99; border-left-color: #0E7C99; }
.ar-emerg { padding: 1.1rem 1.2rem; border-radius: 1.1rem; background: #FEF2F2; border: 1px solid #FBD5D5; }
.ar-emerg__title { margin: 0; display: flex; align-items: center; gap: .45rem; font-weight: 700; font-size: .95rem; color: #991B1B; }
.ar-emerg__title svg { width: 1.1rem; height: 1.1rem; }
.ar-emerg__text { margin: .35rem 0 0; font-size: .88rem; line-height: 1.55; color: #B91C1C; }
.ar-cta { padding: 1.35rem 1.3rem; border-radius: 1.25rem; background: linear-gradient(150deg, #0B2C55, #0E5C7A); color: #D3E4EE; }
.ar-cta__title { margin: 0; font-family: var(--font-display, inherit); font-weight: 600; font-size: 1.1rem; line-height: 1.35; color: #fff; }
.ar-cta__text { margin: .45rem 0 0; font-size: .9rem; line-height: 1.6; }
.ar-cta__btn { margin-top: 1rem; display: inline-flex; align-items: center; gap: .45rem; padding: .7rem 1.2rem; border-radius: 999px; background: #F5B82E; color: #0B2C55; font-weight: 700; font-size: .92rem; transition: background-color .2s; }
.ar-cta__btn:hover { background: #FCD34D; color: #0B2C55; }
.ar-cta__btn svg { width: 1rem; height: 1rem; }
.ar-all { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; color: #0E7C99; }
.ar-all svg { width: 1rem; height: 1rem; }
@media (min-width: 768px) { .ar-more { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* blog article: generated table of contents (h2 + indented h3), sticky sidebar on desktop, collapsible on small screens */
.ar-toc__title { display: flex; align-items: center; gap: .45rem; }
.ar-toc__title svg { width: .95rem; height: .95rem; color: #0E7C99; }
.ar-toc__list { margin: 0; padding: 0; list-style: none; display: grid; gap: .1rem; }
.ar-toc__list a { display: block; padding: .45rem .7rem; border-radius: .6rem; border-left: 2px solid transparent; font-size: .9rem; line-height: 1.4; color: #334155; transition: background-color .2s, color .2s, border-color .2s; }
.ar-toc__list a:hover, .ar-toc__list a.is-active { background: #F0F8FB; color: #0E7C99; border-left-color: #0E7C99; }
.ar-toc__list a.is-active { font-weight: 600; }
.ar-toc__sub a { padding-left: 1.6rem; font-size: .84rem; color: #64748B; }
.ar-toc { max-height: calc(100vh - 8rem); overflow-y: auto; }
.ar-h2[id], .ar-body h3[id] { scroll-margin-top: 6.5rem; }
.ar-dodont__title { line-height: 1.3; }
.ar-toc-m { margin: 0 0 1.25rem; border: 1px solid #E2E8F0; border-radius: 1rem; background: #fff; }
.ar-toc-m summary { list-style: none; display: flex; align-items: center; gap: .5rem; padding: .9rem 1.1rem; cursor: pointer; font-weight: 600; font-size: .95rem; color: #0B2C55; }
.ar-toc-m summary::-webkit-details-marker { display: none; }
.ar-toc-m summary svg { width: 1rem; height: 1rem; color: #0E7C99; }
.ar-toc-m__chev { margin-left: auto; transition: transform .2s; }
.ar-toc-m[open] .ar-toc-m__chev { transform: rotate(180deg); }
.ar-toc-m .ar-toc__list { padding: 0 .6rem .8rem; }
@media (min-width: 1100px) { .ar-toc-m { display: none; } }

/* article sidebar: as tall as the article, so its inner block can stick while reading */
@media (min-width: 1100px) { .ar-layout > .ar-side { align-self: stretch; } .ar-side__sticky { position: sticky; top: 6.5rem; } }
@media (min-width: 1100px) { .ar-side__sticky { max-height: calc(100vh - 8rem); overflow-y: auto; scrollbar-width: thin; padding-bottom: .25rem; } .ar-side__sticky .ar-toc { max-height: none; overflow: visible; } }
@media (min-width: 768px) { .ar-more { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 900px; } }
/* article sidebar: no visible scrollbar (it can still scroll on short screens) */
.ar-side__sticky { scrollbar-width: none; -ms-overflow-style: none; }
.ar-side__sticky::-webkit-scrollbar { display: none; width: 0; height: 0; }

/* blog articles: h3, comparison table, chips, alert list, plain steps */
.ar-h3 { margin: 1.75rem 0 .65rem; font-family: var(--font-display, inherit); font-weight: 600; font-size: 1.2rem; line-height: 1.3; color: #0B2C55; }
.ar-table-wrap { margin: 1rem 0 1.4rem; overflow-x: auto; border: 1px solid #E2E8F0; border-radius: 1.1rem; background: #fff; }
.ar-table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: .93rem; line-height: 1.5; }
.ar-table th, .ar-table td { padding: .85rem 1rem; text-align: left; vertical-align: top; border-bottom: 1px solid #EEF3F6; }
.ar-table tbody tr:last-child th, .ar-table tbody tr:last-child td { border-bottom: 0; }
.ar-table thead th { background: #F4FAFC; font-family: var(--font-display, inherit); font-weight: 600; color: #0B2C55; white-space: nowrap; }
.ar-table thead th svg { width: 1rem; height: 1rem; color: #0E7C99; vertical-align: -2px; margin-right: .25rem; }
.ar-table tbody th { width: 9rem; font-weight: 600; color: #64748B; }
.ar-table tbody td:nth-child(2) { color: #0B2C55; font-weight: 500; }
.ar-chips { list-style: none; margin: .9rem 0 1.25rem; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.ar-chips li { padding: .5rem .9rem; border-radius: 999px; background: #F0F8FB; border: 1px solid #D5E8F0; font-size: .9rem; line-height: 1.35; color: #0B2C55; }
.ar-alert { list-style: none; margin: 1rem 0 1.25rem; padding: 0; display: grid; gap: .6rem; }
@media (min-width: 640px) { .ar-alert { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ar-alert li { display: flex; align-items: center; gap: .65rem; padding: .75rem .95rem; border-radius: .85rem; background: #FEF2F2; border: 1px solid #FBD5D5; font-size: .95rem; line-height: 1.4; color: #7F1D1D; }
.ar-alert strong { color: #991B1B; }
.ar-alert svg { flex-shrink: 0; width: 1.05rem; height: 1.05rem; color: #DC2626; }
.ar-donts--teal li::before { background: #0E7C99; }
.ar-steps--plain { margin: 1rem 0 1.4rem; }
/* article sidebar: compact contents so the whole sidebar fits on a laptop screen */
.ar-side__sticky { gap: .75rem; }
.ar-side__sticky .ar-toc { padding: 1rem 1.1rem; }
.ar-side__sticky .ar-toc__list a { padding: .32rem .65rem; font-size: .86rem; }
.ar-side__sticky .ar-toc__sub a { padding-left: 1.5rem; font-size: .8rem; }
.ar-side__sticky .ar-emerg { padding: .9rem 1.05rem; }
.ar-side__sticky .ar-cta { padding: 1.15rem 1.15rem; }

/* ---------- blog article v2: contents on the LEFT (sticky), article in a white card; TOC rows with a navy active row ---------- */
.ar-wrap { background: #F3F6F9; }
@media (min-width: 1100px) {
  .ar-layout { grid-template-columns: 340px minmax(0, 1fr); gap: 2.5rem; }
  .ar-layout > .ar-side { order: -1; }
}
.ar-body { max-width: none; padding: 1.25rem; border-radius: 1.5rem; background: #fff; border: 1px solid #E3EAF0; box-shadow: 0 20px 40px -32px rgba(11,44,85,.35); }
@media (min-width: 768px) { .ar-body { padding: 2rem 2.25rem 2.25rem; } }

/* contents box */
.ar-side__sticky .ar-toc, .ar-toc-m { padding: 0; overflow: hidden; border-radius: 1rem; background: #fff; border: 1px solid #E3EAF0; box-shadow: 0 16px 34px -28px rgba(11,44,85,.4); }
.ar-side__sticky .ar-toc__title { margin: 0; padding: 1rem 1.3rem; background: #0B2C55; color: #fff; font-family: var(--font-display, inherit); font-size: 1.3rem; font-weight: 600; letter-spacing: 0; text-transform: none; }
.ar-side__sticky .ar-toc__title svg { display: none; }
.ar-side__sticky .ar-toc__list, .ar-toc-m .ar-toc__list { gap: 0; padding: 0; }
.ar-side__sticky .ar-toc__list li + li, .ar-toc-m .ar-toc__list li + li { border-top: 1px solid #E9EEF3; }
.ar-side__sticky .ar-toc__list a, .ar-toc-m .ar-toc__list a {
  display: flex; align-items: flex-start; gap: .65rem; padding: .78rem 1.2rem; border-radius: 0; border-left: 4px solid transparent;
  font-size: .92rem; line-height: 1.4; font-weight: 500; color: #0B2C55; transition: background-color .2s, color .2s, border-color .2s;
}
.ar-side__sticky .ar-toc__list a::before, .ar-toc-m .ar-toc__list a::before {
  content: ""; flex-shrink: 0; width: 1rem; height: 1rem; margin-top: .12rem; background: currentColor; opacity: .55;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m12 16 4-4-4-4'/%3E%3Cpath d='M8 12h8'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m12 16 4-4-4-4'/%3E%3Cpath d='M8 12h8'/%3E%3C/svg%3E") no-repeat center / contain;
}
.ar-side__sticky .ar-toc__list a:hover, .ar-toc-m .ar-toc__list a:hover { background: #F4F8FB; color: #0E7C99; border-left-color: transparent; }
.ar-side__sticky .ar-toc__list a.is-active, .ar-toc-m .ar-toc__list a.is-active { background: #0B2C55; color: #fff; font-weight: 600; border-left-color: #F5B82E; }
.ar-side__sticky .ar-toc__list a.is-active::before, .ar-toc-m .ar-toc__list a.is-active::before { opacity: 1; }
.ar-side__sticky .ar-toc__sub a, .ar-toc-m .ar-toc__sub a { padding: .55rem 1.2rem .55rem 2.3rem; font-size: .84rem; color: #475569; }
.ar-side__sticky .ar-toc__sub a::before, .ar-toc-m .ar-toc__sub a::before { width: .8rem; height: .8rem; margin-top: .15rem; }

/* small screens: the same rows inside the collapsible box, navy header bar */
.ar-toc-m summary { padding: .95rem 1.2rem; background: #0B2C55; color: #fff; font-family: var(--font-display, inherit); font-size: 1.05rem; }
.ar-toc-m summary svg { color: #fff; }

/* sidebar holds only the contents: no height limit, never scrolls; emergency + booking cards sit at the end of the article */
.ar-side__sticky { max-height: none !important; overflow: visible !important; }
.ar-end { margin-top: 2.5rem; display: grid; gap: 1rem; }
@media (min-width: 768px) { .ar-end { grid-template-columns: 1fr 1.3fr; align-items: stretch; } }
.ar-end .ar-emerg, .ar-end .ar-cta { margin: 0; }
.ar-end .ar-emerg { display: flex; flex-direction: column; justify-content: center; }

/* hero photo, phones: the "Consultant Neurologist" chip sat over the doctor's face — move it down to shoulder level */
@media (max-width: 639.98px) {
  .hero-chip-top { top: 49%; right: -.25rem; padding: .5rem .75rem; gap: .6rem; }
  .hero-chip-top > span:first-child { width: 2.1rem; height: 2.1rem; }
  .float-chip.d2 { padding: .5rem .75rem; gap: .6rem; }
  .float-chip.d2 > span:first-child { width: 2.1rem; height: 2.1rem; }
}

/* footer bottom on phones / tablets: one centred stack — links, copyright, last-updated pill, then the credit under a hairline */
@media (max-width: 1023.98px) {
  .ft-bottom__inner { align-items: center; text-align: center; gap: .65rem; padding-top: 1.25rem; padding-bottom: 1rem; }
  .ft-bottom__links { order: 1; justify-content: center; gap: 0; font-size: .85rem; }
  .ft-bottom__links a + a::before { content: ""; display: inline-block; width: 4px; height: 4px; margin: 0 .75rem; border-radius: 50%; background: rgba(255,255,255,.3); vertical-align: middle; }
  .ft-bottom__copy { order: 2; font-size: .8rem; color: rgba(255,255,255,.5); }
  .ft-bottom__upd { order: 3; align-self: center; padding: .28rem .75rem; font-size: .74rem; }
  .ft-bottom__credit { order: 4; width: 100%; margin-top: .25rem; padding-top: .8rem; border-top: 1px solid rgba(255,255,255,.07); font-size: .74rem; color: rgba(255,255,255,.4); }
  .ft-bottom__credit a { color: #5FD0E6; font-weight: 600; }
}

/* ---------- Phone polish (responsive review, Nov 2026) ---------- */
@media (max-width: 639.98px) {
  /* treatment cards (home + treatments page): compact rows — icon | title + short text — instead of 14 tall cards */
  .d-grid:has(> .treat-card) { gap: .7rem !important; }
  .treat-card:has(.tc-icon) { display: grid !important; grid-template-columns: 3rem minmax(0, 1fr) 1.25rem; column-gap: .9rem; row-gap: .2rem; align-items: start; padding: 1rem 1.1rem !important; border-radius: 1.1rem !important; }
  .treat-card .tc-icon { grid-row: 1 / span 2; width: 3rem; height: 3rem; border-radius: .9rem; }
  .treat-card .tc-icon svg { width: 1.35rem; height: 1.35rem; }
  .treat-card:has(.tc-icon) > span:not(.tc-icon) { display: none; }   /* small "Neuro Psychiatry" label */
  .treat-card:has(.tc-icon) h3 { grid-column: 2; margin-top: .1rem !important; font-size: 1rem; line-height: 1.3; }
  .treat-card:has(.tc-icon) p { grid-column: 2; margin-top: 0 !important; font-size: .85rem; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .treat-card:has(.tc-icon) > div:last-child { grid-column: 3; grid-row: 1 / span 2; align-self: center; padding: 0 !important; margin: 0 !important; }
  .treat-card:has(.tc-icon) > div:last-child > span:first-child { display: none; }
  .treat-card .tc-arrow { width: 1.75rem; height: 1.75rem; background: none; color: #94A3B8; }
  .treat-card .tc-arrow svg { width: 1.1rem; height: 1.1rem; }
  /* the dark "All treatments" card stays a banner, just smaller */
  .treat-card:not(:has(.tc-icon)) { padding: 1.25rem 1.3rem !important; border-radius: 1.1rem !important; }
  .treat-card:not(:has(.tc-icon)) h3 { font-size: 1.2rem; }
  .treat-card:not(:has(.tc-icon)) > span:last-child { padding-top: .9rem !important; }

  /* clinic cards: Book full width, Directions + Details side by side */
  .cl-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
  .cl-actions > :first-child { grid-column: 1 / -1; }
  .cl-actions .cl-btn { padding: .75rem .9rem; font-size: .9rem; white-space: nowrap; }
}

/* bigger tap targets on touch screens (links that were ~20px tall) */
@media (max-width: 1023.98px) {
  .ft-more, .ft-clinic__name, .ft-bottom__links a, .ft-bottom__credit a, .cp2-facts__link, .nw-link { display: inline-flex; align-items: center; min-height: 32px; }
  .ft-clinic__links a { display: inline-flex; align-items: center; min-height: 30px; padding-left: .7rem; padding-right: .7rem; }
}
