/*
Theme Name: Práxis Pedagógica
Theme URI: https://praxispedagogica.com.br
Author: Mário Sérgio Godoy
Description: Tema institucional da Práxis Pedagógica — design educacional e consultoria pedagógica.
Version: 1.0
Text Domain: praxis-pedagogica
*/

:root{
  --ink:#12202A;
  --ink-2:#0B141B;
  --paper:#E7E2D2;
  --paper-2:#DBD5C0;
  --verde:#3F6B4F;
  --verde-dim:#2C4C38;
  --dourado:#B98A2E;
  --marrom:#5B4433;
  --tijolo:#8A2E20;
  --ink-on-paper:#1C2A22;
  --paper-on-ink:#ECE7D9;
  --line-on-ink:rgba(236,231,217,0.16);
  --line-on-paper:rgba(28,42,34,0.16);
  --display:'Newsreader', serif;
  --body:'Public Sans', sans-serif;
  --mono:'IBM Plex Mono', monospace;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--body);
  background:var(--ink);
  color:var(--paper-on-ink);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1120px; margin:0 auto; padding:0 32px;}
@media(max-width:640px){.wrap{padding:0 20px;}}
a:focus-visible, button:focus-visible{outline:2px solid var(--dourado); outline-offset:3px;}
img{max-width:100%;}

/* ---------- NAV ---------- */
header.site-header{
  position:fixed; top:0; left:0; right:0; z-index:50;
  padding:22px 0;
  background:linear-gradient(to bottom, rgba(18,32,42,0.92), rgba(18,32,42,0));
}
header.site-header.solid,
header.site-header.scrolled{background:rgba(11,20,27,0.92); border-bottom:1px solid var(--line-on-ink);}
.nav{display:flex; align-items:center; justify-content:space-between;}
.brand{display:flex; align-items:center;}
.brand-logo{height:34px; width:auto; display:block;}
@media(max-width:640px){.brand-logo{height:28px;}}
nav.links{display:flex; gap:34px; font-family:var(--mono); font-size:0.7rem; letter-spacing:0.08em; text-transform:uppercase;}
nav.links a{opacity:0.75; transition:opacity .2s; color:var(--paper-on-ink);}
nav.links a:hover{opacity:1; color:var(--dourado);}
nav.links a.active{opacity:1; color:var(--dourado);}
@media(max-width:840px){nav.links{display:none;}}

