:root{
  --bg: #0b0f14;
  --bg-soft: #0f141b;
  --fg: #e9edf3;
  --muted: #a8b0bd;
  --card: #121823cc;
  --ring: #2e7d3233;
  --brand: #2e7d32;
  --shadow: 0 10px 30px rgba(0,0,0,.35);
}

@media (prefers-color-scheme: light) {
  :root{
    --bg: #f5f7fb;
    --bg-soft: #eef2f9;
    --fg: #0d1220;
    --muted: #5b6473;
    --card: #ffffffcc;
    --ring: #2e7d3233;
  }
}

*{ box-sizing: border-box; }
html, body { height: 100%; }

body{
  margin: 0;
  font-family: Montserrat, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--fg);
  background:
    radial-gradient(1200px 600px at 10% -10%, #2e7d3222, transparent 60%),
    radial-gradient(900px 500px at 110% 10%, #22d3ee22, transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg-soft));
  display: grid;
  place-items: center;
  padding: 24px;
}

.wrap{
  width: min(900px, 100%);
  display: grid;
  gap: 24px;
}

.card{
  backdrop-filter: blur(8px);
  background: var(--card);
  border: 1px solid #ffffff12;
  border-radius: 20px;
  padding: clamp(24px, 6vw, 48px);
  text-align: center;
  animation: pop .5s ease backwards;
}

@keyframes pop{
  from{ transform: translateY(6px); opacity: 0; }
  to  { transform: translateY(0); opacity: 1; }
}

.logo{
  margin-inline: auto;
  width: clamp(180px, 40vw, 320px);
  color: var(--brand);
}
.logo svg, .logo img{ display:block; width:100%; height:auto; }

.lead{
  margin: 18px auto 8px;
  font-size: clamp(1.05rem, 2.2vw, 1.25rem);
  line-height: 1.6;
  color: var(--fg);
  max-width: 60ch;
}

.contacts{
  margin: 22px auto 10px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
}
@media (max-width: 640px){
  .contacts{ grid-template-columns: 1fr; }
}

.contact{
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  text-decoration: none;
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
  color: var(--fg);
}
.contact:hover{
  transform: translateY(-1px);
  border-color: #ffffff30;
  box-shadow: 0 6px 16px #00000022, 0 0 0 6px var(--ring);
}

.contact-label{
  font-size: .8rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--muted);
}
.contact-value{
  font-weight: 600;
  font-size: 1rem;
  word-break: break-word;
}

.small{
  margin-top: 8px;
  color: var(--muted);
  font-size: .95rem;
}

.footer{
  text-align: center;
  color: var(--muted);
  font-size: .9rem;
}

.sr-only{
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}