/* [DISABLED_FOR_WEDDING_VERSION]: Legacy global :root theme tokens disabled.
   Wedding templates now use contract-based tokens in body.theme-* classes. */
/*
:root {
  --primary-bg: #ffffff;
  --secondary-bg: #f4f4f7;
  --accent-bg: #fafafa;
  --primary-text: #222222;
  --secondary-text: #777777;
  --accent-text: #111111;
  --primary-accent: #5046e6;
  --primary-accent-soft: rgba(80, 70, 230, 0.1);
  --secondary-accent: #3d31d9;
  --border-color: transparent;
  --shadow-color: rgba(0, 0, 0, 0.05);
  --shadow-sm: none;
  --shadow-md: none;
  --shadow-lg: none;
  --card-shadow: none;
  --card-shadow-hover: none;
  --section-shadow: none;
  --gradient-1: linear-gradient(135deg, #f4f4f7 0%, #fafafa 100%);
  --gradient-2: linear-gradient(135deg, var(--primary-accent) 0%, var(--secondary-accent) 100%);
  --features2-bg: linear-gradient(135deg, var(--primary-accent) 0%, var(--secondary-accent) 100%);
  --button-on-gradient: #ffffff;
  --button-on-gradient-border: rgba(255, 255, 255, 0.8);
  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --heading-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --border-radius: 16px;
  --button-radius: 50px;
  --card-radius: 20px;
  --spacing-unit: 1.4rem;
}


:root{
  --fp-delay-start: 0.4s;
  --fp-delay-img: 0.45s;
  --fp-delay-a: 1.45s;
  --fp-delay-form: 0.5s;
  --fp-delay-label: 0.55s;
  --fp-delay-input: 0.6s;
  --fp-delay-textarea: 0.65s;
}
*/
/* [DISABLED_FOR_WEDDING_VERSION]: All previous generic themes replaced with 25 wedding-specific palettes below.
   Originals preserved inside @media not all {} so they remain in the codebase but never apply. */
@media not all {



} /* end @media not all — DISABLED_FOR_WEDDING_VERSION */

/* ============================================================
  WEDDING THEME CLASSES — Contract-based palettes from templates
  Source of truth: templates/html/template6.html ... template18.html
  ============================================================ */

/* 1 — Confetti */
body.theme-wedding-confetti {
  --color-canvas: #FFF8F0;
  --color-canvas-alt: #FFF0E6;
  --color-surface: #FFFFFF;
  --color-surface-alt: #F5EDFF;
  --color-surface-raised: #FFFDFB;
  --color-surface-inverse: #1B1464;
  --color-on-canvas: #2C2520;
  --color-on-canvas-muted: #6D6258;
  --color-on-surface: #2A231C;
  --color-on-surface-muted: #6B6157;
  --color-on-surface-subtle: #8C8176;
  --color-on-surface-inverse: #F0EDFF;
  --color-primary: #FF6B6B;
  --color-on-primary: #FFFFFF;
  --color-primary-hover: #E85555;
  --color-primary-active: #D04040;
  --color-primary-container: #FFE0E0;
  --color-on-primary-container: #5B1A1A;
  --color-secondary: #3D5AFE;
  --color-on-secondary: #FFFFFF;
  --color-secondary-hover: #2941E0;
  --color-secondary-active: #1E30C0;
  --color-secondary-container: #D6DEFF;
  --color-on-secondary-container: #1A2466;
  --color-tertiary: #FFD166;
  --color-on-tertiary: #2D2210;
  --color-tertiary-hover: #F0C050;
  --color-tertiary-active: #D4A840;
  --color-tertiary-container: #FFF3D4;
  --color-on-tertiary-container: #3D2E0A;
  --color-link: #3D5AFE;
  --color-link-hover: #2941E0;
  --color-border-subtle: #F0E6DC;
  --color-border: #E6D8CC;
  --color-border-strong: #C4B0A0;
  --color-focus-ring: #3D5AFE;
  --color-overlay: rgba(27, 20, 100, 0.45);
  --color-overlay-strong: rgba(27, 20, 100, 0.65);
  --color-on-overlay: #FFFFFF;
  --color-success: #4f7a59;
  --color-on-success: #f7fff8;
  --color-danger: #a34c4c;
  --color-on-danger: #fff8f8;
}

/* 2 — Mediterranean */
body.theme-mediterranean {
  --color-canvas: #FBF8F4;
  --color-canvas-alt: #F3EDE5;
  --color-surface: #FFFFFF;
  --color-surface-alt: #F0E8DD;
  --color-surface-raised: #FFFDFB;
  --color-surface-inverse: #2A231C;
  --color-on-canvas: #2C2520;
  --color-on-canvas-muted: #6D6258;
  --color-on-surface: #2A231C;
  --color-on-surface-muted: #6B6157;
  --color-on-surface-subtle: #8C8176;
  --color-on-surface-inverse: #F9F4EF;
  --color-primary: #C4704A;
  --color-on-primary: #FFF9F5;
  --color-primary-hover: #B0613D;
  --color-primary-active: #955234;
  --color-primary-container: #F0D9CC;
  --color-on-primary-container: #5B3324;
  --color-secondary: #7B8B68;
  --color-on-secondary: #FBFDF9;
  --color-secondary-hover: #6B7B59;
  --color-secondary-active: #5C6A4D;
  --color-secondary-container: #E0E8D6;
  --color-on-secondary-container: #364030;
  --color-tertiary: #7C9EB5;
  --color-on-tertiary: #F5FAFD;
  --color-tertiary-hover: #6B8DA4;
  --color-tertiary-active: #5A7B92;
  --color-tertiary-container: #D6E6EF;
  --color-on-tertiary-container: #254050;
  --color-link: #955234;
  --color-link-hover: #7A3F27;
  --color-border-subtle: #E6DDD4;
  --color-border: #D4C7BB;
  --color-border-strong: #A69484;
  --color-focus-ring: #7C9EB5;
  --color-overlay: rgba(42, 35, 28, 0.48);
  --color-overlay-strong: rgba(42, 35, 28, 0.68);
  --color-on-overlay: #FFF9F5;
  --color-success: #4F7A59;
  --color-on-success: #F7FFF8;
  --color-danger: #A34C4C;
  --color-on-danger: #FFF8F8;
  --font-body: 'Lato', 'Helvetica Neue', sans-serif;
  --font-heading: 'Cormorant Garamond', Georgia, serif;
}

/* 3 — Dreamy Botanical */
body.theme-dreamy-botanical {
  --color-canvas: #1e2d3a;
  --color-canvas-alt: #243544;
  --color-surface: #2a3a4a;
  --color-surface-alt: #1a2835;
  --color-surface-raised: #2f4050;
  --color-surface-inverse: #0f1920;
  --color-on-canvas: #e8dcc8;
  --color-on-canvas-muted: #9aabbf;
  --color-on-surface: #e0d4c0;
  --color-on-surface-muted: #8fa0b4;
  --color-on-surface-subtle: #6d8097;
  --color-on-surface-inverse: #e8dcc8;
  --color-primary: #c9a456;
  --color-on-primary: #1a1400;
  --color-primary-hover: #b89345;
  --color-primary-active: #a07e38;
  --color-primary-container: #3a3220;
  --color-on-primary-container: #e8d4a0;
  --color-secondary: #5a8a7a;
  --color-on-secondary: #f0faf6;
  --color-secondary-hover: #4d7a6c;
  --color-secondary-active: #406a5e;
  --color-secondary-container: #1e3a30;
  --color-on-secondary-container: #a0d4c0;
  --color-tertiary: #7aa0a8;
  --color-on-tertiary: #0a1a1e;
  --color-tertiary-hover: #6a909a;
  --color-tertiary-active: #5a808a;
  --color-tertiary-container: #1e3038;
  --color-on-tertiary-container: #a8d0d8;
  --color-link: #d4b468;
  --color-link-hover: #e0c880;
  --color-border-subtle: #2e4050;
  --color-border: #3a5060;
  --color-border-strong: #4a6878;
  --color-focus-ring: #7aa0a8;
  --color-overlay: rgba(15, 25, 32, 0.55);
  --color-overlay-strong: rgba(15, 25, 32, 0.75);
  --color-on-overlay: #f0e4d0;
  --color-success: #5a9a6a;
  --color-on-success: #f0fff4;
  --color-danger: #b85a5a;
  --color-on-danger: #fff4f4;
  --font-body: 'Nunito Sans', system-ui, sans-serif;
  --font-heading: 'Cormorant Garamond', Georgia, serif;
}

/* 4 — Wedding Modern Bliss */
body.theme-wedding-modern-bliss {
  --color-canvas: #fdfaf9;
  --color-canvas-alt: #f8f3f1;
  --color-surface: #ffffff;
  --color-surface-alt: #fdf0f5;
  --color-surface-raised: #fffdfb;
  --color-surface-inverse: #1a0f14;
  --color-on-canvas: #1a1117;
  --color-on-canvas-muted: #6b5a62;
  --color-on-surface: #1a1117;
  --color-on-surface-muted: #6b5a62;
  --color-on-surface-subtle: #9b8a92;
  --color-on-surface-inverse: #f9f0f5;
  --color-primary: #e8488a;
  --color-on-primary: #ffffff;
  --color-primary-hover: #d4377a;
  --color-primary-active: #be2868;
  --color-primary-container: #fde4f0;
  --color-on-primary-container: #7a1040;
  --color-secondary: #f97316;
  --color-on-secondary: #ffffff;
  --color-secondary-hover: #e06210;
  --color-secondary-active: #c85210;
  --color-secondary-container: #fef0e6;
  --color-on-secondary-container: #7a3010;
  --color-tertiary: #9f8fc0;
  --color-on-tertiary: #ffffff;
  --color-tertiary-hover: #8e7eaf;
  --color-tertiary-active: #7d6d9e;
  --color-tertiary-container: #ede8f8;
  --color-on-tertiary-container: #3d2a60;
  --color-link: #d4377a;
  --color-link-hover: #be2868;
  --color-border-subtle: #f0e0e8;
  --color-border: #e0c8d4;
  --color-border-strong: #c0a0b0;
  --color-focus-ring: #e8488a;
  --color-overlay: rgba(20, 10, 15, 0.48);
  --color-overlay-strong: rgba(20, 10, 15, 0.72);
  --color-on-overlay: #fffaf8;
  --color-success: #4f7a59;
  --color-on-success: #f7fff8;
  --color-danger: #a34c4c;
  --color-on-danger: #fff8f8;
  --font-body: 'Nunito', system-ui, sans-serif;
  --font-heading: 'Cormorant Garamond', Georgia, serif;
  --font-display: 'Playfair Display', Georgia, serif;
  --font-script: 'Dancing Script', cursive;
}

/* 5 — Wanderlust */
body.theme-wedding-wanderlust,
.theme-wedding-wanderlust {
  --color-canvas: #FAF8F5;
  --color-canvas-alt: #F0EDE8;
  --color-surface: #FFFFFF;
  --color-surface-alt: #E5DFD6;
  --color-surface-raised: #FDFCFA;
  --color-surface-inverse: #1A2A3A;
  --color-on-canvas: #2C3E50;
  --color-on-canvas-muted: #6B7B8D;
  --color-on-surface: #1A2A3A;
  --color-on-surface-muted: #6B7B8D;
  --color-on-surface-subtle: #8A97A4;
  --color-on-surface-inverse: #FAF8F5;
  --color-primary: #C0956C;
  --color-on-primary: #FFFAF5;
  --color-primary-hover: #A8804D;
  --color-primary-active: #8F6B3E;
  --color-primary-container: rgba(192, 149, 108, 0.12);
  --color-on-primary-container: #5B3E24;
  --color-secondary: #5B8C7A;
  --color-on-secondary: #F8FDFB;
  --color-secondary-hover: #4A7566;
  --color-secondary-active: #3C6054;
  --color-secondary-container: #D8EBE4;
  --color-on-secondary-container: #2A4A3E;
  --color-tertiary: #8B7355;
  --color-on-tertiary: #FFF8F0;
  --color-tertiary-hover: #756044;
  --color-tertiary-active: #5F4D36;
  --color-tertiary-container: #EDE4D6;
  --color-on-tertiary-container: #4A3820;
  --color-link: #A8804D;
  --color-link-hover: #8F6B3E;
  --color-border-subtle: #E5DFD6;
  --color-border: #D5CFC5;
  --color-border-strong: #A09888;
  --color-focus-ring: #7C8FB4;
  --color-overlay: rgba(26, 42, 58, 0.45);
  --color-overlay-strong: rgba(26, 42, 58, 0.65);
  --color-on-overlay: #FFFAF5;
  --color-success: #4F7A59;
  --color-on-success: #F7FFF8;
  --color-danger: #A34C4C;
  --color-on-danger: #FFF8F8;
  --font-body: 'Raleway', 'Helvetica Neue', sans-serif;
  --font-heading: 'Playfair Display', Georgia, serif;
  --font-hand: 'Caveat', cursive;
  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --radius-lg: 1rem;
  --shadow-sm: 0 2px 8px rgba(44, 62, 80, 0.06);
  --shadow-md: 0 8px 24px rgba(44, 62, 80, 0.08);
  --shadow-lg: 0 16px 40px rgba(44, 62, 80, 0.12);
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
}

/* 6 — Atelier */
body.theme-atelier {
  --color-canvas: #F4EFE9;
  --color-canvas-alt: #EDE6DC;
  --color-surface: #FFFFFF;
  --color-surface-alt: #EAE3D8;
  --color-surface-raised: #FDFAF7;
  --color-surface-inverse: #1A1614;
  --color-on-canvas: #1A1614;
  --color-on-canvas-muted: #5C5550;
  --color-on-surface: #1A1614;
  --color-on-surface-muted: #6B6258;
  --color-on-surface-subtle: #8C8278;
  --color-on-surface-inverse: #F4EFE9;
  --color-primary: #1A1614;
  --color-on-primary: #F4EFE9;
  --color-primary-hover: #2C2826;
  --color-primary-active: #3D3936;
  --color-primary-container: #E0D8CF;
  --color-on-primary-container: #1A1614;
  --color-secondary: #6B6258;
  --color-on-secondary: #FDFAF7;
  --color-secondary-hover: #5C5550;
  --color-secondary-active: #4D4744;
  --color-secondary-container: #E8E1D9;
  --color-on-secondary-container: #2E2B28;
  --color-tertiary: #B8986C;
  --color-on-tertiary: #1A1614;
  --color-tertiary-hover: #A5885C;
  --color-tertiary-active: #8F714B;
  --color-tertiary-container: #F0E4CE;
  --color-on-tertiary-container: #4A3318;
  --color-link: #1A1614;
  --color-link-hover: #6B6258;
  --color-border-subtle: #DDD6CC;
  --color-border: #C8BFB5;
  --color-border-strong: #9A9088;
  --color-focus-ring: #B8986C;
  --color-overlay: rgba(20,15,12,0.45);
  --color-overlay-strong: rgba(20,15,12,0.68);
  --color-on-overlay: #F4EFE9;
  --color-success: #4F7A59;
  --color-on-success: #F7FFF8;
  --color-danger: #A34C4C;
  --color-on-danger: #FFF8F8;
  --font-body: 'Inter', system-ui, sans-serif;
  --font-heading: 'Cormorant Garamond', Georgia, serif;
  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --shadow-sm: 0 2px 10px rgba(0,0,0,0.06);
  --shadow-md: 0 12px 28px rgba(0,0,0,0.10);
  --shadow-lg: 0 24px 48px rgba(0,0,0,0.14);
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
}

