/** Shopify CDN: Minification failed

Line 83:19 Unexpected "*"

**/
/*
  ============================================
  STEP 1B: Global CSS Override — V2 "Heritage Nightfall"
  ============================================
  WHERE: Online Store > Themes > Horizon > Edit Code > Assets > bsn-override.css
         (REPLACE all contents of the existing file with this)
  THEN:  In layout/theme.liquid, the existing stylesheet_tag reference stays the same:
         {{ 'bsn-override.css' | asset_url | stylesheet_tag }}

  V2 CHANGES from V1:
  - Canvas shifted from pure black to deep teal-navy
  - Gradient section breaks for depth and warmth
  - Elizeth Light Italic accent class for script-style labels
  - Brighter interactive colors (cyan hover states)
  - Warm cream section variant for visual rhythm
  - Typography weight refinements per style guide
  - Noise texture retained, now layered over gradients
  ============================================
*/

/* -----------------------------------------------
   BRAND VARIABLES
   Bristol Sessions Nights + City of Bristol palettes
----------------------------------------------- */
:root {
  /* Primary brand colors */
  --bsn-gold: #885F27;
  --bsn-teal: #00778B;
  --bsn-cyan: #00AEC7;
  --bsn-cream: #E5E1BE;
  --bsn-light-blue: #BBE9EA;

  /* City of Bristol palette (secondary) */
  --bristol-teal: #00778B;
  --bristol-cyan: #00AEC7;
  --bristol-sage: #CAC7A7;
  --bristol-green: #67823A;
  --bristol-lime: #BABC16;

  /* Backgrounds — V2: deep teal-navy, not black */
  --bsn-bg-primary: #0B1E2B;
  --bsn-bg-secondary: #0F2A3A;
  --bsn-bg-card: #132F3F;
  --bsn-bg-warm: #E5E1BE;

  /* Text */
  --bsn-text-primary: #E5E1BE;
  --bsn-text-heading: #FFFFFF;
  --bsn-text-muted: #8FAAB8;

  /* Typography */
  --font-heading: 'elizeth', 'Playfair Display', Georgia, serif;
  --font-heading-condensed: 'elizeth-condensed', 'elizeth', Georgia, serif;
  --font-body: 'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-button: 'elizeth', 'Playfair Display', Georgia, serif;
  --font-accent: 'elizeth', Georgia, serif;

  /* Spacing */
  --section-padding: clamp(3rem, 6vw, 6rem);
  --content-max-width: 1200px;
}


/* -----------------------------------------------
   BASE OVERRIDES
   Deep teal-navy canvas, cream text, brand fonts
----------------------------------------------- */
html,
body {
  background-color: var(--bsn-bg-primary) !important;
  color: var(--bsn-text-primary) !important;
  font-family: var(--font-body) !important;
  font-size: 1.05rem;
  line-height: 1.7;
}

/* Kill any white/light backgrounds Horizon applies */
.section-template--*,
.shopify-section,
[class*="section-"] {
  background-color: var(--bsn-bg-primary) !important;
}

/* Alternating sections: gradient instead of flat swap */
.shopify-section:nth-child(even) {
  background: linear-gradient(180deg, var(--bsn-bg-secondary) 0%, var(--bsn-bg-primary) 100%) !important;
}

/* Subtle radial glow for hero-adjacent sections */
.shopify-section:first-of-type + .shopify-section {
  background: radial-gradient(ellipse at 50% 0%, rgba(0, 119, 139, 0.1) 0%, var(--bsn-bg-primary) 60%) !important;
}
/* Hero section: teal glow rising from lower center */
.shopify-section:first-of-type {
  background: radial-gradient(ellipse at 50% 80%, rgba(0, 119, 139, 0.15) 0%, var(--bsn-bg-primary) 70%) !important;
}


/* -----------------------------------------------
   TYPOGRAPHY
----------------------------------------------- */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--font-heading) !important;
  color: var(--bsn-text-heading) !important;
  letter-spacing: 0.02em;
  line-height: 1.15;
}

