@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --secondary-bg: #f9f5f8;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

/* Pink Utility Classes */
.text-pink {
    color: var(--primary-color) !important;
}

.btn-pink {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: #fff !important;
}

.btn-pink:hover {
    opacity: 0.9;
    color: #fff !important;
}

body {
    color: var(--text-color);
    padding-top: 140px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Breadcrumbs */
.breadcrumb {
    background: transparent;
    padding: 0;
    margin-bottom: 30px;
    font-size: 14px;
}

.breadcrumb-item a {
    color: var(--text-color);
    text-decoration: none;
}

.breadcrumb-item a:hover {
    text-decoration: underline;
}

.breadcrumb-item.active {
    color: #666;
}

/* Page Layouts */
.hero-section {
    background-color: var(--secondary-bg);
    padding: 80px 0;
    text-align: center;
    border-radius: 12px;
    margin-bottom: 60px;
}

.hero-section h1 {
    font-size: 48px;
    margin-bottom: 20px;
    color: var(--text-color);
}

.hero-section p {
    font-size: 18px;
    max-width: 700px;
    margin: 0 auto;
    color: #555;
    line-height: 1.6;
}

.section-title {
    text-align: center;
    font-size: 36px;
    margin-bottom: 40px;
}

.info-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 12px;
    padding: 40px;
    height: 100%;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
    transition: transform 0.3s ease;
}

.info-card:hover {
    transform: translateY(-5px);
}

.info-card h3 {
    font-size: 28px;
    margin-bottom: 20px;
    color: var(--primary-color);
}

.info-card p {
    font-size: 16px;
    line-height: 1.7;
    color: #555;
}

.impact-section {
    background-color: var(--text-color);
    color: #fff;
    padding: 80px 0;
    margin: 60px 0;
}

.impact-section h2 {
    color: #fff;
    margin-bottom: 20px;
    font-size: 36px;
}

.impact-section h3 {
    color: var(--primary-color);
    font-size: 24px;
    margin-bottom: 30px;
}

.impact-list {
    list-style: none;
    padding: 0;
}

.impact-list li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 25px;
    font-size: 16px;
    line-height: 1.6;
}

.impact-list li i {
    position: absolute;
    left: 0;
    top: 5px;
    color: var(--primary-color);
    font-size: 18px;
}

.founders-section {
    padding: 60px 0;
}

.founder-box {
    background: var(--secondary-bg);
    border-radius: 12px;
    padding: 40px;
    margin-bottom: 30px;
}

.founder-box h4 {
    font-size: 24px;
    margin-bottom: 15px;
    color: var(--text-color);
}

.founder-box p {
    font-size: 16px;
    color: #555;
    line-height: 1.7;
    margin: 0;
}

/* Footer */
.footer {
    background-color: #000000;
    color: #fff;
    padding: 60px 0 20px;
    margin-top: 60px;
}

.footer h4 {
    font-size: 18px;
    margin-bottom: 20px;
    font-family: var(--bs-body-font-family);
}

.footer a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

.social-icons a {
    display: inline-block;
    margin-right: 15px;
    font-size: 20px;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 20px;
    margin-top: 40px;
    font-size: 13px;
    opacity: 0.8;
    text-align: center;
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --secondary-bg: #f9f5f8;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

body {
    color: var(--text-color);
    padding-top: 140px;
    font-family: var(--bs-body-font-family);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Footer */
.footer {
    background-color: #000000;
    color: #fff;
    padding: 60px 0 20px;
    margin-top: 60px;
}

.footer h4 {
    font-size: 18px;
    margin-bottom: 20px;
    font-family: var(--bs-body-font-family);
}

.footer a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

.social-icons a {
    display: inline-block;
    margin-right: 15px;
    font-size: 20px;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 20px;
    margin-top: 40px;
    font-size: 13px;
    opacity: 0.8;
    text-align: center;
}

.auth-container {
    max-width: 900px;
    margin: 0 auto;
}

.auth-box {
    background: #fff;
    padding: 40px;
    border-radius: 12px;
    border: 1px solid #eee;
    height: 100%;
}

.auth-box h2 {
    font-size: 32px;
    margin-bottom: 20px;
    color: var(--primary-color);
}

.auth-box p {
    color: #666;
    margin-bottom: 30px;
}

.form-control {
    padding: 12px 15px;
    border-radius: 6px;
    margin-bottom: 20px;
}

.form-control:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 0.25rem rgba(166, 117, 164, 0.25);
}

.btn-custom {
    background-color: var(--primary-color);
    color: white;
    padding: 12px 30px;
    border: none;
    border-radius: 6px;
    font-weight: bold;
    transition: all 0.3s;
    width: 100%;
}

.btn-custom:hover {
    background-color: var(--primary-color-hover);
    color: white;
}

.divider {
    position: relative;
    text-align: center;
    margin: 30px 0;
}

.divider::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #eee;
    z-index: 1;
}

.divider span {
    position: relative;
    background: #fff;
    padding: 0 15px;
    color: #999;
    z-index: 2;
    font-size: 14px;
}

.forgot-password {
    font-size: 14px;
    color: var(--primary-color);
    text-decoration: none;
    display: inline-block;
    margin-bottom: 20px;
}

