/*
Theme Name:  Verve Care & Support
Theme URI:   https://vervecare.com.au
Author:      Saroj Shrestha
Author URI:  https://vervecare.com.au
Description: A clean, modern, and fully accessible WordPress theme for Verve Care & Support — a disability support and care service provider. Features a warm, trustworthy aesthetic with sticky header, dynamic footer columns, customizer-driven front page sections, and WCAG-compliant colour system.
Version:     1.4.3
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License:     GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: verve-care
Tags:        accessibility-ready, custom-colors, custom-logo, custom-menu, featured-images, footer-widgets, full-width-template, responsive-layout, theme-options, threaded-comments
*/

/*
 * CHANGELOG
 * ──────────────────────────────────────────────────────────────────────────
 * 1.4.3 — 2025-06
 *   - Removed the bundled Property Management module — this feature now lives
 *     in a dedicated companion plugin (keeps the theme focused on
 *     presentation; data survives theme switches when stored by a plugin).
 *
 * 1.4.2 — 2025-06
 *   - Footer Customizer re-grouped: 1·Footer Widgets, 2·Social (profile URLs
 *     + social bar together), 3·Brand & Copyright (tagline, copyright, NDIS
 *     badge, alignment), 4·Footer Note (Acknowledgement wording removed —
 *     now a generic note), 5·Colours, 6·Typography. Setting IDs unchanged.
 *
 * 1.4.1 — 2025-06
 *   - Footer Customizer reorganised into a clear order: 1·Footer Widgets,
 *     2·Social Bar, 3·Brand & Copyright Bar, 4·Footer Note, 5·Social Links
 *     & Badge, 6·Colours, 7·Typography. (Setting IDs unchanged — saved
 *     values preserved.)
 *   - NEW Header Bar / Announcement: a notice bar pinned at the very top.
 *     Enable/disable, notice type (info/success/warning/alert/neutral),
 *     select a page (pulls its title + link), show the page heading as the
 *     bar text or use custom text, choose an icon (auto or specific),
 *     background/text colour overrides, optional visitor-dismiss. Clicking
 *     the bar opens the linked page. Fixed at top above the sticky header;
 *     header offset auto-adjusts so nothing is hidden.
 *
 * 1.4.0 — 2025-06
 *   - New theme screenshot (live homepage preview).
 *   - Footer Note text: max-width: fit-content on the text element.
 *   - Hero section now uses .section-pad for consistent vertical rhythm
 *     (padding-block clamp(sp-8, 5vw, sp-16)).
 *   - Footer Widgets: new bullet-style selectors for menu widgets and list
 *     widgets (none/disc/circle/square/dash/arrow/check), output via the
 *     footer dynamic CSS.
 *   - FIXED iPhone toggle menu showing as an empty white box: the hamburger
 *     bars now have an explicit width (iOS Safari does not stretch 0-width
 *     flex children); 3 lines animate to a cross when expanded.
 *   - FIXED Google Map embed not displaying: iframes were being stripped by
 *     wp_kses_post. Added verve_sanitize_embed() which permits iframes from
 *     trusted map hosts (google.com / maps / openstreetmap) with a safe
 *     attribute whitelist; used for both the Customizer setting and output.
 *
 * 1.3.9 — 2025-06
 *   - Footer Note: __inner padding set to 10px 0; note text paragraphs now
 *     have margin-bottom (sp-4) and max-width: fit-content (last paragraph
 *     margin removed).
 *   - Footer Bottom: new alignment control (left / center / right, default
 *     center) for the NDIS badge + copyright group, plus a new NDIS Badge
 *     Size control (40–320px). Badge size applied inline.
 *
 * 1.3.8 — 2025-06
 *   - Footer bottom: NDIS badge and copyright now share one line (badge
 *     left of the copyright text) via a .footer-bottom__left flex group;
 *     badge image capped at 90px.
 *   - Footer Note: text now takes full remaining width and sits on one line
 *     beside the images, wrapping to multiple lines only when the font size
 *     is increased (flex 1 1 auto, min-width 0, nowrap row).
 *   - Hero min-height reduced to calc(70vh - header) for a shorter hero.
 *   - All sections: reduced padding-block (section-pad now clamp(sp-8,5vw,
 *     sp-16); section-pad--sm clamp(sp-6,3.5vw,sp-12)).
 *
 * 1.3.7 — 2025-06
 *   - Footer Note: added font-size control and text-alignment control
 *     (auto/left/center/right). "Auto" hugs the far content edge opposite
 *     the images (images-left → text reads from left; images-right → right).
 *   - NDIS Badge now actually renders above the footer copyright bar when a
 *     badge image is uploaded and the toggle is on (was previously a
 *     dead setting). Clearer Customizer descriptions added.
 *   - Social Bar: increased spacing after the label text.
 *   - FIXED iPhone mobile menu showing as a blank white box: the menu now
 *     slides in BELOW a solid header (logo + close toggle stay visible and
 *     tappable), with a dimmed backdrop and body-scroll lock.
 *   - New "Site Features" Customizer section: Back-to-Top button, Sticky
 *     Header toggle, Button Corner Radius, Page Preloader, Smooth Scroll,
 *     and Reading Progress Bar — each wired to real front-end behaviour.
 *   - Non-sticky header now scrolls with the page (position relative) and
 *     the main-content offset only applies when the sticky header is on.
 *   - Added Requires at least / Requires PHP / Tested up to headers.
 *
 * 1.3.6 — 2025-06
 *   - Page entry content now full width: both
 *     .page-content-layout__content.entry-content and
 *     .page-article > .entry-content set to max-width: 100%.
 *   - Customizer "Footer" reorganised from one long flat section into a
 *     Footer PANEL with seven logical sub-sections: 1·Layout & Widgets,
 *     2·Brand & Copyright, 3·Social Links & Badge, 4·Colours,
 *     5·Typography, 6·Social Bar, 7·Footer Note / Acknowledgement.
 *     All setting IDs are unchanged, so existing saved values are kept.
 *
 * 1.3.5 — 2025-06
 *   - FIXED main content hidden behind the fixed header: .site-main now has
 *     padding-top: var(--header-total-h, var(--header-height)); JS measures
 *     the real header height on load/scroll/resize and exposes it as the
 *     --header-total-h CSS variable. Hero min-height adjusted via calc() so
 *     it no longer overflows the viewport.
 *   - .hero-head: removed top & bottom padding.
 *   - .hero-inner: removed padding-bottom.
 *   - .hero-title: font-size fixed at 3.25rem, line-height removed,
 *     margin-bottom 10px, overflow-wrap removed (word-wrap + hyphens kept).
 *   - .hero-slider-controls: margin-top 10px, height max-content, padding.
 *
 * 1.3.4 — 2025-06
 *   - .hero-head now always full width (min-width:100%; max-width:100%),
 *     removing the previous 22ch cap so the title spans the hero.
 *
 * 1.3.3 — 2025-06
 *   - Hero title moved OUTSIDE .hero-content into a full-width .hero-head
 *     above the two columns; added overflow-wrap / hyphens so long titles
 *     wrap cleanly instead of overflowing.
 *   - Hero slider controls moved BELOW the image (inside new .hero-media
 *     wrapper); prev/next + dots restyled for the light background and
 *     centered under the slider.
 *   - Hero CTA buttons (.hero-actions) now stay on one line (flex-nowrap,
 *     btn white-space:nowrap); wrap only on screens ≤1024px.
 *   - service-card__body padding normalised to a uniform var(--sp-6).
 *
 * 1.3.2 — 2025-06
 *   - FIXED Services & Testimonials not displaying: helper functions now
 *     return demo/fallback content when nothing is configured, so the
 *     sections are visible on a fresh install (and vanish once real
 *     pages / reviews are added).
 *   - FIXED hero slider not sliding: the image column itself is now the
 *     slider track (.hero-slide elements cross-fade via .is-active);
 *     JS updated to target .hero-slide. Removed dead .hero-slide-bg layer.
 *   - Hero image column widened (grid 0.85fr / 1.15fr, aspect-ratio 3/2).
 *   - Services section spacing aligned with Blog section (intro max-width
 *     820px, grid gap --sp-8, header margin clamp like .blog-header).
 *   - Nav menu item font size increased from 14px to 16px (--fs-base).
 *
 * 1.3.1 — 2025-06  (critical bug-fix release)
 *   - FIXED fatal "critical error": front-page.php was missing the closing
 *     ?> tag after get_header(), causing PHP to parse the <main> HTML as
 *     code (syntax error, unexpected '<'). Added the closing tag.
 *   - FIXED earlier fatal: unescaped apostrophe in a single-quoted string
 *     in customizer-pages.php ("the page's own") — replaced with entity.
 *   - Validated every PHP file with a real PHP 8 parser (php-parser),
 *     confirmed zero syntax errors, zero duplicate function definitions,
 *     all template parts / includes / assets / sanitize callbacks resolve.
 *   - Version header in front-page.php corrected (was stale at 1.2.0).
 *
 * 1.3.0 — 2025-06
 *   - Footer Note bar: Customizer-controlled acknowledgement text + images
 *     (image height/width), defaults to Acknowledgement of Country text
 *     with Aboriginal, Torres Strait Islander & LGBTIQ+ flag images
 *   - Breadcrumb: global disable toggle in Footer Customizer section
 *   - Page header: per-page customizable via custom fields (height, width,
 *     bg image, bg colour, overlay, disable flag)
 *   - Page subtitle: custom field _verve_page_subtitle shown below H1
 *   - Page CTA button: forced #contact link below subtitle on all pages
 *   - page.php sequence: header-bar → page-header → H1 → subtitle → CTA
 *     → featured-image + content (left/right two-column)
 *   - Admin: removed contact form plugin recommendations; own plugin assumed
 *   - Admin: new Accessibility Settings tab (font-size scale, contrast mode,
 *     motion reduce, dyslexia font, focus ring toggle)
 *   - Frontend: accessibility toolbar widget (keyboard-togglable)
 *
 * 1.2.0 — 2025-06
 *   - Theme zip filename includes version: verve-care-theme-1.2.0.zip
 *   - Header: logo pinned to left; nav + CTA pinned to right
 *   - Header topbar (phone, CTA label+URL) displayed ABOVE header-inner
 *     with its own slim bar, only rendered when values are set
 *   - Banner slider: fixed JS autoplay, prev/next arrows, dots wired correctly
 *   - Services: tabbed layout (tabs across top, active tab shows cards);
 *     each card can link to a Services page and shows featured image
 *   - Testimonials: source toggle — "manual" (Customizer) or "google"
 *     (Google Places API via embed shortcode or Place ID)
 *   - Every front-page section: individual bg colour + bg image controls
 *     in Customizer; inline style injected per section
 *   - Footer Column 1: logo, NDIS badge, tagline, and socials fully removed
 *     from the brand block in Column 1; Column 1 is now a pure widget area
 *   - Footer: new social media bar between footer-main and footer-bottom
 *
 * 1.1.0 — 2025-06
 *   - Added theme screenshot (screenshot.png) per WP standard (1200×900)
 *   - Footer Column 1: Logo, NDIS badge, tagline & social links are the
 *     single source of truth — brand block removed from all other locations
 *   - Footer Columns 2–4: pure widget areas, zero fallback / default content
 *   - Footer list bullets now inherit the footer text colour via
 *     var(--footer-text) on ::marker; no more browser-default black dots
 *   - Footer typography & colours: full Customizer control via CSS custom
 *     properties (body font, heading font, weight, size, transform, spacing,
 *     link colour, hover colour, link underline toggle, bottom bar palette)
 *   - Footer logo: separate max-width control in Customizer Site Identity
 *   - Widget / menu titles: "Hide titles" toggle (screen-reader-only fallback)
 *   - Inline SVG social icons (no font dependency)
 *   - Version constant bumped to 1.1.0 in functions.php & style.css
 *
 * 1.0.0 — Initial release
 *   - Full theme scaffold: header, footer, front-page, single, page templates
 *   - Customizer panels: General, Header, Front Page (5 sections), Footer
 *   - Shortcodes, admin options page, editor styles, JS slider/menu/scroll
 * ──────────────────────────────────────────────────────────────────────────
 */

