/* Quórum · estilos comunes de la web: cabecera interior, pie amplio, portada corta (vídeo, cifras, vías, explora), páginas interiores y el pase. */

/* ── cabecera de las páginas interiores ── */
.site-top { position: sticky; top: 0; height: var(--cp-top-h); z-index: 40; display: flex; align-items: center; gap: 22px; padding: 0 22px; background: rgba(15,43,39,.96); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.site-top .brand { flex: none; }
.sitenav { display: flex; gap: 18px; margin-left: auto; }
.sitenav a { color: #fff; text-decoration: none; font: 600 13.5px var(--vk-font-text); opacity: .82; padding: 6px 0; border-bottom: 2px solid transparent; }
.sitenav a:hover { opacity: 1; }
.sitenav a[aria-current="page"] { opacity: 1; border-bottom-color: var(--cp-accent-2); }
.top-cta { padding: 9px 16px; font-size: 13.5px; text-decoration: none; }
.menu-btn { display: none; margin-left: auto; width: 40px; height: 40px; border: 0; background: none; cursor: pointer; padding: 10px; }
.menu-btn i { display: block; height: 2px; background: #fff; border-radius: 2px; margin: 4px 0; }
@media (max-width: 980px) {
  .site-top { gap: 12px; }
  .sitenav, .site-top .top-cta { display: none; }
  .menu-btn { display: block; }
  .site-top.open .sitenav { display: flex; flex-direction: column; gap: 0; position: absolute; top: var(--cp-top-h); left: 0; right: 0; background: var(--cp-ink); padding: 8px 22px 18px; }
  .site-top.open .sitenav a { padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.1); }
  .site-top .brand-by { display: none; }
}
.topnav a[aria-current="page"] { text-decoration: underline; }

/* ── páginas interiores ── */
body.page { background: var(--cp-canvas); }
.page-hero { max-width: 1080px; margin: 0 auto; padding: 72px 24px 8px; }
.page-hero h1 { font-size: clamp(32px, 5vw, 58px); line-height: 1.04; color: var(--cp-ink); max-width: 900px; margin: 0 0 18px; font-weight: 700; }
.page-hero .lead { font-size: clamp(16px, 1.6vw, 19px); color: var(--vk-fg-2); max-width: 760px; margin: 0; }
.page-hero .chips-nav { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.chips-nav a { text-decoration: none; border: 1px solid var(--vk-line-ctl); background: #fff; border-radius: 99px; padding: 8px 14px; font: 600 13px var(--vk-font-text); color: var(--cp-ink); }
.chips-nav a:hover { border-color: var(--cp-accent); color: var(--cp-accent-t); }
.below .lead-p { font-size: 17px; color: var(--vk-fg-2); max-width: 760px; margin: -10px 0 26px; }
.below section[id] { scroll-margin-top: calc(var(--cp-top-h) + 16px); }
.cta-band { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; margin-top: 30px; padding: 26px 28px; border-radius: var(--vk-r-2xl); background: var(--cp-grad-card); color: #fff; box-shadow: var(--cp-sh-card); }
.cta-band p { margin: 0; font: 700 clamp(19px, 2.2vw, 26px)/1.2 var(--cp-font-display); max-width: 620px; }
.cta-band .btn { text-decoration: none; }
.lnk { display: inline-flex; gap: 6px; color: var(--cp-accent-t); font-weight: 700; text-decoration: none; }
.lnk:hover { text-decoration: underline; }
.note { font-size: 13px; color: var(--vk-fg-3); max-width: 800px; }
.soon { font-style: normal; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--vk-warn); background: #FFF4DA; border-radius: 99px; padding: 3px 8px; margin-left: 6px; vertical-align: middle; }

/* ── vídeo manifiesto ── */
.hv { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.25fr); gap: 36px; align-items: center; }
.hv h2 { margin-bottom: 16px; }
.hv p { font-size: 17px; color: var(--vk-fg-2); margin: 0 0 18px; }
.mv { position: relative; margin: 0; border-radius: var(--vk-r-2xl); overflow: hidden; background: var(--cp-dark); aspect-ratio: 16 / 9; box-shadow: 0 30px 60px -24px rgba(15,43,39,.6); }
.mv video { display: block; width: 100%; height: 100%; object-fit: cover; }
.mv-sound { position: absolute; right: 14px; top: 14px; display: inline-flex; align-items: center; gap: 8px; border: 0; cursor: pointer; border-radius: 99px; padding: 10px 16px; background: rgba(255,255,255,.94); color: var(--cp-ink); font: 700 13.5px var(--vk-font-text); box-shadow: 0 8px 22px -8px rgba(0,0,0,.4); }
.mv-sound::before { content: ""; width: 0; height: 0; border-left: 9px solid var(--cp-accent); border-top: 6px solid transparent; border-bottom: 6px solid transparent; }
.mv-off::after { content: "El vídeo llega en unos minutos"; position: absolute; inset: 0; display: grid; place-items: center; color: var(--vk-on-dark-2); font: 600 14px var(--vk-font-text); }
.mv-off .mv-sound, .mv-off .mv-pp { display: none; }
/* pausa / reproducir: siempre visible, con nombre accesible (WCAG 2.2.2); con los controles nativos del reproductor (tras «Ver con sonido») se esconde */
.mv-pp { position: absolute; left: 14px; bottom: 14px; z-index: 3; width: 44px; height: 44px; display: grid; place-items: center; border: 0; border-radius: 50%; cursor: pointer; background: #fff; color: var(--cp-ink); box-shadow: 0 8px 22px -8px rgba(0,0,0,.45); }
.mv-pp svg { width: 18px; height: 18px; display: block; }
.mv-pp .i-play { display: none; }
.mv-pp[data-estado="pausado"] .i-play { display: block; }
.mv-pp[data-estado="pausado"] .i-pausa { display: none; }
.mv.mv-nativo .mv-pp { display: none; }
.mv-pp:focus-visible, .mv-sound:focus-visible { outline: 3px solid #fff; outline-offset: 2px; background: var(--cp-accent-t); color: #fff; }
.mv-sound:focus-visible::before { border-left-color: #fff; }
/* transcripción con descripción visual, junto al vídeo */
.mv-box { min-width: 0; }
.mv-tr { margin-top: 14px; padding: 0 18px; border: 1px solid var(--vk-line); border-radius: var(--vk-r-lg); background: #fff; }
.mv-tr summary { cursor: pointer; padding: 14px 0; font: 700 15px var(--vk-font-text); color: var(--cp-ink); }
.mv-tr summary:focus-visible { outline: 3px solid var(--cp-accent-t); outline-offset: 4px; border-radius: 6px; }
.mv-tr[open] summary { border-bottom: 1px solid var(--vk-line); }
.mv-tr .tr-intro { margin: 12px 0 0; font-size: 14px; color: var(--vk-fg-3); }
.mv-tr ol { list-style: none; margin: 0; padding: 4px 0 8px; }
.mv-tr li { padding: 12px 0; border-bottom: 1px solid var(--vk-line); font-size: 14.5px; line-height: 1.55; }
.mv-tr li:last-child { border-bottom: 0; }
.mv-tr time { display: block; margin-bottom: 4px; font: 600 12px var(--vk-font-mono); color: var(--cp-accent-t); }
.mv-tr .tr-v, .mv-tr .tr-s { margin: 0 0 4px; }
.mv-tr .tr-v { color: var(--vk-fg-3); }
.mv-tr .tr-s { color: var(--cp-ink); }
.mv-tr li b { font-weight: 700; color: var(--cp-ink); }
@media (max-width: 860px) { .hv { grid-template-columns: 1fr; gap: 22px; } }

/* ── cifras ── */
.cf-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.cf { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 6px; min-height: 250px; padding: 22px; border-radius: var(--vk-r-2xl); background: #fff; border: 1px solid var(--vk-line); text-decoration: none; color: var(--cp-ink); transition: transform .2s, box-shadow .2s; }
.cf:hover { transform: translateY(-3px); box-shadow: var(--vk-sh-md, 0 14px 30px -14px rgba(15,43,39,.35)); }
.cf .cf-n { font: 800 clamp(40px, 4.4vw, 58px)/1 var(--cp-font-display); letter-spacing: -.03em; }
.cf .cf-n small { font-size: .42em; font-weight: 700; letter-spacing: 0; margin-left: 4px; }
.cf p { margin: 0; font-size: 14.5px; color: var(--vk-fg-2); position: relative; z-index: 1; }
.cf .cf-src { margin-top: auto; font: 600 11px var(--vk-font-text); letter-spacing: .08em; text-transform: uppercase; color: var(--vk-fg-4); position: relative; z-index: 1; }
.cf.dark { background: var(--cp-grad-card); color: #fff; border: 0; }
.cf.dark p { color: var(--vk-on-dark-2); }
.cf.dark .cf-src { color: #fff; }   /* antes #8EA1BA: 1,7:1 sobre el verde del fondo */
.cf-bars { display: flex; align-items: flex-end; gap: 1px; height: 58px; margin: 6px 0 4px; }
.cf-bars i { flex: 1; background: var(--cp-accent-300); border-radius: 1px 1px 0 0; }
.cf.soil { background: #F4EEFC; border-color: #E2D6F6; }
.cf.soil .cf-n { color: #5B2A86; }
.cf.soil .cf-src { align-self: flex-start; margin-left: -6px; padding: 2px 6px; border-radius: 6px; background: #F4EEFC; }   /* el pie de la cifra no se lee sobre las parcelas moradas del dibujo: lleva su propio fondo */
.cf-parc { position: absolute; right: -10px; bottom: -14px; width: 150px; height: 120px; opacity: .9; }
.cf.quo .ring { width: 74px; height: 74px; margin: 2px 0 4px; }
@media (max-width: 1000px) { .cf-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .cf-grid { grid-template-columns: 1fr; } .cf { min-height: 0; } }

/* ── las tres vías ── */
.vias3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.vias3 article { position: relative; padding: 26px 24px 24px; border-radius: var(--vk-r-2xl); background: #fff; border: 1px solid var(--vk-line); box-shadow: var(--vk-sh-sm); }
.vias3 .ico { width: 54px; height: 60px; display: grid; place-items: center; margin-bottom: 16px; background: var(--cp-accent-bg); clip-path: polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%); color: var(--cp-accent-t); }
.vias3 .ico svg { width: 26px; height: 26px; }
.vias3 h3 { font-size: 19px; color: var(--cp-ink); margin-bottom: 8px; }
.vias3 p { margin: 0; color: var(--vk-fg-2); font-size: 15px; }
.vias-hub { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 0 0 18px; color: var(--vk-fg-3); font: 600 13px var(--vk-font-text); }
.vias-hub b { color: var(--cp-ink); }
@media (max-width: 860px) { .vias3 { grid-template-columns: 1fr; } }

/* ── explora ── */
.explora-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.ex { display: grid; grid-template-rows: 120px auto; border-radius: var(--vk-r-2xl); background: #fff; border: 1px solid var(--vk-line); overflow: hidden; text-decoration: none; color: var(--cp-ink); transition: transform .2s, box-shadow .2s; }
.ex:hover { transform: translateY(-3px); box-shadow: 0 16px 30px -16px rgba(15,43,39,.4); }
.ex .art { position: relative; overflow: hidden; background: var(--cp-accent-bg); }
.ex .art svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.ex .tx { padding: 16px 18px 18px; }
.ex h3 { font-size: 18px; margin-bottom: 4px; display: flex; justify-content: space-between; gap: 8px; }
.ex h3::after { content: "→"; color: var(--cp-accent-t); }
.ex p { margin: 0; font-size: 14px; color: var(--vk-fg-2); }
@media (max-width: 860px) { .explora-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .explora-grid { grid-template-columns: 1fr; } }

/* ── pie amplio ── */
.mega { position: relative; margin-top: 110px; background: var(--cp-dark); color: var(--vk-on-dark-2); overflow: hidden; }
.mega .mf-in { position: relative; z-index: 1; max-width: 1180px; margin: 0 auto; padding: 64px 24px 30px; }
.mega a { color: #fff; text-decoration: none; }
.mega a:hover { text-decoration: underline; }
.mega .kicker { color: var(--cp-accent-2); }
.mf-top { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 22px; padding-bottom: 40px; border-bottom: 1px solid rgba(255,255,255,.12); }
.mf-claim { margin: 0; max-width: 720px; font: 700 clamp(26px, 3.6vw, 44px)/1.08 var(--cp-font-display); color: #fff; letter-spacing: -.01em; }
.mf-cta { display: grid; gap: 10px; justify-items: start; }
.mf-cta .btn { text-decoration: none !important; }
.mf-live { font-size: 13px; color: var(--vk-on-dark-3); }
.mf-live b { color: var(--cp-sun); font-size: 15px; }
.mf-cols { display: grid; grid-template-columns: 1.35fr repeat(4, minmax(0, 1fr)); gap: 28px; padding: 40px 0 32px; }
.mf-cols > * { min-width: 0; }
.mf-cols nav a { overflow-wrap: anywhere; }
.mf-cols h4 { margin: 0 0 12px; font: 700 12px var(--vk-font-text); letter-spacing: .12em; text-transform: uppercase; color: var(--cp-accent-2); }
.mf-cols nav { display: grid; align-content: start; gap: 9px; font-size: 14px; }
.mf-cols nav a { color: var(--vk-on-dark-2); }
.mf-cols nav a:hover { color: #fff; }
.mf-brand p { margin: 14px 0 12px; font: 600 16px/1.35 var(--cp-font-display); color: #fff; max-width: 240px; }
.mf-prom { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 12.5px; color: var(--vk-on-dark-3); }
.mf-prom li { padding-left: 16px; position: relative; }
.mf-prom li::before { content: ""; position: absolute; left: 0; top: 4px; width: 9px; height: 10px; background: var(--cp-sun); clip-path: polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%); }
.mf-inst { padding: 18px; border-radius: var(--vk-r-xl, 16px); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); align-self: start; }
.mf-inst p { margin: 0 0 10px; font-size: 13.5px; }
.mf-inst a { font-weight: 700; color: var(--cp-sun); }
.mf-src { margin: 0; padding: 18px 0; border-top: 1px solid rgba(255,255,255,.12); font-size: 12px; color: var(--vk-on-dark-3); }
.mf-equipo { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0 0 14px; font-size: 12.5px; color: var(--vk-on-dark-3); }
.mf-equipo a { font-weight: 700; color: var(--cp-sun); }
.mf-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; font-size: 12.5px; color: var(--vk-on-dark-3); }
.mf-bottom em { font-style: normal; color: #F2C46D; }
.mf-word { position: relative; z-index: 0; margin: 10px 0 -0.24em; text-align: center; font: 800 clamp(90px, 21vw, 300px)/1 var(--cp-font-display); letter-spacing: -.05em; color: transparent; background: linear-gradient(180deg, rgba(60,203,152,.32), rgba(60,203,152,.04)); -webkit-background-clip: text; background-clip: text; user-select: none; }
@media (max-width: 1100px) { .mf-cols { grid-template-columns: repeat(4, minmax(0, 1fr)); } .mf-brand { grid-column: 1 / -1; } .mf-inst { grid-column: 1 / -1; } }
@media (max-width: 760px) { .mf-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 18px; } }
@media (max-width: 560px) { .mega .mf-in { padding-top: 46px; } }
.below + .mega, main + .mega { margin-top: 110px; }

/* ── herramientas, ayudas, datos, suelo ── */
.cards2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.cards3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.card { padding: 24px; border-radius: var(--vk-r-2xl); background: #fff; border: 1px solid var(--vk-line); }
.card h3 { font-size: 19px; color: var(--cp-ink); margin-bottom: 8px; }
.card p, .card li { color: var(--vk-fg-2); font-size: 15px; }
.card p { margin: 0 0 10px; }
.card ul { margin: 0; padding-left: 18px; }
.card .tag { display: inline-block; margin-top: 6px; font: 700 11px var(--vk-font-text); letter-spacing: .06em; text-transform: uppercase; color: var(--cp-accent-t); background: var(--cp-accent-bg); border-radius: 99px; padding: 4px 9px; }
.card .tag.soon { color: var(--vk-warn); background: #FFF4DA; }
.card.dark { background: var(--cp-grad-card); color: #fff; border: 0; }
.card.dark h3, .card.dark p { color: #fff; }
@media (max-width: 860px) { .cards2, .cards3 { grid-template-columns: 1fr; } }
.tbl-wrap { overflow-x: auto; border-radius: var(--vk-r-xl, 16px); border: 1px solid var(--vk-line); background: #fff; }
.tbl-wrap:focus-visible { outline: 3px solid var(--cp-accent-t); outline-offset: 2px; }   /* el contenedor con desplazamiento se alcanza con el teclado (tabindex 0) */
.tbl { width: 100%; border-collapse: collapse; font-size: 14px; min-width: 720px; }
.tbl th { text-align: left; font: 700 11px var(--vk-font-text); letter-spacing: .1em; text-transform: uppercase; color: var(--vk-fg-3); padding: 12px 14px; border-bottom: 1px solid var(--vk-line); }
.tbl td { padding: 12px 14px; border-bottom: 1px solid var(--vk-line); vertical-align: top; color: var(--vk-fg-2); }
.tbl td b { display: block; color: var(--cp-ink); }
.tbl td small { color: var(--vk-fg-3); }
.tbl tr:last-child td { border-bottom: 0; }
.supuestos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.supuestos div { padding: 18px; border-radius: var(--vk-r-xl, 16px); background: #fff; border: 1px solid var(--vk-line); }
.supuestos b { display: block; font: 800 28px/1 var(--cp-font-display); color: var(--cp-ink); margin-bottom: 6px; }
.supuestos span { font-size: 14px; color: var(--vk-fg-2); }
@media (max-width: 760px) { .supuestos { grid-template-columns: 1fr 1fr; } }
.suelo-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.suelo-map { position: relative; height: 520px; border-radius: var(--vk-r-2xl); overflow: hidden; border: 1px solid var(--vk-line); background: #EEF2EF; }
.suelo-map #sueloMap { position: absolute; inset: 0; }
.suelo-map .tip { position: absolute; }
.sm { display: grid; grid-template-columns: 90px 1fr; gap: 4px 10px; align-items: center; margin-bottom: 12px; font-size: 14px; }
.sm span { font-weight: 700; color: var(--cp-ink); }
.sm i { display: block; height: 10px; border-radius: 99px; background: linear-gradient(90deg, #B79BE6, #5B2A86); }
.sm b { grid-column: 2; font-weight: 500; font-size: 12.5px; color: var(--vk-fg-3); }
.fly { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 16px; }
.fly button { border: 1px solid var(--vk-line-ctl); background: #fff; border-radius: 99px; padding: 6px 12px; font: 600 12.5px var(--vk-font-text); cursor: pointer; color: var(--cp-ink); }
.fly button:hover { border-color: #9B6BDB; color: #5B2A86; }
@media (max-width: 860px) { .suelo-grid { grid-template-columns: 1fr; } .suelo-map { height: 420px; } }
.hexsteps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.hexsteps li { padding: 20px; border-radius: var(--vk-r-xl, 16px); background: #fff; border: 1px solid var(--vk-line); }
.hexsteps b { display: block; font: 700 17px var(--cp-font-display); color: var(--cp-ink); margin-bottom: 4px; }
.hexsteps span { font-size: 14px; color: var(--vk-fg-2); }
@media (max-width: 760px) { .hexsteps { grid-template-columns: 1fr; } }

/* ── el pase: lo que necesitas, firmado, con su talón numerado ── */
.pase { display: flex; filter: drop-shadow(0 18px 24px rgba(15,43,39,.32)); }
.pase .pm { flex: 1; min-width: 0; position: relative; padding: 16px 16px 14px; border-radius: 20px 0 0 20px; background: var(--cp-grad-card); color: #fff;
  -webkit-mask: radial-gradient(circle 12px at 100% 0, transparent 98%, #000) top / 100% 51% no-repeat, radial-gradient(circle 12px at 100% 100%, transparent 98%, #000) bottom / 100% 51% no-repeat;
  mask: radial-gradient(circle 12px at 100% 0, transparent 98%, #000) top / 100% 51% no-repeat, radial-gradient(circle 12px at 100% 100%, transparent 98%, #000) bottom / 100% 51% no-repeat; }
.pase .ps { width: 112px; flex: none; position: relative; display: flex; flex-direction: column; gap: 5px; padding: 16px 12px 14px; border-radius: 0 20px 20px 0; background: #FBF8EF; color: var(--cp-ink);
  -webkit-mask: radial-gradient(circle 12px at 0 0, transparent 98%, #000) top / 100% 51% no-repeat, radial-gradient(circle 12px at 0 100%, transparent 98%, #000) bottom / 100% 51% no-repeat;
  mask: radial-gradient(circle 12px at 0 0, transparent 98%, #000) top / 100% 51% no-repeat, radial-gradient(circle 12px at 0 100%, transparent 98%, #000) bottom / 100% 51% no-repeat; }
.pase .ps::before { content: ""; position: absolute; left: -1px; top: 16px; bottom: 16px; border-left: 2px dashed rgba(15,43,39,.25); }
.pase .pb { display: flex; align-items: center; gap: 8px; font: 700 14px var(--cp-font-display); }
.pase .pb .brand-mark { width: 16px; height: 18px; }
.pase .pb span { font: 500 10.5px var(--vk-font-text); color: #D5E4DD; padding-left: 8px; border-left: 1px solid rgba(255,255,255,.35); }
.pase .pl { margin: 12px 0 5px; font: 700 10px var(--vk-font-text); letter-spacing: .14em; text-transform: uppercase; color: var(--cp-accent-2); }
.pase .pl.w { color: #FFD27A; }
.pase .pc { display: flex; flex-wrap: wrap; gap: 5px; }
.pase .pc span { background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.22); border-radius: 99px; padding: 3px 9px; font-size: 12px; }
.pase .pc.w span { background: rgba(255,185,56,.16); border-color: rgba(255,185,56,.5); color: #FFE2A8; }
.pase .psig { display: flex; justify-content: space-between; align-items: flex-end; gap: 8px; margin-top: 12px; }
.pase .psig b { font: 600 14px/1.2 var(--vk-font-text); color: #fff; }   /* el nombre (solo si consta), en letra normal: sin firma manuscrita */
.pase .psig small { font-size: 10.5px; color: #fff; text-align: right; }
.pase .pno { font: 700 9.5px var(--vk-font-text); letter-spacing: .14em; text-transform: uppercase; color: var(--vk-fg-3); }
.pase .pnum { font: 800 32px/1 var(--cp-font-display); letter-spacing: -.02em; }
.pase .pcity { font-weight: 700; font-size: 12.5px; line-height: 1.2; }
.pase .pbar { height: 7px; border-radius: 9px; background: #E4E9E5; overflow: hidden; margin-top: 2px; }
.pase .pbar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--cp-accent-2), var(--cp-accent)); transition: width 1.2s cubic-bezier(.2,.8,.2,1); }
.pase .pqt { font-size: 10.5px; line-height: 1.3; color: var(--vk-fg-3); }
.pase .pok { margin-top: auto; display: flex; align-items: center; gap: 5px; font: 700 10.5px var(--vk-font-text); color: var(--vk-fg-3); }
.pase .pok::before { content: "…"; display: grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; background: #E4E9E5; color: var(--vk-fg-3); font-size: 10px; }
.pase .pok.on { color: var(--cp-accent-t); }
.pase .pok.on::before { content: "✓"; background: var(--cp-accent-t); color: #fff; }
.pase .f-ver { background: none; border: 0; padding: 0; margin-top: 8px; text-decoration: underline; cursor: pointer; font-size: 12px; color: var(--cp-sun); }
@media (max-width: 380px) { .pase .ps { width: 96px; } .pase .pnum { font-size: 26px; } }

/* ── ajustes de móvil de la portada ── */
.soon { white-space: nowrap; }
.mf-brand .brand-by { white-space: nowrap; }
@media (max-width: 420px) { .mf-brand .brand { flex-wrap: wrap; } .mf-brand .brand-by { white-space: normal; } }   /* con el espaciado de texto ampliado (WCAG 1.4.12) no cabe en una línea a 320 px */
@media (max-width: 600px) {
  .top { padding: 0 12px; }
  .top .brand { gap: 7px; min-width: 0; }
  .top .brand-by { white-space: nowrap; font-size: 10.5px; padding-left: 7px; }
  .live-wrap { position: static; }
  .ticker { position: absolute; top: calc(var(--cp-top-h) - 8px); right: 12px; max-width: calc(100vw - 24px); }
  .live { padding: 7px 11px; }
  .nmbb.big { font-size: 13px; letter-spacing: .08em; padding: 10px 12px; }
}
@media (max-width: 600px) { .demo-chip { top: calc(var(--cp-top-h) + 30px); } }

/* ── «Powered by eVoost»: la firma estándar de los sites y del Funnel Builder (evoost-signature), en variante para fondo oscuro ── */
.mega .evoost-signature-wrapper { position: relative; z-index: 1; display: flex; justify-content: center; align-items: center; padding: 18px 0 26px; font-family: 'Inter', 'Helvetica Neue', Arial, sans-serif; }
.mega .evoost-signature { display: flex; align-items: center; justify-content: center; text-decoration: none; padding: 8px 12px; border-radius: 30px; border: 1px solid rgba(255,255,255,.14); transition: all .5s cubic-bezier(.25,1,.5,1); position: relative; overflow: hidden; background-color: transparent; }
.mega .evoost-logo { width: 16px; height: 16px; margin-right: 8px; opacity: .85; filter: invert(1); transition: all .5s ease; position: relative; z-index: 2; }
.mega .evoost-text { font-size: 11px; font-weight: 400; letter-spacing: .2px; color: #A3B3AE; transition: all .5s ease; position: relative; z-index: 2; }   /* antes rgba(255,255,255,.45): 4,4:1; ahora 7,8:1 sobre #0B1F1C */
.mega .evoost-highlight { font-weight: 500; color: #D9E3DF; transition: all .5s ease; }
.mega .evoost-signature::before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(255,255,255,.05) 0%, rgba(255,255,255,.02) 100%); opacity: 0; transition: opacity .5s ease; z-index: 1; }
.mega .evoost-signature::after { content: ''; position: absolute; top: 0; left: -150%; width: 100%; height: 100%; background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.1) 50%, rgba(255,255,255,0) 100%); transform: skewX(-25deg); z-index: 3; opacity: 0; transition: opacity .2s ease; }
@keyframes evoostShine { 0% { left: -150%; } 100% { left: 150%; } }
.mega .evoost-signature:hover { border-color: rgba(255,255,255,.28); text-decoration: none; }
.mega .evoost-signature:hover::before { opacity: 1; }
.mega .evoost-signature:hover::after { opacity: 1; animation: evoostShine 1.2s ease-in-out; }
.mega .evoost-signature:hover .evoost-logo { opacity: .9; transform: scale(1.05); }
.mega .evoost-signature:hover .evoost-text { color: rgba(255,255,255,.75); }
.mega .evoost-signature:hover .evoost-highlight { color: rgba(255,255,255,.9); }
.mega .mf-word { margin-bottom: -0.1em; }
/* instituciones: banda a lo ancho del pie (el texto ampliado no cabe en una columna). Las columnas del pie se definen arriba, con sus @media:
   aquí no se vuelve a fijar grid-template-columns (esa regla, más abajo que los @media, los anulaba y dejaba el pie cortado en móvil) */
.mf-inst { grid-column: 1 / -1; display: grid; grid-template-columns: 230px 1fr auto; gap: 8px 26px; align-items: center; padding: 20px 22px; }
.mf-inst h4 { margin: 0; }
.mf-inst p { margin: 0; font-size: 14px; max-width: 760px; }
.mf-inst a { white-space: nowrap; }
@media (max-width: 860px) { .mf-inst { grid-template-columns: 1fr; } }

/* ── contacto para administraciones, prensa y asociaciones: en el pie (site.js) y en «El proyecto» (#contacto) ── */
.mf-contacto { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; padding: 18px 22px; border-radius: var(--vk-r-xl, 16px); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); }
.mf-ct-q { margin: 0; font: 700 15px/1.35 var(--vk-font-text); color: #fff; max-width: 360px; }
.mf-ct-l, .ct-l { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.mf-ct-l a, .ct-l a { display: inline-flex; align-items: center; min-height: 40px; padding: 8px 16px; border-radius: 99px; font: 600 14px/1.2 var(--vk-font-text); text-decoration: none; }
.mf-ct-l a { border: 1.5px solid rgba(255,255,255,.4); color: #fff; }
.mf-ct-l a:hover { background: rgba(255,255,255,.12); border-color: #fff; text-decoration: none; }
.mf-ct-l a.mf-ct-m, .ct-l a.ct-m { border-color: transparent; padding-left: 6px; padding-right: 6px; text-decoration: underline; text-underline-offset: 4px; }
.mf-ct-l a.mf-ct-m { color: var(--cp-sun); }
.mf-contacto a:focus-visible { outline: 3px solid var(--cp-sun); outline-offset: 2px; }
.ct-l a { border: 1.5px solid var(--cp-accent-t); background: var(--cp-accent-bg); color: var(--cp-accent-t); }
.ct-l a:hover { background: #fff; }
.ct-l a.ct-m { background: none; color: var(--cp-accent-t); }
.ct-l a:focus-visible { outline: 3px solid var(--cp-accent-t); outline-offset: 2px; }
.contacto h2 { margin-bottom: 18px; }
@media (max-width: 560px) { .mf-contacto { padding: 16px 18px; } .mf-ct-l a { min-height: 44px; } .ct-l a { min-height: 44px; } }

/* ── portada: las zonas más cerca de su quórum ── */
.cerca-list { display: grid; gap: 8px; max-width: 900px; }
.cerca-row { display: grid; grid-template-columns: minmax(130px, 220px) 1fr auto 52px; gap: 14px; align-items: center; width: 100%; text-align: left; padding: 12px 16px; border-radius: var(--vk-r-xl, 16px); background: #fff; border: 1px solid var(--vk-line); cursor: pointer; font: inherit; color: var(--cp-ink); transition: border-color .2s, transform .2s; }
.cerca-row:hover { border-color: var(--cp-accent); transform: translateX(2px); }
.cerca-row .cn { font-weight: 700; }
.cerca-row .cb { height: 10px; border-radius: 99px; background: #E4E9E5; overflow: hidden; }
.cerca-row .cb i { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--cp-accent-2), var(--cp-accent), var(--cp-ink)); }
.cerca-row .cv { font-size: 13px; color: var(--vk-fg-3); white-space: nowrap; }
.cerca-row .cv b { color: var(--cp-ink); }
.cerca-row .cp { font: 800 15px var(--cp-font-display); text-align: right; }
.cerca-vacio { color: var(--vk-fg-3); }
@media (max-width: 600px) { .cerca-row { grid-template-columns: 1fr auto; } .cerca-row .cb { grid-column: 1 / -1; order: 3; } .cerca-row .cv { display: none; } }

/* ── el hexágono, solo para datos (feedback de Iñaki): viñetas, números e iconos, en círculo ── */
.trust li::before, .promise li::before, .mf-prom li::before, .capaces div::before, .two li::before, .passport-list li::before,
.timeline li::before, .steps6 li::before, .goals .num, .cards .num, .offer .o i { clip-path: none; border-radius: 50%; }
.vias3 .ico { clip-path: none; border-radius: 18px; width: 54px; height: 54px; }
.sub-h1 { margin: -4px 0 12px; font: 600 clamp(16px, 1.6vw, 18px)/1.4 var(--cp-font-display); color: var(--cp-accent-t); }
.faq-h { font: 700 13px var(--vk-font-text); letter-spacing: .1em; text-transform: uppercase; color: var(--vk-fg-3); margin: 18px 0 4px; }
.faq-h:first-child { margin-top: 0; }
.below h2.faq-h { font: 700 13px var(--vk-font-text); line-height: normal; max-width: none; color: var(--vk-fg-3); margin: 18px 0 4px; }   /* h2 para los buscadores; se ve igual que el h3 de antes (.below h2 pesaría más) */
.below h2.faq-h:first-child { margin-top: 0; }
.faq-more { margin: 18px 0 4px; }
/* respaldo sin JS del pie (lo sustituye site.js al arrancar) */
.mega .seo-foot { display: flex; flex-wrap: wrap; gap: 10px 22px; max-width: 1180px; margin: 0 auto; padding: 48px 24px; font-size: 14px; }

/* ── de pedir a construir ── */
.ruta { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; position: relative; }
.ruta::before { content: ""; position: absolute; left: 4%; right: 4%; top: 21px; height: 2px; background: linear-gradient(90deg, var(--cp-accent-300), var(--cp-accent), var(--cp-sun)); }
.ruta li { position: relative; display: grid; gap: 6px; align-content: start; }
.ruta .rn { position: relative; z-index: 1; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--cp-ink); color: #fff; font: 800 16px var(--cp-font-display); box-shadow: 0 0 0 5px var(--cp-canvas); }
.ruta li:last-child .rn { background: var(--cp-sun); color: var(--cp-ink); }
.ruta b { font: 700 16px/1.25 var(--cp-font-display); color: var(--cp-ink); margin-top: 6px; }
.ruta span:not(.rn) { font-size: 13.5px; color: var(--vk-fg-2); }
@media (max-width: 900px) { .ruta { grid-template-columns: 1fr 1fr; gap: 18px; } .ruta::before { display: none; } }
/* ── ejemplo de zona ── */
.ej-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 18px; align-items: stretch; }
.ej-mapa { margin: 0; border-radius: var(--vk-r-2xl); overflow: hidden; border: 1px solid var(--vk-line); background: #F3F5F2; }
.ej-mapa { display: grid; place-items: center; }
.ej-mapa img { display: block; width: 100%; height: auto; }
.ej-ficha { padding: 22px; border-radius: var(--vk-r-2xl); background: #fff; border: 1px solid var(--vk-line); box-shadow: var(--vk-sh-sm); display: grid; gap: 10px; align-content: start; }
.ej-top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 12.5px; color: var(--vk-fg-3); }
.ej-tag { font: 700 11px var(--vk-font-text); letter-spacing: .08em; text-transform: uppercase; color: var(--cp-sun-ink); background: #FFF1D2; border-radius: 99px; padding: 4px 9px; }
.ej-ficha h3 { font-size: 21px; color: var(--cp-ink); }
.ej-big { font-size: 15px; color: var(--vk-fg-2); }
.ej-big b { font: 800 40px/1 var(--cp-font-display); color: var(--cp-ink); margin-right: 6px; }
.ej-datos { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.ej-datos li { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px solid var(--vk-line); font-size: 14px; }
.ej-datos span { color: var(--vk-fg-3); }
.ej-datos b { color: var(--cp-ink); text-align: right; }
.ej-quorum { margin: 4px 0 0; padding: 12px 14px; border-radius: 14px; background: var(--cp-accent-bg); color: var(--cp-ink); font-size: 14px; }
@media (max-width: 860px) { .ej-grid { grid-template-columns: 1fr; } }

/* ── aviso de lectura del mapa y acciones del pase ── */
.map-hint { position: absolute; left: 50%; bottom: 26px; transform: translateX(-50%); z-index: 6; max-width: min(560px, calc(100% - 32px)); padding: 10px 16px; border-radius: 99px; background: rgba(15,43,39,.9); color: #fff; font-size: 13.5px; line-height: 1.35; box-shadow: 0 10px 24px -10px rgba(0,0,0,.45); transition: opacity .5s, transform .5s; pointer-events: none; }
.map-hint b { color: var(--cp-accent-2); }
.map-hint.fuera { opacity: 0; transform: translate(-50%, 12px); }
@media (min-width: 861px) { .map-hint { display: none; } }   /* en escritorio lo explica la leyenda */
@media (max-width: 860px) { .map-hint { bottom: auto; top: 70px; border-radius: 16px; font-size: 12.5px; } }
.pase-acc { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; }   /* por encima de la sombra del pase (la sombra oscurecía los botones) */
.pase-acc .btn { padding: 10px 16px; font-size: 14px; }

/* ── Qué pide la gente: perfil agregado ── */
a.cerca-row { text-decoration: none; }
.perfil { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.pf { padding: 20px; border-radius: var(--vk-r-2xl); background: #fff; border: 1px solid var(--vk-line); }
.pf h3 { font-size: 17px; color: var(--cp-ink); margin-bottom: 10px; }
.pf-row { display: grid; grid-template-columns: minmax(70px, 1.2fr) 2fr 44px; gap: 10px; align-items: center; margin: 7px 0; font-size: 13.5px; color: var(--vk-fg-2); }
.pf-row i { display: block; height: 10px; border-radius: 99px; background: #E4E9E5; overflow: hidden; }
.pf-row b { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--cp-accent-2), var(--cp-accent)); }
.pf-row em { font-style: normal; font-weight: 700; color: var(--cp-ink); text-align: right; }
@media (max-width: 860px) { .perfil { grid-template-columns: 1fr; } }

/* ── suelo: lista de municipios que lleva el mapa a cada uno ── */
.sm[data-muni] { cursor: pointer; border-radius: 8px; }
.sm[data-muni]:hover span, .sm[data-muni]:focus-visible span { color: #5B2A86; text-decoration: underline; }
@media (max-width: 860px) { .map-hint.con-demo { top: calc(var(--cp-top-h) + 42px); } }
@media (max-width: 600px) { .map-hint.con-demo { top: calc(var(--cp-top-h) + 66px); } }

/* ── guía de copy de Cristian (13-oct): aviso, bloque de vida, lo que reclamamos y confirmación ── */
.micro { margin: 14px 0 0; font-size: 12.5px; line-height: 1.45; color: var(--vk-fg-3); }
.vida { text-align: center; }
.vida h2 { margin-left: auto; margin-right: auto; }
.vida h2 span { color: var(--cp-accent-t); }
.vida-l { list-style: none; padding: 0; margin: 0 auto 22px; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 10px; max-width: 760px; }
.vida-l li { padding: 8px 14px; border-radius: 99px; background: var(--cp-accent-bg); color: var(--cp-ink); font-weight: 600; font-size: 14.5px; }
.vida p { max-width: 640px; margin: 0 auto 22px; color: var(--vk-fg-2); font-size: 17px; }
.vida p b { color: var(--cp-ink); }
.reclama-l { list-style: none; padding: 0; margin: 0 0 22px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.reclama-l li { padding: 16px 18px; border-radius: var(--vk-r-xl, 16px); background: #fff; border: 1px solid var(--vk-line); font-weight: 600; color: var(--cp-ink); }
.reclama-f { margin: 0; max-width: 760px; font: 700 clamp(18px, 2vw, 22px)/1.3 var(--cp-font-display); color: var(--cp-ink); }
.recibido { margin-bottom: 18px; }
/* aviso de arriba del resultado: sin confirmar el email, la participación no cuenta */
.sheet .confirma { margin: 0 0 18px; padding: 16px 18px; border-radius: var(--vk-r-xl); background: #FFF4DC; border: 2px solid var(--cp-sun); color: var(--cp-ink); }
.sheet .confirma h2 { font: 800 21px/1.2 var(--cp-font-display); margin: 0 0 6px; color: var(--cp-ink); }
.sheet .confirma p { margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--cp-ink); }
.sheet .confirma.ok { background: #EAF7F1; border-color: var(--cp-accent-t); }

.recibido h2 { font-size: 24px; margin-bottom: 6px; }
.recibido p { margin: 0; color: var(--vk-fg-2); }
.recibido .micro { margin-top: 8px; }
.share-t { margin: 14px 0 10px; font-size: 13.5px; }
.firma-marca { font: 600 15px var(--cp-font-display); color: var(--cp-ink); }
@media (max-width: 860px) { .reclama-l { grid-template-columns: 1fr; } }

/* ── landings locales (/vivienda/<municipio>/): generadas por pipelines/landings.py ── */
.crumbs { max-width: 1080px; margin: 0 auto; padding: 22px 24px 0; font-size: 13px; color: var(--vk-fg-3); }
.crumbs a { color: var(--cp-accent-t); font-weight: 600; text-decoration: none; }
.crumbs a:hover { text-decoration: underline; }
.lq-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 18px; margin-top: 26px; }
.lq-cta .btn { text-decoration: none; }
.lq-micro { margin: 12px 0 0; max-width: 640px; font-size: 13px; color: var(--vk-fg-3); }
.lq-quorum { display: grid; gap: 12px; padding: 24px; border-radius: var(--vk-r-2xl); background: #fff; border: 1px solid var(--vk-line); box-shadow: var(--vk-sh-sm); }
.lq-quorum p { margin: 0; }
.lq-p { color: var(--vk-fg-2); max-width: 760px; }
.lq-bar { height: 14px; border-radius: 99px; background: #E3E8E4; overflow: hidden; }
.lq-bar i { display: block; height: 100%; width: 0; border-radius: 99px; background: var(--cp-grad-cta); transition: width .7s ease; }
.lq-prog { font-weight: 600; color: var(--cp-ink); }
.lq-desglose { font-size: 14px; color: var(--vk-fg-2); }
.lq-index { display: grid; align-content: center; gap: 8px; }
.lq-index .ej-tag { justify-self: start; }
.lq-index p { margin: 0; color: #fff; }
.lq-big { font: 700 22px/1.1 var(--cp-font-display); }
.lq-big b { font: 800 clamp(64px, 11vw, 104px)/1 var(--cp-font-display); color: var(--cp-sun); margin-right: 8px; }
.lq-share h2 { margin-bottom: 12px; font-size: clamp(22px, 2.6vw, 30px); }
.lq-share p { max-width: 720px; }
.lq-wa { background: #fff; color: var(--cp-ink); border: 2px solid var(--cp-ink); text-decoration: none; }
.lq-wa:hover { background: var(--cp-accent-bg); }
.lq-cita { margin: 0; max-width: 760px; color: var(--vk-fg-2); font-size: 14.5px; }
/* cercanas y administraciones (landing local) */
.tbl-cerca { min-width: 600px; }
.tbl-cerca th.num, .tbl-cerca td.num { text-align: right; white-space: nowrap; }
.tbl-cerca td b a { display: inline; }
/* en móvil, cada municipio cercano es una ficha con sus cuatro cifras (sin desplazamiento lateral) */
@media (max-width: 640px) {
  .tbl-cerca { min-width: 0; }
  .tbl-cerca thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .tbl-cerca tr { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 14px; padding: 14px 16px; border-bottom: 1px solid var(--vk-line); }
  .tbl-cerca td { display: block; padding: 0; border: 0; text-align: left; white-space: normal; }
  .tbl-cerca td:first-child { grid-column: 1 / -1; }
  .tbl-cerca td[data-label]::before { content: attr(data-label); display: block; font: 600 11px var(--vk-font-text); letter-spacing: .04em; text-transform: uppercase; color: var(--vk-fg-3); }
  .tbl-cerca th.num, .tbl-cerca td.num { text-align: left; }
}
.lq-tag { display: block; margin-top: 4px; font: 600 11.5px var(--vk-font-text); color: var(--cp-accent-t); }
.lq-sub { margin: 26px 0 10px; font-size: 18px; color: var(--cp-ink); }
.lq-caminos { list-style: none; margin: 0 0 18px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; }
.lq-aviso { margin-top: 14px; padding: 12px 14px; border-radius: var(--vk-r-lg); background: var(--cp-accent-bg); color: var(--cp-ink); }
/* vídeo de la ciudad (16:9 reservado de antemano: sin saltos al cargar; la transcripción plegable reutiliza .mv-tr de la portada) */
.lq-vbox { max-width: 920px; min-width: 0; }
.lq-vbox video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border-radius: var(--vk-r-2xl); background: #0B1F1C; box-shadow: var(--vk-sh-sm); }
.lq-vbox video:focus-visible { outline: 3px solid var(--cp-accent-t); outline-offset: 3px; }
.lq-vbox video p { padding: 16px; color: #fff; }
.lq-vbox video a { color: #fff; }

/* ── Mi participación y «Continuar con Google» (14-oct) ── */
.g-part { margin: 6px 0 4px; display: grid; gap: 6px; justify-items: start; }
.g-o { margin: 4px 0 8px; }
.mi-ver { margin-top: 6px; padding-left: 0; }
.mi { max-width: 760px; }
.mi-card { background: #fff; border: 1px solid var(--vk-line); border-radius: var(--vk-r-2xl, 20px); padding: 22px 22px 18px; margin-bottom: 16px; box-shadow: var(--vk-sh-sm); }
.mi-card h2 { font-size: 22px; margin-bottom: 8px; color: var(--cp-ink); }
.mi-card p { color: var(--vk-fg-2); margin: 0 0 12px; }
.mi-acciones { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 4px; }
.mi-email { display: grid; gap: 8px; margin-top: 14px; max-width: 420px; }
.mi-msg { min-height: 1.2em; font-size: 14px; color: var(--cp-accent-t); margin: 8px 0 0; }
.mi-nota { font-size: 13px; color: var(--vk-fg-3); }
.mi-gbtn { margin: 6px 0; }
.mi-estado { display: inline-block; padding: 4px 10px; border-radius: 99px; font: 700 12px var(--vk-font-text); margin-bottom: 8px; }
.mi-estado.ok { background: var(--cp-accent-bg); color: var(--cp-accent-t); }
.mi-estado.pend { background: #FFF4DE; color: #8A5A00; }
.mi-quorum { margin: 10px 0 14px; }
.mi-q-t { font-size: 15px; color: var(--cp-ink); margin-bottom: 6px; }
.mi-q-bar { height: 10px; border-radius: 99px; background: var(--vk-surface-3, #EEF2EF); overflow: hidden; }
.mi-q-bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--cp-accent), var(--cp-sun)); }
.mi-lista { margin: 0 0 10px; padding-left: 18px; color: var(--cp-ink); }
.mi-texto summary { cursor: pointer; font-weight: 600; color: var(--cp-ink); }

/* ── quien ya participó: «Mi participación» en la cabecera y el estado «Ya participas» de la portada ── */
.top-mi { flex: none; margin-right: 14px; white-space: nowrap; }
.sitenav .nav-mi { display: none; }
@media (max-width: 980px) { .sitenav .nav-mi { display: block; font-weight: 700; } }
@media (max-width: 860px) { .top-mi { margin-left: auto; margin-right: 10px; padding: 8px 12px; font-size: 13px; } }
@media (max-width: 860px) { .top .top-lang:not(:empty) + .top-mi { margin-left: 10px; } }   /* con el selector de idioma, él empuja a la derecha */
@media (max-width: 460px) { .top.con-mi .brand-by { display: none; } }   /* portada en móvil: sitio para «Mi participación» junto al contador */
.ya-lo { font-size: 15.5px; font-weight: 600; color: var(--cp-ink); margin: 0 0 12px; }
.ya .mi-estado { margin: 0 0 12px; }
.ya .mi-quorum { margin: 2px 0 18px; }
.ya .cta-row { margin: 4px 0 14px; }
.cambiando { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; background: var(--cp-accent-bg); border: 1px solid var(--cp-accent-b); border-radius: 12px; padding: 10px 14px; margin: 0 0 14px; color: var(--cp-accent-t); font-size: 13.5px; }
.cambiando[hidden] { display: none; }
.cambiando .btn-link { padding: 4px 6px; color: var(--cp-accent-t); text-decoration: underline; font-size: 13.5px; }
.mi-acciones a.btn, .ya a.btn { text-decoration: none; }   /* un enlace con forma de botón no se subraya */
.mi-card .mi-acciones + .mi-lista { margin-top: 14px; }

/* ══ Móvil · auditoría del 15-oct-2026: objetivos táctiles de 44 px, campos a 16 px, desbordes y bordes seguros.
   Solo ≤ 860 px (el escritorio no cambia). Va al final para ganar a las reglas anteriores sin subir la especificidad. ══ */
@media (max-width: 860px) {
  :root { --vk-fs-caption: 12px; }   /* kickers y notas: a 11 px no se leen bien en el móvil */
  html { scroll-padding-top: calc(var(--cp-top-h) + 12px); }   /* los saltos a #ancla y el foco de un campo no quedan bajo la cabecera fija */
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]), select, textarea {
    font-size: 16px; scroll-margin-top: calc(var(--cp-top-h) + 16px); }   /* iOS Safari amplía la página al enfocar un campo de menos de 16 px */
  input[type="range"] { height: 44px; }
  /* bordes seguros (muesca y esquinas con el móvil en horizontal): contenido y cabecera fija */
  body { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }
  .top { padding-left: max(14px, env(safe-area-inset-left)); padding-right: max(14px, env(safe-area-inset-right)); }
  .mega .evoost-signature-wrapper { padding-bottom: calc(26px + env(safe-area-inset-bottom)); }

  /* cabecera */
  .top .brand, .site-top .brand { min-height: 44px; }
  .menu-btn { width: 44px; height: 44px; }
  .top .top-mi { min-height: 44px; }
  .top .i18n-sel--cab > summary, .site-top .i18n-sel--cab > summary { min-height: 44px; }
  .i18n-sel.i18n-sel--cab > ul a { display: flex; align-items: center; min-height: 44px; }

  /* pie */
  .mf-cols nav { gap: 0; }
  .mf-cols nav a { display: flex; align-items: center; min-height: 44px; }
  .mf-brand a.brand, .mf-inst a { display: inline-flex; align-items: center; min-height: 44px; }
  .mf-ct-l a, .ct-l a { min-height: 44px; }
  .mega .evoost-signature { min-height: 44px; padding: 8px 16px; }
  .mega .evoost-text { font-size: 12px; }
  .mf-bottom a { padding: 15px 2px; }   /* en línea: amplía la zona que se toca sin mover el texto */
  .i18n-sel.i18n-sel--pie a { display: flex; align-items: center; min-height: 44px; padding: 0 2px; }

  /* chips de navegación, filtros, migas y enlaces sueltos */
  .chips-nav a, .nt-filtros a { display: inline-flex; align-items: center; min-height: 44px; }
  .crumbs a { padding: 14px 2px; }
  .lnk { padding-block: 14px; margin-block: -14px; }

  /* textos de menos de 12 px */
  .tbl th, .tbl-cerca td[data-label]::before, .soon, .ej-tag, .nt-cat, .tag, .demo-chip, .faq-list .cat { font-size: 12px; }
  .faq-cats button, .mv-sound { min-height: 44px; }
  /* mapas de MapLibre: botones de zoom de 44 px y créditos con zona táctil ampliada (el icono no cambia de tamaño) */
  .maplibregl-ctrl-group button { width: 44px; height: 44px; }
  .maplibregl-ctrl-attrib-button::after { content: ""; position: absolute; inset: -10px; }

  /* desbordes: un grid de una columna no debe ensancharse con un texto sin cortes */
  .cards2, .cards3 { grid-template-columns: minmax(0, 1fr); }
  .tag.soon { white-space: normal; border-radius: 14px; }
  .tbl-cerca td b a { display: inline-block; min-width: 44px; }   /* nombres cortos de municipio («Lugo», «Jaén»): zona táctil de 44 px también a lo ancho */
  .inl.money input { padding-block: 11px; margin-block: -11px; }   /* cifra editable dentro de una frase */

  /* tablas con desplazamiento lateral: sombras a los lados que avisan de que hay más columnas */
  .tbl-wrap {
    background:
      linear-gradient(to right, #fff 30%, rgba(255,255,255,0)) left center / 32px 100% no-repeat local,
      linear-gradient(to left, #fff 30%, rgba(255,255,255,0)) right center / 32px 100% no-repeat local,
      linear-gradient(to right, rgba(15,43,39,.18), rgba(15,43,39,0)) left center / 14px 100% no-repeat scroll,
      linear-gradient(to left, rgba(15,43,39,.18), rgba(15,43,39,0)) right center / 14px 100% no-repeat scroll,
      #fff;
  }
}
/* cabecera de la portada: «una iniciativa de eVoost» no cabe junto al selector de idioma y al contador */
@media (max-width: 980px) { .site-top.open .sitenav a { display: flex; align-items: center; min-height: 44px; } }   /* menú de las páginas interiores */
@media (max-width: 400px) { .top .brand-by { display: none; } }
@media (max-width: 600px) { .top:has(.live:not([hidden])) .brand-by { display: none; } }
/* quien ya participó: logo, idioma, «Mi participación» y contador no caben en una fila; el contador cede su sitio (el ticker se queda) */
@media (max-width: 480px) { .top.con-mi .live { display: none; } }
@media (max-width: 350px) {
  .top.con-mi .brand-word { font-size: 16px; }
  .top.con-mi .top-mi { padding-left: 10px; padding-right: 10px; font-size: 12.5px; }
  .top.con-mi .i18n-sel--cab .i18n-corto, .top.con-mi .i18n-sel--cab .i18n-flecha { display: none; }   /* el selector, solo con el globo */
}
/* «Mi participación»: el hueco de «Cargando…» tiene el alto de la tarjeta de entrada, para que el pie no salte al aparecer (CLS de 0,2) */
#miCargando { min-height: 480px; }
@media (max-width: 400px) { #miCargando { min-height: 540px; } }
/* aviso de versión nueva (site.js) */
.nueva-version { position: fixed; left: 50%; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); z-index: 90;
  display: flex; align-items: center; gap: 12px; padding: 10px 12px 10px 16px; border-radius: 12px; background: #0F2B27; color: #fff;
  font: 600 14px/1.3 var(--vk-font-text, system-ui, sans-serif); box-shadow: 0 14px 34px -16px rgba(0,0,0,.6); max-width: calc(100vw - 32px); }
.nueva-version button { min-height: 40px; padding: 0 14px; border: 0; border-radius: 10px; background: #FFB938; color: #0F2B27; font: inherit; cursor: pointer; }
.nueva-version button:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }