@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=DM+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@500;600&display=swap');
:root{--bg:#0e111b;--panel:#171b28;--panel2:#202533;--text:#e4e8f1;--muted:#a0a9bb;--cyan:#06d8ef;--amber:#f5a10b;--border:#292e3e}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}.site-header{height:84px;display:flex;align-items:center;gap:26px;padding:0 clamp(18px,3vw,54px);border-bottom:1px solid #1d2230;background:#10131e}.brand{display:flex;align-items:center;gap:13px;white-space:nowrap}.brand img{width:43px;height:43px;object-fit:contain;background:#fff;border-radius:50%;padding:2px}.brand strong{font-family:'Barlow Condensed',sans-serif;font-size:24px;letter-spacing:.2px}.status{margin:auto;display:flex;align-items:center;gap:10px;color:#96d4c4;background:#191e2b;padding:9px 12px;font:600 11px 'IBM Plex Mono',monospace;letter-spacing:.7px;white-space:nowrap}.pulse{width:8px;height:8px;border-radius:50%;background:#8ef2c0;box-shadow:0 0 10px #8ef2c0}.status-sep{color:#687181}nav{display:flex;align-items:center;gap:4px}nav a{padding:12px 15px;color:#aab3c4;font-size:13px;white-space:nowrap}nav a:hover,nav a.active{color:#e3f9ff;background:#242a39;border-radius:3px}.contact-link{margin-left:10px;background:var(--cyan)!important;color:#102432!important;font-weight:700;border-radius:3px;box-shadow:0 0 15px #06d8ef22}.menu-toggle{display:none;background:#222737;color:#fff;border:1px solid var(--border);padding:9px 13px;border-radius:4px}.view{display:none}.view.active{display:block}#home-view{padding:0 clamp(16px,2.5vw,42px) 44px;background:radial-gradient(ellipse at 15% 8%,#202b37 0,transparent 40%),radial-gradient(ellipse at 83% 10%,#272422 0,transparent 43%),var(--bg)}.hero-heading{text-align:center;padding:35px 0 28px}.eyebrow{color:#93a2b5;font:600 11px 'IBM Plex Mono',monospace;letter-spacing:1.8px}.line{display:inline-block;width:25px;border-top:1px solid #5a6473;vertical-align:middle;margin:0 8px}.hero-heading h1{font:700 clamp(39px,4vw,65px)/1 'Barlow Condensed',sans-serif;margin:12px 0 7px;letter-spacing:.4px}.hero-heading h1 em{font-style:normal;color:#fff}.hero-heading p{font-size:17px;color:#b5becc;margin:0 0 18px}.choose{display:inline-flex;align-items:center;gap:10px;background:#262b38;border:1px solid #323847;border-radius:13px;padding:11px 18px;color:#c4cad8;font:600 11px 'IBM Plex Mono',monospace;letter-spacing:1px}.tiny-dot{display:inline-block;width:9px;height:9px;border-radius:50%;flex-shrink:0}.tiny-dot.cyan{background:var(--cyan);box-shadow:0 0 12px #06d8ef70}.tiny-dot.amber{background:var(--amber);box-shadow:0 0 12px #f5a10b70}.slashes{color:#657080}.division-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.division{min-width:0;padding:23px 24px 25px;border-radius:9px;display:flex;flex-direction:column;position:relative;overflow:hidden;background:linear-gradient(145deg,#1b202d,#161925 72%);border:1px solid #222838}.division:before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.55}.division-computing{--accent:var(--cyan)}.division-surveillance{--accent:var(--amber)}.division-label{align-self:flex-start;background:#303746;color:#a8e2ed;font:600 11px 'IBM Plex Mono',monospace;letter-spacing:1px;padding:7px 9px;margin-bottom:21px}.division-surveillance .division-label{color:#f2b96c}.slider{height:clamp(205px,18vw,310px);position:relative;overflow:hidden;border-radius:5px;background:linear-gradient(135deg,#293547,#101927)}.slide{position:absolute;inset:0;opacity:0;transition:opacity .55s;background-image:linear-gradient(0deg,rgba(11,15,25,.8),rgba(11,15,25,.06) 60%),var(--slide-image);background-size:cover;background-position:center}.slide.active{opacity:1}.slide-tag{position:absolute;top:14px;left:13px;background:#111924e8;color:#9ee7dc;padding:9px 12px;font:600 10px 'IBM Plex Mono',monospace;letter-spacing:.5px}.division-surveillance .slide-tag{color:#f6bc6a}.slide-arrow{position:absolute;z-index:2;top:50%;transform:translateY(-50%);width:37px;height:37px;border-radius:50%;border:1px solid #ffffff20;background:#111622ba;color:#e6e9f2;font-size:30px;line-height:1}.slide-arrow:hover{background:#323b50}.prev{left:11px}.next{right:11px}.dots{position:absolute;bottom:11px;left:50%;transform:translateX(-50%);z-index:2;display:flex;gap:7px;background:#101622b8;padding:8px 10px;border-radius:15px}.dots button{width:7px;height:7px;border:0;border-radius:50%;background:#657080;padding:0}.dots button.active{background:var(--accent);width:16px;border-radius:6px}.division-copy{flex:1}.division h2{font-size:clamp(21px,2vw,28px);line-height:1.2;margin:18px 0 8px;letter-spacing:-.5px}.division-copy>p{color:#a6afbf;font-size:14px;line-height:1.8;min-height:77px;margin:0 0 16px}.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px}.feature-grid span{font-size:12px;color:#c4cbd8;background:#272c3a;padding:9px 10px;min-width:0}.spec-box{background:#1d2230;margin-top:17px;padding:12px}.spec-head{display:flex;justify-content:space-between;gap:8px;font:600 10px 'IBM Plex Mono',monospace;letter-spacing:.7px;color:#a0a9b9}.spec-head span:last-child{color:#8fdfb4}.division-surveillance .spec-head span:last-child{color:#f1b65b}.chips{display:flex;gap:5px;flex-wrap:wrap;margin-top:9px}.chips span{font:500 10px 'IBM Plex Mono',monospace;color:#b6bdcb;background:#313746;padding:4px 7px}.division-cta{display:flex;justify-content:space-between;align-items:center;margin-top:19px;padding:23px 22px;border-radius:3px;font-size:19px;font-weight:700;transition:transform .2s,filter .2s}.division-cta:hover{transform:translateY(-2px);filter:brightness(1.1)}.cyan-cta{background:var(--cyan);color:#073544;box-shadow:0 6px 22px #06d8ef25}.amber-cta{background:var(--amber);color:#533509;box-shadow:0 6px 22px #f5a10b25}.cta-arrow{font-size:26px;font-weight:400}.info-strip{display:flex;align-items:center;gap:15px;margin-top:25px;padding:16px;background:#191d2a;border-radius:8px}.info-cell{display:flex;gap:13px;align-items:center;min-width:0;background:#222735;padding:13px 15px;flex:1;max-width:410px}.info-icon{font-size:25px;color:#a8e9f4;background:#2e3545;padding:8px}.info-icon.star{color:#ffb344}.info-cell strong{display:block;font-size:13px}.info-cell small{display:block;color:#8fd5b5;margin-top:4px;font:500 10px 'IBM Plex Mono',monospace}.info-action{margin-left:auto;color:#a4e8f1;font:600 11px 'IBM Plex Mono',monospace;white-space:nowrap;padding:10px}footer{min-height:76px;padding:25px clamp(16px,2.5vw,42px);display:flex;align-items:center;justify-content:space-between;gap:20px;background:#0b0e17;color:#8992a3;font:500 11px 'IBM Plex Mono',monospace;letter-spacing:.4px}footer strong{color:#e0e6f0}.footer-sep{padding:0 14px}.catalog-view{padding:35px clamp(18px,4vw,65px) 75px;min-height:calc(100vh - 160px);background:radial-gradient(ellipse at 80% 0,#24303a 0,transparent 48%),var(--bg);--catalog-accent:var(--cyan)}.catalog-view.security{--catalog-accent:var(--amber)}.catalog-top,.catalog-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;font:600 11px 'IBM Plex Mono',monospace;letter-spacing:1px;color:#97a6b9}.back:hover{color:var(--catalog-accent)}.catalog-kicker{color:var(--catalog-accent)}.catalog-intro{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #343b4b;padding:65px 0 42px}.catalog-intro h1{font:700 clamp(48px,7vw,100px)/1 'Barlow Condensed',sans-serif;margin:10px 0 15px}.catalog-intro p{font-size:17px;color:#aab5c5;max-width:680px;line-height:1.6}.catalog-symbol{font:800 clamp(100px,17vw,240px)/.8 'Barlow Condensed',sans-serif;color:var(--catalog-accent);opacity:.14}.catalog-toolbar{padding:28px 0}.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.category-card{border:1px solid #303746;background:#1b202d;border-radius:6px;overflow:hidden;transition:transform .2s,border-color .2s}.category-card:hover{transform:translateY(-4px);border-color:var(--catalog-accent)}.category-image{height:190px;background-size:cover;background-position:center;background-color:#283242;position:relative}.category-image:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#151b2b99,transparent)}.category-body{padding:21px}.category-number{font:600 10px 'IBM Plex Mono',monospace;color:var(--catalog-accent)}.category-body h3{font-size:21px;margin:8px 0}.category-body p{font-size:13px;color:#aab4c4;line-height:1.7;min-height:44px}.category-body .browse{display:inline-block;color:var(--catalog-accent);font-size:12px;font-weight:700;margin-top:10px}.catalog-note{border-left:3px solid var(--catalog-accent);background:#202633;padding:20px 24px;margin-top:30px}.catalog-note p{color:#aeb8c8;line-height:1.7;font-size:13px;margin-bottom:0}
@media(max-width:1180px){.status{display:none}.site-header{justify-content:space-between}.division{padding:18px}.division-copy>p{min-height:100px}.feature-grid{grid-template-columns:1fr}.category-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.site-header{height:70px;position:relative;z-index:10}.brand img{width:37px;height:37px}.brand strong{font-size:21px}.menu-toggle{display:block}nav{display:none;position:absolute;top:70px;left:0;right:0;background:#141925;flex-direction:column;align-items:stretch;padding:12px 18px 20px;box-shadow:0 15px 25px #0008}nav.open{display:flex}nav a{padding:15px}.contact-link{margin:8px 0 0;text-align:center}.hero-heading{padding:34px 0 26px}.hero-heading h1{font-size:43px}.hero-heading p{font-size:15px;line-height:1.5}.eyebrow{font-size:9px}.division-grid{grid-template-columns:1fr;gap:18px}.division{padding:19px}.slider{height:clamp(210px,53vw,340px)}.division-copy>p{min-height:0}.feature-grid{grid-template-columns:1fr 1fr}.info-strip{flex-direction:column;align-items:stretch}.info-cell{max-width:none}.info-action{margin:0;text-align:center}.catalog-intro{padding:50px 0 30px}.catalog-symbol{display:none}.catalog-top,.catalog-toolbar{font-size:9px}.category-grid{grid-template-columns:1fr}footer{flex-direction:column;align-items:flex-start;font-size:10px}}@media(max-width:400px){.feature-grid{grid-template-columns:1fr}.division-cta{font-size:13px}.choose{font-size:9px}.division-label{font-size:9px}.hero-heading h1{font-size:36px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}

/* ATD mobile navigation: scoped to site header; closed until explicitly opened. */
@media (max-width:760px) {
  .site-header nav#nav, .site-header #nav { display:none !important; visibility:hidden; }
  .site-header nav#nav.open, .site-header #nav.open { display:flex !important; visibility:visible; }
  .site-header .menu-toggle { display:block; position:relative; z-index:12; }
}
@media (min-width:761px) {
  .site-header nav#nav, .site-header #nav { display:flex; visibility:visible; }
}

/* Shared footer: finish at the bottom of short public pages. */
body:has(> .atd-global-footer-wrap) { min-height:100vh; display:flex; flex-direction:column; }
body > .atd-main { flex:1 0 auto; }
body > .atd-global-footer-wrap { flex-shrink:0; width:100%; max-width:none; margin-top:auto; }
body > .atd-global-footer-wrap .info-strip { margin-top:0; }

/* ==============================================================
   ATD PAGES ADMIN: consistent content width
   Scoped to pages rendered by page.asp. Does not affect the
   working header, product templates, homepage, or shared footer.
   ============================================================= */
body > main.atd-main:has(> .atd-admin-page-content) {
  width: 100% !important;
  max-width: 1440px !important;
  min-width: 0;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: clamp(18px, 3vw, 48px) !important;
  padding-right: clamp(18px, 3vw, 48px) !important;
  box-sizing: border-box;
}
body > main.atd-main > .atd-admin-page-intro,
body > main.atd-main > .atd-admin-page-content {
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box;
}
body > main.atd-main > .atd-admin-page-content > .atd-products,
body > main.atd-main > .atd-admin-page-content > .atd-products > .atd-list {
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
@media (max-width: 760px) {
  body > main.atd-main:has(> .atd-admin-page-content) {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
}


/* ==============================================================
   ATD SITEWIDE BLUE + AMBER ATMOSPHERE
   Matches the existing #home-view gradient values.
   CSS only: no ASP, navigation, slider, or database changes.
   ============================================================== */
html {
  background-color: var(--bg);
}
body {
  background:
    radial-gradient(ellipse at 15% 8%, #202b37 0, transparent 40%),
    radial-gradient(ellipse at 83% 10%, #272422 0, transparent 43%),
    var(--bg);
  background-attachment: fixed;
}
/* Keep public page content transparent so the shared background shows. */
body > main.atd-main {
  background-color: transparent;
}
/* Existing catalog backgrounds otherwise cover the shared gradient. */
.catalog-view,
.catalog-view.security {
  background:
    radial-gradient(ellipse at 15% 8%, #202b37 0, transparent 40%),
    radial-gradient(ellipse at 83% 10%, #272422 0, transparent 43%),
    var(--bg);
}
/* Preserve the homepage's original, identical background rule. */

/* ATD Google Reviews: shared information strip */
.atd-global-footer-wrap .info-strip{flex-wrap:wrap}
.atd-global-footer-wrap .info-cell{max-width:none;flex:1 1 225px}
.atd-global-footer-wrap .atd-review-cell{border:1px solid #594525;background:linear-gradient(135deg,#2c2926,#222735);gap:12px;transition:border-color .2s,transform .2s}
.atd-global-footer-wrap .atd-review-cell:hover{border-color:#f5a10b;transform:translateY(-2px)}
.atd-review-stars{color:#f5a10b;letter-spacing:1px;font-size:19px;white-space:nowrap}
.atd-review-copy{min-width:0}
.atd-review-copy strong{color:#f4e8d0}
.atd-review-copy small{color:#e0b978}
.atd-global-footer-wrap .info-action{flex-shrink:0}
@media(max-width:760px){.atd-global-footer-wrap .info-strip{flex-direction:column;align-items:stretch}.atd-global-footer-wrap .info-cell{flex:0 0 auto;width:100%}.atd-global-footer-wrap .info-action{text-align:center}}

/* Keep all three footer information cards equal in height. */
.atd-global-footer-wrap .info-strip { align-items: stretch; }
.atd-global-footer-wrap .info-strip > .info-cell {
  min-height: 66px;
  align-self: stretch;
  display: flex;
  align-items: center;
  box-sizing: border-box;
}


/* ============================================================
   ATD PUBLIC SITE TYPOGRAPHY — consistent across all pages
   Preserve icon fonts and the administration interface.
   ============================================================ */
:root {
  --atd-font-body: 'DM Sans', Arial, sans-serif;
  --atd-font-heading: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --atd-font-technical: 'IBM Plex Mono', monospace;
}
/* Main public content uses the same body face as the homepage. */
body, body > main.atd-main, .catalog-view, .atd-global-footer-wrap {
  font-family: var(--atd-font-body);
}
/* Titles and headings match the homepage display typography. */
body > main.atd-main h1,
body > main.atd-main h2,
body > main.atd-main h3,
body > main.atd-main h4,
body > main.atd-main h5,
body > main.atd-main h6,
.catalog-view h1, .catalog-view h2, .catalog-view h3 {
  font-family: var(--atd-font-heading);
}
/* Standardize editorial content without touching icon elements. */
body > main.atd-main p,
body > main.atd-main li,
body > main.atd-main input,
body > main.atd-main textarea,
body > main.atd-main select,
body > main.atd-main button,
body > main.atd-main .atd-admin-page-content {
  font-family: var(--atd-font-body);
}
/* Preserve the original homepage's monospace UI accents. */
.eyebrow, .division-label, .slide-tag, .spec-head,
.chips, .catalog-top, .catalog-toolbar, .category-number,
.info-cell small, .info-action, footer {
  font-family: var(--atd-font-technical);
}


/* Interior public navigation: match homepage font only. */
.atd-header nav a,
.atd-header .atd-nav a {
  font-family: 'DM Sans', Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}
.atd-header nav a.contact-link,
.atd-header .atd-nav a.contact-link {
  font-weight: 700 !important;
}
