/* --- 全局变量 --- */
:root {
    --bg-color: #F5F5F5;
    --text-main: #1a1a1a;
    --text-sub: #888888;
    --line-color: #E5E5E5;
}

/* 基础样式重置和通用类 */
body {
    background-color: var(--bg-color);
    color: var(--text-main);
    font-family: 'Inter', sans-serif;
    overflow-x: hidden;
    cursor: default;
}

.serif-en { font-family: 'Playfair Display', serif; }
.serif-cn { font-family: 'Noto Serif SC', serif; }

/* 极细线条 */
.hairline {
    height: 1px; width: 100%;
    background-color: var(--line-color);
    transform: scaleY(0.5);
}

/* 隐藏滚动条 */
::-webkit-scrollbar { width: 0; }

/* 导航栏混合模式控制 */
.nav-blend { mix-blend-mode: difference; }
.nav-normal { mix-blend-mode: normal; }

/* 菜单交互 */
#menu-overlay { visibility: hidden; opacity: 0; }
.menu-link { position: relative; display: inline-block; overflow: hidden; white-space: nowrap; }
.menu-link span { display: block; transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1); }
.menu-link:hover span { transform: translateY(-100%); }
.menu-link::after {
    content: attr(data-text); position: absolute; top: 100%; left: 0;
    display: block; width: 100%; transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1);
    font-style: italic; color: #888;
    white-space: nowrap;
}
.menu-link:hover::after { transform: translateY(-100%); }

/* 图片容器样式 */
.img-container {
    overflow: hidden;
    position: relative;
    background-color: #E5E5E5;
}

/* 冷感图片样式 */
.cold-img {
    filter: grayscale(100%) contrast(0.95);
    transition: filter 1.0s ease;
    will-change: filter;
}

div:hover .cold-img,
.group:hover .cold-img {
    filter: grayscale(0%) contrast(1);
}

/* 悬停下划线效果 */
.hover-underline {
    position: relative;
    text-decoration: none;
}

.hover-underline::after {
    content: '';
    position: absolute;
    width: 0;
    height: 1px;
    bottom: -1px;
    right: 0;
    background-color: currentColor;
    transition: width 0.3s ease;
}

.hover-underline:hover::after {
    width: 100%;
    left: 0;
    right: auto;
}