/* Asistente IA de AI-CUBE 365 — estilos del componente (todo bajo .aic).
   Diseño del componente «aicube-asistente»: cubo en pixel art, drones que forman «?» y chat.
   Usa las fuentes propias de la web (Titillium Web e IBM Plex Mono, en /fuentes/). */

.aic {
  --aic-accent: #cd7c56;
  --aic-accent-2: #e09a78;
  --aic-bg: #1a1a1b;
  --aic-panel: #222223;
  --aic-line: #3a3a3b;
  --aic-line-2: #555556;
  --aic-text: #ededec;
  --aic-muted: #b3b3b2;
  --aic-panel-top: 96px;
  --aic-font: 'Titillium Web', system-ui, sans-serif;
  --aic-mono: 'IBM Plex Mono', ui-monospace, monospace;
  position: relative;
  font-family: var(--aic-font);
  color: var(--aic-text);
}
.aic *, .aic *::before, .aic *::after { box-sizing: border-box; }
.aic-accent { fill: var(--aic-accent); }
.aic-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.aic-trampa { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }

/* ---------- Tarjeta con el cubo ---------- */
.aic-trigger {
  display: flex; align-items: center; gap: 40px;
  padding: 140px 36px 20px 20px;
  background: transparent; color: inherit; font: inherit; text-align: left;
  border: 1px dashed var(--aic-line-2); border-radius: 8px; cursor: pointer;
}
.aic-trigger:hover { border-color: var(--aic-accent); background: #222223; }
.aic-trigger:focus-visible { outline: 3px solid var(--aic-accent); outline-offset: 4px; }

.aic-figure { position: relative; display: block; width: 224px; height: 196px; flex-shrink: 0; }
.aic-stage { position: absolute; left: 0; top: 0; width: 224px; height: 196px; transform-origin: 0 0; }
.aic-float { display: block; width: 224px; height: 196px; animation: aic-float 2.4s steps(3) infinite; }
.aic-cube { display: block; }

.aic-copy { display: flex; flex-direction: column; gap: 12px; max-width: 420px; min-width: 0; }
.aic-eyebrow { font-family: var(--aic-mono); font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--aic-accent); }
.aic-title { font-size: 44px; font-weight: 700; line-height: 1.05; }
.aic-desc { font-size: 19px; line-height: 1.4; color: #cfcfce; }
.aic-cta { display: flex; align-items: center; gap: 10px; margin-top: 6px; font-family: var(--aic-mono); font-size: 15px; }
.aic-cursor { display: inline-block; width: 10px; height: 18px; background: var(--aic-accent); animation: aic-cursor 1s steps(1, end) infinite; }

/* ---------- Tapa y drones ---------- */
.aic-lid { transition: transform .45s steps(3); }
.aic-gaze { transition: transform .12s steps(1); }
.aic-drones { position: absolute; left: 0; top: 0; width: 0; height: 0; pointer-events: none; }
.aic-drones.is-floating { animation: aic-qfloat 3.2s ease-in-out infinite; }
.aic-drone {
  position: absolute; left: 0; top: 0; width: 5px; height: 5px; opacity: 0;
  background: var(--aic-accent); box-shadow: 0 0 4px rgba(205, 124, 86, .4);
}

/* ---------- Onda de celdas, ojos y guiño (ciclo de 10 s) ---------- */
.aic-cell { opacity: 0; animation: aic-cell 10s steps(1, end) infinite; animation-delay: calc(var(--i) * .2s); }
.aic-eye { opacity: 0; animation: aic-eye 10s steps(1, end) infinite; }
.aic-eye-wink { opacity: 0; animation: aic-eye-wink 10s steps(1, end) infinite; }
.aic-eye-shut { opacity: 0; animation: aic-eye-shut 10s steps(1, end) infinite; }

/* Pensando: la onda se acelera y los ojos se apagan */
.aic.is-thinking .aic-cell { animation: aic-cell-fast 1.35s steps(1, end) infinite; animation-delay: calc(var(--i) * .05s); }
.aic.is-thinking .aic-eye, .aic.is-thinking .aic-eye-wink, .aic.is-thinking .aic-eye-shut { animation: none; opacity: 0; }
/* Respuesta: ojos abiertos y guiño */
.aic.is-answered .aic-cell { animation: none; opacity: 0; }
.aic.is-answered .aic-eye { animation: none; opacity: 1; }
.aic.is-answered .aic-eye-wink { animation: aic-wink-now 2.2s steps(1, end) 1 forwards; }
.aic.is-answered .aic-eye-shut { animation: aic-shut-now 2.2s steps(1, end) 1 forwards; }

/* Mini cubo (cabecera del panel y cabecera de la web) */
.aic-m-cell, .aic-m-shut { opacity: 0; }
.aic.is-thinking .aic-m-cell { animation: aic-cell-fast .9s steps(1, end) infinite; animation-delay: calc(var(--i) * .15s); }
.aic.is-thinking .aic-m-eye { opacity: 0; }
.aic.is-answered .aic-m-wink { animation: aic-wink-now 2.2s steps(1, end) 1 forwards; }
.aic.is-answered .aic-m-shut { animation: aic-shut-now 2.2s steps(1, end) 1 forwards; }

/* Pausa fuera de pantalla o con la pestaña oculta */
.aic.is-offscreen *, .aic.is-hidden-tab * { animation-play-state: paused !important; }

/* ---------- Mini cubo en la cabecera fija de la web ---------- */
.aic-cab-grupo { display: flex; align-items: center; gap: 14px; }
.aic-cab { display: inline-flex; }
.aic-cab-btn {
  display: grid; place-items: center; width: 52px; height: 46px; padding: 0;
  background: transparent; border: 0; cursor: pointer; transition: transform .15s steps(2);
}
.aic-cab-btn:hover { transform: translateY(-2px); }
.aic-cab-btn:focus-visible { outline: 3px solid var(--aic-accent); outline-offset: 2px; }
/* En reposo guiña cada 10 s */
.aic-cab .aic-m-wink { animation: aic-m-wink 10s steps(1, end) infinite; }
.aic-cab .aic-m-shut { animation: aic-m-shut 10s steps(1, end) infinite; }
.aic-cab.is-thinking .aic-m-wink, .aic-cab.is-thinking .aic-m-shut { animation: none; opacity: 0; }
@media (max-width: 860px) {
  .aic-cab-grupo { margin-left: auto; margin-right: -18px; }
  .aic-cab-btn { width: 40px; height: 38px; }
  .aic-cab-btn .aic-mini { width: 36px; height: 32px; }
  header.cab .marca b { white-space: nowrap; }   /* con el cubo al lado, que «AI-CUBE» no se parta */
}

/* ---------- Panel de chat ---------- */
.aic-panel {
  position: fixed; z-index: 1000; top: var(--aic-panel-top); right: 24px;
  width: 440px; max-height: calc(100vh - var(--aic-panel-top) - 24px);
  display: flex; flex-direction: column;
  background: var(--aic-panel); border: 3px solid var(--aic-muted); box-shadow: 8px 8px 0 #0e0e0f;
  font-family: var(--aic-font); color: var(--aic-text); text-align: left;
}
.aic-panel[hidden] { display: none; }
.aic-panel-head { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-bottom: 3px solid var(--aic-line); }
.aic-mini { flex-shrink: 0; }
.aic-panel-title { display: flex; flex-direction: column; flex-grow: 1; }
.aic-panel-title strong { font-size: 20px; line-height: 1.1; }
.aic-panel-title span { display: flex; align-items: center; gap: 6px; font-family: var(--aic-mono); font-size: 12px; color: var(--aic-muted); }
.aic-dot { display: inline-block; width: 8px; height: 8px; background: #ffd86b; }
.aic-nueva {
  height: 32px; padding: 0 10px; background: transparent; border: 2px solid var(--aic-line-2); color: var(--aic-muted);
  font-family: var(--aic-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; cursor: pointer;
}
.aic-nueva:hover { border-color: var(--aic-accent); color: var(--aic-text); }
.aic-close { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; background: transparent; border: 0; color: var(--aic-muted); cursor: pointer; }
.aic-close:hover { color: var(--aic-accent); }
.aic-close:focus-visible, .aic-chip:focus-visible, .aic-send:focus-visible, .aic-nueva:focus-visible { outline: 3px solid var(--aic-accent); outline-offset: 2px; }

.aic-log { position: relative; flex: 1 1 auto; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; padding: 18px 16px 8px; }
.aic-msg { max-width: 380px; padding: 12px 14px; font-size: 15px; line-height: 1.45; overflow-wrap: anywhere; }
.aic-msg--bot { align-self: flex-start; background: #2d2d2e; border: 2px solid var(--aic-line); }
.aic-msg--user { align-self: flex-end; max-width: 320px; background: var(--aic-line); border: 2px solid var(--aic-line-2); white-space: pre-wrap; }
.aic-msg--error { border-color: var(--aic-accent); color: #f3c3ab; }
.aic-msg p { margin: 0 0 .6em; } .aic-msg p:last-child { margin-bottom: 0; }
.aic-msg ul, .aic-msg ol { margin: 0 0 .6em; padding-left: 1.2em; } .aic-msg li { margin: .2em 0; }
.aic-msg strong { font-weight: 700; color: #fff; }
.aic-msg a { color: var(--aic-accent-2); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.aic-msg code { font-family: var(--aic-mono); font-size: 13px; background: var(--aic-bg); padding: 1px 4px; }
.aic-thinking { display: flex; align-items: center; gap: 6px; font-family: var(--aic-mono); font-size: 13px; color: var(--aic-muted); }
.aic-thinking .aic-cursor { width: 8px; height: 14px; }

.aic-chips { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 6px 16px 16px; }
.aic-chips[hidden] { display: none; }
.aic-chips-label { font-family: var(--aic-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--aic-muted); }
.aic-chip { min-height: 44px; padding: 10px 12px; background: transparent; border: 2px solid var(--aic-line-2); color: #cfcfce; font: inherit; font-size: 15px; text-align: left; cursor: pointer; }
.aic-chip:hover { border-color: var(--aic-accent); color: var(--aic-text); }

.aic-form { display: flex; gap: 8px; padding: 14px 16px 10px; border-top: 3px solid var(--aic-line); }
.aic-input { flex-grow: 1; min-width: 0; height: 44px; padding: 0 12px; background: var(--aic-bg); border: 2px solid var(--aic-line-2); color: var(--aic-text); font: inherit; font-size: 15px; }
.aic-input:focus { outline: none; border-color: var(--aic-accent); }
.aic-send { height: 44px; padding: 0 18px; background: var(--aic-accent); border: 0; color: var(--aic-bg); font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }
.aic-send:hover { background: var(--aic-accent-2); }
.aic-send:disabled { background: var(--aic-line-2); cursor: default; }
.aic-aviso { margin: 0; padding: 0 16px 12px; font-size: 11.5px; line-height: 1.4; color: var(--aic-muted); }
.aic-aviso a { color: inherit; }

/* ---------- Portada y /asistente/: recuadro oscuro de altura fija con la tarjeta del cubo.
   Al pulsarla, la ventana ocupa la parte derecha del MISMO recuadro, sin agrandarlo:
   la conversación se desplaza por dentro. ---------- */
.aic-cuerpo { display: contents; }   /* en la ventana flotante no cambia nada */
.asis-g { padding: 48px 0 24px; }
.aic-caja {
  --aic-alto: 300px;
  display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); gap: 16px;
  height: var(--aic-alto); padding: 14px; background: var(--night, #1a1a1b);
}
.aic-en-pagina .aic-trigger { width: 100%; height: 100%; min-height: 0; overflow: hidden; justify-content: center; gap: 36px; padding: 0 24px 14px; }
.aic-en-pagina .aic-figure { width: 139px; height: 122px; margin-top: 70px; }
.aic-en-pagina .aic-stage { transform: scale(.62); }
.aic-en-pagina .aic-copy { gap: 8px; max-width: 380px; }
.aic-en-pagina .aic-eyebrow { font-size: 12px; }
.aic-en-pagina .aic-title { font-size: 32px; }
.aic-en-pagina .aic-desc { font-size: 15px; }
.aic-en-pagina .aic-cta { font-size: 13px; margin-top: 2px; }
.aic-en-pagina.is-open .aic-caja { grid-template-columns: minmax(0, 1fr) minmax(0, 440px); }
.aic-en-pagina.is-open .aic-trigger { gap: 24px; }

/* Ventana compacta dentro del recuadro */
.aic-en-pagina .aic-panel {
  position: relative; top: auto; right: auto; z-index: auto; width: auto;
  height: 100%; min-height: 0; max-height: none; overflow: hidden;
  box-shadow: 6px 6px 0 #0e0e0f; animation: aic-pop .18s steps(3);
}
.aic-en-pagina .aic-panel-head { padding: 4px 6px 4px 12px; gap: 10px; border-bottom-width: 2px; }
.aic-en-pagina .aic-panel-head .aic-mini { width: 30px; height: 26px; }
.aic-en-pagina .aic-panel-title strong { font-size: 17px; }
.aic-en-pagina .aic-panel-title span { font-size: 11px; }
.aic-en-pagina .aic-nueva { height: 28px; font-size: 11px; }
.aic-en-pagina .aic-close { width: 36px; height: 36px; }
.aic-en-pagina .aic-cuerpo { display: block; position: relative; flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.aic-en-pagina .aic-log { position: static; overflow: visible; padding: 10px 12px 6px; gap: 8px; }
.aic-en-pagina .aic-log:empty { display: none; }
.aic-en-pagina .aic-msg { max-width: 94%; padding: 8px 10px; font-size: 14px; }
.aic-en-pagina .aic-chips { padding: 10px 12px 8px; gap: 6px; }
.aic-en-pagina .aic-chip { min-height: 34px; padding: 6px 10px; font-size: 13.5px; }
.aic-en-pagina .aic-form { padding: 8px 12px 6px; border-top-width: 2px; }
.aic-en-pagina .aic-input, .aic-en-pagina .aic-send { height: 38px; }
.aic-en-pagina .aic-aviso { padding: 0 12px 6px; font-size: 10.5px; line-height: 1.35; }

@media (max-width: 1100px) {
  .aic-en-pagina.is-open .aic-title { font-size: 26px; }
  .aic-en-pagina.is-open .aic-desc { font-size: 14px; }
}
/* Pantallas estrechas: la ventana ocupa el sitio de la tarjeta, con la misma altura */
@media (max-width: 900px) {
  .aic-en-pagina.is-open .aic-caja { grid-template-columns: minmax(0, 1fr); }
  .aic-en-pagina.is-open .aic-trigger { display: none; }
}

/* ---------- Móvil ---------- */
@media (max-width: 640px) {
  .aic-panel { inset: 0; width: auto; max-height: none; border: 0; box-shadow: none; }
  .aic-input { font-size: 16px; }   /* 16 px: el iPhone no amplía la página al escribir */
  .asis-g { padding: 36px 0 16px; }
  .aic-caja { --aic-alto: 320px; padding: 10px; }
  .aic-en-pagina .aic-trigger { flex-direction: column; justify-content: flex-start; gap: 10px; padding: 0 12px 12px; text-align: center; }
  .aic-en-pagina .aic-figure { width: 112px; height: 98px; margin-top: 74px; }
  .aic-en-pagina .aic-stage { transform: scale(.5); }
  .aic-en-pagina .aic-copy { align-items: center; gap: 6px; }
  .aic-en-pagina .aic-title { font-size: 26px; }
  .aic-en-pagina .aic-desc { display: none; }
  .aic-en-pagina .aic-panel { inset: auto; border: 3px solid var(--aic-muted); box-shadow: none; }
  .aic-en-pagina .aic-panel-title span { display: none; }
}

/* ---------- Movimiento reducido ---------- */
@media (prefers-reduced-motion: reduce) {
  .aic *, .aic-drones.is-floating { animation: none !important; transition: none !important; }
  .aic-cell, .aic-eye-shut, .aic-m-shut, .aic-m-cell { opacity: 0 !important; }
  .aic-eye, .aic-eye-wink { opacity: 1 !important; }
}

/* ---------- Animaciones ---------- */
@keyframes aic-pop { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes aic-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes aic-qfloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes aic-cursor { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }
@keyframes aic-cell { 0%, 4.5% { opacity: 1; } 5%, 100% { opacity: 0; } }
@keyframes aic-cell-fast { 0%, 9% { opacity: 1; } 10%, 100% { opacity: 0; } }
@keyframes aic-eye { 0%, 59% { opacity: 0; } 60%, 94% { opacity: 1; } 95%, 100% { opacity: 0; } }
@keyframes aic-eye-wink { 0%, 59% { opacity: 0; } 60%, 77% { opacity: 1; } 78%, 81% { opacity: 0; } 82%, 94% { opacity: 1; } 95%, 100% { opacity: 0; } }
@keyframes aic-eye-shut { 0%, 77% { opacity: 0; } 78%, 81% { opacity: 1; } 82%, 100% { opacity: 0; } }
@keyframes aic-wink-now { 0%, 40% { opacity: 1; } 41%, 58% { opacity: 0; } 59%, 100% { opacity: 1; } }
@keyframes aic-shut-now { 0%, 40% { opacity: 0; } 41%, 58% { opacity: 1; } 59%, 100% { opacity: 0; } }
@keyframes aic-m-wink { 0%, 77% { opacity: 1; } 78%, 81% { opacity: 0; } 82%, 100% { opacity: 1; } }
@keyframes aic-m-shut { 0%, 77% { opacity: 0; } 78%, 81% { opacity: 1; } 82%, 100% { opacity: 0; } }

/* ---------- Sugerencia con iniciativa discreta: bocadillo bajo el cubo de la cabecera ---------- */
.aic-sug { position: fixed; z-index: 60; width: max-content; max-width: min(300px, calc(100vw - 24px)); padding: 14px 42px 10px 16px; background: #1a1a1b; color: #fff; border: 1px solid rgba(255,255,255,.14); box-shadow: 0 18px 40px -18px rgba(0,0,0,.6); animation: aic-sug-entra .35s ease-out both; }
.aic-sug::before { content: ""; position: absolute; top: -7px; right: var(--aic-flecha, 18px); width: 12px; height: 12px; background: #1a1a1b; border-left: 1px solid rgba(255,255,255,.14); border-top: 1px solid rgba(255,255,255,.14); transform: rotate(45deg); }
.aic-sug-txt { display: block; min-height: 24px; padding: 0; background: none; border: 0; color: #fff; font: inherit; font-size: 15px; line-height: 1.45; text-align: left; cursor: pointer; }
.aic-sug-txt::after { content: " \2192"; color: #ff9358; }
.aic-sug-txt:hover, .aic-sug-txt:focus-visible { text-decoration: underline; text-underline-offset: 3px; }
.aic-sug-x { position: absolute; top: 6px; right: 6px; width: 30px; height: 30px; display: grid; place-items: center; padding: 0; background: none; border: 0; color: #c2c2ca; cursor: pointer; }
.aic-sug-x svg { width: 14px; height: 14px; }
.aic-sug-x:hover { color: #fff; }
.aic-sug-nunca { display: inline-block; min-height: 24px; margin-top: 4px; padding: 0; background: none; border: 0; color: #a9a9b3; font: inherit; font-size: 12px; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.aic-sug-nunca:hover { color: #fff; }
.aic-sug.is-saliendo { opacity: 0; transform: translateY(-4px); transition: opacity .25s, transform .25s; }
@keyframes aic-sug-entra { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
/* Saludo del cubo de la cabecera al ofrecer una sugerencia: bote con aplastamiento, balanceo, guiño y casillas encendidas */
.aic-cab.is-hinting .aic-cab-btn { animation: aic-saludo 1.6s ease-in-out; transform-origin: 50% 100%; }
.aic-cab.is-hinting .aic-m-wink { animation: aic-wink-now 1.6s steps(1, end) 1; }
.aic-cab.is-hinting .aic-m-shut { animation: aic-shut-now 1.6s steps(1, end) 1; }
.aic-cab.is-hinting .aic-m-cell { animation: aic-cell-fast .8s steps(1, end) 2; animation-delay: calc(var(--i) * .12s); }
@keyframes aic-saludo {
  0%, 100% { transform: none; }
  12% { transform: translateY(-9px) scale(1.06); }
  24% { transform: translateY(0) scale(1.08, .9); }
  34% { transform: translateY(-5px) rotate(-12deg); }
  48% { transform: translateY(-3px) rotate(10deg); }
  62% { transform: translateY(-1px) rotate(-7deg); }
  76% { transform: rotate(4deg); }
  88% { transform: rotate(-2deg); }
}
@media (prefers-reduced-motion: reduce) {
  .aic-sug { animation: none; }
  .aic-sug.is-saliendo { transition: none; }
  .aic-cab.is-hinting .aic-cab-btn, .aic-cab.is-hinting .aic-m-cell { animation: none; }
}

/* ---------- Paseo del cubo con patitas (portada) ---------- */
.aic-paseante { --aic-accent: #cd7c56; position: fixed; left: 0; top: 0; z-index: 61; pointer-events: none; will-change: transform; }
.aic-paseante .aic-mini { display: block; filter: drop-shadow(0 0 1.5px rgba(255,255,255,.95)) drop-shadow(0 6px 6px rgba(0,0,0,.3)); }
.aic-paseante.is-andando .aic-pata-a, .aic-paseante.is-andando .aic-pata-b { animation: aic-paso .5s steps(2, end) infinite; }
.aic-paseante.is-andando .aic-pata-b { animation-delay: -.25s; }
@keyframes aic-paso { 0% { transform: translateY(0); } 50% { transform: translateY(-1.5px); } }
.aic-paseante .aic-m-wink { animation: aic-m-wink 2.5s steps(1, end) infinite; }
.aic-paseante .aic-m-shut { animation: aic-m-shut 2.5s steps(1, end) infinite; }

/* ---------- Globo de cómic de la portada ---------- */
.aic-sug.aic-globo { background: #fff; color: #1a1a1b; border: 2.5px solid #1a1a1b; border-radius: 22px; padding: 12px 40px 8px 18px; max-width: min(270px, calc(100vw - 24px)); box-shadow: 4px 4px 0 #1a1a1b; transform-origin: 85% 0; animation: aic-globo-pop .5s cubic-bezier(.2, 1.5, .4, 1) both; }
.aic-sug.aic-globo.a-la-derecha { transform-origin: 0 50%; }
.aic-globo .aic-sug-txt { color: #1a1a1b; font-weight: 700; font-size: 16.5px; line-height: 1.3; }
.aic-globo .aic-sug-txt::after { content: none; }
.aic-globo .aic-sug-x { color: #1a1a1b; top: 5px; right: 5px; }
.aic-globo .aic-sug-x:hover { color: #a4552f; }
.aic-globo .aic-sug-nunca { color: #4a4a52; }
.aic-globo .aic-sug-nunca:hover { color: #1a1a1b; }
/* Rabito del globo: triángulo negro (borde) con otro blanco encima; debajo del cubo apunta hacia arriba */
.aic-sug.aic-globo::before { top: -15px; right: var(--aic-flecha, 18px); width: 0; height: 0; background: none; border: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 15px solid #1a1a1b; transform: none; }
.aic-sug.aic-globo::after { content: ""; position: absolute; top: -10px; right: calc(var(--aic-flecha, 18px) + 3.5px); width: 0; height: 0; border-left: 6.5px solid transparent; border-right: 6.5px solid transparent; border-bottom: 11px solid #fff; }
/* A la derecha del cubo, el rabito sale del lado izquierdo y apunta al cubo */
.aic-sug.aic-globo.a-la-derecha::before { top: 50%; right: auto; left: -16px; margin-top: -10px; border: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-right: 16px solid #1a1a1b; }
.aic-sug.aic-globo.a-la-derecha::after { top: 50%; right: auto; left: -10.5px; margin-top: -6.5px; border: 0; border-top: 6.5px solid transparent; border-bottom: 6.5px solid transparent; border-right: 11.5px solid #fff; }
@keyframes aic-globo-pop { 0% { opacity: 0; transform: scale(.4) rotate(-8deg); } 65% { opacity: 1; transform: scale(1.07) rotate(1deg); } 100% { opacity: 1; transform: scale(1) rotate(-1.5deg); } }
@media (prefers-reduced-motion: reduce) { .aic-sug.aic-globo { animation: none; transform: rotate(-1.5deg); } }
.aic-sug.aic-globo.is-saliendo { animation: aic-globo-sale .25s ease-in forwards; }
@keyframes aic-globo-sale { to { opacity: 0; transform: scale(.85) rotate(-1.5deg); } }
@media (prefers-reduced-motion: reduce) { .aic-sug.aic-globo.is-saliendo { animation: none; } }