/*
Theme Name: The Ecclian
Theme URI: https://itlsoftware.company
Author: Simon Worzl
Author URI: https://worzl.ai
Description: The Ecclian — Independent Real Ale Micropub & Conversational Boozer Block Theme (v3.1 Editorial Tavern Architecture)
Version: 3.1.0
Requires at least: 6.6
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ecclian
Tags: full-site-editing, block-patterns, block-styles, custom-colors, custom-typography, fluid-layout, wide-blocks, mobile-responsive
*/

/* ==========================================================================
   1. TYPOGRAPHY & BRAND ASSETS
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cabin:ital,wght@0,400;0,600;0,700;1,400&family=EB+Garamond:ital,wght@0,400;0,600;0,700;1,400&family=League+Gothic&family=Inter:wght@400;500;600;700&display=swap');

@font-face {
  font-family: 'King Edward Basic';
  src: url('assets/fonts/king-edward-basic.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* --- Typography Font Families --- */
  --font-brand: 'King Edward Basic', 'EB Garamond', Georgia, serif;
  --font-serif: 'EB Garamond', Georgia, serif;
  --font-condensed: 'League Gothic', Impact, sans-serif;
  --font-sans: 'Cabin', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-heading: var(--font-serif);
  --font-body: var(--font-sans);
  --font-mono: 'JetBrains Mono', monospace;

  /* --- Core Framework Fluid Typography Scales (320px -> 1400px Viewport) --- */
  --text-xs: clamp(0.75rem, calc(0.12vw + 0.73rem), 0.8125rem);
  --text-s: clamp(0.875rem, calc(0.18vw + 0.84rem), 0.9375rem);
  --text-m: clamp(1rem, calc(0.25vw + 0.95rem), 1.125rem);
  --text-l: clamp(1.125rem, calc(0.45vw + 1.05rem), 1.375rem);
  --text-xl: clamp(1.375rem, calc(0.75vw + 1.25rem), 1.75rem);
  --text-2xl: clamp(1.75rem, calc(1.15vw + 1.55rem), 2.25rem);
  --text-3xl: clamp(2.25rem, calc(1.75vw + 1.95rem), 3rem);
  --text-4xl: clamp(2.75rem, calc(2.75vw + 2.25rem), 4.25rem);

  /* --- Core Framework Fluid Spacing Rhythm (320px -> 1400px Viewport) --- */
  --space-3xs: clamp(0.25rem, calc(0.08vw + 0.23rem), 0.375rem);
  --space-2xs: clamp(0.5rem, calc(0.15vw + 0.47rem), 0.625rem);
  --space-xs: clamp(0.75rem, calc(0.25vw + 0.70rem), 1rem);
  --space-s: clamp(1rem, calc(0.35vw + 0.93rem), 1.25rem);
  --space-m: clamp(1.5rem, calc(0.65vw + 1.37rem), 2rem);
  --space-l: clamp(2rem, calc(1.05vw + 1.79rem), 3rem);
  --space-xl: clamp(3rem, calc(1.45vw + 2.71rem), 4rem);
  --space-2xl: clamp(4rem, calc(1.85vw + 3.63rem), 5rem);
  --space-3xl: clamp(5rem, calc(2.25vw + 4.55rem), 6.25rem);
  --space-4xl: clamp(6.25rem, calc(3.05vw + 5.64rem), 8rem);

  /* --- Core Framework Semantic Color Tokens (Refined Heritage Tavern Palette) --- */
  --primary: #C99A45;
  --primary-light: #D4AF37;
  --secondary: #16281E;
  --secondary-dark: #101E16;
  --racing-green: #16281E;
  --walnut: #1A1410;
  --accent: #D4AF37;
  --accent-gold: #C99A45;
  --contrast: #1A1815;
  --bg-body: #FDFBF7;
  --bg-surface: #FFFFFF;
  --bg-surface-elevated: #F8F4EC;
  --bg-surface-dark: #16281E;
  --color-text: #1A1815;
  --color-text-muted: #524A40;
  
  /* Brand Specific Aliases */
  --color-amber: #C99A45;
  --color-amber-light: #D4AF37;
  --color-dark: #101E16;
  --color-surface: var(--bg-surface);
  --color-surface-elevated: var(--bg-surface-elevated);
  --color-surface-dark: var(--bg-surface-dark);
  --color-border: rgba(201, 154, 69, 0.35);
  --color-border-hover: rgba(212, 175, 55, 0.75);
  --color-cream: #F6F0E6;
  --color-linen: #FDFBF7;
  --color-muted: #524A40;

  /* --- Core Framework Shadows & Atmospheric Elevations --- */
  --shadow-sm: 0 1px 3px 0 rgba(22, 40, 30, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(22, 40, 30, 0.08), 0 2px 4px -1px rgba(22, 40, 30, 0.04);
  --shadow-lg: 0 10px 15px -3px rgba(22, 40, 30, 0.10), 0 4px 6px -2px rgba(22, 40, 30, 0.05);
  --shadow-xl: 0 20px 25px -5px rgba(22, 40, 30, 0.12), 0 10px 10px -5px rgba(22, 40, 30, 0.06);
  --shadow-tavern: 0 4px 20px -2px rgba(22, 40, 30, 0.06), 0 12px 36px -4px rgba(22, 40, 30, 0.05);
  --shadow-tavern-hover: 0 8px 24px -2px rgba(22, 40, 30, 0.12), 0 20px 44px -4px rgba(22, 40, 30, 0.08), 0 0 24px rgba(201, 154, 69, 0.2);
  --shadow-brass-inset: inset 0 1px 0 rgba(212, 175, 55, 0.35), inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  --shadow-glow-amber: 0 0 25px -5px rgba(201, 154, 69, 0.35);

  /* --- Radii --- */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 20px;
  --radius-pill: 9999px;
}

.font-brand {
  font-family: var(--font-brand) !important;
}

.font-serif {
  font-family: var(--font-serif) !important;
}

.font-condensed {
  font-family: var(--font-condensed) !important;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* ==========================================================================
   2. CORE GLOBAL STYLING
   ========================================================================== */

html, body, body * {
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
  background-color: var(--bg-body);
  color: var(--color-text);
  font-family: var(--font-sans);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

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

a:hover {
  color: var(--color-amber-light);
}

/* ==========================================================================
   3. STICKY HEADER & NAVIGATION (HERITAGE BRITISH RACING GREEN & GOLD)
   ========================================================================== */

#header,
header.wp-block-template-part,
.wp-block-template-part header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: linear-gradient(180deg, #16281E 0%, #101E16 100%) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-bottom: 2px solid var(--primary) !important;
  box-shadow: 0 6px 24px rgba(16, 30, 22, 0.35) !important;
  padding: 0.85rem clamp(1.25rem, 4vw, 3rem) !important;
}

.wp-block-site-title {
  margin: 0 !important;
}

.wp-block-site-title a,
header .wp-block-site-title a {
  font-family: var(--font-brand) !important;
  font-size: clamp(1.5rem, 2.5vw, 1.95rem) !important;
  font-weight: 400 !important;
  color: #FDFBF7 !important;
  letter-spacing: 0.04em !important;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  transition: color 0.2s ease !important;
}

.wp-block-site-title a:hover,
header .wp-block-site-title a:hover {
  color: #F5C542 !important;
}

/* Navigation Links (WCAG AAA Warm Ivory on British Racing Green) */
.wp-block-navigation {
  font-family: var(--font-condensed) !important;
  font-weight: 600 !important;
  font-size: 1.18rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

.wp-block-navigation a.wp-block-navigation-item__content,
header .wp-block-navigation a.wp-block-navigation-item__content,
footer .wp-block-navigation a.wp-block-navigation-item__content {
  font-family: var(--font-condensed) !important;
  font-size: 1.18rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: #FDFBF7 !important;
  transition: color 0.2s ease, border-color 0.2s ease !important;
  text-decoration: none !important;
  padding: 0.45rem 0.95rem !important;
  position: relative;
  border-bottom: 2px solid transparent !important;
}

.wp-block-navigation a.wp-block-navigation-item__content:hover,
.wp-block-navigation .current-menu-item > a.wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation-item.is-active > a.wp-block-navigation-item__content,
header .wp-block-navigation a.wp-block-navigation-item__content:hover,
footer .wp-block-navigation a.wp-block-navigation-item__content:hover {
  color: #F5C542 !important;
  border-bottom-color: #F5C542 !important;
}

footer .wp-block-navigation a.wp-block-navigation-item__content {
  padding: 0.25rem 0 !important;
  font-size: 1.08rem !important;
}

/* Mobile Navigation Breakpoint & Drawer */
body .wp-block-navigation__responsive-container-open:not(.always-shown) {
  display: block;
  color: #FDFBF7 !important;
}

body .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
  display: none;
}

@media (min-width: 768px) {
  body .wp-block-navigation__responsive-container-open:not(.always-shown) {
    display: none !important;
  }
  body .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
    display: block !important;
  }
}

.wp-block-navigation__responsive-container.is-menu-open {
  background: #101E16 !important;
  backdrop-filter: blur(20px) !important;
  border-left: 3px solid var(--primary) !important;
  color: #FDFBF7 !important;
}

.wp-block-navigation__responsive-container.is-menu-open a,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
  color: #FDFBF7 !important;
}