/* 6 — Botanical Romance */
body.theme-botanical-romance {
  --color-canvas: #FCF9F5;
  --color-canvas-alt: #F6EFE8;
  --color-surface: #FFFFFF;
  --color-surface-alt: #F2E8E1;
  --color-surface-raised: #FFFDFB;
  --color-surface-inverse: #2B1F1B;
  --color-on-canvas: #2C1F1C;
  --color-on-canvas-muted: #6B5A55;
  --color-on-surface: #2A1F1C;
  --color-on-surface-muted: #6B5A55;
  --color-on-surface-subtle: #9A8A83;
  --color-on-surface-inverse: #F9F3EF;
  --color-primary: #C4697A;
  --color-on-primary: #FFF8F9;
  --color-primary-hover: #B05A6B;
  --color-primary-active: #984E5D;
  --color-primary-container: #F2D8DC;
  --color-on-primary-container: #5C2630;
  --color-secondary: #8FAE8E;
  --color-on-secondary: #F8FDF8;
  --color-secondary-hover: #7A9B79;
  --color-secondary-active: #668866;
  --color-secondary-container: #D9ECD9;
  --color-on-secondary-container: #2A4029;
  --color-tertiary: #C8A87A;
  --color-on-tertiary: #2D2110;
  --color-tertiary-hover: #B49568;
  --color-tertiary-active: #9E8057;
  --color-tertiary-container: #F4E8D3;
  --color-on-tertiary-container: #5A3F18;
  --color-link: #984E5D;
  --color-link-hover: #7A3747;
  --color-border-subtle: #EAE0DA;
  --color-border: #D6C8C0;
  --color-border-strong: #B09A90;
  --color-focus-ring: #C4697A;
  --color-overlay: rgba(30, 18, 15, 0.48);
  --color-overlay-strong: rgba(30, 18, 15, 0.68);
  --color-on-overlay: #FFF8F5;
  --color-success: #4F7A59;
  --color-on-success: #F7FFF8;
  --color-danger: #A34C4C;
  --color-on-danger: #FFF8F8;
  --font-body: 'Jost', system-ui, sans-serif;
  --font-heading: 'Cormorant Garamond', Georgia, serif;
  --font-script: 'Pinyon Script', cursive;
}

/* 7 — Kyoto */
body.theme-kyoto {
  --color-canvas: #F3EDE7;
  --color-canvas-alt: #EBE4DC;
  --color-surface: #FAF8F5;
  --color-surface-alt: #E6DDD3;
  --color-surface-raised: #FFFDFB;
  --color-surface-inverse: #171210;
  --color-on-canvas: #181412;
  --color-on-canvas-muted: #5A5350;
  --color-on-surface: #181412;
  --color-on-surface-muted: #6B6360;
  --color-on-surface-subtle: #908880;
  --color-on-surface-inverse: #F3EDE7;
  --color-primary: #181412;
  --color-on-primary: #F3EDE7;
  --color-primary-hover: #2E2A28;
  --color-primary-active: #3D3935;
  --color-primary-container: #E0D6CB;
  --color-on-primary-container: #181412;
  --color-secondary: #6B6360;
  --color-on-secondary: #F3EDE7;
  --color-secondary-hover: #5A5350;
  --color-secondary-active: #4A4340;
  --color-secondary-container: #EAE4DC;
  --color-on-secondary-container: #2A2420;
  --color-tertiary: #B8976A;
  --color-on-tertiary: #181412;
  --color-tertiary-hover: #A3845A;
  --color-tertiary-active: #8E7049;
  --color-tertiary-container: #F0E4CE;
  --color-on-tertiary-container: #4A3820;
  --color-link: #181412;
  --color-link-hover: #6B6360;
  --color-border-subtle: #DDD5C8;
  --color-border: #C8BFAF;
  --color-border-strong: #9A908A;
  --color-focus-ring: #B8976A;
  --color-overlay: rgba(18, 14, 11, 0.45);
  --color-overlay-strong: rgba(18, 14, 11, 0.70);
  --color-on-overlay: #F5F0EB;
  --color-success: #4F7A59;
  --color-on-success: #F7FFF8;
  --color-danger: #A34C4C;
  --color-on-danger: #FFF8F8;
  --font-body: 'Inter', system-ui, sans-serif;
  --font-heading: 'Cormorant Garamond', Georgia, serif;
  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --shadow-sm: 0 2px 10px rgba(0,0,0,0.06);
  --shadow-md: 0 12px 28px rgba(0,0,0,0.10);
  --shadow-lg: 0 24px 48px rgba(0,0,0,0.14);
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
}

/* 8 — Avela White */
body.theme-avela-white {
  --color-canvas: #F4F2EF;
  --color-canvas-alt: #ECEAE6;
  --color-surface: #FAFAF8;
  --color-surface-alt: #E8E5E0;
  --color-surface-raised: #FFFFFF;
  --color-surface-inverse: #161514;
  --color-on-canvas: #161514;
  --color-on-canvas-muted: #5C5956;
  --color-on-surface: #161514;
  --color-on-surface-muted: #6E6B68;
  --color-on-surface-subtle: #9A9794;
  --color-on-surface-inverse: #F0EDE9;
  --color-primary: #161514;
  --color-on-primary: #F0EDE9;
  --color-primary-hover: #2C2A28;
  --color-primary-active: #3F3D3B;
  --color-primary-container: #E2DED8;
  --color-on-primary-container: #161514;
  --color-secondary: #6E6B68;
  --color-on-secondary: #F0EDE9;
  --color-secondary-hover: #5C5956;
  --color-secondary-active: #4A4845;
  --color-secondary-container: #ECEAE6;
  --color-on-secondary-container: #2A2826;
  --color-tertiary: #B09A80;
  --color-on-tertiary: #161514;
  --color-tertiary-hover: #9C8870;
  --color-tertiary-active: #88755E;
  --color-tertiary-container: #EDE5D8;
  --color-on-tertiary-container: #3D3020;
  --color-link: #161514;
  --color-link-hover: #6E6B68;
  --color-border-subtle: #DDD9D3;
  --color-border: #C8C3BC;
  --color-border-strong: #9A958E;
  --color-focus-ring: #B09A80;
  --color-overlay: rgba(12, 10, 9, 0.48);
  --color-overlay-strong: rgba(12, 10, 9, 0.72);
  --color-on-overlay: #F5F2EE;
  --color-success: #4F7A59;
  --color-on-success: #F7FFF8;
  --color-danger: #A34C4C;
  --color-on-danger: #FFF8F8;
  --font-body: 'Inter', system-ui, sans-serif;
  --font-heading: 'Cormorant Garamond', Georgia, serif;
  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --shadow-sm: 0 2px 10px rgba(0,0,0,0.06);
  --shadow-md: 0 12px 28px rgba(0,0,0,0.10);
  --shadow-lg: 0 24px 48px rgba(0,0,0,0.14);
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
}

/* 9 — Olive Garden */
body.theme-olive-garden {
  --color-canvas: #fafaf5;
  --color-canvas-alt: #f2f0e6;
  --color-surface: #ffffff;
  --color-surface-alt: #eeebdf;
  --color-surface-raised: #fffffe;
  --color-surface-inverse: #252518;
  --color-on-canvas: #28261a;
  --color-on-canvas-muted: #686450;
  --color-on-surface: #28261a;
  --color-on-surface-muted: #6a6654;
  --color-on-surface-subtle: #8c8878;
  --color-on-surface-inverse: #f0ede0;
  --color-primary: #8a8a2e;
  --color-on-primary: #fafaf5;
  --color-primary-hover: #787820;
  --color-primary-active: #626216;
  --color-primary-container: #e8e8c0;
  --color-on-primary-container: #3a3a0a;
  --color-secondary: #a09040;
  --color-on-secondary: #fafaf5;
  --color-secondary-hover: #907e34;
  --color-secondary-active: #7c6c28;
  --color-secondary-container: #f0e8c0;
  --color-on-secondary-container: #403a10;
  --color-tertiary: #c8a840;
  --color-on-tertiary: #28200a;
  --color-tertiary-hover: #b89434;
  --color-tertiary-active: #a08028;
  --color-tertiary-container: #f8f0d0;
  --color-on-tertiary-container: #4a3c10;
  --color-link: #8a8a2e;
  --color-link-hover: #686620;
  --color-border-subtle: #e0dcc8;
  --color-border: #ccc8b0;
  --color-border-strong: #a0a080;
  --color-focus-ring: #8a8a2e;
  --color-overlay: rgba(22, 20, 10, 0.52);
  --color-overlay-strong: rgba(22, 20, 10, 0.72);
  --color-on-overlay: #f8f6ec;
  --color-success: #4f7a59;
  --color-on-success: #f7fff8;
  --color-danger: #a34c4c;
  --color-on-danger: #fff8f8;
  --font-body: 'Inter', system-ui, sans-serif;
  --font-heading: 'Cormorant Garamond', Georgia, serif;
  --font-script: 'Great Vibes', cursive;
  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --shadow-sm: 0 2px 10px rgba(0,0,0,0.06);
  --shadow-md: 0 12px 28px rgba(0,0,0,0.10);
  --shadow-lg: 0 24px 48px rgba(0,0,0,0.14);
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
}

/* 10 — Dreamday */
body.theme-dreamday {
  --color-canvas: #f7f3ee;
  --color-canvas-alt: #ede8e1;
  --color-surface: #fdfaf7;
  --color-surface-alt: #ece5db;
  --color-surface-raised: #ffffff;
  --color-surface-inverse: #2d2318;
  --color-on-canvas: #2d2318;
  --color-on-canvas-muted: #6b5e52;
  --color-on-surface: #2d2318;
  --color-on-surface-muted: #6b5e52;
  --color-on-surface-subtle: #9c8d81;
  --color-on-surface-inverse: #f5efe8;
  --color-primary: #7a5c48;
  --color-on-primary: #fdf8f4;
  --color-primary-hover: #684d3b;
  --color-primary-active: #56402f;
  --color-primary-container: #e8d8cc;
  --color-on-primary-container: #4a3122;
  --color-secondary: #9a8c7e;
  --color-on-secondary: #fdf8f4;
  --color-secondary-hover: #887a6c;
  --color-secondary-active: #75685a;
  --color-secondary-container: #e5ddd4;
  --color-on-secondary-container: #3a2f26;
  --color-tertiary: #c4a882;
  --color-on-tertiary: #2d2318;
  --color-tertiary-hover: #b49572;
  --color-tertiary-active: #a08362;
  --color-tertiary-container: #f0e4d2;
  --color-on-tertiary-container: #4a3520;
  --color-link: #7a5c48;
  --color-link-hover: #56402f;
  --color-border-subtle: #e0d5c8;
  --color-border: #cdc0b0;
  --color-border-strong: #a8967f;
  --color-focus-ring: #c4a882;
  --color-overlay: rgba(30, 20, 12, 0.44);
  --color-overlay-strong: rgba(30, 20, 12, 0.66);
  --color-on-overlay: #fdf8f4;
  --color-success: #4f7a59;
  --color-on-success: #f7fff8;
  --color-danger: #a34c4c;
  --color-on-danger: #fff8f8;
  --font-body: 'Inter', system-ui, sans-serif;
  --font-heading: 'Cormorant Garamond', Georgia, serif;
  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --shadow-sm: 0 2px 10px rgba(0,0,0,0.06);
  --shadow-md: 0 12px 28px rgba(0,0,0,0.10);
  --shadow-lg: 0 24px 48px rgba(0,0,0,0.14);
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
}

/* 11 — Renthem */
body.theme-renthem {
  --color-canvas: #fdfcfa;
  --color-canvas-alt: #f7f3ef;
  --color-surface: #fefefe;
  --color-surface-alt: #f2ede8;
  --color-surface-raised: #ffffff;
  --color-surface-inverse: #7a5347;
  --color-on-canvas: #2a160d;
  --color-on-canvas-muted: #7d5948;
  --color-on-surface: #2a160d;
  --color-on-surface-muted: #7d5948;
  --color-on-surface-subtle: #a88070;
  --color-on-surface-inverse: #f5ede8;
  --color-primary: #8c5a3e;
  --color-on-primary: #fdf8f5;
  --color-primary-hover: #7a4d33;
  --color-primary-active: #67402a;
  --color-primary-container: #edddd2;
  --color-on-primary-container: #4a2218;
  --color-secondary: #a07868;
  --color-on-secondary: #fdf8f5;
  --color-secondary-hover: #8e6858;
  --color-secondary-active: #7a5848;
  --color-secondary-container: #f0e4dc;
  --color-on-secondary-container: #402820;
  --color-tertiary: #c4956a;
  --color-on-tertiary: #2a1800;
  --color-tertiary-hover: #b0834e;
  --color-tertiary-active: #9c7140;
  --color-tertiary-container: #f7e8d8;
  --color-on-tertiary-container: #4a2c10;
  --color-link: #8c5a3e;
  --color-link-hover: #67402a;
  --color-border-subtle: #ede4dc;
  --color-border: #d8ccc4;
  --color-border-strong: #b09888;
  --color-focus-ring: #8c5a3e;
  --color-overlay: rgba(244, 238, 230, 0.18);
  --color-overlay-strong: rgba(244, 238, 230, 0.42);
  --color-on-overlay: #2a160d;
  --color-success: #4f7a59;
  --color-on-success: #f7fff8;
  --color-danger: #a34c4c;
  --color-on-danger: #fff8f8;
  --font-body: 'Inter', system-ui, sans-serif;
  --font-heading: 'Cormorant Garamond', Georgia, serif;
  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --shadow-sm: 0 2px 10px rgba(0,0,0,0.06);
  --shadow-md: 0 12px 28px rgba(0,0,0,0.10);
  --shadow-lg: 0 24px 48px rgba(0,0,0,0.14);
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
}

