/* ==========================================================================
   FLYTE BAR — DESIGN SYSTEM v3
   Full speakeasy immersion. Near-everything runs dark and close; cream only
   surfaces as a hairline, a frame, a flash of paper — never a whole room.
   Photography is colour-graded warm and contrasty, vignetted at the edges,
   the way a room lit by filament bulbs actually looks. Type leans into big,
   tight, italic moments rather than polite editorial spacing.

   Signature element: "The Flight Mark" — three small circles from the FLYTE
   badge (a flight of three drinks / the tasting-board holes).
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&display=swap');

:root{
  --purple: #272232;
  --near-black: #17131E;
  --void: #0D0A11;
  --cream: #F4EFE7;
  --ivory: #FBF8F3;
  --stone: #C8BFB2;
  --gold: #C7A86B;
  --gold-bright: #E4C88C;
  --lilac: #A69AAF;
  --white: #FFFFFF;

  --bg: var(--void);
  --card: #221C2B;
  --card-2: #2A2333;
  --line: rgba(199,168,107,0.22);
  --line-soft: rgba(251,248,243,0.08);

  --font-display: 'Instrument Serif', Georgia, serif;
  --font-body: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;

  --content-max: 1300px;
  --edge: clamp(20px, 5vw, 64px);

  --ease: cubic-bezier(.22,.61,.36,1);
  --dur: .7s;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

body{
  margin:0; font-family:var(--font-body); background:var(--bg); color:var(--ivory);
  -webkit-font-smoothing:antialiased; line-height:1.5;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }
ul{ list-style:none; margin:0; padding:0; }
h1,h2,h3,h4,p{ margin:0; }
.wrap{ max-width:var(--content-max); margin-inline:auto; padding-inline:var(--edge); }
:focus-visible{ outline: 2px solid var(--gold-bright); outline-offset: 3px; }

/* ---- type ---- */
h1,h2,h3,.font-display{ font-family:var(--font-display); font-weight:400; letter-spacing:-0.02em; color:inherit; }
h1{ font-size:clamp(3.2rem, 8.4vw, 7.4rem); line-height:.94; }
h2{ font-size:clamp(2.2rem, 4.8vw, 4rem); line-height:1; }
h3{ font-size:clamp(1.5rem, 2.6vw, 2.1rem); line-height:1.08; }
.eyebrow{ font-family:var(--font-body); font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; font-weight:600; color:var(--gold); }
.lede{ font-size:clamp(1.05rem, 1.6vw, 1.3rem); color:var(--stone); max-width:46ch; font-weight:400; }
em, .accent-italic{ font-family:var(--font-display); font-style:italic; font-size:1.08em; color:var(--gold-bright); text-shadow:0 0 40px rgba(228,200,140,.35); }

.section-paper, .section-paper-2{ color:var(--ivory); }
.section-paper .lede, .section-paper-2 .lede{ color:var(--stone); }
.section-paper .eyebrow, .section-paper-2 .eyebrow{ color:var(--gold); }
.section-paper{ background:var(--near-black); }
.section-paper-2{ background:linear-gradient(180deg, var(--purple), var(--near-black)); }

.grain{ position:relative; isolation:isolate; }
.grain::after{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none; opacity:.08; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ==========================================================================
   PHOTOGRAPHY — warm cinematic grade + vignette on every shot
   ========================================================================== */
.shot{ position:relative; overflow:hidden; background:var(--card); }
.shot img{
  width:100%; height:100%; object-fit:cover; display:block;
  filter: saturate(1.12) contrast(1.12) brightness(.92) sepia(.08);
  transition:transform 1.1s var(--ease), filter .6s var(--ease);
}
.shot:hover img{ transform:scale(1.06); filter:saturate(1.2) contrast(1.14) brightness(.97) sepia(.06); }
.shot::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background: radial-gradient(120% 100% at 50% 30%, transparent 40%, rgba(13,10,17,.55) 100%);
}
.shot-cap{ position:absolute; left:14px; bottom:14px; z-index:2; font-size:.64rem; letter-spacing:.1em; text-transform:uppercase; font-weight:600; color:var(--stone); background:rgba(13,10,17,.6); padding:6px 10px; border-radius:100px; backdrop-filter:blur(4px); }

.ph{ position:relative; overflow:hidden; background: radial-gradient(120% 140% at 20% 0%, rgba(199,168,107,.18), transparent 60%), linear-gradient(155deg, var(--card-2), var(--void)); display:flex; align-items:flex-end; padding:18px; min-height:220px; }
.ph::before{ content:""; position:absolute; inset:0; background-image: repeating-linear-gradient(115deg, rgba(255,255,255,.04) 0 2px, transparent 2px 26px); }
.ph span{ position:relative; z-index:1; font-size:.64rem; letter-spacing:.1em; text-transform:uppercase; color:var(--lilac); font-weight:600; background:rgba(13,10,17,.6); padding:6px 10px; border-radius:100px; }

/* ==========================================================================
   FLIGHT MARK + deco frame
   ========================================================================== */
.flight-mark{ display:flex; align-items:center; gap:5px; }
.flight-mark span{ width:7px; height:7px; border-radius:50%; border:1.5px solid var(--gold); background:transparent; }
.flight-mark.filled span{ background:var(--gold); box-shadow:0 0 10px rgba(199,168,107,.6); }
.flight-divider{ display:flex; align-items:center; gap:12px; color:var(--gold); }
.flight-divider small{ font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; font-weight:600; }
.hairline{ height:1px; background:linear-gradient(90deg, var(--gold), transparent); flex:1; opacity:.5; }

.deco-frame{ position:relative; }
.deco-frame::before, .deco-frame::after{ content:""; position:absolute; width:22px; height:22px; border:1.5px solid var(--gold); opacity:.85; pointer-events:none; }
.deco-frame::before{ top:14px; left:14px; border-right:none; border-bottom:none; }
.deco-frame::after{ bottom:14px; right:14px; border-left:none; border-top:none; }

