:root{
    --c-dark: #212C2C;   /* Dark gray-green */
    --c-green: #2C5959;  /* Deep green */
    --c-red: #D32137;    /* Red */
    --c-white: #FFFFFF;  /* White */
    --c-light: #DEDEDE;  /* Light gray */
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Inter Tight', sans-serif;
    background:var(--c-white);
    color:var(--c-dark);
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  h1, h2, h3, h4, .brandmark{
    font-weight:700;
    letter-spacing:-0.02em;
    color:var(--c-dark);
  }
  .eyebrow{
    font-size:0.75rem;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:var(--c-green);
    font-weight:600;
    margin-bottom: 8px;
    display: block;
  }
  a{ color:inherit; text-decoration:none; }
  img{ max-width:100%; display:block; }
  .wrap{ max-width:1180px; margin:0 auto; padding:0 24px; }
  section{ padding:80px 0; }
  @media(max-width:720px){ section{ padding:52px 0; } }

  a:focus-visible, button:focus-visible, .btn:focus-visible{
    outline:2px solid var(--c-red);
    outline-offset:2px;
  }

  /* ---------- Top bar ---------- */
  .topbar{
    background:var(--c-dark);
    color:var(--c-light);
    font-size:0.8rem;
    font-weight: 500;
  }
  .topbar .wrap{
    display:flex; justify-content:space-between; align-items:center;
    padding:8px 24px; gap:12px; flex-wrap:wrap;
  }
  .topbar a{ color:var(--c-red); font-weight: 600; }
  .topbar .certs{ letter-spacing:0.04em; opacity:0.9; }

  /* ---------- Header (Hero with Video) ---------- */
  header.hero{
    position:relative;
    overflow:hidden;
    color:var(--c-white);
  }
  .hero-video {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    z-index: 0;
    filter: contrast(1.15) brightness(1.05) saturate(1.1);
  }
  .hero-overlay {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(to right, rgba(33, 44, 44, 0.9) 0%, rgba(33, 44, 44, 0.7) 40%, rgba(33, 44, 44, 0.2) 100%);
    z-index: 1;
  }
  .hero .wrap {
    position: relative;
    z-index: 2;
  }

  .brandrow{
    display:flex; align-items:center; justify-content:space-between;
    padding:20px 0 6px;
    flex-wrap: wrap;
    gap: 20px;
  }
  .main-nav ul {
    list-style: none;
    display: flex;
    gap: 28px;
    align-items: center;
  }
  .main-nav a {
    color: var(--c-white);
    font-weight: 600;
    font-size: 0.95rem;
    transition: color 0.2s;
  }
  .main-nav a:hover {
    color: var(--c-red);
  }
  @media(max-width: 768px) {
    .main-nav ul { gap: 14px; flex-wrap: wrap; }
    .main-nav a { font-size: 0.9rem; }
  }
  .brandmark{
    font-size:1.35rem;
    letter-spacing:0.02em;
    color: var(--c-white);
  }
  .brandmark .accent{ color:var(--c-red); }
  .brand-sub{
    font-size:0.7rem;
    color:var(--c-light);
    letter-spacing:0.06em;
    margin-top:2px;
    text-transform: uppercase;
  }
  .hero-inner{
    padding:60px 0 80px;
    max-width:780px;
  }
  .hero h1{
    font-size:clamp(2.5rem, 5vw, 3.8rem);
    line-height:1.1;
    margin:16px 0 20px;
    color:var(--c-white);
  }
  .hero h1 .accent{ color:var(--c-red); }
  .hero p.lead{
    font-size:1.15rem;
    color:var(--c-light);
    max-width:62ch;
    margin-bottom:34px;
    font-weight: 400;
  }
  .cta-row{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-bottom:14px; }
  .btn{
    display:inline-flex; align-items:center; gap:9px;
    padding:14px 28px;
    border-radius:4px;
    font-weight:600;
    font-size:1rem;
    cursor:pointer;
    transition:all .15s ease;
    border:1.5px solid transparent;
    white-space:nowrap;
  }
  .btn:hover{ transform:translateY(-2px); }
  .btn-primary{ background:var(--c-red); color:var(--c-white); }
  .btn-primary:hover{ background:#b81d30; box-shadow: 0 4px 12px rgba(211,33,55,0.3); }
  .btn-outline{ border-color:var(--c-light); color:var(--c-white); }
  .btn-outline:hover{ border-color:var(--c-white); background:rgba(255,255,255,0.1); }
  
  .link-scroll{
    font-size:0.95rem; color:var(--c-light); font-weight:500;
    border-bottom:1px solid var(--c-light); padding-bottom:2px;
    margin-left: 12px;
  }
  .link-scroll:hover{ color:var(--c-white); border-color:var(--c-white); }
  .microcopy{ font-size:0.82rem; color:var(--c-light); opacity: 0.8; font-weight: 500; margin-top: 20px;}

  /* ---------- Sector strip ---------- */
  .sectorstrip{
    background:var(--c-light);
    border-bottom:1px solid rgba(33,44,44,0.1);
  }
  .sectorstrip .wrap{ padding:20px 24px; }
  .sectorstrip-grid{
    display:grid;
    grid-template-columns:repeat(7, 1fr);
    gap:1px;
    background:rgba(33,44,44,0.1);
    border:1px solid rgba(33,44,44,0.1);
  }
  @media(max-width:900px){ .sectorstrip-grid{ grid-template-columns:repeat(4,1fr); } }
  @media(max-width:560px){ .sectorstrip-grid{ grid-template-columns:repeat(2,1fr); } }
  .sector-item{
    background:var(--c-light);
    padding:16px 10px;
    text-align:center;
    font-size:0.75rem;
    font-weight: 600;
    letter-spacing:0.03em;
    color:var(--c-dark);
    line-height:1.4;
  }

  /* ---------- Section head pattern ---------- */
  .section-head{ max-width:720px; margin-bottom:48px; }
  .section-head h2{ font-size:clamp(1.8rem, 3.5vw, 2.5rem); line-height:1.15; }
  .section-head p{ color:var(--c-dark); opacity: 0.8; margin-top:16px; font-size:1.05rem; max-width:64ch; }

  /* ---------- Mechanism section ---------- */
  .mechanism{ background:var(--c-white); }
  .mech-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:54px;
    align-items:center;
  }
  @media(max-width:860px){ .mech-grid{ grid-template-columns:1fr; } }
  .mech-diagram{
    aspect-ratio:4/3;
    background:var(--c-light);
    border-radius:6px;
    position:relative;
    overflow:hidden;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .mech-list{ list-style:none; display:grid; gap:16px; margin-top:12px; }
  .mech-list li{
    display:flex; gap:14px; align-items:flex-start;
    font-size:1rem;
    font-weight: 500;
  }
  .mech-list .chip{
    font-size:0.75rem;
    background:var(--c-green);
    color:var(--c-white);
    padding:4px 8px;
    border-radius:4px;
    flex-shrink:0;
    margin-top:2px;
    font-weight: 600;
  }

  /* ---------- Product spec cards ---------- */
  .products{ background:var(--c-light); }
  .product-card{
    background:var(--c-white);
    border:1px solid rgba(33,44,44,0.1);
    border-radius:6px;
    margin-bottom:32px;
    overflow:hidden;
    box-shadow: 0 4px 20px rgba(0,0,0,0.03);
  }
  .product-head{
    display:flex; justify-content:space-between; align-items:flex-start;
    gap:20px;
    padding:28px 32px;
    background:var(--c-dark);
    color:var(--c-white);
    flex-wrap:wrap;
  }
  .product-head .name{
    font-size:1.5rem;
    font-weight:700;
    color: var(--c-white);
  }
  .product-head .code{
    font-size:0.75rem;
    color:var(--c-red);
    letter-spacing:0.08em;
    font-weight: 700;
    margin-bottom:8px;
    display:block;
    text-transform: uppercase;
  }
  .throat-dial{
    display:flex; flex-direction:column; align-items:flex-end;
  }
  .throat-dial .val{ font-size:1.2rem; color:var(--c-red); font-weight:700; }
  .throat-dial .lbl{ font-size:0.65rem; color:var(--c-light); letter-spacing:0.06em; text-transform:uppercase; font-weight: 600;}

  .product-body{
    display:grid;
    grid-template-columns:1fr 1.3fr;
    gap:0;
  }
  @media(max-width:900px){ .product-body{ grid-template-columns:1fr; } }
  .product-visual{
    background:var(--c-white);
    padding:32px;
    display:flex;
    flex-direction: column;
    align-items:center;
    justify-content:center;
    border-right:1px solid rgba(33,44,44,0.1);
    gap: 20px;
  }
  .product-visual img {
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  }
  @media(max-width:900px){ .product-visual{ border-right:none; border-bottom:1px solid rgba(33,44,44,0.1); } }

  .product-detail{ padding:32px; }
  .product-detail .overview{ font-size:1.05rem; opacity:0.85; margin-bottom:24px; font-weight: 500;}

  .spec-table{ width:100%; border-collapse:collapse; margin-bottom:24px; }
  .spec-table tr{ border-bottom:1px solid rgba(33,44,44,0.1); }
  .spec-table tr:last-child{ border-bottom:none; }
  .spec-table td{ padding:10px 0; font-size:0.9rem; vertical-align:top; }
  .spec-table td:first-child{
    color:var(--c-green);
    font-weight:600;
    width:35%;
    padding-right:16px;
    font-size:0.8rem;
    letter-spacing:0.02em;
    text-transform: uppercase;
  }
  .adv-list{ list-style:none; display:grid; gap:10px; margin-bottom:24px; }
  .adv-list li{
    font-size:0.95rem; color:var(--c-dark);
    display:flex; gap:10px; align-items:flex-start;
    font-weight: 500;
  }
  .adv-list li::before{
    content:'→';
    color:var(--c-red);
    font-weight:700;
    flex-shrink:0;
  }
  .product-cta{
    display:inline-flex; align-items:center; gap:8px;
    font-weight:700; font-size:0.95rem;
    color:var(--c-dark);
    border-bottom:2px solid var(--c-red);
    padding-bottom:2px;
    cursor:pointer;
    transition: color 0.2s ease;
  }
  .product-cta:hover{ color:var(--c-red); }

  /* ---------- Applications ---------- */
  .applications{ background:var(--c-white); }
  .app-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:24px;
  }
  @media(max-width:760px){ .app-grid{ grid-template-columns:1fr; } }
  .app-card{
    background:var(--c-light);
    border-radius: 6px;
    padding:32px;
    display: flex;
    flex-direction: column;
  }
  .app-card-img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-radius: 4px;
    margin-bottom: 20px;
  }
  .app-card h4{
    font-size:1.15rem;
    margin-bottom:12px;
    display:flex; align-items:center; gap:12px;
  }
  .app-card h4 .idx{
    font-size:0.75rem;
    color:var(--c-white);
    background:var(--c-red);
    padding:4px 8px;
    border-radius:4px;
    font-weight: 700;
  }
  .app-card p{ font-size:1rem; opacity:0.85; font-weight: 500; }

  /* ---------- Why ---------- */
  .why{ background:var(--c-green); color:var(--c-white); }
  .why .section-head h2{ color:var(--c-white); }
  .why .section-head p{ color:var(--c-light); }
  .why-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(240px,1fr));
    gap:20px;
    margin-top:40px;
  }
  .why-card{
    background:rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.1);
    padding:28px;
    border-radius: 6px;
  }
  .why-card .num{
    font-size:0.85rem;
    color:var(--c-red);
    font-weight: 700;
    margin-bottom:12px;
    display:block;
  }
  .why-card h4{ font-size:1.1rem; margin-bottom:10px; color:var(--c-white); }
  .why-card p{ font-size:0.95rem; color:var(--c-light); opacity: 0.9; }

  /* ---------- Form section ---------- */
  .formsection{ background:var(--c-light); }
  .form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:54px;
  }
  @media(max-width:860px){ .form-grid{ grid-template-columns:1fr; } }
  .form-intro h3{
    font-size:1.8rem;
    margin-bottom:16px;
  }
  .form-intro p{ opacity:0.85; font-size:1.05rem; margin-bottom:28px; font-weight: 500; }
  .call-box{
    background:var(--c-dark); color:var(--c-white);
    padding:32px; border-radius:6px;
  }
  .call-box .eyebrow{ color:var(--c-red); margin-bottom:12px; }
  .call-box p{ color:var(--c-light); font-size:1rem; margin-bottom:24px; font-weight: 500;}

  .form-card{
    background:var(--c-white);
    border:1px solid rgba(33,44,44,0.1);
    border-radius:6px;
    padding:36px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.03);
  }
  .form-card h3{ font-size:1.6rem; margin-bottom:8px; }
  .form-card .sub{ font-size:0.95rem; opacity:0.75; margin-bottom:24px; font-weight: 500;}
  .field-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
  @media(max-width:500px){ .field-row{ grid-template-columns:1fr; } }
  .field{ display:flex; flex-direction:column; gap:8px; }
  .field label{
    font-size:0.75rem;
    letter-spacing:0.04em;
    color:var(--c-dark);
    font-weight: 600;
    text-transform:uppercase;
  }
  .field input, .field select, .field textarea{
    border:1px solid rgba(33,44,44,0.2);
    background:var(--c-white);
    padding:12px 14px;
    font-family:'Inter Tight',sans-serif;
    font-size:0.95rem;
    border-radius:4px;
    color:var(--c-dark);
    font-weight: 500;
  }
  .field input:focus, .field select:focus, .field textarea:focus{
    outline:none; border-color:var(--c-green); box-shadow: 0 0 0 3px rgba(44,89,89,0.1);
  }
  .field textarea{ resize:vertical; min-height:80px; }
  .submit-btn{
    width:100%;
    background:var(--c-red);
    color:var(--c-white);
    border:none;
    padding:16px;
    font-weight:700;
    font-size:1.05rem;
    border-radius:4px;
    cursor:pointer;
    margin-top:10px;
    transition:all .15s ease;
  }
  .submit-btn:hover{ background:#b81d30; box-shadow: 0 4px 12px rgba(211,33,55,0.3);}
  .form-note{
    font-size:0.75rem; opacity:0.6; margin-top:14px;
    font-weight: 600; text-transform: uppercase; text-align: center;
  }

  /* ---------- Final CTA ---------- */
  .final-cta{ background:var(--c-dark); color:var(--c-white); text-align:center; padding: 100px 0;}
  .final-cta h2{ color:var(--c-white); font-size:clamp(1.8rem, 4vw, 2.8rem); }
  .final-cta p{ color:var(--c-light); margin:18px 0 36px; font-size:1.15rem; font-weight: 500;}
  .final-cta .cta-row{ justify-content:center; }

  /* ---------- Footer ---------- */
  footer{ background:#161d1d; color:var(--c-light); padding:54px 0 100px; font-size:0.9rem; }
  .footer-grid{
    display:flex; justify-content:space-between; flex-wrap:wrap; gap:32px;
    padding-bottom:32px; margin-bottom:24px;
    border-bottom:1px solid rgba(255,255,255,0.08);
  }
  .footer-brand{ max-width:340px; }
  .footer-brand .brandmark{ font-size:1.2rem; color: var(--c-white); }
  .footer-brand p{ margin-top:12px; color:rgba(222,222,222,0.7); font-size:0.9rem; }
  .footer-col h5{
    font-size:0.8rem; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--c-red); margin-bottom:16px; font-weight: 700;
  }
  .footer-col a{ display:block; margin-bottom:10px; color:rgba(222,222,222,0.8); font-weight: 500;}
  .footer-col a:hover{ color:var(--c-white); }
  .footer-bottom{
    display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
    font-size:0.8rem; color:rgba(222,222,222,0.6); font-weight: 500;
  }

  /* ---------- Sticky mobile bar ---------- */
  .sticky-bar{
    position:fixed; left:0; right:0; bottom:0;
    display:none; z-index:50;
    background:var(--c-dark);
    border-top:1px solid rgba(255,255,255,0.1);
  }
  .sticky-bar .row{ display:flex; }
  .sticky-bar a{
    flex:1; text-align:center; padding:16px 8px;
    font-weight:700; font-size:0.95rem;
    display:flex; align-items:center; justify-content:center; gap:8px;
  }
  .sticky-bar a.call{ background:var(--c-red); color:var(--c-white); }
  .sticky-bar a.wa{ background:#25D366; color:#0b3d20; }
  .sticky-bar a.form{ background:var(--c-green); color:var(--c-white); }
  @media(max-width:720px){
    .sticky-bar{ display:block; }
    section:last-of-type{ padding-bottom:104px; }
  }