@charset "UTF-8";
@import 'tailwind-base.out.css';

:root{
    --flash-max-width:1920px;
}

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

a{
    text-decoration:none;
}

body {
    font-family: "Chivo", sans-serif;
    overflow-x: hidden;
}

h2, h3, h4{
    font-weight:700;
    line-height:1.2;
    color:#2A2A29;
}

h1{
    font-size:32px;
    font-weight:500;
    line-height:1.2;
    color:#2A2A29;
}
strong{
    font-weight:900;
}

h2{
    font-size:26px;
}

h3{
    font-size:19px;
}

h4{
    font-size:18px;
}

p{
    font-size:19px;
    font-weight:400;
    color:#2A2A29;
}

.flash-max-width{
    max-width:var(--flash-max-width);
}

.flash-pbase{
    padding-left:26px;
    padding-right:26px;
}


.flash-header{
    background-color:#fff;
}

.flash-header .actions {
    display: flex;
    gap: 10px;
}

.flash-header, .flash-header header{
    position:relative;
}

.flash-header header {
    color: white;
    height: 174px;
    z-index: 1000;
}
.flash-header .flash-logo{
    height:auto;
}

.flash-header .flash-logo img {
    display: block;
    width:188px;
    height: auto;
    max-width: 100%;
}

.flash-header .flash-hamburger {
    gap: 5px;
    cursor: pointer;
    background-color:#BE1522;
    padding:12px;
    z-index: 1002;
    border-radius:999px;
    box-shadow: 0px 7.33px 7.33px 0px #00000040;

}
.flash-header .flash-hamburger svg {
    width:33px;
    height:33px;
}
.flash-header nav {
    gap: 20px;
    z-index:1;
}

.flash-header .flash-menu {
    gap: 27px;
}

.flash-header .flash-menu a,
.flash-header .flash-actions {
    color: #000;
    text-decoration: none;
    background: none;
    border: none;
    cursor: pointer;
    font-family:'Chivo', sans-serif;
    font-size:20px;
    font-weight:400;
}

.flash-header .flash-actions {
    gap: 10px;
}

/* Overlay */
.flash-header .flash-overlay {
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: rgba(173, 173, 173, 0.5);
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
    z-index: 1000;
}

.flash-header .flash-overlay.active {
    opacity: 1;
    visibility: visible;
}

/* Panel lateral */
.flash-header .flash-mobile-menu {
    position: fixed;
    top: 0;
    right: -70%;
    width: 70%;
    height: 100%;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    padding: 30px 20px;
    gap: 20px;
    transition: right 0.3s ease;
    z-index: 1001;
}

.flash-header .flash-mobile-menu.active {
    right: 0;
}

.flash-header .flash-mobile-menu .flash-menu,
.flash-header .flash-mobile-menu .flash-actions {
    flex-direction: column;
}

.flash-header .flash-mobile-menu a,
.flash-header .flash-mobile-menu button {
    width: 100%;
    text-align: left;
}

.flash-header .flash-close-btn {
    position: absolute;
    top: 20px;
    right: 20px;
    cursor: pointer;
    z-index: 1002;
}
.flash-header .flash-close-btn svg {
    width: 24px;
    height: 24px;
}



.btn {
    padding: 4px 24px;
    font-weight: 400;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 17px;
    border-radius:4px;
}

.btn-primary {
    background-color: #BE1522;
    color: #fff;
}
.btn-cta{
    font-size:16px;
}





.main {
    background-color: rgba(255, 255, 255, 0.75);
}


.flash-welcome-info h1  {
    margin-bottom: 12px;
}
.flash-welcome-info p{
    font-size:18px;
}

.flash-welcome-info-btn{
    display:inline-flex;
    margin-top:12px;
}
.flash-welcome{
    padding-top:24px;
    padding-left:45px;
    padding-right:45px;
    row-gap:42px;
}








.flash-service-container{

}
.flash-service-block{
    width:50%;
}

.flash-service-container .flash-part{
    padding-top:44px;
    padding-bottom:55px;
}

