/*
Theme Name: Dra. Bruna Kaye
Theme URI: https://drabrunakaye.com.br
Author: Dra. Bruna Kaye
Description: Tema sob medida do site pessoal da Dra. Bruna Kaye, cirurgia-dentista (CRO-SP 166254). Home editorial em front-page.php e blog completo. Paleta tirada das proprias fotos dela: preto e dourado do uniforme bordado, salvia do vestido. Comentarios desligados por decisao editorial.
Version: 1.0.2
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: brunakaye
Tags: blog, one-column, custom-colors, custom-menu, editor-style, translation-ready
*/

/* ============================================================
   TOKENS
   A paleta NAO foi inventada: saiu das fotos de estudio dela.
   - preto + dourado = o uniforme com o nome bordado (foto 6592)
   - salvia         = o vestido (fotos 6598-6605)
   - papel quente   = o fundo cinza do estudio, aquecido
   Nao usar o verde cirurgico da OdontoMare aqui: sao marcas
   diferentes de proposito (ver CLAUDE.md do projeto).
   ============================================================ */
:root{
  --ink:#17171B; --ink-2:#22222A; --ink-3:#33333D;
  --paper:#F8F6F2; --paper-2:#F0ECE4; --paper-3:#E4DED3;

  --gold:#A9854A; --gold-hi:#C9A970; --gold-soft:#EFE3CD;
  --sage:#9CB6A2; --sage-deep:#5D7A65; --sage-soft:#E6EEE8;

  --text:var(--ink); --muted:#6B665E; --muted-2:#948D82;
  --bg:var(--paper); --panel:#FFFFFF; --line:#DED7CB; --line-2:#EAE4DA;

  --serif:'Iowan Old Style','Palatino Linotype',Palatino,'Book Antiqua',Georgia,ui-serif,'Times New Roman',serif;
  --sans:ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;

  --gutter:clamp(1.25rem,5vw,4.5rem);
  --measure:62ch;
  --round:4px;
  --arch:14rem;

  --t:.5s cubic-bezier(.22,1,.36,1);
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#111014; --panel:#191820; --line:#2C2A34; --line-2:#232128;
    --text:#F2EFE9; --muted:#A9A296; --muted-2:#7C766C;
    --gold:#C9A970; --gold-hi:#E0C795; --gold-soft:#3A3222;
    --sage:#8FAC97; --sage-deep:#A8C2AF; --sage-soft:#1D2620;
    --paper-2:#191820; --paper-3:#232128;
  }
}

/* ============================================================
   BASE
   ============================================================ */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--sans); font-size:clamp(1rem,.96rem + .2vw,1.08rem);
  line-height:1.65; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

/* Grao fino por cima de tudo. Tira o "chapado" de tela e aproxima
   a pagina do papel. Sem imagem externa: e um SVG inline. */
body::after{
  content:''; position:fixed; inset:0; z-index:9999; pointer-events:none; opacity:.028;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/></filter><rect width='180' height='180' filter='url(%23n)'/></svg>");
}
@media (prefers-reduced-motion:reduce){ body::after{ display:none; } }

img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-underline-offset:.22em; text-decoration-thickness:1px; }
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:2px solid var(--gold); outline-offset:3px; border-radius:2px;
}
::selection{ background:var(--gold-soft); color:var(--ink); }

h1,h2,h3,h4{ font-family:var(--serif); font-weight:400; letter-spacing:-.015em; line-height:1.08; margin:0; }
p{ margin:0 0 1.05em; }
p:last-child{ margin-bottom:0; }

.wrap{ width:min(1240px,100%); margin-inline:auto; padding-inline:var(--gutter); }
.skip{ position:absolute; left:-9999px; }
.skip:focus{ left:1rem; top:1rem; z-index:1000; background:var(--ink); color:var(--paper); padding:.7rem 1.1rem; }

