/* Responsive safeguards for published articles. */
html,
body,
#root {
  max-width: 100%;
  overflow-x: clip;
}

.main-layout[style*="max-width"] {
  width: 100%;
}

.main-layout[style*="max-width"] > main {
  min-width: 0;
  width: 100%;
}

.main-layout[style*="max-width"] > main > h1.feed-item__title {
  max-width: 100%;
  font-size: 38px !important;
  line-height: 1.12 !important;
  overflow-wrap: anywhere;
}

.main-layout[style*="max-width"] .artigo-lead {
  max-width: 100%;
  font-size: 18px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.main-layout[style*="max-width"] > main > .feed-item__img {
  width: 100%;
  max-width: 100%;
  height: clamp(200px, 52vw, 360px) !important;
}

.main-layout[style*="max-width"] iframe,
.main-layout[style*="max-width"] video,
.main-layout[style*="max-width"] img,
.main-layout[style*="max-width"] svg,
.main-layout[style*="max-width"] canvas {
  max-width: 100% !important;
}

.main-layout[style*="max-width"] > main > div[style*="font-size"] {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.main-layout[style*="max-width"] > main > div[style*="font-size"] table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
}

.main-layout[style*="max-width"] > main > div[style*="font-size"] pre {
  max-width: 100%;
  overflow-x: auto;
  white-space: pre-wrap;
}

/* Production home fixes. This file loads after the bundled stylesheet. */

/* AGORA: leitura mais calma na faixa superior. */
.ticker__inner {
  animation-duration: 52s !important;
}

/* A antiga faixa URGENTE fora da capa deixa de ocupar uma linha própria. */
.urgente-strip {
  display: none !important;
}

/* Capa editorial fixa + carrossel + Mais destaques rolável. */
.hero__grid {
  position: relative;
}

.hero__main {
  transition: opacity .18s ease;
}

.hero__main.hemi-slide-changing {
  opacity: .58;
}

.hero__side {
  overflow: hidden !important;
}

.hero__side-list {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.hero__side-title {
  flex: 0 0 auto;
  background: var(--blue-dark);
  position: relative;
  z-index: 4;
}

.hemi-has-urgent .hero__main-content {
  bottom: 46px !important;
}

.hemi-carousel-controls {
  position: absolute;
  z-index: 9;
  right: 398px;
  bottom: 58px;
  display: flex;
  align-items: center;
  gap: 7px;
}

.hemi-carousel-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.55);
  box-shadow: 0 0 0 1px rgba(0,0,0,.16);
  cursor: pointer;
  transition: width .2s ease, background .2s ease;
}

.hemi-carousel-dot.is-active {
  width: 24px;
  background: var(--yellow);
}

.hemi-urgent-overlay {
  position: absolute;
  z-index: 8;
  left: 0;
  right: 380px;
  bottom: 0;
  height: 46px;
  display: flex;
  align-items: stretch;
  overflow: hidden;
  background: rgba(164, 18, 22, .96);
  border-top: 1px solid rgba(255,255,255,.12);
}

