/* ENVIZHL — pages.css: product pages, category hubs, and the footer
   category row added to every page. Reuses site.css tokens/classes; this
   file only adds what site.css doesn't already have. */

.footWrap{display:flex;flex-direction:column;gap:14px}
.footCats{font-family:var(--mono);font-size:11px;letter-spacing:.02em;color:var(--mutL);line-height:1.8}
.footCats a{color:var(--mutL)}
.footCats a:hover{color:#fff}
.footRow{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}

/* breadcrumbs */
.crumbs{font-family:var(--mono);font-size:11.5px;color:var(--mut);letter-spacing:.02em;
  margin:14px 0 22px;flex-wrap:wrap;display:flex;gap:6px;align-items:baseline}
.crumbs a{color:var(--mut)}
.crumbs a:hover{color:var(--ink)}
.crumbs span{color:var(--ink)}

/* category link chips (home + hub pages) */
.hubLinks{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 0}
.hubLinks a{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;
  border:1px solid var(--line);border-radius:999px;padding:9px 16px;color:var(--mut);background:transparent}
.hubLinks a:hover{color:var(--ink);border-color:var(--ink)}
.hubLinks a.cur{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.hubLinks.text{gap:6px 16px;align-items:baseline;margin:16px 0 0}
.hubLinks.text .hubLead{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mut)}
.hubLinks.text a{border:0;border-radius:0;padding:0;background:none;font-family:inherit;font-size:14px;letter-spacing:0;
  text-transform:none;color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}
.hubLinks.text a:hover{text-decoration-color:var(--ink)}

/* ---------- product page ---------- */
.prodPage{padding-bottom:0}
.prodGrid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(26px,4vw,56px);align-items:start;margin-top:4px}
@media(max-width:900px){.prodGrid{grid-template-columns:1fr;gap:22px}}
.prodGallery{position:sticky;top:clamp(74px,10vh,110px)}
@media(max-width:900px){.prodGallery{position:static}}
.prodBig{border-radius:10px;overflow:hidden;background:var(--mat,#e8e4dc);aspect-ratio:4/5;
  box-shadow:0 30px 60px -30px rgba(17,16,20,.5)}
.prodBig img{width:100%;height:100%;object-fit:contain}
.prodThumbs{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.prodThumbs .pt{flex:0 0 calc(25% - 6px);aspect-ratio:4/5;border-radius:6px;overflow:hidden;background:var(--mat,#e8e4dc)}
@media(max-width:560px){.prodThumbs .pt{flex:0 0 calc(33.33% - 6px)}}
.prodThumbs img{width:100%;height:100%;object-fit:contain}

.prodInfo h1.ph{margin:10px 0 4px;font-size:clamp(26px,4.4vw,52px)}
.prodSub{color:var(--mut);font-size:15px;margin-bottom:6px}
.prodPrice{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin:20px 0 4px}
.prodPrice .p{font-family:var(--disp);font-weight:800;font-size:clamp(28px,4vw,46px);letter-spacing:-.05em;color:var(--red)}
.prodPrice .i{font-family:var(--mono);font-size:12.5px;color:var(--mut)}
.prodActs{display:flex;gap:11px;flex-wrap:wrap;margin:22px 0 6px}
.prodActs .btn{flex:1 1 190px;justify-content:center}
.prodWarranty{font-family:var(--mono);font-size:11px;color:var(--mut);text-transform:uppercase;
  letter-spacing:.1em;margin-top:20px}
.dlabel{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);
  margin:30px 0 12px;display:flex;align-items:center;gap:14px}
.dlabel::after{content:"";flex:1;height:1px;background:var(--line)}
.prodDesc{color:var(--mut);font-size:15px;line-height:1.68}
.prodDesc p{margin:0 0 12px}
.specTable{border:1px solid var(--line);border-radius:10px;overflow:hidden}
.specTable div{display:flex;gap:16px;padding:12px 16px;border-bottom:1px solid var(--line);font-size:14px}
.specTable div:last-child{border-bottom:0}
.specTable div:nth-child(odd){background:rgba(17,16,20,.035)}
.specTable dt{color:var(--mut);flex:1 1 44%;min-width:0;margin:0}
.specTable dd{font-family:var(--mono);text-align:right;flex:1 1 56%;font-size:12.5px;word-break:break-word;margin:0}
.prodYoutube{margin-top:18px}
.prodYoutube a{font-family:var(--mono);font-size:12px;color:var(--red2,#D8240F);border-bottom:1px solid rgba(216,36,15,.3)}
.moreLink{display:inline-block;margin-top:14px;font-family:var(--mono);font-size:12px;color:var(--red2,#D8240F);
  border-bottom:1px solid rgba(216,36,15,.3)}

.relWrap{margin-top:clamp(60px,8vw,100px)}
.relGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:16px 0 0}
@media(max-width:900px){.relGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.relCard{display:block}
.relCard .w{border-radius:6px;overflow:hidden;background:var(--mat,#e8e4dc);aspect-ratio:4/5}
.relCard .w img{width:100%;height:100%;object-fit:contain}
.relCard .n{font-size:12.5px;font-weight:600;margin-top:10px;line-height:1.3}
.relCard .s{font-size:11px;color:var(--mut);margin-top:2px}
.relCard .p{font-family:var(--mono);font-size:11.5px;color:var(--mut);margin-top:3px}

.backCat{margin:clamp(40px,6vw,70px) 0 clamp(60px,9vh,110px)}

/* ---------- category hub page ---------- */
.hubIntro{color:var(--mut);max-width:62ch;font-size:clamp(15px,1.7vw,17px);margin-top:10px}
