/* ==========================================================================
   estrato. — Tema editorial (layout USA Today)
   ========================================================================== */

:root {
  /* Marca */
  --brand-red: #CC0000;
  --brand-red-hover: #A00000;
  --charcoal: #303030;
  --soft-black: #303030;
  --bg-white: #FFFFFF;
  --bg-soft: #F5F5F5;
  --divider: #E5E5E5;
  --text-muted: #6b6b6b;

  /* Accent por categoria */
  --seg-politica: #CC0000;
  --seg-economia: #3CC37D;
  --seg-brasil: #CC0000;
  --seg-mundo: #0A32A0;
  --seg-oleogas: #F58220;
  --seg-agencias: #626262;
  --seg-sustentabilidade: #2E8B57;
  --seg-tecnologia: #FA9632;
  --seg-carreira: #0A32A0;
  --seg-lifestyle: #AA50E6;
  --seg-esportes: #F03C4B;

  /* Tipografia — respeita fontes personalizadas do Ghost quando definidas */
  --serif: var(--gh-font-heading, 'Playfair Display', Georgia, 'Times New Roman', serif);
  --sans: var(--gh-font-body, 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif);

  --maxw: 1200px;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }

/* ==========================================================================
   Overrides defensivos contra code injection legado (tema ruby)
   O site tem CSS/JS injetado que escondia footer/nav e forçava estilos.
   Reafirmamos os estilos do tema estrato com !important.
   ========================================================================== */
body::before { display: none !important; content: none !important; height: 0 !important; }
/* Esconde elementos injetados via JS legado (topbar/footer/menu/wordmark antigos) */
.estrato-topbar,
.estrato-footer,
.estrato-mobile-toggle,
.estrato-mobile-menu,
.estrato-mobile-menu-cta,
.estrato-wordmark { display: none !important; }
footer.site-footer, .site-footer { display: block !important; }
header.site-header, .site-header { padding: 0 !important; border-bottom: 1px solid var(--divider) !important; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--sans);
  color: var(--soft-black);
  background: var(--bg-white);
  line-height: 1.5;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; margin: 0; padding: 0; }
h1, h2, h3, h4 { margin: 0; line-height: 1.15; }
button { font-family: inherit; cursor: pointer; }

.site-main { max-width: var(--maxw); margin: 0 auto; padding: 0 20px 60px; }

/* ==========================================================================
   Wordmark
   ========================================================================== */
.wordmark {
  font-family: var(--serif);
  font-weight: 700;
  font-size: 42px;
  color: #000;
  letter-spacing: -0.01em;
  line-height: 1;
  text-transform: lowercase;
}
.wordmark__dot { color: var(--brand-red); }

/* ==========================================================================
   Header — 3 níveis
   ========================================================================== */
.site-header { border-bottom: 1px solid var(--divider); }

