/*
 * Smile Invent Dental Clinic: v2 design system (October 2026).
 *
 * The existing site's fonts (DM Sans headings, Poppins text) and colours (blue #014E94, teal
 * #16ACBD, light teal #E8F7F9). Real photographs of the doctors and their cases do the work;
 * decoration stays out of the way. Sections are kept tight: about 100px between two sections.
 *
 * Loaded only by the v2 layout (frontend/v2/layout.blade.php). The legacy pages never load it.
 */

:root {
    /* The existing site's colours and fonts (style.css / default.css): blue #014E94 and #0E5B9F,
       teal #16ACBD, light teal #E8F7F9, text #222; DM Sans headings, Poppins body. */
    --ink: #222222;
    --ink-soft: #3a3f45;
    --muted: #5f6b76;
    --blue: #014E94;
    --blue-deep: #0E5B9F;
    --blue-dark: #013a70;
    --aqua: #16ACBD;
    --aqua-soft: #E8F7F9;
    --ivory: #F3FAFB;
    --sand: #E8F7F9;
    --line: #dbe8ee;
    --white: #ffffff;
    --wa: #25d366;
    --radius: 16px;
    --radius-sm: 12px;
    --shadow: 0 18px 44px rgba(1, 78, 148, .12);
    --shadow-sm: 0 6px 18px rgba(1, 78, 148, .08);
    --serif: 'DM Sans', sans-serif;
    --sans: 'Poppins', sans-serif;
    --wrap: 1200px;

    /* The shared lead form and chat widget (si-conversion.css) take these colours. */
    --si-blue: var(--blue);
    --si-blue-dark: var(--blue-dark);
    --si-teal: var(--aqua);
    --si-teal-soft: var(--aqua-soft);
    --si-ink: var(--ink);
    --si-muted: var(--muted);
    --si-line: var(--line);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body.v2 { margin: 0; font-family: var(--sans); font-size: 16px; line-height: 1.65; color: var(--ink-soft); background: var(--white); -webkit-font-smoothing: antialiased; }
.v2 img { max-width: 100%; height: auto; display: block; }
.v2 a { color: var(--blue); text-decoration: none; }
.v2 a:hover { color: var(--blue-dark); }
.v2 h1, .v2 h2, .v2 h3, .v2 h4 { font-family: var(--serif); color: var(--ink); font-weight: 600; line-height: 1.2; margin: 0 0 .5em; letter-spacing: -.015em; }
.v2 h1 { font-size: clamp(2rem, 4vw, 3.1rem); color: var(--blue); }
.v2 h2 { font-size: clamp(1.7rem, 2.8vw, 2.35rem); }
.v2 h3 { font-size: 1.3rem; }
.v2 p { margin: 0 0 1em; }
.v2 ul, .v2 ol { margin: 0 0 1em; padding-left: 1.2em; }
.v2 :focus-visible { outline: 3px solid var(--aqua); outline-offset: 2px; border-radius: 4px; }
.v2-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.v2-skip { position: absolute; left: -9999px; top: 8px; z-index: 2000; background: var(--ink); color: #fff !important; padding: 10px 16px; border-radius: 8px; }
.v2-skip:focus { left: 12px; }

.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 20px; }
.section { padding: 56px 0; }
.section--ivory { background: var(--ivory); }
.section--sand { background: var(--sand); }
.section--navy { background: linear-gradient(135deg, #014E94 0%, #0E5B9F 60%, #16ACBD 140%); color: #dbe9f6; }
.section--navy h2, .section--navy h3 { color: #fff; }
.section--navy a:not(.btn) { color: #9fd9df; }
.section-head { max-width: 760px; margin-bottom: 28px; }
.section-head p { color: var(--muted); font-size: 1.05rem; margin: 0; }
.section-head--center { margin-left: auto; margin-right: auto; text-align: center; }
.section-head--row { max-width: none; display: flex; justify-content: space-between; align-items: end; gap: 20px; flex-wrap: wrap; }
.label { display: inline-flex; align-items: center; gap: 8px; font-size: .8rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--blue); margin-bottom: 14px; }
.label::before { content: ""; width: 22px; height: 2px; background: var(--aqua); }
.grid { display: grid; gap: 22px; }
.grid--2 { grid-template-columns: repeat(2, 1fr); }
.grid--3 { grid-template-columns: repeat(3, 1fr); }
.grid--4 { grid-template-columns: repeat(4, 1fr); }
.split { display: grid; grid-template-columns: 1.05fr 1fr; gap: 48px; align-items: center; }
.split--rev > :first-child { order: 2; }
@media (max-width: 991.98px) {
    .grid--3, .grid--4 { grid-template-columns: repeat(2, 1fr); }
    .split { grid-template-columns: 1fr; gap: 28px; }
    .split--rev > :first-child { order: 0; }
}
@media (max-width: 640px) {
    .section { padding: 40px 0; }
    .grid--2, .grid--3, .grid--4 { grid-template-columns: 1fr; }
    body.v2 { font-size: 16px; }
}

/* ---------- Buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 13px 22px; border-radius: 999px; font-weight: 600; font-size: .98rem; line-height: 1.2; border: 1.5px solid transparent; cursor: pointer; transition: background .15s, color .15s, border-color .15s; white-space: nowrap; font-family: var(--sans); }
.btn--primary { background: var(--blue); color: #fff !important; }
.btn--primary:hover { background: var(--blue-dark); }
.btn--ghost { border-color: var(--blue); color: var(--blue) !important; background: transparent; }
.btn--ghost:hover { background: var(--blue); color: #fff !important; }
.btn--light { background: #fff; color: var(--ink) !important; }
.btn--light:hover { background: var(--aqua-soft); }
.btn--wa { background: var(--wa); color: #fff !important; }
.btn--wa:hover { background: #1eb457; }
.btn--sm { padding: 9px 16px; font-size: .9rem; }
.btn-row { display: flex; flex-wrap: wrap; gap: 12px; }
.link-arrow { font-weight: 600; display: inline-flex; align-items: center; gap: 8px; }
.link-arrow::after { content: "\2192"; transition: transform .15s; }
.link-arrow:hover::after { transform: translateX(3px); }

/* ---------- Top bar and header ---------- */
.topbar { background: var(--blue); color: #dbe9f6; font-size: .82rem; }
.topbar .wrap { display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 38px; }
.topbar a { color: #fff !important; }
.topbar span { display: inline-flex; align-items: center; gap: 7px; }
.topbar i { color: #8fe0e8; }
@media (max-width: 767.98px) { .topbar .topbar__hours { display: none; } .topbar .wrap { justify-content: center; } }

.hdr { position: sticky; top: 0; z-index: 1000; background: rgba(255, 255, 255, .97); backdrop-filter: saturate(140%) blur(8px); border-bottom: 1px solid var(--line); }
.hdr .wrap { display: flex; align-items: center; gap: 24px; min-height: 76px; }
.hdr__logo img { height: 46px; width: auto; }
.nav { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.nav > li { list-style: none; position: relative; }
.nav { padding: 0; margin-top: 0; margin-bottom: 0; }
.nav > li > a, .nav > li > button { display: inline-flex; align-items: center; gap: 6px; padding: 10px 12px; color: var(--ink) !important; font-weight: 500; font-size: .95rem; background: none; border: 0; cursor: pointer; font-family: var(--sans); border-radius: 8px; }
.nav > li > a:hover, .nav > li > button:hover, .nav > li.is-open > button { background: var(--ivory); }
.nav > li > button i { font-size: .7rem; transition: transform .15s; }
.nav > li.is-open > button i { transform: rotate(180deg); }
.nav__panel { position: absolute; top: calc(100% + 8px); left: 0; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 22px; display: none; z-index: 10; }
.nav > li.is-open .nav__panel { display: block; }
.nav__panel--mega { width: 760px; left: -240px; display: none; grid-template-columns: repeat(4, 1fr); gap: 18px 24px; }
.nav > li.is-open .nav__panel--mega { display: grid; }
.nav__panel h4 { font-family: var(--sans); font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin: 0 0 8px; font-weight: 600; }
.nav__panel ul { list-style: none; padding: 0; margin: 0; }
.nav__panel li a { display: block; padding: 5px 0; color: var(--ink) !important; font-size: .94rem; }
.nav__panel li a:hover { color: var(--blue) !important; }
.nav__panel--small { min-width: 270px; }
.nav__all { grid-column: 1 / -1; border-top: 1px solid var(--line); padding-top: 14px; }
.hdr__actions { display: flex; align-items: center; gap: 10px; }
.hdr__call { display: inline-flex; flex-direction: column; line-height: 1.2; color: var(--ink) !important; font-weight: 600; font-size: .95rem; }
.hdr__call small { font-weight: 400; color: var(--muted); font-size: .74rem; }
.hdr__burger { display: none; margin-left: auto; background: none; border: 0; font-size: 1.5rem; color: var(--ink); cursor: pointer; padding: 8px; }
@media (max-width: 1040px) { .hdr__call { display: none; } }
@media (max-width: 991.98px) {
    .nav, .hdr__actions { display: none; }
    .hdr__burger { display: block; }
    .hdr .wrap { min-height: 64px; }
    .hdr__logo img { height: 40px; }
}

/* Mobile drawer */
.drawer { position: fixed; inset: 0; z-index: 1200; display: none; }
.drawer.is-open { display: block; }
.drawer__scrim { position: absolute; inset: 0; background: rgba(16, 35, 58, .45); }
.drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(88vw, 380px); background: #fff; overflow-y: auto; padding: 18px 20px 100px; }
.drawer__close { background: none; border: 0; font-size: 1.6rem; color: var(--ink); float: right; cursor: pointer; }
.drawer nav { clear: both; padding-top: 10px; }
.drawer details { border-bottom: 1px solid var(--line); }
.drawer summary, .drawer nav > a { display: flex; justify-content: space-between; align-items: center; padding: 14px 2px; font-weight: 600; color: var(--ink) !important; cursor: pointer; list-style: none; border-bottom: 1px solid var(--line); }
.drawer details summary { border-bottom: 0; }
.drawer summary::-webkit-details-marker { display: none; }
.drawer summary::after { content: "+"; font-size: 1.2rem; color: var(--muted); }
.drawer details[open] summary::after { content: "\2212"; }
.drawer details ul { list-style: none; padding: 0 0 12px 10px; margin: 0; }
.drawer details li a { display: block; padding: 7px 0; color: var(--ink-soft) !important; }
.drawer__cta { display: grid; gap: 10px; margin-top: 20px; }

/* ---------- Hero (home) ---------- */
.hero { background: var(--ivory); padding: 48px 0 0; overflow: hidden; }
.hero .split { align-items: end; grid-template-columns: 1.08fr 1fr; }
.hero__copy { padding-bottom: 56px; }
.hero__lead { font-size: 1.25rem; color: var(--aqua); font-family: var(--serif); font-weight: 600; margin-bottom: 10px; }
.hero__text { color: var(--muted); max-width: 560px; }
.hero__facts { display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 22px 0 26px; padding: 0; list-style: none; font-size: .93rem; color: var(--ink); }
.hero__facts li { display: inline-flex; align-items: center; gap: 8px; }
.hero__facts i { color: var(--aqua); }
.hero__media { position: relative; align-self: stretch; display: flex; align-items: flex-end; }
.hero__media img { width: 100%; border-radius: 26px 26px 0 0; object-fit: cover; aspect-ratio: 9 / 10; }
.hero__badge { position: absolute; left: -22px; bottom: 40px; background: #fff; border-radius: 14px; box-shadow: var(--shadow); padding: 14px 16px; display: flex; gap: 12px; align-items: center; max-width: 280px; }
.hero__badge i { width: 40px; height: 40px; border-radius: 50%; background: var(--aqua-soft); color: var(--blue); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.hero__badge strong { display: block; color: var(--ink); font-size: .95rem; line-height: 1.25; }
.hero__badge small { color: var(--muted); font-size: .8rem; }
.stats { display: flex; gap: 28px; flex-wrap: wrap; margin-top: 4px; }
.stats div { display: flex; flex-direction: column; }
.stats strong { font-family: var(--serif); font-size: 1.85rem; color: var(--blue); font-weight: 700; line-height: 1.1; }
.stats span { font-size: .85rem; color: var(--muted); }
@media (max-width: 991.98px) {
    .hero { padding-top: 32px; }
    .hero__copy { padding-bottom: 8px; }
    .hero__badge { left: 12px; bottom: 16px; }
    .hero__media img { aspect-ratio: 4 / 3.4; border-radius: 22px 22px 0 0; }
}

/* Booking bar under the hero */
.bookbar { position: relative; z-index: 2; margin-top: -1px; background: var(--blue); padding: 22px 0; }
.bookbar .si-form-card { background: transparent; box-shadow: none; border: 0; padding: 0; color: #fff; }
.bookbar .si-form-card__title { color: #fff; font-family: var(--serif); font-weight: 700; font-size: 1.35rem; margin: 0; }
.bookbar .si-form-card__note { color: #b9c6d3; margin: 2px 0 0; font-size: .9rem; }
.bookbar .si-lead-form label { color: #c9d4df; font-weight: 500; font-size: .8rem; }
.bookbar .si-form-foot { color: #9fb0c1; text-align: left; }
.bookbar .si-form-foot a { color: #fff; }

/* Lead form in the v2 design */
.v2 .si-form-card { border-radius: var(--radius); border-top: 0; box-shadow: var(--shadow); padding: 26px 24px 20px; }
.v2 .si-form-card__title { font-family: var(--serif); font-weight: 700; font-size: 1.4rem; color: var(--blue); }
.v2 .si-btn--primary { border-radius: 999px; }
.v2 .si-lead-form input[type=text], .v2 .si-lead-form input[type=tel], .v2 .si-lead-form input[type=email], .v2 .si-lead-form input[type=date], .v2 .si-lead-form select, .v2 .si-lead-form textarea { border-radius: 10px; background: #fff; }
.si-form-card--bar { display: grid; grid-template-columns: 240px 1fr; gap: 24px; align-items: center; }
.si-form-card--bar .si-lead-form { display: grid; grid-template-columns: 1fr 1.15fr 1fr auto; gap: 12px; align-items: end; }
.si-form-card--bar .si-field { margin: 0; }
.si-form-card--bar .si-btn--block { width: auto; padding: 12px 22px; min-height: 44px; }
.si-form-card--bar .si-form-error, .si-form-card--bar .si-form-foot { grid-column: 1 / -1; margin: 0; }
@media (max-width: 991.98px) {
    .si-form-card--bar { grid-template-columns: 1fr; gap: 12px; }
    .si-form-card--bar .si-lead-form { grid-template-columns: 1fr 1fr; }
    .si-form-card--bar .si-btn--block { grid-column: 1 / -1; width: 100%; }
}
@media (max-width: 560px) { .si-form-card--bar .si-lead-form { grid-template-columns: 1fr; } }

/* ---------- Credentials strip ---------- */
.creds { border-bottom: 1px solid var(--line); background: #fff; }
.creds .wrap { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.creds div { padding: 22px 18px; display: flex; gap: 12px; align-items: flex-start; border-right: 1px solid var(--line); }
.creds div:last-child { border-right: 0; }
.creds i { color: var(--blue); font-size: 1.25rem; margin-top: 3px; }
.creds strong { display: block; color: var(--ink); font-size: .95rem; line-height: 1.3; }
.creds span { font-size: .82rem; color: var(--muted); }
@media (max-width: 991.98px) { .creds .wrap { grid-template-columns: 1fr 1fr; } .creds div:nth-child(2) { border-right: 0; } .creds div:nth-child(-n+2) { border-bottom: 1px solid var(--line); } }
@media (max-width: 560px) { .creds .wrap { grid-template-columns: 1fr; } .creds div { border-right: 0; border-bottom: 1px solid var(--line); } }

/* ---------- Treatments by need ---------- */
.needs { grid-template-columns: repeat(4, 1fr); }
.need { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 24px 22px; display: flex; flex-direction: column; transition: box-shadow .2s, transform .2s; }
.need:hover { box-shadow: var(--shadow-sm); transform: translateY(-2px); }
.need__icon { width: 46px; height: 46px; border-radius: 12px; background: var(--aqua-soft); color: var(--blue); display: inline-flex; align-items: center; justify-content: center; font-size: 1.2rem; margin-bottom: 14px; }
.need h3 { font-size: 1.25rem; margin-bottom: 6px; }
.need p { color: var(--muted); font-size: .94rem; }
.need ul { list-style: none; padding: 0; margin: 4px 0 0; border-top: 1px solid var(--line); }
.need li a { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); color: var(--ink) !important; font-weight: 500; font-size: .95rem; }
.need li a::after { content: "\2192"; color: var(--aqua); }
.need li a:hover { color: var(--blue) !important; }
@media (max-width: 991.98px) { .needs { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .needs { grid-template-columns: 1fr; } }

/* ---------- Doctors ---------- */
.doc { background: #fff; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); display: grid; grid-template-columns: 0.9fr 1.1fr; }
.doc__photo img { width: 100%; height: 100%; object-fit: cover; min-height: 320px; }
.doc__body { padding: 26px 26px 22px; display: flex; flex-direction: column; }
.doc__role { color: var(--blue); font-weight: 600; font-size: .9rem; margin-bottom: 4px; }
.doc__qual { color: var(--ink); font-weight: 600; font-size: .95rem; margin-bottom: 12px; }
.doc ul { list-style: none; padding: 0; margin: 0 0 16px; font-size: .93rem; }
.doc li { padding: 6px 0 6px 24px; position: relative; color: var(--ink-soft); }
.doc li::before { content: "\f00c"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; left: 0; top: 7px; color: var(--aqua); font-size: .8rem; }
.doc .btn { margin-top: auto; align-self: flex-start; }
@media (max-width: 767.98px) { .doc { grid-template-columns: 1fr; } .doc__photo img { min-height: 0; aspect-ratio: 4 / 3.2; } }
.certs { display: flex; gap: 14px; overflow-x: auto; padding: 6px 2px 10px; scroll-snap-type: x mandatory; margin-top: 26px; }
.certs figure { margin: 0; flex: 0 0 180px; scroll-snap-align: start; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 8px; }
.certs img { width: 100%; height: 130px; object-fit: contain; }
.certs figcaption { font-size: .78rem; color: var(--muted); text-align: center; padding-top: 6px; line-height: 1.35; }

/* ---------- Results (before and after) ---------- */
.results { grid-template-columns: repeat(4, 1fr); }
.result { margin: 0; background: #fff; border-radius: var(--radius-sm); overflow: hidden; border: 1px solid var(--line); }
.result img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.result figcaption { padding: 10px 12px; font-size: .86rem; color: var(--muted); }
.result figcaption strong { color: var(--ink); display: block; font-size: .92rem; }
@media (max-width: 991.98px) { .results { grid-template-columns: repeat(2, 1fr); } }

/* ---------- About block ---------- */
.photo-stack { position: relative; }
.photo-stack img { border-radius: var(--radius); width: 100%; object-fit: cover; }
.photo-stack__note { position: absolute; right: -14px; bottom: -18px; background: var(--blue); color: #fff; border-radius: 14px; padding: 16px 18px; max-width: 230px; box-shadow: var(--shadow); }
.photo-stack__note strong { font-family: var(--serif); font-size: 1.8rem; display: block; line-height: 1; font-weight: 700; }
.photo-stack__note span { font-size: .86rem; color: #d6e6f6; }
@media (max-width: 767.98px) { .photo-stack__note { right: 10px; bottom: 10px; } }
.ticks { list-style: none; padding: 0; margin: 18px 0 22px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; }
.ticks li { padding-left: 26px; position: relative; font-size: .95rem; color: var(--ink); }
.ticks li::before { content: "\f00c"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; left: 0; top: 2px; color: var(--aqua); }
@media (max-width: 560px) { .ticks { grid-template-columns: 1fr; } }

/* ---------- Reviews ---------- */
.reviews { grid-template-columns: repeat(3, 1fr); }
.review { background: #fff; border-radius: var(--radius); padding: 22px; border: 1px solid var(--line); display: flex; flex-direction: column; margin: 0; }
.review__stars { color: #f2b01e; font-size: .85rem; letter-spacing: 2px; margin-bottom: 8px; }
.review blockquote { margin: 0 0 14px; color: var(--ink-soft); font-size: .97rem; flex: 1; }
.review figcaption { display: flex; align-items: center; gap: 10px; font-weight: 600; color: var(--ink); font-size: .93rem; }
.review figcaption span { width: 34px; height: 34px; border-radius: 50%; background: var(--aqua-soft); color: var(--blue); display: inline-flex; align-items: center; justify-content: center; font-weight: 700; }
.review figcaption small { display: block; font-weight: 400; color: var(--muted); font-size: .8rem; }
@media (max-width: 991.98px) { .reviews { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .reviews { grid-template-columns: 1fr; } }

/* ---------- International band ---------- */
.intl .split { align-items: start; }
.intl-steps { list-style: none; padding: 0; margin: 0; counter-reset: st; display: grid; gap: 12px; }
.intl-steps li { background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .18); border-radius: 14px; padding: 14px 16px 14px 58px; position: relative; color: #e1edf8; font-size: .94rem; }
.intl-steps li::before { counter-increment: st; content: counter(st); position: absolute; left: 16px; top: 14px; width: 28px; height: 28px; border-radius: 50%; background: #fff; color: var(--blue); font-weight: 700; display: inline-flex; align-items: center; justify-content: center; font-size: .9rem; }
.intl-steps strong { color: #fff; display: block; }
.flags { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 24px; }
.flags span { background: rgba(255, 255, 255, .08); border-radius: 999px; padding: 6px 12px; font-size: .84rem; color: #e3ebf2; }

/* ---------- FAQ ---------- */
.faq { border-top: 1px solid var(--line); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { list-style: none; cursor: pointer; padding: 18px 40px 18px 0; position: relative; font-weight: 600; color: var(--ink); font-size: 1.02rem; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 4px; top: 14px; font-size: 1.5rem; color: var(--blue); font-weight: 400; transition: transform .2s; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details > div { padding: 0 0 18px; color: var(--muted); max-width: 820px; }

/* ---------- Blog cards ---------- */
.post { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; }
.post img { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; }
.post div { padding: 18px 20px 20px; display: flex; flex-direction: column; flex: 1; }
.post h3 { font-size: 1.12rem; line-height: 1.35; }
.post h3 a { color: var(--ink) !important; }
.post p { font-size: .92rem; color: var(--muted); }
.post .link-arrow { margin-top: auto; font-size: .92rem; }

/* ---------- Visit / closing ---------- */
.visit { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 22px; align-items: stretch; }
.visit__card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 24px; }
.visit__card dl { margin: 0; }
.visit__card dt { font-size: .74rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin-top: 14px; font-weight: 600; }
.visit__card dt:first-child { margin-top: 0; }
.visit__card dd { margin: 3px 0 0; color: var(--ink); }
.visit__map { border-radius: var(--radius); overflow: hidden; min-height: 340px; border: 1px solid var(--line); }
.visit__map iframe { width: 100%; height: 100%; min-height: 340px; border: 0; display: block; }
@media (max-width: 991.98px) { .visit { grid-template-columns: 1fr; } }

/* ---------- Footer ---------- */
.ftr { background: #0b3a6b; color: #c3d4e6; font-size: .93rem; padding: 52px 0 0; }
.ftr a { color: #dce6ef !important; }
.ftr a:hover { color: #fff !important; }
.ftr__grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 32px; }
.ftr h4 { font-family: var(--sans); color: #fff; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; font-weight: 600; margin-bottom: 14px; }
.ftr ul { list-style: none; padding: 0; margin: 0; }
.ftr li { padding: 4px 0; }
.ftr__logo { background: #fff; border-radius: 12px; padding: 8px 12px; display: inline-block; margin-bottom: 16px; }
.ftr__logo img { height: 40px; width: auto; }
.ftr__social { display: flex; gap: 10px; margin-top: 16px; }
.ftr__social a { width: 36px; height: 36px; border-radius: 50%; background: rgba(255, 255, 255, .08); display: inline-flex; align-items: center; justify-content: center; }
.ftr__bottom { border-top: 1px solid rgba(255, 255, 255, .1); margin-top: 40px; padding: 18px 0 22px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; font-size: .84rem; }
.ftr__bottom ul { display: flex; flex-wrap: wrap; gap: 6px 18px; }
@media (max-width: 991.98px) { .ftr__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .ftr__grid { grid-template-columns: 1fr; } }

/* ---------- Treatment page ---------- */
.t-hero { background: var(--ivory); padding: 34px 0 48px; }
.crumbs { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 0; margin: 0 0 18px; font-size: .86rem; color: var(--muted); }
.crumbs li + li::before { content: "/"; margin-right: 6px; color: #b5aea2; }
.crumbs a { color: var(--muted) !important; }
.t-hero .split { align-items: start; grid-template-columns: 1.15fr .85fr; }
.t-hero__sub { font-family: var(--serif); font-weight: 600; color: var(--aqua); font-size: 1.25rem; margin-bottom: 14px; }
.t-hero__text { color: var(--muted); }
.t-hero__doctor { display: flex; align-items: center; gap: 14px; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; margin: 22px 0; max-width: 520px; }
.t-hero__doctor img { width: 58px; height: 58px; border-radius: 50%; object-fit: cover; object-position: top; }
.t-hero__doctor strong { display: block; color: var(--ink); line-height: 1.25; }
.t-hero__doctor span { color: var(--muted); font-size: .85rem; }
.t-hero .si-form-card { position: sticky; top: 100px; }
.toc { position: sticky; top: 76px; z-index: 50; background: #fff; border-bottom: 1px solid var(--line); }
.toc ul { list-style: none; display: flex; gap: 4px; overflow-x: auto; padding: 0; margin: 0; scrollbar-width: none; }
.toc ul::-webkit-scrollbar { display: none; }
.toc a { display: block; padding: 14px 12px; white-space: nowrap; color: var(--muted) !important; font-weight: 500; font-size: .92rem; border-bottom: 2px solid transparent; }
.toc a.is-active, .toc a:hover { color: var(--ink) !important; border-bottom-color: var(--blue); }
@media (max-width: 991.98px) { .toc { top: 64px; } }
.prose { max-width: 760px; }
.prose p { color: var(--ink-soft); }
.media-card img { border-radius: var(--radius); width: 100%; object-fit: cover; }
.types { grid-template-columns: repeat(3, 1fr); }
.type { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.type img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--ivory); }
.type div { padding: 18px 20px 20px; }
.type h3 { font-size: 1.15rem; }
.type p { color: var(--muted); font-size: .94rem; margin: 0; }
@media (max-width: 991.98px) { .types { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .types { grid-template-columns: 1fr; } }
.steps { list-style: none; padding: 0; margin: 0; counter-reset: step; display: grid; gap: 14px; }
.steps > li { display: grid; grid-template-columns: 56px 1fr; gap: 16px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; }
.steps > li::before { counter-increment: step; content: counter(step); width: 44px; height: 44px; border-radius: 50%; background: var(--blue); color: #fff; font-family: var(--serif); font-weight: 700; font-size: 1.2rem; display: inline-flex; align-items: center; justify-content: center; }
.steps h3 { font-size: 1.15rem; margin-bottom: 4px; }
.steps p { margin: 0; color: var(--muted); }
.checks { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.checks li { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 13px 16px 13px 46px; position: relative; color: var(--ink); }
.checks li::before { content: "\f00c"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; left: 16px; top: 14px; width: 20px; height: 20px; border-radius: 50%; background: var(--aqua-soft); color: var(--blue); font-size: .72rem; display: inline-flex; align-items: center; justify-content: center; }
.checks li strong { color: var(--ink); }
.compare { grid-template-columns: 1fr 1fr; }
.compare article { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; }
.compare h3 { font-size: 1.15rem; }
.compare p { color: var(--muted); margin: 0; }
@media (max-width: 640px) { .compare { grid-template-columns: 1fr; } }
.callout { background: var(--aqua-soft); border-radius: var(--radius); padding: 20px 22px; color: var(--ink); margin-top: 18px; }
.related { display: flex; flex-wrap: wrap; gap: 10px; }
.related a { border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 9px 16px; color: var(--ink) !important; font-weight: 500; font-size: .93rem; }
.related a:hover { border-color: var(--blue); color: var(--blue) !important; }
.cta-band { background: linear-gradient(135deg, #014E94, #0E5B9F 70%, #16ACBD 150%); border-radius: 24px; padding: 36px; color: #dbe9f7; display: grid; grid-template-columns: 1.2fr 1fr; gap: 28px; align-items: center; }
.cta-band h2 { color: #fff; margin-bottom: 8px; }
.cta-band p { margin: 0; }
@media (max-width: 767.98px) { .cta-band { grid-template-columns: 1fr; padding: 26px 22px; } }

/* Chat launcher and WhatsApp in v2 */
.v2 .si-chat-launcher { background: var(--blue); }
.v2 .si-chat__head { background: var(--blue); }
.creds p { margin: 0; }
.nav > li > a, .nav > li > button { white-space: nowrap; }
.hdr__call { white-space: nowrap; }
@media (max-width: 1340px) { .hdr__call { display: none; } }
@media (max-width: 1100px) { .nav > li > a, .nav > li > button { padding: 10px 8px; font-size: .9rem; } }
.hdr__logo { flex-shrink: 0; }
.v2 .bookbar .si-form-card__title { color: #fff; font-size: 1.35rem; }
.v2 .bookbar .si-form-card { box-shadow: none; padding: 0; background: transparent; }
.v2 .bookbar .si-btn--primary { background: #fff; color: var(--blue) !important; }
.v2 .bookbar .si-btn--primary:hover { background: var(--aqua-soft); }
@media (max-width: 991.98px) {
    .hero .split, .t-hero .split { grid-template-columns: 1fr; }
    .t-hero .si-form-card { position: static; }
    .hero__media img { aspect-ratio: 4 / 3.3; }
}
@media (max-width: 560px) {
    .stats { gap: 18px; }
    .stats strong { font-size: 1.5rem; }
    .hero__badge { max-width: 240px; padding: 10px 12px; }
}

/* Full-width layout (Sachin, 2 Oct 2026): content spans the screen with side padding. */
:root { --wrap: 100%; --gutter: clamp(20px, 4vw, 72px); }
.wrap { max-width: 100%; padding-left: var(--gutter); padding-right: var(--gutter); }
.section-head { max-width: 900px; }
.section-head--row { max-width: none; }
.section-head--row > div { max-width: 900px; }
.prose { max-width: 860px; }
.hero .split { grid-template-columns: 1.1fr 1fr; gap: clamp(28px, 4vw, 80px); }
.hero__media img { max-height: 720px; }
.nav__panel--mega { width: 820px; }
@media (min-width: 1600px) {
    .needs, .results { gap: 28px; }
    body.v2 { font-size: 17px; }
}
@media (max-width: 991.98px) { .hero .split { grid-template-columns: 1fr; } }
.hdr .nav { margin: 0 0 0 auto; }

/* Hero portrait: the two doctors cut out, on a soft brand-coloured disc. */
.hero__media--portrait { justify-content: center; }
.hero__media--portrait::before { content: ""; position: absolute; left: 50%; bottom: -12%; width: 92%; aspect-ratio: 1; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(circle at 50% 40%, #ffffff 0%, #d4f1f4 45%, #9fdde5 100%); z-index: 0; }
.hero__media--portrait img { position: relative; z-index: 1; width: auto; max-width: 100%; max-height: 640px; aspect-ratio: auto; border-radius: 0; object-fit: contain; }
.hero__media--portrait .hero__badge { z-index: 2; left: 0; bottom: 60px; }
@media (max-width: 991.98px) {
    .hero__media--portrait img { max-height: 460px; }
    .hero__media--portrait .hero__badge { left: 8px; bottom: 24px; }
}

/* Hero and booking bar fit in the first screen on laptops (Sachin, 2 Oct 2026). */
@media (min-width: 992px) {
    .hero { padding-top: 24px; }
    .hero__copy { padding-bottom: 28px; }
    .hero .split { align-items: end; }
    .v2 .hero h1 { font-size: clamp(2rem, 3vw, 2.75rem); margin-bottom: .35em; }
    .hero__lead { margin-bottom: 6px; }
    .hero__text { margin-bottom: 0; }
    .hero__facts { margin: 14px 0 18px; gap: 6px 20px; }
    .hero .stats { margin-top: 18px !important; }
    .hero__media--portrait img { max-height: max(380px, calc(100vh - 340px)); }
    .hero__media--portrait .hero__badge { bottom: 28px; }
    .bookbar { padding: 16px 0; }
    .bookbar .si-form-foot { display: none; }
}
@media (min-width: 992px) {
    .hero__media--portrait img { max-height: max(360px, calc(100vh - 380px)); }
    .topbar .wrap { min-height: 32px; }
    .hdr .wrap { min-height: 68px; }
    .hero__copy { padding-bottom: 22px; }
}
@media (min-width: 992px) and (max-height: 820px) {
    .hero__facts { display: none; }
    .v2 .hero h1 { font-size: 2.35rem; }
}
/* Bigger logo (Sachin, 2 Oct 2026) */
.hdr__logo img { height: 58px; }
@media (max-width: 991.98px) { .hdr__logo img { height: 48px; } }
@media (min-width: 992px) { .hdr .wrap { min-height: 82px; } }
@media (max-width: 991.98px) { .hdr .wrap { min-height: 70px; } }

/* Home: Gallery albums (Admin -> Manage Gallery) */
.albums { grid-template-columns: repeat(6, 1fr); }
.album { display: block; background: #fff; border: 1px solid var(--line); border-radius: var(--radius-sm); overflow: hidden; color: var(--ink) !important; transition: box-shadow .2s, transform .2s; }
.album:hover { box-shadow: var(--shadow-sm); transform: translateY(-2px); }
.album img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.album span { display: block; padding: 12px 14px; font-weight: 600; font-size: .94rem; font-family: var(--serif); }
@media (max-width: 1199.98px) { .albums { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px) { .albums { grid-template-columns: repeat(2, 1fr); } }

/* Home About: the doctors at work, instead of a third posed portrait */
.atwork { position: relative; display: grid; grid-template-columns: 1fr 0.42fr; gap: 14px; align-items: end; }
.atwork img { border-radius: var(--radius); width: 100%; object-fit: cover; }
.atwork__main { aspect-ratio: 508 / 400; }
.atwork__side { aspect-ratio: 192 / 330; }
.atwork .photo-stack__note { right: auto; left: 18px; bottom: -18px; }
@media (max-width: 560px) { .atwork { grid-template-columns: 1fr; } .atwork__side { display: none; } .atwork .photo-stack__note { left: 10px; bottom: 10px; } }
@media (min-width: 561px) { .atwork .photo-stack__note { left: auto; right: calc(29.6% + 26px); top: 14px; bottom: auto; max-width: 200px; padding: 12px 14px; } }

/* First screen = hero + booking bar, nothing else (Sachin, 2 Oct 2026). --chrome-h is set by site.js. */
@media (min-width: 992px) {
    .fold { min-height: calc(100vh - var(--chrome-h, 114px)); display: flex; flex-direction: column; }
    .fold .hero { flex: 1; display: flex; align-items: stretch; padding-top: 28px; }
    .fold .hero > .wrap { align-self: stretch; }
    .fold .hero .split { height: 100%; align-items: end; }
    .fold .hero__copy { align-self: center; padding-bottom: 28px; }
    .hero__media--portrait img { max-height: calc(100vh - var(--chrome-h, 114px) - 150px); }
    .hero__facts { display: flex !important; }
    .v2 .hero h1 { font-size: clamp(2.2rem, 3.2vw, 3rem); }
}
@media (min-width: 992px) and (max-height: 760px) {
    .hero__facts { display: none !important; }
}

/* Hero: the doctors inside one circle (Sachin, 2 Oct 2026); no cut-out edges on the background. */
.hero__media--portrait { align-items: center; }
.hero__media--portrait::before { display: none; }
.hero__media--portrait img { border-radius: 50%; aspect-ratio: 1; width: min(100%, 560px); height: auto; max-height: none; box-shadow: 0 0 0 10px #ffffff, 0 0 0 11px var(--line), 0 24px 50px rgba(1, 78, 148, .14); }
@media (min-width: 992px) {
    .hero__media--portrait img { width: min(92%, calc(100vh - var(--chrome-h, 114px) - 210px), 560px); }
    .fold .hero .split { align-items: center; }
    .fold .hero__copy { padding-bottom: 0; }
    .fold .hero { padding: 28px 0; }
    .hero__media--portrait .hero__badge { left: 0; bottom: 6%; }
}
@media (max-width: 991.98px) {
    .hero__media--portrait { padding-bottom: 28px; }
    .hero__media--portrait img { width: min(86%, 380px); }
    .hero__media--portrait .hero__badge { bottom: 10px; }
}

/* Chat and WhatsApp buttons step above the booking bar while it is visible (desktop). */
.v2 .si-chat-launcher, .v2 .whatsapp-float { transition: bottom .25s ease; }
@media (min-width: 768px) {
    body.v2.is-bar-visible .si-chat-launcher { bottom: calc(var(--bookbar-h, 110px) + 18px); }
    body.v2.is-bar-visible .whatsapp-float { bottom: calc(var(--bookbar-h, 110px) + 90px) !important; }
}
/* Floating WhatsApp button (its style lived in the legacy style.css, which v2 does not load). */
.v2 .whatsapp-float { position: fixed; right: 22px; bottom: 90px; width: 54px; height: 54px; border-radius: 50%; background: var(--wa); color: #fff !important; display: flex; align-items: center; justify-content: center; font-size: 28px; z-index: 1055; box-shadow: 0 8px 20px rgba(0, 0, 0, .2); }
.v2 .whatsapp-float:hover { background: #1eb457; }
@media (max-width: 767.98px) { .v2 .whatsapp-float { display: none !important; } }
/* Treatment hero: both doctors when the page has no single lead doctor */
.t-hero__faces { display: inline-flex; flex-shrink: 0; }
.t-hero__faces img + img { margin-left: -16px; box-shadow: 0 0 0 3px #fff; }
.steps li ul li::before { display: none; }
.steps ul { list-style: disc; padding-left: 18px; color: var(--muted); }

/* Treatment pages: benefit points, At a Glance and the mid-page prompt */
.t-points { list-style: none; padding: 0; margin: 16px 0 6px; display: grid; gap: 8px; }
.t-points li { position: relative; padding-left: 28px; color: var(--ink); font-weight: 500; }
.t-points li::before { content: "\f00c"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; left: 0; top: 2px; width: 19px; height: 19px; border-radius: 50%; background: var(--aqua); color: #fff; font-size: .65rem; display: inline-flex; align-items: center; justify-content: center; }
.glance { background: var(--blue); color: #e3eef9; padding: 22px 0; }
.glance .wrap { display: grid; grid-template-columns: 220px 1fr; gap: 24px; align-items: center; }
.v2 .glance__title { color: #fff; font-size: 1.3rem; margin: 0; }
.glance__grid { margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.glance__grid dt { font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: #9fdde5; font-weight: 600; }
.glance__grid dd { margin: 3px 0 0; color: #fff; font-size: .93rem; line-height: 1.45; }
@media (max-width: 991.98px) { .glance .wrap { grid-template-columns: 1fr; } .glance__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .glance__grid { grid-template-columns: 1fr; } }
.midcta { background: var(--aqua-soft); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 18px 0; }
.midcta .wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; }
.midcta p { margin: 0; color: var(--ink); }

/* Treatment and content sections: tighter, text-led layout (Sachin, 2 Oct 2026). */
.section .split:has(> .media-card) { grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: start; }
.section .split--rev:has(> .media-card) { grid-template-columns: minmax(0, 1fr) minmax(0, 1.65fr); }
.media-card { position: sticky; top: 150px; }
.media-card img { width: 100%; max-height: 360px; object-fit: cover; border-radius: var(--radius); }
.prose { max-width: 920px; }
.prose p { margin-bottom: .85em; }
/* Lists inside prose: compact ticks, two columns when there are several */
.prose ul.checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 28px; margin: 6px 0 16px; }
.prose ul.checks li { background: none; border: 0; border-radius: 0; padding: 2px 0 2px 28px; font-size: .97rem; }
.prose ul.checks li::before { left: 0; top: 5px; }
.prose ul.checks:has(> li:only-child), .prose ul.checks:has(> li:nth-child(2):last-child) { grid-template-columns: 1fr; }
@media (max-width: 767.98px) { .prose ul.checks { grid-template-columns: 1fr; } .media-card { position: static; } .media-card img { max-height: 260px; } }
/* Cards: smaller pictures */
.type img { aspect-ratio: 16 / 10; max-height: 190px; }
.type div { padding: 16px 18px 18px; }
.types { gap: 18px; }
@media (min-width: 1400px) { .types { grid-template-columns: repeat(4, 1fr); } }
/* Steps: less padding */
.steps > li { padding: 16px 18px; }
/* Card rows and before/after rows fill the width whatever the count */
.grid.types { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
@media (min-width: 1400px) { .grid.types { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); } }
.grid.types:has(> .type:nth-child(2):last-child) .type { display: grid; grid-template-columns: 38% 1fr; }
.grid.types:has(> .type:nth-child(2):last-child) .type img { height: 100%; max-height: none; aspect-ratio: auto; }
#results .grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
#results .result img { max-height: 280px; object-fit: contain; background: #fff; }
@media (max-width: 640px) { .grid.types:has(> .type:nth-child(2):last-child) .type { grid-template-columns: 1fr; } }

/* Never crop content images (Sachin, 2 Oct 2026): whole image, natural proportions, scaled to fit. */
.media-card img { width: auto; max-width: 100%; height: auto; max-height: 380px; object-fit: contain; margin: 0 auto; }
.type img { width: 100%; height: 190px; max-height: none; aspect-ratio: auto; object-fit: contain; background: #fff; padding: 6px; }
.grid.types:has(> .type:nth-child(2):last-child) .type img { height: 100%; min-height: 200px; object-fit: contain; }
.result img, #results .result img { width: 100%; height: auto; aspect-ratio: auto; max-height: 320px; object-fit: contain; background: #fff; }
.post img { aspect-ratio: auto; height: auto; object-fit: contain; }
.results .result img { aspect-ratio: auto; }
.atwork img { aspect-ratio: auto !important; height: auto; object-fit: contain; }
.doc__photo { background: var(--ivory); display: flex; align-items: flex-start; }
.doc__photo img { width: 100%; height: auto; min-height: 0; object-fit: contain; }
.album img { aspect-ratio: auto; height: 200px; object-fit: contain; background: var(--ivory); }
.visit--two { grid-template-columns: 1fr 1.4fr; }
@media (max-width: 991.98px) { .visit--two { grid-template-columns: 1fr; } }
/* Even card rows: columns chosen from the card count */
.grid.types.types--2 { grid-template-columns: repeat(2, 1fr); }
.grid.types.types--3 { grid-template-columns: repeat(3, 1fr); }
.grid.types.types--4 { grid-template-columns: repeat(4, 1fr); }
.grid.types.types--5 { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 1199.98px) { .grid.types.types--4, .grid.types.types--5 { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 991.98px) { .grid.types.types--3, .grid.types.types--4, .grid.types.types--5 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .grid.types[class*="types--"] { grid-template-columns: 1fr; } }
.certs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 16px; }
.certs-grid figure { margin: 0; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 10px; }
.certs-grid img { width: 100%; height: 170px; object-fit: contain; }
.certs-grid figcaption { font-size: .8rem; color: var(--muted); text-align: center; padding-top: 8px; line-height: 1.35; }

/* Doctor cards, vertical (Sachin, 2 Oct 2026): whole photo on top, text below, no empty column. */
.doc { display: flex; flex-direction: column; }
.doc__photo { display: flex; justify-content: center; align-items: flex-end; background: linear-gradient(180deg, var(--aqua-soft), #ffffff); padding: 20px 20px 0; }
.doc__photo img { width: auto; max-width: 100%; height: 340px; min-height: 0; object-fit: contain; border-radius: 12px 12px 0 0; }
.doc__body { padding: 22px 26px 24px; }
.doc__body h3 { font-size: 1.45rem; margin-bottom: 2px; }
.doc__role { margin-bottom: 2px; }
.doc__qual { font-weight: 500; color: var(--muted); font-size: .92rem; margin-bottom: 14px; }
.doc__body > p:not([class]) { color: var(--ink-soft); font-size: .96rem; line-height: 1.65; }
.doc ul { border-top: 1px solid var(--line); padding-top: 12px; margin-bottom: 18px; }
.doc li { padding: 4px 0 4px 22px; font-size: .88rem; color: var(--muted); }
.doc li::before { top: 5px; }
@media (max-width: 767.98px) { .doc__photo img { height: 280px; } }
.doc__photo { padding: 20px; }
.doc__photo img { border-radius: 12px; }
.reviews-masonry { columns: 3 320px; column-gap: 20px; }
.reviews-masonry .review { break-inside: avoid; margin-bottom: 20px; }
.related a.is-active { background: var(--blue); color: #fff !important; border-color: var(--blue); }
@media (max-width: 991.98px) { .section > .wrap[style*="grid-template-columns:minmax(0,1.7fr)"] { grid-template-columns: 1fr !important; } }
/* Gallery, blog and article pages */
.albums--page { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.photo-grid { columns: 4 260px; column-gap: 16px; }
.photo-grid figure { break-inside: avoid; margin: 0 0 16px; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 8px; }
.photo-grid img { width: 100%; height: auto; border-radius: 8px; }
.photo-grid figcaption { font-size: .86rem; color: var(--muted); padding: 8px 4px 2px; }
.posts-grid .post img { width: 100%; height: auto; }
.pager { margin-top: 30px; }
.pager .pagination { display: flex; gap: 10px; list-style: none; padding: 0; justify-content: center; }
.pager .page-link { display: inline-block; padding: 10px 18px; border: 1px solid var(--line); border-radius: 999px; background: #fff; }
.pager .disabled .page-link { opacity: .45; }
.article-layout { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 48px; align-items: start; }
.article { max-width: 860px; }
.article__cover { width: 100%; height: auto; border-radius: var(--radius); margin-bottom: 24px; }
.article__toc { background: var(--aqua-soft); border-radius: 14px; padding: 16px 20px; margin-bottom: 24px; }
.article__toc p { font-weight: 600; color: var(--ink); margin: 0 0 6px; }
.article__toc ol { margin: 0; padding-left: 20px; }
.article__toc li { padding: 2px 0; }
.article__body { font-size: 1.02rem; line-height: 1.75; color: var(--ink-soft); }
.article__body h2 { font-size: 1.6rem; margin-top: 1.4em; scroll-margin-top: 120px; }
.article__body h3 { font-size: 1.25rem; margin-top: 1.2em; }
.article__body img { max-width: 100%; height: auto; border-radius: 12px; margin: 14px 0; }
.article__body ul, .article__body ol { padding-left: 1.3em; }
.article__body li { margin-bottom: .35em; }
.article__body table { width: 100%; border-collapse: collapse; margin: 16px 0; font-size: .95rem; }
.article__body td, .article__body th { border: 1px solid var(--line); padding: 8px 10px; }
.article__author { display: flex; gap: 16px; align-items: center; border-top: 1px solid var(--line); margin-top: 32px; padding-top: 20px; }
.article__author p { margin: 0; font-size: .92rem; color: var(--muted); }
.article__aside { position: sticky; top: 150px; }
@media (max-width: 991.98px) { .article-layout { grid-template-columns: 1fr; } .article__aside { position: static; } }
.media-card { margin: 0; }
.media-card figcaption { font-size: .85rem; color: var(--muted); margin-top: 8px; text-align: center; }
.intl-photo { margin: 0 0 16px; background: rgba(255,255,255,.1); border-radius: 16px; padding: 10px; }
.intl-photo img { width: 100%; height: auto; border-radius: 10px; }
.intl-photo figcaption { color: #dbe9f6; font-size: .85rem; padding: 8px 4px 2px; }
.reviews-masonry .review[hidden] { display: none !important; }
@media (max-width: 991.98px) {
    .section .split:has(> .media-card), .section .split--rev:has(> .media-card) { grid-template-columns: 1fr; }
    .section .split--rev:has(> .media-card) > .media-card { order: 2; }
    .media-card { position: static; }
}

/* Home international band: copy | photo | steps, all the same height band (Sachin, 2 Oct 2026) */
.intl__grid { display: grid; grid-template-columns: 1.15fr 0.85fr 1fr; gap: clamp(24px, 3vw, 48px); align-items: center; }
.intl-photo { margin: 0; align-self: center; }
.intl-photo img { width: 100%; height: auto; max-height: 380px; object-fit: contain; }
.intl-steps { gap: 10px; }
.intl-steps li { padding: 11px 14px 11px 54px; font-size: .9rem; }
.intl-steps li::before { top: 11px; left: 14px; width: 26px; height: 26px; font-size: .85rem; }
@media (max-width: 1199.98px) { .intl__grid { grid-template-columns: 1fr 1fr; } .intl__copy { grid-column: 1 / -1; } }
@media (max-width: 767.98px) { .intl__grid { grid-template-columns: 1fr; } }

/* Blog listing (/blogs), a dental library: search + "what's bothering you" hero, latest articles,
   then one shelf per topic with related treatments beside its articles. Banners are 1280x690
   with text in them: always shown whole. */
.lib-hero { background: linear-gradient(135deg, var(--blue) 0%, var(--blue-deep) 60%, #0f7fa6 100%); color: #fff; padding: 34px 0 56px; }
.lib-hero .crumbs, .lib-hero .crumbs a { color: rgba(255, 255, 255, .8) !important; }
.lib-hero__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.lib-hero h1 { color: #fff; font-size: clamp(2rem, 3.6vw, 3rem); margin: 14px 0 12px; }
.lib-hero__intro { color: rgba(255, 255, 255, .88); max-width: 600px; margin-bottom: 24px; }
.lib-search { position: relative; display: block; max-width: 600px; margin: 0; }
.lib-search i { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); color: var(--blue); }
.lib-search input { width: 100%; border: 0; border-radius: 999px; padding: 17px 22px 17px 50px; font: inherit; font-size: 1rem; color: var(--ink); box-shadow: 0 10px 30px rgba(0, 0, 0, .18); }
.lib-search input:focus { outline: 3px solid rgba(22, 172, 189, .55); outline-offset: 2px; }
.lib-search__result { margin: 12px 0 0 6px; font-weight: 600; color: #fff; }
.lib-ask { background: #fff; border-radius: var(--radius); padding: 18px; box-shadow: var(--shadow); }
.lib-ask__title { font-family: var(--serif); font-weight: 600; font-size: 1.1rem; color: var(--ink); margin: 4px 8px 10px; }
.lib-ask a { display: flex; align-items: center; gap: 14px; padding: 11px 10px; border-radius: var(--radius-sm); color: var(--ink) !important; font-weight: 500; }
.lib-ask a + a { border-top: 1px solid var(--line); }
.lib-ask a:hover { background: var(--aqua-soft); }
.lib-ask a i:first-child { width: 36px; height: 36px; border-radius: 50%; background: var(--aqua-soft); color: var(--blue); display: grid; place-items: center; flex: none; font-size: .95rem; }
.lib-ask a span { flex: 1; }
.lib-ask a i:last-child { color: var(--aqua); font-size: .85rem; }
.lib-img { display: block; flex: none; }
.lib-img img { display: block; width: 100%; height: auto; aspect-ratio: 1280 / 690; object-fit: contain; background: #fff; border: 1px solid var(--line); border-radius: var(--radius-sm); }
.lib-meta { font-size: .84rem; color: var(--muted); margin: 0 0 6px; }
.lib-meta span { color: var(--blue); font-weight: 600; margin-right: 10px; }
.lib-latest h2 { margin-bottom: 26px; }
.lib-latest__grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(24px, 3.5vw, 56px); align-items: start; }
.lib-lead .lib-img { margin-bottom: 18px; }
.lib-lead h3 { font-size: clamp(1.35rem, 2vw, 1.75rem); line-height: 1.28; margin: 0 0 10px; }
.lib-lead h3 a, .lib-row h3 a { color: var(--ink) !important; }
.lib-lead h3 a:hover, .lib-row h3 a:hover { color: var(--blue) !important; }
.lib-lead > p:last-child { color: var(--ink-soft); }
.lib-latest__list { display: flex; flex-direction: column; gap: 22px; }
.lib-row { display: flex; gap: 22px; align-items: flex-start; }
.lib-row[hidden], .lib-shelf[hidden] { display: none; }
.lib-row .lib-img { width: min(40%, 300px); }
.lib-row h3 { font-size: 1.12rem; line-height: 1.35; margin: 0 0 8px; }
.lib-row p { font-size: .92rem; color: var(--muted); margin-bottom: 8px; }
.lib-row--compact .lib-img { width: min(42%, 230px); }
.lib-row--compact h3 { font-size: 1.04rem; }
.lib-shelf { padding: 64px 0; scroll-margin-top: 110px; }
.lib-shelf--tint { background: var(--ivory); }
.lib-shelf__grid { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.lib-shelf__side { position: sticky; top: 130px; }
.lib-shelf__icon { width: 52px; height: 52px; border-radius: 14px; background: var(--blue); color: #fff; display: grid; place-items: center; font-size: 1.25rem; margin-bottom: 16px; }
.lib-shelf__side h2 { font-size: clamp(1.5rem, 2.2vw, 1.9rem); margin-bottom: 10px; }
.lib-shelf__side > p { color: var(--ink-soft); }
.lib-shelf__label { font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--muted) !important; margin: 20px 0 8px; }
.lib-shelf__side ul { list-style: none; padding: 0; margin: 0 0 22px; }
.lib-shelf__side li a { display: inline-flex; align-items: center; gap: 8px; padding: 4px 0; font-weight: 500; }
.lib-shelf__side li a::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--aqua); }
.lib-shelf__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 40px; }
.lib-shelf__list .lib-row { flex-direction: column; gap: 14px; }
.lib-shelf__list .lib-row .lib-img { width: 100%; }
.lib-none p { text-align: center; color: var(--muted); }
@media (max-width: 1199.98px) { .lib-shelf__list { grid-template-columns: 1fr; } .lib-shelf__list .lib-row { flex-direction: row; } .lib-shelf__list .lib-row .lib-img { width: min(40%, 300px); } }
@media (max-width: 991.98px) {
    .lib-hero__grid, .lib-latest__grid, .lib-shelf__grid { grid-template-columns: 1fr; }
    .lib-shelf__side { position: static; }
    .lib-shelf { padding: 48px 0; }
}
@media (max-width: 560px) {
    .lib-row, .lib-shelf__list .lib-row { flex-direction: column; gap: 12px; }
    .lib-row .lib-img, .lib-row--compact .lib-img, .lib-shelf__list .lib-row .lib-img { width: 100%; }
}

/* Blog article (/blogs/{slug}), a patient guide: topic + summary hero with the whole banner,
   "In this guide" with progress on the left, the article, a treatment card on the right. */
.guide-progress { position: fixed; left: 0; right: 0; top: 0; height: 4px; z-index: 1100; pointer-events: none; }
.guide-progress span { display: block; height: 100%; background: var(--aqua); transform: scaleX(0); transform-origin: 0 50%; }
.guide-hero { background: var(--ivory); border-bottom: 1px solid var(--line); padding: 30px 0 48px; }
.guide-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.guide-topic { display: inline-flex; align-items: center; gap: 8px; margin: 18px 0 12px; background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 6px 14px; font-weight: 600; font-size: .86rem; color: var(--blue) !important; }
.guide-hero h1 { font-size: clamp(1.8rem, 3.2vw, 2.7rem); line-height: 1.2; margin: 0 0 14px; }
.guide-hero__sum { color: var(--ink-soft); font-size: 1.05rem; margin-bottom: 22px; }
.guide-byline { display: flex; align-items: center; gap: 14px; font-size: .9rem; color: var(--muted); }
.guide-byline strong { color: var(--ink); }
.guide-byline__faces { display: flex; flex: none; }
.guide-byline__faces img { width: 44px; height: 44px; border-radius: 50%; border: 2px solid #fff; box-shadow: var(--shadow-sm); }
.guide-byline__faces img + img { margin-left: -10px; }
.guide-hero__img { margin: 0; }
.guide-hero__img img { display: block; width: 100%; height: auto; aspect-ratio: 1280 / 690; object-fit: contain; border-radius: var(--radius); background: #fff; box-shadow: var(--shadow); }
.guide { padding: 56px 0 72px; }
.guide__grid { display: grid; grid-template-columns: 250px minmax(0, 1fr) 300px; gap: clamp(28px, 3.5vw, 56px); align-items: start; }
.guide-nav { position: sticky; top: 130px; max-height: calc(100vh - 160px); overflow: auto; }
.guide-nav p { font-weight: 600; color: var(--ink); text-transform: uppercase; font-size: .78rem; letter-spacing: .07em; margin: 0 0 10px; }
.guide-nav ol { list-style: none; margin: 0; padding: 0; border-left: 2px solid var(--line); }
.guide-nav li { margin-left: -2px; border-left: 2px solid transparent; }
.guide-nav li.is-read { border-left-color: var(--aqua); }
.guide-nav a { display: block; padding: 7px 0 7px 14px; font-size: .88rem; line-height: 1.4; color: var(--muted) !important; }
.guide-nav a:hover { color: var(--blue) !important; }
.guide-nav a.is-current { color: var(--blue) !important; font-weight: 600; }
.guide-nav li:has(a.is-current) { border-left-color: var(--blue); }
.guide-body { max-width: 780px; font-size: 1.04rem; line-height: 1.8; color: var(--ink-soft); }
.guide-body > p:first-child { font-size: 1.14rem; color: var(--ink); }
.guide-body h2 { font-size: clamp(1.4rem, 2vw, 1.7rem); line-height: 1.3; margin: 1.8em 0 .6em; padding-top: 1.2em; border-top: 1px solid var(--line); scroll-margin-top: 120px; color: var(--ink); }
.guide-body h3 { font-size: 1.18rem; margin: 1.4em 0 .4em; color: var(--ink); }
.guide-body a { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
.guide-body img { max-width: 100%; height: auto; border-radius: 12px; margin: 14px 0; }
.guide-body ul, .guide-body ol { padding-left: 1.3em; }
.guide-body li { margin-bottom: .4em; }
.guide-body li::marker { color: var(--aqua); }
.guide-body table { display: block; overflow-x: auto; width: 100%; border-collapse: collapse; margin: 20px 0; font-size: .93rem; line-height: 1.55; }
.guide-body th, .guide-body td { border: 1px solid var(--line); padding: 10px 12px; text-align: left; vertical-align: top; min-width: 140px; }
.guide-body tr:first-child td, .guide-body th { background: var(--aqua-soft); color: var(--ink); font-weight: 600; }
.guide-ask { display: flex; flex-wrap: wrap; gap: 18px 28px; align-items: center; justify-content: space-between; background: linear-gradient(140deg, var(--blue), var(--blue-deep)); color: #fff; border-radius: var(--radius); padding: 26px 28px; margin: 36px 0 8px; line-height: 1.6; }
.guide-ask > div:first-child { flex: 1 1 340px; }
.guide-ask p { margin: 0; color: rgba(255, 255, 255, .9); font-size: .97rem; }
.guide-ask .guide-ask__title { font-family: var(--serif); font-size: 1.3rem; font-weight: 600; color: #fff; margin-bottom: 6px; }
.guide-ask__btns { display: flex; flex-wrap: wrap; gap: 10px; }
.guide-body .guide-ask a { text-decoration: none; }
.guide-note { margin-top: 36px; padding: 16px 18px; background: var(--ivory); border-radius: var(--radius-sm); font-size: .9rem; color: var(--muted); }
.guide-side { position: sticky; top: 130px; }
.guide-card { border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; background: #fff; box-shadow: var(--shadow-sm); }
.guide-card__label { font-weight: 600; color: var(--ink); text-transform: uppercase; font-size: .78rem; letter-spacing: .07em; margin: 0 0 8px; }
.guide-card ul { list-style: none; padding: 0; margin: 0 0 16px; }
.guide-card li a { display: flex; justify-content: space-between; align-items: center; padding: 11px 0; border-bottom: 1px solid var(--line); font-weight: 500; color: var(--ink) !important; }
.guide-card li a i { color: var(--aqua); font-size: .8rem; }
.guide-card li a:hover { color: var(--blue) !important; }
.guide-card__text { font-size: .88rem; color: var(--muted); margin-bottom: 16px; }
.guide-card .btn { width: 100%; justify-content: center; }
.guide-card__call { display: block; text-align: center; margin-top: 12px; font-weight: 600; }
.guide-team h2 { margin-bottom: 24px; }
.guide-team__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-bottom: 22px; }
.guide-doc { display: flex; gap: 20px; align-items: flex-start; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; }
.guide-doc img { width: 96px; height: 96px; border-radius: 50%; flex: none; }
.guide-doc h3 { font-size: 1.15rem; margin: 0 0 4px; }
.guide-doc__q { color: var(--blue); font-weight: 500; font-size: .9rem; margin-bottom: 8px; }
.guide-doc ul { margin: 0; padding-left: 1.1em; font-size: .88rem; color: var(--muted); }
.guide-doc li { margin-bottom: 3px; }
.guide-more__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.guide-more__grid .lib-row { flex-direction: column; gap: 14px; }
.guide-more__grid .lib-row .lib-img { width: 100%; }
@media (max-width: 1279.98px) { .guide__grid { grid-template-columns: minmax(0, 1fr) 290px; } .guide-nav { display: none; } }
@media (max-width: 991.98px) {
    .guide-hero__grid, .guide__grid, .guide-team__grid, .guide-more__grid { grid-template-columns: 1fr; }
    .guide-hero__img { order: -1; }
    .guide-side { position: static; }
    .guide { padding: 36px 0 48px; }
}
@media (max-width: 560px) { .guide-doc { flex-direction: column; } .guide-ask { padding: 22px; } }

/* Header: Patient Resources dropdown. Four previews rather than a link list: the Google rating
   with a patient quote, FAQs by treatment, the latest articles and a clinic photo. */
.nav__panel--res { width: min(980px, calc(100vw - 48px)); left: 50%; transform: translateX(-58%); padding: 14px; display: none; grid-template-columns: 1.05fr 1fr 1.15fr 1fr; gap: 14px; }
.nav > li.is-open .nav__panel--res { display: grid; }
.nav__panel--res > * { border-radius: var(--radius-sm); padding: 18px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.res-label { font-family: var(--serif); font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.res-sub { font-size: .82rem; color: var(--muted); line-height: 1.4; }
.res-more { margin-top: auto; padding-top: 6px; font-weight: 600; font-size: .88rem; color: var(--blue) !important; }
.res-more::after { content: " →"; }
.res-reviews { background: linear-gradient(150deg, var(--blue), var(--blue-deep)); color: #fff !important; }
.res-reviews .res-label, .res-reviews .res-sub { color: rgba(255, 255, 255, .78); }
.res-score { font-family: var(--serif); font-size: 2.3rem; font-weight: 600; line-height: 1; display: flex; align-items: center; gap: 10px; }
.res-stars { font-size: 1rem; color: #ffc940; letter-spacing: 2px; }
.res-reviews q { font-size: .88rem; line-height: 1.5; color: #fff; margin-top: 6px; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.res-reviews .res-more { color: #fff !important; }
.res-reviews:hover { box-shadow: var(--shadow-sm); }
.res-col { background: var(--ivory); }
.nav__panel--res .res-col ul { list-style: none; margin: 0; padding: 0; }
.nav__panel--res .res-col li a { display: block; padding: 7px 0; border-bottom: 1px solid var(--line); font-size: .9rem; color: var(--ink) !important; }
.nav__panel--res .res-col li:last-child a { border-bottom: 0; }
.nav__panel--res .res-col li a:hover { color: var(--blue) !important; }
.res-post { display: flex; gap: 10px; align-items: center; padding: 4px 0; color: var(--ink) !important; font-size: .86rem; line-height: 1.35; font-weight: 500; }
.res-post img { width: 84px; height: auto; aspect-ratio: 1280 / 690; object-fit: contain; background: #fff; border-radius: 8px; border: 1px solid var(--line); flex: none; }
.res-post span { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.res-post:hover { color: var(--blue) !important; }
.res-gallery { background: var(--aqua-soft); color: var(--ink) !important; }
.res-gallery img { width: 100%; height: auto; border-radius: 10px; }
.res-gallery:hover .res-more { text-decoration: underline; }

/* Header: Treatments dropdown. Groups as tabs on the left (each with what it is for), the
   group's treatments with their one-line summaries, a photo from that group, and a strip for
   visitors who are not sure what they need. */
.nav__panel--tx { width: min(1040px, calc(100vw - 48px)); left: -190px; padding: 0; display: none; grid-template-columns: 290px minmax(0, 1fr); overflow: hidden; }
.nav > li.is-open .nav__panel--tx { display: grid; }
.tx-tabs { background: var(--ivory); padding: 12px; display: flex; flex-direction: column; gap: 2px; border-right: 1px solid var(--line); }
.tx-tabs button { text-align: left; background: none; border: 0; border-radius: var(--radius-sm); padding: 10px 14px; cursor: pointer; font: inherit; display: flex; flex-direction: column; gap: 1px; position: relative; }
.tx-tabs strong { font-weight: 600; font-size: .94rem; color: var(--ink); }
.tx-tabs span { font-size: .8rem; color: var(--muted); }
.tx-tabs button:hover { background: #fff; }
.tx-tabs button[aria-selected="true"] { background: #fff; box-shadow: var(--shadow-sm); }
.tx-tabs button[aria-selected="true"] strong { color: var(--blue); }
.tx-tabs button[aria-selected="true"]::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 3px; border-radius: 3px; background: var(--aqua); }
.tx-pane { padding: 22px 24px 18px; display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: 24px; align-items: start; }
.tx-pane[hidden] { display: none; }
.nav__panel--tx .tx-pane ul { display: grid; gap: 4px; }
.nav__panel--tx .tx-pane li a { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: var(--radius-sm); }
.nav__panel--tx .tx-pane li a:hover { background: var(--ivory); }
.tx-pane li strong { font-weight: 600; color: var(--ink); font-size: .96rem; }
.tx-pane li a:hover strong { color: var(--blue); }
.tx-pane li span { font-size: .84rem; color: var(--muted); line-height: 1.4; }
.tx-photo { margin: 0; }
.tx-photo img { width: 100%; height: auto; max-height: 220px; object-fit: contain; border-radius: var(--radius-sm); background: var(--ivory); }
.tx-photo figcaption { font-size: .78rem; color: var(--muted); margin-top: 6px; }
.tx-foot { grid-column: 2; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 14px 24px; border-top: 1px solid var(--line); background: #fff; font-size: .88rem; color: var(--muted); }
.tx-foot span { flex: 1 1 300px; }
.tx-foot strong { color: var(--ink); }
.tx-foot .link-arrow { font-size: .88rem; }
.nav__panel--tx .tx-tabs { grid-row: 1 / span 2; }

/* Header: Dental Tourism dropdown. The journey in three steps, the two pages, and the photo
   of Dr. Boskey with international patients. */
.nav__panel--trip { width: min(900px, calc(100vw - 48px)); left: 50%; transform: translateX(-40%); padding: 0; display: none; grid-template-columns: 1.1fr 1fr .9fr; overflow: hidden; }
.nav > li.is-open .nav__panel--trip { display: grid; }
.trip-steps { background: linear-gradient(150deg, var(--blue), var(--blue-deep)); color: #fff; padding: 22px 24px; }
.trip-steps .res-label { color: rgba(255, 255, 255, .78); }
.trip-steps ol { list-style: none; counter-reset: trip; margin: 14px 0 0; padding: 0; display: grid; gap: 14px; }
.trip-steps li { counter-increment: trip; display: grid; grid-template-columns: 30px 1fr; column-gap: 12px; }
.trip-steps li::before { content: counter(trip); grid-row: span 2; width: 30px; height: 30px; border-radius: 50%; background: rgba(255, 255, 255, .16); display: grid; place-items: center; font-weight: 600; font-size: .9rem; }
.trip-steps strong { font-size: .95rem; font-weight: 600; }
.trip-steps span { font-size: .82rem; color: rgba(255, 255, 255, .8); line-height: 1.4; }
.trip-links { padding: 18px; display: flex; flex-direction: column; gap: 4px; }
.trip-links a:not(.btn) { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: var(--radius-sm); }
.trip-links a:not(.btn):hover { background: var(--ivory); }
.trip-links strong { font-weight: 600; color: var(--ink); font-size: .96rem; }
.trip-links a:hover strong { color: var(--blue); }
.trip-links span { font-size: .84rem; color: var(--muted); line-height: 1.4; }
.trip-links .btn { margin: auto 12px 4px; justify-content: center; }
.trip-photo { margin: 0; padding: 18px 18px 18px 0; }
.trip-photo img { width: 100%; height: auto; border-radius: var(--radius-sm); }
.trip-photo figcaption { font-size: .78rem; color: var(--muted); margin-top: 6px; }

/* Gallery (/image-gallery): one band per album with a big lead photo and four beside it.
   Photos are 800x800 squares, shown whole. Album pages show every photo three across. */
.gal-album { padding: 64px 0; scroll-margin-top: 110px; }
.gal-album--tint { background: var(--ivory); }
.gal-album__head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 22px; }
.gal-album__head h2 { margin: 0; }
.gal-mosaic { display: grid; gap: 14px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.gal-mosaic--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gal-mosaic--5 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gal-mosaic--5 .gal-photo:first-child { grid-column: span 2; grid-row: span 2; }
.gal-photo { position: relative; display: block; margin: 0; border-radius: var(--radius); overflow: hidden; background: #fff; }
.gal-photo[hidden] { display: none; }
.gal-photo img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; transition: transform .35s ease; }
a.gal-photo:hover img, .gal-photo a:hover img { transform: scale(1.03); }
.gal-photo a { display: block; overflow: hidden; border-radius: var(--radius); }
.gal-photo__more { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(1, 58, 112, .62); color: #fff; font-family: var(--serif); font-weight: 600; font-size: 1.15rem; }
.gal-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 22px; }
.gal-grid .gal-photo { border-radius: 0; overflow: visible; background: none; }
.gal-grid figcaption { font-size: .9rem; color: var(--muted); margin-top: 10px; line-height: 1.45; }
.gal-photo--video iframe { width: 100%; aspect-ratio: 1; border: 0; border-radius: var(--radius); }
.gal-others { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 18px; }
.gal-others a { display: block; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; color: var(--ink) !important; font-weight: 600; }
.gal-others img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; }
.gal-others span { display: block; padding: 12px 14px; }
.gal-others a:hover span { color: var(--blue); }
@media (max-width: 991.98px) {
    .gal-mosaic--4, .gal-mosaic--5, .gal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .gal-album { padding: 44px 0; }
}
@media (max-width: 560px) { .gal-grid { grid-template-columns: 1fr; } .gal-mosaic { gap: 10px; } }

/* Photo viewer ([data-lightbox] links, grouped by the attribute's value). */
.lb { position: fixed; inset: 0; z-index: 2000; background: rgba(6, 18, 32, .94); display: none; align-items: center; justify-content: center; flex-direction: column; padding: 56px 72px 24px; }
.lb.is-open { display: flex; }
.lb img { max-width: 100%; max-height: calc(100vh - 150px); object-fit: contain; border-radius: 8px; }
.lb__cap { color: #fff; margin-top: 14px; text-align: center; font-size: .95rem; max-width: 760px; }
.lb__count { color: rgba(255, 255, 255, .6); font-size: .82rem; margin-top: 4px; }
.lb button { position: absolute; background: rgba(255, 255, 255, .12); color: #fff; border: 0; width: 48px; height: 48px; border-radius: 50%; font-size: 1.3rem; cursor: pointer; display: grid; place-items: center; }
.lb button:hover { background: rgba(255, 255, 255, .24); }
.lb__close { top: 16px; right: 16px; }
.lb__prev { left: 16px; top: 50%; transform: translateY(-50%); }
.lb__next { right: 16px; top: 50%; transform: translateY(-50%); }
@media (max-width: 640px) { .lb { padding: 56px 12px 24px; } .lb__prev, .lb__next { top: auto; bottom: 18px; transform: none; } .lb img { max-height: calc(100vh - 200px); } }

/* Reviews (/testimonials): rating beside a featured patient story, themes patients mention (each
   with a sentence a patient wrote; clicking filters the wall), the review wall with a treatment
   list, and an invitation to review on Google. */
.rv-hero { background: var(--ivory); border-bottom: 1px solid var(--line); padding: 30px 0 56px; }
.rv-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.rv-hero h1 { font-size: clamp(2rem, 3.6vw, 3rem); margin: 14px 0 10px; }
.rv-hero__intro { color: var(--ink-soft); max-width: 520px; margin-bottom: 24px; }
.rv-score { display: flex; align-items: center; gap: 18px; margin-bottom: 26px; }
.rv-score strong { font-family: var(--serif); font-size: clamp(3.4rem, 6vw, 4.6rem); line-height: 1; color: var(--blue); font-weight: 600; }
.rv-score div { display: flex; flex-direction: column; gap: 4px; color: var(--muted); font-size: .95rem; }
.rv-stars { color: #f5b301; letter-spacing: 2px; font-size: 1.05rem; }
.rv-feature { margin: 0; background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); padding: clamp(24px, 3vw, 40px); position: relative; }
.rv-feature > i { font-size: 2rem; color: var(--aqua); opacity: .6; }
.rv-feature blockquote { margin: 12px 0 22px; font-size: clamp(1.05rem, 1.4vw, 1.22rem); line-height: 1.7; color: var(--ink); font-family: var(--serif); }
/* The hero's rotating reviews share one grid cell, so the card keeps the tallest review's height and never jumps. */
.rv-slides { display: grid; margin-top: 6px; }
.rv-slide { grid-area: 1 / 1; margin: 0; opacity: 0; visibility: hidden; transition: opacity .5s ease, visibility .5s; display: flex; flex-direction: column; }
.rv-slide.is-active { opacity: 1; visibility: visible; }
.rv-slide blockquote { margin: 10px 0 20px; }
.rv-slide figcaption { margin-top: auto; }
.rv-nav { display: flex; align-items: center; gap: 14px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); }
.rv-nav > button { width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--line); background: #fff; color: var(--blue); cursor: pointer; display: grid; place-items: center; font-size: .8rem; }
.rv-nav > button:hover { border-color: var(--blue); }
.rv-dots { display: flex; gap: 8px; flex: 1; justify-content: center; }
.rv-dots button { width: 9px; height: 9px; border-radius: 999px; border: 0; padding: 0; background: var(--line); cursor: pointer; transition: width .25s, background .25s; }
.rv-dots button[aria-current="true"] { width: 26px; background: var(--blue); }
@media (prefers-reduced-motion: reduce) { .rv-slide { transition: none; } }
.rv-feature figcaption, .rv-card figcaption { display: flex; align-items: center; gap: 12px; }
.rv-feature figcaption > span:last-child, .rv-card figcaption > span:last-child { display: flex; flex-direction: column; font-size: .88rem; }
.rv-feature strong, .rv-card strong { color: var(--ink); font-size: .96rem; }
.rv-feature figcaption a, .rv-card figcaption a { color: var(--blue) !important; font-weight: 500; }
.rv-card figcaption em { font-style: normal; color: var(--muted); }
.rv-initial { width: 42px; height: 42px; border-radius: 50%; background: var(--blue); color: #fff; display: grid; place-items: center; font-weight: 600; flex: none; }
.rv-themes h2 { margin-bottom: 24px; }
.rv-themes__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.rv-theme { text-align: left; font: inherit; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; display: flex; flex-direction: column; gap: 10px; cursor: pointer; transition: box-shadow .2s, border-color .2s; }
.rv-theme:hover, .rv-theme[aria-pressed="true"] { border-color: var(--aqua); box-shadow: var(--shadow-sm); }
.rv-theme__icon { width: 44px; height: 44px; border-radius: 12px; background: var(--aqua-soft); color: var(--blue); display: grid; place-items: center; font-size: 1.1rem; }
.rv-theme strong { font-family: var(--serif); font-size: 1.08rem; color: var(--ink); font-weight: 600; }
.rv-theme q { color: var(--ink-soft); font-size: .92rem; line-height: 1.6; }
.rv-theme mark { background: rgba(22, 172, 189, .2); color: var(--ink); padding: 0 2px; border-radius: 3px; }
.rv-theme__name { font-size: .84rem; color: var(--muted); }
.rv-theme__more { margin-top: auto; font-weight: 600; font-size: .88rem; color: var(--blue); }
.rv-theme__more::after { content: " ↓"; }
.rv-wall { scroll-margin-top: 100px; }
.rv-wall__grid { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.rv-wall__grid > * { min-width: 0; }
.rv-side { position: sticky; top: 130px; }
.rv-side__label { font-weight: 600; color: var(--ink); text-transform: uppercase; font-size: .78rem; letter-spacing: .07em; margin: 0 0 10px; }
.rv-side ul { list-style: none; padding: 0; margin: 0 0 20px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 8px; max-height: calc(100vh - 300px); overflow: auto; }
.rv-side button { width: 100%; text-align: left; background: none; border: 0; font: inherit; font-size: .92rem; padding: 8px 12px; border-radius: 10px; color: var(--ink); cursor: pointer; }
.rv-side button:hover { background: var(--ivory); color: var(--blue); }
.rv-side button.is-active { background: var(--blue); color: #fff; }
.rv-google { display: flex; gap: 12px; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 16px; color: var(--ink) !important; }
.rv-google i { font-size: 1.5rem; color: var(--blue); }
.rv-google span { display: flex; flex-direction: column; font-size: .86rem; color: var(--muted); }
.rv-google strong { color: var(--ink); font-size: .96rem; }
.rv-showing { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 0 0 16px; font-weight: 600; color: var(--ink); }
.rv-showing[hidden] { display: none; }
.rv-showing button { background: none; border: 0; color: var(--blue); font: inherit; font-weight: 500; text-decoration: underline; cursor: pointer; padding: 0; }
.rv-cards { columns: 2 300px; column-gap: 20px; }
.rv-card { break-inside: avoid; margin: 0 0 20px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; }
.rv-card[hidden] { display: none; }
.rv-card blockquote { margin: 10px 0 18px; color: var(--ink-soft); line-height: 1.7; font-size: .97rem; }
.rv-ask__box { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; background: linear-gradient(140deg, var(--blue), var(--blue-deep)); color: #fff; border-radius: var(--radius); padding: clamp(26px, 4vw, 44px); }
.rv-ask__box h2 { color: #fff; margin-bottom: 8px; }
.rv-ask__box p { color: rgba(255, 255, 255, .88); margin: 0; max-width: 640px; }
@media (max-width: 1199.98px) { .rv-themes__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 991.98px) {
    .rv-hero__grid, .rv-wall__grid { grid-template-columns: 1fr; }
    .rv-side { position: static; }
    .rv-side ul { display: flex; gap: 6px; overflow-x: auto; max-height: none; flex-wrap: nowrap; }
    .rv-side li { flex: none; }
    .rv-side button { white-space: nowrap; }
}
@media (max-width: 560px) { .rv-themes__grid { grid-template-columns: 1fr; } }

/* Certificates open in the photo viewer. */
.certs a, .certs-grid a { display: block; cursor: zoom-in; }
.certs figure, .certs-grid figure { transition: box-shadow .2s, border-color .2s; }
.certs figure:hover, .certs-grid figure:hover { border-color: var(--aqua); box-shadow: var(--shadow-sm); }

/* Invisible bridge over the gap between a menu item and its dropdown, so hovering across it keeps the panel open. */
.nav > li.is-open::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 12px; }

/* Contact (/contact-us): live open/closed line, four ways to reach the clinic beside the booking
   form, then the map with address, landmarks and the week's hours, and a strip for patients abroad. */
.ct-hero { background: var(--ivory); border-bottom: 1px solid var(--line); padding: 30px 0 60px; }
.ct-hero__grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: start; }
.ct-hero h1 { font-size: clamp(2rem, 3.6vw, 3rem); margin: 14px 0 12px; }
.ct-hero__intro { color: var(--ink-soft); max-width: 620px; margin-bottom: 26px; }
.ct-status { display: inline-flex; align-items: center; gap: 10px; background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 7px 14px; font-weight: 600; font-size: .9rem; color: var(--ink); margin: 0 0 14px; }
.ct-status[hidden] { display: none; }
.ct-status__dot { width: 10px; height: 10px; border-radius: 50%; background: #c2860a; box-shadow: 0 0 0 4px rgba(194, 134, 10, .15); }
.ct-status.is-open .ct-status__dot { background: #1f9d55; box-shadow: 0 0 0 4px rgba(31, 157, 85, .15); }
.ct-ways { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ct-way { display: flex; flex-direction: column; gap: 4px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; color: var(--ink) !important; transition: border-color .2s, box-shadow .2s, transform .2s; min-width: 0; }
.ct-way:hover { border-color: var(--aqua); box-shadow: var(--shadow-sm); transform: translateY(-2px); }
.ct-way__icon { width: 46px; height: 46px; border-radius: 12px; background: var(--blue); color: #fff; display: grid; place-items: center; font-size: 1.15rem; margin-bottom: 10px; }
.ct-way--wa .ct-way__icon { background: var(--wa); font-size: 1.35rem; }
.ct-way__label { font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); }
.ct-way strong { font-family: var(--serif); font-size: 1.2rem; font-weight: 600; color: var(--ink); }
.ct-way__email { font-size: 1rem !important; overflow-wrap: anywhere; }
.ct-way__sub { font-size: .86rem; color: var(--muted); }
.ct-form { position: sticky; top: 120px; }
.ct-find h2 { margin-bottom: 24px; }
.ct-find__grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: clamp(24px, 3.5vw, 48px); align-items: stretch; }
.ct-map { border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); min-height: 520px; }
.ct-map iframe { width: 100%; height: 100%; min-height: 520px; border: 0; display: block; }
.ct-info { display: flex; flex-direction: column; gap: 26px; }
.ct-block h3 { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 600; margin: 0 0 10px; }
.ct-block address { font-style: normal; color: var(--ink); line-height: 1.65; margin-bottom: 14px; }
.ct-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.ct-landmarks { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.ct-landmarks li { display: grid; grid-template-columns: 22px 1fr; gap: 10px; color: var(--ink-soft); font-size: .95rem; line-height: 1.5; }
.ct-landmarks i { color: var(--aqua); margin-top: 4px; }
.ct-hours { width: 100%; border-collapse: collapse; font-size: .95rem; }
.ct-hours th, .ct-hours td { padding: 8px 12px; text-align: left; border-bottom: 1px solid var(--line); }
.ct-hours th { font-weight: 500; color: var(--ink); }
.ct-hours td { color: var(--muted); text-align: right; }
.ct-hours tr.is-today { background: var(--aqua-soft); }
.ct-hours tr.is-today th, .ct-hours tr.is-today td { color: var(--blue); font-weight: 600; }
.ct-hours tr.is-today th::after { content: " (today)"; font-weight: 500; }
.ct-abroad-wrap { padding-top: 0; }
.ct-abroad { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: clamp(24px, 4vw, 48px); align-items: center; background: var(--ivory); border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(18px, 2.5vw, 28px); }
.ct-abroad img { width: 100%; height: auto; border-radius: var(--radius-sm); }
.ct-abroad h2 { margin-bottom: 10px; }
.ct-abroad p { color: var(--ink-soft); max-width: 720px; }
.ct-abroad .btn-row { align-items: center; gap: 18px; }
@media (max-width: 991.98px) {
    .ct-hero__grid, .ct-find__grid, .ct-abroad { grid-template-columns: 1fr; }
    .ct-form { position: static; }
    .ct-map, .ct-map iframe { min-height: 360px; }
    .ct-abroad img { max-width: 360px; }
}
@media (max-width: 560px) {
    .ct-ways { gap: 10px; }
    .ct-way { padding: 14px; }
    .ct-way__icon { width: 38px; height: 38px; font-size: 1rem; margin-bottom: 6px; }
    .ct-way strong { font-size: .98rem; }
    .ct-way__email { font-size: .8rem !important; }
    .ct-way__sub { display: none; }
}
.ct-hours__now { display: block; margin-top: 3px; font-size: .82rem; font-weight: 600; color: #a06c00; }
.ct-hours__now::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: currentColor; margin-right: 6px; vertical-align: 1px; }
.ct-hours__now.is-open { color: #1f8a4c; }

/* FAQ (/faq): search-first hero with shortcuts to the questions asked most, topics on the left
   (General, then the treatment groups), questions grouped by treatment, WhatsApp for the rest. */
.fq-hero { background: linear-gradient(135deg, var(--blue) 0%, var(--blue-deep) 60%, #0f7fa6 100%); color: #fff; padding: 30px 0 52px; }
.fq-hero .crumbs, .fq-hero .crumbs a { color: rgba(255, 255, 255, .8) !important; }
.fq-hero h1 { color: #fff; font-size: clamp(2rem, 3.6vw, 3rem); margin: 14px 0 10px; }
.fq-hero__intro { color: rgba(255, 255, 255, .88); max-width: 640px; margin-bottom: 24px; }
.fq-search { position: relative; display: block; max-width: 760px; margin: 0; }
.fq-search i { position: absolute; left: 22px; top: 50%; transform: translateY(-50%); color: var(--blue); font-size: 1.05rem; }
.fq-search input { width: 100%; border: 0; border-radius: 999px; padding: 19px 24px 19px 56px; font: inherit; font-size: 1.05rem; color: var(--ink); box-shadow: 0 12px 32px rgba(0, 0, 0, .2); }
.fq-search input:focus { outline: 3px solid rgba(22, 172, 189, .55); outline-offset: 2px; }
.fq-result { min-height: 1.4em; margin: 10px 0 6px 8px; font-weight: 600; color: #fff; }
.fq-popular { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.fq-popular span { color: rgba(255, 255, 255, .8); font-size: .9rem; margin-right: 4px; }
.fq-popular a { color: #fff !important; border: 1px solid rgba(255, 255, 255, .4); border-radius: 999px; padding: 7px 14px; font-size: .9rem; }
.fq-popular a:hover { background: rgba(255, 255, 255, .14); }
.fq-grid { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.fq-grid > * { min-width: 0; }
.fq-side { position: sticky; top: 120px; max-height: calc(100vh - 140px); overflow: auto; padding-right: 6px; }
.fq-side__label { font-weight: 600; color: var(--ink); text-transform: uppercase; font-size: .78rem; letter-spacing: .07em; margin: 0 0 8px; }
.fq-side__group { font-size: .74rem; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); margin: 16px 0 4px; font-weight: 600; }
.fq-topic { display: block; padding: 6px 12px; border-left: 2px solid var(--line); color: var(--ink-soft) !important; font-size: .92rem; }
.fq-topic:hover { color: var(--blue) !important; }
.fq-topic.is-current { border-left-color: var(--blue); color: var(--blue) !important; font-weight: 600; background: var(--ivory); }
.fq-ask { display: flex; gap: 12px; align-items: center; margin-top: 22px; background: #e9faf0; border: 1px solid #c4ecd4; border-radius: var(--radius); padding: 14px 16px; color: var(--ink) !important; }
.fq-ask i { font-size: 1.6rem; color: #1fae55; }
.fq-ask span { display: flex; flex-direction: column; font-size: .86rem; color: var(--muted); }
.fq-ask strong { color: var(--ink); font-size: .95rem; }
.fq-set { scroll-margin-top: 120px; }
.fq-set + .fq-set { margin-top: 48px; }
.fq-set[hidden] { display: none; }
.fq-set__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.fq-set__head h2 { margin: 0; font-size: clamp(1.4rem, 2vw, 1.75rem); }
.fq-set__group { display: block; font-size: .76rem; text-transform: uppercase; letter-spacing: .07em; color: var(--aqua); font-weight: 600; margin-bottom: 4px; }
.fq-list { display: grid; gap: 10px; }
.fq-q { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-sm); scroll-margin-top: 120px; }
.fq-q[hidden] { display: none; }
.fq-q[open] { border-color: var(--aqua); box-shadow: var(--shadow-sm); }
.fq-q summary { list-style: none; cursor: pointer; padding: 16px 56px 16px 20px; position: relative; font-weight: 600; color: var(--ink); line-height: 1.45; }
.fq-q summary::-webkit-details-marker { display: none; }
.fq-q summary::after { content: "+"; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; border-radius: 50%; background: var(--aqua-soft); color: var(--blue); display: grid; place-items: center; font-size: 1.1rem; font-weight: 500; }
.fq-q[open] summary::after { content: "−"; background: var(--blue); color: #fff; }
.fq-q summary:hover { color: var(--blue); }
.fq-q mark { background: rgba(22, 172, 189, .22); color: inherit; padding: 0 2px; border-radius: 3px; }
.fq-a { padding: 0 20px 18px; color: var(--ink-soft); line-height: 1.75; }
.fq-none { background: var(--ivory); border-radius: var(--radius); padding: 32px; text-align: center; }
.fq-none p { color: var(--ink-soft); max-width: 560px; margin: 0 auto 18px; }
@media (max-width: 991.98px) {
    .fq-grid { grid-template-columns: 1fr; }
    .fq-side { position: static; max-height: none; overflow: visible; order: 2; }
    .fq-side nav { display: none; }
}

/* Missing (404) and removed (410) pages: send the visitor to a treatment, or to the clinic. */
.lost-hero { background: linear-gradient(135deg, var(--blue) 0%, var(--blue-deep) 60%, #0f7fa6 100%); color: #fff; padding: 56px 0 60px; }
.lost-code { font-family: var(--serif); font-weight: 600; font-size: .9rem; letter-spacing: .2em; color: rgba(255, 255, 255, .7); margin: 0 0 8px; }
.lost-hero h1 { color: #fff; font-size: clamp(2rem, 3.8vw, 3rem); margin: 0 0 12px; }
.lost-hero p:not(.lost-code) { color: rgba(255, 255, 255, .88); max-width: 640px; margin-bottom: 24px; }
.btn--ghost-light { border: 1px solid rgba(255, 255, 255, .6); color: #fff !important; background: transparent; }
.btn--ghost-light:hover { background: rgba(255, 255, 255, .12); }
.lost-was { background: var(--ivory); border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(20px, 3vw, 32px); margin-bottom: 48px; }
.lost-was__label { font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; color: var(--aqua); font-weight: 600; }
.lost-was h2 { margin: 4px 0 18px; }
.lost-was__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.lost-was__list a { display: flex; flex-direction: column; gap: 4px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 16px 18px; color: var(--ink) !important; }
.lost-was__list a:hover { border-color: var(--aqua); box-shadow: var(--shadow-sm); }
.lost-was__list strong { font-weight: 600; }
.lost-was__list span { font-size: .88rem; color: var(--muted); line-height: 1.45; }
.lost-title { margin-bottom: 22px; }
.lost-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.lost-group { border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; background: #fff; }
.lost-group h3 { font-size: 1.08rem; margin: 0 0 4px; }
.lost-group p { font-size: .86rem; color: var(--muted); margin-bottom: 10px; }
.lost-group ul { list-style: none; margin: 0; padding: 0; }
.lost-group li a { display: block; padding: 5px 0; font-size: .93rem; }
.lost-group--more { background: var(--ivory); }
@media (max-width: 1199.98px) { .lost-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .lost-grid { grid-template-columns: 1fr; } }

/* Phones: the action bar slides away while a booking form is on screen. */
.v2 .si-actionbar { transition: transform .25s; }
.v2 .si-actionbar.is-hidden { transform: translateY(110%); }

/* Clear aligner offer (partials/aligner-offer): a card under the form on the aligner and braces
   pages, a strip under the home page fold, and a line in the Patient Resources menu. */
.offer-card { display: flex; flex-direction: column; gap: 4px; margin-top: 16px; background: linear-gradient(135deg, var(--blue), var(--blue-deep)); color: #fff !important; border-radius: var(--radius); padding: 18px 22px; box-shadow: var(--shadow-sm); transition: transform .2s, box-shadow .2s; }
.offer-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.offer-card__tag { font-size: .78rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: rgba(255, 255, 255, .8); }
.offer-card strong { font-family: var(--serif); font-size: 1.25rem; font-weight: 600; }
.offer-card > span:not(.offer-card__tag):not(.offer-card__cta) { font-size: .9rem; color: rgba(255, 255, 255, .86); }
.offer-card__cta { margin-top: 6px; font-weight: 600; font-size: .92rem; }
.offer-strip { background: var(--aqua-soft); border-bottom: 1px solid #cdeef2; }
.offer-strip .wrap { display: flex; align-items: center; gap: 12px 20px; flex-wrap: wrap; padding-top: 12px; padding-bottom: 12px; }
.offer-strip__tag { background: var(--blue); color: #fff; border-radius: 999px; padding: 5px 12px; font-size: .8rem; font-weight: 600; white-space: nowrap; }
.offer-strip__text { flex: 1 1 360px; color: var(--ink); font-size: .95rem; }
.offer-strip__link { font-weight: 600; white-space: nowrap; }
.nav-offer { display: flex; align-items: center; gap: 12px; grid-column: 1 / -1; background: var(--aqua-soft); border-radius: var(--radius-sm); padding: 12px 16px; color: var(--ink) !important; font-size: .92rem; }
.nav-offer i:first-child { color: var(--blue); }
.nav-offer strong { color: var(--blue); }
.nav-offer span { flex: 1; }
.nav-offer:hover { background: #d5f1f5; }
.nav__panel--res > .nav-offer { flex-direction: row; align-items: center; padding: 12px 16px; }

/* How to find the clinic (partials/find-us): a numbered route joined by a dashed line, then the "lost?" box. */
.findus { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 0; }
.findus li { position: relative; display: grid; grid-template-columns: 34px 1fr; gap: 12px; padding-bottom: 16px; }
.findus li:not(:last-child)::after { content: ""; position: absolute; left: 16px; top: 34px; bottom: 2px; border-left: 2px dashed var(--line); }
.findus__n { width: 34px; height: 34px; border-radius: 50%; background: var(--aqua-soft); color: var(--blue); font-weight: 700; display: grid; place-items: center; font-family: var(--serif); }
.findus li:last-child .findus__n { background: var(--blue); color: #fff; }
.findus strong { display: block; color: var(--ink); font-weight: 600; margin-top: 5px; }
.findus span { color: var(--ink-soft); font-size: .94rem; }
.findus__lost { background: var(--aqua-soft); border-radius: var(--radius); padding: 14px 16px; }
.findus__lost p { margin: 0 0 10px; color: var(--ink); font-weight: 500; }
.findus__lost p i { color: var(--blue); margin-right: 6px; }
.findus__btns { display: flex; flex-wrap: wrap; gap: 8px; }
.ct-airport { margin: 12px 0 0; color: var(--ink-soft); font-size: .92rem; }
.ct-airport i { color: var(--blue); margin-right: 6px; }
.visit__route { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; font-weight: 600; color: var(--blue); text-decoration: none; }
.ty-findus { text-align: left; max-width: 620px; margin: 28px auto; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; }
.ty-findus h2 { font-size: 1.25rem; margin: 0 0 14px; }