/* Fontes no próprio servidor: sem pedido a terceiro, sem atraso de render */
@font-face{font-family:'Merriweather';font-style:normal;font-weight:300;font-display:swap;src:url(fonts/merriweather-latin-300-normal.woff2) format('woff2')}
@font-face{font-family:'Merriweather';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/merriweather-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Merriweather';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/merriweather-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/jost-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/jost-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/jost-latin-600-normal.woff2) format('woff2')}

/* Fontes hospedadas no próprio site — sem pedido ao Google, sem terceiro, sem atraso de render */
:root{
  --papel:#FAF8F4;
  --papel-2:#F1EDE4;
  --branco:#FFFFFF;
  --tinta:#1B1A17;
  --texto:#3A3833;
  --suave:#6E6B64;
  --verde:#366D31;
  --verde-fundo:#2A5527;
  --verde-claro:#4E9E47;
  --linha:rgba(27,26,23,.13);
  --serif:"Merriweather",Georgia,serif;
  --geo:"Jost",system-ui,-apple-system,sans-serif;
  --mx:clamp(1.25rem,6vw,7rem);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--papel);
  color:var(--texto);
  font-family:var(--serif);
  font-weight:300;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{background:var(--verde);color:#fff}
a{color:inherit}
img,svg{display:block;max-width:100%}


/* ---------- header ---------- */
/* Barra branca, sempre igual: separa da camada 1 (creme) e não muda de altura ao
   rolar — era a mudança de tamanho que fazia a marca balançar lá em cima. */
header{
  position:sticky;top:0;z-index:60;
  display:flex;align-items:center;justify-content:space-between;
  gap:.6rem;
  padding:.7rem var(--mx);
  background:var(--branco);
  border-bottom:1px solid var(--linha);
}
.brand{display:inline-flex;align-items:center;min-height:44px;color:var(--verde);text-decoration:none}
.brand svg{height:22px;width:auto} /* +15% a pedido do Marcelo */
.head-right{display:flex;align-items:center;gap:clamp(.1rem,1.2vw,.55rem)}
.navlink{
  font-family:var(--geo);font-weight:500;font-size:.78rem;
  letter-spacing:.16em;text-transform:uppercase;
  color:var(--tinta);text-decoration:none;
  display:inline-flex;align-items:center;min-height:44px;
  padding:0 .5rem;
  transition:color .2s;
  white-space:nowrap;
}
.navlink:hover,.navlink:focus-visible{color:var(--verde)}
.lang-curto{display:none}
.icon{
  width:44px;height:44px;
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--tinta);background:none;border:0;cursor:pointer;
  transition:color .2s;
}
.icon svg{width:19px;height:19px}
.icon:hover,.icon:focus-visible{color:var(--verde)}
:focus-visible{outline:2px solid var(--verde);outline-offset:3px;border-radius:2px}

/* ---------- camadas ---------- */
.camada{padding:clamp(2.7rem,5.5vw,4.2rem) var(--mx);border-top:1px solid var(--linha)}
.camada--tint{background:var(--papel-2)}
.camada--hero{
  border-top:0;
  padding-top:clamp(1.6rem,3.5vw,2.6rem);
  padding-bottom:clamp(3.4rem,7vw,5.5rem);
}

/* ---------- camada 1 ---------- */
.hero{
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:clamp(1.8rem,4vw,4rem);
  align-items:center;
  max-width:1180px;margin:0 auto;
}
.hero__foto{
  width:100%;height:auto;
  border-radius:3px;
  box-shadow:0 18px 44px rgba(27,26,23,.13);
}
.hero .hero__nome{
  font-family:var(--geo);font-weight:500;
  font-size:clamp(2.1rem,6vw,3.5rem);
  line-height:1.04;letter-spacing:-.015em;
  color:var(--tinta);
  margin-bottom:clamp(1.1rem,2vw,1.6rem);
}
.hero p{
  font-size:clamp(1rem,1.5vw,1.16rem);
  line-height:1.72;
  max-width:38ch;
}
.hero p + p{margin-top:.85rem}
.hero__papel{color:var(--tinta)}
.hero a{color:var(--verde);text-decoration:none;border-bottom:1px solid rgba(54,109,49,.35);transition:border-color .2s}
.hero a:hover,.hero a:focus-visible{border-bottom-color:var(--verde)}
.hero__mais{
  margin-top:clamp(1.6rem,3vw,2.4rem);
  font-family:var(--geo);font-weight:400;font-size:.92rem;
  color:var(--suave);
  display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;
}
.hero__mais a{
  font-weight:600;font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--verde);text-decoration:none;border:0;
  border-bottom:1px solid rgba(54,109,49,.4);
  padding-bottom:2px;
}

