/* RSJ · plantillas v3 · hoja de permisos (plantillas permisos-municipio v0.3.1 y permisos-indice v0.4.1, paquete rsj_plantilla_permisos_v1.0 del
   chat «Permisos: índice y municipios», aprobadas por Miguel el 25/10/2026). Primero, los módulos validados de la biblioteca tal cual (copias de
   blog.css y campana.css: breadcrumbs, card-producto, cta, grid-productos, faqs y contenido-seo); después, los módulos nuevos del paquete (su
   css/permisos.css, regla a regla sin cambios); al final, lo propio de la plantilla. Del css/permisos.css del paquete NO se copian: los tokens y la
   base (iguales que comun.css, salvo la fuente de reserva), la clase .btn (la da comun.css: los botones salen con su radio, no en forma de
   píldora) ni las versiones simplificadas del header, breadcrumbs, contenido-seo, grid-productos, faqs, cta y footer de la maqueta, ni las
   reglas del índice v0.2 que la v0.4.1 ya no usa (.hdr, .logo, .lang y .camp chocan con el header común): ver docs/permisos.md. */
/* ===== biblioteca: breadcrumbs (sin cambios) ===== */
/* RSJ · breadcrumbs (migas de pan) · v1.0 (validado por Miguel el 08/10/2026). Biblioteca de módulos. Ficha v0.4. Texto 14 en text-muted, la página actual
   en ink; separador «/» decorativo. Si no cabe en móvil, pasa a la línea siguiente. El JSON-LD BreadcrumbList lo genera el servidor. */
.m-migas{padding-block:var(--s-16);font-size:var(--fs-aux)}
.m-migas ol{display:flex;flex-wrap:wrap;gap:var(--s-8);margin:0;padding:0;list-style:none}
.m-migas li{display:flex;gap:var(--s-8);color:var(--color-text-muted)}
.m-migas li+li::before{content:"/";color:var(--color-border-strong)}
.m-migas a{display:inline-flex;align-items:center;min-height:var(--h-touch-min);margin-block:calc(-1*var(--s-12));color:var(--color-text-muted)}
.m-migas a:hover{color:var(--color-ink)}
.m-migas [aria-current]{color:var(--color-ink);font-weight:var(--fw-medium)}

/* ===== biblioteca: card-producto (sin cambios) ===== */
/* RSJ · card-producto · v1.0 (validado por Miguel el 08/10/2026). Biblioteca de módulos. Libro §8.1 (K1, maqueta validada): móvil horizontal
   con foto de 96 px; vertical desde 768. Foto, nombre, formato, precio por unidad (cantidad mínima), precio por envase,
   aviso de tramos (si los hay), botón de 48 px a todo el ancho y disponibilidad (aviso-stock) debajo. Sin sombra. */
.m-card{display:grid;grid-template-columns:var(--card-thumb) minmax(0,1fr);gap:var(--s-12);align-items:start;padding:var(--s-12);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface)}
.m-card__foto{display:block;text-decoration:none;border:1px solid var(--color-border);border-radius:var(--radius-sm);overflow:hidden;background:var(--color-surface)}
.m-card__foto img{width:100%;aspect-ratio:1;object-fit:contain}
.m-card__sinfoto{aspect-ratio:1;display:grid;place-items:center;padding:var(--s-4);background:var(--color-surface-soft);color:var(--color-text-muted);font-size:var(--fs-badge);font-weight:var(--fw-semibold);text-align:center;line-height:1.3}
.m-card__datos{display:flex;flex-direction:column;gap:var(--s-4);min-width:0}
.m-card__nombre{font-size:var(--fs-body);font-weight:var(--fw-semibold);line-height:var(--lh-h3)}
.m-card__nombre a{color:var(--color-ink);text-decoration:none}
.m-card__nombre a:hover{color:var(--color-ink);text-decoration:underline}
.m-card__fmt,.m-card__envase{font-size:var(--fs-aux);font-weight:var(--fw-medium);color:var(--color-text-muted)}
.m-card__precio{margin-top:var(--s-4);font-size:var(--fs-price);font-weight:var(--fw-bold);line-height:var(--lh-tight);color:var(--color-action);font-variant-numeric:tabular-nums}
.m-card__precio small{font-size:var(--fs-aux);font-weight:var(--fw-medium);color:var(--color-text-muted)}
.m-card__tramo{font-size:var(--fs-aux);font-weight:var(--fw-medium);color:var(--color-action)}
.m-card__accion{margin-top:var(--s-8)}
.m-card__accion .btn{width:100%;padding-inline:var(--s-12)}
.m-card__off{margin-top:var(--s-8);font-size:var(--fs-aux);font-weight:var(--fw-semibold);color:var(--color-text-muted)}
.m-card .m-stock{margin-top:var(--s-12)}
@media (min-width:768px){
 .m-card{display:flex;flex-direction:column;height:100%}
 .m-card__foto{width:100%}
 .m-card__datos{flex:1}
 .m-card__accion{margin-top:auto;padding-top:var(--s-12)}
}
/* v1.1 (validado por Miguel el 09/10/2026; portada de campaña): línea «Se suele vender a X €/unidad» con el precio sugerido (PDC-H2), solo si la plantilla la pide */
.m-card__reventa{margin-top:var(--s-4);padding:var(--s-4) var(--s-8);border-radius:var(--radius-sm);background:var(--color-action-soft);font-size:var(--fs-aux);color:var(--color-ink)}
.m-card__reventa b{color:var(--color-action)}

