/* Subtle continuity with the Subsoccer product pages. */
:root{--brand-red:#d02b2f;--brand-red-hover:#b52428;--studio-ink:#2b2b2b;--studio-border:#dedede;--studio-muted:#6b6b6b}
body{color:var(--studio-ink)}
header{border-bottom-color:#e6e6e6}
header>span{color:#666}
.panel>h2,.recommendation-card h2{font-family:Subsoccer,Impact,sans-serif;font-size:30px;font-weight:400;line-height:1.15;letter-spacing:.25px;margin-bottom:12px}
.intro .product-title{color:#111}
.step-kicker,.intro .eyebrow{color:#666;letter-spacing:1.25px}
.description,.intro p,.model-help,.detail,.backdrop-controls p{color:#686868}
.primary,#review-button,.lead-row button{background:var(--brand-red);color:#fff;border-radius:0!important;font-weight:700}
.primary:hover:not(:disabled),#review-button:hover,.lead-row button:hover{background:var(--brand-red-hover)}
.primary:disabled{background:#777;opacity:.55}
.guided-ai,.review-download,#start-over{border-color:#d6d6d6;border-radius:0}
.guided-ai:hover,.review-download:hover,#start-over:hover{border-color:#2b2b2b;background:#fafafa}
.use-choices button,.model-choices button,.binary-choice label,.edge-accessory,.finish-options button{border-color:#dedede;border-radius:0!important}
.use-choices button:hover,.model-choices button:hover,.edge-accessory:hover,.finish-options button:hover,.binary-choice label:hover{border-color:#a6a6a6}
.use-choices button[aria-pressed=true],.model-choices button[aria-pressed=true],.finish-options button[aria-pressed=true],.binary-choice label:has(input:checked){border-color:var(--brand-red);background:#fdf8f8}
.use-choices strong{font-size:16px;font-weight:700}
.use-choices small,.model-choices i,.edge-accessory small{color:#6b6b6b}
.recommendation-card{background:#f5f5f5;border-left-color:var(--brand-red)}
.model-choices strong{font-size:21px}
.options-panel #dock[aria-pressed=true],.edge-accessory[aria-pressed=true]{border-color:var(--brand-red)}
.options-panel #lights[aria-pressed=true] .light-switch,.options-panel #dock[aria-pressed=true] .light-switch,.edge-accessory[aria-pressed=true] .light-switch{background:var(--brand-red)}
nav{border-color:#dedede}
nav button{color:#858585}
nav button[aria-current]{color:#2b2b2b;border-bottom-color:var(--brand-red)}
.detail,.backdrop-controls{border-top-color:#e3e3e3}
.price-note{background:#f5f5f5;border-left-color:#bcbcbc}
.upload-label,.proof-approval{background:#f7f7f7}
.quantity-selector{border-color:#d6d6d6;border-radius:0}
.quantity-selector button{background:#f5f5f5}
#review .price-breakdown dt{color:#686868}
footer{border-top-color:#e6e6e6}
@media(max-width:800px){.panel>h2,.recommendation-card h2{font-size:29px}.primary{min-height:48px}.use-choices strong{font-size:16px}}

/* Keep the selectable accessory distinct from the GO explanation and links. */
.dock-option{margin:16px 0 20px;border:1px solid var(--studio-border);background:#fff}
.dock-option[hidden]{display:none}
.options-panel .dock-option #dock{margin:0;border:0;border-bottom:1px solid #e6e6e6;padding:12px;gap:12px;border-radius:0!important}
.options-panel .dock-option #dock[aria-pressed=true]{border:0;border-bottom:1px solid #e6e6e6;box-shadow:inset 3px 0 var(--brand-red);background:#fdf8f8}
.options-panel .dock-option #dock small{font-size:11px;color:#555}
.options-panel .dock-option #dock strong{font-size:13px}
.dock-go{padding:0 16px 15px}
.dock-go p{font-size:12px;line-height:1.65;margin:14px 0;color:#505050}
.dock-go .dock-go-included{font-size:11px;color:#686868}
.dock-go a{display:inline-flex;align-items:center;gap:8px;color:var(--brand-red);font-size:12px;font-weight:600;text-underline-offset:3px;padding:5px 0}
.dock-go details{margin-top:12px;border-top:1px solid #e6e6e6;padding-top:12px}
.dock-go summary{cursor:pointer;font-size:12px;font-weight:600;color:#2b2b2b;line-height:1.5}
.dock-go ul{padding-left:17px;margin:12px 0 0;display:grid;gap:9px;font-size:11px;line-height:1.6;color:#626262}
.dock-go li strong{color:#2b2b2b}

/* Quote enquiry: a useful concept, followed by a human review and approval. */
#review .price-breakdown{margin:20px 0}
#review .price-breakdown>div{align-items:center;padding:13px 0;font-size:12px}
#review .price-breakdown dd{max-width:65%;overflow-wrap:anywhere}
#review .price-breakdown #review-model{font-weight:600}
#review .proof-approval{margin:20px 0;padding:16px;background:#f7f7f7;border:1px solid #e2e2e2;border-left:3px solid var(--brand-red);border-radius:0}
#review .proof-approval .step-kicker{font-size:8px;margin-bottom:9px}
#review .proof-approval strong{display:block;font-size:14px;line-height:1.4;color:#2b2b2b}
#review .proof-approval p{font-size:11px;line-height:1.65;color:#686868;margin:8px 0 0}
#review h3{font-size:17px;font-weight:600;margin:0 0 9px}
.request-copy{font-size:12px;line-height:1.65;color:#686868;margin:0 0 16px}
.request-details{margin:15px 0 20px;border-top:1px solid #e4e4e4;border-bottom:1px solid #e4e4e4;padding:14px 0}
.request-details summary{cursor:pointer;font-size:12px;font-weight:600;line-height:1.5}
.request-details summary span{font-weight:400;color:#777}
.request-details label{margin-top:16px}
.request-details input,.request-details textarea{width:100%;padding:11px;border:1px solid #ccc;border-radius:0;font:inherit;font-size:12px;background:#fff;color:#2b2b2b}
.request-details textarea{resize:vertical;line-height:1.5}
.quote-next{margin:26px 0 16px;border-top:1px solid #e0e0e0;padding-top:22px}
.quote-next ol{counter-reset:quote-next;display:grid;gap:16px;list-style:none;margin:16px 0 0;padding:0}
.quote-next li{counter-increment:quote-next;position:relative;padding-left:31px;font-size:12px;line-height:1.6}
.quote-next li:before{content:counter(quote-next);position:absolute;left:0;top:2px;display:grid;place-items:center;width:21px;height:21px;border:1px solid #ddd;color:var(--brand-red);font-size:10px;font-weight:600}
.quote-next li strong,.quote-next li span{display:block}
.quote-next li span{font-size:11px;color:#686868}
#review .lead-success{margin:24px 0;background:#fafafa;border:1px solid #ddd;border-top:3px solid var(--brand-red);border-radius:0;color:#2b2b2b;padding:18px}
#review .lead-success strong{font-size:16px;line-height:1.4}
#review .lead-success p{font-size:12px;line-height:1.65;margin:12px 0;overflow-wrap:anywhere}
#review .lead-success .quote-reference{font-size:11px;color:#686868}
#review .lead-success .review-download{margin:16px 0 0;text-align:left;font-size:11px;padding:12px;min-height:44px}
.quote-progress{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:#ffffffed;color:#2b2b2b;font-size:16px;font-weight:600}
#review .lead-row input:focus-visible{outline:2px solid var(--brand-red);outline-offset:-3px}

.quote-next ol{list-style:decimal;padding-left:22px;counter-reset:none}.quote-next li{padding-left:9px;counter-increment:none}.quote-next li:before{content:none}.quote-next li::marker{color:var(--brand-red);font-weight:600}

/* Product measurements share one accessible dialog across 3D and mobile stills. */
.dimensions-toggle{background:#fff;color:var(--studio-ink,#242829);border:1px solid #d3d9d5;padding:10px 12px;cursor:pointer;white-space:nowrap}
.dimensions-mobile{display:none}
.dimensions-dialog{box-sizing:border-box;width:min(540px,calc(100% - 28px));max-height:calc(100dvh - 40px);padding:30px;border:1px solid #d3d9d5;color:#303633;background:#fff;overflow:auto}
.dimensions-dialog::backdrop{background:#18211dcc}
.dimensions-close{position:absolute;right:12px;top:10px;background:#fff;border:0;padding:6px 12px;font-size:26px;cursor:pointer}
.dimensions-dialog h2{font-size:26px;margin:10px 25px 10px 0}.dimensions-dialog svg{display:block;width:100%;height:auto}
.dimensions-footprint{padding:16px;background:#f1f4f1;display:flex;flex-direction:column;gap:6px}.dimensions-footprint strong{font-size:25px}.dimensions-dialog p,.dimensions-dialog span,.dimensions-dialog dl,.dimensions-source{font-size:14px;line-height:1.5}
.dimensions-dialog dl div{display:flex;justify-content:space-between;gap:18px;padding:12px 0;border-bottom:1px solid #e3e7e4}.dimensions-dialog dd{margin:0;text-align:right;white-space:nowrap}.dimensions-source{display:inline-block;margin-top:8px;color:#a72026}
@media(max-width:800px){.dimensions-mobile{display:block;position:absolute;right:12px;top:12px;z-index:2;padding:8px 12px;font-size:12px}.dimensions-dialog{padding:24px 18px}.dimensions-dialog dl div{flex-direction:column;gap:4px}.dimensions-dialog dd{text-align:left}}
.guided-flow:has(#need:not([hidden]),#setup:not([hidden]),#model:not([hidden])) .dimensions-mobile{display:none}

#change-model{color:var(--brand-red);text-decoration:none;font-size:14px;font-weight:700}
#change-model:hover{color:var(--brand-red-hover)}

/* Keep the mobile still visible while editing, without covering the controls. */
@media(max-width:800px){
 .guided-flow:has(#finish:not([hidden]),#brand:not([hidden]),#options:not([hidden]),#review:not([hidden])) .product-selector~main .stage{position:sticky;top:0;z-index:5;height:min(32dvh,250px);min-height:0;max-height:none;aspect-ratio:auto;border-bottom:1px solid #dce1dd}
 html:has(.guided-flow #brand:not([hidden])),html:has(.guided-flow #options:not([hidden])),html:has(.guided-flow #finish:not([hidden])),html:has(.guided-flow #review:not([hidden])){scroll-padding-top:calc(min(32dvh,250px) + 12px)}
}

.pdf-page-dialog{width:min(600px,calc(100% - 28px));max-height:calc(100dvh - 40px);overflow:auto;border:1px solid #d3d9d5;padding:24px;color:#303633;background:#fff}.pdf-page-dialog::backdrop{background:#18211dcc}.pdf-page-dialog h2{margin:0 0 12px}.pdf-page-dialog p{font-size:14px;line-height:1.5}.pdf-page-dialog select{display:block;width:100%;padding:10px;margin:8px 0 16px;font-size:16px}.pdf-page-preview{min-height:100px;background:#eef0ee;padding:10px;display:grid;place-items:center}.pdf-page-preview canvas{max-width:100%;height:auto}.pdf-page-actions{display:flex;justify-content:flex-end;gap:12px}.pdf-page-actions button{padding:12px 18px;border:1px solid #cbd0ce;background:#fff}.pdf-page-actions .pdf-page-use{background:var(--brand-red);color:#fff;border-color:var(--brand-red)}.pdf-page-use:disabled{opacity:.45}
