/* Fonts */
/* branding font */
@import url('https://cdn.fonts.net/t/1.css?apiType=css&projectid=b6ad2f95-8b9c-41ce-8e24-66c08ae7befb');

/* Benton-Sans */
@font-face {
  font-family: "Benton-Sans";
  src: url("https://www.bu.edu/cdn/fonts/Benton-Sans-Light/1d3e1be9-e2ca-44c3-b674-7228a7c97407-2.eot");
  src: url("https://www.bu.edu/cdn/fonts/Benton-Sans-Light/1d3e1be9-e2ca-44c3-b674-7228a7c97407-2.eot?") format("embedded-opentype"),
       url("https://www.bu.edu/cdn/fonts/Benton-Sans-Light/1d3e1be9-e2ca-44c3-b674-7228a7c97407-3.woff") format("woff"),
       url("https://www.bu.edu/cdn/fonts/Benton-Sans-Light/1d3e1be9-e2ca-44c3-b674-7228a7c97407-1.ttf") format("truetype");
  font-style: normal;
  font-weight: 300;
}

@font-face {
  font-family: "Benton-Sans";
  src: url("https://www.bu.edu/cdn/fonts/Benton-Sans-Light-Italic/15a2d62b-ca5c-45cb-9b3d-29bef80c6e9d-2.eot");
  src: url("https://www.bu.edu/cdn/fonts/Benton-Sans-Light-Italic/15a2d62b-ca5c-45cb-9b3d-29bef80c6e9d-2.eot?") format("embedded-opentype"),
       url("https://www.bu.edu/cdn/fonts/Benton-Sans-Light-Italic/15a2d62b-ca5c-45cb-9b3d-29bef80c6e9d-3.woff") format("woff"),
       url("https://www.bu.edu/cdn/fonts/Benton-Sans-Light-Italic/15a2d62b-ca5c-45cb-9b3d-29bef80c6e9d-1.ttf") format("truetype");
  font-style: italic;
  font-weight: 300;
}

