/* ==========================================================================
   IARGS — Centenário (SPEC-015)
   Usa os tokens do tema (main.css, secao 1): nenhuma cor ou tamanho novo.
   Contraste: dourado sobre o vermelho escuro 6,3:1; sobre o vermelho da barra
   5,1:1 (SPEC-018). A regra "dourado em texto so no vermelho escuro" fica, por
   coerencia com o tema (README §11).
   --------------------------------------------------------------------------
   1. Botoes e marca "100 anos"
   2. Cabecalho enxuto (so nesta pagina)
   3. Abertura em tela cheia, datas, apresentacao, entrada ao rolar, convite
   4. Secoes e linha do tempo da programacao
   5. Linha do tempo historica
   6. Destaque na capa
   7. Etiqueta no evento
   8. Compartilhar e imprimir
   ========================================================================== */

/* 1. Botoes e marca ======================================================== */

.iargs-cent-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 10px var(--space-md);
  border: 2px solid var(--color-primary);
  border-radius: var(--radius);
  background-color: var(--color-primary);
  color: #fff;
  font-size: var(--text-base);
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  transition: background-color var(--transition), color var(--transition);
}

.iargs-cent-button:hover { background-color: var(--color-primary-dark); color: #fff; }

/* Sobre o vermelho escuro: dourado com texto vermelho escuro (6,3:1). */
.iargs-cent-hero .iargs-cent-button,
.iargs-cent-cta .iargs-cent-button,
.iargs-cent-home .iargs-cent-button {
  border-color: var(--color-accent);
  background-color: var(--color-accent);
  color: var(--color-primary-dark);
}

.iargs-cent-hero .iargs-cent-button:hover,
.iargs-cent-cta .iargs-cent-button:hover,
.iargs-cent-home .iargs-cent-button:hover { background-color: #fff; border-color: #fff; color: var(--color-primary-dark); }

.iargs-cent-hero .iargs-cent-button--ghost,
.iargs-cent-cta .iargs-cent-button--ghost {
  background-color: transparent;
  color: #fff;
}

/* Celular: botoes na largura toda, faceis de acertar. */
@media (max-width: 639px) {
  .iargs-cent-button { width: 100%; }
}

.iargs-cent-mark {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin: 0;
  color: var(--color-accent);
  line-height: 1;
}

.iargs-cent-mark__num {
  font-family: var(--font-heading);
  font-size: clamp(4rem, 16vw, 6rem);
  font-weight: 700;
  letter-spacing: -0.02em;
}

.iargs-cent-mark__side { display: grid; gap: var(--space-3xs); }

.iargs-cent-mark__word {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 6vw, 2.25rem);
  font-style: italic;
}

.iargs-cent-mark__years {
  color: #fff;
  font-size: var(--text-base);
  letter-spacing: 0.12em;
}

.iargs-cent-countdown {
  display: grid;
  gap: var(--space-3xs);
  margin: 0;
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-accent);
  border-left-width: 4px;
  color: #fff;
}

.iargs-cent-countdown__days {
  color: var(--color-accent);
  font-family: var(--font-heading);
  font-size: var(--text-h3);
  line-height: 1.25;
}

.iargs-cent-countdown__what { font-size: var(--text-base); }

/* 2. Cabecalho enxuto ====================================================== */
/* Revisao de 2026-10-05 (pedido do cliente): na pagina do centenario o cabecalho
   encolhe — sem faixa de avisos nem selo, logo pequeno — para a abertura ocupar a
   tela como uma pagina de lancamento. Menu, busca e Agenda continuam: a barra do
   menu e a mesma, so que em vermelho escuro, emendada na abertura. */

.iargs-centenary-page .iargs-topbar,
.iargs-centenary-page .iargs-seal,
.iargs-centenary-page .iargs-branding__aside { display: none; }

/* Sem a medalha (SPEC-019) nesta pagina, o menu nao precisa reservar o lugar dela. */
.iargs-centenary-page.iargs-has-medal .iargs-nav-primary__menu { padding-right: 0; }

.iargs-centenary-page .iargs-branding { background-color: var(--color-primary-dark); }

.iargs-centenary-page .iargs-branding__inner {
  grid-template-columns: 1fr;
  justify-items: center;
  gap: var(--space-md);
  padding-block: var(--space-2xs);
}

