/**
 * Scaling Made Easy - base layer.
 * Design tokens, reset, typography scale, buttons.
 * Values transcribed exactly from the approved prototype. Do not retune.
 */

:root{
  --black:#000;
  --soft-black:#080808;
  --white:#fff;
  --cream:#faf9f6;
  --gold:#c9a84c;
  --gold-hover:#e8c96a;
  --grey:#8a8a8a;
  --line:rgba(0,0,0,.08);
  --line-dark:rgba(255,255,255,.12);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}

body{
  font-family:"NHG Text",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--soft-black);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
  line-height:1.6;
}

h1,h2,h3,h4,.display{font-family:"NHG Display",sans-serif;font-weight:400;}
.medium{font-family:"NHG Display",sans-serif;font-weight:500;}

.eyebrow{
  font-family:"NHG Text",sans-serif;
  font-size:15px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--gold);
}

/* All CTA buttons are Display 65 Medium. This is the heaviest weight
   licensed, so it is what "bold" means on this site. */
.btn{
  font-family:"NHG Display",sans-serif;
  font-weight:500;
  text-decoration:none;
  display:inline-block;
  transition:all .2s;
}

/* Layout containers */
.container{max-width:1200px;margin:0 auto;padding:0 40px;}
.wide{max-width:1400px;margin:0 auto;padding:0 40px;}

.section-black{background:var(--black);color:var(--white);padding:140px 0;}
.section-white{background:var(--white);color:var(--soft-black);padding:140px 0;}

/* Accessibility */
.screen-reader-text{
  position:absolute;width:1px;height:1px;overflow:hidden;
  clip:rect(1px,1px,1px,1px);white-space:nowrap;
}
a:focus-visible,button:focus-visible,input:focus-visible{
  outline:2px solid var(--gold);outline-offset:3px;
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}