/* =============================================================================
   B2 Rocket Layout — Salve Seu Casamento
   Identidade "Amanhecer": terracota sobre areia, títulos em Lora.

   Os tokens abaixo dão a cara do site inteiro. A cor da marca foi escolhida
   para passar em contraste AA sobre a areia (5,3:1) — escurecer ou clarear
   mexe nisso, então confira antes de trocar.
   ========================================================================== */

:root{
  /* marca */
  --brl-cor:        #a84a35;   /* terracota: links, botões, destaques */
  --brl-cor-escura: #8a3a28;   /* hover */
  --brl-cor-clara:  #f6e7e0;   /* fundo de realce */

  /* texto e fundo */
  --brl-texto:      #2a211c;
  --brl-texto-fraco:#6b5d55;
  --brl-fundo:      #faf6f1;   /* areia */
  --brl-fundo-alt:  #f2eae1;
  --brl-papel:      #ffffff;   /* cartões */
  --brl-borda:      #e4d9ce;

  /* tipografia */
  --brl-fonte: "Source Sans 3", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --brl-fonte-titulo: "Lora", Georgia, "Times New Roman", serif;

  /* medidas */
  --brl-largura: 1120px;
  --brl-raio: 14px;
  --brl-gap: 24px;
}

/* ----------------------------------------------------------------- base --- */

*,*::before,*::after{ box-sizing:border-box }

