*,:before,:after{box-sizing:border-box}:where(ul,ol):where([class]){padding-left:0}body,:where(blockquote,figure):where([class]){margin:0}:where(h1,h2,h3,h4,h5,h6,p,ul,ol,dl):where([class]){margin-block:0}:where(dd[class]){margin-left:0}:where(fieldset[class]){border:none;margin-left:0;padding:0}:where(ul[class]){list-style:none}:where(address[class]){font-style:normal}p{--paragraphMarginBottom:24px;margin-block:0}p:where(:not([class]):not(:last-child)){margin-bottom:var(--paragraphMarginBottom)}img,video{max-width:100%;height:auto;display:block}input,textarea,select,button{font:inherit}html{scrollbar-gutter:stable;overscroll-behavior:none;scroll-behavior:smooth;height:100%}body{min-height:100%;line-height:1.5}a:where([class]){display:inline-flex}button,label{cursor:pointer}[fill]{fill:currentColor}[stroke]{stroke:currentColor}svg *{transition-property:fill,stroke}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}:root{--color-background:#282c33;--color-background-second:#3a3f45;--color-white:#fff;--color-primary:#2196f3;--color-primary-ad:#2196f333;--color-gray:#abb2bf;--color-gray-ad:#abb2bf33}html{scroll-behavior:smooth;-webkit-tap-highlight-color:transparent}section{scroll-margin-top:100px}body{color:var(--color-gray);background-color:var(--color-background);font-family:Fira Code,monospace;font-size:16px;font-style:normal;font-weight:400;line-height:1.6}.no-scroll{width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}@font-face{font-family:Fira Code;src:url(/assets/FiraCode-Regular-DmifnrmV.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Fira Code;src:url(/assets/FiraCode-Medium-BucId1NK.woff2)format("woff2");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:Fira Code;src:url(/assets/FiraCode-SemiBold-CA6U9Wbo.woff2)format("woff2");font-weight:600;font-style:normal;font-display:swap}.app-main{background-color:var(--color-background-second);flex-direction:column;gap:110px;max-width:1025px;margin:0 auto;padding:100px 10px;display:flex}@media (width<=900px){.app-main{padding:80px 20px}}.footer__wrapper{border-top:1px solid var(--color-gray);background-color:var(--color-background-second);max-width:1025px;margin:0 auto;padding:32px 10px}.footer__copyright{text-align:center;font-size:12px}.raccoon-icon{color:var(--color-gray);transition:all .3s}.raccoon-icon:hover,.raccoon-icon:active{color:var(--color-primary)}.header-logo__icon{color:var(--color-primary);transition:color .3s}.header-logo__icon:hover{color:var(--color-white)}.burger-menu{background-color:var(--color-background-second);z-index:99;width:100%;height:100vh;margin-top:60px;padding:20px 10px;display:none}.burger-menu--active{flex-direction:column;display:flex;overflow:hidden}.burger-menu__list{flex-direction:column;gap:32px;margin-bottom:100px;display:flex}.burger-menu__link{color:var(--color-text);font-size:32px;text-decoration:none}.burger-menu__link:before{content:"#";color:var(--color-primary);font-weight:400}.burger-menu-media{gap:8px;max-width:208px;margin:0 auto;display:flex}.burger-menu-media__item{width:64px;height:64px}.burger-menu-media__link{color:var(--color-gray);transition:all .3s}.burger-menu-media__link:active{color:var(--color-white)}header{z-index:100;width:100%;margin-bottom:60px;position:fixed;top:0;left:0}.header__container{z-index:2;background-color:var(--color-background-second);justify-content:space-between;align-items:center;max-width:1025px;margin:0 auto;padding:32px 10px 8px;display:flex;position:relative}.header-button{cursor:pointer;background-color:#0000;border:none;width:24px;height:24px;padding:0;display:none;position:relative}.header-button span{background-color:var(--color-gray);width:100%;height:2px;transition:transform .3s;position:absolute;top:50%;left:0;transform:translateY(-50%)scale(1)}.header-button:before,.header-button:after{content:"";background-color:var(--color-gray);width:100%;height:2px;transition:transform .3s,top .3s,bottom .3s;position:absolute;left:0}.header-button:before{top:0}.header-button:after{bottom:0}.header-button--active span{transform:translateY(-50%)scale(0)}.header-button--active:before{top:50%;transform:translateY(-50%)rotate(-45deg)}.header-button--active:after{top:50%;bottom:auto;transform:translateY(-50%)rotate(45deg)}@media (width<=900px){.header-button{display:block}}.header-media{flex-direction:column;justify-content:center;align-items:center;gap:8px;display:flex;position:fixed;top:0;left:16px}.header-media__line{background-color:var(--color-gray);width:1px;height:33vh}.header-media__link{gap:8px;display:grid}.header-media__link-item{color:var(--color-white);transition:all .3s}.header-media__link-item:hover,.header-media__link-item:active{color:var(--color-primary);transition:all .3s}@media (width<=1200px){.header-media{display:none}}.header-menu__list{flex-wrap:wrap;gap:32px;display:flex}.header-menu__link{color:var(--color-gray);text-decoration:none;transition:color .3s}.header-menu__link--active{color:var(--color-white);font-weight:600}.header-menu__link:before{content:"#";color:var(--color-primary);font-weight:400}.header-menu__link:hover,.header-menu__link:focus{color:var(--color-white);font-weight:500}@media (width<=900px){.header-menu{display:none}.header-menu__list{gap:10px}}.about-me-illustration{margin:0 auto;position:relative}.about-me-illustration__dots{z-index:1;position:absolute;top:10%;left:10%}.about-me-illustration__image{border-bottom:1px solid var(--color-primary);z-index:2;position:relative}.section-title{color:var(--color-white);margin-bottom:48px;font-size:32px;font-weight:500;display:inline-block;position:relative}.section-title:before{content:"#";color:var(--color-primary)}.section-title:after{content:"";background-color:var(--color-primary);width:25vh;height:1px;margin-left:16px;position:absolute;top:50%;left:100%}@media (width<=600px){.section-title{margin-bottom:24px;font-size:28px}.section-title:after{width:10vh}}.about-me__inner{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;display:flex}.about-me__content{max-width:450px}.about-me__text{flex-direction:column;gap:40px;display:flex}.about-me__paragraph{width:100%;text-justify:distribute}.about-me__image{border-bottom:1px solid var(--color-primary);width:340px;height:326px}@media (width<=900px){.about-me__inner{flex-direction:column;margin:0 auto;display:flex}.about-me__content{max-width:100%;margin:0 auto}.about-me__image{margin:0 auto}}.contacts-media{border:1px solid var(--color-gray);max-width:350px;margin:0 auto;padding:16px}.contacts-media__title{margin-bottom:16px;font-weight:600}.contacts-media__list{flex-wrap:wrap;gap:8px;display:flex}.contacts-media__item{color:var(--color-gray);flex-wrap:wrap;align-items:center;gap:5px;text-decoration:none;transition:all .3s;display:flex}.contacts-media__item:hover,.contacts-media__item:active{color:var(--color-white)}.contacts__inner{flex-wrap:no-wrap;justify-content:space-between;gap:20px;display:flex}.contacts__description{max-width:500px;font-weight:500}@media (width<=900px){.contacts__inner{flex-wrap:wrap;gap:40px}.contacts__description{margin:0 auto}}.hero-illustration{position:relative}.hero-illustration__dots{z-index:3;position:absolute;top:64%;right:0}.hero-illustration__figure{z-index:1;position:absolute;top:22%;left:0}.hero-illustration__image{border-bottom:1px solid var(--color-primary);z-index:2;position:relative}.hero__inner{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:32px;display:flex}.hero__content{max-width:420px}.hero__title{color:var(--color-white);margin-bottom:32px;font-size:32px;font-weight:600;line-height:1.3}.hero__title span{color:var(--color-primary)}.hero__description{margin-bottom:32px}@media (width<=900px){.hero__inner{flex-direction:column}}.button-gitHub{color:var(--color-gray);border:1px solid var(--color-gray);padding:6px 16px;font-weight:500;text-decoration:none;transition:all .3s}.button-gitHub:hover,.button-gitHub:focus{background-color:var(--color-gray-ad)}.button-live{color:var(--color-white);border:1px solid var(--color-primary);padding:6px 16px;font-weight:500;text-decoration:none;transition:all .3s}.button-live:hover,.button-live:focus{background-color:var(--color-primary-ad)}.project-card{border:1px solid var(--color-gray);place-self:center}.project-card__image{border-bottom:1px solid var(--color-gray)}.project-card__technologies{border-bottom:1px solid var(--color-gray);flex-wrap:wrap;gap:8px;padding:8px;display:flex}.project-card__content{padding:16px}.project-card__name{color:var(--color-white);margin-bottom:16px;font-size:24px;font-weight:500}.project-card__description{margin-bottom:16px}.project-card__buttons{flex-wrap:wrap;gap:16px;display:flex}.projects__inner{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}@media (width<=900px){.projects__inner{grid-template-columns:repeat(2,1fr)}}@media (width<=600px){.projects__inner{grid-template-columns:repeat(1,1fr);gap:32px}}.skill-block{border:1px solid var(--color-gray);text-align:center;max-width:200px}.skill-block__title{color:var(--color-white);border-bottom:1px solid var(--color-gray);padding:8px;font-weight:600}.skill-block__list{flex-wrap:wrap;gap:8px;padding:8px;display:flex}.skills-illustration{flex-shrink:0;max-width:349px;height:282px;display:block}@media (width<=900px){.skills-illustration{display:none}}.skills__inner{flex-wrap:no-wrap;justify-content:space-between;gap:20px;display:flex}.skills__list{grid-template-columns:repeat(2,1fr);justify-content:center;align-items:center;gap:16px;display:grid}@media (width<=900px){.skills__list{grid-template-columns:repeat(3,1fr);margin:0 auto}}@media (width<=600px){.skills__list{grid-template-columns:repeat(2,1fr)}}