/* wordmark-parts: one part of the name lit in the accent, the rest stepped back, and what that
   part means set large beneath it (client tokens only) */
.wp{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:56px; }
.wp-art{ width:min(74%, 900px); }
.wp-art svg{ display:block; width:100%; height:auto; overflow:visible; }
.wp [data-part]{ fill:currentColor; transition:fill .6s cubic-bezier(0.32, 0.72, 0, 1), opacity .6s cubic-bezier(0.32, 0.72, 0, 1), filter .6s; cursor:pointer; }
.wp [data-part="tm"]{ cursor:default; }
.wp:not([data-on=""]) [data-part]{ opacity:.22; }
.wp[data-on="i"] [data-part="i"], .wp[data-on="motiv"] [data-part="motiv"], .wp[data-on="8"] [data-part="8"],
.wp[data-on="all"] [data-part]:not([data-part="tm"]){ fill:var(--c-brand-2); opacity:1;
  filter:drop-shadow(0 0 26px color-mix(in srgb, var(--c-brand-2) 45%, transparent)); }
.wp[data-on="all"] [data-part="tm"]{ opacity:.7; }

/* the meaning: one statement at a time, crossfading in place */
.wp-copy{ position:relative; width:min(74%, 900px); height:150px; }
.wp-say{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; text-align:center; gap:14px;
  opacity:0; translate:0 10px; transition:opacity .5s cubic-bezier(0.32, 0.72, 0, 1), translate .7s cubic-bezier(0.32, 0.72, 0, 1); pointer-events:none; }
.wp-say.is-on{ opacity:1; translate:0 0; transition-delay:.12s; }
.wp-h{ margin:0; font:700 40px/1.08 var(--c-display); letter-spacing:-.02em; color:var(--stage-fg); text-wrap:balance; }
.wp-p{ margin:0; max-width:680px; font:500 17px/1.5 var(--c-body); color:color-mix(in srgb, var(--stage-fg) 66%, transparent); text-wrap:pretty; }
@media (prefers-reduced-motion: reduce){ .wp [data-part], .wp-say{ transition:none; } }
/* the symbol alone (stage_content.kind = "symbol"): square, so sized by height */
.wp--symbol .wp-art{ width:auto; height:330px; aspect-ratio:323 / 225; }
.wp--symbol .wp-art svg{ height:100%; width:auto; }