/**
 * É Golo — página de artigo (single.php / single-ai_news_article.php).
 *
 * Recria o design "É Golo Artigo" (+ Mobile): ticker ao vivo, H1 Archivo
 * Black itálico com ponto verde, kicker verde, byline com avatar, corpo
 * 16–17px, blockquote com barra verde, slots AdSense tracejados, rail
 * lateral #EFEEE8, caixa "A SEGUIR" escura e anchor mobile 320×50.
 *
 * Tokens: porto #00A24A · ink #0D0D0C · surface-muted #F4F3EF ·
 * subtle #EFEEE8 · accent #FFD400 · live #00E06B · card-dark #1B1B19.
 *
 * @package SuperPortistas
 */

:root {
  --eg-porto: #00a24a;
  --eg-live: #00e06b;
  --eg-ink: #0d0d0c;
  --eg-card-dark: #1b1b19;
  --eg-accent: #ffd400;
  --eg-surface: #f4f3ef;
  --eg-subtle: #efeee8;
  --eg-border: #dbd9d2;
  --eg-meta: #6b6963;
  --eg-meta-dark: #8a887f;
  --eg-faint-dark: #b5b3ac;
  --eg-text-2: #3c3a35;
  --eg-display: 'Archivo Black', 'Archivo', system-ui, sans-serif;
}

@keyframes egticker {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

@keyframes egpulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.25; }
}

/* ------------------------------------------------------------------ */
/* Ticker ao vivo                                                      */
/* ------------------------------------------------------------------ */

.eg-ticker {
  display: flex;
  align-items: center;
  height: 38px;
  overflow: hidden;
  background: var(--eg-ink);
  color: #fff;
}