/* ==========================================================================
   ANNOUNCEMENT + NAV
   ========================================================================== */
.announce{ background:var(--void); color:var(--ivory); font-size:.8rem; text-align:center; padding:9px var(--edge); position:relative; border-bottom:1px solid var(--line-soft); letter-spacing:.01em; }
.announce .wrap{ display:flex; align-items:center; justify-content:center; gap:10px; padding-inline:0; }
.announce a{ color:var(--gold-bright); border-bottom:1px solid var(--gold); }
.announce-close{ position:absolute; right:16px; top:50%; transform:translateY(-50%); background:none; border:0; color:var(--stone); font-size:1rem; line-height:1; padding:4px; }

.site-header{ position:sticky; top:0; z-index:100; background:rgba(13,10,17,.88); backdrop-filter:blur(12px); border-bottom:1px solid var(--line-soft); }
.nav{ display:flex; align-items:center; justify-content:space-between; padding-block:12px; }
.logo{ display:flex; align-items:center; gap:10px; }
.logo img{ height:38px; width:auto; filter:drop-shadow(0 0 12px rgba(199,168,107,.25)); }
.logo-word{ font-family:var(--font-display); font-size:1.5rem; color:var(--ivory); letter-spacing:.02em; }
.nav-links{ display:flex; align-items:center; gap:32px; }
.nav-links > li > a{ color:var(--ivory); font-size:.86rem; font-weight:500; opacity:.85; position:relative; padding:6px 0; letter-spacing:.01em; }
.nav-links > li > a:hover{ opacity:1; color:var(--gold-bright); }
.nav-links > li > a::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease); }
.nav-links > li > a:hover::after{ transform:scaleX(1); }
.has-dropdown{ position:relative; padding-bottom:20px; margin-bottom:-20px; }
.dropdown{ position:absolute; top:100%; left:50%; transform:translateX(-50%) translateY(6px); background:var(--card); border:1px solid var(--line); border-radius:4px; padding:8px; min-width:220px; opacity:0; visibility:hidden; transition:opacity .3s var(--ease), transform .3s var(--ease); box-shadow:0 24px 50px rgba(0,0,0,.6); }
.has-dropdown:hover .dropdown, .has-dropdown:focus-within .dropdown{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.dropdown a{ display:block; padding:11px 14px; color:var(--ivory); font-size:.86rem; }
.dropdown a:hover{ background:rgba(199,168,107,.08); color:var(--gold-bright); }

.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; font-family:var(--font-body); font-weight:600; font-size:.82rem; letter-spacing:.03em; padding:14px 26px; border-radius:2px; border:1px solid transparent; transition: all .35s var(--ease); white-space:nowrap; background:none; appearance:none; cursor:pointer; }
.btn-primary{ background:linear-gradient(155deg,var(--gold-bright),var(--gold)); color:var(--void); box-shadow:0 8px 24px rgba(199,168,107,.18); }
.btn-primary:hover{ filter:brightness(1.1); transform:translateY(-1px); box-shadow:0 12px 30px rgba(199,168,107,.3); }
.btn-ghost-light{ border-color:rgba(199,168,107,.4); color:var(--ivory); }
.btn-ghost-light:hover{ border-color:var(--gold-bright); color:var(--gold-bright); background:rgba(199,168,107,.06); }
.btn-ghost-dark{ border-color:var(--gold); color:var(--ivory); }
.btn-ghost-dark:hover{ border-color:var(--gold-bright); background:rgba(199,168,107,.1); color:var(--gold-bright); }
.btn-dark{ background:var(--card); color:var(--ivory); border-color:var(--line); }
.btn-dark:hover{ background:var(--card-2); border-color:var(--gold); }
.btn-sm{ padding:10px 18px; font-size:.76rem; }
.btn-block{ width:100%; }

.nav-cta{ display:flex; align-items:center; gap:18px; }
.burger{ display:none; background:none; border:0; width:32px; height:22px; position:relative; }
.burger span{ position:absolute; left:0; right:0; height:2px; background:var(--gold); transition:.3s var(--ease); }
.burger span:nth-child(1){ top:0; } .burger span:nth-child(2){ top:10px; } .burger span:nth-child(3){ top:20px; }
.burger.open span:nth-child(1){ transform:translateY(10px) rotate(45deg); }
.burger.open span:nth-child(2){ opacity:0; }
.burger.open span:nth-child(3){ transform:translateY(-10px) rotate(-45deg); }

.mobile-menu{ position:fixed; inset:0; background:var(--void); z-index:99; display:flex; flex-direction:column; padding:100px var(--edge) 40px; transform:translateY(-100%); transition:transform .5s var(--ease); }
.mobile-menu.open{ transform:translateY(0); }
.mobile-menu a{ color:var(--ivory); font-family:var(--font-display); font-style:italic; font-size:2.2rem; padding:12px 0; border-bottom:1px solid var(--line-soft); }
.mobile-menu .btn{ margin-top:24px; }

.mobile-actionbar{ display:none; position:fixed; left:12px; right:12px; bottom:12px; z-index:90; background:var(--card); border:1px solid var(--line); border-radius:4px; padding:10px; box-shadow:0 16px 40px rgba(0,0,0,.6); gap:8px; }
.mobile-actionbar a{ flex:1; text-align:center; color:var(--ivory); font-size:.72rem; font-weight:600; display:flex; flex-direction:column; align-items:center; gap:4px; padding:8px 4px; }
.mobile-actionbar a.is-primary{ background:linear-gradient(155deg,var(--gold-bright),var(--gold)); color:var(--void); border-radius:2px; }

