:root{--color-light: #F0F0F0;--color-dark: #231F20;--color-dark-gray: #3C3C3C;--color-accent: #FFDACC;--color-accent-hover: #bda399;--font-family-base: "Roboto", sans-serif;--font-family-accent: "RobotoCondensed", sans-serif;--border: 1px solid var(--color-dark);--border-radius: 10px;--header-height: clamp(60px, 10vh, 112px);--input-height: 0;--container-width: 1920px;--container-padding-x: 10px;--transition-duration: 0.2s}*,*::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]){margin-left:0;padding:0;border:none}:where(ul[class]){list-style:none}p{--paragraphMarginBottom: 24px;margin-block:0}p:where(:not([class]):not(:last-child)){margin-bottom:var(--paragraphMarginBottom)}img{display:block}input,textarea,select,button{font:inherit}html{height:100%;scroll-behavior:smooth}body{min-height:100%;line-height:1.5}svg *[fill]{fill:currentColor}svg *[stroke]{stroke:currentColor}svg *{transition-property:fill,stroke}@media(prefers-reduced-motion: reduce){*{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}a[class]{text-decoration:none}button[class],input[class],textarea[class],select[class]{border:none;outline:none;outline-offset:0}textarea{font-family:var(--font-family-base)}@font-face{font-family:"Roboto";font-style:normal;font-weight:100;font-display:swap;src:url(../fonts/Roboto-Thin.woff2) format("woff2")}@font-face{font-family:"Roboto";font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/Roboto-Light.woff2) format("woff2")}@font-face{font-family:"Roboto";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/Roboto-Regular.woff2) format("woff2")}@font-face{font-family:"Roboto";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/Roboto-Medium.woff2) format("woff2")}@font-face{font-family:"Roboto";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/Roboto-Bold.woff2) format("woff2")}@font-face{font-family:"Roboto";font-style:normal;font-weight:900;font-display:swap;src:url(../fonts/Roboto-Black.woff2) format("woff2")}@font-face{font-family:"RobotoCondensed";font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/RobotoCondensed-Light.woff2) format("woff2")}@font-face{font-family:"RobotoCondensed";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/RobotoCondensed-Regular.woff2) format("woff2")}@font-face{font-family:"RobotoCondensed";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/RobotoCondensed-Bold.woff2) format("woff2")}body{min-width:320px;font-family:var(--font-family-base);font-size:16px;line-height:16px;color:#000;background-color:gray}.container{min-width:320px;max-width:calc(var(--container-width) + var(--container-padding-x)*2);padding-inline:var(--container-padding-x);margin-inline:auto}.footer{z-index:10;position:fixed;bottom:10px;width:100%}.works{padding-top:var(--container-padding-x);padding-bottom:100px}.works__list{display:flex;flex-wrap:wrap;gap:15px}.works__item{width:calc(100% / 2 - 15px * (2 - 1) / 2);position:relative;padding:20px clamp(3px,4vw,7px) clamp(3px,4vw,7px);border-radius:8px;background-color:#000}@media(min-width: 768px){.works__item{width:calc(100% / 3 - 15px * (3 - 1) / 3)}}@media(min-width: 1024px){.works__item{width:calc(100% / 4 - 15px * (4 - 1) / 4)}}@media(min-width: 1600px){.works__item{width:calc(100% / 5 - 15px * (5 - 1) / 5)}}.works__item::before{content:"";position:absolute;top:5px;right:7px;width:10px;height:10px;border-radius:50%;background:red;box-shadow:-13px 0 #ff0,-26px 0 green}.works__item-link{display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;width:100%;transition:all 1s ease-in-out}.works__item-link::after{content:"";position:absolute;width:100%;height:100%;bottom:0;left:0;background-color:#000;opacity:0}.works__item-link::before{content:"↴";z-index:1;display:flex;align-items:center;justify-content:center;position:absolute;right:0;bottom:0;min-width:32px;height:35px;padding:0 7px 0 20px;border-radius:40px 0 5px 0;color:#fff;background-color:#000;font-weight:700;transition:transform .5s ease-in-out}@media(hover: hover){.works__item-link:hover::before{content:"смотреть ↴"}.works__item-link:hover .works__item-name{top:10px}.works__item-link:hover img{opacity:.5}}@media(hover: none){.works__item-link:active::before{content:"смотреть ↴"}.works__item-link:active .works__item-name{top:10px}.works__item-link:active img{opacity:.5}}.works__item-image{width:100%;height:auto;border-radius:5px;transition:all .2s ease-in-out}.works__item-name{position:absolute;top:-250%;width:calc(100% - 14px);padding:3px 7px;border-radius:5px;color:#fff;background-color:#9acd32;font-weight:600;transition:all .2s ease-in-out}.works__item-work{display:flex;align-items:center;justify-content:center;position:absolute;bottom:0;left:0;height:25px;padding:3px 20px 0 7px;border-radius:0 40px 0 0;color:gray;background-color:#000;font-size:.8em}.mail{max-width:max-content;padding:5px 15px;margin-inline:auto;border-radius:5px;color:#000;background-color:#ffebcd;box-shadow:0 0 20px rgba(0,0,0,.1)}.mail-link{color:#000;font-weight:500;line-height:1.2;text-decoration:underline !important}.body-404{overflow:hidden;display:flex;flex-direction:column;align-items:center;position:relative;height:100vh;max-height:100svh;background-color:gray}.body-404 .header{overflow:hidden;display:flex;flex-direction:column;align-items:center;position:absolute;bottom:50svh;width:max-content;padding:clamp(16px,4vw,40px) clamp(48px,4vw,400px);border-radius:50%;border:clamp(2px,1vw,10px) solid #000;background:#8b8787;transform:rotate(-4deg);transition:.2s}.body-404 .header::before{z-index:-1;content:"";position:absolute;width:100%;height:100%;top:-10%;border-radius:50%;background:#fff;transform:rotate(-3deg)}.body-404 .main,.body-404 .main .container{height:100vh;max-height:100svh}.body-404__img{width:100%;height:100%}.body-404__img .st0,.body-404__img .st5{fill:#000}.body-404__img .st1,.body-404__img .st11{fill:#1e1e1e}.body-404__img .st4,.body-404__img .st14,.body-404__img .st3,.body-404__img .st12{fill:#8b8787}.body-404__img .st2,.body-404__img .st6{fill:#fff}.body-404__title{font-size:clamp(30px, 6.25vw, 90px);color:#000;line-height:.75em}.body-404__txt,.body-404__link{font-size:clamp(12px, 1.5277777778vw, 22px)}.body-404__txt{color:#000;opacity:.5;line-height:1.8em}.body-404__link{margin-top:5px;margin-bottom:8px;padding:clamp(3px,1vw,10px) clamp(10px,1vw,20px) clamp(5px,1vw,13px);border-radius:30px;color:#eee;background:#cc1b1b;font-weight:600;text-decoration:none;text-transform:lowercase}@media(hover: hover){.body-404__link:hover{background:#941212}}@media(hover: none){.body-404__link:active{background:#941212}}