/* =====================================================================
   CURSO - DESAFIOS EMERGENTES: REFORMAS DO ESTADO E AVALIAÇÃO DE
   POLÍTICAS PÚBLICAS
   Folha de estilos principal

   Índice:
   1. Variáveis (design tokens) — cores, fontes, espaçamentos
   2. Reset / base
   3. Utilitários (container, títulos de seção, etc.)
   4. Cabeçalho / navegação
   5. Hero (marca do evento)
   6. Sobre o evento
   7. Inscrição
   8. Mensagem do conselheiro
   9. Programação
   10. Hospedagem
   11. Contato / rodapé
   12. Media queries principais estão junto de cada bloco (mobile-first)
===================================================================== */

/* ---------------------------------------------------------------------
   1. VARIÁVEIS
   Cores extraídas do layout oficial (layout página fgv.pdf). Para
   alterar a paleta do site inteiro, basta editar os valores abaixo.
--------------------------------------------------------------------- */
:root {
  /* Cores da marca */
  --color-navy: #183e72;
  /* azul principal (fundo do "Sobre", cartões da programação) */
  --color-navy-title: #134679;
  /* azul dos títulos de seção */
  --color-navy-dark: #1c2747;
  /* azul escuro (faixa de inscrição, nomes) */
  --color-red: #b3311e;
  /* vermelho (destaques, linhas, datas, hospedagem, rodapé) */
  --color-red-dark: #8e251a;
  /* vermelho escuro (formas decorativas) */
  --color-pink: #f7b3ae;
  /* rosa claro (destaques sobre o vermelho do topo) */
  --color-ice: #d9e7f6;
  /* azul gelo (datas do topo, "clicando aqui") */

  /* Neutros */
  --color-charcoal: #434648;
  /* texto principal */
  --color-white: #ffffff;
  --color-offwhite: #f9f9f9;
  /* fundo do contato */
  --color-light: #f1f1f1;
  /* fundo da programação */

  /* Tipografia */
  --font-display: 'Bebas Neue', 'Arial Narrow', sans-serif;
  /* títulos, menu, rótulos */
  --font-sans: 'Montserrat', 'Segoe UI', Arial, sans-serif;
  /* textos */
  --font-serif: 'EB Garamond', Georgia, 'Times New Roman', serif;
  /* texto da mensagem */

  /* Layout */
  --container-width: 1200px;
  --container-padding: 1.5rem;
  --radius-sm: 8px;
  --radius-md: 24px;
  --radius-lg: 32px;
  --radius-pill: 999px;

  /* Transições */
  --transition-base: 0.3s ease;
}

/* ---------------------------------------------------------------------
   2. RESET / BASE
--------------------------------------------------------------------- */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 84px;
  scrollbar-gutter: stable;
}

body,
h1,
h2,
h3,
h4,
p,
ul,
li,
figure {
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font-sans);
  color: var(--color-charcoal);
  background-color: var(--color-white);
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

ul {
  list-style: none;
}

button {
  font: inherit;
  color: inherit;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}

/* ---------------------------------------------------------------------
   3. UTILITÁRIOS
--------------------------------------------------------------------- */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

.container {
  width: 100%;
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: var(--container-padding);
}

.section-title {
  font-family: var(--font-display);
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  line-height: 1.1;
  font-size: clamp(2rem, 1.5rem + 2vw, 2.75rem);
  color: var(--color-navy-title);
  text-align: center;
  position: relative;
  padding-bottom: 1rem;
  margin-bottom: 2.25rem;
}

.section-title::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: min(100px, 60%);
  height: 3px;
  background-color: var(--color-red);
}

.section-title--light {
  color: var(--color-white);
}

/* ---------------------------------------------------------------------
   4. CABEÇALHO / NAVEGAÇÃO
--------------------------------------------------------------------- */
.header {
  position: sticky;
  top: 0;
  z-index: 100;
  background-color: var(--color-white);
  transition: box-shadow var(--transition-base);
}

.header.is-scrolled {
  box-shadow: 0 2px 18px rgba(24, 62, 114, 0.12);
}