/* 12 — Retro (classic teal / neon accents) */
body.theme-wedding-retro {
  --color-canvas: #008080;
  --color-canvas-alt: #000080;
  --color-surface: #c0c0c0;
  --color-surface-alt: #dfdfdf;
  --color-surface-raised: #ffffff;
  --color-surface-inverse: #000000;
  --color-on-canvas: #ffffff;
  --color-on-canvas-muted: #dfdfdf;
  --color-on-surface: #000000;
  --color-on-surface-muted: #404040;
  --color-on-surface-subtle: #808080;
  --color-on-surface-inverse: #ffffff;
  --color-primary: #ff00ff;
  --color-on-primary: #ffffff;
  --color-primary-hover: #d400d4;
  --color-primary-active: #a800a8;
  --color-primary-container: #ffd4ff;
  --color-on-primary-container: #400040;
  --color-secondary: #00ffff;
  --color-on-secondary: #000000;
  --color-secondary-hover: #00d4d4;
  --color-secondary-active: #00a8a8;
  --color-secondary-container: #d4ffff;
  --color-on-secondary-container: #004040;
  --color-tertiary: #ffff00;
  --color-on-tertiary: #000000;
  --color-tertiary-hover: #d4d400;
  --color-tertiary-active: #a8a800;
  --color-tertiary-container: #ffffd4;
  --color-on-tertiary-container: #404000;
  --color-link: #0000ff;
  --color-link-hover: #ff0000;
  --color-border-subtle: #dfdfdf;
  --color-border: #808080;
  --color-border-strong: #000000;
  --color-focus-ring: #ff00ff;
  --color-overlay: rgba(0, 0, 0, 0.5);
  --color-overlay-strong: rgba(0, 0, 0, 0.8);
  --color-on-overlay: #ffffff;
  --color-success: #00ff00;
  --color-on-success: #000000;
  --color-danger: #ff0000;
  --color-on-danger: #ffffff;
}

/* 13 — Editorial Fashion (template20) */
body.theme-editorial-fashion {
  --color-canvas: #fafafa;
  --color-canvas-alt: #f0f0f0;
  --color-surface: #ffffff;
  --color-surface-alt: #f5f5f5;
  --color-surface-raised: #ffffff;
  --color-surface-inverse: #0a0a0a;
  --color-on-canvas: #0a0a0a;
  --color-on-canvas-muted: #555555;
  --color-on-surface: #0a0a0a;
  --color-on-surface-muted: #666666;
  --color-on-surface-subtle: #999999;
  --color-on-surface-inverse: #fafafa;
  --color-primary: #0a0a0a;
  --color-on-primary: #fafafa;
  --color-primary-hover: #222222;
  --color-primary-active: #333333;
  --color-primary-container: #e8e8e8;
  --color-on-primary-container: #0a0a0a;
  --color-secondary: #fafafa;
  --color-on-secondary: #0a0a0a;
  --color-secondary-hover: #e8e8e8;
  --color-secondary-active: #d5d5d5;
  --color-secondary-container: #f5f5f5;
  --color-on-secondary-container: #333333;
  --color-tertiary: #c8a96e;
  --color-on-tertiary: #0a0a0a;
  --color-tertiary-hover: #b89a5f;
  --color-tertiary-active: #a88b50;
  --color-tertiary-container: #f5eed8;
  --color-on-tertiary-container: #5a4a2a;
  --color-link: #0a0a0a;
  --color-link-hover: #333333;
  --color-border-subtle: #e0e0e0;
  --color-border: #0a0a0a;
  --color-border-strong: #0a0a0a;
  --color-focus-ring: #0a0a0a;
  --color-overlay: rgba(10, 10, 10, 0.5);
  --color-overlay-strong: rgba(10, 10, 10, 0.75);
  --color-on-overlay: #fafafa;
  --color-success: #2d5a3d;
  --color-on-success: #f0f8f2;
  --color-danger: #8b2020;
  --color-on-danger: #fff0f0;
}

/* 14 — Terracotta (template1) */
body.theme-wedding-terracotta,
.theme-wedding-terracotta {
  --color-canvas: #f4eee8;
  --color-canvas-alt: #ede2d7;
  --color-surface: #ffffff;
  --color-surface-alt: #f8f2ec;
  --color-surface-raised: #ffffff;
  --color-surface-inverse: #3a2a1e;
  --color-on-canvas: #4a3728;
  --color-on-canvas-muted: #7d6b5d;
  --color-on-surface: #4a3728;
  --color-on-surface-muted: #7d6b5d;
  --color-on-surface-subtle: #a38f80;
  --color-on-surface-inverse: #f9f3ed;
  --color-primary: #c6714b;
  --color-on-primary: #fff8f2;
  --color-primary-hover: #b56340;
  --color-primary-active: #a05636;
  --color-primary-container: #f1dfd0;
  --color-on-primary-container: #4a2f20;
  --color-secondary: #a05636;
  --color-on-secondary: #fff8f2;
  --color-secondary-hover: #8e4a2f;
  --color-secondary-active: #7a4028;
  --color-secondary-container: #edd7c7;
  --color-on-secondary-container: #3f281d;
  --color-tertiary: #6f8a5d;
  --color-on-tertiary: #f4f8f1;
  --color-tertiary-hover: #607850;
  --color-tertiary-active: #536744;
  --color-tertiary-container: #dce7d5;
  --color-on-tertiary-container: #2d3d24;
  --color-link: #a05636;
  --color-link-hover: #8e4a2f;
  --color-border-subtle: #e7d8ca;
  --color-border: #dccab9;
  --color-border-strong: #b89f89;
  --color-focus-ring: #c6714b;
  --color-overlay: rgba(38, 24, 16, 0.42);
  --color-overlay-strong: rgba(38, 24, 16, 0.62);
  --color-on-overlay: #fff9f3;
  --color-success: #4f7a59;
  --color-on-success: #f7fff8;
  --color-danger: #a34c4c;
  --color-on-danger: #fff8f8;
}

/* 15 — Dusty Rose (template2) */
body.theme-wedding-dusty-rose,
.theme-wedding-dusty-rose {
  --color-canvas: #fffdfd;
  --color-canvas-alt: #fbf5f6;
  --color-surface: #fffdfd;
  --color-surface-alt: #f5e9ea;
  --color-surface-raised: #ffffff;
  --color-surface-inverse: #2d2121;
  --color-on-canvas: #4a3a3a;
  --color-on-canvas-muted: #7a6868;
  --color-on-surface: #2d2121;
  --color-on-surface-muted: #7a6868;
  --color-on-surface-subtle: #9a8888;
  --color-on-surface-inverse: #fffdfd;
  --color-primary: #c48b90;
  --color-on-primary: #ffffff;
  --color-primary-hover: #a36b70;
  --color-primary-active: #8d5a5f;
  --color-primary-container: #f5e9ea;
  --color-on-primary-container: #5a3538;
  --color-secondary: #a36b70;
  --color-on-secondary: #ffffff;
  --color-secondary-hover: #8d5a5f;
  --color-secondary-active: #7a4d52;
  --color-secondary-container: #ebd6d8;
  --color-on-secondary-container: #4a2a2d;
  --color-tertiary: #c5a87a;
  --color-on-tertiary: #2d2210;
  --color-tertiary-hover: #b69568;
  --color-tertiary-active: #a08050;
  --color-tertiary-container: #f0e6d6;
  --color-on-tertiary-container: #5b4316;
  --color-link: #a36b70;
  --color-link-hover: #8d5a5f;
  --color-border-subtle: #ebd6d8;
  --color-border: #d4bfc1;
  --color-border-strong: #b8a0a3;
  --color-focus-ring: #c48b90;
  --color-overlay: rgba(45, 33, 33, 0.48);
  --color-overlay-strong: rgba(45, 33, 33, 0.68);
  --color-on-overlay: #fff5f5;
  --color-success: #4f7a59;
  --color-on-success: #f7fff8;
  --color-danger: #a34c4c;
  --color-on-danger: #fff8f8;
}

/* 16 — Midnight Stars (template4) */
body.theme-wedding-midnight-stars,
.theme-wedding-midnight-stars {
  --color-canvas: #0f141d;
  --color-canvas-alt: #1a202c;
  --color-surface: #131a24;
  --color-surface-alt: #1f2836;
  --color-surface-raised: #1a2432;
  --color-surface-inverse: #f4f7fb;
  --color-on-canvas: #e2e8f0;
  --color-on-canvas-muted: #94a3b8;
  --color-on-surface: #e2e8f0;
  --color-on-surface-muted: #9fb0c7;
  --color-on-surface-subtle: #71839a;
  --color-on-surface-inverse: #0f141d;
  --color-primary: #d4af37;
  --color-on-primary: #1a1300;
  --color-primary-hover: #c19e2f;
  --color-primary-active: #ad8d28;
  --color-primary-container: #3a3114;
  --color-on-primary-container: #f8e7ae;
  --color-secondary: #b8962e;
  --color-on-secondary: #120d00;
  --color-secondary-hover: #a58327;
  --color-secondary-active: #927320;
  --color-secondary-container: #332b12;
  --color-on-secondary-container: #edd796;
  --color-tertiary: #8fa6c7;
  --color-on-tertiary: #0d1828;
  --color-tertiary-hover: #7e96b8;
  --color-tertiary-active: #6f85a8;
  --color-tertiary-container: #2a3445;
  --color-on-tertiary-container: #dbe7f7;
  --color-link: #d4af37;
  --color-link-hover: #e3c65f;
  --color-border-subtle: #263244;
  --color-border: #2d3748;
  --color-border-strong: #465067;
  --color-focus-ring: #d4af37;
  --color-overlay: rgba(10, 14, 20, 0.55);
  --color-overlay-strong: rgba(10, 14, 20, 0.75);
  --color-on-overlay: #f7f9fc;
  --color-success: #4f7a59;
  --color-on-success: #f7fff8;
  --color-danger: #a34c4c;
  --color-on-danger: #fff8f8;
}

/* 17 — Bauhaus Gallery (template19) */
body.theme-bauhaus-gallery,
.theme-bauhaus-gallery {
  --color-canvas: #ffffff;
  --color-canvas-alt: #f2f2f2;
  --color-surface: #ffffff;
  --color-surface-alt: #000000;
  --color-surface-raised: #ffffff;
  --color-surface-inverse: #000000;
  --color-on-canvas: #000000;
  --color-on-canvas-muted: #444444;
  --color-on-surface: #000000;
  --color-on-surface-muted: #666666;
  --color-on-surface-subtle: #999999;
  --color-on-surface-inverse: #ffffff;
  --color-primary: #e63946;
  --color-on-primary: #ffffff;
  --color-primary-hover: #c12e3a;
  --color-primary-active: #a02630;
  --color-primary-container: #fceced;
  --color-on-primary-container: #4a1216;
  --color-secondary: #1d3557;
  --color-on-secondary: #ffffff;
  --color-secondary-hover: #162a45;
  --color-secondary-active: #0f1e32;
  --color-secondary-container: #e8ebef;
  --color-on-secondary-container: #09111c;
  --color-tertiary: #ffb703;
  --color-on-tertiary: #000000;
  --color-tertiary-hover: #e6a502;
  --color-tertiary-active: #cc9202;
  --color-tertiary-container: #fff8e6;
  --color-on-tertiary-container: #4d3701;
  --color-link: #000000;
  --color-link-hover: #e63946;
  --color-border-subtle: #e5e5e5;
  --color-border: #000000;
  --color-border-strong: #000000;
  --color-focus-ring: #1d3557;
  --color-overlay: rgba(0, 0, 0, 0.4);
  --color-overlay-strong: rgba(0, 0, 0, 0.7);
  --color-on-overlay: #ffffff;
  --color-success: #4f7a59;
  --color-on-success: #f7fff8;
  --color-danger: #a34c4c;
  --color-on-danger: #fff8f8;
}

/* 18 — Blush Polaroid (template17-2) */
body.theme-blush-polaroid,
.theme-blush-polaroid {
  --color-canvas: #f2ddd5;
  --color-canvas-alt: #eddbd3;
  --color-surface: #ffffff;
  --color-surface-alt: #f7ece6;
  --color-surface-raised: #ffffff;
  --color-surface-inverse: #3a2820;
  --color-on-canvas: #2e1c14;
  --color-on-canvas-muted: #7a5c4e;
  --color-on-surface: #2e1c14;
  --color-on-surface-muted: #7a5c4e;
  --color-on-surface-subtle: #a08878;
  --color-on-surface-inverse: #f5ede8;
  --color-primary: #c47a3c;
  --color-on-primary: #fff8f2;
  --color-primary-hover: #b06a30;
  --color-primary-active: #9a5c28;
  --color-primary-container: #f0d8c4;
  --color-on-primary-container: #4a2a10;
  --color-secondary: #d4967a;
  --color-on-secondary: #fff8f5;
  --color-secondary-hover: #c08568;
  --color-secondary-active: #a87458;
  --color-secondary-container: #f5e0d4;
  --color-on-secondary-container: #4a2820;
  --color-tertiary: #3c6b52;
  --color-on-tertiary: #f0fff5;
  --color-tertiary-hover: #305a44;
  --color-tertiary-active: #284a38;
  --color-tertiary-container: #d0e8dc;
  --color-on-tertiary-container: #1a3a28;
  --color-link: #b06a30;
  --color-link-hover: #9a5c28;
  --color-border-subtle: #e8d4c8;
  --color-border: #d8c0b0;
  --color-border-strong: #b09880;
  --color-focus-ring: #c47a3c;
  --color-overlay: rgba(48, 30, 20, 0.35);
  --color-overlay-strong: rgba(48, 30, 20, 0.55);
  --color-on-overlay: #fff8f2;
  --color-success: #4f7a59;
  --color-on-success: #f7fff8;
  --color-danger: #a34c4c;
  --color-on-danger: #fff8f8;
}

