/* ─────────────────────────────────────────────
   FF Gemeinde Herrngiersdorf · Stylesheet v2
   Design: Hell · Feuerwehr-Rot · Professionell
   Font: Outfit 300–800
───────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap');

/* ── Tokens ── */
:root {
  --red:       #CC1414;
  --red2:      #E01C1C;
  --red-dark:  #a01010;
  --red-pale:  #fff0f0;
  --red-mid:   #fce4e4;
  --navy:      #1c2b4a;
  --navy2:     #253660;
  --bg:        #ffffff;
  --bg2:       #f6f5f2;
  --bg3:       #edece8;
  --text:      #1c2b4a;
  --muted:     #5a6a82;
  --subtle:    #9aaabb;
  --border:    #e2e5eb;
  --border2:   #d0d4dc;
  --gold:      #e68b10;
  --gold-pale: #fef3dc;
  --white:     #ffffff;
  --shadow-sm: 0 1px 3px rgba(28,43,74,.08), 0 1px 2px rgba(28,43,74,.04);
  --shadow-md: 0 4px 16px rgba(28,43,74,.10), 0 2px 4px rgba(28,43,74,.06);
  --shadow-lg: 0 12px 40px rgba(28,43,74,.14);
  --ease:      cubic-bezier(0.23, 1, 0.32, 1);
  --r-sm:      0.375rem;
  --r-md:      0.75rem;
  --r-lg:      1rem;
  --r-xl:      1.5rem;
}

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: 'Outfit', -apple-system, sans-serif;
  background: var(--bg);
  color: var(--text);
  font-size: 1rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
