:root {
  --base-h1-fontSize: @base-h1-fontSize;
  --base-h1-lineHeight: @base-h1-lineHeight;

  --base-h2-fontSize: @base-h2-fontSize;
  --base-h2-lineHeight: @base-h2-lineHeight;

  --base-h3-fontSize: @base-h3-fontSize;
  --base-h3-lineHeight: @base-h3-lineHeight;

  --base-link-color-base: @base-link-color-base;
  --base-link-color-hover: @base-link-color-hover;

  --base-btn-padding-vertical: @base-btn-padding-vertical;
  --base-btn-padding-horizontal: @base-btn-padding-horizontal;

  --base-btn-borderWidth: @base-btn-borderWidth;
  --base-btn-borderRadius: @base-btn-borderRadius;

  --base-btn-backgroundColor-base: @base-btn-backgroundColor-base;
  --base-btn-color-base: @base-btn-color-base;
  --base-btn-borderColor-base: @base-btn-borderColor-base;

  --base-btn-backgroundColor-hover: @base-btn-backgroundColor-hover;
  --base-btn-color-hover: @base-btn-color-hover;
  --base-btn-borderColor-hover: @base-btn-borderColor-hover;

  --base-btn-outlineColor-focus: @base-btn-outlineColor-focus;
}

html {
  box-sizing: border-box;
  cursor: default;
  text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

*,
::after,
::before {
  box-sizing: inherit;
}

body {
  #common.text-base();
  #common.box-base();
  font-family: var(--common-fontFamily-primary);
  overflow-y: scroll;
  min-width: 320px;
  font-display: swap;
  margin: 0;
}

h1,
h2,
h3 {
  margin-top: 0;
  margin-bottom: 0;
}

h1,
.h1 {
  #base.h1();
}

h2,
.h2 {
  #base.h2();
}

h3,
.h3 {
  #base.h3();
}

ul,
ol {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
  list-style-type: none;
}

p {
  margin-top: 0;
  margin-bottom: 0;
}

figure {
  margin: 0;
}

a {
  #base.link();
  text-decoration: none;

  &:not([href]),
  &[href^="tel"] {
    --base-link-color-base: var(--common-baseColor-primary);
    --base-link-color-hover: var(--common-baseColor-primary);

    cursor: default;
  }

  &[href^="tel"] {
    white-space: nowrap;
  }
}

button,
[role="button"],
[type="button"],
[type="reset"],
[type="submit"] {
  cursor: pointer;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
  text-transform: inherit;
  color: inherit;
  text-align: left;
  padding: 0;
  border: none;
  background-color: transparent;
  margin: 0;

  &[disabled] {
    cursor: initial;
  }
}

img,
video {
  max-width: 100%;
  height: auto;
  display: block;
}

svg,
use {
  transform: translateZ(0);
  fill: currentColor;
  stroke: currentColor;
  display: block;
}

hr {
  border: 0;
  height: 1px;
  margin-top: 0;
  margin-bottom: 0;
  background-color: var(--common-baseColor-divider);
}

.link {
  #base.link();
}

.btn {
  #base.btn();
}
