/**
Theme Name: Django Bates 
Author: Nick White
Author URI: https://nickwhite.uk/
Description: Custom theme for Django Bates built using Astra
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: django-bates
Template: astra
*/

/* ─── Typography ─────────────────────────────────────────── */
h1 {
  letter-spacing: 0.2em;
}
h2 {
  letter-spacing: 0.15em;
}
h3,
h4,
h5,
h6 {
  letter-spacing: 0.05em;
}

/* ─── Hide above-header bar ──────────────────────────────── */
.ast-above-header-bar {
  display: none;
}

/* ─── Admin bar: hide while building ────────────────────── */
#wpadminbar {
  display: none !important;
}
html {
  margin-top: 0 !important;
}

/* ─── Fix overflow blocking sticky on homepage ───────────── */
body.home {
  overflow-x: visible !important;
  overflow-y: visible !important;
}

/* ─── Kill wrapper gaps on homepage ─────────────────────── */
.home .site-content,
.home #content,
.home .ast-container,
.home .ast-plain-container,
.home .entry-content,
.home article.page {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* ─── Fix sticky context on homepage ────────────────────── */
.home#page,
.home .hfeed.site,
body.home #page {
  display: block !important;
}

/* ─── Dark sticky header on interior pages ──────────────── */
.page-id-398 .site-header,
.page-id-398 #masthead {
  position: sticky;
  top: 0;
  z-index: 100;
  background: #1a1a1a;
}

/* ─── Hero cover: sticky so bio slides over it ───────────── */
.home .hero-cover {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* ─── Bio section: slides over hero on scroll ────────────── */
.home .bio-section {
  position: relative;
  z-index: 2;
  background: #ffffff;
  padding: 80px 60px;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  width: 100vw;
  max-width: 100vw;
}

/* ─── Bio typography ─────────────────────────────────────── */
.bio-section h1 {
  font-size: clamp(2rem, 4vw, 3.5rem);
  color: #111111;
  margin-bottom: 0.15em;
}

.bio-section .bio-dateline {
  font-size: 0.85rem;
  letter-spacing: 0.15em;
  color: #666666;
  text-transform: uppercase;
  margin-bottom: 2.5em;
  display: block;
}

.bio-section p {
  color: #1a1a1a;
  line-height: 1.85;
  margin-bottom: 1.4em;
}

/* ─── Bio image ──────────────────────────────────────────── */
.bio-section .wp-block-column:last-child img {
  width: 100%;
  height: auto;
  display: block;
}

/* ─── Bio image: old photo treatment ─────────────────────── */
.bio-image-col img {
  border: 8px solid #f0ece4;
  background: #f0ece4;
  box-shadow: 3px 4px 14px rgba(0, 0, 0, 0.18);
  transform: rotate(2deg);
  display: block;
  width: 100%;
  height: auto;
}

.bio-image-col {
  overflow: visible !important;
  padding: 4em 3em 2em 4em;
}

/* ─── Mobile ─────────────────────────────────────────────── */
@media (max-width: 768px) {
  .home .hero-cover {
    background-image: url("/wp-content/uploads/djangobates-hero-mobile.webp") !important;
  }

  .home .bio-section {
    padding: 50px 24px;
  }

  .bio-section .wp-block-columns {
    flex-direction: column;
  }

  .bio-section .wp-block-column:last-child {
    margin-top: 0;
    padding-top: 0;
  }

  .bio-image-col {
    overflow: visible !important;
    padding: 0 2em;
  }
}

/* ─── Forthcoming concerts section on homepage ──────────────────────── */
/* JS sets this to position:fixed at runtime — fixed is immune to Astra/   */
/* Gutenberg overflow interference that kills sticky. Pre-JS fallback is    */
/* relative so the page is still readable without JS.                       */
.home .concerts-section {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
}

.home .concerts-section .wp-block-cover__image-background {
  background-position: center center !important;
}

/* ─── Homepage concerts section ─────────────────────────── */

.home .concerts-section .wp-block-cover__inner-container {
  display: block;
  padding-left: 60px;
  padding-right: 0;
  max-width: 100%;
  width: 100%;
}

.home .concerts-section .concerts-inner {
  width: 45%;
  max-width: 560px;
  margin-left: 0;
  margin-right: auto;
  padding: 80px 0 80px 160px;
}

.concerts-inner h2 {
  font-size: clamp(1rem, 1.5vw, 1.4rem);
  color: #ffffff;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  margin-bottom: 1.5em;
}

.concerts-events {
  list-style: none;
  margin: 0;
  padding: 0;
}

.concerts-event {
  display: flex;
  flex-direction: column;
  gap: 0.2em;
  padding: 1em 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.concerts-event:first-child {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.concerts-date {
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #d4890a;
}

.concerts-title {
  font-size: 1rem;
  font-weight: 500;
  color: #ffffff;
}

.concerts-venue {
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.9);
}

.concerts-location {
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.8);
}

.concerts-festival {
  font-size: 0.8rem;
  color: rgba(255, 255, 255, 0.75);
  font-style: italic;
}

.concerts-tickets {
  font-size: 0.78rem;
  color: #d4890a;
  text-decoration: none;
  margin-top: 0.2em;
  letter-spacing: 0.06em;
}

.concerts-tickets:hover {
  color: #ffffff;
}

.concerts-none {
  color: rgba(255, 255, 255, 0.75);
  font-size: 0.95rem;
  line-height: 1.7;
  margin-bottom: 1em;
}

.concerts-link {
  display: inline-block;
  margin-top: 1.5em;
  font-size: 0.78rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #d4890a;
  text-decoration: none;
}

.concerts-link:hover {
  color: #ffffff;
}

/* ─── Homepage concerts section — mobile ────────────────── */
@media (max-width: 768px) {
  /* Dark overlay on the background image via pseudo-element */
  .home .concerts-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.2);
    z-index: 1;
    pointer-events: none;
  }

  /* Ensure inner content sits above the overlay */
  .home .concerts-section .wp-block-cover__inner-container {
    position: relative;
    z-index: 2;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
  }

  /* Target the concerts-inner regardless of extra Gutenberg classes */
  .home .concerts-section [class*="concerts-inner"],
  .home .concerts-section .concerts-inner,
  .home .concerts-section .wp-block-group.concerts-inner {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-top: 50px !important;
    padding-right: 24px !important;
    padding-bottom: 50px !important;
    padding-left: 24px !important;
    box-sizing: border-box !important;
  }

  /* Scale down font sizes to fit narrow screens */
  .concerts-inner h2 {
    font-size: 0.85rem;
  }
}

