/* open_event_rsvp block (Phase 3 Stage 4).
   CSS ported from design-export/base.css; no literal colour, every value a token.
   open event RSVP band */

.open-event-rsvp--bg-navy-gradient { background: linear-gradient(135deg, var(--surface-dark) 0%, var(--surface-dark-alt) 100%); border-radius: var(--radius-lg); padding: 2.2rem 2.3rem; }
.open-event-rsvp__card { max-width: 82ch; }
.open-event-rsvp__title { color: var(--white); font-size: 2.5rem; line-height: 1.02; margin-bottom: .6rem; }
.open-event-rsvp__intro { font-size: 1.3125rem; color: rgba(var(--on-dark-rgb), .86); margin-bottom: 1.3rem; }
.open-event-rsvp__form { display: flex; gap: .625rem; flex-wrap: wrap; margin-bottom: 1rem; }
.open-event-rsvp__form input { flex: 1 1 200px; min-width: 0; font-size: var(--fs-min); padding: .875rem 1rem; border: 2px solid transparent; border-radius: var(--radius-sm); background: var(--white); color: var(--ink); }
.open-event-rsvp__notice { font-size: var(--fs-min); color: rgba(var(--on-dark-rgb), .75); }

/* The block sits on a navy GRADIENT, not a .bg-navy class, so the global
   dark-section link colour never reaches it — the footer link rendered dark on
   navy. Light it here. */
.open-event-rsvp__header { margin-bottom: 1rem; }
.open-event-rsvp__footer { font-size: var(--fs-min); color: rgba(var(--on-dark-rgb), .75); margin-top: .9rem; }
.open-event-rsvp__footer a,
.open-event-rsvp__notice a { color: var(--accent-on-dark); }

/* Eyebrow + title emphasis on the navy gradient: base --em-color / --display-em
   is orange on DC and fails here. Lift to the bright accent (yellow on DC, else
   --accent-on-dark). */
.open-event-rsvp--bg-navy-gradient .eyebrow { color: var(--yellow, var(--accent-on-dark)); }
.open-event-rsvp__title :is(em, strong) { color: var(--yellow, var(--accent-on-dark)); }