/* article.css — estilo dos artigos do blog (marca Leandro Ceretti) */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root{
  --azul:#0D1B2A; --azul2:#122030; --dourado:#B8966E; --creme:#F5F0E8;
  --creme2:#EAE5DD; --cobre:#8B4A2F; --preto:#1A1A18; --verde:#1E6B43; --cinza:#6b6b6b;
}
html{ scroll-behavior:smooth; }
body{ font-family:'DM Sans',sans-serif; background:var(--creme); color:var(--preto); line-height:1.75; -webkit-font-smoothing:antialiased; }
a{ color:var(--cobre); text-decoration:underline; text-underline-offset:2px; }
a:hover{ opacity:.85; }
img{ max-width:100%; display:block; }

/* NAV */
.nav{ position:sticky; top:0; z-index:50; background:rgba(13,27,42,.97); backdrop-filter:blur(8px);
  padding:.85rem 1.5rem; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(184,150,110,.18); }
.nav-brand{ font-family:'Cormorant Garamond',serif; font-size:1.05rem; color:var(--creme); text-decoration:none; }
.nav-brand span{ color:var(--dourado); }
.nav-cta{ background:var(--dourado); color:var(--azul); padding:.5rem 1.1rem; border-radius:2px;
  font-size:.76rem; font-weight:600; letter-spacing:.04em; text-decoration:none; }

/* WRAP */
.wrap{ max-width:720px; margin:0 auto; padding:0 1.5rem; }
.crumbs{ font-size:.74rem; color:var(--cinza); margin:1.75rem 0 .5rem; letter-spacing:.02em; }
.crumbs a{ color:var(--cinza); }
.eyebrow{ font-size:.7rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--cobre); display:block; margin:2.25rem 0 .9rem; }

h1.title{ font-family:'Cormorant Garamond',serif; font-weight:600; color:var(--azul);
  font-size:clamp(1.9rem,5vw,2.9rem); line-height:1.15; margin-bottom:1rem; }
.meta{ font-size:.8rem; color:var(--cinza); margin-bottom:1.5rem; display:flex; gap:.6rem; flex-wrap:wrap; align-items:center; }
.meta .dot{ opacity:.5; }
.lede{ font-size:1.12rem; font-weight:300; color:var(--preto); line-height:1.7; margin-bottom:2rem;
  padding-bottom:2rem; border-bottom:1px solid var(--creme2); }

article h2{ font-family:'Cormorant Garamond',serif; font-weight:600; color:var(--azul);
  font-size:clamp(1.45rem,3.5vw,2rem); line-height:1.25; margin:2.5rem 0 1rem; }
article h3{ font-size:1.1rem; font-weight:600; color:var(--azul); margin:1.75rem 0 .6rem; }
article p{ margin-bottom:1.15rem; font-size:1.02rem; }
article ul, article ol{ margin:0 0 1.3rem 1.3rem; }
article li{ margin-bottom:.55rem; font-size:1.02rem; }
article strong{ color:var(--azul); }

/* CAIXA RESPOSTA DIRETA */
.answer{ background:#fff; border-left:3px solid var(--dourado); padding:1.25rem 1.5rem; margin:1.75rem 0;
  border-radius:0 4px 4px 0; box-shadow:0 1px 3px rgba(13,27,42,.06); }
.answer p{ margin:0; font-size:1.04rem; }
.answer .q{ font-weight:600; color:var(--azul); display:block; margin-bottom:.5rem; }

/* DESTAQUE */
.callout{ background:var(--azul); color:var(--creme); padding:1.5rem 1.6rem; border-radius:5px; margin:2rem 0; }
.callout p{ margin:0; color:rgba(245,240,232,.9); font-size:1rem; }
.callout strong{ color:var(--dourado); }

