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

main {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    /* text-align: center; */
}


:root {
    --color-white: #ffffff;
    --color-nav: #010440;
    --color-primary: #1c3643;
    --color-secondary: #273b47;
    --color-tertiary: #1e5372;
    --color-platzi: #002147;
    --color-platzi-hover: rgb(47, 189, 255);
    --color-gradient: linear-gradient(to right, var(--color-nav), var(--color-nav), var(--color-tertiary));
}

.bg-white {
    background-color: var(--color-white);
}

.bg-platzi {
    background-color: var(--color-platzi);
}

.bg-dark-blue {
    background-color: #002147;
}

.text-dark-blue {
    color: #002147;
}

.btn-platzi {
    background-color: var(--color-platzi);
    color: white;
}

.btn-platzi:hover {
    /* background-color: #82ad36; */
    background-color: var(--color-platzi-hover);
}

.badge-right {
    /* float: right; */
    text-align: right;
}

.card-body {
    /* background-color: var(--color-tertiary); */
    /* background:linear-gradient(90deg,#1c3643,#273b47 25%,#1e5372); */
    background: var(--color-gradient);
    color: white;
}

header .container {
    padding: 10px 0;
}

header img {
    width: 80px;
}

header nav {
    background-color: var(--color-nav);
}

header nav #nav-buy-ticket {
    color: var(--color-platzi);
}

header nav #nav-buy-ticket:hover {
    /* color: hsl(90, 3%, 76%) !important; */
    color: var(--color-platzi-hover)
}

main section .carousel-inner img {
    max-height: 80vh;
    object-fit: cover;
    filter: grayscale(70%);
}

#carousel {
    position: relative;:root {
        --color-primary: #1c3643;
        --color-secondary: #273b47;
        --color-tertiary: #1e5372;
        --color-platzi: #97c93e;
        --color-platzi-hover: greenyellow;
        --color-gradient: linear-gradient(to right, var(--color-primary), var(--color-secondary), var(--color-tertiary));
    }
    
    .bg-platzi {
        background-color: var(--color-platzi);
    }
    
    .btn-platzi {
        background-color: var(--color-platzi);
        color: white;
    }
    
    .btn-platzi:hover {
        /* background-color: #82ad36; */
        background-color: var(--color-platzi-hover);
    }
    
    .badge-right {
        /* float: right; */
        text-align: right;
    }
    
    .card-body {
        /* background-color: var(--color-tertiary); */
        /* background:linear-gradient(90deg,#1c3643,#273b47 25%,#1e5372); */
        background: var(--color-gradient);
        color: white;
    }
    
    header .container {
        padding: 10px 0;
    }
    
    header img {
        width: 80px;
    }
    
    header nav #nav-buy-ticket {
        color: var(--color-platzi);
    }
    
    header nav #nav-buy-ticket:hover {
        /* color: hsl(90, 3%, 76%) !important; */
        color: var(--color-platzi-hover)
    }
    
    main section .carousel-inner img {
        max-height: 100vh;
        object-fit: cover;
        filter: grayscale(70%);
    }
    
    #carousel {
        position: relative;
    }
    
    #carousel .overlay {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 1;
        background: rgba(0, 0, 0, 0.5);
        color: white;
    }
    
    #carousel .overlay .container, #carousel .overlay .row {
        height: 100%;
    }
    
    #place-time img {
        max-width: 100%;
    }
    
    footer {
        background:linear-gradient(90deg,#1c3643,#273b47 25%,#1e5372);
        /* background: var(--color-gradient); */
    }
    
    footer .container {
        padding: 25px 0;
    }
    
    
}

#carousel .overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
    background: rgba(0, 0, 0, 0.5);
    color: white;
}

#carousel .overlay .container, #carousel .overlay .row {
    height: 100%;
}

#about-us img {
    max-width: 100%;
}

#about-us div{
    background-color: var(--color-nav);
}

#shipping {
    background-color: var(--color-nav);
    box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.3); /* Sombra difuminada abajo */
}

footer {
    background:linear-gradient(90deg,#010440,#010440 25%,#1e5372);
    /* background: var(--color-gradient); */
}

footer .container {
    padding: 25px 0;
}