/* =============================================================================
   busco1abogado — estilos
   -----------------------------------------------------------------------------
   El nombre manda el diseño: esto es un buscador, no un despacho. Por eso va
   en claro, con tipografía neutra y un azul de utilidad, en vez del negro y
   dorado que usan las webs que lista. Quien llega viene con un problema y con
   prisa: primero el buscador, después los filtros y enseguida los resultados.

   Sin dependencias ni compilación: se sube a cPanel y funciona.
   ============================================================================= */

:root{
  --acento:     #1B4DE4;
  --acento-osc: #1438A8;
  --acento-sua: #EEF2FE;
  --tinta:      #12151C;
  --gris:       #5C6470;
  --papel:      #FFFFFF;
  --fondo:      #F5F7FA;
  --borde:      #E2E6ED;
  --ok:         #0F7B4F;
  --sombra:     0 1px 2px rgba(18,21,28,.06), 0 8px 24px rgba(18,21,28,.06);
  --fuente:     'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin: 0; background: var(--papel); color: var(--tinta);
  font-family: var(--fuente); font-size: 16px; line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  *{ transition: none !important; animation: none !important; }
}
.contenedor{ width: 100%; max-width: 1140px; margin: 0 auto; padding: 0 20px; }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.saltar{
  position:absolute; left:-999px; top:0; background:var(--acento); color:#fff;
  padding:.7rem 1rem; z-index:100;
}
.saltar:focus{ left:0; }
a{ color: var(--acento); }
h1,h2,h3{ line-height: 1.2; letter-spacing: -.02em; margin: 0; }

/* ---- Cabecera ---- */
.cabecera{ border-bottom: 1px solid var(--borde); background: var(--papel); position: sticky; top: 0; z-index: 30; }
.cabecera-fila{ display: flex; align-items: center; justify-content: space-between; gap: 1rem; height: 66px; }
.marca{ text-decoration: none; font-weight: 700; font-size: 1.22rem; letter-spacing: -.03em; display: inline-flex; align-items: center; }
.marca-txt{ color: var(--tinta); }
.marca-uno{
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.45em; height: 1.45em; margin: 0 .12em; border-radius: 50%;
  background: var(--acento); color: #fff; font-size: .82em;
}
.menu{ display: flex; gap: 1.4rem; }
.menu a{ color: var(--gris); text-decoration: none; font-size: .95rem; font-weight: 500; }
.menu a:hover{ color: var(--tinta); }

/* ---- Hero ---- */
.hero{ background: linear-gradient(180deg, var(--acento-sua), var(--papel)); padding: 3.4rem 0 2.6rem; }
.antetitulo{ margin: 0 0 .7rem; font-size: .76rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--acento); }
.hero h1{ font-size: clamp(1.8rem, 4.2vw, 2.9rem); font-weight: 700; max-width: 20ch; }
.hero-sub{ margin: 1rem 0 1.8rem; max-width: 62ch; color: var(--gris); font-size: 1.05rem; }

.buscador{ position: relative; max-width: 680px; }
.buscador .lupa{ position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--gris); display: flex; }
.buscador input{
  width: 100%; height: 58px; padding: 0 44px 0 48px; font: inherit; font-size: 1rem;
  border: 1px solid var(--borde); border-radius: 10px; background: var(--papel);
  box-shadow: var(--sombra); color: var(--tinta);
}
.buscador input:focus{ outline: none; border-color: var(--acento); box-shadow: 0 0 0 4px rgba(27,77,228,.14); }
.limpiar{
  position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  width: 30px; height: 30px; border: 0; border-radius: 50%; background: var(--fondo);
  color: var(--gris); font-size: 1.2rem; line-height: 1; cursor: pointer;
}
.sugerencias{ display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-top: 1rem; font-size: .9rem; color: var(--gris); }
.sugerencias button{
  border: 1px solid var(--borde); background: var(--papel); color: var(--tinta);
  border-radius: 999px; padding: .35rem .85rem; font: inherit; font-size: .88rem; cursor: pointer;
}
.sugerencias button:hover{ border-color: var(--acento); color: var(--acento); }