/* ---------- HERO ---------- */
.hero{
  min-height:96svh;
  display:flex; flex-direction:column; justify-content:center;
  position:relative;
  padding-top:120px; padding-bottom:60px;
  background:
    radial-gradient(ellipse 900px 500px at 15% 0%, rgba(63,107,79,0.22), transparent 60%),
    radial-gradient(ellipse 700px 500px at 100% 30%, rgba(185,138,46,0.10), transparent 60%),
    var(--ink);
}
.hero-mast{display:flex; align-items:center; gap:20px; margin-bottom:28px; flex-wrap:wrap;}
.hero-logo{height:50px; width:auto; display:block; filter:drop-shadow(0 0 24px rgba(63,107,79,0.25));}
@media(max-width:640px){.hero-logo{height:40px;}}
.eyebrow{
  font-family:var(--mono); font-size:0.72rem; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--dourado); display:flex; align-items:center; gap:12px;
}
.eyebrow::before{content:''; width:26px; height:1px; background:var(--dourado);}
.hero h1{
  font-family:var(--display); font-weight:600; font-size:clamp(2.5rem, 5.6vw, 4.6rem);
  line-height:1.06; letter-spacing:-0.01em; max-width:17ch; color:var(--paper-on-ink);
}
.hero h1 em{font-style:italic; font-weight:500; color:#7FAE8E;}
.hero .lede{
  margin-top:26px; max-width:56ch; font-size:1.08rem; color:rgba(236,231,217,0.78); font-weight:300;
}
.hero .cta-row{display:flex; gap:18px; margin-top:40px; flex-wrap:wrap;}
.btn{
  font-family:var(--mono); font-size:0.76rem; letter-spacing:0.06em; text-transform:uppercase;
  padding:15px 26px; border-radius:2px; display:inline-flex; align-items:center; gap:10px;
  transition:transform .18s ease, background .18s ease, border-color .18s ease;
  border:1px solid transparent; cursor:pointer;
}
.btn-solid{background:var(--dourado); color:var(--ink-2); font-weight:500;}
.btn-solid:hover{transform:translateY(-2px); background:#CC9A38;}
.btn-ghost{border:1px solid var(--line-on-ink); color:var(--paper-on-ink);}
.btn-ghost:hover{border-color:var(--dourado); color:var(--dourado); transform:translateY(-2px);}

/* audience strip */
.audience{border-top:1px solid var(--line-on-ink); margin-top:64px; padding-top:26px;}
.audience-label{font-family:var(--mono); font-size:0.66rem; letter-spacing:0.1em; text-transform:uppercase; opacity:0.45; margin-bottom:16px;}
.audience-list{display:flex; flex-wrap:wrap; gap:12px;}
.audience-list span{
  font-family:var(--mono); font-size:0.72rem; letter-spacing:0.02em; padding:8px 14px;
  border:1px solid var(--line-on-ink); border-radius:2px; opacity:0.85;
}

/* ---------- SECTION SHELL ---------- */
section{padding:130px 0;}
@media(max-width:640px){section{padding:84px 0;}}
.on-paper{background:var(--paper); color:var(--ink-on-paper);}
.section-head{max-width:660px; margin-bottom:60px;}
.section-num{
  font-family:var(--mono); font-size:0.7rem; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--tijolo); margin-bottom:14px;
}
.on-ink .section-num{color:var(--dourado);}
.section-head h2{
  font-family:var(--display); font-size:clamp(1.9rem, 3.8vw, 2.8rem); font-weight:600; letter-spacing:-0.01em;
}
.section-head p.sub{margin-top:18px; font-size:1.02rem; opacity:0.72; max-width:56ch; font-weight:300;}

/* ---------- O QUE É / MÉTODO (paper) ---------- */
.praxis-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:72px; align-items:start;}
@media(max-width:880px){.praxis-grid{grid-template-columns:1fr; gap:48px;}}
.praxis-copy p{margin-bottom:22px; font-size:1.03rem; font-weight:300;}
.praxis-copy p:first-of-type{font-family:var(--display); font-size:1.4rem; font-style:italic; font-weight:500; line-height:1.45; color:var(--verde-dim);}
.pull{
  border-left:2px solid var(--tijolo); padding-left:22px; margin:34px 0;
  font-family:var(--display); font-style:italic; font-size:1.15rem; color:var(--ink-on-paper);
}
.spiral-box{position:sticky; top:120px;}
.spiral-box svg{width:100%; height:auto; display:block;}
.spiral-label{
  font-family:var(--mono); font-size:0.68rem; letter-spacing:0.08em; text-transform:uppercase;
  text-align:center; margin-top:14px; opacity:0.6;
}

/* ---------- THESIS DIVIDER (ink) ---------- */
.thesis{
  background:var(--ink-2); padding:130px 0; text-align:center;
  border-top:1px solid var(--line-on-ink); border-bottom:1px solid var(--line-on-ink);
}
.thesis .wrap{max-width:820px;}
.thesis .line{
  font-family:var(--display); font-weight:400; font-size:clamp(1.5rem,4vw,2.3rem);
  line-height:1.5; opacity:0.55;
}
.thesis .line.strong{font-weight:600; opacity:1; color:var(--paper-on-ink);}
.thesis .line em{font-style:italic; color:var(--dourado); font-weight:500;}

/* ---------- DIFERENCIAIS (paper, editorial list) ---------- */
.diff-list{border-top:1px solid var(--line-on-paper);}
.diff-row{
  display:grid; grid-template-columns:100px 1.1fr 1.4fr; gap:28px; align-items:baseline;
  padding:32px 0; border-bottom:1px solid var(--line-on-paper);
}
@media(max-width:780px){.diff-row{grid-template-columns:1fr; gap:8px; padding:26px 0;}}
.diff-row .num{font-family:var(--mono); font-size:0.8rem; color:var(--tijolo);}
.diff-row h3{font-family:var(--display); font-weight:600; font-size:1.3rem;}
.diff-row p{font-size:0.98rem; opacity:0.72; font-weight:300;}

/* ---------- PROCESSO (ink, vertical timeline) ---------- */
.proc-list{max-width:640px; margin:0 auto; position:relative;}
.proc-list::before{
  content:''; position:absolute; left:23px; top:14px; bottom:14px; width:1px;
  background:var(--line-on-ink);
}
.proc-item{display:flex; gap:26px; padding:0 0 46px; position:relative;}
.proc-item:last-child{padding-bottom:0;}
.proc-num{
  flex-shrink:0; width:48px; height:48px; border-radius:50%; border:1px solid var(--line-on-ink);
  display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-size:0.85rem;
  background:var(--ink); color:var(--dourado); position:relative; z-index:2;
}
.proc-text{padding-top:10px;}
.proc-text h3{font-family:var(--display); font-weight:600; font-size:1.25rem; margin-bottom:6px;}
.proc-text p{font-size:0.92rem; opacity:0.65; font-weight:300; max-width:44ch;}
.proc-loop{
  text-align:center; margin-top:8px; font-family:var(--mono); font-size:0.7rem; letter-spacing:0.06em;
  opacity:0.5; display:flex; align-items:center; justify-content:center; gap:10px; padding-left:74px;
}
@media(max-width:640px){.proc-loop{padding-left:0;}}
.proc-loop .arrow{color:var(--dourado);}

