/* =========================================================
   PILATES MEDICINA FUNCIONAL — CAPA VISUAL MODERNA
   Se suma a site.css. No modifica estructura ni contenido:
   solo tipografía, color, profundidad y microinteracciones.
   Estilo: minimalista premium + acentos orgánicos + editorial.
   ========================================================= */

/* ---------- Selección de texto y scrollbar ---------- */
::selection {
  background: var(--wp--preset--color--terracotta);
  color: #FFFFFF;
}

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--wp--preset--color--cream); }
::-webkit-scrollbar-thumb {
  background: var(--wp--preset--color--sage);
  border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover { background: var(--wp--preset--color--sage-dark); }

/* ---------- Reveal progresivo al hacer scroll ---------- */
/* Sin JS, todo se ve normal (fallback seguro). Con JS, aparece suavemente. */
.js #medicina-funcional .wp-block-column,
.js #pilares .pmf-card,
.js #longevidad .wp-block-column,
.js .pmf-feature-cover,
.js .pmf-contact {
  opacity: 0;
  transform: translateY(22px);
}

.js .pmf-in-view {
  opacity: 1 !important;
  transform: none !important;
  transition: opacity .7s cubic-bezier(.22,.61,.36,1),
              transform .7s cubic-bezier(.22,.61,.36,1);
}

.js #pilares .wp-block-columns .wp-block-column:nth-child(2) .pmf-card { transition-delay: .08s; }
.js #pilares .wp-block-columns .wp-block-column:nth-child(3) .pmf-card { transition-delay: .16s; }

@media (prefers-reduced-motion: reduce) {
  .js #medicina-funcional .wp-block-column,
  .js #pilares .pmf-card,
  .js #longevidad .wp-block-column,
  .js .pmf-feature-cover,
  .js .pmf-contact {
    opacity: 1;
    transform: none;
  }
}

/* ---------- Header: vidrio esmerilado + sombra dinámica ---------- */
.pmf-shell {
  background: rgba(245, 242, 234, .78) !important;
  transition: box-shadow .3s ease, background .3s ease;
}

.pmf-shell.pmf-scrolled {
  background: rgba(255, 253, 248, .92) !important;
  box-shadow: 0 8px 30px rgba(32, 52, 45, .08);
}

.pmf-simple-nav a {
  position: relative;
}

@media (min-width: 901px) {
  .pmf-simple-nav a::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: -4px;
    height: 2px;
    background: var(--wp--preset--color--terracotta);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .25s ease;
  }
  .pmf-simple-nav a:hover::after {
    transform: scaleX(1);
  }
}

/* ---------- Hero: manchas orgánicas de fondo + entrada suave ---------- */
#inicio {
  position: relative;
  overflow: hidden;
}

#inicio::before,
#inicio::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  filter: blur(70px);
  pointer-events: none;
  z-index: 0;
}

#inicio::before {
  width: 420px;
  height: 420px;
  top: -160px;
  right: -120px;
  opacity: .35;
  background: radial-gradient(circle, var(--wp--preset--color--sage) 0%, transparent 70%);
}

#inicio::after {
  width: 360px;
  height: 360px;
  bottom: -140px;
  left: -100px;
  opacity: .18;
  background: radial-gradient(circle, var(--wp--preset--color--terracotta) 0%, transparent 70%);
}

#inicio > .wp-block-columns { position: relative; z-index: 1; }

.js #inicio .pmf-kicker,
.js #inicio .pmf-hero-title,
.js #inicio .has-medium-font-size,
.js #inicio .wp-block-buttons {
  opacity: 0;
  transform: translateY(16px);
  animation: pmf-fade-up .8s cubic-bezier(.22,.61,.36,1) forwards;
}

.js #inicio .pmf-kicker { animation-delay: .05s; }
.js #inicio .pmf-hero-title { animation-delay: .15s; }
.js #inicio .has-medium-font-size { animation-delay: .28s; }
.js #inicio .wp-block-buttons { animation-delay: .4s; }

@keyframes pmf-fade-up {
  to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .js #inicio .pmf-kicker,
  .js #inicio .pmf-hero-title,
  .js #inicio .has-medium-font-size,
  .js #inicio .wp-block-buttons {
    opacity: 1;
    transform: none;
    animation: none;
  }
}

/* ---------- Tipografía editorial ---------- */
.pmf-hero-title {
  letter-spacing: -.03em;
  font-weight: 460;
}

.pmf-kicker {
  position: relative;
  padding-left: 26px;
}

.pmf-kicker::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 1px;
  background: currentColor;
  opacity: .6;
}

/* ---------- Botones con profundidad ---------- */
.wp-block-button__link {
  background: linear-gradient(135deg, var(--wp--preset--color--forest) 0%, var(--wp--preset--color--sage-dark) 100%) !important;
  box-shadow: 0 10px 26px rgba(32, 52, 45, .18);
  transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  cursor: pointer;
}

.wp-block-button__link:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(32, 52, 45, .24);
  filter: brightness(1.05);
}

.wp-block-button__link:focus-visible {
  outline: 2px solid var(--wp--preset--color--terracotta);
  outline-offset: 3px;
}

.is-style-outline .wp-block-button__link {
  background: transparent !important;
  border: 1.5px solid var(--wp--preset--color--forest) !important;
  color: var(--wp--preset--color--forest) !important;
  box-shadow: none;
}

.is-style-outline .wp-block-button__link:hover {
  background: rgba(32, 52, 45, .06) !important;
  transform: translateY(-2px);
}

/* ---------- Tarjetas de pilares: numeración editorial ---------- */
.pmf-card {
  position: relative;
  background: linear-gradient(180deg, var(--wp--preset--color--paper) 0%, #FFFFFF 100%) !important;
  border: 1px solid rgba(32, 52, 45, .08);
  overflow: hidden;
}

.pmf-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--wp--preset--color--terracotta), var(--wp--preset--color--sage));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s ease;
}

.pmf-card:hover::before { transform: scaleX(1); }

.pmf-card .pmf-kicker {
  font-family: var(--wp--preset--font-family--serif);
  font-size: clamp(1.6rem, 3vw, 2.1rem) !important;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: rgba(32, 52, 45, .16) !important;
  padding-left: 0;
}

.pmf-card .pmf-kicker::before { display: none; }

/* ---------- Ejes visuales (covers) ---------- */
.pmf-feature-cover {
  position: relative;
}

.pmf-feature-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(32, 52, 45, 0) 45%, rgba(32, 52, 45, .5) 100%);
  pointer-events: none;
}

/* ---------- Contacto y footer ---------- */
.pmf-contact {
  background: linear-gradient(160deg, var(--wp--preset--color--paper) 0%, var(--wp--preset--color--cream) 100%);
}

.pmf-footer {
  background: var(--wp--preset--color--paper);
}