/* The ticket shop's own look, layered on the base design system. It supplies
   rules for its own classes only; the base's ids and forms keep theirs. */
.tickets-masthead { display: flex; flex-wrap: wrap; align-items: baseline; gap: 1rem; padding: 1rem 1.25rem; border-bottom: 4px solid var(--accent); }
.tickets-masthead .tickets-title { font-size: 1.5rem; font-weight: 700; letter-spacing: 0.02em; text-decoration: none; color: inherit; }
.tickets-masthead nav { display: flex; gap: 1rem; margin-left: auto; align-items: baseline; flex-wrap: wrap; }
.whats-on { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); padding: 0; list-style: none; }
.event-card { border: 1px solid currentColor; border-radius: 0.5rem; padding: 1rem; }
.event-card h3 { margin: 0 0 0.5rem; }
.event-card .event-tickets { font-weight: 600; }
.event .tiers { width: 100%; border-collapse: collapse; }
.event .tiers th, .event .tiers td { text-align: left; padding: 0.5rem; border-bottom: 1px solid currentColor; }
.tickets-footer { margin-top: 3rem; padding: 1rem 1.25rem; border-top: 1px solid currentColor; font-size: 0.875rem; }