/* EnviroSolution v0.3.8 canonical responsive layer.
 * This file intentionally loads after style.css and owns the mobile header,
 * viewport menu and mobile page-edge rhythm so legacy theme layers cannot
 * reposition or hide the controls. */

@media (min-width:1041px) {
  html body .esw-site-header {display:block!important;}
  html body .esw-mobile-header {display:none!important;}
}

@media (max-width:1040px) {
  html body .esw-site-header {display:none!important;}
  html body .esw-mobile-header {
    display:block!important;
    position:fixed!important;
    top:0!important;
    right:0!important;
    left:0!important;
    height:74px!important;
    min-height:74px!important;
    z-index:10020!important;
    background:#fff!important;
    border-bottom:1px solid #e2e8dc!important;
    box-shadow:0 2px 14px rgba(15,20,14,.08)!important;
    overflow:visible!important;
  }
  html body.home:not(.body-scrolled):not(.esw-mobile-menu-open) .esw-mobile-header {
    background:rgba(25,33,25,.84)!important;
    border-bottom-color:rgba(255,255,255,.14)!important;
    box-shadow:0 2px 18px rgba(0,0,0,.14)!important;
    backdrop-filter:blur(12px)!important;
    -webkit-backdrop-filter:blur(12px)!important;
  }
  html body.esw-mobile-menu-open .esw-mobile-header,
  html body.home.esw-mobile-menu-open .esw-mobile-header {
    background:#fff!important;
    border-bottom-color:#e2e8dc!important;
    box-shadow:0 2px 14px rgba(15,20,14,.08)!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }

  /* One grid only: both 44px controls sit exactly 14px from their viewport edge. */
  html body .esw-mobile-header-bar {
    position:relative!important;
    z-index:10022!important;
    width:100%!important;
    height:74px!important;
    margin:0!important;
    padding:0 14px!important;
    display:grid!important;
    grid-template-columns:44px minmax(0,1fr) 44px!important;
    align-items:center!important;
    gap:0!important;
    box-sizing:border-box!important;
  }
  html body .esw-mobile-menu-opener {
    grid-column:1!important;
    width:44px!important;
    height:44px!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    position:relative!important;
    z-index:10023!important;
  }
  html body .esw-mobile-menu-opener>a,
  html body .esw-mobile-call {
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
    max-width:44px!important;
    max-height:44px!important;
    margin:0!important;
    padding:0!important;
    border:1px solid #dbe4d3!important;
    border-radius:999px!important;
    background:transparent!important;
    color:#697138!important;
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    align-items:center!important;
    justify-content:center!important;
    line-height:1!important;
    box-shadow:none!important;
    transform:none!important;
    position:relative!important;
    inset:auto!important;
    pointer-events:auto!important;
    box-sizing:border-box!important;
  }
  html body .esw-mobile-call {
    grid-column:3!important;
    justify-self:end!important;
    z-index:10023!important;
  }
  html body .esw-mobile-logo-wrapper {
    grid-column:2!important;
    min-width:0!important;
    width:100%!important;
    height:74px!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    position:relative!important;
    z-index:10021!important;
  }
  html body .esw-mobile-logo-wrapper>a {
    width:auto!important;
    height:74px!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  html body .esw-mobile-logo-wrapper img {
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:110px!important;
    max-height:47px!important;
    margin:0!important;
  }

  /* Header icons: draw the hamburger with CSS rather than an SVG so legacy
   * SVG/font rules cannot make it disappear when the homepage enters its
   * scrolled/light header state. */
  html body .esw-mobile-menu-icon,
  html body.esw-mobile-menu-open .esw-mobile-menu-icon {
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    width:20px!important;
    height:14px!important;
    margin:0!important;
    padding:0!important;
    flex-direction:column!important;
    justify-content:space-between!important;
    align-items:center!important;
    color:inherit!important;
    line-height:0!important;
    transform:none!important;
  }
  html body .esw-mobile-menu-icon>span,
  html body.home.body-scrolled .esw-mobile-menu-icon>span,
  html body.esw-mobile-menu-open .esw-mobile-menu-icon>span {
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    width:20px!important;
    height:2px!important;
    min-height:2px!important;
    flex:0 0 2px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:2px!important;
    background:currentColor!important;
    box-shadow:none!important;
    transform:none!important;
  }
  html body .esw-mobile-call .es-ui-icon-phone,
  html body.esw-mobile-menu-open .esw-mobile-call .es-ui-icon-phone {
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    width:20px!important;
    height:20px!important;
    margin:0!important;
    padding:0!important;
    color:inherit!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:1.9!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
    transform:none!important;
  }

  html body.home:not(.body-scrolled):not(.esw-mobile-menu-open) .esw-mobile-menu-opener>a,
  html body.home:not(.body-scrolled):not(.esw-mobile-menu-open) .esw-mobile-call {
    color:#fff!important;
    border-color:rgba(255,255,255,.84)!important;
  }
  html body.home:not(.body-scrolled):not(.esw-mobile-menu-open) .esw-mobile-call .es-ui-icon-phone {
    color:#fff!important;
    stroke:#fff!important;
  }
  html body.esw-mobile-menu-open .esw-mobile-menu-opener>a,
  html body.esw-mobile-menu-open .esw-mobile-call {
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    color:#697138!important;
    border-color:#dbe4d3!important;
    background:#fff!important;
  }

  /* Viewport menu: starts below header and never changes document flow. */
  html body .esw-mobile-nav {
    display:block!important;
    position:fixed!important;
    top:74px!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    width:100%!important;
    height:calc(100vh - 74px)!important;
    height:calc(100dvh - 74px)!important;
    max-height:none!important;
    margin:0!important;
    padding:12px 0 28px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    background:#fff!important;
    border-top:0!important;
    box-shadow:none!important;
    z-index:10010!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(-6px)!important;
    transition:opacity .16s ease,transform .16s ease,visibility 0s linear .16s!important;
  }
  html body .esw-mobile-nav.is-open {
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0)!important;
    transition:opacity .16s ease,transform .16s ease,visibility 0s!important;
  }
  html body .esw-mobile-nav-shell {
    width:min(calc(100% - 28px),680px)!important;
    max-width:680px!important;
    margin:0 auto!important;
    padding:0!important;
  }
  html body .esw-mobile-nav .esw-menu-main {
    display:block!important;
    width:100%!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
  }
  html body .esw-mobile-nav .esw-menu-main>li {
    display:block!important;
    width:100%!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
  }
  html body .esw-mobile-nav .esw-menu-main>li>a {
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
    min-height:50px!important;
    height:auto!important;
    margin:4px 0!important;
    padding:0 18px!important;
    border:1px solid #dfe6d7!important;
    border-radius:10px!important;
    background:#fbfcf8!important;
    color:#152016!important;
    -webkit-text-fill-color:#152016!important;
    font-size:15px!important;
    font-weight:800!important;
    letter-spacing:0!important;
    text-shadow:none!important;
    box-sizing:border-box!important;
  }
  html body .esw-mobile-nav .esw-menu-main>li>a:hover,
  html body .esw-mobile-nav .esw-menu-main>li>a:focus-visible {
    background:#f4f7ef!important;
    color:#152016!important;
  }
  html body .esw-mobile-nav .esw-nav-caret {
    display:inline-block!important;
    width:0!important;
    height:0!important;
    margin-left:auto!important;
    border-left:4px solid transparent!important;
    border-right:4px solid transparent!important;
    border-top:5px solid #697138!important;
    transform:rotate(0deg)!important;
    transition:transform .16s ease!important;
  }
  html body .esw-mobile-nav li.is-mobile-open>a .esw-nav-caret {transform:rotate(180deg)!important;}

  html body .esw-mobile-nav .esw-menu-main>li:not(.is-mobile-open)>.esw-mega-menu,
  html body .esw-mobile-nav .esw-menu-main>li:not(.is-mobile-open)>.esw-resources-menu,
  html body .esw-mobile-nav .esw-menu-main>li:not(.is-mobile-open)>ul.sub-menu {
    display:none!important;
  }
  html body .esw-mobile-nav .esw-menu-main>li.is-mobile-open>.esw-mega-menu,
  html body .esw-mobile-nav .esw-menu-main>li.is-mobile-open>.esw-resources-menu,
  html body .esw-mobile-nav .esw-menu-main>li.is-mobile-open>ul.sub-menu {
    display:block!important;
    position:static!important;
    width:100%!important;
    height:auto!important;
    max-height:none!important;
    margin:4px 0 8px!important;
    transform:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    overflow:visible!important;
    box-shadow:none!important;
  }

  html body .esw-mobile-nav .esw-mega-menu {
    border:1px solid #e1e7db!important;
    border-radius:10px!important;
    background:#fff!important;
    padding:8px!important;
  }
  html body .esw-mobile-nav .esw-mega-inner {padding:0!important;}
  html body .esw-mobile-nav .esw-mega-title-row {
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    margin:0 0 6px!important;
    padding:0!important;
    border:0!important;
  }
  html body .esw-mobile-nav .esw-mega-title-row>span {display:none!important;}
  html body .esw-mobile-nav .esw-mega-title-row>a {
    display:inline-flex!important;
    align-items:center!important;
    width:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:8px 8px!important;
    border:0!important;
    background:transparent!important;
    color:#697138!important;
    font-size:12px!important;
    font-weight:800!important;
  }
  html body .esw-mobile-nav .esw-mega-grid {display:grid!important;grid-template-columns:1fr!important;gap:4px!important;}
  html body .esw-mobile-nav .esw-mega-service {
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    min-height:54px!important;
    margin:0!important;
    padding:8px 10px!important;
    border:0!important;
    border-radius:8px!important;
    background:#fbfcf8!important;
    color:#152016!important;
  }
  html body .esw-mobile-nav .esw-mega-service:hover {background:#f1f5eb!important;}
  html body .esw-mobile-nav .esw-mega-icon {
    display:flex!important;
    flex:0 0 38px!important;
    width:38px!important;
    height:38px!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:999px!important;
    background:#f1f3ea!important;
  }
  html body .esw-mobile-nav .esw-mega-icon img {
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    width:32px!important;
    height:32px!important;
    max-width:32px!important;
    max-height:32px!important;
    object-fit:contain!important;
  }
  html body .esw-mobile-nav .esw-mega-icon .es-ui-icon {display:block!important;width:22px!important;height:22px!important;color:#697138!important;}
  html body .esw-mobile-nav .esw-mega-service>span:last-child {font-size:13px!important;font-weight:750!important;letter-spacing:0!important;}

  html body .esw-mobile-nav .esw-resources-menu {
    list-style:none!important;
    padding:6px!important;
    border:1px solid #e1e7db!important;
    border-radius:10px!important;
    background:#fff!important;
  }
  html body .esw-mobile-nav .esw-resources-menu li {margin:0!important;padding:0!important;}
  html body .esw-mobile-nav .esw-resources-menu a {
    display:grid!important;
    grid-template-columns:34px minmax(0,1fr)!important;
    align-items:center!important;
    gap:12px!important;
    min-height:54px!important;
    margin:0!important;
    padding:8px 10px!important;
    border:0!important;
    border-radius:8px!important;
    background:#fbfcf8!important;
    color:#152016!important;
    text-align:left!important;
  }
  html body .esw-mobile-nav .esw-resources-menu a>span {display:block!important;min-width:0!important;text-align:left!important;}
  html body .esw-mobile-nav .esw-resources-menu strong {display:block!important;color:#152016!important;font-size:13px!important;font-weight:750!important;text-align:left!important;}
  html body .esw-mobile-nav .esw-resources-menu small {display:block!important;margin-top:2px!important;color:#687068!important;font-size:11px!important;line-height:1.35!important;text-align:left!important;}
  html body .esw-mobile-nav .esw-resources-menu .es-ui-icon {width:18px!important;height:18px!important;color:#697138!important;}

  html body .esw-mobile-nav-shell>a.esw-mobile-nav-cta {
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:9px!important;
    width:100%!important;
    min-height:50px!important;
    margin:12px 0 0!important;
    padding:0 16px!important;
    border:1px solid #697138!important;
    border-radius:10px!important;
    background:#697138!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-size:14px!important;
    font-weight:850!important;
    letter-spacing:0!important;
    box-shadow:none!important;
  }
  html body .esw-mobile-nav-shell>a.esw-mobile-nav-cta:hover,
  html body .esw-mobile-nav-shell>a.esw-mobile-nav-cta:focus-visible {background:#59602f!important;border-color:#59602f!important;color:#fff!important;}
  html body .esw-mobile-nav-shell>a.esw-mobile-nav-cta .es-ui-icon {display:block!important;width:15px!important;height:15px!important;color:#fff!important;stroke:#fff!important;}

  html body.esw-mobile-menu-open {overflow:hidden!important;}
  html body.esw-mobile-menu-open #esw-back-to-top {display:none!important;}
}

@media (max-width:782px) {
  html body.admin-bar .esw-mobile-header {top:46px!important;}
  html body.admin-bar .esw-mobile-nav {top:120px!important;height:calc(100vh - 120px)!important;height:calc(100dvh - 120px)!important;}
}
@media (min-width:783px) and (max-width:1040px) {
  html body.admin-bar .esw-mobile-header {top:32px!important;}
  html body.admin-bar .esw-mobile-nav {top:106px!important;height:calc(100vh - 106px)!important;height:calc(100dvh - 106px)!important;}
}

/* Mobile page rhythm. The fixed header owns 74px; normal title sections begin below it,
 * then a real 28px white content gap is preserved before the first content/card. */
@media (max-width:760px) {
  :root { --es-mobile-header-h:74px; --es-mobile-page-gap:28px; }

  html body:not(.home) #content>.es-page-masthead,
  html body:not(.home) #content>.es-service-masthead,
  html body.single-post #content>.es-post-masthead,
  html body.single-es_case_study #content>.es-case-v83-hero {
    margin-top:var(--es-mobile-header-h)!important;
  }

  html body:not(.home) #content>.es-page-masthead,
  html body:not(.home) #content>.es-service-masthead {
    padding-top:32px!important;
    padding-bottom:32px!important;
  }

  html body #content>.es-page-masthead + .es-content,
  html body #content>.es-service-masthead + .es-content,
  html body #content>.es-page-masthead + .es-news-cover {
    margin-top:0!important;
    padding-top:var(--es-mobile-page-gap)!important;
    padding-bottom:var(--es-mobile-page-gap)!important;
  }

  /* Pages whose title panel is deliberately hidden still clear the fixed header
   * and receive the same visible 28px top/bottom breathing room. */
  html body.page-slug-about #content>.es-content,
  html body.page-slug-contact #content>.es-content,
  html body.page-slug-accreditations #content>.es-content {
    padding-top:calc(var(--es-mobile-header-h) + var(--es-mobile-page-gap))!important;
    padding-bottom:var(--es-mobile-page-gap)!important;
  }

  html body.single-post #content>.es-post-masthead {
    padding-top:32px!important;
    padding-bottom:32px!important;
  }
  html body.single-post #content>.es-post-wrap {padding-top:var(--es-mobile-page-gap)!important;}

  html body.single-es_case_study #content>.es-case-v83-hero {padding-top:32px!important;padding-bottom:32px!important;}
  html body.single-es_case_study #content>.es-case-v83-wrap {padding-top:var(--es-mobile-page-gap)!important;}

  html body.single-es_resource #content>.es-post-masthead {
    margin-top:var(--es-mobile-header-h)!important;
    padding-top:32px!important;
    padding-bottom:32px!important;
  }
  html body.single-es_resource #content>.es-kh-v77-wrap {
    margin-top:0!important;
    padding-top:var(--es-mobile-page-gap)!important;
  }

  html body #content>.es-content .entry-content>:first-child,
  html body #content>.es-content .es-editor-content>:first-child,
  html body #content>.es-content .es-page-pro>:first-child {margin-top:0!important;}
  html body #content>.es-content .entry-content>:last-child,
  html body #content>.es-content .es-editor-content>:last-child,
  html body #content>.es-content .es-page-pro>:last-child {margin-bottom:0!important;}
}

