/* The agenda's own rules (Eventos.dc.html, the 2026-10-06 pick; build spec P5).
   Linked from base.html on every page, so every rule sits under the page's wrapper,
   `.rv-agenda-page`. The base sheet already draws the shared pieces (the buttons, the
   tag, the kicker, the orange first screen, the feature card, the green agenda, its
   tabs and rows); this file adds what the new board adds: the ink band per series,
   the services row and the yellow call, and the few board values the base does not
   carry. Colours are the base's tokens only. Nothing here moves: the board's motion is
   the base sheet's, behind both gates, and this sheet only feeds it (the order, the
   framed picture's tilt and its shadow; at the foot). */

/* ------------------------------------------------------------ the first screen */
.rv-agenda-page .rv-ev-ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
/* The board's primary button on the orange hovers to the cream, never to the orange
   it stands on. */
.rv-agenda-page .rv-ev-go:hover {
  border-color: var(--rv-cream);
  background: var(--rv-cream);
  color: var(--rv-ink);
}
.rv-agenda-page .rv-ev-hero .rv-h1 {
  line-height: 0.88;
}
/* An event row's price note (a row: the workshop's sentence about paying), on its own
   line under the summary, as the feature card sets its price line. */
.rv-agenda-page .rv-row-note {
  font-weight: 600;
}
.rv-agenda-page .rv-lead-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}
/* The card's foot sets the day, hours and venue beside the button only while the card
   is wide enough to hold both; in the narrow column of a two-column first screen (a
   tablet) the button goes under the line, as it does on the phone, instead of
   squeezing the line to a word a row. */
.rv-agenda-page .rv-ev-hero .rv-lead {
  container-type: inline-size;
}
@container (max-width: 32rem) {
  .rv-agenda-page .rv-ev-hero .rv-lead .rv-lead-foot {
    grid-template-columns: minmax(0, 1fr);
  }
  .rv-agenda-page .rv-ev-hero .rv-lead .rv-lead-foot > span:last-child {
    justify-self: start;
  }
}

/* ------------------------------------------------------- the band per series */
/* Ink, cream words, the yellow at display size (11.19:1); a second series' band is
   parted from the first by the cream hairline, as two grounds that match are. */
.rv-agenda-page .rv-alc {
  background: var(--rv-ink);
  color: var(--rv-cream);
  padding-block: clamp(3.5rem, 8vw, 7rem);
}
.rv-agenda-page .rv-alc + .rv-alc {
  border-top: 3px solid var(--rv-cream-hair);
}
.rv-agenda-page .rv-alc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
  align-items: center;
  gap: clamp(1.75rem, 4vw, 3.5rem);
}
.rv-agenda-page .rv-alc-grid-solo {
  grid-template-columns: minmax(0, 48rem);
}
.rv-agenda-page .rv-alc-text {
  display: flex;
  flex-direction: column;
  gap: 1.375rem;
  min-width: 0;
}
.rv-agenda-page .rv-alc-name {
  max-width: 40rem;
  margin: 0;
}
.rv-agenda-page .rv-alc-wordmark {
  display: block;
  width: 100%;
  height: auto;
}
.rv-agenda-page .rv-alc-title {
  display: block;
  font-size: clamp(3.25rem, 7vw, 6.5rem);
  line-height: 0.9;
}
.rv-agenda-page .rv-alc-kicker {
  color: var(--rv-cream);
}
.rv-agenda-page .rv-alc-rule {
  color: var(--rv-yellow);
  font-size: 1.75rem;
  letter-spacing: 0.04em;
  line-height: 1.1;
}
/* The text's first paragraph and the catalog's sentence read as the board's one
   paragraph; a block that is not a paragraph keeps its own shape. */
