/* 华纳万宝路公司 官网样式 —— 精简内联级体积，无外部请求，秒加载 */
:root{
  --bg:#0e1420;--bg2:#131c2c;--card:#18233580;--line:#25344d;
  --gold:#d8b26a;--gold2:#f0d9a8;--txt:#e8ecf3;--sub:#9aa7bd;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font:16px/1.75 "PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;background:var(--bg);color:var(--txt)}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
.wrap{width:min(1120px,92%);margin:0 auto}
em{font-style:normal;color:var(--gold)}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:#0e1420e6;backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{display:flex;align-items:center;gap:10px}
.logo-mark{width:38px;height:38px;border-radius:8px;background:linear-gradient(135deg,var(--gold),#a8823d);color:#141414;font-weight:700;font-size:20px;display:flex;align-items:center;justify-content:center}
.logo-text{font-weight:700;font-size:18px;line-height:1.2}
.logo-text em{display:block;font-size:11px;color:var(--sub);letter-spacing:2px}
.nav{display:flex;gap:26px;font-size:15px;color:var(--sub)}
.nav a:hover{color:var(--gold2)}
.menu-btn{display:none;background:none;border:1px solid var(--line);color:var(--txt);font-size:20px;border-radius:6px;padding:2px 10px;cursor:pointer}

/* hero */
.hero{padding:88px 0 72px;background:radial-gradient(1000px 420px at 70% -10%,#22304a55,transparent),linear-gradient(180deg,#111a2a,#0e1420)}
.hero h1{font-size:clamp(26px,4.2vw,40px);line-height:1.35;font-weight:800}
.hero-sub{margin-top:16px;color:var(--sub);font-size:clamp(14px,2vw,17px)}
.hero-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.hero-tags span{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:4px 14px;font-size:13px;color:var(--gold2)}
.hero-cta{margin-top:30px;display:flex;gap:14px;flex-wrap:wrap}
.btn{display:inline-block;border-radius:8px;padding:11px 26px;font-size:15px;cursor:pointer;border:0;transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-2px)}
.btn-gold{background:linear-gradient(135deg,var(--gold),#b8924a);color:#151515;font-weight:600}
.btn-ghost{border:1px solid var(--line);color:var(--txt);background:transparent}

/* sections */
.sec{padding:64px 0;border-bottom:1px solid var(--line)}
.sec h2{font-size:clamp(20px,3vw,27px);margin-bottom:18px;padding-left:14px;border-left:4px solid var(--gold);line-height:1.4}
.sec-desc{color:var(--sub);margin-bottom:26px}
.about-grid{display:grid;grid-template-columns:1fr 320px;gap:34px}
.about-txt p{margin-bottom:14px;color:#cdd5e1}
.about-txt h3{margin:22px 0 10px;font-size:18px;color:var(--gold2)}
.about-side{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:22px;height:fit-content}
.about-side h3{font-size:16px;margin-bottom:12px;color:var(--gold2)}
.about-side li{padding:7px 0;border-bottom:1px dashed var(--line);font-size:14px;color:var(--sub)}
.about-side b{color:var(--txt)}
.side-contact{margin-top:16px;text-align:center;background:#1c2940;border-radius:8px;padding:14px;font-size:14px}
.side-contact p:first-child{font-weight:700;color:var(--gold2)}

/* cards */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:26px 22px;transition:border-color .2s,transform .2s}
.card:hover{border-color:var(--gold);transform:translateY(-4px)}
.card h3{font-size:18px;margin-bottom:10px;color:var(--gold2)}
.card p{font-size:14px;color:var(--sub)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.adv{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:22px}
.adv b{display:block;font-size:16px;color:var(--gold2);margin-bottom:8px}
.adv span{font-size:13px;color:var(--sub)}

/* flow */
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:s}
.flow li{counter-increment:s;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:24px 20px;position:relative}
.flow li::before{content:"0" counter(s);position:absolute;top:14px;right:16px;font-size:26px;font-weight:800;color:#2c3c58}
.flow h3{font-size:16px;margin-bottom:8px;color:var(--gold2)}
.flow p{font-size:13px;color:var(--sub)}

/* news */
.news{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.post{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:24px}
.post h3{font-size:17px;color:var(--gold2);margin-bottom:10px;line-height:1.5}
.post h4{font-size:15px;color:var(--gold2);margin-bottom:8px}
.post p{font-size:14px;color:var(--sub)}

/* faq */
details{background:var(--bg2);border:1px solid var(--line);border-radius:10px;margin-bottom:12px;padding:0 18px}
summary{padding:15px 0;font-weight:600;cursor:pointer;list-style:none}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";float:right;color:var(--gold)}
details[open] summary::after{content:"−"}
details p{padding:0 0 15px;color:var(--sub);font-size:14px}

/* contact */
.contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:20px}
.cbox{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:28px 22px;text-align:center}
.cbox h3{font-size:16px;color:var(--gold2);margin-bottom:12px}
.cval{font-size:22px;font-weight:700;letter-spacing:1px;margin-bottom:16px}
.manager{text-align:center;background:#1c2940;border-radius:10px;padding:14px;font-size:15px}

/* footer */
.site-footer{padding:44px 0 80px;text-align:center;color:var(--sub);font-size:14px}
.f-brand{font-size:17px;font-weight:700;color:var(--txt);margin-bottom:8px}
.f-contact{margin-bottom:14px}
.f-nav{display:flex;justify-content:center;flex-wrap:wrap;gap:18px;margin-bottom:14px}
.f-nav a:hover{color:var(--gold2)}
.f-copy{font-size:12px;color:#5f6c85}

/* float */
.float-bar{position:fixed;right:16px;bottom:18px;z-index:60;display:flex;flex-direction:column;gap:8px}
.fb-item{background:linear-gradient(135deg,var(--gold),#b8924a);color:#151515;font-weight:600;border:0;border-radius:999px;padding:10px 18px;font-size:14px;cursor:pointer;box-shadow:0 6px 18px #0006}
.toast{position:fixed;left:50%;bottom:80px;transform:translateX(-50%) translateY(20px);background:#2a3a58;color:#fff;padding:9px 22px;border-radius:999px;font-size:14px;opacity:0;pointer-events:none;transition:.25s;z-index:99}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* mobile */
@media(max-width:860px){
  .menu-btn{display:block}
  .nav{display:none;position:absolute;top:64px;left:0;right:0;flex-direction:column;background:var(--bg2);border-bottom:1px solid var(--line);padding:10px 4%;gap:0}
  .nav.open{display:flex}
  .nav a{padding:12px 0;border-bottom:1px dashed var(--line)}
  .about-grid,.news,.contact-grid{grid-template-columns:1fr}
  .grid,.grid-4,.flow{grid-template-columns:1fr 1fr}
  .hero{padding:56px 0 48px}
  .sec{padding:46px 0}
}
@media(max-width:520px){
  .grid,.grid-4,.flow{grid-template-columns:1fr}
  .float-bar{flex-direction:row;right:50%;transform:translateX(50%)}
}