/* TABELA */
.tbl-wrap{ overflow-x:auto; margin:1.5rem 0; }
table{ width:100%; border-collapse:collapse; font-size:.92rem; background:#fff; border-radius:5px; overflow:hidden; }
th, td{ padding:.75rem .9rem; text-align:left; border-bottom:1px solid var(--creme2); vertical-align:top; }
th{ background:var(--azul); color:var(--creme); font-weight:600; font-size:.82rem; letter-spacing:.02em; }
tbody tr:last-child td{ border-bottom:none; }

/* CTA */
.cta{ background:linear-gradient(135deg,var(--azul),var(--azul2)); color:var(--creme);
  padding:2.25rem 1.75rem; border-radius:8px; margin:2.75rem 0; text-align:center; }
.cta .tag{ font-size:.68rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--dourado); display:block; margin-bottom:.75rem; }
.cta h3{ font-family:'Cormorant Garamond',serif; font-size:1.5rem; color:var(--creme); margin-bottom:.6rem; }
.cta p{ font-size:.92rem; color:rgba(245,240,232,.72); margin-bottom:1.4rem; font-weight:300; }
.cta a.btn{ display:inline-block; background:var(--dourado); color:var(--azul); font-weight:600;
  padding:.85rem 2rem; border-radius:3px; text-decoration:none; letter-spacing:.03em; font-size:.92rem; }
.cta a.btn:hover{ opacity:.92; }

/* FAQ */
.faq{ margin:2.5rem 0; }
.faq h2{ margin-bottom:1.25rem; }
.faq-item{ border-bottom:1px solid var(--creme2); padding:1.1rem 0; }
.faq-item .fq{ font-weight:600; color:var(--azul); margin-bottom:.4rem; font-size:1.02rem; }
.faq-item .fa{ font-size:.98rem; color:var(--preto); margin:0; }

/* AUTOR */
.author{ display:flex; gap:1rem; align-items:flex-start; background:#fff; border:1px solid var(--creme2);
  border-radius:8px; padding:1.4rem; margin:2.5rem 0; }
.author img{ width:64px; height:64px; border-radius:50%; object-fit:cover; flex-shrink:0; }
.author .a-name{ font-weight:600; color:var(--azul); }
.author .a-role{ font-size:.82rem; color:var(--cinza); margin:.15rem 0 .5rem; }
.author .a-bio{ font-size:.9rem; color:var(--preto); margin:0; }

/* LINKS INTERNOS */
.related{ background:var(--creme2); border-radius:8px; padding:1.4rem 1.6rem; margin:2.5rem 0; }
.related .r-tag{ font-size:.68rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--cobre); display:block; margin-bottom:.8rem; }
.related ul{ margin:0; list-style:none; }
.related li{ margin-bottom:.55rem; font-size:.96rem; }

/* FIGURAS / IMAGENS */
.fig{ margin:1.75rem 0; }
.fig svg{ width:100%; height:auto; display:block; border-radius:8px; }
.fig figcaption{ font-size:.78rem; color:var(--cinza); margin-top:.55rem; text-align:center; line-height:1.5; }

/* CAIXA DE ACOLHIMENTO (CVV / apoio) */
.care{ background:#fff; border:1px solid var(--creme2); border-left:4px solid var(--verde);
  border-radius:0 6px 6px 0; padding:1.2rem 1.4rem; margin:2rem 0; }
.care strong{ color:var(--verde); }
.care p{ margin:0; font-size:.95rem; color:var(--preto); }

/* DISCLAIMER + FOOTER */
.legal{ font-size:.78rem; color:var(--cinza); line-height:1.7; border-top:1px solid var(--creme2);
  padding-top:1.5rem; margin-top:2.5rem; }
footer{ background:var(--azul); color:rgba(245,240,232,.7); text-align:center; padding:2.5rem 1.5rem; margin-top:3rem; }
footer .f-nome{ font-family:'Cormorant Garamond',serif; font-size:1.3rem; color:var(--creme); display:block; margin-bottom:.4rem; }
footer .f-sub{ font-size:.78rem; display:block; margin-bottom:1rem; }
footer a{ color:var(--dourado); margin:0 .5rem; font-size:.82rem; }