/* ============================================================
   TABLE OF CONTENTS
   1. CSS Custom Properties (Design Tokens)
   2. Reset & Base
   3. Typography
   4. Layout Utilities
   5. Header & Navigation
   6. Hero / Banner
   7. Services Section
   8. Testimonials Section
   9. Blog Section
   10. Contact Section
   11. Footer
   12. Buttons & CTAs
   13. Forms
   14. WordPress Core Classes
   15. Accessibility
   16. Print
============================================================ */

/* ============================================================
   1. CSS Custom Properties
============================================================ */
:root {
  /* Brand Colours */
  --clr-primary:      #3A7CA5;   /* Trustworthy blue */
  --clr-primary-dark: #2C5F7A;
  --clr-secondary:    #6BBF87;   /* Warm supportive green */
  --clr-accent:       #F4A261;   /* Warm amber accent */
  --clr-bg:           #FAFAF8;   /* Warm off-white */
  --clr-bg-alt:       #F0EEE9;   /* Subtle warm grey */
  --clr-text:         #2D2D2D;   /* Near-black for readability */
  --clr-text-muted:   #6B6B6B;
  --clr-white:        #FFFFFF;
  --clr-border:       #DDD9D3;

  /* Typography */
  --font-display: 'Poppins', system-ui, sans-serif;
  --font-body:    'Inter', system-ui, sans-serif;

  --fs-xs:   0.75rem;   /* 12px */
  --fs-sm:   0.875rem;  /* 14px */
  --fs-base: 1rem;      /* 16px */
  --fs-md:   1.125rem;  /* 18px */
  --fs-lg:   1.25rem;   /* 20px */
  --fs-xl:   1.5rem;    /* 24px */
  --fs-2xl:  2rem;      /* 32px */
  --fs-3xl:  2.5rem;    /* 40px */
  --fs-4xl:  3.25rem;   /* 52px */

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semi:    600;
  --fw-bold:    700;

  --lh-tight:  1.2;
  --lh-snug:   1.4;
  --lh-normal: 1.65;
  --lh-loose:  1.8;

  /* Spacing */
  --sp-1:  0.25rem;
  --sp-2:  0.5rem;
  --sp-3:  0.75rem;
  --sp-4:  1rem;
  --sp-6:  1.5rem;
  --sp-8:  2rem;
  --sp-10: 2.5rem;
  --sp-12: 3rem;
  --sp-16: 4rem;
  --sp-20: 5rem;
  --sp-24: 6rem;

  /* Layout */
  --container-max: 1160px;
  --container-pad: clamp(1rem, 5vw, 2.5rem);

  /* Borders & Shadows */
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  16px;
  --radius-xl:  24px;
  --radius-pill: 999px;

  --shadow-sm:  0 1px 3px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.05);
  --shadow-md:  0 4px 12px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.06);
  --shadow-lg:  0 12px 32px rgba(0,0,0,.10), 0 4px 12px rgba(0,0,0,.06);

  /* Transitions */
  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   400ms ease;

  /* Header */
  --header-height: 80px;
}

/* ============================================================
   2. Reset & Base
============================================================ */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 100%;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-body);
  font-size: var(--fs-base);
  font-weight: var(--fw-regular);
  line-height: var(--lh-normal);
  color: var(--clr-text);
  background-color: var(--clr-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Offset main content so it is not hidden behind the fixed header.
   Only when the sticky header is enabled (otherwise the header is in
   normal flow and needs no offset). JS sets --header-total-h to the real
   measured height; the fallback covers pre-JS / no-JS. */
.sticky-header-enabled .site-main {
  padding-top: var(--header-total-h, var(--header-height));
}

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

a {
  color: var(--clr-primary);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color var(--transition-fast);
}

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

ul, ol {
  padding-left: var(--sp-6);
}

li {
  margin-bottom: var(--sp-1);
}

table {
  border-collapse: collapse;
  width: 100%;
}

hr {
  border: none;
  border-top: 1px solid var(--clr-border);
  margin: var(--sp-8) 0;
}

/* ============================================================
   3. Typography
============================================================ */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
  color: var(--clr-text);
  margin-bottom: var(--sp-4);
}