@font-face {
  font-family: "Benton-Sans";
  src: url("https://www.bu.edu/cdn/fonts/Benton-Sans-Regular/019c3a13-b3d7-4c5a-be27-07a8334a43e6-2.eot");
  src: url("https://www.bu.edu/cdn/fonts/Benton-Sans-Regular/019c3a13-b3d7-4c5a-be27-07a8334a43e6-2.eot?") format("embedded-opentype"),
       url("https://www.bu.edu/cdn/fonts/Benton-Sans-Regular/019c3a13-b3d7-4c5a-be27-07a8334a43e6-3.woff") format("woff"),
       url("https://www.bu.edu/cdn/fonts/Benton-Sans-Regular/019c3a13-b3d7-4c5a-be27-07a8334a43e6-1.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: "Benton-Sans";
  src: url("https://www.bu.edu/cdn/fonts/Benton-Sans-Regular-Italic/3295fa07-2a3f-4cd1-ba86-e06161453a51-2.eot");
  src: url("https://www.bu.edu/cdn/fonts/Benton-Sans-Regular-Italic/3295fa07-2a3f-4cd1-ba86-e06161453a51-2.eot?") format("embedded-opentype"),
       url("https://www.bu.edu/cdn/fonts/Benton-Sans-Regular-Italic/3295fa07-2a3f-4cd1-ba86-e06161453a51-3.woff") format("woff"),
       url("https://www.bu.edu/cdn/fonts/Benton-Sans-Regular-Italic/3295fa07-2a3f-4cd1-ba86-e06161453a51-1.ttf") format("truetype");
  font-style: italic;
  font-weight: 400;
}

@font-face {
  font-family: "Benton-Sans";
  src: url("https://www.bu.edu/cdn/fonts/Benton-Sans-Medium/8e221891-e89b-4eae-95ca-6346d9a41d20-2.eot");
  src: url("https://www.bu.edu/cdn/fonts/Benton-Sans-Medium/8e221891-e89b-4eae-95ca-6346d9a41d20-2.eot?") format("embedded-opentype"),
       url("https://www.bu.edu/cdn/fonts/Benton-Sans-Medium/8e221891-e89b-4eae-95ca-6346d9a41d20-3.woff") format("woff"),
       url("https://www.bu.edu/cdn/fonts/Benton-Sans-Medium/8e221891-e89b-4eae-95ca-6346d9a41d20-1.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
}

@font-face {
  font-family: "Benton-Sans";
  src: url("https://www.bu.edu/cdn/fonts/Benton-Sans-Medium-Italic/289d6a90-eab9-4614-9e7d-c0df14839178-2.eot");
  src: url("https://www.bu.edu/cdn/fonts/Benton-Sans-Medium-Italic/289d6a90-eab9-4614-9e7d-c0df14839178-2.eot?") format("embedded-opentype"),
       url("https://www.bu.edu/cdn/fonts/Benton-Sans-Medium-Italic/289d6a90-eab9-4614-9e7d-c0df14839178-3.woff") format("woff"),
       url("https://www.bu.edu/cdn/fonts/Benton-Sans-Medium-Italic/289d6a90-eab9-4614-9e7d-c0df14839178-1.ttf") format("truetype");
  font-style: italic;
  font-weight: 500;
}

@font-face {
  font-family: "Benton-Sans-Comp";
  src: url("https://www.bu.edu/cdn/fonts/BentonSansComp-Bold/45b0ce09-9fae-45f1-8b3d-fdd995b91c6b-2.eot");
  src: url("https://www.bu.edu/cdn/fonts/BentonSansComp-Bold/45b0ce09-9fae-45f1-8b3d-fdd995b91c6b-2.eot?") format("embedded-opentype"),
	   url("https://www.bu.edu/cdn/fonts/BentonSansComp-Bold/45b0ce09-9fae-45f1-8b3d-fdd995b91c6b-3.woff") format("woff"),
	   url("https://www.bu.edu/cdn/fonts/BentonSansComp-Bold/45b0ce09-9fae-45f1-8b3d-fdd995b91c6b-1.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
}

@font-face {
  font-family: "Benton-Sans-Comp";
  src: url("https://www.bu.edu/cdn/fonts/BentonSansComp-Bold-Italic/c881d891-c9fe-443f-9067-4fd904cc7ec7-2.eot");
  src: url("https://www.bu.edu/cdn/fonts/BentonSansComp-Bold-Italic/c881d891-c9fe-443f-9067-4fd904cc7ec7-2.eot?") format("embedded-opentype"),
	   url("https://www.bu.edu/cdn/fonts/BentonSansComp-Bold-Italic/c881d891-c9fe-443f-9067-4fd904cc7ec7-3.woff") format("woff"),
	   url("https://www.bu.edu/cdn/fonts/BentonSansComp-Bold-Italic/c881d891-c9fe-443f-9067-4fd904cc7ec7-1.ttf") format("truetype");
  font-style: italic;
  font-weight: 700;
}

@font-face {
  font-family: "Benton-Sans-Comp";
  src: url("https://www.bu.edu/cdn/fonts/BentonSansComp-Black/3207ad65-d574-4dc0-8ddc-cfbe21c91dd1-2.eot");
  src: url("https://www.bu.edu/cdn/fonts/BentonSansComp-Black/3207ad65-d574-4dc0-8ddc-cfbe21c91dd1-2.eot?") format("embedded-opentype"),
	   url("https://www.bu.edu/cdn/fonts/BentonSansComp-Black/3207ad65-d574-4dc0-8ddc-cfbe21c91dd1-3.woff") format("woff"),
	   url("https://www.bu.edu/cdn/fonts/BentonSansComp-Black/3207ad65-d574-4dc0-8ddc-cfbe21c91dd1-1.ttf") format("truetype");
  font-style: normal;
  font-weight: 900;
}

@font-face {
  font-family: "Benton-Sans-Comp";
  src: url("https://www.bu.edu/cdn/fonts/BentonSansComp-Black-Italic/31575122-efa9-4080-a2c0-264add7bf098-2.eot");
  src: url("https://www.bu.edu/cdn/fonts/BentonSansComp-Black-Italic/31575122-efa9-4080-a2c0-264add7bf098-2.eot?") format("embedded-opentype"),
	   url("https://www.bu.edu/cdn/fonts/BentonSansComp-Black-Italic/31575122-efa9-4080-a2c0-264add7bf098-3.woff") format("woff"),
	   url("https://www.bu.edu/cdn/fonts/BentonSansComp-Black-Italic/31575122-efa9-4080-a2c0-264add7bf098-1.ttf") format("truetype");
  font-style: italic;
  font-weight: 900;
}


/* Variables*/
:root {
  --color-primary: 0, 100%;
  --color-secondary: 200, 100%;
  --color-offgrey: 200, 15%;
  --color-grey: 200, 5%;

  --content-base-mode: 45%;
  
  --content-heading-mode: 0%;

  --content-text-shade:  hsl( var( --color-grey ), 45% );
  --content-heading-shade:  hsl( var( --color-grey ), 0% );
  --content-link-shade:  hsl( var( --color-primary ), 40% );
  
  --global-box-shadow: 2px 2px clamp(1rem, 5vw, 3rem) #0002;
  --global-padding-block: clamp(1rem, 5vw, 3rem);
  --global-padding-inline: clamp(1rem, 5vw, 3rem);
  
  --main-width: min( 100%, 1200px );
  
  --form-border-radius: 0.25rem;
  --form-shadow: 0 0px 0px 1px rgba( 0, 0, 0, 0.05 ), inset 0 1px 2px 0px rgba( 0, 0, 0, 0.05 );
}

/* Base Styles */
html {
  /* background-color: hsl( var( --color-grey ), 0%); */
}

body {
  color: var( --content-text-shade );
  color: var( --content-heading-shade );
  font-family: "Benton-Sans","Helvetica",sans-serif;
  font-size: 18px;
  margin: 0;
}

:where( 
  *, 
  ::before, 
  ::after 
) {
  box-sizing: border-box;
}

:where( hr ) {
  border: 0;
  border-radius: 3px;
  background-color: hsl( var( --color-offgrey ), 95%);
  height: 3px;
}

:where(
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 
) {
  /* font-family: "Circular","Helvetica",sans-serif; */
  -webkit-font-smoothing: antialiased;
  font-weight: 700;
}

:where(
  h1,
  h2
) {
  font-weight: 900;
}

h1 {
  font-size: 2em;
}
h2 {
  font-size: 1.52828em;
}
h3 {
  font-size: 1.24192em;
}
h4 {
  font-size: 1.08839em;
}
h5 {
  font-size: 1.02138em;
}
h6 {
  font-size: 1em;
}

@media (min-width: 500px) {
  h1 {
    font-size: 3.05556em;
  }
  h2 {
    font-size: 2.08591em;
  }
  h3 {
    font-size: 1.49729em;
  }
  h4 {
    font-size: 1.18169em;
  }
  h5 {
    font-size: 1.04395em;
  }
  h6 {
    font-size: 1em;
  }
}

:where( a ) {
  color: var( --content-link-shade );
  text-decoration: none;
  
  -webkit-font-smoothing: antialiased;
  -webkit-text-decoration-skip: objects;
}

:where(
  a:hover,
  a:active
) {
  text-decoration: underline;
}

:where( table ) {
  border: 1px solid hsl( var( --color-offgrey), 90% );
  border-collapse: collapse;
  empty-cells: show;
  margin: 30px 0;
  width: 100%;
}

:where( table thead ) {
  background: hsl( var( --color-offgrey), 95% );
  color: hsl( var( --color-offgrey), 0% );
  text-align: left;
  vertical-align: bottom;
}

 :where( table td, table th ) {
  border-left: 1px solid hsl( var( --color-offgrey), 90% );
  font-size: inherit;
  margin: 0;
  overflow: visible;
  padding: .5em 1em;
}

:where( table th ) {
  border-bottom: 1px solid hsl( var( --color-offgrey), 90% );
}

:where( table td ) {
  border-bottom: 1px solid hsl( var( --color-offgrey), 90% );
  background-color: rgba(0, 0, 0, 0);
  vertical-align: top;
}

:where( form ) {
  font-family: "Circular","Helvetica",sans-serif;
  -webkit-font-smoothing: antialiased;
}
:where( fieldset ) {
  border: 1px solid hsl( var( --color-offgrey ), 90%);
  border-radius: var( --form-border-radius );
  margin-bottom: 1.5rem;
}

:where( label ) {
  display: block;
  margin-top: 0.75rem;
  font-weight: 500;
}

:where( label.inline ) {
  display: inline;
  font-weight: normal;
}

:where( 
  input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="range"]):not([type="file"]),
  select,
  textarea
) {
  background-color: hsl( var( --color-offgrey ), 95%);
  border: 0;
  box-shadow: var( --form-shadow );
  display: block;
  margin-top: 0.25rem;
  padding-block: 0.75em;
  padding-inline: 1.5em;
  width: 100%;
}

:where( 
  input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="range"]):not([type="file"])
) {
  border-radius: var( --form-border-radius );
}

