/* Hemiciclo de la encuesta IMOP frente a los resultados de 2023 (sin titular).
   Diseño: Figma «elecciones-29N», página «02-hemiciclo»: D-01i-hemiciclo-sin-titular (662) y
   M-01i-hemiciclo-sin-titular (440, 4 px de margen lateral); tooltip en «tooltip-hemiciclo».
   El hemiciclo ocupa todo el ancho y escala; los textos mantienen su tamaño. */
@font-face{font-family:"Confi Sans";font-weight:400;font-style:normal;font-display:swap;src:url(ConfiSans-400-Regular.woff2) format("woff2")}
@font-face{font-family:"Confi Sans";font-weight:400;font-style:italic;font-display:swap;src:url(ConfiSans-400-RegularItalic.woff2) format("woff2")}
@font-face{font-family:"Confi Sans";font-weight:500;font-style:normal;font-display:swap;src:url(ConfiSans-500-Medium.woff2) format("woff2")}
@font-face{font-family:"Confi Sans";font-weight:700;font-style:normal;font-display:swap;src:url(ConfiSans-700-Bold.woff2) format("woff2")}
@font-face{font-family:"Confi Sans";font-weight:700;font-style:italic;font-display:swap;src:url(ConfiSans-700-BoldItalic.woff2) format("woff2")}

:root{
  --texto:#121212;
  --texto-2:#737373;
  --acero-frio:#BFC7CE;
  --blanco:#FFFFFF;
  --fuente:"Confi Sans",Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{background:var(--blanco)}
body{margin:0;color:var(--texto);font-family:var(--fuente);container-type:inline-size}
p{margin:0}

.hemi{display:flex;flex-direction:column;gap:24px;padding:10px 0 14px}
@container (max-width:639px){ .hemi{padding-inline:4px} }

.entradilla{font-size:15px;line-height:1.4;font-style:italic;opacity:.5}

/* Gráfico: 8 px de aire arriba, 40 px para «Mayoría 176», el hemiciclo, la base y los rótulos de los anillos */
.grafico{position:relative;margin-top:8px}
.grafico svg{display:block;width:100%;overflow:visible;margin-top:8px}
.tramo{stroke:var(--blanco);stroke-width:1;cursor:pointer}
.mayoria{position:absolute;top:11px;left:50%;transform:translateX(-50%);font-size:13px;line-height:1.3;font-weight:700;font-style:italic;white-space:nowrap}
.linea-mayoria{position:absolute;top:32px;width:1px;background:var(--texto);pointer-events:none}

/* Etiquetas dentro de los tramos: nombre en Bold y cifra en Regular, en blanco */
.etiquetas{position:absolute;inset:0;pointer-events:none}
.etq{position:absolute;transform:translate(-50%,-50%);font-size:14px;line-height:1.15;font-weight:700;color:var(--blanco);text-align:center;white-space:nowrap}
.etq span{display:block;font-weight:400}
.etq.sombra{text-shadow:0 0 2px rgba(0,0,0,.45)}

/* Líneas base y rótulos de los dos anillos */
.bases{position:relative;height:50px}
.base{position:absolute;top:6px;height:1px;background:var(--texto)}
.rotulo{position:absolute;top:14px;font-size:14px;line-height:1.3;font-weight:700;white-space:nowrap}
.rotulo b{font-weight:700}
.rotulo span{display:block;font-weight:400;color:var(--texto-2)}
/* En móvil la fecha baja a su propia línea para no chocar con «Resultados 2023» */
@container (max-width:639px){
  .bases{height:68px}
  .rotulo b{display:block}
}

/* Pie: nota y fuente a la derecha */
.pie{display:flex;flex-direction:column;align-items:flex-end;gap:16px;font-size:13px;line-height:1.3;color:var(--texto-2);text-align:right}
.nota{max-width:640px;font-style:italic}
.nota b{font-weight:700}
.fuente strong{color:var(--texto);font-weight:700}
@container (max-width:639px){ .nota{max-width:415px} }

/* Tooltip (182 px, borde acero frío): partido, escaños IMOP, % de voto, 2023 y diferencia */
.tip{position:absolute;z-index:2;width:182px;background:var(--blanco);border:1px solid var(--acero-frio);border-radius:2px;padding:8px 8px 12px;pointer-events:none;display:flex;flex-direction:column;gap:10px;font-size:11px;line-height:1.3}
.tip[hidden]{display:none}
.tip .t{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:700}
.tip .t i{width:8px;height:8px;flex:none}
.tip hr{margin:0;border:0;border-top:1px solid var(--acero-frio)}
.tip .f{display:flex;align-items:center;gap:4px;font-weight:700}
.tip .f em{font-style:normal;font-weight:500;opacity:.5}
.tip .f img{width:9px;height:7px;display:block}
