/* Section 04 only. Brochure palette, existing fonts, no runtime dependencies. */
#system.system-showcase{background:#071c36;padding-block:clamp(4.75rem,7.5vw,7.5rem)}
#system .system-heading{margin-bottom:3.25rem}
#system .system-heading h2{font-size:clamp(2rem,4.5vw,4.25rem);line-height:1.16;letter-spacing:-.04em;text-wrap:initial}
#system .system-heading>p{max-width:43rem;margin-top:1.5rem;color:#bdc9d8;font-size:1.0625rem;line-height:1.75}
#system .system-explorer{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);column-gap:clamp(2rem,5vw,5rem);align-items:start}
#system .system-product{grid-column:1;grid-row:1;margin:0;background:linear-gradient(155deg,#153b5a,#031831 80%);border:1px solid #34465a;border-bottom:0;padding:1.75rem 2rem 1.25rem;min-width:0}
#system .system-product-label{display:flex;justify-content:space-between;gap:1rem;align-items:center}
#system .system-product-label>span:first-child{font-family:var(--head);font-size:1.375rem;font-weight:700;letter-spacing:-.04em}
#system .system-product-label>span:last-child{font-size:.6875rem;letter-spacing:.12em;color:#bdc9d8}
#system .system-product-image{padding-block:2.75rem 1.5rem;position:relative}
#system .system-product img{width:100%;max-width:649px;height:auto;margin:auto;filter:drop-shadow(0 14px 11px #0007)}
#system .system-product figcaption{font-size:.75rem;line-height:1.6;color:#bdc9d8;text-align:center;padding-bottom:1rem}
#system .system-features{grid-column:2;grid-row:1/3;min-width:0;padding-top:.4rem}
#system .system-explore-label{font-size:.75rem;letter-spacing:.13em;color:#bdc9d8;display:flex;justify-content:space-between;margin-bottom:1.4rem}
#system .system-feature{border-top:1px solid #8396aa;padding:0 .125rem}
#system .system-feature h3{margin:0;font-family:var(--font)}
#system .system-feature button{width:100%;display:grid;grid-template-columns:1.5rem minmax(0,1fr) 1rem;gap:.7rem;align-items:baseline;text-align:left;padding:1.4rem 0;border:0;color:var(--paper);background:none;font-family:var(--font);font-size:clamp(1rem,1.5vw,1.25rem);font-weight:600;line-height:1.5;letter-spacing:-.025em;min-height:4.5rem}
#system .system-feature-number{color:#bdc9d8;font-size:.75rem;font-weight:500;letter-spacing:0}
#system .system-feature-mark{font-weight:400;font-size:1.125rem;text-align:center}
#system .system-feature button:hover,#system .system-feature button[aria-expanded=true]{color:var(--accent)}
#system .system-feature[data-selected=true]{border-color:var(--accent)}
#system .system-feature[data-selected=true] .system-feature-number{color:var(--accent)}
#system .system-feature>p{padding:.375rem 1rem 1.75rem 2.2rem;font-size:1rem;line-height:1.8;color:#e4eaf2;max-width:35rem}
#system .system-brochure{margin-top:1.75rem;gap:2rem}
#system .system-diagrams{grid-column:1;grid-row:2;background:#031831;border:1px solid #34465a;border-top:0;padding:0 2rem 1.5rem;min-width:0;align-self:stretch}
#system .system-diagram{margin:0;border-top:1px solid #34465a;padding-top:1.5rem}
#system .system-diagram figcaption>span{display:block;color:#bdc9d8;letter-spacing:.08em;font-size:.6875rem;line-height:1.7;margin-bottom:.5rem}
#system .system-diagram figcaption>strong{display:block;font:700 clamp(1.125rem,1.65vw,1.5rem)/1.45 var(--head);letter-spacing:-.025em;color:var(--paper)}
#system .system-flow{display:grid;grid-template-columns:minmax(0,1fr) 1.25rem minmax(0,1fr) 1.25rem minmax(0,1fr);align-items:start;min-height:9.5rem;padding-top:1.75rem}
#system .system-node{text-align:center;color:#e4eaf2;min-width:0}
#system .system-node svg{width:2.5rem;height:2rem;stroke:currentColor;stroke-width:1.3;fill:none;margin:auto;display:block;overflow:visible}
#system .system-node>span{display:block;font-size:.8125rem;line-height:1.5;margin-top:.65rem;overflow-wrap:anywhere}
#system .system-node-accent{color:var(--accent)}
#system .system-connector{margin-top:1rem;height:1px;background:#2f9fe8;position:relative}
#system .system-connector:after{content:"";position:absolute;width:5px;height:5px;border-top:1px solid #2f9fe8;border-right:1px solid #2f9fe8;transform:rotate(45deg);right:0;top:-2px}
#system .system-connector-both:before{content:"";position:absolute;width:5px;height:5px;border-bottom:1px solid #2f9fe8;border-left:1px solid #2f9fe8;transform:rotate(45deg);left:0;top:-2px}
#system .system-management-flow{grid-template-columns:minmax(0,1fr) 2rem minmax(0,1fr)}
#system .system-distribution-flow{min-height:9.5rem;padding-top:1rem}
#system .system-mediums{display:flex;justify-content:center;align-items:center;gap:1rem;font-size:.875rem;line-height:1.4;color:#2f9fe8}
#system .system-mediums>small{color:#bdc9d8;font-size:.75rem}
#system .system-branches{display:flex;width:68%;margin:1rem auto 0;border-top:1px solid #2f9fe8;justify-content:space-between;position:relative}
#system .system-branches:before{content:"";position:absolute;left:50%;top:-.65rem;height:.65rem;border-left:1px solid #2f9fe8}
#system .system-branches i{height:.85rem;border-left:1px solid #2f9fe8}
#system .system-destinations{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.25rem;margin-top:.4rem}
#system .system-destinations .system-node svg{width:1.875rem;height:1.5rem}
#system .system-diagram-note{border-top:1px solid #34465a;padding-top:1rem;color:#bdc9d8;font-size:.75rem;line-height:1.65}
#system .system-image-failure{padding:1rem;font-size:1rem;line-height:1.65;color:#e4eaf2}
#system .system-announcement{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#system.is-enhanced .system-diagram:not([hidden]){animation:system-view-enter .28s ease-out both}
@keyframes system-view-enter{from{opacity:.45;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:761px){#system.is-enhanced .system-features{min-height:36rem}}
@media(max-width:1000px) and (min-width:761px){#system .system-explorer{column-gap:2rem;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}#system .system-product,#system .system-diagrams{padding-inline:1.25rem}#system .system-product-label{flex-wrap:wrap;gap:.3rem}}
@media(max-width:760px){
 #system .system-heading{margin-bottom:2rem}
 #system .system-heading h2{font-size:clamp(2rem,5.65vw,3rem);line-height:1.2;letter-spacing:-.035em}
 #system .system-heading h2 br{display:none}
 #system .system-heading h2 .accent{display:block;margin-top:.1em}
 #system .system-heading>p{font-size:1rem;margin-top:1.25rem}
 #system .system-explorer{display:flex;flex-direction:column;gap:0}
 #system .system-product{order:1;width:100%;padding:1.25rem 1.125rem .25rem;border-bottom:1px solid #34465a;margin-bottom:2rem}
 #system .system-product-label{flex-wrap:wrap;gap:.25rem 1rem}
 #system .system-product-label>span:first-child{font-size:1.25rem}
 #system .system-product-label>span:last-child{font-size:.75rem;letter-spacing:.06em}
 #system .system-product-image{padding-block:2rem 1rem}
 #system .system-product figcaption{font-size:.75rem;padding-bottom:.75rem}
 #system .system-features{display:contents}
 #system .system-explore-label{order:2;width:100%}
 #system .system-feature{order:3;width:100%}
 #system .system-feature button{font-size:1rem;gap:.5rem;grid-template-columns:1.25rem minmax(0,1fr) .875rem;padding-block:1.15rem;min-height:4rem}
 #system .system-feature>p{padding:.375rem .25rem 1.4rem 1.75rem;font-size:1rem;line-height:1.75}
 #system .system-brochure{order:5;align-self:flex-start;margin-top:1.5rem;margin-bottom:0}
 #system .system-diagrams{order:4;margin-top:1.25rem;width:100%;padding:1.25rem 1.125rem;border-top:1px solid #34465a}
 #system .system-diagram{border-top:0;padding-top:0}
 #system .system-diagram figcaption>strong{font-size:1.25rem}
 #system .system-flow{grid-template-columns:minmax(0,1fr) .6rem minmax(0,1fr) .6rem minmax(0,1fr);min-height:10rem}
 #system .system-management-flow{grid-template-columns:minmax(0,1fr) 1.25rem minmax(0,1fr)}
 #system .system-node>span{font-size:.75rem}
 #system .system-diagram figcaption>span{font-size:.6875rem}
 #system .system-distribution-flow{min-height:10rem;padding-top:1.5rem}
}
@media(prefers-reduced-motion:reduce){#system.is-enhanced .system-diagram:not([hidden]){animation:none}}
