@import url("/assets/css/syne.css");
/* Identity and content substitutions only; source layout/styles stay intact. */
#siteHeader .logo .vayam-logo{width:148px;height:auto;filter:brightness(0) invert(1)}
#siteHeader.on-light .logo .vayam-logo{filter:brightness(0)}
.header-lang,.langswitch{display:none!important}
.why-vayam-logo{position:absolute;width:65%;height:auto;left:17.5%;top:40%;z-index:1;filter:brightness(0) invert(1)}
.local-form-status{font-size:13px;line-height:1.5;margin:16px 0 0;color:inherit}
@media(max-width:700px){#siteHeader .logo .vayam-logo{width:120px}}
.insights-card[hidden]{display:none!important}
/* All brand and client marks use black artwork, including formerly white marks. */
#siteHeader .logo .vayam-logo,#siteHeader.on-light .logo .vayam-logo,.why-vayam-logo,
img[src*="logo-light"],img[src*="logo-dark"]{filter:brightness(0)!important}
#siteHeader .logo{background:#fff;border-radius:6px;padding:6px 10px;display:inline-flex}
#siteHeader .logo .vayam-logo{position:relative!important;left:auto!important;top:auto!important;width:100%!important;max-width:148px}
#siteHeader .logo{height:auto!important;width:168px!important;align-items:center;mix-blend-mode:normal!important}
@media(max-width:760px){#siteHeader .logo{width:140px!important}}

/* Monochrome foundation with red used sparingly for interaction. */
:root{--ink:#202020;--muted:#838383;--kt-ink:#181818;--kt-muted:#777;--brand:#D50B00;--brand-light:#D50B00;--accent:#D50B00;--kt-blue:#D50B00;--kt-light:#f0f0f0}
.client-marquee{position:relative;overflow:hidden;width:100%;padding:22px 0 42px;mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent)}
.client-marquee__track{display:flex;width:max-content;animation:client-flow 42s linear infinite;will-change:transform}
.client-marquee__group{display:flex;align-items:center;gap:50px;padding-right:50px;flex:none}
.client-mark{display:flex;align-items:center;justify-content:center;flex:0 0 180px;width:180px;height:110px;background:none;border:0;border-radius:0;outline-offset:5px}
.client-mark img{display:block;width:180px!important;height:110px!important;max-width:none;object-fit:contain;filter:grayscale(1) contrast(1.4);transition:filter .3s ease,opacity .3s ease}
.client-mark--light img{filter:brightness(0)}
.client-mark:not(.client-mark--light):hover img,.client-mark:not(.client-mark--light):focus-visible img{filter:none}
.client-marquee:hover .client-marquee__track,.client-marquee:focus-within .client-marquee__track,.client-marquee.is-paused .client-marquee__track{animation-play-state:paused}
.client-marquee__pause{position:absolute;right:5%;bottom:0;background:transparent;border:0;padding:8px 0;color:#777;font:inherit;font-size:11px;cursor:pointer}
.client-marquee__pause:hover{color:var(--brand)}
@keyframes client-flow{to{transform:translateX(-50%)}}
body.cms-editing .client-marquee__track{animation-play-state:paused}
@media(max-width:700px){.client-mark{flex-basis:140px;width:140px;height:90px}.client-mark img{width:140px!important;height:90px!important}.client-marquee__group{gap:32px;padding-right:32px}}
@media(prefers-reduced-motion:reduce){.client-marquee__track{animation:none}.client-marquee{overflow-x:auto;mask-image:none}.client-marquee__pause{display:none}.client-marquee__group[aria-hidden]{display:none}}

/* Red accent palette; transparent logo with contrast-aware artwork. */
:root{--brand:#D50B00;--brand-light:#D50B00;--accent:#D50B00;--kt-blue:#D50B00;--kt-light:#fff1f2}
#siteHeader .logo{background:transparent!important;padding:0!important;border-radius:0!important}
#siteHeader:not(.on-light) .logo .vayam-logo{filter:brightness(0) invert(1)!important}
#siteHeader.on-light .logo .vayam-logo{filter:brightness(0)!important}

/* Keyboard and selected states follow the Vayam red palette. */
:focus-visible{outline:2px solid var(--brand);outline-offset:4px}
#filterBtn.on,#filterpanel .chip.on{background:var(--brand);border-color:var(--brand);color:#fff}

/* Red navigation actions in both light and dark header states. */
body #siteHeader .cta,body #siteHeader.on-light .cta{background:#D50B00;color:#fff}
body #siteHeader .cta:hover,body #siteHeader.on-light .cta:hover{background:#b9182a;color:#fff}
.nav .knob{background:#D50B00!important}
#talkCard .tc-cta,.talk-card .tc-cta{background:#D50B00;color:#fff}

#talkCard .tc-btn{background:#D50B00;color:#fff}

/* Public CMS entry and the single Vayam red. */
.site-footer__social-group .cms-admin-entry{display:none!important}
[data-cms-selected]{outline-color:#D50B00!important}
.tc-cap{display:none!important}

/* Featured work must remain readable when CMS content arrives after motion setup. */
body[data-nav="home"] .projects__grid .project-reveal{opacity:1!important;translate:none!important;visibility:visible!important}
body[data-nav="home"] .projects__grid .project__media>img,
body[data-nav="home"] .projects__grid .project__media>video{clip-path:none!important;opacity:1!important;visibility:visible!important;transform:scale(1.025)!important}
@media (hover:hover){body[data-nav="home"] .projects__grid .project:hover .project__media>img,body[data-nav="home"] .projects__grid .project:hover .project__media>video{transform:scale(1.04)!important}}
#talkCard .tc-btn:hover{background:#b9182a}
#talkCard .tc-name{font-size:16px;white-space:normal;line-height:1.15;overflow-wrap:normal}
@media(max-width:700px){#talkCard .tc-name{font-size:13px;white-space:normal;line-height:1.2}}