/* ============================================================
   NÚCLEO7 — CENTRAL DE CONTEÚDO
   Mesma identidade da LP, layout de leitura.
   ============================================================ */
:root{
  --laranja:#FF7000; --laranja-escuro:#D14E00; --laranja-claro:#FF9A3D;
  --preto:#0A0A0A; --branco:#FFFFFF;
  --tinta:#101010; --tinta-2:#54504B; --tinta-3:#837D76;
  --linha:#E9E4DD; --superficie:#FFFFFF; --superficie-2:#F8F6F3; --superficie-3:#FFF1E4;
  --escuro:#0A0A0A;
  --grad: linear-gradient(135deg, #12100E 0%, #5A2000 45%, #A83A00 100%);
  --grad-cta: linear-gradient(135deg, #FF7000 0%, #C0450A 100%);
  --r:16px; --r-lg:24px; --r-xl:32px;
  --sombra: 0 1px 2px rgba(10,10,10,.05), 0 8px 24px -8px rgba(10,10,10,.12);
  --max:1120px; --leitura:720px;
  --pad:clamp(20px, 5vw, 32px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0; background:var(--superficie); color:var(--tinta);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:17px; line-height:1.7; -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{max-width:100%; display:block; height:auto}
h1,h2,h3,h4{font-family:'Sora',system-ui,sans-serif; margin:0; line-height:1.15; letter-spacing:-.02em; font-weight:800}
p{margin:0}
a{color:var(--laranja-escuro); text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1.5px}
a:hover{color:var(--laranja)}
button{font:inherit; cursor:pointer}
.wrap{max-width:var(--max); margin-inline:auto; padding-inline:var(--pad)}
.leitura{max-width:var(--leitura); margin-inline:auto}

/* ---------- Header ---------- */
.top{
  position:sticky; top:0; z-index:60; background:rgba(10,10,10,.94);
  backdrop-filter:blur(14px); border-bottom:1px solid rgba(255,255,255,.09);
}
.top__in{display:flex; align-items:center; justify-content:space-between; gap:16px; height:64px}
.logo{display:flex; align-items:center; text-decoration:none; flex:none}
.logo img{height:30px; width:auto}
.top__cta{
  font-family:'Sora'; font-weight:700; font-size:13px; text-decoration:none; white-space:nowrap;
  color:#fff; background:var(--grad-cta); padding:11px 20px; border-radius:100px;
  transition:transform .18s ease; text-align:center;
}
.top__cta:hover{transform:translateY(-1px); color:#fff}
@media(max-width:520px){ .top__cta{font-size:12px; padding:10px 15px} .logo img{height:26px} }

/* ---------- Barra de categorias ---------- */
.barra-cat{background:var(--preto); border-bottom:1px solid rgba(255,255,255,.09); position:sticky; top:64px; z-index:55}
.barra-cat__in{display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; padding:10px 0}
.barra-cat__in::-webkit-scrollbar{display:none}
.barra-cat a{
  flex:none; font-size:13px; font-weight:600; text-decoration:none; white-space:nowrap;
  color:rgba(255,255,255,.72); padding:8px 15px; border-radius:100px;
  border:1px solid rgba(255,255,255,.14); transition:all .18s ease;
}
.barra-cat a:hover{color:#fff; border-color:var(--laranja); background:rgba(255,112,0,.16)}
.barra-cat a[aria-current]{color:#fff; background:var(--grad-cta); border-color:transparent}

/* ---------- Hero do hub ---------- */
.hub-hero{background:var(--escuro); color:#fff; padding:clamp(48px,7vw,80px) 0; position:relative; overflow:hidden}
.hub-hero::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(55% 60% at 12% 0%, rgba(255,112,0,.26), transparent 62%),
             radial-gradient(50% 55% at 92% 100%, rgba(209,78,0,.26), transparent 64%);
}
.hub-hero .wrap{position:relative; z-index:2}
.hub-hero h1{font-size:clamp(30px,5.4vw,52px); max-width:18ch; text-wrap:balance}
.hub-hero p{margin-top:20px; max-width:56ch; color:rgba(255,255,255,.76); font-size:clamp(16px,2vw,19px)}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px; font-size:11.5px; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:#FFD9BC;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14);
  padding:8px 14px; border-radius:100px; margin-bottom:22px;
}

/* ---------- Grade de artigos ---------- */
.artigos{display:grid; gap:20px; padding:clamp(48px,7vw,80px) 0}
@media(min-width:680px){ .artigos{grid-template-columns:repeat(2,1fr)} }
@media(min-width:1000px){ .artigos{grid-template-columns:repeat(3,1fr)} }
.art{
  display:flex; flex-direction:column; background:var(--superficie); border:1px solid var(--linha);
  border-radius:var(--r-lg); padding:26px; text-decoration:none; color:inherit;
  box-shadow:var(--sombra); transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.art:hover{transform:translateY(-4px); border-color:rgba(255,112,0,.35); box-shadow:0 20px 48px -18px rgba(209,78,0,.3); color:inherit}
.art__tag{
  align-self:flex-start; font-size:10.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--laranja); background:var(--superficie-3); padding:6px 11px; border-radius:100px; margin-bottom:16px;
}
.art h2{font-size:19px; line-height:1.3; font-weight:700}
.art p{margin-top:10px; font-size:15px; color:var(--tinta-2); line-height:1.6; flex:1}
.art__mais{
  margin-top:18px; font-family:'Sora'; font-weight:700; font-size:14px; color:var(--laranja-escuro);
  display:inline-flex; align-items:center; gap:7px;
}
.art:hover .art__mais{gap:11px; color:var(--laranja)}
.art__mais svg{width:15px;height:15px; transition:transform .2s ease}

/* ---------- Artigo ---------- */
.crumbs{font-size:13px; color:var(--tinta-3); padding:22px 0 0}
.crumbs a{color:var(--tinta-3); text-decoration:none}
.crumbs a:hover{color:var(--laranja)}
.artigo{padding:14px 0 clamp(56px,8vw,90px)}
.artigo__cab{padding:14px 0 34px; border-bottom:1px solid var(--linha); margin-bottom:38px}
.artigo h1{font-size:clamp(28px,4.8vw,44px); line-height:1.12; text-wrap:balance}
.artigo__sub{margin-top:20px; font-size:clamp(17px,2.1vw,20px); color:var(--tinta-2); line-height:1.6}
.artigo__meta{margin-top:22px; font-size:13px; color:var(--tinta-3); display:flex; gap:14px; flex-wrap:wrap; align-items:center}
.artigo__meta b{color:var(--laranja); font-weight:700}
.artigo h2{font-size:clamp(22px,3.2vw,30px); margin:44px 0 16px; line-height:1.2}
.artigo h3{font-size:clamp(18px,2.4vw,21px); margin:32px 0 12px; font-weight:700}
.artigo p{margin:0 0 18px; color:#26231F}
.artigo ul, .artigo ol{margin:0 0 22px; padding-left:22px; color:#26231F}
.artigo li{margin-bottom:10px}
.artigo li::marker{color:var(--laranja); font-weight:700}
.artigo strong{font-weight:700; color:var(--tinta)}

.destaque{
  background:var(--superficie-3); border-left:4px solid var(--laranja);
  border-radius:0 var(--r) var(--r) 0; padding:22px 24px; margin:30px 0;
  font-size:16.5px; line-height:1.65; color:#2E2A25;
}
.destaque strong{color:var(--laranja-escuro)}

.tabela{width:100%; border-collapse:collapse; margin:26px 0; font-size:15px; display:block; overflow-x:auto}
.tabela th,.tabela td{border:1px solid var(--linha); padding:13px 15px; text-align:left; vertical-align:top}
.tabela th{background:var(--superficie-2); font-family:'Sora'; font-weight:700; font-size:13.5px; white-space:nowrap}

/* ---------- CTA dentro do artigo ---------- */
.cta-bloco{
  background:var(--grad); color:#fff; border-radius:var(--r-xl);
  padding:clamp(28px,4.4vw,44px); margin:44px 0; text-align:center; position:relative; overflow:hidden;
}
.cta-bloco::before{
  content:''; position:absolute; inset:0; opacity:.3;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:radial-gradient(65% 70% at 50% 50%,#000,transparent);
  -webkit-mask-image:radial-gradient(65% 70% at 50% 50%,#000,transparent);
}
.cta-bloco > *{position:relative; z-index:2}
.cta-bloco h3{font-size:clamp(21px,3.4vw,30px); line-height:1.2; text-wrap:balance}
.cta-bloco p{margin:16px auto 0; color:rgba(255,255,255,.82); max-width:48ch; font-size:16px}
.cta-bloco .garantia{
  display:block; width:fit-content; max-width:100%; margin:22px auto 0;
  font-family:'Sora'; font-weight:800;
  font-size:clamp(14px,2.1vw,17px); color:#0A0A0A; background:var(--laranja);
  padding:11px 20px; border-radius:100px; line-height:1.3;
}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px; margin-top:24px;
  font-family:'Sora'; font-weight:800; font-size:clamp(15px,1.8vw,17px); text-decoration:none;
  padding:19px 34px; border-radius:100px; border:0; background:#fff; color:var(--laranja-escuro);
  box-shadow:0 14px 36px -12px rgba(0,0,0,.55); transition:transform .18s ease, box-shadow .18s ease;
  max-width:100%;
}
.btn:hover{transform:translateY(-2px); color:var(--laranja-escuro); box-shadow:0 20px 46px -14px rgba(0,0,0,.6)}
.cta-bloco small{display:block; margin-top:16px; font-size:13px; color:rgba(255,255,255,.6)}

/* ---------- FAQ ---------- */
.faq{margin:44px 0 0; display:grid; gap:11px}
.q{background:var(--superficie); border:1px solid var(--linha); border-radius:var(--r); overflow:hidden}
.q[open]{border-color:rgba(255,112,0,.32); box-shadow:var(--sombra)}
.q summary{
  list-style:none; cursor:pointer; padding:19px 21px; display:flex; align-items:center; gap:16px;
  font-family:'Sora'; font-weight:700; font-size:16px; line-height:1.35;
}
.q summary::-webkit-details-marker{display:none}
.q summary::after{
  content:''; margin-left:auto; flex:none; width:10px; height:10px;
  border-right:2.5px solid var(--laranja); border-bottom:2.5px solid var(--laranja);
  transform:rotate(45deg) translateY(-3px); transition:transform .22s ease;
}
.q[open] summary::after{transform:rotate(-135deg) translateY(-3px)}
.q .a{padding:0 21px 21px; font-size:15.5px; color:var(--tinta-2); line-height:1.65}

/* ---------- Leia também ---------- */
.relacionados{border-top:1px solid var(--linha); margin-top:52px; padding-top:38px}
.relacionados h2{font-size:20px; margin-bottom:20px}
.rel-lista{display:grid; gap:12px}
@media(min-width:640px){ .rel-lista{grid-template-columns:repeat(2,1fr)} }
.rel{
  display:block; padding:18px 20px; border:1px solid var(--linha); border-radius:var(--r);
  text-decoration:none; color:inherit; font-family:'Sora'; font-weight:700; font-size:15px; line-height:1.35;
  transition:all .2s ease;
}
.rel:hover{border-color:var(--laranja); background:var(--superficie-3); color:inherit; transform:translateX(3px)}

/* ---------- Índice do artigo ---------- */
.indice{
  background:var(--superficie-2); border:1px solid var(--linha); border-radius:var(--r);
  padding:22px 24px; margin:0 0 34px;
}
.indice b{font-family:'Sora'; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--laranja)}
.indice ol{margin:14px 0 0; padding-left:20px}
.indice li{margin-bottom:8px; font-size:15px}
.indice a{color:var(--tinta-2); text-decoration:none}
.indice a:hover{color:var(--laranja); text-decoration:underline}

/* ---------- Rodapé ---------- */
.rodape{background:var(--escuro); color:rgba(255,255,255,.55); padding:44px 0; font-size:13.5px; margin-top:0}
.rodape__in{display:flex; flex-direction:column; gap:20px; align-items:center; text-align:center}
.rodape a{color:rgba(255,255,255,.8)}
.rodape p{max-width:64ch; line-height:1.6}
@media(min-width:820px){ .rodape__in{flex-direction:row; justify-content:space-between; text-align:left} }

/* ---------- Progresso de leitura ---------- */
.leitura-prog{position:fixed; top:0; left:0; height:3px; background:var(--grad-cta); width:0; z-index:80; transition:width .1s linear}

@media(prefers-reduced-motion:reduce){ *{animation:none!important; transition:none!important} html{scroll-behavior:auto} }