*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#030303;color:#fff}
body{font-family:Manrope,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.page{
  min-height:100svh;
  background:radial-gradient(circle at center, rgba(205,156,72,.10), transparent 32%), #030303;
  display:flex;
  flex-direction:column;
}
.hero{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px 18px 0;
}
.hero img{
  width:min(100%,1500px);
  max-height:calc(100svh - 86px);
  height:auto;
  object-fit:contain;
  display:block;
  filter:drop-shadow(0 28px 80px rgba(0,0,0,.55));
}
.contact-bar{
  min-height:76px;
  padding:16px max(18px, env(safe-area-inset-left)) max(18px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-right));
  display:flex;
  align-items:center;
  justify-content:center;
  gap:26px;
  border-top:1px solid rgba(201,151,74,.34);
  background:linear-gradient(180deg, rgba(3,3,3,.88), #030303);
  letter-spacing:.02em;
}
.contact-bar a,.contact-bar p{
  margin:0;
  color:#f7ead4;
  text-decoration:none;
  font-size:16px;
  line-height:1.2;
}
.contact-bar a:hover{color:#d5a44f}
.contact-bar span{width:1px;height:22px;background:rgba(213,164,79,.62)}
@media(max-width:760px){
  .hero{flex:1;padding:10px 0 0}
  .hero img{width:100%;max-height:calc(100svh - 112px);object-fit:contain}
  .contact-bar{
    min-height:112px;
    flex-direction:column;
    gap:5px;
    padding:14px 16px max(16px, env(safe-area-inset-bottom));
  }
  .contact-bar span{display:none}
  .contact-bar a,.contact-bar p{font-size:14px}
}
@media(max-width:390px){
  .hero img{max-height:calc(100svh - 104px)}
  .contact-bar{min-height:104px}
  .contact-bar a,.contact-bar p{font-size:13px}
}