/**
 * scroll_fixo — mobile: card preto colado à base da área visível.
 * Depende de --real-height e --browser-bar-h (JS).
 */

.carta {
  position: relative;
}

.reportagens-scroll-pin-wrapper {
  height: calc((9 - 1) * 120vh + 100dvh) !important;
}

@media (max-width: 767px) {
  .reportagens#reportagens {
    height: var(--real-height, 100dvh) !important;
    max-height: var(--real-height, 100dvh) !important;
    min-height: 0 !important;
  }

  .reportagem-image-inner {
    height: 100%;
    min-height: unset;
  }

  .reportagens-right {
    padding-bottom: calc(
      30px + env(safe-area-inset-bottom, 0px) + var(--browser-bar-h, 0px)
    ) !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-top: 0;
    box-sizing: border-box;
  }
}

@media (max-width: 480px) {
  .reportagens-right {
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-bottom: calc(
      30px + env(safe-area-inset-bottom, 0px) + var(--browser-bar-h, 0px)
    ) !important;
  }
}

@supports (height: 1lvh) {
  @media (max-width: 767px) {
    .reportagens#reportagens {
      min-height: unset !important;
    }
  }
}

.menu-image-preview {
  background-image: url('../img/bg_carta.jpg');
}

.destaques {
  background-image: none !important;
}

.destaques-bg-layer {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.destaques .carousel-container {
  position: relative;
  z-index: 1;
}

@media (max-width: 767px) {
  .reportagens-left,
  .reportagens-images-stack {
    height: 100%;
  }

  .reportagem-image-inner {
    height: 100%;
    min-height: 0;
    background-attachment: scroll;
    background-size: cover;
    background-position: center;
  }

  .reportagens-right {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    align-items: stretch !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    padding-top: 0 !important;
    padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    pointer-events: none;
    z-index: 3;
  }

  .reportagens-right .reportagens-card {
    pointer-events: auto;
    width: 100%;
    max-width: 100%;
    height: 360px !important;
    min-height: 360px !important;
    max-height: 360px;
    box-sizing: border-box;
  }
}

@media (max-width: 480px) {
  .reportagens-right {
    padding-left: 12px !important;
    padding-right: 12px !important;
    padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

@media (min-width: 768px) {
  .reportagens-right {
    width: 45% !important;
    max-width: none !important;
    min-width: 0;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .reportagem-image-inner {
    background-position: 20%;
  }
}

.reportagens-card {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto;
  grid-template-columns: 1fr;
  justify-content: initial;
  align-content: stretch;
}

.reportagem-top-row {
  margin-bottom: 0;
}

.reportagem-content {
  flex: unset !important;
  margin-top: 0 !important;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.reportagem-footer {
  margin-top: 0 !important;
  flex-shrink: 0;
}

@media (max-width: 767px) {
  .reportagem-content {
    margin-bottom: 20px;
  }
}

/* Número da reportagem: branco sólido em todos os breakpoints */
.reportagem-numero {
  opacity: 1;
  color: rgba(255, 255, 255, 1);
}

@media (min-width: 768px) {
  .reportagem-titulo {
    font-size: 38px;
  }

  .reportagem-texto {
    font-size: 18px;
    margin: 0;
  }
}

@media (max-height: 700px) {
  .reportagens-card {
    min-height: 100%;
  }
}

.header-text {
  text-shadow: none;
}

.header-hamburger svg {
  filter: none;
}

/* Expediente: nome em negrito, cargo abaixo em regular */
.col-expediente__grupo {
  margin-bottom: 28px;
}

.col-expediente__grupo:last-child {
  margin-bottom: 0;
}

.col-expediente__item {
  font-family: "Space Grotesk", sans-serif;
  font-size: inherit;
  font-weight: 400;
  color: #000;
  margin: 0 0 0.5em;
  line-height: 1.6;
}

.col-expediente__item:last-child {
  margin-bottom: 0;
}

.col-expediente__item strong {
  font-weight: 700;
}

.col-expediente__cargo {
  font-weight: 400;
}

.col-expediente__item--gap-duplo {
  margin-bottom: 1.4em;
}

@media (min-width: 768px) {
  .col-expediente__grupo {
    margin-bottom: 36px;
  }

  .col-expediente__item--gap-duplo {
    margin-bottom: 1.7em;
  }
}

@media (max-width: 767px) {
  .carta,
  .destaques {
    padding-left: 20px;
    padding-right: 20px;
  }

  .carta-cards-row {
    gap: 40px;
  }

  .reportagens-right {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .destaques .carousel-track-container {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    contain: paint;
    clip-path: inset(0 0 0 0 round 24px);
  }

  .destaques__right {
    overflow: hidden !important;
  }

  .destaques .carousel-track {
    gap: 0 !important;
    width: 100% !important;
  }

  .destaques .carousel-slide--destaques {
    flex: 0 0 100%;
    min-width: 100%;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    border-radius: 24px;
  }

  .destaques .card-destaque {
    width: 100%;
    min-width: 100%;
    max-width: 100%;
  }
}

/* Restaura o efeito de cobrir/descobrir entre seções no desktop/tablet. */
@media (min-width: 768px) {
  .intro {
    position: sticky;
    top: 0;
    z-index: 10;
  }

  .carta {
    position: sticky;
    top: 0;
    z-index: 20;
  }

  .reportagens-scroll-pin-wrapper {
    position: relative;
    z-index: 30;
  }

  .reportagens {
    z-index: 30;
  }

  .destaques {
    position: sticky;
    top: 0;
    z-index: 40;
  }

  .expediente {
    position: sticky;
    top: 0;
    z-index: 50;
  }
}