/* CheckMate modern layer, September 2026.
   Loaded last. Keeps the hero, colours and content; modernises layout, cards,
   buttons, forms and the new clinic and doctor sections. */

:root {
    --cm-ink: #0d2328;
    --cm-text: #3e5156;
    --cm-muted: #6a7b80;
    --cm-line: #e2e9ea;
    --cm-soft: #e7f2f2;
    --cm-tint: #f6f9f9;
    --cm-shadow: 0 1px 2px rgba(13, 35, 40, 0.04), 0 12px 32px rgba(13, 35, 40, 0.06);
    --cm-shadow-hover: 0 2px 4px rgba(13, 35, 40, 0.05), 0 20px 44px rgba(13, 35, 40, 0.1);
}

/* ---------- Shared building blocks ---------- */

.cm-section { padding: 88px 0; }
.cm-section + .cm-section { padding-top: 16px; }

.cm-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 14px;
    font: 600 13px/1 "Poppins", sans-serif;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--color-primary);
}

.cm-eyebrow::before {
    content: "";
    width: 22px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
}

.cm-title {
    margin: 0 0 18px;
    font: 600 clamp(32px, 3.6vw, 44px)/1.12 "Poppins", sans-serif;
    letter-spacing: -0.02em;
    color: var(--cm-ink);
}

.cm-title .text-green { color: var(--color-primary); }

.cm-title-suffix {
    margin-left: 6px;
    font-size: 0.45em;
    font-weight: 500;
    letter-spacing: 0.02em;
    color: var(--cm-muted);
    white-space: nowrap;
    vertical-align: middle;
}

.cm-lead {
    margin: 0 0 24px;
    max-width: 62ch;
    font-size: 17px;
    line-height: 1.7;
    color: var(--cm-text);
}

.cm-lead strong { color: var(--cm-ink); }

.cm-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.cm-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 48px;
    padding: 0 22px;
    border-radius: 999px;
    border: 1.5px solid transparent;
    font: 600 15px/1.2 "Poppins", sans-serif;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.cm-btn:hover { transform: translateY(-1px); }

.cm-btn-primary {
    background: var(--color-primary);
    color: #fff;
    box-shadow: 0 8px 20px rgba(19, 119, 123, 0.22);
}

.cm-btn-primary:hover { background: var(--color-primary-dark); color: #fff; }

.cm-btn-ghost {
    background: transparent;
    border-color: rgba(19, 119, 123, 0.35);
    color: var(--color-primary);
}

.cm-btn-ghost:hover { background: var(--cm-soft); border-color: var(--color-primary); }

.cm-btn-linkedin {
    background: #0a66c2;
    color: #fff;
    box-shadow: 0 8px 20px rgba(10, 102, 194, 0.22);
}

.cm-btn-linkedin:hover { background: #004182; color: #fff; }

/* Primary buttons already on the page get the same pill shape */
.btn-primary {
    border-radius: 999px;
    padding: 12px 24px;
    font-family: "Poppins", sans-serif;
}

.btn-primary:hover { transform: translateY(-1px); }

/* ---------- Section titles across the page ---------- */

@media (min-width: 768px) {
    .section-title,
    .section-title1 {
        font-size: clamp(32px, 3.4vw, 44px);
        line-height: 1.12;
        letter-spacing: -0.02em;
        color: var(--cm-ink);
    }

    .services-subtitle {
        color: var(--cm-text);
        font-size: 17px;
        line-height: 1.6;
    }
}

/* ---------- Services ---------- */

.services-grid .service-card {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--cm-line);
    border-radius: 20px;
    box-shadow: var(--cm-shadow);
}

.services-grid .service-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--cm-shadow-hover);
}

.services-grid .service-title { color: var(--cm-ink); letter-spacing: -0.01em; }
.services-grid .service-description { color: var(--cm-text); }