/* ---- Filtros ---- */
.filtros{ background: var(--fondo); border-top: 1px solid var(--borde); border-bottom: 1px solid var(--borde); padding: 1.1rem 0; position: sticky; top: 66px; z-index: 20; }
.filtros-fila{ display: flex; flex-wrap: wrap; gap: 1rem 1.2rem; align-items: end; }
.campo{ display: flex; flex-direction: column; gap: .3rem; min-width: 190px; }
.campo label{ font-size: .78rem; font-weight: 600; color: var(--gris); letter-spacing: .02em; }
.campo select{
  height: 42px; padding: 0 .7rem; font: inherit; font-size: .95rem; color: var(--tinta);
  border: 1px solid var(--borde); border-radius: 8px; background: var(--papel);
}
.campo select:focus{ outline: none; border-color: var(--acento); box-shadow: 0 0 0 3px rgba(27,77,228,.14); }
.campo-check{ flex-direction: row; align-items: center; gap: .5rem; min-width: 0; padding-bottom: .55rem; }
.campo-check input{ width: 18px; height: 18px; accent-color: var(--acento); }
.campo-check label{ font-size: .92rem; font-weight: 500; color: var(--tinta); }
.reset{
  margin-left: auto; margin-bottom: .1rem; border: 0; background: none; color: var(--acento);
  font: inherit; font-size: .92rem; cursor: pointer; text-decoration: underline; text-underline-offset: 3px;
}

/* ---- Resultados ---- */
.resultados{ padding: 2.2rem 0 3rem; }
.resultados-cab{ display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.2rem; flex-wrap: wrap; }
#conteo{ margin: 0; font-weight: 600; }
.campo-orden{ min-width: 170px; }
.rejilla{ display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); align-items: start; }

