:root {
  --deep-navy: #071A33;
  --executive-navy: #0B2A4A;
  --navy-2: #102F55;
  --bright-blue: #1E88E5;
  --light-blue: #7CC7FF;
  --ice-blue: #EAF6FF;
  --steel-gray: #5D6D7E;
  --soft-gray: #F4F7FA;
  --white: #FFFFFF;
  --silver: #D9E4EF;
  --card: rgba(255, 255, 255, 0.9);
  --border: rgba(124, 199, 255, 0.24);
  --shadow: 0 24px 70px rgba(7, 26, 51, 0.22);
  --shadow-soft: 0 14px 36px rgba(7, 26, 51, 0.12);
  --radius-xl: 28px;
  --radius-lg: 22px;
  --radius-md: 16px;
  --max-width: 1180px;
  --transition: 220ms ease;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: Arial, Helvetica, sans-serif;
  background: var(--soft-gray);
  color: var(--deep-navy);
  line-height: 1.6;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
ul { list-style: none; }

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -3;
  background:
    radial-gradient(circle at 10% 10%, rgba(124, 199, 255, 0.24), transparent 30%),
    radial-gradient(circle at 88% 12%, rgba(30, 136, 229, 0.18), transparent 34%),
    linear-gradient(180deg, #f9fcff 0%, #eef5fb 45%, #f4f7fa 100%);
}

.container { width: min(100% - 36px, var(--max-width)); margin-inline: auto; }
.section { padding: 92px 0; }
.section.compact { padding: 64px 0; }
.eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 14px; border-radius: 999px;
  background: rgba(30, 136, 229, 0.1); color: var(--executive-navy);
  font-size: 0.78rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase;
  border: 1px solid rgba(30, 136, 229, 0.18);
}
.eyebrow::before { content:""; width:9px; height:9px; border-radius:50%; background:var(--bright-blue); box-shadow:0 0 18px rgba(30,136,229,.7); }
h1,h2,h3 { line-height: 1.1; letter-spacing: -0.04em; }
h1 { font-size: clamp(2.6rem, 6.5vw, 5.4rem); color: var(--white); margin: 22px 0 24px; }
h2 { font-size: clamp(2rem, 4vw, 3.4rem); color: var(--deep-navy); margin: 16px 0 18px; }
h3 { font-size: 1.25rem; color: var(--deep-navy); margin-bottom: 10px; }
p { color: #38516c; }
.lead { font-size: clamp(1.08rem, 2vw, 1.32rem); color: rgba(255,255,255,.86); max-width: 760px; }
.section-lead { max-width: 780px; font-size: 1.08rem; color: #415c78; }
.button-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:50px; padding:14px 22px; border-radius:999px; font-weight:800; border:1px solid transparent; transition: transform var(--transition), box-shadow var(--transition), background var(--transition); cursor:pointer; white-space:nowrap; }
.btn-primary { color:var(--white); background:linear-gradient(135deg,var(--bright-blue),#0E64B6); box-shadow:0 18px 36px rgba(30,136,229,.32); }
.btn-primary:hover { transform:translateY(-3px); box-shadow:0 24px 48px rgba(30,136,229,.42); }
.btn-secondary { color:var(--white); background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.24); backdrop-filter:blur(14px); }
.btn-secondary:hover { transform:translateY(-3px); background:rgba(255,255,255,.16); }
.btn-light { color:var(--executive-navy); background:var(--white); box-shadow:var(--shadow-soft); }
.btn-light:hover { transform:translateY(-3px); box-shadow:var(--shadow); }

.site-header { position: sticky; top:0; z-index:50; backdrop-filter: blur(18px); background: rgba(7,26,51,.9); border-bottom: 1px solid rgba(124,199,255,.16); }
.nav { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; gap:12px; color:var(--white); font-weight:900; letter-spacing:-.03em; }
.brand-mark { width:42px; height:42px; border-radius:14px; display:grid; place-items:center; color:var(--white); background:linear-gradient(135deg,rgba(124,199,255,.95),rgba(30,136,229,.95)); box-shadow:0 16px 34px rgba(30,136,229,.36); font-weight:900; }
.brand-text span { display:block; font-size:.74rem; color:rgba(234,246,255,.76); font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.nav-links { display:flex; align-items:center; gap:20px; color:rgba(255,255,255,.82); font-weight:700; font-size:.94rem; }
.nav-links a { transition: color var(--transition), background var(--transition); }
.nav-links a:hover, .nav-links a.active { color: var(--light-blue); }
.nav-cta { padding:10px 16px; border-radius:999px; background:rgba(124,199,255,.12); border:1px solid rgba(124,199,255,.26); color:var(--white)!important; }
.menu-button { display:none; width:44px; height:44px; border-radius:14px; border:1px solid rgba(124,199,255,.28); background:rgba(255,255,255,.08); color:var(--white); font-size:1.4rem; cursor:pointer; }

.hero, .page-hero { position:relative; color:var(--white); background: radial-gradient(circle at 18% 18%, rgba(124,199,255,.22), transparent 34%), radial-gradient(circle at 84% 22%, rgba(30,136,229,.2), transparent 34%), linear-gradient(135deg,var(--deep-navy) 0%,var(--executive-navy) 42%,#0A203D 100%); overflow:hidden; }
.hero { min-height: calc(100vh - 76px); padding:84px 0 80px; }
.page-hero { padding: 90px 0 78px; }
.hero::before, .page-hero::before { content:""; position:absolute; inset:auto -10% -22% -10%; height:48%; background:linear-gradient(180deg,transparent,rgba(124,199,255,.16)), repeating-linear-gradient(90deg,rgba(124,199,255,.16) 0 1px,transparent 1px 80px), repeating-linear-gradient(0deg,rgba(124,199,255,.12) 0 1px,transparent 1px 48px); transform:perspective(650px) rotateX(58deg); transform-origin:bottom; opacity:.75; }
.hero-grid { display:grid; grid-template-columns:1.04fr .96fr; align-items:center; gap:52px; position:relative; z-index:2; }
.hero-copy .eyebrow, .page-hero .eyebrow { color:var(--ice-blue); background:rgba(255,255,255,.09); border-color:rgba(124,199,255,.24); }
.hero-copy p:not(.lead), .page-hero p:not(.lead) { color:rgba(255,255,255,.78); max-width:680px; font-size:1.02rem; }
.hero-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:34px; max-width:680px; }
.hero-stat { padding:18px; border-radius:18px; background:rgba(255,255,255,.08); border:1px solid rgba(124,199,255,.2); backdrop-filter:blur(14px); }
.hero-stat strong { display:block; font-size:1.4rem; color:var(--white); margin-bottom:2px; }
.hero-stat span { display:block; color:rgba(234,246,255,.72); font-size:.84rem; font-weight:700; }
.hero-visual { min-height:560px; position:relative; perspective:1200px; }
.orb { position:absolute; border-radius:50%; filter:blur(1px); opacity:.9; }
.orb.one { width:190px; height:190px; right:12%; top:5%; background:radial-gradient(circle,rgba(124,199,255,.42),transparent 68%); }
.orb.two { width:250px; height:250px; left:-4%; bottom:4%; background:radial-gradient(circle,rgba(30,136,229,.24),transparent 70%); }
.tech-stage { position:absolute; inset:5% 0 0; transform-style:preserve-3d; animation:floatStage 7s ease-in-out infinite; }
@keyframes floatStage { 0%,100%{transform:translateY(0) rotateX(3deg) rotateY(-5deg)} 50%{transform:translateY(-14px) rotateX(2deg) rotateY(4deg)} }
.glass-panel { position:absolute; border:1px solid rgba(124,199,255,.28); background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.05)); box-shadow:0 34px 80px rgba(0,0,0,.24); backdrop-filter:blur(18px); }
.monitor { width:390px; height:245px; right:8%; top:18%; border-radius:26px; transform:rotateY(-12deg) rotateX(4deg); overflow:hidden; }
.monitor::before { content:""; position:absolute; inset:18px; border-radius:18px; background:linear-gradient(135deg,rgba(124,199,255,.18),rgba(30,136,229,.08)),repeating-linear-gradient(0deg,rgba(124,199,255,.15) 0 1px,transparent 1px 28px),linear-gradient(135deg,#091d37,#113861); box-shadow:inset 0 0 0 1px rgba(124,199,255,.22); }
.monitor::after { content:"SYSTEM HEALTH • SECURE • ONLINE"; position:absolute; left:36px; right:36px; top:42px; padding:11px 13px; border-radius:12px; color:var(--ice-blue); font-size:.72rem; font-weight:900; letter-spacing:.12em; background:rgba(255,255,255,.08); border:1px solid rgba(124,199,255,.2); }
.monitor-lines { position:absolute; left:42px; right:42px; bottom:44px; display:grid; gap:11px; z-index:2; }
.monitor-lines span { height:10px; border-radius:999px; background:linear-gradient(90deg,rgba(124,199,255,.9),rgba(30,136,229,.2)); }
.monitor-lines span:nth-child(2){width:72%}.monitor-lines span:nth-child(3){width:86%}
.laptop { width:360px; height:180px; left:2%; bottom:14%; border-radius:24px; transform:rotateY(14deg) rotateX(8deg); }
.laptop::before { content:""; position:absolute; left:24px; right:24px; top:22px; height:100px; border-radius:16px; background:linear-gradient(135deg,#08203d,#14558d); border:1px solid rgba(124,199,255,.22); }
.laptop::after { content:""; position:absolute; left:-22px; right:-22px; bottom:-24px; height:42px; border-radius:12px 12px 30px 30px; background:linear-gradient(180deg,rgba(234,246,255,.78),rgba(93,109,126,.34)); box-shadow:0 20px 44px rgba(0,0,0,.26); }
.server { width:150px; height:285px; right:0; bottom:5%; border-radius:24px; transform:rotateY(-18deg); padding:22px; }
.server-bay { height:38px; border-radius:12px; background:rgba(7,26,51,.72); border:1px solid rgba(124,199,255,.22); margin-bottom:13px; position:relative; }
.server-bay::after { content:""; position:absolute; width:10px; height:10px; right:13px; top:50%; transform:translateY(-50%); border-radius:50%; background:#5DFFB0; box-shadow:0 0 14px rgba(93,255,176,.78); }
.shield { width:142px; height:160px; left:40%; top:2%; clip-path:polygon(50% 0,92% 18%,82% 78%,50% 100%,18% 78%,8% 18%); background:linear-gradient(145deg,rgba(124,199,255,.9),rgba(30,136,229,.42)); border:1px solid rgba(255,255,255,.22); box-shadow:0 28px 70px rgba(30,136,229,.28); display:grid; place-items:center; color:var(--white); font-size:3rem; font-weight:900; transform:translateZ(80px); }
.shield::after { content:"✓"; text-shadow:0 8px 22px rgba(7,26,51,.44); }
.az-horizon { position:absolute; left:10%; right:8%; bottom:0; height:110px; opacity:.92; background:linear-gradient(135deg,transparent 0 15%,rgba(124,199,255,.22) 15% 18%,transparent 18% 28%,rgba(124,199,255,.18) 28% 31%,transparent 31%),linear-gradient(180deg,transparent,rgba(124,199,255,.16)); clip-path:polygon(0 100%,0 64%,12% 54%,22% 68%,34% 40%,50% 68%,62% 42%,76% 66%,90% 48%,100% 62%,100% 100%); filter:drop-shadow(0 0 26px rgba(124,199,255,.24)); }

.trust-bar { margin-top:-34px; position:relative; z-index:5; }
.trust-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:1px; overflow:hidden; border-radius:24px; box-shadow:var(--shadow); background:rgba(124,199,255,.18); border:1px solid rgba(124,199,255,.22); }
.trust-item { background:rgba(255,255,255,.94); padding:22px 14px; text-align:center; font-weight:900; color:var(--executive-navy); font-size:.9rem; }

.section-header { display:flex; align-items:end; justify-content:space-between; gap:36px; margin-bottom:42px; }
.section-header .section-lead { max-width:500px; }
.grid { display:grid; gap:22px; }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns:repeat(3,1fr); }
.grid-4 { grid-template-columns:repeat(4,1fr); }
.card { position:relative; padding:26px; border-radius:var(--radius-lg); background:var(--card); border:1px solid rgba(11,42,74,.08); box-shadow:var(--shadow-soft); overflow:hidden; transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition); }
.card::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 18% 0%,rgba(124,199,255,.2),transparent 28%),linear-gradient(135deg,rgba(255,255,255,.7),transparent 55%); pointer-events:none; }
.card>* { position:relative; z-index:1; }
.card:hover { transform:translateY(-8px); box-shadow:var(--shadow); border-color:rgba(30,136,229,.28); }
.icon { width:58px; height:58px; border-radius:18px; display:grid; place-items:center; margin-bottom:20px; color:var(--white); font-size:1.08rem; font-weight:900; background:linear-gradient(135deg,var(--executive-navy),var(--bright-blue)); box-shadow:0 16px 30px rgba(30,136,229,.28); }
.services-preview, .process { background: linear-gradient(180deg, rgba(255,255,255,.6), rgba(244,247,250,.8)); }
.dark-section { color:var(--white); background:radial-gradient(circle at 12% 15%,rgba(124,199,255,.18),transparent 32%),radial-gradient(circle at 85% 10%,rgba(30,136,229,.18),transparent 35%),linear-gradient(135deg,#06182f,#0b2a4a 50%,#0a203d); overflow:hidden; }
.dark-section h2,.dark-section h3 { color:var(--white); }
.dark-section p,.dark-section .section-lead { color:rgba(234,246,255,.78); }
.dark-section .eyebrow { color:var(--ice-blue); background:rgba(255,255,255,.08); border-color:rgba(124,199,255,.26); }
.dark-card { background:rgba(255,255,255,.08); border:1px solid rgba(124,199,255,.2); color:var(--white); box-shadow:0 22px 50px rgba(0,0,0,.16); }
.dark-card p { color:rgba(234,246,255,.72); }

.split { display:grid; grid-template-columns:.95fr 1.05fr; gap:44px; align-items:center; }
.feature-list { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.feature { display:flex; gap:14px; align-items:flex-start; padding:20px; border-radius:20px; background:linear-gradient(135deg,#ffffff,#f4f9ff); border:1px solid rgba(11,42,74,.08); box-shadow:var(--shadow-soft); }
.check { flex:0 0 auto; width:34px; height:34px; border-radius:12px; display:grid; place-items:center; color:var(--white); font-weight:900; background:linear-gradient(135deg,var(--bright-blue),var(--executive-navy)); }
.risk-list { display:grid; gap:14px; }
.risk-item { display:flex; gap:14px; align-items:flex-start; padding:18px; border-radius:18px; background:var(--white); box-shadow:var(--shadow-soft); border:1px solid rgba(11,42,74,.08); }
.risk-item span { flex:0 0 auto; width:30px; height:30px; border-radius:50%; display:grid; place-items:center; color:var(--white); background:linear-gradient(135deg,var(--bright-blue),var(--executive-navy)); font-weight:900; }
.risk-item strong { display:block; color:var(--deep-navy); margin-bottom:2px; }
.process-grid { counter-reset:process; }
.process-card { min-height:250px; }
.process-card::after { counter-increment:process; content:"0" counter(process); position:absolute; right:22px; bottom:12px; font-size:4.5rem; line-height:1; color:rgba(30,136,229,.1); font-weight:900; letter-spacing:-.08em; }
.industry-grid { display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; }
.industry-pill { padding:14px 18px; border-radius:999px; background:linear-gradient(135deg,#ffffff,#eef7ff); border:1px solid rgba(30,136,229,.16); color:var(--executive-navy); font-weight:900; box-shadow:0 10px 24px rgba(7,26,51,.08); }
.callout { padding:68px 0; background:radial-gradient(circle at 20% 20%,rgba(124,199,255,.2),transparent 32%),linear-gradient(135deg,var(--executive-navy),var(--deep-navy)); color:var(--white); }
.callout-card { display:flex; justify-content:space-between; gap:30px; align-items:center; padding:42px; border-radius:var(--radius-xl); background:rgba(255,255,255,.08); border:1px solid rgba(124,199,255,.22); box-shadow:0 28px 70px rgba(0,0,0,.22); backdrop-filter:blur(18px); }
.callout h2 { color:var(--white); margin:0 0 12px; }
.callout p { color:rgba(234,246,255,.78); max-width:720px; }
.final-cta { background:radial-gradient(circle at 50% 0%,rgba(124,199,255,.26),transparent 36%),linear-gradient(135deg,#071A33,#0B2A4A); color:var(--white); text-align:center; padding:96px 0; }
.final-cta h2 { color:var(--white); max-width:820px; margin-inline:auto; }
.final-cta p { color:rgba(234,246,255,.78); max-width:680px; margin:0 auto; }
.final-cta .button-row { justify-content:center; }

.form-card { background: var(--white); border-radius: var(--radius-xl); box-shadow: var(--shadow); padding: 32px; border: 1px solid rgba(11,42,74,.08); }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-field { display:grid; gap:8px; }
.form-field.full { grid-column:1/-1; }
label { font-weight:900; color:var(--executive-navy); }
input, select, textarea { width:100%; border:1px solid rgba(11,42,74,.16); border-radius:14px; padding:14px 15px; font: inherit; color:var(--deep-navy); background:#fff; }
textarea { min-height:140px; resize:vertical; }
input:focus, select:focus, textarea:focus { outline:3px solid rgba(30,136,229,.16); border-color:var(--bright-blue); }

.footer { background:#051326; color:var(--white); padding:46px 0; border-top:1px solid rgba(124,199,255,.16); }
.footer-grid { display:grid; grid-template-columns:1.3fr .7fr .7fr; gap:36px; align-items:start; }
.footer p { color:rgba(234,246,255,.68); max-width:440px; margin-top:12px; }
.footer h3 { color:var(--white); font-size:1rem; margin-bottom:14px; }
.footer a { display:block; color:rgba(234,246,255,.72); margin:8px 0; transition:color var(--transition); }
.footer a:hover { color:var(--light-blue); }
.footer-bottom { margin-top:34px; padding-top:24px; border-top:1px solid rgba(124,199,255,.14); color:rgba(234,246,255,.56); font-size:.9rem; }
.reveal { opacity:0; transform:translateY(22px); transition:opacity 600ms ease, transform 600ms ease; }
.reveal.visible { opacity:1; transform:translateY(0); }

@media (max-width:1060px){ .hero-grid,.split{grid-template-columns:1fr}.hero-visual{min-height:500px}.trust-grid{grid-template-columns:repeat(3,1fr)}.grid-4,.grid-3,.grid-2{grid-template-columns:repeat(2,1fr)}.section-header{display:block}.section-header .section-lead{margin-top:10px}.footer-grid{grid-template-columns:1fr 1fr} }
@media (max-width:820px){ .menu-button{display:grid;place-items:center}.nav-links{position:absolute;left:18px;right:18px;top:86px;display:none;flex-direction:column;align-items:stretch;gap:0;padding:14px;border-radius:22px;background:rgba(7,26,51,.96);border:1px solid rgba(124,199,255,.22);box-shadow:var(--shadow)}.nav-links.open{display:flex}.nav-links a{padding:14px;border-radius:14px}.nav-links a:hover{background:rgba(255,255,255,.07)}.hero{min-height:auto;padding-top:62px}.hero-stats{grid-template-columns:1fr}.hero-visual{min-height:430px}.monitor{width:310px;height:220px;right:4%}.laptop{width:290px;height:160px}.server{width:125px;height:245px}.shield{width:112px;height:132px}.feature-list{grid-template-columns:1fr}.callout-card{flex-direction:column;align-items:flex-start}.footer-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.form-field.full{grid-column:auto} }
@media (max-width:620px){ .container{width:min(100% - 28px,var(--max-width))}.section{padding:68px 0}.trust-grid,.grid-3,.grid-4,.grid-2{grid-template-columns:1fr}.trust-item{padding:18px 12px}.button-row{flex-direction:column}.btn{width:100%}.hero-visual{min-height:360px}.monitor{width:255px;height:178px;right:0}.monitor-lines{left:34px;right:34px;bottom:34px}.laptop{width:245px;height:136px;left:0}.server{display:none}.shield{left:34%;top:0}.callout-card{padding:28px}.brand-text{font-size:.9rem} }
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none} }

/* =========================================================
   Brand Logo Update
   Uses production logo hosted at: https://arizonaonsite.com/logo.png
========================================================= */
.brand {
  min-width: 0;
}
.brand-logo {
  display: block;
  width: clamp(190px, 24vw, 315px);
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 12px 24px rgba(0, 0, 0, 0.24));
}
.footer .brand-logo {
  width: clamp(220px, 28vw, 360px);
}
.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: 820px) {
  .brand-logo {
    width: clamp(170px, 52vw, 260px);
  }
  .nav {
    gap: 12px;
  }
}
@media (max-width: 440px) {
  .brand-logo {
    width: 176px;
  }
}