/* Estudos de caso (/casos/): usa os tokens e botões de estilo.css */
.caso { background: var(--preto); color: var(--texto); }
.caso-topo { border-bottom: 1px solid var(--linha); }
.caso-topo-interno { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 18px; }
.caso-marca { font-weight: 600; letter-spacing: -0.01em; color: var(--texto); text-decoration: none; }
.caso-conteudo { padding-block: clamp(32px, 6vw, 72px) clamp(64px, 9vw, 120px); max-width: 960px; }
.caso-trilha { font-size: .9rem; color: var(--texto-2); margin-bottom: 32px; }
.caso-trilha a { color: inherit; }
.caso-rotulo { font-size: .8rem; letter-spacing: .18em; text-transform: uppercase; color: var(--lima); margin-bottom: 14px; }
.caso h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(2.1rem, 1.4rem + 3vw, 3.6rem); line-height: 1.05; letter-spacing: -0.02em; max-width: 20ch; }
.caso-resumo { color: var(--texto-2); font-size: clamp(1.05rem, 1.3vw, 1.2rem); max-width: 62ch; margin-top: 20px; line-height: 1.6; }
.caso-ficha { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-top: 28px; }
.caso-ficha div { border: 1px solid var(--linha); border-radius: 16px; padding: 14px 16px; }
.caso-ficha dt { font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--texto-2); }
.caso-ficha dd { margin: 4px 0 0; }
.caso-ficha a { color: var(--lima); }
.caso-capa { margin: clamp(32px, 5vw, 56px) 0; }
.caso-capa img { width: 100%; height: auto; border-radius: 20px; border: 1px solid var(--linha); display: block; }
.caso-bloco { margin-top: clamp(36px, 5vw, 56px); }
.caso h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.3rem); line-height: 1.15; margin-bottom: 16px; }
.caso-bloco p { color: var(--texto-2); max-width: 62ch; line-height: 1.6; margin-bottom: 16px; }
.caso-bloco ul { display: grid; gap: 10px; padding-left: 1.2em; color: var(--texto-2); line-height: 1.55; }
.caso-bloco li::marker { color: var(--lima); }
.caso-tabela { border: 1px solid var(--linha); border-radius: 16px; overflow: hidden; max-width: 480px; }
.caso-tabela table { width: 100%; border-collapse: collapse; }
.caso-tabela th, .caso-tabela td { text-align: left; padding: 12px 16px; border-top: 1px solid var(--linha); }
.caso-tabela tr:first-child th, .caso-tabela tr:first-child td { border-top: 0; }
.caso-tabela th { font-weight: 500; color: var(--texto-2); }
.caso-tabela td { font-variant-numeric: tabular-nums; font-weight: 600; }
.caso-cta { margin-top: clamp(48px, 7vw, 88px); border: 1px solid var(--linha-forte); border-radius: 24px; padding: clamp(24px, 4vw, 40px); }
.caso-cta p { color: var(--texto-2); margin: 0 0 20px; }
.caso-grade { list-style: none; padding: 0; margin: 40px 0 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }
.caso-cartao { display: block; border: 1px solid var(--linha); border-radius: 20px; overflow: hidden; color: var(--texto); text-decoration: none; transition: border-color .3s; }
.caso-cartao:hover { border-color: var(--lima); }
.caso-cartao img { width: 100%; height: auto; display: block; }
.caso-cartao-texto { display: grid; gap: 4px; padding: 16px 18px 20px; }
.caso-cartao-texto span { color: var(--texto-2); font-size: .95rem; }
.caso-rodape { border-top: 1px solid var(--linha); padding-block: 28px; font-size: .9rem; color: var(--texto-2); }
.caso-rodape a { color: inherit; }
.caso-rodape a, .caso-trilha a { display: inline-block; padding-block: 4px; margin-block: -4px; } /* alvo de toque de 24 px+ */
.caso .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
