:root{
    --ink:#12203A;
    --ink-2:#0C1728;
    --steel:#5B6472;
    --steel-light:#AEB4BD;
    --paper:#EDEAE1;
    --paper-2:#E2DDD0;
    --rubber-red:#B23A2E;
    --rubber-red-dark:#8E2C22;
    --brass:#C68A3E;
    --line:#D8D2C3;
    --ok-green:#3E6B4F;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'IBM Plex Sans',sans-serif;
    background:var(--paper);
    color:var(--ink-2);
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,h4{
    font-family:'Oswald',sans-serif;
    text-transform:uppercase;
    letter-spacing:0.02em;
    line-height:1.05;
    color:var(--ink-2);
  }
  .mono{font-family:'IBM Plex Mono',monospace;}
  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  .wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
  .eyebrow{
    font-family:'IBM Plex Mono',monospace;
    font-size:0.72rem;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--rubber-red);
    font-weight:600;
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-bottom:12px;
  }
  .eyebrow::before{
    content:"";
    width:20px;height:2px;
    background:var(--rubber-red);
    display:inline-block;
  }
  ::selection{background:var(--rubber-red);color:#fff;}
  :focus-visible{outline:3px solid var(--brass);outline-offset:2px;}

  /* ---------- HEADER ---------- */
  header{
    position:sticky;top:0;z-index:100;
    background:var(--ink-2);
    border-bottom:3px solid var(--rubber-red);
  }
  .nav-inner{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 24px;max-width:1180px;margin:0 auto;
  }
  .logo{
    display:flex;flex-direction:column;color:#fff;
  }
  .logo .name{
    font-family:'Oswald',sans-serif;font-weight:700;font-size:1.28rem;
    letter-spacing:0.03em;
  }
  .logo .name span{color:var(--rubber-red);}
  .logo .tag{
    font-family:'IBM Plex Mono',monospace;font-size:0.62rem;
    color:var(--steel-light);letter-spacing:0.12em;text-transform:uppercase;
    margin-top:2px;
  }
  nav ul{list-style:none;display:flex;gap:28px;}
  nav a{
    color:#DCE0E6;font-size:0.86rem;font-weight:500;
    text-transform:uppercase;letter-spacing:0.05em;
    font-family:'IBM Plex Mono',monospace;
    padding:6px 0;border-bottom:2px solid transparent;
    transition:border-color .2s, color .2s;
  }
  nav a:hover{color:#fff;border-color:var(--rubber-red);}
  .header-cta{
    display:flex;align-items:center;gap:16px;
  }
  .phone-btn{
    background:var(--rubber-red);color:#fff;
    padding:9px 16px;font-family:'IBM Plex Mono',monospace;
    font-size:0.82rem;font-weight:600;letter-spacing:0.03em;
    border-radius:2px;white-space:nowrap;
    box-shadow:2px 2px 0 var(--rubber-red-dark);
    transition:transform .15s;
  }
  .phone-btn:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--rubber-red-dark);}
  .menu-toggle{display:none;background:none;border:2px solid var(--steel-light);color:#fff;padding:6px 10px;font-size:1.1rem;cursor:pointer;}

  /* ---------- HERO ---------- */
  .hero{
    background:
      radial-gradient(ellipse at 80% 0%, rgba(178,58,46,0.28), transparent 55%),
      linear-gradient(180deg, var(--ink) 0%, var(--ink-2) 100%);
    color:#fff;position:relative;overflow:hidden;
    border-bottom:1px solid #1E3050;
  }
  .hero .wrap{
    display:grid;grid-template-columns:1.15fr 0.85fr;gap:48px;
    align-items:center;padding-top:76px;padding-bottom:76px;
  }
  .hero h1{
    font-size:clamp(2.4rem,5vw,3.6rem);color:#fff;margin-bottom:20px;
  }
  .hero h1 em{
    font-style:normal;color:var(--rubber-red);
  }
  .hero p.lead{
    color:#C6CCD6;font-size:1.08rem;max-width:46ch;margin-bottom:32px;
  }
  .hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:36px;}
  .btn{
    display:inline-flex;align-items:center;gap:8px;
    padding:13px 22px;font-family:'IBM Plex Mono',monospace;
    font-size:0.85rem;font-weight:600;letter-spacing:0.03em;
    border-radius:2px;border:2px solid transparent;
    transition:transform .15s,background .2s;
  }
  .btn-primary{background:var(--rubber-red);color:#fff;box-shadow:3px 3px 0 var(--rubber-red-dark);}
  .btn-primary:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--rubber-red-dark);}
  .btn-ghost{border-color:#4A5A75;color:#fff;}
  .btn-ghost:hover{border-color:#fff;}
  .hero-stats{
    display:flex;gap:28px;flex-wrap:wrap;border-top:1px solid #23375A;padding-top:24px;
  }
  .hero-stats div{font-family:'IBM Plex Mono',monospace;}
  .hero-stats .num{font-size:1.5rem;color:#fff;font-weight:600;}
  .hero-stats .lbl{font-size:0.7rem;color:var(--steel-light);letter-spacing:0.08em;text-transform:uppercase;}

  /* roller graphic - signature element */
  .roller-plate{
    position:relative;background:#0D1930;border:1px solid #24395E;
    border-radius:4px;padding:28px;
  }
  .roller-plate .tagline{
    font-family:'IBM Plex Mono',monospace;color:var(--brass);
    font-size:0.7rem;letter-spacing:0.15em;text-transform:uppercase;margin-bottom:16px;
  }
  .roller-svg{width:100%;height:auto;}
  .roller-plate .plate-foot{
    display:flex;justify-content:space-between;margin-top:18px;padding-top:14px;
    border-top:1px dashed #24395E;font-family:'IBM Plex Mono',monospace;
    font-size:0.68rem;color:var(--steel-light);
  }

  section{padding:76px 0;}
  .section-head{max-width:640px;margin-bottom:44px;}
  .section-head h2{font-size:clamp(1.7rem,3vw,2.3rem);}
  .section-head p{color:var(--steel);margin-top:12px;font-size:1.02rem;}

  /* ---------- ABOUT ---------- */
  .about{background:var(--paper);}
  .about-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:56px;align-items:start;}
  .about-copy p{margin-bottom:16px;color:#2A3446;}
  .id-card{
    background:#fff;border:1px solid var(--line);border-radius:3px;
    box-shadow:0 1px 0 var(--line), 0 8px 24px rgba(18,32,58,0.06);
    overflow:hidden;
  }
  .id-card-head{
    background:var(--ink-2);color:#fff;padding:16px 22px;
    display:flex;justify-content:space-between;align-items:center;
  }
  .id-card-head .t1{font-family:'IBM Plex Mono',monospace;font-size:0.68rem;letter-spacing:0.14em;color:var(--steel-light);text-transform:uppercase;}
  .id-card-head .t2{font-family:'IBM Plex Mono',monospace;font-size:0.68rem;color:var(--ok-green);background:#DDEDE2;padding:3px 8px;border-radius:2px;}
  .id-card-body{padding:22px;}
  .id-row{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--line);font-size:0.88rem;}
  .id-row:last-child{border-bottom:none;}
  .id-row .k{color:var(--steel);font-family:'IBM Plex Mono',monospace;font-size:0.72rem;letter-spacing:0.05em;text-transform:uppercase;padding-top:2px;}
  .id-row .v{color:var(--ink-2);font-weight:500;text-align:right;}

  /* ---------- CATEGORIES ---------- */
  .categories{background:var(--ink-2);color:#fff;}
  .categories .section-head p{color:var(--steel-light);}
  .categories .section-head h2{color:#fff;}
  .tab-grid{
    display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;
  }
  .tab{
    background:#182A48;border:1px solid #26395C;border-radius:2px 2px 0 0;
    padding:18px 18px 16px;position:relative;transition:background .2s, transform .15s;
    cursor:default;
  }
  .tab::before{
    content:"";position:absolute;top:-8px;left:16px;width:44px;height:8px;
    background:#26395C;border-radius:3px 3px 0 0;
  }
  .tab:hover{background:#1F3459;transform:translateY(-2px);}
  .tab .b-eyebrow{font-family:'IBM Plex Mono',monospace;font-size:0.62rem;color:var(--rubber-red);letter-spacing:0.1em;text-transform:uppercase;margin-bottom:6px;}
  .tab .b-name{font-family:'Oswald',sans-serif;font-size:1.15rem;letter-spacing:0.02em;color:#fff;}

  /* ---------- PRODUCTS ---------- */
  .products{background:var(--paper);}
  .prod-grid{
    display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:22px;
  }
  .spec-plate{
    background:#232B33;border-radius:4px;padding:20px;position:relative;
    box-shadow:0 6px 18px rgba(18,32,58,0.14);
    border:1px solid #384049;
  }
  .spec-plate::after{
    content:"";position:absolute;inset:6px;border:1px solid rgba(255,255,255,0.06);
    border-radius:2px;pointer-events:none;
  }
  .rivet{position:absolute;width:7px;height:7px;border-radius:50%;
    background:radial-gradient(circle at 35% 35%, #9AA3AC, #4B5157);}
  .rivet.tl{top:9px;left:9px;} .rivet.tr{top:9px;right:9px;}
  .rivet.bl{bottom:9px;left:9px;} .rivet.br{bottom:9px;right:9px;}
  .spec-plate .part-img{
    width:100%;height:140px;object-fit:cover;
    border-radius:2px;margin-bottom:14px;
    border:1px solid #384049;
  }
  .spec-plate .badge{
    display:inline-block;font-family:'IBM Plex Mono',monospace;font-size:0.62rem;
    letter-spacing:0.1em;color:#FFD9A0;background:rgba(198,138,62,0.18);
    border:1px solid rgba(198,138,62,0.4);padding:2px 8px;border-radius:2px;margin-bottom:12px;
  }
  .spec-plate .part-no{
    font-family:'IBM Plex Mono',monospace;color:#fff;font-size:1.3rem;font-weight:600;
    letter-spacing:0.02em;margin-bottom:6px;
  }
  .spec-plate .desc{color:#AEB8C2;font-size:0.85rem;margin-bottom:16px;min-height:38px;}
  .spec-plate .price-row{
    display:flex;justify-content:space-between;align-items:center;
    border-top:1px dashed #40484F;padding-top:14px;
  }
  .spec-plate .price{font-family:'IBM Plex Mono',monospace;color:#7FD99A;font-size:1.05rem;font-weight:600;}
  .spec-plate .quote-link{font-family:'IBM Plex Mono',monospace;font-size:0.72rem;color:var(--rubber-red);letter-spacing:0.05em;text-transform:uppercase;border-bottom:1px solid var(--rubber-red);}

  .promo-strip{
    margin-top:28px;background:var(--rubber-red);color:#fff;border-radius:3px;
    padding:20px 26px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;
  }
  .promo-strip .p1{font-family:'Oswald',sans-serif;font-size:1.15rem;letter-spacing:0.02em;}
  .promo-strip .p2{font-family:'IBM Plex Mono',monospace;font-size:0.8rem;color:#FFD9D3;}

  /* ---------- WHY US ---------- */
  .why{background:var(--paper-2);}
  .why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
  .why-card{background:#fff;border:1px solid var(--line);padding:26px 24px;border-radius:3px;}
  .why-card .icon{width:38px;height:38px;color:var(--rubber-red);margin-bottom:16px;}
  .why-card h3{font-size:1.05rem;letter-spacing:0.01em;margin-bottom:8px;}
  .why-card p{color:var(--steel);font-size:0.9rem;}

  /* ---------- CONTACT ---------- */
  .contact{background:var(--ink-2);color:#fff;}
  .contact .section-head h2{color:#fff;}
  .contact .section-head p{color:var(--steel-light);}
  .contact-grid{display:grid;grid-template-columns:0.9fr 1.1fr;gap:0;border:1px solid #26395C;border-radius:4px;overflow:hidden;}
  .contact-info{background:#182A48;padding:36px;}
  .c-row{display:flex;gap:16px;margin-bottom:26px;}
  .c-row:last-child{margin-bottom:0;}
  .c-row .ic{width:22px;height:22px;flex:none;color:var(--rubber-red);margin-top:3px;}
  .c-row .lbl{font-family:'IBM Plex Mono',monospace;font-size:0.68rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--steel-light);margin-bottom:4px;}
  .c-row .val{font-size:0.95rem;color:#fff;}
  .c-row .val a:hover{color:var(--rubber-red);}
  .map-box{position:relative;min-height:340px;}
  .map-box iframe{width:100%;height:100%;min-height:340px;border:0;filter:grayscale(0.15) contrast(1.05);}

  /* ---------- REPORT ---------- */
  .report{background:var(--paper);}
  .report-card{
    display:flex;gap:28px;align-items:center;background:#fff;border:1px solid var(--line);
    border-radius:4px;padding:26px 30px;flex-wrap:wrap;
  }
  .report-thumb{
    width:78px;height:100px;flex:none;background:var(--ink-2);border-radius:2px;
    display:flex;align-items:center;justify-content:center;color:var(--steel-light);
    border:1px solid #26395C;
  }
  .report-thumb svg{width:34px;height:34px;}
  .report-text h3{font-size:1.15rem;margin-bottom:6px;}
  .report-text p{color:var(--steel);font-size:0.9rem;max-width:52ch;}
  .report-actions{margin-left:auto;display:flex;gap:12px;}
  .btn-dark{background:var(--ink-2);color:#fff;padding:12px 20px;border-radius:2px;font-family:'IBM Plex Mono',monospace;font-size:0.8rem;letter-spacing:0.03em;}
  .btn-dark:hover{background:var(--rubber-red);}

  /* lightbox */
  .lightbox{
    display:none;position:fixed;inset:0;background:rgba(12,23,40,0.88);
    z-index:1000;align-items:center;justify-content:center;padding:24px;
  }
  .lightbox.open{display:flex;}
  .lightbox-inner{background:#fff;max-width:520px;width:100%;border-radius:4px;overflow:hidden;max-height:90vh;display:flex;flex-direction:column;}
  .lightbox-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;background:var(--ink-2);color:#fff;}
  .lightbox-head span{font-family:'IBM Plex Mono',monospace;font-size:0.78rem;letter-spacing:0.05em;}
  .lightbox-head button{background:none;border:none;color:#fff;font-size:1.2rem;cursor:pointer;line-height:1;}
  .lightbox-body{overflow:auto;padding:10px;background:#EDEAE1;}
  .lightbox-body img{width:100%;border-radius:2px;}

  /* ---------- FOOTER ---------- */
  footer{background:var(--ink);color:var(--steel-light);padding:48px 0 22px;}
  .footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:36px;margin-bottom:36px;}
  .footer-grid h4{color:#fff;font-size:0.85rem;letter-spacing:0.08em;margin-bottom:16px;font-family:'IBM Plex Mono',monospace;text-transform:uppercase;}
  .footer-grid p, .footer-grid li{font-size:0.86rem;line-height:1.7;}
  .footer-grid ul{list-style:none;}
  .footer-legal{
    border-top:1px solid #22314D;padding-top:20px;
    display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
    font-family:'IBM Plex Mono',monospace;font-size:0.72rem;color:#6C7B93;
  }

  @media (max-width:900px){
    nav{display:none;}
    .menu-toggle{display:inline-block;}
    .hero .wrap{grid-template-columns:1fr;padding-top:44px;padding-bottom:44px;}
    .about-grid{grid-template-columns:1fr;}
    .why-grid{grid-template-columns:1fr;}
    .contact-grid{grid-template-columns:1fr;}
    .footer-grid{grid-template-columns:1fr;}
    section{padding:52px 0;}
  }
  @media (max-width:520px){
    .header-cta .phone-btn span.full{display:none;}
    .hero-stats{gap:20px;}
    .report-card{flex-direction:column;align-items:flex-start;}
    .report-actions{margin-left:0;}
  }
  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto;}
    *{transition:none!important;}
  }
