/* =================================================================
   main.css

   CSS-only tokens and global styles.
   Colors, font-sizes, spacing and radius come from theme.json
   as --wp--preset--* / --wp--custom--* variables.

   1.  Tokens (:root)
   2.  WordPress Core utilities
   3.  Global styles & typography
   4.  Links
   5.  Buttons (.btn, .btn--*)
   6.  Images & Media
   7.  Header & Navbar
   8.  Footer
   9.  Header Section component
   10. Error 404
   11. Accessibility
   12. Scroll-to-top
   13. Media queries
   ================================================================= */

/* =================================================================
   1. Tokens (:root)
   Values not expressible in theme.json.
   ================================================================= */
:root {
  /* Semantic font aliases */
  --font-body: var(--wp--preset--font-family--primary);
  --font-heading: var(--wp--preset--font-family--primary);
  --font-display: var(--wp--preset--font-family--secondary);
  --font-mono: var(--wp--preset--font-family--monospace);

  /* fluid clamp values — not supported in theme.json */
  --flow-space: 1.5625rem;
  --column-gap: clamp(2.5rem, 2.5vw + 1.75rem, 3.75rem);
  --box-spacing: clamp(1rem, 2.5vw + 0.25rem, 2.25rem);
  --container-spacing: clamp(1rem, 2.5vw + 0.25rem, 2.25rem);
  --component-spacing: clamp(3rem, 6.5vw + 1.05rem, 6.25rem);

  /* Font weights */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  /* Line heights */
  --lh-tight: 1.2;
  --lh-base: 1.6;
  --lh-relaxed: 1.8;

  /* Letter spacing */
  --ls-base: 0;
  --ls-wide: 0.02em;
  --ls-wider: 0.03em;
  --ls-btn: 0.0225rem;

  /* status / semantic colors — not part of the theme.json palette */
  --color-success-50: #f0fdf4;
  --color-success-100: #dcfce7;
  --color-success-200: #bbf7d0;
  --color-success-300: #86efac;
  --color-success-400: #4ade80;
  --color-success-500: #22c55e;
  --color-success-600: #16a34a;
  --color-success-700: #15803d;
  --color-success-800: #166534;
  --color-success-900: #14532d;
  --color-success-950: #052e16;
  --color-success: var(--color-success-500);
  --color-success-light: var(--color-success-100);
  --color-success-dark: var(--color-success-700);

  --color-warning-50: #fffbeb;
  --color-warning-100: #fef3c7;
  --color-warning-200: #fde68a;
  --color-warning-300: #fcd34d;
  --color-warning-400: #fbbf24;
  --color-warning-500: #f59e0b;
  --color-warning-600: #d97706;
  --color-warning-700: #b45309;
  --color-warning-800: #92400e;
  --color-warning-900: #78350f;
  --color-warning-950: #451a03;
  --color-warning: var(--color-warning-500);
  --color-warning-light: var(--color-warning-100);
  --color-warning-dark: var(--color-warning-700);

  --color-error-50: #fef2f2;
  --color-error-100: #fee2e2;
  --color-error-200: #fecaca;
  --color-error-300: #fca5a5;
  --color-error-400: #f87171;
  --color-error-500: #ef4444;
  --color-error-600: #dc2626;
  --color-error-700: #b91c1c;
  --color-error-800: #991b1b;
  --color-error-900: #7f1d1d;
  --color-error-950: #450a0a;
  --color-error: var(--color-error-500);
  --color-error-light: var(--color-error-100);
  --color-error-dark: var(--color-error-700);

  --color-info-50: #f0f9ff;
  --color-info-100: #e0f2fe;
  --color-info-200: #bae6fd;
  --color-info-300: #7dd3fc;
  --color-info-400: #38bdf8;
  --color-info-500: #0ea5e9;
  --color-info-600: #0284c7;
  --color-info-700: #0369a1;
  --color-info-800: #075985;
  --color-info-900: #0c4a6e;
  --color-info-950: #082f49;
  --color-info: var(--color-info-500);
  --color-info-light: var(--color-info-100);
  --color-info-dark: var(--color-info-700);

  /* Border extras */
  --color-border-hover: #cccccc;

  /* button transition — not supported in theme.json */
  --transition-btn:
    background-color var(--wp--custom--motion--duration--base)
      var(--wp--custom--motion--easing--standard),
    color var(--wp--custom--motion--duration--base)
      var(--wp--custom--motion--easing--standard),
    border-color var(--wp--custom--motion--duration--base)
      var(--wp--custom--motion--easing--standard),
    transform var(--wp--custom--motion--duration--fast)
      var(--wp--custom--motion--easing--standard);

  /* Component radius aliases */
  --border-radius-input-form: var(--wp--custom--radius--4);
  --border-radius-button-sm: var(--wp--custom--radius--4);
  --border-radius-button-md: var(--wp--custom--radius--4);
  --border-radius-button-lg: var(--wp--custom--radius--4);

  /* Z-index scale */
  --z-below: -1;
  --z-base: 0;
  --z-dropdown: 1000;
  --z-sticky: 1100;
  --z-overlay: 1200;
  --z-modal: 1300;
  --z-popover: 1400;
  --z-tooltip: 1500;
}

/* =================================================================
   2. WordPress Core utilities
   ================================================================= */
.alignnone {
  margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
  display: block;
  margin: 5px auto 5px auto;
}

.alignright {
  float: right;
  margin: 5px 0 20px 20px;
}

.alignleft {
  float: left;
  margin: 5px 20px 20px 0;
}

a img.alignright {
  float: right;
  margin: 5px 0 20px 20px;
}

a img.alignnone {
  margin: 5px 20px 20px 0;
}

a img.alignleft {
  float: left;
  margin: 5px 20px 20px 0;
}

a img.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.wp-caption {
  background: var(--wp--preset--color--white);
  border: 1px solid var(--wp--preset--color--border);
  max-width: 96%;
  padding: 5px 3px 10px;
  text-align: center;
}

.wp-caption.alignnone {
  margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
  margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
  margin: 5px 0 20px 20px;
}

.wp-caption img {
  border: 0 none;
  height: auto;
  margin: 0;
  max-width: 98.5%;
  padding: 0;
  width: auto;
}

.wp-caption p.wp-caption-text {
  font-size: var(--wp--preset--font-size--12);
  line-height: 17px;
  margin: 0;
  padding: 0 4px 5px;
}

/* Text meant only for screen readers. */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}

.screen-reader-text:focus {
  background-color: var(--wp--preset--color--bg-secondary);
  clip: auto !important;
  clip-path: none;
  color: var(--wp--preset--color--text);
  display: block;
  font-size: 1em;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}

/* =================================================================
   3. Global styles & typography
   ================================================================= */
