/* ============================================================
   saas-index.css - /saas/ : CATALOGUE / GRILLE 6 PRODUITS
   Narratif : "Aucun mock-up. Que des produits opérés au quotidien".
   6 SaaS au catalogue, 5 en production, 1 en construction.

   Effets distincts : grille de dots qui s'allume tile par tile,
   em underline rapide, 6 cards reveal en grille avec spotlight
   intensifie sur hover.
   ============================================================ */

.page-saas-index { --si-ease-out: cubic-bezier(.23, 1, .32, 1); }
.page-saas-index { overflow-x: clip; }

/* Mesh : grille de points qui s'allume (catalogue) */
.page-saas-index .idx3-page-hero__mesh::before {
  background:
    radial-gradient(circle at 25% 25%, var(--lume-1) 0%, transparent 60%),
    radial-gradient(circle at 75% 75%, var(--lume-1) 0%, transparent 60%);
  animation: saasIdxGrid 8s ease-in-out infinite;
}
@keyframes saasIdxGrid {
  0%, 100% { opacity: .6; }
  50%      { opacity: 1; }
}

/* Title + em : reveal + underline draw rapide */
.page-saas-index .idx3-page-hero__title {
  opacity: 0; transform: translateY(10px);
  animation: saasIdxTitle .9s var(--si-ease-out) 200ms forwards;
}
@keyframes saasIdxTitle { to { opacity: 1; transform: translateY(0); } }

.page-saas-index .idx3-page-hero__title em {
  position: relative;
  display: inline-block;
  font-style: italic;
  color: var(--lume-1);
}
.page-saas-index .idx3-page-hero__title em::after {
  content: "";
  position: absolute;
  left: 0; right: 0;
  bottom: 2px;
  height: 2px;
  background: var(--lume-1);
  transform: scaleX(0);
  transform-origin: left;
  animation: saasIdxUnderline .55s var(--si-ease-out) 1300ms forwards;
}
@keyframes saasIdxUnderline { to { transform: scaleX(1); } }

.page-saas-index .idx3-page-hero__lead {
  opacity: 0;
  animation: saasIdxFade 1s var(--si-ease-out) 700ms forwards;
}
@keyframes saasIdxFade { to { opacity: 1; } }

.page-saas-index .idx3-page-hero__meta > div {
  opacity: 0; transform: translateY(6px);
  animation: saasIdxMeta .5s var(--si-ease-out) forwards;
}
.page-saas-index .idx3-page-hero__meta > div:nth-child(1) { animation-delay: 1100ms; }
.page-saas-index .idx3-page-hero__meta > div:nth-child(2) { animation-delay: 1180ms; }
.page-saas-index .idx3-page-hero__meta > div:nth-child(3) { animation-delay: 1260ms; }
.page-saas-index .idx3-page-hero__meta > div:nth-child(4) { animation-delay: 1340ms; }
@keyframes saasIdxMeta { to { opacity: 1; transform: translateY(0); } }

/* Facts row */
.page-saas-index .idx3-facts-row > div {
  opacity: 0; transform: translateY(8px);
  transition: opacity .5s var(--si-ease-out), transform .5s var(--si-ease-out);
}
.page-saas-index .idx3-facts-row.in > div { opacity: 1; transform: translateY(0); }
.page-saas-index .idx3-facts-row.in > div:nth-child(1) { transition-delay: 100ms; }
.page-saas-index .idx3-facts-row.in > div:nth-child(2) { transition-delay: 180ms; }
.page-saas-index .idx3-facts-row.in > div:nth-child(3) { transition-delay: 260ms; }
.page-saas-index .idx3-facts-row.in > div:nth-child(4) { transition-delay: 340ms; }
.page-saas-index .idx3-facts-row.in > div:nth-child(5) { transition-delay: 420ms; }

/* Section title + num */
.page-saas-index .idx3-page-section.reveal .idx3-page-section__num,
.page-saas-index .idx3-page-section.reveal .idx3-page-section__title,
.page-saas-index .idx3-page-section.reveal .idx3-page-section__lead {
  opacity: 0; transform: translateY(8px);
  transition: opacity .65s var(--si-ease-out), transform .65s var(--si-ease-out);
}
.page-saas-index .idx3-page-section.reveal.in .idx3-page-section__num { opacity: 1; transform: translateY(0); transition-delay: 60ms; }
.page-saas-index .idx3-page-section.reveal.in .idx3-page-section__title { opacity: 1; transform: translateY(0); transition-delay: 160ms; }
.page-saas-index .idx3-page-section.reveal.in .idx3-page-section__lead { opacity: 1; transform: translateY(0); transition-delay: 280ms; }

/* CATALOGUE 6 CARDS - "cartes lancees sur la table" (modele IA)
   Departs lointains, rotations marquees, blur, delais desynchronises. */
