/* Compact facts stay visible. Native disclosures keep details beside their trigger. */
.product-benefits{background:#f5f2e9;border-block:1px solid #dfdfd1;padding-block:56px}
.product-benefits .construction-heading{max-width:820px;margin-bottom:24px}
.product-benefits .construction-heading h2{font-size:clamp(38px,4.6vw,58px);line-height:1.08;margin-bottom:16px}
.product-benefits .construction-heading>p{font-size:18px;line-height:1.55;max-width:650px;margin:0}
.product-benefits .construction-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:center;gap:32px}
.product-benefits .construction-content{min-width:0}
.product-benefits .construction-visual{margin:0;border:1px solid #c8cbbf}
.product-benefits .construction-visual figcaption{font-size:16px;line-height:1.4;bottom:10px;left:10px;padding:4px 7px}
.product-benefits .construction-focus{opacity:1;transition:opacity .18s,left .25s,top .25s,width .25s,height .25s;pointer-events:none}
.product-benefits .construction-visual[data-detail="all"] .construction-focus{opacity:0}
.part-marker{position:absolute;width:28px;height:28px;display:grid;place-items:center;border:1px solid #fffdf7;border-radius:50%;background:#314d3e;color:#fffdf7;font:650 16px/1 var(--sans);box-shadow:0 1px 4px #17282430;transition:background .18s,transform .18s}
.marker-slat{left:20%;top:38%}.marker-guide{left:76%;top:56%}.marker-mount{left:86%;top:15%}
.construction-visual[data-detail="slat"] .marker-slat,.construction-visual[data-detail="guide"] .marker-guide,.construction-visual[data-detail="mount"] .marker-mount{background:#5b6d47;transform:scale(1.12)}
.benefit-parts-label{font-size:17px;font-weight:650;line-height:1.4;margin:0 0 12px;color:#314d3e}
.benefit-parts-label>span{display:block;font-weight:400;font-size:16px;line-height:1.45;color:#536250;margin-top:4px}
.construction-part{border-top:1px solid #bdc7b6}
.construction-part:last-child{border-bottom:1px solid #bdc7b6}
.construction-part summary{display:grid;grid-template-columns:24px minmax(0,1fr) 20px;align-items:start;gap:10px;list-style:none;cursor:pointer;padding:16px 4px;min-height:48px;box-sizing:border-box}
.construction-part summary::-webkit-details-marker,.benefit-detail summary::-webkit-details-marker,.benefit-film summary::-webkit-details-marker,.benefit-sources summary::-webkit-details-marker{display:none}
.part-number{font-size:18px;font-weight:650;line-height:1.45;color:#557053}
.construction-part strong{display:block;font-size:18px;line-height:1.4;color:#253e30}
.part-short{display:block;font-size:17px;line-height:1.5;color:#4b5c50;margin-top:3px}
.disclosure-icon{font-size:24px;font-weight:400;line-height:1.1;flex:none;transition:transform .18s;color:#426046}
.construction-part[open]>summary,.benefit-detail[open]>summary{color:#243f2f;background:#e7ebdf}
.construction-part[open]>summary .disclosure-icon,.benefit-detail[open]>summary .disclosure-icon,.benefit-film[open]>summary .disclosure-icon,.benefit-sources[open]>summary>span{transform:rotate(45deg)}
.part-explanation{padding:0 12px 18px 38px}
.part-explanation p{margin:0;font-size:17px;line-height:1.55;color:#445747}
.benefit-safety{font-size:16px;line-height:1.5;margin:20px 0 24px;padding:14px 16px;background:#ececdf;border-left:3px solid #7a8e70;color:#455343}
.benefit-safety strong{color:#304a36}
.benefit-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;scroll-margin-top:24px}
.benefit-card{min-width:0;align-self:start;padding:20px;background:#fffdf7;border:1px solid #d6d8ca}
.benefit-card-heading{display:flex;align-items:center;gap:10px;margin-bottom:10px;color:#557053}
.benefit-symbol{font-size:27px;width:28px;height:28px;line-height:1;flex:none}
.benefit-card-kicker{font-size:16px;font-weight:650;line-height:1.4}
.benefit-card h3{font:400 28px/1.16 var(--serif);letter-spacing:-.025em;margin:0 0 10px}
.benefit-card>p{font-size:17px;line-height:1.5;color:#48594d;margin:0 0 12px}
.benefit-summer{background:#f4f3e4}
.benefit-noise{background:#edf1e7;scroll-margin-top:24px}
.heat-fact{padding:12px;background:#ece5d8;margin-bottom:8px}
.heat-fact>strong{font-size:21px;line-height:1.3;display:block;color:#324b35}
.heat-fact>p{font-size:16px;line-height:1.5;margin:5px 0 0;color:#48533f}
.benefit-detail{border-top:1px solid #c7cdbd}
.benefit-detail summary{display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none;cursor:pointer;font-size:16px;font-weight:600;line-height:1.4;min-height:48px;padding:10px 0;box-sizing:border-box;color:#314e3a}
.benefit-explanation{padding-bottom:4px}
.benefit-explanation>p{font-size:17px;line-height:1.55;color:#48594d;margin:12px 0 0}
.heat-chart{padding:12px;background:#ece5d8;color:#48533f}
.heat-chart-row{display:flex;flex-direction:column;gap:5px;margin-bottom:10px;font-size:16px;line-height:1.4}
.heat-chart-row:last-child{margin-bottom:0}
.heat-bar{height:10px;border-radius:3px;display:block;background:#ad8660;flex:none}
.heat-bar-full{width:100%}.heat-bar-lower{width:80.95238%;background:#527353}
.benefit-layer-diagram{display:flex;gap:8px;align-items:stretch;justify-content:center;padding:12px 8px;min-height:132px;border-block:1px solid #d0d5c2;box-sizing:border-box}
.benefit-layer-diagram>span{font-size:16px;line-height:1.4;display:flex;align-items:center;justify-content:center;text-align:center;min-width:0}
.diagram-outside{flex:1;color:#816528}
.diagram-shutter{width:38px;writing-mode:vertical-rl;background:repeating-linear-gradient(0deg,#c0bdb0 0 10px,#aba89c 10px 12px);border:1px solid #969b8c;color:#23362b;flex:none;padding:8px 0}
.diagram-glass{writing-mode:vertical-rl;width:26px;flex:none;background:#d3e1df;border-inline:2px solid #849c99;color:#294a45;padding:8px 0}
.diagram-inside{flex:1;color:#435b42}.diagram-gap{writing-mode:vertical-rl;flex:none;width:24px;color:#506652}
.diagram-sound .diagram-outside{color:#4a6050}
.benefit-energy{padding:20px 0;margin:0;max-width:850px;font-size:17px;line-height:1.55;color:#48594d}
.benefit-energy strong{color:#2f4836}
.benefit-film,.benefit-sources{border-top:1px solid #bac5b3;scroll-margin-top:24px}
.benefit-film summary,.benefit-sources summary{display:flex;justify-content:space-between;align-items:center;gap:16px;cursor:pointer;list-style:none;font-size:17px;line-height:1.5;font-weight:650;min-height:56px;padding:14px 0;box-sizing:border-box;color:#314e3a}
.benefit-sources summary>span{font-size:24px;font-weight:400;line-height:1;flex:none;transition:transform .18s}
.benefit-film>p{font-size:17px;line-height:1.55;max-width:800px;margin:0 0 16px;color:#48594d}
.benefit-source-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding:8px 0 24px}
.benefit-source-grid h4{font-size:18px;line-height:1.4;margin:0 0 10px}
.benefit-source-grid p{font-size:17px;line-height:1.55;color:#48594d;margin:0 0 8px}
.benefit-source-grid a{display:inline-flex;min-height:48px;align-items:center;font-size:16px;line-height:1.5;text-underline-offset:4px;color:#31583c;padding-block:8px}
.benefit-next{display:flex;justify-content:flex-end;border-top:1px solid #bac5b3;padding-top:20px}
.product-benefits a:focus-visible,.product-benefits summary:focus-visible{outline:3px solid #526d4f;outline-offset:3px}
@media(hover:hover){.construction-part summary:hover,.benefit-detail summary:hover,.benefit-film summary:hover,.benefit-sources summary:hover{background:#e7ebdf}}
@media(max-width:760px){
 .product-benefits{padding-block:32px}
 .product-benefits .construction-heading{margin-bottom:20px}
 .product-benefits .construction-heading h2{font-size:clamp(32px,8.8vw,40px);line-height:1.1;margin-bottom:12px}
 .product-benefits .construction-heading>p{font-size:18px;line-height:1.5}
 .product-benefits .construction-grid{grid-template-columns:1fr;gap:16px}
 .benefit-parts-label{margin-bottom:10px}
 .construction-part summary{padding-block:12px}
 .benefit-cards{grid-template-columns:1fr;gap:12px}
 .benefit-card{padding:16px 18px}
 .benefit-card-heading{margin-bottom:8px}
 .benefit-card h3{font-size:27px;margin-bottom:8px}
 .benefit-card>p{font-size:18px;line-height:1.5}
 .heat-fact>p{font-size:16px}
 .benefit-safety{margin:18px 0;padding:12px 14px}
 .benefit-source-grid{grid-template-columns:1fr;gap:24px}
 .benefit-next .button{width:100%;min-height:52px;white-space:normal}
}
@media(prefers-reduced-motion:reduce){.product-benefits .construction-focus,.part-marker,.disclosure-icon,.benefit-sources summary>span{transition:none}}