:root{
  /* Page background gray — swap this pair to test a different shade.
     Option A (subtle):    #F0F1F2 / 240,241,242
     Option B (moderate):  #E8EAEC / 232,234,236
     Option C (noticeable):#E1E4E6 / 225,228,230  <-- currently active
  */
  --paper:#E1E4E6;
  --paper-rgb:225,228,230;
  --ink:#14171A;
  --steel:#4B5563;
  --silver:#C7CCD1;
  --red:#B10E29;
  --green:#1B8A4B;
  --white:#FFFFFF;
  --space-1:.5rem;
  --space-2:1rem;
  --space-3:1.5rem;
  --space-4:2.5rem;
  --space-5:4rem;
  --space-6:6.5rem;
  --radius:2px;
  --max:1180px;
}

*{box-sizing:border-box;margin:0;padding:0;}
html,body{overflow-x:clip;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter',sans-serif;
  color:var(--ink);
  background:var(--paper);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}

h1,h2,h3,.display{
  font-family:'Oswald',sans-serif;
  text-transform:uppercase;
  letter-spacing:.02em;
  font-weight:600;
  line-height:1.08;
  overflow-wrap:break-word;
}

.mono{
  font-family:'IBM Plex Mono',monospace;
  letter-spacing:.02em;
}

.eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:.75rem;
  letter-spacing:.14em;
  color:var(--red);
  text-transform:uppercase;
  display:flex;
  align-items:flex-start;
  gap:.5rem;
}
.eyebrow::before{
  content:"";
  width:18px;height:2px;
  background:var(--red);
  display:inline-block;
  flex-shrink:0;
  margin-top:.5em;
}

.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--space-3);}

:focus-visible{outline:2px solid var(--red);outline-offset:3px;}

/* ---------- dimension-line divider ---------- */
.dim-divider{
  position:relative;
  height:1px;
  background:var(--silver);
  margin:0 var(--space-3);
}
.dim-divider::before,.dim-divider::after{
  content:"";
  position:absolute;
  top:-4px;
  width:1px;height:9px;
  background:var(--silver);
}
.dim-divider::before{left:0;}
.dim-divider::after{right:0;}

/* ---------- SKIP LINK ---------- */
.skip-link{
  position:absolute;top:-100%;left:var(--space-2);
  background:var(--ink);color:var(--white);
  padding:.5rem 1rem;
  font-family:'IBM Plex Mono',monospace;font-size:.75rem;letter-spacing:.05em;
  z-index:100;text-decoration:none;
}
.skip-link:focus{top:var(--space-2);}

/* ---------- NAV OVERLAY ---------- */
body::before{
  content:"";
  position:fixed;
  inset:0;
  background:rgba(20,23,26,.45);
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease;
  z-index:49;
}
body.nav-open::before{
  opacity:1;
  pointer-events:auto;
}

/* ---------- NAV ---------- */
header{
  position:sticky;top:0;z-index:50;
  background:rgba(var(--paper-rgb),.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--silver);
}
nav.wrap{
  display:flex;align-items:center;justify-content:space-between;
  height:72px;
}
.logo{display:flex;align-items:center;}
.logo-img{height:44px;width:auto;display:block;}

.nav-menu{display:flex;align-items:center;gap:var(--space-4);}
.nav-links{display:flex;gap:var(--space-4);align-items:center;}
.nav-links a{
  font-family:'IBM Plex Mono',monospace;
  font-size:.78rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--steel);
  position:relative;
  padding-bottom:4px;
}
.nav-links a:hover,.nav-links a.active{color:var(--ink);}
.nav-links a::after{
  content:"";position:absolute;left:0;bottom:0;
  width:0;height:2px;background:var(--red);
  transition:width .2s ease;
}
.nav-links a:hover::after,.nav-links a.active::after{width:100%;}

.nav-phone{
  font-family:'IBM Plex Mono',monospace;
  font-size:.85rem;font-weight:500;
  border:1px solid var(--ink);
  padding:.5rem .9rem;
  display:flex;align-items:center;gap:.5rem;
}
.nav-phone::before{content:"●";color:var(--red);font-size:.6rem;}
.nav-phone:hover{background:var(--ink);color:var(--white);}

.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:.5rem;}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--ink);margin:5px 0;}

