/* ============================================================
   Motor de transición IMMOBILIARE — velo compartido (home <-> secciones)
   Reproduce el lenguaje del demo: retícula que se traza (velocidades
   convergentes), negro->blanco desde el home, clarito->clarito entre internas,
   salida (líneas se retraen) + entrada (líneas se trazan) con empalme continuo.
   ============================================================ */

/* desactiva las llegadas viejas por página (este motor las reemplaza) */
.arrival, .arrival-grid{ display:none !important; }

/* cover ANTI-FLASH: cubre la sección hasta que el JS toma el control (failsafe a los 4s) */
html.vt-pending::before{ content:""; position:fixed; inset:0; z-index:8999; background:#fcfcfb; animation:vtFailsafe .3s ease 4s forwards; }
html.vt-pending.vt-dark::before{ background:#0b0a08; }
@keyframes vtFailsafe{ to{ opacity:0; visibility:hidden; } }

/* ---------- overlay del motor ---------- */
#vt{ position:fixed; inset:0; z-index:9000; pointer-events:none; }
#vt.hidden{ display:none; }
.vt-veil{ position:absolute; inset:0; opacity:1; transition:opacity .9s ease; }
#vt.light .vt-veil{ background:#fcfcfb; }
#vt.dark  .vt-veil{ background:#0b0a08; }
#vt.lift  .vt-veil{ opacity:0; }
.vt-grid{ position:absolute; inset:0; display:flex; padding:0 clamp(22px,5vw,80px); opacity:1; transition:opacity .5s ease; }
#vt.gridout .vt-grid{ opacity:0; }
.vt-grid > span{ flex:1; position:relative; }
.vt-grid > span::after, .vt-grid > span:first-child::before{ content:""; position:absolute; top:0; bottom:0; width:1px; background:rgba(199,163,95,.6); transform:scaleY(0);
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent); mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent); }
.vt-grid > span::after{ right:0; } .vt-grid > span:first-child::before{ left:0; }
.vt-grid > span:nth-child(odd)::after{ transform-origin:top; } .vt-grid > span:nth-child(even)::after{ transform-origin:bottom; } .vt-grid > span:first-child::before{ transform-origin:bottom; }

/* ENTRADA: las líneas se TRAZAN (velocidades convergentes, delay+dur = 1.60s) */
#vt.drawn .vt-grid > span::after, #vt.drawn .vt-grid > span:first-child::before{ transform:scaleY(1); }
#vt.draw .vt-grid > span::after, #vt.draw .vt-grid > span:first-child::before{ transform:scaleY(1); transition:transform 1.85s cubic-bezier(.16,.8,.24,1); }
#vt.draw .vt-grid > span:nth-child(1)::after{ transition-delay:0s;   transition-duration:1.85s }
#vt.draw .vt-grid > span:nth-child(2)::after{ transition-delay:.37s; transition-duration:1.48s }
#vt.draw .vt-grid > span:nth-child(3)::after{ transition-delay:.16s; transition-duration:1.69s }
#vt.draw .vt-grid > span:nth-child(4)::after{ transition-delay:.51s; transition-duration:1.34s }
#vt.draw .vt-grid > span:nth-child(5)::after{ transition-delay:.26s; transition-duration:1.59s }
#vt.draw .vt-grid > span:nth-child(6)::after{ transition-delay:.45s; transition-duration:1.40s }
#vt.draw .vt-grid > span:first-child::before{ transition-delay:.09s; transition-duration:1.76s }

/* SALIDA: parten dibujadas y se RETRAEN más lento (~1.15s), para que no desaparezcan de golpe */
#vt.retract .vt-grid > span::after, #vt.retract .vt-grid > span:first-child::before{ transform:scaleY(0); transition:transform 1.15s cubic-bezier(.16,.8,.24,1); }

