/* O que o tema acrescenta ao prototipo. Os estilos do site estao em assets/. */

/* o seletor «Prototipo · ver escuro (PDF)» so' serve no prototipo */
.proto{ display: none !important; }

/* artigo do blogue e paginas de texto corrido (single.php, 404, listagens) */
.uvd-artigo{ max-width: 760px; }
.uvd-artigo > *{ opacity: 1; transform: none; }
.uvd-artigo-meta{ font: 600 12px/1 'JetBrains Mono', ui-monospace, monospace; letter-spacing: .12em; text-transform: uppercase; color: #6B6754; margin: 0 0 28px; }
.uvd-artigo img{ max-width: 100%; height: auto; border-radius: 22px; }
/* a capa pode ser vertical (fotografia de corpo inteiro): nunca passa da altura de um ecra */
.uvd-artigo img.uvd-artigo-capa{ display: block; width: auto; max-width: 100%; max-height: min(860px, 88vh); margin: 0 0 34px; }
.uvd-artigo h2{ font-size: clamp(26px, 3vw, 38px); line-height: 1.1; letter-spacing: -.03em; margin: 46px 0 16px; }
.uvd-artigo h3{ font-size: clamp(20px, 2.2vw, 26px); letter-spacing: -.02em; margin: 34px 0 12px; }
.uvd-artigo p, .uvd-artigo li{ font-size: 18px; line-height: 1.65; }
.uvd-artigo ul, .uvd-artigo ol{ padding-left: 1.2em; margin: 0 0 22px; }
.uvd-artigo li{ margin-bottom: 8px; }
.uvd-artigo a{ color: inherit; text-decoration: underline; text-decoration-color: #F4DF48; text-decoration-thickness: 3px; text-underline-offset: 4px; }
.uvd-artigo blockquote{ margin: 30px 0; padding: 6px 0 6px 22px; border-left: 4px solid #F4DF48; font-size: 21px; font-weight: 600; }
.uvd-artigo figure{ margin: 30px 0; } .uvd-artigo figcaption{ font-size: 14px; color: #6B6754; margin-top: 8px; }
.uvd-lista{ list-style: none; padding: 0; } .uvd-lista li{ padding: 22px 0; border-bottom: 1px solid rgba(20,19,12,.12); } .uvd-lista a{ text-decoration: none; font-size: 22px; }

/* aviso quando um formulario nao chega ao servidor */
.uvd-falhou{ margin: 14px 0 0; padding: 12px 16px; border-radius: 12px; background: #FFE9E5; color: #7A1D10; font-size: 14.5px; font-weight: 600; }

/* O AVISO DE COOKIES (21-09-2026): cartao escuro de vidro, em baixo a' esquerda; os dois botoes com o mesmo peso. */
.uvd-ck{position:fixed;left:20px;bottom:20px;z-index:9000;width:min(380px,calc(100vw - 32px));padding:20px 22px 18px;border-radius:18px;background:rgba(14,14,18,.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.14);box-shadow:0 24px 60px rgba(0,0,0,.45);color:#fff;font-family:'Inter Tight',system-ui,sans-serif}
.uvd-ck[hidden]{display:none}
.uvd-ck-o{margin:0 0 8px;font:600 11px/1 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#F4DF48}
.uvd-ck-t{margin:0 0 16px;font-size:14.5px;line-height:1.5;color:#d9d9de}
.uvd-ck-t a{color:#fff;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.uvd-ck-b{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.uvd-ck-b button{appearance:none;cursor:pointer;border-radius:999px;padding:11px 14px;font:600 14px/1 'Inter Tight',system-ui,sans-serif;border:1px solid rgba(255,255,255,.55);background:transparent;color:#fff;transition:background .2s,color .2s,border-color .2s}
.uvd-ck-b button[data-ck="sim"]{background:#F4DF48;border-color:#F4DF48;color:#08080A}
.uvd-ck-b button:hover,.uvd-ck-b button:focus-visible{background:#fff;border-color:#fff;color:#08080A;outline:none}
.uvd-ck-abre{appearance:none;display:block;margin:0 auto;padding:14px 0 22px;background:none;border:0;cursor:pointer;font:500 12px/1 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.uvd-ck-abre:hover,.uvd-ck-abre:focus-visible{color:#F4DF48;outline:none}
@media (max-width:560px){.uvd-ck{left:16px;right:16px;bottom:16px;width:auto}}

/* O CORPO DOS ARTIGOS (21-09-2026): caixas, tabelas, negritos e fontes, para os artigos novos sairem prontos do editor. */
.uvd-artigo strong{ font-weight: 700; color: #14130C; }
.uvd-artigo p > strong:only-child{ background: linear-gradient(transparent 62%, rgba(244,223,72,.55) 62%); }
.uvd-artigo blockquote{ margin: 30px 0; padding: 22px 26px 8px; border-left: 5px solid #F4DF48; border-radius: 0 18px 18px 0; background: #FFFBE0; font-size: 17px; font-weight: 400; }
.uvd-artigo blockquote p, .uvd-artigo blockquote li{ font-size: 17px; line-height: 1.6; }
.uvd-artigo blockquote > p:first-child > strong:first-child{ display: block; margin-bottom: 4px; font: 600 12px/1.2 'JetBrains Mono', ui-monospace, monospace; letter-spacing: .12em; text-transform: uppercase; color: #6F6200; background: none; }
.uvd-artigo blockquote ul, .uvd-artigo blockquote ol{ margin-bottom: 14px; }
.uvd-artigo ol{ counter-reset: p; list-style: none; padding-left: 0; }
.uvd-artigo ol > li{ counter-increment: p; position: relative; padding-left: 46px; margin-bottom: 14px; }
.uvd-artigo ol > li::before{ content: counter(p, decimal-leading-zero); position: absolute; left: 0; top: 3px; font: 700 12px/1 'JetBrains Mono', ui-monospace, monospace; letter-spacing: .06em; color: #14130C; background: #F4DF48; border-radius: 8px; padding: 6px 7px; }
.uvd-artigo ul > li::marker{ color: #C9B200; }
.uvd-artigo figure.wp-block-table, .uvd-artigo .uvd-tab{ margin: 28px 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.uvd-artigo table{ width: 100%; border-collapse: collapse; font-size: 16px; line-height: 1.45; min-width: 520px; }
.uvd-artigo th{ text-align: left; padding: 12px 14px; background: #0B0B0E; color: #fff; font: 600 11.5px/1.3 'JetBrains Mono', ui-monospace, monospace; letter-spacing: .08em; text-transform: uppercase; }
.uvd-artigo th:first-child{ border-radius: 12px 0 0 0; } .uvd-artigo th:last-child{ border-radius: 0 12px 0 0; }
.uvd-artigo td{ padding: 12px 14px; border-bottom: 1px solid rgba(20,19,12,.12); vertical-align: top; }
.uvd-artigo tr:nth-child(even) td{ background: rgba(20,19,12,.03); }
.uvd-artigo hr{ border: 0; border-top: 1px solid rgba(20,19,12,.14); margin: 40px 0; }
.uvd-artigo h2{ scroll-margin-top: 90px; }
.uvd-artigo h3{ padding-left: 14px; border-left: 4px solid #F4DF48; }
.uvd-artigo p:last-child > em:only-child{ display: block; margin-top: 34px; padding-top: 16px; border-top: 1px solid rgba(20,19,12,.14); font-size: 14.5px; color: #6B6754; }
.uvd-artigo .uvd-cta{ margin: 40px 0 10px; padding: 28px 30px; border-radius: 24px; background: #0B0B0E; color: #fff; }
.uvd-artigo .uvd-cta h2{ color: #fff; margin: 0 0 10px; font-size: clamp(24px, 2.6vw, 32px); } .uvd-artigo .uvd-cta p{ color: #D6D6DB; margin: 0 0 12px; } .uvd-artigo .uvd-cta a{ color: #F4DF48; text-decoration-color: #F4DF48; } .uvd-artigo .uvd-cta strong{ color: #fff; }
@media (max-width: 600px){ .uvd-artigo p, .uvd-artigo li{ font-size: 17px; } .uvd-artigo blockquote{ padding: 18px 18px 4px; } }

/* 21-09 (pedido dela): a camada amarela do site por cima das fotografias dos artigos, como na janela da home (.vj) */
.uvd-artigo .uvd-amarela{ position: relative; display: inline-block; max-width: 100%; line-height: 0; margin: 0 0 34px; isolation: isolate; }
.uvd-artigo .uvd-amarela img.uvd-artigo-capa{ margin: 0; filter: grayscale(1) contrast(1.1); }
.uvd-artigo .uvd-amarela::after{ content: ""; position: absolute; inset: 0; background: #F4DF48; mix-blend-mode: multiply; opacity: .55; pointer-events: none; }

/* 21-09 (pedido dela): no titulo do artigo, a expressao principal a amarelo cheio, com o texto escuro */
.pr-cabeca-interior h1 mark.uvd-destaque{ background: #F4DF48; color: #14130C; padding: 0 .06em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }

/* O CORPO MAIS LARGO E JUSTIFICADO (21-09, pedido dela, captura 210722): os subtitulos herdavam a largura curta dos h2
   das paginas (.pr-wrap h2) e o texto ficava numa coluna estreita. Agora a coluna e os subtitulos vao ate 920px e o texto
   corrido fica justificado, com hifenizacao para nao abrir buracos entre palavras. */
.uvd-artigo{ max-width: 920px; }
.uvd-artigo h2, .uvd-artigo h3{ max-width: none; }
.uvd-artigo p:not(.uvd-artigo-meta), .uvd-artigo li{ text-align: justify; -webkit-hyphens: auto; hyphens: auto; }
.uvd-artigo .uvd-cta p, .uvd-artigo figcaption, .uvd-artigo td, .uvd-artigo th{ text-align: left; -webkit-hyphens: manual; hyphens: manual; }

/* A COLUNA DA AUTORA (21-09, escolha dela: opcao B de ensaios/artigo-autora-3-opcoes.html) */
.uvd-artigo:has(.uvd-com-autora){ max-width: 1200px; }
.uvd-com-autora{ display: grid; grid-template-columns: 220px minmax(0, 920px); gap: 48px; align-items: start; }
.uvd-lado{ position: sticky; top: 110px; }
.uvd-lado-foto{ display: block; position: relative; background: #F4DF48; width: 220px; height: 280px; border-radius: 16px; overflow: hidden; isolation: isolate; margin-bottom: 16px; }
.uvd-lado-foto img{ display: block; width: 100%; height: 100%; object-fit: cover; object-position: center bottom; border-radius: 0; filter: grayscale(1) contrast(1.08); }
.uvd-lado-foto::after{ content: ""; position: absolute; inset: 0; background: #F4DF48; mix-blend-mode: multiply; opacity: .55; pointer-events: none; }
.uvd-artigo .uvd-lado p{ text-align: left; -webkit-hyphens: manual; hyphens: manual; margin: 0; }
.uvd-artigo .uvd-lado-nome{ font-weight: 800; font-size: 21px; letter-spacing: -.02em; line-height: 1.2; margin: 0 0 4px; }
.uvd-artigo .uvd-lado-data{ color: #6B6754; font-size: 14px; margin: 0 0 18px; }
.uvd-lado-tempo{ border-top: 2px solid #14130C; padding-top: 14px; }
.uvd-artigo .uvd-lado-rot{ display: flex; justify-content: space-between; font: 600 12px/1 'JetBrains Mono', ui-monospace, monospace; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 10px; }
.uvd-lado-barra{ height: 8px; background: #e6e1d2; border-radius: 8px; overflow: hidden; }
.uvd-lado-barra i{ display: block; height: 100%; width: 0; background: #F4DF48; transition: width .2s linear; }
.uvd-artigo .uvd-lado-falta{ margin: 8px 0 0; font-size: 13px; color: #6B6754; min-height: 1.3em; }
@media (max-width: 980px){
  .uvd-com-autora{ grid-template-columns: 1fr; gap: 28px; }
  .uvd-lado{ position: static; display: grid; grid-template-columns: 96px 1fr; gap: 16px; align-items: center; }
  .uvd-lado-foto{ width: 96px; height: 120px; margin: 0; }
}

/* SUBTITULOS NUMA SO' LINHA (21-09, pedido dela: «4. Nao sabes quanto tempo aguentas...» partia em duas). O h2 media-se
   pela largura da janela (3vw, ate' 38px) e nao pela coluna: a 38px, 12 dos 49 subtitulos dos artigos nao cabiam em 916px.
   Agora mede-se pela coluna (unidades cqi): 3,45% da coluna da' 31,6px a 916px, e todos cabem numa linha; em colunas mais
   estreitas encolhe na mesma proporcao ate' 24px (no telemovel partir e' inevitavel). */
.uvd-corpo{ container-type: inline-size; }
.uvd-artigo .uvd-corpo h2{ font-size: clamp(24px, 3.45cqi, 32px); }
.uvd-artigo .uvd-corpo .uvd-cta h2{ font-size: clamp(21px, 2.9cqi, 27px); }