/* ===== RESET & BASE ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --color-primary: #1a3a5c;
  --color-accent:  #e84e1b;
  --color-light:   #f4f6f9;
  --color-text:    #222;
  --radius: 8px;
  --max-w: 960px;
}
body { font-family: 'Segoe UI', sans-serif; color: var(--color-text); background: #fff; }
a { color: var(--color-accent); }
.container { max-width: var(--max-w); margin: 0 auto; padding: 0 1.5rem; }

/* ===== HERO ===== */
.hero { background: var(--color-primary); color: #fff; padding: 5rem 1.5rem 4rem; text-align: center; }
.hero__inner { max-width: var(--max-w); margin: 0 auto; }
.logo { height: 64px; margin-bottom: 1.5rem; }
.hero h1 { font-size: clamp(2rem, 5vw, 3.5rem); letter-spacing: -1px; }
.hero__sub { margin-top: 1rem; font-size: 1.1rem; opacity: 0.85; }

/* ===== SECTIONS ===== */
.section { padding: 4rem 0; }
.section--alt { background: var(--color-light); }
.section h2 { font-size: 1.8rem; margin-bottom: 1.5rem; color: var(--color-primary); }
.section p { line-height: 1.7; max-width: 680px; }

/* ===== EVENTS ===== */
.events-list { list-style: none; display: grid; gap: 1rem; }
.events-list__loading { color: #888; }
.event-card {
  background: #fff;
  border: 1px solid #dde3ea;
  border-left: 4px solid var(--color-accent);
  border-radius: var(--radius);
  padding: 1.25rem 1.5rem;
}
.event-card__title { font-size: 1.1rem; font-weight: 600; margin-bottom: .25rem; }
.event-card__date { font-size: .85rem; color: #666; margin-bottom: .5rem; }
.event-card__desc { font-size: .95rem; line-height: 1.6; }
.event-card__link { display: inline-block; margin-top: .75rem; font-size: .9rem; font-weight: 600; color: var(--color-accent); }

/* ===== FOOTER ===== */
.footer { background: var(--color-primary); color: rgba(255,255,255,.7); padding: 2rem 0; text-align: center; font-size: .875rem; }
.footer__admin-link { display: block; margin-top: .5rem; color: rgba(255,255,255,.5); font-size: .8rem; }