:root { --navy:#08182f; --navy-2:#0d2343; --ink:#0a1830; --muted:#718097; --line:#dbe2ea; --surface:#f4f7fa; --white:#fff; --blue:#3a70e8; --cyan:#57c4dc; --lime:#b9e278; --display:"Manrope",sans-serif; --body:"DM Sans",sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--white); font-family:var(--body); font-size:16px; line-height:1.6; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
button,input,textarea,select { font:inherit; }
button { cursor:pointer; }
.container { width:min(1180px,calc(100% - 96px)); margin:0 auto; }
.site-header { position:absolute; z-index:10; top:0; left:0; right:0; height:92px; display:flex; align-items:center; justify-content:space-between; gap:32px; padding:0 48px; color:var(--white); transition:.3s ease; }
.site-header.scrolled { position:fixed; height:70px; background:rgba(8,24,47,.94); backdrop-filter:blur(16px); box-shadow:0 10px 30px rgba(0,0,0,.1); }
.brand { width:186px; display:inline-flex; align-items:center; }
.brand img { max-width:100%; height:auto; display:block; }
.primary-nav { display:flex; align-items:center; gap:clamp(14px,2vw,32px); margin-left:auto; }
.nav-link { position:relative; color:rgba(255,255,255,.76); font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:10px 0; white-space:nowrap; }
.nav-link::after { content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--cyan); transform:scaleX(0); transform-origin:left; transition:transform .25s ease; }
.nav-link:hover,.nav-link.active { color:var(--white); }
.nav-link:hover::after,.nav-link.active::after { transform:scaleX(1); }
.careers-nav { border:1px solid rgba(255,255,255,.38); border-radius:3px; padding:10px 12px; display:flex; align-items:center; gap:8px; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; transition:.25s; }
.careers-nav i { color:var(--lime); font-style:normal; font-size:14px; }
.careers-nav:hover { background:var(--lime); border-color:var(--lime); color:var(--navy); }
.careers-nav:hover i { color:var(--navy); }
.search-button { width:45px; height:92px; margin-right:-48px; border:0; border-left:1px solid rgba(255,255,255,.2); background:rgba(4,15,32,.18); color:var(--white); display:grid; place-items:center; }
.search-icon { width:15px; height:15px; border:2px solid currentColor; border-radius:50%; position:relative; display:inline-block; }
.search-icon::after { content:""; position:absolute; width:7px; height:2px; right:-5px; bottom:-2px; background:currentColor; transform:rotate(45deg); }
.menu-toggle { display:none; border:0; background:none; color:var(--white); }
.menu-toggle span { display:block; width:25px; height:2px; margin:5px; background:currentColor; }
.hero { min-height:740px; height:min(100vh,900px); position:relative; display:flex; align-items:center; color:var(--white); overflow:hidden; isolation:isolate; background:#08182f url("https://images.unsplash.com/photo-1558008258-3256797b43f3?auto=format&fit=crop&w=2200&q=88") center/cover; }
.hero-media { position:absolute; z-index:1; inset:0; background:linear-gradient(90deg,rgba(5,18,37,.92),rgba(5,18,37,.48) 52%,rgba(5,18,37,.2)); pointer-events:none; }
.hero-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hero-grid { position:absolute; z-index:2; inset:0; opacity:.18; background-image:linear-gradient(90deg,rgba(255,255,255,.14) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.14) 1px,transparent 1px); background-size:100px 100px; mask-image:linear-gradient(to right,black,transparent 80%); }
.hero-content { position:relative; z-index:3; padding-top:70px; }
.eyebrow { margin:0 0 20px; color:var(--blue); font-size:11px; font-weight:800; letter-spacing:.19em; line-height:1.4; text-transform:uppercase; }
.eyebrow.light { color:var(--lime); }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { font-family:var(--display); letter-spacing:-.065em; line-height:1.02; }
h1 { max-width:760px; margin-bottom:28px; font-size:clamp(56px,8.3vw,118px); font-weight:800; text-transform:uppercase; }
h1 em,h2 span { color:var(--cyan); font-style:normal; }
.hero-copy { max-width:475px; color:rgba(255,255,255,.76); font-size:18px; line-height:1.6; }
.hero-actions { display:flex; gap:14px; margin-top:36px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:20px; min-height:54px; padding:13px 22px; border:1px solid transparent; border-radius:2px; font-size:12px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; transition:.25s ease; }
.button span { font-size:17px; transition:transform .25s; }
.button:hover span { transform:translate(3px,-3px); }
.button-primary { background:var(--blue); border-color:var(--blue); color:var(--white); }
.button-primary:hover { background:#5788ef; border-color:#5788ef; }
.button-ghost { border-color:rgba(255,255,255,.55); color:var(--white); }
.button-ghost:hover { background:var(--white); color:var(--navy); }
.button-dark { background:var(--navy); color:white; }
.button-dark:hover { background:var(--blue); }
.hero-footer { position:absolute; z-index:3; bottom:32px; left:50%; transform:translateX(-50%); display:flex; justify-content:space-between; color:rgba(255,255,255,.58); font-size:10px; letter-spacing:.16em; text-transform:uppercase; }
.hero-scroll { display:flex; align-items:center; gap:10px; }
.hero-scroll i { display:block; width:36px; height:1px; background:var(--cyan); }
.priority-strip { background:var(--navy); color:var(--white); }
.priority-inner { min-height:68px; display:flex; align-items:center; justify-content:space-between; gap:25px; font-size:10px; letter-spacing:.24em; font-weight:700; }
.priority-inner span:first-child { color:var(--lime); }
.strip-line { height:1px; flex:1; background:rgba(255,255,255,.2); }
.section-pad { padding:130px 0; }
.two-col { display:grid; grid-template-columns:.9fr 1.1fr; gap:120px; }
h2 { margin-bottom:26px; font-size:clamp(45px,5.2vw,77px); font-weight:800; }
.section-intro h2 { text-transform:uppercase; }
.section-intro h2 span,.section-heading h2 span,.careers h2 span,.contact h2 span { color:var(--blue); }
.lead { font-size:clamp(20px,2vw,27px); line-height:1.42; letter-spacing:-.025em; }
.about-copy { max-width:580px; color:var(--muted); font-size:17px; }
.about-copy .lead { color:var(--ink); }
.text-link { display:inline-flex; align-items:center; gap:18px; margin-top:14px; padding-bottom:9px; border-bottom:1px solid var(--ink); font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.text-link span { color:var(--blue); font-size:17px; transition:transform .25s; }
.text-link:hover span { transform:translate(3px,-3px); }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-top:110px; border-top:1px solid var(--line); }
.stat { padding:28px 18px 0 0; border-right:1px solid var(--line); }
.stat + .stat { padding-left:28px; }
.stat:last-child { border:0; }
.stat strong { display:block; margin-bottom:6px; font-family:var(--display); font-size:50px; letter-spacing:-.07em; }
.stat strong span { color:var(--blue); }
.stat small { color:var(--muted); font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.story { background:var(--surface); }
.story-layout { display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:100px; }
.story-image { min-height:590px; position:relative; background:linear-gradient(180deg,rgba(9,24,47,.05),rgba(9,24,47,.7)),url("https://images.unsplash.com/photo-1504384308090-c894fdcc538d?auto=format&fit=crop&w=1300&q=88") center/cover; }
.image-caption { position:absolute; right:24px; bottom:20px; left:24px; display:flex; justify-content:space-between; color:var(--white); font-size:10px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.story-content > p:not(.eyebrow) { max-width:480px; color:var(--muted); font-size:17px; }
.timeline { margin-top:46px; border-top:1px solid var(--line); }
.timeline div { display:flex; align-items:center; gap:28px; padding:18px 0; border-bottom:1px solid var(--line); }
.timeline strong { width:62px; color:var(--blue); font-family:var(--display); font-size:19px; }
.timeline span { color:var(--muted); font-size:14px; }
.dark-section { background:var(--navy); color:var(--white); }
.section-heading { display:grid; grid-template-columns:1fr .75fr; align-items:end; gap:80px; margin-bottom:60px; }
.section-heading > p { max-width:390px; margin-bottom:8px; color:rgba(255,255,255,.6); font-size:16px; }
.card-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.solution-card { min-height:300px; position:relative; display:flex; flex-direction:column; justify-content:flex-end; padding:26px; overflow:hidden; border:1px solid rgba(255,255,255,.16); background:var(--navy-2); }
.solution-card::before { content:""; position:absolute; inset:0; background:var(--card-image) center/cover; opacity:.5; transition:transform .5s,opacity .5s; }
.solution-card::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 20%,rgba(4,13,28,.94) 100%); }
.solution-card:hover::before { opacity:.8; transform:scale(1.08); }
.card-content { position:relative; z-index:1; }
.card-number { color:var(--lime); font-size:10px; font-weight:800; letter-spacing:.17em; }
.solution-card h3 { margin:13px 0 8px; font-size:24px; letter-spacing:-.04em; }
.solution-card p { min-height:48px; margin-bottom:12px; color:rgba(255,255,255,.64); font-size:13px; line-height:1.45; }
.card-link { border:0; padding:0; background:none; color:var(--cyan); font-size:13px; font-weight:800; }
.application-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }
.application-card-tile { min-height:260px; position:relative; display:flex; align-items:flex-end; padding:24px; overflow:hidden; background:var(--tile-image) center/cover; color:var(--white); }
.application-card-tile::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(8,24,47,.05),rgba(8,24,47,.85)); transition:.4s; }
.application-card-tile:hover::before { background:linear-gradient(180deg,rgba(8,24,47,.05),rgba(58,112,232,.85)); }
.application-card-tile .tile-content { position:relative; width:100%; display:flex; align-items:end; justify-content:space-between; gap:16px; }
.application-card-tile h3 { margin:0; font-size:24px; letter-spacing:-.05em; }
.tile-index { align-self:start; color:var(--lime); font-size:11px; font-weight:800; letter-spacing:.16em; }
.partner-list { border-top:1px solid rgba(255,255,255,.2); }
.partner-row { display:grid; grid-template-columns:200px 1fr; gap:38px; padding:27px 0; border-bottom:1px solid rgba(255,255,255,.2); }
.partner-row span { color:var(--lime); font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.partner-row strong { color:rgba(255,255,255,.8); font-family:var(--display); font-size:clamp(17px,2vw,25px); font-weight:600; letter-spacing:-.03em; }
.clients { background:var(--surface); }
.clients-layout { display:grid; grid-template-columns:1fr 1fr; gap:80px; }
.client-copy { max-width:450px; padding-top:45px; color:var(--muted); }
.logo-cloud { display:grid; grid-template-columns:repeat(4,1fr); margin-top:92px; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.logo-cloud span { min-height:92px; display:grid; place-items:center; padding:15px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); color:#8b97a7; font-family:var(--display); font-size:14px; font-weight:700; letter-spacing:-.03em; text-align:center; transition:.25s; }
.logo-cloud span:hover { color:var(--blue); background:var(--white); }
.careers { background:#102a4d; }
.careers-hero { display:grid; grid-template-columns:1.05fr .95fr; gap:80px; align-items:end; padding-bottom:100px; border-bottom:1px solid rgba(255,255,255,.16); }
.careers h2 { margin-bottom:0; text-transform:uppercase; }
.careers-hero > div:last-child { max-width:440px; color:rgba(255,255,255,.65); font-size:17px; }
.careers-hero .button { margin-top:18px; }
.job-board { padding-top:72px; }
.job-toolbar,.admin-panel-head,.career-cta { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.job-toolbar h3 { margin-bottom:0; font-size:40px; }
.admin-trigger { border:1px solid rgba(255,255,255,.28); border-radius:2px; padding:11px 14px; background:transparent; color:rgba(255,255,255,.75); font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.admin-trigger:hover { background:rgba(255,255,255,.1); color:white; }
.admin-trigger span { margin-left:8px; color:var(--lime); }
.admin-panel { margin:30px 0; padding:28px; background:var(--white); color:var(--ink); }
.admin-panel[hidden] { display:none; }
.admin-panel-head h3 { margin:0; font-size:30px; }
.icon-button { width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; background:transparent; color:currentColor; font-size:24px; line-height:1; }
.icon-button:hover { background:var(--ink); color:var(--white); }
.admin-panel-head .icon-button { margin-left:auto; }
.admin-note { max-width:740px; margin:20px 0; color:var(--muted); font-size:13px; }
.admin-form { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.admin-form label,.contact-form label,.application-form label { display:grid; gap:8px; color:var(--muted); font-size:10px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.admin-form input,.admin-form textarea,.admin-form select,.contact-form input,.contact-form textarea,.application-form input,.application-form textarea { width:100%; border:1px solid var(--line); border-radius:0; outline:none; padding:13px 14px; background:var(--white); color:var(--ink); font-size:15px; letter-spacing:0; text-transform:none; resize:vertical; transition:border-color .2s; }
.admin-form input:focus,.admin-form textarea:focus,.admin-form select:focus,.contact-form input:focus,.contact-form textarea:focus,.application-form input:focus,.application-form textarea:focus { border-color:var(--blue); }
.full-field { grid-column:1 / -1; }
.admin-form .button { justify-self:start; border:0; }
.admin-actions { display:flex; gap:10px; margin-top:20px; }
.small-button { border:1px solid var(--line); padding:9px 12px; background:var(--white); color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.small-button:hover { border-color:var(--blue); color:var(--blue); }
.small-button.danger:hover { border-color:#d45f62; color:#d45f62; }
.job-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; margin-top:45px; }
.job-card { min-height:270px; display:flex; flex-direction:column; padding:25px; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.045); transition:.25s; }
.job-card:hover { transform:translateY(-4px); border-color:var(--cyan); background:rgba(255,255,255,.08); }
.job-meta { display:flex; gap:10px; flex-wrap:wrap; color:var(--lime); font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.job-card h3 { margin:20px 0 12px; font-size:25px; }
.job-card p { color:rgba(255,255,255,.62); font-size:14px; line-height:1.5; }
.job-card .button { width:100%; margin-top:auto; min-height:45px; }
.job-details { margin:12px 0 18px; color:rgba(255,255,255,.72); font-size:13px; line-height:1.55; }
.job-details summary { color:var(--cyan); cursor:pointer; font-weight:800; }
.job-details p { margin:13px 0 0; color:rgba(255,255,255,.72); }
.job-details strong { color:var(--white); }
.job-card .delete-job { align-self:flex-end; margin:-8px -6px 0 0; border:0; background:none; color:rgba(255,255,255,.42); font-size:11px; }
.job-card .delete-job:hover { color:#ff9c9c; }
.empty-jobs { grid-column:1 / -1; padding:48px 24px; border:1px dashed rgba(255,255,255,.25); color:rgba(255,255,255,.6); text-align:center; }
.career-cta { margin-top:42px; color:rgba(255,255,255,.62); font-size:14px; }
.light-link { margin-top:0; border-color:rgba(255,255,255,.35); color:var(--white); background:transparent; }
.contact-layout { display:grid; grid-template-columns:1fr .8fr; gap:140px; }
.contact-intro > p:not(.eyebrow) { max-width:420px; color:var(--muted); font-size:17px; }
.contact-details { display:grid; gap:7px; margin-top:50px; color:var(--blue); font-size:15px; font-weight:700; }
.contact-details span { color:var(--muted); font-size:13px; font-weight:400; }
.contact-form { display:grid; gap:25px; padding-top:30px; }
.contact-form .button { justify-self:start; border:0; }
.site-footer { background:#061225; color:var(--white); }
.footer-top { display:flex; align-items:end; justify-content:space-between; min-height:220px; gap:40px; }
.footer-brand { width:165px; }
.footer-top p { margin:0 auto 0 10px; color:rgba(255,255,255,.5); font-size:13px; }
.back-top { color:var(--lime); font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.back-top span { margin-left:14px; font-size:18px; }
.footer-bottom { display:flex; justify-content:space-between; gap:20px; padding:20px 0; border-top:1px solid rgba(255,255,255,.14); color:rgba(255,255,255,.4); font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.modal,.search-drawer { position:fixed; z-index:30; inset:0; display:grid; place-items:center; opacity:0; visibility:hidden; transition:.3s ease; }
.modal.is-open,.search-drawer.is-open { opacity:1; visibility:visible; }
.modal-backdrop { position:absolute; inset:0; background:rgba(3,12,25,.8); backdrop-filter:blur(8px); }
.modal-card { width:min(600px,calc(100% - 40px)); position:relative; z-index:1; padding:48px; background:var(--white); color:var(--ink); transform:translateY(18px); transition:.3s; }
.modal.is-open .modal-card { transform:translateY(0); }
.modal-card > .icon-button { position:absolute; top:20px; right:20px; }
.modal-card h2 { margin-bottom:18px; font-size:clamp(37px,5vw,60px); }
.modal-card > p:not(.eyebrow) { color:var(--muted); }
.modal-list { display:grid; gap:8px; margin:28px 0; }
.modal-list span { padding-left:20px; position:relative; color:var(--ink); font-size:14px; }
.modal-list span::before { content:""; position:absolute; left:0; top:10px; width:7px; height:7px; background:var(--blue); border-radius:50%; }
.application-card { max-height:90vh; overflow-y:auto; }
.application-form { display:grid; gap:17px; margin-top:30px; }
.application-form .button { border:0; justify-self:start; }
.search-drawer { z-index:40; align-items:start; background:rgba(4,14,29,.96); color:white; }
.search-drawer-inner { width:min(760px,calc(100% - 48px)); position:relative; margin:19vh auto 0; }
.search-drawer .icon-button { position:absolute; right:0; top:-20px; color:white; border-color:rgba(255,255,255,.3); }
.search-drawer input { width:100%; padding:16px 0 22px; border:0; border-bottom:1px solid rgba(255,255,255,.4); outline:0; background:transparent; color:white; font-family:var(--display); font-size:42px; letter-spacing:-.05em; }
.search-drawer input::placeholder { color:rgba(255,255,255,.32); }
.search-results { display:grid; gap:4px; margin-top:25px; }
.search-result { display:block; padding:14px 0; border-bottom:1px solid rgba(255,255,255,.13); color:rgba(255,255,255,.75); }
.search-result strong { display:block; color:var(--lime); font-size:11px; letter-spacing:.13em; text-transform:uppercase; }
.toast { position:fixed; z-index:50; right:24px; bottom:24px; max-width:360px; padding:15px 18px; background:var(--navy); color:white; box-shadow:0 20px 50px rgba(0,0,0,.2); transform:translateY(18px); opacity:0; pointer-events:none; transition:.3s; font-size:13px; }
.toast.show { transform:translateY(0); opacity:1; }
.reveal { opacity:0; transform:translateY(22px); transition:opacity .7s ease,transform .7s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
@media (max-width:1100px) { .site-header { padding:0 32px; } .search-button { margin-right:-32px; } .primary-nav { gap:15px; } .nav-link { font-size:10px; } .container { width:min(1180px,calc(100% - 64px)); } .two-col,.story-layout,.contact-layout { gap:70px; } }
@media (max-width:850px) { .site-header { height:76px; padding:0 22px; } .site-header.scrolled { height:68px; } .brand { width:165px; } .menu-toggle { display:block; order:3; } .search-button { width:auto; height:auto; margin-left:auto; margin-right:10px; border:0; background:none; } .primary-nav { position:absolute; top:76px; left:0; right:0; display:none; flex-direction:column; align-items:stretch; gap:0; padding:18px 22px 24px; background:var(--navy); } .primary-nav.open { display:flex; } .nav-link,.careers-nav { padding:13px 0; } .careers-nav { padding-left:12px; } .hero { min-height:700px; } .container { width:min(100% - 44px,680px); } .section-pad { padding:88px 0; } .two-col,.story-layout,.clients-layout,.contact-layout,.careers-hero,.section-heading { grid-template-columns:1fr; gap:36px; } .story-image { min-height:420px; } .stats-grid { margin-top:65px; grid-template-columns:repeat(2,1fr); } .stat:nth-child(2) { border-right:0; } .stat:nth-child(3),.stat:nth-child(4) { border-top:1px solid var(--line); } .stat:nth-child(3) { padding-left:0; } .stat:nth-child(4) { padding-left:28px; } .card-grid,.job-grid { grid-template-columns:repeat(2,1fr); } .application-grid { grid-template-columns:repeat(2,1fr); } .application-card-tile:last-child { grid-column:1 / -1; } .logo-cloud { grid-template-columns:repeat(3,1fr); } .career-cta { align-items:start; flex-direction:column; } .footer-top,.footer-bottom { align-items:start; flex-direction:column; padding-top:36px; padding-bottom:36px; } .footer-top p { margin:0; } }
@media (max-width:560px) { h1 { font-size:42px; letter-spacing:-.09em; } .hero-copy { font-size:16px; } .hero-actions { flex-direction:column; align-items:start; } .hero-actions .button { width:100%; } .hero-footer { bottom:22px; } .hero-footer > span:first-child { display:none; } .priority-inner { min-height:58px; font-size:8px; letter-spacing:.13em; } .priority-inner .strip-line { display:none; } h2 { font-size:45px; } .card-grid,.application-grid,.job-grid { grid-template-columns:1fr; } .application-card-tile:last-child { grid-column:auto; } .partner-row { grid-template-columns:1fr; gap:10px; } .logo-cloud { grid-template-columns:repeat(2,1fr); margin-top:50px; } .admin-form { grid-template-columns:1fr; } .full-field { grid-column:auto; } .modal-card { padding:38px 24px 28px; } .search-drawer input { font-size:27px; } .contact-form { padding-top:0; } }

/* Public package: hiring management belongs in WordPress admin. */
.job-toolbar .admin-trigger, .admin-panel, .job-card .delete-job { display:none !important; }
/* Standalone page system and partner rail */
.page-hero { min-height: 430px; position: relative; display: flex; align-items: end; overflow: hidden; background: var(--navy); color: var(--white); }
.page-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5,18,37,.95), rgba(5,18,37,.55) 58%, rgba(5,18,37,.25)), var(--page-image); background-size: cover; background-position: center; }
.page-hero::after { content: ""; position: absolute; inset: 0; opacity: .14; background-image: linear-gradient(90deg, rgba(255,255,255,.16) 1px, transparent 1px), linear-gradient(rgba(255,255,255,.16) 1px, transparent 1px); background-size: 100px 100px; mask-image: linear-gradient(to right, black, transparent 88%); }
.page-hero .container { position: relative; z-index: 1; padding-top: 170px; padding-bottom: 62px; }
.page-hero h1 { max-width: 820px; margin-bottom: 0; font-size: clamp(52px, 8vw, 104px); }
.page-hero h1 em { color: var(--cyan); }
.page-hero-copy { max-width: 560px; margin: 24px 0 0; color: rgba(255,255,255,.75); font-size: 18px; }
.page-section { padding: 112px 0; background: var(--white); }
.page-section.alt { background: var(--surface); }
.page-section.dark { background: var(--navy); color: var(--white); }
.page-section h2 { color: var(--ink); }
.page-section.dark h2 { color: var(--white); }
.page-copy { max-width: 790px; color: var(--muted); font-size: 18px; }
.page-copy + .page-copy { margin-top: 18px; }
.page-lead { color: var(--ink); font-family: var(--display); font-size: clamp(26px, 3vw, 42px); letter-spacing: -.05em; line-height: 1.16; }
.page-section.dark .page-copy, .page-section.dark .page-lead { color: rgba(255,255,255,.74); }
.info-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-top: 54px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.info-card { padding: 25px 24px 25px 0; border-right: 1px solid var(--line); }
.info-card + .info-card { padding-left: 24px; }
.info-card:last-child { border-right: 0; }
.info-card strong { display: block; color: var(--blue); font-family: var(--display); font-size: 22px; letter-spacing: -.04em; }
.info-card p { margin: 7px 0 0; color: var(--muted); font-size: 13px; }
.page-section.dark .info-card { border-color: rgba(255,255,255,.17); }
.page-section.dark .info-card strong { color: var(--cyan); }
.page-section.dark .info-card p { color: rgba(255,255,255,.68); }
.brand-rail { position: relative; z-index: 2; display: flex; min-height: 154px; overflow: hidden; background: var(--white); border-top: 8px solid var(--surface); border-bottom: 8px solid var(--surface); }
.brand-rail-label { width: 112px; flex: 0 0 112px; display: grid; place-items: center; border-right: 1px solid var(--line); color: var(--navy); font-size: 10px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg); }
.brand-track-viewport { display: flex; align-items: center; flex: 1; overflow: hidden; }
.brand-track { display: flex; align-items: center; width: max-content; animation: partner-scroll 62s linear infinite; will-change: transform; }
.brand-rail:hover .brand-track { animation-play-state: paused; }
.brand-logo { min-width: 176px; padding: 0 28px; color: var(--navy); text-align: center; font-size: 25px; font-weight: 800; letter-spacing: -.05em; white-space: nowrap; }
.brand-logo small { display: block; margin-top: 3px; color: var(--muted); font-size: 8px; font-weight: 500; letter-spacing: .08em; }
.brand-logo.image-brand { display: grid; place-items: center; min-height: 92px; padding: 12px 24px; }
.brand-logo.image-brand img { width: 150px; height: 72px; object-fit: contain; mix-blend-mode: multiply; }
.brand-logo.iotblue { color: #16a9db; letter-spacing: -.09em; }
.brand-logo.idis { color: #111; font-size: 33px; }
.brand-logo.hid { display: inline-flex; justify-content: center; color: #1e63aa; font-size: 34px; letter-spacing: .02em; }
.brand-logo.genetec { color: #0874ae; font-size: 27px; }
.brand-logo.extron { color: #164e8f; font-family: Georgia, serif; font-size: 29px; }
.brand-logo.exterity { color: #eb8431; font-size: 26px; }
.brand-logo.epson { color: #07539c; font-size: 31px; letter-spacing: .03em; }
.brand-logo.epiphan { color: #80bd21; font-size: 21px; }
.brand-logo.elmo { color: #1766aa; letter-spacing: .19em; }
@keyframes partner-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.brand-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 60px; border-top: 1px solid rgba(255,255,255,.2); }
.brand-list-row { display: grid; grid-template-columns: 150px 1fr; gap: 25px; padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,.2); }
.brand-list-row span { color: var(--lime); font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.brand-list-row strong { font-size: 15px; }
.sector-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.sector-card { min-height: 190px; position: relative; display: flex; align-items: end; padding: 24px; overflow: hidden; color: var(--white); background-position: center; background-size: cover; }
.sector-card::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent, rgba(5,18,37,.88)); }
.sector-card::after { content: ""; position: absolute; left: 0; bottom: 0; width: 40%; height: 4px; background: var(--cyan); }
.sector-card span { position: relative; z-index: 1; font-family: var(--display); font-size: 24px; font-weight: 800; }
.client-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-top: 54px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.client-grid span { min-height: 96px; display: grid; place-items: center; padding: 16px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--navy); font-size: 14px; font-weight: 800; text-align: center; }
.page-cta { display: flex; align-items: center; justify-content: space-between; gap: 40px; padding: 70px 0; background: var(--cyan); color: var(--navy); }
.page-cta h2 { margin: 0; max-width: 650px; color: var(--navy); font-size: clamp(38px, 5vw, 68px); }
.page-cta .button { background: var(--navy); color: var(--white); }
.page-cta .button:hover { background: var(--blue); }
.page-cta > .container { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.job-page-grid { grid-template-columns: repeat(3, 1fr); }
.job-page-card { background: var(--white); color: var(--ink); }
.job-page-card h3 { color: var(--navy); }
.contact-page-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 110px; }
.contact-page-info { display: grid; align-content: start; gap: 26px; }
.contact-page-info div { padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.contact-page-info strong { display: block; color: var(--navy); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
.contact-page-info span, .contact-page-info a { display: block; margin-top: 5px; color: var(--muted); font-size: 15px; }
.contact-page-info a:hover { color: var(--blue); }
.directory-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-top: 48px; }
.directory-card { min-height: 205px; padding: 25px; border: 1px solid var(--line); background: var(--surface); transition: transform .25s ease, border-color .25s ease, background .25s ease; scroll-margin-top: 110px; }
.directory-card:hover { transform: translateY(-4px); border-color: var(--blue); background: var(--white); }
.directory-card > span { color: var(--blue); font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.directory-card h3 { margin: 18px 0 10px; color: var(--navy); font-size: 24px; letter-spacing: -.045em; }
.directory-card p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.directory-grid-dark .directory-card { border-color: rgba(255,255,255,.16); background: rgba(255,255,255,.045); }
.directory-grid-dark .directory-card:hover { border-color: var(--cyan); background: rgba(255,255,255,.1); }
.directory-grid-dark .directory-card h3 { color: var(--white); }
.directory-grid-dark .directory-card p { color: rgba(255,255,255,.65); }
.directory-sector-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-top: 48px; }
.directory-sector { min-height: 175px; display: flex; flex-direction: column; justify-content: flex-end; padding: 24px; color: var(--white); background: linear-gradient(145deg,rgba(8,24,47,.98),rgba(21,62,106,.88)); scroll-margin-top: 110px; transition: transform .25s ease, background .25s ease; }
.directory-sector:nth-child(2n) { background: linear-gradient(145deg,rgba(14,47,72,.98),rgba(28,112,136,.88)); }
.directory-sector:hover { transform: translateY(-4px); background: linear-gradient(145deg,var(--blue),var(--navy)); }
.directory-sector strong { font-family: var(--display); font-size: 24px; letter-spacing: -.05em; line-height: 1.08; }
.directory-sector span { margin-top: 10px; color: rgba(255,255,255,.68); font-size: 13px; }
.insight-list { margin-top: 50px; border-top: 1px solid rgba(255,255,255,.18); }
.insight-list a { display: grid; grid-template-columns: 190px 1fr; gap: 35px; align-items: center; padding: 22px 0; border-bottom: 1px solid rgba(255,255,255,.18); scroll-margin-top: 110px; }
.insight-list a span { color: var(--lime); font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.insight-list a strong { color: var(--white); font-family: var(--display); font-size: 24px; letter-spacing: -.04em; }
.insight-list a b { margin-left: 12px; color: var(--cyan); font-family: var(--body); font-weight: 400; }
.insight-list a:hover strong { color: var(--cyan); }
.directory-feature-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-top: 48px; }
.directory-feature { display: flex; flex-direction: column; justify-content: space-between; min-height: 150px; padding: 24px; border: 1px solid var(--line); background: var(--white); scroll-margin-top: 110px; transition: transform .25s ease, border-color .25s ease; }
.directory-feature:hover { transform: translateY(-4px); border-color: var(--blue); }
.directory-feature span { color: var(--blue); font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.directory-feature strong { color: var(--navy); font-family: var(--display); font-size: 20px; letter-spacing: -.04em; }
.directory-feature b { margin-left: 8px; color: var(--blue); font-family: var(--body); font-weight: 400; }
.company-links { grid-template-columns: repeat(3,1fr); }
@media (max-width: 900px) { .directory-grid, .directory-sector-grid { grid-template-columns: repeat(2,1fr); } .directory-feature-row, .company-links { grid-template-columns: repeat(2,1fr); } .insight-list a { grid-template-columns: 150px 1fr; gap: 20px; } }
@media (max-width: 560px) { .directory-grid, .directory-sector-grid, .directory-feature-row, .company-links { grid-template-columns: 1fr; } .insight-list a { grid-template-columns: 1fr; gap: 7px; } .insight-list a strong { font-size: 20px; } }
@media (max-width: 900px) { .brand-rail-label { width: 74px; flex-basis: 74px; } .brand-logo { min-width: 145px; padding: 0 18px; } .info-grid { grid-template-columns: repeat(2, 1fr); } .info-card:nth-child(2) { border-right: 0; } .info-card:nth-child(3), .info-card:nth-child(4) { border-top: 1px solid var(--line); } .info-card:nth-child(3) { padding-left: 0; } .info-card:nth-child(4) { padding-left: 24px; } .brand-list { grid-template-columns: 1fr; } .contact-page-grid { gap: 50px; } }
@media (max-width: 560px) { .page-hero { min-height: 500px; } .page-hero .container { padding-top: 150px; padding-bottom: 45px; } .page-hero-copy { font-size: 16px; } .page-section { padding: 78px 0; } .info-grid { grid-template-columns: 1fr; } .info-card, .info-card + .info-card, .info-card:nth-child(3), .info-card:nth-child(4) { padding: 18px 0; border-right: 0; border-top: 1px solid var(--line); } .info-card:first-child { border-top: 0; } .brand-rail { min-height: 128px; } .brand-rail-label { width: 52px; flex-basis: 52px; font-size: 8px; } .brand-logo { min-width: 125px; font-size: 20px; } .brand-logo.hid, .brand-logo.epson { font-size: 25px; } .sector-grid, .job-page-grid { grid-template-columns: 1fr; } .client-grid { grid-template-columns: repeat(2, 1fr); } .page-cta { align-items: start; flex-direction: column; gap: 28px; padding: 52px 0; } .contact-page-grid { grid-template-columns: 1fr; } }

/* Intercom-inspired information architecture: multi-column menus with GammaSec copy. */
.nav-group { position: static; }
.nav-group-row { display: flex; align-items: center; gap: 4px; }
.menu-parent-toggle { display: inline-grid; place-items: center; width: 18px; height: 24px; border: 0; background: transparent; color: rgba(255,255,255,.62); font-size: 16px; line-height: 1; }
.nav-group:hover .menu-parent-toggle, .nav-group.open .menu-parent-toggle { color: var(--cyan); }
.mega-menu { position: absolute; z-index: 20; top: 92px; left: 0; right: 0; display: grid; grid-template-columns: minmax(220px,.7fr) minmax(460px,1.8fr); gap: 50px; padding: 38px max(48px,calc((100vw - 1180px)/2)); border-top: 1px solid rgba(255,255,255,.14); background: rgba(7,21,42,.98); box-shadow: 0 24px 60px rgba(0,0,0,.22); opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .2s ease, transform .2s ease, visibility .2s ease; }
.site-header.scrolled .mega-menu { top: 70px; }
.nav-group:hover .mega-menu, .nav-group.open .mega-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.mega-intro { display: flex; flex-direction: column; align-items: flex-start; max-width: 260px; padding-right: 20px; border-right: 1px solid rgba(255,255,255,.14); }
.mega-kicker { margin-bottom: 22px; color: var(--lime); font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.mega-intro strong { color: var(--white); font-family: var(--display); font-size: 28px; line-height: 1.12; letter-spacing: -.05em; }
.mega-intro > a { margin-top: 28px; color: var(--cyan); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.mega-intro > a span, .mega-column a span { margin-left: 7px; }
.mega-columns { display: grid; grid-template-columns: repeat(2,minmax(180px,1fr)); gap: 34px 50px; }
.mega-column { display: flex; flex-direction: column; align-items: flex-start; }
.mega-column p { margin-bottom: 12px; color: rgba(255,255,255,.42); font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.mega-column a { padding: 7px 0; color: rgba(255,255,255,.86); font-size: 14px; line-height: 1.25; transition: color .2s, transform .2s; }
.mega-column a:hover { color: var(--cyan); transform: translateX(4px); }
.nav-utility { margin-left: 4px; }
@media (max-width: 1100px) { .mega-menu { padding-left: 32px; padding-right: 32px; gap: 30px; } .mega-intro strong { font-size: 23px; } .mega-column a { font-size: 12px; } }
@media (max-width: 850px) {
  .nav-group { position: relative; }
  .nav-group-row { justify-content: space-between; }
  .nav-group-row .nav-link { flex: 1; }
  .menu-parent-toggle { width: 36px; height: 44px; border: 1px solid rgba(255,255,255,.2); color: var(--cyan); }
  .mega-menu, .site-header.scrolled .mega-menu { position: static; display: none; grid-template-columns: 1fr; gap: 22px; padding: 14px 0 18px 14px; border-top: 0; border-bottom: 1px solid rgba(255,255,255,.12); background: transparent; box-shadow: none; opacity: 1; visibility: visible; transform: none; }
  .nav-group.open .mega-menu { display: grid; }
  .mega-intro { max-width: none; padding: 0 0 15px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.12); }
  .mega-kicker { margin-bottom: 8px; }
  .mega-intro strong { font-size: 20px; }
  .mega-intro > a { margin-top: 13px; }
  .mega-columns { grid-template-columns: 1fr; gap: 15px; }
  .mega-column p { margin-bottom: 4px; }
  .mega-column a { padding: 5px 0; }
  .nav-utility { margin-left: 0; }
}

/* Shared footer layout and smooth page-to-page motion. */
body { transition: opacity .26s ease, transform .26s ease; }
body.page-leaving { opacity: 0; transform: translateY(8px); }
.newsletter-band { padding: 54px 0; background: var(--cyan); color: var(--navy); }
.newsletter-inner { display: flex; align-items: end; justify-content: space-between; gap: 50px; }
.newsletter-inner .eyebrow { margin-bottom: 12px; color: var(--navy); }
.newsletter-inner h2 { max-width: 570px; margin: 0; color: var(--navy); font-size: clamp(30px, 4vw, 50px); }
.newsletter-form { display: flex; align-items: center; gap: 10px; min-width: min(100%, 420px); }
.newsletter-form input { min-width: 0; flex: 1; height: 52px; padding: 0 16px; border: 1px solid rgba(8,24,47,.3); background: rgba(255,255,255,.7); color: var(--navy); outline: none; }
.newsletter-form input:focus { border-color: var(--navy); background: var(--white); }
.newsletter-form .button { min-height: 52px; border-color: var(--navy); }
.footer-contact-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 110px; padding-top: 68px; padding-bottom: 60px; }
.footer-contact { display: grid; align-content: start; gap: 15px; max-width: 330px; }
.footer-contact a { color: var(--cyan); font-size: 16px; font-weight: 700; }
.footer-contact a:hover { color: var(--lime); }
.footer-contact p { margin: 0; color: rgba(255,255,255,.56); font-size: 13px; line-height: 1.55; }
.footer-contact strong { color: rgba(255,255,255,.86); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.footer-heading { margin: 0 0 15px !important; color: var(--lime) !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: .15em; text-transform: uppercase; }
.footer-links { display: grid; grid-template-columns: repeat(2,1fr); gap: 60px; }
.footer-links > div { display: flex; flex-direction: column; align-items: flex-start; }
.footer-links a { padding: 4px 0; color: rgba(255,255,255,.62); font-size: 14px; }
.footer-links a:hover { color: var(--white); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 850px) { .newsletter-inner, .footer-contact-grid { grid-template-columns: 1fr; display: grid; gap: 32px; } .newsletter-form { min-width: 0; } .footer-links { gap: 30px; } }
@media (max-width: 560px) { .newsletter-band { padding: 42px 0; } .newsletter-form { align-items: stretch; flex-direction: column; } .newsletter-form .button { width: 100%; } .footer-contact-grid { padding-top: 48px; padding-bottom: 42px; } }

/* Supplied GammaSec partner and project assets. */
.partner-collage-wrap { display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: 70px; }
.partner-collage { width: 100%; display: block; border: 1px solid var(--line); background: var(--white); box-shadow: 0 24px 70px rgba(8,24,47,.12); }
.partner-logo-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:42px; }
.partner-logo-card { min-height:168px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; padding:24px 20px 18px; border:1px solid #e1e8ef; border-radius:4px; background:var(--white); box-shadow:0 12px 32px rgba(8,24,47,.045); transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.partner-logo-card:hover { transform:translateY(-5px); border-color:rgba(58,112,232,.45); box-shadow:0 20px 42px rgba(8,24,47,.12); }
.partner-logo-card img { width:100%; height:82px; object-fit:contain; display:block; }
.partner-logo-card span { color:var(--muted); font-size:10px; font-weight:800; letter-spacing:.1em; line-height:1.3; text-align:center; text-transform:uppercase; }
.asset-logo-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }
.asset-logo-card { min-height: 180px; display: flex; flex-direction: column; justify-content: space-between; padding: 20px; border: 1px solid rgba(255,255,255,.18); background: var(--white); }
.asset-logo-card img { width: 100%; height: 120px; object-fit: contain; background: var(--white); }
.asset-logo-card span { margin-top: 14px; color: var(--navy); font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.project-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-top: 54px; }
.project-card { min-height: 275px; position: relative; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; background: var(--navy); color: var(--white); }
.project-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 35%, rgba(5,18,37,.9)); }
.project-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.project-card > div { position: relative; z-index: 1; padding: 22px; }
.project-card span { color: var(--lime); font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.project-card h3 { margin: 10px 0 0; color: var(--white); font-size: 24px; letter-spacing: -.04em; }
.project-card:hover img { transform: scale(1.06); }
.project-card-wide { grid-column: span 2; }
.project-card-tall { min-height: 360px; }
@media (max-width: 900px) { .partner-collage-wrap { grid-template-columns: 1fr; gap: 36px; } .partner-logo-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } .asset-logo-grid { grid-template-columns: repeat(2,1fr); } .project-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 560px) { .partner-logo-grid, .asset-logo-grid, .project-grid { grid-template-columns: 1fr; } .project-card-wide { grid-column: auto; } .project-card-tall { min-height: 275px; } }