/* Self-hosted fonts (no third-party requests) */
@font-face{
  font-family:'Archivo Black';font-style:normal;font-weight:400;font-display:swap;
  src:url('fonts/archivo-black-400.woff2') format('woff2');
}
@font-face{
  font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;
  src:url('fonts/inter-var.woff2') format('woff2-variations');
}

  :root{
    --red:#E30613;
    --red-bright:#FF3B44;   /* small red text on dark backgrounds */
    --black:#0A0A0A;
    --ink:#1A1A1A;
    --white:#FFFFFF;
    --grey:#F5F5F4;
    --muted:#5C5C5C;
    --muted-light:#9A9A9A;
    --display:"Archivo Black","Arial Black","Helvetica Neue",Arial,sans-serif;
    --body:"Inter",Arial,"Helvetica Neue",Helvetica,sans-serif;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{font-family:var(--body);color:var(--ink);background:var(--white);line-height:1.6;-webkit-font-smoothing:antialiased}
  img{max-width:100%;display:block}
  a{color:inherit}
  :focus-visible{outline:3px solid var(--red);outline-offset:3px;border-radius:2px}
  section[id]{scroll-margin-top:88px}

  .wrap{max-width:1120px;margin:0 auto;padding:0 24px}

  .eyebrow{
    font-family:var(--body);font-weight:700;font-size:12px;
    letter-spacing:.32em;text-transform:uppercase;color:var(--red);
  }
  .eyebrow .num{color:var(--muted-light);margin-right:10px}
  .eyebrow::after{
    content:"";display:block;width:44px;height:3px;background:var(--red);margin-top:14px;
  }
  .on-dark .eyebrow{color:var(--red-bright)}

  h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.08;letter-spacing:-.01em}

  /* ---------- scroll reveal ---------- */
  .js .reveal{
    opacity:0;transform:translateY(26px);
    transition:opacity .75s ease-out,transform .75s cubic-bezier(.22,.61,.36,1);
    will-change:opacity,transform;
  }
  .js .reveal.visible{opacity:1;transform:translateY(0)}
  @media (prefers-reduced-motion:reduce){
    .js .reveal{opacity:1;transform:none;transition:none}
  }

  /* ---------- header ---------- */
  header{
    position:sticky;top:0;z-index:50;
    background:var(--black);
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .nav{
    display:flex;align-items:center;justify-content:space-between;
    height:72px;gap:24px;
  }
  .brand{display:flex;align-items:center;gap:12px;text-decoration:none}
  .brand .chip{
    background:var(--white);border-radius:4px;padding:6px 10px;display:flex;align-items:center;
  }
  .brand img{height:32px;width:auto}
  .nav-links{display:flex;align-items:center;gap:30px;list-style:none}
  .nav-links a{
    color:#D6D6D6;text-decoration:none;font-size:12px;font-weight:700;
    letter-spacing:.18em;text-transform:uppercase;transition:color .2s;
    padding-bottom:4px;border-bottom:2px solid transparent;
  }
  .nav-links a:hover{color:var(--white)}
  .nav-links a.active{color:var(--white);border-bottom-color:var(--red)}
  .btn{
    display:inline-block;text-decoration:none;font-family:var(--body);font-weight:700;
    font-size:12px;letter-spacing:.18em;text-transform:uppercase;
    padding:14px 28px;border:2px solid transparent;transition:all .2s;text-align:center;
  }
  .btn-red{background:var(--red);color:var(--white)}
  .btn-red:hover{background:#C00511}
  .btn-outline-light{border-color:rgba(255,255,255,.4);color:var(--white)}
  .btn-outline-light:hover{border-color:var(--white)}
  .btn-light{background:var(--white);color:var(--black)}
  .btn-light:hover{background:#EBEBEB}
  .nav .btn{padding:11px 22px;border-bottom:2px solid transparent}

  .nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:8px}
  .nav-toggle span{
    display:block;width:24px;height:2px;background:var(--white);margin:5px 0;transition:transform .25s,opacity .25s;
  }
  .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
  .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  /* ---------- hero ---------- */
  .hero{
    background:var(--black);color:var(--white);
    padding:110px 0 130px;position:relative;overflow:hidden;
  }
  .hero-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden}
  .hero-bg .glow{
    position:absolute;right:-220px;top:-220px;width:780px;height:780px;border-radius:50%;
    background:radial-gradient(circle, rgba(227,6,19,.16) 0%, rgba(227,6,19,.05) 42%, transparent 68%);
    animation:glow-pulse 9s ease-in-out infinite;
    will-change:transform,opacity;
  }
  .hero-bg .glow.glow-2{
    right:auto;top:auto;left:-260px;bottom:-300px;width:680px;height:680px;
    background:radial-gradient(circle, rgba(255,255,255,.05) 0%, rgba(255,255,255,.015) 45%, transparent 70%);
    animation:glow-pulse 13s ease-in-out 2.5s infinite;
  }
  .hero-bg .ring{position:absolute;border-radius:50%;will-change:transform}
  .hero-bg .ring-1{
    right:-180px;top:-180px;width:560px;height:560px;
    border:1px solid rgba(255,255,255,.08);
    animation:drift-a 22s ease-in-out infinite;
  }
  .hero-bg .ring-2{
    right:-60px;top:-60px;width:560px;height:560px;
    border:1px solid rgba(227,6,19,.25);
    animation:drift-b 28s ease-in-out infinite;
  }
  .hero-bg .ring-3{
    right:120px;top:-300px;width:780px;height:780px;
    border:1px solid rgba(255,255,255,.045);
    animation:drift-a 36s ease-in-out 4s infinite reverse;
  }
  .hero-bg .ring-4{
    left:-140px;bottom:-380px;width:620px;height:620px;
    border:1px solid rgba(227,6,19,.12);
    animation:drift-b 30s ease-in-out 1.5s infinite reverse;
  }
  .hero-bg .dot{
    position:absolute;width:8px;height:8px;border-radius:50%;background:var(--red);
    opacity:.55;animation:dot-float 11s ease-in-out infinite;will-change:transform,opacity;
  }
  .hero-bg .dot-2{right:14%;top:24%;width:5px;height:5px;animation-duration:14s;animation-delay:3s}
  .hero-bg .dot-3{right:30%;top:64%;width:4px;height:4px;opacity:.35;animation-duration:17s;animation-delay:6s}
  .hero-bg .dot-1{right:8%;top:52%}
  @keyframes drift-a{
    0%,100%{transform:translate(0,0) scale(1)}
    50%{transform:translate(-46px,34px) scale(1.06)}
  }
  @keyframes drift-b{
    0%,100%{transform:translate(0,0) scale(1)}
    50%{transform:translate(38px,-30px) scale(.95)}
  }
  @keyframes glow-pulse{
    0%,100%{transform:scale(1);opacity:.75}
    50%{transform:scale(1.18);opacity:1}
  }
  @keyframes dot-float{
    0%,100%{transform:translate(0,0)}
    25%{transform:translate(-22px,-30px)}
    50%{transform:translate(14px,-52px)}
    75%{transform:translate(28px,-18px)}
  }
  @media (prefers-reduced-motion:reduce){
    .hero-bg .glow,.hero-bg .ring,.hero-bg .dot{animation:none}
  }
  .hero .inner{position:relative;z-index:1;max-width:780px}
  .hero h1{font-size:clamp(44px,7.5vw,84px);margin:28px 0 26px;color:var(--white)}
  .hero h1 .red{color:var(--red)}
  .hero p{font-size:clamp(16px,2vw,19px);color:#B9B9B9;max-width:560px;margin-bottom:42px}
  .hero .actions{display:flex;gap:16px;flex-wrap:wrap}

  /* ---------- sections ---------- */
  section{padding:96px 0}
  .section-head{max-width:720px;margin-bottom:56px}
  .section-head h2{font-size:clamp(30px,4.4vw,46px);margin-top:24px}
  .section-head h2 .red{color:var(--red)}
  .section-head p.lead{margin-top:20px;font-size:17px;color:var(--muted)}

  /* who we are */
  #who{background:var(--white)}
  .who-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:start}
  .who-grid p{font-size:17px;color:var(--muted);margin-bottom:20px}
  .who-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
  .who-tags span{
    font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
    border:1px solid #DDD;color:var(--ink);padding:9px 14px;background:var(--white);
  }
  .who-panel{background:var(--black);color:var(--white);padding:44px 40px}
  .who-panel h3{font-size:13px;font-family:var(--body);font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--red-bright)}
  .who-panel h3::after{content:"";display:block;width:38px;height:3px;background:var(--red);margin-top:12px}
  .who-panel ul{list-style:none;margin-top:30px}
  .who-panel li{
    display:flex;gap:14px;align-items:baseline;
    padding:13px 0;border-bottom:1px solid rgba(255,255,255,.1);
    font-size:15px;color:#D9D9D9;
  }
  .who-panel li:last-child{border-bottom:0}
  .who-panel li::before{content:"";flex:0 0 9px;height:9px;background:var(--red);border-radius:50%;transform:translateY(-1px)}

  /* services */
  #services{background:var(--grey)}
  .svc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
  .svc{
    background:var(--white);padding:22px 20px;border-left:3px solid var(--black);
    transition:border-color .2s,transform .2s;box-shadow:0 1px 2px rgba(0,0,0,.04);
  }
  .svc:hover{border-left-color:var(--red);transform:translateY(-2px)}
  .svc .code{
    font-family:var(--display);font-size:11px;color:var(--red);letter-spacing:.12em;
  }
  .svc .name{display:block;margin-top:8px;font-size:14px;font-weight:600;color:var(--ink);line-height:1.4}

  /* ops hub */
  #ops-hub{background:var(--black);color:var(--white)}
  #ops-hub .section-head p.lead{color:#B9B9B9}
  .hub-top{display:grid;grid-template-columns:1fr 1.05fr;gap:56px;align-items:center;margin-bottom:64px}
  .hub-top .section-head{margin-bottom:0}

  /* briefing mockup (content from deck p9 — live example) */
  .briefing{
    background:#111;border:1px solid rgba(255,255,255,.12);
    font-size:12px;box-shadow:0 24px 60px rgba(0,0,0,.5);
  }
  .briefing-bar{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding:13px 18px;border-bottom:1px solid rgba(255,255,255,.1);
  }
  .briefing-bar .title{
    font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#8E8E8E;
  }
  .live-pill{
    display:inline-flex;align-items:center;gap:7px;
    font-size:10px;font-weight:700;letter-spacing:.18em;color:var(--red-bright);
  }
  .live-pill::before{
    content:"";width:8px;height:8px;border-radius:50%;background:var(--red);
    animation:live-blink 1.6s ease-in-out infinite;
  }
  @keyframes live-blink{0%,100%{opacity:1}50%{opacity:.25}}
  @media (prefers-reduced-motion:reduce){.live-pill::before{animation:none}}
  .briefing-stats{
    display:grid;grid-template-columns:repeat(6,1fr);
    border-bottom:1px solid rgba(255,255,255,.1);
  }
  .briefing-stats .cell{padding:14px 8px;text-align:center;border-right:1px solid rgba(255,255,255,.07)}
  .briefing-stats .cell:last-child{border-right:0}
  .briefing-stats .v{font-family:var(--display);font-size:17px;color:var(--white)}
  .briefing-stats .v.alert{color:var(--red-bright)}
  .briefing-stats .k{display:block;margin-top:5px;font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:#7C7C7C}
  .briefing-body{display:grid;grid-template-columns:1fr 1fr;gap:0}
  .briefing-col{padding:16px 18px}
  .briefing-col + .briefing-col{border-left:1px solid rgba(255,255,255,.07)}
  .briefing-col h4{
    font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
    color:var(--red-bright);margin-bottom:12px;
  }
  .briefing-col .row{padding:8px 0;border-bottom:1px solid rgba(255,255,255,.06)}
  .briefing-col .row:last-child{border-bottom:0}
  .briefing-col .row strong{display:block;font-size:11px;color:#E8E8E8;font-weight:600}
  .briefing-col .row span{font-size:10.5px;color:#9A9A9A;line-height:1.45}

  .hub-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
  .hub-card{
    background:#141414;border:1px solid rgba(255,255,255,.08);
    padding:38px 34px;transition:border-color .25s,transform .25s;
  }
  .hub-card:hover{border-color:rgba(227,6,19,.55);transform:translateY(-3px)}
  .hub-card .num{font-family:var(--display);font-size:14px;color:var(--red-bright);letter-spacing:.1em}
  .hub-card h3{font-size:19px;margin:16px 0 12px;color:var(--white)}
  .hub-card p{font-size:15px;color:#A9A9A9}

  /* stats band (deck p10 — measurable wins) */
  .stats{
    margin-top:72px;padding-top:64px;border-top:1px solid rgba(255,255,255,.1);
    display:grid;grid-template-columns:repeat(3,1fr);gap:40px;text-align:center;
  }
  .stat .value{font-family:var(--display);font-size:clamp(40px,5.5vw,64px);color:var(--red-bright);line-height:1}
  .stat .label{
    display:block;margin-top:14px;font-size:11px;font-weight:700;
    letter-spacing:.2em;text-transform:uppercase;color:#9A9A9A;line-height:1.7;
  }

  /* difference */
  #difference{background:var(--white)}
  .diff-table{border:1px solid #E4E4E4}
  .diff-head,.diff-row{display:grid;grid-template-columns:200px 1fr 1fr}
  .diff-head > div{
    padding:18px 24px;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  }
  .diff-head .h-staff{color:var(--muted-light)}
  .diff-head .h-emc{color:var(--white);background:var(--black)}
  .diff-row{border-top:1px solid #E4E4E4}
  .diff-row > div{padding:22px 24px;font-size:14.5px;line-height:1.55}
  .diff-row .label{
    font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
    color:var(--ink);display:flex;align-items:center;
  }
  .diff-row .staff{color:var(--muted)}
  .diff-row .emc{background:var(--black);color:#D9D9D9}
  .diff-row .emc strong{color:var(--white);font-weight:600}
  .diff-quote{
    margin-top:48px;font-family:var(--display);font-size:clamp(20px,3vw,30px);
    line-height:1.3;max-width:820px;
  }
  .diff-quote .red{color:var(--red)}

  /* engage */
  #engage{background:var(--grey)}
  .engage-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
  .engage-card{
    background:var(--white);padding:48px 42px;border-top:5px solid var(--black);
    display:flex;flex-direction:column;gap:16px;
    box-shadow:0 1px 2px rgba(0,0,0,.05);
  }
  .engage-card.accent{border-top-color:var(--red)}
  .engage-card .tag{font-size:11px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--muted-light)}
  .engage-card h3{font-size:26px}
  .engage-card p{font-size:16px;color:var(--muted);flex:1}
  .engage-card .btn{align-self:flex-start}

  /* process (deck p16 — from conversation to engagement) */
  .process{margin-top:72px}
  .process h3{font-size:clamp(20px,2.6vw,26px);margin-bottom:40px}
  .steps{display:grid;grid-template-columns:repeat(5,1fr);gap:24px;counter-reset:step}
  .step{position:relative;padding-top:26px}
  .step::before{
    content:"";position:absolute;top:5px;left:0;right:-24px;height:2px;background:#DDD;
  }
  .step:last-child::before{right:0}
  .step::after{
    content:"";position:absolute;top:0;left:0;width:12px;height:12px;border-radius:50%;
    background:var(--red);
  }
  .step .n{font-family:var(--display);font-size:13px;color:var(--red);letter-spacing:.08em}
  .step h4{font-family:var(--body);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;margin:8px 0 8px}
  .step p{font-size:13px;color:var(--muted);line-height:1.55}

  /* learn more */
  #learn-more{background:var(--red);color:var(--white);padding:88px 0}
  #learn-more .eyebrow{color:var(--white)}
  #learn-more .eyebrow::after{background:var(--white)}
  .learn-inner{display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap}
  .learn-inner h2{font-size:clamp(28px,4vw,42px);max-width:560px;margin-top:22px}
  .learn-inner p{margin-top:14px;font-size:16px;color:rgba(255,255,255,.88);max-width:520px}
  #learn-more .btn-light{flex:0 0 auto}

  /* contact */
  #contact{background:var(--black);color:var(--white);padding:110px 0}
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
  .contact-grid h2{font-size:clamp(30px,4.4vw,46px);margin-top:24px;color:var(--white)}
  .contact-grid h2 .red{color:var(--red)}
  .contact-name{font-family:var(--display);font-size:18px;letter-spacing:.06em;text-transform:uppercase}
  .contact-role{font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--red-bright);margin-top:6px}
  .contact-list{list-style:none;margin-top:30px}
  .contact-list li{
    padding:15px 0;border-bottom:1px solid rgba(255,255,255,.1);
    display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;font-size:16px;
  }
  .contact-list li:last-child{border-bottom:0}
  .contact-list .label{
    flex:0 0 96px;font-size:11px;font-weight:700;letter-spacing:.2em;
    text-transform:uppercase;color:var(--muted-light);
  }
  .contact-list a{color:var(--white);text-decoration:none;border-bottom:1px solid rgba(227,6,19,.6);padding-bottom:1px}
  .contact-list a:hover{border-bottom-color:var(--red-bright)}

  /* footer */
  footer{
    background:var(--black);color:var(--muted-light);
    border-top:1px solid rgba(255,255,255,.08);padding:42px 0;
  }
  .foot{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
  .foot .chip{background:var(--white);border-radius:4px;padding:5px 9px;display:inline-flex}
  .foot img{height:24px;width:auto}
  .foot nav{display:flex;gap:22px;flex-wrap:wrap}
  .foot nav a{
    color:#B9B9B9;text-decoration:none;font-size:11px;font-weight:700;
    letter-spacing:.16em;text-transform:uppercase;
  }
  .foot nav a:hover{color:var(--white)}
  .foot p{font-size:13px;letter-spacing:.04em}
  .foot p strong{color:#E6E6E6}

  /* back to top */
  .to-top{
    position:fixed;right:22px;bottom:22px;z-index:40;
    width:46px;height:46px;border:0;cursor:pointer;
    background:var(--red);color:var(--white);font-size:18px;line-height:1;
    opacity:0;transform:translateY(12px);pointer-events:none;
    transition:opacity .3s,transform .3s,background .2s;
  }
  .to-top.show{opacity:1;transform:translateY(0);pointer-events:auto}
  .to-top:hover{background:#C00511}

  /* ---------- responsive ---------- */
  @media (max-width:980px){
    .hub-top{grid-template-columns:1fr;gap:44px}
    .steps{grid-template-columns:1fr;gap:0}
    .step{padding:0 0 28px 30px}
    .step::before{top:5px;left:5px;right:auto;bottom:-5px;width:2px;height:auto}
    .step:last-child::before{display:none}
    .step::after{top:0;left:0}
  }
  @media (max-width:900px){
    .who-grid,.engage-grid,.contact-grid,.hub-grid{grid-template-columns:1fr}
    .who-grid{gap:44px}
    .contact-grid{gap:44px}
    .stats{grid-template-columns:1fr;gap:36px}
    .diff-head{display:none}
    .diff-row{grid-template-columns:1fr}
    .diff-row .label{padding-bottom:6px}
    .diff-row .staff::before{content:"Staffing model — ";font-weight:700;color:var(--muted-light);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
    .diff-row .emc::before{content:"EMC Live — ";font-weight:700;color:var(--red-bright);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
    section{padding:72px 0}
    .hero{padding:84px 0 96px}
  }
  @media (max-width:760px){
    .nav-toggle{display:block}
    .nav-menu{
      position:absolute;top:72px;left:0;right:0;
      background:var(--black);border-bottom:1px solid rgba(255,255,255,.1);
      display:none;flex-direction:column;align-items:stretch;
      padding:12px 24px 28px;gap:0;
    }
    .nav-menu.open{display:flex}
    .nav-menu li{border-bottom:1px solid rgba(255,255,255,.08)}
    .nav-menu li:last-of-type{border-bottom:0}
    .nav-menu a{display:block;padding:16px 0;border-bottom:0}
    .nav-menu a.active{border-bottom:0;color:var(--red-bright)}
    .nav-menu .btn{margin-top:16px;display:block}
    .learn-inner{flex-direction:column;align-items:flex-start}
    .hero .actions .btn{width:100%}
    .briefing-stats{grid-template-columns:repeat(3,1fr)}
    .briefing-stats .cell:nth-child(3){border-right:0}
    .briefing-stats .cell:nth-child(-n+3){border-bottom:1px solid rgba(255,255,255,.07)}
    .briefing-body{grid-template-columns:1fr}
    .briefing-col + .briefing-col{border-left:0;border-top:1px solid rgba(255,255,255,.07)}
  }
