/* ══════════════════════════════════════════════════════════════════════════
   DADOS DE ENERGIA · páginas /dados-energia/  (outubro de 2026)

   Geradas por scripts/dados/gerar.py. Usam o landing.css e o zonas.css
   (topo, hero, cartão, gráfico .zg, ligação cruzada, remate, rodapé) e
   acrescentam aqui só o que é delas: a frase de resposta, as tabelas, os
   gráficos de linha e de quarto de hora, os blocos de explicação e o
   "Como citar".
   ══════════════════════════════════════════════════════════════════════════ */

/* ── hero ─────────────────────────────────────────────────────────────── */
.dd-h .zh-t{font-size:clamp(40px,6.2vw,104px); max-width:13ch}
.dd-h.zh-ind .zh-t{max-width:15ch}
.dd-resposta{margin-top:clamp(20px,2.4vw,32px); max-width:52ch; font-size:clamp(18px,1.6vw,22px); line-height:1.45; color:rgba(242,242,238,.86)}
.dd-resposta b{color:var(--x-lima); font-weight:600; white-space:nowrap}
.dd-meta{margin-top:14px; max-width:70ch; font-size:13px; line-height:1.6; color:rgba(242,242,238,.6)}
.dd-meta a{color:var(--x-osso)}
.dd-meta a:hover{color:var(--x-lima)}
.zn-dados .zh-card-v b{font-size:clamp(64px,7vw,116px)}
.zn-dados .zh-card-v b span{margin:0; font-size:inherit; font-weight:inherit}

/* ── secção clara com gráfico e tabela ───────────────────────────────── */
.dd-sec{background:var(--x-osso); color:var(--x-preto); padding:var(--x-pad) 0}
.dd-sec .x-k{color:rgba(11,11,10,.62)}
.dd-sec .x-k::before{background:var(--x-preto)}
.dd-cab{display:grid; gap:18px clamp(40px,5vw,96px); align-items:end; margin-bottom:clamp(28px,3.4vw,48px)}
@media(min-width:1000px){ .dd-cab{grid-template-columns:minmax(0,7fr) minmax(0,5fr)} }
.dd-t{font-size:clamp(30px,3.8vw,62px); font-weight:500; letter-spacing:-.05em; line-height:1; color:inherit; max-width:22ch}
.dd-t-s{font-size:clamp(26px,2.8vw,44px)}
.dd-s{font-size:16px; line-height:1.55; color:rgba(11,11,10,.72); max-width:52ch}
.dd-s a,.dd-nota a:not(.dd-btn){color:var(--x-preto); font-weight:600}
.dd-t3{margin:clamp(40px,5vw,64px) 0 16px; font-size:clamp(22px,2vw,30px); font-weight:500; letter-spacing:-.03em; color:var(--x-preto)}
.dd-nota{margin-top:16px; font-size:13.5px; line-height:1.55; color:rgba(11,11,10,.66); max-width:72ch}
.dd-nota-t{margin:-4px 0 16px}