/* Etiqueta versalete espacada: o "tom de voz" tipografico do site. */
.eyebrow{
  font-size:.66rem; letter-spacing:.24em; text-transform:uppercase; font-weight:600;
  color:var(--muted); margin:0 0 1.1rem; display:flex; align-items:center; gap:.7rem;
}
.eyebrow::before{ content:''; width:1.9rem; height:1px; background:var(--gold); flex:none; }
.eyebrow--c{ justify-content:center; }
.eyebrow--c::after{ content:''; width:1.9rem; height:1px; background:var(--gold); flex:none; }

/* Filete com losango ao centro. Aparece entre as secoes. */
.rule{ display:flex; align-items:center; gap:1rem; color:var(--line); }
.rule::before,.rule::after{ content:''; height:1px; background:currentColor; flex:1; }
.rule i{ width:5px; height:5px; background:var(--gold); transform:rotate(45deg); flex:none; }

/* ============================================================
   REVELACAO AO ROLAR
   Cuidado registrado no CLAUDE.md: em aba de fundo isso congela
   pela metade e engana a captura de tela. Por isso o estado
   final e garantido por .is-in e por prefers-reduced-motion.
   ============================================================ */
.rv{ opacity:0; transform:translateY(22px); transition:opacity .8s var(--t),transform .8s var(--t); }
.rv.is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .rv{ opacity:1!important; transform:none!important; transition:none!important; } }

/* ============================================================
   BOTOES
   ============================================================ */
.btn{
  display:inline-flex; align-items:center; gap:.6rem; padding:.92rem 1.6rem;
  font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; font-weight:600;
  text-decoration:none; border:1px solid transparent; border-radius:999px;
  transition:background var(--t),color var(--t),border-color var(--t),transform var(--t);
  will-change:transform;
}
.btn:hover{ transform:translateY(-2px); }
.btn--solid{ background:var(--ink); color:var(--paper); }
.btn--solid:hover{ background:var(--gold); color:var(--ink); }
.btn--ghost{ border-color:var(--line); color:var(--text); }
.btn--ghost:hover{ border-color:var(--gold); color:var(--gold); }
.btn svg{ width:1.05em; height:1.05em; fill:currentColor; flex:none; }

/* ============================================================
   CABECALHO
   ============================================================ */
.hdr{
  position:sticky; top:0; z-index:50; background:color-mix(in srgb,var(--bg) 82%,transparent);
  backdrop-filter:saturate(180%) blur(14px); -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid transparent; transition:border-color var(--t),background var(--t);
}
.hdr.is-stuck{ border-bottom-color:var(--line-2); }
.hdr__in{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding-block:1.15rem; transition:padding var(--t); }
.hdr.is-stuck .hdr__in{ padding-block:.7rem; }

.brand{ display:flex; flex-direction:column; text-decoration:none; line-height:1; }
.brand b{ font-family:var(--serif); font-size:1.22rem; font-weight:400; letter-spacing:.01em; }
.brand b em{ font-style:italic; color:var(--gold); }
.brand span{ font-size:.58rem; letter-spacing:.22em; text-transform:uppercase; color:var(--muted-2); margin-top:.42rem; }

.nav{ display:none; }
.nav ul{ display:flex; gap:2rem; list-style:none; margin:0; padding:0; }
.nav a{
  font-size:.74rem; letter-spacing:.15em; text-transform:uppercase; font-weight:600;
  text-decoration:none; color:var(--muted); position:relative; padding-block:.3rem;
  transition:color var(--t);
}
.nav a::after{
  content:''; position:absolute; left:0; right:100%; bottom:0; height:1px;
  background:var(--gold); transition:right var(--t);
}
.nav a:hover{ color:var(--text); }
.nav a:hover::after{ right:0; }
.hdr__cta{ display:none; }

/* Menu do celular. O erro registrado da OdontoMare foi justamente
   nao ter hamburguer: o menu sumia e so restava o botao de acao. */