@media (max-width: 900px){
  .nav-links, .nav-cta .btn{ display:none; }
  .burger{ display:block; }
  .mobile-actionbar{ display:flex; }
  body{ padding-bottom:80px; }
}

/* ==========================================================================
   HERO — bigger, darker, tighter, more atmosphere
   ========================================================================== */
.hero{ position:relative; min-height:104svh; display:flex; align-items:flex-end; color:var(--ivory); margin-top:-1px; }
.hero .shot{ position:absolute; inset:0; }
.hero .shot img{ opacity:.7; filter:saturate(1.15) contrast(1.18) brightness(.62) sepia(.1); }
.hero .shot::after{ background:radial-gradient(140% 120% at 50% 35%, transparent 20%, rgba(13,10,17,.75) 100%); }
.hero::before{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(0deg, var(--void) 0%, rgba(13,10,17,.5) 42%, rgba(13,10,17,.1) 75%); }
.hero-inner{ position:relative; z-index:2; padding-block: 100px 72px; width:100%; }
.hero-tag{ display:flex; align-items:center; gap:14px; margin-bottom:26px; }
.hero h1{ max-width:15ch; }
.hero .lede{ color:var(--stone); margin-top:24px; font-size:clamp(1.1rem,1.8vw,1.4rem); }
.hero-ctas{ display:flex; gap:16px; margin-top:44px; flex-wrap:wrap; }

/* ==========================================================================
   SECTIONS
   ========================================================================== */
.section{ padding-block: clamp(56px, 9vw, 108px); }
.section-head{ margin-bottom:44px; max-width:640px; }
.section-head.center{ margin-inline:auto; text-align:center; }

/* ==========================================================================
   LOCATION SELECTOR
   ========================================================================== */
.loc-grid{ display:grid; grid-template-columns:1fr 1fr; gap:2px; }
.loc-card{ position:relative; overflow:hidden; min-height:600px; display:flex; flex-direction:column; justify-content:flex-end; padding:40px; color:var(--ivory); }
.loc-card .shot{ position:absolute; inset:0; }
.loc-card .shot img{ filter:saturate(1.1) contrast(1.15) brightness(.68) sepia(.08); }
.loc-card::after{ content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(13,10,17,.96) 0%, rgba(13,10,17,.05) 60%); }
.loc-card-content{ position:relative; z-index:2; }
.loc-card h3{ margin-top:10px; font-family:var(--font-display); font-style:italic; font-size:clamp(2.2rem,3.6vw,3.2rem); color:var(--gold-bright); }
.loc-card p{ color:var(--stone); margin-top:12px; max-width:38ch; }
.loc-hours{ display:flex; align-items:center; gap:8px; margin-top:18px; font-size:.8rem; color:var(--gold); opacity:0; transform:translateY(6px); transition:.4s var(--ease); }
.loc-card:hover .loc-hours{ opacity:1; transform:translateY(0); }
.loc-actions{ display:flex; gap:10px; margin-top:26px; flex-wrap:wrap; }
@media (max-width:820px){ .loc-grid{ grid-template-columns:1fr; } .loc-card{ min-height:480px; } }

/* ==========================================================================
   BRAND INTRO — editorial split, dark
   ========================================================================== */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.split .shot{ min-height:520px; }
.split .shot img{ filter:saturate(1.15) contrast(1.14) brightness(.85) sepia(.08); }
.split-copy p{ margin-top:18px; color:var(--stone); }
.split-copy .btn{ margin-top:30px; }
@media (max-width:900px){ .split{ grid-template-columns:1fr; gap:32px; } }

/* ==========================================================================
   EXPERIENCE — horizontal strip
   ========================================================================== */
.exp-strip{ display:flex; gap:2px; overflow-x:auto; padding-bottom:12px; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; }
.exp-strip::-webkit-scrollbar{ height:4px; }
.exp-strip::-webkit-scrollbar-thumb{ background:var(--line); }
.exp-card{ flex:0 0 clamp(240px, 30vw, 340px); scroll-snap-align:start; position:relative; }
.exp-card .shot{ min-height:420px; }
.exp-card .shot img{ filter:saturate(1.1) contrast(1.15) brightness(.6) sepia(.1); }
.exp-card-copy{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:24px; }
.exp-card h3{ font-family:var(--font-display); font-style:italic; font-size:1.7rem; color:var(--ivory); }
.exp-card p{ margin-top:8px; color:var(--stone); font-size:.88rem; }

/* ==========================================================================
   EVENT CARDS — dark, gold-trimmed, no more white SaaS cards
   ========================================================================== */
.filter-row{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:40px; }
.chip{ padding:10px 20px; border-radius:100px; border:1px solid var(--line); font-size:.78rem; font-weight:600; letter-spacing:.02em; color:var(--stone); background:transparent; transition:.3s var(--ease); }
.chip.active, .chip:hover{ background:var(--gold); color:var(--void); border-color:var(--gold); }

.event-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); gap:2px; background:var(--line-soft); }
.event-card{ background:var(--card); overflow:hidden; transition:transform .4s var(--ease); }
.event-card:hover{ background:var(--card-2); }
.event-card .shot{ min-height:220px; }
.event-card .shot img{ filter:saturate(1.1) contrast(1.15) brightness(.72) sepia(.08); }
.event-body{ padding:24px; }
.event-meta{ display:flex; gap:10px; font-size:.72rem; color:var(--gold); font-weight:600; text-transform:uppercase; letter-spacing:.08em; }
.event-body h3{ font-size:1.4rem; margin-top:12px; font-family:var(--font-display); font-style:italic; color:var(--ivory); }
.event-body p{ color:var(--stone); font-size:.88rem; margin-top:10px; }
.event-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:20px; }
.event-price{ font-weight:700; color:var(--ivory); }
.event-status{ font-size:.7rem; color:var(--gold); font-weight:600; }

