/* Font imports for home */

/* CSS Variables for home */
:root {
  --z-base: 0;
  --space-0: 0;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --text-lg: 1.2rem;
  --text-md: 1.1rem;
  --text-sm: 0.95rem;
  --text-xl: 1.5rem;
  --text-xs: 0.875rem;
  --z-fixed: 300;
  --z-modal: 500;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;
  --z-sticky: 200;
  --font-bold: 700;
  --radius-lg: 8px;
  --radius-md: 6px;
  --radius-sm: 4px;
  --radius-xl: 12px;
  --screen-lg: 1024px;
  --screen-md: 768px;
  --screen-sm: 640px;
  --screen-xl: 1200px;
  --shadow-lg: 0 10px 20px rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1);
  --shadow-xl: 0 20px 40px rgba(0, 0, 0, 0.1);
  --shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --text-2-xl: 2rem;
  --text-3-xl: 2.5rem;
  --text-4-xl: 3rem;
  --text-5-xl: 3.5rem;
  --text-base: 1.2rem;
  --z-popover: 600;
  --z-tooltip: 700;
  --color-gold: gold;
  --font-light: 300;
  --z-dropdown: 100;
  --color-black: #000000;
  --color-theme: #ffffff;
  --color-white: #ffffff;
  --font-medium: 500;
  --radius-2-xl: 20px;
  --radius-full: 9999px;
  --screen-2-xl: 1600px;
  --shadow-2-xl: 0 25px 50px rgba(0, 0, 0, 0.25);
  --container-lg: 1200px;
  --container-md: 800px;
  --container-sm: 600px;
  --container-xl: 1440px;
  --font-regular: 400;
  --leading-snug: 1.4;
  --color-gray-50: #fafafa;
  --color-primary: var(--color-primary-10);
  --font-semibold: 600;
  --header-height: 90px;
  --leading-tight: 1.1;
  --color-gray-100: #f4f4f5;
  --color-gray-200: #e4e4e7;
  --color-gray-300: #d4d4d8;
  --color-gray-400: #a1a1aa;
  --color-gray-500: #71717a;
  --color-gray-600: #52525b;
  --color-gray-700: #3f3f46;
  --color-gray-800: #27272a;
  --color-gray-900: #18181b;
  --color-gray-950: #09090b;
  --color-tertiary: #f97316;
  --leading-normal: 1.5;
  --section-height: 800px;
  --shadow-colored: 0 8px 20px var(--color-primary-alpha-30);
  --color-faqs-icon: var(--color-tertiary-brand);
  --color-primary-1: #FFFFFF;
  --color-primary-2: #e4dbdb;
  --color-primary-3: #c9c3c3;
  --color-primary-4: #aeaaaa;
  --color-primary-5: #939191;
  --color-primary-6: #787777;
  --color-primary-7: #5e5d5d;
  --color-primary-8: #434242;
  --color-primary-9: #282828;
  --color-secondary: var(--color-secondary-3);
  --leading-relaxed: 1.6;
  --transition-base: all 0.3s ease;
  --transition-fast: all 0.2s ease;
  --transition-slow: all 0.5s ease;
  --color-primary-10: #0d0d0d;
  --color-tertiary-1: #f2fbff;
  --color-tertiary-2: #abd0e4;
  --color-tertiary-3: #74acc9;
  --color-tertiary-4: #0077B6;
  --color-tertiary-5: #2b6f93;
  --color-tertiary-6: #175778;
  --color-tertiary-7: #0a415e;
  --color-tertiary-8: #032d43;
  --color-tertiary-9: #001a28;
  --z-modal-backdrop: 400;
  --color-secondary-1: #f2fcff;
  --color-secondary-2: #00AEEF;
  --color-secondary-3: #74b2c9;
  --color-secondary-4: #4a93ae;
  --color-secondary-5: #2b7793;
  --color-secondary-6: #175e78;
  --color-secondary-7: #0a475e;
  --color-secondary-8: #033143;
  --color-secondary-9: #001d28;
  --color-tertiary-10: #00080d;
  --container-default: 100%;
  --color-primary-dark: var(--color-primary-10);
  --color-secondary-10: #00090d;
  --color-button-shadow: #1d8d96;
  --color-primary-brand: #0d0d0d;
  --color-theme-inverse: #1E1D25;
  --transition-material: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
  --color-black-alpha-50: rgba(0, 0, 0, 0.5);
  --color-cta-background: #f2fbff;
  --color-cta-foreground: #000000;
  --color-primary-1-text: #000000;
  --color-primary-2-text: #000000;
  --color-primary-3-text: #000000;
  --color-primary-4-text: #000000;
  --color-primary-5-text: #000000;
  --color-primary-6-text: #000000;
  --color-primary-7-text: #ffffff;
  --color-primary-8-text: #ffffff;
  --color-primary-9-text: #ffffff;
  --color-tertiary-brand: #f2fbff;
  --color-white-alpha-50: #00000050;
  --color-faqs-background: #0d0d0d;
  --color-faqs-foreground: #ffffff;
  --color-primary-10-text: #ffffff;
  --color-secondary-brand: #74b2c9;
  --color-tertiary-1-text: #000000;
  --color-tertiary-2-text: #000000;
  --color-tertiary-3-text: #000000;
  --color-tertiary-4-text: #ffffff;
  --color-tertiary-5-text: #ffffff;
  --color-tertiary-6-text: #ffffff;
  --color-tertiary-7-text: #ffffff;
  --color-tertiary-8-text: #ffffff;
  --color-tertiary-9-text: #ffffff;
  --color-about-background: #74b2c9;
  --color-about-foreground: #000000;
  --color-secondary-1-text: #000000;
  --color-secondary-2-text: #000000;
  --color-secondary-3-text: #000000;
  --color-secondary-4-text: #000000;
  --color-secondary-5-text: #ffffff;
  --color-secondary-6-text: #ffffff;
  --color-secondary-7-text: #ffffff;
  --color-secondary-8-text: #ffffff;
  --color-secondary-9-text: #ffffff;
  --color-services-overlay: #f2fbff;
  --color-staff-background: #ffffff;
  --color-staff-foreground: #000000;
  --color-tertiary-10-text: #ffffff;
  --color-banner-background: #FFFFFF;
  --color-banner-foreground: #000000;
  --color-button-background: #25b6c1;
  --color-button-foreground: #000000;
  --color-footer-background: #0d0d0d;
  --color-footer-foreground: #ffffff;
  --color-header-background: #0d0d0d;
  --color-header-foreground: #ffffff;
  --color-secondary-10-text: #ffffff;
  --color-staff-card-border: #f2fbff;
  --color-contact-background: #74b2c9;
  --color-contact-foreground: #000000;
  --color-gallery-background: #74b2c9;
  --color-gallery-foreground: #000000;
  --color-marquee-background: #0a415e;
  --color-marquee-foreground: #ffffff;
  --color-partner-background: #FFFFFF;
  --color-partner-foreground: #000000;
  --color-benefits-background: #f2fcff;
  --color-benefits-foreground: #000000;
  --color-categories-card-cta: #f2fbff;
  --color-cta-card-background: #ffffff;
  --color-cta-card-foreground: #000000;
  --color-services-background: #FFFFFF;
  --color-services-foreground: #000000;
  --color-catalogue-background: #0d0d0d;
  --color-catalogue-foreground: #ffffff;
  --color-faqs-icon-background: #f2fbff;
  --color-faqs-icon-foreground: #000000;
  --color-hero-card-background: #ffffff;
  --color-hero-card-foreground: #000000;
  --color-about-card-background: #0d0d0d;
  --color-about-card-foreground: #ffffff;
  --color-banner-cta-background: #f2fbff;
  --color-banner-cta-foreground: #000000;
  --color-cta-button-background: #f2fbff;
  --color-cta-button-foreground: #000000;
  --color-header-cta-background: #74b2c9;
  --color-header-cta-foreground: #000000;
  --color-offer-card-background: #ffffff;
  --color-offer-card-foreground: #000000;
  --color-staff-card-background: #74b2c9;
  --color-staff-card-foreground: #000000;
  --color-banner-card-background: #ffffff;
  --color-banner-card-foreground: #000000;
  --color-catalogue-view-all-cta: var(--color-theme);
  --color-faqs-navigation-arrows: #f2fbff;
  --color-header-tabs-background: #74b2c9;
  --color-header-tabs-foreground: #000000;
  --color-information-background: #000000;
  --color-information-foreground: #ffffff;
  --color-staff-modal-background: #74b2c9;
  --color-staff-modal-foreground: #000000;
  --color-button-background-hover: #1d8d96;
  --color-button-foreground-hover: #ffffff;
  --color-category-faq-background: #ffffff;
  --color-category-faq-foreground: #000000;
  --color-floating-cta-background: #f2fbff;
  --color-floating-cta-foreground: #000000;
  --color-testimonials-background: #0d0d0d;
  --color-testimonials-foreground: #ffffff;
  --color-workingHours-background: #ffffff;
  --color-workingHours-foreground: #000000;
  --color-benefits-card-background: #ffffff;
  --color-benefits-card-foreground: #000000;
  --color-footer-contact-card-ring: #09090b;
  --color-categoryBanner-background: linear-gradient(var(--color-tertiary-1) 0%, var(--color-tertiary-2) 50%, var(--color-tertiary-3) 100%);
  --color-categoryBanner-foreground: #ffffff;
  --color-primary-button-background: #f2fbff;
  --color-primary-button-foreground: #000000;
  --color-service-header-background: #0d0d0d;
  --color-service-header-foreground: #ffffff;
  --color-categories-card-background: #f2fbff;
  --color-categories-card-foreground: #000000;
  --color-banner-cta-background-hover: #74b2c9;
  --color-banner-cta-foreground-hover: #000000;
  --color-catalogue-navigation-arrows: var(--color-tertiary-brand);
  --color-categoryServices-background: #ffffff;
  --color-categoryServices-foreground: #000000;
  --color-header-cta-background-hover: #f2fbff;
  --color-header-cta-foreground-hover: #000000;
  --color-offer-sticky-bar-background: #0d0d0d;
  --color-offer-sticky-bar-foreground: #ffffff;
  --color-secondary-button-background: #74b2c9;
  --color-secondary-button-foreground: #000000;
  --color-services-overlay-foreground: #000000;
  --color-testimonial-star-background: gold;
  --color-category-faq-card-background: #ffffff;
  --color-category-faq-card-foreground: #000000;
  --color-staff-card-button-background: #f2fbff;
  --color-staff-card-button-foreground: #000000;
  --color-staff-modal-cards-background: #ffffff;
  --color-staff-modal-cards-foreground: #000000;
  --color-testimonials-card-background: #74b2c9;
  --color-testimonials-card-foreground: #000000;
  --color-banner-cta-connect-background: #74b2c9;
  --color-banner-cta-connect-foreground: #000000;
  --color-header-cta-connect-background: #74b2c9;
  --color-header-cta-connect-foreground: #000000;
  --color-header-tabs-active-background: #f2fbff;
  --color-header-tabs-active-foreground: #000000;
  --color-offer-card-content-background: #ffffff;
  --color-offer-card-content-foreground: #000000;
  --color-serviceBanner-card-background: #ffffff;
  --color-serviceBanner-card-foreground: #000000;
  --color-footer-contact-card-background: #FFFFFF;
  --color-footer-contact-card-foreground: #000000;
  --color-footer-contact-card-input-ring: #a1a1aa;
  --color-testimonials-navigation-arrows: #f2fbff;
  --color-category-link-button-background: #74b2c9;
  --color-category-link-button-foreground: #000000;
  --color-floating-cta-connect-background: #0d0d0d;
  --color-floating-cta-connect-foreground: #ffffff;
  --color-header-business-info-background: #FFFFFF;
  --color-header-business-info-foreground: #000000;
  --color-primary-button-background-hover: #74b2c9;
  --color-primary-button-foreground-hover: #000000;
  --color-categoryServices-card-background: #ffffff;
  --color-categoryServices-card-foreground: #000000;
  --color-catalogue-view-all-cta-background: #74b2c9;
  --color-catalogue-view-all-cta-foreground: #000000;
  --color-secondary-button-background-hover: #f2fbff;
  --color-secondary-button-foreground-hover: #000000;
  --color-banner-cta-connect-background-hover: #f2fbff;
  --color-banner-cta-connect-foreground-hover: #000000;
  --color-header-cta-connect-background-hover: #f2fbff;
  --color-header-cta-connect-foreground-hover: #000000;
  --color-footer-contact-card-input-background: #ffffff;
  --color-footer-contact-card-input-foreground: var(--color-black);
  --color-footer-contact-card-input-ring-focus: #18181b;
  --color-footer-contact-card-button-background: #f2fbff;
  --color-footer-contact-card-button-foreground: #000000;
  --color-catalogue-navigation-arrows-background: #f2fbff;
  --color-catalogue-navigation-arrows-foreground: #000000;
  --color-catalogue-view-all-cta-hover-background: #f2fbff;
  --color-catalogue-view-all-cta-hover-foreground: #000000;
  --color-footer-contact-card-button-background-hover: #0d0d0d;
  --color-footer-contact-card-button-foreground-hover: #ffffff;
}

/* Page-specific global CSS for home */
@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes bounce {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }
}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

@keyframes partners-carousel-marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

/* Global Styles */

* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-head);
}

body,
button,
p,
span,
div {
    font-family: var(--font-body);
}

html,
body {
    scroll-behavior: smooth;
    max-width: 100vw;
    overflow-x: hidden;
    background-color: white;
}

a {
    color: inherit;
    text-decoration: none;
}

.zoca-app {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.page-container {
    flex: 1;
    display: flex;
    flex-direction: column;
}

*:focus {
    outline: none;
}

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

.loading {
    position: relative;
    pointer-events: none;
    opacity: 0.6;
}

.loading::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin: -10px 0 0 -10px;
    border: 2px solid var(--color-primary);
    border-radius: 50%;
    border-top-color: transparent;
    animation: spin 0.8s linear infinite;
}

.animate-fadeIn {
    animation: fadeIn 0.5s ease-out;
}

.animate-slideUp {
    animation: slideUp 0.5s ease-out;
}

.animate-slideDown {
    animation: slideDown 0.5s ease-out;
}

.animate-bounce {
    animation: bounce 2s ease-in-out infinite;
}

.transition-fast {
    transition: var(--transition-fast);
}

.transition-base {
    transition: var(--transition-base);
}

.transition-slow {
    transition: var(--transition-slow);
}

.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;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-size: 15px;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

@media (max-width: 768px) {
    html {
        font-size: 14px;
    }
}

body {
    line-height: var(--leading-normal);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-family:
        -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

img,
picture,
video,
canvas,
svg {
    max-width: 100%;
    height: auto;
}

input,
button,
textarea,
select {
    font: inherit;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
    overflow-wrap: break-word;
    word-wrap: break-word;
}

button {
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
    font: inherit;
}

ul,
ol {
    list-style: none;
}

.container {
    width: 100%;
    max-width: var(--container-default);
    margin: 0 auto;
    padding: 0 var(--space-4);
}

.section {
    width: 100%;
    min-height: var(--section-height);
    position: relative;
}

.section-hero {
    padding: var(--header-height) 0 0 0;
}

.section-full-height {
    height: 100vh;
    min-height: 100vh;
}

.grid {
    display: grid;
}

.grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.flex {
    display: flex;
}

.flex-col {
    flex-direction: column;
}

.items-center {
    align-items: center;
}

.justify-center {
    justify-content: center;
}

.justify-between {
    justify-content: space-between;
}

.gap-4 {
    gap: var(--space-4);
}

.gap-6 {
    gap: var(--space-6);
}

.gap-8 {
    gap: var(--space-8);
}

.relative {
    position: relative;
}

.absolute {
    position: absolute;
}

.bg-cover {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.horizontal-center {
    display: flex;
    justify-content: center;
    width: 100%;
}

.bg-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.overlay-dark {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.fixed-bottom {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100;
    width: calc(100% - 40px);
}

.fixed-bottom-shadow {
    box-shadow: var(--shadow-colored);
}


.offer-sticky-bar[data-offer-sticky-bar-enable='false']{
    display: none;
}

.offer-sticky-bar[data-offer-sticky-bar-enable='true'] ~ .header-spacer {
    height: calc(var(--header-height, 80px) + 42.5px);
}

.offer-sticky-bar[data-offer-sticky-bar-enable='true'] ~ .header {
        margin-top: 42.5px;
    }

@media (max-width: 767px) {
    .offer-sticky-bar[data-offer-sticky-bar-enable='true'] ~ .header {
        margin-top: 37px;
    }

    .offer-sticky-bar[data-offer-sticky-bar-enable='true'] ~ .header-spacer {
        height: calc(var(--header-height, 80px) + 37px);
    }
}

@media (max-width: 767px) {
  .offer-sticky-bar {
    padding: 8px 18px;
  }

  .offer-sticky-bar-title,
  .offer-sticky-bar-divider,
  .offer-sticky-bar-cta{
    font-size: 12px !important;
  }
}


.card-layout {
    display: grid;
    gap: var(--space-8);
    align-items: stretch;
    justify-items: center;
    width: 100%;
}

.card-layout>* {
    width: 100%;
    height: 100%;
}

.card-layout-single {
    grid-template-columns: 1fr;
}

.card-layout-double {
    grid-template-columns: 1fr;
}

.section-overlay {
    position: relative;
    width: 100%;
    min-height: var(--section-height);
    overflow: hidden;
}

.section-overlay>img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.section-overlay-gradient {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, transparent, var(--color-black-alpha-30));
    z-index: 2;
}

.section-overlay-content {
    position: relative;
    z-index: 3;
    min-height: var(--section-height);
    display: flex;
    align-items: center;
}

.hidden {
    display: none !important;
}

.block {
    display: block;
}

.heading-hero {
    font-size: var(--text-4-xl);
    font-weight: var(--font-bold);
    margin-bottom: var(--space-6);
    text-align: center;
}

.text-hero {
    font-size: var(--text-lg);
    line-height: var(--leading-relaxed);
    margin-bottom: var(--space-10);
    text-align: center;
    font-weight: var(--font-medium);
}

.heading-section {
    font-size: var(--text-3-xl);
    font-weight: var(--font-bold);
    margin-bottom: var(--space-4);
}

.text-section {
    font-size: var(--text-md);
    max-width: 800px;
    margin: 0 auto;
}

.heading-card {
    font-size: var(--text-xl);
    font-weight: var(--font-semibold);
    margin-bottom: var(--space-3);
}

.text-card {
    font-size: var(--text-base);
    margin-bottom: var(--space-6);
    line-height: var(--leading-normal);
}

.heading-offer {
    font-size: var(--text-3-xl);
    font-weight: var(--font-bold);
    margin-bottom: var(--space-6);
}

.text-offer {
    font-size: var(--text-lg);
    line-height: var(--leading-relaxed);
    margin-bottom: var(--space-4);
}

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

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: var(--font-medium);
    text-align: center;
    border-radius: var(--radius-md);
    transition: var(--transition-base);
    cursor: pointer;
    border: none;
    outline: none;
    text-decoration: none;
    white-space: nowrap;
}

.btn-sm {
    padding: var(--space-2) var(--space-4);
    font-size: var(--text-base);
}

.btn-md {
    padding: var(--space-3) var(--space-6);
    font-size: var(--text-base);
}

.btn-lg {
    padding: var(--space-4) var(--space-10);
    font-size: var(--text-md);
}

.btn-primary {
    background-color: var(--color-primary-button-background);
    color: var(--color-primary-button-foreground);
}

.btn-primary:hover {
    background-color: var(--color-primary-button-background-hover);
    color: var(--color-primary-button-foreground-hover);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.btn-secondary {
    background-color: transparent;
    border: 1px solid currentColor;
}

.btn-secondary:hover {
    transform: translateY(-2px);
}

.btn-dark {
    background-color: var(--color-black);
    color: var(--color-white);
}

.btn-dark:hover {
    background-color: var(--color-gray-800);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.btn-outline {
    background-color: transparent;
    border: 2px solid currentColor;
}

.btn-outline:hover {
    transform: translateY(-2px);
}

.modal-close {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.5rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.modal-close svg {
    width: 20px;
    height: 20px;
    color: var(--color-gray-600);
}

.carousel-nav-button {
    border: none;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 var(--space-6);
    cursor: pointer;
    transition: all 0.2s;
}

.carousel-nav-button svg {
    width: 20px;
    height: 20px;
}

.btn-pill {
    border-radius: var(--radius-full);
}

.btn-tab {
    padding: var(--space-2) var(--space-5);
    background-color: var(--color-gray-100);
    color: var(--color-gray-700);
    border: none;
    border-radius: var(--radius-full);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s ease;
}

.btn-tab:hover {
    background-color: var(--color-gray-200);
}

.btn-tab[data-active='true'],
.btn-tab.active {
    background-color: var(--color-gray-800) !important;
    color: var(--color-white) !important;
}

.membership-section {
    width: 100%;
    padding: var(--space-20) var(--space-4);
    background-color: var(--color-white);
    display: flex;
    justify-content: center;
    align-items: center;
}

.membership-card {
    width: 100%;
    margin: 0 auto;
    max-width: 1100px;
    background-color: var(--color-black);
    color: var(--color-white) !important;
    border-radius: var(--radius-xl);
    padding: var(--space-12) var(--space-8);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.card-pricing {
    width: 100%;
    margin-bottom: var(--space-8);
}

.pricing-text {
    font-size: var(--text-base);
    line-height: var(--leading-relaxed);
    color: var(--color-white);
    max-width: 600px;
    margin: 0 auto;
}

.card-button-inverted {
    display: inline-block;
    padding: var(--space-3) var(--space-8);
    background-color: var(--color-white);
    color: var(--color-black);
    font-weight: var(--font-medium);
    font-size: var(--text-base);
    border-radius: var(--radius-md);
    border: none;
    cursor: pointer;
    transition: var(--transition-base);
}

.card-button-inverted:hover {
    background-color: var(--color-white-alpha-90);
    transform: translateY(-2px);
}

.form-input {
    border: none;
    border-radius: var(--radius-xl);
    padding: var(--space-4);
    font-size: var(--text-base);
    outline: none;
    width: 100%;
}

.form-input-gray {
    background-color: var(--color-gray-50);
    color: var(--color-gray-800);
}

.form-label {
    font-size: var(--text-base);
    margin: 0;
    font-weight: var(--font-medium);
}

.form-label-dark {
    color: var(--color-gray-800);
}

.phone-input-container {
    display: flex;
    border-radius: 12px;
    overflow: visible;
}

.phone-container-gray {
    background-color: var(--color-gray-50);
}

.input-with-icon {
    flex: 1;
    display: flex;
    align-items: center;
    padding: 0 1rem;
    border-radius: 12px;
}

.input-icon {
    width: 20px;
    height: 20px;
    margin-right: 0.75rem;
}

.phone-icon-gray {
    color: var(--color-gray-600);
}

.input-transparent {
    background: transparent;
    padding: 1rem 0;
    font-size: 1rem;
    border: none;
    outline: none;
    width: 100%;
}

.phone-input-dark {
    color: var(--color-gray-800);
}

.country-selector {
    position: relative;
    display: flex;
    align-items: center;
    padding: 1rem;
    border-right: 1px solid var(--color-gray-200);
    gap: 0.5rem;
    cursor: pointer;
}

.country-selector-gray {
    background-color: var(--color-gray-50);
}

.country-flag {
    width: 20px;
    height: auto;
}

.country-code {
    font-size: 1rem;
}

.country-code-dark {
    color: var(--color-gray-800);
}

.country-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    width: 200px;
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-md);
    z-index: 10000;
    display: none;
    margin-top: 2px;
}

.country-dropdown-white {
    background-color: var(--color-white);
}

.country-option {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    cursor: pointer;
    transition: all 0.2s ease;
    gap: 12px;
}

.country-option:last-child {
    border-bottom: none;
}

.country-option-border {
    border-bottom: 1px solid var(--color-gray-100);
}

.country-option-border:hover {
    background-color: var(--color-gray-50);
}

.toggle-button-default {
    background: var(--color-gray-50);
    border-color: var(--color-gray-300);
    color: var(--color-black);
}

.toggle-button-default:hover {
    border-color: var(--color-primary);
    color: var(--color-black);
}

.toggle-button-active {
    border-color: var(--color-primary);
    color: var(--color-primary);
    background-color: var(--color-primary-alpha-10);
}

.form-fields-flex {
    flex: 1;
}

.form-fields-column {
    flex-direction: column;
}

.form-options-row {
    flex-direction: row;
    gap: var(--space-3);
}

.form-input-size {
    font-size: 16px;
}

/* ================================
   Gallery SECTION STYLES
   Following CSS_NAMING_CONVENTION.md
   Component-Element Pattern
   ================================ */


/* Gallery Section Styles */
.gallery-section {
    scroll-margin-top: var(--header-height) !important;
    background-color: var(--color-gallery-background);
    color: var(--color-gallery-foreground) !important;
}

.gallery-content {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
}

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-4);
    padding-bottom: var(--space-8);
}

.gallery-item {
    width: 100%;
    position: relative;
}

.gallery-image {
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    border-radius: var(--radius-lg);
    object-fit: cover;
    transition: var(--transition-material);
    cursor: pointer;
}

.gallery-image:hover {
    transform: scale(1.03);
}

/* Gallery Overlay Styles */
.gallery-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.45);
    border-radius: var(--radius-lg);
    display: none;
    /* Hidden by default */
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--transition-material);
    text-decoration: none;
    flex-direction: row;
    gap: var(--space-2);
}

.gallery-overlay::before {
    content: "View More";
    color: white;
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
}

.gallery-overlay::after {
    content: "";
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'%3E%3C/path%3E%3Cpath d='m12 5 7 7-7 7'%3E%3C/path%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* Desktop: 4 columns - show 4 or 8, overlay only when MORE than 4 or MORE than 8 */
@media (min-width: 1025px) {
    .gallery-grid {
        grid-template-columns: repeat(4, 1fr);
    }

    /* Hide all overlays by default */
    .gallery-overlay {
        display: none !important;
    }

    /* 5-7 images: Show 4, overlay on 4th (has 5th but NOT 8th) */
    .gallery-grid:has(.gallery-item:nth-child(5)):not(:has(.gallery-item:nth-child(8))) .gallery-item:nth-child(4) .gallery-overlay {
        display: flex !important;
    }

    .gallery-grid:has(.gallery-item:nth-child(5)):not(:has(.gallery-item:nth-child(8))) .gallery-item:nth-child(n+5) {
        display: none !important;
    }

    /* 9+ images: Show 8, overlay on 8th (has 9th) */
    .gallery-grid:has(.gallery-item:nth-child(9)) .gallery-item:nth-child(8) .gallery-overlay {
        display: flex !important;
    }

    .gallery-grid:has(.gallery-item:nth-child(9)) .gallery-item:nth-child(n+9) {
        display: none !important;
    }
}

/* Tablet: 3 columns - show 3, 6, or 9, overlay only when MORE than those */
@media (min-width: 641px) and (max-width: 1024px) {
    .gallery-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    /* Hide all overlays by default */
    .gallery-overlay {
        display: none !important;
    }

    /* 4-5 images: Show 3, overlay on 3rd (has 4th but NOT 6th) */
    .gallery-grid:has(.gallery-item:nth-child(4)):not(:has(.gallery-item:nth-child(6))) .gallery-item:nth-child(3) .gallery-overlay {
        display: flex !important;
    }

    .gallery-grid:has(.gallery-item:nth-child(4)):not(:has(.gallery-item:nth-child(6))) .gallery-item:nth-child(n+4) {
        display: none !important;
    }

    /* 7-8 images: Show 6, overlay on 6th (has 7th but NOT 9th) */
    .gallery-grid:has(.gallery-item:nth-child(7)):not(:has(.gallery-item:nth-child(9))) .gallery-item:nth-child(6) .gallery-overlay {
        display: flex !important;
    }

    .gallery-grid:has(.gallery-item:nth-child(7)):not(:has(.gallery-item:nth-child(9))) .gallery-item:nth-child(n+7) {
        display: none !important;
    }

    /* 10+ images: Show 9, overlay on 9th (has 10th) */
    .gallery-grid:has(.gallery-item:nth-child(10)) .gallery-item:nth-child(9) .gallery-overlay {
        display: flex !important;
    }

    .gallery-grid:has(.gallery-item:nth-child(10)) .gallery-item:nth-child(n+10) {
        display: none !important;
    }
}

/* Mobile: 2 columns - show 2, 4, 6, or 8, overlay only when MORE than those */
@media (max-width: 640px) {
    .gallery-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Hide all overlays by default */
    .gallery-overlay {
        display: none !important;
    }

    /* 3 images only: Show 2, overlay on 2nd (has 3rd but NOT 4th) */
    .gallery-grid:has(.gallery-item:nth-child(3)):not(:has(.gallery-item:nth-child(4))) .gallery-item:nth-child(2) .gallery-overlay {
        display: flex !important;
    }

    .gallery-grid:has(.gallery-item:nth-child(3)):not(:has(.gallery-item:nth-child(4))) .gallery-item:nth-child(n+3) {
        display: none !important;
    }

    /* 5 images only: Show 4, overlay on 4th (has 5th but NOT 6th) */
    .gallery-grid:has(.gallery-item:nth-child(5)):not(:has(.gallery-item:nth-child(6))) .gallery-item:nth-child(4) .gallery-overlay {
        display: flex !important;
    }

    .gallery-grid:has(.gallery-item:nth-child(5)):not(:has(.gallery-item:nth-child(6))) .gallery-item:nth-child(n+5) {
        display: none !important;
    }

    /* 7 images only: Show 6, overlay on 6th (has 7th but NOT 8th) */
    .gallery-grid:has(.gallery-item:nth-child(7)):not(:has(.gallery-item:nth-child(8))) .gallery-item:nth-child(6) .gallery-overlay {
        display: flex !important;
    }

    .gallery-grid:has(.gallery-item:nth-child(7)):not(:has(.gallery-item:nth-child(8))) .gallery-item:nth-child(n+7) {
        display: none !important;
    }

    /* 9+ images: Show 8, overlay on 8th (has 9th) */
    .gallery-grid:has(.gallery-item:nth-child(9)) .gallery-item:nth-child(8) .gallery-overlay {
        display: flex !important;
    }

    .gallery-grid:has(.gallery-item:nth-child(9)) .gallery-item:nth-child(n+9) {
        display: none !important;
    }
}

.section-header {
    text-align: center;
    margin-bottom: var(--space-12);
}

.section-title {
    word-break: break-word;
    font-size: 52px;
    line-height: var(--leading-tight);
    font-weight: var(--font-bold);
    margin-bottom: var(--space-2);
}

.section-subtitle {
    word-break: break-word;
    font-size: var(--text-base);
    line-height: var(--leading-normal);
    font-weight: var(--font-regular);
    margin-bottom: var(--space-4);
    color: var(--color-black-alpha-70);
}

.button-container {
    display: flex;
    justify-content: center;
    margin-top: var(--space-8);
}

.button-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    font-weight: var(--font-medium);
    background-color: transparent;
    border: 1px solid var(--color-black);
    color: var(--color-black);
    font-size: var(--text-lg);
    padding-left: var(--space-6);
    padding-right: var(--space-6);
    padding-top: var(--space-3);
    padding-bottom: var(--space-3);
    text-align: center;
    text-decoration: none;
    transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

.button-outline:hover {
    background-color: var(--color-black-alpha-10);
}

.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease;
    background-color: var(--color-black-alpha-50);
}

.modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    opacity: 0;
    transition: opacity 0.3s ease;
    padding: 1rem;
}

.modal-content {
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
    border-radius: 20px;
    overflow-x: visible;
    transform: scale(0.9);
    transition: transform 0.3s ease;
    width: 100%;
    background-color: var(--color-white);
}

.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 2rem 1rem 2rem;
}

.modal-title {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
    color: var(--color-gray-800);
}

.modal-close:hover {
    background-color: var(--color-gray-100);
}

.modal-body {
    padding: 1rem 2rem 2rem 2rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    overflow: visible;
}

.modal-submit-button {
    width: 100%;
    margin-top: var(--space-4);
    background-color: var(--color-primary-button-background);
    color: var(--color-primary-button-foreground);
}

.modal-submit-button:hover {
    background-color: var(--color-primary-button-background-hover);
    color: var(--color-primary-button-foreground-hover);
}

.carousel-card-image-container {
    background-image: linear-gradient(to bottom right, var(--color-tertiary-brand), var(--color-primary-brand));
    width: 100%;
    aspect-ratio: 1;
    overflow: hidden;
    flex-shrink: 0;
}

.carousel-card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: var(--transition-base);
}

.carousel-card-content {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.carousel-card-title {
    flex-shrink: 0;
}

.services-section .carousel-card-title {
    height: 55px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.carousel-card-button {
    cursor: pointer;
    transition: var(--transition-base);
    flex-shrink: 0;
}

.carousel-card-image:hover {
    transform: scale(1.05);
}

.dot.is-selected {
    background-color: black !important;
}


.image-frame {
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-2-xl);
    background-color: var(--color-white);
}

.image-container {
    width: 100%;
    height: 445px;
    overflow: hidden;
}

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

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

.text-white {
    color: var(--color-white) !important;
}

.carousel-section {
    scroll-margin-top: var(--header-height) !important;
    width: 100%;
    padding: var(--space-16) 0;
}

.section-container {
    max-width: var(--container-lg);
    margin: 0 auto;
    width: 100%;
    padding-inline: var(--space-8);
    padding-block: var(--space-16);
}

.header .section-container {
    padding-block: 0;
}

.testimonials-section .section-container {
    padding-block: 0;
}

.services-section .section-container {
    padding-block: 0;
}

@media (min-width: 600px) and (max-width:1024px) {
    .section-container {
        padding-inline: var(--space-24);
        padding-block: var(--space-16);
    }
}

@media (max-width: 600px) {
    .section-container {
        padding-inline: var(--space-4);
        padding-block: var(--space-16);
    }

    .testimonials-section .section-container {
        padding-inline: 0;
        padding-block: 0;
    }

    .services-section .section-container {
        padding-inline: 0;
        padding-block: 0;
    }
}

.section-heading {
    font-size: var(--text-4-xl);
    font-weight: var(--font-bold);
    margin-bottom: var(--space-4);
}

@media (max-width:1024px) {
    .section-heading {
        font-size: var(--text-3-xl);
    }
}

.section-description {
    font-size: var(--text-base);
    max-width: var(--container-md);
    margin: 0 auto;
}

#modal-phone-container {
    margin-top: var(--space-4);
}