/* Nível 1 — topbar */
.topbar {
  background: var(--charcoal);
  color: #cfcfcf;
  font-size: 11px;
  letter-spacing: 0.06em;
}
.topbar__inner {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 8px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-transform: uppercase;
}
.topbar a { color: #cfcfcf; }
.topbar__slogan { font-weight: 600; color: #fff; letter-spacing: 0.14em; }
.topbar__links { display: flex; gap: 18px; }
.topbar__links a:hover { color: var(--brand-red); }

/* Nível 2 — wordmark row */
.wordmark-row { background: var(--bg-white); }
.wordmark-row__inner {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 16px 20px;
  display: grid;
  grid-template-columns: 40px 1fr 40px;
  align-items: center;
  min-height: 80px;
}
.wordmark-row .wordmark { grid-column: 2; justify-self: center; }
.nav-toggle {
  grid-column: 1;
  display: none;
  flex-direction: column;
  gap: 4px;
  background: none;
  border: none;
  padding: 6px;
}
.nav-toggle span { width: 22px; height: 2px; background: #000; display: block; }
.search-toggle {
  grid-column: 3;
  justify-self: end;
  background: none;
  border: none;
  color: #000;
  display: flex;
  align-items: center;
  padding: 6px;
}
.search-toggle:hover { color: var(--brand-red); }

/* Nível 3 — mainnav */
.mainnav {
  background: var(--charcoal);
  position: sticky;
  top: 0;
  z-index: 50;
}
.mainnav__inner {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.mainnav__list {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  margin: 0;
  padding: 0;
}
.mainnav__list > .mainnav__item { position: relative; }
.mainnav__list > .mainnav__item > a,
.mainnav .mainnav__list > .mainnav__item > a,
nav.mainnav .mainnav__list > .mainnav__item > a,
.mainnav__more-btn {
  display: block;
  color: #fff !important;
  background: none;
  border: none;
  font-family: var(--sans) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  padding: 15px 11px !important;
  white-space: nowrap;
  line-height: 1;
}
.mainnav__list > .mainnav__item > a:hover,
.mainnav__list > .mainnav__item > a.active,
.mainnav__more-btn:hover { color: var(--brand-red); background: rgba(255,255,255,0.04); }
.caret { font-size: 10px; }

/* Dropdown MAIS */
.mainnav__dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  background: #fff;
  min-width: 240px;
  box-shadow: 0 12px 32px rgba(0,0,0,0.18);
  border-top: 3px solid var(--brand-red);
  padding: 6px 0;
  display: none;
  z-index: 60;
}
.mainnav__more.open .mainnav__dropdown { display: block; }
.mainnav__dropdown li a {
  display: block;
  padding: 9px 18px;
  font-size: 14px;
  color: var(--soft-black);
}
.mainnav__dropdown li a:hover { background: var(--bg-soft); color: var(--brand-red); }

.mainnav__actions { display: flex; align-items: center; }
.btn-subscribe {
  background: var(--brand-red);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 8px 16px;
  border-radius: 2px;
}
.btn-subscribe:hover { background: var(--brand-red-hover); }

/* Search panel */
.search-panel { background: var(--bg-soft); border-bottom: 1px solid var(--divider); }
.search-panel__form {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 14px 20px;
  display: flex;
  gap: 10px;
}
.search-panel__form input {
  flex: 1;
  padding: 10px 14px;
  border: 1px solid var(--divider);
  font-size: 15px;
}
.search-panel__form button {
  background: var(--charcoal);
  color: #fff;
  border: none;
  padding: 0 22px;
  font-weight: 700;
}

/* ==========================================================================
   Eyebrow / tags coloridas
   ========================================================================== */
.eyebrow {
  display: inline-block;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--brand-red);
  margin-bottom: 8px;
}
.eyebrow--sm { font-size: 11px; margin-bottom: 5px; }
.eyebrow:hover { text-decoration: underline; }

/* Mapa slug -> cor. Cobre as tags "hub" e subtags via prefixo. */
[class*="seg-politica"]           { color: var(--seg-politica); }
[class*="seg-economia"]           { color: var(--seg-economia); }
[class*="seg-brasil"]             { color: var(--seg-brasil); }
[class*="seg-mundo"]              { color: var(--seg-mundo); }
[class*="seg-oleo-gas"]           { color: var(--seg-oleogas); }
[class*="seg-agencias-reguladoras"] { color: var(--seg-agencias); }
[class*="seg-sustentabilidade"]   { color: var(--seg-sustentabilidade); }
[class*="seg-tecnologia"]         { color: var(--seg-tecnologia); }
[class*="seg-carreira"]           { color: var(--seg-carreira); }
[class*="seg-lifestyle"]          { color: var(--seg-lifestyle); }
[class*="seg-esportes"]           { color: var(--seg-esportes); }

/* Réguas coloridas dos módulos */
.module__rule { display: block; width: 100%; height: 3px; background: var(--charcoal); margin-bottom: 10px; }
.rule--brand { background: var(--brand-red); }
.seg-rule-politica, .seg-rule-brasil          { background: var(--seg-politica); }
.seg-rule-economia                            { background: var(--seg-economia); }
.seg-rule-mundo                               { background: var(--seg-mundo); }
.seg-rule-oleo-gas                            { background: var(--seg-oleogas); }
.seg-rule-agencias-reguladoras                { background: var(--seg-agencias); }
.seg-rule-sustentabilidade                    { background: var(--seg-sustentabilidade); }
.seg-rule-tecnologia                          { background: var(--seg-tecnologia); }
.seg-rule-carreira                            { background: var(--seg-carreira); }
.seg-rule-lifestyle                           { background: var(--seg-lifestyle); }
.seg-rule-esportes                            { background: var(--seg-esportes); }

/* ==========================================================================
   Módulos genéricos
   ========================================================================== */
.module { margin: 40px 0; }
.module__head { margin-bottom: 18px; }
.module__title {
  font-family: var(--sans);
  font-size: 24px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  color: #111;
}
.module__title a:hover { color: var(--brand-red); }
.module__title .arrow { color: var(--brand-red); }
.module__title--sidebar {
  font-size: 18px;
  padding-bottom: 8px;
  border-bottom: 2px solid #111;
  margin-bottom: 12px;
}

/* ==========================================================================
   Cards
   ========================================================================== */
.card__media { display: block; overflow: hidden; background: var(--bg-soft); }
.card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.card__media:hover img { transform: scale(1.04); }
.card__media--16x9 { aspect-ratio: 16 / 9; }
.card__media--1x1 { aspect-ratio: 1 / 1; }
.card__media--empty {
  display: flex; align-items: center; justify-content: center;
  height: 100%; min-height: 90px;
  font-family: var(--serif); font-weight: 700; font-size: 28px;
  color: #bcbcbc; background: var(--bg-soft); text-transform: lowercase;
}
.card__media--empty.small { font-size: 20px; min-height: 70px; }
.card__media--empty .wordmark__dot { color: var(--brand-red); }

.card__title { font-family: var(--sans); font-weight: 700; font-size: 17px; line-height: 1.25; margin-top: 8px; }
.card__title a:hover { color: var(--brand-red); }
.card__title--serif { font-family: var(--serif); font-weight: 700; font-size: 34px; line-height: 1.1; }
.card__title--text { font-weight: 600; font-size: 15px; }
.card__dek { color: var(--text-muted); font-size: 14px; margin: 6px 0 8px; line-height: 1.45; }
.card__dek--sm { font-size: 13px; }
.card__meta { font-size: 11.5px; color: #999; text-transform: uppercase; letter-spacing: 0.04em; }
.card__arrow { display: inline-block; margin-top: 8px; font-size: 13px; font-weight: 700; color: var(--brand-red); }

/* Card lateral empilhado */
.card--side { padding-bottom: 18px; margin-bottom: 18px; border-bottom: 1px solid var(--divider); }
.card--side:last-child { border-bottom: none; }

/* Card horizontal (thumb 1:1) */
.card--square {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 14px;
  padding-bottom: 16px;
  margin-bottom: 16px;
  border-bottom: 1px solid var(--divider);
  align-items: start;
}
.card--square .card__title { margin-top: 0; font-size: 16px; }
.card__footer { display: flex; align-items: center; gap: 10px; margin-top: 8px; flex-wrap: wrap; }

/* ==========================================================================
   Top Table (3 colunas)
   ========================================================================== */
.toptable {
  display: grid;
  grid-template-columns: 22% 50% 25%;
  gap: 3%;
  padding-top: 28px;
}
.toptable__center .card__title--serif { margin-top: 12px; }

.teaser-list { margin-top: 18px; border-top: 2px solid #111; padding-top: 12px; }
.teaser-list li { padding: 9px 0; border-bottom: 1px solid var(--divider); font-size: 15px; font-weight: 600; }
.teaser-list li:last-child { border-bottom: none; }
.teaser-list a:hover { color: var(--brand-red); }
.teaser-list__tag {
  display: inline;
  font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em;
  margin-right: 8px;
}

.headline-list li { padding: 10px 0; border-bottom: 1px solid var(--divider); font-size: 15px; font-weight: 600; line-height: 1.3; }
.headline-list li:last-child { border-bottom: none; }
.headline-list a:hover { color: var(--brand-red); }
.headline-list__more { display: inline-block; margin-top: 12px; font-size: 13px; font-weight: 700; color: var(--brand-red); }

/* ==========================================================================
   Mais Notícias (grid 2 col)
   ========================================================================== */
.more-news__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 40px;
}

/* ==========================================================================
   Blocos por categoria
   ========================================================================== */
.section-blocks { border-top: 4px solid var(--charcoal); margin-top: 20px; }
.module-section { margin: 34px 0; padding-bottom: 20px; border-bottom: 1px solid var(--divider); }
.section__body { display: grid; grid-template-columns: 1fr 320px; gap: 32px; align-items: start; }
.section__links li {
  padding: 10px 0;
  border-bottom: 1px solid var(--divider);
  display: flex; flex-direction: column; gap: 3px;
}
.section__links li:first-child { padding-top: 0; }
.section__links a { font-size: 16px; font-weight: 600; line-height: 1.3; }
.section__links a:hover { color: var(--brand-red); }
.section__links-tag { font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; }
.section__links-meta { font-size: 11px; color: #999; text-transform: uppercase; }

.section__feature-media { display: block; aspect-ratio: 16/9; overflow: hidden; background: var(--bg-soft); }
.section__feature-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.section__feature-media:hover img { transform: scale(1.04); }
.section__feature-title { font-family: var(--serif); font-weight: 700; font-size: 20px; line-height: 1.2; margin-top: 10px; }
.section__feature-title a:hover { color: var(--brand-red); }

/* ==========================================================================
   Descubra (3 col)
   ========================================================================== */
.discover__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.card--discover .card__body { padding-top: 10px; }

/* ==========================================================================
   Feature banner
   ========================================================================== */
.module-feature-banner { margin: 44px 0; }
.feature-banner {
  display: block;
  min-height: 420px;
  background-color: var(--charcoal);
  background-size: cover;
  background-position: center;
  position: relative;
  display: flex;
  align-items: flex-end;
}
.feature-banner__content { padding: 40px; color: #fff; max-width: 760px; }
.feature-banner__eyebrow {
  display: inline-block;
  background: var(--brand-red);
  color: #fff;
  font-size: 12px; font-weight: 800; letter-spacing: 0.08em;
  padding: 4px 10px; margin-bottom: 14px; text-transform: uppercase;
}
.feature-banner__title { font-family: var(--serif); font-weight: 800; font-size: 40px; line-height: 1.08; }
.feature-banner__dek { margin-top: 12px; font-size: 17px; color: #eaeaea; max-width: 640px; }

/* ==========================================================================
   Post individual
   ========================================================================== */
.post { max-width: 1080px; margin: 0 auto; }
.post__header { padding: 34px 0 20px; }
.post__header-inner { max-width: 780px; margin: 0 auto; }
.post__eyebrow-row { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.post__timestamp { font-size: 12px; color: #999; text-transform: uppercase; letter-spacing: 0.04em; }
.post__title { font-family: var(--serif); font-weight: 800; font-size: 44px; line-height: 1.08; letter-spacing: -0.01em; }
.post__dek { font-size: 20px; color: #444; line-height: 1.45; margin-top: 16px; font-weight: 400; }
.post__byline { margin-top: 18px; font-size: 14px; color: var(--text-muted); display: flex; gap: 10px; align-items: center; }
.post__byline-author a { font-weight: 700; color: #111; }
.post__byline-author a:hover { color: var(--brand-red); }

.post__feature-image { margin: 24px 0; }
.post__feature-image img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.post__feature-image figcaption { font-size: 13px; color: #999; padding: 8px 0; }

.post__layout { display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: 48px; max-width: 1080px; margin: 0 auto; }
.post--no-image .post__layout { margin-top: 20px; }

.post__content { max-width: 680px; }
.gh-content { font-size: 18px; line-height: 1.65; color: #222; }
.gh-content p { margin: 0 0 1.3em; }
.gh-content h2 { font-family: var(--serif); font-size: 28px; font-weight: 700; margin: 1.6em 0 .5em; }
.gh-content h3 { font-size: 22px; font-weight: 700; margin: 1.4em 0 .4em; }
.gh-content a { color: var(--brand-red); text-decoration: underline; }
.gh-content img { margin: 1.5em 0; }
.gh-content blockquote {
  border-left: 4px solid var(--brand-red);
  margin: 1.5em 0; padding: 4px 0 4px 20px;
  font-family: var(--serif); font-style: italic; font-size: 22px; color: #333;
}
.gh-content ul, .gh-content ol { margin: 0 0 1.3em; padding-left: 1.4em; }
.gh-content li { margin-bottom: .4em; list-style: disc; }
.gh-content ol li { list-style: decimal; }
.gh-content figure { margin: 1.5em 0; }
.gh-content figcaption { font-size: 13px; color: #999; text-align: center; margin-top: 8px; }

.post__tags { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 8px; }
.tag-chip {
  border: 1px solid var(--divider);
  padding: 5px 12px; font-size: 12.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.03em; border-radius: 2px;
}
.tag-chip:hover { border-color: currentColor; }

.post__sidebar-block { position: sticky; top: 80px; }

.related { max-width: 1080px; margin: 50px auto 0; padding-top: 30px; border-top: 4px solid var(--charcoal); }
.related__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.related__grid .card--side { border-bottom: none; }

/* ==========================================================================
   Page / arquivos
   ========================================================================== */
.page { max-width: 720px; margin: 40px auto; }
.page__title { font-family: var(--serif); font-weight: 800; font-size: 40px; line-height: 1.1; margin-bottom: 20px; }
.page__feature-image { margin-bottom: 24px; }
.page__content { font-size: 18px; line-height: 1.65; }
.page__content p { margin: 0 0 1.3em; }

.archive-header { max-width: 900px; margin: 40px auto 30px; text-align: center; }
.archive-header .module__rule { max-width: 80px; margin: 0 auto 16px; height: 4px; }
.archive-header__title--serif { font-family: var(--serif); font-weight: 800; font-size: 46px; }
.archive-header__desc { color: var(--text-muted); font-size: 17px; margin-top: 12px; max-width: 620px; margin-left: auto; margin-right: auto; }
.archive-header__count { display: inline-block; margin-top: 12px; font-size: 12px; text-transform: uppercase; letter-spacing: 0.06em; color: #999; }
.archive-header--author { }
.archive-header__avatar { width: 88px; height: 88px; border-radius: 50%; object-fit: cover; margin: 0 auto 14px; }

.archive-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 36px 30px; }
.card--archive .card__title { font-size: 19px; }

/* Paginação */
.pagination { display: flex; align-items: center; justify-content: center; gap: 24px; margin: 50px 0 0; }
.pagination a { font-weight: 700; color: var(--brand-red); }
.page-number { color: #999; font-size: 14px; }

/* ==========================================================================
   Error
   ========================================================================== */
.error-page { max-width: 620px; margin: 90px auto; text-align: center; }
.error-page__code { font-family: var(--serif); font-weight: 800; font-size: 90px; color: var(--brand-red); line-height: 1; }
.error-page__title--serif { font-family: var(--serif); font-weight: 700; font-size: 34px; margin: 10px 0; }
.error-page__message { color: var(--text-muted); margin-bottom: 24px; }
.error-page__home { font-weight: 700; color: var(--brand-red); }

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer { background: var(--bg-soft); border-top: 4px solid var(--charcoal); margin-top: 60px; }
.site-footer__inner {
  max-width: var(--maxw); margin: 0 auto; padding: 46px 20px;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px;
}
.footer-col__title { font-size: 13px; font-weight: 800; letter-spacing: 0.06em; color: #111; margin-bottom: 14px; }
.footer-col li { margin-bottom: 9px; }
.footer-col a { font-size: 14px; color: #555; }
.footer-col a:hover { color: var(--brand-red); }
.footer-col__lead { font-size: 14px; color: #555; margin-bottom: 12px; }
.footer-newsletter { display: flex; flex-direction: column; gap: 8px; }
.footer-newsletter input { padding: 10px 12px; border: 1px solid #ccc; font-size: 14px; }
.footer-newsletter button { background: var(--brand-red); color: #fff; border: none; padding: 10px; font-weight: 700; }
.footer-newsletter button:hover { background: var(--brand-red-hover); }

.site-footer__bottom {
  border-top: 1px solid var(--divider);
  padding: 20px; text-align: center;
}
.footer-wordmark { font-family: var(--serif); font-weight: 700; font-size: 26px; color: #000; text-transform: lowercase; }
.site-footer__bottom p { font-size: 12.5px; color: #999; margin: 8px 0 0; }

/* ==========================================================================
   Responsivo
   ========================================================================== */
@media (max-width: 1000px) {
  .toptable { grid-template-columns: 1fr 1fr; gap: 30px; }
  .toptable__right { grid-column: 1 / -1; }
  .section__body { grid-template-columns: 1fr; }
  .section__feature { max-width: 480px; }
  .card__title--serif { font-size: 28px; }
}

@media (max-width: 820px) {
  .mainnav__list { display: none; }
  .nav-toggle { display: flex; }
  .mainnav.open .mainnav__list {
    display: flex; flex-direction: column; align-items: stretch;
    position: absolute; left: 0; right: 0; top: 100%;
    background: var(--charcoal); padding: 8px 0; z-index: 55;
  }
  .mainnav.open .mainnav__item > a,
  .mainnav.open .mainnav__more-btn { padding: 13px 20px; text-align: left; width: 100%; }
  .mainnav.open .mainnav__dropdown { position: static; box-shadow: none; background: #262626; border-top: none; }
  .mainnav.open .mainnav__dropdown li a { color: #ddd; }
  .mainnav { position: relative; }
  .wordmark { font-size: 34px; }
}

@media (max-width: 700px) {
  .toptable { grid-template-columns: 1fr; }
  .more-news__grid { grid-template-columns: 1fr; }
  .discover__grid { grid-template-columns: 1fr; }
  .archive-grid { grid-template-columns: 1fr; }
  .related__grid { grid-template-columns: 1fr; }
  .post__layout { grid-template-columns: 1fr; gap: 30px; }
  .post__sidebar-block { position: static; }
  .site-footer__inner { grid-template-columns: 1fr 1fr; gap: 30px; }
  .post__title { font-size: 32px; }
  .post__dek { font-size: 17px; }
  .feature-banner__title { font-size: 28px; }
  .topbar__slogan, .topbar__links { display: none; }
  .topbar__inner { justify-content: flex-start; }
}

@media (max-width: 460px) {
  .site-footer__inner { grid-template-columns: 1fr; }
  .card--square { grid-template-columns: 96px 1fr; }
}

/* ==========================================================================
   Koenig — classes do editor Ghost (obrigatórias)
   ========================================================================== */
.gh-content { position: relative; }
.gh-content > * { max-width: 680px; margin-left: auto; margin-right: auto; }

.kg-width-wide { max-width: 900px; }
.kg-width-full { max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.kg-width-full img { width: 100%; }

.gh-content .kg-card, .gh-content figure { margin-top: 1.5em; margin-bottom: 1.5em; }

/* Galeria */
.kg-gallery-container { display: flex; flex-direction: column; max-width: 900px; margin: 1.5em auto; }
.kg-gallery-row { display: flex; flex-direction: row; justify-content: center; gap: 10px; }
.kg-gallery-row:not(:first-of-type) { margin-top: 10px; }
.kg-gallery-image img { display: block; margin: 0; width: 100%; height: 100%; object-fit: cover; }
.kg-gallery-card + .kg-gallery-card, .kg-image-card + .kg-image-card { margin-top: 1.5em; }

/* Card de imagem */
.kg-image-card img { margin: 0 auto; }
.kg-image-card figcaption, .kg-embed-card figcaption { text-align: center; font-size: 13px; color: #999; margin-top: 8px; }

/* Bookmark */
.kg-bookmark-card { max-width: 680px; margin: 1.5em auto; }
.kg-bookmark-container { display: flex; border: 1px solid var(--divider); border-radius: 3px; overflow: hidden; color: inherit; text-decoration: none; }
.kg-bookmark-content { flex: 1; padding: 18px; }
.kg-bookmark-title { font-weight: 700; }
.kg-bookmark-description { color: var(--text-muted); font-size: 14px; margin-top: 6px; }
.kg-bookmark-metadata { font-size: 13px; margin-top: 10px; display: flex; align-items: center; gap: 8px; }
.kg-bookmark-thumbnail { max-width: 200px; }
.kg-bookmark-thumbnail img { width: 100%; height: 100%; object-fit: cover; }

/* Embed / callout / botão / toggle */
.kg-embed-card { display: flex; flex-direction: column; align-items: center; margin: 1.5em auto; max-width: 900px; }
.kg-embed-card iframe { max-width: 100%; }
.kg-callout-card { display: flex; padding: 18px; border-radius: 3px; margin: 1.5em auto; max-width: 680px; background: var(--bg-soft); }
.kg-callout-emoji { padding-right: 12px; }
.kg-button-card { display: flex; margin: 1.5em auto; max-width: 680px; }
.kg-button-card.kg-align-center { justify-content: center; }
.kg-btn { display: inline-block; padding: 10px 20px; border-radius: 3px; font-weight: 700; background: var(--brand-red); color: #fff; text-decoration: none; }
.kg-toggle-card { max-width: 680px; margin: 1.5em auto; border: 1px solid var(--divider); border-radius: 3px; padding: 16px; }
.kg-toggle-heading-text { font-weight: 700; }

/* Header card */
.kg-header-card { text-align: center; padding: 60px 20px; max-width: 100%; }
.kg-header-card.kg-width-full { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }

/* Product / audio / video / file cards */
.kg-product-card, .kg-audio-card, .kg-video-card, .kg-file-card { max-width: 680px; margin: 1.5em auto; }
.kg-video-card .kg-video-container video { width: 100%; }

/* Custom fonts (suporte a fontes personalizadas do Ghost) */
:is(.gh-content) :where(h1,h2,h3,h4,h5,h6):not([class]) { font-family: var(--serif); }
body:not(.has-serif-body) .gh-content p { font-family: var(--sans); }
html { font-family: var(--sans); }


/* ====================================================================== */
/* RESPONSIVE FIXES — 2026-07-20 pós-auditoria completa                    */
/* ====================================================================== */

/* FIX 1 — Nav overflow 1024-1280px: manter hamburguer até 1300px          */
@media (max-width: 1299px) {
  .mainnav__list { display: none !important; }
  .nav-toggle { display: flex !important; }
  .mainnav .btn-subscribe { display: none; }
}
/* Override: quando drawer estiver aberto (via JS toggle .open), mostrar lista */
@media (max-width: 1299px) {
  #primary-nav.open .mainnav__list,
  .mainnav.open .mainnav__list {
    display: flex !important;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #303030;
    padding: 8px 0;
    z-index: 999;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
  }
  #primary-nav.open .mainnav__list .btn-subscribe,
  .mainnav.open .mainnav__list .btn-subscribe {
    display: inline-flex !important;
    margin: 12px 16px;
    align-self: flex-start;
  }
  #primary-nav.open,
  .mainnav.open { position: relative; }
}
@media (min-width: 1300px) {
  .mainnav__list { display: flex; }
  .nav-toggle { display: none; }
  .mainnav .btn-subscribe { display: inline-flex; }
}

/* FIX 2 — Touch targets 44×44 mínimo                                     */
.nav-toggle {
  min-width: 44px;
  min-height: 44px;
  padding: 10px;
  align-items: center;
  justify-content: center;
}
.btn-subscribe {
  min-height: 44px;
  padding: 12px 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
#primary-nav a,
.mobile-drawer a,
.drawer a {
  min-height: 48px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
}

/* FIX 3 — Footer tablet 2-col (600-1023px)                               */
@media (min-width: 600px) and (max-width: 1023px) {
  .site-footer__inner {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 32px 24px;
  }
}

/* FIX 4 — Sticky: header inteiro (containing block = <body>)             */
.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: #FFFFFF;
  will-change: transform;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.mainnav {
  position: relative;
  background: #303030;
  z-index: 1;
}
/* Em mobile, sticky pode ser opcional — se atrapalhar UX, desativar aqui  */
@media (max-width: 767px) {
  .site-header { position: relative !important; }
}

/* FIX 5 — Hero maior em desktop grande                                   */
@media (min-width: 1280px) {
  .card--hero .card__title {
    font-size: 2.75rem;
    line-height: 1.1;
  }
}

/* FIX 6 — Divisor "MAIS" no drawer mobile                                */
.mobile-drawer .drawer-section-label,
#primary-nav .drawer-section-label {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.55;
  padding: 16px 16px 6px;
  color: #FFF;
  border-top: 1px solid rgba(255,255,255,0.1);
  margin-top: 8px;
}

/* FIX 7 — Prevenir overflow horizontal SEM quebrar sticky positioning     */
/* NOTA: overflow em html/body quebra position:sticky de ancestrais.        */
/* Alternativa: overflow-clip-margin ou wrapper isolado.                    */
body { max-width: 100vw; overflow-x: clip; }
html { overflow-x: clip; }
/* overflow-x:clip é a versão moderna que NÃO cria scroll container         */
/* fallback pra browsers antigos: usar min-width 0 nos filhos               */