/* ===================================================================
   SENDARO · Animaciones minimalistas de contenido
   (Se incluye SOLO en Home, Galería, Cómo funciona y Sobre — NO en el configurador)
   =================================================================== */
@media (prefers-reduced-motion: no-preference){

  /* ---- Entrada escalonada en carga (heros y cabeceras) ----
     Solo transform (sin opacity) para que el contenido NUNCA quede oculto. */
  @keyframes sdRise{ from{ transform:translateY(24px); } to{ transform:none; } }
  .hero .wrap > *,
  .shero .wrap > *,
  .ghead > *{
    animation:sdRise .85s var(--ease) both;
  }
  .hero .wrap > *:nth-child(1),.shero .wrap > *:nth-child(1),.ghead > *:nth-child(1){ animation-delay:.06s; }
  .hero .wrap > *:nth-child(2),.shero .wrap > *:nth-child(2),.ghead > *:nth-child(2){ animation-delay:.16s; }
  .hero .wrap > *:nth-child(3),.shero .wrap > *:nth-child(3),.ghead > *:nth-child(3){ animation-delay:.26s; }
  .hero .wrap > *:nth-child(4),.shero .wrap > *:nth-child(4),.ghead > *:nth-child(4){ animation-delay:.36s; }
  .hero .wrap > *:nth-child(5),.shero .wrap > *:nth-child(5),.ghead > *:nth-child(5){ animation-delay:.46s; }
  .hero .wrap > *:nth-child(6){ animation-delay:.56s; }

  /* ---- El guion naranja "se dibuja" al revelar la sección ---- */
  .reveal .dash{ transform:scaleX(0); transform-origin:left center; transition:transform .8s var(--ease) .12s; }
  .reveal.in .dash{ transform:scaleX(1); }
  /* dashes del hero/cabecera (animados en carga) parten dibujados */
  .hero .dash, .shero .dash, .ghead .dash{ transform:none; }

  /* ---- Reveal: easing más suave + escalonado interno de detalles ---- */
  .reveal{ transition:transform 1s var(--ease); }
  .showcase__detail .detail,
  .vals .val,
  .fab .fab__c{ transform:translateY(16px); transition:transform .8s var(--ease); }
  .reveal.in .showcase__detail .detail,
  .reveal.in .vals .val{ transform:none; }
  .reveal.in.vals .val,
  .vals.reveal.in .val{ transform:none; }
  .showcase__detail .detail:nth-child(2){ transition-delay:.08s; }
  .showcase__detail .detail:nth-child(3){ transition-delay:.16s; }
  .showcase__detail .detail:nth-child(4){ transition-delay:.24s; }
  .vals.reveal.in .val:nth-child(2){ transition-delay:.1s; }
  .vals.reveal.in .val:nth-child(3){ transition-delay:.2s; }

  /* ---- Subrayado animado en la navegación ---- */
  .nav__links a{
    background-image:linear-gradient(var(--orange),var(--orange));
    background-size:0% 1.5px; background-position:0 100%; background-repeat:no-repeat;
    padding-bottom:3px; transition:background-size .38s var(--ease), color .25s;
  }
  .nav__links a:hover{ background-size:100% 1.5px; }

  /* ---- Flotación lenta y sutil del lema del hero ---- */
  @keyframes sdFloat{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-7px);} }
  .hero__tag{ animation:sdFloat 6.5s ease-in-out infinite; }

  /* ---- CTA: el punto/acento respira muy levemente ---- */
  @keyframes sdPulse{ 0%,100%{ opacity:.85;} 50%{ opacity:1;} }
  .cta .o, .mani .o{ animation:sdPulse 4.5s ease-in-out infinite; }

  /* ---- Botones primarios: brillo sutil al hover ---- */
  .btn--primary{ position:relative; overflow:hidden; }
  .btn--primary::after{
    content:""; position:absolute; inset:0; transform:translateX(-130%) skewX(-18deg);
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent);
    transition:transform .65s var(--ease);
  }
  .btn--primary:hover::after{ transform:translateX(130%) skewX(-18deg); }
}