/* Book appointment: same pill on every card, pinned to the bottom so all line up */
body .services-grid .service-book {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    align-self: flex-start;
    margin-top: auto !important;
    padding: 10px 18px !important;
    border: 1.5px solid rgba(19, 119, 123, 0.3);
    border-radius: 999px;
    background: transparent;
    color: var(--color-primary) !important;
    font: 600 14.5px/1.2 "Poppins", sans-serif !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

body .services-grid .service-book:hover {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff !important;
}

.services-grid .service-description { margin-bottom: 22px; }

.service-image-container {
    border-radius: 20px;
    box-shadow: var(--cm-shadow);
}

/* ---------- Clinic ---------- */

.cm-split {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    gap: 56px;
    align-items: center;
}

.cm-facts {
    display: grid;
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cm-facts li {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    font-size: 15px;
    line-height: 1.5;
    color: var(--cm-muted);
}

.cm-facts strong {
    display: block;
    font-size: 15.5px;
    font-weight: 600;
    color: var(--cm-ink);
}

.cm-fact-icon,
.cm-hl-icon,
.cm-quick-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: var(--cm-soft);
    color: var(--color-primary);
}

.cm-media .about-clinic-image-container {
    height: clamp(320px, 34vw, 460px);
    border-radius: 24px;
    box-shadow: var(--cm-shadow-hover);
}

/* ---------- Doctor ---------- */

.cm-doctor-card {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    overflow: hidden;
    border: 1px solid var(--cm-line);
    border-radius: 28px;
    background: #fff;
    box-shadow: var(--cm-shadow);
}

.cm-doctor-photo {
    position: relative;
    min-height: 420px;
    background: #0b0f10;
}

.cm-doctor-photo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 64% 30%;
}

.cm-photo-tag {
    position: absolute;
    left: 20px;
    bottom: 20px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.94);
    color: var(--cm-ink);
    font: 600 13.5px/1.2 "Poppins", sans-serif;
    box-shadow: 0 8px 22px rgba(2, 12, 27, 0.2);
}

.cm-photo-tag svg { color: var(--color-primary); }

.cm-doctor-body { padding: 48px 52px; }

.cm-role {
    margin: -4px 0 16px;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.5;
    color: var(--color-primary-dark);
}

.cm-highlights {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 20px;
    padding: 0;
    list-style: none;
}

.cm-highlights li {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 12px;
    align-items: start;
    padding: 14px;
    border: 1px solid var(--cm-line);
    border-radius: 16px;
    background: var(--cm-tint);
}

.cm-highlights .cm-hl-icon { grid-row: span 2; width: 38px; height: 38px; border-radius: 10px; }

.cm-highlights strong {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--cm-ink);
}

.cm-highlights li > span:last-child {
    font-size: 13.5px;
    line-height: 1.45;
    color: var(--cm-muted);
}

.cm-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cm-chips li {
    padding: 6px 13px;
    border: 1px solid var(--cm-line);
    border-radius: 999px;
    background: #fff;
    font-size: 13.5px;
    color: var(--cm-text);
}

.cm-cv {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    margin-top: 24px;
}

.cm-cv-col {
    padding: 32px 36px;
    border: 1px solid var(--cm-line);
    border-radius: 24px;
    background: #fff;
    box-shadow: var(--cm-shadow);
}

.cm-cv-title {
    margin: 0 0 18px;
    font: 600 13px/1 "Poppins", sans-serif;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--color-primary);
}

.cm-timeline + .cm-cv-title { margin-top: 30px; }

.cm-timeline {
    margin: 0;
    padding: 0;
    list-style: none;
}

.cm-timeline li {
    position: relative;
    padding: 0 0 18px 24px;
    border-left: 2px solid var(--cm-soft);
    margin-left: 5px;
}

.cm-timeline li:last-child { padding-bottom: 0; border-left-color: transparent; }

.cm-timeline li::before {
    content: "";
    position: absolute;
    left: -7px;
    top: 5px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    border: 3px solid var(--color-primary);
}

.cm-timeline strong {
    display: block;
    font-size: 15.5px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--cm-ink);
}

.cm-timeline li > span {
    display: block;
    font-size: 14px;
    line-height: 1.5;
    color: var(--cm-muted);
}

.cm-timeline .cm-when {
    margin-bottom: 2px;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--color-primary);
}

/* ---------- Results ---------- */

.beauty-text {
    max-width: 54ch;
    font-size: 16px !important;
    line-height: 1.75 !important;
    color: var(--cm-text) !important;
}

/* ---------- Booking ---------- */

.booking-wrapper {
    border-radius: 28px;
    border: 1px solid var(--cm-line);
    box-shadow: var(--cm-shadow);
    align-items: center;
}

.booking-content .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    letter-spacing: 0.16em;
}

.booking-content .eyebrow::before {
    content: "";
    width: 22px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
}

.booking-text { color: var(--cm-text); line-height: 1.65; }

.booking-form {
    border-radius: 22px;
    background: var(--cm-tint);
    box-shadow: inset 0 0 0 1px var(--cm-line);
}

.form-field input,
.form-field select {
    min-height: 50px;
    border-radius: 12px !important;
    border: 1px solid var(--cm-line) !important;
    background: #fff;
    font-family: "Poppins", sans-serif;
    font-size: 16px;
}

.form-field input:focus,
.form-field select:focus {
    outline: none;
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 4px rgba(19, 119, 123, 0.14);
}