body.nav-open { overflow: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { font: inherit; cursor: pointer; border: none; background: none; }
.is-hidden { display: none !important; }

/* ── Typography ── */
.display {
  font-size: clamp(2.5rem, 6vw, 5rem);
  font-weight: 800;
  line-height: 1.0;
  letter-spacing: -0.03em;
  color: var(--white);
}
.headline {
  font-size: clamp(1.75rem, 3.5vw, 2.75rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.025em;
  color: var(--navy);
}
.title {
  font-size: clamp(1.2rem, 2vw, 1.5rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: var(--navy);
}
.overline {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--red);
  display: block;
}
p { max-width: 65ch; line-height: 1.7; color: var(--muted); }
.on-dark { color: rgba(255,255,255,.75); }
.on-dark strong { color: #fff; }

/* ── Layout ── */
.container {
  width: min(100%, 1180px);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}
.section { padding-block: clamp(3.5rem, 7vw, 5.5rem); }
.section-sm { padding-block: clamp(2rem, 4vw, 3.5rem); }

/* ── Navigation ── */
.nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--red);
  box-shadow: 0 2px 12px rgba(204,20,20,.25);
  transition: box-shadow 300ms var(--ease);
}
.nav.scrolled {
  box-shadow: 0 3px 24px rgba(204,20,20,.35);
}
.nav-inner {
  display: flex;
  align-items: center;
  height: 64px;
  gap: 1.5rem;
}
.nav-logo {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  color: #fff;
  flex-shrink: 0;
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: -0.01em;
}
.nav-logo img {
  height: 40px;
  width: auto;
  object-fit: contain;
}
.nav-logo-fallback {
  width: 2.25rem;
  height: 2.25rem;
  background: rgba(255,255,255,.2);
  border-radius: var(--r-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.125rem;
  flex-shrink: 0;
}
.nav-links {
  display: flex;
  align-items: center;
  gap: 0.125rem;
  flex: 1;
}
.nav-links a {
  font-size: 0.875rem;
  font-weight: 600;
  color: rgba(255,255,255,.8);
  padding: 0.4rem 0.75rem;
  border-radius: var(--r-sm);
  transition: color 150ms, background 150ms;
}
@media (hover: hover) and (pointer: fine) {
  .nav-links a:hover { color: #fff; background: rgba(255,255,255,.15); }
}
.nav-links a.active { color: #fff; background: rgba(255,255,255,.18); }
.nav-ticker-wrap {
  margin-left: auto;
  flex-shrink: 0;
  max-width: 360px;
}
.nav-ticker-inner {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: var(--r-md);
  padding: 0.35rem 0.875rem;
  font-size: 0.775rem;
  color: #fff;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  cursor: pointer;
  transition: background 150ms;
  max-width: 360px;
}
@media (hover: hover) and (pointer: fine) {
  .nav-ticker-inner:hover { background: rgba(255,255,255,.22); }
}
.live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
  flex-shrink: 0;
  animation: pulse 2s ease-in-out infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(255,255,255,.4); }
  50% { opacity: 0.6; box-shadow: 0 0 0 5px transparent; }
}
.hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  padding: 0.5rem;
  margin-left: auto;
}
.hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: #fff;
  border-radius: 1px;
}
.mobile-nav {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99;
  background: var(--red);
  padding: 5rem 1.5rem 2rem;
  flex-direction: column;
  gap: 0.25rem;
}
.mobile-nav.open { display: flex; }
.mobile-nav a {
  font-size: 1.5rem;
  font-weight: 700;
  padding: 0.75rem 0;
  color: rgba(255,255,255,.8);
  border-bottom: 1px solid rgba(255,255,255,.15);
}
.mobile-nav a:hover { color: #fff; }

/* ── Buttons ── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1.375rem;
  border-radius: var(--r-md);
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1;
  transition: opacity 200ms var(--ease), transform 200ms var(--ease), background 200ms var(--ease), box-shadow 200ms var(--ease);
}
.btn:active { transform: scale(0.97); }
.btn-red {
  background: var(--red);
  color: #fff;
}
@media (hover: hover) and (pointer: fine) {
  .btn-red:hover { background: var(--red2); box-shadow: 0 4px 16px rgba(204,20,20,.3); }
}
.btn-white {
  background: #fff;
  color: var(--red);
  font-weight: 700;
}
@media (hover: hover) and (pointer: fine) {
  .btn-white:hover { background: var(--red-pale); box-shadow: var(--shadow-md); }
}
.btn-outline-white {
  background: transparent;
  color: #fff;
  border: 2px solid rgba(255,255,255,.6);
}
@media (hover: hover) and (pointer: fine) {
  .btn-outline-white:hover { border-color: #fff; background: rgba(255,255,255,.1); }
}
.btn-outline {
  background: transparent;
  color: var(--navy);
  border: 1.5px solid var(--border2);
}
@media (hover: hover) and (pointer: fine) {
  .btn-outline:hover { border-color: var(--navy); background: var(--bg2); }
}
.btn-navy {
  background: var(--navy);
  color: #fff;
}
@media (hover: hover) and (pointer: fine) {
  .btn-navy:hover { background: var(--navy2); box-shadow: var(--shadow-md); }
}
.btn-sm { padding: 0.45rem 0.875rem; font-size: 0.8rem; }
.btn-lg { padding: 0.8rem 1.75rem; font-size: 0.95rem; }

/* ── Cards ── */
.card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 1.5rem;
  box-shadow: var(--shadow-sm);
  transition: box-shadow 250ms var(--ease), transform 250ms var(--ease);
}
@media (hover: hover) and (pointer: fine) {
  .card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
}
.card-red { background: var(--red-pale); border-color: rgba(204,20,20,.15); }
.card-navy { background: var(--navy); color: #fff; border-color: transparent; }
.card-grey { background: var(--bg2); border-color: var(--border); }

/* ── Einsatzticker bar ── */
.ticker-section {
  background: var(--navy);
  padding-block: 0.875rem;
}
.ticker-bar {
  display: flex;
  align-items: center;
  gap: 1rem;
  color: #fff;
}
.ticker-label {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--red2);
  white-space: nowrap;
  background: rgba(255,255,255,.08);
  border-radius: 4px;
  padding: 0.2rem 0.5rem;
}
.ticker-text {
  font-size: 0.875rem;
  font-weight: 500;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ticker-time {
  font-size: 0.775rem;
  color: rgba(255,255,255,.55);
  white-space: nowrap;
}

/* ── Bento ── */
.bento { display: grid; gap: 1rem; }
.bento-2 { grid-template-columns: 1fr 1fr; }
.bento-3 { grid-template-columns: 1fr 1fr 1fr; }
.span-2 { grid-column: span 2; }

/* ── Section header ── */
.section-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  flex-wrap: wrap;
}
.section-header .overline { margin-bottom: 0.5rem; }

