/* 30/09/2026 — motion design commun au site (même langage que le film d'ouverture de l'accueil).
   Pages intérieures : photo d'intro qui se pose, sur-titre tapé, titre mot à mot, panneau de liens qui arrive en profondeur,
   titres de section révélés au défilement, cartes qui arrivent en profondeur. Toutes pages : fondu flouté entre les pages.
   Mouvements réduits (préférence système ou bouton du site) : rien ne bouge. */
:root{--sm-e:cubic-bezier(0.23,1,0.32,1)}

/* ---- transition entre les pages (navigateurs récents ; ignorée ailleurs) ---- */
@view-transition{navigation:auto}
::view-transition-old(root){animation:smOut .32s cubic-bezier(.4,0,1,1) both}
::view-transition-new(root){animation:smIn .6s var(--sm-e) both}
@keyframes smOut{to{opacity:0;filter:blur(10px);transform:translate3d(-2.5%,0,0) scale(.99)}}
@keyframes smIn{from{opacity:0;filter:blur(12px);transform:translate3d(2.5%,0,0) scale(1.01)}}
:root.reduced-motion::view-transition-old(root),:root.reduced-motion::view-transition-new(root){animation:none}
@media (prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none}}

/* ---- avant la découpe : on ne montre pas le titre brut (filet de sécurité à 2 s) ---- */
html.ef-sm .intro-copy h1:not(.sm-split),html.ef-sm .intro-copy>.eyebrow:not(.sm-typed){visibility:hidden;animation:smShow 0s 2s forwards}
@keyframes smShow{to{visibility:visible}}

/* ---- intro des pages ---- */
html.ef-sm .page-intro .route-photo{animation:smPhoto 2.6s var(--sm-e) both}
@keyframes smPhoto{from{transform:scale(1.09);filter:blur(4px) brightness(.7)}to{transform:none;filter:none}}
.sm-caret{display:inline-block;width:2px;height:1em;margin-left:3px;vertical-align:-.12em;background:#ffac76;animation:smCaret 1s steps(2) 3,smCaretOut .3s 3s forwards}
@keyframes smCaret{50%{opacity:0}}
@keyframes smCaretOut{to{opacity:0;width:0;margin:0}}
.sm-w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .03em .15em;margin:0 -.03em -.15em}
.sm-i{display:inline-block;font-style:inherit}
html.ef-sm .intro-copy .sm-i{animation:smWord .95s var(--sm-e) backwards;animation-delay:calc(var(--k,0) * 70ms + 250ms)}
html.ef-sm .intro-copy>p{animation:smUp .8s var(--sm-e) .85s backwards}
html.ef-sm .route-console{animation:smDepth 1.1s var(--sm-e) .45s backwards}
html.ef-sm .route-console nav>a{animation:smUp .6s var(--sm-e) backwards}
html.ef-sm .route-console nav>a:nth-child(1){animation-delay:.8s}
html.ef-sm .route-console nav>a:nth-child(2){animation-delay:.88s}
html.ef-sm .route-console nav>a:nth-child(3){animation-delay:.96s}
html.ef-sm .route-console .console-back{animation:smUp .6s var(--sm-e) 1.05s backwards}
@keyframes smWord{from{transform:translate3d(0,105%,0);opacity:0;filter:blur(6px)}to{transform:none;opacity:1;filter:none}}
@keyframes smUp{from{opacity:0;transform:translate3d(0,14px,0)}to{opacity:1;transform:none}}
@keyframes smDepth{from{opacity:0;transform:perspective(1100px) translate3d(70px,0,-220px) rotateY(-20deg)}to{opacity:1;transform:none}}

/* ---- titres de section : mot à mot quand ils entrent à l'écran ---- */
html.ef-sm .sm-h2 .sm-i{transform:translate3d(0,105%,0);opacity:0}
html.ef-sm .sm-h2.sm-on .sm-i{animation:smWord .85s var(--sm-e) forwards;animation-delay:calc(var(--k,0) * 60ms)}

/* ---- cartes : elles arrivent en profondeur (s'appuie sur le système .will-reveal existant) ---- */
html.ef-sm .will-reveal:not(.in-view){opacity:0;transform:perspective(1000px) translate3d(0,26px,-110px) rotateX(9deg)}
html.ef-sm .will-reveal{transition:opacity .65s var(--sm-e),transform .8s var(--sm-e);transition-delay:var(--delay,0ms)}

/* ---- mouvements réduits : état final ---- */
html.reduced-motion .sm-i,html.reduced-motion .page-intro .route-photo,html.reduced-motion .route-console,html.reduced-motion .route-console *,html.reduced-motion .intro-copy>p{animation:none!important;transform:none!important;opacity:1!important}
@media (prefers-reduced-motion:reduce){.sm-i,.page-intro .route-photo,.route-console,.route-console *,.intro-copy>p{animation:none!important}}