/* ==========================================================================
   MENUS PROMO
   ========================================================================== */
.menu-promo{ position:relative; background:var(--void); border:1px solid var(--line); padding:clamp(32px,6vw,80px); }
.menu-promo::before{ content:""; position:absolute; inset:0; background:radial-gradient(60% 60% at 15% 10%, rgba(199,168,107,.12), transparent 70%); pointer-events:none; }
.menu-promo-grid{ display:grid; grid-template-columns:1fr 1fr; gap:2px; margin-top:44px; position:relative; }
.menu-promo .shot{ min-height:280px; }
.menu-promo-actions{ display:flex; gap:16px; margin-top:36px; flex-wrap:wrap; position:relative; }
@media (max-width:820px){ .menu-promo-grid{ grid-template-columns:1fr; } }

/* ==========================================================================
   PRIVATE HIRE BANNER
   ========================================================================== */
.hire-banner{ position:relative; overflow:hidden; min-height:560px; display:flex; align-items:center; }
.hire-banner .shot{ position:absolute; inset:0; }
.hire-banner .shot img{ filter:saturate(1.15) contrast(1.18) brightness(.55) sepia(.1); }
.hire-banner::after{ content:""; position:absolute; inset:0; background:linear-gradient(100deg, rgba(13,10,17,.96) 20%, rgba(13,10,17,.25) 95%); }
.hire-content{ position:relative; z-index:2; padding:clamp(32px,6vw,80px); max-width:580px; }
.hire-content p.lede{ margin-top:18px; }
.hire-actions{ display:flex; gap:16px; margin-top:34px; flex-wrap:wrap; }

/* ==========================================================================
   SOCIAL PROOF
   ========================================================================== */
.social-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:2px; }
.social-grid .shot{ min-height:220px; }
.social-grid .shot img{ filter:saturate(1.1) contrast(1.15) brightness(.72) sepia(.08); }
.testimonial{ margin-top:48px; text-align:center; }
.testimonial p{ font-family:var(--font-display); font-style:italic; font-size:clamp(1.5rem,3vw,2.2rem); color:var(--gold-bright); max-width:60ch; margin-inline:auto; line-height:1.15; }
.testimonial small{ display:block; margin-top:16px; color:var(--stone); font-weight:600; letter-spacing:.06em; font-size:.78rem; text-transform:uppercase; }
@media (max-width:900px){ .social-grid{ grid-template-columns:repeat(3,1fr); } .social-grid > *:nth-child(n+4){ display:none; } }

/* ==========================================================================
   NEWSLETTER
   ========================================================================== */
.newsletter{ background:var(--void); position:relative; overflow:hidden; }
.newsletter::before{ content:""; position:absolute; width:600px; height:600px; border-radius:50%; background:radial-gradient(circle, rgba(199,168,107,.14), transparent 70%); top:-200px; right:-100px; pointer-events:none; }
.nl-form{ margin-top:40px; display:grid; grid-template-columns:1fr 1fr; gap:14px; max-width:640px; position:relative; }
.field{ display:flex; flex-direction:column; gap:6px; }
.field label{ font-size:.72rem; color:var(--gold); font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.field input, .field select, .field textarea{ background:rgba(199,168,107,.06); border:1px solid var(--line); border-radius:2px; padding:14px; color:var(--ivory); font-family:var(--font-body); font-size:.92rem; }
.field select option{ background:var(--near-black); color:var(--ivory); }
.field input::placeholder, .field textarea::placeholder{ color:rgba(251,248,243,.35); }
.consent{ grid-column:1 / -1; display:flex; align-items:flex-start; gap:10px; font-size:.78rem; color:var(--stone); }
.consent input{ margin-top:3px; }
.nl-form .btn{ grid-column:1 / -1; }
@media (max-width:640px){ .nl-form{ grid-template-columns:1fr; } }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{ background:var(--void); color:var(--ivory); padding-block:72px 32px; border-top:1px solid var(--line-soft); }
.footer-grid{ display:grid; grid-template-columns:1.4fr repeat(4,1fr); gap:32px; }
.footer-col h4{ font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); margin-bottom:18px; }
.footer-col ul li{ margin-bottom:11px; }
.footer-col a{ color:var(--stone); font-size:.88rem; }
.footer-col a:hover{ color:var(--gold-bright); }
.footer-logo{ display:flex; align-items:center; gap:10px; }
.footer-logo img{ height:36px; width:auto; }
.footer-logo span{ font-family:var(--font-display); font-style:italic; font-size:1.8rem; color:var(--ivory); }
.footer-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:60px; padding-top:26px; border-top:1px solid var(--line-soft); font-size:.74rem; color:var(--stone); }
@media (max-width:900px){ .footer-grid{ grid-template-columns:1fr 1fr; } }

/* ==========================================================================
   BOOKING MODAL
   ========================================================================== */
.modal-overlay{ position:fixed; inset:0; background:rgba(13,10,17,.85); backdrop-filter:blur(6px); z-index:200; display:flex; align-items:center; justify-content:center; padding:20px; opacity:0; visibility:hidden; transition:.35s var(--ease); }
.modal-overlay.open{ opacity:1; visibility:visible; }
.modal{ background:var(--card); border:1px solid var(--line); padding:44px; max-width:460px; width:100%; transform:translateY(16px); transition:.4s var(--ease); }
.modal-overlay.open .modal{ transform:translateY(0); }
.modal h3{ margin-bottom:8px; font-family:var(--font-display); font-style:italic; color:var(--gold-bright); }
.modal p.lede{ margin-bottom:26px; font-size:.95rem; color:var(--stone); }
.modal-close{ float:right; background:none; border:0; font-size:1.3rem; color:var(--stone); }
.modal-options{ display:flex; flex-direction:column; gap:12px; }
.modal-option{ display:flex; align-items:center; justify-content:space-between; padding:20px 22px; border:1px solid var(--line); transition:.3s var(--ease); }
.modal-option:hover{ border-color:var(--gold-bright); background:rgba(199,168,107,.06); }
.modal-option strong{ font-family:var(--font-display); font-style:italic; font-size:1.3rem; font-weight:400; color:var(--ivory); }
.modal-option span{ font-size:.75rem; color:var(--gold); }

