/**
 * Layout Global - Header y Footer
 */

/* Layout principal con Flexbox */
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  overflow-x: hidden;
}

body.home::before {
  content: "";
  position: absolute;
  top: -50%;
  left: 15%;
  width: 100%;
  height: -webkit-fill-available;

  background-image: url("./../../images/hero-cover.svg");
  background-size: cover;
  background-repeat: no-repeat;
  /* background-position: center top; */

  z-index: -1;
}

.site-header {
  flex-shrink: 0;
  top: 0;
  z-index: 1000;
}

.site-main {
  flex: 1 0 auto;
  width: 100%;
  display: flex;
  flex-direction: column;
}

.site-footer {
  flex-shrink: 0;
  margin-top: auto;
}

/* Wrapper contenido principal */
.layout-content-wrapper {
  max-width: var(--max-width-content);
  margin: auto;
}

/* Padding global secciones */
/* PADDING ALL DIRECTIONS */
.section-padding--full,
.projects-grid-wrapper,
.news-grid-wrapper {
  padding: 80px 64px;
}
@media (max-width: 768px) {
  .section-padding--full,
  .projects-grid-wrapper,
  .news-grid-wrapper {
    padding: 32px 16px;
  }
}

/* PADDING ALL DIRECTIONS SMALL */
.section-padding--full-small {
  padding-top: 48px;
  padding-bottom: 48px;
  padding-left: 64px;
  padding-right: 64px;
}
@media (max-width: 768px) {
  .section-padding--full-small {
    padding-top: 24px;
    padding-bottom: 24px;
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* PADDING SIDES */
.section-padding--sides {
  padding-left: 64px;
  padding-right: 64px;
}
@media (max-width: 768px) {
  .section-padding--sides {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* PADDING UP AND DOWN */
.section-padding--updown {
  padding: 64px 0;
}
@media (max-width: 768px) {
  .section-padding--updown {
    padding: 32px 0;
  }
}

/* PADDING SIDES AND BOTTOM */
.section-padding--sides_bottom {
  padding-left: 64px;
  padding-right: 64px;
  padding-bottom: 64px;
}
@media (max-width: 768px) {
  .section-padding--sides_bottom {
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 32px;
  }
}

/* PADDING LEFT */
.section-padding--left {
  padding-left: 64px;
}
@media (max-width: 768px) {
  .section-padding--left {
    padding-left: 16px;
  }
}

/* PADDING RIGHT */
.section-padding--right {
  padding-right: 64px;
}
@media (max-width: 768px) {
  .section-padding--right {
    padding-right: 16px;
  }
}