.page-saas-index #catalogue.reveal .idx3-modules > .idx3-module {
  opacity: 0;
  transform: var(--si-cat-from, translateY(120px));
  filter: blur(6px);
  transition:
    opacity 1s var(--si-ease-out),
    transform 1.15s var(--si-ease-out),
    filter .9s var(--si-ease-out),
    border-color .35s var(--si-ease-out);
}
.page-saas-index #catalogue.reveal.in .idx3-modules > .idx3-module {
  opacity: 1;
  transform: translate(0, 0) rotate(0);
  filter: blur(0);
}
.page-saas-index #catalogue .idx3-modules > .idx3-module:nth-child(1) { --si-cat-from: translate(-180px, -120px) rotate(-9deg);  transition-delay:  80ms; }
.page-saas-index #catalogue .idx3-modules > .idx3-module:nth-child(2) { --si-cat-from: translate( 160px, -160px) rotate( 11deg); transition-delay: 360ms; }
.page-saas-index #catalogue .idx3-modules > .idx3-module:nth-child(3) { --si-cat-from: translate(-140px,  180px) rotate(  7deg); transition-delay: 180ms; }
.page-saas-index #catalogue .idx3-modules > .idx3-module:nth-child(4) { --si-cat-from: translate( 170px,  150px) rotate(-10deg); transition-delay: 540ms; }
.page-saas-index #catalogue .idx3-modules > .idx3-module:nth-child(5) { --si-cat-from: translate(-200px,  -40px) rotate( -6deg); transition-delay: 260ms; }
.page-saas-index #catalogue .idx3-modules > .idx3-module:nth-child(6) { --si-cat-from: translate( 130px,  200px) rotate( 12deg); transition-delay: 440ms; }

@media (prefers-reduced-motion: reduce) {
  .page-saas-index #catalogue.reveal .idx3-modules > .idx3-module,
  .page-saas-index #catalogue.reveal.in .idx3-modules > .idx3-module {
    opacity: 1; transform: none; filter: none; transition: none;
  }
}

/* Hover spotlight intensifie (signature catalogue interactif) */
.page-saas-index #catalogue .idx3-module:hover {
  border-color: var(--lume-1);
  transform: translateY(-4px) scale(1.01);
  box-shadow: 0 8px 32px rgba(88,145,199,.12);
}

/* Tag "En production" / "En construction" pulse pour les en
   production seulement */
.page-saas-index #catalogue .idx3-module .idx3-module__tag {
  position: relative;
}
.page-saas-index #catalogue .idx3-module .idx3-module__tag::before {
  content: "";
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--lume-1);
  margin-right: 6px;
  vertical-align: middle;
  opacity: 0;
  transform: scale(.4);
  transition: opacity .3s var(--si-ease-out), transform .3s var(--si-ease-out);
}
.page-saas-index #catalogue.reveal.in .idx3-module .idx3-module__tag::before {
  opacity: 1; transform: scale(1);
}
.page-saas-index #catalogue.reveal.in .idx3-module:nth-child(1) .idx3-module__tag::before { transition-delay: 500ms; animation: saasIdxTagPulse 2.6s ease-in-out 1.4s infinite; }
.page-saas-index #catalogue.reveal.in .idx3-module:nth-child(2) .idx3-module__tag::before { transition-delay: 600ms; animation: saasIdxTagPulse 2.6s ease-in-out 1.5s infinite; }
.page-saas-index #catalogue.reveal.in .idx3-module:nth-child(3) .idx3-module__tag::before { transition-delay: 700ms; animation: saasIdxTagPulse 2.6s ease-in-out 1.6s infinite; }
.page-saas-index #catalogue.reveal.in .idx3-module:nth-child(4) .idx3-module__tag::before { transition-delay: 800ms; animation: saasIdxTagPulse 2.6s ease-in-out 1.7s infinite; }
.page-saas-index #catalogue.reveal.in .idx3-module:nth-child(5) .idx3-module__tag::before { transition-delay: 900ms; animation: saasIdxTagPulse 2.6s ease-in-out 1.8s infinite; }
/* La 6e (Daisk - en construction) - pas de pulse */
.page-saas-index #catalogue.reveal.in .idx3-module:nth-child(6) .idx3-module__tag::before { transition-delay: 1000ms; opacity: .5; }
@keyframes saasIdxTagPulse {
  0%, 100% { box-shadow: 0 0 0 0 var(--lume-glow); }
  50%      { box-shadow: 0 0 0 4px transparent; }
}

/* Prose philosophie */
.page-saas-index #philosophie.reveal .idx3-prose > p,
.page-saas-index #philosophie.reveal .idx3-prose > h3 {
  opacity: 0; transform: translateY(8px);
  transition: opacity .7s var(--si-ease-out), transform .7s var(--si-ease-out);
}
.page-saas-index #philosophie.reveal.in .idx3-prose > p,
.page-saas-index #philosophie.reveal.in .idx3-prose > h3 {
  opacity: 1; transform: translateY(0);
}
.page-saas-index #philosophie.reveal.in .idx3-prose > p:nth-child(1) { transition-delay: 200ms; }
.page-saas-index #philosophie.reveal.in .idx3-prose > p:nth-child(2) { transition-delay: 320ms; }
.page-saas-index #philosophie.reveal.in .idx3-prose > h3:nth-child(3) { transition-delay: 440ms; }
.page-saas-index #philosophie.reveal.in .idx3-prose > p:nth-child(4) { transition-delay: 560ms; }
.page-saas-index #philosophie.reveal.in .idx3-prose > h3:nth-child(5) { transition-delay: 680ms; }
.page-saas-index #philosophie.reveal.in .idx3-prose > p:nth-child(6) { transition-delay: 800ms; }

.page-saas-index .idx3-finalcta.reveal {
  opacity: 0; transform: scale(.97);
  transition: opacity .7s var(--si-ease-out), transform .7s var(--si-ease-out);
}
.page-saas-index .idx3-finalcta.reveal.in { opacity: 1; transform: scale(1); }

@media (prefers-reduced-motion: reduce) {
  .page-saas-index *, .page-saas-index *::before, .page-saas-index *::after {
    animation: none !important; transition: none !important;
    opacity: 1 !important; transform: none !important;
  }
}