#modal-visit-question-container {
    margin-top: var(--space-4);
}

.modal-success-container {
    padding: var(--space-8) var(--space-6);
    min-height: 300px;
}

.modal-success-container .successPage-icon-wrapper {
    margin-bottom: var(--space-4);
}

.modal-success-container .successPage-icon {
    width: 75px;
    height: 75px;
}

.modal-success-container .successPage-title {
    font-size: var(--text-2-xl);
    margin-bottom: var(--space-2);
}

.modal-success-container .successPage-message {
    font-size: var(--text-base);
    margin-bottom: var(--space-6);
}

.modal-success-container .successPage-review-section {
    padding-top: var(--space-6);
    max-width: 350px;
}

.modal-success-container .successPage-review-title {
    font-size: var(--text-base);
}

.modal-success-container .successPage-review-description {
    font-size: var(--text-sm);
    margin-bottom: var(--space-3);
}

.modal-success-container .successPage-google-review-button {
    padding: var(--space-2) var(--space-4);
    font-size: var(--text-sm);
}

.modal-success-container .successPage-google-icon {
    width: 18px;
    height: 18px;
}


.mobile-fixed-cta {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: var(--z-fixed);
    display: inline-block;
    padding: var(--space-4) var(--space-10);
    background-color: var(--color-black);
    color: var(--color-white);
    font-weight: var(--font-semibold);
    font-size: var(--text-md);
    border-radius: var(--radius-md);
    border: none;
    cursor: pointer;
    transition: var(--transition-base);
    box-shadow: 0 8px 20px var(--color-white-alpha-50);
    width: calc(100% - 40px);
}

.mobile-fixed-cta:hover {
    background-color: var(--color-black);
    transform: translateX(-50%) translateY(-2px);
    box-shadow: 0 12px 25px var(--color-primary-alpha-50);
}

.announcement-section {
    width: 100%;
    background-color: var(--color-gray-100);
    position: relative;
}

.marquee-container {
    display: block;
    width: 100%;
    overflow: hidden;
    background-color: var(--color-marquee-background);
    color: var(--color-marquee-foreground);
    cursor: pointer;
    padding: var(--space-4) 0;
}

.marquee-container:focus {
    outline: 2px solid var(--color-marquee-background);
    outline-offset: 2px;
}

.marquee-track {
    display: flex;
    width: fit-content;
    animation: marquee 30s linear infinite;
}

.marquee-content {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    padding-right: var(--space-8);
}

.marquee-text {
    color: var(--color-marquee-foreground);
    font-size: var(--text-xl);
    font-weight: var(--font-semibold);
    text-transform: uppercase;
    white-space: nowrap;
}

.marquee-separator {
    color: var(--color-marquee-foreground);
    font-size: var(--text-2-xl);
}
.marquee-separator-short-text {
    margin: var(--space-8);
}

.mobile-announcement-container {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: var(--space-12) var(--space-4);
    cursor: pointer;
}

.mobile-announcement-container:focus {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.mobile-announcement-content {
    background-color: var(--color-gray-700);
    border-top-left-radius: var(--radius-2-xl);
    border-bottom-right-radius: var(--radius-2-xl);
    padding: var(--space-10) var(--space-12);
    text-align: center;
    max-width: 90%;
    transition: var(--transition-base);
}

.mobile-announcement-content:active {
    transform: scale(0.98);
}

.mobile-announcement-heading {
    color: var(--color-marquee-foreground);
    font-size: var(--text-2-xl);
    font-weight: var(--font-bold);
    margin: 0 0 var(--space-2) 0;
    letter-spacing: 0.02em;
}

.mobile-announcement-text {
    color: var(--color-marquee-foreground);
    font-size: var(--text-xl);
    font-weight: var(--font-medium);
    margin: 0;
    letter-spacing: 0.02em;
}

.feature-section {
    scroll-margin-top: var(--header-height) !important;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--color-white);
}

.feature-section-dark {
    background-color: var(--color-black);
}

.feature-container {
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
}

.feature-container-medium {
    max-width: var(--container-lg);
}

.feature-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: var(--radius-2-xl);
    box-shadow: var(--shadow-xl);
}

.feature-card-rounded-lg {
    border-radius: var(--radius-xl);
}

.card-image-wrapper {
    width: 100%;
    min-height: 300px;
    background-color: var(--color-gray-700);
}

.card-image-wrapper-rounded {
    overflow: hidden;
    border-radius: var(--radius-md);
}

.card-image {
    width: 100%;
    height: 100%;
    min-height: 300px;
    object-fit: cover;
    display: block;
}

.card-content {
    background-color: var(--color-primary-light);
    padding: var(--space-10) var(--space-6);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.card-content-white {
    background-color: var(--color-white);
}

.card-content-primary {
    background-color: var(--color-primary-light);
}

.card-heading {
    font-size: 2.2rem;
    font-weight: var(--font-bold);
    color: var(--color-black);
    margin-bottom: var(--space-6);
    text-align: center;
}

.card-details {
    max-width: var(--container-sm);
    margin-bottom: var(--space-8);
}

.card-detail {
    font-size: var(--text-lg);
    margin-bottom: var(--space-4);
    line-height: var(--leading-relaxed);
}

.card-detail:last-child {
    margin-bottom: 0;
}

.card-text-container {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    margin-bottom: var(--space-10);
}

.card-text {
    font-size: var(--text-base);
    line-height: var(--leading-relaxed);
    color: var(--color-gray-700);
    margin: 0;
}

.card-text-large {
    font-size: var(--text-md);
}

.card-button-container {
    display: flex;
    justify-content: center;
    margin-top: var(--space-4);
}

.card-button {
    display: inline-block;
    padding: var(--space-3) var(--space-8);
    background-color: var(--color-primary-button-background);
    color: var(--color-primary-button-foreground);
    font-weight: var(--font-medium);
    font-size: 1.4rem;
    border-radius: var(--radius-lg);
    border: none;
    cursor: pointer;
    transition: var(--transition-base);
}

.card-button:hover {
    background-color: var(--color-primary-button-background-hover);
    transform: translateY(-2px);
    color: var(--color-primary-button-foreground-hover);
}

.card-button-small {
    padding: var(--space-4) var(--space-10);
    font-size: var(--text-base);
    font-weight: var(--font-semibold);
}

.text-link {
    color: var(--color-gray-500);
    cursor: pointer;
    font-weight: var(--font-semibold);
}

.text-link:hover {
    text-decoration: underline;
    color: var(--color-gray-600);
}

.feature-card-primary {
    background-color: var(--color-primary-light);
}

.feature-card-reverse {
    flex-direction: column-reverse;
}

.contact-section {
    scroll-margin-top: var(--header-height) !important;
    background-color: var(--color-workingHours-background) !important;
    color: var(--color-workingHours-foreground) !important;
}

.background-container {
    position: relative;
    width: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: var(--color-primary-light);
    max-height: fit-content;
    padding: var(--space-16) 0;
}

.background-image {
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    object-fit: cover;
    color: transparent;
    opacity: 0.8;
    max-height: 100%;
}

.background-overlay {
    opacity: 0.6;
    position: absolute;
    inset: 0px;
    background-color: var(--color-black);
}

.content-wrapper {
    position: relative;
    z-index: 10;
    border-radius: var(--radius-lg);
    margin: 0 auto;
    width: 100%;
    height: 100%;
}

.max-width-container {
    margin-left: auto;
    margin-right: auto;
    max-width: var(--container-xl);
}

.grid-layout {
    display: grid;
    gap: var(--space-4);
    padding-left: var(--space-4);
    padding-right: var(--space-4);
    grid-template-columns: repeat(12, minmax(1, 1fr));
}

.column-span {
    grid-column: span 12 / span 12;
    height: 100%;
}

.inner-grid {
    margin-top: var(--space-8);
    margin-bottom: var(--space-8);
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: var(--space-8);
    padding-left: var(--space-4);
    padding-right: var(--space-4);
}

.info-section {
    grid-column: span 12 / span 12;
}

.info-section--hours {
    order: 1;
}

.info-section--contact {
    order: 2;
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.info-box {
    display: flex;
    width: 100%;
    max-width: 28rem;
    flex-direction: column;
    justify-content: center;
    border-radius: var(--radius-lg);
    padding: var(--space-8);
    text-align: left;
    height: 100%;
    padding-left: 0;
    padding-right: 0;
    padding-top: var(--space-2);
    padding-bottom: var(--space-2);
}

.info-title {
    word-break: break-word;
    font-size: var(--text-xl);
    line-height: var(--text-2-xl);
    font-weight: var(--font-bold);
    margin-bottom: var(--space-2);
}

.hours-list {
    margin-top: var(--space-2);
}

.hours-item {
    padding-bottom: 15px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.hours-label {
    width: 50%;
}

.hours-time {
    margin-left: var(--space-1);
    width: 40%;
    flex-grow: 1;
}

.contact-info {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.contact-link {
    display: flex;
    flex-direction: row;
    gap: 0;
}

.icon-wrapper {
    display: inline-flex;
}

.contact-icon {
    margin-bottom: var(--space-1);
    margin-right: var(--space-2);
    height: var(--space-5);
    width: var(--space-5);
    flex-shrink: 0;
}

.contact-text {
    word-break: break-word;
    font-size: var(--text-base);
    text-decoration-line: underline;
}

.location-link {
    text-decoration: none;
}

.location-text {
    word-break: break-word;
    font-size: var(--text-base);
    font-style: normal;
}

.location-inner {
    display: flex;
    align-items: center;
}

.location-icon {
    margin-bottom: var(--space-1);
    margin-right: var(--space-2);
    height: var(--space-5);
    width: var(--space-5);
    flex-shrink: 0;
}


.map-iframe {
    border-radius: var(--radius-lg) !important;
}



.successPage-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--space-12) var(--space-6);
    min-height: 400px;
}

.successPage-icon-wrapper {
    margin-bottom: var(--space-6);
}

.successPage-icon {
    width: 75px;
    height: 75px;
}

.successPage-title {
    font-size: var(--text-2-xl);
    font-weight: var(--font-semibold);
    margin: 0 0 var(--space-3) 0;
}

.successPage-message {
    font-size: var(--text-lg);
    margin: 0 0 var(--space-8) 0;
    line-height: var(--leading-normal);
}

.successPage-review-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-3);
    padding-top: var(--space-8);
    border-top: 1px solid var(--color-gray-200);
    width: 100%;
    max-width: 400px;
}

.successPage-review-title {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    margin: 0;
}

.successPage-review-description {
    font-size: var(--text-sm);
    margin: 0 0 var(--space-4) 0;
    line-height: var(--leading-relaxed);
}

.successPage-google-review-button {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    background-color: #4285f4;
    color: var(--color-white);
    padding: var(--space-3) var(--space-6);
    border-radius: var(--radius-lg);
    font-size: var(--text-base);
    font-weight: var(--font-medium);
    text-decoration: none;
    transition: var(--transition-base);
    box-shadow: 0 2px 4px rgba(66, 133, 244, 0.3);
}

.successPage-google-review-button:hover {
    background-color: #3367d6;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(66, 133, 244, 0.4);
}

.successPage-google-icon {
    width: 20px;
    height: 20px;
}

.list-section-card {
    border-bottom: 1px solid var(--color-services-foreground);
    padding-bottom: var(--space-6);
}

.list-section-card:last-child {
    border-bottom: none;
}

.list-section-card-body {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-4);
}

.list-section-card-details {
    flex: 1;
}

.list-section-card-title {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--color-black);
    margin-bottom: var(--space-2);
}

.list-section-card-description {
    font-size: var(--text-sm);
    color: var(--color-gray-600);
    margin-bottom: var(--space-2);
    line-height: var(--leading-relaxed);
}

.list-section-card-meta {
    font-size: var(--text-sm);
    color: var(--color-black);
    font-weight: var(--font-medium);
}

.list-section-card-actions {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.list-section-card-image {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: var(--radius-md);
}

.list-section-card-list-section {
    background-color: var(--color-white);
}

/* Media Queries */

@media (min-width: 640px) {
    .container {
        max-width: var(--container-sm);
    }

    .inner-grid {
        margin-top: var(--space-8);
        margin-bottom: var(--space-8);
        gap: var(--space-12);
    }
}

@media (min-width: 768px) {
    .container {
        max-width: var(--container-md);
        padding: 0 var(--space-6);
    }

    .md\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .md\:grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .md\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .md\:flex-row {
        flex-direction: row;
    }

    .card-layout-double {
        grid-template-columns: 1fr 1fr;
        gap: var(--space-12);
    }

    .mobile-only {
        display: none;
    }

    .mobile-hide {
        display: block;
    }

    .desktop-only {
        display: block;
    }

    .membership-card {
        padding: var(--space-16) var(--space-12);
    }

    .pricing-text {
        font-size: var(--text-md);
    }

    .card-button-inverted {
        padding: 0.875rem var(--space-10);
        font-size: var(--text-md);
    }

    .cta-mobile-spacing {
        margin-bottom: 0;
    }


    .modal-success-container {
        padding: var(--space-10) var(--space-8);
    }

    .modal-success-container .successPage-icon {
        width: 80px;
        height: 80px;
    }

    .modal-success-container .successPage-title {
        font-size: var(--text-3-xl);
    }

    .modal-success-container .successPage-message {
        font-size: var(--text-lg);
    }

    .modal-success-container .successPage-review-title {
        font-size: var(--text-lg);
    }

    .modal-success-container .successPage-review-description {
        font-size: var(--text-base);
    }

    .modal-success-container .successPage-google-review-button {
        padding: var(--space-3) var(--space-6);
        font-size: var(--text-base);
    }

    .mobile-fixed-cta {
        display: none;
    }

    .mobile-announcement-content {
        border-radius: var(--radius-full);
        padding: var(--space-12) var(--space-16);
        max-width: 600px;
    }

    .mobile-announcement-heading {
        font-size: var(--text-3-xl);
    }

    .mobile-announcement-text {
        font-size: var(--text-2-xl);
    }

    .feature-card {
        flex-direction: row;
        min-height: 700px;
    }

    .feature-card-auto-height {
        height: auto;
    }

    .card-image-wrapper {
        width: 40%;
        border-radius: var(--radius-lg);
    }

    .card-image-wrapper-rounded {
        border-radius: var(--radius-2-xl) 0 0 var(--radius-2-xl);
    }

    .card-image-rounded {
        border-radius: var(--radius-2-xl) 0 0 var(--radius-2-xl);
    }

    .card-content {
        width: 60%;
        padding: var(--space-12);
        justify-content: center;
        text-align: left;
        align-items: flex-start;
    }

    .card-content-narrow {
        width: 50%;
    }

    .card-content-wide {
        width: 61%;
    }

    .card-content-rounded {
        border-radius: 0 var(--radius-2-xl) var(--radius-2-xl) 0;
    }

    .card-heading {
        font-size: 2.8rem;
        margin-bottom: var(--space-8);
    }

    .card-heading-left {
        text-align: left;
    }

    .card-detail {
        font-size: 1.3rem;
    }

    .card-text {
        font-size: var(--text-md);
    }

    .card-text-large {
        font-size: var(--text-lg);
    }

    .card-button {
        padding: 0.875rem var(--space-10);
    }

    .card-button-container {
        margin-top: var(--space-6);
    }

    .feature-card-primary {
        background-color: var(--color-primary);
    }

    .feature-card-reverse {
        flex-direction: row;
    }

    .column-span {
        grid-column: span 10 / span 10;
        grid-column-start: 2;
    }

    .inner-grid {
        padding-left: var(--space-8);
        padding-right: var(--space-8);
    }

    .info-section--hours {
        order: 2;
        grid-column: span 5 / span 5;
        grid-column-start: 8;
    }

    .info-section--contact {
        order: 1;
        grid-column: span 6 / span 6;
    }

    .info-box {
        padding-left: var(--space-2);
        padding-right: var(--space-2);
        padding-top: var(--space-8);
        padding-bottom: var(--space-8);
    }

    .successPage-container {
        padding: var(--space-16) var(--space-8);
    }

    .successPage-title {
        font-size: 2rem;
    }

    .successPage-message {
        font-size: var(--text-xl);
    }

    .successPage-review-title {
        font-size: var(--text-xl);
    }

    .successPage-review-description {
        font-size: var(--text-base);
    }

    #contact-column {
        grid-column: span 2;
    }
}

@media (min-width: 1024px) {
    .container {
        max-width: var(--container-lg);
        padding: 0 var(--space-8);
    }

    .lg\:grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .lg\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .heading-hero {
        font-size: var(--text-5-xl);
    }

    .text-hero {
        font-size: var(--text-xl);
    }


    .marquee-container {
        display: block;
    }

    .mobile-announcement-container {
        display: none;
    }

    .marquee-text {
        font-size: var(--text-xl);
    }

    .marquee-track {
        animation-duration: 45s;
    }

    .card-content {
        padding: var(--space-16);
    }

    .card-content-padded-left {
        padding-left: var(--space-20);
    }

    .card-heading {
        font-size: 3.4rem;
    }

    .card-heading-medium {
        font-size: var(--text-4-xl);
        margin-bottom: var(--space-8);
    }

    .card-heading-large {
        font-size: 3.5rem;
        margin-bottom: var(--space-10);
    }

    .card-text {
        font-size: var(--text-lg);
    }

    .card-text-large {
        font-size: 1.3rem;
    }

    .card-button-small {
        padding: 1.125rem var(--space-12);
        font-size: var(--text-md);
    }

    .column-span {
        grid-column: span 10 / span 10;
        grid-column-start: 2;
    }

    .inner-grid {
        margin-top: var(--space-8);
        margin-bottom: var(--space-8);
    }

    .successPage-container {
        padding: var(--space-20) var(--space-12);
    }

    .successPage-icon-wrapper {
        margin-bottom: var(--space-8);
    }

    .successPage-icon {
        width: 80px;
        height: 80px;
    }

    .successPage-title {
        font-size: 2.5rem;
        margin-bottom: var(--space-4);
    }

    .successPage-message {
        font-size: 1.5rem;
        margin-bottom: var(--space-12);
    }

    .successPage-review-section {
        gap: var(--space-4);
        padding-top: var(--space-12);
    }

    .successPage-google-review-button {
        padding: var(--space-4) var(--space-8);
        font-size: var(--text-lg);
    }

    #contact-column {
        grid-column: span 1;
    }
}

@media (min-width: 1200px) {
    .container {
        max-width: var(--container-lg);
    }

    .mobile-menu-button-container {
        display: none !important;
    }

    .mobile-menu-button-hide {
        display: none;
    }
}

@media (max-width: 767px) {
    .section-overlay {
        height: auto;
    }

    .mobile-only {
        display: block;
    }

    .mobile-hide {
        display: none;
    }

    .desktop-only {
        display: none;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .heading-section {
        font-size: var(--text-4-xl);
    }

    .text-section {
        font-size: var(--text-lg);
    }

}

@media (max-width: 768px) {
    .btn-tab {
        padding: var(--space-2) var(--space-4);
        font-size: var(--text-xs);
    }

    .country-selector {
        min-width: 80px;
        padding: 0.8rem;
    }

    .country-dropdown {
        width: 180px;
        left: -10px;
    }

    .country-option {
        padding: 10px 12px;
    }

    .input-with-icon {
        padding: 0 0.8rem;
    }

    .form-fields-column {
        flex-direction: column;
    }

    .form-options-row {
        flex-direction: row;
        gap: var(--space-3);
    }

    .section-header {
        margin-bottom: var(--space-8);
    }

    .section-title {
        font-size: 36px;
    }

    .gallery-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .modal {
        padding: 0;
        align-items: flex-end;
    }

    .modal-content {
        max-width: 100%;
        max-height: 85vh;
        margin: 0;
        border-radius: 20px 20px 0 0;
        position: relative;
    }

    .modal-header {
        padding: 1.5rem 1.5rem 1rem 1.5rem;
    }

    .modal-body {
        padding: 1.5rem;
    }

    .list-section-card-body {
        gap: var(--space-3);
    }

    .list-section-card-actions {
        width: 100%;
        justify-content: space-between;
    }

    .list-section-card-title {
        font-size: var(--text-base);
    }

    .list-section-card-description {
        font-size: var(--text-xs);
    }

    .list-section-card-meta {
        font-size: var(--text-xs);
    }

    .list-section-card-image {
        width: 60px;
        height: 60px;
    }
}

@media (max-width: 900px) {
    .carousel-nav-button {
        display: none;
    }

    .carousel-nav-button:last-of-type {
        display: flex;
        margin: var(--space-3) 0;
    }
}

@media (max-width: 1024px) {

    .section-title {
        font-size: 40px;
    }

    .section-subtitle {
        font-size: var(--text-base);
    }

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


@media screen and (min-width: 1024px) {
    .carousel-card {
        width: calc(33.333%) !important;
    }

    .carousel-container:after {
        content: 'flickity-enabled';
        display: none;
    }
}

@media screen and (min-width: 650px) and (max-width: 1023px) {
    .carousel-card {
        width: calc(50%) !important;
    }
}


@media (min-width: 1300px) {
    .carousel-section {
        padding-block: var(--space-16);
    }
}

@media (min-width: 1600px) {

    .feature-card-fixed-width {
        width: 85rem;
    }
}


@media (min-width: 1440px) {
    .marquee-container {
        padding: var(--space-5) 0;
    }
}

@media (hover: hover) {
    .marquee-container:hover .marquee-track {
        animation-play-state: paused;
    }
}

/*
============================================================
           ADDED AND MODIFIED BLOCKS
============================================================
*/

/* Hide scrollbar for all browsers */
/* Chrome, Safari and Opera */
::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}

/* Firefox */
* {
    scrollbar-width: none;
    -ms-overflow-style: none;
}

/* IE and Edge */
* {
    -ms-overflow-style: none;
}

/* Additional rules to ensure scrolling still works */
html,
body {
    scrollbar-width: none;
    -ms-overflow-style: none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}

.carousel-container {
    margin-bottom: var(--space-12);
}


@media (max-width: 480px) {
    .carousel-container {
        margin-bottom: var(--space-32) !important;
    }
}

.carousel-card {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    min-height: 300px;
    width: 90%;
    padding: 0 var(--space-2);
}

@media (min-width: 1024px) and (max-width: 1200px) {
    .carousel-card {
        min-height: 540px;
    }
}

.carousel-card-text {
    flex-grow: 1;
    overflow: hidden;
    overflow-wrap: break-word;
    hyphens: auto;
}


/* Services section carousel card styles moved to bodaland.css */

.view-all-container {
    display: flex;
    justify-content: center;
}

/* Expanded text */
.expanded-text {
    display: inline;
    opacity: 1;
    transition: opacity 0.3s ease;
}

.expanded-text.hidden {
    display: none;
}

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


.section-overlay {
    height: auto;
}

.mobile-only {
    display: block;
}

.mobile-hide {
    display: none;
}

.desktop-only {
    display: none;
}

.carousel-card {
    min-height: 450px;
    width: 78%;
}


@media (min-width: 768px) and (max-width: 1023px) {

    /* Services section responsive styles moved to bodaland.css */

    .service-button {
        padding: var(--space-3);
        font-size: var(--text-sm);
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .heading-section {
        font-size: var(--text-4-xl);
    }

    .text-section {
        font-size: var(--text-lg);
    }

    .carousel-card {
        min-height: 500px;
    }

    /* Services section tablet styles moved to bodaland.css */
}


@media screen and (min-width: 650px) and (max-width: 1023px) {
    .carousel-card {
        width: calc(50%) !important;
    }

    .carousel-container {
        margin-bottom: var(--space-24) !important;
    }
}


/*--------------flickity-related-css----------------*/
/* Flickity Carousel Instagram-style dots CSS */


.flickity-viewport {
    transition: height 0.1s ease-in-out;
    width: 100%;
}

.main-carousel {
    display: flex;
    width: 100%;
}

.flickity-prev-next-button {
    transform: translate(0, 0) !important;
    background: var(--color-catalogue-navigation-arrows-background) !important;
    color: var(--color-catalogue-navigation-arrows-foreground) !important;   
    height: 40px !important;
    width: 40px !important;
}

.flickity-prev-next-button .flickity-button-icon {
    left: 30% !important;
    top: 30% !important;
    width: 40% !important;
    height: 40% !important;
}
.flickity-prev-next-button.next {
    right: 10% !important;
}
.flickity-prev-next-button.previous{
    left: 10% !important;
}
.flickity-page-dots {
    display: block;
    white-space: nowrap;
    font-size: 0;
    position: absolute;
    width: 100%;
    bottom: -30px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    transition: text-indent 0.2s 0.15s;
}

.flickity-page-dots .dot {
    background: transparent !important;
    margin: 0 5px !important;
    /* Increased margin for more space between dots */
    display: inline-block !important;
    width: 10px !important;
    height: 10px !important;
    position: relative !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent !important;
    border: none !important;
}

/* Style the dots using ::before pseudo-element for better animation control */
.flickity-page-dots .dot::before {
    content: '' !important;
    background: #333 !important;
    border-radius: 50% !important;
    display: block !important;
    width: 10px !important;
    height: 10px !important;
    transition: transform 0.1s 0.15s, background-color 0.3s ease !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
}

/* Active dot styling */
.flickity-page-dots .dot.is-selected::before {
    background: #000 !important;
    transform: scale(1) !important;
}

/* Instagram-style overflow behavior */
.flickity-page-dots--overflow {
    left: 50% !important;
    width: 140px !important;
    /* 7 dots * 20px (10px + 10px margins) */
    margin-left: -70px !important;
    /* Half of width */
    overflow: hidden !important;
    text-align: center !important;
    /* Center the dots */
    text-indent: 0 !important;
    /* Remove text-indent to center properly */
    transition: all 0.2s 0.15s !important;
    padding: 0 20px !important;
    /* Add padding for centering */
    box-sizing: border-box !important;
}

/* Dot scaling based on position */
.flickity-page-dots--overflow .dot[data-dot="dot"]::before {
    transform: scale(1) !important;
}

.flickity-page-dots--overflow .dot[data-dot="dot--prev"]::before,
.flickity-page-dots--overflow .dot[data-dot="dot--next"]::before {
    transform: scale(0.7) !important;
}

.flickity-page-dots--overflow .dot[data-dot="dot--prev-prev"]::before,
.flickity-page-dots--overflow .dot[data-dot="dot--next-next"]::before {
    transform: scale(0.4) !important;
}

.flickity-page-dots--overflow .dot[data-dot="dot--offscreen"]::before {
    transform: scale(0.2) !important;
}

/* Responsive adjustments */
@media (max-width: 767px) {


    .flickity-page-dots .dot {
        margin: 0 3px !important;
        /* Slightly smaller margin on mobile */
    }

    .flickity-page-dots--overflow {
        width: 98px !important;
        /* 7 dots * 14px (10px + 4px margins) */
        margin-left: -49px !important;
        text-indent: 28px !important;
        /* 2 dots * 14px */
    }
}

/* Fine-tune dot appearance */
.flickity-page-dots .dot::before {
    background: rgba(0, 0, 0, 0.3);
}

.flickity-page-dots .dot.is-selected::before {
    background: rgba(0, 0, 0, 0.9);
}

/* Dark theme support */
.dark .flickity-page-dots .dot::before {
    background: rgba(255, 255, 255, 0.3);
}

.dark .flickity-page-dots .dot.is-selected::before {
    background: rgba(255, 255, 255, 0.9);
}

/* Instagram-style dots override to ensure it applies over hosted flickity.min.css */
/* Force the scaling to work by adding more specific selectors and !important */
.flickity-enabled .flickity-page-dots--overflow .dot[data-dot="dot"]::before {
    transform: scale(1) !important;
}

.flickity-enabled .flickity-page-dots--overflow .dot[data-dot="dot--prev"]::before,
.flickity-enabled .flickity-page-dots--overflow .dot[data-dot="dot--next"]::before {
    transform: scale(0.7) !important;
}

.flickity-enabled .flickity-page-dots--overflow .dot[data-dot="dot--prev-prev"]::before,
.flickity-enabled .flickity-page-dots--overflow .dot[data-dot="dot--next-next"]::before {
    transform: scale(0.4) !important;
}

.flickity-enabled .flickity-page-dots--overflow .dot[data-dot="dot--offscreen"]::before {
    transform: scale(0.2) !important;
}

/* Ensure the overflow container has the right properties */
.flickity-enabled .flickity-page-dots.flickity-page-dots--overflow {
    position: absolute !important;
    left: 50% !important;
    width: 112px !important;
    margin-left: -56px !important;
    overflow: hidden !important;
    text-align: left !important;
}

@media (max-width:768px) {
    .flickity-page-dots {
        bottom: -55px !important;
        width: 50% !important;
    }

    .flickity-prev-next-button {
        top: 107% !important;
    }
}

@media (min-width: 768px) and (max-width:1300px) {
    .flickity-prev-next-button {
        top: 105% !important;
    }
}

@media (min-width:640px) and (max-width: 1023px) {
    .flickity-prev-next-button.next {
        right: 120px !important;
    }

    .flickity-prev-next-button.previous {
        left: 120px !important;
    }

    .flickity-page-dots {
        bottom: -45px !important;
        width: 50% !important;
    }

}

@media (min-width: 1024px) {
    .flickity-page-dots {
        display: none !important;
    }
}

@media (min-width: 1301px) {
    .flickity-prev-next-button.next {
        right: -6% !important;
    }

    .flickity-prev-next-button.previous {
        left: -6% !important;
    }
}

.lightbox-carousel .flickity-viewport {
    padding: 0;
    overflow: hidden !important;
}

@media (min-width: 1024px) and (max-width:1300px) {
    .lightbox-carousel .flickity-prev-next-button {
        top: 50% !important;
    }
}

@media (min-width: 600px) and (max-width:1023px) {
    .lightbox-carousel .flickity-prev-next-button {
        top: 103% !important;
    }

    .lightbox-carousel .flickity-prev-next-button.next {
        right: 100px !important;
    }

    .lightbox-carousel .flickity-prev-next-button.previous {
        left: 100px !important;
    }
}

@media (max-width: 600px) {
    .lightbox-carousel .flickity-prev-next-button {
        display: none !important;
    }
}


/*------------------------*/
/*-----header-section-----*/
/*------------------------*/
.nav-desktop {
    display: none;
    align-items: center;
    gap: var(--space-4);
}

@media (min-width: 1200px) {

    .nav-desktop {
        display: flex;
    }
}

.nav-link {
    display: inline-block;
    font-weight: var(--font-medium);
    transition: var(--transition-fast);
    text-decoration: none;
    color: var(--color-header-foreground);
}

.nav-link:hover {
    background-color: var(--color-white-alpha-10);
}

.nav-link-desktop {
    font-size: var(--text-lg);
    padding: var(--space-2) var(--space-4);
    line-height: 1.75rem;
}

.nav-link-mobile {
    display: block;
    width: 100%;
    text-align: center;
    padding: var(--space-4);
    font-size: var(--text-md);
    border-radius: var(--radius-md);
    transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);
    transform: translateY(-100%);
    opacity: 0;
}

.mobile-menu {
    position: absolute;
    left: 0;
    right: 0;
    top: 80px;
    overflow: hidden;
    transition: max-height 200ms cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 40;
    max-height: 0px;
    background-color: var(--color-header-background);
}

.mobile-menu-content {
    padding: var(--space-4) 100px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-2);
}

.header-overlay {
    position: fixed;
    inset: 0;
    top: 80px;
    z-index: 40;
    transition: opacity 200ms ease;
    pointer-events: none;
    opacity: 0;
}

.header-fixed {
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 50;
    box-shadow: var(--shadow-xs);
    transition: var(--transition-material);
}

.header-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: var(--header-height);
}

.logo-container {
    height: 80px;
    display: flex;
    align-items: center;
    justify-content:flex-start;
    flex: 1;
}

.logo-link {
    display: flex;
    height: 90%;
    align-items: center;
    padding: var(--space-4) 0;
}

.logo-image {
    object-fit: contain;
    width: auto;
    height: 70px;
    max-width: 100%;
}

.fixed-cta {
    position: fixed !important;
    bottom: 10px;
    z-index: 100;
    width: calc(100% - 20px);
    box-shadow: var(--shadow-xl);
}

@media (max-width: 767px) {
    .fixed-cta {
        display: block !important;
    }
}

@media (min-width: 768px) {
    .logo-container {
        height: 100px;
    }

    .fixed-cta {
        display: none !important;
    }
}

.header {
    background-color: var(--color-header-background);
    color: var(--color-header-foreground);
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.7);
    -webkit-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.7);
    -moz-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.7);
}

/* Common Button Styles */
.header-cta-desktop {
    background-color: var(--color-header-cta-background);
    color: var(--color-header-cta-foreground);
    padding: var(--space-2) var(--space-6);
    font-size: var(--text-lg);
    font-weight: var(--font-medium);
    cursor: pointer;
    position: relative;
    overflow: hidden;
    text-transform: capitalize;
    letter-spacing: 0.02em;
    z-index: 1;
    border-radius: 50px;
}

