.hardware-page{overflow-x:hidden}

.hardware-hero{position:relative}
.hardware-hero-grid{display:grid;grid-template-columns:2fr 1fr;min-height:70vh}
.hardware-hero-image{position:relative}
.hardware-hero-image img{width:100%;height:100%;object-fit:cover}
.hardware-hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,#12141A 20%,rgba(18,20,26,0.6) 60%,transparent)}
.hardware-hero-content{display:flex;align-items:center}
.hardware-hero-text{max-width:42ch;display:flex;flex-direction:column;gap:var(--space-3)}

.hardware-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4)}
.hardware-card{background:var(--color-bg-secondary);border:1px solid var(--color-border-subtle);padding:var(--space-3);border-radius:var(--radius-sm);transition:transform var(--transition-base)}
.hardware-card:hover{transform:translateY(-4px)}

.hardware-categories{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--space-3)}
.hardware-category{padding:var(--space-3);border:1px solid var(--color-border-subtle);border-radius:var(--radius-sm);text-align:center;transition:background var(--transition-base)}
.hardware-category:hover{background:var(--color-surface-elevated)}

.hardware-setup{display:grid;grid-template-columns:2fr 1fr;gap:var(--space-4);align-items:center}
.hardware-setup-text{max-width:55ch}

.hardware-sets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4)}

.hardware-guides{max-width:700px}
.hardware-guide-list{display:flex;flex-direction:column;gap:var(--space-2)}
.hardware-guide-list a{border-bottom:1px solid var(--color-border-subtle);padding-bottom:var(--space-1)}

.hardware-analysis{display:grid;grid-template-columns:1fr;gap:var(--space-3)}
.hardware-analysis-text{max-width:65ch}

.hardware-trending ol{padding-left:1rem}

.hardware-newsletter{max-width:500px;margin-inline:auto;text-align:center}
.hardware-form{display:flex;gap:var(--space-2);margin-top:var(--space-3)}

@media (max-width:1000px){
.hardware-hero-grid{grid-template-columns:1fr}
.hardware-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.hardware-categories{grid-template-columns:repeat(3,minmax(0,1fr))}
.hardware-sets{grid-template-columns:repeat(2,minmax(0,1fr))}
.hardware-setup{grid-template-columns:1fr}
}

@media (max-width:600px){
.hardware-grid{grid-template-columns:1fr}
.hardware-categories{grid-template-columns:repeat(2,minmax(0,1fr))}
.hardware-sets{grid-template-columns:1fr}
}