.booking-submit { min-height: 52px; }

.cm-quick {
    display: grid;
    gap: 12px;
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
    max-width: 440px;
}

.cm-quick a {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    border: 1px solid var(--cm-line);
    border-radius: 16px;
    background: #fff;
    color: var(--cm-muted);
    font-size: 14px;
    line-height: 1.45;
    text-decoration: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.cm-quick a:hover { border-color: rgba(19, 119, 123, 0.45); box-shadow: var(--cm-shadow); }

.cm-quick strong {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: var(--cm-ink);
}

.cm-quick-icon svg { width: 20px; height: 20px; }

/* ---------- Testimonials ---------- */

.testimonials-section .testimonial-card {
    position: relative;
    display: flex;
    flex-direction: column;
    height: auto;
    min-height: 220px;
    padding: 56px 28px 26px;
    border: 1px solid var(--cm-line);
    border-radius: 20px;
    background: #fff;
    box-shadow: var(--cm-shadow);
}

.testimonials-section .testimonial-card::before {
    content: "\201C";
    position: absolute;
    top: 14px;
    left: 26px;
    font: 700 54px/1 Georgia, "Times New Roman", serif;
    color: rgba(19, 119, 123, 0.35);
}

.testimonials-section .testimonial-text {
    order: 1;
    margin: 0 0 18px;
    font-size: 16px;
    line-height: 1.65;
    color: var(--cm-text);
}

.testimonials-section .testimonial-author {
    order: 2;
    margin: auto 0 0;
    padding-top: 14px;
    border-top: 1px solid var(--cm-line);
    font-size: 15px;
    font-weight: 600;
    color: var(--cm-ink);
}

@media (min-width: 768px) {
    .testimonials-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        overflow: visible;
        padding-bottom: 8px;
    }

    .testimonials-section .testimonial-card { max-width: none; }
}

/* ---------- Tablet ---------- */

@media (max-width: 1024px) {
    .cm-split { gap: 36px; }
    .cm-doctor-body { padding: 36px; }
    .cm-highlights { grid-template-columns: 1fr; }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .nav-links { gap: 16px; }
    .nav-link { font-size: 15px; }
}

/* ---------- Phones ---------- */

@media (max-width: 767px) {
    .cm-section { padding: 48px 0; }
    .cm-section + .cm-section { padding-top: 8px; }

    .cm-title { font-size: clamp(30px, 8.6vw, 38px); }
    .cm-lead { font-size: 16px; }

    .cm-split { grid-template-columns: 1fr; gap: 28px; }

    .cm-media .about-clinic-image-container {
        height: auto;
        aspect-ratio: 4 / 3;
        border-radius: 20px;
    }

    .cm-actions { gap: 10px; }
    .cm-actions .cm-btn { flex: 1 1 auto; }

    .cm-doctor-card { grid-template-columns: 1fr; border-radius: 22px; }
    .cm-doctor-photo { min-height: 0; aspect-ratio: 4 / 3; }
    .cm-doctor-body { padding: 28px 22px; }
    .cm-role { font-size: 16px; }

    .cm-cv { grid-template-columns: 1fr; gap: 16px; }
    .cm-cv-col { padding: 26px 22px; border-radius: 20px; }

    .testimonials-section .cm-eyebrow { display: none; }
    .testimonials-section .testimonial-card { min-height: 200px; padding: 50px 22px 22px; }

    .cm-quick { max-width: none; }
}

/* ---------- Header ---------- */

@media (min-width: 1025px) {
    .nav-links { gap: 40px; }
    .nav-link { font-size: 17px; }
}

@media (min-width: 768px) {
    .nav-link {
        position: relative;
        color: var(--cm-ink);
    }

    .nav-link::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -6px;
        height: 2px;
        border-radius: 2px;
        background: var(--color-primary);
        transform: scaleX(0);
        transition: transform 0.2s ease;
    }

    .nav-link:hover::after { transform: scaleX(1); }

    .nav-cta {
        border-radius: 999px;
        padding: 10px 22px;
        font-size: 16px;
        font-weight: 600;
    }
}

/* Mobile: keep the two-tone titles one size, avoid doubled headings */
@media (max-width: 767px) {
    .cm-title .text-green { font-size: inherit !important; font-weight: inherit !important; }
    .beauty-left .cm-eyebrow { display: none; }
}

