/* ==========================================================================
   Product / instrument detail page components.
   Loaded IN ADDITION to site.css (which provides tokens, header, footer,
   buttons, utility bar). Only product-specific components live here.
   ========================================================================== */

.prod-hero{padding:28px 0 52px;}
.prod-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:56px;align-items:start;}
.media{background:var(--bg-inset);border:1px solid var(--border);border-radius:16px;padding:28px;position:relative;overflow:hidden;}
.media svg{width:100%;height:auto;}
.thumbs{display:flex;gap:10px;margin-top:12px;}
.thumb{
  flex:1;aspect-ratio:1;border-radius:10px;border:1px solid var(--border);background:var(--bg-inset);
  display:flex;align-items:center;justify-content:center;cursor:pointer;padding:10px;
}
.thumb.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent);}
.thumb svg{opacity:.75;}
.thumb.active svg{opacity:1;}

.brand-chip{
  display:inline-flex;align-items:center;gap:8px;background:var(--accent-soft);color:var(--accent);
  font-family:'Inter',-apple-system,'Segoe UI',sans-serif;font-weight:600;font-size:.72rem;letter-spacing:.08em;
  text-transform:uppercase;padding:6px 10px;border-radius:6px;margin-bottom:14px;
}
.product-title{font-size:2.5rem;line-height:1.08;margin-bottom:10px;}
.product-sub{color:var(--text-muted);font-size:1.05rem;max-width:46ch;margin-bottom:26px;}

.stat-row{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin-bottom:26px;}
.stat{padding:16px 18px;border-right:1px solid var(--border);}
.stat:first-child{padding-left:0;}
.stat:last-child{border-right:none;padding-right:0;}
.stat .icon{color:var(--accent);margin-bottom:8px;}
.stat .val{font-family:'IBM Plex Mono',ui-monospace,monospace;font-weight:600;font-size:1.15rem;}
.stat .lbl2{font-size:.76rem;color:var(--text-muted);margin-top:2px;}

.tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px;}
.tag{font-size:.8rem;padding:7px 13px;border-radius:100px;border:1px solid var(--border-strong);color:var(--text-muted);cursor:pointer;background:transparent;}
.tag:hover{border-color:var(--accent);color:var(--accent);}

.cta-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:16px;}
.trust-line{font-size:.82rem;color:var(--text-muted);display:flex;align-items:center;gap:8px;}
.trust-line svg{color:var(--accent);flex-shrink:0;}

/* tabs */
.tabbar{position:sticky;top:76px;background:var(--bg);z-index:30;border-bottom:1px solid var(--border);}
.tabbar .wrap{display:flex;gap:8px;overflow-x:auto;}
.tab{background:transparent;border:none;border-bottom:2px solid transparent;padding:16px 6px;margin-right:26px;font-size:.92rem;font-weight:500;color:var(--text-muted);cursor:pointer;white-space:nowrap;}
.tab.active{color:var(--text);border-color:var(--accent);}
.tab:hover{color:var(--text);}
section.panel{padding:48px 0;display:none;}
section.panel.active{display:block;}

/* overview */
.overview-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;}
.overview-grid p{color:var(--text-muted);max-width:60ch;margin:0 0 18px;}
.ov-features{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:16px;}
.ov-features li{display:flex;gap:14px;align-items:flex-start;}
.ov-features .fi{width:30px;height:30px;border-radius:7px;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px;}
.ov-features b{display:block;font-size:.95rem;margin-bottom:2px;}
.ov-features span{color:var(--text-muted);font-size:.88rem;}
.overview-aside{background:var(--bg-inset);border:1px solid var(--border);border-radius:14px;padding:24px;}
.overview-aside h3{font-size:1rem;margin-bottom:14px;}
.aside-row{padding:11px 0;border-bottom:1px solid var(--border);font-size:.86rem;}
.aside-row:last-child{border-bottom:none;}
.aside-row span:first-child{display:block;color:var(--text-muted);margin-bottom:3px;}
.aside-row span:last-child{display:block;font-family:'IBM Plex Mono',ui-monospace,monospace;font-weight:500;line-height:1.5;word-break:break-word;}

/* specs */
.spec-group{margin-bottom:8px;}
.spec-group h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);font-family:'IBM Plex Mono',ui-monospace,monospace;font-weight:500;margin-bottom:2px;padding:14px 0 10px;border-bottom:1px solid var(--border-strong);}
.spec-table{width:100%;border-collapse:collapse;margin-bottom:8px;}
.spec-table tr{border-bottom:1px solid var(--border);}
.spec-table tr:nth-child(even){background:var(--bg-inset);}
.spec-table td{padding:12px 14px;font-size:.9rem;}
.spec-table td:first-child{color:var(--text-muted);width:38%;}
.spec-table td:last-child{font-family:'IBM Plex Mono',ui-monospace,monospace;font-weight:500;}