/* ===== biblioteca: cta (sin cambios) ===== */
/* RSJ · cta (pedidos grandes y entidades) · v1.0 (validado por Miguel el 08/10/2026). Biblioteca de módulos. Caja con título, texto y botón secundario.
   El enlace es un dato (PDC-MOD1: /presupuesto/ recomendado). Sin JS. */
.m-cta{display:grid;gap:var(--s-16);align-items:center;padding:var(--s-24);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface)}
.m-cta p{max-width:60ch;margin-top:var(--s-8);color:var(--color-text-muted)}
@media (min-width:768px){.m-cta{grid-template-columns:1fr auto;padding:var(--s-32)}}


/* ===== biblioteca: grid-productos (sin cambios) ===== */
/* RSJ · grid-productos · v1.0 (validado por Miguel el 08/10/2026). Biblioteca de módulos. Libro §4.3: 1 columna (tarjeta horizontal) en móvil,
   3 desde 768 y 4 desde 1024, con los tokens --grid-cols y --grid-gap. Todos los productos en el HTML. */
.m-grid__lista{display:grid;grid-template-columns:repeat(var(--grid-cols),minmax(0,1fr));gap:var(--grid-gap);margin:0;padding:0;list-style:none}

/* ===== biblioteca: faqs (sin cambios) ===== */
/* RSJ · faqs (B03, + acordeón) · v1.0 (validado por Miguel el 08/10/2026). Biblioteca de módulos. <details>/<summary> nativos: sin JS, accesibles y
   todo el texto en el HTML (bueno para buscadores). Home v0.12: punto de marca a la izquierda, chevron-down de Lucide a la derecha,
   abierta con fondo surface-soft y filete de marca. Animación de 150 ms solo donde el navegador sabe animar la altura. */
.m-faqs{border-top:1px solid var(--color-border)}
.m-faqs__p{border-bottom:1px solid var(--color-border)}
.m-faqs__p summary{position:relative;min-height:var(--h-touch-min);padding:var(--s-16) var(--s-48) var(--s-16) var(--s-32);font-weight:var(--fw-semibold);list-style:none;cursor:pointer}
.m-faqs__p summary::-webkit-details-marker{display:none}
.m-faqs__p summary::before{content:"";position:absolute;left:var(--s-12);top:calc(var(--s-16) + .6em);width:var(--s-8);height:var(--s-8);border-radius:50%;background:var(--color-brand-600)}
.m-faqs__p summary svg{position:absolute;right:var(--s-12);top:calc(var(--s-16) + .1em);width:var(--icon-sm);height:var(--icon-sm);color:var(--color-brand-600);transition:transform 150ms var(--ease)}
.m-faqs__p[open]{background:var(--color-surface-soft);box-shadow:inset 3px 0 0 var(--color-brand-600)}
.m-faqs__p[open] summary svg{transform:rotate(180deg)}
.m-faqs__r{padding:0 var(--s-48) var(--s-16) var(--s-32)}
.m-faqs__r p{max-width:75ch}
@supports (interpolate-size:allow-keywords){.m-faqs{interpolate-size:allow-keywords}.m-faqs__p::details-content{block-size:0;overflow:hidden;transition:block-size 150ms var(--ease),content-visibility 150ms allow-discrete}.m-faqs__p[open]::details-content{block-size:auto}}
@media (prefers-reduced-motion:reduce){.m-faqs__p summary svg{transition:none}.m-faqs__p::details-content{transition:none}}