.rv-agenda-page .rv-alc-body {
  max-width: 48ch;
  font-size: 1.0625rem;
  line-height: 1.5;
  text-wrap: pretty;
}
.rv-agenda-page .rv-alc-body > p {
  display: inline;
}
.rv-agenda-page .rv-alc-credit {
  max-width: 52ch;
  font-size: 0.9375rem;
  line-height: 1.45;
  text-wrap: pretty;
}
.rv-agenda-page .rv-alc-dates {
  border-top: 1px solid var(--rv-cream-hair);
}
.rv-agenda-page .rv-alc-dates > li {
  border-bottom: 1px solid var(--rv-cream-hair);
}
.rv-agenda-page .rv-alc-date {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 1.125rem;
  padding-block: 0.875rem;
  color: var(--rv-cream);
}
.rv-agenda-page .rv-alc-day {
  min-width: 5.625rem;
  font-family: var(--font-display);
  font-size: 1.625rem;
  letter-spacing: 0.04em;
  line-height: 1.1;
  text-transform: uppercase;
  white-space: nowrap;
}
.rv-agenda-page .rv-alc-what {
  font-size: 0.9375rem;
  line-height: 1.45;
}
.rv-agenda-page .rv-alc-cta {
  margin-left: auto;
  color: var(--rv-yellow);
  font-family: var(--font-display);
  font-size: 1.375rem;
  letter-spacing: 0.06em;
  line-height: 1.1;
  text-transform: uppercase;
  white-space: nowrap;
}
.rv-agenda-page .rv-alc-date:hover .rv-alc-day {
  color: var(--rv-yellow);
}
.rv-agenda-page .rv-alc-date:hover .rv-alc-what {
  text-decoration: underline 2px;
  text-underline-offset: 0.25em;
}
.rv-agenda-page .rv-alc-vou {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.625rem;
  padding: 1.25rem;
  border: 2px solid var(--rv-cream);
}
.rv-agenda-page .rv-alc-vou-title {
  font-size: 1.75rem;
  letter-spacing: 0.04em;
  line-height: 1;
}
.rv-agenda-page .rv-alc-vou p {
  font-size: 0.9375rem;
  line-height: 1.45;
  text-wrap: pretty;
}

/* The board's framed picture: the series' card art, its ticket taken off — the
   cream rim, the deep yellow while it loads, the art edge to edge. */
.rv-agenda-page .rv-alc-figure {
  min-width: 0;
  margin: 0;
}
.rv-agenda-page .rv-alc .rv-alc-art {
  display: block;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border: 3px solid var(--rv-cream);
  background: var(--rv-yellow-deep);
  background-image: none;
  box-shadow: none;
  color: inherit;
}
.rv-agenda-page .rv-alc .rv-alc-art .rv-series-art {
  margin: 0;
  border-bottom: 0;
}

/* ------------------------------------------------------------- the services */
/* The board draws it at the foot of the green agenda, under a cream rule; with no
   agenda it is a green band of its own. Cream on the green is 4.54:1, full opacity. */
.rv-agenda-page .rv-ev-services {
  background: var(--rv-green-ground);
  color: var(--rv-cream);
  padding-block: clamp(3.5rem, 8vw, 7rem);
}
.rv-agenda-page .rv-agenda:has(+ .rv-ev-services) {
  padding-block-end: clamp(2rem, 4vw, 3rem);
}
.rv-agenda-page .rv-agenda + .rv-ev-services {
  padding-block-start: 0;
}
.rv-agenda-page .rv-agenda + .rv-ev-services .rv-ev-services-row {
  padding-top: 1.5rem;
  border-top: 2px solid var(--rv-cream-rule);
}
/* An empty tab already closes on the same rule, so the row does not draw a second. */
.rv-agenda-page .rv-agenda:has(.rv-empty) + .rv-ev-services .rv-ev-services-row {
  padding-top: 0;
  border-top: 0;
}
.rv-agenda-page .rv-ev-services-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 1.5rem;
}
.rv-agenda-page .rv-ev-services-text {
  flex: 1 1 24rem;
  max-width: 60ch;
  font-size: 1rem;
  line-height: 1.5;
  text-wrap: pretty;
}
.rv-agenda-page .rv-ev-services-text > * {
  display: inline;
}
/* The board sets the question in the sentence's own type; the platform's heading
   rule would set it in the display face. */