.burger{
  display:inline-flex; flex-direction:column; justify-content:center; gap:5px;
  width:44px; height:44px; padding:0 10px; background:none; border:1px solid var(--line);
  border-radius:999px; cursor:pointer;
}
.burger i{ height:1px; background:var(--text); transition:transform var(--t),opacity var(--t); }
.burger[aria-expanded="true"] i:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.burger[aria-expanded="true"] i:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] i:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

.drawer{
  position:fixed; inset:0; z-index:49; background:var(--bg);
  display:grid; place-items:center; opacity:0; visibility:hidden;
  transition:opacity var(--t),visibility var(--t);
}
.drawer.is-open{ opacity:1; visibility:visible; }
.drawer ul{ list-style:none; margin:0; padding:0; text-align:center; }
.drawer li{ margin-block:.35rem; }
.drawer a{
  font-family:var(--serif); font-size:clamp(1.9rem,7vw,2.6rem); text-decoration:none;
  display:block; padding:.3rem 1rem;
}
.drawer a:hover{ color:var(--gold); }
.drawer .btn{ margin-top:2rem; }

@media (min-width:62em){
  .nav,.hdr__cta{ display:block; }
  .burger{ display:none; }
  .drawer{ display:none; }
}

/* ============================================================
   HERO
   Todas as 18 fotos sao retrato 2:3. Nao existe nenhuma em
   paisagem. Por isso a home NAO tem banner largo: o formato
   natural aqui e o hero dividido. Isso e restricao do material,
   nao gosto.
   ============================================================ */
.hero{ position:relative; padding-block:clamp(3rem,8vw,6rem) clamp(3.5rem,9vw,7rem); overflow:hidden; }
.hero::before{
  content:''; position:absolute; top:-18%; right:-22%; width:70vw; height:70vw; max-width:820px; max-height:820px;
  border-radius:50%; background:radial-gradient(circle at 30% 30%,var(--sage-soft),transparent 68%);
  opacity:.9; pointer-events:none;
}
.hero__grid{ position:relative; display:grid; gap:clamp(2.5rem,6vw,4rem); align-items:center; }

.hero__name{
  font-size:clamp(3.1rem,13vw,7.2rem); line-height:.9; letter-spacing:-.035em; margin:0 0 1.4rem;
}
.hero__name em{ font-style:italic; color:var(--gold); display:block; }
.hero__lead{ font-size:clamp(1.05rem,.98rem + .45vw,1.3rem); color:var(--muted); max-width:38ch; margin-bottom:2rem; }
.hero__acts{ display:flex; flex-wrap:wrap; gap:.85rem; }

/* Retrato em arco. E o gesto visual que carrega o site inteiro:
   repete nas secoes e da unidade sem precisar de logo -- que
   ela ainda nao tem. */
.portrait{ position:relative; justify-self:center; width:min(100%,430px); }
.portrait__img{
  position:relative; z-index:2; border-radius:var(--arch) var(--arch) var(--round) var(--round);
  overflow:hidden; background:var(--paper-2); box-shadow:0 40px 80px -40px rgba(23,23,27,.45);
}
.portrait__img img{ width:100%; aspect-ratio:2/3; object-fit:cover; object-position:50% 12%; }
.portrait::before{
  content:''; position:absolute; z-index:1; inset:1.7rem -1.7rem -1.7rem 1.7rem;
  border:1px solid var(--gold); border-radius:var(--arch) var(--arch) var(--round) var(--round);
}
.portrait::after{
  content:''; position:absolute; z-index:0; inset:-1rem 1.4rem 3rem -1.4rem;
  background:var(--sage-soft); border-radius:var(--arch) var(--arch) var(--round) var(--round);
}

/* Cartao de credencial flutuante -- o CRO exposto de forma
   elegante. O CFO exige nome + CRO com UF visiveis. */