@media (min-width: 640px) {
  .iargs-centenary-page .iargs-branding__inner {
    grid-template-columns: auto 1fr;
    justify-items: start;
  }
}

/* Logo do Personalizar (pode ser escura sobre branco): vai numa placa cor de papel,
   pequena. A logo do tema (SPEC-018) tem moldura branca propria: vai sem placa e
   sem o nome por extenso, que nao se le sobre o vermelho escuro. */
.iargs-centenary-page .iargs-branding__logo .custom-logo-link {
  display: inline-block;
  padding: var(--space-3xs) var(--space-xs);
  border-radius: var(--radius);
  background-color: var(--color-paper);
}

.iargs-centenary-page .iargs-branding__name { display: none; }

.iargs-centenary-page .iargs-branding__logo img { max-height: 44px; margin-inline: 0; }

.iargs-centenary-page .iargs-branding__logo .iargs-branding__mark { max-height: 52px; }

.iargs-centenary-page .iargs-branding__center { justify-content: flex-end; justify-self: stretch; }

.iargs-centenary-page .iargs-branding .iargs-search__field { border-color: var(--color-accent); }

.iargs-centenary-page .iargs-branding .iargs-search__submit {
  border-color: var(--color-accent);
  background-color: var(--color-accent);
  color: var(--color-primary-dark);
}

.iargs-centenary-page .iargs-nav-primary {
  border-block: 1px solid rgba(210, 154, 50, 0.35);
  background-color: var(--color-primary-dark);
}

/* 3. Abertura em tela cheia ================================================ */
/* Um brilho dourado ao centro, o "100" em ouro com reflexo, aneis girando devagar
   e faiscas subindo. Tudo decorativo (aria-hidden) e desligado para quem pediu
   menos movimento. Excecao ao DESIGN-SPEC §14, so nesta pagina. */

.iargs-cent-hero {
  position: relative;
  display: grid;
  align-items: center;
  min-height: calc(100vh - 120px);
  min-height: calc(100svh - 120px);
  padding-block: var(--space-xl) var(--space-3xl);
  overflow: hidden;
  background-color: var(--color-primary-dark);
  background-image:
    radial-gradient(ellipse 60% 45% at 50% 34%, rgba(210, 154, 50, 0.24), transparent 70%),
    repeating-linear-gradient(-45deg, transparent 0 18px, rgba(210, 154, 50, 0.05) 18px 20px);
  color: #fff;
  text-align: center;
}

.iargs-cent-hero__inner {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: var(--space-sm);
}