/* 19 — Villa Mediterranea (template20-2) */
body.theme-villa-mediterranea,
.theme-villa-mediterranea {
  --color-canvas: #fdfcf9;
  --color-canvas-alt: #f5f0ea;
  --color-surface: #fefefe;
  --color-surface-alt: #f0ebe4;
  --color-surface-raised: #ffffff;
  --color-surface-inverse: #2e2420;
  --color-on-canvas: #2a1c14;
  --color-on-canvas-muted: #7a5e4a;
  --color-on-surface: #2a1c14;
  --color-on-surface-muted: #7a5e4a;
  --color-on-surface-subtle: #a08870;
  --color-on-surface-inverse: #f5ede6;
  --color-primary: #b07040;
  --color-on-primary: #fdf8f4;
  --color-primary-hover: #9a6038;
  --color-primary-active: #845030;
  --color-primary-container: #eed8c4;
  --color-on-primary-container: #4a2818;
  --color-secondary: #6a8060;
  --color-on-secondary: #f6faf4;
  --color-secondary-hover: #5a7050;
  --color-secondary-active: #4a6040;
  --color-secondary-container: #dae6d4;
  --color-on-secondary-container: #2a3826;
  --color-tertiary: #c49e60;
  --color-on-tertiary: #2a1c00;
  --color-tertiary-hover: #b08c50;
  --color-tertiary-active: #9a7a40;
  --color-tertiary-container: #f4e8d0;
  --color-on-tertiary-container: #4a3410;
  --color-link: #9a6038;
  --color-link-hover: #7a4828;
  --color-border-subtle: #e8ded4;
  --color-border: #d4c8ba;
  --color-border-strong: #b0a090;
  --color-focus-ring: #b07040;
  --color-overlay: rgba(30, 20, 14, 0.45);
  --color-overlay-strong: rgba(30, 20, 14, 0.65);
  --color-on-overlay: #fffaf4;
  --color-success: #4f7a59;
  --color-on-success: #f7fff8;
  --color-danger: #a34c4c;
  --color-on-danger: #fff8f8;
}

/* 20 — Velvet Noir (template21) */
body.theme-velvet-noir,
.theme-velvet-noir {
  --color-canvas: #0c0a14;
  --color-canvas-alt: #12101c;
  --color-surface: #1a1726;
  --color-surface-alt: #201d2e;
  --color-surface-raised: #242136;
  --color-surface-inverse: #f0edf5;
  --color-on-canvas: #eae6f2;
  --color-on-canvas-muted: #9e97b0;
  --color-on-surface: #eae6f2;
  --color-on-surface-muted: #9e97b0;
  --color-on-surface-subtle: #6e6880;
  --color-on-surface-inverse: #1a1726;
  --color-primary: #c9a456;
  --color-on-primary: #1a1400;
  --color-primary-hover: #b8944a;
  --color-primary-active: #a0803e;
  --color-primary-container: #2e2816;
  --color-on-primary-container: #f0e0b0;
  --color-secondary: #8a7eb8;
  --color-on-secondary: #f5f0ff;
  --color-secondary-hover: #7a6ea8;
  --color-secondary-active: #6a5e98;
  --color-secondary-container: #28244a;
  --color-on-secondary-container: #d4ccf0;
  --color-tertiary: #d4967a;
  --color-on-tertiary: #1a0e06;
  --color-tertiary-hover: #c48568;
  --color-tertiary-active: #b47458;
  --color-tertiary-container: #3a2418;
  --color-on-tertiary-container: #f0d4c4;
  --color-link: #c9a456;
  --color-link-hover: #e0bc6a;
  --color-border-subtle: #2a2640;
  --color-border: #3a3558;
  --color-border-strong: #504a70;
  --color-focus-ring: #8a7eb8;
  --color-overlay: rgba(12, 10, 20, 0.55);
  --color-overlay-strong: rgba(12, 10, 20, 0.75);
  --color-on-overlay: #f0edf5;
  --color-success: #5a9a6a;
  --color-on-success: #f0fff4;
  --color-danger: #b85454;
  --color-on-danger: #fff0f0;
}

/* 21 — Amour Grid Atelier (template22) */
body.theme-amour-grid-atelier,
.theme-amour-grid-atelier {
  --color-canvas: #f8f3ec;
  --color-canvas-alt: #f2e9dc;
  --color-surface: #ffffff;
  --color-surface-alt: #ede8e0;
  --color-surface-raised: #fffefb;
  --color-surface-inverse: #2e1e14;
  --color-on-canvas: #2e1e14;
  --color-on-canvas-muted: #7a5e4a;
  --color-on-surface: #2e1e14;
  --color-on-surface-muted: #7a5e4a;
  --color-on-surface-subtle: #a88878;
  --color-on-surface-inverse: #f8f3ec;
  --color-primary: #9e6850;
  --color-on-primary: #fff8f4;
  --color-primary-hover: #8c5a40;
  --color-primary-active: #7a4c34;
  --color-primary-container: #f0ddd4;
  --color-on-primary-container: #4a2018;
  --color-secondary: #6f7d66;
  --color-on-secondary: #f4f8f2;
  --color-secondary-hover: #5e6c55;
  --color-secondary-active: #4e5c46;
  --color-secondary-container: #dde8d8;
  --color-on-secondary-container: #2a3228;
  --color-tertiary: #c4a08a;
  --color-on-tertiary: #2a1c10;
  --color-tertiary-hover: #b08c74;
  --color-tertiary-active: #9c7860;
  --color-tertiary-container: #f0e4d8;
  --color-on-tertiary-container: #4a3028;
  --color-link: #8c5a40;
  --color-link-hover: #7a4c34;
  --color-border-subtle: #e8ddd4;
  --color-border: #d8c8bc;
  --color-border-strong: #b0988c;
  --color-focus-ring: #9e6850;
  --color-overlay: rgba(38, 24, 16, 0.42);
  --color-overlay-strong: rgba(38, 24, 16, 0.62);
  --color-on-overlay: #fff9f5;
  --color-success: #4f7a59;
  --color-on-success: #f7fff8;
  --color-danger: #a34c4c;
  --color-on-danger: #fff8f8;
}

/* 22 — Aegean Editorial (template24) */
body.theme-aegean-editorial,
.theme-aegean-editorial {
  --color-canvas: #ffffff;
  --color-canvas-alt: #f4f4f2;
  --color-surface: #ffffff;
  --color-surface-alt: #f7f7f5;
  --color-surface-raised: #ffffff;
  --color-surface-inverse: #1a2744;
  --color-on-canvas: #1a1a1a;
  --color-on-canvas-muted: #6b6b6b;
  --color-on-surface: #1a1a1a;
  --color-on-surface-muted: #777777;
  --color-on-surface-subtle: #aaaaaa;
  --color-on-surface-inverse: #f0f2f7;
  --color-primary: #1a2744;
  --color-on-primary: #f0f2f7;
  --color-primary-hover: #253560;
  --color-primary-active: #0f1a30;
  --color-primary-container: #dde3ef;
  --color-on-primary-container: #1a2744;
  --color-secondary: #8a9ab5;
  --color-on-secondary: #0f1520;
  --color-secondary-hover: #7a8aa5;
  --color-secondary-active: #6a7a95;
  --color-secondary-container: #e8ecf4;
  --color-on-secondary-container: #2a3a55;
  --color-tertiary: #c0a062;
  --color-on-tertiary: #1a1408;
  --color-tertiary-hover: #b09050;
  --color-tertiary-active: #a08040;
  --color-tertiary-container: #f0e8d0;
  --color-on-tertiary-container: #5a4820;
  --color-link: #1a2744;
  --color-link-hover: #253560;
  --color-border-subtle: #e8e8e5;
  --color-border: #d0d0cc;
  --color-border-strong: #1a2744;
  --color-focus-ring: #1a2744;
  --color-overlay: rgba(20, 30, 55, 0.45);
  --color-overlay-strong: rgba(20, 30, 55, 0.72);
  --color-on-overlay: #f5f5f3;
  --color-success: #3a6b4a;
  --color-on-success: #f0f8f2;
  --color-danger: #8b2020;
  --color-on-danger: #fff0f0;
}

/* 23 — Editorial Vogue / The Gala (template25) */
body.theme-editorial-vogue,
.theme-editorial-vogue {
  --color-canvas: #ffffff;
  --color-canvas-alt: #f8f8f8;
  --color-surface: #ffffff;
  --color-surface-alt: #000000;
  --color-surface-raised: #ffffff;
  --color-surface-inverse: #000000;
  --color-on-canvas: #000000;
  --color-on-canvas-muted: #666666;
  --color-on-surface: #000000;
  --color-on-surface-muted: #999999;
  --color-on-surface-subtle: #cccccc;
  --color-on-surface-inverse: #ffffff;
  --color-primary: #000000;
  --color-on-primary: #ffffff;
  --color-primary-hover: #333333;
  --color-primary-active: #111111;
  --color-primary-container: #eeeeee;
  --color-on-primary-container: #000000;
  --color-secondary: #000000;
  --color-on-secondary: #ffffff;
  --color-secondary-hover: #333333;
  --color-secondary-active: #111111;
  --color-secondary-container: #eeeeee;
  --color-on-secondary-container: #000000;
  --color-tertiary: #000000;
  --color-on-tertiary: #ffffff;
  --color-tertiary-hover: #333333;
  --color-tertiary-active: #111111;
  --color-tertiary-container: #eeeeee;
  --color-on-tertiary-container: #000000;
  --color-link: #000000;
  --color-link-hover: #666666;
  --color-border-subtle: #eeeeee;
  --color-border: #000000;
  --color-border-strong: #000000;
  --color-focus-ring: #000000;
  --color-overlay: rgba(0, 0, 0, 0.5);
  --color-overlay-strong: rgba(0, 0, 0, 0.8);
  --color-on-overlay: #ffffff;
  --color-success: #2d5a3d;
  --color-on-success: #f0f8f2;
  --color-danger: #8b2020;
  --color-on-danger: #fff0f0;
}

/* 24 — template23 (template23.html) */
body.theme-wedding-night,
.theme-wedding-night {
				/* Warm deep darks — candlelight, not cold tech black */
				--color-canvas: #0e0b08;
				--color-canvas-alt: #141009;
				--color-surface: #1c1510;
				--color-surface-alt: #241c14;
				--color-surface-raised: #201810;
				--color-surface-inverse: #faf5ec; /* warm parchment / ivory for footer */

				/* Warm cream text — not harsh white */
				--color-on-canvas: #f5ede0;
				--color-on-canvas-muted: #b09a84;
				--color-on-surface: #f0e8d8;
				--color-on-surface-muted: #a89278;
				--color-on-surface-subtle: #7a6650;
				--color-on-surface-inverse: #1a1208;

				/* Primary: champagne gold */
				--color-primary: #d4af7a;
				--color-on-primary: #1a0e04;
				--color-primary-hover: #e0c090;
				--color-primary-active: #c09a60;
				--color-primary-container: #2e2010;
				--color-on-primary-container: #f0d8a8;

				/* Secondary: soft blush rose */
				--color-secondary: #c4909a;
				--color-on-secondary: #f8f0f2;
				--color-secondary-hover: #d4a0aa;
				--color-secondary-active: #b07f88;
				--color-secondary-container: #2a1418;
				--color-on-secondary-container: #e8c0c8;

				/* Tertiary: dusty sage */
				--color-tertiary: #8aaa90;
				--color-on-tertiary: #0c180e;
				--color-tertiary-hover: #9abba0;
				--color-tertiary-active: #7a9a80;
				--color-tertiary-container: #14201a;
				--color-on-tertiary-container: #b8d4bc;

				/* Links / borders */
				--color-link: #d4af7a;
				--color-link-hover: #e0c090;
				--color-border-subtle: #2a2018;
				--color-border: #3a2e22;
				--color-border-strong: #5c4a34;
				--color-focus-ring: #d4af7a;

				/* Overlay */
				--color-overlay: rgba(10, 6, 2, 0.55);
				--color-overlay-strong: rgba(10, 6, 2, 0.78);
				--color-on-overlay: #f5ede0;

				/* Status */
				--color-success: #5a7a5a;
				--color-on-success: #f0fff0;
				--color-danger: #a04848;
				--color-on-danger: #fff0f0;

				/* ── Map Codrops base.css internal vars to theme tokens ── */
				--color-bg: var(--color-canvas);
				--color-text: var(--color-on-canvas);
				--color-title: var(--color-on-overlay);
			}

/* 25 — template26 (template26.html) */
body.theme-minimalist-editorial,
.theme-minimalist-editorial {
            --color-canvas: #ffffff;
            --color-canvas-alt: #f8f8f8;
            /* Bridge: #preview-content uses var(--color-canvas, var(--primary-bg)) in preview.css so preview matches theme canvas. */
            --primary-bg: var(--color-canvas);
            --secondary-bg: var(--color-canvas-alt);
            --color-surface: #ffffff;
            --color-surface-alt: #f2f2f2;
            --color-surface-raised: #ffffff;
            --color-surface-inverse: #1a1a1a;

            --color-on-canvas: #1a1a1a;
            --color-on-canvas-muted: #666666;
            --color-on-surface: #1a1a1a;
            --color-on-surface-muted: #666666;
            --color-on-surface-subtle: #999999;
            --color-on-surface-inverse: #ffffff;

            --color-primary: #1a1a1a;
            --color-on-primary: #ffffff;
            --color-primary-hover: #333333;
            --color-primary-active: #000000;
            --color-primary-container: #f0f0f0;
            --color-on-primary-container: #1a1a1a;

            --color-secondary: #c9a86a; /* Gold Accent */
            --color-on-secondary: #ffffff;
            --color-secondary-hover: #b6965a;
            --color-secondary-active: #9b7f49;
            --color-secondary-container: #f4ead6;
            --color-on-secondary-container: #5b4316;

            --color-tertiary: #e5e5e5;
            --color-on-tertiary: #1a1a1a;
            --color-tertiary-hover: #d4d4d4;
            --color-tertiary-active: #a3a3a3;
            --color-tertiary-container: #f5f5f5;
            --color-on-tertiary-container: #1a1a1a;

            --color-link: #1a1a1a;
            --color-link-hover: #c9a86a;
            --color-border-subtle: #eeeeee;
            --color-border: #dddddd;
            --color-border-strong: #1a1a1a;
            --color-focus-ring: #c9a86a;

            --color-overlay: rgba(0, 0, 0, 0.4);
            --color-overlay-strong: rgba(0, 0, 0, 0.6);
            --color-on-overlay: #ffffff;

            --font-body: 'Inter', sans-serif;
            --font-heading: 'Playfair Display', serif;

            background-color: var(--color-canvas);
            color: var(--color-on-canvas);
            font-family: var(--font-body);
            scroll-behavior: smooth;
        }

