/* MARKIVA / 05 · scoped contrast, continuous paper edge and a real paired loop.
 * --orange is deliberately unchanged. The yellow marquee, final light wash,
 * creative laboratory, orange cards and contact shutters retain their colors.
 */
:root{--brand-navy:#2a2c43;--brand-navy-hover:#3b3e5d}
.former-navy{--accent-ink:var(--brand-navy)}
.header.former-navy nav>a:not(.nav-contact):hover{color:var(--brand-navy);text-decoration:underline;text-underline-offset:5px}
.header.former-navy .nav-contact:hover{background:var(--brand-navy);color:var(--paper);border-color:var(--brand-navy)}
.hero.former-navy h1 .orange,.services.former-navy h2 .orange,.contact-body.former-navy h2 .orange,.footer.former-navy .footer-statement>span{color:var(--brand-navy)}
.former-navy .orange-button,.idea-result.former-navy .cream-button{background:var(--brand-navy);color:var(--paper);border-color:var(--brand-navy)}
.former-navy .orange-button:hover,.idea-result.former-navy .cream-button:hover{background:var(--brand-navy-hover);color:var(--paper);border-color:var(--brand-navy-hover)}
.former-navy .orange-button .circle-arrow{background:var(--paper);color:var(--brand-navy)}
.hero.former-navy .art-cross{color:var(--brand-navy)}
.hero.former-navy .switch-track{background:var(--brand-navy)}
.hero.former-navy .switch-track>span{background:var(--paper)}
.hero.former-navy .is-off .switch-track{background:var(--paper-deep);outline:1px solid var(--brand-navy)}
.hero.former-navy .is-off .switch-track>span{background:var(--brand-navy)}
.services.former-navy .service-sticker{background:var(--brand-navy);color:var(--paper)}
.services.former-navy .service-number,.services.former-navy .service-content>a,.services.former-navy .service-list details[open] h3,.services.former-navy .service-list details[open] .plus,.services.former-navy .service-list details[open] .service-icon,.services.former-navy .service-list summary:hover .service-icon{color:var(--brand-navy)}
.services.former-navy .service-content>a:hover{text-decoration:underline;text-underline-offset:5px}
.idea-result.former-navy .result-spark{color:var(--brand-navy)}
.contact-body.former-navy .phone-link:hover,.contact-body.former-navy .form-feedback,.footer.former-navy .footer-statement .mi{color:var(--brand-navy)}
.contact-body.former-navy .form-feedback a{text-decoration:underline;text-underline-offset:4px}
.contact-body.former-navy input:focus,.contact-body.former-navy select:focus,.contact-body.former-navy textarea:focus{border-color:var(--brand-navy);box-shadow:0 1px 0 var(--brand-navy)}
/* Initial and middle phases used to live on navy, but the final yellow phase
 * is a separate surface: do not repaint its background or its button. */
.idea-journey .journey-first .orange,.idea-journey .journey-second .orange,.idea-journey .part-label small{color:var(--brand-navy)}
.idea-journey .part-label i::before{background:var(--brand-navy)}
/* A single uninterrupted outgoing edge meets the following SVG. Keeping the
 * top rounding preserves the chapter entrance without the two beige pockets.
 * No side/bottom hairline is allowed to interrupt this shared surface. */
.idea-journey .journey-stage{border:0;border-bottom-left-radius:0;border-bottom-right-radius:0}
.idea-journey+.chapter-bridge{margin-top:-2px}
/* Anchor the SVG to its bottom edge. Scaling inside its own box, rather than
 * translating an oversized drawing, avoids a clipped/flat crest and keeps
 * the incoming color joined to the next section throughout the scroll. */
.chapter-bridge .bridge-wave{inset:auto -1px -1px;width:calc(100% + 2px);height:calc(100% + 2px);transform:scaleY(var(--bridge-scale,1));transform-origin:50% 100%}
/* Each half contains exactly the same complete sequences AND the final gap.
 * The percentage endpoint is consequently exact even at fractional zoom/DPR. */
.marquee{--marquee-gap:38px;color:var(--brand-navy);isolation:isolate}
.marquee>.marquee-track{display:flex;align-items:center;gap:0;width:max-content;max-width:none;white-space:nowrap;animation:markiva-marquee-loop 45s linear infinite;will-change:transform}
.marquee.is-ready>.marquee-track{animation:none}
.marquee-group,.marquee-sequence{display:flex;align-items:center;flex:0 0 auto;width:max-content;white-space:nowrap}
.marquee-group{gap:0}
.marquee-sequence{gap:var(--marquee-gap);padding-right:var(--marquee-gap)}
.marquee-sequence>span{flex:0 0 auto;white-space:nowrap;line-height:1.25}
.marquee-spark{display:flex;align-items:center;justify-content:center;width:1em;height:1em;flex:0 0 auto;line-height:1}
.marquee-spark svg{width:100%;height:100%;display:block;overflow:visible}
@keyframes markiva-marquee-loop{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media(max-width:800px){.marquee{--marquee-gap:28px}}
.motion-paused .marquee>.marquee-track{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.marquee>.marquee-track{animation:none;will-change:auto}}