/* ─── Performances page ──────────────────────────────────── */

/* ─── Remove Astra article padding on performances page ─── */
.page-id-398.ast-page-builder-template .site-main > article {
  padding-top: 0 !important;
}

.page-id-398 .entry-content {
  background: #f5f5f3;
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 0;
}

.page-id-398 .entry-content > * {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 60px;
  padding-right: 60px;
}

.page-id-398 .entry-content > h1:first-child {
  padding-top: 40px;
}

/* ─── Hide 12:00am time on events with no time set ───────── */
.tribe-events-widget-events-list__event-datetime,
.tribe-event-time {
  display: none;
}

/* ─── Hide 12:00am on individual event pages ─────────────── */
.tribe-events .tribe-event-schedule-details {
  display: none;
}

/* ─── Performances page typography ───────────────────────── */
.page-id-398 h1 {
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  margin-bottom: 0.5em;
  color: #111111;
}

.page-id-398 h2 {
  font-size: clamp(1.2rem, 2vw, 1.8rem);
  color: #111111;
  margin-top: 3em;
  margin-bottom: 1em;
  padding-bottom: 0.3em;
  border-bottom: 1px solid #dddddd;
}

/* ─── Past events list ───────────────────────────────────── */
.django-past-events__year {
  font-size: 1.4rem;
  color: #111111;
  margin: 2.5em 0 0.8em;
  padding-bottom: 0.3em;
  border-bottom: 1px solid #cccccc;
}

.django-past-events__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.django-past-events__item {
  border-bottom: 1px solid #e8e8e8;
  padding: 1.2em 0;
}

.django-past-events__row {
  display: flex;
  align-items: flex-start;
  gap: 1.5em;
}

.django-past-events__date {
  min-width: 200px;
  max-width: 200px;
  font-size: 0.85rem;
  color: #666666;
  flex-shrink: 0;
  white-space: nowrap;
  text-align: right;
}

.django-past-events__details {
  display: flex;
  flex-direction: column;
  gap: 0.2em;
  flex: 1;
}

.django-past-events__title {
  font-weight: 500;
  color: #111111;
}

.django-past-events__venue {
  font-size: 0.85rem;
  color: #444444;
}

.django-past-events__location {
  font-size: 0.85rem;
  color: #555555;
}

.django-past-events__meta {
  display: flex;
  align-items: center;
  gap: 1em;
  margin-top: 0.2em;
}

