/*
Theme Name: Escola PDF Blog
Theme URI: https://escolapdf.com.br/blog
Author: Escola PDF / Feitio Arte
Description: Tema do blog da Escola PDF, no design proprio da marca (Fraunces + Karla). Feito para o WordPress isolado em /blog.
Version: 1.0
Text Domain: escola-pdf-blog
*/

:root{
  --paper:#FAF8F4;
  --ink:#1B1A17;
  --muted:#726D63;
  --line: rgba(27,26,23,0.12);
  --accent:#F29C1F;
  --maxw: 1240px;
  --read: 700px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{ margin:0; background:var(--paper); color:var(--ink); font-family:'Karla',sans-serif; font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased; }
img{max-width:100%; display:block; height:auto;}
a{color:inherit;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 32px;}
.read{max-width:var(--read); margin:0 auto; padding:0 24px;}

h1,h2,h3{ font-family:'Fraunces',serif; font-weight:400; margin:0; color:var(--ink); letter-spacing:-0.01em; }
.eyebrow{ font-size:12.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); font-weight:600; }

/* header */
header#siteHeader{ position:fixed; top:0; left:0; right:0; z-index:100; background:rgba(250,248,244,0.94); backdrop-filter:blur(8px); border-bottom:1px solid var(--line); }
.nav{ display:flex; align-items:center; justify-content:space-between; padding:18px 0; }
.logo-mark{ height:32px; width:auto; display:block; }
.nav-links{ display:flex; gap:30px; list-style:none; margin:0; padding:0; font-size:14.5px; }
.nav-links a{ text-decoration:none; padding-bottom:3px; border-bottom:1px solid transparent; }
.nav-links a:hover{ border-bottom-color:currentColor; }
.nav-cta{ font-size:13.5px; padding:10px 20px; border-radius:2px; text-decoration:none; white-space:nowrap; border:1px solid currentColor; }
.menu-btn{ display:none; background:none; border:none; cursor:pointer; padding:6px; color:var(--ink); }
.menu-btn span{ display:block; width:22px; height:1px; background:currentColor; margin:6px 0; }

/* page head (listagem) */
.blog-head{ padding:150px 0 40px; text-align:center; }
.blog-head h1{ font-size:clamp(34px,5vw,56px); font-weight:300; margin:14px 0 16px; }
.blog-head p{ color:var(--muted); font-size:17px; max-width:52ch; margin:0 auto; }

.filters{ display:flex; justify-content:center; gap:10px; flex-wrap:wrap; padding:8px 0 8px; }
.filters a{ font-size:13.5px; text-decoration:none; color:var(--muted); padding:8px 16px; border:1px solid var(--line); border-radius:2px; }
.filters a.active, .filters a:hover{ color:var(--ink); border-color:var(--ink); }

section.blog-list{ padding:56px 0 90px; }

