/* cs-tilda-design-sprint : styles propres à la page, repris de l'export Claude Design (chargés après site.css). */
.hero-art img{transition:transform .5s cubic-bezier(.34,1.56,.64,1)}
.hero-art:hover img{transform:rotate(-2deg) scale(1.03)}
.prose p{margin:0}
.prose ul{margin:0;padding-left:24px;display:flex;flex-direction:column;gap:8px}
.eyebrow{margin:0;font-size:14px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#4B4372}
.h2{margin:0 0 8px;font-size:clamp(36px,4vw,48px);font-weight:800;line-height:1.1;letter-spacing:-.03em}
.h3{margin:16px 0 0;font-size:28px;font-weight:800;line-height:1.2;letter-spacing:-.02em}
.h4{margin:0;font-size:22px;font-weight:800;line-height:1.3}
.sec{display:flex;flex-direction:column;gap:16px}
figure{margin:0;display:flex;flex-direction:column;gap:12px}
figcaption{font-size:14px;line-height:1.5;font-style:italic;color:#4B4372}
.shot{padding:24px;border-radius:32px;background:#E4DBFF;display:flex;justify-content:center;align-items:center}
.shot img{display:block;max-width:100%;height:auto;border-radius:16px}
.shot.sketches{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%, 240px),1fr));gap:24px;align-items:center;width:100%;box-sizing:border-box}
.shot.sketches img{width:100%;max-width:none}
.step{display:flex;align-items:center;gap:16px}
.step .n{flex:none;width:56px;height:56px;border-radius:18px;background:#1C1240;color:#CDBBFF;font-size:24px;font-weight:800;display:flex;align-items:center;justify-content:center;transform:rotate(-6deg)}
.hmw{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%, 220px),1fr));gap:16px}
.hmw li{padding:24px;border-radius:24px;background:#FFD23F;font-weight:600;line-height:1.4;box-shadow:6px 6px 0 #1C1240}
.hmw li:nth-child(2){background:#CDBBFF}.hmw li:nth-child(3){background:#FFD0C4}
.box{flex:1 1 260px;display:flex;flex-direction:column;gap:12px;padding:24px;border-radius:24px;background:#FFFDFA;border:2px solid #1C1240}
.box ul{margin:0;padding-left:24px;display:flex;flex-direction:column;gap:8px}
/* vignettes projets (style page d'accueil) */
.hv-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:24px}
.hv-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}
.hv-card:hover,.hv-card:focus-visible{transform:translate(-4px,-4px);box-shadow:8px 8px 0 #FFD23F;color:#1C1240;text-decoration:none}
.hv-card:focus-visible{outline:3px solid #FFD23F;outline-offset:4px}
.hv-card .arr{display:inline-block;transition:transform .25s cubic-bezier(.34,1.56,.64,1)}
.hv-card:hover .arr,.hv-card:focus-visible .arr{transform:translateX(4px)}
.hv-viz{height:288px;border-radius:16px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hv-phone{flex-shrink:0;width:140px;height:262px;box-sizing:border-box;padding:7px;border-radius:28px;background:#1C1240;box-shadow:6px 6px 0 rgba(28,18,64,.25);transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
.hv-screen{position:relative;flex-shrink:0;width:126px;height:248px;border-radius:21px;overflow:hidden;background:#FFFDFA}
.hv-track{display:flex;width:252px;height:100%}
.hv-page{flex-shrink:0;width:126px;height:100%}
.hv-page img{display:block;width:126px;height:248px;object-fit:cover;object-position:top}
.hv-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}
.hv-card:hover .hv-phone,.hv-card:focus-visible .hv-phone{transform:translateY(-6px) rotate(-2deg)}
.hv-card:hover .hv-track,.hv-card:focus-visible .hv-track{animation:hvSlide 4.5s ease-in-out infinite}
.hv-card:hover .hv-tap,.hv-card:focus-visible .hv-tap{animation:hvTap 4.5s ease-in-out infinite}
@keyframes hvSlide{0%,28%{transform:translateX(0)}40%,80%{transform:translateX(-126px)}92%,100%{transform:translateX(0)}}
@keyframes hvTap{0%,12%{opacity:0;transform:scale(.4)}20%{opacity:1;transform:scale(1)}30%,100%{opacity:0;transform:scale(1.4)}}
.hv-rz{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;object-position:top;opacity:0}.hv-rz:first-child{opacity:1}
.hv-card:hover .hv-rz,.hv-card:focus-visible .hv-rz{animation:hvRz 10s ease-in-out infinite both}
@keyframes hvRz{0%{opacity:0;transform:translateX(14px)}4%,25%{opacity:1;transform:none}29%,100%{opacity:0;transform:translateX(-14px)}}
@media (prefers-reduced-motion:reduce){.hv-card:hover .hv-rz,.hv-card:focus-visible .hv-rz{animation:none}}
.hv-screen>img.hv-one{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
.hv-tags{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.hv-tags li{padding:4px 12px;border-radius:999px;font-size:14px;font-weight:600;line-height:1.4}
.hv-tags .dom{background:#CDBBFF}
.hv-tags .goal{background:#FFFDFA;box-shadow:inset 0 0 0 2px #1C1240}
.hv-t{margin:0;font-family:'Bricolage Grotesque',system-ui,sans-serif;font-size:22px;font-weight:800;line-height:1.3;letter-spacing:-.01em}
@media (prefers-reduced-motion:reduce){.hv-card,.hv-phone,.hv-card .arr{transition:none}.hv-card:hover .hv-track,.hv-card:focus-visible .hv-track,.hv-card:hover .hv-tap,.hv-card:focus-visible .hv-tap{animation:none}.hv-card:hover .hv-phone,.hv-card:focus-visible .hv-phone{transform:none}}
.more{background:#1C1240;color:#FFF4EC}
.more-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%, 240px),1fr));gap:24px}
.more-card{position:relative;display:flex;flex-direction:column;gap:16px;height:100%;box-sizing:border-box;padding:24px;border-radius:24px;background:#FFF4EC;color:#1C1240;text-decoration:none;transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease-out}
.more-card:hover,.more-card:focus-visible{color:#1C1240;transform:translate(-4px,-4px);box-shadow:8px 8px 0 #FFD23F;text-decoration:none}
.more-card:focus-visible{outline:3px solid #FFD23F;outline-offset:4px}
.more-card .bar{height:8px;border-radius:999px}
.more-card .tags{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.more-card .tags li{padding:4px 12px;border-radius:999px;background:#E4DBFF;font-size:14px;font-weight:600}
.more-card .t{margin:0;font-family:'Bricolage Grotesque',system-ui,sans-serif;font-size:22px;font-weight:800;line-height:1.25}
.more-card .go{margin-top:auto;font-weight:700;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
