/* 20-20 HSE Consulting — shared styles
   Most layout and colour is inline on each element (exported from the design).
   This file holds global resets, hover states and responsive rules. */

:root{
  --midnight:#084D50; --teal-deep:#146666; --teal:#07898F;
  --green-light:#AEFF98; --lime:#A0EF22; --mint:#E3F9DC; --mint-tint:#F4FBF1;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;font-family:'Figtree',ui-sans-serif,system-ui,'Segoe UI',sans-serif;color:#146666;background:#fff;-webkit-font-smoothing:antialiased}
img{max-width:100%}
h1,h2,h3,h4,p,ul{margin:0}
a{color:#07898F}a:hover{color:#084D50}
:focus-visible{outline:3px solid #A0EF22;outline-offset:2px}

/* Navigation */
.nl{color:#084D50;text-decoration:none}.nl:hover{color:#07898F}
.dd{position:relative}
.dd-menu{display:none !important}
.dd:hover .dd-menu,.dd:focus-within .dd-menu{display:flex !important}

/* Cards and buttons */
.lift{transition:transform .2s ease,box-shadow .2s ease}
.lift:hover{transform:translateY(-4px);box-shadow:0 28px 48px -24px rgba(8,77,80,.45)}
.btn{transition:background-color .2s ease,color .2s ease,border-color .2s ease}
.btn-lime:hover{background:#AEFF98 !important;color:#084D50 !important}
.btn-ghost:hover{background:rgba(174,255,152,.14) !important;color:#fff !important}
.btn-teal:hover{background:#084D50 !important;color:#fff !important}
.btn-outline:hover{background:#ffffff !important}

/* Forms */
.fld:focus{outline:none;border-color:#07898F !important;box-shadow:0 0 0 3px rgba(160,239,34,.45)}
.form-status{display:none;padding:16px 20px;border-radius:14px;background:#E3F9DC;color:#084D50;font-weight:600}
.form-status.show{display:block}

/* Mobile menu */
header .btn-lime{white-space:nowrap}
@media (max-width:420px){header .btn-lime{padding:0 16px !important;font-size:14px !important}}
.menu-btn{display:none !important;cursor:pointer}
@media (max-width:900px){
  .nav{display:none !important}
  .menu-btn{display:inline-flex !important}
  .hide-sm{display:none !important}
  header.nav-open .nav{
    display:flex !important;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;align-items:flex-start !important;gap:4px !important;
    padding:12px 32px 24px;background:#fff;border-bottom:1px solid #E3F9DC;
    box-shadow:0 24px 48px -24px rgba(8,77,80,.35)
  }
  header.nav-open .nav .dd{flex-direction:column}
  header.nav-open .nav .dd-menu{display:flex !important;position:static !important;width:auto !important;box-shadow:none !important;border:0 !important;padding:0 0 0 12px !important}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .lift,.btn{transition:none}
  .lift:hover{transform:none}
}