/* logo */
.brand-logo{display:block;height:60px;width:auto}

@media(max-width:650px){.brand-logo{height:50px}}

/* hero headline: slower, one line after the other */
.title-line{animation-duration:1.1s}
.title-one{animation-delay:.1s}
.title-two{animation-delay:.35s}
.title-three{animation-delay:.6s}

/* scroll reveal for the smaller pieces inside each section (added by home-motion.js).
   uses the standalone translate property so it never fights existing transforms */
.mx{opacity:0;translate:0 48px;transition:opacity .9s cubic-bezier(.22,1,.36,1),translate 1s cubic-bezier(.22,1,.36,1)}
.mx-l{translate:-60px 0}
.mx-r{translate:60px 0}
@media(max-width:800px){.mx-l,.mx-r{translate:0 44px}}
body{overflow-x:clip}
.mx.mx-in{opacity:1;translate:0 0}
@media(prefers-reduced-motion:reduce){.mx{opacity:1;translate:none;transition:none}}

/* layout fixes after trimming the homepage */
.story-step{grid-template-columns:30px 1fr}
@media(max-width:700px){.story-step{grid-template-columns:25px 1fr}}
.package-left{align-self:center}
.level-line{margin:20px 0 0}
.photo-tile figcaption{justify-content:flex-start}
.package-foot{justify-content:flex-start}
.hero-bottom{gap:0}
.package-room-head p{margin-right:134px}
@media(max-width:1000px){.package-room-head p{margin-right:0}}

