/* Exact solid RGB fills sampled from the supplied RD_P.png logo.
   Sequence follows the logo: top row left to right, then bottom row. */
:root{--brand-1:#e83089;--brand-2:#7c66aa;--brand-3:#ee7402;--brand-4:#f9b000;--brand-5:#009757;--brand-6:#004c99}
.color-1{--dot:var(--brand-1)}.color-2{--dot:var(--brand-2)}.color-3{--dot:var(--brand-3)}.color-4{--dot:var(--brand-4)}.color-5{--dot:var(--brand-5)}.color-6{--dot:var(--brand-6)}
.brand-dot{color:var(--dot);font-weight:inherit;font-size:.82em;letter-spacing:0}
.hero h1 .brand-dot{color:var(--dot)}
.hero .mosaic figure{isolation:isolate;--tone:var(--brand-6)}
.hero .mosaic .vekra{--tone:var(--brand-3)}
.hero .mosaic .newton{--tone:var(--brand-2)}
.hero .mosaic .stada{--tone:var(--brand-5)}
.mosaic img{filter:grayscale(1);transition:filter 1.2s ease}
.mosaic figure::after{content:"";position:absolute;inset:0;background:var(--tone);mix-blend-mode:color;opacity:.55;pointer-events:none;transition:opacity 1.2s ease;z-index:1}
.mosaic figcaption{z-index:2}
@media(min-width:801px) and (hover:hover) and (pointer:fine){.mosaic figure:hover img{filter:grayscale(0)}.mosaic figure:hover::after{opacity:0}}
.service-ribbon{display:flex;align-items:center;gap:16px;border-top:1px solid #ffffff16;padding:20px 0 23px;color:#989ca4}
.ribbon-window{overflow:hidden;flex:1;min-width:0;mask-image:linear-gradient(to right,transparent,#000 24px,#000 calc(100% - 24px),transparent)}
.ribbon-track{display:flex;width:max-content;animation:ribbon-drift 110s linear infinite}
.ribbon-group{display:flex;flex-shrink:0;align-items:center;gap:44px;padding-right:44px}
.ribbon-group>span{display:flex;align-items:center;gap:44px;white-space:nowrap;font-size:13px;letter-spacing:.035em}
.ribbon-dot{width:3px;height:3px;background:var(--dot);border-radius:50%;flex-shrink:0}
.ribbon-pause{width:32px;height:32px;flex-shrink:0;background:transparent;color:#b6b8bd;border:1px solid #ffffff25;cursor:pointer;font-size:12px}
.ribbon-pause:hover{color:white;border-color:#ffffff60}
.service-ribbon.paused .ribbon-track{animation-play-state:paused}
@keyframes ribbon-drift{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.ribbon-track{animation:none;transform:none;width:auto}.ribbon-group{flex-wrap:wrap;gap:12px 25px;padding:0}.ribbon-group>span{font-size:12px;gap:16px;white-space:normal}.ribbon-group+.ribbon-group,.ribbon-pause{display:none}.ribbon-window{mask-image:none}.mosaic img,.mosaic figure::after{transition:none}}



/* Terminal punctuation only; explicit classes apply identically at every viewport. */
.brand-dot.color-1{color:#e83089}.brand-dot.color-2{color:#7c66aa}.brand-dot.color-3{color:#ee7402}.brand-dot.color-4{color:#f9b000}.brand-dot.color-5{color:#009757}.brand-dot.color-6{color:#004c99}