/* 26 — template27 (template27.html) */
body.theme-greenhouse-minimal,
.theme-greenhouse-minimal {
            --color-canvas: #fdfcf0; /* Eggshell White */
            --color-canvas-alt: #f4f6f0; /* Soft Leafy Tint */
            --color-surface: #ffffff;
            --color-surface-alt: #eef2e8;
            --color-surface-raised: #ffffff;
            --color-surface-inverse: #1b3022; /* Deep Forest */

            --color-on-canvas: #1b3022;
            --color-on-canvas-muted: #5a6b5d;
            --color-on-surface: #1b3022;
            --color-on-surface-muted: #6d7d70;
            --color-on-surface-subtle: #a4b2a8;
            --color-on-surface-inverse: #fdfcf0;

            --color-primary: #4a6741; /* Mossy Green */
            --color-on-primary: #ffffff;
            --color-primary-hover: #3d5536;
            --color-primary-active: #2e4129;
            --color-primary-container: #e4f0e8; /* Pale Mint */
            --color-on-primary-container: #1b3022;

            --color-secondary: #94a684; /* Sage */
            --color-on-secondary: #ffffff;
            --color-secondary-hover: #839474;
            --color-secondary-active: #728265;
            --color-secondary-container: #f0f4eb;
            --color-on-secondary-container: #2e3b2a;

            --color-tertiary: #d4c4a8; /* Champagne / Warm Sand */
            --color-on-tertiary: #2d2210;
            --color-tertiary-hover: #c2b195;
            --color-tertiary-active: #af9f82;
            --color-tertiary-container: #f7f2e9;
            --color-on-tertiary-container: #4a3b24;

            --color-link: #4a6741;
            --color-link-hover: #1b3022;
            --color-border-subtle: #e2e8da;
            --color-border: #c8d1bc;
            --color-border-strong: #94a684;
            --color-focus-ring: #94a684;

            --color-overlay: rgba(27, 48, 34, 0.3);
            --color-overlay-strong: rgba(27, 48, 34, 0.6);
            --color-on-overlay: #ffffff;

            --font-body: 'Jost', sans-serif;
            --font-heading: 'Cormorant Garamond', serif;

            background-color: var(--color-canvas);
            color: var(--color-on-canvas);
            font-family: var(--font-body);
        }

/* 27 — template28 (template28.html) */
body.theme-mission-control,
.theme-mission-control {
            --color-canvas: #f4f4f4;
            --color-canvas-alt: #e8e8ea;
            --color-surface: #ffffff;
            --color-surface-alt: #ececee;
            --color-surface-raised: #fafafa;
            --color-surface-inverse: #0f172a;

            --color-on-canvas: #1a1a1a;
            --color-on-canvas-muted: #64748b;
            --color-on-surface: #171717;
            --color-on-surface-muted: #64748b;
            --color-on-surface-subtle: #94a3b8;
            --color-on-surface-inverse: #f1f5f9;

            --color-primary: #ff5f00;
            --color-on-primary: #ffffff;
            --color-primary-hover: #e55500;
            --color-primary-active: #cc4a00;
            --color-primary-container: #ffdcc4;
            --color-on-primary-container: #5c2400;

            --color-secondary: #94a3b8;
            --color-on-secondary: #0f172a;
            --color-secondary-hover: #7c8d9f;
            --color-secondary-active: #64748b;
            --color-secondary-container: #e2e8f0;
            --color-on-secondary-container: #1e293b;

            --color-tertiary: #0ea5e9;
            --color-on-tertiary: #082f49;
            --color-tertiary-hover: #0284c7;
            --color-tertiary-active: #0369a1;
            --color-tertiary-container: #e0f2fe;
            --color-on-tertiary-container: #0c4a6e;

            --color-link: #0369a1;
            --color-link-hover: #0c4a6e;
            --color-border-subtle: #e5e7eb;
            --color-border: #d1d5db;
            --color-border-strong: #64748b;
            --color-focus-ring: #0ea5e9;

            --color-overlay: rgba(15, 23, 42, 0.48);
            --color-overlay-strong: rgba(15, 23, 42, 0.68);
            --color-on-overlay: #f8fafc;

            --color-success: #15803d;
            --color-on-success: #f0fdf4;
            --color-danger: #b91c1c;
            --color-on-danger: #fef2f2;

            --font-body: 'JetBrains Mono', ui-monospace, monospace;
            --font-heading: 'Space Grotesk', system-ui, sans-serif;

            /* Bridge: section pickers & fallbacks use --primary-bg / --primary-text on #preview-content (preview.css). */
            --primary-bg: var(--color-canvas);
            --secondary-bg: var(--color-canvas-alt);
            --accent-bg: var(--color-surface-alt);
            --primary-text: var(--color-on-canvas);
            --secondary-text: var(--color-on-canvas-muted);
            --accent-text: var(--color-on-surface);
            --border-color: var(--color-border);

            background-color: var(--color-canvas);
            color: var(--color-on-canvas);
            font-family: var(--font-body);
        }

/* 28 — template29 (template29.html) */
body.theme-classic-ballroom,
.theme-classic-ballroom {
            --color-canvas: #ffffff;
            --color-canvas-alt: #f9f9f9;
            --color-surface: #ffffff;
            --color-surface-alt: #f5f5f5;
            --color-surface-raised: #ffffff;
            --color-surface-inverse: #1a1a1a;
            --color-on-canvas: #1a1a1a;
            --color-on-canvas-muted: #666666;
            --color-on-surface: #1a1a1a;
            --color-on-surface-muted: #666666;
            --color-on-surface-subtle: #999999;
            --color-on-surface-inverse: #ffffff;
            --color-primary: #d4af37;
            --color-on-primary: #ffffff;
            --color-primary-hover: #b8962e;
            --color-primary-active: #9c7f27;
            --color-primary-container: #fdf6e3;
            --color-on-primary-container: #5d4a1b;
            --color-secondary: #333333;
            --color-on-secondary: #ffffff;
            --color-secondary-hover: #222222;
            --color-secondary-active: #111111;
            --color-secondary-container: #eeeeee;
            --color-on-secondary-container: #333333;
            --color-tertiary: #a67c52;
            --color-on-tertiary: #ffffff;
            --color-tertiary-hover: #8e6a46;
            --color-tertiary-active: #76583a;
            --color-tertiary-container: #f5ede4;
            --color-on-tertiary-container: #4a3728;
            --color-link: #d4af37;
            --color-link-hover: #b8962e;
            --color-border-subtle: #eeeeee;
            --color-border: #dddddd;
            --color-border-strong: #aaaaaa;
            --color-focus-ring: #d4af37;
            --color-overlay: rgba(0, 0, 0, 0.5);
            --color-overlay-strong: rgba(0, 0, 0, 0.7);
            --color-on-overlay: #ffffff;
            --color-success: #2e7d32;
            --color-on-success: #ffffff;
            --color-danger: #c62828;
            --color-on-danger: #ffffff;
            --font-body: 'Montserrat', sans-serif;
            --font-heading: 'Playfair Display', serif;
            --font-script: 'Great Vibes', cursive;
        }

/* 29 — template30 (template30.html) */
body.theme-romantic-floral,
.theme-romantic-floral {
            --color-canvas: #ffffff;
            --color-canvas-alt: #fff9fa;
            --color-surface: #ffffff;
            --color-surface-alt: #fdf2f4;
            --color-surface-raised: #ffffff;
            --color-surface-inverse: #333333;
            --color-on-canvas: #4a4a4a;
            --color-on-canvas-muted: #888888;
            --color-on-surface: #4a4a4a;
            --color-on-surface-muted: #888888;
            --color-on-surface-subtle: #aaaaaa;
            --color-on-surface-inverse: #ffffff;
            --color-primary: #e68fa3;
            --color-on-primary: #ffffff;
            --color-primary-hover: #d17a8e;
            --color-primary-active: #bc6579;
            --color-primary-container: #ffeef2;
            --color-on-primary-container: #7a3a4a;
            --color-secondary: #f8bbd0;
            --color-on-secondary: #4a4a4a;
            --color-secondary-hover: #e3a6bb;
            --color-secondary-active: #ce91a6;
            --color-secondary-container: #fff0f5;
            --color-on-secondary-container: #8c4a5e;
            --color-tertiary: #f4d1d1;
            --color-on-tertiary: #4a4a4a;
            --color-tertiary-hover: #dfbcbc;
            --color-tertiary-active: #caa7a7;
            --color-tertiary-container: #fff5f5;
            --color-on-tertiary-container: #8c4a4a;
            --color-link: #e68fa3;
            --color-link-hover: #d17a8e;
            --color-border-subtle: #f8e6ea;
            --color-border: #f1d1d8;
            --color-border-strong: #e68fa3;
            --color-focus-ring: #e68fa3;
            --color-overlay: rgba(255, 255, 255, 0.4);
            --color-overlay-strong: rgba(255, 255, 255, 0.7);
            --color-on-overlay: #4a4a4a;
            --color-success: #4f7a59;
            --color-on-success: #f7fff8;
            --color-danger: #a34c4c;
            --color-on-danger: #fff8f8;
            --font-heading: 'Playfair Display', serif;
            --font-body: 'Inter', sans-serif;
            --font-script: 'Great Vibes', cursive;
        }

/* 30 — template31 (template31.html) */
body.theme-rustic-barn,
.theme-rustic-barn {
            --color-canvas: #f4f1ea;
            --color-canvas-alt: #e9e4d9;
            --color-surface: #ffffff;
            --color-surface-alt: #f0ede5;
            --color-surface-raised: #ffffff;
            --color-surface-inverse: #4a3728;
            --color-on-canvas: #3d2b1f;
            --color-on-canvas-muted: #6b5a4d;
            --color-on-surface: #3d2b1f;
            --color-on-surface-muted: #6b5a4d;
            --color-on-surface-subtle: #9c8b7c;
            --color-on-surface-inverse: #f4f1ea;
            --color-primary: #5a6a40;
            --color-on-primary: #ffffff;
            --color-primary-hover: #4a5a30;
            --color-primary-active: #3a4a20;
            --color-primary-container: #e6ede1;
            --color-on-primary-container: #364030;
            --color-secondary: #8c6a4d;
            --color-on-secondary: #ffffff;
            --color-secondary-hover: #7a5a3d;
            --color-secondary-active: #684a2d;
            --color-secondary-container: #f5ede4;
            --color-on-secondary-container: #4a3728;
            --color-tertiary: #d4a373;
            --color-on-tertiary: #3d2b1f;
            --color-tertiary-hover: #c18e5e;
            --color-tertiary-active: #a67a4d;
            --color-tertiary-container: #faedcd;
            --color-on-tertiary-container: #5d3121;
            --color-link: #5a6a40;
            --color-link-hover: #4a5a30;
            --color-border-subtle: #e0d9cc;
            --color-border: #ccc2b1;
            --color-border-strong: #9c8b7c;
            --color-focus-ring: #5a6a40;
            --color-overlay: rgba(61, 43, 31, 0.3);
            --color-overlay-strong: rgba(61, 43, 31, 0.5);
            --color-on-overlay: #ffffff;
            --color-success: #5a6a40;
            --color-on-success: #ffffff;
            --color-danger: #a34c4c;
            --color-on-danger: #ffffff;
            --font-body: 'Inter', sans-serif;
            --font-heading: 'Libre Baskerville', serif;
            --font-typewriter: 'Special Elite', cursive;
        }

/* 31 — template32 (template32.html) */
body.theme-warm-editorial,
.theme-warm-editorial {
            --color-canvas: #faf7f4;
            --color-canvas-alt: #f3ede7;
            --color-surface: #ffffff;
            --color-surface-alt: #f5f0eb;
            --color-surface-raised: #fffdfb;
            --color-surface-inverse: #2a2320;
            --color-on-canvas: #2c2520;
            --color-on-canvas-muted: #7a6e63;
            --color-on-surface: #2a231d;
            --color-on-surface-muted: #7a6e63;
            --color-on-surface-subtle: #a09387;
            --color-on-surface-inverse: #f9f4ef;
            --color-primary: #9e7356;
            --color-on-primary: #fffaf6;
            --color-primary-hover: #8a6349;
            --color-primary-active: #74533d;
            --color-primary-container: #eeddd0;
            --color-on-primary-container: #5b3a24;
            --color-secondary: #7a8b6e;
            --color-on-secondary: #fbfdf9;
            --color-secondary-hover: #6a7b5f;
            --color-secondary-active: #5a6a52;
            --color-secondary-container: #e0e9d9;
            --color-on-secondary-container: #364030;
            --color-tertiary: #c4a87a;
            --color-on-tertiary: #2d2210;
            --color-tertiary-hover: #b19668;
            --color-tertiary-active: #9b7f55;
            --color-tertiary-container: #f2e8d4;
            --color-on-tertiary-container: #5b4316;
            --color-link: #8a6349;
            --color-link-hover: #74533d;
            --color-border-subtle: #ebe2d9;
            --color-border: #d9cdc2;
            --color-border-strong: #b0a191;
            --color-focus-ring: #9e7356;
            --color-overlay: rgba(42, 35, 32, 0.45);
            --color-overlay-strong: rgba(42, 35, 32, 0.68);
            --color-on-overlay: #fffaf5;
            --color-success: #4f7a59;
            --color-on-success: #f7fff8;
            --color-danger: #a34c4c;
            --color-on-danger: #fff8f8;
            --font-heading: 'Cormorant Garamond', serif;
            --font-body: 'Outfit', sans-serif;
        }

/* Compatibility bridge: maps --color-* contract tokens (defined by each
   body.theme-* or #preview-content.theme-* class) to the legacy variable names
   used by the background picker, utility classes (.bg-themed-primary, etc.),
   and .form-group. Preview puts the theme on #preview-content (setTemplateStyles),
   not on body. Custom themes (body.custom-theme-*) define these legacy vars
   directly; injected <style> overrides this block in the cascade. */
body[class*="theme-"],
#preview-content[class*="theme-"] {
  --primary-bg: var(--color-canvas);
  --secondary-bg: var(--color-canvas-alt);
  --accent-bg: var(--color-surface-alt);
  --primary-text: var(--color-on-canvas);
  --secondary-text: var(--color-on-canvas-muted);
  --accent-text: var(--color-on-surface);
  --primary-accent: var(--color-primary);
  --primary-accent-soft: var(--color-primary-container);
  --secondary-accent: var(--color-secondary);
  --border-color: var(--color-border);
  --shadow-color: rgba(0, 0, 0, 0.08);
  --gradient-1: linear-gradient(135deg, var(--color-canvas) 0%, var(--color-canvas-alt) 100%);
  --gradient-2: linear-gradient(135deg, var(--color-primary) 0%, var(--color-secondary) 100%);
  --features2-bg: linear-gradient(135deg, var(--color-surface) 0%, var(--color-surface-alt) 100%);
  --button-on-gradient: var(--color-on-primary);
  --button-on-gradient-border: var(--color-on-primary);
  --font-family: var(--font-body, "Inter", system-ui, sans-serif);
  --heading-font: var(--font-heading, "Cormorant Garamond", Georgia, serif);
  --border-radius: var(--radius-sm, 0.5rem);
  --button-radius: var(--radius-md, 1rem);
  --card-radius: var(--radius-lg, 1.5rem);
  --spacing-unit: var(--space-4, 1rem);
}

