@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

*{

    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{

    height: 100vh;
    font-family: "Montserrat", sans-serif;
    color: #ded6c9;
}

h1{

    font-size: 4rem;
    font-weight:400;
}

h3{

    font-size: 2rem;
      font-weight:300;
  
}
header{

    background-image: url(118783859_1337389316436065_4517805844551130985_n.jpg);
    height: 200px;
   background-size: cover;
   display: flex;
   flex-direction: column;
   padding-left: 10%;
    padding-right: 10%;
   align-items: center;
   justify-content: center;
  

border-bottom: 1px solid #ded6c9;
 

   
}

.telphone{
    display: flex;
    gap:.5rem;
    align-items: center;
   
}

.telContainer{

    display: flex;
   align-items: center;
   justify-content: space-evenly;
   gap: 2rem;
}

.innerHeader{

    width: 70% ;
    border: 1px solid #ded6c9;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap:.5rem;
    padding:.5rem;
    border-radius:.5rem ;
    background-color: rgba(71, 66, 58, 0.784);
}

main{

     background-image:url(109008702_1294353067406357_5061416004198507814_n.jpg) ;
     height: 50vh;
   background-size: 100%;
   background-position: 300px;

}

footer{

    background-color: rgb(71, 66, 58);
    height: 148px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-top: 1px solid #ded6c9;
}

.footerLinks{

}




/* ── Below 1226px ── */
@media (max-width: 1226px) {

    h1{

    font-size: 3rem;
    font-weight:400;
}

h3{

    font-size: 1.5rem;
    font-weight:400;
}

footer svg {
  width: 32px;
  height: 32px;
}
 
}

/* ── Below 1080px ── */
@media (max-width: 920px) {


       h1{

    font-size: 2rem;
    font-weight:400;
}

h3{

    font-size: 1rem;
    font-weight:500;
}

.telIcon{
    scale:.7
}


.telphone{
    display: flex;
    gap:0rem;
    align-items: center;
   
}




}

/* ── Below 600px (mobile) ── */
@media (max-width: 660px) {

      h1{

    font-size: 1.6rem;
    font-weight:400;
}

h3{

    font-size: .8rem;
  
}


.telIcon{
    scale:.6
}



.innerHeader{

    width: 100% ;
      gap:0;
    
}

.telContainer{

 
   gap: 1rem;
}


main{

     background-image:url(109008702_1294353067406357_5061416004198507814_n.jpg) ;
     height: 50vh;
   background-size: 100%;
   background-position: 100px;

}

}