/* ============================================================
   VIRTUAL ESTATE — Adaptación móvil (archivo AÑADIDO, no toca tu código)
   Cárgalo DESPUÉS de los estilos de la página:
   <link rel="stylesheet" href="ve-mobile.css" />
   Breakpoints: 820px (tablet) · 640px (móvil) · 480px (móvil chico)
   ============================================================ */

/* ---------- Base defensiva ---------- */
html, body { overflow-x: clip; }
img, video, svg { max-width: 100%; height: auto; }

/* ---------- Cursor custom: fuera en pantallas táctiles ---------- */
@media (hover: none), (pointer: coarse) {
  .ve-cursor, .ve-cursor-dot { display: none !important; }
  * { cursor: auto !important; }
  /* En táctil no hay hover: mostrar siempre la info de los proyectos */
  .ve-work__meta { opacity: 1 !important; transform: none !important; }
  .ve-work__hover { opacity: 0 !important; }
}

/* ============================================================
   ≤ 820px — tablet vertical / móvil grande
   ============================================================ */
@media (max-width: 820px) {

  /* NAV: fuera links de escritorio; queda logo + idioma + CTA */
  .ve-nav__links { display: none !important; }
  .ve-nav__inner { padding: 0 16px !important; gap: 12px !important; }
  .ve-nav__cta { padding: 10px 14px !important; font-size: 10px !important; }

  /* Nav editorial (píldora de cristal): en móvil queda
     logo + selector ES/EN + botón de cotización, en UNA fila */
  .editorial-nav { max-width: calc(100vw - 20px); }
  .editorial-nav .liquid-glass { gap: 10px !important; padding: 7px 10px !important; }
  .editorial-nav .liquid-glass [class~="w-px"] { display: none !important; }      /* divisores */
  .editorial-nav .liquid-glass [class~="gap-5"] { display: none !important; }     /* links escritorio */
  .editorial-nav .liquid-glass [class~="gap-3"] > a:not([class*="liquid-glass-strong"]) { display: none !important; } /* "Iniciar sesión" */
  .editorial-nav .liquid-glass [class*="liquid-glass-strong"] { padding: 7px 12px !important; font-size: 12px !important; white-space: nowrap; }
  .editorial-nav [class~="tracking-\[0\.28em\]"] { letter-spacing: .16em !important; font-size: 10px !important; }

  /* Barra inferior del hero: fuera párrafos laterales,
     CTAs centrados en flujo normal (sin absolute) */
  .hero-editorial [class~="bottom-12"] { flex-direction: column !important; align-items: center !important; gap: 12px; padding: 0 20px !important; }
  .hero-editorial [class~="bottom-12"] > p { display: none !important; }
  .hero-editorial [class~="bottom-12"] > div { position: static !important; transform: none !important; flex-wrap: wrap; justify-content: center; }
  /* HUD del hero (timecode y REC, líneas superiores) fuera en móvil */
  .hero-editorial [class~="top-24"] { display: none !important; }
  .rec-dot { display: none !important; }
  /* Ticker del hero: se esconde para no pisar los botones */
  .hero-editorial [class~="bottom-32"] { display: none !important; }

  /* HERO editorial */
  .hero-editorial { min-height: 620px !important; }
  .ve-hero__copy { margin-left: 0 !important; padding: 0 18px; max-width: 100% !important; }
  .ve-hero__lead { font-size: 15px !important; max-width: 42ch !important; }
  .ve-hero__ctas { flex-wrap: wrap; gap: 12px !important; }
  .ve-hero__strip { flex-wrap: wrap; gap: 20px 28px !important; margin-top: 36px !important; }
  .ve-hero__hud, .frame-corner { display: none !important; }

  /* Secciones: respiración móvil */
  .ve-svc, .ve-work, .ve-stats, .ve-team, .ve-cta, .ve-foot {
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-top: 72px !important;
    padding-bottom: 72px !important;
  }

  /* Servicios: switch de fases usable con el dedo */
  .ve-svc__phaseSwitch { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .ve-svc__phase { flex: 1 1 auto; white-space: nowrap; }
  .ve-svc__row { gap: 10px !important; }
  .ve-svc__row-tag { display: none; }

  /* Historia / journey: 6 columnas → 2 */
  .ve-journey__list { grid-template-columns: 1fr 1fr !important; gap: 28px 20px !important; }
  .ve-journey__list::before { display: none !important; }
  .ve-journey__step { padding: 0 !important; }

  /* Stats de fondo gigantes: contener */
  .ve-stats__bg span { font-size: 90px !important; }
}

/* ============================================================
   ≤ 640px — móvil
   ============================================================ */
@media (max-width: 640px) {

  /* Titulares a escala de teléfono */
  :root { --fs-hero: clamp(2.5rem, 11.5vw, 3.4rem) !important; }
  .hero-title { line-height: 1 !important; }
  .ve-svc__title, .ve-cta__title { font-size: clamp(2rem, 9vw, 2.8rem) !important; }
  .ve-work__title, .ve-team__title { font-size: clamp(1.9rem, 8.5vw, 2.6rem) !important; }

  /* Ticker superior más discreto */
  .ticker-track { font-size: 10px !important; }

  /* Galería de trabajos: 1 columna */
  .ve-work__grid { grid-template-columns: 1fr !important; gap: 14px !important; }
  .ve-work__tile, .ve-work__tile--wide, .ve-work__tile--tall {
    grid-column: auto !important; grid-row: auto !important;
    min-height: 240px;
  }

  /* Stats: 1 columna, números contenidos */
  .ve-stats__row { grid-template-columns: 1fr !important; gap: 32px !important; }
  .ve-stats__num { font-size: 64px !important; }
  .ve-stats__bg { display: none !important; }

  /* Equipo / fundador */
  .ve-founder { max-width: 100% !important; }
  .ve-team__headRow { grid-template-columns: 1fr !important; gap: 20px !important; align-items: start !important; }

  /* Formulario CTA */
  .ve-cta__form button { width: 100%; }

  /* Footer */
  .ve-foot__cols { grid-template-columns: 1fr 1fr !important; gap: 28px !important; }
  .ve-foot__bar { flex-direction: column; gap: 10px; align-items: flex-start; }
}

/* ============================================================
   ≤ 480px — móvil chico
   ============================================================ */
@media (max-width: 480px) {
  .ve-nav__word { font-size: 13px !important; }
  .ve-hero__stat-n { font-size: 26px !important; }
  .ve-hero__strip { gap: 16px 22px !important; }

  .ve-journey__list { grid-template-columns: 1fr !important; }
  .ve-journey__step { border-bottom: 1px solid rgba(0,32,96,0.08); padding-bottom: 18px !important; }
  .ve-journey__step:last-child { border-bottom: none; }

  .ve-foot__cols { grid-template-columns: 1fr !important; }
  .ve-svc__preview-copy h3 { font-size: 18px !important; }
  .lang-toggle button { padding: 6px 12px !important; }
}