/* CaspiaSupply Product Detail - C0011 Industrial B2B / OEM */
.pdetail-page {
    --pdetail-text: #11161c;
    --pdetail-muted: #68717c;
    --pdetail-line: #cfd6dd;
    --pdetail-line-dark: #aeb8c2;
    --pdetail-soft: #f3f5f6;
    --pdetail-soft-alt: #e9edf0;
    --pdetail-accent: #0b7f76;
    --pdetail-dark: #101722;
    position: relative;
    width: calc(100% - 40px);
    max-width: 1540px;
    margin: 0 auto;
    padding: 24px 0 88px;
    color: var(--pdetail-text);
}
.pdetail-page::before {
    content: "";
    position: absolute;
    inset: 0 50% 0 auto;
    z-index: -1;
    width: 100vw;
    background: #f5f7f8;
    transform: translateX(50%);
}
.pdetail-page *, .pdetail-page *::before, .pdetail-page *::after { box-sizing: border-box; }
.pdetail-breadcrumb { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 18px; color:#77818c; font-size:12px; }
.pdetail-breadcrumb a { color:inherit; text-decoration:none; }
.pdetail-breadcrumb a:hover { color:var(--pdetail-accent); }
.pdetail-breadcrumb span:last-child { max-width:360px; overflow:hidden; color:#39424c; text-overflow:ellipsis; white-space:nowrap; }

.pdetail-hero { display:grid; grid-template-columns:minmax(0,1.16fr) minmax(440px,.84fr); align-items:stretch; gap:28px; }
.pdetail-panel { min-width:0; height:100%; border:1px solid var(--pdetail-line); border-radius:4px; background:#fff; box-shadow:none; }

/* Taller gallery: it stretches to the full height of the right procurement panel. */
.pdetail-gallery { display:grid; grid-template-columns:88px minmax(0,1fr); gap:14px; min-height:680px; padding:12px; }
.pdetail-thumbnails { max-height:654px; display:flex; flex-direction:column; gap:10px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
.pdetail-thumb { width:78px; aspect-ratio:4/3; flex:0 0 auto; display:block; overflow:hidden; padding:3px; border:1px solid #cbd2d9; border-radius:2px; background:#fff; cursor:pointer; transition:border-color .15s ease, background .15s ease; }
.pdetail-thumb:hover { border-color:#6d7a87; }
.pdetail-thumb.is-active { border:2px solid #173e54; background:#eef3f5; }
.pdetail-thumb img { width:100%; height:100%; display:block; object-fit:contain; object-position:center; border-radius:0; background:#f4f6f7; }
.pdetail-thumb-empty { cursor:default; }
.pdetail-gallery-content { min-width:0; height:100%; display:grid; grid-template-rows:minmax(0,1fr) 46px; }
.pdetail-main-media { position:relative; min-width:0; min-height:600px; overflow:hidden; border:1px solid #e1e5e8; border-radius:2px; background:#f7f8f8; }
.pdetail-main-image { width:100%; height:100%; display:block; object-fit:contain; object-position:center; transition:opacity .15s ease; }
.pdetail-main-image.is-changing { opacity:.35; }
.pdetail-main-empty { width:100%; height:100%; display:grid; place-items:center; color:#aab3bc; }
.pdetail-main-empty svg { width:72px; fill:none; stroke:currentColor; stroke-width:1.3; }
.pdetail-fullscreen-button { position:absolute; top:12px; right:12px; z-index:4; width:38px; height:38px; display:grid; place-items:center; border:1px solid #bcc6cf; border-radius:2px; color:#17202a; background:rgba(255,255,255,.94); cursor:pointer; }
.pdetail-fullscreen-button svg { width:18px; fill:none; stroke:currentColor; stroke-width:1.8; }
.pdetail-fullscreen-button[hidden] { display:none; }
.pdetail-gallery-controls { min-height:46px; display:flex; align-items:end; justify-content:space-between; gap:16px; padding:8px 0 0; }
.pdetail-gallery-count { display:flex; align-items:baseline; gap:5px; color:#7a838d; font-size:12px; font-variant-numeric:tabular-nums; }
.pdetail-gallery-count strong { color:#111820; font-size:16px; }
.pdetail-gallery-nav { display:flex; gap:6px; }
.pdetail-gallery-arrow { min-width:40px; height:34px; display:grid; place-items:center; border:1px solid #bfc8d0; border-radius:2px; color:#111820; background:#fff; font-size:16px; cursor:pointer; }
.pdetail-gallery-arrow:hover { color:#fff; background:#111820; border-color:#111820; }
.pdetail-lightbox { position:fixed; inset:0; z-index:12000; display:grid; place-items:center; padding:70px; background:rgba(8,12,16,.95); }
.pdetail-lightbox[hidden] { display:none!important; }
.pdetail-lightbox img { max-width:min(1280px,92vw); max-height:88vh; object-fit:contain; }
.pdetail-lightbox-close { position:fixed; top:22px; right:28px; width:44px; height:44px; border:1px solid #fff; border-radius:2px; color:#111; background:#fff; font-size:26px; cursor:pointer; }

/* Procurement summary */
.pdetail-summary { display:flex; flex-direction:column; padding:28px; }
.pdetail-summary-meta { display:flex; flex-wrap:wrap; gap:8px 14px; margin-bottom:10px; color:#6d7781; font-size:11px; text-transform:none; }
.pdetail-summary-meta span + span::before { content:"/"; margin-right:14px; color:#aeb6bd; }
.pdetail-summary h1 { max-width:700px; margin:0; color:#0d1218; font-size:clamp(31px,2.8vw,46px); font-weight:760; line-height:1.13; letter-spacing:-.025em; overflow-wrap:anywhere; }
.pdetail-subtitle { max-width:700px; margin:11px 0 0; color:#515b66; font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
.pdetail-tags { min-height:26px; display:flex; flex-wrap:wrap; gap:7px; margin-top:14px; }
.pdetail-tags span { padding:5px 8px; border:1px solid #b7d8d3; border-radius:2px; color:#126d65; background:#edf7f5; font-size:10px; font-weight:750; }
.pdetail-section-kicker { color:#5e6872; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.pdetail-compliance-strip { margin-top:18px; padding:13px 0 0; border-top:1px solid var(--pdetail-line); }
.pdetail-certification-list { display:flex; flex-wrap:wrap; gap:7px; margin-top:9px; }
.pdetail-cert-badge { min-width:72px; min-height:42px; display:flex; flex-direction:column; justify-content:center; padding:6px 9px; border:1px solid #8f9aa5; border-radius:2px; color:#17202a; background:#fff; line-height:1.05; }
.pdetail-cert-badge b { font-size:14px; font-weight:850; letter-spacing:.02em; }
.pdetail-cert-badge small { margin-top:4px; color:#7b858f; font-size:7px; letter-spacing:.08em; }
.pdetail-cert-ce, .pdetail-cert-eac { border-color:#1b475d; }
.pdetail-cert-rohs, .pdetail-cert-reach { border-color:#377d65; }
.pdetail-cert-tuv, .pdetail-cert-lfgb { border-color:#5c6570; }
.pdetail-cert-nsf, .pdetail-cert-fda { border-color:#315c87; }
.pdetail-cert-empty { color:#88919a; font-size:12px; }

.pdetail-procurement-card { margin-top:18px; overflow:hidden; border:1px solid var(--pdetail-line-dark); border-radius:2px; background:#fff; }
.pdetail-procurement-head { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; padding:15px 16px 14px; border-bottom:1px solid var(--pdetail-line); background:#eef1f3; }
.pdetail-procurement-head small { display:block; margin-bottom:4px; color:#68727d; font-size:10px; }
.pdetail-procurement-head strong { display:block; color:#10161d; font-size:clamp(23px,1.8vw,29px); line-height:1.15; }
.pdetail-procurement-head>span { color:#4f5964; font-size:10px; font-weight:700; text-align:right; }
.pdetail-procurement-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin:0; }
.pdetail-procurement-grid>div { min-width:0; padding:12px 15px; border-bottom:1px solid #dfe4e8; }
.pdetail-procurement-grid>div:nth-child(odd) { border-right:1px solid #dfe4e8; }
.pdetail-procurement-grid>div:nth-last-child(-n+2) { border-bottom:0; }
.pdetail-procurement-grid dt { margin:0 0 5px; color:#75808b; font-size:9px; font-weight:700; text-transform:uppercase; }
.pdetail-procurement-grid dd { margin:0; color:#111821; font-size:12px; font-weight:750; overflow-wrap:anywhere; }
.pdetail-capability-block { margin-top:18px; }
.pdetail-capability-block h2 { margin:0 0 9px; color:#252d35; font-size:12px; text-transform:uppercase; letter-spacing:.04em; }
.pdetail-capability-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px 14px; margin:0; padding:0; list-style:none; }
.pdetail-capability-list li { min-width:0; display:flex; align-items:flex-start; gap:7px; color:#4d5863; font-size:11px; line-height:1.45; }
.pdetail-capability-list i { width:15px; height:15px; flex:0 0 15px; display:grid; place-items:center; margin-top:1px; border:1px solid #85b8b1; border-radius:2px; color:#0d766d; font-size:9px; font-style:normal; font-weight:900; }
.pdetail-logistics-snapshot { margin-top:18px; padding-top:13px; border-top:1px solid var(--pdetail-line); }
.pdetail-logistics-snapshot dl { margin:8px 0 0; border:1px solid #d8dde2; }
.pdetail-logistics-snapshot dl>div { display:grid; grid-template-columns:128px minmax(0,1fr); border-bottom:1px solid #e1e5e8; }
.pdetail-logistics-snapshot dl>div:last-child { border-bottom:0; }
.pdetail-logistics-snapshot dt, .pdetail-logistics-snapshot dd { margin:0; padding:8px 10px; font-size:10px; }
.pdetail-logistics-snapshot dt { color:#66717b; background:#f1f3f4; }
.pdetail-logistics-snapshot dd { color:#17202a; font-weight:650; overflow-wrap:anywhere; }
.pdetail-actions { margin-top:auto; padding-top:18px; }
.pdetail-primary-button { width:100%; min-height:52px; display:flex; align-items:center; justify-content:center; gap:9px; border:1px solid #0e1620; border-radius:2px; color:#fff; background:#101722; box-shadow:none; font-size:13px; font-weight:780; cursor:pointer; }
.pdetail-primary-button:hover { background:#1c2a39; }
.pdetail-primary-button svg { width:19px; fill:none; stroke:currentColor; stroke-width:1.7; }
.pdetail-action-note { margin:9px 0 0; color:#858e97; font-size:9.5px; line-height:1.5; text-align:left; }

/* Tabs and engineering datasheet */
.pdetail-tabs { margin-top:34px; border-top:1px solid #aeb7c0; }
.pdetail-tab-list { display:flex; align-items:stretch; gap:0; overflow-x:auto; border-right:1px solid var(--pdetail-line); scrollbar-width:none; }
.pdetail-tab-list::-webkit-scrollbar { display:none; }
.pdetail-tab-button { position:relative; min-height:48px; flex:0 0 auto; padding:0 22px; border:0; border-left:1px solid var(--pdetail-line); border-bottom:1px solid var(--pdetail-line); color:#6f7983; background:#eef1f3; font-size:13px; font-weight:720; white-space:nowrap; cursor:pointer; }
.pdetail-tab-button.is-active { color:#111821; background:#fff; border-bottom-color:#fff; }
.pdetail-tab-button.is-active::before { content:""; position:absolute; inset:0 0 auto; height:3px; background:#102a3a; }
.pdetail-tab-panel { min-height:240px; padding:24px; border:1px solid var(--pdetail-line); border-top:0; color:#242b32; background:#fff; font-size:13px; line-height:1.72; }
.pdetail-tab-panel[hidden] { display:none!important; }
.pdetail-richtext { max-width:1280px; }
.pdetail-richtext img { max-width:100%; height:auto; }
.pdetail-feature-block { margin-top:24px; }
.pdetail-feature-block h2, .pdetail-text-panel h2 { margin:0 0 10px; font-size:16px; }
.pdetail-feature-block ul { padding-left:20px; }
.pdetail-spec-header { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:16px; }
.pdetail-spec-header span { color:#6d7781; font-size:9px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }
.pdetail-spec-header h2 { margin:2px 0 0; color:#111821; font-size:20px; }
.pdetail-spec-header p { max-width:660px; margin:0; color:#727c86; font-size:11px; text-align:right; }
.pdetail-datasheet-wrap { max-width:1120px; overflow-x:auto; border:1px solid #aeb8c1; }
.pdetail-datasheet { width:100%; border-collapse:collapse; table-layout:fixed; }
.pdetail-datasheet th, .pdetail-datasheet td { padding:10px 14px; border-right:1px solid #d5dbe0; border-bottom:1px solid #d5dbe0; text-align:left; vertical-align:middle; overflow-wrap:anywhere; }
.pdetail-datasheet tr:last-child th, .pdetail-datasheet tr:last-child td { border-bottom:0; }
.pdetail-datasheet th:last-child, .pdetail-datasheet td:last-child { border-right:0; }
.pdetail-datasheet tbody tr:not(.pdetail-datasheet-group):nth-child(odd) { background:#f5f7f8; }
.pdetail-datasheet tbody tr:not(.pdetail-datasheet-group)>th { width:38%; color:#4c5661; font-size:11px; font-weight:650; }
.pdetail-datasheet tbody tr:not(.pdetail-datasheet-group)>td { color:#111821; font-size:12px; font-weight:650; }
.pdetail-datasheet-group th { padding:9px 14px; color:#fff; background:#24313d; font-size:10px; letter-spacing:.05em; }
.pdetail-text-panel { max-width:1240px; }
.pdetail-preline { margin:0 0 22px; white-space:pre-line; }
.pdetail-capability-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; margin-top:20px; border:1px solid var(--pdetail-line); }
.pdetail-capability-cards article { min-height:92px; display:flex; flex-direction:column; justify-content:center; padding:15px; border-right:1px solid var(--pdetail-line); border-radius:0; background:#f4f6f7; }
.pdetail-capability-cards article:last-child { border-right:0; }
.pdetail-capability-cards strong { margin-bottom:4px; color:#151c23; }
.pdetail-capability-cards span { color:#737d87; font-size:11px; }
.pdetail-delivery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:0 0 18px; border:1px solid var(--pdetail-line-dark); }
.pdetail-delivery-grid>div { min-width:0; min-height:76px; display:flex; flex-direction:column; justify-content:center; padding:12px; border-right:1px solid var(--pdetail-line); border-bottom:1px solid var(--pdetail-line); }
.pdetail-delivery-grid>div:nth-child(3n) { border-right:0; }
.pdetail-delivery-grid>div:nth-last-child(-n+3) { border-bottom:0; }
.pdetail-delivery-grid span { color:#717b85; font-size:10px; }
.pdetail-delivery-grid strong { margin-top:5px; color:#111821; font-size:12px; overflow-wrap:anywhere; }
.pdetail-delivery-note { padding:14px; border-left:3px solid #1a5167; background:#f1f4f5; }

@media (max-width:1220px) {
    .pdetail-hero { grid-template-columns:minmax(0,1.06fr) minmax(400px,.94fr); gap:20px; }
    .pdetail-gallery { grid-template-columns:76px minmax(0,1fr); min-height:640px; }
    .pdetail-thumb { width:68px; }
    .pdetail-main-media { min-height:558px; }
    .pdetail-summary { padding:23px; }
}
@media (max-width:960px) {
    .pdetail-page { width:calc(100% - 24px); }
    .pdetail-hero { grid-template-columns:1fr; }
    .pdetail-gallery { min-height:620px; }
    .pdetail-summary { height:auto; }
    .pdetail-actions { margin-top:18px; }
}
@media (max-width:680px) {
    .pdetail-page { width:calc(100% - 16px); padding-top:16px; }
    .pdetail-gallery { grid-template-columns:1fr; min-height:0; padding:8px; }
    .pdetail-thumbnails { order:2; max-height:none; flex-direction:row; overflow-x:auto; overflow-y:hidden; }
    .pdetail-gallery-content { order:1; height:auto; grid-template-rows:auto 42px; }
    .pdetail-main-media { min-height:0; aspect-ratio:4/3; }
    .pdetail-thumb { width:72px; flex:0 0 72px; }
    .pdetail-summary { padding:18px 15px; }
    .pdetail-summary h1 { font-size:clamp(28px,9vw,38px); }
    .pdetail-procurement-head { align-items:flex-start; flex-direction:column; }
    .pdetail-procurement-grid { grid-template-columns:1fr; }
    .pdetail-procurement-grid>div:nth-child(odd) { border-right:0; }
    .pdetail-procurement-grid>div:nth-last-child(-n+2) { border-bottom:1px solid #dfe4e8; }
    .pdetail-procurement-grid>div:last-child { border-bottom:0; }
    .pdetail-capability-list { grid-template-columns:1fr; }
    .pdetail-logistics-snapshot dl>div { grid-template-columns:108px minmax(0,1fr); }
    .pdetail-tab-button { padding:0 15px; font-size:12px; }
    .pdetail-tab-panel { padding:17px 12px; }
    .pdetail-spec-header { align-items:flex-start; flex-direction:column; gap:6px; }
    .pdetail-spec-header p { text-align:left; }
    .pdetail-datasheet { min-width:560px; }
    .pdetail-capability-cards, .pdetail-delivery-grid { grid-template-columns:1fr; }
    .pdetail-capability-cards article, .pdetail-delivery-grid>div { border-right:0; border-bottom:1px solid var(--pdetail-line); }
    .pdetail-capability-cards article:last-child, .pdetail-delivery-grid>div:last-child { border-bottom:0; }
    .pdetail-lightbox { padding:56px 10px 16px; }
}

/* C0015: exact desktop gallery stage 750x800 */
@media (min-width: 1500px) {
    .pdetail-hero {
        grid-template-columns: 878px minmax(440px, 1fr);
        align-items: start;
    }

    .pdetail-gallery {
        width: 878px;
        min-width: 878px;
        min-height: 872px;
        grid-template-columns: 88px 750px;
        gap: 14px;
        align-self: start;
    }

    .pdetail-thumbnails {
        max-height: 800px;
    }

    .pdetail-gallery-content {
        width: 750px;
        min-width: 750px;
        height: 846px;
        grid-template-rows: 800px 46px;
    }

    .pdetail-main-media {
        width: 750px;
        min-width: 750px;
        max-width: 750px;
        height: 800px;
        min-height: 800px;
        max-height: 800px;
        aspect-ratio: auto;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
    }

    .pdetail-main-image {
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center center;
    }
}