/* EVORA Cinema Designer */
.designer-page{padding-bottom:0}
.dz{padding-top:72px;min-height:100svh;background:radial-gradient(70% 60% at 100% 0%,rgba(94,22,34,.25),transparent 60%),var(--bg)}
.dz-top{position:sticky;top:72px;z-index:30;background:rgba(11,10,9,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-2)}
.dz-titlebar{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0 4px}
.dz-h1{font:600 .78rem/1 var(--sans);letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin:0}
.dz-count{font:600 .72rem/1 var(--sans);letter-spacing:.12em;color:var(--muted)}
.dz-progress{display:flex;gap:4px;padding:6px 0 12px;margin:0;overflow-x:auto;scrollbar-width:none}
.dz-progress::-webkit-scrollbar{display:none}
.dz-progress li{list-style:none;flex:1 0 auto}
.dz-progress button{width:100%;min-width:62px;background:none;border:0;color:var(--dim);cursor:pointer;padding:0;text-align:left;font:600 .6rem/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase}
.dz-progress button::before{content:"";display:block;height:3px;border-radius:3px;background:rgba(243,235,221,.1);margin-bottom:7px;transition:background .3s}
.dz-progress button b{color:inherit;margin-right:4px}
.dz-progress li.done button{color:var(--muted)} .dz-progress li.done button::before{background:var(--gold-deep)}
.dz-progress li.cur button{color:var(--gold-2)} .dz-progress li.cur button::before{background:var(--gold)}
.dz-progress button[disabled]{cursor:default}
.dz-body{display:grid;gap:18px;padding-top:14px;padding-bottom:110px}
@media(min-width:1000px){.dz-body{grid-template-columns:minmax(0,1.25fr) minmax(380px,.9fr);gap:34px;align-items:start;padding-top:26px}}
.dz-preview{position:sticky;top:152px;z-index:20}
@media(max-width:999px){.dz-preview{top:140px;margin:0 calc(var(--gut) * -1);padding:0 var(--gut) 8px;background:var(--bg)}}
.dz-stage{position:relative;border-radius:16px;overflow:hidden;border:1px solid var(--line);background:#000;box-shadow:var(--shadow);aspect-ratio:16/9}
@media(max-width:999px){.dz-stage{aspect-ratio:auto;height:31vh;min-height:190px}}
.dz-canvas{position:absolute;inset:0}
.dz-canvas svg{width:100%;height:100%}
.dz-plan svg{object-fit:contain}
.dz-canvas{transition:opacity .35s}
.dz-canvas.fade{opacity:.35}
.dz-tabs{position:absolute;z-index:3;top:10px;right:10px;display:flex;background:rgba(0,0,0,.6);border:1px solid var(--line-2);border-radius:30px;padding:3px}
.dz-tabs button{border:0;background:none;color:#ddd;font:600 .62rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:8px 12px;border-radius:30px;cursor:pointer}
.dz-tabs button.on{background:var(--gold);color:#16110a}
.dz-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.dz-chips span{font:600 .64rem/1 var(--sans);letter-spacing:.08em;border:1px solid var(--line-2);background:var(--panel);border-radius:20px;padding:7px 10px;color:#e6dac4}
.dz-chips span i{font-style:normal;color:var(--dim);margin-right:5px}
@media(max-width:999px){.dz-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.dz-chips span{flex:0 0 auto}}
.dz-note{font-size:.72rem;color:var(--dim);margin:8px 0 0}
@media(max-width:999px){.dz-note{display:none}}

.dz-panel{min-width:0;animation:fadeUp .45s ease}
.dz-panel h2{font-size:clamp(1.7rem,3.4vw,2.5rem);margin-bottom:.2em}
.dz-panel .q-sub{color:var(--muted);margin-bottom:20px}
.dz-sec-title{font:700 .66rem/1.2 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin:22px 0 10px}

.units{display:inline-flex;border:1px solid var(--line);border-radius:30px;padding:3px;margin-bottom:14px}
.units button{border:0;background:none;color:#ddd;padding:8px 14px;border-radius:30px;font:600 .7rem/1 var(--sans);letter-spacing:.1em;cursor:pointer}
.units button.on{background:var(--gold);color:#16110a}
.presets{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media(min-width:640px){.presets{grid-template-columns:repeat(4,1fr)}}
.preset{border:1px solid var(--line-2);background:var(--panel);border-radius:12px;padding:12px;cursor:pointer;text-align:left;color:var(--text);transition:border-color .2s,transform .2s}
.preset b{display:block;font:600 1.05rem/1.2 var(--serif)}
.preset small{color:var(--dim);font-size:.72rem}
.preset.on,.preset:hover{border-color:var(--gold)}
.calc{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:16px}
@media(min-width:640px){.calc{grid-template-columns:repeat(3,1fr)}}
.calc div{background:#0f0d0c;border:1px solid var(--line-2);border-radius:10px;padding:10px 12px}
.calc small{display:block;font:600 .58rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.calc b{font:600 1.15rem/1.3 var(--serif);color:#fff}

/* option cards — swipeable on mobile */
.opts{display:grid;gap:12px;grid-template-columns:1fr 1fr}
.opts.one{grid-template-columns:1fr}
@media(max-width:639px){.opts.swipe{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin:0 calc(var(--gut) * -1);padding:4px var(--gut) 12px;scrollbar-width:none}.opts.swipe::-webkit-scrollbar{display:none}.opts.swipe>*{flex:0 0 78%;scroll-snap-align:center}}
.opt{position:relative;display:flex;flex-direction:column;text-align:left;background:var(--panel);border:1.5px solid var(--line-2);border-radius:14px;overflow:hidden;cursor:pointer;color:var(--text);padding:0;transition:border-color .2s,transform .2s,box-shadow .2s;font:inherit}
.opt:hover{border-color:rgba(201,162,74,.5)}
.opt.on{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold),0 12px 34px rgba(201,162,74,.16)}
.opt.on::after{content:"✓";position:absolute;top:10px;right:10px;width:26px;height:26px;border-radius:50%;background:var(--gold);color:#16110a;display:grid;place-items:center;font-weight:800;font-size:.8rem}
.opt .oimg{aspect-ratio:16/9;background:#000 center/cover no-repeat;position:relative}
.opt .oimg svg{width:100%;height:100%}
.opt .obody{padding:12px 14px 14px}
.opt .oname{font:600 1.15rem/1.2 var(--serif);display:block;color:#fff}
.opt .odesc{font-size:.8rem;color:var(--muted);line-height:1.5;display:block;margin-top:4px}
.opt .ometa{display:block;margin-top:8px;font-size:.72rem;color:var(--dim);line-height:1.5}
.opt .ometa b{color:var(--gold-2);font-weight:600}
.badge{position:absolute;left:10px;top:10px;z-index:2;background:rgba(0,0,0,.72);border:1px solid var(--gold);color:var(--gold-2);font:700 .56rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:6px 8px;border-radius:20px}
.badge.rec{background:var(--gold);color:#16110a}

.swatches{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(min-width:640px){.swatches{grid-template-columns:repeat(5,1fr)}}
.sw{border:1.5px solid var(--line-2);background:var(--panel);border-radius:12px;padding:8px;cursor:pointer;text-align:center;color:var(--text);position:relative;font:inherit}
.sw i{display:block;aspect-ratio:1/1;border-radius:8px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),inset 0 -20px 30px rgba(0,0,0,.35)}
.sw span{display:block;font:600 .66rem/1.2 var(--sans);letter-spacing:.06em;margin-top:7px}
.sw em{position:absolute;top:4px;left:4px;font-style:normal;font:700 .5rem/1 var(--sans);letter-spacing:.1em;background:var(--gold);color:#16110a;padding:4px 5px;border-radius:10px;text-transform:uppercase}
.sw.on{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
.sw.pattern i{background-image:repeating-linear-gradient(45deg,rgba(201,162,74,.35) 0 2px,transparent 2px 12px),repeating-linear-gradient(-45deg,rgba(201,162,74,.35) 0 2px,transparent 2px 12px)!important}
.custom-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:14px;padding:14px;border:1px dashed var(--line);border-radius:12px}
.custom-row input[type=color]{width:54px;height:44px;border:0;background:none;padding:0;cursor:pointer}
.upl{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:.82rem;color:var(--gold-2)}
.upl input{display:none}
.upl-thumb{width:44px;height:44px;border-radius:8px;object-fit:cover;border:1px solid var(--line)}

.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:1.5px solid var(--line-2);background:var(--panel);color:var(--text);border-radius:30px;padding:10px 16px;min-height:44px;font:600 .78rem/1 var(--sans);cursor:pointer}
.chip.on{border-color:var(--gold);background:rgba(201,162,74,.14);color:#fff}

.info{margin-top:22px;border:1px solid var(--line);background:radial-gradient(100% 140% at 100% 0%,rgba(94,22,34,.3),transparent 60%),var(--panel);border-radius:14px;padding:18px}
.info h4{margin-bottom:.3em}
.info p{color:var(--muted);font-size:.88rem;margin:0}
.layers{display:flex;gap:4px;margin:10px 0 2px;align-items:stretch;height:74px}
.layers div{flex:1;border-radius:6px;display:flex;align-items:flex-end;padding:6px;font:600 .56rem/1.2 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:#fff;animation:fadeUp .6s both}
.layers div:nth-child(1){background:#6b6b6b}.layers div:nth-child(2){background:#5a4a6e;animation-delay:.1s}.layers div:nth-child(3){background:#6b3a2a;animation-delay:.2s}.layers div:nth-child(4){background:#3a2616;border:1px solid var(--gold-deep);animation-delay:.3s}
.ba{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--line-2);background:#0e0d0c;margin-top:12px}
.ba svg{width:100%;height:auto}
.ba-toggle{display:inline-flex;border:1px solid var(--line);border-radius:30px;padding:3px;margin-top:10px}
.ba-toggle button{border:0;background:none;color:#ddd;padding:7px 12px;border-radius:30px;font:600 .64rem/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.ba-toggle button.on{background:var(--gold);color:#16110a}
.ray{stroke-dasharray:6 6;animation:dash 1.2s linear infinite}
@keyframes dash{to{stroke-dashoffset:-24}}

.stepper{display:flex;align-items:center;gap:10px;background:#0f0d0c;border:1px solid var(--line-2);border-radius:12px;padding:8px 12px}
.stepper button{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:none;color:#fff;font-size:1.1rem;cursor:pointer}
.stepper b{min-width:26px;text-align:center;font:600 1.3rem/1 var(--serif)}
.stepper span{font-size:.75rem;color:var(--muted);flex:1}
.custom-audio{display:grid;gap:8px;margin-top:12px}
.fit{margin-top:14px}

/* bottom nav */
.dz-nav{position:fixed;left:0;right:0;bottom:0;z-index:50;background:rgba(10,9,8,.96);backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:10px 0 calc(10px + env(safe-area-inset-bottom))}
.dz-nav-in{display:flex;align-items:center;gap:10px}
.dz-nav .btn{min-height:52px}
#dzNext{flex:1;max-width:340px;margin-left:auto}
.dz-band{display:none;font-size:.72rem;color:var(--muted);line-height:1.3}
.dz-band b{display:block;color:var(--gold-2);font:600 1rem/1.2 var(--serif)}
@media(min-width:760px){.dz-band{display:block}}
.dz[data-step="9"] .dz-nav{display:none}
.dz[data-step="1"] #dzBack{visibility:hidden}

/* final */
.final-hero{text-align:center;padding:10px 0 6px}
.final-hero h2{font-size:clamp(2rem,5vw,3.4rem)}
.sumlist{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0}
.sumlist div{background:#0f0d0c;border:1px solid var(--line-2);border-radius:10px;padding:10px 12px;position:relative}
.sumlist small{display:block;font:600 .56rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.sumlist b{font:600 1rem/1.3 var(--serif);color:#fff}
.sumlist button{position:absolute;right:8px;top:8px;border:0;background:none;color:var(--gold);font-size:.66rem;cursor:pointer;text-decoration:underline}
.bands{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}
.bandc{border:1px solid var(--line-2);border-radius:12px;padding:12px;background:var(--panel);opacity:.55;transition:opacity .3s}
.bandc b{display:block;font:600 1.05rem/1.2 var(--serif);color:#fff}
.bandc span{font-size:.78rem;color:var(--gold-2)}
.bandc.on{opacity:1;border-color:var(--gold);box-shadow:0 0 0 1px var(--gold);background:radial-gradient(120% 120% at 0 0,rgba(201,162,74,.16),transparent 60%),var(--panel)}
.bandc.on::before{content:"Your selections";display:block;font:700 .52rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.addons{display:grid;gap:8px;margin-top:8px}
.addon{display:flex;gap:12px;align-items:center;border:1px solid var(--line-2);border-radius:12px;padding:12px;background:var(--panel);cursor:pointer}
.addon input{width:20px;height:20px;accent-color:var(--gold)}
.addon b{display:block;font-size:.88rem}
.addon small{color:var(--dim);font-size:.76rem}
.lead-box{margin-top:26px;border:1px solid var(--gold-deep);border-radius:18px;padding:22px;background:radial-gradient(100% 120% at 100% 0%,rgba(94,22,34,.4),transparent 55%),linear-gradient(180deg,#1b1714,#110f0d)}
.lead-box h3{font-size:clamp(1.5rem,3vw,2rem)}
.done-box{text-align:center;padding:30px 10px}