:root {
 --color-black: hsl(0, 0%, 7%);
 --color-white: hsl(0, 0%, 100%);
 --color-gray: hsl(210, 14%, 75%);
 --color-pink: hsl(199.1, 63.7%, 46.5%);
 --shadow-small: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 --shadow-medium: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
 --shadow-large: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
 --shadow-extra: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)
}
*,
*::before,
*::after {
 padding:0;
 margin:0;
 -webkit-box-sizing:border-box;
 box-sizing:border-box;
 list-style:none;
 list-style-type:none;
 text-decoration:none;
 -webkit-font-smoothing:antialiased;
 -moz-osx-font-smoothing:grayscale;
 text-rendering:optimizeLegibility
}
html {
 font-size:100%;
 -webkit-box-sizing:inherit;
 box-sizing:inherit;
 scroll-behavior:smooth
}
body {
 font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;
 font-size:1rem;
 font-weight:400;
 line-height:1.5;
 color:var(--color-black);
 background:var(--color-white)
}
a,
button {
 font-family:inherit;
 font-size:inherit;
 line-height:inherit;
 cursor:pointer;
 border:none;
 outline:none;
 background:none;
 text-decoration:none
}
img,
video {
 display:block;
 max-width:100%;
 height:auto;
 -o-object-fit:cover;
 object-fit:cover
}
.container {
 max-width:80rem;
 height:auto;
 margin:0 auto;
 padding:0 1rem
}
.brand {
 font-family:inherit;
 font-size:1.75rem;
 font-weight:700;
 line-height:inherit;
 color:var(--color-pink);
 text-transform:uppercase;
 text-rendering:optimizeLegibility
}
.header {
 position:fixed;
 left:0;
 top:0;
 width:100%;
 height:auto;
 z-index:999;
 margin:0 auto;
 background:var(--color-white);
 -webkit-box-shadow:var(--shadow-medium);
 box-shadow:var(--shadow-medium)
}
.header .wrapper {
 display:-webkit-box;
 display:-ms-flexbox;
 display:flex;
 -webkit-box-pack:justify;
 -ms-flex-pack:justify;
 justify-content:space-between;
 -webkit-box-align:center;
 -ms-flex-align:center;
 align-items:center;
 gap:2rem;
 max-width:100%;
 height:auto;
 padding:.75rem 0
}
.header .menu>.menu-item {
 position:relative;
 display:inline-block;
 margin:0 .75rem
}
.header .menu>.menu-item>a {
 display:block;
 font-family:inherit;
 font-size:1rem;
 font-weight:600;
 line-height:inherit;
 padding:1rem 0;
 border:none;
 outline:none;
 color:var(--color-black);
 text-transform:capitalize;
 text-rendering:optimizeLegibility;
 -webkit-transition:all .35s ease;
 transition:all .35s ease
}
.header .menu>.menu-item>a .expand {
 position:relative;
 display:inline-block;
 height:.75rem;
 width:.75rem;
 margin-left:.35rem;
 border:none;
 outline:none;
 pointer-events:none
}
.header .menu>.menu-item>a .expand:before,
.header .menu>.menu-item>a .expand:after {
 position:absolute;
 -webkit-box-sizing:inherit;
 box-sizing:inherit;
 content:"";
 left:50%;
 top:50%;
 width:100%;
 height:2px;
 background:var(--color-black);
 -webkit-transform:translate(-50%, -50%);
 transform:translate(-50%, -50%);
 -webkit-transition:all .35s ease;
 transition:all .35s ease
}
.header .menu>.menu-item:hover>a {
 color:var(--color-pink)
}
.header .menu>.menu-item:hover>a .expand::before,
.header .menu>.menu-item:hover>a .expand::after {
 background:var(--color-pink)
}
.header .menu>.menu-item>a .expand::after {
 -webkit-transform:translate(-50%, -50%) rotate(-90deg);
 transform:translate(-50%, -50%) rotate(-90deg)
}
.header .menu>.menu-item>.sub-menu>.menu-item>a:hover {
 color:var(--color-pink)
}
.header .menu>.menu-item>.sub-menu {
 position:absolute;
 left:-1rem;
 top:100%;
 width:17rem;
 height:auto;
 padding:.75rem 0;
 border:none;
 outline:none;
 opacity:0;
 visibility:hidden;
 border-top:3px solid var(--color-pink);
 background:var(--color-white);
 -webkit-box-shadow:var(--shadow-medium);
 box-shadow:var(--shadow-medium);
 -webkit-transform:translateY(1rem);
 transform:translateY(1rem);
 -webkit-transition:all .35s ease;
 transition:all .35s ease
}
.header .menu>.menu-item>.sub-menu>.menu-item {
 display:block
}
.header .menu>.menu-item>.sub-menu>.menu-item>a {
 display:block;
 font-family:inherit;
 font-size:0.9rem;
 font-weight:600;
 line-height:inherit;
 padding:.5rem 1.25rem;
 color:var(--color-black);
 text-transform:capitalize;
 text-rendering:optimizeLegibility;
 -webkit-transition:all .35s ease;
 transition:all .35s ease
}
.header .burger-menu {
 position:relative;
 display:none;
 cursor:pointer;
 width:2rem;
 height:1rem;
 border:none;
 outline:none;
 opacity:0;
 visibility:hidden;
 background:none;
 -webkit-transform:rotate(0deg);
 transform:rotate(0deg);
 -webkit-transition:all .35s ease;
 transition:all .35s ease
}
.header .burger-menu span {
 display:block;
 position:absolute;
 width:100%;
 height:2px;
 left:0;
 border:none;
 outline:none;
 opacity:1;
 border-radius:.25rem;
 background:var(--color-black);
 -webkit-transform:rotate(0deg);
 transform:rotate(0deg);
 -webkit-transition:all .25s ease;
 transition:all .25s ease
}
.header .burger-menu span:nth-child(1) {
 top:0
}
.header .burger-menu span:nth-child(2),
.header .burger-menu span:nth-child(3) {
 top:.5rem
}
.header .burger-menu span:nth-child(4) {
 top:1rem
}
.header .overlay {
 position:fixed;
 left:0;
 top:0;
 height:100%;
 width:100%;
 z-index:999;
 opacity:0;
 visibility:hidden;
 background:rgba(0,0,0,.65);
 -webkit-transition:all .35s ease;
 transition:all .35s ease
}
@media only screen and (min-width: 993px) {
 .header .menu>.menu-item-child:hover>.sub-menu {
  display:block;
  opacity:1;
  visibility:visible;
  -webkit-transform:translateY(0);
  transform:translateY(0)
 }
 .header .menu>.menu-item-child:hover>a .expand::after {
  -webkit-transform:translate(-50%, -50%) rotate(0deg);
  transform:translate(-50%, -50%) rotate(0deg)
 }
}
@media only screen and (max-width: 992px) {
 .header .overlay.active {
  display:block;
  opacity:1;
  visibility:visible
 }
 .header .navbar {
  position:fixed;
  top:0;
  left:-18rem;
  width:18rem;
  height:100%;
  z-index:999;
  opacity:0;
  overflow-y:auto;
  visibility:hidden;
  background:var(--color-white);
  -webkit-box-shadow:var(--shadow-medium);
  box-shadow:var(--shadow-medium);
  -webkit-transition:all .5s ease;
  transition:all .5s ease
 }
 .header .navbar.active {
  left:0rem;
  opacity:1;
  visibility:visible
 }
 .header .menu {
  width:100%;
  height:auto;
  margin:2rem 0
 }
 .header .menu>.menu-item {
  display:block;
  margin:0
 }
 .header .menu>.menu-item-child>a {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center
 }
 .header .menu>.menu-item>a {
  padding:.625rem 1.25rem;
  color:var(--color-black)
 }
 .header .menu>.menu-item>a .expand::before,
 .header .menu>.menu-item>a .expand::after {
  background:var(--color-black)
 }
 .header .menu>.menu-item-child.active>a .expand:after {
  -webkit-transform:translate(-50%, -50%) rotate(0deg);
  transform:translate(-50%, -50%) rotate(0deg)
 }
 .header .menu>.menu-item>.sub-menu {
  position:relative;
  top:auto;
  left:auto;
  width:100%;
  max-height:0;
  padding:0px;
  border:none;
  outline:none;
  opacity:1;
  overflow:hidden;
  visibility:visible;
  background:transparent;
  -webkit-box-shadow:none;
  box-shadow:none;
  -webkit-transform:translateY(0px);
  transform:translateY(0px)
 }
 .header .menu>.menu-item>.sub-menu>.menu-item>a {
  padding:.625rem 2rem;
  color:var(--color-black)
 }
 .header .burger-menu {
  display:block;
  opacity:1;
  visibility:visible
 }
}
@media only screen and (max-width: 1150px) {
    .header .menu>.menu-item {margin:0 .2rem}
  }