.iargs-cent-hero__org {
  font-size: var(--text-small);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

/* O "100" dentro de dois aneis dourados; o de fora, tracejado, gira. */
.iargs-cent-hero__mark {
  position: relative;
  display: grid;
  place-content: center;
  width: clamp(240px, 70vw, 380px);
  aspect-ratio: 1;
  margin: var(--space-xs) 0 0;
  line-height: 0.9;
}

.iargs-cent-hero__mark::before,
.iargs-cent-hero__mark::after {
  content: "";
  position: absolute;
  border-radius: 50%;
}

.iargs-cent-hero__mark::before {
  inset: 0;
  border: 2px dashed rgba(210, 154, 50, 0.55);
  animation: iargs-cent-spin 80s linear infinite;
}

.iargs-cent-hero__mark::after {
  inset: 9%;
  border: 1px solid rgba(210, 154, 50, 0.4);
  box-shadow: inset 0 0 60px rgba(210, 154, 50, 0.12);
}

.iargs-cent-hero__num {
  background-image: linear-gradient(110deg, #b07a22 0%, #e7bf6a 22%, #fff1c8 32%, #e7bf6a 42%, #c48b2a 60%, #f1d48c 78%, #b07a22 100%);
  background-size: 250% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: var(--color-accent); /* sem suporte ao recorte, fica dourado liso */
  -webkit-text-fill-color: transparent;
  font-family: var(--font-heading);
  font-size: clamp(6rem, 30vw, 10.5rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  animation: iargs-cent-shine 7s ease-in-out infinite;
}

.iargs-cent-hero__word {
  margin-top: -0.1em;
  color: var(--color-accent);
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 7vw, 2.75rem);
  font-style: italic;
}

.iargs-cent-hero__years {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  font-size: var(--text-lead);
  letter-spacing: 0.3em;
}

.iargs-cent-hero__star { color: var(--color-accent); letter-spacing: 0; }

.iargs-cent-hero__title {
  max-width: 22ch;
  color: #fff;
  font-size: clamp(1.75rem, 6vw, var(--text-h1));
}

/* Contagem: o numero de dias em destaque, dentro de uma moldura dourada. */
.iargs-cent-count {
  display: grid;
  justify-items: center;
  gap: 2px;
  min-width: 220px;
  margin-top: var(--space-2xs);
  padding: var(--space-sm) var(--space-lg);
  border: 1px solid rgba(210, 154, 50, 0.7);
  border-radius: var(--radius);
  background-color: rgba(0, 0, 0, 0.18);
}

.iargs-cent-count p { margin: 0; }

.iargs-cent-count__unit {
  font-size: var(--text-small);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.iargs-cent-count__num {
  color: var(--color-accent);
  font-family: var(--font-heading);
  font-size: clamp(3rem, 14vw, 4.5rem);
  font-weight: 700;
  line-height: 1;
}

.iargs-cent-count__num--today { font-size: clamp(2.25rem, 10vw, 3rem); }

.iargs-cent-count__what { margin-top: var(--space-2xs) !important; font-size: var(--text-base); }

.iargs-cent-jump {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-sm);
  width: 100%;
  margin-top: var(--space-xs);
}

@media (min-width: 640px) {
  .iargs-cent-jump .iargs-cent-button { min-width: 220px; }
}

/* Computador: duas colunas, para a abertura caber inteira na primeira tela — o
   "100" nos aneis a esquerda; nome, datas, titulo, contagem e botoes a direita. */
@media (min-width: 1024px) {
  .iargs-cent-hero { padding-block: var(--space-xl) var(--space-2xl); }

  .iargs-cent-hero__inner {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-areas:
      "mark org"
      "mark years"
      "mark title"
      "mark count"
      "mark jump";
    align-content: center;
    justify-items: start;
    column-gap: var(--space-2xl);
    row-gap: var(--space-sm);
    max-width: calc(1040px + (var(--gutter) * 2));
    text-align: left;
  }

  .iargs-cent-hero__org { grid-area: org; align-self: end; }

  .iargs-cent-hero__mark { grid-area: mark; align-self: center; width: 400px; margin: 0; text-align: center; }

  .iargs-cent-hero__years { grid-area: years; }

  .iargs-cent-hero__title { grid-area: title; max-width: 16ch; }

  .iargs-cent-hero .iargs-cent-count { grid-area: count; justify-items: start; margin-top: 0; }

  .iargs-cent-hero .iargs-cent-jump { grid-area: jump; justify-content: flex-start; margin-top: 0; }
}

/* Convite para rolar: uma seta que pula devagar no pe da abertura. */
.iargs-cent-hero__scroll {
  position: absolute;
  bottom: var(--space-md);
  left: 50%;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin-left: -24px;
  border: 1px solid rgba(210, 154, 50, 0.6);
  border-radius: 50%;
}

.iargs-cent-hero__scroll span {
  width: 12px;
  height: 12px;
  margin-top: -6px;
  border-right: 2px solid var(--color-accent);
  border-bottom: 2px solid var(--color-accent);
  transform: rotate(45deg);
  animation: iargs-cent-bob 2.2s ease-in-out infinite;
}

/* Faiscas: pontos dourados que sobem e somem. */
.iargs-cent-hero__sparkles { position: absolute; inset: 0; pointer-events: none; }

.iargs-cent-hero__sparkles span {
  position: absolute;
  bottom: -12px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: #f1d48c;
  box-shadow: 0 0 10px 2px rgba(241, 212, 140, 0.6);
  opacity: 0;
  animation: iargs-cent-float 11s linear infinite;
}

.iargs-cent-hero__sparkles span:nth-child(1)  { left: 6%;  animation-delay: 0s; }
.iargs-cent-hero__sparkles span:nth-child(2)  { left: 14%; animation-delay: 4s;   width: 4px; height: 4px; }
.iargs-cent-hero__sparkles span:nth-child(3)  { left: 22%; animation-delay: 7.5s; }
.iargs-cent-hero__sparkles span:nth-child(4)  { left: 31%; animation-delay: 2s;   width: 3px; height: 3px; }
.iargs-cent-hero__sparkles span:nth-child(5)  { left: 39%; animation-delay: 9s; }
.iargs-cent-hero__sparkles span:nth-child(6)  { left: 47%; animation-delay: 5.5s; width: 4px; height: 4px; }
.iargs-cent-hero__sparkles span:nth-child(7)  { left: 55%; animation-delay: 1s; }
.iargs-cent-hero__sparkles span:nth-child(8)  { left: 63%; animation-delay: 8s;   width: 3px; height: 3px; }
.iargs-cent-hero__sparkles span:nth-child(9)  { left: 70%; animation-delay: 3s; }
.iargs-cent-hero__sparkles span:nth-child(10) { left: 77%; animation-delay: 6.5s; width: 4px; height: 4px; }
.iargs-cent-hero__sparkles span:nth-child(11) { left: 84%; animation-delay: 10s; }
.iargs-cent-hero__sparkles span:nth-child(12) { left: 91%; animation-delay: 2.5s; width: 3px; height: 3px; }
.iargs-cent-hero__sparkles span:nth-child(13) { left: 10%; animation-delay: 6s;   animation-duration: 14s; }
.iargs-cent-hero__sparkles span:nth-child(14) { left: 88%; animation-delay: 4.5s; animation-duration: 13s; }

/* Entrada em sequencia dos elementos da abertura. */
.iargs-cent-rise { animation: iargs-cent-in 0.9s ease-out both; }

.iargs-cent-hero__inner > :nth-child(2) { animation-delay: 0.15s; }
.iargs-cent-hero__inner > :nth-child(3) { animation-delay: 0.3s; }
.iargs-cent-hero__inner > :nth-child(4) { animation-delay: 0.45s; }
.iargs-cent-hero__inner > :nth-child(5) { animation-delay: 0.6s; }
.iargs-cent-hero__inner > :nth-child(6) { animation-delay: 0.75s; }

@keyframes iargs-cent-in {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: none; }
}

@keyframes iargs-cent-spin { to { transform: rotate(360deg); } }

@keyframes iargs-cent-shine {
  0%, 100% { background-position: 100% 0; }
  50% { background-position: 0 0; }
}

@keyframes iargs-cent-bob {
  0%, 100% { transform: translateY(0) rotate(45deg); }
  50% { transform: translateY(6px) rotate(45deg); }
}

@keyframes iargs-cent-float {
  0% { opacity: 0; transform: translateY(0) scale(0.6); }
  12% { opacity: 0.9; }
  80% { opacity: 0.6; }
  100% { opacity: 0; transform: translateY(-80vh) scale(1); }
}

/* Menos movimento: tudo parado (o tema ja zera as duracoes; aqui some o que so
   faz sentido em movimento). */
@media (prefers-reduced-motion: reduce) {
  .iargs-cent-hero__sparkles { display: none; }

  .iargs-cent-hero__mark::before,
  .iargs-cent-hero__num,
  .iargs-cent-hero__scroll span { animation: none; }
}

/* 3.1 As tres datas: faixa cor de papel logo abaixo da abertura. */
.iargs-cent-facts {
  border-bottom: 3px double var(--color-accent);
  background-color: var(--color-paper);
  scroll-margin-top: 64px;
}

.iargs-cent-facts__list {
  display: grid;
  gap: var(--space-lg);
  padding-block: var(--space-xl);
  list-style: none;
  text-align: center;
}

.iargs-cent-facts__list li { display: grid; gap: var(--space-3xs); }

.iargs-cent-facts__list strong {
  color: var(--color-primary);
  font-family: var(--font-heading);
  font-size: var(--text-h2);
  letter-spacing: 0.04em;
}

.iargs-cent-facts__list span { color: var(--color-text-muted); }

@media (min-width: 768px) {
  .iargs-cent-facts__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }

  .iargs-cent-facts__list li + li { border-left: 1px solid rgba(210, 154, 50, 0.6); }
}