.wp-block-navigation__responsive-container.is-menu-open a:hover {
  color: #F5C542 !important;
}

/* ==========================================================================
   4. TYPOGRAPHY HIERARCHY
   ========================================================================== */

h1, h2, h3, h4, h5, h6,
.wp-block-heading,
.wp-block-post-title {
  font-family: var(--font-serif) !important;
  color: var(--color-text);
  letter-spacing: -0.015em;
  font-weight: 700 !important;
  line-height: 1.2;
}

h1, .wp-block-post-title {
  font-size: clamp(2.4rem, 5vw, 3.8rem) !important;
  letter-spacing: -0.025em !important;
  line-height: 1.12 !important;
}

h2 {
  font-size: clamp(1.8rem, 3.5vw, 2.6rem) !important;
  letter-spacing: -0.02em !important;
  line-height: 1.2 !important;
}

h3 {
  font-size: clamp(1.3rem, 2vw, 1.75rem) !important;
  letter-spacing: -0.015em !important;
  line-height: 1.25 !important;
}

p {
  color: var(--color-text);
  line-height: 1.7;
}

.section-eyebrow,
.hero-eyebrow {
  font-family: var(--font-condensed) !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: #8A5607 !important;
  display: block !important;
  margin-top: 0 !important;
  margin-bottom: 0.85rem !important;
}

span.section-eyebrow {
  display: inline-block !important;
  margin-bottom: 0.85rem !important;
}

.has-text-align-center.section-eyebrow,
.has-text-align-center .section-eyebrow,
p.has-text-align-center.section-eyebrow {
  display: block !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
  margin-top: 0 !important;
  margin-bottom: 0.85rem !important;
}

p.has-text-align-center.hero-eyebrow {
  display: block !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
  margin-bottom: 1.25rem !important;
}

/* Center heading and intro paragraph rhythm */
h2.has-text-align-center,
.has-text-align-center.wp-block-heading {
  margin-top: 0 !important;
  margin-bottom: 1.25rem !important;
}

p.has-text-align-center.has-muted-color {
  margin-bottom: 3.5rem !important;
}

/* ==========================================================================
   4. DIVIDERS & ORNAMENTS
   ========================================================================== */

/* Edwardian Diamond Fleuron Divider */
.amber-divider {
  width: 100%;
  max-width: 180px;
  height: 14px;
  margin: 1.5rem 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  border: none !important;
  background: transparent !important;
}

.amber-divider.is-center {
  margin: 1.75rem auto;
  justify-content: center;
}

.amber-divider::before,
.amber-divider::after {
  content: "";
  height: 1px;
  flex-grow: 1;
  background: linear-gradient(90deg, rgba(217, 119, 6, 0) 0%, var(--color-amber) 100%);
}

.amber-divider::after {
  background: linear-gradient(90deg, var(--color-amber) 0%, rgba(217, 119, 6, 0) 100%);
}

.amber-divider__fleuron {
  width: 7px;
  height: 7px;
  background-color: var(--color-amber-light);
  transform: rotate(45deg);
  margin: 0 12px;
  box-shadow: 0 0 10px var(--color-amber-light);
  flex-shrink: 0;
}

/* ==========================================================================
   5. BUTTONS & CTAS
   ========================================================================== */