.django-past-events__category {
  font-size: 0.75rem;
  color: #888888;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.django-past-events__toggle {
  background: none;
  border: none;
  color: #888888;
  font-size: 0.78rem;
  padding: 0;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.django-past-events__toggle:hover {
  color: #111111;
}

.django-past-events__description {
  margin-top: 0.8em;
  padding: 1em;
  background: #eeeeec;
  font-size: 0.9rem;
  line-height: 1.7;
  color: #333333;
}

/* ─── Performances page: forthcoming list ───────────────── */
.django-forthcoming-list {
  margin: 0 0 3em;
}

.django-forthcoming-list__none {
  color: #555555;
  font-size: 0.95rem;
  padding: 1.5em 0;
}

.django-forthcoming-list__event {
  display: grid;
  grid-template-columns: 200px 1fr auto;
  gap: 1em 2em;
  align-items: start;
  padding: 1.2em 0;
  border-bottom: 1px solid #e0e0e0;
}

.django-forthcoming-list__event:first-child {
  border-top: 1px solid #e0e0e0;
}

.django-forthcoming-list__date {
  font-size: 0.82rem;
  color: #555555;
  letter-spacing: 0.04em;
  padding-top: 0.15em;
  white-space: normal;
  line-height: 1.4;
}

.django-forthcoming-list__title {
  font-size: 1rem;
  font-weight: 500;
  color: #111111;
  margin-bottom: 0.2em;
}

.django-forthcoming-list__venue {
  font-size: 0.85rem;
  color: #333333;
}

.django-forthcoming-list__location {
  font-size: 0.85rem;
  color: #555555;
}

.django-forthcoming-list__festival {
  font-size: 0.8rem;
  color: #777777;
  font-style: italic;
  margin-top: 0.15em;
}

.django-forthcoming-list__lineup {
  font-size: 0.8rem;
  color: #777777;
  margin-top: 0.2em;
  line-height: 1.5;
}

.django-forthcoming-list__book a {
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #111111;
  text-decoration: none;
  white-space: nowrap;
  padding-top: 0.15em;
  display: inline-block;
}

.django-forthcoming-list__book a:hover {
  color: #d4890a;
}

/* ─── Performances page: forthcoming list — mobile ──────── */
@media (max-width: 768px) {
  .django-forthcoming-list__event {
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 0.5em 1em;
  }
  .django-forthcoming-list__date {
    grid-column: 1 / -1;
    font-size: 0.78rem;
    color: #888888;
    text-align: left;
    white-space: normal;
  }
  .django-forthcoming-list__details {
    grid-column: 1;
    grid-row: 2;
  }
  .django-forthcoming-list__book {
    grid-row: 2;
    grid-column: 2;
    align-self: start;
  }

  /* ─── Past events list: mobile ───────────────────────── */
  .django-past-events__row {
    flex-direction: column;
    gap: 0.3em;
  }

  .django-past-events__date {
    min-width: unset;
    max-width: unset;
    width: auto;
    text-align: left;
    font-size: 0.78rem;
    color: #888888;
  }
}

/* performance page hide The Events Calendar's default widget footer link, which is redundant since we're showing all events on the page already. */
.tribe-events-widget-events-list__view-more-link {
  display: none;
}

/* ─── Latest posts section ───────────────────────────────── */
.home .latest-posts {
  position: relative;
  z-index: 2;
  background: #ffffff;
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 80px 60px;
  min-height: 100vh;
}

.home .latest-posts h2 {
  font-size: clamp(1rem, 1.5vw, 1.4rem);
  color: #111111;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  margin-bottom: 1.5em;
}

/* ─── Latest posts section — mobile ─────────────────────── */
@media (max-width: 768px) {
  .home .latest-posts {
    padding: 50px 24px;
  }
}

/* ─── Prevent flash on load ──────────────────────────────── */
/* Hide bio and concerts until JS has set up fixed layers.    */
/* JS adds .scroll-ready to <body> once initialised.          */
body.home:not(.scroll-ready) .bio-section,
body.home:not(.scroll-ready) .concerts-section {
  visibility: hidden;
}

/* ─── Collapse Astra's colophon entirely — our footer replaces it ── */
#colophon,
.site-footer {
  padding: 0 !important;
  margin: 0 !important;
  min-height: 0 !important;
  border: none !important;
}

#colophon .ast-footer-copyright,
.ast-footer-copyright,
.site-footer .ast-row,
.site-footer .footer-widget-area,
.ast-site-footer-wrap {
  display: none !important;
}

/* ─── On homepage: our footer must sit above fixed concert layer ─── */
.home .django-footer {
  position: relative;
  z-index: 5;
}

/* ═══════════════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════════════ */

.django-footer {
  background: #111111;
  color: rgba(255, 255, 255, 0.65);
  font-size: 0.78rem;
  letter-spacing: 0.05em;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* ─── Main footer row: 3-column grid ────────────────────── */
/* Left: nav links | Centre: social icons | Right: email + copyright */
.django-footer__inner {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
  padding: 28px 60px;
  gap: 2em;
}

/* ─── Nav links (left) ───────────────────────────────────── */
.django-footer__nav {
  display: flex;
  gap: 2em;
  justify-content: flex-start;
}

.django-footer__nav a {
  color: rgba(255, 255, 255, 0.68);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.72rem;
  transition: color 0.15s ease;
}

.django-footer__nav a:hover {
  color: #d4890a;
}

/* ─── Social icons (centre) ──────────────────────────────── */
.django-footer__social {
  display: flex;
  gap: 1.2em;
  align-items: center;
  justify-content: center;
}

.django-footer__social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.5);
  transition: color 0.15s ease;
}