/* ---------- SOBRE (paper) ---------- */
.sobre-grid{display:grid; grid-template-columns:0.8fr 1.2fr; gap:64px; align-items:start;}
@media(max-width:880px){.sobre-grid{grid-template-columns:1fr;}}
.sobre-card{border:1px solid var(--line-on-paper); padding:36px; background:rgba(28,42,34,0.03);}
.sobre-card .stat{font-family:var(--display); font-weight:600; font-size:3.4rem; color:var(--verde-dim); line-height:1;}
.sobre-card .stat-label{font-family:var(--mono); font-size:0.68rem; letter-spacing:0.08em; text-transform:uppercase; opacity:0.55; margin-top:8px; display:block;}
.sobre-card .name{font-family:var(--display); font-weight:600; font-size:1.25rem; margin-top:28px; border-top:1px solid var(--line-on-paper); padding-top:24px;}
.sobre-card .role{font-family:var(--mono); font-size:0.7rem; opacity:0.6; margin-top:6px; display:block; letter-spacing:0.03em;}
.sobre-copy p{margin-bottom:18px; font-weight:300; opacity:0.85; font-size:1.02rem;}
.sobre-tags{display:flex; flex-wrap:wrap; gap:10px; margin-top:28px;}
.sobre-tags span{
  font-family:var(--mono); font-size:0.7rem; padding:8px 13px; border:1px solid var(--line-on-paper);
  border-radius:2px; opacity:0.75;
}

/* ---------- CONTATO / FOOTER ---------- */
footer.site-footer{background:var(--ink-2); padding:110px 0 40px; color:var(--paper-on-ink);}
.contact-inner{max-width:680px;}
.contact-inner h2{font-family:var(--display); font-weight:600; font-size:clamp(2rem,4.2vw,2.9rem); line-height:1.1; margin-bottom:22px;}
.contact-inner h2 em{color:var(--dourado); font-style:italic;}
.contact-inner p{opacity:0.68; font-weight:300; margin-bottom:30px; max-width:50ch;}
.service-tags{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:38px;}
.service-tags span{
  font-family:var(--mono); font-size:0.68rem; padding:7px 12px; border:1px solid var(--line-on-ink);
  border-radius:2px; opacity:0.6;
}
.foot-bottom{
  margin-top:100px; padding-top:28px; border-top:1px solid var(--line-on-ink);
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;
  font-family:var(--mono); font-size:0.68rem; letter-spacing:0.05em; opacity:0.45;
}
.foot-brand{display:flex; align-items:center; gap:12px;}
.foot-logo{height:20px; width:auto; opacity:0.9;}

.reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none;}
  html{scroll-behavior:auto;}
}

/* ---------- ARTIGOS (listing page) ---------- */
.page-hero{
  min-height:56svh; display:flex; flex-direction:column; justify-content:center;
  padding-top:150px; padding-bottom:60px; position:relative;
  background:
    radial-gradient(ellipse 900px 500px at 15% 0%, rgba(63,107,79,0.22), transparent 60%),
    var(--ink);
  color:var(--paper-on-ink);
}
.page-hero h1{
  font-family:var(--display); font-weight:600; font-size:clamp(2.3rem, 5vw, 3.6rem);
  line-height:1.1; letter-spacing:-0.01em; max-width:16ch;
}
.page-hero .lede{margin-top:24px; max-width:58ch; font-size:1.06rem; color:rgba(236,231,217,0.78); font-weight:300;}
.cat-row{display:flex; flex-wrap:wrap; gap:12px; margin-top:36px;}
.cat-row span{
  font-family:var(--mono); font-size:0.72rem; letter-spacing:0.02em; padding:9px 15px;
  border:1px solid var(--line-on-ink); border-radius:2px; opacity:0.85;
}