/* 3.2 Apresentacao: centralizada, em serifa, com um ornamento dourado. */
.iargs-cent-intro {
  padding-block: var(--space-2xl) 0;
  font-family: var(--font-heading);
  font-size: var(--text-lead);
  text-align: center;
}

.iargs-cent-intro::before {
  content: "✦";
  display: block;
  margin-bottom: var(--space-sm);
  color: var(--color-accent-dark);
  font-size: 1.25rem;
}

/* 3.3 Efeito de entrada ao rolar (centenario.js). Sem o script, nada se esconde. */
html.iargs-cent-js .iargs-cent-reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}

html.iargs-cent-js .iargs-cent-reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* 3.4 Convite final. */
.iargs-cent-cta {
  padding-block: var(--space-2xl);
  border-top: 3px double var(--color-accent);
  background-color: var(--color-primary-dark);
  background-image: radial-gradient(ellipse 55% 70% at 50% 50%, rgba(210, 154, 50, 0.2), transparent 70%);
  color: #fff;
  text-align: center;
}

.iargs-cent-cta__inner { display: grid; justify-items: center; gap: var(--space-sm); }

.iargs-cent-cta__star { margin: 0; color: var(--color-accent); letter-spacing: 0.5em; }

.iargs-cent-cta__title { color: #fff; font-size: clamp(1.75rem, 6vw, var(--text-h1)); }

.iargs-cent-cta__text { margin: 0; font-size: var(--text-lead); }

/* O convite encosta no rodape, sem a faixa branca do respiro padrao. */
.iargs-centenary-page .iargs-footer { margin-top: 0; }



/* 4. Secoes e linha do tempo da programacao ================================ */

/* scroll-margin: os atalhos param abaixo da barra presa no topo (52px). */
.iargs-cent-section { padding-block: var(--space-xl); scroll-margin-top: 72px; }

.iargs-cent-section__inner { max-width: calc(860px + (var(--gutter) * 2)); }

.iargs-cent-section__title {
  margin-bottom: var(--space-md);
  padding-bottom: var(--space-xs);
  border-bottom: var(--border-thin);
  font-size: var(--text-h2);
}

/* A mesma assinatura das secoes da capa (SPEC-011): "§" dourado, decorativo. */
.iargs-cent-section__title::before {
  content: "§";
  margin-right: 0.3em;
  color: var(--color-accent-dark);
  font-weight: 400;
}

.iargs-cent-month {
  margin: var(--space-xl) 0 var(--space-md);
  color: var(--color-primary);
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.iargs-cent-month:first-of-type { margin-top: var(--space-md); }

.iargs-cent-timeline,
.iargs-cent-milestones {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Um evento: data a esquerda, sobre o eixo dourado; cartao a direita. */
.iargs-cent-event {
  position: relative;
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: var(--space-sm);
  padding-bottom: var(--space-md);
}

.iargs-cent-event::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 31px;
  width: 2px;
  background-color: var(--color-accent);
}

.iargs-cent-event:last-child::before { bottom: auto; height: 32px; }

.iargs-cent-event__date {
  position: relative;
  align-self: start; /* so a data; o eixo dourado continua visivel abaixo dela */
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0;
  padding-block: var(--space-2xs);
  border-top: 3px solid var(--color-primary);
  background-color: var(--color-paper);
  color: var(--color-primary);
  line-height: 1;
}

.iargs-cent-event__day { font-family: var(--font-heading); font-size: 1.75rem; font-weight: 700; }

.iargs-cent-event__weekday {
  margin-top: var(--space-3xs);
  font-size: var(--text-small);
  font-weight: 600;
  text-transform: uppercase;
}

.iargs-cent-event__card {
  display: grid;
  gap: var(--space-2xs);
  padding: var(--space-md);
  border: var(--border-thin);
  background-color: var(--color-background);
}

.iargs-cent-event__labels { display: flex; flex-wrap: wrap; gap: var(--space-2xs); margin: 0; }

.iargs-cent-label {
  display: inline-block;
  padding: 2px var(--space-xs);
  border-radius: var(--radius);
  background-color: var(--color-primary);
  color: #fff;
  font-size: var(--text-small);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.iargs-cent-label--today { background-color: var(--color-accent); color: var(--color-primary-dark); }

.iargs-cent-label--past { background-color: var(--color-surface); color: var(--color-text-muted); border: var(--border-thin); }

.iargs-cent-event__title { font-size: var(--text-h3); line-height: 1.3; }

.iargs-cent-event__title a { color: var(--color-text); text-decoration: none; }

.iargs-cent-event__title a:hover { color: var(--color-primary); text-decoration: underline; }

.iargs-cent-event__when { margin: 0; color: var(--color-primary); font-weight: 600; }

.iargs-cent-event__place {
  display: block;
  color: var(--color-text-muted);
  font-weight: 400;
}

.iargs-cent-event__excerpt { margin: 0; color: var(--color-text-muted); }

.iargs-cent-event__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-xs) var(--space-md);
  margin: var(--space-2xs) 0 0;
}

.iargs-cent-event__more {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-weight: 600;
}

/* Proximo: o cartao que importa agora. */
.iargs-cent-event.is-next .iargs-cent-event__card,
.iargs-cent-event.is-today .iargs-cent-event__card { border: 2px solid var(--color-primary); }

/* Realizado: discreto, a hierarquia fica com o que vem. */
.iargs-cent-event.is-past .iargs-cent-event__card { background-color: var(--color-surface); }

.iargs-cent-event.is-past .iargs-cent-event__date { border-top-color: var(--color-border); color: var(--color-text-muted); }

.iargs-cent-event.is-past .iargs-cent-event__when { color: var(--color-text-muted); }

/* A celebracao fecha a linha do tempo. */
.iargs-cent-event.is-celebration .iargs-cent-event__card {
  border: 2px solid var(--color-accent);
  background-color: var(--color-primary-dark);
  color: #fff;
}

.iargs-cent-event.is-celebration .iargs-cent-event__date {
  border-top-color: var(--color-accent);
  background-color: var(--color-primary-dark);
  color: var(--color-accent);
}

.iargs-cent-event.is-celebration .iargs-cent-event__title,
.iargs-cent-event.is-celebration .iargs-cent-event__title a { color: var(--color-accent); }

.iargs-cent-event.is-celebration .iargs-cent-event__title { font-size: var(--text-h2); }

.iargs-cent-event.is-celebration .iargs-cent-event__when,
.iargs-cent-event.is-celebration .iargs-cent-event__place,
.iargs-cent-event.is-celebration .iargs-cent-event__excerpt,
.iargs-cent-event.is-celebration .iargs-cent-event__more { color: #fff; }

.iargs-cent-label--celebration { background-color: var(--color-accent); color: var(--color-primary-dark); }

.iargs-cent-event.is-celebration .iargs-cent-button {
  border-color: var(--color-accent);
  background-color: var(--color-accent);
  color: var(--color-primary-dark);
}

@media (min-width: 640px) {
  .iargs-cent-event { grid-template-columns: 88px minmax(0, 1fr); gap: var(--space-md); }

  .iargs-cent-event::before { left: 43px; }

  .iargs-cent-event__day { font-size: 2.25rem; }
}

/* 5. Linha do tempo historica ============================================== */

.iargs-cent-history { background-color: var(--color-paper); }

.iargs-cent-history .iargs-cent-section__inner { max-width: calc(var(--container-max) + (var(--gutter) * 2)); }

.iargs-cent-decades {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2xs);
  margin-bottom: var(--space-lg);
}

.iargs-cent-decades a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 72px;
  min-height: 44px;
  padding: 0 var(--space-sm);
  border: 1px solid var(--color-primary);
  border-radius: var(--radius);
  background-color: var(--color-background);
  font-weight: 600;
  text-decoration: none;
}

