/* ═══════════════════════════════════════════════════
   MERO LINDO — PRÓTESIS CAPILAR
═══════════════════════════════════════════════════ */

/* ── NAV (página prótesis: mismo menú que home) ── */
.nav--solid {
  background: var(--black);
  border-bottom: 1px solid var(--dark2);
}
/* Enlace actual: "Estás aquí" */
.nav__link--current {
  color: var(--gold-l) !important;
  font-weight: 700;
}
.nav__link--current::after {
  width: 100%;
  background: var(--gold-l);
}
/* nav__back lo usa la página de testimonios de prótesis */
.nav__back { display: inline-flex; align-items: center; gap: 6px; color: var(--stone-l); font-size: .8rem; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; transition: color .3s var(--ease); }
.nav__back:hover { color: var(--gold); }
.nav__back i, .nav__back svg { width: 16px; height: 16px; }

/* ════════════════════════════════════════════════════
   BREADCRUMB (solo página testimonios)
════════════════════════════════════════════════════ */
.pcb {
  padding: 80px 24px 0;
  background: var(--black);
}
.pcb__inner {
  max-width: 1200px;
  margin: 0 auto;
  font-size: .75rem;
  color: var(--stone-l);
  letter-spacing: .04em;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}
.pcb__inner a {
  color: var(--stone-l);
  transition: color .2s;
}
.pcb__inner a:hover { color: var(--gold); }
.pcb__sep {
  display: flex;
  color: var(--stone);
}
.pcb__sep i, .pcb__sep svg { width: 12px; height: 12px; }
.pcb__current { color: var(--gold); font-weight: 500; }

/* ════════════════════════════════════════════════════
   HERO PRÓTESIS (pch)
════════════════════════════════════════════════════ */
.pch {
  position: relative;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  padding: 100px 48px 60px;
  box-sizing: border-box;
}
.pch__bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 50% 30%, rgba(37,99,235,.08) 0%, transparent 55%),
    var(--black);
  z-index: 0;
}
.pch__grain {
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)' opacity='.04'/%3E%3C/svg%3E");
  opacity: .5;
  pointer-events: none;
}
.pch__vignette {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, transparent 40%, var(--black) 100%);
  pointer-events: none;
}
.pch__grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(37,99,235,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(37,99,235,.06) 1px, transparent 1px);
  background-size: 50px 50px;
  pointer-events: none;
}

.pch__wrap {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
  max-width: 1400px;
  margin: 0 auto;
  width: 100%;
}

.pch__left {
  text-align: left;
}
.pch__tag {
  position: relative;
  z-index: 1;
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 28px;
  display: block;
}
.pch__title {
  position: relative;
  z-index: 1;
  margin-bottom: 36px;
  overflow: hidden;
}
.pch__line {
  display: block;
  font-family: var(--fh);
  font-size: clamp(3.2rem, 8vw, 6.5rem);
  line-height: .88;
  letter-spacing: .02em;
  color: var(--white);
  overflow: hidden;
}
.pch__line span { display: inline-block; }
.pch__line--accent { color: var(--gold); }

.pch__desc {
  position: relative;
  z-index: 1;
  max-width: 520px;
  font-size: clamp(0.95rem, 1.5vw, 1.15rem);
  line-height: 1.75;
  color: var(--text-l);
  margin-bottom: 44px;
  padding: 0;
}
.pch__desc strong { color: var(--gold); }

.pch__actions {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.pch__actions .btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 18px 36px;
  font-size: .9rem;
}

