:root { --ink:#1a1a1a; --muted:#5c5c5c; --line:#e6e6e6; --bg:#fff; --soft:#f5f5f5; --accent:#7a1f3d; }
* { box-sizing:border-box; }
body { margin:0; font:15px/1.55 system-ui,sans-serif; color:var(--ink); background:var(--bg); }
body > h1, body > h2, body > p, body > table, body > form, body > ul, body > label { margin-left:6vw; margin-right:6vw; }
a { color:inherit; }
.util, .cats, .crumb, .pdp, .tabbar, .block, .like, .foot, .hero, .band { padding-left:6vw; padding-right:6vw; }
.util { display:flex; align-items:center; gap:1.2rem; padding-top:.8rem; padding-bottom:.8rem; border-bottom:1px solid var(--line); }
.logo { font-weight:700; font-size:1.35rem; letter-spacing:.04em; text-decoration:none; }
.util nav, .cats { display:flex; gap:1rem; flex-wrap:wrap; }
.util nav a, .cats a { text-decoration:none; font-size:.92rem; }
.search { margin-left:auto; border:1px solid #ccc; border-radius:20px; padding:.35rem .8rem; min-width:180px; }
.cats { padding-top:.55rem; padding-bottom:.55rem; border-bottom:1px solid var(--line); font-size:.92rem; }
.crumb { color:var(--muted); font-size:.85rem; padding-top:.8rem; }
.crumb a { text-decoration:none; }
.pdp { display:grid; grid-template-columns:minmax(240px,380px) 1fr; gap:2rem; padding-top:1.2rem; padding-bottom:1rem; }
.shot { background:var(--soft); min-height:320px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.6rem; color:var(--muted); text-align:center; padding:1rem; }
.shot img { width:100%; max-height:460px; object-fit:contain; }
.card img { width:100%; height:150px; object-fit:contain; background:#fff; display:block; margin-bottom:.4rem; }
.pdp h1 { font-size:2.4rem; font-weight:500; margin:.2rem 0; }
.sub { color:var(--muted); margin:0 0 1rem; }
.ticks { padding-left:1.1rem; }
.ticks li { margin:.25rem 0; }
.tabbar { display:flex; gap:1.5rem; border-bottom:1px solid var(--line); position:sticky; top:0; background:#fff; z-index:2; }
.tabbar a { text-decoration:none; padding:.8rem 0; border-bottom:2px solid transparent; }
.tabbar a:hover { border-color:var(--accent); color:var(--accent); }
.block { padding-top:1.4rem; padding-bottom:.4rem; }
.block h2 { font-weight:500; font-size:1.35rem; }
.subtabs { display:flex; gap:.4rem; margin:1rem 0; }
.subtabs a { text-decoration:none; background:var(--soft); border-radius:8px 8px 0 0; padding:.45rem .8rem; }
.spec { width:100%; border-collapse:collapse; }
.spec th, .spec td { text-align:left; padding:.55rem .2rem; border-bottom:1px solid var(--line); vertical-align:top; }
.spec th { width:16rem; color:var(--muted); font-weight:500; }
.two { display:grid; grid-template-columns:1fr 1fr; gap:2rem; margin-top:1.5rem; }
.likegrid, .grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.card { display:block; background:var(--soft); min-height:160px; padding:1rem; text-decoration:none; }
.card h3 { margin:.4rem 0; font-weight:500; }
.card p { color:var(--muted); margin:0; }
.note { color:var(--muted); }
.hero { padding-top:2.5rem; padding-bottom:1rem; }
.hero h1 { font-size:2.2rem; font-weight:500; margin:0 0 .4rem; }
.btn { display:inline-block; background:var(--accent); color:#fff; text-decoration:none; padding:.6rem 1rem; margin-right:.5rem; }
.foot { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; background:var(--soft); padding-top:1.5rem; padding-bottom:2rem; margin-top:2rem; }
.foot h3 { font-size:.95rem; margin:0 0 .4rem; }
.foot a, .foot p { display:block; color:var(--muted); text-decoration:none; font-size:.88rem; margin:.2rem 0; }
.tag { color:var(--accent); font-size:.8rem; }
.filters { display:flex; gap:.4rem; flex-wrap:wrap; padding:0 6vw .5rem; }
.filters button { border:1px solid #ccc; background:#fff; border-radius:16px; padding:.25rem .7rem; cursor:pointer; }
.filters button.on { background:var(--ink); color:#fff; }
input, textarea, select { width:100%; max-width:32rem; font:15px system-ui,sans-serif; padding:.5rem; border:1px solid #ccc; }
label { display:block; margin:.7rem 0 .2rem; }
@media (max-width:800px) { .pdp, .two, .likegrid, .grid, .foot { grid-template-columns:1fr 1fr; } .search { display:none; } }
