/* SENSALTO · Conception et développement : The French Maquis'Art · https://thefrenchmaquis.art */
html.anim [data-apparait].titre-lignes { opacity: 1; transform: none; }
.titre-lignes > span { clip-path: inset(-.25em -.2em -.12em -.2em); }
.titre-lignes .ligne { display: block; }
html.anim .titre-lignes .ligne { transform: translate3d(0, 108%, 0); transition: transform 1s var(--ease); transition-delay: calc(var(--delai, 0s) + var(--l, 0) * .09s); }
html.anim .titre-lignes.is-visible .ligne { transform: none; }

.logo__alto { display: inline-block; transition: transform .5s var(--ease); }
.marque:hover .logo__alto, .marque:focus-visible .logo__alto { transform: translateY(-.14em); }

.lien:hover, .lien:focus-visible { text-decoration-color: transparent; background: linear-gradient(currentColor, currentColor) no-repeat 0 calc(100% - .02em) / 100% 1.5px; animation: souligne .5s var(--ease); }
@keyframes souligne { from { background-size: 0 1.5px; } }

.bouton { position: relative; overflow: hidden; isolation: isolate; }
.bouton::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--vif); transform: translateY(101%); transition: transform .45s var(--ease); }
.bouton:hover::before, .bouton:focus-visible::before { transform: none; }
.bouton:hover, .bouton:focus-visible { color: var(--encre); background: var(--encre); }
.bouton:hover svg, .bouton:focus-visible svg { fill: var(--encre); }
.bouton--clair:hover, .bouton--clair:focus-visible { background: transparent; border-color: var(--vif); }
.page-appel .bouton::before { background: var(--creme); }

.carte-expertise { position: relative; }
.carte-expertise::before { content: ""; position: absolute; left: 0; right: 0; top: -1.5px; height: 3px; background: var(--vif); transform: scaleX(0); transform-origin: left; transition: transform .6s var(--ease); }
.carte-expertise + .carte-expertise::before { left: 0; }
.carte-expertise:hover::before, .carte-expertise:focus-within::before { transform: scaleX(1); }
.carte-expertise:hover .carte-expertise__titre { color: var(--vermillon); }
.carte-expertise__titre { transition: color .3s; }

.suite__liste a::after, .profils__liste a::after { content: ""; position: absolute; left: 0; right: 0; top: -1.5px; height: 3px; background: var(--vif); transform: scaleX(0); transform-origin: left; transition: transform .6s var(--ease); }
.suite__liste a:hover::after, .suite__liste a:focus-visible::after, .profils__liste a:hover::after, .profils__liste a:focus-visible::after { transform: scaleX(1); }
.suite__liste li + li a::after { left: 0; }

.carte-univers a, .carte-article a { transition: transform .6s var(--ease); }
.carte-univers a:hover, .carte-univers a:focus-visible { transform: translateY(-.4rem); }

.cb-note:hover, .collage__note:hover { transition: transform .5s var(--ease), box-shadow .5s var(--ease), translate .9s; }
.cb-note:hover, .collage__note:hover { transform: rotate(calc(var(--r1, 0deg) * -1)) scale(1.06); box-shadow: 0 10px 22px rgba(22, 20, 18, .2); }
.collage-b > *, .collage > * { translate: var(--tx, 0) var(--ty, 0); transition: translate .9s cubic-bezier(.2, .8, .2, 1); }
html.anim .collage-b > [data-pose], html.anim .collage > [data-pose] { transition: opacity .7s var(--ease), transform 1.1s var(--ease), translate .9s cubic-bezier(.2, .8, .2, 1); transition-delay: var(--delai, 0s), var(--delai, 0s), 0s; }

.pastilles span, .demo__choix label { transition: background-color .2s, color .2s, border-color .2s, transform .3s var(--ease); }
.pastilles input:checked + span, .demo__choix label:has(input:checked) { animation: choix .4s var(--ease); }
@keyframes choix { 40% { transform: scale(1.06); } }

.faq details > div { overflow: hidden; }

.diagnostic__onglets button { position: relative; }
.diagnostic__onglets button::after { content: ""; position: absolute; left: 0; right: 1rem; bottom: -1px; height: 3px; background: var(--vif); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--ease); }
.diagnostic__onglets button[aria-selected="true"] { border-bottom-color: transparent; }
.diagnostic__onglets button[aria-selected="true"]::after { transform: scaleX(1); }

.nuances__escalier > span { transition: transform 1.1s var(--ease), opacity .8s var(--ease); }
html.anim .nuances__escalier > span[data-apparait] { transform: translateX(-2.5rem); }
html.anim .nuances__escalier > span[data-apparait].is-visible { transform: none; }

.progression { position: fixed; left: 0; right: 0; top: 0; z-index: 60; height: 3px; background: var(--vif); transform: scaleX(var(--p, 0)); transform-origin: left; pointer-events: none; }

.etapes__num, .vigilance span, .offre__num { display: inline-block; transition: transform .5s var(--ease); }
.etapes li:hover .etapes__num, .vigilance li:hover span, .offre:hover .offre__num { transform: translateY(-.15em); }

.paires li { transition: padding-left .45s var(--ease), color .3s; }
.paires li:hover { padding-left: .75rem; }
.paires li:hover .paires__sens { color: var(--vermillon); }

.pieges tbody th { transition: color .3s; }
.pieges tbody tr:hover th { color: var(--vermillon); }

@media (hover: none) {
  .carte-univers a:hover { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  html.anim .titre-lignes .ligne, html.anim .nuances__escalier > span[data-apparait] { transform: none; transition: none; }
  .collage-b > *, .collage > * { translate: none; }
  .progression { display: none; }
}

html.rgaa-wp-reduce-motion .titre-lignes .ligne { transform: none !important; }