.flash-service-title, .flash-testimonials-title{
    padding:0px 26px;
}

.flash-service-container .flash-part .flash-service-title, 
.flash-testimonials-container .flash-testimonials .flash-testimonials-title{
    margin-bottom:36px;
    column-gap:54px;
}
.flash-service-container .flash-part .flash-service-title h2, 
.flash-testimonials-container .flash-testimonials .flash-testimonials-title h2{
    font-size:32px;
}
.flash-service-container .flash-part .flash-service-title p, 
.flash-testimonials-container .flash-testimonials .flash-testimonials-title p{
    font-size:16px;
}

.flash-service-block-container{
    column-gap:25px;
    row-gap:25px;
    margin:0px 32px; 
}

.flash-service-block-container .flash-service-block{
    padding:28px 24px;
    border-radius:22.1px;
    width:100%;
}

.flash-service-block-container .flash-service-block.special{
    background-color:#BE1522;
    border:2px solid #000;
}
.flash-service-block-container .flash-service-block.special *{
    color:#FFF!important;
}
.flash-service-block-container .flash-service-block.normal{
    background-color:#fff;
    border:2px solid #000;
    border-bottom-width:6px;
    border-bottom-color: #BE1522;
}
.flash-service-block-container .flash-service-block .part-block-img{
    position:relative;
}

.flash-service-block-container .flash-service-block .part-block-img img{
    width:100%;
    height:auto;
    aspect-ratio:1/1;
}
.flash-service-block-container .flash-service-block .part-block-desc h3{
    font-size:26px;
    margin-bottom:6px;
    line-height:100%;
}
.flash-service-block-container .flash-service-block .part-block-desc p{
    font-size:13px;
}


.flash-cta-container{
    padding:42px 8px;
}

.flash-cta-container .flash-cta {
    display: flex;
    justify-content: initial;
    flex-direction:column-reverse;
    background: #f5f5f5;
    border-radius: 20px;
    padding: 23px 22px;
    margin: auto;
    gap: 20px;
}

.flash-cta-container .cta-text {
    flex: 1;
}

.flash-cta-container .cta-text h2 {
    font-size: 26px;
    margin-bottom: 6px;
    color: #000;
}

.flash-cta-container .cta-text p {
    font-size: 14px;
    margin-bottom: 12px;
    color: #000;
}

.flash-cta-container .cta-image {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    position:relative;
}

.flash-cta-container .cta-image img {
    max-width: 70%;
    height: auto;
    position:relative;
    top:-30px;
}


.flash-testimonials-container{
    
}

.flash-testimonials-container .testimonials {
    display: flex;
}
.flash-testimonials-container .card{
    width:80%;
    padding:16px 20px;
    display:flex;
    align-items:center;
    justify-content:center
}

.flash-testimonials-container .card p {
    font-size:16px;
    color:#FFF;
}
.flash-testimonials-container .name {
    font-weight: bold;
    font-size:16px;
    margin-top: 15px;
}
.flash-testimonials-container .stars {
    color: #ffd700;
    font-size: 12px;
    margin-top: 5px;
}

.flash-testimonials-container{

}

.flash-testimonials-container .swiper-testimonials{
    overflow:hidden;
}

.flash-testimonials-container .swiper-space{
    padding:0px 32px;
}








.flash-trust-container{

}
.flash-trust-container .flash-trust{
    padding:48px 45px;
}

.flash-trust .flash-trust-dist{
    row-gap:48px;
    column-gap:24px;
    padding-top:42px;
    justify-content: center;
}

.flash-trust .flash-trust-dist img{
    width:128px;
}




.flash-trust .flash-trust-dist .dist-loreal{
    width:120px;
}
.flash-trust .flash-trust-dist .dist-dior{
    width:82px;
}
.flash-trust .flash-trust-dist .dist-lancome{
    width:120px;
}
.flash-trust .flash-trust-dist .dist-kiehls{
    width:120px;
}
.flash-trust .flash-trust-dist .dist-clinique{
    width:120px;
}
.flash-trust .flash-trust-dist .dist-biotherm{
    width:99px;
}