.wp-element-button, 
.wp-block-button__link {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: linear-gradient(135deg, #D4AF37 0%, #C99A45 50%, #9E7428 100%) !important;
  color: #101E16 !important;
  font-family: var(--font-sans) !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.04em !important;
  border-radius: var(--radius-sm) !important;
  padding: 0.8rem 1.8rem !important;
  box-shadow: 0 4px 14px rgba(22, 40, 30, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 2px 6px rgba(201, 154, 69, 0.3) !important;
  text-decoration: none !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  border: 1px solid #D4AF37 !important;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.wp-element-button:hover,
.wp-block-button__link:hover {
  background: linear-gradient(135deg, #E6C252 0%, #D4AF37 50%, #B8860B 100%) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(22, 40, 30, 0.35), 0 0 18px rgba(212, 175, 55, 0.4) !important;
  color: #101E16 !important;
}

.wp-element-button:active,
.wp-block-button__link:active {
  transform: translateY(1px) !important;
  box-shadow: 0 2px 8px rgba(22, 40, 30, 0.5) !important;
}

.wp-block-button.is-style-outline .wp-element-button,
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  color: var(--secondary) !important;
  border: 2px solid var(--secondary) !important;
  box-shadow: 0 2px 8px rgba(22, 40, 30, 0.08) !important;
}

.wp-block-button.is-style-outline .wp-element-button:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  border-color: var(--secondary) !important;
  color: #FDFBF7 !important;
  background: var(--secondary) !important;
  box-shadow: 0 6px 18px rgba(22, 40, 30, 0.25) !important;
}

/* ==========================================================================
   6. TAVERN CARDS, SURFACES & CONTAINERS
   ========================================================================== */

/* Card Surfaces — Crisp Ivory on Heritage Warm Parchment with Brass Rim */
.wp-block-column.has-surface-background-color,
.tavern-card,
.tactile-card {
  background: #FFFFFF !important;
  border: 1px solid #E8E2D8 !important;
  border-top: 3px solid var(--primary) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: 0 4px 20px rgba(22, 40, 30, 0.06), 0 1px 3px rgba(22, 40, 30, 0.04) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative;
  box-sizing: border-box !important;
  padding: 2.6rem 2.4rem !important;
  color: #4A433A !important;
}

.spirit-card {
  background: #FFFFFF !important;
  border: 1px solid #E8E2D8 !important;
  border-top: 3px solid var(--primary) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: 0 4px 20px rgba(22, 40, 30, 0.06), 0 1px 3px rgba(22, 40, 30, 0.04) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative;
  box-sizing: border-box !important;
  padding: 2.4rem 2rem !important;
  color: #4A433A !important;
}

.wp-block-column.has-surface-background-color:hover,
.tavern-card:hover,
.tactile-card:hover,
.spirit-card:hover {
  border-color: var(--primary) !important;
  border-top-color: var(--primary-light) !important;
  box-shadow: 0 12px 32px rgba(22, 40, 30, 0.12), 0 0 20px rgba(201, 154, 69, 0.2) !important;
  transform: translateY(-3px) !important;
}

.wp-block-column.has-surface-background-color h3,
.tavern-card h3,
.tactile-card h3,
.spirit-card h3 {
  color: var(--secondary) !important;
}

.wp-block-column.has-surface-background-color p,
.tavern-card p,
.tactile-card p,
.spirit-card p {
  color: #524A40 !important;
}

/* Card Icon Pseudo-Elements Removed for Clean Editorial Typography (Theme v3.1) */
.tavern-card__icon-wrap,
.spirit-card__icon-wrap,
.tavern-card[class*="has-icon-"]::before,
.spirit-card[class*="has-icon-"]::before,
.tactile-card[class*="has-icon-"]::before {
  display: none !important;
  content: none !important;
}

.event-full.has-icon-bingo .event-full__icon {
  background-image: url('assets/icons/bingo.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 32px 32px;
}
.event-full.has-icon-music .event-full__icon {
  background-image: url('assets/icons/music.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 32px 32px;
}
.event-full.has-icon-racing .event-full__icon {
  background-image: url('assets/icons/racing.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 32px 32px;
}

/* Section Header Banners (Full-width non-floating) — Luminous Heritage Tavern */
.page-header-banner {
  background: linear-gradient(180deg, #F5EBE1 0%, #FAF8F5 100%) !important;
  border-bottom: 2px solid rgba(217, 119, 6, 0.35) !important;
  border-radius: 0 !important;
  box-shadow: 0 4px 20px rgba(45, 35, 24, 0.04) !important;
  transform: none !important;
  padding-top: clamp(2.5rem, 5vw, 4rem) !important;
  padding-bottom: clamp(2.5rem, 5vw, 4rem) !important;
}

.page-header-banner:hover {
  transform: none !important;
  box-shadow: 0 4px 20px rgba(45, 35, 24, 0.04) !important;
}

.page-header-banner h1,
.page-header-banner .wp-block-post-title {
  color: #1C1917 !important;
  text-align: center !important;
  margin: 0 !important;
}

.has-base-background-color {
  background-color: var(--bg-body) !important;
  color: var(--color-text) !important;
}

/* Heading Italic Glow */
h1 em, h2 em, h3 em,
.hero-headline em,
.wp-block-heading em {
  font-style: italic !important;
  color: var(--color-amber-light) !important;
  background: linear-gradient(135deg, #F59E0B 0%, #D97706 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
  padding-right: 0.05em;
  text-shadow: 0 0 30px rgba(217, 119, 6, 0.3) !important;
}

/* Frequency Badges */
.freq-badge {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  border-radius: 100px;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: rgba(217, 119, 6, 0.15);
  color: var(--color-amber-light);
  border: 1px solid rgba(217, 119, 6, 0.3);
  margin-bottom: 0.75rem;
}

/* Authentic Cask Ale Handpull Board */
.cask-pump-card {
  background: linear-gradient(180deg, #181510 0%, #0F0D0A 100%) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: var(--radius-lg);
  padding: 2.4rem 2.2rem !important;
  box-shadow: var(--shadow-tavern), var(--shadow-brass-inset);
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  overflow: hidden;
}

.cask-pump-card:hover {
  border-color: var(--color-border-hover);
  box-shadow: var(--shadow-tavern-hover);
  transform: translateY(-3px);
}

.cask-pump-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
  border-bottom: 1px solid rgba(217, 119, 6, 0.14);
  padding-bottom: 0.85rem;
}

.cask-pump-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-family: var(--font-condensed);
  font-size: 0.95rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-amber);
  font-weight: 700;
  margin: 0 !important;
}

.cask-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #10B981;
  background: rgba(16, 185, 129, 0.1);
  border: 1px solid rgba(16, 185, 129, 0.25);
  padding: 0.2rem 0.55rem;
  border-radius: 100px;
  margin: 0 !important;
}

.cask-status-pill::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: #10B981;
  box-shadow: 0 0 6px #10B981;
}

.cask-abv-tag {
  display: inline-block;
  background: rgba(217, 119, 6, 0.16);
  border: 1px solid rgba(217, 119, 6, 0.35);
  color: var(--color-amber-light);
  font-family: var(--font-condensed);
  font-size: 0.88rem;
  letter-spacing: 0.06em;
  padding: 0.15rem 0.6rem;
  border-radius: 4px;
  font-weight: 700;
  margin-left: 0.5rem;
}

.cask-brewery-origin {
  font-family: var(--font-condensed);
  font-size: 0.85rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-muted);
  margin-bottom: 0.4rem;
  display: block;
}

/* Publican Quote Box with Victorian Drop Quote */
/* Publican Quote Box with Victorian Drop Quote — Crisp White & Amber Accent */
.publican-quote-box {
  position: relative;
  background: #FFFFFF !important;
  border: 1px solid #E6DFD5 !important;
  border-left: 4px solid var(--primary) !important;
  border-radius: var(--radius-lg);
  padding: 3rem 2.6rem !important;
  box-shadow: 0 4px 20px rgba(45, 35, 24, 0.06) !important;
  overflow: hidden;
  color: #1C1917 !important;
}

.publican-quote-box p {
  color: #1C1917 !important;
}

.publican-quote-box::before {
  content: "“";
  position: absolute;
  top: -20px;
  left: 20px;
  font-family: var(--font-serif);
  font-size: 8rem;
  line-height: 1;
  color: rgba(217, 119, 6, 0.15);
  pointer-events: none;
  font-style: italic;
}

/* Enhanced Quick-Strip Bar — Refined Heritage Tavern */
.quick-strip-wrap {
  background: linear-gradient(135deg, #16281E 0%, #101E16 100%) !important;
  border-top: 2px solid var(--primary) !important;
  border-bottom: 2px solid var(--primary) !important;
  box-shadow: 0 4px 16px rgba(22, 40, 30, 0.25) !important;
}

.quick-strip-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-around;
  gap: 1.5rem;
  padding: 1.1rem clamp(1rem, 3vw, 2.5rem);
}

.quick-strip-item,
.quick-strip-item a {
  margin: 0 !important;
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  font-family: var(--font-sans);
  font-size: 0.92rem;
  font-weight: 600;
  color: #FDFBF7 !important;
  text-decoration: none;
  transition: all 0.2s ease;
}

.quick-strip-item svg {
  color: var(--primary-light) !important;
  transition: all 0.2s ease;
  flex-shrink: 0;
}

.quick-strip-item:hover,
.quick-strip-item a:hover {
  color: var(--primary-light) !important;
}

.quick-strip-item:hover svg {
  color: var(--primary-light) !important;
  transform: scale(1.1);
  filter: drop-shadow(0 0 6px rgba(212, 175, 55, 0.6));
}

/* Event Full Card Layout */
.event-full {
  display: grid;
  grid-template-columns: 120px 1fr;
  background: linear-gradient(180deg, #1B1712 0%, #12100D 100%);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  margin-bottom: 2.25rem !important;
  box-shadow: var(--shadow-tavern), var(--shadow-brass-inset);
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.event-full:hover {
  border-color: var(--color-border-hover);
  box-shadow: var(--shadow-tavern-hover);
  transform: translateY(-3px);
}

.event-full__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at center, rgba(217, 119, 6, 0.16) 0%, rgba(17, 15, 12, 0.9) 100%);
  border-right: 1px solid var(--color-border);
  color: var(--color-amber-light);
  padding: 1.5rem;
}

.event-full__body {
  padding: 2.4rem 2.6rem !important;
}

.event-full:hover .event-full__icon svg {
  transform: scale(1.08);
  filter: drop-shadow(0 0 12px rgba(245, 158, 11, 0.5));
  transition: all 0.25s ease;
}


/* Core Gutenberg Columns Architecture & Inter-Card Gaps */
.wp-block-columns {
  display: flex !important;
  box-sizing: border-box !important;
  gap: 2rem !important;
  margin-bottom: 3.5rem !important;
}

@media (max-width: 781px) {
  .wp-block-columns:not(.is-not-stacked-on-mobile) {
    flex-wrap: wrap !important;
    gap: 1.5rem !important;
  }
  .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
    flex-basis: 100% !important;
    min-width: 100% !important;
  }
}

/* Cover Block & Hero Banner Layout */
.tavern-hero-banner {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 620px !important;
  width: 100% !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  padding: 5rem 1.5rem !important;
  background-image: url('assets/images/hero.jpg') !important;
  background-size: cover !important;
  background-position: center 12% !important;
  background-repeat: no-repeat !important;
}

.tavern-hero-content {
  position: relative !important;
  z-index: 3 !important;
  width: 100% !important;
  max-width: 880px !important;
  margin: 0 auto !important;
  text-align: center !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: clamp(2rem, 3.5vw, 3.25rem) clamp(1.5rem, 3vw, 2.75rem) !important;
  background: radial-gradient(ellipse at center, rgba(16, 26, 20, 0.62) 0%, rgba(16, 26, 20, 0.38) 60%, rgba(16, 26, 20, 0) 100%) !important;
  border-radius: 20px !important;
}

.wp-block-cover,
.hero-cover {
  position: relative;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 620px;
  width: 100%;
  overflow: hidden;
  box-sizing: border-box;
  padding: 4rem 1.5rem;
}

.wp-block-cover .wp-block-cover__image-background,
.wp-block-cover > img,
.hero-cover .wp-block-cover__image-background,
.hero-cover > img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 12% !important;
  z-index: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  /* Full Colour POP enhancement */
  filter: brightness(1.04) contrast(1.08) saturate(1.20) !important;
  image-rendering: -webkit-optimize-contrast !important;
}