/* Tablet page rhythm: the mobile header remains fixed through 1040px, so every
 * non-home template explicitly clears it. This avoids relying on old style.css
 * breakpoint layers and gives tablets a consistent title/content cadence. */
@media (min-width:761px) and (max-width:1040px) {
  :root { --es-tablet-header-h:74px; --es-tablet-page-gap:36px; }

  html body:not(.home) #content>.es-page-masthead,
  html body:not(.home) #content>.es-service-masthead,
  html body.single-post #content>.es-post-masthead,
  html body.single-es_case_study #content>.es-case-v83-hero {
    margin-top:var(--es-tablet-header-h)!important;
  }

  html body:not(.home) #content>.es-page-masthead,
  html body:not(.home) #content>.es-service-masthead {
    padding-top:44px!important;
    padding-bottom:44px!important;
  }

  html body #content>.es-page-masthead + .es-content,
  html body #content>.es-service-masthead + .es-content,
  html body #content>.es-page-masthead + .es-news-cover {
    margin-top:0!important;
    padding-top:var(--es-tablet-page-gap)!important;
    padding-bottom:var(--es-tablet-page-gap)!important;
  }

  html body.page-slug-about #content>.es-content,
  html body.page-slug-contact #content>.es-content,
  html body.page-slug-accreditations #content>.es-content {
    padding-top:calc(var(--es-tablet-header-h) + var(--es-tablet-page-gap))!important;
    padding-bottom:var(--es-tablet-page-gap)!important;
  }

  html body.single-post #content>.es-post-masthead {
    padding-top:44px!important;
    padding-bottom:44px!important;
  }
  html body.single-post #content>.es-post-wrap {padding-top:var(--es-tablet-page-gap)!important;}

  html body.single-es_case_study #content>.es-case-v83-hero {padding-top:44px!important;padding-bottom:44px!important;}
  html body.single-es_case_study #content>.es-case-v83-wrap {padding-top:var(--es-tablet-page-gap)!important;}

  html body.single-es_resource #content>.es-post-masthead {margin-top:var(--es-tablet-header-h)!important;}
  html body.single-es_resource #content>.es-kh-v77-wrap {padding-top:var(--es-tablet-page-gap)!important;}

  html body #content>.es-content .entry-content>:first-child,
  html body #content>.es-content .es-editor-content>:first-child,
  html body #content>.es-content .es-page-pro>:first-child {margin-top:0!important;}
  html body #content>.es-content .entry-content>:last-child,
  html body #content>.es-content .es-editor-content>:last-child,
  html body #content>.es-content .es-page-pro>:last-child {margin-bottom:0!important;}
}