/* Turbo Blocks bundle (auto-generated) */

/* ===== theme-vars.css ===== */

:root {
  /* Colors (Customizer defaults as fallbacks) */
  --color-primary: #f97316;
  --color-surface: #fffaf8;
  --card-bg: #000000;
  --card-heading: #f97316;
  --card-text: #ffffff;
  --card-text-muted: #e5e5e5;

  /* Spacing */
  --section-space-mobile: 6rem;
  --section-space-desktop: 6rem;
  --block-padding: 4rem;

  /* Border radius (soft preset defaults) */
  --radius-sm: 0.125rem;
  --radius-md: 0.375rem;
  --radius-lg: 0.5rem;
  --radius-xl: 0.75rem;
  --radius-2xl: 1rem;
  --radius-full: 9999px;

  /* Typography scale defaults removed - theme customizer provides these */
  /* --body-font-size-mobile, --body-font-size-desktop, etc. come from theme */

  /* Tailwind reference scale */
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
}

/* ===== typography.css ===== */

/* ==========================================================
    Global typography utilities for Turbo Blocks
   - Attach .hayden-type to a wrapper
   - Add .hayden-type--heading-{scale} / .hayden-type--body-{scale}
   - Put .hayden-type-heading on the main heading
   - Put .hayden-type-body on body text (and optional button text)
   - Responsive: mobile-first, scales up on desktop (768px+)
   - Uses direct child selector (>) to prevent cascade to nested blocks
========================================================== */

/* Prevent horizontal scroll from full-width blocks */
body {
    overflow-x: hidden;
}



/* ----------------------
   DEFAULT HEADING/BODY SIZES (uses customizer variables)
   Applied when no specific scale class is selected
   Responsive using customizer's mobile/desktop variables
------------------------- */

/* Default heading - uses customizer sizing based on heading level */
.hayden-banner-inner h1.hayden-type-heading,
.hayden-testimonial-inner h1.hayden-type-heading,
.hayden-media-text-inner h1.hayden-type-heading,
.hayden-features h1.hayden-type-heading {
    font-size: var(--h1-font-size-mobile);
}

.hayden-banner-inner h2.hayden-type-heading,
.hayden-testimonial-inner h2.hayden-type-heading,
.hayden-media-text-inner h2.hayden-type-heading,
.hayden-features h2.hayden-type-heading {
    font-size: var(--h2-font-size-mobile);
}

.hayden-banner-inner h3.hayden-type-heading,
.hayden-testimonial-inner h3.hayden-type-heading,
.hayden-media-text-inner h3.hayden-type-heading,
.hayden-features h3.hayden-type-heading {
    font-size: var(--h3-font-size-mobile);
}

@media (min-width: 768px) {
    .hayden-banner-inner h1.hayden-type-heading,
    .hayden-testimonial-inner h1.hayden-type-heading,
    .hayden-media-text-inner h1.hayden-type-heading,
    .hayden-features h1.hayden-type-heading {
        font-size: var(--h1-font-size-desktop);
    }

    .hayden-banner-inner h2.hayden-type-heading,
    .hayden-testimonial-inner h2.hayden-type-heading,
    .hayden-media-text-inner h2.hayden-type-heading,
    .hayden-features h2.hayden-type-heading {
        font-size: var(--h2-font-size-desktop);
    }

    .hayden-banner-inner h3.hayden-type-heading,
    .hayden-testimonial-inner h3.hayden-type-heading,
    .hayden-media-text-inner h3.hayden-type-heading,
    .hayden-features h3.hayden-type-heading {
        font-size: var(--h3-font-size-desktop);
    }
}

/* Default body text - uses customizer body sizing */
.hayden-banner-inner .hayden-type-body,
.hayden-testimonial-inner .hayden-type-body,
.hayden-media-text-inner .hayden-type-body,
.hayden-features .hayden-type-body {
    font-size: var(--body-font-size-mobile);
}

@media (min-width: 768px) {
    .hayden-banner-inner .hayden-type-body,
    .hayden-testimonial-inner .hayden-type-body,
    .hayden-media-text-inner .hayden-type-body,
    .hayden-features .hayden-type-body {
        font-size: var(--body-font-size-desktop);
    }
}

/* ----------------------
   HEADING FONT SIZES (Mobile-first, responsive)
   Now includes nested block support - inner blocks control their own typography
   Mobile scales down one level from desktop (like customizer)
   These override the default customizer variables above
------------------------- */

/* text-sm */
.hayden-type.hayden-type--heading-sm.hayden-hero > .hayden-hero-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-sm.hayden-banner > .hayden-banner-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-sm.hayden-cta-primary > .hayden-hero-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-sm.hayden-faq > .hayden-faq-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-sm.hayden-section > .hayden-section-inner > .hayden-type-heading,
.hayden-type.hayden-type--heading-sm.hayden-testimonial > .hayden-testimonial-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-sm.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-sm.hayden-media-text > .hayden-media-text-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-sm.hayden-features .hayden-type-heading {
    font-size: var(--text-sm); /* Mobile: sm */
    line-height: 1.25rem;
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--heading-sm.hayden-hero > .hayden-hero-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-sm.hayden-banner > .hayden-banner-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-sm.hayden-cta-primary > .hayden-hero-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-sm.hayden-faq > .hayden-faq-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-sm.hayden-section > .hayden-section-inner > .hayden-type-heading,
    .hayden-type.hayden-type--heading-sm.hayden-testimonial > .hayden-testimonial-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-sm.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-sm.hayden-media-text > .hayden-media-text-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-sm.hayden-features .hayden-type-heading {
        font-size: var(--text-sm); /* Desktop: sm */
    }
}

/* text-base */
.hayden-type.hayden-type--heading-base.hayden-hero > .hayden-hero-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-base.hayden-banner > .hayden-banner-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-base.hayden-cta-primary > .hayden-hero-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-base.hayden-faq > .hayden-faq-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-base.hayden-section > .hayden-section-inner > .hayden-type-heading,
.hayden-type.hayden-type--heading-base.hayden-testimonial > .hayden-testimonial-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-base.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-base.hayden-media-text > .hayden-media-text-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-base.hayden-features .hayden-type-heading {
    font-size: var(--text-sm); /* Mobile: sm */
    line-height: 1.25rem;
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--heading-base.hayden-hero > .hayden-hero-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-base.hayden-banner > .hayden-banner-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-base.hayden-cta-primary > .hayden-hero-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-base.hayden-faq > .hayden-faq-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-base.hayden-section > .hayden-section-inner > .hayden-type-heading,
    .hayden-type.hayden-type--heading-base.hayden-testimonial > .hayden-testimonial-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-base.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-base.hayden-media-text > .hayden-media-text-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-base.hayden-features .hayden-type-heading {
        font-size: var(--text-base); /* Desktop: base */
    }
}

/* text-lg */
.hayden-type.hayden-type--heading-lg.hayden-hero > .hayden-hero-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-lg.hayden-banner > .hayden-banner-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-lg.hayden-cta-primary > .hayden-hero-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-lg.hayden-faq > .hayden-faq-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-lg.hayden-section > .hayden-section-inner > .hayden-type-heading,
.hayden-type.hayden-type--heading-lg.hayden-testimonial > .hayden-testimonial-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-lg.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-lg.hayden-media-text > .hayden-media-text-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-lg.hayden-features .hayden-type-heading {
    font-size: var(--text-base); /* Mobile: base */
    line-height: 1.5rem;
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--heading-lg.hayden-hero > .hayden-hero-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-lg.hayden-banner > .hayden-banner-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-lg.hayden-cta-primary > .hayden-hero-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-lg.hayden-faq > .hayden-faq-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-lg.hayden-section > .hayden-section-inner > .hayden-type-heading,
    .hayden-type.hayden-type--heading-lg.hayden-testimonial > .hayden-testimonial-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-lg.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-lg.hayden-media-text > .hayden-media-text-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-lg.hayden-features .hayden-type-heading {
        font-size: var(--text-lg); /* Desktop: lg */
    }
}

/* text-xl */
.hayden-type.hayden-type--heading-xl.hayden-hero > .hayden-hero-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-xl.hayden-banner > .hayden-banner-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-xl.hayden-faq > .hayden-faq-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-xl.hayden-section > .hayden-section-inner > .hayden-type-heading,
.hayden-type.hayden-type--heading-xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-xl.hayden-media-text > .hayden-media-text-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-xl.hayden-features .hayden-type-heading {
    font-size: var(--text-lg); /* Mobile: lg */
    line-height: 1.75rem;
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--heading-xl.hayden-hero > .hayden-hero-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-xl.hayden-banner > .hayden-banner-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-xl.hayden-faq > .hayden-faq-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-xl.hayden-section > .hayden-section-inner > .hayden-type-heading,
    .hayden-type.hayden-type--heading-xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-xl.hayden-media-text > .hayden-media-text-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-xl.hayden-features .hayden-type-heading {
        font-size: var(--text-xl); /* Desktop: xl */
    }
}

/* text-2xl */
.hayden-type.hayden-type--heading-2xl.hayden-hero > .hayden-hero-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-2xl.hayden-banner > .hayden-banner-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-2xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-2xl.hayden-faq > .hayden-faq-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-2xl.hayden-section > .hayden-section-inner > .hayden-type-heading,
.hayden-type.hayden-type--heading-2xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-2xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-2xl.hayden-media-text > .hayden-media-text-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-2xl.hayden-features .hayden-type-heading {
    font-size: var(--text-xl); /* Mobile: xl */
    line-height: 1.75rem;
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--heading-2xl.hayden-hero > .hayden-hero-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-2xl.hayden-banner > .hayden-banner-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-2xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-2xl.hayden-faq > .hayden-faq-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-2xl.hayden-section > .hayden-section-inner > .hayden-type-heading,
    .hayden-type.hayden-type--heading-2xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-2xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-2xl.hayden-media-text > .hayden-media-text-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-2xl.hayden-features .hayden-type-heading {
        font-size: var(--text-2xl); /* Desktop: 2xl */
        line-height: 2rem;
    }
}

/* text-3xl */
.hayden-type.hayden-type--heading-3xl.hayden-hero > .hayden-hero-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-3xl.hayden-banner > .hayden-banner-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-3xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-3xl.hayden-faq > .hayden-faq-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-3xl.hayden-section > .hayden-section-inner > .hayden-type-heading,
.hayden-type.hayden-type--heading-3xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-3xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-3xl.hayden-media-text > .hayden-media-text-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-3xl.hayden-features .hayden-type-heading {
    font-size: var(--text-2xl); /* Mobile: 2xl */
    line-height: 2rem;
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--heading-3xl.hayden-hero > .hayden-hero-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-3xl.hayden-banner > .hayden-banner-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-3xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-3xl.hayden-faq > .hayden-faq-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-3xl.hayden-section > .hayden-section-inner > .hayden-type-heading,
    .hayden-type.hayden-type--heading-3xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-3xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-3xl.hayden-media-text > .hayden-media-text-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-3xl.hayden-features .hayden-type-heading {
        font-size: var(--text-3xl); /* Desktop: 3xl */
        line-height: 2.25rem;
    }
}

/* text-4xl */
.hayden-type.hayden-type--heading-4xl.hayden-hero > .hayden-hero-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-4xl.hayden-banner > .hayden-banner-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-4xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-4xl.hayden-faq > .hayden-faq-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-4xl.hayden-section > .hayden-section-inner > .hayden-type-heading,
.hayden-type.hayden-type--heading-4xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-4xl.hayden-media-text > .hayden-media-text-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-4xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-heading,
.hayden-type.hayden-type--heading-4xl.hayden-features .hayden-type-heading {
    font-size: var(--text-3xl); /* Mobile: 3xl */
    line-height: 2.25rem;
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--heading-4xl.hayden-hero > .hayden-hero-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-4xl.hayden-banner > .hayden-banner-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-4xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-4xl.hayden-faq > .hayden-faq-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-4xl.hayden-section > .hayden-section-inner > .hayden-type-heading,
    .hayden-type.hayden-type--heading-4xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-4xl.hayden-media-text > .hayden-media-text-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-4xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-heading,
    .hayden-type.hayden-type--heading-4xl.hayden-features .hayden-type-heading {
        font-size: var(--text-4xl); /* Desktop: 4xl */
        line-height: 2.5rem;
    }
}

/* ----------------------
   BODY FONT SIZES (Mobile-first, responsive)
   Using :not() to exclude nested blocks
   Mobile scales down one level from desktop (like customizer)
------------------------- */

/* text-sm */
.hayden-type.hayden-type--body-sm.hayden-hero > .hayden-hero-inner .hayden-type-body,
.hayden-type.hayden-type--body-sm.hayden-banner > .hayden-banner-inner .hayden-type-body,
.hayden-type.hayden-type--body-sm.hayden-cta-primary > .hayden-hero-inner .hayden-type-body,
.hayden-type.hayden-type--body-sm.hayden-faq > .hayden-faq-inner .hayden-type-body,
.hayden-type.hayden-type--body-sm.hayden-section > .hayden-section-inner > .hayden-type-body,
.hayden-type.hayden-type--body-sm.hayden-testimonial > .hayden-testimonial-inner .hayden-type-body,
.hayden-type.hayden-type--body-sm.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-body,
.hayden-type.hayden-type--body-sm.hayden-media-text > .hayden-media-text-inner .hayden-type-body,
.hayden-type.hayden-type--body-sm.hayden-features .hayden-type-body {
    font-size: var(--text-sm); /* Mobile: sm */
    line-height: var(--body-line-height, 1.6);
}

/* text-base */
.hayden-type.hayden-type--body-base.hayden-hero > .hayden-hero-inner .hayden-type-body,
.hayden-type.hayden-type--body-base.hayden-banner > .hayden-banner-inner .hayden-type-body,
.hayden-type.hayden-type--body-base.hayden-cta-primary > .hayden-hero-inner .hayden-type-body,
.hayden-type.hayden-type--body-base.hayden-faq > .hayden-faq-inner .hayden-type-body,
.hayden-type.hayden-type--body-base.hayden-section > .hayden-section-inner > .hayden-type-body,
.hayden-type.hayden-type--body-base.hayden-testimonial > .hayden-testimonial-inner .hayden-type-body,
.hayden-type.hayden-type--body-base.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-body,
.hayden-type.hayden-type--body-base.hayden-media-text > .hayden-media-text-inner .hayden-type-body,
.hayden-type.hayden-type--body-base.hayden-features .hayden-type-body {
    font-size: var(--text-sm); /* Mobile: sm */
    line-height: var(--body-line-height, 1.6);
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--body-base.hayden-hero > .hayden-hero-inner .hayden-type-body,
    .hayden-type.hayden-type--body-base.hayden-banner > .hayden-banner-inner .hayden-type-body,
    .hayden-type.hayden-type--body-base.hayden-cta-primary > .hayden-hero-inner .hayden-type-body,
    .hayden-type.hayden-type--body-base.hayden-faq > .hayden-faq-inner .hayden-type-body,
    .hayden-type.hayden-type--body-base.hayden-section > .hayden-section-inner > .hayden-type-body,
    .hayden-type.hayden-type--body-base.hayden-testimonial > .hayden-testimonial-inner .hayden-type-body,
    .hayden-type.hayden-type--body-base.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-body,
    .hayden-type.hayden-type--body-base.hayden-media-text > .hayden-media-text-inner .hayden-type-body,
    .hayden-type.hayden-type--body-base.hayden-features .hayden-type-body {
        font-size: var(--text-base); /* Desktop: base */
        line-height: var(--body-line-height, 1.6);
    }
}

/* text-lg */
.hayden-type.hayden-type--body-lg.hayden-hero > .hayden-hero-inner .hayden-type-body,
.hayden-type.hayden-type--body-lg.hayden-banner > .hayden-banner-inner .hayden-type-body,
.hayden-type.hayden-type--body-lg.hayden-cta-primary > .hayden-hero-inner .hayden-type-body,
.hayden-type.hayden-type--body-lg.hayden-faq > .hayden-faq-inner .hayden-type-body,
.hayden-type.hayden-type--body-lg.hayden-section > .hayden-section-inner > .hayden-type-body,
.hayden-type.hayden-type--body-lg.hayden-testimonial > .hayden-testimonial-inner .hayden-type-body,
.hayden-type.hayden-type--body-lg.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-body,
.hayden-type.hayden-type--body-lg.hayden-media-text > .hayden-media-text-inner .hayden-type-body,
.hayden-type.hayden-type--body-lg.hayden-features .hayden-type-body {
    font-size: var(--text-base); /* Mobile: base */
    line-height: var(--body-line-height, 1.6);
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--body-lg.hayden-hero > .hayden-hero-inner .hayden-type-body,
    .hayden-type.hayden-type--body-lg.hayden-banner > .hayden-banner-inner .hayden-type-body,
    .hayden-type.hayden-type--body-lg.hayden-cta-primary > .hayden-hero-inner .hayden-type-body,
    .hayden-type.hayden-type--body-lg.hayden-faq > .hayden-faq-inner .hayden-type-body,
    .hayden-type.hayden-type--body-lg.hayden-section > .hayden-section-inner > .hayden-type-body,
    .hayden-type.hayden-type--body-lg.hayden-testimonial > .hayden-testimonial-inner .hayden-type-body,
    .hayden-type.hayden-type--body-lg.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-body,
    .hayden-type.hayden-type--body-lg.hayden-media-text > .hayden-media-text-inner .hayden-type-body,
    .hayden-type.hayden-type--body-lg.hayden-features .hayden-type-body {
        font-size: var(--text-lg); /* Desktop: lg */
        line-height: var(--body-line-height, 1.6);
    }
}

/* text-xl */
.hayden-type.hayden-type--body-xl.hayden-hero > .hayden-hero-inner .hayden-type-body,
.hayden-type.hayden-type--body-xl.hayden-banner > .hayden-banner-inner .hayden-type-body,
.hayden-type.hayden-type--body-xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-body,
.hayden-type.hayden-type--body-xl.hayden-faq > .hayden-faq-inner .hayden-type-body,
.hayden-type.hayden-type--body-xl.hayden-section > .hayden-section-inner > .hayden-type-body,
.hayden-type.hayden-type--body-xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-body,
.hayden-type.hayden-type--body-xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-body,
.hayden-type.hayden-type--body-xl.hayden-media-text > .hayden-media-text-inner .hayden-type-body,
.hayden-type.hayden-type--body-xl.hayden-features .hayden-type-body {
    font-size: var(--text-lg); /* Mobile: lg */
    line-height: var(--body-line-height, 1.6);
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--body-xl.hayden-hero > .hayden-hero-inner .hayden-type-body,
    .hayden-type.hayden-type--body-xl.hayden-banner > .hayden-banner-inner .hayden-type-body,
    .hayden-type.hayden-type--body-xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-body,
    .hayden-type.hayden-type--body-xl.hayden-faq > .hayden-faq-inner .hayden-type-body,
    .hayden-type.hayden-type--body-xl.hayden-section > .hayden-section-inner > .hayden-type-body,
    .hayden-type.hayden-type--body-xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-body,
    .hayden-type.hayden-type--body-xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-body,
    .hayden-type.hayden-type--body-xl.hayden-media-text > .hayden-media-text-inner .hayden-type-body,
    .hayden-type.hayden-type--body-xl.hayden-features .hayden-type-body {
        font-size: var(--text-xl); /* Desktop: xl */
    }
}

