
:root{--navy:#0c2238;--navy2:#153b5c;--ink:#182b3c;--text:#4b6174;--muted:#728394;--line:#dce5ec;--soft:#f6f8fa;--orange:#e65a1c;--max:1180px;--shadow:0 22px 60px rgba(12,34,56,.11)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body.sa{margin:0;background:#fff;color:var(--text);font-family:Inter,"Segoe UI",Arial,sans-serif;line-height:1.62;-webkit-font-smoothing:antialiased}
body[data-domain=requirements]{--accent:#6757c8;--accent-soft:#f3f0ff}body[data-domain=formal]{--accent:#147c84;--accent-soft:#edfafa}body[data-domain=testing]{--accent:#e65a1c;--accent-soft:#fff2eb}body[data-domain=security]{--accent:#0b846e;--accent-soft:#edf9f6}body[data-domain=industry]{--accent:#2c6798;--accent-soft:#eef6fc}body[data-domain=master]{--accent:#e65a1c;--accent-soft:#fff2eb}
.wrap{width:min(var(--max),calc(100% - 44px));margin:auto}.topnav{background:linear-gradient(90deg,#0b1f33,#12324d);border-bottom:1px solid rgba(255,255,255,.1)}.topnav .wrap{display:grid;grid-template-columns:repeat(5,1fr)}.topnav a{min-height:72px;padding:13px 15px;display:flex;flex-direction:column;justify-content:center;color:#fff;text-decoration:none;border-right:1px solid rgba(255,255,255,.08);font-size:13px;font-weight:800}.topnav a:first-child{border-left:1px solid rgba(255,255,255,.08)}.topnav small{margin-top:3px;color:#a8bbc9;font-size:10px;font-weight:500}.topnav a.active{background:rgba(255,255,255,.055);box-shadow:inset 0 -3px 0 var(--accent)}
.subnav{background:#fff;border-bottom:1px solid var(--line)}.subnav .wrap{display:flex;gap:9px;overflow:auto;padding:10px 0}.subnav a{white-space:nowrap;padding:8px 10px;border-radius:9px;color:#5a6e80;text-decoration:none;font-size:11px;font-weight:800}.subnav a.current,.subnav a:hover{background:var(--accent-soft);color:var(--accent)}
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:radial-gradient(circle at 87% 8%,color-mix(in srgb,var(--accent) 11%,transparent),transparent 320px),linear-gradient(#f8fafc,#fff)}.hero:after{content:"";position:absolute;right:-190px;top:-250px;width:430px;height:430px;border:1px solid color-mix(in srgb,var(--accent) 18%,transparent);border-radius:50%}.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.04fr .96fr;gap:54px;align-items:center;padding:84px 0 76px}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--accent);font-size:11px;font-weight:900;letter-spacing:.105em;text-transform:uppercase}.eyebrow:before{content:"";width:24px;height:3px;background:var(--accent)}h1{max-width:850px;margin:12px 0 16px;color:var(--navy);font-size:clamp(38px,4.4vw,58px);line-height:1.05;letter-spacing:-.045em}.lead{max-width:760px;margin:0;color:#40576a;font-size:17px;line-height:1.62}.actions{display:flex;gap:11px;flex-wrap:wrap;margin-top:22px}.btn{display:inline-flex;min-height:46px;align-items:center;justify-content:center;padding:0 18px;border:1px solid var(--navy);border-radius:12px;background:#fff;color:var(--navy);font-size:13px;font-weight:850;text-decoration:none;transition:.18s}.btn:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(12,34,56,.1)}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.hero-media{display:grid;min-height:400px;place-items:center;padding:22px;border:1px solid var(--line);border-radius:30px;background:linear-gradient(145deg,#fff,#eef3f6);box-shadow:var(--shadow);overflow:hidden}.hero-media img{width:100%;height:320px;object-fit:contain}.official{margin-top:17px}.official a{color:var(--accent);font-size:12px;font-weight:850;text-decoration:none}
.local{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.98);border-bottom:1px solid var(--line);box-shadow:0 8px 20px rgba(12,34,56,.035)}.local .wrap{display:flex;gap:22px;overflow:auto;padding:13px 0}.local a{white-space:nowrap;color:#566b7d;text-decoration:none;font-size:12.5px;font-weight:800}.local a:hover{color:var(--accent)}
.facts{padding:28px 0 40px}.fact-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#29465e;border-radius:20px;overflow:hidden;box-shadow:0 10px 28px rgba(12,34,56,.07)}.fact{padding:23px 22px;background:#10263b;color:#fff}.fact:first-child{box-shadow:inset 4px 0 0 var(--accent)}.fact small{display:block;margin-bottom:7px;color:#a9bbc8;font-size:10px;font-weight:850;letter-spacing:.05em;text-transform:uppercase}.fact strong{display:block;font-size:16px;line-height:1.3}
.block{padding:62px 0}.soft{background:linear-gradient(#f6f8fa,#fafbfd)}.dark{background:radial-gradient(circle at 85% 15%,color-mix(in srgb,var(--accent) 17%,transparent),transparent 370px),linear-gradient(135deg,#0d2238,#173e5f);color:#fff}.head{max-width:860px;margin-bottom:36px}.head h2{margin:8px 0 13px;color:var(--navy);font-size:clamp(31px,3.2vw,42px);line-height:1.08;letter-spacing:-.035em}.head p{margin:0;color:#566c7e;font-size:16px}.dark .head h2,.dark .head p{color:#fff}.dark .head p{opacity:.82}.dark .eyebrow{color:#ffd0bd}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{position:relative;overflow:hidden;min-height:190px;padding:26px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 8px 25px rgba(12,34,56,.055);transition:.18s}.card:before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:linear-gradient(90deg,var(--accent),transparent 80%)}.card:hover{transform:translateY(-3px);box-shadow:0 17px 38px rgba(12,34,56,.09)}.card small{color:var(--accent);font-size:10px;font-weight:900}.card h3{margin:9px 0 8px;color:var(--navy);font-size:20px;line-height:1.25}.card p{margin:0;font-size:13px}
.standards,.industries{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.pill{padding:18px;border:1px solid var(--line);border-radius:15px;background:#fff;color:var(--navy);font-size:12.5px;font-weight:800;text-align:center}.industry{padding:18px;border:1px solid var(--line);border-radius:16px;background:#fff}.industry strong{display:block;color:var(--navy);font-size:14px}.industry span{display:block;margin-top:5px;color:#687d8e;font-size:12px}
.integration{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.integration article{padding:24px;border:1px solid rgba(255,255,255,.14);border-radius:17px;background:rgba(255,255,255,.06)}.integration h3{margin:0 0 7px;color:#fff;font-size:18px}.integration p{margin:0;color:#cbd8e1;font-size:13px}
.related{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.related a{display:flex;min-height:155px;flex-direction:column;padding:22px;border:1px solid var(--line);border-radius:19px;background:#fff;color:inherit;text-decoration:none;box-shadow:0 7px 22px rgba(12,34,56,.04);transition:.18s}.related a:hover{transform:translateY(-2px);box-shadow:0 15px 34px rgba(12,34,56,.08)}.related strong{color:var(--navy);font-size:16px}.related span{margin-top:6px;font-size:12px}.related b{margin-top:auto;padding-top:14px;color:var(--accent);font-size:11px}
.cta{position:relative;overflow:hidden;border-bottom:3px solid var(--accent);background:radial-gradient(circle at 84% 10%,color-mix(in srgb,var(--accent) 21%,transparent),transparent 330px),linear-gradient(135deg,#0d2238,#173e5f);color:#fff}.cta .wrap{display:grid;grid-template-columns:1fr auto;gap:34px;align-items:center;padding:58px 0}.cta h2{margin:8px 0 12px;color:#fff;font-size:clamp(30px,3.2vw,42px);line-height:1.08}.cta p{max-width:820px;margin:0;color:#d2dee7}.cta .eyebrow{color:#ffd0bd}
@media(max-width:980px){.hero-grid{grid-template-columns:1fr 360px}.cards,.industries{grid-template-columns:repeat(2,1fr)}.standards{grid-template-columns:repeat(3,1fr)}.topnav .wrap{grid-template-columns:repeat(5,minmax(185px,1fr));overflow:auto}}
@media(max-width:760px){.wrap{width:calc(100% - 32px)}.hero-grid,.cta .wrap{grid-template-columns:1fr;padding:44px 0 40px}.hero-media{order:-1;min-height:230px}.hero-media img{height:210px}.cards,.integration,.related,.industries,.standards{grid-template-columns:1fr}.fact-grid{grid-template-columns:1fr 1fr}.block{padding:46px 0}}
@media(max-width:480px){.fact-grid{grid-template-columns:1fr}}


/* ===========================================================================
   PRIMIONICS SHELL COMPATIBILITY
   ---------------------------------------------------------------------------
   css/homepage-palette.css enforces a light-background palette site-wide with
   !important on h1-h6, strong, p, li, dd and small. The module already sets
   white text on its navy bands (.dark, .fact, .fact-grid, .cta) but does so
   without !important, so the shell won. Measured on the built pages, headings
   on those bands rendered at 1.00:1 and strong at 1.04:1 - invisible.

   The values below are the module's own palette, re-asserted at a specificity
   the shell cannot override. Everything is scoped to body.sa, so no other
   part of the website is affected.
   =========================================================================== */

body.sa :is(.dark, .fact, .fact-grid, .cta) :is(h1,h2,h3,h4,h5,h6,strong,b,th) {
  color: #fff !important;
}
body.sa :is(.dark, .fact, .fact-grid, .cta) :is(p,li,dd,td) {
  color: #cbd8e1 !important;
}
body.sa .cta p { color: #d2dee7 !important; }
body.sa :is(.dark, .fact, .fact-grid, .cta) :is(small,dt) {
  color: #a9bbc8 !important;
}
body.sa :is(.dark, .fact, .fact-grid, .cta) .eyebrow { color: #ffd0bd !important; }
body.sa :is(.dark, .cta) a:not(.btn) { color: #ffd0bd !important; }
body.sa .integration p { color: #cbd8e1 !important; }
body.sa .integration h3 { color: #fff !important; }

/* ---------------------------------------------------------------------------
   Accent used as TEXT needs a darker value than the same accent used as a
   fill: the fill tones measured 3.4-4.4:1 on the module's white and #f8fafc
   surfaces. Fills keep --accent; text and links use --accent-text.
   --------------------------------------------------------------------------- */
body.sa                          { --accent-text: #c8420f; }
body.sa[data-domain=requirements]{ --accent-text: #5648a8; }
body.sa[data-domain=formal]      { --accent-text: #10666c; }
body.sa[data-domain=testing]     { --accent-text: #c8420f; }
body.sa[data-domain=security]    { --accent-text: #0a6f5c; }
body.sa[data-domain=industry]    { --accent-text: #285d89; }
body.sa[data-domain=master]      { --accent-text: #c8420f; }

body.sa .card small,
body.sa .related b,
body.sa .official a,
body.sa .subnav a.current,
body.sa .subnav a:hover,
body.sa .local a:hover,
body.sa .eyebrow                 { color: var(--accent-text) !important; }
body.sa .block a:not(.btn):not(.pill) { color: var(--accent-text); }

/* white on the accent fill was 3.72:1 */
body.sa .btn.primary {
  background: var(--accent-text) !important;
  border-color: var(--accent-text) !important;
  color: #fff !important;
}

/* muted captions on the light surfaces measured 4.27:1 */
body.sa .industry span,
body.sa .related span,
body.sa .card p,
body.sa .subnav a               { color: #5b7085 !important; }

/* the dark bands override the light-surface accent rules above */
body.sa :is(.dark, .fact, .fact-grid, .cta) .eyebrow,
body.sa :is(.dark, .fact, .fact-grid, .cta) .card small,
body.sa :is(.dark, .fact, .fact-grid, .cta) .related b { color: #ffd0bd !important; }

/* Partner videos and resources -------------------------------------------
   Video cards stay inert until pressed: the thumbnail is a plain image and no
   player is requested from YouTube until the visitor asks for one, at which
   point it is embedded in place through youtube-nocookie.com. Resource cards
   are ordinary outbound links to the partner's own document page. */
.media-block .head{margin-bottom:30px}
.media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.media-grid:has(.media-card:only-child){grid-template-columns:minmax(0,720px)}
.media-card{position:relative;overflow:hidden;aspect-ratio:16/9;border:1px solid var(--line);border-radius:18px;background:#0d2238;box-shadow:0 8px 25px rgba(12,34,56,.055);transition:.18s}
.media-card:hover{transform:translateY(-3px);box-shadow:0 17px 38px rgba(12,34,56,.09)}
.media-play{display:block;width:100%;height:100%;padding:0;border:0;background:none;cursor:pointer;text-align:left;font:inherit;color:inherit}
.media-play img{width:100%;height:100%;object-fit:cover;opacity:.86;transition:opacity .2s ease,transform .3s ease}
.media-play:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,34,56,.05) 20%,rgba(13,34,56,.28) 52%,rgba(13,34,56,.9))}
.media-play:is(:hover,:focus-visible) img{opacity:.97;transform:scale(1.02)}
.media-play:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
.media-glyph{position:absolute;left:50%;top:46%;z-index:2;display:grid;width:clamp(50px,4.6vw,62px);aspect-ratio:1;translate:-50% -50%;place-items:center;border-radius:50%;background:var(--accent);box-shadow:0 8px 24px rgba(12,34,56,.34);transition:.18s}
.media-glyph:before{content:"";margin-left:4px;border-width:11px 0 11px 17px;border-style:solid;border-color:transparent transparent transparent #fff}
.media-play:is(:hover,:focus-visible) .media-glyph{scale:1.08}
.media-meta{position:absolute;right:20px;bottom:17px;left:20px;z-index:2;display:grid;gap:3px}
.media-meta strong{color:#fff;font-size:15px;line-height:1.35;text-shadow:0 1px 5px rgba(0,0,0,.45)}
.media-meta small{color:rgba(255,255,255,.84);font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.media-card iframe{display:block;width:100%;height:100%;border:0;background:#0d2238}

.media-subhead{margin:34px 0 15px;color:var(--navy);font-size:15px;font-weight:850;letter-spacing:-.01em}
.dark .media-subhead{color:#fff}
.res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.res-card{display:flex;min-height:132px;flex-direction:column;padding:20px 22px;border:1px solid var(--line);border-radius:17px;background:#fff;color:inherit;text-decoration:none;box-shadow:0 7px 22px rgba(12,34,56,.04);transition:.18s}
.res-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 42%,var(--line));box-shadow:0 15px 34px rgba(12,34,56,.08)}
.res-card:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.res-card small{color:var(--accent-text,var(--accent));font-size:10px;font-weight:900;letter-spacing:.055em;text-transform:uppercase}
.res-card strong{margin-top:8px;color:var(--navy);font-size:15.5px;line-height:1.3}
.res-go{margin-top:auto;padding-top:14px;color:#607585;font-size:11px;font-weight:800}
.res-card:hover .res-go{color:var(--accent)}
.res-go:after{content:" \2197"}

@media(max-width:980px){.res-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.media-grid,.res-grid{grid-template-columns:1fr}}

/* homepage-palette.css is injected on every page and repaints headings, strong
   and small with !important. On the video cards that text sits on a darkened
   thumbnail, so the inherited navy would be unreadable; these rules restate the
   intended colours at a specificity that survives it. */
.media-block .media-meta strong.media-meta__t,
.media-card .media-play .media-meta strong{color:#fff!important}
.media-card .media-play .media-meta small{color:rgba(255,255,255,.86)!important}
.media-block .res-card small{color:var(--accent-text,var(--accent))!important}
.media-block .res-card strong{color:var(--navy)!important}
.media-block .res-card .res-go{color:#607585!important}
.media-block .res-card:hover .res-go{color:var(--accent)!important}
.media-block .media-subhead{color:var(--navy)!important}
.media-block.dark .media-subhead{color:#fff!important}

/* Wayfinding and movement ------------------------------------------------
   The in-page nav already tracks the visible section via aria-current from
   software-assurance.js, but nothing showed it; marking the active item tells
   the reader where they are and how much is left. The arrow shifts are the
   only motion, and they stop for anyone who has asked for reduced motion. */
.local a[aria-current]{color:var(--accent-text,var(--accent));box-shadow:inset 0 -2px 0 var(--accent)}
.local a{padding-bottom:2px;transition:color .16s ease}

.related a b{display:inline-block;transition:transform .18s ease}
.related a:hover b{transform:translateX(4px)}
.related a{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.related a:hover{border-color:color-mix(in srgb,var(--accent) 38%,var(--line))}

.res-go:after{display:inline-block;transition:transform .18s ease}
.res-card:hover .res-go:after{transform:translate(2px,-2px)}

@media(prefers-reduced-motion:reduce){
  .related a,.related a b,.res-card,.res-go:after,.media-card,.media-glyph,.card,.btn{
    transition:none!important;transform:none!important}
  .related a:hover b,.res-card:hover .res-go:after{transform:none!important}
}

/* global.css sets .hero{min-height:88vh} for the marketing pages. This module
   reuses the same class name, so every product hero was being stretched to
   nearly a full viewport regardless of its content - which is why these pages
   sat much taller than the Automation & Connectivity ones, whose heroes use
   prefixed class names and never matched that rule. Let the content set the
   height here. */
body.sa .hero{min-height:0}

/* The module's dark top nav sets its own muted label colour, but
   homepage-palette.css repaints every small with !important and drops it to a
   mid grey that only reaches 2.7:1 on this navy. Restated at 6.7:1. */
.topnav small{color:#a8bbc9!important}