/* Hero headlines: Condensed Extra Bold + animated gradient text */
h1, .h1 {
  font-family: var(--font-heading-condensed) !important;
  font-weight: 800;
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  background: linear-gradient(
    90deg,
    var(--bsn-gold) 0%,
    var(--bsn-cyan) 30%,
    var(--bsn-light-blue) 60%,
    var(--bsn-cream) 80%,
    var(--bsn-gold) 100%
  );
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: bsn-gradient-shift 12s ease-in-out infinite;
}
@keyframes bsn-gradient-shift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* Section titles: Extra Bold */
h2, .h2 {
  font-size: clamp(1.8rem, 3.5vw, 3rem);
  font-weight: 800;
}

/* Subsection: Regular weight, gold */
/* Subsection and below: Elizeth Condensed Extra Bold Italic */
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
  font-family: var(--font-heading-condensed) !important;
  font-weight: 800;
  font-style: italic;
  color: var(--bsn-cream) !important;
}

h3, .h3 {
  font-size: clamp(1.3rem, 2.5vw, 2rem);
}

h4, .h4 {
  font-size: clamp(1.1rem, 2vw, 1.5rem);
}

h5, .h5 {
  font-size: clamp(1rem, 1.5vw, 1.25rem);
}

h6, .h6 {
  font-size: clamp(0.9rem, 1.2vw, 1.1rem);
}
p, li, span, a {
  font-family: var(--font-body) !important;
  color: var(--bsn-text-primary);
}

a {
  color: var(--bsn-light-blue);
  text-decoration: none;
  transition: color 0.2s ease;
}

a:hover {
  color: var(--bristol-cyan);
}


/* -----------------------------------------------
   ACCENT / SCRIPT TYPOGRAPHY
   Elizeth Light Italic for section labels
   Use class .bsn-accent-script on any element
----------------------------------------------- */
.bsn-accent-script {
  font-family: var(--font-heading-condensed) !important;
  font-weight: 800;
  font-style: italic;
  letter-spacing: 0.02em;
  color: var(--bsn-cream);
}

/* Section label style (small uppercase, light weight) */
.bsn-section-label {
  font-family: var(--font-heading) !important;
  font-weight: 300;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--bsn-text-muted);
}


/* -----------------------------------------------
   BUTTONS
   Two tiers: primary (gold) and secondary (teal)
----------------------------------------------- */
.button,
.btn,
button[type="submit"],
.shopify-challenge__button,
a.button {
  font-family: var(--font-button) !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  border-radius: 0;
  padding: 1rem 2.5rem;
  font-size: 0.9rem;
  transition: all 0.3s ease;
}

/* Primary: cream with teal text, inverts on hover */
.button,
.btn,
a.button,
button[type="submit"],
.shopify-challenge__button {
  background-color: var(--bsn-cream) !important;
  color: var(--bsn-teal) !important;
  border: 2px solid var(--bsn-cream) !important;
  font-family: var(--font-button) !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  border-radius: 0;
  padding: 1rem 2.5rem;
  font-size: 0.9rem;
  transition: all 0.3s ease;
}

.button:hover,
.btn:hover,
a.button:hover,
button[type="submit"]:hover {
  background-color: var(--bsn-teal) !important;
  color: var(--bsn-cream) !important;
  border-color: var(--bsn-teal) !important;
}

/* Secondary: teal outline, cyan hover */
.button--secondary,
.btn--secondary {
  background-color: transparent !important;
  color: var(--bsn-teal) !important;
  border: 2px solid var(--bsn-teal) !important;
}

.button--secondary:hover,
.btn--secondary:hover {
  background-color: var(--bristol-cyan) !important;
  color: var(--bsn-bg-primary) !important;
  border-color: var(--bristol-cyan) !important;
}


