@font-face {
    font-family: 'Jawbreak';
    src: url('./../webfonts/Jawbreak-Sans.woff2') format('woff2'),
        url('./../webfonts/Jawbreak-Sans.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Albert';
    src: url('./../webfonts/AlbertSans-Regular.woff2') format('woff2'),
        url('./../webfonts/AlbertSans-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Albert';
    src: url('./../webfonts/AlbertSans-Medium.woff2') format('woff2'),
        url('./../webfonts/AlbertSans-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Albert';
    src: url('./../webfonts/AlbertSans-SemiBold.woff2') format('woff2'),
        url('./../webfonts/AlbertSans-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Albert';
    src: url('./../webfonts/AlbertSans-Bold.woff2') format('woff2'),
        url('./../webfonts/AlbertSans-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Albert';
    src: url('./../webfonts/AlbertSans-ExtraBold.woff2') format('woff2'),
        url('./../webfonts/AlbertSans-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Albert';
    src: url('./../webfonts/AlbertSans-Black.woff2') format('woff2'),
        url('./../webfonts/AlbertSans-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Albert';
    src: url('./../webfonts/AlbertSans-Italic.woff2') format('woff2'),
        url('./../webfonts/AlbertSans-Italic.woff') format('woff');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Albert';
    src: url('./../webfonts/AlbertSans-SemiBoldItalic.woff2') format('woff2'),
        url('./../webfonts/AlbertSans-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}


/* navbar */

.custom-navbar-wrapper {
    position: fixed;
    top: 25px;
    left: 0;
    width: 100%;
    z-index: 999;
    padding: 0 22px;
}

.custom-navbar {
    position: relative;
    border-radius: 11px;
    padding: 10px 22px;
    background: #E0A3B1;
    z-index: 1;
}

.custom-navbar::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: 11px;
    background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: -1;
}

.custom-navbar .nav-logo {
    width: 86px;
    height: 86px;
    object-fit: cover;
}

.custom-navbar .navbar-nav {
    gap: 48px;
}

.custom-navbar .navbar-nav .nav-item .nav-link {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #374550;
}

.custom-navbar .navbar-nav .nav-item:last-child {
    padding-right: 45px;
}

.custom-navbar .nav-icons {
    gap: 15px;
}

.custom-navbar .navbar-toggler {
    padding: 0;
}

.custom-navbar .burger {
    width: 35px;
}

.custom-navbar .navbar-toggler {
    border: none;
}

.custom-navbar .navbar-toggler:focus {
    box-shadow: none;
}

@media (max-width: 992px) {
    .custom-navbar:has(.collapse.show) {
        padding-bottom: 25px;
    }

    .custom-navbar .navbar-nav {
        gap: 0px;
    }

    .custom-navbar .nav-icons {
        gap: 20px;
    }

    .navbar-collapse {
        margin-top: 5px;
    }
}


/* footer */

.footer-top {
    padding: 26px;
    background: #E0A3B1;
}

.footer-links {
    margin: 0;
    font-family: 'Albert';
    font-weight: 400;
    font-size: 24px;
    line-height: 30px;
    color: #FAF7F2;
}

.footer-links a {
    margin: 0;
    font-family: 'Albert';
    font-weight: 400;
    font-size: 24px;
    line-height: 30px;
    color: #FAF7F2;
}

.footer-bottom {
    padding: 15px;
    background: #374550;
    font-family: 'Albert';
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #E0A3B1;
    text-transform: uppercase;
}

@media (max-width: 992px) {
    .footer-links {
        font-size: 20px;
        line-height: 26px;
    }

    .footer-links a {
        font-size: 20px;
        line-height: 26px;
    }
}

@media (max-width: 576px) {
    .footer-top {
        padding: 14px;
    }
}


/* home */

.hero-section {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.hero-section .hero-bg {
    width: 100%;
    height: 847px;
    object-fit: cover;
}

.hero-section .hero-content {
    position: absolute;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    max-width: 75%;
    text-align: center;
    background: #FFFFFF94;
    border-radius: 30px;
    min-height: 503px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
}

.hero-section .win-text {
    font-family: 'Jawbreak';
    font-weight: 400;
    font-size: 24px;
    line-height: 30px;
    color: #374550;
    margin-bottom: 15px;
}

.hero-section .sub-line {
    font-family: 'Albert';
    font-weight: 600;
    font-size: 16px;
    line-height: 22px;
    color: #374550;
    margin-bottom: 40px;
}

.hero-section .shop-btn {
    background: #E0A3B1;
    border: none;
    padding: 15px;
    color: #FFFFFF;
    font-family: 'Albert';
    font-size: 18px;
    line-height: 24px;
    font-weight: 800;
    border-radius: 30px;
    cursor: pointer;
}

.hero-section .hero-box {
    padding-top: 23px;
    padding-bottom: 22px;
    background: #FFFFFF;
    margin-bottom: 15px;
    width: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-section .side-img {
    position: absolute;
    object-fit: contain;
}

.hero-section .left-img {
    left: -24px;
}

.hero-section .right-img {
    right: -24px;
}

.hero-section .price {
    font-family: 'Albert';
    font-weight: 900;
    font-size: 46px;
    color: #374550;
    margin: 0;
}


.bonus-section {
    padding: 20px 30px;
    background: #FFFFFF;
}

.bonus-section .bonus-title {
    font-family: 'Jawbreak';
    font-size: 36px;
    font-weight: 400;
    color: #E0A3B1;
    text-align: center;
    margin-bottom: 8px;
}

.bonus-section .tier-box {
    width: 100%;
    padding: 1px 20px;
    text-align: center;
    font-family: 'Albert';
    font-size: 16px;
    font-weight: 400;
    color: #FAF7F2;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 10px;
}

.bonus-section .tier-box:last-child {
    margin-bottom: 0px;
}

.bonus-section .tier-box span {
    font-family: 'Jawbreak';
    font-size: 46px;
    font-weight: 400;
    color: #FAF7F2;
}

.bonus-section .tier-1 {
    background: #FF6F61;
}

.bonus-section .tier-2 {
    background: #E0A3B1;
}

.bonus-section .tier-3 {
    background: #374550;
}

.bonus-section .bonus-img {
    width: 100%;
    height: 100%;
    border-radius: 9px;
    object-fit: cover;
}


.how-section {
    background: #FAF7F2;
    padding: 30px;
}

.how-section .how-title {
    font-family: 'Jawbreak';
    font-size: 36px;
    line-height: 42px;
    font-weight: 400;
    color: #374550;
}

.how-section .how-card {
    position: relative;
    background: #FFFFFF;
    padding: 29px 20px;
    text-align: center;
    border-radius: 17px;
    height: 100%;
    z-index: 1;
}

.how-section .how-card::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: 17px;
    background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: -1;
}

.how-section .how-card .how-icon {
    margin-bottom: 18px;
}

.how-section .how-card-title {
    font-family: 'Jawbreak';
    font-size: 30px;
    line-height: 36px;
    font-weight: 400;
    color: #374550;
    margin-bottom: 15px;
}

.how-section .how-card-text {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.how-section .how-card:hover {
    background: #E0A3B1;
}

.how-section .how-card:hover::before {
    opacity: 0;
}

.how-section .how-card:hover .how-card-title {
    color: #FFFFFF;
}

.how-section .how-card:hover .how-card-text {
    color: #FFFFFF;
}


.video-section {
    background: #FAF7F2;
    padding: 35px;
    position: relative;
}

.video-section .video-thumb {
    width: 100%;
    border-radius: 16px;
    object-fit: cover;
    height: 731px;
}

.video-section .play-btn img {
    width: 100px;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
    z-index: 5;
}

@media (max-width: 768px) {
    .video-section .video-thumb {
        height: 200px;
    }

    .video-section .play-btn img {
        width: 60px;
        height: 60px;
    }
}

.venue-section {
    background: #FFFFFF;
    text-align: center;
    padding: 25px;
}

.venue-section h2 {
    font-family: 'Jawbreak';
    font-size: 36px;
    line-height: 42px;
    font-weight: 400;
    color: #374550;
    margin-bottom: 15px;
}




.guest-section {
    background: #374550;
    padding: 50px;
}

.guest-section .guest-title {
    font-family: 'Jawbreak';
    font-size: 36px;
    line-height: 42px;
    font-weight: 400;
    color: #FAF7F2;
    margin-bottom: 35px;
}

.guest-section .guest-title span {
    color: #E0A3B1;
}

.guest-section .guest-card {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.guest-section .guest-card .guest-img {
    width: 100%;
    height: 329px;
    border-radius: 17px;
    object-fit: cover;
}

.guest-section .owl-stage .guest-content {
    background: #FFFFFF;
    padding: 30px;
    border-radius: 17px;
    margin-top: -35px;
    position: relative;
}

.guest-section .guest-content::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: 17px;
    background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}


.guest-section .guest-name {
    font-family: 'Albert';
    font-weight: 700;
    font-size: 24px;
    line-height: 30px;
    color: #222222;
    margin-bottom: 0px;
}

.guest-section .guest-text {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 24px;
    line-height: 30px;
    color: #222222;
    margin-bottom: 0;
}

.guest-section .arrow-btn {
    border: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    background: transparent;
    z-index: 11;
}

.guest-section .left-arrow {
    left: -20px;
}

.guest-section .right-arrow {
    right: -20px;
}

@media (max-width: 576px) {
    .guest-section .left-arrow {
        left: -10px;
    }
    .guest-section .right-arrow {
        right: -10px;
    }
}

.guest-section .chomas {
    width: 57px !important;
}

.guest-section .owl-stage {
    display: flex;
}

.guest-section .owl-item {
    display: flex;
    height: auto !important;
}

.guest-section .guest-content {
    flex-grow: 1;
}

.countdown-section .timer-overlay {
    position: absolute;
    top: 50%;
    left: 32%;
    transform: translate(-50%, -50%);
    z-index: 10;
    width: 100%;
    text-align: center;
}

.countdown-section .timer-title {
    font-family: 'Jawbreak';
    font-size: 36px;
    line-height: 42px;
    font-weight: 400;
    color: #374550;
    margin-bottom: 50px;
}

.countdown-section .timer-box {
    width: 180px;
    border-radius: 70px;
    padding: 70px 0px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-shadow: 19px 4px 34.6px 0px #0000001A;
}

.countdown-section .timer-box.white-box {
    background: linear-gradient(180deg, #FFFFFF 0%, #FAF7F2 100%);
    color: #374550;
    position: relative;
    z-index: 1;
}

.countdown-section .timer-box.white-box::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: 70px;
    background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: -1;
}

.countdown-section .timer-box.pink-box {
    background: #E0A3B1;
    color: #FFFFFF;
}

.countdown-section .timer-box h2 {
    font-family: 'Albert';
    font-weight: 900;
    font-size: 46px;
}

.countdown-section .timer-box p {
    font-family: 'Albert';
    font-weight: 700;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 2px;
    margin-bottom: 0;
}

.countdown-section .left-area {
    min-height: 500px;
    background: #FAF7F2;
}

.countdown-section .right-img {
    min-height: 500px;
    background-size: cover;
    background-position: center;
    background-image: url("../images/baksy.svg");
}

@media (max-width: 1300px) {
    .countdown-section .timer-overlay {
        left: 37%;
    }
}

@media (max-width: 1099px) {
    .countdown-section .timer-overlay {
        left: 42%;
    }
}

@media (max-width: 991px) {
    .countdown-section .timer-overlay {
        left: 50%;
    }
}

@media (max-width: 568px) {
    .countdown-section .timer-box {
        width: 145px;
        padding: 60px 0px;
    }

    .countdown-section .left-area {
        min-height: 300px;
    }

    .countdown-section .right-img {
        min-height: 300px;
    }

    .guest-section {
        padding: 50px 20px;
    }
}




.center-cards-section {
    background: #FAF7F2;
    padding: 60px 20px;
    position: relative;
}

.center-cards-section .center-image-wrapper {
    width: 100%;
    max-width: 570px;
    margin: 0 auto;
    position: relative;
    z-index: 5;
}

.center-cards-section .center-image-img {
    width: 100%;
    object-fit: cover;
}

.center-cards-section .overlay-card {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 530px;
    padding: 47px 32px;
    border-radius: 20px;
    text-align: center;
    z-index: 10;
    background: linear-gradient(270deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
}

.center-cards-section .overlay-card::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: 20px;
    background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: -1;
}

.center-cards-section .overlay-card h4 {
    font-family: 'Jawbreak';
    font-weight: 400;
    font-size: 36px;
    line-height: 42px;
    color: #374550;
    margin-bottom: 18px;
}

.center-cards-section .pink-btn {
    display: inline-block;
    padding: 10px 18px;
    background: #E0A3B1;
    color: #FFFFFF;
    border-radius: 30px;
    text-decoration: none;
    font-family: 'Albert';
    font-weight: 800;
    font-size: 18px;
    line-height: 24px;
    color: #FFFFFF;
}

.center-cards-section .pink-btn:hover {
    color: #FFFFFF;
}

.center-cards-section .left-card {
    left: 47%;
    transform: translate(-115%, -50%);
}

.center-cards-section .right-card {
    right: 47%;
    transform: translate(115%, -50%);
}

@media(max-width: 1340px) {
    .center-cards-section .overlay-card {
        width: 480px;
    }
}

@media(max-width: 1205px) {
    .center-cards-section .overlay-card {
        width: 450px;
    }
}

@media(max-width: 1137px) {
    .center-cards-section .overlay-card {
        width: 400px;
        padding: 47px 10px;
    }
}

@media(max-width: 992px) {
    .center-cards-section .container-fluid.position-relative {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 30px;
    }

    .center-cards-section .overlay-card::before {
        opacity: 0;
    }

    .center-cards-section .overlay-card {
        position: static;
        width: 100%;
        max-width: 500px;
        transform: none !important;
        padding: 30px 20px;
    }

    .center-cards-section .left-card {
        left: auto;
        right: auto;
    }

    .center-cards-section .right-card {
        left: auto;
        right: auto;
    }

    .center-cards-section .center-image-wrapper {
        max-width: 500px;
        width: 100%;
    }

    .center-cards-section .left-card {
        order: 1;
        position: relative;
        z-index: 1;
    }

    .center-cards-section .left-card::before {
        content: "";
        position: absolute;
        inset: 0;
        padding: 2px;
        border-radius: 20px;
        background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
        -webkit-mask:
            linear-gradient(#fff 0 0) content-box,
            linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
        pointer-events: none;
        z-index: -1;
        opacity: 1;
    }

    .center-cards-section .center-image-wrapper {
        order: 2;
    }

    .center-cards-section .right-card {
        order: 3;
        position: relative;
        z-index: 1;
    }

    .center-cards-section .right-card::before {
        content: "";
        position: absolute;
        inset: 0;
        padding: 2px;
        border-radius: 20px;
        background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
        -webkit-mask:
            linear-gradient(#fff 0 0) content-box,
            linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
        pointer-events: none;
        z-index: -1;
        opacity: 1;
    }
}



.featured-products-section {
    padding: 45px 0px;
    background: #FFFFFF;
    text-align: center;
}

.featured-products-section .product-title {
    font-family: 'Jawbreak';
    font-weight: 400;
    font-size: 36px;
    line-height: 42px;
    color: #374550;
    margin-bottom: 45px;
}

.featured-products-section .vi-mo-pro {
    border-radius: 30px;
    padding: 10px 18px;
    background: #E0A3B1;
    display: inline-block;
    margin-top: 45px;
    text-align: center;
    font-family: 'Albert';
    font-weight: 800;
    font-size: 18px;
    line-height: 24px;
    color: #FFFFFF;
    text-decoration: none;
    text-transform: uppercase;
}

.featured-products-section .products-row {
    width: 100%;
    padding: 0 40px;
}

.featured-products-section .product-card {
    width: calc(20% - 20px);
    border-radius: 16px;
    overflow: hidden;
    position: relative;
    text-align: center;
}

.featured-products-section .product-card img {
    width: 80%;
    height: 300px;
    object-fit: cover;
    border-radius: 15px;
}

.featured-products-section .product-info {
    background: #FAF7F2;
    padding: 22px 25px;
    border-radius: 17px;
    position: absolute;
    top: 57%;
    left: 0%;
    width: 100%;
    z-index: 6;
}

.featured-products-section .product-info h5 {
    font-family: 'Jawbreak';
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    color: #000000;
    text-align: left;
}

.featured-products-section .product-info p {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    text-align: left;
    margin-bottom: 0;
}

@media(max-width: 1400px) {
    .featured-products-section .product-card {
        width: calc(25% - 20px);
    }

    .featured-products-section .products-row {
        padding: 0 20px;
    }
}

@media(max-width: 1200px) {
    .featured-products-section .product-card {
        width: calc(33.33% - 20px);
    }

    .featured-products-section .products-row {
        padding: 0 20px;
    }
}

@media(max-width: 992px) {
    .featured-products-section .product-card {
        width: calc(50% - 20px);
    }

    .featured-products-section .products-row {
        padding: 0 20px;
    }
}

@media(max-width: 568px) {
    .featured-products-section .product-card {
        width: 100%;
    }

    .featured-products-section .products-row {
        padding: 0 20px;
    }
}



/* login */

.login-section {
    background: #FAF7F2;
    padding: 0;
}

.login-section .left-area {
    background: #FAF7F2;
    min-height: 100vh;
    padding: 40px 20px;
}

.login-section .login-box {
    background: #FFFFFF;
    padding: 35px 43px;
    border-radius: 17px;
    max-width: 500px;
    width: 100%;
    position: relative;
    z-index: 1;
}

.login-section .login-box::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: 17px;
    background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: -1;
    opacity: 1;
}

.login-section .login-box.forgo {
    max-width: 610px;
}

.login-section .login-box.forgo .back-row {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.login-section .login-box.forgo .invalid-section {
    border-radius: 14px;
    padding: 17px 30px;
    border-left-width: 2px;
    background: #FFDBD854;
    border-left: 2px solid #E0A3B1;
    font-family: 'Albert';
    font-weight: 400;
    font-style: italic;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.login-section .login-box.forgo .otp-wrapper {
    display: flex;
    gap: 12px;
    width: 100%;
}

.login-section .login-box.forgo .otp-input {
    flex: 1 1 0;
    min-width: 40px;
    max-width: 80px;
    height: 65px;
    background: #FAF7F2;
    border: 1px solid #BCBCBC;
    border-radius: 6px;
    text-align: center;
    font-family: 'Albert';
    font-weight: 600;
    font-size: 18px;
    line-height: 24px;
    color: #374550;
    outline: none;
}

.login-section .login-box.forgo .otp-input:focus {
    border-color: #E0A3B1;
}

@media (max-width: 480px) {
    .login-section .login-box.forgo .otp-wrapper {
        max-width: 360px;
        gap: 10px;
        padding: 0 5px;
    }

    .login-section .login-box.forgo .otp-input {
        height: 40px;
        min-width: 32px;
        max-width: 60px;
    }
}


.login-section .login-title {
    font-family: 'Jawbreak';
    font-weight: 400;
    font-size: 30px;
    line-height: 36px;
    margin-bottom: 5px;
    color: #374550;
}

.login-section .login-sub {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.login-section .custom-input {
    background: #FAF7F2;
    border: none;
    padding: 15px;
    border-radius: 6px;
}

.login-section .custom-input:focus {
    box-shadow: none;
    background: #FAF7F2;
}

.password-icon {
    position: absolute;
    right: 15px;
    top: 50%;
    width: 20px;
    height: 20px;
    transform: translateY(-50%);
    cursor: pointer;
    z-index: 11;
}

.login-section .custom-input::placeholder {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #AAAAAA;
}

.login-section .forgot-link {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #E0A3B1;
    text-decoration: none;
}

.login-section .forgot-link:hover {
    color: #E0A3B1;
}

.login-section .login-btn {
    width: 100%;
    padding: 15px 18px;
    border: none;
    background: #E0A3B1;
    font-family: 'Albert';
    font-weight: 800;
    font-size: 18px;
    line-height: 24px;
    color: #FFFFFF;
    border-radius: 30px;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.login-section .signup-text {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    margin-bottom: 0;
}

.login-section .signup-text a {
    font-weight: 700;
    text-decoration: none;
    color: #000000;
}

.login-section .right-image {
    height: 100dvh;
}

.login-section .full-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.login-section .hide-eye {
    display: none;
}

.password-group .custom-input {
    padding-right: 50px;
}

@media (max-width: 991px) {
    .login-section .right-image {
        display: none;
    }
}

@media (max-width: 468px) {
    .login-section .login-box {
        padding: 30px 25px;
    }
}



/* official rules */

.bg-container {
    position: relative;
    width: 100%;
    height: 389px;
    overflow: hidden;
}

.bg-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.rules-wrapper {
    margin: -175px auto 50px;
    position: relative;
    z-index: 10;
}

.rules-box {
    background: #FFFFFF;
    padding: 35px 43px;
    border-radius: 17px;
    position: relative;
    z-index: 1;
}

.rules-box::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: 17px;
    background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: -1;
    opacity: 1;
}

.rules-box h2 {
    font-family: 'Jawbreak';
    font-weight: 400;
    font-size: 30px;
    line-height: 36px;
    color: #374550;
    margin-bottom: 5px;
}

.rules-box h3{
    font-family: 'Albert';
    font-weight: 700;
    font-size: 24px;
    line-height: 30px;
    color: #374550;
    margin-bottom: 25px;
}

.rules-box h4 {
   font-family: 'Albert';
    font-weight: 700;
    font-size: 18px;
    line-height: 24px;
    color: #000000;
}

.rules-box p{
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.rules-box p span{
    font-weight: 600;
}

@media (max-width: 576px) {
    .rules-box {
        padding: 25px;
    }
}

.sub-p{
    font-family: 'Albert';
    font-weight: 600;
    font-style: italic;
    font-size: 16px;
    line-height: 22px;
    color: #374550;
    margin-bottom: 15px;
}

.sub-des{
    font-family: 'Albert';
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    margin-bottom: 5px;
}

.sub-desbold{
    font-family: 'Albert';
    font-weight: 600;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    margin-bottom: 15px;
}

.rules-box ul li{
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.rules-box ul li span{
    font-weight: 600;
}

.rules-box p a{
    font-family: 'Albert';
    font-weight: 600;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    text-decoration: none;
    word-break: break-word;
}

.rules-box .sub-e{
    font-style: italic;
    font-weight: 400;
}

.email-box {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #E0A3B1; 
    padding: 8px;
    border-radius: 5px;
}

.email-box a {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #FFFFFF;
    text-decoration: none;
    word-break: break-word;
}

.mail-icon {
    width: 16px;
    height: 16px;
}


/* faq */

.faq-box {
    background: #FFFFFF;
    padding: 35px 43px;
    border-radius: 17px;
    position: relative;
    z-index: 1;
}

.faq-box::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: 17px;
    background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: -1;
    opacity: 1;
}

.faq-box h3 {
    font-family: 'Jawbreak';
    font-weight: 400;
    font-size: 30px;
    line-height: 36px;
    color: #374550;
    margin-bottom: 15px;
}

.custom-acc .accordion-item {
    background: #FAF7F2;
    border: none;
    margin-bottom: 15px;
    border-radius: 10px;
    overflow: hidden;
}

.custom-acc .accordion-button {
    background: #e0a3af; 
    padding: 18px;
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.accordion-button:focus{
    box-shadow: none;
}

.custom-acc .accordion-button:not(.collapsed) {
    background: #E0A3B1; 
    color: #fff;
    box-shadow: none;
}

.custom-acc .accordion-button::after {
    background-image: url("../images/minus.svg");
}

.custom-acc .accordion-button.collapsed {
    background: #FAF7F2;
}

.custom-acc .accordion-button.collapsed::after {
    background-image: url("../images/plus.svg");
}

.custom-acc .accordion-body {
    background: #FAF7F2;
    padding: 18px;
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    border-left: 2px solid #E0A3B1;
}

.custom-acc .accordion-body span{
    font-weight: 600;
}

@media (max-width: 576px) {
    .faq-box {
        padding: 25px;
    }
}


/* prize-details */

.header-box {
    padding: 25px;
    border-radius: 12px;
    margin-top: 130px;
    position: relative;
    z-index: 1;
    background: #FFFFFF;
}

.header-box::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: 17px;
    background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: -1;
    opacity: 1;
}

.heading-title {
    font-family: 'Jawbreak';
    font-size: 30px;
    line-height: 36px;
    font-weight: 400;
    color: #374550;
    margin-bottom: 10px;
}

.heading-desc {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    margin-bottom: 0;
}

.heading-desc span{
    font-weight: 600;
}

.package-card {
    position: relative;
    border-radius: 13px;
    overflow: hidden;
    margin-bottom: 25px;
}

.package-bg {
    position: absolute;
    inset: 0;          
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

.package-content {
    position: relative;
    z-index: 1;
    background: #FFFFFFA6;
    backdrop-filter: blur(8px);
    padding: 20px;
    border-radius: 18px;
    margin: 20px;       
    max-width: 699px;
}

.package-content.righty {
    margin-left: auto;
    margin-right: 20px;
}

.package-content::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: 17px;
    background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: -1;
    opacity: 1;
}

.top-strip {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    background: #E0A3B1;
    padding: 15px;
    border-radius: 5px;
    color: #fff;
    margin-bottom: 15px;
}

.left-label {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #FFFFFF;
}

.right-price {
    font-family: 'Jawbreak';
    font-size: 30px;
    line-height: 36px;
    font-weight: 400;
    color: #FAF7F2;
}

.right-price span{
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #FFFFFF;
}

.package-content p {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #374550;
    margin-bottom: 12px;
}

.package-content p span{
    font-weight: 600;
}

.package-content ul li {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #374550;
}

.package-content h2{
    font-family: 'Albert';
    font-weight: 700;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    margin-bottom: 1px;
}

.grey-box{
    background: #FAF7F2;
    padding: 19px;
}

.grey-box ul li{
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.grey-box p{
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.grey-box p span{
    font-weight: 600;
}

@media (max-width: 992px) {
    .package-content.righty {
        margin-left: 20px;
    }
}


.faq{
    background: #FAF7F2;
}

.official{
    background: #FAF7F2;
}

.privacy{
    background: #FAF7F2;
}

.shipping{
    background: #FAF7F2;
}

.return{
    background: #FAF7F2;
}

.prize-detail{
    background: #FAF7F2;
}

.our-story{
    background: #FAF7F2;    
}

.contact-us{
    background: #FAF7F2; 
}

.shop{
    background: #FAF7F2; 
}

.product-detail{
    background: #FAF7F2; 
}



/* our story */

.section-title {
    font-family: 'Jawbreak';
    font-size: 30px;
    font-weight: 400;
    color: #374550;
    margin-bottom: 14px;
}

.yellow-box {
    background: #FFFFFF;
    padding: 35px 43px;
    border-radius: 17px;
    position: relative;
    z-index: 1;
}

.yellow-box::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: 12px;
    background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

.yellow-box p{
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.yellow-box p span{
    font-weight: 600;
}

.yellow-box ul li{
     font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.small-note {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #FFFFFF;
    background: #E0A3B1;
    padding: 10px;
    text-align: center;
    margin-top: -20px;
    position: relative;
    z-index: 111;
}

.bigu{
     font-family: 'Albert';
    font-weight: 600;
    font-size: 18px;
    line-height: 24px;
    color: #000000;
}

.big-image img {
    width: 100%;
    border-radius: 17px;
    object-fit: cover;
}

.pisu{
    padding: 25px 20px;
}

.pisu p{
     font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

@media (max-width: 768px) {
    .small-note {
        margin-top: 25px;
    }
}

@media (max-width: 576px) {
    .yellow-box {
        padding: 25px;
    }
}



/* contact-us */

.contact-hero {
    position: relative;
    width: 100%;
    height: 389px;
    overflow: hidden;
}

.contact-hero .hero-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-title {
    position: absolute;
    left: 50%;
    top: 66%;
    transform: translate(-50%, -50%);
     font-family: 'Albert';
    font-weight: 600;
    font-size: 30px;
    color: #FAF7F2;
    text-transform: uppercase;
}

.cot-box{
    margin: -105px auto 80px;
    position: relative;
    z-index: 10;
}

.contact-box {
    background: #fff;
    padding: 35px 43px;
    border-radius: 17px;
    position: relative;
}

.contact-box::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: 17px;
    background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

.box-title {
    font-family: 'Jawbreak';
    font-size: 30px;
    font-weight: 400;
    margin-bottom: 6px;
    color: #374550;
}

.box-subtitle {
     font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 15px;
    color: #374550;
    margin-bottom: 15px;
}

.contact-item p{
     font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    margin-bottom: 0;
        word-break: break-word;
}

.contact-item p a{
     font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.contact-item p span{
    font-weight: 600;
}

.social-title {
     font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

hr {
    background-color: #E0A3B1;
    opacity: 1;
}

.contact-input {
    background: #FAF7F2;
    border: none;
    padding: 18px;
    border-radius: 6px;
}

.contact-input:focus{
    box-shadow: none;
    background: #FAF7F2;
}

.contact-input::placeholder{
     font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #AAAAAA;
}

.pink-btn {
    background: #E0A3B1;
    border: none;
    padding: 15px 18px;
    border-radius: 30px;
     font-family: 'Albert';
    font-weight: 800;
    font-size: 18px;
    line-height: 24px;
    color: #FFFFFF;
}

@media (max-width: 768px) {
    .hero-title { 
        font-size: 25px;
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 576px) {
    .contact-box {
        padding: 25px;
    }
    .pink-btn {
        font-size: 16px;
    }
}



/* shop */

.filter-box .filter-title {
     font-family: 'Jawbreak';
    font-size: 18px;
    font-weight: 400;
    color: #374550;
    margin-bottom: 0;
}

.filter-box .clear-link {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    text-decoration: none;
}

.filter-box .clear-link:hover{
    color: #000000;
}

.filter-box .form-label{
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.filter-box .form-select{
    background-color: #FFFFFF;
    border: none;
    padding: 16px;
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    border-radius: 6px;
}

.filter-box .form-select:focus{
    box-shadow: none;
}

.filter-box .pato{
    background: #FFFFFF;
    padding: 11px;
    text-align: center;
    font-family: 'Albert';
    font-weight: 700;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    text-transform: uppercase;
}

.filter-box .price-pato{
    background: #FFFFFF;
    padding: 10px;
    width: 100%;
}

.filter-box .price-pato .from-fil{
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    margin-bottom: 5px;
}

.filter-box .price-pato .price-aank{
    font-family: 'Albert';
    font-weight: 700;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.filter-box .apply-btn {
    background: #E0A3B1;
    padding: 15px 18px;
    border-radius: 30px;
    border: none;
    font-family: 'Albert';
    font-weight: 800;
    font-size: 18px;
    line-height: 24px;
    color: #FFFFFF;
}

.filter-box .bonus-section {
    background: #FFFFFF;
    padding: 0;
}

.product-card {
    background: #FFFFFF;
    border-radius: 17px;
    padding: 22px 34px;
}

.product-img {
    width: 100%;
    height: 322px;
    border-radius: 16px;
    margin-bottom: 10px;
    object-fit: cover;
}

.product-title {
    font-family: 'Jawbreak';
    font-size: 18px;
    font-weight: 400;
    color: #000000;
    margin-bottom: 5px;
    letter-spacing: 0.5px;
}

.product-price {
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    margin: 0;
}

.view-more-btn {
    background: #E0A3B1;
    border: none;
    color: #FFFFFF;
    padding: 15px 18px;
    border-radius: 30px;
    font-family: 'Albert';
    font-weight: 800;
    font-size: 18px;
    line-height: 24px;
    text-transform: uppercase;
}

@media (min-width: 1400px) {
    .col-xxl-2-4 {
        flex: 0 0 auto;
        width: 20%;
    }
}

@media (max-width: 768px) {
    .product-card {
        background: #FFFFFF;
        border-radius: 17px;
        padding: 16px 16px;
    }
}

.all-page{
    padding-top: 40px;
    padding-bottom: 90px;
}

/* .scroll-left {
    height: calc(100vh - 180px); 
    overflow-y: auto;
}

.scroll-right {
    height: calc(100vh - 180px); 
    overflow-y: auto;
}

.scroll-left::-webkit-scrollbar,
.scroll-right::-webkit-scrollbar {
    width: 6px;
}

.scroll-left::-webkit-scrollbar-thumb,
.scroll-right::-webkit-scrollbar-thumb {
    background: #d3d3d3;
    border-radius: 10px;
}

@media(max-width: 992px) {
    .scroll-left,
    .scroll-right {
        height: auto;
        overflow: visible;
    }
} */


.size-wrap input,
.stock-wrap input {
    display: none;
}

.size-wrap input:checked + .size-btn,
.stock-wrap input:checked + .pato {
    background: #E0A3B1;
    color: #FFFFFF;
}

.size-wrap {
    cursor: pointer;
    display: inline-block;
}

.filter-box .size-btn {
    background: #FFFFFF;
    padding: 10px;
    cursor: pointer;
    font-family: 'Albert';
    font-weight: 700;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    width: 48px;      
    height: 45px;         
    display: flex;     
    align-items: center;
    justify-content: center;
    text-align: center;
}

.stock-wrap {
    cursor: pointer;
    width: 100%;
}

.stock-wrap {
    cursor: pointer;
    width: 100%;
}



/* product-detail */

.detuls{
    padding-top: 11rem;
    padding-bottom: 4rem;
}

.main-slider-wrapper {
    position: relative;
}

.arrow-btn {
    width: 42px;
    height: 42px;
    background: transparent;
    border: none;
    position: absolute;
    top: 40%;
    transform: translateY(-50%);
    z-index: 5;
    cursor: pointer;
}

.arrow-left {
    left: -40px; 
}

.arrow-right {
    right: 0px;
}

.main-img {
    width: 100%;
    height: 519px;
    object-fit: cover;
    border-radius: 16px;
}

.thumb-img {
    border-radius: 16px;
    height: 121px;
    object-fit: cover;
    cursor: pointer;
}


.slide-product-card{
    background: #FFFFFF;
    padding: 22px 34px;
    border-radius: 17px;
    position: relative;
    z-index: 1;
}

.slide-product-card::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: 11px;
    background: linear-gradient(228.66deg, #A17000 17.51%, #FFEA95 47.93%, #A17000 94.99%);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: -1;
}

.slide-product-card .product-title{
    font-family: 'Jawbreak';
    font-size: 46px;
    font-weight: 400;
    color: #374550;
    margin-bottom: 0;
}

.slide-product-card .product-price{
    font-family: 'Albert';
    font-weight: 600;
    font-size: 18px;
    line-height: 24px;
    color: #000000;
    margin-bottom: 10px;
}

.color-choice{
    font-family: 'Albert';
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    color: #000000;
}

.select-size{
    font-family: 'Albert';
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    color: #000000;
    margin-bottom: 8px;
}

.slide-product-card .size-box{
    max-width: 350px;
}

.slide-product-card .size-btn {
    background: #FAF7F2;
    padding: 10px;
    cursor: pointer;
    font-family: 'Albert';
    font-weight: 700;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
    width: 48px;      
    height: 45px;         
    display: flex;     
    align-items: center;
    justify-content: center;
    text-align: center;
}



.qty-btn {
    background: #E0A3B1;
    border: none;
    border-radius: 30px;
    padding: 15px 19px;
    font-family: 'Albert';
    font-weight: 800;
    font-size: 18px;
    line-height: 24px;
    color: #FFFFFF;
}

.qty-input {
    width: 48px;
    padding: 10px;
    text-align: center;
    border: none;
    background: #D9D9D9;
}

.qty-input:focus-visible{
    border: none;
    outline: none;
}

.slide-product-card .add-cart-btn {
    width: 100%;
    padding: 15px 18px;
    background: #E0A3B1;
    border-radius: 30px;
    border: none;
    font-family: 'Albert';
    font-weight: 800;
    font-size: 18px;
    line-height: 24px;
    color: #FFFFFF;
}

.summary-box{
    background: #FFFFFF;
    padding: 22px;
}

.summary-box p{
    font-family: 'Albert';
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.summary-box p span{
    font-weight: 600;
}

.owl-carousel .owl-stage-outer{
    border-radius: 16px;
}

@media (max-width: 576px) {
    .slide-product-card {
        padding: 25px;
    }
    .owl-carousel.main-slider{
        padding: 12px;
    }
    .arrow-left {
        left: -15px;
    }
    .arrow-right{
        right: 11px;
    }
}

.main-img {
    width: 100%;
    border-radius: 10px;
}

.thumb-row img {
    width: 100%;
    max-width: 90px;
    border: 2px solid transparent;
    cursor: pointer;
    border-radius: 6px;
}

.thumb-row img.active-thumb {
    border-color: #E0A3B1;
}

.color-wrapper .color-dots {
    display: flex;
    gap: 15px;
    margin-top: 15px;
    margin-bottom: 5px;
}

.color-wrapper .color-dots input {
    display: none;
}

.color-wrapper .dot {
    width: 37px;
    height: 37px;
    display: inline-block;
    border-radius: 50%;
    cursor: pointer;
    border: 2px solid #FAF7F2;
    transition: 0.2s ease;
}

.color-wrapper .color-gray { background: #D9D9D9; }
.color-wrapper .color-black { background: #000000; }
.color-wrapper .color-blue { background: #02629E; }

.color-wrapper input:checked + .dot {
    border: 6px solid #FAF7F2;
    padding: 1px;
}