.forgot-password:hover {
    text-decoration: underline;
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

body {
    color: var(--text-color);
    padding-top: 140px;
    /* Accounts for sticky header */
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

main {
    flex: 1;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Footer */
.footer {
    background-color: var(--primary-color);
    color: #fff;
    padding: 60px 0 20px;
}

.footer-logo {
    max-width: 150px;
    margin-bottom: 20px;
}

.footer h4 {
    color: #fff;
    font-size: 18px;
    margin-bottom: 20px;
    font-family: 'Quicksand', sans-serif;
}

.footer ul {
    list-style: none;
    padding: 0;
}

.footer ul li {
    margin-bottom: 10px;
}

.footer ul li a {
    color: #ccc;
    text-decoration: none;
    transition: color 0.3s;
}

.footer ul li a:hover {
    color: #fff;
}

.newsletter-form .input-group {
    margin-bottom: 15px;
}

.newsletter-form input {
    border-radius: 0;
    border: 1px solid #555;
    background: #333;
    color: #fff;
}

.newsletter-form button {
    border-radius: 0;
    background-color: var(--primary-color);
    border: none;
    color: white;
    padding: 10px 20px;
}

.footer-bottom {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid #444;
    text-align: center;
    font-size: 14px;
    color: #aaa;
}

/* Cart Specific */
.cart-section {
    padding: 60px 0;
}

/* ======================= */

/* Typography (heading) */
@font-face {
    font-family: Fraunces;
    font-weight: 600;
    font-style: normal;
    font-display: swap;
    src: url("//www.cambiowoman.com/cdn/fonts/fraunces/fraunces_n6.69791a9f00600e5a1e56a6f64efc9d10a28b9c92.woff2") format("woff2"),
        url("//www.cambiowoman.com/cdn/fonts/fraunces/fraunces_n6.e87d336d46d99db17df56f1dc77d222effffa1f3.woff") format("woff");
}

@font-face {
    font-family: Fraunces;
    font-weight: 600;
    font-style: italic;
    font-display: swap;
    src: url("//www.cambiowoman.com/cdn/fonts/fraunces/fraunces_i6.8862d206518ce141218adf4eaf0e5d478cbd024a.woff2") format("woff2"),
        url("//www.cambiowoman.com/cdn/fonts/fraunces/fraunces_i6.9bfc22b5389643d688185c0e419e96528513fc60.woff") format("woff");
}

/* Typography (body) */
@font-face {
    font-family: Figtree;
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: url("//www.cambiowoman.com/cdn/fonts/figtree/figtree_n4.3c0838aba1701047e60be6a99a1b0a40ce9b8419.woff2") format("woff2"),
        url("//www.cambiowoman.com/cdn/fonts/figtree/figtree_n4.c0575d1db21fc3821f17fd6617d3dee552312137.woff") format("woff");
}

@font-face {
    font-family: Figtree;
    font-weight: 400;
    font-style: italic;
    font-display: swap;
    src: url("//www.cambiowoman.com/cdn/fonts/figtree/figtree_i4.89f7a4275c064845c304a4cf8a4a586060656db2.woff2") format("woff2"),
        url("//www.cambiowoman.com/cdn/fonts/figtree/figtree_i4.6f955aaaafc55a22ffc1f32ecf3756859a5ad3e2.woff") format("woff");
}

@font-face {
    font-family: Figtree;
    font-weight: 600;
    font-style: normal;
    font-display: swap;
    src: url("//www.cambiowoman.com/cdn/fonts/figtree/figtree_n6.9d1ea52bb49a0a86cfd1b0383d00f83d3fcc14de.woff2") format("woff2"),
        url("//www.cambiowoman.com/cdn/fonts/figtree/figtree_n6.f0fcdea525a0e47b2ae4ab645832a8e8a96d31d3.woff") format("woff");
}

@font-face {
    font-family: Figtree;
    font-weight: 600;
    font-style: italic;
    font-display: swap;
    src: url("//www.cambiowoman.com/cdn/fonts/figtree/figtree_i6.702baae75738b446cfbed6ac0d60cab7b21e61ba.woff2") format("woff2"),
        url("//www.cambiowoman.com/cdn/fonts/figtree/figtree_i6.6b8dc40d16c9905d29525156e284509f871ce8f9.woff") format("woff");
}

:root {
    --heading-color: 26, 26, 26;
    --text-color: 26, 26, 26;
    --background: 255, 255, 255;
    --secondary-background: 243, 236, 242;
    --border-color: 221, 221, 221;
    --border-color-darker: 163, 163, 163;
    --success-color: 46, 158, 123;
    --success-background: 213, 236, 229;
    --error-color: 222, 42, 42;
    --error-background: 253, 240, 240;
    --primary-button-background: 166, 117, 164;
    --primary-button-text-color: 255, 255, 255;
    --secondary-button-background: 247, 174, 166;
    --secondary-button-text-color: 166, 117, 164;
    --product-star-rating: 246, 164, 41;
    --product-on-sale-accent: 166, 117, 164;
    --product-sold-out-accent: 111, 113, 155;
    --product-custom-label-background: 64, 93, 230;
    --product-custom-label-text-color: 255, 255, 255;
    --product-custom-label-2-background: 243, 236, 242;
    --product-custom-label-2-text-color: 0, 0, 0;
    --product-low-stock-text-color: 222, 42, 42;
    --product-in-stock-text-color: 46, 158, 123;
    --loading-bar-background: 26, 26, 26;

    /* We duplicate some "base" colors as root colors, which is useful to use on drawer elements or popover without. Those should not be overridden to avoid issues */
    --root-heading-color: 26, 26, 26;
    --root-text-color: 26, 26, 26;
    --root-background: 255, 255, 255;
    --root-border-color: 221, 221, 221;
    --root-primary-button-background: 166, 117, 164;
    --root-primary-button-text-color: 255, 255, 255;

    --base-font-size: 15px;
    --heading-font-family: Fraunces, serif;
    --heading-font-weight: 600;
    --heading-font-style: normal;
    --heading-text-transform: normal;
    --text-font-family: Figtree, sans-serif;
    --text-font-weight: 400;
    --text-font-style: normal;
    --text-font-bold-weight: 600;

    /* Typography (font size) */
    --heading-xxsmall-font-size: 11px;
    --heading-xsmall-font-size: 11px;
    --heading-small-font-size: 12px;
    --heading-large-font-size: 36px;
    --heading-h1-font-size: 36px;
    --heading-h2-font-size: 30px;
    --heading-h3-font-size: 26px;
    --heading-h4-font-size: 24px;
    --heading-h5-font-size: 20px;
    --heading-h6-font-size: 16px;

    /* Control the look and feel of the theme by changing radius of various elements */
    --button-border-radius: 4px;
    --block-border-radius: 8px;
    --block-border-radius-reduced: 4px;
    --color-swatch-border-radius: 0px;

    /* Button size */
    --button-height: 48px;
    --button-small-height: 40px;

    /* Form related */
    --form-input-field-height: 48px;
    --form-input-gap: 16px;
    --form-submit-margin: 24px;

    /* Product listing related variables */
    --product-list-block-spacing: 32px;

    /* Video related */
    --play-button-background: 255, 255, 255;
    --play-button-arrow: 26, 26, 26;

    /* RTL support */
    --transform-logical-flip: 1;
    --transform-origin-start: left;
    --transform-origin-end: right;

    /* Other */
    --zoom-cursor-svg-url: url(//www.cambiowoman.com/cdn/shop/t/25/assets/zoom-cursor.svg?v=1201279167966953441742538871);
    --arrow-right-svg-url: url(//www.cambiowoman.com/cdn/shop/t/25/assets/arrow-right.svg?v=88946934944805437251742538871);
    --arrow-left-svg-url: url(//www.cambiowoman.com/cdn/shop/t/25/assets/arrow-left.svg?v=112457598847827652331742538871);

    /* Some useful variables that we can reuse in our CSS. Some explanation are needed for some of them:
       - container-max-width-minus-gutters: represents the container max width without the edge gutters
       - container-outer-width: considering the screen width, represent all the space outside the container
       - container-outer-margin: same as container-outer-width but get set to 0 inside a container
       - container-inner-width: the effective space inside the container (minus gutters)
       - grid-column-width: represents the width of a single column of the grid
       - vertical-breather: this is a variable that defines the global "spacing" between sections, and inside the section
                            to create some "breath" and minimum spacing
     */
    --container-max-width: 1600px;
    --container-gutter: 24px;
    --container-max-width-minus-gutters: calc(var(--container-max-width) - (var(--container-gutter)) * 2);
    --container-outer-width: max(calc((100vw - var(--container-max-width-minus-gutters)) / 2), var(--container-gutter));
    --container-outer-margin: var(--container-outer-width);
    --container-inner-width: calc(100vw - var(--container-outer-width) * 2);

    --grid-column-count: 10;
    --grid-gap: 24px;
    --grid-column-width: calc((100vw - var(--container-outer-width) * 2 - var(--grid-gap) * (var(--grid-column-count) - 1)) / var(--grid-column-count));

    --vertical-breather: 28px;
    --vertical-breather-tight: 28px;

    /* Shopify related variables */
    --payment-terms-background-color: #ffffff;
}

@media screen and (min-width: 741px) {
    :root {
        --container-gutter: 40px;
        --grid-column-count: 20;
        --vertical-breather: 40px;
        --vertical-breather-tight: 40px;

        /* Typography (font size) */
        --heading-xsmall-font-size: 12px;
        --heading-small-font-size: 13px;
        --heading-large-font-size: 52px;
        --heading-h1-font-size: 48px;
        --heading-h2-font-size: 38px;
        --heading-h3-font-size: 32px;
        --heading-h4-font-size: 24px;
        --heading-h5-font-size: 20px;
        --heading-h6-font-size: 18px;

        /* Form related */
        --form-input-field-height: 52px;
        --form-submit-margin: 32px;

        /* Button size */
        --button-height: 52px;
        --button-small-height: 44px;
    }
}

@media screen and (min-width: 1200px) {
    :root {
        --vertical-breather: 48px;
        --vertical-breather-tight: 48px;
        --product-list-block-spacing: 48px;

        /* Typography */
        --heading-large-font-size: 64px;
        --heading-h1-font-size: 56px;
        --heading-h2-font-size: 48px;
        --heading-h3-font-size: 36px;
        --heading-h4-font-size: 30px;
        --heading-h5-font-size: 24px;
        --heading-h6-font-size: 18px;
    }
}

@media screen and (min-width: 1600px) {
    :root {
        --vertical-breather: 48px;
        --vertical-breather-tight: 48px;
    }
}

/* ======================= */

.jdgm-xx {
    left: 0
}

:root {
    --jdgm-primary-color: #A675A4;
    --jdgm-secondary-color: rgba(166, 117, 164, 0.1);
    --jdgm-star-color: #A675A4;
    --jdgm-write-review-text-color: white;
    --jdgm-write-review-bg-color: #A675A4;
    --jdgm-paginate-color: #A675A4;
    --jdgm-border-radius: 0;
    --jdgm-reviewer-name-color: #A675A4
}

.jdgm-histogram__bar-content {
    background-color: #A675A4
}

.jdgm-rev[data-verified-buyer=true] .jdgm-rev__icon.jdgm-rev__icon:after,
.jdgm-rev__buyer-badge.jdgm-rev__buyer-badge {
    color: white;
    background-color: #A675A4
}

.jdgm-review-widget--small .jdgm-gallery.jdgm-gallery .jdgm-gallery__thumbnail-link:nth-child(8) .jdgm-gallery__thumbnail-wrapper.jdgm-gallery__thumbnail-wrapper:before {
    content: "See more"
}

@media only screen and (min-width: 768px) {
    .jdgm-gallery.jdgm-gallery .jdgm-gallery__thumbnail-link:nth-child(8) .jdgm-gallery__thumbnail-wrapper.jdgm-gallery__thumbnail-wrapper:before {
        content: "See more"
    }
}

.jdgm-preview-badge .jdgm-star.jdgm-star {
    color: #A675A4
}

.jdgm-author-all-initials {
    display: none !important
}

.jdgm-author-last-initial {
    display: none !important
}

.jdgm-rev-widg__title {
    visibility: hidden
}

.jdgm-rev-widg__summary-text {
    visibility: hidden
}

.jdgm-prev-badge__text {
    visibility: hidden
}

.jdgm-rev__prod-link-prefix:before {
    content: 'about'
}

.jdgm-rev__variant-label:before {
    content: 'Variant: '
}

.jdgm-rev__out-of-store-text:before {
    content: '(out of store)'
}

@media only screen and (min-width: 768px) {

    .jdgm-rev__pics .jdgm-rev_all-rev-page-picture-separator,
    .jdgm-rev__pics .jdgm-rev__product-picture {
        display: none
    }
}

@media only screen and (max-width: 768px) {

    .jdgm-rev__pics .jdgm-rev_all-rev-page-picture-separator,
    .jdgm-rev__pics .jdgm-rev__product-picture {
        display: none
    }
}

.jdgm-preview-badge[data-template="product"] {
    display: none !important
}

.jdgm-preview-badge[data-template="collection"] {
    display: none !important
}

.jdgm-preview-badge[data-template="index"] {
    display: none !important
}

.jdgm-review-widget[data-from-snippet="true"] {
    display: none !important
}

.jdgm-verified-count-badget[data-from-snippet="true"] {
    display: none !important
}

.jdgm-carousel-wrapper[data-from-snippet="true"] {
    display: none !important
}

.jdgm-all-reviews-text[data-from-snippet="true"] {
    display: none !important
}

.jdgm-medals-section[data-from-snippet="true"] {
    display: none !important
}

.jdgm-ugc-media-wrapper[data-from-snippet="true"] {
    display: none !important
}

.jdgm-rev__transparency-badge[data-badge-type="review_collected_via_store_invitation"] {
    display: none !important
}

.jdgm-rev__transparency-badge[data-badge-type="review_collected_from_another_provider"] {
    display: none !important
}

.jdgm-rev__transparency-badge[data-badge-type="review_collected_from_store_visitor"] {
    display: none !important
}

.jdgm-rev__transparency-badge[data-badge-type="review_written_in_etsy"] {
    display: none !important
}

.jdgm-rev__transparency-badge[data-badge-type="review_written_in_google_business"] {
    display: none !important
}

.jdgm-rev__transparency-badge[data-badge-type="review_written_in_shop_app"] {
    display: none !important
}

.jdgm-rev__transparency-badge[data-badge-type="review_earned_for_future_purchase"] {
    display: none !important
}

.jdgm-review-snippet-widget .jdgm-rev-snippet-widget__cards-container .jdgm-rev-snippet-card {
    border-radius: 8px;
    background: #fff
}

.jdgm-review-snippet-widget .jdgm-rev-snippet-widget__cards-container .jdgm-rev-snippet-card__rev-rating .jdgm-star {
    color: #108474
}

.jdgm-review-snippet-widget .jdgm-rev-snippet-widget__prev-btn,
.jdgm-review-snippet-widget .jdgm-rev-snippet-widget__next-btn {
    border-radius: 50%;
    background: #fff
}

.jdgm-review-snippet-widget .jdgm-rev-snippet-widget__prev-btn>svg,
.jdgm-review-snippet-widget .jdgm-rev-snippet-widget__next-btn>svg {
    fill: #000
}

.jdgm-full-rev-modal.rev-snippet-widget .jm-mfp-container .jm-mfp-content,
.jdgm-full-rev-modal.rev-snippet-widget .jm-mfp-container .jdgm-full-rev__icon,
.jdgm-full-rev-modal.rev-snippet-widget .jm-mfp-container .jdgm-full-rev__pic-img,
.jdgm-full-rev-modal.rev-snippet-widget .jm-mfp-container .jdgm-full-rev__reply {
    border-radius: 8px
}

.jdgm-full-rev-modal.rev-snippet-widget .jm-mfp-container .jdgm-full-rev[data-verified-buyer="true"] .jdgm-full-rev__icon::after {
    border-radius: 8px
}

.jdgm-full-rev-modal.rev-snippet-widget .jm-mfp-container .jdgm-full-rev .jdgm-rev__buyer-badge {
    border-radius: calc(8px / 2)
}

.jdgm-full-rev-modal.rev-snippet-widget .jm-mfp-container .jdgm-full-rev .jdgm-full-rev__replier::before {
    content: 'Cambio'
}

.jdgm-full-rev-modal.rev-snippet-widget .jm-mfp-container .jdgm-full-rev .jdgm-full-rev__product-button {
    border-radius: calc(8px * 6)
}

/* ======================= */



/* ======================= */

@-webkit-keyframes jdgm-spin {
    0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    100% {
        -webkit-transform: rotate(359deg);
        -ms-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

@keyframes jdgm-spin {
    0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    100% {
        -webkit-transform: rotate(359deg);
        -ms-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

@font-face {
    font-family: 'JudgemeStar';
    src: url("data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAAAScAA0AAAAABrAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAEgAAAABoAAAAcbyQ+3kdERUYAAARgAAAAHgAAACAAMwAGT1MvMgAAAZgAAABGAAAAVi+vS9xjbWFwAAAB8AAAAEAAAAFKwBMjvmdhc3AAAARYAAAACAAAAAj//wADZ2x5ZgAAAkAAAAEJAAABdH33LXtoZWFkAAABMAAAAC0AAAA2BroQKWhoZWEAAAFgAAAAHAAAACQD5QHQaG10eAAAAeAAAAAPAAAAFAYAAABsb2NhAAACMAAAAA4AAAAOAO4AeG1heHAAAAF8AAAAHAAAACAASgAvbmFtZQAAA0wAAADeAAABkorWfVZwb3N0AAAELAAAACkAAABEp3ubLXgBY2BkYADhPPP4OfH8Nl8ZuJkYQODS2fRrCPr/aSYGxq1ALgcDWBoAO60LkwAAAHgBY2BkYGDc+v80gx4TAwgASaAICmABAFB+Arl4AWNgZGBgYGPQYWBiAAIwyQgWc2AAAwAHVQB6eAFjYGRiYJzAwMrAwejDmMbAwOAOpb8ySDK0MDAwMbByMsCBAAMCBKS5pjA4PGB4wMR44P8BBj3GrQymQGFGkBwAjtgK/gAAeAFjYoAAEA1jAwAAZAAHAHgB3crBCcAwDEPRZydkih567CDdf4ZskmLwFBV8xBfCaC4BXkOUmx4sU0h2ngNb9V0vQCxaRKIAevT7fGWuBrEAAAAAAAAAAAA0AHgAugAAeAF9z79Kw1AUx/FzTm7un6QmJtwmQ5Bg1abgEGr/BAqlU6Gju+Cgg1MkQ/sA7Vj7BOnmO/gUvo2Lo14NqIO6/IazfD8HEODtmQCfoANwNsyp2/GJt3WKQrd1NLiYYWx2PBqOsmJMEOznPOTzfSCrhAtbbLdmeFLJV9eKd63WLrZcIcuaEVdssWCKM6pLCfTVOYbz/0pNSMSZKLIZpvh78sAUH6PlMrreTCabP9r+Z/puPZ2ur/RqpQHgh+MIegCnXeM4MRAPjYN//5tj4ZtTjkFqEdmeMShlEJ7tVAly2TAkx6R68Fl4E/aVvn8JqHFQ4JS1434gXKcuL31dDhzs3YbsEOAd/IU88gAAAHgBfY4xTgMxEEVfkk0AgRCioKFxQYd2ZRtpixxgRU2RfhU5q5VWseQ4JdfgAJyBlmNwAM7ABRhZQ0ORwp7nr+eZAa54YwYg9zm3ynPOeFRe8MCrciXOh/KSS76UV5L/iDmrLiS5AeU519wrL3jmSbkS5115yR2fyivJv9kx0ZMZ2RLZw27q87iNQi8EBo5FSPIMw3HqBboi5lKTGAGDp8FKXWP+t9TU01Lj5His1Ba6uM9dTEMwvrFmbf5GC/q2drW3ruXUhhsCiQOjznFlCzYhHUZp4xp76vsvQh89CQAAeAFjYGJABowM6IANLMrEyMTIzMjCXpyRWJBqZshWXJJYBKOMAFHFBucAAAAAAAAB//8AAngBY2BkYGDgA2IJBhBgAvKZGViBJAuYxwAABJsAOgAAeAFjYGBgZACCk535hiD60tn0azAaAEqpB6wAAA==") format("woff");
    font-weight: normal;
    font-style: normal
}

.jdgm-star {
    font-family: 'JudgemeStar';
    display: inline !important;
    text-decoration: none !important;
    padding: 0 4px 0 0 !important;
    margin: 0 !important;
    font-weight: bold;
    opacity: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.jdgm-star:hover {
    opacity: 1
}

.jdgm-star:last-of-type {
    padding: 0 !important
}

.jdgm-star.jdgm--on:before {
    content: "\e000"
}

.jdgm-star.jdgm--off:before {
    content: "\e001"
}

.jdgm-star.jdgm--half:before {
    content: "\e002"
}

.jdgm-widget * {
    margin: 0;
    line-height: 1.4;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-overflow-scrolling: touch
}

.jdgm-hidden {
    display: none !important;
    visibility: hidden !important
}

.jdgm-temp-hidden {
    display: none
}

.jdgm-spinner {
    width: 40px;
    height: 40px;
    margin: auto;
    border-radius: 50%;
    border-top: 2px solid #eee;
    border-right: 2px solid #eee;
    border-bottom: 2px solid #eee;
    border-left: 2px solid #ccc;
    -webkit-animation: jdgm-spin 0.8s infinite linear;
    animation: jdgm-spin 0.8s infinite linear
}

.jdgm-prev-badge {
    display: block !important
}

/* ======================= */

:root {
    --enable-sticky-announcement-bar: 1;
}

#shopify-section-announcement-bar {
    --heading-color: 255, 255, 255;
    --text-color: 255, 255, 255;
    --primary-button-background: 40, 40, 40;
    --primary-button-text-color: 255, 255, 255;
    --section-background: 166, 117, 164;
    z-index: 5;
    /* Make sure it goes over header */
    position: -webkit-sticky;
    position: sticky;
    top: 0;
}

@media screen and (min-width: 741px) {
    :root {
        --enable-sticky-announcement-bar: 1;
    }

    #shopify-section-announcement-bar {
        position: -webkit-sticky;
        position: sticky;
    }
}

/* ======================= */

[aria-controls="newsletter-popup"] {
    display: none;
    /* Allows to hide the toggle icon in the header if the section is disabled */
}

/* ======================= */

:root {
    --enable-sticky-header: 1;
    --enable-transparent-header: 0;
    --loading-bar-background: 26, 26, 26;
    /* Prevent the loading bar to be invisible */
}

#shopify-section-header {
    --header-background: 255, 255, 255;
    --header-text-color: 26, 26, 26;
    --header-border-color: 221, 221, 221;
    --reduce-header-padding: 0;
    position: -webkit-sticky;
    position: sticky;
    top: calc(var(--enable-sticky-announcement-bar) * var(--announcement-bar-height, 0px));
    z-index: 4;
}

#shopify-section-header .header__logo-image {
    max-width: 100px;
}

@media screen and (min-width: 741px) {
    #shopify-section-header .header__logo-image {
        max-width: 120px;
    }
}

@media screen and (min-width: 1200px) {

    /* For this navigation we have to move the logo and make sure the navigation takes the whole width */
    .header__logo {
        order: -1;
        flex: 1 1 0;
    }

    .header__inline-navigation {
        flex: 1 1 auto;
        justify-content: center;
        max-width: max-content;
        margin-inline: 48px;
    }
}

/* ======================= */

@media screen and (min-width: 999px) {
    #shopify-section-template--18356168491157__cart-recommendations {
        --section-products-per-row: 4;
    }
}

/* ======================= */

#shopify-section-footer .footer {
    --background: 166, 117, 164;
    --heading-color: 255, 255, 255;
    --text-color: 255, 255, 255;
    --border-color: 179, 138, 178;
}

/* ======================= */

.baDropdownStyle .bacurr-dropdownChoices {
    display: none;
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Footer */
.footer {
    background-color: #000000;
    color: #fff;
    padding: 60px 0 20px;
}

.footer h4 {
    font-size: 18px;
    margin-bottom: 20px;
    font-family: var(--bs-body-font-family);
}

.footer a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

.social-icons a {
    display: inline-block;
    margin-right: 15px;
    font-size: 20px;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 20px;
    margin-top: 40px;
    font-size: 13px;
    opacity: 0.8;
    text-align: center;
}

/* Specific checkout CSS */
body {
    font-family: var(--bs-body-font-family);
    color: #333;
    padding-top: 140px;
}

.checkout-left {
    padding: 40px;
    border-right: 1px solid #e1e1e1;
}

.checkout-right {
    background: #fafafa;
    border-left: 1px solid #e1e1e1;
    padding: 40px;
}

.logo-img {
    max-width: 150px;
    margin-bottom: 20px;
}

.checkout-title {
    font-size: 1.15rem;
    font-weight: 500;
    margin-bottom: 1rem;
    margin-top: 2.5rem;
}

.item-thumbnail {
    position: relative;
    width: 64px;
    height: 64px;
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: #fff;
}

.item-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 7px;
}

.item-thumbnail .badge {
    position: absolute;
    top: -8px;
    right: -8px;
    background: rgba(114, 114, 114, 0.9);
    border-radius: 50%;
    width: 22px;
    height: 22px;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.summary-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
    color: #535353;
}

.summary-total {
    font-weight: 500;
    color: #333;
    margin-top: 20px;
    border-top: 1px solid #e1e1e1;
    padding-top: 20px;
}

.btn-primary {
    background: #e83e8c;
    border-color: #e83e8c;
    transition: all 0.2sease;
}

.btn-primary:hover {
    background: #e83e8c;
    border-color: #e83e8c;
}

.form-floating>label {
    color: #737373;
}

.form-control:focus,
.form-select:focus {
    border-color: #e83e8c;
    box-shadow: 0 0 0 0.25rem rgba(166, 117, 164, 0.25);
}

@media (max-width: 991px) {
    .checkout-left {
        border-right: none;
        padding-bottom: 20px;
    }

    .checkout-right {
        border-left: none;
        border-top: 1px solid #e1e1e1;
    }

    /* Change layout order for mobile: Order summary first */
    .row.min-vh-100 {
        flex-direction: column-reverse;
    }
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --secondary-bg: #f9f5f8;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

body {
    color: var(--text-color);
    padding-top: 140px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Hero */
.hero-section {
    background-color: var(--secondary-bg);
    padding: 80px 0;
    text-align: center;
    border-radius: 12px;
    margin-bottom: 60px;
}

.hero-section h1 {
    font-size: 48px;
    margin-bottom: 20px;
    color: var(--text-color);
}

.hero-section p {
    font-size: 18px;
    max-width: 700px;
    margin: 0 auto;
    color: #555;
    line-height: 1.6;
}

/* Doctors */
.doctor-card {
    border: 1px solid #eee;
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.3s ease;
    text-align: center;
    background: #fff;
    margin-bottom: 30px;
}

.doctor-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
}

.doctor-card .img-container {
    height: 250px;
    background-color: #eaeaea;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 60px;
    color: #999;
}

.doctor-card .info {
    padding: 30px;
}

.doctor-card h4 {
    font-size: 22px;
    margin-bottom: 5px;
}

.doctor-card p {
    color: #777;
    font-size: 14px;
    margin-bottom: 20px;
}

.doctor-card .btn {
    background-color: var(--primary-color);
    color: #fff;
    border: none;
    padding: 10px 30px;
    border-radius: 4px;
}

.doctor-card .btn:hover {
    background-color: var(--primary-color-hover);
}

/* Services */
.services-section {
    background-color: #fff;
    padding: 80px 0;
    text-align: center;
}

.services-section h2 {
    font-size: 36px;
    margin-bottom: 50px;
}

.service-box {
    padding: 30px;
    border-radius: 12px;
    background-color: var(--secondary-bg);
    height: 100%;
    transition: all 0.3s;
}

.service-box:hover {
    background-color: var(--primary-color);
    color: #fff;
}

.service-box h4 {
    font-size: 20px;
    margin-bottom: 15px;
}

.service-box p {
    font-size: 15px;
    margin: 0;
    opacity: 0.9;
}

/* Footer */
.footer {
    background-color: #000000;
    color: #fff;
    padding: 60px 0 20px;
    margin-top: 60px;
}

.footer h4 {
    font-size: 18px;
    margin-bottom: 20px;
    font-family: var(--bs-body-font-family);
}

.footer a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

.social-icons a {
    display: inline-block;
    margin-right: 15px;
    font-size: 20px;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 20px;
    margin-top: 40px;
    font-size: 13px;
    opacity: 0.8;
    text-align: center;
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --secondary-bg: #f9f5f8;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

body {
    color: var(--text-color);
    padding-top: 140px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Hero */
.hero-section {
    background-color: var(--secondary-bg);
    padding: 80px 0;
    text-align: center;
    border-radius: 12px;
    margin-bottom: 60px;
}

.hero-section h1 {
    font-size: 48px;
    margin-bottom: 20px;
    color: var(--text-color);
}

.hero-section p {
    font-size: 18px;
    max-width: 700px;
    margin: 0 auto;
    color: #555;
    line-height: 1.6;
}

/* Contact Details & Form */
.contact-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 12px;
    padding: 40px;
    margin-bottom: 30px;
    height: 100%;
}

.contact-card h3 {
    font-size: 24px;
    margin-bottom: 25px;
    color: var(--primary-color);
}

.contact-info-item {
    display: flex;
    align-items: flex-start;
    margin-bottom: 25px;
}

.contact-info-item i {
    color: var(--primary-color);
    font-size: 20px;
    margin-top: 5px;
    width: 30px;
}

.contact-info-item div p {
    margin: 0;
    color: #555;
    font-size: 16px;
    line-height: 1.6;
}

.contact-info-item div strong {
    display: block;
    margin-bottom: 5px;
    color: var(--text-color);
}

.form-control,
.form-select {
    padding: 12px 15px;
    border-radius: 6px;
    border: 1px solid #ddd;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 0.25rem rgba(166, 117, 164, 0.25);
}

.btn-custom {
    background-color: var(--primary-color);
    color: white;
    padding: 12px 30px;
    border: none;
    border-radius: 6px;
    transition: all 0.3s;
}

.btn-custom:hover {
    background-color: var(--primary-color-hover);
}

/* Footer */
.footer {
    background-color: var(--primary-color);
    color: #fff;
    padding: 60px 0 20px;
    margin-top: 60px;
}

.footer h4 {
    font-size: 18px;
    margin-bottom: 20px;
    font-family: var(--bs-body-font-family);
}

.footer a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

.social-icons a {
    display: inline-block;
    margin-right: 15px;
    font-size: 20px;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 20px;
    margin-top: 40px;
    font-size: 13px;
    opacity: 0.8;
    text-align: center;
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color-2: #4ab84b;
    --primary-color-hover-2: #4ab84b;
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --secondary-bg: #f9f5f8;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

body {
    color: var(--text-color);
    padding-top: 140px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Hero */
.faqs-header {
    background-color: var(--secondary-bg);
    padding: 60px 0;
    text-align: center;
    margin-bottom: 50px;
    border-radius: 12px;
}

.faqs-header h1 {
    font-size: 40px;
    margin-bottom: 15px;
}

/* Accordion */
.accordion-item {
    border: 1px solid #eee;
    margin-bottom: 15px;
    border-radius: 8px !important;
    overflow: hidden;
}

.accordion-button {
    padding: 20px;
    font-weight: 600;
    font-size: 16px;
    background: #fff !important;
    color: var(--text-color);
    box-shadow: none !important;
}

.accordion-button:not(.collapsed) {
    color: var(--primary-color);
    background-color: #fff !important;
}

.accordion-body {
    padding: 20px;
    color: #555;
    line-height: 1.6;
    background: #fff;
}

/* Footer */
.footer {
    background-color: var(--primary-color);
    color: #fff;
    padding: 60px 0 20px;
    margin-top: 60px;
}

.footer a {
    color: #fff;
    text-decoration: none;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 20px;
    margin-top: 40px;
    font-size: 13px;
    opacity: 0.8;
    text-align: center;
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

body {
    color: var(--text-color);
    padding-top: 140px;
    /* Accounts for sticky header */
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Hero Carousel */
.hero-section img {
    width: 100%;
    object-fit: cover;
}

.hero-banner {
    position: relative;
}

/* Trusted Confidant Section */
.trusted-section {
    background-color: var(--primary-color);
    color: #fff;
    padding: 60px 20px;
    text-align: center;
}

.trusted-section h1 {
    font-size: 40px;
    max-width: 800px;
    margin: 0 auto;
}

/* Best Sellers Section */
.best-sellers {
    padding: 60px 0;
}

.section-header {
    text-align: center;
    margin-bottom: 40px;
}

.section-header h2 {
    font-size: 14px;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-family: var(--bs-body-font-family);
}

.section-header h3 {
    font-size: 32px;
}

.product-card {
    border: none;
    margin-bottom: 30px;
    text-align: left;
}

.product-card img {
    border-radius: 8px;
    transition: transform 0.3s;
}

.product-card:hover img {
    transform: scale(1.03);
}

.product-title {
    font-family: 'Quicksand', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: var(--text-color);
    text-decoration: none;
    display: block;
    margin-top: 15px;
}

.product-price {
    font-size: 15px;
    color: var(--text-color);
    margin-top: 5px;
}

.btn-add-cart {
    width: 100%;
    border: 1px solid var(--text-color);
    background: transparent;
    color: var(--text-color);
    padding: 10px;
    margin-top: 15px;
    transition: all 0.3s;
}

.btn-add-cart:hover {
    background: var(--text-color);
    color: white;
}

.product-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: var(--primary-color);
    color: white;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: bold;
    border-radius: 4px;
    z-index: 10;
}

/* Image with text */
.image-with-text {
    padding: 80px 0;
}

.image-with-text h2 {
    font-size: 14px;
    text-transform: uppercase;
    font-family: var(--bs-body-font-family);
    margin-bottom: 10px;
}

.image-with-text h3 {
    font-size: 48px;
    margin-bottom: 20px;
}

.btn-primary-custom {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    color: white;
    padding: 12px 30px;
    border-radius: 4px;
}

.btn-primary-custom:hover {
    background-color: var(--primary-color-hover);
    border-color: var(--primary-color-hover);
    color: white;
}

/* ======================= */

.horizontal-vids {
    display: flex;
    overflow-x: auto;
    gap: 15px;
    padding-bottom: 20px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.horizontal-vids::-webkit-scrollbar {
    display: none;
}

.vid-item {
    flex: 0 0 calc(20% - 12px);
    min-width: 200px;
    border-radius: 12px;
    overflow: hidden;
    background: #000;
    aspect-ratio: 9/16;
}

@media (max-width: 768px) {
    .vid-item {
        flex: 0 0 calc(50% - 10px);
    }
}

.vid-item video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --secondary-bg: #f9f5f8;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

body {
    color: var(--text-color);
    padding-top: 140px;
    font-family: var(--bs-body-font-family);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Footer */
.footer {
    background-color: var(--primary-color);
    color: #fff;
    padding: 60px 0 20px;
    margin-top: 60px;
}

.footer h4 {
    font-size: 18px;
    margin-bottom: 20px;
    font-family: var(--bs-body-font-family);
}

.footer a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

.social-icons a {
    display: inline-block;
    margin-right: 15px;
    font-size: 20px;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 20px;
    margin-top: 40px;
    font-size: 13px;
    opacity: 0.8;
    text-align: center;
}

.hero-section {
    background-color: var(--secondary-bg);
    padding: 80px 0;
    text-align: center;
    border-radius: 12px;
    margin-bottom: 60px;
}

.hero-section h1 {
    font-size: 48px;
    margin-bottom: 20px;
    color: var(--primary-color);
}

.hero-section p {
    font-size: 18px;
    max-width: 800px;
    margin: 0 auto;
    color: #555;
    line-height: 1.6;
}

.role-card {
    background-color: #fcfcfc;
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 30px;
    height: 100%;
    text-align: center;
}

.role-card i {
    font-size: 40px;
    color: var(--primary-color);
    margin-bottom: 20px;
}

.role-card h3 {
    font-size: 22px;
    margin-bottom: 15px;
}

.steps-container {
    margin-top: 50px;
}

.step-item {
    display: flex;
    align-items: flex-start;
    margin-bottom: 30px;
    background: #fff;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
}

.step-number {
    background: var(--primary-color);
    color: white;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-weight: bold;
    font-size: 18px;
    flex-shrink: 0;
    margin-right: 20px;
}

.step-content h4 {
    font-size: 20px;
    margin-bottom: 10px;
    color: var(--primary-color);
}

.step-content p {
    color: #555;
    margin: 0;
    line-height: 1.6;
}

.benefits-list {
    list-style: none;
    padding: 0;
}

.benefits-list li {
    margin-bottom: 12px;
    font-size: 17px;
}

.benefits-list li i {
    color: var(--primary-color);
    margin-right: 10px;
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

body {
    color: var(--text-color);
    padding-top: 140px;
    /* Accounts for sticky header */
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Breadcrumbs */
.breadcrumb {
    background: transparent;
    padding: 0;
    margin-bottom: 20px;
    font-size: 14px;
}

.breadcrumb-item a {
    color: var(--text-color);
    text-decoration: none;
}

.breadcrumb-item a:hover {
    text-decoration: underline;
}

.breadcrumb-item.active {
    color: #666;
}

/* Product Gallery */
.product-gallery-main {
    border-radius: 8px;
    margin-bottom: 15px;
    width: 100%;
}

.product-thumbnails img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 6px;
    margin-right: 10px;
    cursor: pointer;
    border: 2px solid transparent;
    opacity: 0.6;
    transition: all 0.2s;
}

.product-thumbnails img:hover,
.product-thumbnails img.active {
    border-color: var(--primary-color);
    opacity: 1;
}

/* Product Details */
.product-title {
    font-size: 32px;
    margin-bottom: 15px;
}

.product-price {
    font-size: 24px;
    font-weight: bold;
    color: var(--text-color);
    margin-bottom: 20px;
}

.product-description {
    font-size: 16px;
    line-height: 1.6;
    color: #555;
    margin-bottom: 30px;
}

/* Variant Selectors */
.variant-label {
    font-weight: 600;
    margin-bottom: 10px;
    display: block;
}

.variant-options {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 25px;
}

.variant-btn {
    border: 1px solid #ddd;
    background: #fff;
    padding: 10px 20px;
    border-radius: 4px;
    font-size: 14px;
    color: var(--text-color);
    cursor: pointer;
    transition: all 0.2s;
}

.variant-btn.active,
.variant-btn:hover {
    border-color: var(--primary-color);
    background-color: var(--primary-color);
    color: #fff;
}

.variant-btn.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    text-decoration: line-through;
}

/* Quantity and Add to Cart */
.quantity-selector {
    display: flex;
    align-items: center;
    border: 1px solid #ddd;
    border-radius: 4px;
    width: max-content;
}

.quantity-selector button {
    background: transparent;
    border: none;
    padding: 10px 15px;
    font-size: 18px;
    cursor: pointer;
}

.quantity-selector input {
    width: 50px;
    text-align: center;
    border: none;
    font-size: 16px;
}

.btn-add-to-cart {
    background-color: var(--primary-color);
    color: #fff;
    border: none;
    padding: 15px;
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    border-radius: 4px;
    transition: all 0.3s;
}

.btn-add-to-cart:hover {
    background-color: var(--primary-color-hover);
}

/* Subscription Box */
.subscription-box {
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 25px;
    background-color: #fcfcfc;
}

/* Accordion */
.accordion-item {
    border: none;
    border-bottom: 1px solid #eee;
}

.accordion-button {
    font-weight: 600;
    font-size: 16px;
    color: var(--text-color);
    padding: 20px 0;
    background: transparent !important;
    box-shadow: none !important;
}

.accordion-button:not(.collapsed) {
    color: var(--primary-color);
}

.accordion-body {
    padding: 0 0 20px 0;
    color: #555;
    line-height: 1.6;
}

/* Footer */
.footer {
    background-color: var(--primary-color);
    color: #fff;
    padding: 60px 0 20px;
    margin-top: 60px;
}

.footer h4 {
    font-size: 18px;
    margin-bottom: 20px;
    font-family: var(--bs-body-font-family);
}

.footer a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

.social-icons a {
    display: inline-block;
    margin-right: 15px;
    font-size: 20px;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 20px;
    margin-top: 40px;
    font-size: 13px;
    opacity: 0.8;
    text-align: center;
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

body {
    color: var(--text-color);
    padding-top: 140px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Content styling */
.policy-container {
    max-width: 800px;
    margin: 0 auto;
}

.policy-title {
    text-align: center;
    font-size: 40px;
    margin-bottom: 40px;
}

.policy-content {
    font-size: 16px;
    line-height: 1.8;
    color: #555;
}

.policy-content h2 {
    font-size: 24px;
    color: var(--text-color);
    margin-top: 40px;
    margin-bottom: 15px;
}

.policy-content p {
    margin-bottom: 20px;
}

.policy-content ul {
    margin-bottom: 20px;
    padding-left: 20px;
}

.policy-content li {
    margin-bottom: 10px;
}

/* Footer */
.footer {
    background-color: var(--primary-color);
    color: #fff;
    padding: 60px 0 20px;
    margin-top: 60px;
}

.footer h4 {
    font-size: 18px;
    margin-bottom: 20px;
    font-family: var(--bs-body-font-family);
}

.footer a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

.social-icons a {
    display: inline-block;
    margin-right: 15px;
    font-size: 20px;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 20px;
    margin-top: 40px;
    font-size: 13px;
    opacity: 0.8;
    text-align: center;
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

body {
    color: var(--text-color);
    padding-top: 140px;
    /* Accounts for sticky header */
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Breadcrumbs */
.breadcrumb {
    background: transparent;
    padding: 0;
    margin-bottom: 20px;
    font-size: 14px;
}

.breadcrumb-item a {
    color: var(--text-color);
    text-decoration: none;
}

.breadcrumb-item a:hover {
    text-decoration: underline;
}

.breadcrumb-item.active {
    color: #666;
}

/* Page Header */
.page-header {
    margin-bottom: 40px;
}

.page-header h1 {
    font-size: 40px;
}

/* Toolbar */
.collection-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    border-bottom: 1px solid #eee;
    padding-bottom: 15px;
}

/* Products Grid */
.product-card {
    border: none;
    margin-bottom: 40px;
    text-align: left;
}

.product-card img {
    border-radius: 8px;
    transition: transform 0.3s;
}

.product-card:hover img {
    transform: scale(1.03);
}

.product-title {
    font-family: 'Quicksand', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: var(--text-color);
    text-decoration: none;
    display: block;
    margin-top: 15px;
}

.product-price {
    font-size: 15px;
    color: var(--text-color);
    margin-top: 5px;
}

.btn-add-cart {
    width: 100%;
    border: 1px solid var(--text-color);
    background: transparent;
    color: var(--text-color);
    padding: 10px;
    margin-top: 15px;
    transition: all 0.3s;
}

.btn-add-cart:hover {
    background: var(--text-color);
    color: white;
}

.product-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: var(--primary-color);
    color: white;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: bold;
    border-radius: 4px;
    z-index: 10;
}

/* Footer */
.footer {
    background-color: var(--primary-color);
    color: #fff;
    padding: 60px 0 20px;
    margin-top: 60px;
}

.footer h4 {
    font-size: 18px;
    margin-bottom: 20px;
    font-family: var(--bs-body-font-family);
}

.footer a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

.social-icons a {
    display: inline-block;
    margin-right: 15px;
    font-size: 20px;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 20px;
    margin-top: 40px;
    font-size: 13px;
    opacity: 0.8;
    text-align: center;
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --secondary-bg: #f9f5f8;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

body {
    color: var(--text-color);
    padding-top: 140px;
    font-family: var(--bs-body-font-family);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Footer */
.footer {
    background-color: var(--primary-color);
    color: #fff;
    padding: 60px 0 20px;
    margin-top: 60px;
}

.footer h4 {
    font-size: 18px;
    margin-bottom: 20px;
    font-family: var(--bs-body-font-family);
}

.footer a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

.social-icons a {
    display: inline-block;
    margin-right: 15px;
    font-size: 20px;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 20px;
    margin-top: 40px;
    font-size: 13px;
    opacity: 0.8;
    text-align: center;
}

/* Page specific */
.hero-section {
    background-color: var(--secondary-bg);
    padding: 80px 0;
    text-align: center;
    border-radius: 12px;
    margin-bottom: 60px;
}

.hero-section h1 {
    font-size: 48px;
    margin-bottom: 20px;
    color: var(--text-color);
}

.hero-section p {
    font-size: 18px;
    max-width: 700px;
    margin: 0 auto;
    color: #555;
    line-height: 1.6;
}

.program-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 12px;
    padding: 40px;
    text-align: center;
    height: 100%;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
}

.program-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
}

.program-card h3 {
    font-size: 24px;
    margin-bottom: 15px;
    color: var(--primary-color);
}

.program-card p {
    color: #666;
    font-size: 15px;
    margin-bottom: 25px;
    line-height: 1.6;
    flex-grow: 1;
}

.program-card .btn {
    background-color: var(--primary-color);
    color: white;
    padding: 10px 25px;
    border-radius: 4px;
    text-decoration: none;
    border: none;
    align-self: center;
}

.program-card .btn:hover {
    background-color: var(--primary-color-hover);
    color: white;
}

.icon-container {
    width: 80px;
    height: 80px;
    background-color: var(--secondary-bg);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    color: var(--primary-color);
    margin: 0 auto 20px;
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

body {
    color: var(--text-color);
    padding-top: 140px;
    /* Accounts for sticky header */
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

main {
    flex: 1;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Footer */
.footer {
    background-color: var(--text-color);
    color: #fff;
    padding: 60px 0 20px;
}

.footer h4 {
    color: #fff;
    font-size: 18px;
    margin-bottom: 20px;
    font-family: 'Quicksand', sans-serif;
}

.footer ul {
    list-style: none;
    padding: 0;
}

.footer ul li {
    margin-bottom: 10px;
}

.footer ul li a {
    color: #ccc;
    text-decoration: none;
    transition: color 0.3s;
}

.footer ul li a:hover {
    color: #fff;
}

.footer-bottom {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid #444;
    text-align: center;
    font-size: 14px;
    color: #aaa;
}

.success-icon {
    font-size: 60px;
    color: var(--primary-color);
    margin-bottom: 20px;
}

.btn-primary-custom {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    color: white;
    padding: 12px 30px;
    border-radius: 4px;
}

.btn-primary-custom:hover {
    background-color: var(--primary-color-hover);
    border-color: var(--primary-color-hover);
    color: white;
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --secondary-bg: #f9f5f8;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

body {
    color: var(--text-color);
    padding-top: 140px;
    font-family: var(--bs-body-font-family);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Footer */
.footer {
    background-color: var(--primary-color);
    color: #fff;
    padding: 60px 0 20px;
    margin-top: 60px;
}

.footer h4 {
    font-size: 18px;
    margin-bottom: 20px;
    font-family: var(--bs-body-font-family);
}

.footer a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

.social-icons a {
    display: inline-block;
    margin-right: 15px;
    font-size: 20px;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 20px;
    margin-top: 40px;
    font-size: 13px;
    opacity: 0.8;
    text-align: center;
}

.hero-section {
    background-color: var(--secondary-bg);
    padding: 80px 0;
    text-align: center;
    border-radius: 12px;
    margin-bottom: 60px;
}

.hero-section h1 {
    font-size: 48px;
    margin-bottom: 20px;
    color: var(--primary-color);
}

.hero-section p {
    font-size: 18px;
    max-width: 800px;
    margin: 0 auto;
    color: #555;
    line-height: 1.6;
}

.content-section {
    margin-bottom: 80px;
}

.content-section h2 {
    font-size: 36px;
    margin-bottom: 30px;
    color: var(--text-color);
}

.sustain-feature {
    background: #fff;
    padding: 30px;
    border-radius: 12px;
    border: 1px solid #eee;
    margin-top: 40px;
}

.sustain-list {
    list-style: none;
    padding: 0;
    margin-top: 30px;
}

.sustain-list li {
    font-size: 18px;
    padding: 15px 0;
    border-bottom: 1px solid #eee;
    display: flex;
    align-items: center;
}

.sustain-list li:last-child {
    border-bottom: none;
}

.sustain-list li i {
    color: var(--primary-color);
    margin-right: 15px;
    font-size: 24px;
}

/* ======================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Quicksand:wght@300..700&family=Figtree:wght@400;600&display=swap');

:root {
    --primary-color: #e83e8c;
    --primary-color-hover: #e83e8c;
    --secondary-bg: #f9f5f8;
    --text-color: rgb(26, 26, 26);
    --bs-body-font-family: 'Figtree', sans-serif;
    --heading-font: 'Fraunces', serif;
}

body {
    color: var(--text-color);
    padding-top: 140px;
    font-family: var(--bs-body-font-family);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    font-weight: 600;
}

/* Announcement Bar */
.announcement-bar {
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050;
}

.announcement-bar p {
    margin: 0;
}

/* Header */
.custom-navbar {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    position: fixed;
    top: 40px;
    width: 100%;
    z-index: 1040;
    transition: all 0.3s ease;
}

.navbar-brand img {
    max-width: 120px;
}

.nav-link {
    color: var(--text-color) !important;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 15px !important;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

.nav-icons a {
    color: var(--text-color);
    margin-left: 15px;
    font-size: 18px;
    text-decoration: none;
}

/* Footer */
.footer {
    background-color: var(--primary-color);
    color: #fff;
    padding: 60px 0 20px;
    margin-top: 60px;
}

.footer h4 {
    font-size: 18px;
    margin-bottom: 20px;
    font-family: var(--bs-body-font-family);
}

.footer a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

.social-icons a {
    display: inline-block;
    margin-right: 15px;
    font-size: 20px;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 20px;
    margin-top: 40px;
    font-size: 13px;
    opacity: 0.8;
    text-align: center;
}

.hero-section {
    background-color: var(--secondary-bg);
    padding: 80px 0;
    text-align: center;
    border-radius: 12px;
    margin-bottom: 60px;
}

.hero-section h1 {
    font-size: 48px;
    margin-bottom: 20px;
    color: var(--primary-color);
}

.hero-section p {
    font-size: 18px;
    max-width: 800px;
    margin: 0 auto;
    color: #555;
    line-height: 1.6;
}

.feature-box {
    text-align: center;
    padding: 40px 20px;
}

.feature-box i {
    font-size: 48px;
    color: var(--primary-color);
    margin-bottom: 20px;
}

.cta-banner {
    background: linear-gradient(135deg, #e83e8c, #d197ce);
    color: white;
    padding: 50px;
    border-radius: 16px;
    text-align: center;
    margin-top: 60px;
}

.cta-banner h2 {
    font-size: 32px;
    margin-bottom: 20px;
    color: white;
}

/* ======================= */

.footer {
    background-color: var(--primary-color, #e83e8c);
    color: #fff;
    padding: 60px 0 20px;
}

.footer h4 {
    font-size: 18px;
    margin-bottom: 20px;
    font-family: var(--bs-body-font-family, 'Figtree', sans-serif);
}

.footer a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.footer a:hover {
    opacity: 1;
    text-decoration: underline;
}

.social-icons a {
    display: inline-block;
    margin-right: 15px;
    font-size: 20px;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 20px;
    margin-top: 40px;
    font-size: 13px;
    opacity: 0.8;
    text-align: center;
}

/* ======================= */

.whatsapp-float {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 30px;
    right: 30px;
    background-color: #25d366;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 35px;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: background-color 0.3s ease, transform 0.3s ease;
}

.whatsapp-float:hover {
    background-color: #128C7E;
    color: #FFF;
    transform: scale(1.1);
}

@media (max-width: 768px) {
    .whatsapp-float {
        width: 50px;
        height: 50px;
        bottom: 20px;
        right: 20px;
        font-size: 28px;
    }
}

/* Navbar Dropdown on Hover (Desktop) */
@media (min-width: 992px) {
    .navbar-nav .dropdown:hover > .dropdown-menu {
        display: block;
        margin-top: 0;
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
        transition: all 0.3s ease;
    }
    .navbar-nav .dropdown .dropdown-menu {
        display: block;
        opacity: 0;
        visibility: hidden;
        transform: translateY(10px);
        transition: all 0.3s ease;
        pointer-events: none;
    }
    .navbar-nav .dropdown:hover .nav-link {
        color: var(--primary-color) !important;
    }
    .navbar-nav .dropdown-menu {
        pointer-events: auto;
    }
}


/* ================================================================
   MEGA MENU - Dynamic Category Navigation
   ================================================================ */

/* Full-width panel */
.mega-menu {
    width: 100vw;
    left: 50%;
    transform: translateX(-50%) translateY(12px) !important;
    border-radius: 0 0 16px 16px !important;
    padding: 0 !important;
    background: #fff;
    box-shadow: 0 24px 64px rgba(0,0,0,.13) !important;
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease !important;
}

/* Desktop hover show/hide */
@media (min-width: 992px) {
    .navbar-nav .dropdown:hover > .mega-menu {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateX(-50%) translateY(0) !important;
        pointer-events: auto !important;
    }
    .navbar-nav .dropdown > .mega-menu {
        display: block !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

/* Inner flex grid */
.mega-menu-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    padding: 28px 32px 28px;
    gap: 0;
    max-width: 1200px;
    margin: 0 auto;
    border-top: 3px solid var(--primary-color);
}

/* All Products CTA column */
.mega-col-all {
    display: flex;
    align-items: flex-start;
    padding-right: 28px;
    margin-right: 20px;
    border-right: 1px solid #f0e6ec;
    min-width: 130px;
}
.mega-all-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    color: var(--primary-color);
    font-weight: 700;
    font-size: 13px;
    text-align: center;
    padding: 14px 18px;
    border-radius: 10px;
    border: 2px solid var(--primary-color);
    transition: all 0.2s ease;
    white-space: nowrap;
}
.mega-all-link:hover { background: var(--primary-color); color: #fff !important; }
.mega-all-icon { font-size: 24px; line-height: 1; }

/* Category column */
.mega-col {
    flex: 1;
    min-width: 150px;
    max-width: 210px;
    padding: 0 18px 8px;
    border-right: 1px solid #f5eef2;
}
.mega-col:last-child { border-right: none; }

/* L1 heading */
.mega-heading {
    display: block;
    font-family: var(--heading-font);
    font-weight: 700;
    font-size: 13.5px;
    color: var(--text-color);
    text-decoration: none;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--primary-color);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: color 0.2s;
}
.mega-heading:hover { color: var(--primary-color); }

/* List resets */
.mega-list, .mega-l3-list, .mega-l4-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* L2 */
.mega-l2 { margin-bottom: 5px; }
.mega-l2 > a {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #333;
    text-decoration: none;
    padding: 2px 0;
    transition: color 0.2s;
}
.mega-l2 > a:hover { color: var(--primary-color); padding-left: 3px; }

/* L3 */
.mega-l3-list { margin: 3px 0 5px 10px; }
.mega-l3 { margin-bottom: 2px; }
.mega-l3 > a {
    display: block;
    font-size: 12px;
    color: #555;
    text-decoration: none;
    padding: 2px 0;
    transition: color 0.2s;
}
.mega-l3 > a:hover { color: var(--primary-color); }

/* L4 */
.mega-l4-list { margin: 2px 0 4px 12px; }
.mega-l4 a {
    display: block;
    font-size: 11px;
    color: #888;
    text-decoration: none;
    padding: 1px 0;
    font-style: italic;
    transition: color 0.2s;
}
.mega-l4 a:hover { color: var(--primary-color); font-style: normal; }

.mega-dot {
    color: var(--primary-color);
    margin-right: 3px;
    font-weight: 700;
    font-size: 0.9em;
}

/* Mobile layout */
@media (max-width: 991px) {
    .mega-menu {
        width: 100% !important;
        left: 0 !important;
        transform: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        position: static !important;
        display: none;
        opacity: 1 !important;
        visibility: visible !important;
    }
    .navbar-nav .dropdown.show > .mega-menu {
        display: block !important;
        pointer-events: auto !important;
    }
    .mega-menu-inner {
        flex-direction: column;
        padding: 12px 16px;
        gap: 10px;
        border-top: 2px solid var(--primary-color);
    }
    .mega-col-all {
        border-right: none;
        border-bottom: 1px solid #f0e6ec;
        padding-right: 0;
        padding-bottom: 10px;
        margin-right: 0;
        min-width: unset;
    }
    .mega-all-link { flex-direction: row; padding: 8px 14px; }
    .mega-col {
        max-width: 100%;
        border-right: none;
        border-bottom: 1px solid #f5eef2;
        padding: 6px 0 10px;
    }
    .mega-col:last-child { border-bottom: none; }
}
