/* Revvo — base do tema.
   O design aprovado (handoff 10a/12a–d/8a/8b) usa estilos inline para fidelidade 1:1;
   este arquivo cobre só o que o inline não alcança: base, tipografia do conteúdo
   Ghost (.gh-content), estados dos forms de Members e responsividade. */

/* ---------- Base ---------- */
:root {
  --gh-font-heading: Sora, sans-serif;
  --gh-font-body: Onest, sans-serif;
}
body {
  margin: 0;
  background: #fff;
  font-family: var(--gh-font-body, Onest, sans-serif);
  color: #131E2E;
}
a { color: #1D518C; }
a:hover { color: #162D60; }
input { box-sizing: border-box; }
button { font-family: inherit; }
img { max-width: 100%; }

/* ---------- Conteúdo dos posts (Koenig) ---------- */
.rv-prose {
  font: 400 16.5px/1.75 Onest, sans-serif;
  color: #2A3A4F;
}
.rv-prose h2, .rv-prose h3, .rv-prose h4 {
  font-family: var(--gh-font-heading, Sora, sans-serif);
  color: #131E2E;
  letter-spacing: -0.02em;
  line-height: 1.25;
  margin: 2em 0 0.6em;
}
.rv-prose h2 { font-size: 26px; }
.rv-prose h3 { font-size: 21px; }
.rv-prose h4 { font-size: 17px; }
.rv-prose p { margin: 0 0 1.4em; }
.rv-prose ul, .rv-prose ol { margin: 0 0 1.4em; padding-left: 1.4em; }
.rv-prose li { margin-bottom: 0.5em; }
.rv-prose blockquote {
  margin: 1.6em 0;
  padding: 4px 0 4px 20px;
  border-left: 3px solid #21DDAE;
  color: #44566B;
  font-style: normal;
}
.rv-prose hr { border: 0; border-top: 1px solid #E2E8F2; margin: 2.4em 0; }
.rv-prose figure { margin: 2em 0; }
.rv-prose figcaption { font: 400 13px/1.5 Onest, sans-serif; color: #6B7C90; text-align: center; margin-top: 10px; }
.rv-prose img, .rv-prose video { border-radius: 12px; }
.rv-prose pre {
  background: #0E1E45;
  color: #DCE9F6;
  border-radius: 12px;
  padding: 18px 20px;
  overflow-x: auto;
  font: 500 13.5px/1.6 'IBM Plex Mono', monospace;
}
.rv-prose code { font: 500 0.9em 'IBM Plex Mono', monospace; background: #EEF2F8; border-radius: 5px; padding: 1px 6px; }
.rv-prose pre code { background: none; padding: 0; }
.rv-prose .kg-embed-card iframe { width: 100%; }
.rv-prose .kg-image-card img { width: 100%; }
.rv-prose .kg-width-wide { position: relative; width: min(920px, calc(100vw - 48px)); margin-left: 50%; transform: translateX(-50%); }
.rv-prose .kg-width-full { position: relative; width: calc(100vw - 48px); margin-left: 50%; transform: translateX(-50%); }

/* ---------- Formulários Ghost Members ---------- */
.rv-members-form.loading button { opacity: 0.6; pointer-events: none; }
.rv-members-form .rv-form-success,
.rv-members-form .rv-form-error { display: none; }
.rv-members-form.success .rv-form-success { display: block; }
.rv-members-form.success input,
.rv-members-form.success button { display: none; }
.rv-members-form.error .rv-form-error { display: block; }

/* ---------- Quiz de diagnóstico ---------- */
.rv-quiz-option { transition: border-color 0.15s, background 0.15s; }
.rv-quiz-option:hover { border-color: #1D518C !important; background: #F6F8FB !important; }
.rv-quiz-option[aria-pressed="true"] { border-color: #162D60 !important; background: #DCE9F6 !important; }

/* ---------- Responsividade ----------
   O layout aprovado é desktop-first com grids inline; abaixo de 900px
   as classes rv-* colapsam os grids para uma coluna. */
@media (max-width: 900px) {
  .rv-pad { padding-left: 24px !important; padding-right: 24px !important; }
  .rv-grid-2, .rv-grid-3, .rv-grid-4 { display: grid !important; grid-template-columns: 1fr !important; }
  .rv-grid-4[style*="display:flex"], .rv-grid-4[style*="display: flex"] { display: grid !important; }
  .rv-grid-5 { grid-template-columns: 1fr 1fr !important; row-gap: 28px; }
  .rv-timeline-track { display: none; }
  .rv-nav-links { display: none !important; }
  .rv-stack-sm { flex-direction: column !important; align-items: flex-start !important; }
  h1 { font-size: 34px !important; }
}
