@import url('./styles-variables.css');
@import url('./header-styles.css');
@import url('./footer-styles.css');
@import url('./main-section-styles.css');
@import url('./process-section-styles.css');
@import url('./app-section-styles.css');
@import url('./menu-main-section.css');
@import url('./testimonials.css');
@import url('./advantages-section-styles.css');
@import url('./order-section-styles.css');
@import url('./price-section-styles.css');
@import url('./modal.css');
@import url('./preloader.css');

* {
  box-sizing: border-box;
  margin: 0;
  color: var(--text-dark);
}

html {
  height: 100%;
  background-color: var(--background-body);
  font-family: 'Inter', sans-serif;
  display: flex;
  justify-content: center;
  scroll-behavior: smooth;
}

body {
  max-width: 1440px;
  display: grid;
  grid-template-rows: 80px 1fr 490px;
  overflow: visible;
  min-height: 100vh; 
}

main {
  width: 95%;
}

a, a:visited, a:hover, a:active {
  /* color: inherit; */
  text-decoration: none;
}

.text-light {
  color: var(--text-light)
}

.text-accent {
  color: var(--text-accent)
}

.text-dark {
  color: var(--text-dark)
}

@media (max-width: 1439px) {
  body, header, main, footer, .menu-main-section {
    width: 90vw;
  }
}