/* ---------- camada 2 ---------- */
.faixa{
  display:grid;
  grid-template-columns:minmax(0,auto) minmax(0,1fr);
  gap:clamp(1.4rem,4vw,3.4rem);
  align-items:center;
  max-width:1180px;margin:0 auto;
}
.faixa__logo svg{height:clamp(44px,5.2vw,60px);width:auto}
.faixa p{
  font-size:clamp(1rem,1.45vw,1.14rem);
  line-height:1.72;max-width:52ch;
}
.faixa strong{font-weight:700;color:var(--tinta)}
.faixa__assina{
  display:inline-block;margin-top:.75rem;
  font-family:var(--geo);font-size:.82rem;letter-spacing:.06em;
  color:var(--verde);text-decoration:none;
  border-bottom:1px solid rgba(54,109,49,.35);
  padding-bottom:2px;
}
.faixa__assina:hover{border-bottom-color:var(--verde)}

/* ---------- camada 3 ---------- */
.conselhos{max-width:1180px;margin:0 auto}
.rotulo{
  font-family:var(--geo);font-weight:500;font-size:.72rem;
  letter-spacing:.24em;text-transform:uppercase;color:var(--verde);
  display:inline-flex;align-items:center;gap:.7em;
  margin-bottom:clamp(1.3rem,2.4vw,1.9rem);
}
.rotulo::before{content:"";width:1.9em;height:1px;background:var(--verde)}
.fila{
  display:flex;gap:clamp(.9rem,1.8vw,1.4rem);
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  padding-bottom:.9rem;
  scrollbar-width:thin;
  scrollbar-color:rgba(27,26,23,.22) transparent;
}
.fila::-webkit-scrollbar{height:5px}
.fila::-webkit-scrollbar-thumb{background:rgba(27,26,23,.22);border-radius:3px}
.fila::-webkit-scrollbar-track{background:transparent}
.card{
  flex:0 0 clamp(255px,31%,345px);
  scroll-snap-align:start;
  background:var(--branco);
  border:1px solid var(--linha);
  border-radius:4px;
  padding:clamp(1.15rem,2vw,1.5rem);
  display:flex;flex-direction:column;
}
.card__logo{height:50px;display:flex;align-items:center;margin-bottom:1.1rem}
.card__logo img,.card__logo svg{width:auto}
.card__logo .l-voa{height:27px}
.card__logo .l-exc{height:37px}
.card__logo .l-dig{height:34px}
.card__pais{
  font-family:var(--geo);font-weight:500;font-size:.68rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--suave);
  display:block;margin-bottom:.35rem;
}
.card__cargo{
  font-family:var(--geo);font-weight:600;font-size:.98rem;
  color:var(--tinta);line-height:1.35;margin-bottom:.7rem;
}
.card__desc{font-size:.94rem;line-height:1.65;color:var(--texto)}
.card__fim{margin-top:auto}
.card__link{
  margin-top:.8rem;padding:.5rem 0;
  font-family:var(--geo);font-weight:500;font-size:.8rem;
  letter-spacing:.04em;color:var(--verde);text-decoration:none;
  display:inline-flex;align-items:center;gap:.4em;
}
.card__link .seta{transition:transform .2s}
.card__link:hover .seta,.card__link:focus-visible .seta{transform:translateX(3px)}

/* ---------- camada 4 ---------- */
/* Frase e logo colados, como uma coisa só, centralizados na página. */
.versos{
  max-width:1180px;margin:0 auto;
  display:flex;align-items:center;justify-content:center;
  flex-wrap:wrap;
  gap:.4rem clamp(.8rem,1.6vw,1.2rem);
  text-align:center;
}
.versos p{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(1.12rem,2.1vw,1.45rem);
  line-height:1.5;color:var(--tinta);
}
.versos__link{display:inline-block;flex-shrink:0;padding:.5rem 0;transition:opacity .2s}
.versos__link:hover,.versos__link:focus-visible{opacity:.72}
.versos__link svg{height:clamp(28px,3.4vw,36px);width:auto}

/* ---------- bio ---------- */
.bio{
  padding:clamp(2rem,5vw,3.4rem) var(--mx) clamp(3.5rem,7vw,5.5rem);
  max-width:1180px;margin:0 auto;
}
.bio h1{
  font-family:var(--geo);font-weight:500;
  font-size:clamp(1.8rem,4.4vw,2.7rem);
  line-height:1.1;letter-spacing:-.015em;color:var(--tinta);
  margin-bottom:clamp(1.6rem,3vw,2.4rem);
}
.bio__texto{max-width:62ch}
.bio__texto p{font-size:clamp(1rem,1.45vw,1.11rem);line-height:1.85}
.bio__texto p + p{margin-top:1.15rem}
.bio__texto p:first-child{
  font-size:clamp(1.08rem,1.7vw,1.3rem);
  line-height:1.7;color:var(--tinta);
}
.voltar{
  display:inline-flex;align-items:center;gap:.5em;
  margin-top:clamp(2.2rem,4vw,3rem);
  font-family:var(--geo);font-weight:500;font-size:.8rem;
  letter-spacing:.16em;text-transform:uppercase;
  color:var(--verde);text-decoration:none;
}
.voltar .seta{transition:transform .2s}
.voltar:hover .seta{transform:translateX(-3px)}