/* ---------- HERO / INSPECTION VIEWPORT ---------- */
.hero{padding-top:var(--space-6);padding-bottom:var(--space-5);}
.viewport{
  position:relative;
  border:1px solid var(--ink);
  padding:var(--space-5) var(--space-4);
  background:
    linear-gradient(var(--paper),var(--paper)) padding-box,
    repeating-linear-gradient(0deg,transparent,transparent 39px,rgba(20,23,26,.05) 40px),
    repeating-linear-gradient(90deg,transparent,transparent 39px,rgba(20,23,26,.05) 40px);
}
.bracket{
  position:absolute;width:26px;height:26px;
  border:2px solid var(--red);
}
.bracket.tl{top:-2px;left:-2px;border-right:0;border-bottom:0;}
.bracket.tr{top:-2px;right:-2px;border-left:0;border-bottom:0;}
.bracket.bl{bottom:-2px;left:-2px;border-right:0;border-top:0;}
.bracket.br{bottom:-2px;right:-2px;border-left:0;border-top:0;}

.scanline{
  position:absolute;left:0;right:0;top:0;
  height:4px;
  background:linear-gradient(90deg,transparent,var(--red) 12%,var(--red) 88%,transparent);
  box-shadow:0 0 12px 1px var(--red);
  opacity:1;
  animation:sweep 2.4s ease-in-out 1;
}
@keyframes sweep{
  0%{top:0;opacity:0;}
  8%{opacity:1;}
  92%{opacity:1;}
  100%{top:100%;opacity:0;}
}

.status-readout{
  position:absolute;top:var(--space-2);right:var(--space-2);
  font-family:'IBM Plex Mono',monospace;
  font-size:.72rem;
  display:flex;align-items:center;gap:.4rem;
  color:var(--steel);
}
.status-readout .dot{width:7px;height:7px;border-radius:50%;background:var(--steel);transition:background .3s ease;}
.status-readout.pass{color:var(--green);font-size:.8rem;font-weight:600;}
.status-readout.pass .dot{background:var(--green);width:8px;height:8px;}

.hero-grid{
  display:grid;grid-template-columns:1.3fr .7fr;gap:var(--space-5);
  align-items:end;
}
.hero h1{font-size:clamp(2.4rem,4.6vw,3.7rem);}
.hero h1 .accent{color:var(--red);}
.hero p.lede{
  margin-top:var(--space-3);
  max-width:46ch;
  color:var(--steel);
  font-size:1.05rem;
}
.cta-row{display:flex;gap:var(--space-2);margin-top:var(--space-4);flex-wrap:wrap;}
.btn{
  font-family:'IBM Plex Mono',monospace;
  font-size:.82rem;letter-spacing:.05em;text-transform:uppercase;
  padding:.9rem 1.5rem;
  border:1px solid var(--ink);
  cursor:pointer;
  display:inline-flex;align-items:center;gap:.5rem;
}
.btn-primary{background:var(--red);border-color:var(--red);color:var(--white);}
.btn-primary:hover{background:#8C0B20;}
.btn-ghost:hover{background:var(--ink);color:var(--white);}

/* Ghost button on dark backgrounds */
.process .btn-ghost{border-color:var(--silver);color:var(--paper);}
.process .btn-ghost:hover{background:var(--paper);color:var(--ink);border-color:var(--paper);}

.hero-meta{
  border-left:1px solid var(--silver);
  padding-left:var(--space-3);
  font-family:'IBM Plex Mono',monospace;
  font-size:.78rem;color:var(--steel);
  display:flex;flex-direction:column;gap:.6rem;
}
.hero-meta strong{color:var(--ink);display:block;font-size:.95rem;font-family:'Inter',sans-serif;font-weight:600;}

/* ---------- PAGE HEADER (interior pages) ---------- */
.page-header{padding-top:var(--space-5);padding-bottom:var(--space-4);border-bottom:1px solid var(--silver);}
.page-header h1{font-size:clamp(2rem,3.6vw,2.8rem);margin-top:.6rem;}
.page-header p{color:var(--steel);max-width:60ch;margin-top:var(--space-2);}

/* ---------- PILLARS ---------- */
.pillars{padding-top:var(--space-5);padding-bottom:var(--space-5);}
.pillars-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  border:1px solid var(--silver);
  margin-top:var(--space-4);
}
.pillar{
  padding:var(--space-4);
  border-right:1px solid var(--silver);
  position:relative;
}
.pillar:last-child{border-right:0;}
.pillar .num{
  font-family:'IBM Plex Mono',monospace;
  font-size:.75rem;color:var(--red);
}
.pillar h3{font-size:1.3rem;margin:.6rem 0 .6rem;}
.pillar p{color:var(--steel);font-size:.94rem;}

.pillars-2col{grid-template-columns:repeat(2,1fr);}

