/* ============================================================
   educacao.css — Componentes comuns a todas as páginas de educação
   Depende de: base.css, theme.css
   ============================================================ */

/* PAGE WRAP */
.page-wrap{max-width:820px;margin:0 auto;padding:0 2.5rem;}

/* ARTICLE HERO */
.article-hero{padding:8rem 2.5rem 4rem;max-width:820px;margin:0 auto;}
.article-eyebrow{display:inline-flex;align-items:center;gap:0.65rem;color:var(--green);font-size:0.72rem;letter-spacing:2.4px;text-transform:uppercase;font-weight:600;margin-bottom:1.5rem;}
.article-eyebrow::before{content:'';width:28px;height:1px;background:var(--green);}
.article-hero h1{font-family:var(--font-display);font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.05;letter-spacing:-1.5px;margin-bottom:1.5rem;}
.article-hero h1 em{color:var(--green);font-style:italic;}

/* ARTICLE META */
.article-meta{display:flex;align-items:center;gap:1.25rem;flex-wrap:wrap;padding:1rem 0;border-top:1px solid var(--muted-3);border-bottom:1px solid var(--muted-3);margin-bottom:2.5rem;}
.meta-item{font-size:0.78rem;color:var(--muted-2);}
.meta-dot{width:4px;height:4px;border-radius:50%;background:var(--muted-3);display:inline-block;}
.article-lead{font-size:1.1rem;line-height:1.8;color:var(--muted-1);font-weight:300;}

/* ARTICLE BODY */
.article-body{padding-bottom:2rem;}
.article-body h2{font-family:var(--font-display);font-size:clamp(1.6rem,3vw,2.2rem);line-height:1.1;letter-spacing:-0.8px;margin:3.5rem 0 1.25rem;}
.article-body h2 em{color:var(--green);font-style:italic;}
.article-body h3{font-family:var(--font-display);font-size:1.2rem;line-height:1.2;margin:2rem 0 0.75rem;}
.article-body p{color:var(--muted-1);font-size:0.98rem;line-height:1.82;margin-bottom:1.2rem;font-weight:300;}
.article-body p strong{color:var(--white);font-weight:600;}
.article-body a{color:var(--green);text-decoration:none;border-bottom:1px solid var(--green-border);transition:border-color 0.2s;}
.article-body a:hover{border-color:var(--green);}

/* PULL QUOTE */
.pull-quote{border-left:3px solid var(--green);padding:1.25rem 1.5rem;margin:2.5rem 0;background:var(--green-soft);border-radius:0 12px 12px 0;}
.pull-quote p{font-family:var(--font-display);font-size:1.1rem;font-style:italic;color:var(--white);line-height:1.55;margin:0;}

/* VISUAL SECTION */
.visual-section{margin:3.5rem -2.5rem;background:var(--bg-2);border-top:1px solid var(--muted-3);border-bottom:1px solid var(--muted-3);padding:3rem 2.5rem;}
.visual-section-inner{max-width:820px;margin:0 auto;}
.visual-label{font-size:0.65rem;letter-spacing:2px;text-transform:uppercase;color:var(--green);font-weight:600;margin-bottom:0.75rem;}
.visual-title{font-family:var(--font-display);font-size:clamp(1.3rem,2.5vw,1.8rem);line-height:1.15;margin-bottom:1.5rem;}

/* WARNING BOX */
.warning-box{background:rgba(201,168,76,0.08);border:1px solid var(--gold-border);border-radius:12px;padding:1.25rem 1.5rem;margin:2rem 0;display:flex;gap:1rem;align-items:flex-start;}
.warning-icon{font-size:1.1rem;flex-shrink:0;margin-top:2px;}
.warning-box p{color:rgba(240,220,160,0.85);font-size:0.88rem;line-height:1.7;margin:0;}

/* FAQ */
.faq-wrap{margin:3rem 0;}
.faq-item{border-top:1px solid var(--muted-3);padding:1.25rem 0;}
.faq-item:last-child{border-bottom:1px solid var(--muted-3);}
.faq-item h4{font-size:0.98rem;font-weight:600;color:var(--white);margin-bottom:0.55rem;}
.faq-item p{color:var(--muted-1);font-size:0.88rem;line-height:1.65;margin:0;font-weight:300;}
.faq-item a{color:var(--green);border-bottom:1px solid var(--green-border);}

/* ARTICLE CTA */
.article-cta{background:linear-gradient(135deg,#0E1F15,#0A1410);border:1px solid var(--green-border);border-radius:20px;padding:2.5rem;margin:3.5rem 0;display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap;}
.article-cta h3{font-family:var(--font-display);font-size:1.6rem;line-height:1.1;letter-spacing:-0.5px;margin-bottom:0.5rem;color:var(--white);}
.article-cta p{color:var(--muted-1);font-size:0.9rem;line-height:1.6;}
.btn-cta{display:inline-flex;align-items:center;gap:0.5rem;background:var(--green);color:#041009 !important;padding:0.9rem 1.75rem;border-radius:8px;font-family:var(--font-body);font-weight:700;font-size:0.92rem;text-decoration:none;border:none;transition:transform 0.2s,box-shadow 0.2s;white-space:nowrap;}
.btn-cta:hover{transform:translateY(-1px);box-shadow:0 12px 34px rgba(0,200,83,0.28);border-bottom:none;color:#041009 !important;}

/* RELACIONADOS */
.related{margin:2.5rem 0 5rem;}
.related-label{font-size:0.65rem;letter-spacing:2px;text-transform:uppercase;color:var(--muted-2);font-weight:600;margin-bottom:1.25rem;}
.related-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;}
.related-card{background:var(--bg-card);border:1px solid var(--muted-3);border-radius:14px;padding:1.25rem;text-decoration:none;color:inherit;transition:background 0.2s,border-color 0.2s;}
.related-card:hover{background:var(--bg-hover);border-color:var(--green-border);}
.related-card-cat{font-size:0.65rem;letter-spacing:1.8px;text-transform:uppercase;color:var(--green);font-weight:600;margin-bottom:0.5rem;}
.related-card h4{font-family:var(--font-display);font-size:1rem;line-height:1.2;margin-bottom:0.4rem;}
.related-card p{font-size:0.82rem;color:var(--muted-2);line-height:1.5;}

/* LIGHT MODE */
html.light-mode .article-body p,html[data-theme="light"] .article-body p{color:rgba(19,32,25,0.72);}
html.light-mode .related-card,html[data-theme="light"] .related-card{background:#fff;}
html.light-mode .visual-section,html[data-theme="light"] .visual-section{background:#EAF0EC;}
html.light-mode .article-cta,html[data-theme="light"] .article-cta{background:linear-gradient(135deg,#D6EFE0,#E8F5EC);border-color:rgba(0,200,83,0.35);}
html.light-mode .article-cta h3,html[data-theme="light"] .article-cta h3{color:#0A1F12;}
html.light-mode .article-cta p,html[data-theme="light"] .article-cta p{color:rgba(10,31,18,0.65);}

/* MOBILE */
@media(max-width:768px){
  .article-hero,.page-wrap{padding-left:1.25rem;padding-right:1.25rem;}
  .visual-section{margin:3rem -1.25rem;padding:2rem 1.25rem;}
  .related-grid{grid-template-columns:1fr;}
  .article-cta{flex-direction:column;align-items:flex-start;}
  .btn-cta{width:100%;justify-content:center;}
}