.header__container {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 84px;
}

.nav__list {
  display: flex;
  align-items: center;
  gap: clamp(1.5rem, 1rem + 3vw, 5rem);
  flex-wrap: wrap;
  justify-content: center;
}

.nav__link {
  font-family: var(--font-display);
  font-size: 1.3rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--color-charcoal);
  padding: 0 2px 4px;
  border-bottom: 2px solid #9a9c9d;
  transition: color var(--transition-base), border-color var(--transition-base);
}

.nav__link:hover,
.nav__link:focus-visible {
  color: var(--color-red);
  border-color: var(--color-red);
}

.hamburger {
  display: none;
  position: absolute;
  right: var(--container-padding);
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: auto;
  line-height: 0;
  z-index: 101;
}

.hamburger img {
  width: 50px;
  height: auto;
  display: block;
}

@media (max-width: 767px) {
  .header__container {
    justify-content: flex-start;
    min-height: 68px;
  }

  .hamburger {
    display: block;
  }

  .nav__list {
    position: fixed;
    inset: 68px 0 0 0;
    height: calc(100vh - 68px);
    background-color: var(--color-white);
    flex-direction: column;
    justify-content: flex-start;
    gap: 0;
    transform: translateX(100%);
    transition: transform var(--transition-base);
    overflow-y: auto;
    padding: 2rem 0;
  }

  .nav__list.is-open {
    transform: translateX(0);
  }

  .nav__list li {
    width: 100%;
    text-align: center;
  }

  .nav__link {
    display: block;
    padding: 1rem 0;
    border-bottom: 1px solid #eee;
    font-size: 1.4rem;
  }
}

/* ---------------------------------------------------------------------
   5. HERO (MARCA DO EVENTO)
   O fundo (foto com as curvas do layout) acompanha a largura da tela;
   os tamanhos de fonte em vw mantêm a proporção do layout.
--------------------------------------------------------------------- */
.hero {
  position: relative;
  background-color: var(--color-white);
  padding-top: clamp(5rem, 11vw, 14rem);
  padding-bottom: clamp(4rem, 9vw, 11rem);
  overflow: hidden;
  isolation: isolate;
  color: var(--color-white);
}

/* Desktop: a altura acompanha a proporção da imagem (1920x1442),
   preservando a curva superior e o recorte branco inferior direito */
@media (min-width: 768px) {
  .hero {
    aspect-ratio: 1920 / 1442;
  }
}

.hero__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

.hero__bg img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center top;
}

