/* SAUMI Turnier – gemeinsame Design-Tokens (Vorlage: bluemindgames.com) */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=Montserrat:wght@400;500;600;700&display=swap');

:root {
  --navy: #0A2540;
  --navy-900: #061A2E;
  --navy-800: #0B2A47;
  --navy-700: #12365A;
  --navy-600: #1B4670;
  --blue: #0096C7;
  --blue-light: #4FC3E8;
  --green: #26A960;
  --green-dark: #0B522B;
  --gold: #FFC94D;
  --gold-dark: #E0A21B;
  --silver: #C9D3DD;
  --bronze: #D88C4A;
  --red: #E5484D;
  --white: #FFFFFF;
  --grey-100: #F4F6F8;
  --grey-200: #E6E6E6;
  --grey-400: #9AA8B6;
  --grey-600: #5B6B7B;
  --text: #0A2540;
  --text-muted: rgba(10, 37, 64, 0.6);

  --font-heading: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --font-body: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --radius-sm: 6px;
  --radius: 12px;
  --radius-lg: 20px;
  --radius-pill: 999px;
  --shadow: 0 4px 20px rgba(10, 37, 64, 0.12);
  --shadow-lg: 0 12px 40px rgba(6, 26, 46, 0.35);
  --ease: cubic-bezier(.25, .1, .25, 1);
}

*, *::before, *::after { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }

body {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.5;
  color: var(--text);
  background: var(--grey-100);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, .heading {
  font-family: var(--font-heading);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.1;
  margin: 0 0 0.5em;
}

.time {
  font-family: var(--font-heading);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4em;
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.55em 1.4em;
  border: 2px solid transparent;
  border-radius: var(--radius-pill);
  background: var(--blue);
  color: var(--white);
  cursor: pointer;
  text-decoration: none;
  transition: transform .15s var(--ease), background .15s var(--ease), box-shadow .15s var(--ease);
}
.btn:hover { transform: translateY(-1px); box-shadow: var(--shadow); }
.btn:active { transform: translateY(0); }
.btn:disabled { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }
.btn-navy { background: var(--navy); }
.btn-green { background: var(--green); }
.btn-danger { background: var(--red); }
.btn-ghost { background: transparent; color: inherit; border-color: currentColor; }
.btn-sm { font-size: 14px; padding: 0.35em 1em; }

input, select, textarea, button { font: inherit; }

.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}