.django-footer__social-link:hover {
  color: #d4890a;
}

.django-footer__social-link svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
  display: block;
}

/* ─── Right column: email + copyright ───────────────────── */
.django-footer__right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.3em;
}

.django-footer__email a {
  color: rgba(255, 255, 255, 0.68);
  text-decoration: none;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  transition: color 0.15s ease;
}

.django-footer__email a:hover {
  color: #d4890a;
}

/* ─── Copyright ──────────────────────────────────────────── */
.django-footer__copy {
  margin: 0;
  color: rgba(255, 255, 255, 0.42);
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-align: right;
}

/* ─── Newsletter strip ───────────────────────────────────── */
.django-footer__newsletter {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  text-align: center;
  padding: 14px 60px;
}

.django-footer__newsletter-text {
  margin: 0;
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
}

/* ─── Footer — tablet/mobile ─────────────────────────────── */
@media (max-width: 768px) {
  .django-footer__inner {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    padding: 28px 24px;
    gap: 1.4em;
  }

  .django-footer__nav {
    gap: 1.5em;
    justify-content: center;
  }

  .django-footer__right {
    align-items: center;
    order: 3;
  }

  .django-footer__copy {
    text-align: center;
  }

  .django-footer__newsletter {
    padding: 14px 24px;
  }
}

/* ═══════════════════════════════════════════════════════════
   VIDEOS PAGE
   Replace 398 with actual videos page ID once created.
   ═══════════════════════════════════════════════════════════ */

/* ─── Dark sticky header (same pattern as performances) ─── */
.page-id-577 .site-header,
.page-id-577 #masthead {
  position: sticky;
  top: 0;
  z-index: 100;
  background: #1a1a1a;
}

/* ─── Page background ───────────────────────────────────── */
body.page-id-577,
.page-id-577 .site,
.page-id-577 #page {
  background: #e4e4e4 !important;
}

/* ─── Page background and content width ─────────────────── */
.page-id-577 .entry-content {
  background: #e4e4e4;
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 0;
}

.page-id-577 .entry-content > * {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 60px;
  padding-right: 60px;
}

.page-id-577 .entry-content > h1:first-child {
  padding-top: 40px;
}

/* ─── Page typography ────────────────────────────────────── */
.page-id-577 h1 {
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  margin-bottom: 0.8em;
  color: #111111;
}

/* ─── Video grid ─────────────────────────────────────────── */
.django-videos__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.5em;
  padding: 2em 0 4em;
}

.django-videos__item {
  cursor: pointer;
}

/* ─── Thumbnail ──────────────────────────────────────────── */
.django-videos__thumb-wrap {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #1a1a1a;
}

.django-videos__thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.django-videos__item:hover .django-videos__thumb {
  transform: scale(1.03);
  opacity: 0.85;
}

/* ─── Play button overlay ────────────────────────────────── */
.django-videos__play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 52px;
  height: 52px;
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}

.django-videos__item:hover .django-videos__play {
  opacity: 1;
}

/* ─── Video metadata ─────────────────────────────────────── */
.django-videos__meta {
  padding: 0.8em 0 0;
}

.django-videos__title {
  font-size: 0.95rem;
  font-weight: 400;
  color: #111111;
  margin: 0 0 0.2em;
  letter-spacing: 0.02em;
  line-height: 1.4;
}

.django-videos__year {
  font-size: 0.78rem;
  color: #888888;
  letter-spacing: 0.08em;
  display: block;
  margin-bottom: 0.3em;
}