/* ==========================================================================
   SCROLL REVEAL
   ========================================================================== */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.in{ opacity:1; transform:translateY(0); }

/* ==========================================================================
   PAGE HERO (location / sub pages)
   ========================================================================== */
.page-hero{ position:relative; min-height:80vh; display:flex; align-items:flex-end; color:var(--ivory); margin-top:-1px; }
.page-hero .shot{ position:absolute; inset:0; }
.page-hero .shot img{ opacity:.75; filter:saturate(1.15) contrast(1.18) brightness(.58) sepia(.1); }
.page-hero::after{ content:""; position:absolute; inset:0; background:linear-gradient(0deg, var(--void) 6%, rgba(13,10,17,.3) 70%); }
.page-hero-inner{ position:relative; z-index:2; padding-block:88px 60px; width:100%; }
.breadcrumb{ font-size:.75rem; color:var(--stone); margin-bottom:20px; display:flex; gap:8px; align-items:center; }
.breadcrumb a{ color:var(--gold); }

.info-row{ display:flex; flex-wrap:wrap; gap:30px; margin-top:32px; padding-top:30px; border-top:1px solid var(--line); }
.info-item{ display:flex; flex-direction:column; gap:4px; }
.info-item .eyebrow{ color:var(--gold); }
.info-item strong{ font-size:1.05rem; font-weight:500; }

.day-parts{ display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--line-soft); }
.day-part{ background:var(--card); padding:32px; }
.day-part .flight-divider{ margin-bottom:18px; }
.day-part h3{ margin-top:12px; font-family:var(--font-display); font-style:italic; color:var(--gold-bright); }
.day-part .time{ color:var(--gold); font-weight:600; font-size:.85rem; margin-top:6px; }
.day-part p{ margin-top:14px; color:var(--stone); font-size:.92rem; }
@media (max-width:900px){ .day-parts{ grid-template-columns:1fr; } }

.two-col{ display:grid; grid-template-columns:1.1fr .9fr; gap:52px; align-items:start; }
@media (max-width:900px){ .two-col{ grid-template-columns:1fr; } }

.map-box{ min-height:340px; }

.faq-item{ border-top:1px solid var(--line); padding:24px 0; }
.faq-grid{ display:grid; grid-template-columns:1fr 1fr; gap:0 56px; }
@media (max-width:820px){ .faq-grid{ grid-template-columns:1fr; gap:0; } }
.faq-item:last-child{ border-bottom:1px solid var(--line); }
.faq-q{ display:flex; justify-content:space-between; align-items:center; cursor:pointer; font-family:var(--font-display); font-style:italic; font-size:1.2rem; color:var(--ivory); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .45s var(--ease); }
.faq-a p{ padding-top:14px; color:var(--stone); font-size:.92rem; max-width:60ch; }
.faq-item.open .faq-a{ max-height:200px; }
.faq-item.open .faq-q .plus{ transform:rotate(45deg); }
.plus{ transition:.3s var(--ease); color:var(--gold); font-size:1.4rem; }

.venue-gallery{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:180px; gap:2px; }
.venue-gallery .shot{ min-height:0; height:100%; }
.venue-gallery .shot img{ filter:saturate(1.1) contrast(1.15) brightness(.68) sepia(.08); }
.venue-gallery > *:nth-child(1){ grid-column:span 2; grid-row:span 2; }
@media (max-width:900px){ .venue-gallery{ grid-template-columns:repeat(2,1fr); } .venue-gallery > *:nth-child(1){ grid-column:span 2; } }

/* ==========================================================================
   GATEWAY — the landing page. Two venues, side by side, nothing else.
   Click a side, enter that venue's site.
   ========================================================================== */
.gateway-header{ position:absolute; top:0; left:0; right:0; z-index:20; padding:28px var(--edge); display:flex; justify-content:center; }
.gateway-header .logo img{ height:34px; }
.gateway-header .logo-word{ display:none; }

.gateway{ position:relative; display:flex; min-height:100svh; min-height:100vh; }
.gateway-panel{
  position:relative; flex:1; overflow:hidden; display:flex; align-items:flex-end;
  transition: flex .7s var(--ease);
  border-right:1px solid rgba(199,168,107,.25);
}
.gateway-panel:last-child{ border-right:none; }
.gateway:has(.gateway-panel:hover) .gateway-panel:not(:hover){ flex:.78; }
.gateway-panel:hover{ flex:1.22; }

.gateway-panel .shot{ position:absolute; inset:0; }
.gateway-panel .shot img{ filter:saturate(1.15) contrast(1.18) brightness(.5) sepia(.1); transition:transform 1.4s var(--ease), filter .5s var(--ease); }
.gateway-panel:hover .shot img{ transform:scale(1.08); filter:saturate(1.2) contrast(1.16) brightness(.62) sepia(.08); }
.gateway-panel::after{ content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(13,10,17,.96) 10%, rgba(13,10,17,.35) 60%, rgba(13,10,17,.55) 100%); }