.article-section{max-width:820px; margin:0 auto;}
.pub-head{max-width:640px; margin-bottom:48px;}
.pub-head .tag{
  font-family:var(--mono); font-size:0.68rem; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--tijolo); display:block; margin-bottom:16px;
}
.pub-head h2{font-family:var(--display); font-weight:600; font-size:clamp(1.7rem,3.6vw,2.4rem);}
.pub-sub{margin-top:14px; font-size:1rem; opacity:0.7; font-weight:300;}

.article-list{border-top:1px solid var(--line-on-paper);}
.article-row{
  display:grid; grid-template-columns:64px 1fr 140px; gap:24px; align-items:center;
  padding:30px 0; border-bottom:1px solid var(--line-on-paper); transition:opacity .15s ease;
}
.article-row:hover{opacity:0.7;}
.article-row:hover .a-arrow{color:var(--dourado);}
@media(max-width:720px){.article-row{grid-template-columns:1fr; gap:8px; padding:24px 0;}}
.a-seq{font-family:var(--mono); font-size:0.75rem; color:var(--dourado);}
.a-main h3{font-family:var(--display); font-weight:600; font-size:1.2rem; margin-bottom:6px;}
.a-teaser{font-size:0.92rem; opacity:0.65; font-weight:300; max-width:56ch;}
.a-meta{display:flex; flex-direction:column; align-items:flex-end; gap:8px; font-family:var(--mono); font-size:0.7rem; opacity:0.6; text-align:right;}
@media(max-width:720px){.a-meta{flex-direction:row; align-items:center; justify-content:space-between;}}
.a-arrow{color:var(--verde-dim); transition:color .15s ease;}

.format-list{max-width:760px; margin:80px auto 0; border-top:1px solid var(--line-on-paper); padding-top:8px;}
.format-head{font-family:var(--mono); font-size:0.68rem; letter-spacing:0.08em; text-transform:uppercase; opacity:0.45; margin:26px 0 6px;}
.format-row{
  display:grid; grid-template-columns:180px 1fr; gap:24px; padding:26px 0;
  border-bottom:1px solid var(--line-on-paper); align-items:baseline;
}
@media(max-width:640px){.format-row{grid-template-columns:1fr; gap:6px;}}
.format-row .label{font-family:var(--mono); font-size:0.72rem; letter-spacing:0.05em; text-transform:uppercase; color:var(--tijolo);}
.format-row p{font-size:0.96rem; font-weight:300; opacity:0.78;}

/* ---------- ARTIGO (single post) ---------- */
body.single-post{background:var(--paper); color:var(--ink-on-paper);}
.article-hero{padding:170px 0 50px; max-width:760px; margin:0 auto;}
.back-link{
  font-family:var(--mono); font-size:0.7rem; letter-spacing:0.05em; text-transform:uppercase;
  color:var(--tijolo); display:inline-flex; align-items:center; gap:8px; margin-bottom:30px;
}
.back-link:hover{color:var(--verde-dim);}
.seq-tag{
  font-family:var(--mono); font-size:0.68rem; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--dourado); background:var(--ink); display:inline-block; padding:6px 12px; margin-bottom:20px;
}
.article-hero h1{font-family:var(--display); font-weight:600; font-size:clamp(1.9rem, 4.4vw, 2.9rem); line-height:1.15; letter-spacing:-0.01em;}
.byline{
  margin-top:22px; padding-top:22px; border-top:1px solid var(--line-on-paper);
  font-family:var(--mono); font-size:0.75rem; opacity:0.65; display:flex; gap:18px; flex-wrap:wrap;
}
article.post-body{max-width:700px; margin:0 auto; padding-bottom:100px;}
article.post-body p{font-size:1.08rem; font-weight:300; margin-bottom:24px; line-height:1.75;}
article.post-body p strong{font-weight:600; color:var(--verde-dim);}
article.post-body ul{margin:0 0 24px 22px;}
article.post-body li{font-size:1.08rem; font-weight:300; margin-bottom:10px; line-height:1.7;}

.article-nav{
  max-width:700px; margin:0 auto 100px; display:flex; justify-content:space-between; gap:20px;
  padding-top:36px; border-top:1px solid var(--line-on-paper); flex-wrap:wrap;
}
.article-nav a{
  font-family:var(--mono); font-size:0.72rem; letter-spacing:0.04em; text-transform:uppercase;
  max-width:44%; opacity:0.8;
}
.article-nav a:hover{color:var(--verde-dim);}
.article-nav .next{text-align:right; margin-left:auto;}
.article-nav .lbl{display:block; font-size:0.62rem; opacity:0.5; margin-bottom:6px;}

body.single-post header.site-header{background:rgba(11,20,27,0.94); border-bottom:1px solid var(--line-on-ink);}