:root{
    --brand-dark:#0b3b29;
    --brand:#12614a;
    --brand-mint:#8fd9b6;
    --ink:#14181c;
    --paper:#f4f6f4;
    --paper-dim:#e9ede9;
    --steel:#5c6660;
    --line:#c9d2cb;
    --white:#ffffff;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--paper);
    color:var(--ink);
    font-family:'IBM Plex Sans',system-ui,sans-serif;
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,.head-font{
    font-family:'IBM Plex Sans Condensed',sans-serif;
    font-weight:700;
    letter-spacing:-0.01em;
    line-height:1.05;
  }
  .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 28px;}
  .grid-tick{
    position:relative;
  }
  .grid-tick::before,.grid-tick::after{
    content:"";
    position:absolute;
    width:14px;height:14px;
    border-color:var(--brand-mint);
  }
  .grid-tick::before{top:-1px;left:-1px;border-top:2px solid;border-left:2px solid;}
  .grid-tick::after{bottom:-1px;right:-1px;border-bottom:2px solid;border-right:2px solid;}

  /* Header */
  header{
    position:sticky;top:0;z-index:50;
    background:var(--paper);
    border-bottom:1px solid var(--line);
  }
  .header-row{
    display:flex;align-items:center;justify-content:space-between;
    height:76px;
  }
  .logo{display:flex;align-items:center;gap:12px;}
  .logo-mark{
    width:38px;height:38px;background:var(--brand-dark);
    display:flex;align-items:center;justify-content:center;
    color:var(--brand-mint);font-weight:700;font-size:19px;
    font-family:'IBM Plex Sans Condensed',sans-serif;
    clip-path:polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  }
  .logo-text{font-family:'IBM Plex Sans Condensed',sans-serif;font-weight:700;font-size:17px;line-height:1.15;}
  .logo-text span{display:block;font-size:10.5px;letter-spacing:0.14em;color:var(--brand);font-weight:600;}
  nav{display:flex;gap:30px;font-size:14px;font-weight:500;color:var(--steel);}
  nav a:hover{color:var(--brand-dark);}
  .head-actions{display:flex;align-items:center;gap:22px;}
  .head-phone{font-size:14px;font-weight:600;}
  .head-phone .mono{color:var(--steel);font-size:12px;font-weight:400;}
  .btn{
    display:inline-flex;align-items:center;justify-content:center;
    padding:12px 22px;
    font-size:14px;font-weight:600;
    border:1px solid var(--brand-dark);
    white-space:nowrap;
  }
  .btn-solid{background:var(--brand-dark);color:var(--white);}
  .btn-solid:hover{background:var(--brand);}
  .btn-line{background:transparent;color:var(--brand-dark);}
  .btn-line:hover{background:var(--paper-dim);}
  @media (max-width:900px){ nav{display:none;} }

  /* Hero */
  .hero{
    background:var(--brand-dark);
    color:var(--white);
    padding:64px 0 0;
    position:relative;
    overflow:hidden;
  }
  .hero::before{
    content:"";
    position:absolute;inset:0;
    background-image:
      linear-gradient(rgba(143,217,182,.08) 1px, transparent 1px),
      linear-gradient(90deg, rgba(143,217,182,.08) 1px, transparent 1px);
    background-size:44px 44px;
    pointer-events:none;
  }
  .hero-inner{position:relative;display:grid;grid-template-columns:1.15fr 0.85fr;gap:60px;align-items:end;}
  .eyebrow-line{
    display:flex;align-items:center;gap:10px;
    font-size:12.5px;letter-spacing:0.06em;color:var(--brand-mint);
    margin-bottom:22px;
  }
  .eyebrow-line::before{content:"";width:22px;height:1px;background:var(--brand-mint);}
  .hero h1{font-size:clamp(34px,4.6vw,54px);max-width:640px;}
  .hero p.lead{font-size:17px;color:#cfe4d8;max-width:520px;margin:22px 0 34px;}
  .hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:56px;}
  .btn-mint{background:var(--brand-mint);color:var(--brand-dark);border:1px solid var(--brand-mint);}
  .btn-mint:hover{background:#a6e4c4;}
  .btn-outline-w{background:transparent;color:var(--white);border:1px solid rgba(255,255,255,.4);}
  .btn-outline-w:hover{border-color:var(--white);}

  .hero-stat-panel{
    border-left:1px solid rgba(143,217,182,.3);
    padding-left:32px;
    padding-bottom:56px;
    display:grid;
    gap:26px;
  }
  .stat{}
  .stat .num{font-family:'IBM Plex Mono',monospace;font-size:34px;font-weight:500;color:var(--brand-mint);}
  .stat .lbl{font-size:13px;color:#b7cdc1;margin-top:2px;}

  .hero-strip{
    border-top:1px solid rgba(143,217,182,.2);
    background:rgba(0,0,0,.12);
    position:relative;
  }
  .hero-strip .wrap{
    display:flex;gap:0;overflow-x:auto;
  }
  .hero-strip-item{
    padding:16px 26px;
    font-size:13px;color:#cfe4d8;
    border-right:1px solid rgba(143,217,182,.15);
    white-space:nowrap;
  }
  .hero-strip-item b{color:var(--white);font-weight:600;}

  /* Section shared */
  section{padding:80px 0;}
  .sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:44px;flex-wrap:wrap;}
  .sec-tag{font-size:12.5px;color:var(--brand);letter-spacing:0.04em;margin-bottom:10px;font-weight:600;}
  .sec-title{font-size:clamp(26px,3vw,36px);max-width:600px;}
  .sec-desc{font-size:15px;color:var(--steel);max-width:420px;}

  /* About */
  .about{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .about-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;}
  .about-grid p{color:var(--steel);font-size:15.5px;margin-bottom:16px;}
  .adv-list{list-style:none;border-top:1px solid var(--line);}
  .adv-list li{
    display:flex;gap:16px;align-items:flex-start;
    padding:18px 0;border-bottom:1px solid var(--line);
  }
  .adv-list .idx{font-family:'IBM Plex Mono',monospace;color:var(--brand-mint);background:var(--brand-dark);
    width:28px;height:28px;flex:none;display:flex;align-items:center;justify-content:center;font-size:12px;}
  .adv-list .txt{font-size:14.5px;font-weight:500;padding-top:4px;}

  /* Products */
  .products{background:var(--paper);}
  .prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
  .prod-card{background:var(--white);padding:30px 26px;position:relative;}
  .prod-cat{font-size:11.5px;text-transform:uppercase;letter-spacing:0.08em;color:var(--brand);font-weight:600;margin-bottom:14px;}
  .prod-card h3{font-size:19px;margin-bottom:10px;}
  .prod-card p{font-size:13.8px;color:var(--steel);margin-bottom:18px;}
  .prod-link{font-size:13px;font-weight:600;color:var(--brand-dark);display:inline-flex;align-items:center;gap:6px;}
  .prod-link::after{content:"↗";font-size:12px;}
  @media (max-width:900px){ .prod-grid{grid-template-columns:1fr;} .about-grid{grid-template-columns:1fr;} }

  /* Process */
  .process{background:var(--brand-dark);color:var(--white);}
  .process .sec-title{color:var(--white);}
  .process .sec-desc{color:#b7cdc1;}
  .proc-row{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(143,217,182,.25);}
  .proc-item{padding:28px 22px 0;border-right:1px solid rgba(143,217,182,.25);}
  .proc-item:last-child{border-right:none;}
  .proc-num{font-family:'IBM Plex Mono',monospace;color:var(--brand-mint);font-size:13px;margin-bottom:14px;display:block;}
  .proc-item h4{font-size:16px;font-weight:600;margin-bottom:10px;}
  .proc-item p{font-size:13.5px;color:#b7cdc1;}
  @media (max-width:900px){ .proc-row{grid-template-columns:1fr 1fr;} }

  /* Projects */
  .projects{background:var(--white);border-top:1px solid var(--line);}
  .proj-tabs{display:flex;gap:0;border:1px solid var(--line);margin-bottom:0;width:fit-content;}
  .proj-tabs button{
    font-family:'IBM Plex Mono',monospace;font-size:13px;
    padding:9px 20px;background:none;border:none;cursor:pointer;color:var(--steel);
    border-right:1px solid var(--line);
  }
  .proj-tabs button:last-child{border-right:none;}
  .proj-tabs button.active{background:var(--brand-dark);color:var(--white);}
  .proj-table{width:100%;border-collapse:collapse;margin-top:0;border:1px solid var(--line);border-top:none;}
  .proj-table tr{border-top:1px solid var(--line);}
  .proj-table td{padding:18px 16px;font-size:14px;vertical-align:top;}
  .proj-table td.loc{width:150px;font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--brand);font-weight:500;}
  .proj-table td.name{width:230px;font-weight:600;}
  .proj-table td.desc{color:var(--steel);}
  .proj-year-group{display:none;}
  .proj-year-group.active{display:table-row-group;}

  /* Contact */
  .contact{background:var(--paper-dim);}
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;}
  .contact-info h2{font-size:clamp(24px,3vw,32px);margin-bottom:20px;max-width:420px;}
  .contact-info p{color:var(--steel);font-size:15px;margin-bottom:30px;max-width:400px;}
  .c-row{display:grid;grid-template-columns:110px 1fr;gap:14px;padding:14px 0;border-top:1px solid var(--line);font-size:14.5px;}
  .c-row:last-child{border-bottom:1px solid var(--line);}
  .c-row .k{font-size:11.5px;text-transform:uppercase;letter-spacing:0.06em;color:var(--brand);font-weight:600;padding-top:2px;}
  .c-row .v{font-weight:600;}
  .c-row .v small{display:block;font-weight:400;color:var(--steel);font-size:13px;margin-top:2px;}

  .cta-block{
    background:var(--brand-dark);color:var(--white);
    padding:34px;
    display:flex;flex-direction:column;gap:16px;
  }
  .cta-block h3{font-size:20px;margin-bottom:4px;}
  .cta-block p{font-size:13.5px;color:#b7cdc1;margin-bottom:6px;}
  .cta-buttons{display:flex;flex-direction:column;gap:10px;}
  .cta-buttons a,.cta-buttons button{
    text-align:left;
    padding:14px 18px;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.18);
    color:var(--white);
    font-size:13.5px;font-weight:600;
    cursor:pointer;
    font-family:inherit;
    display:flex;justify-content:space-between;align-items:center;
  }
  .cta-buttons a:hover,.cta-buttons button:hover{background:rgba(143,217,182,.14);border-color:var(--brand-mint);}
  .cta-buttons .arrow{color:var(--brand-mint);}

  /* Footer */
  footer{background:var(--brand-dark);color:#8fa89b;padding:34px 0;border-top:1px solid rgba(143,217,182,.15);}
  .foot-row{display:flex;justify-content:space-between;align-items:center;font-size:12.5px;flex-wrap:wrap;gap:12px;}

  @media (max-width:900px){
    .hero-inner{grid-template-columns:1fr;}
    .hero-stat-panel{border-left:none;border-top:1px solid rgba(143,217,182,.3);padding-left:0;padding-top:24px;}
    .proj-table td.name,.proj-table td.loc{width:auto;}
    .contact-grid{grid-template-columns:1fr;}
  }

/* ===== Catalog page ===== */
.cat-header{background:var(--brand-dark);color:var(--white);padding:48px 0 34px;}
.cat-header .sec-tag{color:var(--brand-mint);}
.cat-header h1{color:var(--white);font-size:clamp(26px,3.4vw,38px);max-width:640px;}
.cat-header p{color:#b7cdc1;font-size:14.5px;margin-top:14px;max-width:520px;}
.breadcrumb{font-size:12.5px;color:var(--steel);margin-bottom:14px;}
.breadcrumb a{color:var(--brand);}
.breadcrumb.on-dark{color:#b7cdc1;}
.breadcrumb.on-dark a{color:var(--brand-mint);}

.cat-layout{display:grid;grid-template-columns:250px 1fr;gap:40px;align-items:start;padding:44px 0 90px;}
.cat-nav{position:sticky;top:96px;border:1px solid var(--line);background:var(--white);}
.cat-nav a{
  display:flex;justify-content:space-between;
  padding:12px 16px;font-size:13.5px;border-bottom:1px solid var(--line);color:var(--ink);
}
.cat-nav a:last-child{border-bottom:none;}
.cat-nav a:hover,.cat-nav a.active{background:var(--paper-dim);color:var(--brand-dark);font-weight:600;}
.cat-nav a span{color:var(--steel);font-family:'IBM Plex Mono',monospace;font-size:12px;}
.cat-nav a.active span{color:var(--brand);}

.cat-search{display:flex;gap:0;margin-bottom:28px;border:1px solid var(--line);}
.cat-search input{
  flex:1;border:none;padding:13px 16px;font-family:inherit;font-size:14px;background:var(--white);outline:none;
}
.cat-search .count{
  padding:13px 16px;font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--steel);
  border-left:1px solid var(--line);background:var(--paper-dim);white-space:nowrap;
}

.cat-group-title{
  font-family:'IBM Plex Sans Condensed',sans-serif;font-weight:700;font-size:20px;
  margin:36px 0 4px;padding-top:20px;border-top:1px solid var(--line);
}
.cat-group-title:first-child{border-top:none;padding-top:0;margin-top:0;}
.cat-group-desc{font-size:13.5px;color:var(--steel);margin-bottom:18px;max-width:560px;}

.item-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.item-card{
  background:var(--white);padding:20px 20px 18px;display:flex;flex-direction:column;gap:8px;
  cursor:pointer;
}
.item-card:hover{background:var(--paper-dim);}
.item-sku{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--steel);}
.item-name{font-size:15px;font-weight:600;line-height:1.3;}
.item-spec{font-size:12.5px;color:var(--steel);}
.item-spec b{color:var(--ink);font-weight:600;}
.item-tag{
  font-size:11px;font-weight:600;color:var(--brand);letter-spacing:0.03em;text-transform:uppercase;
}
@media (max-width:900px){
  .cat-layout{grid-template-columns:1fr;}
  .cat-nav{position:static;}
  .item-grid{grid-template-columns:1fr;}
}

/* ===== Product detail page ===== */
.prod-hero{background:var(--white);border-bottom:1px solid var(--line);padding:34px 0 40px;}
.prod-hero-top{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap;}
.prod-title{font-size:clamp(26px,3.2vw,38px);margin:6px 0 10px;}
.prod-sub{font-size:14.5px;color:var(--steel);max-width:600px;}
.prod-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px;}
.pill{
  font-family:'IBM Plex Mono',monospace;font-size:12px;
  padding:6px 12px;border:1px solid var(--line);color:var(--steel);
}
.prod-cta-col{display:flex;flex-direction:column;gap:10px;min-width:220px;}

.spec-table{width:100%;border-collapse:collapse;border:1px solid var(--line);}
.spec-table tr{border-top:1px solid var(--line);}
.spec-table tr:first-child{border-top:none;}
.spec-table td{padding:13px 16px;font-size:14px;}
.spec-table td.k{width:280px;color:var(--steel);background:var(--paper-dim);font-weight:500;}
.spec-table td.v{font-weight:600;}

.detail-section{padding:40px 0;border-top:1px solid var(--line);}
.detail-section:first-of-type{border-top:none;}
.detail-section h2{font-size:20px;margin-bottom:18px;}
.detail-two{display:grid;grid-template-columns:2fr 1fr;gap:48px;}
@media (max-width:900px){.detail-two{grid-template-columns:1fr;}}

.tag-list{display:flex;flex-wrap:wrap;gap:8px;}
.tag-list span{
  font-size:12.5px;padding:7px 12px;background:var(--paper-dim);border:1px solid var(--line);color:var(--ink);
}

.related-strip{display:flex;gap:1px;background:var(--line);border:1px solid var(--line);overflow-x:auto;}
.related-strip a{
  background:var(--white);min-width:210px;padding:16px;font-size:13px;flex:none;
}
.related-strip a:hover{background:var(--paper-dim);}
.related-strip .rs-cat{font-size:10.5px;color:var(--brand);text-transform:uppercase;letter-spacing:0.05em;margin-bottom:6px;font-weight:600;}
.related-strip .rs-name{font-weight:600;font-size:13.5px;}

.not-found{padding:100px 0;text-align:center;}
.not-found h1{font-size:26px;margin-bottom:12px;}
.not-found p{color:var(--steel);margin-bottom:24px;}