.django-videos__desc {
  font-size: 0.82rem;
  color: #555555;
  margin: 0.3em 0 0;
  line-height: 1.5;
}

.django-videos__none {
  color: #555555;
  padding: 2em 0;
}

/* ─── Lightbox ───────────────────────────────────────────── */
.django-videos__lightbox {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.92);
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease;
}

.django-videos__lightbox.is-open {
  opacity: 1;
  visibility: visible;
}

.django-videos__embed-wrap {
  width: 90vw;
  max-width: 1100px;
  aspect-ratio: 16 / 9;
  position: relative;
}

.django-videos__embed-wrap iframe {
  width: 100%;
  height: 100%;
  display: block;
}

.django-videos__close {
  position: fixed;
  top: 1.2rem;
  right: 1.5rem;
  background: none;
  border: none;
  color: #ffffff;
  font-size: 1.8rem;
  cursor: pointer;
  line-height: 1;
  padding: 0.2em;
  opacity: 0.8;
  transition: opacity 0.15s;
  z-index: 100000;
}

.django-videos__close:hover {
  opacity: 1;
}

/* ─── Videos page — mobile ───────────────────────────────── */
@media (max-width: 900px) {
  .django-videos__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5em;
  }
}

@media (max-width: 600px) {
  .django-videos__grid {
    grid-template-columns: 1fr;
  }

  .page-id-577 .entry-content > * {
    padding-left: 24px;
    padding-right: 24px;
  }

  .django-videos__embed-wrap {
    width: 100vw;
  }
}

/* ═══════════════════════════════════════════════════════════
   CONTACT PAGE (page ID 637)
   ═══════════════════════════════════════════════════════════ */

/* ─── Dark sticky header ─────────────────────────────────── */
.page-id-637 .site-header,
.page-id-637 #masthead {
  position: sticky;
  top: 0;
  z-index: 100;
  background: #1a1a1a;
}

/* ─── Full page background image ─────────────────────────── */
body.page-id-637 {
  background-image: url('/wp-content/uploads/2026/06/notes-bg-1920x1080-v2.webp');
  background-size: cover;
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
}

@media (orientation: portrait) {
  body.page-id-637 {
    background-image: url('/wp-content/uploads/2026/06/notes-bg-1080x1920-v2.webp');
    background-attachment: scroll; /* fixed doesn't work well on mobile */
  }
}

/* ─── Make Astra's wrappers transparent so bg shows through  */
.page-id-637 #page,
.page-id-637 .site,
.page-id-637 .hfeed,
.page-id-637 #content,
.page-id-637 .site-content,
.page-id-637 .ast-container,
.page-id-637 .entry-content {
  background: transparent !important;
}

/* ─── Page content width ─────────────────────────────────── */
.page-id-637 .entry-content {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 0;
}

/* ─── Form floating panel ────────────────────────────────── */
.page-id-637 .entry-content > * {
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 60px;
  padding-right: 60px;
}

/* ─── Page typography ────────────────────────────────────── */
.page-id-637 h1 {
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  margin-bottom: 0.6em;
  margin-top: 10px;
  color: #ffffff;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

/* ─── WPForms floating panel ─────────────────────────────── */
.page-id-637 .wpforms-container {
  background: rgba(0, 0, 0, 0.45);
  padding: 30px 40px 40px;
  margin-bottom: 80px;
}

/* ─── Form labels ────────────────────────────────────────── */
.page-id-637 .wpforms-field-label,
.page-id-637 .wpforms-field label {
  font-size: 0.72rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.75) !important;
  margin-bottom: 0.3em !important;
  font-weight: 400 !important;
}

/* ─── Form inputs and textarea ───────────────────────────── */
.page-id-637 .wpforms-field input[type="text"],
.page-id-637 .wpforms-field input[type="email"],
.page-id-637 .wpforms-field textarea {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid transparent;
  border-radius: 0;
  padding: 9px 14px;
  font-size: 0.88rem;
  color: #111111;
  width: 100%;
  transition: border-color 0.15s ease;
  font-family: inherit;
}

.page-id-637 .wpforms-field input[type="text"]:focus,
.page-id-637 .wpforms-field input[type="email"]:focus,
.page-id-637 .wpforms-field textarea:focus {
  border-color: #d4890a;
  outline: none;
  background: #ffffff;
}

/* ─── Textarea height ────────────────────────────────────── */
.page-id-637 .wpforms-field textarea {
  min-height: 120px;
  resize: vertical;
}

/* ─── Field spacing ──────────────────────────────────────── */
.page-id-637 .wpforms-field {
  margin-bottom: 0.9em;
}

