/* ================================================
SECTION
=================================================== */
.sec-hero > .section-content,
.sec-our-team > .section-content,
.sec-lineup > .section-content,
.sec-creative > .section-content,
.sec-porto > .section-content {
  height: 100vh;
}

/* ================================================
HERO
=================================================== */
.sec-hero img {
  object-fit: contain;
  object-position: left;
}
.sec-hero > .section-content {
  display: flex;
  flex-direction: column;
}
.sec-hero > .section-content > .row:nth-child(1) .img {
  margin-right: 60px;
  margin-top: 60px;
}
.sec-hero > .section-content > .row:nth-child(2) {
  margin-top: auto;
  margin-bottom: 180px;
}

/* ================================================
LINEUP
=================================================== */
.line-up-row-1 .col:last-child .col-inner,
.line-up-row-2 .col:first-child .col-inner {
  visibility: hidden;
}
.line-up-row-1 .col .col-inner,
.line-up-row-2 .col .col-inner {
  border-top-right-radius: 30px;
  border-bottom-right-radius: 30px;
  border-bottom-left-radius: 30px;

  height: 100%;
  padding-block: 30px;
}
.line-up-row-1 .col:nth-child(odd) .col-inner,
.line-up-row-2 .col:nth-child(odd) .col-inner {
  background-color: #087c77;
  border: 2px solid #056965;
}
.line-up-row-1 .col:nth-child(even) .col-inner,
.line-up-row-2 .col:nth-child(even) .col-inner {
  background-color: #056965;
}
.line-up-row-1 .col .col-inner p,
.line-up-row-2 .col .col-inner p {
  margin: 10px;
}
.line-up-row-1 .col .col-inner svg,
.line-up-row-2 .col .col-inner svg {
  height: 110px;
}

/* ================================================
CREATIVE
=================================================== */
.sec-creative .small-text {
  font-size: 10px;
}
.sec-creative .svg-wrapper {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: 10px;
}
.sec-creative .row-point > .col > .col-inner {
  border: 1px solid #209993;
  padding: 20px;

  border-top-right-radius: 30px;
  border-bottom-right-radius: 30px;
  border-bottom-left-radius: 30px;
  background: rgba(241, 251, 250, 0.7);
}
.sec-creative .row-point > .col > .col-inner svg {
  transform: scale(1.2);
}
.sec-creative .row-point > .col > .col-inner ul {
  margin: 0;
  list-style: none;
}
.sec-creative .row-point > .col > .col-inner ul li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin-block: auto;

  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNCAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggMi41VjdIMTIuNUMxMy4wMzEyIDcgMTMuNSA3LjQ2ODc1IDEzLjUgOEMxMy41IDguNTYyNSAxMy4wMzEyIDkgMTIuNSA5SDhWMTMuNUM4IDE0LjA2MjUgNy41MzEyNSAxNC41IDcgMTQuNUM2LjQzNzUgMTQuNSA2IDE0LjA2MjUgNiAxMy41VjlIMS41QzAuOTM3NSA5IDAuNSA4LjU2MjUgMC41IDhDMC41IDcuNDY4NzUgMC45Mzc1IDcgMS41IDdINlYyLjVDNiAxLjk2ODc1IDYuNDM3NSAxLjUgNyAxLjVDNy41MzEyNSAxLjUgOCAxLjk2ODc1IDggMi41WiIgZmlsbD0iIzE0QjlCMiIvPgo8L3N2Zz4K")
    no-repeat center;
}
.sec-creative .row-point > .col > .col-inner ul li {
  position: relative;
  font-family: "Lato", sans-serif;
  font-weight: 400;
  color: #404040;
  margin-left: 0;
  margin-bottom: 0;
  padding-left: 25px;

  height: 30px;
  display: flex;
  align-items: center;
}
.sec-creative .row-point > .col > .col-inner ul li p {
  margin: 0;
}
.sec-creative .row-point > .col > .col-inner ul li p:has(span) {
  line-height: 10px;
}

/* ================================================
PORTO
=================================================== */
.sec-porto .porto-button {
  margin-top: -120px;
}

@media only screen and (max-width: 849px) {
  /* ================================================
    SECTION
    ================================================= */
  .sec-hero > .section-content,
  .sec-our-team > .section-content {
    height: 60vh;
  }

  .sec-creative > .section-content,
  .sec-porto > .section-content {
    height: unset;
  }

  /* ================================================
    HERO
    ================================================= */
  .sec-hero img {
    object-fit: cover;
  }
  .sec-hero > .section-content > .row:nth-child(1) .img {
    margin-right: 30px;
    margin-top: 10px;
  }
  .sec-hero > .section-content > .row:nth-child(2) {
    margin-bottom: 10px;
  }

  /* ================================================
    CREATIVE
    ================================================= */
  .sec-creative .row-point > .col > .col-inner {
    padding: 20px 35px;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
  }
  .sec-creative .row-point .col > .col-inner > svg {
    transform: scale(1);
    margin-block: -20px;
  }
  .sec-creative .row-point > .col > .col-inner .text > p > br {
    display: none;
  }
  .sec-creative .row-point > .col > .col-inner ul li:before {
    width: 10px;
    height: 10px;
  }
  .sec-creative .row-point > .col > .col-inner ul li {
    font-size: 14px;
  }

  /* ================================================
    PORTO
    ================================================= */
  .sec-porto .porto-button {
    margin-top: -80px;
  }
}

@media only screen and (max-width: 430px) {
  /* ================================================
    SECTION
    ================================================= */
  .sec-hero > .section-content {
    height: 100vh;
  }

  .sec-lineup > .section-content {
    height: unset;
  }

  /* ================================================
    HERO
    ================================================= */
  .sec-hero > .section-content > .row:nth-child(1) .img {
    margin-right: 0;
    margin-top: 0;
  }
  .sec-hero > .section-content > .row:nth-child(2) {
    margin-top: auto;
    margin-bottom: 0;
  }

  /* ================================================
    PORTO
    ================================================= */
  .sec-porto .porto-button {
    margin-top: -60px;
  }
}