*{margin:0 auto;padding:0;box-sizing:border-box;font-family:Roboto,sans-serif}html{scroll-behavior:smooth}html,body{min-height:100%;background-color:#f5f5f5}.container{max-width:1280px;margin:0 auto;padding:0 16px}.navigation{background:linear-gradient(to right,#0172af,#74febd);display:flex;justify-content:space-between;align-items:center;height:64px;padding:0 16px;background-color:#fff;position:sticky;top:0;z-index:100}.title-name{font-size:22px;display:flex;padding-left:16px;overflow:hidden;color:#116b7a;max-width:200px}.menu-link:hover{box-shadow:0 1px 2px #0000000d;color:#ec4899}.menu{display:flex;justify-content:space-between;padding-right:16px;gap:8px}.nav-link{font-size:24px;color:#caf0f8;padding:8px 12px;border-radius:6px}.nav-link.active{color:#ec4899}.menu-link{text-decoration:none}.hamburger{display:none;background:none;border:none;cursor:pointer;padding:8px}.hamburger span{display:block;width:24px;height:2px;background-color:#116b7a;margin:6px 0;transition:.3s}.hero-section{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px;flex-wrap:wrap}.hero-section>div:first-child{flex:1;min-width:250px}.hero-title{color:#0c165f33;padding-top:24px;padding-bottom:24px;font-size:2rem}.hero-section p{font-size:1.1rem;margin:8px 0;color:#050505cc}.image{height:380px;width:300px;object-fit:cover;border-radius:20px;border:1px solid #caf0f8;box-shadow:5px 5px 15px #0000004d;flex-shrink:0}.skills-section{padding:24px}.skills-title{color:#050505cc;padding-top:24px;padding-bottom:24px;text-align:center;font-size:1.8rem}.skills-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin:8px auto;max-width:880px;justify-items:stretch}.skill-item{width:100%;background-color:#a4a4a4e6;border:2px solid rgba(94,112,247,.2);border-radius:12px;padding:16px;color:#fafafae6;cursor:pointer;transition:transform .4s ease-out,box-shadow .4s ease-out;display:flex;flex-direction:column;align-items:center;justify-content:center}.skill-item:hover{transform:translateY(-5px) scale(1.05);box-shadow:0 10px 25px #0003}.skill-image{width:80px;margin:4px}.skill-title{font-size:1.5rem}.projects-section{padding:24px}.projects-title{color:#050505cc;padding-top:24px;padding-bottom:24px;text-align:center;font-size:1.8rem}.works{display:grid;grid-template-columns:repeat(3,1fr);justify-content:center;align-items:center;gap:16px}.project{display:flex;justify-content:center;align-items:center;flex-direction:column;height:100%;padding:12px}.project-title{text-align:center;font-size:1.5rem;line-height:1.2rem;font-weight:500;margin:8px}.project-img{width:300px;max-width:100%;height:auto;border-radius:12px;transition:transform .3s ease,box-shadow .3s ease;box-shadow:0 4px 6px #0000001a}.project-img:hover{transform:scale(1.05);box-shadow:0 10px 20px #0003}.project-descr{padding-top:8px;font-weight:500;font-style:italic;text-align:center;transition:max-height .6s ease-in-out,opacity .5s ease}.project-btn{display:none;margin:6px;padding:8px 12px;background-color:#183d86;color:#fff;border-radius:12px;border:none;font-size:16px;box-shadow:3px 3px 10px #0000004d}.contact-section{padding:24px}.contact-title{color:#050505cc;padding-top:20px;padding-bottom:20px;text-align:center;font-size:1.8rem}.form{max-width:500px;margin:0 auto}.block{display:flex;flex-direction:column;margin-bottom:16px}.message-description{margin:8px 0;font-weight:500;color:#050505cc}.name-input,.email-input,.message-input{font-size:16px;width:100%;border-radius:12px;padding:8px 16px;border:1px solid #caf0f8;box-shadow:9px 9px 16px #a3b1c699,-9px -9px 16px #ffffff80}.name-input,.email-input{min-height:40px}.message-input{resize:vertical;min-height:100px;box-shadow:9px 9px 16px #a3b1c699,-9px -9px 16px #ffffff80}.btn-container{text-align:center;margin-top:16px}.submit-button{min-width:100px;border:0;border-radius:5px;background:#4676d7;color:#fff;padding:8px 16px;font-size:1rem;cursor:pointer;transition:background .3s}.submit-button:hover{background:#3e5fa3}.footer-section{padding:24px;background-color:#c7c7c799}.footer-contacts{display:grid;justify-content:end}.contact-icon{width:30px}.contact-icon_svg-mail{stroke:#24a1de}.contact-icon_svg-tg,.contact-icon_svg-gh{fill:#24a1de}.copyright{margin:8px auto;text-align:center}@media(max-width:768px){.menu{display:none;position:absolute;top:64px;right:0;background-color:#fff;flex-direction:column;width:100%;padding:16px 0;gap:0}.menu.active{display:flex}.hamburger{display:block}.title-name{font-size:16px;max-width:120px}.nav-link{font-size:1rem;padding:12px 16px;text-align:left;border-radius:0}.hero-section{flex-direction:column;padding:16px}.hero-title{font-size:1.5rem;padding-top:16px;padding-bottom:16px}.hero-section p{font-size:.95rem}.image{width:100%;max-width:280px;height:280px}.skills-list{grid-template-columns:repeat(2,1fr);gap:12px;margin:0;max-width:100%}.skill-item{min-height:120px;padding:15px 12px}.skill-image{width:48px}.skills-title{font-size:1.3rem}.works{grid-template-columns:repeat(2,1fr)}.projects-title{font-size:1.3rem}.project-img{width:100%;max-width:250px}.project-descr.clamped{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-height:3em;opacity:.8}.project-descr.expanded{display:block;-webkit-line-clamp:unset;max-height:100px;opacity:1}.project-btn{display:block}.contact-title{font-size:1.3rem}.form{padding:0 16px}}@media(max-width:480px){.title-name{font-size:14px;max-width:100px}.navigation{height:56px;padding:0 12px}.hero-section{padding:12px}.hero-title{font-size:1.3rem;padding-top:12px;padding-bottom:12px}.hero-section p{font-size:.9rem}.image{width:100%;max-width:240px;height:240px}.skills-list{grid-template-columns:repeat(2,1fr);gap:10px;margin:0;max-width:100%}.skills-title{font-size:1.2rem}.skill-item{font-size:.85rem;padding:12px 8px;min-height:110px}.skill-image{width:40px;margin:2px}.projects-title{font-size:1.2rem}.project-title{font-size:1.1rem}.project-img{width:100%;max-width:200px}.contact-title{font-size:1.2rem}.contact-title h2{margin:0}.form{padding:0 12px}.message-description{font-size:.9rem}.name-input,.email-input,.message-input{font-size:14px;padding:6px 12px}.footer-section{padding:16px}.footer-contacts{justify-content:center}.contact-icon{width:24px}}