/* ─── Submit button ──────────────────────────────────────── */
.page-id-637 .wpforms-submit,
.page-id-637 .wpforms-submit-container button[type="submit"] {
  background: #d4890a !important;
  color: #ffffff !important;
  border: none !important;
  padding: 14px 40px !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  font-family: inherit !important;
  font-weight: 400 !important;
  transition: background 0.2s ease !important;
  border-radius: 0 !important;
}

.page-id-637 .wpforms-submit:hover,
.page-id-637 .wpforms-submit-container button[type="submit"]:hover {
  background: #111111 !important;
}

/* ─── Confirmation message ───────────────────────────────── */
.page-id-637 .wpforms-confirmation-container-full {
  background: #ffffff;
  border-left: 4px solid #d4890a;
  padding: 20px 24px;
  font-size: 0.95rem;
  color: #111111;
  margin-top: 1em;
}

/* ─── Contact page — mobile ──────────────────────────────── */
@media (max-width: 768px) {
  .page-id-637 .entry-content > * {
    padding-left: 24px;
    padding-right: 24px;
  }
}

/* ═══════════════════════════════════════════════════════════
   SHOP / WOOCOMMERCE
   ═══════════════════════════════════════════════════════════ */

/* ─── Dark sticky header (same pattern as videos/performances) ─── */
.woocommerce-shop .site-header,
.woocommerce-shop #masthead,
.single-product .site-header,
.single-product #masthead,
.woocommerce-cart .site-header,
.woocommerce-cart #masthead,
.woocommerce-checkout .site-header,
.woocommerce-checkout #masthead {
  position: sticky;
  top: 0;
  z-index: 100;
  background: #1a1a1a;
}

/* ─── Page background ────────────────────────────────────── */
body.woocommerce-shop,
body.single-product,
body.woocommerce-cart,
body.woocommerce-checkout,
.woocommerce-shop .site,
.single-product .site,
.woocommerce-cart .site,
.woocommerce-checkout .site {
  background: #e4e4e4 !important;
}

/* ─── Full-width content wrapper ─────────────────────────── */
.woocommerce-shop .entry-content,
.single-product .entry-content,
.woocommerce-cart .entry-content,
.woocommerce-checkout .entry-content {
  background: #e4e4e4;
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 0;
}

.woocommerce-shop .entry-content > *,
.single-product .entry-content > *,
.woocommerce-cart .entry-content > *,
.woocommerce-checkout .entry-content > * {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 60px;
  padding-right: 60px;
  box-sizing: border-box;
}

/* ─── Top spacing for cart/checkout pages ────────────────── */
.woocommerce-cart .entry-header,
.woocommerce-checkout .entry-header {
  padding-top: 40px;
}

@media (max-width: 768px) {
  .woocommerce-cart .entry-header,
  .woocommerce-checkout .entry-header {
    padding-top: 20px;
  }
}

/* ─── Cart/checkout headings: match shop heading style ───── */
.woocommerce-cart .entry-title,
.woocommerce-checkout .entry-title {
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  font-weight: 300;
  color: #111111;
  margin: 0 0 0.6em;
}

/* ─── Shipping method label/cost: use normal text colour ─── */
.woocommerce-cart .woocommerce-shipping-totals .amount,
.woocommerce-cart .woocommerce-shipping-totals label,
.woocommerce-cart .woocommerce-shipping-totals a,
.woocommerce-checkout .woocommerce-shipping-totals .amount,
.woocommerce-checkout .woocommerce-shipping-totals label,
.woocommerce-checkout .woocommerce-shipping-totals a {
  color: #111111 !important;
}

/* ─── Checkout form field labels: de-emphasise ───────────── */
.woocommerce-checkout .woocommerce-billing-fields label,
.woocommerce-checkout .woocommerce-shipping-fields label,
.woocommerce-checkout .woocommerce-additional-fields label {
  color: #444444 !important;
  font-weight: 400 !important;
}

.woocommerce-checkout .woocommerce-billing-fields label.required_field,
.woocommerce-checkout .woocommerce-shipping-fields label.required_field,
.woocommerce-checkout .woocommerce-additional-fields label.required_field {
  color: #444444 !important;
}

.woocommerce-checkout .required {
  color: #d4890a;
}

/* ─── Shop heading ───────────────────────────────────────── */
.woocommerce-shop h1.entry-title,
.woocommerce-shop .page-title {
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  font-weight: 300;
  margin: 50px 0 0.6em;
  color: #111111;
}

