/* Shared brand layer for the wizard, interactive demos and showroom.
   Load after their component styles; game rendering remains independent. */
.experience-page,.simulation-lab-page,.virtual-showroom-page{
    --experience-line:var(--line);
    --experience-cyan:var(--cyan);
    --experience-blue:var(--blue);
    --experience-panel:var(--surface);
    --vs-bg:var(--bg);
    --vs-panel:var(--surface);
    --vs-panel-soft:var(--surface-2);
    --vs-line:var(--line);
    --vs-line-strong:#548693;
    --vs-cyan:var(--cyan);
    --vs-blue:var(--blue);
    --vs-text:var(--text);
    --vs-muted:var(--muted);
    background:var(--bg);
}
.experience-page:before,.simulation-lab-page:before,.virtual-showroom-page:before{opacity:.25}
.experience-page .section-badge,.simulation-lab-page .section-badge,.virtual-showroom-page .section-badge{font-size:10px;line-height:1.7;letter-spacing:.13em}
.experience-hero,.demo-hub-hero,.simulation-product-hero,.vs-hero{padding:60px 0 38px}
.experience-hero__grid,.demo-hub-hero__grid,.vs-hero__grid{grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);gap:50px;align-items:center}
.experience-hero h1,.demo-hub-hero h1,.simulation-product-hero h1,.vs-hero h1{font-size:clamp(36px,4.4vw,64px);font-weight:650;line-height:1.12;letter-spacing:-.04em;margin:18px 0 22px;overflow-wrap:break-word}
.demo-hub-hero h1 span,.vs-hero h1 span{background:none;-webkit-text-fill-color:var(--cyan);color:var(--cyan)}
.experience-hero p,.demo-hub-hero p,.simulation-product-hero p,.vs-hero p{font-size:15px;line-height:1.85;color:var(--muted)}
.experience-hero__badges{gap:8px;margin-top:24px}
.experience-hero__badges span{min-height:36px;font-size:11px;font-weight:550;border-color:var(--line);border-radius:6px;background:var(--surface);color:var(--muted)}
.wizard-hero-visual{min-height:360px;border-color:var(--line);border-radius:var(--radius);box-shadow:none}
.wizard-card{border-color:var(--line);border-radius:var(--radius);box-shadow:none}
.wizard-head{padding:24px 28px 20px}
.wizard-head strong{font-size:19px;font-weight:650}
.wizard-step__head h2{font-size:clamp(25px,2.7vw,35px);font-weight:650;line-height:1.25}
.wizard-choice{border-radius:12px;border-color:var(--line);box-shadow:none}
.wizard-choice strong{font-weight:650}
.wizard-recommendation,.wizard-contact-card{border-color:var(--line);border-radius:14px;background:var(--bg)}
.wizard-result-list,.wizard-contact-card>p{font-size:13px}
.wizard-contact-card>small{font-size:11px;line-height:1.7;color:var(--muted)}
.wizard-form-grid label,.wizard-contact-card>label{margin-top:0;font-size:12px;font-weight:550}
.wizard-actions .btn{min-width:120px}
.demo-hub-summary,.vs-hero__stats{border-color:var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:none}
.demo-hub-summary strong,.vs-hero__stats strong{color:var(--cyan);font-size:25px;font-weight:650}
.demo-hub-summary span,.vs-hero__stats span{color:var(--muted);font-size:11px;font-weight:550}
.demo-product-card{display:flex;flex-direction:column;background:var(--surface);border-color:var(--line);border-radius:var(--radius);box-shadow:none}
.demo-product-card:hover{box-shadow:0 18px 35px #0003;transform:translateY(-3px)}
.demo-product-card__body{flex:1;min-height:350px}
.demo-product-card__body h2{font-size:27px;line-height:1.2;font-weight:650}
.demo-product-card__body>small{color:var(--cyan);font-weight:650}
.demo-product-card__body p{font-size:13px;color:var(--muted)}
.demo-product-card__body ul{font-size:12px;line-height:1.7}
.demo-back-link{font-size:12px;font-weight:550;color:var(--muted)}
.demo-switcher{flex-shrink:0;border-color:var(--line);background:var(--surface);border-radius:12px}
.simulation-panel{border-color:var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:none}
.simulation-panel__header h2{font-size:clamp(26px,2.7vw,36px);font-weight:650;line-height:1.2}
.simulation-panel__header p{font-size:14px;line-height:1.8;color:var(--muted)}
.simulation-kicker{color:var(--cyan);font-weight:650}
.simulator-stage,.simulator-console{border-color:var(--line);border-radius:14px;box-shadow:none}
.simulator-console{background:var(--bg)}
.simulator-console .btn{white-space:normal}
.tuana-balance{display:grid;gap:4px;flex-shrink:0;min-width:78px}
.tuana-terminal-screen>header>div:first-child{min-width:0}
.simulation-next-step{border-color:var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:none}
.simulation-next-step h2{font-size:clamp(26px,2.5vw,36px);font-weight:650;line-height:1.2}
.simulation-next-step p{font-size:14px;color:var(--muted)}
.simulation-next-step>.btn{flex-shrink:0}
.vs-hero__stats>div{background:var(--bg);border-color:var(--line);border-radius:10px}
.vs-commandbar,.vs-viewer-card,.vs-inspector,.vs-after article{box-shadow:none;border-color:var(--line);border-radius:var(--radius)}
.vs-inspector h2{font-weight:650;line-height:1.2}
.vs-after h2{font-size:23px;line-height:1.25;font-weight:650}
.vs-after p{font-size:13px;color:var(--muted)}
.vs-help p,.vs-help li{font-size:13px;line-height:1.7}
.vs-after article{grid-template-columns:50px minmax(0,1fr);gap:20px;background:var(--surface)}
.vs-after article>i{width:50px;height:50px;font-size:19px;border-radius:12px}
.vs-after article .btn{grid-column:2;justify-self:start;white-space:normal}
.experience-page .btn:disabled,.simulation-lab-page button:disabled{cursor:not-allowed}

@media(max-width:1000px){
    .experience-hero__grid,.demo-hub-hero__grid,.vs-hero__grid{grid-template-columns:1fr;gap:30px}
    .experience-hero__grid{grid-template-columns:minmax(0,1fr) minmax(280px,.8fr)}
    .wizard-hero-visual{min-height:340px}
    .vs-hero__stats{grid-template-columns:repeat(3,minmax(0,1fr))}
    .vs-hero__stats>div{grid-template-columns:1fr;text-align:center}
    .simulation-product-hero__inner{align-items:start}
}
@media(max-width:760px){
    .experience-hero,.demo-hub-hero,.simulation-product-hero,.vs-hero{padding:38px 0 28px}
    .experience-hero__grid{grid-template-columns:1fr}
    .experience-hero h1,.demo-hub-hero h1,.simulation-product-hero h1,.vs-hero h1{font-size:clamp(34px,7.8vw,46px);line-height:1.13;margin:15px 0 19px}
    .experience-hero p,.demo-hub-hero p,.simulation-product-hero p,.vs-hero p{font-size:14px;line-height:1.8}
    .wizard-hero-visual{min-height:320px}
    .experience-hero__badges{gap:7px}
    .experience-hero__badges span{font-size:10px;padding-inline:10px}
    .wizard-step__head h2{font-size:26px}
    .wizard-steps{min-height:0}
    .wizard-choice{min-height:116px}
    .wizard-actions{gap:12px}
    .demo-hub-summary{grid-template-columns:repeat(3,minmax(0,1fr));padding:8px;gap:6px}
    .demo-hub-summary div{padding:14px 5px}
    .demo-hub-summary strong{font-size:22px}
    .demo-hub-summary span{font-size:10px}
    .demo-product-card__body{min-height:0;padding:24px}
    .demo-product-card__body h2{font-size:26px}
    .simulation-panel__header h2{font-size:27px}
    .simulation-panel__header p{font-size:13px}
    .simulation-next-step h2{font-size:27px}
    .simulation-next-step p{font-size:13px}
    .moon-card-tray{max-height:none;overflow:visible;gap:6px}
    .moon-sim-card{min-height:62px;padding:10px;grid-template-columns:38px minmax(0,1fr) auto}
    .moon-sim-card small{font-size:10px;line-height:1.4}
    .moon-stage-v3{min-height:570px}
    .tuana-stage-v3{min-height:650px}
    .tuana-terminal-screen{left:10px;right:10px;top:58px;width:auto;height:auto}
    .tuana-terminal-screen>header{gap:10px}
    .tuana-terminal-screen>header>div:first-child{gap:7px}
    .tuana-products{overflow:visible}
    .vs-hero__stats{gap:7px;padding:10px;grid-template-columns:repeat(3,minmax(0,1fr))}
    .vs-hero__stats>div{padding:13px 7px;gap:6px;grid-template-columns:1fr;text-align:center}
    .vs-hero__stats strong{font-size:22px}
    .vs-hero__stats span{font-size:10px}
    .vs-after article{padding:24px;grid-template-columns:40px minmax(0,1fr);gap:16px}
    .vs-after article>i{width:40px;height:40px;font-size:17px}
    .vs-after article .btn{grid-column:1/-1;width:100%;justify-self:stretch}
    .vs-after h2{font-size:22px}
    .vs-after p{font-size:12px}
}
@media(max-width:380px){
    .experience-hero h1,.demo-hub-hero h1,.simulation-product-hero h1,.vs-hero h1{font-size:32px}
    .moon-sim-card{gap:7px;padding-inline:7px;grid-template-columns:32px minmax(0,1fr) auto}
    .moon-sim-card>span{width:32px;height:34px;font-size:13px}
    .moon-sim-card em{font-size:9px;padding:4px 5px}
}