    @import url("assets/css/bootstrap-reboot.min.css");
    @import url("assets/css/bootstrap-grid.min.css");
    @import url("assets/css/bootstrap-utilities.min.css");
    
    :root {
        --base-font-family: "Barlow",sans-serif;
        /* --alternative-font-family: "Poppins",sans-serif; */
        --alternative-font-family: "Playfair Display", serif;
        --regular-font-weight: 400;
        --bold-font-weight: 700;
        --base-line-height: 1.3;
        --primary: #d73333;
        --primary-dark: #a40e0e;
        --secondary: #59cbe8;
        --secondary-dark: #338fc2;
        --dark: #111;
        --bg-base: #fff;
        --white: #fff;
        --gray: #cfcfcf;
        --gray-light: #f1f1f1;
        --gray-dark: #5b5b5b;
        --gray-upv: #5b6770;
        --gray-dark-upv: #3f4444;
        --box-shadow-sm: 0px 2px 6px rgba(0,0,0,0.15);
        --box-shadow-lg: 0px 3px 9px rgba(0,0,0,0.2);
        --base-font-size: 1.25rem;
        --small-font-size: 1rem;
        --extra-small-font-size: 0.75rem;
        --h1-font-size: 4rem;
        --h2-font-size: 2.625rem;
        --h3-font-size: 1.777rem;
        --h4-font-size: 1.75rem;
        --gap: 1rem;
        --margin-base: 1rem;
        --gap-xs: .5rem;
        --border-radius: 24px;
        --border-width: 1px;
        --transition-base: all ease .3s .05s;
    }

    body {
        font-size: var(--base-font-size);
        color: var(--dark);
        font-family: var(--base-font-family);
        font-weight: var(--regular-font-weight);
        line-height: var(--base-line-height);
        background-color: #caddec;
    }

    /* Bàsics */

    .carousel-title,    h1,    h2,    h3,    h4 {
        font-family:var(--alternative-font-family);
        color: #fe0002;
    }

    h1 {
        font-size: var(--h1-font-size);
    }

    h2 {
        font-size: var(--h2-font-size);
    }

    .text-sm {
        font-size:var(--small-font-size)
    }
    .text-xs {
        font-size:var(--extra-small-font-size)
    }

    .img-fluid {
        max-width: 100%;
    }

    .bg-gray-dark-upv {
        background-color: var(--gray-dark-upv);
    }

    .btn {
        text-transform: uppercase;
        padding: 10px 45px;
        background-color: #fe0002;
        color: var(--white);
        text-decoration: unset;
        display: inline-flex;
        align-items: center;
        transition: var(--transition-base);
        justify-content: center;
        min-width: 320px;
    }

    .btn:hover {
        background-color: var(--primary-dark);
    }

    .btn.outline {
        background-color: unset;
        outline: var(--border-width) solid var(--primary);
        outline-offset: -1px;
        color: var(--primary);
    }

    .btn.outline:hover {
        background-color: var(--primary);
        color: var(--white);
    }

    .section-padding {
        padding: 100px 0;
    }

    .text-right {
        text-align: right;
    }

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

    .bg-red {
        background-color: #fe0002;
    }


    /* Pàgina */

    header {
        z-index: 1;
        width: 100%;
    }

    header .navbar-brand img {
        max-width: 220px;
    }

    section {
        min-height: 90vh;
        position: relative;
    }

    .container, .container-fluid {
        position: relative;
        z-index: 3;
    }

    .section-title {
    padding-top: 20vh;
    }

    .img-marca {
        opacity:0;
        transition: opacity 0.3s ease;
    }


    /* Formulari */

    ._form._inline-form {
        background: transparent !important;
    }

    ._form._inline-form ._form_element input[type="text"] {
        background-color: transparent !important;
        border: 0 !important;
    }

    /* Imatges */

    .img-graf {
        display: flex;
        align-items: end;
        height: 300px;
        justify-content: center;
    }

    .img-numeros {
        max-width: 300px;
        margin-top: 50px;
    }

    .img-grafica25 {
        max-width: 150px;
    }

    .img-grafica27 {
        max-width: 250px;
        padding-bottom: 15px;
    }

    .img-melo {
        max-width: 120%;
        right: -60%;
    }

    .img-cel {
        max-width: 150px;
        margin-left: 0%;
    }

    .img-cel-2 {
        max-width: 0px;
    }

    .img-cel-3 {
        max-width: 130px;
        margin-left: 0%;
        top: -10%;
    }

    .img-avio {
        top: 0;
    }

    .img-avio, .img-boles {
        max-width: 400px;
    }

    .img-colador {
        max-width: 1400px;
    }

    /* Peu */

    .social-links {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 1.5rem;
      }

    .social-links svg {
        max-height: 23px;
        width: auto;
      }

      :is(.social-links) :is(a, button) {
        font-size: var(--extra-small-font-size);
        color: #fe0002;
      }

      .social-links a {
        height: 23px;
        display: flex;
        align-items: center;
      }

    @media (min-width: 1200px) {

        .img-melo {
            max-width: 50%;
            right: 0;
        }

        .img-cel {
            max-width: 300px;
            margin-left: 3%;
        }
    
        .img-cel-2 {
            max-width: 350px;
            margin-right: 2%;
        }
    
        .img-cel-3 {
            max-width: 300px;
            margin-left: 2%;
            top: 0%;
        }

        .img-avio, .img-boles {
            max-width: 600px;
        }

.section-title {
padding-top: 25vh;
}

    }


    @media (min-width: 1920px) {

        section {
            max-width: 1920px;
        }

        
    }

    @media (min-width: 768px) and (max-width: 1199px) {


        .img-avio {
            left: -50%;
            top: -5%;
        }

    }

    @media (min-width: 1200px) and (max-width: 1599px) {


        .img-grafica25, .img-grafica27 {
            max-width: 150px;
        }

    }

    @media (max-width: 767px) {

        .img-avio {
            left: -180%;
            top: -5%;
        }

        .selector-idioma > p {
            display: inline-block;
            font-size: 0.9rem;
        }

    }

    @media (max-width: 480px) {

        .img-avio {
            left: -280%;
            top: -5%;
        }

    }			