/*
Theme Name: VPOMS Redesign
Theme URI: https://vpoms.com/
Author: Village Pointe Oral Surgery
Description: WordPress port of the approved VPOMS homepage redesign mockup. Mobile-first design with the mockup's teal/rust system, sticky slim header, slide-in mobile menu, sticky mobile action bar, and practice schema baked in.
Version: 1.0.27
License: GPL-2.0-or-later
Text Domain: vpoms-redesign
*/
    :root {
      color-scheme: light dark;
      --ink: #132b35;
      --muted: #51636b;
      --paper: #f6ede1;
      --surface: #ffffff;
      --soft: #eee0cb;
      --line: #d8c7ae;
      --teal: #176e70;
      --teal-deep: #0e5358;
      --rust: #b85a3f;
      --rust-soft: #f2ddcf;
      --action-bg: #b85a3f;
      --action-hover: #97452f;
      --action-ink: #ffffff;
      --registration-bg: #b85a3f;
      --registration-hover: #97452f;
      --registration-ink: #ffffff;
      --instructions-bg: #e1a638;
      --instructions-hover: #c38b24;
      --instructions-ink: #102f3a;
      --cherry-red: #d92f4f;
      --cherry-red-hover: #b8213e;
      --cherry-ink: #ffffff;
      --referral-bg: #d9eef1;
      --referral-panel: #fffaf1;
      --navy: #102f3a;
      --gold: #e1a638;
      --diagram-bg: #f9f2e6;
      --diagram-bone: #edd8b6;
      --diagram-bone-edge: #b9834d;
      --diagram-gum: #e8a3a2;
      --diagram-graft: #dc7355;
      --diagram-sinus: #d7edf0;
      --shadow: 0 18px 55px rgba(12, 46, 54, .13);
    }
    @media (prefers-color-scheme: dark) {
      :root {
        --ink: #f7efe4;
        --muted: #d8c9b4;
        --paper: #4a3a2c;
        --surface: #574539;
        --soft: #63503c;
        --line: #7d6a54;
        --teal: #6bc5c0;
        --teal-deep: #91d7d1;
        --rust: #e78a6e;
        --rust-soft: #3b2926;
        --action-bg: #e78a6e;
        --action-hover: #f3a48e;
        --action-ink: #071319;
        --registration-bg: #e08a70;
        --registration-hover: #f0a089;
        --registration-ink: #10262d;
        --instructions-bg: #f2be53;
        --instructions-hover: #ffd172;
        --instructions-ink: #071319;
        --cherry-red: #ee4964;
        --cherry-red-hover: #ff6179;
        --cherry-ink: #16070b;
        --referral-bg: #3d2f22;
        --referral-panel: #2e2318;
        --navy: #071319;
        --gold: #f2be53;
        --diagram-bg: #2e251b;
        --diagram-bone: #725c41;
        --diagram-bone-edge: #dfb275;
        --diagram-gum: #9f5f64;
        --diagram-graft: #ef9478;
        --diagram-sinus: #214a54;
        --shadow: 0 22px 60px rgba(0, 0, 0, .34);
      }
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; background: var(--paper); }
    body {
      margin: 0;
      font-family: "Manrope", sans-serif;
      color: var(--ink);
      background: var(--paper);
      line-height: 1.55;
      -webkit-font-smoothing: antialiased;
    }
    img { display: block; width: 100%; }
    a { color: inherit; }
    button { font: inherit; }
    .wrap { width: min(1160px, calc(100% - 40px)); margin: 0 auto; }
    /* Menu separators (2026-10-14): the CTA button color — full-strength
       var(--action-bg) on the teal header bar (bottom border + item divider
       ticks); the same color at 45% on the pale dropdown / mobile-panel
       hairlines that previously used var(--line). */
    .site-nav {
      position: sticky; top: 0; z-index: 30;
      background: #087a91;
      border-bottom: 1px solid var(--action-bg);
      box-shadow: 0 10px 30px rgba(8, 35, 42, .14);
    }
    .nav-inner { width: min(1400px, calc(100% - 32px)); min-height: 86px; display: flex; align-items: center; justify-content: space-between; gap: 16px; transition: min-height .25s ease; }
    body.nav-scrolled .nav-inner { min-height: 66px; }
    [id] { scroll-margin-top: 96px; }
    .nav-call { display: none; }
    .nav-links { display: flex; align-items: center; gap: 12px; }
    .nav-links a { color: #fff; text-decoration: none; font-size: .82rem; font-weight: 700; }
    .nav-links > a { white-space: nowrap; }
    .nav-links a:hover { color: #d7f4f3; }
    .nav-links .button { display: none; }
    .social-links { display: flex; align-items: center; gap: 8px; }
    .social-link { width: 38px; height: 38px; display: grid; place-items: center; color: #fff; border: 1px solid rgba(255,255,255,.64); border-radius: 50%; text-decoration: none; }
    .social-link:hover, .social-link:focus-visible { color: #087a91; background: #fff; }
    .social-link svg { width: 18px; height: 18px; }
    .social-link.pending { opacity: .55; cursor: default; }
    .nav-item { position: relative; }
    .nav-link-row { display: flex; align-items: center; cursor: pointer; }
    .nav-link-row > a { white-space: nowrap; }
    .submenu-toggle {
      display: grid; place-items: center; width: 28px; height: 38px; padding: 0; border: 0;
      background: transparent; color: #fff; cursor: pointer;
    }
    .submenu-toggle svg { transition: transform .18s ease; }
    .submenu {
      position: absolute; top: calc(100% + 10px); left: -16px; min-width: 250px; padding: 8px;
      background: var(--surface); border: 1px solid color-mix(in srgb, var(--action-bg) 45%, transparent); box-shadow: var(--shadow);
      opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-5px);
      transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
    }
    .submenu::before { content: ""; position: absolute; left: 0; right: 0; top: -11px; height: 11px; }
    .submenu a { display: block; padding: 10px 12px; color: var(--ink); line-height: 1.25; }
    .submenu a:hover, .submenu a:focus-visible { color: var(--teal); background: var(--soft); }
    .submenu a[aria-current="page"] { color: var(--teal); background: var(--soft); }
    .post-operative-menu { margin: 5px 4px; }
    .post-operative-menu summary { list-style: none; }
    .post-operative-menu summary::-webkit-details-marker { display: none; }
    .post-operative-menu .post-operative-link {
      display: flex; align-items: center; justify-content: space-between; gap: 12px;
      min-height: 43px; padding: 10px 12px; border-radius: 6px; cursor: pointer;
      background: var(--instructions-bg); color: var(--instructions-ink); font-size: .91rem; font-weight: 700; line-height: 1.25;
      box-shadow: 0 5px 15px rgba(78, 58, 16, .18);
    }
    .post-operative-menu .post-operative-link:hover,
    .post-operative-menu .post-operative-link:focus-visible { background: var(--instructions-hover); }
    .post-operative-menu .post-operative-link svg { flex: 0 0 auto; transition: transform .18s ease; }
    .post-operative-menu[open] .post-operative-link svg { transform: rotate(180deg); }
    .post-operative-items { padding: 5px 4px 2px 12px; background: var(--soft); }
    .post-operative-items a { padding: 9px 10px; font-size: .84rem; }
    .submenu a.patient-registration-link,
    .submenu a.patient-registration-link:visited {
      margin: 5px 4px; padding: 11px 12px; border-radius: 6px;
      background: var(--registration-bg); color: var(--registration-ink);
      box-shadow: 0 5px 15px rgba(113, 48, 30, .2);
    }
    .submenu a.patient-registration-link:hover,
    .submenu a.patient-registration-link:focus-visible,
    .submenu a.patient-registration-link[aria-current="page"] {
      background: var(--registration-hover); color: var(--registration-ink);
    }
    .submenu a.post-operative-link,
    .submenu a.post-operative-link:visited {
      margin: 5px 4px; padding: 11px 12px; border-radius: 6px;
      background: var(--instructions-bg); color: var(--instructions-ink);
      box-shadow: 0 5px 15px rgba(78, 58, 16, .18);
    }
    .submenu a.post-operative-link:hover,
    .submenu a.post-operative-link:focus-visible,
    .submenu a.post-operative-link[aria-current="page"] {
      background: var(--instructions-hover); color: var(--instructions-ink);
    }
    .submenu .submenu-overview { margin-bottom: 4px; padding-bottom: 12px; border-bottom: 1px solid color-mix(in srgb, var(--action-bg) 45%, transparent); }
    @media (min-width: 1361px) {
      .nav-links > :not(:first-child):not(.button) { position: relative; }
      .nav-links > :not(:first-child):not(.button)::before {
        content: ""; position: absolute; left: -7px; top: 50%; width: 2px; height: 20px;
        background: var(--action-bg); transform: translateY(-50%); pointer-events: none;
      }
      .nav-item:not(.submenu-dismissed):hover .submenu, .nav-item:not(.submenu-dismissed):focus-within .submenu, .nav-item.submenu-open .submenu {
        opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0);
      }
      .nav-item:not(.submenu-dismissed):hover .submenu-toggle svg, .nav-item:not(.submenu-dismissed):focus-within .submenu-toggle svg, .nav-item.submenu-open .submenu-toggle svg { transform: rotate(180deg); }
    }
    .brand-mark { display: inline-flex; align-items: center; flex: 0 0 auto; padding: 4px 7px; background: transparent; overflow: hidden; }
    .brand-mark img { width: 325px; height: auto; object-fit: contain; transition: width .25s ease; }
    body.nav-scrolled .brand-mark img { width: 240px; }
    .footer-brand { display: inline-block; width: min(100%, 320px); margin: 0 0 18px; padding: 8px 10px; background: transparent; }
    .footer-brand img { width: 100%; height: auto; }
    .button {
      display: inline-flex; align-items: center; justify-content: center; gap: 9px;
      min-height: 46px; padding: 0 20px; border: 1px solid var(--teal);
      background: var(--teal); color: #fff; text-decoration: none; font-weight: 700;
      border-radius: 8px; transition: background .2s ease, color .2s ease, transform .2s ease;
    }
    .button:hover { background: var(--teal-deep); transform: translateY(-1px); }
    .button.secondary { background: transparent; color: var(--ink); border-color: var(--line); }
    .button.secondary:hover { color: var(--teal); border-color: var(--teal); }
    .button:not(.secondary):not(.cherry-cta), .button.action-cta {
      background: var(--action-bg); border-color: var(--action-bg); color: var(--action-ink);
      box-shadow: 0 8px 20px rgba(109, 46, 29, .18);
    }
    .button:not(.secondary):not(.cherry-cta):hover,
    .button:not(.secondary):not(.cherry-cta):focus-visible,
    .button.action-cta:hover, .button.action-cta:focus-visible {
      background: var(--action-hover); border-color: var(--action-hover); color: var(--action-ink);
    }
    .menu-button { display: none; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.72); color: #fff; background: transparent; border-radius: 8px; }
    body.menu-open { position: fixed; left: 0; right: 0; width: 100%; overflow: hidden; }
    .hero { padding: 58px 0 42px; overflow: hidden; }
    .hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 64px; align-items: center; }
    .eyebrow { margin: 0 0 15px; color: var(--teal); font-size: .86rem; font-weight: 800; letter-spacing: .045em; }
    h1, h2, h3 { margin-top: 0; }
    h1, h2 { font-family: "Newsreader", serif; letter-spacing: -.025em; line-height: 1.02; }
    h1 { font-size: clamp(3.1rem, 6.5vw, 5.8rem); max-width: 760px; margin-bottom: 24px; font-weight: 500; }
    h1 em { color: var(--rust); font-style: normal; }
    .lead { font-size: 1.12rem; color: var(--muted); max-width: 620px; margin: 0 0 28px; }
    .hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
    .hero-inline-mobile { display: none; }
    .hero-awards-mobile { display: none; }
    .hero-photo { position: relative; padding: 14px 0 0 14px; }
    .hero-photo::before { content: ""; position: absolute; inset: 0 34px 34px 0; background: var(--soft); border-radius: 90px 10px 10px 10px; }
    .hero-photo img { position: relative; height: 565px; object-fit: cover; object-position: center top; border-radius: 90px 10px 10px 10px; box-shadow: var(--shadow); }
    .photo-note { position: absolute; z-index: 2; left: -20px; bottom: 34px; background: var(--surface); padding: 14px 18px; border-left: 4px solid var(--rust); box-shadow: var(--shadow); max-width: 210px; }
    .photo-note strong { display: block; font-size: .95rem; }
    .photo-note span { font-size: .78rem; color: var(--muted); }
    .award-strip { padding: 20px 0; background: var(--navy); color: #eef8f7; }
    .award-strip-inner { display: flex; align-items: center; justify-content: space-between; gap: 28px; }
    .award-copy { min-width: 0; }
    .award-copy strong { display: block; font-family: "Newsreader", serif; font-size: clamp(1.55rem, 2.8vw, 2.35rem); font-weight: 500; line-height: 1.08; }
    .award-visuals { display: flex; align-items: center; justify-content: flex-end; gap: 18px; flex: 0 0 auto; }
    .award-badges { display: flex; align-items: center; justify-content: flex-end; gap: 12px; flex: 0 0 auto; }
    .award-badge {
      width: 78px; height: 88px; margin: 0; display: grid; place-items: center;
    }
    .award-badge.is-history { width: 310px; height: 76px; }
    .award-badge img { width: 100%; height: 100%; object-fit: contain; }
    .award-badge-fallback { color: #eef8f7; text-align: center; font-size: .68rem; font-weight: 800; line-height: 1.2; }
    .trust-bar { border-block: 1px solid var(--line); background: var(--paper); }
    .trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
    .trust-item { padding: 24px 26px; border-right: 1px solid var(--line); }
    .trust-item:last-child { border-right: 0; }
    .trust-item strong { display: block; font-family: "Newsreader", serif; font-size: 1.52rem; line-height: 1.1; }
    .trust-item span { color: var(--muted); font-size: .82rem; }
    section { padding: 88px 0; }
    .section-head { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 34px; }
    .section-head h2, .doctor-copy h2, .reviews-intro h2, .visit-copy h2 { font-size: clamp(2.3rem, 4vw, 4rem); margin-bottom: 0; font-weight: 500; }
    .section-head p { max-width: 510px; color: var(--muted); margin: 0; }
    .services-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; }
    .service {
      position: relative; min-height: 240px; padding: 26px; background: var(--surface); border: 1px solid var(--line);
      color: var(--ink); text-decoration: none; overflow: hidden; transition: border-color .2s ease, transform .2s ease;
    }
    .service:hover { border-color: var(--teal); transform: translateY(-2px); }
    .service.primary { grid-column: span 6; background: var(--navy); color: #f5fbfb; min-height: 300px; }
    .service:not(.primary) { grid-column: span 3; }
    .service.wide { grid-column: span 6; min-height: 210px; }
    .service .index { color: var(--rust); font-size: .79rem; font-weight: 800; }
    .service.primary .index { color: #ef9c82; }
    .service h3 { font-family: "Newsreader", serif; font-size: 1.65rem; margin: 52px 0 12px; }
    .service.primary h3 { font-size: 2.4rem; margin-top: 74px; }
    .service p { margin: 0; color: var(--muted); font-size: .91rem; max-width: 360px; }
    .service.primary p { color: #bdd0d3; }
    .service .arrow { position: absolute; top: 24px; right: 24px; width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; }
    .patient-info { padding-top: 12px; }
    .patient-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
    .patient-card { min-height: 175px; padding: 24px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--surface); text-decoration: none; }
    .patient-card:hover { background: var(--soft); }
    .patient-card span { color: var(--rust); font-size: .78rem; font-weight: 800; }
    .patient-card h3 { font-family: "Newsreader", serif; font-size: 1.45rem; margin: 30px 0 8px; }
    .patient-card p { margin: 0; color: var(--muted); font-size: .88rem; }
    .financing-home { padding: 0 0 88px; }
    .financing-panel { display: grid; grid-template-columns: .88fr 1.12fr; background: var(--navy); color: #eef8f7; }
    .financing-intro { padding: 46px; }
    .financing-intro .eyebrow { color: #7fd0ca; }
    .financing-intro h2 { margin-bottom: 12px; font-size: clamp(2.3rem, 4vw, 3.8rem); font-weight: 500; }
    .financing-tagline { margin: 0 0 24px; color: #fff; font-size: 1.08rem; font-weight: 800; }
    .financing-benefits { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; margin: 0 0 28px; padding: 0; list-style: none; }
    .financing-benefits li { position: relative; padding-left: 24px; color: #c4d7d8; font-size: .88rem; }
    .financing-benefits li::before { content: "✓"; position: absolute; left: 0; top: 0; color: #7fd0ca; font-weight: 800; }
    .financing-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
    .financing-intro .button { background: #eef8f7; border-color: #eef8f7; color: #12313a; }
    .financing-intro .button:hover { background: #fff; }
    .button.cherry-cta, .financing-intro .button.cherry-cta {
      min-height: 60px; padding: 0 30px; border-color: var(--cherry-red); background: var(--cherry-red);
      color: var(--cherry-ink); font-size: 1.08rem; font-weight: 800; box-shadow: 0 12px 28px rgba(123, 18, 43, .28);
    }
    .button.cherry-cta:hover, .button.cherry-cta:focus-visible,
    .financing-intro .button.cherry-cta:hover, .financing-intro .button.cherry-cta:focus-visible {
      border-color: var(--cherry-red-hover); background: var(--cherry-red-hover); color: var(--cherry-ink);
    }
    body.financing-page .detail-copy h1 { color: var(--cherry-red); }
    body.financing-page .detail-actions { align-items: center; }
    .financing-carecredit { flex-basis: 100%; margin: 4px 0 0; color: #bdd0d3; font-size: .78rem; }
    .financing-carecredit a { color: inherit; text-decoration-color: rgba(189, 208, 211, .58); text-underline-offset: 3px; }
    .financing-carecredit a:hover, .financing-carecredit a:focus-visible { color: #fff; text-decoration-color: currentColor; }
    .payment-estimator { padding: 40px 38px 32px; background: #173f49; border-left: 1px solid #365963; }
    .payment-estimator .eyebrow { color: #ef9c82; }
    .payment-estimator h3 { margin-bottom: 22px; font-family: "Newsreader", serif; font-size: clamp(1.85rem, 3vw, 2.55rem); font-weight: 500; }
    .payment-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
    .payment-table th, .payment-table td { padding: 13px 10px; border-bottom: 1px solid #365963; text-align: right; }
    .payment-table th:first-child, .payment-table td:first-child { padding-left: 0; text-align: left; }
    .payment-table th:last-child, .payment-table td:last-child { padding-right: 0; }
    .payment-table th { color: #a9c3c6; font-size: .72rem; letter-spacing: .035em; }
    .payment-table td { color: #eef8f7; font-size: .88rem; font-weight: 700; }
    .payment-disclaimer { margin: 18px 0 0; color: #a9c3c6; font-size: .72rem; line-height: 1.55; }
    .doctor { background: var(--soft); }
    .doctor-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 72px; align-items: center; }
    .doctor-portrait { position: relative; max-width: 430px; }
    .doctor-portrait img { aspect-ratio: 8/9; object-fit: cover; object-position: center top; border-radius: 8px 68px 8px 8px; box-shadow: var(--shadow); }
    .doctor-portrait::after { content: "Specialist surgical care"; position: absolute; right: -22px; bottom: 24px; padding: 12px 16px; background: var(--surface); color: var(--ink); border: 1px solid var(--line); box-shadow: var(--shadow); font-size: .78rem; font-weight: 800; }
    .doctor-copy p { color: var(--muted); max-width: 620px; }
    .credentials { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 28px 0; }
    .credential { padding-top: 14px; border-top: 2px solid var(--line); }
    .credential strong { display: block; font-size: .95rem; }
    .credential span { color: var(--muted); font-size: .82rem; }
    .staff { background: var(--paper); }
    .staff-layout { display: grid; grid-template-columns: .78fr 1.22fr; gap: 64px; align-items: center; }
    .staff-photo { position: relative; }
    .staff-photo img { height: auto; aspect-ratio: 800 / 524; object-fit: contain; object-position: center; background: var(--soft); border-radius: 68px 8px 8px 8px; box-shadow: var(--shadow); }
    .staff-copy h2 { font-size: clamp(2.3rem, 4vw, 4rem); font-weight: 500; margin-bottom: 18px; }
    .staff-copy p { color: var(--muted); max-width: 620px; }
    .reviews { background: var(--navy); color: #eef8f7; }
    .reviews-layout { display: grid; grid-template-columns: .72fr 1.28fr; gap: 68px; align-items: start; }
    .reviews-intro p { color: #b8ced0; }
    .score-line { display: flex; align-items: end; gap: 16px; margin: 30px 0 12px; }
    .score { font-family: "Newsreader", serif; font-size: 4.8rem; line-height: .78; }
    .stars { color: var(--gold); letter-spacing: 4px; font-size: 1.12rem; }
    .review-count { font-size: .8rem; color: #b8ced0; }
    .review-count-link {
      color: inherit; text-decoration: underline; text-decoration-thickness: 1px;
      text-decoration-color: color-mix(in srgb, currentColor 48%, transparent); text-underline-offset: .2em;
    }
    .review-count-link:hover, .review-count-link:focus-visible { color: var(--teal); text-decoration-color: currentColor; }
    .review-score-link { color: inherit; text-decoration: none; }
    .review-score-link .score, .review-score-link .review-count { text-decoration: underline; text-decoration-thickness: 1px; text-decoration-color: rgba(238, 248, 247, .48); text-underline-offset: .2em; }
    .review-score-link:hover .score, .review-score-link:hover .review-count,
    .review-score-link:focus-visible .score, .review-score-link:focus-visible .review-count { color: #fff; text-decoration-color: #fff; }
    .review-score-link:focus-visible { outline: 2px solid #fff; outline-offset: 6px; }
    .review-board { min-width: 0; }
    .review-carousel { position: relative; overflow: hidden; }
    .review-track { display: flex; transition: transform .35s ease; }
    .review-summary { flex: 0 0 100%; background: #173f49; padding: 32px; min-height: 246px; border-top: 3px solid #5db9b4; }
    .review-summary:nth-child(2) { border-top-color: #e08a6f; }
    .review-summary:nth-child(3) { border-top-color: #e1a638; }
    .review-summary.integration { background: #eef7f5; color: #17313a; border-top: 0; min-height: auto; margin-top: 16px; }
    .carousel-controls { display: flex; align-items: center; gap: 12px; margin-top: 16px; }
    .carousel-button { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #61828a; border-radius: 50%; background: transparent; color: #eef8f7; cursor: pointer; }
    .carousel-button:hover, .carousel-button:focus-visible { background: #eef8f7; color: #17313a; }
    .carousel-status { margin-left: 4px; color: #b8ced0; font-size: .82rem; font-variant-numeric: tabular-nums; }
    .review-summary h3 { font-family: "Newsreader", serif; font-size: 1.45rem; margin-bottom: 10px; }
    .review-summary p { margin: 0; color: #c4d7d8; font-size: .9rem; }
    .review-summary.integration p { color: #4f666b; }
    .review-meta { display: inline-flex; align-items: center; gap: 7px; margin-top: 20px; font-size: .76rem; color: #b8ced0; }
    .pulse { width: 8px; height: 8px; border-radius: 50%; background: #7ad1a4; box-shadow: 0 0 0 4px rgba(122, 209, 164, .15); }
    details { margin-top: 20px; border-top: 1px solid #c7dad6; padding-top: 15px; }
    summary { cursor: pointer; font-weight: 800; color: var(--teal-deep); }
    details p { margin-top: 12px !important; }
    .reviews a { color: inherit; }
    .practice-journal { background: var(--paper); }
    .journal-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; }
    .journal-card {
      grid-column: span 3; display: flex; min-width: 0; flex-direction: column; overflow: hidden;
      border: 1px solid var(--line); background: var(--surface); color: var(--ink); text-decoration: none;
      transition: border-color .2s ease, transform .2s ease;
    }
    .journal-card:first-child { grid-column: span 6; }
    .journal-card:hover, .journal-card:focus-visible { border-color: var(--teal); transform: translateY(-2px); }
    .journal-card:focus-visible { outline: 3px solid color-mix(in srgb, var(--teal) 32%, transparent); outline-offset: 3px; }
    .journal-image { position: relative; overflow: hidden; background: var(--soft); }
    .journal-image img { height: 210px; object-fit: cover; transition: transform .35s ease; }
    .journal-card:first-child .journal-image img { height: 290px; }
    .journal-card:hover .journal-image img { transform: scale(1.025); }
    .journal-category {
      position: absolute; left: 14px; bottom: 14px; padding: 7px 10px;
      background: var(--navy); color: #eef8f7; font-size: .72rem; font-weight: 800;
    }
    .journal-copy { display: flex; flex: 1; flex-direction: column; padding: 24px; }
    .journal-copy h3 { margin: 0 0 10px; font-family: "Newsreader", serif; font-size: clamp(1.45rem, 2.3vw, 2rem); line-height: 1.1; }
    .journal-copy p { margin: 0 0 22px; color: var(--muted); font-size: .88rem; }
    .journal-link { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; color: var(--teal-deep); font-size: .8rem; font-weight: 800; }
    .journal-link::after { content: "→"; color: var(--rust); font-size: 1rem; }
    .social-feed { padding-top: 0; background: var(--paper); }
    .social-feed-layout { display: grid; grid-template-columns: .92fr 1.08fr; min-height: 450px; }
    .social-profile {
      display: flex; flex-direction: column; justify-content: space-between; gap: 34px;
      padding: clamp(32px, 5vw, 54px); background: var(--navy); color: #eef8f7;
    }
    .social-profile .eyebrow { color: #7fd0ca; }
    .social-profile h2 { max-width: 650px; margin-bottom: 16px; font-size: clamp(2.3rem, 4vw, 4rem); font-weight: 500; }
    .social-profile p { max-width: 560px; margin: 0; color: #bdd0d3; }
    .social-handle { display: block; margin-top: 18px; color: #fff; font-size: .9rem; font-weight: 800; overflow-wrap: anywhere; }
    .social-profile-actions { display: flex; flex-wrap: wrap; gap: 10px; }
    .social-profile-actions .button { background: #eef8f7; border-color: #eef8f7; color: #17313a; box-shadow: none; }
    .social-profile-actions .button:hover, .social-profile-actions .button:focus-visible { background: #fff; border-color: #fff; color: #17313a; }
    .social-profile-actions .button.secondary { background: transparent; border-color: #61828a; color: #eef8f7; }
    .social-profile-actions .button.secondary:hover, .social-profile-actions .button.secondary:focus-visible { background: #eef8f7; border-color: #eef8f7; color: #17313a; }
    .social-profile-actions svg { width: 18px; height: 18px; flex: 0 0 auto; }
    .facebook-feed { padding: clamp(32px, 5vw, 54px); background: var(--surface); border: 1px solid var(--line); }
    .facebook-feed-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 22px; }
    .facebook-feed-head h3 { margin: 0; font-family: "Newsreader", serif; font-size: clamp(1.8rem, 3vw, 2.55rem); font-weight: 500; }
    .facebook-feed-head span { color: var(--muted); font-size: .76rem; }
    .social-update-list { border-top: 1px solid var(--line); }
    .social-update { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 22px 0; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
    .social-update time { color: var(--rust); font-size: .75rem; font-weight: 800; line-height: 1.3; }
    .social-update strong { display: block; font-family: "Newsreader", serif; font-size: 1.25rem; line-height: 1.15; }
    .social-update span { color: var(--teal-deep); font-size: 1.05rem; font-weight: 800; }
    .social-update:hover strong, .social-update:focus-visible strong { color: var(--teal); }
    .social-update:focus-visible { outline: 2px solid var(--teal); outline-offset: 5px; }
    .facebook-follow { margin-top: 24px; }
    .experience-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 18px; }
    .experience-grid img { object-fit: cover; height: 520px; border-radius: 8px; }
    .experience-stack { display: grid; gap: 18px; }
    .experience-stack img { height: 251px; }
    .experience-caption { margin-top: 18px; display: flex; justify-content: space-between; gap: 28px; color: var(--muted); }
    .experience-caption strong { color: var(--ink); }
    .faq { background: var(--paper); border-block: 1px solid var(--line); }
    .faq-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 72px; align-items: start; }
    .faq-intro h2 { font-size: clamp(2.3rem, 4vw, 4rem); font-weight: 500; margin-bottom: 16px; }
    .faq-intro p { color: var(--muted); margin: 0; }
    .faq-list { border-top: 1px solid var(--line); }
    .faq-item { margin: 0; padding: 0; border-top: 0; border-bottom: 1px solid var(--line); }
    .faq-item summary { list-style: none; display: flex; justify-content: space-between; gap: 20px; padding: 20px 0; color: var(--ink); font-size: 1rem; }
    .faq-item summary::-webkit-details-marker { display: none; }
    .faq-item summary::after { content: "+"; color: var(--teal); font-size: 1.3rem; line-height: 1; }
    .faq-item[open] summary::after { content: "−"; }
    .faq-item p { margin: -4px 42px 20px 0 !important; color: var(--muted); }
    .visit { padding-top: 88px; }
    .visit-card { display: grid; grid-template-columns: 1fr .8fr; min-height: 360px; background: var(--rust-soft); }
    .visit-copy { padding: 54px; }
    .visit-copy p { color: var(--muted); max-width: 560px; }
    .contact-details { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 28px; padding-top: 22px; border-top: 1px solid color-mix(in srgb, var(--rust) 25%, var(--line)); }
    .contact-details strong { display: block; margin-bottom: 5px; }
    .contact-details span, .contact-details a { color: var(--muted); font-size: .9rem; text-decoration: none; }
    .contact-details a:hover { color: var(--teal); }
    .visit-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; }
    .visit-image img { height: 100%; min-height: 360px; object-fit: cover; }
    footer { background: var(--navy); color: #eff8f7; padding: 48px 0 96px; }
    .footer-grid { display: grid; grid-template-columns: 1.35fr .8fr .8fr .9fr; gap: 44px; }
    .footer-grid h3 { font-family: "Newsreader", serif; font-size: 1.42rem; }
    .footer-grid p, .footer-grid a { color: #bdd0d2; font-size: .88rem; }
    .footer-grid a { display: block; margin: 8px 0; text-decoration: none; }
    .footer-grid a:hover { color: #fff; }
    .footer-awards { margin-top: 20px; }
    .footer-awards > strong { display: block; max-width: 300px; color: #fff; font-size: .82rem; line-height: 1.4; }
    .footer-awards .award-visuals { margin-top: 11px; justify-content: flex-start; }
    .footer-awards .award-badges { justify-content: flex-start; gap: 7px; }
    .footer-awards .award-badge { width: 42px; height: 47px; }
    .footer-awards .award-badge.is-history { width: 154px; height: 34px; }
    .footer-awards .award-badge-fallback { font-size: .52rem; }
    footer .social-links { margin-top: 18px; }
    footer .social-link.pending { border-color: #61828a; }
    .doctor-awards { margin: 0 0 44px; padding: 26px 28px; display: flex; align-items: center; justify-content: space-between; gap: 28px; background: var(--soft); }
    .doctor-awards h2 { margin: 0 0 6px; font-size: clamp(1.75rem, 3vw, 2.45rem); font-weight: 500; }
    .doctor-awards p { margin: 0; color: var(--muted); }
    .doctor-awards .award-visuals { gap: 14px; }
    .doctor-awards .award-badge { width: 52px; height: 58px; }
    .doctor-awards .award-badge.is-history { width: 198px; height: 44px; }
    .doctor-awards .award-badge-fallback { color: var(--ink); }
    .mobile-actions { display: none; }
    [hidden] { display: none !important; }
    .page-view { min-width: 0; }
    .back-link { display: inline-flex; margin-bottom: 26px; color: var(--teal); font-weight: 800; text-decoration: none; }
    .back-link:hover { text-decoration: underline; }
    .detail-page { padding: 44px 0 72px; }
    .detail-hero { display: grid; grid-template-columns: 1.08fr .92fr; gap: 58px; align-items: center; padding-bottom: 32px; border-bottom: 1px solid var(--line); }
    .detail-copy h1 { font-size: clamp(3rem, 5.8vw, 5.2rem); margin-bottom: 22px; }
    .detail-lead { color: var(--muted); font-size: 1.12rem; max-width: 650px; margin: 0; }
    .detail-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
    .self-send-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; flex-basis: 100%; margin-top: 6px; padding-top: 18px; border-top: 1px solid var(--line); }
    .self-send-label { flex-basis: 100%; color: var(--muted); font-size: .82rem; font-weight: 700; }
    .self-send-actions .button { min-height: 42px; padding-inline: 15px; font-size: .86rem; }
    .self-send-actions svg { width: 18px; height: 18px; flex: 0 0 auto; }
    .detail-media img { height: 410px; object-fit: cover; object-position: center; border-radius: 72px 8px 8px 8px; box-shadow: var(--shadow); }
    .detail-media img[src$="doctor.jpg"] { object-position: center top; }
    .detail-avatar {
      min-height: 410px; display: grid; place-items: center; padding: 36px;
      background: var(--soft); border-radius: 72px 8px 8px 8px; box-shadow: var(--shadow);
    }
    .detail-avatar span {
      width: clamp(126px, 19vw, 178px); aspect-ratio: 1; display: grid; place-items: center;
      border: 1px solid var(--line); border-radius: 50%; background: var(--surface);
      color: var(--ink); font-family: "Newsreader", serif; font-size: clamp(2.7rem, 6vw, 4.4rem); font-weight: 600;
    }
    body.staff-page .detail-hero { grid-template-columns: 1fr; min-height: 390px; align-items: center; }
    body.staff-page .detail-media, body.staff-page .detail-actions, body.staff-page .detail-cta { display: none; }
    .detail-body { padding: 28px 0 12px; }
    body.detail-open .detail-body > section { padding-top: 0; padding-bottom: 0; }
    .detail-intro { display: grid; grid-template-columns: .72fr 1.28fr; gap: 70px; margin-bottom: 34px; }
    .detail-intro h2, .detail-cta h2 { font-size: clamp(2.25rem, 4vw, 3.7rem); font-weight: 500; margin-bottom: 0; }
    .detail-intro p { margin: 0; color: var(--muted); font-size: 1rem; }
    .detail-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .detail-card { padding: 26px; min-height: 210px; border: 1px solid var(--line); background: var(--surface); }
    a.detail-card { color: inherit; text-decoration: none; }
    a.detail-card:hover { border-color: var(--teal); background: var(--soft); }
    .detail-card .number { display: block; margin-bottom: 32px; color: var(--rust); font-size: .78rem; font-weight: 800; }
    .detail-card h3 { font-family: "Newsreader", serif; font-size: 1.55rem; line-height: 1.12; margin-bottom: 10px; }
    .detail-card p, .detail-card li { color: var(--muted); font-size: .9rem; }
    .detail-card p { margin: 0; }
    .detail-card ul { margin: 10px 0 0; padding-left: 18px; }
    .detail-note { margin-top: 18px; padding: 22px 24px; background: var(--soft); color: var(--muted); }
    .detail-note strong { color: var(--ink); }
    .article-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 54px; align-items: start; }
    .article-nav { position: sticky; top: 98px; padding-top: 4px; }
    .article-nav strong { display: block; margin-bottom: 12px; font-size: .82rem; color: var(--muted); }
    .article-nav a { display: block; padding: 10px 0; border-top: 1px solid var(--line); color: var(--ink); text-decoration: none; font-size: .88rem; font-weight: 700; }
    .article-nav a:last-child { border-bottom: 1px solid var(--line); }
    .article-nav a:hover { color: var(--teal); }
    .article-content { min-width: 0; }
    .article-section { padding: 0 0 28px; margin-bottom: 28px; border-bottom: 1px solid var(--line); }
    .article-section:last-of-type { margin-bottom: 0; }
    .article-section h3 { font-family: "Newsreader", serif; font-size: clamp(1.75rem, 3vw, 2.45rem); line-height: 1.08; margin-bottom: 14px; }
    .article-section p { margin: 0 0 14px; color: var(--muted); }
    .article-section p:last-child { margin-bottom: 0; }
    .article-section ul { margin: 12px 0 0; padding-left: 20px; color: var(--muted); }
    .article-section li { margin: 7px 0; }
    .article-section a { color: var(--teal); font-weight: 700; text-underline-offset: 3px; }
    .article-section-video { width: min(100%, 760px); margin-top: 22px; }
    body.instruction-page .article-content { max-width: 860px; }
    body.instruction-page .article-section ul { padding-left: 22px; }
    body.instruction-page .article-section li + li { margin-top: 10px; }
    body.instruction-page .article-section strong { color: var(--ink); }
    body.instruction-page .detail-note { border-top: 3px solid var(--rust); }
    .doctor-name-link { color: inherit; font-weight: inherit; text-decoration-color: color-mix(in srgb, var(--teal) 55%, transparent); text-decoration-thickness: 1px; text-underline-offset: .15em; }
    .doctor-name-link:hover, .doctor-name-link:focus-visible { color: var(--teal); text-decoration-color: currentColor; }
    .related-procedures { margin-top: 34px; padding-top: 24px; border-top: 1px solid var(--line); }
    .related-procedures h2 { margin-bottom: 16px; font-family: "Newsreader", serif; font-size: clamp(1.85rem, 3vw, 2.55rem); font-weight: 500; }
    .related-links { display: flex; flex-wrap: wrap; gap: 10px; }
    .related-links a { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; padding: 9px 14px; border: 1px solid var(--line); color: var(--ink); background: var(--surface); text-decoration: none; font-weight: 700; }
    .related-links a::after { content: "→"; color: var(--rust); }
    .related-links a:hover, .related-links a:focus-visible { color: var(--teal); border-color: var(--teal); background: var(--soft); }
    .source-list { margin-top: 28px; padding: 22px 24px; background: var(--soft); }
    .source-list strong { display: block; margin-bottom: 8px; }
    .source-list a { display: block; width: fit-content; color: var(--teal); font-size: .88rem; font-weight: 700; margin-top: 6px; }
    .detail-video { margin-bottom: 32px; }
    .detail-video h2 { font-size: clamp(2.15rem, 4vw, 3.6rem); font-weight: 500; margin-bottom: 18px; }
    .illustration-feature { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 44px; align-items: center; margin: 0 0 40px; padding: 34px; background: var(--soft); }
    .illustration-feature figure { margin: 0; }
    .illustration-feature img { aspect-ratio: 616 / 252; object-fit: contain; background: #fff; border: 1px solid var(--line); }
    .illustration-feature figcaption { margin-top: 10px; color: var(--muted); font-size: .82rem; }
    .illustration-feature h2 { font-size: clamp(2.15rem, 4vw, 3.6rem); font-weight: 500; margin-bottom: 16px; }
    .illustration-feature p { margin: 0 0 14px; color: var(--muted); }
    .illustration-feature p:last-child { margin-bottom: 0; }
    .implant-benefits { margin-bottom: 40px; }
    .implant-benefits > h2, .implant-technology-story > h2, .graft-guide > h2 { font-size: clamp(2.15rem, 4vw, 3.6rem); font-weight: 500; margin-bottom: 16px; }
    .implant-benefits > p, .implant-technology-story > p, .graft-guide > p { max-width: 760px; color: var(--muted); }
    .implant-benefit-grid, .implant-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 28px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
    .implant-benefit, .implant-step { min-height: 220px; padding: 24px; background: var(--surface); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
    .implant-benefit .benefit-number, .implant-step .step-number { display: block; margin-bottom: 34px; color: var(--rust); font-size: .76rem; font-weight: 800; }
    .implant-benefit h3, .implant-step h3 { margin: 0 0 10px; font-family: "Newsreader", serif; font-size: 1.45rem; }
    .implant-benefit p, .implant-step p { margin: 0; color: var(--muted); font-size: .88rem; }
    .implant-technology-story { margin-bottom: 40px; }
    .allon4-overview {
      display: grid; grid-template-columns: 1.08fr .92fr; margin: 0 0 46px;
      background: var(--navy); color: #eef8f7;
    }
    .allon4-definition, .allon4-candidate { padding: clamp(28px, 5vw, 48px); }
    .allon4-definition { border-right: 1px solid #365963; }
    .allon4-overview .eyebrow { color: #7fd0ca; }
    .allon4-overview h2, .allon4-journey h2, .allon4-fees h2 {
      font-size: clamp(2.15rem, 4vw, 3.6rem); font-weight: 500; margin-bottom: 16px;
    }
    .allon4-overview p { margin: 0; color: #c4d7d8; }
    .allon4-overview strong { color: #fff; }
    .allon4-candidate h3 { margin: 0 0 12px; font-family: "Newsreader", serif; font-size: 1.7rem; font-weight: 500; }
    .allon4-candidate p + p { margin-top: 14px; }
    .allon4-journey { margin-bottom: 46px; }
    .allon4-journey > p { max-width: 760px; margin: 0 0 26px; color: var(--muted); }
    .allon4-steps { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
    .allon4-step { display: grid; grid-template-columns: 92px minmax(0, 1fr); border-bottom: 1px solid var(--line); }
    .allon4-step-number { padding: 27px 18px 27px 0; color: var(--rust); font-family: "Newsreader", serif; font-size: 2.25rem; line-height: 1; }
    .allon4-step-copy { padding: 24px 0 26px 28px; border-left: 1px solid var(--line); }
    .allon4-step-copy small { display: block; margin-bottom: 7px; color: var(--teal); font-size: .73rem; font-weight: 800; letter-spacing: .045em; }
    .allon4-step-copy h3 { margin: 0 0 8px; font-family: "Newsreader", serif; font-size: 1.55rem; font-weight: 500; }
    .allon4-step-copy p { max-width: 820px; margin: 0; color: var(--muted); }
    .allon4-step.is-path { background: var(--soft); }
    .allon4-fees { margin-bottom: 40px; padding: clamp(28px, 5vw, 46px); background: var(--rust-soft); }
    .allon4-fees > p { max-width: 760px; margin: 0; color: var(--muted); }
    .allon4-fee-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-top: 28px; border-top: 1px solid color-mix(in srgb, var(--rust) 28%, var(--line)); }
    .allon4-fee { padding: 24px 28px 4px 0; }
    .allon4-fee + .allon4-fee { padding-left: 28px; border-left: 1px solid color-mix(in srgb, var(--rust) 28%, var(--line)); }
    .allon4-fee span { display: block; color: var(--muted); font-size: .78rem; font-weight: 800; }
    .allon4-fee strong { display: block; margin: 6px 0 10px; font-family: "Newsreader", serif; font-size: clamp(2rem, 4vw, 3rem); font-weight: 500; line-height: 1; }
    .allon4-fee p { margin: 0; color: var(--muted); font-size: .88rem; }
    body.implant-page .detail-hero { padding-bottom: 26px; }
    body.implant-page .detail-body { padding-top: 24px; }
    body.implant-page .detail-body section { padding-top: 0; padding-bottom: 0; }
    body.implant-page .implant-benefits,
    body.implant-page .implant-technology-story,
    body.implant-page .technology-feature,
    body.implant-page .detail-video,
    body.implant-page .excellence-callout,
    body.implant-page .clinical-gallery { margin-bottom: 24px; }
    body.implant-page .implant-benefit-grid,
    body.implant-page .implant-steps { margin-top: 18px; }
    body.implant-page .article-layout { gap: 38px; }
    body.implant-page .article-section { padding-bottom: 18px; margin-bottom: 18px; }
    body.implant-page .related-procedures { margin-top: 24px; padding-top: 18px; }
    body.implant-page .detail-cta { margin-top: 26px; }
    .graft-guide { margin-bottom: 40px; }
    .graft-types { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 28px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
    .graft-type { min-height: 360px; padding: 18px; background: var(--surface); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
    .graft-diagram { width: 100%; height: auto; aspect-ratio: 220 / 150; margin-bottom: 20px; overflow: visible; }
    .graft-diagram .diagram-panel { fill: var(--diagram-bg); }
    .graft-diagram .diagram-bone { fill: var(--diagram-bone); }
    .graft-diagram .diagram-bone-edge { fill: none; stroke: var(--diagram-bone-edge); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
    .graft-diagram .diagram-gum { fill: var(--diagram-gum); stroke: color-mix(in srgb, var(--diagram-gum) 76%, var(--ink)); stroke-width: 1.8; }
    .graft-diagram .diagram-graft { fill: color-mix(in srgb, var(--diagram-graft) 30%, var(--surface)); stroke: var(--diagram-graft); stroke-width: 2; }
    .graft-diagram .diagram-cavity { fill: var(--surface); stroke: var(--diagram-bone-edge); stroke-width: 2; }
    .graft-diagram .diagram-sinus { fill: var(--diagram-sinus); stroke: var(--teal); stroke-width: 2; }
    .graft-diagram .diagram-line { fill: none; stroke: var(--teal); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
    .graft-diagram .diagram-screw { fill: var(--surface); stroke: var(--teal-deep); stroke-width: 2; }
    .graft-diagram .diagram-label { fill: var(--muted); font-family: "Manrope", sans-serif; font-size: 9px; font-weight: 800; letter-spacing: .08em; }
    .graft-diagram .diagram-dot { fill: var(--diagram-graft); }
    .graft-diagram path, .graft-diagram line, .graft-diagram circle, .graft-diagram rect { vector-effect: non-scaling-stroke; }
    .graft-type h3 { margin: 0 0 9px; font-family: "Newsreader", serif; font-size: 1.35rem; }
    .graft-type p { margin: 0; color: var(--muted); font-size: .84rem; }
    body.bone-graft-page .graft-guide { margin: 0; padding: 0 0 24px; }
    body.bone-graft-page .graft-guide + .detail-video { margin: 0 0 30px; padding: 0 0 34px; }
    .graft-detail-visual { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .78fr); gap: 38px; align-items: center; margin: 0 0 30px; padding: 26px; background: var(--soft); }
    .graft-detail-visual h2 { margin-bottom: 14px; font-size: clamp(2.15rem, 4vw, 3.35rem); font-weight: 500; }
    .graft-detail-visual p { margin: 0; color: var(--muted); }
    .graft-detail-visual figure { margin: 0; }
    .graft-detail-visual .graft-diagram { margin: 0; background: var(--surface); }
    .graft-detail-visual figcaption { margin-top: 9px; color: var(--muted); font-size: .8rem; }
    a.graft-type { display: block; color: inherit; text-decoration: none; transition: background .2s ease, border-color .2s ease; }
    a.graft-type:hover, a.graft-type:focus-visible { background: var(--soft); border-color: var(--teal); }
    a.graft-type:focus-visible { position: relative; z-index: 1; outline: 3px solid color-mix(in srgb, var(--teal) 32%, transparent); outline-offset: -3px; }
    .graft-card-link { display: inline-flex; align-items: center; gap: 7px; margin-top: 15px; color: var(--teal); font-size: .78rem; font-weight: 800; }
    .graft-card-link::after { content: "→"; color: var(--rust); }
    .video-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
    .video-grid.single { grid-template-columns: 1fr; }
    .video-frame { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--navy); border-radius: 8px 56px 8px 8px; box-shadow: var(--shadow); }
    .video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
    .video-poster-button {
      position: absolute; inset: 0; width: 100%; height: 100%; display: block; padding: 0; overflow: hidden;
      border: 0; background: var(--navy); color: #fff; cursor: pointer; text-align: left; text-decoration: none;
    }
    .video-poster-button > img { width: 100%; height: 100%; object-fit: cover; }
    .video-poster-button::after {
      content: ""; position: absolute; inset: 36% 0 0;
      background: linear-gradient(to bottom, transparent, rgba(5, 25, 31, .92)); pointer-events: none;
    }
    .video-play-mark {
      position: absolute; z-index: 2; inset: 50% auto auto 50%; width: 76px; height: 76px;
      display: grid; place-items: center; transform: translate(-50%, -50%);
      border: 2px solid rgba(255,255,255,.9); border-radius: 50%; background: rgba(7, 35, 43, .88);
      box-shadow: 0 10px 28px rgba(0,0,0,.3); transition: background .18s ease, transform .18s ease;
    }
    .video-play-mark::before {
      content: ""; width: 0; height: 0; margin-left: 5px;
      border-top: 12px solid transparent; border-bottom: 12px solid transparent; border-left: 19px solid #fff;
    }
    .video-poster-copy {
      position: absolute; z-index: 2; left: clamp(20px, 4vw, 38px); right: clamp(20px, 4vw, 38px); bottom: clamp(18px, 3vw, 30px);
      display: flex; align-items: end; justify-content: space-between; gap: 18px;
    }
    .video-poster-copy strong { max-width: 38ch; font-family: "Newsreader", serif; font-size: clamp(1.18rem, 2.5vw, 1.7rem); line-height: 1.08; }
    .video-poster-copy span { flex: 0 0 auto; font-size: .8rem; font-weight: 800; }
    .video-poster-button:hover .video-play-mark, .video-poster-button:focus-visible .video-play-mark { background: var(--rust); transform: translate(-50%, -50%) scale(1.05); }
    .video-poster-button:focus-visible { outline: 4px solid var(--gold); outline-offset: -4px; }
    @media (max-width: 560px) {
      .video-play-mark { width: 60px; height: 60px; }
      .video-play-mark::before { border-top-width: 10px; border-bottom-width: 10px; border-left-width: 16px; }
      .video-poster-copy span { display: none; }
    }
    .video-link-card {
      position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: 12px;
      padding: clamp(24px, 5vw, 52px); color: #fff; text-decoration: none;
      background: linear-gradient(145deg, rgba(15, 62, 72, .96), rgba(7, 35, 43, .98));
    }
    .video-link-card::before {
      content: ""; position: absolute; top: clamp(24px, 5vw, 52px); left: clamp(24px, 5vw, 52px);
      width: 58px; height: 58px; border: 2px solid rgba(255, 255, 255, .78); border-radius: 50%;
      background: linear-gradient(135deg, rgba(255,255,255,.12), transparent);
    }
    .video-link-card::after {
      content: ""; position: absolute; top: calc(clamp(24px, 5vw, 52px) + 19px); left: calc(clamp(24px, 5vw, 52px) + 24px);
      width: 0; height: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 16px solid #fff;
    }
    .video-link-card small { font-size: .74rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; color: rgba(255,255,255,.72); }
    .video-link-card strong { max-width: 34ch; font-family: "Newsreader", Georgia, serif; font-size: clamp(1.45rem, 3vw, 2.35rem); line-height: 1.05; font-weight: 600; }
    .video-link-card span { display: inline-flex; align-items: center; width: fit-content; padding-bottom: 3px; border-bottom: 2px solid var(--rust); font-size: .9rem; font-weight: 800; }
    .video-link-card:hover, .video-link-card:focus-visible { background: linear-gradient(145deg, rgba(17, 77, 87, .98), rgba(7, 35, 43, .98)); }
    .video-link-card:focus-visible { outline: 3px solid var(--rust); outline-offset: -5px; }
    .video-sound-toggle, .video-sound-prompt {
      position: absolute; z-index: 2; border: 0; color: #fff; cursor: pointer; font-weight: 800;
      box-shadow: 0 8px 24px rgba(7, 19, 25, .3);
    }
    .video-sound-toggle {
      right: 16px; bottom: 16px; min-height: 44px; padding: 0 16px;
      background: rgba(7, 35, 43, .9); border: 1px solid rgba(255, 255, 255, .72); border-radius: 8px;
    }
    .video-sound-toggle:hover, .video-sound-toggle:focus-visible { background: #fff; color: #12313a; }
    .video-sound-prompt {
      left: 16px; bottom: 16px; min-height: 48px; padding: 0 20px;
      background: var(--rust); border-radius: 8px;
    }
    .video-sound-prompt:hover, .video-sound-prompt:focus-visible { background: #9f4933; }
    .video-sound-toggle:focus-visible, .video-sound-prompt:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
    .detail-cta { margin-top: 40px; padding: 38px 42px; display: flex; align-items: center; justify-content: space-between; gap: 32px; background: var(--rust-soft); }
    .detail-cta p { margin: 8px 0 0; color: var(--muted); max-width: 620px; }
    .detail-cta-actions { display: flex; flex-wrap: wrap; gap: 10px; flex: 0 0 auto; }
    .team-list { grid-template-columns: 1fr; gap: 24px; }
    .team-list .detail-card { min-height: 0; }
    .team-card { display: grid; grid-template-columns: minmax(240px, 320px) minmax(0, 1fr); align-items: stretch; padding: 0; overflow: hidden; }
    .team-card-photo {
      width: 100%; height: 100%; min-height: 400px; aspect-ratio: 4 / 5; object-fit: contain;
      object-position: center; align-self: stretch; padding: 14px; background: var(--soft);
    }
    .team-card-avatar { display: grid; place-items: center; padding: 28px; }
    .team-card-avatar span {
      width: min(138px, 62%); aspect-ratio: 1; display: grid; place-items: center;
      border: 1px solid var(--line); border-radius: 50%; background: var(--surface);
      color: var(--ink); font-family: "Newsreader", serif; font-size: clamp(2.3rem, 5vw, 3.7rem); font-weight: 600;
    }
    .team-card-content { min-width: 0; padding: 30px; align-self: center; }
    .team-card-content h3 { margin-bottom: 5px; }
    .team-role { display: block; margin: -2px 0 20px; color: var(--teal); font-size: .76rem; font-weight: 800; letter-spacing: .035em; }
    .team-quote { margin: 0 0 16px !important; color: var(--ink) !important; font-family: "Newsreader", serif; font-size: 1.22rem !important; line-height: 1.25; }
    .team-about { margin-bottom: 20px !important; }
    .team-beyond { margin: 0 !important; padding-top: 16px; border-top: 1px solid var(--line); }
    .team-beyond strong { display: block; margin-bottom: 6px; color: var(--ink); font-size: .76rem; letter-spacing: .035em; }
    body.doctor-page .detail-media img { object-fit: contain; object-position: center; padding: 14px; background: var(--soft); }
    .technology-feature { display: grid; grid-template-columns: .9fr 1.1fr; gap: 42px; align-items: center; margin-bottom: 40px; }
    .technology-feature img { height: 430px; object-fit: contain; padding: 20px; background: #fff; border: 1px solid var(--line); }
    .technology-feature h2, .technology-copy h2, .clinical-gallery h2 { font-size: clamp(2.15rem, 4vw, 3.6rem); font-weight: 500; margin-bottom: 16px; }
    .technology-feature p, .technology-copy p { color: var(--muted); }
    .technology-copy { margin: 0 0 30px; max-width: 880px; }
    .excellence-callout { margin: 0 0 40px; padding: 34px; display: grid; grid-template-columns: auto 1fr; gap: 24px; align-items: center; background: var(--navy); color: #eef8f7; }
    .excellence-mark { width: 84px; height: 84px; display: grid; place-items: center; border: 2px solid var(--gold); border-radius: 50%; color: var(--gold); font-family: "Newsreader", serif; font-size: 2rem; }
    .excellence-callout h2 { margin: 0 0 8px; font-size: clamp(1.85rem, 3vw, 2.7rem); font-weight: 500; }
    .excellence-callout p { margin: 0; color: #bdd0d3; }
    .clinical-gallery { margin-bottom: 40px; }
    .clinical-gallery-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
    .clinical-gallery figure { margin: 0; }
    .clinical-gallery img { height: 360px; object-fit: cover; background: #050505; }
    .clinical-gallery figcaption { padding-top: 12px; color: var(--muted); font-size: .86rem; }
    .referring-note { padding: 26px 28px; background: var(--soft); border-top: 3px solid var(--teal); }
    .referring-note p { margin: 0; color: var(--muted); }
    .referring-note strong { color: var(--ink); }
    .referral-slip { margin-top: 50px; padding: 38px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); }
    .detail-priority .referral-slip { margin: 0 0 38px; }
    .referral-slip-top { display: flex; flex-direction: column; gap: 22px; }
    .referral-slip-head { margin-bottom: 20px; }
    .referral-slip-head h2 { margin: 0 0 9px; font-size: clamp(2.15rem, 4vw, 3.4rem); font-weight: 500; }
    .referral-slip-head p { max-width: 720px; margin: 0; color: var(--muted); }
    .referral-slip-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-start; }
    .referral-slip > .referral-slip-actions { margin-top: 18px; }
    .referral-slip-preview { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
    .referral-pdf-primary {
      position: relative; display: grid; grid-template-columns: minmax(270px, .52fr) minmax(0, 1fr); grid-template-areas: "badge copy" "action copy"; column-gap: clamp(26px, 5vw, 64px); row-gap: 12px; align-items: center;
      padding: clamp(32px, 5vw, 54px); overflow: hidden; background: var(--navy); color: #eef8f7;
      border-top: 7px solid var(--gold); box-shadow: 0 22px 50px rgba(7, 34, 42, .24);
    }
    .referral-pdf-primary::after {
      content: "FILLABLE"; position: absolute; right: -12px; bottom: -34px; color: rgba(255,255,255,.055);
      font-family: "Newsreader", serif; font-size: clamp(5.5rem, 12vw, 9rem); font-weight: 600; line-height: 1; pointer-events: none;
    }
    .referral-primary-copy, .referral-primary-action, .referral-primary-badge { position: relative; z-index: 1; }
    .referral-primary-copy { grid-area: copy; }
    .referral-primary-action { grid-area: action; }
    .referral-primary-badge { grid-area: badge; justify-self: start; align-self: end; }
    .referral-pdf-primary .eyebrow { display: inline-flex; margin: 0; padding: 7px 10px; background: var(--gold); color: #102f3a; }
    .referral-pdf-primary h2 { max-width: 720px; margin: 0 0 14px; color: #fff; font-size: clamp(2.35rem, 4.8vw, 4.15rem); font-weight: 500; }
    .referral-pdf-primary p { max-width: 680px; margin: 0; color: #d0e0e2; }
    .referral-primary-action { display: grid; gap: 11px; padding: 22px; background: rgba(255,255,255,.09); border: 1px solid rgba(255,255,255,.24); }
    .referral-primary-action strong { color: #fff; font-family: "Newsreader", serif; font-size: 1.35rem; font-weight: 500; }
    .referral-primary-action .button { width: 100%; min-height: 58px; padding-inline: 24px; font-size: 1rem; }
    .referral-primary-action .button.secondary { min-height: 48px; }
    .referral-primary-action small { color: #bdd0d3; font-size: .76rem; }
    .referral-pdf-primary .button.secondary { color: #eef8f7; border-color: #72949b; }
    .referral-pdf-primary .button.secondary:hover, .referral-pdf-primary .button.secondary:focus-visible { color: #17313a; border-color: #eef8f7; background: #eef8f7; }
    .referral-printable { padding-top: 34px; border-top: 1px solid var(--line); }
    .referral-printable .eyebrow { color: var(--muted); }
    .referral-printable .referral-slip-head h2 { font-size: clamp(1.9rem, 3vw, 2.65rem); }
    .referral-slip-preview figure { min-width: 0; margin: 0; padding: 14px; background: #eadfcd; border: 1px solid var(--line); }
    .referral-slip-preview img { aspect-ratio: 1463 / 720; object-fit: contain; background: #fff; box-shadow: 0 7px 20px rgba(13, 38, 45, .14); }
    .referral-slip-preview figcaption { padding-top: 10px; color: #40565d; font-size: .79rem; font-weight: 800; }
    .referral-slip-note { margin: 18px 0 0; color: var(--muted); font-size: .83rem; }
    .referral-slip-head .referral-slip-note { margin-top: 14px; }
    .detail-contact { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
    .detail-contact .detail-card { min-height: 180px; }
    .aesthetics-home { padding-top: 10px; }
    .aesthetics-home .service { min-height: 220px; }
    .aesthetics-home .service h3 { margin-top: 46px; }
    .review-stars { display: block; margin-bottom: 16px; color: var(--gold); letter-spacing: 3px; font-size: 1rem; }
    .review-source { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px; color: #b8ced0; font-size: .76rem; font-weight: 800; }
    .review-source::before { content: "G"; width: 23px; height: 23px; display: grid; place-items: center; border-radius: 50%; background: #fff; color: #2878d3; font-size: .73rem; }
    .review-page-grid .detail-card { min-height: 230px; }
    .review-page-grid .review-stars { margin-bottom: 24px; }
    .review-page-grid .number { margin-bottom: 18px; }
    .referral-form {
      margin-top: 50px; padding: 38px; background: var(--referral-bg);
      border: 1px solid color-mix(in srgb, var(--teal) 32%, var(--line)); box-shadow: 0 20px 55px rgba(13, 74, 82, .12);
    }
    .referral-form-head { display: grid; grid-template-columns: 1fr .9fr; gap: 38px; margin-bottom: 32px; }
    .referral-form-head h2 { margin: 0; font-size: clamp(2.15rem, 4vw, 3.4rem); font-weight: 500; }
    .referral-form-head p { margin: 0; color: var(--muted); }
    .referral-fieldset { margin: 0; padding: 26px 0; border: 0; border-top: 1px solid color-mix(in srgb, var(--teal) 28%, var(--line)); }
    .referral-fieldset legend { padding: 0 12px 0 0; font-family: "Newsreader", serif; font-size: 1.5rem; color: var(--ink); }
    .form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
    .form-field { display: grid; gap: 7px; min-width: 0; }
    .form-field.full { grid-column: 1 / -1; }
    .form-field label, .form-label { color: var(--ink); font-size: .84rem; font-weight: 800; }
    .required-marker {
      display: inline-block; margin-left: 5px; color: var(--rust); font-size: .7rem; font-weight: 800;
    }
    .form-field input, .form-field select, .form-field textarea {
      width: 100%; min-height: 48px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 6px;
      background: var(--referral-panel); color: var(--ink); font: inherit;
    }
    .form-field textarea { min-height: 112px; resize: vertical; }
    .form-field input:focus, .form-field select:focus, .form-field textarea:focus { outline: 3px solid color-mix(in srgb, var(--teal) 28%, transparent); border-color: var(--teal); }
    .form-field [aria-invalid="true"] { border-color: var(--rust); }
    .form-help { color: var(--muted); font-size: .78rem; }
    .procedure-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
    .procedure-option { display: flex; align-items: flex-start; gap: 9px; padding: 12px; background: var(--referral-panel); font-size: .84rem; font-weight: 700; }
    .procedure-option input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--teal); }
    .tooth-chart { margin-top: 4px; padding: 24px; background: var(--referral-panel); border: 1px solid var(--line); }
    .tooth-chart-intro { display: flex; justify-content: space-between; gap: 20px; align-items: baseline; margin-bottom: 22px; }
    .tooth-chart-intro strong { font-size: .92rem; }
    .tooth-chart-intro span { color: var(--muted); font-size: .78rem; }
    .tooth-dentition + .tooth-dentition { margin-top: 26px; padding-top: 24px; border-top: 1px solid var(--line); }
    .tooth-dentition h3 { margin: 0 0 16px; font-family: "Newsreader", serif; font-size: 1.35rem; }
    .tooth-arch + .tooth-arch { margin-top: 18px; }
    .tooth-arch-label { display: block; margin-bottom: 8px; color: var(--muted); font-size: .76rem; font-weight: 800; }
    .tooth-row { display: grid; grid-template-columns: minmax(0, 1fr) 2px minmax(0, 1fr); gap: 12px; align-items: end; }
    .tooth-quadrant { min-width: 0; }
    .tooth-side { display: block; margin-bottom: 6px; color: var(--teal-deep); font-size: .7rem; font-weight: 800; text-align: center; }
    .tooth-grid { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 6px; }
    .tooth-grid.primary { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .tooth-midline { width: 2px; height: 50px; background: color-mix(in srgb, var(--teal) 40%, var(--line)); }
    .tooth-button {
      min-width: 0; min-height: 46px; padding: 4px 2px; border: 1px solid color-mix(in srgb, var(--teal) 38%, var(--line));
      border-radius: 48% 48% 42% 42% / 36% 36% 64% 64%; background: var(--surface); color: var(--ink); cursor: pointer;
      font-size: .78rem; font-weight: 800; font-variant-numeric: tabular-nums;
    }
    .tooth-button:hover { border-color: var(--rust); color: var(--rust); }
    .tooth-button:focus-visible { outline: 3px solid color-mix(in srgb, var(--rust) 38%, transparent); outline-offset: 2px; }
    .tooth-button[aria-pressed="true"] { background: var(--rust); border-color: var(--rust); color: #fff; }
    .tooth-selection-summary { margin: 20px 0 0; color: var(--muted); font-size: .82rem; }
    .tooth-selection-summary strong { color: var(--ink); }
    .referral-actions { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 8px; }
    .referral-status { flex-basis: 100%; margin: 0; color: var(--teal-deep); font-size: .85rem; font-weight: 700; }
    .referral-status:empty { display: none; }
    .referral-status.is-error { padding: 14px 16px; background: var(--rust-soft); color: var(--ink); border-left: 4px solid var(--rust); }
    .referral-status:focus-visible { outline: 3px solid color-mix(in srgb, var(--rust) 34%, transparent); outline-offset: 3px; }
    .privacy-note { margin: 24px 0 0; padding: 16px 18px; background: var(--referral-panel); color: var(--muted); font-size: .84rem; }
    .privacy-note strong { color: var(--ink); }
    .referral-instructions { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
    .referral-instruction-group { padding: 20px; background: var(--referral-panel); border: 1px solid var(--line); }
    .referral-instruction-group h3 { margin: 0 0 10px; font-family: "Newsreader", serif; font-size: 1.28rem; }
    .referral-instruction-group p { margin: 0 0 10px; color: var(--muted); font-size: .82rem; }
    .referral-instruction-group ul { margin: 0; padding-left: 19px; color: var(--muted); font-size: .82rem; }
    .referral-instruction-group li + li { margin-top: 6px; }
    .registration-form { margin-top: 44px; padding: 38px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); }
    .registration-form-head { display: grid; grid-template-columns: 1fr .82fr; gap: 36px; align-items: end; margin-bottom: 28px; }
    .registration-form-head h2 { margin: 0; font-size: clamp(2.2rem, 4vw, 3.5rem); font-weight: 500; }
    .registration-form-head p { margin: 0; color: var(--muted); }
    .registration-form .referral-fieldset { padding-block: 30px; }
    .registration-form .form-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .registration-form .form-grid.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .registration-form .form-field input[type="checkbox"], .registration-form .form-field input[type="radio"] { width: 18px; min-height: 18px; accent-color: var(--teal); }
    .registration-check-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .registration-check { display: flex; align-items: flex-start; gap: 9px; min-height: 42px; padding: 10px 11px; background: var(--referral-panel); color: var(--ink); font-size: .8rem; font-weight: 700; }
    .registration-check input { width: 17px; height: 17px; margin: 2px 0 0; flex: 0 0 auto; accent-color: var(--teal); }
    .yes-no-group { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 11px 0; border-bottom: 1px solid var(--line); }
    .yes-no-group > span { font-size: .84rem; font-weight: 700; }
    .yes-no-group label { display: inline-flex; gap: 6px; align-items: center; font-size: .8rem; }
    .yes-no-group input { width: 17px; height: 17px; accent-color: var(--teal); }
    .registration-legal { max-height: 250px; overflow-y: auto; padding: 18px; background: var(--referral-panel); border: 1px solid var(--line); color: var(--muted); font-size: .78rem; line-height: 1.55; }
    .registration-legal p { margin: 0 0 10px; }
    .registration-legal p:last-child { margin-bottom: 0; }
    .office-use { padding: 20px; background: var(--soft); }
    .office-use .form-field input:disabled, .office-use .form-field textarea:disabled { opacity: .68; cursor: not-allowed; }
    .signature-wrap { display: grid; gap: 10px; }
    .signature-pad { width: 100%; height: 190px; display: block; border: 1px solid var(--line); background: #fff; touch-action: none; cursor: crosshair; }
    .signature-controls { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
    .signature-controls .button { min-height: 40px; }
    .office-use-heading { margin: 24px 0 5px; font-family: "Newsreader", serif; font-size: 1.45rem; font-weight: 600; }
    .office-use-heading + .form-help { display: block; margin: 0 0 16px; }
    .signature-methods { display: inline-flex; gap: 6px; padding: 5px; background: var(--soft); }
    .signature-method {
      min-height: 42px; padding: 0 16px; border: 1px solid transparent; background: transparent;
      color: var(--muted); cursor: pointer; font-weight: 800;
    }
    .signature-method[aria-pressed="true"] { border-color: var(--teal); background: var(--surface); color: var(--teal-deep); }
    .signature-method:focus-visible { outline: 3px solid color-mix(in srgb, var(--teal) 28%, transparent); outline-offset: 2px; }
    .typed-signature-panel { display: grid; gap: 12px; padding: 18px; border: 1px solid var(--line); background: var(--referral-panel); }
    .typed-signature-preview {
      min-height: 94px; display: flex; align-items: center; padding: 8px 18px; border-bottom: 1px solid var(--ink);
      background: var(--surface); color: var(--ink); font-family: "Caveat", cursive; font-size: clamp(2.6rem, 7vw, 4.8rem); line-height: 1;
      overflow: hidden;
    }
    .typed-signature-preview:empty::before { content: "Your signature preview"; color: var(--muted); font-family: "Manrope", sans-serif; font-size: .8rem; font-weight: 600; }
    .registration-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 26px; }
    .registration-copy-options { margin-top: 42px; padding-top: 34px; border-top: 1px solid var(--line); }
    .registration-copy-options h2 { margin-bottom: 10px; font-size: clamp(2rem, 3.4vw, 3.2rem); font-weight: 500; }
    .registration-copy-options > p { max-width: 720px; margin: 0 0 24px; color: var(--muted); }
    .registration-copy-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
    .registration-copy-card { padding: 24px; background: var(--surface); border: 1px solid var(--line); }
    .registration-copy-card span { color: var(--rust); font-size: .76rem; font-weight: 800; }
    .registration-copy-card h3 { margin: 8px 0 8px; font-family: "Newsreader", serif; font-size: 1.5rem; }
    .registration-copy-card p { margin: 0 0 18px; color: var(--muted); font-size: .88rem; }
    .registration-interim-card p { max-width: 680px; }
    .registration-status { flex-basis: 100%; min-height: 1.4em; margin: 0; color: var(--teal-deep); font-size: .84rem; font-weight: 700; }
    .registration-status.is-error { color: var(--rust); }
    .form-progress { margin: 0 0 30px; padding: 22px; background: var(--soft); border-top: 4px solid var(--teal); }
    .form-progress-copy { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; }
    .form-progress-copy strong { color: var(--ink); font-family: "Newsreader", serif; font-size: 1.65rem; font-weight: 600; }
    .form-progress-copy span { color: var(--teal-deep); font-size: .84rem; font-weight: 800; }
    .form-progress-track { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-top: 16px; }
    .form-progress-segment { height: 7px; border: 0; border-radius: 5px; background: color-mix(in srgb, var(--teal) 18%, var(--surface)); }
    .form-progress-segment.is-complete { background: var(--teal); }
    .form-step-heading { margin: 0 0 4px; font-family: "Newsreader", serif; font-size: clamp(1.9rem, 3vw, 2.65rem); font-weight: 500; }
    .form-step-intro { margin: 0 0 20px; color: var(--muted); }
    .form-step-actions { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--line); }
    .form-step-actions .button { min-width: 210px; min-height: 54px; }
    .form-submit-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-left: auto; }
    .form-submit-actions .button.secondary svg { width: 18px; height: 18px; flex: 0 0 auto; }
    .form-step-back { display: inline-flex; align-items: center; min-height: 44px; padding: 0 4px; border: 0; background: transparent; color: var(--teal-deep); cursor: pointer; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
    .form-review { margin: 18px 0 28px; }
    .form-review-section { padding: 20px 0; border-top: 1px solid var(--line); }
    .form-review-section:last-child { border-bottom: 1px solid var(--line); }
    .form-review-section h3 { margin: 0 0 12px; font-family: "Newsreader", serif; font-size: 1.35rem; }
    .form-review-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; margin: 0; }
    .form-review-item { min-width: 0; padding: 10px 12px; background: var(--referral-panel); }
    .form-review-item dt { color: var(--muted); font-size: .72rem; font-weight: 800; }
    .form-review-item dd { margin: 3px 0 0; color: var(--ink); font-size: .86rem; overflow-wrap: anywhere; }
    .form-review-empty { margin: 0; color: var(--muted); font-size: .9rem; }
    .review-edit-link { margin-top: 14px; }
    .health-history-desktop { margin-top: 44px; padding: clamp(30px, 5vw, 46px); background: var(--navy); color: #eef8f7; }
    .health-history-desktop .eyebrow { color: #7fd0ca; }
    .health-history-desktop h2 { margin: 0 0 12px; font-size: clamp(2.15rem, 4vw, 3.4rem); font-weight: 500; }
    .health-history-desktop p { max-width: 760px; margin: 0 0 24px; color: #bdd0d3; }
    .health-history-desktop .registration-actions { margin-top: 0; }
    .health-history-desktop .button.secondary { color: #eef8f7; border-color: #61828a; }
    .health-history-desktop .button.secondary:hover, .health-history-desktop .button.secondary:focus-visible { color: #17313a; border-color: #eef8f7; background: #eef8f7; }
    .health-history-mobile { display: none; }
    .health-question-detail { padding: 14px 0 18px; border-bottom: 1px solid var(--line); }
    .health-question-detail .yes-no-group { padding-top: 0; border-bottom: 0; }
    .health-question-detail .form-field { margin-top: 12px; }
    .health-section-note { margin: 0 0 18px; color: var(--muted); font-size: .84rem; }
    .health-history-mobile .registration-check { min-height: 48px; align-items: center; }
    .health-history-mobile .registration-check input { width: 21px; height: 21px; margin-top: 0; }
    .health-history-mobile .yes-no-group { min-height: 58px; }
    .health-history-mobile .yes-no-group label { min-width: 52px; min-height: 44px; justify-content: center; padding: 8px; background: var(--referral-panel); border: 1px solid var(--line); }
    .health-history-mobile .yes-no-group input { width: 20px; height: 20px; }
    .health-detail-grid { display: grid; gap: 14px; margin-top: 12px; }
    .pdf-viewer { margin-top: 42px; }
    .pdf-viewer-intro { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 22px; padding: 20px 22px; background: var(--soft); border-top: 3px solid var(--teal); }
    .pdf-viewer-intro p { margin: 0; color: var(--muted); }
    .pdf-pages { display: grid; gap: 24px; }
    .pdf-page { margin: 0; padding: 16px; background: #e4e9e8; border: 1px solid var(--line); }
    .pdf-page img { width: min(100%, 920px); height: auto; margin: 0 auto; background: #fff; box-shadow: 0 8px 24px rgba(13, 38, 45, .16); }
    .pdf-page figcaption { margin-top: 10px; color: var(--muted); font-size: .78rem; text-align: center; }
    .text-share-link { display: block; margin: 22px 0; padding: 13px 14px; border: 1px solid var(--line); background: var(--soft); color: var(--teal-deep); font-size: .86rem; font-weight: 700; overflow-wrap: anywhere; }
    .email-share-fields { display: grid; gap: 12px; margin: 22px 0; }
    .email-share-field { padding: 13px 14px; border: 1px solid var(--line); background: var(--soft); }
    .email-share-field strong { display: block; margin-bottom: 5px; color: var(--ink); font-size: .76rem; }
    .email-share-field span { display: block; color: var(--teal-deep); font-size: .84rem; font-weight: 700; white-space: pre-wrap; overflow-wrap: anywhere; }
    .subject-format-note { margin: 0 0 24px; padding: 15px 17px; background: var(--referral-panel); color: var(--muted); font-size: .82rem; }
    .subject-format-note strong { color: var(--ink); }
    .subject-format-note code { display: block; margin: 6px 0; color: var(--teal-deep); font-family: "Manrope", sans-serif; font-size: .9rem; font-weight: 800; overflow-wrap: anywhere; }
    .question-dialog .subject-format-note { margin: 16px 0 0; border: 1px solid var(--line); background: var(--soft); }
    .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
    .question-widget-button {
      position: fixed; z-index: 38; right: 22px; bottom: 22px; display: inline-flex; align-items: center; gap: 9px;
      min-height: 48px; padding: 0 18px; border: 1px solid #fff; border-radius: 24px;
      background: var(--teal); color: #fff; box-shadow: 0 10px 30px rgba(7, 35, 43, .28); cursor: pointer;
      font-weight: 800;
    }
    .question-widget-button:hover, .question-widget-button:focus-visible { background: var(--teal-deep); transform: translateY(-1px); }
    .question-widget-button:focus-visible { outline: 3px solid color-mix(in srgb, var(--teal) 35%, #fff); outline-offset: 3px; }
    .question-widget-button svg { width: 20px; height: 20px; flex: 0 0 auto; }
    .contact-dialog { 
      width: min(440px, calc(100% - 32px)); padding: 0; border: 0; border-radius: 10px;
      background: var(--surface); color: var(--ink); box-shadow: var(--shadow);
    }
    .contact-dialog::backdrop { background: rgba(7, 25, 31, .68); }
    .contact-dialog-inner { position: relative; padding: 38px; }
    .contact-dialog-close {
      position: absolute; top: 14px; right: 14px; width: 42px; height: 42px; display: grid; place-items: center;
      border: 1px solid var(--line); border-radius: 50%; background: transparent; color: var(--ink); cursor: pointer;
    }
    .contact-dialog-close:hover, .contact-dialog-close:focus-visible { color: var(--teal); border-color: var(--teal); }
    .contact-dialog h2 { margin: 0 46px 12px 0; font-size: 2.35rem; font-weight: 500; }
    .contact-dialog p { margin: 0; color: var(--muted); }
    .contact-dialog-value { display: block; margin: 24px 0; color: var(--ink); font-family: "Newsreader", serif; font-size: 2rem; font-weight: 600; text-decoration: none; overflow-wrap: anywhere; }
    .contact-dialog-actions { display: flex; gap: 10px; flex-wrap: wrap; }
    .contact-dialog-status { min-height: 1.4em; margin-top: 14px !important; color: var(--teal-deep) !important; font-size: .84rem; font-weight: 700; }
    .question-dialog { width: min(540px, calc(100% - 32px)); }
    .question-form { display: grid; gap: 16px; margin-top: 24px; }
    .question-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
    .question-form textarea { min-height: 118px; }
    .question-form .button { width: fit-content; }
    .question-form .button[disabled] { cursor: wait; opacity: .72; transform: none; }
    .question-form-note { font-size: .78rem; }
    .question-form-status { min-height: 1.4em; color: var(--teal-deep) !important; font-size: .84rem; font-weight: 700; }
    .question-form-status.is-error { color: var(--rust) !important; }
    .question-success { margin-top: 28px; padding: 28px; background: var(--soft); border-top: 3px solid var(--teal); }
    .question-success h3 { margin: 0 0 10px; font-family: "Newsreader", serif; font-size: 1.8rem; line-height: 1.1; }
    .question-success p { margin-bottom: 20px; }
    @media (max-width: 1360px) {
      .wrap { width: min(100% - 30px, 760px); }
      .menu-button { display: grid; place-items: center; margin-left: auto; }
      .brand-mark img { width: 285px; height: auto; }
      .nav-links { display: none; position: absolute; top: 86px; left: 15px; right: 15px; max-height: calc(100vh - 106px); overflow-y: auto; background: var(--surface); border: 1px solid color-mix(in srgb, var(--action-bg) 45%, transparent); box-shadow: var(--shadow); padding: 16px; flex-direction: column; align-items: stretch; gap: 0; }
      .nav-links.open { display: flex; }
      body.nav-scrolled .nav-links { top: 66px; }
      .nav-links > a { padding: 13px 8px; border-bottom: 1px solid color-mix(in srgb, var(--action-bg) 45%, transparent); }
      .nav-links a:not(.button) { color: var(--ink); }
      .nav-links .button { display: inline-flex; margin-top: 12px; border-bottom: 0; }
      .nav-links .social-links { padding: 14px 8px 2px; }
      .nav-links .social-link { color: var(--teal); border-color: var(--line); }
      .nav-links .social-link:hover, .nav-links .social-link:focus-visible { color: #fff; background: var(--teal); }
      .nav-item { border-bottom: 1px solid color-mix(in srgb, var(--action-bg) 45%, transparent); }
      .nav-link-row { display: grid; grid-template-columns: minmax(0, 1fr) 46px; }
      .nav-link-row > a { padding: 13px 8px; }
      .submenu-toggle { width: 46px; height: 48px; color: var(--teal); }
      .submenu { position: static; display: none; min-width: 0; padding: 2px 8px 10px; border: 0; box-shadow: none; background: var(--soft); opacity: 1; visibility: visible; pointer-events: auto; transform: none; }
      .submenu::before { display: none; }
      .nav-item.submenu-open .submenu { display: block; }
      .nav-item.submenu-open .submenu { background: color-mix(in srgb, var(--teal) 8%, var(--surface)); }
      .nav-item.submenu-open .submenu-toggle svg { transform: rotate(180deg); }
      .submenu a { padding: 7px 12px; color: var(--ink); border-bottom: 1px solid color-mix(in srgb, var(--action-bg) 45%, transparent); font-size: .88rem; }
      .nav-links .nav-item.has-submenu .nav-link-row > a { color: var(--teal); font-weight: 600; }
      .submenu a:last-child { border-bottom: 0; }
      .nav-links > a.patient-registration-nav,
      .nav-links > a.patient-registration-nav:visited {
        margin: 10px 4px 4px; padding: 13px 12px; border-bottom: 0; border-radius: 6px;
        background: var(--registration-bg); color: var(--registration-ink);
        box-shadow: 0 5px 15px rgba(113, 48, 30, .2); text-align: center;
      }
      .nav-links > a.patient-registration-nav:hover,
      .nav-links > a.patient-registration-nav:focus-visible {
        background: var(--registration-hover); color: var(--registration-ink);
      }
      .nav-links .submenu a.patient-registration-link,
      .nav-links .submenu a.patient-registration-link:visited {
        margin: 7px 4px; border-bottom: 0;
        color: var(--registration-ink); background: var(--registration-bg);
      }
      .nav-links .submenu a.patient-registration-link:hover,
      .nav-links .submenu a.patient-registration-link:focus-visible,
      .nav-links .submenu a.patient-registration-link[aria-current="page"] {
        color: var(--registration-ink); background: var(--registration-hover);
      }
      .nav-links .submenu .post-operative-menu { margin: 7px 4px; }
      .nav-links .submenu .post-operative-link {
        border-bottom: 0; color: var(--instructions-ink); background: var(--instructions-bg);
      }
      .nav-links .submenu .post-operative-link:hover,
      .nav-links .submenu .post-operative-link:focus-visible {
        color: var(--instructions-ink); background: var(--instructions-hover);
      }
      .nav-links .submenu .post-operative-items { padding: 4px 0 2px 12px; }
      .submenu .submenu-overview { margin-bottom: 0; }
      .hero { padding-top: 38px; }
      .hero-grid, .doctor-grid, .staff-layout, .reviews-layout, .faq-grid, .financing-panel { grid-template-columns: 1fr; }
      .payment-estimator { border-top: 1px solid #365963; border-left: 0; }
      .hero-grid { gap: 36px; }
      .hero-photo { max-width: 680px; }
      .hero-photo img { height: 440px; }
      .trust-grid { grid-template-columns: 1fr 1fr; }
      .trust-item:nth-child(2) { border-right: 0; }
      .trust-item:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
      .services-grid { grid-template-columns: 1fr 1fr; }
      .patient-grid { grid-template-columns: 1fr 1fr; }
      .service, .service.primary, .service:not(.primary), .service.wide { grid-column: auto; min-height: 230px; }
      .service.primary { grid-column: 1 / -1; }
      .doctor-grid { gap: 46px; }
      .doctor-portrait { max-width: 520px; }
      .reviews-layout, .faq-grid { gap: 42px; }
      .journal-grid { grid-template-columns: 1fr 1fr; }
      .journal-card, .journal-card:first-child { grid-column: auto; }
      .journal-card:first-child { grid-column: 1 / -1; }
      .social-feed-layout { grid-template-columns: 1fr; }
      .experience-grid { grid-template-columns: 1fr; }
      .experience-grid > img { height: 420px; }
      .experience-stack { grid-template-columns: 1fr 1fr; }
      .experience-stack img { height: 230px; }
      .visit-card { grid-template-columns: 1fr; }
      .visit-image { order: -1; }
      .visit-image img { min-height: 280px; max-height: 360px; }
      .detail-hero, .detail-intro { grid-template-columns: 1fr; }
      .referral-slip-top { grid-template-columns: 1fr; }
      .article-layout { grid-template-columns: 1fr; gap: 30px; }
      .article-nav { position: static; }
      .detail-hero { gap: 36px; }
      .detail-media img, .detail-avatar { height: 360px; min-height: 360px; }
      .detail-intro { gap: 18px; }
      .detail-grid { grid-template-columns: 1fr 1fr; }
      .team-list { grid-template-columns: 1fr; }
      .team-card { grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); }
      .technology-feature { grid-template-columns: 1fr; gap: 24px; }
      .technology-feature img { height: 380px; }
      .illustration-feature { grid-template-columns: 1fr; gap: 26px; }
      .implant-benefit-grid, .implant-steps, .graft-types { grid-template-columns: 1fr 1fr; }
      .allon4-overview { grid-template-columns: 1fr; }
      .allon4-definition { border-right: 0; border-bottom: 1px solid #365963; }
      .detail-cta { align-items: flex-start; flex-direction: column; }
    }
    @media (max-width: 620px) {
      .wrap { width: min(100% - 24px, 520px); }
      [id] { scroll-margin-top: 64px; }
      .site-nav { box-shadow: 0 8px 22px rgba(8, 35, 42, .16); }
      .nav-inner, body.nav-scrolled .nav-inner { min-height: 56px; }
      .brand-mark { padding: 4px 6px; overflow: hidden; background: transparent; }
      .brand-mark picture { display: block; line-height: 0; }
      .brand-mark img, body.nav-scrolled .brand-mark img { width: 195px; height: auto; aspect-ratio: auto; }
      .nav-call {
        display: grid; place-items: center; width: 40px; height: 40px; margin-left: auto; flex: 0 0 auto;
        border: 1px solid rgba(255,255,255,.72); border-radius: 8px; color: #fff; text-decoration: none;
      }
      .nav-call:hover, .nav-call:focus-visible { color: #087a91; background: #fff; }
      .nav-call svg { width: 19px; height: 19px; }
      .menu-button { width: 40px; height: 40px; margin-left: 0; color: #fff; background: transparent; border-color: rgba(255,255,255,.72); }
      .nav-links, body.nav-scrolled .nav-links { top: 56px; left: 12px; right: 12px; }
      .nav-inner > .button { display: none; }
      .hero { padding: 24px 0 30px; }
      .eyebrow { margin-bottom: 12px; font-size: .78rem; }
      h1 { max-width: none; margin-bottom: 20px; font-size: clamp(2.45rem, 10.2vw, 2.9rem); line-height: 1.04; }
      .lead { font-size: .98rem; line-height: 1.62; }
      .hero-inline-mobile {
        display: block; float: right; width: 42%; aspect-ratio: 4 / 3; margin: 2px 0 12px 16px;
        object-fit: cover; object-position: center top; border-radius: 28px 6px 6px 6px; box-shadow: var(--shadow);
      }
      .hero-actions { clear: both; display: grid; grid-template-columns: 1fr 1fr; }
      .button { padding-inline: 14px; }
      .hero-awards-mobile {
        display: grid; grid-template-columns: 1fr; gap: 10px; align-items: center;
        margin: 24px 0 4px; padding: 13px 14px; background: var(--navy); color: #eef8f7;
      }
      .hero-awards-mobile .award-badges { display: flex; width: 100%; gap: 6px; }
      .hero-awards-mobile .award-badge { width: 38px; height: 42px; }
      .hero-awards-mobile .award-badge.is-history { width: 138px; height: 28px; }
      .hero-awards-mobile strong { display: block; font-family: "Newsreader", serif; font-size: 1.08rem; font-weight: 600; line-height: 1.12; }
      .hero-awards-mobile span { display: block; margin-top: 3px; color: #b8ced0; font-size: .72rem; }
      .hero-photo { padding: 9px 0 0 9px; }
      .hero-photo img { height: 310px; object-position: center top; border-radius: 54px 8px 8px 8px; }
      .photo-note { left: 0; bottom: 15px; }
      .award-strip { display: none; }
      .award-strip-inner, .doctor-awards { align-items: flex-start; flex-direction: column; }
      .award-visuals { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
      .award-badges { width: auto; justify-content: flex-start; }
      .award-badge { width: 76px; height: 85px; }
      .doctor-awards { padding: 24px; }
      .doctor-awards .award-visuals { width: 100%; }
      .doctor-awards .award-badges { width: auto; }
      .trust-item { padding: 20px 14px; }
      .trust-item strong { font-size: 1.28rem; }
      section { padding: 64px 0; }
      .section-head { display: block; }
      .section-head p { margin-top: 16px; }
      .services-grid, .patient-grid { grid-template-columns: 1fr; }
      .service.primary, .service:not(.primary), .service.wide { grid-column: auto; min-height: 210px; }
      .service.primary h3 { margin-top: 54px; font-size: 2rem; }
      .service h3 { margin-top: 44px; }
      .financing-home { padding-bottom: 64px; }
      .financing-intro { padding: 34px 24px; }
      .financing-benefits { grid-template-columns: 1fr; }
      .payment-estimator { padding: 30px 24px; }
      .payment-table, .payment-table tbody { display: block; }
      .payment-table thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
      .payment-table tr { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; padding: 17px 0; border-bottom: 1px solid #365963; }
      .payment-table td { display: grid; gap: 3px; padding: 0; border: 0; text-align: left; font-size: .82rem; }
      .payment-table td:first-child { grid-column: 1 / -1; color: #fff; font-size: 1rem; }
      .payment-table td:not(:first-child)::before { content: attr(data-label); color: #a9c3c6; font-size: .66rem; font-weight: 700; }
      .doctor-portrait::after { right: -4px; }
      .credentials { grid-template-columns: 1fr; }
      .review-summary { padding: 24px; min-height: 230px; }
      .carousel-controls { justify-content: center; }
      .journal-grid { grid-template-columns: 1fr; }
      .journal-card:first-child { grid-column: auto; }
      .journal-image img, .journal-card:first-child .journal-image img { height: 220px; }
      .social-feed { padding-top: 0; }
      .social-profile, .facebook-feed { padding: 30px 22px; }
      .social-profile-actions { display: grid; }
      .social-profile-actions .button { width: 100%; }
      .facebook-feed-head { align-items: flex-start; flex-direction: column; gap: 4px; }
      .social-update { grid-template-columns: 58px minmax(0, 1fr); gap: 14px; }
      .social-update > span { display: none; }
      .facebook-follow { width: 100%; }
      .experience-grid > img { height: 360px; }
      .experience-stack { grid-template-columns: 1fr; }
      .experience-stack img { height: 240px; }
      .experience-caption { display: block; }
      .visit-copy { padding: 34px 24px; }
      .visit-actions { display: grid; }
      .detail-page { padding: 30px 0 56px; }
      .detail-body { padding-top: 24px; }
      .detail-copy h1 { font-size: clamp(2.75rem, 13vw, 4rem); }
      .self-send-actions { display: grid; grid-template-columns: 1fr; width: 100%; }
      .self-send-actions .button { width: 100%; }
      .detail-media img, .detail-avatar { height: 310px; min-height: 310px; border-radius: 52px 8px 8px 8px; }
      .hero-photo,
      .doctor .doctor-portrait,
      body.doctor-photo-page:not(.doctor-page) .detail-hero .detail-media { display: none; }
      .detail-grid, .team-list, .detail-contact { grid-template-columns: 1fr; }
      .team-card { grid-template-columns: 1fr; }
      .team-card-photo { width: 100%; height: auto; min-height: 0; max-width: 420px; margin-inline: auto; aspect-ratio: 4 / 5; }
      .team-card-content { padding: 24px; align-self: start; }
      .detail-card { min-height: 0; }
      .article-nav { display: none; }
      .article-section { padding-bottom: 28px; margin-bottom: 28px; }
      .video-grid { grid-template-columns: 1fr; }
      .video-frame { border-radius: 8px 36px 8px 8px; }
      .technology-feature img { height: 300px; padding: 12px; }
      .illustration-feature { margin-bottom: 40px; padding: 24px 18px; }
      .graft-detail-visual { grid-template-columns: 1fr; gap: 20px; padding: 22px 18px; }
      .implant-benefit-grid, .implant-steps, .graft-types { grid-template-columns: 1fr; }
      .implant-benefit, .implant-step, .graft-type { min-height: 0; }
      .implant-benefit .benefit-number, .implant-step .step-number { margin-bottom: 20px; }
      .allon4-overview { margin-bottom: 36px; }
      .allon4-definition, .allon4-candidate { padding: 26px 22px; }
      .allon4-step { grid-template-columns: 54px minmax(0, 1fr); }
      .allon4-step-number { padding: 23px 10px 23px 0; font-size: 1.75rem; }
      .allon4-step-copy { padding: 21px 0 23px 18px; }
      .allon4-fee-grid { grid-template-columns: 1fr; }
      .allon4-fee { padding: 22px 0; }
      .allon4-fee + .allon4-fee { padding-left: 0; border-top: 1px solid color-mix(in srgb, var(--rust) 28%, var(--line)); border-left: 0; }
      .excellence-callout { grid-template-columns: 1fr; padding: 26px 24px; }
      .clinical-gallery-grid { grid-template-columns: 1fr; }
      .clinical-gallery img { height: 260px; }
      .detail-cta { padding: 30px 24px; }
      .detail-cta-actions { display: grid; width: 100%; }
      .referral-form, .registration-form, .referral-slip { padding: 26px 20px; }
      .referral-pdf-primary { grid-template-columns: 1fr; grid-template-areas: "badge" "copy" "action"; gap: 24px; padding: 30px 22px; }
      .referral-pdf-primary::after { right: -4px; bottom: -20px; font-size: 5rem; }
      .referral-pdf-primary h2 { font-size: clamp(2.25rem, 12vw, 3.35rem); }
      .referral-primary-action { padding: 18px; }
      .referral-form-head, .registration-form-head, .referral-slip-head, .referral-slip-preview, .form-grid, .registration-form .form-grid.three, .registration-form .form-grid.four, .registration-copy-grid { grid-template-columns: 1fr; }
      .referral-slip-head { align-items: start; }
      .referral-slip-actions { display: grid; justify-content: stretch; }
      .referral-slip-actions .button { width: 100%; }
      .referral-form-head, .registration-form-head { gap: 14px; }
      .registration-check-grid, .referral-instructions { grid-template-columns: 1fr; }
      .yes-no-group { grid-template-columns: minmax(0, 1fr) 60px 60px; gap: 8px; }
      .health-history-desktop { display: none; }
      .health-history-mobile { display: block; }
      .health-history-mobile.registration-form { margin-top: 30px; }
      .health-history-mobile .registration-form-head { display: block; }
      .health-history-mobile .registration-form-head p { margin-top: 12px; }
      .health-history-mobile .referral-fieldset { padding-block: 24px; }
      .health-history-mobile .form-field input, .health-history-mobile .form-field select, .health-history-mobile .form-field textarea { min-height: 52px; font-size: 16px; }
      .signature-pad { height: 160px; }
      .registration-actions { align-items: stretch; flex-direction: column; }
      .registration-actions .button { width: 100%; }
      .form-progress { position: sticky; z-index: 3; top: 56px; scroll-margin-top: 56px; margin: -26px -20px 26px; padding: 18px 20px 16px; box-shadow: 0 8px 18px rgba(8, 35, 42, .08); }
      .form-progress-copy { align-items: flex-start; flex-direction: column-reverse; gap: 3px; }
      .form-progress-copy strong { font-size: 1.42rem; line-height: 1.15; }
      .form-step-actions { align-items: stretch; flex-direction: column-reverse; }
      .form-step-actions .button, .form-step-actions .form-step-back { width: 100%; }
      .form-step-actions .form-step-back { justify-content: center; }
      .form-submit-actions { width: 100%; flex-direction: column; margin-left: 0; }
      .form-review-list { grid-template-columns: 1fr; }
      .pdf-viewer-intro { align-items: stretch; flex-direction: column; }
      .pdf-viewer-intro .button { width: 100%; }
      .pdf-page { padding: 7px; }
      .procedure-options { grid-template-columns: 1fr 1fr; }
      .tooth-chart { padding: 20px 12px; }
      .tooth-chart-intro { display: block; }
      .tooth-chart-intro span { display: block; margin-top: 5px; }
      .tooth-row { grid-template-columns: 1fr; gap: 12px; }
      .tooth-midline { display: none; }
      .tooth-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
      .tooth-grid.primary { grid-template-columns: repeat(5, minmax(0, 1fr)); }
      .tooth-button { min-height: 44px; }
      .tooth-quadrant + .tooth-quadrant { padding-top: 4px; }
      .referral-actions { align-items: stretch; flex-direction: column; }
      .contact-dialog-inner { padding: 32px 22px 24px; }
      .contact-dialog h2 { font-size: 2rem; }
      .contact-dialog-value { font-size: 1.75rem; }
      .contact-dialog-actions { display: grid; }
      .question-contact-grid { grid-template-columns: 1fr; }
      .question-form .button { width: 100%; }
      .question-widget-button { right: 12px; bottom: calc(78px + env(safe-area-inset-bottom)); min-height: 44px; padding: 0 14px; font-size: .82rem; }
      .footer-grid { grid-template-columns: 1fr; gap: 28px; }
      .mobile-actions {
        position: fixed; z-index: 40; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
        background: var(--surface); border-top: 1px solid var(--line); padding: 9px max(9px, env(safe-area-inset-right)) calc(9px + env(safe-area-inset-bottom)) max(9px, env(safe-area-inset-left));
        box-shadow: 0 -10px 28px rgba(8, 35, 42, .14);
      }
      .mobile-actions a {
        min-height: 46px; display: grid; place-items: center; padding: 8px 10px;
        border: 2px solid transparent; border-radius: 8px; color: #fff;
        text-align: center; text-decoration: none; font-size: .86rem; font-weight: 800;
      }
      .mobile-actions a:first-child, .mobile-actions a:first-child:visited { background: #087a91; border-color: #087a91; color: #fff; }
      .mobile-actions a:last-child, .mobile-actions a:last-child:visited { background: var(--action-bg); border-color: var(--action-bg); color: var(--action-ink); }
      .mobile-actions a:first-child:hover, .mobile-actions a:first-child:focus-visible { background: #065f73; border-color: #065f73; color: #fff; }
      .mobile-actions a:last-child:hover, .mobile-actions a:last-child:focus-visible { background: var(--action-hover); border-color: var(--action-hover); color: var(--action-ink); }
      footer { padding-bottom: 120px; }
    }
    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      *, *::before, *::after { transition: none !important; }
    }

/* ============================================================
   WordPress integration glue (VPOMS Redesign)
   Small additions so the ported mockup design works with
   WordPress menus, cloned page content, and the admin bar.
   ============================================================ */
.admin-bar .site-nav { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-nav { top: 46px; } }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
img { max-width: 100%; }
.entry-content { max-width: 860px; }
.entry-content > * + * { margin-top: 1.1em; }
.entry-content h2, .entry-content h3, .entry-content h4 { font-family: "Newsreader", Georgia, serif; color: var(--ink); line-height: 1.2; }
.entry-content img { max-width: 100%; height: auto; border-radius: 12px; }
.entry-content img[align="right"], .entry-content img[align="left"], .entry-content img.alignright, .entry-content img.alignleft { width: auto; }
.entry-content iframe, .entry-content video, .entry-content embed { max-width: 100%; }
.entry-content table { display: block; overflow-x: auto; border-collapse: collapse; }
.entry-content .alignleft { float: left; margin: 0 20px 12px 0; }
.entry-content .alignright { float: right; margin: 0 0 12px 20px; }
.entry-content .aligncenter { display: block; margin-left: auto; margin-right: auto; }
a.doctor-name-link { color: inherit; text-decoration: underline; text-decoration-color: var(--rust); text-underline-offset: 3px; }
.submenu .post-operative-items { display: grid; gap: 2px; padding: 4px 0 4px 14px; }
.footer-legal { border-top: 1px solid rgba(255,255,255,.18); margin-top: 28px; padding-top: 18px; }
.footer-legal ul { display: flex; flex-wrap: wrap; gap: 8px 22px; list-style: none; margin: 0; padding: 0; }
.footer-legal a { color: inherit; opacity: .85; font-size: .9rem; }
.not-found-links { display: grid; gap: 6px; margin-top: 10px; }
.not-found-links ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.journal-list { display: grid; gap: 18px; }

/* ---- Mobile award badges (2026-10-14 fix) ----
   On phones the badge rows kept their desktop-footer sizes and left
   alignment, so the four Best of Omaha badges bunched small at the
   left of a full-width row. In this breakpoint only: rows wrap and
   center, badges size up modestly, and heights go auto so the images
   render at their natural aspect ratio. Desktop is untouched. */
@media (max-width: 620px) {
  .award-badges { flex-wrap: wrap; justify-content: center; }
  .award-badge { flex: 0 0 auto; height: auto; }
  .award-badge img { height: auto; }
  /* Homepage awards card (2026-10-14 layout rework, user spec): the
     wording and the three featured badges share one line; the history
     strip sits underneath, centered under the badge group at the
     group's own width (172px) instead of near-full-card width. Card
     padding and gaps tightened so the section is noticeably shorter. */
  .hero-awards-mobile {
    display: flex; flex-wrap: wrap; align-items: center;
    column-gap: 10px; row-gap: 5px;
    margin: 12px 0 2px; padding: 6px 12px;
  }
  .hero-awards-mobile > div:not(.award-badges) { order: 1; flex: 1 1 108px; min-width: 0; }
  .hero-awards-mobile .award-badges {
    order: 2; flex: 0 0 auto; width: 172px;
    display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 5px;
  }
  .hero-awards-mobile .award-badge { order: 1; width: 52px; height: auto; }
  .hero-awards-mobile .award-badge.is-history { order: 2; flex: 0 0 100%; width: auto; height: auto; display: flex; justify-content: center; }
  .hero-awards-mobile .award-badge.is-history img { width: 100%; height: auto; }
  .footer-awards .award-visuals { justify-content: center; }
  .footer-awards .award-badges { justify-content: center; width: 100%; }
  .footer-awards .award-badge { width: 58px; height: auto; }
  .footer-awards .award-badge.is-history { width: min(300px, 88%); height: auto; }
  .doctor-awards .award-badge { height: auto; }
  .doctor-awards .award-badge.is-history { height: auto; }
}

/* ---- Award strip layout (2026-10-14 rework, user spec) ----
   Same arrangement as the mobile card, as the consistent layout:
   the wording and the three featured badges share one line, and the
   history strip sits underneath, centered under the badge group at
   exactly the group's width (3 x 66px + 2 x 10px gaps = 218px).
   Strip padding tightened (20px -> 12px) for a shorter section.
   Scoped to .award-strip so the footer badges are untouched. */
.award-strip { padding: 7px 0; }
.award-strip .award-strip-inner { gap: 16px; }
.award-strip .award-visuals { gap: 10px; }
.award-strip .award-badges {
  flex-wrap: wrap; justify-content: center; align-items: center;
  width: 210px; gap: 6px;
}
.award-strip .award-badge { width: 66px; height: auto; flex: 0 0 auto; }
.award-strip .award-badge img { height: auto; }
.award-strip .award-badge.is-history {
  order: 2; flex: 0 0 100%; width: auto; height: auto;
  display: flex; justify-content: center;
}
.award-strip .award-badge.is-history img { width: 210px; max-width: 100%; height: auto; }

/* ---- Focused expertise: photo-led service panels (2026-10-14) ----
   Ported from the approved mockup build: light warm sand ground
   (#f6ede1), dark photo-led panels, Dental Implants as the large
   primary panel, seven panels 01-07 (no aesthetics tile in the grid;
   the separate aesthetics section below is untouched). Scoped to
   #services so the aesthetics-home .service cards keep the base look. */
#services { background: var(--paper); color: var(--ink); }
#services .section-head h2 { color: var(--ink); }
#services .section-head p { color: #4d5f66; }
@media (prefers-color-scheme: dark) {
  #services { background: var(--paper); color: #f3e9dc; }
  #services .section-head h2 { color: #f7efe4; }
  #services .section-head p { color: #d8c9b4; }
}
#services .service {
  display: flex; flex-direction: column; justify-content: flex-end;
  min-height: 320px; padding: 24px; border: 0; border-radius: 14px;
  background: #0a2129; color: #f5fbfb;
  transition: transform .2s ease, box-shadow .2s ease;
}
#services .service-media { position: absolute; inset: 0; z-index: 0; }
#services .service-media img {
  width: 100%; height: 100%; object-fit: cover; object-position: center;
  transition: transform .5s ease;
}
#services .service::after {
  content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit;
  background: linear-gradient(180deg, rgba(7, 25, 32, .16) 0%, rgba(7, 25, 32, .34) 44%, rgba(6, 22, 28, .94) 100%);
}
#services .service .index, #services .service h3, #services .service p { position: relative; z-index: 2; }
#services .service .arrow { z-index: 2; }
#services .service .index { position: absolute; top: 20px; left: 24px; z-index: 2; color: #f2ab8d; letter-spacing: .045em; }
#services .service h3 { margin: 12px 0 9px; font-size: 1.85rem; line-height: 1.08; color: #fff; }
#services .service p { color: #d3e2e4; max-width: 430px; }
#services .service .service-name { display: block; }
#services .service .service-tagline {
  display: block; margin-top: 7px; font-family: "Manrope", sans-serif;
  font-size: .95rem; font-weight: 600; line-height: 1.35; letter-spacing: 0; color: #dcebee;
}
#services .service .arrow {
  background: rgba(7, 25, 32, .5); color: #fff; border-color: rgba(255, 255, 255, .7);
}
#services .service:hover, #services .service:focus-visible {
  border-color: transparent; transform: translateY(-3px);
  box-shadow: 0 20px 42px rgba(0, 0, 0, .38);
}
#services .service:hover .service-media img,
#services .service:focus-visible .service-media img { transform: scale(1.045); }
#services .service:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
#services .service.primary { min-height: 440px; padding: 36px; }
#services .service.primary::after {
  background: linear-gradient(90deg, rgba(6, 22, 28, .95) 0%, rgba(6, 22, 28, .8) 46%, rgba(6, 22, 28, .28) 78%, rgba(6, 22, 28, .38) 100%);
}
#services .service.primary .service-media img { object-position: center 58%; }
#services .service.primary .index { font-size: .92rem; }
#services .service.primary h3 { margin-top: 16px; font-size: clamp(2.5rem, 4.4vw, 3.6rem); max-width: 660px; }
#services .service.primary .service-tagline { font-size: 1.08rem; margin-top: 10px; }
#services .service.primary p { font-size: .98rem; max-width: 520px; }
#services .service.wide { min-height: 280px; }
#services .service.full { grid-column: 1 / -1; }
@media (max-width: 1024px) {
  #services .service { min-height: 280px; }
  #services .service.primary { min-height: 400px; }
  #services .service.wide { min-height: 280px; }
}
@media (max-width: 760px) {
  #services .service { min-height: 215px; padding: 22px; }
  #services .service.primary { min-height: 215px; padding: 20px 26px; }
  #services .service.primary h3 { font-size: 2.35rem; margin-top: 2px; margin-bottom: 4px; line-height: 1.0; }
  #services .service.primary .service-tagline { margin-top: 6px; line-height: 1.18; }
  #services .service.primary p { line-height: 1.42; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  #services .service.wide { min-height: 215px; }
  #services .service h3 { font-size: 1.7rem; }
  #services .service .index { top: 18px; left: 22px; }
}

/* Phase 3 (2026-10-15): question form — honeypot parked off-screen, success panel respects [hidden]. */
.question-form .hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.question-form[hidden], .question-success[hidden] { display: none; }

/* Phase 3 Step 3 (2026-10-15): registration + referral forms — honeypots parked off-screen, hidden state respected, success panels, scheduling radio rows. */
.registration-form .hp-field, .referral-form .hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.registration-form[hidden], .referral-form[hidden], .form-success[hidden], .form-step[hidden] { display: none; }
.form-success { margin-top: 28px; padding: 28px; background: var(--soft); border-top: 3px solid var(--teal); }
.form-success h3 { margin: 0 0 10px; font-family: "Newsreader", serif; font-size: 1.8rem; line-height: 1.1; }
.form-success p { margin: 0; }
.scheduling-options { display: grid; gap: 8px; }
.scheduling-options .registration-check { align-items: center; }

/* Phase 3 fix (2026-10-15): step-3 certification block is a delineated panel directly above the Submit action; Age fields are auto-calculated (read-only). */
.certification-panel { margin-top: 30px; padding: 24px 26px 2px; background: var(--referral-panel); border: 1px solid color-mix(in srgb, var(--teal) 32%, var(--line)); border-top: 4px solid var(--teal); }
.certification-panel-head h4 { margin: 0 0 6px; font-family: "Newsreader", serif; font-size: 1.5rem; font-weight: 600; }
.certification-panel-head p { margin: 0; color: var(--muted); font-size: .88rem; }
.certification-panel-head p strong { color: var(--rust); }
.certification-panel .referral-fieldset:first-of-type { border-top: 0; padding-top: 16px; }
.certification-panel.has-error { border-color: var(--rust); border-top-color: var(--rust); }
.registration-check input[aria-invalid="true"] { outline: 2px solid var(--rust); outline-offset: 2px; }
.form-field input[readonly] { opacity: .78; }
@media (max-width: 620px) { .certification-panel { padding: 20px 16px 2px; } }

/* Content CTA pair + teal call button (1.0.25) */
.entry-content .content-ctas { display: flex; flex-wrap: wrap; gap: 12px; }
.entry-content a.button.call-cta { background: var(--teal); border-color: var(--teal); color: #fff; box-shadow: none; }
.entry-content a.button.call-cta:hover, .entry-content a.button.call-cta:focus-visible { background: var(--teal-deep); border-color: var(--teal-deep); color: #fff; }