.hero__container {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.hero__titulo {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-weight: 400;
}

.hero__curso {
  font-family: var(--font-sans);
  font-size: clamp(1.1rem, 0.6rem + 1.8vw, 2.4rem);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  line-height: 1;
  margin-right: -0.18em;
}

.hero__nome {
  font-family: var(--font-display);
  font-size: clamp(4.2rem, 1rem + 11vw, 10.5rem);
  text-transform: uppercase;
  line-height: 0.88;
  letter-spacing: -0.005em;
}

.hero__curso + .hero__nome {
  margin-top: 0.12em;
}

.hero__nome--destaque {
  color: var(--color-pink);
}

.hero__tema {
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: clamp(1.15rem, 0.55rem + 2vw, 2.4rem);
  line-height: 1.15;
  margin-top: 0.35em;
}

.hero__divisor {
  display: block;
  width: clamp(140px, 22vw, 256px);
  height: clamp(5px, 0.6vw, 8px);
  background-color: var(--color-white);
  margin-block: clamp(1.5rem, 1rem + 1.5vw, 2.25rem);
}

.hero__info {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: clamp(1.25rem, 0.5rem + 3vw, 2.5rem);
  text-align: left;
}

.hero__data {
  font-family: var(--font-display);
  line-height: 0.85;
  text-align: center;
}

.hero__dias {
  display: block;
  color: var(--color-ice);
  font-size: clamp(3.2rem, 2rem + 3.5vw, 4.5rem);
}

.hero__dias small {
  font-size: 0.66em;
  margin-inline: 0.04em;
}

.hero__mes {
  display: block;
  font-size: clamp(1.8rem, 1rem + 2vw, 2.45rem);
  text-transform: uppercase;
}

.hero__local {
  display: flex;
  flex-direction: column;
  padding-top: 0.15rem;
  transition: opacity var(--transition-base);
}

.hero__local:hover,
.hero__local:focus-visible {
  opacity: 0.85;
}

.hero__local-nome {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: clamp(1.35rem, 0.9rem + 1.2vw, 2rem);
  color: var(--color-pink);
  line-height: 1.1;
}

.hero__pin {
  width: 0.72em;
  height: auto;
  fill: var(--color-pink);
  flex-shrink: 0;
}

.hero__local-endereco {
  font-family: var(--font-sans);
  font-style: italic;
  font-size: clamp(0.8rem, 0.7rem + 0.3vw, 0.9rem);
  line-height: 1.3;
  margin-top: 0.4rem;
  padding-left: 0.15rem;
}

@media (max-width: 480px) {
  .hero__info {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .hero__local {
    align-items: center;
  }
}

/* ---------------------------------------------------------------------
   6. SOBRE O EVENTO
--------------------------------------------------------------------- */
.sobre {
  background-color: var(--color-navy);
  color: var(--color-white);
  padding-block: clamp(3.5rem, 2.5rem + 4vw, 6rem);
}

.sobre__container {
  max-width: 860px;
  text-align: center;
}

.sobre p {
  font-size: clamp(1rem, 0.95rem + 0.25vw, 1.15rem);
  line-height: 1.55;
}

.sobre p+p {
  margin-top: 1.1rem;
}

/* ---------------------------------------------------------------------
   7. INSCRIÇÃO
--------------------------------------------------------------------- */
.inscricao {
  background-color: var(--color-navy-dark);
  color: var(--color-white);
  padding-block: clamp(3rem, 2.25rem + 3vw, 4.5rem);
}

.inscricao__container {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.inscricao__link {
  position: relative;
  display: inline-block;
  background-color: var(--color-navy);
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: clamp(1.6rem, 1rem + 3.2vw, 3.4rem);
  white-space: nowrap;
  line-height: 1.05;
  letter-spacing: 0.005em;
  padding: 0.38em 1.05em 0.32em;
  border-radius: 999px;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.25);
  transition: background-color var(--transition-base);
}

.inscricao__link:hover,
.inscricao__link:focus-visible {
  background-color: var(--color-navy-title);
}

.inscricao__destaque {
  text-decoration: underline;
  text-decoration-thickness: 3px;
  text-underline-offset: 6px;
  transition: color var(--transition-base);
}

.inscricao__cursor {
  position: absolute;
  right: -0.25em;
  bottom: -0.4em;
  width: 0.8em;
  height: auto;
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.inscricao__link:hover .inscricao__destaque,
.inscricao__link:focus-visible .inscricao__destaque {
  color: var(--color-ice);
}

.inscricao__link:hover .inscricao__cursor,
.inscricao__link:focus-visible .inscricao__cursor {
  transform: translate(-4px, -4px) scale(0.92);
}

.inscricao__info {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 560px;
  margin-top: 1.25rem;
}

.inscricao__toggle {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  background-color: var(--color-ice);
  color: var(--color-navy-title);
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: clamp(1.3rem, 1.15rem + 0.6vw, 1.65rem);
  line-height: 1;
  padding: 0.55em 1.1em 0.45em;
  border-radius: 999px;
  transition: transform var(--transition-base);
}

.inscricao__toggle:hover {
  transform: translateY(-2px);
}

.inscricao__chevron {
  width: 18px;
  height: 11px;
  flex-shrink: 0;
  margin-top: -2px;
  transition: transform var(--transition-base);
}

.inscricao__toggle[aria-expanded="false"] .inscricao__chevron {
  transform: rotate(180deg);
}

.inscricao__panel {
  width: 100%;
  margin-top: -1.4rem;
  background-color: var(--color-white);
  color: var(--color-charcoal);
  border-radius: 28px;
  padding: 2.6rem clamp(1.25rem, 0.75rem + 2vw, 2.75rem) 1.5rem;
  font-size: clamp(0.9rem, 0.86rem + 0.2vw, 1rem);
  line-height: 1.45;
}

.inscricao__panel p+p {
  margin-top: 1.2rem;
}

.inscricao__panel strong {
  font-weight: 700;
}

.inscricao__panel a:hover {
  color: var(--color-navy);
}

.inscricao__valor {
  color: var(--color-red);
}

.inscricao__certidoes {
  display: inline-block;
  cursor: pointer;
  margin-top: 1.3rem;
  background-color: var(--color-red);
  color: var(--color-white);
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  padding: 0.65em 1.4em;
  border-radius: 999px;
  transition: background-color var(--transition-base);
}

.inscricao__panel .inscricao__certidoes:hover,
.inscricao__certidoes:focus-visible {
  background-color: var(--color-red-dark);
  color: var(--color-white);
}

.certidoes {
  margin-top: 1.1rem;
  text-align: left;
}

.certidoes__lista {
  display: grid;
  gap: 0.5rem;
}

.certidoes__linha {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.certidoes__linha .certidoes__item {
  flex: 1;
  min-width: 0;
}

.certidoes__check {
  width: 1.15rem;
  height: 1.15rem;
  flex-shrink: 0;
  accent-color: var(--color-red);
  cursor: pointer;
}

.certidoes__acoes {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  margin-top: 1rem;
}

.certidoes__todos {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-weight: 700;
  color: var(--color-navy-title);
  cursor: pointer;
}

.certidoes__zip {
  background-color: var(--color-navy);
  color: var(--color-white);
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 0.75em 1.3em;
  border-radius: 999px;
  cursor: pointer;
  transition: background-color var(--transition-base), opacity var(--transition-base);
}

.certidoes__zip:hover:not(:disabled) {
  background-color: var(--color-navy-dark);
}

.certidoes__zip:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.certidoes__status {
  margin-top: 0.6rem;
  font-size: 0.8rem;
  text-align: center;
}

.certidoes__status:empty {
  display: none;
}

.certidoes[hidden] {
  display: none;
}

.certidoes__item {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  padding: 0.7rem 2.6rem 0.7rem 1rem;
  border: 1px solid var(--color-ice);
  border-radius: 14px;
  background: var(--color-offwhite) url("../img/icone-download.svg") no-repeat right 1rem center / 18px;
  transition: border-color var(--transition-base), background-color var(--transition-base);
}

.inscricao__panel .certidoes__item:hover,
.certidoes__item:focus-visible {
  border-color: var(--color-navy);
  background-color: var(--color-ice);
  color: var(--color-charcoal);
}

.certidoes__nome {
  font-weight: 700;
  color: var(--color-navy-title);
  line-height: 1.3;
}

.certidoes__meta {
  font-size: 0.8rem;
  color: var(--color-charcoal);
}

.certidoes__tamanho {
  white-space: nowrap;
}

/* ---------------------------------------------------------------------
   8. MENSAGEM DO CONSELHEIRO
--------------------------------------------------------------------- */
.mensagem {
  padding-block: clamp(4rem, 3rem + 4vw, 6rem);
}

.depoimento {
  max-width: 900px;
  margin-inline: auto;
}

.depoimento__texto {
  font-family: var(--font-serif);
  font-size: clamp(1.05rem, 1rem + 0.25vw, 1.2rem);
  line-height: 1.55;
  text-align: justify;
  hyphens: auto;
}

.depoimento__texto p {
  margin-bottom: 1rem;
}

.depoimento__autor {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.1rem;
  margin-top: 2.25rem;
}

.depoimento__foto {
  width: 84px;
  height: auto;
  flex-shrink: 0;
}

.depoimento__nome {
  font-family: var(--font-display);
  font-size: 1.6rem;
  color: var(--color-navy-dark);
  line-height: 1;
  margin-bottom: 0.5rem;
}

.depoimento__cargo {
  color: var(--color-red);
  font-size: 0.8rem;
  line-height: 1.35;
}

/* ---------------------------------------------------------------------
   9. PROGRAMAÇÃO
--------------------------------------------------------------------- */
.programacao {
  position: relative;
  background-color: var(--color-light);
  padding-block: clamp(4rem, 3rem + 5vw, 8rem);
  overflow: hidden;
  isolation: isolate;
}

.programacao__local {
  margin: -1.1rem 0 2.25rem;
  text-align: center;
  font-weight: 700;
  font-size: clamp(0.95rem, 0.85rem + 0.4vw, 1.15rem);
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--color-red);
}

.programacao__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

.programacao__forma {
  position: absolute;
  max-width: none;
  height: auto;
}

.programacao__forma--vermelho {
  top: 0;
  left: 0;
  width: clamp(260px, 40vw, 760px);
  transform: translate(-30%, -40%);
}

.programacao__forma--cinza {
  top: 12%;
  right: 0;
  width: clamp(200px, 26vw, 520px);
  transform: translateX(62%);
}

.programacao__forma--azul {
  bottom: 0;
  left: 0;
  width: clamp(280px, 36vw, 700px);
  transform: translate(-42%, 58%);
}

.timeline {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  max-width: 540px;
  margin-inline: auto;
}

.timeline__track {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  position: relative;
}

.timeline__day {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.timeline__day+.timeline__day {
  margin-top: 1.25rem;
}

.timeline__date {
  font-family: var(--font-display);
  background-color: var(--color-red);
  color: var(--color-white);
  text-transform: uppercase;
  letter-spacing: 0.01em;
  font-size: 1.5rem;
  line-height: 1;
  padding: 0.45rem 1.1rem 0.35rem;
  border-radius: var(--radius-sm);
  margin-bottom: 0.9rem;
}

.timeline__card {
  display: flex;
  flex-direction: column;
  background-color: var(--color-navy);
  color: var(--color-white);
  border-radius: var(--radius-md);
  padding: 0.6rem 1.5rem;
  width: 100%;
  min-height: 120px;
}

.timeline__evento {
  display: flex;
  align-items: flex-start;
  gap: 1.2rem;
  width: 100%;
  padding-block: 1rem;
}

.timeline__evento+.timeline__evento {
  border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.timeline__hour {
  font-family: var(--font-display);
  font-size: 1.85rem;
  line-height: 1;
  flex-shrink: 0;
  min-width: 2.6rem;
  white-space: nowrap;
}

.timeline__info {
  flex: 1 1 auto;
  min-width: 0;
}

.timeline__tipo {
  display: inline-block;
  font-family: var(--font-display);
  font-size: 0.9rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-white);
  background-color: var(--color-red);
  padding: 0.1rem 0.55rem 0;
  border-radius: 4px;
  margin-bottom: 0.4rem;
}

.timeline__painel {
  font-weight: 800;
  font-size: 1.05rem;
  line-height: 1.3;
}

.timeline__descricao {
  font-style: italic;
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.9rem;
  margin-top: 0.25rem;
}

.timeline__participantes {
  margin-top: 0.4rem;
}

.timeline__mesa {
  font-family: var(--font-display);
  font-size: 0.95rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-pink);
}

.timeline__mesa:not(:first-child) {
  margin-top: 0.4rem;
}

.timeline__pessoas {
  list-style: none;
  margin: 0.1rem 0 0;
  padding: 0;
}

.timeline__pessoa {
  font-size: 0.88rem;
  line-height: 1.35;
}

.timeline__pessoa+.timeline__pessoa {
  margin-top: 0.3rem;
}

.timeline__pessoa-nome {
  font-weight: 700;
}

.timeline__pessoa-cargo,
.timeline__pessoa-tema {
  display: block;
  font-style: italic;
  font-size: 0.82rem;
  color: rgba(255, 255, 255, 0.75);
}

.timeline__erro {
  width: 100%;
  font-size: 1.1rem;
  color: var(--color-navy);
  text-align: center;
  padding: 1rem;
}

.programacao__nota {
  max-width: 540px;
  margin: 1.5rem auto 0;
  text-align: center;
  font-style: italic;
  font-size: 0.95rem;
  color: var(--color-charcoal);
}

/* Botão de download do PDF da programação */
.btn-pdf {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin: 1.5rem auto 0;
  padding: 0.8rem 1.75rem 0.7rem;
  background-color: var(--color-red);
  border: 0;
  border-radius: var(--radius-pill);
  font-family: var(--font-display);
  font-size: 1.25rem;
  letter-spacing: 0.02em;
  line-height: 1;
  color: var(--color-white);
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
  transition: transform var(--transition-base), box-shadow var(--transition-base), opacity var(--transition-base);
}

.btn-pdf[hidden] {
  display: none;
}

.btn-pdf__icone {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  margin-top: -3px;
}

.btn-pdf:hover:not(:disabled),
.btn-pdf:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25);
}

.btn-pdf:focus-visible {
  outline: 3px solid var(--color-navy);
  outline-offset: 3px;
}

.btn-pdf:disabled {
  cursor: progress;
  opacity: 0.75;
}

.timeline__arrow {
  display: none;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  opacity: 0.9;
  transition: opacity var(--transition-base), transform var(--transition-base);
}

.timeline__arrow:hover {
  opacity: 1;
  transform: scale(1.08);
}

.timeline__arrow img {
  width: 100%;
  height: 100%;
}

@media (max-width: 767px) {
  .programacao__forma--cinza {
    display: none;
  }

  .timeline__track {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .timeline__track::-webkit-scrollbar {
    display: none;
  }

  .timeline__day {
    scroll-snap-align: center;
    flex: 0 0 100%;
    min-width: 100%;
  }

  .timeline__day+.timeline__day {
    margin-top: 0;
  }

  /* Setas flutuam ao lado da data, sem estreitar o cartão */
  .timeline__arrow {
    display: block;
    position: absolute;
    top: -2px;
    z-index: 2;
  }

  .timeline__arrow--prev {
    left: 0;
  }

  .timeline__arrow--next {
    right: 0;
  }

  .timeline__card {
    padding: 0.5rem 1.25rem;
  }
}

/* ---------------------------------------------------------------------
   10. HOSPEDAGEM
--------------------------------------------------------------------- */
.hospedagem {
  position: relative;
  background-color: var(--color-red);
  padding-block: clamp(3rem, 2rem + 4vw, 5rem);
  overflow: hidden;
  isolation: isolate;
}

.hospedagem__bg {
  position: absolute;
  bottom: 0;
  height: 100%;
  max-height: 643px;
  width: auto;
  max-width: none;
  z-index: -1;
  pointer-events: none;
}

.hospedagem__bg--left {
  left: 0;
}

.hospedagem__bg--right {
  right: 0;
}

.hospedagem__container {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.hospedagem__icon {
  width: 106px;
  height: 106px;
  margin-bottom: 1.75rem;
}

.hospedagem__toggle {
  display: flex;
  align-items: center;
  gap: 1rem;
  background-color: var(--color-white);
  color: var(--color-navy-title);
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.01em;
  font-size: clamp(1.2rem, 1rem + 0.6vw, 1.6rem);
  line-height: 1.1;
  padding: 1.1rem 2.25rem 1rem;
  border-radius: var(--radius-md);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
  transition: box-shadow var(--transition-base), transform var(--transition-base);
}

.hospedagem__toggle:hover {
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.25);
  transform: translateY(-2px);
}

.hospedagem__chevron {
  width: 24px;
  height: 14px;
  flex-shrink: 0;
  margin-top: -2px;
  transition: transform var(--transition-base);
}

.hospedagem__toggle[aria-expanded="true"] .hospedagem__chevron {
  transform: rotate(180deg);
}

.hospedagem__panel {
  max-width: 1160px;
  width: 100%;
  margin-top: 2.25rem;
  background-color: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: var(--radius-lg);
  padding: clamp(1.75rem, 1.25rem + 1.5vw, 3rem) clamp(1.25rem, 1rem + 2vw, 2.5rem);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.18);
}

.hospedagem__intro {
  font-size: clamp(1rem, 0.95rem + 0.25vw, 1.1rem);
  line-height: 1.55;
  max-width: 820px;
  margin: 0 auto 2.25rem;
}

.hospedagem__grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.75rem;
  width: 100%;
  margin-bottom: 2.25rem;
}

