/* Product detail page (from the N40 prototype) */
.product{display:grid;grid-template-columns:1.15fr 1fr;gap:40px;padding:16px 0 40px}

/* gallery */
.gallery .main-wrap{perspective:2000px}
.gallery .main-img{aspect-ratio:1/1;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:var(--shadow-lift);transform:rotateX(3deg) rotateY(-6deg);transition:transform .5s ease}
.gallery .main-wrap:hover .main-img{transform:rotateX(1deg) rotateY(-3deg)}
.gallery .main-img img{width:100%;height:100%;object-fit:contain;transition:opacity .3s ease;padding:20px}
.gallery .main-img svg{width:70%;height:70%}
.thumbs{display:flex;gap:12px;margin-top:24px;overflow-x:auto;padding:4px}
.thumb{width:80px;height:80px;flex:0 0 auto;border:2px solid var(--border);border-radius:var(--r);background:#fff;padding:6px;cursor:pointer;transition:.2s ease;box-shadow:var(--shadow-soft);display:flex;align-items:center;justify-content:center}
.thumb img{width:100%;height:100%;object-fit:contain}
.thumb:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift)}
.thumb.active{border-color:var(--primary)}
.thumb:focus-visible{outline:2px solid var(--primary);outline-offset:2px}

/* info */
.brand-badge{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);background:#fff;padding:6px 12px;border-radius:var(--r-pill);box-shadow:var(--shadow-soft);margin-bottom:18px;color:var(--text-muted)}
.brand-badge .tag{color:#fff;font-size:11px;font-weight:700;padding:2px 8px;border-radius:var(--r-pill)}
.brand-badge .txt{font-size:14px;font-weight:500}
h1.pname{font-size:32px;font-weight:800;line-height:1.2;letter-spacing:-.02em;margin-bottom:12px}
.pinfo-sku{font-size:14px;color:var(--text-muted);margin-bottom:20px}
.badge-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.badge{display:inline-flex;align-items:center;gap:5px;border-radius:var(--r-pill);padding:5px 14px;font-size:13px;font-weight:600}
.badge.green{background:#ecfdf5;color:#059669}
.badge.indigo{background:#eef2ff;color:var(--primary)}
.badge.violet{background:#f5f3ff;color:var(--secondary)}
.badge.orange{background:#fff7ed;color:#c2410c}
.stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px;max-width:440px}
.stat .num{font-size:28px;font-weight:800;line-height:1}
.stat .lbl{font-size:13px;color:var(--text-muted);margin-top:6px}
.short-desc{background:linear-gradient(135deg,#eef2ff,#f5f3ff);border:1px solid var(--border-soft);padding:18px;border-radius:var(--r);font-size:14px;margin-bottom:24px;line-height:1.7}
.specs{list-style:none;margin-bottom:28px;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);padding:6px 18px;box-shadow:var(--shadow-soft)}
.specs li{display:flex;gap:10px;font-size:14px;padding:11px 0;border-bottom:1px solid var(--border-soft)}
.specs li:last-child{border-bottom:none}
.specs .k{color:var(--text-muted);flex:0 0 48%}
.specs .v{font-weight:600}
.specs .ico{color:var(--primary);flex:0 0 auto}

/* packages + enquiry card */
.buy-card{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);padding:28px;box-shadow:var(--shadow-soft)}
.pkg-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:6px 16px;margin-bottom:18px}
.pkg-head h2{font-size:24px!important;margin:0!important}
.pkg-hint{font-size:13px;color:var(--text-muted);font-weight:500}
.pkg-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:20px}
.pkg-opt{position:relative;border:1.5px solid var(--border);border-radius:var(--r);padding:14px 16px;background:#fff;transition:.2s ease;text-align:left;display:flex;flex-direction:column;gap:2px;font-family:inherit;cursor:pointer}
.pkg-opt .name{font-size:13px;font-weight:600;color:var(--primary)}
.pkg-opt .kg{font-size:24px;font-weight:800;color:var(--text);line-height:1.2}
.pkg-opt .kg small{font-size:15px;font-weight:700}
.pkg-opt .meta{font-size:12px;color:var(--text-muted);font-weight:500}
.pkg-opt .check{position:absolute;top:12px;right:12px;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;transition:.2s;opacity:0}
.pkg-opt.active{border-color:var(--primary);background:var(--primary-soft);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12)}
.pkg-opt.active .kg{color:var(--primary)}
.pkg-opt.active .check{opacity:1;background:var(--primary);border-color:var(--primary)}
.pkg-opt:hover{border-color:var(--primary);transform:translateY(-2px)}
.pkg-foot{display:flex;align-items:center;gap:20px}
.quote-note{flex:1;font-size:13px;color:var(--text-muted);line-height:1.6}
.cta-row{display:flex;gap:10px;flex-wrap:wrap}
.cta-row .btn{flex:1 1 auto;height:50px}
@media (max-width:900px){.pkg-foot{flex-direction:column;align-items:stretch}}

/* highlights */
.hl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:24px}
.hl{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid var(--border-soft);border-radius:var(--r)}
.hl .ic{width:36px;height:36px;flex:0 0 auto;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;background:#eef2ff;color:var(--primary)}
.hl:nth-child(3n+2) .ic{background:#ecfdf5;color:var(--success)}
.hl:nth-child(3n) .ic{background:#f5f3ff;color:var(--secondary)}
.hl .ic svg{width:18px;height:18px}
.hl h5{font-size:14px;font-weight:700;margin-bottom:2px}
.hl p{font-size:13px;color:var(--text-muted);line-height:1.55}
@media (max-width:900px){.hl-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.hl-grid{grid-template-columns:1fr}}

/* applications band */
.apps-band{background:linear-gradient(135deg,#eef2ff,#f5f3ff);border:1px solid #e0e7ff;border-radius:var(--r-lg);padding:48px}
.apps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:1px;margin-top:32px;background:var(--border-soft);border:1px solid var(--border-soft);border-radius:var(--r);box-shadow:var(--shadow-soft);overflow:hidden}
.app-card{background:#fff;padding:22px 12px;text-align:center;transition:.2s ease;display:flex;flex-direction:column;align-items:center;min-height:140px}
.app-card:hover{background:var(--primary-soft)}
.app-card .emoji{width:48px;height:48px;border-radius:var(--r);background:var(--primary-soft);color:var(--primary);display:flex;align-items:center;justify-content:center;margin-bottom:14px;flex:0 0 auto}
.app-card .emoji svg{width:24px;height:24px}
.app-card .t{font-size:12.5px;font-weight:600;color:#334155;line-height:1.4}

/* tabs */
.tabs-card{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);box-shadow:var(--shadow-soft);overflow:hidden}
.tabs-nav{display:flex;gap:6px;padding:10px;border-bottom:1px solid var(--border-soft);overflow-x:auto;background:var(--bg)}
.tab-btn{flex:0 0 auto;border:none;background:none;font-size:15px;font-weight:600;color:var(--text-muted);padding:12px 22px;border-radius:var(--r-pill);transition:.2s;white-space:nowrap}
.tab-btn:hover{color:var(--primary)}
.tab-btn.active{background:#fff;color:var(--primary);box-shadow:var(--shadow-soft)}
.tab-btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.tab-pane{display:none;padding:32px}
.tab-pane.active{display:block;animation:tabfade .25s ease}
@keyframes tabfade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.tab-pane h4{font-size:16px;font-weight:700;margin:0 0 12px}
.tab-collapse{position:relative;overflow:hidden}
.tab-collapse.clamped{max-height:260px}
.tab-collapse.clamped::after{content:"";position:absolute;inset:auto 0 0 0;height:80px;background:linear-gradient(transparent,#fff)}
.collapse-toggle{display:flex;justify-content:center;padding:16px 0 4px}
.collapse-toggle button{background:#fff;border:1px solid var(--border);color:var(--text);font-size:14px;font-weight:600;padding:10px 26px;border-radius:var(--r-pill);transition:.2s;box-shadow:var(--shadow-soft);display:inline-flex;align-items:center;gap:8px}
.collapse-toggle button:hover{border-color:var(--primary);color:var(--primary)}
.collapse-toggle .ci{transition:transform .2s}
.spec-table{width:100%;border-collapse:collapse;font-size:14.5px}
.spec-table .grp td{background:var(--bg);font-weight:700;padding:10px 16px}
.spec-table th{text-align:left;font-weight:600;color:var(--text-muted);padding:11px 16px;width:42%;vertical-align:top;border-bottom:1px solid var(--border-soft)}
.spec-table td{padding:11px 16px;border-bottom:1px solid var(--border-soft)}
.faq details{border:1px solid var(--border-soft);border-radius:var(--r);margin-bottom:12px;overflow:hidden;transition:.2s}
.faq details[open]{border-color:var(--primary);box-shadow:var(--shadow-soft)}
.faq summary{list-style:none;cursor:pointer;padding:18px 20px;font-weight:600;font-size:15px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .chev{transition:transform .2s;color:var(--primary);flex:0 0 auto}
.faq details[open] summary .chev{transform:rotate(180deg)}
.faq .ans{padding:0 20px 18px;font-size:14.5px;color:var(--text-muted);line-height:1.75}
.rel-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.rel-card{display:flex;gap:14px;align-items:center;padding:16px;border:1px solid var(--border-soft);border-radius:var(--r);transition:.2s;background:#fff}
.rel-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift);border-color:var(--primary)}
.rel-ic{width:44px;height:44px;flex:0 0 auto;border-radius:var(--r-sm);background:var(--primary-soft);color:var(--primary);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12px}
.rel-card .rt{font-weight:600;color:var(--text);font-size:14.5px}
.rel-card .rd{font-size:12.5px;color:var(--text-muted)}

/* sticky mobile cta */
.sticky-cta{display:none;position:fixed;bottom:0;left:0;right:0;z-index:60;background:rgba(255,255,255,.95);backdrop-filter:blur(8px);border-top:1px solid var(--border);padding:12px 16px;box-shadow:0 -4px 20px rgba(79,70,229,.12);gap:12px}
.sticky-cta .btn{flex:1;height:46px;font-size:14px;padding:0 12px}

@media (max-width:1023px){.product{gap:28px}}
@media (max-width:768px){
  .product{grid-template-columns:1fr}
  h1.pname{font-size:26px}
  .apps-band{padding:32px 20px}
  .sticky-cta{display:flex}
  body.has-sticky{padding-bottom:74px}
  .gallery .main-img{transform:none}
  .tab-pane{padding:22px 18px}
  .tab-btn{padding:10px 16px;font-size:14px}
}
@media (prefers-reduced-motion:reduce){.gallery .main-img{transform:none!important}}

/* gallery controls */
.gal-open{position:absolute;inset:0;border:0;padding:0;background:none;cursor:zoom-in;display:flex;align-items:center;justify-content:center}
.gal-open img{transition:opacity .18s ease}
.gal-open img.swap{opacity:.25}
.gal-zoom{position:absolute;right:16px;bottom:16px;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.92);color:var(--primary);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-soft);opacity:0;transition:opacity .2s}
.gal-zoom svg{width:18px;height:18px}
.main-wrap:hover .gal-zoom,.gal-open:focus-visible .gal-zoom{opacity:1}
.gal-nav{position:absolute;top:50%;z-index:2;width:44px;height:44px;margin-top:-22px;border-radius:50%;border:1px solid var(--border);background:rgba(255,255,255,.95);color:var(--text);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-soft);cursor:pointer;transition:background .15s,color .15s,transform .15s}
.gal-nav svg{width:20px;height:20px}
.gal-prev{left:14px}.gal-prev svg{transform:rotate(90deg)}
.gal-next{right:14px}.gal-next svg{transform:rotate(-90deg)}
.gal-nav:hover{background:var(--primary);color:#fff;border-color:var(--primary)}
.gal-count{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);font-size:12.5px;font-weight:600;color:var(--text-muted);background:rgba(255,255,255,.9);padding:3px 10px;border-radius:var(--r-pill)}
/* lightbox */
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(8,15,40,.92);display:flex;align-items:center;justify-content:center;padding:48px 72px}
.lightbox[hidden]{display:none}
.lightbox img{max-width:100%;max-height:100%;object-fit:contain;background:#fff;border-radius:var(--r);padding:24px}
.lb-close{position:absolute;top:16px;right:16px;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.12);color:#fff;font-size:18px;cursor:pointer}
.lb-close:hover{background:rgba(255,255,255,.25)}
.lb-nav{position:absolute;top:50%;width:52px;height:52px;margin-top:-26px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}
.lb-nav:hover{background:rgba(255,255,255,.3)}
.lb-nav svg{width:24px;height:24px}
.lb-prev{left:16px}.lb-prev svg{transform:rotate(90deg)}
.lb-next{right:16px}.lb-next svg{transform:rotate(-90deg)}
.lb-count{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);color:#e2e8f0;font-size:14px}
@media (max-width:768px){.lightbox{padding:56px 12px}.lb-nav{width:44px;height:44px;margin-top:-22px;background:rgba(255,255,255,.2)}.lb-prev{left:8px}.lb-next{right:8px}.gal-nav{width:38px;height:38px;margin-top:-19px}}
.gallery .main-img{position:relative}

/* ---------- Industrial premium layer (product page, bright) ---------- */
.gallery .main-img{transform:none;box-shadow:none;border-color:var(--border);background:#fff;background-image:linear-gradient(var(--border-soft) 1px,transparent 1px),linear-gradient(90deg,var(--border-soft) 1px,transparent 1px);background-size:28px 28px}
.gallery .main-wrap:hover .main-img{transform:none}
.thumb{box-shadow:none;border-width:1px;border-radius:var(--r-sm)}
.thumb:hover{transform:none;box-shadow:none;border-color:var(--primary)}
.thumb.active{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary)}
.gal-nav,.gal-zoom,.lb-close,.lb-nav{border-radius:var(--r-sm)}
.gal-nav:hover{background:var(--primary);border-color:var(--primary)}
.gal-count{border-radius:3px;font-family:var(--mono)}
.brand-badge{box-shadow:none}
.brand-badge .tag{border-radius:3px;font-family:var(--mono)}
h1.pname{font-weight:700}
.pinfo-sku{font-family:var(--mono);font-size:12.5px;letter-spacing:.04em}
.badge{border-radius:3px;font-family:var(--mono);font-size:12px}
.stat-row{gap:0;border:1px solid var(--border);border-radius:var(--r-sm);background:#fff}
.stat{padding:14px 16px;border-right:1px solid var(--border)}
.stat:last-child{border-right:none}
.stat .num{font-family:var(--mono);font-weight:600;font-size:24px;color:var(--primary)}
.stat .lbl{font-size:12px}
.short-desc{background:#fff;border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:var(--r-sm)}
.specs{box-shadow:none;border-color:var(--border);border-radius:var(--r-sm)}
.specs .v{font-family:var(--mono);font-weight:500;font-size:13.5px}
.buy-card{box-shadow:none;border-color:var(--border);border-top:4px solid var(--primary)}
.pkg-opt{border-width:1px}
.pkg-opt:hover{transform:none;border-color:var(--primary)}
.pkg-opt .kg{font-family:var(--mono);font-weight:600}
.pkg-opt.active{background:var(--primary-soft);box-shadow:0 0 0 2px var(--primary)}
.pkg-opt .name{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase}
.hl{border-color:var(--border);border-radius:var(--r-sm);background:#fff}
.hl .ic,.hl:nth-child(3n+2) .ic,.hl:nth-child(3n) .ic{border-radius:var(--r-sm);background:var(--primary-soft);color:var(--primary)}
.apps-band{background:var(--panel);border:1px solid var(--border)}
.apps-grid{box-shadow:none;background:var(--border);border-color:var(--border)}
.app-card:hover{background:var(--primary-soft)}
.app-card .emoji{border-radius:var(--r-sm)}
.tabs-card{box-shadow:none;border-color:var(--border)}
.tabs-nav{padding:0;gap:0;background:#fff}
.tab-btn{border-radius:0;padding:16px 22px;border-bottom:3px solid transparent;font-size:14.5px}
.tab-btn.active{background:none;box-shadow:none;color:var(--primary);border-bottom-color:var(--primary)}
.collapse-toggle button{box-shadow:none}
.spec-table .grp td{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;background:var(--panel);color:var(--primary)}
.spec-table td{font-family:var(--mono);font-size:13.5px}
.faq details{border-color:var(--border)}
.faq details[open]{box-shadow:none;border-color:var(--primary)}
.rel-card{border-color:var(--border)}
.rel-card:hover{transform:none;box-shadow:none;border-color:var(--primary)}
.rel-ic{font-family:var(--mono)}
.sticky-cta{box-shadow:0 -1px 0 var(--border);background:#fff}
.app-card .emoji{width:60px;height:60px;background:none;border-radius:0}
.app-card .emoji img{width:60px;height:60px;display:block}
.app-card:hover .emoji img{transform:translateY(-2px);transition:transform .2s}

/* ---------- Product page v2: side menu + summary + quote + accordions (Climalife-style) ---------- */
html{scroll-padding-top:130px}
.pd-crumbs{display:flex;flex-direction:column;gap:2px;margin-bottom:22px}
.pd{display:grid;grid-template-columns:220px minmax(0,1fr);gap:40px;align-items:start;padding-bottom:24px}

/* side menu */
.pd-side{position:sticky;top:130px;display:flex;flex-direction:column}
.pd-side-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 0 12px;margin-bottom:4px;border-bottom:2px solid var(--primary)}
.pd-side-link{display:block;padding:12px 2px;font-size:14.5px;font-weight:600;color:#2B3A55;border-bottom:1px solid var(--border);transition:color .15s,padding .15s}
.pd-side-link.is-top{border:none;padding:0;font-size:15px;color:var(--primary)}
.pd-side-link:not(.is-top):hover,.pd-side-link.on:not(.is-top){color:var(--primary);padding-left:8px}
.pd-side-link.on:not(.is-top){box-shadow:inset 3px 0 0 var(--primary)}
.pd-side-quote{display:inline-flex;align-items:center;gap:5px;padding:6px 11px;border-radius:999px;background:var(--primary);color:#fff!important;font-size:12.5px;font-weight:600;white-space:nowrap}
.pd-side-quote svg{width:14px;height:14px}
.pd-side-quote:hover{background:var(--primary-dark)}

/* hero */
.pd-hero{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:40px;align-items:start}
.pd-hero .gallery .main-img{aspect-ratio:1/1;background:radial-gradient(110% 85% at 50% 100%,color-mix(in srgb,var(--c) 26%,#fff),color-mix(in srgb,var(--c) 6%,#fff) 72%);border-color:var(--border)}
.pd-num{position:absolute;left:18px;top:12px;z-index:1;font-family:var(--mono);font-weight:700;font-size:44px;letter-spacing:-.03em;line-height:1;color:color-mix(in srgb,var(--c) 75%,#0F1A2E);opacity:.85;pointer-events:none}
.pd-hero .gallery .main-img img{padding:56px 28px 20px}
.pd-info{display:flex;flex-direction:column;gap:14px;padding-top:4px}
.pd-title{font-size:clamp(28px,3vw,38px);font-weight:700;letter-spacing:-.02em;line-height:1.15;color:var(--text)}
.pd-chips{display:flex;flex-wrap:wrap;gap:6px}
.pd-chip{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;font-size:12.5px;font-weight:600;border:1px solid #C8C9EA;color:var(--primary);background:#fff}
.pd-chip.is-fill{background:var(--primary);border-color:var(--primary);color:#fff}
.pd-chip.sf{border-color:var(--sc,#059669);color:var(--sc,#059669);font-family:var(--mono)}
.pd-iconrow{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:10px 0;border-top:1px solid var(--border-soft);border-bottom:1px solid var(--border-soft)}
.pd-ic{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:var(--r-sm);transition:background .15s}
.pd-ic:hover{background:var(--panel)}
.pd-ic img{width:30px;height:30px}
.pd-eco{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:#1C7FB0;padding:5px 10px;border-radius:999px;background:var(--accent-soft)}
.pd-tagline{font-size:17px;font-weight:600;color:var(--text)}
.pd-short{font-size:15px;line-height:1.75;color:#3A475E}
.pd-specs{display:flex;flex-wrap:wrap;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--panel)}
.pd-specs div{padding:10px 16px;border-right:1px solid var(--border)}
.pd-specs div:last-child{border-right:none}
.pd-specs dt{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}
.pd-specs dd{font-family:var(--mono);font-size:18px;font-weight:600;color:var(--text)}
.pd-brand{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text-muted)}
.pd-brand img{height:22px;width:auto}

/* quotation */
.pd-quote{margin-top:44px;padding-top:28px;border-top:1px solid var(--border)}
.pd-quote h2{font-size:26px;font-weight:700;margin-bottom:18px}
.pd-packs{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}
.pd-packs .pkg-opt{flex:0 1 auto;flex-direction:row;align-items:center;gap:12px;min-width:170px;padding:14px 18px;background:#fff;border:1px solid var(--border);border-radius:var(--r);box-shadow:0 2px 8px -4px rgba(16,40,100,.18)}
.pd-packs .pkg-opt:hover{border-color:var(--primary);transform:none}
.pd-packs .pkg-opt.active{border-color:var(--primary);background:var(--primary-soft);box-shadow:0 0 0 1px var(--primary)}
.pk-radio{width:18px;height:18px;flex:0 0 auto;border-radius:50%;border:1.5px solid #9AA6BA;background:#fff;transition:.15s}
.pkg-opt.active .pk-radio{border:5px solid var(--primary)}
.pk-txt{display:flex;flex-direction:column;align-items:flex-start;line-height:1.3}
.pd-packs .pkg-opt .name{font-family:inherit;font-size:14.5px;font-weight:700;color:var(--primary);letter-spacing:0;text-transform:none}
.pd-packs .pkg-opt .kg{font-family:var(--mono);font-size:14px;font-weight:600;color:var(--text)}
.pd-packs .pkg-opt .meta{font-size:11.5px}
.pd-buy{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.pd-qty{display:inline-flex;align-items:center;height:48px;border:1px solid #C8C9EA;border-radius:999px;overflow:hidden;background:#fff}
.pd-qty button{width:42px;height:100%;border:none;background:none;font-size:18px;color:var(--text)}
.pd-qty button:hover{background:var(--panel)}
.pd-qty input{width:48px;height:100%;border:none;border-left:1px solid var(--border);border-right:1px solid var(--border);text-align:center;font-family:var(--mono);font-size:15px;font-weight:600;-moz-appearance:textfield}
.pd-qty input::-webkit-outer-spin-button,.pd-qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.pd-buy .btn{border-radius:999px}
.pd-buy .btn svg{width:18px;height:18px}
.pd-note{font-size:13px;color:var(--text-muted);margin-top:12px}

/* accordions */
.pd-acc{margin-top:40px;border-top:1px solid var(--border)}
.pd-acc>details{border-bottom:1px solid var(--border)}
.pd-acc>details>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 4px;cursor:pointer;list-style:none}
.pd-acc>details>summary::-webkit-details-marker{display:none}
.pd-acc>details>summary h2{font-size:22px;font-weight:700;color:#2B3A55;transition:color .15s}
.pd-acc>details>summary:hover h2,.pd-acc>details[open]>summary h2{color:var(--primary)}
.pd-acc>details>summary .chev{display:flex;color:var(--primary);transition:transform .2s}
.pd-acc>details>summary .chev svg{width:22px;height:22px}
.pd-acc>details[open]>summary .chev{transform:rotate(180deg)}
.pd-acc-body{padding:0 4px 26px}
.pd-acc .spec-table{border:1px solid var(--border);border-radius:var(--r-sm);overflow:hidden}
.pd-acc .spec-table th{background:var(--panel);font-family:inherit}
.pd-apps{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.pd-app{display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 10px;border:1px solid var(--border);border-radius:var(--r);text-align:center;font-size:13.5px;font-weight:600;color:#2B3A55}

/* related */
.pd-related{margin-top:48px}
.pd-related h2{font-size:24px;font-weight:700;color:var(--primary);margin-bottom:18px}
.pd-related .prod-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}

/* help tiles */
.pd-help{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:56px}
.pd-help-tile{position:relative;display:flex;flex-direction:column;gap:6px;min-height:190px;padding:26px 24px;border-radius:var(--r-lg);color:#fff;background:linear-gradient(135deg,#23256F,#3E41B8);overflow:hidden;transition:transform .2s,box-shadow .2s}
.pd-help-tile:nth-child(2){background:linear-gradient(135deg,#3E41B8,#5C60D6)}
.pd-help-tile.is-accent{background:linear-gradient(135deg,#1C7FB0,#2A9FD8)}
.pd-help-tile::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:28px 28px;pointer-events:none}
.pd-help-tile:hover{transform:translateY(-3px);box-shadow:0 20px 36px -18px rgba(16,40,100,.5)}
.ph-ic{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:var(--r);background:rgba(255,255,255,.16);margin-bottom:6px}
.ph-ic svg{width:22px;height:22px}
.pd-help-tile b{font-size:21px;font-weight:700}
.pd-help-tile span:not(.ph-ic){font-size:13.5px;line-height:1.6;color:rgba(255,255,255,.85);max-width:30em}
.pd-help-tile em{position:absolute;right:22px;bottom:18px;font-style:normal;font-size:22px;transition:transform .2s}
.pd-help-tile:hover em{transform:translateX(4px)}

@media (max-width:1100px){
  .pd{grid-template-columns:1fr;gap:0}
  .pd-side{position:static;flex-direction:row;flex-wrap:nowrap;gap:6px;overflow-x:auto;margin:0 -16px 22px;padding:0 16px 4px;scrollbar-width:none}
  .pd-side::-webkit-scrollbar{display:none}
  .pd-side-top{border:none;padding:0;margin:0}
  .pd-side-link.is-top{display:none}
  .pd-side-link{flex:0 0 auto;padding:8px 14px;border:1px solid var(--border);border-radius:999px;font-size:13.5px;background:#fff}
  .pd-side-link:not(.is-top):hover,.pd-side-link.on:not(.is-top){padding-left:14px;box-shadow:none;border-color:var(--primary)}
}
@media (max-width:860px){
  .pd-hero{grid-template-columns:1fr;gap:24px}
  .pd-help{grid-template-columns:1fr}
  .pd-help-tile{min-height:150px}
}
@media (max-width:560px){
  .pd-quote h2{font-size:21px}
  .pd-packs{display:grid;grid-template-columns:1fr 1fr}
  .pd-packs .pkg-opt{min-width:0;padding:12px}
  .pd-buy .btn{flex:1 1 auto}
  .pd-buy .btn-primary{flex-basis:calc(100% - 150px)}
  .pd-acc>details>summary h2{font-size:18px}
  .pd-specs div{padding:8px 12px}
  .pd-specs dd{font-size:15px}
}
.pd-related .pc-specs dd{font-size:13.5px}
.pd-related .pc-specs div{padding:8px 8px}
.pk-special{margin-top:3px;font-size:11px;font-weight:600;padding:1px 7px;border-radius:999px;background:#fff7ed;color:#c2410c;border:1px solid #fed7aa}
.pd-eco{color:#15803D;background:#E8F6EC}

/* product page: plain light-blue image box + brand logo */
.gallery .main-img,.pd-hero .gallery .main-img{background:var(--prod-bg);background-image:none}
.pd-num{display:none}
.pd-logo{left:18px;top:16px;width:120px;height:36px}
.thumb{background:var(--prod-bg)}
.gallery .main-img img[src*="-photo-"]{padding:0;object-fit:cover;filter:none}
.thumb img[src*="-photo-"]{object-fit:cover;border-radius:3px}
.thumb:has(img[src*="-photo-"]){padding:3px}
.main-img:has(img[src*="-photo-"]) .pd-logo{width:136px;height:44px}

/* quote list picker: one quantity row per pack size */
.pq-list{display:flex;flex-direction:column;gap:8px;margin-bottom:14px;max-width:640px}
.pq-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 12px 10px 18px;background:#fff;border:1px solid var(--border);border-radius:var(--r);transition:.15s}
.pq-row.has-qty{border-color:var(--primary);background:var(--primary-soft);box-shadow:0 0 0 1px var(--primary)}
.pq-size{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;min-width:0}
.pq-size b{font-size:14.5px;color:var(--primary)}
.pq-size .kg{font-family:var(--mono);font-size:14px;font-weight:600}
.pq-size .meta{font-size:12px;color:var(--muted)}
.pq-row .pd-qty{height:40px;flex:none}
.pq-row .pd-qty button{width:38px}
.pq-err{margin:-4px 0 12px;font-size:13.5px;font-weight:600;color:#B42318}
.pq-view .nq-count{margin-left:4px}
