/* Three independently rotating, curved image ribbons. */
.hero-in{grid-template-columns:minmax(0,1fr) 390px;gap:38px}
.creator-ribbons{position:relative;min-width:0;align-self:center;width:100%;margin:0}
.ribbon-viewport{position:relative;height:570px;perspective:1100px;isolation:isolate}
.ribbon-viewport::before{content:"";position:absolute;inset:18% 5%;border-radius:50%;background:radial-gradient(ellipse,#2463eb15,transparent 70%);filter:blur(20px)}
.ribbon-viewport::after{content:"";position:absolute;left:5%;right:5%;bottom:15px;height:35px;background:#12182620;filter:blur(24px);border-radius:50%;z-index:-1}
.ribbon-sculpture{position:absolute;top:50%;left:50%;width:0;height:0;transform-style:preserve-3d;transform:rotateZ(-13deg) rotateX(-12deg)}
.ribbon-ring{position:absolute;width:0;height:0;transform-style:preserve-3d;animation:ribbon-orbit 44s linear infinite;--start:8deg}
.ribbon-ring:nth-child(1){top:-156px;--start:8deg;animation-duration:44s}
.ribbon-ring:nth-child(2){top:0;--start:42deg;animation-duration:52s;animation-direction:reverse}
.ribbon-ring:nth-child(3){top:156px;--start:103deg;animation-duration:48s}
.ribbon-slice{position:absolute;left:-25px;top:-66px;width:50px;height:132px;overflow:hidden;background:#111720;backface-visibility:hidden;transform:rotateY(var(--angle)) translateZ(188px)}
.ribbon-slice img{position:absolute;top:0;left:calc(var(--slice) * -50px);width:200px;max-width:none;height:132px;object-fit:cover;pointer-events:none;user-select:none}
.ribbon-slice::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#ffffff14,transparent 20%,transparent 85%,#0002);pointer-events:none}
.ribbon-caption{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;margin-top:8px;color:var(--ink-3);font:10px var(--f-mono);line-height:1.5}
.ribbon-caption a{text-decoration:none}.ribbon-caption a:hover{color:var(--accent)}
.ribbon-pause{width:28px;height:28px;flex-shrink:0;border:1px solid var(--line-2);border-radius:50%;background:transparent;cursor:pointer;font:12px var(--f-body)}
.creator-ribbons[data-paused=true] .ribbon-ring,.creator-ribbons[data-visible=false] .ribbon-ring{animation-play-state:paused}
@keyframes ribbon-orbit{from{transform:rotateY(var(--start))}to{transform:rotateY(calc(var(--start) + 360deg))}}
/* Match the existing profile's body typography in all requested introductions. */
.profile-summary .traits,.profile-summary .seo-intro,#prestations .s-head>p,#pour-qui .s-head>p{font-family:var(--f-body);font-size:clamp(18px,1.5vw,22px);font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--ink-2);text-align:left}
@media(max-width:1100px) and (min-width:761px){.hero-in{grid-template-columns:minmax(0,1fr) 315px;gap:20px}.ribbon-sculpture{transform:scale(.78) rotateZ(-13deg) rotateX(-12deg)}.ribbon-viewport{height:490px}.ribbon-caption{font-size:8px;gap:8px}}
@media(max-width:760px){.hero-in{grid-template-columns:1fr}.creator-ribbons{max-width:390px;margin:5px auto 0}.ribbon-viewport{height:475px}.ribbon-sculpture{transform:scale(.78) rotateZ(-13deg) rotateX(-12deg)}.ribbon-caption{font-size:9px}.creator-ribbons noscript img{max-width:100%;height:auto}}
@media(max-width:370px){.ribbon-sculpture{transform:scale(.66) rotateZ(-13deg) rotateX(-12deg)}.ribbon-viewport{height:415px}.ribbon-caption{font-size:8px}}
@media(prefers-reduced-motion:reduce){.ribbon-ring{animation:none;transform:rotateY(var(--start))}.ribbon-pause{display:none}}