:root {
    /* Farben aus der Einladung (ca.) */
    --kotc-navy: #021933;
    --kotc-navy-dark: #011223;
    --kotc-teal: #1ea6c6;
    --kotc-gold: #f4b321;
    --kotc-light: #f4f7fb;
    --kotc-text-muted: #cfd6e3;
}


.passion-one-regular {
  font-family: "Passion One", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.passion-one-bold {
  font-family: "Passion One", sans-serif;
  font-weight: 700;
  font-style: normal;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Bebas Neue", sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 2px;
}

body {
  font-family: "Roboto", sans-serif;

}

.lexend-deca-<uniquifier> {
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}



/* Body-Hintergrund leicht angelehnt an die Einladung */
.bg-kotc-body {
    background: radial-gradient(circle at top left, rgba(30,166,198,0.35), transparent 55%),
                radial-gradient(circle at bottom right, rgba(30,166,198,0.25), transparent 50%),
                var(--kotc-navy-dark);
    color: #ffffff;
}

/* Container-Karten etwas hervorheben */
.card {
    border: none;
    border-radius: 0.75rem;
}

/* Inhalt in Karten bleibt hell */
.card,
.card-body,
.card-title,
.card-subtitle,
.card p {
    color: #0b1220;
}

/* Navbar im KOTC-Stil */
.bg-kotc-nav {
    background: linear-gradient(90deg, var(--kotc-navy-dark), var(--kotc-navy));
}

.navbar-brand img {
    display: block;
}

.navbar-brand span {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.9rem;
}

.navbar-dark .navbar-nav .nav-link {
    font-weight: 500;
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 0.08em;
    color: var(--kotc-text-muted);
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link.active {
    color: #ffffff;
}

/* Footer */
.bg-kotc-footer {
    background-color: var(--kotc-navy-dark);
}

.text-kotc-footer {
    color: var(--kotc-text-muted);
}

/* Buttons im KOTC-Gold */
.btn-kotc-primary,
.btn-primary {
    background-color: var(--kotc-navy);
    border-color: var(--kotc-gold);
    color: #FFFFFF;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.btn-kotc-primary:hover,
.btn-primary:hover {
    background-color: #ffcb3b;
    border-color: #ffcb3b;
    color: #021933;
}

/* Badges in Gold/Türkis */
.badge.bg-secondary {
    background-color: var(--kotc-teal) !important;
}

/* Überschriften leicht stilisieren */
h1, h2, h3, h4 {
    font-weight: 700;
}

/* Kleine Helferklasse für Sektionen */
.kotc-section {
    background-color: var(--kotc-gold);
    border-radius: 0.75rem;
    padding: 1.5rem;
}
.bg-kotc-subnav {
    background-color: rgba(2, 25, 51, 0.98);
}

.text-kotc-subnav-label {
    color: rgba(255, 255, 255, 0.8);
    letter-spacing: 0.08em;
}

.bg-kotc-subnav .nav-link {
    color: rgba(255, 255, 255, 0.75);
    border-radius: 999px;
    border: 1px solid transparent;
}

.bg-kotc-subnav .nav-link:hover {
    border-color: rgba(255, 255, 255, 0.3);
}

.bg-kotc-subnav .nav-link.active {
    background-color: var(--kotc-teal, #16e0c0);
    color: #021933;
    border-color: transparent;
    font-weight: 600;
}

.hero-img {
    max-height: 380px;
    object-fit: cover;
}

.hero-overlay {
    text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}


.alert-success {
	background-color: var(--kotc-teal);
	color: #FFF;
	border: none;
}

p a, .alert-success a {
	color: #FFF;
}

p a:hover, .alert-success a:hover {
	color: rgba(255,255,255,0.5);
}