/* ========================================
   TABLET
======================================== */

@media (max-width:1000px){

}



/* ========================================
   MOBILE
======================================== */

@media (max-width:768px){

/* ---------- GLOBAL ---------- */

*{

    box-sizing:border-box;

}

img{

    max-width:100%;

    height:auto;

}

section{

    padding-left:7%;

    padding-right:7%;

}



/* ---------- NAVBAR ---------- */

.navbar{

    padding:18px 7%;

}

.navbar nav{

    display:none;

}

/* ---------- LOGO ---------- */

.logo-wrap{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:10px;

}

.logo-icon{

    width:46px;

    height:46px;

    object-fit:contain;

    flex:0 0 46px;

}

.logo-text{

    height:38px;

}



/* ---------- HERO ---------- */

.hero,
.menu-hero,
.cakes-hero,
.coffee-hero,
.about-hero,
.contact-hero{

    min-height:auto;

    padding:120px 7% 70px;

    background-position:center;

}

.hero h1,
.menu-hero h1,
.cakes-hero h1,
.coffee-hero h1,
.about-hero h1,
.contact-hero h1{

    font-size:2.8rem;

}

.hero-script,
.menu-script,
.cakes-script,
.coffee-script,
.about-script,
.contact-script{

    font-size:2rem;

}

.hero p,
.menu-hero p,
.cakes-hero p,
.coffee-hero p,
.about-hero p,
.contact-hero p{

    font-size:1rem;

    line-height:1.7;

}


/* ========================================
   HOME
======================================== */

@media (max-width:768px){

.locations-section{

    padding:70px 7%;

}

.locations-header{

    margin-bottom:40px;

}

.locations-header h2{

    font-size:2rem;

}

.locations-grid{

    grid-template-columns:1fr;

    gap:34px;

}

.location-card{

    text-align:center;

    padding-bottom:32px;

    border-bottom:1px solid #ece7e2;

}

.location-card:last-child{

    padding-bottom:0;

    border-bottom:none;

}

.location-card:first-child::after{

    display:none;

}

.location-card h3{

    font-size:2rem;

}

.location-address,
.location-hours{

    font-size:1rem;

}

.location-card a{

    justify-content:center;

}

}


/* ---------- MENU ---------- */



/* ========================================
   COFFEE
======================================== */

@media (max-width:768px){

.coffee-grid{

    grid-template-columns:1fr;

    gap:30px;

}

.coffee-card{

    grid-template-columns:1fr;

}

.coffee-card-image{

    order:-1;

}

.coffee-card-image img{

    height:260px;

}

.coffee-card-info{

    padding:30px;

}

.coffee-meta{

    flex-wrap:wrap;

    gap:12px;

}

}


/* ========================================
   CAKES
======================================== */

.cakes-wrapper{

    grid-template-columns:1fr;

    gap:30px;

}

.cake-list{

    display:flex;

    flex-direction:column;

}

.cake-option{

    padding:16px 0;

    font-size:1rem;

}

.cake-details{

    padding:26px;

}

.cake-details h3{

    font-size:1.7rem;

}

.cake-details p{

    font-size:.98rem;

    line-height:1.7;

}

.cake-price{

    font-size:2rem;

    margin:22px 0;

}

.house-section{

    padding:70px 7%;

}

.house-logo{

    width:200px;

    max-width:100%;

}

.cakes-info{

    padding:70px 7%;

}


/* ---------- ABOUT ---------- */



/* ---------- CONTACT ---------- */



/* ---------- MODALS ---------- */



/* ---------- FOOTER ---------- */

   /* ---------- LOGO ---------- */

.logo-wrap{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:10px;

}

.logo-icon{

    width:auto;

    height:42px;

    flex-shrink:0;

}

.logo-text{

    width:auto;

    height:24px;

    flex-shrink:0;

}


/* Footer */

.footer-home{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:10px;

}

.footer-home .logo-icon{

    width:auto;

    height:42px;

}

.footer-home .footer-logo{

    width:auto;

    height:24px;

}
}
