/* =====================================================================
   Asesor de marcas · Grupo Eurodesign
   Lanzador + panel. Todo vive bajo .eda para no chocar con el sitio Astro.
   Sólo Josefin Sans, Merriweather, negro, blanco y los grises del sitio.
   ===================================================================== */

.eda {
  /* Color */
  --eda-negro: #000;
  --eda-blanco: #fff;
  --eda-gris: #696969;        /* texto secundario: 5.5:1 sobre blanco, 4.9:1 sobre #f2f2f2 */
  --eda-gris-claro: #b5b5b5;  /* texto sobre negro: 10.3:1 */
  --eda-linea: #c9c9c9;       /* línea de campos y separadores (no se usa para texto) */
  --eda-superficie: #f2f2f2;  /* superficies suaves */
  --eda-activo: #333;         /* estado activo en táctil */

  /* Tipografía */
  --eda-sans: 'Josefin Sans', 'Helvetica Neue', Arial, sans-serif;
  --eda-serif: 'Merriweather', Georgia, serif;
  --eda-track-boton: 5px;
  --eda-track-etiqueta: 3px;

  /* Forma y espacio */
  --eda-esquina: 0 50px 50px 50px;  /* la de la foto del showroom; sólo en el bloque de sitio especializado */
  --eda-ancho: 420px;
  --eda-margen: 28px;
  --eda-orilla: 18px;               /* misma distancia al borde que el botón "Privacidad" */

  /* Movimiento */
  --eda-curva: cubic-bezier(0.22, 1, 0.36, 1);
  --eda-entrada: 600ms;
  --eda-barrido: 500ms ease-in-out;

  --eda-z: 2147483000;
  font-family: var(--eda-serif);
  color: var(--eda-negro);
}

.eda *,
.eda *::before,
.eda *::after { box-sizing: border-box; }

.eda-vh {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ---------- Foco: anillo doble (negro + halo blanco) visible sobre foto, blanco o negro ---------- */
.eda :focus { outline: none; }
.eda :focus-visible {
  outline: 2px solid var(--eda-negro);
  outline-offset: 2px;
  box-shadow: 0 0 0 6px var(--eda-blanco);
}
.eda-head :focus-visible,
.eda-site :focus-visible {
  outline-color: var(--eda-blanco);
  box-shadow: 0 0 0 6px var(--eda-negro);
}

/* ---------- Firma del sitio: rectángulo negro con barrido blanco ---------- */
.eda-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 44px;
  padding: 13px 20px 10px 25px;    /* Josefin se asienta alto: más aire arriba, y el tracking empuja a la derecha */
  border: 2px solid var(--eda-negro);
  border-radius: 0;
  background: linear-gradient(var(--eda-blanco), var(--eda-blanco)) no-repeat left / 0% 100%, var(--eda-negro);
  color: var(--eda-blanco);
  font: 700 13px/1.25 var(--eda-sans);
  letter-spacing: var(--eda-track-boton);
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  transition: background-size var(--eda-barrido), color var(--eda-barrido), border-color var(--eda-barrido);
}
.eda-btn:hover { background-size: 100% 100%; color: var(--eda-negro); }
.eda-btn--block { display: flex; width: 100%; }
.eda-btn svg { flex: none; }

/* Contorno (secundario): blanco con barrido negro */
.eda-btn--ghost {
  background: linear-gradient(var(--eda-negro), var(--eda-negro)) no-repeat left / 0% 100%, var(--eda-blanco);
  color: var(--eda-negro);
}
.eda-btn--ghost:hover { color: var(--eda-blanco); }

/* Sobre negro */
.eda-btn--light {
  border-color: var(--eda-blanco);
  background: linear-gradient(var(--eda-negro), var(--eda-negro)) no-repeat left / 0% 100%, var(--eda-blanco);
  color: var(--eda-negro);
}
.eda-btn--light:hover { color: var(--eda-blanco); }
.eda-btn--ghost-light {
  border-color: var(--eda-blanco);
  background: linear-gradient(var(--eda-blanco), var(--eda-blanco)) no-repeat left / 0% 100%, transparent;
  color: var(--eda-blanco);
}
.eda-btn--ghost-light:hover { color: var(--eda-negro); }

