/* =====================================================================
   VOZIS · página Sobre nós (sobre.html / sobre-en.html)
   Usada junto com paginas.css. Conteúdo em conteudo/sobre.html.
   Layout centralizado: cada seção abre com etiqueta + título no eixo central.
   ===================================================================== */
.so{padding:clamp(112px,11vw,150px) 0 var(--sec)}
.so-k{display:inline-flex;align-items:center;gap:8px;font:500 12px/1 var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--blue)}
.so-k i{width:7px;height:7px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 4px rgba(3,61,255,.14)}

/* abertura */
.so-hero{max-width:980px;margin-inline:auto;text-align:center}
.so-hero h1{margin-top:22px;font:500 clamp(56px,9vw,120px)/.96 var(--f-display);letter-spacing:-.04em;color:#0A0A0A}
.so-hero h1 em{font-style:normal;color:var(--blue)}
.so-hero p{margin:32px auto 0;max-width:34ch;font:400 clamp(20px,2.1vw,26px)/1.42 var(--f-body);letter-spacing:-.02em;color:#0A0A0A;text-wrap:balance}

/* seções: etiqueta e título centralizados */
.so-s{padding-top:clamp(96px,11vw,152px);text-align:center}
.so-s>h2{margin:18px auto 0;max-width:20ch;font:500 clamp(34px,4.4vw,58px)/1.04 var(--f-display);letter-spacing:-.03em;color:#0A0A0A;text-wrap:balance}
.so-sub{margin:20px auto 0;max-width:40ch;font:400 clamp(18px,1.8vw,21px)/1.5 var(--f-body);letter-spacing:-.015em;color:rgba(10,10,10,.66);text-wrap:balance}

/* narrativa */
.so-prosa{margin:clamp(32px,4vw,44px) auto 0;max-width:620px;font:400 clamp(18px,1.6vw,20px)/1.65 var(--f-body);letter-spacing:-.012em;color:#1A1A1A;text-wrap:pretty}
.so-prosa p+p{margin-top:20px}
.so-prosa strong{font-weight:600;color:#0A0A0A}
.so-prosa p:last-child{margin-top:28px;font:500 clamp(22px,2.2vw,28px)/1.25 var(--f-display);letter-spacing:-.02em;color:#0A0A0A}

/* três atos */
.so-eras{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:clamp(44px,5vw,64px);text-align:left}
.so-eras article{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;padding:clamp(24px,2.8vw,34px);border-radius:26px;background:#F6F6F4;box-shadow:inset 0 0 0 1px rgba(26,26,26,.06)}
.so-eras span{font:500 12px/1 var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:rgba(10,10,10,.45)}
.so-eras h3{margin-top:18px;font:500 clamp(24px,2.3vw,30px)/1.1 var(--f-display);letter-spacing:-.015em;color:#0A0A0A}
.so-eras p{margin-top:12px;font:400 16px/1.6 var(--f-body);color:rgba(10,10,10,.66)}
.so-eras b{display:block;margin-top:auto;padding-top:22px;font:500 15px/1.3 var(--f-body);color:#0A0A0A}
.so-eras b::before{content:"";display:block;width:28px;height:2px;margin-bottom:12px;background:rgba(10,10,10,.25)}
.so-eras .on{background:#0A3BFF;box-shadow:0 36px 70px -42px rgba(3,30,140,.6)}
.so-eras .on .liq{position:absolute;inset:0;z-index:-1;display:block;width:100%;height:100%}
.so-eras .on span{color:rgba(255,255,255,.75)}
.so-eras .on h3,.so-eras .on b{color:#fff}
.so-eras .on p{color:rgba(255,255,255,.9)}
.so-eras .on b::before{background:rgba(255,255,255,.6)}

/* frase de fechamento da narrativa */
.so-frase{margin:clamp(56px,7vw,96px) auto 0;max-width:24ch;font:500 clamp(28px,3.4vw,44px)/1.14 var(--f-display);letter-spacing:-.025em;color:#0A0A0A;text-wrap:balance}
.so-frase em{font-style:normal;color:var(--blue)}

/* crenças */
.so-bel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:1040px;margin:clamp(40px,4.6vw,56px) auto 0;text-align:left}
.so-bel article{padding:clamp(24px,3vw,34px);border-radius:26px;background:#F6F6F4;box-shadow:inset 0 0 0 1px rgba(26,26,26,.06)}
.so-bel span{font:500 13px/1 var(--f-body);font-variant-numeric:tabular-nums;color:var(--blue)}
.so-bel h3{margin-top:22px;font:500 clamp(24px,2.4vw,30px)/1.12 var(--f-display);letter-spacing:-.015em;color:#0A0A0A}
.so-bel p{margin-top:12px;font:400 16.5px/1.6 var(--f-body);color:rgba(10,10,10,.66)}

/* números */
.so-nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(40px,4.6vw,56px);border-block:1px solid var(--line)}
.so-nums div{padding:clamp(28px,3.2vw,40px) clamp(12px,2vw,28px)}
.so-nums div+div{border-left:1px solid var(--line)}
.so-nums b{display:block;font:500 clamp(40px,4.8vw,64px)/1 var(--f-display);letter-spacing:-.03em;color:#0A0A0A}
.so-nums b em{font-style:normal;color:var(--blue)}
.so-nums span{display:block;max-width:22ch;margin:14px auto 0;font:400 15px/1.4 var(--f-body);color:rgba(10,10,10,.6);text-wrap:balance}

/* fundadores */
.so-fun{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2.4vw,28px);max-width:860px;margin:clamp(40px,4.6vw,56px) auto 0}
.so-p{display:flex;flex-direction:column;border-radius:28px;overflow:hidden;background:#F6F6F4;box-shadow:inset 0 0 0 1px rgba(26,26,26,.06)}
.so-p figure{margin:0;position:relative;aspect-ratio:4/5;overflow:hidden;background:#E9E9E5}
.so-p figure img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.so-p:hover figure img{transform:scale(1.03)}
.so-pb{display:flex;flex-direction:column;align-items:center;flex:1;padding:clamp(24px,2.8vw,32px)}
.so-pb h3{font:500 clamp(28px,3vw,36px)/1.05 var(--f-display);letter-spacing:-.02em;color:#0A0A0A}
.so-pb .rl{margin-top:8px;font:500 15px/1.3 var(--f-body);color:var(--blue)}
.so-pb ul{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:18px 0 0;padding:0;list-style:none}
.so-pb li{padding:6px 11px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px rgba(26,26,26,.08);font:500 12.5px/1 var(--f-body);color:rgba(10,10,10,.7)}
.so-li{margin-top:auto;display:inline-flex;align-items:center;gap:9px;padding:11px 16px 11px 13px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px rgba(26,26,26,.1);font:500 14.5px/1 var(--f-body);color:#0A0A0A;text-decoration:none;transition:background-color .2s,color .2s,box-shadow .2s}
.so-pb ul+.so-li{margin-top:24px}
.so-li svg{width:18px;height:18px;color:#0A66C2}
.so-li:hover{background:var(--blue-soft);color:var(--blue);box-shadow:inset 0 0 0 1px rgba(3,61,255,.2)}

/* a dupla: frase e texto empilhados no centro */
.so-pair{max-width:660px;margin:clamp(64px,8vw,104px) auto 0}
.so-pair blockquote{margin:0;font:500 clamp(32px,4vw,52px)/1.08 var(--f-display);letter-spacing:-.03em;color:#0A0A0A;text-wrap:balance}
.so-pair blockquote em{font-style:normal;color:var(--blue)}
.so-pair p{margin-top:24px;font:400 clamp(17px,1.5vw,19px)/1.65 var(--f-body);color:rgba(10,10,10,.66);text-wrap:pretty}

/* logos */
.so-logos{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin-top:clamp(40px,4.6vw,56px);border-radius:24px;overflow:hidden;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.so-logos span{display:grid;place-items:center;height:110px;padding:18px;box-shadow:inset -1px -1px 0 var(--line)}
.so-logos img{max-width:100%;width:auto;object-fit:contain;filter:grayscale(1) contrast(1.15);opacity:.62;transition:filter .3s,opacity .3s}
.so-logos span:hover img{filter:none;opacity:1}
.so-logos .claro img{filter:grayscale(1) brightness(.5) contrast(1.4)}

/* onde estamos */
.so-where{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:clamp(40px,4.6vw,56px)}
.so-where div{padding:30px 26px;border-radius:22px;box-shadow:inset 0 0 0 1px var(--line)}
.so-where b{display:block;font:500 20px/1.2 var(--f-display);color:#0A0A0A}
.so-where span{display:block;max-width:30ch;margin:10px auto 0;font:400 15px/1.5 var(--f-body);color:rgba(10,10,10,.6);text-wrap:balance}
.so .cta{margin-top:clamp(96px,11vw,152px)}

@media (max-width:900px){
  .so-eras,.so-bel{grid-template-columns:minmax(0,1fr)}
  .so-fun{grid-template-columns:minmax(0,1fr);max-width:440px}
  .so-nums{grid-template-columns:repeat(2,minmax(0,1fr))}
  .so-nums div:nth-child(3){border-left:0}
  .so-nums div:nth-child(n+3){border-top:1px solid var(--line)}
  .so-logos{grid-template-columns:repeat(4,minmax(0,1fr))}
  .so-where{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:520px){
  .so-logos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .so-logos span{height:92px}
}