html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-body);
  font-size: var(--wp--preset--font-size--16);
  line-height: var(--lh-base);
  color: var(--wp--preset--color--text);
  background-color: var(--wp--preset--color--white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.wp-site-blocks {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.wp-site-blocks > main {
  flex: 1 0 auto;
  margin-block-start: var(--wp--preset--spacing--0);
}

.page-template-page-text main {
  margin-block-end: var(--wp--preset--spacing--64);
}

.container {
  margin-inline: auto;
  padding-left: var(--wp--preset--spacing--16);
  padding-right: var(--wp--preset--spacing--16);
}

strong {
  font-weight: var(--fw-semibold);
  color: var(--wp--preset--color--black);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-heading);
  color: var(--wp--preset--color--text-heading);
  line-height: var(--lh-tight);
  font-weight: var(--fw-regular);
  margin-top: var(--wp--preset--spacing--0);
  margin-bottom: var(--wp--preset--spacing--24);
}

:root :where(.wp-block-heading) {
  font-weight: var(--fw-regular);
}

.entry-content.wp-block-post-content .wp-block-heading {
  margin-bottom: var(--wp--preset--spacing--8);
}

.entry-content.wp-block-post-content.post-single__content
  h2:not(
    .header-section__title,
    .content-cards__card-title,
    .locations__card-title,
    .price-list__item-title,
    .card-title
  ) {
  font-size: var(--wp--preset--font-size--28) !important;
  text-transform: uppercase;
  margin-bottom: var(--wp--preset--spacing--16);
}

.entry-content.wp-block-post-content.post-single__content
  h3:not(
    .header-section__title,
    .content-cards__card-title,
    .locations__card-title,
    .price-list__item-title,
    .card-title
  ) {
  font-size: var(--wp--preset--font-size--26) !important;
}

.entry-content.wp-block-post-content h4 {
  font-size: var(--wp--preset--font-size--24) !important;
}

.entry-content.wp-block-post-content h5 {
  font-size: var(--wp--preset--font-size--20) !important;
}

.entry-content.wp-block-post-content h6 {
  font-size: var(--wp--preset--font-size--18) !important;
}

p {
  margin-top: var(--wp--preset--spacing--0);
  margin-bottom: var(--wp--preset--spacing--16);
}

ul,
ol {
  margin-top: var(--wp--preset--spacing--0);
  margin-bottom: var(--wp--preset--spacing--8);
  padding-left: var(--wp--preset--spacing--12);
}

.wp-block-list {
  padding-left: var(--wp--preset--spacing--24) !important;
  list-style-type: square;
}

li {
  margin-bottom: var(--wp--preset--spacing--4);
}

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

.wp-site-blocks > .entry-content {
  margin-block-start: 0;
}

/* =================================================================
   4. Links
   ================================================================= */
a {
  color: var(--wp--preset--color--text);
  text-decoration: none;
  transition: color var(--wp--custom--motion--duration--base)
    var(--wp--custom--motion--easing--standard);
}

a:hover {
  color: var(--wp--preset--color--primary);
  text-decoration: underline;
}

a:focus {
  outline: none;
  outline-offset: 0;
}

a:focus-visible {
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 2px;
}

/* =================================================================
   5. Buttons (BEM: .btn, .btn--*)
   ================================================================= */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 1.5rem;
  font-weight: var(--fw-medium);
  font-size: var(--wp--preset--font-size--16);
  line-height: 1.5;
  text-decoration: none;
  border: 2px solid transparent;
  border-radius: var(--wp--custom--radius--0);
  cursor: pointer;
  transition: var(--transition-btn);
  white-space: nowrap;
  user-select: none;

  &:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
  }
  &:hover {
    text-decoration: none;
  }
  &:active {
    transform: translateY(1px);
  }
  &:focus {
    outline: 2px solid transparent;
  }
  &:focus-visible {
    outline: 2px solid var(--wp--preset--color--primary);
    outline-offset: 2px;
  }
}

.btn--sm {
  padding: 0.5rem 1rem;
  font-size: var(--wp--preset--font-size--15);
}

.btn--md {
  padding: 0.75rem 1.5rem;
  font-size: var(--wp--preset--font-size--16);
}

.btn--lg {
  padding: 1rem 2rem;
  font-size: var(--wp--preset--font-size--18);
}

/* Default: dark button */
.btn--default {
  background-color: var(--wp--preset--color--text);
  color: var(--wp--preset--color--white);
  border-color: var(--wp--preset--color--text);
}

.btn--default:hover {
  background-color: var(--wp--preset--color--text-body);
  border-color: var(--wp--preset--color--text-body);
  color: var(--wp--preset--color--white);
  transform: translateY(-1px);
}

.btn--default:focus {
  background-color: var(--wp--preset--color--text);
  border-color: var(--wp--preset--color--text);
  color: var(--wp--preset--color--white);
}

.btn--default:disabled {
  background-color: var(--wp--preset--color--text-muted);
  border-color: var(--wp--preset--color--text-muted);
  color: var(--wp--preset--color--border);
  cursor: not-allowed;
}

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

.btn--primary:hover,
.btn--primary:focus {
  background-color: var(--wp--preset--color--primary-dark);
  border-color: var(--wp--preset--color--primary-dark);
  color: var(--wp--preset--color--white);
  transform: translateY(-1px);
}

/* Secondary: accent color */
.btn--secondary {
  background-color: var(--wp--preset--color--accent);
  color: var(--wp--preset--color--white);
  border-color: var(--wp--preset--color--accent);
}

.btn--secondary:hover,
.btn--secondary:focus {
  background-color: var(--wp--preset--color--primary);
  border-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--white);
  transform: translateY(-1px);
}

/* Outline: bordered, transparent background */
.btn--outline {
  background-color: transparent;
  color: var(--wp--preset--color--text);
  border-color: var(--wp--preset--color--text);
}

.btn--outline:hover,
.btn--outline:focus {
  background-color: var(--wp--preset--color--bg-secondary);
  border-color: var(--wp--preset--color--text-body);
  color: var(--wp--preset--color--text-body);
  transform: translateY(-1px);
  outline: none;
}

/* Outline Primary */
.btn--outline-primary {
  background-color: transparent;
  color: var(--wp--preset--color--primary);
  border-color: var(--wp--preset--color--primary);
}

.btn--outline-primary:hover,
.btn--outline-primary:focus {
  background-color: var(--wp--preset--color--primary);
  border-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--white);
  transform: translateY(-1px);
  outline: none;
}

/* Outline Secondary */
.btn--outline-secondary {
  background-color: transparent;
  color: var(--wp--preset--color--accent);
  border-color: var(--wp--preset--color--accent);
}

.btn--outline-secondary:hover,
.btn--outline-secondary:focus {
  background-color: var(--wp--preset--color--accent);
  border-color: var(--wp--preset--color--accent);
  color: var(--wp--preset--color--white);
  transform: translateY(-1px);
}

