/**
 * Yuexiang isolated test-site typography
 *
 * This file is loaded only in the navigation test context. It turns the
 * hotel / wellness topic-page typography into the shared rule for every
 * rebuilt test page while leaving formal URLs untouched.
 */

body.yx-navigation-test {
    --yx-test-font-display: var(
        --yx-font-display,
        "Noto Serif SC",
        "Source Han Serif SC",
        serif
    );
    --yx-test-font-sans: var(
        --yx-font-sans,
        "Noto Sans SC",
        "Source Han Sans SC",
        system-ui,
        sans-serif
    );
    font-family: var(--yx-test-font-sans);
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Navigation, footer, body copy and controls use the same modern sans stack. */
body.yx-navigation-test :where(
    #site-nav,
    #sidr-main,
    .yx-navigation-preview-footer,
    main,
    #content,
    button,
    input,
    select,
    textarea
) {
    font-family: var(--yx-test-font-sans);
}

body.yx-navigation-test :where(
    button,
    input,
    select,
    textarea,
    .button,
    [class*="__button"],
    [class*="__cta"],
    [class*="-submit"],
    [class*="__tab"]
) {
    font-family: var(--yx-test-font-sans) !important;
}

body.yx-navigation-test :where(
    .eyebrow,
    [class*="__eyebrow"],
    [class*="__kicker"],
    [class*="__overline"],
    [class*="__label"],
    [class*="__meta"]
) {
    font-family: var(--yx-test-font-sans) !important;
}

/*
 * The topic pages already carry the approved hierarchy, including their
 * compact semantic H1 above the large display statement. Other test pages
 * receive the same display face for visible headings.
 */
body.yx-navigation-test:not(.page-template-page-solution-scene-v2)
    :where(main, #content)
    :where(h1, h2, h3, h4, .entry-title, .page-title, .archive-title) {
    font-family: var(--yx-test-font-display) !important;
}

body.yx-navigation-test:not(.page-template-page-solution-scene-v2)
    :where(main, #content)
    :where(h1, h2) {
    letter-spacing: -.025em;
}

body.yx-navigation-test:not(.page-template-page-solution-scene-v2)
    :where(main, #content)
    :where(h3, h4) {
    letter-spacing: -.012em;
}

/* The shared lead form must look identical regardless of entry page. */
body.yx-navigation-test [data-yx-shared-lead-form],
body.yx-navigation-test [data-yx-shared-lead-form] :where(
    label,
    legend,
    input,
    select,
    textarea,
    button
) {
    font-family: var(--yx-test-font-sans) !important;
}

/* The formal cases URL reuses the exact accepted cases template. Keep the
   reviewed single-column hero and suppress only the parent-theme archive
   chrome that does not belong to that template. */
body.yx-navigation-cases-preview .top-sub,
body.yx-navigation-cases-preview .bread,
body.yx-navigation-cases-preview .submenu-nav.header-sub,
body.yx-navigation-cases-preview #content,
body.yx-navigation-cases-preview .yxsg-seo-block-cases {
    display:none !important;
}

body.yx-navigation-cases-preview .yx-cases-hero-grid {
    grid-template-columns:minmax(0,1fr) !important;
    gap:0 !important;
}

body.yx-navigation-cases-preview .yx-cases-hero h1 {
    max-width:1060px;
}

@media (max-width: 820px) {
    body.yx-navigation-test:not(.page-template-page-solution-scene-v2)
        :where(main, #content)
        :where(h1, h2) {
        letter-spacing: -.018em;
    }
}
/* Scent-hub structural guards. The page content is intentionally HTML-led;
   keep each space card as a paired image-and-copy layout on desktop even when
   legacy responsive rules are inherited from the parent theme. */
@media (min-width:821px) {
    body.yx-page-hub-v2--scents .yx-scents-v2__space-grid article {
        grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr) !important;
    }
    body.yx-page-hub-v2--scents .yx-scents-v2__space-image {
        display:block;
        width:100%;
        min-height:320px;
        height:100%;
    }
    body.yx-page-hub-v2--scents .yx-scents-v2__space-image img {
        display:block;
        width:100%;
        height:100%;
    }
    body.yx-page-hub-v2--scents .yx-scents-v2__space-grid article > div {
        min-width:0;
    }

    /* Keep the three scent-academy guides in one deliberate row. The parent
       theme has broad nav/link rules, so this is scoped to the V2 scent hub
       instead of relying on source order or a cached preview stylesheet. */
    body.yx-page-hub-v2--scents .yx-scents-v2__academy-links {
        display:grid !important;
        grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr) !important;
        align-items:center !important;
    }
    body.yx-page-hub-v2--scents .yx-scents-v2__academy-links > nav {
        display:grid !important;
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
        grid-auto-flow:row !important;
        min-width:0 !important;
    }
    body.yx-page-hub-v2--scents .yx-scents-v2__academy-links > nav > a {
        display:flex !important;
        grid-column:auto !important;
        grid-row:auto !important;
        min-width:0 !important;
    }
}

/* Shared introduction for retained equipment and home/car catalogues. */
body.yx-page-hub-v2--equipment .yx-page-hub-v2__intro,
body.yx-page-hub-v2--home_car .yx-page-hub-v2__intro {
    box-sizing:border-box;
    width:100%;
    margin:0 auto;
    padding:54px 0 38px;
    border-bottom:1px solid rgba(28,72,53,.14);
}

body.yx-page-hub-v2--equipment .yx-page-hub-v2__eyebrow,
body.yx-page-hub-v2--home_car .yx-page-hub-v2__eyebrow {
    margin:0 0 12px;
    color:#b77a2c;
    font-family:var(--yx-test-font-sans) !important;
    font-size:13px;
    font-weight:700;
    letter-spacing:.18em;
}

body.yx-page-hub-v2--equipment .yx-page-hub-v2__intro h1,
body.yx-page-hub-v2--home_car .yx-page-hub-v2__intro h1 {
    margin:0;
    color:#123f30;
    font-family:var(--yx-test-font-display) !important;
    font-size:clamp(34px,3.2vw,48px);
    font-weight:700;
    line-height:1.24;
    letter-spacing:-.03em;
}

body.yx-page-hub-v2--equipment .yx-page-hub-v2__description,
body.yx-page-hub-v2--home_car .yx-page-hub-v2__description {
    max-width:900px;
    margin:16px 0 0;
    color:#65746e;
    font-family:var(--yx-test-font-sans) !important;
    font-size:17px;
    line-height:1.85;
}

body.yx-page-hub-v2--equipment #picture,
body.yx-page-hub-v2--home_car #picture {
    padding-top:34px;
}

@media (max-width:767px) {
    body.yx-page-hub-v2--equipment .yx-page-hub-v2__intro,
    body.yx-page-hub-v2--home_car .yx-page-hub-v2__intro {
        padding:34px 0 26px;
    }

    body.yx-page-hub-v2--equipment .yx-page-hub-v2__intro h1,
    body.yx-page-hub-v2--home_car .yx-page-hub-v2__intro h1 {
        font-size:30px;
    }

    body.yx-page-hub-v2--equipment .yx-page-hub-v2__description,
    body.yx-page-hub-v2--home_car .yx-page-hub-v2__description {
        margin-top:12px;
        font-size:15px;
        line-height:1.75;
    }

    body.yx-page-hub-v2--equipment #picture,
    body.yx-page-hub-v2--home_car #picture {
        padding-top:24px;
    }
}
@media (max-width: 900px) {
    body.yx-formal-shared-navigation.yx-mobile-nav-fallback-ready.yx-mobile-nav-fallback-open {
        overflow: hidden;
    }

    body.yx-formal-shared-navigation.yx-mobile-nav-fallback-ready #site-nav .down-menu {
        display: none !important;
    }

    body.yx-formal-shared-navigation.yx-mobile-nav-fallback-ready.yx-mobile-nav-fallback-open #site-nav .down-menu {
        position: fixed !important;
        z-index: 100000 !important;
        top: var(--yx-mobile-nav-top, 50px) !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        display: block !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 12px 22px 80px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        background: #153f34 !important;
        box-shadow: 0 18px 42px rgba(12, 42, 34, .24) !important;
        -webkit-overflow-scrolling: touch;
    }

    body.yx-formal-shared-navigation.yx-mobile-nav-fallback-ready #site-nav .down-menu > li {
        position: relative !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 44px !important;
        width: 100% !important;
        min-height: 48px !important;
        margin: 0 !important;
        border-bottom: 1px solid rgba(255, 255, 255, .12) !important;
        line-height: 1.4 !important;
    }

    body.yx-formal-shared-navigation.yx-mobile-nav-fallback-ready #site-nav .down-menu > li > a {
        display: flex !important;
        min-height: 48px !important;
        padding: 13px 4px !important;
        align-items: center !important;
        color: #fff !important;
        font-size: 16px !important;
        font-weight: 650 !important;
        line-height: 1.4 !important;
    }

    body.yx-formal-shared-navigation.yx-mobile-nav-fallback-ready .yx-formal-mobile-submenu-toggle {
        display: grid !important;
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
        margin: 2px 0 !important;
        padding: 0 !important;
        place-items: center !important;
        border: 0 !important;
        border-radius: 8px !important;
        color: #f1d59e !important;
        background: transparent !important;
        font-size: 23px !important;
        line-height: 1 !important;
        cursor: pointer !important;
    }

    body.yx-formal-shared-navigation.yx-mobile-nav-fallback-ready .yx-formal-mobile-submenu-toggle:focus-visible {
        outline: 2px solid #f1d59e !important;
        outline-offset: -3px !important;
    }

    body.yx-formal-shared-navigation.yx-mobile-nav-fallback-ready #site-nav .down-menu > li > .sub-menu {
        position: static !important;
        grid-column: 1 / -1 !important;
        display: none !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 0 10px !important;
        padding: 6px 0 10px 14px !important;
        border: 0 !important;
        border-left: 1px solid rgba(241, 213, 158, .38) !important;
        border-radius: 0 !important;
        opacity: 1 !important;
        visibility: visible !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;
    }

    body.yx-formal-shared-navigation.yx-mobile-nav-fallback-ready #site-nav .down-menu > li.toggled-on > .sub-menu {
        display: block !important;
    }

    body.yx-formal-shared-navigation.yx-mobile-nav-fallback-ready #site-nav .sub-menu li,
    body.yx-formal-shared-navigation.yx-mobile-nav-fallback-ready #site-nav .sub-menu a {
        position: static !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    body.yx-formal-shared-navigation.yx-mobile-nav-fallback-ready #site-nav .sub-menu a {
        padding: 10px 8px !important;
        color: rgba(255, 255, 255, .84) !important;
        font-size: 14px !important;
        line-height: 1.5 !important;
    }

    body.yx-formal-shared-navigation.yx-mobile-nav-fallback-ready #site-nav .sub-menu a:focus-visible {
        outline: 2px solid #f1d59e !important;
        outline-offset: -2px !important;
    }
}
/* The academy template is rendered inside Begin's legacy 1200px content
 * wrapper on its formal URL.  The accepted test page was viewport-wide with
 * its own 1280px inner grid, so break only this hub out of the legacy shell. */