.gateway-content{ position:relative; z-index:2; padding:56px clamp(24px,5vw,64px); width:100%; text-align:center; }
.gateway-content .eyebrow{ display:block; }
.gateway-content h2{ font-style:italic; color:var(--gold-bright); margin-top:10px; font-size:clamp(2.4rem,6vw,4.2rem); text-shadow:0 4px 40px rgba(0,0,0,.5); }
.gateway-content p{ color:var(--stone); margin-top:14px; max-width:34ch; margin-inline:auto; }
.gateway-hours{ margin-top:18px; font-size:.78rem; color:var(--gold); letter-spacing:.04em; }
.gateway-enter{
  display:inline-flex; align-items:center; gap:10px; margin-top:30px;
  font-size:.78rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--ivory);
  padding-bottom:6px; border-bottom:1px solid var(--gold); opacity:.75; transition:.3s var(--ease);
}
.gateway-panel:hover .gateway-enter{ opacity:1; color:var(--gold-bright); gap:16px; }

.gateway-seam{
  position:absolute; top:0; bottom:0; left:50%; width:1px; z-index:15; pointer-events:none;
  background:linear-gradient(180deg, transparent, rgba(199,168,107,.5) 20%, rgba(199,168,107,.5) 80%, transparent);
}
.gateway-mark{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:16; pointer-events:none;
  display:flex; flex-direction:column; align-items:center; gap:10px;
}
.gateway-mark img{ height:64px; width:auto; filter:drop-shadow(0 0 30px rgba(199,168,107,.4)); }
.gateway-mark .flight-mark{ background:var(--void); padding:4px 8px; border-radius:100px; border:1px solid var(--line); }

.gateway-footer{
  position:absolute; bottom:0; left:0; right:0; z-index:20;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px;
  padding:20px var(--edge); font-size:.72rem; color:var(--stone);
}
.gateway-footer a{ color:var(--stone); }
.gateway-footer a:hover{ color:var(--gold-bright); }
.gateway-footer .gf-links{ display:flex; gap:18px; flex-wrap:wrap; }

@media (max-width:820px){
  .gateway{ flex-direction:column; }
  .gateway-panel{ border-right:none; border-bottom:1px solid rgba(199,168,107,.25); flex:1 !important; min-height:52svh; }
  .gateway-seam{ top:50%; left:0; right:0; bottom:auto; width:auto; height:1px; background:linear-gradient(90deg, transparent, rgba(199,168,107,.5) 20%, rgba(199,168,107,.5) 80%, transparent); }
  .gateway-mark img{ height:48px; }
  .gateway-footer{ position:relative; flex-direction:column; text-align:center; padding:24px var(--edge); }
}

/* ==========================================================================
   SECONDARY PAGES — menus, private hire, gift cards, story, contact, legal
   ========================================================================== */
.mini-hero{ position:relative; min-height:52vh; display:flex; align-items:flex-end; color:var(--ivory); margin-top:-1px; }
.mini-hero .shot{ position:absolute; inset:0; }
.mini-hero .shot img{ opacity:.7; filter:saturate(1.15) contrast(1.18) brightness(.55) sepia(.1); }
.mini-hero::after{ content:""; position:absolute; inset:0; background:linear-gradient(0deg, var(--void) 10%, rgba(13,10,17,.3) 75%); }
.mini-hero-inner{ position:relative; z-index:2; padding-block:76px 48px; width:100%; }

.jump-row{ display:flex; gap:14px; flex-wrap:wrap; }

.menu-tabs{ display:flex; gap:12px; margin-bottom:8px; flex-wrap:wrap; }
.menu-accordion-toggle{
  display:flex; align-items:center; justify-content:space-between; width:100%;
  background:var(--card); border:1px solid var(--line); padding:26px 32px;
  font-family:var(--font-display); font-style:italic; font-size:1.5rem; color:var(--ivory);
  cursor:pointer; transition:.3s var(--ease); margin-bottom:2px;
}
.menu-accordion-toggle:hover{ border-color:var(--gold); color:var(--gold-bright); }
.menu-accordion-toggle .menu-accordion-icon{ font-family:var(--font-body); font-style:normal; color:var(--gold); font-size:1.4rem; transition:.3s var(--ease); }
.menu-accordion-toggle.open .menu-accordion-icon{ transform:rotate(45deg); }
.menu-accordion-content{ padding-top:40px; }
.menu-cat{ margin-top:56px; }
.menu-cat:first-child{ margin-top:0; }
.menu-cat-head{ display:flex; align-items:baseline; justify-content:space-between; gap:20px; margin-bottom:24px; }
.menu-items{ display:grid; gap:0; }
.menu-item{ display:flex; justify-content:space-between; gap:24px; padding:20px 0; border-top:1px solid var(--line); }
.menu-items .menu-item:last-child{ border-bottom:1px solid var(--line); }
.menu-item-name{ font-family:var(--font-display); font-style:italic; font-size:1.25rem; color:var(--ivory); }
.menu-item-desc{ color:var(--stone); font-size:.86rem; margin-top:6px; max-width:52ch; }
.menu-item-tags{ display:flex; gap:8px; margin-top:8px; }
.tag{ font-size:.64rem; letter-spacing:.06em; text-transform:uppercase; color:var(--gold); border:1px solid var(--line); padding:3px 8px; border-radius:100px; }
.menu-item-price{ font-family:var(--font-body); font-weight:700; color:var(--gold-bright); white-space:nowrap; }
.menu-download{ margin-top:36px; }

.venue-toggle{ display:flex; gap:2px; background:var(--line-soft); margin-bottom:56px; }
.venue-toggle a{ flex:1; text-align:center; padding:18px; background:var(--card); font-family:var(--font-display); font-style:italic; font-size:1.3rem; color:var(--stone); }
.venue-toggle a:hover{ color:var(--gold-bright); background:var(--card-2); }

.capacity-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--line-soft); margin-top:32px; }
.capacity-item{ background:var(--card); padding:26px; text-align:center; }
.capacity-item strong{ display:block; font-family:var(--font-display); font-size:2.4rem; color:var(--gold-bright); font-style:italic; }
.capacity-item span{ font-size:.76rem; color:var(--stone); text-transform:uppercase; letter-spacing:.06em; }
@media (max-width:700px){ .capacity-grid{ grid-template-columns:1fr; } }