/* ── Einsatz list item ── */
.einsatz-item {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding: 1rem;
  border-radius: var(--r-md);
  border: 1px solid var(--border);
  background: var(--white);
  transition: border-color 200ms var(--ease), box-shadow 200ms var(--ease);
}
@media (hover: hover) and (pointer: fine) {
  .einsatz-item:hover { border-color: var(--red); box-shadow: 0 2px 12px rgba(204,20,20,.08); }
}
.einsatz-badge {
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  padding: 0.25rem 0.5rem;
  border-radius: 4px;
  white-space: nowrap;
  flex-shrink: 0;
  margin-top: 0.125rem;
}
.badge-b { background: #fee2e2; color: #991b1b; }
.badge-thl { background: #dbeafe; color: #1e40af; }
.badge-other { background: var(--bg3); color: var(--muted); }
.einsatz-icon.badge-b { border: 1px solid #fca5a5; }
.einsatz-icon.badge-thl { border: 1px solid #93c5fd; }
.einsatz-icon.badge-other { border: 1px solid var(--border); }

/* ── Termin item ── */
.termin-row {
  display: grid;
  grid-template-columns: 3.5rem 1fr;
  gap: 1rem;
  padding: 0.875rem 0;
  border-bottom: 1px solid var(--border);
  align-items: start;
}
.termin-row:last-child { border-bottom: none; }
.date-box {
  background: var(--red);
  border-radius: var(--r-sm);
  padding: 0.375rem 0.25rem 0.25rem;
  text-align: center;
}
.date-box-day { font-size: 1.375rem; font-weight: 800; line-height: 1; color: #fff; }
.date-box-mon { font-size: 0.6rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(255,255,255,.75); }

/* ── Photo card ── */
.photo-card {
  border-radius: var(--r-xl);
  overflow: hidden;
  position: relative;
  aspect-ratio: 4/3;
  background: var(--bg3);
}
.photo-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 500ms var(--ease);
}
@media (hover: hover) and (pointer: fine) {
  .photo-card:hover img { transform: scale(1.04); }
}
.photo-card-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(to top, rgba(28,43,74,.85) 0%, transparent 100%);
  padding: 1.5rem 1.25rem 1rem;
  color: #fff;
  font-size: 0.825rem;
  font-weight: 600;
}

/* ── Divider ── */
.divider { border: none; border-top: 1px solid var(--border); }

/* ── Tag ── */
.tag {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.2rem 0.55rem;
  border-radius: 4px;
  background: var(--bg3);
  color: var(--muted);
  border: 1px solid var(--border);
}
.tag-red { background: var(--red-pale); color: var(--red); border-color: rgba(204,20,20,.2); }
.tag-gold { background: var(--gold-pale); color: var(--gold); border-color: rgba(230,139,16,.25); }
.tag-navy { background: rgba(28,43,74,.08); color: var(--navy); border-color: rgba(28,43,74,.15); }

/* ── Reveal ── */
.reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 550ms var(--ease), transform 550ms var(--ease);
}
.reveal.visible { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: 80ms; }
.reveal-delay-2 { transition-delay: 160ms; }
.reveal-delay-3 { transition-delay: 240ms; }
.reveal-step-0 { transition-delay: 0ms; }
.reveal-step-1 { transition-delay: 40ms; }
.reveal-step-2 { transition-delay: 80ms; }
.reveal-step-3 { transition-delay: 120ms; }
.reveal-step-4 { transition-delay: 160ms; }

/* ── Footer ── */
.footer {
  background: var(--navy);
  color: rgba(255,255,255,.75);
  padding-block: clamp(2.5rem, 5vw, 4.5rem) 1.75rem;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 3rem;
  padding-bottom: 2.5rem;
  border-bottom: 1px solid rgba(255,255,255,.1);
  margin-bottom: 1.75rem;
}
.footer-logo {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-size: 1.05rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.75rem;
}
.footer-logo img { height: 36px; width: auto; object-fit: contain; filter: brightness(0) invert(1); }
.footer-logo-icon {
  width: 2rem;
  height: 2rem;
  background: var(--red);
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
}
.footer-tagline { font-size: 0.85rem; color: rgba(255,255,255,.5); max-width: 28ch; line-height: 1.6; }
.footer-col h4 {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,.35);
  margin-bottom: 1rem;
}
.footer-col ul { display: flex; flex-direction: column; gap: 0.5rem; }
.footer-col a { font-size: 0.875rem; color: rgba(255,255,255,.6); transition: color 150ms; }
@media (hover: hover) and (pointer: fine) {
  .footer-col a:hover { color: #fff; }
}
.footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.footer-bottom p { font-size: 0.775rem; color: rgba(255,255,255,.3); max-width: none; }

/* ── Responsive ── */
@media (max-width: 900px) {
  .nav-links, .nav-ticker-wrap { display: none; }
  .hamburger { display: flex; }
  .bento-3 { grid-template-columns: 1fr 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-grid > :first-child { grid-column: span 2; }
}
@media (max-width: 600px) {
  .bento-2, .bento-3 { grid-template-columns: 1fr; }
  .span-2 { grid-column: span 1; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-grid > :first-child { grid-column: span 1; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
  .section-header { flex-direction: column; align-items: flex-start; }
}

/* Page-specific styles moved from HTML */
/* From einsaetze.html */
.einsatz-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 1.375rem 1.5rem;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 1.125rem;
  align-items: center;
  box-shadow: var(--shadow-sm);
  transition: border-color 200ms var(--ease), box-shadow 200ms var(--ease), transform 200ms var(--ease);
}
@media (hover: hover) and (pointer: fine) {
  .einsatz-card:hover { border-color: var(--red); box-shadow: 0 4px 20px rgba(204,20,20,.1); transform: translateX(2px); }
}
.einsatz-icon {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: var(--r-md);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 800;
  flex-shrink: 0;
}
.spinner { width: 20px; height: 20px; border: 2px solid var(--border); border-top-color: var(--red); border-radius: 50%; animation: spin 0.8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.skeleton { background: linear-gradient(90deg, var(--bg2) 25%, var(--bg3) 50%, var(--bg2) 75%); background-size: 200% 100%; animation: shimmer 1.5s infinite; border-radius: var(--r-sm); }
@keyframes shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
@media (max-width: 560px) {
  .einsatz-card { grid-template-columns: auto 1fr; }
  .einsatz-card > :last-child { grid-column: 2; margin-top: 0.25rem; }
}

/* From index.html */
/* ── Hero ── */
.hero {
  position: relative;
  min-height: 88vh;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}
.hero-bg {
  position: absolute;
  inset: 0;
  background-image: url('https://images.pexels.com/photos/20659629/pexels-photo-20659629.jpeg?auto=compress&cs=tinysrgb&w=1920');
  background-size: cover;
  background-position: center 60%;
  transition: transform 8s ease-out;
}
.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(28,43,74,.90) 0%,
    rgba(28,43,74,.55) 45%,
    rgba(28,43,74,.25) 100%
  );
}
.hero-content {
  position: relative;
  z-index: 1;
  padding-block: 4rem;
  width: 100%;
}
.hero-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: flex-end;
}
.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--red);
  color: #fff;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 0.3rem 0.75rem;
  border-radius: 4px;
  margin-bottom: 1.375rem;
}
.hero-stats {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}
.hero-stat {
  background: rgba(255,255,255,.1);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: var(--r-lg);
  padding: 1.25rem 1.375rem;
}
.hero-stat-num {
  font-size: 2rem;
  font-weight: 800;
  letter-spacing: -0.04em;
  color: #fff;
  line-height: 1;
}
.hero-stat-label {
  font-size: 0.725rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.6);
  margin-top: 0.3rem;
}

