@layer normalize, layout, branding, oneoffs;
@import url('./modern-normalize-min.css') layer(normalize);
@import url('./layout.css') layer(layout);
@import url('./branding.css') layer(branding);
@import url('./oneoffs.css') layer(oneoffs);

/* Fonts */
/* work-sans-200 - latin */
@font-face {
  font-family: "Work Sans";
  font-style: normal;
  font-weight: 200;
  src: local("Work Sans ExtraLight"), local("WorkSans-ExtraLight"), url("../fonts/work-sans-v5-latin-200.woff2") format("woff2"), url("../fonts/work-sans-v5-latin-200.woff") format("woff");
  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* work-sans-regular - latin */
@font-face {
  font-family: "Work Sans";
  font-style: normal;
  font-weight: 400;
  src: local("Work Sans"), local("WorkSans-Regular"), url("../fonts/work-sans-v5-latin-regular.woff2") format("woff2"), url("../fonts/work-sans-v5-latin-regular.woff") format("woff");
  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* work-sans-700 - latin */
@font-face {
  font-family: "Work Sans";
  font-style: normal;
  font-weight: 700;
  src: local("Work Sans Bold"), local("WorkSans-Bold"), url("../fonts/work-sans-v5-latin-700.woff2") format("woff2"), url("../fonts/work-sans-v5-latin-700.woff") format("woff");
  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* Urbanist - Regular */
@font-face {
  font-family: "Urbanist";
  font-style: normal;
  font-weight: 400;
  src: local("Urbanist Regular"), local("Urbanist-Regular"), url("../fonts/Urbanist-Regular.woff2") format("woff2");
}
/* Local Gothic-regular */
@font-face {
  font-family: "Local Gothic";
  font-style: normal;
  font-weight: 400;
  src: local("Local Gothic"), local("LocalGothic-Regular"), url("../fonts/LocalGothic-Regular-Web.woff2") format("woff2");
}



/* Sitewide Vaiables */
:root{
    /*Size Scale*/
    --ratio: 1.5;
    --s-5: calc(1rem * pow(var(--ratio), -5));
    --s-4: calc(1rem * pow(var(--ratio), -4));
    --s-3: calc(1rem * pow(var(--ratio), -3));
    --s-2: calc(1rem * pow(var(--ratio), -2));
    --s-1: calc(1rem * pow(var(--ratio), -1));
    --s0: calc(1rem * pow(var(--ratio), 0));
    --s1: calc(1rem * pow(var(--ratio), 1));
    --s2: calc(1rem * pow(var(--ratio), 2));
    --s3: calc(1rem * pow(var(--ratio), 3));
    --s3h: calc(1rem * pow(var(--ratio), 3.5));
    --s4: calc(1rem * pow(var(--ratio), 4));
    --s4h: calc(1rem * pow(var(--ratio), 4.5));
    --s5: calc(1rem * pow(var(--ratio), 5));
    --s6: calc(1rem * pow(var(--ratio), 6));
    --s7: calc(1rem * pow(var(--ratio), 7));
    
    /*Layout Sizes*/
    --switcher-threshold: 55rem;
    --switcher-limit: 3;
    --measure: 120ch;

    /* Type Faces */
    --font-family-body: 'Urbanist', sans-serif;
    --font-family-display: 'Local Gothic', sans-serif;
    /*Type Sizes*/
    --font-size-body: var(--s0);

    /*Colors*/
    --color-card-bg: hsl(156, 24%, 90%);
    --color-bright-bg: hsl(156,24%,75%);
    --color-dark-bg: black;
    --color-body-text: hsl(24, 11%, 9%);
    --color-accent: hsl(295, 100%, 89%);
    --color-accent1: hsl(48, 100%, 64%);
    --color-accent2: hsl(21, 95%, 54%);
    --color-accent3: hsl(20, 100%, 91%);
    --color-accent-outline: hsl(120, 11%, 36%);
    --color-accent4: hsl(21, 9%, 69%);
    --color-accent5: hsl(21, 98.5%, 25%);


}