/* ---------- INDUSTRIES ---------- */
.industries{padding-top:var(--space-5);padding-bottom:var(--space-5);}
.industry-list{
  list-style:none;
  margin-top:var(--space-3);
}
.industry-list li{
  border-bottom:1px solid var(--silver);
}
.industry-list li:first-child{border-top:1px solid var(--silver);}
.industry-btn{
  width:100%;display:flex;justify-content:space-between;align-items:center;
  font-family:'Oswald',sans-serif;font-size:clamp(1.5rem,2.6vw,2.2rem);
  font-weight:600;text-transform:uppercase;letter-spacing:.02em;
  padding:var(--space-2) 0;
  background:none;border:none;cursor:pointer;color:var(--ink);text-align:left;
}
.small-s{text-transform:lowercase;font-size:.7em;}
.industry-arrow{
  color:var(--red);font-family:'IBM Plex Mono',monospace;font-size:1rem;
  flex-shrink:0;transition:transform .3s ease;display:inline-block;
}
.industry-btn[aria-expanded="true"] .industry-arrow{transform:rotate(90deg);}
.industry-drawer{
  max-height:0;overflow:hidden;transition:max-height .35s ease;
}
.industry-drawer p{color:var(--steel);font-size:.95rem;line-height:1.7;padding-bottom:.75rem;}
.coming-soon{
  display:inline-block;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--red);margin-bottom:var(--space-2);
}

/* ---------- ISO BADGE ---------- */
.certified{padding-top:var(--space-5);padding-bottom:var(--space-5);}
.cert-box{
  display:grid;grid-template-columns:auto 1fr;gap:var(--space-4);
  align-items:center;
  border:1px solid var(--ink);
  padding:var(--space-4);
}
.cert-mark{
  width:84px;height:84px;
  clip-path:polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0% 50%);
  background:var(--ink);
  display:flex;align-items:center;justify-content:center;
  flex-direction:column;color:var(--white);
  text-align:center;
}
.cert-mark span:first-child{font-family:'Oswald',sans-serif;font-size:1.1rem;font-weight:700;}
.cert-mark span:last-child{font-family:'IBM Plex Mono',monospace;font-size:.55rem;color:var(--silver);}

.cert-mark-link{
  display:flex;flex-direction:column;align-items:center;gap:.5rem;
  text-decoration:none;
}
.cert-mark-link:hover .cert-mark,.cert-mark-link:focus-visible .cert-mark{opacity:.85;}
.cert-mark-label{
  font-family:'IBM Plex Mono',monospace;font-size:.62rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--steel);
  display:flex;align-items:center;gap:.25rem;
  transition:color .2s ease;
}
.cert-mark-link:hover .cert-mark-label,.cert-mark-link:focus-visible .cert-mark-label{color:var(--red);}
.cert-box h3{font-size:1.4rem;}
.cert-box p{color:var(--steel);margin-top:.4rem;font-size:.95rem;max-width:60ch;}
.cert-num{margin-top:.6rem;font-size:.75rem;color:var(--steel);}

/* ---------- ACADEMY BADGE ROW ---------- */
.academy-row{
  display:flex;align-items:center;gap:var(--space-2);margin-top:var(--space-4);margin-bottom:var(--space-2);
}

/* ---------- AI PROCESS ---------- */
.process{padding-top:var(--space-6);padding-bottom:var(--space-5);background:var(--ink);color:var(--paper);}
.process .eyebrow{color:var(--silver);}
.process .eyebrow::before{background:var(--red);}
.process h2{color:var(--white);font-size:clamp(1.8rem,3vw,2.6rem);margin-top:.6rem;max-width:20ch;}
.process p.intro{color:var(--silver);max-width:56ch;margin-top:var(--space-2);}
.steps{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:var(--space-2);
  margin-top:var(--space-5);
  position:relative;
}
.steps::before{
  content:"";position:absolute;top:19px;left:5%;right:5%;height:1px;
  background:rgba(199,204,209,.3);
}
.step{position:relative;padding-top:var(--space-4);}
.step .ring{
  position:absolute;top:0;left:0;
  width:38px;height:38px;border-radius:50%;
  border:1px solid var(--red);
  display:flex;align-items:center;justify-content:center;
  font-family:'IBM Plex Mono',monospace;font-size:.85rem;
  background:var(--ink);
}
.step h4{font-size:1.05rem;margin-bottom:.4rem;text-transform:uppercase;letter-spacing:.03em;font-family:'Oswald',sans-serif;}
.step p{color:var(--silver);font-size:.88rem;}

