/* ============================================
   SECTIONS - NetApp Storage LP
   ============================================ */

.inov {
  background-color: var(--black);
  background-image: url("https://pages.lenovo.com/rs/183-WCT-620/images/storage__otim-inov-bg.webp");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  color: var(--white);
  position: relative;
}

@media (min-width: 45em) {
  .inov {
    background-position: 20%;
  }
}

@media (min-width: 70em) {
  .inov {
    background-position: center;
  }
}

.inov p + p {
  margin-top: 1rem;
}

.inov p {
  max-width: 52ch;
}

.inov ul {
  margin-top: 2.5rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 2rem;
}

.inov ul li {
  max-width: 15ch;
  text-align: center;
}

.inov ul li img {
  margin-bottom: 1rem;
  margin-inline: auto;
}

.inov__container {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-areas: "content" "image";
  gap: 3rem;
}

.inov__container .content {
  grid-area: content;
}

.inov__container .image {
  grid-area: image;
}

@media (min-width: 70em) {
  .inov__container {
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "image content";
    align-items: center;
  }
  .inov__container .image {
    position: absolute;
    right: 50%;
  }
}

.results {
  background-image: url("https://pages.lenovo.com/rs/183-WCT-620/images/storage__otim-results-bg.webp");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 60%;
  color: var(--white);
  background-color: var(--clr-fallback, red);
}

@media (min-width: 45em) {
  .results {
    background-position: top center;
  }
}

.results__container h2 {
  margin-bottom: 5rem;
  max-width: 20ch;
  font-family: var(--font-gotham-bold);
}

@media (min-width: 70em) {
  .results__container h2 {
    margin-bottom: 6rem;
  }
  .results__container a {
    margin-top: 5rem !important;
  }
}

.results .numbers {
  display: grid;
  gap: 1.5rem;
  grid-template-areas: "item01 item02" "item04 item04" "item03 item05";
}

.results .numbers article {
  text-align: center;
  display: grid;
  grid-template-rows: min-content 1fr;
}

.results .numbers article h3 {
  font-weight: 700;
  font-family: var(--font-gotham-bold);
  font-size: 2.75rem;
}

.results .numbers article p {
  border: 2px solid var(--clr-accent);
  border-radius: 8px;
  text-align: center;
  max-width: max-content;
  margin-inline: auto;
  padding: 1rem;
  display: grid;
  place-items: center;
}

.results .numbers .item00 {
  grid-area: item00;
}

.results .numbers .item01 {
  grid-area: item01;
}

.results .numbers .item02 {
  grid-area: item02;
}

.results .numbers .item03 {
  grid-area: item03;
}

.results .numbers .item04 {
  grid-area: item04;
}

.results .numbers .item05 {
  grid-area: item05;
}

@media (min-width: 45em) {
  .results .numbers {
    grid-template-areas: "item01 item02 item03" "item04 item05 .";
    column-gap: 2rem;
  }
}

@media (min-width: 70em) {
  .results .numbers {
    grid-template-areas: "item01 item02 item03 item04 item05";
    gap: 3rem;
  }
  .results .numbers h3 {
    font-size: 2.85rem !important;
  }
}

.talk {
  background-image: url("https://pages.lenovo.com/rs/183-WCT-620/images/storage__otim-talk-bg.webp");
  background-position: left;
  background-size: cover;
  background-repeat: no-repeat;
}

.talk h2 {
  font-size: 1.75rem;
}

.talk p {
  color: #2a3c46;
}

.talk a {
  margin-top: 3rem !important;
}

@media (min-width: 45em) {
  .talk h2 {
    margin-bottom: 3rem;
    font-size: 1.6rem;
  }
}

@media (min-width: 70em) {
  .talk h2 {
    font-size: 2rem;
    margin-bottom: 5rem;
  }
  .talk p {
    font-size: 1.125rem;
  }
  .talk a {
    margin-top: 5.5rem !important;
  }
}

.mitg h2,
.esca h2,
.inov h2,
.portf h2 {
  max-width: 17ch;
}

@media (min-width: 80em) {
  .portf ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    max-width: max-content;
    row-gap: 4rem;
    column-gap: 6rem;
  }
}

.transform {
  isolation: isolate;
  background: linear-gradient(104deg, #b8252e 7.76%, #4d144a 68.24%, #11184f 94.34%);
  color: #fff;
  padding-block: 3rem;
  padding-bottom: 6rem;
  position: relative;
  display: grid;
}

.transform__container {
  z-index: 1;
}

.transform h2 {
  color: #fff;
  max-width: 32ch;
}

.transform p {
  max-width: 64ch;
}

.transform a {
  margin-top: 3rem;
}

@media (min-width: 45em) {
  .transform {
    padding-block: 4rem;
    padding-bottom: 6rem;
  }
}

@media (min-width: 1100px) {
  .transform {
    padding-bottom: 5rem;
    padding-block: 5rem;
  }
}

.transform .bg {
  z-index: 0;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.transform .bg > * {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}