:root{
  --graphite:#1B2028; --graphite-2:#262D38; --steel:#46505E;
  --paper:#F3F4F1; --paper-2:#E7E9E3; --accent:#1D6FB8; --accent-dark:#155A96;
  --warn:#E8B23B; --line:#D8DAD3; --radius:3px;
  --sans:-apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --mono:ui-monospace, "SF Mono", Consolas, monospace;
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--sans);color:var(--graphite);background:var(--paper);line-height:1.5}
a{color:var(--accent-dark)}
img{max-width:100%;display:block}
h1,h2,h3{font-weight:700;letter-spacing:-.01em;margin:0 0 .5rem}
.wrap{max-width:1100px;margin:0 auto;padding:0 1.25rem}

.top{background:var(--graphite-2);color:#D7DBE2;font-size:.8rem}
.top .wrap{display:flex;flex-wrap:wrap;gap:.5rem 1rem;justify-content:space-between;padding-top:.5rem;padding-bottom:.5rem;max-width:1100px}
.top a{color:#fff;text-decoration:none}

header{position:sticky;top:0;z-index:40;background:var(--graphite);border-bottom:3px solid var(--accent)}
header nav.wrap{display:flex;align-items:center;justify-content:space-between;gap:.7rem 1rem;padding-top:.9rem;padding-bottom:.9rem;max-width:1100px;flex-wrap:wrap}
.brand{color:#fff;text-decoration:none;font-family:var(--mono);font-weight:600;font-size:1.15rem;display:flex;align-items:center;gap:.5rem}
.brand .mark{display:block;flex-shrink:0;width:44px;height:44px;border-radius:50%;font-size:0;line-height:0;color:transparent;background:url(images/logo.png) center/cover no-repeat;box-shadow:0 0 0 2px rgba(255,255,255,.35)}
.brand small{display:block;color:#9AA4B2;font-family:var(--sans);font-weight:400;font-size:.65rem;letter-spacing:.03em}
.links{display:flex;gap:1.3rem}
.links a{color:#D7DBE2;text-decoration:none;font-size:.92rem}
.links a:hover{color:#fff}
button.menu{display:none;background:none;border:0;color:#fff;font-size:1.3rem}

main.page-main{padding:2rem 0 3.5rem}
.breadcrumbs{font-size:.82rem;color:var(--steel);margin-bottom:1.1rem;display:flex;gap:.4rem;flex-wrap:wrap}
.breadcrumbs a{color:var(--accent-dark);text-decoration:none}
.page-heading{margin-bottom:1.6rem}
.page-heading p{color:var(--steel);max-width:70ch}
.model-meta{display:inline-block;font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;color:var(--accent-dark);background:var(--paper-2);padding:.2rem .5rem;border-radius:var(--radius);margin-bottom:.5rem}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.1rem}
.card.product-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column;padding:0;transition:border-color .15s}
.card.product-card:hover{border-color:var(--accent)}
.card.product-card img{aspect-ratio:4/3;object-fit:contain;background:var(--paper-2);width:100%;padding:.5rem}
.card.product-card h2{font-size:.9rem;margin:.7rem .9rem 0}
.card.product-card .variant{font-size:.8rem;color:var(--steel);margin:.3rem .9rem 0}
.card.product-card .card-link{font-size:.78rem;font-weight:600;color:var(--accent-dark);margin:.6rem .9rem .9rem}

.product-intro{display:flex;gap:2rem;flex-wrap:wrap;margin-bottom:1.6rem}
.product-photos{flex:1 1 280px;background:var(--paper-2);border-radius:var(--radius);overflow:hidden;display:flex;align-items:center;justify-content:center;min-height:200px}
.product-photos img{width:100%;height:auto;object-fit:contain}
.product-copy{flex:2 1 320px}
.product-copy h1{font-size:1.4rem}
.actions{margin-top:1rem}
.actions .secondary{display:inline-block;font-size:.82rem;color:var(--accent-dark);border:1px solid var(--line);border-radius:var(--radius);padding:.4rem .8rem;text-decoration:none}
.actions .secondary:hover{border-color:var(--accent)}

.doc-section{margin-top:1rem}
.doc-section h2{font-size:1.05rem}
.doc-section table{width:100%;border-collapse:collapse;font-size:.9rem;background:#fff;border:1px solid var(--line)}
.doc-section th,.doc-section td{padding:.5rem .7rem;border-bottom:1px solid var(--line);text-align:left;font-weight:400}
.doc-section th{color:var(--steel);width:45%}
.doc-section td{font-family:var(--mono)}

.back-link{display:inline-block;margin-top:1.6rem;font-size:.85rem;color:var(--accent-dark);text-decoration:none}
.back-link:hover{text-decoration:underline}

footer{background:var(--graphite);color:#9AA4B2;margin-top:2rem}
footer .foot{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;justify-content:space-between;padding:1.4rem 1.25rem;font-size:.82rem;max-width:1100px;margin:0 auto}