/* ========================================
   长翼久安 - 全局样式
   ======================================== */

:root {
    --color-bg: #0a0a0b;
    --color-bg-light: #121214;
    --color-surface: #1a1a1c;
    --color-surface-elevated: #222224;
    --color-text: #f0f0f0;
    --color-text-secondary: #a0a0a0;
    --color-text-muted: #666666;
    --color-accent: #c9a96e;
    --color-accent-light: #e0c99a;
    --color-border: rgba(255,255,255,0.08);
    --color-white: #ffffff;
    --color-black: #000000;

    --font-serif: 'Noto Serif SC','Songti SC','STSong',serif;
    --font-sans: 'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
    --font-display: 'Cormorant Garamond','Noto Serif SC',serif;

    --transition-smooth: cubic-bezier(0.25,0.46,0.45,0.94);
    --nav-height: 72px;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{font-family:var(--font-sans);background-color:var(--color-bg);color:var(--color-text);line-height:1.7;overflow-x:hidden}
::selection{background-color:var(--color-accent);color:var(--color-black)}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}

/* ========================================
   Navigation
   ======================================== */
.nav{position:fixed;top:0;left:0;right:0;z-index:1000;height:var(--nav-height);background-color:rgba(10,10,11,.6);transition:background-color .5s var(--transition-smooth),backdrop-filter .5s var(--transition-smooth);pointer-events:auto}
.nav.scrolled{background-color:rgba(10,10,11,.85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.nav-inner{max-width:1400px;margin:0 auto;padding:0 40px;height:100%;display:flex;align-items:center;justify-content:space-between}
.nav-logo{display:flex;align-items:center;gap:8px;font-family:var(--font-serif)}
.nav-logo-icon{font-size:1.25rem;font-weight:600;color:var(--color-accent);letter-spacing:.1em}
.nav-logo-text{font-size:1.25rem;font-weight:300;color:var(--color-text);letter-spacing:.15em}
.nav-links{display:flex;gap:8px;position:relative;z-index:1}
.nav-link{font-size:.875rem;font-weight:400;color:var(--color-text-secondary);letter-spacing:.05em;position:relative;transition:color .3s ease;display:inline-block;padding:8px 16px;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.nav-link::after{content:'';position:absolute;bottom:4px;left:16px;width:0;height:1px;background-color:var(--color-accent);transition:width .3s var(--transition-smooth)}
.nav-link:hover{color:var(--color-text)}
.nav-link:hover::after{width:calc(100% - 32px)}
.nav-link.active{color:var(--color-accent)}
.nav-link.active::after{width:calc(100% - 32px)}
.nav-toggle{display:none;flex-direction:column;gap:6px;background:none;border:none;cursor:pointer;padding:12px;margin-right:-12px;position:relative;z-index:2}
.nav-toggle span{display:block;width:24px;height:2px;background-color:var(--color-text);transition:transform .3s ease,opacity .3s ease}
.nav-toggle.active span:first-child{transform:rotate(45deg) translate(4px,4px)}
.nav-toggle.active span:last-child{transform:rotate(-45deg) translate(3px,-3px)}

/* ========================================
   Footer
   ======================================== */
.footer{background-color:var(--color-bg-light);padding:60px 0 32px;border-top:1px solid var(--color-border)}
.footer-inner{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:40px;padding-bottom:32px;border-bottom:1px solid var(--color-border)}
.footer-brand-name{font-family:var(--font-serif);font-size:1.25rem;font-weight:600;color:var(--color-text);letter-spacing:.1em;display:block;margin-bottom:8px}
.footer-brand p,.footer-info p{font-size:.875rem;color:var(--color-text-secondary);line-height:1.8}
.footer-info{text-align:right}
.footer-copyright{text-align:center}
.footer-copyright p{font-size:.8125rem;color:var(--color-text-muted)}

/* ========================================
   Section Utils
   ======================================== */
.section-container{max-width:1200px;margin:0 auto;padding:0 40px}
.section-header{text-align:center;margin-bottom:80px}
.section-label{display:inline-block;font-size:.75rem;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:var(--color-accent);margin-bottom:20px;position:relative}
.section-label::before,.section-label::after{content:'';position:absolute;top:50%;width:32px;height:1px;background-color:var(--color-accent);opacity:.3}
.section-label::before{right:calc(100% + 16px)}
.section-label::after{left:calc(100% + 16px)}
.section-title{font-family:var(--font-serif);font-size:clamp(2rem,5vw,3rem);font-weight:300;line-height:1.3;letter-spacing:.05em;color:var(--color-text)}
.section-subtitle{font-size:1.125rem;font-weight:300;color:var(--color-text-secondary);margin-top:20px;max-width:600px;margin-left:auto;margin-right:auto}

/* ========================================
   Animations
   ======================================== */
[data-animate]{opacity:0;transition:opacity .8s var(--transition-smooth),transform .8s var(--transition-smooth)}
[data-animate="fade-up"]{transform:translateY(40px)}
[data-animate="fade-right"]{transform:translateX(-40px)}
[data-animate="fade-left"]{transform:translateX(40px)}
[data-animate="fade-scale"]{transform:scale(.95)}
[data-animate].in-view{opacity:1;transform:translateY(0) translateX(0) scale(1)}
[data-delay="100"]{transition-delay:.1s}
[data-delay="200"]{transition-delay:.2s}
[data-delay="300"]{transition-delay:.3s}
[data-delay="400"]{transition-delay:.4s}

@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes scrollLine{0%,100%{transform:scaleY(1);transform-origin:top}50%{transform:scaleY(0);transform-origin:bottom}}

/* ========================================
   Responsive
   ======================================== */
@media(max-width:768px){
    :root{--nav-height:64px}
    .nav-inner{padding:0 24px}
    .nav-links{display:none;position:absolute;top:var(--nav-height);left:0;right:0;background-color:rgba(10,10,11,.95);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);flex-direction:column;padding:24px;gap:8px;z-index:999}
    .nav-links.active{display:flex}
    .nav-link{padding:12px 16px;width:100%;text-align:center}
    .nav-link::after{bottom:8px;left:50%;transform:translateX(-50%)}
    .nav-link:hover::after{width:60px;left:50%;transform:translateX(-50%)}
    .nav-link.active::after{width:60px;left:50%;transform:translateX(-50%)}
    .nav-toggle{display:flex}
    .section-container{padding:0 24px}
    .footer-inner{flex-direction:column;gap:24px;align-items:center;text-align:center}
    .footer-info{text-align:center}
}

@media(prefers-reduced-motion:reduce){
    *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
    html{scroll-behavior:auto}
}