/* ── Einsatz loading ── */
.einsatz-loading {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  color: var(--muted);
  font-size: 0.85rem;
  padding: 2rem 0;
}
.spinner {
  width: 16px; height: 16px;
  border: 2px solid var(--border);
  border-top-color: var(--red);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
  flex-shrink: 0;
}
@keyframes spin { to { transform: rotate(360deg); } }

.einsatz-type {
  display: inline-block;
  font-size: 0.65rem;
  font-weight: 800;
  padding: 0.15rem 0.4rem;
  border-radius: 3px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-right: 0.375rem;
}
.type-b { background: #fee2e2; color: #991b1b; }
.type-thl { background: #dbeafe; color: #1e40af; }
.type-other { background: var(--bg3); color: var(--muted); }

/* ── Gallery ── */
.gallery-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  grid-template-rows: auto auto;
  gap: 0.875rem;
}
.gallery-main {
  grid-row: span 2;
  border-radius: var(--r-xl);
  overflow: hidden;
  position: relative;
}
.gallery-main img, .gallery-side img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 600ms var(--ease);
}
@media (hover: hover) and (pointer: fine) {
  .gallery-main:hover img, .gallery-side:hover img { transform: scale(1.03); }
}
.gallery-side {
  border-radius: var(--r-lg);
  overflow: hidden;
  position: relative;
  aspect-ratio: 4/3;
}
.img-caption {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: linear-gradient(to top, rgba(28,43,74,.8), transparent);
  color: #fff;
  font-size: 0.775rem;
  font-weight: 600;
  padding: 1.25rem 1rem 0.75rem;
}

