/* ============================================================
     DESIGN PLAN
     Layout: hash-routed single-file site (#home #services #about
     #noise-exposure #osha-1910-95 #industries #service-areas #quiz
     #faq #contact #privacy). Persistent dark header + footer; each
     view alternates dark charcoal bands (hero/CTA, white text, sage
     accent) with light reading bands (white or ivory, dark text) --
     a deliberate single-theme brand identity, not a light/dark OS
     toggle, so colors are hardcoded rather than media-queried.
     The icon mark is cropped from the client's real logo file; the
     wordmark is live Montserrat text (crisp, accessible, indexable)
     rather than a rasterized copy of the logo text.
     ============================================================ */
  :root{
    --charcoal:#303032;
    --charcoal-raise:#3b3b3e;
    --white:#ffffff;
    --ivory:#f2efe4;
    --sage:#93ae63;
    --sage-dark:#698042;
    --sage-tint:#becea1;
    --sage-wash:#e8eedd;
    --ink:#1e1e1f;
    --ink-muted:#5f5f63;
    --line-on-dark:rgba(255,255,255,.16);
    --line-on-light:#d8d8da;
    --fg-on-dark-muted:#b7b7ba;
    --font-display:'Montserrat',Arial,Helvetica,sans-serif;
    --font-body:'Montserrat',Arial,Helvetica,sans-serif;
    --max:1180px;
    --gutter-l:max(20px, env(safe-area-inset-left, 0px));
    --gutter-r:max(20px, env(safe-area-inset-right, 0px));
    color-scheme: dark;
  }

  *,*::before,*::after{box-sizing:border-box}
  html,body{margin:0;padding:0}
  body{
    background:var(--charcoal);
    color:var(--white);
    font-family:var(--font-body);
    font-weight:400;
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
  }
  img{max-width:100%;display:block}
  a{color:inherit}
  h1,h2,h3,h4{margin:0;font-family:var(--font-display);font-weight:100;text-wrap:balance}
  p{margin:0}
  button{font-family:inherit}
  ::selection{background:var(--sage);color:var(--charcoal)}

  .wrap{
    max-width:var(--max);
    margin:0 auto;
    padding-left:var(--gutter-l);
    padding-right:var(--gutter-r);
  }

  .eyebrow{
    display:flex;align-items:center;gap:14px;
    font-size:12.5px;letter-spacing:.28em;text-transform:uppercase;
    font-weight:600;color:var(--sage);
    margin-bottom:18px;
  }
  .eyebrow::before,.eyebrow::after{content:"";flex:0 0 28px;height:1px;background:var(--sage)}
  .eyebrow.center{justify-content:center}
  .on-light .eyebrow{color:var(--sage-dark)}

  .band{padding-block:clamp(56px,9vw,112px)}
  .band.tight{padding-block:clamp(40px,6vw,72px)}
  .on-dark{background:var(--charcoal);color:var(--white)}
  .on-dark-raise{background:var(--charcoal-raise);color:var(--white)}
  .on-light{background:var(--white);color:var(--ink)}
  .on-tint{background:var(--ivory);color:var(--ink)}
  .on-light p, .on-tint p, .on-light li, .on-tint li{color:var(--ink)}
  .muted-on-dark{color:var(--fg-on-dark-muted)}
  .muted-on-light{color:var(--ink-muted)}

  .h-display{font-size:clamp(34px,5.6vw,60px);line-height:1.06;letter-spacing:-.01em}
  .h-section{font-size:clamp(26px,3.6vw,38px);line-height:1.12;font-weight:100}
  .h-card{font-size:19px;font-weight:600;font-family:var(--font-body)}
  .lede{font-size:clamp(17px,2vw,20px);font-weight:300;max-width:62ch}
  .body-copy{font-size:16.5px;max-width:65ch}
  .body-copy + .body-copy{margin-top:16px}

  .btn{
    display:inline-flex;align-items:center;gap:10px;
    font-family:var(--font-body);font-weight:600;font-size:14.5px;
    letter-spacing:.02em;
    padding:14px 28px;border-radius:999px;border:1px solid transparent;
    cursor:pointer;text-decoration:none;transition:transform .15s ease, opacity .15s ease, background .15s ease;
    white-space:nowrap;
  }
  .btn:active{transform:scale(.98)}
  .btn-accent{background:var(--sage);color:var(--charcoal)}
  .btn-accent:hover{background:var(--sage-tint)}
  .btn-outline-dark{border-color:var(--line-on-dark);color:var(--white)}
  .btn-outline-dark:hover{background:rgba(255,255,255,.08)}
  .btn-outline-light{border-color:var(--line-on-light);color:var(--ink)}
  .btn-outline-light:hover{background:#f5f5f5}
  .btn-ghost-link{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}

  .cta-row{display:flex;flex-wrap:wrap;gap:16px;align-items:center}

  /* ---------- header ---------- */
  header.site-header{
    position:sticky;top:env(safe-area-inset-top,0px);z-index:40;
    background:rgba(48,48,50,.92);backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line-on-dark);
  }
  .header-row{
    display:flex;align-items:center;justify-content:space-between;
    gap:20px;padding-block:14px;
  }
  .nav-cluster{display:flex;align-items:center;gap:20px}
  .brand-mark{display:flex;align-items:center;gap:12px;text-decoration:none;cursor:pointer;background:none;border:none;padding:0;flex:0 0 auto}
  .brand-mark img{height:32px;width:auto;display:block}
  .brand-wordmark{font-family:var(--font-display);font-weight:200;font-size:16.5px;letter-spacing:.05em;color:var(--white);line-height:1.15}
  .brand-wordmark b{font-weight:600;color:var(--sage);display:block;font-size:10px;letter-spacing:.22em;margin-top:2px}

  nav.primary-nav{display:flex;align-items:center;gap:30px}
  nav.primary-nav > .navlink,
  .nav-group > .navlink-parent{
    background:none;border:none;color:var(--fg-on-dark-muted);font-family:var(--font-body);
    font-size:14px;font-weight:500;letter-spacing:.02em;cursor:pointer;padding:6px 0;
    border-bottom:1px solid transparent;display:flex;align-items:center;gap:6px;
  }
  nav.primary-nav > .navlink:hover,
  nav.primary-nav > .navlink[aria-current="page"],
  .nav-group:hover > .navlink-parent,
  .nav-group > .navlink-parent[aria-current="page"]{color:var(--white);border-color:var(--sage)}

  .nav-group{position:relative}
  .nav-group > .navlink-parent::after{
    content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
    transform:rotate(45deg);margin-top:-4px;opacity:.75;
  }
  .nav-dropdown{
    position:absolute;top:100%;right:0;
    min-width:230px;margin-top:10px;padding:10px;
    background:var(--charcoal-raise);border:1px solid var(--line-on-dark);border-radius:12px;
    box-shadow:0 18px 40px rgba(0,0,0,.35);
    opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .14s ease;
    z-index:50;
  }
  .nav-dropdown::before{
    content:"";position:absolute;left:0;right:0;bottom:100%;height:10px;
  }
  .nav-group:hover > .nav-dropdown,
  .nav-group:focus-within > .nav-dropdown{opacity:1;visibility:visible;pointer-events:auto}
  .nav-dropdown button{
    display:block;width:100%;text-align:left;background:none;border:none;color:var(--fg-on-dark-muted);
    font-family:var(--font-body);font-size:14px;font-weight:400;letter-spacing:.01em;cursor:pointer;
    padding:10px 12px;border-radius:8px;white-space:nowrap;
  }
  .nav-dropdown button:hover{background:rgba(255,255,255,.07);color:var(--white)}

  .header-actions{display:flex;align-items:center;gap:14px}
  .menu-toggle{display:none;background:none;border:1px solid var(--line-on-dark);border-radius:10px;color:var(--white);width:42px;height:42px;cursor:pointer;align-items:center;justify-content:center}
  .menu-toggle svg{width:18px;height:18px}

  .mobile-nav{display:none}
  .mobile-nav.open{
    display:flex;flex-direction:column;gap:2px;
    background:var(--charcoal);border-bottom:1px solid var(--line-on-dark);
    padding:10px var(--gutter-r) 18px var(--gutter-l);
    max-height:calc(100vh - 80px);overflow-y:auto;
  }
  .mobile-nav button{
    background:none;border:none;color:var(--white);text-align:left;font-family:var(--font-body);
    font-size:16px;font-weight:300;padding:12px 4px;border-bottom:1px solid var(--line-on-dark);cursor:pointer;
    width:100%;
  }
  .mobile-nav button.mobile-nav-sub{
    padding-left:18px;font-size:14.5px;color:var(--fg-on-dark-muted);font-weight:300;
  }
  .mobile-nav .mobile-nav-label{
    display:block;padding:14px 4px 4px;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;
    color:var(--sage-tint);font-weight:600;
  }
  .mobile-nav button:last-child{border-bottom:none}

  @media (max-width:880px){
    nav.primary-nav{display:none}
    .menu-toggle{display:inline-flex}
  }

  /* ---------- hero ---------- */
  .hero{padding-block:clamp(64px,10vw,120px) clamp(48px,8vw,96px)}
  .hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
  .hero-logo-full{width:100%;max-width:420px;height:auto;aspect-ratio:900/310;display:block;margin:0 auto}
  @media (max-width:900px){.hero-grid{grid-template-columns:1fr}.hero-logo-full{max-width:320px}}

  /* ---------- feature grids ---------- */
  .grid{display:grid;gap:28px}
  .grid-3{grid-template-columns:repeat(3,1fr)}
  .grid-2{grid-template-columns:repeat(2,1fr)}
  @media (max-width:860px){.grid-3{grid-template-columns:1fr 1fr}}
  @media (max-width:620px){.grid-3,.grid-2{grid-template-columns:1fr}}

  .card{
    border:1px solid var(--line-on-dark);border-radius:14px;padding:26px 24px;
    background:var(--charcoal-raise);
  }
  .on-light .card, .on-tint .card{background:var(--white);border-color:var(--line-on-light)}
  .card .num{font-family:var(--font-display);font-weight:100;font-size:34px;color:var(--sage);display:block;margin-bottom:10px}
  .card .h-card{margin-bottom:8px}
  .card p{font-size:15px;color:var(--fg-on-dark-muted)}
  .on-light .card p, .on-tint .card p{color:var(--ink-muted)}

  .chip-row{display:flex;flex-wrap:wrap;gap:10px}
  .chip{
    border:1px solid var(--line-on-light);border-radius:999px;padding:8px 16px;font-size:14px;font-weight:600;
    background:var(--white);
  }
  .on-dark .chip,.on-dark-raise .chip{background:transparent;border-color:var(--line-on-dark);color:var(--white)}

  hr.hr-dark{border:none;border-top:1px solid var(--line-on-dark);margin-block:36px}
  hr.hr-light{border:none;border-top:1px solid var(--line-on-light);margin-block:36px}

  .kicker-list{display:grid;gap:20px}
  .kicker{display:grid;grid-template-columns:52px 1fr;gap:18px;align-items:start}
  .kicker .num{font-family:var(--font-display);font-weight:200;font-size:30px;color:var(--sage)}

  /* numbered requirement blocks on the 1910.95 page */
  .req{display:grid;grid-template-columns:64px 1fr;gap:20px;padding-block:26px;border-bottom:1px solid var(--line-on-light)}
  .req:first-of-type{border-top:1px solid var(--line-on-light)}
  .req .num{font-family:var(--font-display);font-weight:100;font-size:40px;color:var(--sage-dark);line-height:1}
  .req h3{font-weight:600;font-size:18px;font-family:var(--font-body);margin-bottom:8px}
  .req p{font-size:15.5px;color:var(--ink-muted)}

  .callout{border-left:3px solid var(--sage);background:var(--sage-wash);padding:20px 22px;border-radius:0 10px 10px 0}
  .callout.on-dark-variant{background:rgba(147,174,99,.12);border-color:var(--sage)}
  .callout p{color:var(--ink);font-size:15px}
  .callout.on-dark-variant p{color:var(--white)}
  .callout strong{color:var(--sage-dark)}
  .callout.on-dark-variant strong{color:var(--sage-tint)}

  /* CTA band */
  .cta-band{
    background:linear-gradient(135deg, var(--charcoal) 0%, #26262a 100%);
    border-top:1px solid var(--line-on-dark);border-bottom:1px solid var(--line-on-dark);
    text-align:center;
  }

  /* quiz */
  .quiz-card{border:1px solid var(--line-on-light);border-radius:16px;padding:clamp(24px,4vw,40px);background:var(--white);max-width:720px;margin:0 auto}
  .q-block{padding-block:22px;border-bottom:1px solid var(--line-on-light)}
  .q-block:last-of-type{border-bottom:none}
  .q-block p.q-text{font-weight:600;font-size:16px;margin-bottom:14px;color:var(--ink)}
  .opts{display:flex;flex-wrap:wrap;gap:10px}
  .opt{position:relative}
  .opt input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
  .opt label{
    display:inline-flex;padding:10px 18px;border:1px solid var(--line-on-light);border-radius:999px;
    font-size:14px;font-weight:500;cursor:pointer;color:var(--ink);background:var(--white);
  }
  .opt input:checked + label{background:var(--sage);border-color:var(--sage);color:var(--charcoal);font-weight:700}
  .opt input:focus-visible + label{outline:2px solid var(--sage-dark);outline-offset:2px}
  #quiz-result{margin-top:26px;padding-top:26px;border-top:1px dashed var(--line-on-light)}
  #quiz-result[hidden]{display:none}
  .result-badge{display:inline-block;padding:6px 14px;border-radius:999px;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:14px}
  .result-badge.high{background:#f3dede;color:#8a2f2f}
  .result-badge.med{background:var(--sage-wash);color:var(--sage-dark)}
  .result-badge.low{background:#e4ecf3;color:#355170}

  /* faq */
  details.faq-item{border-bottom:1px solid var(--line-on-light);padding-block:18px}
  details.faq-item:first-of-type{border-top:1px solid var(--line-on-light)}
  details.faq-item summary{
    cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;
    font-weight:600;font-size:16.5px;color:var(--ink);
  }
  details.faq-item summary::-webkit-details-marker{display:none}
  details.faq-item summary::after{content:"+";font-size:22px;font-weight:300;color:var(--sage-dark);flex:0 0 auto}
  details.faq-item[open] summary::after{content:"\2212"}
  details.faq-item .faq-a{margin-top:14px;font-size:15.5px;color:var(--ink-muted);max-width:68ch}

  /* contact form */
  .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
  @media (max-width:640px){.form-grid{grid-template-columns:1fr}}
  .field{display:flex;flex-direction:column;gap:6px}
  .field.full{grid-column:1 / -1}
  .field label{font-size:13px;font-weight:600;color:var(--ink-muted)}
  .field input,.field select,.field textarea{
    font-family:var(--font-body);font-size:15px;padding:12px 14px;border:1px solid var(--line-on-light);
    border-radius:8px;background:var(--white);color:var(--ink);
  }
  .field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--sage);outline-offset:1px;border-color:var(--sage)}
  .field textarea{resize:vertical;min-height:100px;font-family:var(--font-body)}
  .required-mark{color:var(--sage-dark)}
  #contact-success[hidden]{display:none}
  #contact-success{background:var(--sage-wash);border:1px solid var(--sage-tint);border-radius:12px;padding:24px;text-align:center}

  .copy-field{display:flex;align-items:center;gap:10px;font-weight:600;font-size:15px}
  .copy-btn{border:1px solid var(--line-on-dark);background:none;color:var(--white);border-radius:8px;padding:6px 10px;font-size:12px;cursor:pointer}
  .on-light .copy-btn,.on-tint .copy-btn{border-color:var(--line-on-light);color:var(--ink)}

  table.legal-table{width:100%;border-collapse:collapse;margin-block:16px}
  table.legal-table th,table.legal-table td{border:1px solid var(--line-on-light);padding:10px 12px;font-size:14.5px;text-align:left;vertical-align:top}
  table.legal-table th{background:var(--ivory)}
  .legal-scroll{overflow-x:auto}

  footer.site-footer{background:var(--charcoal);border-top:1px solid var(--line-on-dark);padding-block:56px 28px}
  .footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:36px}
  @media (max-width:760px){.footer-grid{grid-template-columns:1fr 1fr}}
  @media (max-width:480px){.footer-grid{grid-template-columns:1fr}}
  .footer-col h4{font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--sage-tint);font-weight:600;margin-bottom:14px}
  .footer-col button, .footer-col a{
    display:block;background:none;border:none;color:var(--fg-on-dark-muted);font-family:var(--font-body);
    font-size:14.5px;text-align:left;padding:5px 0;cursor:pointer;text-decoration:none;
  }
  .footer-col button:hover,.footer-col a:hover{color:var(--white)}
  .footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px;margin-top:40px;padding-top:24px;border-top:1px solid var(--line-on-dark);font-size:13px;color:var(--fg-on-dark-muted)}

  .skip-link{position:absolute;left:-9999px;top:0;background:var(--sage);color:var(--charcoal);padding:10px 16px;border-radius:0 0 8px 0;font-weight:700;z-index:100}
  .skip-link:focus{left:0}


  :focus-visible{outline:2px solid var(--sage);outline-offset:2px}

  @media (prefers-reduced-motion: reduce){
    *{animation-duration:0.01ms !important;transition-duration:0.01ms !important}
  }

  /* ---------- multi-page additions ---------- */
  a.navlink, .nav-dropdown a, .mobile-nav a, .footer-col a, a.brand-mark, a.btn, a.btn-ghost-link{text-decoration:none}
  nav.primary-nav > .navlink{text-decoration:none}
  .nav-dropdown a{
    display:block;color:var(--fg-on-dark-muted);font-size:14px;letter-spacing:.01em;
    padding:10px 12px;border-radius:8px;white-space:nowrap;
  }
  .nav-dropdown a:hover,.nav-dropdown a[aria-current="page"]{background:rgba(255,255,255,.07);color:var(--white)}
  .mobile-nav a{
    display:block;color:var(--white);font-size:16px;font-weight:300;padding:12px 4px;
    border-bottom:1px solid var(--line-on-dark);
  }
  .mobile-nav a.mobile-nav-sub{padding-left:18px;font-size:14.5px;color:var(--fg-on-dark-muted)}
  .mobile-nav a[aria-current="page"]{color:var(--sage-tint)}
  .split{display:grid;grid-template-columns:1.1fr .9fr;gap:40px}
  .split.contact{grid-template-columns:1.4fr .9fr;gap:48px}
  @media (max-width:820px){.split,.split.contact{grid-template-columns:1fr}}
  .hero-grid .hero-logo-col{order:2}
  @media (max-width:900px){.hero-grid .hero-logo-col{order:-1}}
  .form-status{margin-top:14px;font-size:14px;color:#8a2f2f}
  .form-status[hidden]{display:none}
  .contact-line a{color:inherit;text-decoration:none}
  .contact-line a:hover{text-decoration:underline}
  .quiz-error{margin-top:14px;color:#8a2f2f;font-size:14px}
  .quiz-error[hidden]{display:none}