/* text-2xl */
.hayden-type.hayden-type--body-2xl.hayden-hero > .hayden-hero-inner .hayden-type-body,
.hayden-type.hayden-type--body-2xl.hayden-banner > .hayden-banner-inner .hayden-type-body,
.hayden-type.hayden-type--body-2xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-body,
.hayden-type.hayden-type--body-2xl.hayden-faq > .hayden-faq-inner .hayden-type-body,
.hayden-type.hayden-type--body-2xl.hayden-section > .hayden-section-inner > .hayden-type-body,
.hayden-type.hayden-type--body-2xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-body,
.hayden-type.hayden-type--body-2xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-body,
.hayden-type.hayden-type--body-2xl.hayden-media-text > .hayden-media-text-inner .hayden-type-body,
.hayden-type.hayden-type--body-2xl.hayden-features .hayden-type-body {
    font-size: var(--text-xl); /* Mobile: xl */
    line-height: var(--body-line-height, 1.6);
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--body-2xl.hayden-hero > .hayden-hero-inner .hayden-type-body,
    .hayden-type.hayden-type--body-2xl.hayden-banner > .hayden-banner-inner .hayden-type-body,
    .hayden-type.hayden-type--body-2xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-body,
    .hayden-type.hayden-type--body-2xl.hayden-faq > .hayden-faq-inner .hayden-type-body,
    .hayden-type.hayden-type--body-2xl.hayden-section > .hayden-section-inner > .hayden-type-body,
    .hayden-type.hayden-type--body-2xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-body,
    .hayden-type.hayden-type--body-2xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-body,
    .hayden-type.hayden-type--body-2xl.hayden-media-text > .hayden-media-text-inner .hayden-type-body,
    .hayden-type.hayden-type--body-2xl.hayden-features .hayden-type-body {
        font-size: var(--text-2xl); /* Desktop: 2xl */
        line-height: var(--body-line-height, 1.6);
    }
}

/* text-3xl */
.hayden-type.hayden-type--body-3xl.hayden-hero > .hayden-hero-inner .hayden-type-body,
.hayden-type.hayden-type--body-3xl.hayden-banner > .hayden-banner-inner .hayden-type-body,
.hayden-type.hayden-type--body-3xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-body,
.hayden-type.hayden-type--body-3xl.hayden-faq > .hayden-faq-inner .hayden-type-body,
.hayden-type.hayden-type--body-3xl.hayden-section > .hayden-section-inner > .hayden-type-body,
.hayden-type.hayden-type--body-3xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-body,
.hayden-type.hayden-type--body-3xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-body,
.hayden-type.hayden-type--body-3xl.hayden-media-text > .hayden-media-text-inner .hayden-type-body,
.hayden-type.hayden-type--body-3xl.hayden-features .hayden-type-body {
    font-size: var(--text-2xl); /* Mobile: 2xl */
    line-height: var(--body-line-height, 1.6);
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--body-3xl.hayden-hero > .hayden-hero-inner .hayden-type-body,
    .hayden-type.hayden-type--body-3xl.hayden-banner > .hayden-banner-inner .hayden-type-body,
    .hayden-type.hayden-type--body-3xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-body,
    .hayden-type.hayden-type--body-3xl.hayden-faq > .hayden-faq-inner .hayden-type-body,
    .hayden-type.hayden-type--body-3xl.hayden-section > .hayden-section-inner > .hayden-type-body,
    .hayden-type.hayden-type--body-3xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-body,
    .hayden-type.hayden-type--body-3xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-body,
    .hayden-type.hayden-type--body-3xl.hayden-media-text > .hayden-media-text-inner .hayden-type-body,
    .hayden-type.hayden-type--body-3xl.hayden-features .hayden-type-body {
        font-size: var(--text-3xl); /* Desktop: 3xl */
        line-height: var(--body-line-height, 1.6);
    }
}

/* text-4xl */
.hayden-type.hayden-type--body-4xl.hayden-hero > .hayden-hero-inner .hayden-type-body,
.hayden-type.hayden-type--body-4xl.hayden-banner > .hayden-banner-inner .hayden-type-body,
.hayden-type.hayden-type--body-4xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-body,
.hayden-type.hayden-type--body-4xl.hayden-faq > .hayden-faq-inner .hayden-type-body,
.hayden-type.hayden-type--body-4xl.hayden-section > .hayden-section-inner > .hayden-type-body,
.hayden-type.hayden-type--body-4xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-body,
.hayden-type.hayden-type--body-4xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-body,
.hayden-type.hayden-type--body-4xl.hayden-media-text > .hayden-media-text-inner .hayden-type-body,
.hayden-type.hayden-type--body-4xl.hayden-features .hayden-type-body {
    font-size: var(--text-3xl); /* Mobile: 3xl */
    line-height: var(--body-line-height, 1.6);
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--body-4xl.hayden-hero > .hayden-hero-inner .hayden-type-body,
    .hayden-type.hayden-type--body-4xl.hayden-banner > .hayden-banner-inner .hayden-type-body,
    .hayden-type.hayden-type--body-4xl.hayden-cta-primary > .hayden-hero-inner .hayden-type-body,
    .hayden-type.hayden-type--body-4xl.hayden-faq > .hayden-faq-inner .hayden-type-body,
    .hayden-type.hayden-type--body-4xl.hayden-section > .hayden-section-inner > .hayden-type-body,
    .hayden-type.hayden-type--body-4xl.hayden-testimonial > .hayden-testimonial-inner .hayden-type-body,
    .hayden-type.hayden-type--body-4xl.hayden-blog-feed > .hayden-blog-feed-inner .hayden-type-body,
    .hayden-type.hayden-type--body-4xl.hayden-media-text > .hayden-media-text-inner .hayden-type-body,
    .hayden-type.hayden-type--body-4xl.hayden-features .hayden-type-body {
        font-size: var(--text-4xl); /* Desktop: 4xl */
        line-height: var(--body-line-height, 1.6);
    }
}

/* ===== style.css ===== */

/* =========================================================
   HERO
   ========================================================= */

/* Outer hero card */
.hayden-banner {
    position: relative;
    overflow: hidden;

    /* Default (global) padding - inherits from customizer */
    padding-top: var(--block-padding-y);
    padding-bottom: var(--block-padding-y);
    padding-left: var(--block-padding-x);
    padding-right: var(--block-padding-x);

    margin-inline: auto;
    /* Only apply default spacing if no custom margins are set */
    margin-top: var(--section-space-mobile);
    margin-bottom: var(--section-space-mobile);

    border-radius: var(--radius-2xl);
    background: var(--hb-bg-color, var(--card-bg));
    color: var(--card-text, var(--color-body));
}

.hayden-banner.has-local-spacing {
    margin-top: 0;
    margin-bottom: 0;
}

/* Block-level margin overrides */
/* These override the global spacing when set */
.hayden-banner[data-margin-top="none"] {
    margin-top: 0 !important;
}

.hayden-banner[data-margin-top="small"] {
    margin-top: 4rem !important;
}

.hayden-banner[data-margin-top="medium"] {
    margin-top: 6rem !important;
}

.hayden-banner[data-margin-top="large"] {
    margin-top: 8rem !important;
}

.hayden-banner[data-margin-bottom="none"] {
    margin-bottom: 0 !important;
}

.hayden-banner[data-margin-bottom="small"] {
    margin-bottom: 4rem !important;
}

.hayden-banner[data-margin-bottom="medium"] {
    margin-bottom: 6rem !important;
}

.hayden-banner[data-margin-bottom="large"] {
    margin-bottom: 8rem !important;
}

/* Editor-specific margin overrides to match frontend */
.editor-styles-wrapper .hayden-banner[data-margin-top="none"],
.block-editor-block-list__layout .hayden-banner[data-margin-top="none"] {
    margin-top: 0 !important;
}

.editor-styles-wrapper .hayden-banner[data-margin-bottom="none"],
.block-editor-block-list__layout .hayden-banner[data-margin-bottom="none"] {
    margin-bottom: 0 !important;
}

/* Center content vertically only when enabled */
.hayden-banner[data-center-content="true"] {
    display: flex;
    align-items: center;
}

/* Desktop spacing - only apply if no custom margins are set */
@media (min-width: 768px) {
    .hayden-banner:not([data-margin-top]):not([data-margin-bottom]) {
        margin-top: var(--section-space-desktop);
        margin-bottom: var(--section-space-desktop);
    }

    .hayden-banner.has-local-spacing {
        margin-top: 0;
        margin-bottom: 0;
    }
}

/* Full-width breakout support */
.hayden-banner.alignfull {
    position: relative;
    width: 100vw;
    max-width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    border-radius: 0;
    box-sizing: border-box;
    padding-left: 0;
    padding-right: 0;
}

@media (min-width: 782px) {
    .hayden-banner.alignfull {
        left: 50%;
        right: 50%;
        margin-left: -50vw;
        margin-right: -50vw;
        width: 100vw;
        max-width: 100vw;
        padding-left: 0;
        padding-right: 0;
    }
}



/* Editor-specific full-width support */
.editor-styles-wrapper .hayden-banner.alignfull,
.block-editor-block-list__layout .hayden-banner.alignfull {
    position: relative;
    width: 100%;
    max-width: 100%;
    left: 0;
    right: 0;
    margin-left: 0;
    margin-right: 0;
    /* Match editor content width constraints */
    padding-left: max(1rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
    padding-right: max(1rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
}

/* For nested full-width Banner inside InnerBlocks - don't override, keep normal padding */
.editor-styles-wrapper .wp-block .hayden-banner.alignfull,
.editor-styles-wrapper .wp-block .hayden-banner[data-align="full"],
.block-editor-block-list__layout .wp-block .hayden-banner.alignfull,
.block-editor-block-list__layout .wp-block .hayden-banner[data-align="full"] {
    /* Reset to use the Banner's own padding settings */
    padding: var(--block-padding);
}

/* For editor canvas that uses viewport width */
.wp-block[data-align="full"] .hayden-banner.alignfull {
    width: 100vw;
    max-width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    padding-left: max(1rem, calc((100vw - 100%) / 2));
    padding-right: max(1rem, calc((100vw - 100%) / 2));
}

/* ---------------------------------------------------------
   Block-level padding overrides
   Internal padding should be independent of vertical spacing scale
   Use fixed values that don't change with customizer spacing
   --------------------------------------------------------- */

/* ---------------------------------------------------------
   Height classes (mobile first)
   --------------------------------------------------------- */

.hayden-banner[data-height-mobile="small"] {
    min-height: 20rem !important;
}

.hayden-banner[data-height-mobile="medium"] {
    min-height: 30rem !important;
}

.hayden-banner[data-height-mobile="large"] {
    min-height: 40rem !important;
}

/* Responsive height classes - desktop overrides mobile */
@media (min-width: 768px) {
    .hayden-banner[data-height-desktop="small"] {
        min-height: 20rem !important;
    }

    .hayden-banner[data-height-desktop="medium"] {
        min-height: 30rem !important;
    }

    .hayden-banner[data-height-desktop="large"] {
        min-height: 40rem !important;
    }
}

/* ---------------------------------------------------------
   Background image/video
   --------------------------------------------------------- */

.hayden-banner-background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    overflow: hidden;
}

.hayden-banner-background-image {
    width: 100%;
    height: 100%;
    background-image: var(--hb-bg-image);
    background-size: var(--hb-bg-size, cover);
    background-position: var(--hb-bg-position, center);
    background-repeat: no-repeat;
}

.hayden-banner-background-poster {
    width: 100%;
    height: 100%;
    background-image: var(--hb-bg-poster);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: none;
}

.hayden-banner-background-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

/* Prevent prose typography margins from offsetting background media */
.hayden-banner-background video,
.hayden-banner-background .hayden-banner-background-video {
    margin: 0 !important;
}

/* YouTube iframe - always cover */
.hayden-banner-background-youtube {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 177.77777778vh; /* 16:9 aspect ratio, scaled to cover height */
    min-width: 100%;
    min-height: 100%;
    height: 56.25vw; /* 16:9 aspect ratio, scaled to cover width */
    transform: translate(-50%, -50%);
    pointer-events: none;
    border: none;
    z-index: 0;
}

@media (max-width: 767px) {
    .hayden-banner[data-bg-video="true"] .hayden-banner-background-video {
        display: none;
    }

    .hayden-banner[data-bg-video="true"] .hayden-banner-background-poster {
        display: block;
    }
}

.hayden-banner-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--hb-overlay, rgba(0, 0, 0, 0.2));
    z-index: 1;
}

/* ---------------------------------------------------------
   Inner layout wrapper
   --------------------------------------------------------- */

.hayden-banner-inner {
    max-width: var(--site-max-width, var(--container-content, 72rem));
    width: 100%;
    margin-inline: auto;
    padding-inline: 1rem;
    position: relative;
    z-index: 2;
}

/* Remove inner padding when banner is not full-width (it already has padding) */
.hayden-banner:not(.alignfull) .hayden-banner-inner {
    padding-inline: 0;
}

/* Content alignment */
.hayden-banner[data-content-align="center"] .hayden-banner-inner {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}


.hayden-banner[data-content-align="center"] .hayden-banner-actions .wp-block-buttons {
    justify-content: center;
}

.hayden-banner[data-content-align="center"] .hayden-banner-actions .hayden-buttons {
    margin-left: auto;
    margin-right: auto;
}

.hayden-banner[data-content-align="right"] .hayden-banner-inner {
    margin-left: auto;
    margin-right: 0;
    text-align: right;
}

.hayden-banner[data-content-align="right"] .hayden-banner-actions .wp-block-buttons {
    justify-content: flex-end;
}

.hayden-banner[data-content-align="right"] .hayden-banner-actions .hayden-buttons {
    margin-left: auto;
    margin-right: 0;
}

.hayden-banner[data-content-align="left"] .hayden-banner-inner {
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}

.hayden-banner[data-content-align="left"] .hayden-banner-actions .wp-block-buttons {
    justify-content: flex-start;
}

.hayden-banner[data-content-align="left"] .hayden-banner-actions .hayden-buttons {
    margin-left: 0;
    margin-right: auto;
}

/* ---------------------------------------------------------
   Eyebrow / pre-heading
   --------------------------------------------------------- */

.hayden-banner-eyebrow {
    font-size: 0.75rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 1.5rem;
    color: inherit;
}

/* ---------------------------------------------------------
   Main heading
   Font-size comes from .hayden-type-heading
   --------------------------------------------------------- */

.hayden-banner-heading {
    line-height: 1.1;
    margin: 0 0 1.5rem;
    color: var(--color-headings);
}

/* Ensure inline bold/strong/italic inherit the heading colour */
.hayden-banner-heading strong,
.hayden-banner-heading b,
.hayden-banner-heading em,
.hayden-banner-heading i {
    color: inherit;
}

/* ---------------------------------------------------------
   Body text
   Font-size comes from .hayden-type-body
   --------------------------------------------------------- */

.hayden-banner-text {
    line-height: 1.6;
    margin: 0 0 2.5rem;
    color: var(--color-body);
}

/* Ensure inline bold/strong/italic inherit the text colour */
.hayden-banner-text p {
    color: inherit;
}

/* Editor-specific: Ensure body text color is applied even when nested */
.editor-styles-wrapper .hayden-banner-text,
.block-editor-block-list__layout .hayden-banner-text {
    color: var(--color-body);
}

.editor-styles-wrapper .hayden-banner-text p,
.block-editor-block-list__layout .hayden-banner-text p {
    color: inherit;
}

.hayden-banner-text strong,
.hayden-banner-text b,
.hayden-banner-text em,
.hayden-banner-text i {
    color: inherit;
}

/* Ensure InnerBlocks body content inherits banner text color */
.hayden-banner-inner :where(p, ul, ol, li, a, strong, em, i, b) {
    color: var(--color-body);
}

/* ---------------------------------------------------------
   CTA area
   --------------------------------------------------------- */


.hayden-banner-actions .wp-block-buttons {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    margin: 0;
    padding: 0;
}

.hayden-banner-actions .wp-block-buttons > .wp-block-button {
    margin: 0;
}

.hayden-banner-actions .wp-block-buttons:has(.hayden-banner-button-2) .hayden-banner-button {
    flex: 1 1 0;
    min-width: 0;
}

/* ---------------------------------------------------------
   Hero button base styles
   --------------------------------------------------------- */

.hayden-banner .hayden-banner-button,
.hayden-banner .hayden-banner-button .wp-block-button__link,
.hayden-banner .hayden-banner-button.wp-block-button__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0.85rem 1.9rem;
    border-radius: var(--radius-2xl);

    font-size: 1rem !important;
    font-weight: 600;
    text-decoration: none;

    background-color: var(--color-primary);
    color: #ffffff;

    border: none;
    cursor: pointer;
}

/* ---------------------------------------------------------
   Gutenberg colour support
   --------------------------------------------------------- */

.hayden-banner.has-background {
    background-color: inherit;
}

.hayden-banner.has-text-color {
    color: inherit;
}

/* ---------------------------------------------------------
   Editor: Allow LinkControl scrolling on overflow
   --------------------------------------------------------- */

.block-editor-block-inspector .components-link-control {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
    overflow: auto;
}

.block-editor-block-inspector .components-link-control__search-input-wrapper {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
}

.block-editor-block-inspector .components-link-control__search-input {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
}

.block-editor-block-inspector .components-link-control__search-results-wrapper {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
    overflow: auto;
}

.block-editor-block-inspector .components-link-control__search-results {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
}

.block-editor-block-inspector .components-link-control__field {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
}

/* ---------------------------------------------------------
   Block-level padding overrides via data attributes
   --------------------------------------------------------- */

/* Vertical padding (Y-axis) overrides */
.hayden-banner[data-padding-y="small"] {
    padding-top: var(--block-padding-y-small);
    padding-bottom: var(--block-padding-y-small);
}

.hayden-banner[data-padding-y="medium"] {
    padding-top: var(--block-padding-y-medium);
    padding-bottom: var(--block-padding-y-medium);
}

.hayden-banner[data-padding-y="large"] {
    padding-top: var(--block-padding-y-large);
    padding-bottom: var(--block-padding-y-large);
}

