/* Product detail page (product.html?p=<slug>). Extends the .pd styles in pages.css. */
#pdp [hidden]{display:none!important}
@media(max-width:1023.98px){.gal{position:relative;top:auto}}
.pd-info{min-width:0}
.pd-info .crumb{flex-wrap:wrap;row-gap:6px}
.pd-info .crumb span{overflow-wrap:anywhere}
.pd-info h1{overflow-wrap:break-word}
.gal-main img{background:#fff}
.gal-main img:not(.pad){background:var(--ice)}
.price-row b.ask{font-size:1.7rem}
.pd-sub{font-size:13px;color:var(--graphite);margin-top:6px}
.pd-mini{margin:22px 0 0}
.pd-fin-note{margin-top:12px}
.finish{flex-wrap:wrap}
.finish button i.sw-white{background:#fafafa}
.finish button i.sw-ivory{background:linear-gradient(135deg,#FBF6EC,#E4D8C3)}
.finish button i.sw-black{background:linear-gradient(135deg,#3A3A3A,#141414)}
.finish button i.sw-chrome{background:linear-gradient(135deg,#f8fafc 0%,#a5adb5 30%,#fff 48%,#7c8793 72%,#e8edf2 100%)}
.pd-deep{color:var(--deep)!important}

/* quote-only products */
.pd-quote{display:grid;gap:14px;margin-top:4px}
.pd-quote p{font-size:14px;color:var(--graphite);line-height:1.6;max-width:34rem}
.pd-quote p b{color:var(--navy);font-weight:600}
.pd-quote .btn{justify-content:center;height:56px}
.buy-wa.pd-wa-main{background:var(--wa);border-color:var(--wa);color:#fff}
.buy-wa.pd-wa-main:hover{background:#1FB457}

/* parent-set link on single components */
.pd-parent{display:flex;align-items:center;gap:14px;margin-top:18px;padding:12px 16px 12px 12px;border:1px solid var(--chrome);border-radius:18px;background:#fff;transition:border-color .3s,transform .4s var(--ease)}
.pd-parent:hover{border-color:rgba(14,165,233,.5);transform:translateY(-2px)}
.pd-parent figure{width:56px;height:56px;border-radius:12px;overflow:hidden;flex:none;border:1px solid var(--chrome)}
.pd-parent figure img{width:100%;height:100%;object-fit:cover}
.pd-parent span{flex:1;min-width:0}
.pd-parent small{display:block;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--mist);font-weight:600}
.pd-parent b{font-family:Outfit,sans-serif;font-weight:600;color:var(--navy);font-size:15px}
.pd-parent svg{width:18px;height:18px;color:var(--deep);flex:none}

/* set contents: boxes are links */
.pd-box{color:inherit;text-decoration:none}
.pd-box:hover{border-color:rgba(14,165,233,.45)}
.pd-box figure img{background:#fff}
.pd-view{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--deep)}
.pd-view svg{width:14px;height:14px;transition:transform .3s var(--ease)}
.pd-box:hover .pd-view svg{transform:translateX(3px)}
.pd-swaps{margin-top:22px;border:1px solid var(--chrome);border-radius:20px;padding:20px 24px;background:#fff}
.pd-swaps-h{font-family:Outfit,sans-serif;font-weight:600;color:var(--navy);font-size:15px;margin-bottom:6px}
.pd-swaps-h small{display:block;font-family:Inter,sans-serif;font-size:12px;color:var(--mist);font-weight:500}
.pd-swap{display:grid;grid-template-columns:1fr;gap:4px;padding:12px 0;border-top:1px solid var(--chrome);font-size:13.5px;color:var(--graphite)}
.pd-swap:first-child{border-top:0}
@media(min-width:720px){.pd-swap{grid-template-columns:140px 1fr auto;gap:16px;align-items:center}}
.pd-swap-g{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--mist);font-weight:600}
.pd-swap a{color:var(--deep);font-weight:600}
.pd-swap a:hover{text-decoration:underline}
.pd-swap b{font-family:Outfit,sans-serif;font-weight:600;color:var(--navy);white-space:nowrap}

/* outputs / in the wall */
.pd-outs{background:#fff;border-top:1px solid var(--chrome)}
.outs-grid{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:640px){.outs-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){.outs-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.out-c{border:1px solid var(--chrome);border-radius:20px;padding:22px 22px 24px;background:#fff}
.out-c i{width:34px;height:34px;border-radius:10px;background:var(--navy);color:#fff;display:grid;place-items:center;font-style:normal;font-family:Outfit,sans-serif;font-weight:700;font-size:14px;margin-bottom:16px}
.out-c b{display:block;font-family:Outfit,sans-serif;font-weight:600;font-size:1.1rem;color:var(--navy);margin-bottom:6px}
.out-c p{font-size:13.5px;color:var(--graphite);line-height:1.55}
.pd-note{margin-top:22px;border:1px solid var(--chrome);border-radius:20px;padding:22px 24px;display:grid;gap:6px}
@media(min-width:900px){.pd-note{grid-template-columns:160px 1fr;gap:24px;align-items:baseline}}
.pd-note b{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--deep);font-weight:600}
.pd-note p{font-size:14.5px;color:var(--graphite);line-height:1.6;max-width:46rem}

/* related cards */
.pd-pc-link{color:inherit}
.pd-pc-link:hover{color:var(--deep)}
.pgrid .pc-img.pad{background:#fff}

/* compact layout for accessories and spares */
@media(min-width:1024px){
  .pd-compact .pd-grid{grid-template-columns:.8fr 1fr}
  .pd-compact .gal{max-width:520px}
}
.pd-compact .gal-main{aspect-ratio:1}
.pd-compact .specs{padding:70px 0}

/* not found */
.pd-missing{padding:170px 0 120px;background:#fff;text-align:center}
.pd-missing h1{font-size:clamp(2rem,4vw,3rem);font-weight:800;margin-bottom:14px}
.pd-missing .lead{margin:0 auto 26px}
.pd-missing .hero-ctas{justify-content:center}
@media(max-width:559.98px){
  .gal-main .show-tag span+span{display:none}
  .pgrid .pc-body{padding:14px 14px 16px}
  .pgrid .pc-foot{flex-wrap:wrap;gap:6px}
  .pgrid .pc-tag{max-width:calc(100% - 28px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.14em}
}
.pgrid .pc-foot b{white-space:nowrap}
.pd-box .bf b{white-space:nowrap}
@media(max-width:559.98px){
  .pd-box{padding:14px}
  .pd-box .pd-view{font-size:0;gap:0}
  .pd-box .pd-view svg{width:16px;height:16px}
  .buy .btn{padding-left:14px;padding-right:14px}
  .buy .btn span{white-space:nowrap;font-size:13.5px}
}
@media(max-width:399.98px){.buy .btn svg{display:none}}