/* Disabled outlines */
.btn--outline:disabled,
.btn--outline-primary:disabled,
.btn--outline-secondary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  background-color: transparent;
  color: var(--wp--preset--color--text-muted);
  border-color: var(--wp--preset--color--text-muted);
}

/* Transparent: for dark backgrounds */
.btn--transparent {
  background-color: transparent;
  color: var(--wp--preset--color--white);
  border: 2px solid var(--wp--preset--color--white);
}

.btn--transparent:hover,
.btn--transparent:focus {
  background-color: rgba(255, 255, 255, 0.1);
  color: var(--wp--preset--color--white);
  border-color: var(--wp--preset--color--white);
  backdrop-filter: blur(4px);
  transform: translateY(-1px);
  outline: none;
}

/* Ghost: minimal, no borders */
.btn--ghost {
  background-color: transparent;
  color: var(--wp--preset--color--text);
  border-color: transparent;
  padding: 0;
}

.btn--ghost:hover,
.btn--ghost:focus {
  color: var(--wp--preset--color--primary);
  text-decoration: underline;
  outline: none;
}

.btn--ghost:has(svg):hover,
.btn--ghost:has(svg):focus {
  color: var(--wp--preset--color--primary);
  text-decoration: none;
  outline: none;
}

/* Light: light background, dark text */
.btn--light {
  background-color: var(--wp--preset--color--bg-secondary);
  color: var(--wp--preset--color--text);
  border-color: var(--wp--preset--color--bg-secondary);
}

.btn--light:hover,
.btn--light:focus {
  background-color: var(--wp--preset--color--bg);
  border-color: var(--wp--preset--color--text);
  outline: none;
}

/* Link: looks like a plain underlined link */
.btn--link {
  background-color: transparent;
  color: var(--wp--preset--color--text);
  border-color: transparent;
  text-decoration: underline;
  text-underline-offset: 0.25em;
  padding-inline: 0;
}

.btn--link:hover,
.btn--link:focus {
  color: var(--wp--preset--color--primary);
  outline: none;
}

/* =================================================================
   6. Images & Media
   ================================================================= */
img {
  max-width: 100%;
  height: auto;
}

figure {
  margin: 0;
}

figcaption {
  font-size: var(--wp--preset--font-size--14);
  color: var(--wp--preset--color--text-muted);
  margin-top: var(--wp--preset--spacing--4);
  text-align: center;
}

video,
iframe,
embed,
object {
  max-width: 100%;
  height: auto;
}

/* =================================================================
   7. Header & Navbar
   Layout and color classes are injected via render_block on .site-header:
   --layout-classic | --layout-centered | --layout-stacked
   --color-light | --color-dark | --color-transparent
   ================================================================= */

.site-header {
  background-color: var(--wp--preset--color--bg);
  position: fixed;
  width: 100%;
  top: 0;
  z-index: var(--z-sticky);
  /* ease-out on reveal: snaps in from above and settles smoothly */
  transition:
    transform 0.35s ease-out,
    background-color 0.3s ease,
    box-shadow 0.3s ease;
  /* will-change: transform omitted — it creates a containing block for
	   position: fixed descendants in Chrome/Safari, trapping the mobile
	   nav overlay inside the header instead of the viewport */
}

/* ease-in on hide: CSS uses the destination state's transition, so this applies when --hidden is added */
.site-header--hidden {
  transform: translateY(-100%);
  transition:
    transform 0.2s ease-in,
    top 0.3s ease-out,
    background-color 0.3s ease,
    box-shadow 0.3s ease;
}

/* Scrolled: visual weight past the top threshold */
.site-header--scrolled {
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.08);
  top: 0;
}

.site-header__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: var(--wp--preset--spacing--16);
  gap: var(--wp--preset--spacing--24);
}

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

.site-header .wp-block-site-logo a,
.site-header .wp-block-site-logo img {
  height: 2.5rem;
  width: auto;
  display: block;
}

.site-header__nav .wp-block-navigation__container {
  gap: var(--wp--preset--spacing--24);
}

.site-header__nav .wp-block-navigation-item {
  margin-bottom: 0;
}

.site-header__nav .wp-block-navigation-item__content {
  font-size: var(--wp--preset--font-size--14);
  font-weight: var(--fw-semibold);
  line-height: 1.5;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--wp--preset--color--text-body);
  text-decoration: none;
  transition: color 0.2s ease;
  padding-block: var(--wp--preset--spacing--8);
}

.site-header__nav .wp-block-navigation-item__content:hover,
.site-header__nav .wp-block-navigation-item__content:focus {
  color: var(--wp--preset--color--primary);
  text-decoration: none;
}

/* Active page link — desktop only (mobile menu keeps a flat style) */
@media (min-width: 48rem) {
  .site-header__nav
    .wp-block-navigation-item.current-menu-item
    > .wp-block-navigation-item__content {
    color: var(--wp--preset--color--white);
    background-color: var(--wp--preset--color--primary);
    font-weight: var(--fw-semibold);
    padding-inline: var(--wp--preset--spacing--4);
  }
}

/* --- Header CTA buttons (centered layout) --- */
.header-cta {
  display: none;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}

.header-cta__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1.25rem;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  border: 2px solid transparent;
  border-radius: var(--wp--custom--radius--4, 0.25rem);
  white-space: nowrap;
  transition:
    background-color 0.2s ease,
    color 0.2s ease,
    border-color 0.2s ease;
  cursor: pointer;
}

.header-cta__btn:hover {
  text-decoration: none;
}

.header-cta__btn--primary {
  background-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--white);
  border-color: var(--wp--preset--color--primary);
}
.header-cta__btn--primary:hover {
  background-color: var(--wp--preset--color--primary-dark);
  border-color: var(--wp--preset--color--primary-dark);
}

.header-cta__btn--secondary {
  background-color: transparent;
  color: var(--wp--preset--color--primary);
  border-color: var(--wp--preset--color--primary);
}
.header-cta__btn--secondary:hover {
  background-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--white);
}

.header-cta__btn--ghost {
  background-color: transparent;
  color: var(--wp--preset--color--text-body);
  border-color: var(--wp--preset--color--border);
}
.header-cta__btn--ghost:hover {
  background-color: var(--wp--preset--color--border);
  color: var(--wp--preset--color--text-heading);
}

/* --- Mobile menu (overlay) --- */
.site-header__nav .wp-block-navigation__responsive-container-open {
  color: var(--wp--preset--color--text);
}

.wp-block-navigation__responsive-container-content {
  padding-top: var(--wp--preset--spacing--16);
}

.site-header__nav .wp-block-navigation__responsive-container.is-menu-open {
  background-color: var(--wp--preset--color--bg);
  padding: var(--wp--preset--spacing--24);
  z-index: var(--z-modal) !important;
}