.tarjeta{
  border: 1px solid var(--borde); border-radius: 12px; background: var(--papel);
  padding: 1.2rem; display: flex; flex-direction: column; gap: .85rem;
  transition: border-color .18s, box-shadow .18s, transform .18s;
}
.tarjeta:hover{ border-color: #C9D3E6; box-shadow: var(--sombra); }
.logo-caja{
  height: 68px; border: 1px solid var(--borde); border-radius: 8px; background: var(--papel);
  display: flex; align-items: center; justify-content: center; padding: .7rem;
}
.logo-caja img{ max-height: 100%; max-width: 78%; object-fit: contain; }
.tarjeta h3{ font-size: 1.08rem; font-weight: 600; }
.dominio{ margin: 0; font-size: .84rem; color: var(--gris); }
.lema{ margin: 0; font-size: .95rem; color: var(--gris); }
.chips{ display: flex; flex-wrap: wrap; gap: .35rem; }
.chip{
  font-size: .78rem; padding: .22rem .6rem; border-radius: 999px;
  background: var(--acento-sua); color: var(--acento-osc); font-weight: 500;
}
.chip-gratis{ background: #E7F6EE; color: var(--ok); }
.acciones{ display: flex; gap: .6rem; margin-top: auto; padding-top: .3rem; flex-wrap: wrap; }
.btn{
  flex: 1 1 130px; text-align: center; height: 42px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 8px; font: inherit; font-size: .93rem; font-weight: 600; cursor: pointer; text-decoration: none;
  border: 1px solid var(--borde); background: var(--papel); color: var(--tinta);
}
.btn:hover{ border-color: #C9D3E6; }
.btn-primario{ background: var(--acento); border-color: var(--acento); color: #fff; }
.btn-primario:hover{ background: var(--acento-osc); border-color: var(--acento-osc); }
.vacio{ padding: 2.5rem 0; text-align: center; color: var(--gris); }

/* ---- Cómo funciona y aviso ---- */
.como{ background: var(--fondo); border-top: 1px solid var(--borde); padding: 3rem 0; }
.como h2, .aviso h2{ font-size: clamp(1.4rem, 2.6vw, 1.9rem); margin-bottom: 1.4rem; }
.pasos{ list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.pasos li{ display: flex; gap: .9rem; align-items: start; }
.pasos span{
  flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; background: var(--acento); color: #fff;
  display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: .92rem;
}
.pasos p{ margin: 0; color: var(--gris); font-size: .96rem; }
.pasos strong{ color: var(--tinta); }
.aviso{ padding: 3rem 0; }
.aviso p{ max-width: 76ch; color: var(--gris); }

/* ---- Pie ---- */
.pie{ background: var(--tinta); color: #fff; padding: 2.2rem 0; }
.pie-marca{ margin: 0 0 .4rem; font-weight: 700; font-size: 1.1rem; }
.pie .marca-txt{ color: #fff; }
.pie-legal{ margin: 0; color: rgba(255,255,255,.62); font-size: .88rem; max-width: 70ch; }

/* ---- Ficha ---- */
.ficha-fondo{
  position: fixed; inset: 0; z-index: 60; background: rgba(18,21,28,.55);
  display: flex; align-items: center; justify-content: center; padding: 1.2rem;
}
/* Sin esto, el display:flex de arriba gana al atributo hidden y la capa queda
   invisible pero tapando toda la página: nada sería pulsable. */
[hidden]{ display: none !important; }
.ficha{
  background: var(--papel); border-radius: 14px; max-width: 640px; width: 100%;
  max-height: 86vh; overflow: auto; padding: 1.8rem; box-shadow: 0 30px 70px rgba(18,21,28,.3);
}
.ficha h2{ font-size: 1.5rem; margin-bottom: .2rem; }
.ficha .dominio{ margin-bottom: 1rem; }
.ficha .logo-caja{ margin-bottom: 1.1rem; height: 84px; }
.ficha dl{ display: grid; grid-template-columns: auto 1fr; gap: .4rem 1rem; margin: 1.2rem 0 0; font-size: .95rem; }
.ficha dt{ color: var(--gris); }
.ficha dd{ margin: 0; }
.ficha-pie{ display: flex; gap: .7rem; justify-content: flex-end; margin-top: 1.6rem; padding-top: 1.2rem; border-top: 1px solid var(--borde); flex-wrap: wrap; }
.cerrar{ margin-right: auto; border: 0; background: none; color: var(--gris); font: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 640px){
  .menu{ display: none; }
  .filtros{ position: static; }
  .campo{ min-width: 0; flex: 1 1 100%; }
  .reset{ margin-left: 0; }
  .rejilla{ grid-template-columns: 1fr; }
}



/* =============================================================================
   Afinado del diseño
   -----------------------------------------------------------------------------
   Mismo planteamiento, mejor acabado: la cabecera se queda arriba al bajar, el
   buscador gana peso con sombra y foco visible, las tarjetas se levantan al
   pasar por encima y los filtros parecen una barra de controles y no cajas
   sueltas. Nada decorativo: quien llega viene con un problema y con prisa.
   ============================================================================= */

.cabecera{ position:sticky; top:0; z-index:40;
           background:rgba(255,255,255,.9); backdrop-filter:saturate(180%) blur(10px) }

.hero{ padding:56px 0 44px }
.hero h1{ letter-spacing:-.025em; line-height:1.08 }
.hero-sub{ font-size:17.5px; max-width:58ch }

/* El buscador manda */
.buscador{ box-shadow:0 1px 2px rgba(18,21,28,.06), 0 8px 24px rgba(27,77,228,.07);
           transition:box-shadow .18s ease, border-color .18s ease }
.buscador:focus-within{ border-color:var(--acento);
           box-shadow:0 0 0 4px var(--acento-sua), 0 10px 28px rgba(27,77,228,.14) }

/* Franja de confianza */
.confianza{ display:flex; gap:28px; flex-wrap:wrap; margin-top:26px; padding-top:20px;
            border-top:1px solid var(--linea); font-size:14px; color:var(--gris) }
.confianza b{ color:var(--tinta); font-weight:600 }

/* Filtros como barra de controles */
.filtros{ background:#fff; border:1px solid var(--linea); border-radius:12px;
          box-shadow:0 1px 2px rgba(18,21,28,.04) }
.campo select{ border-radius:8px; transition:border-color .15s ease }
.campo select:hover{ border-color:#C6CCD8 }

/* Las tarjetas se levantan */
.tarjeta{ border-radius:14px; transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease }
.tarjeta:hover{ transform:translateY(-3px); border-color:#C9D2E6;
                box-shadow:0 10px 30px rgba(18,21,28,.09) }
.logo-caja{ border-radius:10px }
.tarjeta h3{ letter-spacing:-.015em }
.chip{ border-radius:999px }

/* Botones con algo más de peso */
.btn{ border-radius:10px; transition:transform .15s ease, box-shadow .15s ease, background .15s ease }
.btn-primario{ box-shadow:0 1px 2px rgba(20,56,168,.2) }
.btn-primario:hover{ transform:translateY(-1px); box-shadow:0 6px 18px rgba(27,77,228,.28) }

/* Panel de ficha con sombra más suave */
.ficha{ border-radius:16px; box-shadow:0 24px 60px rgba(18,21,28,.22) }

@media (prefers-reduced-motion: reduce){
  .tarjeta,.btn{ transition:none }
  .tarjeta:hover,.btn-primario:hover{ transform:none }
}

/* Monograma para las fichas sin logotipo */
.monograma{ display:flex; align-items:center; justify-content:center; width:100%; height:100%;
  font:700 26px/1 'Inter',system-ui,sans-serif; letter-spacing:.06em; color:#F0C063 }

/* Logotipos cuadrados: con el 78% de ancho general quedaban diminutos dentro de
   una caja pensada para bandas anchas. Aquí mandan el alto. */
/* Los logotipos cuadrados ya traen su propio fondo redondeado. Metidos en la
   caja blanca con borde quedaba un recuadro dentro de otro, y el icono se veía
   diminuto. Para esos se retira la caja y el logotipo va a tamaño completo. */
.logo-caja.caja-cuadrada{ padding:0; border:0; background:transparent }
.logo-caja img.logo-cuadrado{ max-width:none; max-height:100%; height:100%; width:auto; border-radius:10px }

/* =============================================================================
   Fichas de despacho y secciones de datos
   ============================================================================= */
.migas{ font-size:13.5px; color:var(--gris); padding:20px 0 6px }
.migas a{ color:var(--gris) }

.desp-cab{ display:flex; gap:26px; align-items:center; padding:14px 0 30px; border-bottom:1px solid var(--linea); flex-wrap:wrap }
.desp-logo{ width:190px; height:96px; flex:0 0 auto }
.desp-cab h1{ font-size:clamp(26px,3.4vw,36px); letter-spacing:-.025em; margin:0 0 6px }
.desp-lema{ color:var(--gris); font-size:16.5px; margin:0 0 4px }
.desp-dominio{ font-size:14px; color:var(--gris); margin:0 0 14px }
.desp-acciones{ display:flex; gap:10px; flex-wrap:wrap }

.desp-rejilla{ display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:40px; padding:30px 0 50px }
.bloque{ margin-bottom:30px }
.bloque h2{ font-size:21px; letter-spacing:-.015em; margin:0 0 .6rem }
.bloque p{ color:#3C4350; margin:0; max-width:68ch }
.lista-esp{ list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:8px }
.lista-esp li{ background:var(--acento-sua); color:var(--acento); border-radius:999px; padding:7px 14px; font-size:14px; font-weight:500 }

.caja-lado{ border:1px solid var(--linea); border-radius:14px; padding:18px; margin-bottom:18px; background:#fff }
.caja-lado h3{ font-size:13px; text-transform:uppercase; letter-spacing:.09em; color:var(--gris); margin:0 0 12px }
.datos{ margin:0 }
.datos div{ display:flex; justify-content:space-between; gap:12px; padding:8px 0; border-bottom:1px solid var(--linea) }
.datos div:last-child{ border-bottom:0 }
.datos dt{ color:var(--gris); font-size:14px; margin:0 }
.datos dd{ margin:0; font-size:14px; font-weight:500; text-align:right }
.mini-desp{ display:block; padding:10px 0; border-bottom:1px solid var(--linea); color:var(--tinta); text-decoration:none }
.mini-desp:last-child{ border-bottom:0 }
.mini-desp b{ display:block; font-size:15px }
.mini-desp span{ display:block; font-size:13px; color:var(--gris) }
.nota-lado{ font-size:13px; color:var(--gris); line-height:1.5 }

/* Formulario */
.form-caja{ background:#F7F9FC; border:1px solid var(--linea); border-radius:16px; padding:26px; margin-top:34px }
.form-caja h2{ font-size:21px; margin:0 0 .3rem }
.form-nota{ color:var(--gris); font-size:14.5px; margin:0 0 18px }
.campos{ display:grid; grid-template-columns:1fr 1fr; gap:14px }
.campo-f{ display:flex; flex-direction:column; gap:6px }
.campo-f.ancho{ grid-column:1/-1 }
.campo-f label{ font-size:13.5px; font-weight:600 }
.campo-f input,.campo-f textarea{ border:1px solid var(--linea); border-radius:9px; padding:11px 13px;
  font:inherit; font-size:16px; min-height:46px; background:#fff; width:100% }
.campo-f textarea{ min-height:120px; resize:vertical }
.campo-f input:focus,.campo-f textarea:focus{ outline:none; border-color:var(--acento); box-shadow:0 0 0 3px var(--acento-sua) }
.consent{ display:flex; gap:9px; align-items:flex-start; font-size:13.5px; color:var(--gris) }
.consent input{ width:17px; height:17px; min-height:0; margin-top:3px; accent-color:var(--acento) }
.trampa{ position:absolute; left:-9999px }

/* Secciones de datos */
.tit-seccion{ font-size:clamp(26px,3.4vw,34px); letter-spacing:-.025em; margin:10px 0 12px }
.intro{ color:var(--gris); max-width:72ch; margin:0 0 20px }
.conteo{ font-size:14px; color:var(--gris); margin:0 0 14px }
.cargando{ color:var(--gris) }
.revision{ font-size:13.5px; color:var(--gris); border-left:3px solid var(--linea); padding-left:12px; margin:0 0 18px }
.buscador-entidades input{ width:100%; max-width:560px; min-height:50px; padding:12px 16px; font:inherit;
  font-size:16px; border:1px solid var(--linea); border-radius:12px; background:#fff }
.buscador-entidades input:focus{ outline:none; border-color:var(--acento); box-shadow:0 0 0 4px var(--acento-sua) }
.filtros-datos{ display:flex; gap:10px; flex-wrap:wrap; margin:14px 0 18px }
.filtros-datos select{ min-height:44px; padding:10px 12px; border:1px solid var(--linea); border-radius:9px;
  background:#fff; font:inherit; font-size:14.5px; min-width:180px }
#entidades,#noticias{ display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:14px; padding-bottom:50px }
.entidad,.noticia{ display:flex; flex-direction:column; gap:7px; background:#fff; border:1px solid var(--linea);
  border-radius:14px; padding:17px; color:var(--tinta); text-decoration:none; transition:box-shadow .15s, border-color .15s }
.entidad:hover,.noticia:hover{ text-decoration:none; border-color:#C9D2E6; box-shadow:0 8px 24px rgba(18,21,28,.07) }
.entidad b{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:17px }
.entidad .d,.noticia .meta{ font-size:12.5px; color:var(--gris) }
.entidad .magnitud{ font-size:13px; color:var(--acento); font-weight:500 }
.entidad .fuentes{ font-size:12px; color:var(--gris) }
.entidad .pie-ficha{ display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; align-items:center;
  margin-top:auto; padding-top:10px; border-top:1px solid var(--linea) }
.nivel{ display:inline-block; font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; padding:4px 9px;
  border-radius:999px; border:1px solid }
.nivel.oficial{ color:#14794A; border-color:#BBE3CD; background:#EFFAF4 }
.nivel.investigacion{ color:#8A5A00; border-color:#F0DCAE; background:#FFF8E8 }
.nivel.propio{ color:#A8291C; border-color:#F2C7C1; background:#FDF0EE }
.nueva{ font-size:9.5px; letter-spacing:.08em; text-transform:uppercase; background:#D8392B; color:#fff; padding:2px 7px; border-radius:4px }
.fecha{ font-size:12px; color:var(--gris) }
.noticia .pais{ align-self:flex-start; font-size:10.5px; letter-spacing:.06em; background:var(--acento-sua);
  color:var(--acento); padding:3px 9px; border-radius:999px; font-weight:600 }
.noticia h3{ font-size:16px; margin:0; line-height:1.4; font-weight:600 }
.limpiar{ min-height:44px; padding:0 16px; background:#fff; border:1px solid var(--linea); border-radius:9px;
  color:var(--gris); font:inherit; font-size:14px; cursor:pointer }

@media(max-width:900px){
  .desp-rejilla{ grid-template-columns:1fr; gap:24px }
  .campos{ grid-template-columns:1fr }
}
.busca-amplia{ font-size:14.5px; color:var(--gris); margin:14px 0 0 }

/* ---- Accesos a entidades y noticias --------------------------------------
   Antes eran dos enlaces de texto en azul dentro de un párrafo y pasaban
   desapercibidos. Aquí son dos accesos del ancho de media pantalla, con lo que
   hace cada uno explicado en una línea. */
.herramientas{ padding:26px 0 10px }
.herr-rejilla{ display:grid; grid-template-columns:1fr 1fr; gap:16px }
.herr{ display:flex; align-items:flex-start; gap:16px; background:#fff; border:1px solid #DDE3EE;
  box-shadow:0 1px 2px rgba(18,21,28,.05);
  border-radius:16px; padding:22px; color:var(--tinta); text-decoration:none;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease }
.herr:hover{ text-decoration:none; transform:translateY(-3px); border-color:#C9D2E6;
  box-shadow:0 12px 32px rgba(18,21,28,.09) }
.herr-icono{ flex:0 0 auto; width:46px; height:46px; border-radius:12px; background:var(--acento-sua);
  color:var(--acento); display:flex; align-items:center; justify-content:center }
.herr-icono svg{ width:25px; height:25px }
.herr-txt{ display:flex; flex-direction:column; gap:5px }
.herr-txt b{ font-size:18px; letter-spacing:-.015em }
.herr-txt span{ font-size:14.5px; color:var(--gris); line-height:1.5 }
.herr-dato{ font-size:12.5px !important; color:var(--acento) !important; font-weight:600 }
.herr-fl{ margin-left:auto; color:var(--acento); font-size:20px; align-self:center }
@media(max-width:820px){ .herr-rejilla{ grid-template-columns:1fr } }

/* ---- Barra de estado de los datos ---- */
.barra-estado{ background:#0F1522; color:#C8D1E0; font-size:12.5px; letter-spacing:.01em }
.barra-estado .contenedor{ display:flex; gap:24px; flex-wrap:wrap; padding-top:9px; padding-bottom:9px;
  align-items:center; min-height:34px }
.barra-estado b{ color:#fff; font-weight:600 }
.vivo{ display:inline-block; width:7px; height:7px; border-radius:50%; background:#35C07A; margin-right:7px;
  animation:late 2.4s ease-in-out infinite }
@keyframes late{ 0%,100%{opacity:1} 50%{opacity:.35} }
@media (prefers-reduced-motion: reduce){ .vivo{ animation:none } }
@media(max-width:620px){ .barra-estado{ font-size:11.5px } .barra-estado .contenedor{ gap:14px } }

/* ---- Marca dibujada -----------------------------------------------------
   Dos despachos tenían solo un icono cuadrado y otros dos habían cambiado a
   una marca tipográfica, así que sus .webp estaban desfasados. En vez de
   depender de imágenes, el directorio dibuja la marca: icono y nombre, como
   las bandas de los demás. */
.logo-caja.caja-marca{ padding:0; border:0; overflow:hidden }
.marca-dibujo{ display:flex; align-items:center; justify-content:center; gap:11px;
  width:100%; height:100%; padding:0 16px }
.marca-icono{ width:38px; height:38px; flex:0 0 auto; border-radius:8px }
.marca-texto{ display:flex; flex-direction:column; line-height:1.12; text-align:left }
.marca-texto b{ font-size:17px; font-weight:700; letter-spacing:-.01em }
.marca-texto span{ font-size:9.5px; letter-spacing:.17em; text-transform:uppercase; opacity:.78; margin-top:3px }
.marca-texto.manuscrita b{ font-family:'Great Vibes',cursive; font-size:27px; font-weight:400; letter-spacing:0 }
.ficha-cab .marca-icono,.desp-logo .marca-icono{ width:46px; height:46px }
.desp-logo .marca-texto b{ font-size:19px }

/* Contenido ampliado de las fichas */
.entradilla{ font-size:17.5px; color:#2C3340 !important; line-height:1.6 }
.bloque p + p{ margin-top:.8rem }
.bloque-no{ background:#FFF7F6; border:1px solid #F2D7D3; border-radius:14px; padding:18px 20px }
.bloque-no h2{ font-size:17px; color:#A8291C }
.lista-no{ margin:0; padding-left:1.1rem; color:#7A3C34 }
.lista-no li{ margin:.3rem 0; font-size:14.5px }
.dato-extra{ font-size:14.5px; color:var(--gris); border-left:3px solid var(--acento); padding-left:12px; margin-top:18px }

/* Contenido ampliado de las fichas */
.entradilla{ font-size:17.5px; color:#2C3340 !important; line-height:1.6 }
.bloque p + p{ margin-top:.8rem }
.bloque-no{ background:#FFF7F6; border:1px solid #F2D7D3; border-radius:14px; padding:18px 20px; margin-bottom:30px }
.bloque-no h2{ font-size:17px; color:#A8291C; margin-bottom:.5rem }
.lista-no{ margin:0; padding-left:1.1rem; color:#7A3C34 }
.lista-no li{ margin:.3rem 0; font-size:14.5px }
.dato-extra{ font-size:14.5px; color:var(--gris); border-left:3px solid var(--acento); padding-left:12px; margin:0 0 26px }

/* Datos de contacto de cada despacho: enlaces discretos, sin el subrayado
   azul de navegador, que se subrayan solo al pasar por encima. */
dd a{ color: var(--acento); text-decoration: none; font-weight: 500; word-break: break-word; }
dd a:hover{ text-decoration: underline; }