.rv-agenda-page .rv-ev-services-title {
  font-family: inherit;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: normal;
  line-height: 1.5;
  text-transform: none;
}
.rv-agenda-page .rv-ev-services .rv-btn {
  border-color: var(--rv-cream);
  background: transparent;
  color: var(--rv-cream);
}
.rv-agenda-page .rv-ev-services .rv-btn:hover {
  border-color: var(--rv-cream);
  background: var(--rv-cream);
  color: var(--rv-ink);
}

/* ---------------------------------------------------------------- the call */
.rv-agenda-page .rv-ev-call {
  background: var(--rv-yellow);
  color: var(--rv-ink);
  border-top: 3px solid var(--rv-ink);
  padding-block: clamp(3.5rem, 8vw, 6rem);
}
.rv-agenda-page .rv-ev-call-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.75rem;
}
.rv-agenda-page .rv-ev-call-text {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  min-width: 0;
}
/* The board sets the farewell on two lines («Vemo-nos / na pista.»), as the home's call
   does. */
.rv-agenda-page .rv-ev-call-title {
  max-width: 12ch;
  font-size: clamp(3rem, 6vw, 5.5rem);
  line-height: 0.9;
  text-wrap: balance;
}
.rv-agenda-page .rv-ev-call-lede {
  max-width: 52ch;
  font-size: 1.0625rem;
  line-height: 1.5;
  text-wrap: pretty;
}

/* --------------------------------------------------------------- the focus */
/* The base draws the ink ring on the light grounds and the yellow on the green; the
   ink band and the services row take the yellow too. */
.rv-agenda-page :is(.rv-alc, .rv-ev-services) a:focus-visible {
  outline-color: var(--rv-yellow);
}

/* ------------------------------------------------------------- the agenda */
/* The board stacks the heading word over word («Próximas / datas.»). */
.rv-agenda-page .rv-agenda .rv-h2 {
  max-width: 8ch;
}
/* The board keeps a row's three cells stacked up to 900px; the base sheet opens them
   at 48rem, where the middle cell is too narrow for a workshop's text. */
@media (min-width: 48rem) and (max-width: 56.2rem) {
  .rv-agenda-page .rv-row {
    grid-template-columns: minmax(0, 1fr);
  }
  .rv-agenda-page .rv-row-when {
    flex-direction: row;
    gap: 0.25rem 0.875rem;
    padding-right: 0;
    border-right: 0;
  }
}

/* ------------------------------------------------------------- the phone */
/* The phone board's rule: a button takes the column's whole width. */
@media (max-width: 40rem) {
  .rv-agenda-page :is(.rv-ev-ctas, .rv-ev-call-row, .rv-ev-services-row, .rv-empty) > .rv-btn {
    flex: 1 1 100%;
  }
  .rv-agenda-page .rv-alc-vou > .rv-btn {
    align-self: stretch;
  }
  .rv-agenda-page .rv-alc-rule {
    font-size: 1.5rem;
  }
}

/* ------------------------------------------------------- the motion's hooks */
/* What the base sheet moves reads its order, its tilt and its shadow from here, as the
   board sets them (never inline). The order is a stagger index, `--i`, counted from 0:
   on the first screen the tag, the lede, the buttons, then the feature card. A plain
   property, not a motion rule: it does nothing until the gated entrances read it. */
.rv-agenda-page .rv-ev-hero .rv-lede {
  --i: 1;
}
.rv-agenda-page .rv-ev-hero .rv-ev-ctas {
  --i: 2;
}
.rv-agenda-page .rv-ev-hero .rv-lead {
  --i: 3;
}
.rv-agenda-page .rv-lead-date {
  --rv-beat-turn: 1.5deg;
}
/* The series' framed picture hangs like a poster a little to the left, and under the
   pointer it lifts off the yellow rather than the ink it hangs on. */
.rv-agenda-page .rv-alc-figure {
  --rv-tilt: -1.4deg;
  --rv-poster-shadow: var(--rv-yellow);
}
