

    
 
.wrap { padding-left: var(--side); }
.inner { width:100%; max-width:1300px;  margin: 0 auto; }

.logo { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.side-nav { position: fixed; left: 0; top: 0; z-index: 100; width: var(--side); height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 28px 0 0 0; border-right: 1px solid rgba(255,255,255,.09); background: rgba(5,5,7,.88); backdrop-filter: blur(18px); }
       

.side-menu { display: flex; flex-direction: column; align-items: center; gap: 40px; }
.side-menu a { writing-mode: vertical-rl; transform: rotate(180deg); color:#fff; font-size: 22px; font-weight: 800; transition: .25s; letter-spacing:1px }
.side-menu a:hover { color: #fff;  }
.side-contact { writing-mode: vertical-rl; transform: rotate(180deg); display: inline-flex; align-items: center; gap: 8px; color: #ff9ba2; font-size: 12px; font-weight: 900; letter-spacing: .12em; margin-bottom:60px }
.side-contact:before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--red); }

       


.footer { padding: 42px 0 54px; border-top: 1px solid rgba(255,255,255,.09); color: var(--gray); background: #040405; margin-top:100px }
.footer .inner { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.footer .logo { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.footer .logo-mark { line-height:0; }
.footer .logo-text strong { display: block; font-size: 20px; letter-spacing: -.04em; }
.footer .logo-text span { display: block; margin-top: -2px; font-size: 11px; color: var(--muted); letter-spacing: .1em; text-transform: uppercase; }
.footer p { margin-top: 10px; color: rgba(255,255,255,.5); font-size: 14px; }
footer .copy {font-size:14px; white-space:nowrap; text-align:right}
footer a {color: var(--gray);}

@media all and (max-width:1300px) {
  .inner {padding:0 3%; box-sizing:border-box}

}
@media all and (min-width:900px) {
	  .m_top {display:none }
 
}
@media all and (max-width:900px) {
		.side-nav {display:none }
		.m_top {color:#fff; width:100%; height:70px; display:flex; align-items:center; box-sizing:border-box; padding:0 4%;  justify-content: space-between; }
		.ham {width:35px; height:35px; border:1px solid #fff; display:flex; align-items:center; justify-content:center}
		.wrap { padding-left: 0 }

}

@media all and (max-width:900px) {
	.footer .inner { flex-wrap:wrap }
	footer .copy { text-align:left}
 
}