/* Unified theme layer. Keep all site-wide color decisions here. */

html[data-effective-theme="light"] {
    color-scheme: light;
    --theme-bg: #fbf7ef;
    --theme-bg-gradient:
        radial-gradient(1000px 520px at 10% -10%, rgba(15, 118, 110, 0.22), transparent 55%),
        radial-gradient(860px 520px at 92% 0%, rgba(214, 163, 0, 0.18), transparent 55%),
        linear-gradient(180deg, #fbf7ef 0%, #ffffff 40%, #fbf7ef 100%);
    --theme-section: #fbf7ef;
    --theme-surface: #ffffff;
    --theme-surface-muted: #f6fbf8;
    --theme-surface-strong: #eef7f4;
    --theme-text: #0f172a;
    --theme-text-muted: #475569;
    --theme-text-soft: #64748b;
    --theme-heading: #071a2e;
    --theme-primary: #0f766e;
    --theme-primary-dark: #064e3b;
    --theme-primary-soft: rgba(15, 118, 110, 0.1);
    --theme-accent: #d6a300;
    --theme-accent-soft: #fff3c4;
    --theme-border: rgba(15, 118, 110, 0.18);
    --theme-border-strong: rgba(15, 118, 110, 0.3);
    --theme-shadow-sm: 0 2px 10px rgba(2, 6, 23, 0.08);
    --theme-shadow-md: 0 10px 30px rgba(2, 6, 23, 0.08);
    --theme-shadow-lg: 0 18px 50px rgba(2, 6, 23, 0.12);
    --theme-hero:
        radial-gradient(720px 420px at 78% 16%, rgba(214, 163, 0, 0.2), transparent 58%),
        radial-gradient(820px 520px at 12% 0%, rgba(255, 255, 255, 0.14), transparent 58%),
        linear-gradient(135deg, #052e2a 0%, #0f766e 54%, #064e3b 100%);

    --color-bg: var(--theme-bg) !important;
    --color-surface: var(--theme-surface) !important;
    --color-surface-muted: var(--theme-surface-muted) !important;
    --color-primary-light: #e7f5f1 !important;
    --color-text: var(--theme-text) !important;
    --color-text-muted: var(--theme-text-muted) !important;
    --color-text-soft: var(--theme-text-soft) !important;
    --color-border: var(--theme-border) !important;
    --color-border-strong: var(--theme-border-strong) !important;
    --card-bg: var(--theme-surface) !important;
    --card-muted-bg: var(--theme-surface-muted) !important;
    --menu-bg: rgba(255, 255, 255, 0.94) !important;
    --menu-border: var(--theme-border) !important;
    --shadow-sm: var(--theme-shadow-sm) !important;
    --shadow-md: 0 8px 24px rgba(2, 6, 23, 0.1) !important;
    --shadow-lg: var(--theme-shadow-lg) !important;
    --text-color: var(--theme-text) !important;
    --text-secondary: var(--theme-text-muted) !important;
    --secondary-color: var(--theme-text-muted) !important;
    --text-dark: var(--theme-text) !important;
    --text-medium: var(--theme-text-muted) !important;
    --text-light: var(--theme-text-soft) !important;
    --bg-light: var(--theme-surface-muted) !important;
    --light-bg: var(--theme-bg) !important;
    --light-gray: var(--theme-surface-muted) !important;
    --white: var(--theme-surface) !important;
    --border: var(--theme-border) !important;
    --border-color: var(--theme-border) !important;
}

html[data-effective-theme="dark"] {
    color-scheme: dark;
    --theme-bg: #041a15;
    --theme-bg-gradient:
        radial-gradient(900px 520px at 10% -10%, rgba(15, 118, 110, 0.18), transparent 55%),
        radial-gradient(820px 520px at 92% 0%, rgba(214, 163, 0, 0.1), transparent 55%),
        linear-gradient(180deg, #041a15 0%, #031310 42%, #041a15 100%);
    --theme-section: #041a15;
    --theme-surface: #061f19;
    --theme-surface-muted: #0a2a23;
    --theme-surface-strong: #123a31;
    --theme-text: #e6f4f1;
    --theme-text-muted: rgba(230, 244, 241, 0.78);
    --theme-text-soft: rgba(230, 244, 241, 0.64);
    --theme-heading: #ffffff;
    --theme-primary: #9be7dc;
    --theme-primary-dark: #56cfc1;
    --theme-primary-soft: rgba(155, 231, 220, 0.1);
    --theme-accent: #f8d36b;
    --theme-accent-soft: rgba(214, 163, 0, 0.16);
    --theme-border: rgba(230, 244, 241, 0.14);
    --theme-border-strong: rgba(155, 231, 220, 0.34);
    --theme-shadow-sm: 0 10px 26px rgba(0, 0, 0, 0.24);
    --theme-shadow-md: 0 18px 44px rgba(0, 0, 0, 0.28);
    --theme-shadow-lg: 0 26px 70px rgba(0, 0, 0, 0.42);
    --theme-hero:
        radial-gradient(720px 420px at 78% 16%, rgba(214, 163, 0, 0.14), transparent 58%),
        radial-gradient(820px 520px at 12% 0%, rgba(155, 231, 220, 0.12), transparent 58%),
        linear-gradient(135deg, #031310 0%, #064e3b 54%, #052e2a 100%);

    --color-bg: var(--theme-bg) !important;
    --color-surface: var(--theme-surface) !important;
    --color-surface-muted: var(--theme-surface-muted) !important;
    --color-primary-light: var(--theme-surface-strong) !important;
    --color-text: var(--theme-text) !important;
    --color-text-muted: var(--theme-text-muted) !important;
    --color-text-soft: var(--theme-text-soft) !important;
    --color-border: var(--theme-border) !important;
    --color-border-strong: var(--theme-border-strong) !important;
    --card-bg: var(--theme-surface) !important;
    --card-muted-bg: var(--theme-surface-muted) !important;
    --menu-bg: rgba(6, 31, 25, 0.96) !important;
    --menu-border: var(--theme-border) !important;
    --shadow-sm: var(--theme-shadow-sm) !important;
    --shadow-md: var(--theme-shadow-md) !important;
    --shadow-lg: var(--theme-shadow-lg) !important;
    --text-color: var(--theme-text) !important;
    --text-secondary: var(--theme-text-muted) !important;
    --secondary-color: var(--theme-text-muted) !important;
    --text-dark: var(--theme-text) !important;
    --text-medium: var(--theme-text-muted) !important;
    --text-light: var(--theme-text-soft) !important;
    --bg-light: var(--theme-surface-muted) !important;
    --light-bg: var(--theme-bg) !important;
    --light-gray: var(--theme-surface-muted) !important;
    --white: var(--theme-surface) !important;
    --border: var(--theme-border) !important;
    --border-color: var(--theme-border) !important;
}

.theme-switcher {
    position: relative;
    display: flex;
    align-items: center;
}

.header .nav-links a,
.header .dropdown-toggle,
.theme-switcher__button {
    white-space: nowrap;
}

.theme-switcher__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 40px;
    padding: 9px 12px;
    border: 1px solid var(--theme-border);
    border-radius: 999px;
    background: var(--theme-primary-soft);
    color: inherit;
    font: inherit;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.theme-switcher__button:hover,
.theme-switcher__button:focus-visible,
.theme-switcher__button:focus-within{
    background: color-mix(in srgb, var(--theme-primary-soft), var(--theme-primary) 8%);
    border-color: var(--theme-border-strong);
    outline: none;
}

.theme-switcher__icon {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    display: block;
}

.theme-switcher__icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

.theme-switcher__label {
    display: none;
}

.theme-switcher__menu {
    position: absolute;
    right: 0;
    top: calc(100% + 10px);
    z-index: 1200;
    display: none;
    min-width: 210px;
    padding: 8px;
    border: 1px solid var(--theme-border);
    border-radius: 14px;
    background: var(--theme-surface);
    box-shadow: var(--theme-shadow-lg);
}

.theme-switcher.is-open .theme-switcher__menu {
    display: grid;
    gap: 4px;
}

.theme-switcher__option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    min-height: 40px;
    padding: 9px 10px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--theme-text);
    font: inherit;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
}

.theme-switcher__option:hover,
.theme-switcher__option:focus-visible,
.theme-switcher__option:focus-within{
    background: var(--theme-primary-soft);
    outline: none;
}

.theme-switcher__option[aria-checked="true"]::after {
    content: "✓";
    font-weight: 900;
    color: var(--theme-primary);
}

html[data-effective-theme] body {
    background: var(--theme-bg) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme][data-theme-page="home"] body {
    background: var(--theme-bg-gradient) !important;
}

html[data-effective-theme] .header,
html[data-effective-theme] header.header {
    background: color-mix(in srgb, var(--theme-surface) 90%, transparent) !important;
    border-bottom-color: var(--theme-border) !important;
    box-shadow: var(--theme-shadow-sm) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme="light"][data-theme-page="home"] .header,
html[data-effective-theme="light"][data-theme-page="home"] header.header {
    background: rgba(255, 255, 255, 0.9) !important;
    box-shadow: 0 10px 30px rgba(2, 6, 23, 0.08) !important;
}

html[data-effective-theme] .logo,
html[data-effective-theme] .logo a,
html[data-effective-theme] .nav-links a,
html[data-effective-theme] .dropdown-toggle,
html[data-effective-theme] .nav a {
    color: var(--theme-primary) !important;
}

html[data-effective-theme="light"] .nav-links a,
html[data-effective-theme="light"] .dropdown-toggle,
html[data-effective-theme="light"] .nav a {
    color: var(--theme-text) !important;
}

html[data-effective-theme] .nav-links,
html[data-effective-theme] .dropdown-content,
html[data-effective-theme] .catalog-menu {
    background: var(--menu-bg) !important;
    border-color: var(--menu-border) !important;
}

@media (min-width: 769px) {
    html[data-effective-theme] .header .nav-links,
    html[data-effective-theme] header.header .nav-links {
        background: transparent !important;
        border-color: transparent !important;
        box-shadow: none !important;
    }
}

html[data-effective-theme] :is(
    body,
    main,
    section,
    .privacy,
    .about,
    .features,
    .products,
    .certificate,
    .prices,
    .training,
    .contact,
    .popular-articles,
    .blog-container,
    .article-container,
    .article-content,
    .tag-layout,
    .tag-results
) {
    color: var(--theme-text) !important;
}

html[data-effective-theme] :is(
    .privacy,
    .about,
    .features,
    .products,
    .certificate,
    .prices,
    .training,
    .contact,
    .popular-articles,
    .blog-container,
    .article-container,
    .article-content,
    .tag-layout,
    .tag-results
) {
    background: var(--theme-bg) !important;
}

html[data-effective-theme] #main.hero,
html[data-effective-theme] .hero {
    background: var(--theme-hero) !important;
    color: #ffffff !important;
}

html[data-effective-theme] .hero :is(h1, h2, h3, h4, h5, h6, p, li, span, strong, b, .title-line, .title-line--secondary, .hero-subtitle) {
    color: #ffffff !important;
}

html[data-effective-theme] .section-header,
html[data-effective-theme] .section-title,
html[data-effective-theme] .section-description,
html[data-effective-theme] .hero-content,
html[data-effective-theme] .hero-cta,
html[data-effective-theme] .price-header,
html[data-effective-theme] .price-features,
html[data-effective-theme] .contact-text,
html[data-effective-theme] .certificate-info,
html[data-effective-theme] .blog-content,
html[data-effective-theme] .article-header,
html[data-effective-theme] .tag-results-header {
    background: transparent !important;
    background-image: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

html[data-effective-theme] :is(h1, h2, h3, h4, h5, h6, .section-title, .main-title, .blog-title, .blog-title a, .article-header h1, .related-card-title, .related-card-title a) {
    color: var(--theme-heading) !important;
    text-shadow: none !important;
}

html[data-effective-theme] :is(p, li, .section-description, .blog-excerpt, .article-meta, .article-text, .certificate-description, .contact-text p, .popular-articles__card-desc, .breadcrumbs, .breadcrumbs span) {
    color: var(--theme-text-muted) !important;
}

html[data-effective-theme] :is(a, .blog-link, .breadcrumbs a, .contact-text a, .popular-articles__link) {
    color: var(--theme-primary) !important;
    text-decoration-color: color-mix(in srgb, var(--theme-primary), transparent 45%) !important;
}

html[data-effective-theme] .section-tag {
    color: #064e3b !important;
    background: rgba(214, 163, 0, 0.18) !important;
    border: 1px solid rgba(214, 163, 0, 0.42) !important;
}

html[data-effective-theme="dark"] .section-tag {
    color: #ffffff !important;
    background: rgba(15, 118, 110, 0.32) !important;
    border-color: rgba(155, 231, 220, 0.36) !important;
}

html[data-effective-theme] .privacy {
    padding-top: clamp(36px, 5vw, 58px) !important;
    padding-bottom: clamp(30px, 4vw, 48px) !important;
}

html[data-effective-theme] .privacy + .about {
    padding-top: clamp(42px, 5vw, 68px) !important;
}

html[data-effective-theme] .privacy .section-header {
    margin-bottom: 0 !important;
}

html[data-effective-theme] :is(
    .about-card,
    .feature-card,
    .product-card,
    .training-card,
    .price-card,
    .popular-articles__card,
    .contact-item,
    .contact-form,
    .contact-map-panel,
    .contact-form-container,
    .certificate-content,
    .blog-card,
    .related-card,
    .fohow-static-related__card,
    .tag-hero,
    .tags-container,
    .no-posts,
    .search-form,
    .search-results-count,
    .catalog-search-field,
    .category-menu,
    .sorting-panel,
    .table-of-contents,
    .toc,
    .quote-block,
    .article-container blockquote,
    .comparison-table,
    .nutrition-table,
    .highlight-box,
    .feature-box,
    .application-method,
    .benefit-card,
    .benefits-list,
    .ingredients-list,
    .usage-instructions,
    .nutrition-info,
    .product-info,
    .info-card,
    .warning-box,
    .note-box,
    .notice,
    .alert-note,
    .diagram-block,
    .energy-card,
    .faq-item,
    .content-card,
    .usage-card,
    .recommendation-card,
    .composition-card,
    .internet-card,
    .internet-description,
    .recommendations,
    .intro-box,
    .intro-card,
    .stat-item,
    .stat-card,
    .chapter-card,
    .question-card,
    .success-story,
    .results-list,
    .expert-opinion,
    .article-cta,
    .result-card,
    .joint-part,
    .cause-card,
    .search-links,
    .manual-header,
    .manual-footer,
    .disclaimer-box,
    .map-fallback,
    .map-address-card,
    .contact-map-frame,
    .book-card,
    .book-stat,
    .book-toc__item,
    .book-intro,
    .gallery-item
) {
    background: var(--theme-surface) !important;
    background-image: none !important;
    border-color: var(--theme-border) !important;
    box-shadow: var(--theme-shadow-md) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme] :is(
    .about-card,
    .feature-card,
    .product-card,
    .training-card,
    .price-card,
    .popular-articles__card,
    .contact-item,
    .contact-form,
    .contact-map-panel,
    .certificate-content,
    .blog-card,
    .related-card,
    .fohow-static-related__card,
    .tag-hero,
    .table-of-contents,
    .toc,
    .quote-block,
    .comparison-table,
    .nutrition-table,
    .highlight-box,
    .feature-box,
    .warning-box,
    .note-box,
    .notice,
    .content-card,
    .article-cta,
    .map-fallback,
    .map-address-card
) :is(h1, h2, h3, h4, h5, h6, strong, b) {
    color: var(--theme-heading) !important;
}

html[data-effective-theme] :is(
    .about-card,
    .feature-card,
    .product-card,
    .training-card,
    .price-card,
    .popular-articles__card,
    .contact-item,
    .contact-form,
    .contact-map-panel,
    .certificate-content,
    .blog-card,
    .related-card,
    .fohow-static-related__card,
    .tag-hero,
    .table-of-contents,
    .toc,
    .quote-block,
    .comparison-table,
    .nutrition-table,
    .highlight-box,
    .feature-box,
    .warning-box,
    .note-box,
    .notice,
    .content-card,
    .article-cta,
    .map-fallback,
    .map-address-card
) :is(p, li, span, figcaption) {
    color: var(--theme-text-muted) !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(
    [class*="card"],
    [class*="box"],
    [class*="panel"],
    [class*="note"],
    [class*="info"],
    [class*="alert"],
    [class*="diagram"],
    [class*="energy"],
    [class*="ingredient"],
    [class*="instruction"],
    [class*="product"],
    [class*="usage"],
    [class*="result"],
    [class*="benefit"],
    [class*="expert"],
    [class*="source"],
    [class*="callout"],
    [class*="highlight"],
    [class*="disclaimer"],
    [class*="figure"],
    [class*="mission"],
    [class*="method"],
    [class*="treatment"],
    [class*="constitution"],
    [class*="comparison"],
    [class*="tip"],
    [class*="food"],
    [class*="position"],
    [class*="lead"],
    [class*="factor"],
    [class*="point"],
    [class*="meta"],
    [class*="specs"]
):not(.header):not(.nav):not(.nav-links):not(.menu-toggle):not(.dropdown-content):not(.theme-switcher):not(.theme-switcher__menu):not(.theme-switcher__option):not(.hero):not(.hero-content):not(.hero-cta):not(.section-header):not(.price-card.featured):not(.tag-current-card):not(.cta-box):not(.article-cta):not(.product-cta) {
    background: var(--theme-surface) !important;
    background-color: var(--theme-surface) !important;
    background-image: none !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme] .price-card.featured {
    background: linear-gradient(135deg, var(--theme-primary-dark), #0f766e) !important;
    background-color: var(--theme-primary-dark) !important;
    color: #ffffff !important;
}

html[data-effective-theme] .price-card.featured :is(h1, h2, h3, h4, p, li, span, .price, .price-features, .price-discount) {
    color: #ffffff !important;
}

html[data-effective-theme] .price-card .price {
    color: var(--theme-primary-dark) !important;
    text-shadow: none !important;
}

html[data-effective-theme="dark"] .price-card .price {
    color: var(--theme-primary) !important;
}

html[data-effective-theme] .primary-button,
html[data-effective-theme] .price-button,
html[data-effective-theme] .submit-button,
html[data-effective-theme] .catalog-search-submit,
html[data-effective-theme] .search-button,
html[data-effective-theme] .tag-action--primary,
html[data-effective-theme] .popular-articles__btn {
    color: #ffffff !important;
    background: linear-gradient(135deg, #0f766e, #064e3b) !important;
    border-color: var(--theme-border-strong) !important;
}

html[data-effective-theme="light"] #main.hero .primary-button {
    color: #064e3b !important;
    background: linear-gradient(135deg, #fff3c4, #d6a300) !important;
    border-color: rgba(214, 163, 0, 0.38) !important;
    box-shadow: 0 12px 28px rgba(214, 163, 0, 0.24) !important;
}

html[data-effective-theme] .secondary-button,
html[data-effective-theme] .btn-secondary,
html[data-effective-theme] .btn-outline,
html[data-effective-theme] .tag-action--secondary,
html[data-effective-theme] .tag-results-count,
html[data-effective-theme] .tag,
html[data-effective-theme] .category-btn,
html[data-effective-theme] .sort-btn {
    color: var(--theme-primary) !important;
    background: var(--theme-primary-soft) !important;
    border-color: var(--theme-border) !important;
}

html[data-effective-theme="light"] #main.hero .secondary-button {
    color: #064e3b !important;
    background: rgba(255, 255, 255, 0.82) !important;
    border-color: rgba(15, 118, 110, 0.28) !important;
}

html[data-effective-theme] .tag-current-card {
    background: linear-gradient(135deg, #064e3b, #0f766e) !important;
    background-color: #064e3b !important;
    color: #ffffff !important;
}

html[data-effective-theme] .tag-current-card * {
    color: #ffffff !important;
}

html[data-effective-theme] table,
html[data-effective-theme] thead,
html[data-effective-theme] tbody,
html[data-effective-theme] tfoot,
html[data-effective-theme] tr,
html[data-effective-theme] th,
html[data-effective-theme] td,
html[data-effective-theme] .comparison-table :is(table, thead, tbody, tfoot, tr, th, td),
html[data-effective-theme] .nutrition-table :is(table, thead, tbody, tfoot, tr, th, td),
html[data-effective-theme] .article-container table :is(thead, tbody, tfoot, tr, th, td) {
    background: var(--theme-surface) !important;
    background-color: var(--theme-surface) !important;
    background-image: none !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme] th,
html[data-effective-theme] thead,
html[data-effective-theme] .comparison-table :is(thead, th),
html[data-effective-theme] .nutrition-table :is(thead, th),
html[data-effective-theme] .article-container table :is(thead, th) {
    background: var(--theme-surface-strong) !important;
    background-color: var(--theme-surface-strong) !important;
    color: var(--theme-heading) !important;
}

html[data-effective-theme] tr:nth-child(odd) > td {
    background: var(--theme-surface-muted) !important;
    background-color: var(--theme-surface-muted) !important;
}

html[data-effective-theme] input,
html[data-effective-theme] textarea,
html[data-effective-theme] select {
    background: var(--theme-surface) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
    caret-color: var(--theme-text) !important;
}

html[data-effective-theme] input::placeholder,
html[data-effective-theme] textarea::placeholder {
    color: var(--theme-text-soft) !important;
}

html[data-effective-theme] .contact-icon,
html[data-effective-theme] .feature-icon,
html[data-effective-theme] .hero-feature i {
    color: var(--theme-primary) !important;
}

html[data-effective-theme] .contact-map,
html[data-effective-theme] .contact-map iframe,
html[data-effective-theme] .article-image,
html[data-effective-theme] .blog-image,
html[data-effective-theme] figure img,
html[data-effective-theme] .certificate-image img {
    background: #f8fafc !important;
}

/* BEM FAQ breadcrumbs: keep separators attached to their destination. */
html[data-effective-theme] body.book-bem .book-breadcrumbs {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 8px 14px !important;
    overflow: visible !important;
    white-space: normal !important;
}

html[data-effective-theme] body.book-bem .book-breadcrumbs__item {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    min-width: 0;
    white-space: nowrap;
}

html[data-effective-theme] body.book-bem .book-breadcrumbs__separator {
    color: var(--theme-text-muted);
    font-weight: 400;
}

html[data-effective-theme] body.book-bem .book-breadcrumbs__item--current {
    color: var(--theme-text);
}

@media (max-width: 480px) {
    html[data-effective-theme] body.book-bem .book-breadcrumbs {
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        align-items: flex-start !important;
        gap: 4px !important;
    }

    html[data-effective-theme] body.book-bem .book-breadcrumbs__item {
        min-height: 32px;
    }

    html[data-effective-theme] body.book-bem .book-breadcrumbs__item > a,
    html[data-effective-theme] body.book-bem .book-breadcrumbs__item > [aria-current="page"] {
        display: inline-flex !important;
        align-items: center !important;
        min-height: 44px !important;
    }

    html[data-effective-theme] body.book-bem .book-breadcrumbs__separator {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 14px;
        min-width: 14px;
        line-height: 1;
    }
}

html[data-effective-theme="dark"] .contact-map {
    background: #061f19 !important;
}

html[data-effective-theme="dark"] .contact-map [class*="-ground-pane"] {
    filter: invert(92%) hue-rotate(180deg) saturate(72%) brightness(76%) contrast(88%);
    transition: filter 0.2s ease;
}

html[data-effective-theme="dark"] .contact-map [class*="-balloon__layout"],
html[data-effective-theme="dark"] .contact-map [class*="-balloon__content"],
html[data-effective-theme="dark"] .contact-map [class*="-balloon__tail"]::after {
    background: var(--theme-surface) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme="dark"] .contact-map [class*="-balloon__content"] a {
    color: var(--theme-primary) !important;
}

html[data-effective-theme="dark"] .contact-map [class*="-balloon__close-button"] {
    filter: invert(1) brightness(1.6);
}

html[data-effective-theme] .footer {
    background: var(--theme-surface) !important;
    border-top-color: var(--theme-border) !important;
    color: var(--theme-text-muted) !important;
}

html[data-effective-theme] .footer :is(h1, h2, h3, h4, p, li, a, span) {
    color: var(--theme-text-muted) !important;
}

html[data-effective-theme] .scroll-to-top {
    background: var(--theme-primary-dark) !important;
    background-color: var(--theme-primary-dark) !important;
    color: #ffffff !important;
}

/*
 * Final theme authority.
 * Legacy article/catalog styles contain @media(prefers-color-scheme: dark)
 * rules with !important. These selectors intentionally sit at the end with
 * enough specificity so the selected theme, not the OS media query, wins.
 */
html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body {
    background-color: var(--theme-bg) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(
    .blog-card,
    .related-card,
    .related-grid .blog-card,
    .popular-articles__card,
    .contact-item,
    .contact-form,
    .contact-map-panel,
    .certificate-content,
    .highlight-box,
    .feature-box,
    .content-card,
    .tag-hero,
    .tags-container,
    .search-form,
    .catalog-disclaimer,
    .catalog-search-field,
    .article-container blockquote,
    .quote-block,
    .note-box,
    .warning-box,
    .notice,
    .map-fallback,
    .map-address-card
) {
    background: var(--theme-surface) !important;
    background-color: var(--theme-surface) !important;
    background-image: none !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
    box-shadow: var(--theme-shadow-md) !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(
    .blog-card,
    .related-card,
    .related-grid .blog-card,
    .popular-articles__card,
    .contact-item,
    .contact-form,
    .contact-map-panel,
    .certificate-content,
    .highlight-box,
    .feature-box,
    .content-card,
    .tag-hero,
    .tags-container,
    .search-form,
    .catalog-disclaimer,
    .catalog-search-field,
    .article-container blockquote,
    .quote-block,
    .note-box,
    .warning-box,
    .notice,
    .map-fallback,
    .map-address-card
) :is(h1, h2, h3, h4, h5, h6, .blog-title, .blog-title a, .related-card-title, .related-card-title a) {
    color: var(--theme-heading) !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(
    .blog-card,
    .related-card,
    .related-grid .blog-card,
    .popular-articles__card,
    .contact-item,
    .contact-form,
    .contact-map-panel,
    .certificate-content,
    .highlight-box,
    .feature-box,
    .content-card,
    .tag-hero,
    .tags-container,
    .search-form,
    .catalog-disclaimer,
    .catalog-search-field,
    .article-container blockquote,
    .quote-block,
    .note-box,
    .warning-box,
    .notice,
    .map-fallback,
    .map-address-card
) :is(p, li, span, figcaption, .blog-excerpt, .article-meta, .certificate-description, .tag-summary) {
    color: var(--theme-text-muted) !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(.blog-content, .card-content, .related-grid .blog-content, .popular-articles__card-body) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body .price-card.featured.price-card {
    background: linear-gradient(135deg, #064e3b, #0f766e) !important;
    background-color: #064e3b !important;
    background-image: linear-gradient(135deg, #064e3b, #0f766e) !important;
    border-color: rgba(155, 231, 220, 0.34) !important;
    color: #ffffff !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body .price-card.featured.price-card :is(h1, h2, h3, h4, p, li, span, strong, b, .price, .price-features, .price-discount) {
    color: #ffffff !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(
    table,
    thead,
    tbody,
    tfoot,
    tr,
    th,
    td,
    .comparison-table,
    .comparison-table table,
    .comparison-table :is(thead, tbody, tfoot, tr, th, td),
    .nutrition-table,
    .nutrition-table table,
    .nutrition-table :is(thead, tbody, tfoot, tr, th, td),
    .article-container table,
    .article-container table :is(thead, tbody, tfoot, tr, th, td),
    .article-content table,
    .article-content table :is(thead, tbody, tfoot, tr, th, td),
    .specs-table,
    .specs-table :is(thead, tbody, tfoot, tr, th, td)
) {
    background: var(--theme-surface) !important;
    background-color: var(--theme-surface) !important;
    background-image: none !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(
    thead,
    th,
    .comparison-table :is(thead, th),
    .nutrition-table :is(thead, th),
    .article-container table :is(thead, th),
    .article-content table :is(thead, th),
    .specs-table :is(thead, th)
) {
    background: var(--theme-surface-strong) !important;
    background-color: var(--theme-surface-strong) !important;
    color: var(--theme-heading) !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(
    tr:nth-child(odd),
    tr:nth-child(odd) > td,
    .comparison-table tr:nth-child(odd) > td,
    .nutrition-table tr:nth-child(odd) > td,
    .article-container table tr:nth-child(odd) > td,
    .article-content table tr:nth-child(odd) > td
) {
    background: var(--theme-surface-muted) !important;
    background-color: var(--theme-surface-muted) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(
    tr:nth-child(even),
    tr:nth-child(even) > td,
    tr:hover,
    tr:hover > td,
    .comparison-table tr:nth-child(even) > td,
    .comparison-table tr:hover > td,
    .nutrition-table tr:nth-child(even) > td,
    .nutrition-table tr:hover > td,
    .article-container table tr:nth-child(even) > td,
    .article-container table tr:hover > td,
    .article-content table tr:nth-child(even) > td,
    .article-content table tr:hover > td,
    tr:focus-within,
    tr:focus-within > td,
    .comparison-table tr:focus-within > td,
    .nutrition-table tr:focus-within > td,
    .article-container table tr:focus-within > td,
    .article-content table tr:focus-within > td
) {
    background: var(--theme-surface) !important;
    background-color: var(--theme-surface) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(input, textarea, select, .catalog-search-input, .search-input) {
    background: var(--theme-surface) !important;
    background-color: var(--theme-surface) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
    caret-color: var(--theme-text) !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(input, textarea, select, .catalog-search-input, .search-input)::placeholder {
    color: var(--theme-text-soft) !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(
    .category-btn,
    .sort-btn,
    .tag,
    .tag-action--secondary,
    .tag-results-count,
    .blog-link,
    .btn-secondary,
    .btn-outline
) {
    background: var(--theme-primary-soft) !important;
    background-color: var(--theme-primary-soft) !important;
    background-image: none !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-primary) !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(.category-menu, .sorting-panel) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(
    .category-btn.active,
    .sort-btn.active,
    .tag.active,
    .article-count,
    .tag-action--primary,
    .catalog-search-submit,
    .search-button,
    .btn,
    .btn-primary,
    .price-button,
    .product-button,
    .submit-button,
    .primary-button,
    .popular-articles__btn,
    .contact-form input[type="submit"],
    .article-container .button,
    .article-container .cta-button,
    .article-cta .button,
    .article-cta .cta-button,
    .product-cta .cta-button,
    .cta-box .cta-button,
    .fohow-disclaimer-gate__button
) {
    background: linear-gradient(135deg, #0f766e, #064e3b) !important;
    background-color: #0f766e !important;
    border-color: var(--theme-border-strong) !important;
    color: #ffffff !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(
    a.tag-action--primary,
    a.btn,
    a.btn-primary,
    a.product-button,
    a.popular-articles__btn,
    a.button,
    a.cta-button,
    button.search-button,
    button.catalog-search-submit,
    a.price-button,
    button.submit-button,
    a.primary-button,
    button.primary-button,
    .contact-form input[type="submit"],
    .fohow-disclaimer-gate__button
) {
    color: #ffffff !important;
    text-decoration-color: rgba(255, 255, 255, 0.72) !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(
    .category-btn.active,
    .sort-btn.active,
    .tag.active,
    .article-count,
    .tag-action--primary,
    .catalog-search-submit,
    .search-button,
    .btn,
    .btn-primary,
    .price-button,
    .product-button,
    .submit-button,
    .primary-button,
    .popular-articles__btn,
    .contact-form input[type="submit"],
    .article-container .button,
    .article-container .cta-button,
    .article-cta .button,
    .article-cta .cta-button,
    .product-cta .cta-button,
    .cta-box .cta-button,
    .fohow-disclaimer-gate__button
) :is(span, i, svg, path) {
    color: #ffffff !important;
    stroke: currentColor !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(
    a.tag-action--primary,
    a.btn,
    a.btn-primary,
    a.product-button,
    a.popular-articles__btn,
    a.button,
    a.cta-button,
    button.search-button,
    button.catalog-search-submit,
    a.price-button,
    button.submit-button,
    a.primary-button,
    button.primary-button,
    .contact-form input[type="submit"],
    .fohow-disclaimer-gate__button
) :is(span, i, svg, path) {
    color: inherit !important;
    stroke: currentColor !important;
}

html[data-effective-theme="light"][data-theme-page="home"][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body #main.hero .primary-button {
    background: linear-gradient(135deg, #fff3c4, #d6a300) !important;
    background-color: #fff3c4 !important;
    border-color: rgba(214, 163, 0, 0.38) !important;
    color: #052e2a !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body .tag-current-card.tag-current-card {
    background: linear-gradient(135deg, #064e3b, #0f766e) !important;
    background-color: #064e3b !important;
    background-image: linear-gradient(135deg, #064e3b, #0f766e) !important;
    color: #ffffff !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body .tag-current-card.tag-current-card * {
    color: #ffffff !important;
}

html[data-effective-theme] .contact-social,
html[data-effective-theme] .contact-social-link,
html[data-effective-theme] .contact-social-copy,
html[data-effective-theme] .contact-social-label,
html[data-effective-theme] .contact-social-title {
    font-family: var(--font-main, "IBM Plex Sans", system-ui, Arial, sans-serif) !important;
    font-size: inherit !important;
    font-weight: 400 !important;
    line-height: inherit !important;
    letter-spacing: 0 !important;
}

html[data-effective-theme] .contact-social {
    margin-top: 10px !important;
    margin-bottom: 0 !important;
}

html[data-effective-theme] .contact-social-link {
    display: inline-grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 8px !important;
    color: var(--theme-text-muted) !important;
    text-decoration: none !important;
}

html[data-effective-theme] .contact-social-link i {
    width: 1.1em !important;
    margin-top: 0.18em !important;
    color: var(--theme-primary) !important;
}

html[data-effective-theme] .contact-social-copy {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
}

html[data-effective-theme] .contact-social-label,
html[data-effective-theme] .contact-social-title {
    color: var(--theme-text-muted) !important;
    font-size: inherit !important;
    font-weight: 400 !important;
}

html[data-effective-theme] .related-grid .blog-card > .related-article {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    min-height: 100% !important;
}

html[data-effective-theme] .related-grid .blog-card > .related-article > a,
html[data-effective-theme] .related-grid .blog-card > a:not(.blog-link) {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    min-height: 100% !important;
    color: inherit !important;
    text-decoration: none !important;
}

html[data-effective-theme] .related-grid .blog-card > .related-article > a:hover,
html[data-effective-theme] .related-grid .blog-card > .related-article > a:focus-visible,
html[data-effective-theme] .related-grid .blog-card > a:not(.blog-link):hover,
html[data-effective-theme] .related-grid .blog-card > a:not(.blog-link):focus-visible,
html[data-effective-theme] .related-grid .blog-card > .related-article > a:focus-within,
html[data-effective-theme] .related-grid .blog-card > a:not(.blog-link):focus-within{
    color: inherit !important;
    text-decoration: none !important;
}

html[data-effective-theme] .related-grid .blog-card > .related-article > a > h3,
html[data-effective-theme] .related-grid .blog-card > a:not(.blog-link) > h3 {
    margin: 0 !important;
    padding: clamp(18px, 2.2vw, 24px) clamp(18px, 2.2vw, 24px) 14px !important;
    color: var(--theme-heading) !important;
    font-family: var(--font-heading, Georgia, serif) !important;
    font-size: var(--h3-size, 22px) !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
}

html[data-effective-theme] .related-grid .blog-card > .related-article > a::after,
html[data-effective-theme] .related-grid .blog-card > a:not(.blog-link)::after {
    content: "Читать далее \2192";
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 38px !important;
    margin: auto clamp(18px, 2.2vw, 24px) clamp(18px, 2.2vw, 24px) !important;
    padding: 9px 14px !important;
    border: 1px solid var(--theme-border) !important;
    border-radius: 10px !important;
    background: var(--theme-primary-soft) !important;
    color: var(--theme-primary) !important;
    font-family: var(--font-main, "IBM Plex Sans", system-ui, Arial, sans-serif) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-align: center !important;
    text-decoration: none !important;
}

html[data-effective-theme] .related-articles:has(.related-grid:empty),
html[data-effective-theme] .related-articles:has(.related-grid:not(:has(.blog-card, .related-card, .fohow-static-related__card, a, img))) {
    display: none !important;
}

/* Global card image safety.
   Article previews often use source images with readable text, so cards must
   preserve the whole image instead of cropping it with cover or hover zoom. */
html body .blog-card .blog-image,
html body .blog-card img.blog-image,
html body .related-grid .blog-card .blog-image,
html body .related-grid .blog-card img.blog-image,
html body .related-card img,
html body .fohow-static-related__card img,
html body .product-card .product-image img,
html body .product-card img,
html body .popular-articles__card img,
html body .about-card img,
html body .feature-card img,
html body .training-card img,
html body .price-card img {
    object-fit: contain !important;
    object-position: center !important;
}

html body .blog-card:hover .blog-image,
html body .blog-card:focus-within .blog-image,
html body .blog-card:hover img.blog-image,
html body .blog-card:focus-within img.blog-image,
html body .related-card:hover img,
html body .related-card:focus-within img,
html body .fohow-static-related__card:hover img,
html body .fohow-static-related__card:focus-visible img,
html body .product-card:hover .product-image img,
html body .product-card:focus-within .product-image img,
html body .product-card:hover img,
html body .product-card:focus-within img,
html body .popular-articles__card:hover img,
html body .popular-articles__card:focus-within img,
html body .about-card:hover img,
html body .about-card:focus-within img,
html body .feature-card:hover img,
html body .feature-card:focus-within img,
html body .training-card:hover img,
html body .training-card:focus-within img,
html body .price-card:hover img,
html body .price-card:focus-within img,
html body .blog-card:focus-within .blog-image,
html body .blog-card:focus-within img.blog-image,
html body .related-card:focus-within img,
html body .fohow-static-related__card:focus-within img,
html body .product-card:focus-within .product-image img,
html body .product-card:focus-within img,
html body .popular-articles__card:focus-within img,
html body .about-card:focus-within img,
html body .feature-card:focus-within img,
html body .training-card:focus-within img,
html body .price-card:focus-within img{
    transform: none !important;
}

@media (max-width: 768px) {
    .theme-switcher {
        width: 100%;
        justify-content: center;
    }

    .theme-switcher__button {
        width: 100%;
        max-width: 260px;
    }

    .theme-switcher__label {
        display: inline;
    }

    .theme-switcher__menu {
        position: static;
        width: min(100%, 260px);
        margin-top: 8px;
    }

    .theme-switcher.is-open {
        flex-direction: column;
    }
}

/* Article template contrast guard for dark theme.
   These templates keep some light gradients in their own CSS; the theme layer
   owns the final surface/text colors so the copy never disappears. */
html[data-effective-theme="dark"] body.meridian-guide {
    --guide-bg: var(--theme-bg) !important;
    --guide-surface: var(--theme-surface) !important;
    --guide-ink: var(--theme-heading) !important;
    --guide-text: var(--theme-text-muted) !important;
    --guide-muted: var(--theme-text-soft) !important;
    --guide-border: var(--theme-border) !important;
    --guide-shadow: var(--theme-shadow-md) !important;
    --guide-accent: var(--theme-primary-dark) !important;
    --guide-accent-strong: var(--theme-primary) !important;
    --guide-accent-soft: var(--theme-primary-soft) !important;
    --guide-gold: var(--theme-accent) !important;
    --guide-gold-soft: var(--theme-accent-soft) !important;
    background: var(--theme-bg-gradient) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme="dark"] body.meridian-guide :is(
    .meridian-guide__hero-copy,
    .meridian-guide__hero-visual,
    .meridian-guide__panel,
    .meridian-guide__chapter-card,
    .meridian-guide__section-card,
    .meridian-guide__table-card,
    .meridian-guide__callout,
    .meridian-guide__gallery-card,
    .meridian-guide__stat,
    .meridian-guide__toc-box,
    .meridian-guide__figure-card,
    .meridian-guide__fact-card,
    .meridian-guide__key-card,
    .meridian-guide__nav-btn,
    .bem-guide__prep-card,
    .bem-guide__care-card,
    .bem-guide__zone-figure,
    .bem-guide__slide-card,
    .bem-guide__step-visual,
    .bem-guide__step-legend,
    .bem-guide__translated-note,
    .tongue-guide__hero-visual,
    .tongue-guide__image-card,
    .tongue-guide__list-card,
    .tongue-guide__mini-card,
    .tongue-guide__vein-card,
    .tongue-guide__quote,
    .tongue-guide__note,
    .tongue-guide__warning,
    .training-guide__hero-visual,
    .training-guide__program-card,
    .training-guide__comparison-card,
    .training-guide__feature-card,
    .training-guide__routine-card,
    .training-guide__dosage-card,
    .training-guide__constitution-card,
    .training-guide__technique-card,
    .training-guide__list-card,
    .training-guide__image-card,
    .training-guide__ingredient-card,
    .training-guide__protocol,
    .training-guide__quote,
    .training-guide__note,
    .training-guide__warning
) {
    background: var(--theme-surface) !important;
    background-color: var(--theme-surface) !important;
    background-image: none !important;
    border-color: var(--theme-border) !important;
    box-shadow: var(--theme-shadow-md) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme="dark"] body.meridian-guide .training-guide__protocol-grid > div {
    background: var(--theme-surface-muted) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme="dark"] body.meridian-guide :is(
    .meridian-guide__hero-copy,
    .meridian-guide__hero-visual,
    .meridian-guide__panel,
    .meridian-guide__chapter-card,
    .meridian-guide__section-card,
    .meridian-guide__table-card,
    .meridian-guide__callout,
    .meridian-guide__gallery-card,
    .meridian-guide__stat,
    .meridian-guide__toc-box,
    .meridian-guide__figure-card,
    .meridian-guide__fact-card,
    .meridian-guide__key-card,
    .bem-guide__prep-card,
    .bem-guide__care-card,
    .bem-guide__zone-figure,
    .bem-guide__slide-card,
    .bem-guide__step-visual,
    .tongue-guide__hero-visual,
    .tongue-guide__image-card,
    .tongue-guide__list-card,
    .tongue-guide__mini-card,
    .tongue-guide__vein-card,
    .training-guide__hero-visual,
    .training-guide__program-card,
    .training-guide__comparison-card,
    .training-guide__feature-card,
    .training-guide__routine-card,
    .training-guide__dosage-card,
    .training-guide__constitution-card,
    .training-guide__technique-card,
    .training-guide__list-card,
    .training-guide__image-card,
    .training-guide__ingredient-card,
    .training-guide__protocol
) :is(h1, h2, h3, h4, h5, h6, strong, b) {
    color: var(--theme-heading) !important;
}

html[data-effective-theme="dark"] body.meridian-guide :is(
    .meridian-guide__hero-copy,
    .meridian-guide__hero-visual,
    .meridian-guide__panel,
    .meridian-guide__chapter-card,
    .meridian-guide__section-card,
    .meridian-guide__table-card,
    .meridian-guide__callout,
    .meridian-guide__gallery-card,
    .meridian-guide__stat,
    .meridian-guide__toc-box,
    .meridian-guide__figure-card,
    .meridian-guide__fact-card,
    .meridian-guide__key-card,
    .bem-guide__prep-card,
    .bem-guide__care-card,
    .bem-guide__zone-figure,
    .bem-guide__slide-card,
    .bem-guide__step-visual,
    .bem-guide__step-legend,
    .bem-guide__translated-note,
    .tongue-guide__hero-visual,
    .tongue-guide__image-card,
    .tongue-guide__list-card,
    .tongue-guide__mini-card,
    .tongue-guide__vein-card,
    .tongue-guide__quote,
    .tongue-guide__note,
    .tongue-guide__warning,
    .training-guide__hero-visual,
    .training-guide__program-card,
    .training-guide__comparison-card,
    .training-guide__feature-card,
    .training-guide__routine-card,
    .training-guide__dosage-card,
    .training-guide__constitution-card,
    .training-guide__technique-card,
    .training-guide__list-card,
    .training-guide__image-card,
    .training-guide__ingredient-card,
    .training-guide__protocol,
    .training-guide__quote,
    .training-guide__note,
    .training-guide__warning
) :is(p, li, span, figcaption, small) {
    color: var(--theme-text-muted) !important;
}

html[data-effective-theme="dark"] body.meridian-guide :is(
    .meridian-guide__eyebrow,
    .meridian-guide__chapter-chip,
    .bem-guide__step-chip,
    .tongue-guide__eyebrow,
    .tongue-guide__chip-list li,
    .training-guide__comparison-kicker,
    .training-guide__pill-list li,
    .training-guide__chip-list li
) {
    background: var(--theme-primary-soft) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-primary) !important;
}

html[data-effective-theme="dark"] body.meridian-guide .training-guide__protocol > summary::after {
    background: var(--theme-primary-soft) !important;
    color: var(--theme-primary) !important;
}

html[data-effective-theme="dark"] body.meridian-guide :is(
    .meridian-guide__toc-box a,
    .meridian-guide__search-links a,
    .meridian-guide__nav-btn strong,
    .meridian-guide__stat strong,
    .meridian-guide__chapter-arrow,
    .tongue-guide__quote strong,
    .training-guide__quote strong,
    .training-guide__constitution-card strong
) {
    color: var(--theme-primary) !important;
}

html[data-effective-theme="dark"] body.meridian-guide :is(
    .meridian-guide__table,
    .meridian-guide__table tr,
    .meridian-guide__table td
) {
    background: var(--theme-surface) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text-muted) !important;
}

html[data-effective-theme="dark"] body.meridian-guide .meridian-guide__table th {
    background: var(--theme-surface-strong) !important;
    color: var(--theme-heading) !important;
}

html[data-effective-theme="dark"] body.meridian-guide .meridian-guide__table tr:nth-child(even) td {
    background: var(--theme-surface-muted) !important;
}

html[data-effective-theme="dark"] body.batl-body {
    --batl-bg: var(--theme-bg) !important;
    --batl-surface: var(--theme-surface) !important;
    --batl-surface-soft: var(--theme-surface-muted) !important;
    --batl-ink: var(--theme-heading) !important;
    --batl-muted: var(--theme-text-muted) !important;
    --batl-border: var(--theme-border) !important;
    --batl-shadow: var(--theme-shadow-md) !important;
    background: var(--theme-bg-gradient) !important;
}

html[data-effective-theme="dark"] body.manual-body :is(
    .hero-copy.panel,
    .hero-media.panel,
    .part-hero.panel,
    .intro-card,
    .section-card,
    .feature-card,
    .question-card,
    .related-card,
    .component-card,
    .mini-card,
    .stat-card,
    .chapter-card,
    .note-box,
    .disclaimer-box,
    .nav-btn
) {
    background: var(--theme-surface) !important;
    border-color: var(--theme-border) !important;
    box-shadow: var(--theme-shadow-md) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme="dark"] body.manual-body :is(
    .hero-copy.panel,
    .hero-media.panel,
    .part-hero.panel,
    .intro-card,
    .section-card,
    .feature-card,
    .question-card,
    .related-card,
    .component-card,
    .mini-card,
    .stat-card,
    .chapter-card,
    .note-box,
    .disclaimer-box,
    .nav-btn
) :is(h1, h2, h3, h4, strong, b) {
    color: var(--theme-heading) !important;
}

html[data-effective-theme="dark"] body.manual-body :is(
    .hero-copy.panel,
    .hero-media.panel,
    .part-hero.panel,
    .intro-card,
    .section-card,
    .feature-card,
    .question-card,
    .related-card,
    .component-card,
    .mini-card,
    .stat-card,
    .chapter-card,
    .note-box,
    .disclaimer-box,
    .nav-btn
) :is(p, li, span, small, figcaption) {
    color: var(--theme-text-muted) !important;
}

html[data-effective-theme="dark"] body.manual-body :is(
    .eyebrow,
    .part-meta,
    .hero-pill,
    .inline-pill
) {
    background: var(--theme-primary-soft) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-primary) !important;
}

html[data-effective-theme="dark"] body.manual-body :is(
    .stat-value,
    .chapter-meta,
    .related-card span,
    .nav-btn strong,
    .manual-link,
    .breadcrumb a,
    .fohow-breadcrumbs a
) {
    color: var(--theme-primary) !important;
}

html[data-effective-theme="dark"] body.batl-body :is(
    .batl-panel,
    .batl-card,
    .batl-related-card,
    .batl-faq-item,
    .batl-stage-card,
    .batl-stage-frame,
    .batl-mobile-sheet,
    .batl-detail-panel
) {
    background: var(--theme-surface) !important;
    border-color: var(--theme-border) !important;
    box-shadow: var(--theme-shadow-md) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme="dark"] body.batl-body :is(
    .batl-panel,
    .batl-card,
    .batl-related-card,
    .batl-faq-item,
    .batl-stage-card,
    .batl-stage-frame,
    .batl-mobile-sheet,
    .batl-detail-panel
) :is(h1, h2, h3, h4, strong, b) {
    color: var(--theme-heading) !important;
}

html[data-effective-theme="dark"] body.batl-body :is(
    .batl-panel,
    .batl-card,
    .batl-related-card,
    .batl-faq-item,
    .batl-stage-card,
    .batl-stage-frame,
    .batl-mobile-sheet,
    .batl-detail-panel
) :is(p, li, span, small, figcaption) {
    color: var(--theme-text-muted) !important;
}

html[data-effective-theme="dark"] body.batl-body :is(
    .batl-eyebrow,
    .batl-pill,
    .batl-detail-kicker,
    .batl-meta-pill,
    .batl-tab,
    .batl-ghost-btn,
    .batl-link-btn
) {
    background: var(--theme-primary-soft) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-primary) !important;
}

html[data-effective-theme="dark"] body.batl-body :is(
    .batl-stat-value,
    .batl-stage-line--accent,
    .batl-detail-empty-icon,
    .batl-related-card small,
    .batl-breadcrumb a,
    .batl-nav-links a
) {
    color: var(--theme-primary) !important;
}

html[data-effective-theme] body .scroll-to-top.scroll-to-top {
    background: #064e3b !important;
    background-color: #064e3b !important;
    color: #ffffff !important;
    box-shadow: 0 10px 30px rgba(6, 78, 59, 0.28) !important;
}

html[data-effective-theme] body .scroll-to-top.scroll-to-top:hover,
html[data-effective-theme] body .scroll-to-top.scroll-to-top:focus-visible,
html[data-effective-theme] body .scroll-to-top.scroll-to-top:focus-within{
    background: #052e2a !important;
    background-color: #052e2a !important;
    color: #ffffff !important;
}

html[data-effective-theme="light"][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(
    .category-btn,
    .sort-btn,
    .tag-action--secondary,
    .tag-results-count,
    .btn-secondary,
    .btn-outline,
    .btn-ghost
) {
    color: #064e3b !important;
}

html[data-effective-theme="light"][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(.nav-cta .phone-link, .header .nav-cta .phone-link) {
    background: rgba(15, 118, 110, 0.08) !important;
    background-color: rgba(15, 118, 110, 0.08) !important;
    border-color: rgba(15, 118, 110, 0.18) !important;
    color: #064e3b !important;
}

html[data-effective-theme="dark"][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(.nav-cta .phone-link, .header .nav-cta .phone-link) {
    background: rgba(155, 231, 220, 0.1) !important;
    background-color: rgba(155, 231, 220, 0.1) !important;
    border-color: rgba(155, 231, 220, 0.28) !important;
    color: #9be7dc !important;
}

/* Legacy article templates: keep fixed headers from covering breadcrumbs and
   override old hard-coded dark text inside themed article cards. */
html[data-effective-theme] body article.article {
    width: 100% !important;
    margin-top: 116px !important;
    overflow-wrap: anywhere;
}

html[data-effective-theme] body :is(.breadcrumb, .breadcrumbs, .fohow-breadcrumbs, .book-breadcrumbs) {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    max-width: 100%;
    margin: 0 0 24px !important;
    padding: 9px 12px !important;
    overflow: visible;
    color: var(--theme-text-muted) !important;
    background: color-mix(in srgb, var(--theme-surface) 88%, transparent) !important;
    border: 1px solid var(--theme-border) !important;
    border-radius: 10px;
    box-shadow: var(--theme-shadow-sm);
    line-height: 1.45;
}

html[data-effective-theme] body :is(.breadcrumb, .breadcrumbs, .fohow-breadcrumbs, .book-breadcrumbs) a {
    color: var(--theme-primary) !important;
    font-weight: 700;
    text-decoration: none;
    text-decoration-color: color-mix(in srgb, var(--theme-primary), transparent 45%) !important;
}

html[data-effective-theme] body :is(.breadcrumb, .breadcrumbs, .fohow-breadcrumbs, .book-breadcrumbs) a:hover,
html[data-effective-theme] body :is(.breadcrumb, .breadcrumbs, .fohow-breadcrumbs, .book-breadcrumbs) a:focus-visible,
html[data-effective-theme] body :is(.breadcrumb, .breadcrumbs, .fohow-breadcrumbs, .book-breadcrumbs) a:focus-within {
    color: var(--theme-primary-dark) !important;
    text-decoration: underline;
    text-underline-offset: 3px;
}

html[data-effective-theme="dark"] body :is(.breadcrumb, .breadcrumbs, .fohow-breadcrumbs, .book-breadcrumbs) a:hover,
html[data-effective-theme="dark"] body :is(.breadcrumb, .breadcrumbs, .fohow-breadcrumbs, .book-breadcrumbs) a:focus-visible,
html[data-effective-theme="dark"] body :is(.breadcrumb, .breadcrumbs, .fohow-breadcrumbs, .book-breadcrumbs) a:focus-within {
    color: var(--theme-primary) !important;
}

html[data-effective-theme] body .breadcrumb {
    display: block;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

html[data-effective-theme] body .breadcrumb::-webkit-scrollbar {
    display: none;
}

html[data-effective-theme] body .breadcrumb a {
    display: inline;
    line-height: inherit;
    vertical-align: baseline;
}

html[data-effective-theme] body :is(
    .faq-item,
    .section-intro,
    .constitution-card,
    .methods-list,
    .notice,
    .info-box,
    .warning,
    .danger,
    .success,
    .nav-btn,
    .slide,
    .slide figcaption,
    .book-card,
    .book-intro,
    .book-stat,
    .book-toc__item,
    .book-nav__btn
) {
    background-color: var(--theme-surface) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
}

html[data-effective-theme] body :is(
    .faq-item,
    .section-intro,
    .constitution-card,
    .methods-list,
    .notice,
    .info-box,
    .warning,
    .danger,
    .success,
    .nav-btn,
    .slide,
    .book-card,
    .book-intro,
    .book-stat,
    .book-toc__item,
    .book-nav__btn
) :is(h1, h2, h3, h4, h5, h6, strong, b, .nav-btn-title, .book-toc__title, .book-toc__content h3, .book-nav__title) {
    color: var(--theme-heading) !important;
}

html[data-effective-theme] body :is(
    .faq-item,
    .section-intro,
    .constitution-card,
    .methods-list,
    .notice,
    .info-box,
    .warning,
    .danger,
    .success,
    .nav-btn,
    .slide,
    .book-card,
    .book-intro,
    .book-stat,
    .book-toc__item,
    .book-nav__btn
) :is(p, li, span, small, figcaption, .nav-btn-text, .book-stat__label, .book-toc__content p, .book-toc__meta, .book-nav__small) {
    color: var(--theme-text-muted) !important;
}

html[data-effective-theme] body :is(
    .faq-item,
    .section-intro,
    .constitution-card,
    .methods-list,
    .notice,
    .info-box,
    .warning,
    .danger,
    .success,
    .nav-btn,
    .slide,
    .book-card,
    .book-intro,
    .book-stat,
    .book-toc__item,
    .book-nav__btn
) a {
    color: var(--theme-primary) !important;
}

html[data-effective-theme] body :is(.article, .article-container, .article-content, .book-article) :is(strong, b) {
    color: var(--theme-heading) !important;
}

html[data-effective-theme] body :is(
    .part-header,
    .book-part-hero,
    .phase,
    .cta-box,
    .video-placeholder
) :is(h1, h2, h3, h4, h5, h6, p, li, span, strong, b, div) {
    color: #ffffff !important;
}

html[data-effective-theme] body .tip-card h4 .number {
    color: #ffffff !important;
}

html[data-effective-theme] body .phase.phase-n1 {
    background: #4f5fb8 !important;
    background-color: #4f5fb8 !important;
}

html[data-effective-theme] body .phase span {
    opacity: 1 !important;
}

html[data-effective-theme="light"] body .article-container figcaption {
    color: #475569 !important;
}

html[data-effective-theme="light"] body.batl-body .batl-related-card small {
    color: #064e3b !important;
}

html[data-effective-theme="dark"] body :is(.article-container, .article-content) :is(figure, .article-figure, .figure-card) {
    background: var(--theme-surface) !important;
    background-color: var(--theme-surface) !important;
    border-color: var(--theme-border) !important;
}

html[data-effective-theme="dark"] body :is(.article-container, .article-content) figcaption {
    background: var(--theme-surface) !important;
    background-color: var(--theme-surface) !important;
    color: var(--theme-text-muted) !important;
}

html[data-effective-theme="dark"] body :is(.manual-steps li, .instruction-card .manual-steps li) {
    background: var(--theme-surface-muted) !important;
    background-color: var(--theme-surface-muted) !important;
    border-color: var(--theme-primary) !important;
    color: var(--theme-text-muted) !important;
}

html[data-effective-theme="dark"] body :is(.manual-steps li, .instruction-card .manual-steps li) strong {
    color: var(--theme-heading) !important;
}

html[data-effective-theme="dark"] body .food-item span,
html[data-effective-theme="dark"] body .stat-label {
    color: var(--theme-text-muted) !important;
}

html[data-effective-theme="dark"] body .bem-guide__zone-label {
    background: rgba(255, 255, 255, 0.94) !important;
    border-color: rgba(6, 78, 59, 0.22) !important;
    color: #064e3b !important;
}

html[data-effective-theme="dark"] body.meridian-guide .bem-guide__zone-label.bem-guide__zone-label.bem-guide__zone-label.bem-guide__zone-label {
    background: rgba(255, 255, 255, 0.94) !important;
    border-color: rgba(6, 78, 59, 0.22) !important;
    color: #064e3b !important;
}

html[data-effective-theme="dark"] body.batl-body :is(.batl-breadcrumb, .batl-footer) {
    background: var(--theme-surface) !important;
    background-color: var(--theme-surface) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text-muted) !important;
}

html[data-effective-theme] body :is(.cta-box, .article-cta, .product-cta) {
    background: linear-gradient(135deg, #064e3b, #0f766e) !important;
    background-color: #064e3b !important;
    background-image: linear-gradient(135deg, #064e3b, #0f766e) !important;
    border-color: color-mix(in srgb, #ffffff, transparent 76%) !important;
    color: #ffffff !important;
}

html[data-effective-theme] body :is(.cta-box, .article-cta, .product-cta) :is(h1, h2, h3, h4, h5, h6, p, li, span, strong, b) {
    color: #ffffff !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(.cta-box, .article-cta, .product-cta) {
    background: linear-gradient(135deg, #064e3b, #0f766e) !important;
    background-color: #064e3b !important;
    background-image: linear-gradient(135deg, #064e3b, #0f766e) !important;
    border-color: color-mix(in srgb, #ffffff, transparent 76%) !important;
    color: #ffffff !important;
}

html[data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body :is(.cta-box, .article-cta, .product-cta) :is(h1, h2, h3, h4, h5, h6, p, li, span, strong, b) {
    color: #ffffff !important;
}

html[data-effective-theme] body :is(
    .cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box,
    .article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta,
    .product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta
) {
    background: linear-gradient(135deg, #064e3b, #0f766e) !important;
    background-color: #064e3b !important;
    background-image: linear-gradient(135deg, #064e3b, #0f766e) !important;
    border-color: color-mix(in srgb, #ffffff, transparent 76%) !important;
    color: #ffffff !important;
}

html[data-effective-theme] body :is(
    .cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box.cta-box,
    .article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta.article-cta,
    .product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta.product-cta
) :is(h1, h2, h3, h4, h5, h6, p, li, span, strong, b) {
    color: #ffffff !important;
}

html[data-effective-theme] body.manual-body main > .fohow-breadcrumbs {
    margin-top: 100px !important;
    margin-right: auto !important;
    margin-left: auto !important;
}

html[data-effective-theme="light"] body.manual-body :is(.eyebrow, .hero-pill, .inline-pill, .part-meta) {
    background: var(--theme-primary-soft) !important;
    border-color: var(--theme-border) !important;
    color: #064e3b !important;
}

html[data-effective-theme="light"][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme][data-effective-theme] body.manual-body :is(.eyebrow, .hero-pill, .inline-pill, .part-meta) {
    background: var(--theme-primary-soft) !important;
    border-color: var(--theme-border) !important;
    color: #064e3b !important;
}

html[data-effective-theme] body :is(.book-toc__num, .type-number) {
    color: #ffffff !important;
}

html[data-effective-theme] body .book-toc__num {
    background: #064e3b !important;
    background-color: #064e3b !important;
}

html[data-effective-theme="dark"] body .book-toc__num {
    background: #064e3b !important;
    background-color: #064e3b !important;
}

html[data-effective-theme] body .type-number {
    color: #ffffff !important;
}

html[data-effective-theme] body .steps-list li::before {
    color: var(--theme-primary) !important;
}

html[data-effective-theme] body .steps-list li {
    padding-left: 4.85rem !important;
}

html[data-effective-theme] body .steps-list li::before {
    width: 4.35rem;
    text-align: left;
}

@media (max-width: 768px) {
    html[data-effective-theme] body article.article {
        margin-top: 124px !important;
        padding-right: 20px !important;
        padding-left: 20px !important;
    }

    html[data-effective-theme] body :is(.breadcrumb, .breadcrumbs, .fohow-breadcrumbs, .book-breadcrumbs) {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    html[data-effective-theme] body :is(.breadcrumb, .breadcrumbs, .fohow-breadcrumbs, .book-breadcrumbs)::-webkit-scrollbar {
        display: none;
    }

    html[data-effective-theme] body .breadcrumb {
        display: block;
    }
}

/* Compact mobile article header. This wins over legacy inline article CSS. */
@media (max-width: 768px) {
    html[data-effective-theme] body .header,
    html[data-effective-theme] body header.header {
        min-height: 48px !important;
        padding: 0 14px !important;
    }

    html[data-effective-theme] body .header .nav,
    html[data-effective-theme] body header.header .nav {
        height: 48px !important;
        min-height: 48px !important;
        padding: 0 !important;
    }

    html[data-effective-theme] body .header .nav:has(.menu-toggle),
    html[data-effective-theme] body header.header .nav:has(.menu-toggle) {
        justify-content: flex-start !important;
    }

    html[data-effective-theme] body .header .nav:has(.menu-toggle) .menu-toggle,
    html[data-effective-theme] body header.header .nav:has(.menu-toggle) .menu-toggle {
        order: -1 !important;
        margin-right: 12px !important;
        margin-left: 0 !important;
    }

    html[data-effective-theme] body .header .menu-toggle,
    html[data-effective-theme] body header.header .menu-toggle {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-direction: column !important;
        gap: 5px !important;
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;
        padding: 8px !important;
        box-sizing: border-box !important;
    }

    html[data-effective-theme] body .header .menu-toggle span,
    html[data-effective-theme] body header.header .menu-toggle span {
        display: block !important;
        position: static !important;
        inset: auto !important;
        flex: 0 0 auto !important;
        width: 24px !important;
        height: 2px !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
        box-sizing: border-box !important;
    }

    html[data-effective-theme] body .header .menu-toggle.active span:nth-child(1),
    html[data-effective-theme] body header.header .menu-toggle.active span:nth-child(1) {
        transform: translateY(7px) rotate(45deg) !important;
    }

    html[data-effective-theme] body .header .menu-toggle.active span:nth-child(2),
    html[data-effective-theme] body header.header .menu-toggle.active span:nth-child(2) {
        opacity: 0 !important;
    }

    html[data-effective-theme] body .header .menu-toggle.active span:nth-child(3),
    html[data-effective-theme] body header.header .menu-toggle.active span:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg) !important;
    }

    html[data-effective-theme] body .header .logo,
    html[data-effective-theme] body .header a.logo,
    html[data-effective-theme] body header.header .logo,
    html[data-effective-theme] body header.header a.logo {
        display: inline-flex !important;
        align-items: center !important;
        max-width: min(100%, 260px) !important;
        min-height: 0 !important;
        font-size: 20px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    html[data-effective-theme] body .header .nav:has(.menu-toggle) .logo,
    html[data-effective-theme] body header.header .nav:has(.menu-toggle) .logo {
        order: 1 !important;
    }

    html[data-effective-theme] body .header .nav-links,
    html[data-effective-theme] body .nav-links {
        top: 56px !important;
        max-height: calc(100vh - 68px) !important;
        max-height: calc(100dvh - 68px) !important;
    }

    html[data-effective-theme] body .blog-container,
    html[data-effective-theme] body .article-container {
        margin-top: 58px !important;
        padding-top: 20px !important;
    }

    html[data-effective-theme] body > .hero:first-of-type,
    html[data-effective-theme] body main > .hero:first-child {
        margin-top: 48px !important;
    }

    html[data-effective-theme] body article.article,
    html[data-effective-theme] body main article.article {
        margin-top: 60px !important;
        padding-right: 20px !important;
        padding-left: 20px !important;
    }

    html[data-effective-theme] body.manual-body main > .fohow-breadcrumbs {
        margin-top: 58px !important;
    }
}

/* Keyboard focus and coarse-pointer target sizes. Keep this block last in the cascade. */
html body :is(
    a[href],
    button,
    input,
    select,
    textarea,
    [role="button"],
    [tabindex]:not([tabindex="-1"])
):not(.batl-hotspot):focus-visible {
    outline: 3px solid var(--theme-primary, #087f73) !important;
    outline-offset: 3px !important;
}

@media (hover: none), (pointer: coarse), (max-width: 768px) {
    html body :is(.header, header.header, .manual-header, .batl-header) {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    html body :is(
        button:not(.batl-hotspot),
        [role="button"]:not(.batl-hotspot),
        input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
        select,
        textarea
    ) {
        min-width: 44px !important;
        min-height: 44px !important;
        touch-action: manipulation;
    }

    html body :is(
        header a,
        nav a,
        footer a,
        .breadcrumb a,
        .breadcrumbs a,
        .fohow-breadcrumbs a,
        .book-breadcrumbs a,
        .batl-breadcrumb a,
        .manual-nav-links a,
        .manual-link,
        .tag,
        .blog-link,
        .cert-reg-link,
        .article-count,
        .popular-articles__card-title a,
        .popular-articles__link,
        .checkbox-label a
    ) {
        display: inline-flex !important;
        align-items: center !important;
        min-height: 44px !important;
        touch-action: manipulation;
    }

    html body :is(
        .header .logo,
        .header a.logo,
        .nav-links a,
        .dropdown-toggle
    ) {
        min-height: 48px !important;
    }

    html body header.header .nav a.logo.logo {
        display: inline-flex !important;
        align-items: center !important;
        min-height: 48px !important;
    }

    html body .footer .footer-contact p a,
    html body .contact-channel a {
        display: inline-flex !important;
        align-items: center !important;
        min-height: 44px !important;
        touch-action: manipulation;
    }

    html body.meridian-guide .meridian-guide__toc-box li a {
        display: inline-flex !important;
        align-items: center !important;
        min-height: 44px !important;
        touch-action: manipulation;
    }

    html body.meridian-guide .meridian-guide__search-links li a {
        display: inline-flex !important;
        align-items: center !important;
        min-height: 44px !important;
        touch-action: manipulation;
    }

    html body.product-certificates-guide .cert-table a.cert-product-link.cert-product-link {
        display: inline-flex !important;
        align-items: center !important;
        min-height: 44px !important;
        touch-action: manipulation;
    }

    html body :is(
        a,
        button,
        [role="button"],
        .blog-card,
        .product-card,
        .feature-card,
        .training-card,
        .gallery-item,
        .contact-item
    ):hover {
        transform: none !important;
        filter: none !important;
    }

    html body :is(
        a,
        button,
        [role="button"],
        .blog-card,
        .product-card,
        .feature-card,
        .training-card,
        .gallery-item,
        .contact-item
    ):focus-within {
        transform: none !important;
        filter: none !important;
    }
}