.feature-layout{display:block;width:min(100%,650px);margin-inline:auto}.feature-art{position:relative;width:100%;height:clamp(350px,calc(100svh - 340px),500px);overflow:hidden}.solar-system{width:min(calc(100% - 80px),max(250px,calc(100svh - 440px)),360px);top:45%}.orbit-planet{width:46px}.orbit-label{font-size:.53rem}.feature-dialog{position:absolute;inset:0!important;top:0;left:0;transform:none!important;width:100%;height:100%;max-height:none;border-radius:inherit;margin:0;border:1px solid var(--line);box-shadow:none;z-index:4;background:#fff}.feature-dialog-body{padding:70px 32px 28px;height:100%;max-height:none;overflow:auto;scroll-padding-top:70px}.feature-dialog-close{top:14px;left:22px;right:auto;width:auto;height:34px;padding:0 12px;font:800 .73rem var(--sans);border-radius:999px;background:#fff0eb;color:var(--orange-dark)}.feature-dialog .feature-panel h3{font-size:1.5rem;margin-bottom:14px;padding:0}.feature-dialog .feature-points{gap:18px;margin-top:22px}.feature-dialog .feature-points li{padding-top:15px}.feature-dialog .feature-panel>p{font-size:.87rem}.feature-dialog .feature-points{font-size:.82rem}.feature-dialog-open .feature-art-head,.feature-dialog-open .feature-art-bottom{visibility:hidden}@media(max-width:560px){.feature-layout{width:100%}.feature-art{height:410px}.solar-system{width:280px;top:45%}.orbit-planet{width:39px}.orbit-label{font-size:.47rem}.feature-dialog-body{padding:66px 23px 24px}.feature-dialog .feature-panel h3{font-size:1.35rem}.feature-dialog .feature-panel>p{font-size:.83rem}.feature-dialog .feature-points{font-size:.8rem}}

/* Colour and icon treatment stays inside the existing orbit animation. */
.feature-art{height:clamp(420px,calc(100svh - 320px),520px)}
.solar-system{width:min(calc(100% - 78px),max(340px,calc(100svh - 410px)),450px);top:46%;container-type:inline-size}
.solar-system .ring-1{inset:31.8%}.solar-system .ring-2{inset:18.4%}.solar-system .ring-3{inset:5%}
.solar-system .solar-logo{inset:39.3%;padding:8px}
.orbit-planet{width:clamp(52px,12.8cqw,58px)}
.orbit-label{--planet:#0d9488;--planet-deep:#0f766e;--planet-tint:#e6fffa;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:4px 3px;border:2px solid #ffffffc9;background:var(--planet-tint);color:var(--planet-deep);box-shadow:0 5px 16px #5b1e2026,inset 0 0 0 1px #fff9;font-size:.55rem;line-height:1.08;transition:background .2s,color .2s,box-shadow .2s,scale .2s,border-color .2s}
.orbit-label[data-feature="1"]{--planet:#8b5cf6;--planet-deep:#6d28d9;--planet-tint:#f0eaff}
.orbit-label[data-feature="2"]{--planet:#d97706;--planet-deep:#92400e;--planet-tint:#fff3cc}
.orbit-label[data-feature="3"]{--planet:#2563eb;--planet-deep:#1d4ed8;--planet-tint:#e8f1ff}
.orbit-label[data-feature="4"]{--planet:#4f46e5;--planet-deep:#4338ca;--planet-tint:#edebff}
.orbit-label[data-feature="5"]{--planet:#db2777;--planet-deep:#be185d;--planet-tint:#ffe9f2}
.orbit-label[data-feature="6"]{--planet:#16a34a;--planet-deep:#15803d;--planet-tint:#e8fbe9}
.orbit-label[data-feature="7"]{--planet:#0891b2;--planet-deep:#0e7490;--planet-tint:#e1f8ff}
.orbit-label[data-feature="8"]{--planet:#c026d3;--planet-deep:#a21caf;--planet-tint:#fbe9ff}
.orbit-icon{width:23px;height:23px;flex-shrink:0;transition:transform .2s;filter:drop-shadow(0 1px 0 #fff5)}
.orbit-name{display:block;max-width:100%;font-weight:800}
.orbit-label[aria-pressed=true]{background:var(--planet-tint);color:var(--planet-deep);border:2px solid var(--planet);box-shadow:0 0 0 4px #ffffff45,0 7px 20px #6b20254a}
.orbit-label:hover,.orbit-label:focus-visible{background:var(--planet);color:#fff;border-color:#fff;scale:1.12;box-shadow:0 0 0 5px #ffffff32,0 10px 25px #64232a55;z-index:5}
.orbit-label:hover .orbit-icon,.orbit-label:focus-visible .orbit-icon{transform:rotate(-7deg) scale(1.08);filter:none}
@media(max-width:560px){.feature-art{height:410px}.solar-system{width:min(calc(100% - 64px),300px);top:46%}.solar-system .orbit-ring{inset:15%;--duration:54s!important}.solar-system .solar-logo{inset:36%;padding:8px}.orbit-planet{width:50px}.orbit-icon{width:20px;height:20px}.orbit-label{font-size:.49rem;gap:2px;padding:5px 3px}.orbit-label:hover,.orbit-label:focus-visible{scale:1.08}}
@media(prefers-reduced-motion:reduce){.orbit-label,.orbit-icon{transition:none}}

/* Fixed angular spacing keeps larger neighbouring solutions apart. */
.solar-system .orbit-ring{--duration:54s!important}.orbit-name{font-size:.51rem;letter-spacing:-.02em}

/* Readable orbit labels and genuinely independent orbital speeds. */
.feature-layout{width:min(100%,920px)}
.feature-art{height:clamp(600px,calc(100svh - 140px),740px)}
.solar-system{width:min(calc(100% - 100px),clamp(470px,calc(100svh - 320px),620px));top:50%}
.solar-system .ring-1{inset:34%;--duration:90s!important}
.solar-system .ring-2{inset:18.7%;--duration:65s!important}
.solar-system .ring-3{inset:3%;--duration:45s!important}
.solar-system .solar-logo{inset:42%;padding:10px}
.orbit-planet{width:clamp(70px,14.5cqw,90px)}
.orbit-label{font-family:Arial,Helvetica,sans-serif;font-weight:500;gap:4px;padding:5px 4px}
.orbit-name{font-family:Arial,Helvetica,sans-serif;font-size:clamp(12px,2.15cqw,14px);font-weight:500;letter-spacing:0;line-height:1.15}
.orbit-icon{width:clamp(26px,5.1cqw,32px);height:clamp(26px,5.1cqw,32px)}
.orbit-label:hover,.orbit-label:focus-visible{scale:1.06}
.feature-art-head{padding:22px 26px;font-size:.7rem}
.orbit-toggle{font-size:.7rem;padding:6px 13px}
@media(max-width:560px){
 .feature-art{height:450px}
 .solar-system{width:min(calc(100% - 40px),330px);top:52%}
 .solar-system .ring-1{inset:34%;--duration:90s!important}
 .solar-system .ring-2{inset:18.7%;--duration:65s!important}
 .solar-system .ring-3{inset:3%;--duration:45s!important}
 .solar-system .solar-logo{inset:42%;padding:5px}
 .orbit-planet{width:clamp(38px,14.5cqw,48px)}
 .orbit-label{padding:1px;gap:1px}
 .orbit-name{font-size:10.5px;line-height:1.05;font-weight:500}
 .orbit-icon{width:16px;height:16px}
 .feature-art-head{padding:18px;font-size:.6rem}
 .orbit-label:hover,.orbit-label:focus-visible{scale:1.04}
}

/* Keep the heading and ecosystem together within the available screen. */
.features-section{padding-block:20px}
.features-section .center-intro{margin-bottom:18px}
.features-section .center-intro h2{font-size:clamp(1.7rem,2.6vw,2.25rem);line-height:1.15;margin:6px 0 10px}
.features-section .center-intro>p:not(.eyebrow){font-size:.78rem;line-height:1.6}
.feature-layout{width:min(100%,820px)}
.feature-art{height:clamp(340px,calc(100svh - 290px),580px)}
.solar-system{width:min(calc(100% - 64px),clamp(300px,calc(100svh - 390px),480px));top:54%}
.orbit-planet{width:clamp(43px,14.5cqw,70px)}
.orbit-label{gap:2px;padding:3px 2px}
.orbit-name{font-size:clamp(10.5px,2.35cqw,12px);line-height:1.1}
.orbit-icon{width:clamp(19px,5.1cqw,25px);height:clamp(19px,5.1cqw,25px)}
.feature-art-head{padding:18px 22px}
@media(max-width:560px){
 .features-section{padding-block:18px}
 .feature-art{height:clamp(350px,calc(100svh - 300px),430px)}
 .solar-system{width:min(calc(100% - 40px),330px);top:54%}
 .orbit-planet{width:clamp(38px,14.5cqw,48px)}
 .orbit-label{padding:1px;gap:1px}
 .orbit-name{font-size:10px;line-height:1.05}
 .orbit-icon{width:16px;height:16px}
 .feature-art-head{padding:16px;font-size:.6rem}
}