/* Na mídia (/na-midia), bloco da home e vídeos do Sobre. Reaproveita style.css (.cartao, .tag, .meta, .secao...). */

/* player: miniatura + play; o iframe nasce no clique (midia.js) */
.md-player{position:relative;aspect-ratio:16/9;background:var(--preto);overflow:hidden;border-radius:var(--raio)}
.md-player img{width:100%;height:100%;object-fit:cover;transition:transform .4s,opacity .2s}
.md-player:hover img{transform:scale(1.03);opacity:.9}
.md-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.md-play{position:absolute;inset:0;display:grid;place-items:center;text-decoration:none;background:linear-gradient(180deg,rgba(5,5,5,0) 50%,rgba(5,5,5,.45))}
.md-play span{width:68px;height:68px;border-radius:50%;background:var(--lima);display:grid;place-items:center;box-shadow:0 12px 30px -10px rgba(0,0,0,.6);transition:transform .15s,background .15s}
.md-play span::before{content:"";margin-left:5px;border-style:solid;border-width:12px 0 12px 19px;border-color:transparent transparent transparent var(--preto)}
.md-play:hover span,.md-play:focus-visible span{transform:scale(1.08);background:#fff}
.md-play:focus-visible{outline:3px solid var(--lima);outline-offset:-3px}
.cartao-img .md-player,.cartao-img .md-fig{border-radius:0}

/* cabeçalho da página */
.md-cab h1{max-width:14ch;font-size:clamp(40px,7vw,84px);letter-spacing:-.045em;line-height:.98}
.md-numeros{display:flex;flex-wrap:wrap;gap:12px 40px;margin:36px 0 0;padding-top:22px;border-top:1px solid var(--linha)}
.md-numeros div{display:grid;gap:4px}
.md-numeros dt{font:400 12px/1 var(--mono);color:var(--cinza);order:2}
.md-numeros dd{margin:0;font-weight:800;font-size:clamp(34px,4.6vw,52px);letter-spacing:-.04em;line-height:1;color:var(--azul)}

/* faixa "já falamos em": nomes como texto editorial, sem logos */
.md-faixa-sec{background:var(--preto);color:#fff;padding-block:28px}
.md-faixa{display:grid;gap:14px}
.md-faixa .chapeu{color:var(--lima)}
.md-veiculos{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 0;font-weight:700;font-size:clamp(18px,2.2vw,26px);letter-spacing:-.025em;line-height:1.25}
.md-veiculos li{white-space:nowrap}
.md-veiculos li:not(:last-child)::after{content:"/";margin:0 .45em;color:var(--azul);font-weight:400}
.md-faixa-sec .md-veiculos li:not(:last-child)::after{color:#6E62E8}
.md-faixa-clara{padding:22px 0;margin-bottom:32px;border-block:1px solid var(--linha)}
.md-faixa-clara .chapeu{color:var(--azul)}
.md-faixa-clara .md-veiculos{font-size:clamp(16px,1.8vw,21px);color:var(--preto)}

/* destaques */
.md-dests{display:grid;gap:28px 24px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.md-dest{display:grid;gap:14px;align-content:start}
.md-dest h3{font-size:clamp(19px,1.9vw,23px)}
.md-dest-txt{display:grid;gap:8px}
.md-dest-txt p{color:var(--mudo)}
.md-veic{font:400 12px/1.3 var(--mono);color:var(--cinza)}
.md-tags{display:flex;flex-wrap:wrap;gap:6px}
.md-tag-clau{background:var(--azul);color:#fff}
.md-tag-alex{background:var(--petroleo);color:#fff}
.md-tag-ambos{background:var(--lima)}
@media (min-width:900px){
  .md-dests:not(.md-dests-home){grid-template-columns:repeat(3,1fr)}
  .md-dest-g{grid-column:1/-1;grid-template-columns:1.6fr 1fr;gap:32px;align-items:center;padding-bottom:28px;border-bottom:1px solid var(--linha)}
  .md-dest-g h3{font-size:clamp(26px,2.8vw,36px);letter-spacing:-.03em;line-height:1.08}
  .md-dest-g .md-dest-txt p{font-size:17px}
  .md-dests-home{grid-template-columns:repeat(3,1fr)}
}

/* filtros */
.md-filtros{display:grid;gap:12px;margin-bottom:28px}
.md-grupo{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.md-rot{font:400 12px/1 var(--mono);color:var(--cinza);min-width:64px}
.md-grupo button{font:400 13px/1 var(--mono);padding:10px 14px;min-height:40px;border-radius:999px;border:1.5px solid var(--linha);background:#fff;color:var(--preto);cursor:pointer;transition:background .15s,border-color .15s}
.md-grupo button:hover{border-color:var(--preto)}
.md-grupo button[aria-pressed="true"]{background:var(--preto);border-color:var(--preto);color:#fff}
.md-grupo button small{font-size:11px;opacity:.6;margin-left:3px}
.md-grupo button:disabled{opacity:.35;cursor:default}
.md-conta{margin-top:2px}
.md-vazio{padding:28px;text-align:center;color:var(--mudo);background:#fff;border-radius:var(--raio)}
.md-item[hidden],.md-vazio[hidden],.md-filtros[hidden]{display:none}

/* cartões da grade */
.md-grade .corpo h3{font-size:19px}
.md-grade .cartao{transition:border-color .15s}
.md-grade .cartao:hover{transform:none}
.md-fig{margin:0;aspect-ratio:16/9;background:var(--linha);overflow:hidden}
.md-fig img{width:100%;height:100%;object-fit:cover}
.md-fig-vazia,.cartao-img .md-fig-vazia{display:grid;place-content:center;gap:8px;text-align:center;background:var(--petroleo);color:#fff;padding:16px}
.md-fig-vazia span{font:400 12px/1 var(--mono);color:var(--ceu)}
.md-fig-vazia b{font-size:22px;letter-spacing:-.02em;line-height:1.15}
.md-grade a.ir{text-decoration:none}.md-grade a.ir:hover{text-decoration:underline}

/* canal */
.md-vids{display:grid;gap:28px 20px;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.md-vid{display:grid;gap:10px;align-content:start}
.md-vid h3{font-size:17px;line-height:1.3;color:#fff}
.secao-escura .meta{color:#9A9A9A}
.md-aulas .md-vid h3{color:inherit}

/* lista de matérias do blog */
.md-lista{list-style:none;margin:0;padding:0;border-top:1px solid var(--linha)}
.md-lista a{display:grid;gap:4px;padding:16px 0;border-bottom:1px solid var(--linha);text-decoration:none}
.md-lista a b{font-size:19px;letter-spacing:-.02em;line-height:1.25}
.md-lista a:hover b{color:var(--azul)}

.md-convite h2{margin-top:10px}

/* Sobre: o que é o clã */
.sb-duo{display:grid;gap:clamp(24px,4vw,56px);grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr))}
.sb-duo .prosa{font-size:17px}
.sb-duo h2{margin:10px 0 16px}