/* Sunshine Mining & Crushing Solutions LLP: classic site.
   A hand-built rewrite of the original builder site. Same content, same page layout,
   same images; semantic HTML, one CSS, one JS, self-hosted fonts, WCAG 2.1 AA.
   Colour rule: the original brand green (#85AB3F) is below AA on light surfaces, so
   green TEXT and green BUTTONS on light use the AA shades below. #85AB3F stays for
   decorative fills and for headings on dark photo sections. */

/* ---- Fonts --------------------------------------------------------------- */
@font-face{font-family:"Playfair Display";src:url("../fonts/playfair-display-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:"Quicksand";src:url("../fonts/quicksand-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Quicksand";src:url("../fonts/quicksand-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:"Quicksand";src:url("../fonts/quicksand-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:"Open Sans";src:url("../fonts/open-sans-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;}

/* ---- Tokens -------------------------------------------------------------- */
:root{
  --green:#85ab3f;          /* original brand green: decorative and on-dark only (6.4:1 on the dark overlays) */
  --green-heading:#6a8f2e;  /* large green headings on light: 3.8:1 on white, 3.4:1 on the grey bands */
  --green-ink:#557724;      /* small green text and button fills: 5.2:1 on white, white label 5.2:1 */
  --yellow:#fda81d;         /* accent: underline bar, "SUNSHINE" on the dark hero (7.9:1) */
  --orange:#f1720c;         /* dropdown top border (decorative) */
  --heading:#45494d;        /* block headings, 8.1:1 on the grey band */
  --text:#505052;           /* body text: 8.0:1 on white, 7.2:1 on the grey bands (AAA, for older readers) */
  --nav:#070707;
  --menu-item:#444444;
  --band:#f3f3f3;           /* services band */
  --band-2:#f2f2f4;         /* alternate service rows, form fields */
  --line:#e7e7e7;
  --placeholder:#6b6b6b;    /* 4.8:1 on the field fill */
  --footer:#191919;
  --footer-text:#e6e6fa;    /* 14.3:1 */
  --footer-link:#0088cc;    /* 4.5:1 on the footer */
  --hero-overlay:rgba(38,37,37,.42);
  --vm-overlay:rgba(17,16,16,.55);

  --serif:"Playfair Display",Georgia,"Times New Roman",serif;
  --sans:"Quicksand",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --nav-font:"Open Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;

  --pad-x:100px;            /* component side padding (20px at 979px and below) */
  --max:1566px;            /* the original 1366px content width plus its 100px side padding */
  --header-h:121px;
  --header-scrolled:76px;
}

/* ---- Base ---------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-scrolled) + 16px);}
body{margin:0;padding-top:var(--header-h);background:#fff;color:var(--text);font-family:var(--sans);font-size:17px;font-weight:500;line-height:1.6;-webkit-font-smoothing:antialiased;}
img{display:block;max-width:100%;height:auto;}
h1,h2,h3,h4{font-family:var(--serif);font-weight:700;margin:0;line-height:1.25;letter-spacing:1px;text-wrap:balance;}
p{margin:0 0 10px;}
ul{margin:0 0 10px 25px;padding:0;}
a{color:var(--green-ink);}
b,strong{font-weight:700;}
:focus-visible{outline:3px solid #155a99;outline-offset:2px;}
.hero :focus-visible,.vm :focus-visible,.page-banner :focus-visible,.site-footer :focus-visible,.tile :focus-visible{outline-color:var(--yellow);}
.skip-link{position:absolute;left:12px;top:-60px;z-index:2000;background:var(--footer);color:#fff;padding:10px 16px;font-weight:700;text-decoration:none;}
.skip-link:focus{top:10px;}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;opacity:0;}
.container{max-width:var(--max);margin:0 auto;padding:20px var(--pad-x);}

/* ---- Buttons ------------------------------------------------------------- */
.btn{display:inline-block;margin-top:20px;padding:12px 25px;border:0;border-radius:25px;background:var(--green-ink);color:#fff;font-family:var(--sans);font-size:16px;font-weight:700;line-height:1.4;text-decoration:none;cursor:pointer;transition:background-color .2s;}
.btn{box-shadow:0 2px 6px rgba(85,119,36,.25);transition:background-color .2s,transform .2s,box-shadow .2s;}
.btn:hover{background:#333;color:#fff;transform:translateY(-2px);box-shadow:0 6px 14px rgba(0,0,0,.18);}

/* ---- Header -------------------------------------------------------------- */
.site-header{position:fixed;top:0;left:0;right:0;z-index:1010;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.065);transition:background-color .3s ease,box-shadow .3s ease,transform .3s ease;}
.header-hidden .site-header{transform:translateY(-100%);box-shadow:none;}
.is-scrolled .site-header{background:rgba(255,255,255,.9);-webkit-backdrop-filter:saturate(180%) blur(12px);backdrop-filter:saturate(180%) blur(12px);box-shadow:0 6px 20px rgba(0,0,0,.08);}
.header-inner{position:relative;display:flex;align-items:center;justify-content:space-between;height:var(--header-h);padding:5px var(--pad-x);transition:height .3s ease;}
.is-scrolled .header-inner{height:var(--header-scrolled);}
.brand{display:block;padding:10px 20px 10px 0;}
.brand img{width:110px;height:auto;transition:width .3s ease;}
.is-scrolled .brand img{width:72px;}
.nav-links{display:flex;align-items:center;list-style:none;margin:0;padding:0;}
.nav-links > li{position:relative;}
.nav-links > li > a{display:block;padding:10px 20px;font-family:var(--nav-font);font-size:15px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--nav);text-decoration:none;}
.nav-links > li:last-child > a{padding-right:0;}
.nav-links > li > a:hover,.nav-links > li > a[aria-current="page"]{color:var(--green-ink);}
.nav-links > li > a{position:relative;}
.nav-links > li > a::after{content:"";position:absolute;left:20px;right:20px;bottom:4px;height:2px;border-radius:2px;background:var(--green-ink);transform:scaleX(0);transform-origin:left;transition:transform .25s ease;}
.nav-links > li:last-child > a::after{right:0;}
.has-sub > a::after{right:4px!important;}
.nav-links > li > a:hover::after,.nav-links > li > a[aria-current="page"]::after{transform:scaleX(1);}
.has-sub{display:flex;align-items:center;}
.has-sub > a{padding-right:4px!important;}
.sub-toggle{display:inline-flex;align-items:center;justify-content:center;width:24px;height:32px;margin-right:16px;padding:0;background:none;border:0;cursor:pointer;color:#999;}
.caret{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid currentColor;}
.submenu{position:absolute;right:0;top:100%;z-index:1000;display:none;min-width:320px;margin:10px 0 0;padding:5px 0;list-style:none;background:#fff;border-top:2px solid var(--orange);border-radius:0 0 8px 8px;box-shadow:0 12px 30px rgba(0,0,0,.14);}
.submenu::before{content:"";position:absolute;right:28px;top:-8px;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid var(--orange);}
.submenu::after{content:"";position:absolute;left:0;right:0;top:-14px;height:12px;} /* hover bridge across the 10px gap */
.has-sub:hover .submenu,.has-sub:focus-within .submenu:not([data-closed]),.submenu[data-open="true"]{display:block;animation:menu-in .2s ease;}
.has-sub:hover .submenu[data-closed]{display:block;}
.submenu a{display:block;padding:3px 15px;line-height:35px;font-size:16px;color:var(--menu-item);text-align:right;text-decoration:none;border-bottom:1px solid var(--line);transition:color .2s;}
.submenu li:last-child a{border-bottom:0;}
.submenu a:hover{color:var(--nav);}
.nav-toggle{display:none;}
.header-call{display:inline-flex;align-items:center;gap:8px;margin-left:24px;padding:10px 18px;border:2px solid var(--green-ink);border-radius:999px;color:var(--green-ink);font-family:var(--nav-font);font-size:16px;font-weight:700;letter-spacing:.3px;text-decoration:none;white-space:nowrap;transition:background-color .2s,color .2s;}
.header-call svg{width:18px;height:18px;flex:none;}
.header-call:hover{background:var(--green-ink);color:#fff;}
@media (max-width:1199px){.header-call{padding:10px;margin-left:12px;}.header-call .num{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;}}
@media (max-width:979px){.header-call{display:none;}}
@media (min-width:980px){.nav{margin-left:auto;}}

/* ---- Home hero ----------------------------------------------------------- */
.hero{position:relative;display:flex;align-items:center;justify-content:center;min-height:100vh;margin-top:calc(-1 * var(--header-h));padding:0 var(--pad-x);background:#262525 url("../imgs/sunshine-mining--crushing-solutions-llp-2.webp") center/cover no-repeat;color:#fff;text-align:center;}
.hero::before{content:"";position:absolute;inset:0;background:var(--hero-overlay);}
.hero-content{position:relative;width:100%;}
.hero h1{font-size:62px;line-height:1.2;letter-spacing:normal;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.25);}
.hero h1 .hl{color:var(--yellow);}
.hero .tagline{margin:10px 0 0;font-family:var(--serif);font-size:24px;font-weight:700;line-height:1.25;letter-spacing:normal;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.25);}
.hero-arrow{position:absolute;right:0;bottom:0;display:block;width:32px;height:32px;padding:5px;background:rgba(0,0,0,.2);color:#fff;transition:background-color .2s;animation:bounce 2s ease 2s 2;}
.hero-arrow:hover{background:rgba(0,0,0,.8);}
.hero-arrow svg{width:22px;height:22px;}
@keyframes menu-in{from{opacity:0;transform:translateY(-8px);}to{opacity:1;transform:none;}}
@keyframes bounce{0%,20%,50%,80%,100%{transform:translateY(0);}40%{transform:translateY(-12px);}60%{transform:translateY(-6px);}}
@media (min-width:1025px){.hero{background-attachment:fixed;}}

/* ---- Section title (green heading + yellow bar) -------------------------- */
.section-title{padding:60px var(--pad-x) 30px;text-align:center;}
.section-title h2,.page-banner h1{font-size:46px;color:var(--green-heading);}
.section-title h2::after,.page-banner h1::after{content:"";display:block;width:90px;height:5px;margin:12px auto 0;border-radius:5px;background:var(--yellow);}
.band{background:var(--band);}

/* ---- Image + text rows --------------------------------------------------- */
.image-text{display:grid;grid-template-columns:1fr 1fr;align-items:center;column-gap:2.5%;max-width:var(--max);margin:0 auto;padding:30px var(--pad-x) 80px;}
.image-text .media img{width:var(--w,95%);border-radius:8px;box-shadow:0 10px 30px rgba(0,0,0,.12);}
.image-text.flip .media{order:2;}
.image-text.flip .media img{margin-left:auto;}
.image-text .body h2,.image-text .body h3,.feature-heading{margin:0 0 10px;font-size:24px;color:var(--heading);}
.prose p,.prose li{text-align:left;word-break:break-word;}
.prose p{margin-bottom:18px;}
.prose .btn{margin-top:2px;}
.prose ul{margin-top:0;}

/* ---- Services tile grid (home) ------------------------------------------- */
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;max-width:var(--max);margin:0 auto;padding:30px var(--pad-x) 80px;list-style:none;}
.tile{position:relative;aspect-ratio:1/1;overflow:hidden;border-radius:8px;background:#333;box-shadow:0 6px 18px rgba(0,0,0,.12);transition:transform .3s ease,box-shadow .3s ease;}
.tile:hover,.tile:focus-within{transform:translateY(-4px);box-shadow:0 14px 30px rgba(0,0,0,.22);}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.tile:hover img,.tile:focus-within img{transform:scale(1.2);}
.tile .tile-body{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;background:linear-gradient(180deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,.6) 100%);text-align:center;}
.tile h3{font-size:17.5px;line-height:20px;letter-spacing:normal;color:#fff;}
.tile a{display:inline-block;margin-top:20px;padding:8px 20px;border:1px solid #fff;border-radius:999px;color:#fff;font-size:14px;font-weight:700;letter-spacing:1px;text-decoration:none;transition:background-color .2s;}
.tile a:hover{background:var(--green-ink);border-color:var(--green-ink);}

/* ---- Vision and Mission (photo band) ------------------------------------- */
.vm{position:relative;background:#262525 url("../imgs/s.webp") center/cover no-repeat;color:#fff;}
.vm::before{content:"";position:absolute;inset:0;background:var(--vm-overlay);}
.vm-grid{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:2.5%;max-width:var(--max);margin:0 auto;padding:30px var(--pad-x) 80px;text-align:center;}
.vm-grid img{width:100px;height:100px;margin:0 auto 10px;transition:opacity .2s;}
.vm-grid img:hover{opacity:.9;}
.vm-grid h3{margin-bottom:10px;font-size:24px;color:var(--green);}
.vm-grid p{color:#fff;}

/* ---- Contact form + details ---------------------------------------------- */
.contact{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:2.5%;max-width:var(--max);margin:0 auto;padding:20px var(--pad-x);}
.contact-form{grid-column:span 2;display:grid;grid-template-columns:1fr 1fr;column-gap:3.75%;}
.contact--page{padding-top:80px;padding-bottom:80px;}
.field{margin:0 0 10px;}
.field input,.field textarea{display:block;width:97%;min-height:51px;padding:10px 14px;border:1px solid var(--band-2);border-radius:8px;transition:border-color .2s,box-shadow .2s,background-color .2s;background:var(--band-2);color:#000;font:inherit;font-size:17px;}
.contact--page .field input,.contact--page .field textarea{background:var(--band);border-color:var(--band);}
.field textarea{min-height:0;resize:vertical;}
.field input:focus,.field textarea:focus{outline:none;background:#fff;border-color:var(--green-ink);box-shadow:0 0 0 3px rgba(85,119,36,.22);}
.field ::placeholder{color:var(--placeholder);opacity:1;}
.form-note{margin-top:10px;font-size:15px;color:var(--text);}
.details{display:flex;flex-direction:column;justify-content:center;min-height:180px;list-style:none;margin:0;padding:0;}
.details li{margin-bottom:20px;}
.details h3{display:flex;align-items:center;gap:6px;margin:0 0 8px;font-family:var(--sans);font-size:16px;letter-spacing:0;color:var(--text);}
.details svg{width:14px;height:14px;flex:none;}
.details p,.details address{margin:0;font-style:normal;}
.details a{color:var(--text);text-decoration:none;}
.details a:hover{color:var(--green-ink);}

.field label{display:block;margin:0 0 6px;font-size:16px;font-weight:700;color:var(--heading);}
.field label .opt{font-weight:500;color:var(--text);}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:#b3261e;background:#fff;}
.field-error{margin:6px 0 0;font-size:16px;font-weight:700;color:#b3261e;} /* 6.5:1 on white */
.field-error::before{content:"! ";}

/* ---- Map ----------------------------------------------------------------- */
.map{max-width:var(--max);margin:0 auto;padding:20px var(--pad-x);}
.map iframe{display:block;width:100%;height:300px;border:0;border-radius:8px;background:var(--band-2);box-shadow:0 6px 18px rgba(0,0,0,.08);}
.map p{margin:8px 0 0;text-align:right;font-size:16px;}

/* ---- Inner page banner --------------------------------------------------- */
.page-banner{position:relative;padding:200px var(--pad-x);background:#262525 center/cover no-repeat;text-align:center;}
.page-banner::before{content:"";position:absolute;inset:0;background:rgba(38,37,37,.42);}
.page-banner h1{position:relative;color:#fff;}
.page-banner--about{background-image:url("../imgs/banner-about.webp");}
.page-banner--services{background-image:url("../imgs/banner-services.webp");}

/* ---- About page ---------------------------------------------------------- */
.columns{display:grid;grid-template-columns:1fr 1fr;column-gap:2.5%;max-width:var(--max);margin:0 auto;padding:50px var(--pad-x) 80px;}
.columns .col-img{height:350px;width:auto;margin:0 auto 20px;border-radius:8px;box-shadow:0 10px 30px rgba(0,0,0,.12);}
.columns .lead-gap{padding-top:40px;}

/* ---- Services page rows -------------------------------------------------- */
.svc{scroll-margin-top:calc(var(--header-scrolled) + 16px);}
.svc:nth-child(even){background:var(--band-2);}
.svc .image-text{padding:50px var(--pad-x);}
.svc:first-child .image-text{padding-top:70px;padding-bottom:70px;}
.svc .body h2{color:var(--green-heading);}
.spacer{height:80px;}

/* ---- Footer -------------------------------------------------------------- */
.site-footer{background:var(--footer);color:var(--footer-text);}
.footer-inner{max-width:var(--max);margin:0 auto;padding:35px var(--pad-x) 0;text-align:center;}
.footer-inner p{margin:0;font-size:16px;color:var(--footer-text);}
.footer-inner .reg{margin-top:8px;font-size:15px;}
.footer-inner .credit{text-align:right;font-size:15px;padding:6px 0 4px;}
.footer-inner .credit a{color:var(--footer-link);text-decoration:none;}
.footer-inner .credit a:hover{opacity:.5;}

/* ---- Scroll reveal (fail-safe: content is visible unless JS arms it) ---- */
.reveal--armed{opacity:0;transform:translateY(18px);}
.reveal--armed.is-visible{opacity:1;transform:none;transition:opacity .6s ease,transform .6s ease;}

/* ---- Floating call button (phones) --------------------------------------- */
.call-fab{position:fixed;right:16px;bottom:16px;z-index:1005;display:none;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:var(--green-ink);color:#fff;box-shadow:0 8px 22px rgba(0,0,0,.25);transition:transform .25s ease,opacity .25s ease;}
.call-fab svg{width:24px;height:24px;}
.call-fab::before{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 0 rgba(85,119,36,.5);animation:call-pulse 2.4s ease-out 3s 3;}
@keyframes call-pulse{0%{box-shadow:0 0 0 0 rgba(85,119,36,.5);}100%{box-shadow:0 0 0 16px rgba(85,119,36,0);}}
.call-fab:focus-visible{outline-color:var(--green-ink);}

/* ---- 404 ----------------------------------------------------------------- */
.errorpage{max-width:720px;margin:72px auto 96px;padding:48px 32px;text-align:center;}
.errorpage-code{margin:0 0 8px;font-family:var(--serif);font-size:clamp(72px,14vw,120px);font-weight:700;line-height:1;letter-spacing:4px;color:var(--green-heading);}
.errorpage h1{margin:0 0 16px;font-size:clamp(28px,4vw,40px);color:var(--heading);}
.errorpage h1::after{content:"";display:block;width:90px;height:5px;margin:12px auto 0;border-radius:5px;background:var(--yellow);}
.errorpage-lead{max-width:36em;margin:0 auto 28px;font-size:18px;line-height:1.55;color:var(--text);}
.errorpage-actions{margin:0 0 32px;}
.errorpage-actions .btn{margin-top:0;}
.errorpage-links{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 28px;margin:0;padding:24px 0 0;border-top:1px solid var(--line);font-size:14px;font-weight:700;letter-spacing:.4px;}
.errorpage-links a{color:var(--green-ink);text-decoration:none;}
.errorpage-links a:hover{text-decoration:underline;}
.errorpage{margin-bottom:48px;}

/* ---- 404 mine-crushing snake (JS progressive enhancement) ---------------- */
.no-js .mine-snake{display:none;}
.mine-snake{background:var(--band);border-top:1px solid var(--line);padding:64px var(--pad-x) 80px;}
.mine-snake-inner{max-width:420px;margin:0 auto;text-align:center;}
.mine-snake h2{margin:0 0 12px;font-size:clamp(24px,3.5vw,32px);color:var(--green-heading);}
.mine-snake h2::after{content:"";display:block;width:72px;height:4px;margin:12px auto 0;border-radius:4px;background:var(--yellow);}
.mine-snake-lead{margin:0 0 24px;font-size:16px;line-height:1.55;color:var(--text);}
.mine-snake-hud{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 16px;margin:0 0 12px;font-size:14px;font-weight:700;color:var(--heading);}
.mine-snake-status{margin:0;font-weight:400;color:var(--text);}
.mine-snake-score{margin:0;}
.mine-snake-board{display:block;width:100%;max-width:360px;height:auto;margin:0 auto;border:1px solid var(--line);border-radius:8px;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,.06);touch-action:none;outline-offset:3px;}
.mine-snake-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:20px;margin:20px 0 12px;}
.mine-snake-controls .btn{margin-top:0;}
.mine-snake-pad{display:grid;grid-template-columns:repeat(3,44px);grid-template-rows:repeat(2,44px);gap:6px;justify-items:center;}
.mine-snake-dir{width:44px;height:44px;padding:0;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--heading);font-size:14px;line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.mine-snake-dir:hover,.mine-snake-dir:focus-visible{background:var(--band-2);border-color:var(--green-ink);}
.mine-snake-dir[data-dir="up"]{grid-column:2;grid-row:1;}
.mine-snake-dir[data-dir="left"]{grid-column:1;grid-row:2;}
.mine-snake-dir[data-dir="down"]{grid-column:2;grid-row:2;}
.mine-snake-dir[data-dir="right"]{grid-column:3;grid-row:2;}
.mine-snake-hint{margin:0;font-size:15px;color:var(--text);}

/* ---- Responsive ---------------------------------------------------------- */
@media (max-width:1024px){
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:979px){
  :root{--pad-x:20px;--header-h:103px;--header-scrolled:68px;}
  .is-scrolled .brand img{width:58px;}
  .nav-links > li > a::after{display:none;}
  .brand img{max-width:100px;}
  .header-inner{padding:0 var(--pad-x);}
  /* Modern toggle: three rounded lines on a soft round button that morph into an X when open. */
  .nav-toggle{position:relative;display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;padding:0;border:0;border-radius:50%;background:var(--band);color:var(--nav);cursor:pointer;transition:background-color .25s ease,color .25s ease;-webkit-tap-highlight-color:transparent;}
  .nav-toggle:hover{background:#e6e6e6;}
  .nav-toggle .bar{position:absolute;left:14px;width:20px;height:2px;border-radius:2px;background:currentColor;transition:transform .3s cubic-bezier(.65,.05,.36,1),opacity .2s ease,width .3s ease,top .3s ease;}
  .nav-toggle .bar:nth-child(2){top:17px;}
  .nav-toggle .bar:nth-child(3){top:23px;width:14px;}
  .nav-toggle .bar:nth-child(4){top:29px;}
  .nav-toggle:hover .bar:nth-child(3){width:20px;}
  .nav-toggle[aria-expanded="true"]{background:var(--green-ink);color:#fff;}
  .nav-toggle[aria-expanded="true"] .bar:nth-child(2){top:23px;transform:rotate(45deg);}
  .nav-toggle[aria-expanded="true"] .bar:nth-child(3){opacity:0;transform:translateX(8px);}
  .nav-toggle[aria-expanded="true"] .bar:nth-child(4){top:23px;transform:rotate(-45deg);}
  .nav{position:absolute;left:0;right:0;top:100%;display:none;background:#fff;box-shadow:0 6px 10px rgba(0,0,0,.08);}
  .nav[data-open="true"]{display:block;animation:menu-in .25s ease;}
  .no-js .nav{position:static;display:block;box-shadow:none;}
  .no-js .header-inner{flex-wrap:wrap;}
  .no-js .nav-toggle{display:none;}
  .nav-links{flex-direction:column;align-items:stretch;padding:10px var(--pad-x) 20px;}
  .nav-links > li > a,.nav-links > li:last-child > a{padding:10px 0 10px 20px;text-align:right;}
  .has-sub{flex-wrap:wrap;justify-content:flex-end;}
  .sub-toggle{margin-right:0;}
  .submenu{position:static;width:100%;min-width:0;margin:0;box-shadow:none;border-top:0;}
  .submenu::before,.submenu::after{display:none;}
  .has-sub:hover .submenu{display:none;}
  .has-sub:focus-within .submenu{display:none;}
  .submenu[data-open="true"]{display:block!important;}
  .submenu a{padding:10px 20px;line-height:1.4;white-space:normal;}
  .page-banner{padding:20px;}
  .section-title{padding-left:20px;padding-right:20px;}
  .hero{padding-left:20px;padding-right:20px;}
  .image-text,.tiles,.vm-grid,.contact,.columns,.map,.footer-inner,.svc .image-text,.svc:first-child .image-text{padding:20px;}
  .errorpage{margin:48px auto 48px;padding:32px 20px;}
  .mine-snake{padding:48px var(--pad-x) 64px;}
}
@media (max-width:800px){
  .tiles{grid-template-columns:1fr;}
}
@media (max-width:768px){
  .hero h1{font-size:36px;}
  .vm-grid > div{margin:10px 0 30px;}
}
@media (max-width:767px){
  .call-fab{display:inline-flex;}
  .js .call-fab{opacity:0;transform:scale(.6);pointer-events:none;}
  .js.is-scrolled .call-fab{opacity:1;transform:none;pointer-events:auto;}
  .image-text,.vm-grid,.contact,.columns,.contact-form{grid-template-columns:1fr;}
  .contact-form{grid-column:auto;}
  .image-text.flip .media{order:0;}
  .image-text .media{margin-bottom:20px;}
  .image-text .media img,.image-text.flip .media img{margin:0 auto;}
  .field input,.field textarea{width:100%;}
}
@media (max-width:500px){
  .hero h1{font-size:32px;}
  .image-text .media img{width:100%!important;}
  .columns .col-img{height:auto;}
  .section-title h2,.page-banner h1{margin:0;}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation:none!important;transition:none!important;}
  .hero{background-attachment:scroll;}
  .reveal--armed{opacity:1;transform:none;}
}