/* post em destaque */
.featured{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:48px; align-items:center; text-decoration:none; color:var(--ink); margin-bottom:72px; }
.featured-thumb{ aspect-ratio:4/3; overflow:hidden; background:#EDE8DE; }
.featured-thumb img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.featured:hover .featured-thumb img{ transform:scale(1.03); }
.featured .eyebrow{ display:block; margin-bottom:14px; color:var(--accent); }
.featured h2{ font-size:clamp(26px,3vw,38px); font-weight:300; line-height:1.12; margin-bottom:16px; }
.featured p{ color:var(--muted); font-size:16px; margin:0 0 18px; max-width:52ch; }
.featured .meta{ font-size:13.5px; color:var(--muted); }

/* grid de posts */
.post-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:40px 28px; }
.post-card{ text-decoration:none; color:var(--ink); display:block; }
.post-thumb{ aspect-ratio:16/11; overflow:hidden; margin-bottom:16px; background:#EDE8DE; }
.post-thumb img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.post-card:hover .post-thumb img{ transform:scale(1.04); }
.post-card .eyebrow{ display:block; margin-bottom:8px; color:var(--accent); }
.post-card h3{ font-size:20px; font-weight:400; line-height:1.2; margin-bottom:10px; }
.post-card p{ color:var(--muted); font-size:14.5px; margin:0 0 12px; }
.post-card .meta{ font-size:13px; color:var(--muted); }

/* paginacao */
.pager{ display:flex; justify-content:center; gap:8px; margin-top:72px; }
.pager ul{ list-style:none; display:flex; gap:8px; padding:0; margin:0; justify-content:center; flex-wrap:wrap; }
.pager .page-numbers{ min-width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center; text-decoration:none; font-size:14px; border:1px solid var(--line); color:var(--muted); padding:0 8px; }
.pager .page-numbers.current{ border-color:var(--ink); color:var(--ink); }
.pager a.page-numbers:hover{ border-color:var(--ink); color:var(--ink); }

/* article header */
.article-head{ padding:140px 0 40px; }
.article-head .read{ text-align:center; }
.breadcrumb{ font-size:13px; color:var(--muted); margin-bottom:22px; }
.breadcrumb a{ text-decoration:none; }
.breadcrumb a:hover{ color:var(--ink); }
.cat-pill{ display:inline-block; font-size:11.5px; letter-spacing:0.12em; text-transform:uppercase; font-weight:600; color:var(--accent); margin-bottom:18px; }
.article-head h1{ font-size:clamp(30px,4.4vw,48px); line-height:1.12; font-weight:300; margin-bottom:22px; }
.article-head .standfirst{ color:var(--muted); font-size:19px; font-family:'Fraunces',serif; font-style:italic; max-width:60ch; margin:0 auto 26px; }
.meta{ display:flex; align-items:center; justify-content:center; gap:14px; font-size:14px; color:var(--muted); flex-wrap:wrap; }
.meta .dot{ width:4px; height:4px; border-radius:50%; background:var(--muted); display:inline-block; }

/* cover */
.cover{ margin:20px 0 8px; }
.cover .frame{ max-width:1040px; margin:0 auto; aspect-ratio:16/9; overflow:hidden; background:#EDE8DE; }
.cover img{ width:100%; height:100%; object-fit:cover; }
.cover .cap{ text-align:center; font-size:12.5px; color:var(--muted); margin-top:12px; }

/* article body */
.article-body{ padding:56px 0 40px; }
.article-body p{ margin:0 0 24px; }
.article-body h2{ font-size:clamp(24px,2.6vw,30px); font-weight:400; margin:44px 0 16px; font-family:'Fraunces',serif; }
.article-body h3{ font-size:20px; font-weight:500; font-family:'Karla',sans-serif; margin:28px 0 10px; }
.article-body a{ color:var(--ink); text-decoration:underline; text-decoration-color:var(--accent); text-underline-offset:3px; }
.article-body strong{ font-weight:600; }
.article-body ul,.article-body ol{ margin:0 0 24px; padding-left:22px; }
.article-body li{ margin-bottom:8px; }
.article-body img,.article-body figure{ margin:28px auto; }
.article-body figure img{ margin:0; }
.article-body figcaption,.article-body .wp-caption-text{ text-align:center; font-size:12.5px; color:var(--muted); margin-top:12px; }
.article-body blockquote{ font-family:'Fraunces',serif; font-weight:300; font-size:clamp(22px,2.6vw,28px); line-height:1.4; color:var(--ink); border-left:2px solid var(--accent); padding:6px 0 6px 24px; margin:36px 0; font-style:italic; }
.article-body blockquote p{ margin:0; }
.checklist{ list-style:none; margin:8px 0 28px; padding:0 !important; }
.checklist li{ position:relative; padding:10px 0 10px 30px; border-top:1px solid var(--line); font-size:16px; margin:0; }
.checklist li:first-child{ border-top:none; }
.checklist li::before{ content:"\2192"; position:absolute; left:0; top:10px; color:var(--accent); font-weight:700; }
.pullquote{ font-family:'Fraunces',serif; font-weight:300; font-size:clamp(24px,3vw,32px); line-height:1.35; color:var(--ink); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:36px 0; margin:40px 0; text-align:center; }

/* commercial hook */
.hook{ background:var(--ink); color:var(--paper); padding:40px; margin:48px 0 8px; }
.hook .eyebrow{ color:#B8B2A4; display:block; margin-bottom:12px; }
.hook h3{ color:var(--paper); font-size:24px; font-weight:300; margin-bottom:12px; font-family:'Fraunces',serif; }
.hook p{ color:#B8B2A4; font-size:15.5px; margin:0 0 22px; }
.hook a{ color:inherit; text-decoration:none; }
.hook-row{ display:flex; gap:14px; flex-wrap:wrap; align-items:center; }
.btn{ display:inline-flex; align-items:center; gap:10px; padding:14px 26px; text-decoration:none; font-weight:600; font-size:14.5px; border:1px solid currentColor; border-radius:2px; }
.btn-accent{ color:#fff; background:var(--accent); border-color:var(--accent); }
.btn-accent:hover{ background:#d9871a; border-color:#d9871a; }
.btn-ghost-light{ color:var(--paper); background:none; }
.btn-ghost-light:hover{ background:var(--paper); color:var(--ink); }

/* author */
.author{ display:flex; gap:20px; align-items:center; border-top:1px solid var(--line); padding-top:32px; margin-top:48px; }
.author-av{ width:64px; height:64px; border-radius:50%; overflow:hidden; flex-shrink:0; background:#EDE8DE; }
.author-av img{ width:100%; height:100%; object-fit:cover; }
.author-name{ font-family:'Fraunces',serif; font-size:18px; }
.author p{ color:var(--muted); font-size:14.5px; margin:4px 0 0; }

/* related */
.related{ padding:80px 0; border-top:1px solid var(--line); }
.related h2{ font-size:26px; font-weight:300; margin-bottom:36px; }
.rel-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.rel-card{ text-decoration:none; color:var(--ink); display:block; }
.rel-thumb{ aspect-ratio:16/11; overflow:hidden; margin-bottom:14px; background:#EDE8DE; }
.rel-thumb img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.rel-card:hover .rel-thumb img{ transform:scale(1.04); }
.rel-card .eyebrow{ display:block; margin-bottom:6px; }
.rel-card h3{ font-size:18px; font-weight:400; }

/* newsletter */
.newsletter{ background:var(--ink); color:var(--paper); padding:76px 32px; }
.newsletter-inner{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1.2fr 1fr; gap:40px; align-items:center; }
.newsletter h2{ color:var(--paper); font-size:clamp(22px,2.6vw,30px); font-weight:300; }
.newsletter p{ color:#B8B2A4; margin-top:10px; font-size:15px; }
.nl-form{ display:flex; border-bottom:1px solid #55503F; padding-bottom:12px; }
.nl-form input[type=email]{ flex:1; background:none; border:none; color:var(--paper); font-family:'Karla',sans-serif; font-size:16px; padding:6px 0; }
.nl-form input[type=email]::placeholder{ color:#847E6E; }
.nl-form button{ background:none; border:none; color:var(--accent); font-weight:600; font-size:14.5px; cursor:pointer; }

/* footer */
footer#siteFooter{ padding:44px 0; font-size:14px; color:var(--muted); }
.foot-row{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; }
.foot-links{ display:flex; gap:24px; list-style:none; padding:0; margin:0; flex-wrap:wrap; }
.foot-links a{ text-decoration:none; }
.foot-links a:hover{ color:var(--ink); }

/* WordPress helpers */
.aligncenter{ margin-left:auto; margin-right:auto; }
.alignleft{ float:left; margin:6px 24px 12px 0; }
.alignright{ float:right; margin:6px 0 12px 24px; }
.wp-caption{ max-width:100%; }
.sticky, .bypostauthor{}

@media (max-width: 900px){
  .featured{ grid-template-columns:1fr; gap:28px; }
  .featured-thumb{ order:-1; aspect-ratio:16/9; }
  .post-grid{ grid-template-columns:1fr 1fr; }
  .rel-grid{ grid-template-columns:1fr; }
  .newsletter-inner{ grid-template-columns:1fr; }
}
@media (max-width: 760px){
  .blog-head{ padding:120px 0 28px; }
  .article-head{ padding:120px 0 24px; }
  .post-grid{ grid-template-columns:1fr; }
  .nav-links{ position:fixed; top:0; left:0; right:0; bottom:0; background:var(--paper); flex-direction:column; gap:0; display:none; padding-top:88px; z-index:90; }
  .nav-links.open{ display:flex; }
  .nav-links li{ width:100%; border-top:1px solid var(--line); }
  .nav-links a{ display:block; padding:20px 32px; }
  .nav-cta{ display:none; }
  .menu-btn{ display:block; position:relative; z-index:110; }
  .hook{ padding:30px; }
}
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
