/* Steam Genie - Book Online page */
.bk-hero{position:relative;background:linear-gradient(160deg,#06265e,#0a4aa8 70%,#1479f0);color:#fff;padding:46px 0 120px;overflow:hidden}
.bk-hero .grid{position:relative;display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:end}
.bk-hero h1{font-size:clamp(44px,6.2vw,84px);color:#fff;text-shadow:0 5px 0 #031a46}
.bk-hero h1 em{display:block;font-style:normal;color:#52d6ff}
.bk-hero p.sub{font:500 clamp(18px,2.2vw,24px)/1.3 var(--ui);margin-top:14px;color:#e2f2ff}
.bk-hero .gen{width:min(300px,60%);margin:0 auto -118px;position:relative;z-index:2;filter:drop-shadow(0 8px 0 rgba(0,0,0,.2))}
.feats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:26px}
.feat{display:flex;gap:10px;align-items:center;font:600 15px/1.2 var(--ui);color:#fff}
.feat i{flex:none;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.14);border:2px solid rgba(255,255,255,.7);display:grid;place-items:center}
.feat svg{width:24px;height:24px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

.bk{position:relative;margin-top:-64px;z-index:3;padding-bottom:70px}
.stepper{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;background:#fff;border:3px solid var(--navy);box-shadow:0 7px 0 var(--navy);border-radius:999px;padding:8px;list-style:none;margin:0}
.stepper li{display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 12px;border-radius:999px;font:600 18px var(--ui);color:#6b84a8;background:transparent;border:0;cursor:default;min-width:0}
.stepper li b{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#dbe9f7;color:#6b84a8;font:700 17px var(--ui)}
.stepper li.cur{background:linear-gradient(#45b0ff,#1479f0);color:#fff}
.stepper li.cur b{background:#fff;color:var(--blue2)}
.stepper li.done{color:var(--navy);cursor:pointer}
.stepper li.done b{background:var(--green);color:#fff}
.stepper li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;margin-top:30px;align-items:start}
.panel{display:none}
.panel.on{display:block}
.panel>h2{font-size:clamp(30px,3.6vw,40px)}
.panel>.hint{color:var(--muted);margin:6px 0 20px}

.cat{background:#fff;border:3px solid var(--navy);border-radius:var(--r);box-shadow:var(--pop);overflow:hidden;margin-bottom:26px;scroll-margin-top:96px}
.cat header{display:flex;align-items:center;gap:14px;padding:14px 18px;color:#fff;background:linear-gradient(90deg,#082c6b,#0b5fd0 60%,#1479f0);position:relative}
.cat header i{width:46px;height:46px;border-radius:50%;background:#fff;border:2px solid #031a46;display:grid;place-items:center;flex:none}
.cat header i svg{width:26px;height:26px;stroke:var(--blue2);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.cat header h3{font-size:30px;color:#fff;text-shadow:0 3px 0 #031a46}
.row{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:center;padding:16px 18px;border-top:2px solid #e3f0fb}
.cat header+.row{border-top:0}
.row .nm b{display:block;font:600 19px/1.2 var(--ui);color:var(--navy)}
.row .nm small{color:var(--muted);font-size:14px}
.row .nm em{display:block;font:600 16px var(--ui);font-style:normal;color:var(--blue2);margin-top:2px}
.qty{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 10px}
.qty .lb{grid-column:1/-1;font:600 14px/1.2 var(--ui);color:var(--navy)}
.qty .lb small{display:block;font:400 12.5px var(--body);color:var(--muted)}
.stp{display:inline-flex;align-items:center;gap:8px;margin-top:6px}
.stp button{width:38px;height:38px;border-radius:50%;border:2px solid var(--navy);background:#fff;color:var(--navy);font:700 22px/1 var(--ui);cursor:pointer;display:grid;place-items:center;padding:0;transition:transform .1s}
.stp button.p{background:var(--blue);color:#fff}
.stp button:active{transform:scale(.9)}
.stp button:disabled{opacity:.35;cursor:default}
.stp output{min-width:26px;text-align:center;font:700 20px var(--ui);color:var(--navy)}

.side{position:sticky;top:96px;display:grid;gap:18px}
.sum{background:#fff;border:3px solid var(--navy);border-radius:var(--r);box-shadow:var(--pop);overflow:hidden}
.sum header{background:var(--navy);color:#fff;padding:14px 18px;font:700 22px var(--ui);display:flex;gap:10px;align-items:center}
.sum .bd{padding:16px 18px}
.sum .empty{text-align:center;color:var(--muted);padding:14px 4px}
.sum .empty b{display:block;font:600 19px var(--ui);color:var(--navy)}
.sum ul{list-style:none;padding:0;margin:0 0 10px}
.sum li{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:2px dashed var(--line);font:500 16px/1.25 var(--ui)}
.sum li small{display:block;color:var(--muted);font:400 13px var(--body)}
.sum li span:last-child{font-weight:700;white-space:nowrap}
.sum .tot{display:flex;justify-content:space-between;align-items:baseline;margin-top:6px;font:700 22px var(--ui);color:var(--navy)}
.sum .tot b{font-size:30px;color:var(--blue2)}
.sum .min{display:flex;gap:10px;align-items:flex-start;background:var(--ice);border-radius:14px;padding:12px;margin-top:12px;font:500 15px/1.3 var(--ui);color:var(--navy)}
.sum .min svg{flex:none;width:20px;height:20px;margin-top:1px;fill:var(--blue2)}
.perks{background:#fff;border:3px solid var(--navy);border-radius:var(--r);box-shadow:var(--pop);padding:8px 18px}
.perk{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:2px dashed var(--line)}
.perk:last-child{border:0}
.perk i{flex:none;width:42px;height:42px;border-radius:50%;background:var(--ice);display:grid;place-items:center}
.perk i svg{width:22px;height:22px;stroke:var(--blue2);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.perk b{display:block;font:600 16px var(--ui);color:var(--navy)}
.perk span{font-size:14px;color:var(--muted);line-height:1.3;display:block}
.help{background:linear-gradient(135deg,#0a3a8c,#1479f0);border:3px solid var(--navy);border-radius:var(--r);box-shadow:var(--pop);color:#fff;padding:20px;position:relative;overflow:hidden}
.help b{font:800 24px/1 var(--head);display:block;max-width:190px}
.help p{font-size:15px;margin:6px 0 14px;max-width:170px}
.help .btn{font-size:16px;padding:11px 16px}
.help img{position:absolute;right:-14px;bottom:-4px;width:120px}

.card2{background:#fff;border:3px solid var(--navy);border-radius:var(--r);box-shadow:var(--pop);padding:26px}
.tw{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.tw label{position:relative;cursor:pointer}
.tw input{position:absolute;opacity:0;inset:0}
.tw span{display:block;text-align:center;padding:14px 8px;border:3px solid var(--line);border-radius:16px;font:600 17px/1.2 var(--ui);color:var(--navy);background:#f7fcff;transition:.15s}
.tw small{display:block;font:400 13px var(--body);color:var(--muted)}
.tw input:checked+span{border-color:var(--navy);background:var(--ice);box-shadow:0 4px 0 var(--navy)}
.tw input:focus-visible+span{outline:4px solid var(--gold);outline-offset:2px}
.fld.bad .tw span{border-color:var(--red)}
.nav-row{display:flex;gap:14px;justify-content:space-between;align-items:center;margin-top:26px;flex-wrap:wrap}
.review{display:grid;gap:18px}
.review h3{font-size:26px;margin-bottom:8px}
.review dl{margin:0;display:grid;grid-template-columns:130px 1fr;gap:8px 14px}
.review dt{font:600 15px var(--ui);color:var(--muted)}
.review dd{margin:0;font-weight:700;overflow-wrap:anywhere}
.sendbox{background:var(--ice);border:3px dashed var(--blue);border-radius:20px;padding:20px;display:grid;gap:14px}
.sendbox .cta{gap:12px}
.ok{display:none;background:#e7f9ef;border:3px solid var(--green);border-radius:16px;padding:14px 16px;font-weight:700;color:#0b6b40}
.ok.on{display:block}

.bbar{display:none}
@media (max-width:1000px){
  .layout{grid-template-columns:1fr}
  .side{position:static}
  .bk-hero .grid{grid-template-columns:1fr}
  .bk-hero .gen{display:none}
  .bk-hero{padding-bottom:110px}
  .feats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bbar{display:flex;align-items:center;justify-content:space-between;gap:12px;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.97);border-top:3px solid var(--navy)}
  .bbar .t{font:600 13px var(--ui);color:var(--muted);line-height:1.1}
  .bbar .t b{display:block;font:700 24px var(--ui);color:var(--navy)}
  .bbar .btn{padding:13px 22px;font-size:18px;box-shadow:0 4px 0 var(--navy)}
  body{padding-bottom:84px}
}
@media (max-width:700px){
  .stepper{border-radius:28px;padding:6px;gap:4px}
  .stepper li{flex-direction:column;gap:4px;padding:8px 2px;font-size:12.5px;border-radius:20px}
  .stepper li b{width:30px;height:30px;font-size:15px}
  .row{grid-template-columns:1fr 1fr;gap:12px 10px}
  .row .nm{grid-column:1/-1}
  .tw{grid-template-columns:1fr 1fr}
  .review dl{grid-template-columns:1fr}
  .review dt{margin-top:6px}
  .card2{padding:20px 16px}
  .cat header h3{font-size:26px}
}
@media (max-width:380px){
  .stepper li span{display:none}
  .feats{grid-template-columns:1fr}
  .stp button{width:34px;height:34px}
}

/* ===== v2 booking upgrades ===== */
.bk-hero h1{text-shadow:none;filter:drop-shadow(0 4px 0 #031a46)}
.bk-hero h1 em{text-shadow:none;color:#52d6ff}
.jump{display:flex;gap:10px;margin:0 0 14px;position:sticky;top:78px;z-index:20;padding:8px 0;background:linear-gradient(var(--bg,#f4fbff) 75%,transparent)}
.jump a{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 8px;border-radius:999px;border:3px solid var(--navy);background:#fff;box-shadow:0 3px 0 var(--navy);font:600 16px var(--ui);color:var(--navy);text-decoration:none;transition:transform .15s,background .15s;white-space:nowrap}
.jump a:hover{background:var(--gold);transform:translateY(-2px)}
.jump svg{width:22px;height:22px;stroke:var(--blue2);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.legend{display:flex;flex-wrap:wrap;gap:8px 22px;margin:0 0 16px;font:500 14px var(--ui);color:var(--muted)}
.legend i{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:7px;vertical-align:-1px;border:2px solid var(--navy)}
.legend .d1{background:var(--blue)}.legend .d2{background:var(--gold)}

.cat{--t1:#082c6b;--t2:#1479f0}
.cat.t-gold{--t1:#8a5a00;--t2:#f2a900}
.cat.t-green{--t1:#0a6b40;--t2:#17b46a}
.cat header{padding:0;background:none}
.chead{all:unset;box-sizing:border-box;position:relative;display:flex;align-items:center;gap:14px;width:100%;min-height:92px;padding:14px 18px;cursor:pointer;color:#fff;overflow:hidden;background:linear-gradient(90deg,var(--t1),var(--t2))}
.chead img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.32;mix-blend-mode:luminosity;transition:transform .6s}
.chead:hover img{transform:scale(1.06)}
.chead>*{position:relative}
.chead:focus-visible{outline:4px solid var(--gold);outline-offset:-4px}
.cat header i{flex:none}
.cat.t-gold header i svg{stroke:#c78500}.cat.t-green header i svg{stroke:#0e9a58}
.cnt{margin-left:auto;display:none;padding:4px 12px;border-radius:999px;background:var(--gold);color:var(--navy);font:700 14px var(--ui);border:2px solid var(--navy)}
.cnt.on{display:inline-block;animation:pop .3s}
@keyframes pop{50%{transform:scale(1.2)}}
.chev{flex:none;width:30px;height:30px;transition:transform .3s;margin-left:6px}
.cnt:not(.on)+.chev{margin-left:auto}
.cat.shut .chev{transform:rotate(-90deg)}
.cat.shut .cbody{display:none}
.row{position:relative;grid-template-columns:auto minmax(0,1.05fr) minmax(0,1fr) minmax(0,1fr);transition:background .2s,box-shadow .2s}
.ri{width:48px;height:48px;border-radius:14px;background:var(--ice);display:grid;place-items:center;border:2px solid #cfe6f7}
.ri svg{width:28px;height:28px;stroke:var(--t2);fill:none;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.cat header+.cbody .row:first-child{border-top:0}
.row.sel{background:#f0fbf5;box-shadow:inset 6px 0 0 #17b46a}
.rt{position:absolute;right:18px;top:6px;font:700 12.5px var(--ui);color:#0b6b40;background:#d9f7e7;border-radius:999px;padding:2px 10px}
.rt:empty{display:none}
.row .nm em{font:700 18px var(--ui);color:var(--navy)}
.row .nm em span{font:500 12.5px var(--ui);color:var(--muted)}
.qty:nth-of-type(2) .lb{color:var(--blue2)}
.qty:last-child{background:#fff8e1;border-radius:14px;padding:8px 10px}
.qty:last-child .lb{color:#8a5a00}
.stp button.p{transition:transform .1s,background .2s}
.stp button.p:hover{background:var(--navy)}
.perk i.gold{background:#fff4c9}
.perk i.gold svg{stroke:#c78500}
.stars.mini{display:inline-flex;gap:1px;vertical-align:-2px}
.stars.mini i{width:13px;height:13px}
@media (max-width:1000px){.jump{top:70px}}
@media (max-width:700px){
  .jump{top:62px;gap:6px}
  .jump a{font-size:14.5px;padding:9px 4px;gap:5px}
  .jump svg{width:18px;height:18px}
  .chead{min-height:80px;padding:12px 14px}
  .row{grid-template-columns:auto 1fr;gap:12px 10px;padding:14px 14px 16px}
  .row .nm{grid-column:2}
  .ri{grid-row:1;width:44px;height:44px}
  .row .qty{grid-column:1/-1}
  .qty:last-child{padding:8px 10px}
  .rt{right:12px;top:8px}
  .stp button{width:42px;height:42px}
}
.bk-hero .fx{opacity:.4}
@media (max-width:700px){
  .ri{display:none}
  .row{grid-template-columns:1fr 1fr;gap:10px 10px;padding:14px 14px 16px}
  .row .nm{grid-column:1/-1}
  .row .qty{grid-column:auto}
  .qty .lb{font-size:13.5px}
  .qty .lb small{font-size:11.5px}
  .qty:last-child{padding:6px 8px}
  .stp{gap:6px}.stp output{min-width:20px;font-size:19px}
  .rt{top:10px}
}
@media (max-width:360px){.stp button{width:38px;height:38px}}

/* thank you */
body.thanks .bbar{display:none}
body.thanks{padding-bottom:0}
.tkcard{text-align:center;padding:34px 26px 30px;position:relative;overflow:hidden}
.tkcard h2{font-size:clamp(40px,6vw,58px);color:var(--blue2)}
.tk-art{position:relative;width:150px;margin:0 auto 6px}
.tk-art img{width:130px;margin:0 auto;display:block;animation:bobb 3.6s ease-in-out infinite}
.tk-ok{position:absolute;right:-6px;top:4px;width:56px;height:56px;border-radius:50%;background:linear-gradient(#5be39b,#17b46a);border:3px solid var(--navy);box-shadow:0 4px 0 var(--navy);display:grid;place-items:center;animation:pop .6s .2s both}
.tk-ok svg{width:34px;height:34px;stroke:#fff;fill:none;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.tk-lead{font:600 clamp(19px,2.4vw,24px)/1.35 var(--ui);color:var(--navy);max-width:560px;margin:10px auto 24px}
.tk-steps{list-style:none;margin:0 auto 22px;padding:0;display:grid;gap:12px;max-width:560px;text-align:left}
.tk-steps li{display:flex;gap:14px;align-items:center;background:var(--ice);border-radius:18px;padding:12px 16px}
.tk-steps i{flex:none;width:40px;height:40px;border-radius:50%;background:var(--gold);border:3px solid var(--navy);display:grid;place-items:center;font:800 20px var(--head);font-style:normal;color:var(--navy)}
.tk-steps b{display:block;font:600 18px var(--ui);color:var(--navy)}
.tk-steps span{color:var(--muted);font-size:15px;line-height:1.3}
.tk-fine{max-width:520px;margin:0 auto 16px}
body.thanks .stepper{opacity:.9}
