:root {
  font-family: Futura, "Futura PT", "Avenir Next", "Century Gothic", Montserrat, sans-serif;
  font-synthesis: none;
  color: #f4f1e9;
  background: #090c0e;
}

* { box-sizing: border-box; }
html, body { width: 100%; min-height: 100%; margin: 0; }
body { background: #090c0e; }
a { color: inherit; }

.landing { position: relative; min-height: 100svh; overflow: hidden; display: grid; place-items: center; perspective: 1100px; transform-style: preserve-3d; background: #05090e; }
.background { position: absolute; inset: -1.25%; width: 102.5%; height: 102.5%; object-fit: cover; object-position: 50% 52%; transform: translate3d(var(--depth-bg-x, 0px), var(--depth-bg-y, 0px), -12px) scale(1.014); will-change: transform; }
.shade { position: absolute; inset: 0; transform: translateZ(0); background: linear-gradient(180deg, rgba(4,7,10,.2), rgba(4,7,10,.04) 44%, rgba(4,7,10,.78) 100%), radial-gradient(circle at var(--depth-light-x, 50%) var(--depth-light-y, 42%), rgba(170,202,226,.065), transparent 26%), radial-gradient(ellipse at 50% 48%, transparent 29%, rgba(1,3,6,.42) 100%); }

.identity { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; transform: translate3d(var(--depth-front-x, 0px), calc(-8vh + var(--depth-front-y, 0px)), 36px); will-change: transform; }
.identity img { width: clamp(3.1rem, 4.7vw, 5.1rem); height: clamp(3.1rem, 4.7vw, 5.1rem); margin-bottom: 1.25rem; opacity: 1; }
.identity h1 { margin: 0; font-family: "Satoshi", "Avenir Next", "Helvetica Neue", Arial, sans-serif; font-size: clamp(1.4rem, 2.15vw, 2.25rem); font-weight: 300; letter-spacing: .16em; text-shadow: 0 1px 2px rgba(0,0,0,.7), 0 7px 24px rgba(0,0,0,.52), 0 18px 46px rgba(0,0,0,.28); }
.identity p { margin: .85rem 0 0; color: rgba(255,255,255,.9); font-size: clamp(.62rem, .72vw, .76rem); font-weight: 500; letter-spacing: .13em; text-transform: uppercase; text-shadow: 0 1px 2px rgba(0,0,0,.75), 0 6px 20px rgba(0,0,0,.46), 0 15px 38px rgba(0,0,0,.24); }

footer { position: absolute; z-index: 1; left: clamp(1.2rem, 3.5vw, 4rem); right: clamp(1.2rem, 3.5vw, 4rem); bottom: clamp(1.3rem, 2.7vw, 3rem); display: grid; grid-template-columns: 1fr auto 1fr; gap: clamp(2rem, 5vw, 6rem); align-items: end; padding-top: 1.15rem; border-top: 1px solid rgba(255,255,255,.25); font-size: clamp(.67rem, .8vw, .82rem); letter-spacing: .015em; transform: translate3d(var(--depth-mid-x, 0px), var(--depth-mid-y, 0px), 18px); will-change: transform; }
footer > a, .online, .phones { text-decoration: none; line-height: 1.6; }
footer span { display: block; margin-bottom: .45rem; color: rgba(244,241,233,.52); font-size: .55rem; letter-spacing: .18em; text-transform: uppercase; }
.online { display: flex; flex-direction: column; align-items: flex-start; }
.online a { text-decoration: none; }
.online a + a { margin-top: .12rem; color: rgba(244,241,233,.68); }
.online a, .phones a, .address { transition: color .22s ease, opacity .22s ease; }
.online a:hover, .phones a:hover, .address:hover { color: #fff; }
.phones { display: flex; flex-direction: column; align-items: flex-start; justify-self: center; }
.phones span { grid-column: 1 / -1; }
.phones a { text-decoration: none; white-space: nowrap; }
.phones a + a { margin-top: .12rem; }
.address { text-align: right; }

@media (max-width: 760px) {
  .background { object-position: 47% 50%; }
  .shade { background: linear-gradient(180deg, rgba(4,7,10,.16), rgba(4,7,10,.04) 16%, rgba(2,4,7,.4) 26%, rgba(2,4,7,.32) 36%, rgba(2,4,7,.04) 48%, rgba(4,7,10,.78) 100%), radial-gradient(circle at 50% 40%, transparent 10%, rgba(2,4,6,.22) 100%); }
  .identity { transform: translate3d(var(--depth-front-x, 0px), calc(-20vh + var(--depth-front-y, 0px)), 24px); }
  .identity h1 { font-size: 1.3rem; letter-spacing: .04em; }
  .identity p { max-width: 18rem; line-height: 1.7; }
  footer { grid-template-columns: 1fr 1fr; gap: 1.2rem 1.6rem; font-size: .65rem; }
  .phones { justify-self: end; }
  .address { grid-column: 1 / -1; text-align: left; padding-top: .8rem; border-top: 1px solid rgba(255,255,255,.15); }
}

@media (max-width: 430px) {
  footer { grid-template-columns: 1fr; gap: .7rem; }
  footer > a, .online, .phones { padding-top: .55rem; border-top: 1px solid rgba(255,255,255,.13); }
  .online { border-top: 0; }
  .address { grid-column: auto; }
  .phones { justify-self: start; }
  .identity { transform: translate3d(var(--depth-front-x, 0px), calc(-26vh + var(--depth-front-y, 0px)), 24px); }
}

@media (prefers-reduced-motion: reduce) {
  .background { transform: none; }
  .identity, footer { will-change: auto; }
}