.eg-ticker__badge {
  flex: none;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 8px;
  height: 100%;
  padding: 0 14px;
  background: var(--eg-porto);
  color: #fff;
  font-family: var(--eg-display);
  font-style: italic;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

/* Autossuficiente: não depende do utilitário .sp-live-dot compilado. */
.eg-ticker .sp-live-dot {
  flex: none;
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
  animation: egpulse 1.2s infinite;
}

.eg-ticker__viewport {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.eg-ticker__track {
  display: flex;
  width: max-content;
  animation: egticker 24s linear infinite;
}

.eg-ticker:hover .eg-ticker__track,
.eg-ticker:focus-within .eg-ticker__track {
  animation-play-state: paused;
}

.eg-ticker__group {
  display: flex;
  gap: 44px;
  padding-left: 44px;
  white-space: nowrap;
}

.eg-ticker__item {
  display: inline-flex;
  align-items: baseline;
  gap: 7px;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.eg-ticker__item:hover .eg-ticker__score {
  text-decoration: underline;
}

.eg-ticker__minute {
  color: var(--eg-faint-dark);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.eg-ticker__item--live,
.eg-ticker__item--live .eg-ticker__minute {
  color: var(--eg-live);
}

.eg-ticker__item--accent,
.eg-ticker__item--accent .eg-ticker__minute {
  color: var(--eg-accent);
}

@media (prefers-reduced-motion: reduce) {
  .eg-ticker__track {
    animation: none;
  }

  .eg-ticker__viewport {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Sem animação a 2.ª cópia é redundante. */
  .eg-ticker__group[aria-hidden='true'] {
    display: none;
  }

  .sp-live-dot {
    animation: none;
  }
}

@media (max-width: 767px) {
  .eg-ticker {
    height: 34px;
  }

  .eg-ticker__group {
    gap: 36px;
    padding-left: 36px;
  }

  .eg-ticker__item {
    font-size: 12px;
  }
}

/* ------------------------------------------------------------------ */
/* Layout: main + rail                                                 */
/* ------------------------------------------------------------------ */

.eg-artigo {
  background: var(--eg-surface);
}

@media (min-width: 1024px) {
  .eg-artigo .eg-artigo__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 0;
    align-items: stretch;
  }

  .eg-artigo .eg-artigo__main {
    width: auto;
    padding-right: 40px;
    border-right: 1px solid var(--eg-border);
  }
}

/* ------------------------------------------------------------------ */
/* Cabeçalho do artigo                                                 */
/* ------------------------------------------------------------------ */

.eg-art-header {
  margin-bottom: 28px;
}

.eg-art-kicker {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
  font-size: 13px;
  font-weight: 700;
}

.eg-art-kicker__link {
  color: var(--eg-porto);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  text-decoration: none;
}

.eg-art-kicker__link:hover {
  color: var(--eg-ink);
}

.eg-art-kicker__sep {
  color: var(--eg-faint-dark);
}

.eg-art-kicker__context {
  color: var(--eg-meta);
}

.eg-artigo h1.eg-art-title {
  margin: 0 0 16px;
  font-family: var(--eg-display);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.875rem, 1rem + 3vw, 3.25rem);
  line-height: 0.98;
  letter-spacing: -0.04em;
  text-wrap: pretty;
  color: var(--eg-ink);
}

.eg-art-title__dot {
  color: var(--eg-porto);
}

.eg-art-lead {
  max-width: 62ch;
  margin: 0 0 24px;
  color: var(--eg-text-2);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.5;
}

/* Byline */
.eg-art-byline {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 0;
  border-top: 1px solid var(--eg-border);
  border-bottom: 1px solid var(--eg-border);
}

.eg-art-byline__avatar {
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--eg-subtle);
}

.eg-art-byline__avatar img,
.eg-art-byline__avatar-img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.eg-art-byline__who {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.eg-art-byline__author {
  color: var(--eg-ink);
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
}

.eg-art-byline__author:hover {
  color: var(--eg-porto);
}

.eg-art-byline__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  color: var(--eg-meta);
  font-size: 12px;
  font-weight: 600;
}

.eg-art-byline__comments {
  color: inherit;
  text-decoration: none;
}

.eg-art-byline__comments:hover {
  color: var(--eg-porto);
}

.eg-art-byline__actions {
  margin-left: auto;
  display: flex;
  gap: 8px;
}

.eg-art-byline__share {
  padding: 8px 16px;
  border: 1.5px solid var(--eg-ink);
  border-radius: 999px;
  background: transparent;
  color: var(--eg-ink);
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.eg-art-byline__share:hover,
.eg-art-byline__share:focus-visible {
  background: var(--eg-ink);
  color: #fff;
}

.eg-art-statline {
  margin-top: 8px;
  color: var(--eg-meta);
  font-size: 12px;
  font-weight: 600;
}

/* ------------------------------------------------------------------ */
/* Imagem destacada                                                    */
/* ------------------------------------------------------------------ */

.eg-art-hero {
  margin: 0 0 28px;
}

.eg-art-hero img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 460px;
  object-fit: cover;
  border-radius: 0;
}

.eg-art-hero__caption {
  margin-top: 8px;
  color: var(--eg-meta);
  font-size: 13px;
  font-weight: 600;
}

/* Legenda "Ilustração" — transparência de que a imagem não é uma foto real. */
.eg-art-hero--illus {
  position: relative;
}

.eg-art-hero__illus {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(13, 13, 12, 0.72);
  color: var(--eg-faint-dark);
  font-family: var(--eg-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1;
  backdrop-filter: blur(4px);
}

.eg-art-hero__illus::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--eg-porto);
}

/* ------------------------------------------------------------------ */
/* Corpo do artigo                                                     */
/* ------------------------------------------------------------------ */

.eg-artigo .eg-art-body {
  max-width: 68ch;
  color: var(--eg-ink);
}

.eg-artigo .eg-art-body p {
  font-size: 17px;
  line-height: 1.7;
}

.eg-artigo .eg-art-body h2,
.eg-artigo .eg-art-body h3 {
  font-family: var(--eg-display);
  font-style: italic;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

.eg-artigo .eg-art-body blockquote {
  margin: 8px 0;
  padding: 8px 0 8px 24px;
  border-left: 5px solid var(--eg-porto);
  font-family: var(--eg-display);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.25rem, 1rem + 1.2vw, 1.75rem);
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--eg-ink);
  quotes: none;
}

.eg-artigo .eg-art-body blockquote p {
  font: inherit;
  margin: 0;
  color: inherit;
}

.eg-artigo .eg-art-body blockquote p::before,
.eg-artigo .eg-art-body blockquote p::after {
  content: none;
}

.eg-artigo .eg-art-body a {
  color: var(--eg-porto);
}

.eg-artigo .eg-art-body img {
  border-radius: 0;
}

@media (max-width: 767px) {
  .eg-artigo .eg-art-body p {
    font-size: 16px;
    line-height: 1.65;
  }
}

/* ------------------------------------------------------------------ */
/* Slots AdSense (caixas tracejadas com label "Publicidade")           */
/* ------------------------------------------------------------------ */

.eg-ad-slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  border: 1px dashed var(--eg-faint-dark);
  background: var(--eg-subtle);
}