/* -----------------------------------------------
   HEADER / NAVIGATION
   Refined: Elizeth Light, wide tracking
----------------------------------------------- */
.header-wrapper,
header,
.section-header {
  background-color: rgba(11, 30, 43, 0.92) !important;
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(136, 95, 39, 0.25);
}

.header a,
.header__menu-item,
nav a {
  color: var(--bsn-cream) !important;
  font-family: var(--font-heading) !important;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.8rem;
}

.header a:hover,
nav a:hover {
  color: var(--bsn-gold) !important;
}


/* -----------------------------------------------
   FOOTER
----------------------------------------------- */
.footer,
footer,
.section-footer {
  background-color: var(--bsn-bg-primary) !important;
  border-top: 1px solid rgba(136, 95, 39, 0.25);
  color: var(--bsn-text-muted);
}


/* -----------------------------------------------
   TEXTURE OVERLAY
   Film grain over the gradients. This is what
   makes "heritage nightfall" feel handcrafted.
----------------------------------------------- */
body::after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 9999;
  opacity: 0.025;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
}


/* -----------------------------------------------
   FORM INPUTS
----------------------------------------------- */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
textarea,
select {
  background-color: var(--bsn-bg-card) !important;
  border: 1px solid rgba(136, 95, 39, 0.3) !important;
  color: var(--bsn-cream) !important;
  border-radius: 0;
  padding: 0.8rem 1rem;
  font-family: var(--font-body) !important;
}

input::placeholder,
textarea::placeholder {
  color: var(--bsn-text-muted) !important;
}

input:focus,
textarea:focus {
  border-color: var(--bristol-cyan) !important;
  outline: none;
  box-shadow: 0 0 0 2px rgba(0, 174, 199, 0.2);
}

/* Fix email signup form */
.footer__newsletter .newsletter-form__button,
.newsletter-form__button,
form[class*="newsletter"] button {
  background-color: var(--bsn-gold) !important;
  color: var(--bsn-bg-primary) !important;
  border-radius: 0 999px 999px 0 !important;
  border: none !important;
}

.footer__newsletter input[type="email"],
.newsletter-form__field-wrapper input,
form[class*="newsletter"] input {
  border-radius: 999px 0 0 999px !important;
  background-color: var(--bsn-bg-card) !important;
  border: 1px solid rgba(136, 95, 39, 0.3) !important;
  color: var(--bsn-cream) !important;
}

/* -----------------------------------------------
   WARM SECTION VARIANT
   Use class .bsn-section--warm on any section
   for cream/sand background with dark text.
   Add via Custom Liquid block or section class.
----------------------------------------------- */
.bsn-section--warm,
.bsn-section--warm.shopify-section {
  background: var(--bsn-bg-warm) !important;
  color: var(--bsn-bg-primary) !important;
}

.bsn-section--warm h1,
.bsn-section--warm h2,
.bsn-section--warm h3 {
  color: var(--bsn-teal) !important;
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: var(--bsn-teal) !important;
  animation: none !important;
}

.bsn-section--warm p,
.bsn-section--warm li,
.bsn-section--warm span {
  color: var(--bsn-bg-primary) !important;
}

.bsn-section--warm a {
  color: var(--bsn-gold);
}

.bsn-section--warm a:hover {
  color: var(--bsn-teal);
}

.bsn-section--warm .bsn-divider {
  background: var(--bsn-gold);
}


/* -----------------------------------------------
   UTILITY CLASSES
----------------------------------------------- */
.bsn-accent-gold { color: var(--bsn-gold); }
.bsn-accent-teal { color: var(--bsn-teal); }
.bsn-accent-cyan { color: var(--bristol-cyan); }
.bsn-accent-cream { color: var(--bsn-cream); }
.bsn-bg-card { background-color: var(--bsn-bg-card); }
.bsn-section-padding { padding: var(--section-padding) 0; }
.bsn-max-width { max-width: var(--content-max-width); margin: 0 auto; padding: 0 1.5rem; }
.bsn-text-center { text-align: center; }
.bsn-uppercase { text-transform: uppercase; letter-spacing: 0.1em; }
.bsn-divider {
  width: 60px;
  height: 2px;
  background: var(--bsn-gold);
  margin: 1.5rem auto;
}

