/* Obrena — página Anúncios (/anuncios/). Só o que é desta página; o compartilhado das internas vive em interna.css. */

/* ===== Hero: copy + anúncio e fluxo em CSS ===== */
.an-hero{position:relative;overflow:hidden;padding:64px 0 96px;background:radial-gradient(50% 60% at 85% 20%,rgba(0,194,168,.18),transparent 70%),var(--bg)}
.an-hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:56px;max-width:var(--max);margin:auto;padding:0 26px}
.an-hero-copy h1{margin:0;font-size:clamp(38px,4.3vw,62px);line-height:1.02;letter-spacing:-.04em}
.an-hero-copy h1 span{color:var(--accent)}
.an-hero-text{max-width:560px;margin:22px 0 0;color:#4c515b;font-size:17px;line-height:1.7}
.an-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}

.an-prova{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"anuncio pagina" "msg pagina";align-items:start;gap:18px 22px}
.an-prova figure{margin:0}
.an-prova-anuncio{grid-area:anuncio}
.an-prova-anuncio img{display:block;width:100%;height:auto;border-radius:16px;border:1.5px solid var(--line);background:#fff;box-shadow:0 26px 50px -36px rgba(14,18,32,.6)}
.an-prova-pagina{grid-area:pagina;justify-self:end;width:100%;max-width:300px}
.an-prova-pagina img{display:block;width:100%;height:auto;border-radius:22px;border:1.5px solid var(--line);box-shadow:0 34px 60px -40px rgba(14,18,32,.6)}
.an-prova figcaption{margin-top:10px;color:#666c77;font-size:12.5px;line-height:1.5}
.an-prova figcaption b,.an-prova-msg b{color:var(--ink);font-weight:800}
.an-prova-msg{grid-area:msg;margin:0;padding:16px 18px;border-radius:16px;background:#fff;border:1.5px solid var(--line);color:#3f4553;font-size:14px;line-height:1.6}
.an-prova-msg q{quotes:"“" "”";font-style:italic;color:var(--ink)}
.an-prova-msg::before{content:"";display:block;width:34px;height:3px;margin-bottom:12px;border-radius:99px;background:#25d366}

.an-quando{padding:104px 0 96px;background:#fff}
.an-colunas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.an-coluna{padding:32px 30px 30px;border-radius:24px;border:1.5px solid var(--line)}
.an-coluna-sim{background:#eef7f5;border-color:#bfe7de}
.an-coluna-nao{background:#fbf1f1;border-color:#efcfcf}
.an-coluna h3{margin:0;font-size:22px;line-height:1.15;letter-spacing:-.025em}
.an-coluna-sim h3{color:#0b7a68}
.an-coluna-nao h3{color:#9b1f2e}
.an-coluna ul{margin:18px 0 0;padding:0;list-style:none}
.an-coluna li{position:relative;padding:11px 0 11px 30px;color:#3f4553;font-size:15.5px;line-height:1.6;border-top:1px solid rgba(14,18,32,.08)}
.an-coluna li::before{content:"";position:absolute;left:2px;top:18px;width:14px;height:14px;border-radius:50%}
.an-coluna-sim li::before{background:#0b7a68}
.an-coluna-sim li::after{content:"";position:absolute;left:6px;top:21px;width:6px;height:3px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg)}
.an-coluna-nao li::before{background:#b3192f}
.an-coluna-nao li::after{content:"";position:absolute;left:6px;top:24px;width:6px;height:2px;background:#fff}
.an-coluna strong{color:var(--ink);font-weight:750}
.an-quando-nota{max-width:820px;margin:28px 0 0;color:#4c515b;font-size:16px;line-height:1.7}

/* ===== Como é feito ===== */
.an-conta{padding:104px 0 110px;background:var(--accent);color:#fff}
.an-conta-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:start}
.an-conta .eyebrow{color:rgba(255,255,255,.75)}
.an-conta .eyebrow::before{background:#fff}
.an-conta-copy h2{margin:0;color:#fff;font-size:clamp(32px,3.4vw,48px);line-height:1.06;letter-spacing:-.035em}
.an-conta-copy h2 span{color:#bfe9ff}
.an-conta-copy p{max-width:520px;margin:18px 0 0;color:rgba(255,255,255,.85);font-size:16.5px;line-height:1.7}
.an-conta-copy p b{color:#fff}
.an-numeros{margin:0;padding:0;list-style:none;counter-reset:num;border-top:1.5px solid rgba(255,255,255,.35)}
.an-numeros li{position:relative;display:grid;grid-template-columns:56px 1fr;gap:6px 18px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,.22);counter-increment:num}
.an-numeros li::before{content:"0" counter(num);grid-row:1/span 2;color:#fff;font-family:var(--display);font-size:34px;font-weight:800;line-height:1;letter-spacing:-.04em;opacity:.9}
.an-numeros b{color:#fff;font-family:var(--display);font-size:20px;letter-spacing:-.02em;line-height:1.15}
.an-numeros span{color:rgba(255,255,255,.85);font-size:15px;line-height:1.6}

/* ===== Larguras ===== */
@media (max-width:1180px){
  .an-hero-inner{gap:36px}
  .an-conta-grid{grid-template-columns:1fr;gap:36px}
}
@media (max-width:960px){
  .an-hero{padding:48px 0 72px}
  .an-hero-inner{grid-template-columns:1fr;gap:44px}
  .an-prova{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .an-quando{padding:84px 0 80px}
  .an-colunas{grid-template-columns:1fr}
  .an-conta{padding:84px 0 90px}
}
@media (max-width:700px){
  .an-hero-inner{padding-inline:18px}
  .an-hero-copy h1{font-size:clamp(33px,9.6vw,46px)}
  .an-hero-text{font-size:15.5px}
  .an-prova{grid-template-columns:1fr;grid-template-areas:"anuncio" "pagina" "msg";gap:18px}
  .an-prova-pagina{justify-self:center;max-width:320px}
  .an-coluna{padding:24px 20px 22px}
  .an-numeros li{grid-template-columns:44px 1fr;padding:18px 0}
  .an-numeros li::before{font-size:28px}
  .an-numeros b{font-size:18px}
}
@media (max-width:390px){
  .an-hero-actions .button{width:100%;min-height:48px;padding:12px 18px;font-size:14px}
}
