.sticker { color: var(--ink); }

.rsvp-button {
  align-self: stretch;
  min-height: 310px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding: 2rem;
  background: var(--lime);
  border: var(--border);
  box-shadow: 8px 8px 0 var(--pink);
  color: var(--ink);
  font-family: 'Archivo Black', Impact, sans-serif;
  font-size: clamp(4rem, 8vw, 7.5rem);
  line-height: .72;
  letter-spacing: -.1em;
  text-align: center;
  text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.rsvp-button span {
  font: 700 .75rem 'DM Mono', monospace;
  letter-spacing: .08em;
}

.rsvp-button:hover {
  transform: translate(5px, 5px);
  box-shadow: 3px 3px 0 var(--pink);
  background: #e4ff4b;
}

@media (max-width: 800px) {
  .rsvp-button { min-height: 230px; }
}

.how-detail {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
  margin-top: 1.5rem;
}

.how-detail > div {
  border-top: 1px solid rgba(255, 255, 255, .65);
  padding-top: 1rem;
}

.how-detail span {
  color: var(--lime);
  font: 500 .66rem 'DM Mono', monospace;
  letter-spacing: .08em;
}

.how-detail p {
  margin: .65rem 0 0;
  color: #d5d5db;
  font-size: .78rem;
  line-height: 1.6;
}

.how-detail strong { color: #fff; }

@media (max-width: 800px) {
  .how-detail { grid-template-columns: 1fr; gap: .85rem; }
}

.program-guide {
  display: grid;
  grid-template-columns: minmax(180px, .42fr) 1fr;
  gap: 3rem;
  margin-top: 4.25rem;
  padding-top: 1.5rem;
  border-top: 2px solid #fff;
}

.program-guide-heading > span {
  color: var(--lime);
  font: 500 .68rem 'DM Mono', monospace;
  letter-spacing: .09em;
}

.program-guide-heading p {
  max-width: 265px;
  margin: .9rem 0 0;
  color: #d5d5db;
  font-size: .8rem;
  line-height: 1.65;
}

.program-guide ol {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid rgba(255, 255, 255, .55);
}

.program-guide li {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 1.5rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, .55);
}

.guide-time {
  color: var(--lime);
  font: 500 .67rem 'DM Mono', monospace;
  letter-spacing: .06em;
}

.program-guide h3 {
  margin: 0 0 .4rem;
  color: #fff;
  font: 800 1.05rem Manrope, sans-serif;
  letter-spacing: -.03em;
}

.program-guide li p {
  max-width: 600px;
  margin: 0;
  color: #d5d5db;
  font-size: .8rem;
  line-height: 1.65;
}

@media (max-width: 1060px) {
  .topbar { padding-inline: 5vw; }
  .topbar nav { gap: 1.15rem; }
  .rsvp-section { gap: 4vw; }
  .rsvp-copy h2 { font-size: clamp(3.6rem, 7.2vw, 5.8rem); }
  .steps { grid-template-columns: repeat(2, 1fr); }
  .step { min-height: 280px; }
}

@media (max-width: 800px) {
  .hero { min-height: 610px; }
  .hero-content { max-width: 600px; }
  .intro-layout { gap: 1.5rem; }
  .program-guide { grid-template-columns: 1fr; gap: 1.6rem; margin-top: 3rem; }
  .program-guide-heading p { max-width: 570px; }
  .program-guide li { grid-template-columns: 135px 1fr; }
  .rsvp-section { grid-template-columns: 1fr; gap: 2rem; }
  .rsvp-copy { max-width: 600px; }
  .rsvp-copy h2 { font-size: clamp(3.6rem, 12vw, 5.9rem); }
  .sticker { bottom: -1.75rem; right: 5%; }
}

@media (max-width: 580px) {
  .topbar { height: 60px; }
  .wordmark { font-size: 1.25rem; }
  .mini-cta { box-shadow: 2px 2px 0 var(--ink); }
  .hero { height: 610px; min-height: 0; }
  .hero-content { left: 6vw; right: 6vw; top: 48%; }
  .hero h1 { font-size: clamp(3.75rem, 18vw, 5rem); margin: 1.1rem 0 1.4rem; }
  .hero-copy { max-width: 355px; font-size: .86rem; }
  .hero-side-note { display: none; }
  .hero-actions { gap: .85rem; margin-top: 1.5rem; }
  .button { padding: .82rem 1rem; }
  .section-pad { padding: 64px 6vw; }
  .intro h2, .projects h2, .faq h2 { font-size: clamp(2.8rem, 14vw, 4.1rem); }
  .how h2 { font-size: clamp(2.85rem, 13.5vw, 4.3rem); }
  .how-heading { margin: 2rem 0 2.3rem; }
  .steps { grid-template-columns: 1fr; }
  .step { min-height: 215px; padding: 1.25rem; }
  .step-icon { font-size: 3rem; margin: 1.3rem 0 .8rem; }
  .how-detail { margin-top: 1rem; }
  .program-guide { margin-top: 2.5rem; }
  .program-guide li { grid-template-columns: 1fr; gap: .55rem; }
  .program-guide li p, .program-guide-heading p { font-size: .78rem; }
  .rsvp-button { min-height: 205px; font-size: clamp(3.7rem, 19vw, 5rem); box-shadow: 5px 5px 0 var(--pink); }
  .rsvp-copy h2 { font-size: clamp(3.6rem, 16vw, 4.7rem); }
  .faq { gap: 2.5rem; }
  summary { font-size: .98rem; gap: 1rem; }
  details p { margin-right: 0; }
}