.site-header__nav
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item__content {
  font-size: 1.125rem;
  padding-block: var(--wp--preset--spacing--8);
  text-transform: none;
  letter-spacing: normal;
}

.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content
  .wp-block-navigation__submenu-container {
  padding-top: 0 !important;
}

.wp-block-navigation__container.site-header__nav.wp-block-navigation {
  gap: var(--wp--preset--spacing--16) !important;
}

.wp-block-navigation ul,
.wp-block-navigation ul li {
  font-weight: 500;
}

/* =================================================================
   7a. Layout: Centered
   ================================================================= */

.wp-block-post-content {
  margin-block-start: 0;
}

.site-header--layout-centered .site-header__bar {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
}

.site-header--layout-centered .site-header__brand {
  justify-self: start;
}

.site-header--layout-centered .site-header__nav {
  justify-self: center;
}

.site-header--layout-centered .header-cta {
  display: flex;
  justify-self: end;
}

/* =================================================================
   7b. Layout: Stacked
   ================================================================= */

.site-header--layout-stacked .site-header__bar {
  flex-direction: column;
  align-items: center;
  gap: var(--wp--preset--spacing--12);
  padding-block: var(--wp--preset--spacing--16) var(--wp--preset--spacing--12);
}

.site-header--layout-stacked .wp-block-site-logo a,
.site-header--layout-stacked .wp-block-site-logo img {
  height: var(--wp--preset--spacing--56);
}

.site-header--layout-stacked .header-cta {
  display: none;
}

/* =================================================================
   7c. Color: Light
   ================================================================= */

.site-header--color-light {
  background-color: var(--wp--preset--color--bg);
}

.site-header--color-light .site-header__nav .wp-block-navigation-item__content {
  color: var(--wp--preset--color--text-body);
}

.site-header--color-light
  .site-header__nav
  .wp-block-navigation-item__content:hover,
.site-header--color-light
  .site-header__nav
  .wp-block-navigation-item__content:focus {
  color: var(--wp--preset--color--primary);
}

@media (min-width: 48rem) {
  .site-header--color-light
    .wp-block-navigation-item.current-menu-item
    > .wp-block-navigation-item__content {
    color: var(--wp--preset--color--white);
    background-color: var(--wp--preset--color--primary);
    padding-inline: var(--wp--preset--spacing--8);
    border-radius: var(--wp--custom--radius--4);
  }
}

/* =================================================================
   7d. Color: Dark
   ================================================================= */

.site-header--color-dark {
  background-color: var(--wp--preset--color--bg-dark, #111111);
}

.site-header--color-dark .site-header__nav .wp-block-navigation-item__content {
  color: rgba(255, 255, 255, 0.85);
}
.site-header--color-dark
  .site-header__nav
  .wp-block-navigation-item__content:hover,
.site-header--color-dark
  .site-header__nav
  .wp-block-navigation-item__content:focus {
  color: var(--wp--preset--color--white);
}
@media (min-width: 48rem) {
  .site-header--color-dark
    .wp-block-navigation-item.current-menu-item
    > .wp-block-navigation-item__content {
    color: var(--wp--preset--color--white);
  }
}
.site-header--color-dark .wp-block-navigation__responsive-container-open {
  color: var(--wp--preset--color--white);
}

/* Dark: CTA overrides */
.site-header--color-dark .header-cta__btn--ghost {
  color: rgba(255, 255, 255, 0.85);
  border-color: rgba(255, 255, 255, 0.3);
}
.site-header--color-dark .header-cta__btn--ghost:hover {
  color: var(--wp--preset--color--white);
  background-color: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.5);
}
.site-header--color-dark .header-cta__btn--secondary {
  color: var(--wp--preset--color--white);
  border-color: var(--wp--preset--color--white);
}
.site-header--color-dark .header-cta__btn--secondary:hover {
  background-color: var(--wp--preset--color--white);
  color: var(--wp--preset--color--primary-dark);
}

/* Dark: dropdown keeps light surface for legibility */
.site-header--color-dark
  .site-header__nav
  .wp-block-navigation__submenu-container
  .wp-block-navigation-item__content {
  color: var(--wp--preset--color--text-body);
}
.site-header--color-dark
  .site-header__nav
  .wp-block-navigation__submenu-container
  .wp-block-navigation-item__content:hover,
.site-header--color-dark
  .site-header__nav
  .wp-block-navigation__submenu-container
  .wp-block-navigation-item__content:focus {
  color: var(--wp--preset--color--primary);
  background-color: var(--wp--preset--color--bg-secondary);
}

/* =================================================================
   7e. Color: Transparent
   ================================================================= */

/* next sibling pulled up by --site-header-height (set by JS) so the hero sits behind the header */
.wp-block-template-part:has(.site-header--color-transparent) + * {
  margin-block-start: calc(-1 * var(--site-header-height, 5rem));
}

.site-header--color-transparent {
  background-color: transparent;
}

.site-header--color-transparent.site-header--scrolled .custom-logo-link img {
  filter: brightness(0.75);
}

.site-header--color-transparent.site-header--scrolled
  .wp-block-navigation__responsive-container-open
  svg {
  color: var(--wp--preset--color--primary);
}

/* goes solid when scrolled */
.site-header--color-transparent.site-header--scrolled {
  background-color: var(--wp--preset--color--bg);
}

.site-header--color-transparent:not(.site-header--scrolled)
  .site-header__nav
  .wp-block-navigation-item__content {
  color: rgba(255, 255, 255, 0.85);
}
.site-header--color-transparent
  .site-header__nav
  .wp-block-navigation-item__content:hover,
.site-header--color-transparent
  .site-header__nav
  .wp-block-navigation-item__content:focus {
  color: var(--wp--preset--color--white);
}
@media (min-width: 48rem) {
  .site-header--color-transparent
    .wp-block-navigation-item.current-menu-item
    > .wp-block-navigation-item__content {
    color: var(--wp--preset--color--white);
    background-color: var(--wp--preset--color--primary);
    padding-inline: var(--wp--preset--spacing--4);
    border-radius: var(--wp--custom--radius--4);
  }
}
.site-header--color-transparent
  .wp-block-navigation__responsive-container-open {
  color: var(--wp--preset--color--white);
}

/* mobile menu always uses light bg for readability */
.site-header--color-transparent
  .wp-block-navigation__responsive-container.is-menu-open {
  background-color: var(--wp--preset--color--bg);
}
.site-header--color-transparent
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item__content {
  color: var(--wp--preset--color--text-body);
}

/* CTA overrides for transparent header */
.site-header--color-transparent .header-cta__btn--ghost {
  color: rgba(255, 255, 255, 0.85);
  border-color: rgba(255, 255, 255, 0.3);
}
.site-header--color-transparent .header-cta__btn--ghost:hover {
  color: var(--wp--preset--color--white);
  background-color: rgba(255, 255, 255, 0.1);
}
.site-header--color-transparent .header-cta__btn--secondary {
  color: var(--wp--preset--color--white);
  border-color: var(--wp--preset--color--white);
}
.site-header--color-transparent .header-cta__btn--secondary:hover {
  background-color: var(--wp--preset--color--white);
  color: var(--wp--preset--color--primary-dark);
}