.eda-btn:disabled { cursor: not-allowed; opacity: .45; }

/* ---------- Lanzador: espejo de "Privacidad" en la esquina opuesta ---------- */
.eda-launcher {
  position: fixed;
  right: var(--eda-orilla);
  bottom: var(--eda-orilla);
  z-index: var(--eda-z);
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 14px 14px 11px 18px;
  border: 1px solid var(--eda-negro);
  background: linear-gradient(var(--eda-negro), var(--eda-negro)) no-repeat left / 0% 100%, var(--eda-blanco);
  color: var(--eda-negro);
  font: 700 12px/1 var(--eda-sans);
  letter-spacing: 4px;
  text-transform: uppercase;
  cursor: pointer;
  transition: background-size var(--eda-barrido), color var(--eda-barrido), opacity 300ms ease, visibility 0s;
  animation: eda-aparece 800ms var(--eda-curva) 400ms both;
}
.eda-launcher:hover { background-size: 100% 100%; color: var(--eda-blanco); }
.eda-launcher__raya {          /* raya editorial que se alarga al pasar el cursor */
  display: block;
  width: 18px; height: 1px;
  margin-top: -3px;
  background: currentColor;
  transition: width var(--eda-barrido);
}
.eda-launcher:hover .eda-launcher__raya { width: 28px; }
.eda-launcher__corto { display: none; }
.eda[data-open] .eda-launcher { opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 200ms ease, visibility 0s linear 200ms; }

/* ---------- Panel ---------- */
.eda-panel {
  position: fixed;
  z-index: var(--eda-z);
  right: 24px;
  bottom: 24px;
  width: var(--eda-ancho);
  height: min(760px, calc(100vh - 48px));
  height: min(760px, calc(100dvh - 48px));
  display: flex;
  flex-direction: column;
  background: var(--eda-blanco);
  border: 1px solid var(--eda-negro);
  opacity: 0;
  transform: translateY(16px);
  visibility: hidden;
  transition: opacity 400ms ease, transform 800ms var(--eda-curva), visibility 0s linear 800ms;
}
.eda[data-open] .eda-panel {
  opacity: 1;
  transform: none;
  visibility: visible;
  transition: opacity 400ms ease, transform 800ms var(--eda-curva), visibility 0s;
}

/* Encabezado: la barra negra de las páginas internas */
.eda-head {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 72px;
  padding: 12px 12px 12px var(--eda-margen);
  background: var(--eda-negro);
  color: var(--eda-blanco);
}
.eda-brand { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.eda-logo {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font: 400 22px/1 var(--eda-sans);
  letter-spacing: .2px;
  text-transform: lowercase;
}
.eda-logo__barra { display: block; width: 2px; height: 22px; margin-top: -3px; background: currentColor; }
.eda-title {
  margin: 0;
  font: 600 11px/1 var(--eda-sans);
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--eda-gris-claro);
}
.eda-close {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 44px;
  min-height: 44px;
  padding: 4px 12px 0 14px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--eda-blanco);
  font: 600 11px/1 var(--eda-sans);
  letter-spacing: 3px;
  text-transform: uppercase;
  cursor: pointer;
  transition: border-color 300ms ease;
}
.eda-close svg { margin-top: -4px; }
.eda-close:hover { border-color: var(--eda-blanco); }

/* ---------- Conversación ---------- */
.eda-log {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  display: flex;
  flex-direction: column;
  gap: 28px;
  padding: 28px var(--eda-margen) 12px;
}
.eda-log > :first-child { margin-top: auto; }   /* la conversación arranca abajo, junto al campo */
.eda-log:focus-visible { outline-offset: -4px; box-shadow: none; }
.eda-turn { display: flex; flex-direction: column; gap: 20px; }
.eda-text {
  margin: 0;
  font: 400 15px/1.8 var(--eda-serif);
}
.eda-turn--user {
  align-self: flex-end;
  max-width: 86%;
  padding: 12px 18px 13px;
  background: var(--eda-superficie);
}
.eda-turn--user .eda-text { font-size: 15px; line-height: 1.7; }

