/* =========================================================
   EEZYPRINT — catalog.css
   Product grid, icon tiles, detail-page spec sheets,
   breadcrumbs. Loaded after style.css.
   ========================================================= */

/* ---------- breadcrumb ---------- */
.breadcrumb{
  font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;
  color:var(--ink-soft);padding:16px 0;display:flex;flex-wrap:wrap;gap:6px;align-items:center;
}
.breadcrumb a:hover{text-decoration:underline;color:var(--ink);}
.breadcrumb .sep{opacity:.5;}
.breadcrumb .current{color:var(--ink);}

/* ---------- icon system ---------- */
.icon-tile{
  --tile:var(--print);
  background:var(--tile);
  display:flex;align-items:center;justify-content:center;
  position:relative;
}
.icon-tile svg{width:44%;height:44%;stroke:#fff;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.icon-tile.tone-print{--tile:var(--print);}
.icon-tile.tone-brand{--tile:var(--brand);}
.icon-tile.tone-sign{--tile:var(--sign);}
.icon-tile.tone-vehicle{--tile:var(--vehicle);}
.icon-tile.tone-package{--tile:var(--package);}
.icon-tile.tone-design{--tile:var(--design);}

/* ---------- category hub cards (3 main) ---------- */
.hub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.hub-card{background:var(--paper-raised);display:flex;flex-direction:column;min-height:360px;}
.hub-card .icon-tile{height:180px;}
.hub-card .icon-tile svg{width:64px;height:64px;}
.hub-card .hub-body{padding:28px 26px 30px;display:flex;flex-direction:column;flex:1;}
.hub-card .eyebrow{margin-bottom:10px;}
.hub-card h3{font-size:26px;}
.hub-card p{color:var(--ink-soft);font-size:14.5px;flex:1;}
.hub-card .count{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-soft);margin-bottom:14px;}
.hub-card .go{font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:.06em;margin-top:auto;display:inline-flex;gap:8px;}
.hub-card:hover{background:var(--paper);}
.hub-card:hover .go{text-decoration:underline;}

/* ---------- product grid (category listing pages) ---------- */
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.product-card{background:var(--paper-raised);display:flex;flex-direction:column;}
.product-card .icon-tile{height:128px;}
.product-card .card-body{padding:16px 16px 18px;display:flex;flex-direction:column;flex:1;}
.product-card .tag{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-soft);margin-bottom:8px;
}
.product-card h3{font-family:var(--font-body);font-weight:600;font-size:14.5px;margin:0 0 6px;line-height:1.3;}
.product-card p{font-size:12.5px;color:var(--ink-soft);flex:1;margin:0 0 12px;}
.product-card .card-foot{display:flex;justify-content:space-between;align-items:center;font-family:var(--font-mono);font-size:11px;}
.product-card .card-foot .price{color:var(--ink);font-weight:600;}
.product-card .card-foot .view{text-transform:uppercase;letter-spacing:.05em;color:var(--ink-soft);}
.product-card:hover{background:var(--paper);}
.product-card:hover .card-foot .view{text-decoration:underline;color:var(--ink);}

/* ---------- filter pills (category listing pages) ---------- */
.filter-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:32px;}
.filter-pill{
  font-family:var(--font-mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;
  padding:8px 14px;border:1px solid var(--line);background:var(--paper-raised);cursor:pointer;
  display:inline-flex;align-items:center;gap:7px;
}
.filter-pill .sw{width:8px;height:8px;}
.filter-pill.is-active{border-color:var(--ink);background:var(--ink);color:var(--paper);}
.filter-pill.is-active .sw{background:currentColor !important;}

/* ---------- product detail page ---------- */
.product-hero{display:grid;grid-template-columns:.85fr 1.15fr;gap:1px;background:var(--line);border:1px solid var(--line);}
.product-hero .icon-tile{min-height:320px;}
.product-hero .icon-tile svg{width:120px;height:120px;}
.product-hero-body{background:var(--paper-raised);padding:40px;display:flex;flex-direction:column;justify-content:center;}
.product-hero-body .eyebrow{margin-bottom:14px;}
.product-hero-body h1{font-size:clamp(28px,4vw,44px);}
.product-hero-body .lede{color:var(--ink-soft);font-size:16.5px;margin-top:14px;}
.product-price-row{
  display:flex;align-items:center;gap:18px;margin-top:24px;padding-top:22px;border-top:1px solid var(--line);
}
.product-price-row .price{font-family:var(--font-display);font-size:28px;}
.product-price-row .price.poa{font-size:18px;}
.product-price-row .price-lbl{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);display:block;}

/* ---------- spec sheet ---------- */
.spec-sheet{border:1px solid var(--line);background:var(--paper-raised);}
.spec-sheet .spec-head{
  font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);
  padding:14px 22px;border-bottom:1px solid var(--line);
}
.spec-row{display:grid;grid-template-columns:1fr 1.6fr;border-top:1px solid var(--line);}
.spec-row:first-of-type{border-top:0;}
.spec-row dt{
  font-family:var(--font-mono);font-size:12px;color:var(--ink-soft);padding:16px 22px;
  border-right:1px solid var(--line);
}
.spec-row dd{margin:0;padding:16px 22px;font-size:14.5px;}

/* ---------- related strip ---------- */
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}

/* ---------- quote form ---------- */
.quote-form{border:1px solid var(--line);background:var(--paper-raised);padding:36px;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:24px;}
.quote-form label{display:flex;flex-direction:column;gap:8px;font-family:var(--font-mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);}
.quote-form .span-2{grid-column:1 / -1;}
.quote-form input,.quote-form textarea{
  font-family:var(--font-body);font-size:15px;color:var(--ink);background:var(--paper);
  border:1px solid var(--line);padding:12px 14px;resize:vertical;
}
.quote-form input:focus,.quote-form textarea:focus{border-color:var(--ink);outline:none;}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .form-grid{grid-template-columns:1fr;}
  .hub-grid{grid-template-columns:1fr;}
  .product-grid{grid-template-columns:repeat(2,1fr);}
  .product-hero{grid-template-columns:1fr;}
  .product-hero .icon-tile{min-height:220px;}
  .related-grid{grid-template-columns:1fr;}
  .spec-row{grid-template-columns:1fr;}
  .spec-row dt{border-right:0;border-bottom:1px solid var(--line);}
}
@media (max-width:640px){
  .product-grid{grid-template-columns:1fr;}
}