/* ---------- footer ---------- */
footer{
  background:var(--tinta);
  color:rgba(250,248,244,.62);
  padding:clamp(1.8rem,3.5vw,2.4rem) var(--mx);
  font-family:var(--geo);font-size:.78rem;letter-spacing:.1em;
  display:flex;align-items:center;justify-content:center;
  gap:.75rem 1.1rem;flex-wrap:wrap;text-align:center;
}
footer a{color:rgba(250,248,244,.86);text-decoration:none;transition:color .2s}
footer a:hover,footer a:focus-visible{color:var(--verde-claro)}
footer .sep{opacity:.34}

/* ---------- modal contato ---------- */
.modal[hidden]{display:none} /* sem isto o display:flex vence o [hidden] e a camada invisível bloqueia a página inteira */
.modal{
  position:fixed;inset:0;z-index:100;
  display:flex;align-items:center;justify-content:center;
  padding:1.2rem;
  background:rgba(27,26,23,.55);
  backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  animation:fade .22s ease both;
}
@keyframes fade{from{opacity:0}to{opacity:1}}
.modal__cx{
  background:var(--papel);border-radius:6px;
  width:100%;max-width:440px;
  max-height:calc(100vh - 2.4rem);overflow-y:auto;
  padding:clamp(1.5rem,4vw,2rem);
  box-shadow:0 24px 60px rgba(27,26,23,.3);
  animation:sobe .28s cubic-bezier(.2,.7,.2,1) both;
  position:relative;
}
@keyframes sobe{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.modal__x{
  position:absolute;top:.4rem;right:.4rem;
  width:44px;height:44px;border:0;background:none;cursor:pointer;
  color:var(--suave);font-size:1.5rem;line-height:1;
}
.modal__x:hover{color:var(--tinta)}
.modal h2{
  font-family:var(--geo);font-weight:500;font-size:1.35rem;
  color:var(--tinta);letter-spacing:-.01em;margin-bottom:.4rem;
}
.modal__sub{font-size:.95rem;color:var(--suave);margin-bottom:1.4rem;line-height:1.55}
.campo{margin-bottom:1rem}
.campo label{
  font-family:var(--geo);font-size:.7rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--suave);
  display:block;margin-bottom:.35rem;
}
.campo input,.campo textarea{
  width:100%;
  font-family:var(--serif);font-weight:300;
  font-size:16px; /* 16px trava o zoom automático do iOS */
  color:var(--tinta);background:var(--branco);
  border:1px solid var(--linha);border-radius:3px;
  padding:.65rem .7rem;transition:border-color .2s;
}
.campo textarea{resize:vertical;min-height:5.2rem;line-height:1.55}
.campo input:focus,.campo textarea:focus{outline:none;border-color:var(--verde)}
.btn{
  width:100%;
  font-family:var(--geo);font-weight:600;font-size:.86rem;
  letter-spacing:.12em;text-transform:uppercase;
  background:var(--verde);color:#fff;
  border:0;border-radius:999px;
  padding:.9rem 1.6rem;cursor:pointer;min-height:48px;
  transition:background .2s,transform .15s;
}
.btn:hover{background:var(--verde-fundo);transform:translateY(-1px)}
.btn[disabled]{opacity:.5;cursor:default;transform:none}
.modal__alt{margin-top:1.1rem;font-size:.86rem;color:var(--suave);line-height:1.5}
.modal__alt a{color:var(--verde);text-decoration:none;border-bottom:1px solid rgba(54,109,49,.35)}
.modal__ok{text-align:left}
.modal__ok h2{margin-bottom:.6rem}
.modal__ok p{font-size:1rem;line-height:1.65;color:var(--texto)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;font-size:16px}
.erro{display:none;margin-top:.7rem;font-family:var(--geo);font-size:.86rem;color:#B0402A}
.erro.show{display:block}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* ---------- responsivo ---------- */
@media(max-width:900px){
  .hero{grid-template-columns:1fr;gap:1.6rem}
  .hero__foto{
    /* trava a altura para o nome e o posicionamento aparecerem sem rolagem */
    max-height:44vh;width:auto;max-width:min(74%,320px);object-fit:cover;object-position:top center;
  }
  .hero p{max-width:52ch}
  .faixa{grid-template-columns:1fr;gap:1.1rem}
}
@media(max-width:620px){
  header{padding-left:1.05rem;padding-right:1.05rem}
  .navlink{font-size:.72rem;letter-spacing:.12em;padding:0 .35rem}
  .lang-longo{display:none}
  .lang-curto{display:inline}
  .head-right{gap:0}
  .icon{width:42px;height:42px}
  .card{flex:0 0 79vw}
  .hero__foto{max-height:38vh}
  footer{font-size:.72rem;letter-spacing:.08em}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .reveal{opacity:1;transform:none}
  html{scroll-behavior:auto}
}