/* ============================================================ */
/* CONTACTO -- capa de entrada del "Expediente de cotizacion"    */
/* (2026-08-24).                                                 */
/*                                                               */
/* Una sola entrada editorial, de una sola pasada, que NO se     */
/* repite al desplazarse. Ocho pasos con desfase leve:           */
/*   1 encabezado fotografico                                    */
/*   2 kicker  ·  3 titular + bajada                             */
/*   4 datos de contacto  ·  5 que necesitas                     */
/*   6 ubicacion  ·  7 antecedentes  ·  8 cierre                 */
/* El ultimo paso arranca a 440 ms y dura 300 ms: la entrada     */
/* cierra a ~740 ms, dentro del rango pedido de 550-750 ms.      */
/*                                                               */
/* Este archivo y su JS NUNCA tocan el envio, las validaciones,  */
/* el honeypot, el timestamp, la subida de archivo, Turnstile ni */
/* los estados de exito/error. Tampoco tocan las cascadas de     */
/* categoria/producto/formato ni region/comuna, que viven en     */
/* contacto-expediente.js.                                       */
/*                                                               */
/* SEGURIDAD SIN JS: el estado por defecto es SIEMPRE visible    */
/* (opacity:1). Solo se oculta para animar cuando el script      */
/* confirmo que esta vivo y agrego .ct-ready. Si no carga, o si  */
/* el visitante desactivo JavaScript, estas reglas nunca aplican */
/* y ningun contenido esencial queda en opacity:0.               */
/* ============================================================ */

[data-ct-in]{ opacity:1; transform:none; }

@media (prefers-reduced-motion:no-preference){
  .ct-main.ct-ready [data-ct-in]{
    opacity:0; transform:translateY(10px); transition:none;
  }
  .ct-main.ct-ready.is-in [data-ct-in]{
    opacity:1; transform:none;
    transition:opacity .30s cubic-bezier(.16,.76,.24,1), transform .30s cubic-bezier(.16,.76,.24,1);
  }

  .ct-main.ct-ready.is-in [data-ct-in="1"]{ transition-delay:0ms; }
  .ct-main.ct-ready.is-in [data-ct-in="2"]{ transition-delay:80ms; }
  .ct-main.ct-ready.is-in [data-ct-in="3"]{ transition-delay:140ms; }
  .ct-main.ct-ready.is-in [data-ct-in="4"]{ transition-delay:210ms; }
  .ct-main.ct-ready.is-in [data-ct-in="5"]{ transition-delay:270ms; }
  .ct-main.ct-ready.is-in [data-ct-in="6"]{ transition-delay:330ms; }
  .ct-main.ct-ready.is-in [data-ct-in="7"]{ transition-delay:390ms; }
  .ct-main.ct-ready.is-in [data-ct-in="8"]{ transition-delay:440ms; }

  /* El encabezado no se desplaza: se asienta. Un acercamiento minimo    */
  /* de la propia fotografia, una sola vez, sin barridos ni mascaras.    */
  .ct-main.ct-ready [data-ct-in="1"]{ opacity:0; transform:none; }
  .ct-main.ct-ready [data-ct-in="1"] img{ transform:scale(1.026); transition:none; }
  .ct-main.ct-ready.is-in [data-ct-in="1"] img{
    transform:scale(1);
    transition:transform .66s cubic-bezier(.16,.76,.24,1);
  }

  /* Filete rojo superior del marco: se traza de izquierda a derecha una */
  /* sola vez, acompanando la entrada del encabezado.                    */
  .ct-main.ct-ready .exp-frame{ border-top-color:transparent; }
  .ct-main.ct-ready .exp-frame::before{
    content:''; display:block; height:3px; margin:-3px -1px 0; width:0;
    background:var(--brick);
  }
  .ct-main.ct-ready.is-in .exp-frame::before{
    width:calc(100% + 2px);
    transition:width .52s cubic-bezier(.65,0,.15,1);
  }
}