.header-cta-desktop::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    color: var(--color-header-cta-foreground-hover);
    background: var(--color-header-cta-background-hover);
    border-color: var(--color-header-cta-background);
    transition: left 0.3s ease;
    z-index: -1;
}

.header-cta-desktop:hover {
    color: var(--color-header-cta-foreground-hover);
    background: var(--color-header-cta-background-hover);
    transform: none !important;
}

.header-cta-desktop:hover::before {
    left: 0;
}

.header-cta-desktop:focus {
    outline: 2px solid var(--color-header-cta-background);
    outline-offset: 2px;
}

/* Responsive button adjustments */
@media (min-width: 1440px) {
    .header-cta-desktop {
        font-size: var(--text-lg);
    }
}

.header-cta-mobile {
    min-width: 10rem;
    margin-top: var(--space-2);
    margin-bottom: var(--space-4);
    transform: translateY(-100%);
    opacity: 0;
    transition: var(--transition-material);
}

/* Common Button Styles */
.header-cta-mobile {
    background-color: var(--color-header-cta-background);
    color: var(--color-header-cta-foreground);
    padding: var(--space-3) var(--space-8);
    font-size: var(--text-md);
    font-weight: var(--font-medium);
    cursor: pointer;
    position: relative;
    overflow: hidden;
    text-transform: capitalize;
    letter-spacing: 0.02em;
    z-index: 1;
    border-radius: 50px;
}

.header-cta-mobile::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background-color: var(--color-primary-button-background);
    transition: left 0.3s ease;
    z-index: -1;
}

.header-cta-mobile:hover {
    color: var(--color-primary-button-foreground);
    background: var(--color-primary-button-background-hover);
    border-color: var(--color-primary-button-background-hover);
}

.header-cta-mobile:hover::before {
    left: 0;
}

.header-cta-mobile:focus {
    outline: 2px solid var(--color-primary-button-background-hover);
    outline-offset: 2px;
}


.mobile-menu-button-container {
    display: flex;
    justify-content: flex-end;
}

.header-overlay-dark {
    background-color: var(--color-black-alpha-50);
}

.mobile-cta-button-container-fallback[data-enable-google-reviews-fab='false'],
.mobile-cta-button-container-fallback[data-enable-google-reviews-fab='none'] {
  display: flex;
  justify-content: center;
  width: 100%;
}

.mobile-cta-button-container-fallback[data-enable-google-reviews-fab='false'] .fab-cta-button,
.mobile-cta-button-container-fallback[data-enable-google-reviews-fab='none'] .fab-cta-button {
  background-color: var(--color-floating-cta-background);
  box-shadow: var(--color-white) 0px 8px 20px;
  color: var(--color-floating-cta-foreground);
  padding: 15px;
  margin-inline: 0;
}

.mobile-cta-button-container-fallback[data-enable-google-reviews-fab='false'] .fab-cta-button:hover,
.mobile-cta-button-container-fallback[data-enable-google-reviews-fab='none'] .fab-cta-button:hover {
  background-color: var(--color-gray-800);
}

.mobile-cta-button-container-fallback[data-enable-google-reviews-fab='true'],
.mobile-cta-button-container-fallback[data-enable-google-reviews-fab='flex'] {
  display: none;
}

.mobile-cta-button-container[data-enable-google-reviews-fab='false'],
.mobile-cta-button-container[data-enable-google-reviews-fab='none'] {
  display: none;
}

.fab-cta-button {
    background-color: var(--color-floating-cta-background);
    box-shadow: var(--color-white-alpha-50) 0px 8px 20px;
    color: var(--color-floating-cta-foreground);
    font-weight: var(--font-bold);
    font-size: var(--text-xl);
    padding: var(--space-6) var(--space-4);
    border-radius: 40px;
}

.header-spacer {
    width: 100%;
    height: var(--header-height);
}

.toggle-button {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    padding: 0.8rem;
    border: 1px solid currentColor;
    border-radius: 12px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: center;
}

.menu-button {
    position: relative;
    display: flex;
    height: 3rem;
    width: 3rem;
    transition: all 150ms ease;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
    color: var(--color-header-foreground);
}

.menu-button:active {
    border-radius: var(--radius-sm);
    background-color: var(--color-white-alpha-50);
}

.menu-icon {
    position: absolute;
    top: 50%;
    transition: all 150ms ease;
}

.menu-icon svg {
    height: 3rem;
    width: 3rem;
}

.menu-icon-open {
    transform: translateY(-50%);
    opacity: 1;
}

.menu-icon-close {
    transform: translateY(-50%) rotate(-90deg);
    opacity: 0;
}

/*------------------------*/
/*-----Footer-section-----*/
/*------------------------*/

.footer-section {
    background-color: var(--color-footer-background);
    color: var(--color-footer-foreground);
    width: 100%;
}

.footer-list-item {
    font-size: var(--text-base);
    line-height: var(--leading-normal);
    text-decoration: none;
}

.footer-heading {
    font-size: var(--text-xl);
    font-weight: var(--font-semibold);
    margin-bottom: var(--space-6);
    margin-top: 0;
}

.footer-link {
    transition: var(--transition-base);
    display: inline-block;
    padding: var(--space-2);
    border: 1px solid var(--color-footer-foreground);
}

.footer-contact-link {
    text-decoration: none;
    transition: var(--transition-base);
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-top: var(--space-4);
}

.footer-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    min-width: 16px;
    width: 24px;
    height: 24px;
    margin-top: 0px;
}

.footer-icon svg {
    width: 100%;
    height: 100%;
}


@media (min-width: 1024px) {
    .footer-heading {
        font-size: 1.75rem;
    }
}


/*------------------------*/
/*-----testimonials-section-----*/
/*------------------------*/

.testimonials-section {
    scroll-margin-top: var(--header-height) !important;
    background-color: var(--color-testimonials-background);
    color: var(--color-testimonials-foreground);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: var(--space-16) 0 var(--space-16) 0;
    height: auto !important;
    min-height: auto !important;
}

.testimonials-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: visible !important;
    height: auto !important;
}

.testimonials-header {
    margin-bottom: var(--space-6);
    text-align: center;
}

.testimonials-heading {
    font-size: var(--text-4-xl);
    margin-bottom: var(--space-3);
    margin-top: 0;
    font-weight: 700;
}

.testimonials-subheading {
    font-size: var(--text-lg);
    margin: 0;
    max-width: 700px;
    line-height: 1.6;
}

/* Carousel styles */
.testimonials-carousel {
    width: 100%;
    max-width: var(--container-lg);
    overflow: visible !important;
    height: auto !important;
    min-height: auto !important;
}

.testimonials-carousel-cell {
    width: 100%;
    overflow: visible !important;
    height: auto !important;
    min-height: 480px;
}

.testimonial-cell-container {
    min-height: 480px;
    height: auto;
    display: flex;
    gap: var(--space-4);
    flex-wrap: wrap;
}

/* Testimonial card styles */
.testimonial-card {
    background: var(--color-testimonials-card-background);
    color: var(--color-testimonials-card-foreground);
    padding: var(--space-8);
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 280px;
    height: auto;
    transition: all 0.3s ease-in-out;
    min-width: 290px;
}

.testimonial-card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

/* Rating container */
.testimonial-rating {
    display: flex;
    align-items: center;
    margin-bottom: var(--space-4);
}

/* Google icon */
.google-icon {
    margin-right: var(--space-2);
    min-width: 32px;
    height: 32px;
}

/* Stars container */
.stars-container {
    font-size: var(--text-lg);
    letter-spacing: 2px;
    display: flex;
    gap: 2px;
}

/* Star icon - reusable for all stars */
.star-icon {
    color: var(--color-gold);
    font-size: 20px;
}

/* Hide 5th star for 4-star reviews */
.star-icon[data-star-five="false"] {
    display: none;
}

/* Testimonial text */
.testimonial-text {
    font-size: var(--text-base);
    margin: 0 0 18px 0;
    line-height: var(--leading-normal);
    overflow: visible;
    word-wrap: break-word;
    hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    flex: 1;
}
.testimonial-text span {
    white-space: unset !important;
}

.testimonial-text span br {
  display: none;
}

/* Expanded text */
.expanded-text {
    transition: all 0.3s ease;
}

.expanded-text.hidden {
    display: none;
}

/* Author section */
.testimonial-author {
    display: flex;
    align-items: center;
    margin-top: auto;
}

/* Author avatar - base styles */
.author-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--color-primary-button-background);
    color: var(--color-primary-button-foreground);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: var(--font-semibold);
    font-size: var(--text-lg);
    margin-right: 14px;
}


/* Author initials */
.author-initials {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
}

/* Author info */
.author-info {
    display: flex;
    flex-direction: column;
}

.author-name {
    font-size: var(--text-md);
    font-weight: var(--font-medium);
    margin: 0;
}

.review-date {
    font-size: var(--text-sm);
    margin: 0;
}
/* to make review card null */
/* 1️⃣ Hide the specific card completely */
#testimonial-card-2_0[data-review-display-2="false"] {
  display: none !important;
}

/* 2️⃣ For all other testimonial cards, just hide visually */
.testimonial-card[data-review-display-2="false"]:not(#testimonial-card-2_0) {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}
/* Hide both initials and image by default */
.author-avatar .author-initials,
.author-avatar .author-image {
  display: none;
}

/* 🖼️ Image styling — visible only when valid and flagged true */
.author-avatar .author-image[data-author-image="true"][src]:not([src=""]):not([src="none"]) {
  display: block;
  object-fit: cover;
  width: 44px;
  height: 44px;
  border-radius: 50%;
}

/* 🔤 Show initials when explicitly true */
.author-avatar .author-initials[data-author-initials="true"] {
  display: block;
}

/* ✅ When a valid image exists inside, reset parent background */
.author-avatar:has(.author-image[data-author-image="true"][src]:not([src=""]):not([src="none"])) {
  background: inherit !important;
}

/* Responsive styles */
@media (max-width: 1024px) {
    .testimonials-carousel-cell {
        height: auto !important;
        min-height: auto !important;
    }

    .testimonial-cell-container {
        height: auto !important;
    }

    .testimonials-section {
        height: auto !important;
        min-height: auto !important;
    }
}

@media (max-width: 767px) {
    .testimonial-cell-container {
        flex-direction: column;
        height: auto !important;
        min-height: auto !important;
    }

    .testimonial-card {
        height: auto !important;
        min-height: 300px !important;
    }

    .testimonials-carousel-cell {
        padding: 0.75rem;
        height: auto !important;
        min-height: auto !important;
        width: 98%;
    }
}

@media (max-width: 600px) {
    .testimonials-section {
        padding: var(--space-16) 0 var(--space-16) 0;
        height: auto !important;
        min-height: auto !important;
    }

    .testimonials-container {
        padding: var(--space-6) 0 0 0;
    }

    .testimonials-heading {
        font-size: var(--text-2-xl);
    }

    .testimonial-card {
        min-width: 0;
        padding: var(--space-5);
        height: auto !important;
        min-height: 230px !important;
    }
}

@media (min-width: 768px) and (max-width: 1200px) {
    .testimonial-card {
        min-height: 265px !important;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .testimonials-heading {
        font-size: var(--text-4-xl);
    }

    .testimonials-subheading {
        font-size: var(--text-lg);
    }
}

/* Override Flickity viewport for testimonials */
.testimonials-carousel .flickity-viewport {
    transition: height 0.3s ease-in-out !important;
}

.testimonials-carousel .flickity-prev-next-button {
    background: var(--color-testimonials-navigation-arrows) !important;
}

.testimonials-carousel .carousel-cell {
    overflow: visible !important;
}

/* Testimonials Section Carousel - Center and Hide Navigation for Few Items */
/* Default carousel cell spacing to match services section */

/* Desktop: Hide navigation buttons when 1-3 carousel cells (6 or fewer testimonials) */
@media (min-width: 1024px) {

    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(4))) .flickity-prev-next-button {
        display: none !important;
    }

    /* Hide dots when 1-3 carousel cells */
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(4))) .flickity-page-dots {
        display: none !important;
    }

    /* When 1 carousel cell (2 testimonials) - center using Flickity viewport */
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-viewport {
        width: 900px;
        margin: 0 auto;
    }

    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .testimonials-carousel-cell {
        width: 100% !important;
        margin-right: 0 !important;
    }

    /* When only 1 carousel cell with 2 cards - ensure they display side by side */
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .testimonial-cell-container {
        display: flex !important;
        flex-direction: row !important;
        gap: var(--space-6) !important;
        justify-content: center !important;
        min-height: auto !important;
        height: auto !important;
    }

    /* Also adjust the carousel cell height */
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .testimonials-carousel-cell {
        min-height: auto !important;
    }

    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .testimonial-card {
        flex: 0 1 380px !important;
        max-width: 380px !important;
    }

    /* When 2 carousel cells (4 testimonials) - center using Flickity viewport */
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(2)):not(:has(.carousel-cell:nth-child(3))) .flickity-viewport {
        width: 900px;
        margin: 0 auto;
    }

    /* Adjust card width to 50% - space-2 when there are exactly 4 cards (2 carousel cells) */
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(2)):not(:has(.carousel-cell:nth-child(3))) .carousel-card {

        width: calc(50% - var(--space-2)) !important;
    }
}

/* Tablet: Hide navigation buttons when 1-2 carousel cells */
@media (min-width: 768px) and (max-width: 1023px) {
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(3))) .flickity-prev-next-button {
        display: none !important;
    }

    /* Hide dots when 1-2 carousel cells */
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(3))) .flickity-page-dots {
        display: none !important;
    }

    /* When 1 carousel cell - center using Flickity viewport */
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-viewport {
        width: 625px;
        margin: 0 auto;
    }

    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .testimonials-carousel-cell {
        width: 100% !important;
        margin-right: 0 !important;
    }

    /* When only 1 carousel cell with 2 cards - ensure they display side by side */
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .testimonial-cell-container {
        display: flex !important;
        flex-direction: row !important;
        gap: var(--space-4) !important;
        justify-content: center !important;
        min-height: auto !important;
        height: auto !important;
    }

    /* Also adjust the carousel cell height */
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .testimonials-carousel-cell {
        min-height: auto !important;
    }

    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .testimonial-card {
        flex: 0 1 340px !important;
        max-width: 340px !important;
    }

    /* When 2 carousel cells (4 testimonials) - center using Flickity viewport and hide controls */
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(2)):not(:has(.carousel-cell:nth-child(3))) .flickity-prev-next-button {
        display: none !important;
    }

    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(2)):not(:has(.carousel-cell:nth-child(3))) .flickity-page-dots {
        display: none !important;
    }

    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(2)):not(:has(.carousel-cell:nth-child(3))) .flickity-viewport {
        width: 625px;
        margin: 0 auto;
    }

    /* Adjust card width to 50% - space-2 when there are exactly 4 cards (2 carousel cells) */
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(2)):not(:has(.carousel-cell:nth-child(3))) .carousel-card {
        width: calc(50% - var(--space-2)) !important;
    }
}

/* Mobile: Hide navigation buttons when only 1 carousel cell (2 cards) */
@media (max-width: 767px) {
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-prev-next-button {
        display: none !important;
    }

    /* Hide dots when only 1 carousel cell (2 cards) */
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-page-dots {
        display: none !important;
    }

    /* When 1 carousel cell - center using Flickity viewport */
    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-viewport {
        width: 90%;
        max-width: 400px;
        margin: 0 auto;
    }

    .testimonials-section .testimonials-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .testimonials-carousel-cell {
        width: 100% !important;
        margin-right: 0 !important;
    }
}

/*------------------------*/
/*-----faq-section-----*/
/*------------------------*/

.faq-section {
    scroll-margin-top: var(--header-height) !important;
    width: 100%;
    background-color: var(--color-faqs-background) !important;
    color: var(--color-faqs-foreground) !important;
}

.faq-container {
    max-width: 1000px;
}

.accordion-container {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.accordion-item:not(:last-child) {
    border-bottom: 1px solid var(--color-faqs-foreground);
}

.accordion-button {
    width: 100%;
    display: flex;
    align-items: center;
    text-align: left;
    padding: var(--space-5) 0;
    background: none;
    border: none;
    cursor: auto;
    font-size: var(--text-lg);
    font-weight: var(--font-medium);
    transition: var(--transition-base);
}

.accordion-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    margin-right: var(--space-4);
    background-color: var(--color-faqs-icon-background);
    border-radius: 50%;
    color: var(--color-faqs-icon-foreground);
    transition: transform 0.3s ease;
}

.accordion-question {
    flex: 1;
    text-align: left;
    color: var(--color-faqs-foreground) !important;
}

.accordion-content {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: all 0.3s ease;
    padding: 0 2.25rem 0 2.25rem;
}

.accordion-answer {
    font-size: var(--text-base);
    line-height: var(--leading-relaxed);
    padding-bottom: var(--space-8);
    margin: 0;
}

@media (min-width: 768px) {
    .accordion-button {
        font-size: var(--text-xl);
    }

    .accordion-answer {
        font-size: var(--text-lg);
    }
}

@media (max-width: 767px) {
    .accordion-icon {
        width: 30px;
        height: 30px;
    }
}

/*------------------------*/
/*-----services-section-----*/
/*------------------------*/

.carousel-card:hover {
    transform: translateY(-8px);
}

.carousel-card-image-container {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    min-height: 300px;
    background-image: linear-gradient(to bottom right, var(--color-tertiary-brand), var(--color-primary-brand));
}

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

.carousel-card:hover .carousel-card-image {
    transform: scale(1.05);
}

.carousel-card-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg,
            rgba(0, 0, 0, 0.7) 0%,
            rgba(0, 0, 0, 0.4) 50%,
            rgba(0, 0, 0, 0.6) 100%);
    display: flex;
    align-items: flex-end;
    padding: var(--space-6);
    color: var(--color-white);
    min-height: 300px;
}

.carousel-card-content {
    width: 100%;
    position: relative;
    min-height: 120px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.carousel-card-title {
    font-size: var(--text-xl);
    font-weight: var(--font-bold);
    margin: 0 0 var(--space-3) 0;
    color: var(--color-white);
}

.carousel-card-text {
    font-size: var(--text-sm);
    line-height: 1.5;
    margin: 0 0 var(--space-4) 0;
    color: rgba(255, 255, 255, 0.9);
    overflow: visible !important;
    word-wrap: break-word;
    hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    display: block !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: unset !important;
    text-overflow: unset !important;
    position: relative;
    transition: all 0.4s ease-in-out;
}

.carousel-card-button {
    background-color: transparent;
    color: var(--color-white);
    border: 2px solid var(--color-white);
    padding: var(--space-2) var(--space-4);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.carousel-card-button:hover {
    background-color: var(--color-white);
    color: var(--color-text-primary);
}

.carousel-card-plus-button {
    position: absolute;
    top: var(--space-4);
    right: var(--space-4);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.9);
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    color: var(--color-text-primary);
}

.carousel-card-plus-button:hover {
    background-color: var(--color-white);
    transform: scale(1.1);
}

.plus-icon {
    width: 18px;
    height: 18px;
}

/* Text expansion functionality moved from page.css */
.expanded-text {
    display: inline;
    position: relative;
}

.expanded-text.hidden {
    display: none;
}

.more-text {
    cursor: pointer;
    font-weight: var(--font-medium);
    transition: color 0.3s ease;
    font-size: var(--text-base);
    user-select: none;
}


/* Responsive adjustments for carousel cards */
@media (min-width: 768px) {
    .carousel-card {
        width: 360px;
        height: 450px;
        min-height: 450px;
    }

    .carousel-card-image-container {
    background-image: linear-gradient(to bottom right, var(--color-tertiary-brand), var(--color-primary-brand));
        min-height: 350px;
    }

    .carousel-card-overlay {
        padding: var(--space-8);
        min-height: 350px;
    }

    .carousel-card-content {
        min-height: 140px;
    }

    .carousel-card-title {
        font-size: var(--text-2-xl);
    }

    .carousel-card-text {
        font-size: var(--text-base);
    }
}

@media (min-width: 1024px) {
    .carousel-card {
        width: 380px;
        height: 380px;
        min-height: 380px;
    }

    .carousel-card-image-container {
    background-image: linear-gradient(to bottom right, var(--color-tertiary-brand), var(--color-primary-brand));
        min-height: 250px;
    }

    .carousel-card-overlay {
        min-height: 250px;
    }

    .carousel-card-content {
        min-height: 160px;
    }
}

/* Mobile responsive adjustments moved from page.css */
@media (max-width: 767px) {
    .carousel-card-content {
        min-height: auto;
        padding: var(--space-5);
    }

    .carousel-card-title {
        font-size: 1.3rem;
        margin-bottom: var(--space-2);
    }

    .carousel-card-text {
        font-size: var(--text-sm);
        margin-bottom: var(--space-4);
    }
}

/* Tablet responsive adjustments moved from page.css */
@media (min-width: 768px) and (max-width: 1023px) {
    .carousel-card-content {
        min-height: auto;
    }
}

/* ================== Services Section Carousel Styles ================== */
/* Class-based CSS for iterable service cards */
.services-section {
    background-color: var(--color-catalogue-background);
    color: var(--color-catalogue-foreground);
}

.service-button {
    display: inline-block;
    width: fit-content;
    padding: var(--space-4);
    background-color: var(--color-primary-button-background);
    color: var(--color-secondary-button-foreground);
    border: 1px solid var(--color-black);
    font-weight: var(--font-medium);
    font-size: var(--text-base);
    border-radius: var(--radius-md);
    text-align: center;
}

.service-button:hover {
    background-color: var(--color-primary-button-background-hover);
    color: var(--color-primary-button-foreground-hover);
}

.services-section .service-card {
    position: relative;
    width: 380px;
    height: 100%;
    min-height: 420px;
    overflow: hidden;
    transition: all 0.3s ease;
}

/* Card hover transform removed - overlay expands only on overlay hover */

.services-section .service-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 3/4;
}

.services-section .service-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 var(--space-2);
    background: color-mix(in srgb, var(--color-services-overlay) 80%, transparent);
    padding: var(--space-4) var(--space-4);
    color: var(--color-services-overlay-foreground);
    transition: height 0.4s cubic-bezier(0.4, 0, 0.2, 1), padding 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    height: 160px;
    min-height: 140px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: space-between;
    cursor: pointer;
}

.services-section .service-overlay:hover {
    height: 85%;
    padding-bottom: var(--space-6);
    justify-content: space-between;
}

.services-section .service-card.expanded .service-overlay {
    height: 85%;
    padding-bottom: var(--space-6);
    justify-content: space-between;
}


.services-section .service-toggle {
    position: absolute;
    top: -24px;
    left: 50%;
    transform: translateX(-50%);
    width: var(--space-12);
    height: var(--space-12);
    background-color: white;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    box-shadow: var(--shadow-md);
    z-index: 10;
}

.services-section .service-overlay:hover .service-toggle {
    top: -24px;
    left: 50%;
    transform: translateX(-50%);
    border: none;
}

.services-section .service-toggle:hover {
    transform: translateX(-50%);
}

.services-section .service-overlay:hover .service-toggle:hover {
    transform: translateX(-50%);
}

.services-section .plus-icon {
    color: var(--color-gray-900);
    display: block;
}

.services-section .close-icon {
    color: var(--color-gray-900);
    display: none;
}

.services-section .service-overlay:hover .plus-icon,
.services-section .service-card.expanded .plus-icon {
    display: none;
}

.services-section .service-overlay:hover .close-icon,
.services-section .service-card.expanded .close-icon {
    display: block;
}

.service-detail-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.services-section .service-title {
    display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
        font-size: var(--text-xl);
        font-weight: var(--font-bold);
        margin-bottom: var(--space-2);
        transition: font-size 0.3s ease;
        white-space: pre-wrap;
        padding-top: 8px;
}

/* Truncate title on hover/expand to 2 lines */
.services-section .service-overlay:hover .service-title,
.services-section .service-card.expanded .service-title {
    white-space: normal;
    overflow: hidden;
    max-width: none;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}


.services-section .service-description {
    font-size: var(--text-base);
    line-height: 1.6;
    opacity: 0.95;
    margin: 0;
    transition: margin-bottom 0.3s ease;
    /* Text truncation when not expanded */
    display: block;
    max-height: 3.2em;
    overflow: hidden;
    position: relative;
}

/* Adjust truncation on hover/expand to ensure button is visible */
.services-section .service-overlay:hover .service-description,
.services-section .service-card.expanded .service-description {
    max-height: 11rem;
    overflow: hidden;
}

.services-section .service-short {
    display: inline;
}

.services-section .service-expanded {
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease 0.1s;
}

/* Show expanded text beside the short description on hover/expand */
.services-section .service-overlay:hover .service-expanded,
.services-section .service-card.expanded .service-expanded {
    display: inline;
    opacity: 1;
}

/* Keep the short description visible */
.services-section .service-overlay:hover .service-short,
.services-section .service-card.expanded .service-short {
    display: inline;
}

/* Hide less text when service-more is empty */
/* Structure: p > span.service-short > span.service-more + span.service-expanded > span.service-less */

/* For mobile expanded state */
.services-section .service-card.expanded .service-short:has(.service-more:empty)~.service-expanded .service-less {
    display: none !important;
}

/* Desktop: Hide less text on hover when service-more is empty */
@media (min-width: 1024px) {
    .services-section .service-overlay:hover .service-short:has(.service-more:empty)~.service-expanded .service-less {
        display: none !important;
    }
}

/* Tablet: Hide less text on hover when service-more is empty */
@media (min-width: 768px) and (max-width: 1023px) {
    .services-section .service-overlay:hover .service-short:has(.service-more:empty)~.service-expanded .service-less {
        display: none !important;
    }
}

.services-section .service-more {
    font-style: italic;
    opacity: 0.9;
    cursor: pointer;
    color: rgba(255, 255, 255, 1);
    display: inline;
    margin-left: 0.25em;
    font-weight: 500;
}

.services-section .service-less {
    font-style: italic;
    opacity: 0.8;
    cursor: pointer;
    font-weight: bold;
    display: none;
    /* Hidden by default */
}

/* Hide more when expanded */
.services-section .service-overlay:hover .service-more,
.services-section .service-card.expanded .service-more {
    display: none;
}

.services-section .service-overlay:hover .service-less,
.services-section .service-card.expanded .service-less {
    display: inline;
}

.services-section .service-view-btn {
    border-radius: var(--space-8);
    padding: var(--space-3) var(--space-8);
    border: 2px solid var(--color-services-overlay-foreground);
    background-color: transparent;
    color: var(--color-services-overlay-foreground);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: none;
    opacity: 0;
    margin-top: var(--space-2);
}

.services-section .service-overlay:hover .service-view-btn,
.services-section .service-card.expanded .service-view-btn {
    display: inline-block;
    opacity: 1;
    transition: opacity 0.3s ease 0.2s, background-color 0.3s ease, color 0.3s ease;
}

/* Flickity overrides for services section */


/* Responsive styles for services section */

@media (max-width: 768px) {
    .services-section .carousel-cell {
        width: 85vw;
        max-width: 345px;
    }

    .services-section .service-card {
        width: 100%;
        min-height: 390px;
    }

    .services-section .service-title {
        font-size: 1.75rem;
        max-width: 22ch;
    }

    .services-section .service-overlay:hover .service-title,
    .services-section .service-card.expanded .service-title {
        font-size: 2rem;
    }
}


/* ServicesSection.jsx - Hide carousel controls and center cards based on count */

/* Desktop: Hide controls when 1-3 cards */
@media (min-width: 1024px) {

    /* Hide prev/next buttons when 1-3 cards */
    .services-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(4))) .flickity-prev-next-button {
        display: none !important;
    }

    /* Hide dots when 1-3 cards */
    .services-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(4))) .flickity-page-dots {
        display: none !important;
    }

    /* When 1 card - center using Flickity viewport */
    .services-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-viewport {
        width: 380px;
        margin: 0 auto;
    }

    .services-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .carousel-card {
        width: 100% !important;
        margin-right: 0 !important;
    }

    /* When 2 cards - center using Flickity viewport */
    .services-section .main-carousel:has(.carousel-cell:nth-child(2)):not(:has(.carousel-cell:nth-child(3))) .flickity-viewport {
        width: 800px;
        margin: 0 auto;
    }

    .services-section .main-carousel:has(.carousel-cell:nth-child(2)):not(:has(.carousel-cell:nth-child(3))) .carousel-card {
        width: 380px !important;
        margin-right: 40px !important;
    }
}

/* Tablet: Hide controls when 1-2 cards */
@media (min-width: 768px) and (max-width: 1023px) {
    .services-section .service-title {
        font-size: 1.75rem;
        max-width: 16ch;
    }

    /* Hide prev/next buttons when 1-2 cards */
    .services-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(3))) .flickity-prev-next-button {
        display: none !important;
    }

    /* Hide dots when 1-2 cards */
    .services-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(3))) .flickity-page-dots {
        display: none !important;
    }

    /* When 1 card - center using Flickity viewport */
    .services-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-viewport {
        width: 380px;
        margin: 0 auto;
    }

    .services-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .carousel-card {
        width: 100% !important;
        margin-right: 0 !important;
    }

    /* When 2 cards - center using Flickity viewport */
    .services-section .main-carousel:has(.carousel-cell:nth-child(2)):not(:has(.carousel-cell:nth-child(3))) .flickity-viewport {
        width: 780px;
        margin: 0 auto;
    }

    .services-section .main-carousel:has(.carousel-cell:nth-child(2)):not(:has(.carousel-cell:nth-child(3))) .carousel-card {
        width: 380px !important;
        margin-right: 20px !important;
    }
}

/* Mobile: Hide controls when 1 card and center it */
@media (max-width: 767px) {

    /* Hide prev/next buttons when only 1 card */
    .services-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-prev-next-button {
        display: none !important;
    }

    /* Hide dots when only 1 card */
    .services-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-page-dots {
        display: none !important;
    }

    /* When 1 card - center using Flickity viewport */
    .services-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-viewport {
        width: 90%;
        max-width: 320px;
        margin: 0 auto;
    }

    .services-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .carousel-card {
        width: 100% !important;
        margin-right: 0 !important;
    }

    /* Disable hover effects on mobile - only use click */
    .services-section .service-card:hover .service-overlay {
        height: 140px;
        padding: var(--space-4) var(--space-4);
        justify-content: space-between;
    }

    .services-section .service-card:hover .service-description {
        margin-bottom: 0;
    }

    .services-section .service-card:hover .service-short {
        display: inline;
    }

    .services-section .service-card:hover .service-expanded {
        display: none;
        opacity: 0;
    }

    .services-section .service-card:hover .service-view-btn {
        display: none;
        opacity: 0;
    }

    .services-section .service-card:hover .plus-icon {
        display: block;
    }

    .services-section .service-card:hover .close-icon {
        display: none;
    }

    /* Mobile expanded state - when clicked */
    .services-section .service-card.expanded .service-overlay {
        height: 85%;
        padding-bottom: var(--space-6);
        justify-content: space-between;
    }

    .services-section .service-card.expanded .service-description {
        margin-bottom: var(--space-6);
        max-height: 6.4em;
        overflow: hidden;
    }

    .services-section .service-card.expanded .service-short {
        display: inline;
    }

    .services-section .service-card.expanded .service-expanded {
        display: inline;
        opacity: 1;
    }

    .services-section .service-card.expanded .service-title {
        white-space: normal;
        max-width: none;
    }

    .services-section .service-card.expanded .service-view-btn {
        display: inline-block;
        opacity: 1;
    }

    .services-section .service-card.expanded .plus-icon {
        display: none;
    }

    .services-section .service-card.expanded .close-icon {
        display: block;
    }
}


.services-section .service-card-wrapper {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}



/*-------------------------------------------*/
/* bodalnd styled View-all-button styleing */
/*-------------------------------------------*/

/* View All Services Button */
.view-all-button {
    /* Size - slightly reduced */
    padding: var(--space-5) var(--space-6);
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);

    /* Fully rounded */
    border-radius: var(--radius-full);
    min-width: 380px;

    /* Colors - inverted from hero button */
    background-color: var(--color-catalogue-view-all-cta-background);
    color: var(--color-catalogue-view-all-cta-foreground);
    border: 3px solid var(--color-catalogue-view-all-cta-hover-background);

    /* Layout */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* Default: center */

    /* Interaction */
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    z-index: 1;
}

/* When it has exactly 2 children */
.view-all-button:has(> :nth-child(2)):not(:has(> :nth-child(3))) {
    justify-content: space-between;
}

.view-all-button::before {
    content: '';
    position: absolute;
    top: 0;
    right: 100%;
    width: 100%;
    height: 100%;
    background-color: var(--color-catalogue-view-all-cta-hover-background);
    color:var(--color-catalogue-view-all-cta-hover-foreground);
    transition: right 0.3s ease;
    z-index: -1;
}

.view-all-button:hover {
    background-color: var(--color-catalogue-view-all-cta-hover-background);
    color: var(--color-catalogue-view-all-cta-hover-foreground);
}

.view-all-button:hover::before {
    right: 0;
}

.view-all-button:focus {
    outline: 2px solid var(--color-catalogue-view-all-cta-hover-background);
    color: var(--color-catalogue-view-all-cta-hover-foreground);
    outline-offset: 2px;
}

.view-all-button svg {
    width: 16px;
    height: 16px;
    transition: transform 0.3s ease;
}

.view-all-button:hover svg {
    transform: translateX(2px);
}

@media (max-width: 768px) {
    .view-all-button {
        padding: var(--space-4) var(--space-5);
        font-size: var(--text-sm);
        min-width: 250px;
    }

    .view-all-button svg {
        width: 14px;
        height: 14px;
    }
}