/* Gold gradient glow — use behind key headings or CTAs */
.bsn-glow {
  background: radial-gradient(ellipse at center, rgba(136, 95, 39, 0.12) 0%, transparent 70%);
  padding: 3rem 0;
}

/* Teal gradient glow — use for section transitions */
.bsn-glow-teal {
  background: radial-gradient(ellipse at center bottom, rgba(0, 119, 139, 0.1) 0%, transparent 60%);
}


/* -----------------------------------------------
   RESPONSIVE
----------------------------------------------- */
@media (max-width: 768px) {
  html, body {
    font-size: 1rem;
  }

  h1, .h1 {
    font-size: 2rem;
  }

  .button, .btn, a.button {
    padding: 0.8rem 1.5rem;
    font-size: 0.8rem;
    width: 100%;
    text-align: center;
  }
}
/* Brighter interactive states — cyan for all hover/focus/active */
.button:focus-visible,
.btn:focus-visible,
a:focus-visible {
  outline: 2px solid var(--bristol-cyan);
  outline-offset: 2px;
}

/* Ticket availability indicator — lime pulse */
.bsn-status-available {
  display: inline-block;
  width: 8px;
  height: 8px;
  background: var(--bristol-lime);
  border-radius: 50%;
  animation: bsn-pulse 2s ease-in-out infinite;
}

@keyframes bsn-pulse {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(186, 188, 22, 0.4); }
  50% { opacity: 0.8; box-shadow: 0 0 0 6px rgba(186, 188, 22, 0); }
}
/* Force body text size across all custom BSN sections */
.bsn-timeline p,
.bsn-timeline li,
.bsn-timeline span,
.bsn-timeline .bsn-carousel__desc,
.bsn-tickets p,
.bsn-tickets li,
.bsn-tickets span,
.bsn-tickets .bsn-ticket__desc,
.bsn-partners p,
.bsn-partners li,
.bsn-partners span,
[class*="bsn-"] p,
[class*="bsn-"] li,
[class*="bsn-"] span:not(.bsn-status-available) {
  font-size: 1.125rem !important;
  line-height: 1.7 !important;
  font-family: var(--font-body) !important;
}

/* =========================================================================
   BSN BODY COPY ALIGNMENT — REVISED 2026-05-21
   The previous version overrode Horizon's native per-block Alignment
   setting on Description/Text/Rich text blocks. This version only
   force-lefts BSN's own custom sections and an opt-in `.bsn-body` class.
   Horizon's built-in blocks now respect the Alignment toggle in the editor.
   To revert, delete everything between START / END markers.
   ========================================================================= */

/* BSN custom sections only — body copy and lists stay left-aligned */
.bsn-section p,
.bsn-section li,
.bsn-section .bsn-body,
.bsn-section .bsn-rte p,
.bsn-section .bsn-rte li,
.bsn-timeline p:not(.bsn-timeline__subheading),
.bsn-tickets__card p,
.bsn-partners__card p,
.bsn-partners p {
  text-align: left;
}

/* Opt-in class for forcing left-alignment on long-form copy
   inside a Horizon native block. Apply via the block's
   "Custom CSS class" field, or wrap copy in <div class="bsn-body">. */
.bsn-body,
.bsn-body p,
.bsn-body li {
  text-align: left;
}

/* Comfortable reading measure (62 chars) for true body prose */
.bsn-section .bsn-body,
.bsn-section .bsn-rte p,
.bsn-tickets__card p,
.bsn-partners__card p,
.bsn-body p {
  max-width: 62ch;
  margin-left: auto;
  margin-right: auto;
}
/* === END BSN BODY COPY ALIGNMENT === */