.eg-ad-slot__label {
  color: var(--eg-meta-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.eg-ad-slot__format {
  color: var(--eg-faint-dark);
  font-size: 12px;
  font-weight: 600;
}

.eg-ad-slot__unit {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
}

/* In-article: após o 2.º parágrafo (336×280 / fluido) */
.eg-ad-slot--inarticle {
  min-height: 280px;
  margin: 20px 0;
}

/* MPU no topo do rail */
.eg-ad-slot--mpu {
  min-height: 250px;
  background: var(--eg-surface);
}

/* Anchor 320×50 (o posicionamento fixo vem do contentor .eg-anchor-ad) */
.eg-ad-slot--anchor {
  flex-direction: row;
  gap: 10px;
  width: 100%;
  min-height: 50px;
}

/* ------------------------------------------------------------------ */
/* Tags                                                                */
/* ------------------------------------------------------------------ */

.eg-art-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 32px 0;
}

.eg-art-tags__chip {
  padding: 7px 14px;
  border: 1.5px solid var(--eg-border);
  border-radius: 999px;
  color: var(--eg-ink);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  transition: color 0.15s ease, border-color 0.15s ease;
}

.eg-art-tags__chip:hover,
.eg-art-tags__chip:focus-visible {
  border-color: var(--eg-porto);
  color: var(--eg-porto);
}

/* ------------------------------------------------------------------ */
/* Títulos de secção (RELACIONADAS. / A BANCADA DIZ.)                  */
/* ------------------------------------------------------------------ */

.eg-art-sec {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin-bottom: 20px;
}

.eg-artigo .eg-art-sec__title,
.eg-art-sec__title {
  margin: 0;
  font-family: var(--eg-display);
  font-style: italic;
  font-weight: 400;
  font-size: 20px;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  color: var(--eg-ink);
}

.eg-art-sec__dot {
  color: var(--eg-porto);
}

.eg-art-sec__count {
  color: var(--eg-meta);
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

.eg-art-sec__rule {
  flex: 1;
  align-self: center;
  height: 4px;
  background: var(--eg-porto);
}

/* ------------------------------------------------------------------ */
/* Relacionadas (grelha no fim do artigo)                              */
/* ------------------------------------------------------------------ */

.eg-art-related__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.eg-art-related__link {
  display: flex;
  flex-direction: column;
  gap: 10px;
  color: var(--eg-ink);
  text-decoration: none;
}

.eg-art-related__media {
  display: block;
  height: 140px;
  overflow: hidden;
  background: var(--eg-subtle);
}

.eg-art-related__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.eg-art-related__kicker {
  color: var(--eg-porto);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.eg-art-related__title {
  font-family: var(--eg-display);
  font-style: italic;
  font-weight: 400;
  font-size: 17px;
  line-height: 1.12;
  letter-spacing: -0.01em;
}

.eg-art-related__link:hover .eg-art-related__title {
  color: var(--eg-porto);
}

.eg-art-related__meta {
  color: var(--eg-meta);
  font-size: 12px;
  font-weight: 600;
}

@media (max-width: 767px) {
  .eg-art-related__grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .eg-art-related__link {
    display: grid;
    grid-template-columns: 110px 1fr;
    align-items: center;
    gap: 4px 12px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--eg-border);
  }

  .eg-art-related__media {
    grid-row: 1 / 4;
    height: 76px;
    border-radius: 4px;
  }

  .eg-art-related__title {
    font-size: 15px;
  }
}

/* ------------------------------------------------------------------ */
/* Caixa do autor                                                      */
/* ------------------------------------------------------------------ */

.eg-art-author {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 24px;
  background: var(--eg-subtle);
}

.eg-art-author__avatar {
  flex: none;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--eg-ink);
}

.eg-art-author__avatar img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.eg-art-author__avatar-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: #fff;
  font-family: var(--eg-display);
  font-style: italic;
  font-size: 24px;
}

.eg-art-author__info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.eg-art-author__name {
  font-family: var(--eg-display);
  font-style: italic;
  font-size: 17px;
  color: var(--eg-ink);
}

.eg-art-author__bio {
  margin: 0;
  color: var(--eg-meta);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
}

