.commercial-portfolio-page{--background:#09090b;--foreground:#f3f3f1;--muted:#929292;--line:#ffffff20;background:#09090b;color:#f3f3f1}
.commercial-portfolio-page .detail-nav{min-height:88px}.commercial-portfolio-page .detail-nav nav{gap:24px}.commercial-intro{padding-top:24px;padding-bottom:36px}.commercial-intro .detail-back{margin-bottom:22px}.commercial-intro h1{font-size:clamp(30px,3.4vw,52px)}.commercial-intro>p{margin-top:14px;font-size:14px;letter-spacing:.04em}
.commercial-index{display:flex;flex-wrap:wrap;gap:12px 26px;margin-top:25px;font-size:12px;color:#929292}.commercial-index a:hover,.commercial-index a:focus-visible{color:#fff}.commercial-index a:last-child{margin-left:auto}
.commercial-category,.commercial-x9{scroll-margin-top:28px}.commercial-category+.commercial-category{margin-top:76px}.commercial-category-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-bottom:26px}.commercial-category-head h2{font-size:clamp(24px,2.3vw,34px);font-weight:500;letter-spacing:-.025em;margin:0}.commercial-category-head>p{font-size:12px;color:#929292;margin:0}
.commercial-project+.commercial-project{margin-top:52px}.commercial-project-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:20px}.commercial-project-head>div{display:flex;align-items:baseline;gap:15px}.commercial-project-head h3{font-size:18px;line-height:1.45;font-weight:500;margin:0}.commercial-project-head span{font-size:11px;color:#929292;white-space:nowrap}.commercial-project-head>p{font-size:12px;line-height:1.6;color:#929292;margin:0}
.commercial-project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:22px}.commercial-project-grid .commercial-lead{grid-column:1/-1}.commercial-project-grid .commercial-lead.is-portrait{width:min(100%,660px);justify-self:center}.commercial-project-grid>.detail-media:only-child{grid-column:1/-1}
.commercial-fan-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:24px;align-items:start}.commercial-fan-support{display:grid;gap:22px}.commercial-fan-primary{min-width:0}.commercial-fan-primary .detail-media{position:sticky;top:24px}.commercial-fan-layout .detail-media img{width:100%;height:auto}
.commercial-appliance-layout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;align-items:start}.commercial-appliance-layout>div{display:grid;gap:28px;min-width:0}.commercial-appliance-layout>div:nth-child(2){padding-top:58px}
.commercial-more{margin-top:22px}.commercial-more>summary{display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer;list-style:none;font-size:12px;color:#a1a1a1;padding:12px 0;width:fit-content;min-width:190px}.commercial-more>summary::-webkit-details-marker{display:none}.commercial-more-symbol:after{content:'＋'}.commercial-more[open] .commercial-more-symbol:after{content:'−'}.commercial-more .commercial-project-grid{margin-top:16px}.commercial-more>summary:hover{color:#fff}
.commercial-project--unclassified .commercial-project-head{display:none}.commercial-project--unclassified .commercial-project-grid>.detail-media{grid-column:auto}.commercial-project--unclassified .commercial-more{margin-top:12px}
.commercial-x9{margin-top:100px}.commercial-eyebrow{display:block;font-size:10px;letter-spacing:.14em;color:#929292;margin-bottom:12px}.commercial-x9-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr);gap:42px;align-items:start}.commercial-x9-layout h3{font-size:14px;font-weight:500;line-height:1.5;margin:0 0 13px}.commercial-x9-layout h3>span{color:#747474;font-size:10px;margin-right:9px}.commercial-x9-layout h3>small{font-size:10px;font-weight:400;color:#929292;margin-left:10px}.commercial-x9-process{display:grid;gap:28px}.commercial-x9-final .detail-media{width:100%;max-width:620px;margin-inline:auto}
.commercial-compare{position:relative;overflow:hidden;isolation:isolate;background:#111;line-height:0}.commercial-compare>img{width:100%;height:auto;display:block}.commercial-compare-before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--compare-position)) 0 0)}.commercial-compare-before img{display:block;width:100%;height:100%;object-fit:contain}.commercial-compare-label{position:absolute;bottom:14px;padding:6px 9px;color:#fff;font-size:10px;line-height:1.4;background:#0009;pointer-events:none}.commercial-compare-label.is-before{left:14px}.commercial-compare-label.is-after{right:14px}.commercial-compare-handle{position:absolute;top:0;bottom:0;left:var(--compare-position);width:2px;background:#fff;transform:translateX(-50%);pointer-events:none}.commercial-compare-handle:after{content:'↔';display:grid;place-items:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;background:#fff;color:#111;font-size:17px;line-height:1}.commercial-compare input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}.commercial-compare:focus-within{outline:2px solid #fff;outline-offset:4px}.commercial-compare-originals{display:flex;justify-content:flex-end;gap:22px;margin-top:12px}.commercial-compare-originals button{background:none;border:0;padding:4px 0;font-size:11px;color:#929292;cursor:zoom-in}.commercial-compare-originals button:hover{color:#fff}.commercial-compare-originals button:focus-visible{outline:1px solid #fff;outline-offset:4px}
.commercial-portfolio-page .detail-footer{margin-top:30px;padding-top:50px}
@media(max-width:900px){.commercial-project-head{display:block}.commercial-project-head>p{margin-top:8px}.commercial-x9-layout{gap:26px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}.commercial-category+.commercial-category{margin-top:62px}.commercial-x9{margin-top:72px}.commercial-index a:last-child{margin-left:0}.commercial-portfolio-page .detail-nav nav{gap:15px}.commercial-portfolio-page .detail-nav nav>a:last-child{display:none}}
@media(max-width:600px){.commercial-portfolio-page .detail-nav{min-height:72px}.commercial-portfolio-page .detail-nav nav{font-size:10px}.commercial-intro{padding-top:16px;padding-bottom:30px}.commercial-intro h1{font-size:29px}.commercial-intro>p{font-size:12px}.commercial-index{gap:11px 19px;margin-top:22px;font-size:11px}.commercial-category-head{margin-bottom:20px}.commercial-category-head h2{font-size:24px}.commercial-category+.commercial-category{margin-top:52px}.commercial-project+.commercial-project{margin-top:38px}.commercial-project-head h3{font-size:17px}.commercial-project-head>div{gap:10px;flex-wrap:wrap}.commercial-project-head>p{font-size:11px}.commercial-project-grid{grid-template-columns:1fr;gap:16px}.commercial-project-grid .commercial-lead{grid-column:auto}.commercial-fan-layout{grid-template-columns:1fr;gap:16px}.commercial-fan-primary .detail-media{position:static}.commercial-fan-support{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.commercial-fan-support>.detail-media:last-child:nth-child(odd){grid-column:1/-1}.commercial-appliance-layout{gap:14px}.commercial-appliance-layout>div{gap:14px}.commercial-appliance-layout>div:nth-child(2){padding-top:30px}.commercial-x9{margin-top:60px}.commercial-x9 .commercial-category-head h2{font-size:23px;line-height:1.45}.commercial-x9-layout{grid-template-columns:1fr;gap:28px}.commercial-x9-final .detail-media{max-width:360px}.commercial-x9-process{gap:24px}.commercial-compare-label{bottom:8px}.commercial-compare-label.is-before{left:8px}.commercial-compare-label.is-after{right:8px}}
.commercial-x9-layout{display:block}.commercial-x9-final{margin-bottom:30px}.commercial-x9-final .detail-media{max-width:1180px}.commercial-x9-process{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;align-items:start}.commercial-x9-process>article{min-width:0}.commercial-x9-process .detail-media img{width:auto;max-width:100%;max-height:440px;margin-inline:auto}.commercial-x9-process .commercial-compare{width:min(100%,235px);margin-inline:auto}.commercial-x9-process .commercial-compare-originals{justify-content:center;gap:15px}
@media(max-width:900px){.commercial-x9-process{gap:20px}.commercial-x9-layout h3>small{display:block;margin:3px 0 0 25px}}
@media(max-width:600px){.commercial-x9-process{grid-template-columns:1fr;gap:26px}.commercial-x9-final .detail-media{max-width:100%}.commercial-x9-process .detail-media img{max-height:440px}.commercial-x9-process .commercial-compare{width:min(100%,235px)}.commercial-x9-layout h3>small{display:inline;margin:0 0 0 10px}}
@media(prefers-reduced-motion:no-preference){.commercial-portfolio-page{scroll-behavior:smooth}}