.cred{
  position:relative; z-index:3; margin:-2.6rem auto 0; width:max-content; max-width:92%;
  background:var(--panel); border:1px solid var(--line); border-radius:999px;
  padding:.7rem 1.4rem; display:flex; align-items:center; gap:.75rem;
  box-shadow:0 18px 40px -24px rgba(23,23,27,.5);
}
.cred b{ font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; font-weight:700; }
.cred span{ font-size:.72rem; letter-spacing:.1em; color:var(--muted); }
.cred i{ width:5px; height:5px; background:var(--gold); transform:rotate(45deg); flex:none; }

@media (min-width:56em){
  .hero__grid{ grid-template-columns:1.05fr .85fr; gap:clamp(3rem,6vw,6rem); }
  .portrait{ justify-self:end; }
}

/* ============================================================
   FAIXA DE FATOS
   ============================================================ */
.facts{ border-block:1px solid var(--line-2); background:var(--paper-2); }
.facts__in{ display:grid; gap:0; }
.facts__i{ padding:1.6rem var(--gutter); border-bottom:1px solid var(--line-2); }
.facts__i:last-child{ border-bottom:0; }
.facts__k{ font-size:.6rem; letter-spacing:.22em; text-transform:uppercase; color:var(--muted-2); margin-bottom:.5rem; }
.facts__v{ font-family:var(--serif); font-size:1.15rem; }
@media (min-width:48em){
  .facts__in{ grid-template-columns:repeat(4,1fr); padding-inline:0; }
  .facts__i{ border-bottom:0; border-right:1px solid var(--line-2); padding-inline:clamp(1rem,2.5vw,2rem); }
  .facts__i:last-child{ border-right:0; }
  .facts{ padding-inline:var(--gutter); }
}

/* ============================================================
   SECOES
   ============================================================ */
.sec{ padding-block:clamp(4rem,11vw,8rem); }
.sec--alt{ background:var(--paper-2); }
.sec__head{ max-width:var(--measure); margin-bottom:clamp(2.5rem,6vw,4rem); }
.sec__head--c{ margin-inline:auto; text-align:center; }
.sec__t{ font-size:clamp(2rem,1.5rem + 2.4vw,3.5rem); margin-bottom:1.1rem; }
.sec__t em{ font-style:italic; color:var(--gold); }
.sec__d{ color:var(--muted); font-size:1.05rem; }

/* --- Sobre --- */
.about{ display:grid; gap:clamp(2.5rem,6vw,4.5rem); align-items:center; }
.about__txt p{ color:var(--muted); }
.about__txt p:first-of-type{ color:var(--text); font-size:clamp(1.15rem,1.05rem + .5vw,1.45rem); font-family:var(--serif); line-height:1.45; }
.quote{
  margin:2.2rem 0 0; padding-left:1.5rem; border-left:2px solid var(--gold);
  font-family:var(--serif); font-style:italic; font-size:1.15rem; color:var(--text);
}
.quote cite{ display:block; font-style:normal; font-family:var(--sans); font-size:.66rem;
  letter-spacing:.2em; text-transform:uppercase; color:var(--muted-2); margin-top:.9rem; }
@media (min-width:56em){ .about{ grid-template-columns:.85fr 1fr; } }

/* Retrato menor, usado nas secoes internas. O arco encolhe junto,
   senao ele fica desproporcional numa foto pequena. */
.portrait--sm{ width:min(100%,330px); --arch:10rem; }
.portrait--sm::before{ inset:1.2rem -1.2rem -1.2rem 1.2rem; }
.portrait--sm::after{ inset:-.8rem 1rem 2.2rem -1rem; }
/* Sobre fundo escuro o bloco salvia some; vira dourado translucido. */
.portrait--dark::after{ background:rgba(201,169,112,.16); }

/* Cabeca de secao em duas colunas: texto + retrato */
.duo{ display:grid; gap:clamp(2rem,5vw,3.5rem); align-items:center;
  margin-bottom:clamp(2.5rem,6vw,4rem); }