h1 { font-size: clamp(var(--fs-2xl), 5vw, var(--fs-4xl)); }
h2 { font-size: clamp(var(--fs-xl), 3.5vw, var(--fs-3xl)); }
h3 { font-size: clamp(var(--fs-lg), 2.5vw, var(--fs-2xl)); }
h4 { font-size: var(--fs-xl); }
h5 { font-size: var(--fs-lg); }
h6 { font-size: var(--fs-md); }

p {
  margin-bottom: var(--sp-4);
  max-width: 70ch;
}

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

.text-lead {
  font-size: var(--fs-md);
  line-height: var(--lh-loose);
  color: var(--clr-text-muted);
}

.eyebrow {
  display: inline-block;
  font-family: var(--font-display);
  font-size: var(--fs-xs);
  font-weight: var(--fw-semi);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--clr-secondary);
  margin-bottom: var(--sp-3);
}

.section-heading {
  font-size: clamp(var(--fs-xl), 3vw, var(--fs-3xl));
  font-weight: var(--fw-bold);
  line-height: var(--lh-snug);
  margin-bottom: var(--sp-3);
}

.section-subheading {
  font-size: var(--fs-md);
  color: var(--clr-text-muted);
  line-height: var(--lh-loose);
  max-width: 58ch;
}

/* ============================================================
   4. Layout Utilities
============================================================ */
.container {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}

.container--narrow {
  max-width: 760px;
}

.container--wide {
  max-width: 1320px;
}

.section-pad {
  padding-block: clamp(var(--sp-8), 5vw, var(--sp-16));
}

.section-pad--sm {
  padding-block: clamp(var(--sp-6), 3.5vw, var(--sp-12));
}

.grid {
  display: grid;
  gap: var(--sp-8);
}

.grid--2 { grid-template-columns: repeat(2, 1fr); }
.grid--3 { grid-template-columns: repeat(3, 1fr); }
.grid--4 { grid-template-columns: repeat(4, 1fr); }

.flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

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

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border-width: 0;
}

/* ============================================================
   5. Header & Navigation  (v1.2.0)
   Structure:
     .site-header
       .header-topbar   — slim bar above (phone + CTA) — only when set
       .header-main-row — logo LEFT · nav + hamburger RIGHT
         .header-inner
           .site-logo
           .header-right
             .main-navigation
             .menu-toggle
============================================================ */

.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background-color: var(--clr-white);
  border-bottom: 1px solid transparent;
  transition: border-color var(--transition-base),
              box-shadow var(--transition-base),
              background-color var(--transition-base);
}

/* When sticky is disabled, the header scrolls away with the page */
.site-header:not(.is-sticky) {
  position: relative;
}

.site-header.scrolled,
.site-header.is-scrolled {
  border-color: var(--clr-border);
  box-shadow: var(--shadow-sm);
}

/* ── Topbar: phone + CTA above the main row ──────────────── */
.header-topbar {
  background: var(--clr-primary);
  color: #fff;
  font-size: 0.8rem;
  padding-block: 6px;
}

.header-topbar__inner {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--sp-5);
}

.header-topbar__phone {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(255,255,255,.9);
  text-decoration: none;
  font-weight: 500;
  transition: color var(--transition-fast);
}
.header-topbar__phone:hover { color: #fff; }

.header-topbar__cta {
  /* inherits .btn .btn--accent .btn--sm from buttons section */
  padding: 4px 14px !important;
  font-size: 0.78rem !important;
}

/* ── Main header row ─────────────────────────────────────── */
.header-main-row {
  /* height set dynamically; falls back to token */
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;  /* logo LEFT, right-group RIGHT */
  height: var(--header-height);
  gap: var(--sp-6);
}

/* Logo always pinned to the left */
.site-logo {
  flex-shrink: 0;
  text-decoration: none;
  /* max-width set by Customizer via verve_footer_dynamic_css() */
}

.site-logo img,
.site-logo .custom-logo {
  max-width: var(--header-logo-max-w, 200px);
  max-height: var(--header-logo-max-h, 72px);
  width: auto;
  height: auto;
  display: block;
}

.site-logo__text {
  font-family: var(--font-display);
  font-size: var(--fs-lg);
  font-weight: var(--fw-bold);
  color: var(--clr-primary);
  text-decoration: none;
  line-height: 1;
}
.site-logo__text span { color: var(--clr-secondary); }

/* Right group: nav + toggle */
.header-right {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  margin-left: auto;
}

/* Primary Navigation */
.main-navigation {
  display: flex;
  align-items: center;
}

.main-navigation ul {
  display: flex;
  align-items: center;
  gap: var(--sp-6);
  list-style: none;
  padding: 0;
  margin: 0;
}

.main-navigation a {
  font-family: var(--font-display);
  font-size: var(--fs-base);
  font-weight: var(--fw-medium);
  color: var(--clr-text);
  text-decoration: none;
  padding: var(--sp-2) 0;
  position: relative;
  transition: color var(--transition-fast);
}

.main-navigation a::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--clr-secondary);
  border-radius: var(--radius-pill);
  transition: width var(--transition-base);
}

.main-navigation a:hover,
.main-navigation .current-menu-item > a { color: var(--clr-primary); }
.main-navigation a:hover::after,
.main-navigation .current-menu-item > a::after { width: 100%; }

/* Dropdown */
.main-navigation ul ul {
  position: absolute;
  top: calc(100% + var(--sp-2));
  left: 0;
  flex-direction: column;
  gap: 0;
  background: var(--clr-white);
  border: 1px solid var(--clr-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
  min-width: 220px;
  padding: var(--sp-2) 0;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-8px);
  transition: opacity var(--transition-fast), transform var(--transition-fast);
}
.main-navigation li { position: relative; margin: 0; }
.main-navigation li:hover > ul,
.main-navigation li:focus-within > ul {
  opacity: 1; pointer-events: auto; transform: translateY(0);
}
.main-navigation ul ul a { display: block; padding: var(--sp-3) var(--sp-6); font-size: var(--fs-sm); white-space: nowrap; }
.main-navigation ul ul a::after { display: none; }

/* Hamburger */
.menu-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: var(--sp-2);
  background: none;
  border: 1px solid var(--clr-border);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background-color var(--transition-fast);
  flex-shrink: 0;
}
.menu-toggle:hover { background-color: var(--clr-bg-alt); }
.menu-toggle span {
  display: block;
  width: 24px;            /* explicit width — iOS Safari won't stretch 0-width bars */
  height: 2px;
  background: var(--clr-text);
  border-radius: var(--radius-pill);
  transition: transform var(--transition-base), opacity var(--transition-base);
}
.menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ============================================================
   6. Hero / Banner
============================================================ */
.hero-section {
  position: relative;
  min-height: calc(70vh - var(--header-total-h, var(--header-height)));
  display: grid;
  align-items: center;
  overflow: hidden;
  background: linear-gradient(135deg, #E8F4F8 0%, #F0EEE9 60%, #EAF4ED 100%);
}

.hero-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('assets/images/hero-pattern.svg') center/cover no-repeat;
  opacity: 0.04;
  pointer-events: none;
}

.hero-inner {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr; /* wider image column on the right */
  gap: var(--sp-12);
  align-items: center;
}

/* Full-width head: eyebrow + title above the two columns */
.hero-head {
  position: relative;
  z-index: 1;
  min-width: 100%;
  max-width: 100%;
}

