/* ===== RESET ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;border:0;font:inherit;vertical-align:baseline}
html{scroll-behavior:smooth;text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{min-height:100vh;line-height:1.6;font-family:"PingFang SC","Microsoft YaHei",sans-serif;font-weight:400;color:#111;background:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
ul,ol{list-style:none}
a{text-decoration:none;color:inherit;transition:color .2s}
img{display:block;max-width:100%;height:auto}
button{cursor:pointer;background:transparent;font:inherit;color:inherit}
:focus-visible{outline:2px solid #FF6B35;outline-offset:2px}
/* ===== VARIABLES ===== */
:root{
  --clr-primary:#FF6B35;
  --clr-primary-light:#FF9A76;
  --clr-dark:#1A2B3C;
  --clr-accent:#4CAF50;
  --clr-white:#fff;
  --clr-light:#F5F5F5;
  --clr-gray:#ccc;
  --clr-dark-gray:#333;
  --clr-text:#111;
  --clr-text-light:#fff;
  --overlay-dark:rgba(26,43,60,0.8);
  --font-primary:"PingFang SC","Microsoft YaHei",sans-serif;
  --font-mono:"SF Mono","Courier New",monospace;
  --space-xs:.25rem;
  --space-sm:.5rem;
  --space-md:1rem;
  --space-lg:2rem;
  --space-xl:3rem;
  --space-2xl:5rem;
  --max-width:1200px;
  --header-h:64px;
  --radius-sm:4px;
  --radius-md:8px;
  --radius-lg:16px;
  --shadow-sm:0 1px 3px rgba(0,0,0,.08);
  --shadow-md:0 4px 12px rgba(0,0,0,.12);
  --shadow-lg:0 8px 30px rgba(0,0,0,.16);
  --glass-bg:rgba(255,255,255,.6);
  --glass-border:rgba(255,255,255,.25);
  --transition:.25s ease
}
/* ===== TYPOGRAPHY ===== */
h1,h2,h3,h4,h5,h6{font-weight:800;letter-spacing:-.02em;line-height:1.2}
h1{font-size:3.5rem}
h2{font-size:2.5rem}
h3{font-size:1.8rem;font-weight:600}
h4{font-size:1.3rem;font-weight:600}
p{margin-bottom:var(--space-md);font-weight:400;font-size:1rem;line-height:1.6}
.small-index{font-size:.75rem;letter-spacing:.05em;text-transform:uppercase;font-weight:400}
.data-figure{font-family:var(--font-mono);font-weight:700;font-size:1.6rem;color:var(--clr-primary)}
/* ===== SKIP LINK ===== */
.skip-link{position:absolute;top:-100px;left:var(--space-md);padding:var(--space-sm) var(--space-md);background:var(--clr-primary);color:#fff;z-index:1000;border-radius:var(--radius-sm);font-weight:600}
.skip-link:focus{top:var(--space-sm)}
/* ===== HEADER ===== */
.site-header{position:fixed;top:0;left:0;width:100%;height:var(--header-h);background:var(--clr-dark);color:var(--clr-text-light);z-index:900;box-shadow:0 2px 12px rgba(0,0,0,.2)}
.header-inner{display:flex;align-items:center;justify-content:space-between;max-width:var(--max-width);margin:0 auto;padding:0 var(--space-lg);height:100%}
.site-logo{font-size:1.5rem;font-weight:800;color:var(--clr-primary);letter-spacing:-.02em;white-space:nowrap}
.site-logo:hover{color:var(--clr-primary-light)}
.primary-nav{display:flex;align-items:center}
.nav-list{display:flex;gap:var(--space-lg)}
.nav-list a{font-size:.95rem;font-weight:500;padding:var(--space-xs) 0;position:relative;white-space:nowrap}
.nav-list a::after{content:'';position:absolute;bottom:-2px;left:0;width:0;height:2px;background:var(--clr-primary);transition:width var(--transition)}
.nav-list a:hover{color:var(--clr-primary)}
.nav-list a:hover::after{width:100%}
.nav-list a[aria-current="page"]{color:var(--clr-primary)}
.nav-list a[aria-current="page"]::after{width:100%;background:var(--clr-primary)}
.nav-toggle{display:none;width:40px;height:40px;align-items:center;justify-content:center;position:relative;border-radius:var(--radius-sm)}
.hamburger,.hamburger::before,.hamburger::after{display:block;width:24px;height:2px;background:var(--clr-text-light);border-radius:2px;transition:transform var(--transition),opacity var(--transition);position:relative}
.hamburger::before,.hamburger::after{content:'';position:absolute;left:0}
.hamburger::before{top:-7px}
.hamburger::after{top:7px}
/* ===== MOBILE NAV ===== */
@media(max-width:767px){
  .nav-toggle{display:flex}
  .primary-nav{position:fixed;top:var(--header-h);left:0;width:100%;background:var(--clr-dark);padding:var(--space-lg);box-shadow:var(--shadow-lg);transform:translateY(-120%);opacity:0;visibility:hidden;transition:transform .35s ease,opacity .35s ease,visibility .35s ease;max-height:calc(100vh - var(--header-h));overflow-y:auto}
  .primary-nav[data-open]{transform:translateY(0);opacity:1;visibility:visible}
  .nav-list{flex-direction:column;gap:var(--space-md)}
  .nav-list a{display:block;padding:var(--space-sm) 0;font-size:1.1rem}
  .nav-toggle[aria-expanded="true"] .hamburger{background:transparent}
  .nav-toggle[aria-expanded="true"] .hamburger::before{transform:translateY(7px) rotate(45deg)}
  .nav-toggle[aria-expanded="true"] .hamburger::after{transform:translateY(-7px) rotate(-45deg)}
}
/* ===== FOOTER ===== */
.site-footer{background:var(--clr-dark);color:var(--clr-text-light);padding:var(--space-2xl) var(--space-lg) var(--space-lg)}
.footer-inner{max-width:var(--max-width);margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:var(--space-xl) var(--space-lg)}
.footer-brand{grid-column:1/2}
.footer-logo{font-size:1.4rem;font-weight:800;color:var(--clr-primary);display:inline-block;margin-bottom:var(--space-sm)}
.footer-logo:hover{color:var(--clr-primary-light)}
.footer-desc{font-size:.9rem;color:rgba(255,255,255,.7);line-height:1.5;max-width:320px}
.footer-links{grid-column:2/3;display:flex;flex-direction:column;gap:var(--space-sm)}
.footer-links a{font-size:.95rem;color:rgba(255,255,255,.8);padding:var(--space-xs) 0;border-bottom:1px solid rgba(255,255,255,.08)}
.footer-links a:hover{color:var(--clr-primary);border-color:var(--clr-primary)}
.footer-contact{grid-column:3/4;display:flex;flex-direction:column;gap:var(--space-sm)}
.footer-contact p{font-size:.9rem;color:rgba(255,255,255,.7);margin-bottom:0;display:flex;gap:var(--space-sm)}
.contact-label{font-weight:600;color:rgba(255,255,255,.9);min-width:3em}
.footer-bottom{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;padding-top:var(--space-lg);border-top:1px solid rgba(255,255,255,.1);margin-top:var(--space-md)}
.footer-bottom p{font-size:.8rem;color:rgba(255,255,255,.5);margin-bottom:0}
@media(max-width:767px){
  .footer-inner{grid-template-columns:1fr;gap:var(--space-lg)}
  .footer-brand,.footer-links,.footer-contact{grid-column:1/2}
  .footer-bottom{flex-direction:column;gap:var(--space-sm);text-align:center}
}
@media(min-width:768px)and(max-width:1024px){
  .footer-inner{grid-template-columns:1fr 1fr;gap:var(--space-lg)}
  .footer-brand{grid-column:1/3}
  .footer-links{grid-column:1/2}
  .footer-contact{grid-column:2/3}
}
/* ===== CONTAINER ===== */
.container{max-width:var(--max-width);margin:0 auto;padding:0 var(--space-lg)}
.container-narrow{max-width:800px;margin:0 auto;padding:0 var(--space-lg)}
/* ===== GRID ===== */
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--space-lg)}
.grid-wide{display:grid;grid-template-columns:2fr 1fr;gap:var(--space-lg)}
.grid-narrow{display:grid;grid-template-columns:1fr 2fr;gap:var(--space-lg)}
@media(max-width:767px){
  .grid,.grid-wide,.grid-narrow{grid-template-columns:1fr}
}
/* ===== CARDS ===== */
.card{background:var(--clr-white);border-radius:var(--radius-md);padding:var(--space-lg);box-shadow:var(--shadow-sm);border:1px solid rgba(0,0,0,.04);transition:box-shadow var(--transition),transform var(--transition)}
.card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
.card-glass{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:var(--radius-md);padding:var(--space-lg);box-shadow:var(--shadow-sm)}
.card-glass:hover{box-shadow:var(--shadow-md)}
.card-primary{border-top:3px solid var(--clr-primary)}
.card-accent{border-top:3px solid var(--clr-accent)}
/* ===== BUTTONS ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-sm);font-weight:600;font-size:.95rem;transition:background var(--transition),color var(--transition),box-shadow var(--transition);white-space:nowrap}
.btn-primary{background:var(--clr-primary);color:#fff}
.btn-primary:hover{background:var(--clr-primary-light);box-shadow:0 4px 12px rgba(255,107,53,.35)}
.btn-secondary{background:transparent;color:var(--clr-text-light);border:2px solid var(--clr-text-light)}
.btn-secondary:hover{background:var(--clr-text-light);color:var(--clr-dark)}
.btn-dark{background:var(--clr-dark);color:var(--clr-text-light)}
.btn-dark:hover{background:var(--clr-primary);color:#fff}
/* ===== BREADCRUMB ===== */
.breadcrumb{display:flex;flex-wrap:wrap;gap:var(--space-sm);padding:var(--space-md) 0;font-size:.85rem;color:var(--clr-dark-gray)}
.breadcrumb a{color:var(--clr-primary)}
.breadcrumb a:hover{text-decoration:underline}
.breadcrumb span{color:var(--clr-gray)}
/* ===== TAGS ===== */
.tag{display:inline-block;padding:2px 10px;border-radius:20px;font-size:.75rem;font-weight:500;background:var(--clr-light);color:var(--clr-dark-gray)}
.tag-green{background:rgba(76,175,80,.15);color:var(--clr-accent)}
.tag-orange{background:rgba(255,107,53,.15);color:var(--clr-primary)}
/* ===== TIMELINE ===== */
.timeline{position:relative;padding-left:var(--space-xl)}
.timeline::before{content:'';position:absolute;left:8px;top:0;bottom:0;width:2px;background:var(--clr-gray)}
.timeline-item{position:relative;padding-bottom:var(--space-lg)}
.timeline-item::before{content:'';position:absolute;left:calc(-1 * var(--space-xl) + 4px);top:4px;width:10px;height:10px;border-radius:50%;background:var(--clr-primary);border:2px solid var(--clr-white);box-shadow:0 0 0 2px var(--clr-primary)}
.timeline-item:last-child{padding-bottom:0}
.timeline-date{font-size:.8rem;color:var(--clr-dark-gray);font-weight:500}
/* ===== DATA DISPLAY ===== */
.data-group{display:flex;gap:var(--space-lg);flex-wrap:wrap}
.data-item{text-align:center}
.data-value{font-family:var(--font-mono);font-weight:700;font-size:2rem;color:var(--clr-primary);line-height:1.2}
.data-label{font-size:.8rem;color:var(--clr-dark-gray);text-transform:uppercase;letter-spacing:.05em}
/* ===== SCROLL PROGRESS ===== */
.scroll-progress{position:fixed;top:0;left:0;width:0;height:3px;background:var(--clr-primary);z-index:999;transition:width .1s linear}
/* ===== BACK TO TOP ===== */
.back-to-top{position:fixed;bottom:var(--space-lg);right:var(--space-lg);width:48px;height:48px;border-radius:50%;background:var(--clr-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.4rem;box-shadow:var(--shadow-md);z-index:800;opacity:0;visibility:hidden;transform:translateY(20px);transition:opacity var(--transition),visibility var(--transition),transform var(--transition),background var(--transition)}
.back-to-top.visible{opacity:1;visibility:visible;transform:translateY(0)}
.back-to-top:hover{background:var(--clr-primary-light);transform:translateY(-3px)}
.back-to-top:focus-visible{outline:2px solid #fff;outline-offset:2px}
/* ===== SECTION SPACING ===== */
.section{padding:var(--space-2xl) 0}
.section-dark{background:var(--clr-dark);color:var(--clr-text-light)}
.section-light{background:var(--clr-light)}
/* ===== UTILITY ===== */
.text-primary{color:var(--clr-primary)}
.text-accent{color:var(--clr-accent)}
.text-center{text-align:center}
.flex{display:flex;gap:var(--space-lg);flex-wrap:wrap}
.flex-center{align-items:center;justify-content:center}
.gap-sm{gap:var(--space-sm)}
.gap-md{gap:var(--space-md)}
.mt-lg{margin-top:var(--space-lg)}
.mb-lg{margin-bottom:var(--space-lg)}
.p-lg{padding:var(--space-lg)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* ===== RESPONSIVE ===== */
@media(max-width:767px){
  :root{--header-h:56px}
  h1{font-size:2.2rem}
  h2{font-size:1.8rem}
  h3{font-size:1.4rem}
  .container{padding:0 var(--space-md)}
  .section{padding:var(--space-xl) 0}
  .data-group{flex-direction:column;align-items:center}
  .back-to-top{bottom:var(--space-md);right:var(--space-md);width:42px;height:42px;font-size:1.2rem}
}
@media(min-width:768px)and(max-width:1024px){
  h1{font-size:2.8rem}
  h2{font-size:2.2rem}
  .nav-list{gap:var(--space-md)}
}
/* ===== REDUCED MOTION ===== */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .back-to-top{transition:none!important}
  .primary-nav{transition:none!important}
  .card{transition:none!important}
}