/* dropdown keeps light surface for legibility */
.site-header--color-transparent
  .site-header__nav
  .wp-block-navigation__submenu-container
  .wp-block-navigation-item__content {
  color: var(--wp--preset--color--text-body);
}
.site-header--color-transparent
  .site-header__nav
  .wp-block-navigation__submenu-container
  .wp-block-navigation-item__content:hover,
.site-header--color-transparent
  .site-header__nav
  .wp-block-navigation__submenu-container
  .wp-block-navigation-item__content:focus {
  color: var(--wp--preset--color--primary);
  background-color: var(--wp--preset--color--bg-secondary);
}

/* =================================================================
   7f. Hero / pageheader offset for transparent header
   --site-header-height is set by JS on load and resize.
   ================================================================= */

.wp-block-template-part:has(.site-header--color-transparent) + * .hero,
.wp-block-template-part:has(.site-header--color-transparent) + * .pageheader {
  padding-top: var(--site-header-height, 5rem);
}

@media (min-width: 48rem) {
  /* Stacked layout is taller — add extra breathing room */
  .wp-block-template-part:has(
      .site-header--layout-stacked.site-header--color-transparent
    )
    + *
    .hero,
  .wp-block-template-part:has(
      .site-header--layout-stacked.site-header--color-transparent
    )
    + *
    .pageheader {
    padding-top: calc(var(--site-header-height, 8rem) + 8rem);
    padding-bottom: 8rem;
  }
}

.page-template-page-text .pageheader {
  margin-bottom: var(--wp--preset--spacing--64);
}

/* =================================================================
   8. Footer
   Layouts (via render_block): --layout-columns | --layout-centered | --layout-minimal
   Colors:  --color-light | --color-dark | --color-primary
   Logo:    --logo-sm | --logo-md | --logo-lg
   ================================================================= */

footer {
  margin-block-start: 0;
}

.site-footer {
  flex-shrink: 0;
  background-color: var(--wp--preset--color--bg-secondary);
  padding: var(--wp--preset--spacing--48) var(--wp--preset--spacing--0)
    var(--wp--preset--spacing--32);
}

.site-footer a {
  color: var(--wp--preset--color--text-body);
  text-decoration: none;
  transition: color 0.2s ease;
}

.site-footer a:hover,
.site-footer a:focus {
  color: var(--wp--preset--color--primary);
  text-decoration: underline;
}

.site-footer__top {
  margin-bottom: var(--wp--preset--spacing--32);
}

.site-footer__columns {
  gap: var(--wp--preset--spacing--32);
}

.site-footer--logo-sm .wp-block-site-logo img {
  max-height: var(--wp--preset--spacing--40);
}
.site-footer--logo-md .wp-block-site-logo img {
  max-height: var(--wp--preset--spacing--64);
}
.site-footer--logo-lg .wp-block-site-logo img {
  max-height: var(--wp--preset--spacing--88);
}

.site-footer .wp-block-site-logo img {
  height: auto;
  width: auto;
  display: block;
  filter: brightness(1.5);
}

.footer-brand {
  margin-top: 0.75rem;
}

.footer-brand__tagline {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--wp--preset--color--text-muted);
}

.footer-brand__cta {
  display: inline-flex;
  align-items: center;
  margin-top: 0.75rem;
  padding: 0.5rem 1.25rem;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  border: 2px solid var(--wp--preset--color--primary);
  border-radius: var(--wp--custom--radius--4, 0.25rem);
  color: var(--wp--preset--color--primary);
  transition:
    background-color 0.2s ease,
    color 0.2s ease;
}

.footer-brand__cta:hover {
  background-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--white);
  text-decoration: none;
}

.footer-brand__social {
  display: flex;
  gap: 0.625rem;
  margin-top: 1rem;
}

.footer-brand__social-link {
  display: flex;
  color: var(--wp--preset--color--text-muted);
  transition: color 0.2s ease;
}

.footer-brand__social-link:hover {
  color: var(--wp--preset--color--primary);
  text-decoration: none;
}

.footer-brand__icon svg {
  width: 1.5rem;
  height: 1.5rem;
  display: block;
}

.site-footer__title {
  font-family: var(--wp--preset--font-family--primary);
  font-size: var(--wp--preset--font-size--14);
  color: var(--wp--preset--color--text);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: var(--fw-semibold);
  margin-bottom: var(--wp--preset--spacing--4);
}

.site-footer__nav {
  margin-block-start: var(--wp--preset--spacing--16);
}

.site-footer__nav .wp-block-navigation-item__content {
  font-size: var(--wp--preset--font-size--14);
  font-weight: var(--fw-regular);
  color: var(--wp--preset--color--text-body);
}

.site-footer__nav .wp-block-navigation-item__content:hover {
  color: var(--wp--preset--color--primary);
}

/* --- Bottom (credits + legal) --- */
.site-footer__bottom {
  border-top: 1px solid var(--wp--preset--color--border);
  margin-top: 2rem;
  padding-top: 1rem;
  gap: 1rem;
}

.site-footer__bottom .footer-credits {
  font-size: var(--wp--preset--font-size--12);
  color: var(--wp--preset--color--text-muted);
  margin: 0;
}

.site-footer__bottom .footer-credits a {
  text-decoration: underline;
}

.site-footer__legal .wp-block-navigation-item__content {
  font-size: var(--wp--preset--font-size--12);
  color: var(--wp--preset--color--text-muted);
}

.site-footer__legal .wp-block-navigation-item__content:hover {
  color: var(--wp--preset--color--primary);
}

.site-footer__legal li {
  margin-bottom: 0;
}

/* =================================================================
   8b. Layout: Centered
   ================================================================= */

.site-footer--layout-centered .site-footer__top {
  text-align: center;
}

.site-footer--layout-centered .site-footer__columns {
  flex-direction: column;
  align-items: center;
}

/* Hide nav + contact columns, show only brand */
.site-footer--layout-centered .site-footer__col--nav,
.site-footer--layout-centered .site-footer__col--contact {
  display: none;
}

.site-footer--layout-centered .site-footer__col--brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 28rem;
}

.site-footer--layout-centered .footer-brand {
  text-align: center;
}

.site-footer--layout-centered .footer-brand__social {
  justify-content: center;
}