.eda-enter { animation: eda-entra var(--eda-entrada) var(--eda-curva) both; animation-delay: calc(var(--eda-i, 0) * 90ms); }

/* Etiqueta de sección: Josefin con línea negra arriba, como las columnas de las páginas de marca */
.eda-label {
  margin: 0;
  padding-top: 14px;
  border-top: 1px solid var(--eda-negro);
  font: 700 12px/1.3 var(--eda-sans);
  letter-spacing: 4px;
  text-transform: uppercase;
}

/* ---------- Tarjetas de marca: índice editorial, sin fotos ---------- */
.eda-cards { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.eda-card {
  position: relative;
  isolation: isolate;
  margin: 0 -16px;
  padding: 18px 16px 20px;
  border-top: 1px solid var(--eda-negro);
}
.eda-card:last-child { border-bottom: 1px solid var(--eda-negro); }
.eda-card + .eda-card { border-top-color: var(--eda-linea); }
.eda-card::before {                 /* barrido gris al pasar el cursor, el mismo gesto de los botones */
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--eda-superficie);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--eda-barrido);
}
.eda-card--link:hover::before,
.eda-card--link:focus-within::before { transform: scaleX(1); }

.eda-card__head { display: flex; align-items: baseline; gap: 14px; }
.eda-card__num {
  flex: none;
  font: 600 11px/1 var(--eda-sans);
  letter-spacing: 2px;
  color: var(--eda-gris);
}
.eda-card__name {
  margin: 0;
  font: 700 19px/1.3 var(--eda-sans);
  letter-spacing: var(--eda-track-boton);
  text-transform: uppercase;
  overflow-wrap: anywhere;
}
.eda-card__reason { margin: 10px 0 0; font: 400 14px/1.75 var(--eda-serif); }
.eda-card__summary { margin: 6px 0 0; font: italic 400 13px/1.7 var(--eda-serif); color: var(--eda-gris); }
.eda-card__link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 32px;
  margin-top: 12px;
  padding-top: 3px;
  color: var(--eda-negro);
  font: 700 12px/1 var(--eda-sans);
  letter-spacing: 4px;
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: 1px solid var(--eda-negro);
}
.eda-card__link::after { content: ''; position: absolute; inset: 0; }   /* toda la tarjeta es el objetivo táctil */
.eda-card__link .eda-arrow { margin-top: -3px; transition: transform var(--eda-barrido); }
.eda-card--link:hover .eda-arrow { transform: translateX(5px); }

/* ---------- Sitio especializado: el único bloque con la esquina del showroom ---------- */
.eda-site {
  padding: 26px 24px 28px;
  border-radius: var(--eda-esquina);
  background: var(--eda-negro);
  color: var(--eda-blanco);
}
.eda-site__eyebrow {
  margin: 0 0 12px;
  font: 600 11px/1 var(--eda-sans);
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--eda-gris-claro);
}
.eda-site__name {
  margin: 0;
  font: 700 20px/1.35 var(--eda-sans);
  letter-spacing: var(--eda-track-boton);
  text-transform: uppercase;
}
.eda-site__text { margin: 12px 0 0; font: 400 14px/1.8 var(--eda-serif); }
.eda-site__actions { display: flex; flex-direction: column; gap: 10px; margin-top: 22px; }

