/* 引入高质量字体：Playfair Display (衬线/标题), Noto Sans SC (中文/正文) */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500&family=Playfair+Display:ital,wght@0,400;0,600;1,400&display=swap');

:root {
    --color-ivory: #FFFFF0;
    --color-dark-grey: #2F2F2F;
    --color-gold: #D4AF37;
    --color-matte-black: #1A1A1A;
    --ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);
}

html {
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    background-color: var(--color-ivory);
    color: var(--color-dark-grey);
    font-family: 'Helvetica Neue', 'Arial', 'Noto Sans SC', sans-serif;
    overflow-x: hidden;
}

/* 字体工具类 */
.font-display {
    font-family: 'Playfair Display', serif;
}

.font-body {
    font-family: 'Noto Sans SC', sans-serif;
}

/* 自定义选区颜色 */
::selection {
    background-color: var(--color-dark-grey);
    color: var(--color-ivory);
}

/* 极简滚动条 */
::-webkit-scrollbar {
    width: 4px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: rgba(47, 47, 47, 0.1);
    border-radius: 2px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(47, 47, 47, 0.4);
}

/* 毛玻璃导航 */
.glass-nav {
    background: rgba(255, 255, 240, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(47, 47, 47, 0.03);
    transition: transform 0.3s ease;
}

/* 交互动效 */
.hover-underline {
    position: relative;
    display: inline-block;
}

.hover-underline::after {
    content: '';
    position: absolute;
    width: 0;
    height: 1px;
    bottom: -2px;
    left: 0;
    background-color: var(--color-dark-grey);
    transition: width 0.4s var(--ease-out-expo);
}

.hover-underline:hover::after,
.nav-active .hover-underline::after {
    width: 100%;
}

/* 图片懒加载过渡 */
.lazy-image {
    opacity: 0;
    filter: blur(8px);
    transition: opacity 0.8s ease-out, filter 0.8s ease-out, transform 0.8s ease-out;
    transform: scale(1.05);
}

.lazy-image.loaded {
    opacity: 1;
    filter: blur(0);
    transform: scale(1);
}

/* 灯箱模式 */
#lightbox-modal {
    transition: opacity 0.4s ease, visibility 0.4s ease;
}

#lightbox-modal.hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

#lightbox-modal.visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* 网格系统辅助 */
.grid-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 2rem;
    align-items: start;
}

/* 文本排版优化 */
.prose-fashion p {
    margin-bottom: 1.5em;
    line-height: 1.8;
    text-align: justify;
}

.prose-fashion img {
    margin: 2rem 0;
    width: 100%;
    display: block;
}