.duo .portrait{ justify-self:center; }
@media (min-width:56em){
  .duo{ grid-template-columns:1fr .58fr; }
  .duo .portrait{ justify-self:end; }
}

/* --- Formacao --- */
.forma{ display:grid; gap:0; border-top:1px solid var(--line); }
.forma__i{
  display:grid; grid-template-columns:auto 1fr; gap:1.2rem; align-items:baseline;
  padding:1.5rem 0; border-bottom:1px solid var(--line); transition:padding var(--t);
}
.forma__i:hover{ padding-inline:.6rem; }
.forma__n{ font-size:.66rem; letter-spacing:.16em; color:var(--gold); font-weight:700; font-variant-numeric:tabular-nums; }
.forma__t{ font-family:var(--serif); font-size:clamp(1.15rem,1.05rem + .4vw,1.5rem); }
.forma__m{ display:inline-block; margin-left:.7rem; font-family:var(--sans); font-size:.58rem;
  letter-spacing:.16em; text-transform:uppercase; color:var(--sage-deep);
  border:1px solid var(--sage); border-radius:999px; padding:.25rem .6rem; vertical-align:middle; }
@media (min-width:48em){ .forma{ grid-template-columns:1fr 1fr; column-gap:clamp(2rem,5vw,4rem); } }

/* Nota do CFO -- fica visivel de proposito. */
.note{
  margin-top:2.5rem; padding:1.2rem 1.4rem; border:1px solid var(--line);
  border-left:2px solid var(--sage); border-radius:var(--round);
  font-size:.9rem; color:var(--muted); background:var(--panel);
}

/* --- Onde atendo --- */
.where{ display:grid; gap:clamp(2rem,5vw,3.5rem); align-items:center; }
.where__card{
  background:var(--panel); border:1px solid var(--line); border-radius:var(--round);
  padding:clamp(1.8rem,4vw,2.8rem); box-shadow:0 30px 70px -50px rgba(23,23,27,.55);
}
.where__row{ display:flex; gap:1rem; padding-block:1.1rem; border-bottom:1px solid var(--line-2); }
.where__row:last-of-type{ border-bottom:0; }
.where__row svg{ width:1.15rem; height:1.15rem; fill:none; stroke:var(--gold); stroke-width:1.4; flex:none; margin-top:.25rem; }
.where__k{ font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted-2); margin-bottom:.3rem; }
.where__v{ font-family:var(--serif); font-size:1.1rem; }
.where__v a{ text-decoration:none; }
.where__v a:hover{ color:var(--gold); }
.where .portrait{ justify-self:center; }
@media (min-width:56em){
  .where{ grid-template-columns:.72fr 1.28fr; }
  .where .portrait{ justify-self:start; }
}

/* --- Blog --- */
.posts{ display:grid; gap:2rem; }
.post{ display:flex; flex-direction:column; text-decoration:none; }
.post__thumb{ border-radius:var(--round); overflow:hidden; background:var(--paper-3); margin-bottom:1.2rem; }
.post__thumb img{ display:block; width:100%; height:auto; object-fit:contain; }
.post__meta{ font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted-2); margin-bottom:.7rem; }
.post__t{ font-family:var(--serif); font-size:1.35rem; margin-bottom:.6rem; transition:color var(--t); }
.post:hover .post__t{ color:var(--gold); }
.post__x{ color:var(--muted); font-size:.95rem; }
@media (min-width:48em){ .posts{ grid-template-columns:repeat(3,1fr); gap:clamp(1.5rem,3vw,2.5rem); } }

.empty{
  text-align:center; padding:clamp(3rem,8vw,5rem) 1.5rem; border:1px dashed var(--line);
  border-radius:var(--round); color:var(--muted);
}
.empty b{ display:block; font-family:var(--serif); font-size:1.6rem; color:var(--text); margin-bottom:.7rem; font-weight:400; }

