/* Shared rule for bare text CTAs. Contreforme is the approved navigation variant. */
.afro-text-cta{position:relative;display:inline-block;color:inherit;text-decoration:none;isolation:isolate;white-space:nowrap;outline-offset:8px;}
.afro-text-cta .cta-ink{position:relative;display:block;}
.afro-text-cta .cta-copy{position:absolute;inset:0;pointer-events:none;}
.afro-text-cta:focus-visible{outline:1px solid currentColor;border-radius:2px;}
.afro-cta-overflow{overflow:visible!important;}
/* 01 — Only the narrow central slice of the letters moves. */
[data-hover=incise] .cta-copy{clip-path:inset(43% 0 43% 0);opacity:0;transition:transform .25s ease,opacity .15s ease;}
[data-hover=incise]:is(:hover,:focus-visible) .cta-ink{mask-image:linear-gradient(to bottom,#000 0 43%,transparent 43% 57%,#000 57%);}
[data-hover=incise]:is(:hover,:focus-visible) .cta-copy{transform:translateX(2px);opacity:1;}
/* 02 — A hairline of negative space passes through the word once. */
[data-hover=reserve]::after{content:'';position:absolute;inset:14% auto 14% 0;width:.12em;background:#fff;mix-blend-mode:difference;opacity:0;pointer-events:none;}
[data-hover=reserve]:is(:hover,:focus-visible)::after{animation:cta-reserve .55s cubic-bezier(.25,.7,.3,1) both;}
@keyframes cta-reserve{0%{left:-.2em;opacity:0}10%{opacity:1}85%{opacity:1}100%{left:calc(100% + .1em);opacity:0}}
/* 03 — One fine outlined memory of the word, never a loop. */
[data-hover=echo] .cta-copy{color:transparent;-webkit-text-stroke:.65px #eae9e3;opacity:0;}
[data-hover=echo]:is(:hover,:focus-visible) .cta-copy{animation:cta-echo .65s cubic-bezier(.22,.61,.36,1);}
@keyframes cta-echo{0%{transform:translateY(0);opacity:0}20%{transform:translateY(-2px);opacity:.8}55%{transform:translateY(-5px);opacity:.5}100%{transform:translateY(-7px);opacity:0}}
/* 04 — Two opposing crop marks frame the choice. */
[data-hover=reperes]::before,[data-hover=reperes]::after{content:'';position:absolute;width:6px;height:6px;opacity:0;pointer-events:none;transition:opacity .18s ease,transform .3s cubic-bezier(.22,.61,.36,1);}
[data-hover=reperes]::before{left:-12px;top:4px;border-top:1px solid currentColor;border-left:1px solid currentColor;transform:translate(-3px,-3px);}
[data-hover=reperes]::after{right:-12px;bottom:4px;border-bottom:1px solid currentColor;border-right:1px solid currentColor;transform:translate(3px,3px);}
[data-hover=reperes]:is(:hover,:focus-visible)::before,[data-hover=reperes]:is(:hover,:focus-visible)::after{opacity:.8;transform:translate(0);}
/* 05 — A tiny change of plane travels through the letters. */
[data-hover=pli] .cta-ink{perspective:400px;}
[data-hover=pli] .cta-letter{display:inline-block;transform-origin:50% 65%;}
[data-hover=pli]:is(:hover,:focus-visible) .cta-letter{animation:cta-pli .34s cubic-bezier(.22,.61,.36,1) both;animation-delay:calc(var(--letter) * 12ms);}
@keyframes cta-pli{0%,100%{transform:rotateY(0);opacity:1}45%{transform:rotateY(32deg);opacity:.72}}
/* Persistent options: settle into a stable hover/focus state. */
[data-hover=sillage] .cta-ink{z-index:1;}
[data-hover=sillage] .cta-copy{z-index:0;color:transparent;-webkit-text-stroke:.8px #eae9e3;opacity:0;transition:opacity .22s ease,transform .32s cubic-bezier(.22,.61,.36,1);}
[data-hover=sillage]:is(:hover,:focus-visible) .cta-copy{opacity:.85;transform:translate(6px,-4px);}
[data-hover=rythme] .cta-letter{display:inline-block;transition:transform .28s cubic-bezier(.22,.61,.36,1);}
[data-hover=rythme]:is(:hover,:focus-visible) .cta-letter:nth-child(odd){transform:translateY(-1.5px);}
[data-hover=rythme]:is(:hover,:focus-visible) .cta-letter:nth-child(even){transform:translateY(1.5px);}
[data-hover=contreforme] .cta-ink{position:relative;z-index:1;mix-blend-mode:difference;}
[data-hover=contreforme]::before{content:'';position:absolute;left:-.12em;top:50%;width:.72em;height:.72em;background:#fff;border-radius:50%;transform:translateY(-50%) scale(0);transition:transform .32s cubic-bezier(.22,.61,.36,1);pointer-events:none;}
[data-hover=contreforme]:is(:hover,:focus-visible)::before{transform:translateY(-50%) scale(1);}
[data-hover=pli-tenu] .cta-ink{transition:transform .3s cubic-bezier(.22,.61,.36,1);}
[data-hover=pli-tenu] .cta-copy{clip-path:inset(0 0 50%);opacity:0;transition:opacity .15s ease,transform .3s cubic-bezier(.22,.61,.36,1);}
[data-hover=pli-tenu]:is(:hover,:focus-visible) .cta-ink{clip-path:inset(50% 0 0);transform:translateX(-1.5px);}
[data-hover=pli-tenu]:is(:hover,:focus-visible) .cta-copy{opacity:1;transform:translateX(1.5px);}
[data-hover=seuil]::after{content:'';position:absolute;right:-10px;top:20%;height:60%;width:1px;background:currentColor;transform:scaleY(0);transform-origin:50% 50%;transition:transform .28s cubic-bezier(.22,.61,.36,1),opacity .2s ease;opacity:0;}
[data-hover=seuil]:is(:hover,:focus-visible)::after{transform:scaleY(1);opacity:.85;}
@media(prefers-reduced-motion:reduce){.afro-text-cta *,.afro-text-cta::before,.afro-text-cta::after{animation:none!important;transition:none!important}.afro-text-cta:is(:hover,:focus-visible){color:#fff}.afro-text-cta .cta-copy{display:none}[data-hover=incise]:is(:hover,:focus-visible) .cta-ink{mask-image:none}[data-hover=pli-tenu]:is(:hover,:focus-visible) .cta-ink{clip-path:none;transform:none}}
@media(prefers-reduced-motion:reduce){[data-hover=sillage] .cta-copy{display:block}}