/* ─── Product grid ───────────────────────────────────────── */
.woocommerce ul.products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 2.5em;
  margin: 0;
  padding: 40px 0 60px;
}

.woocommerce ul.products li.product {
  width: 100% !important;
  margin: 0 !important;
  text-align: left;
  float: none;
}

/* ─── Product image ──────────────────────────────────────── */
.woocommerce ul.products li.product img {
  width: 100%;
  height: auto;
  display: block;
  margin-bottom: 1em;
  border-radius: 0;
}

/* ─── Product category label (e.g. "CD") ─────────────────── */
.woocommerce ul.products li.product .product-cat,
.woocommerce ul.products li.product .posted_in,
.single-product .posted_in {
  display: block;
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #111111;
  opacity: 0.4;
  margin-bottom: 0.4em;
}

.single-product .posted_in a,
.woocommerce ul.products li.product .product-cat a {
  color: inherit;
  text-decoration: none;
}

.single-product .posted_in a:hover,
.woocommerce ul.products li.product .product-cat a:hover {
  color: #d4890a;
}

/* ─── Product title ──────────────────────────────────────── */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: 0.95rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 400;
  color: #111111;
  margin: 0 0 0.4em;
}

/* ─── Product price ──────────────────────────────────────── */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce-cart .product-price,
.woocommerce-cart .product-subtotal {
  font-size: 0.95rem;
  font-weight: 300;
  color: #111111;
  opacity: 0.65;
}

/* ═══════════════════════════════════════════════════════════
   BUTTONS — subtle outline style, matching "Tickets →" links
   ═══════════════════════════════════════════════════════════ */

.woocommerce ul.products li.product .button,
.woocommerce div.product .single_add_to_cart_button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce-cart .checkout-button,
.woocommerce #payment #place_order {
  background: transparent !important;
  color: #111111 !important;
  border: 1px solid #111111 !important;
  border-radius: 0 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  font-weight: 400 !important;
  font-size: 0.8rem !important;
  padding: 0.7em 1.6em !important;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease !important;
  box-shadow: none !important;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce div.product .single_add_to_cart_button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce-cart .checkout-button:hover,
.woocommerce #payment #place_order:hover {
  background: #d4890a !important;
  color: #111111 !important;
  border-color: #d4890a !important;
}

/* "Proceed to checkout" button — slightly larger as a primary CTA */
.woocommerce-cart .wc-proceed-to-checkout .checkout-button,
.woocommerce #payment #place_order {
  width: 100%;
  text-align: center;
  font-size: 0.85rem !important;
  padding: 0.9em 1.6em !important;
}

/* ─── Single product layout ──────────────────────────────── */
.single-product .product_title {
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 300;
  color: #111111;
  margin-bottom: 0.4em;
}

.single-product .woocommerce-breadcrumb {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.75rem;
  opacity: 0.5;
  margin-bottom: 1.5em;
}

.single-product .woocommerce-breadcrumb a {
  color: inherit;
}

.single-product p.price {
  font-size: 1.3rem;
  margin-bottom: 1em;
}

/* ─── Product gallery — clear sticky header, disable zoom ── */
.single-product .ast-woocommerce-container {
  padding-top: 70px;
}

.single-product .woocommerce-product-gallery {
  margin-top: 20px;
}

.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image,
.single-product .woocommerce-product-gallery img {
  cursor: default !important;
}

.single-product .woocommerce-product-gallery__trigger {
  display: none !important;
}

/* ─── Quantity input + Add to basket — equal heights ────── */
.single-product form.cart {
  display: flex;
  align-items: stretch;
  gap: 0.8em;
}

.single-product .quantity {
  display: flex;
}

.single-product .quantity input.qty,
.woocommerce-cart .quantity input.qty {
  border: 1px solid #cccccc;
  background: #ffffff;
  padding: 0.7em;
  text-align: center;
  width: 60px;
  border-radius: 0;
  box-sizing: border-box;
  height: auto;
}

.single-product .single_add_to_cart_button {
  display: flex;
  align-items: center;
}

/* ─── Related products heading ───────────────────────────── */
.single-product .related.products > h2 {
  font-size: clamp(1.6rem, 2.5vw, 2.4rem);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  font-weight: 300;
  margin: 2em 0 0.8em;
  color: #111111;
}

/* ═══════════════════════════════════════════════════════════
   BASKET / CART PAGE
   ═══════════════════════════════════════════════════════════ */

.woocommerce-cart h1.entry-title,
.woocommerce-cart .page-title {
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  font-weight: 300;
  margin: 50px 0 0.6em;
  color: #111111;
}