body.yx-page-hub-v2--knowledge .yx-academy {
    position: relative;
    left: 50%;
    width: 100vw;
    max-width: none;
    margin-left: -50vw;
    overflow-x: clip;
}

body.yx-page-hub-v2--knowledge .yx-academy__container {
    width: min(1280px, calc(100% - 64px));
    max-width: none;
}

@media (max-width: 760px) {
    body.yx-page-hub-v2--knowledge .yx-academy__container {
        width: min(100% - 32px, 680px);
    }
}

/* Shared formal footer: align the footer grid with the accepted 1280px site
 * rhythm and improve small-copy legibility without flattening its hierarchy. */
body.yx-navigation-test .yx-navigation-preview-footer-inner {
    width: min(1280px, 100%);
}

body.yx-navigation-test .yx-navigation-preview-footer-brand > p {
    color: rgba(255, 255, 255, .74);
    font-size: 15px;
}

body.yx-navigation-test .yx-navigation-preview-footer-menu > li > a {
    font-size: 16px;
}

body.yx-navigation-test .yx-navigation-preview-footer-menu .sub-menu a {
    color: rgba(255, 255, 255, .7);
    font-size: 14px;
}

body.yx-navigation-test .yx-navigation-preview-footer-company > span {
    color: rgba(255, 255, 255, .68);
    font-size: 14px;
}

body.yx-navigation-test .yx-navigation-preview-footer-contact-label {
    font-size: 13px;
}

body.yx-navigation-test .yx-navigation-preview-footer-phones small {
    color: rgba(255, 255, 255, .68);
    font-size: 12px;
}

body.yx-navigation-test .yx-navigation-preview-footer-qr strong {
    font-size: 14px;
}

body.yx-navigation-test .yx-navigation-preview-footer-qr figcaption span {
    color: rgba(255, 255, 255, .62);
    font-size: 12px;
}

body.yx-navigation-test .yx-navigation-preview-footer-meta {
    color: rgba(255, 255, 255, .56);
    font-size: 12px;
}

body.yx-navigation-test .yx-navigation-preview-footer-meta a {
    color: rgba(255, 255, 255, .66);
}