/* [DISABLED_FOR_WEDDING_VERSION]: Legacy wedding palettes removed.
   Official themes are defined above (source: templates/css/wedding-themes-reference.css). */

/* [DISABLED_FOR_WEDDING_VERSION]: Legacy body base styles disabled.
   New templates define body styles using --color-* contract tokens directly. */
/*
body {
  background-color: var(--primary-bg);
  color: var(--primary-text);
  font-family: var(--font-family);
  transition: all 0.3s ease;
  line-height: 1.6;
}
*/

.bg-themed-primary { background-color: var(--primary-bg); }
.bg-themed-secondary { 
  background-color: var(--secondary-bg);
  box-shadow: var(--section-shadow, none);
}
.bg-themed-accent { 
  background-color: var(--accent-bg);
  box-shadow: var(--section-shadow, none);
}
.text-on-primary { color: var(--primary-bg); }
.text-themed-primary { color: var(--primary-text); }
.text-themed-secondary { color: var(--secondary-text); }
.text-themed-accent { color: var(--accent-text); }
.text-themed-primary-accent { color: var(--primary-accent); }
.border-themed { border-color: var(--border-color); }
.primary-bg { background-color: var(--primary-bg); }

.gradient-themed-1 { 
  background: var(--gradient-1);
}

.gradient-themed-2 { 
  background: var(--gradient-2);
}

.bg-features2-themed {
  background: var(--features2-bg);
}

.btn-themed {
  background: var(--primary-accent);
  color: var(--primary-bg);
  border-radius: var(--button-radius);
  padding: calc(var(--spacing-unit) * 0.75) calc(var(--spacing-unit) * 1.5);
  font-family: var(--font-family);
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: var(--shadow-sm);
  text-decoration: none;
  font-size: 0.95rem;
  letter-spacing: 0.025em;
}

.btn-themed:hover {
  background: var(--secondary-accent);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

.btn-themed-outline {
  background: transparent;
  color: var(--primary-accent);
  border: 2px solid var(--primary-accent);
  border-radius: var(--button-radius);
  padding: calc(var(--spacing-unit) * 0.75) calc(var(--spacing-unit) * 1.5);
  font-family: var(--font-family);
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  text-decoration: none;
  /* display: inline-block; */
  font-size: 0.95rem;
  letter-spacing: 0.025em;
}

.btn-themed-outline:hover {
  background: var(--primary-accent);
  color: var(--primary-bg);
  transform: translateY(-2px);
}

.card-themed {
  background: var(--secondary-bg);
  border: 1px solid var(--border-color);
  border-radius: var(--card-radius);
  padding: calc(var(--spacing-unit) * 2);
  box-shadow: var(--card-shadow, var(--shadow-sm));
  transition: all 0.3s ease;
  position: relative;
}

/* Reduced padding for step cards */
#fp-theme-step-cards .card-themed {
  padding: calc(var(--spacing-unit) * 1);
}

.card-themed:hover {
  box-shadow: var(--card-shadow-hover, var(--shadow-md));
  transform: translateY(-4px);
}

.card-themed-thin {
  background: var(--secondary-bg);
  border-radius: var(--card-radius);
  padding: calc(var(--spacing-unit) * 1);
  box-shadow: var(--card-shadow, var(--shadow-sm));
  transition: all 0.3s ease;
  position: relative;
}

.heading-themed {
  font-family: var(--heading-font);
  color: var(--accent-text);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.025em;
}

/* Base form styles that respond to theme */
.form-group label {
  color: var(--secondary-text);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.form-group input,
.form-group select,
.form-group textarea {
  border-bottom: 1px solid var(--border-color);
  color: var(--primary-text);
  background: transparent;
  font-family: var(--font-family);
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  border-bottom-color: var(--primary-accent);
}

/* RSVP sections set foreground on <section> (e.g. inverse palette). Do not force body canvas tokens onto labels/controls. */
section[data-section-type="rsvp"] .form-group label {
  color: inherit;
}

section[data-section-type="rsvp"] .form-group input,
section[data-section-type="rsvp"] .form-group select,
section[data-section-type="rsvp"] .form-group textarea {
  color: inherit;
}

section[data-section-type="rsvp"] .form-group input:focus,
section[data-section-type="rsvp"] .form-group select:focus,
section[data-section-type="rsvp"] .form-group textarea:focus {
  border-bottom-color: var(--color-primary);
}

.btn-rsvp {
  border: 1px solid var(--primary-accent);
  color: var(--primary-accent);
  background: transparent;
}

.btn-rsvp:hover {
  background: var(--primary-accent);
  color: var(--primary-bg);
}

/* Theme selector styles */
.theme-selector {
  position: fixed;
  top: 100px;
  right: 20px;
  z-index: 1000;
  background: var(--primary-bg);
  border: 1px solid var(--border-color);
  border-radius: var(--card-radius);
  padding: calc(var(--spacing-unit) * 1.5);
  box-shadow: var(--card-shadow, var(--shadow-lg));
  min-width: 220px;
  max-height: 60vh; /* Limit height to 60% of viewport */
  overflow: hidden; /* Changed from overflow-y: auto */
  transition: max-height 0.3s ease, padding 0.3s ease;
}

.theme-selector.collapsed {
  max-height: 60px;
  padding: calc(var(--spacing-unit) * 1);
}

.theme-selector-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  margin: 0;
}

.theme-selector-toggle h3 {
  margin: 0;
}

.theme-selector-chevron {
  transition: transform 0.3s ease;
}

.theme-selector.collapsed .theme-selector-chevron {
  transform: rotate(-90deg);
}

.theme-selector-content {
  margin-top: calc(var(--spacing-unit) * 1);
  max-height: calc(60vh - 60px);
  overflow-y: auto;
  transition: opacity 0.3s ease, max-height 0.3s ease;
}

.theme-selector.collapsed .theme-selector-content {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  margin-top: 0;
}

.theme-button {
  display: block;
  width: 100%;
  padding: calc(var(--spacing-unit) * 0.75);
  margin-bottom: calc(var(--spacing-unit) * 0.5);
  background: var(--accent-bg);
  color: var(--primary-text);
  border: 1px solid var(--border-color);
  border-radius: var(--button-radius);
  cursor: pointer;
  font-family: var(--font-family);
  font-size: 0.9rem;
  font-weight: 500;
  transition: all 0.2s ease;
  text-align: left;
  box-shadow: var(--card-shadow, none);
}

.theme-button:hover {
  background: var(--primary-accent);
  color: var(--primary-bg);
  transform: translateY(-1px);
}

.theme-button.active {
  background: var(--primary-accent);
  color: var(--primary-bg);
  font-weight: 600;
  box-shadow: var(--shadow-sm);
}

.feature-tab {
  color: var(--primary-text);
  border: 1px solid var(--border-color);
}

.feature-tab:hover {
  background: var(--accent-bg);
  border-color: var(--primary-accent);
}

.feature-tab:hover span,
.feature-tab:hover svg,
.feature-tab:hover svg *{
  color: var(--primary-text) !important;
}

.feature-tab.active,
.feature-tab.active:hover span,
.feature-tab.active:hover svg,
.feature-tab.active:hover svg *
{
  background: var(--primary-accent);
  color: var(--primary-bg) !important;
  border-color: var(--primary-accent);
  box-shadow: 0 10px 25px -5px rgba(var(--primary-accent-rgb), 0.3);
}

/* Background Images Toggle Styles */
.theme-selector label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}

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

.theme-selector .relative {
  position: relative;
}

.theme-selector .block {
  display: block;
  width: 3.5rem;
  height: 2rem;
  border-radius: 9999px;
  transition: background-color 0.2s;
}

.theme-selector .dot {
  position: absolute;
  left: 0.25rem;
  top: 0.25rem;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 9999px;
  background-color: white;
  transition: transform 0.2s;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* Background Wrapper Styles */
.fp-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none; /* Allow clicks to pass through to content */
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /* animation: fpBgFadeIn 0.6s ease-in-out; */
  transition: transform 0.3s ease, opacity 0.3s ease;
  display: none; /* Hidden by default */
}

/* Show .fp-bg when section has has-bg-image class */
footer.has-bg-image .fp-bg,
section.has-bg-image .fp-bg {
  display: block;
}

/* Apply position:relative to the next sibling of .fp-bg */
.fp-bg + *:not(.absolute) {
  position: relative;
}

.fp-bg::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, var(--overlay-opacity, 0.6));
  z-index: 1;
  transition: background-color 0.3s ease;
}

/* Overlay for sections where the background image sits on the section element itself
   (data-bg="true"), as opposed to being on a .fp-bg child element.
   This includes sections promoted from full-template divs (e.g. .parallax-quote)
   AND normal sections whose background was set via Cloudinary directly on the section.
   The !important overrides any hardcoded rgba() in template CSS ::before rules.
   The high specificity (section.section[attr]) ensures it beats class-only template rules. */
section.section[data-bg="true"] {
  position: relative;
}
section.section[data-bg="true"]::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, var(--overlay-opacity, 0.6)) !important;
  pointer-events: none;
  transition: background-color 0.3s ease;
}

@keyframes fpBgFadeIn {
  from {
    opacity: 0;
    transform: scale(1.1);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

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

footer.has-bg-image,
section.has-bg-image {
  position: relative;
  overflow: hidden;
}

/* White text styles when background images are enabled */
/* Apply white text to all elements in .fp-bg-content */
section.has-bg-image :where(*:not(svg):not(svg *):not(.fp-keep-color):not(.fp-keep-color *):not(.section-menu *):not(.btn-themed):not(.btn-gold):not(.btn-gold *)),
footer.has-bg-image :where(*:not(svg):not(svg *):not(.fp-keep-color):not(.fp-keep-color *):not(.section-menu *):not(.btn-themed):not(.btn-gold):not(.btn-gold *)) {
  color: white !important;
}

/*
 * Native <select> lists are often OS-themed with a light surface; <option> still inherits
 * color from <select>, which matches the rule above → white on white. Override after that rule.
 */
section.has-bg-image select option,
footer.has-bg-image select option,
section.has-bg-image select optgroup,
footer.has-bg-image select optgroup {
  color: #111827 !important;
  background-color: #ffffff !important;
}

section.has-bg-image select option:disabled,
footer.has-bg-image select option:disabled {
  color: #6b7280 !important;
}

/*
 * RSVP companion / decline-companion: <select> is often styled with light/inverse text on dark
 * cards; native <option> lists usually use a light surface but still inherit the control color,
 * which yields unreadable options (same class of bug as has-bg-image selects above).
 */
section[data-section-type="rsvp"] :is(.companion-card, .companion-card-fields, .decline-companion-card) .form-group > select option,
section[data-section-type="rsvp"] :is(.companion-card, .companion-card-fields, .decline-companion-card) .form-group > select optgroup {
  color: var(--color-on-surface, #111827);
  background-color: var(--color-surface, #ffffff);
}

section[data-section-type="rsvp"] :is(.companion-card, .companion-card-fields, .decline-companion-card) .form-group > select option:disabled {
  color: var(--color-on-surface-muted, #6b7280);
}

/* Exclude SVG descendants from white text */
section.has-bg-image svg *,
footer.has-bg-image svg *{
  color: revert !important;
}


/* Exclude heading-themed - preserve original colors */
section.has-bg-image > .heading-themed,
section.has-bg-image > .heading-themed *,
footer.has-bg-image > .heading-themed,
footer.has-bg-image > .heading-themed * {
  color: revert !important;
}

section.has-bg-image .btn-themed-outline,
footer.has-bg-image .btn-themed-outline{
  border-color: white !important;
}
section.has-bg-image .card-themed .btn-themed-outline,
footer.has-bg-image .card-themed .btn-themed-outline{
  border-color:var(--primary-accent) !important;
  color: var(--primary-accent) !important;
}



section.has-bg-image .fp-keep-color .heading-themed,
section.has-bg-image .fp-keep-color .heading-themed *,
section.has-bg-image .card-themed .heading-themed,
section.has-bg-image .card-themed .heading-themed * {
  color: var(--accent-text) !important;
}

section.has-bg-image .fp-keep-color .text-themed-primary,
section.has-bg-image .fp-keep-color .text-themed-primary *,
section.has-bg-image .card-themed .text-themed-primary,
section.has-bg-image .card-themed .text-themed-primary * {
  color: var(--primary-text) !important;
}

section.has-bg-image .fp-keep-color .text-themed-secondary,
section.has-bg-image .fp-keep-color .text-themed-secondary *,
section.has-bg-image .card-themed .text-themed-secondary,
section.has-bg-image .card-themed .text-themed-secondary * {
  color: var(--secondary-text) !important;
}

section.has-bg-image .fp-keep-color .text-themed-accent,
section.has-bg-image .fp-keep-color .text-themed-accent *,
section.has-bg-image .card-themed .text-themed-accent,
section.has-bg-image .card-themed .text-themed-accent * {
  color: var(--accent-text) !important;
}



/* Animation keyframes */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

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

.animate-fade-in-up {
  animation: fadeInUp 0.6s ease-out;
}

.animate-scroll {
  animation: scroll 20s linear infinite;
}

.slider {
  width: 100%;
  overflow: hidden;
  mask: linear-gradient(to right, transparent, black 20%, black 80%, transparent);
  -webkit-mask: linear-gradient(to right, transparent, black 20%, black 80%, transparent);
}

.slide-track {
  width: fit-content;
}

/* Enhanced typography (scope to fp-theme generated sections only) */
#preview-content section[id^="fp-theme-"] h1,
#preview-content section[id^="fp-theme-"] h2,
#preview-content section[id^="fp-theme-"] h3,
#preview-content section[id^="fp-theme-"] h4,
#preview-content section[id^="fp-theme-"] h5,
#preview-content section[id^="fp-theme-"] h6 {
  font-family: var(--heading-font);
  color: var(--accent-text);
  line-height: 1.2;
  letter-spacing: -0.025em;
}

/* Responsive improvements */
@media (max-width: 768px) {
  .theme-selector {
    right: 10px;
    top: 80px;
    min-width: 180px;
  }
}

/* Feature icon styles */
.feature-icon {
  width: 32px;
  height: 32px;
  margin: 0 auto 1rem;
  fill: var(--primary-accent);
  transition: all 0.3s ease;
}

.feature-card:hover .feature-icon {
  fill: var(--secondary-accent);
  transform: scale(1.1);
}

/* Dark theme specific enhancements */
.theme-dark-modern .card-themed::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(139, 92, 246, 0.4), transparent);
  opacity: 0.8;
}


/* Enhanced card visibility for dark modern theme */
.theme-dark-modern .card-themed {
  background: linear-gradient(135deg, rgba(36, 43, 61, 0.95) 0%, rgba(26, 31, 46, 0.95) 100%);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(139, 92, 246, 0.15);
}

.theme-dark-modern .card-themed:hover {
  background: linear-gradient(135deg, rgba(36, 43, 61, 1) 0%, rgba(26, 31, 46, 1) 100%);
  border: 1px solid rgba(139, 92, 246, 0.3);
}

/* Dark theme specific overrides for pricing sections - only when body has dark theme */
body.theme-dark-modern .card-themed {
  background: var(--secondary-bg);
  border: 1px solid rgba(139, 92, 246, 0.15);
  color: var(--primary-text);
}

body.theme-dark-modern .bg-yellow-50,
body.theme-dark-modern .bg-purple-50,
body.theme-dark-modern .bg-blue-50 {
  background-color: var(--secondary-bg) !important;
  color: var(--primary-text) !important;
}

body.theme-dark-modern .bg-blue-600 {
  background: var(--gradient-2) !important;
}

body.theme-dark-modern .bg-black {
  background: var(--primary-accent) !important;
}

body.theme-dark-modern .text-gray-400 {
  color: var(--primary-accent) !important;
}

body.theme-dark-modern .text-green-500 {
  color: var(--primary-accent) !important;
}

body.theme-dark-modern .text-blue-400 {
  color: var(--primary-accent) !important;
}

body.theme-dark-modern .border-2,
body.theme-dark-modern .border-dashed {
  border-color: rgba(139, 92, 246, 0.3) !important;
}

/* Fix check icons to use theme colors */
.text-gray-400 {
  color: var(--primary-accent) !important;
}

.text-blue-400 {
  color: var(--primary-accent) !important;
}

/* Override specific theme sections ONLY when dark modern is globally active */
body.theme-dark-modern .theme-corporate-clean,
body.theme-dark-modern .theme-playful-colorful,
body.theme-dark-modern .theme-elegant-serif {
  --primary-bg: #0a0a0f;
  --secondary-bg: #1a1f2e;
  --accent-bg: #242b3d;
  --primary-text: #e4e6ea;
  --secondary-text: #b0b3b8;
  --accent-text: #ffffff;
  --primary-accent: #8b5cf6;
  --secondary-accent: #7c3aed;
}

/* Features 2 section specific styles */
.features2-icon {
  width: 48px;
  height: 48px;
  stroke: white;
  stroke-width: 1.5;
  margin-bottom: 1.5rem;
}

.features2-card {
  text-align: center;
  max-width: 280px;
  margin: 0 auto;
}

.features2-title {
  font-size: 1.5rem;
  font-weight: 600;
  color: white;
  margin-bottom: 1rem;
  font-family: var(--heading-font);
}

.features2-description {
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.6;
  font-size: 1rem;
}

/* Play button styles for inspiration section */
.play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80px;
  height: 80px;
  background: rgba(255, 255, 255, 0.95);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(10px);
}

.play-button:hover {
  transform: translate(-50%, -50%) scale(1.1);
  box-shadow: 0 12px 35px rgba(0, 0, 0, 0.3);
}

.play-button i {
  color: var(--primary-accent);
  width: 32px;
  height: 32px;
  margin-left: 4px;
}

.inspiration-image {
  position: relative;
  overflow: hidden;
  border-radius: var(--card-radius);
  box-shadow: var(--shadow-lg);
  transition: all 0.3s ease;
}

.inspiration-image:hover {
  transform: translateY(-8px);
  box-shadow: var(--shadow-lg);
}

.inspiration-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.inspiration-image:hover img {
  transform: scale(1.05);
}

.section .fp-overflow {
  width: 100dvw;
}
.section-outline-content .section .fp-overflow {
  width: 100%;
}

/* For footers on the editor */ 
.fp-auto-height .fp-slide, 
.fp-auto-height.fp-section{
  min-height: auto !important;
}

/* Interactive Testimonials */
.testimonial-author-card {
  border: 2px solid transparent;
  transition: all 0.3s ease;
}

.testimonial-author-card.active {
  background: var(--secondary-bg) !important;
  border-color: var(--accent);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}
.has-bg-image .testimonial-author-card.active {
  background-color: var(--primary-accent-soft) !important;
}

.testimonial-author-card:hover {
  transform: translateX(8px);
}

/* Popular Questions FAQ */
[data-faq-category] {
  cursor: pointer;
  transition: all 0.3s ease;
}

[data-faq-category]:not(.active-category):hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md) !important;
}

