.side-info-4 .offcanvas-4 .contact-meta { display: grid; margin-bottom: 92px; grid-template-columns: 325px auto 182px; }
@media only screen and (max-width: 1919px) { .side-info-4 .offcanvas-4 .contact-meta { grid-template-columns: 200px auto 182px; } }
.side-info-4 .offcanvas-4 .contact-item { gap: 0px; flex-direction: column; align-items: flex-start; }
.side-info-4 .offcanvas-4 .contact-item .title { color: #999999; font-size: 18px; font-weight: 400; line-height: 20px; letter-spacing: -0.54px; margin-bottom: 30px; }
.dark .side-info-4 .offcanvas-4 .contact-item .title { color: #555555; }
.side-info-4 .offcanvas-4 .contact-item .socail-media li { list-style: none; }
.side-info-4 .offcanvas-4 .contact-item .socail-media li a { font-size: 18px; font-weight: 400; line-height: 50px; color: var(--primary); letter-spacing: -0.54px; font-family: var(--font_bdogrotesk); }
.side-info-4 .offcanvas-4 .contact-item .socail-media li a:hover { color: var(--secondary); }
.side-info-4 .offcanvas-4 .contact-item .nav-list li { list-style: none; transform: translateY(-20px); }
.side-info-4 .offcanvas-4 .contact-item .nav-list li a { color: var(--secondary); font-size: 90px; font-weight: 400; line-height: 100px; letter-spacing: -4.5px; font-family: var(--font_bdogrotesk); }
@media only screen and (max-width: 1919px) { .side-info-4 .offcanvas-4 .contact-item .nav-list li a { font-size: 80px; } }
.side-info-4 .offcanvas-4 .contact-item .nav-list li a:hover { color: var(--primary); }
.side-info-4 .offcanvas-4 .contact-item .info a { font-size: 18px; position: relative; font-weight: 400; line-height: 20px; color: var(--primary); font-family: var(--font_bdogrotesk); }
.side-info-4 .offcanvas-4 .contact-item .info a::before { left: 0; bottom: 0; content: ""; width: 100%; height: 2px; position: absolute; transition: all 0.3s; background: currentColor; }
.side-info-4 .offcanvas-4 .contact-item .info a:hover { color: #555; }
.side-info-4 .offcanvas-4 .contact-item .info a:hover::before { width: 0; }

.side-info-4 .offcanvas-4-media { max-width: 440px; height: 290px; right: 30px; bottom: 30px; overflow: hidden; position: absolute; border-radius: 15px; }
.side-info-4 .offcanvas-4-media img { width: 100%; height: 100%; object-fit: cover; }
.side-info-4 .offcanvas-4 .side-info-close {
  width: 200px; height: 70px; display: flex; font-size: 16px; font-weight: 400; line-height: 20px; padding: 29px 25px; border-radius: 15px; color: var(--primary); align-items: center; background-color: #F3F3F3; letter-spacing: -0.48px; justify-content: space-between; font-family: var(--font_bdogrotesk); border: 1px solid var(--border);
}
.dark .side-info-4 .offcanvas-4 .side-info-close { background-color: #1B1B1B; }
.side-info-4 .offcanvas-4 .side-info-close:hover { transform: rotate(0deg); border-color: transparent; background-color: var(--black); color: var(--white); }
.dark .side-info-4 .offcanvas-4 .side-info-close:hover { background-color: var(--white); color: var(--black); }

.text-invert > div {
  background-image: linear-gradient(to right, var(--primary) 50%, rgba(17, 17, 17, 0.3) 50%);
  background-size: 200% 100%; background-position-x: 100%; color: transparent; background-clip: text; -webkit-background-clip: text;
}