#hero-canvas{position:absolute;width:100%;height:100%;top:0;left:0;z-index:10;background-color:transparent}*,*::before,*::after{margin:0;padding:0;box-sizing:inherit}html{box-sizing:border-box;font-size:62.5%}body{font-family:'Exo 2', sans-serif;font-weight:400;line-height:1.6;color:#e9e9e9;background-image:linear-gradient(to bottom, #181f35, #371a20, #181f35)}.heading-1,.heading-2,.heading-3,.heading-4{font-family:"Dosis", sans-serif;color:#e9e9e9;font-weight:400}.heading-1{font-family:"Exo 2", sans-serif;font-size:9.6rem;line-height:1}.heading-2{font-size:4.5rem;text-transform:uppercase;letter-spacing:3px}.heading-2--lowercase{text-transform:lowercase;color:#d43150;font-size:4.5rem;font-weight:400}.heading-3{font-size:3.5rem;text-transform:uppercase;letter-spacing:3px}.heading-4{font-family:"Exo 2", sans-serif;font-size:2.4rem;line-height:1.4}.copy{font-family:"Exo 2", sans-serif;font-size:2rem;font-weight:400}.u-margin-bottom-small{margin-bottom:1.5rem}.u-margin-bottom-medium{margin-bottom:4rem}.u-margin-bottom-large{margin-bottom:8rem}.u-margin-bottom-huge{margin-bottom:10rem}.u-margin-top-small{margin-top:1.5rem}.u-margin-top-medium{margin-top:4rem}.u-margin-top-large{margin-top:8rem}.u-margin-top-huge{margin-top:10rem}.hero__btn,.hero__btn:link,.hero__btn:visited,.card__btn,.card__btn:link,.card__btn:visited,.personas__btn,.personas__btn:link,.personas__btn:visited{position:relative;display:inline-block;padding:2rem 6rem;background-color:#d43150;color:#fff;font-family:"Dosis", sans-serif;letter-spacing:4px;border:none;cursor:pointer;pointer-events:auto;font-size:2rem;text-decoration:none;text-transform:uppercase;border-radius:0.4rem;border-left:3px solid #612632;border-bottom:3px solid #612632;transition:all 0.2s}.hero__btn:hover,.card__btn:hover,.personas__btn:hover{transform:translateY(-3px);box-shadow:0 1rem 2rem rgba(255,255,255,0.2)}.hero__btn:hover::after,.card__btn:hover::after,.personas__btn:hover::after{transform:scaleX(1.4) scaleY(1.6);opacity:0}.hero__btn:active,.hero__btn:focus,.card__btn:active,.card__btn:focus,.personas__btn:active,.personas__btn:focus{outline:none;transform:translateY(-1px);box-shadow:0 0.5rem 1rem rgba(255,255,255,0.2)}.hero__btn::after,.card__btn::after,.personas__btn::after{content:'';display:inline-block;height:100%;width:100%;border-radius:10rem;position:absolute;top:0;left:0;z-index:-1;transition:all 0.4s}.banner{grid-column:full-start / full-end;height:25rem;-webkit-clip-path:polygon(0 0, 50% 20%, 100% 0%, 100% 60%, 50% 80%, 0 60%);clip-path:polygon(0 0, 50% 20%, 100% 0%, 100% 60%, 50% 80%, 0 60%);background-image:url(../img/sand.jpg);background-position-x:100%;background-position-y:60%;filter:brightness(0.25);opacity:80%}.footer{grid-column:center-start / center-end;display:flex;flex-direction:column;align-items:center}.footer__icons{display:flex}.footer__icon-box{width:7rem;height:7rem;background-color:#0e0e0e;position:relative;border-radius:0.4rem}.footer__icon-box:not(:last-child){margin-right:1rem}.footer__icon{width:5rem;height:5rem;color:#e9e9e9;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.container{display:grid;grid-template-rows:min-content minmax(1fr, min-content) repeat(4, min-content);grid-template-columns:[full-start] minmax(6rem, 1fr) [center-start] repeat(8, [col-start] minmax(min-content, 18rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end]}.process{display:grid;grid-column:center-start / center-end;grid-template-columns:repeat(auto-fit, minmax(50rem, 1fr)) 1fr;row-gap:10rem}.process__title{grid-column:1 / -1}.process__card--description{grid-column:1 / 2;display:grid;grid-template-columns:min-content 1fr;align-content:start;gap:2.5rem}.process__card--img{grid-column:2 / 3}.process__icon{grid-row:1 / span 2}.about{grid-column:center-start / center-end}.projects{grid-column:center-start / center-end;display:grid;grid-template-columns:repeat(2, min-content);grid-template-rows:min-content 1fr;-moz-column-gap:10rem;column-gap:10rem;row-gap:5rem}.projects h2{grid-column:1 / -1}.peregrine{grid-column:full-start / full-end;display:grid;grid-template-columns:[peregrine-full-start] minmax(6rem, 1fr) [peregrine-center-start] repeat(8, [peregrine-col-start] minmax(min-content, 18rem) [peregrine-col-end]) [peregrine-center-end] minmax(6rem, 1fr) [peregrine-full-end]}.peregrine .intro{grid-column:peregrine-center-start / peregrine-center-end}.peregrine .divider{grid-column:peregrine-full-start / peregrine-full-end}.peregrine .overview{grid-column:peregrine-center-start / peregrine-center-end;display:grid;grid-template-columns:repeat(2, minmax(min-content, 1fr));-moz-column-gap:7rem;column-gap:7rem;justify-content:start}.peregrine .overview__underline{grid-column:1/-1}.peregrine .overview h2{grid-column:1/-1}.peregrine .research-1{grid-column:peregrine-center-start / peregrine-center-end;display:grid;grid-template-columns:repeat(3, minmax(min-content, 1fr));-moz-column-gap:2.4rem;column-gap:2.4rem}.peregrine .research-1 h2,.peregrine .research-1 h3{grid-column:1 / -1}.peregrine .research-1__underline{grid-column:1 / -1}.peregrine .personas{grid-column:peregrine-full-start / peregrine-full-end;display:grid;grid-template-columns:repeat(2, 50%);gap:1rem}.peregrine .personas__needs--brooke{grid-column:2 / span 1;grid-row:1 / span 1}.peregrine .personas__needs--hubert{grid-column:1 / span 1;grid-row:2 / span 1}.peregrine .personas__img--brooke{grid-column:1 / span 1}.peregrine .wireframe-1{grid-column:peregrine-center-start / peregrine-center-end;display:grid;grid-template-columns:repeat(2, minmax(min-content, 1fr));-moz-column-gap:2.4rem;column-gap:2.4rem}.peregrine .wireframe-1__underline{grid-column:1 / -1}.peregrine .wireframe-1 h3{grid-column:1 / -1}.peregrine .wireframe-2{grid-column:peregrine-center-start / peregrine-center-end;display:grid;grid-template-columns:repeat(3, minmax(min-content, 1fr));gap:2.4rem}.peregrine .wireframe-2__underline{grid-column:1/-1}.peregrine .wireframe-2 h2{grid-column:1/-1}.peregrine .wireframe-2 h3{grid-column:1/-1}.peregrine .wireframe-2__img-box--dashboard{grid-column:1/2}.peregrine .affinity{grid-column:peregrine-full-start / peregrine-full-end}.peregrine .testing-1{grid-column:peregrine-center-start / peregrine-center-end;display:grid;grid-template-columns:repeat(2, minmax(min-content, 1fr));gap:2.4rem}.peregrine .testing-1__underline{grid-column:1/-1}.peregrine .testing-1 h2{grid-column:1/-1}.peregrine .wireframe-3{grid-column:peregrine-center-start / peregrine-center-end;display:grid;grid-template-columns:repeat(3, minmax(min-content, 1fr));gap:2.4rem}.peregrine .wireframe-3__underline{grid-column:1/-1}.peregrine .wireframe-3 h2{grid-column:1/-1}.header{grid-column:full-start / full-end;border-bottom:solid 0.1rem #5a5c62}.header--main{border-bottom:none}.header__logo{margin-left:10rem;margin-top:2.5rem;margin-bottom:1.5rem;z-index:2}.header__link{cursor:pointer}#hero-canvas{z-index:0}.hero{grid-column:center-start / center-end;z-index:10;pointer-events:none;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;padding-top:5rem}.hero__text-box{width:100%;margin-top:-10rem;display:flex;flex-direction:column;align-items:center}.hero__titles{width:100%;display:flex;justify-content:center}.navigation__checkbox{display:none}.navigation__button{background-color:#e9e9e9;height:7rem;width:7rem;position:fixed;top:2rem;right:6rem;border-radius:50%;text-align:center;cursor:pointer;z-index:2000}.navigation__background{height:6rem;width:6rem;border-radius:50%;position:fixed;top:2.5rem;right:6.5rem;background-image:radial-gradient(#0d1220, #612632);z-index:1000;transition:transform 0.8s cubic-bezier(0.86, 0, 0.07, 1)}.navigation__nav{height:100vh;position:fixed;top:0;left:0;z-index:1500;visibility:hidden;opacity:0;width:0;transition:all 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55)}.navigation__list{display:grid;grid-template-columns:1fr max-content 1fr;row-gap:0.8rem;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);list-style:none;text-align:center;width:100%}.navigation__item{grid-column:2 / 3;justify-self:start}.navigation__link:link,.navigation__link:visited{display:inline-block;font-size:3rem;font-weight:300;padding:1rem 2rem;color:#e9e9e9;text-decoration:none;text-transform:uppercase;background-image:linear-gradient(120deg, transparent 0%, transparent 50%, #d43150 50%);background-size:230%;transition:all 0.4s}.navigation__link:link span,.navigation__link:visited span{margin-right:1.5rem;display:inline-block}.navigation__link:hover,.navigation__link:active{background-position:100%;transform:translateX(1rem)}.navigation__checkbox:checked ~ .navigation__background{transform:scale(100)}.navigation__checkbox:checked ~ .navigation__nav{visibility:visible;opacity:1;width:100%}.navigation__icon{position:relative;margin-top:3.3rem}.navigation__icon,.navigation__icon::before,.navigation__icon::after{display:inline-block;width:3rem;height:2px;background-color:#5a5c62}.navigation__icon::before,.navigation__icon::after{content:'';position:absolute;left:0;transition:all 0.4s}.navigation__icon::before{top:-0.8rem}.navigation__icon::after{top:0.8rem}.navigation__button:hover .navigation__icon::before{top:-1rem}.navigation__button:hover .navigation__icon::after{top:1rem}.navigation__checkbox:checked+.navigation__button .navigation__icon{background-color:transparent}.navigation__checkbox:checked+.navigation__button .navigation__icon::before{transform:rotate(135deg);top:0}.navigation__checkbox:checked+.navigation__button .navigation__icon::after{transform:rotate(-135deg);top:0}.process{font-size:2rem}.process__card{padding:2rem 3.5rem}.process__text{color:#e9e9e9}.process__img{display:block;width:80%;min-width:25rem;border-radius:0.4rem;filter:brightness(0.85)}.process__icon{width:5rem;height:5rem;fill:#d43150}.heading-1--about{grid-column:center-start / center-end;text-align:center}.about{display:flex;margin-top:10rem;height:90vh}.about__panel{border-radius:1.2rem;border:1px solid rgba(200,200,200,0.5);cursor:pointer;flex:0.1;padding:2.5rem;word-break:break-all;transition:flex 0.7s ease-in;position:relative}.about__panel:not(:last-child){margin-right:1rem}.about__panel.active{flex:2}.about__img{border-radius:1.2rem;background-size:contain;z-index:1}.about__title{position:absolute;font-size:10rem;text-transform:uppercase;line-height:1.2;z-index:100;top:5%;left:6%}.intro{display:flex;justify-content:space-evenly;margin-top:10rem;padding:1rem}.intro__title-box{width:40%}.intro__title-box h2{text-shadow:2px 2px 2px #0e0e0e;line-height:1.2;margin-bottom:3rem}.intro__line{height:0.2rem;background-color:rgba(233,233,233,0.5);margin-bottom:3rem}.intro__stat-box h3{color:#d43150;text-shadow:2px 2px 2px #0e0e0e}.intro__stat-box h4{margin-top:-0.8rem;margin-bottom:2rem}.divider__background{height:60vh;background-image:url("../../img/peregrine/peregrine_dashboard_clip.jpg");background-position:50% 0;background-size:cover}.overview{padding:2.4rem;justify-content:center}.overview h2{color:#d43150;text-shadow:2px 2px 2px #0e0e0e}.overview h3{text-shadow:2px 2px 2px #0e0e0e}.overview__underline{height:0.2rem;background-color:rgba(233,233,233,0.5);margin-bottom:5rem}.overview__card{margin-bottom:5rem}.research-1{padding:2.4rem}.research-1__underline{height:0.2rem;background-color:rgba(233,233,233,0.5);margin-bottom:5rem}.research-1__pie,.research-1__pain{background-color:rgba(14,14,14,0.5);height:25rem}.research-1 h2{color:#d43150;text-shadow:2px 2px 2px #0e0e0e}.research-1 h3{margin-bottom:1rem;text-shadow:2px 2px 2px #0e0e0e}.personas{background-color:#181f35;padding:2.4rem 0}.personas__needs{padding:5rem}.personas__img-box{display:flex;align-items:end;justify-content:space-evenly;background-color:rgba(14,14,14,0.5);border-radius:1.2rem}.personas__img{height:90%;margin-bottom:2.5%}.personas__btn-box{margin-bottom:5%}.wireframe-1{padding:2.4rem}.wireframe-1__img{width:75%;border-radius:0.6rem}.wireframe-1__underline{height:0.2rem;background-color:rgba(233,233,233,0.5);margin-bottom:5rem}.wireframe-1 h2{color:#d43150;text-shadow:2px 2px 2px #0e0e0e}.wireframe-1 h3{text-shadow:2px 2px 2px #0e0e0e}.wireframe-2{padding:2.4rem}.wireframe-2__img{border-radius:0.6rem}.wireframe-2__underline{height:0.2rem;background-color:rgba(233,233,233,0.5);margin-bottom:5rem}.wireframe-2 h2{color:#d43150;text-shadow:2px 2px 2px #0e0e0e}.wireframe-2 h3{text-shadow:2px 2px 2px #0e0e0e}.affinity__background{height:60vh;background-image:url("../../img/peregrine/affinity.jpg");background-position:50% 0;background-size:cover}.testing-1{padding:2.4rem}.testing-1__underline{height:0.2rem;background-color:rgba(233,233,233,0.5);margin-bottom:5rem}.testing-1 h2{color:#d43150;text-shadow:2px 2px 2px #0e0e0e}.testing-1__list-item{display:flex}.testing-1__list-item:not(:last-child){margin-bottom:2rem}.testing-1__icon{margin-right:1rem;margin-top:1rem;width:10rem}.wireframe-3{padding:2.4rem}.wireframe-3__underline{height:0.2rem;background-color:rgba(233,233,233,0.5);margin-bottom:5rem}.wireframe-3 h2{color:#d43150;text-shadow:2px 2px 2px #0e0e0e}.projects{margin:5rem auto}.card{display:flex;flex-direction:column;padding:2rem;background-color:#02030a;width:50rem;height:-moz-min-content;height:min-content;border-radius:1.2rem;border:1px solid rgba(200,200,200,0.5);transition:all 0.2s}.card__img{border-radius:0.4rem}.card__icons{margin-top:2rem;display:flex;justify-content:flex-start}.card__icons svg:not(:last-child){margin-right:2rem}.card__text{font-size:1.8rem;margin-bottom:4rem}.card__btn{width:90%;margin-left:2rem}.card:hover{transform:translateY(-0.3rem);border:1px solid #612632}