*{margin:0;padding:0}*,*:after,*:before{box-sizing:border-box}:root{--font-stack-primary: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;--text-color-primary-hc: hsl(0, 0%, 100%);--text-color-secondary-hc: hsl(0, 0%, 95%);--text-color-primary-lc: hsl(0, 0%, 20%);--text-color-secondary-lc: hsl(0, 0%, 40%);--text-color-special-hc: hsl(202, 93%, 61%);--text-color-special-lc: hsl(222, 89%, 46%);--text-color-special-secondary-hc: hsl(262, 75%, 62%);--background-color-special-hc: hsl(202, 93%, 61%);--background-color-special-lc: #1a1a1a;--background-color-special-secondary-hc: hsl(262, 75%, 62%);--drop-shadow-primary-lc: drop-shadow(-1px -1px 4px rgba(125, 125, 125, .15)) drop-shadow(2px 2px 4px rgba(0, 0, 0, .25));--drop-shadow-rise-lc: drop-shadow(-1px -1px 9px rgba(255, 255, 255, .15)) drop-shadow(5px 5px 9px rgba(0, 0, 0, .33));--box-shadow-color-primary-hc: rgba(255, 255, 255, .15);--box-shadow-color-primary-lc: rgba(0, 0, 0, .1);--box-shadow-color-secondary-lc: rgba(0, 0, 0, .33)}html[data-scroll-lock=true] body{overflow:hidden}@keyframes color-wheel{0%{filter:hue-rotate(0deg)}to{filter:hue-rotate(360deg)}}body{display:grid;grid-template-rows:auto 1fr auto;min-height:100vh;font-family:var(--font-stack-primary);color:var(--text-color-primary-lc);overflow-x:hidden;&[data-scrolled=true] header{box-shadow:0 0 10px var(--box-shadow-color-secondary-lc)}}body,button{font-size:1.25rem}a{color:var(--text-color-primary-lc);&.button{text-decoration:none;display:inline-block}&:hover{text-decoration:none}}ul,ol{list-style:none}h1{font-size:2.75rem;font-size:clamp(1.75rem,8.25vw,2.75rem)}h2{font-size:2rem;font-size:clamp(1.6rem,7.75vw,2rem)}h3{font-size:1.5rem;font-size:clamp(1.33rem,5vw,1.5rem)}img{max-width:100%;height:auto}picture{display:flex}header{background-color:#f1f1f1;position:sticky;top:0;z-index:105;transition:all .3s;& a{color:var(--text-color-primary-hc);color:#333}&>.container{display:contents}&>.container>div{display:flex;justify-content:space-between}&>.container>div>button{background:transparent;border:0;color:var(--text-color-primary-hc)}&>.container>div>button,&>.container .company-name,&>.container .logo{position:relative;z-index:101}&>.container .logo{color:#f99}&>.container .company-name,&>.container .logo{display:flex;align-items:center}&>.container .company-name{gap:.5rem;text-decoration:none}&>.container .logo svg{width:2rem}&>.container nav{display:flex;flex-direction:column;position:absolute;height:100vh;background:var(--background-color-special-lc);width:100%;z-index:-100;transform:translate(-100vw) translateY(-10vh);opacity:0;transition:133ms all}&>.container nav>a{padding:1rem}&>.container>nav[data-expanded=true]{opacity:1;display:flex;transform:translate(0) translateY(0);z-index:100}}.header-bg>svg{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;fill:var(--text-color-special-hc)}footer{background-color:var(--background-color-special-lc);color:var(--text-color-primary-hc);padding:3rem 0;& a{color:var(--text-color-primary-hc)}& .logo-company{text-align:center;font-size:1.5rem}& .logo-white{margin:0 auto;width:4rem}& nav{display:flex;justify-content:center;margin:2rem auto 0;width:200px;gap:1rem}}.button{background-color:var(--background-color-special-secondary-hc);border:0;padding:.66rem 1.25rem;color:var(--text-color-primary-hc);border-radius:5px;box-shadow:inset -2px -2px 0 var(--box-shadow-color-primary-lc);filter:var(--drop-shadow-primary-lc);&:hover{cursor:pointer}&:active{transform:scale(.95);filter:brightness(1.05) var(--drop-shadow-primary-lc)}}.small-text{font-size:.9rem}.logo-white svg{fill:var(--text-color-primary-hc)}.container{padding:2rem;margin:0 auto;z-index:1}.color-highlight{color:var(--text-color-special-secondary-hc);color:var(--text-color-special-hc)}section+section{margin:3rem auto}.color-wheel{animation:color-wheel infinite 10s}@media (width > 786px){header{&>.container{display:flex;justify-content:space-between;align-items:center}&>.container>.container{margin:0;padding:0}&>.container>.container>button{display:none}&>.container>nav{position:static;opacity:1;display:block;transform:translate(0) translateY(0);z-index:100;height:auto;width:auto}}.container{margin:0 auto;max-width:1024px}}@media (width > 1280px){.container{margin:0 auto;max-width:1200px}}@media (width > 1440px){.container{margin:0 auto;max-width:1400px}}@media (width > 1920px){.container{margin:0 auto;max-width:1900px}}
