/* =====================================================================
   A-Players · aviso e painel de cookies nas páginas da folha do Design System
   (artigos do blog, /sobre/, /en/about/ e /politica-de-privacidade/).
   O aviso (.ap-consent) e o interruptor (.ap-switch) vêm do Design System;
   aqui fica o painel de preferências (.ap-cprefs), com as mesmas medidas do
   .cprefs do site (css/site.css), e o link do texto do aviso.
   O comportamento é o mesmo do site: js/consent.js.
   ===================================================================== */
.ap-consent__text a { color: var(--ap-on-night); text-decoration: underline; text-decoration-color: var(--ap-yellow); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.ap-consent__text a:hover { text-underline-offset: 2px; }

.ap-cprefs {
  width: min(640px, calc(100vw - 24px)); max-height: calc(100dvh - 32px); padding: 0; margin: auto;
  border: 1px solid var(--ap-line); border-radius: var(--ap-r-card);
  background: var(--ap-card); color: var(--ap-ink);
  box-shadow: 0 40px 100px -30px rgba(var(--ap-shade-rgb, 0, 0, 0), calc(.7 * var(--ap-shade-k, 1))), 12px 12px 0 0 var(--ap-blue);
}
.ap-cprefs[open] { animation: ap-cprefs-in .5s var(--ap-ease-expo) both; }
.ap-cprefs::backdrop { background: rgba(8, 14, 26, .62); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
@keyframes ap-cprefs-in { from { opacity: 0; transform: translateY(18px) scale(.98); } }
.ap-cprefs__form { padding: clamp(22px, 3vw, 34px); }
.ap-cprefs__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 10px; }
.ap-cprefs__title { margin: 0; font: 800 clamp(24px, 2.4vw, 30px)/1.15 var(--ap-title); letter-spacing: -.02em; color: var(--ap-ink); }
.ap-cprefs__close { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--ap-line); border-radius: var(--ap-r-action); background: transparent; color: var(--ap-ink); cursor: pointer; transition: border-color .2s; }
.ap-cprefs__close svg { width: 12px; height: 12px; }
.ap-cprefs__close:hover { border-color: var(--ap-ink-2); }
.ap-cprefs__intro { margin: 0 0 18px; font-size: 15px; line-height: 1.55; color: var(--ap-ink-2); }
.ap-cprefs__intro a { color: var(--ap-ink); text-decoration: underline; text-decoration-color: var(--ap-blue); text-underline-offset: 3px; }
.ap-cprefs__list { display: grid; margin: 0; padding: 0; list-style: none; }
.ap-cprefs__list li { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px; padding: 16px 0; border-top: 1px solid var(--ap-line); }
.ap-cprefs__list li:last-child { border-bottom: 1px solid var(--ap-line); }
.ap-cprefs__name { margin: 0 0 3px; font: 750 17px/1.3 var(--ap-title); color: var(--ap-ink); }
.ap-cprefs__name::before { content: ""; display: inline-block; width: 9px; height: 9px; margin-right: 9px; vertical-align: .06em; border-radius: var(--ap-r-mark, 3px 1px 3px 1px); background: var(--ap-tone); }
.ap-cprefs__list p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--ap-ink-2); }
.ap-cprefs__always { font: 700 13px/1.2 var(--ap-text); color: var(--ap-ink-2); white-space: nowrap; }
.ap-cprefs__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 22px; }
@media (max-width: 640px) {
  .ap-cprefs__list li { grid-template-columns: 1fr; gap: 10px; }
  .ap-cprefs__actions .ap-btn { flex: 1 1 100%; }
}