.iargs-cent-decades a:hover { background-color: var(--color-primary); color: #fff; }

.iargs-cent-decade {
  scroll-margin-top: 72px;
  margin: var(--space-lg) 0 var(--space-md);
  color: var(--color-primary);
  font-size: var(--text-h3);
}

.iargs-cent-milestone {
  position: relative;
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: var(--space-sm);
  padding-bottom: var(--space-md);
}

.iargs-cent-milestone::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 35px;
  width: 2px;
  background-color: var(--color-accent);
}

.iargs-cent-milestone__year {
  position: relative;
  align-self: start;
  margin: 0;
  padding-block: var(--space-2xs);
  background-color: var(--color-primary-dark);
  color: var(--color-accent);
  font-family: var(--font-heading);
  font-size: 1.375rem;
  font-weight: 700;
  line-height: 1;
  text-align: center;
}

.iargs-cent-milestone__card {
  display: grid;
  gap: var(--space-2xs);
  padding: var(--space-md);
  border-top: 3px solid var(--color-accent);
  background-color: var(--color-background);
}

.iargs-cent-milestone__media { margin: 0 0 var(--space-2xs); }

/* Recorte 3:2, como as fotos do tema: um retrato nao estica o marco. */
.iargs-cent-milestone__media img {
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  object-position: center 25%;
}