/* Columna derecha: banner + qué es */
.pch__right {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.pch__banner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 380px;
}
.pch__banner-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  background: rgba(12,10,9,.94);
  border-top: 1px solid rgba(37,99,235,.2);
  pointer-events: auto;
}
.pch__banner-bar-text {
  flex: 1;
  min-width: 0;
}
.pch__banner-bar-label {
  display: block;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 4px;
}
.pch__banner-bar-text p {
  font-size: .78rem;
  line-height: 1.4;
  color: var(--text-l);
  margin: 0;
}
.pch__banner-bar-right {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.pch__banner-bar .pch__banner-badge {
  position: static;
  padding: 6px 12px;
  font-size: .65rem;
  margin: 0;
  box-shadow: none;
}
.pch__banner-bar .pch__banner-embed-link {
  position: static;
  transform: none;
  padding: 6px 12px;
  font-size: .7rem;
  white-space: nowrap;
}
.pch__banner-inner {
  position: relative;
  width: 100%;
  max-width: 480px;
  aspect-ratio: 4/5;
  max-height: 85vh;
}
.pch__banner-glow {
  position: absolute;
  inset: -20%;
  background: radial-gradient(ellipse at 50% 50%, rgba(37,99,235,.25) 0%, rgba(37,99,235,.06) 45%, transparent 70%);
  border-radius: 50%;
  filter: blur(40px);
  pointer-events: none;
}
.pch__banner-frame {
  position: relative;
  width: 100%;
  height: 100%;
  border: 2px solid rgba(37,99,235,.35);
  border-radius: 12px;
  overflow: hidden;
  background: linear-gradient(165deg, var(--dark2) 0%, var(--black) 50%);
  box-shadow: 0 24px 64px rgba(0,0,0,.5), 0 0 0 1px rgba(37,99,235,.1) inset;
}
.pch__banner-embed {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 380px;
  background: var(--dark);
  overflow: hidden;
}
.pch__banner-iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
  border-radius: 10px;
  pointer-events: auto;
}
.pch__banner-embed-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: .75rem;
  font-weight: 600;
  color: var(--gold);
  text-decoration: none;
  letter-spacing: .04em;
  border-radius: 99px;
  transition: color .2s, background .2s;
}
.pch__banner-embed-link:hover {
  color: var(--gold-l);
}
.pch__banner-embed-link i,
.pch__banner-embed-link svg { width: 12px; height: 12px; }
.pch__banner-badge {
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--black);
  background: var(--gold);
  border-radius: 4px;
}

.pch__scroll {
  position: absolute;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  z-index: 1;
  font-size: .65rem;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--stone);
}
.pch__scroll-line {
  width: 1px;
  height: 48px;
  background: var(--dark2);
  position: relative;
  overflow: hidden;
}
.pch__scroll-line::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 30%;
  background: var(--gold);
  animation: pchScroll 2s ease-in-out infinite;
}
@keyframes pchScroll {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(48px); }
}

@media (max-width: 768px) {
  .pch { padding: 90px 20px 50px; }
  .pch__wrap {
    grid-template-columns: 1fr;
    gap: 48px;
    text-align: center;
  }
  .pch__left { text-align: center; }
  .pch__desc { margin-left: auto; margin-right: auto; }
  .pch__actions { justify-content: center; }
  .pch__line { font-size: clamp(3rem, 14vw, 4.5rem); }
  .pch__desc { font-size: 1rem; margin-bottom: 36px; max-width: 100%; }
  .pch__actions { gap: 14px; }
  .pch__actions .btn { padding: 16px 28px; font-size: .85rem; }
  .pch__banner { min-height: 300px; }
  .pch__banner-inner { max-width: 100%; aspect-ratio: 4/3; }
  .pch__banner-bar {
    flex-wrap: wrap;
    padding: 12px 14px;
    gap: 10px;
  }
  .pch__banner-bar-text { flex: 1 1 100%; }
  .pch__banner-bar-right {
    width: 100%;
    justify-content: space-between;
  }
  .pch__quees { padding: 20px 18px; }
  .pch__quees-title { font-size: .95rem; }
}

/* ════════════════════════════════════════════════════
   QUÉ ES (pcq) — video integrado: cristal + orbe
════════════════════════════════════════════════════ */
.pcq {
  position: relative;
  padding: 100px 24px;
  overflow: hidden;
  min-height: 80vh;
  display: flex;
  align-items: center;
}
/* Video de fondo: se ve a través del cristal */
.pcq__video-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.pcq__video-bg-el {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  object-fit: cover;
  opacity: .5;
}
/* Panel tipo cristal: el video se ve difuminado detrás */
.pcq__glass {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
  padding: 48px 40px;
  background: rgba(12,10,9,.55);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,.06);
  box-shadow: 0 24px 64px rgba(0,0,0,.35);
}
.pcq__inner {
  position: relative;
  max-width: 1000px;
  margin: 0 auto;
}
/* Orbe: círculo con video, detalle innovador */
.pcq__orb {
  position: absolute;
  right: 8%;
  top: 50%;
  transform: translateY(-50%);
  width: clamp(140px, 18vw, 220px);
  height: clamp(140px, 18vw, 220px);
  border-radius: 50%;
  overflow: hidden;
  z-index: 1;
  border: 2px solid rgba(37,99,235,.4);
  box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 20px 50px rgba(0,0,0,.4);
}
.pcq__orb-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.pcq__tag {
  display: block;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
}
.pcq__title {
  margin-bottom: 48px;
  overflow: hidden;
}
.pcq__line {
  display: block;
  font-family: var(--fh);
  font-size: clamp(2.2rem, 6vw, 4.5rem);
  line-height: .92;
  letter-spacing: .03em;
  color: var(--white);
}
.pcq__line--accent { color: var(--gold); }

