/* Unified heading system: one colour on light backgrounds, one on dark, and a
   short weight scale. Sizes stay with each component.
   `html:not(#h)` only lifts specificity above the older #id-scoped overrides. */
:root {
    --heading-color: #92264a;
    --heading-color-on-dark: #ffffff;
    --eyebrow-color-on-dark: #ffd3e0;
    --heading-weight-eyebrow: 500;
    --heading-weight: 600;
    --heading-weight-strong: 700;
}

/* ---------- Light backgrounds ---------- */
html:not(#h) body :is(
    .text-block__big-title,
    .text-carousel-block__big-title,
    .card-carousel-block__big-title,
    .icon-carousel-block__big-title,
    .medical-technologies-block__big-title,
    .our-centers__big-title,
    .why-acibadem__title,
    .centers-directory__heading h2,
    .package-block__title,
    .package-block__title span,
    .text-two-block__title,
    .form-1__title,
    .doctor-detail-page__cv-title,
    .doctor-detail-page__header-title,
    .card-carousel-block__title,
    .icon-carousel-block__title,
    .medical-technologies-block__title,
    .our-centers__title,
    .center-card h3,
    .package-block__sub-title,
    .home-doctors__list-button-title,
    .text-block-2__title
) {
    color: var(--heading-color);
    font-weight: var(--heading-weight);
}

html:not(#h) body :is(
    .card-carousel-block__small-title,
    .icon-carousel-block__small-title,
    .medical-technologies-block__small-title,
    .our-centers__small-title,
    .centers-directory__heading > span
) {
    color: var(--heading-color);
    font-weight: var(--heading-weight-eyebrow);
}

html:not(#h) body :is(
    .package-block__sub-title strong,
    .form-1__title--bold,
    .form-2__title--bold,
    .our-centers__title strong,
    .home-doctors__list-button-title strong
) {
    color: inherit;
    font-weight: var(--heading-weight-strong);
}

html:not(#h) body .package-block__title span { color: var(--heading-color); font-weight: var(--heading-weight); }

/* Step labels: light on the pink panel, themed colour once the panel is light (self-exam). */
html:not(#h) body .text-carousel-block__sub-title {
    color: var(--heading-color);
    font-weight: var(--heading-weight);
}
html:not(#h) body .text-carousel-block:not(.self-exam) .text-carousel-block__sub-title,
html:not(#h) body .text-two-block:not(.breast-guidance) .text-two-block__left .text-two-block__title {
    color: var(--heading-color-on-dark);
}

/* ---------- Dark backgrounds ---------- */
html:not(#h) body :is(
    .videos__big-title,
    .form-2__main-title,
    .form-2__sub-title,
    .hero__title,
    .hero__title strong,
    .full-video-autoplay-component__main-title,
    .home-doctors__titles .home-doctors__main-title,
    .home-doctors__titles .home-doctors__sub-title
) {
    color: var(--heading-color-on-dark);
}

html:not(#h) body :is(
    .videos__big-title,
    .full-video-autoplay-component__main-title,
    .home-doctors__titles .home-doctors__main-title
) {
    font-weight: var(--heading-weight);
}

html:not(#h) body .videos__small-title {
    color: var(--eyebrow-color-on-dark);
    font-weight: var(--heading-weight-eyebrow);
}

html:not(#h) body .hero__title { font-weight: var(--heading-weight); }
html:not(#h) body .hero__title strong { font-weight: var(--heading-weight); }
html:not(#h) body .form-2__main-title { font-weight: var(--heading-weight-eyebrow); }
html:not(#h) body .form-2__sub-title strong,
html:not(#h) body .home-doctors__titles .home-doctors__sub-title strong { font-weight: var(--heading-weight-strong); }

/* Video accordion: rows fade from dark to light pink, so the label must flip to a dark tone. */
html:not(#h) body .videos__accordion .videos__sub-title { font-weight: var(--heading-weight); }
html:not(#h) body .videos__accordion:nth-child(n+4) :is(.videos__sub-title, .videos__doctor) {
    color: #6a1535;
}

/* Same tracking on every main title; tight negative tracking made some read heavier. */
html:not(#h) body :is(
    .text-block__big-title,
    .text-carousel-block__big-title,
    .card-carousel-block__big-title,
    .icon-carousel-block__big-title,
    .medical-technologies-block__big-title,
    .our-centers__big-title,
    .why-acibadem__title,
    .centers-directory__heading h2,
    .videos__big-title
) {
    letter-spacing: 0;
}