[data-faq-category].active-category {
  background: var(--primary-accent) !important;
  box-shadow: var(--shadow-lg) !important;
  border: none !important;
}

[data-faq-category].active-category h3,
[data-faq-category].active-category p {
  color: var(--primary-bg) !important;
}

[data-faq-category].active-category i {
  color: var(--primary-bg) !important;
}

.faq-answer {
  transition: all 0.3s ease;
}

/* Fix for FAQ items width when accordion opens */
.faq-item {
  width: 100%;
  overflow: hidden;
  cursor: pointer;
  transition: all 0.2s ease;
}

.faq-item:hover {
  box-shadow: var(--shadow-md) !important;
  transform: translateY(-2px);
}

.faq-item h3,
.faq-item p {
  word-wrap: break-word;
  overflow-wrap: break-word;
  word-break: break-word;
  max-width: 100%;
}

.faq-answer {
  width: 100%;
  max-width: 100%;
  overflow-wrap: break-word;
  word-wrap: break-word;
}

.faq-chevron {
  transition: transform 0.3s ease !important;
}

/* Testimonial author card hover effect */
.testimonial-author-card:hover {
  background-color: var(--primary-accent-soft) !important;
}

/* FAQ Questions & Answers section - prevent width change */
#fp-theme-questions-answers .p-6 {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

#fp-theme-questions-answers button {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

#fp-theme-questions-answers h3 {
  width: 100%;
  max-width: 100%;
  word-wrap: break-word;
  overflow-wrap: break-word;
  word-break: break-word;
}

#fp-theme-questions-answers p {
  width: 100%;
  max-width: 100%;
  word-wrap: break-word;
  overflow-wrap: break-word;
  word-break: break-word;
}

#fp-theme-questions-answers div[class*="mt-4"] {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

/* ========================================
   ANIMATION SYSTEM
   ======================================== */

/* Animation system - CSS only */
/* Elements are hidden by default when animations are enabled */
.animations-enabled .section h1,
.animations-enabled .section h2,
.animations-enabled .section h3,
.animations-enabled .section h4,
.animations-enabled .section h5,
.animations-enabled .section h6,
.animations-enabled .section p:not(a > p),
.animations-enabled .section a:not(p > a),
.animations-enabled .section img,
.animations-enabled .section form,
.animations-enabled .section label,
.animations-enabled .section input,
.animations-enabled .section textarea,
.animations-enabled .section button,
.animations-enabled .section iframe,
.animations-enabled .section .animate-element, 
.animations-enabled .section [data-fp-anim-children] > *{
  opacity: 0;
  transform: translate3d(0, 50px, 0);
}

/* To allow the :hover on editable elements to show the outline-offset 2px */
.fp-overflow {
  padding: 4px 0;
  overflow: hidden;
}

/* Hack to avoid creating a scrollable content when the slide in animations 
 * for the content still not finished */
.fp-completely .fp-overflow {
  overflow: hidden;
  animation: fpOverflowReveal 0s linear 0.7s forwards;
}

@keyframes fpOverflowReveal {
  to {
    overflow: auto;
  }
}

/* Exclude TinyMCE elements from initial hiding */
.animations-enabled .section .tox-tinymce,
.animations-enabled .section .tox-tinymce *,
.animations-enabled .section .tox-toolbar,
.animations-enabled .section .tox-toolbar *,
.animations-enabled .section .tox-editor-header,
.animations-enabled .section .tox-editor-header *,
.animations-enabled .section .tox-menubar,
.animations-enabled .section .tox-menubar *,
.animations-enabled .section .tox-toolbar__primary,
.animations-enabled .section .tox-toolbar__primary *,
.animations-enabled .section .tox-toolbar__overflow,
.animations-enabled .section .tox-toolbar__overflow *,
.animations-enabled .section .tox-tinymce-aux,
.animations-enabled .section .tox-tinymce-aux * {
  opacity: 1 !important;
  transform: none !important;
}

/* When section is active (fullPage.js) or animations are disabled, show elements */
.animations-enabled .section.fp-completely h1,
.animations-enabled .section.fp-completely h2,
.animations-enabled .section.fp-completely h3,
.animations-enabled .section.fp-completely h4,
.animations-enabled .section.fp-completely h5,
.animations-enabled .section.fp-completely h6,
.animations-enabled .section.fp-completely p:not(a > p),
.animations-enabled .section.fp-completely a:not(p > a),
.animations-enabled .section.fp-completely img,
.animations-enabled .section.fp-completely form,
.animations-enabled .section.fp-completely label,
.animations-enabled .section.fp-completely input,
.animations-enabled .section.fp-completely textarea,
.animations-enabled .section.fp-completely button,
.animations-enabled .section.fp-completely iframe,
.animations-enabled .section.fp-completely .animate-element,
.animations-enabled .section.fp-completely [data-fp-anim-children] > * {
  animation: fromBottom 0.7s ease-out forwards;
}

/* Stagger delays for different elements */
.animations-enabled .section.fp-completely h1 {
  animation-delay: 0s;
}

.animations-enabled .section.fp-completely h2 {
  animation-delay: 0.1s;
}

.animations-enabled .section.fp-completely h3 {
  animation-delay: 0.2s;
}

.animations-enabled .section.fp-completely h4 {
  animation-delay: 0.25s;
}

.animations-enabled .section.fp-completely h5 {
  animation-delay: 0.3s;
}

.animations-enabled .section.fp-completely h6 {
  animation-delay: 0.35s;
}

.animations-enabled .section.fp-completely p:not(a > p),
.animations-enabled .section.fp-completely svg:not(a > p)  {
  animation-delay: 0.4s;
}

.animations-enabled .section.fp-completely p:not(a > p):nth-of-type(2),
.animations-enabled .section.fp-completely svg:not(a > p):nth-of-type(2)  {
  animation-delay: 0.45s;
}

.animations-enabled .section.fp-completely p:not(a > p):nth-of-type(3),
.animations-enabled .section.fp-completely svg:not(a > p):nth-of-type(3)  {
  animation-delay: 0.5s;
}

.animations-enabled .section.fp-completely p:not(a > p):nth-of-type(4),
.animations-enabled .section.fp-completely svg:not(a > p):nth-of-type(4)  {
  animation-delay: 0.55s;
}

.animations-enabled .section.fp-completely p:not(a > p):nth-of-type(5),
.animations-enabled .section.fp-completely svg:not(a > p):nth-of-type(5)  {
  animation-delay: 0.60s;
}

.animations-enabled .section.fp-completely [data-fp-anim-children] > :nth-child(1) {
  animation-delay: var(--fp-delay-start);
}

.animations-enabled .section.fp-completely [data-fp-anim-children] > :nth-child(2) {
  animation-delay: calc(var(--fp-delay-start) + 0.1s);
}

.animations-enabled .section.fp-completely [data-fp-anim-children] > :nth-child(3) {
  animation-delay: calc(var(--fp-delay-start) + 0.2s);
}

.animations-enabled .section.fp-completely [data-fp-anim-children] > :nth-child(4) {
  animation-delay: calc(var(--fp-delay-start) + 0.3s);
}

.animations-enabled .section.fp-completely [data-fp-anim-children] > :nth-child(5) {
  animation-delay: calc(var(--fp-delay-start) + 0.4s);
}
.animations-enabled .section.fp-completely [data-fp-anim-children] > :nth-child(6) {
  animation-delay: calc(var(--fp-delay-start) + 0.5s);
}

.animations-enabled .section.fp-completely [data-fp-anim-children] > :nth-child(7) {
  animation-delay: calc(var(--fp-delay-start) + 0.6s);
}

.animations-enabled .section.fp-completely [data-fp-anim-children] > :nth-child(8) {
  animation-delay: calc(var(--fp-delay-start) + 0.7s);
}

.animations-enabled .section.fp-completely [data-fp-anim-children] > :nth-child(9) {
  animation-delay: calc(var(--fp-delay-start) + 0.8s);
}

.animations-enabled .section.fp-completely [data-fp-anim-children] > :nth-child(10) {
  animation-delay: calc(var(--fp-delay-start) + 0.9s);
}

.animations-enabled .section.fp-completely [data-fp-anim-children] > :nth-child(11) {
  animation-delay: calc(var(--fp-delay-start) + 1s);
}

.animations-enabled .section.fp-completely [data-fp-anim-children] > :nth-child(12) {
  animation-delay: calc(var(--fp-delay-start) + 1.1s);
}

.animations-enabled .section.fp-completely [data-fp-anim-children] > :nth-child(13) {
  animation-delay: calc(var(--fp-delay-start) + 1.2s);
}

.animations-enabled .section.fp-completely [data-fp-anim-children] > :nth-child(14) {
  animation-delay: calc(var(--fp-delay-start) + 1.3s);
}

.animations-enabled .section.fp-completely a:not(p > a) {
  animation-delay: var(--fp-delay-a);
} 

.animations-enabled .section.fp-completely img {
  animation-delay: var(--fp-delay-img);
}

.animations-enabled .section.fp-completely form {
  animation-delay: var(--fp-delay-form);
}

.animations-enabled .section.fp-completely label {
  animation-delay: var(--fp-delay-label);
}

.animations-enabled .section.fp-completely input:nth-of-type(1) {
  animation-delay: var(--fp-delay-input);
}

.animations-enabled .section.fp-completely input:nth-of-type(2) {
  animation-delay: calc(var(--fp-delay-input) + 0.1s);
}

.animations-enabled .section.fp-completely input:nth-of-type(3) {
  animation-delay: calc(var(--fp-delay-input) + 0.2s);
}

.animations-enabled .section.fp-completely input:nth-of-type(4) {
  animation-delay: calc(var(--fp-delay-input) + 0.3s);
}

.animations-enabled .section.fp-completely textarea {
  animation-delay: var(--fp-delay-textarea);
}

.animations-enabled .section.fp-completely button {
  animation-delay: 0.7s;
}

.animations-enabled .section.fp-completely .animate-element {
  animation-delay: 0.75s;
}