.pcq__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: start;
}
.pcq__text p {
  font-size: .92rem;
  color: var(--text);
  line-height: 1.7;
  margin-bottom: 16px;
}
.pcq__text p strong { color: var(--white); }
.pcq__lead { font-size: 1rem !important; color: var(--text-l) !important; }
.pcq__lead strong { color: var(--gold) !important; }

.pcq__list {
  margin-top: 24px;
}
.pcq__list li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: .9rem;
  color: var(--text);
  margin-bottom: 10px;
}
.pcq__list li i, .pcq__list li svg { width: 18px; height: 18px; color: var(--gold); flex-shrink: 0; }

.pcq__highlights {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.pcq__hl {
  padding: 24px;
  background: var(--dark);
  border-left: 3px solid var(--gold);
  transition: border-color .3s var(--ease);
}
.pcq__hl:hover { border-left-color: var(--gold-l); }
.pcq__hl-icon {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  color: var(--gold);
}
.pcq__hl-icon i, .pcq__hl-icon svg { width: 20px; height: 20px; }
.pcq__hl strong {
  display: block;
  font-size: 1.1rem;
  color: var(--white);
  margin-bottom: 4px;
}
.pcq__hl span { font-size: .8rem; color: var(--stone-l); }

@media (max-width: 768px) {
  .pcq { padding: 48px 16px; min-height: auto; }
  .pcq__glass { padding: 32px 24px; border-radius: 20px; }
  .pcq__video-bg-el { opacity: .35; }
  .pcq__orb { display: none; }
  .pcq__grid { grid-template-columns: 1fr; gap: 40px; }
  .pcq__title { margin-bottom: 32px; }
}

/* ════════════════════════════════════════════════════
   SERVICIOS (pcs)
════════════════════════════════════════════════════ */
.pcs {
  padding: 100px 24px;
  position: relative;
}
.pcs::before {
  content: '';
  position: absolute;
  top: 0;
  left: 24px;
  right: 24px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold-d), transparent);
}
.pcs__inner {
  max-width: 900px;
  margin: 0 auto;
}
.pcs__tag {
  display: block;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
}
.pcs__title {
  margin-bottom: 48px;
  overflow: hidden;
}
.pcs__title .pcs__line {
  display: block;
  font-family: var(--fh);
  font-size: clamp(2.2rem, 6vw, 4rem);
  line-height: .92;
  letter-spacing: .03em;
  color: var(--white);
}
.pcs__title .pcs__line em { font-style: italic; color: var(--gold); }

.pcs__cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.pcs__card {
  display: block;
  padding: 32px 28px;
  background: var(--dark);
  border: 1px solid var(--dark2);
  transition: all .35s var(--ease);
  text-decoration: none;
  color: inherit;
  position: relative;
}
.pcs__card:hover {
  border-color: var(--gold);
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(0,0,0,.3);
}
.pcs__card--featured {
  border-left: 3px solid var(--gold);
  background: var(--dark2);
}
.pcs__badge {
  position: absolute;
  top: 20px;
  right: 20px;
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--black);
  background: var(--gold);
  padding: 4px 10px;
}
.pcs__card h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--white);
  margin-bottom: 12px;
}
.pcs__card p {
  font-size: .88rem;
  color: var(--text);
  line-height: 1.6;
  margin-bottom: 20px;
}
.pcs__meta {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
}
.pcs__price {
  font-family: var(--fh);
  font-size: 1.5rem;
  color: var(--gold);
  letter-spacing: .04em;
}
.pcs__time {
  font-size: .78rem;
  color: var(--stone-l);
}
.pcs__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: .8rem;
  font-weight: 600;
  color: var(--gold);
  transition: gap .3s var(--ease);
}
.pcs__card:hover .pcs__cta { gap: 12px; }
.pcs__cta i, .pcs__cta svg { width: 14px; height: 14px; }