/* ---------- HOME: "Descubrir inmuebles" cobra vida al hover (el movimiento responde a la acción) ---------- */
.scrollcue{ pointer-events:auto !important; cursor:pointer; z-index:6; transition:transform 1.2s cubic-bezier(.2,.8,.2,1); }
.scrollcue:hover, .scrollcue.sc-hot{ transform:translateX(-50%) translateY(-6px); }                        /* aproximarse: la sección se levanta + la línea se anima (sin iluminar el texto) */
.scrollcue > span:first-child{ transition:color .55s ease, text-shadow .55s ease; }
.scrollcue > span:first-child:hover{ color:#f2e6c6; text-shadow:0 0 11px rgba(203,167,95,.5); }             /* el TEXTO se ILUMINA sólo con el cursor ENCIMA del texto (posterior a la animación) */
.scrollcue .line{ transform-origin:bottom; animation:scLineDraw 1.1s cubic-bezier(.2,.8,.2,1) 1.85s both; height:44px; position:relative; transition:height 1.2s cubic-bezier(.2,.8,.2,1), box-shadow 1.2s ease; }
.scrollcue .line::after{ content:""; position:absolute; left:-1px; width:3px; height:12px; top:-14px; opacity:0; border-radius:2px; background:radial-gradient(ellipse at center, rgba(255,239,200,.9), rgba(203,167,95,.35) 55%, transparent 75%); }
.scrollcue:hover .line, .scrollcue.sc-hot .line{ height:64px; box-shadow:0 0 12px 1px rgba(203,167,95,.34); }
.scrollcue:hover .line::after, .scrollcue.sc-hot .line::after{ animation:scGlide 1.4s cubic-bezier(.3,.1,.3,1); }
@keyframes scGlide{ 0%{ top:-14px; opacity:0 } 25%{ opacity:1 } 100%{ top:calc(100% - 6px); opacity:0 } }

/* ---------- HOME: ritmo de entrada del hero ----------
   logo "IMMOBILIARE" + "2026 · Villa Mercedes" aparecen JUNTOS y un poco más rápido;
   "Las grandes decisiones..." aparece después, MÁS LENTO y suave (aparece como desaparece). */
/* CADENCIA del hero: (1) logo+menú+"2026" juntos y rápido -> (2) el statement -> (3) al terminar el statement,
   aparece la LÍNEA -> (4) por último el texto "Descubrir inmuebles". Cada cosa en su lugar. */
.brandblock.fu, .navmenu.fu, .hero-est.fu{ animation-delay:.3s; animation-duration:2.1s; animation-timing-function:cubic-bezier(.4,0,.2,1); }   /* los tres AL UNÍSONO, más lento */
.hero-statement.fu{ animation:vtStatement 1.5s cubic-bezier(.4,0,.2,1) 1.3s both; }   /* la frase arranca antes (solapa a los tres, sin espacio muerto) */
@keyframes vtStatement{ 0%{ opacity:0; transform:translateY(-16px); filter:blur(3px) } 100%{ opacity:1; transform:none; filter:blur(0) } }
.scrollcue.fu{ animation:none; opacity:1; }                                  /* el contenedor no se desvanece; sus partes entran escalonadas */
.scrollcue > span:first-child{ opacity:0; animation:scText 1.0s ease 2.2s both; }   /* el texto "Descubrir inmuebles" (bastante antes) */
@keyframes scText{ from{ opacity:0; transform:translateY(6px) } to{ opacity:1; transform:none } }
@keyframes scLineDraw{ from{ opacity:0; transform:scaleY(.15) } to{ opacity:1; transform:scaleY(1) } }

/* logo del nav: MISMO tamaño en todo el sitio (consistencia de marca) + es link a Inicio */
.nav-logo{ width:170px !important; }
.logo-link{ display:inline-block; cursor:pointer; }

/* menú: los ítems se despliegan un poco más lento (era demasiado rápido) */
.navitem{ transition-duration:1.4s; }
/* SUBMENÚS (Arquitectura, Nosotros→Staff) — mismo look y velocidad que el home, en TODAS las páginas */
.submenu{ position:absolute; top:100%; left:50%; transform:translateX(-50%); padding-top:16px; display:flex; flex-direction:column; align-items:center; gap:13px; opacity:0; visibility:hidden; transition:opacity .6s ease, visibility .6s; white-space:nowrap; }
.navitem:hover .submenu{ opacity:1; visibility:visible; }
.submenu a{ font-family:var(--mono); font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mut); text-decoration:none; text-shadow:0 1px 6px rgba(0,0,0,.6); transition:color .6s ease; }
.submenu a:hover{ color:var(--gold); }

/* ===== HOVERS más lentos y suaves en TODO el sitio (eran .2-.5s = demasiado rápido) ===== */
.navitem > a, .submenu a, .seelink, .verficha, .adv a, .frecuentes a, .searchbtn,
.btn-ghost, .btn-consult, .wa, .foot-grid .col a, footer .col a, .rail a,
.card h3, .card .price, .fh .back, .next-txt .n, .cta-sub, .proj h3, .col a, .menu-slash line{ transition-duration:.6s !important; }
.field{ transition-duration:.6s !important; }
.disc{ transition:color .6s ease, padding-left .6s cubic-bezier(.2,.7,.2,1) !important; }
.disc::before{ transition:background .6s ease, box-shadow .6s ease !important; }
/* movimiento de las cards de destacados: más suave */
.card{ transition:transform .9s cubic-bezier(.2,.7,.2,1) !important; }
.card .img{ transition:box-shadow .9s ease !important; }
.card .img .layer{ transition:transform 1.5s cubic-bezier(.2,.7,.2,1), filter .8s ease !important; }

@media (prefers-reduced-motion:reduce){ #vt, html.vt-pending::before{ display:none !important; } }