/* gráficos (no cartão escuro .zg do zonas.css) */
.dd-g svg{display:block; width:100%; height:auto; overflow:visible}
.dd-g figcaption a{color:var(--x-osso)}
.dd-grade line{stroke:rgba(242,242,238,.12); stroke-width:1}
.dd-grade line.zero{stroke:rgba(242,242,238,.5)}
.dd-grade text,.dd-eixo text{fill:rgba(242,242,238,.55); font-size:9.5px; font-family:inherit; font-variant-numeric:tabular-nums}
.dd-eixo .dd-xt{fill:rgba(242,242,238,.85); font-weight:600}
.dd-linha{fill:none; stroke:var(--x-lima); stroke-width:2.5; stroke-linejoin:round; stroke-linecap:round}
.dd-pt circle{fill:var(--x-lima); stroke:var(--x-preto); stroke-width:3}
.dd-pt:hover circle{fill:#DCF76E}
.dd-g .dd-val{fill:var(--x-osso); font-size:11px; font-weight:600; font-family:inherit; font-variant-numeric:tabular-nums}
.dd-barras .pos{fill:var(--x-lima)}
.dd-barras .neg{fill:rgba(242,242,238,.7)}
.dd-barras rect:hover{fill:#fff}
@media(max-width:599px){
  .dd-grade text,.dd-eixo text{font-size:22px}
  .dd-g .dd-val{font-size:25px}
  .dd-tab{font-size:13.5px}
  .dd-tab th,.dd-tab td{padding:11px 8px}
  .dd-tab-c td:not(.n){min-width:6.5em}
  .dd-g{padding:14px}
}
/* solar: barras horizontais */
.dd-g-solar svg{max-width:540px; margin:0 auto}
.dd-g-solar rect{fill:var(--x-lima)}
.dd-g-solar a:hover rect{fill:#DCF76E}
.dd-g-solar .dd-zn{fill:rgba(242,242,238,.85); font-size:13px; font-family:inherit}
.dd-g-solar .dd-val{font-size:13px !important}
.dd-g-solar a:focus-visible{outline:2px solid var(--x-lima)}

/* números soltos */
.dd-num{display:grid; gap:10px; margin:24px 0 0; grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.dd-num div{padding:18px 20px; border-radius:18px; background:#fff; border:1px solid rgba(11,11,10,.1)}
.dd-num dt{font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:rgba(11,11,10,.6)}
.dd-num dd{margin:6px 0 0; font-size:clamp(22px,2vw,30px); font-weight:500; letter-spacing:-.03em; font-variant-numeric:tabular-nums}

/* tabelas */
.dd-tw{overflow-x:auto; -webkit-overflow-scrolling:touch; border-radius:18px; background:#fff; border:1px solid rgba(11,11,10,.1)}
.dd-tw:focus-visible{outline:2px solid var(--x-preto); outline-offset:2px}
.dd-tab{width:100%; border-collapse:collapse; font-size:14.5px; line-height:1.35; font-variant-numeric:tabular-nums; color:var(--x-preto)}
.dd-tab th,.dd-tab td{padding:12px 14px; text-align:left; border-bottom:1px solid var(--x-linha-c); white-space:nowrap; vertical-align:top}
.dd-tab tbody tr:last-child > *{border-bottom:0}
.dd-tab thead th{font-size:11.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:rgba(11,11,10,.6); background:var(--x-papel)}
.dd-tab tbody th{font-weight:600}
.dd-tab .n{text-align:right}
.dd-tab td b{font-weight:600}
.dd-tab-c td:not(.n){white-space:normal; min-width:9em}
.dd-tab .dd-quebra{white-space:normal; min-width:16em; color:rgba(11,11,10,.72)}
.dd-tab .dd-grupo th{padding-top:18px; font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:rgba(11,11,10,.55); background:transparent}
.dd-tab .dd-total > *{background:rgba(208,245,61,.35); border-top:1.5px solid var(--x-preto)}
.dd-tab tbody tr:not(.dd-grupo):hover > *{background:rgba(208,245,61,.18)}
.dd-tab a{color:var(--x-preto)}
/* solar: ordenar, primeira coluna fixa */
.dd-tab-solar thead th{padding:0}
.dd-tab-solar thead button{display:flex; align-items:center; justify-content:inherit; gap:6px; width:100%; min-height:48px; padding:8px 14px;
  border:0; background:none; font:inherit; letter-spacing:inherit; text-transform:inherit; color:inherit; cursor:pointer; text-align:inherit; white-space:nowrap}
.dd-tab-solar thead th.n button{justify-content:flex-end}
.dd-tab-solar thead button::after{content:"↕"; opacity:.35; font-size:12px}
.dd-tab-solar thead th[aria-sort="ascending"] button::after{content:"↑"; opacity:1}
.dd-tab-solar thead th[aria-sort="descending"] button::after{content:"↓"; opacity:1}
.dd-tab-solar thead th[aria-sort="ascending"],.dd-tab-solar thead th[aria-sort="descending"]{color:var(--x-preto)}
.dd-tab-solar thead button:hover{background:rgba(208,245,61,.35)}
.dd-tab-solar thead button:focus-visible{outline:2px solid var(--x-preto); outline-offset:-2px}
.dd-tab-solar tbody th a{display:inline-flex; align-items:center; min-height:28px}
.dd-tab-solar > * > tr > :first-child{position:sticky; left:0; z-index:1; background:#fff; box-shadow:1px 0 0 var(--x-linha-c)}
.dd-tab-solar thead tr > :first-child{background:var(--x-papel)}

.dd-det{margin-top:20px; border-bottom:0}
.dd-det summary{color:var(--x-preto); border-bottom:1.5px solid var(--x-preto); gap:0; display:inline-flex; align-items:center; min-height:44px; padding:0 20px; border-radius:999px; border:1.5px solid var(--x-preto);
  font-weight:600; font-size:15px; cursor:pointer; list-style:none}
.dd-det summary::-webkit-details-marker{display:none}
.dd-det summary::after{content:"↓"; margin-left:10px}
.dd-det[open] summary::after{content:"↑"}
.dd-det summary:hover{background:var(--x-lima)}
.dd-det .dd-tw{margin-top:16px; max-height:70vh; overflow-y:auto}

.dd-btn{display:inline-flex; align-items:center; gap:10px; min-height:48px; padding:0 22px; border-radius:999px;
  background:var(--x-preto); color:var(--x-osso); font-weight:600; font-size:15px; text-decoration:none; transition:background-color .2s, color .2s}
.dd-btn::before{content:""; width:14px; height:14px; flex:none;
  background:currentColor; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 2v9M4 7l4 4 4-4M2 14h12'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 2v9M4 7l4 4 4-4M2 14h12'/%3E%3C/svg%3E") center/contain no-repeat}
.dd-btn:hover{background:var(--x-lima); color:var(--x-preto)}

/* ── explicação (escuro) ──────────────────────────────────────────────── */
.dd-exp{background:var(--x-preto); color:var(--x-osso); padding:var(--x-pad) 0}
.dd-exp-g{display:grid; gap:56px clamp(40px,5vw,96px); align-items:start}
@media(min-width:1000px){ .dd-exp-g{grid-template-columns:repeat(2,minmax(0,1fr))} }
.dd-exp .dd-t{color:var(--x-osso); margin-bottom:22px}
.dd-exp p{font-size:16.5px; line-height:1.6; color:rgba(242,242,238,.76); max-width:58ch}
.dd-exp p + p{margin-top:14px}
.dd-exp a{color:var(--x-lima)}
.dd-mini{font-size:14px !important; color:rgba(242,242,238,.6) !important; padding-top:14px; border-top:1px solid var(--x-linha-e); margin-top:22px !important}
.dd-parc{list-style:none; margin:0; padding:0}
.dd-parc li{padding:18px 0; border-top:1px solid var(--x-linha-e)}
.dd-parc li:first-child{border-top:0; padding-top:0}
.dd-parc h3{font-size:19px; font-weight:600; letter-spacing:-.02em; color:var(--x-osso)}
.dd-parc p{margin-top:6px; font-size:15.5px}
.dd-parc a{display:inline-flex; align-items:center; gap:6px; min-height:44px; font-size:15px; font-weight:500; text-decoration:none}
.dd-parc a:hover{text-decoration:underline}
.dd-parc b{color:var(--x-osso)}
.dd-dl{margin:0}
.dd-dl div{display:grid; gap:4px 24px; padding:14px 0; border-top:1px solid var(--x-linha-e)}
@media(min-width:600px){ .dd-dl div{grid-template-columns:11em 1fr} }
.dd-dl dt{font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:rgba(242,242,238,.55); padding-top:3px}
.dd-dl dd{margin:0; font-size:16px; line-height:1.5; color:rgba(242,242,238,.86)}
.dd-dl a{color:var(--x-lima)}

/* ── como citar (lima) ────────────────────────────────────────────────── */
.dd-cita{background:var(--x-lima); color:var(--x-preto); padding:clamp(64px,8vw,128px) 0}
.dd-cita-g{display:grid; gap:32px clamp(40px,5vw,96px); align-items:start}
@media(min-width:1000px){ .dd-cita-g{grid-template-columns:minmax(0,5fr) minmax(0,7fr)} }
.dd-cita .dd-t{color:var(--x-preto)}
.dd-cita-s{margin-top:16px; font-size:16px; line-height:1.55; color:rgba(11,11,10,.72); max-width:44ch}
.dd-cita-c{margin:0; padding:clamp(22px,2.6vw,34px); border-radius:24px; background:var(--x-preto); color:var(--x-osso)}
.dd-frase{margin:0; padding-left:18px; border-left:3px solid var(--x-lima); font-size:clamp(16px,1.3vw,19px); line-height:1.55; color:var(--x-osso); overflow-wrap:anywhere}
.dd-cita-c figcaption{margin-top:16px; font-size:13px; color:rgba(242,242,238,.6)}
.dd-cita-c figcaption a{color:var(--x-lima)}
.dd-copiar{margin-top:18px; min-height:48px; padding:0 22px; border-radius:999px; border:1.5px solid var(--x-lima); background:none;
  color:var(--x-lima); font:inherit; font-weight:600; font-size:15px; cursor:pointer; transition:background-color .2s, color .2s}
.dd-copiar:hover{background:var(--x-lima); color:var(--x-preto)}

/* ── índice: cartões dos conjuntos de dados ──────────────────────────── */
.dd-cartoes{list-style:none; margin:0; padding:0; display:grid; gap:14px}
@media(min-width:760px){ .dd-cartoes{grid-template-columns:repeat(2,minmax(0,1fr))} }
.dd-cartao{display:flex; flex-direction:column; height:100%; padding:clamp(22px,2.6vw,34px); border-radius:24px; background:#fff;
  border:1px solid rgba(11,11,10,.1); color:var(--x-preto); text-decoration:none; transition:transform .25s var(--x-ease), border-color .25s}
.dd-cartao:hover{transform:translateY(-3px); border-color:var(--x-preto)}
.dd-cartao-k{font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:rgba(11,11,10,.6)}
.dd-cartao-t{margin-top:12px; font-size:clamp(24px,2.4vw,36px); font-weight:500; letter-spacing:-.04em; line-height:1.05; color:var(--x-preto)}
.dd-cartao-v{margin-top:20px; font-size:16px; font-weight:500}
.dd-cartao-v b{color:var(--x-preto); font-size:clamp(36px,3.6vw,56px); font-weight:500; letter-spacing:-.05em; font-variant-numeric:tabular-nums; margin-right:4px}
.dd-cartao-d{font-size:13.5px; color:rgba(11,11,10,.6)}
.dd-cartao-s{margin-top:16px; font-size:15px; line-height:1.5; color:rgba(11,11,10,.74); flex:1}
.dd-cartao-l{display:inline-flex; align-items:center; gap:8px; margin-top:20px; min-height:44px; font-weight:600}
.dd-cartao-l i{font-style:normal; transition:transform .25s var(--x-ease)}
.dd-cartao:hover .dd-cartao-l i{transform:translateX(4px)}

@media(prefers-reduced-motion:reduce){
  .dd-cartao,.dd-cartao-l i,.dd-btn,.dd-copiar{transition:none}
  .dd-cartao:hover{transform:none}
}