/* ===== biblioteca: contenido-seo (sin cambios) ===== */
/* RSJ · contenido-seo · v1.1 (validado por Miguel el 15/10/2026; v1.0 el 08/10/2026; v1.1 de la portada de campaña, MENOR: minmax(0,1fr) en la rejilla de móvil). Biblioteca de módulos. D20: texto largo en caja con imagen principal a la derecha
   (H26: imagen por confirmar). Ajustes: radios --radius-md. Dos columnas de texto desde 1024. Sin JS. */
.m-seo{padding:var(--s-24);border:1px solid var(--color-border);border-radius:var(--radius-md)}
.m-seo__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-24);grid-template-areas:"h" "f" "t"} /* v1.1: minmax(0,1fr) para que una etiqueta larga no desborde en móvil */
.m-seo__grid>h2{grid-area:h}
.m-seo__fig{grid-area:f;display:grid;gap:var(--s-8);justify-items:center;align-self:start;margin:0;padding:var(--s-16);border-radius:var(--radius-md);background:var(--color-brand-100)}
.m-seo__fig img{width:100%;max-width:340px;height:auto;aspect-ratio:640/500}
.m-seo__fig figcaption{font-size:var(--fs-badge);color:var(--color-brand-700);text-align:center}
.m-seo__texto{grid-area:t}
.m-seo__texto>*+*{margin-top:var(--s-16)}
.m-seo__texto h3{margin-top:var(--s-24);font-size:var(--fs-body)}
.m-seo[data-variante=sin-imagen] .m-seo__grid{grid-template-areas:"h" "t"}
@media (min-width:1024px){
 .m-seo{padding:var(--s-48)}
 .m-seo__grid{grid-template-columns:minmax(0,1fr) 320px;grid-template-areas:"h f" "t f";column-gap:var(--s-48)}
 .m-seo[data-variante=sin-imagen] .m-seo__grid{grid-template-columns:1fr;grid-template-areas:"h" "t"}
 .m-seo__texto{column-count:2;column-gap:var(--s-48)}
 .m-seo__texto h3{break-after:avoid}
 .m-seo__texto p{break-inside:avoid}
}