.hospedagem__loading,
.hospedagem__error {
  width: 100%;
  padding: 2.5rem 1rem;
  font-style: italic;
  font-size: 1.05rem;
  text-align: center;
}

/* Card Individual de Hotel */
.hotel-card {
  flex: 1 1 310px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  background-color: var(--color-white);
  border-radius: var(--radius-md);
  padding: 1.75rem 1.5rem;
  text-align: left;
  box-shadow: 0 10px 26px rgba(24, 62, 114, 0.08);
  border: 1px solid rgba(24, 62, 114, 0.08);
  transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);
  position: relative;
}

.hotel-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 18px 38px rgba(24, 62, 114, 0.16);
  border-color: rgba(179, 49, 30, 0.35);
}

.hotel-card__header {
  margin-bottom: 1.1rem;
}

.hotel-card__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.6rem;
}

.hotel-card__stars {
  display: flex;
  align-items: center;
  gap: 2px;
}

.hotel-card__star {
  width: 18px;
  height: 18px;
  fill: var(--color-red);
  flex-shrink: 0;
}

.hotel-card__cat-badge {
  font-family: var(--font-display);
  font-size: 0.9rem;
  letter-spacing: 0.04em;
  color: var(--color-navy);
  background-color: rgba(24, 62, 114, 0.08);
  padding: 0.2rem 0.65rem 0.1rem;
  border-radius: var(--radius-pill);
  text-transform: uppercase;
}

