/* ══════════════════════════════════════════
   CICCHITTI — ETIQUETA PERSONALIZADA
══════════════════════════════════════════ */

/* ── HERO ── */
.pers-hero {
  background: var(--dark);
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  padding: 140px 80px 0;
  gap: 80px;
  position: relative;
  overflow: hidden;
}
.pers-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 60% at 80% 60%, rgba(75,15,26,0.18) 0%, transparent 70%);
  pointer-events: none;
}
.pers-hero__content { position: relative; z-index: 1; }
.pers-hero__title {
  font-size: clamp(44px, 5.5vw, 80px);
  color: var(--cream);
  line-height: 1.08;
  margin: 16px 0 28px;
}
.pers-hero__desc {
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.8;
  color: rgba(255,255,240,0.65);
  max-width: 460px;
  margin-bottom: 40px;
}
.pers-hero__actions { display: flex; gap: 16px; flex-wrap: wrap; }
.pers-hero__visual {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 24px 0;
}
.pers-hero__img {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 520px;
  height: auto;
  display: block;
  object-fit: contain;
}

/* ── EN QUÉ CONSISTE ── */
.pers-detalle {
  background: var(--cream-deep);
  padding: 100px 80px;
}
.pers-detalle__inner { max-width: 820px; margin: 0 auto; }
.pers-detalle__header {
  text-align: center;
  margin-bottom: 48px;
}
.pers-detalle__title { color: var(--wine); margin-top: 14px; }
.pers-detalle__body {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.pers-detalle__text {
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.85;
  font-weight: 300;
  color: rgba(14,10,8,0.7);
}
.pers-detalle__condiciones {
  margin-top: 28px;
  padding: 26px 32px;
  border-left: 2px solid var(--gold);
  background: rgba(255,255,255,0.45);
}
.pers-detalle__condiciones-label {
  font-family: var(--sans);
  font-size: 9px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--wine);
  margin-bottom: 10px;
}
.pers-detalle__condiciones-text {
  font-family: var(--sans);
  font-size: 14.5px;
  font-weight: 300;
  line-height: 1.75;
  color: rgba(14,10,8,0.72);
}

/* ── PROCESO ── */
.pers-proceso {
  background: var(--dark);
  padding: 100px 80px;
}
.pers-proceso__inner { max-width: 1000px; margin: 0 auto; }
.pers-proceso__header {
  text-align: center;
  margin-bottom: 72px;
}
.pers-proceso__header .section-title { color: var(--cream); margin-top: 14px; }
.pers-proceso__steps {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
}
.pers-step {
  display: flex;
  gap: 28px;
  align-items: flex-start;
  padding: 36px;
  border: 0.5px solid rgba(200,169,110,0.15);
  border-radius: 2px;
  transition: border-color 0.25s;
}
.pers-step:hover { border-color: rgba(200,169,110,0.35); }
.pers-step__num {
  font-family: var(--serif);
  font-size: 40px;
  font-weight: 300;
  color: var(--gold);
  opacity: 0.6;
  line-height: 1;
  flex-shrink: 0;
}
.pers-step__content { display: flex; align-items: center; min-height: 100%; }
.pers-step__desc {
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 300;
  line-height: 1.75;
  color: rgba(255,255,240,0.7);
}

.pers-proceso__cta {
  display: flex;
  justify-content: center;
  margin-top: 56px;
}

/* ── RESPONSIVE ── */
@media (max-width: 960px) {
  .pers-hero {
    grid-template-columns: 1fr;
    padding: 120px 32px 0;
    gap: 40px;
  }
  .pers-hero__img { max-width: 420px; }
  .pers-detalle { padding: 72px 32px; }
  .pers-detalle__condiciones { padding: 22px 24px; }
  .pers-proceso { padding: 72px 32px; }
  .pers-proceso__steps { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .pers-hero__actions { flex-direction: column; }
}