/* Animation keyframes */
@keyframes fromBottom {
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

/* Never animate section-menu items */
.section-menu,
.section-menu *:not(path){
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}

/* Never animate TinyMCE elements */
.tox-tinymce,
.tox-tinymce *,
.tox-toolbar,
.tox-toolbar *,
.tox-editor-header,
.tox-editor-header *,
.tox-menubar,
.tox-menubar *,
.tox-toolbar__primary,
.tox-toolbar__primary *,
.tox-toolbar__overflow,
.tox-toolbar__overflow *,
.tox-tinymce-aux,
.tox-tinymce-aux * {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}

/* ========================================
   BACKGROUND IMAGE ANIMATIONS
   ======================================== */

/* Background image animations - only when enabled */
/* Initial state: background images start scaled up */
.animate-backgrounds .section .fp-bg {
  transform: scale(1.2);
  transition: none;
}

/* When section is completely visible, animate background to normal scale */
.animate-backgrounds .section.fp-completely .fp-bg {
  overflow: hidden;
  transform: scale(1);
  transition: transform 5s cubic-bezier(0.3, 0, 0.7, 1), opacity 1s ease;
}

/* Show elements when section has animate-in class */
.animate-in h1 {
  animation: fadeInUp 0.6s ease-out forwards;
}

.animate-in h2 {
  animation: fadeInUp 0.6s ease-out 0.1s forwards;
}

.animate-in h3 {
  animation: fadeInUp 0.6s ease-out 0.2s forwards;
}

.animate-in h4 {
  animation: fadeInUp 0.6s ease-out 0.25s forwards;
}

.animate-in h5 {
  animation: fadeInUp 0.6s ease-out 0.3s forwards;
}

.animate-in h6 {
  animation: fadeInUp 0.6s ease-out 0.35s forwards;
}

.animate-in p {
  animation: fadeInUp 0.6s ease-out 0.4s forwards;
}

.animate-in img {
  animation: fadeInUp 0.6s ease-out 0.45s forwards;
}

.animate-in form {
  animation: fadeInUp 0.6s ease-out 0.5s forwards;
}

.animate-in label {
  animation: fadeInUp 0.6s ease-out 0.55s forwards;
}

.animate-in input {
  animation: fadeInUp 0.6s ease-out 0.6s forwards;
}

.animate-in textarea {
  animation: fadeInUp 0.6s ease-out 0.65s forwards;
}

.animate-in button {
  animation: fadeInUp 0.6s ease-out 0.7s forwards;
}

.animate-in .animate-element {
  animation: fadeInUp 0.6s ease-out 0.75s forwards;
}

/* Background image mappings for sections with has-bg-image class */
section.has-bg-image#fp-theme-hero .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1682687220499-d9c06b872eee?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-hero2 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1512598483799-b7f979b5f2b3?q=80&w=3442&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-inspiration .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1635151227785-429f420c6b9d?q=80&w=2264&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-discussion .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1490902931801-d6f80ca94fe4?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-single-testimonial .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1441974231531-c6227db76b6e?q=80&w=2560&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-customer-testimonial .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1500964757637-c85e8a162699?q=80&w=2703&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-how-it-works .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1515894313590-0d5a450d03a6?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-signup .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1638962502979-05d81dcaa096?q=80&w=2777&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-trusted-by .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1471093507554-1b18de49c890?q=80&w=2671&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-collections .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1485095329183-d0797cdc5676?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-photography-skills .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1506260408121-e353d10b87c7?q=80&w=2728&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-success-stories .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1542273917363-3b1817f69a2d?q=80&w=2674&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-business-growth .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1447752875215-b2761acb3c5d?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-about .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1520634996521-d0985c84316a?q=80&w=2188&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-features .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1517336714731-489689fd1ca8?q=80&w=2052&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-features2 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1651497111372-9107c1a5d9a0?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-testimonials .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1530248809527-ee069dc8373a?q=80&w=3433&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-testimonials-interactive .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1590366412811-a3dd94d8bad9?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-testimonial-cards .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1437196582938-795c4854b3da?q=80&w=3540&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-testimonial-split .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1525272145895-cf08d56090d6?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-testimonial-carousel .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1517373263199-baee103d2980?q=80&w=2683&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-testimonial-grid .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1700159915592-004562ddcf6f?q=80&w=2728&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-client-feedback .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1495150434753-f8ceb319e9dc?q=80&w=2675&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-customer-experience .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1544620347-c4fd4a3d5957?q=80&w=2669&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-customer-story .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1538690931238-dcc3b4263c2e?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-happy-users .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1619384557832-e67eb7ffa4d0?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-pricing .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1531185907801-2771c11ab782?q=80&w=2688&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-pricing-2 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1590362891991-f776e747a588?q=80&w=2669&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-pricing-3 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1556448851-9359658faa54?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-pricing-4 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1530675706010-bc677ce30ab6?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-pricing-5 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1498887960847-2a5e46312788?q=80&w=2669&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-pricing-6 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1478185043339-d6c27ccac616?q=80&w=2674&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-bio .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1609084482915-ecaae90696ec?q=80&w=2671&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-team .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1635787501769-10b8e23b3ded?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-team2 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1566413762184-84fb89b0fe41?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-faqs .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1484976063837-eab657a7aca7?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-numbers .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1518065896235-a4c93e088e7a?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-screenshot .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1533233521468-7f200e486fbd?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-cta .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1482401204742-eb3c31c24722?q=80&w=2742&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-team-layout-1 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1449452198679-05c7fd30f416?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-web-app .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1491156855053-9cdff72c7f85?q=80&w=2728&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-team-layout-2 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1594495894542-a46cc73e081a?q=80&w=2671&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-features-showcase .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1530469641172-8ac15d0a7d6a?q=80&w=2305&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-team-circles .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1682685797769-481b48222adf?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-card-section .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1534775053122-dcd28a281520?q=80&w=3540&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-contact .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1682685797277-f2bf89b24017?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-welcome .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1548013146-72479768bada?q=80&w=2676&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-hero-2 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1682685797208-c741d58c2eff?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-email .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1505852679233-d9fd70aff56d?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-simple-form .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1507608869274-d3177c8bb4c7?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1542446608-e9525230faed?q=80&w=3433&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-2 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1606335543042-57c525922933?q=80&w=2675&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-form-split .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1485395037613-e83d5c1f5290?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-people .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1519505907962-0a6cb0167c73?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-numbers-2 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1599586120429-48281b6f0ece?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-phone-mockup .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1482195740274-e367dbcdb9c6?q=80&w=3432&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-video-bottom .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1506077709666-1932cac9ad51?q=80&w=2760&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-video-top .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1499438075715-fc23ef376ab9?q=80&w=2321&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-video-center .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1517838277536-f5f99be501cd?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-half-image .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1599058917212-d750089bc07e?q=80&w=2669&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-rotated-images .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1586996292898-71f4036c4e07?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-why-care .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1563974514898-7aea295e12fa?q=80&w=2667&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-contact-info .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1567628065080-ecdec09a7588?q=80&w=2260&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-pricing-comparison .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1682687982049-b3d433368cd1?q=80&w=2671&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-comparison-table .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1440020143730-090579c4d53c?q=80&w=2289&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-events-grid .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1549074862-6173e20d02a8?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-events-list .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1761432744427-05aca8732e77?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-pros-cons .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1563994798145-aac79dece602?q=80&w=2676&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-features-accordion .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1611938379616-fc879d3a90ba?q=80&w=2671&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-product-slider .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1504173010664-32509aeebb62?q=80&w=2627&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-video-split .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1474314170901-f351b68f544f?q=80&w=2671&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-video-split-right .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1590176028506-b8324faaa8bf?q=80&w=2274&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-video-heading .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1603302576837-37561b2e2302?q=80&w=2668&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-scroll .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1765573395861-408e68328134?q=80&w=2671&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-image-only .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1658859735334-70d3dbf70dc1?q=80&w=2307&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-image-center .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1690159290827-9f5354349c6c?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-image-top .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1658859735415-8bb600630db8?q=80&w=3431&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-image-bottom .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1676660834132-1473a72baf7a?q=80&w=3432&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-bento-gallery .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1684342083789-249cdfbf3a12?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-masonry-gallery .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1669937401489-fb1ebb31d762?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-split .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1617791160588-241658c0f566?q=80&w=2264&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-grid .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1668455199701-284281127a87?q=80&w=2264&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-asymmetric .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1620121684840-edffcfc4b878?q=80&w=3432&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-slider .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1668450433152-e56d7e8fe4ee?q=80&w=2264&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-expand .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1669295384050-a1d4357bd1d7?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-expand-overlay .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1620121692029-d088224ddc74?q=80&w=3432&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-slider-arrows .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1618005182384-a83a8bd57fbe?q=80&w=2264&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-thumbs .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1532884928231-ef40895eb654?q=80&w=2650&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-thumbs-fade .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1492571350019-22de08371fd3?q=80&w=2253&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-grid-links .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1564284369929-026ba231f89b?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-collection-split .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1512453979798-5ea266f8880c?q=80&w=2400&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-overflow .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1510075644440-2c2b60679e1a?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-gallery-features .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1479030160180-b1860951d696?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-features-grid .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1451418280345-67a6b4d10bba?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-featured-benefits .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1500881263786-ad74c00b9e60?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-user-features .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1587357327780-c9d724b0bff8?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-business-features .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1533335121856-52d185e85ec1?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-image-features .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1542991214-df0aa5950676?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-task-features .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1488831861984-179da3647265?q=80&w=2728&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-phone-features .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1531156992292-d36397ee9184?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-customer-features .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1516450360452-9312f5e86fc7?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-sustainable-features .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1594623930572-300a3011d9ae?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-network-features .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1524368535928-5b5e00ddc76b?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-interactive-features .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1475275166152-f1e8005f9854?q=80&w=2672&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-standout-features .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1507676184212-d03ab07a01bf?q=80&w=2669&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-questions-answers .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1477233534935-f5e6fe7c1159?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-popular-questions .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1445985543470-41fba5c3144a?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-inline-faq .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1514320291840-2e0a9bf2a9ae?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-split-faq .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1470225620780-dba8ba36b745?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-faq-image .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1620421895918-b4e8c86648fb?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-faq-visible .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1656433031375-5042f5afe894?q=80&w=2671&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-faq-hover .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1612817159576-986a0b7a4165?q=80&w=2050&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-pricing-toggle .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1580943943004-6a4697b70059?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-pricing-cards .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1695634707039-15bdfed2ef9c?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-pricing-features .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1647943499244-032308c2088a?q=80&w=3432&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-event-pricing .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1467991521834-fb8e202c7074?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-dedicated-team .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1494253109108-2e30c049369b?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-creative-team .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1463131880619-92e2e9a64ee8?q=80&w=3000&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-skilled-team .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1638962502979-05d81dcaa096?q=80&w=2777&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-exceptional-team-2 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1728476444242-7568c96b1eac?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-award-team .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1520022283252-ca69c721d247?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-talented-team .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1513116917658-bdc8f9e49348?q=80&w=2400&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-collaboration-team .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1496055401924-5e7fdc885742?q=80&w=2274&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-exceptional-team .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1564032236772-dfc27a12feda?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-team-slider .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1470115636492-6d2b56f9146d?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-staggered-team .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1655350479930-661689c79b67?q=80&w=2690&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-team-carousel .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1633933765827-37289137d40d?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-portfolio-grid .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1512861506260-6520871bbdaa?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-blog-entries .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1504450075628-39777da238ed?q=80&w=2669&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-latest-blog .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1488972685288-c3fd157d7c7a?q=80&w=2400&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-contact-form .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1448301858776-07f780e9c9da?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-contact-map .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1514971126075-758e7d825812?q=80&w=2273&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-logos-grid .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1593062096033-9a26b09da705?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-contact-split .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1497366858526-0766cadbe8fa?q=80&w=2301&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-integrations-cards .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1487017159836-4e23ece2e4cf?q=80&w=2671&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-numbers-split .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1531973576160-7125cd663d86?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-numbers-centered .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1497366754035-f200968a6e72?q=80&w=2301&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-numbers-with-features .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1497366811353-6870744d04b2?q=80&w=2301&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-numbers-performance .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1603865326089-c2a4c0d88e73?q=80&w=2669&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-integrations .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1614800084360-ded59505e32d?q=80&w=2671&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-numbers-innovative .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1700249576077-6b592d5a0ab4?q=80&w=2312&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-property-experts .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1670434846352-23e8f0e28c16?q=80&w=2728&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-empowering-communities .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1524516892385-b78812fcf4a4?q=80&w=2671&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-testimonials-image .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1635883553296-e527ad057d78?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-logos .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1595087242606-ecf4d9dd2545?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-login .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1583339972074-a01b1a10b693?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-newsletter-centered .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1519606247872-0440aae9b827?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-newsletter .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1633596683562-4a47eb4983c5?q=80&w=3432&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-cta-1 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1416949929422-a1d9c8fe84af?q=80&w=2000&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-cta-2 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1554147090-e1221a04a025?q=80&w=2648&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-cta-3 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1496769336828-c522a3a7e33c?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-cta-4 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1515984977862-1c7201ef324d?q=80&w=2669&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-cta-5 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1467625575448-2ef10dabab8a?q=80&w=2669&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-cta-6 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1484506097116-1bcba4fa7568?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-contact-2 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1507936580189-3816b4abf640?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-hero-3 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1508138221679-760a23a2285b?q=80&w=2274&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-hero-4 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1541623089466-8e777dd05d70?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-hero-5 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1473773508845-188df298d2d1?q=80&w=2274&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-footer .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1492724724894-7464c27d0ceb?q=80&w=2274&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-about-video-stats .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1552598715-7eeb9232a2ac?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-achievement-story .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1542856391-010fb87dcfed?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-process-steps .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1493166228553-4fa0fdb916e8?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-guide-steps .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1682687220742-aba13b6e50ba?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-onboarding-flow .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1444464666168-49d633b86797?q=80&w=2669&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-understanding-steps .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1447752875215-b2761acb3c5d?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-process-accordion .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1470813740244-df37b8c1edcb?q=80&w=2671&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-step-cards .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1523712999610-f77fbcfc3843?q=80&w=2670&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-steps-slider .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1421789665209-c9b2a435e3dc?q=80&w=2671&auto=format&fit=crop');
}

section.has-bg-image#fp-theme-testimonials-cards .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1501854140801-50d01698950b?q=80&w=2600&auto=format&fit=crop');
}

footer.has-bg-image#fp-theme-footer-1 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1580137189272-c9379f8864fd?q=80&w=2670&auto=format&fit=crop');
}

footer.has-bg-image#fp-theme-footer-2 .fp-bg {
  background-image: url('https://images.unsplash.com/20/dusty-sky.JPG?q=80&w=2674&auto=format&fit=crop');
}

footer.has-bg-image#fp-theme-footer-3 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1737474707380-5ef35770d8a7?q=80&w=3435&auto=format&fit=crop');
}

footer.has-bg-image#fp-theme-footer-4 .fp-bg {
  background-image: url('https://images.unsplash.com/photo-1500964757637-c85e8a162699?q=80&w=2703&auto=format&fit=crop');
}