/* Completely remove opaque overlay across background image */
.wp-block-cover .wp-block-cover__background,
.wp-block-cover .wp-block-cover__gradient-background,
.hero-cover .wp-block-cover__background,
.hero-cover .wp-block-cover__gradient-background {
  display: none !important;
  opacity: 0 !important;
  background: transparent !important;
  pointer-events: none !important;
}

.wp-block-cover h1,
h1.hero-headline {
  font-family: var(--font-serif) !important;
  font-size: clamp(2.5rem, 5.5vw, 4.4rem) !important;
  line-height: 1.12 !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  color: #FFFFFF !important;
  margin: 0.5rem 0 1.25rem 0 !important;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.95), 0 6px 20px rgba(0, 0, 0, 0.85), 0 12px 36px rgba(0, 0, 0, 0.75) !important;
}

.wp-block-cover h1 em,
h1.hero-headline em {
  font-style: italic !important;
  color: var(--primary-light) !important;
  background: linear-gradient(135deg, #FFF1B8 0%, #F5C542 50%, #D49018 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.95));
}

.hero-subtitle,
.wp-block-cover p.hero-sub {
  font-size: clamp(1.05rem, 1.4vw, 1.25rem) !important;
  line-height: 1.65 !important;
  color: #FFFFFF !important;
  max-width: 680px !important;
  margin: 0 auto 2rem auto !important;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.95), 0 4px 16px rgba(0, 0, 0, 0.85) !important;
  font-weight: 500 !important;
}

.hero-eyebrow,
p.has-text-align-center.hero-eyebrow {
  color: #FCD34D !important;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.95), 0 4px 12px rgba(0, 0, 0, 0.85) !important;
  letter-spacing: 0.2em !important;
  font-weight: 800 !important;
}

.hero-cover .wp-block-button__link {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.7), 0 2px 6px rgba(0, 0, 0, 0.4) !important;
}

.hero-cover .wp-block-button.is-style-outline .wp-block-button__link {
  background-color: rgba(22, 40, 30, 0.75) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border: 1.5px solid #D4AF37 !important;
  color: #FFFFFF !important;
}

.hero-cover .wp-block-button.is-style-outline .wp-block-button__link:hover {
  background-color: #D4AF37 !important;
  color: #16281E !important;
}

.wp-block-cover__inner-container,
.hero-cover .wp-block-cover__inner-container {
  position: relative !important;
  z-index: 3 !important;
  width: 100% !important;
  max-width: 880px !important;
  margin: 0 auto !important;
  text-align: center !important;
  box-sizing: border-box !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: clamp(2rem, 3.5vw, 3.25rem) clamp(1.5rem, 3vw, 2.75rem) !important;
  background: radial-gradient(ellipse at center, rgba(16, 26, 20, 0.62) 0%, rgba(16, 26, 20, 0.38) 60%, rgba(16, 26, 20, 0) 100%) !important;
  border-radius: 20px !important;
}

