/* Systems: brochure photography, considered scale and capability-led copy. */
@media(min-width:801px){.systems-draft .global-header { position:relative; background:#0b0b0b; }}
.systems-draft .systems-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.systems-draft .systems-hero { position:relative; isolation:isolate; min-height:clamp(560px,49vw,750px); background:#0b0b0b; color:#f5f5f7; display:flex; align-items:flex-start; }
.systems-draft .systems-hero-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 60%; z-index:-2; }
.systems-draft .systems-hero::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,0,0,.45),transparent 75%),linear-gradient(180deg,rgba(0,0,0,.16),transparent 70%); z-index:-1; pointer-events:none; }
.systems-draft .systems-video-toggle { position:absolute; right:var(--gutter); bottom:20px; z-index:1; min-height:44px; color:#fff; font-size:12px; text-shadow:0 1px 5px #000; text-decoration:underline; text-underline-offset:4px; }
.systems-draft .systems-video-toggle[hidden] { display:none; }
.systems-draft .systems-video-toggle:focus-visible { outline:2px solid #fff; outline-offset:4px; }
.systems-draft .systems-hero-copy { padding-block:56px 210px; }
.systems-draft .systems-hero .eyebrow { color:#d1d1d6; font-size:14px; }
.systems-draft .systems-hero h1 { font-size:clamp(40px,4.7vw,68px); line-height:1.08; margin-top:18px; max-width:760px; letter-spacing:-.045em; }
.systems-draft main .systems-lead { color:#e1e1e5; font-size:18px; line-height:1.65; max-width:420px; margin-top:24px; }
.systems-draft main .systems-hero .text-link { color:#f5f5f7; font-size:15px; margin-top:24px; }
.systems-draft .systems-explorer { --system-muted:#666461; background:var(--surface-stone); scroll-margin-top:0; }
.systems-draft .systems-tabs { display:flex; justify-content:center; gap:clamp(26px,4.3vw,62px); overflow-x:auto; padding-block:25px 18px; scrollbar-width:thin; }
.systems-draft .systems-tabs[hidden], .systems-draft .system-panel[hidden] { display:none; }
.systems-draft .systems-tabs [data-system-tab] { position:relative; display:flex; align-items:center; justify-content:center; min-height:46px; flex-shrink:0; color:var(--system-muted,#6e6e73); font-size:15px; text-decoration:none; }
.systems-draft .systems-tabs [aria-selected="true"] { color:#1d1d1f; }
.systems-draft .systems-tabs [aria-selected="true"]::after { content:''; position:absolute; bottom:0; left:0; right:0; height:1px; background:currentColor; }
.systems-draft .systems-tabs [data-system-tab]:focus-visible { outline:2px solid #52656f; outline-offset:-2px; }
.systems-draft .system-panel { scroll-margin-top:84px; }
.systems-draft .system-panel:focus-visible { outline:2px solid #52656f; outline-offset:-3px; }
.systems-draft .system-panel-inner { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:10%; align-items:center; min-height:530px; padding-block:45px 65px; }
.systems-draft .system-panel-copy { max-width:440px; }
.systems-draft .system-panel-copy .eyebrow { font-size:13px; }
.systems-draft .system-panel-copy h2 { margin-top:18px; font-size:clamp(34px,3.8vw,52px); line-height:1.12; letter-spacing:-.035em; }
.systems-draft .system-panel-copy > p:not(.eyebrow) { margin-top:25px; font-size:18px; line-height:1.65; color:var(--system-muted,#6e6e73); }
.systems-draft .system-panel-copy .text-link { margin-top:19px; font-size:15px; }
.systems-draft .system-product-link { display:block; min-width:0; }
.systems-draft .system-product-link .text-link { font-size:14px; }
.systems-draft .system-product-link:hover .text-link { text-decoration:underline; text-underline-offset:5px; }
.systems-draft .system-panel figure { min-width:0; text-align:center; }
.systems-draft .system-panel img { width:100%; height:360px; object-fit:contain; }
.systems-draft .system-panel figcaption { font-size:12px; line-height:1.5; color:var(--system-muted,#6e6e73); margin-top:18px; }
.systems-draft .system-panel--access img { height:375px; }
.systems-draft .system-panel--sensors img { max-width:255px; margin-inline:auto; }
.systems-draft .system-panel--scenes img { max-width:520px; margin-inline:auto; }
/* Preserve the genuine W45CZ image; its white canvas blends into this light stage. */
.systems-draft .system-panel--curtains img { object-fit:cover; object-position:center; mix-blend-mode:multiply; }
.systems-draft .systems-together { padding-block:94px 80px; }
.systems-draft .systems-evening-heading { text-align:center; }
.systems-draft .systems-together h2 { font-size:clamp(36px,3.8vw,52px); line-height:1.1; margin-top:20px; }
.systems-draft .systems-scene-actions { list-style:none; padding:0; margin:53px 0 0; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:28px; }
.systems-draft .systems-scene-actions li { border-top:1px solid #d7dddf; padding-top:18px; font-size:17px; line-height:1.5; letter-spacing:-.02em; }
.systems-draft .systems-scene-actions span { display:block; font-size:11px; color:var(--system-muted,#6e6e73); margin-bottom:20px; }
.systems-draft main .systems-scene-note { color:var(--system-muted,#6e6e73); font-size:13px; line-height:1.7; max-width:650px; margin:36px auto 0; text-align:center; }
.systems-draft .systems-fit { display:grid; grid-template-columns:1.2fr 1fr; gap:10%; align-items:center; padding-block:65px 90px; border-top:1px solid #e0e4e5; }
.systems-draft .systems-fit h2 { font-size:36px; margin-top:18px; }
.systems-draft .systems-fit p:not(.eyebrow) { margin-top:22px; color:var(--system-muted,#6e6e73); font-size:16px; line-height:1.65; max-width:500px; }
.systems-draft .systems-next { display:flex; flex-direction:column; align-items:start; gap:12px; }
.systems-draft .climate-chooser { padding-block:0 56px; }
.systems-draft .climate-chooser-heading { border-top:1px solid #d7d7dc; padding-top:30px; max-width:720px; }
.systems-draft .climate-chooser h3 { font-size:24px; line-height:1.25; letter-spacing:-.025em; }
.systems-draft .climate-chooser-heading p { color:var(--system-muted,#6e6e73); font-size:15px; line-height:1.6; margin-top:12px; }
.systems-draft .climate-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px; list-style:none; padding:0; margin:29px 0 0; }
.systems-draft .climate-choices li { min-width:0; }
.systems-draft .climate-choices h4 { font-size:17px; line-height:1.45; letter-spacing:-.015em; }
.systems-draft .climate-choices p { color:var(--system-muted,#6e6e73); font-size:14px; line-height:1.65; margin-top:11px; }
.systems-draft .climate-choices .text-link { font-size:14px; margin-top:14px; min-height:44px; }
.systems-draft .systems-requirements { padding-bottom:36px; }
.systems-draft .systems-requirements details { border-top:1px solid #e0e4e5; }
.systems-draft .systems-requirements summary { display:flex; justify-content:space-between; gap:20px; cursor:pointer; list-style:none; padding-block:25px; font-size:21px; line-height:1.35; letter-spacing:-.025em; }
.systems-draft .systems-requirements summary::-webkit-details-marker { display:none; }
.systems-draft .systems-requirements summary > span { flex:0 0 auto; font-size:25px; font-weight:300; transition:transform .15s; }
.systems-draft .systems-requirements details[open] summary > span { transform:rotate(45deg); }
.systems-draft .systems-requirements summary:focus-visible { outline:2px solid #52656f; outline-offset:3px; }
.systems-draft .systems-requirements-body { padding-block:0 17px; }
.systems-draft .systems-requirements-intro { color:var(--system-muted,#6e6e73); font-size:15px; line-height:1.65; max-width:660px; }
.systems-draft .systems-requirements dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px; margin-block:28px 18px; }
.systems-draft .systems-requirements dt { font-size:16px; font-weight:500; line-height:1.4; }
.systems-draft .systems-requirements dd { color:var(--system-muted,#6e6e73); font-size:14px; line-height:1.65; margin:11px 0 0; }
.systems-draft .systems-requirements-links { display:flex; flex-wrap:wrap; gap:6px 28px; }
.systems-draft .systems-requirements-links .text-link { font-size:14px; min-height:44px; }
@media(max-width:1000px) {
 .systems-draft .systems-hero-copy { padding-top:45px; }
 .systems-draft .system-panel-inner { gap:5%; }
 .systems-draft .systems-tabs { gap:30px; }
 .systems-draft .systems-scene-actions { gap:20px; }
 .systems-draft .systems-scene-actions li { font-size:15px; }
}
@media(max-width:760px) {
 .systems-draft .systems-hero { min-height:0; flex-direction:column; }
 .systems-draft .systems-hero::after { display:none; }
 .systems-draft .systems-hero-copy { order:-1; padding-block:36px 30px; }
 .systems-draft .systems-hero h1 { font-size:clamp(37px,6.7vw,49px); margin-top:16px; }
 .systems-draft main .systems-lead { font-size:16px; max-width:510px; margin-top:21px; }
 .systems-draft main .systems-hero .text-link { font-size:14px; margin-top:17px; }
 .systems-draft .systems-hero-image { position:static; height:auto; aspect-ratio:48/25; width:100%; object-fit:cover; z-index:auto; }
 .systems-draft .systems-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2px 18px; overflow:visible; padding-block:17px 7px; }
 .systems-draft .systems-tabs [data-system-tab] { min-width:0; min-height:46px; font-size:14px; line-height:1.3; text-align:center; }
 .systems-draft .system-panel-inner { display:flex; flex-direction:column; gap:30px; padding-block:24px 48px; min-height:0; }
 .systems-draft .system-product-link { order:-1; width:100%; }
 .systems-draft .system-panel figure { order:-1; width:100%; }
 .systems-draft .system-panel img { height:250px; max-width:350px; margin-inline:auto; }
 .systems-draft .system-panel--access img { height:290px; }
 .systems-draft .system-panel--sensors img { max-width:205px; }
 .systems-draft .system-panel--scenes img { max-width:440px; }
 .systems-draft .system-panel--curtains img { max-width:480px; }
 .systems-draft .system-panel figcaption { font-size:11px; margin-top:12px; }
 .systems-draft .system-panel-copy { max-width:100%; width:100%; }
 .systems-draft .system-panel-copy h2 { font-size:34px; margin-top:12px; }
 .systems-draft .system-panel-copy > p:not(.eyebrow) { font-size:16px; margin-top:20px; }
 .systems-draft .system-panel-copy .text-link { margin-top:15px; }
 .systems-draft .systems-together { padding-block:59px; }
 .systems-draft .systems-together h2 { font-size:36px; }
 .systems-draft .systems-scene-actions { display:block; margin-top:30px; }
 .systems-draft .systems-scene-actions li { display:flex; gap:20px; padding-block:16px; font-size:16px; }
 .systems-draft .systems-scene-actions span { margin:3px 0 0; }
 .systems-draft main .systems-scene-note { text-align:left; margin-top:22px; }
 .systems-draft .systems-fit { display:block; padding-block:48px 59px; }
 .systems-draft .systems-fit h2 { font-size:32px; }
 .systems-draft .systems-next { margin-top:25px; }
 .systems-draft .climate-chooser { padding-bottom:30px; }
 .systems-draft .climate-chooser-heading { padding-top:25px; }
 .systems-draft .climate-chooser h3 { font-size:22px; }
 .systems-draft .climate-choices { display:block; margin-top:12px; }
 .systems-draft .climate-choices li { padding-block:19px 12px; }
 .systems-draft .climate-choices li + li { border-top:1px solid #dddde1; }
 .systems-draft .climate-choices p { margin-top:8px; }
 .systems-draft .climate-choices .text-link { margin-top:5px; }
 .systems-draft .systems-requirements { padding-bottom:22px; }
 .systems-draft .systems-requirements summary { font-size:20px; padding-block:21px; }
 .systems-draft .systems-requirements dl { display:block; margin-top:23px; }
 .systems-draft .systems-requirements dl > div + div { margin-top:23px; }
 .systems-draft .systems-requirements dd { margin-top:8px; }
 .systems-draft .systems-requirements-links { flex-direction:column; align-items:start; }
}
@media(max-width:360px) {
 .systems-draft .systems-hero h1 { font-size:33px; }
 .systems-draft .system-panel-copy h2 { font-size:31px; }
}

/* One coordinated scene, shown together rather than as a numbered sequence. */
.systems-draft .systems-together { background:#fff; padding-block:80px; }
.systems-together-grid { display:grid; grid-template-columns:1fr 1.15fr; gap:7%; align-items:center; }
.systems-draft .systems-evening-heading { text-align:left; }
.systems-draft .systems-together h2 { font-size:clamp(34px,3.7vw,48px); }
.systems-scene-intro { font-size:18px; line-height:1.65; color:var(--system-muted,#6e6e73); margin-top:25px; }
.systems-draft main .systems-scene-note { text-align:left; font-size:14px; margin-top:24px; line-height:1.65; }
.systems-scene-composition { border-radius:28px; padding:34px; margin:0; background:#19191c; color:#f5f5f7; }
.systems-scene-composition figcaption { color:#a1a1a6; font-size:12px; }
.systems-scene-name { display:flex; align-items:center; gap:18px; margin:28px 0 38px; font-size:36px; letter-spacing:-.035em; }
.systems-scene-composition svg { width:32px; height:32px; fill:none; stroke:currentColor; stroke-width:1.3; stroke-linecap:round; stroke-linejoin:round; }
.systems-scene-name svg { width:42px; height:42px; color:#e5dfd5; }
.systems-scene-composition dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin:0; }
.systems-scene-composition dl>div { padding-top:20px; border-top:1px solid #424246; }
.systems-scene-composition dt { margin-top:18px; font-size:14px; }
.systems-scene-composition dd { margin:7px 0 0; font-size:13px; line-height:1.5; color:#b1b1b7; }
@media(max-width:900px) { .systems-together-grid { grid-template-columns:1fr; gap:32px; } .systems-draft .systems-together { padding-block:50px; } }
@media(max-width:500px) { .systems-scene-composition { border-radius:22px; padding:24px; } .systems-scene-composition dl { gap:14px; } .systems-scene-composition dt { font-size:13px; } .systems-scene-composition dd { font-size:12px; } .systems-scene-name { font-size:32px; margin-block:24px 30px; } }

/* Equipment detail stays one tap away; the capability story remains the first read. */
.systems-draft .climate-equipment-details > summary { display:flex; align-items:center; justify-content:space-between; gap:20px; max-width:none; cursor:pointer; list-style:none; padding-block:24px; }
.systems-draft .climate-equipment-details > summary::-webkit-details-marker { display:none; }
.systems-draft .climate-equipment-details > summary > span { flex-shrink:0; font-size:28px; line-height:1; }
.systems-draft .climate-equipment-details[open] > summary > span { transform:rotate(45deg); }
.systems-draft .climate-equipment-details > summary:focus-visible { outline:2px solid currentColor; outline-offset:3px; }
.systems-draft .climate-chooser-intro { font-size:16px; line-height:1.6; color:var(--system-muted); max-width:720px; }
@media(max-width:760px) {
 .systems-draft .systems-hero-copy { padding-block:26px 24px; }
 .systems-draft main .systems-lead { font-size:18px; line-height:1.5; margin-top:18px; }
 .systems-draft main .systems-hero .text-link { font-size:17px; min-height:48px; margin-top:12px; }
 .systems-draft .systems-hero-image { aspect-ratio:4/3; object-position:56% center; }
 .systems-draft .systems-video-toggle { font-size:15px; min-height:48px; }
 .systems-draft .systems-tabs { gap:8px; padding-block:20px 10px; }
 .systems-draft .systems-tabs [data-system-tab] { border:1px solid #c9c6c1; border-radius:12px; padding:9px 5px; min-height:52px; font-size:16px; color:#41403e; }
 .systems-draft .systems-tabs [aria-selected="true"] { background:#1d1d1f; border-color:#1d1d1f; color:#fff; }
 .systems-draft .systems-tabs [aria-selected="true"]::after { display:none; }
 .systems-draft .system-panel-inner { gap:24px; padding-block:26px 40px; }
 .systems-draft .system-panel img { height:280px; }
 .systems-draft .system-panel--access img { height:310px; }
 .systems-draft .system-panel-copy > p:not(.eyebrow), .systems-scene-intro { font-size:18px; line-height:1.55; margin-top:18px; }
 .systems-draft .system-product-link .text-link, .systems-draft .system-panel-copy .text-link { font-size:17px; min-height:48px; }
 .systems-draft .climate-chooser { padding-bottom:24px; }
 .systems-draft .climate-chooser-intro, .systems-draft .climate-choices p,
 .systems-draft .systems-requirements-intro, .systems-draft .systems-requirements dd,
 .systems-draft main .systems-scene-note { font-size:17px; line-height:1.55; }
 .systems-draft .climate-choices h4, .systems-draft .systems-requirements dt { font-size:20px; line-height:1.35; }
 .systems-draft .climate-choices .text-link, .systems-draft .systems-requirements-links .text-link { font-size:17px; min-height:48px; }
 .systems-draft .systems-together { padding-block:44px; }
 .systems-scene-composition { padding:24px; }
 .systems-scene-name { margin-block:0 24px; }
 .systems-scene-composition dl { grid-template-columns:1fr; gap:16px; }
 .systems-scene-composition dl > div { display:grid; grid-template-columns:32px minmax(0,1fr); gap:4px 16px; padding-top:16px; }
 .systems-scene-composition dl svg { grid-row:1/3; }
 .systems-scene-composition dt { font-size:18px; margin:0; }
 .systems-scene-composition dd { grid-column:2; font-size:17px; margin:0; }
}