/* One outer canvas, with navy replacing the site's dark section surfaces. */
:root{--kx-navy:#0b1422;--ink:#0b1422}
html,body{background:#f5f5f5}
body .home-project-wall{background:#f5f5f5}
body .work-section,body .partnerships,body .solutions,body .closing,body .agency-guide,body .next-step{background-color:#101113}
body.home-project-wall main>.work-section{background-color:#101113}
body .compact-brand{background-color:#101113}
body .wall-stage,body .wall-fallback a{background-color:#101113}
body footer.kx-contact-footer{background:linear-gradient(135deg,#010203 0%,#010203 60%,#004fa3 130%);box-shadow:0 0 0 12px #f5f5f5}
body .kx-footer-legal{background:#f5f5f5;color:#0b1422}
body .kx-footer-card{background:#fff;color:#0b1422}
body .kx-footer-form input:not([type=checkbox]),body .kx-footer-form textarea{background:#f5f5f5}
body footer.kx-contact-footer::before,body footer.kx-contact-footer::after{display:none!important}
body footer.kx-contact-footer{position:relative;isolation:isolate;outline:10px solid #f5f5f5;outline-offset:0}
body .mobile-header,body .mobile-nav,body .menu-panel{background-color:#101113}
/* Explicit paired colours prevent light-header rules from washing out mobile controls. */
html body header .mobile-menu-toggle,html body header.light-header .mobile-menu-toggle{background:#101113!important;color:#fff!important;border:1px solid #8b96a6!important;-webkit-text-fill-color:#fff!important}
html body header .mobile-menu-toggle span,html body header .mobile-menu-toggle svg{color:#fff!important;-webkit-text-fill-color:#fff!important}
html body dialog.mobile-menu{background:#101113!important;color:#fff!important}
html body .mobile-menu .mobile-menu-close{background:#202124!important;color:#fff!important;border:1px solid #8290a4!important}
html body .mobile-menu nav a,html body .mobile-menu .mobile-menu-ink,html body .mobile-menu summary,html body .mobile-menu-meta{color:#fff!important;-webkit-text-fill-color:#fff!important}
html body .mobile-menu .mobile-menu-contact{background:#c9f73c!important;color:#0b1422!important;-webkit-text-fill-color:#0b1422!important}
html body .mobile-menu .mobile-menu-contact span{color:#0b1422!important;-webkit-text-fill-color:#0b1422!important}
html body .mobile-menu-categories a{color:#f2f5fa!important;background:#202124!important}
html body .mobile-menu-toggle:focus-visible,html body .mobile-menu button:focus-visible{outline:2px solid #c9f73c;outline-offset:4px}
body .work-card,body .partner-card{background-color:#101113}
body .reel-modal,body .reel-screen,body .quick-panel{background-color:#101113}
/* Light editorial section immediately before the homepage contact footer. */
body.home-project-wall main>.agency-guide{background:#fff;color:#0b1422}
body.home-project-wall .agency-guide :is(h2,h3,summary,.agency-guide__eyebrow,.agency-number){color:#0b1422}
body.home-project-wall .agency-guide p,body.home-project-wall .agency-faq details p{color:#495260}
body.home-project-wall .agency-guide :is(.agency-service-grid article,.agency-evidence,.agency-decision,.agency-faq,.agency-faq details){border-color:#dce0e5}
body.home-project-wall .agency-guide a:hover{color:#0b1422;text-decoration:underline}
body.home-project-wall .agency-guide :is(a,summary):focus-visible{outline-color:#0b1422}
/* Kortex footer palette: neutral greys, black action, restrained brand green. */
body footer.kx-contact-footer{background:radial-gradient(ellipse at 100% 100%,rgba(201,247,60,.10),transparent 62%),#101113}
body .kx-footer-card{color:#101113}
body .kx-footer-card>h3 span,body .kx-footer-form>p{color:#737373}
body .kx-footer-form input:not([type=checkbox]),body .kx-footer-form textarea{background:#f3f3f3;color:#101113}
body .kx-footer-form input::placeholder,body .kx-footer-form textarea::placeholder{color:#737373}
body .kx-footer-form fieldset span{border-color:#d9d9d9}
body .kx-footer-form input:checked+span{background:#101113;color:#fff}
body .kx-footer-form button{background:#101113;color:#fff}
body .kx-footer-form button:hover{background:#000;color:#fff}
body .kx-footer-form :focus-visible,body .kx-footer-form input:focus-visible+span{outline-color:#c9f73c}
body .kx-footer-legal{background:#f3f3f3;color:#101113}
body footer.kx-contact-footer{outline-color:#f3f3f3;box-shadow:0 0 0 12px #f3f3f3}

/* Introductory text panels use a paired light surface and dark ink. */
body .page-hero,body .seo-service-hero{background-color:#fff;color:#0b1422}
body .page-hero :is(h1,p,.eyebrow),body .seo-service-hero :is(h1,p,.eyebrow){color:#0b1422}
body .page-hero h1 em,body .seo-service-hero h1 em{color:#c9f73c}

/* Agency references share the home client grid geometry and hover treatment. */
body .references .logo-wall{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
body .references .logo-wall>div{display:grid;place-items:center;aspect-ratio:auto;height:clamp(150px,12vw,200px);min-height:0;background:#f3f3f3;border:0;border-radius:14px;transition:filter .45s ease,transform .45s ease}
body .references .logo-wall>div img{filter:brightness(0);transition:transform .45s ease}
@media(hover:hover) and (pointer:fine){body .references .logo-wall:has(>div:hover)>div:not(:hover){filter:blur(5px)}body .references .logo-wall>div:hover{transform:scale(1.01)}body .references .logo-wall>div:hover img{transform:scale(1.06)}}
@media(max-width:900px){body .references .logo-wall{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}body .references .logo-wall>div{height:110px;aspect-ratio:auto}body .references .logo-wall>div img{max-width:65%!important;max-height:60%!important}}
@media(prefers-reduced-motion:reduce){body .references .logo-wall>div,body .references .logo-wall>div img{transition:none}}