.hero{text-align:center;padding:100px 0 0;& .wrapper{align-items:center;position:relative}& .hero-title{display:inline-block;position:relative;& h1{text-align:left;& span{color:var(--color--primary)}}& .hero-title-img{width:75px;height:75px;position:absolute;top:-40px;left:-60px}@media (width>=768px){justify-content:center;align-items:center;gap:40px;display:flex;& .hero-title-img{width:150px;height:150px;position:relative;top:auto;left:auto}}@media (width>=1280px){gap:70px;& .hero-title-img{width:auto;height:auto}}}& .hero-intro{& br{display:none}@media (width>=768px){& br{display:block}}}& .hero-logos{gap:15px;margin:0;padding:0;list-style:none;display:flex;@media (width>=1280px){position:absolute;top:0;right:20px}}}.home-services{&>.wrapper{grid-template-rows:1fr;grid-template-columns:1fr;display:grid}& .free-audit{margin-bottom:30px}& .home-services-block{text-align:left;border-top:1px dashed var(--color--grey);flex-direction:column-reverse;align-items:start;gap:10px;padding:30px 0;display:flex;& .icon,& p,& .price,& .button{display:none}}@media (width>=768px){& .home-services-block{flex-direction:column;& h3{& br{display:none}}& h3,& .home-services-block-title{order:1}& .info{order:2}& .home-services-block-detail{flex-direction:column;order:2;gap:10px;display:flex}& p{order:3;display:block}}}@media (width>=1280px){&>.wrapper{grid-template-rows:repeat(2,auto);grid-template-columns:repeat(3,1fr);align-items:start;gap:45px}& .free-audit{margin-bottom:0}& .home-services-block{border:1px solid var(--color--black);text-align:center;border-radius:10px;align-items:center;gap:30px;padding:50px;&[data-type=large]{text-align:left;flex-direction:row-reverse;grid-column:span 2/span 2;gap:80px;& .home-services-block-title{white-space:nowrap;flex-direction:column;align-items:start;gap:50px;display:flex}& .home-services-block-detail{gap:20px}}&:nth-child(3),&:nth-child(4),&:nth-child(5){grid-row-start:2}& .icon,& p,& .price,& .button{display:block}& h3,& .home-services-block-title{order:2;& br{display:block}}& .info,& .home-services-block-detail{order:1}& p{order:2;display:block}& .price{order:3}& a{order:4}}}}.bio{&>.wrapper{flex-direction:column;gap:40px;display:flex;& .bio-photo{display:none;position:relative;& .bio-img{width:100%;height:auto;position:relative}}@media (width>=1280px){flex-direction:row;justify-content:space-between;align-items:center;gap:100px;& .bio-photo{padding:0 130px;display:block}}& .bio-desc-mobile{justify-content:space-between;align-items:center;gap:30px;display:flex;& .bio-photo{width:30%;padding:0 20px;display:block;position:relative;& .bio-img{height:auto;& img{width:100%;height:auto}}}& .bio-desc-mobile-text{flex:1;width:100%;position:relative;& p{margin-bottom:20px}}@media (width>=1280px){display:none}}& .bio-desc{text-align:left;flex-direction:column;align-items:center;gap:50px;display:flex;& .bio-desc-content{flex-direction:column;gap:30px;display:none;@media (width>=1280px){display:flex}}@media (width>=1280px){align-items:start}}}}.bio-card{aspect-ratio:9/14;perspective:1000px;width:100px;color:inherit;text-decoration:none;display:block;position:relative;@media (width>=1280px){width:450px}}.card{border-radius:5px;transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s;position:absolute;inset:0}.card-back-1{background:var(--color--black);z-index:1;border:1px solid #ffffff14;transform:rotate(-5deg);@media (width>=1280px){width:100%;height:90%;top:30px;left:-10px}}.card-back-2{background:var(--color--alt);opacity:.85;z-index:2;transform:rotate(5deg);@media (width>=1280px){width:100%;height:100%;top:0;left:15px}}.card-main{z-index:3;transform-style:preserve-3d;will-change:transform;box-shadow:0 10px 30px var(--color--black);background:#111;transition:transform .15s ease-out,box-shadow .3s;display:block;overflow:hidden}.card-main img{object-fit:cover;pointer-events:none;width:100%;height:100%;display:block}.bio .card-back-1{animation:linear both bio-rotate-back-1 view();animation-range:entry 80%}.bio .card-back-2{animation:linear both bio-rotate-back-2 view();animation-range:entry 80%}.bio-card:hover .card-main{box-shadow:0 22px 45px #224d00,0 10px 25px #00000080}.last-projects{position:relative;& .projects-list{margin:50px 0;@media (width>=1280px){margin:40px 0 0}}&>.wrapper{flex-direction:column;align-items:center;display:flex;@media (width>=1280px){align-items:start;& .all-projects-bottom{display:none}}}& .last-projects-heading{& h2{text-align:center}&>a{display:none}@media (width>=1280px){justify-content:space-between;align-items:center;width:100%;display:flex;&>a{display:flex}& h2{& br{display:none}}}}}