:where( button ) {
  margin-top: 0.5rem;
  margin-right: 0.5rem;
}

:where(
  :is(
    .button,
    button, 
    input[type="submit"],
    input[type="reset"], 
    input[type="button"], 
    input[type="image"]
  )
) {
  -webkit-font-smoothing: antialiased;
  background-color: hsl( var( --color-primary ), 40%);
  border: 1px solid hsl( var( --color-primary ), 40%);
  border-radius: var( --form-border-radius );
  color: hsl( var( --color-offgrey), 100% );
  display: inline-block;
  font-family: "Benton-Sans-Comp";
  font-size: 1rem;
  font-weight: bold;
  letter-spacing: 0.1em;
  line-height: 1.25em;
  padding-block: 0.75rem;
  padding-inline: 1.5rem;
  text-decoration: none;
  text-transform: uppercase;
}

:where(
  :is(
    .button:hover,
    button:hover, 
    input[type="submit"]:hover, 
    input[type="reset"]:hover, 
    input[type="button"]:hover, 
    input[type="image"]:hover
  )
) {
  background-color: hsl( var( --color-primary ), 45%);
  text-decoration: none;
}

:where(
  :is(
    .button:active,
    button:active, 
    input[type="submit"]:active, 
    input[type="reset"]:active, 
    input[type="button"]:active, 
    input[type="image"]:active
  )
) {
  background-color: hsl( var( --color-primary ), 35%);
  text-decoration: none;
}