.hero-head .eyebrow {
  margin-bottom: var(--sp-4);
}

.hero-content {
  position: relative;
  z-index: 1;
}

.hero-title {
  font-size: 3.25rem;
  font-weight: var(--fw-bold);
  color: var(--clr-text);
  margin-bottom: 10px;
  word-wrap: break-word;
  hyphens: auto;
  max-width: 100%;
}

.hero-title em {
  font-style: normal;
  color: var(--clr-primary);
}

.hero-description {
  font-size: var(--fs-md);
  color: var(--clr-text-muted);
  line-height: var(--lh-loose);
  margin-bottom: var(--sp-8);
  max-width: 52ch;
}

/* CTA buttons stay on ONE line */
.hero-actions {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: var(--sp-4);
}

.hero-actions .btn {
  white-space: nowrap;
}

/* Right column wrapper: image + controls stacked vertically */
.hero-media {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* ── Image column = slider track ───────────────────────── */
.hero-image {
  position: relative;
  width: 100%;
  border-radius: var(--radius-xl);
  overflow: hidden;
  aspect-ratio: 3/2;          /* wider/larger image area */
  box-shadow: var(--shadow-lg);
  background: var(--clr-bg-alt);
}

/* Each slide is stacked and cross-faded */
.hero-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.8s ease, visibility 0.8s ease;
  z-index: 1;
}

.hero-slide.is-active {
  opacity: 1;
  visibility: visible;
  z-index: 2;
}

.hero-slide__img,
.hero-slide .hero-slide__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.hero-image--placeholder svg {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-image::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: -1px;
  right: -1px;
  height: 40%;
  background: linear-gradient(to top, rgba(58,124,165,.12), transparent);
  pointer-events: none;
  z-index: 3;
}

/* Slider controls: BELOW the image, centered */
.hero-slider-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-3);
  margin-top: 10px;
  height: max-content;
  padding-block: var(--sp-2);
}

.slider-dots {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
}

.slider-dot {
  width: 10px;
  height: 10px;
  border-radius: var(--radius-pill);
  background: var(--clr-border);
  border: 2px solid var(--clr-border);
  cursor: pointer;
  transition: width var(--transition-base), background var(--transition-base);
  padding: 0;
  flex-shrink: 0;
}

.slider-dot.is-active {
  width: 28px;
  background: var(--clr-primary);
  border-color: var(--clr-primary);
}

/* Prev / Next arrow buttons (below image, on light hero background) */
.hero-slider-prev,
.hero-slider-next {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--clr-white);
  border: 1.5px solid var(--clr-border);
  color: var(--clr-primary);
  cursor: pointer;
  box-shadow: var(--shadow-sm);
  transition: background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
  flex-shrink: 0;
}
.hero-slider-prev:hover,
.hero-slider-next:hover {
  background: var(--clr-primary);
  border-color: var(--clr-primary);
  color: var(--clr-white);
}

/* Section background overlay (data-bg-overlay) */
[data-bg-overlay]::before {
  content: '';
  position: absolute;
  inset: 0;
  background: #000;
  opacity: var(--section-overlay, 0);
  pointer-events: none;
  z-index: 0;
}

/* JS sets --section-overlay from data-bg-overlay */

/* ============================================================
   7. Services Section  (v1.3.0 — page-based grid)
============================================================ */
.services-section {
  background: var(--clr-white);
}

/* Match the Blog section's intro spacing pattern */
.services-intro {
  text-align: center;
  max-width: 820px;                                   /* wider intro */
  margin-inline: auto;
  margin-bottom: clamp(var(--sp-10), 5vw, var(--sp-16)); /* same as .blog-header */
}

.services-intro .services-heading {
  margin-bottom: var(--sp-4);
}

.services-intro .services-subheading {
  max-width: 680px;
  margin-inline: auto;
  margin-bottom: 0;
}

/* ── Column grid variants ──────────────────────────────── */
.services-grid {
  display: grid;
  gap: var(--sp-8);   /* match Blog section grid gap */
}
.services-grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
.services-grid--cols-3 { grid-template-columns: repeat(3, 1fr); }  /* default */
.services-grid--cols-4 { grid-template-columns: repeat(4, 1fr); }

/* ── Individual service card ───────────────────────────── */
.service-card--page {
  background: var(--clr-bg, #FAFAF8);
  border: 1px solid var(--clr-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform var(--transition-base), box-shadow var(--transition-base);
  position: relative;
}

.service-card--page:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
}

/* Accent left-border on hover */
.service-card--page::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 4px; height: 0;
  background: var(--clr-secondary);
  transition: height var(--transition-slow);
  z-index: 1;
}
.service-card--page:hover::before { height: 100%; }

/* Thumbnail */
.service-card__thumb-link { display: block; overflow: hidden; }

.service-card__thumb-wrap {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--clr-bg-alt);
}

.service-card__thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.4s ease;
}
.service-card--page:hover .service-card__thumb { transform: scale(1.04); }

.service-card__thumb-wrap--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
}
.service-card__thumb-wrap--placeholder svg { width: 100%; height: auto; display: block; }

/* Card body */
.service-card__body {
  padding: var(--sp-6);
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  flex: 1;
}

.service-card__title {
  font-family: var(--font-display);
  font-size: var(--fs-base);
  font-weight: var(--fw-semi);
  line-height: var(--lh-snug);
  margin: 0;
}
.service-card__title a {
  color: var(--clr-text);
  text-decoration: none;
  transition: color var(--transition-fast);
}
.service-card__title a:hover { color: var(--clr-primary); }

.service-card__description {
  font-size: var(--fs-sm);
  color: var(--clr-text-muted);
  line-height: var(--lh-loose);
  margin: 0;
  flex: 1;
  /* Limit to 3 lines */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.service-card__link-label {
  font-size: var(--fs-sm);
  font-weight: var(--fw-semi);
  color: var(--clr-primary);
  text-decoration: none;
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: gap var(--transition-fast);
}
.service-card--page:hover .service-card__link-label { gap: 8px; }

/* "View All" button row */
.services-view-all {
  display: flex;
  justify-content: center;
  margin-top: var(--sp-12);
}

/* ── Responsive ────────────────────────────────────────── */
@media (max-width: 900px) {
  .services-grid--cols-4 { grid-template-columns: repeat(2, 1fr); }
  .services-grid--cols-3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .services-grid--cols-2,
  .services-grid--cols-3,
  .services-grid--cols-4 { grid-template-columns: 1fr; }
}


/* ============================================================
   8. Testimonials Section  (v1.2.0 — manual + Google modes)
============================================================ */
.testimonials-section {
  background: var(--clr-primary);
  position: relative;
  overflow: hidden;
}

/* Dark overlay for bg image (applied via .testimonials-section__overlay) */
.testimonials-section__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0);
  pointer-events: none;
  z-index: 0;
}

/* Decorative circles */
.testimonials-section::before {
  content: '';
  position: absolute;
  top: -60px; right: -60px;
  width: 320px; height: 320px;
  border-radius: 50%;
  background: rgba(255,255,255,.04);
  pointer-events: none;
}
.testimonials-section::after {
  content: '';
  position: absolute;
  bottom: -80px; left: -40px;
  width: 240px; height: 240px;
  border-radius: 50%;
  background: rgba(255,255,255,.03);
  pointer-events: none;
}

.testimonials-header {
  text-align: center;
  margin-bottom: clamp(var(--sp-10), 5vw, var(--sp-14));
  position: relative;
  z-index: 1;
}
.testimonials-header .section-heading { color: var(--clr-white); }
.testimonials-header .eyebrow { color: var(--clr-accent); }

/* Google link in header */
.testimonials-google-link {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  margin-top: var(--sp-4);
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  color: rgba(255,255,255,.85);
  text-decoration: none;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: var(--radius-pill);
  padding: var(--sp-2) var(--sp-5);
  transition: background var(--transition-fast), color var(--transition-fast);
}
.testimonials-google-link:hover {
  background: rgba(255,255,255,.12);
  color: #fff;
}

