/* Struxure — the living "ux" wordmark, shared by every page.
   The header wordmark is an inline SVG (SMIL gradient drift on the ux) plus three letterpress touch-ups
   driven by brand-live.js. Load this on any page that has a header wordmark; brand-live.js swaps the
   static <img> for the live SVG. */
svg.brand-word--live{display:block;width:auto;height:34px;overflow:visible}
.lockup-live{display:inline-flex;align-items:center;gap:12px;height:40px}
.lockup-live .lockup-mark{height:40px;width:40px;display:block}
.lockup-live svg.brand-word--live{height:30px}
@media(max-width:560px){.lockup-live{height:26px;gap:8px}.lockup-live .lockup-mark{height:26px;width:26px}.lockup-live svg.brand-word--live{height:20px}}
/* ---------- living letterpress: an invisible calligrapher touches up the "ux" every ~16s ---------- */
.brand-word--live .lp path{fill:none;stroke:#E9C77B;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;opacity:0;vector-effect:non-scaling-stroke}
/* A — ink trace: a 22-unit champagne line travels the inner bowl of the u (glyph contour 76→126 of 259) */
.brand-word--live .lp-u{stroke-dasharray:22 259;stroke-dashoffset:-76}
.brand-word--live.lp-a .lp-u{animation:lpTraceU 1.9s cubic-bezier(.45,0,.25,1) forwards}
@keyframes lpTraceU{0%{opacity:0;stroke-dashoffset:-70}15%{opacity:.95}85%{opacity:.9}100%{opacity:0;stroke-dashoffset:-112}}
/* B — crossing stroke: a 24-unit stroke climbs the left diagonal of the x (0→62 of 280), then a tiny flourish lifts off the top-right */
.brand-word--live .lp-x{stroke-dasharray:24 280;stroke-dashoffset:2}
.brand-word--live.lp-b .lp-x{animation:lpTraceX 1.6s cubic-bezier(.45,0,.25,1) forwards}
@keyframes lpTraceX{0%{opacity:0;stroke-dashoffset:4}15%{opacity:1}80%{opacity:.9}100%{opacity:0;stroke-dashoffset:-42}}
.brand-word--live .lp-fl{stroke-dasharray:40 40;stroke-dashoffset:40;stroke-width:.9}
.brand-word--live.lp-b .lp-fl{animation:lpFlourish 1.7s ease-out .55s forwards}
@keyframes lpFlourish{0%{opacity:0;stroke-dashoffset:40}25%{opacity:.85}60%{stroke-dashoffset:0;opacity:.85}100%{opacity:0;stroke-dashoffset:0}}
/* C — ink bloom: the coral warms toward champagne and settles back, with a soft glow; no strokes */
.brand-word--live .ux{transition:filter .6s ease}
.brand-word--live.lp-c .ux{animation:lpBloom 2s ease-in-out forwards}
@keyframes lpBloom{0%{filter:none}35%{filter:brightness(1.18) saturate(.85) sepia(.35) drop-shadow(0 0 4px rgba(233,199,123,.55))}70%{filter:brightness(1.08) sepia(.15) drop-shadow(0 0 3px rgba(242,173,120,.4))}100%{filter:none}}
/* all variations: a breath of warmth on the letters while they're being touched */
.brand-word--live.lp-a .ux,.brand-word--live.lp-b .ux{animation:lpWarm 1.9s ease-in-out forwards}
@keyframes lpWarm{0%,100%{filter:none}45%{filter:brightness(1.1) drop-shadow(0 0 3px rgba(242,173,120,.45))}}
@media(max-width:860px){.brand-word--live .lp path{stroke-width:.8}.brand-word--live .lp-fl{display:none}.brand-word--live.lp-c .ux,.brand-word--live.lp-a .ux,.brand-word--live.lp-b .ux{animation-duration:1.4s}}
@media (prefers-reduced-motion:reduce){.brand-word--live .lp{display:none}.brand-word--live .ux{animation:none!important;filter:none!important}}
