/* La version d’origine, avec une typographie plus calme et un accueil compact. */
[data-home-page]{--home-paper:#f3f0e8;--home-ink:#242522;--home-muted:#595b53;--home-cream:#f3f0e8;--home-night-muted:#c5c2b9}
:root { --wide: 100%; --wider: 100%; }
h1,h2,h3,.sec__title,.offer__name,.demo__title,.ohero__title,.page__title {
  font-stretch: 100%; font-weight: 570; letter-spacing: -.035em;
}
.price__amount,.offer .price__amount,.ohero .price__amount { font-stretch: 100%; font-weight: 570; letter-spacing: -.035em; }
.team__duo,.ft__giant { font-stretch: 100%; font-weight: 570; letter-spacing: -.035em; }
.hd__in { min-height: 100px; padding-block: 1rem; }
.hd__brand .wm { width: 90px; height: 48px; overflow: visible; }
.hd__brand .wm [data-logo-letter],.hd__brand .wm__sq { transform-box: fill-box; transform-origin: center; }
.scroll-progress { position: fixed; left: 0; top: 0; width: 100%; height: 3px; background: var(--c-cobalt); z-index: 100; transform: scaleX(0); transform-origin: left; pointer-events: none; }
[data-home-refinement] { padding-top: calc(var(--hd-h) + clamp(1.25rem,2.5svh,2rem)); padding-bottom: 2rem; }
.home-intro { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(0,1fr); gap: clamp(2rem,4vw,4rem); align-items: center; }
.home-intro .hx__title { margin: 0; font-size: clamp(2.7rem,4.5vw,4.5rem); line-height: 1.02; font-stretch: 100%; font-weight: 570; letter-spacing: -.035em; }
.home-intro .hx__title .it { font-family: var(--font-it); font-style: italic; font-weight: 400; font-size: 1.12em; letter-spacing: -.025em; }
.home-intro__aside { display: grid; justify-items: start; gap: 1.3rem; }
.home-intro__aside .hx__lead { font-size: clamp(1rem,1.15vw,1.125rem); line-height: 1.6; max-width: 43ch; }
.home-intro__aside .btn { display: inline-flex; gap: 1.1rem; min-height: 48px; font-size: 1rem; font-weight: 550; }
.home-intro__aside .btn svg { width: 20px; height: 20px; }
.home-selector { margin-top: clamp(1.4rem,3svh,2.25rem); display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.home-selector__buttons { display: flex; flex-wrap: wrap; gap: .35rem; }
.home-selector button { border: 0; border-radius: 100px; background: transparent; color: #fff; font: inherit; font-size: .875rem; padding: .7rem 1.2rem; min-height: 44px; cursor: pointer; transition: background .18s,color .18s; }
.home-selector button:hover { background: rgba(255,255,255,.16); }
.home-selector button[aria-pressed="true"] { background: #fff; color: var(--c-cobalt); }
.home-selector button:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
.home-selector__caption { font-size: .8rem; color: #fff; }
.home-preview { position: relative; height: clamp(240px,40svh,420px); margin-top: 1.5rem; isolation: isolate; }
.home-preview__main { position: relative; z-index: 2; display: block; width: min(70%,calc(40svh * 1.78)); margin-inline: auto; border-radius: 12px; overflow: hidden; background: #fff; text-decoration: none; color: #111; box-shadow: 0 28px 70px -30px rgba(4,8,60,.6); }
.home-preview__main>img { display: block; width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; object-position: top left; }
.home-preview__bar { height: 27px; padding-inline: 12px; display: flex; align-items: center; gap: 5px; background: #efeeeb; color: #45454a; }
.home-preview__bar>span { width: 5px; height: 5px; border-radius: 50%; background: #b5b5b0; }
.home-preview__bar>p { flex: 1; font-size: 10px; text-align: center; }
.home-preview__bar svg { width: 14px; height: 14px; }
.home-preview__side { position: absolute; top: 12%; width: min(45%,calc(34svh * 1.78)); border-radius: 10px; overflow: hidden; box-shadow: 0 16px 40px -22px rgba(4,8,60,.55); }
.home-preview__side img { display: block; width: 100%; height: auto; aspect-ratio: 16/10; object-fit: cover; object-position: top left; }
.home-preview__side--left { left: 1%; transform: rotate(-7deg); }
.home-preview__side--right { right: 1%; transform: rotate(7deg); }
.home-preview__explore { position: absolute; right: 16px; bottom: 16px; padding: .6rem 1rem; border-radius: 100px; background: #fff; color: var(--c-cobalt); display: flex; align-items: center; gap: 1rem; font-size: .8rem; opacity: 0; transform: translateY(5px); transition: transform .2s,opacity .2s; }
.home-preview__explore svg { width: 18px; height: 18px; }
.home-preview__main:hover .home-preview__explore,.home-preview__main:focus-visible .home-preview__explore { opacity: 1; transform: none; }
.home-preview__main:focus-visible { outline: 3px solid #fff; outline-offset: 6px; }
@media (max-width: 1200px) {
  .js .hd__toggle { display: inline-flex; }
  .js .hd__nav { display: none; }
  .js .hd.is-open .hd__nav { display: grid; width: 100%; gap: 1rem; padding: .5rem 0 1.25rem; border-top: 1px solid var(--c-line); }
  .js .hd.is-open .hd__links { display: grid; gap: 0; }
  .js .hd.is-open .hd__links a { display: block; padding-block: .85rem; border-bottom: 1px solid var(--c-line); }
  .js .hd.is-open .hd__cta { width: 100%; min-height: 3.25rem; }
}
@media (max-width: 1000px) {
  .home-intro { grid-template-columns: minmax(0,1.3fr) minmax(0,1fr); gap: 2rem; }
  .home-intro .hx__title { font-size: clamp(2.7rem,4.9vw,3.5rem); }
  .home-title-break { display: block; }
  .home-intro__aside .hx__lead { font-size: 1rem; }
  .home-selector__caption { font-size: .75rem; }
}
@media (max-width: 800px) {
  .hd__in { min-height: 80px; padding-block: 12px; }
  .hd__brand .wm { width: 90px; height: 48px; }
  .home-selector { gap: .5rem; flex-wrap: wrap; }
  .home-selector__caption { width: 100%; }
  .home-selector button { padding-inline: .9rem; font-size: .8rem; }
  .home-intro__aside .btn { font-size: .85rem; gap: .6rem; }
  .home-preview { height: 300px; }
  .home-preview__main { width: 76%; }
  .home-preview__side { width: 48%; }
}
@media (max-width: 600px) {
  .hd__in { min-height: 76px; padding-block: 13px; }
  .hd__brand .wm { width: 76px; height: 42px; }
  [data-home-refinement] { padding-top: calc(var(--hd-h) + 1rem); padding-bottom: 1.5rem; }
  .home-intro { grid-template-columns: 1fr; gap: 1.3rem; }
  .home-intro .hx__title { font-size: clamp(2.25rem,9.8vw,3.5rem); line-height: 1; }
  .home-intro__aside { gap: 1rem; }
  .home-intro__aside .hx__lead { max-width: none; font-size: 1rem; line-height: 1.5; }
  .home-intro__aside .btn { font-size: .9rem; min-height: 46px; }
  .home-selector { margin-top: 1.25rem; }
  .home-selector__buttons { width: 100%; justify-content: space-between; gap: 0; }
  .home-selector button { font-size: .72rem; padding: .6rem .7rem; }
  .home-selector__caption { font-size: .7rem; margin-top: .3rem; }
  .home-preview { margin-top: 1.25rem; height: clamp(175px,52vw,265px); }
  .home-preview__main { width: 87%; border-radius: 8px; }
  .home-preview__side { width: 57%; top: 14%; border-radius: 7px; }
  .home-preview__side--left { left: -2%; }
  .home-preview__side--right { right: -2%; }
  .home-preview__bar { height: 20px; padding-inline: 8px; gap: 3px; }
  .home-preview__bar>span { width: 4px; height: 4px; }
  .home-preview__bar>p { font-size: 6px; }
  .home-preview__bar svg { width: 10px; height: 10px; }
  .home-preview__explore { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .home-preview *, .hd__brand .wm * { animation: none!important; transition: none!important; }
}

/* Suite de l’accueil : même identité, cadre large et scènes choisies. */
:root { --gutter: clamp(1.25rem,4.5vw,5rem); }
.wrap { max-width: none; }
body { overflow-x: clip; }
.hd { position: sticky; top: 0; }
.hd__cta { display: inline-flex; align-items: center; justify-content: center; gap: 1rem; transition: opacity .2s,transform .3s,visibility .2s,background-color .2s; }
.hd__cta svg { width: 20px; height: 20px; flex-shrink: 0; }
.hd__cta.is-waiting { visibility: hidden; opacity: 0; transform: translateY(-6px); pointer-events: none; }
html { scroll-padding-top: calc(var(--hd-h) + 24px); }
/* Le fond bleu rejoint directement l’en-tête à l’arrivée sur le formulaire. */
#contact { scroll-margin-top: -24px; }
.home-preview { height: max(350px,49vw); perspective: 1600px; --hero-p: 0; }
.home-preview__main { width: 74%; transform-origin: center 80%; transform: translate3d(0,calc(var(--hero-p) * -36px),0) rotateX(calc(9deg - var(--hero-p) * 9deg)); }
.home-preview__side { width: 47%; }
.home-preview__side--left { transform: translate3d(calc(var(--hero-p) * -80px),calc(var(--hero-p) * 30px),0) rotate(calc(-7deg - var(--hero-p) * 5deg)); }
.home-preview__side--right { transform: translate3d(calc(var(--hero-p) * 80px),calc(var(--hero-p) * 30px),0) rotate(calc(7deg + var(--hero-p) * 5deg)); }
.home-preview__main,.home-preview__side { will-change: auto; }
.needs-refined { background: var(--c-bg); }
.needs-refined__in { display: grid; grid-template-columns: .8fr 1.6fr; gap: 8%; align-items: start; }
.needs-refined .sec__title { position: sticky; top: calc(var(--hd-h) + 3rem); max-width: 11ch; font-size: clamp(2.2rem,4vw,4.2rem); }
.needs-refined .situations { border: 0; gap: 0; }
.needs-refined .situation { display: block; padding: 2.25rem 2rem; border: 0; border-radius: 16px; transition: background-color .3s; }
.needs-refined .situation:nth-child(2) { background: #fff; }
.needs-refined .situation:hover { padding-left: 2rem; }
.needs-refined .situation__quote { max-width: 28ch; font-size: clamp(1.4rem,2vw,2rem); font-weight: 570; line-height: 1.2; letter-spacing: -.025em; }
.needs-refined .situation__answer { margin-top: 1rem; max-width: 60ch; font-size: 1rem; }
.needs-refined .situation__answer a { display: inline-flex; align-items: center; gap: 1.5rem; margin-top: .75rem; font-weight: 550; }
.needs-refined .situation__answer svg { width: 18px; height: 18px; }
.needs-refined .situations__other { margin: 2rem 2rem 0; font-size: .9rem; max-width: 65ch; }
.screen-story { padding-block: var(--sec); background: var(--c-ink); color: #fff; overflow: clip; }
.screen-story__in { display: grid; grid-template-columns: 1.1fr 1.4fr; gap: 6%; align-items: center; }
.screen-story .sec__title { font-size: clamp(2.6rem,4.2vw,4.75rem); max-width: none; }
.screen-story__copy>p { margin-top: 1.75rem; font-size: 1.1rem; max-width: 36ch; color: #d1d3df; }
.screen-story__copy .screen-story__note { font-size: .9rem; color: #b9bbc8; }
.screen-story__devices { position: relative; padding-block: 3rem; --screen-p: 1; perspective: 1200px; }
.screen-story__desktop { width: 88%; transform: translateY(calc((1 - var(--screen-p)) * 36px)) rotateY(calc((1 - var(--screen-p)) * -8deg)); }
.screen-story__phone { position: absolute; width: 25%; right: 0; top: 18%; transform: translateY(calc((1 - var(--screen-p)) * 90px)) rotate(calc((1 - var(--screen-p)) * 6deg)); }
[data-home-page] #offres { background: var(--c-bg); }
[data-home-page] #offres .sec__head,[data-home-page] #exemples .sec__head { grid-template-columns: 1fr 1fr; gap: 8%; }
[data-home-page] #offres .sec__title,[data-home-page] #exemples .sec__title { max-width: none; font-size: clamp(2.6rem,4.7vw,4.8rem); }
[data-slide-deck] { display: block; overflow: visible; background: none; border: 0; }
[data-slide-deck] .offer { display: block; position: relative; top: auto; padding: 0; border: 0; background: transparent; transform: none; filter: none; box-shadow: none; margin: 1.75rem 0 0; z-index: 1; }
[data-slide-deck] .offer::after { display: none; }
.offer__surface { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); grid-template-rows: auto auto; gap: 1.5rem 6%; padding: clamp(2rem,3.5vw,4rem); border-radius: 24px; background: var(--card-bg); color: var(--card-fg); transform-origin: 50% 50%; }
[data-slide-deck] .offer--site .offer__surface { background: #fff; }
[data-slide-deck] .offer--boutique .offer__surface { background: #17171e; }
[data-slide-deck] .offer--application .offer__surface { background: var(--c-cobalt); }
[data-slide-deck] .offer__main { grid-column: 1; grid-row: 1; gap: 1.25rem; }
[data-slide-deck] .offer__body { grid-column: 2; grid-row: 1 / 3; gap: 1.6rem; }
[data-slide-deck] .offer__actions { grid-column: 1; grid-row: 2; }
[data-slide-deck] .offer__name { font-size: clamp(1.5rem,2.2vw,2.25rem); font-weight: 570; }
[data-slide-deck] .offer__name::before { display: none; }
[data-slide-deck] .price--lg { font-size: clamp(3rem,4.7vw,4.75rem); }
[data-slide-deck] .offer__price { border: 0; padding-bottom: .5rem; }
[data-slide-deck] .offer__for { font-weight: 450; font-size: 1rem; }
[data-slide-deck] .offer__shot { height: clamp(150px,14vw,230px); border-radius: 10px; }
[data-slide-deck] .offer__h { font-size: .95rem; text-transform: none; letter-spacing: 0; }
[data-slide-deck] .checks { font-size: .95rem; }
[data-slide-deck].is-stacked { padding-bottom: 0; position: relative; }
[data-slide-deck].is-stacked .offers__stage { position: sticky; top: var(--deck-top); height: var(--deck-stage-height,var(--deck-height)); isolation: isolate; }
[data-slide-deck].is-stacked .offer { position: absolute; top: 0; left: 0; width: 100%; height: var(--deck-card-height); margin: 0; transform: scale(var(--deck-fit,1)); transform-origin: top center; pointer-events: none; }
[data-slide-deck].is-stacked .offer:nth-child(2) { z-index: 2; }
[data-slide-deck].is-stacked .offer:nth-child(3) { z-index: 3; }
[data-slide-deck].is-stacked .offer__surface { padding: clamp(20px,2.2vw,34px); gap: 16px 5%; align-content: start; transform: translate3d(calc((1 - var(--incoming,1)) * -115vw),0,0) rotate(calc((1 - var(--incoming,1)) * -2deg)) scale(calc(1 - var(--covered,0) * .025)); box-shadow: 0 22px 65px -35px rgba(8,12,45,.4); pointer-events: auto; }
[data-slide-deck].is-stacked .offer__main { gap: 14px; }
[data-slide-deck].is-stacked .offer__body { gap: 16px; }
[data-slide-deck].is-stacked .offer__name { font-size: clamp(1.4rem,2vw,2rem); }
[data-slide-deck].is-stacked .price--lg { font-size: clamp(2.7rem,4vw,4rem); line-height: 1.1; }
[data-slide-deck].is-stacked .offer__for { line-height: 1.45; }
[data-slide-deck].is-stacked .offer__shot { height: clamp(100px,15svh,160px); margin-top: 0; }
[data-slide-deck].is-stacked .offer__actions { gap: 8px; padding-top: 0; align-self: start; }
[data-slide-deck].is-stacked .offer__part { gap: 6px; }
[data-slide-deck].is-stacked .checks { gap: 7px; line-height: 1.4; }
/* Le résumé et le périmètre détaillé restent sur la page d’offre liée. Sur une
   fenêtre courte, la carte garde le prix, la destination et tous les éléments inclus. */
[data-slide-deck].is-condensed .offer__shot { display: none; }
[data-slide-deck].is-condensed .offer__body .offer__part:first-child,
[data-slide-deck].is-condensed .offer__body .offer__part:last-child { display: none; }
[data-slide-deck].is-stacked .offer:focus-within { z-index: 5; }
[data-slide-deck].is-stacked .offer:focus-within .offer__surface { transform: none; }
[data-home-page] #exemples .demo { grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: 6%; align-items: center; }
[data-home-page] #exemples .demo__info>p { font-size: 1rem; }
[data-home-page] #exemples .demo__title { font-size: clamp(1.6rem,2.3vw,2.4rem); font-weight: 570; }
[data-home-page] #exemples .demo__stage { padding: 2rem; border-radius: 18px; background: #e9e9e5; }
[data-home-page] #exemples .tag { margin-block: .25rem .5rem; font-size: .8rem; }
.loop.is-resting * { animation-play-state: paused!important; }
@media (max-width: 1000px) {
  .needs-refined__in { grid-template-columns: 1fr; gap: 2rem; }
  .needs-refined .sec__title { position: static; max-width: 20ch; }
  .needs-refined .situation { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
  .needs-refined .situation__answer { margin-top: 0; }
  .screen-story__in { grid-template-columns: 1fr 1.25fr; gap: 4%; }
  .screen-story__copy>p { font-size: 1rem; }
  [data-home-page] #exemples .demo { grid-template-columns: 1fr; gap: 3rem; }
  [data-home-page] #exemples .demo__info>p { max-width: 75ch; }
}
@media (max-width: 800px) {
  .home-preview { height: 53vw; }
  .home-preview__main { width: 82%; }
  .home-preview__side { width: 49%; }
  .screen-story__in { grid-template-columns: 1fr; gap: 2rem; }
  .screen-story__copy>p { max-width: 60ch; }
  .screen-story__devices { width: 90%; justify-self: center; }
  .offer__surface { gap: 1.5rem 5%; padding: 1.7rem; }
  [data-slide-deck] .offer__name { font-size: 1.5rem; }
  [data-slide-deck] .offer__actions .btn { font-size: .8rem; }
}
@media (max-width: 600px) {
  .home-preview { height: 61vw; min-height: 210px; }
  .home-preview__main { width: 94%; }
  .home-preview__side { width: 61%; }
  .home-preview__side--left { left: -5%; }
  .home-preview__side--right { right: -5%; }
  .needs-refined .situation { display: block; padding: 1.75rem 1.2rem; }
  .needs-refined .situation:hover { padding-left: 1.2rem; }
  .needs-refined .situation__answer { margin-top: 1rem; }
  .needs-refined .situations__other { margin-inline: 1.2rem; }
  .screen-story__devices { width: 100%; padding-bottom: 3rem; }
  .screen-story__copy>p { font-size: 1rem; }
  [data-home-page] #offres .sec__head,[data-home-page] #exemples .sec__head { grid-template-columns: 1fr; gap: 1.5rem; }
  .offer__surface { display: flex; flex-direction: column; padding: 1.6rem; border-radius: 18px; }
  [data-slide-deck].is-stacked .offer__surface { padding: 18px; gap: 14px; }
  [data-slide-deck].is-stacked .offer__main { gap: 10px; }
  [data-slide-deck].is-stacked .offer__name { font-size: 1.4rem; }
  [data-slide-deck].is-stacked .price--lg { font-size: 2.7rem; }
  [data-slide-deck].is-stacked .offer__shot { display: none; }
  [data-slide-deck].is-stacked .offer__body { gap: 12px; }
  [data-slide-deck].is-stacked .checks { font-size: .95rem; gap: 6px; line-height: 1.35; }
  [data-slide-deck].is-stacked .offer__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: auto; }
  [data-slide-deck].is-stacked .offer__actions .btn { min-height: 44px; padding: .6rem .85rem; font-size: .85rem; }
  [data-slide-deck].is-stacked .offer__actions .link { font-size: .85rem; }
  [data-slide-deck] .offer__name { font-size: 1.6rem; }
  [data-slide-deck] .offer__shot { height: 170px; }
  [data-slide-deck] .offer__actions .btn { font-size: .9rem; }
  [data-home-page] #exemples .demo__stage { padding: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .home-preview__main,.home-preview__side--left,.home-preview__side--right,.screen-story__desktop,.screen-story__phone { transform: none!important; }
  .hd__cta { transition: none; }
  [data-slide-deck] .offer { position: relative!important; top: auto!important; margin-top: 1.5rem!important; }
  [data-slide-deck] .offer__surface { transform: none!important; box-shadow: none!important; }
}

/* Situations : des besoins concrets et leur proposition, sans colonne vide. */
.needs-refined__heading { display: grid; grid-template-columns: 1fr 1fr; gap: 8%; align-items: end; margin-bottom: 3rem; }
.needs-refined .needs-refined__heading .sec__title { position: static; max-width: 14ch; font-size: clamp(2.4rem,4.3vw,4.75rem); }
.needs-refined__heading>p { font-size: clamp(1.1rem,1.6vw,1.4rem); line-height: 1.5; max-width: 40ch; }
.needs-refined .situations { display: grid; gap: 1.25rem; }
.needs-refined .situation { display: grid; grid-template-columns: 1.05fr 1fr; align-items: center; gap: 8%; padding: clamp(1.75rem,3vw,3rem); border-radius: 20px; background: #fff; }
.needs-refined .situation:hover { padding-left: clamp(1.75rem,3vw,3rem); }
.needs-refined .situation__quote { font-size: clamp(1.5rem,2.4vw,2.4rem); max-width: 30ch; line-height: 1.15; }
.needs-refined .situation__answer { margin: 0; max-width: none; }
.needs-refined .situation__answer>p { max-width: 56ch; line-height: 1.6; }
.needs-refined .situation__answer .link { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; width: 100%; padding: 1rem 1.25rem; margin-top: 1.4rem; border-radius: 12px; background: var(--c-cobalt); color: #fff; text-decoration: none; font-size: 1rem; line-height: 1.5; font-weight: 450; }
.needs-refined .situation__answer .link strong { font-size: 1.15em; font-weight: 650; white-space: nowrap; }
.needs-refined .situation__answer .link svg { width: 22px; height: 22px; flex-shrink: 0; transition: transform .2s; }
.needs-refined .situation__answer .link:hover svg { transform: translate(3px,-3px); }
.needs-refined .situation:nth-child(2) { background: var(--c-ink); }
.needs-refined .situation:nth-child(2) .situation__quote { color: #fff; }
.needs-refined .situation:nth-child(2) .situation__answer>p { color: #d5d7e2; }
.needs-refined .situation:nth-child(2) .link { background: #fff; color: var(--c-ink); }
.needs-refined .situations__other { margin: 2rem 0 0; max-width: 75ch; }
.screen-story .sec__title .it { font-family: var(--font-it); font-style: italic; font-weight: 400; color: #a8b0ff; }
[data-slide-deck] .offer__actions .btn { display: inline-flex; align-items: center; justify-content: center; gap: 1.2rem; min-height: 48px; text-decoration: none; font-weight: 550; }
[data-slide-deck] .offer__actions .btn svg { width: 20px; height: 20px; flex-shrink: 0; }

/* Aperçus réels : les trois captures changent de place, sans lien sortant. */
[data-home-card] { position: absolute; padding: 0; border: 0; appearance: none; border-radius: 16px; overflow: hidden; cursor: pointer; background: transparent; }
[data-home-card] img { display: block; width: 100%; height: auto; aspect-ratio: 1620/876; object-fit: contain; border-radius: inherit; pointer-events: none; }
[data-home-video]{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border-radius:inherit;pointer-events:none;opacity:0}
[data-home-video].is-ready{opacity:1}
.home-selector .home-preview-playback{margin-left:auto;font-size:.75rem;padding:.5rem .8rem;color:#ffffffd9;text-decoration:underline;text-underline-offset:4px}
.home-preview-playback[hidden]{display:none}
@media(max-width:600px){.home-selector .home-preview-playback{margin-left:0}}
@media(prefers-reduced-motion:reduce){[data-home-video],.home-preview-playback{display:none!important}}
[data-home-card].home-preview__main { left: 16%; top: 0; width: 68%; margin: 0; cursor: default; }
[data-home-card].home-preview__side { width: 47%; }
[data-home-card].home-preview__side--left { left: 1%; }
[data-home-card].home-preview__side--right { left: 52%; right: auto; }
[data-home-card]:focus-visible { outline: 3px solid #fff; outline-offset: 6px; }
.screen-story__desktop .loop { border-radius: 16px; overflow: hidden; }

/* Un même langage de titres sur toute la suite de l’accueil. */
[data-home-page] :is(#partout,#exemples,#offres,#methode,#equipe,#questions,#contact) .sec__title { font-size: clamp(2.4rem,4vw,4rem); line-height: 1.05; letter-spacing: -.035em; font-weight: 570; max-width: none; }
[data-home-page] :is(#partout,#exemples,#offres,#methode,#equipe,#questions,#contact) .sec__title .it { font-family: var(--font-it); font-size: 1.08em; font-style: italic; font-weight: 400; letter-spacing: -.025em; color: var(--c-cobalt); }
[data-home-page] :is(#partout,#contact) .sec__title .it { color: #b7baff; }

/* Projets : texte libre et aperçu, avec le sélecteur sous l’image. */
.demo-lab { background: var(--c-bg); }
.demo-lab__heading { display: grid; grid-template-columns: 1fr 1fr; gap: 8%; align-items: end; margin-bottom: clamp(2.5rem,5vw,5rem); }
.demo-lab__heading > p { font-size: clamp(1rem,1.3vw,1.2rem); line-height: 1.6; max-width: 44ch; color: var(--c-text-2); }
.demo-lab .demos { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 6%; border: 0; background: transparent; }
.demo-lab__viewer { grid-column: 2; grid-row: 1; min-width: 0; align-self: start; }
.demo-lab .is-tabbed .demo-lab__viewer { position: sticky; top: calc(var(--hd-h) + 24px); }
.demo-lab__details { grid-column: 1; grid-row: 1; min-width: 0; }
[data-home-page] #exemples .demo { display: block; padding: 0; border: 0; border-radius: 0; background: transparent; }
[data-home-page] #exemples .demo[hidden], .demo-lab .demo__story[hidden] { display: none; }
[data-home-page] #exemples .demo__stage { padding: 0; background: transparent; border-radius: 16px; }
.demo-lab .trial-preview { position: relative; overflow: hidden; border-radius: 16px; isolation: isolate; }
.demo-lab .trial-preview > .loop { border-radius: 16px; box-shadow: none; }
.demo-lab .trial-preview > img { display: block; width: 100%; height: auto; aspect-ratio: 16/10; object-fit: contain; background: #e5ebe7; }
.demo-lab .trial-preview::after { content: ''; position: absolute; inset: 0; background: rgba(9,22,23,.15); pointer-events: none; }
/* Deux vrais parcours, avec le mobile au premier plan. */
.application-devices { position: relative; padding: 5% 13% 15% 0; isolation: isolate; }
.application-devices video { display: block; width: 100%; height: auto; }
.application-devices__desktop { overflow: hidden; border-radius: 12px; }
.application-devices__phone { position: absolute; width: 25%; right: 2%; bottom: 1%; padding: 5px; background: #222321; border-radius: 24px; transform: rotate(8deg); box-shadow: 8px 18px 28px -14px #24252288; }
.application-devices__phone video { border-radius: 19px; aspect-ratio: 390/844; object-fit: cover; }
.application-devices__phone::before { content: ''; position: absolute; top: 8px; left: 37%; width: 26%; height: 5px; background: #222321; border-radius: 10px; z-index: 1; }
.demo-lab__controls { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 1rem; }
.demo-lab .demo-lab__controls .tabs { margin: 0; flex-wrap: nowrap; min-width: 0; }
.application-devices__pause { display: inline-flex; flex: 0 0 44px; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--c-line); border-radius: 50%; background: var(--c-bg); color: var(--c-text-2); cursor: pointer; }
.application-devices__pause svg { width: 20px; height: 20px; }
.application-devices__pause .device-play-icon,.application-devices__pause.is-paused .device-pause-icon { display: none; }
.application-devices__pause.is-paused .device-play-icon { display: block; }
.application-devices__pause[hidden] { display: none; }
.application-devices__pause:hover { color: var(--c-text); border-color: currentColor; }
.application-devices__pause:focus-visible { outline: 2px solid var(--c-cobalt); outline-offset: 4px; }
@media(max-width:600px) {
  .demo-lab .demo-lab__controls .tabs__tab { padding-inline: 9px; font-size: .75rem; }
  .application-devices { padding-top: 10%; padding-bottom: 20%; }
  .application-devices__phone { width: 29%; padding: 3px; border-radius: 17px; }
  .application-devices__phone video { border-radius: 14px; }
  .application-devices__phone::before { top: 6px; height: 4px; }
}
@media(max-width:360px) {
  .demo-lab .demo-lab__controls { gap: 5px; }
  .demo-lab .demo-lab__controls .tabs { gap: 0; padding: 2px; }
  .demo-lab .demo-lab__controls .tabs__tab { padding-inline: 6px; font-size: .7rem; }
}
.demo-lab .demo__launch { position: absolute; left: 50%; top: 50%; translate: -50% -50%; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: .8rem; width: max-content; max-width: calc(100% - 32px); min-height: 48px; padding: .85rem 1.25rem; border-radius: 100px; background: var(--c-cobalt); color: #fff; font-size: .95rem; line-height: 1.4; font-weight: 550; text-decoration: none; text-align: center; box-shadow: 0 8px 24px -10px rgba(10,12,40,.5); transition: background-color .2s; }
.demo-lab .demo__launch:hover { background: var(--c-action-hover); }
.demo-lab .demo__launch:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
.demo-lab .demo__launch svg { flex-shrink: 0; width: 20px; height: 20px; }
#demo-application .demo__stage { position: relative; }
#demo-application .demo__launch { top: 44%; }
.demo-lab .tabs { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px; padding: 4px; width: fit-content; max-width: 100%; margin: 1rem auto 0; border: 1px solid var(--c-line); border-radius: 100px; background: var(--c-bg); }
.demo-lab .tabs[hidden] { display: none; }
.demo-lab .tabs__tab { min-height: 44px; padding: .6rem 1rem; border: 0; border-radius: 100px; background: transparent; color: var(--c-text-2); font-size: .875rem; line-height: 1.3; font-weight: 550; white-space: nowrap; cursor: pointer; transition: background-color .2s,color .2s; }
.demo-lab .tabs__tab:hover { color: var(--c-cobalt); background: #e9eaff; }
.demo-lab .tabs__tab[aria-selected='true'] { background: var(--c-cobalt); color: #fff; }
.demo-lab .tabs__tab:focus-visible { outline: 3px solid var(--c-cobalt); outline-offset: 3px; }
.demo-lab .demo__story { display: grid; gap: 1.4rem; align-content: start; justify-items: start; }
[data-home-page] #exemples .demo__title { font-size: clamp(1.7rem,2.3vw,2.2rem); line-height: 1.15; font-weight: 570; max-width: 24ch; margin-bottom: .25rem; }
.demo-lab .demo__story p { font-size: 1rem; line-height: 1.65; max-width: 56ch; color: var(--c-text-2); }
.demo-lab .demo__story strong { font-weight: 600; color: var(--c-text); }
.demo-lab .demo__story .demo__hint { font-size: .9rem; }
.demo-lab .demo__story .demo__offer { font-size: .9rem; }
.demo-lab .demo__offer a { text-underline-offset: .25em; }
.demo-lab .demo__similar { display: inline-flex; align-items: center; gap: 1rem; min-height: 44px; font-size: .95rem; font-weight: 550; text-decoration: none; }
.demo-lab .demo__similar svg { width: 18px; height: 18px; }
.demo-lab .demo__similar:hover { text-decoration: underline; text-underline-offset: .25em; }
.demo-lab .demos:not(.is-tabbed) .demo + .demo, .demo-lab .demos:not(.is-tabbed) .demo__story + .demo__story { margin-top: 3rem; }
@media (max-width: 800px) {
  .demo-lab__heading { grid-template-columns: 1fr; gap: 1.5rem; }
  .demo-lab .demos { grid-template-columns: 1fr; gap: 2rem; }
  .demo-lab__viewer { grid-column: 1; grid-row: 1; }
  .demo-lab__details { grid-column: 1; grid-row: 2; }
  .demo-lab .is-tabbed .demo-lab__viewer { top: var(--hd-h); z-index: 4; padding-block: 12px; background: var(--c-bg); }
  .demo-lab .trial-preview > .loop .loop__view, .demo-lab .trial-preview > img { aspect-ratio: 16/9; }
  .demo-lab .tabs { margin-top: .75rem; }
  .demo-lab .tabs__tab { padding-inline: .85rem; font-size: .8125rem; }
  .demo-lab .demo__story p { max-width: 65ch; }
}
@media (max-width: 600px) {
  [data-home-card].home-preview__main { width: 70%; left: 15%; }
  [data-home-card].home-preview__side { width: 58%; }
  [data-home-card].home-preview__side--left { left: -3%; }
  [data-home-card].home-preview__side--right { left: 45%; }
  .demo-lab .demo__launch { font-size: .85rem; min-height: 44px; padding: .75rem 1rem; }
}
@media (max-height: 500px), (prefers-reduced-motion: reduce) {
  [data-home-card] { transition: none; }
}
@media (max-height: 500px) {
  .demo-lab .is-tabbed .demo-lab__viewer { position: static; }
}

/* Cadre ivoire et encre : les univers animes portent la couleur. */
[data-home-page] .hx{background:radial-gradient(ellipse at 8% 48%,#e8dcc9b3,transparent 57%),radial-gradient(ellipse at 86% 12%,#fffdf7,transparent 58%),radial-gradient(ellipse at 80% 100%,#dfe4d9a6,transparent 63%),var(--home-paper);color:var(--home-ink)}
[data-home-page] .hx__lead{color:var(--home-muted)}
[data-home-page].is-cobalt .hd{background:#f3f0e8b8;color:var(--home-ink);border-bottom-color:#2425221a}
[data-home-page].is-cobalt .hd:not(.is-scrolled):not(.is-open){background:transparent}
[data-home-page].is-cobalt .hd.is-open{background:#f3f0e8f5}
[data-home-page].is-cobalt .hd .wm,
[data-home-page].is-cobalt .hd:not(.is-scrolled):not(.is-open) .wm{color:var(--home-ink)}
[data-home-page].is-cobalt .hd .wm__sq,
[data-home-page].is-cobalt .hd:not(.is-scrolled):not(.is-open) .wm__sq{fill:var(--c-cobalt)}
[data-home-page].is-cobalt .hd .hd__links a,
[data-home-page].is-cobalt .hd:not(.is-scrolled):not(.is-open) .hd__links a{color:var(--home-ink)}
[data-home-page].is-cobalt .hd .hd__links a:hover{color:var(--c-cobalt)}
[data-home-page].is-cobalt .hd .hd__toggle,
[data-home-page].is-cobalt .hd:not(.is-scrolled):not(.is-open) .hd__toggle{color:var(--home-ink);background:transparent;border-color:#24252259}
[data-home-page].is-cobalt .hd .hd__cta,
[data-home-page].is-cobalt .hd:not(.is-scrolled):not(.is-open) .hd__cta,
[data-home-page] .home-intro__aside .btn--light{background:var(--c-cobalt);color:#fff;border-color:transparent}
[data-home-page] .home-intro__aside .btn--light:hover,
[data-home-page].is-cobalt .hd .hd__cta:hover{background:var(--c-action-hover);color:#fff}
[data-home-page] .hd.is-scrolled{backdrop-filter:blur(12px)}
[data-home-page] .home-selector button{color:var(--home-muted)}
[data-home-page] .home-selector button:hover{background:#2425220d;color:var(--home-ink)}
[data-home-page] .home-selector button[aria-pressed="true"]{background:var(--home-ink);color:var(--home-cream)}
[data-home-page] .home-selector .home-preview-playback{color:var(--home-muted)}
[data-home-page] .home-selector button:focus-visible,
[data-home-page] [data-home-card]:focus-visible{outline-color:var(--c-cobalt)}
[data-home-page] .home-preview__main{box-shadow:0 24px 55px -28px #24252266}
[data-home-page] .home-preview__side{box-shadow:0 14px 35px -22px #24252266}
[data-home-page] .home-opening,
.has-home-opening [data-home-page] .home-opening,
[data-home-page] .home-opening__curtain{background:var(--home-paper)}
[data-home-page] .home-opening.is-ready{background:transparent}
[data-home-page] .home-opening__layer--ink,
[data-home-page] .home-opening__layer--light{color:var(--home-ink)}
[data-home-page] #contact{background:var(--home-ink);color:var(--home-cream)}
[data-home-page] #contact .sec__title,
[data-home-page] #contact .sec__title .it,
[data-home-page] #contact .contact__intro a{color:var(--home-cream)}
[data-home-page] #contact .contact__lead,
[data-home-page] #contact .contact__next{color:var(--home-night-muted)}
[data-home-page] #contact .contact__next{border-top-color:#f3f0e833}
[data-home-page] #contact .contact__next li::before{background:var(--home-cream)}
[data-home-page] #contact .contact__form{box-shadow:0 24px 60px -24px #0006}
[data-home-page] .ft{background:var(--home-ink);color:var(--home-cream);border-top:1px solid #f3f0e81f}
[data-home-page] .ft .wm,
[data-home-page] .ft__h,
[data-home-page] .ft__col a,
[data-home-page] .ft__col a:hover,
[data-home-page] .ft__giant,
[data-home-page] .ft__giant span{color:var(--home-cream)}
[data-home-page] .ft__brand,
[data-home-page] .ft__price,
[data-home-page] .ft__bottom{color:var(--home-night-muted)}
[data-home-page] .ft__bottom{border-top-color:#f3f0e833}

/* La commande suit la scene ; sur mobile les apercus forment une pile. */
[data-home-page] .home-preview{height:calc((100vw - 2 * var(--gutter)) * .368 + 44px);min-height:0}
.home-preview-controls{display:flex;justify-content:center;margin-top:8px}
.home-preview-controls:has([data-home-playback][hidden]){display:none}
[data-home-page] .home-preview-controls .home-preview-playback{min-height:44px;padding:8px 12px;border:0;background:transparent;color:var(--home-muted);font:inherit;font-size:12px;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
[data-home-page] .home-preview-controls .home-preview-playback:focus-visible{outline:2px solid var(--c-cobalt);outline-offset:3px;border-radius:6px}
@media(max-width:600px){
 [data-home-page] .hd__in{min-height:72px;padding-block:10px;column-gap:8px}
 [data-home-page] .hd__brand{order:1;flex-shrink:0}
 [data-home-page] .hd__brand .wm{width:64px;height:34px}
 [data-home-page] .hd__in > .hd__cta{order:2;margin-left:auto;flex-shrink:0;min-height:44px;padding:10px 12px;font-size:11px;line-height:1.2;gap:0;white-space:nowrap}
 .js [data-home-page] .hd.is-open .hd__in > .hd__cta{width:auto;min-height:44px}
 [data-home-page] .hd__in > .hd__cta svg{display:none}
 [data-home-page] .hd__toggle{order:3;flex-shrink:0;justify-content:center;width:44px;height:44px;margin-left:0;padding:0}
 [data-home-page] .hd__toggle-label{display:none}
 [data-home-page] .hd__nav{order:4;flex-basis:100%}
 [data-home-page] .home-intro__aside > .btn{display:none}
 [data-home-page] .home-preview{--preview-stack-step:calc((100vw - 20px) * .0432593 + 52px);width:calc(100% + 20px);margin:22px -10px 0;height:calc((100vw - 20px) * .5407407 + 104px);perspective:none}
 [data-home-page] [data-home-card].home-preview__main{left:0;top:0;width:100%;z-index:3;transform:none;transform-origin:center center;border-radius:12px}
 [data-home-page] [data-home-card].home-preview__side--right{left:4%;top:var(--preview-stack-step);width:92%;z-index:2;transform:none;transform-origin:center center;border-radius:12px}
 [data-home-page] [data-home-card].home-preview__side--left{left:8%;top:calc(2 * var(--preview-stack-step));width:84%;z-index:1;transform:none;transform-origin:center center;border-radius:12px}
 [data-home-page] .home-preview-controls{margin-top:12px}
}
@media(max-width:360px){
 [data-home-page] .hd__in{column-gap:6px}
 [data-home-page] .hd__brand .wm{width:56px;height:30px}
 [data-home-page] .hd__in > .hd__cta{padding-inline:10px;font-size:10.5px}
}