/* ==========================================================================
   THEME / METADATA
   ========================================================================== */
/*
Theme Name: Tema 4
Theme URI: https://darpion.com/
Author: Seu Nome
Author URI: https://darpion.com/
Description: Tema personalizado do site.
Version: 1.0.0
Text Domain: tema-wire-home
*/

/* ==========================================================================
   TOKENS / PALETA
   ========================================================================== */
:root{
  --brand-primary:#034872;
  --brand-secondary:#53AABD;
  --brand-tertiary:#E6F1F6;

  --bg:#ffffff;
  --text:#10323A;
  --muted:#6b7b86;

  --hdr-max:1241px;

  /* Bordas */
  --radius:0;
  --radius-sm:0;

  /* Header (usado no desktop) */
  --hdr-h:56px;
  --hdr-radius:0;

  /* Busca (global) */
  --search-w:187px;
  --search-h:30px;
  --search-bg:#F2F4F6;
  --search-text:#111827;
  --search-ph:#8DA3AF;
  --search-ring:color-mix(in srgb, var(--brand-secondary) 35%, transparent);

  /* Hero */
  --hero-radius:var(--radius);
  --hero-min-h:600px;
  --hero-col:0.90fr;
  --right-col:1fr;

  /* Sombras */
  --shadow-md:0 8px 16px rgba(0,0,0,.08);
  --shadow-lg:0 10px 20px rgba(0,0,0,.10);

  /* Admin bar (compensação) */
  --adminbar-h:0px;
}
body.admin-bar{ --adminbar-h:32px; }
@media (max-width:782px){ body.admin-bar{ --adminbar-h:46px; } }

/* ==========================================================================
   RESET / UTILITÁRIOS
   ========================================================================== */
