/* Shared typography across all public pages. */
.typography-home .content :is(h1, h2, h3) :is(p, span, strong, b) {
    font-size: inherit !important;
    line-height: inherit;
    font-weight: inherit;
    font-family: inherit;
    color: inherit !important;
}
.typography-home .content :is(h1, h2, h3) p { margin: 0; }
.typography-home .content :is(.hero-slider, .special-offers-parallax,
    .baikal-contact-header) :is(h1, h2, h3, p, strong, b) {
    color: #fff !important;
}
.typography-home .content .section-title-parallax {
    font-size: var(--type-h2) !important;
}

html:has(body.typography-refresh) { font-size: 62.5%; }

.typography-refresh {
    --text-brown: #766368;
    --heading-brown: #49383e;
    --slate-700: #766368;
    --slate-800: #49383e;
    --slate-900: #49383e;
    --type-h1: 4.4rem;
    --type-h2: 3.4rem;
    --type-h3: 2.4rem;
    --type-card: 2rem;
    color: var(--text-brown);
    font-size: 1.6rem;
    font-family: 'Inter', Arial, sans-serif;

    .main-header :is(a, .phone-number), .breadcrumbs :is(a, span) {
        color: var(--text-brown);
        font-weight: 400;
    }
    .main-header a:hover { color: var(--heading-brown); }

    .content {
        font-family: 'Inter', Arial, sans-serif;
        line-height: 1.6;
    }

    .content h1, .content h2, .content h3 {
        font-family: 'Raleway', 'Inter', Arial, sans-serif;
        font-weight: 500;
        line-height: 1.25;
        color: var(--heading-brown);
        letter-spacing: normal;
    }
    .content h1 { font-size: var(--type-h1); }
    .content h2 { font-size: var(--type-h2); }
    .content h3 { font-size: var(--type-h3); }

    .content :is(p, li) {
        font-size: 1.6rem;
        line-height: 1.6;
        font-weight: 400;
        color: var(--text-brown);
        transition: color .2s ease;
    }
    .content :is(strong, b) {
        font-weight: 600;
        color: inherit;
    }
    .content :is(.section-subtitle, .values-subtitle, .rev-section-subtitle,
        .story-paragraph-text, .mission-paragraph-text, .value-description,
        .advantage-description, .con-contact-method-description) {
        color: var(--text-brown) !important;
        font-size: 1.6rem !important;
        line-height: 1.6;
        font-weight: 400;
    }
    .content :is(.section-title, .rev-section-title, .con-section-title, .eve-section-title,
        .baikal-contact-title) {
        font-size: var(--type-h2) !important;
        font-weight: 500;
        line-height: 1.25;
    }
    .content :is(.tour-title, .card-title, .value-title, .rev-reviewer-name,
        .author-name) {
        font-size: var(--type-card);
        font-weight: 500;
        line-height: 1.4;
        color: var(--heading-brown);
    }
    .content :is(.author-title, .rev-reviewer-meta, .card-description,
        .tour-short-description, .tour-meta, .date-range) {
        font-size: 1.4rem;
        line-height: 1.5;
        font-weight: 400;
    }
    .content .tour-price {
        font-size: 2rem;
        font-weight: 500;
        color: var(--heading-brown);
    }
    .quote-block blockquote p {
        font-family: 'Raleway', 'Inter', Arial, sans-serif;
        font-size: var(--type-h3);
        line-height: 1.45;
        font-weight: 500;
        color: var(--heading-brown);
    }
    .content :is(input, select, textarea, button) {
        font-family: 'Inter', Arial, sans-serif;
        font-size: 1.6rem;
        font-weight: 400;
    }
    .content :is(input, select, textarea) { color: var(--heading-brown); }
    .content :is(input, textarea)::placeholder { color: var(--text-brown); opacity: 1; }
    .content select:required:invalid { color: var(--text-brown); }

    .baikal-contact-form .wrapper-checkbox :is(label, a, p),
    .baikal-contact-form .baikal-contact-message,
    .baikal-contact-form .baikal-contact-message p {
        font-family: 'Inter', Arial, sans-serif;
        font-size: 1.4rem;
        line-height: 1.6;
        font-weight: 400;
        color: #fff !important;
    }
    .baikal-contact-form .wrapper-checkbox a {
        text-underline-offset: .25rem;
    }
    .baikal-contact-form .baikal-contact-submit {
        color: var(--text-brown);
        font-weight: 500;
    }
    .baikal-contact-form .baikal-contact-submit:hover {
        color: var(--heading-brown);
    }

    /* Preserve contrast over photography and coloured sections. */
    .content :is(.about-hero-text, .about-hero-registry-link, .card-content, .tour-info,
        .baikal-contact-header) :is(h1, h2, h3, p, strong, b),
    .content :is(.advantage-title-white, .advantage-description-white),
    .content .advantage-description-white :is(p, li, strong, b) {
        color: #fff;
    }
    .content .about-hero-title { font-size: var(--type-h1); }
    .content .baikal-contact-subtitle { color: #fff; font-size: 1.6rem; }
}

.typography-refresh .content .values-section-title {
    max-width: 96rem;
    margin: 0 auto;
    color: var(--heading-brown) !important;
}
.typography-refresh .content .rev-section-header :is(.section-title, .rev-section-title) {
    color: var(--heading-brown) !important;
}
.typography-refresh .content .rev-section-header .rev-section-subtitle {
    color: var(--text-brown) !important;
}

/* Contacts and reviews share the homepage's warm palette. */
.typography-refresh :is(#contacts, .rev-min-h-screen) {
    --teal-50: #f7f3f4;
    --teal-100: #eee6e9;
    --teal-200: #ddd0d5;
    --teal-300: #c6b5bd;
    --teal-600: #766368;
    --teal-700: #49383e;
    font-family: 'Inter', Arial, sans-serif;
    color: var(--text-brown);
    :is(h2, .section-title, .rev-section-title) {
        font-family: 'Raleway', 'Inter', Arial, sans-serif;
        font-size: var(--type-h2) !important;
        line-height: 1.25;
        font-weight: 500;
        color: var(--heading-brown) !important;
    }
    :is(h3, .rev-reviewer-name, .con-contact-method-title) {
        color: var(--heading-brown) !important;
        font-weight: 500;
    }
    :is(p, li, .rev-form-label, .rev-reviewer-meta, .rev-review-text,
        .con-contact-method-primary, .con-contact-method-secondary) {
        color: var(--text-brown) !important;
    }
    :is(a, .con-contact-method-icon, .rev-verified-icon, .rev-read-more-btn) {
        color: var(--text-brown);
    }
    a:hover { color: var(--heading-brown); }
    :is(.con-title, .con-messenger-link, .con-telegram-channel-link,
        .rev-tour-badge) {
        background: #f3edef;
        color: var(--heading-brown);
    }
    :is(.con-messenger-link, .con-telegram-channel-link):hover { background: #e9dfe3; }
    .rev-featured-section { background: #fff; }
    .rev-form-section { background: #fafafa; }
    .rev-card-gradient { background: #f0f0f0; }
    .rev-tour-badge {
        background: transparent;
        color: var(--text-brown);
        padding-left: 0;
        padding-right: 0;
    }
    :is(.rev-avatar-teal, .rev-avatar-blue) {
        background: #f4f4f4;
        color: var(--heading-brown);
    }
    :is(.rev-form-input, .rev-form-select, .rev-form-textarea) {
        font-family: 'Inter', Arial, sans-serif;
        color: var(--heading-brown);
        border-color: #e5e5e5;
    }
    :is(.rev-form-input, .rev-form-select, .rev-form-textarea):focus {
        border-color: var(--text-brown);
        box-shadow: 0 0 0 .3rem rgba(118, 99, 104, .12);
    }
    .rev-submit-btn {
        background: var(--text-brown);
        color: #fff;
        border-color: var(--text-brown);
    }
    .rev-submit-btn:hover { background: var(--heading-brown); }
}

/* The same icon tiles in values and contacts. */
.typography-refresh :is(.values-section, #contacts) .value-icon {
    --teal-50: #f7f3f4;
    --teal-100: #eee6e9;
    --teal-200: #ddd0d5;
    --teal-700: #766368;
    flex-shrink: 0;
}
.typography-refresh #contacts .value-icon svg {
    width: 3.2rem;
    height: 3.2rem;
    color: #766368;
    stroke-width: 1.5;
}

.typography-refresh :is(.values-section, #contacts) .value-icon,
.typography-refresh :is(.values-section, #contacts) .value-card:hover .value-icon { background: transparent; }
.typography-refresh .rev-yandex-style .rev-featured-section {
    .rev-featured-card { border: 0; border-radius: 1.6rem; box-shadow: 0 3px 14px rgba(73, 56, 62, .06); background: #fff; }
    .rev-card-gradient { background: #fff; padding: 0; }
    .rev-card-header { padding: 2.4rem 2.4rem 1.6rem; }
    .rev-reviewer-info { gap: 1.2rem; width: 100%; }
    .rev-reviewer-details { min-width: 0; flex: 1; gap: .4rem; }
    :is(.rev-reviewer-avatar, .rev-reviewer-avatar-img) {
        width: 4.4rem; height: 4.4rem; border-radius: 50%; object-fit: cover; flex-shrink: 0; font-size: 1.6rem;
    }
    .rev-reviewer-name { flex-direction: column; align-items: flex-start !important; gap: .6rem; font-size: 1.6rem; line-height: 1.4; }
    .rev-stars { gap: .2rem; }
    .rev-star { width: 1.6rem; height: 1.6rem; color: #dedede; }
    .rev-star-filled { color: #ffc107; }
    .rev-reviewer-meta { flex-wrap: wrap; font-size: 1.2rem; gap: .5rem; }
    .rev-meta-icon { display: none; }
    .rev-card-content { padding: 0 2.4rem 2.4rem !important; background: #fff; }
    .rev-tour-badge { font-size: 1.2rem; margin-bottom: .8rem; }
    .rev-review-text { height: auto; min-height: 0; font-size: 1.4rem; line-height: 1.6; -webkit-line-clamp: 4; margin: 0; cursor: default; overflow-wrap: anywhere; }
    .rev-review-text.active { display: block; z-index: auto; }
    .rev-expand-text { padding: 0; margin-top: .8rem; border: 0; background: transparent; color: var(--text-brown); font: inherit; font-size: 1.3rem; cursor: pointer; }
    .rev-expand-text:hover { color: var(--heading-brown); }
}

.typography-refresh .content .baikal-contact-title {
    font-size: 4rem !important;
    color: #fff !important;
    line-height: 1.2;
}
.typography-refresh .content .baikal-contact-title :is(p, span, strong, b) {
    font-family: inherit;
    font-size: inherit !important;
    font-weight: inherit;
    line-height: inherit;
    color: #fff !important;
    margin: 0;
}
@media (max-width: 768px) {
    .typography-refresh .content .baikal-contact-title { font-size: 3rem !important; }
}

.typography-catalog {
    .category-tour-card, .category-tour-content { min-width: 0; }
    --slate-500: #97858c;
    --slate-600: #766368;
    .all-tours-header { color: var(--text-brown); }
    .mobile-category-description,
    .mobile-category-description :is(p, span, strong, b, li) {
        font-family: 'Inter', Arial, sans-serif;
        font-size: 1.6rem;
        line-height: 1.6;
        color: var(--text-brown) !important;
    }
    :is(.category-filters-sidebar, .section-search, .category-tour-card) {
        font-family: 'Inter', Arial, sans-serif;
    }
    .content .category-tour-title {
        font-family: 'Inter', Arial, sans-serif;
        font-size: 1.9rem;
        font-weight: 500;
        line-height: 1.4;
        color: var(--heading-brown);
    }
    .tour-description-slot { height: 2.1rem; margin-bottom: 1rem; min-width: 0; }
    .content .tour-short-description {
        font-size: 1.4rem; line-height: 1.5;
        display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .category-tour-detail-row { font-size: 1.4rem; line-height: 1.5; }
    .category-tour-location {
        align-items: flex-start;
        height: 4.2rem;
        flex-shrink: 0;
        line-height: 1.5;
    }
    .category-tour-location svg { flex-shrink: 0; margin-top: .35rem; }
    .category-tour-location span { min-width: 0; line-height: 1.5; }
    .category-tour-detail-value { color: var(--heading-brown) !important; font-weight: 500; }
    .category-tour-detail-value :is(.bi-brightness-high-fill, .bi-moon-stars-fill) {
        fill: currentColor;
    }
    .tour-include { font-size: 1.4rem; line-height: 1.5; font-weight: 500 !important; }
    .modal-included :is(p, li, span, a) { font-size: 1.3rem; line-height: 1.5; }
    .content .category-tour-price { font-family: 'Inter', Arial, sans-serif; font-size: 2rem; font-weight: 500; color: var(--heading-brown); }
    .content :is(.category-filters-sidebar, .section-search) :is(input, select, button) { font-size: 1.4rem; }
}

/* Single-line catalogue information; price/button rules are intentionally untouched. */
.typography-catalog .category-tour-card {
    .category-tour-title {
        display: block;
        height: 2.66rem !important;
        margin: 0 0 .6rem !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .tour-description-slot { height: 2.1rem; margin-bottom: .6rem; }
    .category-tour-location { height: 2.1rem; margin-bottom: 1.2rem; }
    .category-tour-location span {
        display: block;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }
    .category-tour-details { margin-top: 0; margin-bottom: 1.2rem; }
    .category-tour-detail-row {
        display: grid;
        grid-template-columns: 8.5rem minmax(0, 1fr) auto;
        align-items: center;
        gap: .6rem;
        height: 2.4rem !important;
        margin-bottom: .6rem;
    }
    .category-tour-detail-value {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        text-align: right;
    }
    .category-tour-detail-label { white-space: nowrap; }
    .category-tour-details > .category-tour-detail-row:has(.category-difficulty-container) { display: none; }
    .dates-button { white-space: nowrap; height: 2.4rem; padding: 0 .6rem; font-size: 1.2rem; }
    .wrapper-included-in-card { height: 2.1rem; }
    .tour-include {
        width: 100%;
        box-sizing: border-box;
        padding: 0;
        border: 0;
        background: transparent;
        text-align: left;
        white-space: nowrap;
        height: 2.1rem;
        color: var(--text-brown);
        gap: .6rem !important;
    }

    .tour-include::after {
        margin-left: auto;
        margin-right: .3rem;
        width: 1rem;
        height: 1rem;
        background: transparent;
        -webkit-mask: none;
        mask: none;
        border-top: 2px solid currentColor;
        border-right: 2px solid currentColor;
        transform: rotate(45deg);
        opacity: .85;
    }
    details[open] > .tour-include::after,
    .tour-include.include-open::after {
        transform: rotate(135deg);
    }
}

.typography-tour {
    .content .travel-banner :is(.travel-banner__title, .info-glass__text, .info-glass__icon),
    .content .travel-banner .info-glass__text:hover {
        color: #fff !important;
    }
    --slate-500: #97858c;
    --slate-600: #766368;
    .content .section-title-tour {
        font-size: var(--type-h2) !important;
        line-height: 1.25;
        font-weight: 500;
        color: var(--heading-brown) !important;
    }
    .content :is(.sidebar-card-title, .program-day-title, .accommodation-title,
        .included-title, .excluded-title) {
        font-size: var(--type-h3);
        line-height: 1.35;
        color: var(--heading-brown);
        font-weight: 500;
    }
    .content .program-day-title { font-family: 'Inter', Arial, sans-serif; font-size: 2rem; }
    :is(.description-text, .program-day-description, .accommodation-type,
        .faq-answer, .included-content, .excluded-content),
    :is(.description-text, .program-day-description, .accommodation-type,
        .faq-answer, .included-content, .excluded-content) :is(p, li, span, strong, b) {
        font-family: 'Inter', Arial, sans-serif;
        font-size: 1.6rem;
        line-height: 1.6;
        color: var(--text-brown) !important;
    }
    .detail-label { color: var(--text-brown); font-size: 1.4rem; }
    :is(.detail-value, .category-tour-detail-value) { color: var(--heading-brown) !important; font-size: 1.4rem; font-weight: 500; }
    .hero-container .hero-tag {
        color: var(--heading-brown) !important;
        border-bottom-color: rgba(73, 56, 62, .28);
    }
    .route-description { color: var(--text-brown) !important; }
    :is(.bi-brightness-high-fill, .bi-moon-stars-fill) { fill: currentColor; }
    .faq-question-text { color: var(--heading-brown); font-size: 1.6rem; font-weight: 500; }
    .baikal-hero :is(.hero-title, .hero-short-description, .hero-price-label,
        .original-price, .discount-price, .hero-price, p, strong, b) { color: #fff !important; }
    .content .hero-title { font-size: var(--type-h1); line-height: 1.2; font-weight: 500; }
    .content .hero-short-description { font-size: 1.8rem; line-height: 1.5; }
}
@media (hover: hover) and (pointer: fine) {
    .typography-tour .content .baikal-hero p:hover { color: #fff !important; }
}

/* Public pages beyond the initial rollout. */
.typography-refresh {
    .content h4 { font-family: 'Inter', Arial, sans-serif; font-size: 1.8rem; font-weight: 500; color: var(--heading-brown); }
    .content :is(.eve-section-subtitle, .esta-menu-subtitle, .con-section-subtitle) {
        font-size: 1.6rem;
        line-height: 1.6;
        color: var(--text-brown);
    }
    .static-page-content :is(p, li, span) {
        font-family: 'Inter', Arial, sans-serif;
        font-size: 1.6rem;
        line-height: 1.6;
        color: var(--text-brown) !important;
    }
    .content :is(.about-hero, .rev-hero-section, .con-hero-section, .travel-banner) :is(h1, h2, p),
    .content :is(.about-hero, .rev-hero-section, .con-hero-section, .travel-banner) p:hover {
        color: #fff !important;
    }
    .content :is(.eve-card-title, .esta-card-title) {
        font-family: 'Inter', Arial, sans-serif;
        font-size: 2rem;
        font-weight: 500;
        color: var(--heading-brown);
    }

    .content .esta-menu-card :is(.esta-card-title, .esta-card-description, .esta-card-link, .esta-card-link span),
    .content .esta-menu-card .esta-card-description:hover {
        color: #fff !important;
    }
}

.typography-refresh .content :is(.eve-section-subtitle, .eve-card-description,
    .eve-event-detail, .eve-footer-text),
.typography-refresh .content .eve-event-detail :is(span, svg) {
    color: var(--text-brown) !important;
}
.typography-refresh .content .eve-card-description:hover {
    color: var(--heading-brown) !important;
}

/* Compact homepage cards: one family and one-line description. */
.typography-home .tours-grid {
    grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 768px) {
    .typography-home .tours-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
.typography-home .summer-tour-card {
    min-width: 0;
    .tour-details-card, .tour-description-slot { min-width: 0; }
    font-family: 'Inter', Arial, sans-serif;
    .tour-title {
        font-family: 'Inter', Arial, sans-serif;
        font-weight: 500;
    }
    .tour-description-slot {
        height: 2.1rem;
        margin-bottom: 1rem;
    }
    .tour-short-description {
        display: block;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        font-size: 1.4rem;
        line-height: 1.5;
    }
    .tour-meta { margin-bottom: 1rem; gap: 1rem; }
    .tour-stats { margin-bottom: 1rem; }
    .tour-include {
        font-size: 1.2rem;
        line-height: 1.5;
        font-weight: 500 !important;
    }
    .modal-included,
    .modal-included :is(p, li, span, a) {
        font-family: 'Inter', Arial, sans-serif;
        font-size: 1.3rem;
        line-height: 1.5;
    }
}

/* Keep seasonal captions together at the bottom, without invisible link space. */
.typography-home .content .season-card {
    .card-content, .card-wrapper:hover .card-content {
        bottom: 0;
        padding: 2.4rem;
        transform: none;
    }
    .card-title, .card-wrapper:hover .card-title {
        display: block;
        min-height: 0;
        margin: 0 0 .8rem;
        font-size: 2.2rem;
        line-height: 1.3;
        transform: none;
    }
    .card-description, .card-wrapper:hover .card-description {
        display: block;
        min-height: 0;
        margin: 0;
        font-size: 1.4rem;
        line-height: 1.5;
        font-weight: 400;
        transform: none;
    }
    .card-link {
        display: flex;
        align-items: center;
        max-height: 0;
        overflow: hidden;
        margin-top: 0;
        opacity: 0;
        transform: translateY(.4rem);
        transition: max-height .25s ease, margin-top .25s ease, opacity .25s ease, transform .25s ease;
    }
    &:hover .card-link, &:focus-visible .card-link {
        max-height: 2.4rem;
        margin-top: 1.2rem;
        opacity: 1;
        transform: none;
    }
    .card-overlay, .card-wrapper:hover .card-overlay {
        background: linear-gradient(to top, rgba(0,0,0,.7), rgba(0,0,0,.15) 45%, transparent 75%);
        opacity: 1;
    }
}

/* Homepage tour cards: consistent type, while preserving the price area. */
.typography-home .content .summer-tour-card {
    .tour-title {
        font-family: 'Inter', Arial, sans-serif !important;
        font-size: 2rem !important;
        line-height: 1.4 !important;
        color: #fff !important;
        font-weight: 600 !important;
    }
    .tour-short-description, .tour-meta, .meta-item,
    .category-tour-detail-value, .date-range, .dates-button, .details-button {
        font-family: 'Inter', Arial, sans-serif !important;
    }
    .tour-short-description, .tour-meta, .meta-item {
        color: var(--text-brown) !important;
        font-size: 1.4rem;
        line-height: 1.5;
    }
    .category-tour-detail-value { color: var(--heading-brown) !important; }
    .category-tour-detail-value svg { fill: currentColor !important; }
    .tour-include {
        width: 100%;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        padding: 0;
        border: 0;
        background: transparent;
        text-align: left;
        gap: .6rem;
        font-family: 'Inter', Arial, sans-serif !important;
        font-size: 1.4rem !important;
        line-height: 1.5;
        color: var(--text-brown) !important;
        font-weight: 500 !important;
        white-space: nowrap;
    }

    .tour-include::after {
        content: '';
        display: inline-block;
        flex-shrink: 0;
        margin-left: auto;
        margin-right: .3rem;
        width: 1rem;
        height: 1rem;
        background: transparent !important;
        -webkit-mask: none !important;
        mask: none !important;
        border-top: 2px solid currentColor;
        border-right: 2px solid currentColor;
        transform: rotate(45deg);
        opacity: .85;
        transition: transform .2s ease, opacity .2s ease;
    }
    details[open] > .tour-include::after,
    .tour-include.include-open::after {
        transform: rotate(135deg);
    }
}

@media (max-width: 768px) {
    .typography-refresh {
        --type-h1: 3rem;
        --type-h2: 2.6rem;
        --type-h3: 2rem;
        --type-card: 1.8rem;
    }
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .typography-home .content :is(.hero-slider, .special-offers-parallax, .baikal-contact-header) p:hover {
        color: #fff !important;
    }
    .typography-refresh .content p:hover {
        color: var(--heading-brown) !important;
    }
    .typography-refresh .content :is(.about-hero-text, .about-hero-registry-link, .card-content, .tour-info,
        .baikal-contact-header, .baikal-contact-message, .advantage-description-white) p:hover {
        color: #fff !important;
    }
}