/* Manual grid */
.testimonials-track-wrap { position: relative; z-index: 1; }

.testimonials-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: var(--sp-6);
}

.testimonial-card {
  background: rgba(255,255,255,.08);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-lg);
  padding: var(--sp-8);
  display: flex;
  flex-direction: column;
  gap: var(--sp-5);
}

.testimonial-card__quote {
  font-size: var(--fs-md);
  color: rgba(255,255,255,.92);
  line-height: var(--lh-loose);
  font-style: italic;
  position: relative;
  padding-left: var(--sp-6);
  margin: 0;
}
.testimonial-card__quote::before {
  content: '\201C';
  position: absolute;
  left: 0; top: -4px;
  font-size: var(--fs-3xl);
  color: var(--clr-accent);
  font-style: normal;
  line-height: 1;
}

.testimonial-card__author {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  margin-top: auto;
}

.testimonial-card__avatar {
  width: 48px; height: 48px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 2px solid rgba(255,255,255,.3);
}
.testimonial-card__avatar--initials {
  background: var(--clr-secondary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-weight: var(--fw-bold);
  font-size: var(--fs-sm);
  color: #fff;
}

.testimonial-card__name {
  font-family: var(--font-display);
  font-weight: var(--fw-semi);
  color: var(--clr-white);
  font-size: var(--fs-sm);
  margin: 0 0 var(--sp-1) 0;
}
.testimonial-card__role {
  font-size: var(--fs-xs);
  color: rgba(255,255,255,.6);
  margin: 0;
}

.testimonial-stars {
  display: flex;
  gap: 2px;
  color: var(--clr-accent);
  font-size: var(--fs-sm);
}

/* Google CTA card (when embed not provided) */
.testimonials-google-cta {
  display: flex;
  justify-content: center;
  position: relative;
  z-index: 1;
}
.testimonials-google-cta__card {
  background: rgba(255,255,255,.1);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: var(--radius-xl);
  padding: var(--sp-12) var(--sp-16);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-5);
  max-width: 420px;
}
.testimonials-google-cta__logo { display: flex; justify-content: center; }
.testimonials-google-cta__card p {
  color: rgba(255,255,255,.85);
  font-size: var(--fs-md);
  margin: 0;
}

/* Google embed wrapper */
.testimonials-google-embed {
  position: relative;
  z-index: 1;
}

/* Setup notice */
.testimonials-setup-notice {
  text-align: center;
  color: rgba(255,255,255,.6);
  font-size: var(--fs-sm);
  position: relative;
  z-index: 1;
}

/* ============================================================
   9. Blog Section
============================================================ */
.blog-section {
  background: var(--clr-bg-alt);
}

.blog-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--sp-6);
  margin-bottom: clamp(var(--sp-10), 5vw, var(--sp-16));
  flex-wrap: wrap;
}

.blog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: var(--sp-8);
}

.blog-card {
  background: var(--clr-white);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  transition: transform var(--transition-base), box-shadow var(--transition-base);
}

.blog-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
  text-decoration: none;
  color: inherit;
}

.blog-card__thumb {
  aspect-ratio: 16/9;
  overflow: hidden;
}

.blog-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition-slow);
}

.blog-card:hover .blog-card__thumb img {
  transform: scale(1.04);
}

.blog-card__body {
  padding: var(--sp-6);
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}

.blog-card__category {
  font-size: var(--fs-xs);
  font-weight: var(--fw-semi);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--clr-secondary);
  text-decoration: none;
}

.blog-card__title {
  font-family: var(--font-display);
  font-size: var(--fs-lg);
  font-weight: var(--fw-semi);
  line-height: var(--lh-snug);
  color: var(--clr-text);
  margin-bottom: 0;
}

.blog-card:hover .blog-card__title {
  color: var(--clr-primary);
}

.blog-card__excerpt {
  font-size: var(--fs-sm);
  color: var(--clr-text-muted);
  line-height: var(--lh-loose);
  flex-grow: 1;
  margin-bottom: 0;
  max-width: none;
}

.blog-card__meta {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  font-size: var(--fs-xs);
  color: var(--clr-text-muted);
  margin-top: var(--sp-2);
  padding-top: var(--sp-4);
  border-top: 1px solid var(--clr-border);
}

/* ============================================================
   10. Contact Section
============================================================ */
.contact-section {
  background: var(--clr-white);
}

.contact-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(var(--sp-10), 6vw, var(--sp-20));
  align-items: start;
}

.contact-content .section-heading {
  margin-bottom: var(--sp-4);
}

.contact-details {
  display: flex;
  flex-direction: column;
  gap: var(--sp-6);
  margin-top: var(--sp-8);
}

.contact-item {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-4);
}

.contact-item__icon {
  width: 44px;
  height: 44px;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, var(--clr-primary), var(--clr-primary-dark));
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--clr-white);
  font-size: var(--fs-base);
}

.contact-item__label {
  font-size: var(--fs-xs);
  font-weight: var(--fw-semi);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--clr-text-muted);
  margin-bottom: var(--sp-1);
}

.contact-item__value {
  font-size: var(--fs-base);
  font-weight: var(--fw-medium);
  color: var(--clr-text);
}

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

.contact-item__value a:hover {
  color: var(--clr-primary);
}

.contact-map {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
  border: 1px solid var(--clr-border);
}

.contact-map iframe,
.contact-map .map-embed {
  display: block;
  width: 100%;
  min-height: 420px;
  border: none;
}

.contact-form-wrap {
  margin-top: var(--sp-8);
}

/* ============================================================
   11. Footer
============================================================ */
/* ──────────────────────────────────────────────────────────────────
   11. Footer  (v1.1.0)
   Structural layout only. All colours, fonts, and sizes come from
   CSS custom properties written by verve_footer_dynamic_css() in
   inc/customizer/customizer-footer.php at runtime.
────────────────────────────────────────────────────────────────── */

/* ── Default custom-property fallbacks ────────────────────────── */
.site-footer {
  --footer-bg:               #1A2B38;
  --footer-text:             #B0BEC5;
  --footer-heading:          #FFFFFF;
  --footer-link:             #B0BEC5;
  --footer-link-hover:       #FFFFFF;
  --footer-bottom-bg:        #111C24;
  --footer-bottom-text:      #6B7E8A;
  --footer-social:           #B0BEC5;
  --footer-social-hover:     #FFFFFF;
  --footer-body-font:        inherit;
  --footer-body-size:        14px;
  --footer-body-weight:      400;
  --footer-line-height:      1.7;
  --footer-heading-font:     inherit;
  --footer-heading-size:     14px;
  --footer-heading-weight:   700;
  --footer-heading-transform: uppercase;
  --footer-heading-spacing:  0.08em;
  --footer-link-decoration:  none;
  background-color: var(--footer-bg);
  color: var(--footer-text);
  font-family: var(--footer-body-font);
  font-size: var(--footer-body-size);
  font-weight: var(--footer-body-weight);
  line-height: var(--footer-line-height);
}

/* ── Main wrapper ──────────────────────────────────────────────── */
.footer-main {
  padding-block: clamp(var(--sp-12), 6vw, var(--sp-20));
  border-bottom: 1px solid rgba(255,255,255,.06);
}

/* ── Column grid ───────────────────────────────────────────────── */
.footer-columns {
  display: grid;
  gap: var(--sp-10);
  align-items: start;
}
.footer-columns--1 { grid-template-columns: 1fr; }
.footer-columns--2 { grid-template-columns: repeat(2, 1fr); }
.footer-columns--3 { grid-template-columns: repeat(3, 1fr); }
.footer-columns--4 { grid-template-columns: repeat(4, 1fr); }

/* ── Column 1: Brand block ─────────────────────────────────────── */
/* Order: Logo → NDIS Badge → Tagline → Social links */
.footer-col--brand {
  display: flex;
  flex-direction: column;
  gap: var(--sp-5);       /* uniform spacing between every brand item */
}