/*------------------------*/
/*-----footerform-section-----*/
/*------------------------*/

.footerForm-section {
    background-color: var(--color-contact-background);
    scroll-margin-top: var(--header-height) !important;
}

.footerForm-container {
    max-width: var(--container-lg);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
    align-items: start;
    justify-content: center;
}

.footerForm-map-container {
    position: relative;
    height: 400px;
    width: 100%;
    order: 2;
}

.footerForm-map-wrapper {
    height: 100%;
    width: 100%;
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    border: 4px solid var(--color-white);
    position: relative;
    background-color: var(--color-gray-200);
}

.footerForm-map-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.footerForm-map-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-white-alpha-10);
}

.footerForm-location-marker {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    filter: drop-shadow(0 2px 4px var(--color-black-alpha-30));
    animation: bounce 2s ease-in-out infinite;
}

.footerForm-marker-icon {
    display: block;
}

.footerForm-marker-path {
    fill: var(--color-red);
}

.footerForm-location-info {
    position: absolute;
    bottom: 20px;
    left: 20px;
    background: var(--color-white);
    padding: var(--space-4);
    border-radius: var(--radius-lg);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    max-width: 220px;
}

.footerForm-location-title {
    font-size: var(--text-base);
    font-weight: var(--font-semibold);
    margin: 0 0 var(--space-2) 0;
    color: var(--color-gray-900);
}

.footerForm-location-address {
    font-size: var(--text-xs);
    line-height: var(--leading-snug);
    margin: 0 0 var(--space-2) 0;
    color: var(--color-gray-600);
}

.footerForm-maps-link {
    font-size: var(--text-xs);
    color: var(--color-google-blue);
    text-decoration: none;
    cursor: pointer;
}

.footerForm-maps-link:hover {
    text-decoration: underline;
}

.footerForm-card {
    background-color: var(--color-footer-contact-card-background);
    color: var(--color-footer-contact-card-foreground);
    border-radius: 0;
    overflow: hidden;
    height: 100%;
    order: 1;
}

.footerForm-wrapper {
    padding: var(--space-6);
}

.footerForm-title {
    font-size: var(--text-xl);
    font-weight: var(--font-semibold);
    margin: 0 0 var(--space-3) 0;
}

.footerForm-description {
    font-size: var(--text-base);
    margin: 0 0 var(--space-6) 0;
    line-height: var(--leading-normal);
}

.footerForm-fields {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.footerForm-input-container {
    position: relative;
}

.footerForm-input {
    width: 100%;
    height: 48px;
    padding: 0 var(--space-4);
    border-radius: 0;
    font-size: var(--text-base);
    border: 1px solid var(--color-footer-contact-card-input-ring);
    background-color: var(--color-footer-contact-card-input-background);
    color: var(--color-footer-contact-card-input-foreground);
    transition: var(--transition-base);
}

.footerForm-input:focus {
    outline: none;
    border-color: var(--color-footer-contact-card-input-ring-focus);
}

.footerForm-input::placeholder {
    font-size: var(--text-base);
    color: var(--color-footer-contact-card-input-foreground);
}

.footerForm-phone-wrapper {
    display: flex;
    gap: var(--space-2);
}

.footerForm-country-selector {
    position: relative;
    width: 100px;
}

.footerForm-country-button {
    width: 100%;
    height: 48px;
    border-radius: 0;
    border: 1px solid var(--color-footer-contact-card-input-ring);
    background-color: var(--color-footer-contact-card-input-background);
    color: var(--color-footer-contact-card-input-foreground);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 var(--space-3);
    transition: var(--transition-base);
}

.footerForm-country-content {
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.footerForm-country-flag {
    font-size: var(--text-lg);
}

.footerForm-country-code {
    font-weight: var(--font-medium);
    font-size: var(--text-sm) !important;
}

.footerForm-dropdown-arrow {
    width: var(--space-4);
    height: var(--space-4);
}

.footerForm-country-dropdown {
    position: absolute;
    top: 95% !important;
    left: -12%;
    right: 0;
    margin-top: var(--space-2);
    width: 350px;
    height: 200px;
    scrollbar-width: none;
    background-color: var(--color-gray-50);
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-md) !important;
    box-shadow: var(--shadow-md);
    display: none;
    z-index: 10;
    max-height: 200px;
    overflow-y: auto;
}

.footerForm-country-search-container {
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--color-gray-200);
    position: sticky;
    top: 0;
    background-color: var(--color-gray-50);
    z-index: 1;
}

.footerForm-country-search-input {
    width: 100%;
    height: 42px;
    padding: 0 var(--space-4);
    border: 1px solid var(--color-gray-300);
    border-radius: 0;
    font-size: var(--text-base);
    background-color: var(--color-white);
    transition: var(--transition-base);
}

.footerForm-country-search-input:focus {
    outline: none;
    border-color: var(--color-gray-900);
    box-shadow: 0 0 0 2px var(--color-gray-900-alpha-20);
}

.footerForm-country-search-input::placeholder {
    color: var(--color-gray-500);
    font-size: var(--text-base);
}

.footerForm-country-no-results {
    padding: var(--space-4);
    text-align: center;
    color: var(--color-gray-500);
    font-size: var(--text-sm);
    font-style: italic;
    border-top: 1px solid var(--color-gray-200);
}

.footerForm-country-option {
    width: 100%;
    padding: var(--space-3) var(--space-4);
    border: none;
    background: none;
    cursor: pointer;
    display: flex;
    justify-content: left;
    align-items: center;
    gap: 1rem;
    transition: var(--transition-base);
    font-size: var(--text-sm) !important;
}

.footerForm-country-option:hover {
    background-color: var(--color-gray-200);
}

.footerForm-country-option.selected {
    opacity: 0.3;
    cursor: default;
}

.footerForm-country-option:first-child {
    border-radius: 0;
}

.footerForm-country-option:last-child {
    border-radius: 0;
}

.footerForm-phone-input-container {
    flex: 1;
    position: relative;
}

.footerForm-customer-type-container {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.footerForm-label {
    font-size: var(--text-base);
    font-weight: var(--font-medium);
}

.footerForm-radio-group {
    display: flex;
    flex-direction: row;
    gap: var(--space-3);
}

.footerForm-radio-button {
    flex: 1;
    height: 48px;
    border-radius: 0;
    border: 1px solid var(--color-footer-contact-card-input-ring);
    background-color: var(--color-footer-contact-card-input-background);
    color: var(--color-footer-contact-card-input-foreground);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--text-base);
    transition: var(--transition-base);
    font-weight: var(--font-medium);
}

.footerForm-radio-button:hover {
    border-color: var(--color-footer-contact-card-input-ring-focus);
}

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

.footerForm-service-type-container {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.footerForm-select {
    width: 100%;
    height: 48px;
    padding: 0 var(--space-4);
    border-radius: 0;
    font-size: var(--text-base);
    border: 1px solid var(--color-footer-contact-card-input-ring);
    background-color: var(--color-footer-contact-card-input-background);
    color: var(--color-footer-contact-card-input-foreground);
    transition: var(--transition-base);
    cursor: pointer;
}

.footerForm-select:focus {
    outline: none;
    border-color: var(--color-footer-contact-card-input-ring-focus);
}

.footerForm-select option {
    background-color: var(--color-white);
    color: var(--color-gray-900);
    padding: var(--space-2);
}

.footerForm-submit-container {
    margin-top: var(--space-2);
}

.footerForm-submit-button {
    width: 100%;
    height: 48px;
    background-color: var(--color-footer-contact-card-button-background);
    color: var(--color-footer-contact-card-button-foreground);
    border: 2px solid var(--color-primary-button-background);
    border-radius: 50px;
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    cursor: pointer;
    transition: var(--transition-base);
}

.footerForm-submit-button:hover {
    background-color: var(--color-footer-contact-card-button-background-hover);
    color: var(--color-footer-contact-card-button-foreground-hover);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px var(--color-primary-alpha-30);
}

.footerForm-submit-button:focus {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

@media (min-width: 768px) {

    .footerForm-container {
        gap: var(--space-4);
        align-items: center;
    }

    .footerForm-map-container {
        order: 1;
        height: 100%;
        min-height: 500px;
    }

    .footerForm-card {
        order: 2;
    }

    .footerForm-wrapper {
        padding: var(--space-8);
    }

    .footerForm-title {
        font-size: 1.75rem;
    }

    .footerForm-description {
        font-size: var(--text-lg);
    }

    .footerForm-fields {
        gap: var(--space-6);
    }

    .footerForm-input,
    .footerForm-country-button,
    .footerForm-radio-button,
    .footerForm-select {
        height: 56px;
        font-size: var(--text-lg);
        padding: 0 var(--space-5);
        border-radius: 0;
    }

    .footerForm-input::placeholder {
        font-size: var(--text-lg);
    }

    .footerForm-country-selector {
        width: 110px;
    }

    .footerForm-radio-button {
        font-size: 1.0625rem;
    }

    .footerForm-radio-group {
        flex-direction: row;
        gap: var(--space-4);
    }

    .footerForm-submit-button {
        height: 56px;
        font-size: var(--text-lg);
        border-radius: 50px;
    }

    .footerForm-label {
        font-size: var(--text-lg);
    }
}

@media (min-width: 1024px) {
    .footerForm-container {
        grid-template-columns: 1fr 1fr;
        gap: var(--space-12);
    }

    .footerForm-wrapper {
        padding: var(--space-8) var(--space-10);
    }

    .footerForm-map-container {
        min-height: 600px;
    }

    .footerForm-title {
        font-size: var(--text-2-xl);
    }

    .footerForm-description {
        font-size: var(--text-lg);
        margin: 0 0 var(--space-8) 0;
    }

    .footerForm-fields {
        gap: var(--space-10);
    }

    .footerForm-input,
    .footerForm-country-button,
    .footerForm-radio-button,
    .footerForm-select {
        height: 60px;
        font-size: var(--text-lg);
        padding: 0 var(--space-5);
        border-radius: 0;
    }

    .footerForm-input::placeholder {
        font-size: var(--text-lg);
    }

    .footerForm-country-selector {
        width: 120px;
    }

    .footerForm-country-code {
        font-size: var(--text-lg);
    }

    .footerForm-country-dropdown {
        border-radius: 0;
    }

    .footerForm-country-option:first-child {
        border-radius: 0;
    }

    .footerForm-country-option:last-child {
        border-radius: 0;
    }

    .footerForm-radio-button {
        font-size: var(--text-lg);
    }

    .footerForm-radio-group {
        gap: var(--space-5);
    }

    .footerForm-submit-button {
        height: 72px;
        font-size: 1.375rem;
        border-radius: 50px;
    }

    .footerForm-customer-type-container {
        gap: var(--space-5);
    }

    .footerForm-label {
        font-size: var(--text-lg);
    }

    .footerForm-submit-container {
        margin-top: var(--space-4);
    }
}

@media (max-width: 767px) {
    .footerForm-country-dropdown {
        width: 250px;
    }
}


/*-------------------------------------------*/
/* About Section Classes                      */
/*-------------------------------------------*/

/* About section specific classes */
.about-section {
    background-color: var(--color-about-background) !important;
    color: var(--color-about-foreground) !important;
    scroll-margin-top: var(--header-height) !important;
}


/*------------------------*/
/*-----banner-section-----*/
/*------------------------*/

/* Hero CTA Button */
.hero-cta-button {
    background-color: var(--color-banner-cta-background);
    color: var(--color-banner-cta-foreground);
    border: 4px solid var(--color-banner-cta-background);
    padding: var(--space-8) var(--space-12);
    font-size: var(--text-xl);
    font-weight: var(--font-bold);
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    z-index: 1;
    border-radius: 50px;
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-6);
    width: 80%;
}

.hero-cta-button::before {
    content: '';
    position: absolute;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    background-color: var(--color-banner-cta-background-hover);
    color: var(--color-banner-cta-foreground-hover);
    transition: all 0.3s ease;
    z-index: -1;
}

.hero-cta-button:hover {
    background-color: var(--color-banner-cta-background-hover);
    color: var(--color-banner-cta-foreground-hover);
}

.hero-cta-button:hover::before {
    right: 0;
}

.hero-cta-button:focus {
    outline: 2px solid var(--color-banner-cta-background);
    outline-offset: 2px;
}

.hero-cta-button svg {
    transition: transform 0.3s ease;
}

.hero-cta-button:hover svg {
    transform: translateX(3px);
}

/* Hero Button Text */
.hero-button-text {
    font-weight: inherit;
    letter-spacing: normal;
}

/* Hero Button Arrow */
.hero-button-arrow {
    flex-shrink: 0;
}

/* Mobile styles */
@media (max-width: 600px) {
    .hero-cta-button {
        display: none;
    }
}

/* Tablet styles */
@media (min-width: 768px) {
    .hero-cta-button {
        display: inline-flex;
        justify-content: space-between;
        align-items: center;
    }
}

/* Large screen styles */
@media (min-width: 1440px) {
    .hero-cta-button {
        padding: var(--space-8) var(--space-10);
        font-size: var(--text-xl);
    }
}


/*------------------------*/
/*-----Footerform-section-----*/
/*------------------------*/
.footerForm-info-row {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    gap: 12px;
}

.footerForm-map-embed-container {
    border-radius: 0px;
    border: 4px solid var(--color-gray-100);
}

.footerForm-info-icon {
    flex-shrink: 0;
}

.footerForm-link-arrow {
    flex-shrink: 0;
    margin-left: auto;
}

.footerForm-day-name {
    font-weight: 500;
    font-size: 16px;
}

.footerForm-day-hours {
    font-size: 16px;
}

.footerForm-hours-row {
    display: grid;
    grid-template-columns: 120px auto;
    align-items: baseline;
    text-align: left;
    padding: 3px 0;
    column-gap: 20px;
}

.footerForm-card-border {
    border: 1px solid var(--color-footer-contact-card-ring);
}

.category-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
}


/* Fusion Split Card Offer Carousel Styles */
.fusion-split-card-offer-carousel {
    margin-bottom: var(--space-10);
    min-height: 700px;
}


/* Override carousel-card styles for fusion split card offer */
.fusion-split-card-offer-carousel-card {
    width: 100% !important;
    margin-right: 0;
    flex-direction: row;
    display: flex !important;
    min-height: auto;
}

/* Hide prev/next buttons when only 1 card */
.fusion-split-card-offer-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-prev-next-button {
    display: none !important;
}

/* Hide dots when only 1 card */
.fusion-split-card-offer-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-page-dots {
    display: none !important;
}
/* Hide when empty (no children) */
.offer-card-image-video:empty {
  display: none !important;
}

/* Hide only when there is no usable source at all — neither a live src nor a
   pending lazy-load data-src (lazily-stripped media keeps its url on data-src) */
.offer-card-image-video:has(img:not([src]):not([data-src]), img[src=""]:not([data-src]), img[data-src=""]:not([src]), img[src=""][data-src=""]),
.offer-card-image-video:has(video:not([src]):not([data-src]), video[src=""]:not([data-src]), video[data-src=""]:not([src]), video[src=""][data-src=""]) {
  display: none !important;
}

.offer-card-image-video:empty ~.offer-card-writeup,
.offer-card-image-video:has(img:not([src]):not([data-src]), img[src=""]:not([data-src]), img[data-src=""]:not([src]), img[src=""][data-src=""]) ~.offer-card-writeup {
    border-radius: var(--radius-2-xl);
}


@media (max-width: 767px) {
    .fusion-split-card-offer-carousel {
        margin-bottom: var(--space-10);
        min-height: 300px;
    }

    .feature-section {
        padding: var(--space-20) var(--space-4) var(--space-32) var(--space-4);
    }

    /* Hide prev/next buttons when only 1 card */
    .fusion-split-card-offer-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-prev-next-button {
        display: none !important;
    }
}

@media (max-width: 1023px) {
    .fusion-split-card-offer-carousel-card {
        flex-direction: column;
    }
}

.fusion-split-card-offer-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) {
    margin-bottom: 0 !important;
}

.fusion-split-card-offer-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-prev-next-button {
    display: none !important;
}

.fusion-split-card-offer-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-page-dots {
    display: none !important;
}

@media (max-width: 767px) {
    .fusion-split-card-offer-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-prev-next-button {
            display: none !important;
        }
}
 .bodaland-radius{
    border-radius:50px !important;
 }


 @media (max-width: 768px) {
  .flickity-prev-next-button.next,
  .flickity-prev-next-button.previous {
    display: none !important;
  }
  .flickity-page-dots {
            bottom: -40px !important;
        }
}


/* Staff Section Styles */

/* Staff Carousel */
.staff-carousel {
    margin-bottom: var(--space-10);
}

.staff-carousel .flickity-viewport {
    overflow: hidden;
    position: relative;
}

.staff-carousel .flickity-page-dots {
    bottom: -30px;
    display: flex;
    justify-content: center;
    list-style: none;
    padding: 0;
    margin: 0;
}

.staff-carousel .flickity-page-dots .dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 0 var(--space-2);
    background: var(--color-tertiary-light);
    border-radius: 50%;
    opacity: 0.5;
    cursor: pointer;
    transition: opacity 0.3s ease;
}

.staff-carousel .flickity-page-dots .dot.is-selected {
    opacity: 1;
    background: var(--color-tertiary-dark);
}

.staff-carousel .flickity-prev-next-button {
    position: absolute;
    top: 50%;
    width: 44px;
    height: 44px;
    border: none;
    border-radius: 50%;
    background: white;
    background: hsla(0, 0%, 100%, 0.75);
    cursor: pointer;
    transform: translateY(-50%);
}
.staff_card_itarate img {
    min-height: 250px;
    max-height: 250px;
}


.staff-carousel .flickity-prev-next-button:hover {
    background: white;
}

.staff-carousel .flickity-prev-next-button.previous {
    left: 10px;
}

.staff-carousel .flickity-prev-next-button.next {
    right: 10px;
}

/* Staff Cards */
.staff-card {
    background-color: var(--color-staff-card-background);
    border-radius: var(--radius-lg);
    padding: var(--space-8);
    display: flex !important;
    flex-direction: column;
    align-items: center;
    text-align: center;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
    min-width: 250px;
    margin: 0 10px;
    flex-shrink: 0;
    justify-content: space-between;
    min-height: 450px;
}

.staff-card:hover {
    transform: translateY(-5px);
}

/* Staff Images */
.staff-image-container {
    width: 230px;
    height: 230px;
    border-radius: 50%;
    overflow: hidden;
    margin-bottom: var(--space-6);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.staff-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Staff Names */
.staff-name {
    font-size: var(--text-xl);
    font-weight: var(--font-semibold);
    color: var(--color-gray-900);
    margin: 0 0 var(--space-2) 0;
    line-height: 1.2;
}

/* Staff Titles */
.staff-title {
    font-size: var(--text-base);
    color: var(--color-gray-700);
    margin: 0 0 auto 0;
    line-height: 1.5;
    padding-bottom: var(--space-6);
}

/* Book Buttons */
.staff-book-button {
    background-color: var(--color-primary-button-background);
    color: var(--color-primary-button-foreground);
    border: none;
    padding: 14px var(--space-8);
    border-radius: 25px;
    font-size: var(--text-base);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all 0.3s ease;
    width: 100%;
    max-width: 200px;
    margin-top: auto;
}

.staff-book-button:hover {
    background-color: var(--color-primary-button-background-hover);
    color: var(--color-primary-button-foreground-hover);
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.staff-book-button:focus {
    outline: 2px solid var(--color-button-outline);
    outline-offset: 2px;
}

/* Staff Section Responsive Styles */
@media screen and (min-width: 1024px) {
    .staff-carousel {
        margin: 0 auto;
    }

    .staff-carousel .carousel-cell {
        width: calc(30% - 0.70rem) !important;
    }

    /* Hide prev/next buttons when 3 or fewer cards (all visible) */
    .staff-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(4))) .flickity-prev-next-button {
        display: none !important;
    }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
    .staff-card {
        min-width: 250px;
        margin: 0 6px;
    }

    .staff-carousel .carousel-cell {
        width: calc(40% - 0.5rem) !important;
    }

    /* Hide prev/next buttons when 2 or fewer cards (all visible) */
    .staff-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(3))) .flickity-prev-next-button {
        display: none !important;
    }

}

@media (max-width: 767px) {
    .carousel-section.staff-section {
        padding: var(--space-20) 0 var(--space-8) 0 !important;
    }

    .staff-card {
        min-height: 350px;
    }

    .staff-image-container {
        width: 200px;
        height: 200px;
    }

    .staff-name {
        font-size: var(--text-base);
    }

    .staff-title {
        font-size: var(--text-sm);
    }

    .staff-carousel .carousel-cell {
        width: 80% !important;
    }

    /* Hide prev/next buttons when only 1 card */
    .staff-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-prev-next-button {
        display: none !important;
    }

    .staff-carousel.flickity-enabled .flickity-page-dots {
        display: flex;
    }
}

/* Staff Modal Styles */
.staff-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-black-alpha-50);
    z-index: 499;
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.staff-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 500;
    padding: var(--space-4);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.staff-modal-content {
    background-color: var(--color-gray-100);
    border-radius: 20px;
    max-width: 900px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    padding: var(--space-4);
    position: relative;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
    transform: scale(0.95);
    transition: transform 0.3s ease;
}

.close-icon {
    display: block;
}

.bio-card-container {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.bio-profile-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-4);
    text-align: center;
    padding: var(--space-8);
    background-color: white;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.bio-profile-image-container {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    overflow: hidden;
    background-color: var(--color-gray-100);
}

.bio-profile-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.bio-professional-name {
    font-size: var(--text-2-xl);
    font-weight: var(--font-bold);
    color: var(--color-gray-800);
    margin: 0;
    line-height: 1.2;
}

.bio-professional-title {
    font-size: var(--text-sm);
    color: var(--color-gray-600);
    margin: 0;
    font-weight: var(--font-normal);
}

.bio-book-button {
    background-color: var(--color-primary-button-background);
    color: var(--color-primary-button-foreground);
    border: none;
    padding: 14px var(--space-6);
    border-radius: 25px;
    font-size: var(--text-base);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all 0.3s ease;
    width: 100%;
    max-width: 200px;
    margin-top: var(--space-2);
}

.bio-book-button:hover {
    background-color: var(--color-primary-button-background-hover);
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    color: var(--color-primary-button-foreground-hover);

}

.bio-book-button:focus {
    outline: 2px solid var(--color-button-outline);
    outline-offset: 2px;
}

.bio-content-section {
    flex: 1;
    padding: var(--space-8);
    background-color: white;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.bio-text {
    font-size: var(--text-base);
    line-height: 1.7;
    color: var(--color-gray-700);
    margin: 0;
    text-align: left;
}

@media (min-width: 768px) {
    .staff-modal-content {
        padding: var(--space-8);
    }

    .bio-card-container {
        flex-direction: row;
        gap: var(--space-4);
    }

    .bio-profile-section {
        flex-shrink: 0;
        min-width: 250px;
    }

    .bio-content-section {
        padding: var(--space-12);
    }

    .bio-profile-image-container {
        width: 150px;
        height: 150px;
    }

    .bio-professional-name {
        font-size: var(--text-xl);
    }

    .bio-professional-title {
        font-size: var(--text-base);
    }

    .bio-text {
        font-size: var(--text-lg);
        line-height: 1.8;
    }
}

/* Mobile-specific styles for staff modal */
@media (max-width: 767px) {
    .staff-modal {
        align-items: flex-end;
        padding: 0;
    }

    .staff-modal-content {
        border-radius: 16px 16px 0 0;
        max-height: 90vh;
        overflow-y: auto;
        width: 100%;
        max-width: 100%;
        margin: 0;
    }

    .bio-profile-section {
        display: none;
    }

    .bio-book-button-mobile {
        display: block;
        margin: var(--space-6) auto 0;
        width: auto;
        min-width: 200px;
    }

    .bio-card-container {
        flex-direction: column;
        padding: 0;
    }

    .bio-content-section {
        padding: var(--space-6);
        text-align: center;
        border-radius: 0;
        box-shadow: none;
    }

    .bio-text {
        text-align: left;
        margin-bottom: var(--space-4);
        min-height: 300px;
    }

    .staff-modal-content {
        transform: none;
    }
}

/* Desktop-specific styles for staff modal */
@media (min-width: 768px) {
    .bio-book-button-mobile {
        display: none;
    }
}

@media (min-width: 1024px) {
    .staff-modal-content {
        max-width: 1000px;
    }

}
/* StaffSection.jsx - Hide carousel controls and center cards based on count */

/* Desktop: Hide controls when 1-3 cards */
@media (min-width: 1024px) {

    /* Hide prev/next buttons when 1-3 cards */
    .staff-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(4))) .flickity-prev-next-button {
        display: none !important;
    }

    /* Hide dots when 1-3 cards */
    .staff-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(4))) .flickity-page-dots {
        display: none !important;
    }

    /* When 1 card - center using Flickity viewport */
    .staff-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-viewport {
        width: 380px;
        margin: 0 auto;
    }

    .staff-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .carousel-card {
        width: 100% !important;
        margin-right: 0 !important;
    }

    /* When 2 cards - center using Flickity viewport */
    .staff-section .main-carousel:has(.carousel-cell:nth-child(2)):not(:has(.carousel-cell:nth-child(3))) .flickity-viewport {
        width: 800px;
        margin: 0 auto;
    }

    .staff-section .main-carousel:has(.carousel-cell:nth-child(2)):not(:has(.carousel-cell:nth-child(3))) .carousel-card {
        width: 380px !important;
        margin-right: 40px !important;
    }
}

/* Tablet: Hide controls when 1-2 cards */
@media (min-width: 768px) and (max-width: 1023px) {

    /* Hide prev/next buttons when 1-2 cards */
    .staff-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(3))) .flickity-prev-next-button {
        display: none !important;
    }

    /* Hide dots when 1-2 cards */
    .staff-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(3))) .flickity-page-dots {
        display: none !important;
    }

    /* When 1 card - center using Flickity viewport */
    .staff-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-viewport {
        width: 380px;
        margin: 0 auto;
    }

    .staff-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .carousel-card {
        width: 100% !important;
        margin-right: 0 !important;
    }

    /* When 2 cards - center using Flickity viewport */
    .staff-section .main-carousel:has(.carousel-cell:nth-child(2)):not(:has(.carousel-cell:nth-child(3))) .flickity-viewport {
        width: 780px;
        margin: 0 auto;
    }

    .staff-section .main-carousel:has(.carousel-cell:nth-child(2)):not(:has(.carousel-cell:nth-child(3))) .carousel-card {
        width: 380px !important;
        margin-right: 20px !important;
    }
}

/* Mobile: Hide controls when 1 card and center it */
@media (max-width: 767px) {

    /* Hide prev/next buttons when only 1 card */
    .staff-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-prev-next-button {
        display: none !important;
    }

    /* Hide dots when only 1 card */
    .staff-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-page-dots {
        display: none !important;
    }

    /* When 1 card - center using Flickity viewport */
    .staff-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .flickity-viewport {
        width: 90%;
        max-width: 320px;
        margin: 0 auto;
    }

    .staff-section .main-carousel:has(.carousel-cell:nth-child(1)):not(:has(.carousel-cell:nth-child(2))) .carousel-card {
        width: 100% !important;
        margin-right: 0 !important;
    }
}

@media (min-width: 1024px) {
    .staff-height-override{
        height: auto !important;
    }
}
@media (max-width: 767px) {
    .staff-overrides {
        width: auto !important;
    }
}

.staff-card-button-override {
    border-radius: var(--radius-md) !important;
}
.staff-card-button-override[data-staff-has-description="false"] {
    display: none;
}
.staff-card-button-group {
    gap: 10px;
    width: 100%;
    display: flex;
    margin-top: 10px;
}
.staff-card-cta-button {
    flex: 1;
    cursor: pointer;
    padding: 7px 16px;
    font-size: 20px;
    transition: all 0.3s ease;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-staff-card-button-background);
}
@media (max-width: 767px) {
 .staff-card-cta-button {
    padding: 7px 5px;
    font-size: 16px;
 }
}

.staff-card-book-button {
    color: var(--color-staff-card-button-foreground);
    background-color: var(--color-staff-card-button-background);
}
.staff-card-know-more-button {
    color: var(--color-staff-card-button-background);
    background-color: transparent;
}



/* Blogs Listing Section Bodaland */

.blogs-section .view-all-container::before {
display: none;
    }

    /* Text */
.blogs-section .view-all-container::after {
     display: none;
    }


.blogs-section .carousel-card-content .service-button {
    display: inline-block;
    width: fit-content;
    background-color: var(--color-primary-button-background);
    color: var(--color-primary-button-foreground);
    font-weight: var(--font-medium);
    font-size: var(--text-base);
    text-align: center;
    height: 100%;
    top: 0px;
    transform: none;
    scale: 100%;
    border-radius: 10px;
    margin-top: 10px;
    text-transform: none;
}

.blogs-section .carousel-card-title {
    color: var(--color-black);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.4;
    height: calc(3 * 1.4em);

}

.blogs-section .carousel-card-text {
    color: var(--color-black);
}

@media (max-width: 768px) {
    .blogs-section .carousel-card {
       box-shadow: var(--shadow-md);
       margin-right: 10px;
       background-color: var(--color-white);
    }
}

@media (min-width: 768px) {

    .blogs-section .carousel-card {
        position: relative;
        overflow: hidden;
    }

    .blogs-section .carousel-card-content {
        position: relative;
        bottom: 0;
        width: 100%;
    }

    .blogs-section .carousel-card-title {
        background: color-mix(in srgb, var(--color-services-overlay) 80%, transparent);
        padding: var(--space-4) var(--space-4);
        color: var(--color-services-overlay-foreground);
        font-size: medium;
        margin: 0;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.4;
        height: calc(3 * 1.7em);

    }
    .blogs-section .carousel-card-text {
        background: color-mix(in srgb, var(--color-services-overlay) 80%, transparent);
        padding: var(--space-4) var(--space-4);
        color: var(--color-services-overlay-foreground);
        margin: 0;
    }
    .blogs-section .carousel-card-content .service-button {
        margin-top: 0px;
    }
}



/* Checkbox Container - Main wrapper with top margin and spacing */
.ctaForm-checkbox-container,
.footerForm-checkbox-container {
    margin-top: 16px;
    margin-bottom: 12px;
    padding: 0;
}

/* Checkbox Wrapper - Flexbox for alignment */
.ctaForm-checkbox-wrapper,
.footerForm-checkbox-wrapper {

  display: grid;
  grid-template-columns: 20px 1fr;
  gap: 12px;
  cursor: pointer;
  align-items: start;
}

.ctaForm-checkbox-wrapper,
.footerForm-checkbox-wrapper  > :nth-child(3) {
  grid-column: 1 / -1; /* span full row */
}


/* Checkbox Input - Styling the actual checkbox */
.ctaForm-checkbox-input,
.footerForm-checkbox-input {
    margin: 0;
    margin-top: 3px;
    /* Align with first line of text */
    width: 18px;
    height: 18px;
    cursor: pointer;
    flex-shrink: 0;
    /* Prevent checkbox from shrinking */
}

/* Checkbox Label - Text label styling */
.ctaForm-checkbox-label,
.footerForm-checkbox-label {
    cursor: pointer;
    user-select: none;
    flex: 1;
    margin: 0;
}

/* Checkbox Label Text - The actual text */
.ctaForm-checkbox-label-text,
.footerForm-checkbox-label-text {
    font-size: 14px;
    line-height: 1.5;
    color: #333;
    display: block;
}

/* Hover effect */
.ctaForm-checkbox-wrapper:hover .ctaForm-checkbox-input,
.footerForm-checkbox-wrapper:hover .footerForm-checkbox-input {
    opacity: 0.8;
}

/* Focus state for accessibility */
.ctaForm-checkbox-input:focus,
.footerForm-checkbox-input:focus {
    outline: 2px solid #4A90E2;
    outline-offset: 2px;
}

/* Checked state styling (optional) */
.ctaForm-checkbox-input:checked,
.footerForm-checkbox-input:checked {
    accent-color: #4A90E2;
    /* Modern browsers */
}

.footer-bottom-section .copyright-container[data-copyright-enabled='false']{
    display:none;
}

.footer-bottom-section .terms-privacy-container[data-terms-privacy-enabled='false']
{
    display: none;
}

.footer-bottom-section .powered-by-container[data-terms-privacy-enabled='false'][data-copyright-enabled='false']{
    margin: 0 auto;
}

.multi-purpose-text {
    display: none;
}

.multi-purpose-text[data-multi-purpose-visible="true"] {
    display: block;
    font-size: 16px;
    font-weight: 500;
    padding-bottom: 8px;
}

.multi-purpose-text[data-multi-purpose-visible="true"] .mp-star {
    opacity: 0.6;
}

.bodaland-content-card .multi-purpose-text[data-multi-purpose-visible="true"] {
    color: var(--color-white);
}
/* Global Visibility Markers — hide elements based on entity preferences */
section[data-global-visibility-markers*='"footer_call_display":"false"']~footer a[href^="tel:"] {
    display: none !important;
}
section[data-global-visibility-markers*='"footer_email_display":"false"']~footer a[href^="mailto:"] {
    display: none !important;
}
section[data-global-visibility-markers*='"blogs_section_display":"false"']~section[data-section-marker="blogsListing"] {
    display: none !important;
}
section[data-global-visibility-markers*='"lead_form_step_two_other_display":"false"']
[data-element-name="Others Button"] {
    display: none !important;
}













/* ══════════════════════════════════════════════
   CTA Configurable Button System
   Primary buttons inherit all visuals from
   existing .btn .btn-primary classes.
   These classes only add icon/display logic.
   ══════════════════════════════════════════════ */

