@import url(styles/fonts.css);
@import url(styles/reset.css);
@import url(styles/layout.css);
@import url(styles/flex.css);
@import url(styles/grid.css);
@import url(styles/util.css);
@import url(styles/hero.css);
@import url(styles/accordion.css);
@import url(styles/carousel.css);
@import url(styles/tiles.css);
@import url(styles/card.css);
@import url(styles/counter.css);
@import url(styles/background-fw.css);
@import url(styles/tabs.css);

:root {
  --content-width: 1200px;
  --bdy-sp: 1rem;

  --clr-light: #f0f0f0;
  --clr-accent: #ff2d37;
  --clr-bg-light: #f0f0f0;

  /* DEFAULT */
  --def-clr-bg: #fff;
  --def-clr-txt: #000;
  --def-ff: "Montserrat", Arial, sans-serif;
  --def-lh: 1.8;

  /* LINKS */
  --lnk-clr: #ff2d37;
  --lnk-fw: 500;

  /* BORDERS */
  --bdr-clr: #cfcfcf;
  --bdr-wdh: 1px;

  /* FOCUS */
  --fcs-clr: #08f;
  --fcs-wdh: 3px;

  /* HEADER */
  --hdr-clr-bg: #fff;
  --hdr-clr-txt: inherit;
  --hdr-pad: 1rem;

  /* FOOTER */
  --ftr-clr-bg: #333;
  --ftr-clr-txt: #fff;
  --ftr-pad: 1rem;

  /* BUTTON */
  --btn-clr-bg: #000;
  --btn-clr-txt: #fff;
  --btn-fw: 600;
  --btn-pad-crs: 1.25em 2.5em;
  --btn-pad-prc: 0.75em 1.5em;

  /* FULL WIDTH BACKGROUNDS */
  --fwb-pad-s: 1rem;
  --fwb-pad-m: 2rem;
  --fwb-pad-l: 3rem;
  --fwb-clr-bg: #f0f0f0;


  /* ACCORDIONS */
  --acc-dur: 250ms;
  --acc-hdg-bg: #f0f0f0;
  --acc-hdg-txt: #000;
  --acc-in-fnc: ease-out;
  --acc-out-fnc: ease-in;
  --acc-pad-h: 1rem;
  --acc-pad-v: 2rem;
  --acc-pnl-bg: transparent;
  --acc-pnl-txt: #000;

  /* ROW, COLUMN */
  --col-sp: 1rem;
  --row-sp: 1rem;

  /* CARDS */
  --crd-ar-s: 3/2;
  --crd-ar-m: 3/4;
  --crd-ar-l: 3/4;
  --crd-clr-bg: #fff;
  --crd-clr-txt: #000;
  --crd-dur: 250ms;
  --crd-fw: 600;
  --crd-in-fnc: ease-out;
  --crd-out-fnc: ease-in;
  --crd-ovl-clr: rgb(0 0 0 / 0.3);
  --crd-pad: 0.75em 1.5em;
  --crd-shd-clr: rgb(0 0 0 / 0.5);
  --crd-shd-wdh: 1rem;

  /* HERO */
  --hro-ar-mob: 16/9;
  --hro-clr-bg-dkt: #fff;
  --hro-clr-bg-mob: #fff;
  --hro-clr-txt-dkt: inherit;
  --hro-clr-txt-mob: inherit;
  --hro-cnt-oft-dkt: -2.5rem;
  --hro-cnt-oft-mob: -5rem;
  --hro-cnt-sp-dkt: 3rem;
  --hro-cnt-sp-mob: 0;
  --hro-gap: 0 0;
  --hro-img-oft-dkt: -2.5rem;
  --hro-img-oft-mob: 0;
  --hro-pad-dkt: 2rem;
  --hro-pad-mob: 1.5rem;
  --hro-prm-cnt-bg-dkt: #f0f0f0;
  --hro-prm-cnt-bg-mob: #f0f0f0;

  /* SHADOWS */
  --shd-clr: rgb(0 0 0 / 0.2);
  --shd-wdh: 0.5rem;

  /* TEXT SCALING VIEWPORT RAGES */
  --fs-vp-max: 1200;
  --fs-vp-min: 480;

  /* TEXT SCALING FONT SIZE RANGES */
  --fs-s-max: 13;
  --fs-s-min: 11;
  --fs-m-max: 15;
  --fs-m-min: 13;
  --fs-l-max: 18;
  --fs-l-min: 15;
  --fs-xl-max: 20;
  --fs-xl-min: 16;
  --fs-xxl-max: 24;
  --fs-xxl-min: 18;
  --fs-xxxl-max: 32;
  --fs-xxxl-min: 20;

  /* FONT WEIGHTS */
  --fw-light: 300;
  --fw-normal: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-heavy: 900;

  /* TEXT BLOCKS SPACING */
  --txt-sp-def: 0.75em;

  /* SPACINGS */
  --sp-xxs: 0.25rem;
  --sp-xs: 0.5rem;
  --sp-s: 1rem;
  --sp-m: 2rem;
  --sp-l: 3rem;
  --sp-xl: 5rem;
  --sp-xxl: 8rem;

  --_fs-s-sf: calc((var(--fs-s-max) - var(--fs-s-min)) / (var(--fs-vp-max) - var(--fs-vp-min)));
  --_fs-m-sf: calc((var(--fs-m-max) - var(--fs-m-min)) / (var(--fs-vp-max) - var(--fs-vp-min)));
  --_fs-l-sf: calc((var(--fs-l-max) - var(--fs-l-min)) / (var(--fs-vp-max) - var(--fs-vp-min)));
  --_fs-xl-sf: calc((var(--fs-xl-max) - var(--fs-xl-min)) / (var(--fs-vp-max) - var(--fs-vp-min)));
  --_fs-xxl-sf: calc((var(--fs-xxl-max) - var(--fs-xxl-min)) / (var(--fs-vp-max) - var(--fs-vp-min)));
  --_fs-xxxl-sf: calc((var(--fs-xxxl-max) - var(--fs-xxxl-min)) / (var(--fs-vp-max) - var(--fs-vp-min)));

  --fs-s: clamp(
    calc(var(--fs-s-min) / 16 * 1rem),
    calc(var(--_fs-s-sf) * 100vw + (var(--fs-s-min) - var(--_fs-s-sf) * var(--fs-vp-min)) / 16 * 1rem),
    calc(var(--fs-s-max) / 16 * 1rem)
  );
  --fs-m: clamp(
    calc(var(--fs-m-min) / 16 * 1rem),
    calc(var(--_fs-m-sf) * 100vw + (var(--fs-m-min) - var(--_fs-m-sf) * var(--fs-vp-min)) / 16 * 1rem),
    calc(var(--fs-m-max) / 16 * 1rem)
  );
  --fs-l: clamp(
    calc(var(--fs-l-min) / 16 * 1rem),
    calc(var(--_fs-l-sf) * 100vw + (var(--fs-l-min) - var(--_fs-l-sf) * var(--fs-vp-min)) / 16 * 1rem),
    calc(var(--fs-l-max) / 16 * 1rem)
  );
  --fs-xl: clamp(
    calc(var(--fs-xl-min) / 16 * 1rem),
    calc(var(--_fs-xl-sf) * 100vw + (var(--fs-xl-min) - var(--_fs-xl-sf) * var(--fs-vp-min)) / 16 * 1rem),
    calc(var(--fs-xl-max) / 16 * 1rem)
  );
  --fs-xxl: clamp(
    calc(var(--fs-xxl-min) / 16 * 1rem),
    calc(var(--_fs-xxl-sf) * 100vw + (var(--fs-xxl-min) - var(--_fs-xxl-sf) * var(--fs-vp-min)) / 16 * 1rem),
    calc(var(--fs-xxl-max) / 16 * 1rem)
  );
  --fs-xxxl: clamp(
    calc(var(--fs-xxxl-min) / 16 * 1rem),
    calc(var(--_fs-xxxl-sf) * 100vw + (var(--fs-xxxl-min) - var(--_fs-xxxl-sf) * var(--fs-vp-min)) / 16 * 1rem),
    calc(var(--fs-xxxl-max) / 16 * 1rem)
  );
}








