/* Editorial product windows. The landing's layout remains in landing.css. */
.topic-modal {
    --popup-accent:#007e9c;
    width:min(1160px,calc(100% - 48px));
    max-width:none;
    max-height:calc(100dvh - 48px);
    padding:0;
    border:1px solid rgba(255,255,255,.6);
    border-radius:22px;
    background:#fff;
    box-shadow:0 35px 100px #00142566;
    scrollbar-gutter:stable;
    overscroll-behavior:contain;
    scroll-behavior:auto;
}
.topic-modal::backdrop { background:rgba(4,19,33,.76); backdrop-filter:blur(9px); }
.topic-modal [hidden] { display:none!important; }
.popup-topbar {
    position:sticky; top:0; z-index:5;
    display:flex; align-items:center; gap:16px;
    min-height:64px; padding:12px 32px;
    border-bottom:1px solid #e4e9ec;
    background:rgba(255,255,255,.96); backdrop-filter:blur(12px);
}
.popup-position { color:var(--popup-accent); font-size:12px; font-weight:800; font-variant-numeric:tabular-nums; letter-spacing:.08em; }
.popup-section-label { padding-left:16px; border-left:1px solid #d8e1e5; color:#5d6a76; font-size:12px; }
.popup-topbar .modal-close { position:static; margin-left:auto; flex:0 0 40px; width:40px; height:40px; min-height:40px; border:1px solid #dce3e7; border-radius:50%; background:#f6f8f8; color:#163345; transition:background .2s,transform .2s; }
.popup-topbar .modal-close:hover { background:#e7eef0; transform:rotate(90deg); }
.popup-content { padding:34px 40px 38px; }
.popup-heading { max-width:850px; margin-bottom:30px; }
.popup-kicker { display:block; color:var(--popup-accent); font-size:12px; line-height:1.4; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.popup-heading h2 { margin:12px 0 16px; color:#10293c; font-size:clamp(30px,3.5vw,46px); font-weight:750; letter-spacing:-.04em; line-height:1.1; }
.popup-heading h2:focus { outline:none; }
.popup-intro { max-width:800px; margin:0; color:#576a78; font-size:16px; line-height:1.7; }
.popup-product-layout { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(245px,1fr); align-items:start; gap:30px; }
.product-viewer { min-width:0; overflow:hidden; background:#f1f5f6; border:1px solid #dce5e8; border-radius:12px; }
.viewer-toolbar { display:flex; align-items:center; gap:8px; padding:0 10px 0 14px; border-bottom:1px solid #dce5e8; background:#fff; }
.viewer-tabs { display:flex; flex-wrap:wrap; flex:1; min-width:0; gap:0 14px; }
.viewer-tabs button { position:relative; min-height:48px; padding:10px 0; border:0; border-bottom:2px solid transparent; background:transparent; color:#63737e; font:600 12px/1.3 "Segoe UI",sans-serif; cursor:pointer; }
.viewer-tabs button[aria-selected="true"] { border-bottom-color:var(--popup-accent); color:var(--popup-accent); font-weight:800; }
.viewer-tabs button:hover { color:var(--popup-accent); }
.viewer-zoom { display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; padding:0; border:0; border-radius:6px; background:transparent; color:#3c596c; cursor:pointer; font-size:16px; }
.viewer-zoom:hover { background:#eff4f5; }
.viewer-frame { margin:0; }
.viewer-image { display:grid; place-items:center; min-height:300px; aspect-ratio:1.45; padding:16px; background:#eef3f5; }
.viewer-image img { display:block; width:100%; height:100%; min-height:0; max-height:460px; object-fit:contain; border-radius:4px; }
.viewer-frame figcaption { display:flex; justify-content:space-between; flex-wrap:wrap; gap:6px 16px; padding:13px 16px; border-top:1px solid #dce5e8; background:#fff; color:#5b707f; font-size:10px; line-height:1.5; }
.viewer-frame figcaption span:first-child { color:#2d4657; font-weight:650; }
.editorial-notes { display:grid; }
.editorial-note { display:flex; align-items:flex-start; gap:14px; padding:21px 0; border-top:1px solid #dce5e8; }
.editorial-note:first-child { padding-top:4px; border-top:0; }
.note-number { flex:0 0 20px; padding-top:3px; color:var(--popup-accent); font-size:11px; font-weight:800; font-variant-numeric:tabular-nums; }
.note-icon { flex:0 0 22px; color:var(--popup-accent); font-size:22px; }
.keyboard-shortcut { display:flex; gap:7px; margin-top:12px; }
.keyboard-shortcut kbd { padding:5px 9px; border:1px solid #d4dfe4; border-bottom-width:3px; border-radius:5px; background:#f7f9fa; color:#2a485b; font:600 12px/1.4 "Segoe UI",sans-serif; }
.editorial-note h3 { margin:0 0 8px; color:#183548; font-size:17px; letter-spacing:-.015em; line-height:1.35; }
.editorial-note p { margin:0; color:#5b6b76; font-size:13px; line-height:1.75; }
.popup-footnote { display:flex; align-items:flex-start; gap:12px; margin:25px 0 0; padding-top:20px; border-top:1px solid #e0e7ea; color:#596d7b; font-size:12px; line-height:1.75; }
.popup-footnote .bi { color:var(--popup-accent); font-size:20px; }
.popup-product-layout.is-expanded { grid-template-columns:1fr; }
.is-expanded .editorial-notes { display:none; }
.is-expanded .viewer-image { display:block; aspect-ratio:auto; max-height:65dvh; overflow:auto; }
.is-expanded .viewer-image img { width:100%; min-width:900px; max-height:none; height:auto; }
.billing-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:36px; align-items:start; }
.event-documentary { margin:0; overflow:hidden; border-radius:12px; background:#0b293e; }
.event-documentary img { display:block; width:100%; height:auto; aspect-ratio:1.35; object-fit:cover; }
.event-documentary figcaption { padding:16px 20px; color:#d5e4eb; font-size:11px; line-height:1.4; }
.release-label { color:var(--popup-accent); font-size:11px; font-weight:750; letter-spacing:.06em; }
.billing-notes > h3 { margin:12px 0 20px; color:#173449; font-size:26px; letter-spacing:-.035em; line-height:1.2; }
.release-item { border-bottom:1px solid #dce5e8; }
.release-item:first-child { border-top:1px solid #dce5e8; }
.release-item summary { display:flex; align-items:center; gap:14px; min-height:65px; padding:17px 0; color:#183649; font-size:15px; font-weight:700; line-height:1.4; list-style:none; cursor:pointer; }
.release-item summary::-webkit-details-marker { display:none; }
.release-item summary > .bi:first-child:not(:last-child) { flex:0 0 24px; color:var(--popup-accent); font-size:21px; }
.release-item summary > span { flex:1; }
.release-item summary > .bi:last-child { font-size:16px; color:var(--popup-accent); transition:transform .25s; }
.release-item[open] summary > .bi:last-child { transform:rotate(45deg); }
.release-detail { padding:0 0 22px; }
.release-detail p { margin:0; color:#5a6e7c; font-size:14px; line-height:1.75; }
.release-screenshot { display:block; width:100%; height:auto; margin-top:18px; border:1px solid #e0e8eb; border-radius:6px; }
.release-layout { display:grid; grid-template-columns:260px minmax(0,1fr); gap:38px; align-items:start; }
.release-cover { padding:34px 28px; overflow:hidden; border-radius:12px; background:#0b2c40; color:#fff; }
.release-cover > .bi { display:block; margin-bottom:40px; color:#80d2df; font-size:44px; }
.release-cover > span { display:block; color:#afcbd8; font-size:15px; }
.release-cover > strong { display:block; margin-top:8px; font-size:32px; line-height:1.1; letter-spacing:-.04em; }
.release-cover p { margin:22px 0 32px; color:#d1e0e8; font-size:15px; line-height:1.6; }
.release-cover small { display:block; padding-top:20px; border-top:1px solid #ffffff25; color:#80d2df; font-size:11px; }
.showroom-photography { margin:0; }
.showroom-photography > div { display:grid; grid-template-columns:1.5fr 1fr; gap:14px; }
.showroom-photography img { display:block; width:100%; height:270px; object-fit:cover; border-radius:12px; }
.showroom-photography figcaption { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-top:14px; color:#697b88; font-size:11px; }
.showroom-photography figcaption strong { color:#334a5b; font-size:13px; font-weight:600; }
.showroom-brands { margin-top:32px; }
.showroom-brands h3 { margin:0; color:#173449; font-size:20px; font-weight:700; }
.showroom-brands .sponsor-gallery { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:18px; }
.showroom-brands .sponsor-gallery-item { min-height:105px; padding:24px; border:1px solid #e0e7eb; border-radius:9px; background:#fafbfc; box-shadow:none; }
.showroom-brands .sponsor-gallery-item img { max-height:55px; max-width:85%; }
.showroom-brands .sponsor-gallery-item:hover { border-color:#9db4c5; background:#fff; }
.popup-footer { position:relative; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:21px 40px; border-top:1px solid #e1e8eb; background:#f7f9fa; }
.popup-navigation { display:flex; align-items:center; gap:10px; min-width:0; }
.popup-navigation button { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:44px; padding:0 12px; border:1px solid #d2dfe4; border-radius:6px; background:#fff; color:#28495d; font:650 12px/1.3 "Segoe UI",sans-serif; cursor:pointer; }
.popup-navigation button:disabled { opacity:.35; cursor:default; }
.popup-navigation button:not(:disabled):hover { border-color:#749aac; background:#edf4f6; }
.popup-reserve { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:44px; padding:0 19px; border-radius:6px; background:#0c2d42; color:#fff; text-decoration:none; font-size:12px; font-weight:750; white-space:nowrap; transition:background .25s,transform .25s; }
.popup-reserve:hover { background:var(--popup-accent); transform:translateY(-2px); }
@keyframes panel-enter { from { opacity:0; transform:translateY(9px); } to { opacity:1; transform:translateY(0); } }
@media(prefers-reduced-motion:no-preference) {
    .popup-content { animation:panel-enter .3s ease both; }
    .viewer-frame:not([hidden]),.release-item[open] .release-detail { animation:panel-enter .28s ease both; }
}
body.motion-paused .popup-content,body.motion-paused .viewer-frame,body.motion-paused .release-detail { animation:none!important; }
@media(max-width:900px) {
    .popup-content { padding:28px; }
    .popup-product-layout { grid-template-columns:1fr; gap:24px; }
    .editorial-notes { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
    .editorial-note { display:block; border-top:1px solid #dce5e8; padding:16px 0 0; }
    .editorial-note:first-child { border-top:1px solid #dce5e8; padding-top:16px; }
    .note-number { display:block; margin-bottom:10px; }
    .viewer-image { aspect-ratio:1.75; }
    .billing-layout { gap:24px; }
    .release-layout { grid-template-columns:200px minmax(0,1fr); gap:24px; }
    .release-cover { padding:28px 22px; }
    .release-cover > strong { font-size:27px; }
    .showroom-photography img { height:230px; }
    .popup-footer { padding:20px 28px; }
}
@media(max-width:560px) {
    .topic-modal { width:calc(100% - 16px); max-height:calc(100dvh - 16px); border-radius:15px; }
    .popup-topbar { min-height:58px; padding:8px 18px; gap:12px; }
    .popup-section-label { padding-left:12px; font-size:11px; }
    .popup-topbar .modal-close { flex-basis:36px; width:36px; height:36px; min-height:36px; }
    .popup-content { padding:25px 20px 28px; }
    .popup-heading { margin-bottom:24px; }
    .popup-heading h2 { font-size:32px; margin:12px 0 15px; }
    .popup-intro { font-size:14px; line-height:1.7; }
    .popup-kicker { font-size:10px; }
    .viewer-toolbar { align-items:center; padding-left:10px; padding-right:5px; gap:4px; }
    .viewer-tabs { gap:0 12px; }
    .viewer-tabs button { font-size:11px; min-height:40px; }
    .viewer-zoom { flex-basis:30px; width:30px; }
    .viewer-image { min-height:200px; padding:7px; aspect-ratio:1.3; }
    .viewer-frame figcaption { padding:10px 12px; font-size:9px; }
    .editorial-notes { grid-template-columns:1fr; gap:0; }
    .editorial-note,.editorial-note:first-child { display:flex; gap:12px; padding:18px 0; }
    .note-number { margin-bottom:0; }
    .editorial-note h3 { font-size:17px; }
    .billing-layout,.release-layout { grid-template-columns:1fr; gap:25px; }
    .event-documentary img { aspect-ratio:1.75; }
    .release-cover { display:grid; grid-template-columns:1fr auto; align-items:center; gap:5px 18px; padding:22px; }
    .release-cover > .bi { grid-column:2; grid-row:1/3; margin:0; font-size:34px; }
    .release-cover > span { grid-column:1; grid-row:1; font-size:12px; }
    .release-cover > strong { grid-column:1; grid-row:2; font-size:28px; margin:0; }
    .release-cover p { grid-column:1/-1; margin:12px 0 8px; font-size:13px; }
    .release-cover small { grid-column:1/-1; padding-top:12px; }
    .release-item summary { min-height:61px; font-size:14px; gap:10px; }
    .release-detail p { font-size:13px; }
    .showroom-photography > div { grid-template-columns:1fr; gap:10px; }
    .showroom-photography img { height:auto; aspect-ratio:1.75; }
    .showroom-photography > div img:nth-child(2) { aspect-ratio:2.4; }
    .showroom-photography figcaption { flex-direction:column; gap:6px; }
    .showroom-brands .sponsor-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
    .showroom-brands .sponsor-gallery-item { min-height:85px; padding:17px; }
    .popup-footer { padding:16px 20px; flex-wrap:wrap; gap:13px; }
    .popup-navigation { width:100%; }
    .popup-next,.popup-back { flex:1; }
    .popup-reserve { width:100%; min-height:46px; }
}
.csm-products { border-top:1px solid #dce5e9; }
.csm-product { display:grid; grid-template-columns:150px minmax(0,1fr) 32px; gap:30px; align-items:center; padding:28px 8px; border-bottom:1px solid #dce5e9; }
.csm-product-logo { display:flex; align-items:center; justify-content:center; min-height:104px; }
.csm-product-logo img { max-width:138px; max-height:96px; object-fit:contain; }
.csm-product-label { color:var(--popup-accent); font-size:11px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
.csm-product-copy h3 { margin:8px 0 10px; color:#12354a; font-size:25px; letter-spacing:-.025em; }
.csm-product-copy p { margin:0; color:#536771; font-size:15px; line-height:1.7; }
.csm-product-number { align-self:start; padding-top:8px; color:#78909b; font-size:12px; font-variant-numeric:tabular-nums; }
@media(prefers-reduced-motion:no-preference) {
 .csm-product { animation:csm-product-enter .45s both; animation-delay:calc(var(--product-index) * 80ms); transition:background .25s; }
 .csm-product-logo img { transition:transform .3s; }
 .csm-product:hover { background:#f6f9fa; }
 .csm-product:hover img { transform:translateY(-4px); }
 @keyframes csm-product-enter { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
}
body.motion-paused .csm-product,body.motion-paused .csm-product-logo img { animation:none; transition:none; }
body.motion-paused .csm-product:hover img { transform:none; }
@media(max-width:560px) {
 .csm-product { grid-template-columns:64px minmax(0,1fr); gap:16px; padding:24px 0; align-items:start; }
 .csm-product-logo { min-height:64px; padding-top:5px; }
 .csm-product-logo img { max-width:64px; max-height:64px; }
 .csm-product-copy h3 { font-size:20px; }
 .csm-product-label { font-size:9px; }
 .csm-product-copy p { font-size:13px; }
 .csm-product-number { display:none; }
}