/*
Theme Name: CCEC Child Theme
Theme URI: https://ccec.fife.ac.uk
Author: Fife College
Author URI: https://fife.ac.uk
Description: A child theme for the Carnegie Conference and Events Centre (CCEC) at Fife College. Extends Astra with custom templates, ACF integration, and venue showcase features. Requires Astra parent theme, ACF (Free), and includes CCEC Core MU plugin for security, SEO (fallback), and sitemap.
Version: 3.4.0
Requires at least: 6.5
Tested up to: 6.9.1
Requires PHP: 8.1
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ccec-theme
Template: astra
Tags: child-theme, astra, acf, block-patterns, custom-colors, custom-logo, custom-menu, education, events, responsive, seo-friendly
*/

/* ============================================
   TABLE OF CONTENTS
   ============================================
   1.  CSS Custom Properties (Design Tokens)
   2.  Keyframe Animations
   3.  Reset & Base Styles
   4.  Layout & Container
   5.  Top Bar
   6.  Header Styles
   7.  Navigation Styles
   8.  Hero Section
   9.  Facilities Section
  10.  Venue Showcase Section
  11.  Testimonials Section
  12.  Location Section
  12b. Café 1899 Section
  13.  Booking / Contact Section
  14.  Footer Styles
  15.  Form Styles
  16.  Inner Page Styles
  17.  Utility Classes
  18.  Scroll-Driven Animations
  19.  Accessibility
  20.  Print Styles
  21.  Responsive Breakpoints
  22.  Events Calendar
  23.  News / Blog
   ============================================ */


/* ============================================
   1. CSS CUSTOM PROPERTIES (DESIGN TOKENS)
   ============================================ */
:root {
	/* ── Brand Colours (CCEC brand guidelines) ──
	   Core palette: warm rust/orange + sage green.  Primary CTA colour
	   is a warm rust — confident, premium, distinctive.  Green is the
	   natural accent reflecting the venue's setting.  Extended
	   tints/shades give designers room to breathe creatively without
	   leaving the brand.                                            */
	--ccec-primary:           #C86A2E;
	--ccec-primary-light:     #E08040;
	--ccec-primary-dark:      #9A4A1D;
	--ccec-primary-tint:      #FDF2EC;

	/* Green — natural accent, secondary CTAs, depth */
	--ccec-secondary:         #89966C;
	--ccec-secondary-light:   #A8B48D;
	--ccec-secondary-dark:    #6B7554;
	--ccec-secondary-tint:    #F2F5EE;

	/* Extended brand palette — orange/rust scale */
	--ccec-orange-50:         #FDF2EC;
	--ccec-orange-100:        #F9DCC8;
	--ccec-orange-200:        #E8A672;
	--ccec-orange-300:        #D47844;
	--ccec-orange-400:        #CE7139;
	--ccec-orange-500:        #C86A2E;
	--ccec-orange-600:        #9A4A1D;
	--ccec-orange-700:        #8A4219;
	--ccec-orange-800:        #6B3313;
	--ccec-orange-900:        #4A230D;

	/* Extended brand palette — green scale */
	--ccec-green-50:          #F2F5EE;
	--ccec-green-100:         #DFE6D5;
	--ccec-green-200:         #C4D1B2;
	--ccec-green-300:         #A8B48D;
	--ccec-green-400:         #99A87D;
	--ccec-green-500:         #89966C;
	--ccec-green-600:         #7A8660;
	--ccec-green-700:         #6B7554;
	--ccec-green-800:         #5A6347;
	--ccec-green-900:         #3D4430;

	/* Accent — warm gold for highlights */
	--ccec-accent:            #C8963A;

	/* Neutral Colours (Cool Gray 10 C anchored) */
	--ccec-white:       #FFFFFF;
	--ccec-off-white:   #F7F7F9;
	--ccec-light-grey:  #E5E5E5;
	--ccec-mid-grey:    #999999;
	--ccec-dark-grey:   #616365;
	--ccec-charcoal:    #333333;
	--ccec-black:       #1A1A1A;

	/* RGB split for use in rgba() without hardcoding — e.g. rgba(var(--ccec-primary-rgb), 0.15) */
	--ccec-primary-rgb:   200 106 46;
	--ccec-secondary-rgb: 137 150 108;

	/* Deep neutrals for premium dark sections and the footer gradient.
	   Warm-near-black: avoids the cold-blue/purple cast of #0f0a14 era. */
	--ccec-deep-dark:      #0d0c0a;
	--ccec-deep-dark-warm: #111009;

	/* Semantic feedback — accessible without being off-brand */
	--ccec-success-bg:   #edfdf7;
	--ccec-success-text: #15643e;
	--ccec-success-border: #6bcfa0;
	--ccec-error-bg:     #fff0f0;
	--ccec-error-text:   #b91c1c;
	--ccec-error-border: #f9a8a8;

	/* Glassmorphism */
	--ccec-glass:        rgba(255, 255, 255, 0.06);
	--ccec-glass-bg:     rgba(255, 255, 255, 0.08);
	--ccec-glass-border: rgba(255, 255, 255, 0.12);
	--ccec-glass-bg-light: rgba(255, 255, 255, 0.7);

	/* Typography — editorial-grade Open Sans with tight display hierarchy.
	   Extreme weight contrast and tracking for editorial presence. */
	--ccec-font-family:     'Open Sans', sans-serif;

	/* ── Fluid Typography Scale (clamp min, preferred, max) ── */
	--ccec-font-size-xs:     clamp(0.7rem, 0.65rem + 0.25vw, 0.75rem);
	--ccec-font-size-small:  clamp(0.8rem, 0.75rem + 0.25vw, 0.875rem);
	--ccec-font-size-medium: clamp(0.9rem, 0.85rem + 0.25vw, 1rem);
	--ccec-font-size-large:  clamp(1rem, 0.9rem + 0.5vw, 1.125rem);
	--ccec-font-size-xl:     clamp(1.25rem, 1rem + 1.25vw, 1.5rem);
	--ccec-font-size-2xl:    clamp(1.5rem, 1rem + 2vw, 2rem);
	--ccec-font-size-3xl:    clamp(2rem, 1.25rem + 3vw, 3rem);
	--ccec-font-size-4xl:    clamp(2.5rem, 1.5rem + 4vw, 3.75rem);
	--ccec-font-size-5xl:    clamp(3rem, 1.75rem + 5vw, 4.5rem);

	/* ── Display Typography (hero/stat headings) ── */
	--ccec-display-tracking:  -0.035em;
	--ccec-heading-tracking:  -0.02em;
	--ccec-label-tracking:    0.15em;

	/* Spacing — generous, editorial-grade whitespace */
	--ccec-spacing-xs:   0.25rem;
	--ccec-spacing-sm:   0.5rem;
	--ccec-spacing-md:   1rem;
	--ccec-spacing-lg:   1.5rem;
	--ccec-spacing-xl:   2rem;
	--ccec-spacing-2xl:  3rem;
	--ccec-spacing-3xl:  4rem;
	--ccec-spacing-4xl:  6rem;
	--ccec-spacing-5xl:  8rem;

	/* ── Luxurious Section Padding ── */
	--ccec-section-pad-v:   clamp(4.5rem, 2.5rem + 7.52vw, 8rem);
	--ccec-section-pad-h:   clamp(1.5rem, 1rem + 2vw, 3rem);

	/* Layout */
	--ccec-container:    1280px;

	/* Border Radius */
	--ccec-radius-sm:    6px;
	--ccec-radius-md:    12px;
	--ccec-radius-lg:    16px;
	--ccec-radius-xl:    20px;
	--ccec-radius-2xl:   28px;
	--ccec-radius-pill:  9999px;

	/* ── Spring & Expo Easing ── */
	--ccec-ease-spring:     cubic-bezier(0.34, 1.56, 0.64, 1);
	--ccec-ease-expo:       cubic-bezier(0.16, 1, 0.3, 1);
	--ccec-ease-out-quint:  cubic-bezier(0.22, 1, 0.36, 1);

	/* Transitions */
	--ccec-transition-fast:    0.15s ease;
	--ccec-transition-normal:  0.3s ease;
	--ccec-transition-slow:    0.45s ease;
	--ccec-transition-spring:  0.5s var(--ccec-ease-spring);
	/* Alias so both names resolve to the same value */
	--ccec-ease-out-expo:      var(--ccec-ease-expo);

	/* Shadows — layered for premium depth */
	--ccec-shadow-sm:      0 1px 2px rgba(0, 0, 0, 0.04), 0 1px 3px rgba(0, 0, 0, 0.06);
	--ccec-shadow-md:      0 4px 6px rgba(0, 0, 0, 0.03), 0 10px 24px rgba(0, 0, 0, 0.08);
	--ccec-shadow-lg:      0 8px 16px rgba(0, 0, 0, 0.04), 0 24px 64px rgba(0, 0, 0, 0.12);
	--ccec-shadow-xl:      0 12px 24px rgba(0, 0, 0, 0.06), 0 40px 80px rgba(0, 0, 0, 0.14);
	--ccec-shadow-primary: 0 12px 40px rgba(200, 106, 46, 0.35), 0 0 20px rgba(200, 106, 46, 0.15);
	--ccec-shadow-glow:    0 0 40px rgba(200, 106, 46, 0.25), 0 0 80px rgba(200, 106, 46, 0.1);

	/* Neutral scale (aliases for flexible content blocks) */
	--ccec-neutral-500:  #999999;
	--ccec-neutral-600:  #777777;
	--ccec-neutral-700:  #616365;
	--ccec-neutral-800:  #444444;
	--ccec-neutral-900:  #1A1A1A;

	/* Modern premium shadows — soft/hover pair for floating cards */
	--ccec-shadow-soft:  0 10px 30px -5px rgba(0, 0, 0, 0.04), 0 4px 6px -2px rgba(0, 0, 0, 0.02);
	--ccec-shadow-hover: 0 20px 40px -5px rgba(0, 0, 0, 0.08), 0 8px 10px -2px rgba(0, 0, 0, 0.04);
	--ccec-shadow-editorial: 0 25px 50px -12px rgba(0, 0, 0, 0.06);

	/* Surface tokens */
	--ccec-surface-alt:  #F8FAFC;
	--ccec-surface-card: #FFFFFF;

	/* Border tokens */
	--ccec-border-light: #E5E5E5;

	/* Spacing shorthand aliases */
	--ccec-space-sm:  0.5rem;
	--ccec-space-md:  1rem;
	--ccec-space-lg:  1.5rem;
	--ccec-space-xl:  2rem;
	--ccec-space-2xl: 3rem;
	--ccec-space-3xl: 4rem;

	/* Brand gradients */
	--ccec-gradient-brand: linear-gradient(135deg, #C86A2E 0%, #9A4A1D 100%);
	--ccec-gradient-accent: linear-gradient(135deg, #D47844 0%, #C86A2E 100%);
	--ccec-gradient-hero: linear-gradient(180deg, rgba(20, 20, 20, 0.90) 0%, rgba(30, 22, 15, 0.80) 25%, rgba(50, 35, 20, 0.65) 50%, rgba(45, 30, 18, 0.68) 75%, rgba(40, 25, 14, 0.72) 100%);
	--ccec-gradient-secondary: linear-gradient(135deg, #89966C 0%, #6B7554 100%);

	/* Block spacing controls — generous editorial-grade vertical rhythm.
	   Values: 0.5 = compact, 1 = default, 1.5 = spacious, 2 = very spacious */
	--ccec-block-spacing-scale: 1;
	--ccec-block-pad-v: calc(6.5rem * var(--ccec-block-spacing-scale));
	--ccec-block-pad-h: calc(2.5rem * var(--ccec-block-spacing-scale));
	--ccec-block-gap: calc(5rem * var(--ccec-block-spacing-scale));

	/* Per-direction overrides — set via ACF Options "Block Spacing" tab.
	   When set, these override the scale-based values above. */
	--ccec-block-pad-v-top: var(--ccec-block-pad-v);
	--ccec-block-pad-v-bottom: var(--ccec-block-pad-v);
	--ccec-block-gap-top: var(--ccec-block-gap);
	--ccec-block-gap-bottom: calc(var(--ccec-block-gap) * 0.3);

	/* Color scheme — tells the browser this site supports light mode.
	   Native browser controls (scrollbars, form inputs, color pickers)
	   will follow. Full dark mode requires refactoring color variables
	   from color-named (--ccec-white) to purpose-named (--ccec-bg)
	   tokens — deferred to a future release. */
	color-scheme: light;
}


/* ============================================
   2. KEYFRAME ANIMATIONS
   ============================================ */
@keyframes fadeUp {
	from { opacity: 0; transform: translateY(30px); }
	to   { opacity: 1; transform: none; }
}

@keyframes fadeIn {
	from { opacity: 0; }
	to   { opacity: 1; }
}

@keyframes scaleIn {
	from { opacity: 0; transform: scale(0.92); }
	to   { opacity: 1; transform: none; }
}

@keyframes slideRight {
	from { opacity: 0; transform: translateX(-40px); }
	to   { opacity: 1; transform: none; }
}

@keyframes slideLeft {
	from { opacity: 0; transform: translateX(40px); }
	to   { opacity: 1; transform: none; }
}

@keyframes float {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-12px); }
}

@keyframes shimmer {
	0%   { background-position: -200% center; }
	100% { background-position: 200% center; }
}

@keyframes pulseGlow {
	0%, 100% { box-shadow: 0 0 0 0 rgba(200, 106, 46, 0.4); }
	50%      { box-shadow: 0 0 0 12px rgba(200, 106, 46, 0); }
}

@keyframes gradientShift {
	0%   { background-position: 0% 50%; }
	50%  { background-position: 100% 50%; }
	100% { background-position: 0% 50%; }
}


@keyframes borderGlow {
	0%, 100% { border-color: rgba(200, 106, 46, 0.3); }
	50%      { border-color: rgba(200, 106, 46, 0.7); }
}

@keyframes revealLine {
	from { transform: scaleX(0); }
	to   { transform: scaleX(1); }
}

@keyframes heroTextIn {
	from { opacity: 0; transform: translateY(40px); filter: blur(8px); }
	to   { opacity: 1; transform: none; filter: blur(0); }
}

@keyframes heroStatsIn {
	from { opacity: 0; transform: translateY(20px); }
	to   { opacity: 1; transform: none; }
}

@keyframes fabPulse {
	0%, 100% { box-shadow: 0 4px 20px rgba(200, 106, 46, 0.3), 0 0 0 0 rgba(200, 106, 46, 0.3); }
	50%      { box-shadow: 0 4px 20px rgba(200, 106, 46, 0.3), 0 0 0 14px rgba(200, 106, 46, 0); }
}

@keyframes dotFloat {
	0%, 100% { opacity: 0.3; transform: scale(1); }
	50%      { opacity: 0.6; transform: scale(1.5); }
}

@keyframes mobileNavIn {
	from {
		opacity: 0;
		transform: translateY(14px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* ── View Transitions (cross-document page morphing) ── */
@view-transition {
	navigation: auto;
}
::view-transition-old(root) {
	animation: 0.25s ease-out both ccec-vt-fade-out;
}
::view-transition-new(root) {
	animation: 0.3s ease-in 0.1s both ccec-vt-fade-in;
}
@keyframes ccec-vt-fade-out {
	from { opacity: 1; }
	to   { opacity: 0; }
}
@keyframes ccec-vt-fade-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}
.site-header { view-transition-name: site-header; }
::view-transition-old(site-header),
::view-transition-new(site-header) {
	animation: none;
}


/* ============================================
   2b. ASTRA PARENT THEME OVERRIDES
   Prevents Astra's defaults from interfering
   with CCEC child theme styles.
   ============================================ */

/* --- Neutralise Astra inline CSS custom properties ---
   Astra injects --ast-container-default-*-padding variables via an
   inline <style> tag in <head>.  These can bleed into child theme
   elements if any Astra layout class is inherited.  Override them at
   :root so child theme spacing tokens always win.                   */
:root {
	--ast-container-default-xlg-padding: 0;
	--ast-container-default-lg-padding: 0;
	--ast-container-default-slg-padding: 0;
	--ast-container-default-md-padding: 0;
	--ast-container-default-sm-padding: 0;
	--ast-container-default-xs-padding: 0;
	--ast-container-default-xxs-padding: 0;
}

/* --- Astra Layout / Container --- */
.ast-container,
.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-comment-list li.depth-1,
.ast-separate-container .comment-respond {
	background-color: transparent;
	padding: 0;
	margin: 0;
}

.ast-separate-container,
.ast-plain-container {
	background: transparent;
}

.ast-separate-container .site-main > .ast-row,
.ast-plain-container .site-main > .ast-row {
	padding: 0;
	margin: 0;
}

/* Astra site-content wrapper — remove any inherited padding/margin */
.site-content {
	padding: 0;
	margin: 0;
}

.site-content > .ast-container {
	padding: 0;
	margin: 0 auto;
	max-width: 100%;
}

/* --- Astra Typography --- */
body,
.entry-content p,
.entry-content li,
.ast-comment-list .comment-content {
	font-family: var(--ccec-font-family);
	font-size: 1.125rem;
	line-height: 1.7;
	color: var(--ccec-charcoal);
}

.entry-title,
.entry-title a,
h1.entry-title {
	font-family: var(--ccec-font-family);
}

/* --- Astra Button Overrides --- */
.ast-button,
.ast-custom-button,
button,
.button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.wp-block-button__link,
.ast-single-post .entry-content .wp-block-button .wp-block-button__link {
	font-family: var(--ccec-font-family);
	font-weight: 600;
	border-radius: var(--ccec-radius-pill);
	transition: all var(--ccec-transition-normal);
}

/* --- Astra Ghost-Button Neutraliser ---
   Buttons used as UI controls (accordion triggers, modal closes, tab nav,
   carousel nav, toggles) must NOT inherit Astra's coloured button hover
   background. Without this, the new orange branding palette produces
   orange-text-on-orange-background contrast collapses inside accordions,
   tab strips, modals, and the mobile menu. */
.faq-accordion__trigger,
.mobile-toggle,
.menu-toggle,
.modal-close,
.modal__close,
.testimonials__nav,
.testimonials__nav-btn,
.testimonials__dot,
.tab-nav__btn,
.search-toggle,
.header-search-btn,
.ccec-tabs__tab,
button[class*="__trigger"],
button[class*="__toggle"]:not([class*="fab__toggle"]):not([class*="ccec-contact"]),
button[class*="__close"]:not(.btn):not(.button),
button[class*="__nav-btn"],
button[class*="__dot"],
button.is-ghost,
button.has-no-background {
	background-color: transparent;
	background-image: none;
	box-shadow: none;
}

.faq-accordion__trigger:hover,
.faq-accordion__trigger:focus,
.mobile-toggle:hover,
.mobile-toggle:focus,
.menu-toggle:hover,
.menu-toggle:focus,
.modal-close:hover,
.modal__close:hover,
.testimonials__nav:hover,
.testimonials__nav-btn:hover,
.testimonials__dot:hover,
.tab-nav__btn:hover,
.search-toggle:hover,
.header-search-btn:hover,
.ccec-tabs__tab:hover,
.ccec-tabs__tab:focus,
button[class*="__trigger"]:hover,
button[class*="__toggle"]:not([class*="fab__toggle"]):not([class*="ccec-contact"]):hover,
button[class*="__close"]:not(.btn):not(.button):hover,
button[class*="__nav-btn"]:hover,
button[class*="__dot"]:hover,
button.is-ghost:hover,
button.has-no-background:hover {
	background-color: transparent;
	background-image: none;
}

/* --- Astra Header Overrides --- */
.main-header-bar {
	border-bottom: none;
	box-shadow: none;
}

.ast-primary-header-bar,
.ast-above-header-bar,
.ast-below-header-bar {
	background-color: transparent;
}

/* --- Astra Footer Overrides --- */
.site-footer,
.ast-footer-overlay,
.ast-small-footer {
	background-color: transparent;
	border-top: none;
}

.ast-small-footer .ast-footer-copyright,
.ast-small-footer .ast-footer-copyright a {
	font-family: var(--ccec-font-family);
	color: var(--ccec-mid-grey);
}

/* --- Astra Widget Overrides --- */
.widget,
.widget-title {
	font-family: var(--ccec-font-family);
}

/* --- Astra Sidebar Overrides --- */
.ast-separate-container .ast-article-single .ast-article-inner,
.ast-separate-container .ast-article-post .ast-article-inner {
	padding: 0;
}

.ast-separate-container #secondary {
	padding: 0;
}

/* --- Astra Link Colors --- */
a,
a:visited {
	color: var(--ccec-primary);
	text-decoration: none;
}

a:hover,
a:focus {
	color: var(--ccec-primary-dark);
}

/* --- Astra Breadcrumb Overrides --- */
.ast-breadcrumbs .trail-items,
.ast-breadcrumbs .trail-items a {
	font-family: var(--ccec-font-family);
	font-size: var(--ccec-font-size-small);
}

/* --- Astra Form Overrides --- */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
textarea,
select {
	font-family: var(--ccec-font-family);
	border-radius: var(--ccec-radius-sm);
	border: 1px solid var(--ccec-light-grey);
	padding: 0.625rem 0.875rem;
	font-size: var(--ccec-font-size-medium);
	color: var(--ccec-charcoal);
	transition: border-color 0.2s, box-shadow 0.2s;
}

/* Chrome/Edge clip <select> option text when the control is short: the parent
   theme (Astra) forces height:40px on selects, and with box-sizing + padding the
   content box is left too small for the glyphs (Firefox is lenient). height:auto
   lets the padding size the control; line-height:normal keeps the metrics tidy.
   Component selects (.ccec-contact-form, .calendar-controls__category) reassert
   this at higher specificity in case Astra's inline CSS wins the source-order tie. */
select {
	height: auto;
	line-height: normal;
}

input::placeholder,
textarea::placeholder {
	color: var(--ccec-mid-grey);
	opacity: 1;
}

input:focus,
textarea:focus,
select:focus {
	border-color: var(--ccec-primary);
	box-shadow: 0 0 0 3px rgba(200, 106, 46, 0.15);
	outline: 2px solid transparent;
}

/* --- Astra Entry Content Spacing --- */
.ast-separate-container .entry-content {
	margin: 0;
}

/* --- Astra Blog / Archive Overrides --- */
.ast-separate-container .ast-article-post {
	margin-bottom: 0;
	padding-bottom: 0;
}

/* --- Astra Mobile Menu Overrides --- */
.ast-mobile-popup-drawer .ast-mobile-popup-inner,
.ast-mobile-header-content {
	font-family: var(--ccec-font-family);
}

/* --- Astra Search Overrides --- */
.search-form,
.ast-search-menu-icon form {
	font-family: var(--ccec-font-family);
}

/* --- Astra Pagination Overrides --- */
.ast-pagination,
.ast-pagination a,
.ast-pagination .page-numbers {
	font-family: var(--ccec-font-family);
}

/* --- Astra WooCommerce Overrides (safety) --- */
.ast-woocommerce-container {
	font-family: var(--ccec-font-family);
}

/* --- Astra Scroll-to-top (hide — CCEC has own FAB) --- */
#ast-scroll-top {
	display: none !important;
	visibility: hidden !important;
}

/* --- Astra Content Area Width --- */
.ast-container {
	max-width: var(--ccec-container);
}

/* --- Disable Astra's default post meta styles --- */
.ast-single-post .entry-header .entry-meta,
.ast-single-post .entry-header .entry-meta * {
	font-family: var(--ccec-font-family);
}


/* ============================================
   3. RESET & BASE STYLES
   ============================================ */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	font-size: 16px;
	-webkit-text-size-adjust: 100%;
	/* Native browser scrolling — no smooth-scroll hijacking. scroll-padding-top
	   keeps in-page anchor jumps clear of the fixed header. */
	scroll-padding-top: 90px;
}

html {
	background-color: var(--ccec-surface-alt, #F8FAFC);
}

body {
	margin: 0;
	padding: 0;
	font-family: var(--ccec-font-family);
	font-size: 1.125rem;
	font-optical-sizing: auto;
	line-height: 1.7;
	color: var(--ccec-charcoal);
	background-color: transparent !important;
	font-feature-settings: 'kern' 1, 'liga' 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
	margin-top: 0;
	font-weight: 700;
	line-height: 1.08;
	color: var(--ccec-black);
	font-feature-settings: 'kern' 1, 'liga' 1;
	text-wrap: balance;
}

/* Display headings — tight tracking, bold weight.
   Open Sans compensates for lack of serif with extreme weight
   and negative tracking. */
h1, h2 {
	font-family: var(--ccec-font-family);
	font-weight: 800;
	letter-spacing: -0.025em;
}

h3 {
	font-family: var(--ccec-font-family);
	font-weight: 700;
	letter-spacing: -0.01em;
}

h1 { font-size: clamp(2.5rem, 5.5vw, var(--ccec-font-size-5xl)); }
h2 { font-size: clamp(1.875rem, 4.5vw, var(--ccec-font-size-3xl)); }
h3 { font-size: var(--ccec-font-size-xl); }
h4 { font-size: var(--ccec-font-size-large); }

p {
	margin-top: 0;
	margin-bottom: var(--ccec-spacing-md);
	text-wrap: pretty;
}

ul, ol {
	padding-left: 1.5rem;
	margin-bottom: var(--ccec-spacing-md);
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: var(--ccec-primary-dark);
	text-decoration: none;
	transition: color var(--ccec-transition-fast);
}

a:hover,
a:focus {
	color: var(--ccec-primary);
	text-decoration: underline;
}


/* ============================================
   4. LAYOUT & CONTAINER
   ============================================ */
.container {
	width: 100%;
	max-width: var(--ccec-container);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--ccec-spacing-3xl);
	padding-right: var(--ccec-spacing-3xl);
}

.site-main {
	min-height: calc(100vh - 300px);
}

#page {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

#page > .site-main {
	flex: 1;
}


/* ============================================
   5. TOP BAR
   ============================================ */
.top-bar {
	background-color: var(--ccec-black);
	padding: 0.35rem 0;
	font-size: var(--ccec-font-size-xs);
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.top-bar .container {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

.top-bar-nav {
	display: flex;
	align-items: center;
	gap: 0;
	list-style: none;
	margin: 0;
	padding: 0;
}

.top-bar-nav a {
	color: rgba(255, 255, 255, 0.7);
	padding: 0.25rem 0.85rem;
	border-right: 1px solid rgba(255, 255, 255, 0.12);
	white-space: nowrap;
	letter-spacing: 0.03em;
	transition: color var(--ccec-transition-fast);
}

.top-bar-nav li:last-child a {
	border-right: none;
}

.top-bar-nav a:hover {
	color: var(--ccec-white);
	text-decoration: none;
}


/* ============================================
   6. HEADER STYLES
   ============================================ */
.site-header {
	background: transparent;
	border-bottom: 1px solid transparent;
	position: fixed;
	top: var(--ccec-header-offset, 0px);
	left: 0;
	right: 0;
	z-index: 1000;
	transition: background 0.4s ease,
	            box-shadow 0.4s ease,
	            border-color 0.4s ease,
	            padding 0.3s ease,
	            top 0.4s ease,
	            backdrop-filter 0.3s ease,
	            -webkit-backdrop-filter 0.3s ease;
}

/* Nav scrim: guarantees white nav text has dark backdrop over hero images.
   Sits behind the header bar, extends below it to feather out. Hidden when
   the header turns solid green on scroll. */
.site-header::before {
	content: '';
	position: absolute;
	inset: 0 0 -40px 0;
	background: linear-gradient(
		to bottom,
		rgba(0, 0, 0, 0.55) 0%,
		rgba(0, 0, 0, 0.40) 60%,
		rgba(0, 0, 0, 0) 100%
	);
	pointer-events: none;
	z-index: -1;
	opacity: 1;
	transition: opacity 0.4s ease;
}

.site-header.is-scrolled::before {
	opacity: 0;
}

.site-header.is-scrolled {
	background: rgba(74, 84, 54, 0.97);
	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.18), 0 1px 12px rgba(0, 0, 0, 0.22);
	border-bottom-color: rgba(0, 0, 0, 0.12);
}

@supports (backdrop-filter: blur(12px)) or (-webkit-backdrop-filter: blur(12px)) {
	.site-header.is-scrolled {
		background: rgba(74, 84, 54, 0.95);
		-webkit-backdrop-filter: blur(16px);
		backdrop-filter: blur(16px);
	}
}

/* Inner pages: white nav links over dark banner, switch to brand color when scrolled */
body:not(.is-front-page) .main-navigation > ul > li > a {
	color: var(--ccec-white) !important;
}

body:not(.is-front-page) .main-navigation > ul > li > a:hover,
body:not(.is-front-page) .main-navigation > ul > li > a:focus {
	color: var(--ccec-primary-light) !important;
}

body:not(.is-front-page) .main-navigation > ul > li.current-menu-item > a,
body:not(.is-front-page) .main-navigation > ul > li.current-menu-ancestor > a,
body:not(.is-front-page) .main-navigation > ul > li.current-menu-parent > a {
	color: var(--ccec-primary-light) !important;
}

body:not(.is-front-page) .header-search-btn svg,
body:not(.is-front-page) .mobile-menu-toggle svg {
	color: var(--ccec-white);
}

/* Scrolled header: dark text for white background */
.site-header.is-scrolled .site-branding__text,
.site-header.is-scrolled .site-logo-text {
	color: var(--ccec-white);
}

.site-header.is-scrolled .main-navigation > ul > li > a {
	color: var(--ccec-white) !important;
}

/* Hover/active on the green scrolled header: warm cream (--ccec-orange-100)
   which yields ~9.5:1 contrast on the deep-green nav background, well above
   WCAG AA. The previous --ccec-primary-light (#E08040) was only ~2.5:1. */
.site-header.is-scrolled .main-navigation > ul > li > a:hover {
	color: var(--ccec-orange-100) !important;
}

.site-header.is-scrolled .main-navigation > ul > li.current-menu-item > a,
.site-header.is-scrolled .main-navigation > ul > li.current-menu-ancestor > a {
	color: var(--ccec-orange-100) !important;
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 6px;
}

.site-header.is-scrolled .header-cta .btn {
	background: transparent;
	color: var(--ccec-white);
	border-color: rgba(255, 255, 255, 0.6);
}
.site-header.is-scrolled .header-cta .btn:hover {
	background: rgba(255, 255, 255, 0.15);
	border-color: var(--ccec-white);
}

.site-header.is-scrolled .header-search-btn svg,
.site-header.is-scrolled .mobile-toggle svg {
	color: var(--ccec-white);
}

.site-header.is-scrolled .header-inner {
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}

/* Logo height stays constant on scroll — no shrink/squish. The earlier
   max-height: 40px rule was removed at user request: "respect the current
   logo height not manipulate this". Both states inherit the default
   max-height: 55px set further down. */

.site-header.is-hidden {
	transform: translateY(-100%);
}

.header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ccec-spacing-md);
	padding-top: var(--ccec-spacing-sm);
	padding-bottom: var(--ccec-spacing-sm);
	transition: padding var(--ccec-transition-normal);
}

.site-branding {
	flex-shrink: 0;
}

.site-logo img,
.site-branding img {
	max-height: 55px;
	width: auto;
	transition: height 0.3s cubic-bezier(0.22, 1, 0.36, 1),
	            max-height 0.3s cubic-bezier(0.22, 1, 0.36, 1),
	            filter 0.4s ease;
}

/* Logo — no glow; dual-logo swap handles light/dark states */
.site-logo img,
.site-branding img {
	filter: none;
}

.site-title-link {
	text-decoration: none;
	transition: opacity 0.2s ease;
}

.site-title-link:hover {
	opacity: 0.85;
}

.site-title {
	font-size: var(--ccec-font-size-xl);
	font-weight: 800;
	color: var(--ccec-white);
	letter-spacing: -0.02em;
}

.site-title:hover {
	color: var(--ccec-primary-dark);
}

.header-right {
	display: flex;
	align-items: center;
	gap: var(--ccec-spacing-md);
}


/* ============================================
   7. NAVIGATION STYLES
   ============================================ */
.main-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 0;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	display: block;
	color: var(--ccec-white);
	font-weight: 500;
	font-size: 0.875rem;
	padding: 0.5rem 0.65rem;
	white-space: nowrap;
	transition: color var(--ccec-transition-fast);
	position: relative;
	letter-spacing: 0.01em;
}

.main-navigation a:hover {
	color: var(--ccec-primary);
}

/* Nav active state — clean, no underline */
.main-navigation > ul > li > a::after {
	display: none;
}

.main-navigation > ul > li > a:hover,
.main-navigation > ul > li > a:focus {
	color: var(--ccec-primary) !important;
	opacity: 1;
}

.main-navigation > ul > li.current-menu-item > a,
.main-navigation > ul > li.current-menu-ancestor > a,
.main-navigation > ul > li.current-menu-parent > a,
.main-navigation > ul > li.current_page_parent > a {
	color: var(--ccec-primary) !important;
	font-weight: 700;
}

/* Remove old active indicators */
.primary-nav-list .current-menu-item > a::after,
.primary-nav-list a.is-active::after {
	display: none;
}

/* On scrolled dark header, make active indicator brighter */
.site-header.is-scrolled .primary-nav-list .current-menu-item > a::after,
.site-header.is-scrolled .primary-nav-list a.is-active::after {
	background: var(--ccec-primary-light);
}

.main-navigation a:hover,
.main-navigation a:focus {
	color: var(--ccec-primary);
	text-decoration: none;
}

/* Dropdown */
.main-navigation .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 220px;
	background: rgba(255, 255, 255, 0.97);
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: var(--ccec-radius-md);
	box-shadow: var(--ccec-shadow-lg);
	padding: 0.5rem 0;
	z-index: 1001;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-8px);
	transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
	pointer-events: none;
}

.main-navigation li:hover > .sub-menu,
.main-navigation li:focus-within > .sub-menu,
.main-navigation li.is-open > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	pointer-events: auto;
}

.main-navigation .menu-item-has-children > a[aria-expanded="true"] + .sub-menu,
.main-navigation .menu-item-has-children.is-open > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	pointer-events: auto;
}

.main-navigation .sub-menu a {
	padding: 0.5rem 1.25rem;
	font-size: var(--ccec-font-size-small);
	color: var(--ccec-black);
}

.main-navigation .sub-menu a:hover,
.main-navigation .sub-menu a:focus {
	color: var(--ccec-primary);
	background: rgba(200, 106, 46, 0.06);
}

/* ── Astra menu markup compatibility ───────────────────────────────────────
   When a real WordPress menu is assigned, Astra's nav walker outputs links as
   <a class="menu-link"> with a <span class="dropdown-menu-toggle
   ast-header-navigation-arrow"> caret. .menu-link already inherits the
   .main-navigation a styling; the rules below tame the Astra caret and make
   sure nav items never inherit content-list tick markers. */
.main-navigation li::before,
.main-navigation .sub-menu li::before {
	content: none !important; /* nav items never show the content checklist tick */
}

.main-navigation .menu-link {
	display: inline-flex;
	align-items: center;
	gap: 0.3em;
}

/* Render Astra's dropdown caret as a neat chevron in the current nav colour. */
.main-navigation .dropdown-menu-toggle {
	display: inline-flex;
	width: 0.7em;
	height: 0.7em;
	position: relative;
	border: 0;
	background: none;
	flex-shrink: 0;
	cursor: pointer;
}

.main-navigation .dropdown-menu-toggle::before {
	content: '';
	position: absolute;
	top: 45%;
	left: 50%;
	width: 0.42em;
	height: 0.42em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translate(-50%, -50%) rotate(45deg);
	opacity: 0.7;
	transition: transform 0.2s ease;
}

.main-navigation .menu-item-has-children:hover > .menu-link .dropdown-menu-toggle::before,
.main-navigation .menu-item-has-children.is-open > .menu-link .dropdown-menu-toggle::before {
	transform: translate(-50%, -25%) rotate(-135deg);
}

/* Buttons — generous padding, pill shape, subtle gradient
   for depth, arrow slide on hover. */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.625em;
	padding: 0.9375rem 2.25rem;
	border-radius: var(--ccec-radius-pill);
	font-weight: 700;
	font-size: var(--ccec-font-size-medium);
	cursor: pointer;
	border: none;
	text-decoration: none;
	transition: all 0.35s var(--ccec-ease-out-expo);
	white-space: nowrap;
	position: relative;
	overflow: hidden;
	letter-spacing: 0.02em;
}

.btn-primary,
a.btn-primary {
	background: linear-gradient(135deg, var(--ccec-primary) 0%, var(--ccec-primary-dark) 100%);
	color: var(--ccec-white) !important;
	box-shadow: 0 2px 8px rgba(200, 106, 46, 0.15);
}

.btn-primary:hover,
a.btn-primary:hover {
	background: linear-gradient(135deg, var(--ccec-primary-light) 0%, var(--ccec-primary) 100%);
	color: var(--ccec-white) !important;
	text-decoration: none;
	transform: translateY(-3px);
	box-shadow: var(--ccec-shadow-primary);
}

.btn-secondary,
a.btn-secondary {
	background-color: var(--ccec-secondary);
	color: var(--ccec-white) !important;
}

.btn-secondary:hover,
a.btn-secondary:hover {
	background-color: var(--ccec-secondary-dark);
	color: var(--ccec-white) !important;
	text-decoration: none;
	transform: translateY(-2px);
}

/* Single-hyphen aliases for ccec_button() output (generates btn-outline, not btn--outline) */
.btn-outline,
a.btn-outline {
	background-color: transparent;
	/* primary-dark for AA label contrast (#C86A2E was ~3.8:1 at ≤16px); the
	   2px brand-orange border still carries the identity and meets 3:1. */
	color: var(--ccec-primary-dark) !important;
	border: 2px solid var(--ccec-primary);
	padding: 0.875rem 2rem;
	border-radius: var(--ccec-radius-pill);
	font-weight: 600;
	font-size: var(--ccec-font-size-medium);
	cursor: pointer;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	transition: all 0.3s var(--ccec-ease-out-expo);
	white-space: nowrap;
	letter-spacing: 0.01em;
}

.btn-outline:hover,
a.btn-outline:hover,
.btn-outline:focus-visible,
a.btn-outline:focus-visible {
	background-color: var(--ccec-primary);
	border-color: var(--ccec-primary);
	color: var(--ccec-white) !important;
	text-decoration: none;
	transform: translateY(-2px);
	box-shadow: var(--ccec-shadow-primary);
}

.btn-outline:active,
a.btn-outline:active {
	transform: translateY(-1px) scale(0.98);
}

/* BEM button variants */
.btn--primary,
a.btn--primary {
	background: linear-gradient(135deg, var(--ccec-primary) 0%, var(--ccec-primary-dark) 100%);
	color: var(--ccec-white) !important;
	border: 2px solid transparent;
	padding: 0.875rem 2rem;
	border-radius: var(--ccec-radius-pill);
	font-weight: 600;
	font-size: var(--ccec-font-size-medium);
	cursor: pointer;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	transition: all 0.3s var(--ccec-ease-out-expo);
	white-space: nowrap;
	position: relative;
	overflow: hidden;
	letter-spacing: 0.01em;
}

/* Shimmer on hover */
.btn--primary::before {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
	transition: left 0.5s ease;
}

.btn--primary:hover::before {
	left: 100%;
}

.btn--primary:hover,
a.btn--primary:hover,
.btn--primary:focus-visible,
a.btn--primary:focus-visible {
	background: var(--ccec-primary-light);
	color: var(--ccec-white) !important;
	text-decoration: none;
	transform: translateY(-2px);
	box-shadow: 0 0 30px rgba(200, 106, 46, 0.4),
	            0 8px 20px rgba(200, 106, 46, 0.2);
}

.btn--primary:active,
a.btn--primary:active {
	transform: translateY(-1px) scale(0.98);
	box-shadow: 0 4px 12px rgba(200, 106, 46, 0.2);
}

.btn--outline,
a.btn--outline {
	background-color: transparent;
	color: var(--ccec-white) !important;
	border: 2px solid rgba(255, 255, 255, 0.6);
	padding: 0.875rem 2rem;
	border-radius: var(--ccec-radius-pill);
	font-weight: 600;
	font-size: var(--ccec-font-size-medium);
	cursor: pointer;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	transition: all 0.3s var(--ccec-ease-out-expo);
	white-space: nowrap;
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
	letter-spacing: 0.01em;
}

.btn--outline:hover,
a.btn--outline:hover,
.btn--outline:focus-visible,
a.btn--outline:focus-visible {
	background-color: rgba(255, 255, 255, 0.12);
	border-color: var(--ccec-white);
	color: var(--ccec-white) !important;
	text-decoration: none;
	transform: translateY(-3px);
}

.btn--outline:active,
a.btn--outline:active {
	transform: translateY(-1px) scale(0.98);
}

.btn--lg {
	padding: 1.2rem 3.25rem !important;
	font-size: var(--ccec-font-size-large) !important;
	letter-spacing: 0.02em;
	border-radius: var(--ccec-radius-pill) !important;
}

.btn--sm {
	padding: 0.55rem 1.25rem !important;
	font-size: var(--ccec-font-size-small) !important;
}

/* Arrow CTA — Mango-inspired text+arrow links for editorial elegance.
   Used on "Explore →" style CTAs within content sections. */
.btn--arrow {
	background: transparent;
	border: none;
	color: var(--ccec-primary) !important;
	padding: 0.5rem 0;
	font-weight: 700;
	font-size: var(--ccec-font-size-medium);
	letter-spacing: 0.04em;
	text-transform: uppercase;
	border-radius: 0;
	gap: 0.75em;
}

.btn--arrow::after {
	content: '\2192';
	display: inline-block;
	transition: transform 0.3s var(--ccec-ease-out-expo);
	font-size: 1.1em;
}

.btn--arrow:hover {
	color: var(--ccec-primary-dark) !important;
	transform: none;
	box-shadow: none;
	background: transparent;
}

.btn--arrow:hover::after {
	transform: translateX(6px);
}

/* Dark background arrow variant */
.section--dark .btn--arrow,
.booking .btn--arrow {
	color: var(--ccec-green-300) !important;
}

.section--dark .btn--arrow:hover,
.booking .btn--arrow:hover {
	color: var(--ccec-white) !important;
}

/* Mobile hamburger button — hidden on desktop */
.mobile-menu-toggle {
	display: none;
}

/* Icon swap: hamburger shown / close hidden by default */
.mobile-menu-toggle .icon-close    { display: none; }
.mobile-menu-toggle .icon-hamburger { display: block; }

/* When open: show X, hide hamburger */
.mobile-menu-toggle[aria-expanded="true"] .icon-hamburger { display: none; }
.mobile-menu-toggle[aria-expanded="true"] .icon-close     { display: block; }

/* Screen-reader label for toggle-label span */
.toggle-label {
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1;
}


/* ============================================
   8. HERO SECTION
   ============================================ */
.hero {
	position: relative;
	overflow: hidden;
	background-color: var(--ccec-black);
	min-height: calc(100vh - 80px);
	min-height: calc(100svh - 80px);
	display: flex;
	align-items: center;
	padding: clamp(80px, 14vh, 140px) 0 clamp(60px, 10vh, 120px);
	margin-bottom: 0;
}

/* Visual peek: spacing between hero and next section */
.hero + .facilities,
.hero + .section--light,
.hero + .section--light-alt {
	padding-top: var(--ccec-block-pad-v);
}

.hero .container {
	position: relative;
	z-index: 3;
	width: 100%;
}

.hero__content {
	position: relative;
	z-index: 3;
	text-align: center;
}

/* Hero background layers */
.hero__bg {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	background-color: var(--ccec-black);
}

.hero__video {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}

/* Fallback poster image — object-fit cover fills hero regardless of aspect ratio */
.hero__video-fallback {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	inset: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center center;
	z-index: 0;
}

.hero__video-fallback--behind {
	z-index: -1;
}

.hero__bg-gradient {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	inset: 0;
	z-index: 1;
	background: var(--ccec-gradient-hero);
}

/* Fife College logo mark — soft ambient brand texture.
   Large tile with blurred logos so the triangular edges read
   as gentle shapes rather than hard diagonal lines. */
.hero__bg-pattern {
	position: absolute;
	top: -20px; right: -20px; bottom: -20px; left: -20px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 500' width='600' height='500'%3E%3Cdefs%3E%3Cfilter id='soft'%3E%3CfeGaussianBlur stdDeviation='4'/%3E%3C/filter%3E%3Cg id='fc'%3E%3Cpath d='M0,8.8l17.1,8.6l10.7-6.9l-0.3-7.2z'/%3E%3Cpath d='M29.3,42.1l-0.9-19l-11.3-5.7L11,21.3z'/%3E%3Cpath d='M0,8.8l11,12.5l6.1-3.9z'/%3E%3Cpath d='M43.9,0L27.8,10.5l0.6,12.6l6.4,3.2z'/%3E%3Cpath d='M28.4,23.1l0.9,19l5.5-15.8z'/%3E%3Cpath d='M27.4,3.3l0.3,7.2L43.9,0z'/%3E%3C/g%3E%3C/defs%3E%3Cg fill='%23ffffff' filter='url(%23soft)'%3E%3Cuse href='%23fc' transform='translate(40,30) scale(2.8) rotate(12,22,21)'/%3E%3Cuse href='%23fc' transform='translate(340,60) scale(2.2) rotate(-20,22,21)' opacity='0.5'/%3E%3Cuse href='%23fc' transform='translate(160,250) scale(3.2) rotate(35,22,21)' opacity='0.7'/%3E%3Cuse href='%23fc' transform='translate(440,280) scale(2.0) rotate(-45,22,21)' opacity='0.4'/%3E%3Cuse href='%23fc' transform='translate(70,410) scale(2.5) rotate(-15,22,21)' opacity='0.6'/%3E%3C/g%3E%3C/svg%3E");
	background-size: 600px 500px;
	background-repeat: repeat;
	z-index: 2;
	opacity: 0.09;
	mix-blend-mode: overlay;
}

/* Gradient text heading — massive display type. Open Sans 800
   at extreme sizes with tight line-height for commanding presence. */
.hero__heading,
.hero h1 {
	font-size: clamp(3.25rem, 10vw, 7.5rem);
	font-family: var(--ccec-font-family);
	font-weight: 800;
	letter-spacing: -0.035em;
	line-height: 1.2;
	padding-bottom: 0.18em;
	margin-bottom: var(--ccec-spacing-xl);
	overflow: visible;
	max-width: 1040px;
	margin-left: auto;
	margin-right: auto;
	color: var(--ccec-white);
	background: linear-gradient(135deg, #FFFFFF 0%, #E8E0ED 40%, #FFFFFF 75%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	animation: heroTextIn 0.8s var(--ccec-ease-out-expo) both;
	text-shadow: none;
	/* drop-shadow works on gradient text where text-shadow does not */
	filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.55)) drop-shadow(0 1px 4px rgba(0, 0, 0, 0.4));
}

.hero__subheading {
	font-size: clamp(1.15rem, 2.5vw, 1.375rem);
	color: rgba(255, 255, 255, 0.88);
	font-weight: 400;
	margin-bottom: var(--ccec-spacing-xl);
	max-width: 680px;
	margin-left: auto;
	margin-right: auto;
	letter-spacing: 0.01em;
	line-height: 1.7;
	animation: heroTextIn 0.8s var(--ccec-ease-out-expo) 0.15s both;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.6), 0 1px 3px rgba(0, 0, 0, 0.5);
}

.hero__intro {
	max-width: 750px;
	margin-left: auto;
	margin-right: auto;
	font-size: var(--ccec-font-size-large);
	line-height: 1.7;
	animation: heroTextIn 0.8s var(--ccec-ease-out-expo) 0.3s both;
}

.hero__intro,
.hero__intro p {
	color: rgba(255, 255, 255, 0.82);
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.55);
}

.hero__intro p:last-child {
	margin-bottom: 0;
}

/* Hero CTAs */
.hero__cta,
.hero__ctas {
	margin-top: var(--ccec-spacing-2xl);
	display: flex;
	justify-content: center;
	gap: var(--ccec-spacing-md);
	flex-wrap: wrap;
	animation: heroTextIn 0.8s var(--ccec-ease-out-expo) 0.45s both;
}

/* Hero Stats — frosted glass bar */
.hero__stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--ccec-spacing-xl);
	margin-top: var(--ccec-spacing-3xl);
	padding: var(--ccec-spacing-xl) var(--ccec-spacing-2xl);
	background: rgba(0, 0, 0, 0.65); /* Solid fallback for no backdrop-filter */
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: var(--ccec-radius-xl);
	animation: heroStatsIn 0.8s var(--ccec-ease-out-expo) 0.6s both;
}

@supports (backdrop-filter: blur(20px)) or (-webkit-backdrop-filter: blur(20px)) {
	.hero__stats {
		background: rgba(0, 0, 0, 0.45);
		-webkit-backdrop-filter: blur(20px);
		backdrop-filter: blur(20px);
	}
}

.stat-item,
.hero__stat {
	text-align: center;
	color: var(--ccec-white);
}

.stat-item__number,
.hero__stat-number {
	display: block;
	font-size: clamp(2rem, 4vw, 3rem);
	font-family: var(--ccec-font-family);
	font-weight: 700;
	line-height: 1;
	color: var(--ccec-white);
	letter-spacing: -0.01em;
}

.stat-item__suffix {
	font-size: var(--ccec-font-size-xl);
	font-weight: 700;
	color: var(--ccec-white);
}

.stat-item__label,
.hero__stat-label {
	display: block;
	font-size: var(--ccec-font-size-xs);
	color: rgba(255, 255, 255, 0.7);
	margin-top: var(--ccec-spacing-xs);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-weight: 500;
}

/* Visual peek — next section pulls viewer downward */

/* Scroll-driven effects */
@supports (animation-timeline: scroll()) {
	.hero__content {
		animation: fadeIn linear reverse both;
		animation-timeline: scroll();
		animation-range: 0vh 50vh;
	}
}

/* Vimeo background iframe — object-fit:cover emulation for iframes.
   The iframe is sized so it always exceeds the container in both
   dimensions, then centred and clipped by overflow:hidden on .hero__bg.
   A 5% scale boost absorbs any sub-pixel Vimeo internal letterbox.

   Wide viewport  → width = 100vw (fills width);  height = 56.25vw;
                     min-height: 100vh forces height to fill too.
   Tall viewport  → min-width: 177.78vh stretches wider;
                     height proportional via 56.25vw. */
.hero__vimeo {
	position: absolute;
	top: 50%;
	left: 50%;
	/* Cover-fit the fixed 16:9 iframe to the hero in BOTH dimensions at any
	   viewport ratio, so the poster behind it never peeks through. The min
	   dimensions use lvh (largest viewport height = mobile chrome hidden) so the
	   video still covers when the address bar retracts and the viewport grows.
	   The scale absorbs Vimeo's internal letterbox. */
	width: 100vw;
	height: 56.25vw;            /* 9 / 16 = 0.5625 of width */
	min-height: 100vh;          /* fallback for browsers without lvh */
	min-height: 100lvh;
	min-width: 177.78vh;        /* 16 / 9 = 1.7778 of height (fallback) */
	min-width: 177.78lvh;
	transform: translate(-50%, -50%) scale(1.08);
	pointer-events: none;
	border: none;
	z-index: 0;
}


/* ============================================
   9. FACILITIES SECTION
   ============================================ */
.facilities {
	padding: var(--ccec-spacing-5xl) 0;
	position: relative;
}

.facilities__heading {
	font-family: var(--ccec-font-family);
	font-size: clamp(2.25rem, 5.5vw, 3.75rem);
	font-weight: 800;
	line-height: 1.04;
	letter-spacing: -0.03em;
	color: var(--ccec-charcoal);
	margin-bottom: var(--ccec-spacing-lg);
}

.facilities__intro {
	max-width: 700px;
	margin-bottom: var(--ccec-spacing-3xl);
	color: var(--ccec-dark-grey);
	font-size: var(--ccec-font-size-large);
	line-height: 1.8;
}

.facilities__intro p:last-child {
	margin-bottom: 0;
}

.facilities__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--ccec-spacing-3xl);
	align-items: start;
}

/* Facilities content column (text + list side of the grid) */
.facilities__content {
	display: flex;
	flex-direction: column;
	gap: var(--ccec-spacing-sm);
}

.facilities__info-col,
.facilities__content--glass {
	background: var(--ccec-white);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-left: 4px solid var(--ccec-primary);
	border-radius: var(--ccec-radius-xl);
	padding: var(--ccec-spacing-2xl) var(--ccec-spacing-2xl) var(--ccec-spacing-2xl) var(--ccec-spacing-3xl);
	position: relative;
	box-shadow: var(--ccec-shadow-sm);
	transition: box-shadow 0.4s ease, transform 0.4s var(--ccec-ease-out-expo);
}

.facilities__info-col:hover,
.facilities__content--glass:hover {
	box-shadow: var(--ccec-shadow-lg);
	transform: translateY(-4px);
}

/* Clean accent line */
.facilities__info-col::before,
.facilities__content--glass::before {
	content: '';
	position: absolute;
	left: -4px;
	top: 0;
	bottom: 0;
	width: 4px;
	background: linear-gradient(180deg, var(--ccec-primary), var(--ccec-primary-light));
	border-radius: 2px 0 0 2px;
}

.facilities__list ul {
	list-style: none;
	padding: 0;
	margin: 0 0 var(--ccec-spacing-xl);
}

.facilities__list li {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	padding: 0.7rem 0;
	border-bottom: 1px solid var(--ccec-light-grey);
	font-size: var(--ccec-font-size-medium);
	transition: padding-left 0.3s var(--ccec-ease-out-expo), background-color 0.2s ease;
}

.facilities__list li:hover {
	padding-left: 0.4rem;
	background-color: rgba(200, 106, 46, 0.04);
}

.facilities__list li:last-child {
	border-bottom: none;
}

.facilities__list li::before {
	content: "\2713";
	flex-shrink: 0;
	color: var(--ccec-secondary);
	font-weight: 700;
	font-size: var(--ccec-font-size-medium);
	line-height: 1;
	transition: transform 0.3s var(--ccec-transition-spring);
}

.facilities__list li:hover::before {
	transform: scale(1.2);
}

.facilities__closing {
	font-style: italic;
	color: var(--ccec-charcoal);
	font-size: var(--ccec-font-size-medium);
	margin-top: var(--ccec-spacing-lg);
	margin-bottom: 0;
}

/* Info Card — floating, borderless, editorial. */
.info-card {
	background-color: var(--ccec-white);
	border-radius: var(--ccec-radius-2xl);
	padding: var(--ccec-spacing-2xl) var(--ccec-spacing-xl) var(--ccec-spacing-xl);
	box-shadow: var(--ccec-shadow-editorial);
	height: 100%;
	transition: transform 0.4s var(--ccec-ease-out-expo), box-shadow 0.4s ease;
	border: none;
}

.info-card:hover {
	transform: translateY(-6px);
	box-shadow: var(--ccec-shadow-hover);
}

.info-card--featured {
	background: linear-gradient(135deg, var(--ccec-primary-tint) 0%, var(--ccec-white) 100%);
	border-left: 4px solid var(--ccec-primary);
}

.info-card__icon {
	width: 56px;
	height: 56px;
	background: linear-gradient(135deg, var(--ccec-primary) 0%, var(--ccec-primary-dark) 100%);
	border-radius: var(--ccec-radius-md);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: var(--ccec-spacing-lg);
}

.info-card__icon svg {
	width: 24px;
	height: 24px;
	fill: var(--ccec-white);
}

.info-card h3 {
	color: var(--ccec-charcoal);
	margin-bottom: var(--ccec-spacing-sm);
	font-size: var(--ccec-font-size-xl);
}

.info-card p {
	color: var(--ccec-dark-grey);
	font-size: var(--ccec-font-size-medium);
	margin-bottom: var(--ccec-spacing-md);
}

.info-card .btn {
	margin-top: var(--ccec-spacing-sm);
}

/* Facilities Image Stack */
.facilities__image-stack {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: var(--ccec-spacing-md);
	position: sticky;
	top: var(--ccec-spacing-2xl);
	border-radius: var(--ccec-radius-xl);
	overflow: hidden;
}

.facilities__image-stack img {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	display: block;
	border-radius: var(--ccec-radius-xl);
	transition: transform 0.7s var(--ccec-ease-out-expo), box-shadow 0.4s ease;
	box-shadow: var(--ccec-shadow-editorial);
}

.facilities__image-stack img:hover {
	transform: scale(1.04);
	box-shadow: var(--ccec-shadow-xl);
}


/* ============================================
  10. VENUE SHOWCASE SECTION
   ============================================ */
.venue-showcase {
	padding: var(--ccec-spacing-5xl) 0;
	position: relative;
}

.venue-showcase .container > .section-label {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 0.5em;
}

.venue-showcase .container > .section-title {
	display: block;
	text-align: center;
}

/* Bento grid layout — overlay-card style.
   Taller rows + tighter gap for editorial density. */
.showcase-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-auto-rows: 380px;
	gap: var(--ccec-spacing-lg);
	margin-top: var(--ccec-spacing-3xl);
}

.showcase-item {
	position: relative;
	border-radius: var(--ccec-radius-xl);
	overflow: hidden;
	background-color: var(--ccec-black);
	box-shadow: var(--ccec-shadow-md);
	cursor: pointer;
	transition: box-shadow 0.4s var(--ccec-ease-out-expo), transform 0.4s var(--ccec-ease-out-expo);
	will-change: transform;
	display: block;
	text-decoration: none;
	color: inherit;
}

.showcase-item::after {
	content: '';
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	inset: 0;
	background: linear-gradient(
		to bottom,
		rgba(10, 10, 10, 0.0) 0%,
		rgba(10, 10, 10, 0.12) 40%,
		rgba(10, 10, 10, 0.72) 75%,
		rgba(10, 10, 10, 0.88) 100%
	);
	z-index: 1;
	transition: opacity 0.4s ease;
}

.showcase-item:hover {
	box-shadow: var(--ccec-shadow-xl);
	transform: translateY(-6px) scale(1.01);
}

.showcase-item--large {
	grid-row: span 2;
}

.showcase-item--wide {
	grid-column: span 2;
}

/* Image fills entire card */
.showcase-item__image {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	inset: 0;
	overflow: hidden;
	background: var(--ccec-primary-dark);
}

.showcase-item__image img {
	width: 100%;
	height: 115%;
	object-fit: cover;
	object-position: center;
	display: block;
	transition: transform 0.7s var(--ccec-ease-out-expo);
	will-change: transform;
}

.showcase-item:hover .showcase-item__image img {
	transform: scale(1.08);
}

/* Content overlaid at bottom */
.showcase-item__content {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: var(--ccec-spacing-xl) var(--ccec-spacing-xl) var(--ccec-spacing-lg);
	z-index: 2;
	transform: translateY(4px);
	transition: transform 0.4s var(--ccec-ease-out-expo);
}

.showcase-item:hover .showcase-item__content {
	transform: none;
}

.showcase-item__content h3 {
	font-family: var(--ccec-font-family);
	font-size: clamp(1.375rem, 2.5vw, 1.75rem);
	font-weight: 800;
	color: var(--ccec-white);
	margin-bottom: var(--ccec-spacing-xs);
	line-height: 1.1;
	letter-spacing: -0.02em;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}

.showcase-item__content p {
	font-size: var(--ccec-font-size-small);
	color: rgba(255, 255, 255, 0.8);
	margin-bottom: 0;
	line-height: 1.5;
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	transition:
		max-height 0.4s var(--ccec-ease-out-expo),
		opacity 0.35s ease 0.05s;
}

.showcase-item:hover .showcase-item__content p {
	max-height: 5em;
	opacity: 1;
}

/* "Explore" ghost CTA that slides up on hover */
.showcase-item__content::after {
	content: 'Explore \2192';
	display: inline-block;
	font-family: var(--ccec-font-family);
	font-size: var(--ccec-font-size-xs);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.9);
	margin-top: var(--ccec-spacing-md);
	opacity: 0;
	transform: translateY(10px);
	transition:
		opacity 0.35s ease 0.1s,
		transform 0.35s var(--ccec-ease-out-expo) 0.1s;
}

.showcase-item:hover .showcase-item__content::after {
	opacity: 1;
	transform: none;
}

/* Touch devices have no hover — reveal the showcase description and the
   "Explore" CTA by default so this copy is never permanently hidden on
   phones/tablets (the most-trafficked viewport). */
@media (hover: none) {
	.showcase-item__content p {
		max-height: 8em;
		opacity: 1;
	}

	.showcase-item__content::after {
		opacity: 1;
		transform: none;
	}
}


/* ============================================
  11. TESTIMONIALS SECTION
   ============================================ */
/* Defensive resets — prevent third-party plugin styles (Google Reviews, etc.)
   from bleeding into CCEC testimonial cards via bare element selectors. */
.testimonials blockquote {
	margin: 0;
	padding: 0;
	border: none;
	border-left: none;
	quotes: none;
	background: none;
}
.testimonials blockquote footer {
	font-size: inherit;
	color: inherit;
	background: none;
}
.testimonials blockquote cite {
	font-style: normal;
}

.testimonials {
	padding: var(--ccec-spacing-5xl) 0;
	position: relative;
	overflow: hidden;
}

.testimonials__bg {
	display: none;
}

.testimonials .container {
	position: relative;
	z-index: 1;
}

/* ── Testimonials Infinite Ticker ────────────────────────────────────────── */
.testimonials__carousel {
	margin-top: var(--ccec-spacing-3xl);
	position: relative;
}

.testimonials__track-wrap {
	overflow: hidden;
	border-radius: var(--ccec-radius-xl);
	mask-image: linear-gradient(to right, transparent 0%, black 5%, black 95%, transparent 100%);
	-webkit-mask-image: linear-gradient(to right, transparent 0%, black 5%, black 95%, transparent 100%);
}

.testimonials__track {
	display: flex;
	gap: var(--ccec-spacing-xl);
	will-change: transform;
	align-items: stretch;
	width: max-content;
	animation: tickerScroll var(--ticker-duration, 30s) linear infinite;
}

.testimonials__track:hover {
	animation-play-state: paused;
}

@keyframes tickerScroll {
	0%   { transform: translateX(0); }
	100% { transform: translateX(-50%); }
}

/* The old prev/next/dot controls have been removed from the markup; this
   wrapper now only holds the pause button (absolutely positioned over the
   carousel). It must NOT be display:none or the WCAG 2.2.2 pause control for
   the auto-scrolling ticker would be hidden too. */
.testimonials__nav {
	display: block;
}

/* Pause/play control for the infinite ticker (WCAG 2.2.2). */
.testimonials__pause {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.25);
	background: rgba(255, 255, 255, 0.1);
	color: rgba(255, 255, 255, 0.7);
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease;
	position: absolute;
	bottom: var(--ccec-spacing-lg, 1.5rem);
	right: var(--ccec-spacing-lg, 1.5rem);
}
.testimonials__pause:hover,
.testimonials__pause:focus-visible {
	background: rgba(255, 255, 255, 0.2);
	color: #fff;
	outline: 2px solid #fff;
	outline-offset: 2px;
}

/* Individual testimonial card — generous, editorial spacing. */
.testimonials .testimonial-card {
	flex: 0 0 420px;
	max-width: 460px;
	min-width: 320px;
	background: var(--ccec-white);
	border: none;
	border-radius: var(--ccec-radius-2xl);
	padding: var(--ccec-spacing-2xl) var(--ccec-spacing-2xl) var(--ccec-spacing-xl);
	color: var(--ccec-charcoal);
	position: relative;
	transition: transform 0.4s var(--ccec-ease-out-expo), box-shadow 0.4s ease;
	display: flex;
	flex-direction: column;
	box-shadow: var(--ccec-shadow-editorial);
}

.testimonials .testimonial-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--ccec-shadow-hover);
}

/* Decorative opening quote */
.testimonials .testimonial-card::before {
	content: '\201C';
	position: absolute;
	top: var(--ccec-spacing-md);
	right: var(--ccec-spacing-xl);
	font-family: var(--ccec-font-family);
	font-size: 5rem;
	line-height: 1;
	color: var(--ccec-primary-light);
	opacity: 0.2;
	pointer-events: none;
	user-select: none;
}

/* CSS gradient gold stars */
.testimonials .testimonial-card__stars {
	font-size: var(--ccec-font-size-large);
	margin-bottom: var(--ccec-spacing-md);
	background: linear-gradient(135deg, #FFD700, #FFA500);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.testimonials .testimonial-card__quote {
	font-family: var(--ccec-font-family);
	font-size: clamp(1rem, 1.3vw, 1.1rem);
	line-height: 1.75;
	margin-bottom: var(--ccec-spacing-xl);
	font-style: italic;
	color: var(--ccec-dark-grey);
	flex: 1;
}

.testimonials .testimonial-card__footer {
	display: flex;
	align-items: center;
	gap: var(--ccec-spacing-md);
	margin-top: auto;
}

/* Avatar with gradient glow ring */
.testimonials .testimonial-card__avatar {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--ccec-primary), var(--ccec-primary-light));
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: var(--ccec-font-size-small);
	color: var(--ccec-white);
	flex-shrink: 0;
	box-shadow: 0 0 0 3px rgba(200, 106, 46, 0.15);
	transition: box-shadow 0.3s ease;
}

.testimonial-card:hover .testimonial-card__avatar {
	box-shadow: 0 0 0 3px rgba(200, 106, 46, 0.3);
}

.testimonials .testimonial-card__author {
	display: flex;
	flex-direction: column;
	font-style: normal;
}

.testimonials .testimonial-card__author strong {
	color: var(--ccec-primary-dark);
	font-size: var(--ccec-font-size-small);
	font-weight: 600;
}

.testimonials .testimonial-card__author span {
	color: var(--ccec-mid-grey);
	font-size: var(--ccec-font-size-xs);
}


/* ============================================
  12. LOCATION SECTION
   ============================================ */
.location {
	padding: var(--ccec-spacing-5xl) 0;
	position: relative;
}

/* Subtle dot grid pattern background */
.location::before {
	content: '';
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	inset: 0;
	background-image: radial-gradient(circle, rgba(200, 106, 46, 0.06) 1px, transparent 1px);
	background-size: 24px 24px;
	pointer-events: none;
}

.location .container {
	position: relative;
}

.location__heading {
	font-size: clamp(2.25rem, 5.5vw, 3.75rem);
	font-weight: 800;
	line-height: 1.04;
	letter-spacing: -0.03em;
	color: var(--ccec-charcoal);
	margin-bottom: var(--ccec-spacing-xl);
}

.location__text {
	max-width: 800px;
	font-size: var(--ccec-font-size-large);
	line-height: 1.75;
	color: var(--ccec-charcoal);
}

.location__text p:last-child {
	margin-bottom: 0;
}

.location__map-placeholder {
	margin-top: var(--ccec-spacing-2xl);
	height: 350px;
	background-color: var(--ccec-light-grey);
	border-radius: var(--ccec-radius-xl);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ccec-mid-grey);
	font-style: italic;
}

/* Location Grid Layout */
.location__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--ccec-spacing-3xl);
	align-items: start;
}

/* Location Features */
.location__features {
	margin-top: var(--ccec-spacing-xl);
	display: flex;
	flex-direction: column;
	gap: var(--ccec-spacing-md);
}

.location__feature {
	display: flex;
	align-items: center;
	gap: var(--ccec-spacing-lg);
	padding: var(--ccec-spacing-lg) var(--ccec-spacing-xl);
	background: rgba(255, 255, 255, 0.85);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: var(--ccec-radius-lg);
	box-shadow: var(--ccec-shadow-sm);
	transition: transform 0.3s var(--ccec-ease-out-expo), box-shadow 0.3s ease, border-color 0.3s ease;
}

.location__feature:hover {
	transform: translateX(6px);
	box-shadow: var(--ccec-shadow-md);
	border-color: rgba(0, 0, 0, 0.1);
}

.location__feature-icon {
	width: 48px;
	height: 48px;
	background: rgba(200, 106, 46, 0.1);
	border-radius: var(--ccec-radius-md);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: box-shadow 0.3s ease;
}

.location__feature:hover .location__feature-icon {
	box-shadow: 0 0 16px rgba(200, 106, 46, 0.15);
}

.location__feature-icon svg {
	width: 22px;
	height: 22px;
	fill: var(--ccec-secondary-dark);
}

.location__feature-text {
	display: flex;
	flex-direction: column;
}

.location__feature-text strong {
	font-size: var(--ccec-font-size-medium);
	color: var(--ccec-charcoal);
	font-weight: 600;
}

.location__feature-text span {
	font-size: var(--ccec-font-size-small);
	color: var(--ccec-dark-grey);
}

/* Location content column */
.location__content {
	display: flex;
	flex-direction: column;
	gap: var(--ccec-spacing-sm);
}

/* Location Map Wrapper */
.location__map-wrapper {
	position: relative;
}

.location__map-container {
	border-radius: var(--ccec-radius-xl);
	overflow: hidden;
	box-shadow: var(--ccec-shadow-lg);
	border: 1px solid rgba(0, 0, 0, 0.06);
}

.location__map-container iframe {
	display: block;
	width: 100%;
}

.location__info-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: var(--ccec-spacing-lg);
	margin-top: var(--ccec-spacing-xl);
}


/* ============================================
  12b. CAFÉ 1899 SECTION
   ============================================ */

.cafe-1899 {
	padding: var(--ccec-spacing-5xl) 0;
	position: relative;
	overflow: hidden;
}

.cafe-1899::before {
	content: '';
	position: absolute;
	top: -80px;
	right: -80px;
	width: 300px;
	height: 300px;
	background: radial-gradient(circle, rgba(200, 106, 46, 0.08) 0%, transparent 70%);
	border-radius: 50%;
	pointer-events: none;
}

.cafe-1899__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--ccec-spacing-3xl, 4rem);
	align-items: center;
}

.cafe-1899__heading {
	font-family: var(--ccec-font-family);
	font-size: clamp(2.25rem, 5.5vw, 3.75rem);
	font-weight: 800;
	color: var(--ccec-charcoal);
	margin: 0 0 0.375rem;
	line-height: 1.04;
	letter-spacing: -0.03em;
}

.cafe-1899__tagline {
	font-size: 1.125rem;
	color: var(--ccec-dark-grey);
	font-weight: 600;
	font-style: italic;
	margin: 0 0 1.5rem;
	letter-spacing: 0.01em;
}

.cafe-1899__desc {
	font-size: 1.0625rem;
	line-height: 1.75;
	color: var(--ccec-dark-grey);
	margin-bottom: 1.75rem;
}

.cafe-1899__hours {
	display: inline-flex;
	align-items: center;
	gap: 0.625rem;
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--ccec-charcoal);
	padding: 0 1.25rem;
	background: var(--ccec-secondary-tint);
	border-radius: var(--ccec-radius-md, 10px);
	border: 1px solid rgba(200, 106, 46, 0.15);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.cafe-1899__hours svg {
	color: var(--ccec-secondary, #89966C);
	flex-shrink: 0;
}

/* Hours + button sit side by side, vertically centred */
.cafe-1899__actions {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-top: 1.75rem;
}

.cafe-1899__btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	white-space: nowrap;
}

.cafe-1899__btn svg {
	transition: transform 0.2s ease;
}

.cafe-1899__btn:hover svg {
	transform: translateX(4px);
}

/* Cafe image — editorial overlapping depth. */
.cafe-1899__image-wrapper {
	border-radius: var(--ccec-radius-2xl, 28px);
	overflow: hidden;
	box-shadow: var(--ccec-shadow-editorial);
	position: relative;
}

.cafe-1899__image-wrapper::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15);
	pointer-events: none;
}

.cafe-1899__image {
	width: 100%;
	height: auto;
	display: block;
	aspect-ratio: 4/3;
	object-fit: cover;
	transition: transform 0.6s var(--ccec-ease-out-expo, cubic-bezier(0.16, 1, 0.3, 1));
}

.cafe-1899__image-wrapper:hover .cafe-1899__image {
	transform: scale(1.03);
}

.cafe-1899__image-placeholder {
	aspect-ratio: 4/3;
	background: linear-gradient(135deg, var(--ccec-primary-tint, #FDF2EC) 0%, #F9DCC8 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ccec-primary, #C86A2E);
	font-size: 3rem;
}

@media (max-width: 900px) {
	.cafe-1899 {
		padding: var(--ccec-spacing-3xl, 4rem) 0;
	}
	.cafe-1899__grid {
		grid-template-columns: 1fr;
		gap: var(--ccec-spacing-xl, 2rem);
	}
	.cafe-1899__image-wrapper {
		order: -1;
		max-width: 520px;
		margin: 0 auto;
	}
	.cafe-1899__content {
		text-align: center;
	}
	.cafe-1899__hours {
		justify-content: center;
	}
}


/* ============================================
  13. BOOKING / CONTACT SECTION
   ============================================ */
.booking {
	padding: var(--ccec-spacing-5xl) 0;
	position: relative;
	overflow: hidden;
}

.booking__heading {
	color: var(--ccec-white);
	margin-bottom: var(--ccec-spacing-md);
}

.booking__intro {
	font-size: clamp(1.0625rem, 1.5vw, 1.25rem);
	color: rgba(255, 255, 255, 0.85);
	max-width: 700px;
	/* Centre the capped-width paragraph under the (centered) heading. Without
	   auto side margins the 700px box hugs the left of the header and the text
	   reads as off-centre. */
	margin-inline: auto;
	margin-bottom: var(--ccec-spacing-3xl);
	line-height: 1.8;
}

/* Split layout */
.booking__grid {
	display: grid;
	grid-template-columns: 1fr 1.5fr;
	gap: var(--ccec-spacing-3xl);
	align-items: start;
}

.booking__team,
.booking__contacts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: var(--ccec-spacing-xl);
	margin-bottom: var(--ccec-spacing-3xl);
}

/* Booking header — centres the label + heading + intro above the grid */
.booking__header {
	text-align: center;
	margin-bottom: var(--ccec-spacing-3xl);
}

.booking__header .section-label {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 0.5em;
}

/* Booking form wrapper — fills right column of the grid */
.booking__form-wrapper {
	display: flex;
	flex-direction: column;
}

@media (max-width: 900px) {
	.booking__team,
	.booking__contacts {
		grid-template-columns: 1fr;
	}
}

/* Contact Cards with glassmorphic effect and animated border */
.contact-card {
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: var(--ccec-radius-xl);
	padding: var(--ccec-spacing-2xl);
	margin-bottom: var(--ccec-spacing-md);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
	position: relative;
	overflow: hidden;
	transition: transform 0.4s var(--ccec-ease-out-expo), box-shadow 0.4s ease, border-color 0.3s ease;
}

/* Subtle top accent border */
.contact-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--ccec-primary), var(--ccec-primary-light));
}

.contact-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2), 0 0 30px rgba(200, 106, 46, 0.15);
	border-color: rgba(255, 255, 255, 0.25);
}

.contact-card__icon {
	width: 44px;
	height: 44px;
	background: rgba(255, 255, 255, 0.18);
	border-radius: var(--ccec-radius-md);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: var(--ccec-spacing-sm);
	transition: box-shadow 0.3s ease;
}

.contact-card:hover .contact-card__icon {
	box-shadow: 0 0 12px rgba(255, 255, 255, 0.15);
}

.contact-card__icon svg {
	width: 20px;
	height: 20px;
	fill: #FFFFFF;
	opacity: 1;
	filter: none;
}

.contact-card__name {
	font-size: var(--ccec-font-size-large);
	font-weight: 700;
	color: var(--ccec-white);
	margin-bottom: var(--ccec-spacing-sm);
}

.contact-card__details {
	color: rgba(255, 255, 255, 0.75);
	font-size: var(--ccec-font-size-small);
	margin-bottom: 0;
	word-break: break-word;
	overflow-wrap: break-word;
	hyphens: auto;
	line-height: 1.5;
}

/* Quick Contact Section */
.contact-quick {
	background-color: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: var(--ccec-radius-lg);
	padding: var(--ccec-spacing-lg);
	margin-top: var(--ccec-spacing-lg);
}

.contact-quick h4 {
	color: var(--ccec-white);
	font-size: var(--ccec-font-size-medium);
	margin-bottom: var(--ccec-spacing-sm);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.contact-quick p {
	margin-bottom: var(--ccec-spacing-sm);
}

.contact-quick p:last-child {
	margin-bottom: 0;
}

.contact-quick a {
	display: flex;
	align-items: center;
	gap: var(--ccec-spacing-sm);
	color: var(--ccec-accent);
	font-weight: 500;
	text-decoration: none;
	transition: color var(--ccec-transition-fast);
}

.contact-quick a:hover {
	color: var(--ccec-white);
	text-decoration: underline;
}

.contact-quick svg {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	fill: var(--ccec-accent);
	transition: fill var(--ccec-transition-fast), transform 0.2s ease;
}

.contact-quick a:hover svg {
	fill: var(--ccec-white);
	transform: scale(1.1);
}

/* Form area — elevated white card */
.booking__form-area {
	background-color: var(--ccec-white);
	border-radius: var(--ccec-radius-2xl);
	padding: var(--ccec-spacing-3xl);
	box-shadow: var(--ccec-shadow-lg);
}

.booking__form-title {
	font-size: var(--ccec-font-size-2xl);
	color: var(--ccec-charcoal);
	margin-bottom: var(--ccec-spacing-xl);
}

/* Contact message notices */
.contact-message {
	padding: var(--ccec-spacing-md) var(--ccec-spacing-lg);
	border-radius: var(--ccec-radius-md);
	margin-bottom: var(--ccec-spacing-xl);
	font-weight: 500;
}

.contact-success {
	background-color: var(--ccec-success-bg);
	color: var(--ccec-success-text);
	border: 1px solid var(--ccec-success-border);
}

.contact-error {
	background-color: var(--ccec-error-bg);
	color: var(--ccec-error-text);
	border: 1px solid var(--ccec-error-border);
}


/* ============================================
  14. FOOTER STYLES
   ============================================ */
/* Footer — premium dark with warm undertone. */
.site-footer {
	background: linear-gradient(175deg, var(--ccec-deep-dark) 0%, var(--ccec-black) 40%, var(--ccec-deep-dark-warm) 100%);
	color: rgba(255, 255, 255, 0.8);
	position: relative;
}

/* Gradient top edge — wider, more premium */
.site-footer::before {
	content: '';
	display: block;
	height: 2px;
	background: linear-gradient(90deg, transparent 5%, var(--ccec-primary) 30%, var(--ccec-primary-light) 50%, var(--ccec-primary) 70%, transparent 95%);
}

.footer-main {
	padding: var(--ccec-spacing-4xl) 0 var(--ccec-spacing-3xl);
}

.footer-grid {
	display: grid;
	grid-template-columns: 1.5fr 1fr 1fr 1.5fr;
	gap: var(--ccec-spacing-3xl);
}

.footer-col__title {
	font-size: var(--ccec-font-size-small);
	font-weight: 700;
	color: var(--ccec-white);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin-bottom: var(--ccec-spacing-lg);
}

/* Footer column title accent */
.footer-col__title::after {
	content: '';
	display: block;
	width: 30px;
	height: 2px;
	background: var(--ccec-primary-light);
	margin-top: 8px;
	transition: width 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.footer-col:hover .footer-col__title::after {
	width: 50px;
}

.footer-col p,
.footer-col address {
	font-size: var(--ccec-font-size-small);
	line-height: 1.7;
	margin-bottom: var(--ccec-spacing-sm);
	color: rgba(255, 255, 255, 0.7);
	font-style: normal;
}

.footer-col a,
.site-footer a {
	color: rgba(255, 255, 255, 0.75);
	font-size: var(--ccec-font-size-small);
	transition: color var(--ccec-transition-fast);
}

/* Footer link hover animation */
.site-footer a:not(.btn) {
	text-decoration: none;
	position: relative;
	transition: color 0.25s ease;
}

.footer-col a:hover,
.site-footer a:hover {
	color: var(--ccec-white);
	text-decoration: none;
}

.site-footer a:not(.btn):hover {
	color: var(--ccec-primary-light);
}

/* Social Icons */
.footer-social {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ccec-spacing-sm);
	list-style: none;
	padding: 0;
	margin: 0;
}

.footer-social li a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background-color: rgba(255, 255, 255, 0.08);
	border-radius: var(--ccec-radius-md);
	color: var(--ccec-white);
	transition: all 0.3s var(--ccec-ease-out-expo);
}

.footer-social li a:hover {
	background-color: var(--ccec-primary);
	transform: translateY(-3px) scale(1.05);
	box-shadow: 0 4px 15px rgba(200, 106, 46, 0.3);
}

.footer-social li a svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

/* Newsletter — pill shape with embedded button */
.footer-links {
	list-style: none;
	margin: var(--ccec-spacing-sm) 0 0;
	padding: 0;
}

.footer-links li + li {
	margin-top: var(--ccec-spacing-xs);
}

.footer-links a {
	color: rgba(255, 255, 255, 0.7);
	text-decoration: none;
	font-size: var(--ccec-font-size-small);
	transition: color var(--ccec-transition-fast);
}

.footer-links a:hover {
	color: var(--ccec-white);
}

/* Footer Bottom */
.footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	padding: var(--ccec-spacing-lg) 0;
}

.footer-bottom .container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ccec-spacing-md);
	flex-wrap: wrap;
}

.footer-copyright {
	font-size: var(--ccec-font-size-xs);
	color: rgba(255, 255, 255, 0.6);
	margin-bottom: 0;
}

.footer-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 0;
	flex-wrap: wrap;
}

.footer-nav a {
	font-size: var(--ccec-font-size-xs);
	color: rgba(255, 255, 255, 0.6);
	padding: 0.15rem 0.6rem;
	border-right: 1px solid rgba(255, 255, 255, 0.12);
}

.footer-nav li:last-child a {
	border-right: none;
}

.footer-nav a:hover {
	color: rgba(255, 255, 255, 0.9);
	text-decoration: none;
}


/* ============================================
  15. FORM STYLES
   ============================================ */
.ccec-contact-form .form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--ccec-spacing-lg);
	margin-bottom: var(--ccec-spacing-lg);
}

.ccec-contact-form input.is-invalid,
.ccec-contact-form textarea.is-invalid {
	border-color: #dc3232;
	background-color: #fff5f5;
}

.field-error {
	color: #dc3232;
	font-size: var(--ccec-font-size-small);
	margin-top: var(--ccec-spacing-xs);
	display: block;
}

.ccec-contact-form .form-group {
	margin-bottom: var(--ccec-spacing-lg);
}

.ccec-contact-form label {
	display: block;
	margin-bottom: var(--ccec-spacing-xs);
	font-size: var(--ccec-font-size-small);
	font-weight: 600;
	color: var(--ccec-charcoal);
}

.ccec-contact-form .required-mark {
	color: var(--ccec-primary);
	margin-left: 2px;
}

/* Modern rounded inputs with focus glow */
.ccec-contact-form input[type="text"],
.ccec-contact-form input[type="email"],
.ccec-contact-form input[type="tel"],
.ccec-contact-form input[type="date"],
.ccec-contact-form input[type="number"],
.ccec-contact-form textarea {
	width: 100%;
	padding: 0.85rem 1.2rem;
	/* Parent theme (Astra) forces height:40px on inputs; with box-sizing +
	   this padding that clamps the field. height:auto lets the padding set the
	   height so fields stay tall and line up with the selects beside them. */
	height: auto;
	border: 2px solid var(--ccec-light-grey);
	border-radius: var(--ccec-radius-lg);
	font-size: var(--ccec-font-size-medium);
	font-family: inherit;
	background-color: var(--ccec-white);
	color: var(--ccec-charcoal);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.ccec-contact-form select {
	width: 100%;
	padding: 0.85rem 1.2rem;
	border: 2px solid var(--ccec-light-grey);
	border-radius: var(--ccec-radius-lg);
	font-size: var(--ccec-font-size-medium);
	font-family: inherit;
	/* Root cause of the clipped option text on Chrome/Edge: the parent theme
	   (Astra) forces height:40px on <select>, and with box-sizing:border-box +
	   this 0.85rem padding the content box shrinks to ~9px — far less than the
	   text needs — so the glyphs are sliced top & bottom (Firefox is lenient).
	   height:auto lets the padding size the control; line-height:normal keeps
	   the text metrics tidy. */
	height: auto;
	line-height: normal;
	background-color: var(--ccec-white);
	color: var(--ccec-charcoal);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
	cursor: pointer;
}

.ccec-contact-form input::placeholder,
.ccec-contact-form textarea::placeholder {
	color: var(--ccec-mid-grey);
	opacity: 1;
}

.ccec-contact-form input:focus-visible,
.ccec-contact-form textarea:focus-visible,
.ccec-contact-form select:focus-visible {
	border-color: var(--ccec-primary);
	box-shadow: 0 0 0 3px rgba(var(--ccec-primary-rgb), 0.2);
	outline: 2px solid var(--ccec-primary);
	outline-offset: 1px;
}

.ccec-contact-form textarea {
	resize: vertical;
	min-height: 140px;
}

/* Submit button with gradient + shimmer */
.ccec-contact-form .submit-btn {
	background: linear-gradient(135deg, var(--ccec-primary), var(--ccec-primary-dark));
	color: var(--ccec-white);
	border: none;
	border-radius: var(--ccec-radius-lg);
	padding: 0.95rem 2.5rem;
	font-size: var(--ccec-font-size-medium);
	font-weight: 600;
	cursor: pointer;
	font-family: inherit;
	transition: all 0.3s var(--ccec-ease-out-expo);
	position: relative;
	overflow: hidden;
}

.ccec-contact-form .submit-btn::before {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
	transition: left 0.5s ease;
}

.ccec-contact-form .submit-btn:hover::before {
	left: 100%;
}

.ccec-contact-form .submit-btn:hover {
	transform: translateY(-2px);
	box-shadow: var(--ccec-shadow-primary);
}

.ccec-contact-form .submit-btn:active {
	transform: translateY(0) scale(0.98);
}

/* Loading state — add .is-loading class via JS during submission */
.ccec-contact-form .submit-btn.is-loading {
	pointer-events: none;
	opacity: 0.8;
}

.ccec-contact-form .submit-btn.is-loading::after {
	content: '';
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-left: 0.5rem;
	border: 2px solid rgba(255, 255, 255, 0.3);
	border-top-color: var(--ccec-white);
	border-radius: 50%;
	animation: spin 0.6s linear infinite;
	vertical-align: middle;
}

@keyframes spin {
	to { transform: rotate(360deg); }
}


/* ============================================
  16. INNER PAGE STYLES (page.php)
   ============================================ */

/* Page Banner — cinematic gradient with commanding presence.
   Generous vertical padding creates breathing room,
   warm gradient adds brand depth. */
.page-banner {
	background-color: var(--ccec-black);
	position: relative;
	overflow: hidden;
	padding: clamp(6rem, 14vw, 10rem) 0 clamp(4.5rem, 9vw, 7rem);
	color: var(--ccec-white);
}

.page-banner::before {
	content: '';
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	inset: 0;
	background: var(--ccec-gradient-hero);
	z-index: 0;
	pointer-events: none;
}

.page-banner .container {
	position: relative;
	z-index: 1;
}

.page-banner .section-label {
	color: rgba(255, 255, 255, 0.95);
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.55),
	             0 1px 2px rgba(0, 0, 0, 0.45);
}

.page-banner__title {
	color: var(--ccec-white);
	font-size: clamp(2rem, 5vw, 3.5rem);
	font-weight: 800;
	letter-spacing: -0.03em;
	line-height: 1.04;
	margin-bottom: 0;
	/* Layered text-shadow: a tight one for crispness against image edges
	   plus a diffuse one for ambient contrast over busy backgrounds. */
	text-shadow: 0 2px 18px rgba(0, 0, 0, 0.70),
	             0 1px 4px rgba(0, 0, 0, 0.55);
}

.page-banner__intro {
	color: rgba(255, 255, 255, 0.96);
	font-size: var(--ccec-font-size-large);
	margin-top: var(--ccec-spacing-md);
	margin-bottom: 0;
	max-width: 600px;
	text-shadow: 0 1px 12px rgba(0, 0, 0, 0.65),
	             0 1px 3px rgba(0, 0, 0, 0.5);
}

.page-banner .ccec-breadcrumbs,
.page-banner .ccec-breadcrumbs a,
.page-banner .breadcrumbs,
.page-banner .breadcrumbs__item,
.page-banner .breadcrumbs__item a,
.page-banner .breadcrumbs__sep {
	color: rgba(255, 255, 255, 0.92);
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.55);
}

.page-banner .ccec-breadcrumbs a:hover,
.page-banner .breadcrumbs__item a:hover {
	color: var(--ccec-white);
}

.page-banner .breadcrumbs__item[aria-current="page"] {
	color: var(--ccec-white);
}

/* Breadcrumbs */
.breadcrumbs {
	padding: var(--ccec-spacing-md) 0;
	font-size: var(--ccec-font-size-small);
}

.breadcrumbs__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 0;
	flex-wrap: wrap;
}

.breadcrumbs__item {
	color: var(--ccec-dark-grey);
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
}

.breadcrumbs__item a {
	color: var(--ccec-primary-dark);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	transition: color 0.2s;
}

.breadcrumbs__item a:hover {
	color: var(--ccec-primary);
	text-decoration: underline;
}

.breadcrumbs__item a svg {
	flex-shrink: 0;
	opacity: 0.7;
}

.breadcrumbs__current,
.breadcrumbs__item[aria-current="page"] {
	color: var(--ccec-charcoal);
	font-weight: 600;
}

.breadcrumbs__sep {
	display: inline-flex;
	align-items: center;
	margin: 0 0.4rem;
	color: var(--ccec-mid-grey);
	opacity: 0.5;
}

.breadcrumbs__sep svg {
	display: block;
}

/* Page Content — overlaps banner for premium depth.
   Deeper overlap creates stronger visual connection between
   banner and content. */
.page-content {
	padding: var(--ccec-spacing-3xl) 0 var(--ccec-spacing-3xl);
	/* Near-opaque so long-form body copy stays readable where the card
	   overlaps the dark page banner (margin-top:-4rem). */
	background-color: rgba(255, 255, 255, 0.97);
	position: relative;
	z-index: 2;
	margin-top: -4rem;
	border-radius: var(--ccec-radius-2xl) var(--ccec-radius-2xl) 0 0;
	box-shadow: 0 -8px 40px rgba(0, 0, 0, 0.06);
}

/* Page layout - content + sidebar */
.page-layout {
	display: block;
}

.page-entry {
	min-width: 0;
	overflow: hidden;
}

.page-entry h2 {
	color: var(--ccec-primary);
	margin-bottom: var(--ccec-spacing-lg);
}

.page-entry h3 {
	color: var(--ccec-secondary-dark);
	margin-top: var(--ccec-spacing-2xl);
	margin-bottom: var(--ccec-spacing-lg);
	font-size: var(--ccec-font-size-large);
}

.page-entry p {
	color: var(--ccec-charcoal);
	line-height: 1.75;
}

.page-entry p em {
	font-size: var(--ccec-font-size-small);
	color: var(--ccec-dark-grey);
}

/* Styled green-tick checklist — OPT-IN via the `ccec-checklist` class. Plain
   bulleted lists, and any list-based navigation/menus placed in page content,
   now render as normal lists instead of being forced into tick cards. Add the
   "ccec-checklist" class to a List block in the editor to get this look. */
.page-entry ul.ccec-checklist {
	list-style: none;
	padding: 0;
	margin: 0 0 var(--ccec-spacing-xl);
	border: 1px solid var(--ccec-light-grey);
	border-radius: var(--ccec-radius-lg);
	overflow: hidden;
}

.page-entry ul.ccec-checklist li {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	padding: 0.75rem 1rem;
	border-bottom: 1px solid var(--ccec-light-grey);
	font-size: var(--ccec-font-size-medium);
	background-color: var(--ccec-white);
	transition: background-color 0.2s ease, padding-left 0.2s ease;
}

.page-entry ul.ccec-checklist li:last-child {
	border-bottom: none;
}

.page-entry ul.ccec-checklist li:hover {
	background-color: var(--ccec-secondary-tint);
	padding-left: 1.25rem;
}

.page-entry ul.ccec-checklist li::before {
	content: "\2713";
	flex-shrink: 0;
	color: var(--ccec-secondary);
	font-weight: 700;
	font-size: var(--ccec-font-size-medium);
	line-height: 1;
}

/* ── Inline CTA (replaces sidebar CTA card on inner pages) ───────────────── */
.page-inline-cta {
	display: flex;
	align-items: center;
	gap: var(--ccec-spacing-xl);
	background: var(--ccec-secondary-tint);
	border-left: 4px solid var(--ccec-secondary);
	border-radius: var(--ccec-radius-xl);
	padding: var(--ccec-spacing-xl) var(--ccec-spacing-2xl);
	margin-top: var(--ccec-spacing-3xl);
}

.page-inline-cta__body {
	flex: 1;
}

.page-inline-cta__heading {
	font-size: var(--ccec-font-size-large);
	font-weight: 700;
	color: var(--ccec-charcoal);
	margin: 0 0 var(--ccec-spacing-xs);
}

.page-inline-cta__text {
	color: var(--ccec-dark-grey);
	margin: 0;
	font-size: var(--ccec-font-size-medium);
}

@media (max-width: 640px) {
	.page-inline-cta {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* ── PDF download button ─────────────────────────────────────────────────── */
.page-pdf-download {
	margin-top: var(--ccec-spacing-2xl);
}

/* Override .btn--outline (which is designed for dark heros) so the PDF
   button is legible on the light page content background. */
.btn--pdf {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	background: transparent !important;
	color: var(--ccec-primary) !important;
	border: 2px solid var(--ccec-primary) !important;
}

.btn--pdf:hover,
.btn--pdf:focus {
	background: var(--ccec-primary) !important;
	color: var(--ccec-white) !important;
}

.btn--pdf svg {
	flex-shrink: 0;
	width: 18px;
	height: 18px;
}

/* ── Inline-blocks wrappers (replace removed sidebars) ───────────────────── */
.event-inline-blocks {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: var(--ccec-spacing-xl);
	margin-top: var(--ccec-spacing-2xl);
	align-items: start;
}

.event-inline-blocks > .page-inline-cta {
	grid-column: 1 / -1;
}

@media (max-width: 640px) {
	.event-inline-blocks {
		grid-template-columns: 1fr;
	}
}

.news-related-event,
.news-latest-inline {
	background: var(--ccec-white);
	border: 1px solid var(--ccec-light-grey);
	border-radius: var(--ccec-radius-xl);
	padding: var(--ccec-spacing-xl);
	margin-top: var(--ccec-spacing-2xl);
}

.news-related-event h3,
.news-latest-inline h3 {
	margin-top: 0;
	margin-bottom: var(--ccec-spacing-md);
	color: var(--ccec-primary);
	font-size: var(--ccec-font-size-large);
}

.news-related-event p {
	margin: 0 0 var(--ccec-spacing-sm);
}

.news-related-event .btn {
	margin-top: var(--ccec-spacing-md);
}

.news-latest-inline ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.news-latest-inline ul li {
	border-bottom: 1px solid var(--ccec-light-grey);
}

.news-latest-inline ul li:last-child {
	border-bottom: none;
}

.news-latest-inline ul li a {
	display: flex;
	align-items: baseline;
	gap: var(--ccec-spacing-md);
	padding: var(--ccec-spacing-sm) 0;
	color: var(--ccec-charcoal);
	text-decoration: none;
	transition: color 0.2s ease;
}

.news-latest-inline ul li a:hover {
	color: var(--ccec-primary);
}

.news-latest-inline .sidebar-events__date {
	font-size: var(--ccec-font-size-small);
	color: var(--ccec-dark-grey);
	flex-shrink: 0;
	min-width: 60px;
}

.news-latest-inline .sidebar-events__title {
	font-weight: 600;
}

/* Sidebar */
.page-sidebar {
	display: flex;
	flex-direction: column;
	gap: var(--ccec-spacing-lg);
	position: sticky;
	top: calc(var(--ccec-spacing-2xl) + 80px);
	align-self: start;
	/* No max-height or overflow — sidebar content should never require a
	   scrollbar; it scrolls with the page via position:sticky. */
}

.sidebar-card {
	background: var(--ccec-white);
	border: none;
	border-radius: var(--ccec-radius-xl);
	padding: var(--ccec-spacing-xl);
	box-shadow: var(--ccec-shadow-soft);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.sidebar-card:hover {
	box-shadow: var(--ccec-shadow-hover);
	transform: translateY(-3px);
}

.sidebar-card--cta {
	background: linear-gradient(135deg, var(--ccec-primary-tint) 0%, var(--ccec-white) 100%);
	border: none;
	border-left: 4px solid var(--ccec-primary);
}

.sidebar-card--cta h3 {
	color: var(--ccec-primary-dark);
	font-size: var(--ccec-font-size-large);
	margin-bottom: var(--ccec-spacing-sm);
}

.sidebar-card--cta p {
	color: var(--ccec-charcoal);
	font-size: var(--ccec-font-size-small);
	line-height: 1.6;
	margin-bottom: var(--ccec-spacing-md);
}

.sidebar-card h4 {
	color: var(--ccec-charcoal);
	font-size: var(--ccec-font-size-medium);
	margin-bottom: var(--ccec-spacing-md);
	padding-bottom: var(--ccec-spacing-sm);
	border-bottom: 2px solid var(--ccec-primary-tint);
}

/* Sidebar contact list */
.sidebar-contact {
	list-style: none;
	padding: 0;
	margin: 0;
}

.sidebar-contact li {
	display: flex;
	align-items: center;
	gap: var(--ccec-spacing-sm);
	padding: var(--ccec-spacing-sm) 0;
	font-size: var(--ccec-font-size-small);
	border-bottom: 1px solid var(--ccec-light-grey);
}

.sidebar-contact li:last-child {
	border-bottom: none;
}

.sidebar-contact svg {
	width: 18px;
	height: 18px;
	fill: var(--ccec-primary);
	flex-shrink: 0;
}

.sidebar-contact a {
	color: var(--ccec-primary-dark);
}

.sidebar-contact a:hover {
	color: var(--ccec-primary);
}

/* Sidebar features list */
.sidebar-features {
	list-style: none;
	padding: 0;
	margin: 0;
}

.sidebar-features li {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: var(--ccec-spacing-xs) 0;
	font-size: var(--ccec-font-size-small);
	color: var(--ccec-charcoal);
}

.sidebar-features li::before {
	content: "\2713";
	flex-shrink: 0;
	color: var(--ccec-secondary);
	font-weight: 700;
	line-height: 1;
}

/* Entry content */
.entry-content h2,
.entry-content h3 {
	color: var(--ccec-primary-dark);
}

.entry-content a {
	color: var(--ccec-primary-dark);
	text-decoration: underline;
}

.entry-content a:hover {
	color: var(--ccec-primary);
}

.entry-content ul.ccec-checklist {
	list-style: none;
	padding-left: 0;
	margin-bottom: var(--ccec-spacing-lg);
}

.entry-content ul.ccec-checklist li {
	display: flex;
	align-items: baseline;
	gap: 0.5em;
	margin-bottom: 0;
}

.entry-content ul.ccec-checklist li::before {
	content: "\2713";
	flex-shrink: 0;
	color: var(--ccec-primary);
	font-weight: 700;
	font-size: 0.9em;
	line-height: 1;
}

/* CTA strip below page content */
.page-cta-strip {
	display: flex;
	gap: var(--ccec-spacing-md);
	flex-wrap: wrap;
	margin-top: var(--ccec-spacing-2xl);
	padding-top: var(--ccec-spacing-xl);
	border-top: 1px solid var(--ccec-light-grey);
}

/* ── Banner with background image ──────────────────────────────────────────── */
.page-banner--has-image {
	background-color: transparent;
	background-image: var(--banner-image);
	background-size: cover;
	background-position: center;
	position: relative;
}

.page-banner--has-image::before {
	/* Vertical-leaning gradient: darker at the top where the text sits
	   (after the fixed nav) and lifts toward the bottom so the image
	   stays visible. Reversed from the prior 160deg gradient which was
	   darkening where there was no text. */
	background: linear-gradient(
		180deg,
		rgba(0, 0, 0, calc(var(--banner-overlay, 60) / 100 * 1.05)) 0%,
		rgba(0, 0, 0, calc(var(--banner-overlay, 60) / 100)) 55%,
		rgba(0, 0, 0, calc(var(--banner-overlay, 60) / 100 * 0.85)) 100%
	);
}

/* Secondary scrim: focused darkening on the left/text-column side so the
   image stays visible on the right but the title/breadcrumbs always have
   contrast. Works in tandem with the vertical overlay above. */
.page-banner--has-image::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(
		95deg,
		rgba(0, 0, 0, 0.40) 0%,
		rgba(0, 0, 0, 0.18) 45%,
		rgba(0, 0, 0, 0) 75%
	);
	z-index: 0;
	pointer-events: none;
}

.page-banner--has-image .container {
	position: relative;
	z-index: 2;
}

/* [Old inner-page section styles removed — canonical versions in Section 35+] */


/* ============================================
  17. UTILITY CLASSES
   ============================================ */
.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ── Skip-to-content (Astra .skip-link) ──────────────────────────── */
/* Astra parent theme provides the skip link element. */

.text-center { text-align: center; }
.text-left   { text-align: left; }
.text-right  { text-align: right; }

.mb-0 { margin-bottom: 0; }
.mt-0 { margin-top: 0; }

/* Section label — editorial overline with accent line.
   Horizontal overline with generous tracking for sophisticated rhythm. */
.section-label {
	display: inline-flex;
	align-items: center;
	gap: 0.875em;
	position: relative;
	/* primary-dark (#9A4A1D ~6.5:1) for AA contrast — at 11px bold this is not
	   "large text", so #C86A2E (~3.8:1) failed WCAG 1.4.3 on light sections.
	   Dark-section variants override this colour below. */
	color: var(--ccec-primary-dark);
	font-size: 0.6875rem;
	font-family: var(--ccec-font-family);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.3em;
	margin-bottom: var(--ccec-spacing-lg);
}

/* Accent line before label — longer for more editorial presence */
.section-label::before {
	content: '';
	display: block;
	width: 36px;
	height: 2px;
	background: var(--ccec-primary);
	border-radius: 1px;
	flex-shrink: 0;
	transition: width 0.5s var(--ccec-ease-out-expo);
}

.section-label:hover::before {
	width: 48px;
}

/* No animated underline — clean look */
.section-label::after {
	display: none;
}

.section-label--light {
	color: rgba(255, 255, 255, 0.7);
}

.section-label--light::before {
	background: rgba(255, 255, 255, 0.5);
}

/* Section title — commanding, award-winning hierarchy.
   Tight line-height from Dopple (0.95), heavy weight from Zhoosh,
   clamp sizing pushes larger on desktop for editorial impact. */
.section-title {
	font-family: var(--ccec-font-family);
	font-size: clamp(2.25rem, 5.5vw, 3.75rem);
	color: var(--ccec-charcoal);
	margin-bottom: var(--ccec-spacing-2xl);
	font-weight: 800;
	line-height: 1.04;
	letter-spacing: -0.03em;
}

/* Section title underline — hidden for clean modern look */
.section-title::after {
	display: none;
	content: '';
	width: 56px;
	height: 3px;
	background: linear-gradient(90deg, var(--ccec-primary), var(--ccec-primary-light));
	border-radius: 2px;
	margin-top: 0.65em;
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.85s var(--ccec-ease-out-expo);
}

.section-title.is-animated::after {
	transform: scaleX(1);
}

/* Center contexts: testimonials, showcase, events, news */
.testimonials .section-title::after,
.venue-showcase .section-title::after,
.upcoming-events .section-title::after,
.latest-news .section-title::after {
	margin-left: auto;
	margin-right: auto;
	transform-origin: center;
}

.section-title--light {
	color: var(--ccec-white);
}

.section-title--light::after {
	background: linear-gradient(90deg, var(--ccec-primary-light), rgba(255, 255, 255, 0.5));
}

/* Section accent divider line */
.section-divider {
	display: block;
	width: 48px;
	height: 3px;
	background: linear-gradient(90deg, var(--ccec-primary), var(--ccec-primary-light));
	border-radius: 2px;
	margin: var(--ccec-spacing-md) 0 var(--ccec-spacing-xl);
}

.section-divider--center {
	margin-left: auto;
	margin-right: auto;
}

/* ── Marquee Ticker Divider ────────────────────────────────────────────
   Elegant, slow-scrolling text strip between sections using brand
   messaging. CSS-only animation with duplicated content for seamless loop. */
.ccec-marquee {
	overflow: hidden;
	white-space: nowrap;
	background: var(--ccec-primary-tint);
	padding: 0.875rem 0;
	border-top: 1px solid rgba(200, 106, 46, 0.1);
	border-bottom: 1px solid rgba(200, 106, 46, 0.1);
	position: relative;
	z-index: 4;
	mask-image: linear-gradient(to right, transparent 0%, black 5%, black 95%, transparent 100%);
	-webkit-mask-image: linear-gradient(to right, transparent 0%, black 5%, black 95%, transparent 100%);
}

.ccec-marquee--dark {
	background: var(--ccec-secondary-dark);
	border-color: rgba(255, 255, 255, 0.06);
}

.ccec-marquee__track {
	display: inline-flex;
	animation: marqueeScroll var(--marquee-speed, 35s) linear infinite;
	will-change: transform;
}

.ccec-marquee:hover .ccec-marquee__track {
	animation-play-state: paused;
}

.ccec-marquee__item {
	display: inline-flex;
	align-items: center;
	gap: 2rem;
	padding: 0 2rem;
	font-family: var(--ccec-font-family);
	font-size: 0.8125rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.2em;
	color: var(--ccec-primary);
}

.ccec-marquee--dark .ccec-marquee__item {
	color: rgba(255, 255, 255, 0.5);
}

.ccec-marquee__link {
	color: inherit;
	text-decoration: none;
	transition: opacity 0.2s ease;
}

.ccec-marquee__link:hover {
	opacity: 0.7;
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.ccec-marquee__separator {
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--ccec-primary);
	opacity: 0.3;
	flex-shrink: 0;
}

.ccec-marquee--dark .ccec-marquee__separator {
	background: var(--ccec-green-400);
	opacity: 0.4;
}

@keyframes marqueeScroll {
	0%   { transform: translateX(0); }
	100% { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
	.ccec-marquee__track {
		animation-duration: 120s !important;
	}
}

/* #page sits above any background layers */
#page {
	position: relative;
	z-index: 1;
}

.booking {
	background-color: var(--ccec-white);
	-webkit-backdrop-filter: blur(16px);
}

/* Booking in dark section — rich gradient for premium depth */
.section--dark .booking,
.section--gradient .booking {
	background: transparent;
}

.page-content {
	/* background-color handled by the base rule above (near-opaque white);
	   keep only the blur for the frosted-glass depth over the banner. */
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
}

/* Allow split-blocks inside page-content to show their own background */
.page-content .split-block {
	position: relative;
	z-index: 1;
}

/* Events/news sections inherit from section-- classes */


/* ============================================
  17b. GUTENBERG BLOCK STYLES (Front-end)
   ============================================ */

/* ── Group Block ─────────────────────────────────────────────────────── */
.wp-block-group {
	box-sizing: border-box;
}

/* Group blocks used as sections (full-width) */
.wp-block-group.alignfull {
	padding-left: var(--ccec-spacing-xl);
	padding-right: var(--ccec-spacing-xl);
}

/* Glassmorphism style */
.is-style-ccec-glass {
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid rgba(255, 255, 255, 0.18);
}

/* ── Section Block Styles ────────────────────────────────────────────── */
/* Reusable section wrappers with themed backgrounds, padding, and orbs.
   Use "Group" block > pick a style from the block toolbar. */

.is-style-ccec-section-light {
	background-color: var(--ccec-off-white);
	padding: var(--ccec-spacing-3xl) var(--ccec-spacing-xl);
	border-radius: var(--ccec-radius-lg);
	position: relative;
	overflow: hidden;
}

.is-style-ccec-section-primary {
	background: linear-gradient(135deg, var(--ccec-primary-tint) 0%, var(--ccec-white) 100%);
	padding: var(--ccec-spacing-3xl) var(--ccec-spacing-xl);
	border-radius: var(--ccec-radius-lg);
	border-left: 4px solid var(--ccec-primary);
	position: relative;
	overflow: hidden;
}

.is-style-ccec-section-secondary {
	background: linear-gradient(135deg, var(--ccec-secondary-tint) 0%, var(--ccec-white) 100%);
	padding: var(--ccec-spacing-3xl) var(--ccec-spacing-xl);
	border-radius: var(--ccec-radius-lg);
	border-left: 4px solid var(--ccec-secondary);
	position: relative;
	overflow: hidden;
}

.is-style-ccec-section-dark {
	background: linear-gradient(135deg, var(--ccec-charcoal) 0%, var(--ccec-black) 100%);
	color: var(--ccec-white);
	padding: var(--ccec-spacing-3xl) var(--ccec-spacing-xl);
	border-radius: var(--ccec-radius-lg);
	position: relative;
	overflow: hidden;
}

.is-style-ccec-section-dark h1,
.is-style-ccec-section-dark h2,
.is-style-ccec-section-dark h3,
.is-style-ccec-section-dark h4,
.is-style-ccec-section-dark p,
.is-style-ccec-section-dark li {
	color: var(--ccec-white);
}

.is-style-ccec-section-dark a:not(.btn):not(.wp-block-button__link) {
	color: var(--ccec-primary-light);
}

.is-style-ccec-section-brand {
	background: linear-gradient(135deg, var(--ccec-primary) 0%, var(--ccec-primary-dark) 100%);
	color: var(--ccec-white);
	padding: var(--ccec-spacing-3xl) var(--ccec-spacing-xl);
	border-radius: var(--ccec-radius-lg);
	position: relative;
	overflow: hidden;
}

.is-style-ccec-section-brand h1,
.is-style-ccec-section-brand h2,
.is-style-ccec-section-brand h3,
.is-style-ccec-section-brand h4,
.is-style-ccec-section-brand p,
.is-style-ccec-section-brand li {
	color: var(--ccec-white);
}

.is-style-ccec-section-brand a:not(.btn):not(.wp-block-button__link) {
	color: var(--ccec-accent);
}

/* Light section styles use semi-transparent bg so fixed orbs show through */
.is-style-ccec-section-light {
	background-color: rgba(247, 247, 247, 0.65) !important;
}

.is-style-ccec-section-primary {
	background: linear-gradient(135deg, var(--ccec-primary-tint) 0%, rgba(255, 255, 255, 0.65) 100%) !important;
}

.is-style-ccec-section-secondary {
	background: linear-gradient(135deg, rgba(242, 245, 238, 0.7) 0%, rgba(255, 255, 255, 0.65) 100%) !important;
}

/* ── Media & Text Block ──────────────────────────────────────────────── */
.wp-block-media-text {
	margin-bottom: var(--ccec-spacing-2xl);
	border-radius: var(--ccec-radius-lg);
	overflow: hidden;
	background-color: var(--ccec-off-white);
	box-shadow: var(--ccec-shadow-sm);
}

.wp-block-media-text .wp-block-media-text__content {
	padding: var(--ccec-spacing-2xl);
	color: var(--ccec-charcoal);
}

.wp-block-media-text .wp-block-media-text__content h2,
.wp-block-media-text .wp-block-media-text__content h3 {
	color: var(--ccec-primary-dark);
	margin-top: 0;
	margin-bottom: var(--ccec-spacing-md);
}

.wp-block-media-text .wp-block-media-text__content p {
	color: var(--ccec-charcoal);
	line-height: 1.75;
	margin-bottom: var(--ccec-spacing-md);
}

.wp-block-media-text .wp-block-media-text__content p:last-child {
	margin-bottom: 0;
}

.wp-block-media-text .wp-block-media-text__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ── Columns Block ───────────────────────────────────────────────────── */
.wp-block-columns {
	margin-bottom: var(--ccec-spacing-2xl);
	gap: var(--ccec-spacing-xl);
}

.wp-block-column {
	padding: 0;
}

/* ── Cover Block ─────────────────────────────────────────────────────── */
.wp-block-cover {
	border-radius: var(--ccec-radius-lg);
	overflow: hidden;
	margin-bottom: var(--ccec-spacing-2xl);
	min-height: 350px;
}

.wp-block-cover .wp-block-cover__inner-container {
	padding: var(--ccec-spacing-2xl);
}

.wp-block-cover .wp-block-cover__inner-container h2,
.wp-block-cover .wp-block-cover__inner-container h3 {
	color: var(--ccec-white);
}

.wp-block-cover .wp-block-cover__inner-container p {
	color: rgba(255, 255, 255, 0.9);
}

/* Animated cover style */
.is-style-ccec-animated .wp-block-cover__image-background {
	animation: ccecCoverZoom 25s ease-in-out infinite alternate;
}

@keyframes ccecCoverZoom {
	from { transform: scale(1); }
	to   { transform: scale(1.08); }
}

/* ── Image Block ─────────────────────────────────────────────────────── */
.wp-block-image {
	margin-bottom: var(--ccec-spacing-xl);
}

.wp-block-image img {
	border-radius: var(--ccec-radius-xl);
	box-shadow: var(--ccec-shadow-editorial);
	transition: transform 0.5s var(--ccec-ease-out-expo), box-shadow 0.4s ease;
}

.wp-block-image:hover img {
	transform: scale(1.01);
	box-shadow: var(--ccec-shadow-hover);
}

.wp-block-image figcaption {
	color: var(--ccec-dark-grey);
	font-size: var(--ccec-font-size-small);
	text-align: center;
	margin-top: var(--ccec-spacing-sm);
}

/* ── Buttons Block ───────────────────────────────────────────────────── */
.wp-block-buttons {
	margin-bottom: var(--ccec-spacing-xl);
	gap: var(--ccec-spacing-md);
}

.wp-block-button__link {
	border-radius: var(--ccec-radius-md);
	padding: 0.85rem 1.75rem;
	font-weight: 600;
	font-size: var(--ccec-font-size-medium);
	transition: all 0.3s var(--ccec-ease-out-expo);
	box-shadow: var(--ccec-shadow-sm);
}

.wp-block-button__link:hover {
	transform: translateY(-2px);
	box-shadow: var(--ccec-shadow-md);
}

/* Pulse button style */
.is-style-ccec-pulse .wp-block-button__link {
	animation: pulseGlow 3s ease-in-out infinite;
}

/* Arrow button style */
.is-style-ccec-arrow .wp-block-button__link::after {
	content: " \2192";
	transition: transform 0.2s ease;
	display: inline-block;
}

.is-style-ccec-arrow .wp-block-button__link:hover::after {
	transform: translateX(4px);
}

/* ── Separator Block ─────────────────────────────────────────────────── */
.wp-block-separator {
	border-color: var(--ccec-light-grey);
	margin: var(--ccec-spacing-2xl) 0;
}

.wp-block-separator.has-primary-color {
	border-color: var(--ccec-primary);
}

.wp-block-separator.is-style-wide {
	border-bottom-width: 2px;
}

/* ── Spacer Block ────────────────────────────────────────────────────── */
.wp-block-spacer {
	/* Spacers already handle their own height */
}

/* ── List Block ──────────────────────────────────────────────────────── */
.entry-content .wp-block-list {
	margin-bottom: var(--ccec-spacing-lg);
}

/* ── Pullquote Block ─────────────────────────────────────────────────── */
.wp-block-pullquote {
	border-top: 3px solid var(--ccec-primary);
	border-bottom: 3px solid var(--ccec-primary);
	padding: var(--ccec-spacing-xl) 0;
	margin: var(--ccec-spacing-2xl) 0;
}

.wp-block-pullquote blockquote p {
	font-family: var(--ccec-font-family);
	font-size: clamp(1.25rem, 2.5vw, 1.75rem);
	color: var(--ccec-charcoal);
	font-style: italic;
	line-height: 1.5;
}

.wp-block-pullquote cite {
	font-style: normal;
	color: var(--ccec-primary);
	font-size: var(--ccec-font-size-small);
}


/* ============================================
  18. SCROLL ANIMATIONS
   ============================================ */

/*
 * Scroll-reveal approach: elements with [data-animate] start hidden in CSS
 * so there is NO flash of content. JS (IntersectionObserver) adds .is-visible
 * when elements enter the viewport, triggering the entrance animation.
 *
 * The .js-ready class on <html> gates the hidden state. Without JavaScript,
 * .js-ready is never added so all content remains fully visible — no
 * noscript tag or fallback needed.
 */

/* Initial hidden state — only when JS is confirmed ready.
   Elements start invisible and in their "from" position so the animation
   plays forward smoothly without any flash.
   Default transform is translateY(30px) for fade-up, stagger-cards, and
   any unrecognised values that fall through to the default fadeUp animation. */
.js-ready [data-animate] {
	opacity: 0;
	transform: translateY(30px);
	/* No permanent will-change here — it promoted every reveal element (70+ on
	   the homepage) to its own GPU layer for the whole session. The fade/slide
	   is cheap enough without the hint, and dropping it cuts compositor work. */
}

/* fade-down uses fadeIn (opacity only) — no transform offset */
.js-ready [data-animate="fade-down"] {
	transform: none;
}

.js-ready [data-animate="fade-right"] {
	transform: translateX(-40px);
}

.js-ready [data-animate="fade-left"] {
	transform: translateX(40px);
}

.js-ready [data-animate="zoom-in"] {
	transform: scale(0.92);
}

/* Stagger containers are visible themselves; their children animate */
.js-ready [data-animate="stagger-up"] {
	opacity: 1;
	transform: none;
}

.js-ready [data-animate="stagger-up"] > * {
	opacity: 0;
	transform: translateY(30px);
}

/* Revealed state — animation plays from current (hidden) to final (visible).
   animation-fill-mode: both ensures the element stays at the "to" state. */
[data-animate].is-visible {
	animation: fadeUp 0.7s var(--ccec-ease-out-expo) both;
}

[data-animate="fade-down"].is-visible  { animation-name: fadeIn; }
[data-animate="fade-right"].is-visible { animation-name: slideRight; }
[data-animate="fade-left"].is-visible  { animation-name: slideLeft; }
[data-animate="zoom-in"].is-visible    { animation-name: scaleIn; }

[data-animate="stagger-up"].is-visible { animation: none; opacity: 1; transform: none; }
[data-animate="stagger-up"].is-visible > *:nth-child(1) { animation: fadeUp 0.6s var(--ccec-ease-out-expo) 0ms both; }
[data-animate="stagger-up"].is-visible > *:nth-child(2) { animation: fadeUp 0.6s var(--ccec-ease-out-expo) 80ms both; }
[data-animate="stagger-up"].is-visible > *:nth-child(3) { animation: fadeUp 0.6s var(--ccec-ease-out-expo) 160ms both; }
[data-animate="stagger-up"].is-visible > *:nth-child(4) { animation: fadeUp 0.6s var(--ccec-ease-out-expo) 240ms both; }
[data-animate="stagger-up"].is-visible > *:nth-child(5) { animation: fadeUp 0.6s var(--ccec-ease-out-expo) 320ms both; }
[data-animate="stagger-up"].is-visible > *:nth-child(6) { animation: fadeUp 0.6s var(--ccec-ease-out-expo) 400ms both; }

/* Fallback: if JS never loads or is disabled, everything stays visible.
   The .js-ready class is only added by JavaScript, so without it
   [data-animate] elements keep their default visible state. */

/* ── Native Scroll-Driven (Chrome 115+, progressive enhancement) ── */
@supports (animation-timeline: view()) {
	[data-animate="fade-up"] {
		animation: ccec-sda-fade-up linear both;
		animation-timeline: view();
		animation-range: entry 0% entry 30%;
	}
	[data-animate="fade-left"] {
		animation: ccec-sda-fade-left linear both;
		animation-timeline: view();
		animation-range: entry 0% entry 30%;
	}
	[data-animate="fade-right"] {
		animation: ccec-sda-fade-right linear both;
		animation-timeline: view();
		animation-range: entry 0% entry 30%;
	}
	[data-animate="scale-up"] {
		animation: ccec-sda-scale-up linear both;
		animation-timeline: view();
		animation-range: entry 0% entry 35%;
	}
	@keyframes ccec-sda-fade-up {
		from { opacity: 0; transform: translateY(40px); }
		to   { opacity: 1; transform: translateY(0); }
	}
	@keyframes ccec-sda-fade-left {
		from { opacity: 0; transform: translateX(-40px); }
		to   { opacity: 1; transform: translateX(0); }
	}
	@keyframes ccec-sda-fade-right {
		from { opacity: 0; transform: translateX(40px); }
		to   { opacity: 1; transform: translateX(0); }
	}
	@keyframes ccec-sda-scale-up {
		from { opacity: 0; transform: scale(0.92); }
		to   { opacity: 1; transform: scale(1); }
	}
}


/* ============================================
  19. ACCESSIBILITY
   ============================================ */

/* Reduced motion: provide instant visual results instead of animations.
   Content is always visible. JS still adds .is-visible for CSS to style
   the final state — just without movement transitions.

   ROOT CAUSE FIX: animation-delay must also be zeroed — otherwise elements
   using animation-fill-mode:both start at the FROM state (opacity:0) for
   the entire delay period, creating a white "flash" as they pop in. */
@media (prefers-reduced-motion: reduce) {

	/* Kill all motion — transitions, animations, delays, scroll behaviour */
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-delay: 0ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		transition-delay: 0ms !important;
		scroll-behavior: auto !important;
	}

	/* Scroll-reveal elements: override the initial hidden state AND
	   show immediately at full opacity — no animation, no delay.
	   .is-visible is still added by JS so final-state styles apply. */
	.js-ready [data-animate],
	[data-animate],
	[data-animate].is-visible,
	[data-animate] > * {
		opacity: 1 !important;
		transform: none !important;
		filter: none !important;
		animation: none !important;
	}

	/* Hero elements: force visible regardless of animation fill state.
	   These use animation-delay 0–0.6s with fill-mode:both, so they
	   start at opacity:0. Zero delay ensures they render visible immediately. */
	.hero__heading,
	.hero h1,
	.hero__subheading,
	.hero__intro,
	.hero__cta,
	.hero__ctas,
	.hero__stats,
	.hero__content {
		opacity: 1 !important;
		transform: none !important;
		filter: none !important;
		-webkit-text-fill-color: var(--ccec-white);
		background: none;
	}

	/* Keep gradient text readable — solid white fallback */
	.hero__heading,
	.hero h1 {
		color: var(--ccec-white) !important;
	}

	/* Decorative blobs: keep visible but static */
	.hero::before,
	.hero::after {
		animation: none !important;
	}

	/* Testimonials ticker: allow slow CSS animation (JS sets slow speed) */
	.testimonials__track {
		animation-duration: var(--ticker-duration, 120s) !important;
		animation-iteration-count: infinite !important;
	}

	/* Animated gradient borders: show at full width, no scale-in */
	.page-features__item::before,
	.section-title::after {
		transform: scaleX(1) !important;
	}

	/* Skip all hover transforms — keep colours only */
	.showcase-item:hover,
	.btn--primary:hover,
	.btn--outline:hover,
	.btn-primary:hover,
	.btn-outline:hover,
	.page-features__item:hover,
	.contact-card:hover,
	.location__feature:hover,
	.sidebar-card:hover,
	.testimonial-card:hover,
	.ccec-back-to-top:hover,
	.ccec-share__link:hover {
		transform: none !important;
	}

	/* FAB: show without pulse */
	.fab,
	.ccec-fab {
		animation: none !important;
		opacity: 1 !important;
	}

	/* Reading progress bar: hide it (pure decoration) */
	.ccec-reading-progress {
		display: none !important;
	}
}

/* Focus styles — :focus fallback for Safari 14 and older browsers */
a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus {
	outline: 3px solid var(--ccec-primary);
	outline-offset: 3px;
}

/* Remove focus ring for mouse/touch users on supporting browsers */
a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
input:focus:not(:focus-visible),
textarea:focus:not(:focus-visible),
select:focus:not(:focus-visible) {
	outline: none;
}

/* Focus-visible for keyboard users */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: 3px solid var(--ccec-primary);
	outline-offset: 3px;
}

.main-navigation a:focus-visible {
	outline-offset: -2px;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
	.btn-primary,
	.btn--primary {
		border: 2px solid currentColor;
	}

	.site-header {
		border-bottom-width: 2px;
		background: var(--ccec-white);
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}

	.hero__heading,
	.hero h1 {
		-webkit-text-fill-color: var(--ccec-white);
		background: none;
	}

	.testimonials .testimonial-card {
		border-width: 2px;
	}
}

/* Skip link (Astra parent provides the element) */
.skip-link {
	position: absolute;
	top: -100%;
	left: 0;
	background: var(--ccec-primary-dark);
	color: var(--ccec-white);
	padding: 0.75rem 1.5rem;
	text-decoration: none;
	font-weight: 700;
	font-size: 0.875rem;
	z-index: 100000;
	border-bottom-right-radius: var(--ccec-radius-sm);
	transition: top 0.15s ease;
}

.skip-link:focus {
	top: 0;
	outline: 3px solid var(--ccec-green, #2E7D32);
	outline-offset: 2px;
}

@media (forced-colors: active) {
	.skip-link:focus {
		outline: 3px solid LinkText;
		background: Canvas;
		color: LinkText;
	}
}

@media print {
	.skip-link { display: none; }
}

/* Placeholder contrast fix */
::placeholder {
	color: var(--ccec-dark-grey) !important;
	opacity: 1;
}

/* Link contrast overrides for various sections */
.hero a:not(.btn):not(.btn--primary):not(.btn--outline) {
	color: var(--ccec-white);
	text-decoration: underline;
}

.hero a:not(.btn):not(.btn--primary):not(.btn--outline):hover {
	color: rgba(255, 255, 255, 0.85);
}

.testimonials a {
	color: var(--ccec-primary);
	text-decoration: underline;
}

.location a:not(.btn) {
	color: var(--ccec-primary-dark);
}

.location a:not(.btn):hover {
	color: var(--ccec-primary);
}

.booking a:not(.btn):not(.btn--primary):not(.btn--outline) {
	color: var(--ccec-accent);
	text-decoration: underline;
}

.booking a:not(.btn):not(.btn--primary):not(.btn--outline):hover {
	color: var(--ccec-white);
}


/* ============================================
  20. PRINT STYLES
   ============================================ */
@media print {
	.top-bar,
	.site-header,
	.footer-social,
	.booking__form-area,
	.hero__cta,
	.hero__ctas,
	.ccec-fab,
	.ccec-page-loader {
		display: none !important;
	}

	body {
		font-size: 12pt;
		color: #000;
	}

	a { color: #000; text-decoration: underline; }
	section { page-break-inside: avoid; }

	.hero__heading,
	.hero h1 {
		-webkit-text-fill-color: #000;
		background: none;
		color: #000;
	}
}


/* ============================================
  21. SECTION STYLE VARIANTS (dark/light rhythm)
   ============================================ */

/* Light sections */
.section--light {
	background: var(--ccec-white);
	color: var(--ccec-dark-grey);
}

.section--light-alt {
	background: var(--ccec-off-white);
	color: var(--ccec-dark-grey);
}

.section--light-green {
	background: var(--ccec-secondary-tint);
	color: var(--ccec-dark-grey);
}

/* Dark sections — heritage brand depth.
   Rich dark tones with warm cream text for luxury feel. */
.section--dark {
	background: linear-gradient(160deg, var(--ccec-secondary-dark) 0%, var(--ccec-deep-dark-warm) 60%, var(--ccec-deep-dark) 100%);
	color: var(--ccec-white);
	position: relative;
}

.section--dark .section-label {
	color: var(--ccec-green-300);
}

.section--dark .section-label::before {
	background: var(--ccec-green-400);
}

.section--dark h2,
.section--dark h3,
.section--dark .section-title {
	color: var(--ccec-white);
}

.section--dark p {
	color: rgba(255, 255, 255, 0.8);
}

.section--dark a:not(.btn) {
	color: var(--ccec-green-300);
}

.section--dark a:not(.btn):hover {
	color: var(--ccec-green-100);
}

/* Dark section subtle crosshatch pattern */
.section--dark::after {
	content: '';
	position: absolute;
	inset: 0;
	opacity: 0.03;
	background-image:
		repeating-linear-gradient(45deg, #fff 0, #fff 1px, transparent 0, transparent 50%);
	background-size: 60px 60px;
	pointer-events: none;
}

/* Gradient section */
.section--gradient {
	background: linear-gradient(135deg, var(--ccec-secondary-dark) 0%, var(--ccec-green-900) 100%);
	color: var(--ccec-white);
	position: relative;
}

.section--gradient h2,
.section--gradient h3,
.section--gradient .section-title {
	color: var(--ccec-white);
}

.section--gradient p {
	color: rgba(255, 255, 255, 0.85);
}

/* Section dividers — elegant curved transitions between sections.
   Wider ellipse for a welcoming, subtle feel. */
@supports (clip-path: ellipse(60% 100% at 50% 100%)) {
	.section--dark + .section--light::before,
	.section--dark + .section--light-alt::before,
	.section--dark + .section--light-green::before {
		content: '';
		display: block;
		height: 80px;
		margin-top: -80px;
		position: relative;
		z-index: 2;
		background: inherit;
		clip-path: ellipse(60% 100% at 50% 100%);
	}

	.section--light + .section--dark::before,
	.section--light-alt + .section--dark::before,
	.section--light-green + .section--dark::before {
		content: '';
		display: block;
		height: 80px;
		margin-top: -80px;
		position: relative;
		z-index: 2;
		background: inherit;
		clip-path: ellipse(60% 100% at 50% 0%);
	}
}


/* ============================================
   23. PREMIUM MICRO-INTERACTIONS
   ============================================ */

/* ── Text Selection ─────────────────────────── */
::selection {
	background: var(--ccec-primary);
	color: var(--ccec-white);
}

::-moz-selection {
	background: var(--ccec-primary);
	color: var(--ccec-white);
}

/* ── Custom Scrollbar ───────────────────────── */
::-webkit-scrollbar {
	width: 10px;
}

::-webkit-scrollbar-track {
	background: var(--ccec-off-white);
}

::-webkit-scrollbar-thumb {
	background: linear-gradient(180deg, var(--ccec-primary) 0%, var(--ccec-primary-dark) 100%);
	border-radius: 5px;
	border: 2px solid var(--ccec-off-white);
}

::-webkit-scrollbar-thumb:hover {
	background: linear-gradient(180deg, var(--ccec-primary-light) 0%, var(--ccec-primary) 100%);
}

/* Firefox scrollbar */
html {
	scrollbar-width: thin;
	scrollbar-color: var(--ccec-primary) var(--ccec-off-white);
}

/* ── Form Input Caret ───────────────────────── */
input,
textarea,
select {
	caret-color: var(--ccec-primary);
}

/* ── Accent Color for Checkboxes/Radios ─────── */
input[type="checkbox"],
input[type="radio"] {
	accent-color: var(--ccec-primary);
}

/* ── Inline prose links ─────────────────────────
   Always-visible underline so links are distinguishable from body text
   without relying on colour alone (WCAG 1.4.1). Hover thickens the underline
   for feedback rather than revealing it for the first time. */
.entry-content a:not(.btn):not(.wp-block-button__link),
.page-content a:not(.btn):not(.wp-block-button__link) {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
	transition: text-decoration-thickness 0.2s ease, color 0.3s ease;
	padding-bottom: 2px;
}

.entry-content a:not(.btn):not(.wp-block-button__link):hover,
.page-content a:not(.btn):not(.wp-block-button__link):hover {
	text-decoration-thickness: 2px;
}

/* ── Button Active/Click Feedback ───────────── */
.btn--primary:active,
a.btn--primary:active,
.btn--outline:active,
a.btn--outline:active,
.apply-btn:active {
	transform: translateY(0) scale(0.98);
	transition-duration: 0.1s;
}

/* ── Card Image Hover Brightness ────────────── */
.event-card__image img,
.news-card__image img,
.showcase-item__image img {
	transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1),
	            filter 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.event-card:hover .event-card__image img,
.news-card:hover .news-card__image img {
	filter: brightness(1.08) contrast(1.02);
}

/* ── Consistent Focus Ring ──────────────────── */
:focus-visible {
	outline: 2px solid var(--ccec-primary);
	outline-offset: 3px;
	border-radius: 2px;
}

/* ── Smooth Color Transitions on All Links ──── */
a {
	transition: color 0.25s ease;
}

/* ── Content Visibility for Off-Screen ──────── */
@supports (content-visibility: auto) {
	.facilities,
	.venue-showcase,
	.testimonials,
	.upcoming-events,
	.latest-news,
	.location,
	.cafe-1899,
	.booking {
		content-visibility: auto;
		contain-intrinsic-size: auto 600px;
	}
}

/* ── Gradient Border on Dark Section Cards ──── */
.section--dark .info-card,
.section--dark .event-card,
.section--dark .news-card {
	border: 1px solid rgba(255, 255, 255, 0.08);
	background: rgba(255, 255, 255, 0.04);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}

/* ═══════════════════════════════════════════════════════════════════════════
   BOOKING — COMPACT MODE
   ═════════════════════════════════════════════════════════════════════════ */
.booking--compact {
	padding-block: 4rem;
	text-align: center;
}

.booking__compact-inner {
	max-width: 720px;
	margin-inline: auto;
}

.booking__compact-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	margin-top: 2rem;
}

.booking__compact-link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: #fff;
	font-weight: 600;
	font-size: 1.05rem;
	text-decoration: none;
	transition: opacity 0.2s ease;
}

.booking__compact-link:hover {
	opacity: 0.8;
}

/* ═══════════════════════════════════════════════════════════════════════════
   CONTACT PAGE — INFO STRIP
   ═════════════════════════════════════════════════════════════════════════ */
.contact-info-strip {
	background: var(--ccec-surface-alt, #F8FAFC);
	border-bottom: 1px solid var(--ccec-border-light, #E5E5E5);
	padding-block: 2.5rem;
}

.contact-info-strip .container {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.contact-info-card {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.5rem;
	background: #fff;
	border-radius: 0.75rem;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.contact-info-card__icon {
	flex-shrink: 0;
	width: 2.5rem;
	height: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--ccec-primary, #C86A2E);
	color: #fff;
	border-radius: 50%;
}

.contact-info-card__body {
	min-width: 0;
}

.contact-info-card__label {
	display: block;
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--ccec-dark-grey, #616365);
	margin-bottom: 0.375rem;
}

.contact-info-card__value {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--ccec-charcoal, #333333);
	line-height: 1.5;
}

.contact-info-card__value a {
	color: inherit;
	text-decoration: none;
}

.contact-info-card__value a:hover {
	color: var(--ccec-primary, #C86A2E);
}

@media (max-width: 768px) {
	.contact-info-strip .container {
		grid-template-columns: 1fr;
	}
}

/* ═══════════════════════════════════════════════════════════════════════════
   CONTACT PAGE — MAP SECTION
   ═════════════════════════════════════════════════════════════════════════ */
.contact-map {
	padding-block: 0;
}

.contact-map__frame {
	display: block;
	width: 100%;
	height: 420px;
	border: none;
	filter: grayscale(20%);
}

@media (max-width: 768px) {
	.contact-map__frame {
		height: 280px;
	}
}

.section--dark .info-card:hover,
.section--dark .event-card:hover,
.section--dark .news-card:hover {
	border-color: rgba(255, 255, 255, 0.15);
	background: rgba(255, 255, 255, 0.08);
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

/* ── Dark Section Form Inputs ─────────────────
   Excludes inputs inside the white form card (.booking__form-area)
   which needs standard light-bg contrast.                       */
.section--dark input[type="text"],
.section--dark input[type="email"],
.section--dark input[type="tel"],
.section--dark textarea,
.section--dark select,
.section--gradient input[type="text"]:not(.booking__form-area input),
.section--gradient input[type="email"]:not(.booking__form-area input),
.section--gradient input[type="tel"]:not(.booking__form-area input),
.section--gradient textarea:not(.booking__form-area textarea),
.section--gradient select:not(.booking__form-area select) {
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.2);
	color: var(--ccec-white);
	border-radius: var(--ccec-radius-md);
}

.section--dark input::placeholder,
.section--dark textarea::placeholder,
.section--gradient input:not(.booking__form-area input)::placeholder,
.section--gradient textarea:not(.booking__form-area textarea)::placeholder {
	color: rgba(255, 255, 255, 0.45);
}

.section--dark input:focus,
.section--dark textarea:focus,
.section--dark select:focus,
.section--gradient input:not(.booking__form-area input):focus,
.section--gradient textarea:not(.booking__form-area textarea):focus,
.section--gradient select:not(.booking__form-area select):focus {
	border-color: var(--ccec-secondary-light);
	box-shadow: 0 0 0 3px rgba(161, 190, 120, 0.25);
	outline: none;
}

/* ── Animated Border Reveal on Cards ────────── */
.info-card::before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--ccec-primary), var(--ccec-primary-light));
	transition: width 0.4s cubic-bezier(0.22, 1, 0.36, 1),
	            left 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.info-card:hover::before {
	width: 100%;
	left: 0;
}

.info-card {
	position: relative;
	overflow: hidden;
}


/* ── Page Load Transition ───────────────────── */
.ccec-page-loader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 99999;
	background: var(--ccec-white);
	pointer-events: none;
	transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1);
	display: none;
	align-items: center;
	justify-content: center;
}

.ccec-page-loader.is-loading {
	display: flex;
}

.ccec-page-loader__spinner {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 1.25rem;
}

.ccec-page-loader__logo {
	width: 64px;
	height: 59px;
	color: var(--ccec-primary);
	animation: loaderSpin 1.6s linear infinite;
	filter: drop-shadow(0 4px 16px rgba(200, 106, 46, 0.25));
}

.ccec-page-loader__pulse {
	width: 40px;
	height: 3px;
	border-radius: 2px;
	background: linear-gradient(90deg, transparent, var(--ccec-primary-light), transparent);
	animation: loaderPulse 1.6s ease-in-out infinite;
}

@keyframes loaderSpin {
	from { transform: rotate(0deg); }
	to   { transform: rotate(360deg); }
}

@keyframes loaderPulse {
	0%, 100% { opacity: 0.3; transform: scaleX(0.6); }
	50%      { opacity: 1; transform: scaleX(1); }
}

.ccec-page-loader__bar {
	position: absolute;
	top: 0;
	left: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--ccec-primary-dark), var(--ccec-primary));
	width: 0;
	transition: width 0.4s ease;
}

.ccec-page-loader.is-loading .ccec-page-loader__bar {
	width: 70%;
}

.ccec-page-loader.is-loaded {
	display: flex;
	opacity: 0;
}

.ccec-page-loader.is-hidden {
	display: none !important;
}

@media (prefers-reduced-motion: reduce) {
	.ccec-page-loader__logo {
		animation: none;
	}
}


/* ============================================
  22. RESPONSIVE BREAKPOINTS
   ============================================ */

/* Large Tablet (max 1024px) */
/* Hidden by default — only shown inside mobile nav overlay */
.mobile-nav-footer {
	display: none;
}

@media (max-width: 1565px) {
	.footer-grid {
		grid-template-columns: 1fr 1fr;
		gap: var(--ccec-spacing-2xl);
	}

	/* Testimonials ticker: slightly narrower cards on tablet */
	.testimonials .testimonial-card {
		flex: 0 0 340px;
		min-width: 280px;
	}

	/* Hide header CTA + desktop nav; show mobile toggle */
	.apply-btn {
		display: none !important;
	}

	/* ══════════════════════════════════════════════════════════════════════
	   MOBILE TOGGLE BUTTON
	   ══════════════════════════════════════════════════════════════════════ */

	/* ── Hamburger toggle (default state) ──────────────────────────────── */
	.mobile-menu-toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0.4rem;
		position: relative;
		z-index: 1001;
		background: var(--ccec-primary, #C86A2E);
		color: #fff;
		border: none;
		border-radius: 999px;
		padding: 0.5rem 0.9rem 0.5rem 0.75rem;
		cursor: pointer;
		font-family: inherit;
		font-size: 0.7rem;
		font-weight: 600;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		transition: background 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease,
		            width 0.25s ease, padding 0.25s ease, border-radius 0.25s ease;
		box-shadow: 0 2px 10px rgba(200, 106, 46, 0.3);
		-webkit-tap-highlight-color: transparent;
	}

	.mobile-menu-toggle:hover,
	.mobile-menu-toggle:focus-visible {
		background: var(--ccec-primary-dark);
		box-shadow: 0 4px 18px rgba(200, 106, 46, 0.45);
		outline: none;
		transform: scale(1.04);
	}

	.mobile-menu-toggle:active { transform: scale(0.96); }

	.mobile-menu-toggle .icon-hamburger line,
	.mobile-menu-toggle .icon-close line {
		transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.2s ease;
		transform-origin: center;
	}

	/* ── Close state — compact circle, no text ─────────────────────────── */
	.mobile-menu-toggle[aria-expanded="true"] {
		width: 40px;
		height: 40px;
		padding: 0;
		gap: 0;
		border-radius: 50%;
		background: rgba(255, 255, 255, 0.15);
		box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.25);
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
	}

	.mobile-menu-toggle[aria-expanded="true"]:hover,
	.mobile-menu-toggle[aria-expanded="true"]:focus-visible {
		background: rgba(255, 255, 255, 0.25);
		box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35);
		transform: scale(1.08) rotate(90deg);
	}

	/* Hide label text completely in close state */
	.mobile-menu-toggle[aria-expanded="true"] .toggle-label {
		display: none;
	}

	/* ══════════════════════════════════════════════════════════════════════
	   FULL-SCREEN OVERLAY
	   ══════════════════════════════════════════════════════════════════════ */

	.main-navigation {
		position: fixed;
		inset: 0;
		width: 100vw;
		height: 100vh;
		height: 100dvh;
		background:
			radial-gradient(ellipse 60% 40% at 50% 0%, rgba(200, 106, 46, 0.10) 0%, transparent 60%),
			linear-gradient(175deg, var(--ccec-deep-dark) 0%, var(--ccec-black) 60%, var(--ccec-deep-dark-warm) 100%);
		backdrop-filter: blur(20px) saturate(1.2);
		-webkit-backdrop-filter: blur(20px) saturate(1.2);
		z-index: 1000;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transition: opacity 0.38s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.38s;
		display: flex;
		flex-direction: column;
		align-items: center;
		/* `safe center` falls back to flex-start when content overflows the
		   container — without it, centred-then-overflowing content gets
		   clipped at the top and can't be reached by scrolling. */
		justify-content: safe center;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		/* Padding scales with viewport height — clamps prevent it from
		   collapsing to zero on tall screens or eating half the menu on
		   short screens like landscape phones (~360px tall). */
		padding: clamp(2.5rem, 9vh, 5rem) 1.5rem clamp(1rem, 4vh, 2.5rem);
	}

	.main-navigation.is-open {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
	}

	/* Accent gradient bar at the very top */
	.main-navigation::before {
		content: '';
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		height: 3px;
		background: linear-gradient(90deg, transparent 5%, var(--ccec-primary, #C86A2E) 30%, var(--ccec-primary-light, #D47844) 50%, var(--ccec-primary, #C86A2E) 70%, transparent 95%);
		z-index: 1;
		opacity: 0;
		transform: scaleX(0);
		transition: opacity 0.4s ease 0.08s, transform 0.5s cubic-bezier(0.22, 1, 0.36, 1) 0.08s;
	}
	.main-navigation.is-open::before {
		opacity: 1;
		transform: scaleX(1);
	}

	/* Subtle vignette around edges */
	.main-navigation::after {
		content: '';
		position: fixed;
		inset: 0;
		pointer-events: none;
		z-index: 0;
		background: radial-gradient(ellipse at center, transparent 50%, rgba(0, 0, 0, 0.3) 100%);
		opacity: 0;
		transition: opacity 0.4s ease 0.15s;
	}
	.main-navigation.is-open::after {
		opacity: 1;
	}

	/* ══════════════════════════════════════════════════════════════════════
	   NAV LIST — perfectly centred column
	   ══════════════════════════════════════════════════════════════════════ */

	.main-navigation ul {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: 0;
		padding: 0;
		margin: 0 auto;
		list-style: none;
		width: 100%;
		max-width: 360px;
	}

	/* Top-level items — fade up from centre so nothing drifts left/right */
	.main-navigation > ul > li {
		width: 100%;
		opacity: 0;
		transform: translateY(14px);
	}

	.main-navigation.is-open > ul > li {
		animation: mobileNavIn 0.38s cubic-bezier(0.22, 1, 0.36, 1) forwards;
	}

	.main-navigation.is-open > ul > li:nth-child(1) { animation-delay: 0.05s; }
	.main-navigation.is-open > ul > li:nth-child(2) { animation-delay: 0.10s; }
	.main-navigation.is-open > ul > li:nth-child(3) { animation-delay: 0.12s; }
	.main-navigation.is-open > ul > li:nth-child(4) { animation-delay: 0.15s; }
	.main-navigation.is-open > ul > li:nth-child(5) { animation-delay: 0.18s; }
	.main-navigation.is-open > ul > li:nth-child(6) { animation-delay: 0.21s; }
	.main-navigation.is-open > ul > li:nth-child(7) { animation-delay: 0.24s; }
	.main-navigation.is-open > ul > li:nth-child(8) { animation-delay: 0.27s; }

	/* ══════════════════════════════════════════════════════════════════════
	   TOP-LEVEL LINKS
	   ══════════════════════════════════════════════════════════════════════ */

	.main-navigation > ul > li > a,
	.main-navigation > ul > li > a:link,
	.main-navigation > ul > li > a:visited {
		display: block;
		width: 100%;
		/* Padding + font-size both scale with the SMALLER of viewport width
		   or height so the menu compresses uniformly on short screens
		   (landscape phones, small tablets) without overflowing. */
		padding: clamp(0.4rem, 1.3vh, 0.8rem) 1rem;
		font-family: var(--ccec-font-family);
		font-size: clamp(1rem, min(4.5vw, 2.6vh), 1.5rem);
		font-weight: 700;
		letter-spacing: -0.01em;
		line-height: 1.2;
		text-align: center;
		color: rgba(255, 255, 255, 0.9) !important;
		text-decoration: none !important;
		border: none !important;
		background: transparent;
		position: relative;
		z-index: 1;
		transition: color 0.25s ease, transform 0.2s ease;
		-webkit-tap-highlight-color: transparent;
	}

	.main-navigation > ul > li > a:hover,
	.main-navigation > ul > li > a:focus {
		color: #fff !important;
		text-decoration: none !important;
		transform: scale(1.03);
	}

	/* Hover glow line under link */
	.main-navigation > ul > li > a::after {
		content: '' !important;
		display: block !important;
		position: absolute;
		bottom: 0.25rem;
		left: 50%;
		transform: translateX(-50%) scaleX(0);
		width: 40%;
		height: 2px;
		background: var(--ccec-primary-light, #D47844);
		border-radius: 1px;
		transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
	}

	.main-navigation > ul > li > a:hover::after,
	.main-navigation > ul > li > a:focus::after {
		transform: translateX(-50%) scaleX(1) !important;
	}

	/* Kill desktop ::before decorations only */
	.main-navigation > ul > li > a::before {
		display: none !important;
		content: none !important;
	}

	/* Active / current-page highlight */
	.main-navigation > ul > li.current-menu-item > a,
	.main-navigation > ul > li.current-menu-ancestor > a,
	.main-navigation > ul > li.current_page_parent > a {
		color: var(--ccec-primary-light, #D47844) !important;
	}

	.main-navigation > ul > li.current-menu-item > a::after,
	.main-navigation > ul > li.current-menu-ancestor > a::after,
	.main-navigation > ul > li.current_page_parent > a::after {
		transform: translateX(-50%) scaleX(1) !important;
		opacity: 0.6;
	}

	/* Thin divider between top-level items */
	.main-navigation > ul > li + li > a {
		border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
	}

	/* ══════════════════════════════════════════════════════════════════════
	   SUB-MENU (child pages) — always visible, centred, smaller
	   ══════════════════════════════════════════════════════════════════════ */

	.main-navigation .sub-menu {
		/* Override ALL desktop positioning/visibility rules */
		position: static !important;
		display: flex !important;
		flex-direction: column;
		align-items: center;
		opacity: 1 !important;
		visibility: visible !important;
		transform: none !important;
		pointer-events: inherit !important;
		box-shadow: none !important;
		border: none !important;
		border-radius: 0 !important;
		background: transparent !important;
		-webkit-backdrop-filter: none !important;
		backdrop-filter: none !important;
		padding: 0 0 clamp(0.25rem, 1vh, 0.75rem) !important;
		margin: 0 !important;
		min-width: 0 !important;
		width: 100%;
		list-style: none !important;
	}

	.main-navigation .sub-menu li {
		width: 100%;
		text-align: center;
	}

	.main-navigation .sub-menu a,
	.main-navigation .sub-menu a:link,
	.main-navigation .sub-menu a:visited {
		display: block;
		width: 100%;
		padding: clamp(0.22rem, 0.7vh, 0.45rem) 1rem !important;
		font-size: clamp(0.72rem, min(2.4vw, 1.4vh), 0.875rem) !important;
		font-weight: 500 !important;
		letter-spacing: 0.04em;
		text-transform: uppercase;
		text-align: center !important;
		color: rgba(255, 255, 255, 0.45) !important;
		text-decoration: none !important;
		border: none !important;
		background: transparent;
		transition: color 0.2s ease;
		-webkit-tap-highlight-color: transparent;
	}

	.main-navigation .sub-menu a:hover,
	.main-navigation .sub-menu a:focus {
		color: rgba(255, 255, 255, 0.85) !important;
		text-decoration: none !important;
	}

	.main-navigation .sub-menu li.current-menu-item a {
		color: var(--ccec-primary-light, #D47844) !important;
	}

	/* Decorative dot prefix on sub-items */
	.main-navigation .sub-menu a::before {
		content: '\00b7\00a0';
		opacity: 0.5;
		display: inline !important;
	}

	/* Separator between parent link and its sub-items */
	.main-navigation .menu-item-has-children > a {
		padding-bottom: 0.5rem !important;
	}

	/* Sub-menus are always expanded in the mobile overlay, so Astra's dropdown
	   caret would be misleading — hide it here. */
	.main-navigation .dropdown-menu-toggle {
		display: none !important;
	}

	/* Mobile nav footer — contact info at bottom */
	.mobile-nav-footer {
		display: block;
		margin-top: auto;
		padding-top: clamp(0.75rem, 3vh, 2rem);
		text-align: center;
		opacity: 0;
		transform: translateY(12px);
		transition: opacity 0.4s ease 0.35s, transform 0.4s ease 0.35s;
	}

	.main-navigation.is-open .mobile-nav-footer {
		opacity: 1;
		transform: translateY(0);
	}

	.mobile-nav-footer__phone {
		display: block;
		font-size: clamp(0.95rem, 1.9vh, 1.1rem);
		font-weight: 700;
		color: rgba(255, 255, 255, 0.85) !important;
		text-decoration: none !important;
		letter-spacing: 0.02em;
		margin-bottom: clamp(0.2rem, 0.8vh, 0.5rem);
	}

	.mobile-nav-footer__phone:hover {
		color: var(--ccec-primary-light, #D47844) !important;
	}

	.mobile-nav-footer__email {
		display: block;
		font-size: 0.8rem;
		font-weight: 500;
		color: rgba(255, 255, 255, 0.45) !important;
		text-decoration: none !important;
		letter-spacing: 0.04em;
		text-transform: uppercase;
	}

	.mobile-nav-footer__email:hover {
		color: rgba(255, 255, 255, 0.75) !important;
	}

	.mobile-nav-footer__divider {
		display: block;
		width: 40px;
		height: 1px;
		margin: clamp(0.4rem, 1.4vh, 1rem) auto clamp(0.3rem, 1vh, 0.75rem);
		background: rgba(255, 255, 255, 0.1);
	}

	.mobile-nav-footer__tagline {
		font-size: 0.7rem;
		color: rgba(255, 255, 255, 0.25);
		letter-spacing: 0.08em;
		text-transform: uppercase;
	}

	/* Reduced motion for mobile nav */
	@media (prefers-reduced-motion: reduce) {
		.main-navigation,
		.main-navigation::before,
		.main-navigation::after,
		.main-navigation > ul > li > a,
		.mobile-menu-toggle,
		.mobile-nav-footer {
			transition-duration: 0.01ms !important;
			animation-duration: 0.01ms !important;
		}
	}
}

/* ═══════════════════════════════════════════════════════════════════════════
   ADD TO CALENDAR — Event Sidebar
   ═══════════════════════════════════════════════════════════════════════════ */

.add-to-calendar {
	margin-top: 1.25rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--ccec-border, rgba(0, 0, 0, 0.08));
}

.add-to-calendar__label {
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ccec-text-muted, #6b7280);
	margin: 0 0 0.75rem;
}

.add-to-calendar__links {
	display: flex;
	gap: 0.5rem;
}

.add-to-calendar__link {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.45rem 0.75rem;
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--ccec-primary, #C86A2E);
	background: var(--ccec-bg-soft, rgba(200, 106, 46, 0.06));
	border: 1px solid var(--ccec-primary-border, rgba(200, 106, 46, 0.15));
	border-radius: 6px;
	text-decoration: none;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.add-to-calendar__link:hover,
.add-to-calendar__link:focus-visible {
	background: var(--ccec-primary, #C86A2E);
	color: #fff;
	border-color: var(--ccec-primary, #C86A2E);
	box-shadow: 0 2px 8px rgba(200, 106, 46, 0.25);
	text-decoration: none;
}

.add-to-calendar__link svg {
	flex-shrink: 0;
}

@media (max-width: 480px) {
	.add-to-calendar__links {
		flex-direction: column;
	}

	.add-to-calendar__link {
		justify-content: center;
	}
}

/* Mobile (max 768px) */
@media (max-width: 768px) {
	:root {
		--ccec-font-size-3xl: 2.25rem;
		--ccec-font-size-4xl: 2.75rem;
		--ccec-font-size-2xl: 1.6rem;
		--ccec-spacing-4xl:   3.5rem;
		--ccec-spacing-5xl:   5rem;
	}

	.container {
		padding-left: var(--ccec-spacing-lg);
		padding-right: var(--ccec-spacing-lg);
	}

	/* Hero — reduced height on mobile, no scroll indicator */
	.hero {
		min-height: 70vh;
		min-height: 70svh;
		padding: clamp(80px, 14vh, 120px) 0 clamp(50px, 8vh, 80px);
	}


	/* Hero stats */
	.hero__stats {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--ccec-spacing-lg);
	}

	/* Sections */
	.facilities__grid {
		grid-template-columns: 1fr;
	}

	.showcase-grid {
		grid-template-columns: 1fr;
		grid-auto-rows: 220px;
	}

	.showcase-item--large,
	.showcase-item--wide {
		grid-row: auto;
		grid-column: auto;
	}

	/* Testimonials ticker: compact cards on mobile */
	.testimonials .testimonial-card {
		flex: 0 0 85vw;
		min-width: 260px;
		max-width: 340px;
	}

	.location__grid {
		grid-template-columns: 1fr;
	}

	.booking__grid {
		grid-template-columns: 1fr;
	}

	.booking__team {
		grid-template-columns: 1fr;
	}

	/* Footer */
	.footer-grid {
		grid-template-columns: 1fr 1fr;
		row-gap: var(--ccec-spacing-2xl);
	}

	/* Facilities image stack */
	.facilities__image-stack {
		grid-template-columns: 1fr;
		position: static;
		margin-top: var(--ccec-spacing-xl);
	}

	/* Vimeo: hide on mobile, show poster as full cover */
	.hero__vimeo {
		display: none;
	}

	.hero__video-fallback,
	.hero__video-fallback--behind {
		z-index: 0;
		top: 0; right: 0; bottom: 0; left: 0;
		inset: 0;
		width: 100%;
		height: 100%;
	}

	/* Hero responsive */
	.hero {
		min-height: 85vh;
	}

	.hero + .facilities,
	.hero + .section--light,
	.hero + .section--light-alt {
		padding-top: var(--ccec-block-pad-v);
	}

	/* Stats bar responsive */
	.hero__stats {
		flex-direction: column;
		gap: 1rem;
		padding: 1.2rem;
	}

	.hero__stats .stat-item {
		padding: 0.5rem 0;
	}

	/* Section divider height reduction on mobile */
	.section--dark + .section--light::before,
	.section--dark + .section--light-alt::before,
	.section--dark + .section--light-green::before,
	.section--light + .section--dark::before,
	.section--light-alt + .section--dark::before,
	.section--light-green + .section--dark::before {
		height: 30px;
		margin-top: -30px;
	}

	/* Dark section text sizing */
	.section--dark h2,
	.section--gradient h2 {
		font-size: clamp(1.5rem, 6vw, 2rem);
	}

	/* Fixed header on mobile */
	.site-header {
		padding-top: 0.5rem;
		padding-bottom: 0.5rem;
	}

	/* Card hover effects off on touch */
	@media (hover: none) {
		.info-card:hover,
		.event-card:hover,
		.news-card:hover {
			transform: none;
			box-shadow: none;
		}

		.info-card::before {
			width: 100%;
			left: 0;
		}
	}

	/* Scrollbar hidden on mobile */
	::-webkit-scrollbar {
		width: 0;
		display: none;
	}

	html {
		scrollbar-width: none;
	}

	/* Reduce section crosshatch on mobile for performance */
	.section--dark::after {
		display: none;
	}
}

/* Tablet - slightly wider breakpoint for facilities */
@media (max-width: 900px) {
	.facilities__grid {
		grid-template-columns: 1fr;
	}

	.facilities__image-stack {
		position: static;
		margin-top: var(--ccec-spacing-xl);
	}
}

/* Tablet (max 1024px) */
@media (max-width: 1024px) {
	/* Dark section cards stack nicely */
	.section--dark .facilities__grid,
	.section--dark .info-card-grid {
		gap: 1.5rem;
	}

	/* Section padding adjustments */
	.section--dark,
	.section--light,
	.section--light-alt,
	.section--light-green,
	.section--gradient {
		padding-left: var(--ccec-spacing-lg);
		padding-right: var(--ccec-spacing-lg);
	}
}

/* Mobile (max 480px) */
@media (max-width: 480px) {
	:root {
		--ccec-font-size-3xl: 1.75rem;
		--ccec-font-size-4xl: 2.25rem;
		--ccec-spacing-4xl: 3rem;
		--ccec-spacing-5xl: 4rem;
	}

	.container {
		padding-left: var(--ccec-spacing-md);
		padding-right: var(--ccec-spacing-md);
	}

	.top-bar .container {
		justify-content: center;
	}

	.top-bar-nav a {
		padding: 0.25rem 0.5rem;
	}

	/* Hero — shorter on small phones for full video cover */
	.hero {
		min-height: 75vh;
		min-height: 75svh;
		padding: clamp(80px, 14vh, 120px) 0 clamp(50px, 8vh, 80px);
	}

	.hero__stats {
		grid-template-columns: repeat(2, 1fr);
		padding: var(--ccec-spacing-md);
	}

	.footer-grid {
		grid-template-columns: 1fr;
	}

	.footer-bottom .container {
		flex-direction: column;
		text-align: center;
	}

	.ccec-contact-form .form-row {
		grid-template-columns: 1fr;
	}

	/* CTA buttons stack */
	.hero__ctas {
		flex-direction: column;
		align-items: stretch;
		gap: 0.75rem;
	}

	.hero__ctas .btn {
		text-align: center;
		width: 100%;
	}
}


/* ============================================
  22. FLOATING ACTION BUTTON (FAB)
   ============================================ */
.ccec-fab {
	position: fixed;
	bottom: var(--ccec-spacing-xl);
	right: var(--ccec-spacing-xl);
	z-index: 999;
	display: flex;
	align-items: center;
	gap: 0;
	background: linear-gradient(135deg, var(--ccec-primary), var(--ccec-primary-dark));
	color: var(--ccec-white);
	border: none;
	border-radius: 100px;
	padding: 0.85rem 1rem;
	cursor: pointer;
	text-decoration: none;
	font-weight: 600;
	font-size: var(--ccec-font-size-small);
	box-shadow: 0 4px 20px rgba(200, 106, 46, 0.3);
	animation: fabPulse 3s ease-in-out infinite;
	transition: all 0.3s var(--ccec-ease-out-expo);
	overflow: hidden;
}

.ccec-fab:hover {
	transform: scale(1.05);
	box-shadow: 0 6px 30px rgba(200, 106, 46, 0.4);
	text-decoration: none;
	color: var(--ccec-white);
	gap: var(--ccec-spacing-sm);
	padding-right: 1.3rem;
}

.ccec-fab:active {
	transform: scale(0.97);
}

.ccec-fab:focus-visible {
	outline: 3px solid var(--ccec-white);
	outline-offset: 3px;
}

.ccec-fab__icon {
	width: 20px;
	height: 20px;
	fill: var(--ccec-white);
	flex-shrink: 0;
	opacity: 1;
}

.ccec-fab__label {
	max-width: 0;
	overflow: hidden;
	white-space: nowrap;
	transition: max-width 0.4s var(--ccec-ease-out-expo), opacity 0.3s ease;
	opacity: 0;
}

.ccec-fab:hover .ccec-fab__label {
	max-width: 120px;
	opacity: 1;
}

/* The .ccec-fab is now always visible — previously a scroll-driven
   animation hid it until 80vh of scroll, which meant most visitors
   never noticed it. Pairing it with the always-visible phone FAB on
   the opposite corner makes the contact shortcuts symmetric and
   immediately discoverable. */


/* ============================================
   22. EVENTS CALENDAR
   ============================================ */

/* ── Calendar Controls Bar ─────────────────────────────────────────────── */

.events-calendar {
	padding: var(--ccec-spacing-4xl) 0;
	/* CSS containment — prevents calendar AJAX re-renders from triggering
	   full-page layout recalculation. Direct INP improvement for month nav. */
	contain: layout paint;
}

.calendar-controls {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 2rem;
	padding: 1rem 1.5rem;
	background: var(--ccec-glass-bg, rgba(255, 255, 255, 0.7));
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid var(--ccec-glass-border, rgba(255, 255, 255, 0.2));
	border-radius: var(--ccec-radius-lg);
	box-shadow: var(--ccec-shadow-sm);
}

.calendar-controls__nav {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.calendar-controls__title {
	font-size: 1.375rem;
	font-weight: 800;
	min-width: 200px;
	text-align: center;
	margin: 0;
	color: var(--ccec-charcoal);
}

.calendar-controls__prev,
.calendar-controls__next {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0 !important;
	font-size: 1rem !important;
	border: 2px solid var(--ccec-primary);
	border-radius: 50%;
	background: #fff;
	color: var(--ccec-primary);
	transition: background 0.2s ease, transform 0.2s ease, color 0.2s ease;
}

.calendar-controls__prev:hover,
.calendar-controls__next:hover {
	background: var(--ccec-primary);
	color: #fff;
	transform: scale(1.08);
}

.calendar-controls__filters {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.calendar-controls__category {
	padding: 0.5rem 1rem;
	/* Override Astra's fixed height:40px so the option text isn't clipped. */
	height: auto;
	border: 1px solid var(--ccec-light-grey);
	border-radius: var(--ccec-radius-md);
	background: #fff;
	font-size: 0.875rem;
	cursor: pointer;
}

.calendar-controls__view {
	display: flex;
}

.calendar-controls__view-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.6rem 1.25rem;
	border: 2px solid var(--ccec-primary);
	border-radius: var(--ccec-radius-md);
	background: var(--ccec-primary);
	color: #fff;
	font-size: 0.875rem;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.25s ease, color 0.25s ease, transform 0.2s ease;
}

.calendar-controls__view-btn:hover {
	background: var(--ccec-primary-dark);
	border-color: var(--ccec-primary-dark);
	transform: translateY(-1px);
}

.calendar-controls__view-btn svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
	flex-shrink: 0;
}

.calendar-controls__view-btn span {
	white-space: nowrap;
}

/* ── Calendar Grid ─────────────────────────────────────────────────────── */

.calendar-view {
	position: relative;
	min-height: 300px;
}

.calendar-view--loading {
	opacity: 0.5;
	pointer-events: none;
	transition: opacity 0.3s ease;
}

/* Calendar grid — modern whitespace-separated design.
   Separated border-spacing, rounded cells, no outer border
   for clean modern feel. */
.calendar-grid {
	display: grid;
	grid-template-rows: auto 1fr;
	border: none;
	border-radius: var(--ccec-radius-xl);
	overflow: hidden;
	background: var(--ccec-surface-alt);
}

.calendar-grid__header {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	background: var(--ccec-primary);
	color: #fff;
}

.calendar-grid__day-name {
	padding: 1rem 0.5rem;
	text-align: center;
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.calendar-grid__body {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
}

/* ── Calendar Cells ────────────────────────────────────────────────────── */

.calendar-cell {
	position: relative;
	min-height: 110px;
	padding: 0.75rem;
	border-right: none;
	border-bottom: 1px solid rgba(0, 0, 0, 0.04);
	cursor: default;
	transition: background 0.25s ease, box-shadow 0.25s ease;
	background: var(--ccec-white);
}

.calendar-cell:nth-child(7n) {
	border-right: none;
}

.calendar-cell--other {
	background: var(--ccec-surface-alt);
	color: var(--ccec-mid-grey);
}

.calendar-cell--today {
	background: var(--ccec-primary-tint);
	box-shadow: inset 0 0 0 2px var(--ccec-primary);
}

.calendar-cell--today .calendar-cell__number {
	background: var(--ccec-primary);
	color: #fff;
	border-radius: 50%;
	width: 28px;
	height: 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.calendar-cell--past {
	opacity: 0.6;
}

.calendar-cell--has-events {
	cursor: pointer;
}

.calendar-cell--has-events:hover {
	background: var(--ccec-off-white);
}

.calendar-cell--has-events:focus {
	outline: 3px solid var(--ccec-primary);
	outline-offset: -3px;
	z-index: 1;
}

.calendar-cell--filtered-out {
	opacity: 0.3;
	pointer-events: none;
}

.calendar-cell__number {
	font-size: 1rem;
	font-weight: 700;
	line-height: 1;
	color: var(--ccec-charcoal);
}

.calendar-cell--other .calendar-cell__number {
	color: var(--ccec-mid-grey);
}

.calendar-cell__events {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin-top: 0.4rem;
}

/* Event label pills — modern pill-shaped tags. */
.calendar-cell__event-label {
	display: block;
	font-size: 0.6875rem;
	font-weight: 700;
	line-height: 1.4;
	padding: 3px 8px;
	border-radius: var(--ccec-radius-pill);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: #fff;
	text-decoration: none;
	background: var(--ccec-primary);
	border-left: none;
	letter-spacing: 0.02em;
	transition: opacity 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.calendar-cell__event-label:hover,
.calendar-cell__event-label:focus,
.calendar-cell__event-label:active,
.calendar-cell__event-label:visited {
	color: #fff;
	opacity: 0.9;
	transform: translateX(2px);
	text-decoration: none;
}

.event-card__title a:visited {
	color: inherit;
}

.calendar-detail__event h4 a,
.calendar-detail__event h4 a:hover,
.calendar-detail__event h4 a:visited {
	color: var(--ccec-primary-dark);
	text-decoration: none;
}

.calendar-detail__event h4 a:hover {
	color: var(--ccec-primary);
}

/* Category colours — WCAG AA contrast on white text */
.calendar-cell__event-label[data-category="conference"]  { background: var(--ccec-primary); }
.calendar-cell__event-label[data-category="exhibition"]  { background: var(--ccec-orange-700); }
.calendar-cell__event-label[data-category="wedding"]     { background: #be185d; }
.calendar-cell__event-label[data-category="community"]   { background: var(--ccec-secondary-dark); }
.calendar-cell__event-label[data-category="workshop"]    { background: var(--ccec-accent); color: var(--ccec-black); }
.calendar-cell__event-label[data-category="networking"]  { background: #0e7490; }

.calendar-cell__more {
	font-size: 0.8125rem;
	color: var(--ccec-primary);
	font-weight: 700;
	cursor: pointer;
	margin-top: 2px;
}

/* ── Day Detail Panel ──────────────────────────────────────────────────── */

.calendar-detail-panel {
	margin-top: 1.5rem;
}

.calendar-detail {
	background: #fff;
	border: 2px solid var(--ccec-primary);
	border-radius: var(--ccec-radius-lg);
	padding: 1.5rem;
	box-shadow: var(--ccec-shadow-lg);
	animation: fadeUp 0.3s var(--ccec-transition-spring) both;
}

.calendar-cell--selected {
	background: #D5E0F0 !important;
	box-shadow: inset 0 0 0 2px var(--ccec-primary);
}

.calendar-detail__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1rem;
}

.calendar-detail__header h3 {
	margin: 0;
	font-size: 1.125rem;
}

.calendar-detail__close {
	background: none;
	border: none;
	font-size: 1.5rem;
	cursor: pointer;
	padding: 0.25rem 0.5rem;
	line-height: 1;
	border-radius: var(--ccec-radius-sm);
	transition: background 0.2s ease;
}

.calendar-detail__close:hover {
	background: rgba(0, 0, 0, 0.05);
}

.calendar-detail__events {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

/* ── Event Cards (List View + Detail) ──────────────────────────────────── */

.events-list {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.events-list__empty {
	text-align: center;
	padding: 3rem 1rem;
	color: var(--ccec-dark-grey);
	font-size: 1.125rem;
}

.event-card {
	display: flex;
	align-items: flex-start;
	gap: 1.5rem;
	padding: 1.75rem;
	background: var(--ccec-white);
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: var(--ccec-radius-xl);
	transition: box-shadow 0.4s ease, transform 0.4s var(--ccec-ease-out-expo);
}

.event-card:hover {
	box-shadow: var(--ccec-shadow-lg);
	transform: translateY(-4px);
}

.event-card--past {
	opacity: 0.65;
}

.event-card--featured {
	border-left: 4px solid var(--ccec-primary);
}

.event-card__date-badge {
	flex-shrink: 0;
	width: 60px;
	text-align: center;
	padding: 0.75rem 0.5rem;
	background: var(--ccec-primary);
	color: #fff;
	border-radius: var(--ccec-radius-md);
}

.event-card__day {
	display: block;
	font-size: 1.5rem;
	font-weight: 800;
	line-height: 1;
}

.event-card__month {
	display: block;
	font-size: 0.75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin-top: 0.15rem;
}

.event-card__body {
	flex: 1;
	min-width: 0;
}

.event-card__title {
	margin: 0 0 0.5rem;
	font-size: 1.125rem;
	line-height: 1.3;
}

.event-card__title a {
	color: inherit;
	text-decoration: none;
}

.event-card__title a:hover {
	color: var(--ccec-primary);
}

.event-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1rem;
	font-size: 0.875rem;
	color: var(--ccec-dark-grey);
	margin-bottom: 0.5rem;
}

.event-card__category {
	display: inline-block;
	padding: 0.15rem 0.5rem;
	border-radius: 9999px;
	font-weight: 600;
	font-size: var(--ccec-font-size-xs);
	background: var(--ccec-primary-tint);
	color: var(--ccec-primary-dark);
}

.event-card__category[data-category="conference"]  { background: var(--ccec-primary-tint);    color: var(--ccec-primary-dark); }
.event-card__category[data-category="exhibition"]   { background: var(--ccec-orange-100);       color: var(--ccec-orange-800); }
.event-card__category[data-category="wedding"]      { background: #fce7f7;                      color: #831843; }
.event-card__category[data-category="community"]    { background: var(--ccec-secondary-tint);   color: var(--ccec-secondary-dark); }
.event-card__category[data-category="workshop"]     { background: #fef9ec;                      color: #92400e; }
.event-card__category[data-category="networking"]   { background: #e0f4f8;                      color: #0e5f7a; }

.event-card__excerpt {
	font-size: 0.875rem;
	color: var(--ccec-charcoal);
	margin: 0;
}

.event-card__actions {
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	align-self: center;
}

/* ── Past Events Toggle ────────────────────────────────────────────────── */

.calendar-past-toggle {
	text-align: center;
	margin-top: 1.5rem;
}

/* ── Single Event Styles ───────────────────────────────────────────────── */

.event-date-hero {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.25rem;
	background: var(--ccec-off-white);
	border-radius: var(--ccec-radius-lg);
	border-left: 4px solid var(--ccec-primary);
	margin-bottom: 2rem;
}

.event-date-hero__icon {
	flex-shrink: 0;
	color: var(--ccec-primary);
}

.event-date-hero__date {
	font-size: 1.125rem;
	font-weight: 600;
	margin: 0 0 0.25rem;
}

.event-date-hero__location {
	display: flex;
	align-items: center;
	gap: 0.35rem;
	font-size: 0.875rem;
	color: var(--ccec-dark-grey);
	margin: 0;
}

.event-featured-image {
	margin-bottom: 2rem;
	border-radius: var(--ccec-radius-lg);
	overflow: hidden;
}

.event-featured-image img {
	width: 100%;
	height: auto;
	display: block;
}

.event-organiser-info,
.event-address {
	margin-top: 2rem;
	padding: 1.25rem;
	background: var(--ccec-off-white);
	border-radius: var(--ccec-radius-md);
}

.event-organiser-info h3,
.event-address h3 {
	margin: 0 0 0.75rem;
	font-size: 1rem;
}

.event-categories {
	display: flex;
	gap: 0.5rem;
	margin-bottom: 0.75rem;
}

.event-category-badge {
	display: inline-block;
	padding: 0.25rem 0.75rem;
	border-radius: 9999px;
	font-size: 0.8125rem;
	font-weight: 600;
	background: rgba(255, 255, 255, 0.2);
	color: #fff;
	text-decoration: none;
	transition: background 0.2s ease;
}

.event-category-badge:hover {
	background: rgba(255, 255, 255, 0.3);
}

.event-past-notice {
	display: inline-block;
	padding: 0.35rem 1rem;
	background: rgba(239, 68, 68, 0.15);
	color: #fecaca;
	border-radius: var(--ccec-radius-md);
	font-size: 0.875rem;
	font-weight: 600;
	margin-top: 0.5rem;
}

.page-banner--past {
	opacity: 0.85;
}

/* Sidebar event card */
.sidebar-card--event dl {
	margin: 0;
}

.event-details-list dt {
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--ccec-dark-grey);
	margin-top: 0.75rem;
}

.event-details-list dt:first-child {
	margin-top: 0;
}

.event-details-list dd {
	margin: 0.25rem 0 0;
	font-size: 0.9375rem;
}

.sidebar-card--event .btn--block {
	display: block;
	width: 100%;
	text-align: center;
	margin-top: 1.25rem;
}

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

.sidebar-events li {
	border-bottom: 1px solid var(--ccec-light-grey);
}

.sidebar-events li:last-child {
	border-bottom: none;
}

.sidebar-events a {
	display: flex;
	gap: 0.75rem;
	align-items: baseline;
	padding: 0.75rem 0;
	text-decoration: none;
	color: inherit;
	transition: color 0.2s ease;
}

.sidebar-events a:hover {
	color: var(--ccec-primary);
}

.sidebar-events__date {
	flex-shrink: 0;
	font-size: 0.8125rem;
	font-weight: 700;
	color: var(--ccec-primary);
	min-width: 50px;
}

.sidebar-events__title {
	font-size: 0.875rem;
}

.sidebar-events__all {
	display: block;
	margin-top: 0.75rem;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--ccec-primary);
	text-decoration: none;
}

.sidebar-events__all:hover {
	text-decoration: underline;
}

/* ── Front Page Upcoming Events Section ────────────────────────────────── */

.upcoming-events {
	padding: var(--ccec-spacing-5xl) 0;
}

.upcoming-events__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--ccec-spacing-xl);
	margin-top: var(--ccec-spacing-3xl);
}

.upcoming-events__card {
	background: var(--ccec-white);
	border: none;
	border-radius: var(--ccec-radius-2xl);
	overflow: hidden;
	box-shadow: var(--ccec-shadow-editorial);
	transition: box-shadow 0.4s ease, transform 0.4s var(--ccec-ease-out-expo);
}

.upcoming-events__card:hover {
	box-shadow: var(--ccec-shadow-xl);
	transform: translateY(-8px);
}

.upcoming-events__card-image {
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.upcoming-events__card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.upcoming-events__card:hover .upcoming-events__card-image img {
	transform: scale(1.05);
}

.upcoming-events__card-body {
	padding: 1.75rem;
}

.upcoming-events__card-date {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	font-size: var(--ccec-font-size-xs);
	font-weight: 600;
	color: var(--ccec-primary);
	margin-bottom: 0.5rem;
}

.upcoming-events__card-title {
	margin: 0 0 0.5rem;
	font-size: 1.125rem;
	line-height: 1.3;
}

.upcoming-events__card-title a {
	color: inherit;
	text-decoration: none;
}

.upcoming-events__card-title a:hover {
	color: var(--ccec-primary);
	text-decoration: underline;
}

.upcoming-events__card-excerpt {
	font-size: var(--ccec-font-size-small);
	color: var(--ccec-dark-grey);
	margin: 0;
}

.upcoming-events__cta {
	text-align: center;
	margin-top: 2rem;
}

/* ── Responsive: Events Calendar ───────────────────────────────────────── */

@media (max-width: 1024px) {
	.calendar-cell {
		min-height: 70px;
		padding: 0.35rem;
	}

	.calendar-cell__dots {
		gap: 2px;
	}

	.calendar-cell__dot {
		width: 6px;
		height: 6px;
	}
}

@media (max-width: 768px) {
	.calendar-controls {
		flex-direction: column;
		align-items: stretch;
	}

	.calendar-controls__nav {
		justify-content: center;
	}

	.calendar-controls__filters {
		justify-content: center;
		flex-wrap: wrap;
	}

	/* Mobile keeps both views available: the grid renders compact (see the
	   max-width:767px block) and the toggle stays visible so users can switch
	   to the list. JS owns view switching via inline styles — do not re-add
	   :not([style]) / [hidden] hacks here; they fight the JS and blank the
	   calendar on browsers that drop empty style attributes. */
	.event-card {
		flex-direction: column;
		gap: 0.75rem;
	}

	.event-card__date-badge {
		width: auto;
		display: flex;
		gap: 0.5rem;
		align-items: center;
	}

	.event-card__day {
		font-size: 1.125rem;
	}

	.event-card__actions {
		flex-direction: row;
		align-self: stretch;
	}

	.upcoming-events__grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 480px) {
	.calendar-controls__title {
		font-size: 1.0625rem;
		min-width: 140px;
	}

	.event-card {
		padding: 1rem;
	}
}

/* ── Reduced Motion ────────────────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
	.calendar-detail {
		animation: none;
	}

	.calendar-view--loading {
		transition: none;
	}

	.event-card:hover,
	.upcoming-events__card:hover {
		transform: none;
	}
}


/* ============================================
   23. NEWS / BLOG
   ============================================ */

/* ── News Archive ──────────────────────────────────────────────────────── */

.news-archive {
	padding: var(--ccec-spacing-4xl) 0;
}

/* ── Featured Hero Post ────────────────────────────────────────────────── */

.news-hero {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	margin-bottom: 3rem;
	border-radius: var(--ccec-radius-lg);
	overflow: hidden;
	background: #fff;
	border: 1px solid var(--ccec-light-grey);
	box-shadow: var(--ccec-shadow-md);
}

.news-hero__image {
	overflow: hidden;
}

.news-hero__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.news-hero:hover .news-hero__image img {
	transform: scale(1.03);
}

.news-hero__content {
	padding: 2rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.news-hero__category {
	display: inline-block;
	padding: 0.2rem 0.6rem;
	border-radius: 9999px;
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	background: var(--ccec-primary);
	color: #fff;
	margin-bottom: 0.75rem;
	width: fit-content;
}

.news-hero__title {
	font-size: 1.75rem;
	line-height: 1.25;
	margin: 0 0 0.75rem;
}

.news-hero__title a {
	color: inherit;
	text-decoration: none;
}

.news-hero__title a:hover {
	color: var(--ccec-primary);
}

.news-hero__meta {
	display: flex;
	gap: 1rem;
	font-size: 0.8125rem;
	color: var(--ccec-dark-grey);
	margin-bottom: 1rem;
}

.news-hero__excerpt {
	font-size: 0.9375rem;
	color: var(--ccec-charcoal);
	margin: 0 0 1.5rem;
}

/* ── News Card Grid ────────────────────────────────────────────────────── */

.news-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.news-grid--home {
	margin-top: 2rem;
}

.news-card {
	background: var(--ccec-white);
	border: none;
	border-radius: var(--ccec-radius-2xl);
	overflow: hidden;
	box-shadow: var(--ccec-shadow-editorial);
	transition: box-shadow 0.4s ease, transform 0.4s var(--ccec-ease-out-expo);
}

.news-card:hover {
	box-shadow: var(--ccec-shadow-xl);
	transform: translateY(-8px);
}

.news-card__image {
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.news-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.news-card:hover .news-card__image img {
	transform: scale(1.05);
}

.news-card__body {
	padding: 1.75rem;
}

.news-card__category {
	display: inline-block;
	padding: 0.15rem 0.5rem;
	border-radius: 9999px;
	font-size: var(--ccec-font-size-xs);
	font-weight: 600;
	background: var(--ccec-primary-tint);
	color: var(--ccec-primary-dark);
	margin-bottom: 0.5rem;
}

.news-card__title {
	margin: 0 0 0.5rem;
	font-size: 1.0625rem;
	line-height: 1.3;
}

.news-card__title a {
	color: inherit;
	text-decoration: none;
}

.news-card__title a:hover {
	color: var(--ccec-primary);
	text-decoration: underline;
}

.news-card__meta {
	display: flex;
	gap: 0.75rem;
	font-size: var(--ccec-font-size-xs);
	color: var(--ccec-mid-grey);
	margin-bottom: 0.5rem;
}

.news-card__excerpt {
	font-size: var(--ccec-font-size-small);
	color: var(--ccec-dark-grey);
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ── News Pagination ───────────────────────────────────────────────────── */

.news-pagination {
	margin-top: 3rem;
	text-align: center;
}

.news-pagination .nav-links {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	flex-wrap: wrap;
}

.news-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 0.75rem;
	border: 1px solid var(--ccec-light-grey);
	border-radius: var(--ccec-radius-md);
	font-size: 0.875rem;
	text-decoration: none;
	color: inherit;
	transition: background 0.2s ease, color 0.2s ease;
}

.news-pagination .page-numbers.current,
.news-pagination .page-numbers:hover {
	background: var(--ccec-primary);
	color: #fff;
	border-color: var(--ccec-primary);
}

.news-empty {
	text-align: center;
	padding: 3rem;
	color: var(--ccec-dark-grey);
}

/* ── Latest News Front Page ────────────────────────────────────────────── */

.latest-news {
	padding: var(--ccec-spacing-5xl) 0;
	background: var(--ccec-off-white);
}

.latest-news__cta {
	text-align: center;
	margin-top: 2rem;
}

/* ── Single Article ────────────────────────────────────────────────────── */

.news-single__category {
	display: inline-block;
	padding: 0.25rem 0.75rem;
	border-radius: 9999px;
	font-size: 0.8125rem;
	font-weight: 600;
	background: rgba(255, 255, 255, 0.2);
	color: #fff;
	margin-bottom: 0.5rem;
}

.news-single__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	font-size: 0.875rem;
	color: rgba(255, 255, 255, 0.8);
	margin-top: 0.75rem;
}

.news-single__source a {
	color: inherit;
	text-decoration: underline;
}

.news-article__featured-image,
.news-article__video {
	margin-bottom: 2rem;
	border-radius: var(--ccec-radius-lg);
	overflow: hidden;
}

.news-article__featured-image img {
	width: 100%;
	height: auto;
	display: block;
}

.news-article__video iframe {
	width: 100%;
	aspect-ratio: 16 / 9;
	border: 0;
	border-radius: var(--ccec-radius-lg);
}

.news-gallery-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 1rem;
	margin-top: 1rem;
}

.news-gallery-grid__item {
	margin: 0;
	border-radius: var(--ccec-radius-md);
	overflow: hidden;
}

.news-gallery-grid__item img {
	width: 100%;
	height: auto;
	display: block;
}

.news-article__cta-box {
	margin-top: 2rem;
	padding: 1.5rem;
	background: var(--ccec-off-white);
	border-radius: var(--ccec-radius-lg);
	text-align: center;
}

.news-article__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 2rem;
}

.news-tag {
	display: inline-block;
	padding: 0.25rem 0.75rem;
	border-radius: 9999px;
	font-size: 0.8125rem;
	background: var(--ccec-off-white);
	color: var(--ccec-charcoal);
	text-decoration: none;
	transition: background 0.2s ease, color 0.2s ease;
}

.news-tag:hover {
	background: var(--ccec-primary);
	color: #fff;
}

.news-article__share {
	display: flex;
	gap: 0.75rem;
	align-items: center;
	margin-top: 2rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--ccec-light-grey);
	font-size: 0.875rem;
}

.news-article__share span {
	font-weight: 600;
}

.news-article__share a {
	color: var(--ccec-primary);
	text-decoration: none;
	font-weight: 500;
}

.news-article__share a:hover {
	text-decoration: underline;
}

/* ── News Responsive ───────────────────────────────────────────────────── */

@media (max-width: 1024px) {
	.news-hero {
		grid-template-columns: 1fr;
	}

	.news-hero__image {
		aspect-ratio: 16 / 9;
	}
}

@media (max-width: 768px) {
	.news-grid {
		grid-template-columns: 1fr;
	}

	.news-hero__content {
		padding: 1.5rem;
	}

	.news-hero__title {
		font-size: 1.375rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.news-card:hover,
	.news-hero:hover .news-hero__image img {
		transform: none;
	}
}

/* =============================================================================
   FLEXIBLE CONTENT BLOCK STYLES
   Styles for ACF Flexible Content layouts used in front-page.php and page.php
   ============================================================================= */

/* ── CTA Banner (homepage flexible layout) ─────────────────────────────────── */

.cta-banner {
	padding: var(--ccec-space-3xl) 0;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.cta-banner::before {
	content: '';
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	inset: 0;
	opacity: 0.06;
	background-image: radial-gradient(circle at 1px 1px, currentColor 1px, transparent 0);
	background-size: 24px 24px;
	pointer-events: none;
}

.cta-banner--primary {
	background: var(--ccec-gradient-brand);
	color: #fff;
}

.cta-banner--dark {
	background: linear-gradient(135deg, #1B2A4A 0%, #162240 100%);
	color: #fff;
}

.cta-banner--gold,
.cta-banner--accent {
	background: linear-gradient(135deg, var(--ccec-secondary) 0%, var(--ccec-secondary-dark) 100%);
	color: #fff;
}

.cta-banner--light {
	background: var(--ccec-surface-alt);
	color: var(--ccec-neutral-900);
}

.cta-banner__inner {
	max-width: 720px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
	position: relative;
	z-index: 3;
}

.cta-banner__heading {
	font-family: var(--ccec-font-family);
	font-size: clamp(1.875rem, 4vw, 2.75rem);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -0.025em;
	margin: 0;
}

.cta-banner--primary .cta-banner__heading,
.cta-banner--dark .cta-banner__heading {
	color: #fff;
}

.cta-banner__text {
	font-size: 1.0625rem;
	line-height: 1.6;
	opacity: 0.9;
	max-width: 560px;
	margin: 0;
}

.cta-banner__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: center;
	margin-top: 0.5rem;
}

.cta-banner--primary .btn--outline,
.cta-banner--dark .btn--outline {
	border-color: rgba(255, 255, 255, 0.6);
	color: #fff;
}

.cta-banner--primary .btn--outline:hover,
.cta-banner--dark .btn--outline:hover {
	background: rgba(255, 255, 255, 0.15);
	border-color: #fff;
}

/* Light-background CTA banners: outline buttons need dark text */
.cta-banner--light .btn--outline {
	color: var(--ccec-neutral-900) !important;
	border-color: var(--ccec-neutral-900);
}

.cta-banner--light .btn--outline:hover {
	background: rgba(0, 0, 0, 0.08);
	border-color: var(--ccec-neutral-900);
	color: var(--ccec-neutral-900) !important;
}

/* Green CTA banner: white outline buttons */
.cta-banner--gold .btn--outline,
.cta-banner--accent .btn--outline {
	border-color: rgba(255, 255, 255, 0.6);
	color: #fff;
}

.cta-banner--gold .btn--outline:hover,
.cta-banner--accent .btn--outline:hover {
	background: rgba(255, 255, 255, 0.15);
	border-color: #fff;
}

@media (max-width: 600px) {
	.cta-banner__actions {
		flex-direction: column;
		align-items: stretch;
	}
}

/* ── Text Section (homepage flexible layout) ──────────────────────────────── */

.text-section {
	padding: var(--ccec-space-2xl) 0;
}

.text-section__content {
	max-width: 72ch;
}

.text-section--cols-2 .text-section__content {
	max-width: 100%;
	columns: 2;
	column-gap: 3rem;
}

.text-section--cols-2 .text-section__content p {
	break-inside: avoid;
}

@media (max-width: 640px) {
	.text-section--cols-2 .text-section__content {
		columns: 1;
	}
}

/* ── Page Content Blocks (page.php flexible layouts) ─────────────────────── */

.page-blocks {
	display: flex;
	flex-direction: column;
	gap: var(--ccec-block-gap);
	margin-top: var(--ccec-block-gap);
}

.page-block {
	padding: var(--ccec-block-pad-v) 0;
	border-top: 1px solid var(--ccec-border-light);
}

/* Consistent vertical spacing between flexible content blocks inside articles.
   Each block type gets margin-top so they don't stack flush against each other.
   2026 best practice: generous whitespace for scannability and visual rhythm.
   Uses --ccec-block-spacing-scale so admins can globally adjust spacing. */
.page-entry .page-block,
.page-entry .page-gallery,
.page-entry .page-features,
.page-entry .page-specs,
.page-entry .page-testimonial,
.page-entry .page-cta,
.page-entry .page-related,
.page-entry .page-video,
.page-entry .page-accordion {
	margin-top: var(--ccec-block-gap);
	margin-bottom: calc(var(--ccec-block-gap) * 0.3);
}

.page-entry .split-block {
	margin-top: calc(var(--ccec-block-gap) * 1.33);
	margin-bottom: calc(var(--ccec-block-gap) * 0.5);
}

.page-entry .page-block:first-child,
.page-entry .page-gallery:first-child,
.page-entry .page-features:first-child {
	margin-top: calc(var(--ccec-block-gap) * 0.66);
}

/* First split-block after entry-content needs less top margin */
.page-entry .entry-content + .split-block,
.page-entry .split-block:first-child {
	margin-top: var(--ccec-block-gap);
}

.page-block:first-child {
	border-top: none;
	padding-top: 0;
}

.page-block__heading {
	font-family: var(--ccec-font-family);
	font-size: clamp(1.25rem, 2.5vw, 1.75rem);
	font-weight: 700;
	color: var(--ccec-neutral-900);
	margin: 0 0 1.25rem;
	text-wrap: balance;
}

.page-block__content {
	color: var(--ccec-neutral-700);
	line-height: 1.7;
}

.page-block--cols-2 .page-block__content {
	columns: 2;
	column-gap: 2.5rem;
}

.page-block--cols-3 .page-block__content {
	columns: 3;
	column-gap: 2rem;
}

/* Single-column text blocks (default — full width within container) */
.page-block--text {
	/* Standard text block styling — inherits base .page-block */
}

.page-block--cols-1 .page-block__content {
	max-width: 72ch;
}

.page-block--narrow {
	max-width: 640px;
}

.page-block--wide {
	max-width: 100%;
}

@media (max-width: 768px) {
	.page-block--cols-2 .page-block__content,
	.page-block--cols-3 .page-block__content {
		columns: 1;
	}
}

/* ── Page Gallery (page.php gallery block) ────────────────────────────────── */

.page-gallery {
	padding: var(--ccec-block-pad-v) 0;
}

.page-gallery__heading {
	font-family: var(--ccec-font-family);
	font-size: clamp(1.25rem, 2.5vw, 1.75rem);
	font-weight: 700;
	color: var(--ccec-neutral-900);
	margin: 0 0 1.5rem;
	text-wrap: balance;
}

.page-gallery__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 1rem;
}

.page-gallery--masonry .page-gallery__grid {
	columns: 3;
	column-gap: 1rem;
	display: block;
}

.page-gallery--masonry .page-gallery__item {
	break-inside: avoid;
	margin-bottom: 1rem;
}

.page-gallery__item {
	position: relative;
	overflow: hidden;
	border-radius: var(--ccec-radius-md);
	margin: 0;
	background: var(--ccec-surface-alt);
}

.page-gallery__item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s var(--ccec-ease-expo);
}

.page-gallery__item:hover img {
	transform: scale(1.04);
}

/* Lightbox link wrappers (gallery grid + carousel) — fill the tile, remove the
   inline-image gap, and signal click-to-zoom. */
.page-gallery__link,
.ccec-carousel__link {
	display: block;
	height: 100%;
	line-height: 0;
	cursor: zoom-in;
	text-decoration: none;
}

.page-gallery__caption {
	padding: 0.5rem 0.75rem;
	font-size: 0.8125rem;
	color: var(--ccec-neutral-500);
	text-align: center;
}

@media (max-width: 640px) {
	.page-gallery__grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.page-gallery--masonry .page-gallery__grid {
		columns: 2;
	}
}

/* ── Splide carousel overrides ───────────────────────────────────────────── */
.ccec-carousel {
	border-radius: var(--ccec-radius-xl);
	overflow: hidden;
}

.ccec-carousel__slide {
	position: relative;
	margin: 0;
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.ccec-carousel__slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.ccec-carousel__caption {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(transparent, rgba(26, 26, 26, 0.7));
	color: var(--ccec-white);
	padding: 1.5rem 1.25rem 1rem;
	font-size: var(--ccec-font-size-small);
	text-align: center;
}

.ccec-carousel .splide__arrow {
	background: rgba(200, 106, 46, 0.85);
	opacity: 1;
	width: 3rem;
	height: 3rem;
}

.ccec-carousel .splide__arrow svg {
	fill: var(--ccec-white);
	width: 1.2em;
	height: 1.2em;
}

.ccec-carousel .splide__arrow:hover {
	background: var(--ccec-primary);
}

.ccec-carousel .splide__pagination__page {
	background: rgba(200, 106, 46, 0.4);
}

.ccec-carousel .splide__pagination__page.is-active {
	background: var(--ccec-primary);
	transform: scale(1.25);
}

/* ── Page Features (page.php features block) ──────────────────────────────── */

.page-features {
	padding: var(--ccec-block-pad-v) 0;
}

.page-features__heading {
	font-family: var(--ccec-font-family);
	font-size: clamp(1.25rem, 2.5vw, 1.75rem);
	font-weight: 700;
	color: var(--ccec-neutral-900);
	margin: 0 0 1.5rem;
	text-wrap: balance;
}

.page-features__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.page-features--cols-2 .page-features__grid {
	grid-template-columns: repeat(2, 1fr);
}

.page-features--cols-3 .page-features__grid {
	grid-template-columns: repeat(3, 1fr);
}

.page-features--cols-4 .page-features__grid {
	grid-template-columns: repeat(4, 1fr);
}

.page-features__item {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	padding: 1.5rem;
	background: var(--ccec-surface-card);
	border: 1px solid var(--ccec-border-light);
	border-radius: var(--ccec-radius-lg);
	transition: box-shadow 0.25s var(--ccec-ease-expo), transform 0.25s var(--ccec-ease-expo), border-color 0.25s ease;
}

.page-features__item:hover {
	box-shadow: var(--ccec-shadow-md);
	transform: translateY(-3px);
	border-color: var(--ccec-primary-light);
}

.page-features__icon {
	width: 2.5rem;
	height: 2.5rem;
	background: var(--ccec-primary-light, #E8EEF5);
	border-radius: var(--ccec-radius-md);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ccec-primary);
	flex-shrink: 0;
}

.page-features__title {
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--ccec-neutral-900);
	margin: 0;
}

.page-features__desc {
	font-size: 0.875rem;
	color: var(--ccec-neutral-600);
	line-height: 1.5;
	margin: 0;
}

@media (max-width: 900px) {
	.page-features__grid,
	.page-features--cols-4 .page-features__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 540px) {
	.page-features__grid,
	.page-features--cols-2 .page-features__grid,
	.page-features--cols-4 .page-features__grid {
		grid-template-columns: 1fr;
	}
}

/* ── Page Specs Table (page.php specs block) ──────────────────────────────── */

.page-specs {
	padding: var(--ccec-block-pad-v) 0;
}

.page-specs__heading {
	font-family: var(--ccec-font-family);
	font-size: clamp(1.25rem, 2.5vw, 1.75rem);
	font-weight: 700;
	color: var(--ccec-neutral-900);
	margin: 0 0 1.25rem;
	text-wrap: balance;
}

.page-specs__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.9375rem;
}

.page-specs__table th,
.page-specs__table td {
	padding: 0.75rem 1rem;
	text-align: left;
	border-bottom: 1px solid var(--ccec-border-light);
	vertical-align: middle;
}

.page-specs__table th {
	font-weight: 600;
	color: var(--ccec-neutral-700);
	width: 40%;
	background: var(--ccec-surface-alt);
}

.page-specs__table td {
	color: var(--ccec-neutral-800);
}

.page-specs__table .page-specs__row--highlight th,
.page-specs__table .page-specs__row--highlight td {
	background: rgba(42, 82, 120, 0.08);
	font-weight: 600;
	color: var(--ccec-primary);
}

/* ── Page Testimonial (page.php testimonial block) ───────────────────────── */

.page-testimonial {
	padding: var(--ccec-block-pad-v) 0;
	margin: 0;
}

.page-testimonial--card {
	background: var(--ccec-surface-card);
	border: 1px solid var(--ccec-border-light);
	border-left: 4px solid var(--ccec-primary);
	border-radius: var(--ccec-radius-lg);
	padding: 2rem;
}

.page-testimonial--pullquote {
	text-align: center;
	padding: 2.5rem;
	position: relative;
}

.page-testimonial--pullquote::before {
	content: '\201C';
	font-family: var(--ccec-font-family);
	font-size: 6rem;
	line-height: 1;
	color: var(--ccec-primary);
	opacity: 0.15;
	position: absolute;
	top: 0.5rem;
	left: 50%;
	transform: translateX(-50%);
	pointer-events: none;
}

.page-testimonial__quote {
	margin: 0 0 1rem;
}

.page-testimonial__quote p {
	font-family: var(--ccec-font-family);
	font-style: italic;
	font-size: clamp(1.0625rem, 1.8vw, 1.25rem);
	line-height: 1.65;
	color: var(--ccec-neutral-800);
	margin: 0;
}

.page-testimonial__author {
	font-size: 0.875rem;
	color: var(--ccec-neutral-600);
}

.page-testimonial__author strong {
	display: block;
	font-weight: 600;
	color: var(--ccec-neutral-900);
	margin-bottom: 0.125rem;
}

/* ── Page CTA (page.php cta block) ───────────────────────────────────────── */

.page-cta {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	flex-wrap: wrap;
	padding: 2rem 2.5rem;
	border-radius: var(--ccec-radius-lg);
}

.page-cta--bg-none {
	background: transparent;
	padding-left: 0;
	padding-right: 0;
}

.page-cta--bg-muted {
	background: var(--ccec-surface-alt);
}

.page-cta--bg-brand {
	background: var(--ccec-gradient-brand);
	color: #fff;
}

.page-cta--bg-dark {
	background: linear-gradient(135deg, #1B2A4A 0%, #162240 100%);
	color: #fff;
}

.page-cta__heading {
	font-size: 1.0625rem;
	font-weight: 600;
	margin: 0;
	flex: 1 1 200px;
	color: inherit;
}

.page-cta--bg-brand .page-cta__heading,
.page-cta--bg-dark .page-cta__heading {
	color: #fff;
}

/* Outline buttons inside brand/dark CTA blocks — already white by default, explicitly set */
.page-cta--bg-brand .btn--outline,
.page-cta--bg-dark .btn--outline {
	border-color: rgba(255, 255, 255, 0.6);
	color: #fff !important;
}

.page-cta--bg-brand .btn--outline:hover,
.page-cta--bg-dark .btn--outline:hover {
	background: rgba(255, 255, 255, 0.15);
	border-color: #fff;
}

/* Outline buttons on light/muted/transparent CTA blocks — need dark text */
.page-cta--bg-muted .btn--outline,
.page-cta--bg-none .btn--outline {
	color: var(--ccec-neutral-900) !important;
	border-color: var(--ccec-neutral-900);
}

.page-cta--bg-muted .btn--outline:hover,
.page-cta--bg-none .btn--outline:hover {
	background: rgba(0, 0, 0, 0.06);
	border-color: var(--ccec-neutral-900);
}

/* ── Page Video (page.php video block) ───────────────────────────────────── */

.page-video {
	padding: var(--ccec-block-pad-v) 0;
}

.page-video__title {
	font-family: var(--ccec-font-family);
	font-size: clamp(1.25rem, 2.5vw, 1.75rem);
	font-weight: 700;
	color: var(--ccec-neutral-900);
	margin: 0 0 1.25rem;
	text-wrap: balance;
}

.page-video__wrapper {
	position: relative;
	width: 100%;
	border-radius: var(--ccec-radius-lg);
	overflow: hidden;
	background: var(--ccec-neutral-900);
	box-shadow: var(--ccec-shadow-lg);
}

.page-video__wrapper--16-9 {
	aspect-ratio: 16 / 9;
}

.page-video__wrapper--4-3 {
	aspect-ratio: 4 / 3;
}

.page-video__wrapper--1-1 {
	aspect-ratio: 1 / 1;
}

.page-video__wrapper iframe {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	inset: 0;
	width: 100%;
	height: 100%;
	border: none;
}

.page-video__caption {
	margin-top: 0.625rem;
	font-size: 0.8125rem;
	color: var(--ccec-neutral-500);
	text-align: center;
}

/* ── Page Accordion / FAQ (page.php accordion block) ─────────────────────── */

.page-accordion {
	padding: var(--ccec-block-pad-v) 0;
}

.page-accordion__heading {
	font-family: var(--ccec-font-family);
	font-size: clamp(1.25rem, 2.5vw, 1.75rem);
	font-weight: 700;
	color: var(--ccec-neutral-900);
	margin: 0 0 1.25rem;
	text-wrap: balance;
}

.page-accordion__item {
	border: 1px solid var(--ccec-border-light);
	border-radius: var(--ccec-radius-lg);
	margin-bottom: 0.625rem;
	overflow: hidden;
	background: var(--ccec-surface-card);
	transition: box-shadow 0.25s var(--ccec-ease-expo), border-color 0.25s ease;
}

.page-accordion__item:hover {
	border-color: var(--ccec-primary-light);
}

.page-accordion__item[open] {
	box-shadow: var(--ccec-shadow-md);
}

.page-accordion__question {
	list-style: none;
	padding: 1rem 3rem 1rem 1.25rem;
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--ccec-neutral-900);
	cursor: pointer;
	position: relative;
	user-select: none;
	transition: background 0.15s ease;
}

.page-accordion__question::-webkit-details-marker {
	display: none;
}

.page-accordion__question::after {
	content: '';
	position: absolute;
	right: 1.25rem;
	top: 50%;
	transform: translateY(-50%) rotate(0deg);
	width: 0.5rem;
	height: 0.5rem;
	border-right: 2px solid var(--ccec-primary);
	border-bottom: 2px solid var(--ccec-primary);
	transition: transform 0.2s ease;
}

.page-accordion__item[open] .page-accordion__question::after {
	transform: translateY(-50%) rotate(225deg);
}

.page-accordion__question:hover {
	background: var(--ccec-surface-alt);
	color: var(--ccec-primary);
}

.page-accordion__answer {
	padding: 0 1.25rem 1rem;
	font-size: 0.9375rem;
	line-height: 1.65;
	color: var(--ccec-neutral-700);
	border-top: 1px solid var(--ccec-border-light);
}

.page-accordion__answer > *:first-child {
	margin-top: 0.75rem;
}

.page-accordion__answer > *:last-child {
	margin-bottom: 0;
}

/* ── Page Related (page.php related block) ───────────────────────────────── */

.page-related {
	padding: var(--ccec-block-pad-v) 0;
}

.page-related__heading {
	font-family: var(--ccec-font-family);
	font-size: clamp(1.25rem, 2.5vw, 1.75rem);
	font-weight: 700;
	color: var(--ccec-neutral-900);
	margin: 0 0 1.25rem;
	text-wrap: balance;
}

.page-related__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 1rem;
}

.page-related__item {
	display: block;
	padding: 1.5rem;
	background: var(--ccec-surface-card);
	border: 1px solid var(--ccec-border-light);
	border-radius: var(--ccec-radius-lg);
	text-decoration: none;
	color: inherit;
	transition: box-shadow 0.25s var(--ccec-ease-expo), transform 0.25s var(--ccec-ease-expo), border-color 0.25s ease;
}

.page-related__item:hover {
	box-shadow: var(--ccec-shadow-md);
	transform: translateY(-3px);
	border-color: var(--ccec-primary);
}

.page-related__title {
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--ccec-neutral-900);
	margin: 0 0 0.375rem;
	transition: color 0.15s ease;
}

.page-related__item:hover .page-related__title {
	color: var(--ccec-primary);
}

.page-related__excerpt {
	font-size: 0.8125rem;
	color: var(--ccec-neutral-500);
	line-height: 1.5;
	margin: 0;
}

/* ── WordPress Page Links (multi-page posts) ─────────────────────────────── */
.page-links {
	display: flex;
	gap: 0.5rem;
	align-items: center;
	padding: 1.5rem 0;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--ccec-neutral-600);
}

.page-links a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2rem;
	height: 2rem;
	padding: 0 0.5rem;
	background: var(--ccec-surface-card);
	border: 1px solid var(--ccec-border-light);
	border-radius: var(--ccec-radius-md);
	color: var(--ccec-primary);
	text-decoration: none;
	transition: background 0.15s ease, border-color 0.15s ease;
}

.page-links a:hover {
	background: var(--ccec-primary);
	color: #fff;
	border-color: var(--ccec-primary);
}

/* ── Contact Form Feedback Messages ──────────────────────────────────────── */
.form-messages {
	margin-top: 1rem;
}

.form-message-success {
	background: rgba(200, 106, 46, 0.12);
	border: 1px solid rgba(200, 106, 46, 0.3);
	border-radius: var(--ccec-radius-md);
	padding: 1rem 1.25rem;
	color: var(--ccec-secondary-dark);
	font-size: 0.9375rem;
	line-height: 1.5;
}

.form-message-error {
	background: rgba(200, 106, 46, 0.08);
	border: 1px solid rgba(200, 106, 46, 0.25);
	border-radius: var(--ccec-radius-md);
	padding: 1rem 1.25rem;
	color: #8b3a1a;
	font-size: 0.9375rem;
	line-height: 1.5;
}

/* ── Reading Time (news articles) ────────────────────────────────────────── */
.news-single__reading-time,
.news-hero__reading-time {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	font-size: 0.8125rem;
	color: var(--ccec-neutral-500);
	font-weight: 500;
}

/* ── News Article Gallery ────────────────────────────────────────────────── */
.news-article__gallery {
	margin-top: var(--ccec-spacing-2xl);
}

.news-article__gallery .page-gallery__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 0.75rem;
}

/* ── Sidebar Card — Features Variant ─────────────────────────────────────── */
.sidebar-card--features {
	border-left: 3px solid var(--ccec-secondary);
}

.sidebar-card--features ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.625rem;
}

.sidebar-card--features li {
	position: relative;
	padding-left: 1.5rem;
	font-size: 0.875rem;
	color: var(--ccec-neutral-700);
	line-height: 1.5;
}

.sidebar-card--features li::before {
	content: "\2713";
	position: absolute;
	left: 0;
	color: var(--ccec-secondary);
	font-weight: 700;
}

/* ── Flexible Content reduced-motion overrides ───────────────────────────── */

@media (prefers-reduced-motion: reduce) {
	.cta-banner::before,
	.page-gallery__item img,
	.page-features__item,
	.page-accordion__item,
	.page-related__item {
		transition: none;
	}

	.page-gallery__item:hover img,
	.page-features__item:hover,
	.page-related__item:hover {
		transform: none;
	}
}

/* =============================================================================
   SPLIT BLOCK — Image + Text (flexible content layout)
   ============================================================================= */

/* ── Base layout ─────────────────────────────────────────────────────────── */

.split-block {
	padding: var(--ccec-space-3xl) 0;
}

.split-block__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(2rem, 5vw, 5rem);
	align-items: center;
}

/* ── Image position ──────────────────────────────────────────────────────── */

.split-block--img-left  .split-block__image-col  { order: 1; }
.split-block--img-left  .split-block__content-col { order: 2; }
.split-block--img-right .split-block__image-col  { order: 2; }
.split-block--img-right .split-block__content-col { order: 1; }

/* ── Split ratios ────────────────────────────────────────────────────────── */

.split-block--ratio-50-50 .split-block__grid { grid-template-columns: 1fr 1fr; }
.split-block--ratio-40-60 .split-block__grid { grid-template-columns: 2fr 3fr; }
.split-block--ratio-60-40 .split-block__grid { grid-template-columns: 3fr 2fr; }
.split-block--ratio-35-65 .split-block__grid { grid-template-columns: 7fr 13fr; }
.split-block--ratio-65-35 .split-block__grid { grid-template-columns: 13fr 7fr; }

/* ── Image column ────────────────────────────────────────────────────────── */

.split-block__image-wrap {
	position: relative;
	border-radius: var(--ccec-radius-xl);
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: var(--ccec-surface-alt);
}

.split-block__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.5s var(--ccec-ease-expo);
}

.split-block:hover .split-block__img {
	transform: scale(1.03);
}

/* ── Content column ──────────────────────────────────────────────────────── */

.split-block__content-col {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.split-block__heading {
	font-family: var(--ccec-font-family);
	font-size: clamp(1.5rem, 3vw, 2.25rem);
	font-weight: 700;
	line-height: 1.2;
	margin: 0;
}

.split-block__body {
	font-size: 1rem;
	line-height: 1.75;
}

.split-block__body > *:first-child { margin-top: 0; }
.split-block__body > *:last-child  { margin-bottom: 0; }

.split-block__cta {
	margin-top: 0.5rem;
}

/* ── Colour schemes ──────────────────────────────────────────────────────── */

/* White (default) */
.split-block--scheme-white {
	background: #ffffff;
}
.split-block--scheme-white .split-block__heading {
	color: var(--ccec-neutral-900);
}
.split-block--scheme-white .split-block__body {
	color: var(--ccec-neutral-700);
}

/* Light grey */
.split-block--scheme-light {
	background: var(--ccec-surface-alt);
}
.split-block--scheme-light .split-block__heading {
	color: var(--ccec-neutral-900);
}
.split-block--scheme-light .split-block__body {
	color: var(--ccec-neutral-700);
}
.split-block--scheme-light .split-block__image-wrap {
	box-shadow: var(--ccec-shadow-lg);
}

/* Dark navy */
.split-block--scheme-dark {
	background: linear-gradient(135deg, #1B2A4A 0%, #162240 100%);
}
.split-block--scheme-dark .split-block__heading {
	color: #ffffff;
}
.split-block--scheme-dark .split-block__body {
	color: rgba(255, 255, 255, 0.82);
}
.split-block--scheme-dark .section-label {
	background: rgba(255, 255, 255, 0.1);
	color: rgba(255, 255, 255, 0.75);
	border-color: rgba(255, 255, 255, 0.15);
}
.split-block--scheme-dark .split-block__image-wrap {
	box-shadow: 0 8px 40px rgba(0, 0, 0, 0.5);
}

/* Brand orange */
.split-block--scheme-brand {
	background: var(--ccec-gradient-brand);
}
.split-block--scheme-brand .split-block__heading {
	color: #ffffff;
}
.split-block--scheme-brand .split-block__body {
	color: rgba(255, 255, 255, 0.88);
}
.split-block--scheme-brand .section-label {
	background: rgba(255, 255, 255, 0.15);
	color: rgba(255, 255, 255, 0.9);
	border-color: rgba(255, 255, 255, 0.25);
}
.split-block--scheme-brand .split-block__image-wrap {
	box-shadow: 0 8px 40px rgba(0, 0, 0, 0.3);
}

/* Brand green (accent — legacy "gold" key kept for ACF backward compat) */
.split-block--scheme-gold,
.split-block--scheme-accent {
	background: linear-gradient(135deg, var(--ccec-secondary) 0%, var(--ccec-secondary-dark) 100%);
}
.split-block--scheme-gold .split-block__heading,
.split-block--scheme-accent .split-block__heading {
	color: #ffffff;
}
.split-block--scheme-gold .split-block__body,
.split-block--scheme-accent .split-block__body {
	color: rgba(255, 255, 255, 0.88);
}
.split-block--scheme-gold .section-label,
.split-block--scheme-accent .section-label {
	background: rgba(255, 255, 255, 0.12);
	color: rgba(255, 255, 255, 0.9);
	border-color: rgba(255, 255, 255, 0.2);
}

/* Deep teal */
.split-block--scheme-teal {
	background: linear-gradient(135deg, #1A4D5C 0%, #133E4D 100%);
}
.split-block--scheme-teal .split-block__heading {
	color: #ffffff;
}
.split-block--scheme-teal .split-block__body {
	color: rgba(255, 255, 255, 0.85);
}
.split-block--scheme-teal .section-label {
	background: rgba(255, 255, 255, 0.1);
	color: rgba(255, 255, 255, 0.75);
	border-color: rgba(255, 255, 255, 0.15);
}
.split-block--scheme-teal .split-block__image-wrap {
	box-shadow: 0 8px 40px rgba(0, 0, 0, 0.4);
}

/* ── Image-only fallback (no image uploaded) ─────────────────────────────── */

.split-block__image-col:empty,
.split-block__image-wrap:empty {
	display: none;
}

/* Fallback: sibling combinator for browsers without :has() (Firefox <121, Safari <15.4) */
.split-block__image-col:empty ~ .split-block__content-col,
/* Progressive enhancement: :has() for modern browsers */
.split-block__grid:has(.split-block__image-wrap:empty) .split-block__content-col {
	grid-column: 1 / -1;
	max-width: 720px;
	margin: 0 auto;
}

/* ── Responsive ──────────────────────────────────────────────────────────── */

@media (max-width: 900px) {
	.split-block {
		padding-left: var(--ccec-spacing-lg);
		padding-right: var(--ccec-spacing-lg);
	}

	.split-block--ratio-50-50 .split-block__grid,
	.split-block--ratio-40-60 .split-block__grid,
	.split-block--ratio-60-40 .split-block__grid,
	.split-block--ratio-35-65 .split-block__grid,
	.split-block--ratio-65-35 .split-block__grid {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	/* On mobile always show image above text */
	.split-block__image-col  { order: 1 !important; }
	.split-block__content-col { order: 2 !important; }

	.split-block__image-wrap {
		aspect-ratio: 16 / 9;
	}
}

/* ── Inside page-entry: contain split-blocks within page layout ────────── */

.page-entry .split-block {
	max-width: 100%;
	width: auto;
	position: relative;
	left: auto;
	transform: none;
	margin-left: 0;
	margin-right: 0;
	border-radius: var(--ccec-radius-xl);
	overflow: hidden;
}

.page-entry .split-block__heading {
	color: var(--ccec-neutral-900);
	margin-bottom: 0;
}

.page-entry .split-block--scheme-dark .split-block__heading,
.page-entry .split-block--scheme-brand .split-block__heading,
.page-entry .split-block--scheme-teal .split-block__heading {
	color: #ffffff;
}

.page-entry .split-block__body {
	color: var(--ccec-neutral-700);
}

.page-entry .split-block--scheme-dark .split-block__body {
	color: rgba(255, 255, 255, 0.82);
}

.page-entry .split-block--scheme-brand .split-block__body {
	color: rgba(255, 255, 255, 0.88);
}

.page-entry .split-block--scheme-teal .split-block__body {
	color: rgba(255, 255, 255, 0.85);
}

/* Reset .page-entry list styles inside split-block body */
.page-entry .split-block__body ul {
	list-style: disc;
	padding: 0 0 0 1.25em;
	margin: 0 0 1em;
	border: none;
	border-radius: 0;
	overflow: visible;
}

.page-entry .split-block__body ul li {
	display: list-item;
	padding: 0.25em 0;
	border-bottom: none;
	background-color: transparent;
	transition: none;
	font-size: inherit;
}

.page-entry .split-block__body ul li:hover {
	background-color: transparent;
	padding-left: 0;
}

.page-entry .split-block__body ul li::before {
	content: none;
}

.page-entry .split-block__body p {
	color: inherit;
}

/* Override .page-entry element-level styles inside split-blocks */
.page-entry .split-block h2,
.page-entry .split-block h3 {
	color: var(--ccec-neutral-900);
	margin-top: 0;
}

.page-entry .split-block--scheme-dark h2,
.page-entry .split-block--scheme-dark h3,
.page-entry .split-block--scheme-brand h2,
.page-entry .split-block--scheme-brand h3,
.page-entry .split-block--scheme-teal h2,
.page-entry .split-block--scheme-teal h3,
.page-entry .split-block--scheme-gold h2,
.page-entry .split-block--scheme-gold h3,
.page-entry .split-block--scheme-accent h2,
.page-entry .split-block--scheme-accent h3 {
	margin-top: 0;
}

.page-entry .split-block--scheme-dark h2,
.page-entry .split-block--scheme-dark h3,
.page-entry .split-block--scheme-brand h2,
.page-entry .split-block--scheme-brand h3,
.page-entry .split-block--scheme-teal h2,
.page-entry .split-block--scheme-teal h3 {
	color: #ffffff;
}

.page-entry .split-block--scheme-gold h2,
.page-entry .split-block--scheme-gold h3,
.page-entry .split-block--scheme-accent h2,
.page-entry .split-block--scheme-accent h3 {
	color: #ffffff;
}

/* Override .page-entry p colour inside split-blocks */
.page-entry .split-block p {
	color: inherit;
}

.page-entry .split-block--scheme-dark p {
	color: rgba(255, 255, 255, 0.82);
}

.page-entry .split-block--scheme-brand p {
	color: rgba(255, 255, 255, 0.88);
}

.page-entry .split-block--scheme-teal p {
	color: rgba(255, 255, 255, 0.85);
}

.page-entry .split-block--scheme-gold p,
.page-entry .split-block--scheme-accent p {
	color: rgba(255, 255, 255, 0.88);
}

/* Override .page-entry ul styles inside split-blocks */
.page-entry .split-block--scheme-dark .split-block__body ul li,
.page-entry .split-block--scheme-brand .split-block__body ul li,
.page-entry .split-block--scheme-teal .split-block__body ul li {
	color: rgba(255, 255, 255, 0.85);
}

/* CTA button overrides for dark schemes */
.page-entry .split-block--scheme-dark .btn--primary,
.page-entry .split-block--scheme-brand .btn--outline,
.page-entry .split-block--scheme-teal .btn--outline {
	border-color: rgba(255, 255, 255, 0.5);
	color: #fff;
}

.page-entry .split-block--scheme-dark .btn--outline,
.page-entry .split-block--scheme-brand .btn--outline,
.page-entry .split-block--scheme-teal .btn--outline {
	border-color: rgba(255, 255, 255, 0.5);
	color: #fff;
}

.page-entry .split-block--scheme-dark .btn--outline:hover,
.page-entry .split-block--scheme-brand .btn--outline:hover,
.page-entry .split-block--scheme-teal .btn--outline:hover {
	background: rgba(255, 255, 255, 0.15);
	border-color: #fff;
}

/* Outline buttons on light split-block schemes — need dark text */
.split-block--scheme-white .btn--outline,
.split-block--scheme-light .btn--outline,
.page-entry .split-block--scheme-white .btn--outline,
.page-entry .split-block--scheme-light .btn--outline {
	color: var(--ccec-neutral-900) !important;
	border-color: var(--ccec-neutral-900);
}

.split-block--scheme-white .btn--outline:hover,
.split-block--scheme-light .btn--outline:hover,
.page-entry .split-block--scheme-white .btn--outline:hover,
.page-entry .split-block--scheme-light .btn--outline:hover {
	background: rgba(0, 0, 0, 0.06);
	border-color: var(--ccec-neutral-900);
}

/* Green split-block: white outline button */
.split-block--scheme-gold .btn--outline,
.split-block--scheme-accent .btn--outline,
.page-entry .split-block--scheme-gold .btn--outline,
.page-entry .split-block--scheme-accent .btn--outline {
	color: #fff !important;
	border-color: rgba(255, 255, 255, 0.6);
}

.split-block--scheme-gold .btn--outline:hover,
.split-block--scheme-accent .btn--outline:hover,
.page-entry .split-block--scheme-gold .btn--outline:hover,
.page-entry .split-block--scheme-accent .btn--outline:hover {
	background: rgba(255, 255, 255, 0.15);
	border-color: #fff;
}

@media (max-width: 900px) {
	.page-entry .split-block {
		margin-left: 0;
		margin-right: 0;
		border-radius: var(--ccec-radius-lg);
	}
}

/* ── Reduced motion ──────────────────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
	.split-block__img,
	.split-block:hover .split-block__img {
		transition: none;
		transform: none;
	}
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 24: COOKIE CONSENT BANNER
   ═══════════════════════════════════════════════════════════════════════════ */

.ccec-cookie-banner {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 9999;
	background: rgba(26, 26, 26, 0.97);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	color: #fff;
	padding: 1.25rem 0;
	box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.3);
	animation: cookieSlideUp 0.4s ease-out;
}

@keyframes cookieSlideUp {
	from { transform: translateY(100%); opacity: 0; }
	to   { transform: translateY(0); opacity: 1; }
}

.ccec-cookie-banner__inner {
	max-width: var(--ccec-container, 1200px);
	margin: 0 auto;
	padding: 0 var(--ccec-gutter, 1.5rem);
	display: flex;
	align-items: center;
	gap: 2rem;
	flex-wrap: wrap;
}

.ccec-cookie-banner__text {
	flex: 1 1 400px;
	font-size: 0.875rem;
	line-height: 1.5;
}

.ccec-cookie-banner__text p {
	margin: 0 0 0.25rem;
}

.ccec-cookie-banner__text a {
	color: var(--ccec-secondary-light, #A1BE78);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.ccec-cookie-banner__actions {
	display: flex;
	gap: 0.75rem;
	flex-shrink: 0;
}

.ccec-cookie-btn {
	padding: 0.625rem 1.25rem;
	border-radius: var(--ccec-radius-md, 8px);
	font-size: 0.875rem;
	font-weight: 600;
	cursor: pointer;
	border: 2px solid transparent;
	transition: background 0.3s ease, border-color 0.2s, transform 0.2s ease;
	white-space: nowrap;
}

.ccec-cookie-btn[data-cookie-action="accept"] {
	background: var(--ccec-primary);
	color: var(--ccec-white);
	border: none;
	border-radius: var(--ccec-radius-md);
}

.ccec-cookie-btn[data-cookie-action="accept"]:hover {
	background: var(--ccec-secondary-light);
	transform: translateY(-1px);
}

.ccec-cookie-btn[data-cookie-action="essential"] {
	background: transparent;
	color: #fff;
	border-color: rgba(255, 255, 255, 0.4);
}

.ccec-cookie-btn[data-cookie-action="essential"]:hover {
	border-color: #fff;
}

@media (max-width: 600px) {
	.ccec-cookie-banner__inner {
		flex-direction: column;
		text-align: center;
	}
	.ccec-cookie-banner__actions {
		width: 100%;
		justify-content: center;
	}
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 25: NEWSLETTER SIGNUP
   ═══════════════════════════════════════════════════════════════════════════ */

.footer-newsletter {
	background: var(--ccec-primary);
	color: var(--ccec-white);
	padding: var(--ccec-spacing-xl, 2rem) 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.footer-newsletter__inner {
	display: flex;
	align-items: center;
	gap: 2.5rem;
	flex-wrap: wrap;
}

.footer-newsletter__text {
	flex: 1 1 300px;
}

.footer-newsletter__heading {
	font-family: var(--ccec-font-family);
	font-size: 1.5rem;
	margin: 0 0 0.375rem;
	color: var(--ccec-white);
}

.footer-newsletter__text p {
	margin: 0;
	font-size: 0.875rem;
	color: rgba(255, 255, 255, 0.8);
	line-height: 1.6;
}

.footer-newsletter__inner p {
	color: rgba(255, 255, 255, 0.8);
}

.footer-newsletter__form {
	flex: 1 1 360px;
}

.footer-newsletter__field {
	display: flex;
	gap: 0;
	border-radius: var(--ccec-radius-lg, 12px);
	overflow: hidden;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
	border: 1px solid rgba(255, 255, 255, 0.15);
}

.footer-newsletter__field input[type="email"],
.footer-newsletter input[type="email"] {
	flex: 1;
	padding: 0.875rem 1.25rem;
	border: none;
	font-size: 1rem;
	background: rgba(255, 255, 255, 0.1);
	color: var(--ccec-white);
	outline: none;
	min-width: 0;
	align-self: stretch;
}

.footer-newsletter__field input[type="email"]:focus,
.footer-newsletter input[type="email"]:focus {
	background: rgba(255, 255, 255, 0.15);
	box-shadow: inset 0 0 0 2px rgba(161, 190, 120, 0.4);
}

.footer-newsletter__field input[type="email"]::placeholder,
.footer-newsletter input[type="email"]::placeholder {
	color: rgba(255, 255, 255, 0.7) !important;
}

.footer-newsletter label {
	color: var(--ccec-white);
}

.footer-newsletter__btn {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.875rem 1.75rem;
	border: none;
	background: var(--ccec-primary);
	color: var(--ccec-white);
	font-weight: 700;
	font-size: 0.9375rem;
	cursor: pointer;
	transition: background 0.2s, transform 0.15s;
	white-space: nowrap;
	letter-spacing: 0.02em;
	border-radius: 0;
	align-self: stretch;
}

.footer-newsletter__btn:hover {
	background: var(--ccec-primary-light);
	transform: translateX(2px);
}

.footer-newsletter__btn:active {
	transform: translateX(0);
}

.footer-newsletter__btn svg {
	transition: transform 0.2s;
}

.footer-newsletter__btn:hover svg {
	transform: translateX(3px);
}

.footer-newsletter__status {
	margin: 0.5rem 0 0;
	font-size: 0.875rem;
	min-height: 1.25rem;
}

.footer-newsletter__status--success {
	color: #a8e6cf;
}

.footer-newsletter__status--error {
	color: #ffb3b3;
}

/* GDPR consent checkbox */
.footer-newsletter__consent {
	margin-top: 0.75rem;
}

.footer-newsletter__consent-label {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-size: 0.8125rem;
	color: rgba(255, 255, 255, 0.85);
	line-height: 1.5;
	cursor: pointer;
}

.footer-newsletter__consent-label input[type="checkbox"] {
	flex-shrink: 0;
	width: 1.125rem;
	height: 1.125rem;
	margin-top: 0.125rem;
	accent-color: var(--ccec-white);
	cursor: pointer;
}

.footer-newsletter__consent-label a {
	color: var(--ccec-white);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.footer-newsletter__consent-label a:hover {
	color: rgba(255, 255, 255, 0.7);
}

/* Honeypot field */
.ccec-hp {
	position: absolute !important;
	left: -9999px !important;
	opacity: 0 !important;
	height: 0 !important;
	width: 0 !important;
	overflow: hidden !important;
}

@media (max-width: 768px) {
	.footer-newsletter {
		padding: var(--ccec-spacing-lg, 1.5rem) 0;
	}
	.footer-newsletter__inner {
		flex-direction: column;
		text-align: center;
	}
	.footer-newsletter__field {
		flex-direction: column;
		border-radius: var(--ccec-radius-md, 8px);
	}
	.footer-newsletter__btn {
		justify-content: center;
		border-radius: 0 0 var(--ccec-radius-md, 8px) var(--ccec-radius-md, 8px);
	}
}


/* ═══════════════════════════════════════════════════════════════
   SECTION 25B: SCROLL PROGRESS BAR
   ═══════════════════════════════════════════════════════════════ */
.ccec-scroll-progress {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 3px;
	z-index: 10001;
	background: transparent;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.3s ease;
}

body.page .ccec-scroll-progress,
body.single .ccec-scroll-progress,
body.archive .ccec-scroll-progress {
	opacity: 1;
}

body.home .ccec-scroll-progress {
	opacity: 0;
}

.ccec-scroll-progress__bar {
	height: 100%;
	width: 100%;
	background: linear-gradient(90deg, var(--ccec-primary-500), var(--ccec-primary-300));
	transform: scaleX(0);
	transform-origin: left;
	will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
	.ccec-scroll-progress__bar {
		transition: none;
	}
}


/* SECTION 26: BACK TO TOP BUTTON — removed.
   The button lived at bottom-left and overlapped the always-visible
   phone-cluster FAB (.ccec-contact-fab). PHP renderer in inc/integrations.php
   has been removed; the JS handler in theme.js no-ops when the element is
   absent. Other references to .ccec-back-to-top below are inert. */


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 27: SOCIAL SHARE LINKS
   ═══════════════════════════════════════════════════════════════════════════ */

.ccec-share {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 1.25rem 0;
	margin-top: 1.5rem;
	border-top: 1px solid var(--ccec-border-light, #e5e5e5);
}

.ccec-share__label {
	font-weight: 600;
	font-size: 0.875rem;
	color: var(--ccec-neutral-600, #666);
}

.ccec-share__link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--ccec-surface-alt, #f5f5f0);
	color: var(--ccec-neutral-700, #555);
	transition: background 0.2s, color 0.2s, transform 0.2s;
}

.ccec-share__link:hover {
	transform: scale(1.1);
}

.ccec-share__link--facebook:hover {
	background: #1877F2;
	color: #fff;
}

.ccec-share__link--twitter:hover {
	background: #1a1a1a;
	color: #fff;
}

.ccec-share__link--linkedin:hover {
	background: #0A66C2;
	color: #fff;
}

.ccec-share__link--email:hover {
	background: var(--ccec-primary, #C86A2E);
	color: #fff;
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 28: HEADER SEARCH OVERLAY
   ═══════════════════════════════════════════════════════════════════════════ */

.header-right .apply-btn {
	padding: 0.5rem 1.2rem;
	font-size: 0.8125rem;
	border-radius: var(--ccec-radius-md, 8px);
	background: var(--ccec-primary);
	color: var(--ccec-white);
	border: none;
}

.header-right .apply-btn:hover {
	background: var(--ccec-primary-dark);
}

.header-search-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: none;
	background: transparent;
	color: var(--ccec-white);
	cursor: pointer;
	transition: background 0.2s, color 0.2s, box-shadow 0.2s;
	flex-shrink: 0;
	padding: 0;
	-webkit-appearance: none;
	appearance: none;
}

.header-search-btn svg {
	display: block;
	width: 18px;
	height: 18px;
	stroke: currentColor;
	pointer-events: none;
}

.header-search-btn:hover {
	background: var(--ccec-primary-tint, #FDF2EC);
	color: var(--ccec-primary, #C86A2E);
}

.header-search-btn:focus-visible {
	outline: 2px solid var(--ccec-primary, #C86A2E);
	outline-offset: 2px;
}

.is-scrolled .header-search-btn,
.site-header.is-scrolled .header-search-btn {
	color: var(--ccec-charcoal, #333);
}

.ccec-search-overlay {
	position: fixed;
	top: 0; right: 0; bottom: 0; left: 0;
	inset: 0;
	z-index: 9998;
	background: rgba(10, 10, 10, 0.92);
	backdrop-filter: blur(24px) saturate(1.2);
	-webkit-backdrop-filter: blur(24px) saturate(1.2);
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding: 15vh 2rem 2rem;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s;
}

.ccec-search-overlay.is-open {
	opacity: 1;
	visibility: visible;
}

.ccec-search-overlay__inner {
	width: 100%;
	max-width: 640px;
	position: relative;
	transform: translateY(20px);
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.ccec-search-overlay.is-open .ccec-search-overlay__inner {
	transform: translateY(0);
}

.ccec-search-overlay__close {
	position: absolute;
	top: -4rem;
	right: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	color: rgba(255, 255, 255, 0.7);
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: 50%;
	cursor: pointer;
	transition: color 0.2s, background 0.2s, border-color 0.2s, transform 0.2s;
	padding: 0;
	margin: 0;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	line-height: 1;
	font-size: 0;
	box-shadow: none;
	outline: none;
}

.ccec-search-overlay__close svg {
	display: block;
	width: 22px;
	height: 22px;
	stroke: currentColor;
	pointer-events: none;
	flex-shrink: 0;
}

.ccec-search-overlay__close:hover {
	color: #fff;
	background: rgba(255, 255, 255, 0.15);
	border-color: rgba(255, 255, 255, 0.3);
	transform: rotate(90deg);
}

.ccec-search-overlay__close:focus-visible {
	outline: 2px solid var(--ccec-primary, #C86A2E);
	outline-offset: 2px;
}

.ccec-search-overlay__label {
	display: block;
	color: rgba(255, 255, 255, 0.5);
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin-bottom: 1.25rem;
}

.ccec-search-overlay__form {
	display: flex;
	align-items: stretch;
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: var(--ccec-radius-lg, 12px);
	overflow: hidden;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.ccec-search-overlay__form:focus-within {
	border-color: var(--ccec-primary, #C86A2E);
	box-shadow: 0 0 0 3px rgba(200, 106, 46, 0.15);
}

.ccec-search-overlay__input {
	flex: 1;
	padding: 1.125rem 1.5rem;
	background: transparent;
	border: none;
	color: #fff;
	font-size: 1.25rem;
	font-family: var(--ccec-font-family);
	outline: none;
	min-width: 0;
	align-self: stretch;
}

.ccec-search-overlay__input::placeholder {
	color: rgba(255, 255, 255, 0.3) !important;
}

.ccec-search-overlay__submit {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 1.125rem 1.75rem;
	background: var(--ccec-primary, #C86A2E);
	border: none;
	border-radius: 0;
	color: #fff;
	cursor: pointer;
	font-size: 0.9375rem;
	font-weight: 600;
	transition: background 0.2s;
	white-space: nowrap;
	align-self: stretch;
}

.ccec-search-overlay__submit:hover {
	background: var(--ccec-primary-dark, #8A4219);
}

.ccec-search-overlay__submit svg {
	flex-shrink: 0;
}

@media (max-width: 600px) {
	.ccec-search-overlay {
		padding: 8vh 1.25rem 1.25rem;
	}
	.ccec-search-overlay__input {
		font-size: 1rem;
		padding: 1rem 1rem;
	}
	.ccec-search-overlay__submit {
		padding: 1rem 1.25rem;
	}
	.ccec-search-overlay__submit span {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ccec-search-overlay,
	.ccec-search-overlay__inner {
		transition: none;
	}
}

/* ─── Search Results (Live) ───────────────────────────────────── */
.ccec-search-overlay__results {
	max-height: 60vh;
	overflow-y: auto;
	margin-top: 1.5rem;
	scrollbar-width: thin;
	scrollbar-color: var(--ccec-primary-400) transparent;
}

.ccec-search-overlay__hint {
	text-align: center;
	color: rgba(255, 255, 255, 0.5);
	font-size: 0.85rem;
	margin-top: 1rem;
}

.ccec-search-overlay__loading,
.ccec-search-overlay__no-results {
	text-align: center;
	color: rgba(255, 255, 255, 0.7);
	padding: 2rem 0;
	font-size: 1rem;
}

.ccec-search-overlay__group {
	margin-bottom: 1.5rem;
}

.ccec-search-overlay__group-label {
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--ccec-primary-300);
	padding-bottom: 0.5rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	margin-bottom: 0.5rem;
}

.ccec-search-overlay__group-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ccec-search-overlay__result {
	display: block;
	padding: 0.75rem 1rem;
	border-radius: 8px;
	color: #fff;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.ccec-search-overlay__result:hover,
.ccec-search-overlay__result:focus-visible {
	background: rgba(255, 255, 255, 0.08);
}

.ccec-search-overlay__result-title {
	display: block;
	font-weight: 600;
	font-size: 1rem;
	margin-bottom: 0.2rem;
}

.ccec-search-overlay__result-excerpt {
	display: block;
	font-size: 0.85rem;
	color: rgba(255, 255, 255, 0.6);
	line-height: 1.4;
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 29: READING PROGRESS BAR
   ═══════════════════════════════════════════════════════════════════════════ */

.ccec-reading-progress {
	position: fixed;
	top: 0;
	left: 0;
	width: 0%;
	height: 3px;
	background: linear-gradient(90deg, var(--ccec-primary, #C86A2E) 0%, var(--ccec-secondary, #89966C) 100%);
	z-index: 10001;
	transition: width 0.1s linear;
	transform-origin: left;
}

/* Only show on single posts/events */
.single .ccec-reading-progress,
.single-ccec_event .ccec-reading-progress {
	display: block;
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 30: 404 PAGE
   ═══════════════════════════════════════════════════════════════════════════ */

/* 404 Hero */
.ccec-404__hero {
	/* Warm-near-black gradient matching the rest of the refreshed site —
	   the previous purple gradient was a legacy of the old branding and
	   referenced CSS vars that no longer exist, so the hard-coded purple
	   fallbacks were what shipped to users. */
	background: linear-gradient(160deg, var(--ccec-deep-dark-warm, #111009) 0%, var(--ccec-black, #1A1A1A) 100%);
	color: #fff;
	text-align: center;
	padding: clamp(4rem, 10vw, 7rem) 0 clamp(3rem, 8vw, 5rem);
	position: relative;
	overflow: hidden;
}

.ccec-404__hero::before {
	content: '';
	position: absolute;
	top: -30%;
	left: 50%;
	transform: translateX(-50%);
	width: 600px;
	height: 600px;
	background: radial-gradient(circle, rgba(var(--ccec-primary-rgb), 0.14) 0%, transparent 65%);
	border-radius: 50%;
	pointer-events: none;
}

.ccec-404__code {
	font-size: clamp(5rem, 18vw, 11rem);
	font-family: var(--ccec-font-family);
	font-weight: 200;
	line-height: 1;
	color: rgba(255, 255, 255, 0.1);
	margin-bottom: -0.25rem;
	letter-spacing: -0.05em;
	position: relative;
	z-index: 1;
}

.ccec-404__title {
	font-family: var(--ccec-font-family);
	font-size: clamp(1.75rem, 4vw, 2.75rem);
	font-weight: 700;
	margin: 0 0 1rem;
	color: #fff;
	line-height: 1.2;
	position: relative;
	z-index: 1;
}

.ccec-404__message {
	color: rgba(255, 255, 255, 0.75);
	font-size: 1.0625rem;
	line-height: 1.7;
	max-width: 520px;
	margin: 0 auto 2rem;
	position: relative;
	z-index: 1;
}

/* 404 Search */
.ccec-404__search {
	max-width: 500px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}

.ccec-404__search-form {
	display: flex;
	border: 2px solid rgba(255, 255, 255, 0.2);
	border-radius: 999px;
	overflow: hidden;
	transition: border-color 0.2s, box-shadow 0.2s;
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}

.ccec-404__search-form:focus-within {
	border-color: var(--ccec-primary-light, #D47844);
	box-shadow: 0 0 0 3px rgba(var(--ccec-primary-rgb), 0.25);
}

.ccec-404__search-form input[type="search"] {
	flex: 1;
	padding: 0.875rem 1.5rem;
	border: none;
	font-size: 1rem;
	outline: none;
	background: transparent;
	color: #fff;
	min-width: 0;
}

.ccec-404__search-form input[type="search"]::placeholder {
	color: rgba(255, 255, 255, 0.5);
}

.ccec-404__search-form button {
	padding: 0.875rem 1.25rem;
	background: var(--ccec-primary, #C86A2E);
	border: none;
	color: #fff;
	cursor: pointer;
	font-weight: 600;
	transition: background 0.2s;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 0 999px 999px 0;
	-webkit-appearance: none;
	appearance: none;
}

.ccec-404__search-form button:hover {
	background: var(--ccec-primary-dark, #8A4219);
}

.ccec-404__search-form button svg {
	display: block;
}

/* 404 Quick Links */
.ccec-404__links-section {
	padding: clamp(3rem, 6vw, 5rem) 0;
	background: var(--ccec-white, #fff);
}

.ccec-404__section-heading {
	text-align: center;
	font-family: var(--ccec-font-family);
	font-size: 1.25rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--ccec-neutral-500, #999999);
	margin: 0 0 2rem;
}

.ccec-404__links {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
	max-width: 720px;
	margin: 0 auto;
}

.ccec-404__link {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
	padding: 1.5rem 1rem;
	background: #fff;
	border: 1px solid var(--ccec-light-grey, #E5E5E5);
	border-radius: 12px;
	text-decoration: none;
	color: var(--ccec-black, #1A1A1A);
	font-weight: 600;
	font-size: 0.9375rem;
	transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

.ccec-404__link:hover {
	border-color: var(--ccec-primary, #C86A2E);
	box-shadow: 0 4px 16px rgba(var(--ccec-primary-rgb), 0.12);
	transform: translateY(-2px);
	color: var(--ccec-primary-dark, #8A4219);
}

.ccec-404__link svg {
	color: var(--ccec-primary, #C86A2E);
	transition: color 0.2s ease;
}

/* 404 Upcoming Events */
.ccec-404__events-section {
	padding: clamp(3rem, 6vw, 5rem) 0;
	background: var(--ccec-off-white, #F7F7F9);
}

.ccec-404__events-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	max-width: 900px;
	margin: 0 auto;
}

.ccec-404__event-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border-radius: 12px;
	overflow: hidden;
	text-decoration: none;
	color: var(--ccec-black, #1A1A1A);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
	transition: box-shadow 0.2s ease, transform 0.15s ease;
}

.ccec-404__event-card:hover {
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
	transform: translateY(-3px);
}

.ccec-404__event-image {
	height: 160px;
	background-size: cover;
	background-position: center;
	background-color: var(--ccec-primary-tint, #FDF2EC);
}

.ccec-404__event-image--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ccec-primary-light, #D47844);
}

.ccec-404__event-body {
	padding: 1.25rem;
}

.ccec-404__event-name {
	font-size: 1rem;
	font-weight: 700;
	margin: 0 0 0.375rem;
	line-height: 1.3;
}

.ccec-404__event-date {
	font-size: 0.8125rem;
	color: var(--ccec-neutral-500, #999999);
	margin: 0;
}

/* 404 Contact Strip */
.ccec-404__contact {
	padding: clamp(2.5rem, 5vw, 4rem) 0;
	background: var(--ccec-gradient-brand, linear-gradient(135deg, #C86A2E 0%, #C86A2E 100%));
	color: #fff;
	text-align: center;
}

.ccec-404__contact-heading {
	font-family: var(--ccec-font-family);
	font-size: clamp(1.125rem, 2.5vw, 1.5rem);
	font-weight: 700;
	margin: 0 0 1.5rem;
	color: #fff;
}

.ccec-404__contact-options {
	display: flex;
	justify-content: center;
	gap: 1.5rem;
	flex-wrap: wrap;
}

.ccec-404__contact-item {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0.75rem 1.5rem;
	background: rgba(255, 255, 255, 0.15);
	border-radius: 100px;
	color: #fff;
	text-decoration: none;
	font-weight: 600;
	font-size: 0.9375rem;
	transition: background 0.2s ease;
}

.ccec-404__contact-item:hover {
	background: rgba(255, 255, 255, 0.25);
	color: #fff;
}

.ccec-404__contact-item svg {
	flex-shrink: 0;
}

/* 404 Responsive */
@media (max-width: 768px) {
	.ccec-404__links {
		grid-template-columns: repeat(2, 1fr);
	}

	.ccec-404__events-grid {
		grid-template-columns: 1fr;
		max-width: 400px;
	}
}

@media (max-width: 480px) {
	.ccec-404__links {
		grid-template-columns: repeat(2, 1fr);
		gap: 0.75rem;
	}

	.ccec-404__link {
		padding: 1.125rem 0.75rem;
		font-size: 0.85rem;
	}

	.ccec-404__contact-options {
		flex-direction: column;
		align-items: center;
	}
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 30b: SEARCH RESULTS PAGE
   ═══════════════════════════════════════════════════════════════════════════ */

.search-results-banner {
	background: linear-gradient(180deg, var(--ccec-primary-tint, #FDF2EC) 0%, var(--ccec-white, #fff) 100%);
	padding: var(--ccec-spacing-3xl) 0 var(--ccec-spacing-2xl);
	text-align: center;
}

.search-results-banner__label {
	display: inline-block;
	font-size: var(--ccec-font-size-small);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--ccec-primary);
	margin-bottom: var(--ccec-spacing-sm);
}

.search-results-banner__title {
	font-family: var(--ccec-font-family);
	font-size: clamp(1.75rem, 4vw, 2.5rem);
	color: var(--ccec-black, #1a1a1a);
	margin-bottom: var(--ccec-spacing-sm);
	line-height: 1.25;
}

.search-results-banner__title span {
	color: var(--ccec-primary);
}

.search-results-banner__count {
	color: var(--ccec-dark-grey, #666);
	font-size: var(--ccec-font-size-medium);
	margin-bottom: 0;
}

.search-results-content {
	padding: var(--ccec-spacing-2xl) 0 var(--ccec-spacing-3xl);
}

.search-results-list {
	display: flex;
	flex-direction: column;
	gap: var(--ccec-spacing-lg);
}

/* --- Search Result Card --- */
.search-result-card {
	display: flex;
	gap: var(--ccec-spacing-lg);
	background: var(--ccec-white, #fff);
	border: 1px solid var(--ccec-light-grey, #e5e5e5);
	border-radius: var(--ccec-radius-lg, 16px);
	overflow: hidden;
	transition: box-shadow 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
	padding: 0;
}

.search-result-card:hover {
	box-shadow: var(--ccec-shadow-md);
	border-color: rgba(200, 106, 46, 0.15);
	transform: translateY(-2px);
}

.search-result-card__image {
	flex-shrink: 0;
	width: 220px;
	display: block;
	overflow: hidden;
}

.search-result-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.35s ease;
}

.search-result-card:hover .search-result-card__image img {
	transform: scale(1.05);
}

.search-result-card__body {
	flex: 1;
	padding: var(--ccec-spacing-lg);
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
}

.search-result-card__meta {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: var(--ccec-spacing-sm);
	font-size: var(--ccec-font-size-small);
}

.search-result-card__type {
	display: inline-block;
	background: var(--ccec-primary-tint, #FDF2EC);
	color: var(--ccec-primary, #C86A2E);
	padding: 0.2em 0.65em;
	border-radius: 999px;
	font-weight: 600;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.search-result-card__date {
	color: var(--ccec-mid-grey, #999);
}

.search-result-card__title {
	font-family: var(--ccec-font-family);
	font-size: var(--ccec-font-size-xl, 1.5rem);
	line-height: 1.3;
	margin-bottom: var(--ccec-spacing-sm);
}

.search-result-card__title a {
	color: var(--ccec-black, #1a1a1a);
	text-decoration: none;
	transition: color 0.2s;
}

.search-result-card__title a:hover {
	color: var(--ccec-primary, #C86A2E);
}

.search-result-card__excerpt {
	color: var(--ccec-dark-grey, #666);
	font-size: var(--ccec-font-size-medium);
	line-height: 1.65;
	margin-bottom: var(--ccec-spacing-md);
}

.search-result-card__link {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	color: var(--ccec-primary, #C86A2E);
	font-weight: 600;
	font-size: var(--ccec-font-size-small);
	text-decoration: none;
	transition: gap 0.2s, color 0.2s;
}

.search-result-card__link:hover {
	gap: 0.625rem;
	color: var(--ccec-primary-dark, #8A4219);
}

.search-result-card__link svg {
	flex-shrink: 0;
}

/* --- Search Pagination --- */
.search-results-content .nav-links {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	margin-top: var(--ccec-spacing-2xl);
	flex-wrap: wrap;
}

.search-results-content .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 42px;
	padding: 0 0.75rem;
	border: 1px solid var(--ccec-light-grey, #e5e5e5);
	border-radius: var(--ccec-radius-sm, 6px);
	color: var(--ccec-charcoal, #333);
	font-weight: 500;
	text-decoration: none;
	transition: all 0.2s;
}

.search-results-content .page-numbers:hover {
	border-color: var(--ccec-primary, #C86A2E);
	color: var(--ccec-primary);
	background: var(--ccec-primary-tint, #FDF2EC);
}

.search-results-content .page-numbers.current {
	background: var(--ccec-primary, #C86A2E);
	border-color: var(--ccec-primary);
	color: #fff;
	font-weight: 700;
}

/* --- No Results State --- */
.search-results-empty {
	text-align: center;
	padding: var(--ccec-spacing-3xl) var(--ccec-spacing-lg);
	max-width: 540px;
	margin: 0 auto;
}

.search-results-empty svg {
	margin-bottom: var(--ccec-spacing-lg);
}

.search-results-empty h2 {
	font-family: var(--ccec-font-family);
	font-size: var(--ccec-font-size-xl, 1.5rem);
	margin-bottom: var(--ccec-spacing-sm);
}

.search-results-empty p {
	color: var(--ccec-dark-grey, #666);
	margin-bottom: var(--ccec-spacing-xl);
}

.search-results-empty__retry {
	margin-bottom: var(--ccec-spacing-xl);
}

.search-results-empty__form {
	display: flex;
	border: 2px solid var(--ccec-light-grey, #e5e5e5);
	border-radius: 999px;
	overflow: hidden;
	background: var(--ccec-white, #fff);
	box-shadow: var(--ccec-shadow-sm);
	transition: border-color 0.2s, box-shadow 0.2s;
}

.search-results-empty__form:focus-within {
	border-color: var(--ccec-primary, #C86A2E);
	box-shadow: 0 0 0 3px rgba(200, 106, 46, 0.12);
}

.search-results-empty__form input[type="search"] {
	flex: 1;
	padding: 0.75rem 1.25rem;
	border: none;
	font-size: 1rem;
	outline: none;
	background: transparent;
	color: var(--ccec-black, #1a1a1a);
	min-width: 0;
}

.search-results-empty__form button {
	padding: 0.75rem 1.125rem;
	background: var(--ccec-primary, #C86A2E);
	border: none;
	color: #fff;
	cursor: pointer;
	border-radius: 0 999px 999px 0;
	display: flex;
	align-items: center;
	justify-content: center;
	-webkit-appearance: none;
	appearance: none;
	transition: background 0.2s;
}

.search-results-empty__form button:hover {
	background: var(--ccec-primary-dark, #8A4219);
}

.search-results-empty__links {
	display: flex;
	gap: 0.875rem;
	justify-content: center;
	flex-wrap: wrap;
	padding-top: var(--ccec-spacing-lg);
	border-top: 1px solid var(--ccec-light-grey, #e5e5e5);
}

/* Search results responsive */
@media (max-width: 700px) {
	.search-result-card {
		flex-direction: column;
	}
	.search-result-card__image {
		width: 100%;
		height: 180px;
	}
	.search-result-card__body {
		padding: var(--ccec-spacing-md);
	}
	.search-results-banner {
		padding: var(--ccec-spacing-2xl) 0 var(--ccec-spacing-lg);
	}
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 30c: BREADCRUMB STYLING
   ═══════════════════════════════════════════════════════════════════════════ */

.ccec-breadcrumbs {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0;
	font-size: var(--ccec-font-size-small, 0.875rem);
	color: var(--ccec-mid-grey, #999);
	margin-bottom: var(--ccec-spacing-lg, 1.5rem);
}

.ccec-breadcrumbs a {
	color: var(--ccec-primary, #C86A2E);
	text-decoration: none;
	font-weight: 500;
	transition: color 0.2s;
}

.ccec-breadcrumbs a:hover {
	color: var(--ccec-primary-dark, #8A4219);
	text-decoration: underline;
}

/* Divider between breadcrumb items */
.ccec-breadcrumbs .ccec-breadcrumb-sep,
.ccec-breadcrumbs .separator {
	display: inline-flex;
	align-items: center;
	margin: 0 0.5rem;
	color: var(--ccec-light-grey, #e5e5e5);
	font-size: 0.75em;
}

/* If breadcrumbs use list items */
.ccec-breadcrumbs li {
	display: inline-flex;
	align-items: center;
	list-style: none;
}

.ccec-breadcrumbs li + li::before {
	content: "\203A";
	display: inline-block;
	margin: 0 0.5rem;
	color: var(--ccec-mid-grey, #999);
	font-size: 1.1em;
	font-weight: 300;
}

/* Current page (last item) */
.ccec-breadcrumbs span:last-child,
.ccec-breadcrumbs li:last-child {
	color: var(--ccec-charcoal, #333);
	font-weight: 600;
}

/* Astra breadcrumb compatibility */
.ast-breadcrumbs-wrapper {
	font-family: var(--ccec-font-family);
}

.ast-breadcrumbs-wrapper .trail-items {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0;
	list-style: none;
	padding: 0;
	margin: 0;
}

.ast-breadcrumbs-wrapper .trail-items li + li::before {
	content: "\203A";
	display: inline-block;
	margin: 0 0.5rem;
	color: var(--ccec-mid-grey, #999);
	font-size: 1.1em;
}

.ast-breadcrumbs-wrapper .trail-items a {
	color: var(--ccec-primary, #C86A2E);
	text-decoration: none;
	font-weight: 500;
}

.ast-breadcrumbs-wrapper .trail-items a:hover {
	color: var(--ccec-primary-dark, #8A4219);
}

.ast-breadcrumbs-wrapper .trail-end {
	color: var(--ccec-charcoal, #333);
	font-weight: 600;
}


/* ── Touch Devices — disable hover-dependent transforms ── */
@media (hover: none) {
	.btn--primary:hover,
	.btn--outline:hover,
	a.btn--primary:hover,
	a.btn--outline:hover,
	.apply-btn:hover {
		transform: none;
	}

	.info-card:hover,
	.event-card:hover,
	.news-card:hover,
	.showcase-item:hover,
	.testimonial-card:hover,
	.contact-card:hover {
		transform: none;
	}

	.footer-col:hover .footer-col__title::after {
		width: 30px; /* Keep default width, no expand */
	}

	/* Show card border reveals by default on touch */
	.info-card::before {
		width: 100%;
		left: 0;
	}

	/* Disable magnetic/3D effects */
	.hero__stats .stat-item:hover {
		transform: none;
	}
}


/* ── Touch target sizing (WCAG 2.5.8 — 44px minimum) ──────────── */
@media (hover: none), (pointer: coarse) {
	.footer-social a,
	.header-search-btn,
	.mobile-menu-toggle,
	.calendar-controls__prev,
	.calendar-controls__next,
	.ccec-fab {
		min-width: 44px;
		min-height: 44px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}
}


/* ── Image aspect-ratio — prevents CLS on load ────────────────── */
.event-card__image img,
.news-card__image img,
.showcase__image img {
	aspect-ratio: 3 / 2;
	object-fit: cover;
	width: 100%;
	height: auto;
}

.venue-card__image img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
	width: 100%;
	height: auto;
}


/* ── Windows High Contrast Mode ────────────── */
@media (forced-colors: active) {
	/* Ensure buttons have visible borders */
	.btn--primary,
	.btn--outline,
	.apply-btn,
	button {
		border: 1px solid ButtonText;
	}

	/* Hide decorative pseudo-elements */
	.hero::before,
	.hero::after,
	.cta-banner::before,
	.section--dark::after,
	.info-card::before,
	.section-label::after,
	.footer-col__title::after,
	.section-divider {
		forced-color-adjust: none;
		display: none !important;
	}

	/* Ensure focus rings use system colours */
	:focus-visible {
		outline: 2px solid Highlight;
		outline-offset: 3px;
	}

	/* Ensure links are distinguishable */
	a {
		text-decoration: underline;
	}

	/* 404 code — ensure visible in print */
	.ccec-404__code {
		color: #000 !important;
	}

	/* Page loader: system background */
	.ccec-page-loader {
		background: Canvas;
	}

	.ccec-page-loader__bar {
		background: Highlight;
	}
}




/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 33: FAQ ACCORDION
   ═══════════════════════════════════════════════════════════════════════════ */

.faq {
	padding: var(--ccec-spacing-4xl, 6rem) 0;
	background: var(--ccec-off-white, #F7F7F9);
}

/* Centered header block with generous breathing room above the accordion. */
.faq__header {
	text-align: center;
	max-width: 720px;
	margin: 0 auto var(--ccec-spacing-2xl, 3rem);
	padding: 0 var(--ccec-spacing-md, 1rem);
}

.faq__header .section-label {
	display: inline-block;
	margin-bottom: var(--ccec-spacing-sm, 0.5rem);
}

.faq__heading {
	margin: 0;
	font-size: clamp(1.75rem, 3vw, 2.5rem);
	line-height: 1.2;
	color: var(--ccec-black, #1A1A1A);
}

@media (max-width: 768px) {
	.faq__header {
		margin-bottom: var(--ccec-spacing-xl, 2rem);
	}
}

.faq__container {
	max-width: var(--ccec-container, 1280px);
	margin: 0 auto;
	padding: 0 var(--ccec-gutter, 1.5rem);
}

.faq-accordion {
	max-width: 800px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: var(--ccec-spacing-sm, 0.5rem);
}

.faq-accordion__item {
	background: var(--ccec-white, #fff);
	border: 1px solid var(--ccec-light-grey, #E5E5E5);
	border-radius: var(--ccec-radius-lg, 16px);
	overflow: hidden;
	box-shadow: var(--ccec-shadow-sm);
	transition:
		box-shadow var(--ccec-transition-normal, 0.3s ease),
		border-color var(--ccec-transition-normal, 0.3s ease);
}

.faq-accordion__item:hover {
	box-shadow: var(--ccec-shadow-md);
	border-color: rgba(200, 106, 46, 0.15);
}

.faq-accordion__item[open] {
	border-color: var(--ccec-primary, #C86A2E);
	box-shadow: var(--ccec-shadow-md), 0 0 0 1px rgba(200, 106, 46, 0.08);
}

/* Trigger button — explicitly neutralises Astra's parent button styles
   (which add a coloured background + white text on hover, causing
   orange-on-orange contrast collapse with the new branding palette). */
.faq-accordion__trigger,
.faq-accordion__trigger:hover,
.faq-accordion__trigger:focus,
.faq-accordion__trigger:active {
	background-color: transparent;
	background-image: none;
	box-shadow: none;
}

.faq-accordion__trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: var(--ccec-spacing-lg, 1.5rem) var(--ccec-spacing-xl, 2rem);
	border: none;
	border-radius: 0;
	cursor: pointer;
	font-family: var(--ccec-font-family, 'Open Sans', sans-serif);
	font-size: var(--ccec-font-size-large, 1.125rem);
	font-weight: 600;
	color: var(--ccec-black, #1A1A1A);
	text-align: left;
	line-height: 1.4;
	gap: var(--ccec-spacing-md, 1rem);
	transition: color var(--ccec-transition-fast, 0.15s ease);
}

.faq-accordion__trigger:hover,
.faq-accordion__trigger:focus {
	color: var(--ccec-primary, #C86A2E);
}

.faq-accordion__trigger:focus-visible {
	outline: 2px solid var(--ccec-primary, #C86A2E);
	outline-offset: -2px;
	border-radius: var(--ccec-radius-md, 12px);
}

.faq-accordion__icon {
	flex-shrink: 0;
	width: 1.25rem;
	height: 1.25rem;
	color: var(--ccec-mid-grey, #999);
	transition: transform var(--ccec-transition-normal, 0.3s ease), color var(--ccec-transition-fast, 0.15s ease);
	transform: rotate(0deg);
}

.faq-accordion__item[open] .faq-accordion__icon,
.faq-accordion__trigger[aria-expanded="true"] .faq-accordion__icon {
	transform: rotate(180deg);
	color: var(--ccec-primary, #C86A2E);
}

.faq-accordion__panel {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.4s var(--ccec-ease-out-expo, cubic-bezier(0.16, 1, 0.3, 1));
}

.faq-accordion__item[open] .faq-accordion__panel,
.faq-accordion__panel.is-open {
	/* Generous cap so long answers aren't clipped when they wrap on mobile.
	   (The JS accordion sets an exact inline max-height; this is the fallback.) */
	max-height: 1200px;
}

.faq-accordion__content {
	padding: 0 var(--ccec-spacing-xl, 2rem) var(--ccec-spacing-lg, 1.5rem);
	color: var(--ccec-dark-grey, #616365);
	font-size: var(--ccec-font-size-medium, 1rem);
	line-height: 1.7;
}

.faq-accordion__content p {
	margin: 0 0 var(--ccec-spacing-md, 1rem);
}

.faq-accordion__content p:last-child {
	margin-bottom: 0;
}

.faq-accordion__content a {
	color: var(--ccec-primary, #C86A2E);
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: color var(--ccec-transition-fast, 0.15s ease);
}

.faq-accordion__content a:hover {
	color: var(--ccec-primary-dark, #8A4219);
}

@media (max-width: 768px) {
	.faq {
		padding: var(--ccec-spacing-3xl, 4rem) 0;
	}

	.faq-accordion__trigger {
		padding: var(--ccec-spacing-md, 1rem) var(--ccec-spacing-lg, 1.5rem);
		font-size: var(--ccec-font-size-medium, 1rem);
	}

	.faq-accordion__content {
		padding: 0 var(--ccec-spacing-lg, 1.5rem) var(--ccec-spacing-md, 1rem);
	}
}

@media (prefers-reduced-motion: reduce) {
	.faq-accordion__icon {
		transition: none;
	}

	.faq-accordion__panel {
		transition: none;
	}
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 34: LIGHTBOX OVERLAY
   ═══════════════════════════════════════════════════════════════════════════ */

.lightbox-overlay {
	position: fixed;
	inset: 0;
	z-index: 10000;
	background: rgba(0, 0, 0, 0.92);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition:
		opacity 0.35s ease,
		visibility 0s linear 0.35s;
}

.lightbox-overlay.is-open {
	opacity: 1;
	visibility: visible;
	transition:
		opacity 0.35s ease,
		visibility 0s linear 0s;
}

.lightbox-overlay__img-wrap {
	position: relative;
	max-width: 90vw;
	max-height: 80vh;
	display: flex;
	align-items: center;
	justify-content: center;
}

.lightbox-overlay__img {
	max-width: 100%;
	max-height: 80vh;
	object-fit: contain;
	border-radius: var(--ccec-radius-md, 12px);
	box-shadow: 0 24px 80px rgba(0, 0, 0, 0.5);
	opacity: 0;
	transform: scale(0.95);
	transition:
		opacity 0.4s ease 0.1s,
		transform 0.4s var(--ccec-ease-out-expo, cubic-bezier(0.16, 1, 0.3, 1)) 0.1s;
}

.lightbox-overlay.is-open .lightbox-overlay__img {
	opacity: 1;
	transform: scale(1);
}

.lightbox-overlay__close {
	position: absolute;
	top: var(--ccec-spacing-lg, 1.5rem);
	right: var(--ccec-spacing-lg, 1.5rem);
	z-index: 10002;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 50%;
	color: var(--ccec-white, #fff);
	font-size: 1.25rem;
	cursor: pointer;
	transition:
		background var(--ccec-transition-fast, 0.15s ease),
		transform var(--ccec-transition-fast, 0.15s ease);
}

.lightbox-overlay__close:hover {
	background: rgba(255, 255, 255, 0.2);
	transform: scale(1.1);
}

.lightbox-overlay__close:focus-visible {
	outline: 2px solid var(--ccec-white, #fff);
	outline-offset: 2px;
}

.lightbox-overlay__prev,
.lightbox-overlay__next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10002;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: 50%;
	color: var(--ccec-white, #fff);
	font-size: 1.125rem;
	cursor: pointer;
	transition:
		background var(--ccec-transition-fast, 0.15s ease),
		transform 0.2s ease;
}

.lightbox-overlay__prev {
	left: var(--ccec-spacing-lg, 1.5rem);
}

.lightbox-overlay__next {
	right: var(--ccec-spacing-lg, 1.5rem);
}

.lightbox-overlay__prev:hover,
.lightbox-overlay__next:hover {
	background: rgba(255, 255, 255, 0.2);
}

.lightbox-overlay__prev:hover {
	transform: translateY(-50%) translateX(-2px);
}

.lightbox-overlay__next:hover {
	transform: translateY(-50%) translateX(2px);
}

.lightbox-overlay__prev:focus-visible,
.lightbox-overlay__next:focus-visible {
	outline: 2px solid var(--ccec-white, #fff);
	outline-offset: 2px;
}

.lightbox-overlay__counter {
	position: absolute;
	bottom: var(--ccec-spacing-xl, 2rem);
	left: 50%;
	transform: translateX(-50%);
	color: rgba(255, 255, 255, 0.7);
	font-family: var(--ccec-font-family, 'Open Sans', sans-serif);
	font-size: var(--ccec-font-size-small, 0.875rem);
	font-weight: 600;
	letter-spacing: 0.05em;
	white-space: nowrap;
}

.lightbox-overlay__caption {
	margin-top: var(--ccec-spacing-md, 1rem);
	color: rgba(255, 255, 255, 0.8);
	font-family: var(--ccec-font-family, 'Open Sans', sans-serif);
	font-size: var(--ccec-font-size-small, 0.875rem);
	text-align: center;
	max-width: 600px;
	line-height: 1.5;
}

@media (max-width: 768px) {
	.lightbox-overlay__prev,
	.lightbox-overlay__next {
		width: 40px;
		height: 40px;
		font-size: 1rem;
	}

	.lightbox-overlay__prev {
		left: var(--ccec-spacing-sm, 0.5rem);
	}

	.lightbox-overlay__next {
		right: var(--ccec-spacing-sm, 0.5rem);
	}

	.lightbox-overlay__close {
		top: var(--ccec-spacing-md, 1rem);
		right: var(--ccec-spacing-md, 1rem);
		width: 40px;
		height: 40px;
	}

	.lightbox-overlay__img {
		max-width: 95vw;
		max-height: 70vh;
	}
}

@media (prefers-reduced-motion: reduce) {
	.lightbox-overlay {
		transition: opacity 0.15s ease, visibility 0s linear 0.15s;
	}

	.lightbox-overlay.is-open {
		transition: opacity 0.15s ease, visibility 0s linear 0s;
	}

	.lightbox-overlay__img {
		transition: none;
		transform: scale(1);
	}
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 35: ROOM CONFIGURATOR
   ═══════════════════════════════════════════════════════════════════════════ */

.room-configurator {
	padding: var(--ccec-spacing-4xl, 6rem) 0;
	background: linear-gradient(180deg, var(--ccec-secondary-dark, #6B7554) 0%, var(--ccec-green-900, #3D4430) 100%);
	color: var(--ccec-white, #fff);
	position: relative;
	overflow: hidden;
}

.room-configurator::before {
	content: '';
	position: absolute;
	top: -50%;
	right: -20%;
	width: 600px;
	height: 600px;
	background: radial-gradient(circle, rgba(200, 106, 46, 0.06) 0%, transparent 70%);
	border-radius: 50%;
	pointer-events: none;
}

.room-configurator__container {
	max-width: var(--ccec-container, 1280px);
	margin: 0 auto;
	padding: 0 var(--ccec-gutter, 1.5rem);
	position: relative;
	z-index: 1;
}

.room-configurator__header {
	text-align: center;
	margin-bottom: var(--ccec-spacing-3xl, 4rem);
}

.room-configurator__label {
	display: inline-block;
	font-size: var(--ccec-font-size-small, 0.875rem);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--ccec-accent, #C8963A);
	margin-bottom: var(--ccec-spacing-sm, 0.5rem);
}

.room-configurator__title {
	font-family: var(--ccec-font-family, 'Open Sans', sans-serif);
	font-size: clamp(1.75rem, 4vw, 2.5rem);
	font-weight: 300;
	line-height: 1.2;
	margin-bottom: var(--ccec-spacing-md, 1rem);
}

.room-configurator__subtitle {
	color: rgba(255, 255, 255, 0.6);
	font-size: var(--ccec-font-size-medium, 1rem);
	max-width: 560px;
	margin: 0 auto;
	line-height: 1.6;
}

.room-configurator__body {
	display: grid;
	grid-template-columns: 1fr 1.2fr;
	gap: var(--ccec-spacing-2xl, 3rem);
	align-items: start;
}

.room-configurator__controls {
	display: flex;
	flex-direction: column;
	gap: var(--ccec-spacing-xl, 2rem);
}

.room-configurator__control-group {
	display: flex;
	flex-direction: column;
	gap: var(--ccec-spacing-sm, 0.5rem);
}

.room-configurator__control-label {
	font-size: var(--ccec-font-size-small, 0.875rem);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: rgba(255, 255, 255, 0.5);
}

.room-configurator__btn-group {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.room-configurator__room-btn,
.room-configurator__layout-btn {
	padding: 0.5rem 1.25rem;
	border-radius: var(--ccec-radius-pill, 9999px);
	font-family: var(--ccec-font-family, 'Open Sans', sans-serif);
	font-size: var(--ccec-font-size-small, 0.875rem);
	font-weight: 600;
	color: rgba(255, 255, 255, 0.7);
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.12);
	cursor: pointer;
	transition:
		background var(--ccec-transition-fast, 0.15s ease),
		color var(--ccec-transition-fast, 0.15s ease),
		border-color var(--ccec-transition-fast, 0.15s ease),
		transform 0.2s ease;
	white-space: nowrap;
}

.room-configurator__room-btn:hover,
.room-configurator__layout-btn:hover {
	background: rgba(255, 255, 255, 0.1);
	color: var(--ccec-white, #fff);
	border-color: rgba(255, 255, 255, 0.25);
}

.room-configurator__room-btn:focus-visible,
.room-configurator__layout-btn:focus-visible {
	outline: 2px solid var(--ccec-accent, #C8963A);
	outline-offset: 2px;
}

.room-configurator__room-btn.is-active,
.room-configurator__layout-btn.is-active {
	background: var(--ccec-primary, #C86A2E);
	color: var(--ccec-white, #fff);
	border-color: var(--ccec-primary, #C86A2E);
	box-shadow: 0 4px 16px rgba(200, 106, 46, 0.3);
}

.room-configurator__capacity {
	margin-top: var(--ccec-spacing-md, 1rem);
	text-align: center;
	padding: var(--ccec-spacing-lg, 1.5rem);
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: var(--ccec-radius-lg, 16px);
}

.room-configurator__capacity-label {
	font-size: var(--ccec-font-size-small, 0.875rem);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: rgba(255, 255, 255, 0.5);
	margin-bottom: var(--ccec-spacing-xs, 0.25rem);
}

.room-configurator__capacity-value {
	font-family: var(--ccec-font-family, 'Open Sans', sans-serif);
	font-size: clamp(3rem, 8vw, 5rem);
	font-weight: 200;
	line-height: 1;
	color: var(--ccec-accent, #C8963A);
	transition: transform 0.3s var(--ccec-ease-out-expo), opacity 0.2s ease;
}

.room-configurator__capacity-value.is-updating {
	transform: scale(1.08);
	opacity: 0.6;
}

.room-configurator__capacity-unit {
	font-size: var(--ccec-font-size-medium, 1rem);
	color: rgba(255, 255, 255, 0.5);
	font-weight: 400;
	display: block;
	margin-top: var(--ccec-spacing-xs, 0.25rem);
}

.room-configurator__diagram {
	background: var(--ccec-white, #fff);
	border-radius: var(--ccec-radius-xl, 20px);
	padding: var(--ccec-spacing-2xl, 3rem);
	min-height: 360px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: var(--ccec-shadow-lg);
	position: relative;
	overflow: hidden;
}

.room-configurator__diagram-label {
	position: absolute;
	top: var(--ccec-spacing-md, 1rem);
	left: var(--ccec-spacing-md, 1rem);
	font-size: var(--ccec-font-size-xs, 0.75rem);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--ccec-mid-grey, #999);
}

/* ── Room Configurator: CSS Diagram Layouts ── */

.cfg-diagram {
	width: 100%;
	max-width: 380px;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--ccec-spacing-md, 1rem);
}

.cfg-stage {
	width: 80%;
	height: 8px;
	background: var(--ccec-secondary, #89966C);
	border-radius: var(--ccec-radius-pill, 9999px);
	position: relative;
}

.cfg-stage::after {
	content: 'STAGE';
	position: absolute;
	top: calc(100% + 4px);
	left: 50%;
	transform: translateX(-50%);
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: var(--ccec-secondary, #89966C);
}

/* Theatre — rows of seats */
.cfg-diagram--theatre .cfg-row {
	display: flex;
	gap: 6px;
	justify-content: center;
}

.cfg-diagram--theatre .cfg-seat {
	width: 14px;
	height: 14px;
	border-radius: 3px 3px 0 0;
	background: var(--ccec-primary-tint, #FDF2EC);
	border: 1.5px solid var(--ccec-primary, #C86A2E);
}

/* Classroom — desks with chairs */
.cfg-diagram--classroom .cfg-desk-row {
	display: flex;
	gap: var(--ccec-spacing-md, 1rem);
	justify-content: center;
}

.cfg-diagram--classroom .cfg-desk {
	width: 56px;
	height: 20px;
	background: var(--ccec-green-100, #E3ECE6);
	border: 1.5px solid var(--ccec-primary, #C86A2E);
	border-radius: 3px;
	position: relative;
}

.cfg-diagram--classroom .cfg-desk::before {
	content: '';
	position: absolute;
	bottom: -10px;
	left: 50%;
	transform: translateX(-50%);
	width: 10px;
	height: 10px;
	background: var(--ccec-primary-tint, #FDF2EC);
	border: 1.5px solid var(--ccec-primary, #C86A2E);
	border-radius: 50%;
}

/* Cabaret — round tables */
.cfg-diagram--cabaret .cfg-table-group {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ccec-spacing-lg, 1.5rem);
	justify-content: center;
}

.cfg-diagram--cabaret .cfg-round {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--ccec-green-100, #E3ECE6);
	border: 2px solid var(--ccec-primary, #C86A2E);
	position: relative;
}

.cfg-diagram--cabaret .cfg-round::before,
.cfg-diagram--cabaret .cfg-round::after {
	content: '';
	position: absolute;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--ccec-secondary-tint, #F2F5EE);
	border: 1.5px solid var(--ccec-secondary, #89966C);
}

.cfg-diagram--cabaret .cfg-round::before {
	top: -6px;
	left: 50%;
	transform: translateX(-50%);
}

.cfg-diagram--cabaret .cfg-round::after {
	bottom: -6px;
	left: 50%;
	transform: translateX(-50%);
}

/* Banquet — larger round tables */
.cfg-diagram--banquet .cfg-table-group {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ccec-spacing-xl, 2rem);
	justify-content: center;
}

.cfg-diagram--banquet .cfg-round {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: var(--ccec-green-50, #F4F7F5);
	border: 2px solid var(--ccec-primary, #C86A2E);
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}

.cfg-diagram--banquet .cfg-round-seats {
	width: calc(100% + 20px);
	height: calc(100% + 20px);
	position: absolute;
	border: 2px dashed rgba(200, 106, 46, 0.25);
	border-radius: 50%;
}

/* U-Shape — horseshoe layout */
.cfg-diagram--u-shape .cfg-u-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0;
	width: 100%;
	max-width: 280px;
}

.cfg-diagram--u-shape .cfg-u-top {
	width: 100%;
	height: 24px;
	background: var(--ccec-green-100, #E3ECE6);
	border: 2px solid var(--ccec-primary, #C86A2E);
	border-radius: 4px 4px 0 0;
}

.cfg-diagram--u-shape .cfg-u-left,
.cfg-diagram--u-shape .cfg-u-right {
	width: 24px;
	height: 120px;
	background: var(--ccec-green-100, #E3ECE6);
	border: 2px solid var(--ccec-primary, #C86A2E);
}

.cfg-diagram--u-shape .cfg-u-middle {
	display: flex;
	justify-content: space-between;
	width: 100%;
}

.cfg-diagram--u-shape .cfg-u-center {
	flex: 1;
	min-height: 120px;
}

.cfg-diagram--u-shape .cfg-u-chairs {
	display: flex;
	justify-content: space-around;
	padding: 0 32px;
	margin-top: 6px;
}

.cfg-diagram--u-shape .cfg-u-chair {
	width: 10px;
	height: 10px;
	background: var(--ccec-secondary-tint, #F2F5EE);
	border: 1.5px solid var(--ccec-secondary, #89966C);
	border-radius: 50%;
}

/* Boardroom — single long table */
.cfg-diagram--boardroom .cfg-board-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	width: 100%;
}

.cfg-diagram--boardroom .cfg-board-table {
	width: 70%;
	height: 40px;
	background: var(--ccec-green-100, #E3ECE6);
	border: 2px solid var(--ccec-primary, #C86A2E);
	border-radius: var(--ccec-radius-sm, 6px);
}

.cfg-diagram--boardroom .cfg-board-chairs {
	display: flex;
	justify-content: space-around;
	width: 80%;
}

.cfg-diagram--boardroom .cfg-board-chair {
	width: 12px;
	height: 12px;
	background: var(--ccec-secondary-tint, #F2F5EE);
	border: 1.5px solid var(--ccec-secondary, #89966C);
	border-radius: 50%;
}

.cfg-diagram--boardroom .cfg-board-head {
	width: 12px;
	height: 12px;
	background: var(--ccec-primary-tint, #FDF2EC);
	border: 2px solid var(--ccec-primary, #C86A2E);
	border-radius: 50%;
	align-self: center;
}

@media (max-width: 1024px) {
	.room-configurator__body {
		grid-template-columns: 1fr;
		gap: var(--ccec-spacing-xl, 2rem);
	}

	.room-configurator__diagram {
		min-height: 280px;
		padding: var(--ccec-spacing-xl, 2rem);
	}
}

@media (max-width: 768px) {
	.room-configurator {
		padding: var(--ccec-spacing-3xl, 4rem) 0;
	}

	.room-configurator__btn-group {
		justify-content: center;
	}

	.room-configurator__diagram {
		min-height: 220px;
		padding: var(--ccec-spacing-lg, 1.5rem);
	}
}

@media (max-width: 480px) {
	.room-configurator__room-btn,
	.room-configurator__layout-btn {
		padding: 0.4rem 1rem;
		font-size: var(--ccec-font-size-xs, 0.75rem);
	}
}

@media (prefers-reduced-motion: reduce) {
	.room-configurator__capacity-value {
		transition: none;
	}
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 36: VENUE GALLERY
   ═══════════════════════════════════════════════════════════════════════════ */

.venue-gallery {
	padding: var(--ccec-spacing-4xl, 6rem) 0;
}

.venue-gallery__container {
	max-width: var(--ccec-container, 1280px);
	margin: 0 auto;
	padding: 0 var(--ccec-gutter, 1.5rem);
}

.venue-gallery__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--ccec-spacing-lg, 1.5rem);
}

.venue-gallery__item {
	position: relative;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	border-radius: var(--ccec-radius-lg, 16px);
	cursor: pointer;
	background: var(--ccec-light-grey, #E5E5E5);
}

.venue-gallery__item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s var(--ccec-ease-out-expo, cubic-bezier(0.16, 1, 0.3, 1));
}

.venue-gallery__item:hover img {
	transform: scale(1.06);
}

.venue-gallery__overlay {
	position: absolute;
	inset: 0;
	background: color-mix(in srgb, var(--ccec-primary-dark) 0%, transparent);
	display: flex;
	align-items: center;
	justify-content: center;
	transition:
		background var(--ccec-transition-normal, 0.3s ease);
}

.venue-gallery__item:hover .venue-gallery__overlay {
	background: color-mix(in srgb, var(--ccec-primary-dark) 35%, transparent);
}

.venue-gallery__overlay-icon {
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.9);
	border-radius: 50%;
	color: var(--ccec-secondary, #89966C);
	font-size: 1.25rem;
	opacity: 0;
	transform: scale(0.8);
	transition:
		opacity var(--ccec-transition-normal, 0.3s ease),
		transform 0.35s var(--ccec-ease-out-expo);
}

.venue-gallery__item:hover .venue-gallery__overlay-icon {
	opacity: 1;
	transform: scale(1);
}

.venue-gallery__item:focus-visible {
	outline: 3px solid var(--ccec-primary, #C86A2E);
	outline-offset: 2px;
}

.venue-gallery__item-caption {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: var(--ccec-spacing-sm, 0.5rem) var(--ccec-spacing-md, 1rem);
	background: linear-gradient(transparent, rgba(0, 0, 0, 0.6));
	color: var(--ccec-white, #fff);
	font-size: var(--ccec-font-size-small, 0.875rem);
	font-weight: 500;
	opacity: 0;
	transform: translateY(4px);
	transition:
		opacity var(--ccec-transition-normal, 0.3s ease),
		transform var(--ccec-transition-normal, 0.3s ease);
}

.venue-gallery__item:hover .venue-gallery__item-caption {
	opacity: 1;
	transform: translateY(0);
}

@media (max-width: 1024px) {
	.venue-gallery__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 768px) {
	.venue-gallery {
		padding: var(--ccec-spacing-3xl, 4rem) 0;
	}

	.venue-gallery__grid {
		gap: var(--ccec-spacing-md, 1rem);
	}
}

@media (max-width: 480px) {
	.venue-gallery__grid {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	.venue-gallery__item img {
		transition: none;
	}

	.venue-gallery__overlay-icon {
		transition: opacity 0.15s ease;
		transform: scale(1);
	}

	.venue-gallery__item-caption {
		transition: opacity 0.15s ease;
		transform: translateY(0);
	}
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 37: ACCOMMODATION FINDER
   ═══════════════════════════════════════════════════════════════════════════ */

.accommodation {
	padding: var(--ccec-spacing-4xl, 6rem) 0;
	background: var(--ccec-off-white, #F7F7F9);
}

.accommodation__container {
	max-width: var(--ccec-container, 1280px);
	margin: 0 auto;
	padding: 0 var(--ccec-gutter, 1.5rem);
}

.accommodation__header {
	text-align: center;
	margin-bottom: var(--ccec-spacing-3xl, 4rem);
}

.accommodation__label {
	display: inline-block;
	font-size: var(--ccec-font-size-small, 0.875rem);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--ccec-primary, #C86A2E);
	margin-bottom: var(--ccec-spacing-sm, 0.5rem);
}

.accommodation__title {
	font-family: var(--ccec-font-family, 'Open Sans', sans-serif);
	font-size: clamp(1.75rem, 4vw, 2.5rem);
	font-weight: 300;
	color: var(--ccec-black, #1A1A1A);
	line-height: 1.2;
	margin-bottom: var(--ccec-spacing-md, 1rem);
}

.accommodation__subtitle {
	color: var(--ccec-dark-grey, #616365);
	font-size: var(--ccec-font-size-medium, 1rem);
	max-width: 560px;
	margin: 0 auto;
	line-height: 1.6;
}

.accommodation__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--ccec-spacing-lg, 1.5rem);
}

.accommodation__card {
	background: var(--ccec-white, #fff);
	border: 1px solid var(--ccec-light-grey, #E5E5E5);
	border-radius: var(--ccec-radius-lg, 16px);
	padding: var(--ccec-spacing-xl, 2rem);
	display: flex;
	flex-direction: column;
	gap: var(--ccec-spacing-sm, 0.5rem);
	transition:
		box-shadow var(--ccec-transition-normal, 0.3s ease),
		border-color var(--ccec-transition-normal, 0.3s ease),
		transform 0.25s ease;
}

.accommodation__card:hover {
	box-shadow: var(--ccec-shadow-md);
	border-color: rgba(200, 106, 46, 0.15);
	transform: translateY(-3px);
}

.accommodation__card-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--ccec-spacing-sm, 0.5rem);
}

.accommodation__card-icon {
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--ccec-primary-tint, #FDF2EC);
	border-radius: var(--ccec-radius-md, 12px);
	color: var(--ccec-primary, #C86A2E);
	flex-shrink: 0;
}

.accommodation__card-icon svg {
	width: 22px;
	height: 22px;
}

.accommodation__card-type {
	display: inline-block;
	padding: 0.2em 0.65em;
	border-radius: var(--ccec-radius-pill, 9999px);
	font-size: var(--ccec-font-size-xs, 0.75rem);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	line-height: 1.4;
	/* Default pill colour — the markup emits a bare .accommodation__card-type
	   with no --hotel/--bnb/--boutique modifier, so without this the badge
	   would render as colourless uppercase text. */
	background: var(--ccec-primary-tint, #FDF2EC);
	color: var(--ccec-primary-dark, #8A4219);
}

.accommodation__card-type--hotel {
	background: var(--ccec-secondary-tint, #F2F5EE);
	color: var(--ccec-secondary, #89966C);
}

.accommodation__card-type--bnb {
	background: var(--ccec-primary-tint, #FDF2EC);
	color: var(--ccec-primary-dark, #8A4219);
}

.accommodation__card-type--boutique {
	background: #FFF7ED;
	color: #9A5B1E;
}

.accommodation__card-name {
	font-family: var(--ccec-font-family, 'Open Sans', sans-serif);
	font-size: var(--ccec-font-size-large, 1.125rem);
	font-weight: 600;
	color: var(--ccec-black, #1A1A1A);
	line-height: 1.3;
}

.accommodation__card-name a {
	color: inherit;
	text-decoration: none;
	transition: color var(--ccec-transition-fast, 0.15s ease);
}

.accommodation__card-name a:hover {
	color: var(--ccec-primary, #C86A2E);
}

.accommodation__card-distance {
	font-size: var(--ccec-font-size-small, 0.875rem);
	font-weight: 600;
	color: var(--ccec-primary, #C86A2E);
	display: flex;
	align-items: center;
	gap: 0.35em;
}

.accommodation__card-distance svg {
	width: 14px;
	height: 14px;
	flex-shrink: 0;
}

/* Markup emits .accommodation__card-desc; keep the longer alias too. */
.accommodation__card-desc,
.accommodation__card-description {
	color: var(--ccec-dark-grey, #616365);
	font-size: var(--ccec-font-size-small, 0.875rem);
	line-height: 1.6;
	flex: 1;
}

.accommodation__card-link {
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	font-size: var(--ccec-font-size-small, 0.875rem);
	font-weight: 600;
	color: var(--ccec-primary, #C86A2E);
	text-decoration: none;
	margin-top: var(--ccec-spacing-xs, 0.25rem);
	transition: color var(--ccec-transition-fast, 0.15s ease), gap 0.2s ease;
}

.accommodation__card-link:hover {
	color: var(--ccec-primary-dark, #8A4219);
	gap: 0.6em;
}

.accommodation__card-link:focus-visible {
	outline: 2px solid var(--ccec-primary, #C86A2E);
	outline-offset: 2px;
	border-radius: var(--ccec-radius-sm, 6px);
}

.accommodation__note {
	margin-top: var(--ccec-spacing-2xl, 3rem);
	text-align: center;
	color: var(--ccec-mid-grey, #999);
	font-size: var(--ccec-font-size-small, 0.875rem);
	font-style: italic;
	line-height: 1.6;
	max-width: 600px;
	margin-left: auto;
	margin-right: auto;
}

.accommodation__note a {
	color: var(--ccec-primary, #C86A2E);
	text-decoration: underline;
	text-underline-offset: 2px;
}

@media (max-width: 1024px) {
	.accommodation__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 768px) {
	.accommodation {
		padding: var(--ccec-spacing-3xl, 4rem) 0;
	}
}

@media (max-width: 480px) {
	.accommodation__grid {
		grid-template-columns: 1fr;
	}

	.accommodation__card {
		padding: var(--ccec-spacing-lg, 1.5rem);
	}
}

@media (prefers-reduced-motion: reduce) {
	.accommodation__card {
		transition: box-shadow 0.15s ease, border-color 0.15s ease;
		transform: none;
	}

	.accommodation__card:hover {
		transform: none;
	}
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 38: ENQUIRY FORMS (Toggle + Multi-step + General)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Enquiry Type Toggle */
.enquiry-toggle {
	display: flex;
	gap: 0;
	margin-bottom: 1.5rem;
	border-radius: 10px;
	overflow: hidden;
	border: 2px solid var(--ccec-border, rgba(0, 0, 0, 0.1));
}

.enquiry-toggle__btn {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;
	border-radius: 8px;
	padding: 0.7rem 1rem;
	font-family: inherit;
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	color: var(--ccec-dark-grey, #616365);
	background: transparent;
	border: none;
	cursor: pointer;
	transition: background 0.25s ease, color 0.25s ease;
}

.enquiry-toggle__btn:hover {
	background: rgba(200, 106, 46, 0.04);
	color: var(--ccec-heading-color, #1a1a2e);
}

.enquiry-toggle__btn.is-active {
	background: var(--ccec-primary, #C86A2E);
	color: #fff;
}

.enquiry-toggle__btn svg {
	flex-shrink: 0;
	opacity: 0.7;
}

.enquiry-toggle__btn.is-active svg {
	opacity: 1;
}

/* General form fade-in */
.ccec-general-form {
	animation: multistepFadeIn 0.3s ease;
}

/* Progress Indicator */
.multistep-progress {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0;
	margin-bottom: 2rem;
	padding: 0 1rem;
}

.multistep-progress__step {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.35rem;
	position: relative;
	z-index: 1;
}

.multistep-progress__number {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	font-size: 0.8rem;
	font-weight: 700;
	background: var(--ccec-border, rgba(0, 0, 0, 0.08));
	color: var(--ccec-dark-grey, #616365);
	transition: background 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
}

.multistep-progress__step.is-active .multistep-progress__number {
	background: var(--ccec-primary, #C86A2E);
	color: #fff;
	box-shadow: 0 2px 12px rgba(200, 106, 46, 0.35);
}

.multistep-progress__step.is-complete .multistep-progress__number {
	background: var(--ccec-primary, #C86A2E);
	color: #fff;
}

.multistep-progress__step.is-complete .multistep-progress__number::after {
	content: '✓';
	font-size: 0.9rem;
}

.multistep-progress__step.is-complete .multistep-progress__number {
	font-size: 0;
}

.multistep-progress__label {
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--ccec-dark-grey, #616365);
	white-space: nowrap;
	transition: color 0.3s ease;
}

.multistep-progress__step.is-active .multistep-progress__label {
	color: var(--ccec-heading-color, #1a1a2e);
}

.multistep-progress__connector {
	flex: 1;
	height: 2px;
	min-width: 30px;
	max-width: 80px;
	background: var(--ccec-border, rgba(0, 0, 0, 0.1));
	margin: 0 0.5rem;
	margin-bottom: 1.2rem;
	position: relative;
	border-radius: 1px;
	overflow: hidden;
}

.multistep-progress__connector::after {
	content: '';
	position: absolute;
	inset: 0;
	background: var(--ccec-primary, #C86A2E);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.multistep-progress__connector.is-complete::after {
	transform: scaleX(1);
}

/* Panels */
.multistep-panel {
	display: none;
	border: none;
	padding: 0;
	margin: 0;
	min-inline-size: 0;
	animation: multistepFadeIn 0.35s ease;
}

.multistep-panel.is-active {
	display: block;
}

@keyframes multistepFadeIn {
	from {
		opacity: 0;
		transform: translateX(12px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

.multistep-panel__title {
	font-family: var(--ccec-font-family);
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--ccec-heading-color, #1a1a2e);
	margin-bottom: 1.25rem;
	padding: 0;
}

/* Navigation buttons */
.multistep-nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 1.5rem;
	gap: 1rem;
}

/* Checkbox grid — services */
.checkbox-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0.5rem;
}

.checkbox-card {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.65rem 0.85rem;
	border: 1px solid var(--ccec-border, rgba(0, 0, 0, 0.1));
	border-radius: 8px;
	cursor: pointer;
	transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
	background: var(--ccec-bg-white, #fff);
}

.checkbox-card:hover {
	border-color: var(--ccec-primary, #C86A2E);
	background: rgba(200, 106, 46, 0.03);
}

.checkbox-card input[type="checkbox"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.checkbox-card__box {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	border: 2px solid var(--ccec-border, rgba(0, 0, 0, 0.15));
	border-radius: 4px;
	flex-shrink: 0;
	transition: background 0.2s ease, border-color 0.2s ease;
}

.checkbox-card input:checked ~ .checkbox-card__box {
	background: var(--ccec-primary, #C86A2E);
	border-color: var(--ccec-primary, #C86A2E);
}

.checkbox-card input:checked ~ .checkbox-card__box::after {
	content: '✓';
	color: #fff;
	font-size: 0.7rem;
	font-weight: 700;
}

.checkbox-card input:checked ~ .checkbox-card__text {
	font-weight: 600;
}

.checkbox-card input:focus-visible ~ .checkbox-card__box {
	outline: 2px solid var(--ccec-primary, #C86A2E);
	outline-offset: 2px;
}

.checkbox-card__text {
	font-size: 0.85rem;
	color: var(--ccec-heading-color, #1a1a2e);
	transition: font-weight 0.15s ease;
}

.form-group__label {
	display: block;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--ccec-heading-color, #1a1a2e);
	margin-bottom: 0.5rem;
}

/* Invalid field state */
.ccec-multistep-form .is-invalid {
	border-color: #dc3545 !important;
	box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.15);
}

@media (max-width: 480px) {
	.checkbox-grid {
		grid-template-columns: 1fr;
	}

	.multistep-progress__label {
		font-size: 0.6rem;
	}

	.multistep-progress__number {
		width: 30px;
		height: 30px;
		font-size: 0.7rem;
	}

	.multistep-nav {
		flex-direction: column;
	}

	.multistep-nav .btn {
		width: 100%;
		text-align: center;
	}
}

@media (prefers-reduced-motion: reduce) {
	.multistep-panel {
		animation: none;
	}

	.multistep-progress__connector::after,
	.multistep-progress__number {
		transition-duration: 0.01ms !important;
	}
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 39: CAPACITY COMPARISON TABLE
   ═══════════════════════════════════════════════════════════════════════════ */

.capacity-table {
	padding: var(--ccec-spacing-5xl, 5rem) 0;
	background: var(--ccec-bg-white, #fff);
}

.capacity-table__header {
	text-align: center;
	margin-bottom: var(--ccec-spacing-2xl, 2.5rem);
}

.capacity-table__heading {
	font-family: var(--ccec-font-family);
	font-size: var(--ccec-font-size-3xl, 2.5rem);
	font-weight: 800;
	color: var(--ccec-heading-color, #1a1a2e);
	line-height: 1.2;
	margin-bottom: var(--ccec-spacing-sm, 0.75rem);
}

.capacity-table__intro {
	color: var(--ccec-dark-grey, #616365);
	font-size: 1rem;
	max-width: 560px;
	margin: 0 auto;
	line-height: 1.6;
}

.capacity-table__scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border-radius: 12px;
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06), 0 1px 4px rgba(0, 0, 0, 0.04);
	border: 1px solid var(--ccec-border, rgba(0, 0, 0, 0.06));
}

.capacity-table__matrix {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.95rem;
	min-width: 640px;
}

.capacity-table__matrix thead {
	background: var(--ccec-secondary-dark, #6B7554);
}

.capacity-table__matrix thead th {
	padding: 0.875rem 1rem;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.9);
	text-align: center;
	white-space: nowrap;
	border-bottom: 2px solid var(--ccec-primary, #C86A2E);
}

.capacity-table__matrix thead th:first-child {
	text-align: left;
	padding-left: 1.25rem;
	min-width: 180px;
}

.capacity-table__matrix tbody th {
	padding: 1rem 1.25rem;
	font-weight: 700;
	color: var(--ccec-heading-color, #1a1a2e);
	text-align: left;
	white-space: nowrap;
	background: var(--ccec-bg-soft, rgba(200, 106, 46, 0.03));
	border-right: 1px solid var(--ccec-border, rgba(0, 0, 0, 0.06));
}

.capacity-table__dim {
	display: block;
	font-size: 0.75rem;
	font-weight: 400;
	color: var(--ccec-dark-grey, #616365);
	margin-top: 0.15rem;
}

.capacity-table__matrix tbody td {
	padding: 1rem;
	text-align: center;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--ccec-heading-color, #1a1a2e);
	border-bottom: 1px solid var(--ccec-border, rgba(0, 0, 0, 0.06));
	transition: background 0.15s ease;
}

.capacity-table__matrix tbody tr:hover td {
	background: rgba(200, 106, 46, 0.04);
}

.capacity-table__matrix tbody tr:hover th {
	background: rgba(200, 106, 46, 0.06);
}

.capacity-table__matrix tbody tr:last-child td,
.capacity-table__matrix tbody tr:last-child th {
	border-bottom: none;
}

.capacity-table__na {
	color: var(--ccec-dark-grey, #616365) !important;
	font-weight: 400 !important;
	opacity: 0.4;
}

@media (max-width: 768px) {
	.capacity-table {
		padding: var(--ccec-spacing-3xl, 3rem) 0;
	}

	.capacity-table__heading {
		font-size: var(--ccec-font-size-2xl, 1.75rem);
	}

	.capacity-table__scroll::after {
		content: 'Scroll →';
		display: block;
		text-align: center;
		font-size: 0.7rem;
		color: var(--ccec-dark-grey, #616365);
		padding: 0.5rem;
		opacity: 0.6;
	}
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 40: EVENT COUNTDOWN TIMER
   ═══════════════════════════════════════════════════════════════════════════ */
.ccec-countdown {
	background: var(--ccec-orange-800, #6B3313);
	border-radius: 12px;
	padding: 1.5rem;
	margin-bottom: 1.5rem;
	text-align: center;
}

.ccec-countdown__heading {
	color: #fff;
	font-size: 0.8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin: 0 0 1rem;
}

.ccec-countdown__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0.5rem;
}

.ccec-countdown__item {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.ccec-countdown__number {
	display: block;
	font-size: 1.75rem;
	font-weight: 800;
	line-height: 1;
	color: #fff;
	font-variant-numeric: tabular-nums;
	min-width: 2ch;
}

.ccec-countdown__label {
	display: block;
	font-size: 0.65rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: rgba(255, 255, 255, 0.6);
	margin-top: 0.35rem;
}

.ccec-countdown--ended .ccec-countdown__heading {
	color: var(--ccec-orange-200, #E8A672);
	font-size: 1rem;
}

.ccec-countdown--ended .ccec-countdown__grid {
	display: none;
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 41: RELATED EVENTS CARD GRID
   ═══════════════════════════════════════════════════════════════════════════ */
.related-events {
	padding: 4rem 0;
	background: var(--ccec-grey-50, #f8f9fa);
}

.related-events__heading {
	text-align: center;
	font-size: 1.75rem;
	font-weight: 800;
	margin-bottom: 2rem;
	color: var(--ccec-secondary-700, #4a1d5a);
}

.related-events__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.related-events__card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border-radius: 12px;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.related-events__card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.related-events__image {
	position: relative;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--ccec-secondary-100, #ede0f0);
}

.related-events__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.related-events__card:hover .related-events__image img {
	transform: scale(1.05);
}

.related-events__placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	color: var(--ccec-secondary-300, #b899c4);
}

.related-events__date-badge {
	position: absolute;
	top: 0.75rem;
	left: 0.75rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	background: var(--ccec-primary-600, #3d6849);
	color: #fff;
	border-radius: 8px;
	padding: 0.4rem 0.6rem;
	line-height: 1;
}

.related-events__date-day {
	font-size: 1.25rem;
	font-weight: 800;
}

.related-events__date-month {
	font-size: 0.65rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.related-events__body {
	padding: 1.25rem;
	flex: 1;
}

.related-events__title {
	font-size: 1.05rem;
	font-weight: 700;
	margin: 0 0 0.5rem;
	color: var(--ccec-secondary-700, #4a1d5a);
	line-height: 1.3;
}

.related-events__location {
	display: flex;
	align-items: center;
	gap: 0.35rem;
	font-size: 0.8rem;
	color: var(--ccec-dark-grey, #555);
	margin: 0 0 0.5rem;
}

.related-events__location svg {
	flex-shrink: 0;
	color: var(--ccec-primary-500, #C86A2E);
}

.related-events__excerpt {
	font-size: 0.85rem;
	color: var(--ccec-dark-grey, #666);
	line-height: 1.5;
	margin: 0;
}

@media (max-width: 768px) {
	.related-events__grid {
		grid-template-columns: 1fr;
	}

	.related-events__heading {
		font-size: 1.4rem;
	}
}

@media (max-width: 1024px) and (min-width: 769px) {
	.related-events__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 44: INTERACTIVE FLOOR PLAN
   ═══════════════════════════════════════════════════════════════════════════ */
.ccec-floor-plan {
	margin-bottom: 3rem;
}

.ccec-floor-plan__title {
	text-align: center;
	font-size: 1rem;
	font-weight: 600;
	color: var(--ccec-dark-grey, #666);
	margin-bottom: 1.5rem;
}

.ccec-floor-plan__wrapper {
	display: grid;
	grid-template-columns: 1fr 300px;
	gap: 2rem;
	align-items: start;
}

.ccec-floor-plan__svg {
	width: 100%;
	height: auto;
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
	padding: 1rem;
}

.ccec-floor-plan__room {
	fill: var(--ccec-primary-100, #e8f0ea);
	stroke: var(--ccec-primary-300, #8db89a);
	stroke-width: 2;
	cursor: pointer;
	transition: fill 0.25s ease, stroke 0.25s ease;
}

.ccec-floor-plan__room:hover,
.ccec-floor-plan__room:focus-visible {
	fill: var(--ccec-primary-200, #c5dcc9);
	stroke: var(--ccec-primary-500, #C86A2E);
	stroke-width: 2.5;
}

.ccec-floor-plan__room:focus-visible {
	outline: 3px solid var(--ccec-primary-500, #C86A2E);
	outline-offset: 2px;
}

.ccec-floor-plan__room.is-active {
	fill: var(--ccec-primary-300, #8db89a);
	stroke: var(--ccec-primary-700, #3a6b4a);
	stroke-width: 3;
}

.ccec-floor-plan__room-label {
	font-size: 16px;
	font-weight: 700;
	fill: var(--ccec-secondary-700, #4a1d5a);
	pointer-events: none;
}

.ccec-floor-plan__room-cap {
	font-size: 12px;
	font-weight: 600;
	fill: var(--ccec-dark-grey, #666);
	pointer-events: none;
}

/* Detail panel */
.ccec-floor-plan__detail {
	background: #fff;
	border-radius: 12px;
	padding: 1.5rem;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
	border-left: 4px solid var(--ccec-primary-500, #C86A2E);
}

.ccec-floor-plan__detail-name {
	font-size: 1.25rem;
	font-weight: 800;
	margin: 0 0 1rem;
	color: var(--ccec-secondary-700, #4a1d5a);
}

.ccec-floor-plan__detail-specs {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.3rem 0.75rem;
	margin-bottom: 1rem;
}

.ccec-floor-plan__detail-specs dt {
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--ccec-dark-grey, #888);
}

.ccec-floor-plan__detail-specs dd {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--ccec-near-black, #222);
	margin: 0;
}

.ccec-floor-plan__detail-features {
	list-style: none;
	padding: 0;
	margin: 0 0 1.25rem;
}

.ccec-floor-plan__detail-features li {
	font-size: 0.8rem;
	padding: 0.35rem 0;
	color: var(--ccec-dark-grey, #555);
	border-bottom: 1px solid var(--ccec-grey-50, #f8f8f8);
}

.ccec-floor-plan__detail-features li::before {
	content: '\2713';
	color: var(--ccec-primary-500, #C86A2E);
	font-weight: 700;
	margin-right: 0.5rem;
}

.ccec-floor-plan__enquire {
	display: block;
	width: 100%;
	text-align: center;
	font-size: 0.85rem;
}

@media (max-width: 768px) {
	.ccec-floor-plan__wrapper {
		grid-template-columns: 1fr;
	}

	.ccec-floor-plan__detail {
		border-left: none;
		border-top: 4px solid var(--ccec-primary-500, #C86A2E);
	}
}


/* ═══════════════════════════════════════════════════════════════════════════
   SECTION 31: PRINT STYLES
   ═══════════════════════════════════════════════════════════════════════════ */

@media print {

	/* Typography */
	*,
	*::before,
	*::after {
		background: transparent !important;
		color: #000 !important;
		box-shadow: none !important;
		text-shadow: none !important;
		animation: none !important;
		transition: none !important;
		-webkit-backdrop-filter: none !important;
		backdrop-filter: none !important;
	}

	body {
		font-size: 12pt;
		line-height: 1.5;
		font-family: var(--ccec-font-family);
	}

	h1, h2, h3, h4, h5, h6 {
		font-family: var(--ccec-font-family);
		page-break-after: avoid;
		font-weight: bold;
	}

	h1 { font-size: 24pt; }
	h2 { font-size: 20pt; }
	h3 { font-size: 16pt; }

	p, li, blockquote { orphans: 3; widows: 3; }

	/* Hide decorative/interactive elements */
	.site-header,
	.site-footer,
	.hero,
	.testimonials,
	.location,
	.booking,
	.page-sidebar,
	.mobile-menu-toggle,
	.ccec-fab,
	.ccec-back-to-top,
	.ccec-cookie-banner,
	.ccec-search-overlay,
	.ccec-page-loader,
	.footer-newsletter,
	.ccec-reading-progress,
	.ccec-share,
	.news-article__tags,
	.page-features,
	[aria-hidden="true"],
	nav,
	iframe {
		display: none !important;
	}

	/* Show useful content */
	.site-main,
	.page-content,
	.entry-content,
	.news-article,
	.page-entry {
		width: 100% !important;
		max-width: none !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	/* Print header */
	.page-banner {
		background: none !important;
		padding: 1rem 0 !important;
		border-bottom: 1pt solid #000;
		margin-bottom: 1rem;
	}

	.page-banner__title {
		font-size: 22pt;
		-webkit-text-fill-color: #000 !important;
		background: none !important;
		color: #000 !important;
	}

	/* Show URLs for links */
	a[href]::after {
		content: ' (' attr(href) ')';
		font-size: 9pt;
		color: #555 !important;
	}

	a[href^="#"]::after,
	a[href^="javascript:"]::after,
	.btn::after,
	.btn--primary::after,
	.btn--outline::after {
		content: none;
	}

	/* Images */
	img {
		max-width: 100% !important;
		page-break-inside: avoid;
	}

	/* Table of contents on long articles */
	.entry-content h2 {
		border-top: 0.5pt solid #ccc;
		padding-top: 0.5rem;
		margin-top: 1rem;
	}

	/* Venue contact info — print nicely */
	.footer-col address {
		font-style: normal;
	}

	/* Page break helpers */
	.page-break-before { page-break-before: always; }
	.page-break-avoid { page-break-inside: avoid; }

	/* Event meta prints cleanly */
	.event-details-list dt {
		font-weight: bold;
		display: inline;
	}
	.event-details-list dt::after { content: ': '; }
	.event-details-list dd {
		display: inline;
		margin: 0;
	}
	.event-details-list dd::after { content: '\A'; white-space: pre; }

	/* Branding in print header */
	body::before {
		content: 'Carnegie Conference & Events Centre | ccec.fife.ac.uk';
		display: block;
		font-size: 9pt;
		color: #555 !important;
		border-bottom: 0.5pt solid #ccc;
		padding-bottom: 0.5rem;
		margin-bottom: 1rem;
	}

	/* ─── Enhanced Event Print Styles ───────────────────────────── */

	/* Hide interactive elements */
	.ccec-countdown,
	.add-to-calendar,
	.ccec-share,
	.ccec-back-to-top,
	.ccec-scroll-progress,
	.ccec-search-overlay,
	.ccec-modal,
	.sidebar-card--cta,
	.mobile-menu-toggle,
	.header-search-btn,
	.apply-btn,
	.ccec-floor-plan,
	.delegate-packages__cta,
	.ccec-testimonial-trigger,
	.related-events__card::after {
		display: none !important;
	}

	/* Event page: show URL for reference */
	.single-ccec_event .page-content::after {
		content: 'More info: ' attr(data-permalink);
		display: block;
		margin-top: 2rem;
		padding: 1rem;
		border: 1px solid #ccc;
		font-size: 0.85rem;
		color: #333;
		text-align: center;
	}

	/* Clean up cards for print */
	.related-events__card {
		break-inside: avoid;
		box-shadow: none !important;
		border: 1px solid #ddd;
	}

	.delegate-packages__card {
		break-inside: avoid;
		box-shadow: none !important;
		border: 1px solid #ddd;
	}

	/* Ensure images print */
	.event-featured-image img {
		max-width: 100%;
		page-break-inside: avoid;
	}
}

/* ═══════════════════════════════════════════════════════════════
   SECTION 42: TESTIMONIAL MODAL + STAR RATING
   ═══════════════════════════════════════════════════════════════ */

/* Trigger button */
.testimonials__cta {
	text-align: center;
	margin-top: 2.5rem;
}

.ccec-testimonial-trigger {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

/* Modal base */
.ccec-modal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

.ccec-modal.is-open {
	opacity: 1;
	visibility: visible;
}

.ccec-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.6);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}

.ccec-modal__content {
	position: relative;
	background: #fff;
	border-radius: 16px;
	padding: 2.5rem;
	max-width: 520px;
	width: 90%;
	max-height: 90vh;
	overflow-y: auto;
	transform: translateY(20px);
	transition: transform 0.3s ease;
}

.ccec-modal.is-open .ccec-modal__content {
	transform: translateY(0);
}

.ccec-modal__close {
	position: absolute;
	top: 1rem;
	right: 1rem;
	background: none;
	border: none;
	cursor: pointer;
	color: var(--ccec-dark-grey, #555);
	padding: 0.5rem;
	border-radius: 50%;
	transition: background 0.2s ease;
}

.ccec-modal__close:hover {
	background: var(--ccec-grey-100, #f0f0f0);
}

.ccec-modal__title {
	font-size: 1.5rem;
	font-weight: 800;
	margin: 0 0 0.5rem;
	color: var(--ccec-secondary-700, #4a1d5a);
}

.ccec-modal__subtitle {
	font-size: 0.9rem;
	color: var(--ccec-dark-grey, #666);
	margin: 0 0 1.5rem;
	line-height: 1.5;
}

.ccec-modal__success {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 1rem;
	padding: 2rem 0;
}

.ccec-modal__success p {
	font-size: 1.05rem;
	font-weight: 600;
	color: var(--ccec-primary-700, #3a6b4a);
}

/* Testimonial form fields */
.ccec-testimonial-form__field {
	margin-bottom: 1.25rem;
}

.ccec-testimonial-form__field label {
	display: block;
	font-size: 0.85rem;
	font-weight: 600;
	margin-bottom: 0.4rem;
	color: var(--ccec-secondary-700, #4a1d5a);
}

.ccec-testimonial-form__field input,
.ccec-testimonial-form__field textarea {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 2px solid var(--ccec-grey-200, #e2e2e2);
	border-radius: 8px;
	font-family: inherit;
	font-size: 0.95rem;
	transition: border-color 0.2s ease;
	background: #fff;
	color: var(--ccec-near-black, #1a1a1a);
}

.ccec-testimonial-form__field input:focus,
.ccec-testimonial-form__field textarea:focus {
	outline: none;
	border-color: var(--ccec-primary-500, #C86A2E);
	box-shadow: 0 0 0 3px rgba(200, 106, 46, 0.15);
}

.ccec-testimonial-form__submit {
	width: 100%;
	margin-top: 0.5rem;
}

/* Star rating */
.ccec-star-rating {
	display: flex;
	gap: 0.25rem;
	direction: ltr;
}

.ccec-star-rating__star {
	cursor: pointer;
	color: var(--ccec-grey-300, #ccc);
	transition: color 0.15s ease, transform 0.15s ease;
}

.ccec-star-rating__star input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.ccec-star-rating__star svg {
	fill: currentColor;
	stroke: none;
}

.ccec-star-rating__star.is-active {
	color: #f5a623;
}

/* Keyboard focus: the radio is visually hidden, so surface its focus ring on
   the star itself (WCAG 2.4.7). */
.ccec-star-rating__star:focus-within {
	outline: 2px solid var(--ccec-primary);
	outline-offset: 3px;
	border-radius: 4px;
}

/* CSS fallback so the chosen star shows gold even before JS runs (WCAG 1.3.1). */
.ccec-star-rating__star:has(input:checked) {
	color: #f5a623;
}

.ccec-star-rating__star:hover {
	transform: scale(1.15);
}

@media (max-width: 480px) {
	.ccec-modal__content {
		padding: 1.5rem;
		border-radius: 12px;
	}

	.ccec-modal__title {
		font-size: 1.25rem;
	}
}

/* ═══════════════════════════════════════════════════════════════
   SECTION 43: DELEGATE PACKAGES PRICING
   ═══════════════════════════════════════════════════════════════ */
.delegate-packages {
	padding: 5rem 0;
}

.delegate-packages .section-intro {
	max-width: 600px;
	margin: 0.75rem auto 0;
	color: var(--ccec-dark-grey, #555);
	line-height: 1.6;
}

.delegate-packages__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	align-items: start;
}

.delegate-packages__card {
	position: relative;
	background: #fff;
	border-radius: 16px;
	padding: 2rem;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
	display: flex;
	flex-direction: column;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.delegate-packages__card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.delegate-packages__card--popular {
	border: 2px solid var(--ccec-primary-500, #C86A2E);
	transform: scale(1.03);
	z-index: 1;
}

.delegate-packages__card--popular:hover {
	transform: scale(1.03) translateY(-4px);
}

.delegate-packages__badge {
	position: absolute;
	top: -12px;
	left: 50%;
	transform: translateX(-50%);
	background: var(--ccec-primary-600, #3d6849);
	color: #fff;
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	padding: 0.35rem 1rem;
	border-radius: 100px;
	white-space: nowrap;
}

.delegate-packages__header {
	text-align: center;
	padding-bottom: 1.5rem;
	border-bottom: 1px solid var(--ccec-grey-100, #f0f0f0);
	margin-bottom: 1.5rem;
}

.delegate-packages__name {
	font-size: 1.15rem;
	font-weight: 700;
	margin: 0 0 0.5rem;
	color: var(--ccec-secondary-700, #4a1d5a);
}

.delegate-packages__price {
	font-size: 2rem;
	font-weight: 800;
	margin: 0;
	color: var(--ccec-near-black, #1a1a1a);
}

.delegate-packages__per {
	font-size: 0.8rem;
	color: var(--ccec-dark-grey, #888);
	margin: 0.25rem 0 0;
}

.delegate-packages__features {
	list-style: none;
	margin: 0;
	padding: 0;
	flex: 1;
}

.delegate-packages__features li {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0.6rem 0;
	font-size: 0.9rem;
	border-bottom: 1px solid var(--ccec-grey-50, #f8f8f8);
}

.delegate-packages__features li.is-excluded span {
	color: var(--ccec-grey-400, #aaa);
}

.delegate-packages__features li svg {
	flex-shrink: 0;
}

.delegate-packages__cta {
	display: block;
	text-align: center;
	margin-top: 1.5rem;
}

/* Pulse animation for pre-fill */
@keyframes ccecPulse {
	0%, 100% { box-shadow: 0 0 0 0 rgba(200, 106, 46, 0); }
	50% { box-shadow: 0 0 0 8px rgba(200, 106, 46, 0.2); }
}

.ccec-pulse {
	animation: ccecPulse 0.75s ease 2;
}

@media (max-width: 768px) {
	.delegate-packages__grid {
		grid-template-columns: 1fr;
		max-width: 400px;
		margin: 0 auto;
	}

	.delegate-packages__card--popular {
		transform: none;
		order: -1;
	}

	.delegate-packages__card--popular:hover {
		transform: translateY(-4px);
	}
}

@media (max-width: 1024px) and (min-width: 769px) {
	.delegate-packages__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ═══════════════════════════════════════════════════════════════
   SECTION 46: SMOOTH PAGE TRANSITIONS
   ═══════════════════════════════════════════════════════════════ */
.ccec-page-enter {
	opacity: 0;
	transform: translateY(8px);
}

.ccec-page-enter--active {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 0.4s ease, transform 0.4s ease;
}

.ccec-page-exit {
	opacity: 0;
	transform: translateY(-8px);
	transition: opacity 0.25s ease, transform 0.25s ease;
}

.ccec-page-loader--exit {
	opacity: 1 !important;
	display: flex !important;
	visibility: visible !important;
}

.ccec-page-loader--exit .ccec-page-loader__bar {
	animation: ccecLoaderExit 0.3s ease forwards;
}

.ccec-page-loader--exit .ccec-page-loader__spinner {
	display: flex;
}

@keyframes ccecLoaderExit {
	from { transform: scaleX(0); }
	to   { transform: scaleX(1); }
}

@media (prefers-reduced-motion: reduce) {
	.ccec-page-enter,
	.ccec-page-enter--active,
	.ccec-page-exit {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}

	.ccec-page-loader--exit {
		display: none !important;
	}
}


/* Cloudflare Turnstile widget */
.ccec-turnstile-wrapper {
	margin: var(--ccec-spacing-md) 0;
}

/* ═══════════════════════════════════════════════════════════════
   SECTION 48: FORM MICRO-INTERACTIONS
   ═══════════════════════════════════════════════════════════════ */

/* Input focus — visible outline for keyboard users, box-shadow for sighted polish.
   Uses :focus-visible so mouse clicks don't show the ring, but keyboard/AT always do. */
.ccec-contact-form input:focus-visible,
.ccec-contact-form select:focus-visible,
.ccec-contact-form textarea:focus-visible,
.ccec-general-form input:focus-visible,
.ccec-general-form select:focus-visible,
.ccec-general-form textarea:focus-visible,
.ccec-testimonial-form__field input:focus-visible,
.ccec-testimonial-form__field textarea:focus-visible {
	border-color: var(--ccec-primary-500, #C86A2E);
	box-shadow: 0 0 0 3px rgba(var(--ccec-primary-rgb), 0.15);
	outline: 2px solid var(--ccec-primary-500, #C86A2E);
	outline-offset: 1px;
}

/* Windows High Contrast Mode — box-shadow is suppressed by OS so fall back to
   a 3px Highlight outline which the OS renders reliably. */
@media (forced-colors: active) {
	.ccec-contact-form input:focus-visible,
	.ccec-contact-form select:focus-visible,
	.ccec-contact-form textarea:focus-visible,
	.ccec-general-form input:focus-visible,
	.ccec-general-form select:focus-visible,
	.ccec-general-form textarea:focus-visible,
	.ccec-testimonial-form__field input:focus-visible,
	.ccec-testimonial-form__field textarea:focus-visible {
		outline: 3px solid Highlight;
		box-shadow: none;
	}
}

/* Input hover — subtle border colour change */
.ccec-contact-form input:not(:focus):hover,
.ccec-contact-form select:not(:focus):hover,
.ccec-contact-form textarea:not(:focus):hover,
.ccec-general-form input:not(:focus):hover,
.ccec-general-form select:not(:focus):hover,
.ccec-general-form textarea:not(:focus):hover {
	border-color: var(--ccec-primary-300, #8db89a);
}

/* Smooth transitions on all form fields */
.ccec-contact-form input,
.ccec-contact-form select,
.ccec-contact-form textarea,
.ccec-general-form input,
.ccec-general-form select,
.ccec-general-form textarea {
	transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

/* Valid field indicator (green left border after filling) */
.ccec-contact-form input:valid:not(:placeholder-shown),
.ccec-contact-form textarea:valid:not(:placeholder-shown),
.ccec-general-form input:valid:not(:placeholder-shown),
.ccec-general-form textarea:valid:not(:placeholder-shown) {
	border-left: 3px solid var(--ccec-primary-500, #C86A2E);
}

/* Invalid field (after user interaction) */
.ccec-contact-form input.is-invalid,
.ccec-contact-form select.is-invalid,
.ccec-contact-form textarea.is-invalid,
.ccec-general-form input.is-invalid,
.ccec-general-form select.is-invalid,
.ccec-general-form textarea.is-invalid {
	border-color: #dc3545;
	box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1);
	animation: ccecShake 0.4s ease;
}

@keyframes ccecShake {
	0%, 100% { transform: translateX(0); }
	20% { transform: translateX(-4px); }
	40% { transform: translateX(4px); }
	60% { transform: translateX(-2px); }
	80% { transform: translateX(2px); }
}

/* Submit button loading state */
.ccec-contact-form .btn[disabled],
.ccec-general-form .btn[disabled],
.ccec-testimonial-form__submit[disabled] {
	position: relative;
	color: transparent;
	pointer-events: none;
}

.ccec-contact-form .btn[disabled]::after,
.ccec-general-form .btn[disabled]::after,
.ccec-testimonial-form__submit[disabled]::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 20px;
	height: 20px;
	margin: -10px 0 0 -10px;
	border: 2px solid rgba(255, 255, 255, 0.3);
	border-top-color: #fff;
	border-radius: 50%;
	animation: ccecSpin 0.6s linear infinite;
}

@keyframes ccecSpin {
	to { transform: rotate(360deg); }
}

/* Checkbox cards — enhance existing */
.ccec-contact-form .checkbox-grid label {
	transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

.ccec-contact-form .checkbox-grid label:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.ccec-contact-form .checkbox-grid input:checked + label,
.ccec-contact-form .checkbox-grid label:has(input:checked) {
	border-color: var(--ccec-primary-500, #C86A2E);
	background: var(--ccec-primary-50, #f0f7f1);
	box-shadow: 0 0 0 3px rgba(200, 106, 46, 0.15);
}


/* ═══════════════════════════════════════════════════════════════
   SECTION 49: ENHANCED NEWSLETTER SIGNUP
   ═══════════════════════════════════════════════════════════════ */

/* Newsletter input enhanced focus */
.footer-newsletter__field input[type="email"] {
	transition: border-color 0.2s ease, box-shadow 0.2s ease, padding 0.2s ease;
}

.footer-newsletter__field input[type="email"]:focus {
	box-shadow: 0 0 0 3px rgba(200, 106, 46, 0.25);
	border-color: var(--ccec-primary-400, #6d9f7a);
}

/* Success state */
.footer-newsletter.is-success .footer-newsletter__field {
	position: relative;
}

.footer-newsletter__success {
	display: none;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 1rem;
	color: var(--ccec-primary-300, #8db89a);
	font-weight: 600;
	font-size: 0.95rem;
	animation: ccecFadeUp 0.4s ease;
}

.footer-newsletter.is-success .footer-newsletter__success {
	display: flex;
}

.footer-newsletter.is-success .footer-newsletter__field,
.footer-newsletter.is-success .footer-newsletter__consent {
	display: none;
}

@keyframes ccecFadeUp {
	from {
		opacity: 0;
		transform: translateY(8px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Newsletter checkmark animation */
.footer-newsletter__success svg {
	animation: ccecCheckDraw 0.6s ease forwards;
}

@keyframes ccecCheckDraw {
	0% {
		stroke-dasharray: 100;
		stroke-dashoffset: 100;
	}
	100% {
		stroke-dasharray: 100;
		stroke-dashoffset: 0;
	}
}


/* ═══════════════════════════════════════════════════════════════
   SECTION 50: ANNOUNCEMENT BAR
   ═══════════════════════════════════════════════════════════════ */
.ccec-announcement {
	background: var(--ccec-primary-dark);
	color: #fff;
	padding: 0.6rem 0;
	font-size: 0.8rem;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1100;
	transition: transform 0.4s ease, opacity 0.3s ease;
}

body.admin-bar .ccec-announcement {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar .ccec-announcement {
		top: 46px;
	}
}

/* When announcement is dismissed */
.ccec-announcement.is-dismissed {
	transform: translateY(-100%);
	opacity: 0;
	pointer-events: none;
}

.ccec-announcement__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
}

.ccec-announcement__text {
	margin: 0;
	text-align: center;
	font-weight: 500;
	letter-spacing: 0.02em;
}

.ccec-announcement__close {
	background: none;
	border: none;
	color: rgba(255, 255, 255, 0.7);
	cursor: pointer;
	padding: 0.25rem;
	border-radius: 50%;
	transition: color 0.2s ease, background 0.2s ease;
	flex-shrink: 0;
}

.ccec-announcement__close:hover {
	color: #fff;
	background: rgba(255, 255, 255, 0.15);
}

@media print {
	.ccec-announcement {
		display: none !important;
	}
}

@media (max-width: 480px) {
	.ccec-announcement {
		font-size: 0.75rem;
		padding: 0.5rem 0;
	}
}


/* ═══════════════════════════════════════════════════════════════
   SECTION 48: FLOATING CONTACT FAB
   ═══════════════════════════════════════════════════════════════ */
.ccec-contact-fab {
	position: fixed;
	bottom: 1.5rem;
	left: 1.5rem;
	z-index: 9999;
}

.ccec-contact-fab__toggle {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	/* Use the current primary colour — overrides the ghost-button neutraliser
	   which catches button[class*="__toggle"] and would make this transparent. */
	background: var(--ccec-primary, #C86A2E) !important;
	background-image: none !important;
	color: #fff;
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 16px rgba(200, 106, 46, 0.35) !important;
	transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
	position: relative;
	z-index: 2;
}

.ccec-contact-fab__toggle:hover {
	background: var(--ccec-primary-dark, #8A4219) !important;
	background-image: none !important;
	transform: scale(1.05);
	box-shadow: 0 6px 20px rgba(200, 106, 46, 0.45) !important;
}

.ccec-contact-fab__icon-open,
.ccec-contact-fab__icon-close {
	width: 24px;
	height: 24px;
	stroke: var(--ccec-white);
	flex-shrink: 0;
}

.ccec-contact-fab__icon-close {
	display: none;
}

.ccec-contact-fab.is-open .ccec-contact-fab__icon-open {
	display: none;
}

.ccec-contact-fab.is-open .ccec-contact-fab__icon-close {
	display: block;
}

.ccec-contact-fab__menu {
	position: absolute;
	bottom: calc(100% + 0.75rem);
	left: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: opacity 0.25s ease, visibility 0.25s ease, transform 0.25s ease;
}

.ccec-contact-fab.is-open .ccec-contact-fab__menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.ccec-contact-fab__item {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0.65rem 1rem;
	background: #fff;
	border-radius: 100px;
	color: var(--ccec-near-black, #222);
	text-decoration: none;
	font-size: 0.85rem;
	font-weight: 600;
	white-space: nowrap;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
	transition: background 0.2s ease, transform 0.15s ease;
}

.ccec-contact-fab__item svg {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	stroke: currentColor;
}

.ccec-contact-fab__item:hover {
	transform: translateX(4px);
}

.ccec-contact-fab__item--phone:hover {
	background: var(--ccec-primary-50, #f0f7f1);
	color: var(--ccec-primary-700, #3a6b4a);
}

.ccec-contact-fab__item--email:hover {
	background: var(--ccec-secondary-50, #f5edf7);
	color: var(--ccec-secondary-700, #4a1d5a);
}

.ccec-contact-fab__item--book:hover {
	background: var(--ccec-primary-600, #3d6849);
	color: #fff;
}

.ccec-contact-fab__item svg {
	flex-shrink: 0;
}

/* Hide on print */
@media print {
	.ccec-contact-fab {
		display: none !important;
	}
}

/* Mobile: slightly smaller */
@media (max-width: 480px) {
	.ccec-contact-fab {
		bottom: 1rem;
		left: 1rem;
	}

	.ccec-contact-fab__toggle {
		width: 48px;
		height: 48px;
	}
}


/* ═══════════════════════════════════════════════════════════════
   SECTION 52: MEET THE TEAM PAGE
   ═══════════════════════════════════════════════════════════════ */

.ccec-team-intro {
	padding: var(--ccec-spacing-3xl) 0 var(--ccec-spacing-xl);
}

.ccec-team-intro__text {
	max-width: 720px;
	margin: 0 auto;
	text-align: center;
	font-size: 1.125rem;
	line-height: 1.8;
	color: var(--ccec-neutral-600, #555);
}

.ccec-team {
	padding: 0 0 var(--ccec-spacing-4xl);
}

/* Section heading visible to sighted users; was screen-reader-text only (a11y fix). */
.ccec-team__section-heading {
	text-align: center;
	font-size: clamp(1.5rem, 3vw, 2rem);
	color: var(--ccec-black);
	margin: 0 0 var(--ccec-spacing-2xl);
}

.ccec-team__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--ccec-spacing-xl);
}

/* ── Team Card ─────────────────────────────────────────────── */
.ccec-team-card {
	background: var(--ccec-surface-card, #fff);
	border-radius: var(--ccec-radius-xl, 16px);
	overflow: hidden;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
	transition: transform 0.35s var(--ccec-ease-out-expo), box-shadow 0.35s ease;
}

.ccec-team-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
}

.ccec-team-card__photo-wrap {
	position: relative;
	aspect-ratio: 1;
	overflow: hidden;
	background: linear-gradient(135deg, var(--ccec-orange-100), var(--ccec-orange-50));
}

.ccec-team-card__photo {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s var(--ccec-ease-out-expo);
}

.ccec-team-card:hover .ccec-team-card__photo {
	transform: scale(1.05);
}

/* Placeholder avatar when no photo */
.ccec-team-card__placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, var(--ccec-primary), var(--ccec-primary-dark));
}

.ccec-team-card__initials {
	font-size: 3rem;
	font-weight: 800;
	color: var(--ccec-white);
	opacity: 0.8;
	letter-spacing: 0.05em;
}

/* Role badge overlaid on photo */
.ccec-team-card__role-badge {
	position: absolute;
	bottom: var(--ccec-spacing-sm);
	left: var(--ccec-spacing-sm);
	padding: 0.35rem 0.85rem;
	background: color-mix(in srgb, var(--ccec-primary-dark) 88%, transparent);
	backdrop-filter: blur(8px);
	color: var(--ccec-white);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	border-radius: var(--ccec-radius-pill, 50px);
}

/* Card body */
.ccec-team-card__body {
	padding: var(--ccec-spacing-lg);
}

.ccec-team-card__name {
	font-size: 1.25rem;
	font-weight: 700;
	margin: 0 0 var(--ccec-spacing-sm);
	color: var(--ccec-neutral-900, #1a1a2e);
}

.ccec-team-card__bio {
	font-size: 0.9rem;
	line-height: 1.7;
	color: var(--ccec-neutral-600, #555);
	margin: 0 0 var(--ccec-spacing-md);
}

/* Social/contact links */
.ccec-team-card__links {
	display: flex;
	gap: var(--ccec-spacing-sm);
}

.ccec-team-card__link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--ccec-neutral-100, #f5f5f5);
	color: var(--ccec-neutral-600, #555);
	transition: background 0.2s, color 0.2s, transform 0.2s;
}

.ccec-team-card__link:hover {
	background: var(--ccec-primary);
	color: var(--ccec-white);
	transform: translateY(-2px);
}

.ccec-team-card__link:focus-visible {
	outline: 3px solid var(--ccec-primary-light);
	outline-offset: 2px;
}

/* ── Team CTA Strip ────────────────────────────────────────── */
.ccec-team-cta {
	margin-top: var(--ccec-spacing-3xl);
}

.ccec-team-cta__inner {
	background: linear-gradient(135deg, var(--ccec-primary-dark), var(--ccec-primary));
	border-radius: var(--ccec-radius-xl, 16px);
	padding: var(--ccec-spacing-3xl) var(--ccec-spacing-2xl);
	text-align: center;
	color: var(--ccec-white);
}

.ccec-team-cta__heading {
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 800;
	margin: 0 0 var(--ccec-spacing-sm);
	color: #fff;
}

.ccec-team-cta__text {
	font-size: 1.0625rem;
	opacity: 0.9;
	max-width: 520px;
	margin: 0 auto var(--ccec-spacing-xl);
	line-height: 1.7;
}

.ccec-team-cta__actions {
	display: flex;
	gap: var(--ccec-spacing-md);
	justify-content: center;
	flex-wrap: wrap;
}

.ccec-team-cta__actions .btn--primary,
.ccec-team-cta__actions a.btn--primary {
	background: linear-gradient(135deg, var(--ccec-secondary) 0%, var(--ccec-secondary-dark) 100%) !important;
	border-color: transparent !important;
}

.ccec-team-cta__actions .btn--primary:hover,
.ccec-team-cta__actions a.btn--primary:hover {
	background: linear-gradient(135deg, var(--ccec-secondary-dark) 0%, var(--ccec-secondary) 100%) !important;
}

/* Phone / secondary button sits on the dark gradient inner. The default
   .btn--outline is dark text on transparent, which collapses against the
   gradient. Force white border + white text and a subtle inverse hover. */
.ccec-team-cta__actions .btn--outline,
.ccec-team-cta__actions a.btn--outline,
.btn--outline-light,
a.btn--outline-light {
	background: transparent !important;
	color: #fff !important;
	border: 2px solid #fff !important;
}

.ccec-team-cta__actions .btn--outline:hover,
.ccec-team-cta__actions a.btn--outline:hover,
.ccec-team-cta__actions .btn--outline:focus-visible,
.ccec-team-cta__actions a.btn--outline:focus-visible,
.btn--outline-light:hover,
a.btn--outline-light:hover,
.btn--outline-light:focus-visible,
a.btn--outline-light:focus-visible {
	background: #fff !important;
	color: var(--ccec-primary-dark, #8A4219) !important;
	border-color: #fff !important;
}

/* outline overrides placed AFTER the main:not(...) rule below to ensure correct cascade */

/* ── Responsive ────────────────────────────────────────────── */
@media (max-width: 1024px) {
	.ccec-team__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.ccec-team__grid {
		grid-template-columns: 1fr;
		gap: var(--ccec-spacing-lg);
	}

	.ccec-team-card__initials {
		font-size: 2.25rem;
	}

	.ccec-team-cta__inner {
		padding: var(--ccec-spacing-2xl) var(--ccec-spacing-lg);
	}
}

@media (prefers-reduced-motion: reduce) {
	.ccec-team-card,
	.ccec-team-card__photo {
		transition: none;
	}

	.ccec-team-card:hover {
		transform: none;
	}

	.ccec-team-card:hover .ccec-team-card__photo {
		transform: none;
	}
}


/* ═══════════════════════════════════════════════════════════════
   SECTION 53: MOBILE SWEEP — COMPREHENSIVE FIXES
   ═══════════════════════════════════════════════════════════════ */

/* ── Hide FABs on mobile when bottom nav is present ────────── */
@media (max-width: 767px) {
	.ccec-contact-fab,
	.ccec-fab,
	.ccec-back-to-top {
		display: none !important;
	}
}

/* ── Site title — prevent truncation on mobile ─────────────── */
@media (max-width: 480px) {
	.site-title {
		font-size: clamp(0.8rem, 4vw, 1.1rem);
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		max-width: 55vw;
		display: block;
	}
}

@media (min-width: 481px) and (max-width: 767px) {
	.site-title {
		font-size: clamp(0.9rem, 3vw, 1.25rem);
	}
}

/* ── btn--outline on light backgrounds ─────────────────────── */
/* Default btn--outline is white text for dark sections.
   On light pages (events, general), use dark text + border.
   The selector list is intentionally limited to specific section classes —
   an earlier broad `main:not(.hero):not(.booking):not(.cta-banner)` rule
   was BROKEN because :not() applied to <main> itself (which has none of
   those classes), so the descendant .btn--outline always matched and
   forced orange text on the hero CTA, where white was intended. */
.events-calendar .btn--outline,
.calendar-past-toggle .btn--outline,
.page-content .btn--outline {
	color: var(--ccec-primary) !important;
	border-color: var(--ccec-primary);
	background-color: transparent;
}

.events-calendar .btn--outline:hover,
.calendar-past-toggle .btn--outline:hover,
.page-content .btn--outline:hover {
	color: var(--ccec-white) !important;
	background-color: var(--ccec-primary);
	border-color: var(--ccec-primary);
}

/* ── Team page CTA — green outline button (after light-bg override above) ── */
.ccec-team-cta__actions .btn--outline,
.ccec-team-cta__actions a.btn--outline {
	border-color: var(--ccec-secondary) !important;
	color: #fff !important;
	background-color: transparent;
}

.ccec-team-cta__actions .btn--outline:hover,
.ccec-team-cta__actions a.btn--outline:hover {
	background: var(--ccec-secondary) !important;
	border-color: var(--ccec-secondary) !important;
}

/* ── Calendar — mobile responsive ──────────────────────────── */
@media (max-width: 767px) {
	.calendar-grid__day-name {
		padding: 0.5rem 0.15rem;
		font-size: 0.55rem;
		letter-spacing: 0.05em;
	}

	.calendar-cell {
		min-height: 48px;
		padding: 0.25rem;
	}

	.calendar-cell__number {
		font-size: 0.7rem;
	}

	.calendar-cell__events {
		gap: 1px;
	}

	.calendar-cell__event-label {
		font-size: 0.45rem;
		padding: 1px 2px;
		line-height: 1.2;
	}

	.calendar-cell__more {
		font-size: 0.5rem;
	}

	.calendar-controls {
		flex-direction: column;
		gap: 0.75rem;
		align-items: stretch;
	}

	.calendar-controls__nav {
		justify-content: center;
	}

	.calendar-controls__filters {
		flex-wrap: wrap;
		justify-content: center;
	}

	.calendar-detail-panel {
		padding: 1rem;
	}

	/* Calendar view toggle — stack on mobile */
	.calendar-controls__view {
		justify-content: center;
	}
}

/* ── Contact form — stack 2-col rows on mobile ─────────────── */
@media (max-width: 600px) {
	.ccec-contact-form .form-row {
		grid-template-columns: 1fr;
		gap: 0;
	}

	.ccec-contact-form input[type="text"],
	.ccec-contact-form input[type="email"],
	.ccec-contact-form input[type="tel"],
	.ccec-contact-form input[type="date"],
	.ccec-contact-form input[type="number"],
	.ccec-contact-form textarea,
	.ccec-contact-form select {
		font-size: 16px; /* prevents iOS zoom on focus */
	}

	/* ── Booking / contact form mobile fixes ────────────────────── */

	/* Collapse the left-contacts / right-form side-by-side grid to a
	   single column and tighten the gap so sections don't feel cavernous */
	.booking__grid {
		grid-template-columns: 1fr;
		gap: var(--ccec-spacing-xl);
	}

	/* Contact cards: allow them to fill full width on narrow screens
	   (the auto-fit minmax(260px) would force a horizontal scroll on
	   phones narrower than ~290px once card padding is added) */
	.booking__contacts,
	.booking__team {
		grid-template-columns: 1fr;
		gap: var(--ccec-spacing-md);
		margin-bottom: var(--ccec-spacing-xl);
	}

	/* Reduce the white form card padding so inputs aren't cramped */
	.booking__form-area {
		padding: var(--ccec-spacing-xl) var(--ccec-spacing-lg);
		border-radius: var(--ccec-radius-xl);
	}

	.booking__form-wrapper {
		padding: 0;
	}

	.booking__form-title {
		font-size: 1.2rem;
		margin-bottom: var(--ccec-spacing-lg);
	}

	/* Contact info cards inside the booking section */
	.contact-card {
		padding: var(--ccec-spacing-lg);
	}

	/* contact-quick row under the cards */
	.contact-quick {
		padding: var(--ccec-spacing-md) 0;
	}
	.contact-quick h4 {
		font-size: 0.9rem;
		margin-bottom: 0.35rem;
	}

	.booking__heading {
		font-size: clamp(1.4rem, 5.5vw, 1.9rem);
	}

	.booking__intro {
		font-size: 0.9rem;
	}
}

/* ── Upcoming events section — visible on mobile ───────────── */
@media (max-width: 767px) {
	.upcoming-events .event-cards {
		display: flex;
		flex-direction: column;
		gap: 1rem;
	}

	.upcoming-events .event-card {
		flex: none;
		width: 100%;
	}

	/* Event card grid — stack image and content */
	.event-card__inner {
		flex-direction: column;
	}

	.event-card__image {
		width: 100%;
		height: 180px;
	}
}

/* ── Hero buttons on mobile — proper sizing ────────────────── */
@media (max-width: 480px) {
	.hero .hero__ctas {
		flex-direction: column;
		width: 100%;
		gap: 0.75rem;
	}

	.hero .hero__ctas .btn {
		width: 100%;
		justify-content: center;
		text-align: center;
	}

	.hero .hero__ctas .btn--lg {
		padding: 1rem 1.5rem !important;
		font-size: 0.95rem !important;
	}

	/* Stats grid — 2x2 on smallest screens */
	.hero__stats {
		grid-template-columns: 1fr 1fr;
		gap: 0.5rem;
		padding: 0 0.5rem;
	}

	/* Booking form — smallest phones */
	.booking__form-area {
		padding: var(--ccec-spacing-lg) var(--ccec-spacing-md);
		border-radius: var(--ccec-radius-lg);
	}

	.contact-card {
		padding: var(--ccec-spacing-md);
	}

	/* Submit button full-width on tiny screens */
	.ccec-contact-form .form-submit .btn,
	.ccec-contact-form .form-submit input[type="submit"],
	.ccec-contact-form button[type="submit"] {
		width: 100%;
		justify-content: center;
	}
}

/* ── General mobile spacing fixes ──────────────────────────── */
@media (max-width: 767px) {
	/* Prevent horizontal overflow */
	body {
		overflow-x: hidden;
	}

	/* Ensure containers have padding */
	.container {
		padding-left: 1rem;
		padding-right: 1rem;
	}

	/* Reduce oversized section padding on mobile */
	section {
		padding-top: clamp(2rem, 8vw, 3.5rem);
		padding-bottom: clamp(2rem, 8vw, 3.5rem);
	}

	/* Location grid — stack on mobile */
	.location__grid {
		grid-template-columns: 1fr;
	}

	.location__map-wrapper iframe {
		height: 280px;
	}

	/* Café grid — stack on mobile */
	.cafe-1899__grid {
		grid-template-columns: 1fr;
	}

	/* Footer — single column */
	.footer-grid {
		grid-template-columns: 1fr;
		gap: var(--ccec-spacing-xl);
	}

	/* Newsletter form — stack */
	.newsletter-form {
		flex-direction: column;
	}

	.newsletter-form input,
	.newsletter-form button {
		width: 100%;
	}
}

/* ── Mobile menu uplift ────────────────────────────────────── */

/* Hide announcement bar + bottom nav when menu is open */
@media (max-width: 1565px) {
	body.is-nav-open .ccec-announcement {
		opacity: 0 !important;
		pointer-events: none;
	}

	body.is-nav-open .ccec-mobile-nav {
		transform: translateY(100%);
		opacity: 0;
		pointer-events: none;
	}

	/* Improve sub-menu readability */
	.main-navigation .sub-menu a,
	.main-navigation .sub-menu a:link,
	.main-navigation .sub-menu a:visited {
		font-size: 0.8rem !important;
		color: rgba(255, 255, 255, 0.55) !important;
		padding: 0.55rem 1rem !important;
		letter-spacing: 0.02em;
	}

	.main-navigation .sub-menu a:hover,
	.main-navigation .sub-menu a:focus {
		color: rgba(255, 255, 255, 0.9) !important;
	}

	/* CTA button at bottom of mobile nav — height-responsive so it shrinks
	   on short screens (landscape phones) instead of pushing the contact
	   row out of the viewport. */
	.mobile-nav-footer__cta {
		display: inline-flex;
		align-items: center;
		gap: 0.5em;
		margin-top: clamp(0.5rem, 2vh, 1.25rem);
		padding: clamp(0.55rem, 1.4vh, 0.85rem) clamp(1.25rem, 4vw, 2rem);
		background: var(--ccec-gradient-brand, linear-gradient(135deg, #C86A2E, #8A4219));
		color: #fff !important;
		text-decoration: none !important;
		border-radius: 999px;
		font-size: clamp(0.72rem, 1.6vh, 0.85rem);
		font-weight: 700;
		letter-spacing: 0.03em;
		text-transform: uppercase;
		box-shadow: 0 4px 20px rgba(200, 106, 46, 0.4);
		transition: transform 0.2s ease, box-shadow 0.2s ease;
	}

	.mobile-nav-footer__cta:hover {
		transform: scale(1.04);
		box-shadow: 0 6px 28px rgba(200, 106, 46, 0.5);
		color: #fff !important;
	}

	.mobile-nav-footer__cta svg {
		width: 16px;
		height: 16px;
		fill: none;
		stroke: currentColor;
		stroke-width: 2;
	}
}