/* PAGE HERO */
.page-hero {
background: var(--navy);
padding: 10rem 5% 5rem;
border-bottom: 1px solid rgba(255,255,255,0.06);
}
.page-hero-inner { max-width: 640px; }
.page-hero h1 {
font-family: var(--serif);
font-size: clamp(2.2rem, 4vw, 3.5rem);
color: var(--cream);
line-height: 1.1;
margin-bottom: 1rem;
}
.page-hero .section-eyebrow { color: var(--rust-light); margin-bottom: 1rem; }
.page-hero .section-eyebrow::before { background: var(--rust-light); }
.page-hero-desc {
font-size: 1rem;
color: var(--silver-light);
line-height: 1.8;
max-width: 480px;
}

/* CATALOG SECTION */
.catalog-section {
background: var(--cream-light);
padding: 4rem 5%;
min-height: 60vh;
}
.catalog-controls {
display: flex;
flex-direction: column;
gap: 1.25rem;
margin-bottom: 1.25rem;
}
.catalog-search {
width: 100%;
max-width: 440px;
padding: 0.7rem 1rem;
border: 1.5px solid var(--silver-light);
border-radius: 3px;
font-family: var(--body);
font-size: 0.9rem;
background: var(--white);
color: var(--text-dark);
outline: none;
transition: border-color 0.2s;
}
.catalog-search:focus { border-color: var(--rust); }

.filter-tabs { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.filter-tab {
background: var(--white);
border: 1.5px solid var(--silver-light);
color: var(--text-muted);
font-family: var(--sans);
font-size: 0.72rem;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
padding: 0.45rem 1rem;
border-radius: 2px;
cursor: pointer;
transition: border-color 0.2s, color 0.2s, background 0.2s;
}
.filter-tab:hover { border-color: var(--rust); color: var(--rust); }
.filter-tab.active { background: var(--navy); border-color: var(--navy); color: var(--cream); }

.catalog-count {
font-family: var(--sans);
font-size: 0.72rem;
font-weight: 600;
letter-spacing: 0.08em;
color: var(--text-muted);
text-transform: uppercase;
margin-bottom: 1.5rem;
}

.catalog-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1.5px;
background: var(--silver-light);
border: 1.5px solid var(--silver-light);
}
.catalog-empty {
text-align: center;
padding: 4rem 0;
font-size: 1rem;
color: var(--text-muted);
}

/* PRODUCT CARD */
.catalog-card {
background: var(--cream-light);
padding: 2rem;
display: flex;
flex-direction: column;
gap: 0.75rem;
transition: background 0.2s;
}
.catalog-card:hover { background: var(--white); }
.catalog-card.has-image {
flex-direction: row-reverse;
align-items: flex-start;
gap: 1.25rem;
}
.card-imgs {
display: flex;
flex-direction: column;
gap: 0.5rem;
flex-shrink: 0;
align-self: flex-start;
}
.card-img {
width: 120px;
height: 120px;
object-fit: contain;
background: #f5f7fa;
border: 1px solid var(--silver-light);
border-radius: 2px;
display: block;
}
.card-body {
flex: 1;
display: flex;
flex-direction: column;
gap: 0.75rem;
min-width: 0;
}
.card-top {
display: flex;
justify-content: space-between;
align-items: center;
gap: 0.5rem;
}
.card-sku {
font-family: var(--sans);
font-size: 0.65rem;
font-weight: 700;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--rust);
}
.badge-stock {
font-family: var(--sans);
font-size: 0.62rem;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
padding: 0.2rem 0.55rem;
border-radius: 2px;
}
.badge-stock.in { background: rgba(13,27,42,0.07); color: var(--steel); }
.badge-stock.out { background: rgba(196,92,38,0.1); color: var(--rust); }

.catalog-card h3 {
font-family: var(--sans);
font-size: 0.95rem;
font-weight: 700;
letter-spacing: 0.04em;
text-transform: uppercase;
color: var(--navy);
line-height: 1.35;
}
.catalog-card .card-brand {
font-size: 0.8rem;
color: var(--text-muted);
font-style: italic;
margin: 0;
}
.catalog-card .card-desc {
font-size: 0.88rem;
color: var(--text-muted);
line-height: 1.75;
flex: 1;
margin: 0;
}
.card-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.card-footer {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 0.5rem;
padding-top: 1rem;
border-top: 1px solid var(--silver-light);
gap: 0.75rem;
}
.card-price {
font-family: var(--sans);
font-size: 0.8rem;
font-weight: 700;
color: var(--navy);
letter-spacing: 0.04em;
}
.card-price.qor { color: var(--text-muted); font-style: italic; font-weight: 400; }
.btn-quote {
display: inline-block;
background: var(--rust);
color: var(--white);
text-decoration: none;
padding: 0.5rem 1rem;
font-family: var(--sans);
font-size: 0.7rem;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
border-radius: 2px;
white-space: nowrap;
transition: background 0.2s;
}
.btn-quote:hover { background: var(--rust-light); }
.btn-add-cart {
display: inline-block;
background: var(--navy);
color: var(--white);
border: none;
cursor: pointer;
padding: 0.5rem 1rem;
font-family: var(--sans);
font-size: 0.7rem;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
border-radius: 2px;
white-space: nowrap;
transition: background 0.2s, opacity 0.2s;
}
.btn-add-cart:hover { background: var(--steel); }
.btn-add-cart:disabled { opacity: 0.65; cursor: default; }

@media (max-width: 900px) {
.catalog-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
.catalog-grid { grid-template-columns: 1fr; }
}