/* ---------- SERVICE / CAPABILITY LIST BLOCKS ---------- */
.list-block{padding-top:var(--space-5);padding-bottom:var(--space-5);border-bottom:1px solid var(--silver);}
.list-block-grid{display:grid;grid-template-columns:.9fr 1.4fr;gap:var(--space-5);}
.list-block h2,.list-block h3{font-size:1.4rem;}
.list-block ul{list-style:none;margin-top:var(--space-3);}
.list-block li{
  padding:.9rem 0;border-top:1px solid var(--silver);
  display:flex;align-items:baseline;gap:.9rem;
}
.list-block li:first-child{border-top:0;}
.list-block li .mono{color:var(--red);font-size:.75rem;min-width:2.4rem;}

/* ---------- CONTACT FORM ---------- */
.form-block{padding-top:var(--space-5);padding-bottom:var(--space-5);}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5);}
.form-field{margin-bottom:var(--space-3);}
.form-field label{
  display:block;font-family:'IBM Plex Mono',monospace;
  font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--steel);margin-bottom:.5rem;
}
.form-field input,.form-field select,.form-field textarea{
  width:100%;border:1px solid var(--silver);background:var(--white);
  padding:.8rem;font-family:'Inter',sans-serif;font-size:.95rem;color:var(--ink);
}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{
  border-color:var(--red);outline:none;
}
.form-field textarea{resize:vertical;min-height:120px;}
.contact-info{border-left:1px solid var(--silver);padding-left:var(--space-4);}
.contact-info h4{font-family:'IBM Plex Mono',monospace;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--steel);margin-bottom:.6rem;}
.contact-info p{margin-bottom:var(--space-3);}
.contact-info a{color:var(--red);}

.map-embed{margin-top:var(--space-2);border:1px solid var(--silver);}
.map-embed iframe{width:100%;height:220px;display:block;border:0;}

/* ---------- CLOSING CTA ---------- */
.closing{padding-top:var(--space-5);padding-bottom:var(--space-5);text-align:center;}
.closing h2{font-size:clamp(1.9rem,3.4vw,2.8rem);max-width:22ch;margin:0 auto;}
.closing .cta-row{justify-content:center;margin-top:var(--space-4);}

/* ---------- FOOTER ---------- */
footer{border-top:1px solid var(--silver);padding:var(--space-5) 0 var(--space-4);}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:var(--space-4);}
.foot-grid .foot-heading{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.1em;color:var(--steel);text-transform:uppercase;margin-bottom:.8rem;}
.foot-grid a,.foot-grid p{display:block;font-size:.9rem;color:var(--steel);margin-bottom:.5rem;}
.foot-grid a:hover{color:var(--red);}
.foot-bottom{
  margin-top:var(--space-4);padding-top:var(--space-3);
  border-top:1px solid var(--silver);
  display:flex;justify-content:space-between;
  font-family:'IBM Plex Mono',monospace;font-size:.72rem;color:var(--steel);
  flex-wrap:wrap;gap:.5rem;
}
.foot-bottom a{color:var(--steel);text-decoration:underline;}

/* ---------- ABOUT VIDEO → LOGO REVEAL ---------- */
.video-logo-reveal{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
  background:var(--paper);
}
.video-logo-reveal video{
  width:100%;height:100%;
  object-fit:cover;display:block;
  transition:opacity 1.2s ease;
  filter:brightness(1.1);
}
.video-logo-reveal .logo-reveal{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  background:var(--paper);
  opacity:0;
  transition:opacity 1.5s ease 0.8s;
  padding:var(--space-4);
}
.video-logo-reveal .logo-reveal img{max-width:420px;width:70%;}
.video-logo-reveal.ended video{opacity:0;}
.video-logo-reveal.ended .logo-reveal{opacity:1;}

/* ---------- FACILITY PHOTO (home) ---------- */
.facility-photo{
  height:420px;
  background:var(--ink);
  position:relative;
  overflow:hidden;
}
.facility-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:brightness(1.1);
}
.facility-caption{
  position:absolute;bottom:var(--space-2);left:var(--space-3);
  padding:.4rem .8rem;
  font-family:'IBM Plex Mono',monospace;font-size:.7rem;letter-spacing:.08em;
  color:rgba(245,246,247,.75);text-transform:uppercase;
  background:rgba(20,23,26,.5);
  width:fit-content;
}

/* ---------- PHOTO GRID (about) ---------- */
.photo-section{padding-top:var(--space-5);padding-bottom:var(--space-5);}
.photo-row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-2);margin-top:var(--space-3);}
.photo-row img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block;filter:brightness(1.1);}

/* ---------- SCROLL-REVEAL ---------- */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .5s ease,transform .5s ease;}
.reveal.visible{opacity:1;transform:none;}