/* Safety: hide CTA elements with unresolved template variables */
[data-cta-visible^="$$"] { display: none !important; }
[data-cta-visible="false"] { display: none !important; }
[data-cta-style^="$$"] { display: none !important; }
[data-cta-type^="$$"] { display: none !important; }
[data-cta-popup-enabled^="$$"] { display: none !important; }

/* ── Primary buttons: no visual overrides, just icon gap ── */
.website-cta-hero,
.website-cta-nav,
.website-cta-sidenav,
.website-cta-fab {
    gap: var(--space-2);
}

/* ── Consistent nav CTA sizing (primary + secondary match) ── */
.website-cta-nav,
.website-cta-nav-alt[data-cta-visible="true"] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--text-base);
    justify-content: center;
    text-align: center;
}

/* ── Secondary buttons: shown only when data-cta-visible="true" ── */
.website-cta-hero-alt[data-cta-visible="true"],
.website-cta-nav-alt[data-cta-visible="true"],
.website-cta-sidenav-alt[data-cta-visible="true"],
.website-cta-fab-alt[data-cta-visible="true"] {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    font-weight: var(--font-medium);
    text-align: center;
    border-radius: var(--radius-md);
    transition: var(--transition-base);
    cursor: pointer;
    outline: none;
    text-decoration: none;
    white-space: nowrap;
    gap: var(--space-2);
    border: 0px solid currentColor;
}
.website-cta-hero-alt[data-cta-visible="true"]:hover {
    background-color: var(--color-banner-cta-connect-background-hover);
    color: var(--color-banner-cta-connect-foreground-hover);
    transform: translateY(-2px);
}
.website-cta-nav-alt[data-cta-visible="true"]:hover,
.website-cta-sidenav-alt[data-cta-visible="true"]:hover {
    background-color: var(--color-header-cta-connect-background-hover);
    color: var(--color-header-cta-connect-foreground-hover);
}

/* Secondary sizing per placement */
.website-cta-hero-alt[data-cta-visible="true"] {
    background-color: var(--color-banner-cta-connect-background);
    color: var(--color-banner-cta-connect-foreground);
    padding: var(--space-3) var(--space-6);
    font-size: var(--text-base);
}
.website-cta-nav-alt[data-cta-visible="true"] {
    background-color: var(--color-header-cta-connect-background);
    color: var(--color-header-cta-connect-foreground);
    padding: var(--space-2) var(--space-4);
    font-size: var(--text-base);
    position: relative;
    overflow: hidden;
    z-index: 1;
}
[data-cta-visible="true"][data-cta-style="primary"].website-cta-nav-alt::before {
    content: '';
    position: absolute;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    background-color: var(--color-header-cta-connect-background-hover);
    transition: all 0.3s ease;
    z-index: -1;
}
[data-cta-visible="true"][data-cta-style="primary"].website-cta-nav-alt:hover::before {
    right: 0;
}
[data-cta-visible="true"][data-cta-style="primary"].website-cta-nav-alt:hover {
    color: var(--color-header-cta-connect-foreground-hover);
}
.website-cta-sidenav-alt[data-cta-visible="true"] {
    background-color: var(--color-header-cta-connect-background);
    color: var(--color-header-cta-connect-foreground);
    padding: var(--space-3) var(--space-6);
    font-size: var(--text-base);
}

/* ── Sidenav CTA sizing: both buttons same width ── */
.website-cta-sidenav,
.website-cta-sidenav-alt[data-cta-visible="true"] {
    width: 100%;
    max-width: 250px;
    justify-content: center;
    text-align: center;
}
.website-cta-sidenav .website-cta-text,
.website-cta-sidenav-alt .website-cta-text {
    flex: 0 !important;
}
.website-cta-fab-alt[data-cta-visible="true"] {
    background-color: var(--color-floating-cta-connect-background);
    color: var(--color-floating-cta-connect-foreground);
    border: none;
    padding: 18px var(--space-10);
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    flex-shrink: 0;
    position: static;
    box-shadow: var(--color-white) 0px 8px 20px !important;
}
.website-cta-fab-alt[data-cta-visible="true"]:hover {
    opacity: 0.9;
}

/* ── Icon-only (circle, no text) ── */
[data-cta-style="icon-only"] {
    width: 50px !important;
    height: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    background-color: var(--color-primary-button-background) !important;
    color: var(--color-primary-button-foreground) !important;
}
[data-cta-style="icon-only"] .website-cta-text {
    display: none !important;
}
[data-cta-global-call="false"][data-cta-style="icon-only"] {
    width: 100% !important;
    height: auto !important;
    min-width: 150px !important;
    max-width: none !important;
    padding: 15px !important;
    border-radius: var(--radius-md) !important;
}
[data-cta-global-call="false"][data-cta-style="icon-only"] .website-cta-text {
    display: inline !important;
}
.website-cta-text {
    flex: 1;
    text-align: left;
}

/* ── Icons ── */
.website-cta-icon {
    display: none !important;
    align-items: center;
    flex-shrink: 0;
}
.website-cta-icon svg { display: block; }
[data-cta-type="book"] .website-cta-icon-book { display: inline-flex !important; }
[data-cta-type="call"] .website-cta-icon-call { display: inline-flex !important; }
[data-cta-type="callback"] .website-cta-icon-call { display: inline-flex !important; }

/* ── Hero button container ── */
.hero-button-wrapper {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    flex-wrap: wrap;
    width: 100%;
}

/* ── FAB container ── */
.mobile-cta-button-container-fallback {
    position: fixed !important;
    bottom: 5px;
    left: 0;
    right: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 15px;
    margin: 0;
}
@media (min-width: 768px) {
    .mobile-cta-button-container-fallback {
        display: none !important;
    }
}

/* ── FAB primary button: override fixed-cta positioning ── */
.fixed-cta.website-cta-fab {
    position: static !important;
    display: flex !important;
}
.website-cta-text { flex: 1; text-align: center; }
.website-cta-fab .website-cta-text,
.website-cta-fab-alt .website-cta-text {
    flex: 0 !important;
}
.website-cta-hero-alt[data-cta-visible="true"],
.website-cta-nav-alt[data-cta-visible="true"],
.website-cta-sidenav-alt[data-cta-visible="true"],
.website-cta-fab-alt[data-cta-visible="true"] {
    border-radius: 50px;
}

/* ── Global call toggle: when call feature is off,
     hide secondary buttons, hide icons, center text.
     MUST come after data-cta-visible rules to win specificity ── */
[data-cta-global-call^="$$"] { display: none !important; }
.website-cta-hero-alt[data-cta-global-call="false"],
.website-cta-nav-alt[data-cta-global-call="false"],
.website-cta-sidenav-alt[data-cta-global-call="false"],
.website-cta-fab-alt[data-cta-global-call="false"] {
    display: none !important;
}
[data-cta-global-call="false"] .website-cta-icon-book,
[data-cta-global-call="false"] .website-cta-icon-call { display: none !important; }
[data-cta-global-call="false"] .website-cta-text { flex: none; width: 100%; text-align: center; }
[data-cta-global-call="false"].website-cta-fab,
[data-cta-global-call="false"].website-cta-hero,
[data-cta-global-call="false"].website-cta-nav,
[data-cta-global-call="false"].website-cta-sidenav { justify-content: center; }
.bodaland-content-card [data-cta-global-call="false"] .website-cta-text { text-align: left; }

/* ── When global call is ON: unify sidenav & FAB button appearance ── */
.website-cta-sidenav[data-cta-global-call="true"],
.website-cta-sidenav-alt[data-cta-global-call="true"] {
    width: 100%;
    justify-content: center;
    font-weight: var(--font-semibold);
}
.website-cta-sidenav-alt[data-cta-global-call="true"] {
    border: none;
}
.website-cta-fab[data-cta-global-call="true"] {
    flex: 1;
    justify-content: center;
    font-weight: var(--font-semibold);
    margin: 0px !important;
    font-size: var(--text-md);
}
.website-cta-fab-alt[data-cta-global-call="true"] {
    border: none;
    justify-content: center;
    font-weight: var(--font-semibold);
    box-shadow: var(--shadow-lg);
}
.website-cta-sidenav[data-cta-global-call="true"] .website-cta-text,
.website-cta-sidenav-alt[data-cta-global-call="true"] .website-cta-text,
.website-cta-fab[data-cta-global-call="true"] .website-cta-text,
.website-cta-fab-alt[data-cta-global-call="true"] .website-cta-text {
    flex: none;
    text-align: center;
}

/* ── When global call is ON: hide arrow icon and constrain wrapper width ── */
.hero-cta-button[data-cta-global-call="true"] .hero-button-arrow {
    display: none;
}
.hero-button-wrapper:has([data-cta-global-call="true"]) {
    width: 80%;
}

/* ── When global call is ON: banner buttons side by side ── */
.hero-button-wrapper:has([data-cta-global-call="true"]) {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    flex-wrap: wrap;
}
.hero-button-wrapper .hero-cta-button[data-cta-global-call="true"],
.hero-button-wrapper .hero-button-cta[data-cta-global-call="true"] {
    flex: 1;
    padding: var(--space-6) var(--space-8);
    width: auto;
    margin-top: 0;
}
.hero-button-wrapper .hero-cta-button .website-cta-text {
    flex: 1;
    text-align: left;
}
/* When secondary CTA is hidden, cap primary at 80% so it doesn't stretch full width */
.hero-button-wrapper:not(:has(.website-cta-hero-alt[data-cta-visible="true"])) .hero-cta-button[data-cta-global-call="true"],
.hero-button-wrapper:not(:has(.website-cta-hero-alt[data-cta-visible="true"])) .hero-button-cta[data-cta-global-call="true"] {
    flex: none;
    width: 80%;
}
.hero-button-wrapper .website-cta-hero-alt[data-cta-visible="true"][data-cta-global-call="true"] {
    background-color: var(--color-banner-cta-connect-background);
    color: var(--color-banner-cta-connect-foreground);
    border: 4px solid var(--color-banner-cta-connect-background);
    padding: var(--space-6) var(--space-8);
    font-size: var(--text-xl);
    font-weight: var(--font-bold);
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    z-index: 1;
    border-radius: 50px;
    display: inline-flex !important;
    align-items: center;
    gap: var(--space-2);
    margin-top: 0;
}
.hero-button-wrapper .website-cta-hero-alt[data-cta-visible="true"][data-cta-global-call="true"]::before {
    content: '';
    position: absolute;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    background-color: var(--color-banner-cta-connect-background-hover);
    color: var(--color-banner-cta-connect-foreground-hover);
    transition: all 0.3s ease;
    z-index: -1;
}
.hero-button-wrapper .website-cta-hero-alt[data-cta-visible="true"][data-cta-global-call="true"]:hover {
    background-color: var(--color-banner-cta-connect-background-hover);
    color: var(--color-banner-cta-connect-foreground-hover);
}
.hero-button-wrapper .website-cta-hero-alt[data-cta-visible="true"][data-cta-global-call="true"]:hover::before {
    right: 0;
}
.hero-button-wrapper .website-cta-hero-alt[data-cta-visible="true"][data-cta-global-call="true"]:focus {
    outline: 2px solid var(--color-banner-cta-connect-background);
    outline-offset: 2px;
}
.hero-button-wrapper .website-cta-hero-alt[data-cta-visible="true"][data-cta-global-call="true"] svg {
    transition: transform 0.3s ease;
}
.hero-button-wrapper .website-cta-hero-alt[data-cta-visible="true"][data-cta-global-call="true"]:hover svg {
    transform: translateX(3px);
}
.hero-button-wrapper .website-cta-hero-alt[data-cta-visible="true"][data-cta-global-call="true"] .website-cta-text {
    flex: none;
    text-align: center;
    font-weight: inherit;
    letter-spacing: normal;
}

/* ── Hide hero banner buttons on mobile (header/FAB handles mobile CTAs) ── */
@media (max-width: 767px) {
    .hero-button-wrapper .website-cta-hero-alt[data-cta-visible="true"][data-cta-global-call="true"]{
        display: none !important;
    }
    .website-cta-hero-alt,
    .website-cta-hero-alt[data-cta-visible="true"],
    .website-cta-hero-alt[data-cta-global-call="true"] { display: none !important; }
    .hero-button-cta,
    .hero-cta-button,
    .hero-button-cta[data-cta-global-call="true"],
    .hero-cta-button[data-cta-global-call="true"] { display: none !important; }
}

/* ── When global call is on, force flex on hero CTA for icon alignment (desktop only) ── */
@media (min-width: 768px) {
    .hero-button-cta[data-cta-global-call="true"],
    .hero-cta-button[data-cta-global-call="true"] {
        display: inline-flex !important;
        align-items: center;
        gap: var(--space-2);
    }
}



.blogs-section .carousel-card-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Offer popup: remove carousel padding inside the modal */
.offer-popup-modal .carousel-section {
  padding: 0 !important;
}

/* ── Banner redirect secondary button (home only) ──
   The redirect CTA carries data-cta-global-call="false", so the global-call
   hide rule above hides it and it misses the polished connect-secondary look.
   Re-show it on the home banner and give it the same styling + width as the
   primary hero CTA (80% of the wrapper, text left, arrow far-right) plus the
   sliding fill + animated arrow. Desktop only (mobile is header/FAB). */
@media (min-width: 768px) {
  .website-cta-hero-alt[data-cta-visible="true"][data-cta-type="redirect"] {
    display: inline-flex !important;
    box-sizing: border-box;
    width: 80%;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    background-color: var(--color-banner-cta-connect-background);
    color: var(--color-banner-cta-connect-foreground);
    border: 4px solid var(--color-banner-cta-connect-background);
    padding: var(--space-8) var(--space-12);
    font-size: var(--text-xl);
    font-weight: var(--font-bold);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    border-radius: 50px;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    z-index: 1;
    margin-top: 0;
  }
  .website-cta-hero-alt[data-cta-visible="true"][data-cta-type="redirect"]::before {
    content: '';
    position: absolute;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    background-color: var(--color-banner-cta-connect-background-hover);
    transition: all 0.3s ease;
    z-index: -1;
  }
  .website-cta-hero-alt[data-cta-visible="true"][data-cta-type="redirect"]:hover {
    background-color: var(--color-banner-cta-connect-background-hover);
    color: var(--color-banner-cta-connect-foreground-hover);
  }
  .website-cta-hero-alt[data-cta-visible="true"][data-cta-type="redirect"]:hover::before {
    right: 0;
  }
  .website-cta-hero-alt[data-cta-visible="true"][data-cta-type="redirect"] .website-cta-text {
    flex: 1;
    text-align: left;
    letter-spacing: normal;
  }
  .website-cta-hero-alt[data-cta-visible="true"][data-cta-type="redirect"]::after {
    content: '\2192';
    flex-shrink: 0;
    font-size: 1.1em;
    line-height: 1;
    transition: transform 0.3s ease;
  }
  .website-cta-hero-alt[data-cta-visible="true"][data-cta-type="redirect"]:hover::after {
    transform: translateX(4px);
  }
}

/* Offer split card — desktop height safety net (applies even if id-scoped sync is stale) */
.fusion-split-card-offer-card {
  width: 100%;
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .fusion-split-card-offer-card {
    height: 700px !important;
    flex-direction: row !important;
  }
}

@media (max-width: 767px) {
  .fusion-split-card-offer-card {
    min-height: 300px !important;
    flex-direction: column !important;
  }
}

/* Offer pill — service-card offer line (.service-offer-pill emitted by website-backend ServiceOfferLine). */
[data-variable-text="ServiceOfferLine"] {
  display: block;
}
.service-offer-pill {
  display: inline-block;
  background: #e7f6ec;
  border: 1px solid #bfe6cd;
  color: #000;
  font-weight: 600;
  padding: 0px 5px;
  border-radius: 999px;
  margin-top: 4px;
  font-size: 10px;
}

/** For social_proof section **/

@keyframes social-proof-pulse-ping {
  0% {
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.5);
  }
  70% {
    box-shadow: 0 0 0 0.75rem rgba(0, 0, 0, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
}

/* The platform's gradient washed across the whole card, not just its icon tile.
   Carried on a ::before overlay because the gradient has to sit at a low opacity
   over the card's own translucent white — painting it as the card's background
   would fight that, and opacity on the card itself would fade the text with it.

   Lives here rather than in the layout because ::before is a pseudo-ELEMENT:
   react-to-json only recognises single-colon pseudo-CLASSES (`:[a-z]+`), so a
   `::before` written in <style jsx> is silently dropped on the way to
   production. Same reason --accent itself is defined here.

   The card's own children need `position: relative` to sit above it; the layout
   already gives the card `position: relative`, and the overlay is z-index 0
   under content that establishes its own stacking. */
.metric-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--accent);
  opacity: 0.04;
  transition: opacity 0.4s cubic-bezier(0.2, 0.7, 0.2, 1);
  pointer-events: none;
  z-index: 0;
}

.metric-card:hover::before {
  opacity: 0.1;
}

/* The card is a div whose click the layout handles in JS, so it gets no pointer
   for free — keyed off data-has-url rather than the card's id because the
   backend replicates the inline card per platform and the ids change with it.

   A card with no URL still renders (the layout is static): the backend sends
   data-redirect-url="javascript:void(0)" and data-has-url="false", and the
   handler does nothing for it, so it keeps the default cursor. The hover lift
   stays on both, being the card's own motion rather than a promise of a link. */
.metric-card[data-has-url="true"] {
  cursor: pointer;
}

.metric-card[data-has-url="false"] {
  cursor: default;
}

/* Per-platform accent gradients, keyed off the card's data-platform-name and
   consumed by the icon tile via var(--accent).

   One rule per value of SocialProofPlatform (see data-collection.dto.ts), and
   every rule is dark: the processor always requests the WHITE icon from
   getIconForPlatform, so a light tile would render an invisible icon. Adding a
   platform to that enum means adding a dark gradient here too.

   Matched case-insensitively (` i`) because the enum stores lowercase while the
   card's visible label is uppercased by CSS. */
