/*
Theme Name: Juntos por Colombia — Astra Child
Template: astra
Version: 1.0.0
Description: Sistema de diseño "El aviso de la tienda" — Guía de diseño v1.2. Tokens de color, tipografía autoalojada y escala fluida.
*/

/* ===== Fuentes autoalojadas (Guía §4 y §11.3) ===== */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/bricolage-grotesque-700.woff2') format('woff2')}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:800;font-display:swap;src:url('fonts/bricolage-grotesque-800.woff2') format('woff2')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/instrument-sans-400.woff2') format('woff2')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/instrument-sans-500.woff2') format('woff2')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/instrument-sans-600.woff2') format('woff2')}
@font-face{font-family:'DM Mono';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/dm-mono-400.woff2') format('woff2')}
@font-face{font-family:'DM Mono';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/dm-mono-500.woff2') format('woff2')}

/* ===== Tokens (Guía §3, §4, §5) ===== */
:root{
  --noche:#0D1526;
  --noche-hondo:#080E1A;
  --noche-superficie:#17233C;
  --amarillo-aviso:#FFC42E;
  --teja:#C2542D;
  --cal:#F1F2EC;
  --papel:#FBFBF8;
  --tinta:#141B24;
  --humo:#5E6773;
  --t-hero:clamp(2.5rem,6.2vw,4.75rem);
  --t-h2:clamp(1.85rem,3.4vw,2.9rem);
  --t-h3:clamp(1.2rem,1.7vw,1.5rem);
  --t-lead:clamp(1.06rem,1.35vw,1.3rem);
  --t-cuerpo:clamp(1rem,1.05vw,1.125rem);
  --t-dato:.78rem;
  --seccion:clamp(64px,8.5vw,118px);
}

/* ===== Base ===== */
body{
  font-family:'Instrument Sans',-apple-system,'Segoe UI',sans-serif;
  font-size:var(--t-cuerpo);
  line-height:1.62;
  color:var(--tinta);
  background-color:var(--cal);
}
a{color:var(--noche)}
a:hover{color:var(--noche-superficie)}

/* ===== Titulares: anchos, compactos (Guía §4) ===== */
h1,h2,h3,h4,h5,h6,.site-title,
.entry-content h1,.entry-content h2,.entry-content h3{
  font-family:'Bricolage Grotesque',sans-serif;
  font-weight:800;
  line-height:1.03;
  letter-spacing:-.02em;
  color:var(--tinta);
}
body h1,.entry-content h1{font-size:var(--t-hero);letter-spacing:-.03em}
body h2,.entry-content h2{font-size:var(--t-h2)}
body h3,.entry-content h3{font-size:var(--t-h3)}

/* Ancho de lectura (Guía §4): 56ch en párrafos de contenido */
.entry-content > p{max-width:56ch}
.entry-content > p.has-text-align-center{margin-left:auto;margin-right:auto}

/* ===== Botones: rótulo, no burbuja (Guía §5) ===== */
.wp-block-button__link,.button,button,input[type=submit],input[type=button],.ast-button,.woocommerce a.button{
  font-family:'Instrument Sans',sans-serif;
  font-weight:600;
  border-radius:6px;
}
.wp-block-button__link:not(.has-background){background-color:var(--noche);color:#fff}
.wp-block-button__link:not(.has-background):hover{background-color:var(--noche-superficie);color:#fff}
.is-style-outline .wp-block-button__link{border:2px solid var(--tinta);color:var(--tinta)}

/* Botón WhatsApp en azul noche de marca (Guía §3, "Sobre el verde de WhatsApp") */
.jpc-whatsapp-btn{background:var(--noche) !important;color:#fff !important;border-radius:6px}
.jpc-whatsapp-btn:hover{background:var(--noche-superficie) !important}

/* ===== Dato verificable en mono (Guía §4) ===== */
.jpc-dato,.entry-content .has-small-font-size{
  font-family:'DM Mono',monospace;
  font-size:var(--t-dato);
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--teja);
}

/* ===== Tarjetas con borde de tinta (Guía §2) ===== */
ul.products li.product{
  background:var(--papel);
  border:2px solid var(--tinta);
  border-radius:6px;
  padding:16px;
}

/* ===== Accesibilidad (Guía §8) ===== */
:focus-visible{outline:3px solid var(--amarillo-aviso);outline-offset:2px}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important}
}

/* ============================================================
   HOME "El aviso de la tienda" — mockup v1.2 en bloques Gutenberg
   Las clases jpc-* se asignan en "Clase(s) CSS adicional(es)"
   ============================================================ */

/* Contenedor y ritmo */
.jpc-wrap{max-width:1180px;margin-inline:auto !important;padding-inline:clamp(20px,4vw,40px)}
.jpc-seccion{padding-block:var(--seccion)}

/* Etiqueta mono (dato verificable) */
.jpc-mono{font-family:'DM Mono',monospace !important;font-size:var(--t-dato) !important;letter-spacing:.14em;text-transform:uppercase;font-weight:500}

/* Subrayado pincel: único gesto decorativo */
.jpc-pincel{background:linear-gradient(var(--amarillo-aviso),var(--amarillo-aviso));background-size:100% .2em;background-position:0 96%;background-repeat:no-repeat;padding-inline:.06em}

/* ===== Header oscuro estilo aviso ===== */
.site-header,.ast-primary-header-bar{background:var(--noche) !important}
.site-header{position:sticky;top:0;z-index:60;border-bottom:1px solid rgba(255,255,255,.18)}
body.admin-bar .site-header{top:32px}
.site-header .site-title a{color:#fff !important;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:.005em}
.site-header .site-description{color:var(--amarillo-aviso) !important;font-family:'DM Mono',monospace;font-size:.63rem;letter-spacing:.16em;text-transform:uppercase}
.main-header-menu .menu-link,.ast-builder-menu .menu-link{color:rgba(255,255,255,.86) !important;font-weight:500}
.main-header-menu .menu-link:hover,.main-header-menu .current-menu-item>.menu-link{color:#fff !important}
.main-header-menu>.menu-item:last-child>.menu-link{background:var(--amarillo-aviso);color:var(--tinta) !important;border-radius:6px;padding:12px 18px;font-weight:600}
.main-header-menu>.menu-item:last-child>.menu-link:hover{background:#FFD25E}
.ast-mobile-menu-trigger-minimal,.mobile-menu-toggle{color:#fff !important}

/* ===== Hero ===== */
.jpc-hero{background:var(--noche);color:#fff}
.jpc-hero .jpc-wrap{padding-top:clamp(56px,7vw,96px);padding-bottom:clamp(48px,6vw,80px)}
.jpc-hero h1{color:#fff;max-width:17ch;margin-top:26px}
.jpc-eyebrow{color:var(--amarillo-aviso) !important;display:inline-block;border:1px solid rgba(255,196,46,.4);border-radius:100px;padding:7px 14px;margin:0}
.jpc-lead{font-size:var(--t-lead) !important;color:rgba(255,255,255,.82);max-width:56ch;margin-top:26px}
.jpc-hero .wp-block-buttons{margin-top:38px;gap:14px}
ul.jpc-ticks{display:flex;flex-wrap:wrap;gap:8px 28px;margin:34px 0 0;padding:26px 0 0;border-top:1px solid rgba(255,255,255,.18);list-style:none}
ul.jpc-ticks li{display:flex;align-items:center;gap:9px;color:rgba(255,255,255,.8);margin:0}
ul.jpc-ticks li::before{content:"✓";color:var(--amarillo-aviso);font-weight:700}

/* ===== Botones del sistema ===== */
.jpc-btn-sol .wp-block-button__link,.jpc-btn-noche .wp-block-button__link,.jpc-btn-linea .wp-block-button__link{border-radius:6px;font-weight:600;font-size:1rem;line-height:1.2;
  text-align:center;text-wrap:balance;padding:15px 26px;border:2px solid transparent;min-height:52px;display:inline-flex;align-items:center;justify-content:center;
  transition:transform .18s ease,background .18s ease}
.jpc-btn-sol .wp-block-button__link:hover,.jpc-btn-noche .wp-block-button__link:hover,.jpc-btn-linea .wp-block-button__link:hover{transform:translateY(-2px)}
.jpc-btn-sol .wp-block-button__link{background:var(--amarillo-aviso) !important;color:var(--tinta) !important}
.jpc-btn-sol .wp-block-button__link:hover{background:#FFD25E !important}
.jpc-btn-noche .wp-block-button__link{background:var(--noche) !important;color:#fff !important}
.jpc-btn-noche .wp-block-button__link:hover{background:var(--noche-superficie) !important}
.jpc-btn-linea .wp-block-button__link{background:transparent !important;color:#fff !important;border-color:rgba(255,255,255,.55)}
.jpc-btn-linea .wp-block-button__link:hover{background:rgba(255,255,255,.1) !important;border-color:#fff}
.jpc-btn-bloque,.jpc-btn-bloque .wp-block-button__link{width:100%}

/* ===== Marquesina: la calle de avisos ===== */
.jpc-marquesina{background:var(--amarillo-aviso);border-block:2px solid var(--tinta);overflow:hidden;padding:0}
.jpc-marquesina-pista{display:flex !important;flex-wrap:nowrap !important;width:max-content !important;max-width:none !important;gap:0 !important;animation:jpc-correr 34s linear infinite;margin:0 !important}
p.jpc-marq-grupo{font-family:'DM Mono',monospace;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;white-space:nowrap;color:var(--tinta);padding:13px 17px;margin:0 !important}
@keyframes jpc-correr{to{transform:translateX(-50%)}}
.jpc-marquesina:hover .jpc-marquesina-pista{animation-play-state:paused}

/* ===== Encabezados de sección ===== */
.jpc-encabezado{max-width:52ch}
.jpc-encabezado .jpc-mono{display:block;margin:0 0 14px;color:var(--teja)}
.jpc-noche .jpc-encabezado .jpc-mono{color:var(--amarillo-aviso)}
.jpc-encabezado>p:not(.jpc-mono){font-size:var(--t-lead);color:var(--humo);margin-top:16px}
.jpc-noche .jpc-encabezado>p:not(.jpc-mono){color:rgba(255,255,255,.78)}
.jpc-cierre{color:var(--tinta);font-weight:600;margin-top:22px}

/* ===== Reproductor de video (placeholder) ===== */
.jpc-reproductor{aspect-ratio:16/9;border-radius:10px;background:var(--noche-hondo);border:2px solid var(--tinta);display:grid;place-items:center;text-align:center;position:relative;overflow:hidden}
.jpc-reproductor::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 120% at 30% 0%,rgba(255,196,46,.18),transparent 55%);pointer-events:none}
.jpc-play{width:74px;height:74px;border-radius:50%;background:var(--amarillo-aviso);display:grid;place-items:center;margin:0 auto 16px !important;font-size:1.4rem;color:var(--tinta) !important;z-index:1}
.jpc-reproductor p{position:relative;z-index:1;color:rgba(255,255,255,.75)}
.jpc-reproductor .jpc-mono{font-size:.72rem !important;letter-spacing:.12em;padding-inline:20px}

/* ===== Tarjetas de comercio ===== */
.wp-block-column.jpc-comercio{background:var(--papel);border:2px solid var(--tinta);border-radius:10px;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease;padding:0 !important}
.wp-block-column.jpc-comercio:hover{transform:translateY(-4px);box-shadow:8px 8px 0 var(--noche)}
.jpc-comercio__foto{aspect-ratio:4/3;background:repeating-linear-gradient(135deg,#E4E6E9 0 12px,#DDE0E4 12px 24px);border-bottom:2px solid var(--tinta);display:grid;place-items:center;color:var(--humo);text-align:center;padding:20px;position:relative;margin:0 !important}
.jpc-estado{position:absolute;z-index:2;top:14px;left:14px;background:var(--noche);color:#fff !important;border-radius:100px;padding:7px 13px;margin:0 !important}
.jpc-estado::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--amarillo-aviso);margin-right:8px}
.jpc-comercio__cuerpo{padding:clamp(22px,2.2vw,30px)}
.jpc-comercio__cuerpo>*{margin-top:14px;margin-bottom:0}
.jpc-comercio__cuerpo>*:first-child{margin-top:0}
.jpc-meta{color:var(--teja) !important}
.jpc-quote{color:var(--humo)}
.jpc-enlace a{font-weight:600;border-bottom:2px solid var(--amarillo-aviso);padding-bottom:2px;text-decoration:none;color:var(--tinta)}
.jpc-enlace a:hover{border-color:var(--tinta)}

/* ===== Convocatoria (superficie #17233C, plano v1.2) ===== */
.jpc-convocatoria{background:var(--noche-superficie);color:#fff}
.jpc-convocatoria h2{color:#fff;max-width:19ch}
.jpc-convocatoria .jpc-parr{color:rgba(255,255,255,.8);font-size:var(--t-lead);max-width:56ch;margin-top:20px}
.jpc-caja{background:var(--amarillo-aviso);color:var(--tinta);border:2px solid var(--tinta);border-radius:10px;padding:clamp(24px,2.6vw,34px)}
.jpc-caja p{color:var(--tinta)}
.jpc-caja .jpc-mono{display:block;margin:0 0 12px}
.jpc-caja strong{font-family:'Bricolage Grotesque',sans-serif;font-weight:800}

/* ===== Sección noche: pasos + recibo ===== */
.jpc-noche{background:var(--noche);color:#fff}
.jpc-noche h2,.jpc-noche h3{color:#fff}
.jpc-pasos{margin-top:56px}
.jpc-paso{border-top:3px solid var(--amarillo-aviso);padding-top:22px}
.jpc-paso .jpc-mono{color:var(--amarillo-aviso);display:block;margin:0 0 14px}
.jpc-paso h3{margin-bottom:12px}
.jpc-paso p{color:rgba(255,255,255,.76)}

/* ===== El recibo (elemento firma) ===== */
.jpc-recibo-zona{border-top:1px solid rgba(255,255,255,.18);padding-top:clamp(40px,4vw,60px);margin-top:clamp(56px,6vw,86px)}
.jpc-recibo-zona h3{font-size:var(--t-h2);max-width:14ch;margin-bottom:18px}
.jpc-parr-noche{color:rgba(255,255,255,.78);max-width:44ch}
.jpc-recibo{background:var(--papel);color:var(--tinta);max-width:420px;padding:34px 30px 44px;font-family:'DM Mono',monospace;font-size:.87rem;line-height:1.9;
  -webkit-mask:linear-gradient(#000 0 0) top/100% calc(100% - 13px) no-repeat,radial-gradient(circle 7px at 50% 100%,#0000 98%,#000) bottom/22px 13px repeat-x;
  mask:linear-gradient(#000 0 0) top/100% calc(100% - 13px) no-repeat,radial-gradient(circle 7px at 50% 100%,#0000 98%,#000) bottom/22px 13px repeat-x}
.jpc-recibo p{color:var(--tinta)}
.jpc-recibo__cab{text-align:center;padding-bottom:18px;border-bottom:1px dashed rgba(20,27,36,.2);margin:0 !important}
.jpc-recibo__cab strong{display:block;font-family:'Bricolage Grotesque',sans-serif;font-size:1rem;letter-spacing:.02em;text-transform:uppercase}
.jpc-recibo__cab .jpc-chico{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--humo)}
.jpc-recibo-tabla{margin:16px 0 0 !important}
.jpc-recibo-tabla table{border-collapse:collapse;width:100%;border:none !important;font-size:.87rem}
.jpc-recibo-tabla td{border:none !important;padding:6px 0 0 !important}
.jpc-recibo-tabla td:last-child{text-align:right;white-space:nowrap}
.jpc-recibo-tabla tr:last-child td{border-top:1px dashed rgba(20,27,36,.2) !important;padding-top:16px !important;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:1.02rem}
.jpc-recibo__sello{margin-top:14px !important;text-align:center;color:var(--noche) !important;font-weight:500;letter-spacing:.08em;text-transform:uppercase;font-size:.72rem}
.jpc-recibo__pie{margin-top:18px !important;font-size:.74rem;line-height:1.65;color:var(--humo) !important;text-align:center}

/* ===== Cobertura ===== */
.jpc-cobertura{margin-top:48px;border-top:1px solid rgba(20,27,36,.14)}
.wp-block-group.jpc-ciudad{display:grid !important;grid-template-columns:auto 1fr auto auto;gap:clamp(14px,2vw,28px);align-items:center;padding:24px 4px;border-bottom:1px solid rgba(20,27,36,.14);transition:background .18s ease,padding-inline .18s ease;margin:0 !important}
.wp-block-group.jpc-ciudad:hover{background:var(--papel);padding-inline:16px}
.jpc-ciudad::before{content:"";width:11px;height:11px;border-radius:50%;background:#C9CEC6}
.jpc-ciudad--activa::before{background:var(--noche);box-shadow:0 0 0 5px rgba(13,21,38,.16)}
.jpc-ciudad p{margin:0 !important}
.jpc-ciudad__nombre{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:1.28rem}
.jpc-ciudad__nombre a{text-decoration:none;color:var(--tinta)}
.jpc-ciudad__depto{color:var(--humo) !important;font-size:.74rem !important;letter-spacing:.12em}
.jpc-ciudad__estado{color:var(--humo) !important;font-size:.76rem !important;letter-spacing:.1em;justify-self:end}
.jpc-ciudad--activa .jpc-ciudad__estado{color:var(--tinta) !important;background:var(--amarillo-aviso);padding:6px 12px;border-radius:100px}
@media(max-width:620px){.wp-block-group.jpc-ciudad{grid-template-columns:auto 1fr}.jpc-ciudad__estado{grid-column:2;justify-self:start}}

/* ===== Footer oscuro ===== */
.site-footer,.site-footer [data-section]{background:var(--noche-hondo) !important;color:rgba(255,255,255,.76)}
.site-footer a{color:rgba(255,255,255,.86)}
.site-footer .ast-footer-copyright p{font-size:.85rem}

/* ===== Navegación: ajuste fino al mockup ===== */
.main-header-menu{align-items:center;column-gap:30px}
.main-header-menu>.menu-item{margin:0}
.main-header-menu>.menu-item>.menu-link{padding:6px 0 !important;font-size:.95rem;font-weight:500;border-bottom:2px solid transparent;transition:color .18s ease,border-color .18s ease}
.main-header-menu>.menu-item>.menu-link:hover,
.main-header-menu>.current-menu-item>.menu-link,
.main-header-menu>.current_page_item>.menu-link{color:#fff !important;border-bottom-color:var(--amarillo-aviso);background:transparent !important}
.main-header-menu>.menu-item:last-child>.menu-link{background:var(--amarillo-aviso) !important;color:var(--tinta) !important;border-radius:6px;border-bottom:none;padding:13px 20px !important;font-weight:600;font-size:.93rem}
.main-header-menu>.menu-item:last-child>.menu-link:hover{background:#FFD25E !important;color:var(--tinta) !important}
.ast-primary-header-bar .site-header-focus-item{align-items:center}
.ast-primary-header-bar{min-height:78px}

/* Menú móvil (off-canvas) en azul noche */
.ast-mobile-popup-drawer .ast-mobile-popup-inner{background:var(--noche);color:#fff}
.ast-mobile-popup-drawer .menu-link{color:rgba(255,255,255,.86) !important;border-bottom:1px solid rgba(255,255,255,.18)}
.ast-mobile-popup-drawer .menu-link:hover{color:#fff !important}
.ast-mobile-popup-drawer .menu-item:last-child .menu-link{background:var(--amarillo-aviso) !important;color:var(--tinta) !important;border-radius:6px;margin-top:16px;font-weight:600}
.ast-mobile-popup-drawer .ast-mobile-popup-header .menu-toggle-close{color:#fff}

/* ===== Header: contenedor 1180px y botón dentro de la fila del menú ===== */
/* El contenido del header respeta el mismo ancho que las secciones (mockup: .wrap) */
.ast-primary-header-bar .ast-builder-grid-row{max-width:1180px;margin-inline:auto;padding-inline:clamp(20px,4vw,40px)}

/* Astra estira los items del menú al alto de la barra; se anula para que el
   botón amarillo sea un rótulo dentro del menú, no una columna vertical */
.ast-primary-header-bar .main-header-bar-navigation{height:auto}
.ast-primary-header-bar .main-header-menu>.menu-item{height:auto !important;display:flex;align-items:center}
.ast-primary-header-bar .main-header-menu>.menu-item>.menu-link{height:auto !important;display:inline-flex;align-items:center;line-height:1.2}
.main-header-menu>.menu-item:last-child>.menu-link{align-self:center}

/* ===== Header: logo pegado a la izquierda, menú pegado a la derecha =====
   Astra deja la fila con margin auto dentro de un contenedor flex, así que
   la barra se encogía al ancho de su contenido y quedaba centrada.
   width:100% la hace ocupar el contenedor; la 2ª columna (1fr) empuja el
   menú al extremo derecho. */
.ast-primary-header-bar .ast-builder-grid-row{
  width:100%;
  max-width:1180px;
  grid-template-columns:auto 1fr;
  margin-inline:auto;
  padding-inline:clamp(20px,4vw,40px);
}
.ast-primary-header-bar .site-header-section-left{justify-content:flex-start}
.ast-primary-header-bar .ast-grid-right-section{justify-content:flex-end}

/* ===== Marquesina: franja delgada =====
   El bloque de grupo alignfull recibe 48px de padding vertical del tema;
   se anula para que la altura la fije solo el texto. */
.wp-block-group.jpc-marquesina{padding:0 !important}
p.jpc-marq-grupo{padding:9px 17px;line-height:1.3}

/* ============================================================
   RITMO VERTICAL — corrige el padding de 48px que el tema
   impone a los grupos alignfull y restituye --seccion
   ============================================================ */
.wp-block-group.jpc-hero,
.wp-block-group.jpc-hero-dir,
.wp-block-group.jpc-seccion,
.wp-block-group.jpc-convocatoria,
.wp-block-group.jpc-papel,
.wp-block-group.jpc-noche{padding-inline:0 !important}
.wp-block-group.jpc-seccion,
.wp-block-group.jpc-convocatoria,
.wp-block-group.jpc-papel{padding-block:var(--seccion) !important}
.wp-block-group.jpc-hero,
.wp-block-group.jpc-hero-dir{padding-block:0 !important}

/* ============================================================
   /negocios/ — Directorio. Guía v1.1 del hub.
   Escala de la página (ligeramente menor que la home)
   ============================================================ */
.jpc-hero-dir{--t-h1:clamp(2.1rem,4.6vw,3.5rem);background:var(--noche);color:#fff}
.jpc-hero-dir h1{color:#fff;font-size:var(--t-h1);max-width:19ch;letter-spacing:-.03em}
.jpc-hero-dir .jpc-wrap{padding-bottom:clamp(44px,5vw,72px)}
.jpc-papel{background:var(--papel);border-block:1px solid rgba(20,27,36,.14)}

/* Migas de pan */
p.jpc-migas{font-family:'DM Mono',monospace;font-size:.74rem;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(255,255,255,.55);padding-top:26px;margin:0}
p.jpc-migas a{color:rgba(255,255,255,.55);text-decoration:none;border-bottom:1px solid transparent}
p.jpc-migas a:hover{color:#fff;border-color:var(--amarillo-aviso)}
p.jpc-migas strong{color:var(--amarillo-aviso);font-weight:500}

/* Entradillas del hero */
.jpc-hero-dir .jpc-lead{margin-top:24px;max-width:62ch;font-size:var(--t-lead);color:rgba(255,255,255,.82)}
.jpc-hero-dir .jpc-lead2{margin-top:14px;max-width:62ch;font-size:1rem;color:rgba(255,255,255,.66)}
.jpc-hero-dir .wp-block-buttons{margin-top:34px;gap:14px}

/* Ficha de estado: 4 datos duros */
.wp-block-columns.jpc-ficha{margin-top:44px;border:1px solid rgba(255,255,255,.18);
  border-radius:10px;overflow:hidden;gap:0}
.jpc-ficha .wp-block-column{padding:20px 22px;border-right:1px solid rgba(255,255,255,.18);flex-basis:0}
.jpc-ficha .wp-block-column:last-child{border-right:0}
.jpc-ficha p{margin:0 !important}
.jpc-ficha .jpc-mono{color:rgba(255,255,255,.55) !important;font-size:.7rem !important;margin-bottom:8px !important}
.jpc-ficha-dato{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:1.28rem;line-height:1.2}
.jpc-ficha-sub{font-size:.86rem;color:rgba(255,255,255,.6);font-weight:500}
@media(max-width:781px){
  .jpc-ficha .wp-block-column{border-right:0;border-bottom:1px solid rgba(255,255,255,.18)}
  .jpc-ficha .wp-block-column:last-child{border-bottom:0}
}

/* ============================================================
   Barra de filtros (franja amarilla, tamaño constante)
   ============================================================ */
.wp-block-group.jpc-filtros{background:var(--amarillo-aviso);color:var(--tinta);
  border-block:2px solid var(--tinta);padding:0 !important}
.jpc-filtros form{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding-block:18px;
  width:100%;max-width:1180px;margin-inline:auto;padding-inline:clamp(20px,4vw,40px)}
.jpc-filtros__t{font-family:'DM Mono',monospace;font-size:.74rem;letter-spacing:.14em;
  text-transform:uppercase;font-weight:500;opacity:.75;flex:none}
.jpc-campo{position:relative;flex:1 1 210px;min-width:170px}
.jpc-campo input,.jpc-campo select{width:100%;font-family:'Instrument Sans',sans-serif;
  font-size:.95rem;line-height:1;padding:14px 15px;border:2px solid var(--tinta);border-radius:6px;
  background:var(--papel);color:var(--tinta);appearance:none;-webkit-appearance:none}
.jpc-campo select{padding-right:38px;cursor:pointer}
.jpc-campo--select::after{content:"▾";position:absolute;right:14px;top:50%;transform:translateY(-50%);
  pointer-events:none;font-size:.9rem}
.jpc-campo input::placeholder{color:var(--humo)}
.jpc-filtros button{font-family:'Instrument Sans',sans-serif;font-weight:600;font-size:1rem;
  padding:14px 24px;border:2px solid var(--noche);border-radius:6px;background:var(--noche);
  color:#fff;cursor:pointer;flex:none;transition:transform .18s ease,background .18s ease}
.jpc-filtros button:hover{transform:translateY(-2px);background:var(--noche-superficie)}
.jpc-oculto{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}
@media(max-width:620px){.jpc-filtros button{width:100%}}

/* ============================================================
   Fichas de ciudad
   ============================================================ */
.wp-block-columns.jpc-ciudades{margin-top:48px;gap:clamp(18px,2vw,26px)}
.wp-block-column.jpc-cficha{background:var(--papel);border:2px solid rgba(20,27,36,.14);
  border-radius:10px;padding:26px 24px 24px !important;display:flex;flex-direction:column;gap:12px;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.wp-block-column.jpc-cficha:hover{transform:translateY(-4px);border-color:var(--tinta);
  box-shadow:8px 8px 0 var(--noche)}
.wp-block-column.jpc-cficha--activa{border-color:var(--tinta);border-top:6px solid var(--amarillo-aviso)}
.jpc-cficha p{margin:0 !important}
.jpc-cficha h3{font-size:var(--t-h3);margin:0}
.jpc-cestado{font-family:'DM Mono',monospace;font-size:.72rem !important;letter-spacing:.13em;
  text-transform:uppercase;color:var(--humo) !important;display:flex;align-items:center;gap:9px}
.jpc-cestado::before{content:"";width:9px;height:9px;border-radius:50%;background:#C4C9CF;flex:none}
.jpc-cficha--activa .jpc-cestado{color:var(--tinta) !important}
.jpc-cficha--activa .jpc-cestado::before{background:var(--noche);box-shadow:0 0 0 4px rgba(13,21,38,.16)}
.jpc-cdepto{color:var(--humo) !important;font-size:.72rem !important;letter-spacing:.12em;margin-top:-6px !important}
.jpc-ctexto{color:var(--humo);font-size:.97rem;flex:1}

/* ============================================================
   Listado de negocios (ficha compacta)
   ============================================================ */
.jpc-listado-barra{display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;
  align-items:baseline;margin-top:40px;padding-bottom:14px;border-bottom:1px solid rgba(20,27,36,.14)}
.jpc-listado-barra p{margin:0 !important;color:var(--humo) !important}
.wp-block-columns.jpc-negocios{margin-top:28px;gap:clamp(18px,2vw,26px);flex-wrap:wrap}
.wp-block-column.jpc-negocio{background:var(--papel);border:2px solid var(--tinta);border-radius:10px;
  overflow:hidden;display:flex;flex-direction:column;padding:0 !important;
  transition:transform .2s ease,box-shadow .2s ease}
.wp-block-column.jpc-negocio:hover{transform:translateY(-4px);box-shadow:8px 8px 0 var(--noche)}
.jpc-negocio__foto{aspect-ratio:16/10;background:repeating-linear-gradient(135deg,#E4E6E9 0 12px,#DDE0E4 12px 24px);
  border-bottom:2px solid var(--tinta);display:grid;place-items:center;text-align:center;
  padding:16px;color:var(--humo);margin:0 !important}
p.jpc-negocio__aviso{background:var(--amarillo-aviso);color:var(--tinta);
  border-bottom:2px solid var(--tinta);padding:10px 18px;margin:0 !important;
  font-family:'DM Mono',monospace;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;
  font-weight:500;line-height:1.5}
.jpc-negocio__texto{padding:18px 18px 0 !important;display:flex;flex-direction:column;gap:9px;flex:1}
.jpc-negocio__texto h3{font-size:1.06rem;line-height:1.2;margin:0}
.jpc-negocio__texto p{margin:0 !important}
.jpc-negocio__cita{color:var(--humo);font-size:.93rem;line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.jpc-negocio__dato{font-family:'DM Mono',monospace;font-size:.68rem !important;letter-spacing:.1em;
  text-transform:uppercase;color:var(--humo) !important;margin-top:auto !important;padding-top:6px}
.jpc-negocio__acciones{padding:16px 18px 18px !important;display:flex;flex-direction:column;gap:10px}
.jpc-negocio__acciones .wp-block-button__link{padding:13px 16px;font-size:.92rem}
.jpc-negocio__acciones p{margin:0 !important;font-size:.93rem}

/* Enlaces de silo al pie del listado */
.jpc-silo{margin-top:46px !important;padding-top:26px;border-top:1px solid rgba(20,27,36,.14);
  display:flex;flex-wrap:wrap;gap:12px 26px;align-items:center}
.jpc-silo p{margin:0 !important}
.jpc-silo .jpc-mono{color:var(--humo) !important}

/* ============================================================
   Categorías (sobre fondo noche)
   ============================================================ */
.wp-block-columns.jpc-categorias{margin-top:48px;gap:clamp(18px,2vw,26px)}
.wp-block-column.jpc-categoria{background:var(--noche-superficie);border-radius:10px;
  padding:28px 26px !important;display:flex;flex-direction:column;gap:10px;
  border:1px solid rgba(255,255,255,.18);transition:transform .2s ease,border-color .2s ease}
.wp-block-column.jpc-categoria:hover{transform:translateY(-4px);border-color:var(--amarillo-aviso)}
.jpc-categoria p{margin:0 !important}
.jpc-categoria h3{font-size:var(--t-h3);margin:0;color:#fff}
.jpc-categoria .jpc-mono{color:var(--amarillo-aviso) !important;font-size:.72rem !important}
.jpc-categoria__d{color:rgba(255,255,255,.72) !important;font-size:.97rem;flex:1}
.jpc-categoria__ir a{color:#fff;font-weight:600;text-decoration:none;
  border-bottom:2px solid var(--amarillo-aviso);padding-bottom:2px}

/* ============================================================
   Preguntas frecuentes (bloque details nativo)
   ============================================================ */
.jpc-faq{margin-top:44px;max-width:74ch}
.jpc-faq .wp-block-details{border-top:1px solid rgba(20,27,36,.14);padding:0}
.jpc-faq .wp-block-details:last-of-type{border-bottom:1px solid rgba(20,27,36,.14)}
.jpc-faq summary{list-style:none;cursor:pointer;padding:22px 46px 22px 0;position:relative;
  font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:1.12rem;line-height:1.35}
.jpc-faq summary::-webkit-details-marker{display:none}
.jpc-faq summary::after{content:"+";position:absolute;right:8px;top:50%;transform:translateY(-50%);
  font-family:'DM Mono',monospace;font-size:1.3rem;color:var(--teja)}
.jpc-faq details[open] summary::after{content:"−"}
.jpc-faq summary:hover{color:var(--teja)}
.jpc-faq .wp-block-details p{padding:0 46px 24px 0;color:var(--humo);max-width:66ch;margin:0}
.jpc-sep{margin-top:clamp(56px,6vw,86px) !important}
.jpc-salida{margin-top:28px !important}

/* ============================================================
   Rejillas que no cambian de forma al crecer el catálogo
   (guía 5 bis). El bloque de columnas reparte el ancho entre
   los elementos existentes; aquí se convierte en rejilla de
   ancho mínimo fijo, de modo que 2 fichas se ven igual que 20.
   ============================================================ */
.wp-block-columns.jpc-negocios,
.wp-block-columns.jpc-ciudades,
.wp-block-columns.jpc-categorias,
.wp-block-columns.jpc-ficha{display:grid !important}
.wp-block-columns.jpc-negocios{grid-template-columns:repeat(auto-fill,minmax(268px,1fr));align-items:stretch}
.wp-block-columns.jpc-ciudades{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.wp-block-columns.jpc-categorias{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.wp-block-columns.jpc-ficha{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.wp-block-columns.jpc-negocios>.wp-block-column,
.wp-block-columns.jpc-ciudades>.wp-block-column,
.wp-block-columns.jpc-categorias>.wp-block-column,
.wp-block-columns.jpc-ficha>.wp-block-column{flex-basis:auto !important;margin:0 !important}

/* ============================================================
   Barra de filtros: el tema fija height:40px en los campos y el
   texto (relleno 28px + línea 15px) se recortaba. Altura libre,
   misma medida en los tres controles y línea con aire suficiente.
   ============================================================ */
.jpc-filtros .jpc-campo input,
.jpc-filtros .jpc-campo select,
.jpc-filtros button{
  height:auto !important;
  min-height:50px;
  line-height:1.4 !important;
  font-size:.95rem;
  margin:0 !important;
}
.jpc-filtros .jpc-campo input,
.jpc-filtros .jpc-campo select{padding:12px 15px !important}
.jpc-filtros .jpc-campo select{padding-right:40px !important;text-overflow:ellipsis}
.jpc-filtros button{padding:12px 26px !important}
.jpc-filtros .jpc-campo input:focus,
.jpc-filtros .jpc-campo select:focus{outline:3px solid var(--noche);outline-offset:1px}
.jpc-campo--select::after{font-size:.8rem;opacity:.7}

/* ============================================================
   Enlaces: sin subrayado permanente.
   El subrayado amarillo aparece solo al pasar por encima o al
   recibir el foco con el teclado (también en :focus-visible para
   que quien navega sin ratón tenga la misma señal).
   ============================================================ */
.ast-single-post .entry-content a,
.entry-content a,
.site-footer a,
.jpc-enlace a,
.jpc-categoria__ir a{text-decoration:none !important}

.entry-content a:not(.wp-block-button__link):not(.jpc-btn):not(.wp-element-button),
.jpc-enlace a,
.jpc-categoria__ir a,
p.jpc-migas a,
.site-footer a:not(.jpc-pie-contacto__btn):not(.jpc-pie-contacto__correo){
  border-bottom:2px solid transparent;
  padding-bottom:1px;
  transition:border-color .18s ease,color .18s ease;
}
.entry-content a:not(.wp-block-button__link):not(.jpc-btn):not(.wp-element-button):hover,
.entry-content a:not(.wp-block-button__link):not(.jpc-btn):not(.wp-element-button):focus-visible,
.jpc-enlace a:hover,.jpc-enlace a:focus-visible,
.jpc-categoria__ir a:hover,.jpc-categoria__ir a:focus-visible,
p.jpc-migas a:hover,p.jpc-migas a:focus-visible,
.site-footer a:not(.jpc-pie-contacto__btn):not(.jpc-pie-contacto__correo):hover,.site-footer a:focus-visible{
  border-bottom-color:var(--amarillo-aviso);
}

/* ============================================================
   MÓVIL — puntos de quiebre de las guías (maestra §5 y negocios)
   > 960px  layout completo
   ≤ 960px  hamburguesa; video, convocatoria y recibo a una columna
   ≤ 620px  botones a ancho completo, filas de ciudad a dos líneas
   ============================================================ */
@media (max-width:960px){
  /* El bloque de columnas apila solo a 781px; la guía lo pide a 960 */
  .jpc-convocatoria .wp-block-columns,
  .jpc-recibo-zona .wp-block-columns,
  .wp-block-columns:has(.jpc-reproductor){flex-wrap:wrap !important}
  .jpc-convocatoria .wp-block-columns>.wp-block-column,
  .jpc-recibo-zona .wp-block-columns>.wp-block-column,
  .wp-block-columns:has(.jpc-reproductor)>.wp-block-column{flex-basis:100% !important}
  .jpc-recibo{margin-inline:auto}
  .jpc-recibo-zona h3{max-width:none}
}

/* Menú móvil: enlaces con separador y el CTA como rótulo amarillo */
.ast-mobile-header-content .main-header-menu>.menu-item>.menu-link{
  padding:14px 0 !important;border-bottom:1px solid rgba(255,255,255,.18)}
.ast-mobile-header-content .main-header-menu>.menu-item:last-child>.menu-link{
  margin-top:16px;border-bottom:0;text-align:center;justify-content:center;
  padding:14px 20px !important}

/* Ficha de estado: rejilla y separadores que respetan el salto de línea */
@media (max-width:781px){
  .wp-block-columns.jpc-ficha{grid-template-columns:repeat(2,1fr) !important}
  .jpc-ficha .wp-block-column{
    border-right:1px solid rgba(255,255,255,.18);
    border-bottom:1px solid rgba(255,255,255,.18)}
  .jpc-ficha .wp-block-column:nth-child(2n){border-right:0}
  .jpc-ficha .wp-block-column:nth-last-child(-n+2){border-bottom:0}
}
@media (max-width:430px){
  .wp-block-columns.jpc-ficha{grid-template-columns:1fr !important}
  .jpc-ficha .wp-block-column{border-right:0}
  .jpc-ficha .wp-block-column:last-child{border-bottom:0}
}

@media (max-width:620px){
  /* Botones a ancho completo: en móvil el pulgar necesita blanco de destino */
  .jpc-hero .wp-block-buttons,
  .jpc-hero-dir .wp-block-buttons{flex-direction:column;align-items:stretch}
  .jpc-hero .wp-block-button,
  .jpc-hero-dir .wp-block-button,
  .jpc-caja .wp-block-button{width:100%}
  .jpc-hero .wp-block-button__link,
  .jpc-hero-dir .wp-block-button__link,
  .jpc-caja .wp-block-button__link,
  .jpc-negocio__acciones .wp-block-button__link{width:100%;text-align:center}
  /* Barra del listado: contador y orden en dos líneas legibles */
  .jpc-listado-barra{gap:6px}
  .jpc-listado-barra p{width:100%}
  /* La franja de filtros no aprieta los campos contra el borde */
  .jpc-filtros form{gap:10px}
  .jpc-campo{flex:1 1 100%}
}

/* ============================================================
   /registro/ — autorización de datos y estado del botón
   ============================================================ */
.jpc-autorizacion .ff-el-form-check{align-items:flex-start;gap:10px;margin-bottom:10px}
.jpc-autorizacion .ff-el-form-check-input{width:22px;height:22px;margin-top:2px;flex:none;accent-color:var(--noche)}
.jpc-autorizacion .ff-el-form-check-label{line-height:1.5}
.jpc-autorizacion a{border-bottom:2px solid var(--amarillo-aviso);text-decoration:none}

/* Aviso cuando se elige "No autorizo": explica, no regaña */
.jpc-aviso-datos{
  margin-top:12px;padding:14px 16px;
  background:var(--papel);border-left:4px solid var(--teja);border-radius:6px;
  color:var(--tinta);font-size:.95rem;line-height:1.55;
}
.jpc-aviso-datos a{color:var(--teja);border-bottom:2px solid var(--teja);text-decoration:none}

/* El botón de envío usa la misma caja que el resto del sitio; Fluent Forms
   lo traía con 18px de fuente y 8px de padding y desentonaba. */
.ff-btn-submit{
  font-family:'Instrument Sans',sans-serif !important;font-weight:600 !important;
  font-size:1rem !important;line-height:1.2 !important;text-align:center;
  padding:15px 26px !important;border:2px solid transparent !important;border-radius:6px !important;
  transition:transform .18s ease,background .18s ease;
}
.ff-btn-submit:not(:disabled):not(.jpc-btn-inactivo):hover{transform:translateY(-2px)}

/* Botón inactivo: se ve claramente inactivo, y la nota dice por qué */
.ff-btn-submit.jpc-btn-inactivo,
.ff-btn-submit:disabled{
  opacity:.45;cursor:not-allowed;filter:grayscale(.4);
}
.jpc-nota-boton{
  margin-top:10px;font-family:'DM Mono',monospace;font-size:.74rem;
  letter-spacing:.08em;text-transform:uppercase;color:var(--humo);
}

/* Desplegable múltiple de medios de pago (Choices.js).
   Se iguala a los demás campos del formulario, que todavía usan el estilo
   por defecto de Fluent Forms; tematizar solo este campo lo dejaría
   descuadrado. Cuando se implemente el diseño de /registro/ (guía §6),
   todos los campos pasan a borde de tinta 2px a la vez.
   Lo único de marca aquí son las etiquetas elegidas: azul noche. */
#fluentform_3 .choices__inner{min-height:40px;border-radius:7px;border-color:#dadbdd;padding:5px 8px 1px}
#fluentform_3 .choices__list--multiple .choices__item{
  background:var(--noche);border:0;border-radius:4px;padding:4px 9px;font-size:.88rem;color:#fff}
#fluentform_3 .choices__list--multiple .choices__item .choices__button{
  border-left:1px solid rgba(255,255,255,.35);margin:0 -2px 0 8px;opacity:.9}
#fluentform_3 .choices__list--dropdown .choices__item--selectable.is-highlighted{background:var(--noche);color:#fff}
#fluentform_3 .choices.is-focused .choices__inner{border-color:var(--noche);box-shadow:0 0 0 3px rgba(255,196,46,.4)}

/* ============================================================
   FICHA DE COMERCIO /tienda/{slug}/ — plantilla única
   GUIA-DE-DISENO-tienda.md v1
   ============================================================ */
.jpc-tienda{background:var(--noche);color:#fff}
.jpc-tienda h1{color:#fff;font-size:clamp(2rem,4.2vw,3.2rem);max-width:20ch;letter-spacing:-.03em}

/* Migas */
.jpc-migas-t{padding-top:26px}
.jpc-migas-t ol{display:flex;flex-wrap:wrap;align-items:center;gap:10px;list-style:none;margin:0;padding:0;
  font-family:'DM Mono',monospace;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(255,255,255,.55)}
.jpc-migas-t a{color:rgba(255,255,255,.55);text-decoration:none;border-bottom:2px solid transparent}
.jpc-migas-t a:hover{color:#fff;border-bottom-color:var(--amarillo-aviso)}
.jpc-migas-t [aria-current]{color:var(--amarillo-aviso)}
.jpc-migas-t li+li::before{content:"/";margin-right:10px;color:rgba(255,255,255,.35)}

/* Cabecera */
.jpc-tienda__in{padding-top:clamp(26px,3vw,38px);padding-bottom:clamp(40px,4.5vw,64px);
  display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);
  gap:clamp(28px,4vw,60px);align-items:start}
.jpc-tienda__marca{display:flex;align-items:center;gap:18px;margin-bottom:22px}

/* Caja de logo fija: contain para no mutilar la identidad de ningún negocio */
.jpc-avatar{width:88px;height:88px;flex:none;border-radius:10px;
  border:2px solid var(--amarillo-aviso);background:var(--papel);
  display:grid;place-items:center;overflow:hidden;padding:7px}
.jpc-avatar img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}
.jpc-avatar--inicial{background:var(--noche-superficie);padding:0;
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:2.1rem;color:var(--amarillo-aviso)}

.jpc-tienda__estado{display:inline-flex;align-items:center;gap:9px;
  border:1px solid rgba(255,196,46,.45);border-radius:100px;padding:7px 14px;color:var(--amarillo-aviso)}
.jpc-tienda__estado i{width:7px;height:7px;border-radius:50%;background:var(--amarillo-aviso)}
.jpc-tienda__cat{display:block;color:rgba(255,255,255,.6);margin-top:10px}
.jpc-tienda__cita{margin:22px 0 0;max-width:58ch;font-size:var(--t-lead);
  color:rgba(255,255,255,.84);border-left:3px solid var(--amarillo-aviso);padding-left:18px}
.jpc-tienda__cita cite{display:block;margin-top:10px;font-style:normal;font-family:'DM Mono',monospace;
  font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.jpc-tienda__ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}

/* Botones de la plantilla (no son bloques Gutenberg) */
.jpc-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:'Instrument Sans',sans-serif;font-weight:600;font-size:1rem;line-height:1.2;
  text-align:center;text-wrap:balance;
  padding:15px 26px;border-radius:6px;border:2px solid transparent;cursor:pointer;text-decoration:none;
  transition:transform .18s ease,background .18s ease,border-color .18s ease}
.jpc-btn:hover{transform:translateY(-2px)}
.jpc-btn--sol{background:var(--amarillo-aviso);color:var(--tinta);border-color:var(--amarillo-aviso)}
.jpc-btn--sol:hover{background:#FFD25E;border-color:#FFD25E;color:var(--tinta)}
.jpc-btn--noche{background:var(--noche);color:#fff;border-color:var(--noche)}
.jpc-btn--noche:hover{background:var(--noche-superficie);border-color:var(--noche-superficie);color:#fff}
.jpc-btn--linea{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.jpc-btn--linea:hover{background:rgba(255,255,255,.1);border-color:#fff;color:#fff}
.jpc-btn--bloque{width:100%}
.jpc-btn--chico{padding:13px 18px;font-size:.93rem;min-height:52px !important}

/* Ficha de datos */
.jpc-ficha-t{border:1px solid rgba(255,255,255,.18);border-radius:10px;overflow:hidden}
.jpc-ficha-t__t{background:rgba(255,255,255,.06);padding:14px 20px;margin:0;
  border-bottom:1px solid rgba(255,255,255,.18);color:rgba(255,255,255,.6)}
.jpc-ficha-t dl{margin:0}
.jpc-ficha-t div{padding:16px 20px;border-bottom:1px solid rgba(255,255,255,.18)}
.jpc-ficha-t div:last-child{border-bottom:0}
.jpc-ficha-t dt{font-family:'DM Mono',monospace;font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:6px}
.jpc-ficha-t dd{margin:0;font-weight:500;font-size:.98rem;color:#fff}
.jpc-ficha-t dd a{color:#fff;text-decoration:none;border-bottom:2px solid var(--amarillo-aviso)}

/* Franja de transparencia */
.jpc-franja{background:var(--amarillo-aviso);color:var(--tinta);border-block:2px solid var(--tinta)}
.jpc-franja__in{display:flex;flex-wrap:wrap;gap:10px 34px;padding-block:15px;align-items:center;
  list-style:none;margin:0}
.jpc-franja li{display:flex;align-items:center;gap:9px;font-family:'DM Mono',monospace;font-size:.74rem;
  letter-spacing:.12em;text-transform:uppercase;font-weight:500;margin:0}

/* Catálogo */
.jpc-catalogo__barra{display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;
  align-items:baseline;margin-top:36px;padding-bottom:14px;border-bottom:1px solid rgba(20,27,36,.14)}
.jpc-catalogo__barra p{margin:0;color:var(--humo)}
.jpc-productos{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
  gap:clamp(18px,2vw,26px);margin-top:28px}
.jpc-producto{background:var(--papel);border:2px solid var(--tinta);border-radius:10px;
  overflow:hidden;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease}
.jpc-producto:hover{transform:translateY(-4px);box-shadow:8px 8px 0 var(--noche)}
.jpc-producto__foto{aspect-ratio:1/1;background:repeating-linear-gradient(135deg,#E4E6E9 0 12px,#DDE0E4 12px 24px);
  border-bottom:2px solid var(--tinta);display:grid;place-items:center;text-align:center;padding:16px;color:var(--humo)}
.jpc-producto__cuerpo{padding:18px;display:flex;flex-direction:column;gap:8px;flex:1}
.jpc-producto__cat{font-family:'DM Mono',monospace;font-size:.66rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--teja)}
.jpc-producto h3{font-size:1.04rem;line-height:1.25;margin:0}
.jpc-producto h3 a{text-decoration:none;color:var(--tinta);border-bottom:2px solid transparent}
.jpc-producto h3 a:hover{border-bottom-color:var(--amarillo-aviso)}
.jpc-producto__precio{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:1.22rem;
  margin:auto 0 0;padding-top:8px;color:var(--tinta)}
.jpc-producto__precio small{display:block;font-family:'DM Mono',monospace;font-size:.66rem;font-weight:400;
  letter-spacing:.1em;text-transform:uppercase;color:var(--humo);margin-top:3px}
.jpc-producto__precio .woocommerce-Price-amount{font-family:inherit}
.jpc-producto__acciones{padding:0 18px 18px}

/* Paginación rastreable */
.jpc-paginacion{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:36px;
  padding-top:24px;border-top:1px solid rgba(20,27,36,.14);font-family:'DM Mono',monospace;font-size:.85rem}
.jpc-paginacion a,.jpc-paginacion span{min-width:44px;height:44px;display:grid;place-items:center;
  padding-inline:14px;border:1px solid rgba(20,27,36,.14);border-radius:6px;text-decoration:none;color:var(--tinta)}
.jpc-paginacion .current{background:var(--noche);color:#fff;border-color:var(--noche)}
.jpc-paginacion a:hover{border-color:var(--tinta)}

/* Catálogo vacío */
.jpc-vacio{border:2px dashed rgba(20,27,36,.2);border-radius:10px;padding:clamp(30px,4vw,52px);
  text-align:center;background:var(--papel);margin-top:28px}
.jpc-vacio h3{font-size:var(--t-h3);margin:0 0 10px}
.jpc-vacio p{color:var(--humo);max-width:52ch;margin:0 auto 22px}

/* Pasos y condiciones */
.jpc-pasos-t{display:grid;grid-template-columns:1fr;gap:clamp(24px,3vw,44px);margin-top:44px}
@media(min-width:800px){.jpc-pasos-t{grid-template-columns:repeat(3,1fr)}}
.jpc-pasos-t .jpc-paso .jpc-mono{color:var(--amarillo-aviso);display:block;margin:0 0 14px}
.jpc-pasos-t .jpc-paso h3{margin:0 0 12px;color:#fff}
.jpc-pasos-t .jpc-paso p{color:rgba(255,255,255,.76);margin:0}
.jpc-condiciones{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  margin-top:clamp(44px,5vw,64px);border:1px solid rgba(255,255,255,.18);border-radius:10px;overflow:hidden}
.jpc-condiciones div{padding:22px;border-right:1px solid rgba(255,255,255,.18)}
.jpc-condiciones div:last-child{border-right:0}
.jpc-condiciones dt{font-family:'DM Mono',monospace;font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--amarillo-aviso);margin-bottom:8px}
.jpc-condiciones dd{margin:0;color:rgba(255,255,255,.82);font-size:.97rem}

/* Otros comercios */
.jpc-vecinos{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));
  gap:clamp(18px,2vw,26px);margin-top:40px}
.jpc-vecino{background:var(--papel);border:2px solid var(--tinta);border-radius:10px;padding:24px;
  display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--tinta);
  transition:transform .2s ease,box-shadow .2s ease}
.jpc-vecino:hover{transform:translateY(-4px);box-shadow:8px 8px 0 var(--noche);color:var(--tinta)}
.jpc-vecino .jpc-mono{color:var(--teja)}
.jpc-vecino h3{font-size:var(--t-h3);margin:0}
.jpc-vecino p{color:var(--humo);font-size:.95rem;flex:1;margin:0}
.jpc-vecino__ir{font-weight:600;border-bottom:2px solid var(--amarillo-aviso);align-self:flex-start;padding-bottom:2px}
.jpc-salida{margin-top:34px}

/* Responsive de la ficha */
@media(max-width:960px){
  .jpc-tienda__in{grid-template-columns:1fr}
  .jpc-condiciones div{border-right:0;border-bottom:1px solid rgba(255,255,255,.18)}
  .jpc-condiciones div:last-child{border-bottom:0}
}
@media(max-width:620px){
  .jpc-tienda__ctas{flex-direction:column;align-items:stretch}
  .jpc-tienda__ctas .jpc-btn{width:100%}
  .jpc-ficha-t div{padding:14px 18px}
}

/* La ficha trae sus propias secciones a sangre. El contenedor de Astra es un
   flex en fila con ancho máximo: sin esto, cada sección se convierte en una
   columna y la página se lee en horizontal. */
body.tax-tienda #content .ast-container{
  display:block !important;max-width:none !important;padding:0 !important;margin:0 !important}
body.tax-tienda #content{padding:0}

/* ============================================================
   PÁGINA DE MUNICIPIO /negocios/{municipio}/ — plantilla única
   GUIA-DE-DISENO-municipio.md v1.1
   Reutiliza los componentes de la ficha de comercio (migas, ficha en
   cifras, botones, filtros, paginación). Aquí solo lo específico.
   ============================================================ */
body.page-template-page-municipio #content .ast-container{
  display:block !important;max-width:none !important;padding:0 !important;margin:0 !important}
body.jpc-municipio-tpl #content .ast-container{
  display:block !important;max-width:none !important;padding:0 !important;margin:0 !important}

.jpc-municipio{background:var(--noche);color:#fff}
.jpc-municipio h1{color:#fff;font-size:clamp(2rem,4.2vw,3.2rem);max-width:16ch;letter-spacing:-.03em}
.jpc-municipio__in{padding-top:clamp(26px,3vw,40px);padding-bottom:clamp(42px,5vw,68px);
  display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);
  gap:clamp(28px,4vw,60px);align-items:start}
.jpc-depto{color:var(--amarillo-aviso) !important;display:block;margin-bottom:18px}
.jpc-municipio__lead{margin:22px 0 0;max-width:60ch;font-size:var(--t-lead);color:rgba(255,255,255,.82)}
.jpc-municipio__lead--2{margin-top:14px;font-size:1rem;color:rgba(255,255,255,.66)}
.jpc-municipio__ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}

/* Aviso al editor: solo lo ve quien puede escribir el párrafo que falta */
.jpc-aviso-editor{margin:22px 0 0;max-width:60ch;padding:14px 16px;border-radius:6px;
  background:rgba(194,84,45,.18);border-left:4px solid var(--teja);color:#fff;font-size:.95rem}

/* Fichas de negocio del listado (versión de plantilla, no de bloques) */
.jpc-negocios-t{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));
  gap:clamp(18px,2vw,26px);margin-top:28px}
.jpc-negocio-t{background:var(--papel);border:2px solid var(--tinta);border-radius:10px;
  overflow:hidden;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease}
.jpc-negocio-t:hover{transform:translateY(-4px);box-shadow:8px 8px 0 var(--noche)}
.jpc-negocio-t__foto{aspect-ratio:16/10;background:repeating-linear-gradient(135deg,#E4E6E9 0 12px,#DDE0E4 12px 24px);
  border-bottom:2px solid var(--tinta);display:grid;place-items:center;text-align:center;padding:16px;color:var(--humo)}
.jpc-negocio-t__aviso{background:var(--amarillo-aviso);color:var(--tinta);border-bottom:2px solid var(--tinta);
  padding:10px 18px;margin:0;display:flex;flex-wrap:wrap;gap:5px 12px;align-items:center;
  font-family:'DM Mono',monospace;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;font-weight:500}
.jpc-negocio-t__aviso i{width:4px;height:4px;border-radius:50%;background:var(--tinta);flex:none}
.jpc-negocio-t__texto{padding:18px 18px 0;display:flex;flex-direction:column;gap:9px;flex:1}
.jpc-negocio-t__texto h3{font-size:1.06rem;line-height:1.2;margin:0}
.jpc-negocio-t__texto p{color:var(--humo);font-size:.93rem;line-height:1.5;margin:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.jpc-negocio-t__dato{font-family:'DM Mono',monospace;font-size:.68rem !important;letter-spacing:.1em;
  text-transform:uppercase;color:var(--humo) !important;margin-top:auto !important;padding-top:6px;
  display:block !important;-webkit-line-clamp:none !important;overflow:visible !important}
.jpc-negocio-t__acciones{display:flex;flex-direction:column;gap:10px;padding:16px 18px 18px}
.jpc-enlace-t{font-weight:600;font-size:.93rem;align-self:flex-start;text-decoration:none;
  color:var(--tinta);border-bottom:2px solid transparent;padding-bottom:2px;transition:border-color .18s ease}
.jpc-enlace-t:hover{border-bottom-color:var(--amarillo-aviso);color:var(--tinta)}

/* Categorías del municipio (tarjetas de plantilla) */
.jpc-categorias-t{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:clamp(18px,2vw,26px);margin-top:44px}
.jpc-categoria-t{background:var(--noche-superficie);border-radius:10px;padding:26px 24px;
  display:flex;flex-direction:column;gap:10px;border:1px solid rgba(255,255,255,.18);
  text-decoration:none;color:#fff;transition:transform .2s ease,border-color .2s ease}
.jpc-categoria-t:hover{transform:translateY(-4px);border-color:var(--amarillo-aviso);color:#fff}
.jpc-categoria-t__n{font-family:'DM Mono',monospace;font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--amarillo-aviso)}
.jpc-categoria-t h3{font-size:var(--t-h3);margin:0;color:#fff}
.jpc-categoria-t p{color:rgba(255,255,255,.72);font-size:.96rem;flex:1;margin:0}
.jpc-categoria-t__ir{font-weight:600}

/* Municipios vecinos como chips */
.jpc-chips{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.jpc-chip{background:var(--papel);border:2px solid var(--tinta);border-radius:6px;padding:13px 18px;
  display:inline-flex;align-items:center;gap:11px;font-weight:600;text-decoration:none;color:var(--tinta);
  transition:transform .18s ease,box-shadow .18s ease}
.jpc-chip:hover{transform:translateY(-3px);box-shadow:5px 5px 0 var(--noche);color:var(--tinta)}
.jpc-chip .jpc-mono{color:var(--humo) !important;font-size:.68rem !important}
.jpc-chip--espera{border-style:dashed;border-color:rgba(20,27,36,.25);font-weight:500;color:var(--humo)}

/* La barra de filtros de la plantilla usa el mismo formulario que el hub */
.jpc-filtros form{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding-block:18px;
  width:100%;max-width:1180px;margin-inline:auto;padding-inline:clamp(20px,4vw,40px)}

@media(max-width:960px){
  .jpc-municipio__in{grid-template-columns:1fr}
}
@media(max-width:620px){
  .jpc-municipio__ctas{flex-direction:column;align-items:stretch}
  .jpc-municipio__ctas .jpc-btn{width:100%}
}

/* Tarjetas de comercio generadas por [jpc_comercios] (no son bloques) */
.jpc-comercios-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:clamp(20px,2.4vw,30px);margin-top:52px}
article.jpc-comercio{background:var(--papel);border:2px solid var(--tinta);border-radius:10px;
  overflow:hidden;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease}
article.jpc-comercio:hover{transform:translateY(-4px);box-shadow:8px 8px 0 var(--noche)}
article.jpc-comercio .jpc-comercio__cuerpo>*{margin-top:14px}
article.jpc-comercio .jpc-comercio__cuerpo>*:first-child{margin-top:0}
article.jpc-comercio h3{font-size:var(--t-h3);margin:0}
/* ===== Imágenes de tarjeta: la caja manda, no la foto =====
   Las cajas tienen proporción fija (16/10, 4/3, 1/1). Si la imagen va en
   flujo, su alto natural gana y cada tarjeta crece distinto. Sacándola del
   flujo la proporción se respeta con cualquier archivo que suba el equipo. */
.jpc-comercio__foto--img,
.jpc-negocio-t__foto--img,
.jpc-producto__foto--img{padding:0;background:var(--papel);display:block;position:relative;overflow:hidden}
.jpc-comercio__foto--img img,
.jpc-negocio-t__foto--img img,
.jpc-producto__foto--img img{position:absolute;inset:0;width:100%;height:100%;display:block}
/* Logos: completos y con aire, nunca recortados. */
.jpc-comercio__foto--img img,
.jpc-negocio-t__foto--img img{object-fit:contain;padding:16px}
/* Fotos de producto: llenan la caja, el recorte no estorba. */
.jpc-producto__foto--img img{object-fit:cover}

/* Ficha de 4 datos calculada (versión no-bloques) */
.jpc-ficha--auto{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  margin-top:44px;border:1px solid rgba(255,255,255,.18);border-radius:10px;overflow:hidden}
.jpc-ficha__celda{padding:20px 22px;border-right:1px solid rgba(255,255,255,.18)}
.jpc-ficha__celda:last-child{border-right:0}
.jpc-ficha__celda p{margin:0 !important}
.jpc-ficha__celda .jpc-mono{color:rgba(255,255,255,.55) !important;font-size:.7rem !important;margin-bottom:8px !important}
@media(max-width:781px){
  .jpc-ficha--auto{grid-template-columns:repeat(2,1fr)}
  .jpc-ficha__celda{border-right:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.18)}
  .jpc-ficha__celda:nth-child(2n){border-right:0}
  .jpc-ficha__celda:nth-last-child(-n+2){border-bottom:0}
}
@media(max-width:430px){
  .jpc-ficha--auto{grid-template-columns:1fr}
  .jpc-ficha__celda{border-right:0}
  .jpc-ficha__celda:last-child{border-bottom:0}
}

/* Enlaces de la tarjeta de zona: uno por municipio */
.jpc-zona-enlaces{display:flex;flex-direction:column;gap:8px}
.jpc-zona-enlaces a{font-weight:600;text-decoration:none;color:var(--tinta);
  border-bottom:2px solid transparent;padding-bottom:2px;align-self:flex-start;
  transition:border-color .18s ease}
.jpc-zona-enlaces a:hover{border-bottom-color:var(--amarillo-aviso)}

/* Aviso cuando el directorio está filtrado por departamento */
.jpc-filtrando{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:36px;
  padding:14px 18px;background:var(--amarillo-aviso);border:2px solid var(--tinta);
  border-radius:6px;font-family:'DM Mono',monospace;font-size:.76rem;letter-spacing:.1em;
  text-transform:uppercase;font-weight:500;color:var(--tinta)}
.jpc-filtrando a{color:var(--tinta);text-decoration:none;border-bottom:2px solid var(--tinta)}

/* ============================================================
   /colaboradores/ — quiénes están detrás
   Guía: 3. Diseño del sitio web/GUIA-DE-DISENO-colaboradores.md
   La página se lee en dos minutos y termina devolviendo al
   directorio: los protagonistas del sitio son los comerciantes.
   ============================================================ */

/* Eyebrow del hero. Selector de hijo directo a propósito: en /negocios/ el
   mismo hero contiene [jpc_cifras_directorio], que trae sus propios .jpc-mono. */
.jpc-hero-nosotros>.jpc-wrap>p.jpc-mono{color:var(--amarillo-aviso);display:block;margin-bottom:20px}
.jpc-hero-nosotros h1{max-width:16ch}

/* Manifiesto: el único bloque de texto seguido del sitio, compuesto para
   leerse (64 caracteres de ancho) y no para rellenar. */
.jpc-manifiesto{max-width:64ch;border-top:3px solid var(--amarillo-aviso);padding-top:30px}
.jpc-manifiesto p{font-size:clamp(1.15rem,1.7vw,1.45rem);line-height:1.55;letter-spacing:-.01em;margin:0}

/* Los cuatro departamentos: dato en mono, no decoración */
ul.jpc-zonas{display:flex;flex-wrap:wrap;gap:10px;margin:34px 0 0;padding:0;list-style:none}
ul.jpc-zonas li{margin:0;border:1px solid rgba(20,27,36,.14);border-radius:100px;padding:8px 16px;
  font-family:'DM Mono',monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--humo)}

/* Rejillas: el bloque de columnas reparte el ancho entre las columnas que
   existan; como rejilla de ancho mínimo, tres personas se ven igual que cuatro. */
.wp-block-columns.jpc-equipo,
.wp-block-columns.jpc-puertas{display:grid !important;gap:clamp(20px,2.4vw,30px)}
.wp-block-columns.jpc-equipo{grid-template-columns:repeat(auto-fit,minmax(270px,1fr));margin-top:48px}
.wp-block-columns.jpc-puertas{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-top:44px}
.wp-block-columns.jpc-equipo>.wp-block-column,
.wp-block-columns.jpc-puertas>.wp-block-column{flex-basis:auto !important;margin:0 !important}

/* Tarjeta de persona */
.wp-block-column.jpc-persona{background:var(--papel);border:2px solid var(--tinta);border-radius:10px;
  overflow:hidden;display:flex;flex-direction:column;padding:0 !important;
  transition:transform .2s ease,box-shadow .2s ease}
.wp-block-column.jpc-persona:hover{transform:translateY(-4px);box-shadow:8px 8px 0 var(--noche)}

/* Foto de persona: recorte, al revés que el logo de un comercio. Recortar un
   retrato no le quita significado y la rejilla necesita que todas midan igual;
   recortar un logo mutila la identidad del negocio. La imagen sale del flujo
   para que mande la caja y no el archivo que suba el equipo. */
.jpc-persona__foto{aspect-ratio:1/1;background:repeating-linear-gradient(135deg,#E4E6E9 0 12px,#DDE0E4 12px 24px);
  border-bottom:2px solid var(--tinta);display:grid;place-items:center;text-align:center;
  padding:16px;color:var(--humo);margin:0 !important}
figure.jpc-persona__foto{display:block;position:relative;overflow:hidden;padding:0;background:var(--papel)}
figure.jpc-persona__foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
figure.jpc-persona__foto figcaption{display:none}

.jpc-persona__cuerpo{padding:22px;display:flex;flex-direction:column;gap:12px;flex:1}
.jpc-persona__cuerpo>*{margin:0 !important}
p.jpc-persona__rol{color:var(--teja) !important;font-size:.68rem !important;letter-spacing:.13em}
.jpc-persona h3{font-size:var(--t-h3);margin:0}
.jpc-persona__cuerpo>p:not(.jpc-persona__rol):not(.jpc-persona__nota):not(.jpc-persona__red){
  color:var(--humo);font-size:.97rem;flex:1}

/* Vínculo declarado: dato, no relato. No compite con la descripción. */
p.jpc-persona__nota{font-size:.88rem;color:var(--tinta);line-height:1.5;
  border-left:3px solid var(--amarillo-aviso);padding-left:13px}

/* Enlace a la red. El icono va por CSS para que en el editor la tarjeta sea
   solo texto y enlace; el texto nombra red y destino, nunca "aquí". */
p.jpc-persona__red{align-self:flex-start}
p.jpc-persona__red a{display:inline-flex;align-items:center;gap:9px;font-weight:600;font-size:.93rem;
  color:var(--tinta);text-decoration:none;border-bottom:2px solid var(--amarillo-aviso);
  padding-bottom:3px;transition:border-color .18s ease}
p.jpc-persona__red a:hover{border-bottom-color:var(--tinta)}
p.jpc-persona__red a::before{content:"";width:17px;height:17px;flex:none;background-color:currentColor;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain}
p.jpc-red--in a::before{-webkit-mask-image:var(--icono-linkedin);mask-image:var(--icono-linkedin)}
p.jpc-red--ig a::before{-webkit-mask-image:var(--icono-instagram);mask-image:var(--icono-instagram)}
:root{
  --icono-linkedin:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.98 3.5a2.5 2.5 0 11-.02 5.001A2.5 2.5 0 014.98 3.5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3-.02-2.96-1.8-2.96-1.8 0-2.08 1.4-2.08 2.86V21H9z'/%3E%3C/svg%3E");
  --icono-instagram:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.2' cy='6.8' r='1.1' fill='black' stroke='none'/%3E%3C/svg%3E");
}

/* "¿Qué ganamos con esto?": tres respuestas en una sola caja */
.wp-block-columns.jpc-claridad{display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0 !important;margin-top:44px;
  border:1px solid rgba(255,255,255,.18);border-radius:10px;overflow:hidden}
.wp-block-columns.jpc-claridad>.wp-block-column{flex-basis:auto !important;margin:0 !important;
  padding:24px;border-right:1px solid rgba(255,255,255,.18)}
.wp-block-columns.jpc-claridad>.wp-block-column:last-child{border-right:0}
.jpc-claridad p.jpc-mono{color:var(--amarillo-aviso) !important;display:block;margin:0 0 10px}
.jpc-claridad p:not(.jpc-mono){color:rgba(255,255,255,.82);font-size:.97rem;margin:0}

/* Cierre: dos puertas de salida hacia lo que sí importa */
.wp-block-column.jpc-puerta{background:var(--papel);border:2px solid var(--tinta);border-radius:10px;
  padding:clamp(26px,3vw,36px) !important;display:flex;flex-direction:column;gap:12px}
.jpc-puerta>*{margin:0 !important}
.jpc-puerta p.jpc-mono{color:var(--teja) !important}
.jpc-puerta h3{font-size:var(--t-h3)}
.jpc-puerta>p:not(.jpc-mono){color:var(--humo);flex:1}
.jpc-puerta .wp-block-buttons{margin-top:10px !important}

@media (max-width:960px){
  /* En una sola columna el separador vertical no separa nada */
  .wp-block-columns.jpc-claridad>.wp-block-column{border-right:0;
    border-bottom:1px solid rgba(255,255,255,.18)}
  .wp-block-columns.jpc-claridad>.wp-block-column:last-child{border-bottom:0}
}
@media (max-width:620px){
  .jpc-puerta .wp-block-button,
  .jpc-puerta .wp-block-button__link{width:100%}
}

/* Sección que continúa la anterior sin corte (manifiesto → colaboradores) */
.wp-block-group.jpc-seccion.jpc-pegada{padding-top:0 !important}

/* Botón de línea sobre fondo claro: el .jpc-btn-linea es blanco y desaparece */
.jpc-btn-linea-tinta .wp-block-button__link{background:transparent !important;color:var(--tinta) !important;
  border:2px solid var(--tinta);border-radius:6px;font-weight:600;font-size:1rem;line-height:1.2;
  text-align:center;text-wrap:balance;padding:15px 26px;
  transition:transform .18s ease,background .18s ease,color .18s ease}
.jpc-btn-linea-tinta .wp-block-button__link:hover{background:var(--tinta) !important;color:#fff !important;
  transform:translateY(-2px)}

/* La foto llena la caja también cuando el bloque Imagen se inserta DENTRO del
   recuadro de marcador de posición, que es lo que sale natural en el editor:
   sin esto quedaba el rayado gris y 16px de aire alrededor del retrato. */
.jpc-persona__foto:has(img){padding:0;background:var(--papel);display:block;
  position:relative;overflow:hidden}
.jpc-persona__foto:has(img)>*{position:absolute;inset:0;margin:0 !important;max-width:none}
.jpc-persona__foto img{width:100%;height:100%;object-fit:cover;display:block}
.jpc-persona__foto figcaption{display:none}
/* Si queda el texto del marcador junto a la foto, sobra: se oculta solo. */
.jpc-persona__foto:has(img) .jpc-mono{display:none}

/* ============================================================
   Menú móvil: el desplegable de Astra se pinta con el fondo
   claro del tema, pero los enlaces son blancos porque los
   hereda de la barra oscura. Resultado: texto invisible.
   El panel pasa a azul noche, que es donde ese blanco se lee.
   ============================================================ */
.ast-header-break-point .ast-mobile-header-content{background:var(--noche) !important}
.ast-header-break-point .ast-mobile-header-content .main-header-menu,
.ast-header-break-point .ast-mobile-header-content .menu-item,
.ast-header-break-point .ast-mobile-header-content .menu-link{background:transparent !important}
.ast-header-break-point .ast-mobile-header-content .menu-link{color:#fff !important}
/* El último ítem conserva su rótulo amarillo */
.ast-header-break-point .ast-mobile-header-content .main-header-menu>.menu-item:last-child>.menu-link{
  background:var(--amarillo-aviso) !important;color:var(--tinta) !important}

/* El icono de la hamburguesa trae su propio fill negro y desaparecía
   sobre la barra azul */
.ast-header-break-point .menu-toggle svg,
.ast-header-break-point .menu-toggle .ahfb-svg-iconset svg{fill:#fff !important}
.ast-header-break-point .menu-toggle{color:#fff !important}

/* ===== Redes del comercio en la ficha (fila "Redes" de la caja de datos) ===== */
.jpc-ficha-t dd.jpc-redes{display:flex;flex-wrap:wrap;gap:8px 18px}
.jpc-red{display:inline-flex;align-items:center;gap:8px;color:#fff;font-weight:600;font-size:.95rem;
  text-decoration:none;border-bottom:2px solid var(--amarillo-aviso);padding-bottom:2px;
  transition:border-color .18s ease}
.jpc-red:hover{border-bottom-color:#fff;color:#fff}
.jpc-red::before{content:"";width:16px;height:16px;flex:none;background:currentColor;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain}
.jpc-red--instagram::before{-webkit-mask-image:var(--icono-instagram);mask-image:var(--icono-instagram)}
.jpc-red--facebook::before{-webkit-mask-image:var(--icono-facebook);mask-image:var(--icono-facebook)}
.jpc-red--tiktok::before{-webkit-mask-image:var(--icono-tiktok);mask-image:var(--icono-tiktok)}
.jpc-red--web::before{-webkit-mask-image:var(--icono-web);mask-image:var(--icono-web)}
:root{
  --icono-facebook:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.5 21v-7h2.6l.4-3h-3V9.1c0-.9.3-1.6 1.6-1.6h1.5V4.9c-.3 0-1.2-.1-2.2-.1-2.2 0-3.6 1.3-3.6 3.8V11H8.2v3h2.6v7z'/%3E%3C/svg%3E");
  --icono-tiktok:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16.7 5.9c-.9-.6-1.6-1.7-1.8-2.9h-3v11.8a2.6 2.6 0 11-2.6-2.6c.3 0 .6 0 .8.1V9.2a5.6 5.6 0 103.9 5.4V8.9c1 .7 2.3 1.2 3.6 1.2v-3c-.3 0-.6-.1-.9-.2z'/%3E%3C/svg%3E");
  --icono-web:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3a13.5 13.5 0 010 18M12 3a13.5 13.5 0 000 18'/%3E%3C/svg%3E");
}

/* Aviso de perfil en revision, encima de la ficha */
.jpc-aviso-revision{background:var(--amarillo-aviso);color:var(--tinta);border-radius:6px;
  padding:14px 18px;margin:18px 0 0;font-size:.95rem;line-height:1.5}

/* Contacto apagado mientras el comercio no esté verificado: parece botón
   pero no lo es, para que se lea el motivo en vez de invitar a tocarlo. */
.jpc-btn--inactivo{background:transparent;color:var(--humo);border:2px dashed rgba(255,255,255,.32);
  cursor:not-allowed;pointer-events:none}
.jpc-tienda__ctas .jpc-btn--inactivo{color:rgba(255,255,255,.62)}
p.jpc-nota-verificacion{margin:10px 0 0;font-size:.92rem;line-height:1.5;
  color:rgba(255,255,255,.72);max-width:46ch}

/* ===== Cerrado temporalmente =====
   El comercio sigue publicado e indexado; lo que cambia es que se anuncia
   cerrado y no se entrega el contacto. */
.jpc-negocio-t__aviso.jpc-aviso--cerrado{background:rgba(20,27,36,.06);color:var(--humo)}
.jpc-negocio-t__aviso.jpc-aviso--cerrado span:first-child{color:var(--teja);font-weight:600}
.jpc-estado.jpc-estado--cerrado{background:var(--humo) !important;color:#fff !important}
.jpc-tienda__estado--cerrado{color:var(--amarillo-aviso)}
.jpc-tienda__estado--cerrado i{background:var(--amarillo-aviso) !important}
.jpc-negocio-t__acciones .jpc-btn--inactivo,
.jpc-comercio__cuerpo .jpc-btn--inactivo{
  border:2px dashed rgba(20,27,36,.3);color:var(--humo);background:transparent;
  cursor:not-allowed;pointer-events:none;text-align:center}

/* Aviso de cerrado en la página del producto */
.jpc-aviso-cerrado{background:#FFF7ED;border:2px solid var(--teja);border-radius:8px;
  padding:14px 18px;margin:14px 0;line-height:1.5;color:var(--tinta)}

/* El iframe llena el reproductor, que ya trae la proporción 16:9 */
.jpc-reproductor iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
/* El velo amarillo sobraba encima del video */
.jpc-reproductor:has(iframe)::after{display:none}

/* ===== El pie de la tarjeta de comercio, a la misma altura en toda la fila =====
   La descripción la escribe cada comerciante y mide lo que mide. En una rejilla
   todas las tarjetas miden lo que la más alta, así que el botón de WhatsApp
   caía a una altura distinta en cada una y debajo quedaba un hueco muerto.

   El cuerpo pasa a columna flexible y el botón se empuja al fondo. El aire de
   14px NO puede venir del propio botón: un margin-top:auto vale 0 cuando no
   sobra espacio, y en la tarjeta más alta el botón quedaría pegado al texto.
   Lo pone el elemento de encima como margin-bottom. */
article.jpc-comercio .jpc-comercio__cuerpo{display:flex;flex-direction:column;flex:1}
article.jpc-comercio .jpc-comercio__cuerpo>.jpc-quote{margin-bottom:14px}
/* Si el comercio no tiene descripción, el que separa es el nombre. */
article.jpc-comercio .jpc-comercio__cuerpo:not(:has(.jpc-quote))>h3{margin-bottom:14px}
article.jpc-comercio .jpc-comercio__cuerpo>.jpc-btn,
article.jpc-comercio .jpc-comercio__cuerpo>.jpc-btn--inactivo{margin-top:auto}

/* Tope de 5 líneas: una sola descripción larga estiraba TODA la fila, y las
   demás tarjetas se llenaban de vacío. El texto completo está a un clic, en
   «Ver perfil y catálogo completo». La tarjeta del listado ya hace lo mismo
   con 2 líneas. */
article.jpc-comercio .jpc-quote{
  display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}

/* ===== Barra de contacto, encima de la cabecera =====
   La cabecera ya es --noche; esta franja usa --noche-hondo, que es el token de
   profundidad, para leerse como otra capa y no como una cabecera de dos pisos.
   Tipografía mono porque lo que lleva es un DATO (una dirección), que es
   justo para lo que la guía reserva la mono. */
.jpc-barra-top{background:var(--noche-hondo);color:rgba(255,255,255,.72);
  font-family:'DM Mono',ui-monospace,monospace;font-size:.74rem;letter-spacing:.06em}
.jpc-barra-top__wrap{max-width:1200px;margin-inline:auto;padding:9px clamp(16px,4vw,40px);
  display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center;justify-content:flex-end}
.jpc-barra-top__texto{color:rgba(255,255,255,.55)}
.jpc-barra-top__correo{color:var(--amarillo-aviso) !important;text-decoration:none;
  border-bottom:1px solid transparent;transition:border-color .18s ease}
.jpc-barra-top__correo:hover{border-bottom-color:var(--amarillo-aviso)}
.jpc-barra-top__correo:focus-visible{outline:3px solid var(--amarillo-aviso);outline-offset:3px}
/* En móvil sobra la pregunta: lo que importa es la dirección. */
@media (max-width:620px){
  .jpc-barra-top__texto{display:none}
  .jpc-barra-top__wrap{justify-content:center;padding:8px 16px}
}

/* ===== Página de contacto ===== */
.jpc-seccion--clara{background:var(--papel)}
.jpc-contacto{margin-top:34px !important;gap:clamp(28px,4vw,56px)}
.jpc-contacto__datos{border-left:2px solid var(--tinta);padding-left:clamp(18px,2vw,26px);
  align-self:flex-start}
.jpc-contacto__datos .jpc-mono{color:var(--teja) !important;margin:0 0 2px}
.jpc-contacto__datos p:not(.jpc-mono){margin:0 0 18px;font-weight:600;overflow-wrap:anywhere}
.jpc-contacto__datos p:last-child{margin-bottom:0}
.jpc-nota-datos-pie{margin-top:26px !important;font-size:.9rem;color:var(--humo);max-width:66ch}

/* El formulario, con la misma caja que el resto de campos del sitio */
.jpc-contacto__form .ff-el-group{margin-bottom:18px}
.jpc-contacto__form .ff-el-input--label label{font-weight:600;color:var(--tinta)}
.jpc-contacto__form input[type=text],
.jpc-contacto__form input[type=email],
.jpc-contacto__form select,
.jpc-contacto__form textarea{
  border:2px solid var(--tinta) !important;border-radius:6px !important;
  background:var(--papel) !important;color:var(--tinta) !important;
  height:auto !important;padding:12px 14px !important;font-size:1rem !important}
.jpc-contacto__form textarea{min-height:150px}
.jpc-contacto__form input:focus-visible,
.jpc-contacto__form select:focus-visible,
.jpc-contacto__form textarea:focus-visible{
  outline:3px solid var(--amarillo-aviso);outline-offset:2px;border-color:var(--tinta) !important}
.jpc-contacto__form .ff-btn-submit{
  font-weight:700 !important;padding:15px 26px !important;border-radius:6px !important;
  border:2px solid var(--noche) !important;transition:transform .18s ease,box-shadow .18s ease}
.jpc-contacto__form .ff-btn-submit:hover{transform:translateY(-2px);box-shadow:6px 6px 0 var(--tinta)}
.jpc-contacto__form .ff-message-success{
  background:var(--papel);border:2px solid var(--tinta);border-left:6px solid var(--amarillo-aviso);
  border-radius:6px;padding:20px 22px;color:var(--tinta)}

/* A una sola columna antes de que los campos queden estrechos */
@media (max-width:781px){
  .wp-block-columns.jpc-contacto{flex-wrap:wrap !important}
  .jpc-contacto__datos{border-left:0;border-top:2px solid var(--tinta);
    padding-left:0;padding-top:22px;margin-top:8px}
}

/* Enlaces dentro de un hero oscuro. Sin esto heredan el color de texto normal
   —oscuro— y desaparecen sobre el fondo: pasó con el correo del hero de
   /contacto/. Blanco con subrayado amarillo, que es el recurso de la marca, en
   vez de texto amarillo: así el acento no gasta uno de sus tres usos. */
.jpc-hero-dir .jpc-lead a,
.jpc-hero-nosotros .jpc-lead a{
  color:#fff;text-decoration:none;
  box-shadow:inset 0 -2px 0 var(--amarillo-aviso);
  transition:box-shadow .18s ease}
.jpc-hero-dir .jpc-lead a:hover,
.jpc-hero-nosotros .jpc-lead a:hover{box-shadow:inset 0 -8px 0 rgba(255,196,46,.45)}
.jpc-hero-dir .jpc-lead a:focus-visible,
.jpc-hero-nosotros .jpc-lead a:focus-visible{outline:3px solid var(--amarillo-aviso);outline-offset:3px}

/* ===== Bloque de contacto del pie, v2 =====
   La v1 eran dos enlaces amarillos del mismo tamaño separados por un punto:
   sin jerarquía —¿cuál pulso?— y gastando dos veces el acento. Ahora el correo
   es lo principal y el formulario es la alternativa.

   El panel usa --noche-superficie, que es EL token de elevación, sobre el
   --noche-hondo del pie: dos capas reales del sistema en vez de un gris
   inventado. */
.jpc-pie-contacto{padding:0 clamp(16px,4vw,40px);margin-bottom:26px}
.jpc-pie-contacto__panel{
  max-width:1100px;margin-inline:auto;
  background:var(--noche-superficie);border-radius:10px;
  padding:clamp(20px,2.4vw,26px) clamp(22px,3vw,34px);
  display:flex;flex-wrap:wrap;gap:18px 28px;
  align-items:center;justify-content:space-between}

.jpc-pie-contacto__ojo{
  font-family:'DM Mono',ui-monospace,monospace;font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(255,255,255,.5) !important;margin:0 0 6px !important}

/* El correo es el elemento principal: grande y con el subrayado pintado de la
   marca. Blanco, no amarillo: el amarillo lo pone el subrayado, y así el
   acento suma una sola vez. */
.jpc-pie-contacto__correo{
  display:inline-block;color:#fff !important;text-decoration:none;
  font-size:clamp(1.05rem,1.5vw,1.3rem);font-weight:600;line-height:1.25;
  overflow-wrap:anywhere;
  box-shadow:inset 0 -3px 0 var(--amarillo-aviso);
  transition:box-shadow .18s ease}
.jpc-pie-contacto__correo:hover{box-shadow:inset 0 -10px 0 rgba(255,196,46,.4)}

/* La alternativa: botón de línea, sin color, para que no compita. */
.jpc-pie-contacto__btn{
  flex:none;color:#fff !important;text-decoration:none;font-weight:600;font-size:.95rem;
  border:2px solid rgba(255,255,255,.3);border-radius:6px;
  padding:12px 22px;line-height:1.2;white-space:nowrap;
  transition:border-color .18s ease,background-color .18s ease,transform .18s ease}
.jpc-pie-contacto__btn:hover{
  border-color:#fff;background:rgba(255,255,255,.07);transform:translateY(-2px)}

.jpc-pie-contacto__correo:focus-visible,
.jpc-pie-contacto__btn:focus-visible{outline:3px solid var(--amarillo-aviso);outline-offset:3px}

/* En móvil, apilado y a lo ancho: el botón deja de ser un apéndice. */
@media (max-width:620px){
  .jpc-pie-contacto__panel{flex-direction:column;align-items:stretch;text-align:center;gap:20px}
  .jpc-pie-contacto__btn{text-align:center}
}