:where(
  :is(
    .button
  )
) {
  background-color: hsl( var( --color-primary ), 40%);
}

:where(
  :is(
    .button:hover
  )
) {
  background-color: hsl( var( --color-primary ), 45%);
}

:where(
  :is(
    .button:active
  )
) {
  background-color: hsl( var( --color-primary ), 35%);
}

:where(
  :is(
    .button-secondary
  )
) {
  background-color: hsl( var( --color-offgrey ), 90% );
  border-color: hsl( var( --color-offgrey ), 66% );
  color: hsl( var( --color-offgrey ), 33% );
}

:where(
  :is(
    .button-secondary:hover
  )
) {
  background-color: hsl( var( --color-offgrey ), 95%);
}

:where(
  :is(
    .button-secondary:active
  )
) {
  background-color: hsl( var( --color-offgrey ), 85%);
}

:where(
  :is(
    button[disabled]
  )
) {
  background-color: hsl( var( --color-offgrey ), 95%);
  border-color: hsl( var( --color-offgrey ), 95%);
  color: var( --base-color );
  opacity: 0.5;
}

/* Layout */
:where( header ) {
  background-color:  hsl( var( --color-offgrey ), 100%);
  box-shadow: 0 0px 0px 1px rgba( 0, 0, 0, 0.05 ), 0 4px 4px 0px rgba( 0, 0, 0, 0.125 );
  font-family: "Whitney SSm A","Whitney SSm B","Helvetica","Arial",sans-serif;
  line-height: 1.3;
  padding-block: var( --global-padding-block );
  padding-inline: var( --global-padding-inline );
  position: relative;
}

:where( .wrapper ) {
  align-items: center;
  background-color:  hsl( var( --color-grey ), 95%);
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  padding-block: var( --global-padding-block );
  padding-inline: var( --global-padding-inline );
}

:where( main ) {
  background-color: hsl( var( --color-offgrey ), 100%);
  border-radius: var( --form-border-radius );
  border-top: 0.50rem solid hsl( var( --color-primary ), 40%);
  box-shadow: var( --global-box-shadow );
  padding-block: var( --global-padding-block );
  padding-inline: var( --global-padding-inline );
  width: var( --main-width );
}

:where( main * ) {
  margin-block: 0;
}

:where( main * + * ) {
  margin-block-start: 1em;
}

:where( footer ) {
  /* --content-text-shade:  hsl( var( --color-grey ), 55% );
  --content-heading-shade:  hsl( var( --color-grey ), 100% );
  --content-link-shade:  hsl( var( --color-secondary ), 66% );
   */
  /* background-color: var( --footer-background-color); */
  font-family: "Whitney SSm A","Whitney SSm B","Helvetica","Arial",sans-serif;
  line-height: 1.3;
  padding-block: var( --global-padding-block );
  padding-inline: var( --global-padding-inline );
}

:where( footer * ) {
  margin-block: 0;
}

:where( footer * + * ) {
  margin-block-start: 0.5em;
}

/* Branding */
:where( .brand ) {
display: flex;
  align-content: center;
  align-items: center;
  gap: 1em;
  flex-wrap: nowrap;
}

:where( .brand * ) {
  color: var( --content-heading-shade);
  text-decoration: none;
  -webkit-font-smoothing: antialiased;
}

:where( .brand-masterplate ) {
  background: url("https://www.bu.edu/cdn/images/logos/masterplate112x50.png") no-repeat 0 0;
  background-position: center;
  background-size: contain;
  display: block;
  height: 50px;
  width: 112px;
}

:where( .brand-masterplate ) {
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
}