/* Keep the same content width on short and long pages during in-place navigation. */
html{scrollbar-gutter:stable}
@supports not (scrollbar-gutter:stable){html{overflow-y:scroll}}
:root{color-scheme:dark;--appearance-bg:#1b2937;--appearance-text:#f4f6fa;--appearance-muted:#cbd5e1;--appearance-border:#536374;--appearance-selection:#e8ad80;--appearance-selected-text:#17212b}
/* One accessible day/night switch in the navigation. */
.appearance-toggle{position:relative;flex:0 0 auto;width:64px;height:34px;padding:0;border:1px solid var(--appearance-border);border-radius:999px;background:#233649;color:#e8ad80;cursor:pointer;touch-action:manipulation}
.appearance-toggle svg{position:absolute;top:8px;width:16px;height:16px;z-index:1;pointer-events:none}
.toggle-sun{left:8px}.toggle-moon{right:8px}
.toggle-thumb{position:absolute;top:3px;left:3px;width:26px;height:26px;background:#eef2f6;border-radius:50%;transition:transform .18s ease;box-shadow:0 1px 4px #0003}
.appearance-toggle[aria-checked=true] .toggle-thumb{transform:translateX(30px)}
.appearance-toggle[aria-checked=true] .toggle-moon{color:#182b3d}
.appearance-toggle[aria-checked=false] .toggle-sun{color:#9c4d1e}
.appearance-toggle:hover{border-color:var(--accent)}
.appearance-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
html[data-theme=light] .appearance-toggle{background:#e0e7ee;color:#354c60}
html[data-theme=light]{color-scheme:light;background:#f5f6f8;color:#182b3d;--bg:#f5f6f8;--bg-soft:#edf1f5;--panel:#fff;--panel-2:#e9eef3;--text:#182b3d;--muted:#354c60;--muted-2:#4a6073;--accent:#9c4d1e;--accent-2:#af602d;--line:#d4dde6;--shadow:0 18px 50px rgba(27,48,68,.07);--appearance-bg:#fff;--appearance-text:#182b3d;--appearance-muted:#4a6073;--appearance-border:#a0adbb;--appearance-selection:#9c4d1e;--appearance-selected-text:#fff}
html[data-theme=light] body{color:var(--text);background:linear-gradient(180deg,#f8f9fb,#f1f4f7)}
html[data-theme=light] header{background:rgba(255,255,255,.95);border-bottom-color:#d4dde6}
html[data-theme=light] .brand img,html[data-theme=light] .footer-brand img{filter:none;opacity:1}
html[data-theme=light] .links,html[data-theme=light] .footer nav{color:#243c51}
html[data-theme=light] .links a:hover,html[data-theme=light] .footer nav a:hover{color:#9c4d1e}
html[data-theme=light] .menu{color:#182b3d;border-color:#a0adbb}
html[data-theme=light] .hero::before{background:linear-gradient(90deg,rgba(248,249,251,.99) 0%,rgba(248,249,251,.97) 27%,rgba(248,249,251,.87) 42%,rgba(248,249,251,.30) 59%,rgba(248,249,251,0) 75%)}
html[data-theme=light] .hero::after{background:linear-gradient(180deg,rgba(245,246,248,0),#f5f6f8)}
html[data-theme=light] .hero-copy h1,html[data-theme=light] .hero-copy .lead{text-shadow:none}
html[data-theme=light] h1 .accent,html[data-theme=light] .kicker,html[data-theme=light] .eyebrow,html[data-theme=light] .contact-card .location-motto{color:#9c4d1e}
html[data-theme=light] .lead{color:#273f53}
html[data-theme=light] .fact{color:#243c51}
html[data-theme=light] .fact-icon,html[data-theme=light] .iconbox{color:#9c4d1e;background:#f2e6dc;border-color:#e4cdbb}
html[data-theme=light] .tech-icon{color:#9c4d1e}
html[data-theme=light] .card,html[data-theme=light] .detail-card,html[data-theme=light] .legal-card{background:#fff;border-color:#d4dde6}
html[data-theme=light] .card p,html[data-theme=light] .location-motto + address,html[data-theme=light] .intro{color:#4a6073}
html[data-theme=light] .btn-primary,html[data-theme=light] .nav-cta{background:#9c4d1e;color:#fff}
html[data-theme=light] .btn-secondary{background:#fff;color:#243c51;border-color:#9aabbb}
html[data-theme=light] .btn-secondary:hover{background:#edf1f5}
html[data-theme=light] .tech,html[data-theme=light] .stack-row,html[data-theme=light] .detail-aside{background:#e9eef3;border-color:transparent}
html[data-theme=light] .references{background:#fff;border-color:#d4dde6}
html[data-theme=light] .logo-pill{background:#f2f5f8;color:#243c51}
html[data-theme=light] .contact-card{background:linear-gradient(135deg,#fff,#e9eef3);border-color:#d4dde6}
html[data-theme=light] .contact-location address{color:#4a6073}
html[data-theme=light] footer{background:#e9eef3;border-color:#d4dde6;color:#4a6073}
html[data-theme=light] .download-status{background:#fff;color:#182b3d;border:1px solid #d4dde6}
html[data-theme=light] .legal-card a,html[data-theme=light] .back{color:#9c4d1e}

@media(max-width:1200px) and (min-width:781px){.brand img{width:190px}.links{gap:14px;font-size:13px}.teamviewer-download img{width:138px}.nav{gap:16px}}
@media(max-width:780px){.appearance-toggle{margin-left:auto}.nav{gap:14px}html[data-theme=light] .links{background:#fff;border-color:#d4dde6}html[data-theme=light] .hero::before{background:linear-gradient(180deg,#f8f9fb 0%,rgba(248,249,251,.99) 42%,rgba(248,249,251,.88) 60%,rgba(248,249,251,.22) 78%,rgba(248,249,251,.05) 90%,#f5f6f8 100%)} }
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* Pixel-aligned scene layers: night -> twilight -> day. */
.hero-night,html[data-theme=light] .hero-night{display:block;opacity:1}
.hero-twilight{display:block;opacity:var(--scene-twilight,0)}
.hero-day,html[data-theme=light] .hero-day{display:block;opacity:var(--scene-day,0)}
html.theme-ready .hero-art{transition:opacity 1.2s linear}
html.theme-ready :is(header,.links,.card,.detail-card,.legal-card,.btn,.tech,.references,.contact-card,footer,h1,h2,h3,p,a){transition:color 1.2s ease,background-color 1.2s ease,border-color 1.2s ease}
.navitas-logo{display:block}
.navitas-logo .logo-light{display:none}
html[data-theme=light] .navitas-logo .logo-dark{display:none}
html[data-theme=light] .navitas-logo .logo-light{display:block}

/* Demo controls are available only through the dedicated preview link. */
.scene-demo{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);z-index:1000;width:min(600px,calc(100% - 32px));padding:18px 22px;border:1px solid var(--appearance-border);border-radius:16px;background:var(--appearance-bg);color:var(--appearance-text);box-shadow:0 8px 32px #0005;font-size:14px}
.scene-demo strong{font-size:16px}.scene-demo p{margin:5px 0 10px;color:var(--appearance-muted);font-size:13px}
.scene-demo progress{display:block;width:100%;height:5px;accent-color:var(--accent);margin-bottom:14px}
.demo-actions{display:flex;align-items:center;gap:12px}.demo-actions button{font:inherit;border:1px solid var(--appearance-border);border-radius:8px;padding:8px 14px;cursor:pointer;background:transparent;color:inherit}
.demo-actions .demo-play{background:var(--accent);color:var(--appearance-selected-text);border-color:var(--accent);min-width:110px}
.demo-actions a{margin-left:auto;color:inherit;font-size:13px}.demo-actions :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
html:has(.scene-demo) .hero-art{transition:opacity .15s linear}
@media(prefers-reduced-motion:reduce){html:has(.scene-demo) .hero-art{transition:none!important}}
@media(max-width:480px){.scene-demo{padding:14px}.demo-actions{gap:8px}.demo-actions button{padding:8px 10px}}

/* Keep each navigation label on one line; collapse only below the compact header's space requirement. */
header .links a{white-space:nowrap}
@media(max-width:780px){
 header .nav{gap:14px}
 header .appearance-toggle{margin-left:auto}
 header .menu{display:block;flex-shrink:0}
 header .brand img{width:190px}
 header .links{display:none;position:absolute;top:calc(100% + 1px);left:20px;right:20px;flex-direction:column;align-items:stretch;gap:14px;padding:18px;background:#202b35;border-radius:16px;border:1px solid rgba(255,255,255,.10);box-shadow:var(--shadow);font-size:15px}
 header .links.open{display:flex}
 header .teamviewer-download{justify-content:flex-start;padding:8px 0}
 html[data-theme=light] header .links{background:#fff;border-color:#d4dde6}
}

/* Actual content width can request the same collapsed header above the fallback breakpoint. */

 header.nav-collapsed .nav{gap:14px}
 header.nav-collapsed .appearance-toggle{margin-left:auto}
 header.nav-collapsed .menu{display:block;flex-shrink:0}
 header.nav-collapsed .brand img{width:190px}
 header.nav-collapsed .links{display:none;position:absolute;top:calc(100% + 1px);left:20px;right:20px;flex-direction:column;align-items:stretch;gap:14px;padding:18px;background:#202b35;border-radius:16px;border:1px solid rgba(255,255,255,.10);box-shadow:var(--shadow);font-size:15px}
 header.nav-collapsed .links.open{display:flex}
 header.nav-collapsed .teamviewer-download{justify-content:flex-start;padding:8px 0}
 html[data-theme=light] header.nav-collapsed .links{background:#fff;border-color:#d4dde6}

header:not(.nav-collapsed) .links{flex-shrink:0}

/* A direct remote-support shortcut remains available beside the mobile menu. */
header .mobile-teamviewer{display:none;flex:0 0 44px;width:44px;height:44px;align-items:center;justify-content:center;border-radius:10px}
header .mobile-teamviewer img{width:28px;height:28px;display:block}
header.nav-collapsed .mobile-teamviewer{display:flex;margin-left:auto}
header.nav-collapsed .appearance-toggle{margin-left:0}
@media(max-width:780px){header .mobile-teamviewer{display:flex;margin-left:auto}header .appearance-toggle{margin-left:0}}
@media(max-width:480px){header .nav{gap:8px}header .brand img{width:clamp(80px,calc(100vw - 240px),140px)}header .menu{padding:8px 10px}}

/* The mobile header already provides the direct remote-support shortcut. */
header.nav-collapsed .links .teamviewer-download{display:none}
@media(max-width:780px){header .links .teamviewer-download{display:none}}

/* Original customer logos retain their colours and contrast in both themes. */
.logos .customer-logo,html[data-theme=light] .logos .customer-logo{display:flex;align-items:center;justify-content:center;background:var(--customer-logo-background,#fff);height:104px;padding:16px 20px;min-width:0}
.customer-logo img{display:block;width:100%;height:72px;object-fit:contain;filter:none}
@media(max-width:480px){.logos .customer-logo{height:92px;padding:12px}.customer-logo img{height:68px}}

/* Animation comparison controls are only created for ?demo=logos. */
.logo-animation-preview{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:1000;width:min(680px,calc(100% - 32px));padding:18px 22px;border:1px solid var(--appearance-border);border-radius:16px;background:var(--appearance-bg);color:var(--appearance-text);box-shadow:0 8px 32px #0004}
.logo-animation-preview[hidden]{display:none}
.logo-animation-preview strong{font-size:16px}.logo-animation-preview p{font-size:13px;color:var(--appearance-muted);margin:5px 0 12px}
.logo-animation-preview>div{display:flex;gap:10px;flex-wrap:wrap}
.logo-animation-preview button{font:inherit;font-size:14px;padding:9px 13px;border-radius:9px;border:1px solid var(--appearance-border);background:transparent;color:inherit;cursor:pointer}
.logo-animation-preview button[aria-pressed=true]{background:var(--accent);color:var(--appearance-selected-text);border-color:var(--accent)}
.logo-animation-preview button:disabled{cursor:wait}

.logo-animation-preview .logo-preview-status{font-weight:700;font-size:15px;color:var(--appearance-text);margin:0 0 12px}
.logo-preview-announcement{position:fixed;top:104px;left:50%;transform:translateX(-50%);z-index:999;padding:12px 22px;max-width:calc(100% - 32px);border:1px solid var(--appearance-border);border-radius:999px;background:var(--appearance-bg);color:var(--appearance-text);font-weight:700;box-shadow:0 8px 26px #0003;opacity:0;pointer-events:none;transition:opacity .2s ease;text-align:center}
.logo-preview-announcement.visible{opacity:1}

/* Clipped vertical panels keep the price-board effect inside each logo tile. */
.customer-logo-rolling{position:relative;overflow:hidden}
.customer-logo-roll-panel{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:inherit;box-sizing:border-box;will-change:transform}