/**
 * Events page layer (site/events/index.php, Joachim meeting 05.11.2026).
 * Reuses home.css (.home-section, .home-placeholder, .home-cta). Colours are
 * tokens only, no ghost buttons, solid cards like .home-trust-item.
 */
.events-hero{background:linear-gradient(160deg,var(--bg-2),var(--bg));padding:64px 24px 48px;text-align:left}
.events-hero-inner{max-width:1180px;margin:0 auto}
.events-hero p{max-width:760px}
.events-hero h1{font-size:clamp(2rem,5vw,3rem);letter-spacing:-.02em;line-height:1.1;margin:0 0 18px;color:var(--text)}
.events-hero p{color:var(--text-2);font-size:1.05rem;line-height:1.65;margin:0}

/* Flex instead of grid so the last, shorter row is centred (5 cards: 3 + 2). */
.events-grid{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:20px}
.events-grid>li{flex:0 1 100%;max-width:100%;box-sizing:border-box}
@media (min-width:640px){.events-grid>li{flex-basis:calc((100% - 20px)/2);max-width:calc((100% - 20px)/2)}}
@media (min-width:1000px){.events-grid>li{flex-basis:calc((100% - 40px)/3);max-width:calc((100% - 40px)/3)}}
.events-card{box-sizing:border-box;background:var(--surface);border:1px solid var(--line-soft);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.events-card-body{padding:20px 22px 24px;display:flex;flex-direction:column;gap:8px}
.events-card-period{font-size:.875rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent-text)}
.events-card h3{margin:0;font-size:1.2rem;line-height:1.25;color:var(--text)}
.events-card p{margin:0;color:var(--text-2);font-size:.97rem;line-height:1.6}

.events-gallery{display:grid;gap:16px;max-width:1180px;margin:0 auto}
@media (min-width:640px){.events-gallery{grid-template-columns:repeat(3,1fr)}}

.events-sizilien{margin-bottom:-1px}