/* Horizontal padding (X-axis) overrides */
.hayden-banner[data-padding-x="small"] {
    padding-left: var(--block-padding-x-small);
    padding-right: var(--block-padding-x-small);
}

.hayden-banner[data-padding-x="medium"] {
    padding-left: var(--block-padding-x-medium);
    padding-right: var(--block-padding-x-medium);
}

.hayden-banner[data-padding-x="large"] {
    padding-left: var(--block-padding-x-large);
    padding-right: var(--block-padding-x-large);
}

/* ===== style.css ===== */

/* =========================================================
   BLOG FEED
   ========================================================= */

/* Outer blog feed card */
.hayden-blog-feed {
    position: relative;
    overflow: hidden;

    /* Default (global) padding - inherits from customizer */
    padding-top: var(--block-padding-y);
    padding-bottom: var(--block-padding-y);
    padding-left: var(--block-padding-x);
    padding-right: var(--block-padding-x);

    margin-inline: auto;
    /* Only apply default spacing if no custom margins are set */
    margin-top: var(--section-space-mobile);
    margin-bottom: var(--section-space-mobile);

    border-radius: var(--radius-2xl);
    background: var(--hb-bg-color, var(--card-bg));
    color: var(--card-text, var(--color-body));
}

.hayden-blog-feed.has-local-spacing {
    margin-top: 0;
    margin-bottom: 0;
}

/* Block-level margin overrides */
/* These override the global spacing when set */
.hayden-blog-feed[data-margin-top="none"] {
    margin-top: 0 !important;
}

.hayden-blog-feed[data-margin-top="small"] {
    margin-top: 4rem !important;
}

.hayden-blog-feed[data-margin-top="medium"] {
    margin-top: 6rem !important;
}

.hayden-blog-feed[data-margin-top="large"] {
    margin-top: 8rem !important;
}

.hayden-blog-feed[data-margin-bottom="none"] {
    margin-bottom: 0 !important;
}

.hayden-blog-feed[data-margin-bottom="small"] {
    margin-bottom: 4rem !important;
}

.hayden-blog-feed[data-margin-bottom="medium"] {
    margin-bottom: 6rem !important;
}

.hayden-blog-feed[data-margin-bottom="large"] {
    margin-bottom: 8rem !important;
}

/* Editor-specific margin overrides to match frontend */
.editor-styles-wrapper .hayden-blog-feed[data-margin-top="none"],
.block-editor-block-list__layout .hayden-blog-feed[data-margin-top="none"] {
    margin-top: 0 !important;
}

.editor-styles-wrapper .hayden-blog-feed[data-margin-bottom="none"],
.block-editor-block-list__layout .hayden-blog-feed[data-margin-bottom="none"] {
    margin-bottom: 0 !important;
}

/* Desktop spacing - only apply if no custom margins are set */
@media (min-width: 768px) {
    .hayden-blog-feed:not([data-margin-top]):not([data-margin-bottom]) {
        margin-top: var(--section-space-desktop);
        margin-bottom: var(--section-space-desktop);
    }

    .hayden-blog-feed.has-local-spacing {
        margin-top: 0;
        margin-bottom: 0;
    }
}

/* Full-width breakout support */
.hayden-blog-feed.alignfull {
    position: relative;
    width: 100vw;
    max-width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    border-radius: 0;
    /* Ensure padding doesn't increase the total width */
    box-sizing: border-box;
    /* Default padding for full-width with no spacing set */
    padding-left: max(2rem, calc((100vw - var(--site-max-width, 90rem)) / 2));
    padding-right: max(2rem, calc((100vw - var(--site-max-width, 90rem)) / 2));
}

@media (min-width: 782px) {
    .hayden-blog-feed.alignfull {
        left: 50%;
        right: 50%;
        margin-left: -50vw;
        margin-right: -50vw;
        width: 100vw;
        max-width: 100vw;
        padding-left: max(2rem, calc((100vw - var(--site-max-width, 90rem)) / 1.9));
        padding-right: max(2rem, calc((100vw - var(--site-max-width, 90rem)) / 1.9 ));
    }
}

