html, body { margin:0; min-height:100%; overflow-x:hidden; overflow-y:auto; background:#000000; color:#F3F3F3; font-family:"Microsoft YaHei", "PingFang SC", Arial, sans-serif; }
* { box-sizing:border-box; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; height:auto; display:block; }
.site-header { position:sticky; top:0; width:100%; z-index:9999; background:#000000; backdrop-filter:blur(10px); box-shadow:0 8px 24px rgba(0,0,0,0.38); border-bottom:1px solid rgba(255,216,176,0.16); }
.header-inner { max-width:1280px; margin:0 auto; min-height:72px; padding:0 24px; display:flex; align-items:center; justify-content:space-between; gap:18px; }
.brand-logo img { width:142px; max-height:48px; object-fit:contain; }
.desktop-nav { display:flex; align-items:center; gap:6px; flex:1; justify-content:center; }
.desktop-nav a { color:#ffd8b0; padding:10px 13px; border-radius:999px; font-size:15px; position:relative; white-space:nowrap; }
.desktop-nav a:hover, .desktop-nav a.active { background:#111111; color:#ffd8b0; box-shadow:inset 0 -2px 0 rgba(255,216,176,0.65), 0 8px 20px rgba(255,216,176,0.08); }
.main-btn { background:#ffd8b0; color:#000000; border-radius:999px; box-shadow:0 10px 24px rgba(255,216,176,0.22); padding:12px 22px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; transition:.25s ease; }
.main-btn:hover { background:#F2C995; transform:translateY(-1px); }
main { position:relative; z-index:1; }
.section { max-width:1280px; margin:0 auto; padding:70px 24px; }
.hero-section { background:radial-gradient(circle at 18% 20%, rgba(255,216,176,0.15) 0%, rgba(255,216,176,0) 30%), linear-gradient(135deg,#000000 0%,#111111 52%,#161616 100%); }
.hero-grid { max-width:1280px; margin:0 auto; padding:82px 24px 64px; display:grid; grid-template-columns:1.05fr .95fr; gap:46px; align-items:center; }
.eyebrow { color:#ffd8b0; border:1px solid rgba(255,216,176,.28); border-radius:999px; display:inline-flex; padding:8px 14px; background:rgba(255,216,176,.07); font-size:14px; }
h1 { color:#ffd8b0; font-size:46px; line-height:1.16; margin:24px 0 18px; letter-spacing:.5px; }
h2 { color:#ffd8b0; font-size:32px; margin:0 0 18px; }
h3 { color:#ffd8b0; margin:0 0 12px; font-size:21px; }
p { color:#C9C9C9; line-height:1.85; font-size:16px; margin:0 0 16px; }
.hero-text p { font-size:18px; color:#F3F3F3; }
.hero-actions { margin-top:28px; display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
.text-link { color:#ffd8b0; border-bottom:1px solid rgba(255,216,176,.5); padding-bottom:3px; }
.hero-visual { background:linear-gradient(145deg,#111,#1D1D1D); border:1px solid rgba(255,216,176,.28); border-radius:30px; padding:26px; box-shadow:0 0 50px rgba(255,216,176,.12), 0 22px 55px rgba(0,0,0,.52); }
.hero-visual img { width:100%; max-height:420px; object-fit:contain; }
.hero-mini { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:20px; }
.card, .zone-card, .info-card, .mini-card, .faq-item { background:#111111; border:1px solid rgba(255,216,176,0.18); box-shadow:0 14px 36px rgba(0,0,0,0.42); border-radius:22px; padding:24px; }
.num { color:#ffd8b0; font-weight:800; letter-spacing:1px; }
.pill-row, .quick-cats { display:flex; gap:12px; flex-wrap:wrap; }
.quick-cats a, .pill { border:1px solid rgba(255,216,176,.22); color:#ffd8b0; background:#111111; padding:12px 16px; border-radius:999px; }
.strip { background:#111111; border-top:1px solid rgba(255,216,176,.15); border-bottom:1px solid rgba(255,216,176,.15); }
.strip .section { padding-top:34px; padding-bottom:34px; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.grid-2 { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin:20px 0 26px; }
.grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.split { display:grid; grid-template-columns:1fr 1fr; gap:34px; align-items:center; margin-bottom:38px; }
.image-card { background:#161616; border:1px solid rgba(255,216,176,.18); border-radius:26px; padding:22px; min-height:260px; display:flex; align-items:center; justify-content:center; box-shadow:0 14px 36px rgba(0,0,0,.42); }
.content-img, .zone-card img, .app-section img, .hero-visual img { max-width:100%; height:auto; object-fit:contain; }
.image-card img { max-height:310px; object-fit:contain; }
.points { margin:18px 0; padding:0; list-style:none; display:grid; gap:10px; }
.points li { color:#F3F3F3; padding-left:22px; position:relative; line-height:1.7; }
.points li:before { content:""; width:8px; height:8px; border-radius:50%; background:#ffd8b0; position:absolute; left:0; top:.72em; }
.zone-card { padding:18px; }
.zone-card img { width:100%; max-height:170px; margin:0 auto 18px; object-fit:contain; border-radius:16px; background:#161616; }
.app-section { background:linear-gradient(135deg,#111,#1D1D1D); border:1px solid rgba(255,216,176,.22); border-radius:30px; padding:34px; display:grid; grid-template-columns:.85fr 1.15fr; gap:34px; align-items:center; }
.app-section img { max-height:340px; margin:auto; }
.faq-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.notice { border:1px solid rgba(255,216,176,.28); background:linear-gradient(135deg,rgba(255,216,176,.08),rgba(255,216,176,.02)); border-radius:26px; padding:28px; }
.inner-hero { background:linear-gradient(135deg,#000 0%, #111 60%, #1D1D1D 100%); border-bottom:1px solid rgba(255,216,176,.15); }
.inner-hero .section { padding-top:78px; padding-bottom:52px; }
.content-panel { display:grid; grid-template-columns:1fr .75fr; gap:34px; align-items:start; }
.article { background:#111111; border:1px solid rgba(255,216,176,.18); border-radius:26px; padding:34px; }
.side-card { position:sticky; top:96px; background:#161616; border:1px solid rgba(255,216,176,.18); border-radius:24px; padding:24px; }
.side-card img { max-height:260px; margin:0 auto 18px; object-fit:contain; }
.site-footer { background:#050505; color:#DADADA; border-top:1px solid rgba(255,216,176,.16); }
.footer-inner { max-width:1280px; margin:0 auto; padding:42px 24px 54px; display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:26px; }
.footer-brand img { width:150px; max-height:52px; object-fit:contain; margin-bottom:16px; }
.footer-links { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.footer-links a { color:#ffd8b0; }
.footer-note { color:#C9C9C9; line-height:1.8; }
.menu-toggle { display:none; width:42px; height:42px; border:1px solid rgba(255,216,176,.25); border-radius:12px; background:#111; padding:9px; }
.menu-toggle span { display:block; height:2px; background:#ffd8b0; margin:5px 0; }
.mobile-mask { position:fixed; inset:0; background:rgba(0,0,0,.62); z-index:10000; opacity:0; pointer-events:none; transition:.25s; }
.mobile-mask.show { opacity:1; pointer-events:auto; }
.mobile-drawer { position:fixed; left:0; top:0; width:84%; max-width:320px; height:100vh; background:linear-gradient(180deg,#080808,#161616); z-index:10001; transform:translateX(-102%); transition:.28s ease; border-right:1px solid rgba(255,216,176,.2); overflow-y:auto; }
.mobile-drawer.open { transform:translateX(0); }
.drawer-head { display:flex; align-items:center; justify-content:space-between; padding:18px; border-bottom:1px solid rgba(255,216,176,.15); }
.drawer-head img { width:132px; max-height:48px; object-fit:contain; }
.drawer-close { background:#111; color:#ffd8b0; border:1px solid rgba(255,216,176,.25); border-radius:12px; width:38px; height:38px; font-size:26px; }
.drawer-nav { display:grid; padding:14px; gap:8px; }
.drawer-nav a { color:#ffd8b0; padding:13px 14px; border-radius:14px; background:rgba(255,216,176,.04); border:1px solid transparent; }
.drawer-nav a.active, .drawer-nav a:hover { border-color:rgba(255,216,176,.25); background:#111111; }
body.menu-open { overflow:hidden; }
.mobile-bottom { display:none; }
@media (max-width:1100px){ .desktop-nav a{font-size:14px;padding:9px 9px;} .grid-4{grid-template-columns:repeat(2,1fr);} }
@media (max-width:860px){
  .header-inner{min-height:66px;padding:0 14px;display:grid;grid-template-columns:48px 1fr auto;} .desktop-nav{display:none;} .menu-toggle{display:block;} .brand-logo{justify-self:center;} .brand-logo img{width:126px;} .header-btn{padding:10px 14px;font-size:14px;}
  .hero-grid{grid-template-columns:1fr;padding:56px 18px 42px;gap:28px;} h1{font-size:34px;} h2{font-size:27px;} .section{padding:48px 18px;} .hero-mini,.grid-3,.grid-4,.grid-2,.split,.content-panel,.app-section,.faq-grid,.footer-inner{grid-template-columns:1fr;} .split:nth-child(even) .image-card{order:0;} .side-card{position:static;} .mobile-bottom{position:fixed;display:grid;grid-template-columns:repeat(4,1fr);left:0;right:0;bottom:0;z-index:9998;background:#050505;border-top:1px solid rgba(255,216,176,.18);} .mobile-bottom a{text-align:center;color:#ffd8b0;padding:11px 6px;font-size:13px;} body{padding-bottom:50px;}
}