/* Image styling */
.wp-block-image img {
  border-radius: 8px;
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* Blockquote & Publican Quote */
.wp-block-quote {
  border-left: 3px solid var(--color-amber) !important;
  padding: 1rem 1.5rem !important;
  margin: 1.5rem 0 !important;
  background: rgba(217, 119, 6, 0.04);
  border-radius: 0 8px 8px 0;
}

.wp-block-quote.publican-quote-box,
.publican-quote-box {
  background: linear-gradient(180deg, #1C1813 0%, #14110E 100%) !important;
  border: 1px solid var(--color-border) !important;
  border-left: 4px solid var(--color-amber) !important;
  border-radius: var(--radius-lg) !important;
  padding: 3rem 2.6rem !important;
  box-shadow: var(--shadow-tavern), var(--shadow-brass-inset) !important;
  margin: 0 !important;
}

.wp-block-quote p {
  font-family: var(--font-serif) !important;
  font-size: 1.25rem !important;
  font-style: italic;
  color: var(--color-text) !important;
  line-height: 1.5;
}

.wp-block-quote.publican-quote-box p {
  font-size: 1.35rem !important;
  line-height: 1.65 !important;
  color: #FDFBF7 !important;
  margin-bottom: 1rem !important;
}

.wp-block-quote cite {
  font-family: var(--font-sans) !important;
  font-size: 0.9rem !important;
  font-style: normal;
  color: #F5C542 !important;
  font-weight: 700;
  display: block;
  margin-top: 0.5rem;
}

.wp-block-quote.publican-quote-box cite,
.wp-block-quote.publican-quote-box cite a {
  font-size: 0.95rem !important;
  color: #F5C542 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
}

/* Footer Styling — Refined Heritage Tavern */
footer.wp-block-group,
footer.wp-block-template-part,
.wp-block-template-part footer {
  background: linear-gradient(180deg, #16281E 0%, #101E16 100%) !important;
  border-top: 3px solid var(--primary) !important;
  color: #FDFBF7 !important;
  padding: clamp(3rem, 5vw, 4.5rem) clamp(1.25rem, 4vw, 3rem) !important;
}

footer.wp-block-group h4,
footer.wp-block-template-part h4 {
  text-transform: uppercase !important;
  color: #F5C542 !important;
  font-family: var(--font-condensed) !important;
  font-size: 1.15rem !important;
  letter-spacing: 0.1em !important;
}

footer.wp-block-group .wp-block-site-title a,
footer.wp-block-template-part .wp-block-site-title a {
  color: #FDFBF7 !important;
  font-family: var(--font-brand) !important;
}

footer.wp-block-group .wp-block-site-title a:hover,
footer.wp-block-template-part .wp-block-site-title a:hover {
  color: #F5C542 !important;
}

footer.wp-block-group p,
footer.wp-block-template-part p {
  color: #E2D9C8 !important;
}

footer.wp-block-group a,
footer.wp-block-template-part a {
  color: #FDFBF7 !important;
  transition: color 0.2s ease !important;
}

footer.wp-block-group a:hover,
footer.wp-block-template-part a:hover {
  color: #F5C542 !important;
}

footer.wp-block-group hr.wp-block-separator,
footer.wp-block-template-part hr.wp-block-separator {
  border-color: rgba(201, 154, 69, 0.3) !important;
  background-color: rgba(201, 154, 69, 0.3) !important;
  opacity: 1 !important;
}

/* ==========================================================================
   SECTION CONTRAST ARCHITECTURE: WARM-CREAM VS ATMOSPHERIC CELLAR
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. REFINED HERITAGE PARCHMENT SECTION (.section-cream)
   -------------------------------------------------------------------------- */

.section-cream,
.wp-block-group.alignfull.section-cream,
.wp-block-group.has-cream-canvas-background-color {
  background-color: #FDFBF7 !important;
  color: #1A1815 !important;
  padding-top: clamp(4.5rem, 7vw, 6.5rem) !important;
  padding-bottom: clamp(4.5rem, 7vw, 6.5rem) !important;
  padding-left: clamp(1.25rem, 4vw, 3rem) !important;
  padding-right: clamp(1.25rem, 4vw, 3rem) !important;
  position: relative;
  box-sizing: border-box !important;
  box-shadow: inset 0 1px 0 rgba(22, 40, 30, 0.05);
  width: 100% !important;
}

.section-cream > :last-child,
.section-cellar > :last-child,
.wp-block-group.alignfull.section-cream > :last-child,
.wp-block-group.alignfull.section-cellar > :last-child {
  margin-bottom: 0 !important;
}

/* Headings in Heritage Parchment Section */
.section-cream h1,
.section-cream h2,
.section-cream h3,
.section-cream h4,
.section-cream h5,
.section-cream h6,
.section-cream .wp-block-heading,
.section-cream .wp-block-post-title,
.has-cream-canvas-background-color h1,
.has-cream-canvas-background-color h2,
.has-cream-canvas-background-color h3,
.has-cream-canvas-background-color h4,
.has-cream-canvas-background-color h5,
.has-cream-canvas-background-color h6,
.has-cream-canvas-background-color .wp-block-heading,
.has-cream-canvas-background-color .wp-block-post-title {
  color: var(--secondary) !important;
}

/* Heading Italic Accent on Parchment (Burnished Gold Accent) */
.section-cream h1 em,
.section-cream h2 em,
.section-cream h3 em,
.section-cream .wp-block-heading em,
.has-cream-canvas-background-color h1 em,
.has-cream-canvas-background-color h2 em,
.has-cream-canvas-background-color h3 em,
.has-cream-canvas-background-color .wp-block-heading em {
  font-style: italic !important;
  color: var(--primary) !important;
  background: linear-gradient(135deg, #C99A45 0%, #9E7428 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
  display: inline-block;
}

/* Paragraphs & Lists in Heritage Parchment Section */
.section-cream p,
.section-cream li,
.has-cream-canvas-background-color p,
.has-cream-canvas-background-color li {
  color: #3D352A !important;
}

.section-cream strong,
.section-cream b,
.has-cream-canvas-background-color strong,
.has-cream-canvas-background-color b {
  color: var(--secondary) !important;
  font-weight: 700 !important;
}

/* Muted / Secondary Copy on Parchment */
.section-cream .has-muted-color,
.section-cream p.has-muted-color,
.section-cream .subheading-intro,
.has-cream-canvas-background-color .has-muted-color,
.has-cream-canvas-background-color p.has-muted-color,
.has-cream-canvas-background-color .subheading-intro {
  color: #524A40 !important;
}

/* Contrast preset override inside Parchment Section */
.section-cream .has-contrast-color,
.has-cream-canvas-background-color .has-contrast-color {
  color: #1A1815 !important;
}

/* Eyebrows on Parchment (WCAG AA/AAA Deep Burnished Bronze #8A5607 = 5.75:1) */
.section-cream .section-eyebrow,
.section-cream .hero-eyebrow,
.has-cream-canvas-background-color .section-eyebrow {
  color: #8A5607 !important;
}

/* Hyperlinks on Parchment (WCAG AA/AAA Deep Burnished Bronze #8A5607 = 5.75:1) */
.section-cream a:not(.wp-element-button):not(.wp-block-button__link),
.has-cream-canvas-background-color a:not(.wp-element-button):not(.wp-block-button__link) {
  color: #8A5607 !important;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.2s ease;
}

.section-cream a:not(.wp-element-button):not(.wp-block-button__link):hover,
.has-cream-canvas-background-color a:not(.wp-element-button):not(.wp-block-button__link):hover {
  color: #16281E !important;
}

/* Fleuron Divider on Parchment */
.section-cream .amber-divider::before,
.has-cream-canvas-background-color .amber-divider::before {
  background: linear-gradient(90deg, rgba(201, 154, 69, 0) 0%, #C99A45 100%) !important;
}

.section-cream .amber-divider::after,
.has-cream-canvas-background-color .amber-divider::after {
  background: linear-gradient(90deg, #B45309 0%, rgba(180, 83, 9, 0) 100%) !important;
}

.section-cream .amber-divider__fleuron,
.has-cream-canvas-background-color .amber-divider__fleuron {
  background-color: #B45309 !important;
  box-shadow: 0 0 8px rgba(180, 83, 9, 0.4) !important;
}

/* --------------------------------------------------------------------------
   2. TACTILE CARDS INSIDE WARM-CREAM SECTION
   -------------------------------------------------------------------------- */

.section-cream .tavern-card,
.section-cream .spirit-card,
.section-cream .cask-pump-card,
.section-cream .tactile-card,
.section-cream .wp-block-column.has-surface-background-color,
.has-cream-canvas-background-color .tavern-card,
.has-cream-canvas-background-color .spirit-card,
.has-cream-canvas-background-color .cask-pump-card,
.has-cream-canvas-background-color .tactile-card,
.has-cream-canvas-background-color .wp-block-column.has-surface-background-color {
  background: #FFFFFF !important;
  border: 1px solid #E6DFD5 !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: 0 4px 16px rgba(45, 35, 24, 0.06), 0 1px 3px rgba(45, 35, 24, 0.04) !important;
  color: #171410 !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative;
  box-sizing: border-box !important;
}

.section-cream .tavern-card:hover,
.section-cream .spirit-card:hover,
.section-cream .cask-pump-card:hover,
.section-cream .tactile-card:hover,
.section-cream .wp-block-column.has-surface-background-color:hover,
.has-cream-canvas-background-color .tavern-card:hover,
.has-cream-canvas-background-color .spirit-card:hover,
.has-cream-canvas-background-color .cask-pump-card:hover,
.has-cream-canvas-background-color .tactile-card:hover,
.has-cream-canvas-background-color .wp-block-column.has-surface-background-color:hover {
  border-color: #D97706 !important;
  box-shadow: 0 12px 28px rgba(45, 35, 24, 0.12), 0 0 16px rgba(217, 119, 6, 0.12) !important;
  transform: translateY(-4px) !important;
}

.section-cream .tavern-card h2,
.section-cream .tavern-card h3,
.section-cream .spirit-card h3,
.section-cream .cask-pump-card h3,
.section-cream .tactile-card h3,
.has-cream-canvas-background-color .tavern-card h2,
.has-cream-canvas-background-color .tavern-card h3,
.has-cream-canvas-background-color .spirit-card h3,
.has-cream-canvas-background-color .cask-pump-card h3,
.has-cream-canvas-background-color .tactile-card h3 {
  color: #171410 !important;
}

.section-cream .tavern-card p,
.section-cream .spirit-card p,
.section-cream .cask-pump-card p,
.section-cream .tactile-card p,
.has-cream-canvas-background-color .tavern-card p,
.has-cream-canvas-background-color .spirit-card p,
.has-cream-canvas-background-color .cask-pump-card p,
.has-cream-canvas-background-color .tactile-card p {
  color: #4A3F33 !important;
}

/* Card Icon Badge Housings in Cream Section */
.section-cream .tavern-card[class*="has-icon-"]::before,
.section-cream .spirit-card[class*="has-icon-"]::before,
.section-cream .tactile-card[class*="has-icon-"]::before,
.section-cream .tavern-card__icon-wrap,
.section-cream .spirit-card__icon-wrap,
.has-cream-canvas-background-color .tavern-card[class*="has-icon-"]::before,
.has-cream-canvas-background-color .spirit-card[class*="has-icon-"]::before,
.has-cream-canvas-background-color .tactile-card[class*="has-icon-"]::before,
.has-cream-canvas-background-color .tavern-card__icon-wrap,
.has-cream-canvas-background-color .spirit-card__icon-wrap {
  background-color: rgba(217, 119, 6, 0.10) !important;
  border: 1px solid rgba(217, 119, 6, 0.32) !important;
  box-shadow: 0 2px 8px rgba(45, 35, 24, 0.08) !important;
}

.section-cream .tavern-card[class*="has-icon-"]:hover::before,
.section-cream .spirit-card[class*="has-icon-"]:hover::before,
.section-cream .tactile-card[class*="has-icon-"]:hover::before,
.section-cream .tavern-card:hover .tavern-card__icon-wrap,
.section-cream .spirit-card:hover .spirit-card__icon-wrap,
.has-cream-canvas-background-color .tavern-card[class*="has-icon-"]:hover::before,
.has-cream-canvas-background-color .spirit-card[class*="has-icon-"]:hover::before,
.has-cream-canvas-background-color .tactile-card[class*="has-icon-"]:hover::before,
.has-cream-canvas-background-color .tavern-card:hover .tavern-card__icon-wrap,
.has-cream-canvas-background-color .spirit-card:hover .spirit-card__icon-wrap {
  background-color: rgba(217, 119, 6, 0.18) !important;
  border-color: #D97706 !important;
  box-shadow: 0 0 14px rgba(217, 119, 6, 0.25) !important;
}

/* Publican Quote Box on Cream */
.section-cream .publican-quote-box,
.has-cream-canvas-background-color .publican-quote-box {
  background: #FFFFFF !important;
  border: 1px solid #E6DFD5 !important;
  border-left: 4px solid #B45309 !important;
  border-radius: var(--radius-lg) !important;
  padding: 3rem 2.6rem !important;
  box-shadow: 0 4px 20px rgba(45, 35, 24, 0.08) !important;
}

.section-cream .publican-quote-box::before,
.has-cream-canvas-background-color .publican-quote-box::before {
  color: rgba(180, 83, 9, 0.14) !important;
}

.section-cream .publican-quote-box p,
.has-cream-canvas-background-color .publican-quote-box p {
  color: #171410 !important;
  font-style: italic !important;
}

.section-cream .publican-quote-box cite,
.has-cream-canvas-background-color .publican-quote-box cite {
  color: #B45309 !important;
}

/* BYO Takeaway Plaque on Cream */
.section-cream .tavern-card--byo,
.has-cream-canvas-background-color .tavern-card--byo {
  background: #FFFFFF !important;
  border: 1px solid #E6DFD5 !important;
  border-left: 4px solid #B45309 !important;
  box-shadow: 0 4px 16px rgba(45, 35, 24, 0.06) !important;
}

.section-cream .tavern-card--byo h3,
.has-cream-canvas-background-color .tavern-card--byo h3 {
  color: #171410 !important;
}

.section-cream .tavern-card--byo p,
.has-cream-canvas-background-color .tavern-card--byo p {
  color: #4A3F33 !important;
}

/* Event Full Card Layout on Cream */
.section-cream .event-full,
.has-cream-canvas-background-color .event-full {
  background: #FFFFFF !important;
  border: 1px solid #E6DFD5 !important;
  box-shadow: 0 4px 16px rgba(45, 35, 24, 0.06) !important;
}

.section-cream .event-full__icon,
.has-cream-canvas-background-color .event-full__icon {
  background: radial-gradient(circle at center, rgba(217, 119, 6, 0.12) 0%, rgba(250, 246, 240, 0.9) 100%) !important;
  border-right: 1px solid #E6DFD5 !important;
  color: #B45309 !important;
}

.section-cream .event-full__body h3,
.has-cream-canvas-background-color .event-full__body h3 {
  color: #171410 !important;
}

.section-cream .event-full__body p,
.has-cream-canvas-background-color .event-full__body p {
  color: #4A3F33 !important;
}

.section-cream .freq-badge,
.has-cream-canvas-background-color .freq-badge {
  background: rgba(180, 83, 9, 0.10) !important;
  color: #78350F !important;
  border: 1px solid rgba(180, 83, 9, 0.30) !important;
}

/* Hours Table on Cream */
.section-cream .hours-table tr,
.section-cream .wp-block-table.hours-table tr,
.has-cream-canvas-background-color .hours-table tr,
.has-cream-canvas-background-color .wp-block-table.hours-table tr {
  border-bottom: 1px solid #E6DFD5 !important;
}

.section-cream .hours-table td:first-child,
.section-cream .wp-block-table.hours-table td:first-child,
.has-cream-canvas-background-color .hours-table td:first-child,
.has-cream-canvas-background-color .wp-block-table.hours-table td:first-child {
  color: #171410 !important;
  font-weight: 600;
}

.section-cream .hours-table td:last-child,
.section-cream .wp-block-table.hours-table td:last-child,
.has-cream-canvas-background-color .hours-table td:last-child,
.has-cream-canvas-background-color .wp-block-table.hours-table td:last-child {
  color: #B45309 !important;
  font-weight: 600;
}

/* Split Image Photography on Cream */
.section-cream .split-img img,
.has-cream-canvas-background-color .split-img img {
  border: 1px solid #E6DFD5 !important;
  box-shadow: 0 12px 32px rgba(45, 35, 24, 0.12), 0 2px 6px rgba(45, 35, 24, 0.06) !important;
}

/* --------------------------------------------------------------------------
   3. BUTTONS INSIDE WARM-CREAM SECTION
   -------------------------------------------------------------------------- */

/* Primary Button Shadow Refinement on Cream */
.section-cream .wp-element-button:not(.is-style-outline),
.section-cream .wp-block-button:not(.is-style-outline) .wp-block-button__link,
.has-cream-canvas-background-color .wp-element-button:not(.is-style-outline),
.has-cream-canvas-background-color .wp-block-button:not(.is-style-outline) .wp-block-button__link {
  box-shadow: 0 4px 12px rgba(45, 35, 24, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
}

.section-cream .wp-element-button:not(.is-style-outline):hover,
.section-cream .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.has-cream-canvas-background-color .wp-element-button:not(.is-style-outline):hover,
.has-cream-canvas-background-color .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
  box-shadow: 0 8px 20px rgba(45, 35, 24, 0.25), 0 0 16px rgba(217, 119, 6, 0.25) !important;
  color: #0B0A08 !important;
}

/* High-Contrast Outline Button on Cream */
.section-cream .wp-block-button.is-style-outline .wp-element-button,
.section-cream .wp-block-button.is-style-outline .wp-block-button__link,
.has-cream-canvas-background-color .wp-block-button.is-style-outline .wp-element-button,
.has-cream-canvas-background-color .wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  color: #171410 !important;
  border: 2px solid #B45309 !important;
  box-shadow: 0 2px 8px rgba(45, 35, 24, 0.06) !important;
}

.section-cream .wp-block-button.is-style-outline .wp-element-button:hover,
.section-cream .wp-block-button.is-style-outline .wp-block-button__link:hover,
.has-cream-canvas-background-color .wp-block-button.is-style-outline .wp-element-button:hover,
.has-cream-canvas-background-color .wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: #B45309 !important;
  color: #FFFFFF !important;
  border-color: #B45309 !important;
  box-shadow: 0 4px 14px rgba(180, 83, 9, 0.3) !important;
  transform: translateY(-2px) !important;
}

/* --------------------------------------------------------------------------
   4. ATMOSPHERIC CASK CELLAR SECTION (.section-cellar)
   -------------------------------------------------------------------------- */

.section-cellar,
.wp-block-group.alignfull.section-cellar {
  background: linear-gradient(180deg, #16281E 0%, #101E16 100%) !important;
  color: #FDFBF7 !important;
  padding-top: clamp(4.5rem, 7vw, 6.5rem) !important;
  padding-bottom: clamp(4.5rem, 7vw, 6.5rem) !important;
  padding-left: clamp(1.25rem, 4vw, 3rem) !important;
  padding-right: clamp(1.25rem, 4vw, 3rem) !important;
  position: relative;
  box-sizing: border-box !important;
  border-top: 2px solid var(--primary) !important;
  border-bottom: 2px solid var(--primary) !important;
  box-shadow: inset 0 2px 12px rgba(0, 0, 0, 0.45) !important;
  width: 100% !important;
}

.section-cellar.quick-strip-wrap,
.wp-block-group.alignfull.section-cellar.quick-strip-wrap {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.wp-block-group.has-base-background-color {
  background-color: var(--bg-body) !important;
  color: var(--color-text) !important;
}

.wp-block-group.has-surface-dark-background-color {
  background-color: #16281E !important;
  color: #FDFBF7 !important;
}

.section-cellar h1,
.section-cellar h2,
.section-cellar h3,
.section-cellar h4,
.section-cellar h5,
.section-cellar h6,
.section-cellar .wp-block-heading,
.section-cellar .wp-block-post-title {
  color: #FDFBF7 !important;
}

.section-cellar h1 em,
.section-cellar h2 em,
.section-cellar h3 em,
.section-cellar .wp-block-heading em {
  font-style: italic !important;
  color: var(--primary-light) !important;
  background: linear-gradient(135deg, #FDE68A 0%, #D4AF37 50%, #C99A45 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
  text-shadow: 0 0 30px rgba(201, 154, 69, 0.35) !important;
}

.section-cellar p,
.section-cellar li {
  color: #F6F0E6 !important;
}

.section-cellar .has-muted-color,
.section-cellar p.has-muted-color,
.section-cellar .subheading-intro {
  color: #E2D9C8 !important;
}

.section-cellar .section-eyebrow {
  color: #F5C542 !important;
}

.section-cellar .publican-quote-box {
  background: linear-gradient(180deg, #1C1813 0%, #14110E 100%) !important;
  border: 1px solid rgba(212, 175, 55, 0.45) !important;
  border-left: 4px solid #F5C542 !important;
  margin-top: clamp(3rem, 5vw, 4.25rem) !important;
}

.section-cellar .publican-quote-box p {
  color: #FDFBF7 !important;
}

.section-cellar .publican-quote-box cite,
.section-cellar .publican-quote-box cite a {
  color: #F5C542 !important;
}

/* --------------------------------------------------------------------------
   5. UTILITY & INLINE SHORTCODE ICON ALIGNMENT
   -------------------------------------------------------------------------- */

.tavern-icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  margin-right: 0.45rem;
  line-height: 1;
}

.tavern-icon-wrap svg {
  display: block;
  flex-shrink: 0;
}

/* --------------------------------------------------------------------------
   6. RESPONSIVE REFLOW & MOBILE GUTTERS (<= 560px)
   -------------------------------------------------------------------------- */

@media (max-width: 560px) {
  .section-cream,
  .section-cellar,
  .wp-block-group.alignfull.section-cream,
  .wp-block-group.alignfull.section-cellar {
    padding-top: 3.25rem !important;
    padding-bottom: 3.25rem !important;
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
  }

  .section-cream .tavern-card,
  .section-cream .spirit-card,
  .section-cream .cask-pump-card,
  .section-cream .tactile-card,
  .section-cream .wp-block-column.has-surface-background-color {
    padding: 1.6rem 1.35rem !important;
  }

  .section-cream .publican-quote-box {
    padding: 2rem 1.5rem !important;
  }

  .event-full,
  .section-cream .event-full,
  .section-cellar .event-full {
    grid-template-columns: 1fr !important;
  }

  .event-full__icon,
  .section-cellar .event-full__icon {
    border-right: none !important;
    border-bottom: 1px solid var(--color-border) !important;
    padding: 1.25rem !important;
  }

  .section-cream .event-full__icon {
    border-bottom: 1px solid #E6DFD5 !important;
  }
}

/* ==========================================================================
   7. BESPOKE TAVERN COMPONENTS & LAYOUT UTILITIES
   ========================================================================== */

/* 2-Column Responsive Grid */
.cards-grid-2 {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 2rem !important;
  margin-bottom: 4.5rem !important;
}

.cards-grid-2.mt-casks {
  margin-top: 2.5rem !important;
}

/* Layout Spacing Defaults (Eliminating inline styles from Gutenberg) */
.cards-grid-3,
.cards-grid-4 {
  margin-bottom: 4.5rem !important;
}

.split-layout,
.split-layout.is-reverse {
  margin-bottom: 5.5rem !important;
}

.split-content p,
.split-text p {
  font-size: 1.05rem !important;
  line-height: 1.75 !important;
  margin-bottom: 1.25rem !important;
}

.split-content p:last-of-type,
.split-text p:last-of-type {
  margin-bottom: 2rem !important;
}

.subheading-intro {
  font-size: 1.15rem !important;
  max-width: 680px !important;
  margin: 0 auto 3.5rem auto !important;
  line-height: 1.75 !important;
}

.cask-pump-card h3 {
  margin: 0 0 0.75rem 0 !important;
  color: var(--color-cream) !important;
}

.cask-pump-card p {
  margin: 0 !important;
  line-height: 1.65 !important;
}

.publican-quote-box {
  margin: 4.5rem 0 !important;
}

.tavern-card--facebook {
  text-align: center !important;
  margin-top: 4rem !important;
  margin-bottom: 4.5rem !important;
  padding: 2.8rem 2.5rem !important;
}

.tavern-card--facebook h2 {
  font-family: var(--font-serif) !important;
  font-size: 2rem !important;
  margin: 0.5rem 0 1rem 0 !important;
  color: var(--color-cream) !important;
}

.tavern-card--facebook p {
  max-width: 580px !important;
  margin: 0 auto 1.75rem auto !important;
  line-height: 1.7 !important;
}

.tavern-card--byo {
  padding: 2.6rem !important;
  border-left: 4px solid var(--color-amber) !important;
  margin-bottom: 4.5rem !important;
}

.tavern-card--byo h3 {
  font-family: var(--font-serif) !important;
  font-size: 1.5rem !important;
  margin: 0 0 0.75rem 0 !important;
  color: var(--color-cream) !important;
}

.tavern-card--byo p {
  line-height: 1.7 !important;
  margin-bottom: 1rem !important;
}

.tavern-card--byo p:last-child {
  margin-bottom: 0 !important;
}


@media (max-width: 781px) {
  .cards-grid-2 {
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }
}

/* 3-Column Experience Grid */
.cards-grid-3 {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 2rem !important;
}

@media (max-width: 880px) {
  .cards-grid-3 {
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }
}

/* 4-Column Responsive Grid */
.cards-grid-4 {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 1.75rem !important;
}

@media (max-width: 1024px) {
  .cards-grid-4 {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1.5rem !important;
  }
}

@media (max-width: 560px) {
  .cards-grid-4 {
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
  }
}

/* Split Image & Narrative Layout */
.split-layout {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 4rem !important;
  align-items: center;
}

.split-layout.is-reverse {
  grid-template-columns: 1.15fr 1fr;
}

.split-layout.is-reverse > :first-child {
  order: 2;
}

.split-layout.is-reverse > :last-child {
  order: 1;
}

@media (max-width: 880px) {
  .split-layout,
  .split-layout.is-reverse {
    grid-template-columns: 1fr !important;
    gap: 2.25rem !important;
  }
  .split-layout.is-reverse > :first-child {
    order: 1 !important;
  }
  .split-layout.is-reverse > :last-child {
    order: 2 !important;
  }
}

.split-img img {
  width: 100%;
  height: 380px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid var(--color-border);
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.45);
}

/* Hours Table (Native core/table support) */
.hours-table,
.wp-block-table.hours-table table {
  width: 100%;
  border-collapse: collapse;
}

.hours-table tr,
.wp-block-table.hours-table tr {
  border-bottom: 1px solid rgba(217, 119, 6, 0.12);
}

.hours-table td,
.wp-block-table.hours-table td {
  padding: 0.85rem 0;
  font-size: 0.95rem;
  border: none !important;
}

.hours-table td:first-child,
.wp-block-table.hours-table td:first-child {
  font-weight: 600;
  color: var(--color-cream);
  text-align: left;
}

.hours-table td:last-child,
.wp-block-table.hours-table td:last-child {
  text-align: right;
  color: var(--color-amber-light);
  font-family: var(--font-sans);
  font-weight: 600;
}

/* Responsive Map Frame Component */
.ecclian-map-frame {
  margin-top: clamp(2.5rem, 4vw, 3.5rem) !important;
  margin-bottom: 0 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  border: 1.5px solid var(--primary) !important;
  box-shadow: var(--shadow-tavern) !important;
  background: #16281E !important;
}

.ecclian-map-frame iframe {
  width: 100% !important;
  height: 420px;
  border: 0;
  display: block;
}

.ecclian-map-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
  padding: 1rem 1.5rem !important;
  background: #101E16 !important;
  border-top: 1px solid rgba(201, 154, 69, 0.35) !important;
  color: #FDFBF7 !important;
  font-size: 0.95rem !important;
}

.ecclian-map-footer span {
  color: #E2D9C8 !important;
}

.ecclian-map-footer strong {
  color: #FDFBF7 !important;
}

.ecclian-map-footer a {
  color: #F5C542 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

.ecclian-map-footer a:hover {
  text-decoration: underline !important;
}

@media (max-width: 768px) {
  .ecclian-map-frame iframe {
    height: 320px;
  }
}

/* ==========================================================================
   8. RESPONSIVE REFLOW & HARDWARE-ACCELERATED TRANSITIONS
   ========================================================================== */

/* Zero Horizontal Scroll & Containment */
html, body {
  overflow-x: hidden;
  max-width: 100vw;
}

/* Hardware-Accelerated Smooth Hover Transitions */
.tavern-card,
.spirit-card,
.event-full,
.wp-block-column.has-surface-background-color,
.wp-element-button,
.wp-block-button__link {
  will-change: transform;
  transform: translateZ(0);
}

/* Canonical Responsive Tiers: Mobile Reflow (<= 560px / 375px Viewport) */
@media (max-width: 560px) {
  /* Fluid Card Padding */
  .tavern-card,
  .spirit-card,
  .cask-pump-card,
  .wp-block-column.has-surface-background-color {
    padding: 1.6rem 1.35rem !important;
  }

  .publican-quote-box {
    padding: 2rem 1.5rem !important;
  }

  /* Quick Strip Grid on Mobile */
  .quick-strip-inner {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem 1rem !important;
    padding: 1rem 1.25rem !important;
  }

  .quick-strip-item {
    font-size: 0.82rem !important;
  }

  /* Event Full Mobile Stacking */
  .event-full__body {
    padding: 1.6rem 1.35rem !important;
  }

  /* Split Layout Spacing */
  .split-layout,
  .split-layout.is-reverse {
    gap: 1.75rem !important;
  }

  /* Hours Table Mobile Typography */
  .hours-table td {
    padding: 0.65rem 0 !important;
    font-size: 0.88rem !important;
  }
}

/* ==========================================================================
   9. THEME V3.0 — EDITORIAL TAVERN ARCHITECTURE (UI/UX PRO MAX)
   ========================================================================== */

/* --- 9.1 Horizontal Brass & Chalkboard Tap Ledger --- */
.tap-ledger-wrap {
  max-width: 1120px !important;
  margin: 2.5rem auto clamp(4.25rem, 6.5vw, 5.75rem) auto !important;
  background: linear-gradient(165deg, rgba(26, 20, 16, 0.94) 0%, rgba(16, 30, 22, 0.96) 100%) !important;
  border: 1.5px solid rgba(201, 154, 69, 0.45) !important;
  border-radius: 16px !important;
  padding: clamp(1.5rem, 3.5vw, 2.75rem) !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(212, 175, 55, 0.25) !important;
}

.tap-ledger-wrap:last-child {
  margin-bottom: 0 !important;
}

.tap-ledger-row {
  display: grid !important;
  grid-template-columns: 70px 1.6fr 1fr !important;
  align-items: center !important;
  gap: 1.5rem !important;
  padding: 1.45rem 0.75rem !important;
  border-bottom: 1px solid rgba(201, 154, 69, 0.22) !important;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.25s ease !important;
  margin: 0 !important;
}

.tap-ledger-row:last-child {
  border-bottom: none !important;
}

.tap-ledger-row:hover {
  background: rgba(201, 154, 69, 0.07) !important;
  transform: translateX(6px) !important;
  border-radius: 10px !important;
}

.tap-ledger-num p {
  font-family: var(--font-condensed) !important;
  font-size: clamp(2.2rem, 3.5vw, 3rem) !important;
  line-height: 1 !important;
  color: var(--primary-light) !important;
  margin: 0 !important;
  letter-spacing: 0.04em !important;
  text-shadow: 0 2px 12px rgba(201, 154, 69, 0.35) !important;
}

.tap-ledger-info h3 {
  font-family: var(--font-serif) !important;
  font-size: clamp(1.35rem, 2vw, 1.65rem) !important;
  color: #FDFBF7 !important;
  margin: 0 0 0.25rem 0 !important;
}

.tap-ledger-info p {
  color: #D1C7B7 !important;
  font-size: 0.96rem !important;
  margin: 0 !important;
  line-height: 1.55 !important;
}

.tap-ledger-meta {
  text-align: right !important;
}

.tap-ledger-meta p {
  margin: 0 !important;
  font-family: var(--font-condensed) !important;
  font-size: 1.25rem !important;
  letter-spacing: 0.08em !important;
  color: var(--primary-light) !important;
  text-transform: uppercase !important;
}

.tap-ledger-meta p em {
  font-family: var(--font-serif) !important;
  font-style: italic !important;
  font-size: 1rem !important;
  text-transform: none !important;
  color: #E8E2D8 !important;
  margin-right: 0.65rem !important;
}

@media (max-width: 781px) {
  .tap-ledger-row {
    grid-template-columns: 1fr !important;
    gap: 0.5rem !important;
    padding: 1.25rem 0.5rem !important;
  }
  .tap-ledger-meta {
    text-align: left !important;
  }
}

/* --- 9.2 Publican Cinema Showcase (Lite YouTube & Dailymotion) --- */
.ecclian-cinema-card {
  background: #14100D !important;
  border: 1.5px solid rgba(201, 154, 69, 0.55) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 22px 55px rgba(16, 30, 22, 0.35), 0 0 30px rgba(201, 154, 69, 0.14) !important;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease !important;
}

.ecclian-cinema-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 28px 65px rgba(16, 30, 22, 0.45), 0 0 36px rgba(212, 175, 55, 0.28) !important;
}

.ecclian-cinema-frame {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  background: #0D0A08 !important;
  cursor: pointer !important;
  overflow: hidden !important;
}

.ecclian-cinema-poster,
.ecclian-cinema-video {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

.ecclian-cinema-frame.is-playing .ecclian-cinema-video {
  object-fit: contain !important;
  background: #000 !important;
}

.ecclian-cinema-frame.is-playing .ecclian-cinema-scrim,
.ecclian-cinema-frame.is-playing .ecclian-cinema-badge,
.ecclian-cinema-frame.is-playing .ecclian-cinema-play,
.ecclian-cinema-frame.is-playing .ecclian-cinema-caption {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

button.ecclian-cinema-play {
  border: none !important;
  cursor: pointer !important;
  padding: 0 !important;
}

.ecclian-cinema-frame:hover .ecclian-cinema-poster {
  transform: scale(1.04) !important;
}

.ecclian-cinema-scrim {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(180deg, rgba(16, 30, 22, 0.25) 0%, rgba(20, 16, 13, 0.35) 45%, rgba(16, 12, 9, 0.88) 100%) !important;
  pointer-events: none !important;
}

.ecclian-cinema-badge {
  position: absolute !important;
  top: 1.15rem !important;
  left: 1.15rem !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  padding: 0.4rem 0.85rem !important;
  background: rgba(22, 40, 30, 0.88) !important;
  backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(212, 175, 55, 0.55) !important;
  border-radius: 999px !important;
  font-family: var(--font-condensed) !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.12em !important;
  color: #FDFBF7 !important;
  z-index: 2 !important;
}

.ecclian-cinema-dot {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #D4AF37 !important;
  box-shadow: 0 0 10px #D4AF37 !important;
}

.ecclian-cinema-play {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 76px !important;
  height: 76px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #D4AF37 0%, #C99A45 60%, #9E7428 100%) !important;
  color: #101E16 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.55), 0 0 0 8px rgba(212, 175, 55, 0.22) !important;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease !important;
  z-index: 2 !important;
}

.ecclian-cinema-frame:hover .ecclian-cinema-play {
  transform: translate(-50%, -50%) scale(1.1) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.65), 0 0 0 12px rgba(212, 175, 55, 0.32) !important;
}

.ecclian-cinema-caption {
  position: absolute !important;
  bottom: 1.15rem !important;
  left: 1.25rem !important;
  right: 1.25rem !important;
  z-index: 2 !important;
  pointer-events: none !important;
}

.ecclian-cinema-eyebrow {
  display: block !important;
  font-family: var(--font-condensed) !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.14em !important;
  color: #D4AF37 !important;
  margin-bottom: 0.2rem !important;
}

.ecclian-cinema-title {
  display: block !important;
  font-family: var(--font-serif) !important;
  font-size: clamp(1.15rem, 1.8vw, 1.45rem) !important;
  color: #FDFBF7 !important;
  line-height: 1.25 !important;
}

.ecclian-cinema-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 0.75rem !important;
  padding: 0.9rem 1.25rem !important;
  background: #1A1410 !important;
  border-top: 1px solid rgba(201, 154, 69, 0.28) !important;
  font-size: 0.88rem !important;
  color: #D1C7B7 !important;
}

.ecclian-cinema-footer a {
  font-weight: 700 !important;
  color: #D4AF37 !important;
  text-decoration: none !important;
}

.ecclian-cinema-footer a:hover {
  text-decoration: underline !important;
}

/* --- 9.3 Then & Now Archival Comparison (1930s Hunt vs Today at 27 High Street) --- */
.archival-compare-card {
  background: #FFFFFF !important;
  border: 1.5px solid #E2D9C8 !important;
  border-top: 4px solid var(--primary) !important;
  border-radius: 14px !important;
  padding: 1.35rem !important;
  box-shadow: var(--shadow-tavern) !important;
  height: 100% !important;
}

.section-cellar .archival-compare-card {
  background: rgba(26, 20, 16, 0.92) !important;
  border-color: rgba(201, 154, 69, 0.4) !important;
}

.archival-compare-card figure.wp-block-image {
  margin: 0 0 1.15rem 0 !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  border: 1px solid rgba(201, 154, 69, 0.35) !important;
}

.archival-compare-card figure.wp-block-image img {
  width: 100% !important;
  height: 320px !important;
  object-fit: cover !important;
  display: block !important;
}

/* --- 9.4 Asymmetric Bento Photo & Press Proof Cards --- */
.press-proof-card {
  background: linear-gradient(155deg, #16281E 0%, #101E16 100%) !important;
  border: 1.5px solid rgba(201, 154, 69, 0.48) !important;
  border-radius: 14px !important;
  padding: 1.85rem !important;
  color: #FDFBF7 !important;
  box-shadow: 0 14px 34px rgba(16, 30, 22, 0.18) !important;
  height: 100% !important;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease !important;
}

.press-proof-card:hover {
  transform: translateY(-4px) !important;
  border-color: #D4AF37 !important;
}

.press-proof-card h3 {
  color: #FDFBF7 !important;
  margin-top: 0.35rem !important;
  margin-bottom: 0.65rem !important;
}

.press-proof-card p {
  color: #E8E2D8 !important;
  font-size: 0.96rem !important;
}

.press-proof-card a {
  color: #D4AF37 !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