.iargs-cent-milestone__title { font-size: var(--text-h3); line-height: 1.3; }

.iargs-cent-milestone__date { margin: 0; color: var(--color-primary); font-weight: 600; }

.iargs-cent-milestone__text > * + * { margin-top: var(--space-xs); }

/* Computador: eixo no centro, marcos alternando os lados (decisao 8). */
@media (min-width: 1024px) {
  .iargs-cent-decade { text-align: center; }

  .iargs-cent-milestone {
    grid-template-columns: minmax(0, 1fr) 120px minmax(0, 1fr);
    gap: 0;
  }

  .iargs-cent-milestone::before { left: calc(50% - 1px); }

  .iargs-cent-milestone__year {
    grid-column: 2;
    grid-row: 1;
    margin-inline: var(--space-sm);
    font-size: var(--text-h3);
  }

  .iargs-cent-milestone__card { grid-row: 1; grid-column: 3; }

  .iargs-cent-milestone.is-left .iargs-cent-milestone__card { grid-column: 1; text-align: right; }
}

/* 6. Destaque na capa ====================================================== */

/* A faixa do tema (iargs-home-band) recebe o vermelho de ponta a ponta. Vence a
   regra "faixa depois dos banners" do tema, que zera borda e respiro. */
.iargs-home-band.iargs-home-band--centenary {
  margin-top: var(--space-lg);
  padding-block: var(--space-xl);
  border-top: 3px double var(--color-accent);
  border-bottom: 3px double var(--color-accent);
  background-color: var(--color-primary-dark);
  background-image: repeating-linear-gradient(-45deg, transparent 0 18px, rgba(210, 154, 50, 0.08) 18px 20px);
  color: #fff;
}