.site-footer--layout-centered .site-footer__bottom {
  justify-content: center;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

/* =================================================================
   8c. Layout: Minimal
   ================================================================= */

.site-footer--layout-minimal .site-footer__top {
  display: none;
}

.site-footer--layout-minimal {
  padding: 1rem 0;
}

.site-footer--layout-minimal .site-footer__bottom {
  border-top: none;
  margin-top: 0;
  padding-top: 0;
}

/* =================================================================
   8e. Color: Dark
   ================================================================= */

.site-footer--color-dark {
  background-color: var(--wp--preset--color--bg-dark);
  color: rgba(255, 255, 255, 0.85);
}

.site-footer--color-dark a {
  color: rgba(255, 255, 255, 0.85);
  cursor: pointer;
}

.site-footer--color-dark a:hover,
.site-footer--color-dark a:focus {
  color: var(--wp--preset--color--white);
}

.site-footer--color-dark .site-footer__title {
  color: var(--wp--preset--color--white);
}

.site-footer--color-dark .site-footer__nav .wp-block-navigation-item__content {
  color: rgba(255, 255, 255, 0.9);
}

.site-footer--color-dark
  .site-footer__nav
  .wp-block-navigation-item__content:hover {
  color: var(--wp--preset--color--white);
}

.site-footer--color-dark .footer-brand__tagline {
  color: rgba(255, 255, 255, 0.8);
}

.site-footer--color-dark .footer-brand__social-link {
  color: var(--wp--preset--color--black);
  background-color: #fff;
  border: 1px solid transparent;
  padding: var(--wp--preset--spacing--8);
  border-radius: 50%;
  transition: all 0.2s ease;
}

.site-footer--color-dark .footer-brand__social-link:hover {
  color: #fff;
  background-color: var(--wp--preset--color--black);
  border: 1px solid rgba(255, 255, 255, 1);
}

.site-footer--color-dark .footer-brand__cta {
  color: var(--wp--preset--color--white);
  border-color: rgba(255, 255, 255, 0.3);
}

.site-footer--color-dark .footer-brand__cta:hover {
  background-color: var(--wp--preset--color--white);
  color: var(--wp--preset--color--primary-dark);
  border-color: var(--wp--preset--color--white);
}

.site-footer--color-dark .site-footer__bottom {
  border-color: rgba(255, 255, 255, 0.15);
}

.site-footer--color-dark .footer-credits,
.site-footer--color-dark
  .site-footer__legal
  .wp-block-navigation-item__content {
  color: rgba(255, 255, 255, 0.5);
}

.site-footer--color-dark
  .site-footer__legal
  .wp-block-navigation-item__content:hover {
  color: var(--wp--preset--color--white);
}

/* =================================================================
   8f. Color: Primary
   ================================================================= */

.site-footer--color-primary {
  background-color: var(--wp--preset--color--primary);
  color: rgba(255, 255, 255, 0.8);
}

.site-footer--color-primary a {
  color: rgba(255, 255, 255, 0.8);
}

.site-footer--color-primary a:hover {
  color: var(--wp--preset--color--white);
}

.site-footer--color-primary .site-footer__title {
  color: var(--wp--preset--color--white);
}

.site-footer--color-primary
  .site-footer__nav
  .wp-block-navigation-item__content {
  color: rgba(255, 255, 255, 0.8);
}

.site-footer--color-primary
  .site-footer__nav
  .wp-block-navigation-item__content:hover {
  color: var(--wp--preset--color--white);
}

.site-footer--color-primary .footer-brand__tagline {
  color: rgba(255, 255, 255, 0.7);
}

.site-footer--color-primary .footer-brand__social-link {
  color: rgba(255, 255, 255, 0.7);
}

.site-footer--color-primary .footer-brand__social-link:hover {
  color: var(--wp--preset--color--white);
}

.site-footer--color-primary .footer-brand__cta {
  color: var(--wp--preset--color--white);
  border-color: rgba(255, 255, 255, 0.4);
}

.site-footer--color-primary .footer-brand__cta:hover {
  background-color: var(--wp--preset--color--white);
  color: var(--wp--preset--color--primary);
  border-color: var(--wp--preset--color--white);
}

.site-footer--color-primary .footer-contact__item,
.site-footer--color-primary .footer-contact__hours {
  color: rgba(255, 255, 255, 0.8);
}

.site-footer--color-primary .site-footer__bottom {
  border-color: rgba(255, 255, 255, 0.2);
}

.site-footer--color-primary .footer-credits,
.site-footer--color-primary
  .site-footer__legal
  .wp-block-navigation-item__content {
  color: rgba(255, 255, 255, 0.5);
}

.site-footer--color-primary
  .site-footer__legal
  .wp-block-navigation-item__content:hover {
  color: var(--wp--preset--color--white);
}

/* =================================================================
   8g. Footer responsive
   ================================================================= */

@media (max-width: 47.999rem) {
  .site-footer__columns {
    flex-direction: column;
  }

  .site-footer__bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
  }
}

@media (min-width: 48rem) {
  .site-footer {
    padding: 4rem 0 2rem;
  }
}

/* =================================================================
   9. Header Section component
   ================================================================= */
.header-section {
  margin-bottom: 2rem;
}

.header-section--align-center {
  text-align: center;
}

.header-section--align-left {
  text-align: left;
}

.header-section--width-narrow {
  max-width: 66.666%;
}

.header-section--align-center.header-section--width-narrow {
  margin-inline: auto;
}

.header-section--width-full {
  max-width: 100%;
}

.header-section__tagline {
  font-size: 0.75rem;
  font-weight: var(--fw-medium);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--wp--preset--color--text-muted);
  margin: 0 0 0.5rem;
}

/* Tagline below title: subtitle style */
.header-section__title + .header-section__tagline {
  font-size: 0.75rem;
  font-weight: var(--fw-medium);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--wp--preset--color--text-tagline);
  margin: var(--wp--preset--spacing--8) 0 var(--wp--preset--spacing--12);
}

.header-section__title {
  font-family: var(--wp--preset--font-family--primary);
  font-size: clamp(1.5rem, 1vw + 1.125rem, 1.875rem);
  font-weight: 500;
  line-height: 1.3;
  text-wrap: balance;
  margin: 0 0 1rem;
  text-transform: uppercase;
  color: var(--wp--preset--color--text-heading);
}

.header-section__description {
  font-size: var(--wp--preset--font-size--16);
  line-height: 1.6;
  color: var(--wp--preset--color--text-body);
  text-wrap: pretty;
  margin: 0;
}

.header-section--align-center .header-section__description {
  max-width: 90%;
  margin-inline: auto;
  text-wrap: balance;
}

@media (max-width: 48rem) {
  .header-section--width-narrow {
    max-width: 100%;
  }
}

/* =================================================================
   10. Error 404 page
   ================================================================= */
.error-404__title {
  margin-bottom: var(--wp--preset--spacing--16);
}

.error-404__text {
  font-size: var(--wp--preset--font-size--16);
  line-height: 1.6;
  color: var(--wp--preset--color--text-body);
  text-wrap: balance;
  margin-bottom: var(--wp--preset--spacing--16);
}

