@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

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

:root {
--color-dark:#000000;
--color-light:#FFFFFF;
--color-accent-light:#007EA7;

--color-darkest-alpha:rgba(0,0,0,.90);
--color-dark-alpha:rgba(0,0,0,.85);

--color-light-alpha:rgba(255,255,255,.90);

font-size:18px;
}

html {
background-color:var(--color-light);
scroll-behavior: smooth;
}

body {
-webkit-text-size-adjust:100%;
font-family: 'Montserrat', sans-serif;
}

  /* [SITE WIDE STYLES] */

h1, h2, h3, h4, h5, h6 {
font-weight:500;
line-height: 1em;
}

p {
font-weight:200;
line-height:1.5em;
}

a {
text-decoration:none;
color: var(--color-accent-light);
}

a:hover {
text-decoration:underline;
}


/* [MENU STYLES] */

header {
background-color:var(--color-light-alpha);
position:sticky;
top: 0;
width:100%;
padding:.5em 0;
z-index: 1000;
}



.nav-logo {
display:flex;
justify-content: center;
align-items: center;
margin:0;
padding:0;

}

.nav-logo a {
display: block;
width:2em;
height:2em;
margin:0;
text-indent:-9999px;
overflow:hidden;
background-repeat: no-repeat;
background-size: 2em auto;
background-position:center center;
background-image:url('images/logo__black.png');
}

.nav-toggle {
display:none;
}

.nav-toggle-label {
position:absolute;
top:0;
right:0;
margin:0;
padding:.2em .3em .3em .3em;
height:100%;
display:flex;
align-items:center;
font-size:2rem;
color: var(--color-dark);
}

.nav__main {
position:absolute;
top:100%;
left:0;
background-color:var(--color-light);
width:100%;
transform: scale(1, 0);
transform-origin:top;
transition: transform 400ms ease-in-out;
}

.nav__main ul {
margin:0;
padding:1em 0;
list-style:none;
display: flex;
flex-direction: column;
align-items: center;
gap: 1em;
}

.nav__main li {
margin:0;
}

.nav__main a {
display:block;
padding:1em 1em;
text-decoration:none;
font-size:1rem;
color:var(--color-dark);
opacity:0;
transition:opacity 150ms ease-in-out;
}

.nav__main a:hover {
text-decoration:none;
}

.nav-toggle:checked ~ nav {
transform: scale(1, 1);
}

.nav-toggle:checked ~ nav a {
opacity:1;
transition:opacity 250ms ease-in-out 250ms;
}



  /* [PAGE FOOTER STYLES] */
#page__footer {
padding: 1em;
background-color:var(--color-light);
color:var(--color-dark);
text-align:center;}

#page__footer h3 {
margin:1em 0;
}



  /* [PAGE FOOTER SOCIAL STYLES] */
  
#page__footer__social ul {
list-style-type:none; margin:0 0 3em 0; padding:0;
}

  
#page__footer__social ul li {
display:inline-block;
margin:0 1em;
font-size:1em;
text-indent:-9999px;
overflow:hidden;
}

#page__footer__social ul li a {
display:block;
padding:0;
width:36px;
height:36px;
background-repeat: no-repeat;
background-size: cover;
background-position:center;
}

.facebook {
background-image:url('images/page__footer__social__facebook.png');
}

.twitter {
background-image:url('images/page__footer__social__twitter.png');
}

.instagram {
background-image:url('images/page__footer__social__instagram.png');
}

.youtube {
background-image:url('images/page__footer__social__youtube.png');
}

.tiktok {
  background-image:url('images/page__footer__social__tiktok.png');
  }

  /* [PAGE FOOTER LEGAL STYLES] */
#page__footer p.legal {font-size:.7em; margin:0 0 .5em 0;}
#page__footer p.legal a {text-decoration:underline}


  





/* [Home Page Hero] */

#home__hero {
display: flex;
align-items: center;
justify-content: flex-end;
height: 55vh;
margin:0 0 0 0;
padding:1em;
background-image:url('images/home__hero__photo2.jpg');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
color: var(--color-light);

}



/* [Page Row modules] */


.page__contents__light {
background-color:var(--color-light);
color:var(--color-dark);
}

.page__contents__dark {
background-color:var(--color-dark);
color:var(--color-light);
}


#home__row__1 {
  position: relative;
  max-width:960px;
  margin:0 auto;
  padding:5rem 1rem 8rem 1rem;

}

.home__row__1__logo {
  position: absolute;
  display: block;
  width: 8rem;
  aspect-ratio: 1 / 1;
  top: -4em;
  left: 50%;
  transform: translateX(-50%);
}

#home__row__1 h1 {
  font-size: 3rem;
  text-align: center;
}

#home__row__1 h2 {
  font-size: 2rem;
  text-align: center;
  margin: 0 0 2em 0;
}

#home__row__1 p {
max-width: 60ch;
margin: 0 auto;
padding:0 1rem 1rem 1rem;
text-align:center;
}




#home__row__2 {
  position: relative;
  padding: 4rem 1rem 2rem 1rem;
}

#home__row__2 h2 {
  width:fit-content;
  position: absolute;
  top: -1em;
  left: 50%;
  transform: translateX(-50%);
  padding: .5em 1em;
  font-size: 1.5rem;
  background-color:var(--color-light);

}

#home__row__2 p {
  max-width: 60ch;
  margin: 0 auto;
  padding: 0 1rem 1rem 1rem;
  text-align: center;
}

#home__row__2 strong {
font-weight: 600;
font-size: 1.4em;
}

#home__row__2 img {
  display: block;
  max-width: 100%;

  margin: 2rem auto 0 auto;
}

/* [LANDSCAPE MOBILE SCREENS] */
@media screen and (min-width: 600px){

/* [Home Page Hero] */




}


/* [DESKTOP SCREENS] */
@media screen and (min-width: 960px){


  /* [MENU STYLES] */


  .nav-width {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width:960px;
  margin: 0 auto;
  }

  .nav-logo a {
  display: block;
  transform: scale(1);
  transition: transform 50ms ease-in;
  }

  .nav-logo a:hover {
  transform: scale(1.05);
  }

  .nav-toggle-label {
  display: none;
  }

  .nav__main {
  position: relative;
  width: 100%;
  text-align:left;
  transform: none;
  background-color: transparent;
  }

  .nav__main ul {
  margin:0;
  padding:0;
  list-style:none;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  }

  .nav__main li {
  position:relative;
  margin:0;
  }

  .nav__main a {
  display:block;
  margin:0;
  padding: .5em 1em;
  text-decoration:none;
  font-size:1em;
  line-height: 1em;
  opacity:1;
  transform: scale(1);
  transition: transform 50ms ease-in;
  }

  .nav__main a:hover {
  text-decoration:none;
  transform: scale(1.05);
  }
  


/* [Home Page Hero] */




}

