:root{
    --black:#0A0A0A;
    --paper:#FFFFFF;
    --soft:#F5F6F4;
    --text:#1B211E;
    --muted:#6E756C;
    --line:#E2E6DF;
    --line-dark:#262A26;
    --green:#68B04E;
    --green-dark:#4B8C34;
    --navy-1:#0A1622;
    --navy-2:#13334E;
    --max:1180px;
    --display:"Spectral",Georgia,"Times New Roman",serif;
    --body:"Lato","Helvetica Neue",Arial,sans-serif;
    color-scheme:light;
  }

  *{box-sizing:border-box}
  body{
    margin:0;background:var(--paper);color:var(--text);
    font-family:var(--body);font-size:16.5px;line-height:1.7;font-weight:400;
    -webkit-font-smoothing:antialiased;
  }
  a{color:inherit}
  h1,h2,h3,h4{margin:0;font-family:var(--display);font-weight:500;text-wrap:balance}
  p{margin:0}
  sup{font-size:.7em;line-height:0}
  em.g{font-style:normal;color:var(--green)}

  .wrap{max-width:var(--max);margin-inline:auto;padding-inline:24px}

  /* ---------- header ---------- */
  .site-head{
    position:sticky;top:env(safe-area-inset-top, 0px);z-index:30;
    background:var(--black);border-bottom:1px solid var(--line-dark);
  }
  .head-inner{
    display:flex;align-items:center;justify-content:space-between;
    gap:18px;flex-wrap:wrap;min-height:66px;
  }
  .brand{display:flex;align-items:center;gap:9px;text-decoration:none;flex:0 0 auto;padding-block:10px}
  .brand-mark{width:26px;height:26px;display:block;object-fit:contain}
  .brand-name{
    font-family:var(--body);font-weight:700;font-size:19px;
    letter-spacing:.14em;text-transform:uppercase;color:#fff;
  }
  .site-nav{display:flex;flex-wrap:wrap;align-self:stretch;align-items:stretch}
  .site-nav a{
    display:flex;align-items:center;padding:0 16px;
    font-size:12.5px;font-weight:400;letter-spacing:.04em;
    color:#EDEFEB;text-decoration:none;min-height:66px;
    transition:background .15s ease,color .15s ease;
  }
  .site-nav a:hover{color:#fff;background:#161A16}
  .site-nav a[aria-current="page"]{background:var(--green);color:#fff}
  @media (max-width:820px){
    .head-inner{min-height:0;padding-block:8px}
    .site-nav{width:100%;border-top:1px solid var(--line-dark)}
    .site-nav a{min-height:44px;padding:0 12px 0 0;font-size:12px}
    .site-nav a[aria-current="page"]{background:transparent;color:var(--green)}
  }

  /* ---------- shared ---------- */
  .page{display:none}
  .page.is-active{display:block}
  .sec{padding-block:clamp(56px,6.5vw,92px)}
  .eyebrow{
    font-size:11.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
    color:var(--green);margin-bottom:16px;
  }
  .btn{
    display:inline-flex;align-items:center;justify-content:center;
    font-family:var(--body);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
    text-decoration:none;padding:14px 28px;border:1px solid var(--green);
    background:var(--green);color:#fff;transition:background .15s ease,border-color .15s ease;
  }
  .btn:hover{background:var(--green-dark);border-color:var(--green-dark)}
  .btn-line{background:transparent;border-color:rgba(255,255,255,.4);color:#fff}
  .btn-line:hover{background:rgba(255,255,255,.08);border-color:#fff}
  .btn-dark{background:transparent;border-color:var(--line);color:var(--text)}
  .btn-dark:hover{background:var(--soft);border-color:var(--muted)}
  .cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}

  /* ---------- hero ---------- */
  .hero{position:relative;overflow:hidden;background:var(--paper);padding-top:clamp(40px,5vw,72px);padding-bottom:0}
  .hero .mesh-layer{
    position:absolute;top:0;right:0;width:62%;height:100%;z-index:0;
    background-size:cover;background-position:center right;
    filter:grayscale(1) contrast(1.02);opacity:.9;
    -webkit-mask-image:radial-gradient(125% 105% at 78% 42%, #000 30%, rgba(0,0,0,.6) 62%, rgba(0,0,0,0) 86%);
    mask-image:radial-gradient(125% 105% at 78% 42%, #000 30%, rgba(0,0,0,.6) 62%, rgba(0,0,0,0) 86%);
    pointer-events:none;
  }
  .hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(24px,3.5vw,56px);align-items:end}
  .hero-copy{padding-bottom:clamp(46px,6vw,88px)}
  .hero h1{font-size:clamp(38px,5.4vw,60px);line-height:1.14;letter-spacing:-.01em;max-width:15ch}
  .hero .sub{margin-top:20px;color:var(--muted);font-size:17px;max-width:46ch;line-height:1.75}
  .hero-fig{margin:0;display:flex;justify-content:center;align-items:flex-end}
  .hero-fig .portrait{
    display:block;width:auto;height:clamp(300px,37vw,520px);max-width:100%;
    object-fit:contain;object-position:bottom;
  }
  @media (max-width:880px){
    .hero-grid{grid-template-columns:1fr;gap:8px}
    .hero-copy{padding-bottom:12px}
    .hero .mesh-layer{width:100%;opacity:.55;
      -webkit-mask-image:radial-gradient(120% 70% at 62% 78%, #000 25%, rgba(0,0,0,.5) 58%, rgba(0,0,0,0) 85%);
      mask-image:radial-gradient(120% 70% at 62% 78%, #000 25%, rgba(0,0,0,.5) 58%, rgba(0,0,0,0) 85%);}
    .hero-fig .portrait{height:clamp(260px,62vw,380px)}
  }

  /* ---------- black band ---------- */
  .black-band{background:var(--black);color:#F2F4F0}
  .black-band .inner{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(24px,4vw,64px);align-items:center;padding-block:clamp(46px,5vw,72px)}
  @media (max-width:860px){ .black-band .inner{grid-template-columns:1fr;gap:20px} }
  .black-band h2{font-size:clamp(26px,3.2vw,38px);line-height:1.2;color:#fff;max-width:16ch}
  .black-band p{color:#AFB6AC;font-size:16px;max-width:60ch}

  /* ---------- page banner ---------- */
  .banner{
    position:relative;overflow:hidden;
    background:linear-gradient(135deg,var(--navy-1) 0%,var(--navy-2) 55%,#0B1B2A 100%);
    color:#fff;text-align:center;
  }
  .banner .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.16;filter:grayscale(1) invert(1)}
  .banner .inner{position:relative;padding-block:clamp(58px,7vw,104px)}
  .banner h1{font-size:clamp(34px,4.8vw,54px);line-height:1.12;color:#fff;margin-inline:auto;max-width:20ch}
  .banner .eyebrow{color:#9FD189}
  .banner p{margin:18px auto 0;color:#C9D3DA;max-width:62ch;font-size:17px}

  /* ---------- generic section heads ---------- */
  .sec-head{margin-bottom:34px}
  .sec-head h2{font-size:clamp(26px,3.2vw,38px);line-height:1.2;max-width:22ch}
  .sec-head p{margin-top:14px;color:var(--muted);max-width:62ch}
  .soft{background:var(--soft)}

  /* ---------- probe index ---------- */
  .index-row{
    display:grid;grid-template-columns:170px minmax(0,1fr) 150px;
    gap:clamp(14px,3vw,36px);align-items:baseline;
    padding-block:18px;border-top:1px solid var(--line);
  }
  .index-row:last-of-type{border-bottom:1px solid var(--line)}
  @media (max-width:700px){ .index-row{grid-template-columns:1fr;gap:4px;padding-block:15px} }
  .index-row .name{font-family:var(--display);font-size:20px;font-weight:500}
  .index-row .what{color:var(--muted);font-size:15.5px}
  .index-row .measures{font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--green)}

  /* ---------- probe entries ---------- */
  .probe{
    display:grid;grid-template-columns:minmax(0,1fr) 270px;
    gap:clamp(20px,4vw,52px);align-items:start;
    padding-block:38px;border-top:1px solid var(--line);
  }
  .probe:last-of-type{border-bottom:1px solid var(--line)}
  @media (max-width:780px){ .probe{grid-template-columns:1fr;gap:22px} }
  .probe .head{display:flex;flex-wrap:wrap;align-items:baseline;gap:14px}
  .probe h3{font-size:26px;line-height:1.2}
  .probe .analyte{font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--green)}
  .probe p{color:var(--muted);margin-top:12px;max-width:58ch}
  .meta{margin-top:18px;display:flex;flex-direction:column;gap:8px}
  .meta div{display:flex;gap:14px;flex-wrap:wrap;font-size:15px}
  .meta .k{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);min-width:108px;padding-top:4px}
  .meta .v{color:var(--text);flex:1;min-width:220px}
  .meta .v a{color:var(--green-dark);text-decoration:none;border-bottom:1px solid rgba(75,140,52,.35)}
  .meta .v a:hover{border-bottom-color:var(--green-dark)}
  .frame{background:#000;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:10px}
  .frame img{max-width:100%;max-height:100%;width:auto;height:auto;display:block}
  .probe figure{margin:0;display:flex;flex-direction:column;gap:9px}
  .probe figcaption{font-size:12px;color:var(--muted);line-height:1.55}

  /* ---------- assays block ---------- */
  .assay-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(26px,4.5vw,64px);align-items:start}
  @media (max-width:860px){ .assay-grid{grid-template-columns:1fr;gap:26px} }
  .assay-grid h2{font-size:clamp(26px,3.2vw,38px);line-height:1.2}
  .assay-grid p{color:var(--muted)}
  .compartments{display:flex;flex-direction:column;margin-top:26px;border-top:1px solid var(--line)}
  .compartment{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-block:13px;border-bottom:1px solid var(--line)}
  .compartment span:first-child{font-family:var(--display);font-size:17px}
  .compartment span:last-child{font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--green)}

  /* ---------- features ---------- */
  .features{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:clamp(24px,3.5vw,44px)}
  .feature h3{font-size:22px;line-height:1.25;margin-top:8px}
  .feature .kicker{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--green)}
  .feature p{color:var(--muted);font-size:15.5px;margin-top:10px}

  /* ---------- publications ---------- */
  .pub{display:grid;grid-template-columns:80px minmax(0,1fr);gap:clamp(14px,3vw,32px);padding-block:22px;border-top:1px solid var(--line)}
  .pub:last-of-type{border-bottom:1px solid var(--line)}
  @media (max-width:640px){ .pub{grid-template-columns:1fr;gap:6px} }
  .pub .yr{font-size:14px;font-weight:700;color:var(--green);font-variant-numeric:tabular-nums}
  .pub .title{font-family:var(--display);font-size:19px;line-height:1.35}
  .pub .jrnl{color:var(--muted);font-size:14.5px;margin-top:5px}
  .pub a{color:var(--green-dark);text-decoration:none;border-bottom:1px solid rgba(75,140,52,.35)}
  .pub a:hover{border-bottom-color:var(--green-dark)}

  /* ---------- contact ---------- */
  .contact-card{
    background:var(--paper);border:1px solid var(--line);
    padding:clamp(28px,4vw,56px);margin-top:-60px;position:relative;z-index:2;
  }
  @media (max-width:700px){ .contact-card{margin-top:-30px} }
  .contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(26px,4vw,52px)}
  .contact-grid h3{font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-family:var(--body)}
  .contact-grid p{margin-top:12px;font-size:16px;line-height:1.75;color:var(--text)}
  .contact-link{
    display:inline-block;margin-top:10px;font-family:var(--display);font-size:clamp(20px,2.3vw,25px);
    color:var(--text);text-decoration:none;border-bottom:2px solid var(--green);padding-bottom:3px;
  }
  .contact-link:hover{color:var(--green-dark)}

  /* ---------- cta band ---------- */
  .cta-band{
    position:relative;overflow:hidden;text-align:center;color:#fff;
    background:linear-gradient(135deg,var(--navy-1) 0%,var(--navy-2) 55%,#0B1B2A 100%);
  }
  .cta-band .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.14;filter:grayscale(1) invert(1)}
  .cta-band .inner{position:relative;padding-block:clamp(50px,6vw,84px)}
  .cta-band h2{font-size:clamp(24px,3vw,34px);line-height:1.25;color:#fff;margin-inline:auto;max-width:26ch}
  .cta-band .btn{margin-top:26px}

  /* ---------- footer ---------- */
  footer{background:var(--black);color:#D7DCD4}
  .foot-inner{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1.2fr);gap:clamp(26px,4vw,56px);padding-block:52px}
  @media (max-width:800px){ .foot-inner{grid-template-columns:1fr;gap:30px} }
  .foot-brand{display:flex;align-items:center;gap:9px;margin-bottom:16px}
  .foot-brand .brand-name{font-size:17px}
  .foot-inner h4{font-family:var(--body);font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#fff;margin:0 0 14px}
  .foot-inner p{color:#A7AEA4;font-size:14.5px;line-height:1.75;max-width:44ch}
  .foot-links{display:flex;flex-direction:column;gap:9px}
  .foot-links a,.foot-links span{color:#A7AEA4;font-size:14.5px;text-decoration:none}
  .foot-links a:hover{color:var(--green)}
  .foot-bottom{
    border-top:1px solid var(--line-dark);padding-block:20px;
    font-size:12px;letter-spacing:.06em;color:#767C73;
    display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;
  }

  .mesh-src{}
  .hero .mesh-layer,.banner .bg,.cta-band .bg{background-image:url("assets/mesh.jpg");background-size:cover;background-position:center}
  :where(a,button):focus-visible{outline:2px solid var(--green);outline-offset:3px}
  @media (prefers-reduced-motion: reduce){ *{transition:none !important;animation:none !important} }