/* ============================================================================
   Es Bassol Nou — Property Care
   Calcado del mockup (vw/%): hero jardín + título, "Peace of Mind", servicios
   sobre azul (título teal + items + 3 columnas justificadas crema), banda
   terracota con "LET'S TALK". Desktop-first fiel; en móvil se apila.
   ========================================================================== */

.pc-hero,
.pc-lead,
.pc-services,
.pc-lets {
  position: relative;
}

/* --- HERO --------------------------------------------------------------- */
.pc-hero {
  height: 77.6vw;
  overflow: hidden;
  color: #f3f1e4;
}

.pc-hero__media {
  position: absolute;
  inset: 0;
}

.pc-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pc-hero__inner {
  position: absolute;
  inset: 0;
}

.pc-hero__title {
  position: absolute;
  top: 17.7vw;
  left: 2.1%;
  right: 2.1%;
  text-align: center;
  font-family: var(--font-display);
  font-size: clamp(3rem, 9.375vw, 15rem);
  /* 180pt */
  line-height: 0.86;
}

.pc-hero__title span {
  display: block;
}

.pc-hero__sub {
  position: absolute;
  top: 37.7vw;
  left: 0;
  right: 0;
  text-align: center;
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 2.9vw;
  /* 60pt */
  line-height: 0.9;
  letter-spacing: 0.00em;
}

.pc-hero__sub span {
  display: block;
}

/* --- PEACE OF MIND ------------------------------------------------------ */
.pc-lead {
  height: 68.3vw;
  background: var(--c-cream);
  color: var(--c-ink);
}

.pc-lead__title {
  position: absolute;
  top: 13.8vw;
  left: 2.1%;
  right: 2.1%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding-inline: 0;
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 5.21vw;
  /* 100pt */
  line-height: 1;
}

.pc-lead__support {
  position: absolute;
  top: 23.9vw;
  left: 0;
  right: 0;
  text-align: center;
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 3.12vw;
  /* 60pt */
}

.pc-lead__intro {
  position: absolute;
  top: 38.5vw;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 1.9vw;
  /* 39.2pt */
  line-height: 1.18;
  transform: scaleY(0.90);

}

