*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:#F7F6F3;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:#A85800;text-decoration:none;transition:background 180ms cubic-bezier(.2,0,.2,1),color 180ms cubic-bezier(.2,0,.2,1),border-color 180ms cubic-bezier(.2,0,.2,1)}

/* Visible keyboard focus on every interactive element */
a:focus-visible{outline:2px solid #1E1E1C;outline-offset:3px}

.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:#1E1E1C;color:#F7F6F3;padding:12px 20px;font-size:14px;font-weight:600}
.skip-link:focus{left:0}

/* Nav and footer links: colour lives here, not inline, so :hover can win */
.logo-link{color:#1E1E1C}
.logo-link img{transition:transform 220ms cubic-bezier(.2,0,.2,1)}
.logo-link:hover img{transform:rotate(-18deg)}
.nav-link{color:#55524C}
.nav-link:hover{color:#1E1E1C}
.foot-link{color:#6E6A62}
.foot-link:hover{color:#1E1E1C}

.back-link{display:inline-block;margin-bottom:34px;font-size:14px;font-weight:600;color:#55524C}
.back-link::before{content:"←";display:inline-block;margin-right:9px;transition:transform 180ms cubic-bezier(.2,0,.2,1)}
.back-link:hover{color:#1E1E1C}
.back-link:hover::before{transform:translateX(-4px)}

[class^="h"]{transition:background 180ms cubic-bezier(.2,0,.2,1),color 180ms cubic-bezier(.2,0,.2,1),border-color 180ms cubic-bezier(.2,0,.2,1)}
.h1:hover{background: #FF8902 !important;color: #1E1E1C !important}
.h2:hover{background: #1E1E1C !important;color: #F7F6F3 !important}
.h3:hover{border-color: #1E1E1C !important}
.h4:hover{border-color: #FF8902 !important}
.h5:hover{border-color: #B5BE61 !important}
.h6:hover{border-color: #4E4E4E !important}
.h7:hover{color: #FF8902 !important}

@media (max-width:900px){
  section,header>div,footer>div{padding-left:24px !important;padding-right:24px !important}
  section{padding-top:64px !important}
  html{scroll-padding-top:80px}
  h1{font-size:44px !important}
  h2{font-size:32px !important}
  .panel-vision{padding:36px !important}
  .panel-contact{padding:44px 28px !important}
}

/* Stack the header before the wordmark and the Contact button collide */
@media (max-width:640px){
  .header-bar{flex-direction:column;align-items:flex-start !important;gap:14px !important;padding-top:14px !important;padding-bottom:14px !important}
  .site-nav{width:100%;justify-content:space-between;gap:16px !important}
  html{scroll-padding-top:132px}
  .footer-bar{flex-direction:column;align-items:flex-start !important;gap:18px !important}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition-duration:0.01ms !important}
}

@media print{header{position:static !important}}