/* Logo link wrapper */
.footer-logo-link {
  display: inline-block;
  text-decoration: none;
  line-height: 1;
  flex-shrink: 0;
}

/* Logo — image */
.footer-logo-img {
  display: block;
  width: auto;
  height: auto;
  /* max-width set inline by Customizer via verve_footer_dynamic_css() */
}

/* Logo — text fallback */
.footer-logo-text {
  font-family: var(--font-display);
  font-size: var(--fs-xl);
  font-weight: var(--fw-bold);
  color: var(--footer-heading);
  display: block;
}
.footer-logo-text__accent { color: var(--clr-secondary); }

/* NDIS Badge */
.footer-badge {
  display: inline-flex;
  align-items: center;
}
.footer-badge__img {
  display: block;
  max-height: 70px;
  width: auto;
}
.footer-badge__text {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--footer-heading);
  border: 1.5px solid rgba(255,255,255,.3);
  border-radius: 4px;
  padding: 4px 10px;
}

/* Tagline */
.footer-tagline {
  color: var(--footer-text);
  font-family: var(--footer-body-font);
  font-size: var(--footer-body-size);
  line-height: var(--footer-line-height);
  max-width: 36ch;
  margin: 0;
}

/* Social icons row */
.footer-social {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2);
}
.footer-social__link {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-sm);
  background: rgba(255,255,255,.06);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--footer-social);
  text-decoration: none;
  transition: background var(--transition-fast), color var(--transition-fast);
  flex-shrink: 0;
}
.footer-social__link:hover,
.footer-social__link:focus-visible {
  background: rgba(255,255,255,.16);
  color: var(--footer-social-hover);
  outline: 2px solid var(--footer-social-hover);
  outline-offset: 2px;
}
.footer-social__link svg { display: block; }

/* Optional widget area inside brand column */
.footer-col__widgets { margin-top: var(--sp-2); }

/* ── Columns 2–4: Widget area content ─────────────────────────── */
.footer-col .widget {
  margin-bottom: var(--sp-6);
}
.footer-col .widget:last-child { margin-bottom: 0; }

/* Widget & section headings */
.site-footer .widget-title,
.site-footer .widgettitle,
.site-footer .footer-col__title {
  color: var(--footer-heading);
  font-family: var(--footer-heading-font);
  font-size: var(--footer-heading-size);
  font-weight: var(--footer-heading-weight);
  text-transform: var(--footer-heading-transform);
  letter-spacing: var(--footer-heading-spacing);
  margin: 0 0 var(--sp-5) 0;
}

/* ── List bullets: inherit footer text colour ──────────────────── */
/*
 * By default browsers render list bullets in the text colour of the
 * nearest ancestor. We explicitly set ::marker so bullets always
 * match the footer text even if a widget resets colour internally.
 */
.site-footer ul,
.site-footer ol,
.site-footer .widget ul,
.site-footer .widget ol {
  padding-left: var(--sp-5);
  margin: 0 0 var(--sp-4) 0;
}
.site-footer li {
  margin-bottom: var(--sp-2);
  color: var(--footer-text);
}
.site-footer li::marker {
  color: var(--footer-text); /* bullets = text colour */
}

/* Nav / menu lists (no bullets, stacked links) */
.site-footer .widget ul.menu,
.site-footer .widget nav ul,
.site-footer .footer-menu {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}
/* Also strip bullets from any widget that renders a plain <ul> for links */
.site-footer .widget ul {
  list-style: none;
  padding: 0;
}
.site-footer .widget ul li::marker { content: none; }

/* All footer links */
.site-footer a,
.site-footer .widget a,
.site-footer .footer-menu a {
  color: var(--footer-link);
  text-decoration: var(--footer-link-decoration);
  transition: color var(--transition-fast);
  font-size: var(--footer-body-size);
}
.site-footer a:hover,
.site-footer .widget a:hover,
.site-footer .footer-menu a:hover {
  color: var(--footer-link-hover);
}

/* Paragraph text in widgets */
.site-footer p {
  color: var(--footer-text);
  font-family: var(--footer-body-font);
  font-size: var(--footer-body-size);
  line-height: var(--footer-line-height);
  margin-bottom: var(--sp-4);
}
.site-footer p:last-child { margin-bottom: 0; }

/* ── Bottom bar ────────────────────────────────────────────────── */
.footer-bottom-wrap {
  background-color: var(--footer-bottom-bg);
}

/* NDIS badge + copyright share one line (left side of the bottom bar) */
.footer-bottom__left {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  flex-wrap: wrap;
}
.footer-ndis-badge {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.footer-ndis-badge__img {
  /* max-width set inline from Customizer (default 90px) */
  height: auto;
  width: auto;
  display: block;
}

.footer-bottom {
  padding-block: var(--sp-6);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--sp-4);
}

/* Footer bottom alignment (badge + copyright group) */
.footer-bottom--align-left   { justify-content: flex-start; }
.footer-bottom--align-center { justify-content: center; }
.footer-bottom--align-right  { justify-content: flex-end; }

.footer-bottom--align-center .footer-bottom__left { justify-content: center; }
.footer-bottom--align-right  .footer-bottom__left { justify-content: flex-end; }
.footer-bottom--align-left   .footer-bottom__left { justify-content: flex-start; }

/* When centered or right-aligned, let the left group take full width so it
   centers/aligns nicely, and push legal links onto their own aligned row. */
.footer-bottom--align-center,
.footer-bottom--align-right {
  flex-direction: column;
  text-align: center;
}
.footer-bottom--align-right { text-align: right; }
.footer-bottom--align-center .footer-bottom__left,
.footer-bottom--align-right  .footer-bottom__left { width: 100%; }
.footer-copyright {
  color: var(--footer-bottom-text);
  font-size: var(--footer-body-size);
  font-family: var(--footer-body-font);
  margin: 0;
}
.footer-legal-links {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  list-style: none;
  padding: 0;
  margin: 0;
}
.footer-legal-links a {
  font-size: var(--footer-body-size);
  color: var(--footer-bottom-text);
  text-decoration: none;
  transition: color var(--transition-fast);
}
.footer-legal-links a:hover { color: var(--footer-link-hover); }

/* ── Social Bar (between footer-main and footer-bottom) ────── */
.footer-social-bar {
  /* background-color set by Customizer dynamic CSS */
  background-color: #162330;
  border-top: 1px solid rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.04);
}

.footer-social-bar__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-6);
  padding-block: var(--sp-4);
  flex-wrap: wrap;
}

.footer-social-bar__label {
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--footer-text);
  opacity: 0.7;
  margin-right: var(--sp-4); /* extra space after the label text */
}

.footer-social-bar__icons {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
}

.footer-social-bar__link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255,255,255,.07);
  color: var(--footer-social);
  text-decoration: none;
  transition: background var(--transition-fast), color var(--transition-fast), transform var(--transition-fast);
}
.footer-social-bar__link:hover,
.footer-social-bar__link:focus-visible {
  background: rgba(255,255,255,.18);
  color: var(--footer-social-hover);
  transform: translateY(-2px);
  outline: 2px solid var(--footer-social-hover);
  outline-offset: 2px;
}
.footer-social-bar__link svg { display: block; }

/* ============================================================
   11b. Footer Note Bar  (v1.3.0)
============================================================ */
.footer-note-bar {
  /* colours from Customizer dynamic CSS */
  background-color: #0F1A22;
  color: #7A8F9B;
  padding-block: var(--sp-5);
  border-top: 1px solid rgba(255,255,255,.04);
}

.footer-note-bar__inner {
  display: flex;
  align-items: center;
  gap: var(--sp-6);
  flex-wrap: nowrap;
  padding: 10px 0px 10px 0px;
}