.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:36px; }
.form-grid .field.full{ grid-column:1/-1; }
.form-grid .btn{ grid-column:1/-1; }
@media (max-width:700px){ .form-grid{ grid-template-columns:1fr; } }

.gift-tiers{ display:grid; grid-template-columns:repeat(4,1fr); gap:2px; background:var(--line-soft); margin-top:40px; }
.gift-tier{ background:var(--card); padding:32px 20px; text-align:center; transition:.3s var(--ease); cursor:pointer; border:1px solid transparent; }
.gift-tier:hover, .gift-tier.selected{ background:var(--card-2); border-color:var(--gold); }
.gift-tier strong{ display:block; font-family:var(--font-display); font-size:2rem; color:var(--gold-bright); }
@media (max-width:700px){ .gift-tiers{ grid-template-columns:repeat(2,1fr); } }

.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--line-soft); margin-top:40px; }
.step{ background:var(--card); padding:30px; }
.step .flight-mark{ margin-bottom:16px; }
.step h3{ font-size:1.3rem; }
.step p{ margin-top:10px; color:var(--stone); font-size:.9rem; }
@media (max-width:700px){ .steps{ grid-template-columns:1fr; } }

.story-block{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; margin-bottom:100px; }
.story-block:nth-child(even){ direction:rtl; }
.story-block:nth-child(even) > *{ direction:ltr; }
.story-block .shot{ min-height:440px; }
.story-block p{ margin-top:16px; color:var(--stone); }
@media (max-width:900px){ .story-block{ grid-template-columns:1fr; direction:ltr !important; } .story-block > *{ direction:ltr !important; } }

.legal-body{ max-width:74ch; }
.legal-body h2{ font-size:1.6rem; margin-top:48px; margin-bottom:16px; }
.legal-body h2:first-child{ margin-top:0; }
.legal-body p, .legal-body li{ color:var(--stone); font-size:.95rem; line-height:1.7; margin-top:12px; }
.legal-body ul{ list-style:disc; padding-left:22px; }
.legal-body a{ color:var(--gold-bright); text-decoration:underline; }
.legal-updated{ color:var(--gold); font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; margin-bottom:8px; }

.not-found{ min-height:100svh; display:flex; align-items:center; justify-content:center; text-align:center; position:relative; overflow:hidden; }
.not-found .shot{ position:absolute; inset:0; }
.not-found .shot img{ filter:saturate(1.1) contrast(1.15) brightness(.4) sepia(.1); }
.not-found::after{ content:""; position:absolute; inset:0; background:rgba(13,10,17,.7); }
.not-found-inner{ position:relative; z-index:2; padding:40px; }
.not-found-inner .eyebrow{ display:block; margin-bottom:18px; }
.not-found-inner h1{ font-style:italic; color:var(--gold-bright); }
.not-found-inner p{ margin-top:18px; color:var(--stone); max-width:44ch; margin-inline:auto; }
.not-found-inner .btn{ margin-top:34px; }

.event-detail-meta{ display:flex; flex-wrap:wrap; gap:28px; margin-top:32px; padding-top:28px; border-top:1px solid var(--line); }

/* ==========================================================================
   LIVE BOOKING WIDGET — real availability + reservation flow, wired to
   /api/availability and /api/book (which call Wix Table Reservations).
   ========================================================================== */