.woocommerce-cart .entry-content {
  padding-top: 0;
  padding-bottom: 60px;
}

/* Cart table */
.woocommerce-cart table.shop_table {
  border: none;
  border-collapse: collapse;
}

.woocommerce-cart table.shop_table th {
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.75rem;
  font-weight: 400;
  opacity: 0.6;
  border-bottom: 1px solid #cccccc;
  padding-bottom: 0.8em;
}

.woocommerce-cart table.shop_table td {
  border-bottom: 1px solid #d8d8d8;
  padding: 1.2em 0.6em;
}

.woocommerce-cart table.shop_table img {
  width: 70px;
  height: auto;
}

.woocommerce-cart .product-name a {
  color: #111111;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.9rem;
}

.woocommerce-cart .product-name a:hover {
  color: #d4890a;
}

/* Coupon field */
.woocommerce-cart .coupon .input-text {
  border: 1px solid #cccccc;
  background: #ffffff;
  padding: 0.7em 1em;
  border-radius: 0;
}

/* Cart totals box */
.woocommerce-cart .cart_totals {
  background: #ffffff;
  border: 1px solid #d8d8d8;
  padding: 30px;
}

.woocommerce-cart .cart_totals h2 {
  font-size: clamp(1.4rem, 2vw, 2rem);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  font-weight: 300;
  margin-top: 0;
}

.woocommerce-cart .cart_totals table {
  border: none;
}

.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
  border-bottom: 1px solid #d8d8d8;
  padding: 0.8em 0;
}

.woocommerce-cart .cart_totals table th {
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.85rem;
}

/* ─── Shop / product / basket — mobile ───────────────────── */
@media (max-width: 768px) {
  .woocommerce-shop .entry-content > *,
  .single-product .entry-content > *,
  .woocommerce-cart .entry-content > *,
  .woocommerce-checkout .entry-content > * {
    padding-left: 24px;
    padding-right: 24px;
  }

  .woocommerce ul.products {
    grid-template-columns: 1fr 1fr;
    gap: 1.2em;
  }

  .woocommerce ul.products li.product .button,
  .woocommerce div.product .single_add_to_cart_button {
    width: 100%;
    text-align: center;
    font-size: 0.75rem !important;
    padding: 0.8em 1em !important;
  }

  .single-product .ast-woocommerce-container {
    padding-top: 20px;
  }

  /* Cart table becomes stacked cards on mobile */
  .woocommerce-cart table.shop_table thead {
    display: none;
  }

  .woocommerce-cart table.shop_table,
  .woocommerce-cart table.shop_table tbody,
  .woocommerce-cart table.shop_table tr,
  .woocommerce-cart table.shop_table td {
    display: block;
    width: 100%;
  }

  .woocommerce-cart table.shop_table tr {
    border-bottom: 1px solid #d8d8d8;
    padding: 1em 0;
  }

  .woocommerce-cart table.shop_table td {
    border-bottom: none;
    padding: 0.3em 0;
  }

  .woocommerce-cart .cart_totals {
    padding: 20px;
  }
}
/* Import VAT / customs duty disclaimer */
.django-shipping-disclaimer {
  max-width: 1200px;
  margin: 0 auto 1.5em auto;
  padding: 0.9em 1.2em;
  background-color: #ffffff;
  border-left: 3px solid #d4890a;
  font-size: 0.85rem;
  line-height: 1.5;
  color: #444444;
}

.django-shipping-disclaimer p {
  margin: 0;
}

@media (max-width: 768px) {
  .django-shipping-disclaimer {
    margin-left: 20px;
    margin-right: 20px;
    font-size: 0.8rem;
  }
}

/* ─── Mobile menu: black background, centred white links ─── */
@media (max-width: 920px) {
  .ast-header-break-point .main-header-bar-navigation,
  .ast-header-break-point .main-navigation {
    background-color: #111111;
  }

  #ast-hf-mobile-menu {
    background-color: #111111;
  }

  #ast-hf-mobile-menu .menu-item {
    text-align: left;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  }

  #ast-hf-mobile-menu .menu-item:last-child {
    border-bottom: none;
  }

  #ast-hf-mobile-menu .menu-link {
    display: block;
    width: 100%;
    color: #ffffff !important;
    padding: 16px 15px;
  }

  #ast-hf-mobile-menu .menu-item:hover .menu-link,
  #ast-hf-mobile-menu .menu-link:hover,
  #ast-hf-mobile-menu .menu-link:focus {
    color: #d4890a !important;
  }
}