:root{
  --ink:#12161c; --muted:#5b6672; --line:#e3e7ec; --bg:#ffffff;
  --accent:#0f5d4a; --accent-ink:#ffffff; --soft:#f6f8f7;
  --max: 1080px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font:16px/1.62 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Helvetica,Arial,sans-serif;
  letter-spacing:.01em;
}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  max-width:var(--max); margin:0 auto; padding:20px 24px; border-bottom:1px solid var(--line);
}
.brand{font-weight:700; font-size:18px; color:var(--ink); letter-spacing:-.01em}
.brand span{font-weight:400; color:var(--muted); font-size:13px}
.nav nav{display:flex; align-items:center; gap:20px; font-size:14px}
.btn,.btn-sm{
  display:inline-block; background:var(--accent); color:var(--accent-ink);
  padding:13px 22px; border-radius:8px; font-weight:600; font-size:15px;
}
.btn:hover,.btn-sm:hover{text-decoration:none; filter:brightness(1.08)}
.btn-sm{padding:9px 16px; font-size:13px}
.btn.ghost{background:transparent; color:var(--ink); border:1px solid var(--line)}
main{max-width:var(--max); margin:0 auto; padding:0 24px}
section{padding:64px 0; border-bottom:1px solid var(--line)}
h1{font-size:clamp(30px,5vw,48px); line-height:1.14; letter-spacing:-.02em; margin:12px 0 20px; max-width:20ch}
h2{font-size:clamp(22px,3vw,30px); letter-spacing:-.015em; margin:0 0 24px}
h3{font-size:17px; margin:0 0 8px}
.kicker{color:var(--muted); font-size:13px; text-transform:uppercase; letter-spacing:.09em; margin:0}
.lede{font-size:clamp(17px,2.2vw,20px); color:#2b333c; max-width:62ch}
.cta-row{display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin:32px 0 12px}
.fineprint{color:var(--muted); font-size:13px; margin:8px 0 0}
.stats{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:24px; margin:8px 0 20px}
.stats div{border-left:3px solid var(--accent); padding-left:16px}
.stats strong{display:block; font-size:40px; line-height:1; letter-spacing:-.03em}
.stats span{display:block; color:var(--muted); font-size:14px; margin-top:8px}
.note{color:var(--muted); font-size:13px}
.cards{list-style:none; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:20px; margin:0}
.cards li{background:var(--soft); border:1px solid var(--line); border-radius:12px; padding:22px}
.cards p{margin:0; color:#3a444e; font-size:15px}
.teaser-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; margin-bottom:24px}
.teaser-grid article{border:1px solid var(--line); border-radius:12px; padding:20px}
.teaser-grid p{margin:0 0 8px; font-size:14px; color:#3a444e}
.tag{color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.07em}
.price{font-size:52px; font-weight:700; letter-spacing:-.03em; margin:0 0 20px}
.price span{font-size:18px; font-weight:400; color:var(--muted); letter-spacing:0}
.checks{list-style:none; padding:0; margin:0 0 28px; max-width:56ch}
.checks li{padding-left:26px; position:relative; margin-bottom:10px}
.checks li:before{content:"✓"; position:absolute; left:0; color:var(--accent); font-weight:700}
details{border-top:1px solid var(--line); padding:16px 0}
details:first-of-type{border-top:none}
summary{cursor:pointer; font-weight:600}
details p{color:#3a444e; margin:10px 0 0}
footer{max-width:var(--max); margin:0 auto; padding:32px 24px 64px; color:var(--muted); font-size:13px}
/* sample brief page */
.brief{max-width:820px}
.brief h1{max-width:none}
.brief h2{font-size:22px; margin-top:44px; border-top:1px solid var(--line); padding-top:28px}
.recall{border:1px solid var(--line); border-radius:10px; padding:18px; margin:0 0 14px}
.recall h3{font-size:16px; margin:0 0 10px}
.recall dl{margin:0; display:grid; grid-template-columns:110px 1fr; gap:6px 14px; font-size:14px}
.recall dt{color:var(--muted)}
.recall dd{margin:0; color:#2b333c}
/* /recalls/battery 表格（2026-11-05）*/
.table-wrap{overflow-x:auto; margin:0 0 28px; border:1px solid var(--line); border-radius:10px}
.recall-table{width:100%; border-collapse:collapse; font-size:14px; min-width:760px}
.recall-table th{text-align:left; font-size:12px; text-transform:uppercase; letter-spacing:.07em; color:var(--muted); background:var(--soft); padding:12px 14px; border-bottom:1px solid var(--line); white-space:nowrap}
.recall-table td{padding:12px 14px; border-bottom:1px solid var(--line); vertical-align:top; color:#2b333c}
.recall-table tr:last-child td{border-bottom:none}
.recall-table td:first-child{white-space:nowrap; color:var(--muted)}
@media (max-width:640px){
  .nav{flex-direction:column; align-items:flex-start; gap:12px}
  .nav nav{gap:14px; flex-wrap:wrap}
  .recall dl{grid-template-columns:1fr}
  .recall dt{margin-top:6px}
}