.hemi-urgent-badge {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  padding: 0 18px;
  background: #8f0e18;
  color: var(--yellow);
  font-family: var(--font-condensed);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.hemi-urgent-viewport {
  min-width: 0;
  flex: 1;
  overflow: hidden;
  display: flex;
  align-items: center;
}

.hemi-urgent-track {
  width: max-content;
  display: flex;
  align-items: center;
  white-space: nowrap;
  animation: hemi-urgent-scroll 24s linear infinite;
  will-change: transform;
}

.hemi-urgent-item {
  display: inline-flex;
  align-items: center;
  color: #fff;
  font-family: var(--font-condensed);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: 0 24px;
}

.hemi-urgent-item::before {
  content: "•";
  color: var(--yellow);
  margin-right: 12px;
  font-size: 16px;
}

.hemi-urgent-item:hover {
  color: var(--yellow);
}

@keyframes hemi-urgent-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media (min-width: 961px) {
  .hero__grid {
    height: 390px !important;
    min-height: 390px !important;
  }

  .hero__main,
  .hero__side {
    height: 390px !important;
    min-height: 0 !important;
  }
}

@media (max-width: 960px) {
  .hero__grid {
    height: auto !important;
    min-height: 0 !important;
  }

  .hero__main {
    min-height: 300px !important;
  }

  .hemi-urgent-overlay {
    left: 0;
    right: 0;
    top: 254px;
    bottom: auto;
    height: 46px;
  }

  .hemi-carousel-controls {
    right: 16px;
    top: 226px;
    bottom: auto;
  }
}

@media (max-width: 640px) {
  .main-layout[style*="max-width"] {
    padding: 28px 16px 40px;
  }

  .main-layout[style*="max-width"] > main > h1.feed-item__title {
    font-size: clamp(28px, 8.5vw, 32px) !important;
    line-height: 1.08 !important;
    margin-top: 14px !important;
    margin-bottom: 12px !important;
  }

  .main-layout[style*="max-width"] .artigo-lead {
    font-size: 17px;
    line-height: 1.55;
    margin-bottom: 18px;
    padding-bottom: 18px;
  }

  .main-layout[style*="max-width"] > main > .feed-item__img {
    height: clamp(190px, 56vw, 260px) !important;
  }

  .main-layout[style*="max-width"] > main > div[style*="font-size"] {
    font-size: 16px !important;
    line-height: 1.75 !important;
  }

  .hero__main {
    min-height: 250px !important;
  }

  .ticker__inner {
    animation-duration: 46s !important;
  }

  .hemi-has-urgent .hero__main-content {
    bottom: 42px !important;
    padding: 22px 18px !important;
  }

  .hemi-urgent-overlay {
    top: 208px;
    height: 42px;
  }

  .hemi-urgent-badge {
    padding: 0 12px;
    font-size: 11px;
  }

  .hemi-urgent-item {
    font-size: 12px;
    padding: 0 18px;
  }

  .hemi-urgent-track {
    animation-duration: 20s;
  }

  .hemi-carousel-controls {
    right: 12px;
    top: 180px;
  }
}

/* Ajuste final aprovado: capa flutuante em fundo branco, maior e mais responsiva. */
.hero {
  background: #fff !important;
  padding: 22px 0 26px !important;
  overflow: visible !important;
}

.hero::before {
  display: none !important;
}

.hero__grid {
  width: calc(100% - 48px);
  max-width: 1240px;
  margin: 0 auto;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 10px 32px rgba(13, 46, 110, .12);
  background: var(--blue-dark);
}

.ticker {
  font-size: 13px !important;
}

.ticker__inner {
  animation-duration: 36s !important;
}

@media (min-width: 961px) {
  .hero__grid {
    height: 430px !important;
    min-height: 430px !important;
  }

  .hero__main,
  .hero__side {
    height: 430px !important;
  }
}

@media (max-width: 960px) {
  .hero {
    padding: 16px 0 20px !important;
  }

  .hero__grid {
    width: calc(100% - 32px);
  }

  .hero__main {
    min-height: 340px !important;
  }

  .hemi-urgent-overlay {
    top: 294px;
  }

  .hemi-carousel-controls {
    top: 266px;
  }
}

@media (max-width: 640px) {
  .hero {
    padding: 12px 0 18px !important;
  }

  .hero__grid {
    width: calc(100% - 24px);
    border-radius: 5px;
  }

  .hero__main {
    min-height: 310px !important;
  }

  .ticker__inner {
    animation-duration: 34s !important;
  }

  .hemi-urgent-overlay {
    top: 268px;
  }

  .hemi-carousel-controls {
    top: 240px;
  }
}

/* Desktop-only hero guard */
@media (min-width: 961px) {
  .hero__grid {
    grid-template-columns: minmax(0, 1fr) 360px !important;
  }

  .hero__main {
    min-width: 0 !important;
  }

  .hero__side {
    width: 360px !important;
    min-width: 360px !important;
    background: var(--white) !important;
    border-left: 1px solid var(--gray-100) !important;
  }

  .hero__side-title {
    background: var(--white) !important;
    color: var(--blue-dark) !important;
    border-bottom-color: var(--gray-100) !important;
  }

  .hero__side-list,
  .hero__side-item {
    width: 100% !important;
  }

  .hero__side-item {
    background: var(--white) !important;
    border-bottom-color: var(--gray-100) !important;
  }

  .hero__side-text {
    min-width: 0 !important;
  }

  .hero__side-text h3 {
    color: var(--black) !important;
  }

  .hero__side-text time {
    color: var(--gray-400) !important;
  }
}
