@import url('https://fonts.googleapis.com/css2?family=League+Spartan:wght@300;600;800&display=swap');

*, *::before, *::after { box-sizing: border-box; }
html, body { height: 100%; margin: 0; padding: 0; }

:root {
  --bg_color: #FFFFFF;
  --primary_color: #024E28;
  --accent_color: #eee;
  --text_color: #121212;
  --muted_color: #6b7280;
  --card_color: #ffffff;
  --success_color: #22a06b;
  --danger_color: #ff0000;
  --shadow_lg: 0 18px 40px rgba(17,24,39,0.08);
  --shadow_sm: 0 6px 16px rgba(17,24,39,0.06);

  --shadow: rgba(0,0,0,0.06);
  --logo-size: 40%;
  --app-name-size: 36px;
  --tagline-size: 14px;
}

body {
  background: var(--bg_color);
  font-family: 'League Spartan', sans-serif;
}

.wrap {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 24px;
  background: var(--bg_color);
  width: 100%;
  height: 100%;
}

.content {
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.logo {
  max-width: 260px;
  width: 75%;
  height: auto;
  display: block;
  margin: 0 auto;
  animation: logoZoom 700ms cubic-bezier(.2,.9,.3,1) both;
}

@keyframes logoZoom {
  0%   { transform: scale(0.85); opacity: 0; }
  60%  { transform: scale(1.06); opacity: 1; }
  100% { transform: scale(1); }
}

@media (max-width: 880px) {
  :root { --logo-size: 85%; --app-name-size: 28px; }
}

@media (max-width: 480px) {
  :root { --logo-size: 70%; --app-name-size: 36px; }
}