:root{--max:1120px;--pad:16px;--radius:14px;--bg:#fff;--fg:#111;--muted:#666;--line:#eee}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;color:var(--fg);background:var(--bg)}
.container{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
a{color:inherit}
img{max-width:100%;height:auto}
header{position:sticky;top:0;background:var(--bg);border-bottom:1px solid var(--line);z-index:10}
.navrow{display:flex;align-items:center;justify-content:space-between;padding:10px 0}
.brand img{display:block}
.menu{display:block}
.menu>summary{list-style:none;cursor:pointer;padding:8px 12px;border:1px solid var(--line);border-radius:10px}
.menu[open] > summary{background:#f7f7f7}
.menu ul{margin:8px 0 0;padding:0;list-style:none;display:grid;gap:6px}
.menu li a{display:block;padding:8px 10px;border-radius:10px;text-decoration:none}
.menu li a:hover{background:#f5f5f5}
@media(min-width:900px){
  .menu{display:none}
  nav.links{display:flex;gap:14px}
  nav.links a{padding:8px 10px;border-radius:10px;text-decoration:none}
  nav.links a:hover{background:#f5f5f5}
}
.hero{padding:0 0 16px;background:linear-gradient(180deg,#f9fafb,transparent)}
.grid{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:720px){.grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.grid{grid-template-columns:repeat(3,1fr)}}
.card{padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg)}
.card h3{margin:0 0 8px}
.cta{display:inline-block;margin-top:8px;padding:10px 14px;border-radius:12px;background:#111;color:#fff;text-decoration:none}
.breadcrumb{font-size:14px;margin:8px 0 12px;color:#555}
.breadcrumb a{text-decoration:none;color:inherit}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.table{width:100%;border-collapse:collapse;min-width:560px}
.table th,.table td{padding:10px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
footer{border-top:1px solid var(--line);margin-top:40px}
.footergrid{display:grid;gap:10px;grid-template-columns:1fr}
@media(min-width:760px){.footergrid{grid-template-columns:repeat(3,1fr)}}
small,.muted{color:var(--muted)}
.badge{display:inline-block;padding:4px 8px;background:#f0f0f0;border-radius:999px;font-size:12px}
@media(prefers-color-scheme:dark){
  :root{--bg:#0c0c0c;--fg:#e6e6e6;--line:#1b1b1b}
  .cta{background:#e6e6e6;color:#0c0c0c}
  .menu li a:hover, nav.links a:hover{background:#151515}
}