@charset "UTF-8";
/* CSS Document */

/* ==========================================================
   RESPONSIVE.CSS
   Tablet + Desktop
========================================================== */


/* =========================
   TABLET (768px+)
========================= */

@media (min-width:768px){

    :root{
        --header-height:88px;
        --section-spacing:120px;
        --container-padding:40px;
    }

    /* HERO */

    .hero__content{
        max-width:80%;
    }

    .hero h1{
        font-size:4.8rem;
    }

    .hero p{
        font-size:1.15rem;
    }

    /* INTRO */

    .intro__grid{

        grid-template-columns:1fr 60px 1fr;
        align-items:center;
        gap:48px;

    }

    .intro__divider{
        height:100%;
    }

    .intro__divider span{
        width:1px;
        height:180px;
    }

    /* CONTENT */

    .content__grid{
        grid-template-columns:1fr 1fr;
        gap:72px;
    }

    /* Reverse layout */

    .content--reverse .content__image{
        order:1;
    }

    .content--reverse .content__text{
        order:2;
    }

 /* WINERIES */

/* WINERIES */

.wineries__grid{
    grid-template-columns:repeat(8,1fr);
    gap:32px 28px;
}

.winery{
    height: 140px;
    padding: 14px;
}

    .winery img{
       max-height: 110px;
    }

    /* FOOTER */

    .footer__grid{

        grid-template-columns:1fr 1fr;
        text-align:left;
        padding-block:0;

    }

    .footer__right{
        text-align:right;
    }

}


/* =========================
   DESKTOP (1200px+)
========================= */

@media (min-width:1200px){

    :root{
        --container-padding:56px;
        --section-spacing:140px;
    }

    h2{
        font-size:3.3rem;
    }

    .hero h1{
        font-size:6rem;
    }

    .hero p{
        font-size:1.2rem;
        max-width:620px;
    }

    .intro__heading h2{
        font-size:3.4rem;
    }

    .content__text h2{
        font-size:3rem;
    }

    .content__grid{
        gap:96px;
    }

}