/* Images left (default) */
.footer-note-bar--images-left  .footer-note-bar__inner { flex-direction: row; }
/* Images right */
.footer-note-bar--images-right .footer-note-bar__inner { flex-direction: row-reverse; }
/* Stacked */
.footer-note-bar--stacked .footer-note-bar__inner { flex-direction: column; align-items: flex-start; gap: var(--sp-4); }
.footer-note-bar--stacked .footer-note-bar__text { width: 100%; }

.footer-note-bar__images {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  flex-shrink: 0;
  flex-wrap: wrap;
}

.footer-note-bar__flag {
  display: block;
  object-fit: contain;
  /* width/height set inline from Customizer values */
}

.footer-note-bar__text {
  font-size: 0.8125rem; /* fallback; overridden by Customizer inline size */
  line-height: 1.65;
  color: #7A8F9B;
  margin: 0;
  flex: 1 1 auto;       /* fill all remaining width */
  min-width: 0;         /* allow it to shrink and wrap instead of overflowing */
  width: 100%;
  max-width: fit-content;
}

.footer-note-bar__text p {
  margin-bottom: var(--sp-4);
  max-width: fit-content;
}
.footer-note-bar__text p:last-child {
  margin-bottom: 0;
}


/* ============================================================
   11c. Page Header Bar  (v1.3.0)
============================================================ */
.page-header-bar {
  position: relative;
  width: 100%;
  min-height: 200px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  /* height, bg-image, bg-color set inline from meta/Customizer */
}

.page-header-bar__overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.page-header-bar__breadcrumb {
  position: relative;
  z-index: 1;
  padding-bottom: var(--sp-5);
  width: 100%;
}

/* Breadcrumb colours inside header bar (on dark bg) */
.page-header-bar .breadcrumbs__item,
.page-header-bar .breadcrumbs__item::before {
  color: rgba(255,255,255,.65);
}
.page-header-bar .breadcrumbs__item a { color: rgba(255,255,255,.85); }
.page-header-bar .breadcrumbs__item a:hover { color: #fff; }
.page-header-bar .breadcrumbs__item--current { color: rgba(255,255,255,.5); }


/* ============================================================
   11d. Page Title Block  (H1 + subtitle + CTA)  (v1.3.0)
============================================================ */
.page-title-block {
  background: var(--clr-bg, #FAFAF8);
  padding-block: var(--sp-10) var(--sp-8);
  border-bottom: 1px solid var(--clr-border);
}

.page-title-block__title {
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  line-height: 1.2;
  margin: 0 0 var(--sp-3);
  color: var(--clr-text);
}

.page-title-block__subtitle {
  font-size: clamp(1rem, 2vw, 1.2rem);
  color: var(--clr-text-muted);
  line-height: 1.6;
  max-width: 70ch;
  margin: 0 0 var(--sp-6);
}

.page-title-block__cta {
  /* inherits .btn styles */
  margin-top: var(--sp-2);
}


/* ============================================================
   11e. Page Content Layout (featured image + content)  (v1.3.0)
============================================================ */
.page-content-wrap {
  padding-block: var(--sp-12);
}

/* Two-column: image left, content right */
.page-content-layout {
  display: grid;
  grid-template-columns: minmax(280px, 2fr) 3fr;
  gap: clamp(var(--sp-8), 5vw, var(--sp-16));
  align-items: start;
}

.page-content-layout__image {
  position: sticky;
  top: calc(var(--header-height, 80px) + var(--sp-6));
}

.page-featured-img {
  width: 100%;
  height: auto;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  display: block;
}

.page-content-layout__content.entry-content {
  max-width: 100%;
}

/* Full-width entry content (no featured image) */
.page-article > .entry-content {
  max-width: 100%;
}


/* ============================================================
   12. Buttons & CTAs
============================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  padding: 0.75em 1.75em;
  font-family: var(--font-display);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semi);
  line-height: 1.2;
  border-radius: var(--radius-pill);
  border: 2px solid transparent;
  text-decoration: none;
  cursor: pointer;
  transition: background-color var(--transition-fast),
              color var(--transition-fast),
              border-color var(--transition-fast),
              box-shadow var(--transition-fast),
              transform var(--transition-fast);
  white-space: nowrap;
  -webkit-appearance: none;
}

.btn:hover {
  transform: translateY(-1px);
  text-decoration: none;
}

.btn:active {
  transform: translateY(0);
}

.btn:focus-visible {
  outline: 3px solid var(--clr-accent);
  outline-offset: 3px;
}

/* Primary */
.btn--primary {
  background: var(--clr-primary);
  color: var(--clr-white);
  border-color: var(--clr-primary);
}

.btn--primary:hover {
  background: var(--clr-primary-dark);
  border-color: var(--clr-primary-dark);
  color: var(--clr-white);
  box-shadow: 0 8px 24px rgba(58,124,165,.35);
}

/* Secondary */
.btn--secondary {
  background: transparent;
  color: var(--clr-primary);
  border-color: var(--clr-primary);
}

.btn--secondary:hover {
  background: var(--clr-primary);
  color: var(--clr-white);
}

/* Accent */
.btn--accent {
  background: var(--clr-accent);
  color: var(--clr-white);
  border-color: var(--clr-accent);
}

.btn--accent:hover {
  background: #E08A45;
  border-color: #E08A45;
  color: var(--clr-white);
  box-shadow: 0 8px 24px rgba(244,162,97,.35);
}

/* Ghost (white) */
.btn--ghost-white {
  background: transparent;
  color: var(--clr-white);
  border-color: rgba(255,255,255,.5);
}

.btn--ghost-white:hover {
  background: var(--clr-white);
  color: var(--clr-primary);
  border-color: var(--clr-white);
}

/* Sizes */
.btn--sm {
  font-size: var(--fs-xs);
  padding: 0.6em 1.25em;
}

.btn--lg {
  font-size: var(--fs-md);
  padding: 0.9em 2.25em;
}

/* ============================================================
   13. Forms
============================================================ */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="search"],
input[type="number"],
textarea,
select {
  display: block;
  width: 100%;
  padding: 0.65em 1em;
  font-family: var(--font-body);
  font-size: var(--fs-base);
  color: var(--clr-text);
  background: var(--clr-white);
  border: 1.5px solid var(--clr-border);
  border-radius: var(--radius-md);
  outline: none;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
  appearance: none;
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--clr-primary);
  box-shadow: 0 0 0 3px rgba(58,124,165,.18);
}

textarea {
  min-height: 140px;
  resize: vertical;
  line-height: var(--lh-normal);
}

label {
  display: block;
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  margin-bottom: var(--sp-2);
  color: var(--clr-text);
}

/* ============================================================
   14. WordPress Core Classes
============================================================ */
.alignleft  { float: left; margin: 0 var(--sp-6) var(--sp-4) 0; }
.alignright { float: right; margin: 0 0 var(--sp-4) var(--sp-6); }
.aligncenter { display: block; margin-inline: auto; }
.alignwide  { width: calc(100% + 80px); margin-inline: -40px; }
.alignfull  { width: 100vw; margin-inline: calc(50% - 50vw); }

.wp-block-image img { border-radius: var(--radius-md); }

.entry-content > * + * { margin-top: var(--sp-4); }

.entry-content ul,
.entry-content ol {
  padding-left: var(--sp-8);
}

.entry-content blockquote {
  border-left: 4px solid var(--clr-primary);
  padding: var(--sp-4) var(--sp-6);
  background: var(--clr-bg-alt);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  font-style: italic;
  color: var(--clr-text-muted);
  margin-inline: 0;
}

.wp-caption-text, .gallery-caption {
  font-size: var(--fs-xs);
  color: var(--clr-text-muted);
  text-align: center;
  margin-top: var(--sp-2);
}

/* ============================================================
   15. Accessibility
============================================================ */
:focus-visible {
  outline: 3px solid var(--clr-accent);
  outline-offset: 3px;
  border-radius: var(--radius-sm);
}