@media (min-width:660px){

    .flash-cta-container .cta-text h2 {
        font-size: 26px;
        margin-bottom: 6px;
    }

    .flash-cta-container .cta-text p {
        font-size: 14px;
        margin-bottom: 6px;
    }
    .flash-cta-container .flash-cta{
        flex-direction:row;
    }
    .flash-cta-container .cta-image img {
        max-width: 80%;
        height: auto;
        position:absolute;
        top:-30px;
    }
}




@media (min-width:768px){


    .flash-pbase{
        padding-left:40px;
        padding-right:40px;
    }

    .flash-welcome{
        padding:40px;
    }

    .flash-service-container .flash-part{
        padding-top:41px;
        padding-bottom:32px;
    }



    .flash-service-block-container .flash-service-block .part-block-desc h3{
        font-size:30px;
    }
    .flash-service-block-container .flash-service-block .part-block-desc p{
        font-size:18px;
    }

    .flash-cta-container{
        padding:90px 48px;
    }
    .btn {
        border-radius:6px;
    }

    .flash-testimonials-container .card {
        flex:1;
        background-color: #c91b27;
        color: white;
        padding:120px 20px;
        border-radius: 64px;
        box-sizing: border-box;
        text-align: center;
    }
    .flash-testimonials-container .card {
        flex:1;
        height:auto;
    }
    .flash-testimonials-container .swiper-space{
        padding:0px 64px;
    }

    .flash-service-block-container .flash-service-block.special{
        border:3px solid #000;
    }
    .flash-service-block-container .flash-service-block.normal{
        border:3px solid #000;
        border-bottom-width:14px;
        border-bottom-color: #BE1522;
    }
    
    .flash-cta-container .cta-text h2 {
        font-size: 32px;
        margin-bottom: 15px;
    }

    .flash-cta-container .cta-text p {
        font-size: 24px;
        margin-bottom: 20px;
    }
    .flash-trust .flash-trust-dist{
        justify-content:center;
    }

    .footer-center nav{
        display:flex;
        flex-direction: column;
    }

}

@media (min-width:1024px){
    .flash-pbase{
        padding-left:80px;
        padding-right:80px;
    }
    .footer-bottom {
        padding: 10px 80px;
    }
    .flash-service-container .flash-part{
        padding-top:41px;
        padding-bottom:32px;
    }

    .flash-header{
        border-bottom:4px solid #BE1522;
    }
    .flash-welcome {
        padding: 24px 56px 24px 56px;
        gap: 42px;
    }    
    .flash-welcome-info-btn{
        display:inline-flex;
        margin-top:44px;
    }
    .flash-welcome-info p{
        font-size:28px;
        line-height:1.2;
    }
    .flash-welcome-info h1  {
        margin-bottom: 24px;
    }

    .flash-service-block-container{
        column-gap:24px;
        row-gap:24px;
        padding:32px 0px;
    }

    .flash-service-block-container .flash-service-block{
        width:100%;
    }
    .flash-service-block-container .flash-service-block{
        width:calc(50% - 16px)
    }
    h1{
        font-size:42px;
    }
    
    h2{
        font-size:36px;
    }
    
    h3{
        font-size:26px;
    }
    
    h4{
        font-size:18px;
    }
    
    p{
        font-size:24px;
    }
    .btn {
        font-size: 30px;
        border-radius:6px;
    }
    
    .flash-header .flash-logo img {
        width:280px;
    }


    .flash-trust-container .flash-trust{
        padding:48px 24px;
    }
    .flash-trust .flash-trust-dist{
        column-gap:80px;
        padding-top:42px;
    }



    .footer {
        padding: 64px 90px 74px 217px;
    }
    footer{
        margin-top:280px;
    }
    .footer {
        padding: 32px 50px;
    }
    .footer-left {
    }
    .footer-left img{
        max-width: 312px;
    }
    .footer-left p {
        margin: 0 0 15px 0;
        font-size: 24px;
    }
    .social-icons a {
        font-size: 24px;
    }
    .footer-center nav a {
        margin: 0 15px;
        font-size: 24px;
    }
    .footer-right {
        font-size: 24px;
        line-height: 1.6;
    }
    .footer-bottom {
        font-size: 12px;
        padding: 10px 0px;
    }

    .flash-trust .flash-trust-dist .dist-loreal{
        width:143px;
    }
    .flash-trust .flash-trust-dist .dist-dior{
        width:85px;
    }
    .flash-trust .flash-trust-dist .dist-lancome{
        width:188px;
    }
    .flash-trust .flash-trust-dist .dist-kiehls{
        width:162px;
    }
    .flash-trust .flash-trust-dist .dist-clinique{
        width:121px;
    }
    .flash-trust .flash-trust-dist .dist-biotherm{
        width:93px;
    }
    .flash-trust .flash-trust-dist img{
        width:129px;
    }


    
}

