/* P08: the P03 first view, followed immediately by a single ink-text belt. */
body[data-perspective="08-heart"] .hero-heading h1{font-size:clamp(30px,3vw,48px)}
@media(min-width:801px) and (max-height:800px){body[data-perspective="08-heart"] .hero-heading h1{font-size:35px}}
@media(max-width:800px){body[data-perspective="08-heart"] .hero-heading h1{font-size:clamp(29px,4.6vw,35px)}}
@media(max-width:540px){body[data-perspective="08-heart"] .hero-heading h1{font-size:clamp(23px,7.1vw,31px)}}

.ink-belt .service-belt{--cube-h:180px;background:#09070d;perspective:none}
.ink-belt .service-cube{width:clamp(340px,34vw,520px);color:#fff;text-align:center}
.ink-belt :is(.cube-front,.cube-top){justify-content:center;gap:0;padding:16px 24px;background:#09070d;border-color:#9162a866}
.ink-belt .cube-top{background:#2c1e46}
.ink-belt .service-cube .belt-title{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;gap:2px;white-space:nowrap}
.ink-belt .service-cube .belt-caption{position:relative;font:500 14px/1.5 var(--jp);letter-spacing:.08em;color:#dfd1e7}
.ink-belt .service-cube .belt-ink{position:relative;display:block;isolation:isolate;font:700 clamp(70px,7.36vw,111px)/1 var(--sans);letter-spacing:-.045em;padding:.06em .07em;white-space:nowrap;color:transparent;-webkit-text-fill-color:transparent;background:radial-gradient(circle,#fff 0 1.1px,transparent 1.35px) 0 0/3px 3px;background-clip:text;-webkit-background-clip:text;filter:url('#belt-type-glitch');animation:signal-jolt 1.35s steps(1,end) infinite;animation-play-state:paused}
.ink-belt .belt-ink::before,.ink-belt .belt-ink::after{content:attr(data-ink-text);position:absolute;inset:0;padding:inherit;font:inherit;letter-spacing:inherit;white-space:pre;color:transparent;-webkit-text-fill-color:transparent;background-clip:text;-webkit-background-clip:text;mask-image:radial-gradient(circle,#000 0 1px,transparent 1.3px);mask-size:3px 3px;pointer-events:none;opacity:.9;animation:brand-ink-burst 1.35s steps(1,end) infinite;animation-play-state:paused}
.ink-belt .belt-ink::before{background-image:linear-gradient(180deg,#9162a8 0 24%,#2c1e46 24% 32%,#b58acb 32% 64%,#9162a8 64% 82%,#2c1e46 82% 100%);transform:translate(-.022em,.007em)}
.ink-belt .belt-ink::after{background-image:linear-gradient(180deg,#dfc6ef 0 32%,#b58acb 32% 54%,#9162a8 54% 72%,#dfc6ef 72% 100%);mask-position:1.5px 1px;transform:translate(.024em,-.007em);animation-duration:1.1s;animation-delay:-.29s;animation-direction:reverse}
.ink-belt .service-cube .belt-ink-core{position:relative;z-index:1;display:block;font:inherit;letter-spacing:inherit;color:transparent;-webkit-text-fill-color:transparent;background:inherit;background-clip:text;-webkit-background-clip:text}
.ink-belt .service-cube:nth-child(2n) .belt-ink{animation-delay:-.41s}
.ink-belt .service-cube:nth-child(3n) .belt-ink{animation-delay:-.82s}
.ink-belt .belt-in-view:not(.belt-paused) .belt-ink,.ink-belt .belt-in-view:not(.belt-paused) .belt-ink::before,.ink-belt .belt-in-view:not(.belt-paused) .belt-ink::after{animation-play-state:running}
.ink-belt .belt-paused .belt-ink{filter:none}
.ink-belt .belt-paused .belt-ink::before,.ink-belt .belt-paused .belt-ink::after{animation:none;clip-path:none}
@media(max-width:600px){.ink-belt .service-belt{--cube-h:140px}.ink-belt .service-cube{width:300px}.ink-belt .service-cube .belt-ink{font-size:70px}.ink-belt .service-cube .belt-caption{font-size:12px}.ink-belt :is(.cube-front,.cube-top){padding:12px 18px}}
@media(prefers-reduced-motion:reduce){.ink-belt .belt-ink,.ink-belt .belt-ink::before,.ink-belt .belt-ink::after{animation:none!important;filter:none!important}}

/* Bring the resting face back onto the cell plane: no overlap with its neighbour. */
.ink-belt .service-cube-body{transform:translateZ(calc(var(--cube-h)/-2))}
.ink-belt .service-cube[aria-pressed=true] .service-cube-body,.ink-belt .service-cube:focus-visible .service-cube-body{transform:translateZ(calc(var(--cube-h)/-2)) rotateX(-90deg)}
@media(hover:hover){.ink-belt .service-cube:hover .service-cube-body{transform:translateZ(calc(var(--cube-h)/-2)) rotateX(-90deg)}}
.ink-belt .service-cube .belt-caption-core{display:block;font:inherit;letter-spacing:inherit;animation:hero-headline-idle-twitch 3.8s steps(1,end) infinite;animation-play-state:paused}
.ink-belt .belt-caption::before{content:attr(data-caption-text);position:absolute;inset:0;z-index:1;white-space:pre;pointer-events:none;color:#f1e5fa;text-shadow:-3px 0 #9162a8,2px 0 #c6a0da;opacity:0;animation:hero-headline-idle-signal 3.8s steps(1,end) infinite;animation-play-state:paused}
.ink-belt .belt-in-view:not(.belt-paused) .belt-caption::before,.ink-belt .belt-in-view:not(.belt-paused) .belt-caption-core{animation-play-state:running}
.ink-belt .belt-paused .belt-caption::before{display:none}
.ink-belt .belt-paused .belt-caption-core{animation:none}
@media(prefers-reduced-motion:reduce){.ink-belt .belt-caption::before{display:none}.ink-belt .belt-caption-core{animation:none!important}}