@import url("assets/vendor/styles/normalize.css");

@import url("assets/styles/fonts.css");
@import url("assets/styles/reset.css");
@import url("assets/styles/root.css");

@import url("assets/styles/text.css");

@import url("assets/styles/app.css");
@import url("assets/styles/header.css");
@import url("assets/styles/navigator.css");
@import url("assets/styles/main.css");
@import url("assets/styles/section.css");
@import url("assets/styles/article.css");

@import url("assets/styles/footer.css");

@import url("assets/styles/logo.css");
@import url("assets/styles/lead.css");
@import url("assets/styles/post.css");
@import url("assets/styles/headings.css");
@import url("assets/styles/link.css");

/*
@import url('assets/styles/quote.css');
@import url('assets/styles/arrow.css');
@import url('assets/styles/menu.css');
*/

* {
  text-box-edge: ex alphabetic;
  text-box-trim: trim-both;
}

html {
  width: 100%;
  height: auto;

  font-size: 62.5%; /* This value allows `1rem` to be equal to 10px */
}

body {
  position: relative;

  width: 100%;
  height: auto;

  background-color: var(--bg-color);
  color: var(--text-color);

  font-size: var(--font-size-base);
  line-height: var(--leading);

  font-family: Geologica, sans-serif;
  font-optical-sizing: auto;
  font-weight: var(--font-weight-text);
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "CRSV" 1,
    "SHRP" 0;

  scroll-behavior: smooth;
}

::view-transition-old(root),
::view-transition-new(root) {
  animation-duration: 0.1s;
  animation-timing-function: ease;
}

h1,
h2,
h3,
h4,
h5,
h6,
blockquote {
  text-wrap: balance;
}

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

.text-ui {
  font-size: var(--text-ui-font-size);
}

.button {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  text-box-edge: auto;
  text-box-trim: none;
  user-select: none;
  cursor: pointer;
  font: inherit;
  font-size: 1.6rem;
  padding: 0;
}

.me {
  pointer-events: none;

  img {
    height: 101vh;
    width: auto;
    object-fit: cover;
    overflow: visible;

    transform-origin: center right;
  }
}
