/* 引入字体：Inter (现代无衬线) 和 Cormorant Garamond (优雅衬线，用于极简标题点缀) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500&family=Cormorant+Garamond:ital,wght@0,300;0,400;1,300&display=swap');

/* 全局基础设置 */
body {
    font-family: 'Inter', sans-serif;
    background-color: #fdfbf7; /* 柔和的米白底色 */
    color: #1a1a1a; /* 深炭灰文字 */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
}

/* 衬线字体辅助类 - 用于大标题或引言 */
.font-serif-display {
    font-family: 'Cormorant Garamond', serif;
}

/* 导航栏磨砂玻璃效果 */
.glass-nav {
    background: rgba(253, 251, 247, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.03);
    transition: all 0.4s ease;
}

/* 视差滚动背景 */
.parallax-bg {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    will-change: transform;
}

/* 图片容器悬停交互 */
.img-hover-container {
    overflow: hidden;
    position: relative;
    display: block;
}

/* 图片本身放大动画 */
.img-hover-container img {
    transition: transform 1.2s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.5s ease;
    will-change: transform;
}

.img-hover-container:hover img {
    transform: scale(1.06);
}

/* 悬停时的半透明遮罩与文字 */
.hover-overlay {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.0);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.4s ease;
}

.img-hover-container:hover .hover-overlay {
    background: rgba(255, 255, 255, 0.1);
}

/* 元素进入视口的渐显动画类 (配合JS IntersectionObserver使用) */
.fade-in-up {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 1s ease-out, transform 1s cubic-bezier(0.22, 1, 0.36, 1);
}

.fade-in-up.visible {
    opacity: 1;
    transform: translateY(0);
}

/* 链接下划线动效 */
.link-underline {
    position: relative;
    text-decoration: none;
}

.link-underline::after {
    content: '';
    position: absolute;
    width: 0%;
    height: 1px;
    bottom: -2px;
    left: 0;
    background-color: currentColor;
    transition: width 0.3s ease-out;
}

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

/* 瀑布流布局辅助 (兼容Tailwind columns) */
.masonry-item {
    break-inside: avoid;
    margin-bottom: 1.5rem;
}

/* 隐藏滚动条但保留功能 */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* 加载时的全屏覆盖层 */
#loader-overlay {
    position: fixed;
    inset: 0;
    background-color: #fdfbf7;
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: opacity 0.6s ease-out, visibility 0.6s;
}

/* 极简加载指示器 */
.loader-line {
    width: 0%;
    height: 2px;
    background-color: #1a1a1a;
    animation: loaderProgress 1.5s ease-in-out infinite;
}

@keyframes loaderProgress {
    0% { width: 0%; margin-left: 0; }
    50% { width: 50%; margin-left: 25%; }
    100% { width: 100%; margin-left: 100%; }
}