/* --- Chamada final --- */
.cta{ position:relative; background:var(--ink); color:var(--paper); overflow:hidden; }
.cta::before{
  content:''; position:absolute; left:50%; top:-40%; width:60rem; height:60rem; transform:translateX(-50%);
  background:radial-gradient(circle,rgba(169,133,74,.22),transparent 62%); pointer-events:none;
}
.cta__in{ position:relative; padding-block:clamp(4rem,10vw,7rem);
  display:grid; gap:clamp(2.5rem,6vw,4rem); align-items:center; }
.cta__txt{ text-align:center; }
.cta .eyebrow{ color:rgba(248,246,242,.6); justify-content:center; }
.cta .eyebrow::before,.cta .eyebrow::after{ background:var(--gold-hi); }
.cta .eyebrow::after{ content:''; width:1.9rem; height:1px; flex:none; }
.cta h2{ font-size:clamp(2.1rem,1.5rem + 3vw,4rem); margin-bottom:1.3rem; }
.cta h2 em{ font-style:italic; color:var(--gold-hi); }
.cta p{ color:rgba(248,246,242,.7); max-width:50ch; margin-inline:auto; margin-bottom:2.2rem; }
.cta .hero__acts{ justify-content:center; }
.cta .portrait{ justify-self:center; }
@media (min-width:56em){
  .cta__in{ grid-template-columns:1.15fr .68fr; }
  .cta__txt{ text-align:left; }
  .cta .eyebrow{ justify-content:flex-start; }
  .cta .eyebrow::after{ display:none; }
  .cta p{ margin-inline:0; }
  .cta .hero__acts{ justify-content:flex-start; }
  .cta .portrait{ justify-self:end; }
}
.cta .btn--solid{ background:var(--gold-hi); color:var(--ink); }
.cta .btn--solid:hover{ background:var(--paper); }
.cta .btn--ghost{ border-color:rgba(248,246,242,.28); color:var(--paper); }
.cta .btn--ghost:hover{ border-color:var(--gold-hi); color:var(--gold-hi); }

/* ============================================================
   BOTAO FLUTUANTE DE WHATSAPP
   ============================================================ */
.wa{
  position:fixed; right:1.1rem; bottom:1.1rem; z-index:60;
  width:56px; height:56px; border-radius:50%; display:grid; place-items:center;
  background:var(--ink); color:var(--paper); text-decoration:none;
  box-shadow:0 16px 36px -14px rgba(23,23,27,.65);
  transition:transform var(--t),background var(--t);
}
.wa:hover{ transform:scale(1.08); background:var(--gold); color:var(--ink); }
.wa svg{ width:26px; height:26px; fill:currentColor; }
@media (min-width:62em){ .wa{ right:1.8rem; bottom:1.8rem; } }

/* ============================================================
   BLOG (listagem, post, pagina)
   ============================================================ */
.phead{ padding-block:clamp(3rem,8vw,5.5rem) clamp(2rem,5vw,3rem); }
.phead h1{ font-size:clamp(2.2rem,1.6rem + 3vw,4rem); }
.phead h1 em{ font-style:italic; color:var(--gold); }
.phead p{ color:var(--muted); max-width:var(--measure); margin-top:1rem; }

