/* UTILITY STYLES */

/* defaults */
* {
  --text-stroke-width: 0;
  -webkit-text-stroke-width: var(--text-stroke-width);
  --border-radius: 0;
  border-radius: var(--border-radius);
  --border-width: 0;
  border-width: var(--border-width);
  border-style: solid;
}

/* variables */
html {
  /* small section padding */
  --vt1: var(--size3);
  --vb1: var(--size3);
  /* medium section padding */
  --vt2: var(--size5);
  --vb2: var(--size5);
  /* large section padding */
  --vt3: var(--size9);
  --vb3: var(--size9);
  /* page padding */
  --pp1: 3.5rem;
  /* max width */
  --mw1: 95%;
  --mw2: 85%;
  --mw3: 72%;
  /* stroke width */
  --sw1: var(--bw1);
  --sw2: var(--bw2);
  /* border radius */
  --br1: 0.25rem;
  --br2: 0.5rem;
  --br3: 100vw;
  /* border width */
  --bw1: 1.5px;
  --bw2: 3px;
  /* default grid gap */
  --default-grid-gap: 1rem;
  --default-row-gap: var(--default-grid-gap);
  --default-column-gap: var(--default-grid-gap);
  /* spacing scale */
  --spacing-scale: 1;
}
/* tablet */
@media screen and (max-width: 991px) {
  html {
    /* page padding */
    --pp1: 3.5rem;
    /* max width */
    --mw1: 100%;
    --mw2: 100%;
    --mw3: 100%;
    /* spacing scale */
    --spacing-scale: 0.75;
  }
}
/* landscape */
@media screen and (max-width: 767px) {
  html {
    /* page padding */
    --pp1: 2.5rem;
    /* spacing scale */
    --spacing-scale: 0.5;
  }
}
/* portrait */
@media screen and (max-width: 479px) {
  html {
    /* page padding */
    --pp1: 2.5rem;
  }
}

/* section styles */
section,
header,
footer {
  position: relative;
  padding-top: var(--vt2);
  padding-bottom: var(--vb2);
}
/* small */
[class*="vt1"],
[vertical-top="1"] {
  padding-top: var(--vt1);
}
[class*="vb1"],
[vertical-bottom="1"] {
  padding-bottom: var(--vb1);
}
/* medium */
[class*="vt2"],
[vertical-top="2"] {
  padding-top: var(--vt2);
}
[class*="vb2"],
[vertical-bottom="2"] {
  padding-bottom: var(--vb2);
}
/* large */
[class*="vt3"],
[vertical-top="3"] {
  padding-top: var(--vt3);
}
[class*="vb3"],
[vertical-bottom="3"] {
  padding-bottom: var(--vb3);
}
/* none */
[class*="vt0"],
[vertical-top="0"] {
  padding-top: 0;
}
[class*="vb0"],
[vertical-bottom="0"] {
  padding-bottom: 0;
}

/* container styles */
.w-container {
  position: relative;
  padding-left: var(--pp1);
  padding-right: var(--pp1);
  width: 100%;
  max-width: var(--mw1);
}
/* page padding */
[class*="pp1"] {
  padding-left: var(--pp1);
  padding-right: var(--pp1);
}
[class*="pp0"] {
  padding-left: 0;
  padding-right: 0;
}
/* max width */
[class*="mw1"] {
  max-width: var(--mw1);
}
[class*="mw2"] {
  max-width: var(--mw2);
}
[class*="mw0"] {
  max-width: none;
}

/* stroke width */
[class*="sw1"] {
  --text-stroke-width: var(--sw1);
}
[class*="sw2"] {
  --text-stroke-width: var(--sw2);
}
[class*="sw0"] {
  --text-stroke-width: 0px;
}

/* border radius */
[class*="br1"] {
  --border-radius: var(--br1);
}
[class*="br2"] {
  --border-radius: var(--br2);
}
[class*="br3"] {
  --border-radius: var(--br3);
}
[class*="br0"] {
  --border-radius: 0rem;
}

/* border width */
[class*="bw1"] {
  border-width: var(--bw1);
  border-style: solid;
}
[class*="bw2"] {
  border-width: var(--bw2);
  border-style: solid;
}
[class*="bw0"] {
  border-width: 0;
}

/* border direction */
/**%{{border: top}**/
[class*="bw1t"],
[class*="bw2t"] {
  border-bottom-width: 0;
  border-left-width: 0;
  border-right-width: 0;
} /**}%**/

/**%{{border: bottom}**/
[class*="bw1b"],
[class*="bw2b"] {
  border-top-width: 0;
  border-left-width: 0;
  border-right-width: 0;
} /**}%**/

/**%{{border: left}**/
[class*="bw1l"],
[class*="bw2l"] {
  border-top-width: 0;
  border-bottom-width: 0;
  border-right-width: 0;
} /**}%**/

/**%{{border: right}**/
[class*="bw1r"],
[class*="bw2r"] {
  border-top-width: 0;
  border-bottom-width: 0;
  border-left-width: 0;
} /**}%**/

/**%{{border: vertical}**/
[class*="bw1v"],
[class*="bw2v"] {
  border-left-width: 0;
  border-right-width: 0;
} /**}%**/

/**%{{border: horizontal}**/
[class*="bw1h"],
[class*="bw2h"] {
  border-top-width: 0;
  border-bottom-width: 0;
} /**}%**/

/* pointer events */
[class*="pe0"] {
  pointer-events: none;
}
[class*="pe1"] {
  pointer-events: auto;
}
/**%{{pointer-events: children}**/
[class*="pe2"] {
  pointer-events: none;
}
[class*="pe2"] > * {
  pointer-events: auto;
}
/**}%**/

/* icon styles */
/**%#**/
[class*="ic1"] svg,
[class*="ic2"] svg {
  width: 100% !important;
  height: 100% !important;
}
/**#%**/
[class*="ic1"] * {
  fill: currentColor !important;
}
[class*="ic2"] * {
  stroke: currentColor !important;
}

/* cover */
[class*="cf1"] {
  width: 100%;
  height: 100%;
}
[class*="ca1"] {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
