.hardware-page { width:min(var(--page-width),calc(100% - var(--page-gutter))); margin:auto; padding:clamp(60px,9vw,105px) 0 110px; }
.hardware-hero { max-width:780px; margin-bottom:48px; }
.eyebrow,.availability { color:var(--lime); font:500 var(--type-label) var(--font-mono); letter-spacing:.13em; text-transform:uppercase; }
.hardware-hero h1 { margin:18px 0 20px; font-size:var(--type-page-title); line-height:.94; letter-spacing:-.07em; }
.hardware-hero > p:last-child { max-width:650px; color:var(--muted); font-size:var(--type-body-large); line-height:1.75; }
.kit-card { display:grid; grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr); overflow:hidden; border:1px solid rgba(52,211,153,.25); border-radius:24px; background:linear-gradient(145deg,rgba(52,211,153,.1),#131A22 58%); box-shadow:0 28px 75px rgba(0,0,0,.3); }
.kit-visual { min-height:430px; padding:58px; display:grid; grid-template-columns:repeat(3,52px); grid-auto-rows:52px; place-content:center; gap:18px; background:radial-gradient(circle,rgba(52,211,153,.15),transparent 65%); }
.kit-visual span { border:1px solid rgba(52,211,153,.65); border-radius:12px; background:#172326; box-shadow:inset 0 0 0 1px rgba(52,211,153,.08); }
.kit-content { padding:clamp(30px,6vw,64px); }
.availability { margin:0 0 18px; }
.kit-content h2 { margin:0 0 18px; font-size:var(--type-section-title); line-height:1.08; letter-spacing:-.045em; }
.kit-description,.notify-note { color:var(--muted); line-height:1.7; }
.kit-details { margin:26px 0 32px; padding:0; display:grid; gap:11px; list-style:none; color:#c9d5d7; }
.kit-details li::before { content:"✓"; margin-right:10px; color:var(--lime); }
.notify-button { min-height:48px; padding:0 20px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--lime); border-radius:10px; background:var(--lime); color:#07110C; font-weight:800; text-decoration:none; }
.notify-button:hover,.notify-button:focus-visible { background:#2EC48E; outline:0; box-shadow:0 0 0 1px rgba(52,211,153,.12); }
.notify-note { margin:15px 0 0; font-size:var(--type-help); }
.notify-note a { color:var(--lime); }
@media (max-width:760px) { .hardware-page { width:calc(100% - var(--page-gutter)); padding-top:52px; } .kit-card { grid-template-columns:1fr; } .kit-visual { min-height:260px; grid-template-columns:repeat(3,40px); grid-auto-rows:40px; padding:38px; } }