@media (min-width:1200px){
    .footer-center nav{
        display:block;
    }
    h1{
        font-size:48px;
    }
    .flash-welcome{
        padding:24px 120px 24px 120px;
        gap:64px;
    }
    .flash-welcome-info p{
        font-size:32px;
        line-height:1.2;
    }
    .flash-welcome-info h1  {
        margin-bottom: 24px;
    }
    .flash-service-block-container{
        column-gap:110px;
        row-gap:96px;
        padding:128px 30px;
    }

    .flash-service-block-container .flash-service-block{
        width:calc(50% - 60px)
    }
    .flash-service-container .flash-part{
        padding-top:41px;
        padding-bottom:32px;
    }
    .flash-service-title, .flash-testimonials-title{
        padding:0px 64px;
    }
    .flash-service-title, .flash-testimonials-title{
        padding:0px 48px;
    }

    .flash-service-container .flash-part .flash-service-title, 
    .flash-testimonials-container .flash-testimonials .flash-testimonials-title{
        margin-bottom:70px;
        column-gap:54px;
    }
    .flash-service-container .flash-part .flash-service-title h2, 
    .flash-testimonials-container .flash-testimonials .flash-testimonials-title h2{
        font-size:42px;
    }
    .flash-service-container .flash-part .flash-service-title p, 
    .flash-testimonials-container .flash-testimonials .flash-testimonials-title p{
        font-size:24px;
    }


    .flash-cta-container .flash-cta {
        justify-content: space-between;
        border-radius: 20px;
        padding: 102px 96px;
        gap: 20px;
    }

    .flash-service-block-container .flash-service-block .part-block-desc h3{
        font-size:36px;
    }
    .flash-service-block-container .flash-service-block .part-block-desc p{
        font-size:24px;
    }

    .flash-cta-container .cta-text h2 {
        font-size: 42px;
        margin-bottom: 15px;
    }

    .flash-cta-container .cta-text p {
        font-size: 28px;
        margin-bottom: 20px;
    }    
    .flash-service-block-container .flash-service-block{
        border-radius:49px;
    }
    .flash-service-block-container .flash-service-block{
        padding:64px 52px;
    }
    .flash-testimonials-container .card p {
        font-size:28px;
    }
    .flash-testimonials-container .name {
        font-size:28px;
        margin-top: 15px;
    }
    .flash-testimonials-container .stars {
        font-size: 28px;
        margin-top: 5px;
    }    
}