/* applications */
.app-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.app-card{border:1px solid var(--border);border-radius:14px;padding:22px;background:var(--surface);transition:border-color .15s ease, box-shadow .15s ease;}
.app-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow);}
.app-card .ai{width:36px;height:36px;border-radius:9px;background:var(--brand-surface);color:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:14px;}
.app-card h3{font-size:1.02rem;margin-bottom:8px;}
.app-card p{color:var(--text-muted);font-size:.87rem;margin:0;}
.app-note{margin-top:22px;padding:16px 18px;border-radius:12px;background:var(--accent-soft);color:var(--text);font-size:.88rem;display:flex;gap:12px;align-items:flex-start;}
.app-note svg{color:var(--accent);flex-shrink:0;margin-top:2px;}
.app-note b{font-weight:600;}

/* resources */
.res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.res-card{border:1px solid var(--border);border-radius:14px;padding:22px;background:var(--surface);}
.res-card .rt{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px;}
.res-card .ft{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:.68rem;color:var(--text-muted);border:1px solid var(--border-strong);padding:3px 7px;border-radius:5px;}
.res-card h3{font-size:.98rem;margin-bottom:6px;}
.res-card p{color:var(--text-muted);font-size:.85rem;margin:0 0 16px;}
.gate-form{display:none;margin-top:14px;padding-top:14px;border-top:1px dashed var(--border-strong);gap:9px;flex-direction:column;}
.gate-form.open{display:flex;}
.gate-form input,.gate-form select{font:inherit;font-size:.85rem;padding:9px 11px;border-radius:7px;border:1px solid var(--border-strong);background:var(--bg);color:var(--text);width:100%;}
.gate-form .fine{font-size:.72rem;color:var(--text-muted);}
.res-card.done .gate-form{display:none;}
.res-confirm{display:none;font-size:.85rem;color:var(--accent);margin-top:12px;font-weight:500;align-items:center;gap:6px;}
.res-card.done .res-confirm{display:flex;}
.res-card.done .btn{display:none;}

/* related */
.rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.rel-card{border:1px solid var(--border);border-radius:14px;padding:20px;background:var(--surface);}
.rel-card .rimg{background:var(--bg-inset);border-radius:10px;height:110px;margin-bottom:14px;display:flex;align-items:center;justify-content:center;}
.rel-card .rimg svg{width:56px;color:var(--brand-surface);}
.rel-card .eyebrow2{font-family:'Inter',-apple-system,'Segoe UI',sans-serif;font-weight:600;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:4px;}
.rel-card h3{font-size:.98rem;margin-bottom:6px;}
.rel-card p{color:var(--text-muted);font-size:.84rem;margin:0 0 14px;}

/* real product photography */
.media.photo{background:#fff;padding:22px;display:flex;align-items:center;justify-content:center;}
.media.photo img{width:100%;height:auto;display:block;}
.thumbs{flex-wrap:wrap;}
.thumb{flex:0 0 60px;height:60px;aspect-ratio:auto;background:#fff;padding:6px;}
.thumb img{width:100%;height:100%;object-fit:contain;display:block;}
.rel-card .rimg{overflow:hidden;background:#fff;}
.rel-card .rimg img{width:100%;height:100%;object-fit:contain;padding:10px;}

/* overview intro bullets */
.intro-list{list-style:disc;margin:0;padding-left:20px;display:grid;gap:11px;color:var(--text-muted);max-width:62ch;}
.intro-list li{padding-left:4px;line-height:1.55;}
.ov-kf-head{font-size:1.15rem;margin:28px 0 2px;padding-top:24px;border-top:1px solid var(--border);}

/* scope of supply */
.supply-box{background:var(--bg-inset);border:1px solid var(--border);border-radius:14px;padding:24px;margin-top:0;}
.supply-box h3{font-size:1.02rem;margin-bottom:16px;}
.supply-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:11px 24px;}
.supply-list li{display:flex;gap:10px;align-items:flex-start;font-size:.88rem;color:var(--text-muted);}
.supply-list svg{color:var(--accent);flex-shrink:0;margin-top:3px;}

/* standards badges */
.std-badges{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 4px;}
.std-badge{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:.72rem;border:1px solid var(--border-strong);color:var(--text-muted);padding:5px 10px;border-radius:6px;}
.res-card a.btn{text-decoration:none;display:inline-block;}

@media (max-width:980px){
  .prod-hero-grid,.overview-grid{grid-template-columns:1fr;gap:32px;}
  .app-grid,.res-grid,.rel-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:640px){
  .supply-list{grid-template-columns:1fr;}
}
@media (max-width:640px){
  .stat-row,.app-grid,.res-grid,.rel-grid{grid-template-columns:1fr;}
  .stat{border-right:none;border-bottom:1px solid var(--border);padding:14px 0;}
  .product-title{font-size:1.9rem;}
}
@media (prefers-reduced-motion:reduce){
  .tab,.app-card,.thumb{transition:none;}
}