/* Editor-specific full-width support */
.editor-styles-wrapper .hayden-blog-feed.alignfull,
.block-editor-block-list__layout .hayden-blog-feed.alignfull {
    position: relative;
    width: 100%;
    max-width: 100%;
    left: 0;
    right: 0;
    margin-left: 0;
    margin-right: 0;
    /* Match editor content width constraints */
    padding-left: max(1rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
    padding-right: max(1rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
}

/* ---------------------------------------------------------
   Block-level padding overrides
   Internal padding should be independent of vertical spacing scale
   Use fixed values that don't change with customizer spacing
   --------------------------------------------------------- */

/* ---------------------------------------------------------
   Inner layout wrapper
   ------------------------------------------------- */

.hayden-blog-feed-inner {
    max-width: 48rem;
    position: relative;
    margin-bottom: 3rem;
}

/* Content alignment */
.hayden-blog-feed[data-content-align="center"] .hayden-blog-feed-inner {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.hayden-blog-feed[data-content-align="right"] .hayden-blog-feed-inner {
    margin-left: auto;
    margin-right: 0;
    text-align: right;
}

.hayden-blog-feed[data-content-align="left"] .hayden-blog-feed-inner {
    margin-left: 0;
    margin-right: auto;
    text-align: left;
}

/* ---------------------------------------------------------
   Eyebrow / pre-heading
   ------------------------------------------------- */

.hayden-blog-feed-eyebrow {
    font-size: 0.75rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 1.5rem;
    color: var(--hb-eyebrow-color, var(--hb-text-color, var(--color-body)));
}

/* ---------------------------------------------------------
   Main heading
   Font-size comes from .hayden-type-heading
   ------------------------------------------------- */

.hayden-blog-feed-heading {
    line-height: 1.1;
    margin: 0 0 1.5rem;
    color: var(--hb-heading-color, inherit);
}

/* Ensure inline bold/strong/italic inherit the heading colour */
.hayden-blog-feed-heading strong,
.hayden-blog-feed-heading b,
.hayden-blog-feed-heading em,
.hayden-blog-feed-heading i {
    color: inherit;
}

/* ---------------------------------------------------------
   Body text
   Font-size comes from .hayden-type-body
   ------------------------------------------------- */

.hayden-blog-feed-text {
    line-height: 1.6;
    margin: 0;
    color: var(--hb-text-color, inherit);
}

/* Ensure inline bold/strong/italic inherit the text colour */
.hayden-blog-feed-text p {
    color: inherit;
}

/* Editor-specific: Ensure body text color is applied even when nested */
.editor-styles-wrapper .hayden-blog-feed-text,
.block-editor-block-list__layout .hayden-blog-feed-text {
    color: var(--hb-text-color, var(--card-text, var(--color-body)));
}

.editor-styles-wrapper .hayden-blog-feed-text p,
.block-editor-block-list__layout .hayden-blog-feed-text p {
    color: inherit;
}

.hayden-blog-feed-text strong,
.hayden-blog-feed-text b,
.hayden-blog-feed-text em,
.hayden-blog-feed-text i {
    color: inherit;
}

/* ---------------------------------------------------------
   See more button
   ------------------------------------------------- */

.hayden-blog-feed-see-more {
    grid-column: 1 / -1;
    display: flex;
    justify-content: center;
    padding: 1.5rem 0;
}

.hayden-blog-feed-load-more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.85rem 1.9rem;
    border-radius: var(--radius-pill, var(--radius-2xl, 9999px));
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    border: 1px solid transparent;
    background-color: var(--hb-button-bg, var(--color-primary, #0066cc));
    color: var(--hb-button-text, #ffffff);
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.hayden-blog-feed-load-more:hover {
    background-color: var(--hb-button-bg-hover, #0052a3);
    color: var(--hb-button-text-hover, #ffffff);
    transform: translateY(-1px);
}

.hayden-blog-feed-load-more:focus-visible {
    outline: 2px solid var(--hb-button-bg, var(--color-primary, #0066cc));
    outline-offset: 2px;
}

.hayden-blog-feed-load-more:disabled,
.hayden-blog-feed-load-more.is-loading {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

/* ---------------------------------------------------------
   Grid Layout
   ------------------------------------------------- */

.hayden-blog-feed-grid {
    display: grid;
    grid-template-columns: repeat(var(--columns, 3), 1fr);
    gap: 1.5rem;
}

/* Constrain grid width in full-width mode */
.hayden-blog-feed.alignfull .hayden-blog-feed-grid {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 768px) {
    .hayden-blog-feed-grid {
        gap: 2rem;
    }
}

/* Responsive Grid Columns */
@media (max-width: 639px) {
    .hayden-blog-feed-grid {
        grid-template-columns: 1fr;
        --columns: 1;
    }
}

@media (min-width: 640px) and (max-width: 1023px) {
    .hayden-blog-feed-grid[data-columns="1"] {
        grid-template-columns: 1fr;
    }

    .hayden-blog-feed-grid[data-columns="2"],
    .hayden-blog-feed-grid[data-columns="3"],
    .hayden-blog-feed-grid[data-columns="4"] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .hayden-blog-feed-grid[data-columns="1"] {
        grid-template-columns: 1fr;
    }

    .hayden-blog-feed-grid[data-columns="2"] {
        grid-template-columns: repeat(2, 1fr);
    }

    .hayden-blog-feed-grid[data-columns="3"] {
        grid-template-columns: repeat(3, 1fr);
    }

    .hayden-blog-feed-grid[data-columns="4"] {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* ---------------------------------------------------------
   Blog Card Styling
   ------------------------------------------------- */

.blog-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    background-color: var(--hb-card-bg-color, var(--card-bg-alt, var(--card-bg, white)));
}

.blog-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

.blog-card .aspect-video {
    width: 100%;
    aspect-ratio: 16 / 9;
    background-color: var(--card-bg, #f3f4f6);
}

.blog-card .aspect-video img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blog-card > div {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.blog-card h3 {
    color: var(--hb-card-title-color, var(--card-heading, var(--card-text, #000)));
    font-weight: 600;
    line-height: 1.4;
    margin: 0;
    margin-bottom: 0.5rem;
}

.blog-card .text-sm {
    font-size: var(--text-sm, 0.875rem);
}

.blog-card .text-lg {
    font-size: var(--text-lg, 1.125rem);
}

.hayden-blog-feed .blog-card .text-body-muted {
    color: var(--hb-card-text-color, var(--card-text, var(--color-body, #666)));
}

.blog-card a {
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

.blog-card .link-primary {
    color: var(--hb-card-link-color, var(--card-link, var(--color-primary, #0066cc)));
}

.blog-card .link-primary:hover {
    color: var(--color-primary-dark, #004499);
}

/* ---------------------------------------------------------
   Gutenberg colour support
   ------------------------------------------------- */

.hayden-blog-feed.has-background {
    background-color: inherit;
}

.hayden-blog-feed.has-text-color {
    color: inherit;
}

/* ---------------------------------------------------------
   Block-level padding overrides via data attributes
   --------------------------------------------------------- */

/* Vertical padding (Y-axis) overrides */
.hayden-blog-feed[data-padding-y="small"] {
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
}

@media (min-width: 768px) {
    .hayden-blog-feed[data-padding-y="small"] {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }
}

.hayden-blog-feed[data-padding-y="medium"] {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

@media (min-width: 768px) {
    .hayden-blog-feed[data-padding-y="medium"] {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }
}

.hayden-blog-feed[data-padding-y="large"] {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
}

@media (min-width: 768px) {
    .hayden-blog-feed[data-padding-y="large"] {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }
}

/* Horizontal padding (X-axis) overrides */
.hayden-blog-feed[data-padding-x="small"] {
    padding-left: var(--block-padding-x-small);
    padding-right: var(--block-padding-x-small);
}

.hayden-blog-feed[data-padding-x="medium"] {
    padding-left: var(--block-padding-x-medium);
    padding-right: var(--block-padding-x-medium);
}

.hayden-blog-feed[data-padding-x="large"] {
    padding-left: var(--block-padding-x-large);
    padding-right: var(--block-padding-x-large);
}

/* ===== style.css ===== */

/* Individual button */
.hayden-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.85rem 1.9rem;
    border-radius: var(--radius-2xl);
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    background-color: var(--hb-btn-bg, var(--color-primary, #f97316));
    color: var(--hb-btn-text, #ffffff);
    border: none;
    cursor: pointer;
    transition: transform 150ms ease, opacity 150ms ease;
}

.hayden-button:hover {
    opacity: 0.92;
    transform: translateY(-1px);
}

.hayden-button:active {
    transform: translateY(0);
}

/* Editor-specific */
.wp-block-smart-button .hayden-button {
    display: inline-flex;
    padding: 0.85rem 1.9rem;
}

/* ===== style.css ===== */

/* Buttons container */
.hayden-buttons {
    display: grid;
    gap: 0.75rem;
    width: 100%;
    grid-template-columns: repeat(auto-fit, minmax(min(var(--hb-btn-min-width, 160px), 100%), 1fr));
}

.hayden-buttons[data-align="center"] {
    justify-content: center;
}

.hayden-buttons[data-align="right"] {
    justify-content: end;
}

/* Tablet and up: use exact width, no stretching */
@media (min-width: 768px) {
    .hayden-buttons {
        grid-template-columns: repeat(auto-fit, var(--hb-btn-min-width, 160px));
    }
}

/* Editor-specific: Use flex for .hayden-buttons in admin */
.editor-styles-wrapper .hayden-buttons,
.block-editor-block-list__layout .hayden-buttons {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
}

.editor-styles-wrapper .hayden-buttons > .hayden-button,
.block-editor-block-list__layout .hayden-buttons > .hayden-button {
    flex: 0 0 auto !important;
    width: var(--hb-btn-min-width, 160px) !important;
}

/* Editor-specific gap */
.wp-block-smart-buttons > .block-editor-inner-blocks > .block-editor-block-list__layout {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 0.75rem !important;
    width: 100% !important;
}

.wp-block-smart-buttons > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block {
    flex: 0 0 auto !important;
    width: var(--hb-btn-min-width, 160px) !important;
    max-width: var(--hb-btn-min-width, 160px) !important;
}

.wp-block-smart-buttons[data-align="center"] > .block-editor-inner-blocks > .block-editor-block-list__layout {
    justify-content: center !important;
}

.wp-block-smart-buttons[data-align="right"] > .block-editor-inner-blocks > .block-editor-block-list__layout {
    justify-content: flex-end !important;
}

/* ===== style.css ===== */

/* =========================================================
   FAQ
   ========================================================= */

/* Outer FAQ card */
.hayden-faq {
    position: relative;

    /* Default (global) padding */
    padding-top: var(--block-padding-y);
    padding-bottom: var(--block-padding-y);
    padding-left: var(--block-padding-x);
    padding-right: var(--block-padding-x);

    margin-inline: auto;
    margin-top: var(--section-space-mobile);
    margin-bottom: var(--section-space-mobile);

    border-radius: var(--radius-2xl);
    background: var(--hb-bg-color, var(--card-bg));
    color: var(--hb-text-color, var(--card-text, var(--color-body)));
}

.hayden-faq.has-local-spacing {
    margin-top: 0;
    margin-bottom: 0;
}

/* Desktop spacing */
@media (min-width: 768px) {
    .hayden-faq {
        margin-top: var(--section-space-desktop);
        margin-bottom: var(--section-space-desktop);
    }

    .hayden-faq.has-local-spacing {
        margin-top: 0;
        margin-bottom: 0;
    }
}

/* ---------------------------------------------------------
   Block-level padding overrides
   --------------------------------------------------------- */

/* ---------------------------------------------------------
   Content Alignment (data-content-align)
   --------------------------------------------------------- */

.hayden-faq[data-content-align="center"] .hayden-faq-inner {
    text-align: center;
    margin-inline: auto;
}

.hayden-faq[data-content-align="right"] .hayden-faq-inner {
    text-align: right;
    margin-left: auto;
}

/* ---------------------------------------------------------
   Top/Bottom Margin Overrides (data-margin-top/bottom)
   --------------------------------------------------------- */

.hayden-faq[data-margin-top="none"] {
    margin-top: 0 !important;
}

.hayden-faq[data-margin-top="small"] {
    margin-top: 4rem !important;
}

.hayden-faq[data-margin-top="medium"] {
    margin-top: 6rem !important;
}

.hayden-faq[data-margin-top="large"] {
    margin-top: 8rem !important;
}

.hayden-faq[data-margin-bottom="none"] {
    margin-bottom: 0 !important;
}

.hayden-faq[data-margin-bottom="small"] {
    margin-bottom: 4rem !important;
}

.hayden-faq[data-margin-bottom="medium"] {
    margin-bottom: 6rem !important;
}

.hayden-faq[data-margin-bottom="large"] {
    margin-bottom: 8rem !important;
}

/* Editor-specific margin overrides to match frontend */
.editor-styles-wrapper .hayden-faq[data-margin-top="none"],
.block-editor-block-list__layout .hayden-faq[data-margin-top="none"] {
    margin-top: 0 !important;
}

.editor-styles-wrapper .hayden-faq[data-margin-bottom="none"],
.block-editor-block-list__layout .hayden-faq[data-margin-bottom="none"] {
    margin-bottom: 0 !important;
}

/* ---------------------------------------------------------
   Height Control (data-height-mobile/desktop)
   --------------------------------------------------------- */

.hayden-faq[data-height-mobile="small"] {
    min-height: 20rem;
}

.hayden-faq[data-height-mobile="medium"] {
    min-height: 30rem;
}

.hayden-faq[data-height-mobile="large"] {
    min-height: 40rem;
}

@media (min-width: 768px) {
    .hayden-faq[data-height-desktop="small"] {
        min-height: 20rem;
    }

    .hayden-faq[data-height-desktop="medium"] {
        min-height: 30rem;
    }

    .hayden-faq[data-height-desktop="large"] {
        min-height: 40rem;
    }
}

/* ---------------------------------------------------------
   Inner layout wrapper
   --------------------------------------------------------- */

.hayden-faq-inner {
    max-width: 48rem;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 2;
}

/* Content alignment */
.hayden-faq[data-content-align="center"] .hayden-faq-inner {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.hayden-faq[data-content-align="right"] .hayden-faq-inner {
    margin-left: auto;
    margin-right: 0;
    text-align: right;
}

.hayden-faq[data-content-align="left"] .hayden-faq-inner {
    margin-left: 0;
    margin-right: auto;
    text-align: left;
}

/* ---------------------------------------------------------
   Heading
   --------------------------------------------------------- */

.hayden-faq-heading {
    line-height: 1.1;
    margin: 0 0 1.5rem;
    color: var(--hb-heading-color, var(--color-headings));
}

/* ---------------------------------------------------------
   Intro text
   --------------------------------------------------------- */

.hayden-faq-text {
    line-height: 1.6;
    margin: 0 0 2.5rem;
    color: var(--color-body);
}

/* Ensure body paragraphs inherit/receive the chosen text color */
.hayden-faq-text p {
    color: var(--color-body);
}

/* ---------------------------------------------------------
   FAQ List
   --------------------------------------------------------- */

.hayden-faq-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* ---------------------------------------------------------
   FAQ Item
   --------------------------------------------------------- */

.hayden-faq-item {
    border-radius: var(--radius-lg);
    overflow: hidden;
}

/* ---------------------------------------------------------
   FAQ Question (Accordion Header)
   --------------------------------------------------------- */

.hayden-faq-question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 1.25rem 1.5rem;
    border: none;
    border-radius: var(--radius-lg);
    background-color: var(--hb-accordion-bg, #ffffff);
    color: var(--hb-question-color, var(--color-body));
    font-weight: 600;
    font-size: 1.25rem;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

/* H2 questions */
.hayden-faq--question-h2 .hayden-faq-question {
    font-size: var(--hb-question-size-mobile, var(--h2-font-size-mobile, 1.5rem));
}

@media (min-width: 768px) {
    .hayden-faq--question-h2 .hayden-faq-question {
        font-size: var(--hb-question-size-desktop, var(--h2-font-size-desktop, 1.75rem));
    }
}

/* H3 questions (default) */
.hayden-faq--question-h3 .hayden-faq-question {
    font-size: var(--hb-question-size-mobile, var(--h3-font-size-mobile, 1.25rem));
}

@media (min-width: 768px) {
    .hayden-faq--question-h3 .hayden-faq-question {
        font-size: var(--hb-question-size-desktop, var(--h3-font-size-desktop, 1.5rem));
    }
}

/* H4 questions */
.hayden-faq--question-h4 .hayden-faq-question {
    font-size: var(--hb-question-size-mobile, var(--h4-font-size-mobile, 1.125rem));
}

@media (min-width: 768px) {
    .hayden-faq--question-h4 .hayden-faq-question {
        font-size: var(--hb-question-size-desktop, var(--h4-font-size-desktop, 1.25rem));
    }
}

/* Ensure heading tags inherit the question font size */
.hayden-faq-question h2,
.hayden-faq-question h3,
.hayden-faq-question h4 {
    font-size: inherit;
    font-weight: inherit;
    margin: 0;
}

/* ---------------------------------------------------------
   Custom Question Scale Overrides (responsive)
   --------------------------------------------------------- */

/* Small */
.hayden-faq--question-scale-sm .hayden-faq-question {
    font-size: var(--text-sm, 0.875rem) !important;
}

/* Base */
.hayden-faq--question-scale-base .hayden-faq-question {
    font-size: var(--text-sm, 0.875rem) !important;
}

@media (min-width: 768px) {
    .hayden-faq--question-scale-base .hayden-faq-question {
        font-size: var(--text-base, 1rem) !important;
    }
}

/* Large */
.hayden-faq--question-scale-lg .hayden-faq-question {
    font-size: var(--text-base, 1rem) !important;
}

@media (min-width: 768px) {
    .hayden-faq--question-scale-lg .hayden-faq-question {
        font-size: var(--text-lg, 1.125rem) !important;
    }
}

/* XL */
.hayden-faq--question-scale-xl .hayden-faq-question {
    font-size: var(--text-lg, 1.125rem) !important;
}

@media (min-width: 768px) {
    .hayden-faq--question-scale-xl .hayden-faq-question {
        font-size: var(--text-xl, 1.25rem) !important;
    }
}

/* 2XL */
.hayden-faq--question-scale-2xl .hayden-faq-question {
    font-size: var(--text-xl, 1.25rem) !important;
}

@media (min-width: 768px) {
    .hayden-faq--question-scale-2xl .hayden-faq-question {
        font-size: var(--text-2xl, 1.5rem) !important;
    }
}

/* 3XL */
.hayden-faq--question-scale-3xl .hayden-faq-question {
    font-size: var(--text-2xl, 1.5rem) !important;
}

@media (min-width: 768px) {
    .hayden-faq--question-scale-3xl .hayden-faq-question {
        font-size: var(--text-3xl, 1.875rem) !important;
    }
}

/* 4XL */
.hayden-faq--question-scale-4xl .hayden-faq-question {
    font-size: var(--text-3xl, 1.875rem) !important;
}

@media (min-width: 768px) {
    .hayden-faq--question-scale-4xl .hayden-faq-question {
        font-size: var(--text-4xl, 2.25rem) !important;
    }
}

.hayden-faq-question:hover {
    background-color: var(--hb-accordion-hover-bg, var(--hb-accordion-bg, #f3f4f6)) !important;
}

.hayden-faq-item.is-open .hayden-faq-question,
.hayden-faq-item[aria-expanded="true"] .hayden-faq-question {
    background-color: var(--hb-accordion-active-bg, var(--hb-accordion-hover-bg, var(--hb-accordion-bg, #e5e7eb)));
}

.hayden-faq-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    margin-left: 1rem;
    font-size: 1.25rem;
    font-weight: 300;
    line-height: 1;
    transition: transform 0.2s ease;
}

.hayden-faq-item.is-open .hayden-faq-icon,
.hayden-faq-item[aria-expanded="true"] .hayden-faq-icon {
    transform: rotate(45deg);
}

/* ---------------------------------------------------------
   FAQ Answer (Accordion Content)
   --------------------------------------------------------- */

.hayden-faq-answer {
    display: none;
    padding: 1rem 1.5rem 1.5rem;
    color: var(--hb-answer-color, var(--hb-text-color, var(--color-body)));
    font-size: var(--hb-answer-size-mobile, var(--body-font-size-mobile, 1rem));
    line-height: 1.6;
    text-align: left;
}

@media (min-width: 768px) {
    .hayden-faq-answer {
        font-size: var(--hb-answer-size-desktop, var(--body-font-size-desktop, 1.125rem));
    }
}

/* ---------------------------------------------------------
   Custom Answer Scale Overrides (responsive)
   --------------------------------------------------------- */

/* Small */
.hayden-faq--answer-scale-sm .hayden-faq-answer {
    font-size: var(--text-sm, 0.875rem) !important;
}

/* Base */
.hayden-faq--answer-scale-base .hayden-faq-answer {
    font-size: var(--text-sm, 0.875rem) !important;
}

@media (min-width: 768px) {
    .hayden-faq--answer-scale-base .hayden-faq-answer {
        font-size: var(--text-base, 1rem) !important;
    }
}

/* Large */
.hayden-faq--answer-scale-lg .hayden-faq-answer {
    font-size: var(--text-base, 1rem) !important;
}

@media (min-width: 768px) {
    .hayden-faq--answer-scale-lg .hayden-faq-answer {
        font-size: var(--text-lg, 1.125rem) !important;
    }
}

/* XL */
.hayden-faq--answer-scale-xl .hayden-faq-answer {
    font-size: var(--text-lg, 1.125rem) !important;
}

@media (min-width: 768px) {
    .hayden-faq--answer-scale-xl .hayden-faq-answer {
        font-size: var(--text-xl, 1.25rem) !important;
    }
}

/* 2XL */
.hayden-faq--answer-scale-2xl .hayden-faq-answer {
    font-size: var(--text-xl, 1.25rem) !important;
}

@media (min-width: 768px) {
    .hayden-faq--answer-scale-2xl .hayden-faq-answer {
        font-size: var(--text-2xl, 1.5rem) !important;
    }
}

/* 3XL */
.hayden-faq--answer-scale-3xl .hayden-faq-answer {
    font-size: var(--text-2xl, 1.5rem) !important;
}

@media (min-width: 768px) {
    .hayden-faq--answer-scale-3xl .hayden-faq-answer {
        font-size: var(--text-3xl, 1.875rem) !important;
    }
}

/* 4XL */
.hayden-faq--answer-scale-4xl .hayden-faq-answer {
    font-size: var(--text-3xl, 1.875rem) !important;
}

@media (min-width: 768px) {
    .hayden-faq--answer-scale-4xl .hayden-faq-answer {
        font-size: var(--text-4xl, 2.25rem) !important;
    }
}

.hayden-faq-item.is-open .hayden-faq-answer,
.hayden-faq-item[aria-expanded="true"] .hayden-faq-answer {
    display: block;
}

.hayden-faq-answer p {
    margin: 0 0 1rem;
}

.hayden-faq-answer p:last-child {
    margin-bottom: 0;
}

/* Ensure paragraphs in FAQ answers are styled correctly */
.hayden-faq-answer-content p {
    margin: 0 0 1rem;
    line-height: 1.6;
    color: inherit;
}

/* ---------------------------------------------------------
   Gutenberg colour support
   --------------------------------------------------------- */

.hayden-faq.has-background {
    background-color: inherit;
}

.hayden-faq.has-text-color {
    color: inherit;
}

/* ---------------------------------------------------------
   Full-width breakout support
   --------------------------------------------------------- */

.hayden-faq.alignfull {
    position: relative;
    width: 100vw;
    max-width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    border-radius: 0;
    padding-left: max(1rem, calc((100vw - 100%) / 2));
    padding-right: max(1rem, calc((100vw - 100%) / 2));
}

@media (min-width: 782px) {
    .hayden-faq.alignfull {
        left: 50%;
        right: 50%;
        margin-left: -50vw;
        margin-right: -50vw;
        width: 100vw;
        max-width: 100vw;
        padding-left: max(1rem, calc((100vw - 100%) / 2));
        padding-right: max(1rem, calc((100vw - 100%) / 2));
    }
}

/* Editor-specific full-width support */
.editor-styles-wrapper .hayden-faq.alignfull,
.block-editor-block-list__layout .hayden-faq.alignfull {
    position: relative;
    width: 100%;
    max-width: 100%;
    left: 0;
    right: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: max(1rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
    padding-right: max(1rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
}

.wp-block[data-align="full"] .hayden-faq.alignfull {
    width: 100vw;
    max-width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    padding-left: max(1rem, calc((100vw - 100%) / 2));
    padding-right: max(1rem, calc((100vw - 100%) / 2));
}

/* ---------------------------------------------------------
   Block-level padding overrides via data attributes
   --------------------------------------------------------- */

/* Vertical padding (Y-axis) overrides */
.hayden-faq[data-padding-y="small"] {
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
}

@media (min-width: 768px) {
    .hayden-faq[data-padding-y="small"] {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }
}

.hayden-faq[data-padding-y="medium"] {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

@media (min-width: 768px) {
    .hayden-faq[data-padding-y="medium"] {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }
}

.hayden-faq[data-padding-y="large"] {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
}

@media (min-width: 768px) {
    .hayden-faq[data-padding-y="large"] {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }
}

/* Horizontal padding (X-axis) overrides */
.hayden-faq[data-padding-x="small"] {
    padding-left: var(--block-padding-x-small);
    padding-right: var(--block-padding-x-small);
}

.hayden-faq[data-padding-x="medium"] {
    padding-left: var(--block-padding-x-medium);
    padding-right: var(--block-padding-x-medium);
}

.hayden-faq[data-padding-x="large"] {
    padding-left: var(--block-padding-x-large);
    padding-right: var(--block-padding-x-large);
}

/* ===== style.css ===== */

/* =========================================================
   FEATURE ITEM
   ========================================================= */

.hayden-feature-item {
    display: flex;
    position: relative;
    width: 100%;
    padding: 1.5rem;
    border-radius: var(--radius-2xl);
    text-align: left;
}

.hayden-feature-item-icon {
    color: var(--hb-feature-icon-color, currentColor);
}

.hayden-feature-item-icon svg {
    display: block;
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: auto;
    fill: currentColor;
    stroke: currentColor;
}

.hayden-feature-item-icon svg * {
    fill: currentColor;
    stroke: currentColor;
}

.hayden-feature-item-icon svg [fill="none"] {
    fill: none;
}

.hayden-feature-item-icon svg [stroke="none"] {
    stroke: none;
}

/* Ensure content inside feature items is always left-aligned */
.hayden-feature-item-content {
    text-align: left;
}

/* Apply feature heading color to all feature item titles */
.hayden-feature-item-title,
.editor-styles-wrapper .hayden-feature-item-title,
.block-editor-block-list__layout .hayden-feature-item-title {
    color: var(--hb-feature-heading-color, var(--card-heading));
}

/* Ensure feature heading color applies inside Features block */
.hayden-features .hayden-feature-item-title {
    color: var(--hb-feature-heading-color, var(--card-heading)) !important;
}

/* Apply feature text color to all feature item descriptions */
.hayden-feature-item-text,
.editor-styles-wrapper .hayden-feature-item-text,
.block-editor-block-list__layout .hayden-feature-item-text {
    color: var(--hb-feature-text-color, var(--card-text-muted));
}

/* Apply feature link color to all links in feature items */
.hayden-feature-item-text a,
.editor-styles-wrapper .hayden-feature-item-text a,
.block-editor-block-list__layout .hayden-feature-item-text a {
    color: var(--hb-feature-link-color, var(--card-text));
}

/* Ensure paragraphs and list items inherit the feature text color */
.hayden-feature-item-text p,
.hayden-feature-item-text li {
    color: inherit;
}

/* Ensure feature body size overrides parent typography */
.hayden-feature-item-text,
.hayden-feature-item-text p,
.hayden-feature-item-text li,
.hayden-feature-item-text .wp-block-paragraph {
    font-size: var(--hb-feature-body-size-mobile, var(--body-font-size-mobile)) !important;
}

@media (min-width: 768px) {
    .hayden-feature-item-text,
    .hayden-feature-item-text p,
    .hayden-feature-item-text li,
    .hayden-feature-item-text .wp-block-paragraph {
        font-size: var(--hb-feature-body-size-desktop, var(--body-font-size-desktop)) !important;
    }
}

/* Support lists in feature item text */
.hayden-feature-item-text ul,
.hayden-feature-item-text ol {
    margin: 0.5rem 0;
    padding-left: 1.5rem;
}

.hayden-feature-item-text li {
    margin: 0.25rem 0;
}

/* Ensure feature text color applies inside Features block */
.hayden-features .hayden-feature-item-text {
    color: var(--hb-feature-text-color, var(--card-text-muted)) !important;
}

/* Apply feature background color to all feature items */
.hayden-feature-item {
    background-color: var(--hb-feature-bg-color, var(--card-bg-alt, var(--card-bg)));
}

/* Ensure feature background color applies inside Features block */
.hayden-features .hayden-feature-item {
    background-color: var(--hb-feature-bg-color, var(--card-bg-alt, var(--card-bg))) !important;
}

/* ---------------------------------------------------------
   STYLE 1: Icon Top (Centered) - Default
   --------------------------------------------------------- */

[data-feature-style="icon-top"] .hayden-feature-item {
    flex-direction: column;
    align-items: center;
    text-align: center;
}

[data-feature-style="icon-top"] .hayden-feature-item-icon {
    width: 64px;
    height: 64px;
    margin-bottom: var(--hb-feature-icon-gap, 24px);
    flex-shrink: 0;
}

[data-feature-style="icon-top"] .hayden-feature-item-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

[data-feature-style="icon-top"] .hayden-feature-item-content {
    width: 100%;
}

[data-feature-style="icon-top"] .hayden-feature-item-title {
    font-size: var(--hb-feature-heading-size-mobile, var(--h3-font-size-mobile));
    font-weight: 600;
    line-height: 1.3;
    margin: 0 0 0.75rem;
}

/* H2 and H4 overrides for icon-top */
[data-feature-style="icon-top"] .hayden-feature-item-title.hayden-feature-item-title:is(h2) {
    font-size: var(--hb-feature-heading-size-mobile, var(--h2-font-size-mobile));
}

@media (min-width: 768px) {
    [data-feature-style="icon-top"] .hayden-feature-item-title {
        font-size: var(--hb-feature-heading-size-desktop, var(--h3-font-size-desktop));
    }
    
    [data-feature-style="icon-top"] .hayden-feature-item-title.hayden-feature-item-title:is(h2) {
        font-size: var(--hb-feature-heading-size-desktop, var(--h2-font-size-desktop));
    }
}

[data-feature-style="icon-top"] .hayden-feature-item-text {
    font-size: var(--hb-feature-body-size-mobile, var(--body-font-size-mobile)) !important;
    line-height: 1.6;
    margin: 0;
    color: var(--card-text-muted, var(--color-body));
}

@media (min-width: 768px) {
    [data-feature-style="icon-top"] .hayden-feature-item-text {
        font-size: var(--hb-feature-body-size-desktop, var(--body-font-size-desktop)) !important;
    }
}

/* ---------------------------------------------------------
   STYLE 2: Icon Left (Horizontal)
   --------------------------------------------------------- */

[data-feature-style="icon-left"] .hayden-feature-item {
    flex-direction: row;
    align-items: flex-start;
    text-align: left;
    gap: var(--hb-feature-icon-gap, 24px);
}

[data-feature-style="icon-left"] .hayden-feature-item-icon {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
}

[data-feature-style="icon-left"] .hayden-feature-item-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

[data-feature-style="icon-left"] .hayden-feature-item-content {
    flex: 1;
}

[data-feature-style="icon-left"] .hayden-feature-item-title {
    font-size: var(--hb-feature-heading-size-mobile, var(--h3-font-size-mobile));
    font-weight: 600;
    line-height: 1.3;
    margin: 0 0 0.5rem;
}

[data-feature-style="icon-left"] .hayden-feature-item-title.hayden-feature-item-title:is(h2) {
    font-size: var(--hb-feature-heading-size-mobile, var(--h2-font-size-mobile));
}

@media (min-width: 768px) {
    [data-feature-style="icon-left"] .hayden-feature-item-title {
        font-size: var(--hb-feature-heading-size-desktop, var(--h3-font-size-desktop));
    }
    
    [data-feature-style="icon-left"] .hayden-feature-item-title.hayden-feature-item-title:is(h2) {
        font-size: var(--hb-feature-heading-size-desktop, var(--h2-font-size-desktop));
    }
}

[data-feature-style="icon-left"] .hayden-feature-item-text {
    font-size: var(--hb-feature-body-size-mobile, var(--body-font-size-mobile)) !important;
    line-height: 1.6;
    margin: 0;
    color: var(--card-text-muted, var(--color-body));
}

@media (min-width: 768px) {
    [data-feature-style="icon-left"] .hayden-feature-item-text {
        font-size: var(--hb-feature-body-size-desktop, var(--body-font-size-desktop)) !important;
    }
}

/* ---------------------------------------------------------
   STYLE 3: Icon Inline (Minimal)
   --------------------------------------------------------- */

[data-feature-style="icon-inline"] .hayden-feature-item {
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

[data-feature-style="icon-inline"] .hayden-feature-item-icon {
    width: 40px;
    height: 40px;
    margin-bottom: var(--hb-feature-icon-gap, 24px);
    flex-shrink: 0;
}

[data-feature-style="icon-inline"] .hayden-feature-item-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

[data-feature-style="icon-inline"] .hayden-feature-item-content {
    width: 100%;
}

[data-feature-style="icon-inline"] .hayden-feature-item-title {
    font-size: var(--hb-feature-heading-size-mobile, var(--h3-font-size-mobile));
    font-weight: 600;
    line-height: 1.3;
    margin: 0 0 0.5rem;
}

[data-feature-style="icon-inline"] .hayden-feature-item-title.hayden-feature-item-title:is(h2) {
    font-size: var(--hb-feature-heading-size-mobile, var(--h2-font-size-mobile));
}

@media (min-width: 768px) {
    [data-feature-style="icon-inline"] .hayden-feature-item-title {
        font-size: var(--hb-feature-heading-size-desktop, var(--h3-font-size-desktop));
    }
    
    [data-feature-style="icon-inline"] .hayden-feature-item-title.hayden-feature-item-title:is(h2) {
        font-size: var(--hb-feature-heading-size-desktop, var(--h2-font-size-desktop));
    }
}

[data-feature-style="icon-inline"] .hayden-feature-item-text {
    font-size: var(--hb-feature-body-size-mobile, var(--body-font-size-mobile)) !important;
    line-height: 1.6;
    margin: 0;
    color: var(--card-text-muted, var(--color-body));
}

@media (min-width: 768px) {
    [data-feature-style="icon-inline"] .hayden-feature-item-text {
        font-size: var(--hb-feature-body-size-desktop, var(--body-font-size-desktop)) !important;
    }
}

/* ---------------------------------------------------------
   Editor-specific styles
   --------------------------------------------------------- */

.editor-styles-wrapper .hayden-feature-item,
.block-editor-block-list__layout .hayden-feature-item {
    padding: 1rem;
    border: 1px dashed #e5e7eb;
    border-radius: 8px;
    min-height: 100px;
}

/* ===== style.css ===== */

/* =========================================================
   FEATURES
   ========================================================= */

.hayden-features {
    position: relative;
    overflow: hidden;

    --hb-feature-icon-gap: 24px;

    /* Default (global) padding - inherits from customizer */
    padding-top: var(--block-padding-y);
    padding-bottom: var(--block-padding-y);
    padding-left: var(--block-padding-x);
    padding-right: var(--block-padding-x);

    margin-inline: auto;
    margin-top: var(--section-space-mobile);
    margin-bottom: var(--section-space-mobile);

    border-radius: var(--radius-2xl);
    background: var(--hb-bg-color, var(--card-bg));
    color: var(--hb-text-color, var(--color-body));
}

.hayden-features.has-local-spacing {
    margin-top: 0;
    margin-bottom: 0;
}

/* Desktop spacing */
@media (min-width: 768px) {
    .hayden-features:not([data-margin-top]):not([data-margin-bottom]) {
        margin-top: var(--section-space-desktop);
        margin-bottom: var(--section-space-desktop);
    }

    .hayden-features.has-local-spacing {
        margin-top: 0;
        margin-bottom: 0;
    }
}

/* Full-width breakout support */
.hayden-features.alignfull {
    position: relative;
    width: 100vw;
    max-width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    border-radius: 0;
    /* Maintain internal padding for content alignment */
    padding-left: max(1rem, calc((100vw - 100%) / 2));
    padding-right: max(1rem, calc((100vw - 100%) / 2));
}

@media (min-width: 782px) {
    .hayden-features.alignfull {
        left: 50%;
        right: 50%;
        margin-left: -50vw;
        margin-right: -50vw;
        width: 100vw;
        max-width: 100vw;
        padding-left: max(1rem, calc((100vw - 100%) / 2));
        padding-right: max(1rem, calc((100vw - 100%) / 2));
    }
}

/* Editor-specific full-width support */
.editor-styles-wrapper .hayden-features.alignfull,
.block-editor-block-list__layout .hayden-features.alignfull {
    position: relative;
    width: 100%;
    max-width: 100%;
    left: 0;
    right: 0;
    margin-left: 0;
    margin-right: 0;
    /* Match editor content width constraints */
    padding-left: max(1rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
    padding-right: max(1rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
}

/* For nested full-width Features inside InnerBlocks - don't override, keep normal padding */
.editor-styles-wrapper .wp-block .hayden-features.alignfull,
.editor-styles-wrapper .wp-block .hayden-features[data-align="full"],
.block-editor-block-list__layout .wp-block .hayden-features.alignfull,
.block-editor-block-list__layout .wp-block .hayden-features[data-align="full"] {
    /* Reset to use the Features own padding settings */
    padding-top: var(--block-padding-y);
    padding-bottom: var(--block-padding-y);
    padding-left: var(--block-padding-x);
    padding-right: var(--block-padding-x);
}

/* For editor canvas that uses viewport width */
.wp-block[data-align="full"] .hayden-features.alignfull {
    width: 100vw;
    max-width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    padding-left: max(1rem, calc((100vw - 100%) / 2));
    padding-right: max(1rem, calc((100vw - 100%) / 2));
}

/* Block-level margin overrides */
.hayden-features[data-margin-top="none"] {
    margin-top: 0 !important;
}

.hayden-features[data-margin-top="small"] {
    margin-top: 4rem !important;
}

.hayden-features[data-margin-top="medium"] {
    margin-top: 6rem !important;
}

.hayden-features[data-margin-top="large"] {
    margin-top: 8rem !important;
}

.hayden-features[data-margin-bottom="none"] {
    margin-bottom: 0 !important;
}

.hayden-features[data-margin-bottom="small"] {
    margin-bottom: 4rem !important;
}

.hayden-features[data-margin-bottom="medium"] {
    margin-bottom: 6rem !important;
}

.hayden-features[data-margin-bottom="large"] {
    margin-bottom: 8rem !important;
}

/* ---------------------------------------------------------
   Header section (eyebrow, heading, text)
   --------------------------------------------------------- */

.hayden-features-header {
    max-width: 48rem;
    margin-bottom: 3rem;
}

@media (min-width: 768px) {
    .hayden-features-header {
        margin-bottom: 4rem;
    }
}

/* Content alignment */
.hayden-features[data-content-align="center"] .hayden-features-header {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.hayden-features[data-content-align="right"] .hayden-features-header {
    margin-left: auto;
    margin-right: 0;
    text-align: right;
}

.hayden-features[data-content-align="left"] .hayden-features-header {
    margin-left: 0;
    margin-right: auto;
    text-align: left;
}

/* Eyebrow / pre-heading */
.hayden-features-eyebrow {
    font-size: 0.75rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 1.5rem;
    color: inherit;
}

/* Main heading */
.hayden-features-heading {
    line-height: 1.1;
    margin: 0 0 1.5rem;
    color: var(--color-headings);
}

/* Body text */
.hayden-features-text {
    line-height: 1.6;
    margin: 0;
    color: var(--hb-text-color, inherit);
}

.hayden-features-text p {
    color: inherit;
}

/* ---------------------------------------------------------
   TYPOGRAPHY SCALES
   Apply heading/body font sizes when parent has scale classes
   --------------------------------------------------------- */

/* Heading scales */
.hayden-type.hayden-type--heading-xl .hayden-features-heading {
    font-size: 1.125rem;
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--heading-xl .hayden-features-heading {
        font-size: 1.25rem;
    }
}

.hayden-type.hayden-type--heading-2xl .hayden-features-heading {
    font-size: 1.25rem;
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--heading-2xl .hayden-features-heading {
        font-size: 1.5rem;
    }
}

.hayden-type.hayden-type--heading-3xl .hayden-features-heading {
    font-size: 1.5rem;
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--heading-3xl .hayden-features-heading {
        font-size: 1.875rem;
    }
}

.hayden-type.hayden-type--heading-4xl .hayden-features-heading {
    font-size: 1.875rem;
}

@media (min-width: 768px) {
    .hayden-type.hayden-type--heading-4xl .hayden-features-heading {
        font-size: 2.25rem;
    }
}

/* Body text scales */
.hayden-type.hayden-type--body-sm .hayden-features-text {
    font-size: 0.875rem;
}

.hayden-type.hayden-type--body-base .hayden-features-text {
    font-size: 1rem;
}

.hayden-type.hayden-type--body-lg .hayden-features-text {
    font-size: 1.125rem;
}

.hayden-type.hayden-type--body-xl .hayden-features-text {
    font-size: 1.25rem;
}

.hayden-type.hayden-type--body-2xl .hayden-features-text {
    font-size: 1.5rem;
}

.hayden-type.hayden-type--body-3xl .hayden-features-text {
    font-size: 1.875rem;
}

/* ---------------------------------------------------------
   Features grid
   --------------------------------------------------------- */

.hayden-features-grid {
    display: grid;
    gap: 2rem;
}

/* 2 columns */
.hayden-features[data-columns="2"] .hayden-features-grid {
    grid-template-columns: 1fr;
}

/* Frontend only - display 2 columns at 768px+ */
@media (min-width: 768px) {
    body:not(.block-editor-page) .hayden-features[data-columns="2"] .hayden-features-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 2.5rem;
    }
}

/* 3 columns (default) */
.hayden-features[data-columns="3"] .hayden-features-grid {
    grid-template-columns: 1fr;
}

/* Frontend only - display 3 columns at 768px+ */
@media (min-width: 768px) {
    body:not(.block-editor-page) .hayden-features[data-columns="3"] .hayden-features-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* 4 columns */
.hayden-features[data-columns="4"] .hayden-features-grid {
    grid-template-columns: 1fr;
}

/* Frontend only - display 2 columns at 768px, 4 columns at 1024px+ */
@media (min-width: 768px) {
    body:not(.block-editor-page) .hayden-features[data-columns="4"] .hayden-features-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    body:not(.block-editor-page) .hayden-features[data-columns="4"] .hayden-features-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* Editor-specific: Force grid layout in editor view */
.editor-styles-wrapper .hayden-features-grid,
.block-editor-block-list__layout .hayden-features-grid {
    display: grid !important;
    gap: 2rem !important;
}



/* Ensure feature items fill grid cells in editor */
.editor-styles-wrapper .hayden-feature-item,
.block-editor-block-list__layout .hayden-feature-item {
    width: 100% !important;
}

/* Target the actual InnerBlocks layout container - the grid starts here */
.hayden-features-grid > .block-editor-inner-blocks > .block-editor-block-list__layout {
    display: grid !important;
    gap: 2rem !important;
}

.hayden-features[data-columns="2"] .hayden-features-grid > .block-editor-inner-blocks > .block-editor-block-list__layout {
    grid-template-columns: repeat(2, 1fr) !important;
}

.hayden-features[data-columns="3"] .hayden-features-grid > .block-editor-inner-blocks > .block-editor-block-list__layout {
    grid-template-columns: repeat(3, 1fr) !important;
}

.hayden-features[data-columns="4"] .hayden-features-grid > .block-editor-inner-blocks > .block-editor-block-list__layout {
    grid-template-columns: repeat(4, 1fr) !important;
}

/* ---------------------------------------------------------
   Block-level padding overrides via data attributes
   --------------------------------------------------------- */

/* Vertical padding (Y-axis) overrides */
.hayden-features[data-padding-y="small"] {
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
}

@media (min-width: 768px) {
    .hayden-features[data-padding-y="small"] {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }
}

.hayden-features[data-padding-y="medium"] {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

@media (min-width: 768px) {
    .hayden-features[data-padding-y="medium"] {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }
}

.hayden-features[data-padding-y="large"] {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
}

@media (min-width: 768px) {
    .hayden-features[data-padding-y="large"] {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }
}

/* Horizontal padding (X-axis) overrides */
.hayden-features[data-padding-x="small"] {
    padding-left: var(--block-padding-x-small);
    padding-right: var(--block-padding-x-small);
}

.hayden-features[data-padding-x="medium"] {
    padding-left: var(--block-padding-x-medium);
    padding-right: var(--block-padding-x-medium);
}

.hayden-features[data-padding-x="large"] {
    padding-left: var(--block-padding-x-large);
    padding-right: var(--block-padding-x-large);
}

/* ===== style.css ===== */

.hayden-media-text {
    padding-top: var(--block-padding-y);
    padding-bottom: var(--block-padding-y);
    padding-left: var(--block-padding-x);
    padding-right: var(--block-padding-x);

    --hmt-text-cols: 6;
    --hmt-media-cols: 6;

    margin-inline: auto;
    margin-top: var(--section-space-mobile);
    margin-bottom: var(--section-space-mobile);

    border-radius: var(--radius-2xl);
    overflow: hidden;
}

/* Desktop spacing */
@media (min-width: 768px) {
    .hayden-media-text:not([data-margin-top]):not([data-margin-bottom]) {
        margin-top: var(--section-space-desktop);
        margin-bottom: var(--section-space-desktop);
    }
}

/* Block-level margin overrides */
/* These override the global spacing when set */
.hayden-media-text[data-margin-top="none"] {
    margin-top: 0 !important;
}

.hayden-media-text[data-margin-top="small"] {
    margin-top: 4rem !important;
}

.hayden-media-text[data-margin-top="medium"] {
    margin-top: 6rem !important;
}

.hayden-media-text[data-margin-top="large"] {
    margin-top: 8rem !important;
}

.hayden-media-text[data-margin-bottom="none"] {
    margin-bottom: 0 !important;
}

.hayden-media-text[data-margin-bottom="small"] {
    margin-bottom: 4rem !important;
}

.hayden-media-text[data-margin-bottom="medium"] {
    margin-bottom: 6rem !important;
}

.hayden-media-text[data-margin-bottom="large"] {
    margin-bottom: 8rem !important;
}

/* Editor-specific margin overrides to match frontend */
.editor-styles-wrapper .hayden-media-text[data-margin-top="none"],
.block-editor-block-list__layout .hayden-media-text[data-margin-top="none"] {
    margin-top: 0 !important;
}

.editor-styles-wrapper .hayden-media-text[data-margin-bottom="none"],
.block-editor-block-list__layout .hayden-media-text[data-margin-bottom="none"] {
    margin-bottom: 0 !important;
}

/* Full-width breakout support */
/* Full-width breakout: full-bleed background without content shift */
.hayden-media-text.alignfull {
    position: relative;
    width: auto;
    max-width: none;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    border-radius: 0;
    box-sizing: border-box;
    padding-left: 0;
    padding-right: 0;
    left: auto;
    right: auto;
}

@media (min-width: 782px) {
    .hayden-media-text.alignfull {
        left: auto;
        right: auto;
        width: auto;
        max-width: none;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        padding-left: 0;
        padding-right: 0;
    }
}

.hayden-media-text-inner {
    max-width: var(--site-max-width, var(--container-content, 72rem));
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    padding-inline: 1rem;
}

/* Remove inner padding when block is not full-width (outer padding handles it) */
.hayden-media-text:not(.alignfull) .hayden-media-text-inner {
    padding-inline: 0;
}

.hayden-media-text[data-content-align="center"] .hayden-media-text-inner > .hayden-type-heading,
.hayden-media-text[data-content-align="center"] .hayden-media-text-body {
    text-align: center;
}

.hayden-media-text[data-content-align="right"] .hayden-media-text-inner > .hayden-type-heading,
.hayden-media-text[data-content-align="right"] .hayden-media-text-body {
    text-align: right;
}

/* Editor: keep content aligned like other blocks when full width is selected */
.editor-styles-wrapper .hayden-media-text.alignfull .hayden-media-text-inner,
.block-editor-block-list__layout .hayden-media-text.alignfull .hayden-media-text-inner {
    max-width: var(--wp--style--global--content-size, 48rem);
    margin-left: auto;
    margin-right: auto;
    padding-inline: 1rem;
}

/* Alignfull: match prose horizontal padding so content stays aligned with other blocks */
.hayden-media-text.alignfull .hayden-media-text-inner {
    max-width: var(--site-max-width, var(--container-content, 72rem));
    margin-left: auto;
    margin-right: auto;
    padding-inline: 1rem;
}

.hayden-media-text-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    align-items: start;
}

/* Ensure grid children span the full column width (frontend) */
.hayden-media-text-grid > .wp-block {
    width: 100%;
}

/* Target the first two blocks within the grid */
.hayden-media-text-grid > .wp-block:nth-child(1),
.hayden-media-text-grid > .wp-block:nth-child(2) {
    margin: 0;
}

@media (min-width: 768px) {
    .hayden-media-text-grid {
        grid-template-columns: repeat(12, minmax(0, 1fr));
        gap: 3rem;
    }

    .hayden-media-text-grid > :nth-child(1) {
        grid-column: span var(--hmt-media-cols);
    }

    .hayden-media-text-grid > :nth-child(2) {
        grid-column: span var(--hmt-text-cols);
    }

    .hayden-media-text[data-media-position="right"] .hayden-media-text-grid {
        direction: rtl;
    }

    .hayden-media-text[data-media-position="right"] .hayden-media-text-grid > * {
        direction: ltr;
    }
}

/* Editor-specific: ensure grid works with block editor structure */
.editor-styles-wrapper .hayden-media-text-grid,
.block-editor-block-list__layout .hayden-media-text-grid {
    display: block;
}

/* Apply grid to the InnerBlocks wrapper inside the grid */
.editor-styles-wrapper .hayden-media-text-grid > .block-editor-inner-blocks > .block-editor-block-list__layout,
.block-editor-block-list__layout .hayden-media-text-grid > .block-editor-inner-blocks > .block-editor-block-list__layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}

/* Ensure grid children span the full column width (editor) */
.editor-styles-wrapper .hayden-media-text-grid > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block,
.block-editor-block-list__layout .hayden-media-text-grid > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block {
    width: 100%;
}

@media (min-width: 768px) {
    .editor-styles-wrapper .hayden-media-text-grid > .block-editor-inner-blocks > .block-editor-block-list__layout,
    .block-editor-block-list__layout .hayden-media-text-grid > .block-editor-inner-blocks > .block-editor-block-list__layout {
        grid-template-columns: repeat(12, minmax(0, 1fr));
        gap: 3rem;
    }

    .editor-styles-wrapper .hayden-media-text-grid > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:nth-child(1),
    .block-editor-block-list__layout .hayden-media-text-grid > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:nth-child(1) {
        grid-column: span var(--hmt-media-cols);
    }

    .editor-styles-wrapper .hayden-media-text-grid > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:nth-child(2),
    .block-editor-block-list__layout .hayden-media-text-grid > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:nth-child(2) {
        grid-column: span var(--hmt-text-cols);
    }
    
    /* Media position right in editor */
    .editor-styles-wrapper .hayden-media-text[data-media-position="right"] .hayden-media-text-grid > .block-editor-inner-blocks > .block-editor-block-list__layout,
    .block-editor-block-list__layout .hayden-media-text[data-media-position="right"] .hayden-media-text-grid > .block-editor-inner-blocks > .block-editor-block-list__layout {
        direction: rtl;
    }
    
    .editor-styles-wrapper .hayden-media-text[data-media-position="right"] .hayden-media-text-grid > .block-editor-inner-blocks > .block-editor-block-list__layout > *,
    .block-editor-block-list__layout .hayden-media-text[data-media-position="right"] .hayden-media-text-grid > .block-editor-inner-blocks > .block-editor-block-list__layout > * {
        direction: ltr;
    }
}

/* Restore paragraph spacing within InnerBlocks in editor */
.editor-styles-wrapper .hayden-media-text-grid p,
.block-editor-block-list__layout .hayden-media-text-grid p {
    margin-bottom: 1rem;
}

.editor-styles-wrapper .hayden-media-text-grid p:last-child,
.block-editor-block-list__layout .hayden-media-text-grid p:last-child {
    margin-bottom: 0;
}

.hayden-media-text-grid img {
    width: 100%;
    height: auto;
    display: block;
    margin: 0;
}

.hayden-media-text-grid .wp-block-image {
    margin: 0;
    width: 100%;
    max-width: 100%;
}

/* Reset WP image alignment classes inside this block so images fill the column */
.hayden-media-text-grid .wp-block-image.alignright,
.hayden-media-text-grid .wp-block-image.alignleft,
.hayden-media-text-grid .wp-block-image.aligncenter {
    float: none !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

.hayden-media-text-grid .wp-block-image img {
    width: 100%;
    height: auto;
    display: block;
}

.hayden-media-text-content {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.hayden-media-text-content h2 {
    margin: 0;
}

.hayden-media-text-content p {
    margin: 0 0 1rem;
}

.hayden-media-text-content p:last-child {
    margin-bottom: 0;
}

/* ---------------------------------------------------------
   Inner Blocks
   Inherits body text typography from hayden-type-body class
   --------------------------------------------------------- */

.hayden-media-text-inner-blocks {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Ensure inner blocks inherit typography and spacing */
.hayden-media-text-inner-blocks > * {
    margin-top: 0;
}

.hayden-media-text-inner-blocks > *:last-child {
    margin-bottom: 0;
}

/* ---------------------------------------------------------
   Colours
   --------------------------------------------------------- */

.hayden-media-text-inner h1,
.hayden-media-text-inner h2,
.hayden-media-text-inner h3,
.hayden-media-text-inner .hayden-type-heading {
    color: var(--color-headings);
}

.hayden-media-text-body {
    color: var(--hmt-body-color, var(--color-body, #1a1a1a));
}

/* Ensure inline bold/strong/italic inherit the text colour */
.hayden-media-text-body p {
    color: inherit;
}

/* Apply body text color to all content in the grid (InnerBlocks) */
.hayden-media-text-grid,
.hayden-media-text-grid p,
.hayden-media-text-grid li {
    color: var(--hmt-body-color, var(--color-body, #1a1a1a));
}

/* Editor-specific: Ensure heading color is applied */
.editor-styles-wrapper .hayden-media-text-inner h1,
.editor-styles-wrapper .hayden-media-text-inner h2,
.editor-styles-wrapper .hayden-media-text-inner h3,
.editor-styles-wrapper .hayden-media-text-inner .hayden-type-heading,
.block-editor-block-list__layout .hayden-media-text-inner h1,
.block-editor-block-list__layout .hayden-media-text-inner h2,
.block-editor-block-list__layout .hayden-media-text-inner h3,
.block-editor-block-list__layout .hayden-media-text-inner .hayden-type-heading {
    color: var(--color-headings);
}

/* Editor-specific: Ensure body text color is applied */
.editor-styles-wrapper .hayden-media-text-body,
.block-editor-block-list__layout .hayden-media-text-body {
    color: var(--hmt-body-color, var(--color-body, #1a1a1a));
}

.editor-styles-wrapper .hayden-media-text-body p,
.block-editor-block-list__layout .hayden-media-text-body p {
    color: inherit;
}

/* Editor-specific: Apply body text color to InnerBlocks in the grid */
.editor-styles-wrapper .hayden-media-text-grid,
.editor-styles-wrapper .hayden-media-text-grid p,
.editor-styles-wrapper .hayden-media-text-grid li,
.block-editor-block-list__layout .hayden-media-text-grid,
.block-editor-block-list__layout .hayden-media-text-grid p,
.block-editor-block-list__layout .hayden-media-text-grid li {
    color: var(--hmt-body-color, var(--color-body, #1a1a1a));
}

.hayden-media-text {
    background-color: var(--hmt-bg-color, var(--card-bg));
}

/* ---------------------------------------------------------
   Block-level padding overrides via data attributes
   --------------------------------------------------------- */

/* Vertical padding (Y-axis) overrides */
.hayden-media-text[data-padding-y="small"] {
    padding-top: var(--block-padding-y-small);
    padding-bottom: var(--block-padding-y-small);
}

.hayden-media-text[data-padding-y="medium"] {
    padding-top: var(--block-padding-y-medium);
    padding-bottom: var(--block-padding-y-medium);
}

.hayden-media-text[data-padding-y="large"] {
    padding-top: var(--block-padding-y-large);
    padding-bottom: var(--block-padding-y-large);
}

/* Horizontal padding (X-axis) overrides */
.hayden-media-text:not(.alignfull)[data-padding-x="small"] {
    padding-left: var(--block-padding-x-small);
    padding-right: var(--block-padding-x-small);
}

.hayden-media-text:not(.alignfull)[data-padding-x="medium"] {
    padding-left: var(--block-padding-x-medium);
    padding-right: var(--block-padding-x-medium);
}

.hayden-media-text:not(.alignfull)[data-padding-x="large"] {
    padding-left: var(--block-padding-x-large);
    padding-right: var(--block-padding-x-large);
}

/* Alignfull uses inner padding for horizontal spacing */
.hayden-media-text.alignfull[data-padding-x="small"] .hayden-media-text-inner {
    padding-left: var(--block-padding-x-small);
    padding-right: var(--block-padding-x-small);
}

.hayden-media-text.alignfull[data-padding-x="medium"] .hayden-media-text-inner {
    padding-left: var(--block-padding-x-medium);
    padding-right: var(--block-padding-x-medium);
}

.hayden-media-text.alignfull[data-padding-x="large"] .hayden-media-text-inner {
    padding-left: var(--block-padding-x-large);
    padding-right: var(--block-padding-x-large);
}

/* ===== style.css ===== */

/* Pricing block wrapper */
:root {
  --radius-xl-root: var(--radius-xl);
  --radius-2xl-root: var(--radius-2xl);
  --radius-full-root: var(--radius-full);
}

.hayden-pricing {
  max-width: var(--site-max-width, 90rem);
  margin-inline: auto;
  margin-top: var(--section-space-mobile);
  margin-bottom: var(--section-space-mobile);
  padding-top: var(--block-padding-y);
  padding-bottom: var(--block-padding-y);
  padding-left: var(--block-padding-x);
  padding-right: var(--block-padding-x);
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  background: var(--hb-bg-color, var(--card-bg));
  border-radius: var(--radius-2xl-root, var(--radius-2xl));
}

/* Desktop spacing */
@media (min-width: 768px) {
  .hayden-pricing:not([data-margin-top]):not([data-margin-bottom]) {
    margin-top: var(--section-space-desktop);
    margin-bottom: var(--section-space-desktop);
  }
}

/* Full-width breakout support */
.hayden-pricing.alignfull {
  position: relative;
  width: 100vw;
  max-width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  border-radius: 0;
  box-sizing: border-box;
}

/* Full-width: center content with side padding */
.hayden-pricing.alignfull {
  padding-left: max(1.5rem, calc((100vw - var(--site-max-width, 90rem)) / 1.9));
  padding-right: max(1.5rem, calc((100vw - var(--site-max-width, 90rem)) / 1.9));
}

@media (min-width: 782px) {
  .hayden-pricing.alignfull {
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    width: 100vw;
    max-width: 100vw;
  }
}

/* Editor-specific full-width support */
.editor-styles-wrapper .hayden-pricing.alignfull,
.block-editor-block-list__layout .hayden-pricing.alignfull {
  position: relative;
  width: 100%;
  max-width: 100%;
  left: 0;
  right: 0;
  margin-left: 0;
  margin-right: 0;
  padding-left: max(1.5rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
  padding-right: max(1.5rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
}

/* For editor canvas that uses viewport width */
.wp-block[data-align="full"] .hayden-pricing.alignfull {
  width: 100vw;
  max-width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  padding-left: max(1.5rem, calc((100vw - 100%) / 2));
  padding-right: max(1.5rem, calc((100vw - 100%) / 2));
}

/* 1. Heading */
.hayden-pricing-title {
  margin: 0;
  color: var(--color-headings);
  text-align: left;
}

/* 2. Intro paragraph */
.hayden-pricing-intro {
  margin: 0.5rem 0 0 0;
  color: var(--color-body);
}

/* =========================================================
   Layout Controls (data attributes)
   ========================================================= */

/* Block-level padding overrides */
.hayden-pricing[data-padding-y="small"] {
  padding-top: 1.75rem;
  padding-bottom: 1.75rem;
}

.hayden-pricing[data-padding-y="medium"] {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

.hayden-pricing[data-padding-y="large"] {
  padding-top: 3.5rem;
  padding-bottom: 3.5rem;
}

@media (min-width: 768px) {
  .hayden-pricing[data-padding-y="small"] {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
  
  .hayden-pricing[data-padding-y="medium"] {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
  
  .hayden-pricing[data-padding-y="large"] {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }
}

/* Horizontal padding overrides */
.hayden-pricing:not(.alignfull)[data-padding-x="small"] {
  padding-left: var(--block-padding-x-small);
  padding-right: var(--block-padding-x-small);
}

.hayden-pricing:not(.alignfull)[data-padding-x="medium"] {
  padding-left: var(--block-padding-x-medium);
  padding-right: var(--block-padding-x-medium);
}

.hayden-pricing:not(.alignfull)[data-padding-x="large"] {
  padding-left: var(--block-padding-x-large);
  padding-right: var(--block-padding-x-large);
}





/* Content Alignment (data-content-align) */
.hayden-pricing[data-content-align="center"] .hayden-pricing-title,
.hayden-pricing[data-content-align="center"] .hayden-pricing-intro {
  text-align: center;
}

.hayden-pricing[data-content-align="center"] .hayden-pricing-toggle {
  margin-inline: auto;
}

.hayden-pricing[data-content-align="right"] .hayden-pricing-title,
.hayden-pricing[data-content-align="right"] .hayden-pricing-intro {
  text-align: right;
}

.hayden-pricing[data-content-align="right"] .hayden-pricing-toggle {
  margin-left: auto;
}

/* Top/Bottom Margin Overrides (data-margin-top/bottom) */
.hayden-pricing[data-margin-top="none"] {
  margin-top: 0 !important;
}

.hayden-pricing[data-margin-top="small"] {
  margin-top: 4rem !important;
}

.hayden-pricing[data-margin-top="medium"] {
  margin-top: 6rem !important;
}

.hayden-pricing[data-margin-top="large"] {
  margin-top: 8rem !important;
}

.hayden-pricing[data-margin-bottom="none"] {
  margin-bottom: 0 !important;
}

.hayden-pricing[data-margin-bottom="small"] {
  margin-bottom: 4rem !important;
}

.hayden-pricing[data-margin-bottom="medium"] {
  margin-bottom: 6rem !important;
}

.hayden-pricing[data-margin-bottom="large"] {
  margin-bottom: 8rem !important;
}

/* Editor-specific margin overrides */
.editor-styles-wrapper .hayden-pricing[data-margin-top="none"],
.block-editor-block-list__layout .hayden-pricing[data-margin-top="none"] {
  margin-top: 0 !important;
}

.editor-styles-wrapper .hayden-pricing[data-margin-bottom="none"],
.block-editor-block-list__layout .hayden-pricing[data-margin-bottom="none"] {
  margin-bottom: 0 !important;
}

/* =========================================================
   Typography Controls
   ========================================================= */

/* Heading line-height control */
.hayden-type .hayden-type-heading { 
  line-height: 1.1; 
}

/* Heading font size scales */
.hayden-pricing.hayden-type--heading-sm .hayden-pricing-title {
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.hayden-pricing.hayden-type--heading-base .hayden-pricing-title {
  font-size: 1rem;
  line-height: 1.5rem;
}

.hayden-pricing.hayden-type--heading-lg .hayden-pricing-title {
  font-size: 1.125rem;
  line-height: 1.75rem;
}

.hayden-pricing.hayden-type--heading-xl .hayden-pricing-title {
  font-size: 1.125rem;
}

@media (min-width: 768px) {
  .hayden-pricing.hayden-type--heading-xl .hayden-pricing-title {
    font-size: 1.25rem;
  }
}

.hayden-pricing.hayden-type--heading-2xl .hayden-pricing-title {
  font-size: 1.25rem;
}

@media (min-width: 768px) {
  .hayden-pricing.hayden-type--heading-2xl .hayden-pricing-title {
    font-size: 1.5rem;
  }
}

.hayden-pricing.hayden-type--heading-3xl .hayden-pricing-title {
  font-size: 1.5rem;
}

@media (min-width: 768px) {
  .hayden-pricing.hayden-type--heading-3xl .hayden-pricing-title {
    font-size: 1.875rem;
  }
}

.hayden-pricing.hayden-type--heading-4xl .hayden-pricing-title {
  font-size: 1.875rem;
}

@media (min-width: 768px) {
  .hayden-pricing.hayden-type--heading-4xl .hayden-pricing-title {
    font-size: 2.25rem;
  }
}

/* Body font size scales - applies to intro text */
.hayden-pricing.hayden-type--body-sm .hayden-pricing-intro {
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.hayden-pricing.hayden-type--body-base .hayden-pricing-intro {
  font-size: 1rem;
  line-height: 1.5rem;
}

.hayden-pricing.hayden-type--body-lg .hayden-pricing-intro {
  font-size: 1.125rem;
  line-height: 1.75rem;
}

.hayden-pricing.hayden-type--body-xl .hayden-pricing-intro {
  font-size: 1.125rem;
  line-height: 1.75rem;
}

@media (min-width: 768px) {
  .hayden-pricing.hayden-type--body-xl .hayden-pricing-intro {
    font-size: 1.25rem;
  }
}

.hayden-pricing.hayden-type--body-2xl .hayden-pricing-intro {
  font-size: 1.25rem;
  line-height: 1.75rem;
}

@media (min-width: 768px) {
  .hayden-pricing.hayden-type--body-2xl .hayden-pricing-intro {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.hayden-pricing.hayden-type--body-3xl .hayden-pricing-intro {
  font-size: 1.5rem;
  line-height: 2rem;
}

@media (min-width: 768px) {
  .hayden-pricing.hayden-type--body-3xl .hayden-pricing-intro {
    font-size: 1.875rem;
    line-height: 2.25rem;
  }
}

.hayden-pricing.hayden-type--body-4xl .hayden-pricing-intro {
  font-size: 1.875rem;
  line-height: 2.25rem;
}

@media (min-width: 768px) {
  .hayden-pricing.hayden-type--body-4xl .hayden-pricing-intro {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
}

/* 3. Pricing content area */
.hayden-pricing-content {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  width: 100%;
  box-sizing: border-box;
}

/* Editor-only: prevent grid overflow */
.block-editor-inner-blocks .hayden-pricing-content {
  max-width: 100% !important;
  overflow: hidden !important;
}

/* Responsive grid for pricing cards */
@media (min-width: 640px) {
  .hayden-pricing-content {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .hayden-pricing-content {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Column variations */
  .hayden-pricing[data-columns="1"] .hayden-pricing-content {
    grid-template-columns: repeat(1, 1fr);
  }

  .hayden-pricing[data-columns="2"] .hayden-pricing-content {
    grid-template-columns: repeat(2, 1fr);
  }

  .hayden-pricing[data-columns="3"] .hayden-pricing-content {
    grid-template-columns: repeat(3, 1fr);
  }

  .hayden-pricing[data-columns="4"] .hayden-pricing-content {
    grid-template-columns: repeat(4, 1fr);
  }

  .hayden-pricing[data-columns="5"] .hayden-pricing-content {
    grid-template-columns: repeat(5, 1fr);
  }

  .hayden-pricing[data-columns="6"] .hayden-pricing-content {
    grid-template-columns: repeat(6, 1fr);
  }
}

/* Editor: Force grid layout for pricing plans */
.block-editor-block-list__layout .hayden-pricing-content {
  grid-template-columns: 1fr !important;
}

.hayden-pricing-content .block-editor-inner-blocks .block-editor-block-list__layout {
  position: relative;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 20px;
}

/* Editor: disable grid inside pricing features (list area) */
.hayden-pricing-content .hayden-pricing-features .block-editor-inner-blocks .block-editor-block-list__layout,
.hayden-pricing-content .hayden-pricing-features .block-editor-block-list__layout {
  display: block !important;
  grid-template-columns: unset !important;
  gap: 0 !important;
}

/* Editor responsive grid */
@media (min-width: 640px) {
  .block-editor-block-list__layout .hayden-pricing-content {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  
  .hayden-pricing-content .block-editor-inner-blocks .block-editor-block-list__layout {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (min-width: 1024px) {
  .block-editor-block-list__layout .hayden-pricing-content {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  
  .hayden-pricing-content .block-editor-inner-blocks .block-editor-block-list__layout {
    grid-template-columns: repeat(3, 1fr) !important;
  }

  /* Editor column variations */
  .hayden-pricing[data-columns="1"] .hayden-pricing-content,
  .block-editor-block-list__layout .hayden-pricing[data-columns="1"] .hayden-pricing-content {
    grid-template-columns: repeat(1, 1fr) !important;
  }
  
  .hayden-pricing[data-columns="1"] .hayden-pricing-content .block-editor-inner-blocks .block-editor-block-list__layout {
    grid-template-columns: repeat(1, 1fr) !important;
  }

  .hayden-pricing[data-columns="2"] .hayden-pricing-content,
  .block-editor-block-list__layout .hayden-pricing[data-columns="2"] .hayden-pricing-content {
    grid-template-columns: 1fr !important;
  }
  
  .hayden-pricing[data-columns="2"] .hayden-pricing-content .block-editor-inner-blocks .block-editor-block-list__layout {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .hayden-pricing[data-columns="3"] .hayden-pricing-content,
  .block-editor-block-list__layout .hayden-pricing[data-columns="3"] .hayden-pricing-content {
    grid-template-columns: 1fr !important;
  }
  
  .hayden-pricing[data-columns="3"] .hayden-pricing-content .block-editor-inner-blocks .block-editor-block-list__layout {
    grid-template-columns: repeat(3, 1fr) !important;
  }

  .hayden-pricing[data-columns="4"] .hayden-pricing-content,
  .block-editor-block-list__layout .hayden-pricing[data-columns="4"] .hayden-pricing-content {
    grid-template-columns: repeat(4, 1fr) !important;
  }
  
  .hayden-pricing[data-columns="4"] .hayden-pricing-content .block-editor-inner-blocks .block-editor-block-list__layout {
    grid-template-columns: repeat(4, 1fr) !important;
  }

  .hayden-pricing[data-columns="5"] .hayden-pricing-content,
  .block-editor-block-list__layout .hayden-pricing[data-columns="5"] .hayden-pricing-content {
    grid-template-columns: repeat(5, 1fr) !important;
  }
  
  .hayden-pricing[data-columns="5"] .hayden-pricing-content .block-editor-inner-blocks .block-editor-block-list__layout {
    grid-template-columns: repeat(5, 1fr) !important;
  }

  .hayden-pricing[data-columns="6"] .hayden-pricing-content,
  .block-editor-block-list__layout .hayden-pricing[data-columns="6"] .hayden-pricing-content {
    grid-template-columns: repeat(6, 1fr) !important;
  }
  
  .hayden-pricing[data-columns="6"] .hayden-pricing-content .block-editor-inner-blocks .block-editor-block-list__layout {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

/* Force correct columns in WordPress block editor - use .wp-block selector */
.wp-block-smart-pricing[data-columns="3"] .hayden-pricing-content {
  grid-template-columns: repeat(3, 1fr) !important;
}

.wp-block-smart-pricing[data-columns="2"] .hayden-pricing-content {
  grid-template-columns: repeat(2, 1fr) !important;
}

.wp-block-smart-pricing[data-columns="1"] .hayden-pricing-content {
  grid-template-columns: repeat(1, 1fr) !important;
}

/* Highest specificity: target editor wrapper directly */
#editor-styles-wrapper .hayden-pricing-content {
  grid-template-columns: 1fr !important;
}

#editor-styles-wrapper .hayden-pricing[data-columns="2"] .hayden-pricing-content {
  grid-template-columns: repeat(2, 1fr) !important;
}

#editor-styles-wrapper .hayden-pricing[data-columns="3"] .hayden-pricing-content {
  grid-template-columns: repeat(3, 1fr) !important;
}

#editor-styles-wrapper .hayden-pricing[data-columns="4"] .hayden-pricing-content {
  grid-template-columns: repeat(4, 1fr) !important;
}

.hayden-pricing-toggle {
  display: inline-flex;
  gap: 0.5rem;
  align-items: center;
  background: var(--toggle-bg, rgba(0,0,0,0.05));
  border-radius: 999px;
  padding: 0.25rem;
  width: fit-content;
}
.hayden-pricing-toggle button {
  border: none;
  background: transparent;
  padding: 0.5rem 1.2rem;
  border-radius: 999px;
  cursor: pointer;
  color: var(--toggle-text, inherit);
  font-weight: 600;
  transition: all 0.2s;
}
.hayden-pricing-toggle button.is-active {
  background: var(--toggle-button-bg, #0f172a);
  color: var(--toggle-button-text, #fff);
}

/* Editor notice */
.hayden-editor-notice {
  margin: 2rem 0 1rem 0;
  padding: 1rem;
  background: #f0f6fc;
  border-left: 4px solid #0284c7;
  border-radius: 4px;
}

.hayden-editor-notice-text {
  margin: 0;
  font-size: 0.9rem;
  color: #0c4a6e;
  font-weight: 500;
}

/* 4. Pricing plan grid (legacy) */
.hayden-pricing-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

@media (min-width: 640px) {
  .hayden-pricing-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .hayden-pricing-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Editor: Override WordPress block list to use grid layout */
.hayden-pricing-grid .block-editor-inner-blocks .block-editor-block-list__layout {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

@media (min-width: 640px) {
  .hayden-pricing-grid .block-editor-inner-blocks .block-editor-block-list__layout {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .hayden-pricing-grid .block-editor-inner-blocks .block-editor-block-list__layout {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Frontend: Ensure pricing plans display in grid */
.hayden-pricing-grid > .hayden-pricing-plan {
  display: flex;
  flex-direction: column;
}

/* Pricing plan card */
.hayden-pricing-plan {
  background: var(--plan-card-bg, var(--card-bg-alt, #fff));
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: var(--radius-xl-root, var(--radius-xl, 18px));
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  padding: 2rem;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  transition: transform 0.2s, box-shadow 0.2s;
}

/* Hide duplicate block toolbar in nested blocks */
.hayden-pricing-plan .block-editor-block-list__block .block-editor-block-toolbar {
  display: none;
}

/* Completely hide all nested block toolbars inside features area */
.hayden-pricing-features .block-editor-block-toolbar,
.hayden-pricing-features .block-editor-block-contextual-toolbar,
.hayden-pricing-features .components-toolbar-group,
.hayden-pricing-features .block-editor-block-mover {
  display: none !important;
}

.hayden-pricing-plan:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.hayden-pricing-plan.is-highlight {
  border: 2px solid var(--color-primary, #f97316);
  box-shadow: 0 8px 32px rgba(249, 115, 22, 0.15);
}

.hayden-pricing-badge {
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
  background: var(--color-primary, #f97316);
  color: #fff;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  font-weight: 700;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.hayden-pricing-plan-title {
  margin: 0;
  color: var(--plan-title-color, var(--color-headings));
  font-size: 1.5rem;
}

.hayden-pricing-plan-subtitle {
  margin: 0;
  opacity: 0.7;
  font-size: 0.95rem;
  color: var(--plan-body-color, var(--color-body));
}

.hayden-pricing-amounts {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1rem 0;
  border-bottom: 1px solid rgba(0,0,0,0.1);
}

.hayden-pricing-price {
  font-size: var(--plan-price-size, var(--text-4xl, 2.25rem));
  font-weight: 700;
  color: var(--plan-price-color, var(--color-body));
  word-break: break-word;
  overflow-wrap: break-word;
}

/* Editor-specific: reduce price size to prevent card breakout */
.block-editor-block-list__layout .hayden-pricing-price {
  font-size: var(--plan-price-size, var(--text-4xl, 2.25rem));
}

.hayden-pricing-price--yearly {
  display: none;
}

/* Toggle visibility based on billing cycle */
.hayden-pricing[data-billing="monthly"] .hayden-pricing-price--monthly { display: block; }
.hayden-pricing[data-billing="monthly"] .hayden-pricing-price--yearly { display: none; }
.hayden-pricing[data-billing="yearly"] .hayden-pricing-price--monthly { display: none; }
.hayden-pricing[data-billing="yearly"] .hayden-pricing-price--yearly { display: block; }

.hayden-pricing-features {
  flex: 1;
}

.hayden-pricing-feature-list {
  margin: 0;
  padding-left: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.hayden-pricing-feature-list li {
  list-style: disc;
  padding-left: 0.25rem;
}

/* Make inner blocks full width in features area - NOT grid */
.hayden-pricing-features .block-editor-block-list__layout,
.hayden-pricing-features .block-editor-inner-blocks > .block-editor-block-list__layout,
.hayden-pricing-features .block-editor-block-list__layout.is-layout-grid {
  display: block !important;
  grid-template-columns: unset !important;
  gap: 0 !important;
  width: 100% !important;
}

/* Override any parent grid on list wrappers */
.hayden-pricing-features .block-editor-inner-blocks {
  display: block !important;
  width: 100% !important;
  grid-template-columns: unset !important;
}

/* Force all nested blocks to not use grid */
.hayden-pricing-features .block-editor-block-list__block {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

.hayden-pricing-features .block-editor-inner-blocks,
.hayden-pricing-features > * {
  width: 100%;
}

.hayden-pricing-features .block-editor-block-list__block {
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}

/* Style lists in editor to match frontend */
.hayden-pricing-features ul,
.hayden-pricing-features ol {
  margin: 0 !important;
  padding-left: 1.5rem !important;
  list-style-position: outside !important;
  list-style-type: disc !important;
}

.hayden-pricing-features ol {
  list-style-type: decimal !important;
}

.hayden-pricing-features li {
  display: list-item !important;
  list-style: inherit !important;
  padding-left: 0.25rem !important;
  margin-bottom: 0.5rem !important;
  color: var(--plan-body-color, var(--color-body));
  line-height: 1.5;
}

/* Override WordPress editor list styles */
.hayden-pricing-features .block-editor-block-list__block[data-type="core/list"] ul,
.hayden-pricing-features .block-editor-block-list__block[data-type="core/list"] ol {
  list-style-type: disc !important;
  list-style-position: outside !important;
  list-style: disc outside !important;
  padding-left: 1.5rem !important;
  margin: 0 !important;
}

.hayden-pricing-features .block-editor-block-list__block[data-type="core/list"] ol {
  list-style-type: decimal !important;
  list-style: decimal outside !important;
}

/* Force list items to show bullets */
.hayden-pricing-features .wp-block-list__item,
.hayden-pricing-features .block-editor-block-list__block[data-type="core/list-item"] {
  display: list-item !important;
  list-style: inherit !important;
}

/* Editor: override core list reset */
.editor-styles-wrapper .hayden-pricing-features ul,
.block-editor-block-list__layout .hayden-pricing-features ul,
.editor-styles-wrapper .hayden-pricing-features ol,
.block-editor-block-list__layout .hayden-pricing-features ol {
  list-style: disc outside !important;
  list-style-type: disc !important;
  padding-left: 1.5rem !important;
}

.editor-styles-wrapper .hayden-pricing-features ol,
.block-editor-block-list__layout .hayden-pricing-features ol {
  list-style-type: decimal !important;
  list-style: decimal outside !important;
}

/* Remove the pseudo-element bullets - keep native list styling */

.hayden-pricing-features li {
  display: list-item !important;
  padding-left: 0.25rem !important;
  margin-bottom: 0.5rem !important;
  color: var(--plan-body-color, var(--color-body));
  line-height: 1.5;
}

.hayden-pricing-features ul li,
.hayden-pricing-features ol li {
  display: list-item !important;
  margin-left: 0;
  margin-right: 0;
  width: 100% !important;
}

.hayden-pricing-features .block-editor-block-list__block[data-type="core/list-item"] {
  display: list-item !important;
  width: 100% !important;
  margin-bottom: 0.5rem !important;
}

/* Ensure list content displays properly */
.hayden-pricing-features ul li > *,
.hayden-pricing-features ol li > * {
  display: inline;
}

.hayden-pricing-features p {
  color: var(--plan-body-color, var(--color-body));
}

/* Force list items in editor to show bullets */
.hayden-pricing-features .block-editor-block-list__block[data-type="core/list-item"],
.hayden-pricing-features .block-editor-block-list__block[data-type="core/list-item"] > .block-editor-block-list__block-edit {
  display: list-item !important;
  list-style: inherit !important;
}

/* Final editor override: force bullets to render */
.editor-styles-wrapper .hayden-pricing-features ul,
.block-editor-block-list__layout .hayden-pricing-features ul {
  list-style: disc outside !important;
  list-style-type: disc !important;
  padding-left: 1.5rem !important;
}

.editor-styles-wrapper .hayden-pricing-features ol,
.block-editor-block-list__layout .hayden-pricing-features ol {
  list-style: decimal outside !important;
  list-style-type: decimal !important;
  padding-left: 1.5rem !important;
}

.editor-styles-wrapper .hayden-pricing-features li,
.block-editor-block-list__layout .hayden-pricing-features li {
  display: list-item !important;
  list-style-type: inherit !important;
}

.editor-styles-wrapper .hayden-pricing-features li::marker,
.block-editor-block-list__layout .hayden-pricing-features li::marker {
  color: currentColor;
}

.hayden-pricing-ctas {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.hayden-pricing-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border-radius: var(--radius-full-root, var(--radius-full, 9999px));
  padding: 0.85rem 1.9rem;
  font-size: 1rem;
  font-weight: 600;
  border: none;
  background-color: var(--plan-button-bg, var(--color-primary, #f97316));
  color: var(--plan-button-text, #ffffff);
  cursor: pointer;
  transition: transform 150ms ease, opacity 150ms ease;
}

.hayden-pricing-cta:hover {
  opacity: 0.92;
  transform: translateY(-1px);
}

.hayden-pricing-cta:active {
  transform: translateY(0);
}

.hayden-pricing-cta--yearly {
  display: none;
}

.hayden-pricing[data-billing="yearly"] .hayden-pricing-cta--yearly { display: inline-flex; }
.hayden-pricing[data-billing="yearly"] .hayden-pricing-cta--monthly { display: none; }
.hayden-pricing[data-billing="monthly"] .hayden-pricing-cta--monthly { display: inline-flex; }

@media (max-width: 768px) {
  .hayden-pricing-grid,
  .hayden-pricing-grid .block-editor-inner-blocks,
  .hayden-pricing-grid .block-editor-block-list__layout {
    grid-template-columns: 1fr !important;
  }
}

/* ===== style.css ===== */

/* Basic styles for Section block */
.hayden-section {
  position: relative;
  padding-top: var(--block-padding-y);
  padding-bottom: var(--block-padding-y);
  padding-left: var(--block-padding-x);
  padding-right: var(--block-padding-x);

  margin-inline: auto;
  margin-top: var(--section-space-mobile);
  margin-bottom: var(--section-space-mobile);

  border-radius: var(--radius-2xl);
  background: var(--hb-bg-color, var(--card-bg));
  color: var(--color-body);
  
  /* Prevent horizontal scroll from full-width blocks */
  max-width: 100%;
  overflow-x: clip;
}

/* Center content vertically only when enabled */
.hayden-section[data-center-content="true"] {
  display: flex;
  align-items: center;
}

.hayden-section[data-center-content="true"] .hayden-section-inner {
  width: 100%;
}

/* Desktop spacing */
@media (min-width: 768px) {
  .hayden-section {
    margin-top: var(--section-space-desktop);
    margin-bottom: var(--section-space-desktop);
  }
}

/* ---------------------------------------------------------
   Block-level padding overrides
   --------------------------------------------------------- */

.hayden-section[data-padding-y="small"] {
  padding-top: var(--block-padding-y-small);
  padding-bottom: var(--block-padding-y-small);
}

.hayden-section[data-padding-y="medium"] {
  padding-top: var(--block-padding-y-medium);
  padding-bottom: var(--block-padding-y-medium);
}

.hayden-section[data-padding-y="large"] {
  padding-top: var(--block-padding-y-large);
  padding-bottom: var(--block-padding-y-large);
}

.hayden-section[data-padding-x="small"] {
  padding-left: var(--block-padding-x-small);
  padding-right: var(--block-padding-x-small);
}

.hayden-section[data-padding-x="medium"] {
  padding-left: var(--block-padding-x-medium);
  padding-right: var(--block-padding-x-medium);
}

.hayden-section[data-padding-x="large"] {
  padding-left: var(--block-padding-x-large);
  padding-right: var(--block-padding-x-large);
}

/* ---------------------------------------------------------
   Content Alignment (data-content-align)
   --------------------------------------------------------- */

.hayden-section[data-content-align="center"] .hayden-section-inner {
  text-align: center;
  margin-inline: auto;
}

.hayden-section[data-content-align="center"] .hayden-section-inner > .wp-block-image {
  margin-left: auto;
  margin-right: auto;
}

.hayden-section[data-content-align="right"] .hayden-section-inner {
  text-align: right;
  margin-left: auto;
}

.hayden-section[data-content-align="right"] .hayden-section-inner > .wp-block-image {
  margin-left: auto;
  margin-right: 0;
}

/* ---------------------------------------------------------
   Top/Bottom Margin Overrides (data-margin-top/bottom)
   --------------------------------------------------------- */

.hayden-section[data-margin-top="none"] {
  margin-top: 0 !important;
}

.hayden-section[data-margin-top="small"] {
  margin-top: 4rem !important;
}

.hayden-section[data-margin-top="medium"] {
  margin-top: 6rem !important;
}

.hayden-section[data-margin-top="large"] {
  margin-top: 8rem !important;
}

.hayden-section[data-margin-bottom="none"] {
  margin-bottom: 0 !important;
}

.hayden-section[data-margin-bottom="small"] {
  margin-bottom: 4rem !important;
}

.hayden-section[data-margin-bottom="medium"] {
  margin-bottom: 6rem !important;
}

.hayden-section[data-margin-bottom="large"] {
  margin-bottom: 8rem !important;
}

/* Editor-specific margin overrides to match frontend */
.editor-styles-wrapper .hayden-section[data-margin-top="none"],
.block-editor-block-list__layout .hayden-section[data-margin-top="none"] {
  margin-top: 0 !important;
}

.editor-styles-wrapper .hayden-section[data-margin-bottom="none"],
.block-editor-block-list__layout .hayden-section[data-margin-bottom="none"] {
  margin-bottom: 0 !important;
}

/* ---------------------------------------------------------
   Height Control (data-height-mobile/desktop)
   --------------------------------------------------------- */

.hayden-section[data-height-mobile="small"] {
  min-height: 20rem;
}

.hayden-section[data-height-mobile="medium"] {
  min-height: 30rem;
}

.hayden-section[data-height-mobile="large"] {
  min-height: 40rem;
}

@media (min-width: 768px) {
  .hayden-section[data-height-desktop="small"] {
    min-height: 20rem;
  }

  .hayden-section[data-height-desktop="medium"] {
    min-height: 30rem;
  }

  .hayden-section[data-height-desktop="large"] {
    min-height: 40rem;
  }
}

/* ---------------------------------------------------------
   Inner layout wrapper
   --------------------------------------------------------- */

.hayden-section-inner {
  position: relative;
  z-index: 2;
}

/* Constrain text content for readability, but allow columns full width */
.hayden-section-inner > h1,
.hayden-section-inner > h2,
.hayden-section-inner > h3,
.hayden-section-inner > h4,
.hayden-section-inner > h5,
.hayden-section-inner > h6,
.hayden-section-inner > p,
.hayden-section-inner > ul,
.hayden-section-inner > ol {
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

/* Content alignment */
.hayden-section[data-content-align="center"] .hayden-section-inner {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.hayden-section[data-content-align="right"] .hayden-section-inner {
  margin-left: auto;
  margin-right: 0;
  text-align: right;
}

.hayden-section[data-content-align="left"] .hayden-section-inner {
  margin-left: 0;
  margin-right: auto;
  text-align: left;
}

/* ---------------------------------------------------------
   Heading
   --------------------------------------------------------- */

.hayden-section-heading {
  line-height: 1.1;
  margin: 0 0 1.5rem;
  color: var(--color-headings, #f97316);
}

/* Respect typography util classes */
.hayden-type .hayden-type-heading { line-height: 1.1; }
.hayden-type .hayden-type-body { line-height: 1.6; }

/* Default paragraph styling - uses customizer body font size */
.hayden-section-inner > p,
.hayden-section-inner > ul,
.hayden-section-inner > ol,
.hayden-section-inner .wp-block-paragraph {
  font-size: var(--body-font-size-mobile);
  line-height: 1.6;
  color: var(--color-body);
}

@media (min-width: 768px) {
  .hayden-section-inner > p,
  .hayden-section-inner > ul,
  .hayden-section-inner > ol,
  .hayden-section-inner .wp-block-paragraph {
    font-size: var(--body-font-size-desktop);
  }
}

/* Apply body font sizes to inner paragraphs (mobile-first, responsive) */
.hayden-section.hayden-type--body-sm p { font-size: 0.875rem; line-height: 1.25rem; }
.hayden-section.hayden-type--body-base p { font-size: 1rem; line-height: 1.5rem; }
.hayden-section.hayden-type--body-lg p { font-size: 1.125rem; line-height: 1.75rem; }

.hayden-section.hayden-type--body-xl p { font-size: 1.125rem; line-height: 1.75rem; }
@media (min-width: 768px) {
    .hayden-section.hayden-type--body-xl p { font-size: 1.25rem; }
}

.hayden-section.hayden-type--body-2xl p { font-size: 1.25rem; line-height: 1.75rem; }
@media (min-width: 768px) {
    .hayden-section.hayden-type--body-2xl p { font-size: 1.5rem; line-height: 2rem; }
}

.hayden-section.hayden-type--body-3xl p { font-size: 1.5rem; line-height: 2rem; }
@media (min-width: 768px) {
    .hayden-section.hayden-type--body-3xl p { font-size: 1.875rem; line-height: 2.25rem; }
}

/* Apply heading color to inner paragraphs for visibility */
.hayden-section p {
  color: inherit;
}

/* Color inheritance for inline formatting */
.hayden-section strong,
.hayden-section em,
.hayden-section b,
.hayden-section i,
.hayden-section a {
  color: inherit;
}

/* Prevent Section colors from cascading into nested custom blocks */
/* Only reset color on the block wrapper, not all descendants */
.hayden-section > .hayden-section-inner > .hayden-banner,
.hayden-section > .hayden-section-inner > .hayden-faq {
  color: initial;
}

/* Full-width breakout support (match other blocks) */
.hayden-section.alignfull {
  position: relative;
  width: 100vw;
  max-width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  border-radius: 0;
  padding-left: max(1rem, calc((100vw - 100%) / 2));
  padding-right: max(1rem, calc((100vw - 100%) / 2));
}

@media (min-width: 782px) {
  .hayden-section.alignfull {
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    width: 100vw;
    max-width: 100vw;
    padding-left: max(1rem, calc((100vw - 100%) / 2));
    padding-right: max(1rem, calc((100vw - 100%) / 2));
  }
}

/* Editor-specific full-width support */
.editor-styles-wrapper .hayden-section.alignfull,
.block-editor-block-list__layout .hayden-section.alignfull {
  position: relative;
  width: 100%;
  max-width: 100%;
  left: 0;
  right: 0;
  margin-left: 0;
  margin-right: 0;
  padding-left: max(1rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
  padding-right: max(1rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
}

/* Allow nested full-width blocks to break out in editor */
/* In the editor, we need to simulate the full-width breakout without breaking the layout */
/* Since the editor canvas has constraints, we approximate the visual by removing Section padding */
.editor-styles-wrapper .hayden-section .hayden-banner.alignfull,
.editor-styles-wrapper .hayden-section .hayden-banner[data-align="full"],
.editor-styles-wrapper .hayden-section .hayden-faq.alignfull,
.editor-styles-wrapper .hayden-section .hayden-faq[data-align="full"],
.block-editor-block-list__layout .hayden-section .hayden-banner.alignfull,
.block-editor-block-list__layout .hayden-section .hayden-banner[data-align="full"],
.block-editor-block-list__layout .hayden-section .hayden-faq.alignfull,
.block-editor-block-list__layout .hayden-section .hayden-faq[data-align="full"] {
    /* Break out of Section's padding to simulate full-width in editor */
    margin-left: calc(-1 * var(--block-padding, 2.5rem));
    margin-right: calc(-1 * var(--block-padding, 2.5rem));
    width: calc(100% + (2 * var(--block-padding, 2.5rem)));
    max-width: calc(100% + (2 * var(--block-padding, 2.5rem)));
    position: relative;
    box-sizing: border-box;
}

/* ===== style.css ===== */

/* =========================================================
   TESTIMONIAL
   ========================================================= */

/* Outer testimonial container */
.hayden-testimonial {
    position: relative;
    max-width: var(--site-max-width, 90rem);

    /* Default (global) padding */
    padding-top: var(--block-padding-y);
    padding-bottom: var(--block-padding-y);
    padding-left: var(--block-padding-x);
    padding-right: var(--block-padding-x);

    margin-inline: auto;
    margin-top: var(--section-space-mobile);
    margin-bottom: var(--section-space-mobile);

    border-radius: var(--radius-2xl);
    background: var(--hb-bg-color, var(--card-bg));
    color: var(--hb-text-color, var(--card-text, var(--color-body)));
}

/* Full-width breakout support */
.hayden-testimonial.alignfull {
    position: relative;
    width: 100vw;
    max-width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    border-radius: 0;
    box-sizing: border-box;
}

/* Full-width: center content with side padding */
.hayden-testimonial.alignfull {
    padding-left: max(1.5rem, calc((100vw - var(--site-max-width, 90rem)) / 2));
    padding-right: max(1.5rem, calc((100vw - var(--site-max-width, 90rem)) / 2));
}

@media (min-width: 782px) {
    .hayden-testimonial.alignfull {
        left: 50%;
        right: 50%;
        margin-left: -50vw;
        margin-right: -50vw;
        width: 100vw;
        max-width: 100vw;
    }
}

/* Editor-specific full-width support */
.editor-styles-wrapper .hayden-testimonial.alignfull,
.block-editor-block-list__layout .hayden-testimonial.alignfull {
    position: relative;
    width: 100%;
    max-width: 100%;
    left: 0;
    right: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: max(1.5rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
    padding-right: max(1.5rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
}

/* For editor canvas that uses viewport width */
.wp-block[data-align="full"] .hayden-testimonial.alignfull {
    width: 100vw;
    max-width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    padding-left: max(1.5rem, calc((100vw - 100%) / 2));
    padding-right: max(1.5rem, calc((100vw - 100%) / 2));
}

/* Ensure body text color always follows the chosen variable */
.hayden-testimonial,
.hayden-testimonial .hayden-type-body,
.hayden-testimonial .hayden-testimonial-text,
.hayden-testimonial .hayden-testimonial-inner p:not(.hayden-testimonial-author-name):not(.hayden-testimonial-author-title) {
    /* Force body text to honor the Body text colour control on the frontend */
    color: var(--hb-text-color, var(--card-text, var(--color-body))) !important;
}

/* Desktop spacing */
@media (min-width: 768px) {
    .hayden-testimonial {
        margin-top: var(--section-space-desktop);
        margin-bottom: var(--section-space-desktop);
    }
}

/* ---------------------------------------------------------
   Block-level padding overrides
   --------------------------------------------------------- */

/* Vertical padding overrides */
.hayden-testimonial[data-padding-y="small"] {
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
}

.hayden-testimonial[data-padding-y="medium"] {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

.hayden-testimonial[data-padding-y="large"] {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
}

@media (min-width: 768px) {
    .hayden-testimonial[data-padding-y="small"] {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }

    .hayden-testimonial[data-padding-y="medium"] {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .hayden-testimonial[data-padding-y="large"] {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }
}

/* Horizontal padding overrides (only for non-alignfull) */
.hayden-testimonial:not(.alignfull)[data-padding-x="small"] {
    padding-left: var(--block-padding-x-small);
    padding-right: var(--block-padding-x-small);
}

.hayden-testimonial:not(.alignfull)[data-padding-x="medium"] {
    padding-left: var(--block-padding-x-medium);
    padding-right: var(--block-padding-x-medium);
}

.hayden-testimonial:not(.alignfull)[data-padding-x="large"] {
    padding-left: var(--block-padding-x-large);
    padding-right: var(--block-padding-x-large);
}

/* ---------------------------------------------------------
   Content Alignment (data-content-align)
   --------------------------------------------------------- */

.hayden-testimonial[data-content-align="center"] .hayden-testimonial-inner {
    text-align: center;
    margin-inline: auto;
}

/* Force all testimonial content to be left-aligned, including quote svg, regardless of content alignment */
.hayden-testimonial .hayden-testimonial-list,
.hayden-testimonial .hayden-testimonial-item,
.hayden-testimonial .hayden-testimonial-quote,
.hayden-testimonial .hayden-testimonial-quote::before {
    text-align: left !important;
    transform: none !important;
}

/* Keep testimonial cards left-aligned even when heading/intro are centered */
.hayden-testimonial[data-content-align="center"] .hayden-testimonial-list,
.hayden-testimonial[data-content-align="center"] .hayden-testimonial-item {
    text-align: left;
}

.hayden-testimonial[data-content-align="right"] .hayden-testimonial-inner {
    text-align: right;
    margin-left: auto;
}

/* ---------------------------------------------------------
   Top/Bottom Margin Overrides (data-margin-top/bottom)
   --------------------------------------------------------- */

.hayden-testimonial[data-margin-top="none"] {
    margin-top: 0 !important;
}

.hayden-testimonial[data-margin-top="small"] {
    margin-top: 4rem !important;
}

.hayden-testimonial[data-margin-top="medium"] {
    margin-top: 6rem !important;
}

.hayden-testimonial[data-margin-top="large"] {
    margin-top: 8rem !important;
}

.hayden-testimonial[data-margin-bottom="none"] {
    margin-bottom: 0 !important;
}

.hayden-testimonial[data-margin-bottom="small"] {
    margin-bottom: 4rem !important;
}

.hayden-testimonial[data-margin-bottom="medium"] {
    margin-bottom: 6rem !important;
}

.hayden-testimonial[data-margin-bottom="large"] {
    margin-bottom: 8rem !important;
}

/* Editor-specific margin overrides to match frontend */
.editor-styles-wrapper .hayden-testimonial[data-margin-top="none"],
.block-editor-block-list__layout .hayden-testimonial[data-margin-top="none"] {
    margin-top: 0 !important;
}

.editor-styles-wrapper .hayden-testimonial[data-margin-bottom="none"],
.block-editor-block-list__layout .hayden-testimonial[data-margin-bottom="none"] {
    margin-bottom: 0 !important;
}

/* ---------------------------------------------------------
   Height Control (data-height-mobile/desktop)
   --------------------------------------------------------- */

.hayden-testimonial[data-height-mobile="small"] {
    min-height: 20rem;
}

.hayden-testimonial[data-height-mobile="medium"] {
    min-height: 30rem;
}

.hayden-testimonial[data-height-mobile="large"] {
    min-height: 40rem;
}

@media (min-width: 768px) {
    .hayden-testimonial[data-height-desktop="small"] {
        min-height: 20rem;
    }

    .hayden-testimonial[data-height-desktop="medium"] {
        min-height: 30rem;
    }

    .hayden-testimonial[data-height-desktop="large"] {
        min-height: 40rem;
    }
}

/* ---------------------------------------------------------
   Inner layout wrapper
   --------------------------------------------------------- */

.hayden-testimonial-inner {
    max-width: var(--site-max-width, var(--container-content, 72rem));
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 2;
}

/* Full-width testimonials: remove inner max-width constraint since padding handles alignment */
.hayden-testimonial.alignfull .hayden-testimonial-inner {
    max-width: none;
}

/* Content alignment */
.hayden-testimonial[data-content-align="center"] .hayden-testimonial-inner {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.hayden-testimonial[data-content-align="right"] .hayden-testimonial-inner {
    margin-left: auto;
    margin-right: 0;
    text-align: right;
}

.hayden-testimonial[data-content-align="left"] .hayden-testimonial-inner {
    margin-left: 0;
    margin-right: auto;
    text-align: left;
}

/* ---------------------------------------------------------
   Heading
   --------------------------------------------------------- */

.hayden-testimonial-heading {
    line-height: 1.1;
    margin: 0 0 1.5rem;
    color: var(--hb-heading-color, var(--card-heading, #f97316));
}

/* ---------------------------------------------------------
   Intro text
   --------------------------------------------------------- */

.hayden-testimonial-text {
    line-height: 1.6;
    margin: 0 0 2.5rem;
    color: var(--hb-text-color, inherit);
    max-width: 48rem;
}

.hayden-testimonial[data-content-align="center"] .hayden-testimonial-text {
    margin-left: auto;
    margin-right: auto;
}

/* ---------------------------------------------------------
   Testimonial list (grid)
   --------------------------------------------------------- */

.hayden-testimonial-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    margin-top: 2.5rem;
}

@media (min-width: 768px) {
    .hayden-testimonial-list {
        gap: 2.5rem;
    }

    .hayden-testimonial[data-columns="2"] .hayden-testimonial-list {
        grid-template-columns: repeat(2, 1fr);
    }

    .hayden-testimonial[data-columns="3"] .hayden-testimonial-list {
        grid-template-columns: repeat(3, 1fr);
    }

    .hayden-testimonial[data-columns="4"] .hayden-testimonial-list {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* ---------------------------------------------------------
   Individual testimonial item
   --------------------------------------------------------- */

.hayden-testimonial-item {
    background: var(--hb-testimonial-bg, var(--card-bg-alt, #111111));
    border-radius: var(--radius-lg);
    padding: 2rem;
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: visible;
}

/* ---------------------------------------------------------
   Avatar
   --------------------------------------------------------- */

.hayden-testimonial-avatar {
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    overflow: hidden;
    margin-bottom: 1.5rem;
    flex-shrink: 0;
    position: relative;
}

.hayden-testimonial[data-content-align="center"] .hayden-testimonial-avatar {
    margin-left: auto;
    margin-right: auto;
}

.hayden-testimonial[data-content-align="right"] .hayden-testimonial-avatar {
    margin-left: auto;
    margin-right: 0;
}

.hayden-testimonial-avatar img,
.hayden-testimonial-avatar-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
        margin-top: 0;
        padding: 0;
}

/* ---------------------------------------------------------
   Quote
   --------------------------------------------------------- */

.hayden-testimonial .hayden-testimonial-quote {
    font-size: 1rem;
    line-height: 1.6;
    margin: 0 0 1.5rem;
    color: var(--hb-quote-color, var(--card-text-muted, #e5e5e5));
    font-style: italic;
    position: relative;
    flex-grow: 1;
}

.hayden-testimonial-quote::before {
    content: '"';
    font-size: 3rem;
    line-height: 1;
    color: var(--hb-quote-color, var(--color-primary, #f97316));
    opacity: 0.3;
    position: absolute;
    top: -0.5rem;
    left: -0.5rem;
}

.hayden-testimonial[data-content-align="center"] .hayden-testimonial-item {
    text-align: center;
}

.hayden-testimonial[data-content-align="center"] .hayden-testimonial-quote::before {
    left: -0.5rem;
    transform: none;
}

.hayden-testimonial[data-content-align="right"] .hayden-testimonial-quote::before {
    left: auto;
    right: -0.5rem;
}

/* ---------------------------------------------------------
   Author info
   --------------------------------------------------------- */

.hayden-testimonial-author {
    margin-top: auto;
}

.hayden-testimonial-author-name {
    font-weight: 600;
    font-size: 1rem;
    margin: 0 0 0.25rem;
    color: var(--hb-author-name-color, var(--card-heading, #f97316));
}

.hayden-testimonial-author-title,
.hayden-testimonial-author-title a,
a.hayden-testimonial-author-title {
    font-size: 0.875rem;
    margin: 0;
    opacity: 0.8;
    color: var(--hb-author-title-color, var(--card-text-muted, #e5e5e5)) !important;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.hayden-testimonial-item .hayden-testimonial-author-title a,
.hayden-testimonial-item a.hayden-testimonial-author-title {
    color: var(--hb-author-title-color, var(--card-text-muted, #e5e5e5)) !important;
}

.hayden-testimonial-author-title a:hover,
a.hayden-testimonial-author-title:hover {
    opacity: 0.8;
    text-decoration: underline;
}

/* Links inside testimonial cards */
.hayden-testimonial-item a {
    color: var(--hb-testimonial-link-color, var(--card-text, #ffffff));
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.hayden-testimonial-item a:hover {
    opacity: 0.8;
    text-decoration: underline;
}

/* ---------------------------------------------------------
   Editor controls
   --------------------------------------------------------- */

.hayden-testimonial-controls {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    z-index: 10;
    display: none;
}

.editor-styles-wrapper .hayden-testimonial-item:hover .hayden-testimonial-controls,
.block-editor-block-list__layout .hayden-testimonial-item:hover .hayden-testimonial-controls {
    display: block;
}

.hayden-testimonial-add {
    margin-top: 1rem;
}

/* Editor-only: Avatar controls */
.editor-styles-wrapper .hayden-testimonial-avatar,
.block-editor-block-list__layout .hayden-testimonial-avatar {
    position: relative;
}

.editor-styles-wrapper .hayden-testimonial-avatar button,
.block-editor-block-list__layout .hayden-testimonial-avatar button {
    position: absolute;
    bottom: 0;
    right: 0;
    font-size: 0.75rem;
}

/* ---------------------------------------------------------
   Full-width support
   --------------------------------------------------------- */

.hayden-testimonial.alignfull {
    position: relative;
    width: 100vw;
    max-width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    border-radius: 0;
    box-sizing: border-box;
    padding-left: max(1.25rem, calc((100vw - var(--site-max-width, 90rem)) / 2));
    padding-right: max(1.25rem, calc((100vw - var(--site-max-width, 90rem)) / 2));
}

@media (min-width: 782px) {
    .hayden-testimonial.alignfull {
        left: 50%;
        right: 50%;
        margin-left: -50vw;
        margin-right: -50vw;
        width: 100vw;
        max-width: 100vw;
        padding-left: max(1.25rem, calc((100vw - var(--site-max-width, 90rem)) / 1.9));
        padding-right: max(1.25rem, calc((100vw - var(--site-max-width, 90rem)) / 1.9));
    }
}

/* Editor-specific full-width support */
.editor-styles-wrapper .hayden-testimonial.alignfull,
.block-editor-block-list__layout .hayden-testimonial.alignfull {
    position: relative;
    width: 100%;
    max-width: 100%;
    left: 0;
    right: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: max(1rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
    padding-right: max(1rem, calc((100% - var(--wp--style--global--content-size, 48rem)) / 2));
}