/* Shared styles for every page: the tokens, base elements, buttons, nav and footer.
   Taken from the Secure AI landing page (AI Governance, web/secure-ai/), so the site and the page match. */
:root{
  --space:#05091E; --navy:#0B1A4A; --ink:#11141E; --body:#2A2F3F; --muted:#6B7084; --gray:#7C8189;
  --blue:#2F5BEA; --violet:#7C4DFF; --ice:#9DB4FF; --lav:#F7F7FF; --panel:#F1F2FA; --white:#FFFFFF;
  --line:rgba(17,20,30,.10); --line-dark:rgba(157,180,255,.18);
  --ok:#3FB950; --warn:#F59E0B; --bad:#DA3633;
  --grad:linear-gradient(60deg,#2F5BEA,#7C4DFF);
  --sans:'Space Grotesk','Segoe UI',Calibri,Arial,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --gutter-l:max(16px,env(safe-area-inset-left,0px)); --gutter-r:max(16px,env(safe-area-inset-right,0px));
  --nav-h:68px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:40;background:var(--space)}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.02em;text-wrap:balance}
p{margin:0}
section{scroll-margin-top:calc(var(--nav-h) + 12px)}
.wrap{max-width:1120px;margin:0 auto;padding-left:var(--gutter-l);padding-right:var(--gutter-r)}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--blue);margin:0 0 14px}
.dark .eyebrow{color:var(--ice)}
.h2{font-size:clamp(28px,3.6vw,42px);line-height:1.1;margin-bottom:18px}
.lede{font-size:19px;line-height:1.5;color:var(--body);max-width:60ch}
.dark .lede{color:#C7CEEE}
.copy{display:grid;gap:14px;max-width:60ch;color:var(--body)}
.copy p{font-size:17px}
.dark .copy{color:#C7CEEE}
.copy strong{color:var(--ink);font-weight:600}
.dark .copy strong{color:#fff}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 22px;border-radius:10px;font-weight:600;font-size:16px;text-decoration:none;border:1px solid transparent;cursor:pointer;font-family:inherit;line-height:1.2;transition:transform .15s ease,box-shadow .15s ease}
.btn:hover{transform:translateY(-1px)}
.btn:focus-visible{outline:3px solid var(--ice);outline-offset:3px}
.btn-primary{background:var(--grad);color:#fff;box-shadow:0 8px 24px rgba(47,91,234,.28)}
.btn-primary:hover{box-shadow:0 12px 30px rgba(47,91,234,.36)}
.btn-ghost{background:transparent;color:var(--ink);border-color:rgba(17,20,30,.22)}
.btn-ghost:hover{border-color:var(--ink)}
.dark .btn-ghost{color:#fff;border-color:rgba(157,180,255,.4)}
.dark .btn-ghost:hover{border-color:#fff}
.btn-sm{padding:10px 16px;font-size:14.5px;border-radius:8px}
.textlink{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--blue);text-decoration:none;border-bottom:1px solid transparent}
.textlink:hover{border-bottom-color:currentColor}
.textlink svg{width:16px;height:16px}
.tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.tag.ok{color:#1F7A2E}
.tag.ok::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ok)}


/* draft flag: delete this element (and its CSS) when the page goes live */
#draft{position:fixed;right:max(14px,env(safe-area-inset-right,0px));bottom:max(14px,env(safe-area-inset-bottom,0px));z-index:50;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:var(--bad);padding:7px 12px;border-radius:999px;box-shadow:0 6px 20px rgba(5,9,30,.3)}

/* nav */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;height:var(--nav-h);display:flex;align-items:center;background:transparent;transition:background .25s ease,box-shadow .25s ease,border-color .25s ease;border-bottom:1px solid transparent}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%}
.nav .brand img{height:30px;width:auto}
.nav .brand .light{display:none}
.nav.solid{background:rgba(255,255,255,.88);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom-color:var(--line)}
.nav.solid .brand .dark{display:none}
.nav.solid .brand .light{display:block}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:26px}
.nav ul a{text-decoration:none;font-size:15px;font-weight:500;color:rgba(255,255,255,.82)}
.nav ul a:hover{color:#fff}
.nav.solid ul a{color:var(--body)}
.nav.solid ul a:hover{color:var(--ink)}
.nav .right{display:flex;align-items:center;gap:18px}
.nav .phone{font-family:var(--mono);font-size:13.5px;color:rgba(255,255,255,.82);text-decoration:none;letter-spacing:.02em}
.nav.solid .phone{color:var(--body)}

/* footer */
footer{background:#030616;color:#8B94B8;padding-block:34px 44px;border-top:1px solid var(--line-dark);font-size:13.5px}
footer .wrap{display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center}
footer img{height:26px;width:auto}
footer .contact{font-family:var(--mono);font-size:13px;color:#C7CEEE;letter-spacing:.02em;text-align:center}
footer .contact a{color:inherit;text-decoration:none}
footer .legal{text-align:right;line-height:1.5}

@media (max-width:960px){
  footer .wrap{grid-template-columns:1fr;text-align:left;justify-items:start}
  footer .contact,footer .legal{text-align:left}
}
@media (max-width:760px){
  .nav ul{display:none}
  .nav .phone{display:none}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none !important;animation:none !important}
}

/* client logo carousel (src/_includes/client-logos.njk). Every logo is drawn in one
   flat tone from its transparency, so mixed source files read as one set on any background. */
.client-logos{overflow:hidden;padding-block:8px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.cl-track{display:flex;width:max-content;animation:cl-scroll calc(var(--cl-count,20) * 3s) linear infinite}
.client-logos:hover .cl-track,.client-logos:focus-within .cl-track{animation-play-state:paused}
.cl-list{display:flex;align-items:center;gap:56px;margin:0;padding:0 28px;list-style:none}
.cl-list li{flex:none;display:flex;align-items:center}
.cl-list img{max-width:none;opacity:.72;transition:opacity .2s ease}
.cl-list img:hover{opacity:1}
.tone-dark img{filter:brightness(0)}
.tone-dark .cl-list img{opacity:.6}
.tone-light img{filter:brightness(0) invert(1)}
@keyframes cl-scroll{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  .client-logos{-webkit-mask-image:none;mask-image:none}
  .cl-track{animation:none;width:auto}
  .cl-list{flex-wrap:wrap;justify-content:center;row-gap:28px}
  .cl-list[aria-hidden="true"]{display:none}
}