:root{--nav_and_h-color:#212121;--maintext-color:#757575;--photo_and_h1-color:#ffffff;--hover_and_logo-color:#2196f3;--secondlogo-color:#000000;--first_and_last_background-color:#2f303a;--navcontainer-color:#ececec;--third_background-color:#f5f4fa}@keyframes fadeInDown{from{opacity:0;transform:translateY(-18px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{from{opacity:0;transform:scale(0.92)}to{opacity:1;transform:scale(1)}}@keyframes softPulse{0%,100%{transform:scale(1);box-shadow:0px 4px 4px rgba(0,0,0,0.15)}50%{transform:scale(1.04);box-shadow:0px 8px 20px rgba(33,150,243,0.35)}}@keyframes modalOpen{from{opacity:0;transform:translate(-50%,-48%) scale(0.88)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}body{font-family:"Roboto",sans-serif;font-weight:400;line-height:1.71}h1{color:var(--photo_and_h1-color)}.portfolio-item h3{text-align:left;margin:0 0 4px;font-size:18px;font-weight:700;line-height:2;color:var(--nav_and_h-color)}.portfolio-item p{text-align:left;margin:0;font-size:16px;line-height:1.87;color:var(--maintext-color)}a{text-decoration:none;color:var(--nav_and_h-color)}a:hover{color:var(--hover_and_logo-color)}ul{list-style:none;margin:0;padding:0}section{padding:94px 0}.team{background-color:var(--third_background-color)}footer{background-color:var(--first_and_last_background-color)}.hero-title,.services-title,.team-title,.clients-title{margin-bottom:50px;text-align:center;font-family:"Montserrat",sans-serif;font-weight:700;line-height:1.17}h1{line-height:1.36}button{font-family:"Montserrat",sans-serif;font-weight:500;line-height:1.63}p{font-family:"Roboto",sans-serif;font-weight:300;line-height:1.71}nav a{font-family:"Montserrat",sans-serif;font-weight:500;line-height:1.14}.header{border-bottom:1px solid var(--navcontainer-color);animation:fadeInDown 700ms ease both}.header-container{display:flex;align-items:center;min-height:80px}.header-nav{margin-left:93px}.header-nav-list{display:flex;gap:50px}.header-nav-link{display:block;padding:32px 0;position:relative}.header-nav-link.current{color:var(--hover_and_logo-color)}.header-nav-link.current::after{content:"";position:absolute;left:0;bottom:-1px;width:100%;height:4px;border-radius:2px;background-color:var(--hover_and_logo-color)}.header-contacts{display:flex;align-items:center;gap:30px;margin-left:auto}.header-contacts-link{display:flex;align-items:center;gap:10px;padding:32px 0;color:var(--maintext-color)}.header-logo{display:block}.header-contacts-icon{flex-shrink:0;fill:currentColor}.envelope{width:16px;height:12px}.smartphone{width:10px;height:16px}.hero{min-height:600px;display:flex;align-items:center;background-image:linear-gradient(rgba(47,48,58,0.4),rgba(47,48,58,0.4)),url("../image/backgroundbigimg.jpg");background-size:cover;background-position:center;background-color:var(--first_and_last_background-color)}.hero-title{animation:fadeInUp 800ms ease 150ms both}.container{max-width:1200px;margin:0 auto;padding:0 15px}.hero-container{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.hero-button{padding:10px 32px;border:none;border-radius:4px;background-color:var(--hover_and_logo-color);color:var(--photo_and_h1-color);cursor:pointer;transition:background-color 250ms ease,box-shadow 250ms ease;box-shadow:0px 4px 4px rgba(0,0,0,0.15);animation:fadeInUp 800ms ease 350ms both,softPulse 2600ms ease-in-out 1400ms infinite}.hero-button:hover,.hero-button:focus{background-color:#188ce8;box-shadow:0px 4px 10px rgba(0,0,0,0.25);animation-play-state:paused}.features-list{display:flex;gap:30px}.features-item{width:270px;animation:fadeInUp 650ms ease both}.features-item:nth-child(2){animation-delay:120ms}.features-item:nth-child(3){animation-delay:240ms}.features-item:nth-child(4){animation-delay:360ms}.features-item::before{content:"";display:flex;height:120px;margin-bottom:30px;background-color:var(--third_background-color);background-repeat:no-repeat;background-position:center;border-radius:4px;transition:transform 250ms ease,box-shadow 250ms ease}.features-item:hover::before{transform:translateY(-6px);box-shadow:0px 10px 22px rgba(33,150,243,0.18)}.features-icon-1::before{background-image:url(../image/attention.svg)}.features-icon-2::before{background-image:url(../image/punctuation.svg)}.features-icon-3::before{background-image:url(../image/planning.svg)}.features-icon-4::before{background-image:url(../image/technologies.svg)}.services-list{display:flex;gap:30px}.services-item{position:relative;overflow:hidden;animation:scaleIn 650ms ease both}.services-item:nth-child(2){animation-delay:140ms}.services-item:nth-child(3){animation-delay:280ms}.services-image{width:370px;height:294px;object-fit:cover;display:block;transition:transform 350ms ease}.services-item:hover .services-image{transform:scale(1.04)}.label{display:flex;position:absolute;left:0;bottom:0;width:100%;min-height:70px;justify-content:center;align-items:center;margin:0;color:white;text-transform:uppercase;background-color:rgba(0,0,0,0.6)}.team-list{display:flex;gap:30px}.team-item{background-color:var(--photo_and_h1-color);text-align:center;padding-bottom:30px;animation:fadeInUp 650ms ease both;transition:transform 250ms ease,box-shadow 250ms ease;box-shadow:0px 1px 3px rgba(0,0,0,0.12),0px 1px 1px rgba(0,0,0,0.14),0px 2px 1px rgba(0,0,0,0.2)}.team-item:nth-child(2){animation-delay:120ms}.team-item:nth-child(3){animation-delay:240ms}.team-item:nth-child(4){animation-delay:360ms}.team-item:hover{transform:translateY(-8px);box-shadow:0px 8px 18px rgba(0,0,0,0.12),0px 4px 8px rgba(0,0,0,0.14),0px 2px 4px rgba(0,0,0,0.2)}.team-name{margin:30px 0 10px;font-family:"Montserrat",sans-serif;font-size:16px;font-weight:500;line-height:1.18;color:var(--nav_and_h-color)}.team-position{margin:0 0 16px;color:var(--maintext-color)}.social-list,.footer-social-list{display:flex;justify-content:center;gap:10px}.social-link,.footer-social-link{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;color:#afb1b8;transition:background-color 250ms ease,color 250ms ease}.social-link:hover,.social-link:focus{background-color:var(--hover_and_logo-color);color:var(--photo_and_h1-color)}.social-icon,.footer-social-icon{width:20px;height:20px;fill:currentColor}.clients-list{display:flex;justify-content:center;gap:30px}.clients-link{display:flex;align-items:center;justify-content:center;width:170px;height:92px;color:#afb1b8;border:1px solid #afb1b8;border-radius:4px;transition:border-color 250ms ease,color 250ms ease;animation:scaleIn 550ms ease both}.clients-item:nth-child(2) .clients-link{animation-delay:80ms}.clients-item:nth-child(3) .clients-link{animation-delay:160ms}.clients-item:nth-child(4) .clients-link{animation-delay:240ms}.clients-item:nth-child(5) .clients-link{animation-delay:320ms}.clients-item:nth-child(6) .clients-link{animation-delay:400ms}.clients-link:hover,.clients-link:focus{color:var(--hover_and_logo-color);border-color:var(--hover_and_logo-color)}.clients-icon{width:106px;height:60px;fill:currentColor}.footer-address{font-style:normal;color:var(--photo_and_h1-color)}.footer-container{display:flex;align-items:flex-start;gap:70px}.footer-logo{margin-bottom:20px;margin-top:60px}.footer-email,.footer-phone{color:var(--maintext-color)}.footer-socials{margin-top:72px}.footer-socials-title{margin:0 0 20px;font-family:"Montserrat",sans-serif;font-size:14px;font-weight:700;line-height:1.14;text-transform:uppercase;color:var(--photo_and_h1-color)}.footer-social-link{color:var(--photo_and_h1-color);background-color:rgba(255,255,255,0.1)}.footer-social-link:hover,.footer-social-link:focus{color:var(--photo_and_h1-color);background-color:var(--hover_and_logo-color)}.footer-subscribe{margin-top:72px;margin-left:auto}.footer-subscribe-title{margin:0 0 20px;font-family:"Montserrat",sans-serif;font-size:14px;font-weight:700;line-height:1.14;text-transform:uppercase;color:var(--photo_and_h1-color)}.footer-subscribe-form{display:flex;align-items:center;gap:12px}.footer-subscribe-input{width:358px;height:50px;padding:0 16px;border:1px solid rgba(255,255,255,0.3);border-radius:4px;background-color:transparent;color:var(--photo_and_h1-color);outline:transparent;transition:border-color 250ms ease}.footer-subscribe-input::placeholder{color:rgba(255,255,255,0.6)}.footer-subscribe-input:focus{border-color:var(--hover_and_logo-color)}.footer-subscribe-btn{display:inline-flex;align-items:center;gap:10px;min-width:200px;height:50px;padding:0 24px;border:none;border-radius:4px;background-color:var(--hover_and_logo-color);color:var(--photo_and_h1-color);cursor:pointer;transition:background-color 250ms ease,box-shadow 250ms ease;box-shadow:0px 4px 4px rgba(0,0,0,0.15)}.footer-subscribe-btn:hover,.footer-subscribe-btn:focus{background-color:#188ce8;box-shadow:0px 4px 10px rgba(0,0,0,0.25)}.footer-subscribe-icon{width:24px;height:24px;fill:currentColor}.filters{display:flex;justify-content:center;gap:8px;margin-bottom:50px}.filters-button{padding:6px 22px;font-family:"Montserrat",sans-serif;font-weight:500;font-size:16px;line-height:1.62;background-color:var(--third_background-color);color:var(--nav_and_h-color);border:none;border-radius:4px;cursor:pointer;transition:background-color 250ms ease,color 250ms ease,box-shadow 250ms ease,transform 250ms ease;animation:fadeInDown 500ms ease both}.filters-item:nth-child(2) .filters-button{animation-delay:80ms}.filters-item:nth-child(3) .filters-button{animation-delay:160ms}.filters-item:nth-child(4) .filters-button{animation-delay:240ms}.filters-item:nth-child(5) .filters-button{animation-delay:320ms}.filters button:hover,.filters button:focus{background-color:var(--hover_and_logo-color);color:#fff;transform:translateY(-2px);box-shadow:0px 3px 1px rgba(0,0,0,0.1),0px 1px 2px rgba(0,0,0,0.08),0px 2px 2px rgba(0,0,0,0.12)}.filters button:active{background-color:var(--hover_and_logo-color);color:#fff;box-shadow:0px 3px 1px rgba(0,0,0,0.1),0px 1px 2px rgba(0,0,0,0.08),0px 2px 2px rgba(0,0,0,0.12)}.portfolio{display:flex;flex-wrap:wrap;gap:30px}.portfolio-item{flex:1 0 calc((100% - 60px) / 3);max-width:404px;background-color:#fff;outline:transparent;animation:fadeInUp 650ms ease both;transition:transform 250ms ease,box-shadow 250ms ease;box-shadow:0px 1px 1px rgba(0,0,0,0.12),0px 4px 4px rgba(0,0,0,0.06),1px 4px 6px rgba(0,0,0,0.16)}.portfolio-item:nth-child(3n+2){animation-delay:120ms}.portfolio-item:nth-child(3n){animation-delay:240ms}.portfolio-item:hover,.portfolio-item:focus-within{transform:translateY(-6px);box-shadow:0px 6px 12px rgba(0,0,0,0.12),0px 8px 18px rgba(0,0,0,0.08),1px 8px 16px rgba(0,0,0,0.14)}.portfolio-thumb{position:relative;overflow:hidden}.portfolio-image{width:370px;height:294px;display:block;object-fit:cover}.portfolio-item .portfolio-overlay{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:24px;font-size:16px;line-height:1.56;color:var(--photo_and_h1-color);background-color:rgba(33,150,243,0.9);transform:translateY(100%);transition:transform 250ms cubic-bezier(0.4,0,0.2,1)}.portfolio-item:hover .portfolio-overlay,.portfolio-item:focus .portfolio-overlay,.portfolio-item:focus-within .portfolio-overlay{transform:translateY(0)}.portfolio-content{padding:20px 24px;border:1px solid #eeeeee;border-top:none}.backdrop{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;padding:20px;background-color:rgba(46,47,66,0.4);opacity:1;visibility:visible;overflow-y:auto;transition:opacity 250ms cubic-bezier(0.4,0,0.2,1),visibility 250ms cubic-bezier(0.4,0,0.2,1)}.backdrop.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.no-scroll{overflow:hidden}.modal{position:absolute;top:50%;left:50%;width:100%;max-width:528px;min-height:581px;padding:72px 40px 40px;border-radius:4px;background-color:#ffffff;opacity:1;transform:translate(-50%,-50%) scale(1);transition:opacity 250ms cubic-bezier(0.4,0,0.2,1),transform 250ms cubic-bezier(0.4,0,0.2,1);box-shadow:0px 1px 3px rgba(0,0,0,0.12),0px 1px 1px rgba(0,0,0,0.14),0px 2px 1px rgba(0,0,0,0.2)}.backdrop:not(.is-hidden) .modal{animation:modalOpen 300ms cubic-bezier(0.4,0,0.2,1) both}.backdrop.is-hidden .modal{opacity:0;transform:translate(-50%,-50%) scale(0.8)}.modal-close-btn{position:absolute;top:8px;right:8px;display:flex;align-items:center;justify-content:center;width:30px;height:30px;padding:0;border:1px solid rgba(0,0,0,0.1);border-radius:50%;background-color:#f5f4fa;color:var(--secondlogo-color);cursor:pointer;transition:background-color 250ms ease,color 250ms ease,border-color 250ms ease}.modal-close-btn:hover,.modal-close-btn:focus{background-color:var(--hover_and_logo-color);color:var(--photo_and_h1-color);border-color:var(--hover_and_logo-color)}.modal-close-icon{width:18px;height:18px;fill:currentColor}.modal-form{display:flex;flex-direction:column}.modal-title{margin:0 0 16px;text-align:center;font-family:"Montserrat",sans-serif;font-size:20px;font-weight:700;line-height:1.2;color:var(--nav_and_h-color)}.modal-label{display:block;margin-bottom:10px}.modal-wrap{position:relative;display:block}.modal-text{display:block;margin-bottom:4px;font-size:12px;line-height:1.16;color:var(--maintext-color)}.modal-input,.modal-textarea{width:100%;border:1px solid rgba(33,33,33,0.2);border-radius:4px;outline:transparent;transition:border-color 250ms ease,box-shadow 250ms ease}.modal-input{height:40px;padding:0 16px 0 42px}.modal-textarea{min-height:120px;padding:12px 16px;resize:none}.modal-input:hover,.modal-input:focus,.modal-textarea:hover,.modal-textarea:focus{border-color:var(--hover_and_logo-color);box-shadow:0px 0px 0px 1px rgba(33,150,243,0.2)}.modal-input-icon{position:absolute;top:50%;left:16px;width:18px;height:18px;fill:var(--nav_and_h-color);transform:translateY(-50%);pointer-events:none;transition:fill 250ms ease}.modal-wrap:hover .modal-input-icon,.modal-input:focus+.modal-input-icon{fill:var(--hover_and_logo-color)}.modal-textarea::placeholder{color:rgba(117,117,117,0.5)}.modal-checkbox-label{display:flex;align-items:center;gap:8px;margin:10px 0 24px;font-size:14px;color:var(--maintext-color)}.modal-checkbox{width:16px;height:16px;margin:0;accent-color:var(--hover_and_logo-color)}.modal-policy-link{color:var(--hover_and_logo-color);text-decoration:underline}.modal-submit-btn{min-width:169px;margin:0 auto;padding:10px 32px;border:none;border-radius:4px;background-color:var(--hover_and_logo-color);color:var(--photo_and_h1-color);cursor:pointer;transition:background-color 250ms ease,box-shadow 250ms ease;box-shadow:0px 4px 4px rgba(0,0,0,0.15)}.modal-submit-btn:hover,.modal-submit-btn:focus{background-color:#188ce8;box-shadow:0px 4px 10px rgba(0,0,0,0.25)}