/* Page Hero — compact */
.page-hero{position:relative;min-height:46vh;display:flex;align-items:center;padding-top:130px;padding-bottom:76px;overflow:hidden}
.page-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 80% 25%,rgba(124,189,235,.18),transparent 50%),radial-gradient(ellipse at 15% 85%,rgba(245,158,11,.08),transparent 45%)}
.page-hero::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(45deg,rgba(255,255,255,.025) 0 1px,transparent 1px 14px),repeating-linear-gradient(-45deg,rgba(255,255,255,.02) 0 1px,transparent 1px 18px);pointer-events:none}
.page-hero-inner{position:relative;z-index:2;width:100%}
.breadcrumb{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--text-faint);margin-bottom:20px;flex-wrap:wrap}
.breadcrumb a{color:var(--text-faint);transition:color .2s}
.breadcrumb a:hover{color:var(--text-mute)}
.breadcrumb .sep{opacity:.5}
.page-hero h1{font-size:clamp(38px,5vw,60px);color:#fff;letter-spacing:-.045em;line-height:1.04;margin-bottom:18px;max-width:900px}
.page-hero h1 span{background:linear-gradient(120deg,var(--blue-light),#A8D8F5 60%,#fff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.page-hero-sub{font-size:clamp(16px,1.7vw,19px);color:rgba(255,255,255,.78);max-width:680px;line-height:1.6;font-weight:300}
.hero-chips{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}
.hero-chip{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.09);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:14px 22px;min-width:150px}
.hero-chip b{font-size:22px;font-weight:700;color:#fff;line-height:1}
.hero-chip span{font-size:11.5px;color:rgba(255,255,255,.62);text-transform:uppercase;letter-spacing:.1em}

/* Section common */
.section{padding:92px 0;position:relative}
.section-dark{background:linear-gradient(160deg,var(--deep) 0%,var(--primary-3) 100%);color:#fff}
.section-mist{background:var(--blue-mist)}
.section-header{margin-bottom:48px;max-width:820px}
.section-num{font-size:14px;font-weight:600;color:var(--blue);letter-spacing:.18em;margin-bottom:16px;text-transform:uppercase;display:flex;align-items:center;gap:12px}
.section-num::before{content:'';width:34px;height:2px;background:var(--blue)}
.section-dark .section-num{color:var(--blue-light)}
.section-dark .section-num::before{background:var(--blue-light)}
.section-title{font-size:clamp(32px,4vw,46px);font-weight:700;letter-spacing:-.035em;line-height:1.08;margin-bottom:18px;color:var(--text)}
.section-dark .section-title{color:#fff}
.section-title span{background:linear-gradient(120deg,var(--blue),var(--primary));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.section-sub{font-size:17px;color:var(--text-mute);max-width:760px;line-height:1.65}

/* ============== FILTER PILLS ============== */
.filter-wrap{display:flex;flex-direction:column;gap:14px;align-items:flex-start;margin:0 0 36px}
.fpills{display:flex;gap:10px;flex-wrap:wrap}
.fpill{display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border-radius:60px;background:#fff;border:1px solid var(--line);font-size:14.5px;font-weight:500;color:var(--text-body);cursor:pointer;transition:all .25s;user-select:none}
.fpill svg{width:15px;height:15px;opacity:.75}
.fpill:hover{transform:translateY(-2px);box-shadow:var(--shadow-1);border-color:rgba(46,116,181,.25);color:var(--primary)}
.fpill.active{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;border-color:transparent;box-shadow:0 8px 20px rgba(46,116,181,.28)}
.fpill.active svg{opacity:1}
.fpill.accent-green.active{background:linear-gradient(135deg,#10B981,#059669);box-shadow:0 8px 20px rgba(16,185,129,.28)}
.fpill.accent-teal.active{background:linear-gradient(135deg,#14B8A6,#0F766E);box-shadow:0 8px 20px rgba(20,184,166,.28)}
.fpill.accent-purple.active{background:linear-gradient(135deg,#8B5CF6,#7C3AED);box-shadow:0 8px 20px rgba(124,58,237,.28)}
.fpill.accent-amber.active{background:linear-gradient(135deg,#F59E0B,#D97706);box-shadow:0 8px 20px rgba(245,158,11,.28)}
.fpill.accent-rose.active{background:linear-gradient(135deg,#F43F5E,#BE123C);box-shadow:0 8px 20px rgba(244,63,94,.28)}
.fpill-row{display:flex;gap:8px;flex-wrap:wrap;padding-left:6px;border-left:2px solid var(--line)}
.fpill.sub{font-size:13px;padding:8px 16px;background:var(--blue-mist);border-color:transparent}
.fpill.sub.active{background:var(--primary);color:#fff}
.result-count{font-size:13.5px;color:var(--text-mute);display:flex;align-items:center;gap:8px}
.result-count b{color:var(--primary);font-family:'Space Grotesk',sans-serif}

/* ============== PRODUCT GRID ============== */
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.pcard{background:#fff;border:1px solid rgba(46,116,181,.08);border-radius:20px;overflow:hidden;box-shadow:var(--shadow-1);transition:all .35s ease;display:flex;flex-direction:column;scroll-margin-top:120px}
.pcard:hover{transform:translateY(-6px);box-shadow:var(--shadow-2);border-color:rgba(46,116,181,.22)}
.pvisual{position:relative;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.pvisual::after{content:'';position:absolute;inset:0;/*background:repeating-linear-gradient(45deg,rgba(255,255,255,.07) 0 1px,transparent 1px 10px),repeating-linear-gradient(-45deg,rgba(255,255,255,.05) 0 1px,transparent 1px 15px);*/pointer-events:none}
.pvisual.acc-blue{background:linear-gradient(135deg,#2E74B5,#164672)}
.pvisual.acc-green{background:linear-gradient(135deg,#34D399,#059669)}
.pvisual.acc-amber{background:linear-gradient(135deg,#F59E0B,#D97706)}
.pvisual.acc-teal{background:linear-gradient(135deg,#14B8A6,#0F766E)}
.pvisual.acc-purple{background:linear-gradient(135deg,#A78BFA,#7C3AED)}
.pvisual.acc-rose{background:linear-gradient(135deg,#F43F5E,#BE123C)}
.pimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.pchip{position:absolute;top:14px;left:14px;z-index:2;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:rgba(255,255,255,.16);backdrop-filter:blur(8px);padding:5px 12px;border-radius:60px;border:1px solid rgba(255,255,255,.22)}
.pcode{position:absolute;bottom:10px;right:14px;z-index:2;font-size:32px;font-weight:700;color:rgba(255,255,255,.18);line-height:1;letter-spacing:-.03em}
.pbody{padding:18px 18px 20px;display:flex;flex-direction:column;gap:8px;flex:1}
.pname{font-size:15.5px;color:var(--text);letter-spacing:-.015em;line-height:1.3;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}
.pdesc{font-size:12px;color:var(--text-mute);line-height:1.55;min-height:38px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.pspecs{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
.pspec{font-size:10.5px;color:var(--text-body);background:var(--blue-mist);border:1px solid rgba(46,116,181,.08);padding:3px 9px;border-radius:60px;font-weight:500}
.pspec b{color:var(--primary);font-weight:600}
.pact{margin-top:auto;display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--primary);padding-top:12px;border-top:1px dashed var(--line);transition:gap .25s}
.pact svg{width:14px;height:14px}
.pact:hover{gap:11px;color:var(--amber-dark)}

/* ============== PAGINATION ============== */
.pager-wrap{display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:48px}
.pager{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:center}
.pbtn{min-width:42px;height:42px;padding:0 14px;border-radius:12px;border:1px solid var(--line);background:#fff;font-size:14px;font-weight:600;color:var(--text-body);cursor:pointer;transition:all .22s;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.pbtn svg{width:15px;height:15px}
.pbtn:hover:not(:disabled){border-color:rgba(46,116,181,.3);color:var(--primary);transform:translateY(-2px)}
.pbtn.active{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;border-color:transparent;box-shadow:0 6px 16px rgba(46,116,181,.28)}
.pbtn:disabled{opacity:.35;cursor:not-allowed}
.pbtn.dots{border:none;background:transparent;cursor:default;min-width:18px}

/* ============== CATEGORY DIRECTORY ============== */
.cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.cat-card{position:relative;background:#fff;border:1px solid rgba(46,116,181,.08);border-radius:20px;padding:30px 26px;box-shadow:var(--shadow-1);transition:all .35s;overflow:hidden;display:flex;flex-direction:column;gap:12px;scroll-margin-top:120px}
.cat-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-2);border-color:rgba(46,116,181,.2)}
.cat-card .cat-icon{width:52px;height:52px;border-radius:16px;display:flex;align-items:center;justify-content:center;color:#fff}
.cat-card .cat-icon svg{width:25px;height:25px}
.cat-card h3{font-size:18px;color:var(--text);letter-spacing:-.02em}
.cat-card p{font-size:13px;color:var(--text-mute);line-height:1.6;flex:1}
.cat-card .cat-link{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;color:var(--primary)}
.cat-card .cat-link svg{width:14px;height:14px;transition:transform .25s}
.cat-card:hover .cat-link svg{transform:translateX(4px)}
.cat-card .cat-count{position:absolute;top:22px;right:22px;font-size:11px;font-weight:700;color:var(--text-faint);letter-spacing:.08em}

.featured-cat{display:grid;grid-template-columns:1fr 1fr;gap:32px;background:#fff;border:1px solid rgba(46,116,181,.08);border-radius:24px;padding:38px 42px;box-shadow:var(--shadow-1);transition:all .35s;position:relative;overflow:hidden;scroll-margin-top:120px}
.featured-cat:hover{transform:translateY(-5px);box-shadow:var(--shadow-2);border-color:rgba(46,116,181,.2)}
.featured-cat-left{position:relative;z-index:1;display:flex;flex-direction:column;gap:14px}
.featured-cat h3{font-size:28px;color:var(--text);letter-spacing:-.03em}
.featured-cat p{font-size:14.5px;color:var(--text-mute);line-height:1.65;max-width:520px}
.featured-cat .cat-link{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:600;color:var(--primary);margin-top:4px}
.featured-cat .cat-link svg{width:16px;height:16px;transition:transform .25s}
.featured-cat:hover .cat-link svg{transform:translateX(5px)}
.featured-cat-subs{display:flex;flex-direction:column;gap:14px;justify-content:center;position:relative;z-index:1}
.sub-chip{display:flex;align-items:center;gap:16px;background:var(--blue-mist);border:1px solid rgba(46,116,181,.08);border-radius:16px;padding:16px 20px;transition:all .25s;cursor:pointer}
.sub-chip:hover{background:#fff;border-color:rgba(46,116,181,.25);transform:translateX(6px);box-shadow:var(--shadow-1)}
.sub-chip .sub-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.sub-chip div{flex:1;display:flex;flex-direction:column;gap:3px}
.sub-chip b{font-size:15px;color:var(--text);font-weight:600}
.sub-chip span{font-size:12.5px;color:var(--text-mute)}
.sub-chip svg{color:var(--text-faint);transition:all .25s}
.sub-chip:hover svg{color:var(--primary);transform:translateX(4px)}
.featured-cat::before{content:'';position:absolute;right:0;top:0;bottom:0;width:42%;background:linear-gradient(135deg,rgba(68,153,212,.06),rgba(124,189,235,.03));pointer-events:none}

@media(max-width:760px){
    .cat-grid{grid-template-columns:repeat(2,1fr)}
    .featured-cat{grid-template-columns:1fr;gap:28px;padding:34px 30px}
    .featured-cat::before{width:100%;height:35%;top:auto;bottom:0}
}
@media(max-width:480px){
    .cat-grid{grid-template-columns:1fr}
    .featured-cat{padding:26px 22px}
    .featured-cat h3{font-size:22px}
    .sub-chip{padding:13px 16px}
}

/* ============== CROSS CATEGORY STRIP ============== */
.xcat{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:34px}
.xcat-card{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px 24px;transition:all .3s;box-shadow:var(--shadow-1)}
.xcat-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-2);border-color:rgba(46,116,181,.22)}
.xcat-icon{width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}
.xcat-icon svg{width:22px;height:22px}
.xcat-card h4{font-size:15.5px;color:var(--text);letter-spacing:-.015em}
.xcat-card span{font-size:12.5px;color:var(--text-mute)}
.xcat-card .xarrow{margin-left:auto;color:var(--text-faint);transition:all .25s}
.xcat-card:hover .xarrow{color:var(--primary);transform:translateX(4px)}



.reveal{opacity:0;transform:translateY(34px);transition:opacity .7s ease,transform .7s ease}
.reveal.visible{opacity:1;transform:translateY(0)}

/* Responsive */

@media(max-width:760px){
    .cat-grid{grid-template-columns:repeat(3,1fr)}
    .xcat{grid-template-columns:repeat(2,1fr)}
    .pgrid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:1024px){
    .hdr-menu{display:none}
    .hdr-burger{display:flex}
    .ftr-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
    .container{padding:0 24px}
    .hdr-main{padding:16px 24px}
    .section{padding:68px 0}
    .page-hero{min-height:auto;padding-top:112px;padding-bottom:56px}
    .hero-chips{gap:10px}
    .hero-chip{min-width:130px;padding:11px 16px}
    .hero-chip b{font-size:18px}
    .cat-grid{grid-template-columns:1fr}
    .xcat{grid-template-columns:1fr}
    .pgrid{grid-template-columns:1fr}
    .ftr-grid{grid-template-columns:1fr}
    .fpills{gap:8px}
    .fpill{padding:9px 16px;font-size:13.5px}
    .pname{min-height:0}
    .pdesc{min-height:0}
}

.container{max-width:1400px;margin:0 auto;padding:0 48px}

/* ===== Product Detail v11 (unified: material OR scenario) ===== */
.pd-wrap{padding-top:96px;padding-bottom:80px}
.pd-layout{display:grid;grid-template-columns:260px 1fr;gap:36px;align-items:start}
/* Application scenario products: NO sidebar, full width */
.pd-layout.no-sb{grid-template-columns:1fr}
.pd-layout.no-sb .pd-sidebar{display:none}

/* Sidebar (flat material directory, matches products.html style) */
.pd-sidebar{position:sticky;top:96px;background:#fff;border:1px solid rgba(46,116,181,.10);border-radius:16px;padding:18px 18px 14px;box-shadow:var(--shadow-1);max-height:calc(100vh - 110px);overflow-y:auto}
.pd-sidebar-head{margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.pd-sidebar-head span:first-child{font-size:13px;font-weight:700;color:var(--primary);letter-spacing:.14em;text-transform:uppercase}
.pd-sb-cat{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:10px;color:var(--text-body);font-size:14px;font-weight:500;text-decoration:none;transition:background .2s,color .2s,border-color .2s;border:1px solid transparent;margin-bottom:2px}
.pd-sb-cat:hover{background:var(--blue-mist);color:var(--primary);border-color:rgba(46,116,181,.12)}
.pd-sb-cat.active{background:linear-gradient(135deg,#2E74B5 0%,#1F5E94 100%);color:#fff;font-weight:600;box-shadow:0 6px 18px rgba(46,116,181,.25);border-color:transparent}
.pd-sb-cat .pd-sb-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.pd-sb-cat .pd-sb-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:1100px){
    .pd-layout{grid-template-columns:1fr}
    .pd-sidebar{position:static;max-height:none}
}

/* ============== PRODUCT CATALOGUE (sidebar + grid) ============== */
.prodl-layout{display:grid;grid-template-columns:260px 1fr;gap:48px;align-items:flex-start}
.prodl-sidebar{position:sticky;top:96px;background:#fff;border:1px solid rgba(46,116,181,.10);border-radius:18px;padding:20px 18px;box-shadow:var(--shadow-1)}
.prodl-sidebar-head{font-size:11px;font-weight:700;color:var(--primary);letter-spacing:.18em;text-transform:uppercase;padding:0 8px 12px;border-bottom:1px solid var(--line);margin-bottom:10px}
.prodl-cat-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:2px}
.prodl-cat-item{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:10px;cursor:pointer;transition:background .2s,color .2s,border-color .2s;font-size:14px;color:var(--text-body);font-weight:500;border:1px solid transparent}
.prodl-cat-item:hover{background:var(--blue-mist);color:var(--primary);border-color:rgba(46,116,181,.12)}
.prodl-cat-item.active{background:linear-gradient(135deg,#2E74B5 0%,#1F5E94 100%);color:#fff;font-weight:600;box-shadow:0 6px 18px rgba(46,116,181,.25)}
.prodl-cat-item.active:hover{background:linear-gradient(135deg,#2E74B5 0%,#1F5E94 100%)}
.prodl-cat-tag{display:flex;align-items:center;gap:9px;min-width:0}
.prodl-cat-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.prodl-cat-dot.d-viscose-pet{background:#2E74B5}
.prodl-cat-dot.d-woodpulp-pet{background:#10B981}
.prodl-cat-dot.d-woodpulp-pp{background:#F59E0B}
.prodl-cat-dot.d-biodegradable{background:#14B8A6}
.prodl-cat-dot.d-flushable{background:#06B6D4}
.prodl-cat-dot.d-microfiber{background:#7C3AED}
.prodl-cat-dot.d-meltblown{background:#F43F5E}
.prodl-cat-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prodl-main{min-width:0}
.prodl-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:24px;flex-wrap:wrap}
.prodl-head h2{font-size:24px;color:var(--text);letter-spacing:-.02em;font-weight:700}
.prodl-head h2 .prodl-accent{color:var(--primary)}
.prodl-head-meta{font-size:13.5px;color:var(--text-mute)}
.prodl-head-meta b{color:var(--primary);font-weight:700}

/* Product top section */
.pd-product{display:grid;grid-template-columns:400px 1fr;gap:36px;margin-bottom:50px;align-items:stretch;}

/* Image with zoom */
.pd-visual{position:relative;width:400px;height:400px;border-radius:18px;overflow:hidden;box-shadow:var(--shadow-1);border:1px solid rgba(46,116,181,.08);cursor:crosshair;background:#fff}
.pd-img{width:100%;height:100%;background-size:cover;background-position:center;transition:opacity .2s}
.zoom-lens{position:absolute;width:120px;height:120px;border-radius:50%;border:2px solid rgba(255,255,255,.9);box-shadow:0 0 0 1px rgba(46,116,181,.2),0 8px 24px rgba(14,46,82,.25);background-repeat:no-repeat;pointer-events:none;opacity:0;transition:opacity .15s;z-index:10;background-color:#fff}
.pd-visual:hover .zoom-lens{opacity:1}

/* Product info block */
.pd-info-top{display:flex;flex-direction:column;gap:18px}
.pd-name{font-size:26px;font-weight:700;color:var(--text);line-height:1.12;letter-spacing:-.02em}
.pd-spec-list{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(46,116,181,.10);border:1px solid rgba(46,116,181,.10);border-radius:12px;overflow:hidden}
.pd-spec-row{display:flex;align-items:center;justify-content:space-between;padding:9px 14px;background:#fff;gap:12px;min-height:36px}
.pd-spec-row .label{font-size:11px;color:var(--text-mute);text-transform:uppercase;letter-spacing:.04em;font-weight:600;flex-shrink:0}
.pd-spec-row .value{font-size:13px;font-weight:600;color:var(--text);text-align:right;display:flex;flex-wrap:wrap;gap:4px;justify-content:flex-end;max-width:62%}
.pd-spec-row .value .v-single{padding:0}
.pd-spec-row .value .v-multi{font-weight:600;color:var(--text)}
.pd-spec-row .value .v-multi .sep{color:var(--text-faint);font-weight:400;margin:0 4px}
.pd-spec-row .value .v-chip{padding:3px 9px;background:rgba(46,116,181,.08);color:var(--text);border-radius:14px;font-size:12px;font-weight:600;line-height:1.2}
.pd-spec-row .value .v-chip.primary{background:var(--blue-pale);color:var(--primary)}
.pd-spec-row .value .v-empty{color:var(--text-faint);font-weight:400;font-style:italic;font-size:12px}

.pd-actions-top{display:flex;gap:14px;align-items:center;margin-top:auto;}
.pd-btn-primary{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;background:var(--amber);color:#fff;font-size:15px;font-weight:600;border-radius:60px;border:none;cursor:pointer;transition:all .3s}
.pd-btn-primary:hover{background:var(--amber-dark);transform:translateY(-2px);box-shadow:0 8px 24px rgba(245,158,11,.35)}
.pd-btn-secondary{display:inline-flex;align-items:center;gap:8px;padding:13px 24px;background:#fff;color:var(--text);font-size:14px;font-weight:600;border-radius:60px;border:1px solid var(--line);transition:all .2s}
.pd-btn-secondary:hover{border-color:var(--blue);color:var(--primary)}

/* Editable product description area */
.pd-desc-area{background:#fff;border:1px solid rgba(46,116,181,.08);border-radius:18px;padding:32px;box-shadow:var(--shadow-1);margin-bottom:50px;min-height:180px}
.pd-desc-area h2{font-size:22px;color:var(--text);margin-bottom:14px}
.pd-desc-area .pd-desc-placeholder{color:var(--text-faint);font-size:15px;line-height:1.7}

/* Related products */
.pd-related{margin-top:0}
.pd-related h2{font-size:24px;color:var(--text);margin-bottom:22px}
.pd-related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.pcard{background:#fff;border:1px solid rgba(46,116,181,.08);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-1);transition:all .25s;display:flex;flex-direction:column}
.pcard:hover{transform:translateY(-4px);box-shadow:var(--shadow-2)}
.pcard .pvisual{position:relative;height:140px;background:linear-gradient(135deg,var(--primary),var(--blue));display:flex;flex-direction:column;justify-content:space-between;padding:14px;color:#fff}
.pcard .pchip{align-self:flex-start;padding:5px 10px;background:rgba(255,255,255,.2);backdrop-filter:blur(4px);border-radius:20px;font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.pcard .pcode{align-self:flex-end;font-size:13px;font-weight:600;opacity:.9}
.pcard .pbody{padding:16px;display:flex;flex-direction:column;flex:1}
.pcard .pname{font-size:15px;font-weight:700;color:var(--text);line-height:1.3;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}
.pcard .pdesc{font-size:13px;color:var(--text-body);line-height:1.55;margin-bottom:14px;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.pcard .pspecs{display:flex;gap:10px;margin-bottom:14px}
.pcard .pspec{font-size:12px;color:var(--text-mute);background:var(--bg);padding:5px 10px;border-radius:20px}
.pcard .pspec b{color:var(--text);font-weight:600}
.pcard .pact{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--primary)}
.pcard .pact svg{width:14px;height:14px}

/* Quote Modal */
.modal-overlay{position:fixed;inset:0;background:rgba(14,46,82,.55);backdrop-filter:blur(6px);z-index:2000;display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;visibility:hidden;transition:all .25s ease}
.modal-overlay.open{opacity:1;visibility:visible}
.modal{background:#fff;border-radius:20px;width:100%;max-width:520px;box-shadow:var(--shadow-3);transform:translateY(16px);transition:transform .25s ease}
.modal-overlay.open .modal{transform:translateY(0)}
.modal-header{display:flex;justify-content:space-between;align-items:center;padding:22px 28px;border-bottom:1px solid var(--line)}
.modal-header h3{font-size:20px;color:var(--text)}
.modal-close{width:34px;height:34px;border-radius:50%;border:none;background:var(--bg-2);color:var(--text-mute);font-size:22px;line-height:1;cursor:pointer;transition:all .2s}
.modal-close:hover{background:var(--line);color:var(--text)}
.modal-body{padding:26px 28px 30px}
.modal-body>p{font-size:14.5px;color:var(--text-mute);margin-bottom:20px}
.form-row{margin-bottom:16px}
.form-row input,.form-row textarea{width:100%;padding:13px 16px;border:1px solid var(--line);border-radius:12px;font-size:15px;color:var(--text);background:#fff;transition:border-color .2s;font-family:inherit}
.form-row input:focus,.form-row textarea:focus{outline:none;border-color:var(--blue)}
.form-row textarea{resize:vertical;min-height:96px}
.form-row.half{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.modal-body .pd-btn-primary{width:100%;justify-content:center}

@media(max-width:900px){
    .pd-product{grid-template-columns:1fr}
    .pd-visual{margin:0 auto}
}

/* ===== Scenario product view ===== */
.pd-scn{padding-top:0}
.pd-scn-hero{position:relative;height:220px;border-radius:18px;overflow:hidden;background:var(--blue-mist);margin-bottom:18px;box-shadow:var(--shadow-1);border:1px solid rgba(46,116,181,.08)}
.pd-scn-hero img{width:100%;height:100%;object-fit:cover;display:block}
.pd-scn-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,46,82,.05) 0%,rgba(14,46,82,.62) 100%);pointer-events:none}
.pd-scn-hero-text{position:absolute;left:0;right:0;bottom:0;padding:18px 28px;color:#fff;z-index:2}
.pd-scn-hero-text .pd-scn-zh{font-size:11px;letter-spacing:.18em;text-transform:uppercase;opacity:.85;margin-bottom:4px;font-weight:600}
.pd-scn-hero-text h1{font-size:clamp(22px,2.6vw,30px);color:#fff;line-height:1.18;letter-spacing:-.025em;margin-bottom:2px;max-width:780px}
.pd-scn-hero-text .pd-scn-en{font-size:13px;color:rgba(255,255,255,.85);letter-spacing:.04em;font-weight:400}

/* (intro block removed — hero flows directly into product recommendations) */

.pd-scn-products{margin-top:36px}
.pd-scn-products-head{max-width:920px;margin-bottom:28px}
.pd-scn-products-eyebrow{display:inline-flex;align-items:center;gap:12px;font-size:13px;font-weight:600;color:var(--primary);letter-spacing:.18em;text-transform:uppercase;margin-bottom:14px}
.pd-scn-products-eyebrow::before{content:'';width:34px;height:2px;background:var(--primary)}
.pd-scn-products-head h2{font-size:clamp(24px,2.8vw,34px);color:var(--text);letter-spacing:-.025em;line-height:1.1;margin-bottom:10px}
.pd-scn-products-sub{font-size:15px;color:var(--text-mute);line-height:1.7}
.pd-scn-prod-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.scpcard{display:flex;flex-direction:column;background:#fff;border:1px solid rgba(46,116,181,.08);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-1);transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease,border-color .3s;text-decoration:none}
.scpcard:hover{transform:translateY(-5px);box-shadow:var(--shadow-2);border-color:rgba(46,116,181,.28)}
.scp-visual{position:relative;height:150px;display:flex;flex-direction:column;justify-content:space-between;padding:12px 14px;color:#fff;flex-shrink:0;background-size:cover;background-position:center;background-color:var(--primary)}
.scp-visual::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,46,82,.05) 0%,rgba(14,46,82,.55) 100%);pointer-events:none}
.scp-visual > *{position:relative;z-index:2}
.scp-chip{align-self:flex-start;padding:4px 10px;background:rgba(255,255,255,.22);border-radius:20px;font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;backdrop-filter:blur(4px)}
.scp-code{align-self:flex-end;font-size:14px;font-weight:600;opacity:.95;letter-spacing:.03em}
.scp-body{padding:15px 16px 17px;display:flex;flex-direction:column;flex:1}
.scp-name{font-size:15px;font-weight:700;color:var(--text);line-height:1.3;margin-bottom:7px}
.scp-desc{font-size:12.8px;color:var(--text-body);line-height:1.55;margin-bottom:13px;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.scp-meta{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.scp-spec{font-size:11.5px;color:var(--text-mute);background:var(--bg);border:1px solid var(--line);padding:4px 9px;border-radius:20px;line-height:1.2}
.scp-spec b{color:var(--text);font-weight:600}
.scp-go{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--primary)}
.scp-go svg{width:14px;height:14px;transition:transform .25s}
.scpcard:hover .scp-go svg{transform:translateX(3px)}
.pd-scn-products-cta{margin-top:36px;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;background:linear-gradient(120deg,var(--blue-pale),var(--blue-mist));border:1px solid rgba(46,116,181,.12);border-radius:18px;padding:20px 26px}
.pd-scn-products-cta span{font-size:14.5px;color:var(--text-body);font-weight:500}
.pd-scn-products-cta .pd-btn-primary{flex-shrink:0}
@media(max-width:1180px){.pd-scn-prod-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.pd-scn-prod-grid{grid-template-columns:repeat(2,1fr)}.pd-scn-products-cta{flex-direction:column;align-items:flex-start}}
@media(max-width:480px){.pd-scn-prod-grid{grid-template-columns:1fr}}


@media(max-width:900px){
    .pd-scn-hero{height:320px}
    .pd-scn-hero-text{padding:24px 28px}
    .pd-scn-body{grid-template-columns:1fr}
}
@media(max-width:760px){
    .pd-related-grid{grid-template-columns:repeat(2,1fr)}
    .pd-spec-mini{grid-template-columns:1fr}
    .pd-spec-list{grid-template-columns:1fr}
    .hdr-menu{display:none}
    .hdr-burger{display:flex}
}
@media(max-width:480px){
    .pd-related-grid{grid-template-columns:1fr}
    .pd-actions-top{flex-direction:column;align-items:stretch}
    .pd-actions-top .pd-btn-primary,.pd-actions-top .pd-btn-secondary{justify-content:center}
    .form-row.half{grid-template-columns:1fr}
}

.table-card {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #d8e3f0;
    border-radius: 15px;
    color: #222;
    overflow: hidden;
}
.table-card td {
    padding: 10px 10px;
    border-bottom: 1px solid #d8e3f0;
    font-size:13px;
}
.table-card td:last-child {
    border-left: 1px solid #d8e3f0;
}
.table-card tr:last-child td {
    border-bottom: none;
}
.table-card td:first-child {
    text-align: left;
    color: #222;
}
.table-card td:last-child {
    text-align: right;
    color: #42546b;
    font-weight: 600;
}