.entry{ max-width:min(72ch,100%); margin-inline:auto; }
.entry__hero{ border-radius:var(--round); overflow:hidden; margin-bottom:2.5rem; }
.entry__meta{ font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted-2); margin-bottom:1rem; }
.entry h1{ font-size:clamp(2rem,1.5rem + 2.4vw,3.2rem); margin-bottom:1.2rem; }
.entry__in{ font-size:1.06rem; }
.entry__in h2{ font-size:1.75rem; margin:2.4rem 0 .9rem; }
.entry__in h3{ font-size:1.35rem; margin:2rem 0 .7rem; }
.entry__in ul,.entry__in ol{ padding-left:1.3rem; margin:0 0 1.05em; }
.entry__in li{ margin-bottom:.45em; }
.entry__in blockquote{
  margin:2rem 0; padding-left:1.5rem; border-left:2px solid var(--gold);
  font-family:var(--serif); font-style:italic; font-size:1.2rem;
}
.entry__in img{ border-radius:var(--round); margin-block:1.8rem; }
.entry__in a{ color:var(--gold); }
.entry__in code{ font-size:.9em; background:var(--paper-2); padding:.15em .4em; border-radius:3px; }
.entry__in hr{ border:0; border-top:1px solid var(--line); margin:2.5rem 0; }

.pager{ display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  margin-top:clamp(3rem,7vw,5rem); padding-top:2rem; border-top:1px solid var(--line); }
.pager a{ font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; font-weight:600; text-decoration:none; color:var(--muted); }
.pager a:hover{ color:var(--gold); }

.srch{ display:flex; gap:.5rem; max-width:26rem; }
.srch input{
  flex:1; padding:.8rem 1rem; border:1px solid var(--line); border-radius:999px;
  background:var(--panel); color:var(--text); font:inherit; font-size:.95rem;
}
.srch button{
  padding:.8rem 1.3rem; border:0; border-radius:999px; background:var(--ink); color:var(--paper);
  font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; font-weight:600; cursor:pointer;
}

/* ============================================================
   RODAPE
   ============================================================ */
.foot{ background:var(--ink); color:rgba(248,246,242,.72); padding-block:clamp(3rem,7vw,4.5rem) 2rem; }
.foot__grid{ display:grid; gap:2.5rem; }
.foot__brand b{ font-family:var(--serif); font-size:1.5rem; font-weight:400; color:var(--paper); display:block; }
.foot__brand b em{ font-style:italic; color:var(--gold-hi); }
.foot__brand span{ font-size:.6rem; letter-spacing:.22em; text-transform:uppercase; color:rgba(248,246,242,.5); display:block; margin-top:.6rem; }
.foot h4{ font-size:.6rem; letter-spacing:.22em; text-transform:uppercase; color:rgba(248,246,242,.5);
  margin:0 0 1rem; font-family:var(--sans); font-weight:700; }
.foot ul{ list-style:none; margin:0; padding:0; }
.foot li{ margin-bottom:.6rem; }
.foot a{ text-decoration:none; transition:color var(--t); }
.foot a:hover{ color:var(--gold-hi); }
.foot__bot{
  margin-top:clamp(2.5rem,6vw,3.5rem); padding-top:1.8rem; border-top:1px solid rgba(248,246,242,.12);
  display:flex; flex-direction:column; gap:1rem; font-size:.78rem; color:rgba(248,246,242,.45);
}
.foot__legal{ max-width:70ch; line-height:1.6; }
@media (min-width:48em){ .foot__grid{ grid-template-columns:1.4fr 1fr 1fr; gap:clamp(2rem,5vw,4rem); } }
@media (min-width:62em){ .foot__bot{ flex-direction:row; justify-content:space-between; align-items:center; } }

/* ============================================================
   WORDPRESS -- classes obrigatorias
   ============================================================ */
.alignleft{ float:left; margin:.4rem 1.6rem 1rem 0; }
.alignright{ float:right; margin:.4rem 0 1rem 1.6rem; }
.aligncenter{ margin-inline:auto; }
.wp-caption{ max-width:100%; }
.wp-caption-text,.screen-reader-text:focus{ font-size:.82rem; color:var(--muted); text-align:center; }
.screen-reader-text{
  position:absolute!important; width:1px; height:1px; overflow:hidden;
  clip:rect(1px,1px,1px,1px); white-space:nowrap;
}
.sticky,.gallery-caption,.bypostauthor{ display:block; }