.skip-link {
  position: absolute;
  top: -100%;
  left: var(--sp-4);
  z-index: 9999;
  background: var(--clr-primary);
  color: var(--clr-white);
  padding: var(--sp-3) var(--sp-6);
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  text-decoration: none;
  font-weight: var(--fw-semi);
  font-size: var(--fs-sm);
  transition: top var(--transition-fast);
}

.skip-link:focus {
  top: 0;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* High contrast override support */
@media (forced-colors: active) {
  .btn { forced-color-adjust: none; }
}

/* ============================================================
   16. Responsive
============================================================ */
@media (max-width: 1024px) {
  .hero-inner {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .hero-head {
    min-width: 100%;
    max-width: 100%;
    text-align: center;
    padding-bottom: var(--sp-6);
  }

  .hero-description { margin-inline: auto; }

  .hero-actions {
    justify-content: center;
    flex-wrap: wrap; /* allow wrapping on narrow screens */
  }

  .hero-media {
    max-width: 620px;
    margin-inline: auto;
    width: 100%;
  }

  .hero-image {
    width: 100%;
  }

  .contact-inner {
    grid-template-columns: 1fr;
  }

  .footer-columns--3,
  .footer-columns--4 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  :root { --header-height: 64px; }

  .menu-toggle { display: flex; position: relative; z-index: 1002; }

  /* Keep the header (logo + toggle) solid and above the menu panel
     so it stays visible on iOS when the menu is open. */
  .site-header {
    background-color: var(--clr-white);
    z-index: 1001;
  }

  /* Mobile nav slides in from the left, starting BELOW the header
     so the logo and close button remain visible and tappable. */
  .main-navigation {
    position: fixed;
    top: var(--header-total-h, var(--header-height));
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--clr-white);
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: var(--sp-6) var(--container-pad) var(--sp-10);
    gap: var(--sp-4);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    transform: translateX(-100%);
    transition: transform var(--transition-base);
    z-index: 1000;
    box-shadow: 0 12px 24px rgba(0,0,0,0.12);
  }

  .main-navigation.is-open { transform: translateX(0); }

  /* Dim the page behind the open menu */
  body.menu-open::after {
    content: '';
    position: fixed;
    inset: 0;
    top: var(--header-total-h, var(--header-height));
    background: rgba(0,0,0,0.35);
    z-index: 999;
  }

  /* Prevent body scroll bleed while menu is open */
  body.menu-open { overflow: hidden; }

  .main-navigation ul {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--sp-2);
    width: 100%;
  }

  .main-navigation a { font-size: var(--fs-lg); padding: var(--sp-3) 0; }

  .main-navigation ul ul {
    position: static;
    opacity: 1;
    pointer-events: auto;
    transform: none;
    box-shadow: none;
    border: none;
    padding: 0 0 0 var(--sp-6);
    background: transparent;
  }

  /* Topbar stacks below on mobile */
  .header-topbar__inner { justify-content: center; flex-wrap: wrap; gap: var(--sp-3); }

  .grid--2, .grid--3, .grid--4 { grid-template-columns: 1fr; }

  .services-tabs { overflow-x: auto; flex-wrap: nowrap; justify-content: flex-start; padding-bottom: var(--sp-1); }
  .services-tab  { flex-shrink: 0; }

  .blog-header { flex-direction: column; align-items: flex-start; }

  .footer-columns--2,
  .footer-columns--3,
  .footer-columns--4 { grid-template-columns: 1fr; }

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

  .hero-slider-prev,
  .hero-slider-next { width: 30px; height: 30px; }
}

/* ============================================================
   16. Print
============================================================ */
@media print {
  .site-header,
  .site-footer,
  .hero-section,
  .menu-toggle {
    display: none !important;
  }

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

  a { color: #000; }
  a[href]::after { content: ' (' attr(href) ')'; font-size: 0.8em; }
}

/* ============================================================
   Responsive — Page Header, Title Block, Content Layout, Note Bar
   (v1.3.0)
============================================================ */
@media (max-width: 900px) {
  /* Two-column content layout switches to stacked */
  .page-content-layout {
    grid-template-columns: 1fr;
  }
  .page-content-layout__image {
    position: static;
  }
}

@media (max-width: 768px) {
  .page-header-bar { min-height: 160px; }

  .page-title-block { padding-block: var(--sp-8) var(--sp-6); }

  .footer-note-bar__inner {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--sp-4);
  }

  .footer-note-bar--images-right .footer-note-bar__inner {
    flex-direction: column;
  }
}

/* ============================================================
   17. Site Features (v1.3.7) — back-to-top, preloader, progress
============================================================ */

/* ── Back to Top button ──────────────────────────────────── */
.verve-back-to-top {
  position: fixed;
  bottom: var(--sp-6);
  right: var(--sp-6);
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--clr-primary);
  color: #fff;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--shadow-md);
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity var(--transition-base), transform var(--transition-base), background var(--transition-fast);
  z-index: 900;
}
.verve-back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.verve-back-to-top:hover { background: var(--clr-primary-dark, #2d6089); }

/* ── Reading progress bar ────────────────────────────────── */
.verve-scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: transparent;
  z-index: 1100;
  pointer-events: none;
}
.verve-scroll-progress__bar {
  display: block;
  height: 100%;
  width: 0;
  background: var(--clr-primary);
  transition: width 0.1s linear;
}

/* ── Page preloader ──────────────────────────────────────── */
.verve-preloader {
  position: fixed;
  inset: 0;
  background: var(--clr-bg, #FAFAF8);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 99999;
  transition: opacity 0.4s ease, visibility 0.4s ease;
}
.verve-preloader.is-hidden {
  opacity: 0;
  visibility: hidden;
}
.verve-preloader__spinner {
  width: 44px;
  height: 44px;
  border: 4px solid var(--clr-border);
  border-top-color: var(--clr-primary);
  border-radius: 50%;
  animation: verve-spin 0.8s linear infinite;
}
@keyframes verve-spin {
  to { transform: rotate(360deg); }
}

@media (max-width: 768px) {
  .verve-back-to-top { bottom: var(--sp-4); right: var(--sp-4); width: 42px; height: 42px; }
}

/* ============================================================
   18. Header Bar / Announcement (v1.4.1)
============================================================ */
.verve-header-bar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1002;            /* above the fixed masthead */
  width: 100%;
  font-size: var(--fs-sm);
  /* notice-type colours set below; overridable inline */
}

/* When the announcement bar is present, push the sticky header down
   below it so both stay visible. --header-bar-h is set by JS. */
body:not(.no-header-bar) .site-header { top: var(--header-bar-h, 0px); }
.verve-header-bar__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-3);
  padding-block: 8px;
  position: relative;
}
.verve-header-bar__link,
.verve-header-bar__content {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  color: inherit;
  text-decoration: none;
  font-weight: var(--fw-medium);
}
.verve-header-bar__link:hover { color: inherit; opacity: 0.85; }
.verve-header-bar__link:hover .verve-header-bar__arrow { transform: translateX(3px); }
.verve-header-bar__arrow { transition: transform var(--transition-fast); }
.verve-header-bar__icon { flex-shrink: 0; }
.verve-header-bar__text { line-height: 1.3; }

.verve-header-bar__close {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: inherit;
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  opacity: 0.7;
  padding: 4px 8px;
}
.verve-header-bar__close:hover { opacity: 1; }

/* Notice-type colour presets */
.verve-header-bar--info    { background: #3A7CA5; color: #fff; }
.verve-header-bar--success { background: #2E7D52; color: #fff; }
.verve-header-bar--warning { background: #F4A261; color: #2D2D2D; }
.verve-header-bar--alert   { background: #C0392B; color: #fff; }
.verve-header-bar--neutral { background: #2D2D2D; color: #fff; }

.verve-header-bar.is-dismissed { display: none; }

@media (max-width: 768px) {
  .verve-header-bar { font-size: 0.8rem; }
  .verve-header-bar__inner { padding-inline: var(--sp-6); }
  .verve-header-bar__close { right: -4px; }
}
