/* @import statements hoisted from the tenant's custom CSS — they
               must precede every other rule in this stylesheet or browsers
               silently drop them. */
            

            /* Theme variables and custom CSS.
               themeStyles (:root brand vars) is emitted in BOTH native and
               advanced modes so page-builder components keep brand colors/fonts.
               In advanced mode the imported custom_css is injected afterwards and
               overrides the imported markup's look. */
            :root {
  --color-primary: #9E0B0F;
  --color-secondary: #1a1a1a;
  --color-accent: #9E0B0F;
  --color-secondaryAccent: #7a080b;
  --color-background: #f8f9fa;
  --color-surface: #ffffff;
  --color-text: #1a1a1a;
  --color-textSecondary: #4b5563;
  --color-heading: var(--color-text);
  --heading-h1-size: 2.5rem;
  --heading-h1-color: var(--color-heading, var(--color-text));
  --heading-h2-size: 2rem;
  --heading-h2-color: var(--color-heading, var(--color-text));
  --heading-h3-size: 1.75rem;
  --heading-h3-color: var(--color-heading, var(--color-text));
  --heading-h4-size: 1.5rem;
  --heading-h4-color: var(--color-heading, var(--color-text));
  --heading-h5-size: 1.25rem;
  --heading-h5-color: var(--color-heading, var(--color-text));
  --heading-h6-size: 1rem;
  --heading-h6-color: var(--color-heading, var(--color-text));
  --color-border: #e5e7eb;
  --color-success: #10b981;
  --color-warning: #f59e0b;
  --color-error: #ef4444;
  --font-primary: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-secondary: 'Playfair Display', 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --content-max-width: 100%;
}
body { background-color: #f8f9fa; }

body { background-color: #f8f9fa; }

            /* Site-level custom CSS (sanitized). Only applied in advanced mode;
               native mode stores but does not apply. */
            /* ==========================================================================
   The Cavalry Group — Recur Sites custom CSS (stylingMode: advanced)
   Every value harvested from the original source (artifacts/web) — see
   artifacts/web/recur/STYLE_INVENTORY.md for file:line provenance.
   Theme deploys with contentWidth:"full"; regular sections re-capped here.
   ========================================================================== */

:root {
  /* @theme, index.css:12-20 */
  --cg-red: #9E0B0F;
  --cg-red-dark: #7a080b;
  --cg-red-hover-header: #7a0909;   /* SiteHeader.tsx:87 */
  --cg-charcoal: #1a1a1a;
  --cg-offwhite: #f8f9fa;
  --cg-white: #ffffff;
  --cg-gray-600: #4b5563;           /* body copy, home.tsx:186 */
  --cg-gray-700: #374151;           /* dropdown items, SiteHeader.tsx:249 */
  --cg-gray-50: #f9fafb;            /* dropdown hover bg */
  --cg-gray-100: #f3f4f6;           /* dropdown border */
  --cg-gray-200: #e5e7eb;           /* light card border, join.tsx:97 */
  --cg-content-cap: 1280px;         /* Tailwind container, home.tsx:179 */
  --cg-section-pad-y: 6rem;         /* py-24, home.tsx:178 */
  --cg-transition: 150ms cubic-bezier(0.4, 0, 0.2, 1); /* Tailwind default */
  --cg-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
  --font-primary: 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-secondary: 'Playfair Display', Georgia, serif;
}

/* ---------- Base (index.css:31-38) ---------- */
body {
  background: var(--cg-offwhite);
  color: var(--cg-charcoal);
  font-family: var(--font-primary);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
::selection { background: var(--cg-red); color: #fff; }
h1, h2, h3, h4, h5, h6 { letter-spacing: -0.025em; color: var(--cg-charcoal); }

/* ---------- Content width: full-bleed theme; re-cap sections.
   Container = 1280px, px 1.5rem → 3rem @768 (home.tsx:179). ---------- */
main { max-width: none; padding: 0; }
main > * {
  max-width: var(--cg-content-cap);
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-width: 768px) {
  main > * { padding-left: 3rem; padding-right: 3rem; }
}
main > .puck-hero,
main > .puck-cta {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}
/* Heroes must be full-bleed even when the renderer nests them in a wrapper
   that the re-cap rule above constrains. */
main .puck-hero { max-width: none; padding-left: 0; padding-right: 0; }
main > :has(> .puck-hero) {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}
/* Carousel prev/next arrows are hidden on the original site. */
.puck-hero .carousel-nav,
.hero-carousel .carousel-prev,
.hero-carousel .carousel-next { display: none !important; }
.puck-hero-content, .puck-cta { padding-left: 1.5rem; padding-right: 1.5rem; }
@media (min-width: 768px) {
  .puck-hero-content, .puck-cta { padding-left: 3rem; padding-right: 3rem; }
}

/* ---------- Typography (harvested) ---------- */
/* Body copy: text-lg gray-600 leading-relaxed (home.tsx:186) */
.puck-text { color: var(--cg-gray-600); font-size: 1.125rem; line-height: 1.625; }
.puck-text a { color: var(--cg-red); font-weight: 600; text-decoration: none; }
.puck-text a:hover { text-decoration: underline; }
.puck-text blockquote {
  border-left: 4px solid var(--cg-red);
  padding: 0.5rem 0 0.5rem 1.5rem;
  font-family: var(--font-secondary);
  font-style: italic;
  color: var(--cg-charcoal);
}
/* Section headings: font-serif bold, 2.25rem → 3rem @768, lh 1.25, mb 2rem (home.tsx:183) */
.puck-heading h2, .puck-heading h3, h2.puck-heading, h3.puck-heading {
  font-family: var(--font-secondary);
  font-weight: 700;
  font-size: 2.25rem;
  line-height: 1.25;
  color: var(--cg-charcoal);
  margin-bottom: 2rem;
}
@media (min-width: 768px) {
  .puck-heading h2, .puck-heading h3, h2.puck-heading, h3.puck-heading { font-size: 3rem; }
}

/* ---------- Section rhythm: py-24 (home.tsx:178,220,277) ---------- */
main > .puck-grid, main > .puck-flex, main > .puck-text, main > .puck-heading {
  padding-top: var(--cg-section-pad-y);
  padding-bottom: var(--cg-section-pad-y);
}
main > * + .puck-text, main > .puck-heading + * { padding-top: 0; }

/* ---------- Heroes ---------- */
.puck-hero { color: #fff; }
/* Hero title: text-5xl → 7xl @768, serif 700, lh 1.1, mb 2rem (home.tsx:89) */
.puck-hero-title {
  font-family: var(--font-secondary);
  font-weight: 700;
  font-size: 3rem;
  line-height: 1.1;
  color: #fff;
  margin-bottom: 2rem;
}
@media (min-width: 768px) { .puck-hero-title { font-size: 4.5rem; } }
/* Hero lead: text-xl→2xl@768, font-light, white/90, red left border (home.tsx:92) */
.puck-hero-subtitle {
  color: rgba(255, 255, 255, 0.9);
  font-size: 1.25rem;
  font-weight: 300;
  line-height: 1.625;
  border-left: 4px solid var(--cg-red);
  padding: 0.5rem 0 0.5rem 1.5rem;
}
@media (min-width: 768px) { .puck-hero-subtitle { font-size: 1.5rem; } }
/* Hero badge: red pill, white text (home.tsx:86) */
.puck-hero-eyebrow {
  display: inline-block;
  background: var(--cg-red);
  color: #fff;
  padding: 0.375rem 1rem;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 1.5rem;
  border-radius: 0;
}

/* ---------- Buttons (home.tsx:97,101; our-mission.tsx:211) ----------
   Primary: bg red, px-8 py-4, rounded(4px), bold, uppercase, tracking-wider */
.puck-button,
.puck-hero-cta-primary,
.puck-cta-primary,
.recur-product-card-button, .recur-event-card-button, .recur-blog-card-button,
.recur-donation-submit {
  background: var(--cg-red);
  color: #fff;
  border: none;
  border-radius: 0.25rem;
  padding: 1rem 2rem;
  font-weight: 700;
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  transition: all var(--cg-transition);
}
.puck-button:hover,
.puck-hero-cta-primary:hover,
.puck-cta-primary:hover,
.recur-product-card-button:hover, .recur-event-card-button:hover,
.recur-blog-card-button:hover, .recur-donation-submit:hover {
  background: var(--cg-red-dark);
}
/* Secondary: bg white/10, border white/20, backdrop-blur (home.tsx:101) */
.puck-hero-cta-secondary,
.puck-cta-secondary {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.2);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  border-radius: 0.25rem;
  padding: 1rem 2rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  transition: all var(--cg-transition);
}
.puck-hero-cta-secondary:hover, .puck-cta-secondary:hover { background: rgba(255, 255, 255, 0.2); }
.carousel-dots button, .carousel-dot { background: rgba(255, 255, 255, 0.5); }
.carousel-dots .active, .carousel-dot.active { background: var(--cg-red); }

/* ---------- CTA band (dark section pattern, home.tsx:220-275) ---------- */
.puck-cta { background: var(--cg-charcoal); color: #fff; }
.puck-cta-title { font-family: var(--font-secondary); font-weight: 700; color: #fff; }
.puck-cta-description { color: rgba(255, 255, 255, 0.6); font-size: 1.125rem; line-height: 1.625; }

/* ---------- Cards (join.tsx:97 light; home.tsx:261 dark) ---------- */
.puck-card {
  background: var(--cg-offwhite);
  border: 1px solid var(--cg-gray-200);
  border-radius: 0.5rem;
  padding: 1rem 1.25rem;
  box-shadow: none;
  transition: background-color var(--cg-transition), border-color var(--cg-transition);
}
.puck-card-title { font-weight: 700; color: var(--cg-charcoal); }
.puck-card-description { color: var(--cg-gray-600); font-size: 0.875rem; line-height: 1.625; }
.puck-card-icon { color: var(--cg-red); }
.puck-cta .puck-card, .cg-dark .puck-card {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 0.25rem;
  padding: 2rem;
}
.puck-cta .puck-card:hover, .cg-dark .puck-card:hover { background: rgba(255, 255, 255, 0.1); }

/* ---------- Stats ---------- */
.puck-stat-value { color: var(--cg-red); font-family: var(--font-secondary); font-weight: 700; }
.puck-stat-label { color: var(--cg-charcoal); font-weight: 600; }
.puck-stat-description { color: var(--cg-gray-600); }

/* ==========================================================================
   HEADER CHROME (SiteHeader.tsx)
   ========================================================================== */
.site-header {
  background: var(--cg-charcoal);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  position: sticky;
  top: 0;
  z-index: 50;
}
.site-header .header-grid {
  max-width: var(--cg-content-cap);
  margin: 0 auto;
  padding-left: 0.25rem;
  padding-right: 0.75rem;
}
@media (min-width: 768px) {
  .site-header .header-grid { padding-left: 0.5rem; padding-right: 1.5rem; }
}
@media (min-width: 1024px) {
  .site-header .header-grid { padding-left: 1rem; padding-right: 3rem; }
}
.site-header .header-grid-row { min-height: 8rem; align-items: center; } /* h-32, :21 */
.site-header .header-logo-img,
.site-header .header-logo img {
  height: 7rem !important;   /* h-28, SiteHeader.tsx:23 */
  width: auto !important;
  max-width: none !important; /* renderer injects inline max-width:200px */
}

/* Nav links (:36-55). Renderer markup: .nav-menu > li > .nav-link / .nav-link-dropdown,
   with a default color of var(--color-text, #333) — invisible on the charcoal bar,
   so top-level link color must be forced. */
.site-header a, .site-header nav a { text-decoration: none; }
.site-header .nav-menu > li > .nav-link,
.site-header .nav-menu > li > .nav-link-dropdown,
.site-header .nav-menu > li > a {
  font-size: 0.875rem;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.8) !important;
  padding: 0.5rem 0.75rem;
  border-radius: 0.25rem;
  white-space: nowrap;
  transition: color var(--cg-transition);
  background: none;
}
.site-header .nav-menu > li > .nav-link:hover,
.site-header .nav-menu > li > .nav-link-dropdown:hover,
.site-header .nav-menu > li > a:hover {
  color: #fff !important;
  background: none;
  opacity: 1;
}
.site-header .nav-menu { gap: 0.25rem !important; justify-content: center; }

/* Dropdown panel (:60, :278) — renderer class .nav-dropdown */
.site-header .nav-dropdown {
  background: var(--cg-white);
  border: 1px solid var(--cg-gray-100);
  border-radius: 0.25rem;
  box-shadow: var(--cg-shadow-xl);
  padding: 0.25rem 0;
  min-width: 14rem;
  margin-top: 0;
}
.site-header .nav-item-nested > .nav-dropdown { min-width: 13rem; }
/* Dropdown items (:249,259,273) */
.site-header .nav-dropdown a,
.site-header .nav-dropdown .nav-link,
.site-header .nav-dropdown .nav-link-dropdown {
  display: block;
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  color: var(--cg-gray-700) !important;
  transition: background-color var(--cg-transition), color var(--cg-transition);
}
.site-header .nav-dropdown a:hover,
.site-header .nav-dropdown .nav-link:hover,
.site-header .nav-dropdown .nav-link-dropdown:hover {
  background: var(--cg-gray-50);
  color: var(--cg-red) !important;
  opacity: 1;
}

/* Header buttons (custom section .cg-header-actions) (:76-91) */
.cg-header-actions { display: flex; align-items: center; gap: 1.5rem; }
.cg-login-btn {
  border: 1px solid rgba(255, 255, 255, 0.4);
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 0.875rem;
  padding: 0.375rem 1rem;
  border-radius: 0.25rem;
  white-space: nowrap;
  transition: border-color var(--cg-transition), color var(--cg-transition);
}
.cg-login-btn:hover { border-color: #fff; color: #fff !important; }
.cg-join-btn {
  background: var(--cg-red);
  color: #fff !important;
  padding: 0.5rem 1.25rem;
  border-radius: 0.25rem;
  font-size: 0.875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
  transition: background-color var(--cg-transition);
}
.cg-join-btn:hover { background: var(--cg-red-hover-header); }

/* Renderer defaults .desktop-nav to display:none and never re-shows it —
   desktop nav visibility must come from custom CSS. Breakpoint lg=1024px (:95). */
@media (min-width: 1024px) {
  .site-header .desktop-nav { display: flex !important; align-items: center; }
  .site-header .mobile-menu-toggle { display: none !important; }
}
/* Mobile menu (breakpoint lg=1024px; drawer bg #111) (:95-225) */
@media (max-width: 1023px) {
  .cg-header-actions { display: none; }
  .site-header .desktop-nav { display: none !important; }
  .site-header .mobile-menu-toggle { display: block !important; }
}
/* Renderer defaults paint the drawer white with #333 links via
   `.mobile-nav ul li a` (specificity 0-1-2) — match/beat that specificity.
   Markup is a FLAT \003c ul>: dropdown parents render as \003c a href="#">, children
   follow inline. Recreate hierarchy visually: href="#" = group header,
   everything else = indented child; standalone top-level links (Newswire,
   Store) pinned by href. */
.mobile-nav, .mobile-nav-menu {
  background: #111 !important;
  color: #fff;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.mobile-nav .mobile-nav-header { border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
.mobile-nav .mobile-nav-title { color: #fff; font-weight: 700; }
.mobile-nav .mobile-nav-close { color: #fff; }
.mobile-nav ul li { border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
/* child links (default): indented, dimmer */
.mobile-nav ul li a, .mobile-nav-menu a {
  color: rgba(255, 255, 255, 0.75);
  font-size: 0.9375rem;
  padding: 0.75rem 1rem 0.75rem 2.25rem;
}
.mobile-nav ul li a:hover, .mobile-nav-menu a:hover { color: #fff; }
.mobile-nav ul li a:active { background: rgba(255, 255, 255, 0.06); }
/* group headers: non-navigating parents */
.mobile-nav ul li a[href="#"] {
  color: #fff;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.75rem;
  padding: 1rem 1rem 0.5rem;
  background: rgba(255, 255, 255, 0.04);
  pointer-events: none;
}
/* standalone top-level links (no children) — style as top-level, not child */
.mobile-nav ul li a[href="/store"],
.mobile-nav ul li a[href^="https://cavalrygroupnewswire"] {
  color: #fff;
  font-weight: 600;
  padding-left: 1rem;
}
.mobile-nav-toggle, .mobile-menu-toggle { color: #fff; padding: 0.5rem; }

/* ==========================================================================
   FOOTER CHROME (SiteFooter.tsx)
   ========================================================================== */
.site-footer {
  background: var(--cg-charcoal);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.6);
  margin-top: 0;
}
.site-footer a { color: rgba(255, 255, 255, 0.6); text-decoration: none; }
/* Renderer wraps custom sections in .site-footer-section with an injected
   h3.site-footer-title — hide titles, flatten wrappers to full-width blocks. */
.site-footer .site-footer-content {
  display: block;
  padding: 0;
  max-width: none;
  margin: 0;
  gap: 0;
}
.site-footer .site-footer-section { padding: 0; margin: 0; }
.site-footer .site-footer-title { display: none; }
.site-footer .site-footer-custom { width: 100%; }

/* Slogan ticker (custom section .cg-marquee) (:35-55, index.css:22-29) */
@keyframes cg-marquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.cg-marquee {
  overflow: hidden;
  white-space: nowrap;
  background: var(--cg-red);
  padding: 0.75rem 0;
}
.cg-marquee-track {
  display: inline-flex;
  animation: cg-marquee 28s linear infinite;
  will-change: transform;
}
.cg-marquee-track span {
  display: inline-flex;
  align-items: center;
  gap: 1.25rem;
  padding: 0 1.75rem;
  color: #fff;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.75rem;
}
.cg-marquee-track .cg-dot { color: rgba(255, 255, 255, 0.5); font-size: 1rem; }
@media (prefers-reduced-motion: reduce) { .cg-marquee-track { animation: none; } }

/* Main grid (custom section .cg-footer) (:58-59) */
.cg-footer {
  max-width: var(--cg-content-cap);
  margin: 0 auto;
  padding: 4rem 1.5rem;
}
@media (min-width: 768px) { .cg-footer { padding-left: 3rem; padding-right: 3rem; } }
.cg-footer-grid { display: grid; grid-template-columns: 1fr; gap: 2.5rem; }
@media (min-width: 640px) { .cg-footer-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .cg-footer-grid { grid-template-columns: repeat(4, 1fr); } }

.cg-footer-logo { height: 8rem; width: auto; margin-bottom: 1.25rem; }   /* h-32 mb-5, :63 */
.cg-footer p { font-size: 0.875rem; line-height: 1.625; margin: 0 0 1.25rem; }
.cg-footer h4 {
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin: 0 0 1.25rem;
}
.cg-footer ul { list-style: none; margin: 0; padding: 0; }
.cg-footer-links li + li { margin-top: 0.625rem; }                       /* space-y-2.5 */
.cg-footer-links a {
  font-size: 0.875rem;
  display: inline-block;
  transition: color var(--cg-transition), transform var(--cg-transition);
}
.cg-footer-links a:hover { color: #fff; transform: translateX(2px); }

/* Socials: 36px circles (:75) */
.cg-socials { display: flex; gap: 0.75rem; flex-wrap: wrap; }
.cg-socials a {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color var(--cg-transition), color var(--cg-transition);
}
.cg-socials a:hover { background: var(--cg-red); color: #fff; }
.cg-socials svg { width: 1rem; height: 1rem; }

/* Contact list (:98-115) */
.cg-footer-contact li { display: flex; align-items: flex-start; gap: 0.75rem; font-size: 0.875rem; }
.cg-footer-contact li + li { margin-top: 1rem; }                          /* space-y-4 */
.cg-footer-contact svg { width: 1rem; height: 1rem; color: var(--cg-red); flex-shrink: 0; margin-top: 0.125rem; }
.cg-footer-contact a:hover { color: #fff; }
.cg-member-portal { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(255, 255, 255, 0.1); }
.cg-member-portal-label { font-size: 0.75rem; color: rgba(255, 255, 255, 0.4); margin: 0 0 0.75rem; }
.cg-member-portal a {
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 0.3);
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.75rem;
  padding: 0.5rem 1rem;
  border-radius: 0.25rem;
  transition: border-color var(--cg-transition), color var(--cg-transition);
}
.cg-member-portal a:hover { border-color: #fff; color: #fff; }

/* Legal row — renderer's bottom bar (:168-180) */
.footer-bottom-bar {
  background: var(--cg-charcoal);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.4);
  font-size: 0.75rem;
  padding: 1.25rem 1.5rem;
}
.footer-bottom-bar-copy { color: rgba(255, 255, 255, 0.4); }
.footer-bottom-bar-link { color: rgba(255, 255, 255, 0.4); transition: color var(--cg-transition); }
.footer-bottom-bar-link:hover { color: #fff; }

/* ---------- FAQ accordion (Embed markup, retained) ---------- */
.cg-faq {
  background: var(--cg-white);
  border: 1px solid var(--cg-gray-200);
  border-radius: 0.5rem;
  margin-bottom: 0.75rem;
  overflow: hidden;
}
.cg-faq summary {
  cursor: pointer;
  list-style: none;
  padding: 1rem 3rem 1rem 1.25rem;
  font-weight: 700;
  color: var(--cg-charcoal);
  position: relative;
  transition: background-color var(--cg-transition);
}
.cg-faq summary::-webkit-details-marker { display: none; }
.cg-faq summary::after {
  content: "+";
  position: absolute;
  right: 1.25rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.4rem;
  font-weight: 400;
  color: var(--cg-red);
}
.cg-faq[open] summary::after { content: "\2013"; }
.cg-faq[open] summary { background: var(--cg-offwhite); border-bottom: 1px solid var(--cg-gray-200); }
.cg-faq summary:hover { background: var(--cg-offwhite); }
.cg-faq .cg-faq-body, .cg-faq > div, .cg-faq > p { padding: 1rem 1.25rem; color: var(--cg-gray-600); line-height: 1.625; }

/* ---------- Recur data blocks ---------- */
.recur-product-card, .recur-event-card, .recur-blog-card {
  background: var(--cg-white);
  border: 1px solid var(--cg-gray-200);
  border-radius: 0.5rem;
  overflow: hidden;
  transition: background-color var(--cg-transition), border-color var(--cg-transition);
}
.recur-product-card-title, .recur-event-card-title, .recur-blog-card-title { color: var(--cg-charcoal); font-weight: 700; }
.recur-product-card-price { color: var(--cg-red); font-weight: 800; }
.recur-donation-amount-button {
  border: 2px solid var(--cg-gray-200);
  border-radius: 0.25rem;
  font-weight: 600;
  transition: border-color var(--cg-transition), color var(--cg-transition);
}
.recur-donation-amount-button:hover { border-color: var(--cg-red); color: var(--cg-red); }
.recur-donation-title { font-family: var(--font-secondary); }



            /* Base styles */
            * {
              margin: 0;
              padding: 0;
              box-sizing: border-box;
            }
            
            body {
              font-family: Plus Jakarta Sans;
              line-height: 1.6;
              color: var(--color-text, #333);
              background-color: var(--color-background, #ffffff);
            }

            /* Global image safety — prevents oversized AMS/Quill images from breaking layouts */
            img {
              max-width: 100%;
              height: auto;
            }

            /* Public search: uses theme tokens and stays compact in either
               chrome region while allowing the full results page to breathe. */
            .site-search { position:relative; display:flex; align-items:center; gap:.4rem; min-width:0; }
            .site-search-input, .public-search-form input { min-width:0; width:100%; padding:.5rem .65rem; border:1px solid var(--color-border,#d1d5db); border-radius:.375rem; color:var(--color-text,#111827); background:var(--color-background,#fff); font:inherit; }
            .site-search-input[data-input-background="transparent"] { background:transparent; }
            .site-search-button, .public-search-form button { border:0; border-radius:.375rem; padding:.5rem .7rem; background:var(--color-primary,#2563eb); color:var(--color-on-primary,#fff); font:inherit; cursor:pointer; }
            .site-search-icon-button { min-width:2.4rem; min-height:2.4rem; padding:.35rem; font-size:1.35rem; line-height:1; }
            .site-search-suggestions { position:absolute; z-index:100; top:calc(100% + .3rem); left:0; right:0; max-height:18rem; overflow:auto; margin:0; padding:.25rem; list-style:none; border:1px solid var(--color-border,#d1d5db); border-radius:.375rem; background:var(--color-background,#fff); box-shadow:0 8px 20px rgba(0,0,0,.15); }
            .site-search-suggestion { padding:.55rem .65rem; cursor:pointer; color:var(--color-text,#111827); border-radius:.25rem; }
            .site-search-suggestion[aria-selected="true"], .site-search-suggestion:hover { background:var(--color-surface,#f3f4f6); }
            .public-search-page { max-width:900px; margin:0 auto; padding:3rem 1.25rem; color:var(--color-text,#111827); }
            .public-search-page h1 { margin:0 0 1rem; font-size:2rem; }
            .public-search-form { display:flex; gap:.6rem; align-items:end; flex-wrap:wrap; margin-bottom:1.5rem; }
            .public-search-form label { width:100%; font-weight:600; }
            .public-search-form input { flex:1 1 18rem; }
            .public-search-results { display:grid; gap:1rem; padding:0; list-style:none; }
            .public-search-result { padding:1rem; border:1px solid var(--color-border,#e5e7eb); border-radius:.5rem; }
            .public-search-result h2 { margin:.35rem 0; font-size:1.2rem; }.public-search-result p { margin:.35rem 0 .65rem; color:var(--color-textSecondary,#4b5563); }
            .public-search-result a, .public-search-pages a { color:var(--color-primary,#2563eb); }.public-search-type,.public-search-strength { font-size:.8rem; }.public-search-strength { float:right; color:var(--color-textSecondary,#4b5563); }
            .public-search-pages { display:flex; justify-content:center; gap:1rem; margin-top:1.5rem; }
            @media (max-width: 640px) { .site-search { width:100%; }.public-search-form { align-items:stretch; }.public-search-form button { width:100%; } }
            
            /* Quill alignment styles for rich text content */
            .ql-align-center {
              text-align: center;
            }
            .ql-align-right {
              text-align: right;
            }
            .ql-align-justify {
              text-align: justify;
            }
            .ql-indent-1 { padding-left: 3em; }
            .ql-indent-2 { padding-left: 6em; }
            .ql-indent-3 { padding-left: 9em; }
            .ql-indent-4 { padding-left: 12em; }
            .ql-indent-5 { padding-left: 15em; }
            
            /* Quill font families - matches Quill whitelist */
            .ql-font-arial { font-family: Arial, sans-serif; }
            .ql-font-helvetica { font-family: Helvetica, sans-serif; }
            .ql-font-georgia { font-family: Georgia, serif; }
            .ql-font-times-new-roman { font-family: 'Times New Roman', serif; }
            .ql-font-courier-new { font-family: 'Courier New', monospace; }
            .ql-font-verdana { font-family: Verdana, sans-serif; }
            .ql-font-comic-sans { font-family: 'Comic Sans MS', cursive; }
            .ql-font-lucida { font-family: 'Lucida Console', monospace; }
            .ql-font-inter { font-family: 'Inter', sans-serif; }
            .ql-font-poppins { font-family: 'Poppins', sans-serif; }
            .ql-font-permanent-marker { font-family: 'Permanent Marker', cursive; }
            .ql-font-theme-body { font-family: var(--font-primary, system-ui, sans-serif); }
            .ql-font-theme-header { font-family: var(--font-secondary, var(--font-primary, system-ui)); }
            .ql-font-serif { font-family: Georgia, 'Times New Roman', serif; }
            .ql-font-monospace { font-family: 'Courier New', Consolas, monospace; }
            
            /* Quill code blocks */
            pre.ql-syntax,
            .rich-text-content pre,
            .puck-text pre {
              background-color: var(--color-surface, #f5f5f5);
              color: var(--color-text, #333);
              padding: 12px 16px;
              border-radius: 6px;
              overflow-x: auto;
              font-family: 'Courier New', Consolas, monospace;
              font-size: 0.9em;
              line-height: 1.5;
              margin: 16px 0;
              white-space: pre-wrap;
              word-wrap: break-word;
            }
            
            /* Quill inline code */
            .rich-text-content code,
            .puck-text code {
              background-color: var(--color-surface, #f0f0f0);
              padding: 2px 6px;
              border-radius: 3px;
              font-family: 'Courier New', Consolas, monospace;
              font-size: 0.9em;
            }
            
            /* Quill blockquote */
            .rich-text-content blockquote,
            .puck-text blockquote,
            blockquote.ql-blockquote {
              border-left: 4px solid var(--color-primary, #3b82f6);
              padding-left: 16px;
              margin: 16px 0;
              font-style: italic;
              color: var(--color-text-secondary, #666);
            }
            
            /* Quill paragraph spacing */
            p {
              margin-bottom: 15px;
            }
            p:last-child {
              margin-bottom: 0;
            }
            
            /* Rich text content - Quill formatting styles */
            .rich-text-content ul,
            .puck-text ul {
              margin: 15px 0;
              padding-left: 1.5em;
              list-style-type: disc;
              list-style-position: outside;
            }
            
            .rich-text-content ol,
            .puck-text ol {
              margin: 15px 0;
              padding-left: 1.5em;
              list-style-type: decimal;
              list-style-position: outside;
            }
            
            .rich-text-content li,
            .puck-text li {
              margin-bottom: 8px;
              display: list-item;
              padding-left: 0.5em;
            }
            
            /* Nested lists */
            .rich-text-content ul ul,
            .puck-text ul ul {
              list-style-type: circle;
              margin-top: 8px;
              margin-bottom: 8px;
            }
            
            .rich-text-content ul ul ul,
            .puck-text ul ul ul {
              list-style-type: square;
            }
            
            .rich-text-content ol ol,
            .puck-text ol ol {
              list-style-type: lower-alpha;
              margin-top: 8px;
              margin-bottom: 8px;
            }
            
            .rich-text-content ol ol ol,
            .puck-text ol ol ol {
              list-style-type: lower-roman;
            }
            
            /* Responsive Grid - matches Puck editor behavior */
            /* Uses CSS variable for column count set via inline style */
            .puck-grid {
              display: grid;
              gap: 1rem;
            }
            .puck-grid.responsive-grid {
              grid-template-columns: 1fr;  /* Mobile: single column */
            }
            @media (min-width: 768px) {
              .puck-grid.responsive-grid {
                grid-template-columns: var(--grid-template, repeat(var(--grid-columns, 2), 1fr));
              }
            }
            .puck-grid-column {
              /* Structural child wrapper: content components own appearance. */
            }
            
            /* Header Navigation */
            .site-header {
              position: relative;
              
              background: var(--color-surface, #f5f5f5);
              
              padding: 1rem;
              border-bottom: 1px solid var(--color-border, #ddd);
              
              
            }
            
            /* Background image layer — sits above bg color, below all content (same as React approach) */
            
            
            .site-header nav > ul {
              list-style: none;
              display: flex;
              flex-direction: row;
              gap: 2rem;
              max-width: var(--header-max-width, var(--content-max-width, 1200px));
              margin: 0 auto;
              align-items: center;
              justify-content: center;
            }
            
            .site-header nav a,
            .site-header nav a:link,
            .site-header nav a:visited,
            .site-header nav a:hover,
            .site-header nav a:active,
            .site-header .nav-link,
            .site-header .nav-link-dropdown,
            .site-header .nav-menu a {
              color: var(--color-text, #333);
              text-decoration: none;
            }
            
            .site-header nav a:hover,
            .site-header .nav-link:hover,
            .site-header .nav-link-dropdown:hover {
              opacity: 0.8;
              
              text-decoration: none;
            }
            
            /* Navigation Style variants */
            .site-header .nav-link,
                  .site-header .nav-link-dropdown {
                    padding: 0.5rem 1rem;
                    border-radius: 0.375rem;
                    transition: background-color 0.2s ease;
                  }
                  .site-header .nav-link:hover,
                  .site-header .nav-link-dropdown:hover {
                    background-color: rgba(0,0,0,0.05);
                    opacity: 1;
                  }
            
            /* Footer */
            .site-footer {
              background: var(--color-surface, #f5f5f5);
              color: var(--color-text, #333);
              padding: 2rem 1rem 1rem;
              margin-top: 4rem;
              border-top: 1px solid var(--color-border, #ddd);
              
            }
            
            .site-footer a {
              color: var(--color-primary, #1976d2);
              text-decoration: none;
            }
            
            .site-footer a:hover {
              opacity: 0.8;
            }
            
            /* Ensure all footer navigation links have no underline */
            .site-footer ul a,
            .site-footer nav a,
            .site-footer li a {
              text-decoration: none;
            }
            
            /* Main content */
            main {
              max-width: var(--content-max-width, 1200px);
              margin: 0 auto;
              padding: 2rem;
            }

            /* A leading hero sits flush beneath the site header by cancelling main's
               2rem top padding. This applies in every content-width mode (not just
               full width). Only the FIRST child matches, so a hero placed lower on the
               page is never pulled upward. */
            #puck-content > .puck-hero:first-child {
              margin-top: -2rem;
            }
            
            h1, h2, h3, h4, h5, h6 {
              color: var(--color-heading, var(--color-text, #333));
              /* Parity with the editor/preview: .puck-root h1–h6 use the theme's
                 header font (--font-secondary). Without this, published headings
                 silently fall back to the body font. */
              font-family: var(--font-secondary, var(--font-primary, system-ui));
            }

            h1 {
              margin-bottom: 1rem;
            }
            
            .published-note {
              color: var(--color-textSecondary, #666);
              font-size: 0.875rem;
              margin-bottom: 2rem;
            }
            
            .content-preview {
              background: var(--color-surface, #f9f9f9);
              padding: 2rem;
              border-radius: 8px;
              border: 1px solid var(--color-border, #ddd);
            }
            
            /* @pqina/flip v1.8.4 - Vendor CSS for Flip Counter */
            .tick{box-sizing:border-box;-webkit-user-select:none;-ms-user-select:none;user-select:none;cursor:default;position:relative;z-index:1;line-height:1.4}.tick *{box-sizing:inherit}.tick [data-view]{max-width:100%}.tick span[data-view]{display:inline-block}.tick .tick-credits{position:absolute;right:0;bottom:0;opacity:.4;text-decoration:none;font-size:11px;color:inherit}.tick [data-layout~=pad]{margin:-.25em}.tick [data-layout~=pad]>*{margin:.25em}.tick [data-layout~=horizontal]{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:center;justify-content:center}.tick [data-layout~=horizontal][data-layout~=baseline]{-ms-flex-align:baseline;align-items:baseline}.tick [data-layout~=horizontal][data-layout~=center]{-ms-flex-pack:center;justify-content:center}.tick [data-layout~=horizontal][data-layout~=right]{-ms-flex-pack:end;justify-content:flex-end}.tick [data-layout~=horizontal][data-layout~=left]{-ms-flex-pack:start;justify-content:flex-start}.tick [data-layout~=horizontal][data-layout~=fill],.tick [data-layout~=horizontal][data-layout~=stretch]{-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.tick [data-layout~=horizontal][data-layout~=fill]>*,.tick [data-layout~=horizontal][data-layout~=stretch]>*{-ms-flex:1 0 0px;flex:1 0 0;width:100%}.tick [data-layout~=horizontal][data-layout~=multi-line]{-ms-flex-wrap:wrap;flex-wrap:wrap}.tick [data-layout~=horizontal][data-layout~=fit]{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-line-pack:center;align-content:center;white-space:nowrap;-ms-flex-pack:start;justify-content:flex-start}.tick [data-layout~=vertical]{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center}.tick [data-layout~=vertical][data-layout~=top]{-ms-flex-pack:start;justify-content:flex-start}.tick [data-layout~=vertical][data-layout~=bottom]{-ms-flex-pack:end;justify-content:flex-end;min-height:100%}.tick [data-layout~=vertical][data-layout~=middle]{-ms-flex-pack:center;justify-content:center;min-height:100%}.tick [data-layout~=vertical][data-layout~=left]{-ms-flex-align:start;align-items:flex-start}.tick [data-layout~=vertical][data-layout~=right]{-ms-flex-align:end;align-items:flex-end}.tick [data-layout~=vertical][data-layout~=center]{text-align:center}.tick [data-layout~=vertical][data-layout~=fill],.tick [data-layout~=vertical][data-layout~=stretch]{-ms-flex-align:stretch;align-items:stretch;min-height:100%}.tick [data-layout~=vertical][data-layout~=fill]>*,.tick [data-layout~=vertical][data-layout~=stretch]>*{-ms-flex:1 0 0px;flex:1 0 0}.tick [data-layout~=vertical]>*+*{margin-top:.5em}.tick [data-layout~=overlay]{position:relative}.tick [data-layout~=overlay]>*{margin:0}.tick [data-layout~=overlay][data-layout~=center]{text-align:center}.tick [data-layout~=overlay][data-layout~=left]{text-align:left}.tick [data-layout~=overlay][data-layout~=right]{text-align:right}.tick [data-layout~=overlay]>[data-overlay=fill],.tick [data-layout~=overlay]>[data-overlay=stretch]{position:absolute;left:0;right:0;top:0;bottom:0}.tick [data-layout~=overlay]>[data-overlay=center]{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;position:absolute;left:0;right:0;top:0;bottom:0}.tick-flip{position:relative;text-align:center}.tick-flip *{border-radius:inherit;white-space:pre;letter-spacing:inherit;text-indent:inherit}.tick-flip-front{border-bottom-left-radius:0;border-bottom-right-radius:0}.tick-flip-back{border-top-left-radius:0;border-top-right-radius:0}.tick-flip-spacer{display:block;visibility:hidden}.tick-flip-shadow{position:absolute;left:1px;right:1px;top:1px;bottom:1px;color:transparent!important;background:transparent!important}.tick-flip-shadow-top{bottom:calc(50% - 1px)}.tick-flip-shadow-bottom{top:calc(50% + 1px)}.tick-flip-card-shadow{position:absolute;left:.15em;right:.15em;bottom:.125em;height:.5em;background-color:transparent;border-radius:0;opacity:0;transform-origin:0 100%;box-shadow:0 .125em .25em rgba(0,0,0,.5),0 .125em .5em rgba(0,0,0,.75);z-index:0}.tick-flip-card{position:absolute;z-index:1;left:0;top:0;width:100%;height:100%;perspective:4em}.tick-flip-panel-back,.tick-flip-panel-front{position:absolute;left:0;width:100%;height:51%;backface-visibility:hidden;transform-style:preserve-3d}.tick-flip-panel-back-text,.tick-flip-panel-front-text{position:absolute;left:-1px;top:0;right:-1px;height:100%;overflow:hidden}.tick-flip-panel-text-wrapper{position:absolute;left:0;top:0;right:0;height:100%}.tick-flip-panel-back-text .tick-flip-panel-text-wrapper{height:200%;top:-100%}.tick-flip-panel-front{transform-origin:center bottom;top:0;z-index:2;box-shadow:inset 0 1px hsla(0,0%,100%,.05)}.tick-flip-panel-back{transform-origin:center top;top:50%;z-index:1;box-shadow:inset 0 -1px rgba(0,0,0,.1)}.tick-flip-panel-back:after{z-index:1;content:"";position:absolute;left:0;top:0;width:100%;height:100%;background-image:linear-gradient(180deg,rgba(0,0,0,.3) 1px,rgba(0,0,0,.15) 0,transparent 30%)}.tick-flip-panel-back-shadow{z-index:2}.tick-flip-panel-back-highlight{z-index:3}.tick-flip-panel-back-highlight,.tick-flip-panel-back-shadow{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}.tick-flip-panel-back-highlight,.tick-flip-panel-back-shadow,.tick-flip-panel-front-shadow{position:absolute;left:0;top:0;right:0;bottom:0;opacity:0}.tick-flip-panel-front-shadow{background-image:linear-gradient(0deg,rgba(0,0,0,.8),rgba(0,0,0,.3))}.tick-flip-panel-back-shadow{background-image:linear-gradient(180deg,rgba(0,0,0,.7),rgba(0,0,0,.5))}.tick-flip-panel-back-highlight{background-image:linear-gradient(180deg,hsla(0,0%,100%,.15),hsla(0,0%,100%,.3))}.tick [data-style*="shadow:inner"],.tick [data-style*="shadow:inner"] .tick-flip-card-shadow,.tick [data-style*="shadow:none"] .tick-flip-card-shadow,.tick [data-style*="shadow:none"] .tick-flip-panel-back,.tick [data-style*="shadow:none"] .tick-flip-panel-front,.tick [data-style*="shadow:none"] .tick-flip-shadow{box-shadow:none}.tick [data-style*="shadow:none"] .tick-flip-back:after,.tick [data-style*="shadow:none"] .tick-flip-panel-back-shadow,.tick [data-style*="shadow:none"] .tick-flip-panel-back-text:after,.tick [data-style*="shadow:none"] .tick-flip-panel-front-shadow{background-image:none}.tick [data-style*="rounded:none"]{border-radius:0}.tick [data-style*="rounded:panels"] .tick-flip-front,.tick [data-style*="rounded:panels"] .tick-flip-shadow-bottom{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}.tick [data-style*="rounded:panels"] .tick-flip-back,.tick [data-style*="rounded:panels"] .tick-flip-panel-back:after,.tick [data-style*="rounded:panels"] .tick-flip-shadow-top{border-top-left-radius:inherit;border-top-right-radius:inherit}.tick-flip{margin-left:.0625em;margin-right:.0625em;min-width:1.125em;border-radius:.125em;letter-spacing:.25em;text-indent:.25em}.tick-flip-panel{color:#edebeb;background-color:#333232}.tick-flip-shadow{box-shadow:0 .125em .3125em rgba(0,0,0,.25),0 .02125em .06125em rgba(0,0,0,.25)}
            
            /* Custom Flip Counter Styling */
            .tick {
              font-size: 1rem;
              white-space: nowrap;
              font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
            }

            .tick-flip, .tick-text-inline {
              font-size: 2.5em;
            }

            .tick-label {
              margin-top: 1em;
              font-size: 1em;
              color: var(--color-textSecondary, #696996);
              text-transform: uppercase;
              letter-spacing: 0.1em;
            }

            .tick-char {
              width: 1.5em;
            }

            .tick-text-inline {
              display: inline-block;
              text-align: center;
              min-width: 1em;
              color: var(--color-text, #15151e);
            }

            .tick-text-inline + .tick-text-inline {
              margin-left: -0.325em;
            }

            .tick-group {
              margin: 0 0.5em;
              text-align: center;
            }

            /* Flip Clock Panel - Classic Segmented Display Style */
            .tick-flip-panel {
              color: #ffffff !important;
              background-color: #2b2b2b !important;
              border-radius: 0.15em !important;
              box-shadow: 
                0 0.05em 0 rgba(0, 0, 0, 0.6),
                0 0.15em 0.15em rgba(0, 0, 0, 0.4) !important;
            }

            /* Add subtle gradient for 3D depth effect */
            .tick-flip-panel::before {
              background: linear-gradient(
                to bottom,
                rgba(255, 255, 255, 0.1) 0%,
                rgba(255, 255, 255, 0) 50%,
                rgba(0, 0, 0, 0.2) 100%
              ) !important;
            }

            /* Flip card container with shadow */
            .tick-flip {
              border-radius: 0.15em !important;
              font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
              font-weight: 600 !important;
              box-shadow: 0 0.2em 0.4em rgba(0, 0, 0, 0.3) !important;
            }

            /* Middle divider line between flip panels for segmented look */
            .tick-flip::after {
              background: #1a1a1a !important;
              height: 0.05em !important;
            }

            /* Text positioning and line height */
            .tick-flip-panel-text-wrapper {
              line-height: 1.5 !important;
            }

            /* Spacing between individual digit cards */
            .tick-flip + .tick-flip {
              margin-left: 0.1em;
            }
            
            /* Navigation Dropdown Styles */
            .nav-menu {
              position: relative;
            }
            
            .nav-item-dropdown {
              position: relative;
            }
            
            .nav-link, .nav-link-dropdown {
              color: var(--color-text, #333);
              font-family: Plus Jakarta Sans;
              text-decoration: none;
              padding: 0.5rem 0.75rem;
              display: inline-flex;
              align-items: center;
              position: relative;
              border-radius: 4px;
              transition: background-color 0.2s, color 0.2s, border-color 0.2s;
              cursor: pointer;
              font-weight: 500;
            }
            
            /* Navigation underline element for underline style */
            .nav-link .nav-underline, .nav-link-dropdown .nav-underline {
              position: absolute;
              bottom: 0;
              left: 50%;
              transform: translateX(-50%);
              height: 2px;
              width: 0%;
              background-color: var(--color-text, #333);
              transition: width 0.2s ease;
            }
            
            /* Default style hover */
            
            .nav-link:hover, .nav-link-dropdown:hover {
              background-color: rgba(0,0,0,0.05);
              
            }
            
            
            /* Underline style hover */
            
            
            /* Pill style hover */
            
            
            /* Bar style hover */
            
            
            .dropdown-arrow {
              font-size: 0.7em;
              margin-left: 0.3rem;
              transition: transform 0.2s;
            }
            
            .nav-item-dropdown.active .dropdown-arrow {
              transform: rotate(180deg);
            }
            
            .nav-dropdown {
              display: none;
              position: absolute;
              top: 100%;
              left: 0;
              min-width: 200px;
              background: #ffffff;
              border: 1px solid var(--color-border, #e5e7eb);
              border-radius: 4px;
              box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
              padding: 0.5rem 0;
              margin-top: 0.25rem;
              list-style: none;
              z-index: 1000;
            }
            
            /* Dropdown visibility controlled by JavaScript with delay support */
            .nav-item-dropdown.active .nav-dropdown {
              display: block;
            }
            
            .nav-dropdown li {
              margin: 0;
            }
            
            .site-header .nav-dropdown a,
            .site-header .nav-dropdown a:link,
            .site-header .nav-dropdown a:visited,
            .site-header .nav-dropdown a:active {
              color: #333333;
              font-family: Plus Jakarta Sans;
              text-decoration: none;
              padding: 0.5rem 1rem;
              display: block;
              transition: background-color 0.2s, color 0.2s;
              font-weight: 400;
            }
            
            .site-header .nav-dropdown a:hover {
              background-color: rgba(0,0,0,0.05);
              color: #111111;
            }
            
            /* Nested dropdown (fly-out) styles */
            .nav-item-nested {
              position: relative;
            }
            
            .nav-item-nested .dropdown-arrow {
              transform: rotate(0deg);
            }
            
            /* Nested dropdowns fly out to the right - HIDDEN by default */
            .nav-item-nested > .nav-dropdown {
              display: none !important;
              top: 0;
              left: 100%;
              margin-top: 0;
              margin-left: 0;
            }
            
            /* Show nested dropdown ONLY on direct hover (CSS-based, no JS active class) */
            .nav-item-nested:hover > .nav-dropdown {
              display: block !important;
            }
            
            /* Note: Click mode and hover delays are now fully handled by JavaScript */
            
            /* Mobile Navigation Styles */
            .mobile-menu-toggle {
              display: none;
              background: none;
              border: none;
              cursor: pointer;
              padding: 0.5rem;
              color: var(--color-text, #333);
              font-size: 1.5rem;
              line-height: 1;
            }
            
            .mobile-nav {
              display: none;
            }
            
            @media (max-width: 768px) {
              .mobile-menu-toggle {
                display: block;
                margin-left: auto;
              }
              
              .desktop-nav {
                display: none !important;
              }
              
              .mobile-nav {
                display: none;
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: var(--color-surface, #ffffff);
                color: var(--color-text, #333);
                z-index: 9999;
                overflow-y: auto;
              }
              
              .mobile-nav.active {
                display: block;
              }
              
              .mobile-nav-header {
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding: 1rem;
                border-bottom: 1px solid var(--color-border, #ddd);
              }
              
              .mobile-nav-close {
                background: none;
                border: none;
                cursor: pointer;
                padding: 0.5rem;
                color: var(--color-text, #333);
                font-size: 1.5rem;
                line-height: 1;
              }
              
              .mobile-nav ul {
                list-style: none;
                margin: 0;
                padding: 0;
              }
              
              .mobile-nav ul li {
                border-bottom: 1px solid var(--color-border, #ddd);
              }
              
              .mobile-nav ul li a {
                display: block;
                padding: 1rem;
                color: var(--color-text, #333);
                text-decoration: none;
                font-size: 1.1rem;
              }
              
              .mobile-nav ul li a:active {
                background: rgba(0,0,0,0.05);
                
              }
              
              /* Nested sublists — real hierarchy: indented, slightly smaller,
                 with a left guide border so parent/child structure is visible */
              .mobile-nav ul ul.mobile-nav-sub {
                margin: 0 0 0 1rem;
                padding: 0;
                border-left: 2px solid var(--color-border, #ddd);
              }
              
              .mobile-nav ul ul.mobile-nav-sub li {
                border-bottom: none;
              }
              
              .mobile-nav ul ul.mobile-nav-sub li a {
                padding: 0.65rem 1rem;
                font-size: 1rem;
              }
            }
            
            /* ----------------------------------------------
               Custom Quill Blot Styles for Rich Text Content
               ---------------------------------------------- */
            
            /* Floatable Image Styles */
            .ql-floatable-image {
              display: inline-block;
              max-width: 100%;
              margin: 12px 0;
              vertical-align: top;
            }
            
            .ql-floatable-image img {
              display: block;
              max-width: 100%;
              height: auto;
              border-radius: 8px;
            }
            
            .ql-floatable-image.float-left {
              float: left;
              margin: 0 20px 12px 0;
              max-width: 50%;
              clear: none;
            }
            
            .ql-floatable-image.float-right {
              float: right;
              margin: 0 0 12px 20px;
              max-width: 50%;
              clear: none;
            }
            
            .ql-floatable-image.float-none {
              float: none;
              display: block;
              margin: 12px auto;
              max-width: 100%;
            }
            
            .ql-floatable-image.width-small { max-width: 25% !important; }
            .ql-floatable-image.width-medium { max-width: 50% !important; }
            .ql-floatable-image.width-large { max-width: 75% !important; }
            .ql-floatable-image.width-full { max-width: 100% !important; }
            
            /* Video Embed Styles */
            .ql-video-embed {
              display: block;
              margin: 16px 0;
              max-width: 100%;
              clear: both;
            }
            
            .ql-video-embed .video-embed-wrapper {
              position: relative;
              padding-bottom: 56.25%;
              height: 0;
              overflow: hidden;
              border-radius: 8px;
            }
            
            .ql-video-embed .video-embed-wrapper iframe,
            .ql-video-embed .video-embed-wrapper video {
              position: absolute;
              top: 0;
              left: 0;
              width: 100%;
              height: 100%;
            }
            
            .ql-video-embed.float-left {
              float: left;
              margin: 0 20px 12px 0;
              clear: none;
            }
            
            .ql-video-embed.float-right {
              float: right;
              margin: 0 0 12px 20px;
              clear: none;
            }
            
            .ql-video-embed.float-none {
              float: none;
              margin: 16px auto;
            }
            
            .ql-video-embed.width-small { width: 200px !important; min-width: 200px !important; }
            .ql-video-embed.width-medium { width: 320px !important; min-width: 320px !important; }
            .ql-video-embed.width-large { width: 480px !important; min-width: 480px !important; }
            .ql-video-embed.width-full { width: 100% !important; max-width: 100% !important; float: none !important; margin: 16px auto !important; }
            
            /* File Card Styles */
            .ql-file-card {
              display: inline-flex;
              align-items: center;
              gap: 12px;
              padding: 12px 16px;
              background: var(--color-surface, #f8fafc);
              border: 1px solid var(--color-border, #e2e8f0);
              border-radius: 8px;
              text-decoration: none;
              color: var(--color-text, inherit);
              margin: 8px 0;
              max-width: 320px;
              transition: all 0.2s ease;
              box-sizing: border-box;
            }
            
            .ql-file-card:hover {
              background: var(--color-surface, #f1f5f9);
              border-color: var(--color-text, #cbd5e1);
              opacity: 0.9;
            }
            
            .ql-file-card .file-icon {
              width: 40px;
              height: 40px;
              border-radius: 8px;
              display: flex;
              align-items: center;
              justify-content: center;
              font-size: 20px;
              flex-shrink: 0;
            }
            
            .ql-file-card .file-icon.pdf { background: #fef2f2; color: #dc2626; }
            .ql-file-card .file-icon.doc { background: #eff6ff; color: #2563eb; }
            .ql-file-card .file-icon.spreadsheet { background: #f0fdf4; color: #16a34a; }
            .ql-file-card .file-icon.default { background: var(--color-surface, #f8fafc); color: var(--color-textSecondary, #64748b); }
            
            .ql-file-card .file-info {
              flex: 1;
              min-width: 0;
              overflow: hidden;
            }
            
            .ql-file-card .file-name {
              font-weight: 600;
              font-size: 14px;
              color: var(--color-text, #1e293b);
              white-space: nowrap;
              overflow: hidden;
              text-overflow: ellipsis;
            }
            
            .ql-file-card .file-size {
              font-size: 12px;
              color: var(--color-textSecondary, #64748b);
              margin-top: 2px;
            }
            
            .ql-file-card.float-left {
              float: left;
              margin: 8px 16px 8px 0;
            }
            
            .ql-file-card.float-right {
              float: right;
              margin: 8px 0 8px 16px;
            }
            
            /* Mobile Responsive Styles for Quill Blots */
            @media (max-width: 768px) {
              /* File cards on mobile - stacked treatment */
              .ql-file-card {
                display: flex !important;
                flex-direction: column !important;
                align-items: center !important;
                max-width: 120px !important;
                width: auto !important;
                box-sizing: border-box !important;
                padding: 12px !important;
                gap: 6px !important;
                text-align: center !important;
              }
              
              .ql-file-card.float-left,
              .ql-file-card.float-right {
                float: none !important;
                margin: 8px 0 !important;
              }
              
              .ql-file-card .file-icon {
                width: 40px !important;
                height: 40px !important;
                font-size: 18px !important;
                border-radius: 8px !important;
              }
              
              .ql-file-card .file-info {
                min-width: 0 !important;
                width: 100% !important;
                overflow: hidden !important;
                text-align: center !important;
              }
              
              .ql-file-card .file-name {
                max-width: 100% !important;
                font-size: 11px !important;
                overflow: hidden !important;
                text-overflow: ellipsis !important;
                white-space: nowrap !important;
                display: block !important;
              }
              
              .ql-file-card .file-size {
                display: none !important;
              }
              
              /* Floatable images on mobile - remove float and constrain */
              .ql-floatable-image {
                max-width: 100% !important;
                box-sizing: border-box;
              }
              
              .ql-floatable-image.float-left,
              .ql-floatable-image.float-right {
                float: none !important;
                margin: 12px 0 !important;
                max-width: 100% !important;
              }
              
              .ql-floatable-image img {
                max-width: 100% !important;
                height: auto !important;
              }
              
              /* Video embeds on mobile */
              .ql-video-embed.float-left,
              .ql-video-embed.float-right {
                float: none !important;
                margin: 16px 0 !important;
                width: 100% !important;
              }
              
              /* Text content word wrapping */
              .rich-text-content,
              .puck-text {
                max-width: 100% !important;
                overflow-wrap: break-word !important;
                word-wrap: break-word !important;
                word-break: break-word !important;
              }
            }
            
            /* Pull Quote Styles */
            .ql-pull-quote {
              display: block;
              margin: 24px 0;
              padding: 0;
              position: relative;
            }
            
            .ql-pull-quote .pull-quote-wrapper {
              padding: 20px 24px;
              background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
              border-left: 4px solid #3b82f6;
              border-radius: 0 8px 8px 0;
              position: relative;
            }
            
            .ql-pull-quote .pull-quote-mark {
              font-size: 48px;
              line-height: 1;
              color: #3b82f6;
              opacity: 0.3;
              font-family: Georgia, serif;
              position: absolute;
            }
            
            .ql-pull-quote .pull-quote-mark.open {
              top: 8px;
              left: 12px;
            }
            
            .ql-pull-quote .pull-quote-mark.close {
              bottom: 0;
              right: 16px;
            }
            
            .ql-pull-quote .pull-quote-text {
              font-size: 1.25rem;
              font-style: italic;
              font-weight: 500;
              line-height: 1.6;
              color: #334155;
              text-align: center;
              margin: 0;
              padding: 8px 32px;
            }
            
            .ql-pull-quote.float-left {
              float: left;
              margin: 8px 24px 16px 0;
              clear: none;
            }
            
            .ql-pull-quote.float-right {
              float: right;
              margin: 8px 0 16px 24px;
              clear: none;
            }
            
            .ql-pull-quote.float-none {
              float: none;
              margin: 24px auto;
            }
            
            .ql-pull-quote.width-small { width: 200px !important; min-width: 200px !important; }
            .ql-pull-quote.width-medium { width: 280px !important; min-width: 280px !important; }
            .ql-pull-quote.width-large { width: 360px !important; min-width: 360px !important; }
            .ql-pull-quote.width-full { width: 100% !important; max-width: 100% !important; float: none !important; margin: 24px auto !important; }
            
            /* Clear floats after rich text content */
            .text-content::after,
            .rich-text-content::after {
              content: "";
              display: table;
              clear: both;
            }

            /* Render class contract (Task #156): default component structure on
               documented stable classes. Emitted here — after all base styles,
               immediately before the site's custom CSS — so custom CSS overrides
               it at equal specificity. Reproduces the renderer's previous inline
               defaults so sites without custom CSS are unchanged. */
            /* Render class contract v1.11.0 — site chrome structural-only (designer-owned appearance). */
.site-header .header-logo {
  flex-shrink: 0;
}
.site-header .header-logo-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.site-header .header-logo-img {
  width: 100%;
  height: auto;
  object-fit: contain;
}
.site-header .header-nav {
  flex: 1;
}
.site-header .nav-menu {
  list-style: none;
  display: flex;
  width: 100%;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.site-header .header-cta {
  flex-shrink: 0;
}
.site-header .header-cta-button {
  display: inline-block;
}
.site-header .header-social {
  display: flex;
  gap: 0.75rem;
  align-items: center;
}
.site-header .header-social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
}
.site-header .header-contact {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.site-header .header-grid {
  max-width: var(--header-max-width, var(--content-max-width, 1200px));
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.site-header .header-grid-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 40px;
}
.site-header .header-grid-zone {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.site-header .header-grid-zone--center {
  flex: 1;
}
.site-header .header-flex {
  max-width: var(--header-max-width, var(--content-max-width, 1200px));
  display: flex;
  align-items: center;
  gap: 2rem;
  flex-wrap: wrap;
}
.site-footer .site-footer-content {
  max-width: var(--footer-max-width, var(--content-max-width, 1200px));
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 2rem;
}
.site-footer .site-footer-logo {
  width: 100%;
  max-width: 150px;
  height: auto;
}
.site-footer .site-footer-links {
  list-style: none;
}
.site-footer .site-footer-social {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}
.site-footer .site-footer-empty {
  text-align: center;
}
.site-footer .footer-bottom-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
.site-footer .footer-bottom-bar-link {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
}
            /* Render class contract v1.11.0 — structural-only (designer-owned appearance). */
.puck-card {
  display: block;
  overflow: hidden;
}
.puck-grid-heading {
  text-align: center;
}
.puck-grid-subheading {
  text-align: center;
}
.puck-columns {
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
}
.puck-columns-col {
  min-width: 200px;
}
.puck-column {
  min-width: 150px;
  min-height: 100px;
  display: flex;
  flex-direction: column;
}
.puck-button-container {
  display: flex;
  align-self: flex-start;
  width: 100%;
}
.puck-button {
  display: inline-block;
}
.puck-stats-title {
  text-align: center;
}
.puck-stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 32px;
}
.puck-stat-card {
  text-align: center;
}
.puck-hero--standard {
  display: flex;
  align-items: center;
  justify-content: center;
}
.puck-hero--carousel {
  position: relative;
  overflow: hidden;
}
.puck-hero--video {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
}
.puck-hero--split {
  display: flex;
  flex-wrap: wrap;
}
.puck-hero--minimal {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.puck-hero--offset {
  position: relative;
  display: flex;
}
.puck-hero-content {
  max-width: 800px;
}
.puck-hero--video .puck-hero-content {
  position: relative;
  z-index: 2;
}
.puck-hero--split .puck-hero-content {
  max-width: 500px;
}
.puck-hero--minimal .puck-hero-content {
  max-width: 600px;
}
.puck-hero--offset .puck-hero-content {
  max-width: 500px;
}
.puck-hero-eyebrow {
  display: inline-block;
}
.puck-hero--minimal .puck-hero-subtitle {
  max-width: 500px;
}
.puck-hero-cta-primary {
  display: inline-block;
}
.puck-hero-cta-secondary {
  display: inline-block;
}
.puck-hero--carousel .carousel-slide {
  align-items: center;
  justify-content: center;
}
.puck-hero--carousel .carousel-slides {
  position: relative;
}
.puck-hero--carousel .carousel-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
}
.puck-hero--carousel .carousel-prev {
  left: 1rem;
}
.puck-hero--carousel .carousel-next {
  right: 1rem;
}
.puck-hero--carousel .carousel-dots {
  position: absolute;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 0.5rem;
  z-index: 10;
}
.puck-hero--carousel .carousel-dot {
  width: 12px;
  height: 12px;
}
.puck-hero-video-el {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.puck-hero-video-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
}
.puck-hero-split-panel {
  flex: 1;
  min-width: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.puck-hero-split-image {
  flex: 1;
  min-width: 300px;
}
.puck-grid-preset {
  display: grid;
}
.puck-flex {
  display: flex;
  flex-direction: var(--puck-flex-direction, row);
  flex-wrap: var(--puck-flex-wrap, wrap);
  row-gap: var(--puck-flex-row-gap, 16px);
  column-gap: var(--puck-flex-column-gap, 16px);
  align-items: var(--puck-flex-align-items, stretch);
  justify-content: var(--puck-flex-justify-content, flex-start);
  min-height: 100px;
}
.puck-flex-item {
  flex-grow: var(--puck-flex-item-grow, 0);
  flex-basis: var(--puck-flex-item-basis, auto);
  flex-shrink: var(--puck-flex-item-shrink, var(--puck-flex-item-flex-shrink, 0));
  align-self: var(--puck-flex-item-align-self, auto);
  min-width: var(--puck-flex-item-min-width, auto);
  max-width: var(--puck-flex-item-max-width, none);
}
.puck-flex > .puck-flex-item[data-puck-flex-item-padding] > * {
  padding-top: var(--puck-flex-item-padding-top) !important;
  padding-right: var(--puck-flex-item-padding-right) !important;
  padding-bottom: var(--puck-flex-item-padding-bottom) !important;
  padding-left: var(--puck-flex-item-padding-left) !important;
}
.puck-video {
  display: flex;
}
.puck-video-inner {
  max-width: 100%;
}
.puck-video-media {
  width: 100%;
  display: block;
}
.puck-cta {
  text-align: center;
}
.puck-cta-description {
  max-width: 600px;
  white-space: pre-wrap;
}
.puck-cta-buttons {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}
.puck-cta-primary {
  display: inline-block;
}
.puck-cta-secondary {
  display: inline-block;
}
.puck-image {
  display: flex;
  max-width: 100%;
}
.puck-image-img {
  display: block;
  max-width: 100%;
}
.puck-image-caption {
  text-align: center;
}
.puck-image-viewer-trigger {
  display: block;
}
.puck-image-viewer-overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}
.puck-image-viewer-img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.puck-image-viewer-close {
  position: absolute;
  top: 16px;
  right: 16px;
}
.puck-image-viewer-previous, .puck-image-viewer-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.puck-image-viewer-previous {
  left: 16px;
}
.puck-image-viewer-next {
  right: 16px;
}
.puck-card-icon-horizontal .puck-card-title {
  text-align: left;
}
.puck-card-description {
  white-space: pre-wrap;
}
.puck-card-featured-overlay {
  position: absolute;
  inset: 0;
}
.puck-card-featured-content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
.puck-card-meta {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
  text-align: left;
}
.puck-card-meta-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.puck-card-meta-label {
  flex-shrink: 0;
}
.puck-card-avatar {
  width: 120px;
  height: 120px;
  overflow: hidden;
  flex-shrink: 0;
}
.puck-card-avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media (max-width: 1024px) { .puck-flex { flex-direction: var(--puck-flex-tablet-direction, var(--puck-flex-direction, row));flex-wrap: var(--puck-flex-tablet-wrap, var(--puck-flex-wrap, wrap));row-gap: var(--puck-flex-tablet-row-gap, var(--puck-flex-row-gap, 16px));column-gap: var(--puck-flex-tablet-column-gap, var(--puck-flex-column-gap, 16px));align-items: var(--puck-flex-tablet-align-items, var(--puck-flex-align-items, stretch));justify-content: var(--puck-flex-tablet-justify-content, var(--puck-flex-justify-content, flex-start)); } }
@media (max-width: 767px) { .puck-flex { flex-direction: var(--puck-flex-mobile-direction, var(--puck-flex-tablet-direction, var(--puck-flex-direction, row)));flex-wrap: var(--puck-flex-mobile-wrap, var(--puck-flex-tablet-wrap, var(--puck-flex-wrap, wrap)));row-gap: var(--puck-flex-mobile-row-gap, var(--puck-flex-tablet-row-gap, var(--puck-flex-row-gap, 16px)));column-gap: var(--puck-flex-mobile-column-gap, var(--puck-flex-tablet-column-gap, var(--puck-flex-column-gap, 16px)));align-items: var(--puck-flex-mobile-align-items, var(--puck-flex-tablet-align-items, var(--puck-flex-align-items, stretch)));justify-content: var(--puck-flex-mobile-justify-content, var(--puck-flex-tablet-justify-content, var(--puck-flex-justify-content, flex-start))); } }
@container puck-canvas (max-width: 1024px) { .puck-flex { flex-direction: var(--puck-flex-tablet-direction, var(--puck-flex-direction, row));flex-wrap: var(--puck-flex-tablet-wrap, var(--puck-flex-wrap, wrap));row-gap: var(--puck-flex-tablet-row-gap, var(--puck-flex-row-gap, 16px));column-gap: var(--puck-flex-tablet-column-gap, var(--puck-flex-column-gap, 16px));align-items: var(--puck-flex-tablet-align-items, var(--puck-flex-align-items, stretch));justify-content: var(--puck-flex-tablet-justify-content, var(--puck-flex-justify-content, flex-start)); } }
@container puck-canvas (max-width: 767px) { .puck-flex { flex-direction: var(--puck-flex-mobile-direction, var(--puck-flex-tablet-direction, var(--puck-flex-direction, row)));flex-wrap: var(--puck-flex-mobile-wrap, var(--puck-flex-tablet-wrap, var(--puck-flex-wrap, wrap)));row-gap: var(--puck-flex-mobile-row-gap, var(--puck-flex-tablet-row-gap, var(--puck-flex-row-gap, 16px)));column-gap: var(--puck-flex-mobile-column-gap, var(--puck-flex-tablet-column-gap, var(--puck-flex-column-gap, 16px)));align-items: var(--puck-flex-mobile-align-items, var(--puck-flex-tablet-align-items, var(--puck-flex-align-items, stretch)));justify-content: var(--puck-flex-mobile-justify-content, var(--puck-flex-tablet-justify-content, var(--puck-flex-justify-content, flex-start))); } }
@media (max-width: 1024px) { .puck-flex > .puck-flex-item { flex-grow: var(--puck-flex-item-tablet-grow, var(--puck-flex-item-grow, 0));flex-basis: var(--puck-flex-item-tablet-basis, var(--puck-flex-item-basis, auto));flex-shrink: var(--puck-flex-item-tablet-shrink, var(--puck-flex-item-shrink, var(--puck-flex-item-flex-shrink, 0)));align-self: var(--puck-flex-item-tablet-align-self, var(--puck-flex-item-align-self, auto));min-width: var(--puck-flex-item-tablet-min-width, var(--puck-flex-item-min-width, auto));max-width: var(--puck-flex-item-tablet-max-width, var(--puck-flex-item-max-width, none)); } .puck-flex > .puck-flex-item[data-puck-flex-item-tablet-margin] { margin-top: var(--puck-flex-item-tablet-margin-top, var(--puck-flex-item-margin-top, var(--puck-flex-item-margin, 0)));margin-right: var(--puck-flex-item-tablet-margin-right, var(--puck-flex-item-margin-right, var(--puck-flex-item-margin, 0)));margin-bottom: var(--puck-flex-item-tablet-margin-bottom, var(--puck-flex-item-margin-bottom, var(--puck-flex-item-margin, 0)));margin-left: var(--puck-flex-item-tablet-margin-left, var(--puck-flex-item-margin-left, var(--puck-flex-item-margin, 0))); } .puck-flex > .puck-flex-item[data-puck-flex-item-tablet-padding] > * { padding-top: var(--puck-flex-item-tablet-padding-top, var(--puck-flex-item-padding-top, revert)) !important;padding-right: var(--puck-flex-item-tablet-padding-right, var(--puck-flex-item-padding-right, revert)) !important;padding-bottom: var(--puck-flex-item-tablet-padding-bottom, var(--puck-flex-item-padding-bottom, revert)) !important;padding-left: var(--puck-flex-item-tablet-padding-left, var(--puck-flex-item-padding-left, revert)) !important; } }
@media (max-width: 767px) { .puck-flex > .puck-flex-item { flex-grow: var(--puck-flex-item-mobile-grow, var(--puck-flex-item-tablet-grow, var(--puck-flex-item-grow, 0)));flex-basis: var(--puck-flex-item-mobile-basis, var(--puck-flex-item-tablet-basis, var(--puck-flex-item-basis, auto)));flex-shrink: var(--puck-flex-item-mobile-shrink, var(--puck-flex-item-tablet-shrink, var(--puck-flex-item-shrink, var(--puck-flex-item-flex-shrink, 0))));align-self: var(--puck-flex-item-mobile-align-self, var(--puck-flex-item-tablet-align-self, var(--puck-flex-item-align-self, auto)));min-width: var(--puck-flex-item-mobile-min-width, var(--puck-flex-item-tablet-min-width, var(--puck-flex-item-min-width, auto)));max-width: var(--puck-flex-item-mobile-max-width, var(--puck-flex-item-tablet-max-width, var(--puck-flex-item-max-width, none))); } .puck-flex > .puck-flex-item[data-puck-flex-item-mobile-margin] { margin-top: var(--puck-flex-item-mobile-margin-top, var(--puck-flex-item-tablet-margin-top, var(--puck-flex-item-margin-top, var(--puck-flex-item-margin, 0))));margin-right: var(--puck-flex-item-mobile-margin-right, var(--puck-flex-item-tablet-margin-right, var(--puck-flex-item-margin-right, var(--puck-flex-item-margin, 0))));margin-bottom: var(--puck-flex-item-mobile-margin-bottom, var(--puck-flex-item-tablet-margin-bottom, var(--puck-flex-item-margin-bottom, var(--puck-flex-item-margin, 0))));margin-left: var(--puck-flex-item-mobile-margin-left, var(--puck-flex-item-tablet-margin-left, var(--puck-flex-item-margin-left, var(--puck-flex-item-margin, 0)))); } .puck-flex > .puck-flex-item[data-puck-flex-item-mobile-padding] > * { padding-top: var(--puck-flex-item-mobile-padding-top, var(--puck-flex-item-tablet-padding-top, var(--puck-flex-item-padding-top, revert))) !important;padding-right: var(--puck-flex-item-mobile-padding-right, var(--puck-flex-item-tablet-padding-right, var(--puck-flex-item-padding-right, revert))) !important;padding-bottom: var(--puck-flex-item-mobile-padding-bottom, var(--puck-flex-item-tablet-padding-bottom, var(--puck-flex-item-padding-bottom, revert))) !important;padding-left: var(--puck-flex-item-mobile-padding-left, var(--puck-flex-item-tablet-padding-left, var(--puck-flex-item-padding-left, revert))) !important; } }
@container puck-canvas (max-width: 1024px) { .puck-flex > .puck-flex-item { flex-grow: var(--puck-flex-item-tablet-grow, var(--puck-flex-item-grow, 0));flex-basis: var(--puck-flex-item-tablet-basis, var(--puck-flex-item-basis, auto));flex-shrink: var(--puck-flex-item-tablet-shrink, var(--puck-flex-item-shrink, var(--puck-flex-item-flex-shrink, 0)));align-self: var(--puck-flex-item-tablet-align-self, var(--puck-flex-item-align-self, auto));min-width: var(--puck-flex-item-tablet-min-width, var(--puck-flex-item-min-width, auto));max-width: var(--puck-flex-item-tablet-max-width, var(--puck-flex-item-max-width, none)); } .puck-flex > .puck-flex-item[data-puck-flex-item-tablet-margin] { margin-top: var(--puck-flex-item-tablet-margin-top, var(--puck-flex-item-margin-top, var(--puck-flex-item-margin, 0)));margin-right: var(--puck-flex-item-tablet-margin-right, var(--puck-flex-item-margin-right, var(--puck-flex-item-margin, 0)));margin-bottom: var(--puck-flex-item-tablet-margin-bottom, var(--puck-flex-item-margin-bottom, var(--puck-flex-item-margin, 0)));margin-left: var(--puck-flex-item-tablet-margin-left, var(--puck-flex-item-margin-left, var(--puck-flex-item-margin, 0))); } .puck-flex > .puck-flex-item[data-puck-flex-item-tablet-padding] > * { padding-top: var(--puck-flex-item-tablet-padding-top, var(--puck-flex-item-padding-top, revert)) !important;padding-right: var(--puck-flex-item-tablet-padding-right, var(--puck-flex-item-padding-right, revert)) !important;padding-bottom: var(--puck-flex-item-tablet-padding-bottom, var(--puck-flex-item-padding-bottom, revert)) !important;padding-left: var(--puck-flex-item-tablet-padding-left, var(--puck-flex-item-padding-left, revert)) !important; } }
@container puck-canvas (max-width: 767px) { .puck-flex > .puck-flex-item { flex-grow: var(--puck-flex-item-mobile-grow, var(--puck-flex-item-tablet-grow, var(--puck-flex-item-grow, 0)));flex-basis: var(--puck-flex-item-mobile-basis, var(--puck-flex-item-tablet-basis, var(--puck-flex-item-basis, auto)));flex-shrink: var(--puck-flex-item-mobile-shrink, var(--puck-flex-item-tablet-shrink, var(--puck-flex-item-shrink, var(--puck-flex-item-flex-shrink, 0))));align-self: var(--puck-flex-item-mobile-align-self, var(--puck-flex-item-tablet-align-self, var(--puck-flex-item-align-self, auto)));min-width: var(--puck-flex-item-mobile-min-width, var(--puck-flex-item-tablet-min-width, var(--puck-flex-item-min-width, auto)));max-width: var(--puck-flex-item-mobile-max-width, var(--puck-flex-item-tablet-max-width, var(--puck-flex-item-max-width, none))); } .puck-flex > .puck-flex-item[data-puck-flex-item-mobile-margin] { margin-top: var(--puck-flex-item-mobile-margin-top, var(--puck-flex-item-tablet-margin-top, var(--puck-flex-item-margin-top, var(--puck-flex-item-margin, 0))));margin-right: var(--puck-flex-item-mobile-margin-right, var(--puck-flex-item-tablet-margin-right, var(--puck-flex-item-margin-right, var(--puck-flex-item-margin, 0))));margin-bottom: var(--puck-flex-item-mobile-margin-bottom, var(--puck-flex-item-tablet-margin-bottom, var(--puck-flex-item-margin-bottom, var(--puck-flex-item-margin, 0))));margin-left: var(--puck-flex-item-mobile-margin-left, var(--puck-flex-item-tablet-margin-left, var(--puck-flex-item-margin-left, var(--puck-flex-item-margin, 0)))); } .puck-flex > .puck-flex-item[data-puck-flex-item-mobile-padding] > * { padding-top: var(--puck-flex-item-mobile-padding-top, var(--puck-flex-item-tablet-padding-top, var(--puck-flex-item-padding-top, revert))) !important;padding-right: var(--puck-flex-item-mobile-padding-right, var(--puck-flex-item-tablet-padding-right, var(--puck-flex-item-padding-right, revert))) !important;padding-bottom: var(--puck-flex-item-mobile-padding-bottom, var(--puck-flex-item-tablet-padding-bottom, var(--puck-flex-item-padding-bottom, revert))) !important;padding-left: var(--puck-flex-item-mobile-padding-left, var(--puck-flex-item-tablet-padding-left, var(--puck-flex-item-padding-left, revert))) !important; } }

            /* Member Directory runtime widget appearance. Emitted in FULL for
               all site modes (no structuralOnly variant): the directory is
               built at runtime by an inline script, so on designer-owned
               sites the client inline-style stripper removes its decoration
               and this stylesheet becomes the sole source of its appearance.
               Sits before custom CSS so designer CSS can still override. */
            /* Render class contract v1.11.0 — Member Directory runtime widget (theme-token appearance; overridable by custom CSS below). */
.recur-member-dir-title {
  font-size: 1.875rem;
  font-weight: bold;
  margin: 0 0 16px;
  color: var(--color-text, #333);
  font-family: var(--font-primary, inherit);
}
.recur-member-dir-search {
  padding: 10px 14px;
  border-radius: 8px;
  border: 1px solid var(--color-border, #e5e5e5);
  background: var(--color-surface, #fff);
  color: var(--color-text, #333);
  font-size: 0.9375rem;
  margin-bottom: 16px;
  font-family: var(--font-primary, inherit);
}
.recur-member-dir-chip {
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 0.8125rem;
  font-weight: 500;
  cursor: pointer;
  border: 1px solid var(--color-border, #e5e5e5);
  background: var(--color-surface, #f5f5f5);
  color: var(--color-text, #333);
  font-family: var(--font-primary, inherit);
}
.recur-member-dir-chip-active {
  background: var(--color-primary, #1976d2);
  color: var(--color-background, #fff);
}
.recur-member-dir-clear {
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 0.75rem;
  background: transparent;
  color: var(--color-textSecondary, #666);
  border: none;
  cursor: pointer;
  font-family: var(--font-primary, inherit);
}
.recur-member-dir-card {
  background: var(--color-surface, #fff);
  border-radius: 12px;
  border: 1px solid var(--color-border, #e5e5e5);
  padding: 20px;
  cursor: pointer;
  font-family: var(--font-primary, inherit);
}
.recur-member-dir-row {
  background: var(--color-surface, #fff);
  border-radius: 10px;
  border: 1px solid var(--color-border, #e5e5e5);
  padding: 12px 16px;
  cursor: pointer;
  font-family: var(--font-primary, inherit);
}
.recur-member-dir-avatar {
  border-radius: 50%;
  background: var(--color-primary, #1976d2);
  color: var(--color-background, #fff);
  font-weight: 600;
  font-family: var(--font-primary, inherit);
}
.recur-member-dir-name {
  font-weight: 600;
  color: var(--color-text, #333);
  line-height: 1.3;
}
.recur-member-dir-meta {
  font-size: 0.8125rem;
  color: var(--color-textSecondary, #666);
}
.recur-member-dir-tag {
  padding: 3px 8px;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 500;
  background: var(--color-surface, #f5f5f5);
  color: var(--color-text, #333);
  border: 1px solid var(--color-border, #e5e5e5);
  font-family: var(--font-primary, inherit);
}
.recur-member-dir-empty {
  padding: 40px;
  color: var(--color-textSecondary, #666);
  font-family: var(--font-primary, inherit);
}
.recur-member-dir-page-btn {
  padding: 8px 14px;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  background: var(--color-text, #333);
  color: var(--color-surface, #fff);
  font-size: 0.875rem;
  font-weight: 500;
  font-family: var(--font-primary, inherit);
}
.recur-member-dir-page-btn[disabled] {
  cursor: not-allowed;
  background: var(--color-border, #e5e5e5);
  color: var(--color-textSecondary, #999);
}
.recur-member-dir-page-label {
  font-size: 0.875rem;
  color: var(--color-text, #333);
}
.recur-member-dir-modal-backdrop {
  background: rgba(0, 0, 0, 0.55);
  padding: 20px;
  font-family: var(--font-primary, inherit);
}
.recur-member-dir-modal {
  background: var(--color-surface, #fff);
  color: var(--color-text, #333);
  border-radius: 12px;
  border: 1px solid var(--color-border, #e5e5e5);
}
.recur-member-dir-modal-close {
  background: transparent;
  border: none;
  cursor: pointer;
  font-size: 1.5rem;
  line-height: 1;
  color: var(--color-textSecondary, #666);
  border-radius: 6px;
}
.recur-member-dir-modal-title {
  font-size: 1.375rem;
  font-weight: 700;
  margin: 0;
}
.recur-member-dir-link {
  color: var(--color-primary, #1976d2);
}
.recur-member-dir-meta-sm {
  font-size: 0.75rem;
}
.recur-member-dir-card .recur-member-dir-name {
  font-size: 1rem;
}
.recur-member-dir-row .recur-member-dir-name {
  font-size: 0.9375rem;
}
.recur-member-dir-card .recur-member-dir-avatar {
  font-size: 27px;
}
.recur-member-dir-row .recur-member-dir-avatar {
  font-size: 17px;
}
.recur-member-dir-modal .recur-member-dir-avatar {
  font-size: 24px;
}
.recur-member-dir-chip[data-md-view] {
  border-radius: 6px;
}
.recur-member-dir-modal-body {
  padding: 28px 32px;
}
.recur-member-dir-modal-header {
  margin-bottom: 16px;
}
.recur-member-dir-modal-meta {
  font-size: 0.875rem;
  color: var(--color-textSecondary, #666);
}
.recur-member-dir-modal-location {
  font-size: 0.875rem;
  color: var(--color-textSecondary, #666);
  margin-bottom: 10px;
}
.recur-member-dir-modal-tags {
  margin-bottom: 14px;
}
.recur-member-dir-modal-bio {
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0 0 16px;
}
.recur-member-dir-modal-contact {
  font-size: 0.875rem;
}
.recur-member-dir-modal-phone {
  color: var(--color-textSecondary, #666);
}

            /* Newsletter signup runtime widget (footer section + modal).
               Same always-emitted-in-full rule as the member directory: the
               modal is built at runtime by an inline script, so this
               stylesheet is the sole source of its appearance on
               designer-owned sites. Sits before custom CSS so designer CSS
               can still override. */
            /* Render class contract v1.11.0 — Newsletter signup runtime widget (theme-token appearance; overridable by custom CSS below). */
.recur-nl-description {
  margin: 0 0 12px 0;
  font-size: 0.9rem;
  line-height: 1.5;
  opacity: 0.9;
}
.recur-nl-form {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  max-width: 320px;
}
.recur-nl-input {
  flex: 1 1 160px;
  min-width: 0;
  padding: 10px 16px;
  border: 1px solid var(--color-border, #d1d5db);
  border-radius: 9999px;
  font-size: 0.9rem;
  background: #ffffff;
  color: #111827;
}
.recur-nl-button {
  padding: 10px 22px;
  border: none;
  border-radius: 9999px;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  background: var(--color-primary, #2563eb);
  color: var(--color-buttonText, #ffffff);
}
.recur-nl-hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}
.recur-nl-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10050;
  padding: 16px;
}
.recur-nl-modal {
  background: #ffffff;
  color: #111827;
  border-radius: 12px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
  width: 100%;
  max-width: 420px;
  max-height: 90vh;
  overflow-y: auto;
  padding: 24px;
  position: relative;
  text-align: left;
}
.recur-nl-modal-title {
  margin: 0 0 4px 0;
  font-size: 1.25rem;
  font-weight: 700;
  padding-right: 32px;
}
.recur-nl-modal-close {
  position: absolute;
  top: 12px;
  right: 12px;
  background: none;
  border: none;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  color: #6b7280;
  padding: 4px;
}
.recur-nl-field {
  margin: 12px 0;
}
.recur-nl-label {
  display: block;
  font-size: 0.85rem;
  font-weight: 600;
  margin-bottom: 4px;
}
.recur-nl-field input[type="text"], .recur-nl-field input[type="email"] {
  width: 100%;
  box-sizing: border-box;
  padding: 8px 12px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-size: 0.9rem;
  background: #ffffff;
  color: #111827;
}
.recur-nl-checkbox-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 12px 0;
  font-size: 0.85rem;
  line-height: 1.4;
}
.recur-nl-error {
  color: #b91c1c;
  font-size: 0.85rem;
  margin: 8px 0;
}
.recur-nl-success {
  color: #15803d;
  font-size: 0.95rem;
  margin: 8px 0;
  line-height: 1.5;
}
.recur-nl-submit {
  width: 100%;
  padding: 10px 16px;
  border: none;
  border-radius: 9999px;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  background: var(--color-primary, #2563eb);
  color: var(--color-buttonText, #ffffff);
  margin-top: 8px;
}
.recur-nl-submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

            /* Tenant-provided custom CSS (advanced styling mode only). Sanitized
               to neutralize style-tag escape attempts. In native mode the value
               is stored but intentionally not applied.
               NOTE: do not write the literal closing-style token in this comment
               — the HTML parser will close the surrounding <style> block early
               and dump the rest of the comment into the page. */
            /* ==========================================================================
   The Cavalry Group — Recur Sites custom CSS (stylingMode: advanced)
   Every value harvested from the original source (artifacts/web) — see
   artifacts/web/recur/STYLE_INVENTORY.md for file:line provenance.
   Theme deploys with contentWidth:"full"; regular sections re-capped here.
   ========================================================================== */

:root {
  /* @theme, index.css:12-20 */
  --cg-red: #9E0B0F;
  --cg-red-dark: #7a080b;
  --cg-red-hover-header: #7a0909;   /* SiteHeader.tsx:87 */
  --cg-charcoal: #1a1a1a;
  --cg-offwhite: #f8f9fa;
  --cg-white: #ffffff;
  --cg-gray-600: #4b5563;           /* body copy, home.tsx:186 */
  --cg-gray-700: #374151;           /* dropdown items, SiteHeader.tsx:249 */
  --cg-gray-50: #f9fafb;            /* dropdown hover bg */
  --cg-gray-100: #f3f4f6;           /* dropdown border */
  --cg-gray-200: #e5e7eb;           /* light card border, join.tsx:97 */
  --cg-content-cap: 1280px;         /* Tailwind container, home.tsx:179 */
  --cg-section-pad-y: 6rem;         /* py-24, home.tsx:178 */
  --cg-transition: 150ms cubic-bezier(0.4, 0, 0.2, 1); /* Tailwind default */
  --cg-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
  --font-primary: 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-secondary: 'Playfair Display', Georgia, serif;
}

/* ---------- Base (index.css:31-38) ---------- */
body {
  background: var(--cg-offwhite);
  color: var(--cg-charcoal);
  font-family: var(--font-primary);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
::selection { background: var(--cg-red); color: #fff; }
h1, h2, h3, h4, h5, h6 { letter-spacing: -0.025em; color: var(--cg-charcoal); }

/* ---------- Content width: full-bleed theme; re-cap sections.
   Container = 1280px, px 1.5rem → 3rem @768 (home.tsx:179). ---------- */
main { max-width: none; padding: 0; }
main > * {
  max-width: var(--cg-content-cap);
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-width: 768px) {
  main > * { padding-left: 3rem; padding-right: 3rem; }
}
main > .puck-hero,
main > .puck-cta {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}
/* Heroes must be full-bleed even when the renderer nests them in a wrapper
   that the re-cap rule above constrains. */
main .puck-hero { max-width: none; padding-left: 0; padding-right: 0; }
main > :has(> .puck-hero) {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}
/* Carousel prev/next arrows are hidden on the original site. */
.puck-hero .carousel-nav,
.hero-carousel .carousel-prev,
.hero-carousel .carousel-next { display: none !important; }
.puck-hero-content, .puck-cta { padding-left: 1.5rem; padding-right: 1.5rem; }
@media (min-width: 768px) {
  .puck-hero-content, .puck-cta { padding-left: 3rem; padding-right: 3rem; }
}

/* ---------- Typography (harvested) ---------- */
/* Body copy: text-lg gray-600 leading-relaxed (home.tsx:186) */
.puck-text { color: var(--cg-gray-600); font-size: 1.125rem; line-height: 1.625; }
.puck-text a { color: var(--cg-red); font-weight: 600; text-decoration: none; }
.puck-text a:hover { text-decoration: underline; }
.puck-text blockquote {
  border-left: 4px solid var(--cg-red);
  padding: 0.5rem 0 0.5rem 1.5rem;
  font-family: var(--font-secondary);
  font-style: italic;
  color: var(--cg-charcoal);
}
/* Section headings: font-serif bold, 2.25rem → 3rem @768, lh 1.25, mb 2rem (home.tsx:183) */
.puck-heading h2, .puck-heading h3, h2.puck-heading, h3.puck-heading {
  font-family: var(--font-secondary);
  font-weight: 700;
  font-size: 2.25rem;
  line-height: 1.25;
  color: var(--cg-charcoal);
  margin-bottom: 2rem;
}
@media (min-width: 768px) {
  .puck-heading h2, .puck-heading h3, h2.puck-heading, h3.puck-heading { font-size: 3rem; }
}

/* ---------- Section rhythm: py-24 (home.tsx:178,220,277) ---------- */
main > .puck-grid, main > .puck-flex, main > .puck-text, main > .puck-heading {
  padding-top: var(--cg-section-pad-y);
  padding-bottom: var(--cg-section-pad-y);
}
main > * + .puck-text, main > .puck-heading + * { padding-top: 0; }

/* ---------- Heroes ---------- */
.puck-hero { color: #fff; }
/* Hero title: text-5xl → 7xl @768, serif 700, lh 1.1, mb 2rem (home.tsx:89) */
.puck-hero-title {
  font-family: var(--font-secondary);
  font-weight: 700;
  font-size: 3rem;
  line-height: 1.1;
  color: #fff;
  margin-bottom: 2rem;
}
@media (min-width: 768px) { .puck-hero-title { font-size: 4.5rem; } }
/* Hero lead: text-xl→2xl@768, font-light, white/90, red left border (home.tsx:92) */
.puck-hero-subtitle {
  color: rgba(255, 255, 255, 0.9);
  font-size: 1.25rem;
  font-weight: 300;
  line-height: 1.625;
  border-left: 4px solid var(--cg-red);
  padding: 0.5rem 0 0.5rem 1.5rem;
}
@media (min-width: 768px) { .puck-hero-subtitle { font-size: 1.5rem; } }
/* Hero badge: red pill, white text (home.tsx:86) */
.puck-hero-eyebrow {
  display: inline-block;
  background: var(--cg-red);
  color: #fff;
  padding: 0.375rem 1rem;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 1.5rem;
  border-radius: 0;
}

/* ---------- Buttons (home.tsx:97,101; our-mission.tsx:211) ----------
   Primary: bg red, px-8 py-4, rounded(4px), bold, uppercase, tracking-wider */
.puck-button,
.puck-hero-cta-primary,
.puck-cta-primary,
.recur-product-card-button, .recur-event-card-button, .recur-blog-card-button,
.recur-donation-submit {
  background: var(--cg-red);
  color: #fff;
  border: none;
  border-radius: 0.25rem;
  padding: 1rem 2rem;
  font-weight: 700;
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  transition: all var(--cg-transition);
}
.puck-button:hover,
.puck-hero-cta-primary:hover,
.puck-cta-primary:hover,
.recur-product-card-button:hover, .recur-event-card-button:hover,
.recur-blog-card-button:hover, .recur-donation-submit:hover {
  background: var(--cg-red-dark);
}
/* Secondary: bg white/10, border white/20, backdrop-blur (home.tsx:101) */
.puck-hero-cta-secondary,
.puck-cta-secondary {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.2);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  border-radius: 0.25rem;
  padding: 1rem 2rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  transition: all var(--cg-transition);
}
.puck-hero-cta-secondary:hover, .puck-cta-secondary:hover { background: rgba(255, 255, 255, 0.2); }
.carousel-dots button, .carousel-dot { background: rgba(255, 255, 255, 0.5); }
.carousel-dots .active, .carousel-dot.active { background: var(--cg-red); }

/* ---------- CTA band (dark section pattern, home.tsx:220-275) ---------- */
.puck-cta { background: var(--cg-charcoal); color: #fff; }
.puck-cta-title { font-family: var(--font-secondary); font-weight: 700; color: #fff; }
.puck-cta-description { color: rgba(255, 255, 255, 0.6); font-size: 1.125rem; line-height: 1.625; }

/* ---------- Cards (join.tsx:97 light; home.tsx:261 dark) ---------- */
.puck-card {
  background: var(--cg-offwhite);
  border: 1px solid var(--cg-gray-200);
  border-radius: 0.5rem;
  padding: 1rem 1.25rem;
  box-shadow: none;
  transition: background-color var(--cg-transition), border-color var(--cg-transition);
}
.puck-card-title { font-weight: 700; color: var(--cg-charcoal); }
.puck-card-description { color: var(--cg-gray-600); font-size: 0.875rem; line-height: 1.625; }
.puck-card-icon { color: var(--cg-red); }
.puck-cta .puck-card, .cg-dark .puck-card {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 0.25rem;
  padding: 2rem;
}
.puck-cta .puck-card:hover, .cg-dark .puck-card:hover { background: rgba(255, 255, 255, 0.1); }

/* ---------- Stats ---------- */
.puck-stat-value { color: var(--cg-red); font-family: var(--font-secondary); font-weight: 700; }
.puck-stat-label { color: var(--cg-charcoal); font-weight: 600; }
.puck-stat-description { color: var(--cg-gray-600); }

/* ==========================================================================
   HEADER CHROME (SiteHeader.tsx)
   ========================================================================== */
.site-header {
  background: var(--cg-charcoal);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  position: sticky;
  top: 0;
  z-index: 50;
}
.site-header .header-grid {
  max-width: var(--cg-content-cap);
  margin: 0 auto;
  padding-left: 0.25rem;
  padding-right: 0.75rem;
}
@media (min-width: 768px) {
  .site-header .header-grid { padding-left: 0.5rem; padding-right: 1.5rem; }
}
@media (min-width: 1024px) {
  .site-header .header-grid { padding-left: 1rem; padding-right: 3rem; }
}
.site-header .header-grid-row { min-height: 8rem; align-items: center; } /* h-32, :21 */
.site-header .header-logo-img,
.site-header .header-logo img {
  height: 7rem !important;   /* h-28, SiteHeader.tsx:23 */
  width: auto !important;
  max-width: none !important; /* renderer injects inline max-width:200px */
}

/* Nav links (:36-55). Renderer markup: .nav-menu > li > .nav-link / .nav-link-dropdown,
   with a default color of var(--color-text, #333) — invisible on the charcoal bar,
   so top-level link color must be forced. */
.site-header a, .site-header nav a { text-decoration: none; }
.site-header .nav-menu > li > .nav-link,
.site-header .nav-menu > li > .nav-link-dropdown,
.site-header .nav-menu > li > a {
  font-size: 0.875rem;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.8) !important;
  padding: 0.5rem 0.75rem;
  border-radius: 0.25rem;
  white-space: nowrap;
  transition: color var(--cg-transition);
  background: none;
}
.site-header .nav-menu > li > .nav-link:hover,
.site-header .nav-menu > li > .nav-link-dropdown:hover,
.site-header .nav-menu > li > a:hover {
  color: #fff !important;
  background: none;
  opacity: 1;
}
.site-header .nav-menu { gap: 0.25rem !important; justify-content: center; }

/* Dropdown panel (:60, :278) — renderer class .nav-dropdown */
.site-header .nav-dropdown {
  background: var(--cg-white);
  border: 1px solid var(--cg-gray-100);
  border-radius: 0.25rem;
  box-shadow: var(--cg-shadow-xl);
  padding: 0.25rem 0;
  min-width: 14rem;
  margin-top: 0;
}
.site-header .nav-item-nested > .nav-dropdown { min-width: 13rem; }
/* Dropdown items (:249,259,273) */
.site-header .nav-dropdown a,
.site-header .nav-dropdown .nav-link,
.site-header .nav-dropdown .nav-link-dropdown {
  display: block;
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  color: var(--cg-gray-700) !important;
  transition: background-color var(--cg-transition), color var(--cg-transition);
}
.site-header .nav-dropdown a:hover,
.site-header .nav-dropdown .nav-link:hover,
.site-header .nav-dropdown .nav-link-dropdown:hover {
  background: var(--cg-gray-50);
  color: var(--cg-red) !important;
  opacity: 1;
}

/* Header buttons (custom section .cg-header-actions) (:76-91) */
.cg-header-actions { display: flex; align-items: center; gap: 1.5rem; }
.cg-login-btn {
  border: 1px solid rgba(255, 255, 255, 0.4);
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 0.875rem;
  padding: 0.375rem 1rem;
  border-radius: 0.25rem;
  white-space: nowrap;
  transition: border-color var(--cg-transition), color var(--cg-transition);
}
.cg-login-btn:hover { border-color: #fff; color: #fff !important; }
.cg-join-btn {
  background: var(--cg-red);
  color: #fff !important;
  padding: 0.5rem 1.25rem;
  border-radius: 0.25rem;
  font-size: 0.875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
  transition: background-color var(--cg-transition);
}
.cg-join-btn:hover { background: var(--cg-red-hover-header); }

/* Renderer defaults .desktop-nav to display:none and never re-shows it —
   desktop nav visibility must come from custom CSS. Breakpoint lg=1024px (:95). */
@media (min-width: 1024px) {
  .site-header .desktop-nav { display: flex !important; align-items: center; }
  .site-header .mobile-menu-toggle { display: none !important; }
}
/* Mobile menu (breakpoint lg=1024px; drawer bg #111) (:95-225) */
@media (max-width: 1023px) {
  .cg-header-actions { display: none; }
  .site-header .desktop-nav { display: none !important; }
  .site-header .mobile-menu-toggle { display: block !important; }
}
/* Renderer defaults paint the drawer white with #333 links via
   `.mobile-nav ul li a` (specificity 0-1-2) — match/beat that specificity.
   Markup is a FLAT \003c ul>: dropdown parents render as \003c a href="#">, children
   follow inline. Recreate hierarchy visually: href="#" = group header,
   everything else = indented child; standalone top-level links (Newswire,
   Store) pinned by href. */
.mobile-nav, .mobile-nav-menu {
  background: #111 !important;
  color: #fff;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.mobile-nav .mobile-nav-header { border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
.mobile-nav .mobile-nav-title { color: #fff; font-weight: 700; }
.mobile-nav .mobile-nav-close { color: #fff; }
.mobile-nav ul li { border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
/* child links (default): indented, dimmer */
.mobile-nav ul li a, .mobile-nav-menu a {
  color: rgba(255, 255, 255, 0.75);
  font-size: 0.9375rem;
  padding: 0.75rem 1rem 0.75rem 2.25rem;
}
.mobile-nav ul li a:hover, .mobile-nav-menu a:hover { color: #fff; }
.mobile-nav ul li a:active { background: rgba(255, 255, 255, 0.06); }
/* group headers: non-navigating parents */
.mobile-nav ul li a[href="#"] {
  color: #fff;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.75rem;
  padding: 1rem 1rem 0.5rem;
  background: rgba(255, 255, 255, 0.04);
  pointer-events: none;
}
/* standalone top-level links (no children) — style as top-level, not child */
.mobile-nav ul li a[href="/store"],
.mobile-nav ul li a[href^="https://cavalrygroupnewswire"] {
  color: #fff;
  font-weight: 600;
  padding-left: 1rem;
}
.mobile-nav-toggle, .mobile-menu-toggle { color: #fff; padding: 0.5rem; }

/* ==========================================================================
   FOOTER CHROME (SiteFooter.tsx)
   ========================================================================== */
.site-footer {
  background: var(--cg-charcoal);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.6);
  margin-top: 0;
}
.site-footer a { color: rgba(255, 255, 255, 0.6); text-decoration: none; }
/* Renderer wraps custom sections in .site-footer-section with an injected
   h3.site-footer-title — hide titles, flatten wrappers to full-width blocks. */
.site-footer .site-footer-content {
  display: block;
  padding: 0;
  max-width: none;
  margin: 0;
  gap: 0;
}
.site-footer .site-footer-section { padding: 0; margin: 0; }
.site-footer .site-footer-title { display: none; }
.site-footer .site-footer-custom { width: 100%; }

/* Slogan ticker (custom section .cg-marquee) (:35-55, index.css:22-29) */
@keyframes cg-marquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.cg-marquee {
  overflow: hidden;
  white-space: nowrap;
  background: var(--cg-red);
  padding: 0.75rem 0;
}
.cg-marquee-track {
  display: inline-flex;
  animation: cg-marquee 28s linear infinite;
  will-change: transform;
}
.cg-marquee-track span {
  display: inline-flex;
  align-items: center;
  gap: 1.25rem;
  padding: 0 1.75rem;
  color: #fff;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.75rem;
}
.cg-marquee-track .cg-dot { color: rgba(255, 255, 255, 0.5); font-size: 1rem; }
@media (prefers-reduced-motion: reduce) { .cg-marquee-track { animation: none; } }

/* Main grid (custom section .cg-footer) (:58-59) */
.cg-footer {
  max-width: var(--cg-content-cap);
  margin: 0 auto;
  padding: 4rem 1.5rem;
}
@media (min-width: 768px) { .cg-footer { padding-left: 3rem; padding-right: 3rem; } }
.cg-footer-grid { display: grid; grid-template-columns: 1fr; gap: 2.5rem; }
@media (min-width: 640px) { .cg-footer-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .cg-footer-grid { grid-template-columns: repeat(4, 1fr); } }

.cg-footer-logo { height: 8rem; width: auto; margin-bottom: 1.25rem; }   /* h-32 mb-5, :63 */
.cg-footer p { font-size: 0.875rem; line-height: 1.625; margin: 0 0 1.25rem; }
.cg-footer h4 {
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin: 0 0 1.25rem;
}
.cg-footer ul { list-style: none; margin: 0; padding: 0; }
.cg-footer-links li + li { margin-top: 0.625rem; }                       /* space-y-2.5 */
.cg-footer-links a {
  font-size: 0.875rem;
  display: inline-block;
  transition: color var(--cg-transition), transform var(--cg-transition);
}
.cg-footer-links a:hover { color: #fff; transform: translateX(2px); }

/* Socials: 36px circles (:75) */
.cg-socials { display: flex; gap: 0.75rem; flex-wrap: wrap; }
.cg-socials a {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color var(--cg-transition), color var(--cg-transition);
}
.cg-socials a:hover { background: var(--cg-red); color: #fff; }
.cg-socials svg { width: 1rem; height: 1rem; }

/* Contact list (:98-115) */
.cg-footer-contact li { display: flex; align-items: flex-start; gap: 0.75rem; font-size: 0.875rem; }
.cg-footer-contact li + li { margin-top: 1rem; }                          /* space-y-4 */
.cg-footer-contact svg { width: 1rem; height: 1rem; color: var(--cg-red); flex-shrink: 0; margin-top: 0.125rem; }
.cg-footer-contact a:hover { color: #fff; }
.cg-member-portal { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(255, 255, 255, 0.1); }
.cg-member-portal-label { font-size: 0.75rem; color: rgba(255, 255, 255, 0.4); margin: 0 0 0.75rem; }
.cg-member-portal a {
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 0.3);
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.75rem;
  padding: 0.5rem 1rem;
  border-radius: 0.25rem;
  transition: border-color var(--cg-transition), color var(--cg-transition);
}
.cg-member-portal a:hover { border-color: #fff; color: #fff; }

/* Legal row — renderer's bottom bar (:168-180) */
.footer-bottom-bar {
  background: var(--cg-charcoal);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.4);
  font-size: 0.75rem;
  padding: 1.25rem 1.5rem;
}
.footer-bottom-bar-copy { color: rgba(255, 255, 255, 0.4); }
.footer-bottom-bar-link { color: rgba(255, 255, 255, 0.4); transition: color var(--cg-transition); }
.footer-bottom-bar-link:hover { color: #fff; }

/* ---------- FAQ accordion (Embed markup, retained) ---------- */
.cg-faq {
  background: var(--cg-white);
  border: 1px solid var(--cg-gray-200);
  border-radius: 0.5rem;
  margin-bottom: 0.75rem;
  overflow: hidden;
}
.cg-faq summary {
  cursor: pointer;
  list-style: none;
  padding: 1rem 3rem 1rem 1.25rem;
  font-weight: 700;
  color: var(--cg-charcoal);
  position: relative;
  transition: background-color var(--cg-transition);
}
.cg-faq summary::-webkit-details-marker { display: none; }
.cg-faq summary::after {
  content: "+";
  position: absolute;
  right: 1.25rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.4rem;
  font-weight: 400;
  color: var(--cg-red);
}
.cg-faq[open] summary::after { content: "\2013"; }
.cg-faq[open] summary { background: var(--cg-offwhite); border-bottom: 1px solid var(--cg-gray-200); }
.cg-faq summary:hover { background: var(--cg-offwhite); }
.cg-faq .cg-faq-body, .cg-faq > div, .cg-faq > p { padding: 1rem 1.25rem; color: var(--cg-gray-600); line-height: 1.625; }

/* ---------- Recur data blocks ---------- */
.recur-product-card, .recur-event-card, .recur-blog-card {
  background: var(--cg-white);
  border: 1px solid var(--cg-gray-200);
  border-radius: 0.5rem;
  overflow: hidden;
  transition: background-color var(--cg-transition), border-color var(--cg-transition);
}
.recur-product-card-title, .recur-event-card-title, .recur-blog-card-title { color: var(--cg-charcoal); font-weight: 700; }
.recur-product-card-price { color: var(--cg-red); font-weight: 800; }
.recur-donation-amount-button {
  border: 2px solid var(--cg-gray-200);
  border-radius: 0.25rem;
  font-weight: 600;
  transition: border-color var(--cg-transition), color var(--cg-transition);
}
.recur-donation-amount-button:hover { border-color: var(--cg-red); color: var(--cg-red); }
.recur-donation-title { font-family: var(--font-secondary); }


            /* PROTECTED footer bottom bar + Recur attribution (Task: protect
               bottom-bar styling from custom CSS). Emitted AFTER the tenant's
               custom CSS and with !important on every declaration so no
               custom CSS can restyle, shrink, hide, or recolor the bottom bar
               or the "Built by"/"Powered by" badge. Emitted in FULL for all
               site modes, including designer-owned (advanced custom-CSS). */
            /* Render class contract v1.11.0 — PROTECTED footer bottom bar + Recur attribution (emitted after custom CSS; not overridable). */
.site-footer .footer-bottom-bar {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.5rem !important;
  margin-top: 1rem !important;
  border-top: 1px solid var(--color-border, #ddd) !important;
  padding: 0.5rem 0 0 !important;
  font-size: 0.6875rem !important;
  color: inherit !important;
  position: static !important;
  transform: none !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}
.site-footer .footer-bottom-bar .footer-bottom-bar-link {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  align-items: center !important;
  gap: 0.375rem !important;
  color: #4d4d4d !important;
  background: #ffffff !important;
  border-radius: 3px !important;
  padding: 2px 8px !important;
  text-decoration: none !important;
  font-size: 0.6875rem !important;
  position: static !important;
  transform: none !important;
  filter: none !important;
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  overflow: visible !important;
  clip-path: none !important;
  transition: opacity 0.2s !important;
}
.site-footer .footer-bottom-bar .footer-bottom-bar-link svg {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: 25px !important;
  width: auto !important;
  vertical-align: middle !important;
}
.site-footer .footer-bottom-bar .footer-bottom-bar-link:hover {
  opacity: 0.8 !important;
}