/* ---------- RESPONSIVE ---------- */
/* Nav breaks before the rest of the layout does (logo + 5 links + phone
   number outgrow the row around ~870-950px), so it gets its own, wider
   breakpoint instead of sharing 860px with the layout rules below. */
@media (max-width:960px){
  .nav-toggle{display:block;}

  /* dropdown floats over page — no layout shift */
  .nav-menu{
    flex-direction:column;
    align-items:center;
    gap:0;
    position:absolute;
    top:72px;left:0;right:0;
    background:rgba(var(--paper-rgb),.97);
    backdrop-filter:blur(6px);
    border-bottom:1px solid var(--silver);
    padding:var(--space-3);
    /* closed state */
    opacity:0;
    transform:translateY(-6px);
    visibility:hidden;
    pointer-events:none;
    transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s;
  }
  header.nav-open .nav-menu{
    opacity:1;
    transform:translateY(0);
    visibility:visible;
    pointer-events:auto;
    transition:opacity .18s ease,transform .18s ease,visibility 0s;
  }
  .nav-menu .nav-links{
    display:flex;flex-direction:column;
    gap:1.2rem;width:100%;
    padding-bottom:var(--space-3);
    border-bottom:1px solid var(--silver);
  }
  .nav-menu .nav-phone{
    display:flex;
    margin-top:var(--space-2);
    border:0;padding-left:0;padding-right:0;
  }
}

@media (max-width:860px){
  /* Tighter vertical spacing — desktop values are too large on mobile */
  .hero{padding-top:var(--space-4);padding-bottom:var(--space-4);}
  .viewport{padding:var(--space-3);}
  .page-header{padding-top:var(--space-4);padding-bottom:var(--space-3);}
  .pillars{padding-top:var(--space-4);padding-bottom:var(--space-4);}
  .industries{padding-top:var(--space-4);padding-bottom:var(--space-4);}
  .certified{padding-top:var(--space-3);padding-bottom:var(--space-3);}
  .process{padding-top:var(--space-4);padding-bottom:var(--space-4);}
  .closing{padding-top:var(--space-4);padding-bottom:var(--space-4);}
  .list-block{padding-top:var(--space-3);padding-bottom:var(--space-3);}
  .form-block{padding-top:var(--space-3);padding-bottom:var(--space-3);}

  .hero-grid{grid-template-columns:1fr;gap:var(--space-4);}
  .hero-meta{border-left:0;border-top:1px solid var(--silver);padding-left:0;padding-top:var(--space-3);}
  .pillars-grid,.pillars-2col{grid-template-columns:1fr;}
  .pillar{border-right:0;border-bottom:1px solid var(--silver);}
  .pillar:last-child{border-bottom:0;}
  .steps{grid-template-columns:1fr 1fr;row-gap:var(--space-4);}
  .steps::before{display:none;}
  .cert-box{grid-template-columns:1fr;text-align:center;justify-items:center;}
  .foot-grid{grid-template-columns:1fr;gap:var(--space-3);}
  .status-readout{display:none;}

  /* cert box: pull inward so the dark border has visible breathing room */
  .cert-box{margin-left:var(--space-2);margin-right:var(--space-2);}

  /* closing eyebrow: hide the leading dash — text is too wide on mobile for it to center properly */
  .closing .eyebrow::before{display:none;}

  .list-block + .pillars{padding-top:0;margin-top:0;}
  .list-block-grid{grid-template-columns:1fr;gap:var(--space-3);}
  .form-grid{grid-template-columns:1fr;gap:0;}
  .contact-info{border-left:0;border-top:1px solid var(--silver);padding-left:0;padding-top:var(--space-3);}

  .facility-photo{height:260px;}
  .academy-row{flex-direction:column;align-items:center;text-align:center;}
  .process .cta-row{justify-content:center;}
  .photo-section{padding-top:var(--space-3);padding-bottom:var(--space-3);}
  .photo-row{grid-template-columns:1fr;}
}

/* ---------- FORM SUCCESS / ERROR STATES ---------- */
.form-success{padding:var(--space-4);border:1px solid var(--silver);background:var(--white);}
.form-success p{font-size:1rem;color:var(--steel);margin-bottom:.5rem;}
.form-success a{color:var(--red);}

.form-error{padding:var(--space-2);border:1px solid var(--red);margin-top:var(--space-2);}
.form-error p{font-size:.9rem;color:var(--red);}
.form-error a{color:var(--red);text-decoration:underline;}

@media (prefers-reduced-motion:reduce){
  .scanline{animation:none;display:none;}
  .nav-menu{transition:none;}
  html{scroll-behavior:auto;}
  .reveal{opacity:1;transform:none;transition:none;}
}