/* ===== módulos de permisos (css/permisos.css del paquete rsj_plantilla_permisos_v1.0, sin cambios: las reglas que usan las dos plantillas) ===== */
.narrow{max-width:880px}
.btn--pri{background:var(--color-action);color:#fff}
.btn--pri:hover{background:var(--color-action-hover);color:#fff}
.btn--sec{background:var(--color-surface);border-color:var(--color-action);color:var(--color-action)}
.btn--sec:hover{background:var(--color-action-soft)}
/* ===== PROPUESTA · hero-municipio ===== */
.hm{position:relative;overflow:hidden;background:var(--color-brand-100);color:var(--color-ink)}
.hm-art{position:absolute;inset:0}
.hm-gen,.hm-ilu,.hm-foto,.hm-tint,.hm-shade{position:absolute;inset:0;width:100%;height:100%;display:none}
.hm-foto{object-fit:cover;object-position:var(--foco,50% 50%);filter:grayscale(1) contrast(1.05) brightness(1.2)}
.hm-tint{background:var(--color-brand-600);mix-blend-mode:multiply;opacity:.72}
.hm-shade{background:linear-gradient(90deg,rgba(146,39,10,.6) 0%,rgba(146,39,10,.25) 50%,rgba(146,39,10,0) 100%)}
.hm[data-fondo=generico] .hm-gen{display:block}
.hm[data-fondo=foto] .hm-foto,.hm[data-fondo=foto] .hm-tint,.hm[data-fondo=foto] .hm-shade{display:block}
.hm[data-fondo=ilustracion] .hm-ilu,.hm[data-fondo=ilustracion] .hm-shade{display:block}
.hm[data-fondo=foto],.hm[data-fondo=ilustracion]{color:#fff;background:var(--color-brand-700)}
.hm .container{position:relative;min-height:260px;display:flex;flex-direction:column;justify-content:flex-end;padding-block:var(--s-32)}
@media(min-width:1024px){.hm .container{min-height:320px}}
.hm[data-fondo=generico] .hm-kicker{color:var(--color-brand-700)}
.hm[data-fondo=generico] .status{box-shadow:var(--shadow-sm)}
.hm-kicker{font-size:var(--fs-aux);font-weight:600;opacity:.92}
.hm h1{font-size:var(--fs-h3);line-height:1.3;font-weight:600;margin-top:var(--s-4);max-width:28ch}
.hm-city{display:block;font-size:clamp(44px,9vw,96px);line-height:.95;font-weight:800;letter-spacing:-.02em;margin-top:var(--s-8)}
.hm[data-fondo=generico] .hm-city{color:var(--color-brand-600)}
.hm-credit{position:absolute;right:var(--gutter);bottom:var(--s-8);font-size:11px;opacity:.75}
.status{display:inline-flex;align-items:center;gap:var(--s-8);margin-top:var(--s-16);padding:6px 14px 6px 10px;border-radius:var(--radius-pill);font-weight:700;font-size:var(--fs-aux);background:#fff;color:var(--color-ink);width:max-content;max-width:100%}
.status i{width:10px;height:10px;border-radius:50%;background:var(--color-border-strong);flex:none}
.status[data-e=abierto] i{background:#16A34A;box-shadow:0 0 0 4px rgba(22,163,74,.22)}
.status[data-e=porabrir] i{background:var(--color-warning)}
.status[data-e=cerrado] i{background:var(--color-error)}
/* ===== PROPUESTA · ficha-permiso (respuestas rápidas + pasos) ===== */
.fp-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:var(--s-12);margin-bottom:var(--s-24)}
.fp-head h2{font-size:var(--fs-h2)}
.fp-rev{font-size:var(--fs-aux);color:var(--color-text-muted)}
.answers{display:grid;gap:var(--s-16);grid-template-columns:1fr}
@media(min-width:768px){.answers{grid-template-columns:1.3fr 1fr 1fr}}
.ans{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--s-24);display:flex;flex-direction:column;gap:var(--s-8)}
.ans-q{display:flex;align-items:center;gap:var(--s-8);font-weight:700;font-size:var(--fs-aux);color:var(--color-text-muted)}
.ans-q svg{width:24px;height:24px;color:var(--color-brand-600)}
.ans-a{font-size:var(--fs-h3);line-height:1.25;font-weight:700}
.ans-note{font-size:var(--fs-aux);color:var(--color-text-muted)}
.ans--when{border-color:transparent;background:var(--color-brand-100)}
.ans--when .ans-a{font-size:22px}
@media(min-width:1024px){.ans--when .ans-a{font-size:26px}}
/* línea de tiempo del plazo */
.tl{margin-top:var(--s-12)}
.tl-bar{position:relative;height:10px;border-radius:var(--radius-pill);background:rgba(184,50,13,.18)}
.tl-fill{position:absolute;left:0;top:0;bottom:0;border-radius:inherit;background:var(--color-brand-600);width:0;transition:width 600ms var(--ease)}
.tl-today{position:absolute;top:50%;width:18px;height:18px;margin-left:-9px;margin-top:-9px;border-radius:50%;background:#fff;border:3px solid var(--color-ink)}
.tl-lbl{display:flex;justify-content:space-between;font-size:12px;font-weight:600;margin-top:6px;color:var(--color-brand-700)}
.big-count{display:flex;align-items:baseline;gap:6px;margin-top:var(--s-8)}
.big-count b{font-size:44px;line-height:1;font-weight:800;color:var(--color-brand-600)}
.big-count span{font-weight:600}
/* pasos: el "carné" que se sella */
.steps{margin-top:var(--s-32);display:grid;gap:var(--s-24);grid-template-columns:1fr}
@media(min-width:1024px){.steps{grid-template-columns:1.6fr 1fr;align-items:start}}
.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--s-24)}
.card h3{font-size:var(--fs-h3);margin-bottom:var(--s-4)}
.prog{display:flex;align-items:center;gap:var(--s-12);margin:var(--s-16) 0}
.prog-bar{flex:1;height:8px;border-radius:var(--radius-pill);background:var(--color-action-soft);overflow:hidden}
.prog-bar i{display:block;height:100%;width:0;background:var(--color-action);transition:width var(--dur-base) var(--ease)}
.prog b{font-size:var(--fs-aux);white-space:nowrap}
.steplist{list-style:none;padding:0;display:grid;gap:var(--s-8);counter-reset:p}
.steplist li{counter-increment:p}
.step{display:flex;gap:var(--s-12);align-items:flex-start;padding:var(--s-12) var(--s-16);border-radius:var(--radius-md);border:1px solid var(--color-border);cursor:pointer;transition:background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease)}
.step:hover{background:var(--color-surface-soft)}
.step input{position:absolute;opacity:0;pointer-events:none}
.step-n{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-weight:800;border:2px solid var(--color-border-strong);color:var(--color-text-muted)}
.step-n::before{content:counter(p)}
.step-t b{display:block;font-weight:700}
.step-t span{font-size:var(--fs-aux);color:var(--color-text-muted)}
.step input:checked ~ .step-n{background:var(--color-action);border-color:var(--color-action);color:#fff}
.step input:checked ~ .step-n::before{content:"✓"}
.step:has(input:checked){background:var(--color-action-soft);border-color:transparent}
.step input:focus-visible ~ .step-n{outline:2px solid var(--color-action);outline-offset:2px}
.go{display:flex;flex-wrap:wrap;gap:var(--s-12);margin-top:var(--s-16)}
/* sello */
.stamp-wrap{display:grid;place-items:center;text-align:center;gap:var(--s-12);min-height:260px;background:var(--color-surface-soft);border:2px dashed var(--color-border);border-radius:var(--radius-lg);padding:var(--s-24)}
.stamp{width:180px;height:180px;border-radius:50%;display:grid;place-items:center;border:5px double var(--color-border-strong);color:var(--color-border-strong);font-weight:800;line-height:1.1;transform:rotate(-8deg);opacity:.45;transition:all 400ms var(--ease)}
.stamp span{display:block;font-size:13px;font-weight:700}
.stamp b{display:block;font-size:22px;margin:4px 0}
.done .stamp{opacity:1;border-color:var(--color-brand-600);color:var(--color-brand-600);transform:rotate(-8deg) scale(1.05);animation:pop 450ms var(--ease)}
0%{transform:rotate(-30deg) scale(1.6);opacity:0}
100%{transform:rotate(-8deg) scale(1.05);opacity:1}
@media (prefers-reduced-motion:reduce){.done .stamp{animation:none}}
.stamp-msg{font-weight:600;max-width:30ch}
/* ===== PROPUESTA · aviso-plazo (formulario) ===== */
.av{background:var(--color-ink);color:#fff;border-radius:var(--radius-lg);padding:var(--s-32) var(--s-24);display:grid;gap:var(--s-24);grid-template-columns:1fr}
@media(min-width:1024px){.av{grid-template-columns:1fr 1.1fr;padding:var(--s-48)}}
.av h2{font-size:var(--fs-h2)}
.av p{opacity:.85;margin-top:var(--s-8)}
.av form{display:grid;gap:var(--s-12)}
.av .row{display:grid;gap:var(--s-12);grid-template-columns:1fr}
@media(min-width:768px){.av .row{grid-template-columns:1fr 1fr}}
.fld label{display:block;font-size:var(--fs-aux);font-weight:600;margin-bottom:4px}
.fld input,.fld select{width:100%;min-height:var(--h-btn);border-radius:var(--radius-md);border:1px solid transparent;padding:0 var(--s-16);background:#fff;color:var(--color-ink)}
.chk{display:flex;gap:var(--s-8);align-items:flex-start;font-size:var(--fs-aux)}
.chk input{width:20px;height:20px;margin-top:2px;flex:none;accent-color:var(--color-action)}
.chk a{color:#9FE0B8}
.av .btn--pri{background:#2E9A5B;justify-self:start}
.av .btn--pri:hover{background:#3BB16B}
.av-ok{display:none;background:rgba(255,255,255,.08);border-radius:var(--radius-md);padding:var(--s-24)}
.av-ok b{display:block;font-size:var(--fs-h3);margin-bottom:4px}
.av.sent form{display:none}
.av.sent .av-ok{display:block}
.av-perks{list-style:none;padding:0;margin-top:var(--s-16);display:grid;gap:6px;font-size:var(--fs-aux)}
.av-perks li::before{content:"✓";color:#9FE0B8;font-weight:800;margin-right:8px}
/* ===== PROPUESTA · enlazado-interno ===== */
.ei h2{font-size:var(--fs-h3);margin-bottom:var(--s-16)}
.chips{display:flex;flex-wrap:wrap;gap:var(--s-8)}
.chips a{display:inline-flex;align-items:center;min-height:var(--h-touch-min);padding:0 var(--s-16);border-radius:var(--radius-pill);border:1px solid var(--color-border);text-decoration:none;color:var(--color-ink);font-weight:600;font-size:var(--fs-aux);background:var(--color-surface)}
.chips a:hover{border-color:var(--color-action);color:var(--color-action)}
.chips a.lk{background:var(--color-action-soft);border-color:transparent;color:var(--color-action)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.md h3{font-size:var(--fs-h3);margin:var(--s-24) 0 var(--s-8)}
.md p,.md ul{margin-top:var(--s-12);max-width:68ch}
.md ul{padding-left:1.2em}
.md .vid{margin-top:var(--s-16);aspect-ratio:16/9;max-width:560px;border-radius:var(--radius-md);background:#26302B;color:#fff;display:grid;place-items:center;font-size:var(--fs-aux)}
.ans{align-items:center;justify-content:center;text-align:center}
.ans .ans-q{justify-content:center}
.mods li{justify-content:center}
.stamp-note{font-size:var(--fs-aux);color:var(--color-text-muted);max-width:34ch;margin:0 auto}
.stamp-msg{margin-inline:auto}
.canal{display:flex;gap:var(--s-8);flex-wrap:wrap}
.canal label{display:inline-flex;align-items:center;gap:6px;min-height:var(--h-touch-min);padding:0 var(--s-16);border-radius:var(--radius-pill);border:1px solid rgba(255,255,255,.35);cursor:pointer;font-weight:600;font-size:var(--fs-aux)}
.canal input{accent-color:#2E9A5B;width:18px;height:18px}
.canal label:has(input:checked){background:#fff;color:var(--color-ink)}
.fld small{display:block;font-size:12px;opacity:.8;margin-top:4px}
.mods{list-style:none;padding:0;display:grid;gap:6px;margin-top:var(--s-8)}
.mods li{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline;font-size:var(--fs-aux)}
.mods b{font-size:var(--fs-body)}
.pill{display:inline-block;font-size:12px;font-weight:700;border-radius:var(--radius-pill);padding:1px 8px;background:#fff}
.pill[data-e=abierto]{background:#DCFCE7;color:#166534}
.pill[data-e=porabrir]{background:var(--color-warning-soft);color:var(--color-warning)}
.pill[data-e=cerrado]{background:var(--color-error-soft);color:var(--color-error)}
/* índice */
.srch{margin-top:var(--s-24);max-width:560px}
.srch label{display:block;font-weight:700;margin-bottom:6px}
.srch input{width:100%;min-height:56px;border-radius:var(--radius-pill);border:2px solid var(--color-border-strong);padding:0 var(--s-24);font-size:18px}
.srch input:focus{border-color:var(--color-action);outline:none}
.srch p{font-size:var(--fs-aux);color:var(--color-text-muted);margin-top:6px}
.lm-grid{display:grid;gap:var(--s-16);grid-template-columns:repeat(auto-fill,minmax(260px,1fr));margin-top:var(--s-24)}
.lm-card{display:flex;flex-direction:column;gap:var(--s-8);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--s-24);background:var(--color-surface);text-decoration:none;color:var(--color-ink);transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
.lm-card:hover{border-color:var(--color-brand-600);box-shadow:var(--shadow-sm);color:var(--color-ink)}
.lm-card h3{font-size:24px;line-height:1.1;font-weight:800;color:var(--color-brand-600)}
.lm-card p{font-size:var(--fs-aux);color:var(--color-text-muted);flex:1}
.lm-tags{display:flex;flex-wrap:wrap;gap:6px}
.lm-tags span{font-size:12px;font-weight:700;border-radius:var(--radius-pill);padding:2px 10px;background:var(--color-surface-soft);border:1px solid var(--color-border)}
.lm-tags .g{background:var(--color-action-soft);border-color:transparent;color:var(--color-action)}
.lm-go{font-weight:700;color:var(--color-action);font-size:var(--fs-aux)}
.lm-empty{margin-top:var(--s-24)}
.lm-count{font-size:var(--fs-aux);color:var(--color-text-muted);margin-top:var(--s-16)}
.ph h1{font-size:var(--fs-h1);line-height:var(--lh-h1);font-weight:800;max-width:22ch}
.ph{background:var(--color-brand-100);position:relative;overflow:hidden}
.top-grid{display:grid;gap:var(--s-16);grid-template-columns:repeat(auto-fill,minmax(220px,1fr));margin-top:var(--s-24)}
.tc{display:flex;flex-direction:column;justify-content:space-between;gap:var(--s-16);min-height:132px;padding:var(--s-24);border-radius:var(--radius-lg);background:var(--color-brand-100);color:var(--color-ink);text-decoration:none;transition:transform var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
.tc:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm);color:var(--color-ink)}
.tc-n{font-size:30px;line-height:1;font-weight:800;color:var(--color-brand-600)}
.tc-t{display:flex;flex-wrap:wrap;gap:6px}
.tg{font-size:12px;font-weight:700;border-radius:var(--radius-pill);padding:1px 8px;background:#fff;border:1px solid var(--color-border)}
.tg.g{background:var(--color-action-soft);border-color:transparent;color:var(--color-action)}
.pill[data-e=sin]{background:#fff;color:var(--color-text-muted);border:1px solid var(--color-border)}
/* índice v0.4 */
.srch input{background:#fff;color:var(--color-ink);color-scheme:light}
.srch input::placeholder{color:var(--color-text-muted)}
.srch label{color:var(--color-ink)}
.ph{--veil:.5;background:var(--color-brand-100)}
.ph-art{position:absolute;inset:0;overflow:hidden}
.ph-art .hm-gen,.ph-art .ph-foto{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;filter:blur(5px);transform:scale(1.06)}
.ph-veil{position:absolute;inset:0;background:var(--color-brand-100);opacity:var(--veil)}
.ph .container{position:relative;z-index:1}
.ph h1,.srch p{color:var(--color-ink)}
.srch p{text-shadow:0 0 8px rgba(255,255,255,.9)}
.top-grid{grid-template-columns:1fr}
@media(min-width:560px){.top-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:900px){.top-grid{grid-template-columns:repeat(3,1fr)}}
.lm-list{display:grid;gap:var(--s-16);margin-top:var(--s-24)}
.lm-grp{display:flex;flex-wrap:wrap;gap:var(--s-16)}
.lm-grp .lm-card{flex:1 1 calc((100% - (var(--cols) - 1) * var(--s-16)) / var(--cols));min-width:0}
.lm-band{display:flex;flex-wrap:wrap;align-items:center;gap:6px var(--s-24);padding:var(--s-24) var(--s-32);border-radius:var(--radius-lg);text-decoration:none;color:#fff;background:var(--color-brand-600);transition:transform var(--dur-fast) var(--ease)}
.lm-band:hover{color:#fff;transform:translateY(-2px)}
.lm-band[data-c=verde]{background:var(--color-action)}
.lm-band[data-c=oscuro]{background:var(--color-ink)}
.lm-band-k{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:rgba(255,255,255,.18);border-radius:var(--radius-pill);padding:3px 10px}
.lm-band b{flex:1;font-size:clamp(18px,2.4vw,24px);line-height:1.2;min-width:14ch}
.lm-band-go{font-weight:700;white-space:nowrap}
.ph .container{position:relative;padding-block:var(--s-48)}
.lm-empty{margin-top:var(--s-24);border:2px dashed var(--color-border-strong);border-radius:var(--radius-md);padding:var(--s-16);font-size:var(--fs-aux)}

/* ===== PLANTILLAS de permisos (no es código de módulos) ===== */
/* Columnas del listado completo: el marcado de referencia lleva style="--cols:3" fijo y en la maqueta lo cambiaba su JavaScript según la pantalla
   (3, 2 o 1). El servidor no conoce la pantalla y la página tiene que verse bien sin JavaScript: lo deciden estas tres reglas (mismos cortes) */
.lm-grp{--cols:1}
@media(min-width:560px){.lm-grp{--cols:2}}
@media(min-width:900px){.lm-grp{--cols:3}}
/* La píldora de estado del módulo (.pill) se llama igual que la píldora de campaña del header común (.m-header .pill): sin esto, el header de estas
   páginas recibía su relleno, su fondo y su tamaño de letra */
.m-header .pill{padding:0;background:none;border-radius:0;font-size:inherit;font-weight:inherit}