/* home : styles propres à la page, repris de l'export Claude Design (chargés après site.css). */
.mscreen,.mphone{flex-shrink:0}
.card{display:flex;flex-direction:column;gap:16px;height:100%;box-sizing:border-box;padding:24px;border-radius:24px;border:2px solid #1C1240;background:#FFFDFA;color:#1C1240;text-decoration:none;transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s ease-out}
.card:hover,.card:focus-visible{transform:translate(-4px,-4px);box-shadow:8px 8px 0 #1C1240;color:#1C1240}
.card .arr{display:inline-block;transition:transform .25s cubic-bezier(.34,1.56,.64,1)}
.card:hover .arr,.card:focus-visible .arr{transform:translateX(4px)}
.viz{height:248px;border-radius:16px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.mphone{width:124px;height:232px;box-sizing:border-box;padding:6px;border-radius:24px;background:#1C1240;box-shadow:6px 6px 0 rgba(28,18,64,.25);transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
.mscreen{position:relative;width:112px;height:220px;border-radius:18px;overflow:hidden;background:#FFFDFA}
.track{display:flex;width:224px;height:100%}
.page{width:112px;height:100%;box-sizing:border-box;padding:18px 8px 8px;display:flex;flex-direction:column;gap:6px}
.page img{display:block;width:112px;height:220px;object-fit:cover;object-position:top;margin:-18px -8px -8px}
.sk{border-radius:6px;background:#E4DBFF}
.tap{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:rgba(255,90,54,.55);border:2px solid #FF5A36;opacity:0}
.card:hover .mphone,.card:focus-visible .mphone{transform:translateY(-6px) rotate(-2deg)}
.card:hover .track,.card:focus-visible .track{animation:navSlide 4.5s ease-in-out infinite}
.card:hover .tap,.card:focus-visible .tap{animation:tap 4.5s ease-in-out infinite}
@keyframes navSlide{0%,28%{transform:translateX(0)}40%,80%{transform:translateX(-112px)}92%,100%{transform:translateX(0)}}
@keyframes tap{0%,12%{opacity:0;transform:scale(.4)}20%{opacity:1;transform:scale(1)}30%,100%{opacity:0;transform:scale(1.4)}}
.rzv{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;object-position:top;opacity:0}.rzv:first-child{opacity:1}
.card:hover .rzv,.card:focus-visible .rzv{animation:rzvSwap 10s ease-in-out infinite both}
@keyframes rzvSwap{0%{opacity:0;transform:translateX(14px)}4%,25%{opacity:1;transform:none}29%,100%{opacity:0;transform:translateX(-14px)}}
.mscreen>img.one{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
@media (min-width:640px){.nw{white-space:nowrap}}
.tags{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.tags li{padding:4px 12px;border-radius:999px;font-size:14px;font-weight:600;line-height:1.4}
.tags .dom{background:#CDBBFF}
.tags .goal{background:#FFFDFA;box-shadow:inset 0 0 0 2px #1C1240}
.card .desc{display:none}
.scroller{list-style:none;margin:0;padding:8px 16px 24px 8px;display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:8px;scrollbar-color:#1C1240 #E4DBFF}
.scroller>li{flex:0 0 min(340px,82vw);scroll-snap-align:start}
.scroller:focus-visible{outline:3px solid #1C1240;outline-offset:4px;border-radius:16px}
.arrow{width:48px;height:48px;border-radius:50%;border:2px solid #1C1240;background:#FFFDFA;color:#1C1240;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease-out}
.arrow:hover,.arrow:focus-visible{transform:translate(-2px,-2px);box-shadow:4px 4px 0 #1C1240;background:#FFD23F}
.offer ul{margin:0;padding-left:24px;display:flex;flex-direction:column;gap:8px}
/* vignettes A : vrais écrans */
.page{padding:0}.page img{margin:0}
.viz .mphone{width:140px;height:262px;padding:7px;border-radius:28px}
.viz .mscreen{width:126px;height:248px;border-radius:21px}
.viz .track{width:252px}.viz .page{width:126px}.viz .page img{width:126px;height:248px}
@keyframes navSlide{0%,28%{transform:translateX(0)}40%,80%{transform:translateX(-126px)}92%,100%{transform:translateX(0)}}
.viz{height:288px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}