/*
 * Caracool Vinos — el explorador
 * ─────────────────────────────────────────────────────────────────────
 * Generado desde el laboratorio (labs/vinos/vinos.tpl.html) con a-plugin.py.
 * No se edita a mano: se afina el laboratorio y se vuelve a generar.
 *
 * Todo cuelga de .cv-explorador para no tocar nada fuera del bloque, y
 * los colores y las letras son los del Kit de Elementor (la familia y,
 * si el Kit no es el de El Churra, también la cursiva y el peso). Si el Kit no
 * lleva los tonos con nombre de El Churra, PHP saca la paleta de los
 * colores que sí tiene (el más claro, el más oscuro y un acento) y la
 * pone en las variables --cv-k-*; si no hay Kit, vale el valor de El
 * Churra de reserva.
 */
.cv-explorador{
  --cv-tinta:var(--cv-k-tinta,var(--e-global-color-secondary,#241610));
  --cv-crema:var(--cv-k-crema,var(--e-global-color-cremaclara,#FAF5EC));
  --cv-crema2:var(--cv-k-crema2,var(--e-global-color-crema,#F2E9DC));
  --cv-arena:var(--cv-k-arena,var(--e-global-color-arena,#E9DCC6));
  --cv-texto:var(--cv-k-texto,var(--e-global-color-text,#5C4433));
  --cv-borde:var(--cv-k-borde,var(--e-global-color-borde,#E3D8C6));
  --cv-rojo:var(--cv-k-rojo,var(--e-global-color-primary,#93210B));
  --cv-ocre:var(--cv-k-ocre,var(--e-global-color-ocremadera,#725841));
  --cv-naranja:var(--cv-k-naranja,var(--e-global-color-accent,#E08B4F));
  --cv-curva:cubic-bezier(.22,1,.36,1);
  --cv-didona:var(--e-global-typography-primary-font-family,"Bodoni Moda"),Georgia,serif;
  --cv-sans:var(--e-global-typography-text-font-family,Inter),system-ui,sans-serif;
  --cv-didona-estilo:var(--cv-k-didona-estilo,italic);
  --cv-didona-peso:var(--cv-k-didona-peso,500);
  --cv-peso-fino:var(--cv-k-peso-fino,300);
  /* el color del vino en la copa (rubí, paja y oro, salmón, oro pálido): no
     va al Kit, es un dato; se puede afinar desde el widget */
  --cv-vino-tinto:#E0435A;--cv-vino-blanco:#F2DC8A;--cv-vino-rosado:#F2A0A6;--cv-vino-espumoso:#FBECB4;--cv-vino-dulce:#E2A34A;--cv-vino-generoso:#B8742F;
  /* la bodega de noche: sus propios tokens, aparte de los de día */
  --cv-noche-fondo:var(--cv-k-noche-fondo,#0F0907);--cv-noche-papel:var(--cv-k-noche-papel,#120B09);--cv-noche-texto:var(--cv-k-noche-texto,#FAF5EC);--cv-noche-suave:var(--cv-k-noche-suave,#B9A78F);--cv-noche-borde:var(--cv-k-noche-borde,rgba(250,245,236,.14));--cv-noche-arena:var(--cv-k-noche-arena,#2A1C16);
  --cv-noche-acento:var(--cv-k-noche-acento,var(--e-global-color-accent,#E08B4F));
  color:var(--cv-tinta);
  font:400 16px/1.6 var(--cv-sans);
  -webkit-font-smoothing:antialiased;
}
.cv-explorador *,.cv-explorador *::before,.cv-explorador *::after{box-sizing:border-box}
/* El Kit estila todos los botones del sitio (mayúsculas, espaciado, radio,
   fondo rojo, y color blanco al pasar) con «.elementor-kit-N button» y
   «…button:hover». Aquí cada botón lleva lo suyo, así que antes se apaga
   lo del Kit, botón a botón. Todas las reglas del bloque llevan la clase
   de la raíz dos veces (tres clases de peso): así también en :hover y
   :focus gana lo nuestro, porque tres clases pesan más que dos clases y
   una pseudoclase, cargue cuando cargue la hoja del Kit. */
.cv-explorador.cv-explorador .vino,.cv-explorador.cv-explorador .chip,.cv-explorador.cv-explorador .activo-chip,.cv-explorador.cv-explorador .compartir,.cv-explorador.cv-explorador .corazon,
.cv-explorador.cv-explorador .ficha__mas button,.cv-explorador.cv-explorador .ficha__volver,.cv-explorador.cv-explorador .globo__zoom button,.cv-explorador.cv-explorador .limpiar,.cv-explorador.cv-explorador .modo button,.cv-explorador.cv-explorador .mis-boton,
.cv-explorador.cv-explorador .buscar__borrar,.cv-explorador.cv-explorador .campo__quitar,.cv-explorador.cv-explorador .dianoche button{
  font:inherit;color:inherit;cursor:pointer;text-transform:none;letter-spacing:normal;box-shadow:none;border-radius:0;
  line-height:normal;background:none;border:0;padding:0;margin:0;min-height:0;width:auto;text-decoration:none;transition:none;
  white-space:normal}
/* (white-space: el reset de Hello pone nowrap a todos los button, y las
   filas de la lista son botones: sin esto no parten la línea y la lista
   sale con scroll horizontal) */
.cv-explorador.cv-explorador .sel,.cv-explorador.cv-explorador .buscar{font:inherit;color:inherit;box-shadow:none;margin:0;min-height:0;line-height:normal;text-transform:none}
.cv-explorador.cv-explorador h1,.cv-explorador.cv-explorador h2,.cv-explorador.cv-explorador h3,.cv-explorador.cv-explorador h4,.cv-explorador.cv-explorador p{margin:0;text-transform:none;letter-spacing:normal}
/* (los títulos sin color propio, como el nombre del vino en la ficha, van
   con la tinta del bloque y no con el color de títulos del Kit, que en una
   web oscura es claro y de día no se veía) */
.cv-explorador.cv-explorador h1,.cv-explorador.cv-explorador h2,.cv-explorador.cv-explorador h3,.cv-explorador.cv-explorador h4{color:inherit}
.cv-explorador.cv-explorador a{text-decoration:none}
/* el tema (Hello) pone display:inline-block a todos los button y se come el
   atributo hidden: aquí hidden vuelve a significar oculto */
.cv-explorador [hidden]{display:none!important}
/* el globo recorta lo que se sale del marco al acercarse: sin esto, a
   zoom 24 España ocupa la página entera */
.cv-explorador .globo svg{overflow:hidden}
.cv-explorador--vacio{padding:48px 0;font:var(--cv-peso-fino,300) 18px/1.5 var(--cv-sans);color:var(--cv-texto);text-align:center}
.cv-explorador.cv-explorador .oculto{display:none!important}

/* ══ EL EXPLORADOR ═══════════════════════════════════════════════════════
 * Dos columnas: el globo a la izquierda, clavado mientras se baja por la
 * lista; y a la derecha los filtros, la lista y —cuando se elige un vino—
 * la ficha, que ocupa el sitio de la lista para que el globo siga a la
 * vista mientras se lee.
 */
/* Dos diseños, que elige la casa (data-diseno), y un modo que elige el
 * visitante (data-modo):
 *   columnas  el globo a la izquierda, clavado mientras se baja por la lista
 *   mundo     el globo llena la pantalla y hace de hero; la lista flota
 *             encima, a la derecha, con su propio scroll
 *   lista     (modo) el globo se apaga y queda la lista sola, en columna
 */
.cv-explorador.cv-explorador .escena{position:relative;background:var(--cv-crema)}
/* De noche se cambian los tokens y todo lo demás sigue igual: la tinta pasa
   a crema, la crema a cueva. Los colores de noche tienen su propio token,
   editable aparte de los de día. */
.cv-explorador.cv-explorador[data-cv-root]{color:var(--cv-tinta)}
.cv-explorador.cv-explorador[data-cv-root][data-escena=noche]{--cv-tinta:var(--cv-noche-texto);--cv-crema:var(--cv-noche-fondo);--cv-crema2:var(--cv-noche-papel);--cv-arena:var(--cv-noche-arena);--cv-texto:var(--cv-noche-suave);--cv-borde:var(--cv-noche-borde);--cv-rojo:var(--cv-noche-acento);--cv-ocre:var(--cv-noche-suave)}
.cv-explorador.cv-explorador[data-escena=noche] .escena{background:radial-gradient(ellipse at 40% 45%,color-mix(in srgb,var(--cv-noche-fondo) 70%,#3A2218) 0%,var(--cv-noche-fondo) 55%,color-mix(in srgb,var(--cv-noche-fondo) 80%,#000) 100%)}
.cv-explorador.cv-explorador[data-escena=noche][data-modo=lista] .escena{background:var(--cv-crema)}
.cv-explorador.cv-explorador .titulo{display:none}
.cv-explorador.cv-explorador .titulo .rotulo{font:600 13px/1.2 var(--cv-sans);letter-spacing:.08em;text-transform:uppercase;margin:0 0 14px;color:var(--cv-texto)}
.cv-explorador.cv-explorador .titulo h1{font:var(--cv-didona-estilo,italic) var(--cv-didona-peso,500) clamp(44px,5.2vw,84px)/1 var(--cv-didona);letter-spacing:-.01em;margin:0 0 18px;color:var(--cv-tinta)}
.cv-explorador.cv-explorador .titulo .entradilla{font:var(--cv-peso-fino,300) 17px/26px var(--cv-sans);margin:0;color:var(--cv-texto);max-width:36ch}

/* — columnas — */
.cv-explorador.cv-explorador[data-diseno=columnas] .escena{max-width:1360px;margin:0 auto;padding:40px 32px 160px;display:grid;grid-template-columns:minmax(320px,44%) 1fr;gap:48px;align-items:start}
.cv-explorador.cv-explorador[data-diseno=columnas] .globo{position:sticky;top:calc(var(--cv-cabecera,0px) + 24px)}
.cv-explorador.cv-explorador[data-diseno=columnas] .globo__marco{position:relative;aspect-ratio:1;width:100%;max-width:640px;margin:0 auto}
.cv-explorador.cv-explorador[data-diseno=columnas][data-modo=lista] .escena{grid-template-columns:1fr;max-width:880px}
@media (max-width:900px){
  .cv-explorador.cv-explorador[data-diseno=columnas] .escena{grid-template-columns:1fr;gap:24px;padding:24px 20px 96px}
  .cv-explorador.cv-explorador[data-diseno=columnas] .globo{position:relative;top:0}
}
/* El fondo es del bloque entero y no de la escena: con la escena centrada
   (1360 px, o la lista sola) el bloque a todo lo ancho no deja una caja en
   medio de la página. */
.cv-explorador.cv-explorador[data-diseno=columnas]{background:var(--cv-crema)}
.cv-explorador.cv-explorador[data-diseno=columnas][data-escena=noche]:not([data-modo=lista]){background:radial-gradient(ellipse at 40% 45%,color-mix(in srgb,var(--cv-noche-fondo) 70%,#3A2218) 0%,var(--cv-noche-fondo) 55%,color-mix(in srgb,var(--cv-noche-fondo) 80%,#000) 100%)}
.cv-explorador.cv-explorador[data-diseno=columnas][data-escena] .escena{background:none}
/* La lista sola, en una pantalla ancha: los filtros en una columna a la
   izquierda, clavados mientras se baja, y la lista (o la ficha) a la
   derecha. Así usa todo el ancho, como con el globo. Por debajo de 1100 px,
   en columna como siempre. Con data-lista=una (Bodega lo decide por carta),
   en columna también en pantalla ancha. */
@media (min-width:1101px){
  .cv-explorador.cv-explorador[data-diseno=columnas][data-modo=lista]:not([data-lista=una]) .escena{max-width:1360px}
  .cv-explorador.cv-explorador[data-diseno=columnas][data-modo=lista]:not([data-lista=una]) .panel{display:grid;grid-template-columns:minmax(300px,360px) minmax(0,1fr);column-gap:56px;align-items:start}
  .cv-explorador.cv-explorador[data-diseno=columnas][data-modo=lista]:not([data-lista=una]) .filtros{grid-column:1;grid-row:1/span 3;top:calc(var(--cv-cabecera,0px) + 24px);max-height:calc(100vh - var(--cv-cabecera,0px) - 48px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:0 4px 0 0;border-bottom:0;background:none}
  .cv-explorador.cv-explorador[data-diseno=columnas][data-modo=lista]:not([data-lista=una]) .filtros.clavado::before{display:none}
  .cv-explorador.cv-explorador[data-diseno=columnas][data-modo=lista]:not([data-lista=una]) :is(.lista,.ficha,.lista__pie){grid-column:2}
  /* el primer apartado, a la altura de los botones de tipo: sin el aire de
     arriba de la lista ni el que separa un apartado del anterior */
  .cv-explorador.cv-explorador[data-diseno=columnas][data-modo=lista]:not([data-lista=una]) .lista{padding-top:0}
  .cv-explorador.cv-explorador[data-diseno=columnas][data-modo=lista]:not([data-lista=una]) .lista>.grupo:first-child{padding-top:0}
}

/* — mundo — */
.cv-explorador.cv-explorador[data-diseno=mundo] .escena{height:100svh;min-height:640px;overflow:hidden}
/* Con el mapa, la escena no es una sección más que sube al bajar: se queda
   fija llenando la pantalla, la página no se desplaza (body overflow
   hidden, y el pie de la web apagado: lo pone el plugin) y la rueda, caiga
   donde caiga, mueve la lista de vinos. La raíz deja un hueco del mismo
   alto en el flujo para que la página mida lo que la pantalla. */
.cv-explorador.cv-explorador[data-diseno=mundo]:is([data-modo=mapa],[data-modo=red]){height:100svh;min-height:640px}
.cv-explorador.cv-explorador[data-diseno=mundo]:is([data-modo=mapa],[data-modo=red]) .escena{position:fixed;inset:0;height:auto;z-index:0}
.cv-explorador.cv-explorador[data-diseno=mundo] .titulo{display:block;position:absolute;left:32px;top:112px;z-index:2;max-width:min(560px,36vw)}
.cv-explorador.cv-explorador[data-diseno=mundo] .globo{position:absolute;inset:0}
.cv-explorador.cv-explorador[data-diseno=mundo] .globo__marco{position:absolute;inset:0}
.cv-explorador.cv-explorador[data-diseno=mundo] .globo__zoom{right:auto;left:32px;bottom:112px}
.cv-explorador.cv-explorador[data-diseno=mundo] .globo__pie{position:absolute;left:32px;bottom:44px;margin:0;max-width:none;display:block;min-height:0}
.cv-explorador.cv-explorador[data-diseno=mundo] .globo__pie > div + div{margin-top:4px}
.cv-explorador.cv-explorador[data-diseno=mundo] .globo__ayuda{position:absolute;left:32px;bottom:18px;margin:0;text-align:left}
.cv-explorador.cv-explorador[data-diseno=mundo] .panel{position:absolute;right:32px;top:104px;bottom:28px;width:min(560px,46vw);display:flex;flex-direction:column;padding:14px 10px 0;background:color-mix(in srgb,var(--cv-crema) 86%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--cv-borde);border-radius:2px;z-index:3}
.cv-explorador.cv-explorador[data-diseno=mundo] .filtros{position:static;padding:0 12px 12px;background:none}
.cv-explorador.cv-explorador[data-diseno=mundo] .lista,.cv-explorador.cv-explorador[data-diseno=mundo] .ficha{flex:1;min-height:0;overflow:auto;padding:8px 20px 0 12px;scrollbar-width:thin;scrollbar-gutter:stable;scrollbar-color:var(--cv-borde) transparent}
.cv-explorador.cv-explorador[data-diseno=mundo] .lista__pie{margin:0;padding:10px 12px 12px;border-top:1px solid var(--cv-borde)}
.cv-explorador.cv-explorador[data-diseno=mundo][data-modo=lista] .escena{height:auto;min-height:0;overflow:visible;padding:120px 32px 96px}
.cv-explorador.cv-explorador[data-diseno=mundo][data-modo=lista] .titulo{position:static;max-width:none;text-align:center;margin:0 auto 36px}
.cv-explorador.cv-explorador[data-diseno=mundo][data-modo=lista] .titulo .entradilla{margin:0 auto}
.cv-explorador.cv-explorador[data-diseno=mundo][data-modo=lista] .panel{position:static;width:min(880px,100%);margin:0 auto;padding:0;background:none;border:0;-webkit-backdrop-filter:none;backdrop-filter:none;display:block}
.cv-explorador.cv-explorador[data-diseno=mundo][data-modo=lista] .lista,.cv-explorador.cv-explorador[data-diseno=mundo][data-modo=lista] .ficha{overflow:visible;padding:8px 0 0}
.cv-explorador.cv-explorador[data-diseno=mundo][data-modo=lista] .filtros{position:sticky;top:var(--cv-cabecera,0px);background:var(--cv-crema);padding:8px 0 16px}
.cv-explorador.cv-explorador[data-diseno=mundo][data-modo=lista] .lista__pie{margin:40px 0 0;padding:16px 0 0}
@media (max-width:900px){
  .cv-explorador.cv-explorador[data-diseno=mundo]:is([data-modo=mapa],[data-modo=red]){height:auto;min-height:0}
  /* (con la misma fuerza que la regla de escritorio, o la escena se queda fija y la lista no se alcanza) */
  .cv-explorador.cv-explorador[data-diseno=mundo] .escena,.cv-explorador.cv-explorador[data-diseno=mundo]:is([data-modo=mapa],[data-modo=red]) .escena{position:relative;inset:auto;height:auto;min-height:0;overflow:visible}
  .cv-explorador.cv-explorador[data-diseno=mundo] .titulo{position:static;max-width:none;padding:110px 20px 0}
  .cv-explorador.cv-explorador[data-diseno=mundo] .globo{position:relative;height:52svh;margin-top:16px}
  .cv-explorador.cv-explorador[data-diseno=mundo] .globo__zoom{left:auto;right:12px;bottom:12px}
  .cv-explorador.cv-explorador[data-diseno=mundo] .globo__pie{left:20px;bottom:10px}
  .cv-explorador.cv-explorador[data-diseno=mundo] .globo__ayuda{display:none}
  .cv-explorador.cv-explorador[data-diseno=mundo] .panel{position:static;width:auto;margin:16px 16px 0;padding:0;background:none;border:0;-webkit-backdrop-filter:none;backdrop-filter:none;display:block}
  .cv-explorador.cv-explorador[data-diseno=mundo] .lista,.cv-explorador.cv-explorador[data-diseno=mundo] .ficha{overflow:visible;padding:8px 0 0}
  .cv-explorador.cv-explorador[data-diseno=mundo] .filtros{position:relative;top:auto;padding:8px 0 16px}
  .cv-explorador.cv-explorador[data-diseno=mundo] .lista__pie{margin:40px 0 0;padding:16px 0 0}
  .cv-explorador.cv-explorador[data-diseno=mundo][data-modo=lista] .escena{padding:0 0 64px}
  .cv-explorador.cv-explorador[data-diseno=mundo][data-modo=lista] .titulo{padding:110px 20px 0;margin-bottom:20px}
}
/* Cómo encaja «mundo» en la web (lo mide el script, ver medirEncaje):
   - data-solape=si, o sin atributo: la cabecera se superpone a lo alto del
     bloque, como la de El Churra. Es el diseño tal cual está arriba.
   - data-solape=no: la cabecera no lo tapa (ocupa su sitio, o no hay). La
     escena empieza debajo de ella (--arriba) y los márgenes de arriba, que
     despejaban una cabecera superpuesta, pasan a ser de página.
   - data-encaje=bloque: el explorador no está arriba del todo. No llena la
     pantalla ni fija la escena: es un bloque con su alto y la página se
     desplaza como siempre. */
.cv-explorador.cv-explorador[data-diseno=mundo][data-solape=no] .titulo{top:40px}
.cv-explorador.cv-explorador[data-diseno=mundo][data-solape=no] .panel{top:32px}
.cv-explorador.cv-explorador[data-diseno=mundo][data-solape=no][data-modo=lista] .escena{padding-top:56px}
@media (min-width:901px){
  .cv-explorador.cv-explorador[data-diseno=mundo][data-solape=no]:is([data-modo=mapa],[data-modo=red]){height:calc(100svh - var(--arriba,0px));min-height:0}
  .cv-explorador.cv-explorador[data-diseno=mundo][data-solape=no]:is([data-modo=mapa],[data-modo=red]) .escena{inset:var(--arriba,0px) 0 0 0;min-height:0}
  .cv-explorador.cv-explorador[data-diseno=mundo][data-encaje=bloque]:is([data-modo=mapa],[data-modo=red]){height:max(640px,calc(100svh - var(--cv-cabecera,0px)));min-height:0}
  .cv-explorador.cv-explorador[data-diseno=mundo][data-encaje=bloque]:is([data-modo=mapa],[data-modo=red]) .escena{position:relative;inset:auto;height:100%}
}
@media (max-width:900px){
  .cv-explorador.cv-explorador[data-diseno=mundo][data-solape=no] .titulo{padding-top:28px}
  .cv-explorador.cv-explorador[data-diseno=mundo][data-solape=no][data-modo=lista] .titulo{padding-top:28px}
}
/* el globo apagado por el visitante, en los dos diseños */
.cv-explorador.cv-explorador[data-modo=lista] .globo{display:none}
/* la red ocupa el sitio del globo: mismo marco, mismo pie, mismo zoom */
.cv-explorador.cv-explorador .red{display:none}
.cv-explorador.cv-explorador[data-modo=red] .globo:not(.red){display:none}
.cv-explorador.cv-explorador[data-modo=red] .red{display:block}
.cv-explorador.cv-explorador .red canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}
.cv-explorador.cv-explorador .red.arrastrando canvas{cursor:grabbing}
.cv-explorador.cv-explorador .red.sobre canvas{cursor:pointer}
.cv-explorador.cv-explorador[data-diseno=columnas] .red .globo__marco{overflow:hidden;border-radius:2px}
.cv-explorador.cv-explorador .red .globo__tip b{font:var(--cv-didona-estilo,italic) var(--cv-didona-peso,500) 15px/1.2 var(--cv-didona);display:block;margin-bottom:2px}
.cv-explorador.cv-explorador .red .globo__zoom .mover{font-size:14px}
.cv-explorador.cv-explorador .red .globo__zoom .mover.on{background:var(--cv-tinta);color:var(--cv-crema);border-color:var(--cv-tinta)}
.cv-explorador.cv-explorador[data-diseno=mundo] .red .globo__zoom{bottom:28px}
@media (max-width:900px){.cv-explorador.cv-explorador[data-diseno=mundo] .red .globo__zoom{bottom:12px}}
/* mientras la red se coloca, un aviso pequeño */
.cv-explorador.cv-explorador .red__forma{position:absolute;left:50%;top:18px;transform:translateX(-50%);font:400 12px/1 var(--cv-sans);color:var(--cv-texto);opacity:0;transition:opacity .4s ease;pointer-events:none;white-space:nowrap}
.cv-explorador.cv-explorador .red__forma.ver{opacity:.8}

/* ── El globo ──────────────────────────────────────────────────────────── */
.cv-explorador.cv-explorador .globo svg{display:block;width:100%;height:100%;touch-action:none;cursor:grab}
.cv-explorador.cv-explorador .globo svg.arrastrando{cursor:grabbing}
.cv-explorador.cv-explorador .globo .esfera{fill:var(--cv-crema);stroke:var(--cv-borde);stroke-width:1}
.cv-explorador.cv-explorador .globo .malla{fill:none;stroke:var(--cv-borde);stroke-width:.5}
.cv-explorador.cv-explorador .globo .pais{fill:var(--cv-crema2);stroke:var(--cv-crema);stroke-width:.6;transition:fill .35s ease}
/* los países sin vinos: tierra sin fronteras (la raya, del mismo color que el relleno, tapa las juntas) */
.cv-explorador.cv-explorador .globo .tierra{fill:var(--cv-crema2);stroke:var(--cv-crema2);stroke-width:.6;stroke-linejoin:round;pointer-events:none}
.cv-explorador.cv-explorador .globo .pais.con-vinos{fill:var(--cv-arena)}
.cv-explorador.cv-explorador .globo .pais.con-vinos{cursor:pointer}
.cv-explorador.cv-explorador .globo .pais.con-vinos:hover{fill:color-mix(in srgb,var(--cv-arena),var(--cv-tinta) 10%)}
.cv-explorador.cv-explorador .globo .pais.activo,.cv-explorador.cv-explorador .globo .pais.activo:hover{fill:var(--cv-rojo)}
.cv-explorador.cv-explorador .globo .pais.filtro,.cv-explorador.cv-explorador .globo .pais.filtro:hover{fill:color-mix(in srgb,var(--cv-arena),var(--cv-ocre) 55%)}
/* muy cerca, el rojo pleno llenaría el marco entero: el país activo pasa a
   un tono claro con el borde en rojo y el protagonismo lo lleva la zona */
.cv-explorador.cv-explorador .globo svg.cerca .pais{stroke-width:.8}
.cv-explorador.cv-explorador .globo svg.cerca .pais.activo,.cv-explorador.cv-explorador .globo svg.cerca .pais.activo:hover{fill:color-mix(in srgb,var(--cv-arena),var(--cv-rojo) 12%);stroke:var(--cv-rojo);stroke-width:1.1}
.cv-explorador.cv-explorador .globo svg.cerca .pais.filtro,.cv-explorador.cv-explorador .globo svg.cerca .pais.filtro:hover{fill:color-mix(in srgb,var(--cv-arena),var(--cv-ocre) 12%);stroke:var(--cv-ocre);stroke-width:1}
.cv-explorador.cv-explorador .globo .rotulo{font:var(--cv-didona-estilo,italic) var(--cv-didona-peso,500) 22px/1 var(--cv-didona);fill:var(--cv-tinta);pointer-events:none;paint-order:stroke;stroke:var(--cv-crema);stroke-width:5px;stroke-linejoin:round}
.cv-explorador.cv-explorador .globo .rotulo small{font:600 10px/1 var(--cv-sans);letter-spacing:.08em;text-transform:uppercase}
/* el punto de la zona: la bola de la casa, con un aro que late al llegar */
.cv-explorador.cv-explorador .globo .punto{fill:var(--cv-tinta);stroke:var(--cv-crema);stroke-width:1.5;pointer-events:none}
.cv-explorador.cv-explorador .globo .zona{fill:var(--cv-crema);stroke:var(--cv-tinta);stroke-width:1;opacity:.85;cursor:pointer;transition:fill .2s ease}
.cv-explorador.cv-explorador .globo .zona:hover{fill:var(--cv-tinta)}
.cv-explorador.cv-explorador .globo .zona--halo{fill:transparent;stroke:none;cursor:pointer}
.cv-explorador.cv-explorador .globo__tip small{display:block;font:var(--cv-peso-fino,300) 11.5px/1.3 var(--cv-sans);opacity:.8;margin-top:3px;white-space:normal;max-width:220px}
.cv-explorador.cv-explorador .globo .aro{fill:none;stroke:var(--cv-tinta);stroke-width:1;pointer-events:none;opacity:0}
.cv-explorador.cv-explorador .globo .aro.late{animation:cv-aro-late 1.4s var(--cv-curva) 1}
@keyframes cv-aro-late{0%{opacity:.9;r:6}100%{opacity:0;r:26}}
.cv-explorador.cv-explorador .globo__pie{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin:14px auto 0;max-width:640px;font:400 13px/1.4 var(--cv-sans);color:var(--cv-texto);min-height:20px}
.cv-explorador.cv-explorador .globo__pie b{font:var(--cv-didona-estilo,italic) var(--cv-didona-peso,500) 20px/1.1 var(--cv-didona);color:var(--cv-tinta)}
.cv-explorador.cv-explorador .globo__pie small{font:600 11.5px/1.2 var(--cv-sans);letter-spacing:.08em;text-transform:uppercase}
.cv-explorador.cv-explorador .globo__ayuda{font:var(--cv-peso-fino,300) 12.5px/1.4 var(--cv-sans);color:var(--cv-texto);opacity:.7;text-align:center;margin:8px 0 0}
.cv-explorador.cv-explorador .globo__zoom{position:absolute;right:8px;bottom:8px;display:flex;flex-direction:column;gap:6px;z-index:2}
.cv-explorador.cv-explorador .globo__zoom button{width:32px;height:32px;border-radius:50%;border:1px solid var(--cv-borde);background:var(--cv-crema);color:var(--cv-tinta);font:var(--cv-peso-fino,300) 20px/1 var(--cv-sans);display:flex;align-items:center;justify-content:center;padding:0;transition:border-color .25s ease,background .25s ease}
.cv-explorador.cv-explorador .globo__zoom button:hover{border-color:var(--cv-tinta)}
.cv-explorador.cv-explorador .globo__zoom button:disabled{opacity:.35;cursor:default;border-color:var(--cv-borde)}
.cv-explorador.cv-explorador .globo__tip{position:absolute;pointer-events:none;background:var(--cv-tinta);color:var(--cv-crema);font:400 12.5px/1.2 var(--cv-sans);padding:7px 10px;border-radius:2px;transform:translate(-50%,calc(-100% - 12px));white-space:nowrap;opacity:0;transition:opacity .15s ease;z-index:3}
.cv-explorador.cv-explorador .globo__tip.ver{opacity:1}
.cv-explorador.cv-explorador .globo__tip b{font-weight:600}

/* ── Filtros ───────────────────────────────────────────────────────────── */
.cv-explorador.cv-explorador .panel{min-width:0;view-transition-name:cv-panel}
/* Mapa ↔ Lista con transiciones de vista: el panel viaja de su sitio
   flotante a la columna, el globo y el título se funden. Los nombres van
   en los elementos; los tiempos, en los pseudoelementos de la raíz (que
   no se pueden acotar al bloque). Sin soporte, o con movimiento reducido,
   el cambio es instantáneo. */
.cv-explorador.cv-explorador .globo{view-transition-name:cv-globo}
.cv-explorador.cv-explorador .titulo{view-transition-name:cv-titulo}
::view-transition-group(cv-panel),::view-transition-group(cv-globo),::view-transition-group(cv-titulo){animation-duration:.5s;animation-timing-function:cubic-bezier(.22,1,.36,1)}
::view-transition-old(cv-panel),::view-transition-new(cv-panel){animation-duration:.5s;animation-timing-function:cubic-bezier(.22,1,.36,1)}
::view-transition-old(cv-globo),::view-transition-new(cv-globo),::view-transition-old(cv-titulo),::view-transition-new(cv-titulo){animation-duration:.4s}
::view-transition-old(root),::view-transition-new(root){animation-duration:.4s}
/* los filtros se clavan al bajar, pero debajo de la cabecera fija de la
   página si la hay: --cabecera la mide el script (0 si no hay) */
.cv-explorador.cv-explorador .filtros{position:sticky;top:var(--cv-cabecera,0px);z-index:3;background:var(--cv-crema);padding:8px 0 16px;border-bottom:1px solid var(--cv-borde)}
/* clavados, tapan también lo que queda debajo de la cabecera de la página
   (que es transparente): así la lista no se ve pasar por detrás del menú */
.cv-explorador.cv-explorador .filtros.clavado::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:var(--cv-cabecera,0px);background:var(--cv-crema)}
/* (en el móvil no se clavan: sin top, que con position:relative los bajaría el alto de la cabecera encima de la lista) */
@media (max-width:900px){.cv-explorador.cv-explorador .filtros{position:relative;top:auto}}
/* el conmutador del visitante: con mapa o solo la lista */
.cv-explorador.cv-explorador .filtros__cola{margin-left:auto;display:inline-flex;align-items:center;gap:8px}
.cv-explorador.cv-explorador .modo{display:inline-flex;border:1px solid var(--cv-borde);border-radius:999px;padding:2px;gap:2px}
.cv-explorador.cv-explorador .modo button{border:0;background:none;border-radius:999px;padding:5px 11px;font:500 12px/1 var(--cv-sans);color:var(--cv-texto);transition:background .25s ease,color .25s ease}
.cv-explorador.cv-explorador .modo button:hover{color:var(--cv-tinta)}
.cv-explorador.cv-explorador .modo button.on{background:var(--cv-tinta);color:var(--cv-crema)}
.cv-explorador.cv-explorador .filtros__fila{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}
.cv-explorador.cv-explorador .filtros__fila:last-child{margin-bottom:0}
.cv-explorador.cv-explorador .chip{border:1px solid var(--cv-borde);background:transparent;border-radius:999px;padding:7px 14px;font:500 13px/1 var(--cv-sans);letter-spacing:.15px;color:var(--cv-texto);transition:border-color .25s ease,color .25s ease,background .25s ease}
.cv-explorador.cv-explorador .chip:hover{border-color:var(--cv-tinta);color:var(--cv-tinta)}
.cv-explorador.cv-explorador .chip.on{background:var(--cv-tinta);border-color:var(--cv-tinta);color:var(--cv-crema)}
.cv-explorador.cv-explorador .chip small{opacity:.65;margin-left:6px;font-weight:400}
.cv-explorador.cv-explorador .sel{appearance:none;-webkit-appearance:none;border:1px solid var(--cv-borde);background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%235C4433' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat right 12px center;border-radius:999px;padding:7px 32px 7px 14px;font:500 13px/1 var(--cv-sans);color:var(--cv-texto);max-width:210px;text-overflow:ellipsis}
.cv-explorador.cv-explorador .sel.on{border-color:var(--cv-tinta);color:var(--cv-crema);background-color:var(--cv-tinta);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23FAF5EC' stroke-width='1.2'/%3E%3C/svg%3E")}
.cv-explorador.cv-explorador .sel option{color:var(--cv-tinta);background:var(--cv-crema)}
.cv-explorador.cv-explorador .filtros__activos{padding-top:2px}
.cv-explorador.cv-explorador .activo-chip{display:inline-flex;align-items:center;gap:8px;background:var(--cv-tinta);color:var(--cv-crema);border:0;border-radius:999px;padding:6px 8px 6px 12px;font:500 12.5px/1 var(--cv-sans);cursor:pointer}
.cv-explorador.cv-explorador .activo-chip small{font:600 10px/1 var(--cv-sans);letter-spacing:.08em;text-transform:uppercase;opacity:.6}
.cv-explorador.cv-explorador .activo-chip i{font-style:normal;width:16px;height:16px;border-radius:50%;background:var(--cv-crema);color:var(--cv-tinta);display:inline-flex;align-items:center;justify-content:center;font:600 11px/1 var(--cv-sans)}
.cv-explorador.cv-explorador .activo-chip:hover i{background:var(--cv-rojo);color:var(--cv-crema)}
.cv-explorador.cv-explorador .buscar{border:1px solid var(--cv-borde);border-radius:999px;background:transparent;padding:7px 14px;font:400 13px/1 var(--cv-sans);min-width:180px;flex:1}
.cv-explorador.cv-explorador .buscar.on{border-color:var(--cv-tinta)}
.cv-explorador.cv-explorador .buscar:focus{outline:none;border-color:var(--cv-tinta)}
.cv-explorador.cv-explorador .buscar::placeholder{color:var(--cv-texto);opacity:.6}
.cv-explorador.cv-explorador .limpiar{background:none;border:0;padding:0;font:400 13px/1 var(--cv-sans);color:var(--cv-rojo);text-decoration:none}
.cv-explorador.cv-explorador .limpiar:hover{text-decoration:underline}

/* ══ El panel de filtros, en tres tramos ════════════════════════════════
 * 1 · el tipo de vino, con la gota de su color
 * 2 · buscar (con lupa) y afinar: uva, zona, bodega, precio, Parker y Peñín
 * 3 · Mis vinos a la izquierda; a la derecha cómo se ve (mapa, red,
 *     lista) y de día o de noche
 * Entre tramo y tramo, un filete. La estructura es la misma en las tres
 * variantes; cambia la piel (data-panel = mosaico | pildoras | ficha), que
 * elige la casa en Ajustes o en el widget.
 */
.cv-explorador.cv-explorador[data-cv-root] [hidden]{display:none!important}
.cv-explorador.cv-explorador .ico{width:16px;height:16px;flex:none;display:block;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.cv-explorador.cv-explorador .filtros{container:cv-filtros/inline-size}
.cv-explorador.cv-explorador .filtros__tipos{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.cv-explorador.cv-explorador .filtros__afinar{display:flex;flex-direction:column;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid var(--cv-borde)}
.cv-explorador.cv-explorador .filtros__vista{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;padding-top:12px;border-top:1px solid var(--cv-borde)}
.cv-explorador.cv-explorador .filtros__mis{display:flex;min-width:0}
.cv-explorador.cv-explorador .filtros__cola{margin-left:auto;display:inline-flex;align-items:center;gap:10px}
.cv-explorador.cv-explorador .filtros__activos{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-top:0}
/* los filetes de los tramos, de lado a lado del panel, como el de abajo */
.cv-explorador.cv-explorador[data-diseno=mundo] .filtros{--filtros-x:12px}
.cv-explorador.cv-explorador[data-diseno=mundo][data-modo=lista] .filtros{--filtros-x:0px}
@media (max-width:900px){.cv-explorador.cv-explorador[data-diseno=mundo] .filtros{--filtros-x:0px}}
.cv-explorador.cv-explorador .filtros__afinar,.cv-explorador.cv-explorador .filtros__vista{margin-left:calc(-1 * var(--filtros-x,0px));margin-right:calc(-1 * var(--filtros-x,0px));padding-left:var(--filtros-x,0px);padding-right:var(--filtros-x,0px)}

/* la gota: el color del vino en la copa, de los tokens --vino-* */
.cv-explorador.cv-explorador .gota{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--cv-tinta) 22%,transparent)}
.cv-explorador.cv-explorador .gota--todos{background:conic-gradient(var(--cv-vino-tinto) 0 25%,var(--cv-vino-blanco) 0 50%,var(--cv-vino-rosado) 0 75%,var(--cv-vino-espumoso) 0)}
.cv-explorador.cv-explorador .gota--tinto{background:var(--cv-vino-tinto)}
.cv-explorador.cv-explorador .gota--blanco{background:var(--cv-vino-blanco)}
.cv-explorador.cv-explorador .gota--rosado{background:var(--cv-vino-rosado)}
.cv-explorador.cv-explorador .gota--espumoso{background:var(--cv-vino-espumoso)}
.cv-explorador.cv-explorador .gota--champagne{background:var(--cv-vino-espumoso);box-shadow:inset 0 0 0 1.6px var(--cv-ocre)}
.cv-explorador.cv-explorador .gota--dulce{background:var(--cv-vino-dulce)}
.cv-explorador.cv-explorador .gota--generoso{background:var(--cv-vino-generoso)}
.cv-explorador.cv-explorador svg.gota--botella{width:12px;height:12px;border-radius:0;box-shadow:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}

/* buscar: lupa dentro, aspa para borrar en cuanto hay texto */
.cv-explorador.cv-explorador .buscar-caja{position:relative;display:flex;align-items:center;min-width:0;color:var(--cv-texto)}
.cv-explorador.cv-explorador .buscar-caja > .ico{position:absolute;left:14px;pointer-events:none}
.cv-explorador.cv-explorador .buscar-caja .buscar{flex:1;min-width:0;width:100%;-webkit-appearance:none;appearance:none;padding:10px 40px;font:400 14px/1.2 var(--cv-sans);color:var(--cv-tinta)}
.cv-explorador.cv-explorador .buscar-caja .buscar::-webkit-search-cancel-button{-webkit-appearance:none;display:none}
.cv-explorador.cv-explorador .buscar-caja:focus-within{color:var(--cv-tinta)}
.cv-explorador.cv-explorador .buscar__borrar{position:absolute;right:6px;width:28px;height:28px;border:0;border-radius:50%;background:none;color:var(--cv-texto);display:inline-flex;align-items:center;justify-content:center;padding:0}
.cv-explorador.cv-explorador .buscar__borrar:hover{color:var(--cv-tinta);background:color-mix(in srgb,var(--cv-tinta) 7%,transparent)}
.cv-explorador.cv-explorador .buscar__borrar .ico{width:14px;height:14px}

/* los campos: el desplegable nativo va encima, transparente */
.cv-explorador.cv-explorador .campos{display:flex;flex-wrap:wrap;gap:8px}
.cv-explorador.cv-explorador .campo{position:relative;display:flex;align-items:center;gap:8px;min-width:0;color:var(--cv-texto);cursor:pointer;transition:background .25s ease,color .25s ease,border-color .25s ease}
.cv-explorador.cv-explorador .campo .sel{position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0;padding:0;border:0;border-radius:inherit;opacity:0;cursor:pointer;font-size:16px;background:none}
.cv-explorador.cv-explorador .campo__rot,.cv-explorador.cv-explorador .campo__val{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cv-explorador.cv-explorador .campo:hover{color:var(--cv-tinta)}
.cv-explorador.cv-explorador .campo:has(.sel:focus-visible){outline:2px solid var(--cv-tinta);outline-offset:2px}
.cv-explorador.cv-explorador .campo.on .ico--flecha{display:none}
/* Zona espera al país: apagada hasta que se elige uno (con más de un país en la carta) */
.cv-explorador.cv-explorador .campo.espera{opacity:.42}
.cv-explorador.cv-explorador .campo.espera:hover{color:var(--cv-texto)}
.cv-explorador.cv-explorador .campo__quitar{position:relative;z-index:2;flex:none;width:24px;height:24px;margin:-4px -6px -4px auto;border:0;border-radius:50%;background:none;color:inherit;display:inline-flex;align-items:center;justify-content:center;padding:0}
.cv-explorador.cv-explorador .campo__quitar .ico{width:13px;height:13px}
.cv-explorador.cv-explorador .campo__quitar:hover{background:color-mix(in srgb,currentColor 16%,transparent)}

/* Las esquinas: las de los botones y los campos de formulario de la web
   (el plugin las lee del Estilo del tema del Kit y las deja en
   --radio-boton y --radio-campo), o, si no hay, las del diseño, que son el
   segundo valor de cada var(). */
.cv-explorador.cv-explorador[data-cv-root] .mis-boton,.cv-explorador.cv-explorador[data-cv-root] .activo-chip,.cv-explorador.cv-explorador[data-cv-root] .compartir,.cv-explorador.cv-explorador[data-cv-root] .modo,.cv-explorador.cv-explorador[data-cv-root] .modo button{border-radius:var(--cv-radio-boton,999px)}

/* el día y la noche */
.cv-explorador.cv-explorador .dianoche{display:inline-flex;align-items:center}
.cv-explorador.cv-explorador .dianoche button{border:0;background:none;padding:0;color:var(--cv-texto);display:inline-flex;align-items:center;justify-content:center;transition:color .3s ease,background .3s ease,opacity .3s ease}
.cv-explorador.cv-explorador .modo button{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.cv-explorador.cv-explorador .modo .ico,.cv-explorador.cv-explorador .dianoche .ico{width:15px;height:15px}
@media (max-width:900px){.cv-explorador.cv-explorador .buscar-caja .buscar{font-size:16px}}

/* ── Píldoras ────────────────────────────────────────────
 * El lenguaje de ahora, puesto en orden: todo son píldoras, cada una con
 * su icono, los campos a tercios y el último tramo como una barra. */
.cv-explorador.cv-explorador[data-panel=pildoras] .chip{border-radius:var(--cv-radio-boton,999px);display:inline-flex;align-items:center;gap:7px;padding:7px 13px 7px 10px}
.cv-explorador.cv-explorador[data-panel=pildoras] .chip small{margin-left:0}
.cv-explorador.cv-explorador[data-panel=pildoras] .chip.on .gota{box-shadow:0 0 0 1.5px var(--cv-crema)}
.cv-explorador.cv-explorador[data-panel=pildoras] .buscar-caja .buscar{border:1px solid var(--cv-borde);border-radius:var(--cv-radio-campo,999px);background:transparent}
.cv-explorador.cv-explorador[data-panel=pildoras] .buscar-caja .buscar:focus,.cv-explorador.cv-explorador[data-panel=pildoras] .buscar-caja .buscar.on{border-color:var(--cv-tinta)}
.cv-explorador.cv-explorador[data-panel=pildoras] .campo{flex:1 1 calc(33.333% - 6px);height:36px;padding:0 10px 0 12px;border:1px solid var(--cv-borde);border-radius:var(--cv-radio-campo,999px);font:500 13px/1 var(--cv-sans)}
.cv-explorador.cv-explorador[data-panel=pildoras] .campo .ico--flecha{margin-left:auto;width:14px;height:14px}
.cv-explorador.cv-explorador[data-panel=pildoras] .campo__val{display:none}
.cv-explorador.cv-explorador[data-panel=pildoras] .campo.on .campo__rot{display:none}
.cv-explorador.cv-explorador[data-panel=pildoras] .campo.on .campo__val{display:block}
.cv-explorador.cv-explorador[data-panel=pildoras] .campo:hover{border-color:var(--cv-tinta)}
.cv-explorador.cv-explorador[data-panel=pildoras] .campo.espera:hover{border-color:var(--cv-borde)}
.cv-explorador.cv-explorador[data-panel=pildoras] .campo.on{background:var(--cv-tinta);border-color:var(--cv-tinta);color:var(--cv-crema)}
.cv-explorador.cv-explorador[data-panel=pildoras] .mis-boton{height:32px}
.cv-explorador.cv-explorador[data-panel=pildoras] .modo button{height:26px;padding:0 11px 0 9px}
.cv-explorador.cv-explorador[data-panel=pildoras] .dianoche{border:1px solid var(--cv-borde);border-radius:var(--cv-radio-boton,999px);padding:2px;gap:2px}
.cv-explorador.cv-explorador[data-panel=pildoras] .dianoche button{width:30px;height:26px;border-radius:var(--cv-radio-boton,999px)}
.cv-explorador.cv-explorador[data-panel=pildoras] .dianoche button:hover{color:var(--cv-tinta)}
.cv-explorador.cv-explorador[data-panel=pildoras] .dianoche button.on{background:var(--cv-tinta);color:var(--cv-crema)}
@container cv-filtros (max-width:470px){
  .cv-explorador.cv-explorador[data-panel=pildoras] .modo button{padding:0 9px}
  .cv-explorador.cv-explorador[data-panel=pildoras] .modo button span{display:none}
}
@container cv-filtros (max-width:420px){
  .cv-explorador.cv-explorador[data-panel=pildoras] .campo{padding:0 8px 0 11px;gap:7px}
  .cv-explorador.cv-explorador[data-panel=pildoras] .campo .ico--flecha{display:none}
}

/* ── Ficha ─────────────────────────────────────────────────
 * Sin cajas: los tipos como pestañas subrayadas con la cuenta volada, la
 * búsqueda en la didona de la casa sobre una raya, y los campos como la
 * ficha de una cata, en celdas con su rótulo en versalitas y el valor
 * debajo. */
.cv-explorador.cv-explorador[data-panel=ficha] .filtros__tipos{gap:2px 18px}
.cv-explorador.cv-explorador[data-panel=ficha] .chip{display:inline-flex;align-items:center;gap:7px;border:0;border-radius:0;padding:7px 0 8px;background:none;color:var(--cv-texto);font:500 13.5px/1 var(--cv-sans);box-shadow:inset 0 -1.5px 0 transparent;transition:color .25s ease,box-shadow .25s ease}
.cv-explorador.cv-explorador[data-panel=ficha] .chip small{align-self:flex-start;margin:-3px 0 0 -3px;font:500 10px/1 var(--cv-sans);font-variant-numeric:tabular-nums;opacity:.7}
.cv-explorador.cv-explorador[data-panel=ficha] .chip:hover{color:var(--cv-tinta);border-color:transparent}
.cv-explorador.cv-explorador[data-panel=ficha] .chip.on{background:none;color:var(--cv-tinta);box-shadow:inset 0 -1.5px 0 var(--cv-tinta)}
.cv-explorador.cv-explorador[data-panel=ficha] .buscar-caja > .ico{left:0;width:18px;height:18px}
.cv-explorador.cv-explorador[data-panel=ficha] .buscar-caja .buscar{border:0;border-bottom:1px solid var(--cv-borde);border-radius:0;background:none;padding:10px 34px 11px 30px;font:var(--cv-didona-estilo,italic) var(--cv-didona-peso,500) 19px/1.2 var(--cv-didona);letter-spacing:-.005em}
.cv-explorador.cv-explorador[data-panel=ficha] .buscar-caja .buscar::placeholder{opacity:.5}
.cv-explorador.cv-explorador[data-panel=ficha] .buscar-caja .buscar:focus,.cv-explorador.cv-explorador[data-panel=ficha] .buscar-caja .buscar.on{border-bottom-color:var(--cv-tinta)}
.cv-explorador.cv-explorador[data-panel=ficha] .buscar__borrar{right:0}
.cv-explorador.cv-explorador[data-panel=ficha] .campos{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:0;overflow:hidden;margin-top:2px}
.cv-explorador.cv-explorador[data-panel=ficha] .campos[data-n="6"]{grid-template-columns:repeat(3,minmax(0,1fr))}
.cv-explorador.cv-explorador[data-panel=ficha] .campo.espera:hover{background:none}
.cv-explorador.cv-explorador[data-panel=ficha] .campo{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:6px;row-gap:6px;align-items:center;padding:10px 9px 11px 11px;box-shadow:-1px 0 0 var(--cv-borde),0 -1px 0 var(--cv-borde)}
.cv-explorador.cv-explorador[data-panel=ficha] .campo .ico--campo{grid-column:1;grid-row:1;width:13px;height:13px}
.cv-explorador.cv-explorador[data-panel=ficha] .campo__rot{grid-column:2/4;grid-row:1;font:600 10px/1 var(--cv-sans);letter-spacing:.1em;text-transform:uppercase}
.cv-explorador.cv-explorador[data-panel=ficha] .campo__val{grid-column:1/4;grid-row:2;font:500 13.5px/1.2 var(--cv-sans);color:var(--cv-tinta);opacity:.5}
.cv-explorador.cv-explorador[data-panel=ficha] .campo .ico--flecha{grid-column:3;grid-row:1;width:13px;height:13px}
.cv-explorador.cv-explorador[data-panel=ficha] .campo__quitar{grid-column:3;grid-row:1;margin:-6px -6px -6px 0}
.cv-explorador.cv-explorador[data-panel=ficha] .campo:hover{background:color-mix(in srgb,var(--cv-tinta) 3%,transparent)}
.cv-explorador.cv-explorador[data-panel=ficha] .campo:has(.sel:focus-visible){outline-offset:-2px}
.cv-explorador.cv-explorador[data-panel=ficha] .campo.on{background:color-mix(in srgb,var(--cv-tinta) 5%,transparent)}
.cv-explorador.cv-explorador[data-panel=ficha] .campo.on .campo__rot{color:var(--cv-rojo)}
.cv-explorador.cv-explorador[data-panel=ficha] .campo.on .campo__val{opacity:1}
.cv-explorador.cv-explorador[data-panel=ficha] .mis-boton{border:0;border-radius:0;padding:7px 0 8px;background:none;box-shadow:inset 0 -1.5px 0 transparent}
.cv-explorador.cv-explorador[data-panel=ficha] .mis-boton:hover{background:none;color:var(--cv-rojo)}
.cv-explorador.cv-explorador[data-panel=ficha] .mis-boton.on{background:none;color:var(--cv-tinta);box-shadow:inset 0 -1.5px 0 var(--cv-tinta)}
.cv-explorador.cv-explorador[data-panel=ficha] .mis-boton.on svg path{fill:var(--cv-rojo);stroke:var(--cv-rojo)}
.cv-explorador.cv-explorador[data-panel=ficha] .mis-boton.on small{background:var(--cv-tinta);color:var(--cv-crema)}
.cv-explorador.cv-explorador[data-panel=ficha] .modo{border:0;border-radius:0;padding:0;gap:16px}
.cv-explorador.cv-explorador[data-panel=ficha] .modo button{padding:7px 0 8px;border-radius:0;background:none;color:var(--cv-texto);font:500 12.5px/1 var(--cv-sans);box-shadow:inset 0 -1.5px 0 transparent}
.cv-explorador.cv-explorador[data-panel=ficha] .modo button.on{background:none;color:var(--cv-tinta);box-shadow:inset 0 -1.5px 0 var(--cv-tinta)}
.cv-explorador.cv-explorador[data-panel=ficha] .dianoche{gap:2px;padding-left:12px;border-left:1px solid var(--cv-borde)}
.cv-explorador.cv-explorador[data-panel=ficha] .dianoche button{width:26px;height:26px;border-radius:50%;opacity:.5}
.cv-explorador.cv-explorador[data-panel=ficha] .dianoche button:hover{opacity:1}
.cv-explorador.cv-explorador[data-panel=ficha] .dianoche button.on{opacity:1;color:var(--cv-tinta)}
@container cv-filtros (max-width:430px){
  .cv-explorador.cv-explorador[data-panel=ficha] .modo{gap:12px}
  .cv-explorador.cv-explorador[data-panel=ficha] .modo button span{display:none}
}

/* ── Mosaico ────────────────────────────────────────────
 * Más visual: los tipos en una rejilla de fichas con la cuenta a la
 * derecha, la búsqueda como un campo relleno, los filtros como baldosas
 * con el icono grande, y un interruptor de sol y luna que se desliza. */
.cv-explorador.cv-explorador[data-panel=mosaico] .filtros__tipos{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:6px}
/* filas parejas: el script pone cuántas columnas (--tipos-cols) según los botones y el ancho */
.cv-explorador.cv-explorador[data-panel=mosaico] .filtros__tipos[style*="--tipos-cols"]{grid-template-columns:repeat(var(--tipos-cols),minmax(0,1fr))}
.cv-explorador.cv-explorador[data-panel=mosaico] .chip{display:flex;align-items:center;gap:8px;min-width:0;border-radius:var(--cv-radio-campo,10px);padding:9px 10px;font:500 12.5px/1 var(--cv-sans)}
.cv-explorador.cv-explorador[data-panel=mosaico] .chip > span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cv-explorador.cv-explorador[data-panel=mosaico] .chip small{margin-left:auto;font-variant-numeric:tabular-nums}
.cv-explorador.cv-explorador[data-panel=mosaico] .chip .gota{width:12px;height:12px}
.cv-explorador.cv-explorador[data-panel=mosaico] .chip.on .gota{box-shadow:0 0 0 1.5px var(--cv-crema)}
.cv-explorador.cv-explorador[data-panel=mosaico] .buscar-caja > .ico{left:15px;width:17px;height:17px}
.cv-explorador.cv-explorador[data-panel=mosaico] .buscar-caja .buscar{border:0;border-radius:var(--cv-radio-campo,12px);background:color-mix(in srgb,var(--cv-tinta) 6%,transparent);padding:12px 40px 12px 42px}
.cv-explorador.cv-explorador[data-panel=mosaico] .buscar-caja .buscar:focus,.cv-explorador.cv-explorador[data-panel=mosaico] .buscar-caja .buscar.on{box-shadow:inset 0 0 0 1px var(--cv-tinta)}
.cv-explorador.cv-explorador[data-panel=mosaico] .campos{display:grid;grid-template-columns:repeat(auto-fit,minmax(84px,1fr));gap:6px}
/* (data-n: cuántos campos se ven; seis caben en una fila, como cinco) */
.cv-explorador.cv-explorador[data-panel=mosaico] .campos[data-n="6"]{grid-template-columns:repeat(6,minmax(0,1fr))}
.cv-explorador.cv-explorador[data-panel=mosaico] .campo.espera:hover{border-color:var(--cv-borde)}
.cv-explorador.cv-explorador[data-panel=mosaico] .campo{flex-direction:column;justify-content:center;gap:8px;height:66px;padding:8px;border:1px solid var(--cv-borde);border-radius:var(--cv-radio-campo,12px);text-align:center}
.cv-explorador.cv-explorador[data-panel=mosaico] .campo .ico--campo{width:21px;height:21px;stroke-width:1.35}
.cv-explorador.cv-explorador[data-panel=mosaico] .campo__rot{max-width:100%;font:600 10px/1 var(--cv-sans);letter-spacing:.1em;text-transform:uppercase}
.cv-explorador.cv-explorador[data-panel=mosaico] .campo__val{display:none;max-width:100%;font:500 12px/1.1 var(--cv-sans)}
.cv-explorador.cv-explorador[data-panel=mosaico] .campo .ico--flecha{display:none}
.cv-explorador.cv-explorador[data-panel=mosaico] .campo__quitar{position:absolute;top:4px;right:4px;margin:0}
.cv-explorador.cv-explorador[data-panel=mosaico] .campo:hover{border-color:var(--cv-tinta)}
.cv-explorador.cv-explorador[data-panel=mosaico] .campo.on{background:var(--cv-tinta);border-color:var(--cv-tinta);color:var(--cv-crema)}
.cv-explorador.cv-explorador[data-panel=mosaico] .campo.on .campo__rot{display:none}
.cv-explorador.cv-explorador[data-panel=mosaico] .campo.on .campo__val{display:block}
.cv-explorador.cv-explorador[data-panel=mosaico] .mis-boton{height:34px;border:0;padding:0 14px 0 12px;background:color-mix(in srgb,var(--cv-rojo) 10%,transparent)}
.cv-explorador.cv-explorador[data-panel=mosaico] .mis-boton svg path{stroke:var(--cv-rojo)}
.cv-explorador.cv-explorador[data-panel=mosaico] .mis-boton:hover{background:color-mix(in srgb,var(--cv-rojo) 16%,transparent)}
.cv-explorador.cv-explorador[data-panel=mosaico] .mis-boton.on{background:var(--cv-rojo);color:var(--cv-crema)}
.cv-explorador.cv-explorador[data-panel=mosaico] .mis-boton.on svg path{fill:var(--cv-crema);stroke:var(--cv-crema)}
.cv-explorador.cv-explorador[data-panel=mosaico] .mis-boton.on small{background:var(--cv-crema);color:var(--cv-rojo)}
.cv-explorador.cv-explorador[data-panel=mosaico] .modo{border:0;padding:3px;gap:2px;background:color-mix(in srgb,var(--cv-tinta) 6%,transparent)}
.cv-explorador.cv-explorador[data-panel=mosaico] .modo button{height:28px;padding:0 9px;color:var(--cv-texto)}
.cv-explorador.cv-explorador[data-panel=mosaico] .modo button span{display:none}
.cv-explorador.cv-explorador[data-panel=mosaico] .modo button.on{background:var(--cv-crema);color:var(--cv-tinta);box-shadow:0 1px 3px color-mix(in srgb,var(--cv-tinta) 20%,transparent)}
.cv-explorador.cv-explorador[data-panel=mosaico] .modo button.on span{display:inline}
.cv-explorador.cv-explorador[data-panel=mosaico] .dianoche{position:relative;padding:3px;border-radius:var(--cv-radio-boton,999px);background:color-mix(in srgb,var(--cv-tinta) 6%,transparent)}
.cv-explorador.cv-explorador[data-panel=mosaico] .dianoche::before{content:"";position:absolute;top:3px;left:3px;width:28px;height:28px;border-radius:var(--cv-radio-boton,50%);background:var(--cv-tinta);transition:transform .45s var(--cv-curva)}
.cv-explorador.cv-explorador[data-panel=mosaico][data-escena=noche] .dianoche::before{transform:translateX(28px)}
.cv-explorador.cv-explorador[data-panel=mosaico] .dianoche button{position:relative;z-index:1;width:28px;height:28px;border-radius:var(--cv-radio-boton,50%)}
.cv-explorador.cv-explorador[data-panel=mosaico] .dianoche button.on{color:var(--cv-crema)}
.cv-explorador.cv-explorador[data-panel=mosaico] .dianoche button:not(.on):hover{color:var(--cv-tinta)}
/* seis campos en una fila necesitan unos 80 px cada uno: con menos, en dos filas de tres */
@container cv-filtros (max-width:500px){
  .cv-explorador.cv-explorador[data-panel=mosaico] .campos[data-n="6"]{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@container cv-filtros (max-width:420px){
  .cv-explorador.cv-explorador[data-panel=mosaico] .campos{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
  .cv-explorador.cv-explorador[data-panel=mosaico] .campos[data-n="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}
  .cv-explorador.cv-explorador[data-panel=mosaico] .campos[data-n="6"]{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cv-explorador.cv-explorador[data-panel=mosaico] .campo{height:60px;padding:6px 4px;gap:7px}
  .cv-explorador.cv-explorador[data-panel=mosaico] .campo__rot{font-size:9.5px;letter-spacing:.05em}
  .cv-explorador.cv-explorador[data-panel=mosaico] .campo__val{font-size:11px}
}
@media (prefers-reduced-motion:reduce){.cv-explorador.cv-explorador[data-panel=mosaico] .dianoche::before{transition:none}}

/* ── La lista ──────────────────────────────────────────────────────────── */
.cv-explorador.cv-explorador .lista{padding-top:8px}
.cv-explorador.cv-explorador .grupo{padding:28px 0 4px;display:flex;align-items:baseline;gap:12px;border-bottom:1px solid var(--cv-borde);margin-bottom:6px}
.cv-explorador.cv-explorador .grupo h3{font:var(--cv-didona-estilo,italic) var(--cv-didona-peso,500) 24px/1.1 var(--cv-didona);margin:0;letter-spacing:-.01em;color:var(--cv-tinta)}
.cv-explorador.cv-explorador .grupo small{font:600 11.5px/1.2 var(--cv-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--cv-texto)}
.cv-explorador.cv-explorador .grupo em{font-style:normal;margin-left:auto;font:400 13px/1 var(--cv-sans);color:var(--cv-texto)}
.cv-explorador.cv-explorador .vino{display:grid;grid-template-columns:1fr auto;gap:4px 24px;align-items:baseline;padding:11px 0 11px 22px;border:0;background:none;width:100%;text-align:left;position:relative;border-bottom:1px solid transparent}
.cv-explorador.cv-explorador .vino::before{content:"";position:absolute;left:0;top:19px;width:8px;height:8px;border-radius:50%;border:1px solid var(--cv-tinta);background-image:linear-gradient(var(--cv-tinta),var(--cv-tinta));background-repeat:no-repeat;background-size:0% 100%;background-position:right center;transition:background-size .5s var(--cv-curva),background-position 0s .5s}
.cv-explorador.cv-explorador .fila:hover .vino::before,.cv-explorador.cv-explorador .vino.activo::before{background-size:100% 100%;background-position:left center;transition:background-size .5s var(--cv-curva),background-position 0s}
/* el punto delante de cada vino es de El Churra: en otra web (data-punto=no,
   lo decide Caracool en Bodega) no hay punto, el vino va pegado a la
   izquierda y lo que marca la fila al pasar es su fondo suave */
.cv-explorador.cv-explorador[data-punto=no] .vino{padding-left:0}
.cv-explorador.cv-explorador[data-punto=no] .vino::before{display:none}
.cv-explorador.cv-explorador[data-punto=no] .subgrupo{margin-left:0}
.cv-explorador.cv-explorador .vino.activo .vino__nombre{color:var(--cv-rojo)}
.cv-explorador.cv-explorador .vino__nombre{grid-column:1;grid-row:1;font:500 16px/1.3 var(--cv-sans);color:var(--cv-tinta);transition:color .3s ease}
.cv-explorador.cv-explorador .vino__nombre span{font-weight:var(--cv-peso-fino,300);color:var(--cv-texto);margin-left:8px}
.cv-explorador.cv-explorador .vino__nombre em{font:600 10px/1 var(--cv-sans);font-style:normal;letter-spacing:.08em;text-transform:uppercase;color:var(--cv-texto);border:1px solid var(--cv-borde);border-radius:999px;padding:3px 7px;margin-left:10px;vertical-align:2px}
.cv-explorador.cv-explorador .vino__nombre em.rp,.cv-explorador.cv-explorador .vino__nombre em.pn{color:var(--cv-rojo);border-color:currentColor;opacity:.85}
.cv-explorador.cv-explorador .vino__nombre em.rp+em.pn{margin-left:6px}
.cv-explorador.cv-explorador .vino__datos{grid-column:1;grid-row:2;font:var(--cv-peso-fino,300) 13.5px/1.4 var(--cv-sans);color:var(--cv-texto)}
/* la ubicación en bodega: el número o las letras que la carta pone delante
   de cada vino. Es para la sala, no para el cliente: pequeño y apagado */
.cv-explorador.cv-explorador .sitio{display:inline-block;margin-left:10px;padding:2px 5px 1px;border:1px solid var(--cv-borde);border-radius:3px;font:500 10.5px/1 ui-monospace,"SF Mono",Menlo,Consolas,monospace;letter-spacing:.05em;color:var(--cv-texto);opacity:.6;vertical-align:1px;white-space:nowrap}
.cv-explorador.cv-explorador .fila:hover .sitio,.cv-explorador.cv-explorador .vino.activo .sitio{opacity:.85}
.cv-explorador.cv-explorador .vino__datos b{font-weight:500}
.cv-explorador.cv-explorador .vino__precio{grid-column:2;grid-row:1/3;align-self:center;font:500 17px/1 var(--cv-sans);font-variant-numeric:tabular-nums;color:var(--cv-tinta);white-space:nowrap}
.cv-explorador.cv-explorador.sin-precio .vino__precio{display:none}
.cv-explorador.cv-explorador .vacio{padding:64px 0;text-align:center;color:var(--cv-texto);font:var(--cv-peso-fino,300) 16px/1.5 var(--cv-sans)}
.cv-explorador.cv-explorador .lista.oculto + .ficha + .lista__pie{display:none}
.cv-explorador.cv-explorador .lista__pie{margin:40px 0 0;padding-top:16px;border-top:1px solid var(--cv-borde);font:400 12.5px/1.5 var(--cv-sans);color:var(--cv-texto)}
.cv-explorador.cv-explorador .subgrupo{margin:18px 0 2px 22px;font:600 11px/1.2 var(--cv-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--cv-texto)}

/* ── Favoritos ───────────────────────────────────────────────────────────
 * Un corazón en cada fila y en la ficha. Se guardan en el navegador de esa
 * persona, sin cuenta. «Mis vinos» los enseña, y «Compartir» hace un enlace
 * con esa selección para mandarla a la mesa o enseñársela al camarero.
 */
/* la fila entera, del punto al corazón, es lo que se enciende al pasar y
   con la ficha abierta; se sale 12 px por los lados para leerse como una
   banda y no como una caja recortada al texto */
/* sin transición: con ella, al pasar rápido de un vino a otro (o al mover
   la lista con la rueda bajo el ratón) la fila anterior seguía encendida
   un instante y la banda parecía saltar arriba y volver */
.cv-explorador.cv-explorador .fila{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px;margin:0 -12px;padding:0 12px;border-radius:2px}
/* Con 459 filas, el navegador no calcula ni pinta las que están fuera de la
   pantalla (cada una se estima en 67 px, o 86 en el móvil, hasta que se ve y
   recuerda su alto). La fila que tiene el foco se pinta entera, para que el
   anillo no se recorte. */
.cv-explorador.cv-explorador .fila{content-visibility:auto;contain-intrinsic-block-size:auto 67px}
.cv-explorador.cv-explorador .fila:focus-within{content-visibility:visible}
@media (max-width:640px){.cv-explorador.cv-explorador .fila{contain-intrinsic-block-size:auto 86px}}
.cv-explorador.cv-explorador .fila:hover,.cv-explorador.cv-explorador .fila:has(.vino.activo){background:color-mix(in srgb,var(--cv-tinta) 4%,transparent)}
.cv-explorador.cv-explorador .corazon{width:34px;height:34px;border:0;background:none;padding:0;display:inline-flex;align-items:center;justify-content:center;color:var(--cv-borde);border-radius:50%;transition:color .25s ease,transform .25s var(--cv-curva)}
.cv-explorador.cv-explorador .corazon svg{width:18px;height:18px;display:block}
.cv-explorador.cv-explorador .corazon svg path{fill:none;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round;transition:fill .25s ease}
.cv-explorador.cv-explorador .corazon:hover{color:var(--cv-rojo)}
.cv-explorador.cv-explorador .corazon.on{color:var(--cv-rojo)}
.cv-explorador.cv-explorador .corazon.on svg path{fill:currentColor}
.cv-explorador.cv-explorador .corazon.late{animation:cv-corazon-late .5s var(--cv-curva)}
@keyframes cv-corazon-late{0%{transform:scale(1)}40%{transform:scale(1.35)}100%{transform:scale(1)}}
/* la cifra de la gente: cuántas personas han guardado el vino, a partir de
   un mínimo; va pegada al corazón, pequeña y apagada, para no competir con
   el precio */
.cv-explorador.cv-explorador .corazon__n{display:none;font:500 12px/1 var(--cv-sans);font-variant-numeric:tabular-nums;letter-spacing:0;color:var(--cv-texto)}
.cv-explorador.cv-explorador .corazon.con-n{width:auto;min-width:34px;padding:0 6px 0 6px;gap:4px;border-radius:999px}
.cv-explorador.cv-explorador .corazon.con-n .corazon__n{display:inline}
.cv-explorador.cv-explorador .corazon.on .corazon__n{color:var(--cv-rojo)}
/* «Más guardados», delante de Mis vinos, con el mismo aspecto. Los dos
   en una línea; si no caben con la vista y el día y la noche, estos bajan
   a la línea de abajo */
.cv-explorador.cv-explorador .filtros__mis{gap:8px}
.cv-explorador.cv-explorador .mis-boton{white-space:nowrap}
.cv-explorador.cv-explorador .filtros__vista{flex-wrap:wrap;row-gap:10px}
.cv-explorador.cv-explorador .gente-boton{order:-1}
.cv-explorador.cv-explorador .gente-boton svg path{stroke-linejoin:miter}
/* «Ayúdame a elegir»: abre «Tres toques» en una capa encima del explorador.
   Va detrás de Mis vinos, lleno con el acento: no filtra la lista, pregunta.
   (Con la raíz delante para ganar a las pieles del panel.) */
.cv-explorador.cv-explorador[data-cv-root] .mis-boton.elegir-boton{background:var(--cv-rojo);border:1px solid var(--cv-rojo);color:var(--cv-crema)}
.cv-explorador.cv-explorador[data-cv-root] .mis-boton.elegir-boton:hover{background:var(--cv-tinta);border-color:var(--cv-tinta);color:var(--cv-crema)}
.cv-explorador.cv-explorador[data-cv-root] .mis-boton.elegir-boton svg path{fill:none;stroke:currentColor}
.cv-explorador.cv-explorador[data-cv-root] .mis-boton.elegir-boton:focus-visible{outline:2px solid var(--cv-tinta);outline-offset:2px}
/* en la piel «ficha» los botones son pestañas sin relleno: este no */
.cv-explorador.cv-explorador[data-cv-root][data-panel=ficha] .mis-boton.elegir-boton{padding:7px 14px 8px 12px;border-radius:var(--cv-radio-boton,999px);box-shadow:none}
/* La capa: fija, debajo de la cabecera de la web (--cabecera), con su
   propio scroll; la página de detrás no se mueve mientras está abierta. */
.cv-explorador.cv-explorador .elegir{position:fixed;left:0;right:0;bottom:0;top:var(--cv-cabecera,0px);z-index:40;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;background:var(--cv-crema);scrollbar-width:thin;scrollbar-color:var(--cv-borde) transparent}
/* (backwards y no both: una animación de transform que se queda puesta
   convierte la capa en el marco de lo fijo, y la X se iría con ella) */
.cv-explorador.cv-explorador .elegir.entra{animation:cv-elegir-entra .45s var(--cv-curva) backwards}
@keyframes cv-elegir-entra{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
/* Si la cabecera de la web es fija, transparente y está por encima (la de El
   Churra: z-index 99), la franja que hay debajo de ella también es de la
   capa; sin esto, la página de detrás asoma entre el menú y la capa. Es un
   fondo fijo y detrás del contenido: la capa y su scroll siguen empezando
   donde acaba la cabecera. */
.cv-explorador.cv-explorador[data-cab=fija] .elegir::before{content:"";position:fixed;left:0;right:0;top:0;height:var(--cv-cabecera,0px);background:var(--cv-crema);z-index:-1;pointer-events:none}
.cv-explorador.cv-explorador .elegir > .cv-toques{min-height:100%;padding-top:76px}
.cv-explorador.cv-explorador .elegir__cerrar{position:fixed;top:calc(var(--cv-cabecera,0px) + 16px);right:16px;z-index:3;display:inline-flex;align-items:center;gap:8px;height:40px;margin:0;padding:0 16px 0 12px;border:1px solid var(--cv-tinta);border-radius:var(--cv-radio-boton,999px);background:var(--cv-crema);color:var(--cv-tinta);font:500 13px/1 var(--cv-sans);letter-spacing:.15px;text-transform:none;box-shadow:none;min-height:0;cursor:pointer;transition:background .25s ease,color .25s ease}
.cv-explorador.cv-explorador .elegir__cerrar:hover{background:var(--cv-tinta);color:var(--cv-crema)}
.cv-explorador.cv-explorador .elegir__cerrar:focus-visible{outline:2px solid var(--cv-tinta);outline-offset:2px}
.cv-explorador.cv-explorador .elegir__cerrar svg{width:16px;height:16px;flex:none}
.cv-explorador.cv-explorador .elegir__cerrar svg path{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
@media (max-width:600px){
  .cv-explorador.cv-explorador .elegir__cerrar{width:40px;padding:0;justify-content:center}
  .cv-explorador.cv-explorador .elegir__cerrar span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .cv-explorador.cv-explorador .elegir > .cv-toques{padding-top:68px}
}
@media (prefers-reduced-motion:reduce){.cv-explorador.cv-explorador .elegir.entra{animation:none}}
/* «Mis vinos» es un sitio, no un chip más: un botón fijo al final de la fila
   de los desplegables, junto a Mapa / Lista, siempre a la vista (también
   sin vinos guardados), con el corazón y la cuenta. Abre la vista de mis
   vinos: la lista con solo los guardados y una cabecera propia. */
.cv-explorador.cv-explorador .mis-boton{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--cv-tinta);background:transparent;border-radius:999px;padding:6px 14px 6px 12px;font:500 13px/1 var(--cv-sans);letter-spacing:.15px;color:var(--cv-tinta);transition:background .25s ease,color .25s ease}
.cv-explorador.cv-explorador .mis-boton svg{width:14px;height:14px;flex:none}
.cv-explorador.cv-explorador .mis-boton svg path{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;transition:fill .25s ease,stroke .25s ease}
.cv-explorador.cv-explorador .mis-boton.hay svg path{fill:var(--cv-rojo);stroke:var(--cv-rojo)}
.cv-explorador.cv-explorador .mis-boton small{font:600 11px/1 var(--cv-sans);min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--cv-tinta);color:var(--cv-crema);display:inline-flex;align-items:center;justify-content:center}
.cv-explorador.cv-explorador .mis-boton:not(.hay) small{display:none}
.cv-explorador.cv-explorador .mis-boton:hover{background:var(--cv-crema2)}
.cv-explorador.cv-explorador .mis-boton.on{background:var(--cv-tinta);color:var(--cv-crema)}
.cv-explorador.cv-explorador .mis-boton.on small{background:var(--cv-crema);color:var(--cv-tinta)}
.cv-explorador.cv-explorador .mis-boton.on svg path{fill:var(--cv-crema);stroke:var(--cv-crema)}
.cv-explorador.cv-explorador .mis-boton.late svg{animation:cv-corazon-late .5s var(--cv-curva)}
/* la cabecera de la vista de mis vinos, y el vacío */
.cv-explorador.cv-explorador .mis-cab{display:flex;align-items:flex-end;justify-content:space-between;gap:12px 16px;flex-wrap:wrap;padding:18px 0 14px;border-bottom:1px solid var(--cv-borde)}
.cv-explorador.cv-explorador .mis-cab h3{font:var(--cv-didona-estilo,italic) var(--cv-didona-peso,500) 28px/1.05 var(--cv-didona);margin:0 0 6px;letter-spacing:-.01em;color:var(--cv-tinta)}
.cv-explorador.cv-explorador .mis-cab p{margin:0;font:var(--cv-peso-fino,300) 13px/1.45 var(--cv-sans);color:var(--cv-texto);max-width:38ch}
.cv-explorador.cv-explorador .mis-cab .mis-acciones{display:flex;align-items:center;gap:8px 14px;flex-wrap:wrap;margin-left:auto}
.cv-explorador.cv-explorador .mis-vacio{padding:40px 0 52px;text-align:center;font:var(--cv-peso-fino,300) 15px/1.55 var(--cv-sans);color:var(--cv-texto);max-width:34ch;margin:0 auto}
.cv-explorador.cv-explorador .mis-vacio svg{width:30px;height:30px;display:block;margin:0 auto 14px;color:var(--cv-arena)}
.cv-explorador.cv-explorador .mis-vacio svg path{fill:currentColor;stroke:var(--cv-ocre);stroke-width:1.2;stroke-linejoin:round}
.cv-explorador.cv-explorador .mis-vacio b{display:block;font:var(--cv-didona-estilo,italic) var(--cv-didona-peso,500) 22px/1.1 var(--cv-didona);color:var(--cv-tinta);margin-bottom:8px}
.cv-explorador.cv-explorador .compartir{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--cv-tinta);background:transparent;border-radius:999px;padding:6px 12px;font:500 12.5px/1 var(--cv-sans);color:var(--cv-tinta);transition:background .25s ease,color .25s ease}
.cv-explorador.cv-explorador .compartir:hover{background:var(--cv-tinta);color:var(--cv-crema)}
.cv-explorador.cv-explorador .compartida{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:16px 0 4px;padding:14px 16px;border:1px solid var(--cv-borde);border-radius:2px;font:400 14px/1.4 var(--cv-sans);color:var(--cv-texto)}
.cv-explorador.cv-explorador .compartida b{font:var(--cv-didona-estilo,italic) var(--cv-didona-peso,500) 20px/1.1 var(--cv-didona);color:var(--cv-tinta)}
.cv-explorador.cv-explorador .compartida .compartir{margin-left:auto}
.cv-explorador.cv-explorador .aviso-flotante{position:fixed;left:50vw;bottom:28px;transform:translate(-50%,12px);background:var(--cv-tinta);color:var(--cv-crema);font:500 13px/1 var(--cv-sans);padding:11px 16px;border-radius:999px;opacity:0;pointer-events:none;transition:opacity .25s ease,transform .35s var(--cv-curva);z-index:20}
.cv-explorador.cv-explorador .aviso-flotante.ver{opacity:1;transform:translate(-50%,0)}
.cv-explorador.cv-explorador .ficha__cabeza .corazon{align-self:center;margin-left:-4px}
.cv-explorador.cv-explorador .ficha__derecha{display:flex;align-items:center;gap:10px}

/* ── La ficha: todo lo esencial en tres líneas ─────────────────────────
 * Nombre y precio en la misma línea; debajo bodega, añada y uvas seguidas;
 * y los atajos como chips pequeños. Quien solo quiere saber qué es y cuánto
 * cuesta lo tiene de un vistazo; quien quiere tirar del hilo, también.
 */
.cv-explorador.cv-explorador .ficha{padding:12px 0 0;animation:cv-ficha-entra .6s var(--cv-curva) both}
@keyframes cv-ficha-entra{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.cv-explorador.cv-explorador .ficha__volver{background:none;border:0;padding:0 0 18px;font:500 13px/1 var(--cv-sans);color:var(--cv-rojo);display:inline-flex;align-items:center;gap:8px}
.cv-explorador.cv-explorador .ficha__volver::before{content:"";width:8px;height:8px;border-radius:50%;border:1px solid var(--cv-rojo);background:var(--cv-rojo)}
.cv-explorador.cv-explorador .ficha__rotulo{font:600 11.5px/1.2 var(--cv-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--cv-texto);margin:0 0 8px}
.cv-explorador.cv-explorador .ficha__cabeza{display:flex;align-items:baseline;justify-content:space-between;gap:24px;padding-bottom:10px;border-bottom:1px solid var(--cv-borde)}
.cv-explorador.cv-explorador .ficha h2{font:var(--cv-didona-estilo,italic) var(--cv-didona-peso,500) clamp(28px,3vw,40px)/1.05 var(--cv-didona);letter-spacing:-.01em;margin:0}
.cv-explorador.cv-explorador .ficha h2 span{font:var(--cv-peso-fino,300) .55em/1 var(--cv-sans);color:var(--cv-texto);margin-left:10px;letter-spacing:0}
.cv-explorador.cv-explorador .ficha__precio{font:500 24px/1 var(--cv-sans);font-variant-numeric:tabular-nums;white-space:nowrap}
.cv-explorador.cv-explorador .ficha__precio small{font:var(--cv-peso-fino,300) 12px/1 var(--cv-sans);color:var(--cv-texto);margin-left:5px}
/* sin precio en la carta («C.D.»): «Consultar disponibilidad» */
.cv-explorador.cv-explorador .ficha__precio--consultar{font:400 13px/1.3 var(--cv-sans);white-space:normal;text-align:right;color:var(--cv-texto);max-width:12em}
.cv-explorador.cv-explorador .vino__precio .consultar{font:400 12px/1 var(--cv-sans);color:var(--cv-texto);letter-spacing:.02em}
.cv-explorador.cv-explorador.sin-precio .ficha__precio{display:none}
.cv-explorador.cv-explorador .ficha__datos{margin:10px 0 0;font:400 15px/1.55 var(--cv-sans);color:var(--cv-texto)}
.cv-explorador.cv-explorador .ficha__datos b{font-weight:500;color:var(--cv-tinta)}
.cv-explorador.cv-explorador .ficha__datos i{font-style:normal;opacity:.45;margin:0 6px}
.cv-explorador.cv-explorador .ficha__mas{margin-top:16px;display:flex;flex-wrap:wrap;gap:6px}
.cv-explorador.cv-explorador .ficha__mas button{border:1px solid var(--cv-borde);background:transparent;border-radius:999px;padding:6px 12px 6px 24px;font:500 12.5px/1 var(--cv-sans);color:var(--cv-tinta);position:relative;text-align:left;transition:border-color .25s ease}
.cv-explorador.cv-explorador .ficha__mas button::before{content:"";position:absolute;left:10px;top:50%;margin-top:-4px;width:8px;height:8px;border-radius:50%;border:1px solid var(--cv-rojo);background-image:linear-gradient(var(--cv-rojo),var(--cv-rojo));background-repeat:no-repeat;background-size:0% 100%;background-position:right center;transition:background-size .5s var(--cv-curva)}
.cv-explorador.cv-explorador .ficha__mas button:hover{border-color:var(--cv-tinta)}
.cv-explorador.cv-explorador .ficha__mas button:hover::before{background-size:100% 100%;background-position:left center}
/* los puntos de la ficha («Volver a la lista» y los botones de «Los otros…»)
   son el mismo gesto de El Churra que el punto de la lista: con data-punto=no
   no salen, y el botón queda centrado */
.cv-explorador.cv-explorador[data-punto=no] .ficha__volver::before,.cv-explorador.cv-explorador[data-punto=no] .ficha__mas button::before{display:none}
.cv-explorador.cv-explorador[data-punto=no] .ficha__mas button{padding-left:12px}
.cv-explorador.cv-explorador .ficha__nota{margin-top:22px;font:var(--cv-peso-fino,300) 12.5px/1.5 var(--cv-sans);color:var(--cv-texto);opacity:.7}
.cv-explorador.cv-explorador .ficha__nota code{font:500 11.5px/1 ui-monospace,Menlo,monospace;background:var(--cv-crema2);padding:2px 6px;border-radius:3px}
@media (max-width:600px){.cv-explorador.cv-explorador .ficha__cabeza{flex-wrap:wrap;gap:6px 16px}}

@media (prefers-reduced-motion:reduce){
  .cv-explorador.cv-explorador .globo .aro.late{animation:none}
  .cv-explorador.cv-explorador .ficha{animation:none}
  .cv-explorador.cv-explorador .vino::before,.cv-explorador.cv-explorador .ficha__mas button::before{transition:none}
}

/* En la web, el contenedor de Elementor va a ancho completo y sin relleno:
   la escena se da su propio aire en «columnas» y llena la pantalla en
   «mundo». Con «mundo», el hero de foto de la página se apaga (lleva la
   clase cv-hero-foto). Lo decide el propio bloque, sin que PHP toque el
   body: así las páginas que no llevan el explorador no leen nada. La
   segunda regla es la clase de siempre, por si alguien la puso a mano. */
body:has(.cv-explorador[data-diseno=mundo]) .cv-hero-foto{display:none!important}
.cv-diseno-mundo .cv-hero-foto{display:none!important}
/* Con el mapa (escritorio) la escena queda fija y la página no se
   desplaza: el pie de la web se apaga y la rueda mueve la lista. En modo
   Lista el pie vuelve y la página se desplaza como siempre. Va por :has
   para no depender de una clase en el body que ponga el script. */
@media (min-width:901px){
  body:has(.cv-explorador[data-diseno=mundo]:not([data-encaje=bloque]):is([data-modo=mapa],[data-modo=red])){overflow:hidden}
  body:has(.cv-explorador[data-diseno=mundo]:not([data-encaje=bloque]):is([data-modo=mapa],[data-modo=red])) .elementor-location-footer,
  body:has(.cv-explorador[data-diseno=mundo]:not([data-encaje=bloque]):is([data-modo=mapa],[data-modo=red])) footer[data-elementor-type="footer"]{display:none}
}