@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

*{
    padding: 0;
    margin: 0;
    text-decoration: none;
    outline: none;
    transition: .2s linear;
    font-family: "Roboto", serif;
    box-sizing: border-box;
    border: none;
}

section{
    min-height: 10svh;
    overflow-x: hidden;
    padding: 2rem 6%;
    cursor: default;
}

:root{
    --accent:#ff9800;
    --bgAccent:#ffebd2;
    --darkAccent:#6a3a02;
    --secundary:#009bfa;
    --btn:#72a5c4;

    --white:#fff;
    --softBg:#eee;
    --black:#1E3050;
    --black2:#545e6e;
    --text:#8d8d8d;

    --boxShadow:0 .5rem 1.5rem rgba(0,0,0, .1);
    --border:.1rem solid #aaa;
    --border2:.2rem solid rgba(153, 153, 153, 0.3);
    --formulary:#E8F0FE;

    --dosis:"Dosis", sans-serif;
}

html{
    overflow-x: hidden;
    scroll-behavior: smooth;
    scroll-padding-top: 6rem;
    scroll-padding-bottom: 6rem;
    background: #222;
}
 /* html::-webkit-scrollbar{
    width: .8rem;
}
 html::-webkit-scrollbar-track{
    background:transparent;
}
 html::-webkit-scrollbar-thumb{
    background: #555;
    border-radius: 3rem;
} */

@keyframes fadeIn {
    0%{
        transform: translateY(-4rem) scale(0);
        opacity: 0;
    }
}
















/*Sección Promo Empieza*/
.promo{
    min-height: 20vh;
    background:linear-gradient(45deg, #db6607, #fff570, #ffffde,#fff570, #ffcc5d,#fda827,#fff570,#fff570,#ffffde,#ffffde, #fff570,#ffb515,#fff570, #fff570,#ffffde, #fff570,#ffa600);
    position: relative;
    outline: .5rem solid purple;
    outline-offset: -1.2rem;
    margin-top: 2rem;
    margin-bottom: 2rem;
    border: 3px solid purple;
}

.promo h1{
    color: rgb(99, 0, 99);
    font-size:clamp(1rem, 3vw, 3rem);
    font-weight: bolder;
    margin-bottom: .5rem;
    margin-left: 12rem;
}
.promo h1:nth-child(1){
    margin-top: 3rem;
}


.promo p{
    font-size: clamp(1.2rem, 2vw, 2rem);
    color: rgb(0, 0, 0);
    margin-bottom: 2rem;
    margin-left: 12rem;
    font-weight: 700;
    text-wrap: wrap;
}

.promo p b{
    color:var(--white);
    font-size: clamp(1.5rem, 2vw, 2.7rem);
    color: red;
}

.promo strong{
    font-weight: bolder;
    color: white;
    font-size: clamp(1.7rem, 2vw, 4rem);
    padding: .5rem 1rem;
    border-radius: 5px;
    border: 1px solid orangered;
    margin-left: 12rem;
    background: purple;
}

.promo::before{
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    height: 15rem;
    width: 15rem;
    background: purple;
    clip-path: polygon(0 0, 0 100%, 100% 0);
}

.promo::after{
    position: absolute;
    top: 4rem;
    left: 0;
    content: 'Descuento';
    color: var(--white);
    text-align: center;
    transform: rotate(-45deg);
    font-size: 2rem;
    font-weight: bolder;
}
/*Sección Promo Termina*/