@media (min-width:1600px){
    /* ========== Layout, tamaños y posiciones ========== */
    .flash-header .flash-logo img {
        width:420px;
    }

    .flash-welcome {
        padding: 24px 208px 24px 120px;
        gap: 111px;
    }

    .flash-service-title, 
    .flash-testimonials-title {
        padding: 0px 209px;
    }

    .flash-cta-container .cta-image img {
        max-width: 80%;
        height: auto;
        border-radius: 10px;
        position: absolute;
        top: -200px;
    }

    .flash-trust .flash-trust-dist {
        justify-content: space-between;
    }

    .flash-trust .flash-trust-dist .dist-loreal {
        width: 204px;
    }
    .flash-trust .flash-trust-dist .dist-dior {
        width: 122px;
    }
    .flash-trust .flash-trust-dist .dist-lancome {
        width: 268px;
    }
    .flash-trust .flash-trust-dist .dist-kiehls {
        width: 232px;
    }
    .flash-trust .flash-trust-dist .dist-clinique {
        width: 174px;
    }
    .flash-trust .flash-trust-dist .dist-biotherm {
        width: 133px;
    }
    .flash-trust .flash-trust-dist img {
        width: 185px;
    }

    .flash-cta-container {
        padding: 90px 117px;
    }

    /* ========== Tipografía y márgenes relacionados con textos ========== */
    h1 {
        font-size: 51px;
    }

    .flash-welcome-info p {
        font-size: 32px;
        line-height: 1.2;
    }

    .flash-welcome-info h1 {
        margin-bottom: 24px;
    }

    .flash-service-container .flash-part .flash-service-title h2, 
    .flash-testimonials-container .flash-testimonials .flash-testimonials-title h2 {
        font-size: 52px;
    }

    .flash-service-container .flash-part .flash-service-title p, 
    .flash-testimonials-container .flash-testimonials .flash-testimonials-title p {
        font-size: 26px;
    }

    .flash-service-block-container .flash-service-block .part-block-desc h3 {
        font-size: 45px;
    }

    .flash-service-block-container .flash-service-block .part-block-desc p {
        font-size: 22px;
    }

    .flash-cta-container .cta-text h2 {
        font-size: 45px;
        margin-bottom: 15px;
    }

    .flash-cta-container .cta-text p {
        font-size: 26px;
        margin-bottom: 20px;
    }

    .flash-testimonials-container .card p {
        font-size: 31px;
    }

    .flash-testimonials-container .name {
        font-size: 31px;
        margin-top: 15px;
    }

    .flash-testimonials-container .stars {
        font-size: 22px;
        margin-top: 5px;
    }
}


  
@media (max-width: 768px) {
    .flash-header header{
        height:120px;
    }   
}

@media (max-width:440px){
    .flash-trust .flash-trust-dist{
        justify-content:space-between;
    }
}


.flash-service-block-container .flash-service-block .part-block-desc{
    width:65%;
    flex:1;
}
.flash-service-block-container .flash-service-block .part-block-img{
    width:35%;
}
footer{
    border-top: 3px solid #c91b27;
    margin-top:105px;
}
.footer {
    padding: 32px 50px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
}
.footer-left {
}
.footer-left img{
    max-width: 230px;
}
.footer-left p {
    margin: 0 0 15px 0;
    font-size: 16px;
}
.social-icons{
    gap:10px;
}
.social-icons a {
    color: #c91b27;
    font-size: 18px;
    text-decoration: none;
}
.social-icons svg{
    width:20px;
    height:20px;
}
.footer-center nav a {
    margin: 0 15px;
    color: #000;
    text-decoration: none;
    font-size: 18px;
}
.footer-center nav a:hover {
    text-decoration: underline;
}
.footer-right {
    font-size: 18px;
    line-height: 1.6;
}
.footer-bottom {
    background: #2A2A29;
    color: #fff;
    font-size: 12px;
    padding: 10px 0px;
}
@media (max-width: 768px) {
    .footer {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .footer-left, .footer-center, .footer-right {
        margin-bottom: 20px;
    }
    .flash-testimonials-container .card > div {
        width:70%;
        background-color: #c91b27;
        color: white;
        padding: 20px;
        border-radius: 15px;
        box-sizing: border-box;
        text-align: center;
    }
}

.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {
    content: ''!important;
}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after
{
    content:''!important;
}
.swiper-button-next svg,
.swiper-button-prev svg{
    width:16px!important;
    height:16px!important;
}