@media (max-width: 768px) {
  .pcs { padding: 64px 20px; }
  .pcs__cards { grid-template-columns: 1fr; }
  .pcs__title { margin-bottom: 32px; }
}

/* ════════════════════════════════════════════════════
   TESTIMONIOS PREVIEW (pct)
════════════════════════════════════════════════════ */
.pct {
  padding: 100px 24px;
  background: var(--black2);
}
.pct__inner {
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
}
.pct__tag {
  display: block;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
}
.pct__title {
  margin-bottom: 16px;
  overflow: hidden;
}
.pct__title .pct__line {
  display: block;
  font-family: var(--fh);
  font-size: clamp(2rem, 5.5vw, 3.5rem);
  line-height: .92;
  letter-spacing: .03em;
  color: var(--white);
}
.pct__title .pct__line--accent { color: var(--gold); }
.pct__desc {
  font-size: .92rem;
  color: var(--text);
  margin-bottom: 48px;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}

.pct__preview {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
  margin-bottom: 40px;
  text-align: left;
}
.pct__video-wrap { position: relative; }
.pct__video-link {
  display: block;
  text-decoration: none;
  color: inherit;
}
.pct__video-thumb {
  aspect-ratio: 16/10;
  background: var(--dark);
  border: 1px solid var(--dark2);
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pct__video-thumb img {
  width: 80px;
  height: auto;
  opacity: .4;
}
.pct__video-overlay { position: absolute; inset: 0; opacity: .5; }
.pct__play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gold);
  background: rgba(0,0,0,.3);
  transition: background .3s var(--ease);
}
.pct__play i, .pct__play svg { width: 48px; height: 48px; }
.pct__video-link:hover .pct__play { background: rgba(0,0,0,.5); }
.pct__video-info {
  margin-top: 12px;
}
.pct__video-info strong { display: block; color: var(--white); font-size: .95rem; margin-bottom: 4px; }
.pct__video-info span { font-size: .8rem; color: var(--gold); }

.pct__quote blockquote {
  font-size: 1rem;
  line-height: 1.65;
  color: var(--text-l);
  font-style: italic;
  margin-bottom: 16px;
  border-left: 3px solid var(--gold);
  padding-left: 20px;
}
.pct__author {
  display: flex;
  align-items: center;
  gap: 12px;
}
.pct__avatar {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--dark);
  border: 1px solid var(--dark2);
  font-size: .75rem;
  font-weight: 600;
  color: var(--gold);
}
.pct__author strong { font-size: .9rem; color: var(--white); }

.pct__btn { margin-top: 0; }

@media (max-width: 768px) {
  .pct { padding: 64px 20px; }
  .pct__preview { grid-template-columns: 1fr; text-align: center; }
  .pct__quote { text-align: left; }
  .pct__desc { margin-bottom: 32px; }
}

/* ════════════════════════════════════════════════════
   CTA FINAL (pcc)
════════════════════════════════════════════════════ */
.pcc {
  padding: 100px 24px;
  background: var(--black);
  text-align: center;
}
.pcc__inner {
  max-width: 640px;
  margin: 0 auto;
}
.pcc__title {
  margin-bottom: 20px;
  overflow: hidden;
}
.pcc__title .pcc__line {
  display: block;
  font-family: var(--fh);
  font-size: clamp(2rem, 5.5vw, 3.8rem);
  line-height: .92;
  letter-spacing: .03em;
  color: var(--white);
}
.pcc__title .pcc__line--accent { color: var(--gold); }
.pcc__desc {
  font-size: .95rem;
  color: var(--text);
  margin-bottom: 32px;
}
.pcc__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}
.pcc__actions .btn { display: inline-flex; align-items: center; gap: 10px; }

@media (max-width: 768px) {
  .pcc { padding: 64px 20px; }
  .pcc__actions { flex-direction: column; }
  .pcc__actions .btn { width: 100%; justify-content: center; }
}

/* Hero testimonios página (ajuste padding con breadcrumb) */
.pcth { padding-top: 40px; }
.pcb + .th.pcth { padding-top: 24px; }