body{
  margin:0;
  font-family:var(--brl-fonte);
  font-size:18px; line-height:1.7;
  color:var(--brl-texto); background:var(--brl-fundo);
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4{
  font-family:var(--brl-fonte-titulo);
  line-height:1.22; margin:0 0 .5em; font-weight:600;
  letter-spacing:-.005em;
}
h1{ font-size:clamp(32px,5vw,52px); font-weight:600 }
h2{ font-size:clamp(25px,3.2vw,34px) }
h3{ font-size:20px }
p{ margin:0 0 1em }

a{ color:var(--brl-cor); text-decoration:none }
a:hover{ text-decoration:underline }
img{ max-width:100%; height:auto; display:block }

:focus-visible{ outline:3px solid var(--brl-cor); outline-offset:2px }

.brl-wrap{ max-width:var(--brl-largura); margin:0 auto; padding:0 20px }
.brl-lead{ font-size:1.15em; color:var(--brl-texto-fraco) }
.brl-so-leitor{
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap;
}

/* Ornamento "~", emprestado do próprio logo. Marca as seções sem pesar. */
.brl-til{
  display:block; font-family:var(--brl-fonte-titulo);
  color:var(--brl-cor); font-size:22px; line-height:1;
  margin-bottom:14px; letter-spacing:.3em;
}

.brl-pular{
  position:absolute; left:-9999px; top:0; z-index:100;
  background:var(--brl-cor); color:#fff; padding:10px 16px;
}
.brl-pular:focus{ left:8px; top:8px }

/* --------------------------------------------------------------- botões --- */

.brl-btn{
  display:inline-block; padding:12px 24px; border-radius:999px;
  font-weight:600; font-size:16px; line-height:1.2; text-decoration:none;
  border:1px solid var(--brl-cor); color:var(--brl-cor); background:transparent;
  cursor:pointer; font-family:var(--brl-fonte);
  transition:background .15s, color .15s;
}
.brl-btn:hover{ background:var(--brl-cor-clara); text-decoration:none }
.brl-btn-cta{ background:var(--brl-cor); color:#fff }
.brl-btn-cta:hover{ background:var(--brl-cor-escura); color:#fff }

/* ------------------------------------------------------------ cabeçalho --- */

.brl-hdr{
  position:sticky; top:0; z-index:50;
  background:var(--brl-fundo); border-bottom:1px solid var(--brl-borda);
}
.brl-hdr-in{ display:flex; align-items:center; gap:var(--brl-gap); min-height:76px }

.brl-logo{ display:flex; align-items:center; text-decoration:none }
.brl-logo img{ max-height:42px; width:auto }
.brl-logo-txt{ font-family:var(--brl-fonte-titulo); font-weight:600; font-size:21px; color:var(--brl-texto) }

.brl-nav{ margin-left:auto }
.brl-menu{ display:flex; gap:26px; list-style:none; margin:0; padding:0; align-items:center }
.brl-menu a{ color:var(--brl-texto); font-size:16px; font-weight:600 }
.brl-menu a:hover{ color:var(--brl-cor); text-decoration:none }

.brl-menu li{ position:relative }
.brl-menu .sub-menu{
  position:absolute; top:100%; left:0; min-width:230px;
  display:none; list-style:none; margin:0; padding:8px 0;
  background:var(--brl-papel); border:1px solid var(--brl-borda);
  border-radius:var(--brl-raio); box-shadow:0 14px 34px rgba(42,33,28,.10);
}
.brl-menu li:hover > .sub-menu, .brl-menu li:focus-within > .sub-menu{ display:block }
.brl-menu .sub-menu a{ display:block; padding:9px 16px; font-weight:400 }

.brl-burger{
  display:none; background:none; border:0; cursor:pointer;
  width:44px; height:44px; padding:10px; margin-left:auto;
}
.brl-burger span{ display:block; height:2px; background:var(--brl-texto); margin:5px 0; border-radius:2px }

.brl-gaveta{ display:none; border-bottom:1px solid var(--brl-borda); background:var(--brl-fundo) }
.brl-gaveta[hidden]{ display:none }
.brl-gaveta.is-on{ display:block }
.brl-gaveta ul{ list-style:none; margin:0; padding:8px 20px 20px }
.brl-gaveta li{ border-bottom:1px solid var(--brl-borda) }
.brl-gaveta a{ display:block; padding:14px 0; color:var(--brl-texto); font-weight:600 }
.brl-gaveta .sub-menu{ padding:0 0 8px 16px }

@media (max-width:980px){
  .brl-nav{ display:none }
  .brl-burger{ display:block }
}

/* --------------------------------------------------------------- seções --- */

.brl-sec{ padding:72px 0 }
.brl-sec-alt{ background:var(--brl-fundo-alt) }
.brl-sec-cab{ max-width:720px; margin:0 0 36px }
.brl-sec-cab p{ color:var(--brl-texto-fraco); margin:0 }

@media (max-width:760px){ .brl-sec{ padding:48px 0 } }

/* -------------------------------------------------------------- abertura --- */

.brl-abre{ padding:84px 0 72px; border-bottom:1px solid var(--brl-borda) }
.brl-abre-in{ max-width:780px }
.brl-abre h1{ margin-bottom:.35em }
.brl-abre .brl-lead{ font-size:1.2em; max-width:620px }

@media (max-width:760px){ .brl-abre{ padding:52px 0 44px } }

/* Busca: num acervo de centenas de textos ela vale mais que qualquer imagem. */
.brl-busca{ display:flex; gap:10px; max-width:520px; margin-top:28px }
.brl-busca input[type="search"]{
  flex:1; min-width:0; font:inherit; font-size:16px;
  padding:13px 18px; border:1px solid var(--brl-borda); border-radius:999px;
  background:var(--brl-papel); color:var(--brl-texto);
}
.brl-busca input[type="search"]::placeholder{ color:var(--brl-texto-fraco) }
.brl-busca input[type="search"]:focus-visible{ outline:3px solid var(--brl-cor); outline-offset:1px }

@media (max-width:520px){
  .brl-busca{ flex-direction:column }
  .brl-busca .brl-btn{ text-align:center }
}

/* -------------------------------------------------------------- trilhas --- */

/* 380px de mínimo dá duas colunas no desktop e uma no celular. Com quatro
   trilhas, três colunas deixariam a quarta sozinha na segunda linha. */
.brl-trilhas{ display:grid; grid-template-columns:repeat(auto-fit,minmax(380px,1fr)); gap:var(--brl-gap) }

.brl-trilha{
  background:var(--brl-papel); border:1px solid var(--brl-borda);
  border-radius:var(--brl-raio); padding:28px 26px;
}
.brl-trilha h3{ font-size:21px; margin-bottom:.6em }
.brl-trilha ol{ margin:0; padding:0; list-style:none; counter-reset:brl-t }
.brl-trilha li{
  counter-increment:brl-t; position:relative;
  padding:9px 0 9px 32px; font-size:16.5px; line-height:1.5;
  border-top:1px solid var(--brl-borda);
}
.brl-trilha li:first-child{ border-top:0 }
.brl-trilha li::before{
  content:counter(brl-t); position:absolute; left:0; top:11px;
  width:22px; height:22px; border-radius:50%;
  background:var(--brl-cor-clara); color:var(--brl-cor);
  font-size:12px; font-weight:600; line-height:22px; text-align:center;
}
.brl-trilha a{ color:var(--brl-texto) }
.brl-trilha a:hover{ color:var(--brl-cor) }

/* A trilha sobre abuso não é mais uma entre cinco: sai da grade, ocupa faixa
   inteira e vem colada ao bloco do 180, para que ninguém a leia como "mais
   dicas de relação". */
.brl-trilha-apoio{ border-color:var(--brl-cor-clara) }
.brl-trilha-apoio .brl-trilha-nota{
  font-size:15px; color:var(--brl-texto-fraco); margin:0 0 16px;
}
.brl-trilha-larga{ background:var(--brl-papel) }
.brl-trilha-larga ol{ columns:2; column-gap:44px }
.brl-trilha-larga li{ break-inside:avoid }
@media (max-width:760px){ .brl-trilha-larga ol{ columns:1 } }

/* ------------------------------------------------- cartões do acervo ------ */

.brl-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:var(--brl-gap) }

.brl-card{
  display:flex; flex-direction:column; overflow:hidden;
  background:var(--brl-papel); border:1px solid var(--brl-borda);
  border-radius:var(--brl-raio); color:inherit; text-decoration:none;
  transition:border-color .15s, transform .15s;
}
a.brl-card:hover{ border-color:var(--brl-cor); text-decoration:none; transform:translateY(-2px) }
.brl-card-img{ aspect-ratio:16/9; background:var(--brl-fundo-alt); overflow:hidden }
.brl-card-img img{ width:100%; height:100%; object-fit:cover }
.brl-card-txt{ padding:20px 22px 24px }
.brl-card h3{ font-size:19px; margin:0 0 .4em; line-height:1.3 }
.brl-card p{ margin:0; font-size:16px; color:var(--brl-texto-fraco); line-height:1.55 }

.brl-etiqueta{
  display:inline-block; margin-bottom:10px;
  font-size:12.5px; font-weight:600; letter-spacing:.09em; text-transform:uppercase;
  color:var(--brl-cor);
}

/* ------------------------------------------------------------ assuntos --- */

.brl-assuntos{ display:flex; flex-wrap:wrap; gap:14px }
.brl-assunto{
  display:flex; align-items:baseline; gap:10px;
  padding:14px 24px; border-radius:999px;
  background:var(--brl-papel); border:1px solid var(--brl-borda);
  color:var(--brl-texto); font-weight:600; font-size:17px; text-decoration:none;
}
.brl-assunto:hover{ border-color:var(--brl-cor); color:var(--brl-cor); text-decoration:none }
.brl-assunto span{ font-weight:400; font-size:15px; color:var(--brl-texto-fraco) }
.brl-assunto:hover span{ color:inherit }

/* --------------------------------------------------------- depoimentos --- */

.brl-depos{ display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:var(--brl-gap) }
.brl-depo{
  background:var(--brl-papel); border:1px solid var(--brl-borda);
  border-radius:var(--brl-raio); padding:26px 26px 22px;
}
.brl-depo blockquote{
  margin:0 0 14px; font-family:var(--brl-fonte-titulo);
  font-size:18px; line-height:1.55; color:var(--brl-texto);
}
.brl-depo figcaption{ font-size:15px; color:var(--brl-texto-fraco) }
.brl-depo-nota{ margin:28px 0 0; font-size:14.5px; color:var(--brl-texto-fraco) }

/* --------------------------------------------------------------- fecho --- */

.brl-fecho{ background:var(--brl-fundo-alt); padding:72px 0; text-align:center }
.brl-fecho p{
  font-family:var(--brl-fonte-titulo); font-size:clamp(21px,3vw,27px);
  line-height:1.45; max-width:720px; margin:0 auto 10px;
}
.brl-fecho cite{ font-style:normal; font-size:16px; color:var(--brl-texto-fraco) }

/* ---------------------------------------------------------------- posts --- */

.brl-fio{ font-size:15px; color:var(--brl-texto-fraco); padding:26px 0 0 }
.brl-fio a{ color:var(--brl-texto-fraco) }
.brl-fio a:hover{ color:var(--brl-cor) }
.brl-fio span{ margin:0 7px; opacity:.6 }

.brl-post-topo{ padding:18px 0 22px }
.brl-post-topo h1{ max-width:820px }
.brl-post-meta{ color:var(--brl-texto-fraco); font-size:15.5px; margin:0 }
.brl-post-capa{ margin-bottom:36px }
/* A capa acompanha a largura de leitura: imagem mais larga que o texto quebra
   a coluna e empurra o começo do artigo para baixo da dobra. */
.brl-post-capa img{ border-radius:var(--brl-raio); width:100%; max-width:760px }

/* Índice do artigo: os textos têm sete seções e são lidos no celular. */
.brl-indice{
  max-width:760px; margin:0 0 36px; padding:22px 26px;
  background:var(--brl-fundo-alt); border-radius:var(--brl-raio);
}
.brl-indice h2{ font-size:15px; text-transform:uppercase; letter-spacing:.09em;
  color:var(--brl-texto-fraco); font-family:var(--brl-fonte); font-weight:600; margin:0 0 12px }
.brl-indice ol{ margin:0; padding-left:20px }
.brl-indice li{ margin-bottom:6px; line-height:1.45 }
.brl-indice a{ color:var(--brl-texto) }
.brl-indice a:hover{ color:var(--brl-cor) }

.brl-prosa{ max-width:760px; font-size:18.5px; line-height:1.78 }
.brl-prosa img{ border-radius:var(--brl-raio); margin:30px 0 }
.brl-prosa h2{ margin-top:1.7em; scroll-margin-top:96px }
.brl-prosa h3{ margin-top:1.5em; scroll-margin-top:96px }
.brl-prosa ul,.brl-prosa ol{ padding-left:24px }
.brl-prosa li{ margin-bottom:.5em }
.brl-prosa blockquote{
  margin:30px 0; padding:4px 0 4px 22px;
  border-left:3px solid var(--brl-cor); color:var(--brl-texto-fraco);
  font-family:var(--brl-fonte-titulo);
}
.brl-prosa a{ text-decoration:underline; text-underline-offset:2px }

.brl-relacionados{ padding:64px 0 72px; border-top:1px solid var(--brl-borda); margin-top:56px }

/* ------------------------------------------------------------- Ligue 180 --- */

/* Bloco completo: fim do artigo, home e página própria. Sóbrio de propósito —
   alarme visual faz o leitor pular. */
.brl-180{
  border:1px solid var(--brl-cor-clara); border-left:4px solid var(--brl-cor);
  background:var(--brl-papel); border-radius:var(--brl-raio);
  padding:28px 30px; max-width:760px;
}
.brl-180 h2{ font-size:22px; margin:0 0 .5em }
.brl-180 p{ font-size:16.5px; line-height:1.6 }
.brl-180 ul{ padding-left:20px; font-size:16.5px }
.brl-180 li{ margin-bottom:.55em; line-height:1.55 }
.brl-180 p:last-child{ margin-bottom:0 }
.brl-180-dest{
  font-family:var(--brl-fonte-titulo); font-size:19px;
  color:var(--brl-cor); font-weight:600;
}

/* A barra fixa mora em assets/css/barra180.css, carregado no site inteiro —
   inclusive nas páginas que o Elementor ainda monta. */

/* --------------------------------------------------------------- rodapé --- */

.brl-ft{
  background:var(--brl-fundo-alt); border-top:1px solid var(--brl-borda);
  padding:56px 0 24px; margin-top:0;
}
.brl-ft-top{ display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:var(--brl-gap) }
@media (max-width:760px){ .brl-ft-top{ grid-template-columns:1fr } }
.brl-ft-nome{ font-family:var(--brl-fonte-titulo); font-size:20px; display:block; margin-bottom:8px }
.brl-ft h4{
  font-family:var(--brl-fonte); font-size:14px; text-transform:uppercase;
  letter-spacing:.09em; color:var(--brl-texto-fraco); margin-bottom:12px;
}
.brl-ft-menu{ list-style:none; margin:0; padding:0 }
.brl-ft-menu li{ margin-bottom:9px }
.brl-ft-menu a{ color:var(--brl-texto) }
.brl-ft-menu a:hover{ color:var(--brl-cor) }
.brl-ft-txt{ color:var(--brl-texto-fraco); font-size:16px }
.brl-ft-bot{
  display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between;
  border-top:1px solid var(--brl-borda); margin-top:36px; padding-top:20px;
  font-size:14.5px; color:var(--brl-texto-fraco);
}
.brl-ft-bot p{ margin:0 }
.brl-ft-bot a{ color:var(--brl-texto-fraco); text-decoration:underline }

/* ------------------------------------------------------------------ 404 --- */

.brl-404{ text-align:center; padding:96px 0 }
.brl-404 .brl-busca{ margin-left:auto; margin-right:auto }

/* ------------------------------------------------------------- impressão --- */

@media print{
  .brl-barra180,.brl-hdr,.brl-gaveta,.brl-relacionados{ display:none }
  body{ padding-bottom:0; background:#fff }
}