/* ── Capa 3D de Abellis ─────────────────────────────────────────────────
   Profundidad sobre la identidad navy+oro de la plantilla: sombras en capas,
   elevación al pasar el ratón, brillo dorado sutil y relieve en las tarjetas.
   Nada de librerías: solo transform/box-shadow, y se apaga con
   prefers-reduced-motion. */

:root{
  --sombra-baja: 0 1px 2px rgba(1,42,80,.06), 0 4px 10px rgba(1,42,80,.07);
  --sombra-alta: 0 2px 4px rgba(1,42,80,.08), 0 12px 28px rgba(1,42,80,.14),
                 0 30px 60px rgba(1,42,80,.12);
  --brillo-oro: linear-gradient(120deg, transparent 30%, rgba(233,165,11,.10) 48%,
                transparent 62%);
}

/* Tarjetas con cuerpo: elevación y micro-inclinación al entrar el ratón. */
.tcard, .vcard, .resi-card, .tp-box, .why-c, .off-c, .svc-block,
.algo-step, .form-wrap{
  box-shadow: var(--sombra-baja);
  transition: transform .28s cubic-bezier(.2,.8,.25,1), box-shadow .28s ease;
  will-change: transform;
}
.tcard:hover, .vcard:hover, .resi-card:hover, .tp-box:hover, .why-c:hover,
.off-c:hover, .algo-step:hover{
  transform: translateY(-6px) perspective(900px) rotateX(1.6deg);
  box-shadow: var(--sombra-alta);
}

/* Borde superior con canto dorado en relieve, como pieza fresada. */
.why-c, .off-c, .tcard, .vcard{position:relative; overflow:hidden}
.why-c::after, .off-c::after, .tcard::after, .vcard::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background: var(--brillo-oro); background-size:220% 100%;
  background-position: 120% 0; transition: background-position .6s ease;
}
.why-c:hover::after, .off-c:hover::after, .tcard:hover::after, .vcard:hover::after{
  background-position: -20% 0;
}

/* El hero gana atmósfera: halo dorado que respira detrás del titular. */
.hero{perspective:1000px}
.hero::before{animation: halo 9s ease-in-out infinite alternate}
@keyframes halo{from{transform:scale(1) translateY(0)}to{transform:scale(1.15) translateY(24px)}}

/* Botones con peso físico. */
.btn{box-shadow: 0 2px 0 rgba(1,42,80,.18), 0 8px 18px rgba(1,42,80,.12)}
.btn:active{transform: translateY(2px); box-shadow: 0 0 0 rgba(0,0,0,0), 0 3px 8px rgba(1,42,80,.14)}
.btn-gold{box-shadow: 0 2px 0 #b57f06, 0 10px 22px rgba(233,165,11,.32)}

/* La navegación flota como lámina de vidrio. */
nav{box-shadow: 0 6px 24px rgba(1,42,80,.07)}

@media (prefers-reduced-motion: reduce){
  .tcard, .vcard, .resi-card, .tp-box, .why-c, .off-c, .svc-block, .algo-step,
  .form-wrap{transition:none}
  .hero::before{animation:none}
}

/* ── Avisos flash de los formularios ── */
.avisos-flash{position:fixed;top:84px;left:50%;transform:translateX(-50%);z-index:90;
  display:grid;gap:8px;width:min(560px,92vw)}
.aviso{padding:13px 18px;border-radius:12px;font-family:var(--body);font-size:.93rem;
  box-shadow:var(--sombra-alta);background:var(--card);border:1px solid var(--line);
  animation:aviso-entra .35s ease}
.aviso.success{border-left:4px solid var(--green)}
.aviso.danger{border-left:4px solid #b3261e}
@keyframes aviso-entra{from{opacity:0;transform:translateY(-8px)}to{opacity:1}}

/* ── Widget del asistente ── */
#chat-burbuja{position:fixed;right:20px;bottom:20px;z-index:95;width:58px;height:58px;
  border-radius:50%;border:0;cursor:pointer;background:linear-gradient(145deg,var(--navy),var(--navy-deep));
  color:#fff;font-size:1.5rem;display:grid;place-items:center;
  box-shadow:0 4px 0 rgba(1,26,48,.5), 0 14px 30px rgba(1,42,80,.35);
  transition:transform .2s ease}
#chat-burbuja:hover{transform:translateY(-3px) scale(1.05)}
#chat-caja{position:fixed;right:20px;bottom:90px;z-index:95;width:min(360px,92vw);
  background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;
  box-shadow:var(--sombra-alta);display:none;flex-direction:column;max-height:70vh}
#chat-caja.abierto{display:flex}
#chat-cab{background:linear-gradient(150deg,var(--navy-deep),var(--navy));color:#fff;
  padding:14px 18px;font-family:var(--disp);font-weight:600}
#chat-cab small{display:block;font-family:var(--body);font-weight:400;font-size:.74rem;opacity:.75}
#chat-hilo{flex:1;overflow-y:auto;padding:14px;display:grid;gap:10px;align-content:start;
  background:var(--bg);min-height:180px}
.chat-msg{max-width:85%;padding:10px 14px;border-radius:14px;font-size:.9rem;line-height:1.45;
  box-shadow:var(--sombra-baja);white-space:pre-wrap}
.chat-msg.yo{justify-self:end;background:var(--navy);color:#fff;border-bottom-right-radius:4px}
.chat-msg.bot{justify-self:start;background:var(--card);border:1px solid var(--line);
  border-bottom-left-radius:4px}
.chat-msg.pensando{color:var(--slate);font-style:italic}
#chat-pie{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line);background:var(--card)}
#chat-texto{flex:1;border:1.6px solid var(--line);border-radius:10px;padding:10px 12px;
  font-family:var(--body);font-size:.9rem}
#chat-texto:focus{outline:none;border-color:var(--navy)}
#chat-envia{border:0;border-radius:10px;padding:0 16px;cursor:pointer;
  background:var(--gold);color:var(--navy-deep);font-family:var(--disp);font-weight:600}

/* Honeypot anti-bots: invisible para personas, irresistible para bots. */
.hp-campo{position:absolute !important;left:-9999px !important;top:-9999px !important;
  height:1px;width:1px;overflow:hidden}