.metric-card[data-platform-name="Instagram" i] {
  --accent: linear-gradient(135deg, #833AB4, #E1306C 50%, #FCAF45);
}

.metric-card[data-platform-name="TikTok" i] {
  --accent: linear-gradient(135deg, #25F4EE, #000000 50%, #FE2C55);
}

.metric-card[data-platform-name="YouTube" i] {
  --accent: linear-gradient(135deg, #FF0000, #C4302B);
}

.metric-card[data-platform-name="Facebook" i] {
  --accent: linear-gradient(135deg, #1877F2, #0A4DA6);
}

.metric-card[data-platform-name="X" i] {
  --accent: linear-gradient(135deg, #2B2B2B, #000000);
}

.metric-card[data-platform-name="Twitter" i] {
  --accent: linear-gradient(135deg, #1DA1F2, #0C7ABF);
}

.metric-card[data-platform-name="LinkedIn" i] {
  --accent: linear-gradient(135deg, #0A66C2, #004182);
}

.metric-card[data-platform-name="Pinterest" i] {
  --accent: linear-gradient(135deg, #E60023, #AD001B);
}

.metric-card[data-platform-name="Snapchat" i] {
  --accent: linear-gradient(135deg, #C9A800, #8A7300);
}

.metric-card[data-platform-name="WhatsApp" i] {
  --accent: linear-gradient(135deg, #25D366, #128C7E);
}

.metric-card[data-platform-name="Yelp" i] {
  --accent: linear-gradient(135deg, #FF1A1A, #AF0606);
}

.carousel-card-image:not([src]),
.carousel-card-image[src=""] {
    display: none;
}


.zoca-e0160ea3-1211-4340-8236-69d77808b6ab {
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  border: none;
  cursor: pointer;
  z-index: 999;
  padding: 10px 20px;
  overflow: hidden;
  position: fixed;
  background-color: var(--color-offer-sticky-bar-background);
}

.zoca-966246c8-30e1-4b3f-944e-0292961efc89 {
  gap: 10px;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}

.zoca-4fe63b63-c379-4cec-9260-0d8769d5ea15 {
  color: var(--color-offer-sticky-bar-foreground);
  font-size: 14px;
  font-weight: 400;
}

.zoca-3c43a83a-3585-441a-8a9c-d961b6e3f8e0 {
  color: var(--color-offer-sticky-bar-foreground);
  font-size: 14px;
}

.zoca-e806edbb-05f1-4d72-ba05-7e076eff76d6 {
  color: var(--color-offer-sticky-bar-foreground);
  font-size: 14px;
  font-weight: 400;
  text-decoration: underline;
}

.zoca-dcf60c14-45c1-4e08-9cd3-84a754d1c77c {
  gap: 10px;
  display: none;
  align-items: center;
  white-space: nowrap;
}

.zoca-6961a342-bc2c-457c-a20e-1f52c72427e4 {
  color: var(--color-offer-sticky-bar-foreground);
  font-size: 14px;
  font-weight: 400;
}

.zoca-6a0485a6-f5a8-43da-9666-698df2151255 {
  color: var(--color-offer-sticky-bar-foreground);
  font-size: 14px;
}

.zoca-c6c69ea4-b4ca-4178-8b71-6e89724c3f17 {
  color: var(--color-offer-sticky-bar-foreground);
  font-size: 14px;
  font-weight: 400;
  text-decoration: underline;
}

.zoca-66f5407d-fcef-4955-a512-84ff7e5f1dd1 {
  display: none !important;
}

.zoca-39c5b4a9-89ea-414a-be08-356040f5582a {
  display: none !important;
}

.zoca-b30e68b7-2363-4721-9ca6-def14f685e66 {
  color: black;
  border-radius: 8px !important;
}

.zoca-29e873e3-24a7-4803-833e-83f63538121d {
  padding: 1.5rem 2rem 0rem 2rem;
}

.zoca-8635f148-b540-4b72-85fb-6d990b664aa4 {
  color: black;
  display: none;
  font-weight: 600;
}

.zoca-98ec70bf-f365-437d-bcfa-5d111222da25 {
  padding: 1.5rem 2rem 2rem 2rem;
}

.zoca-dc0831a1-7c19-4004-b45f-765784b21efa {
  margin-top: var(--space-6);
}

.zoca-40ff48a1-b90b-4b98-97c1-1c540f53d259 {
  margin-top: var(--space-6);
}

.zoca-f9c2294d-78ca-4bca-a9fb-582c1be5a8da {
  text-align: center !important;
}

.zoca-4e160117-d11e-4b88-b58b-39db85d345c1 {
  text-align: center !important;
}

.zoca-d1885738-d292-4a78-a8e9-8d636bc221d6 {
  margin-top: var(--space-8);
}

.zoca-5600f36b-344a-430d-8ee1-c18687712c18 {
  gap: var(--space-2);
  color: var(--color-gray-500);
  display: flex;
  font-size: var(--text-sm);
  margin-top: var(--space-4);
  align-items: center;
  justify-content: center;
}

.zoca-fecaeaa1-bbe7-4bc5-bc62-b7e6c8d3cdba {
  margin-top: -0.75rem;
}

.zoca-2955bc64-5dc7-4134-8dea-7d44ba27d250 {
  gap: var(--space-2);
  color: var(--color-gray-500);
  display: flex;
  font-size: var(--text-sm);
  margin-top: var(--space-4);
  align-items: center;
  justify-content: center;
}

.zoca-8a7d08e7-f965-4e16-addd-0657c6677960 {
  display: none;
}

.zoca-27350268-7f68-44f0-b963-15b328ec03e7 {
  padding: 0px !important;
  min-height: 0px !important;
}

.zoca-43ecbfb5-28f6-4424-b884-aae0d46c73d9 {
  width: 100%;
  padding: var(--space-4);
  max-width: 100%;
  box-sizing: border-box;
  margin-top: var(--space-6);
  text-align: center;
}

.zoca-18c0121e-0828-4fca-bf4e-d95418c3eed8 {
  color: var(--color-gray-600);
  margin: 0 0 var(--space-3) 0;
  font-size: var(--text-sm);
  font-weight: 500;
}

.zoca-c5790b40-0db4-45a8-84c8-c6ed04356c04 {
  gap: var(--space-2);
  color: var(--color-white);
  border: none;
  cursor: pointer;
  display: inline-flex;
  padding: var(--space-3) var(--space-4);
  font-size: var(--text-sm);
  min-width: fit-content;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  align-items: center;
  font-weight: bold;
  transition: all 0.2s ease-in-out;
  white-space: nowrap;
  border-radius: var(--radius-md);
  justify-content: center;
  text-decoration: none;
  background-color: var(--color-black);
}

.zoca-c5790b40-0db4-45a8-84c8-c6ed04356c04:hover {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  transform: translateY(-1px);
  font-weight: bold;
}

.zoca-c5790b40-0db4-45a8-84c8-c6ed04356c04:active {
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  transform: translateY(0);
}

@media (max-width: 640px) {
  .zoca-c5790b40-0db4-45a8-84c8-c6ed04356c04 {
    width: 100%;
  padding: var(--space-4) var(--space-3);
  }
}

@media (max-width: 767Px) {
  .zoca-0df15323-1032-4343-a813-353e1f594606 {
    left: 0;
  right: 0;
  width: 100%;
  border: none;
  bottom: 0;
  margin: 0;
  z-index: 99;
  display: flex;
  padding: 0;
  position: fixed;
  box-shadow: 0 -8px 8px var(--color-about-background);
  background: transparent;
  flex-direction: column;
  }
}

@media (min-width: 768Px) {
  .zoca-0df15323-1032-4343-a813-353e1f594606 {
    display: none;
  }
}

.zoca-eb7567aa-d0dd-4379-bd26-f1fe2212a89b {
  color: var(--color-floating-cta-foreground);
  width: 100%;
  border: none;
  margin: 0;
  padding: 20px 24px;
  font-size: 18px;
  box-sizing: border-box;
  text-align: center;
  font-weight: 800;
  border-radius: 0;
  background-color: var(--color-floating-cta-background);
}

.zoca-39c189bb-34d6-405a-85be-6b63436a5aa1 {
  gap: 8px;
  color: white;
  width: 100%;
  margin: 0;
  display: flex;
  padding: 10px 16px;
  font-size: 14px;
  max-height: 25px;
  min-height: 12px;
  align-items: center;
  flex-direction: row;
  justify-content: center;
  background-color: #4a4a4a;
}

.zoca-6e158ba6-1f37-4312-a4eb-8e5de16bee88 {
  width: 12px;
  height: 12px;
}

.zoca-1810fef7-0721-486c-878e-5f11ab137aa5 {
  color: white;
  font-size: 12px;
  font-weight: 900;
  margin-left: -3px;
}

.zoca-8a1e1805-77b9-465e-99cc-050575baedcd {
  color: gold;
  font-size: 12px;
  font-weight: 900;
  margin-inline: -5px;
}

.zoca-a1e2f6c3-b3b8-487c-bde3-b0be29bef54c {
  color: white;
  margin: 0;
  font-size: 12px;
  font-weight: 900;
}

.zoca-70be8e1f-ce0d-4168-8861-469987ea5077 {
  color: white;
  font-size: 12px;
  font-weight: 900;
  margin-left: -4px;
}

.zoca-46047fa3-f0a1-443a-b6a8-e34de50e6532 {
  min-width: 150px;
}

.zoca-abd237af-3bfa-4caa-a7eb-72818fca9bd6 {
  display: none !important;
}

.zoca-850e0731-0bef-4bb7-a2f1-54c8ba204d32 {
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  display: none;
  position: fixed;
  background-color: #1a1a1a;
}

.zoca-2ea0cb78-0414-4d16-9ac9-d03805a99641 {
  margin: 0 auto;
  padding: 1.35rem 1.5rem;
  max-width: 1200px;
}

@media (max-width: 600px) {
  .zoca-2ea0cb78-0414-4d16-9ac9-d03805a99641 {
    padding: 1rem;
  }
}

.zoca-914cc4e7-1fb1-4924-9546-fd4bc3c91664 {
  gap: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.zoca-d58d1179-f084-4d54-9799-f330f91aaac6 {
  gap: 1rem;
  flex: 1;
  display: flex;
  align-items: center;
}

.zoca-6c504c72-ccff-4803-8bda-373617768a38 {
  gap: 0.25rem;
  display: flex;
  flex-direction: column;
}

.zoca-8ec16d6a-1ae7-4aca-8828-bad058b9338f {
  color: #ffffff;
  margin: 0;
  font-size: 1.2rem;
  font-weight: 600;
  line-height: 1.4;
}

@media (max-width: 600px) {
  .zoca-8ec16d6a-1ae7-4aca-8828-bad058b9338f {
    font-size: 1rem;
  }
}

.zoca-0bcaa3a2-4d2b-4e8a-9200-95144acb22d3 {
  color: #ffffff;
  margin: 0;
  opacity: 0.9;
  font-size: 1rem;
}

.zoca-20d3037b-5068-4608-ab45-39192a6eeff8 {
  gap: 1rem;
  display: flex;
  align-items: center;
}

.zoca-a551638c-a481-4c02-9701-51b1f95812e5 {
  gap: 0.5rem;
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.3);
  cursor: pointer;
  display: flex;
  padding: 0.75rem 1.5rem;
  font-size: 1rem;
  align-items: center;
  font-weight: 500;
  transition: all 0.2s ease;
  white-space: nowrap;
  border-radius: 50px;
  background-color: transparent;
}

.zoca-a551638c-a481-4c02-9701-51b1f95812e5:hover {
  border-color: rgba(255, 255, 255, 0.5);
  background-color: rgba(255, 255, 255, 0.1);
}

@media (max-width: 600px) {
  .zoca-a551638c-a481-4c02-9701-51b1f95812e5 {
    padding: 0.6rem;
  font-size: 0.875rem;
  }
}

.zoca-c685ce6e-dddf-4017-b396-04b615f23797 {
  color: #000000;
  border: none;
  cursor: pointer;
  padding: 0.75rem 2rem;
  font-size: 1rem;
  font-weight: 600;
  transition: all 0.2s ease;
  white-space: nowrap;
  border-radius: 50px;
  background-color: #ffffff;
}

.zoca-c685ce6e-dddf-4017-b396-04b615f23797:hover {
  box-shadow: 0 4px 12px rgba(255, 255, 255, 0.2);
  transform: translateY(-1px);
  background-color: #f0f0f0;
}

@media (max-width: 600px) {
  .zoca-c685ce6e-dddf-4017-b396-04b615f23797 {
    padding: 0.9rem 1.25rem;
  font-size: 1.25rem;
  }
}

.zoca-8cd524c9-542b-42f4-94f9-bc0043bed1f7 {
  width: 100%;
  display: flex;
  overflow: hidden;
  position: relative;
  min-height: min(80vh,750px);
  align-items: end;
  justify-content: center;
  scroll-margin-top: var(--header-height) !important;
}

@media (max-width: 640Px) {
  .zoca-8cd524c9-542b-42f4-94f9-bc0043bed1f7 {
    min-height: 500px;
  align-items: center;
  }
}

@media (min-width:1600Px) {
  .zoca-8cd524c9-542b-42f4-94f9-bc0043bed1f7 {
    min-height: min(70vh,600px);
  }
}

.zoca-7f3d461b-2a3c-4f81-bf49-52cc17f8f0cb {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  position: absolute;
}

.zoca-e6a8720d-377f-471e-ba64-e65a9ebf2b52 {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.zoca-edd393b3-5694-491f-b0de-0e6382786025 {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  opacity: 0.5;
  position: absolute;
  background: var(--color-black-alpha-50);
}

.zoca-8413ad94-1e4e-4843-a384-c0e568734258 {
  width: 100%;
  margin: 0 auto;
  z-index: 3;
  position: relative;
}

.zoca-481974c5-c0a4-4cc0-bce9-ab869b022c50 {
  gap: var(--space-6);
  color: var(--color-white);
  display: flex;
  max-width: 600px;
  align-items: flex-start;
  flex-direction: column;
}

@media (max-width: 640Px) {
  .zoca-481974c5-c0a4-4cc0-bce9-ab869b022c50 {
    text-align: left;
  align-items: flex-start;
  }
}

@media (min-width: 1024Px) {
  .zoca-481974c5-c0a4-4cc0-bce9-ab869b022c50 {
    max-width: 700px;
  }
}

.zoca-4c99bf7e-6828-46cb-b05e-53a64f357f3e {
  margin: 0;
  font-size: var(--text-3-xl);
  font-weight: var(--font-bold);
  line-height: var(--leading-tight);
  text-shadow: 0 2px 4px var(--color-black-alpha-30);
  letter-spacing: -0.02em;
}

@media (max-width: 640Px) {
  .zoca-4c99bf7e-6828-46cb-b05e-53a64f357f3e {
    font-size: var(--text-3-xl);
  }
}

@media (min-width: 768Px) {
  .zoca-4c99bf7e-6828-46cb-b05e-53a64f357f3e {
    font-size: var(--text-4-xl);
  }
}

@media (min-width: 1024Px) {
  .zoca-4c99bf7e-6828-46cb-b05e-53a64f357f3e {
    font-size: var(--text-5-xl);
  }
}

.zoca-787d8ac1-3fd3-4c96-a59c-b6de03fcf1cf {
  display: none;
}

.zoca-9ef919eb-f695-4892-a447-26b6eb297916 {
  margin: 0;
  opacity: 0.95;
  font-size: var(--text-md);
  font-weight: var(--font-regular);
  line-height: var(--leading-relaxed);
  text-shadow: 0 1px 2px var(--color-black-alpha-30);
}

@media (min-width: 768Px) {
  .zoca-9ef919eb-f695-4892-a447-26b6eb297916 {
    font-size: var(--text-lg);
  }
}

.zoca-ebd96db0-c62d-414d-b009-350013794c38 {
  display: none !important;
}

.zoca-dfc60de4-9cab-4a9f-b15c-11284b4f04b6 {
  display: none;
}

@media (max-width: 768Px) {
  .zoca-73a9cf2e-a1d9-463a-a541-aa3f9298fd70 {
    padding: 0;
  }
}

.zoca-1cc68621-2da8-4f91-bcf5-41cb9f2f24fe {
  cursor: pointer;
}

.zoca-b300b85f-6079-47e5-b3e3-bff31622cff9 {
  cursor: pointer;
}

.zoca-9d8d96f0-5c85-4ce4-b565-1072361309c6 {
  cursor: pointer;
}

.zoca-84696ad8-dfb1-4fd3-803d-ef0b7136e0a1 {
  cursor: pointer;
}

.zoca-2dbf5b0e-a477-4085-b278-832f2aa27754 {
  cursor: pointer;
}

.zoca-1a70192b-354b-413e-81a1-f72c727c84d4 {
  cursor: pointer;
}

.zoca-d5f72494-1008-44e5-826f-db07858ebc9b {
  cursor: pointer;
}

.zoca-ef756876-50fc-46a0-b54c-fb6e9712132b {
  cursor: pointer;
}

.zoca-de85306d-fffb-4d2a-93e4-17ac43798f2e {
  cursor: pointer;
}

.zoca-8495f499-be10-445f-9e74-35fc6795c5cf {
  color: var(--color-offer-card-foreground);
  width: 100%;
  overflow: hidden;
  position: relative;
  background: var(--color-offer-card-background);
  scroll-margin-top: var(--header-height) !important;
}

.zoca-7e7f9c1f-0929-43dc-8de2-2255ee4f1b93 {
  margin: 0 auto;
  max-width: var(--container-lg);
  padding-inline: var(--space-8);
}

.zoca-c47cd5d8-fb97-4a58-bd5c-68492d364b5d {
  position: relative;
  min-height: 700px;
  margin-bottom: var(--space-0) !important;
}

@media (max-width: 767Px) {
  .zoca-c47cd5d8-fb97-4a58-bd5c-68492d364b5d {
    min-height: 300px;
  margin-bottom: var(--space-10) !important;
  }
}

.zoca-68ea5d72-c072-40d6-a97c-ee10405e1d46 {
  width: 100%;
  display: flex;
  flex-direction: column;
}

@media (min-width: 768Px) {
  .zoca-68ea5d72-c072-40d6-a97c-ee10405e1d46 {
    height: 700px;
  flex-direction: row !important;
  }
}

.zoca-8ceb7b1a-111d-4202-8087-1635b117d316 {
  padding: var(--space-10);
}

@media (max-width: 768Px) {
  .zoca-8ceb7b1a-111d-4202-8087-1635b117d316 {
    padding: var(--space-4);
  }
}

.zoca-93260cba-df30-43f2-bc36-b95bed6acda6 {
  width: 100%;
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  border-radius: var(--radius-2-xl) var(--radius-2-xl) 0 0;
  background-color: var(--color-secondary-brand);
}

@media (max-width: 768Px) {
  .zoca-93260cba-df30-43f2-bc36-b95bed6acda6 {
    max-height: 300px;
  }
}

@media (min-width: 1024Px) {
  .zoca-93260cba-df30-43f2-bc36-b95bed6acda6 {
    width: 100%;
  overflow: hidden;
  border-radius: var(--radius-2-xl) 0 0 var(--radius-2-xl);
  }
}

.zoca-75ec4788-4f3c-4acf-b4eb-daf89a790311 {
  width: 100%;
  height: 100%;
  max-height: 900px;
  object-fit: cover;
}

@media (max-width: 768Px) {
  .zoca-75ec4788-4f3c-4acf-b4eb-daf89a790311 {
    max-height: 300px;
  }
}

.zoca-be33cd29-b255-463c-b16e-1e60f1e4d724 {
  color: var(--color-offer-card-content-foreground);
  display: flex;
  padding: var(--space-10) var(--space-6);
  box-shadow: var(--shadow-lg);
  align-items: center;
  border-radius: 0 0 var(--radius-2-xl) var(--radius-2-xl);
  flex-direction: column;
  justify-content: center;
  background-color: var(--color-offer-card-content-background);
}

@media (min-width: 768Px) {
  .zoca-be33cd29-b255-463c-b16e-1e60f1e4d724 {
    width: 100%;
  padding: var(--space-12);
  border-radius: 0 0 var(--radius-2-xl) var(--radius-2-xl);
  }
}

@media (min-width: 1024Px) {
  .zoca-be33cd29-b255-463c-b16e-1e60f1e4d724 {
    padding: var(--space-16);
  border-radius: 0 var(--radius-2-xl) var(--radius-2-xl) 0;
  }
}

.zoca-74308d5d-cca2-4f2a-b0ef-91489e393389 {
  color: inherit;
  font-size: 2.2rem;
  text-align: center;
  font-weight: var(--font-bold);
  margin-bottom: var(--space-6);
}

@media (min-width: 768Px) {
  .zoca-74308d5d-cca2-4f2a-b0ef-91489e393389 {
    font-size: 2.8rem;
  margin-bottom: var(--space-8);
  }
}

@media (min-width: 1024Px) {
  .zoca-74308d5d-cca2-4f2a-b0ef-91489e393389 {
    font-size: 3.4rem;
  }
}

.zoca-d234b72e-f80c-465c-8601-f8a34febb020 {
  max-width: var(--container-sm);
  overflow: auto;
  max-height: 40vh;
  margin-bottom: var(--space-8);
  scrollbar-width: thin !important;
}

@media (max-width: 768Px) {
  .zoca-d234b72e-f80c-465c-8601-f8a34febb020 {
    max-height: 30vh;
  margin-bottom: var(--space-6);
  }
}

.zoca-a2b6bba0-4f91-4164-b844-081e1633b2ba {
  display: flex;
  justify-content: center;
}

@media (min-width: 768Px) {
  .zoca-a2b6bba0-4f91-4164-b844-081e1633b2ba {
    margin-top: var(--space-6);
  }
}

.zoca-afb64045-eeec-4922-837a-913d45e0b666 {
  width: 100%;
  display: flex;
  flex-direction: column;
}

@media (min-width: 768Px) {
  .zoca-afb64045-eeec-4922-837a-913d45e0b666 {
    height: 700px;
  flex-direction: row !important;
  }
}

.zoca-3eb6a699-4cf0-4112-9862-7fb20874f08d {
  padding: var(--space-10);
}

@media (max-width: 768Px) {
  .zoca-3eb6a699-4cf0-4112-9862-7fb20874f08d {
    padding: var(--space-4);
  }
}

.zoca-d14e4379-fa2c-4a20-b96e-48c311013d91 {
  width: 100%;
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  border-radius: var(--radius-2-xl) var(--radius-2-xl) 0 0;
  background-color: var(--color-secondary-brand);
}

@media (max-width: 768Px) {
  .zoca-d14e4379-fa2c-4a20-b96e-48c311013d91 {
    max-height: 300px;
  }
}

@media (min-width: 1024Px) {
  .zoca-d14e4379-fa2c-4a20-b96e-48c311013d91 {
    width: 100%;
  overflow: hidden;
  border-radius: var(--radius-2-xl) 0 0 var(--radius-2-xl);
  }
}

.zoca-4bdf7503-686b-4d77-8fda-d8366728aa58 {
  width: 100%;
  height: 100%;
  max-height: 900px;
  object-fit: cover;
}

@media (max-width: 768Px) {
  .zoca-4bdf7503-686b-4d77-8fda-d8366728aa58 {
    max-height: 300px;
  }
}

.zoca-3c78f4d0-9e24-4a7f-9ba8-cbf7b80feab9 {
  color: var(--color-offer-card-content-foreground);
  display: flex;
  padding: var(--space-10) var(--space-6);
  box-shadow: var(--shadow-lg);
  align-items: center;
  border-radius: 0 0 var(--radius-2-xl) var(--radius-2-xl);
  flex-direction: column;
  justify-content: center;
  background-color: var(--color-offer-card-content-background);
}

@media (min-width: 768Px) {
  .zoca-3c78f4d0-9e24-4a7f-9ba8-cbf7b80feab9 {
    width: 100%;
  padding: var(--space-12);
  border-radius: 0 0 var(--radius-2-xl) var(--radius-2-xl);
  }
}

@media (min-width: 1024Px) {
  .zoca-3c78f4d0-9e24-4a7f-9ba8-cbf7b80feab9 {
    padding: var(--space-16);
  border-radius: 0 var(--radius-2-xl) var(--radius-2-xl) 0;
  }
}

.zoca-c16c0972-7f1e-4921-82ef-a564f5a2f5fe {
  color: inherit;
  font-size: 2.2rem;
  text-align: center;
  font-weight: var(--font-bold);
  margin-bottom: var(--space-6);
}

@media (min-width: 768Px) {
  .zoca-c16c0972-7f1e-4921-82ef-a564f5a2f5fe {
    font-size: 2.8rem;
  margin-bottom: var(--space-8);
  }
}

@media (min-width: 1024Px) {
  .zoca-c16c0972-7f1e-4921-82ef-a564f5a2f5fe {
    font-size: 3.4rem;
  }
}

.zoca-668e7b26-e1b3-4971-9661-aeddec7372cc {
  max-width: var(--container-sm);
  overflow: auto;
  max-height: 40vh;
  margin-bottom: var(--space-8);
  scrollbar-width: thin !important;
}

@media (max-width: 768Px) {
  .zoca-668e7b26-e1b3-4971-9661-aeddec7372cc {
    max-height: 30vh;
  margin-bottom: var(--space-6);
  }
}

.zoca-3caa7c13-e338-4479-b6a0-d4cab8c7ff43 {
  display: flex;
  justify-content: center;
}

@media (min-width: 768Px) {
  .zoca-3caa7c13-e338-4479-b6a0-d4cab8c7ff43 {
    margin-top: var(--space-6);
  }
}

.zoca-ff8cf330-4814-43f0-9f3d-de81f7f1452b {
  width: 100%;
  display: flex;
  flex-direction: column;
}

@media (min-width: 768Px) {
  .zoca-ff8cf330-4814-43f0-9f3d-de81f7f1452b {
    height: 700px;
  flex-direction: row !important;
  }
}

.zoca-32f9afa2-1d19-4465-87af-e2256650a581 {
  padding: var(--space-10);
}

@media (max-width: 768Px) {
  .zoca-32f9afa2-1d19-4465-87af-e2256650a581 {
    padding: var(--space-4);
  }
}

.zoca-08bfde8d-5a55-41dc-bb03-278040d1d66b {
  width: 100%;
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  border-radius: var(--radius-2-xl) var(--radius-2-xl) 0 0;
  background-color: var(--color-secondary-brand);
}

@media (max-width: 768Px) {
  .zoca-08bfde8d-5a55-41dc-bb03-278040d1d66b {
    max-height: 300px;
  }
}

@media (min-width: 1024Px) {
  .zoca-08bfde8d-5a55-41dc-bb03-278040d1d66b {
    width: 100%;
  overflow: hidden;
  border-radius: var(--radius-2-xl) 0 0 var(--radius-2-xl);
  }
}

.zoca-bad0ce7d-aed6-487a-853d-af942cd783bf {
  width: 100%;
  height: 100%;
  max-height: 900px;
  object-fit: cover;
}

@media (max-width: 768Px) {
  .zoca-bad0ce7d-aed6-487a-853d-af942cd783bf {
    max-height: 300px;
  }
}

.zoca-8b242483-0a87-4285-91d4-d7e2ee08a624 {
  color: var(--color-offer-card-content-foreground);
  display: flex;
  padding: var(--space-10) var(--space-6);
  box-shadow: var(--shadow-lg);
  align-items: center;
  border-radius: 0 0 var(--radius-2-xl) var(--radius-2-xl);
  flex-direction: column;
  justify-content: center;
  background-color: var(--color-offer-card-content-background);
}

@media (min-width: 768Px) {
  .zoca-8b242483-0a87-4285-91d4-d7e2ee08a624 {
    width: 100%;
  padding: var(--space-12);
  border-radius: 0 0 var(--radius-2-xl) var(--radius-2-xl);
  }
}

@media (min-width: 1024Px) {
  .zoca-8b242483-0a87-4285-91d4-d7e2ee08a624 {
    padding: var(--space-16);
  border-radius: 0 var(--radius-2-xl) var(--radius-2-xl) 0;
  }
}

.zoca-839d3937-7c09-48c7-a601-24afc849408d {
  color: inherit;
  font-size: 2.2rem;
  text-align: center;
  font-weight: var(--font-bold);
  margin-bottom: var(--space-6);
}

@media (min-width: 768Px) {
  .zoca-839d3937-7c09-48c7-a601-24afc849408d {
    font-size: 2.8rem;
  margin-bottom: var(--space-8);
  }
}

@media (min-width: 1024Px) {
  .zoca-839d3937-7c09-48c7-a601-24afc849408d {
    font-size: 3.4rem;
  }
}

.zoca-d1d300b1-bea5-477f-a398-864700460d52 {
  max-width: var(--container-sm);
  overflow: auto;
  max-height: 40vh;
  margin-bottom: var(--space-8);
  scrollbar-width: thin !important;
}

@media (max-width: 768Px) {
  .zoca-d1d300b1-bea5-477f-a398-864700460d52 {
    max-height: 30vh;
  margin-bottom: var(--space-6);
  }
}

.zoca-1f5dc2f3-f161-40ac-8e8e-c30eea2f735f {
  display: flex;
  justify-content: center;
}

@media (min-width: 768Px) {
  .zoca-1f5dc2f3-f161-40ac-8e8e-c30eea2f735f {
    margin-top: var(--space-6);
  }
}

.zoca-10229164-b0eb-4f4e-b257-7099bdf092eb {
  width: 100%;
  display: flex;
  flex-direction: column;
}

@media (min-width: 768Px) {
  .zoca-10229164-b0eb-4f4e-b257-7099bdf092eb {
    height: 700px;
  flex-direction: row !important;
  }
}

.zoca-db449df6-695e-4226-ac42-4fa8279a512a {
  padding: var(--space-10);
}

@media (max-width: 768Px) {
  .zoca-db449df6-695e-4226-ac42-4fa8279a512a {
    padding: var(--space-4);
  }
}

.zoca-39ba24fb-db64-4e58-8d6c-f0a8a5adcbbb {
  width: 100%;
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  border-radius: var(--radius-2-xl) var(--radius-2-xl) 0 0;
  background-color: var(--color-secondary-brand);
}

@media (max-width: 768Px) {
  .zoca-39ba24fb-db64-4e58-8d6c-f0a8a5adcbbb {
    max-height: 300px;
  }
}

@media (min-width: 1024Px) {
  .zoca-39ba24fb-db64-4e58-8d6c-f0a8a5adcbbb {
    width: 100%;
  overflow: hidden;
  border-radius: var(--radius-2-xl) 0 0 var(--radius-2-xl);
  }
}

.zoca-ef975c33-e0f9-4c9f-92f3-4ea1c6b1d13a {
  width: 100%;
  height: 100%;
  max-height: 900px;
  object-fit: cover;
}

@media (max-width: 768Px) {
  .zoca-ef975c33-e0f9-4c9f-92f3-4ea1c6b1d13a {
    max-height: 300px;
  }
}

.zoca-8b41c95f-ac7b-4194-b8e7-3ea4fec38483 {
  color: var(--color-offer-card-content-foreground);
  display: flex;
  padding: var(--space-10) var(--space-6);
  box-shadow: var(--shadow-lg);
  align-items: center;
  border-radius: 0 0 var(--radius-2-xl) var(--radius-2-xl);
  flex-direction: column;
  justify-content: center;
  background-color: var(--color-offer-card-content-background);
}

@media (min-width: 768Px) {
  .zoca-8b41c95f-ac7b-4194-b8e7-3ea4fec38483 {
    width: 100%;
  padding: var(--space-12);
  border-radius: 0 0 var(--radius-2-xl) var(--radius-2-xl);
  }
}

@media (min-width: 1024Px) {
  .zoca-8b41c95f-ac7b-4194-b8e7-3ea4fec38483 {
    padding: var(--space-16);
  border-radius: 0 var(--radius-2-xl) var(--radius-2-xl) 0;
  }
}

.zoca-4030a108-80be-4c65-97a2-f7ab9295dc82 {
  color: inherit;
  font-size: 2.2rem;
  text-align: center;
  font-weight: var(--font-bold);
  margin-bottom: var(--space-6);
}

@media (min-width: 768Px) {
  .zoca-4030a108-80be-4c65-97a2-f7ab9295dc82 {
    font-size: 2.8rem;
  margin-bottom: var(--space-8);
  }
}

@media (min-width: 1024Px) {
  .zoca-4030a108-80be-4c65-97a2-f7ab9295dc82 {
    font-size: 3.4rem;
  }
}

.zoca-9cc10c88-b296-43d8-95d2-711db7813559 {
  max-width: var(--container-sm);
  overflow: auto;
  max-height: 40vh;
  margin-bottom: var(--space-8);
  scrollbar-width: thin !important;
}

@media (max-width: 768Px) {
  .zoca-9cc10c88-b296-43d8-95d2-711db7813559 {
    max-height: 30vh;
  margin-bottom: var(--space-6);
  }
}

.zoca-9d5f9c0e-27d8-40f3-9229-33143ffa6cf5 {
  display: flex;
  justify-content: center;
}

@media (min-width: 768Px) {
  .zoca-9d5f9c0e-27d8-40f3-9229-33143ffa6cf5 {
    margin-top: var(--space-6);
  }
}

.zoca-ceecaf60-7c6b-40c5-a1a5-17342a76d756 {
  width: 100%;
  display: flex;
  flex-direction: column;
}

@media (min-width: 768Px) {
  .zoca-ceecaf60-7c6b-40c5-a1a5-17342a76d756 {
    height: 700px;
  flex-direction: row !important;
  }
}

.zoca-e8f9ba40-bd3e-4de4-98de-c0a88b5c202a {
  padding: var(--space-10);
}

@media (max-width: 768Px) {
  .zoca-e8f9ba40-bd3e-4de4-98de-c0a88b5c202a {
    padding: var(--space-4);
  }
}

.zoca-e1779c6f-50f5-4d1d-aa21-f7642defd73b {
  width: 100%;
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  border-radius: var(--radius-2-xl) var(--radius-2-xl) 0 0;
  background-color: var(--color-secondary-brand);
}

@media (max-width: 768Px) {
  .zoca-e1779c6f-50f5-4d1d-aa21-f7642defd73b {
    max-height: 300px;
  }
}

@media (min-width: 1024Px) {
  .zoca-e1779c6f-50f5-4d1d-aa21-f7642defd73b {
    width: 100%;
  overflow: hidden;
  border-radius: var(--radius-2-xl) 0 0 var(--radius-2-xl);
  }
}

.zoca-8718612a-06c0-4868-948e-f18ae7d8c4e3 {
  width: 100%;
  height: 100%;
  max-height: 900px;
  object-fit: cover;
}

@media (max-width: 768Px) {
  .zoca-8718612a-06c0-4868-948e-f18ae7d8c4e3 {
    max-height: 300px;
  }
}

.zoca-1db89b9b-1356-4e09-909f-c38637094a34 {
  color: var(--color-offer-card-content-foreground);
  display: flex;
  padding: var(--space-10) var(--space-6);
  box-shadow: var(--shadow-lg);
  align-items: center;
  border-radius: 0 0 var(--radius-2-xl) var(--radius-2-xl);
  flex-direction: column;
  justify-content: center;
  background-color: var(--color-offer-card-content-background);
}

@media (min-width: 768Px) {
  .zoca-1db89b9b-1356-4e09-909f-c38637094a34 {
    width: 100%;
  padding: var(--space-12);
  border-radius: 0 0 var(--radius-2-xl) var(--radius-2-xl);
  }
}

@media (min-width: 1024Px) {
  .zoca-1db89b9b-1356-4e09-909f-c38637094a34 {
    padding: var(--space-16);
  border-radius: 0 var(--radius-2-xl) var(--radius-2-xl) 0;
  }
}

.zoca-0c4f793c-7326-4b28-abd6-65cac41a5e47 {
  color: inherit;
  font-size: 2.2rem;
  text-align: center;
  font-weight: var(--font-bold);
  margin-bottom: var(--space-6);
}

@media (min-width: 768Px) {
  .zoca-0c4f793c-7326-4b28-abd6-65cac41a5e47 {
    font-size: 2.8rem;
  margin-bottom: var(--space-8);
  }
}

@media (min-width: 1024Px) {
  .zoca-0c4f793c-7326-4b28-abd6-65cac41a5e47 {
    font-size: 3.4rem;
  }
}

.zoca-36630dbc-bf8e-4d6d-9344-dd664cb39b17 {
  max-width: var(--container-sm);
  overflow: auto;
  max-height: 40vh;
  margin-bottom: var(--space-8);
  scrollbar-width: thin !important;
}

@media (max-width: 768Px) {
  .zoca-36630dbc-bf8e-4d6d-9344-dd664cb39b17 {
    max-height: 30vh;
  margin-bottom: var(--space-6);
  }
}

.zoca-0ac216a3-7787-42cd-964e-0b028e81907a {
  display: flex;
  justify-content: center;
}

@media (min-width: 768Px) {
  .zoca-0ac216a3-7787-42cd-964e-0b028e81907a {
    margin-top: var(--space-6);
  }
}

.zoca-b80955ac-2b8e-4aa1-8472-844075ad8692 {
  width: 100%;
  display: flex;
  flex-direction: column;
}

@media (min-width: 768Px) {
  .zoca-b80955ac-2b8e-4aa1-8472-844075ad8692 {
    height: 700px;
  flex-direction: row !important;
  }
}

.zoca-379fdd9a-2a2c-4766-9c9f-9a9e37faafb1 {
  padding: var(--space-10);
}

@media (max-width: 768Px) {
  .zoca-379fdd9a-2a2c-4766-9c9f-9a9e37faafb1 {
    padding: var(--space-4);
  }
}

.zoca-b0076310-6536-46b3-b4a8-73e9c890fd3c {
  width: 100%;
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  border-radius: var(--radius-2-xl) var(--radius-2-xl) 0 0;
  background-color: var(--color-secondary-brand);
}

@media (max-width: 768Px) {
  .zoca-b0076310-6536-46b3-b4a8-73e9c890fd3c {
    max-height: 300px;
  }
}

@media (min-width: 1024Px) {
  .zoca-b0076310-6536-46b3-b4a8-73e9c890fd3c {
    width: 100%;
  overflow: hidden;
  border-radius: var(--radius-2-xl) 0 0 var(--radius-2-xl);
  }
}

.zoca-02d465e5-f8c5-4bf9-99ec-6b0b90589672 {
  width: 100%;
  height: 100%;
  max-height: 900px;
  object-fit: cover;
}

@media (max-width: 768Px) {
  .zoca-02d465e5-f8c5-4bf9-99ec-6b0b90589672 {
    max-height: 300px;
  }
}

.zoca-c479e5f1-7942-4619-97d7-5be2ad76bbee {
  color: var(--color-offer-card-content-foreground);
  display: flex;
  padding: var(--space-10) var(--space-6);
  box-shadow: var(--shadow-lg);
  align-items: center;
  border-radius: 0 0 var(--radius-2-xl) var(--radius-2-xl);
  flex-direction: column;
  justify-content: center;
  background-color: var(--color-offer-card-content-background);
}

@media (min-width: 768Px) {
  .zoca-c479e5f1-7942-4619-97d7-5be2ad76bbee {
    width: 100%;
  padding: var(--space-12);
  border-radius: 0 0 var(--radius-2-xl) var(--radius-2-xl);
  }
}

@media (min-width: 1024Px) {
  .zoca-c479e5f1-7942-4619-97d7-5be2ad76bbee {
    padding: var(--space-16);
  border-radius: 0 var(--radius-2-xl) var(--radius-2-xl) 0;
  }
}

.zoca-1b87d581-ffb5-46f1-91d7-81b1652811bd {
  color: inherit;
  font-size: 2.2rem;
  text-align: center;
  font-weight: var(--font-bold);
  margin-bottom: var(--space-6);
}

@media (min-width: 768Px) {
  .zoca-1b87d581-ffb5-46f1-91d7-81b1652811bd {
    font-size: 2.8rem;
  margin-bottom: var(--space-8);
  }
}

@media (min-width: 1024Px) {
  .zoca-1b87d581-ffb5-46f1-91d7-81b1652811bd {
    font-size: 3.4rem;
  }
}

.zoca-20de4152-8d9c-40f7-90a9-e804db3db367 {
  max-width: var(--container-sm);
  overflow: auto;
  max-height: 40vh;
  margin-bottom: var(--space-8);
  scrollbar-width: thin !important;
}

@media (max-width: 768Px) {
  .zoca-20de4152-8d9c-40f7-90a9-e804db3db367 {
    max-height: 30vh;
  margin-bottom: var(--space-6);
  }
}

.zoca-337d5352-9559-46ef-b714-08c61f1cee82 {
  display: flex;
  justify-content: center;
}

@media (min-width: 768Px) {
  .zoca-337d5352-9559-46ef-b714-08c61f1cee82 {
    margin-top: var(--space-6);
  }
}

.zoca-b3a88ea0-e079-47f6-a75f-5e47f41a0f47 {
  width: 100%;
  display: flex;
  flex-direction: column;
}

@media (min-width: 768Px) {
  .zoca-b3a88ea0-e079-47f6-a75f-5e47f41a0f47 {
    height: 700px;
  flex-direction: row !important;
  }
}

.zoca-b8a0e97a-1b4c-4941-8782-b20deff733f6 {
  padding: var(--space-10);
}

@media (max-width: 768Px) {
  .zoca-b8a0e97a-1b4c-4941-8782-b20deff733f6 {
    padding: var(--space-4);
  }
}

.zoca-3c14358a-e781-4e93-9d71-b864ef23b8b9 {
  width: 100%;
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  border-radius: var(--radius-2-xl) var(--radius-2-xl) 0 0;
  background-color: var(--color-secondary-brand);
}

@media (max-width: 768Px) {
  .zoca-3c14358a-e781-4e93-9d71-b864ef23b8b9 {
    max-height: 300px;
  }
}

@media (min-width: 1024Px) {
  .zoca-3c14358a-e781-4e93-9d71-b864ef23b8b9 {
    width: 100%;
  overflow: hidden;
  border-radius: var(--radius-2-xl) 0 0 var(--radius-2-xl);
  }
}

.zoca-0925cbe3-3e28-42be-8a2d-a22ecb18d34f {
  width: 100%;
  height: 100%;
  max-height: 900px;
  object-fit: cover;
}

@media (max-width: 768Px) {
  .zoca-0925cbe3-3e28-42be-8a2d-a22ecb18d34f {
    max-height: 300px;
  }
}

.zoca-f5d17730-c9e9-40f4-bcd5-3e455541d966 {
  color: var(--color-offer-card-content-foreground);
  display: flex;
  padding: var(--space-10) var(--space-6);
  box-shadow: var(--shadow-lg);
  align-items: center;
  border-radius: 0 0 var(--radius-2-xl) var(--radius-2-xl);
  flex-direction: column;
  justify-content: center;
  background-color: var(--color-offer-card-content-background);
}

@media (min-width: 768Px) {
  .zoca-f5d17730-c9e9-40f4-bcd5-3e455541d966 {
    width: 100%;
  padding: var(--space-12);
  border-radius: 0 0 var(--radius-2-xl) var(--radius-2-xl);
  }
}

@media (min-width: 1024Px) {
  .zoca-f5d17730-c9e9-40f4-bcd5-3e455541d966 {
    padding: var(--space-16);
  border-radius: 0 var(--radius-2-xl) var(--radius-2-xl) 0;
  }
}

.zoca-003bcfc9-ca93-4554-8aa8-3571df47d585 {
  color: inherit;
  font-size: 2.2rem;
  text-align: center;
  font-weight: var(--font-bold);
  margin-bottom: var(--space-6);
}

@media (min-width: 768Px) {
  .zoca-003bcfc9-ca93-4554-8aa8-3571df47d585 {
    font-size: 2.8rem;
  margin-bottom: var(--space-8);
  }
}

@media (min-width: 1024Px) {
  .zoca-003bcfc9-ca93-4554-8aa8-3571df47d585 {
    font-size: 3.4rem;
  }
}

.zoca-7ffcfde3-71e1-42a1-9633-34369cd07787 {
  max-width: var(--container-sm);
  overflow: auto;
  max-height: 40vh;
  margin-bottom: var(--space-8);
  scrollbar-width: thin !important;
}

@media (max-width: 768Px) {
  .zoca-7ffcfde3-71e1-42a1-9633-34369cd07787 {
    max-height: 30vh;
  margin-bottom: var(--space-6);
  }
}

.zoca-dfd81067-a876-4302-bcaa-9699d742b784 {
  display: flex;
  justify-content: center;
}

@media (min-width: 768Px) {
  .zoca-dfd81067-a876-4302-bcaa-9699d742b784 {
    margin-top: var(--space-6);
  }
}

.zoca-b3da2b19-a13f-451c-867a-6ca5e7346076 {
  display: none;
}

.zoca-ddd2229c-5603-49d3-973a-44df449aa932 {
  display: none;
}

.zoca-4b2b9154-ec27-4300-b905-2194dc7da640 {
  color: var(--color-testimonial-star-background);
}

.zoca-d4c370dd-515c-49cc-ba85-c8fa9a0d3e0b {
  color: var(--color-testimonial-star-background);
}

.zoca-5d54eecc-524a-4dbd-92db-a501c5c5035c {
  color: var(--color-testimonial-star-background);
}

.zoca-1876fd91-f983-420d-aae4-63c73e9dc6db {
  color: var(--color-testimonial-star-background);
}

.zoca-4e772e83-d546-47ef-8464-c8c4296cc998 {
  color: var(--color-testimonial-star-background);
}

.zoca-cfbb3570-1c79-4748-9cd1-0a00a9e9cad6 {
  color: var(--color-testimonial-star-background);
}

.zoca-40d406c4-08db-4808-981c-e811ccba3fe8 {
  color: var(--color-testimonial-star-background);
}

.zoca-df057317-4eff-4ccd-8763-d9a246f98ac2 {
  color: var(--color-testimonial-star-background);
}

.zoca-00c0eb9a-9a41-4578-8d7f-102a7e8da440 {
  color: var(--color-testimonial-star-background);
}

.zoca-44dc15b3-fdeb-4c01-a747-3dba17a62840 {
  color: var(--color-testimonial-star-background);
}

.zoca-df2ab259-99cf-478c-81f0-9dd119305c7d {
  color: var(--color-testimonial-star-background);
}

.zoca-8681ed56-32f3-4082-89f3-9938bfb7b4f6 {
  color: var(--color-testimonial-star-background);
}

.zoca-663f98c2-fa75-48d3-b698-ca3a9a6be12b {
  color: var(--color-testimonial-star-background);
}

.zoca-cc613401-df32-4b06-932f-7e328c0f0381 {
  color: var(--color-testimonial-star-background);
}

.zoca-b2e71faf-14ef-45dd-9f6a-91a99a0dfb8c {
  color: var(--color-testimonial-star-background);
}

.zoca-436ee22b-e02a-490b-8dcb-9330c4d2c1ba {
  color: var(--color-testimonial-star-background);
}

.zoca-6456e5e9-a591-43cb-924c-b028ca59a1d8 {
  color: var(--color-testimonial-star-background);
}

.zoca-b473f5a1-0569-4cfa-af28-c0ba42397929 {
  color: var(--color-testimonial-star-background);
}

.zoca-8f66c178-94de-4d72-9d7f-3c7beae1bbd3 {
  color: var(--color-testimonial-star-background);
}

.zoca-60a193d4-088e-4227-8f9f-1c83374d68d1 {
  color: var(--color-testimonial-star-background);
}

.zoca-fe1efb14-d865-453d-862c-39bf1e499707 {
  color: var(--color-testimonial-star-background);
}

.zoca-5f931d3e-a0e7-4755-a1d1-91679eab5563 {
  color: var(--color-testimonial-star-background);
}

.zoca-c434568c-fe2a-4b4f-ae4e-5b7fed10eb58 {
  color: var(--color-testimonial-star-background);
}

.zoca-ad1644c7-390a-4521-aedf-bc1bae9dcbb6 {
  color: var(--color-testimonial-star-background);
}

.zoca-5d25b06d-7933-4962-83c4-93388daa1284 {
  color: var(--color-testimonial-star-background);
}

.zoca-557bf2df-84d6-4839-bfeb-f2d999a26eeb {
  color: var(--color-testimonial-star-background);
}

.zoca-2fcb6458-fac0-4ba3-ae10-cb4982de7b09 {
  color: var(--color-testimonial-star-background);
}

.zoca-9f2d5bce-d15f-47da-b788-6955b505d172 {
  color: var(--color-testimonial-star-background);
}

.zoca-ed2b4d41-b4c2-4cdf-8bdc-cf172628860e {
  color: var(--color-testimonial-star-background);
}

.zoca-e8926097-ac99-4943-b2cb-04840f5e1939 {
  color: var(--color-testimonial-star-background);
}

.zoca-d81500fc-442f-45ef-99b2-a90e09c3871b {
  color: var(--color-testimonial-star-background);
}

.zoca-c24cf379-4fb3-436f-886e-2537d63d9844 {
  color: var(--color-testimonial-star-background);
}

.zoca-038f4c89-a9b8-4c84-ae6e-a1a8667f163f {
  color: var(--color-testimonial-star-background);
}

.zoca-e3eca80d-4221-423a-9c45-655b22d2a4ce {
  color: var(--color-testimonial-star-background);
}

.zoca-8635e066-2693-416e-bb73-baeae96eba6c {
  color: var(--color-testimonial-star-background);
}

.zoca-9b55d45e-7b0d-466b-b8a2-09e39d013bbd {
  color: var(--color-testimonial-star-background);
}

.zoca-1bf9c0f7-8466-4751-b6f1-4953303e0eaa {
  color: var(--color-testimonial-star-background);
}

.zoca-276e5724-092a-40ae-86b6-1764e1aa313d {
  color: var(--color-testimonial-star-background);
}

.zoca-8c7ebf82-4c48-46c1-bec5-0730319a2c31 {
  color: var(--color-testimonial-star-background);
}

.zoca-ae149d9f-083d-4aef-ad57-37e89d1f7f4d {
  color: var(--color-testimonial-star-background);
}

.zoca-8aa2a313-2921-4390-9215-8f82ed6aeb18 {
  color: var(--color-testimonial-star-background);
}

.zoca-7eb346e9-eca6-47f0-a78e-19b180552ff8 {
  color: var(--color-testimonial-star-background);
}

.zoca-91cbeb36-ee99-440c-84ca-50d32f6785c8 {
  color: var(--color-testimonial-star-background);
}

.zoca-b8cae0f0-364f-48fc-9f64-c1005c66bbca {
  color: var(--color-testimonial-star-background);
}

.zoca-2fb94096-b9c1-430b-8699-c01a019ae698 {
  color: var(--color-testimonial-star-background);
}

.zoca-9caa52f4-6229-4f0c-9197-9e3cd34e54d5 {
  color: var(--color-testimonial-star-background);
}

.zoca-e35c9273-ef18-4f8f-bc4e-9c806209013f {
  color: var(--color-testimonial-star-background);
}

.zoca-1637679e-3a4d-4efd-9ab3-71b21e305bef {
  color: var(--color-testimonial-star-background);
}

.zoca-84cfd3af-1abe-4d7b-92a4-8a8e1629e71f {
  color: var(--color-testimonial-star-background);
}

.zoca-354ccd63-c767-4662-965c-053d681d9575 {
  color: var(--color-testimonial-star-background);
}

.zoca-51a868c6-2b6d-496e-9b02-d58c7f04975a {
  color: var(--color-testimonial-star-background);
}

.zoca-9c9f61b4-295a-4dd6-b635-a99cb8a0e198 {
  color: var(--color-testimonial-star-background);
}

.zoca-caad0c2c-7d74-4365-a05a-7a3ecdba8125 {
  color: var(--color-testimonial-star-background);
}

.zoca-0d67aed8-8fdc-4ab9-8311-b5d14563e06b {
  color: var(--color-testimonial-star-background);
}

.zoca-fe54592e-ce81-4b81-907b-2c70d1d352fc {
  color: var(--color-testimonial-star-background);
}

.zoca-358e8b3f-0beb-4b16-9cfa-22eff50e3497 {
  color: var(--color-testimonial-star-background);
}

.zoca-8afb4e62-c3c4-4211-aa37-939869801a43 {
  color: var(--color-testimonial-star-background);
}

.zoca-57012adf-4eaa-4775-abe9-3e943ee381a7 {
  color: var(--color-testimonial-star-background);
}

.zoca-3ee02389-1797-4371-9899-fd81f0687c2b {
  color: var(--color-testimonial-star-background);
}

.zoca-bd3c9c09-143f-4f6f-9f96-58fd632b13f3 {
  color: var(--color-testimonial-star-background);
}

.zoca-623665d1-3792-461f-835f-19539a260470 {
  color: var(--color-testimonial-star-background);
}

.zoca-f194bff2-0ee9-4466-85cb-084c3c1ca005 {
  color: var(--color-testimonial-star-background);
}

.zoca-0efcf142-a7db-43d3-b013-a3511070dcc9 {
  color: var(--color-testimonial-star-background);
}

.zoca-6a98cdd2-4921-4943-96d1-95a7f982661b {
  color: var(--color-testimonial-star-background);
}

.zoca-9b7b06c5-7c39-4499-8d09-97d600c28366 {
  color: var(--color-testimonial-star-background);
}

.zoca-a60eb2d6-27d8-4580-abd5-cf694f92a880 {
  color: var(--color-testimonial-star-background);
}

.zoca-063c1295-5813-47df-a3b9-f6d57d1feb45 {
  color: var(--color-testimonial-star-background);
}

.zoca-87ae8893-c186-4972-a700-c0cb3632842c {
  color: var(--color-testimonial-star-background);
}

.zoca-40fb68f2-742d-4f44-9f35-431a25ed5ee1 {
  color: var(--color-testimonial-star-background);
}

.zoca-f3503372-716d-4a86-8ec7-617772e5d7b9 {
  color: var(--color-testimonial-star-background);
}

.zoca-09c92ad7-0eb2-4b04-a33a-d69156d000ba {
  color: var(--color-testimonial-star-background);
}

.zoca-b5720fc4-ea39-4944-a9e4-29403aa548d2 {
  color: var(--color-testimonial-star-background);
}

.zoca-9198d7cf-8254-4bfb-b2af-2d335bd457e2 {
  color: var(--color-testimonial-star-background);
}

.zoca-5ea9d7b6-60e0-4e64-9790-564c76917163 {
  color: var(--color-testimonial-star-background);
}

.zoca-1aa14176-5486-45da-a9d5-ffdbc9ad67a9 {
  color: var(--color-testimonial-star-background);
}

.zoca-f8bd792a-dbcf-4849-82d6-07be5c8c0e9d {
  color: var(--color-testimonial-star-background);
}

.zoca-5baa8731-ddd0-436a-a0f1-52d1453d5a78 {
  color: var(--color-testimonial-star-background);
}

.zoca-5373f15f-474d-40c8-a5ef-f5403b8e524f {
  color: var(--color-testimonial-star-background);
}

.zoca-a3213b4e-7e02-492c-8749-749cb6fad53e {
  color: var(--color-testimonial-star-background);
}

.zoca-10e00654-c8d6-43a3-a52c-3d0c0f867b59 {
  color: var(--color-testimonial-star-background);
}

.zoca-936dff61-8cd0-4853-a8ae-add87361e9d9 {
  color: var(--color-testimonial-star-background);
}

.zoca-90e70a52-af1f-47df-8393-2d16ce2bfd2e {
  color: var(--color-testimonial-star-background);
}

.zoca-7cbd9d8e-ec63-4e3b-a3be-f0a6652b38c4 {
  color: var(--color-testimonial-star-background);
}

.zoca-cd11db62-9e96-4ff4-8910-828cf28ae75f {
  color: var(--color-testimonial-star-background);
}

.zoca-dd81ea3c-b590-4cf8-8fbe-a693f464bf72 {
  color: var(--color-testimonial-star-background);
}

.zoca-388f63ff-eb46-420d-bc71-171aab22eb03 {
  color: var(--color-testimonial-star-background);
}

.zoca-9c930ca9-043e-49b9-a3ea-0d666876f204 {
  color: var(--color-testimonial-star-background);
}

.zoca-6d8a6fc5-b1d7-493c-8033-371529e59094 {
  color: var(--color-testimonial-star-background);
}

.zoca-9e38dddf-4071-4f5a-b958-028c53f9a28a {
  color: var(--color-testimonial-star-background);
}

.zoca-bba9e665-57df-406d-b7ce-3d6b8978db4f {
  color: var(--color-testimonial-star-background);
}

.zoca-01887b7c-a1ee-4f6c-8b8c-787402d99845 {
  color: var(--color-testimonial-star-background);
}

.zoca-b8f2a30e-aff2-4699-a8c2-dd0cb1e49491 {
  color: var(--color-testimonial-star-background);
}

.zoca-bbaf5f44-a093-485e-9631-e740803b5538 {
  color: var(--color-testimonial-star-background);
}

.zoca-adc0f337-7bd3-4744-bee8-b7c8caa7a479 {
  color: var(--color-testimonial-star-background);
}

.zoca-fa52ea2f-67cb-4f20-9269-9b55ddfd0fe8 {
  color: var(--color-testimonial-star-background);
}

.zoca-374108ae-5214-4b8a-84e9-414a74a54f0d {
  color: var(--color-testimonial-star-background);
}

.zoca-c5d955bc-5c40-4cff-b7d0-ef5a4ded260b {
  color: var(--color-testimonial-star-background);
}

.zoca-c778df8b-20df-4729-95dc-70da2fe221da {
  color: var(--color-testimonial-star-background);
}

.zoca-2cb4819b-382d-4485-85ed-3fe5859687e0 {
  color: var(--color-testimonial-star-background);
}

.zoca-18f030e8-1d75-4f38-a6a7-20fad1ee58d4 {
  color: var(--color-testimonial-star-background);
}

.zoca-9873e268-4e3e-426a-90c1-e3c67a55a9bf {
  display: none;
}

.zoca-97c0293a-28cd-4614-872e-f2f50afb88e5 {
  gap: 2rem;
  display: flex;
  align-items: center;
  flex-direction: column;
}

@media (min-width: 768Px) {
  .zoca-97c0293a-28cd-4614-872e-f2f50afb88e5 {
    gap: 4rem;
  align-items: center;
  flex-direction: row-reverse;
  justify-content: space-between;
  }
}

.zoca-9a24174b-cfb3-4137-8ff5-27f5e031e2f4 {
  width: 100%;
  margin: 0 auto;
  max-width: 550px;
  position: relative;
}

@media (min-width: 768Px) {
  .zoca-9a24174b-cfb3-4137-8ff5-27f5e031e2f4 {
    flex: 1;
  margin: 0;
  }
}

.zoca-3b29cea3-553c-4a6f-aaf0-3dcdcd7516fc {
  width: 100%;
  height: 400px;
  z-index: 2;
  display: block;
  position: relative;
  box-shadow: 0 10px 30px var(--color-black-alpha-30);
  object-fit: cover;
  border-radius: 0;
}

@media (min-width: 768Px) {
  .zoca-3b29cea3-553c-4a6f-aaf0-3dcdcd7516fc {
    width: 100%;
  height: 500px;
  }
}

@media (min-width: 1024Px) {
  .zoca-3b29cea3-553c-4a6f-aaf0-3dcdcd7516fc {
    height: 600px;
  }
}

.zoca-c354eac5-de56-49e7-a6b9-b8ffe3a8a3cc {
  margin: 0;
  max-width: 100%;
}

@media (min-width: 768Px) {
  .zoca-c354eac5-de56-49e7-a6b9-b8ffe3a8a3cc {
    flex: 1;
  margin: 0;
  padding: 0 var(--space-6) 0 0;
  max-width: 500px;
  }
}

.zoca-2676f833-8c0c-4e10-8f06-9e65db63e60a {
  margin: 0;
  font-size: var(--text-base);
  text-align: justify;
  line-height: 1.6;
}

@media (min-width: 768Px) {
  .zoca-2676f833-8c0c-4e10-8f06-9e65db63e60a {
    text-align: left;
  }
}

.zoca-6655c1d8-e85f-4501-a76a-b1146304feeb {
  display: inline;
}

.zoca-0066f24d-a237-4bf2-8c1e-be642ae8a825 {
  border: none;
  cursor: pointer;
  background: none;
  font-weight: bold;
  transition: color 0.3s ease;
}

.zoca-0066f24d-a237-4bf2-8c1e-be642ae8a825:focus {
  outline-offset: 2px;
}

.zoca-0066f24d-a237-4bf2-8c1e-be642ae8a825:hover {
  text-decoration: underline;
}

.zoca-1b1f0fb1-d823-471c-824c-83329bdcf340 {
  color: var(--color-staff-foreground);
  background-color: var(--color-staff-background);
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-1b1f0fb1-d823-471c-824c-83329bdcf340 {
    padding-top: 40px;
  }
}

.zoca-43986db4-3596-4174-bd53-cf203a830a03 {
  margin: 0 auto;
  max-width: 1200px;
}

.zoca-44ea8d5d-0623-4cfd-9b39-c43e99a17966 {
  text-align: center;
}

.zoca-0c365e05-3a19-4ede-9fa5-9afa0349839b {
  display: none;
}

.zoca-796c4f03-a104-465f-b987-93e06b14fdc6 {
  gap: 24px;
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box;
  align-items: stretch;
  justify-content: center;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-796c4f03-a104-465f-b987-93e06b14fdc6 {
    min-width: 340px;
  justify-content: center;
  grid-template-columns: 1fr;
  }
}

.zoca-fb4f7198-765b-42e0-9271-c4a0ebac6f65 {
  padding: 10px;
}

.zoca-c0991edb-dde9-48b1-abae-bd3e7d198a27 {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-c0991edb-dde9-48b1-abae-bd3e7d198a27:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-c0991edb-dde9-48b1-abae-bd3e7d198a27 {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-c0991edb-dde9-48b1-abae-bd3e7d198a27 {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-c0991edb-dde9-48b1-abae-bd3e7d198a27 {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-c0991edb-dde9-48b1-abae-bd3e7d198a27 {
    max-width: 300px;
  }
}

.zoca-7227bd82-cba3-4760-8a5a-f9550bc50f57 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-7227bd82-cba3-4760-8a5a-f9550bc50f57 {
    width: 250px;
  height: 250px;
  }
}

.zoca-7bee73b0-2e1e-44cc-b2c0-7406cfb5d16a {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-7bee73b0-2e1e-44cc-b2c0-7406cfb5d16a {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-96616687-e280-43db-8684-37a99b131d4f {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-96616687-e280-43db-8684-37a99b131d4f {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-2c61413b-dbbe-4604-8bd0-79c634129e03 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-684ad6aa-7306-4abd-a261-346657eff04e {
  display: none;
  transition: all 0.3s ease;
}

.zoca-ee5aa290-8267-461e-b6dd-ee491a90cf61 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-ee5aa290-8267-461e-b6dd-ee491a90cf61 {
    display: inline;
  }
}

.zoca-714a9615-421d-4848-8ff6-2787b6c5782d {
  padding: 10px;
}

.zoca-0cbf7bfe-0bb6-4d13-bc4c-5500841a704b {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-0cbf7bfe-0bb6-4d13-bc4c-5500841a704b:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-0cbf7bfe-0bb6-4d13-bc4c-5500841a704b {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-0cbf7bfe-0bb6-4d13-bc4c-5500841a704b {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-0cbf7bfe-0bb6-4d13-bc4c-5500841a704b {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-0cbf7bfe-0bb6-4d13-bc4c-5500841a704b {
    max-width: 300px;
  }
}

.zoca-3ad8df0d-dd4e-4872-9a19-98e82946fb75 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-3ad8df0d-dd4e-4872-9a19-98e82946fb75 {
    width: 250px;
  height: 250px;
  }
}

.zoca-308d5892-4e5c-44aa-b4e5-fd44ccdb3760 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-308d5892-4e5c-44aa-b4e5-fd44ccdb3760 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-8dc7d678-544e-45af-9914-bb44d64a3170 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-8dc7d678-544e-45af-9914-bb44d64a3170 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-a9cc2c6b-7aaf-4a04-885d-bac78dace1dc {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-ff654ec1-6a1a-4518-8405-502bf9866c47 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-5477380a-f5dc-4071-9736-ddc81a1ca0fd {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-5477380a-f5dc-4071-9736-ddc81a1ca0fd {
    display: inline;
  }
}

.zoca-fefdcb69-bf99-46aa-9d5c-e39293c6435e {
  padding: 10px;
}

.zoca-e1615b22-fa41-495a-878c-19560bb8df8a {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-e1615b22-fa41-495a-878c-19560bb8df8a:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-e1615b22-fa41-495a-878c-19560bb8df8a {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-e1615b22-fa41-495a-878c-19560bb8df8a {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-e1615b22-fa41-495a-878c-19560bb8df8a {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-e1615b22-fa41-495a-878c-19560bb8df8a {
    max-width: 300px;
  }
}

.zoca-115c08d4-c6b8-40ea-8f76-d351e08ce819 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-115c08d4-c6b8-40ea-8f76-d351e08ce819 {
    width: 250px;
  height: 250px;
  }
}

.zoca-6edbd82b-a1e5-4b79-92e8-971211c4e415 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-6edbd82b-a1e5-4b79-92e8-971211c4e415 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-79e35e0a-f3e9-4252-b3b8-41cde01a783d {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-79e35e0a-f3e9-4252-b3b8-41cde01a783d {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-6dc6fcec-c4c0-4e16-a94d-68f65480f2d9 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-ca0511e5-d20b-4474-bc3c-042017c73e2a {
  display: none;
  transition: all 0.3s ease;
}

.zoca-2f4c9bab-5eaf-4791-8318-c97baad32d6f {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-2f4c9bab-5eaf-4791-8318-c97baad32d6f {
    display: inline;
  }
}

.zoca-35dd0c1f-9854-4c73-a197-dfa9cc2dfa5a {
  padding: 10px;
}

.zoca-96880f97-3406-4e3f-9e54-3d274c4056db {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-96880f97-3406-4e3f-9e54-3d274c4056db:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-96880f97-3406-4e3f-9e54-3d274c4056db {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-96880f97-3406-4e3f-9e54-3d274c4056db {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-96880f97-3406-4e3f-9e54-3d274c4056db {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-96880f97-3406-4e3f-9e54-3d274c4056db {
    max-width: 300px;
  }
}

.zoca-6aa3f741-5dfb-49a9-ba36-4f558ffb7ba0 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-6aa3f741-5dfb-49a9-ba36-4f558ffb7ba0 {
    width: 250px;
  height: 250px;
  }
}

.zoca-b2539ee1-f64b-44d7-91f9-fe252213e6ea {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-b2539ee1-f64b-44d7-91f9-fe252213e6ea {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-0fa000ca-12fb-4693-b378-a2eaeda5f705 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-0fa000ca-12fb-4693-b378-a2eaeda5f705 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-7b55dbfc-e5d1-4c92-8f2c-24de64306b53 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-bde334d3-d1d5-4075-b7bf-9f3b18ee6ef8 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-e5c51d89-fa2a-4162-93e9-65da75ab6298 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-e5c51d89-fa2a-4162-93e9-65da75ab6298 {
    display: inline;
  }
}

.zoca-d405c74a-844f-4fb3-832a-5a6e907bfd86 {
  padding: 10px;
}

.zoca-1ab71586-7bc4-4e35-a483-2066e7872186 {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-1ab71586-7bc4-4e35-a483-2066e7872186:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-1ab71586-7bc4-4e35-a483-2066e7872186 {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-1ab71586-7bc4-4e35-a483-2066e7872186 {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-1ab71586-7bc4-4e35-a483-2066e7872186 {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-1ab71586-7bc4-4e35-a483-2066e7872186 {
    max-width: 300px;
  }
}

.zoca-85afd1e2-b952-48e0-a850-a2d1aa52f972 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-85afd1e2-b952-48e0-a850-a2d1aa52f972 {
    width: 250px;
  height: 250px;
  }
}

.zoca-7c9344ff-5f82-4441-958d-78ca61389e2c {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-7c9344ff-5f82-4441-958d-78ca61389e2c {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-6e902703-57bc-4132-9599-d4b694f36eea {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-6e902703-57bc-4132-9599-d4b694f36eea {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-7ea1e86e-1282-4008-bf66-89b51b3e59b1 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-38a2b5fc-aff4-4c1b-b262-19b0123cc6cb {
  display: none;
  transition: all 0.3s ease;
}

.zoca-0234da9a-87e0-44bb-8281-cb7e3228234a {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-0234da9a-87e0-44bb-8281-cb7e3228234a {
    display: inline;
  }
}

.zoca-afafe96c-8dbc-408d-a8d2-6f1566ff4494 {
  padding: 10px;
}

.zoca-f893711f-1eab-474f-8a7b-59de050520c6 {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-f893711f-1eab-474f-8a7b-59de050520c6:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-f893711f-1eab-474f-8a7b-59de050520c6 {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-f893711f-1eab-474f-8a7b-59de050520c6 {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-f893711f-1eab-474f-8a7b-59de050520c6 {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-f893711f-1eab-474f-8a7b-59de050520c6 {
    max-width: 300px;
  }
}

.zoca-57e52a6b-f402-4b52-8c5a-9e2a59cf2c2c {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-57e52a6b-f402-4b52-8c5a-9e2a59cf2c2c {
    width: 250px;
  height: 250px;
  }
}

.zoca-2a088bb2-8ae9-49e0-8241-af5105a0c1d8 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-2a088bb2-8ae9-49e0-8241-af5105a0c1d8 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-183740ef-72a0-4fbd-868b-66b3d42e0da5 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-183740ef-72a0-4fbd-868b-66b3d42e0da5 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-a0583c21-6f1b-4021-a631-802614b9496b {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-649955af-edd7-4a26-a21c-4222d0d2a3cb {
  display: none;
  transition: all 0.3s ease;
}

.zoca-d5f1ca08-b652-41bd-9fd0-bc6fbbff2faf {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-d5f1ca08-b652-41bd-9fd0-bc6fbbff2faf {
    display: inline;
  }
}

.zoca-f21c27fc-486d-4eb4-bf9d-2afe8fee6cbd {
  padding: 10px;
}

.zoca-352e4ebc-1102-4b7b-bf96-41e0db6edb42 {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-352e4ebc-1102-4b7b-bf96-41e0db6edb42:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-352e4ebc-1102-4b7b-bf96-41e0db6edb42 {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-352e4ebc-1102-4b7b-bf96-41e0db6edb42 {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-352e4ebc-1102-4b7b-bf96-41e0db6edb42 {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-352e4ebc-1102-4b7b-bf96-41e0db6edb42 {
    max-width: 300px;
  }
}

.zoca-1d015273-de42-456d-8cdc-220bd6ad6bf0 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-1d015273-de42-456d-8cdc-220bd6ad6bf0 {
    width: 250px;
  height: 250px;
  }
}

.zoca-935b526f-0bbe-410d-a52e-57ff916bf70c {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-935b526f-0bbe-410d-a52e-57ff916bf70c {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-6b99317f-e1ac-46c3-aa31-e99325754a03 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-6b99317f-e1ac-46c3-aa31-e99325754a03 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-a79e8b39-e3c7-49c6-b34b-d59ba40297fe {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-10a525f1-d66f-4dda-a0f5-333c248e0780 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-e48d23bf-d301-479a-afa1-531311d3a987 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-e48d23bf-d301-479a-afa1-531311d3a987 {
    display: inline;
  }
}

.zoca-ea94ce65-484e-48fc-bacd-2e62a90d1ff0 {
  padding: 10px;
}

.zoca-bd15bf5b-75c6-4bdd-be05-9d90c96a3434 {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-bd15bf5b-75c6-4bdd-be05-9d90c96a3434:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-bd15bf5b-75c6-4bdd-be05-9d90c96a3434 {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-bd15bf5b-75c6-4bdd-be05-9d90c96a3434 {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-bd15bf5b-75c6-4bdd-be05-9d90c96a3434 {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-bd15bf5b-75c6-4bdd-be05-9d90c96a3434 {
    max-width: 300px;
  }
}

.zoca-f3cf2c7c-1677-4bcb-a864-f5a1ef3f64f4 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-f3cf2c7c-1677-4bcb-a864-f5a1ef3f64f4 {
    width: 250px;
  height: 250px;
  }
}

.zoca-a823800d-07b8-4fe7-a266-597b5d5933c9 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-a823800d-07b8-4fe7-a266-597b5d5933c9 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-9da675ef-ffe3-4314-8c73-0abf4d2080a7 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-9da675ef-ffe3-4314-8c73-0abf4d2080a7 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-02768ea7-ba5f-4710-8f9e-0766a92944c4 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-d264e394-405f-49c2-bbd4-ca60190f5e44 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-8ce490bf-9a13-4a81-89cf-ebd82e89e14c {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-8ce490bf-9a13-4a81-89cf-ebd82e89e14c {
    display: inline;
  }
}

.zoca-d2bbda77-241f-49a1-b30c-a7790a40ce99 {
  padding: 10px;
}

.zoca-3a8bf02a-cec3-4848-b7e4-ce007814c36b {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-3a8bf02a-cec3-4848-b7e4-ce007814c36b:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-3a8bf02a-cec3-4848-b7e4-ce007814c36b {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-3a8bf02a-cec3-4848-b7e4-ce007814c36b {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-3a8bf02a-cec3-4848-b7e4-ce007814c36b {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-3a8bf02a-cec3-4848-b7e4-ce007814c36b {
    max-width: 300px;
  }
}

.zoca-e71b5b0d-b1e6-491a-901b-4d2fb852b4b5 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-e71b5b0d-b1e6-491a-901b-4d2fb852b4b5 {
    width: 250px;
  height: 250px;
  }
}

.zoca-48367ad6-58c7-4b5d-aba3-b0483a66427b {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-48367ad6-58c7-4b5d-aba3-b0483a66427b {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-70afc4da-ff57-4d3c-91d2-95d1d5940f15 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-70afc4da-ff57-4d3c-91d2-95d1d5940f15 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-0f41e988-981b-4de0-8719-603da4805144 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-8b1d8330-cc3d-431c-97ee-5cb625890d22 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-bab400b6-5b21-4d78-858f-9d3f190bb24b {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-bab400b6-5b21-4d78-858f-9d3f190bb24b {
    display: inline;
  }
}

.zoca-c46ad3fc-e9c3-44e7-bdf4-08b98d312a96 {
  padding: 10px;
}

.zoca-96763070-3b9f-473e-b8de-66e005469faf {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-96763070-3b9f-473e-b8de-66e005469faf:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-96763070-3b9f-473e-b8de-66e005469faf {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-96763070-3b9f-473e-b8de-66e005469faf {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-96763070-3b9f-473e-b8de-66e005469faf {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-96763070-3b9f-473e-b8de-66e005469faf {
    max-width: 300px;
  }
}

.zoca-11422119-a3a4-4c7e-b749-10c5794dac50 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-11422119-a3a4-4c7e-b749-10c5794dac50 {
    width: 250px;
  height: 250px;
  }
}

.zoca-d6fd684c-34d9-4f8e-8bff-cb81f72f5ba3 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-d6fd684c-34d9-4f8e-8bff-cb81f72f5ba3 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-fd089521-1ba5-48f6-ac03-6d3ad33c565e {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-fd089521-1ba5-48f6-ac03-6d3ad33c565e {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-191a7cc4-c749-49c7-98e5-8a3b96bef089 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-b685786f-aded-4dd6-bd6a-70e2d634aba7 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-b075c55a-17fb-4bcf-976a-f352d56e5d40 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-b075c55a-17fb-4bcf-976a-f352d56e5d40 {
    display: inline;
  }
}

.zoca-461f0fde-302b-46a1-9ab4-2339692fbc84 {
  padding: 10px;
}

.zoca-be102e5e-e0ba-4b9c-be26-fb19d98343f7 {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-be102e5e-e0ba-4b9c-be26-fb19d98343f7:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-be102e5e-e0ba-4b9c-be26-fb19d98343f7 {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-be102e5e-e0ba-4b9c-be26-fb19d98343f7 {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-be102e5e-e0ba-4b9c-be26-fb19d98343f7 {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-be102e5e-e0ba-4b9c-be26-fb19d98343f7 {
    max-width: 300px;
  }
}

.zoca-4ab9f93c-b2f8-49ce-aa96-505a596ebde1 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-4ab9f93c-b2f8-49ce-aa96-505a596ebde1 {
    width: 250px;
  height: 250px;
  }
}

.zoca-689733aa-49fe-4a79-a2ea-992c863bb088 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-689733aa-49fe-4a79-a2ea-992c863bb088 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-4a768130-c081-4f41-812e-e4a8933b5019 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-4a768130-c081-4f41-812e-e4a8933b5019 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-44343aa6-1f1b-4c1a-a5dc-d3b325034316 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-1d1b2f10-a789-4891-887b-a282a0df71a3 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-7ebc27b2-04ae-4c75-8f87-83f8140c7fc7 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-7ebc27b2-04ae-4c75-8f87-83f8140c7fc7 {
    display: inline;
  }
}

.zoca-4b6e5467-81fe-420b-8415-31e0b684169d {
  padding: 10px;
}

.zoca-3e36814c-2be4-4a62-bb4d-8d215762cbc5 {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-3e36814c-2be4-4a62-bb4d-8d215762cbc5:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-3e36814c-2be4-4a62-bb4d-8d215762cbc5 {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-3e36814c-2be4-4a62-bb4d-8d215762cbc5 {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-3e36814c-2be4-4a62-bb4d-8d215762cbc5 {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-3e36814c-2be4-4a62-bb4d-8d215762cbc5 {
    max-width: 300px;
  }
}

.zoca-cdd1afcb-8435-4044-9c32-765303a3af08 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-cdd1afcb-8435-4044-9c32-765303a3af08 {
    width: 250px;
  height: 250px;
  }
}

.zoca-6a213e3c-c079-40ff-a0ef-7556d4f74233 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-6a213e3c-c079-40ff-a0ef-7556d4f74233 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-0526b9e2-1084-4327-9d28-ea946e42089b {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-0526b9e2-1084-4327-9d28-ea946e42089b {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-682e67b7-7be8-442f-b7ab-e7f5bd8f1ef8 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-b76f675c-74fb-42e2-9577-87a703435fb2 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-068a0508-4be9-4aed-b6f0-74f05acd6729 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-068a0508-4be9-4aed-b6f0-74f05acd6729 {
    display: inline;
  }
}

.zoca-d11c8abe-6ff8-450e-8a9f-8d33ce6b86b1 {
  padding: 10px;
}

.zoca-0d10a8d1-0fad-48dc-8084-5c3fde1cc648 {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-0d10a8d1-0fad-48dc-8084-5c3fde1cc648:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-0d10a8d1-0fad-48dc-8084-5c3fde1cc648 {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-0d10a8d1-0fad-48dc-8084-5c3fde1cc648 {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-0d10a8d1-0fad-48dc-8084-5c3fde1cc648 {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-0d10a8d1-0fad-48dc-8084-5c3fde1cc648 {
    max-width: 300px;
  }
}

.zoca-6bf5b475-ecda-4dc0-be25-5e9c5003241f {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-6bf5b475-ecda-4dc0-be25-5e9c5003241f {
    width: 250px;
  height: 250px;
  }
}

.zoca-07030337-7f72-4667-82a9-e0bee83207c3 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-07030337-7f72-4667-82a9-e0bee83207c3 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-46f0b4d1-b4b9-4226-9dd3-078e1b3b2595 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-46f0b4d1-b4b9-4226-9dd3-078e1b3b2595 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-da91b78b-1675-46b0-9771-b90d34f11376 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-66a83875-2fbf-4e8b-9fee-27f1bacd32fc {
  display: none;
  transition: all 0.3s ease;
}

.zoca-97deb88a-ffc0-41b8-9b60-d4a85465bac8 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-97deb88a-ffc0-41b8-9b60-d4a85465bac8 {
    display: inline;
  }
}

.zoca-f0e3ac0f-fc98-4c48-ae8c-6c8e77590d93 {
  padding: 10px;
}

.zoca-569f8e8d-8b04-4813-a573-11cd06c3396d {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-569f8e8d-8b04-4813-a573-11cd06c3396d:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-569f8e8d-8b04-4813-a573-11cd06c3396d {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-569f8e8d-8b04-4813-a573-11cd06c3396d {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-569f8e8d-8b04-4813-a573-11cd06c3396d {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-569f8e8d-8b04-4813-a573-11cd06c3396d {
    max-width: 300px;
  }
}

.zoca-fe7241c2-1d54-4662-bae5-8431976ce4db {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-fe7241c2-1d54-4662-bae5-8431976ce4db {
    width: 250px;
  height: 250px;
  }
}

.zoca-bd6f1953-af0f-41cb-9d6c-5c1a0f77e7dd {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-bd6f1953-af0f-41cb-9d6c-5c1a0f77e7dd {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-a43aaca4-6199-4111-a785-80b523695958 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-a43aaca4-6199-4111-a785-80b523695958 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-6855ef5a-fc4d-4988-9702-d54371298492 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-d0051a32-bc52-402d-ad94-13fdf9c52e66 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-38d2efa7-8e3e-4650-8e8d-c18f49c75383 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-38d2efa7-8e3e-4650-8e8d-c18f49c75383 {
    display: inline;
  }
}

.zoca-ea062942-eecc-4e40-8e41-97af2e135044 {
  padding: 10px;
}

.zoca-ad4a7b6b-67e5-4cc4-8eca-f5ab710ba7b7 {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-ad4a7b6b-67e5-4cc4-8eca-f5ab710ba7b7:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-ad4a7b6b-67e5-4cc4-8eca-f5ab710ba7b7 {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-ad4a7b6b-67e5-4cc4-8eca-f5ab710ba7b7 {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-ad4a7b6b-67e5-4cc4-8eca-f5ab710ba7b7 {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-ad4a7b6b-67e5-4cc4-8eca-f5ab710ba7b7 {
    max-width: 300px;
  }
}

.zoca-345f35d8-eac1-44a1-a361-93e89f7cf996 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-345f35d8-eac1-44a1-a361-93e89f7cf996 {
    width: 250px;
  height: 250px;
  }
}

.zoca-765957da-5d24-404e-b63c-d3d336c8a631 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-765957da-5d24-404e-b63c-d3d336c8a631 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-e6f72be9-176f-40ad-aadd-1b1b9f84951e {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-e6f72be9-176f-40ad-aadd-1b1b9f84951e {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-942a589e-ce70-4bb1-a9ce-aae97a654b35 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-4a329565-d1ae-4abb-9fdf-168b07c05396 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-ea50a960-ffbd-4acd-b26b-59b2d2a7c0d9 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-ea50a960-ffbd-4acd-b26b-59b2d2a7c0d9 {
    display: inline;
  }
}

.zoca-5a07cc0d-5df7-42f7-91a1-71995c0efd45 {
  padding: 10px;
}

.zoca-c36c6c8e-7da7-4211-83a6-db542cea44f4 {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-c36c6c8e-7da7-4211-83a6-db542cea44f4:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-c36c6c8e-7da7-4211-83a6-db542cea44f4 {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-c36c6c8e-7da7-4211-83a6-db542cea44f4 {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-c36c6c8e-7da7-4211-83a6-db542cea44f4 {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-c36c6c8e-7da7-4211-83a6-db542cea44f4 {
    max-width: 300px;
  }
}

.zoca-692a6f6f-0854-4d53-9342-9af4dcda1e48 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-692a6f6f-0854-4d53-9342-9af4dcda1e48 {
    width: 250px;
  height: 250px;
  }
}

.zoca-78bbc0e9-f728-419f-8b09-27c55368da53 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-78bbc0e9-f728-419f-8b09-27c55368da53 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-690a8f70-0ad5-4981-94dd-aafe4a986595 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-690a8f70-0ad5-4981-94dd-aafe4a986595 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-7bd42940-dc25-463a-82ed-a44cfcdb85ab {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-80c67acb-6004-4b7c-9cb6-a12a3ea4cd1e {
  display: none;
  transition: all 0.3s ease;
}

.zoca-c072598c-9c27-493a-acaf-4f0193b99479 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-c072598c-9c27-493a-acaf-4f0193b99479 {
    display: inline;
  }
}

.zoca-9c309aa9-ee6a-4e9d-9dbb-cf6d1c5615f2 {
  padding: 10px;
}

.zoca-7fc9e24b-4048-4d55-8a58-dd998e096e5a {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-7fc9e24b-4048-4d55-8a58-dd998e096e5a:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-7fc9e24b-4048-4d55-8a58-dd998e096e5a {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-7fc9e24b-4048-4d55-8a58-dd998e096e5a {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-7fc9e24b-4048-4d55-8a58-dd998e096e5a {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-7fc9e24b-4048-4d55-8a58-dd998e096e5a {
    max-width: 300px;
  }
}

.zoca-68f68019-bfae-4ba6-9202-c56e0bb77c20 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-68f68019-bfae-4ba6-9202-c56e0bb77c20 {
    width: 250px;
  height: 250px;
  }
}

.zoca-4271c355-53e6-4efd-8f94-51c88b04fbd8 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-4271c355-53e6-4efd-8f94-51c88b04fbd8 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-8664100f-0a4d-4ba8-adfe-72fd92811d7c {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-8664100f-0a4d-4ba8-adfe-72fd92811d7c {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-c4c78299-7de1-4242-a891-16148a561abb {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-d5d3ddef-30ba-4099-93cb-39d8d47b2b14 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-724249f7-6cdc-4f8f-a21a-7d2bb3df4b8b {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-724249f7-6cdc-4f8f-a21a-7d2bb3df4b8b {
    display: inline;
  }
}

.zoca-db2b400d-ae21-4028-9e57-bbb0fb5feac7 {
  padding: 10px;
}

.zoca-fadac9a4-8102-44a6-9d10-6f2e65907d92 {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-fadac9a4-8102-44a6-9d10-6f2e65907d92:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-fadac9a4-8102-44a6-9d10-6f2e65907d92 {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-fadac9a4-8102-44a6-9d10-6f2e65907d92 {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-fadac9a4-8102-44a6-9d10-6f2e65907d92 {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-fadac9a4-8102-44a6-9d10-6f2e65907d92 {
    max-width: 300px;
  }
}

.zoca-a164f1d5-4e3b-46d0-9de2-51b685e67b11 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-a164f1d5-4e3b-46d0-9de2-51b685e67b11 {
    width: 250px;
  height: 250px;
  }
}

.zoca-087e45a3-4513-45d2-a068-83b6efc56167 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-087e45a3-4513-45d2-a068-83b6efc56167 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-fa0986a8-cb53-409f-ab99-266da0f7abc8 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-fa0986a8-cb53-409f-ab99-266da0f7abc8 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-47e9af7b-6996-4e82-8af5-4afa90021ab3 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-042698a0-882f-4185-bc63-8749d6877554 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-b9213bee-646b-4f05-906f-060235bc3cd9 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-b9213bee-646b-4f05-906f-060235bc3cd9 {
    display: inline;
  }
}

.zoca-8590d80c-0084-469c-bf1c-e8b78311acd6 {
  padding: 10px;
}

.zoca-fdcc7128-c5e8-4d60-a8c8-ffc7e48ad62a {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-fdcc7128-c5e8-4d60-a8c8-ffc7e48ad62a:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-fdcc7128-c5e8-4d60-a8c8-ffc7e48ad62a {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-fdcc7128-c5e8-4d60-a8c8-ffc7e48ad62a {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-fdcc7128-c5e8-4d60-a8c8-ffc7e48ad62a {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-fdcc7128-c5e8-4d60-a8c8-ffc7e48ad62a {
    max-width: 300px;
  }
}

.zoca-9109391a-08be-48f3-8720-d21f9e01a0ac {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-9109391a-08be-48f3-8720-d21f9e01a0ac {
    width: 250px;
  height: 250px;
  }
}

.zoca-135bb8d9-d7d1-4700-be69-cd1674fd6857 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-135bb8d9-d7d1-4700-be69-cd1674fd6857 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-8df7b16e-320f-4b6a-8732-08d917240203 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-8df7b16e-320f-4b6a-8732-08d917240203 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-16749bec-2c6e-4d5c-bd37-adc1520d7d96 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-b804d4bf-b8b3-4f7b-8252-2f28998b311e {
  display: none;
  transition: all 0.3s ease;
}

.zoca-7083e8e7-ffbb-46ff-9710-d4d234f9e7b6 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-7083e8e7-ffbb-46ff-9710-d4d234f9e7b6 {
    display: inline;
  }
}

.zoca-274e0f51-94bd-4f01-865f-964cd5450344 {
  padding: 10px;
}

.zoca-d94a6b6a-6ceb-48dd-a850-4660dba19292 {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-d94a6b6a-6ceb-48dd-a850-4660dba19292:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-d94a6b6a-6ceb-48dd-a850-4660dba19292 {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-d94a6b6a-6ceb-48dd-a850-4660dba19292 {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-d94a6b6a-6ceb-48dd-a850-4660dba19292 {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-d94a6b6a-6ceb-48dd-a850-4660dba19292 {
    max-width: 300px;
  }
}

.zoca-32594566-e135-449c-bc7a-24b88203c185 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-32594566-e135-449c-bc7a-24b88203c185 {
    width: 250px;
  height: 250px;
  }
}

.zoca-bcef201d-1213-4519-bc48-45338c99222a {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-bcef201d-1213-4519-bc48-45338c99222a {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-dc7cf586-e0d3-4107-b1e0-9a89805dfa15 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-dc7cf586-e0d3-4107-b1e0-9a89805dfa15 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-1d7134e5-5fa3-40c8-97fb-b1d5b70eb716 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-1805ccd1-8d8e-4430-b1c5-d3f672510445 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-b320e71d-2379-4bb8-a337-10a538e8b3e0 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-b320e71d-2379-4bb8-a337-10a538e8b3e0 {
    display: inline;
  }
}

.zoca-d331bbcb-78fb-4ab5-8b3d-4d476b5eb226 {
  padding: 10px;
}

.zoca-4b0d9f2c-c61d-4a9b-aa65-c7a6747505df {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-4b0d9f2c-c61d-4a9b-aa65-c7a6747505df:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-4b0d9f2c-c61d-4a9b-aa65-c7a6747505df {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-4b0d9f2c-c61d-4a9b-aa65-c7a6747505df {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-4b0d9f2c-c61d-4a9b-aa65-c7a6747505df {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-4b0d9f2c-c61d-4a9b-aa65-c7a6747505df {
    max-width: 300px;
  }
}

.zoca-c901c3ff-9a16-4e41-89ee-2330d75e4d5f {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-c901c3ff-9a16-4e41-89ee-2330d75e4d5f {
    width: 250px;
  height: 250px;
  }
}

.zoca-17ab7a5e-a5fb-43ff-acb5-ed546c8349d4 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-17ab7a5e-a5fb-43ff-acb5-ed546c8349d4 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-4bb1cecb-aef8-40d4-987a-5627c465030a {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-4bb1cecb-aef8-40d4-987a-5627c465030a {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-3b4c9ffb-edf1-4af9-a579-ba74076a2091 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-fa0c94ba-bc09-44ec-bef5-6bd5b9127f37 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-a9ec30eb-ea36-4c1c-bc1a-2f849eebdb2c {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-a9ec30eb-ea36-4c1c-bc1a-2f849eebdb2c {
    display: inline;
  }
}

.zoca-871e7be3-9386-46c7-ac98-2dcda1582beb {
  padding: 10px;
}

.zoca-62c9459f-aa26-4328-a619-7c13bb532604 {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-62c9459f-aa26-4328-a619-7c13bb532604:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-62c9459f-aa26-4328-a619-7c13bb532604 {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-62c9459f-aa26-4328-a619-7c13bb532604 {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-62c9459f-aa26-4328-a619-7c13bb532604 {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-62c9459f-aa26-4328-a619-7c13bb532604 {
    max-width: 300px;
  }
}

.zoca-17100529-8d13-417b-a19d-b44775221bbc {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-17100529-8d13-417b-a19d-b44775221bbc {
    width: 250px;
  height: 250px;
  }
}

.zoca-6e7c917b-6db1-4c79-8953-1f4f81fda77d {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-6e7c917b-6db1-4c79-8953-1f4f81fda77d {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-c6bccb3e-c3dc-4fae-a116-72537e027cde {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-c6bccb3e-c3dc-4fae-a116-72537e027cde {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-b5954b54-ad94-4625-8b3c-db568da24682 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-87c17875-1792-455f-8712-b5e58c6b90c8 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-df9bb43f-c774-429c-9aae-dbcc58a37d05 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-df9bb43f-c774-429c-9aae-dbcc58a37d05 {
    display: inline;
  }
}

.zoca-52a3f525-35be-4389-a2e6-e3d9bffa0a33 {
  padding: 10px;
}

.zoca-2e23d83c-a4c1-4d10-9115-5f3e41087cbc {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-2e23d83c-a4c1-4d10-9115-5f3e41087cbc:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-2e23d83c-a4c1-4d10-9115-5f3e41087cbc {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-2e23d83c-a4c1-4d10-9115-5f3e41087cbc {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-2e23d83c-a4c1-4d10-9115-5f3e41087cbc {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-2e23d83c-a4c1-4d10-9115-5f3e41087cbc {
    max-width: 300px;
  }
}

.zoca-db7d433d-463e-4482-ae13-3a32a7e3601f {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-db7d433d-463e-4482-ae13-3a32a7e3601f {
    width: 250px;
  height: 250px;
  }
}

.zoca-9e6c50da-1f11-4850-9bcb-9676205641c5 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-9e6c50da-1f11-4850-9bcb-9676205641c5 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-11501f3e-d9cc-416b-83b5-251b13282b96 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-11501f3e-d9cc-416b-83b5-251b13282b96 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-123fe244-8c5c-44df-89dc-da5794a60000 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-353ca5db-136f-49f9-8a24-4ea3f19085cf {
  display: none;
  transition: all 0.3s ease;
}

.zoca-39f148a6-d5bd-424c-9157-9976ccf06128 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-39f148a6-d5bd-424c-9157-9976ccf06128 {
    display: inline;
  }
}

.zoca-83f169cc-6caa-4c15-8e07-cc24edd1719d {
  padding: 10px;
}

.zoca-80d27f3a-88a4-48e4-8de6-91597d89ad84 {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-80d27f3a-88a4-48e4-8de6-91597d89ad84:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-80d27f3a-88a4-48e4-8de6-91597d89ad84 {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-80d27f3a-88a4-48e4-8de6-91597d89ad84 {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-80d27f3a-88a4-48e4-8de6-91597d89ad84 {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-80d27f3a-88a4-48e4-8de6-91597d89ad84 {
    max-width: 300px;
  }
}

.zoca-6d08a06f-cb47-43df-90e2-3fbe53c102c0 {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-6d08a06f-cb47-43df-90e2-3fbe53c102c0 {
    width: 250px;
  height: 250px;
  }
}

.zoca-153bc551-9f68-40d2-871a-b7c27495d623 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-153bc551-9f68-40d2-871a-b7c27495d623 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-ed32343d-6697-4eed-8c9a-99234ff03a42 {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-ed32343d-6697-4eed-8c9a-99234ff03a42 {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-11b097a3-30d9-46b7-b538-bd9792eec920 {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-9fd39df4-43af-4c94-ba63-76e9a453402f {
  display: none;
  transition: all 0.3s ease;
}

.zoca-e19e5590-4977-4585-90aa-f0c5d36129b9 {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-e19e5590-4977-4585-90aa-f0c5d36129b9 {
    display: inline;
  }
}

.zoca-9034ffc7-0d89-46ae-9d6b-8619f33d4932 {
  padding: 10px;
}

.zoca-a9574748-f0cd-4b28-be97-d0041a1ad7eb {
  flex: 0 0 calc(33.333% - 16px);
  color: var(--color-staff-card-foreground);
  width: 100%;
  border: 2px solid transparent;
  max-width: 380px;
  min-height: 474px;
  text-align: center;
  padding-top: 1.5rem;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding-bottom: 1.5rem;
  padding-inline: 1rem;
  background-color: var(--color-staff-card-background);
}

.zoca-a9574748-f0cd-4b28-be97-d0041a1ad7eb:hover {
  border-color: var(--color-staff-card-border);
}

@media (max-width: 640px) {
  .zoca-a9574748-f0cd-4b28-be97-d0041a1ad7eb {
    flex: 0 0 100%;
  }
}

@media (max-width: 1024px) {
  .zoca-a9574748-f0cd-4b28-be97-d0041a1ad7eb {
    flex: 0 0 calc(50% - 12px);
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-a9574748-f0cd-4b28-be97-d0041a1ad7eb {
    max-width: 320px;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-a9574748-f0cd-4b28-be97-d0041a1ad7eb {
    max-width: 300px;
  }
}

.zoca-a2a53a04-2edc-4cb3-9a21-6561a4ba907a {
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 25px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-a2a53a04-2edc-4cb3-9a21-6561a4ba907a {
    width: 250px;
  height: 250px;
  }
}

.zoca-b21bd9be-210e-4b8d-9175-708178496d69 {
  height: 60px;
  display: -webkit-box;
  font-size: 1.25rem;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 10px;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-b21bd9be-210e-4b8d-9175-708178496d69 {
    height: 40px;
  font-size: 1rem;
  }
}

.zoca-8a34b78a-1f05-477f-a87b-0222d5dcfd5c {
  height: 80px;
  font-size: 1.25rem;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 10px;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-8a34b78a-1f05-477f-a87b-0222d5dcfd5c {
    height: 40px;
  font-size: 0.95rem;
  }
}

.zoca-ee32fea1-37af-431c-9896-2d6f4d21b03b {
  display: -webkit-box;
  font-size: inherit;
  overflow: hidden;
  transition: font-size 0.3s ease;
  white-space: pre-wrap;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.zoca-7954a4b3-8ec3-4173-80f3-f12a5405cb20 {
  display: none;
  transition: all 0.3s ease;
}

.zoca-5b4b09da-bbad-42a5-ab0f-f7333be95d8b {
  cursor: pointer;
  display: inline;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-5b4b09da-bbad-42a5-ab0f-f7333be95d8b {
    display: inline;
  }
}

.zoca-997f50de-f873-4deb-9077-c1c5cc474543 {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
  display: none;
  position: fixed;
  background-color: rgba(0, 0, 0, 0.5);
}

.zoca-71d1bb35-08cc-4450-98a6-46e34001c4b8 {
  top: 50%;
  left: 50%;
  color: var(--color-staff-card-foreground);
  width: 80%;
  z-index: 1000;
  display: none;
  padding: 2rem;
  max-width: 1100px;
  position: fixed;
  max-height: 85vh;
  transform: translate(-50%, -50%);
  border-radius: 5px;
  background-color: var(--color-staff-modal-background);
}

@media (max-width: 600px) {
  .zoca-71d1bb35-08cc-4450-98a6-46e34001c4b8 {
    top: auto;
  left: 0;
  width: 95%;
  bottom: 0;
  padding: 2rem;
  max-width: 100%;
  transform: none;
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-71d1bb35-08cc-4450-98a6-46e34001c4b8 {
    top: auto !important;
  left: 50%;
  width: 100%;
  bottom: 0 !important;
  padding: 2rem;
  max-width: 100%;
  position: fixed;
  transform: translateX(-50%) !important;
  border-radius: 20px 20px 0 0;
  }
}

.zoca-4f4721ab-dbde-478d-9fa7-be742cb645bc {
  display: flex;
  flex-grow: 1;
  overflow: hidden;
  max-height: 90vh;
  border-radius: 20px;
}

@media (max-width: 600px) {
  .zoca-4f4721ab-dbde-478d-9fa7-be742cb645bc {
    max-height: 85vh;
  border-radius: 20px 20px 0 0;
  flex-direction: column;
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-4f4721ab-dbde-478d-9fa7-be742cb645bc {
    max-height: 85vh;
  border-radius: 20px 20px 0 0;
  flex-direction: column;
  }
}

.zoca-4260f1c8-70c7-4250-a936-9e8d425e1b81 {
  width: 32%;
  display: flex;
  padding: 1rem;
  min-height: 410px;
  align-items: center;
  border-radius: 10px;
  flex-direction: column;
  background-color: var(--color-staff-modal-cards-background);
}

@media (max-width: 600px) {
  .zoca-4260f1c8-70c7-4250-a936-9e8d425e1b81 {
    width: 100%;
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-4260f1c8-70c7-4250-a936-9e8d425e1b81 {
    display: none;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .zoca-4260f1c8-70c7-4250-a936-9e8d425e1b81 {
    min-width: 40%;
  }
}

.zoca-5dd791ea-fdc4-4636-b7e0-cfe199829370 {
  width: 250px;
  height: 250px;
}

.zoca-c6b8a314-422f-4bf5-bbc2-c1661ef9ec28 {
  width: 150px;
  height: 150px;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 20px;
}

@media (max-width: 600px) {
  .zoca-c6b8a314-422f-4bf5-bbc2-c1661ef9ec28 {
    width: 150px;
  height: 150px;
  }
}

.zoca-4dcf10aa-4063-4de9-b1ee-997d30ba261e {
  font-size: 1.3rem;
  margin-top: 10px;
  text-align: center;
  font-weight: bold;
  margin-bottom: 15px;
}

.zoca-3b0f1a31-d529-45e2-bfca-1b200cd94445 {
  font-size: 1.125rem;
  text-align: center;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 30px;
}

.zoca-93083d4a-64f6-419f-85e5-9bd825663bb7 {
  color: var(--color-staff-card-button-foreground);
  width: 80%;
  border: none;
  cursor: pointer;
  padding: 0.75rem;
  font-size: 1rem;
  margin-top: 40px;
  transition: all 0.3s ease;
  border-radius: 50px;
  margin-bottom: 10px;
  background-color: var(--color-staff-card-button-background);
}

.zoca-44c35c2e-f499-4b6c-be65-a84f4e19e2f6 {
  width: 65%;
  padding: 14px;
  overflow-y: auto;
  margin-left: 20px;
  border-radius: 10px;
  margin-bottom: 0;
  background-color: var(--color-staff-modal-cards-background);
}

@media (max-width: 600px) {
  .zoca-44c35c2e-f499-4b6c-be65-a84f4e19e2f6 {
    width: 100%;
  padding: 30px 20px;
  margin-left: 0;
  margin-bottom: 10px;
  scrollbar-width: none;
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-44c35c2e-f499-4b6c-be65-a84f4e19e2f6 {
    width: 100%;
  margin-left: 0;
  }
}

.zoca-59ddffd5-2f93-47a1-95f7-1b17e42b2e1a {
  display: flex;
  align-items: flex-start;
  margin-bottom: 25px;
  justify-content: space-between;
}

.zoca-717dd4db-5a30-4db3-9efd-a6576b9c62e3 {
  flex: 1;
  font-size: 1.5rem;
  margin-top: 0;
  padding-right: 20px;
}

@media (max-width: 600px) {
  .zoca-717dd4db-5a30-4db3-9efd-a6576b9c62e3 {
    font-size: 1.2rem;
  }
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-717dd4db-5a30-4db3-9efd-a6576b9c62e3 {
    font-size: 1.2rem;
  margin-top: 0;
  margin-bottom: 0;
  }
}

.zoca-3ee0d28c-3f57-4f8a-8996-3fb77c1a4837 {
  width: 40px;
  border: none;
  cursor: pointer;
  height: 40px;
  display: flex;
  padding: 0;
  font-size: 2.1rem;
  align-items: center;
  background: none;
  margin-right: 20px;
  border-radius: 50%;
  justify-content: center;
}

.zoca-3ee0d28c-3f57-4f8a-8996-3fb77c1a4837:hover {
  background-color: rgba(0, 0, 0, 0.08);
}

.zoca-a2916bf4-ef74-4cfe-bff3-38bf81c913f7 {
  font-size: 17px;
  word-break: break-word;
  white-space: pre-wrap;
  padding-right: 30px;
}

.zoca-f9f94a13-82d6-48a4-85bd-e9de810572f6 {
  display: block;
  transition: all 0.3s ease;
}

@media (max-width: 600px) {
  .zoca-f9f94a13-82d6-48a4-85bd-e9de810572f6 {
    display: none;
  }
}

.zoca-bb107a9b-2671-4d32-a84a-54d9b4ac6ad2 {
  cursor: pointer;
  display: block;
  font-weight: 500;
  margin-left: 8px;
  transition: opacity 0.3s ease;
}

@media (min-width: 600px) {
  .zoca-bb107a9b-2671-4d32-a84a-54d9b4ac6ad2 {
    display: none;
  }
}

.zoca-01acd59e-80a4-4f3e-8917-abe445bd8d29 {
  display: none;
}

@media (min-width: 375px) and (max-width: 600px) {
  .zoca-01acd59e-80a4-4f3e-8917-abe445bd8d29 {
    color: var(--color-primary-button-foreground);
  width: 90%;
  border: none;
  cursor: pointer;
  display: block;
  padding: 0.75rem;
  font-size: 1.5rem;
  margin-top: 1rem;
  transition: all 0.3s ease;
  border-radius: 50px;
  background-color: var(--color-primary-button-background);
  }
}

.zoca-a03f67cf-756b-4c59-81ab-a9d7c5084cfc {
  display: none;
}

.zoca-854ddb0e-e4a4-428a-bd2d-c809ab273090 {
  display: none;
}

.zoca-8a083971-e438-4f91-b893-e6aebc29ee15 {
  cursor: pointer;
}

.zoca-038a923c-74ab-40c1-b8a3-c954afd2fd9b {
  cursor: pointer;
}

.zoca-16be5a1c-31eb-40c2-a39e-9015027140c0 {
  cursor: pointer;
}

.zoca-190fa1c3-4a8e-49aa-94c4-83d0f1e148e4 {
  cursor: pointer;
}

.zoca-352a5ee4-1d2e-4472-9c9d-76bf38c8d2dd {
  cursor: pointer;
}

.zoca-6ae65f66-b900-42de-9997-69c7cd559713 {
  cursor: pointer;
}

.zoca-41b401c5-7c52-4333-91e7-803d8bb69022 {
  flex: 1;
  color: var(--color-footer-contact-card-foreground);
  border: 1px solid var(--color-black);
  height: 100% !important;
  display: flex;
  align-items: center;
  background-color: var(--color-footer-contact-card-background);
}

@media (max-width: 768Px) {
  .zoca-41b401c5-7c52-4333-91e7-803d8bb69022 {
    min-height: auto;
  }
}

.zoca-05e71d61-e268-4130-83c4-907ab20c0747 {
  width: 100%;
  padding: 30px 25px 30px 25px;
}

@media (max-width: 768Px) {
  .zoca-05e71d61-e268-4130-83c4-907ab20c0747 {
    padding: 24px;
  }
}

.zoca-e30dfa09-343c-4011-90c2-aab2e85b52c7 {
  margin-bottom: 20px;
}

.zoca-a368f721-1b2c-44b8-9eef-d02aba7e6ac1 {
  margin: 0 0 16px 0;
  font-size: 28px;
  font-weight: 600;
}

@media (max-width: 768Px) {
  .zoca-a368f721-1b2c-44b8-9eef-d02aba7e6ac1 {
    font-size: 24px;
  }
}

.zoca-25d1d88f-f5e3-4aa3-9983-45d2816531f5 {
  flex: 1;
  font-size: 16px;
  text-decoration: underline;
}

@media (max-width: 768Px) {
  .zoca-25d1d88f-f5e3-4aa3-9983-45d2816531f5 {
    font-size: 14px;
  }
}

.zoca-6dbfdcab-b069-45c7-ac55-652c21ee3db6 {
  font-size: 16px;
  text-decoration: underline;
}

@media (max-width: 768Px) {
  .zoca-6dbfdcab-b069-45c7-ac55-652c21ee3db6 {
    font-size: 14px;
  }
}

.zoca-fa8c3d8e-c521-4028-babb-3e346780af97 {
  overflow: hidden;
  margin-top: 20px;
}

.zoca-aee15957-a93b-423d-86df-153e1dc749bf {
  border: none;
  display: block;
}

@media (max-width: 768Px) {
  .zoca-aee15957-a93b-423d-86df-153e1dc749bf {
    height: 150px;
  }
}

.zoca-8ceadaef-ee4c-4240-8c24-1eb3268728db {
  margin: 0 0 6px 0;
  font-size: 28px;
  font-weight: 600;
}

@media (max-width: 768Px) {
  .zoca-8ceadaef-ee4c-4240-8c24-1eb3268728db {
    font-size: 24px;
  }
}

.zoca-584e169b-ee80-4f5d-9c72-487842598428 {
  display: flex;
  flex-direction: column;
}

.zoca-be60cc84-f60d-4960-9f04-1803dade3841 {
  display: flex;
  align-items: baseline;
  justify-content: center;
}

.zoca-c3e6d06c-c468-4538-a1d9-7d028bb2e4a5 {
  width: 100%;
}

.zoca-15554317-7e24-4a9e-9abf-06c424e26d40 {
  margin-top: var(--space-4);
}

.zoca-0b42a65a-2385-4834-89d6-5c081a391e87 {
  gap: var(--space-2);
  color: var(--color-gray-500);
  display: flex;
  font-size: var(--text-sm);
  margin-top: var(--space-4);
  align-items: center;
  justify-content: center;
}

.zoca-2a9e073c-739f-4f92-b6c1-3393399ee15e {
  display: none;
}

.zoca-40bf2177-8619-48bc-a88e-4652432ceade {
  width: 100%;
  padding: var(--space-4);
  max-width: 100%;
  box-sizing: border-box;
  margin-top: var(--space-6);
  text-align: center;
}

.zoca-42bb3013-fff1-4b0c-a692-58a9bc4bf7bd {
  color: var(--color-gray-600);
  margin: 0 0 var(--space-3) 0;
  font-size: var(--text-sm);
  font-weight: 500;
}

.zoca-f9fdbf37-d99a-4472-9277-bfb719332731 {
  gap: var(--space-2);
  color: var(--color-white);
  border: none;
  cursor: pointer;
  display: inline-flex;
  padding: var(--space-3) var(--space-4);
  font-size: var(--text-sm);
  min-width: fit-content;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  align-items: center;
  font-weight: bold;
  transition: all 0.2s ease-in-out;
  white-space: nowrap;
  border-radius: var(--radius-md);
  justify-content: center;
  text-decoration: none;
  background-color: var(--color-black);
}

.zoca-f9fdbf37-d99a-4472-9277-bfb719332731:hover {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  transform: translateY(-1px);
  font-weight: bold;
}

.zoca-f9fdbf37-d99a-4472-9277-bfb719332731:active {
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  transform: translateY(0);
}

@media (max-width: 640px) {
  .zoca-f9fdbf37-d99a-4472-9277-bfb719332731 {
    width: 100%;
  padding: var(--space-4) var(--space-3);
  }
}

.zoca-874c51a7-a6ea-40b5-af0b-804fcf5bb26e {
  gap: var(--space-16);
  display: grid;
  align-items: start;
  grid-template-columns: 70% 25%;
}

@media (max-width: 768Px) {
  .zoca-874c51a7-a6ea-40b5-af0b-804fcf5bb26e {
    gap: var(--space-8);
  grid-template-columns: 1fr;
  }
}

.zoca-87efc911-4438-4d28-aa8e-9a080990a02c {
  gap: var(--space-6);
  display: flex;
  flex-direction: column;
}

.zoca-d30d9967-98f2-4e34-b5cc-8bc29332a757 {
  width: 100%;
}

.zoca-7ab4fc05-e348-4537-8c4e-8962b681d8b0 {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.zoca-d2277066-4654-49f8-97a7-300438474610 {
  margin: 0;
  font-size: var(--text-xl);
  font-weight: var(--font-regular);
}

.zoca-88e03ee5-d675-45de-8217-48ebb260ad8e {
  color: var(--color-footer-foreground);
  width: 40px;
  cursor: pointer;
  height: 40px;
  display: flex;
  align-items: center;
  transition: all 0.3s ease;
  border-radius: var(--radius-sm);
  justify-content: center;
  background-color: transparent;
}

.zoca-fbacc4a4-44de-4982-ae70-dd0b34ba7996 {
  transition: transform 0.3s ease;
}

.zoca-aa35dcda-e0ee-4e4b-94f3-42da3c644d75 {
  overflow: hidden;
  margin-top: var(--space-4);
  max-height: 0;
  transition: max-height 0.3s ease;
}

.zoca-180b908e-5fbf-4ef8-87c4-17ba5a1392eb {
  gap: var(--space-4);
  display: flex;
  flex-wrap: wrap;
  padding-top: var(--space-2);
}

.zoca-76384405-95e4-4dd1-ae7a-5db77289c4e8 {
  width: 100%;
  height: 1px;
  background-color: var(--color-footer-foreground);
}

.zoca-74324b2e-a4b8-4883-8051-b9bc15379f07 {
  width: 100%;
}

.zoca-69c7f060-18dc-47d6-9a4f-d3e52e9040c5 {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.zoca-e97974ad-5f0b-420f-afe4-7d61ea602dc5 {
  margin: 0;
  font-size: var(--text-xl);
  font-weight: var(--font-regular);
}

.zoca-ae776c3c-3722-4c26-88e1-baf540c716fb {
  color: var(--color-footer-foreground);
  width: 40px;
  cursor: pointer;
  height: 40px;
  display: flex;
  align-items: center;
  transition: all 0.3s ease;
  border-radius: var(--radius-sm);
  justify-content: center;
  background-color: transparent;
}

.zoca-bdb0c8b8-8fe0-4e2e-bba8-ee7cc4a81e48 {
  transition: transform 0.3s ease;
}

.zoca-d08b15b4-afaa-47bc-986e-5a61d1518e02 {
  overflow: hidden;
  margin-top: var(--space-4);
  max-height: 0;
  transition: max-height 0.3s ease;
}

.zoca-856a4784-21ed-44a9-a4e5-f9ce07b8e984 {
  gap: var(--space-4);
  display: flex;
  flex-wrap: wrap;
  padding-top: var(--space-2);
}

.zoca-9722e25c-2940-4926-a13a-cd1529fb0a14 {
  width: 100%;
  height: 1px;
  background-color: var(--color-footer-foreground);
}

.zoca-88fecebc-862c-4e71-8eb4-1c2a2225d437 {
  gap: var(--space-3);
  display: flex;
  flex-direction: column;
}

.zoca-eaa6bd9c-b043-4766-bb1f-3e4d1f13bd13 {
  margin: 0;
  font-size: var(--text-xl);
  font-weight: var(--font-regular);
}

.zoca-f774db30-b53d-4d6a-9283-2bdac251585a {
  gap: 6px;
  display: flex;
  margin-top: 30px;
  padding-top: 20px;
  flex-direction: column;
}

@media (max-width: 768Px) {
  .zoca-f774db30-b53d-4d6a-9283-2bdac251585a {
    margin-block: 30px;
  }
}

.zoca-ee2f54c4-3fc9-4207-8984-25b518a3affe {
  order: 3;
  margin-bottom: 2rem;
}

.zoca-56ee784e-9b12-4940-9aba-63d0161aa3c4 {
  margin: 0;
  font-size: var(--text-base);
}

@media (max-width: 768Px) {
  .zoca-56ee784e-9b12-4940-9aba-63d0161aa3c4 {
    font-size: var(--text-sm);
  }
}

.zoca-068547b5-8ed0-465b-a0ec-e4a198d41f19 {
  gap: 6px;
  order: 1;
  display: flex;
  align-items: center;
  margin-bottom: 1.75rem;
}

.zoca-c712d749-6b0b-47af-80a7-f0b3ed148e17 {
  font-size: var(--text-base);
  transition: color 0.3s ease;
  text-decoration: underline;
  text-underline-offset: 2px;
}

@media (max-width: 768Px) {
  .zoca-c712d749-6b0b-47af-80a7-f0b3ed148e17 {
    font-size: var(--text-sm);
  }
}

.zoca-399005f2-6472-48af-aae3-1d279d5320a6 {
  font-size: var(--text-base);
}

.zoca-0a2753ae-1ae2-4d76-9e4c-9604f3477544 {
  font-size: var(--text-base);
  transition: color 0.3s ease;
  text-decoration: underline;
  text-underline-offset: 2px;
}

@media (max-width: 768Px) {
  .zoca-0a2753ae-1ae2-4d76-9e4c-9604f3477544 {
    font-size: var(--text-sm);
  }
}