/* shared contact form on the homepage */
.bp-contact label{font-size:14px;font-weight:600;letter-spacing:0;color:#b3b6ad}
.bp-contact input,.bp-contact textarea{font-size:16px}
.bp-contact textarea{min-height:150px;resize:vertical}
.bp-contact .form-submit:disabled{opacity:.6;cursor:wait}
.bp-status.ok{color:#7fe3a1}
.bp-status.err{color:#ff6b78}
.bp-book-online{display:inline-flex;align-items:center;gap:10px;margin-top:22px;min-height:50px;padding:0 22px;background:var(--signal-red);color:#11130f;font:700 15px/1 var(--body);transition:transform .5s cubic-bezier(.22,1,.36,1),background .3s}
.bp-book-online:hover{transform:translateY(-3px);background:#fff}
@media(max-width:700px){.bp-book-online{width:100%;justify-content:center}}

/* no red-dot labels or small eyebrow text above headings (safety net) */
.section-label,.hero-kicker,.eyebrow{display:none!important}

/* google map inside the homepage location ticket */
.ticket-map{margin:18px 0 0;overflow:hidden;line-height:0;background:#0d0f0e;border:1px solid #ffffff22}
.ticket-map iframe{display:block;width:100%;height:230px;border:0}
.city-ticket{min-height:0}
@media(max-width:700px){.ticket-map iframe{height:200px}}



/* ================= Final polish pass (homepage) ================= */

/* 1. headings: smaller so they fit the screen, taller line box so g / p / y are not cut */
.hero-title{font-size:clamp(50px,6.4vw,92px)!important;line-height:.95!important;letter-spacing:-.02em!important}
.title-line{padding-bottom:.08em}
.section-title{font-size:clamp(36px,4.4vw,60px)!important;line-height:1.02!important;letter-spacing:-.015em!important}
.city-copy .section-title,.faq-intro .section-title,.booking-copy .section-title,.photo-roll-head .section-title{font-size:clamp(38px,4.8vw,64px)!important}
.ticket-city{font-size:clamp(38px,4.6vw,58px)!important;line-height:1!important}
.photo-roll-end>span{font-size:clamp(38px,4.6vw,58px)!important}
.last-call h2{font-size:clamp(38px,5.2vw,70px)!important;line-height:1!important}
.footer-big-link{font-size:clamp(26px,3.3vw,44px)!important;line-height:1.05!important}
.selected-package h3{font-size:clamp(26px,3vw,40px)!important;line-height:1.05!important}
@media(max-width:1050px){.hero-title{font-size:clamp(50px,8vw,80px)!important}}
@media(max-width:760px){
  .hero-title{font-size:clamp(42px,12.5vw,66px)!important;line-height:.98!important}
  .section-title,.city-copy .section-title,.faq-intro .section-title,.booking-copy .section-title,.photo-roll-head .section-title{font-size:clamp(34px,10vw,48px)!important}
  .ticket-city,.photo-roll-end>span{font-size:clamp(36px,10.5vw,50px)!important}
  .last-call h2{font-size:clamp(36px,10.5vw,54px)!important}
  .footer-big-link{font-size:clamp(26px,7.6vw,38px)!important}
  .selected-package h3{font-size:clamp(24px,6.4vw,32px)!important}
}
@media(max-width:390px){.hero-title{font-size:clamp(38px,11.8vw,48px)!important}.ticket-city{font-size:38px!important}.last-call h2{font-size:36px!important}}

/* the hero lines used a clip-path that sliced the bottom of letters like g; fade + rise instead */
@keyframes title-arrive{0%{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
.title-line{animation-duration:1.4s!important}
.title-one{animation-delay:.1s!important}
.title-two{animation-delay:.4s!important}
.title-three{animation-delay:.7s!important}

/* 2. fewer divider lines */
.bottom-rule{display:none}
.story-steps,.faq-stack,.package-specs{border-top:0!important}
.package-specs{border-bottom:0!important}
.footer-top,.footer-pages,.last-call,.safety-signal{border-top:0!important;border-bottom:0!important}
.booking-form-heading{border-bottom:0!important;padding-bottom:0!important}

/* 3. rounded buttons (form fields stay as they are) */
.hero-book,.package-cta,.ticket-book,.smash-button,.nav-cta,.bp-book-online,.poster-bottom a,
.city-tab,.package-arrows button,.mobile-book-ribbon,.form-submit,.menu-button,.inline-arrow{border-radius:14px}
.cta-arrow{border-radius:10px}
.hero-book,.package-cta,.ticket-book,.nav-cta,.bp-book-online,.poster-bottom a{overflow:hidden}

/* 4. a touch slower and softer */
.mx{transition:opacity 1.2s cubic-bezier(.22,1,.36,1),translate 1.4s cubic-bezier(.22,1,.36,1)}


/* ================= Universal buttons + performance (homepage) ================= */
:root{--signal-red:#e51c2c}

/* one style for every button: red, white text, rounded (packages card itself stays square) */
.nav-cta,.hero-book,.package-cta,.ticket-book,.form-submit,.bp-book-online,.poster-bottom a,
.smash-button,.city-tab,.package-arrows button,.mobile-book-ribbon,.lightbox-arrow,.lightbox-close{
  background:#e51c2c!important;border:1px solid #e51c2c!important;color:#fff!important;border-radius:14px}
.nav-cta:hover,.hero-book:hover,.package-cta:hover,.ticket-book:hover,.form-submit:hover,.bp-book-online:hover,
.poster-bottom a:hover,.smash-button:hover,.city-tab:hover,.package-arrows button:hover,.mobile-book-ribbon:hover{
  background:#ff3041!important;border-color:#ff3041!important;color:#fff!important}
.smash-pulse{display:none}
.smash-button.is-smashing{background:#ff3041!important;color:#fff!important}
.city-tab span,.city-tab-active span{color:#fff!important}
.city-tab-active{box-shadow:inset 0 0 0 2px #fff}
.cta-arrow{background:rgba(255,255,255,.22);color:#fff}
.bp-book-online{color:#fff}
.nav-cta:active,.hero-book:active,.package-cta:active,.ticket-book:active,.form-submit:active,.smash-button:active,
.city-tab:active,.package-arrows button:active{transform:scale(.97)}

/* packages section heading */
.package-room-head{margin-bottom:28px}
.package-room-head .section-title{margin:0;color:var(--ink);max-width:22ch;text-wrap:balance}
.package-room-head .section-title em{color:#e51c2c;font-style:normal}

/* smoother: compositor-friendly reveal, easing out */
.mx{transition:opacity 1.3s cubic-bezier(.16,1,.3,1),translate 1.6s cubic-bezier(.16,1,.3,1);will-change:opacity,translate}

/* ================= Final tidy ================= */
/* story steps: no divider lines, no layout shift on hover (padding no longer animates) */
.story-steps{border:0}
.story-step{border:0!important;padding:14px 12px!important;border-radius:12px;transition:background .25s}
.story-step:hover,.story-step-active{padding-left:12px!important;background:rgba(255,255,255,.06)}
.story-step+.story-step{margin-top:4px}
/* safety band arrow is a button */
.safety-signal>a{background:#e51c2c!important;border:1px solid #e51c2c!important;color:#fff!important;border-radius:12px}
.safety-signal>a:hover{background:#ff3041!important;border-color:#ff3041!important;color:#fff!important}
.signal-icon{border-radius:12px}
/* gallery heading lines up with the photos below it */
.photo-roll-head{max-width:none}
/* packages heading a little smaller */
.package-room-head .section-title.package-title{font-size:clamp(30px,3.6vw,50px)!important}
@media(max-width:760px){.package-room-head .section-title.package-title{font-size:clamp(28px,8.4vw,38px)!important}}
/* ticket: fewer dashed dividers */
.ticket-hours{border-top:0!important;border-bottom:0!important}

/* hero button text never wraps; menu buttons match the rest */
.hero-book{width:auto;min-width:176px;white-space:nowrap}
.menu-button{background:#e51c2c!important;border-color:#e51c2c!important;color:#fff!important;border-radius:12px}

/* "Quick" in the FAQ heading was dark-on-dark and invisible */
.faq-intro .section-title{color:var(--ink)!important}

/* labels on red: white text for clear reading */
.scene-tape,.ticker-runner span,.story-photo-label,.selected-package-image>b{color:#fff!important}
.ticker-runner span{font-weight:700}
.hero-bottom>span:first-child{color:#ff5a66}
.level-point span{color:#e8eae1!important}


/* ================= Motion + performance (homepage) ================= */
h1,h2,h3,h4,.hero-title,.section-title{font-family:var(--display);font-weight:800}
p,li{font-weight:400}
.hero-title{line-height:1.02!important;letter-spacing:-.015em!important}
.section-title{line-height:1.08!important;letter-spacing:-.01em!important}
@keyframes title-arrive{0%{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
.title-line{animation-duration:1s!important;animation-timing-function:cubic-bezier(.16,1,.3,1)!important}
.title-one{animation-delay:.05s!important}.title-two{animation-delay:.2s!important}.title-three{animation-delay:.35s!important}
.mx{translate:0 36px;transition:opacity 1s cubic-bezier(.16,1,.3,1),translate 1s cubic-bezier(.16,1,.3,1)!important}
.mx-l{translate:-48px 0}.mx-r{translate:48px 0}
@media(max-width:800px){.mx,.mx-l,.mx-r{translate:0 28px}}
.mx.mx-in{translate:0 0}


/* ================= Manrope + 1.4s motion (homepage) ================= */
:root{--ease-out:cubic-bezier(.16,1,.3,1)}
body{font-weight:400;letter-spacing:0}
h1,h2,h3,h4,.hero-title,.section-title{font-weight:800}
.hero-title{font-size:clamp(42px,5.5vw,80px)!important;line-height:1.05!important;letter-spacing:-.03em!important}
.section-title{font-size:clamp(30px,3.7vw,52px)!important;line-height:1.1!important;letter-spacing:-.025em!important}
.city-copy .section-title,.faq-intro .section-title,.booking-copy .section-title,.photo-roll-head .section-title{font-size:clamp(32px,4.1vw,56px)!important}
.last-call h2{font-size:clamp(32px,4.5vw,60px)!important;line-height:1.08!important}
.photo-roll-end>span{font-size:clamp(32px,3.9vw,50px)!important;line-height:1.1!important}
.footer-big-link{font-size:clamp(23px,2.8vw,38px)!important}
.selected-package h3{font-size:clamp(23px,2.6vw,34px)!important;line-height:1.12!important}
.package-room-head .section-title.package-title{font-size:clamp(26px,3.1vw,43px)!important}
@media(max-width:1050px){.hero-title{font-size:clamp(42px,7vw,70px)!important}}
@media(max-width:760px){
  .hero-title{font-size:clamp(34px,10.4vw,54px)!important;line-height:1.06!important}
  .section-title,.city-copy .section-title,.faq-intro .section-title,.booking-copy .section-title,.photo-roll-head .section-title{font-size:clamp(29px,8.6vw,41px)!important}
  .last-call h2{font-size:clamp(30px,9vw,46px)!important}
  .photo-roll-end>span{font-size:clamp(30px,9vw,42px)!important}
  .footer-big-link{font-size:clamp(23px,6.5vw,33px)!important}
  .selected-package h3{font-size:clamp(22px,5.8vw,29px)!important}
  .package-room-head .section-title.package-title{font-size:clamp(24px,7.2vw,33px)!important}
}
@media(max-width:390px){.hero-title{font-size:clamp(32px,10vw,40px)!important}}

/* every animation on the homepage: 1.4 seconds, ease-out, opacity + transform only */
.title-line{animation-duration:1.4s!important;animation-timing-function:var(--ease-out)!important}
.title-one{animation-delay:.05s!important}.title-two{animation-delay:.25s!important}.title-three{animation-delay:.45s!important}
.mx{translate:0 40px;transition:opacity 1.4s var(--ease-out),translate 1.4s var(--ease-out)!important;will-change:opacity,translate}
.mx-l{translate:-52px 0}.mx-r{translate:52px 0}
@media(max-width:800px){.mx,.mx-l,.mx-r{translate:0 30px}}
.mx.mx-in{translate:0 0}

/* locations: Lahore and Karachi side by side (same idea as Book Now), no buttons to switch */
.city-section{padding:clamp(56px,7vw,96px) var(--gutter)}
.city-layout{display:block;max-width:1240px;margin:0 auto}
.city-copy{max-width:640px;margin-bottom:clamp(26px,3.4vw,40px)}
.city-tickets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:stretch}
.city-ticket{display:flex;flex-direction:column;min-height:0;padding:26px;clip-path:none;border-radius:18px;
  background:#171a18;border:1px solid rgba(255,255,255,.1);box-shadow:none;color:var(--ink)}
.ticket-perf{display:none}
.ticket-city{margin:0 0 14px!important;font-size:clamp(28px,2.8vw,38px)!important;line-height:1.1!important;letter-spacing:-.02em}
.ticket-address{color:#c6c9c0;font-size:14px;line-height:1.45}
.ticket-map{margin-top:18px;border-radius:12px;flex:1 1 auto}
.ticket-map iframe{height:230px}
.ticket-hours{border:0!important;padding:16px 0 4px;font-size:14px!important}
.ticket-bottom{flex-wrap:wrap;align-items:center!important;flex-direction:row!important;gap:12px 16px}
.ticket-bottom>a:first-child{color:var(--ink);font-weight:700}
.ticket-book{align-self:auto!important}
@media(max-width:800px){.city-tickets{grid-template-columns:1fr}.city-ticket{padding:20px}.ticket-map iframe{height:210px}}