.iargs-home-band--centenary + .iargs-home-band { border-top: 0; }

.iargs-cent-home__inner {
  display: grid;
  gap: var(--space-xl);
}

.iargs-cent-home__intro { display: grid; align-content: start; gap: var(--space-sm); }

.iargs-cent-home__title { color: #fff; font-size: var(--text-h2); }

.iargs-cent-home__text { font-size: var(--text-lead); line-height: 1.5; }

.iargs-cent-home__events { display: grid; align-content: start; gap: var(--space-md); }

.iargs-cent-home__subtitle {
  color: #fff;
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.iargs-cent-home__list { display: grid; gap: var(--space-sm); }

.iargs-cent-home__item {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: var(--space-sm);
  padding-bottom: var(--space-sm);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.iargs-cent-date {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0;
  padding-block: var(--space-2xs);
  border-top: 3px solid var(--color-accent);
  background-color: var(--color-paper);
  color: var(--color-primary);
  line-height: 1;
}

.iargs-cent-date__day { font-family: var(--font-heading); font-size: 1.75rem; font-weight: 700; }

.iargs-cent-date__month {
  margin-top: var(--space-3xs);
  font-size: var(--text-small);
  font-weight: 600;
  text-transform: uppercase;
}

.iargs-cent-home__event { font-size: max(1.125rem, var(--text-lead)); line-height: 1.3; }

.iargs-cent-home__event a { color: #fff; text-decoration: none; }

.iargs-cent-home__event a:hover { text-decoration: underline; }

.iargs-cent-home__when { margin-top: var(--space-3xs); font-size: var(--text-base); }

.iargs-cent-home__more { margin: 0; }

@media (min-width: 1024px) {
  .iargs-cent-home__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-2xl); }

  .iargs-cent-home__events { padding-left: var(--space-xl); border-left: 1px solid rgba(210, 154, 50, 0.5); }
}

/* 7. Etiqueta no evento ==================================================== */

.iargs-cent-tag { margin: var(--space-2xs) 0 0; }

.iargs-cent-tag > a,
.iargs-cent-tag > span {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 2px var(--space-xs);
  border: 1px solid var(--color-accent-dark);
  border-left-width: 4px;
  color: var(--color-primary);
  font-size: var(--text-small);
  font-weight: 700;
  text-decoration: none;
}

.iargs-cent-tag a:hover { background-color: var(--color-paper); }

.iargs-cent-tag--single { margin-top: var(--space-sm); }

/* Na linha de selos do tema (SPEC-020): pequeno, dourado, ao lado de "Hoje" e
   "Inscrições abertas". */
.iargs-event__tags .iargs-cent-tag { margin: 0; }

.iargs-event__tags .iargs-cent-tag > a,
.iargs-event__tags .iargs-cent-tag > span {
  min-height: 26px;
  padding: 2px var(--space-2xs);
  border: 1px solid var(--color-accent-dark);
  border-radius: var(--radius);
  background-color: var(--color-paper);
  font-size: var(--text-meta);
  letter-spacing: 0.04em;
  line-height: 1.2;
}

/* 8. Compartilhar e imprimir (SPEC-017) ===================================== */

.iargs-cent-print-wrap { margin: calc(var(--space-sm) * -1) 0 var(--space-md); }

.iargs-cent-cta__share { margin: 0; }

/* WhatsApp sobre o vermelho escuro: contorno claro. */
.iargs-cent-cta .iargs-action {
  border-color: rgba(255, 255, 255, 0.7);
  background-color: transparent;
  color: #fff;
}

.iargs-cent-cta .iargs-action:hover { background-color: #fff; color: var(--color-primary-dark); }

/* Impressao: a programacao e a historia completas, a abertura reduzida a nome,
   datas e titulo, nada de efeito nem fundo escuro. */
@media print {
  .iargs-cent-hero__sparkles,
  .iargs-cent-hero__scroll,
  .iargs-cent-hero .iargs-cent-jump,
  .iargs-cent-print-wrap,
  .iargs-cent-decades,
  .iargs-cent-event__actions,
  .iargs-cent-cta { display: none !important; }

  /* A entrada em sequencia da abertura comeca transparente: impressa no meio
     dela, a contagem saia em branco. No papel, tudo ja entrado. */
  .iargs-cent-rise { animation: none !important; opacity: 1 !important; transform: none !important; }

  .iargs-centenary-page .iargs-branding,
  .iargs-cent-hero,
  .iargs-cent-facts,
  .iargs-cent-history { background: none !important; color: #000; }

  .iargs-cent-hero { min-height: 0; padding-block: 0 12pt; }

  .iargs-cent-hero__mark { width: auto; aspect-ratio: auto; }

  .iargs-cent-hero__mark::before,
  .iargs-cent-hero__mark::after { display: none; }

  .iargs-cent-hero__num {
    background: none;
    color: #000;
    -webkit-text-fill-color: #000;
    font-size: 40pt;
    animation: none;
  }

  .iargs-cent-hero__org,
  .iargs-cent-hero__word,
  .iargs-cent-hero__years,
  .iargs-cent-hero__star,
  .iargs-cent-hero__title,
  .iargs-cent-count__num { color: #000; }

  .iargs-cent-count { border-color: #000; background: none; }

  /* Sem a transicao: o que ainda nao entrou na tela sairia transparente no papel. */
  html.iargs-cent-js .iargs-cent-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }

  .iargs-cent-event__card { break-inside: avoid; }

  .iargs-cent-event.is-celebration .iargs-cent-event__card,
  .iargs-cent-event.is-celebration .iargs-cent-event__date {
    border-color: #000;
    background: #fff; /* fundo branco: o eixo dourado nao atravessa a data */
    color: #000;
  }

  .iargs-cent-event.is-celebration .iargs-cent-event__title,
  .iargs-cent-event.is-celebration .iargs-cent-event__title a,
  .iargs-cent-event.is-celebration .iargs-cent-event__when,
  .iargs-cent-event.is-celebration .iargs-cent-event__place,
  .iargs-cent-event.is-celebration .iargs-cent-event__excerpt { color: #000; }

  .iargs-cent-milestone__media img { max-height: 6cm; }
}