/* shared base only */
:root {
    --container-max: 100%;
    --container-padding: 1rem;
    --menu-width: 100%;
    --content-max: 100%;
    --header-stick-threshold: 80px;
    --global-content-max-width: 1260px;
    --section-spacing-y: 4rem;
    --section-spacing-x: 0;
    --details-slider-padding: 235px;
    --font-size-6: 0.375rem;
    --font-size-8: 0.5rem;
    --font-size-9: 0.5625rem;
    --font-size-10: 0.625rem;
    --font-size-12: 0.75rem;
    --font-size-14: 0.875rem;
    --font-size-16: 1rem;
    --font-size-17: 1.0625rem;
    --font-size-18: 1.125rem;
    --font-size-20: 1.25rem;
    --font-size-24: 1.5rem;
    --font-size-32: 2rem;
    --font-size-36: 2.25rem;
    --font-size-40: 2.5rem;
    --font-size-48: 3rem;
    --font-size-64: 4rem;
    --font-size-caption: var(--font-size-12);
    --font-size-small: var(--font-size-14);
    --font-size-body: var(--font-size-16);
    --font-size-lead: var(--font-size-18);
    --font-size-subtitle: var(--font-size-20);
    --font-size-section-title: var(--font-size-24);
    --font-size-title: var(--font-size-32);
    --font-size-display: var(--font-size-36);
    --font-size-hero: var(--font-size-48);
    --font-size-hero-xl: var(--font-size-64);
    --color-base-primary: #641122;
    --color-base-accent: #E6D7BE;
    --color-base-accent-muted: rgba(210, 204, 193, 0.3);
    --color-base-surface-accent: #EFE8D8;
    --color-base-text: #242424;
    --color-base-text-muted: rgba(24, 24, 24, 0.8);
    --color-base-text-dark-muted: rgba(24, 24, 24, 0.9);
    --color-base-text-tertiary: #666;
    --color-base-menu-overlay: rgba(230, 215, 190, 0.9);
    --color-base-surface: #fcfbf4;
    --color-base-surface-alt: #fafaf9;
    --color-base-surface-warm: #FDFBF7;
    --color-base-surface-overlay: rgba(252, 251, 244, 0.2);
    --color-base-surface-muted: rgba(252, 251, 244, 0.4);
    --color-base-border: #E0E0E0;
    --color-base-accent-overlay: rgba(230, 215, 190, 0.6);
    --color-base-dark: #181818;
    --color-base-dark-hover: #3a3a3a;
    --color-base-black: #000000;
    --color-base-error: #c94a4a;
    --color-base-white: #fff;
    --color-base-on-dark-muted: rgba(250, 250, 249, 0.75);
    --color-base-on-dark-subtle: rgba(250, 250, 249, 0.5);
    --color-base-on-dark-strong: rgba(250, 250, 249, 0.85);
    --color-base-border-on-dark: rgba(255, 255, 255, 0.35);
    --color-base-border-on-dark-hover: rgba(255, 255, 255, 0.5);
    --color-base-bg-on-dark: rgba(255, 255, 255, 0.08);
    --color-base-bg-on-dark-hover: rgba(255, 255, 255, 0.1);
    --color-primary: var(--color-base-primary);
    --color-accent: var(--color-base-accent);
    --color-accent-muted: var(--color-base-accent-muted);
    --color-surface-accent: var(--color-base-surface-accent);
    --color-text: var(--color-base-text);
    --color-secondary: var(--color-base-text-dark-muted);
    --color-text-muted: var(--color-base-text-muted);
    --color-text-tertiary: var(--color-base-text-tertiary);
    --color-menu-default: var(--color-base-menu-overlay);
    --color-surface: var(--color-base-surface);
    --color-surface-alt: var(--color-base-surface-alt);
    --color-surface-warm: var(--color-base-surface-warm);
    --color-surface-overlay: var(--color-base-surface-overlay);
    --color-surface-muted: var(--color-base-surface-muted);
    --color-border: var(--color-base-border);
    --color-accent-overlay: var(--color-base-accent-overlay);
    --color-surface-dark: var(--color-base-dark);
    --color-surface-dark-hover: var(--color-base-dark-hover);
    --color-black: var(--color-base-black);
    --color-error: var(--color-base-error);
    --color-on-dark: var(--color-base-white);
    --color-on-dark-muted: var(--color-base-on-dark-muted);
    --color-on-dark-subtle: var(--color-base-on-dark-subtle);
    --color-on-dark-strong: var(--color-base-on-dark-strong);
    --color-border-on-dark: var(--color-base-border-on-dark);
    --color-border-on-dark-hover: var(--color-base-border-on-dark-hover);
    --color-bg-on-dark: var(--color-base-bg-on-dark);
    --color-bg-on-dark-hover: var(--color-base-bg-on-dark-hover);
    --color-header-bg: var(--color-primary);
    --color-header-text: var(--color-accent);
    --color-menu-text: var(--color-accent);
    --color-menu-text-transparent: var(--color-menu-default);
    --color-footer-bg: var(--color-surface-dark);
    --color-footer-text: var(--color-on-dark-strong);
    --color-footer-link: var(--color-on-dark-muted);
    --color-footer-border: var(--color-border-on-dark);
    --color-footer-input-bg: var(--color-bg-on-dark);
    --color-footer-input-border: var(--color-border-on-dark);
    --color-banner-bg: var(--color-surface-dark);
    --color-banner-text: var(--color-surface-alt);
    --color-fixed-nav-bg: var(--color-surface-dark);
    --color-fixed-nav-text: var(--color-on-dark);
    --color-fixed-nav-border: var(--color-border-on-dark);
    --color-fixed-nav-btn-border: var(--color-border-on-dark);
    --swiper-theme-color: var(--color-primary);
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-full: 9999px;
}
@media (min-width: 769px) { :root { --container-max: 720px; --container-padding: 1.5rem; --menu-width: 720px; --content-max: 720px; } }
@media (min-width: 1024px) { :root { --container-max: 960px; --container-padding: 2rem; --menu-width: 960px; --content-max: 960px; } }
@media (min-width: 1280px) { :root { --container-max: 1120px; --menu-width: 1120px; --content-max: 1120px; } }
@media (min-width: 1440px) { :root { --container-max: 1280px; --menu-width: 1280px; --content-max: 1280px; } }
@media (min-width: 1600px) { :root { --container-max: 1450px; --menu-width: 1450px; --content-max: 1450px; } }
@media (min-width: 1920px) { :root { --container-max: 1680px; --container-padding: 2rem; --menu-width: 1696px; --content-max: 1680px; } }
@media (min-width: 2560px) { :root { --container-max: 1920px; --container-padding: 2.5rem; --menu-width: 2000px; --content-max: 1920px; } }
@media (max-width: 734px) { :root { --global-content-max-width: 420px; } }
/* 大屏 details-slider 用 235px 左右内边距；小屏必须收紧，否则 padding+子项 min-width 会撑出横向滚动 */
@media (max-width: 768px) {
    :root {
        --details-slider-padding: 16px;
    }
}
html { overflow-x: hidden; scrollbar-color: var(--color-primary) var(--color-surface-alt); scrollbar-width: thin; }
/* 勿用 max-width:100vw：含垂直滚动条时 100vw 常大于布局宽度，会导致整页可横向拖动 */
/* body 勿用 overflow-x:hidden（会把另一轴算成 auto，易双纵向滚动条）；clip 不触发该规则，可兜底裁切横向溢出 */
body { color: var(--color-text); background: transparent; width: 100%; max-width: 100%; box-sizing: border-box; font-weight: 400; overflow-x: clip; }
.skip-link { position: absolute; top: -100px; left: var(--container-padding, 1rem); z-index: 9999; padding: 0.75rem 1rem; background: var(--color-primary); color: var(--color-surface); font-size: var(--font-size-14); text-decoration: none; border-radius: 4px; transition: top 0.2s ease; }
.skip-link:focus { top: 0.5rem; outline: 3px solid var(--color-accent); outline-offset: 2px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 2px; }
.container { width: 100%; max-width: var(--container-max); margin-inline: auto; box-sizing: border-box; }
.container--wide { width: 100%; max-width: var(--menu-width, var(--container-max)); margin-inline: auto; padding-inline: var(--container-padding); }
.container--narrow { width: 100%; max-width: var(--global-content-max-width); margin-inline: auto; padding-inline: var(--container-padding); box-sizing: border-box; }
.header__container { width: 100%; max-width: var(--menu-width, var(--container-max)); margin-inline: auto; padding-inline: var(--container-padding); box-sizing: border-box; }