/* ---------- Contacto ---------- */
.eda-contact { display: flex; flex-direction: column; gap: 16px; }
.eda-contact__list { list-style: none; margin: 0; padding: 0; }
.eda-contact__row {
  display: grid;
  grid-template-columns: 92px 1fr auto;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  border-bottom: 1px solid var(--eda-linea);
  color: var(--eda-negro);
  text-decoration: none;
}
.eda-k {
  padding-top: 3px;
  font: 600 11px/1 var(--eda-sans);
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--eda-gris);
}
.eda-v { font: 400 15px/1.4 var(--eda-serif); overflow-wrap: anywhere; }
.eda-contact__row .eda-arrow { transition: transform var(--eda-barrido); }
.eda-contact__row:hover .eda-v { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.eda-contact__row:hover .eda-arrow { transform: translateX(4px); }

/* ---------- Resumen de proyecto ---------- */
.eda-summary { padding: 0 0 4px; display: flex; flex-direction: column; gap: 14px; }
.eda-summary__doc { padding: 6px 20px 18px; background: var(--eda-superficie); }
.eda-summary__list { margin: 0; }
.eda-summary__row { padding: 12px 0 11px; border-bottom: 1px solid var(--eda-linea); }
.eda-summary__row:last-child { border-bottom: 0; }
.eda-summary__list dt {
  margin: 0 0 6px;
  padding-top: 2px;
  font: 600 11px/1.3 var(--eda-sans);
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--eda-gris);
}
.eda-summary__list dd { margin: 0; font: 400 14px/1.6 var(--eda-serif); }
.eda-summary__note { margin: 0; font: italic 400 13px/1.7 var(--eda-serif); color: var(--eda-gris); }
.eda-summary__note strong { font-style: normal; font-weight: 700; color: var(--eda-negro); }
.eda-status { font: 600 11px/1 var(--eda-sans); letter-spacing: 3px; text-transform: uppercase; color: var(--eda-gris); }

/* ---------- Escribiendo ---------- */
.eda-typing { display: inline-flex; align-items: center; gap: 14px; min-height: 24px; }
.eda-typing__dots { display: inline-flex; gap: 5px; }
.eda-typing__dots span { width: 6px; height: 6px; background: var(--eda-negro); animation: eda-pulso 1.2s ease-in-out infinite; }
.eda-typing__dots span:nth-child(2) { animation-delay: .15s; }
.eda-typing__dots span:nth-child(3) { animation-delay: .3s; }
.eda-typing__label {
  padding-top: 3px;
  font: 600 11px/1 var(--eda-sans);
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--eda-gris);
}

/* ---------- Error y límite ---------- */
.eda-alert { padding: 18px 20px 16px; border: 1px solid var(--eda-negro); }
.eda-alert__title {
  margin: 0 0 8px;
  font: 700 12px/1.3 var(--eda-sans);
  letter-spacing: 4px;
  text-transform: uppercase;
}
.eda-alert .eda-text { font-size: 14px; line-height: 1.7; }
.eda-linkbtn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  margin-top: 4px;
  padding: 3px 0 0;
  border: 0;
  background: none;
  color: var(--eda-negro);
  font: 700 12px/1 var(--eda-sans);
  letter-spacing: 4px;
  text-transform: uppercase;
  text-decoration: underline;
  text-underline-offset: 6px;
  text-decoration-thickness: 1px;
  cursor: pointer;
}
.eda-limit { display: flex; flex-direction: column; gap: 16px; }
.eda-limit .eda-text { font-size: 14px; }

/* ---------- Pie: chips, campo y aviso ---------- */
.eda-foot {
  flex: none;
  padding: 16px var(--eda-margen) 14px;
  border-top: 1px solid var(--eda-linea);
  background: var(--eda-blanco);
}
.eda-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.eda-chips:empty { display: none; }
.eda-chip {
  min-height: 44px;
  padding: 14px 13px 11px 16px;
  border: 1px solid var(--eda-negro);
  border-radius: 0;
  background: linear-gradient(var(--eda-negro), var(--eda-negro)) no-repeat left / 0% 100%, var(--eda-blanco);
  color: var(--eda-negro);
  font: 600 12px/1.1 var(--eda-sans);
  letter-spacing: var(--eda-track-etiqueta);
  text-transform: uppercase;
  cursor: pointer;
  transition: background-size var(--eda-barrido), color var(--eda-barrido);
}
.eda-chip:hover { background-size: 100% 100%; color: var(--eda-blanco); }
.eda-chip.eda-enter { animation-name: eda-aparece; animation-duration: 500ms; animation-delay: calc(var(--eda-i, 0) * 60ms); }

