.contacts{background:var(--bg-clr);min-height:100svh}.contacts-inner{gap:20px;padding:0 20px 20px;display:flex}.contacts__title{margin-bottom:40px;font-size:2rem;font-weight:500}.contacts-details{flex-direction:column;width:100%;display:flex}.contacts-details__link{font-weight:300}.contacts-form{width:100%}.form{background:#000;border-radius:20px;flex-direction:column;gap:40px;height:100%;padding:40px;display:flex}.input-container{flex-direction:column;padding-bottom:5px;display:flex;position:relative}.input-container:before{content:"";background:#ffffff80;width:100%;height:2px;position:absolute;bottom:0;left:0}.input-container:after{content:"";transform-origin:0;background:#fff;width:100%;height:2px;transition:transform .5s;position:absolute;bottom:0;left:0;transform:scaleX(0)}.input-container label{transition:transform .5s,color .5s,font-size .5s;position:absolute}.input-container ::placeholder{opacity:0;transition:opacity .5s}.input-container:has(input:disabled,textarea:disabled):after{background:#adff2f}.input-container:focus-within:after{transform:scaleX(1)}.input-container:focus-within label{color:#ffffff80;font-size:14px;transform:translateY(-20px)}.input-container:focus-within ::placeholder{opacity:1}.input-container--active:after{transform:scaleX(1)}.input-container--active label{color:#ffffff80;font-size:14px;transform:translateY(-20px)}.textarea{resize:none;flex-grow:1}.form__btn{background:#2f5b72;border-radius:10px;padding:10px;font-weight:500}.form__btn:disabled{color:#000;background:#adff2f}@media screen and not (min-width:1000px){.contacts-details{flex-direction:column;width:100%;display:flex}}@media screen and not (min-width:800px){.contacts-inner{flex-direction:column}.form{gap:40px;padding:20px}}
