#fw-section-hero-0 {
--color-primary: #ffffff;
--color-primary-rgb: 255, 255, 255;
--color-background: #ffffff;
--color-background-rgb: 255, 255, 255;
--color-on-background: #ffffff;
--color-on-background-rgb: 255, 255, 255;
--color-on-primary: #000000;
--color-on-primary-rgb: 0, 0, 0;
--color-product-image-background: #ffffff;
--color-background-brightness: 255;
background-color: var(--color-background);
color: var(--color-on-background);
--primary-btn-bg: #ffffff;
--primary-btn-text: #000000;
--primary-btn-border-color: #ffffff;
--secondary-btn-bg: transparent;
--secondary-btn-text: #ffffff;
--secondary-btn-border-color: #ffffff;
/* Only triggers on screens smaller than 768px (standard mobile) */
@media only screen and (max-width: 767px) {
    /* Use 'a' to target the actual button link if it’s wrapped */
    .button, 
    a.button, 
    [class*="button"] a {
        /* 1. Control the maximum width */
        max-width: 160px !important; /* Forces it to stop growing */
        
        /* 2. Center it perfectly */
        display: flex !important;    /* Modern centering alignment */
        margin-left: auto !important;
        margin-right: auto !important;
        
        /* 3. Refine the shape (less "chunky") */
        padding: 10px 20px !important; /* Adjust these: (top/bottom) (left/right) */
        font-size: 12px !important;    /* Keeps text clear but professional */
        min-height: auto !important;   /* Let padding determine height */
        
        /* 4. Optional: add a tiny bit of breathing room above/below */
        margin-top: 1px !important;
        margin-bottom: 15px !important;
    }
}
}


#fw-section-image-with-text-a9afcbc6-c6d6-4bce-a9d8-d434277e1208 {

/* Only triggers on screens smaller than 768px (standard mobile) */
@media only screen and (max-width: 767px) {
    /* Use 'a' to target the actual button link if it’s wrapped */
    .button, 
    a.button, 
    [class*="button"] a {
        /* 1. Control the maximum width */
        max-width: 200px !important; /* Forces it to stop growing */
        
        /* 2. Center it perfectly */
        display: flex !important;    /* Modern centering alignment */
        margin-left: auto !important;
        margin-right: auto !important;
        
        /* 3. Refine the shape (less "chunky") */
        padding: 15px 20px !important; /* Adjust these: (top/bottom) (left/right) */
        font-size: 16px !important;    /* Keeps text clear but professional */
        min-height: auto !important;   /* Let padding determine height */
        
        /* 4. Optional: add a tiny bit of breathing room above/below */
        margin-top: 1px !important;
        margin-bottom: 15px !important;
    }
}
}





#fw-section-text-carousel-108a8e22-b12a-4aff-9b9d-38b89f6cd5a0 {
--color-primary: #f7f7f7;
--color-primary-rgb: 247, 247, 247;
--color-background: #f7f7f7;
--color-background-rgb: 247, 247, 247;
--color-on-background: #161616;
--color-on-background-rgb: 22, 22, 22;
--color-on-primary: #161616;
--color-on-primary-rgb: 22, 22, 22;
--color-product-image-background: #161616;
--color-background-brightness: 247;
background-color: var(--color-background);
color: var(--color-on-background);
--primary-btn-bg: #f7f7f7;
--primary-btn-text: #161616;
--primary-btn-border-color: #161616;
--secondary-btn-bg: transparent;
--secondary-btn-text: #161616;
--secondary-btn-border-color: #161616;

}