@media (max-width: 700px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-stats { flex-direction: row; }
  .hero-stat { flex: 1; }
  .hero-stat-num { font-size: 1.5rem; }
  .gallery-grid { grid-template-columns: 1fr; }
  .gallery-main { grid-row: span 1; aspect-ratio: 16/9; }
}

/* Extracted former inline styles */
.u-001 { display:none; }
.u-002 { background:var(--bg2);padding-block:clamp(3rem,6vw,5rem) clamp(2rem,4vw,3rem);border-bottom:1px solid var(--border); }
.u-003 { display:grid;grid-template-columns:1fr auto;align-items:end;gap:2rem;flex-wrap:wrap; }
.u-004 { margin-bottom:0.875rem; }
.u-005 { margin-top:0.875rem;max-width:44ch; }
.u-006 { display:flex;align-items:center;gap:0.625rem; }
.u-007 { background:var(--red);animation:none;width:9px;height:9px;box-shadow:0 0 0 3px rgba(204,20,20,.15); }
.u-008 { font-size:0.8rem;font-weight:700;color:var(--red); }
.u-009 { background:var(--white);border-bottom:1px solid var(--border); }
.u-010 { display:grid;grid-template-columns:repeat(3,1fr);gap:0; }
.u-011 { padding:1.25rem 1rem;border-right:1px solid var(--border);text-align:center; }
.u-012 { font-size:1.5rem;font-weight:800;color:var(--red);letter-spacing:-0.03em; }
.u-013 { font-size:0.7rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted);margin-top:0.25rem; }
.u-014 { font-size:1.5rem;font-weight:800;color:var(--navy);letter-spacing:-0.03em; }
.u-015 { padding:1.25rem 1rem;text-align:center; }
.u-016 { display:flex;flex-direction:column;gap:0.75rem; }
.u-017 { pointer-events:none;opacity:.6; }
.u-018 { width:44px;height:44px;border-radius:var(--r-md); }
.u-019 { height:14px;width:70%;margin-bottom:8px; }
.u-020 { height:11px;width:40%; }
.u-021 { width:80px;height:30px;border-radius:var(--r-sm); }
.u-022 { pointer-events:none;opacity:.4; }
.u-023 { height:14px;width:55%;margin-bottom:8px; }
.u-024 { height:11px;width:35%; }
.u-025 { pointer-events:none;opacity:.25; }
.u-026 { height:14px;width:65%;margin-bottom:8px; }
.u-027 { height:11px;width:30%; }
.u-028 { text-align:center;margin-top:2rem;display:none; }
.u-029 { font-size:0.875rem;margin:0 auto 1rem; }
.u-030 { font-size:0.775rem;color:rgba(255,255,255,.3); }
.u-031 { font-size:0.95rem;font-weight:600;color:var(--navy);margin-bottom:0.25rem;line-height:1.4; }
.u-032 { font-size:0.775rem;color:var(--muted); }
.u-033 { font-size:0.8rem;color:var(--muted);margin-top:0.375rem;line-height:1.5; }
.u-034 { pointer-events:none; }
.u-035 { position:relative;min-height:340px;display:flex;align-items:flex-end;overflow:hidden; }
.u-036 { position:absolute;inset:0;background-image:url('https://images.pexels.com/photos/20659629/pexels-photo-20659629.jpeg?auto=compress&cs=tinysrgb&w=1920');background-size:cover;background-position:center; }
.u-037 { position:absolute;inset:0;background:linear-gradient(to top,rgba(28,43,74,.88) 0%,rgba(28,43,74,.4) 60%,rgba(28,43,74,.15) 100%); }
.u-038 { position:relative;z-index:1;padding-block:3rem; }
.u-039 { font-size:0.7rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:rgba(255,255,255,.6);display:block;margin-bottom:0.875rem; }
.u-040 { font-size:clamp(2rem,5vw,3.5rem); }
.u-041 { color:rgba(255,255,255,.7);margin-top:0.875rem;max-width:46ch;font-size:0.95rem; }
.u-042 { display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center; }
.u-043 { margin-bottom:1.25rem; }
.u-044 { margin-bottom:1rem; }
.u-045 { margin-bottom:1.5rem;font-size:0.95rem; }
.u-046 { display:grid;grid-template-columns:1fr 1fr;gap:0.75rem;margin-bottom:1.75rem; }
.u-047 { padding:1rem; }
.u-048 { font-size:0.7rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted);margin-bottom:0.375rem; }
.u-049 { font-size:1.375rem;font-weight:800;color:var(--navy); }
.u-050 { padding:1rem;border-top:3px solid var(--red); }
.u-051 { font-size:1.375rem;font-weight:800;color:var(--red); }
.u-052 { border-radius:var(--r-xl);overflow:hidden;aspect-ratio:4/3;background:var(--bg3); }
.u-053 { width:100%;height:100%;object-fit:cover; }
.u-054 { font-size:0.75rem;color:var(--subtle);text-align:center;margin-top:0.5rem;max-width:none; }
.u-055 { order:2; }
.u-056 { order:1; }
.u-057 { margin-bottom:0.5rem; }
.u-058 { display:grid;grid-template-columns:1fr 1fr;gap:1.5rem; }
.u-059 { border-radius:var(--r-xl);overflow:hidden;aspect-ratio:16/9;margin-bottom:1.25rem; }
.u-060 { margin-bottom:0.75rem; }
.u-061 { font-size:0.9rem;max-width:none;margin-bottom:1.25rem; }
.u-062 { border-radius:var(--r-xl);overflow:hidden;aspect-ratio:16/9;margin-bottom:1.25rem;background:var(--bg3);display:flex;align-items:center;justify-content:center; }
.u-063 { font-size:0.9rem;max-width:none;margin-bottom:0.875rem; }
.u-064 { background:var(--bg2);border:1px solid var(--border);border-radius:var(--r-md);padding:0.875rem;margin-bottom:1.25rem; }
.u-065 { font-size:0.75rem;font-weight:600;color:var(--muted);margin-bottom:0.2rem; }
.u-066 { font-size:0.9rem;color:var(--navy);font-weight:500; }
.u-067 { max-width:760px;display:flex;flex-direction:column;gap:1.5rem; }
.u-068 { padding:2rem; }
.u-069 { font-size:1rem;font-weight:700;color:var(--navy);margin-bottom:1.25rem;padding-bottom:0.875rem;border-bottom:1px solid var(--border); }
.u-070 { font-size:0.9rem;line-height:1.9;color:var(--muted); }
.u-071 { color:var(--navy); }
.u-072 { font-size:1rem;font-weight:700;color:var(--navy);margin-bottom:1rem;padding-bottom:0.875rem;border-bottom:1px solid var(--border); }
.u-073 { font-size:0.9rem;max-width:none; }
.u-074 { display:flex;flex-direction:column;gap:1.5rem; }
.u-075 { font-size:0.9rem;font-weight:700;color:var(--navy);margin-bottom:0.5rem; }
.u-076 { font-size:0.875rem;line-height:1.75;max-width:none; }
.u-077 { display:flex;flex-direction:column;gap:1rem; }
.u-078 { padding:2rem;background:var(--gold-pale);border-color:rgba(230,139,16,.2); }
.u-079 { font-size:1rem;font-weight:700;color:var(--navy);margin-bottom:1.25rem;padding-bottom:0.875rem;border-bottom:1px solid rgba(230,139,16,.25); }
.u-080 { padding:2rem;background:var(--bg2); }
.u-081 { color:var(--red);text-decoration:underline; }
.u-082 { color:rgba(255,255,255,.75);font-size:1.05rem;max-width:44ch;margin-top:1.25rem;margin-bottom:2rem; }
.u-083 { display:flex;gap:0.75rem;flex-wrap:wrap; }
.u-084 { color:var(--red2); }
.u-085 { display:grid;grid-template-columns:1fr 1fr;gap:0.875rem; }
.u-086 { flex-shrink:0;color:rgba(255,255,255,.4); }
.u-087 { display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start; }
.u-088 { padding:0; }
.u-089 { padding:1.5rem;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between; }
.u-090 { margin-bottom:0.375rem; }
.u-091 { padding:1rem 1.5rem;display:flex;flex-direction:column;gap:0.625rem; }
.u-092 { padding:1rem 1.5rem;border-top:1px solid var(--border); }
.u-093 { width:100%;justify-content:center; }
.u-094 { padding:0.5rem 1.5rem; }
.u-095 { font-size:0.875rem;font-weight:600;color:var(--navy);line-height:1.4; }
.u-096 { font-size:0.775rem;color:var(--muted);margin-top:0.2rem; }
.u-097 { background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border); }
.u-098 { height:100%;min-height:420px; }
.u-099 { border-top:3px solid var(--red); }
.u-100 { font-size:0.875rem;max-width:none; }
.u-101 { margin-top:1.25rem; }
.u-102 { border-top:3px solid var(--gold); }
.u-103 { background:var(--red); }
.u-104 { display:grid;grid-template-columns:1fr auto;align-items:center;gap:2rem;flex-wrap:wrap; }
.u-105 { font-size:0.7rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:rgba(255,255,255,.65);display:block;margin-bottom:0.75rem; }
.u-106 { font-size:clamp(1.4rem,3vw,2rem);font-weight:800;color:#fff;letter-spacing:-0.02em;margin-bottom:0.5rem; }
.u-107 { color:rgba(255,255,255,.75);font-size:0.9rem;max-width:48ch; }
.u-108 { flex-shrink:0; }
.u-109 { flex:1;min-width:0; }
.u-110 { font-size:0.875rem;font-weight:600;color:var(--navy);line-height:1.4;margin-bottom:0.2rem; }
.u-111 { font-size:0.775rem;font-weight:600;color:var(--red);white-space:nowrap;flex-shrink:0; }
.u-112 { position:relative;min-height:360px;display:flex;align-items:flex-end;overflow:hidden; }
.u-113 { position:absolute;inset:0;background-image:url('https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1920&q=80&auto=format&fit=crop');background-size:cover;background-position:center 40%; }
.u-114 { position:absolute;inset:0;background:linear-gradient(to top,rgba(28,43,74,.9) 0%,rgba(28,43,74,.45) 55%,rgba(28,43,74,.15) 100%); }
.u-115 { position:relative;z-index:1;padding-block:3.5rem; }
.u-116 { margin-bottom:4rem; }
.u-117 { border-top:4px solid var(--red);padding:2rem; }
.u-118 { font-size:0.875rem;max-width:none;margin-bottom:1.5rem; }
.u-119 { display:flex;flex-direction:column;gap:0.5rem; }
.u-120 { justify-content:space-between; }
.u-121 { justify-content:center;margin-top:0.25rem; }
.u-122 { border-top:4px solid var(--navy);padding:2rem; }
.u-123 { font-size:0.95rem;max-width:none;margin-bottom:1rem; }
.u-124 { font-size:0.95rem;max-width:none;margin-bottom:1.75rem; }
.u-125 { border-radius:var(--r-xl);overflow:hidden;aspect-ratio:4/3; }
.u-126 { background:var(--bg2);border-top:1px solid var(--border); }
.u-127 { font-size:clamp(1.4rem,2.5vw,2rem); }
.u-128 { padding:1.75rem; }
.u-129 { font-size:2rem;margin-bottom:1rem; }
.u-130 { font-size:1.05rem;margin-bottom:0.5rem; }
.u-131 { padding:1.75rem;border-top:3px solid var(--red); }