.eda-form { display: flex; align-items: flex-end; gap: 12px; }
.eda-input {
  flex: 1;
  min-width: 0;
  height: 46px;
  padding: 10px 0 8px;
  border: 0;
  border-bottom: 1px solid var(--eda-linea);
  border-radius: 0;
  background: transparent;
  color: var(--eda-negro);
  font: 400 16px/1.4 var(--eda-serif);   /* 16 px: iOS no hace zoom */
  transition: border-color 300ms ease, box-shadow 300ms ease;
}
.eda-input::placeholder { color: var(--eda-gris); opacity: 1; }
.eda .eda-input:focus-visible,
.eda .eda-input:focus {
  outline: none;
  border-bottom-color: var(--eda-negro);
  box-shadow: 0 1px 0 var(--eda-negro);   /* la línea pasa a negra y gana grosor */
}
.eda-input:disabled { color: var(--eda-gris); }
.eda-send {
  flex: none;
  display: inline-grid;
  place-items: center;
  width: 46px; height: 46px;
  padding: 0;
}
.eda-send:disabled { opacity: 1; background: var(--eda-linea); border-color: var(--eda-linea); color: var(--eda-blanco); }
.eda-note {
  margin: 12px 0 0;
  font: 400 12px/1.6 var(--eda-serif);
  color: var(--eda-gris);
}
.eda-turns:empty { display: none; }
.eda-turns {
  margin: 10px 0 0;
  font: 600 11px/1.3 var(--eda-sans);
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--eda-gris);
}

/* ---------- Movimiento ---------- */
@keyframes eda-entra { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes eda-aparece { from { opacity: 0; } to { opacity: 1; } }
@keyframes eda-pulso { 0%, 100% { opacity: .15; } 40% { opacity: 1; } }

/* ---------- Móvil: pantalla completa ---------- */
@media (max-width: 600px) {
  .eda { --eda-margen: 20px; }
  .eda-panel {
    inset: 0;
    width: 100%;
    height: 100vh;
    height: 100dvh;
    border: 0;
  }
  .eda-head { min-height: 64px; padding-left: var(--eda-margen); }
  .eda-logo { font-size: 20px; }
  .eda-logo__barra { height: 20px; }
  .eda-log { padding-top: 24px; gap: 24px; }
  .eda-foot { padding-bottom: max(14px, env(safe-area-inset-bottom)); }
  .eda-launcher__largo { display: none; }
  .eda-launcher__corto { display: inline; }
  .eda-card { margin: 0 -12px; padding-inline: 12px; }
  .eda-contact__row { grid-template-columns: 84px 1fr auto; }
}
html.eda-bloqueo, html.eda-bloqueo body { overflow: hidden; }

/* ---------- Táctil: sin barrido, estado activo #333 como el sitio ---------- */
@media (hover: none) {
  .eda-btn:hover, .eda-chip:hover, .eda-launcher:hover { background-size: 0% 100%; }
  .eda-btn:hover { color: var(--eda-blanco); }
  .eda-btn--ghost:hover, .eda-btn--light:hover, .eda-chip:hover, .eda-launcher:hover { color: var(--eda-negro); }
  .eda-btn--ghost-light:hover { color: var(--eda-blanco); }
  .eda-btn:active, .eda-chip:active, .eda-launcher:active { background-color: var(--eda-activo); color: var(--eda-blanco); }
  .eda-card--link:hover::before { transform: scaleX(0); }
  .eda-card--link:active::before { transform: scaleX(1); }
}

/* ---------- Movimiento reducido ---------- */
@media (prefers-reduced-motion: reduce) {
  .eda *, .eda *::before, .eda *::after {
    animation-duration: 1ms !important;
    animation-delay: 0ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    transition-delay: 0ms !important;
    scroll-behavior: auto !important;
  }
  .eda-panel { transform: none; }
  .eda-typing__dots span { opacity: 1; }
}