.pc-lead__cta {
  position: absolute;
  top: 49vw;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 1.7vw;
  /* 38pt */
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #6d6e71;
  font-family: var(--font-display);
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* --- SERVICIOS (azul) --------------------------------------------------- */
.pc-services {
  background: var(--c-blue);
  padding-top: 27vw;
  padding-bottom: 25vw;
}

.pc-serv {
  padding-bottom: 8vw;
  margin: 0;
}

.pc-serv__divider {
  width: 60%;
  height: 0;
  margin: 0 auto 4.25vw;
  border: 0;
  border-top: 1px solid #4e7682;
}

.pc-serv__title {
  display: flex;
  width: max-content;
  margin-inline: auto;
  flex-direction: column;
  align-items: flex-start;
  text-align: center;
  font-family: var(--font-display);
  text-transform: uppercase;
  font-weight: 400;
  font-size: 3.12vw;
  margin-bottom: 2.35vw;
  /* 60pt */
  line-height: 0.9;
  color: #4e7682;
}

.pc-serv__title span {
  display: block;
}

.pc-serv__title span:last-child {
  margin-left: 0;
}

.pc-serv:nth-of-type(1) .pc-serv__title span:first-child {
  transform: translateX(3.12em);
}

.pc-serv:nth-of-type(2) .pc-serv__title span:last-child {
  transform: translateX(3.43em);
}

.pc-serv:nth-of-type(3) .pc-serv__title span:first-child {
  transform: translateX(4.09em);
}

.pc-serv:nth-of-type(4) .pc-serv__title span:first-child {
  transform: translateX(1.60em);
}

.pc-serv:nth-of-type(5) .pc-serv__title span:first-child {
  transform: translateX(1.31em);
}

/* segundo término indentado */
.pc-serv__items {
  list-style: none;
  text-align: center;
  margin: 1.6vw 0 2.6vw;
  color: #f3f1e4;
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 1.82vw;
  /* items prominentes como el mockup */
  line-height: 1.15;
  letter-spacing: 0.09em;
}


.pc-serv__items span {
  font-size: 0.6em;
  vertical-align: 0.35em;
  margin-right: 0.35em;
}

.pc-serv__cols {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 4.2%;
  padding-inline: 6.2%;
}

.pc-col p {
  color: #f3f1e4;
  font-family: var(--font-body);
  font-weight: var(--fw-light);
  font-size: 1.46vw;
  /* 30pt */
  line-height: 1.2;
  text-align: justify;
  text-align-last: left;
  text-justify: inter-word;
  word-spacing: -0.02em;
  -webkit-hyphens: auto;
  hyphens: auto;

}

.pc-col p+p {
  margin-top: 1.3vw;
}

/* --- LET'S TALK (terracota) --------------------------------------------- */
.pc-lets {
  height: 45.6vw;
  background: url("/assets/img/property-care/terracota-bg.jpeg") center / cover no-repeat, var(--c-terracota);
  overflow: visible;
}

.pc-lets .lets-talk {
  position: absolute;
  right: 11.7%;
  bottom: 0;
  height: 25vw;
}

.pc-lets .lets-talk__label {
  color: var(--c-terracota);
}

/* ========================================================================
   MÓVIL: apilado
   ======================================================================== */
@media (max-width: 63.99rem) {
  .pc-hero {
    height: 70vw;
  }

  .pc-hero__media {
    position: absolute;
    height: 100%;
  }

  .pc-hero__inner {
    position: absolute;
    padding: 0 1.25rem;
    color: var(--c-cream);
  }

  .pc-hero__title,
  .pc-hero__sub {
    position: absolute;
    right: 0;
    left: 0;
    text-align: center;
  }

  .pc-hero__title {
    top: 17.7vw;
    right: 2.1%;
    left: 2.1%;
    font-size: clamp(3rem, 9.375vw, 15rem);
    line-height: 0.86;
  }

  .pc-hero__sub {
    top: 57%;
    font-size: clamp(1.15rem, 5.8vw, 1.75rem);
  }

  .pc-lead {
    height: auto;
    padding: 3rem 1.25rem 1.5rem;
  }

  .pc-lead__title,
  .pc-lead__support,
  .pc-lead__intro,
  .pc-lead__cta {
    position: static;
    text-align: center;
    display: block;
    margin-bottom: 1.5rem;
  }

  .pc-lead__title {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding-inline: 0;
    font-size: 2.2rem;
  }

  .pc-lead__title span {
    white-space: nowrap;
    letter-spacing: 0.08em;
  }

  .pc-lead__support {
    font-size: clamp(1.75rem, 7.5vw, 2.2rem);
    line-height: 1;
  }

  .pc-lead__intro {
    font-size: 1.2rem;
  }

  .pc-lead__intro br {
    display: none;
  }

  .pc-lead__cta {
    font-size: clamp(1.2rem, 5.4vw, 1.5rem);
    line-height: 1.08;
    text-underline-offset: 5px;
  }

  .pc-services {
    padding: 2.5rem 1.25rem 2.5rem;
  }

  .pc-serv {
    padding-bottom: 3.5rem;
  }

  .pc-serv__divider {
    margin: 0 auto 3.5rem;
  }

  .pc-serv__cols {
    grid-template-columns: 1fr;
    padding-inline: 0;
    row-gap: 1.5rem;
  }

  .pc-serv__title {
    font-size: clamp(1.75rem, 8.2vw, 2.35rem);
    line-height: 0.96;
  }

  .pc-serv__items,
  .pc-col p {
    font-size: 1.1rem;
  }

  .pc-col:empty {
    display: none;
  }

  .pc-col p {
    width: 88%;
    margin-inline: auto;
    text-align: left;
    text-align-last: left;
    word-spacing: normal;
  }

  .pc-col p+p {
    margin-top: 1.25rem;
  }

  .pc-lets {
    height: 75vw;
    padding: 0;
  }

  .pc-lets .lets-talk {
    position: absolute;
    right: 11.7%;
    bottom: 0;
    width: 11.8%;
    height: 25vw;
    min-width: 0;
    margin: 0;
    padding: 1.4vw 0;
  }
}

@media (max-width: 47.99rem) {
  .pc-lets .lets-talk {
    right: 11.5%;
    width: 12.4%;
  }
}