.wp-block-search__inside-wrapper {
  margin-bottom: var(--wp--preset--spacing--32);
}

.error-404__search button {
  transition: opacity 0.2s ease;
  border-radius: 0;
}

.error-404__search button:hover {
  opacity: 0.8;
}

.error-404__btn a {
  background-color: var(--wp--preset--color--white);
  border: 2px solid var(--wp--preset--color--primary);
  color: var(--wp--preset--color--primary);
  transition: transform 0.2s ease;
  border-radius: 0;
}

.error-404__btn a:hover {
  transform: scale(0.98);
  text-decoration: none;
}

/* =================================================================
   11. Accessibility
   ================================================================= */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

/* =================================================================
   12. Scroll-to-top
   ================================================================= */
.scroll-top {
  position: fixed;
  bottom: 4.5rem;
  left: 1rem;
  z-index: var(--z-sticky);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  background-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--white);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
  opacity: 0;
  visibility: hidden;
  transform: translateY(0.5rem);
  transition:
    opacity 0.25s ease,
    transform 0.25s ease,
    visibility 0s linear 0.25s,
    background-color 0.2s ease;
}

.scroll-top--visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition:
    opacity 0.25s ease,
    transform 0.25s ease,
    visibility 0s linear 0s,
    background-color 0.2s ease;
}

.scroll-top:hover {
  background-color: var(
    --wp--preset--color--primary-dark,
    var(--wp--preset--color--primary)
  );
}

.scroll-top:focus-visible {
  outline: 2px solid var(--wp--preset--color--accent);
  outline-offset: 3px;
}

/* =================================================================
   13. Float CTA (call + WhatsApp)
   ================================================================= */
.float-cta {
  position: fixed;
  bottom: 1.75rem;
  right: 1.75rem;
  z-index: var(--z-overlay);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}

.float-cta__btn {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #fff;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.float-cta__btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.24);
  color: #fff;
}

.float-cta__btn:focus-visible {
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 3px;
}

.float-cta__btn--call {
  background-color: var(--wp--preset--color--primary);
}

.float-cta__btn--whatsapp {
  background-color: #25d366;
}

@media (prefers-reduced-motion: reduce) {
  .float-cta__btn {
    transition: none;
  }
}

/* =================================================================
   14. Tables
   ================================================================= */

.wp-block-table {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.wp-block-table table,
.entry-content table {
  width: 100%;
  border-collapse: collapse;
  border: none;
  font-size: 0.9375rem;
  line-height: 1.6;
}

.wp-block-table th,
.wp-block-table td,
.entry-content th,
.entry-content td {
  padding: 0.75rem 1rem;
  text-align: left;
  border: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  vertical-align: top;
}

.wp-block-table thead th,
.entry-content thead th {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--wp--preset--color--text-muted);
  border-bottom: 2px solid var(--wp--preset--color--border, rgba(0, 0, 0, 0.12));
}

.wp-block-table tbody tr:last-child td,
.entry-content tbody tr:last-child td {
  border-bottom: none;
}

.wp-block-table tbody tr:hover td,
.entry-content tbody tr:hover td {
  background-color: var(--wp--preset--color--bg-secondary);
}

.wp-block-table tfoot td,
.entry-content tfoot td {
  font-size: 0.8125rem;
  color: var(--wp--preset--color--text-muted);
  border: none;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

/* =================================================================
   15. Form Gravity Forms
   ================================================================= */
.gform_wrapper {
  background-color: var(--wp--preset--color--bg-secondary);
  margin: 0 auto;
  padding-top: var(--wp--preset--spacing--8);
  padding-bottom: var(--wp--preset--spacing--32);
}

.gform_wrapper form {
  margin: 0 auto;
  text-align: left;
}

.gform_fields {
  row-gap: var(--wp--preset--spacing--10) !important;
}

.gform_button {
  background-color: var(--wp--preset--color--primary) !important;
  color: var(--wp--preset--color--white) !important;
  border: none;
  padding: 0.75rem 1.5rem;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  cursor: pointer;
  width: 100% !important;
  transition: transform 0.2s ease !important;
}

.gform_button:hover {
  transform: scale(0.98) !important;
}

textarea,
.gfield input {
  border-radius: 0 !important;
  border: none !important;
}

textarea:focus,
.gfield input:focus-within {
  outline: 2px solid var(--wp--preset--color--accent);
  outline-offset: 2px;
}

.gform_confirmation_message {
  font-family: var(--wp--preset--font-family--secondary);
  font-size: var(--wp--preset--font-size--15);
  font-weight: 600;
  font-style: italic;
  color: var(--wp--preset--color--accent);
  text-wrap: balance;
  line-height: 1.6;
}

.gfield_consent_label .gfield_required {
  margin-left: var(--wp--preset--spacing--4);
}

/* =================================================================
   14. Media queries
   ================================================================= */

/* Container responsive — uses theme.json custom tokens */
@media (min-width: 640px) {
  .container {
    max-width: var(--wp--custom--container--sm);
  }
}
@media (min-width: 768px) {
  .container {
    max-width: var(--wp--custom--container--md);
  }
}
@media (min-width: 1024px) {
  .container {
    max-width: var(--wp--custom--container--lg);
  }
}
@media (min-width: 1280px) {
  .container {
    max-width: var(--wp--custom--container--xl);
  }
}
@media (min-width: 1536px) {
  .container {
    max-width: var(--wp--custom--container--xl);
  }
}

/* WP core shows the desktop nav at 600px; we override that range so the
   hamburger stays visible until our own 768px breakpoint kicks in below. */
@media (min-width: 37.5em) and (max-width: 47.9375rem) {
  .site-header__nav
    .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none !important;
  }
  .site-header__nav .wp-block-navigation__responsive-container-open {
    display: flex !important;
  }
}