.eg-art-author__links {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.eg-art-author__more {
  color: var(--eg-porto);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.eg-art-author__more:hover {
  color: var(--eg-ink);
}

.eg-art-author__social {
  color: var(--eg-meta);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.eg-art-author__social:hover {
  color: var(--eg-porto);
}

/* ------------------------------------------------------------------ */
/* Caixa "A SEGUIR."                                                   */
/* ------------------------------------------------------------------ */

.eg-art-next {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 24px;
  background: var(--eg-card-dark);
  color: #fff;
}

.eg-art-next__kicker {
  font-family: var(--eg-display);
  font-style: italic;
  font-size: 13px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--eg-live);
}

.eg-art-next__dot {
  color: #fff;
}

.eg-art-next__body {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
}

.eg-art-next__info {
  display: flex;
  flex: 1;
  min-width: 200px;
  flex-direction: column;
  gap: 4px;
}

.eg-art-next__title {
  font-family: var(--eg-display);
  font-style: italic;
  font-size: 24px;
  line-height: 1.05;
  letter-spacing: -0.02em;
}

.eg-art-next__meta {
  color: var(--eg-faint-dark);
  font-size: 12px;
  font-weight: 600;
}

.eg-art-next__cta {
  flex: none;
  padding: 12px 18px;
  background: var(--eg-porto);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  transition: background 0.15s ease, color 0.15s ease;
}

.eg-art-next__cta:hover,
.eg-art-next__cta:focus-visible {
  background: var(--eg-accent);
  color: var(--eg-ink);
}

/* ------------------------------------------------------------------ */
/* Rail lateral                                                        */
/* ------------------------------------------------------------------ */

.eg-art-rail {
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 24px 20px;
  background: var(--eg-subtle);
}

@media (min-width: 1024px) {
  .eg-art-rail {
    width: auto;
    padding: 40px 24px;
  }
}

.eg-artigo .eg-art-rail__title {
  margin: 0 0 12px;
  font-family: var(--eg-display);
  font-style: italic;
  font-weight: 400;
  font-size: 16px;
  text-transform: uppercase;
  color: var(--eg-ink);
}

/* Relacionadas (lista compacta) */
.eg-art-rail__related {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.eg-art-rail__related-link {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 10px;
  align-items: center;
  color: var(--eg-ink);
  text-decoration: none;
}

.eg-art-rail__related-thumb {
  display: block;
  height: 52px;
  overflow: hidden;
  border-radius: 4px;
  background: var(--eg-surface);
}

.eg-art-rail__related-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.eg-art-rail__related-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.eg-art-rail__related-kicker {
  color: var(--eg-porto);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.eg-art-rail__related-title {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
}

.eg-art-rail__related-link:hover .eg-art-rail__related-title {
  color: var(--eg-porto);
}

/* Mais lidas */
.eg-art-rail__mostread {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.eg-art-rail__mostread-item {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 8px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.25;
}

.eg-art-rail__mostread-rank {
  font-family: var(--eg-display);
  font-style: italic;
  color: var(--eg-porto);
}

.eg-art-rail__mostread-item a {
  color: var(--eg-ink);
  text-decoration: none;
}

.eg-art-rail__mostread-item a:hover {
  color: var(--eg-porto);
}

/* Newsletter */
.eg-art-rail__newsletter {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 20px;
  background: var(--eg-porto);
  color: #fff;
}

.eg-artigo .eg-art-rail__newsletter-title {
  margin: 0;
  font-family: var(--eg-display);
  font-style: italic;
  font-weight: 400;
  font-size: 16px;
  text-transform: uppercase;
  color: #fff;
}

.eg-art-rail__newsletter-dot {
  color: var(--eg-ink);
}

.eg-art-rail__newsletter-copy {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
}

.eg-art-rail__newsletter-cta {
  align-self: flex-start;
  padding: 11px 16px;
  background: var(--eg-ink);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  transition: background 0.15s ease, color 0.15s ease;
}

.eg-art-rail__newsletter-cta:hover,
.eg-art-rail__newsletter-cta:focus-visible {
  background: var(--eg-accent);
  color: var(--eg-ink);
}

.eg-art-rail__widgets {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* ------------------------------------------------------------------ */
/* Cartões partilha/comentários — aplanar dentro do artigo             */
/* ------------------------------------------------------------------ */

.eg-artigo .sp-social-share-card,
.eg-artigo .sp-comments-card {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  padding-left: 0;
  padding-right: 0;
}

/* ------------------------------------------------------------------ */
/* Anchor mobile 320×50                                                */
/* ------------------------------------------------------------------ */

.eg-anchor-ad {
  display: none;
}

@media (max-width: 767px) {
  .eg-anchor-ad {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 40;
    display: flex;
    align-items: stretch;
    background: var(--eg-surface);
    border-top: 1px solid var(--eg-border);
    padding-bottom: env(safe-area-inset-bottom, 0);
  }

  .eg-anchor-ad .eg-ad-slot--anchor {
    flex: 1;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
  }

  .eg-anchor-ad__close {
    order: 2;
    flex: none;
    width: 44px;
    min-height: 50px;
    border: 0;
    border-top: 1px dashed var(--eg-faint-dark);
    background: var(--eg-subtle);
    color: var(--eg-meta);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
  }

  body.eg-has-anchor-ad .site-main {
    padding-bottom: 66px;
  }
}