.hotel-card__title {
  font-weight: 700;
  font-size: 1.15rem;
  line-height: 1.3;
  color: var(--color-navy);
  margin: 0;
}

.hotel-card__price {
  background-color: #fbf1ef;
  border: 1px solid rgba(179, 49, 30, 0.25);
  border-radius: var(--radius-sm);
  padding: 0.75rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  margin-bottom: 1.25rem;
}

.hotel-card__price-label {
  font-family: var(--font-display);
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-navy);
  opacity: 0.85;
}

.hotel-card__price-value {
  font-family: var(--font-display);
  font-size: 1.55rem;
  letter-spacing: 0.02em;
  color: var(--color-red);
  line-height: 1.1;
}

.hotel-card__address {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  font-size: 0.9rem;
  line-height: 1.45;
  margin-bottom: 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}

.hotel-card__address-pin {
  width: 15px;
  height: 20px;
  flex-shrink: 0;
  margin-top: 2px;
}

.hotel-card__address-lines {
  white-space: pre-line;
}

.hotel-card__features {
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem 0;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  flex-grow: 1;
}

.hotel-card__feature-item {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  font-size: 0.9rem;
  line-height: 1.4;
}

.hotel-card__feature-icon {
  color: var(--color-red);
  font-weight: 700;
  line-height: 1.3;
  flex-shrink: 0;
}