/* Tablet+ (48rem / 768px) — desktop nav */
@media (min-width: 48rem) {
  /* Sticky header: slide up when scrolled, slide down when at top */
  .site-header--scrolled {
    top: -96px;
  }

  /* Navbar hover underline animation */
  .site-header__nav .wp-block-navigation-item__content {
    position: relative;
  }

  .site-header__nav .wp-block-navigation-item__content::after {
    content: "";
    display: block;
    position: absolute;
    bottom: -2px;
    left: 50%;
    width: 0;
    height: 1px;
    background: currentColor;
    transition:
      width 0.3s ease,
      left 0.3s ease;
  }

  .site-header__nav .wp-block-navigation-item__content:hover::after {
    width: 100%;
    left: 0;
  }

  /* Dropdown submenu */
  .site-header__nav .wp-block-navigation-item.has-child {
    position: relative;
  }

  /* Parent link doesn't get the underline animation (chevron marks it) */
  .site-header__nav
    .wp-block-navigation-submenu
    > .wp-block-navigation-item__content::after {
    display: none;
  }

  /* Chevron toggle button */
  .site-header__nav .wp-block-navigation__submenu-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: auto;
    padding: 0.5rem;
    margin-left: calc(0.375rem - 0.5rem);
    background: transparent;
    border: 0;
    color: inherit;
    cursor: pointer;
    transition: transform 0.2s ease;
  }

  .site-header__nav .wp-block-navigation__submenu-icon svg {
    width: 0.625rem;
    height: 0.625rem;
    stroke: currentColor;
    fill: none;
  }

  .site-header--color-transparent
    .site-header__nav
    .wp-block-navigation__submenu-icon
    svg {
    stroke: var(--wp--preset--color--white);
  }

  .site-header__nav .wp-block-navigation__submenu-icon[aria-expanded="true"] {
    transform: rotate(180deg);
  }

  /* Dropdown container — width auto but never too narrow */
  .site-header__nav .wp-block-navigation__submenu-container {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 11rem;
    max-width: 20rem;
    width: max-content;
    margin: 0;
    padding: 0.5rem 0;
    list-style: none;
    background-color: var(--wp--preset--color--white);
    border: 0;
    border-radius: var(--wp--custom--radius--4, 0.25rem);
    box-shadow:
      0 10px 30px -12px rgba(0, 0, 0, 0.12),
      0 4px 12px -4px rgba(0, 0, 0, 0.08);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition:
      opacity 0.15s ease,
      transform 0.15s ease,
      visibility 0s linear 0.15s;
    pointer-events: none;
    z-index: var(--z-dropdown);
  }

  /* Open on hover or explicit toggle (aria-expanded) — focus-within omitted intentionally:
	   it keeps the container visible after clicking a child link, leaving a white ghost strip */
  .site-header__nav
    .wp-block-navigation-submenu:hover
    > .wp-block-navigation__submenu-container,
  .site-header__nav
    .wp-block-navigation__submenu-icon[aria-expanded="true"]
    + .wp-block-navigation__submenu-container {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
    transition:
      opacity 0.15s ease,
      transform 0.15s ease,
      visibility 0s linear 0s;
  }

  .site-header__nav
    .wp-block-navigation__submenu-container
    .wp-block-navigation-item {
    margin: 0;
  }

  .site-header__nav
    .wp-block-navigation__submenu-container
    .wp-block-navigation-item__content {
    display: block;
    padding: 0.5rem 1.25rem;
    font-size: 0.8125rem;
    font-weight: var(--fw-regular);
    line-height: 1.5;
    letter-spacing: 0.01em;
    text-transform: none;
    color: var(--wp--preset--color--text-body);
    white-space: nowrap;
    transition:
      background-color 0.15s ease,
      color 0.15s ease;
  }

  .site-header__nav
    .wp-block-navigation__submenu-container
    .wp-block-navigation-item__content:hover,
  .site-header__nav
    .wp-block-navigation__submenu-container
    .wp-block-navigation-item__content:focus {
    background-color: var(--wp--preset--color--bg-secondary);
    color: var(--wp--preset--color--primary);
    text-decoration: none;
  }

  /* Submenu items never carry the animated underline */
  .site-header__nav
    .wp-block-navigation__submenu-container
    .wp-block-navigation-item__content::after {
    display: none;
  }

  /* Last nav item styled as CTA button when .site-header--nav-cta is set */
  .site-header--nav-cta
    .site-header__nav
    .wp-block-navigation-link:last-child
    .wp-block-navigation-item__content::after {
    display: none;
  }

  .site-header--nav-cta
    .site-header__nav
    .wp-block-navigation-link:last-child
    a {
    display: flex;
    align-items: center;
    padding: 0.5rem 1.25rem;
    background-color: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--white);
    font-weight: var(--fw-medium);
    font-size: 0.8125rem;
    line-height: 1.5;
    border-radius: var(--wp--custom--radius--4, 0.25rem);
    transition: background-color 0.2s ease;
  }

  .site-header--nav-cta
    .site-header__nav
    .wp-block-navigation-link:last-child
    a:hover,
  .site-header--nav-cta
    .site-header__nav
    .wp-block-navigation-link:last-child
    a:focus {
    background-color: var(--wp--preset--color--primary-dark);
    color: var(--wp--preset--color--white);
    text-decoration: none;
  }

  .site-header--nav-cta
    .site-header__nav
    .wp-block-navigation-link:last-child
    a:focus-visible {
    outline: 2px solid var(--wp--preset--color--accent);
    outline-offset: 2px;
  }

  /* Dark/transparent: nav CTA uses white style */
  .site-header--color-dark.site-header--nav-cta
    .wp-block-navigation-link:last-child
    a,
  .site-header--color-transparent.site-header--nav-cta
    .wp-block-navigation-link:last-child
    a {
    background-color: var(--wp--preset--color--white);
    color: var(--wp--preset--color--primary-dark);
  }

  .site-header--color-dark.site-header--nav-cta
    .wp-block-navigation-link:last-child
    a:hover,
  .site-header--color-transparent.site-header--nav-cta
    .wp-block-navigation-link:last-child
    a:hover {
    background-color: var(--wp--preset--color--bg-secondary);
  }

  /* Stacked: larger logo on desktop */
  .site-header--layout-stacked .wp-block-site-logo a,
  .site-header--layout-stacked .wp-block-site-logo img {
    height: 4rem;
  }

  /* Centered: CTA visible on desktop */
  .site-header--layout-centered .header-cta {
    display: flex;
  }

  .btn {
    padding: var(--wp--preset--spacing--14) var(--wp--preset--spacing--24);
  }
}

/* Mobile: stacked & centered revert to classic flex */
@media (max-width: 47.999rem) {
  .site-header--layout-centered .site-header__bar,
  .site-header--layout-stacked .site-header__bar {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }

  .site-header--layout-centered .header-cta,
  .site-header--layout-stacked .header-cta {
    display: none;
  }
}

/* =================================================================
   Kit Digital — EU funding strip
   ================================================================= */

.kit-digital {
  background-color: var(--wp--preset--color--bg-dark);
}

.kit-digital__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--wp--preset--spacing--20);
}

.kit-digital__logo {
  flex-shrink: 0;
  height: 2rem;
  width: auto;
  object-fit: contain;
}

.kit-digital__text {
  margin: 0;
  font-size: var(--wp--preset--font-size--11);
  line-height: 1.5;
  letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.6);
}

@media (max-width: 47.9375rem) {
  .kit-digital__inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--wp--preset--spacing--12);
  }
}

/* =================================================================
   Trustindex reviews widget — WCAG AA contrast overrides
   ================================================================= */

.ti-widget .ti-read-more-active,
.ti-widget .ti-read-more-active[role="button"] {
  color: #666666;
}

.ti-widget .ti-date .ti-with-tooltip {
  color: #666666;
}