.scc{--scc-gold:#e3c078;--scc-ease:cubic-bezier(.22,.75,.18,1);font-family:Helvetica,Arial,sans-serif;background:transparent;color:#f5f4f0;padding:64px 0 24px;overflow:hidden;isolation:isolate}.scc *{box-sizing:border-box}.scc-heading{font-size:clamp(30px,4.7vw,70px);font-weight:500;line-height:1.06;letter-spacing:-.035em;max-width:1180px;padding:0 32px;margin:0 auto 68px;text-align:center}.scc-stage{position:relative;max-width:1280px;height:700px;margin:auto;touch-action:pan-y}.scc-stage::before{content:'';position:absolute;inset:0 17% 15%;background:radial-gradient(ellipse,#ba94520b,transparent 66%);pointer-events:none}.scc-card{position:absolute;top:0;left:50%;width:450px;max-width:44vw;text-align:center;transform:translateX(-50%) scale(.58);transform-origin:50% 44%;opacity:0;pointer-events:none;transition:transform 1s var(--scc-ease),opacity .8s;z-index:0}.scc-card[data-slot="0"]{transform:translateX(-50%) scale(1);opacity:1;pointer-events:auto;z-index:3}.scc-card[data-slot="-1"]{transform:translateX(-147%) scale(.66);opacity:.68;pointer-events:auto;z-index:2}.scc-card[data-slot="1"]{transform:translateX(47%) scale(.66);opacity:.68;pointer-events:auto;z-index:2}.scc-orbit{position:relative;padding:3px;border-radius:50%;background:linear-gradient(150deg,#79a9bb80,#c3d7dc35 46%,#52606b20 82%);box-shadow:0 18px 42px #0002;transition:box-shadow .9s}.scc-card[data-slot="0"] .scc-orbit{background:linear-gradient(150deg,#fff2d7,#d6b062 28%,#f4deb0 50%,#715c3033 88%);box-shadow:0 30px 65px #0004,0 0 65px #d2ad6408}
.scc-card[data-slot="0"][data-accent="false"] .scc-orbit{background:linear-gradient(150deg,#79a9bb80,#c3d7dc35 46%,#52606b20 82%);box-shadow:0 18px 42px #0002}.scc-circle{position:relative;aspect-ratio:1;border-radius:50%;overflow:hidden;isolation:isolate;background:#2d3234;clip-path:circle(50%)}.scc-poster,.scc-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% var(--scc-position,50%);transform:scale(var(--scc-zoom,1));border-radius:50%;pointer-events:none}.scc-poster{transition:opacity .3s}.scc-video{opacity:0}.scc-card[data-playing="true"] .scc-video{opacity:1}.scc-card[data-playing="true"] .scc-poster{opacity:0}.scc-select{position:absolute;inset:0;border:0;border-radius:50%;background:transparent;color:white;cursor:pointer;display:grid;place-items:center}.scc-play{width:68px;height:68px;display:grid;place-items:center;border:1px solid #ffffff85;border-radius:50%;background:#15151522;backdrop-filter:blur(6px);transition:opacity .3s,transform .4s;font-size:23px;line-height:1;padding-left:3px}.scc-card[data-playing="true"] .scc-play,.scc-card:not([data-slot="0"]) .scc-play,.scc-card[data-has-video="false"] .scc-play{opacity:0}.scc-card[data-playing="true"] .scc-play{padding:0}.scc-sound{position:absolute;bottom:8%;left:50%;transform:translateX(-50%);width:36px;height:36px;border-radius:50%;border:1px solid #ffffff40;background:#171a1d66;backdrop-filter:blur(8px);color:#fff;display:grid;place-items:center;cursor:pointer}.scc-sound svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5}.scc-sound[data-active="true"] .scc-muted,.scc-sound[data-active="false"] .scc-audible{display:none}.scc-card:not([data-slot="0"]) .scc-sound,.scc-card[data-has-video="false"] .scc-sound{display:none}.scc-info{padding-top:28px}.scc .scc-name{font-size:clamp(21px,1.75vw,25px);font-weight:500;letter-spacing:.06em;text-transform:uppercase;line-height:1.1;margin:0 0 10px}.scc-meta{font-size:12px;letter-spacing:.14em;text-transform:uppercase;margin:0;max-width:none;color:#aeb1b3}.scc-description{font-size:17px;margin:22px 0 0;max-width:none;color:var(--scc-gold);line-height:1.4}.scc-detail{font-size:13px;color:#8f918e;margin:6px auto 0;max-width:40ch;line-height:1.55;text-wrap:balance}.scc-card:not([data-slot="0"]) .scc-description{color:#bcbcb8}.scc-card:not([data-slot="0"]) .scc-detail{opacity:0}.scc-error{font-size:12px;color:#d8bd8a;margin:10px 0 0;max-width:none;line-height:1.4}.scc [hidden]{display:none}.scc button:focus-visible{outline:2px solid #fff;outline-offset:-7px}.scc-empty{text-align:center;padding:80px 20px;color:#999}
.scc-card[data-slot="0"][data-ready="true"] .scc-video{opacity:1}.scc-card[data-slot="0"][data-ready="true"] .scc-poster{opacity:0}
@media(hover:hover){.scc-card:not([data-slot="0"]):hover{opacity:1}.scc-card[data-playing="true"] .scc-select:hover .scc-play{opacity:1}.scc-select:hover .scc-play{transform:scale(1.05)}}
@media(max-width:700px){.scc{padding-top:38px}.scc-heading{font-size:34px;text-align:left;margin-bottom:42px;padding:0 26px;max-width:400px}.scc-stage{height:510px}.scc-card{width:72vw;max-width:350px;transform-origin:50% 32%}.scc-card[data-slot="-1"]{transform:translateX(-147%) scale(.64);opacity:.56}.scc-card[data-slot="1"]{transform:translateX(47%) scale(.64);opacity:.56}.scc-info{padding-top:20px}.scc .scc-name{font-size:19px}.scc-meta{font-size:11px}.scc-description{font-size:15px;margin-top:16px}.scc-detail{font-size:12px}.scc-play{width:54px;height:54px;font-size:20px}.scc-orbit{padding:2px}}
@media(prefers-reduced-motion:reduce){.scc-card,.scc-play,.scc-poster{transition:none}}

/* The circle is one control; its sound indicator has a fixed bottom center. */
.scc .scc-select,.scc .scc-select:hover,.scc .scc-select:active{position:absolute;inset:0;padding:0;margin:0;transform:none}
.scc .scc-sound{top:auto;bottom:8%;left:50%;right:auto;transform:translateX(-50%);width:36px;height:36px;padding:0;margin:0;box-sizing:border-box;pointer-events:auto;line-height:1}
.scc .scc-sound svg{display:block;flex:none}

.scc .scc-sound:hover,.scc .scc-sound:active{transform:translateX(-50%)}
.scc-card[data-slot="0"][data-playing="true"] .scc-select:hover .scc-play,
.scc-card[data-slot="0"][data-playing="true"] .scc-select:focus-visible .scc-play{opacity:1}