.hotel-card__footer {
  margin-top: auto;
  padding-top: 0.5rem;
}

.hotel-card__map-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  width: 100%;
  padding: 0.75rem 1rem 0.65rem;
  background-color: var(--color-white);
  color: var(--color-navy);
  border: 1.5px solid var(--color-navy);
  border-radius: var(--radius-pill);
  font-family: var(--font-display);
  font-size: 1.05rem;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  transition: background-color var(--transition-base), color var(--transition-base), transform var(--transition-base), box-shadow var(--transition-base);
}

.hotel-card__map-btn:hover {
  background-color: var(--color-navy);
  color: var(--color-white);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(24, 62, 114, 0.2);
}

.hotel-card__map-btn-icon {
  width: 13px;
  height: 17px;
  flex-shrink: 0;
  margin-top: -2px;
  transition: filter var(--transition-base);
}

.hotel-card__map-btn:hover .hotel-card__map-btn-icon {
  filter: brightness(0) invert(1);
}

/* Caixa de Nota de Rodapé / Disclaimer */
.hospedagem__disclaimer {
  margin-top: 1rem;
}

.hospedagem__disclaimer-box {
  background-color: rgba(255, 255, 255, 0.75);
  border-left: 4px solid var(--color-red);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  padding: 1.15rem 1.5rem;
  text-align: left;
}