/* Tablet: photo on top so the portrait is never cropped to a sliver */
@media (min-width: 768px) and (max-width: 1024px) {
    .cm-doctor-card { grid-template-columns: 1fr; }
    .cm-doctor-photo { min-height: 0; aspect-ratio: 16 / 9; }
    .cm-doctor-photo img { object-position: 64% 28%; }
    .cm-highlights { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* =====================================================================
   One type scale and one palette for the whole site (refresh 4)
   Scale: 44 titles, 22 card titles, 17 lead, 16 body, 15 labels,
          14 details, 13 eyebrows and tags. One family: Poppins.
   Palette: ink headings, slate text, grey details, one teal accent,
            cool off-white page, white cards, teal feature blocks.
   ===================================================================== */

:root {
    --color-background: #f4f7f7;
    --fs-h2: clamp(32px, 3.4vw, 44px);
    --fs-h3: 22px;
    --fs-lead: 17px;
    --fs-body: 16px;
    --fs-label: 15px;
    --fs-detail: 14px;
    --fs-tag: 13px;
}

body { background-color: var(--color-background); color: var(--cm-text); }

body,
button,
input,
select,
textarea,
.stat-number,
.stat-number1,
.stat-description,
.hero-label-left,
.hero-label-center,
.hero-label-right {
    font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

/* Titles: same size, weight and colours everywhere, both tones identical in size */
.section-title,
.section-title1,
.cm-title,
.why-us-title,
.why-us-title-mobile {
    font-size: var(--fs-h2) !important;
    font-weight: 600 !important;
    line-height: 1.12 !important;
    letter-spacing: -0.02em;
}

.section-title,
.section-title1,
.cm-title { color: var(--cm-ink) !important; }

.section-title .text-green,
.section-title1 .text-green,
.cm-title .text-green,
.why-us-title .text-green {
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    color: var(--color-primary) !important;
}

/* Card and item titles */
.service-title { font-size: var(--fs-h3) !important; font-weight: 600 !important; color: var(--cm-ink) !important; }
.stat-label { font-size: 17px; font-weight: 600; }
.testimonial-author,
.cm-facts strong,
.cm-highlights strong,
.cm-timeline strong,
.cm-quick strong { font-size: var(--fs-label) !important; font-weight: 600 !important; color: var(--cm-ink) !important; }

/* Paragraphs */
.cm-lead,
.services-subtitle,
.booking-text,
.beauty-text,
.hero-description { font-size: var(--fs-lead) !important; line-height: 1.7 !important; }

.cm-lead,
.services-subtitle,
.booking-text,
.beauty-text { color: var(--cm-text) !important; }

.service-description,
.testimonial-text,
.stat-description { font-size: var(--fs-body) !important; line-height: 1.65 !important; }

.service-description,
.testimonial-text { color: var(--cm-text) !important; }

/* Details, meta and tags */
.cm-facts li,
.cm-highlights li > span:last-child,
.cm-timeline li > span,
.cm-quick a,
.cm-chips li,
.booking-hint,
.field-optional { font-size: var(--fs-detail) !important; color: var(--cm-muted) !important; }

.cm-chips li { color: var(--cm-text) !important; }

.cm-eyebrow,
.booking-content .eyebrow,
.cm-cv-title,
.service-badge,
.cm-timeline .cm-when { font-size: var(--fs-tag) !important; }

.form-field label { font-size: var(--fs-label) !important; font-weight: 600; color: var(--cm-ink) !important; }

.cm-role { color: var(--color-primary) !important; }

/* Leftover pure blacks and greys move onto the palette */
.hero-label-left,
.hero-label-right,
.hero-mobile-title,
.nav-link { color: var(--cm-ink) !important; }

.hero-label-left,
.hero-label-center,
.hero-label-right { font-size: 15px !important; font-weight: 600 !important; letter-spacing: 0.18em; }

.about-video-label { color: var(--cm-ink); }
.about-video-time { color: var(--cm-muted); }

/* Buttons share one size */
.btn-primary,
.btn-white,
.cm-btn,
.question-card-btn,
.mobile-qa-btn,
.mobile-book-btn { font-size: var(--fs-label) !important; font-weight: 600 !important; }

/* Why us: numbers in the site font, calmer weight */
.stat-number,
.stat-number1 { font-weight: 500 !important; letter-spacing: -0.02em; }

/* ---------- Hero contact card: shows where each option goes ---------- */

.hero-question-card { gap: 10px; }

.question-card-contacts {
    width: 272px;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 2px;
    padding: 8px;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(2, 12, 27, 0.14);
}

.qc-link {
    flex-direction: row;
    align-items: center;
    gap: 12px;
    padding: 8px 10px;
    border-radius: 12px;
    color: var(--cm-ink);
    transition: background-color 0.2s ease;
}

.qc-link:hover,
.qc-link:focus-visible { background: var(--cm-tint); }

.qc-link svg:not(.qc-chevron) {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    padding: 9px;
    border-radius: 10px;
    background: var(--cm-soft);
    color: var(--color-primary);
}

.qc-link:hover svg:not(.qc-chevron),
.qc-link:focus-visible svg:not(.qc-chevron) { transform: none; }

.qc-text { display: flex; flex-direction: column; min-width: 0; text-align: left; }
.qc-label { font-size: 12px; font-weight: 500; line-height: 1.2; color: var(--cm-muted); }
.qc-value { font-size: 14.5px; font-weight: 600; line-height: 1.35; color: var(--cm-ink); white-space: nowrap; }

.qc-chevron {
    width: 16px;
    height: 16px;
    margin-left: auto;
    padding: 0;
    background: none;
    color: var(--cm-muted);
}

.question-card-btn {
    width: 272px;
    height: 48px;
    border-radius: 999px;
    box-shadow: 0 12px 30px rgba(2, 12, 27, 0.14);
}

/* ---------- Phones: same headings as desktop, same scale ---------- */

@media (max-width: 767px) {
    :root {
        --fs-h2: 32px;
        --fs-h3: 20px;
        --fs-lead: 16px;
        --fs-body: 15.5px;
    }

    /* Services: show the real title instead of the "All" pseudo heading */
    .services-title-container .section-title {
        font-size: var(--fs-h2) !important;
        line-height: 1.12 !important;
        margin-bottom: 8px !important;
    }

    .services-title-container .section-title::before { content: none !important; }
    .services-title-container .section-title .text-green { display: inline !important; }

    /* Testimonials and results: one heading, the real one */
    .testimonials-section::before,
    .beauty-left::before { content: none !important; display: none !important; }

    .testimonials-section .section-title,
    .beauty-left .section-title,
    .beauty-left .section-title1 { display: block !important; }

    .testimonials-section .cm-eyebrow,
    .beauty-left .cm-eyebrow { display: inline-flex !important; }

    .why-us-title-mobile { color: #fff !important; }

    /* Booking title was 22px on phones */
    .booking-content .section-title { margin-bottom: 12px !important; }

    /* Why us numbers */
    .stat-number,
    .stat-number1::before { font-size: 40px !important; font-weight: 500 !important; }
    .stat-label { font-size: 14px !important; font-weight: 500 !important; color: var(--cm-ink) !important; }

    /* Small print that was too small */
    .ba-label { font-size: 12px !important; }
    .footer-hours { font-size: 14px !important; }
    .footer-bottom p,
    .footer p { font-size: 13px; }
}

.footer-heading,
.footer-heading-company { font-size: 17px !important; }
.cm-photo-tag { font-size: var(--fs-tag); }

@media (max-width: 767px) {
    .services-title-container .section-title .text-green { font-size: inherit !important; }
    .hero-mobile-title { font-size: 32px !important; line-height: 1.15 !important; }
}

.qc-link svg.qc-chevron {
    width: 16px;
    height: 16px;
    padding: 0;
    border-radius: 0;
    background: none;
    color: var(--cm-muted);
}

.qc-link:hover svg.qc-chevron { background: none; color: var(--color-primary); transform: translateX(2px); }

.question-card-contacts,
.question-card-btn { width: 292px; }
.qc-value { font-size: 14px; }

/* Tablet: narrower contact card so it clears the portrait */
@media (min-width: 768px) and (max-width: 1100px) {
    .question-card-contacts,
    .question-card-btn { width: 226px; }
    .qc-link { gap: 9px; padding: 7px 6px; }
    .qc-link svg:not(.qc-chevron) { width: 32px; height: 32px; padding: 7px; }
    .qc-link svg.qc-chevron { display: none; }
    .qc-value { font-size: 13px; }
}

.cm-doctor-body .cm-lead { margin-bottom: 14px; }
.cm-doctor-body .cm-lead + .cm-highlights { margin-top: 22px; }

/* Doctor highlights sit in their own row under the card */
.cm-highlights-row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 24px 0 0;
}

.cm-highlights-row li {
    padding: 20px;
    border-radius: 20px;
    background: #fff;
    box-shadow: var(--cm-shadow);
}

.cm-doctor-body .cm-chips { margin-top: 20px; }

@media (max-width: 1024px) {
    .cm-highlights-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
    .cm-highlights-row { grid-template-columns: 1fr; margin-top: 16px; }
    .cm-highlights-row li { padding: 16px; border-radius: 16px; }
}

@media (min-width: 1025px) {
    .cm-doctor-photo img { object-position: 42% 20%; }
}