.booking-widget{ background:var(--card); border:1px solid var(--line); padding:32px; }
.booking-widget .field{ margin-bottom:16px; }
.booking-widget .field:last-child{ margin-bottom:0; }
.bw-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.bw-row-3{ grid-template-columns:1fr 1fr 1fr; }
@media (max-width:520px){ .bw-row-3{ grid-template-columns:1fr; } }
.bw-slots{ display:flex; flex-wrap:wrap; gap:10px; margin:18px 0 20px; }
.bw-slot-btn{
  padding:11px 18px; border:1px solid var(--line); background:transparent; color:var(--ivory);
  font-family:var(--font-body); font-size:.85rem; border-radius:2px; cursor:pointer; transition:.25s var(--ease);
}
.bw-slot-btn:hover{ border-color:var(--gold-bright); color:var(--gold-bright); }
.bw-slot-btn.selected{ background:var(--gold); border-color:var(--gold); color:var(--void); font-weight:600; }
.bw-slot-btn:disabled{ opacity:.28; cursor:not-allowed; text-decoration:line-through; }
.bw-message{ font-size:.85rem; color:var(--stone); margin-top:14px; }
.bw-message.error{ color:#e08a8a; }
.bw-back{ background:none; border:0; color:var(--gold); font-size:.78rem; margin-top:16px; cursor:pointer; padding:0; text-decoration:underline; }
.booking-step[hidden]{ display:none; }
.bw-confirm-icon{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.form-confirm.error{ color:#e08a8a !important; }

/* ==========================================================================
   FRANCHISE — "Own a FLYTE" nav CTA + dedicated page components.
   Reuses the core design system (tokens, .btn, .section, .capacity-item,
   .flight-mark, grain, reveal) wherever possible; only adds what's genuinely
   new to this page.
   ========================================================================== */
.btn-own{
  border-color:var(--gold); color:var(--gold-bright); background:none;
}
.btn-own:hover{ background:linear-gradient(155deg,var(--gold-bright),var(--gold)); color:var(--void); border-color:var(--gold); }

.fr-hero{ position:relative; min-height:78vh; display:flex; align-items:flex-end; color:var(--ivory); margin-top:-1px; }
.fr-hero .shot{ position:absolute; inset:0; }
.fr-hero .shot img{ width:100%; height:100%; object-fit:cover; object-position:center 35%; display:block; opacity:.68; filter:saturate(1.15) contrast(1.18) brightness(.5) sepia(.1); }
.fr-hero::before{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(0deg, var(--void) 5%, rgba(13,10,17,.4) 55%, rgba(13,10,17,.15) 100%); }
.fr-hero-inner{ position:relative; z-index:2; padding-block:110px 72px; width:100%; max-width:820px; }

.fr-quad{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2px; background:var(--line-soft); }
.fr-quad-card{ background:var(--card); padding:36px; }
.fr-quad-card .flight-mark{ margin-bottom:18px; }
.fr-quad-card h3{ font-size:1.4rem; }
.fr-quad-card p{ margin-top:10px; color:var(--stone); font-size:.92rem; }
@media (max-width:700px){ .fr-quad{ grid-template-columns:1fr; } }

.fr-local-flow{ display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; margin:36px 0; font-family:var(--font-display); font-style:italic; font-size:1.3rem; color:var(--gold-bright); }
.fr-local-flow .fr-arrow{ color:var(--gold); font-family:var(--font-body); font-style:normal; }

.fr-reasons{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:2px 48px; }
.fr-reason{ padding:32px 0; border-top:1px solid var(--line); display:grid; grid-template-columns:auto 1fr; gap:22px; }
.fr-reason:nth-child(1), .fr-reason:nth-child(2){ border-top:none; }
.fr-reason-num{ font-family:var(--font-display); font-style:italic; font-size:2.6rem; color:var(--gold); line-height:1; }
.fr-reason h3{ font-size:1.2rem; }
.fr-reason p{ margin-top:8px; color:var(--stone); font-size:.9rem; }
.fr-reason .fr-callout{ margin-top:12px; font-size:.78rem; letter-spacing:.04em; text-transform:uppercase; color:var(--gold-bright); font-weight:600; }
@media (max-width:820px){ .fr-reasons{ grid-template-columns:1fr; } .fr-reason:nth-child(2){ border-top:1px solid var(--line); } }

.fr-stats{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:2px; background:var(--line-soft); margin-top:40px; }
.fr-stat{ background:var(--card); padding:34px 24px; text-align:center; }
.fr-stat strong{ display:block; font-family:var(--font-display); font-style:italic; font-size:2.2rem; color:var(--gold-bright); line-height:1.1; }
.fr-stat span{ display:block; margin-top:8px; font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--stone); }
@media (max-width:900px){ .fr-stats{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); } }
@media (max-width:420px){ .fr-stats{ grid-template-columns:minmax(0,1fr); } }

.fr-disclaimer{ margin-top:20px; font-size:.74rem; color:var(--stone); opacity:.7; max-width:74ch; }

.fr-highlight{ background:var(--purple); border-left:3px solid var(--gold); padding:36px 40px; margin:32px 0; }
.fr-highlight p{ font-family:var(--font-display); font-style:italic; font-size:1.5rem; color:var(--ivory); line-height:1.3; }

.fr-journey{ display:flex; overflow-x:auto; gap:2px; background:var(--line-soft); scroll-snap-type:x mandatory; }
.fr-step{ flex:0 0 220px; scroll-snap-align:start; background:var(--card); padding:28px; }
.fr-step .fr-step-num{ font-family:var(--font-display); font-style:italic; color:var(--gold); font-size:1.6rem; }
.fr-step h4{ margin-top:10px; font-size:1.05rem; color:var(--ivory); font-weight:600; }
.fr-step p{ margin-top:8px; font-size:.84rem; color:var(--stone); }
@media (max-width:820px){ .fr-journey{ display:grid; grid-template-columns:1fr; overflow-x:visible; } .fr-step{ flex:auto; border-bottom:1px solid var(--line-soft); } }

.fr-playbook{ display:grid; grid-template-columns:.8fr 1.2fr; gap:60px; align-items:center; }
.fr-playbook-cover{
  aspect-ratio:3/4; background:linear-gradient(155deg, var(--purple), var(--void));
  border:1px solid var(--gold); border-radius:2px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:32px; position:relative; box-shadow:0 30px 60px rgba(0,0,0,.5);
}
.fr-playbook-cover::before, .fr-playbook-cover::after{ content:""; position:absolute; width:26px; height:26px; border:1.5px solid var(--gold); opacity:.7; }
.fr-playbook-cover::before{ top:20px; left:20px; border-right:none; border-bottom:none; }
.fr-playbook-cover::after{ bottom:20px; right:20px; border-left:none; border-top:none; }
.fr-playbook-cover .flight-mark{ margin-bottom:20px; }
.fr-playbook-cover h3{ font-size:1.8rem; font-style:italic; color:var(--gold-bright); line-height:1.15; }
@media (max-width:820px){ .fr-playbook{ grid-template-columns:1fr; } .fr-playbook-cover{ max-width:280px; margin-inline:auto; } }

.fr-final-cta{ position:relative; min-height:70vh; display:flex; align-items:center; justify-content:center; text-align:center; color:var(--ivory); }
.fr-final-cta .shot{ position:absolute; inset:0; }
.fr-final-cta .shot img{ filter:saturate(1.1) contrast(1.15) brightness(.42) sepia(.1); }
.fr-final-cta::after{ content:""; position:absolute; inset:0; background:rgba(13,10,17,.35); }
.fr-final-cta-inner{ position:relative; z-index:2; max-width:620px; padding:40px; }

.fr-repeat-cta{ text-align:center; padding:56px var(--edge); background:var(--purple); }

.fr-form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:36px; }
.fr-form-grid .field.full{ grid-column:1/-1; }
.fr-form-grid .btn{ grid-column:1/-1; }
@media (max-width:700px){ .fr-form-grid{ grid-template-columns:1fr; } }
