/* Gas Connect Limited — extracted from Gas_Connect.html (single-file build).
   source <style> block(s) 9 of 19
   Load order is significant: see index.html. */

/* ---- source <style id="mobile-nav-drawer"> ---- */
/* ===== Mobile menu — light paper panel + indexed contents (≤760px only) ===== */
@media (max-width:760px){
  .nav__drawer{background:var(--paper) !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;
    align-items:stretch !important;justify-content:flex-start !important;
    padding:24px 24px 22px !important;overflow-y:auto !important;-webkit-overflow-scrolling:touch}
  /* the hero's own photo, carried behind the menu */
  .nav__drawer::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
    background-image:var(--drawer-photo,none);background-size:cover;background-position:76% center}
  .nav__drawer::after{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
    background:linear-gradient(180deg,rgba(250,248,242,.94) 0%,rgba(250,248,242,.88) 42%,rgba(250,248,242,.97) 100%)}
  .nav__drawer>*{position:relative;z-index:1}
  .nav__drawer .drawer__close{top:22px !important;right:22px !important;width:40px !important;height:40px !important;
    border:1px solid var(--line-strong) !important;border-radius:50% !important;color:var(--ink) !important;
    background:none !important;font-size:15px !important}
  .nav__drawer .drawer__close:hover{background:var(--mist) !important}
  .drawer__brand{font-family:'Fraunces',serif;font-size:21px;font-weight:500;color:var(--ink);
    display:block;height:40px;line-height:40px}
  .drawer__lab{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.2em;
    color:var(--ink-3);display:block;margin-top:24px;margin-bottom:8px}
  /* each link becomes an indexed row: number, name, one-line description */
  .nav__drawer a[data-nav]{display:grid !important;grid-template-columns:22px 1fr auto;column-gap:14px;
    align-items:baseline;text-align:left !important;padding:11px 0 !important;
    border-top:1px solid var(--line);color:var(--ink) !important;
    font-family:'Fraunces',serif !important;font-size:23px !important;line-height:1.1 !important;
    font-weight:400 !important;transform:none !important;margin:0 !important}
  .nav__drawer a[data-nav]:last-of-type{border-bottom:1px solid var(--line)}
  .nav__drawer a[data-nav]::before{content:attr(data-no);font-family:'IBM Plex Mono',monospace;
    font-size:10px;color:var(--ink-3);grid-column:1}
  .nav__drawer a[data-nav]::after{content:attr(data-desc);grid-column:2;grid-row:2;
    font-family:'Inter',system-ui,sans-serif;font-size:11.5px;line-height:1.4;
    color:var(--ink-2);margin-top:3px}
  .nav__drawer a[data-nav]>*{grid-column:2;grid-row:1}
  .nav__drawer a[data-nav].is-here{background:rgba(90,135,85,.09);
    margin-inline:-24px !important;padding-inline:24px !important;font-style:italic;color:var(--green-deep) !important}
  .nav__drawer a[data-nav].is-here::before{color:var(--green)}
  .nav__drawer a[data-nav].is-here::after{color:var(--ink-2)}
  .drawer__here{font-family:'IBM Plex Mono',monospace;font-size:8px;letter-spacing:.14em;color:var(--green-deep);
    border:1px solid rgba(90,135,85,.45);border-radius:999px;padding:3px 7px;grid-column:3 !important;
    grid-row:1 !important;font-style:normal;align-self:center;white-space:nowrap}
  .nav__drawer a[data-nav]:not(.is-here) .drawer__here{display:none}
  /* foot: lens switch, Contact, reach lines */
  .drawer__foot{margin-top:auto;display:flex;flex-direction:column;gap:13px;padding-top:20px}
  .nav__drawer .drawer__lens{margin-top:0 !important;display:flex;gap:6px}
  .nav__drawer .lens-btn{flex:1;min-height:0 !important;font-family:'Inter',system-ui,sans-serif !important;
    font-size:12px !important;font-weight:500 !important;letter-spacing:0 !important;
    color:var(--ink-2) !important;border:1px solid var(--line-strong) !important;
    background:none !important;padding:9px 4px !important;border-radius:999px !important}
  .nav__drawer .lens-btn.is-on{background:var(--green) !important;color:var(--paper) !important;border-color:var(--green) !important}
  .nav__drawer a.btn--solid{display:flex !important;grid-template-columns:none !important;
    justify-content:center;align-items:center;gap:8px;background:var(--brown) !important;color:var(--paper) !important;
    font-family:'Inter',system-ui,sans-serif !important;font-size:15px !important;font-weight:600 !important;
    border:0 !important;border-radius:999px !important;padding:15px 20px !important;margin:0 !important;
    box-shadow:0 10px 24px rgba(117,76,40,.26) !important;font-style:normal !important}
  .nav__drawer a.btn--solid::before,.nav__drawer a.btn--solid::after{content:none !important}
  .drawer__reach{border-top:1px solid var(--line);padding-top:12px;display:flex;flex-direction:column;gap:8px}
  .drawer__reach a{display:flex !important;gap:12px;align-items:center;font-family:'Inter',system-ui,sans-serif !important;
    font-size:13px !important;color:var(--ink) !important;padding:0 !important;border:0 !important;
    text-align:left !important;transform:none !important}
  .drawer__reach a b{font-family:'IBM Plex Mono',monospace;font-size:8.5px;letter-spacing:.14em;
    color:var(--ink-3);min-width:50px;font-weight:400}
}