*,*::before,*::after{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0; background:var(--bg); color:var(--text);
  font:400 16px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul,ol{ margin:0; padding:0; list-style:none; }
.container{ width:min(100%, calc(var(--hdr-max) + 20px)); margin:0 auto; padding:0 10px; }

/* link cobre o card inteiro (sem bloquear o botão) */
.u-cover{ position:absolute; inset:0; text-indent:-9999px; pointer-events:none; }

/* ==========================================================================
   HEADER — DESKTOP APENAS
   ========================================================================== */
.header,
.site-header{
  position: sticky;
  top: 0;
  z-index: 50;
  background:#fff;
  margin:0 0 10px;
  padding:0;
  border:0;
  box-shadow:none;
}
.header > .container{
  width:min(100%, calc(var(--hdr-max) + 20px));
  margin:0 auto;
  padding:0 10px;
}
.header .header-inner{
  height: var(--hdr-h);
  display: grid;
  grid-template-columns: auto 1fr auto; /* logo | menu | busca */
  align-items: center;
  column-gap: 16px;
  background: #fff;
  border-bottom: 1px solid rgba(15,23,42,.08);
  border-radius: 0;
  box-shadow: none;
}

/* LOGO */
.logo-wrap, .site-brand{
  display:flex; align-items:center; height:var(--hdr-h);
  margin:0;
}
.custom-logo{ max-height:24px; width:auto; height:auto; }
.site-brand a{ color:#0f172a; text-decoration:none; }

/* NAVEGAÇÃO HORIZONTAL (desktop) */
.main-navigation{ display:block; }
.main-navigation .main-nav{ height:var(--hdr-h); display:flex; align-items:center; }
.main-navigation .menu{
  display:flex; align-items:center; gap:16px; flex-wrap:wrap;
  margin:0; padding:0; list-style:none;
}
.main-navigation .menu > li{ position:relative; }
.main-navigation .menu > li > a{
  display:inline-flex; align-items:center; height:var(--hdr-h);
  padding:0 10px; color:#0f172a; text-decoration:none;
  font:600 14px/1.1 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
.main-navigation .menu > li > a:hover{ text-decoration:underline; }

/* BUSCA EM LINHA (desktop) */
.header-actions{
  display:grid;
  align-items:center;
  min-width:0;
}
.header-actions .search-form{
  position:relative;
  width: clamp(220px, 32vw, 360px);
  margin:0; padding:0; background:transparent; border:0;
}
.header-actions .search-field{
  width:100%; height:32px;
  padding:4px 26px 6px 0;
  border:0; outline:0;
  border-bottom:1px solid #d8dde3;
  background:transparent; color:#0f172a;
  font:400 13px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
.header-actions .search-field::placeholder{ color:#9aa5b1; }
.header-actions .search-field:focus{ border-bottom-color:var(--brand-secondary); }
.header-actions .search-submit{
  position:absolute; right:0; top:50%; transform:translateY(-50%);
  width:18px; height:18px; margin:0; padding:0; border:0; background:transparent; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23677686' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Circle cx='11' cy='11' r='8'/%3E%3Cpath d='M21 21l-4.3-4.3'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:center; background-size:18px 18px;
}

/* Garantia: elementos mobile (se existirem no DOM) ficam ocultos */
.nav-toggle,
.header-search-btn,
.drawer-nav,
.drawer-overlay,
.search-overlay{ display:none !important; }

/* ==========================================================================
   HOME GRID
   ========================================================================== */
.home{ margin:16px 0 44px; }
.home__grid{
  width:min(100%, var(--hdr-max)); margin:0 auto; padding:0 10px;
  display:grid;
  grid-template-columns:minmax(0, var(--hero-col)) minmax(0, var(--right-col));
  column-gap:18px;
  row-gap:16px;
}

/* ==========================================================================
   HERO (esquerda)
   ========================================================================== */
.hero{
  grid-column:1; grid-row:1 / span 2;
  position:relative; min-height:var(--hero-min-h); border-radius:var(--hero-radius); overflow:hidden;
  background:var(--hero-img, #d1d5db) center/cover no-repeat;
  box-shadow:var(--shadow-lg); display:flex; align-items:flex-end;
}
.hero::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(to top, rgba(0,0,0,.80) 0%, rgba(0,0,0,.45) 32%, rgba(0,0,0,0) 65%),
    linear-gradient(to right, rgba(0,0,0,.70) 0%, rgba(0,0,0,.30) 46%, rgba(0,0,0,0) 74%);
}
.hero__content{
  position:relative; z-index:1; color:#fff;
  display:grid; gap:12px; padding:0 16px 16px; max-width:440px;
}
.hero__title{
  margin:0; font:800 24px/1.08 'Rubik', system-ui;
  text-shadow:0 1px 2px rgba(0,0,0,.35);
}
.hero__excerpt{
  margin:0; max-width:46ch; color:#E8F1F6;
  font:400 12px/1.35 'Rubik', system-ui; text-shadow:0 1px 2px rgba(0,0,0,.25);
}

/* ==========================================================================
   TOPBAR (coluna direita)
   ========================================================================== */
.home-topbar{ grid-column:2; }
.home-topbar__pill{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  column-gap:10px;
  background:transparent; border:0; border-radius:0;
  padding:25px 0 10px; margin:0 0 26px;
  border-bottom:1px solid #e5e7eb; box-shadow:none;
}
.home-topbar__brand{ display:flex; align-items:center; min-width:84px; }
.home-topbar__brand img,
.home-topbar__brand svg{ max-height:18px; width:auto; display:block; }
.home-topbar__brand .home-topbar__site{
  display:inline-block; font:800 14px/1 'Rubik', system-ui; letter-spacing:.02em; color:#111;
}

/* (Home) sem navegação de categorias */
.home-topbar__nav{ display:none; }

/* Busca em linha (ícone à direita) */
.home-topbar__actions{ position:relative; display:flex; align-items:center; justify-self:end; }
.home-topbar__actions .search-form{ position:relative; background:transparent; border:0; border-radius:0; padding:0; height:auto; margin:0; }
.home-topbar__actions .search-field{
  width:240px; padding:4px 24px 6px 0; border:0; outline:0; background:transparent;
  border-bottom:1px solid #d8dde3; color:#111827; font:400 13px/1.2 system-ui;
}
.home-topbar__actions .search-field::placeholder{ color:#9aa5b1; }
.home-topbar__actions .search-field:focus{ border-bottom-color:var(--brand-secondary); box-shadow:none; }
.home-topbar__actions .search-submit{
  position:absolute; right:0; top:50%; transform:translateY(-50%);
  width:18px; height:18px; border:0; padding:0; margin:0; background:transparent; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23677686' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Circle cx='11' cy='11' r='8'/%3E%3Cpath d='M21 21l-4.3-4.3'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:center; background-size:18px 18px;
}

/* ==========================================================================
   COLUNA DIREITA (layout) + CARDS / WIDE / LISTA
   ========================================================================== */
.rightcol{
  display:grid;
  grid-template-areas:
    "square rail"
    "wide   wide";
  grid-template-columns:1fr 1fr;
  gap:16px;
}

.square{ grid-area:square; }
.rail  { grid-area:rail; align-self:stretch; }
.wide  { grid-area:wide; }

/* === CARD QUADRADO =============== */
.square{
  position:relative; border-radius:0; overflow:hidden;
  background:var(--square-img, #cfd8dc) center/cover no-repeat;
  box-shadow:var(--shadow-md); display:flex; align-items:flex-end;
  aspect-ratio:auto !important;
  min-height:260px;
}
@media (min-width:1024px){
  .square{ min-height:320px; }
}
.square::before{ content:none !important; display:none !important; padding-top:0 !important; }

.square::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.60) 60%, rgba(0,0,0,.90) 100%);
}
.square__copy{ position:relative; z-index:1; color:#fff; padding:12px; display:grid; gap:12px; }
.square__title{ margin:0; font:800 16px/1.1 'Rubik', system-ui; }

/* Banner wide */
.wide{
  position:relative; min-height:190px;
  border-radius:0; overflow:hidden;
  background:var(--wide-img, #cbd5e1) center/cover no-repeat; box-shadow:var(--shadow-md);
  display:flex; align-items:flex-end;
}
.wide::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.60) 60%, rgba(0,0,0,.90) 100%); }
.wide__copy{ position:relative; z-index:1; color:#fff; padding:0 12px 12px; display:grid; gap:12px; }
.wide__title{ margin:0; font:800 16px/1.05 'Rubik', system-ui; }

/* Lista (rail) */
.rail{
  display:flex; flex-direction:column;
  background:transparent !important; border:0 !important; border-radius:0; box-shadow:none !important;
}
.rail__item{
  display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:center;
  padding:14px 10px; border-bottom:1px solid #e6edf3;
}
.rail__item:last-child{ border-bottom:0; }
.rail__item:hover{ background:#f9fbfd; }
.rail__title{
  margin:0; color:var(--text);
  font:800 13px/1.25 'Rubik', system-ui;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}

/* ==========================================================================
   BUSCA/HEADER – ajustes responsivos não-mobile (apenas largura)
   ========================================================================== */
@media (max-width: 980px){
  .header-actions .search-form{ width: clamp(200px, 42vw, 300px); }
}
@media (max-width: 720px){
  .custom-logo{ max-height:20px; }
  .header-actions .search-form{ width: clamp(160px, 48vw, 240px); }
}

/* ==========================================================================
   BOTÕES – “Ler mais” (HOME)
   ========================================================================== */
.home .read-more,
.home .entry-summary .read-more,
.home .gb-entry__read-more,
.home .generatepress .read-more,
.home .post .read-more,
.home .archive .read-more{
  display:inline-block !important;
  width:auto !important;
  padding:0 !important;
  margin-top:8px !important;
  background:transparent !important;
  border:0 !important;
}
.home .btn,
.home .read-more a,
.home a.read-more,
.home .wp-block-button__link,
.home .button,
.home a.button,
.home .more-link,
.home a.btn{
  display:inline-flex !important;
  align-items:center; justify-content:center; gap:6px;
  width:auto !important; inline-size:auto !important;
  height:34px !important; padding:0 16px !important;
  background:#fff !important; color:#0a2230 !important;
  border:1px solid #d7e0e6 !important; border-radius:0 !important;
  font:800 12px/1 'Rubik', system-ui !important; letter-spacing:.02em;
  box-shadow:0 8px 16px rgba(0,0,0,.14) !important;
  text-align:left !important;
}
.home .btn:hover,
.home .read-more a:hover,
.home a.read-more:hover,
.home .wp-block-button__link:hover,
.home .button:hover,
.home a.button:hover,
.home .more-link:hover{
  transform:translateY(-1px);
  border-color:#cfd8df !important;
  box-shadow:0 10px 20px rgba(0,0,0,.16) !important;
}
.home .btn:active,
.home .read-more a:active,
.home a.read-more:active{ transform:translateY(0); box-shadow:0 6px 12px rgba(0,0,0,.10) !important; }

/* garante respiro nos cards */
.home .square__copy,
.home .wide__copy{ gap:12px; }

/* Normaliza botões dentro dos cards (hero / square / wide) */
.hero__content a,
.square__copy a,
.wide__copy a,
.hero__content .read-more a,
.square__copy .read-more a,
.wide__copy .read-more a,
.hero__content .btn,
.square__copy .btn,
.wide__copy .btn {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-self: flex-start !important;
  justify-self: flex-start !important;
  width: auto !important;
  inline-size: auto !important;
  max-width: max-content !important;
  box-sizing: border-box !important;
  height: 34px !important;
  padding: 0 16px !important;
  gap: 6px !important;
  background: #fff !important;
  color: #0a2230 !important;
  border: 1px solid #d7e0e6 !important;
  border-radius: 0 !important;
  font: 800 12px/1 'Rubik', system-ui !important;
  box-shadow: 0 8px 16px rgba(0,0,0,.14) !important;
  text-align: left !important;
}
.hero__content .read-more,
.square__copy .read-more,
.wide__copy .read-more {
  display: inline-block !important;
  width: auto !important;
  inline-size: auto !important;
  padding: 0 !important;
  margin-top: 8px !important;
  background: transparent !important;
  border: 0 !important;
}

/* === LATERAL (RAIL) — botão curto ======================== */
.rail .rail__item{
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 8px;
  align-items: start;
}
.rail .rail__title{ margin: 0 0 2px; }
.rail .read-more,
.rail .read-more * ,
.rail .more-link,
.rail a.button,
.rail .wp-block-button__link,
.rail .btn {
  display: inline-flex !important;
  width: auto !important;
  inline-size: auto !important;
  justify-self: start !important;
  height: 26px;
  padding: 0 12px;
  background: #fff;
  color: #0a2230;
  border: 1px solid #d7e0e6;
  border-radius: 0;
  font: 700 11px/1 'Rubik', system-ui;
  box-shadow: none;
}
.rail .read-more{
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

/* ====== POSTAGENS RECENTES ================================================= */
.recent{ margin:36px 0 48px; }
.recent__title{
  margin:0 0 18px; text-align:center; color:var(--text);
  font:800 22px/1.15 'Rubik', system-ui; letter-spacing:.01em;
}
.recent__grid{
  display:grid; gap:18px;
  grid-template-columns: repeat(4, minmax(0,1fr));
}
@media (max-width:1024px){ .recent__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width:640px){  .recent__grid{ grid-template-columns: 1fr; } }

.recent-card{
  position:relative; min-height:250px;
  background:var(--card-img, #cfd8dc) center/cover no-repeat;
  border-radius:0; box-shadow:var(--shadow-md);
  display:flex; align-items:flex-end; overflow:hidden;
}
.recent-card::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.60) 60%, rgba(0,0,0,.90) 100%);
}
.recent-card__copy{
  position:relative; z-index:1; color:#fff;
  padding:14px; display:grid; gap:10px;
}
.recent-card__title{
  margin:0; font:800 16px/1.12 'Rubik', system-ui;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.recent-card__title a{ color:#fff; text-decoration:none; }
.recent-card__excerpt{
  margin:0; color:#E8F1F6; font:400 12px/1.35 'Rubik', system-ui;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.recent .btn{
  height:26px; padding:0 12px;
  border:1px solid #d7e0e6; background:#fff; color:#0a2230;
  font:700 11px/1 'Rubik', system-ui; border-radius:0; box-shadow:none;
  justify-self:start;
}
.recent{
  width:min(100%, calc(var(--hdr-max) + 20px));
  margin:36px auto 48px;
  padding:0 10px;
}

/* ===================== TRENDING / POPULARES ===================== */
.trending{ margin:42px 0 56px; }
.trending .container{width:min(100%, calc(var(--hdr-max) + 20px));margin:0 auto;padding: 0px 60px;}

.trending__head{ margin:0 0 16px; }
.trending__eyebrow{
  display:inline-block; margin-bottom:6px; padding:2px 8px;
  background:#f1f5f9; color:#0f172a; border-radius:9999px;
  font:800 10px/1 'Rubik', system-ui; letter-spacing:.08em; text-transform:uppercase;
}
.trending__title{
  margin:0; color:var(--text);
  font:800 24px/1.15 'Rubik', system-ui; letter-spacing:.01em;
}

/* Grid principal do trending */
.trending__grid{
  display:grid;
  gap: 0px;
  grid-template-columns: 1.1fr 1fr 0.9fr;
  grid-template-areas:
    "big  wide  rail"
    "big  minis rail";
}
@media (max-width:1024px){
  .trending__grid{
    grid-template-columns: 1fr;
    grid-template-areas:
      "big"
      "wide"
      "minis"
      "rail";
  }
}
@media (min-width: 1025px){
  .trending .trending__grid{
    grid-template-columns: 485px 317px 400px;
    column-gap: 21px;
  }
}
/* Base comum dos cards */
.tr-card{
  position:relative; overflow:hidden; border-radius:0; box-shadow:var(--shadow-md);
  background:var(--img,#cfd8dc) center/cover no-repeat;
  display:flex; align-items:flex-end;
}
.tr-card::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0) 36%, rgba(0,0,0,.65) 68%, rgba(0,0,0,.92) 100%);
}
.tr-card__copy{
  position:relative; z-index:1; color:#fff;
  display:grid; gap:10px; padding:16px 14px 14px;
  max-width: 52ch; text-shadow:0 1px 2px rgba(0,0,0,.35);
}
.tr-card__title{
  margin:0; font:800 18px/1.12 'Rubik', system-ui;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.tr-card__title a{ color:#fff; text-decoration:none; }
.tr-card__excerpt{
  margin:0; color:#E8F1F6; font:400 12px/1.35 'Rubik', system-ui;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}

/* Tamanhos/posicionamento */
.trend-hero{ grid-area: big; }
.trend-wide{ grid-area: wide; }
.trend-minis{
  grid-area: minis;
  display: grid;
  gap: 18px;
  grid-template-columns: 1fr 1fr;
}

/* Alturas fixas (desktop) */
.tr-card{ height: 100%; }
.trend-wide{ height: 210px; min-height:0 !important; }
.trend-mini{ height: 210px; min-height:0 !important; }
.trend-hero{
  height: calc(210px + 18px + 210px);
  min-height: 0 !important;
}

/* Minis tipografia */
.trend-mini .tr-card__title{font-size: 12px;line-height:1.18;-webkit-line-clamp:3;}
.trend-mini .tr-card__copy{ padding:16px 14px 14px; }

/* Rail do trending (layout igual ao mock) */
.trending .trend-rail{
  grid-area: rail;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.trending .trend-rail .rail__item{
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  row-gap: 20px !important;
  align-items: start !important;
  padding: 19px 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid #e6edf3 !important;
  box-shadow: none !important;
}
.trending .trend-rail .rail__item:last-child{ border-bottom: 0 !important; }
.trending .trend-rail .rail__title{
  margin: 0 !important;
  font: 800 13px/1.25 'Rubik', system-ui !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* Botões compactos do trending */
.trending .btn,
.trending .read-more a,
.trending a.read-more,
.trending .wp-block-button__link{
  display:inline-flex !important; align-items:center; justify-content:center;
  height:26px; padding:0 12px;
  background:#fff; color:#0a2230; border:1px solid #d7e0e6; border-radius:0;
  font:700 11px/1 'Rubik', system-ui; box-shadow:none;
  width:auto !important; inline-size:auto !important;
  align-self:start; justify-self:start;
}
.trending .read-more{
  display:inline-block !important; width:auto !important; padding:0 !important;
  background:transparent !important; border:0 !important;
}

/* ====== VEJA TAMBÉM ====================================================== */
.more{ margin:44px 0 64px; }
.more__title{ margin:0 0 18px; font:800 22px/1.15 'Rubik',system-ui; color:var(--text); }
.more__grid{ display:grid; gap:18px; grid-template-columns:repeat(4,minmax(0,1fr)); }
@media (max-width:1100px){ .more__grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:720px){  .more__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:460px){  .more__grid{ grid-template-columns:1fr; } }

.more-card{
  display:grid;
  grid-template-rows:auto auto auto;
  gap:8px;
  padding:0; border:0; box-shadow:none; background:transparent;
}
.more-card__tag{ font:700 10px/1 'Rubik',system-ui; letter-spacing:.08em; text-transform:uppercase; color:#7b8a96; }
.more-card__thumb{
  position:relative; aspect-ratio:4/3;
  background:var(--card-img,#cfd8dc) center/cover no-repeat;
  border:0; border-radius:2px; overflow:hidden; margin:6px 0 8px;
}
.more-card__title{
  margin:0; font:800 14px/1.25 'Rubik',system-ui; color:var(--text);
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.more-card__title a{ color:inherit; text-decoration:none; }
.more .btn{
  justify-self:start; height:26px; padding:0 12px; border:1px solid #d7e0e6; background:#fff; color:#0a2230;
  font:700 11px/1 'Rubik',system-ui; border-radius:0; box-shadow:none;
}

/* ==== VEJA TAMBÉM — central e alinhado como no mock ==== */
.more.container{
  width:min(100%, calc(var(--hdr-max) + 20px));
  margin:44px auto 64px;
  padding:0 10px;
}
.more__grid{
  display:grid;
  gap:18px;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  align-items:start;
  justify-items:stretch;
}
@media (max-width:1100px){ .more__grid{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (max-width:720px){  .more__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:460px){  .more__grid{ grid-template-columns:1fr; } }
.more-card{
  display:grid;
  grid-template-rows: auto auto 1fr auto;
  gap:8px; padding:0; border:0; background:transparent; box-shadow:none;
}
.more-card__thumb{
  position:relative;
  aspect-ratio:4/3;
  background:var(--card-img,#cfd8dc) center/cover no-repeat;
  border-radius:2px;
  overflow:hidden;
  margin:6px 0 8px;
}
.more-card__title{
  margin:0; font:800 14px/1.25 'Rubik',system-ui; color:var(--text);
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden;
  min-height: calc(2 * 1.25em);
}
.more .btn{
  justify-self:start; height:26px; padding:0 12px; border:1px solid #d7e0e6; background:#fff; color:#0a2230;
  font:700 11px/1 'Rubik',system-ui; border-radius:0; box-shadow:none;
}

/* ==========================================================================
   FOOTER — layout + estilos
   ========================================================================== */
.footer { padding: 24px 0 32px; }
.footer .container{
  width: min(100%, calc(var(--hdr-max) + 20px));
  margin: 0 auto; padding: 0 10px;
}
.footer-top__grid{ display: grid; gap: 18px; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); margin-bottom: 18px; }
.footer-mid__grid{ display: grid; gap: 18px; grid-template-columns: 1fr 1fr; margin-bottom: 14px; }
.card{ background: #f5f7f9; border: 1px solid #eef2f5; border-radius: 0px; padding: 35px; }
.footer-title{ margin:0 0 8px; font:800 35px/1.2 'Rubik', system-ui; color:#0f172a; }
.footer-title.sm{ font-size:35px; }
.footer-sub{  margin:0 0 10px; color:#334155; font:500 13px/1.45 system-ui; }
.footer-note{ margin:8px 0 0;  color:#6b7b86; font:400 12px/1.35 system-ui; }
.footer-brand{ display: grid; justify-items: center; text-align: center; }
.footer-brand__logo img{ max-height: 34px; width: auto; display: block; margin: 0 auto 10px; }
.site-footer__brand-desc{ color:#334155; font:400 13px/1.45 system-ui; white-space: pre-line; }
.footer-links, .footer-cats__nav{ list-style:none; margin:0; padding:0; }
.footer-links{ display:grid; gap:6px; }
.footer-links a{ color:#0f172a; text-decoration:none; font:600 13px/1.25 system-ui; }
.footer-links a:hover{ text-decoration:underline; }
.footer-cats__nav{ display:grid; grid-template-columns: repeat(4, minmax(140px, 1fr)); column-gap: 34px; row-gap: 10px; align-content:start; }
.footer-cats__nav li{ margin:0; padding:2px 0; }
.footer-cats__nav a{ color:#0f172a; text-decoration:none; font:600 13px/1.25 system-ui; }
.footer-cats__nav a:hover{ text-decoration:underline; }
.footer .srx-form[data-srx-type="newsletter"]{
  display:grid; grid-template-columns: 1fr auto; align-items:center; gap:8px;
  max-width:520px; margin:0;
}
.footer .srx-form[data-srx-type="newsletter"] input[type="email"]{
  width:100%; padding:12px 14px; font-size:16px; border:1px solid #d0dde6; background:#fff;
  border-radius:9999px 0 0 9999px; box-shadow: inset 0 1px 2px rgba(0,0,0,.04);
}
.footer .srx-form[data-srx-type="newsletter"] button[type="submit"]{
  width:auto !important; display:inline-flex !important; align-items:center; justify-content:center;
  padding:10px 18px !important; font-weight:700; font-size:14px; border:none;
  border-radius:0 9999px 9999px 0; background:#0b4c6b; color:#fff;
  box-shadow:0 6px 18px rgba(11,76,107,.25); cursor:pointer;
}
.footer .srx-form[data-srx-type="newsletter"] .srx-msg{ grid-column:1/-1; text-align:center; margin-top:6px; font-size:14px; }
.footer-bottom{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding-top:6px; border-top:1px solid #eef2f5; margin-top:6px;
}
.footer-brandmark img{ height:28px; width:auto; display:block; }
.copy{ margin:0; color:#6b7b86; font:500 12px/1.2 system-ui; }

@media (max-width: 1100px){ .footer-cats__nav{ grid-template-columns: repeat(3, minmax(140px, 1fr)); } }
@media (max-width: 980px){
  .footer-top__grid{ grid-template-columns: 1fr; }
  .footer-mid__grid{ grid-template-columns: 1fr; }
}
@media (max-width:640px){
  .footer-cats__nav{ grid-template-columns: repeat(2, minmax(130px, 1fr)); }
  .footer .srx-form[data-srx-type="newsletter"]{ grid-template-columns:1fr; }
  .footer .srx-form[data-srx-type="newsletter"] input[type="email"]{ border-radius:9999px; }
  .footer .srx-form[data-srx-type="newsletter"] button[type="submit"]{ border-radius:9999px; width:100% !important; }
}

/* ===== CATEGORY ONLY: Trending isolado ===== */
.cat-trending{
  --tr-gap: 18px;
  --tr-wide-h: 210px;
  --tr-mini-h: 210px;
}
.cat-trending .trending__grid{ gap: var(--tr-gap); }
.cat-trending .trend-hero{ grid-area: big; }
.cat-trending .trend-wide{ grid-area: wide; }
.cat-trending .trend-minis{
  grid-area: minis;
  display: grid;
  gap: var(--tr-gap);
  grid-template-columns: 1fr 1fr;
}
.cat-trending .tr-card{ height: 100%; }
.cat-trending .trend-wide{ height: var(--tr-wide-h); min-height:0 !important; }
.cat-trending .trend-mini{ height: var(--tr-mini-h); min-height:0 !important; }
.cat-trending .trend-hero{
  height: calc(var(--tr-wide-h) + var(--tr-gap) + var(--tr-mini-h));
  min-height: 0 !important;
}
.cat-trending .trend-rail{
  grid-area: rail;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.cat-trending .trend-rail .rail__item{
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  row-gap: 20px !important;
  align-items: start !important;
  padding: 19px 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid #e6edf3 !important;
  box-shadow: none !important;
}
.cat-trending .trend-rail .rail__item:last-child{ border-bottom: 0 !important; }
.cat-trending .trend-rail .rail__title{
  margin: 0 !important;
  font: 800 13px/1.25 'Rubik', system-ui !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.cat-trending .btn,
.cat-trending .read-more a,
.cat-trending a.read-more,
.cat-trending .wp-block-button__link{
  display:inline-flex !important; align-items:center; justify-content:center;
  height:26px; padding:0 12px;
  background:#fff; color:#0a2230; border:1px solid #d7e0e6; border-radius:0;
  font:700 11px/1 'Rubik', system-ui; box-shadow:none;
  width:auto !important; inline-size:auto !important;
  align-self:start; justify-self:start;
}
.cat-trending .read-more{
  display:inline-block !important; width:auto !important; padding:0 !important;
  background:transparent !important; border:0 !important;
}
@media (max-width:1024px){
  .cat-trending .trending__grid{
    grid-template-columns:1fr;
    grid-template-areas:
      "big"
      "wide"
      "minis"
      "rail";
  }
  .cat-trending .trend-wide,
  .cat-trending .trend-mini,
  .cat-trending .trend-hero{ height:auto; }
  .cat-trending .trend-wide{ min-height:190px; }
  .cat-trending .trend-mini{ min-height:210px; }
  .cat-trending .trend-hero{ min-height:360px; }
}
@media (max-width:640px){
  .cat-trending .trend-minis{ grid-template-columns:1fr; }
}

/* ==========================================================================
   CATEGORY PAGE
   ========================================================================== */
.section { width: min(100%, calc(1120px + 20px)); margin-inline: auto; padding-inline: 10px; }

/* HERO da category */
.section--cat-hero { padding: 14px 0 12px; }
.cat-hero{
  --cat-hero-bg: none;
  --cat-hero-pos: center 22%;
  position: relative;
  min-height: 220px;
  display: grid;
  align-content: end;
  gap: 10px;
  padding: 28px;
  border: 1px solid #eef2f5;
  background:
    linear-gradient(180deg, rgba(0,0,0,.0) 30%, rgba(0,0,0,.55) 100%),
    var(--cat-hero-bg);
  background-position: center, var(--cat-hero-pos);
  background-size: cover, cover;
  color: #fff;
  box-shadow: var(--shadow-md, 0 6px 18px rgba(17,24,39,.06));
}
.cat-hero--center{ align-content: end; }
.cat-hero__title{
  margin: 0;
  font: 800 34px/1.1 "Rubik", system-ui;
  letter-spacing: .2px;
  text-shadow: 0 2px 10px rgba(0,0,0,.35);
}
.cat-hero__desc{ margin: 0; max-width: 72ch; font: 500 14px/1.45 system-ui; opacity: .95; }

/* CAT STRIP */
.cat-strip{ padding: 16px 0 8px; }
.cat-strip__grid{ display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; }
.mini-card{ position: relative; border-radius: 10px; overflow: hidden; }
.mini-card__link{ display: block; position: relative; color: inherit; text-decoration: none; }
.mini-card__img{ width: 100%; height: 190px; object-fit: cover; display: block; }
.mini-card__overlay{ position:absolute; inset:0; background: linear-gradient(180deg, rgba(0,0,0,.0) 45%, rgba(0,0,0,.7) 100%); }
.mini-card__copy{ position:absolute; left:12px; right:12px; bottom:12px; display:grid; gap:6px; color:#fff; }
.mini-card__title{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; font: 800 14px/1.25 "Rubik", system-ui; }
.mini-card__btn{
  justify-self:start; height: 26px; padding: 0 10px;
  border:1px solid rgba(255,255,255,.6);
  font: 700 11px/26px "Rubik", system-ui;
  color:#fff; background: transparent; border-radius: 4px;
}
@media (max-width: 800px){
  .cat-strip__grid{
    grid-auto-flow: column;
    grid-auto-columns: clamp(70%, 72vw, 320px);
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    padding-bottom: 6px;
  }
  .mini-card{ scroll-snap-align: start; }
}

/* LISTA PRINCIPAL (cards) */
.cat-list{ padding:8px 0 20px; }
.cat-list__grid{ display:grid; gap:22px; grid-template-columns:repeat(4, minmax(0,1fr)); }

.wide-card{
  display:grid; grid-template-columns:1fr; grid-template-rows:auto auto auto;
  gap:10px; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; transition:none;
}
.wide-card:hover{ transform:none; box-shadow:none; border-color:transparent; }

.wide-card__eyebrow{
  justify-self:start; padding:2px 8px; border-radius:0;
  background:#f1f5f9; color:#0f172a; font:800 10px/1 'Rubik',system-ui; letter-spacing:.08em; text-transform:uppercase;
}
.wide-card__thumb{ display:block; }
.wide-card__thumb img{
  width:100%; height:auto; aspect-ratio:16/9; object-fit:cover;
  border:1px solid #eef2f5; border-radius:0; background:#f3f4f6;
}
.wide-card__copy{ display:grid; align-content:start; gap:8px; padding-top:0; }
.wide-card__title{
  margin:0; color:var(--text,#0f172a); font:800 15px/1.3 "Rubik",system-ui;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.wide-card__btn{
  justify-self:start; height:26px; padding:0 12px; border:1px solid #d7e0e6; background:#fff; color:#0a2230;
  font:700 11px/26px "Rubik",system-ui; border-radius:0; text-decoration:none; box-shadow:none;
}
@media (max-width:1100px){ .cat-list__grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:780px){  .cat-list__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:480px){  .cat-list__grid{ grid-template-columns:1fr; } }

/* PAGINAÇÃO — barra escura */
.pager.pager--bar{
  display:grid; grid-template-columns: 1fr auto 1fr; align-items:center; gap:14px;
  margin-top:20px; background:#262626; border-radius:4px; padding:10px 16px; color:#fff;
}
.pager__side{ display:flex; align-items:center; }
.pager__side--prev{ justify-content:flex-start; }
.pager__side--next{ justify-content:flex-end; }
.pager__btn{
  display:inline-flex !important; align-items:center; gap:8px;
  background:#fff; color:#111 !important; border-radius:4px; padding:6px 12px;
  font:600 13px/1 system-ui,-apple-system,Segue UI,Roboto,Arial,sans-serif; text-decoration:none;
  box-shadow:0 2px 8px rgba(0,0,0,.12);
}
.pager__arrow{ display:inline-block; width:12px; height:12px; border:2px solid currentColor; border-top:0; border-left:0; }
.pager__arrow--left{ transform:rotate(135deg); }
.pager__arrow--right{ transform:rotate(-45deg); }
.pager__nums{ display:flex; align-items:center; gap:10px; }
.pager__nums .page-numbers{ color:#fff; opacity:.85; text-decoration:none; font:500 13px/1 system-ui,-apple-system,Segue UI,Roboto,Arial,sans-serif; padding:0 2px; }
.pager__nums .page-numbers:hover{ opacity:1; }
.pager__nums .dots{ opacity:.6; padding:0 8px; }
.pager__nums .current{
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border:1.5px solid #fff; border-radius:999px; font-weight:700; opacity:1;
}

/* ============================== SINGLE POST — layout & estilos ============================== */
.post-wrap{
  width: min(100%, calc(1120px + 20px));
  margin: 0 auto; padding: 26px 10px;
  display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  gap: 2px 27px; align-items: start;
}
.post-rail{ order: -1; display:grid; gap: 12px; }
.post-rail__banner{
  min-height: 560px; background: var(--rail-img, #e9eef3) top center / cover no-repeat;
  border: 1px solid #eef2f5; position: relative; box-shadow: var(--shadow-md, 0 6px 18px rgba(17,24,39,.06));
}
.post-rail__banner::after{ content:""; position:absolute; inset:0; }
.post-rail__badge{ display:none !important; }
.post-rail__list{ display:flex; flex-direction:column; gap:10px; }
.rail-item{
  display:grid; grid-template-columns: 1fr auto; gap:12px; align-items:center;
  border:1px solid #eef2f5; background:#fff; padding:12px; text-decoration:none; color:inherit; border-radius:6px;
  transition: background-color .12s ease, border-color .12s ease;
}
.rail-item:hover{ background:#f8fafc; border-color:#e6edf3; }
.rail-item__title{
  font:800 13.5px/1.28 "Rubik", system-ui;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.rail-item__btn{
  justify-self:end; height:26px; padding:0 12px; border:1px solid #d7e0e6; background:#fff; color:#0a2230;
  font:700 11px/26px "Rubik", system-ui; border-radius:0;
}
.post-main .share-inline{ display:flex; align-items:center; gap:10px; margin: 8px 0 18px; }
.post-main .share-btn{ width:32px; height:32px; display:grid; place-items:center; border:1px solid #e2e8f0; border-radius:999px; background:#fff; }
.post-main .share-btn svg{ width:16px; height:16px; fill:currentColor; color:#0f172a; }

/* SINGLE — BOX DO AUTOR */
.author-row {
  margin: 22px 301px 21px;
  width: min(100%, 1100px);
  padding: 0 327px;
  display: grid;
  grid-template-columns: 30px minmax(0, 920px);
  justify-content: center;
  gap: 16px;
  align-items: center;
}
.author-share{ align-self:stretch; display:grid; place-content:center; gap:10px; }
.author-share a{
  display:grid; place-items:center; width:36px; height:36px; border-radius:999px;
  border:1px solid #e2e8f0; background:#fff; transition:transform .12s, box-shadow .12s, border-color .12s;
}
.author-share svg{ width:18px; height:18px; color:#0f172a; fill:currentColor; }
.author-share a:hover{ transform:translateY(-1px); box-shadow:0 6px 18px rgba(17,24,39,.08); border-color:#dbe3ea; }

.author-box{
  display:grid; grid-template-columns:78px 1fr; gap:14px;
  padding:16px; background:#0f172a; color:#e5eef6; box-shadow:0 8px 22px rgba(2,8,23,.20);
}
.author-box__media{ display:grid; place-items:center; }
.author-box__media img{
  width:68px; height:68px; border-radius:999px; object-fit:cover;
  border:3px solid rgba(255,255,255,.16); box-shadow:0 4px 14px rgba(0,0,0,.35);
}
.author-box__copy{ display:grid; gap:6px; align-content:center; }
.author-box__tag{ display:none; }
.author-box__name{ margin:0; font:800 18px/1.2 "Rubik", system-ui; color:#fff; }
.author-box__bio{ margin:0; font:400 13px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; color:#cfe1f1; }
.author-row + .also{ margin-top:22px; }

@media (max-width: 1200px){ .post-rail__banner{ min-height: 500px; } }
@media (max-width: 980px){
  .post-wrap{ grid-template-columns: 1fr; }
  .post-rail{ order: initial; }
  .post-rail__banner{ min-height: 360px; }
}
@media (max-width:720px){
  .author-row{ grid-template-columns:1fr; gap:12px; margin:22px auto 24px; }
  .author-share{ order:2; display:flex; gap:10px; justify-content:flex-start; }
  .author-box{ order:1; grid-template-columns:66px 1fr; padding:14px; }
  .author-box__media img{ width:62px; height:62px; }
  .author-box__name{ font-size:17px; }
  .author-box__bio{ font-size:13px; }
}

/* SEE ALSO — mini grid */
.also__grid--mini4{ display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:24px; }
.also-mini{ display:grid; gap:10px; background:transparent; padding:0; border:none; }
.also-mini__eyebrow{ display:block; font:700 10px/1 "Rubik", system-ui; letter-spacing:.08em; text-transform:uppercase; color:#6b7280; }
.also-mini__thumb{ display:block; background:transparent; border:none; }
.also-mini__thumb img{ width:100%; height:150px; object-fit:cover; display:block; }
.also-mini__title{
  margin:0; font:800 14px/1.25 "Rubik", system-ui; color:#0f172a;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.also-mini__btn{
  justify-self:start; font:700 11px/1 "Rubik", system-ui; color:#0a2230;
  border:1px solid #d7e0e6; background:#fff; padding:6px 10px; text-decoration:none; margin-top:6px;
}
@media (max-width: 1100px){ .also__grid--mini4{ grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 820px){
  .also__grid--mini4{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .also-mini__thumb img{ height:130px; }
}

/* ============================== PAGE — HERO / Tipografia ============================== */
.section--page .legal-hero-title {
  max-width: 886px; margin: 12px auto 18px; display: block; padding: 31px 16px;
  background: #eef2f5; border: 1px solid #e2e8f0;
  font: 800 45px / 1.1 "Rubik", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
.section--page .article-content{ max-width: 860px; margin: 0 auto; background: transparent; box-shadow: none; padding: 0; }
.section--page .article-body{ color:#102238; font: 400 16.5px/1.7 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; }
.section--page .article-body p{ margin: 0 0 14px; }
.section--page .article-body p + p{ margin-top: 6px; }
.section--page .article-body h2{
  margin: 26px 0 10px; padding-bottom: 8px;
  font: 800 20px/1.2 "Rubik", system-ui; color: var(--heading, #0d3340);
  border-bottom: 1px solid #e7edf3;
}
.section--page .article-body h3{ margin: 20px 0 8px; font: 700 17px/1.25 "Rubik", system-ui; color: #0f2531; }
.section--page .article-body ul,
.section--page .article-body ol{ margin: 0 0 16px 1.25rem; }
.section--page .article-body li{ margin: 6px 0; }
.section--page .article-body hr{ height:1px; border:0; margin: 18px 0; background:#e7edf3; }
.section--page .article-body blockquote{
  margin: 14px 0; padding: 12px 14px;
  border-left: 4px solid color-mix(in srgb, var(--brand-primary, #034872) 38%, #dfeaf3);
  background: color-mix(in srgb, var(--brand-primary, #034872) 8%, #f6f9fc);
  color:#0d2330;
}
.section--page .article-body code{
  background:#f2f6fa; padding:2px 6px; border-radius:6px;
  font: 500 13px/1.4 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}
.section--page .article-body pre{
  background:#0b1720; color:#e6f1fb; padding:14px; border-radius:10px; overflow:auto;
  font: 500 13px/1.55 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}
.section--page .article-body img,
.section--page .article-body figure,
.section--page .article-body iframe{ max-width:100%; height:auto; }
.section--page .article-body figure{ margin:14px 0; }
.section--page .article-body figcaption{ font: 500 12.5px/1.4 system-ui; color:#506574; margin-top:6px; }

.also.also--single{ width:min(100%, 1100px); margin: 28px auto 0; padding: 0 10px; }
.also__wrap{ display:block; }
.also__title{ margin:0 0 14px; font:800 24px/1.1 "Rubik", system-ui; color:#0e2733; }

/* ============================== CONTATO — layout ============================== */
.page-contact .contact-hero-title {
  display: block; max-width: 1100px; margin: 10px auto 10px;
  padding: 34px 368px 41px; border-radius: 0px; background: #eef2f5; border: 0px solid #e2e8f0;
  font: 630 40px / 1.1 "Rubik", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color: #0d3340;
}
.page-contact{ display:grid; grid-template-columns: 1fr; row-gap: 16px; }
.page-contact .contact-hero-title{ grid-column: 1/-1; }
.page-contact .also{ grid-column: 1/-1; }

@media (min-width: 980px){
  .page-contact{
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    column-gap: 24px;
  }
  .page-contact .contact-intro{ grid-column: 1 / 2; }
  .page-contact .contact-form{ grid-column: 2 / 3; }
}
/* FRONT-PAGE — TRENDING minis no desktop */
@media (min-width: 1025px){
  .home .trending .trend-minis{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    margin-top: 18px;
  }
}
@media (max-width: 1024px){
  .home .trending .trend-minis{
    grid-template-columns: 1fr;
    gap: 14px;
    margin-top: 0;
  }
}
@media (min-width:980px){
  .page-contact{
    grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
    column-gap:24px;
    align-items:center; /* centra verticalmente */
  }
}
.page-contact .contact-form{ align-self:center; justify-self:center; }

/* ============================== SINGLE — GRID COM ÁREAS ============================== */
.post-wrap{
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  grid-template-areas:
    "rail topbar"
    "rail main";
  grid-auto-rows: auto;
  gap: 2px 27px;
  align-items: start;
}
.post-rail  { grid-area: rail; }
.post-topbar{ grid-area: topbar; align-self: start; }
.post-main  { grid-area: main; }

@media (max-width: 980px){
  .post-wrap{
    grid-template-columns: 1fr;
    grid-template-areas:
      "topbar"
      "main"
      "rail";
  }
}

/* ============================== SINGLE — TOPBAR ============================== */
.post-topbar__pill{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  column-gap:10px;
  background:transparent;
  border:0;
  border-radius:0;
  padding:25px 0 10px;
  margin:0 0 6px;
  border-bottom:1px solid #e5e7eb;
}
.post-topbar .home-topbar__brand{ display:flex; align-items:center; min-width:84px; }
.post-topbar .home-topbar__brand img,
.post-topbar .home-topbar__brand svg{ max-height:18px; width:auto; display:block; }
.post-topbar .home-topbar__site{ display:inline-block; font:800 14px/1 'Rubik', system-ui; letter-spacing:.02em; color:#111; }
.post-topbar .home-topbar__actions{ position:relative; display:flex; align-items:center; justify-self:end; }
.post-topbar .home-topbar__actions .search-form{ position:relative; background:transparent; border:0; border-radius:0; padding:0; height:auto; margin:0; }
.post-topbar .home-topbar__actions .search-field{
  width:240px; padding:4px 24px 6px 0; border:0; outline:0; background:transparent;
  border-bottom:1px solid #d8dde3; color:#111827; font:400 13px/1.2 system-ui;
}
.post-topbar .home-topbar__actions .search-field::placeholder{ color:#9aa5b1; }
.post-topbar .home-topbar__actions .search-field:focus{ border-bottom-color:var(--brand-secondary); box-shadow:none; }
.post-topbar .home-topbar__actions .search-submit{
  position:absolute; right:0; top:50%; transform:translateY(-50%);
  width:18px; height:18px; border:0; padding:0; margin:0; background:transparent; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23677686' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Circle cx='11' cy='11' r='8'/%3E%3Cpath d='M21 21l-4.3-4.3'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:center; background-size:18px 18px;
}

/* Mostra o ícone de menu na single */
.post-topbar .nav-toggle{
  display:inline-grid !important;
  place-content:center;
  width:30px; height:30px; padding:0; margin:0;
  background:transparent; border:0; cursor:pointer;
}
.post-topbar .nav-toggle .nav-toggle-bar{
  width:20px; height:2px; margin:2px 0;
  background:#0f172a; border-radius:2px; display:block;
}

/* Título da single */
.post-main .post-title{
  margin: 4px 0 6px;
  font: 800 32px/1.15 "Rubik", system-ui;
  color:#0e2733;
}

/* ==== SINGLE — Author Box embutido ==== */
.author-row--inpost{
  margin: 22px 0 21px !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: none !important;
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) !important;
  justify-content: initial !important;
  align-items: start !important;
  gap: 16px !important;
}
.author-row--inpost .author-share{ align-self: start !important; }
.author-row--inpost .author-box{ width: auto !important; }

/* MOBILE ajustes do inpost já cobertos depois */

/* Esconde o header.php global */
.site-header{ display:none !important; }
.site-main{ margin-top:0 !important; }

/* ========= TOPBAR global: botão hambúrguer visível ========= */
.site-topbar .home-topbar__actions{ display:flex; align-items:center; gap:10px; }
.site-topbar .nav-toggle{
  display:inline-flex !important;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap: 7px;
  width: 44px;
  height: 44px;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  line-height:0;
  font-size:0;
  color:#0f172a;
  -webkit-tap-highlight-color:transparent;
}
.site-topbar .nav-toggle-bar{
  display:block !important; width:22px; height:2px; background:currentColor; border-radius:2px;
  transition:transform .24s ease, opacity .24s ease;
}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1){ transform: translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3){ transform: translateY(-6px) rotate(-45deg); }

/* ========= Drawer (abre da direita) ========= */
:where(.drawer-nav,.drawer-overlay,.search-overlay){ display:block !important; }
:where(.drawer-nav[hidden],.drawer-overlay[hidden],.search-overlay[hidden]){ display:none !important; }
.drawer-nav{
  position: fixed; top: 0; right: 0; bottom: 0; left: auto;
  width: clamp(260px, 86vw, 340px);
  background: #fff; box-shadow: -24px 0 40px rgba(0,0,0,.12);
  transform: translateX(100%); transition: transform .32s ease, visibility 0s linear .32s;
  visibility: hidden; overflow: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; z-index: 100010;
}
.admin-bar .drawer-nav{ top: 32px; }
@media (max-width: 782px){ .admin-bar .drawer-nav{ top: 46px; } }
.drawer-nav.is-open{ transform: translateX(0); visibility: visible; transition: transform .32s ease; }
.drawer-overlay,
#drawer-overlay,
#drawer-backdrop{
  position: fixed; inset: 0; background: rgba(14,18,27,.45);
  opacity: 0; pointer-events: none; transition: opacity .32s ease; z-index: 100005;
}
.drawer-overlay.is-open,
#drawer-overlay.is-open,
#drawer-backdrop.is-open{ opacity: 1; pointer-events: auto; }
.drawer-head{ display:flex; align-items:center; justify-content:flex-end; padding:14px 16px; border-bottom:1px solid rgba(0,0,0,.06); }
.drawer-close{ appearance:none; background:none; border:0; font:inherit; padding:6px 10px; cursor:pointer; line-height:1; }
.drawer-menu .menu{ list-style:none; margin:0; padding:8px 0; }
.drawer-menu .menu > li > a{ display:block; padding:12px 16px; text-decoration:none; color:inherit; }
.drawer-title{ display: none !important; }
/* ==========================================================================
   MOBILE (≤720px) — header limpo + carrossel (3 itens) + lista
   ========================================================================== */
@media (max-width:720px){

  /* --- usar header.php no mobile e esconder topbars antigas --- */
  .site-header{ display:block !important; }
  .site-topbar, .home-topbar, .post-topbar{ display:none !important; }

  /* --- HEADER [☰ | LOGO | 🔍] --- */
  .header .header-inner{
    position:relative;
    min-height:60px;
    display:grid;
    grid-template-columns:1fr;      /* logo central */
    align-items:center;
    border-bottom:1px solid rgba(15,23,42,.12);
  }
  .site-header .main-navigation{ display:none !important; } /* sem menu horizontal no mobile */
  .header .site-brand{ justify-self:center; }
  .custom-logo{ max-height:26px; }

  /* hambúrguer à ESQUERDA (3 barras visíveis) */
  .header .nav-toggle{
    position:absolute; left:6px; top:50%; transform:translateY(-50%);
    display:inline-flex !important; flex-direction:column; justify-content:center; align-items:center;
    width:44px; height:44px; padding:0; margin:0; background:transparent; border:0; color:#0f172a;
    -webkit-tap-highlight-color:transparent;
  }
  .header .nav-toggle-bar{
    display:block; width:24px; height:2px; border-radius:2px; background:currentColor;
    transition:transform .24s ease, opacity .24s ease;
  }
  .header .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1){ transform:translateY(6px) rotate(45deg); }
  .header .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2){ opacity:0; }
  .header .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

  /* lupa à DIREITA (só ícone; overlay abre via JS) */
  .header .header-actions{ position:absolute; right:8px; top:50%; transform:translateY(-50%); }
  .header .header-actions .search-form{ width:auto; }
  .header .header-actions .search-field{ display:none !important; }
  .header .header-actions .search-submit{ width:28px; height:28px; background-size:20px 20px; }

  /* --- HOME: somente carrossel + lista --- */
  .home__grid{ grid-template-columns:1fr !important; row-gap:12px; }
  .hero, .rightcol .square, .rightcol .wide, .trending{ display:none !important; }

  /* --- CARROSSEL (3 itens grandes) --- */
  .home-caro{
    grid-column:1 / -1;
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns: clamp(88vw, 92vw, 420px); /* quase a tela toda */
    gap:16px;
    padding:12px 12px 8px;
    margin:6px auto 10px;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    scroll-snap-type:inline mandatory;
    width:min(100%, var(--hdr-max));
  }
  .home-caro > *:nth-child(n+4){ display:none !important; } /* limita a 3 */
  .home-caro .tr-card{
    height:auto !important;
    min-height:340px !important;          /* altura consistente */
    border-radius:8px;
    background-position:center !important; /* evita cortes estranhos */
    background-size:cover !important;
    scroll-snap-align:start;
  }
  .home-caro .tr-card__copy{ padding:18px 16px 16px !important; gap:12px !important; }
  .home-caro .tr-card__title{ font-size:20px !important; line-height:1.18 !important; -webkit-line-clamp:3 !important; }
  .home-caro .tr-card__excerpt{ display:none !important; } /* foco no título */
  .home-caro .btn{
    height:32px !important; padding:0 14px !important;
    font:800 12px/1 'Rubik',system-ui !important;
    border-radius:4px !important; box-shadow:none !important;
  }

  /* --- LISTA abaixo do carrossel (separadores e botões compactos) --- */
  .rightcol{ grid-column:1 / -1; display:block !important; }
  .rail{ margin:8px 8px 0 !important; border-top:1px solid #e6edf3; }
  .rail__item{ padding:14px 6px !important; border-bottom:1px solid #e6edf3; }

  /* --- Author box embutido (stack) --- */
  .author-row--inpost{ grid-template-columns:1fr !important; gap:12px !important; }
  .author-row--inpost .author-share{ order:2; display:flex; gap:10px; justify-content:flex-start; }
  .author-row--inpost .author-box{ order:1; }
}

/* ==========================================================================
   DESKTOP RESET (≥721px) — desktop intacto
   ========================================================================== */
@media (min-width:721px){
  .site-header{ display:none !important; }          /* desktop usa as topbars */
  .home-topbar__pill{ grid-template-columns:auto 1fr auto; }
  .home-caro{ display:none !important; }
  .header .nav-toggle{ display:none !important; }
}

/* ==========================================================================
   SEARCH OVERLAY (mobile) — estilos base (JS já controla exibição)
   ========================================================================== */
.search-overlay{
  position:fixed; inset:0; z-index:100020;
  background:rgba(14,18,27,.55);
}
.search-overlay[hidden]{ display:none !important; }
.search-overlay__panel{
  position:absolute; left:0; right:0; top:0;
  background:#fff; box-shadow:0 10px 24px rgba(0,0,0,.16);
  padding:16px; display:grid; grid-template-columns:1fr auto; gap:10px; align-items:center;
}
.search-overlay__form{ display:grid; grid-template-columns:1fr auto; gap:8px; }
.search-overlay__form input[type="search"]{
  height:40px; padding:0 12px; border:1px solid #d7e0e6; border-radius:6px; font:400 16px/1.2 system-ui;
}
.search-overlay__form .btn{ height:40px !important; padding:0 16px !important; border-radius:6px !important; }
.search-overlay__close{ appearance:none; background:none; border:0; cursor:pointer; font-size:26px; line-height:1; padding:6px; justify-self:end; }

/* bloqueia scroll quando drawer/overlay abrem */
html.no-scroll, body.no-scroll{ overflow:hidden !important; }


/* =======================================================
   MOBILE FIX — header fixo no topo, hambúrguer OK, cards maiores
   ======================================================= */
@media (max-width:720px){
  :root{ --mhdr-h: 62px; } /* altura do header mobile */

  /* HEADER FIXO NO TOPO */
  .site-header{
    position: fixed !important;
    top: 0 !important; left: 0; right: 0;
    z-index: 1000;
    background:#fff;
    margin-top: 0 !important;
    box-shadow: 0 2px 10px rgba(15,23,42,.06);
  }
  /* compensa a altura do header para o conteúdo não ficar por baixo */
  .site-main{ padding-top: calc(var(--mhdr-h) + 10px); }
  .header .header-inner{
    height: var(--mhdr-h); min-height: var(--mhdr-h);
    grid-template-columns: 1fr;             /* logo central */
    align-items: center;
    border-bottom: 1px solid rgba(15,23,42,.10);
    position: relative;
  }
  .site-header .main-navigation{ display:none !important; } /* sem menu horizontal no mobile */
  .header .site-brand{ justify-self: center; }

  /* HAMBÚRGUER MELHORADO (3 barras visíveis) */
  .header .nav-toggle{
    position: absolute; left: 6px; top: 50%; transform: translateY(-50%);
    display: inline-flex !important;
    flex-direction: column; justify-content: center; align-items: center;
    width: 44px; height: 44px; padding: 0; margin: 0; border: 0;
    background: transparent; color:#0f172a; line-height: 0;
    -webkit-tap-highlight-color: transparent;
    z-index: 2;
  }
  .header .nav-toggle:hover{ background: rgba(15,23,42,.06); border-radius: 8px; }

  .header .nav-toggle-bar{
    display:block;
    width: 26px; height: 2.5px; background: currentColor; border-radius: 2px;
    transition: transform .24s ease, opacity .24s ease;
  }
  /* garante espaçamento mesmo se 'gap' não aplicar */
  .header .nav-toggle-bar + .nav-toggle-bar{ margin-top: 5px; }

  .header .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1){ transform: translateY(7px) rotate(45deg); }
  .header .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2){ opacity:0; }
  .header .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

  /* LUPA à direita — só o ícone */
  .header .header-actions{
    position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
  }
  .header .header-actions .search-field{ display:none !important; }
  .header .header-actions .search-submit{ width:28px; height:28px; background-size:20px 20px; }

  /* CARROSSEL — CARTÕES MAIORES */
  .home-caro{
    grid-auto-columns: clamp(94vw, 96vw, 560px);   /* mais largos */
    gap: 18px;
    padding: 16px 12px 12px;
  }
  .home-caro .tr-card{
    min-height: 440px !important;                  /* mais altos */
    border-radius: 12px;
    background-position: center !important;
    background-size: cover !important;
    scroll-snap-align: start;
  }
  .home-caro .tr-card__copy{
    padding: 22px 18px 18px !important;
    gap: 14px !important;
  }
  .home-caro .tr-card__title{
    font-size: 22px !important;
    line-height: 1.16 !important;
    -webkit-line-clamp: 3 !important;
  }
  .home-caro .tr-card__excerpt{ display:none !important; }
  .home-caro .btn{
    height: 34px !important; padding: 0 16px !important; border-radius: 4px !important;
    box-shadow: none !important;
  }

  /* Lista logo abaixo do carrossel (mantém visual) */
  .rightcol{ grid-column: 1 / -1; display: block !important; }
  .rail{ margin: 8px 8px 0 !important; border-top: 1px solid #e6edf3; }
  .rail__item{ padding: 14px 6px !important; }
}

/* Desktop: normal */
@media (min-width:721px){
  .site-header{ position: static !important; box-shadow: none; }
  .header .nav-toggle{ display:none !important; }
}
/* =======================================================
   MOBILE — RESTAURAR HEADER FIXO + HAMBÚRGUER + CARDS GRANDES
   (colar no FINAL do CSS)
   ======================================================= */
@media (max-width:720px){
  :root{ --mhdr-h: 60px; }                 /* altura do header mobile */

  /* força exibir o header.php no mobile e fixa no topo
     (vence qualquer display:none antigo) */
  .site-header{
    display:block !important;
    position:fixed !important;
    top: var(--adminbar-h, 0) !important;  /* compensa admin bar (32/46px) */
    left:0; right:0;
    background:#fff;
    z-index:10050;
    box-shadow: 0 2px 10px rgba(15,23,42,.06);
    border-bottom: 1px solid rgba(15,23,42,.10);
    margin:0 !important;
  }

  /* conteúdo desce para não ficar por baixo do header */
  .site-main{ padding-top: calc(var(--adminbar-h, 0) + var(--mhdr-h) + 8px) !important; }

  /* layout do header: logo central, ícones nas laterais */
  .header .header-inner{
    height: var(--mhdr-h); min-height: var(--mhdr-h);
    display:grid; grid-template-columns:1fr;
    align-items:center; position:relative;
    border:0;
  }
  .site-header .main-navigation{ display:none !important; } /* sem menu horizontal */
  .header .site-brand, .site-header .logo-wrap{ justify-self:center; }
  .custom-logo{ max-height:24px; }

  /* HAMBÚRGUER (esquerda) */
  .header .nav-toggle{
    position:absolute; left:6px; top:50%; transform:translateY(-50%);
    display:inline-flex !important;
    flex-direction:column; justify-content:center; align-items:center;
    width:44px; height:44px; padding:0; margin:0; border:0; background:transparent;
    color:#0f172a; -webkit-tap-highlight-color:transparent; z-index:2;
  }
  .header .nav-toggle-bar{
    display:block; width:26px; height:2.5px; background:currentColor; border-radius:2px;
    transition: transform .24s ease, opacity .24s ease;
  }
  .header .nav-toggle-bar + .nav-toggle-bar{ margin-top:5px; }
  .header .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1){ transform: translateY(7px) rotate(45deg); }
  .header .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2){ opacity:0; }
  .header .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

  /* LUPA (direita) – só ícone, overlay abre via JS */
  .header .header-actions{
    position:absolute; right:8px; top:50%; transform:translateY(-50%);
  }
  .header .header-actions .search-field{ display:none !important; }
  .header .header-actions .search-submit{ width:28px; height:28px; background-size:20px 20px; }

  /* Carrossel — cartões maiores */
  .home-caro{
    grid-auto-columns: clamp(94vw, 96vw, 560px);
    gap:18px; padding:16px 12px 12px;
    scroll-snap-type:inline mandatory;
  }
  .home-caro .tr-card{
    min-height: 440px !important;
    border-radius:12px;
    background-position:center !important;
    background-size:cover !important;
    scroll-snap-align:start;
  }
  .home-caro .tr-card__copy{ padding:22px 18px 18px !important; gap:14px !important; }
  .home-caro .tr-card__title{ font-size:22px !important; line-height:1.16 !important; -webkit-line-clamp:3 !important; }
  .home-caro .tr-card__excerpt{ display:none !important; }
  .home-caro .btn{ height:34px !important; padding:0 16px !important; border-radius:4px !important; box-shadow:none !important; }

  /* Rail após o carrossel */
  .rightcol{ grid-column:1 / -1; display:block !important; }
  .rail{ margin:8px 8px 0 !important; border-top:1px solid #e6edf3; }
  .rail__item{ padding:14px 6px !important; }

  /* mantém topbars antigas escondidas no mobile */
  .site-topbar, .home-topbar, .post-topbar{ display:none !important; }
}

/* Desktop mantém comportamento anterior */
@media (min-width:721px){
  .site-header{ position: sticky !important; top: 0; box-shadow: none; }
  .header .nav-toggle{ display:none !important; }
}

/* ======= MOBILE PATCH: cards maiores + espaçamento dos ícones ======= */
@media (max-width:720px){

  /* header fixo e com respiro nas bordas (safe area + 14px) */
  :root{ --mhdr-h: 62px; }
  .site-header{
    position: fixed !important;
    top: var(--adminbar-h, 0) !important; left:0; right:0;
    z-index: 1000; background:#fff;
    box-shadow: 0 2px 10px rgba(15,23,42,.06);
    border-bottom: 1px solid rgba(15,23,42,.10);
  }
  .site-main{ padding-top: calc(var(--adminbar-h, 0) + var(--mhdr-h) + 10px) !important; }

  .header .header-inner{ height: var(--mhdr-h); min-height: var(--mhdr-h); grid-template-columns:1fr; }

  /* HAMBÚRGUER E LUPA VISÍVEIS NO MOBILE */
  .header .nav-toggle{
    position: absolute;
    left: calc(14px + env(safe-area-inset-left)) !important;
    top: 50%; transform: translateY(-50%);
    display: inline-flex !important;
    width: 48px; height: 48px;
  }
  .header .header-actions{
    position: absolute;
    right: calc(14px + env(safe-area-inset-right)) !important;
    top: 50%; transform: translateY(-50%);
  }
  .header .nav-toggle-bar{ width: 26px; height: 2.5px; }
  .header .nav-toggle-bar + .nav-toggle-bar{ margin-top: 6px; }

  /* CARROSSEL — cartas grandes, quase tela inteira */
  .home-caro{
    grid-auto-columns: clamp(96vw, 98vw, 620px);
    gap: 20px;
    padding: 18px 14px 14px;
    scroll-snap-type: inline mandatory;
  }
  .home-caro .tr-card{
    min-height: 520px !important;   /* ↑ altura */
    border-radius: 14px;
    background-position: center !important;
    background-size: cover !important;
  }
  .home-caro .tr-card__copy{ padding: 24px 18px 18px !important; gap: 14px !important; }
  .home-caro .tr-card__title{ font-size: 24px !important; line-height: 1.16 !important; -webkit-line-clamp: 3 !important; }
  .home-caro .tr-card__excerpt{ display: none !important; }
  .home-caro .btn{ height: 36px !important; padding: 0 18px !important; border-radius: 6px !important; box-shadow: none !important; }
}

/* === VISIBILIDADE CORRETA DO DRAWER E DA BUSCA ===
   (controlados por [hidden] e pela classe .is-open aplicada no JS) */
:where(.drawer-nav,.drawer-overlay,.search-overlay){ display:block !important; }
:where(.drawer-nav[hidden],.drawer-overlay[hidden],.search-overlay[hidden]){ display:none !important; }

/* Garante que ícones existindo no tema apareçam no mobile */
@media (max-width:720px){
  .header-search-btn{ display:inline-flex !important; }
  .header .nav-toggle{ display:inline-flex !important; }
}
/* MOBILE — aumentar ALTURA dos cards do carrossel */
@media (max-width:720px){
  .home-caro .tr-card{
    /* deixe os cards bem mais altos; ajuste os valores se quiser */
    min-height: clamp(460px, 78vh, 620px) !important;
  }
  .home-caro .tr-card__copy{ padding: 24px 18px 18px !important; gap: 14px !important; }
  .home-caro .tr-card__title{ font-size: 22px !important; line-height: 1.16 !important; -webkit-line-clamp: 3 !important; }
}
/* MOBILE — carrossel mais perto do header e mais estreito */
@media (max-width:720px){

  /* sobe o conteúdo: menos respiro abaixo do header fixo */
  .site-main{
    padding-top: calc(var(--adminbar-h, 0) + var(--mhdr-h) + 4px) !important;
  }
  .home{ margin-top: 6px !important; }

  /* carrossel: trilho mais estreito e colado no topo */
  .home-caro{
    /* ~86% da largura da tela: deixa margem nas laterais e evita corte */
    grid-auto-columns: clamp(82vw, 86vw, 380px);
    gap: 14px;
    padding: 10px 12px 10px;     /* menos altura acima */
    margin: 0 auto 8px;
    /* ajuda o primeiro/último card a não cortar */
    scroll-padding-inline: 12px;
  }

  /* garante que nada “vaze” por causa de bordas/padding */
  .home-caro .tr-card{
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
}
/* MOBILE — encostar mais no header */
@media (max-width:720px){
  /* desce só o necessário pra não ficar por baixo do header */
  .site-main{
    padding-top: calc(var(--adminbar-h, 0) + var(--mhdr-h) + 2px) !important;
  }
  /* quase sem respiro acima da home */
  .home{ margin-top: 2px !important; }

  /* tira um pouco do respiro do trilho do carrossel */
  .home-caro{
    padding-top: 6px !important;
    margin-top: 0 !important;
  }
}

/* MOBILE (<=720px) — "Postagens Recentes" como carrossel menor */
@media (max-width:720px){
  .recent{ margin: 22px 0 28px; }

  .recent__title{
    text-align: left;
    margin: 0 0 10px;
    padding: 0 12px;
  }

  .recent__grid{
    /* vira trilho horizontal */
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: clamp(62vw, 70vw, 320px); /* cartas menores que o carrossel principal */
    gap: 14px;

    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    scroll-padding-inline: 12px;

    padding: 6px 12px 2px;
  }
  .recent__grid::-webkit-scrollbar{ display:none; }
  .recent__grid{ scrollbar-width: none; -ms-overflow-style: none; }

  .recent-card{
    min-height: 190px;              /* menor que no desktop */
    border-radius: 8px;
    scroll-snap-align: start;
  }
  .recent-card__copy{ padding: 12px; gap: 8px; }
  .recent-card__title{ font-size: 15px; line-height: 1.2; -webkit-line-clamp: 2; }
  .recent .btn{
    height: 26px; padding: 0 12px; border-radius: 4px;
    box-shadow: none;
  }
}
/* MOBILE (<=720px) — Postagens Recentes como carrossel compacto */
@media (max-width:720px){
  .recent{ margin: 18px 0 24px; }
  .recent .container{ padding: 0; } /* usa a largura total */

.recent__title{
    text-align: left;
    margin: 0 0 10px;
    padding: 0 12px;                /* respiro lateral */
    font: 800 33px/1.15 'Rubik', system-ui;
  }

  .recent__grid{
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: clamp(62vw, 70vw, 320px); /* largura dos cards */
    gap: 14px;

    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    scroll-padding-inline: 12px;

    padding: 6px 12px 4px;          /* mesmo recuo do título */
  }
  .recent__grid::-webkit-scrollbar{ display:none; }
  .recent__grid{ scrollbar-width: none; -ms-overflow-style: none; }

  .recent-card{
    min-height: 190px;              /* mais baixinho */
    border-radius: 8px;
    scroll-snap-align: start;
  }
  .recent-card__copy{ padding: 12px; gap: 8px; }
  .recent-card__title{
    font-size: 15px; line-height: 1.2;
    -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden;
  }
  .recent-card__excerpt{
    font-size: 12.5px; line-height: 1.35;
    -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden;
  }
  .recent .btn{
    height: 26px; padding: 0 12px; border-radius: 4px;
    box-shadow: none; font: 700 11.5px/1 'Rubik', system-ui;
    justify-self: start;
  }
}
@media (max-width:720px){
  .recent__grid > *{ display:block !important; } /* não esconde o 4º */
  .recent-card{ border-radius:0 !important; }
  .recent .btn{ border-radius:0 !important; }
}
/* RECENT – não esconder o 4º card no mobile */
@media (max-width:720px){
  .recent__grid > * { display:block !important; }
}

/* RECENT – texto mais “em baixo” no mobile */
@media (max-width:720px){
  .recent-card{
    display:grid;               /* força alinhamento de conteúdo ao fundo */
    align-content:end;
  }
  .recent-card__copy{
    padding: 14px 12px 12px;    /* sem “colar” no topo */
  }
}
/* MOBILE (<=720px) — garantir 4 cards visíveis em "Postagens Recentes" */
@media (max-width:720px){
  /* Se alguma regra escondia itens >=4, desfazemos aqui */
  .recent__grid > *{ display:block !important; }
  .recent__grid > *:nth-child(n+4){ display:block !important; }

  /* Mantém carrossel horizontal com 4 itens roláveis */
  .recent__grid{
    display:grid;
    grid-auto-flow: column;
    grid-auto-columns: clamp(62vw, 70vw, 320px);
    gap:14px;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    scroll-snap-type:inline mandatory;
    scroll-padding-inline:12px;
    padding:6px 12px 4px;
  }

  /* Texto mais “lá embaixo” no card */
  .recent-card{
    display:grid;
    align-content:end;
  }
  .recent-card__copy{
    padding:14px 12px 12px;
  }
}
/* === MOBILE — Carrossel do topo SEM radius (cards quadrados) === */
@media (max-width:720px){
  /* card do carrossel */
  .home-caro .tr-card{
    border-radius: 0 !important;
    overflow: hidden;            /* garante cantos “cortados” */
  }
  /* gradiente/overlay do card */
  .home-caro .tr-card::before,
  .home-caro .tr-card::after{
    border-radius: 0 !important;
  }
}
/* === MOBILE (<=720px) — encostar carrossel + linha do header mais evidente
   e cards do carrossel totalmente quadrados =============================== */
@media (max-width:720px){

  /* header com linha mais forte e visível */
  .header .header-inner{
    border-bottom: 2px solid #c7d3db !important;  /* +evidente */
  }

  /* menos espaço abaixo do header (aproxima o carrossel) */
  .site-main{
    /* subtrai ~12px do padding-top atual */
    padding-top: calc(var(--adminbar-h, 0) + var(--mhdr-h) - 50px) !important;
  }
  .home{ margin-top: 0 !important; }
  .home-caro{
    padding-top: 0 !important;
    margin-top: 22px !important;
    scroll-padding-inline: 12px; /* mantém o 1º card sem “corte” */
  }

  /* carrossel do topo sem arredondamento (100% quadrado) */
  .home-caro .tr-card{ border-radius: 0 !important; }
  .home-caro .btn{ border-radius: 0 !important; }
}
/* MOBILE (<=720px) — aumentar fonte da lista (rail) */
@media (max-width:720px){
  .rail__title{
    /* ajuste o 18px se quiser maior/menor */
    font: 800 18px / 1.28 'Rubik', system-ui !important;
  }
}
/* ============ POPULARES (TRENDING) — layout do mock no MOBILE ============ */
@media (max-width:720px){

  /* mostra a seção no mobile */
  .trending{ display:block !important; margin:28px 0 36px !important; }

  /* só a lista (rail); esconde hero/wide/minis */
  .trending .trend-hero,
  .trending .trend-wide,
  .trending .trend-minis{ display:none !important; }

  .trending .trending__grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-areas:"rail" !important;
    gap:16px !important;
  }

  /* cabeçalho */
  .trending__head{ text-align:center; margin:0 0 10px !important; }
  .trending__eyebrow{ margin:0 auto 6px !important; }
  .trending__title{ font:800 22px/1.15 'Rubik',system-ui !important; }

  /* === cartão do rail (foto + degradê + texto à direita) === */
  .trending .trend-rail{ padding:0 12px !important; }
  .trending .trend-rail .rail__item{
    position:relative !important;
    display:block !important;
    min-height:106px !important;
    padding:16px 12px 12px calc(38% + 14px) !important; /* conteúdo à direita */
    margin:10px 0 !important;
    border:1px solid #e6edf3 !important;
    border-radius:4px !important;
    box-shadow:0 8px 16px rgba(0,0,0,.08) !important;

    /* foto por baixo + degradê por cima (claro -> escuro) */
    background:
      linear-gradient(to right, #eef2f5 0 38%, #1f2937 38% 100%) !important,
      var(--thumb, linear-gradient(90deg,#e5e7eb,#cbd5e1)) !important;
    background-repeat:no-repeat !important;
    background-size:100% 100%, cover !important;  /* degradê cobre tudo; imagem preenche */
    background-position:center, center left !important;
  }

  /* tipografia e botão do lado escuro */
  .trending .trend-rail .rail__title{
    color:#fff !important;
    font:800 14px/1.28 'Rubik',system-ui !important;
    margin:0 0 6px !important;
    -webkit-line-clamp:3 !important;
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important; overflow:hidden !important;
  }
  .trending .trend-rail .btn{
    justify-self:start !important;
    height:26px !important; padding:0 12px !important;
    font:700 11px/1 'Rubik',system-ui !important;
    background:#fff !important; color:#0a2230 !important;
    border:1px solid #d7e0e6 !important; border-radius:4px !important; box-shadow:none !important;
  }
}
/* POPULARES (MOBILE <=720px) — rail com foto real à esquerda */
@media (max-width:720px){
  .trending{ display:block !important; margin:28px 0 36px !important; }
  .trending .trend-hero,
  .trending .trend-wide,
  .trending .trend-minis{ display:none !important; }

  .trending .trending__grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-areas:"rail" !important;
    gap:16px !important;
  }

  .trending .trend-rail{ padding:0 12px !important; }
  .trending .trend-rail .rail__item{
    position:relative !important;
    display:block !important;
    min-height:106px !important;
    padding:16px 12px 12px calc(38% + 14px) !important;
    margin:10px 0 !important;
    border:1px solid #e6edf3 !important;
    border-radius:4px !important;
    box-shadow:0 8px 16px rgba(0,0,0,.08) !important;

    /* camadas: (1) faixa escura à direita, (2) thumb à esquerda, (3) base clara */
    background:
      linear-gradient(to right, rgba(0,0,0,0) 0 38%, #1f2937 38% 100%),
      var(--thumb) left center / 38% 100% no-repeat,
      #eef2f5;
  }
  .trending .trend-rail .rail__title{
    color:#fff !important;
    font:800 14px/1.28 'Rubik', system-ui !important;
    margin:0 0 6px !important;
    -webkit-line-clamp:3 !important;
  }
  .trending .trend-rail .btn{
    justify-self:start !important;
    height:26px !important; padding:0 12px !important;
    font:700 11px/1 'Rubik', system-ui !important;
    background:#fff !important; color:#0a2230 !important;
    border:1px solid #d7e0e6 !important; border-radius:4px !important;
    box-shadow:none !important;
  }
}
@media (max-width:720px){
  /* garante título visível na faixa escura */
  .trending .trend-rail .rail__title,
  .trending .trend-rail .rail__title a{
    color:#fff !important;
  }

  /* se suspeitar de clamp escondendo texto, teste assim: */
  /* .trending .trend-rail .rail__title{ -webkit-line-clamp: unset !important; } */
}
@media (max-width:720px){
  /* POPULARES (rail) — força layout com thumb à esquerda + faixa escura */
  .trending .trend-rail .rail__item{
    display:block !important;
    min-height:120px !important;
    padding:16px 12px 12px calc(38% + 14px) !important;
    background:
      linear-gradient(to right, rgba(0,0,0,0) 0 38%, rgba(17,24,39,.90) 38% 100%),
      var(--thumb) left center / 38% 100% no-repeat,
      #eef2f5 !important;
    border:1px solid #e6edf3 !important;
    border-radius:4px !important;
    box-shadow:0 8px 16px rgba(0,0,0,.08) !important;
  }

  /* título branco (e o <a> também) para aparecer na faixa escura */
  .trending .trend-rail .rail__title,
  .trending .trend-rail .rail__title a{
    color:#fff !important;
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:3 !important;
    overflow:hidden !important;
    margin:0 0 6px !important;
  }

  /* botão compacto mantém-se visível */
  .trending .trend-rail .btn{
    height:26px !important; padding:0 12px !important;
    background:#fff !important; color:#0a2230 !important;
    border:1px solid #d7e0e6 !important; border-radius:4px !important;
    box-shadow:none !important;
  }
}
/* VEJA TAMBÉM — mobile (lista simples, sem box) */
@media (max-width:720px){
  /* respiro lateral e título central */
  .more.container{ margin:22px auto 28px; padding:0 12px; }
  .more__title{text-align:center;margin: 0 0 36px;font:800 20px/1.15 'Rubik',system-ui;}

  /* vira lista vertical */
  .more__grid{
    display:grid;
    row-gap:18px;                 /* espaço entre itens */
  }

  /* linha com thumb grande à esquerda */
  .more-card{
    display:grid;
    grid-template-columns: clamp(140px, 42vw, 220px) 1fr;  /* ↑ AQUI a imagem cresce */
    grid-template-rows: auto auto;
    column-gap:12px;
    align-items:start;

    /* remove “caixa” */
    padding:0;
    margin:0;
    background:transparent;
    border:0;
    box-shadow:none;
  }

  /* mini-tag acima do título */
  .more-card__tag{
    grid-column:2;
    margin:2px 0 4px;
    font:700 10px/1 'Rubik',system-ui;
    letter-spacing:.08em; text-transform:uppercase;
    color:#6b7280;
  }

  /* thumb 4:3 maior */
  .more-card__thumb{
    grid-column:1; grid-row:1 / span 2;
    width:100%;
    aspect-ratio:4/3;
    margin:0;
    border-radius:2px;
    background:var(--card-img,#cfd8dc) center/cover no-repeat;
    border:0;
  }

  /* título (2–3 linhas) */
  .more-card__title{
    grid-column:2;
    margin:0;
    font:800 15px/1.25 'Rubik',system-ui;
    display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden;
  }

  /* botão curtinho e escuro, alinhado à esquerda */
  .more .btn{
    grid-column:2;
    justify-self:start;
    height:26px !important;
    padding:0 12px !important;
    margin-top:6px;
    background:#111827 !important;
    color:#fff !important;
    border:1px solid #111827 !important;
    border-radius:4px !important;
    box-shadow:none !important;
    font:700 11px/1 'Rubik',system-ui !important;
  }
}
/* VEJA TAMBÉM — mobile: alinhamento sólido por áreas */
@media (max-width:720px){
  .more__grid{
    display: grid;
    row-gap: 18px;        /* espaçamento entre itens */
  }

  .more-card{
    /* 3 linhas fixas: tag | título | botão
       Thumb ocupa a coluna 1 e “pega” as 3 linhas */
    display: grid;
    grid-template-columns: clamp(160px, 46vw, 240px) 1fr;
    grid-template-rows: auto auto auto;
    grid-template-areas:
      "thumb tag"
      "thumb title"
      "thumb btn";
    column-gap: 12px;
    align-items: start;

    /* remove qualquer resíduo de box do card */
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  /* THUMB fixa (sempre mesma largura e proporção) */
  .more-card__thumb{
    grid-area: thumb;
    width: 100%;
    aspect-ratio: 4 / 3;                  /* todas iguais */
    margin: 0 !important;
    border: 0 !important;
    border-radius: 2px;
    background: var(--card-img,#cfd8dc) center/cover no-repeat !important;
  }

  /* TAG sempre em cima do título (coluna 2) */
  .more-card__tag{
    grid-area: tag;
    margin: 0 0 4px !important;
    font: 700 10px/1 'Rubik',system-ui;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #6b7280;
  }

  /* TÍTULO ocupa a segunda linha da coluna 2 */
  .more-card__title{
    grid-area: title;
    margin: 0 !important;
    font: 800 15px/1.25 'Rubik',system-ui;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
  }

  /* BOTÃO sempre alinhado à esquerda, na 3ª linha */
  .more .btn{
    grid-area: btn;
    justify-self: start;
    align-self: start;
    margin: 6px 0 0 !important;
    height: 26px !important;
    padding: 0 12px !important;
    border-radius: 4px !important;
    background: #111827 !important;
    color: #fff !important;
    border: 1px solid #111827 !important;
    box-shadow: none !important;
    font: 700 11px/1 'Rubik',system-ui !important;
  }
}
/* FOOTER — Categorias centralizadas (mobile) */
@media (max-width:720px){
  /* centraliza título e conteúdo só na caixa de categorias */
  .footer .footer-cats { text-align: center; }

  .footer .footer-cats .footer-title {
    text-align: center;
    margin-bottom: 38px;
  }

  /* grid no centro, 3 colunas iguais e itens alinhados */
  .footer .footer-cats__nav{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    justify-content: center;   /* centraliza o grid */
    justify-items: center;     /* centraliza cada item */
    column-gap: 14px;
    row-gap: 10px;
  }

  .footer .footer-cats__nav li{ padding: 2px 0; }
  .footer .footer-cats__nav a{ text-align:center; }
}
/* ===== FOOTER — Links Relevantes central e com respiro (mobile) ===== */
@media (max-width:720px){
  /* caixa com o título */
  .footer .footer-title{
    text-align:center;
    margin-bottom: 14px;              /* espaço entre título e lista */
  }

  /* a lista de links fica central e com gap maior */
  .footer .footer-links{
    display:grid;
    justify-items:center;
    text-align:center;
    row-gap:10px;                      /* ↑ distância entre os itens */
  }

  /* ===== bloco final do rodapé: logo + copyright empilhados ===== */
  .footer-bottom{
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
  }
  .footer-brandmark img{
    display:block;
    margin: 0 auto 6px;                /* respiro abaixo do logo */
    height: 57px;                      /* opcional: um pouquinho maior */
  }
  .copy{ text-align:center; line-height:1.35; }
}
/* CATEGORY — lista simples no mobile (texto + separadores) */
@media (max-width:720px){
  /* container com respiro lateral */
  .cat-list{ padding: 8px 12px 20px !important; }

  /* grid vira pilha */
  .cat-list__grid{ display:block !important; }

  /* cada item vira uma linha com separador superior */
  .cat-list .wide-card{
    display:block !important;
    padding:12px 0 14px !important;
    margin:0 !important;
    border:0 !important;
    border-top:1px solid #e6edf3 !important;
    box-shadow:none !important;
    background:transparent !important;
  }
  .cat-list .wide-card:first-child{ border-top:0 !important; }

  /* esconde thumb e eyebrow (fica só texto) */
  .cat-list .wide-card__thumb,
  .cat-list .wide-card__eyebrow{ display:none !important; }

  /* zera qualquer padding do bloco de texto */
  .cat-list .wide-card__copy{ padding:0 !important; }

  /* título compacto como no mock */
  .cat-list .wide-card__title{
    margin:0 0 8px !important;
    font:800 13.5px/1.35 'Rubik', system-ui !important;
    color:#0f172a !important;
  }

  /* botão curtinho e alinhado à esquerda */
  .cat-list .wide-card__btn{
    justify-self:start !important;
    height:24px !important;
    padding:0 10px !important;
    margin:0 !important;
    border-radius:4px !important;
    font:700 11px/24px 'Rubik', system-ui !important;
    background:#fff !important;
    border:1px solid #d7e0e6 !important;
    color:#0a2230 !important;
    box-shadow:none !important;
  }
}
/* CATEGORY — Tópico (mobile): cards mais largos */
@media (max-width:720px){
  /* usa a largura total (reduz as “margens” laterais do bloco) */
  .trending{ margin-inline: -12px !important; }
  .trending .container{ padding-inline: 12px !important; }

  /* cartões ocupam 100% da largura útil */
  .trending .trend-rail{ padding-inline: 0 !important; }
  .trending .trend-rail .rail__item{
    width: 100% !important;
    margin-inline: 0 !important;   /* sem recuo lateral extra */
  }
}

/* (opcional) quer ainda mais largo? troque -12px por -16px acima */
/* CATEGORY — Tópico (mobile): pequeno espaçamento nas laterais */
@media (max-width:720px){
  :root{ --topic-gutter: 10px; } /* ajuste 6–12px se quiser */

  .trending{ margin-inline: 0 !important; }
  .trending .container{ padding-inline: var(--topic-gutter) !important; }

  /* garante que os cards fiquem alinhados ao container, sem recuos extras */
  .trending .trend-rail{ padding-inline: 0 !important; }
  .trending .trend-rail .rail__item{
    width: 100% !important;
    margin-inline: 0 !important;
  }
}
/* CATEGORY — títulos maiores só no mobile */
@media (max-width: 720px){
  .trending__title{
    font: 800 37px / 1.15 'Rubik', system-ui !important;
  }
  .trending__eyebrow{
    font-size: 16px !important;     /* antes ~13px */
    padding: 3px 10px !important;    /* leve ajuste pra caber melhor */
    letter-spacing: .08em;           /* mantém o tracking */
  }
}
/* CATEGORY — mobile: mostrar apenas 4 itens na lista */
@media (max-width:720px){
  .cat-list__grid > article:nth-child(n+5){
    display: none !important;
  }
}
/* CATEGORY — mobile: título e botão maiores + fundo cinza */
@media (max-width: 720px) {
  .cat-list .wide-card__title {
    margin: 0 0 8px !important;
    font: 800 19.5px / 1.35 'Rubik', system-ui !important;
    color: #0f172a !important;
  }

  .cat-list .wide-card__btn {
    justify-self: start !important;
    height: 29px !important;
    padding: 0 10px !important;
    margin: 0 !important;
    border-radius: 4px !important;
    font: 700 17px / 27px 'Rubik', system-ui !important;
    background: #fff !important;
    border: 1px solid #d7e0e6 !important;
    color: #0a2230 !important;
    box-shadow: none !important;
  }

}
/* CATEGORY — mobile: título maior + botão com fundo cinza */
@media (max-width: 720px) {
  .cat-list .wide-card__title {
    margin: 0 0 8px !important;
    font: 800 19.5px / 1.35 'Rubik', system-ui !important;
    color: #0f172a !important;
  }

  .cat-list .wide-card__btn {
    justify-self: start !important;
    height: 29px !important;
    padding: 0 10px !important;
    margin: 0 !important;
    border-radius: 4px !important;
    font: 700 17px / 27px 'Rubik', system-ui !important;
    background: #f1f5f9 !important;          /* fundo cinza */
    border: 1px solid #d7e0e6 !important;
    color: #0a2230 !important;
    box-shadow: none !important;
  }
}
 /* BOTÃO sempre alinhado à esquerda, na 3ª linha */
  .more .btn{
    grid-area: btn;
    justify-self: start;
    align-self: start;
    margin: 8px 0 0 !important;
    height: 24px !important;
    padding: 5px 13px !important;
    border-radius: 4px !important;
    background: #111827 !important;
    color: #fff !important;
    border: 1px solid #111827 !important;
    box-shadow: none !important;
    font: 700 11px/1 'Rubik',system-ui !important;
  }
}
/* ================= SINGLE — MOBILE: título & texto central ================= */
@media (max-width:720px){
  .post-main .post-title{
    text-align:center !important;
    font: 800 22px/1.18 'Rubik', system-ui !important;
    margin: 8px 0 10px !important;
  }
  .post-main .entry-content p,
  .post-main .entry-content h2,
  .post-main .entry-content h3{
    text-align:center !important;
  }
}

/* ================= SINGLE — MOBILE: Author box do print =================== */
@media (max-width:720px){
  .author-row--inpost{
    grid-template-columns:1fr !important;
    gap:12px !important;
    justify-items: center !important;
    margin: 18px 0 !important;
  }
  /* Ícones ACIMA do box e centralizados */
  .author-row--inpost .author-share{
    order: 1 !important;
    display:flex !important;
    gap:10px !important;
    justify-content:center !important;
  }
  /* Caixa escura central, avatar central, texto central */
  .author-row--inpost .author-box{
    order: 2 !important;
    grid-template-columns: 1fr !important;
    text-align: center !important;
    width: min(520px, 100%) !important;
    padding: 16px !important;
    background:#0f172a !important;
    color:#e5eef6 !important;
  }
  .author-box__media{ place-items:center !important; }
  .author-box__media img{
    width:80px !important; height:80px !important;
    border-radius:999px !important;
  }
  .author-box__copy{ justify-items:center !important; }
  .author-box__name{ color:#fff !important; }
  .author-box__bio{ color:#cfe1f1 !important; }
}

/* ============= SINGLE — MOBILE: "Veja Também" em lista compacta =========== */
@media (max-width:720px){
  .also--single .also__title{
    text-align:center !important;
    margin: 6px 0 12px !important;
    font: 800 20px/1.15 'Rubik', system-ui !important;
  }
  /* vira lista vertical */
  .also--single .also__grid--mini4{
    display:grid !important;
    grid-template-columns:1fr !important;
    row-gap:14px !important;
    padding: 0 12px !important;
  }
  .also--single .also-mini{
    display:grid !important;
    grid-template-columns: clamp(120px, 36vw, 150px) 1fr !important;
    grid-template-rows: auto auto auto !important;
    grid-template-areas:
      "thumb eyebrow"
      "thumb title"
      "thumb btn";
    column-gap:12px !important;
    align-items:start !important;
    background:transparent !important;
    border:0 !important;
    padding:0 !important;
  }
  .also--single .also-mini__thumb{ grid-area: thumb; }
  .also--single .also-mini__thumb img{
    width:100%; height:90px; object-fit:cover; display:block;
    border-radius:2px;
  }
  .also--single .also-mini__eyebrow{
    grid-area: eyebrow;
    font:700 10px/1 'Rubik',system-ui !important;
    letter-spacing:.08em; text-transform:uppercase;
    color:#6b7280 !important; margin:0 0 4px !important;
  }
  .also--single .also-mini__title{
    grid-area: title;
    margin:0 !important;
    font:800 13.5px/1.28 'Rubik',system-ui !important;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }
  .also--single .also-mini__btn{
    grid-area: btn;
    justify-self:start;
    margin-top:6px;
    height:24px; padding:0 10px;
    border:1px solid #d7e0e6; border-radius:4px;
    background:#fff; color:#0a2230;
    font:700 11px/24px 'Rubik',system-ui;
  }
}
/* SINGLE — FIX: Título centralizado no mobile */
@media (max-width:720px){
  .single .post-wrap .post-main .post-title,
  .single-post .post-wrap .post-main .post-title{
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    /* opcional: limite de largura pra ficar mais equilibrado */
    /* max-width: 30ch; */
  }
}
.author-box__media img{
    width: 118px !important;
    height: 131px !important;
    border-radius:999px !important;
  }
@media (max-width: 720px) {
    .author-row--inpost .author-box {
        order: 2 !important;
        grid-template-columns: 1fr !important;
        text-align: center !important;
        width: min(520px, 77%) !important;
        padding: 16px !important;
        background: #0f172a !important;
        color: #e5eef6 !important;
    }
.also--single .also-mini__thumb img{
    width:100%;
    height: 108px;
    object-fit:cover;
    display:block;
    border-radius:2px;
  }

/* Contato — layout e título */
.page-contact{width:min(100%, var(--hdr-max)); margin:16px auto 24px; padding:0 14px;}
.contact-hero-title{
  display:inline-block; margin:0 auto 18px; padding:10px 16px;
  background:#f3f4f6; border:1px solid #e5e7eb; border-radius:8px;
  text-align:center; font-weight:700;
}
.contact-layout{display:grid; gap:16px; align-items:start;}
@media (min-width: 960px){
  .contact-layout{grid-template-columns: 1fr minmax(320px, 420px);}
}
.contact-copy{font-size:14px; line-height:1.65; color:var(--tx-2,#374151);}
/* CONTATO — garantir que o DESKTOP continue igual */
.page-contact .srx-form input[type="text"],
.page-contact .srx-form input[type="email"],
.page-contact .srx-form textarea{
  display: block;          /* evita ficarem lado a lado */
  width: 100%;             /* preenche a coluna do formulário */
}

/* Desktop: botão normal (não 100%) */
@media (min-width: 721px){
  .page-contact .srx-form button[type="submit"]{
    width: auto !important;
    display: inline-flex !important;
  }
}

/* Mobile: só aqui o botão fica 100% */
@media (max-width: 720px){
  .page-contact .srx-form button[type="submit"]{
    width: 100% !important;
    display: block !important;
  }
}
/* ===== DESKTOP FIX — VEJA TAMBÉM (igual ao mock) ===== */
@media (min-width:721px){
  /* container central, mesmo width das outras seções */
  .more.container{
    width: min(100%, calc(var(--hdr-max) + 20px));
    margin: 44px auto 64px;
    padding: 0 10px;
  }

  /* grid travado em 4 colunas e alinhamentos estáveis */
  .more.container .more__grid{
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 18px !important;
    align-items: start !important;
    justify-items: stretch !important;
    grid-auto-flow: row !important; /* previne herança indesejada */
  }

  /* cartão “limpo”, 4 linhas: tag / thumb / título / botão */
  .more.container .more-card{
    display: grid !important;
    grid-template-rows: auto auto 1fr auto !important;
    gap: 8px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* thumb 4:3 consistente */
  .more.container .more-card__thumb{
    width: 100% !important;
    aspect-ratio: 4 / 3 !important;
    margin: 6px 0 8px !important;
    border: 0 !important;
    border-radius: 2px !important;
    background: var(--card-img,#cfd8dc) center/cover no-repeat !important;
  }

  /* título com 2 linhas (altura fixa p/ alinhar os cards) */
  .more.container .more-card__title{
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
    margin: 0 !important;
    font: 800 14px/1.25 'Rubik',system-ui !important;
    min-height: calc(2 * 1.25em) !important;
  }

  /* botão curto e à esquerda */
  .more.container .btn{
    justify-self: start !important;
    height: 26px !important;
    padding: 0 12px !important;
    border: 1px solid #d7e0e6 !important;
    background: #fff !important;
    color: #0a2230 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font: 700 11px/1 'Rubik',system-ui !important;
  }
}
/* ===== VEJA TAMBÉM — Desktop (4 colunas x 2 fileiras) ===== */
@media (min-width:721px){
  .more.container{
    width: min(100%, calc(var(--hdr-max) + 20px));
    margin: 44px auto 64px;
    padding: 0 10px;
  }
  .more.container .more__grid{
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 18px !important;
    align-items: start !important;
    justify-items: stretch !important;
    grid-auto-flow: row !important;
  }
  /* Segurança: mesmo que venham mais itens, mostra só 8 (2 fileiras) */
  .more.container .more__grid > *:nth-child(n+9){
    display: none !important;
  }
  .more.container .more-card{
    display: grid !important;
    grid-template-rows: auto auto 1fr auto !important; /* tag | thumb | título | botão */
    gap: 8px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .more.container .more-card__thumb{
    width: 100% !important;
    aspect-ratio: 4 / 3 !important;   /* ✅ todas as thumbs iguais */
    margin: 6px 0 8px !important;
    border-radius: 2px !important;
    background: var(--card-img,#cfd8dc) center/cover no-repeat !important;
  }
  .more.container .more-card__title{
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important; /* ✅ 2 linhas */
    overflow: hidden !important;
    margin: 0 !important;
    font: 800 14px/1.25 'Rubik',system-ui !important;
    min-height: calc(2 * 1.25em) !important; /* mantém altura igual */
  }
  .more.container .btn{
    justify-self: start !important;
    height: 26px !important;
    padding: 0 12px !important;
    border: 1px solid #d7e0e6 !important;
    background: #fff !important;
    color: #0a2230 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font: 700 11px/1 'Rubik',system-ui !important;
  }
}
/* ===== VEJA TAMBÉM — Desktop (4 colunas x 2 fileiras) ===== */
@media (min-width:721px){
  .more.container{
    width: min(100%, calc(var(--hdr-max, 1241px) + 20px));
    margin: 44px auto 64px;
    padding: 0 10px;
  }

  .more__title{
    margin: 0 0 18px;
    font: 800 22px/1.15 'Rubik', system-ui;
    color: var(--text, #0f172a);
  }

  .more__grid{
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 18px !important;
    align-items: start !important;
    justify-items: stretch !important;
  }

  /* segurança: mesmo que o WP mande mais, mostramos só 8 */
  .more__grid > *:nth-child(n+9){ display: none !important; }

  .more-card{
    display: grid !important;
    grid-template-rows: auto auto 1fr auto !important; /* tag | thumb | título | botão */
    gap: 8px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .more-card__tag{
    font: 700 10px/1 'Rubik', system-ui;
    letter-spacing: .08em; text-transform: uppercase;
    color: #7b8a96;
  }

  .more-card__thumb{
    width: 100% !important;
    aspect-ratio: 4 / 3 !important;          /* todas as thumbs iguais */
    margin: 6px 0 8px !important;
    border-radius: 2px !important;
    background: var(--card-img,#cfd8dc) center/cover no-repeat !important;
  }

  .more-card__title{
    margin: 0 !important;
    font: 800 14px/1.25 'Rubik', system-ui !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;        /* 2 linhas como no mock */
    overflow: hidden !important;
    min-height: calc(2 * 1.25em) !important; /* alinha os botões */
  }

  .more .btn{
    justify-self: start !important;
    height: 26px !important;
    padding: 0 12px !important;
    border: 1px solid #d7e0e6 !important;
    background: #fff !important;
    color: #0a2230 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font: 700 11px/1 'Rubik', system-ui !important;
  }
}

/* VEJA TAMBÉM — compactar cards no desktop (sem esticar com 1fr) */
@media (min-width:721px){
  .more.container .more__grid{
    grid-template-columns: repeat(4, minmax(0,1fr)) !important;
    gap: 18px !important;
  }
  /* mostra só 8 itens (4x2) */
  .more.container .more__grid > *:nth-child(n+9){ display:none !important; }

  /* card sem 1fr (fica compacto e sem “buraco”) */
  .more.container .more-card{
    display:grid !important;
    grid-template-rows: auto auto auto auto !important; /* tag | thumb | título | botão */
    gap: 8px !important;
  }

  /* mesmo visual do mock */
  .more.container .more-card__thumb{
    width:100% !important; aspect-ratio:4/3 !important;
    margin:6px 0 8px !important; border-radius:2px !important;
    background: var(--card-img,#cfd8dc) center/cover no-repeat !important;
  }
  .more.container .more-card__title{
    font:800 14px/1.25 'Rubik',system-ui !important;
    display:-webkit-box !important; -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important; overflow:hidden !important;
    min-height: calc(2 * 1.25em) !important; /* garante 2 linhas */
  }
  .more.container .btn{
    justify-self:start !important; height:26px !important; padding:0 12px !important;
    border:1px solid #d7e0e6 !important; background:#fff !important; color:#0a2230 !important;
    border-radius:0 !important; box-shadow:none !important; font:700 11px/1 'Rubik',system-ui !important;
  }
}
@media (min-width:721px){
  .home .more.container{ display:none !important; }
}
/* =========================================
   CONTATO (mock print 2) — layout isolado
   ========================================= */

/* container e título */
.page-contact { margin: 16px 0 48px; }
.page-contact .contact-hero-title{
  width: min(100%, var(--hdr-max));
  margin: 10px auto 16px;
  padding: 26px 16px;
  background: #eef2f5;
  border: 1px solid #e2e8f0;
  font: 800 40px/1.1 "Rubik", system-ui;
  color:#0d3340;
}

/* grid texto | formulário */
.page-contact .contact-grid{
  width: min(100%, var(--hdr-max));
  margin: 0 auto;
  padding: 0 10px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  align-items: start;
}
@media (min-width: 980px){
  .page-contact .contact-grid{
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    column-gap: 24px;
  }
}

/* neutraliza qualquer "card" antigo dentro do contato */
.page-contact .card-lite{ width:auto !important; padding:0 !important; background:transparent !important; border:0 !important; box-shadow:none !important; }

/* texto da introdução (esquerda) */
.page-contact .contact-intro{ color:#102238; font:400 16.5px/1.7 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
.page-contact .contact-intro p{ margin:0 0 12px; }

/* formulário (direita) — visual do mock */
.page-contact .contact-form .srx-form{ max-width: 560px; margin: 0; gap: 12px; }
.page-contact .srx-form input[type="text"],
.page-contact .srx-form input[type="email"],
.page-contact .srx-form textarea{
  display:block; width:100%;
  background:#f3f4f6; border:1px solid #e5e7eb; color:#111827;
  border-radius: 6px; height: 40px; padding: 0 12px; font-size:16px;
}
.page-contact .srx-form textarea{ padding:12px 14px; height:auto; min-height: 240px; resize: vertical; }
.page-contact .srx-form input::placeholder,
.page-contact .srx-form textarea::placeholder{ color:#9aa3af; }

/* botão "Enviar" como no mock */
.page-contact .srx-form button[type="submit"]{
  width:auto !important;
  display:inline-flex !important;
  align-items:center; justify-content:center;
  height:40px; padding:0 18px;
  background:#111827; color:#fff; border:0; border-radius:6px; font-weight:700;
}
.page-contact .srx-form button[type="submit"]:hover{ background:#0f172a; }

/* mobile: empilha e botão 100% */
@media (max-width:720px){
  .page-contact .contact-hero-title{ font-size: 24px; }
  .page-contact .srx-form button[type="submit"]{ width:100% !important; }
}
/* ===== CONTATO — FIX FINAL (mata conflitos antigos) ===== */
section.page-contact{
  display:block !important;
  margin:0 !important; padding:0 !important; width:100% !important;
}
section.page-contact .contact-inner{
  width:min(100%, calc(var(--hdr-max,1241px) + 20px)) !important;
  margin:16px auto 24px !important; padding:0 10px !important;
}

/* Título tipo “badge”, centrado – remove o padding 368px antigo */
section.page-contact .contact-hero-title{
  display:block !important;
  width:100% !important; max-width:1100px !important;
  margin:10px auto 18px !important;
  padding:26px 18px !important;            /* << sem 368px nas laterais */
  text-align:center !important;
  background:#eef2f5 !important;
  border:1px solid #e2e8f0 !important;
  color:#0d3340 !important;
  font:800 40px/1.1 "Rubik",system-ui !important;
}

/* Grid texto | formulário */
section.page-contact .contact-layout,
section.page-contact .contact-grid{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:16px !important;
  align-items:start !important;
}
@media (min-width:980px){
  section.page-contact .contact-layout,
  section.page-contact .contact-grid{
    grid-template-columns: minmax(0,1.05fr) minmax(340px,520px) !important;
    column-gap:24px !important;
  }
}

/* Tipografia do texto (esquerda) */
section.page-contact .contact-copy,
section.page-contact .contact-intro{
  color:#102238 !important;
  font:400 16.5px/1.7 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif !important;
}

/* Formulário do plugin (direita) */
section.page-contact .contact-form .srx-form{
  max-width:560px !important; margin:0 !important; gap:12px !important;
}
section.page-contact .srx-form input[type="text"],
section.page-contact .srx-form input[type="email"],
section.page-contact .srx-form textarea{
  width:100% !important;
  background:#f3f4f6 !important;
  border:1px solid #e5e7eb !important;
  border-radius:6px !important;
  color:#111827 !important;
}
section.page-contact .srx-form textarea{ min-height:240px !important; padding:12px 14px !important; }

/* Botão */
section.page-contact .srx-form button{
  width:auto !important; height:40px !important; padding:0 18px !important;
  display:inline-flex !important; align-items:center; justify-content:center;
  background:#111827 !important; color:#fff !important; border:0 !important; border-radius:6px !important;
  font:700 14px/1 system-ui !important;
}
@media (max-width:720px){ section.page-contact .srx-form button{ width:100% !important; } }


/* SINGLE — override duro pra igualar ao global */
.single .post-topbar .nav-toggle{
  display:inline-flex !important;
  flex-direction:column; justify-content:center; align-items:center;
  gap:1px !important;
  width:44px !important; height:44px !important;
  line-height:0 !important; font-size:0 !important; color:#0f172a;
}
.single .post-topbar .nav-toggle .nav-toggle-bar{
  width:22px !important; height:2px !important;
  margin:0 !important; border-radius:2px; background:currentColor !important;
}
/* SINGLE — força o hambúrguer a aparecer na topbar da single */
.single .post-topbar .nav-toggle.nav-toggle.nav-toggle{
  display:inline-flex !important;
  flex-direction:column; justify-content:center; align-items:center;
  gap:1px !important;
  width:44px !important; height:44px !important;
  padding:0 !important; margin:0 !important; border:0 !important; background:transparent !important;
  line-height:0 !important; font-size:0 !important; color:#0f172a !important;
  visibility:visible !important; opacity:1 !important;
}
.single .post-topbar .nav-toggle .nav-toggle-bar{
  display:block !important;
  width:22px !important; height:2px !important; margin:0 !important; border-radius:2px !important;
  background:currentColor !important;
}

/* se algum lugar estiver “matando” geral o .nav-toggle: desfaz só dentro da post-topbar */
.single .post-topbar :is(.nav-toggle, .header-search-btn, .drawer-nav, .drawer-overlay, .search-overlay){
  display:revert-layer !important; /* limpa display:none herdado */
}

/* ===== Header: ícones sem “caixa” colorida ===== */
.site-header,
.header {
  /* dentro do header, zera os tokens de botões para não herdar a cor global */
  --gbtn-bg: transparent;
  --gbtn-bg-hover: transparent;
  --gbtn-bg-active: transparent;
  --gbtn-border: transparent;
  --gbtn-text: currentColor;
}

/* Botões/ícones do header (lupa, hambúrguer etc.) */
.site-header .search-form .search-submit,
.header .search-form .search-submit,
.site-header .menu-toggle,
.header .menu-toggle,
.header [data-drawer-toggle] {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--heading, #222) !important;   /* cor do ícone */
  padding: .25rem !important;
  min-width: auto !important;
  line-height: 1 !important;
}

/* Garante que SVG/ícones usem a cor do texto */
.site-header .search-form .search-submit svg,
.header .search-form .search-submit svg,
.site-header .menu-toggle svg,
.header .menu-toggle svg {
  fill: currentColor !important;
}

/* Hover/Focus: muda só o ícone, sem fundo */
.site-header .search-form .search-submit:hover,
.header .search-form .search-submit:hover,
.site-header .menu-toggle:hover,
.header .menu-toggle:hover,
.header [data-drawer-toggle]:hover {
  color: var(--link-hover, #333) !important;
  background: transparent !important;
}

/* Acessibilidade: foco visível sem “caixa” */
.site-header .search-form .search-submit:focus-visible,
.header .search-form .search-submit:focus-visible,
.site-header .menu-toggle:focus-visible,
.header .menu-toggle:focus-visible,
.header [data-drawer-toggle]:focus-visible {
  outline: 2px solid var(--focus-ring, rgba(0,0,0,.2)) !important;
  outline-offset: 2px !important;
  background: transparent !important;
}
/* ==========================================================
   AUTO-THEME v2 — 1 cor domina o tema (sem mudar o fundo)
   Dirija tudo pela variável:  --brand-primary
   ========================================================== */
:root{
  /* use a cor que quiser no Customizer → Cor Principal */
  --accent: var(--brand-primary);

  /* degraus úteis da cor, SEM tocar no bg do site */
  --accent-50:  color-mix(in srgb, var(--accent) 10%, #fff);
  --accent-100: color-mix(in srgb, var(--accent) 18%, #fff);
  --accent-200: color-mix(in srgb, var(--accent) 28%, #fff);
  --accent-300: color-mix(in srgb, var(--accent) 38%, #fff);
  --accent-400: color-mix(in srgb, var(--accent) 50%, #fff);
  --accent-600: color-mix(in srgb, var(--accent) 86%, #000);
  --accent-700: color-mix(in srgb, var(--accent) 92%, #000);

  /* anel/foco e tokens de botão */
  --ring:   color-mix(in srgb, var(--accent) 45%, transparent);
  --btn-bg: var(--accent-50);
  --btn-bd: var(--accent-200);
  --btn-fg: color-mix(in srgb, var(--accent) 22%, #0a2230);

  /* headings (títulos) puxam levemente para a primária */
  --heading: color-mix(in srgb, var(--accent) 26%, #0d3340);
  --text:    color-mix(in srgb, var(--accent) 14%, #0f172a);
  --ui-border: color-mix(in srgb, var(--accent) 18%, #d7e0e6);
  /* NÃO tocamos em --bg aqui (o fundo do site). */
}

/* ===== LINKS ============================================================= */
a{ color: var(--accent-700); }
a:hover{ color: var(--accent); }

/* ===== BOTÕES GERAIS (inclusive “Ler mais…”) ============================ */
:where(
  .btn,.button,.wp-block-button__link,.more-link,
  .read-more a, a.read-more, .wide-card__btn, .also-mini__btn,
  .trending .btn, .rail .btn, .recent .btn, .more .btn, .pager__btn
){
  background: var(--btn-bg) !important;
  color: var(--btn-fg) !important;
  border-color: var(--btn-bd) !important;
  box-shadow: 0 8px 16px color-mix(in srgb, var(--accent) 14%, transparent) !important;
}
:where(
  .btn,.button,.wp-block-button__link,.more-link,
  .read-more a, a.read-more, .wide-card__btn, .also-mini__btn,
  .trending .btn, .rail .btn, .recent .btn, .more .btn, .pager__btn
):hover{
  border-color: color-mix(in srgb, var(--accent) 30%, var(--btn-bd)) !important;
  transform: translateY(-1px);
}

/* ===== TÍTULOS (várias áreas) =========================================== */
:where(h1,h2,h3,
  .trending__title,.recent__title,.more__title,.footer-title,
  .cat-hero__title,.section--page .legal-hero-title,
  .post-main .post-title
){
  color: var(--heading) !important;
}

/* ===== CAMPOS DE BUSCA/INPUT – foco com a cor =========================== */
:where(.header-actions .search-field,
       .home-topbar__actions .search-field,
       .post-topbar .home-topbar__actions .search-field){
  border-bottom-color: #d8dde3;
}
:where(.header-actions .search-field,
       .home-topbar__actions .search-field,
       .post-topbar .home-topbar__actions .search-field):focus{
  border-bottom-color: var(--accent) !important;
  box-shadow: 0 2px 0 0 var(--accent) inset;
}

/* ===== NEWSLETTER (rodapé) ============================================== */
.footer .srx-form[data-srx-type="newsletter"] input[type="email"]:focus{
  border-color: var(--accent-300) !important;
  box-shadow: 0 0 0 3px var(--ring) !important;
}
.footer .srx-form[data-srx-type="newsletter"] button[type="submit"]{
  background: var(--accent) !important;
  color: #fff !important;
  box-shadow: 0 6px 18px color-mix(in srgb, var(--accent) 28%, transparent) !important;
}
.footer .footer-links a:hover{ color: var(--accent-700); }

/* ===== CONTATO (página) ================================================= */
.page-contact .srx-form input[type="text"],
.page-contact .srx-form input[type="email"],
.page-contact .srx-form textarea{
  border-color: var(--ui-border) !important;
}
.page-contact .srx-form :is(input[type="text"],input[type="email"],textarea):focus{
  border-color: var(--accent-300) !important;
  box-shadow: 0 0 0 3px var(--ring) !important;
}
.page-contact .srx-form button[type="submit"]{
  background: var(--accent) !important;
  color:#fff !important;
  border: 0 !important;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--accent) 28%, transparent) !important;
}
.page-contact .contact-hero-title{
  border-color: color-mix(in srgb, var(--accent) 12%, #e2e8f0) !important;
}

/* ===== PAGINAÇÃO (barra escura) ========================================= */
.pager.pager--bar .pager__nums .current{
  border-color: var(--accent) !important;
  color: var(--accent) !important;
}
.pager.pager--bar a,
.pager.pager--bar .pager__btn{
  color: var(--accent-400) !important;
  border-color: color-mix(in srgb, var(--accent) 16%, #fff) !important;
  /* background: #fff !important; */
}
.pager.pager--bar a:hover,
.pager.pager--bar .pager__btn:hover{
  color: var(--accent-700) !important;
  border-color: var(--accent-300) !important;
}

/* ===== RODAPÉ / CARTÕES / BORDAS ======================================== */
:where(
  .rail .rail__item, .wide-card__thumb img, .post-rail__banner,
  .card, .footer .card, .pager.pager--bar
){
  border-color: var(--ui-border) !important;
}

/* ===== CORES DO “Veja também”, “Populares” etc. ========================= */
.more-card__tag,
.trending__eyebrow{
  background: color-mix(in srgb, var(--accent) 12%, #f1f5f9) !important;
  color: color-mix(in srgb, var(--accent) 46%, #0f172a) !important;
}
.rail__item:hover{ background: color-mix(in srgb, var(--accent) 6%, #f9fbfd) !important; }

/* ===== Ícones do header: só o ícone muda (sem fundo colorido) =========== */
.site-header .search-form .search-submit,
.header .search-form .search-submit,
.site-header .menu-toggle,
.header .menu-toggle,
.header [data-drawer-toggle]{
  color: var(--heading) !important;
}

/* ===== FUNDO: branco por padrão + botão para alternar ===== */
:root{
  --site-bg: #ffffff;        /* fundo padrão */
  --site-tint: #fff3f6;      /* cor do fundo quando ativado (troque se quiser) */
}

/* fundo global SEMPRE vem desta variável */
html, body{ background: var(--site-bg) !important; }

/* se o WP aplicar 'Custom Background', anulamos */
body.custom-background{
  background-color: var(--site-bg) !important;
  background-image: none !important;
}

/* não deixe wrappers pintarem o fundo */
.site, .site-content, .site-main, .site-container{
  background: transparent !important;
}

/* quando o botão estiver ativo, colocamos a classe 'tinted' no <html> */
html.tinted{ --site-bg: var(--site-tint); }

/* ===== Botão “Fundo” (aparece no header, discreto) ===== */
.bg-toggle{
  appearance:none; border:1px solid var(--btn-bd, #d7e0e6);
  background: var(--btn-bg, #f7f9fb); color: var(--btn-fg, #0a2230);
  font:700 12px/1 'Rubik', system-ui; padding:6px 10px; border-radius:6px;
  cursor:pointer; margin-left:8px;
}
.bg-toggle.is-on{ border-color: color-mix(in srgb, var(--accent, #034872) 35%, #d7e0e6); }

/* mobile: botão não estoura */
@media (max-width:720px){ .bg-toggle{ padding:6px 10px; } }

/* ===== Correções do print: títulos/links que ficavam vermelhos ===== */
:where(.rail__title a,
       .trend-rail .rail__title a,
       .more-card__title a,
       .wide-card__title a,
       .post-rail .rail-item__title a){
  color: var(--text) !important;         /* usa seu texto padrão */
}
:where(.rail__item:hover .rail__title a,
       .more-card__title a:hover,
       .wide-card__title a:hover,
       .post-rail .rail-item:hover .rail-item__title a){
  color: var(--accent-700, #034872) !important;
}
    /* Footer (sem fundo) + cores dinâmicas */
    .footer{ background: transparent !important; color: var(--footer-fg) !important; }

    .footer .footer-title{ color: var(--footer-heading) !important; }
    .footer .site-footer__brand-desc,
    .footer .footer-sub,
    .footer .footer-note,
    .footer .copy{ color: var(--footer-fg) !important; }

    .footer .footer-links a,
    .footer .footer-cats__nav a{ color: var(--footer-link) !important; }
    .footer .footer-links a:hover,
    .footer .footer-cats__nav a:hover{ color: var(--footer-link-hov) !important; }

    /* “quadrados” do rodapé (cards) continuam configuráveis no Customizer) */
    .footer :where(.footer-top .card,.footer-mid .card,.footer-bottom .card,.footer .card){
      background: var(--footer-card-bg) !important;
      border-color: var(--footer-card-bd) !important;
      color: inherit !important;
    }
/* === FIX: links/títulos que ficaram verdes (rail, trending, veja também, etc.) === */
:where(
  .trend-rail .rail__title a,
  .rail .rail__title a,
  .more-card__title a,
  .also-mini__title a,
  .wide-card__title a,
  .post-rail .rail-item__title a
){
  color: var(--text) !important;
}
:where(
  .trend-rail .rail__title a:hover,
  .rail .rail__title a:hover,
  .more-card__title a:hover,
  .also-mini__title a:hover,
  .wide-card__title a:hover,
  .post-rail .rail-item__title a:hover
){
  color: var(--accent-700) !important;
}

/* Evita herdar a cor de link global dentro desses blocos */
:where(.trending,.recent,.more,.cat-list,.post-rail,.also) a{ color: inherit; }

/* === FIX: badges/eyebrows (“TENDÊNCIAS”, etc.) voltam ao cinza === */
:where(.more-card__tag,.also-mini__eyebrow,.wide-card__eyebrow,.trending__eyebrow){
  background:#f1f5f9 !important;
  color:#6b7280 !important;
}

/* === FIX: título da seção “Veja também” (single) sem fundo/linha colorida === */
#also-title-single.also__title,
.also .also__title{
  color: var(--text) !important;
  background: transparent !important;
  border: 0 !important;
}

/* === FIX: “Ler mais” mantém branco + texto escuro (sem verde) === */
:where(
  .btn,.button,.wp-block-button__link,.more-link,
  .read-more a, a.read-more, .wide-card__btn, .also-mini__btn,
  .trending .btn, .rail .btn, .recent .btn, .more .btn, .pager__btn
){
  background:#fff !important;
  color:#0a2230 !important;
  border:1px solid #d7e0e6 !important;
  box-shadow:none !important;
}
/* 1) Hover dos títulos clicáveis (aplica a cor só na interação) */
:where(
  .trend-rail .rail__title a,
  .rail .rail__title a,
  .more-card__title a,
  .wide-card__title a,
  .post-rail .rail-item__title a
):hover{
  color: var(--accent-700) !important;
}

/* 2) Links no corpo do texto (artigos e páginas) */
.post-main .entry-content a,
.section--page .article-body a{
  color: var(--accent-700);
  text-decoration: underline;
}
.post-main .entry-content a:hover,
.section--page .article-body a:hover{
  color: var(--accent);
}

/* 3) Foco/realce de campos (busca, contato, newsletter) */
:where(
  .header-actions .search-field,
  .home-topbar__actions .search-field,
  .post-topbar .home-topbar__actions .search-field,
  .footer .srx-form[data-srx-type="newsletter"] input[type="email"],
  .page-contact .srx-form :is(input[type="text"], input[type="email"], textarea)
):focus{
  border-color: var(--accent-300) !important;
  box-shadow: 0 0 0 3px var(--ring) !important;
}

/* 4) CTAs reais (Enviar) usam a cor cheia */
.footer .srx-form[data-srx-type="newsletter"] button[type="submit"],
.page-contact .srx-form button[type="submit"]{
  background: var(--accent) !important;
  color:#fff !important;
}

/* 5) Paginação: número ativo e botões com o tom da marca */
.pager.pager--bar .pager__nums .current{
  border-color: var(--accent) !important;
  color: var(--accent) !important;
}
.pager.pager--bar .pager__btn:hover{
  color: var(--accent-700) !important;
  border-color: var(--accent-300) !important;
}
/* 1) Hover dos títulos clicáveis (aplica a cor só na interação) */
:where(
  .trend-rail .rail__title a,
  .rail .rail__title a,
  .more-card__title a,
  .wide-card__title a,
  .post-rail .rail-item__title a
):hover{
  color: var(--accent-700) !important;
}

/* 2) Links no corpo do texto (artigos e páginas) */
.post-main .entry-content a,
.section--page .article-body a{
  color: var(--accent-700);
  text-decoration: underline;
}
.post-main .entry-content a:hover,
.section--page .article-body a:hover{
  color: var(--accent);
}

/* 3) Foco/realce de campos (busca, contato, newsletter) */
:where(
  .header-actions .search-field,
  .home-topbar__actions .search-field,
  .post-topbar .home-topbar__actions .search-field,
  .footer .srx-form[data-srx-type="newsletter"] input[type="email"],
  .page-contact .srx-form :is(input[type="text"], input[type="email"], textarea)
):focus{
  border-color: var(--accent-300) !important;
  box-shadow: 0 0 0 3px var(--ring) !important;
}

/* 4) CTAs reais (Enviar) usam a cor cheia */
.footer .srx-form[data-srx-type="newsletter"] button[type="submit"],
.page-contact .srx-form button[type="submit"]{
  background: var(--accent) !important;
  color:#fff !important;
}

/* 5) Paginação: número ativo e botões com o tom da marca */
.pager.pager--bar .pager__nums .current{
  border-color: var(--accent) !important;
  color: var(--accent) !important;
}
.pager.pager--bar .pager__btn:hover{
  color: var(--accent-700) !important;
  border-color: var(--accent-300) !important;
}
/* Esconde o rail no mobile e colapsa o grid */
@media (max-width: 720px){
  /* 1) some com o rail */
  aside.post-rail,
  .post-rail { 
    display: none !important;
  }

  /* 2) garante que a área principal ocupe 100% */
  .post-wrap,
  .main.site-main,
  .single .post-wrap,
  .single-post .post-wrap {
    grid-template-columns: 1fr !important;
    grid-template-areas: "main" !important;
  }
}
/* Author Card — centralizado apenas no mobile */
@media (max-width: 720px){
  .author-card{
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;

    /* ajuda a centralizar qualquer conteúdo interno */
    display: grid !important;
    justify-items: center !important;
    align-items: center !important;

    /* opcional: limite de largura no mobile */
    width: min(100%, 520px) !important;
  }

  /* garante avatar e ícones centralizados */
  .author-card img{ margin: 0 auto !important; display:block !important; }
  .author-card .author-social,
  .author-card .social,
  .author-card .author-actions{
    display:flex !important;
    justify-content:center !important;
  }
}
/* --- Trek CTA: garantir visual no tema --- */
.entry-content .trek-cta-wrap{
  display:flex; flex-direction:column; gap:12px;
  margin:16px 0;
}

.entry-content a.trek-cta-btn{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 14px; border-radius:12px;
  background: var(--cta-bg, #111827) !important;
  color: var(--cta-fg, #fff) !important;
  text-decoration:none !important;
  border: 0 !important;
  box-shadow: 0 8px 16px rgba(0,0,0,.08);
}

.entry-content .trek-cta-btn .trek-cta-left{display:flex; align-items:center; gap:8px;}
.entry-content .trek-cta-btn .trek-cta-emoji{line-height:1;}
.entry-content .trek-cta-btn .trek-cta-arrow{margin-left:8px;}

/* Se algum contêiner pintar links, garanta a cor do texto do botão */
.entry-content .trek-cta-wrap a{ color: var(--cta-fg, #fff) !important; }

/* Em listas/rails/sections onde há muitos !important no tema */
.trending .trek-cta-btn,
.rail .trek-cta-btn,
.more .trek-cta-btn{ 
  background: var(--cta-bg, #111827) !important;
  color: var(--cta-fg, #fff) !important;
}
/* === MOBILE: garantir que o drawer fique ACIMA do overlay === */
@media (max-width:720px){
  /* overlay abaixo do header/drawer */
  .drawer-overlay,
  #drawer-overlay,
  #drawer-backdrop{
    z-index: 10000 !important;   /* backdrop */
  }

  .site-header{
    z-index: 10020 !important;   /* header vira o “container” do drawer */
  }

  .drawer-nav{
    z-index: 10030 !important;   /* o próprio drawer acima de tudo */
  }
}

/* === Drawer: X mais baixo e com área de clique maior === */
.drawer-head{
  min-height: 56px;              /* cria uma barra de topo confortável */
  align-items: center;
  padding: 38px 41px;            /* tira o X da borda superior */
}
.drawer-close{
  width: 36px; height: 36px;     /* hit-area boa pra dedo */
  border-radius: 6px;
  position: relative;
  top: 4px;                      /* ajuste fino: desce ~4–8px se quiser */
}
/* MOBILE — garantir que o drawer fique por cima do véu e clicável */
@media (max-width:720px){
  .drawer-nav{ z-index: 100050 !important; }
  #drawer-overlay, .drawer-overlay{ z-index: 100040 !important; }
}

/* MOBILE — baixar o “X” e aumentar área de clique */
@media (max-width:720px){
  .drawer-head{
    min-height: 56px;               /* altura da faixa do topo */
    align-items: center;             /* centraliza verticalmente */
    padding: 12px 16px !important;
  }
  .drawer-close{
    width: 40px; height: 40px;
    line-height: 1;
    font-size: 28px;
    margin-top: 4px;                 /* desce um pouquinho */
  }
}

/* MOBILE — ícone da busca aparece (seu HTML já tem o botão) */
@media (max-width:720px){
  .header-search-btn{ display:inline-flex !important; align-items:center; justify-content:center; }
}
/* MOBILE — mostrar só a lupa custom e esconder o botão do form */
@media (max-width:720px){
  /* esconde o submit do form padrão */
  .header .header-actions .search-submit{
    display: none !important;
  }
  .header .header-actions .search-field{
    display: none !important; /* já estava, reforço */
  }
  /* posiciona a área da lupa à direita */
  .header .header-actions{
    position: absolute;
    right: 8px; top: 50%;
    transform: translateY(-50%);
    display: flex; align-items: center;
  }
  /* estilo da nossa lupa */
  .header-search-btn{
    display: inline-flex !important;
    align-items: center; justify-content: center;
    width: 40px; height: 40px;
    padding: 0; border: 0; background: transparent !important;
    box-shadow: none !important;
    border-radius: 8px;
  }
  .header-search-btn:hover{ background: rgba(15,23,42,.06); }
  .header-search-btn svg{ width: 22px; height: 22px; display:block; }
}
/* === FIX: badges/eyebrows (“TENDÊNCIAS”, etc.) voltam ao cinza === */
:where(.more-card__tag,.also-mini__eyebrow,.wide-card__eyebrow,.trending__eyebrow){
  /* background:#f1f5f9 !important; */
  color:#6b7280 !important;
}
/* ===== Footer — centralizar o “bloco da marca” (logo + frase) ===== */
.footer .card:has(.footer-brand){
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Garante que o logo do site (custom-logo) fique centralizado dentro do mesmo card */
.footer .card:has(.footer-brand) .custom-logo-link,
.footer .card:has(.footer-brand) img.custom-logo{
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* Espaçamentos e legibilidade do texto */
.footer .footer-brand{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.footer .footer-brand__desc{
  margin: 0;
}
.footer .footer-brand__copy{
  margin: 4px 0 0 0;
  opacity: .9;
}
/* ====== Centralizar + proteção contra textos longos no rodapé ====== */
.footer .card:has(.footer-brand){
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden; /* evita “vazar” pra fora do card */
}

/* garante centralização do logo */
.footer .card:has(.footer-brand) .custom-logo-link,
.footer .card:has(.footer-brand) img.custom-logo{
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* container do texto com largura controlada */
.footer .footer-brand{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  max-width: clamp(260px, 60ch, 520px); /* limita a largura do texto */
  margin-inline: auto;
}

/* Descrição: quebra palavras longas e corta em 2–3 linhas com reticências */
.footer .footer-brand__desc{
  margin: 0;
  overflow-wrap: anywhere;  /* quebra sequências sem espaço */
  word-break: break-word;
  hyphens: auto;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;    /* desktop: até 2 linhas */
  line-clamp: 2;
  overflow: hidden;
}

/* “Nome — Ano”: mantém em uma linha com reticências se necessário */
.footer .footer-brand__copy{
  margin: 4px 0 0 0;
  opacity: .9;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* no mobile, deixo a descrição com até 3 linhas */
@media (max-width: 640px){
  .footer .footer-brand__desc{ -webkit-line-clamp: 3; line-clamp: 3; }
}
/* ===== Rodapé: centralização + proteção contra textos longos ===== */
.footer .footer-brand{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:6px;
  max-width:min(60ch, 520px);
  margin: 8px auto 0;
}

/* garante logo centralizada quando está no mesmo card */
.footer .custom-logo,
.footer .custom-logo-link{ display:block; margin-left:auto; margin-right:auto; }

/* descrição: quebra palavras enormes e limita linhas */
.footer .footer-brand__desc{
  margin:0;
  overflow-wrap:anywhere;
  word-break:break-word;
  hyphens:auto;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2; /* desktop: 2 linhas */
  line-clamp:2;
  overflow:hidden;
}

/* linha de baixo: uma linha com reticências */
.footer .footer-brand__copy{
  margin:4px 0 0 0;
  opacity:.9;
  max-width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* no mobile, deixo a descrição com até 3 linhas */
@media (max-width:640px){
  .footer .footer-brand__desc{ -webkit-line-clamp:3; line-clamp:3; }
}
/* ===== CATEGORY — DESKTOP: mostrar o hambúrguer na topbar ================ */
@media (min-width:721px){

/* SINGLE — mostrar topbar + hambúrguer no mobile */
@media (max-width:720px){
  /* não esconda a topbar da single */
  .site-topbar, .home-topbar{ display:none !important; }
  .single .post-topbar{ display:block !important; }
}

/* SINGLE — neutraliza qualquer kill anterior do nav-toggle e cia */
.single .post-topbar :is(.nav-toggle, .header-search-btn, .drawer-nav, .drawer-overlay, .search-overlay){
  display:revert-layer !important;
}

/* SINGLE — estilo do hambúrguer na topbar */
.single .post-topbar .nav-toggle{
  display:inline-flex !important;
  flex-direction:column; justify-content:center; align-items:center;
  width:44px; height:44px; padding:0; margin:0; border:0; background:transparent;
  color:#0f172a !important; line-height:0; font-size:0;
}
.single .post-topbar .nav-toggle .nav-toggle-bar{
  display:block; width:22px; height:2px; margin:1px 0; border-radius:2px; background:currentColor;
}