.hospedagem__disclaimer-box p {
  font-style: italic;
  font-size: 0.88rem;
  color: #555;
  line-height: 1.5;
  margin: 0;
}

.hospedagem__disclaimer-box strong {
  font-style: normal;
  color: var(--color-navy);
}

@media (max-width: 991px) {
  .hospedagem__bg {
    opacity: 0.5;
  }
}

/* ---------------------------------------------------------------------
   11. CONTATO / RODAPÉ
--------------------------------------------------------------------- */
.contato {
  background-color: var(--color-offwhite);
}

.contato__container {
  padding-top: clamp(3rem, 2rem + 4vw, 5rem);
  padding-bottom: clamp(3rem, 2rem + 4vw, 5rem);
  text-align: center;
}

.contato .section-title {
  margin-bottom: 1.5rem;
}

.contato__titulo {
  font-weight: 700;
  font-size: clamp(1.3rem, 1.15rem + 0.6vw, 1.6rem);
  margin-bottom: 1rem;
}

.contato__lista {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.contato__lista li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: clamp(1rem, 0.95rem + 0.25vw, 1.2rem);
}

.contato__lista a:hover,
.contato__lista a:focus-visible {
  color: var(--color-red);
}

.contato__icone {
  width: 22px;
  height: 22px;
  object-fit: contain;
  flex-shrink: 0;
}

