/* Parking Zeus public booking visual refresh — 2026-08-20 */
:root{
  --pz-gold:#ffb52e;
  --pz-gold-soft:#ffd27a;
  --pz-navy:#071126;
  --pz-panel:#101d38;
  --pz-panel-2:#152542;
  --pz-line:rgba(143,170,192,.2);
}

body{
  background:
    radial-gradient(circle at 50% -8%,rgba(245,166,35,.13),transparent 28rem),
    linear-gradient(180deg,#071126 0%,#0d1428 38rem,#081123 100%);
}

nav{
  min-height:72px;
  padding:.75rem clamp(1rem,4vw,2rem);
  background:rgba(5,12,28,.92);
  border-color:rgba(245,166,35,.22);
  box-shadow:0 12px 34px rgba(0,0,0,.28);
}

.nav-tab{
  min-height:42px;
  padding:9px 17px;
  border-color:rgba(245,166,35,.4);
  color:#fff;
}

#page-booking{
  width:min(100%,1080px);
  margin:0 auto;
  padding-bottom:1px;
}

.hero{
  position:relative;
  min-height:430px;
  margin:20px 18px 0;
  padding:clamp(3.5rem,9vw,6rem) 1.25rem 3rem;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  overflow:hidden;
  border:1px solid rgba(245,166,35,.25);
  border-radius:24px 24px 0 0;
  background-size:cover!important;
  background-position:center!important;
  box-shadow:0 28px 70px rgba(0,0,0,.35);
}

.hero::after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:4px;
  background:linear-gradient(90deg,transparent,var(--pz-gold),transparent);
}

.hero .badges{gap:9px;margin-bottom:0}
.hero .badge{
  background:rgba(7,17,38,.78);
  border-color:rgba(255,255,255,.17);
  color:#dce9f5;
  backdrop-filter:blur(10px);
}
.hero .badge.live{border-color:rgba(34,197,94,.55);color:#5ee38b}

.stats{
  margin:0 18px;
  border:1px solid var(--pz-line);
  border-top:0;
  border-radius:0 0 18px 18px;
  overflow:hidden;
  background:rgba(21,37,66,.92);
}
.stat{padding:1.15rem .75rem;background:rgba(16,29,56,.92)}
.stat-v{font-size:26px;color:var(--pz-gold)}
.stat-l{font-size:11px;color:#a9bfd3}

.visual-assurance{
  margin:16px 18px 0;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
}
.visual-assurance article{
  min-width:0;
  padding:14px 10px;
  border:1px solid var(--pz-line);
  border-radius:13px;
  background:linear-gradient(145deg,rgba(21,37,66,.92),rgba(10,22,44,.92));
  text-align:center;
}
.visual-assurance strong{display:block;color:#fff;font-size:12px;line-height:1.25}
.visual-assurance span{display:block;margin-top:4px;color:#8faac0;font-size:10px;line-height:1.35}
.visual-assurance .assurance-icon{font-size:20px;margin-bottom:6px}

.booking-intro{
  margin:16px 18px;
  padding:clamp(22px,5vw,34px);
  border:1px solid rgba(245,166,35,.28);
  border-radius:18px;
  background:
    radial-gradient(circle at 90% 0%,rgba(245,166,35,.13),transparent 13rem),
    linear-gradient(145deg,#132442,#0b1730);
}
.booking-intro small{color:var(--pz-gold);font-size:11px;font-weight:700;letter-spacing:2px}
.booking-intro h2{margin:8px 0 7px;font-family:'Oswald',sans-serif;font-size:clamp(27px,6vw,40px);line-height:1.08}
.booking-intro p{max-width:620px;margin:0 0 18px;color:#a9bfd3;font-size:14px;line-height:1.6}
.booking-intro a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:11px 17px;
  border-radius:10px;
  background:var(--pz-gold);
  color:#111c35;
  font-family:'Oswald',sans-serif;
  font-weight:700;
  letter-spacing:1px;
  text-decoration:none;
  box-shadow:0 10px 24px rgba(245,166,35,.2);
}

.sec{
  margin:14px 18px;
  padding:clamp(18px,4vw,26px)!important;
  border:1px solid var(--pz-line);
  border-radius:18px;
  background:linear-gradient(155deg,rgba(21,37,66,.96),rgba(10,22,44,.96));
  box-shadow:0 18px 38px rgba(0,0,0,.18);
}
.sec-label{margin-bottom:1.15rem;color:#dce9f5;font-size:12px;letter-spacing:2.5px}

.spots-grid{gap:10px}
.spot{
  min-height:68px;
  border-radius:12px;
  border-width:1px;
  font-size:20px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.spot.free{
  background:linear-gradient(155deg,#0e3e24,#092a19);
  border-color:#34d876;
  color:#68ed9b;
}
.spot.taken{background:linear-gradient(155deg,#461419,#290c10);border-color:#ef5d66;color:#ff7a82}
.spot.blocked{background:#0b1220;border-color:#2d3a50;color:#566a84}
.spot.selected{background:linear-gradient(155deg,#47320d,#241b09);border-color:var(--pz-gold);color:var(--pz-gold)}
.spot-hint{margin-top:11px;color:#9db2c8;font-size:13px}

input,select{
  min-height:50px;
  border-color:rgba(143,170,192,.28);
  border-radius:10px;
  background:#0a162d;
}
input:focus,select:focus{
  border-color:var(--pz-gold);
  box-shadow:0 0 0 3px rgba(245,166,35,.13);
}
.ff label{color:#b8cada}
.checkout-info{border-color:rgba(34,197,94,.45);background:rgba(5,46,22,.38)}
.price-box{padding:18px;border-color:rgba(245,166,35,.24);background:linear-gradient(145deg,#14233e,#0b172e)}
.price-m{font-size:42px;color:var(--pz-gold)}
.cta,.mobile-book-btn{
  min-height:54px;
  background:linear-gradient(135deg,#ffc14c,#f5a623);
  color:#111c35;
  border-radius:11px;
  box-shadow:0 12px 26px rgba(245,166,35,.2);
}

.how{margin-top:24px;background:transparent;border-top-color:var(--pz-line);border-bottom-color:var(--pz-line)}
.step{margin:0 18px;padding:1.15rem;border-color:var(--pz-line);background:rgba(16,29,56,.55)}
footer{margin-top:24px;background:#071126;border-color:var(--pz-line)}

@media (max-width:700px){
  nav{min-height:62px;padding:.55rem .8rem}
  .hero{min-height:360px;margin:10px 10px 0;padding:3rem .9rem 2.25rem;border-radius:18px 18px 0 0}
  .stats{margin:0 10px;border-radius:0 0 15px 15px}
  .stat{padding:.95rem .45rem}.stat-v{font-size:22px}.stat-l{font-size:9px}
  .visual-assurance{grid-template-columns:1fr 1fr;margin:12px 10px 0;gap:7px}
  .visual-assurance article{padding:12px 8px}
  .booking-intro{margin:12px 10px;padding:22px 18px}
  .booking-intro a{width:100%}
  .sec{margin:10px;padding:18px 14px!important;border-radius:15px}
  .spots-grid{gap:9px}
  .spot{min-height:66px}
  .step{margin:0 10px}
}