.contato__icone--email {
  width: 24px;
  height: 17px;
}

.patrocinio {
  padding-block: clamp(2.5rem, 2rem + 2vw, 4rem);
  background-color: var(--color-white);
}

.patrocinio__label {
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.35em;
  font-size: 0.78rem;
  color: #575b5c;
  margin-bottom: 1.25rem;
}

.patrocinio__grid {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(1.5rem, 1rem + 2vw, 2.5rem);
}

.patrocinio__logo {
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.95;
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
    opacity 0.3s ease,
    filter 0.3s ease;
}

.patrocinio__logo:hover,
.patrocinio__logo:focus-visible {
  opacity: 1;
  transform: translateY(-4px) scale(1.05);
  filter: drop-shadow(0 6px 12px rgba(24, 62, 114, 0.15));
}

.patrocinio__logo:active {
  transform: translateY(-1px) scale(0.98);
}

.patrocinio__logo img {
  width: auto;
  max-width: 100%;
  object-fit: contain;
}

.patrocinio__logo--irb img {
  height: 76px;
}

.patrocinio__logo--fgv img {
  height: 25px;
}

.rodape-barra {
  height: clamp(18px, 1.7vw, 32px);
  background-color: var(--color-red);
}

/* ---------------------------------------------------------------------
   Responsivo — ajustes gerais para telas médias e pequenas
--------------------------------------------------------------------- */
@media (max-width: 767px) {
  .hotel-card {
    flex: 1 1 100%;
    max-width: 100%;
    padding: 1.5rem 1.25rem;
  }

  .hospedagem__panel {
    padding: 1.5rem 1.1rem;
  }
}

@media (max-width: 575px) {
  :root {
    --container-padding: 1rem;
  }

  .depoimento__autor {
    flex-direction: column;
    text-align: center;
  }

  .patrocinio__logo--irb img {
    height: 62px;
  }

  .patrocinio__logo--fgv img {
    height: 21px;
  }

  .timeline__evento {
    flex-direction: column;
    gap: 0.35rem;
  }

  .hospedagem__toggle {
    padding: 1rem 1.4rem 0.9rem;
  }
}