/* =========================================================
     AQUA FAMILY CLUB — Bloque 1: Cabecera + Bienvenida
     Todas las clases usan el prefijo afc- para convivir con WordPress.
     Reset y estilos quedan acotados dentro de .afc-block para no
     afectar al resto del theme cuando esto se incruste en WP.
  ========================================================= */

  .afc-block, .afc-block * , .afc-block *::before, .afc-block *::after {
    box-sizing: border-box;
}

/* Integración WordPress/Astra: libera el diseño del ancho limitado del tema. */
.entry-content .afc-block,
.wp-block-shortcode .afc-block {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

html,
body,
#page,
.site {
  overflow-x: clip;
}

/* Landing Inicio (ID 10): conserva únicamente la experiencia propia de Aqua. */
body.page-id-10 .wp-site-blocks > header.wp-block-template-part,
body.page-id-10 .wp-site-blocks > footer.wp-block-template-part,
body.page-id-10 main .wp-block-post-title {
  display: none !important;
}

body.page-id-10 .wp-site-blocks,
body.page-id-10 main,
body.page-id-10 .wp-block-post-content,
body.page-id-10 .wp-block-post-content > .wp-block-shortcode {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.admin-bar .afc-topbar { top: 32px; }
.admin-bar .afc-header { top: 76px; }

@media (max-width: 782px) {
  .admin-bar .afc-topbar { top: 46px; }
  .admin-bar .afc-header { top: 94px; }
}

  .afc-block {
    /* ---- Paleta de marca (tokens) — tema claro por defecto ---- */
    --afc-navy: #0A2A4D;        /* azul marino */
    --afc-blue: #0E5FA8;        /* azul intenso */
    --afc-aqua: #4FC6E8;        /* celeste agua */
    --afc-turquoise: #1FBFAE;   /* turquesa */
    --afc-white: #FFFFFF;

    --afc-bg: #F3FAFC;              /* fondo general, blanco con leve tinte agua */
    --afc-surface: #FFFFFF;         /* fondo de secciones alternas, sobre --afc-bg */
    --afc-ink: var(--afc-navy);     /* texto principal */
    --afc-ink-soft: #3E5872;        /* texto secundario */
    --afc-header-bg: rgba(255, 255, 255, 0.86);
    --afc-header-border: rgba(10, 42, 77, 0.08);
    --afc-panel-border: rgba(255, 255, 255, 0.55);
    --afc-shadow: 220 60% 20%;      /* h s l base para sombras */
    --afc-focus: #1FBFAE;
    --afc-badge-soon-bg: rgba(255, 255, 255, 0.88);
    --afc-badge-soon-ink: var(--afc-navy);
    --afc-badge-soon-border: rgba(10, 42, 77, 0.14);

    background: var(--afc-bg);
    color: var(--afc-ink);
    font-family: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
  }

  @media (prefers-color-scheme: dark) {
    .afc-block:not([data-afc-theme="light"]) {
      --afc-bg: #071B30;
      --afc-surface: #0B233D;
      --afc-ink: #EAF6FB;
      --afc-ink-soft: #A9C6DA;
      --afc-header-bg: rgba(7, 22, 40, 0.82);
      --afc-header-border: rgba(255, 255, 255, 0.10);
      --afc-panel-border: rgba(255, 255, 255, 0.14);
      --afc-badge-soon-bg: rgba(255, 255, 255, 0.12);
      --afc-badge-soon-ink: #EAF6FB;
      --afc-badge-soon-border: rgba(255, 255, 255, 0.24);
    }
  }
  .afc-block[data-afc-theme="dark"] {
    --afc-bg: #071B30;
    --afc-surface: #0B233D;
    --afc-ink: #EAF6FB;
    --afc-ink-soft: #A9C6DA;
    --afc-header-bg: rgba(7, 22, 40, 0.82);
    --afc-header-border: rgba(255, 255, 255, 0.10);
    --afc-panel-border: rgba(255, 255, 255, 0.14);
    --afc-badge-soon-bg: rgba(255, 255, 255, 0.12);
    --afc-badge-soon-ink: #EAF6FB;
    --afc-badge-soon-border: rgba(255, 255, 255, 0.24);
  }

  .afc-block img { max-width: 100%; display: block; }
  .afc-block a { color: inherit; }
  .afc-block button { font-family: inherit; }

  /* ---------------------------------------------------------
     Franja superior de contacto
  --------------------------------------------------------- */
  .afc-topbar {
    position: sticky;
    top: 0;
    z-index: 40;
    width: 100%;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 10px 20px;
    background: linear-gradient(100deg, #092b67 0%, #075fa8 52%, #19a8d4 100%);
    color: #fff !important;
    font-family: "Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif;
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
    text-decoration: none !important;
    box-shadow: 0 5px 18px rgba(7, 60, 114, 0.2);
    animation: afc-topbar-glow 4s ease-in-out infinite;
  }

  @keyframes afc-topbar-glow {
    0%, 100% { box-shadow: 0 5px 18px rgba(7, 60, 114, 0.2); }
    50% { box-shadow: 0 7px 26px rgba(25, 168, 212, 0.5); }
  }

  .afc-topbar:visited,
  .afc-topbar:hover,
  .afc-topbar:focus {
    color: #fff !important;
  }

  .afc-topbar:hover { filter: brightness(1.06); }
  .afc-topbar:focus-visible {
    outline: 3px solid #fff;
    outline-offset: -4px;
  }

  .afc-topbar__icon {
    width: 21px;
    height: 21px;
    display: inline-flex;
    flex: 0 0 21px;
    color: #fff;
  }
  .afc-topbar__icon svg { width: 100%; height: 100%; }
  .afc-topbar__arrow { font-size: 1.1rem; line-height: 1; }

  @media (max-width: 560px) {
    .afc-topbar {
      min-height: 48px;
      gap: 7px;
      padding: 9px 12px;
      font-size: 0.78rem;
    }
    .afc-topbar__icon { width: 19px; height: 19px; flex-basis: 19px; }
  }

  /* ---------------------------------------------------------
     Cabecera
  --------------------------------------------------------- */
  .afc-header {
    position: sticky;
    top: 44px;
    z-index: 30;
    display: flex;
    align-items: center;
    padding: 6px clamp(20px, 5vw, 56px);
    background: var(--afc-header-bg);
    backdrop-filter: blur(14px) saturate(140%);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    border-bottom: 1px solid var(--afc-header-border);
  }

  @media (max-width: 560px) {
    .afc-header { top: 48px; }
  }

  .afc-header__inner {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    align-items: center;
  }

  .afc-logo-link {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    border-radius: 10px;
  }
  .afc-logo-link:focus-visible {
    outline: 2px solid var(--afc-focus);
    outline-offset: 4px;
  }

  .afc-logo {
    width: auto;
    height: 64px;
    max-height: 64px;
    display: block;
    border-radius: 12px;
    /* el logo trae su propio fondo blanco: se le da una placa sutil
       para que respire igual en fondo claro y oscuro */
    background: #FFFFFF;
    padding: 4px 10px;
    box-shadow: 0 1px 2px hsla(var(--afc-shadow) / 0.08);
  }

  /* ---------------------------------------------------------
     Hero
  --------------------------------------------------------- */
  .afc-hero {
    position: relative;
    padding: clamp(40px, 7vw, 88px) clamp(20px, 5vw, 56px) clamp(64px, 8vw, 108px);
    overflow: hidden;
  }

  /* halo de luz ambiental muy sutil, evoca reflejo de agua */
  .afc-hero::before {
    content: "";
    position: absolute;
    inset: -20% -10% auto -10%;
    height: 70%;
    background:
      radial-gradient(60% 60% at 20% 10%, color-mix(in srgb, var(--afc-aqua) 22%, transparent) 0%, transparent 70%),
      radial-gradient(50% 50% at 85% 0%, color-mix(in srgb, var(--afc-turquoise) 18%, transparent) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
  }

  .afc-hero__inner {
    position: relative;
    z-index: 1;
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: clamp(32px, 5vw, 64px);
    align-items: center;
  }

  .afc-hero__copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: clamp(16px, 2.4vw, 22px);
  }

  .afc-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--afc-blue);
  }
  .afc-eyebrow__dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--afc-aqua), var(--afc-turquoise));
    flex: none;
  }

  .afc-title {
    margin: 0;
    font-family: "Fraunces", ui-serif, Georgia, serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-size: clamp(2.35rem, 4.6vw, 3.9rem);
    line-height: 1.06;
    letter-spacing: -0.01em;
    text-wrap: balance;
    color: var(--afc-ink);
  }

  .afc-title__accent {
    background: linear-gradient(100deg, var(--afc-blue) 15%, var(--afc-turquoise) 55%, var(--afc-aqua) 90%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .afc-subtitle {
    margin: 0;
    font-family: "Fraunces", ui-serif, Georgia, serif;
    font-weight: 500;
    font-style: italic;
    font-size: clamp(1.18rem, 1.9vw, 1.5rem);
    line-height: 1.35;
    color: var(--afc-blue);
    text-wrap: balance;
  }
  .afc-block[data-afc-theme="dark"] .afc-subtitle,
  .afc-block[data-afc-theme="dark"] .afc-plan-card__promise { color: var(--afc-aqua); }
  @media (prefers-color-scheme: dark) {
    .afc-block:not([data-afc-theme="light"]) .afc-subtitle,
    .afc-block:not([data-afc-theme="light"]) .afc-plan-card__promise { color: var(--afc-aqua); }
  }

  .afc-text {
    margin: 0;
    max-width: 52ch;
    font-size: clamp(1rem, 1.1vw, 1.08rem);
    line-height: 1.65;
    color: var(--afc-ink-soft);
  }

  .afc-block a.afc-cta {
    margin-top: 6px;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 18px;
    min-height: 48px;
    padding: 15px 30px;
    border-radius: 999px;
    border: none;
    background: linear-gradient(120deg, var(--afc-blue), var(--afc-turquoise));
    color: #FFFFFF;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.01em;
    text-decoration: none;
    cursor: pointer;
    overflow: hidden;
    box-shadow: 0 14px 30px -12px color-mix(in srgb, var(--afc-blue) 65%, transparent);
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s ease;
  }
  .afc-cta:hover {
    transform: translateY(-3px);
    box-shadow: 0 20px 36px -10px color-mix(in srgb, var(--afc-blue) 72%, transparent);
  }
  .afc-cta:focus-visible {
    outline: 2px solid var(--afc-focus);
    outline-offset: 3px;
  }

  /* brillo sutil que recorre el botón de forma continua y pausada */
  .afc-block a.afc-cta::after {
    content: "";
    position: absolute;
    top: 0;
    left: -60%;
    width: 40%;
    height: 100%;
    background: linear-gradient(115deg, transparent 0%, rgba(255, 255, 255, 0.55) 50%, transparent 100%);
    transform: skewX(-18deg);
    animation: afc-cta-shine 4.8s ease-in-out infinite;
    pointer-events: none;
  }
  .afc-cta:hover::after {
    animation-duration: 2.2s;
  }

  .afc-cta__icon {
    display: inline-flex;
    flex: none;
    animation: afc-arrow-drift 2s ease-in-out infinite;
  }
  .afc-cta:hover .afc-cta__icon {
    animation-duration: 1.1s;
  }

  @keyframes afc-cta-shine {
    0% { left: -60%; }
    45% { left: 130%; }
    100% { left: 130%; }
  }

  @keyframes afc-arrow-drift {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(8px); }
  }

  /* ---------------------------------------------------------
     Panel fotográfico
  --------------------------------------------------------- */
  .afc-photo {
    position: relative;
    aspect-ratio: 8 / 5;
    width: 100%;
    border-radius: 28px;
    overflow: hidden;
    border: 1px solid var(--afc-panel-border);
    box-shadow:
      0 30px 60px -25px color-mix(in srgb, var(--afc-navy) 55%, transparent),
      0 2px 0 0 color-mix(in srgb, #FFFFFF 40%, transparent) inset;
  }

  .afc-photo__media {
    position: absolute;
    inset: 0;
  }

  .afc-photo img.afc-photo__real {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
  }

  /* Velo sutil en el borde inferior: mantiene legible la ola decorativa
     sobre la fotografía sin oscurecer la imagen. */
  .afc-photo__scrim {
    position: absolute;
    inset: auto 0 0 0;
    height: 42%;
    background: linear-gradient(to top, color-mix(in srgb, var(--afc-navy) 55%, transparent) 0%, transparent 100%);
    pointer-events: none;
  }

  .afc-photo__wave {
    position: absolute;
    left: -4%;
    right: -4%;
    bottom: -1px;
    width: 108%;
    height: auto;
    display: block;
  }
  .afc-photo__wave path { animation: afc-wave-drift 9s ease-in-out infinite; transform-origin: center; }
  .afc-photo__wave path.afc-wave--2 { animation-duration: 12s; animation-direction: reverse; }

  .afc-photo__frame-glow {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.18);
    pointer-events: none;
  }

  @keyframes afc-wave-drift {
    0%, 100% { transform: translateX(0) scaleY(1); }
    50% { transform: translateX(1.5%) scaleY(1.04); }
  }

  @keyframes afc-rise-in {
    from { opacity: 0; transform: translateY(14px); }
    to { opacity: 1; transform: translateY(0); }
  }
  .afc-anim-in {
    animation: afc-rise-in 0.8s cubic-bezier(0.22, 1, 0.36, 1) both;
  }
  .afc-anim-in--1 { animation-delay: 0.05s; }
  .afc-anim-in--2 { animation-delay: 0.16s; }
  .afc-anim-in--3 { animation-delay: 0.27s; }
  .afc-anim-in--4 { animation-delay: 0.38s; }
  .afc-anim-in--5 { animation-delay: 0.49s; }

  @media (prefers-reduced-motion: reduce) {
    .afc-anim-in { animation: none; }
    .afc-photo__wave path { animation: none; }
    .afc-cta, .afc-cta__icon { transition: none; }
    .afc-cta__icon { animation: none; }
    .afc-block a.afc-cta::after { animation: none; content: none; }
  }

  /* ---------------------------------------------------------
     Bloque 2 — Planes (entrada visual)
  --------------------------------------------------------- */
  .afc-plans {
    position: relative;
    padding: clamp(72px, 10vw, 128px) clamp(20px, 5vw, 56px);
    background: var(--afc-surface);
    scroll-margin-top: 100px;
  }

  .afc-plans__inner {
    max-width: 720px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    text-align: center;
  }

  .afc-plans__accent {
    width: 56px;
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(120deg, var(--afc-blue), var(--afc-turquoise), var(--afc-aqua));
  }

  .afc-plans__title {
    margin: 0;
    font-family: "Fraunces", ui-serif, Georgia, serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-size: clamp(1.9rem, 3.6vw, 2.75rem);
    line-height: 1.15;
    letter-spacing: -0.01em;
    text-wrap: balance;
    color: var(--afc-ink);
  }

  .afc-plans__intro {
    margin: 0;
    max-width: 54ch;
    font-size: clamp(1rem, 1.1vw, 1.1rem);
    line-height: 1.65;
    color: var(--afc-ink-soft);
    text-wrap: balance;
  }

  /* ---------------------------------------------------------
     Bloque 2 — Planes (tarjetas)
  --------------------------------------------------------- */
  .afc-plans__grid {
    max-width: 1320px;
    margin: clamp(44px, 6vw, 64px) auto 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(22px, 2.4vw, 30px);
    align-items: stretch;
  }

  .afc-plan-card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: var(--afc-bg);
    border-radius: 24px;
    border: 1px solid var(--afc-header-border);
    box-shadow: 0 18px 40px -30px hsla(var(--afc-shadow) / 0.5);
    overflow: hidden;
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.4s ease;
  }
  .afc-plan-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 28px 52px -26px hsla(var(--afc-shadow) / 0.55);
  }

  /* La tarjeta activa recibe un borde en degradé de marca para destacar */
  .afc-plan-card--featured {
    border: 2px solid transparent;
    background-image: linear-gradient(var(--afc-bg), var(--afc-bg)),
      linear-gradient(125deg, var(--afc-blue), var(--afc-turquoise), var(--afc-aqua));
    background-origin: border-box;
    background-clip: padding-box, border-box;
    box-shadow: 0 26px 54px -24px color-mix(in srgb, var(--afc-blue) 45%, transparent);
  }

  .afc-plan-card__media {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
  }

  .afc-plan-card__photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
  }

  .afc-plan-card__placeholder {
    position: absolute;
    inset: 0;
    background: linear-gradient(155deg, var(--afc-navy) 0%, var(--afc-blue) 55%, var(--afc-turquoise) 100%);
  }
  .afc-plan-card__placeholder--2 {
    background: linear-gradient(140deg, var(--afc-blue) 0%, var(--afc-turquoise) 50%, var(--afc-aqua) 100%);
  }
  .afc-plan-card__placeholder--3 {
    background: linear-gradient(150deg, var(--afc-navy) 0%, var(--afc-aqua) 65%, var(--afc-turquoise) 100%);
  }
  .afc-plan-card__placeholder--4 {
    background: linear-gradient(160deg, var(--afc-turquoise) 0%, var(--afc-navy) 60%, var(--afc-blue) 100%);
  }
  .afc-plan-card__placeholder--5 {
    background: linear-gradient(145deg, var(--afc-blue) 0%, var(--afc-navy) 55%, var(--afc-aqua) 100%);
  }
  .afc-plan-card__placeholder--6 {
    background: linear-gradient(165deg, var(--afc-aqua) 0%, var(--afc-blue) 50%, var(--afc-navy) 100%);
  }

  .afc-plan-card__tag {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 14px 16px;
    border-radius: 14px;
    background: rgba(7, 27, 48, 0.32);
    border: 1px dashed rgba(255, 255, 255, 0.5);
    color: #FFFFFF;
    text-align: center;
    max-width: 84%;
  }
  .afc-plan-card__tag svg { opacity: 0.9; flex: none; }
  .afc-plan-card__tag strong {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 0.74rem;
    font-weight: 600;
    letter-spacing: 0.02em;
  }
  .afc-plan-card__tag span {
    font-size: 0.68rem;
    line-height: 1.4;
    color: rgba(255, 255, 255, 0.85);
  }

  .afc-plan-badge {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 2;
    padding: 6px 14px;
    border-radius: 999px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }
  .afc-plan-badge--available {
    background: linear-gradient(120deg, var(--afc-blue), var(--afc-turquoise));
    color: #FFFFFF;
    box-shadow: 0 10px 20px -10px color-mix(in srgb, var(--afc-blue) 65%, transparent);
  }
  .afc-plan-badge--soon {
    background: var(--afc-badge-soon-bg);
    color: var(--afc-badge-soon-ink);
    border: 1px solid var(--afc-badge-soon-border);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
  }

  .afc-plan-card__body {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 26px clamp(20px, 3vw, 28px) 28px;
    flex: 1;
  }

  .afc-plan-card__title {
    margin: 0;
    font-family: "Fraunces", ui-serif, Georgia, serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-size: 1.38rem;
    line-height: 1.2;
    letter-spacing: -0.005em;
    color: var(--afc-ink);
    text-wrap: balance;
  }

  .afc-plan-card__promise {
    margin: 0;
    font-family: "Fraunces", ui-serif, Georgia, serif;
    font-style: italic;
    font-weight: 500;
    font-size: 1.02rem;
    line-height: 1.4;
    color: var(--afc-blue);
    text-wrap: balance;
  }

  .afc-plan-card__desc {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.62;
    color: var(--afc-ink-soft);
  }

  .afc-plan-card__list {
    list-style: none;
    margin: 2px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .afc-plan-card__list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 0.92rem;
    line-height: 1.5;
    color: var(--afc-ink);
  }
  .afc-plan-card__list svg {
    flex: none;
    margin-top: 2px;
    color: var(--afc-turquoise);
  }

  .afc-plan-card__price {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 8px;
    padding-top: 4px;
  }
  .afc-plan-price {
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1 1 140px;
    padding: 14px 16px;
    border-radius: 16px;
    background: var(--afc-bg);
    border: 1px solid color-mix(in srgb, var(--afc-turquoise) 22%, transparent);
    box-shadow: 0 6px 16px -12px color-mix(in srgb, var(--afc-navy) 30%, transparent);
  }
  /* Los precios ya no fuerzan la misma altura entre sí: la mensualidad
     ahora tiene más contenido y puede crecer verticalmente sin estirar
     (ni por tanto modificar visualmente) la caja de matrícula. */
  .afc-plan-card__price {
    align-items: flex-start;
  }
  /* La mensualidad es el precio principal: recuadro más presente,
     con más contraste y sombra para destacar sobre la matrícula. */

  /* Envoltorio que solo aplica la elevación + zoom continuos — separado
     de la caja visible para que :hover pueda intensificar el brillo y el
     borde de la caja sin pelear con esta animación (misma propiedad,
     mismo elemento = conflicto). El wrapper no cambia el layout: ocupa
     el mismo espacio flex que antes ocupaba la caja. */
  .afc-plan-price-float--monthly {
    display: flex;
    flex: 1 1 140px;
    animation: afc-price-lift 4s ease-in-out infinite;
    transform-origin: center;
  }
  @keyframes afc-price-lift {
    0%, 12% { transform: translateY(0) scale(1); }
    45% { transform: translateY(-3.5px) scale(1.03); }
    78%, 100% { transform: translateY(0) scale(1); }
  }

  .afc-plan-price--monthly {
    position: relative;
    padding: 16px 18px;
    background: color-mix(in srgb, #08AFC1 8%, var(--afc-bg));
    border: 1.5px solid color-mix(in srgb, #08AFC1 40%, transparent);
    box-shadow: 0 12px 26px -14px color-mix(in srgb, #08AFC1 45%, transparent);
    animation: afc-price-glow 4s ease-in-out infinite;
    transition: transform 0.3s ease;
  }
  /* El pulso de borde/sombra vive en la propia caja, en propiedades
     distintas a las del wrapper (box-shadow / border-color en vez de
     transform), para que ambas animaciones convivan sin pisarse. */
  @keyframes afc-price-glow {
    0%, 12% {
      box-shadow: 0 12px 26px -14px color-mix(in srgb, #08AFC1 45%, transparent);
      border-color: color-mix(in srgb, #08AFC1 40%, transparent);
    }
    45% {
      box-shadow: 0 18px 34px -12px color-mix(in srgb, #08AFC1 62%, transparent);
      border-color: color-mix(in srgb, #08AFC1 62%, transparent);
    }
    78%, 100% {
      box-shadow: 0 12px 26px -14px color-mix(in srgb, #08AFC1 45%, transparent);
      border-color: color-mix(in srgb, #08AFC1 40%, transparent);
    }
  }
  /* Brillo turquesa adicional al pasar el cursor: vive en un ::after
     propio (solo controlado por :hover, sin animación continua) para no
     competir con el pulso de arriba. */
  .afc-plan-price--monthly::after {
    content: "";
    position: absolute;
    inset: -4px;
    border-radius: inherit;
    box-shadow:
      0 0 0 2px color-mix(in srgb, #08AFC1 55%, transparent),
      0 20px 38px -14px color-mix(in srgb, #08AFC1 75%, transparent);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.35s ease;
  }
  .afc-plan-price--monthly:hover {
    transform: translateY(-2px) scale(1.015);
  }
  .afc-plan-price--monthly:hover::after {
    opacity: 1;
  }
  .afc-plan-price--enrollment {
    background: var(--afc-bg);
    border-color: color-mix(in srgb, var(--afc-turquoise) 32%, transparent);
    box-shadow: 0 4px 12px -10px color-mix(in srgb, var(--afc-navy) 22%, transparent);
  }
  .afc-plan-price__label {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--afc-ink-soft);
  }
  .afc-plan-price--monthly .afc-plan-price__label,
  .afc-plan-price--enrollment .afc-plan-price__label {
    color: var(--afc-navy);
    font-weight: 700;
  }
  .afc-plan-price__summary {
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1.4;
    color: var(--afc-ink-soft);
    margin-top: 3px;
  }
  .afc-plan-price__value {
    font-family: "Fraunces", ui-serif, Georgia, serif;
    font-weight: 600;
    font-size: 1.28rem;
    color: var(--afc-ink);
    font-variant-numeric: tabular-nums;
    line-height: 1.15;
  }
  .afc-plan-price__value--monthly {
    font-size: 36px;
    font-weight: 800;
    color: #08AFC1;
    margin-top: 6px;
  }
  .afc-plan-price__value--enrollment {
    font-size: 26px;
    font-weight: 800;
    color: #06366B;
  }
  .afc-plan-price__note {
    font-size: 0.72rem;
    font-weight: 500;
    color: var(--afc-ink-soft);
    margin-top: 1px;
  }

  /* ---------------------------------------------------------
     Precio de lanzamiento (mensualidad de los planes disponibles):
     valor regular tachado + insignia + precio protagonista + ahorro.
  --------------------------------------------------------- */
  .afc-plan-price__regular {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 2px;
  }
  .afc-plan-price__regular-label {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--afc-ink-soft);
  }
  .afc-plan-price__regular-value {
    font-size: 0.92rem;
    font-weight: 600;
    color: #7C90AC;
    text-decoration: line-through;
    text-decoration-thickness: 1.5px;
    font-variant-numeric: tabular-nums;
  }
  .afc-plan-price__launch-badge {
    display: inline-flex;
    align-self: flex-start;
    margin-top: 7px;
    padding: 4px 11px;
    border-radius: 999px;
    background: #08AFC1;
    color: #FFFFFF;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1.4;
  }
  .afc-plan-price__savings {
    display: inline-flex;
    align-self: flex-start;
    margin-top: 7px;
    padding: 4px 11px;
    border-radius: 999px;
    background: #25D366;
    color: #08120D;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1.4;
    box-shadow: 0 6px 14px -6px rgba(37, 211, 102, 0.55);
    transform-origin: center;
    animation: afc-savings-pulse 4s ease-in-out infinite;
    transition: filter 0.25s ease;
  }
  .afc-plan-price__savings:hover {
    filter: brightness(1.1);
  }
  /* Zoom suave y continuo — solo transform, así el filter del :hover
     (arriba) no compite con esta animación por la misma propiedad. */
  @keyframes afc-savings-pulse {
    0%, 12% { transform: scale(1); }
    45% { transform: scale(1.05); }
    78%, 100% { transform: scale(1); }
  }

  .afc-plan-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: auto;
    padding-top: 10px;
  }

  /* Nota de confianza bajo los botones de pago — discreta, no compite
     visualmente con el precio ni con los botones. */
  .afc-plan-card__trust {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-top: 10px;
    margin-bottom: 0;
    font-size: 0.68rem;
    line-height: 1.4;
    color: var(--afc-ink-soft);
  }
  .afc-plan-card__trust svg {
    flex: none;
    width: 14px;
    height: 14px;
    margin-top: 1px;
    opacity: 0.85;
  }

  /* ---------------------------------------------------------
     Botones reutilizables (tarjetas + WhatsApp)
  --------------------------------------------------------- */
  .afc-btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 8px;
    min-height: 48px;
    padding: 13px 22px;
    border-radius: 999px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 0.92rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.01em;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s ease, background 0.3s ease;
  }
  .afc-btn:focus-visible {
    outline: 2px solid var(--afc-focus);
    outline-offset: 3px;
  }
  .afc-btn--primary {
    background: linear-gradient(120deg, var(--afc-blue), var(--afc-turquoise));
    color: #FFFFFF;
    border: none;
    box-shadow: 0 12px 26px -14px color-mix(in srgb, var(--afc-blue) 65%, transparent);
  }
  .afc-btn--primary:hover {
    transform: scale(1.045);
    box-shadow: 0 18px 32px -12px color-mix(in srgb, var(--afc-blue) 70%, transparent);
  }
  /* Especificidad reforzada: ".afc-block a { color: inherit; }" (arriba)
     pesa más que ".afc-btn--primary" por el selector de tipo extra, así
     que se fija aquí el blanco en todos los estados del enlace. */
  .afc-block a.afc-btn--primary,
  .afc-block a.afc-btn--primary:link,
  .afc-block a.afc-btn--primary:visited,
  .afc-block a.afc-btn--primary:hover,
  .afc-block a.afc-btn--primary:focus,
  .afc-block a.afc-btn--primary:focus-visible,
  .afc-block a.afc-btn--primary:active {
    color: #FFFFFF;
  }
  /* Botón principal de reserva: diseñado para el tráfico de campañas.
     Entra con un zoom suave y luego mantiene un pulso discreto. */
  .afc-block a.afc-btn--reserve,
  .afc-block a.afc-btn--reserve:link,
  .afc-block a.afc-btn--reserve:visited {
    background: linear-gradient(120deg, #24F2D2 0%, #16D6EA 52%, #35B9FF 100%);
    color: #062B45;
    border: 2px solid rgba(255, 255, 255, 0.9);
    box-shadow: 0 14px 30px -10px rgba(0, 174, 205, 0.78), 0 0 0 5px rgba(36, 242, 210, 0.16);
    font-weight: 800;
    letter-spacing: 0.025em;
    text-transform: uppercase;
    transform-origin: center;
    animation: afc-reserve-enter 0.78s cubic-bezier(0.18, 0.9, 0.3, 1.25) both,
               afc-reserve-pulse 2.4s ease-in-out 1s infinite;
  }
  .afc-block a.afc-btn--reserve:hover,
  .afc-block a.afc-btn--reserve:focus-visible {
    color: #031D32;
    background: linear-gradient(120deg, #55FFE5 0%, #31E6F6 52%, #58C8FF 100%);
    box-shadow: 0 18px 38px -9px rgba(0, 145, 190, 0.88), 0 0 0 7px rgba(36, 242, 210, 0.22);
  }
  .afc-plan-journey__hint--priority strong {
    color: var(--afc-blue);
  }
  @keyframes afc-reserve-enter {
    0% { opacity: 0; transform: translateY(14px) scale(0.82); }
    68% { opacity: 1; transform: translateY(-2px) scale(1.06); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
  }
  @keyframes afc-reserve-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.055); }
  }
  @media (prefers-reduced-motion: reduce) {
    .afc-block a.afc-btn--reserve {
      animation: none;
    }
  }
  /* ---------------------------------------------------------
     Movimiento de los botones "Únete a la lista de espera"
     (tarjetas "Próximamente"). No afecta matrícula, mensualidad
     ni el botón flotante de WhatsApp: usan otras clases.
  --------------------------------------------------------- */
  .afc-waitlist-btn-float {
    display: inline-flex;
    transform-origin: center;
    animation: afc-waitlist-lift 4s ease-in-out infinite;
  }
  @keyframes afc-waitlist-lift {
    0%, 12% { transform: translateY(0) scale(1); }
    45% { transform: translateY(-3px) scale(1.03); }
    78%, 100% { transform: translateY(0) scale(1); }
  }
  /* Escalonado: cada tarjeta empieza su ciclo ~0.4s después de la
     anterior, para que las cinco no se muevan al mismo tiempo. */
  .afc-waitlist-btn-float--1 { animation-delay: 0s; }
  .afc-waitlist-btn-float--2 { animation-delay: 0.4s; }
  .afc-waitlist-btn-float--3 { animation-delay: 0.8s; }
  .afc-waitlist-btn-float--4 { animation-delay: 1.2s; }
  .afc-waitlist-btn-float--5 { animation-delay: 1.6s; }

  .afc-btn--waitlist {
    overflow: hidden;
    animation: afc-waitlist-shadow 4s ease-in-out infinite;
    transition: transform 0.3s ease;
  }
  .afc-waitlist-btn-float--1 .afc-btn--waitlist { animation-delay: 0s; }
  .afc-waitlist-btn-float--2 .afc-btn--waitlist { animation-delay: 0.4s; }
  .afc-waitlist-btn-float--3 .afc-btn--waitlist { animation-delay: 0.8s; }
  .afc-waitlist-btn-float--4 .afc-btn--waitlist { animation-delay: 1.2s; }
  .afc-waitlist-btn-float--5 .afc-btn--waitlist { animation-delay: 1.6s; }
  /* Sombra: pulsa entre la sombra base del botón y un realce turquesa,
     coordinada con la elevación del wrapper (misma duración/fases). */
  @keyframes afc-waitlist-shadow {
    0%, 12% { box-shadow: 0 12px 26px -14px color-mix(in srgb, var(--afc-blue) 65%, transparent); }
    45% { box-shadow: 0 20px 36px -12px color-mix(in srgb, #08AFC1 60%, transparent); }
    78%, 100% { box-shadow: 0 12px 26px -14px color-mix(in srgb, var(--afc-blue) 65%, transparent); }
  }
  /* Brillo diagonal turquesa que recorre el botón; vive en su propio
     ::before y en su propia animación para no competir con la sombra. */
  .afc-btn--waitlist::before {
    content: "";
    position: absolute;
    top: -60%;
    left: 0;
    width: 34%;
    height: 220%;
    background: linear-gradient(120deg, transparent, color-mix(in srgb, var(--afc-turquoise) 75%, white) , transparent);
    opacity: 0.85;
    transform: rotate(20deg) translateX(-320%);
    pointer-events: none;
    animation: afc-waitlist-shine 4s ease-in-out infinite;
  }
  .afc-waitlist-btn-float--1 .afc-btn--waitlist::before { animation-delay: 0s; }
  .afc-waitlist-btn-float--2 .afc-btn--waitlist::before { animation-delay: 0.4s; }
  .afc-waitlist-btn-float--3 .afc-btn--waitlist::before { animation-delay: 0.8s; }
  .afc-waitlist-btn-float--4 .afc-btn--waitlist::before { animation-delay: 1.2s; }
  .afc-waitlist-btn-float--5 .afc-btn--waitlist::before { animation-delay: 1.6s; }
  @keyframes afc-waitlist-shine {
    0%, 12% { transform: rotate(20deg) translateX(-320%); }
    50% { transform: rotate(20deg) translateX(420%); }
    78%, 100% { transform: rotate(20deg) translateX(420%); }
  }
  /* Hover: mismo zoom más pronunciado (1.05) que el resto de botones
     primarios (1.045) — el transform del botón está libre de conflicto
     porque la elevación continua vive en el wrapper, no aquí. Misma
     especificidad que ".afc-btn--primary:hover"; al declararse después
     en la hoja de estilos, gana por orden de aparición. */
  .afc-btn--waitlist:hover {
    transform: scale(1.05);
  }
  .afc-btn--secondary {
    background: transparent;
    color: var(--afc-blue);
    border: 1.5px solid color-mix(in srgb, var(--afc-blue) 42%, transparent);
  }
  .afc-btn--secondary:hover {
    transform: scale(1.045);
    background: color-mix(in srgb, var(--afc-blue) 8%, transparent);
  }
  .afc-block[data-afc-theme="dark"] .afc-btn--secondary { color: var(--afc-aqua); border-color: color-mix(in srgb, var(--afc-aqua) 45%, transparent); }
  @media (prefers-color-scheme: dark) {
    .afc-block:not([data-afc-theme="light"]) .afc-btn--secondary { color: var(--afc-aqua); border-color: color-mix(in srgb, var(--afc-aqua) 45%, transparent); }
  }

  /* Botón "Ya realicé mis pagos" — paso 3 del recorrido de inscripción.
     Fondo azul marino sólido, letras blancas. */
  .afc-btn--ficha {
    background: var(--afc-navy);
    color: #FFFFFF;
    border: none;
    box-shadow: 0 12px 26px -14px color-mix(in srgb, var(--afc-navy) 55%, transparent);
  }
  .afc-btn--ficha:hover {
    transform: scale(1.045);
    box-shadow: 0 18px 32px -12px color-mix(in srgb, var(--afc-navy) 60%, transparent);
  }
  /* Misma especificidad reforzada que ".afc-btn--primary": ".afc-block a { color: inherit; }"
     pesa más que ".afc-btn--ficha" por el selector de tipo extra, así que se fija
     aquí el blanco en todos los estados del enlace. */
  .afc-block a.afc-btn--ficha,
  .afc-block a.afc-btn--ficha:link,
  .afc-block a.afc-btn--ficha:visited,
  .afc-block a.afc-btn--ficha:hover,
  .afc-block a.afc-btn--ficha:focus,
  .afc-block a.afc-btn--ficha:focus-visible,
  .afc-block a.afc-btn--ficha:active {
    color: #FFFFFF;
  }

  /* ---------------------------------------------------------
     Recorrido de inscripción (3 pasos): matrícula → mensualidad →
     ficha de bienvenida. Reemplaza la fila simple de dos botones
     en las tarjetas disponibles por una secuencia numerada, clara
     y compacta, con una pista breve bajo cada botón.
  --------------------------------------------------------- */
  .afc-plan-journey {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: auto;
    padding-top: 10px;
  }
  .afc-plan-journey__step {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .afc-plan-journey__row {
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .afc-plan-journey__number {
    flex: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    background: var(--afc-turquoise);
    color: #FFFFFF;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 0.72rem;
    font-weight: 700;
  }
  .afc-plan-journey__btn {
    flex: 1 1 auto;
    min-width: 0;
  }
  .afc-plan-journey__hint {
    margin: 0;
    padding-left: 32px;
    font-size: 0.72rem;
    line-height: 1.4;
    color: var(--afc-ink-soft);
  }
  .afc-plan-journey__note {
    margin: 4px 0 0;
    padding-top: 10px;
    border-top: 1px solid color-mix(in srgb, var(--afc-turquoise) 25%, transparent);
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.45;
    color: var(--afc-ink-soft);
  }
  @media (max-width: 480px) {
    .afc-plan-journey__number { width: 20px; height: 20px; font-size: 0.68rem; }
    .afc-plan-journey__hint { padding-left: 30px; }
  }

  /* ---------------------------------------------------------
     Botón flotante de WhatsApp
  --------------------------------------------------------- */
  .afc-whatsapp-wrap {
    position: fixed;
    right: calc(20px + env(safe-area-inset-right, 0px));
    bottom: calc(20px + env(safe-area-inset-bottom, 0px));
    z-index: 45;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 14px;
  }
  .afc-whatsapp-float {
    display: inline-flex;
    transform-origin: center;
    animation: afc-whatsapp-float 4.6s ease-in-out infinite;
  }
  @keyframes afc-whatsapp-float {
    0%, 14% { transform: translateY(0) scale(1); }
    45% { transform: translateY(-7px) scale(1.045); }
    76%, 100% { transform: translateY(0) scale(1); }
  }
  .afc-whatsapp {
    position: relative;
    flex: none;
    width: 68px;
    height: 68px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #25D366;
    text-decoration: none;
    box-shadow:
      0 16px 32px -12px color-mix(in srgb, #25D366 60%, transparent),
      0 6px 16px -4px rgba(10, 42, 77, 0.28);
    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s ease;
  }
  .afc-whatsapp:hover,
  .afc-whatsapp:focus-visible {
    transform: scale(1.14);
    box-shadow:
      0 20px 38px -12px color-mix(in srgb, #25D366 70%, transparent),
      0 8px 18px -4px rgba(10, 42, 77, 0.32);
  }
  .afc-whatsapp:focus-visible {
    outline: 2px solid #FFFFFF;
    outline-offset: 3px;
  }
  .afc-whatsapp__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    position: relative;
    z-index: 1;
  }
  .afc-whatsapp__icon svg {
    width: 34px;
    height: 34px;
    display: block;
  }
  .afc-whatsapp__ring {
    position: absolute;
    inset: 0;
    z-index: 0;
    border-radius: 50%;
    border: 2px solid color-mix(in srgb, #25D366 70%, transparent);
    pointer-events: none;
    opacity: 0;
    animation: afc-whatsapp-ring 3s ease-out infinite;
    will-change: transform, opacity;
  }
  .afc-whatsapp__ring--2 {
    animation-delay: 1.5s;
  }

  /* El anillo parte del tamaño del botón (68px) y crece hasta un máximo
     de ~88px de diámetro (< 90px), siempre contenido dentro de su propia
     caja absoluta — nunca se extiende sobre el resto de la página. */
  @keyframes afc-whatsapp-ring {
    0% { transform: scale(1); opacity: 0.55; }
    100% { transform: scale(1.3); opacity: 0; }
  }

  .afc-whatsapp__tooltip {
    display: inline-flex;
    align-items: center;
    background: #FFFFFF;
    color: var(--afc-navy);
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 600;
    font-size: 0.92rem;
    line-height: 1.2;
    padding: 11px 18px;
    border-radius: 999px;
    white-space: nowrap;
    box-shadow: 0 12px 26px -12px color-mix(in srgb, var(--afc-navy) 50%, transparent);
    opacity: 0;
    transform: scale(1);
    transition: transform 0.3s ease, box-shadow 0.3s ease, color 0.3s ease;
    animation: afc-whatsapp-tooltip-in 0.6s ease 1s forwards;
  }
  .afc-whatsapp__tooltip-text--short { display: none; }

  /* Solo se anima la opacidad (aparición); el transform de escala queda
     libre para que :hover pueda controlarlo sin conflictos. */
  @keyframes afc-whatsapp-tooltip-in {
    to { opacity: 1; }
  }

  .afc-whatsapp-wrap:hover .afc-whatsapp__tooltip,
  .afc-whatsapp-wrap:focus-within .afc-whatsapp__tooltip {
    transform: scale(1.06);
    color: #1CAB56;
    box-shadow: 0 16px 32px -12px color-mix(in srgb, var(--afc-navy) 58%, transparent);
  }

  @media (prefers-reduced-motion: reduce) {
    .afc-topbar { animation: none; }
    .afc-whatsapp-float { animation: none; }
    .afc-whatsapp__ring { animation: none; opacity: 0; }
    .afc-whatsapp__tooltip { animation: none; opacity: 1; transform: scale(1); }
    .afc-whatsapp-wrap:hover .afc-whatsapp__tooltip,
    .afc-whatsapp-wrap:focus-within .afc-whatsapp__tooltip { transform: scale(1); }
    .afc-plan-card, .afc-btn, .afc-whatsapp, .afc-whatsapp__tooltip { transition: none; }
    .afc-plan-price-float--monthly { animation: none; }
    .afc-plan-price--monthly { animation: none; transition: none; }
    .afc-plan-price--monthly::after { transition: none; }
    .afc-plan-price__savings { animation: none; transition: none; }
    .afc-waitlist-btn-float { animation: none; }
    .afc-btn--waitlist { animation: none; transition: none; }
    .afc-btn--waitlist::before { animation: none; opacity: 0; }
  }

  /* ---------------------------------------------------------
     Sede y galería de la piscina
  --------------------------------------------------------- */
  .afc-location {
    position: relative;
    padding: clamp(70px, 9vw, 112px) clamp(20px, 5vw, 72px);
    background:
      radial-gradient(circle at 8% 12%, color-mix(in srgb, var(--afc-aqua) 18%, transparent), transparent 36%),
      linear-gradient(180deg, var(--afc-bg-soft) 0%, var(--afc-bg) 100%);
    border-top: 1px solid var(--afc-header-border);
  }

  .afc-location__inner {
    width: min(1240px, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(280px, 0.82fr) minmax(0, 1.18fr);
    gap: clamp(34px, 5vw, 72px);
    align-items: center;
  }

  .afc-location__copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }

  .afc-location__eyebrow {
    margin: 0 0 12px;
    color: var(--afc-turquoise);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
  }

  .afc-location__title {
    margin: 0;
    font-family: "Fraunces", ui-serif, Georgia, serif;
    font-size: clamp(2rem, 3.8vw, 3.25rem);
    line-height: 1.08;
    color: var(--afc-ink);
    text-wrap: balance;
  }

  .afc-location__text {
    margin: 22px 0 0;
    color: var(--afc-ink-soft);
    font-size: 1.02rem;
    line-height: 1.72;
  }

  .afc-location__address {
    width: 100%;
    margin: 24px 0 0;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    gap: 14px;
    color: var(--afc-ink);
    font-style: normal;
    line-height: 1.5;
    background: var(--afc-bg);
    border: 1px solid var(--afc-header-border);
    border-radius: 18px;
    box-shadow: 0 18px 34px -28px hsla(var(--afc-shadow) / 0.65);
  }

  .afc-location__pin {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    font-size: 1.45rem;
    background: linear-gradient(135deg, var(--afc-blue), var(--afc-turquoise));
  }

  .afc-location__actions {
    margin-top: 22px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
  }

  .afc-location__actions .afc-btn {
    min-height: 50px;
    text-align: center;
  }

  .afc-location__evaluation {
    box-shadow: 0 14px 34px -15px color-mix(in srgb, var(--afc-turquoise) 70%, transparent);
  }

  .afc-location__evaluation-note {
    margin: 14px 0 0;
    color: var(--afc-ink-soft);
    font-size: 0.84rem;
    line-height: 1.55;
  }

  .afc-gallery {
    min-width: 0;
  }

  .afc-gallery__viewport {
    overflow: hidden;
    border-radius: 26px;
    border: 1px solid var(--afc-header-border);
    background: var(--afc-navy);
    box-shadow: 0 30px 56px -30px hsla(var(--afc-shadow) / 0.7);
  }

  .afc-gallery__track {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
  }
  .afc-gallery__track::-webkit-scrollbar { display: none; }

  .afc-gallery__slide {
    position: relative;
    min-width: 100%;
    margin: 0;
    aspect-ratio: 4 / 3;
    scroll-snap-align: start;
    overflow: hidden;
  }

  .afc-gallery__slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .afc-gallery__slide figcaption {
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 16px;
    padding: 10px 14px;
    border-radius: 14px;
    color: #fff;
    font-size: 0.86rem;
    font-weight: 700;
    text-align: center;
    background: rgba(5, 31, 58, 0.76);
    backdrop-filter: blur(8px);
  }

  .afc-gallery__controls {
    margin-top: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
  }

  .afc-gallery__button {
    width: 44px;
    height: 44px;
    border: 1px solid var(--afc-header-border);
    border-radius: 50%;
    color: var(--afc-navy);
    background: var(--afc-bg);
    font-size: 1.2rem;
    cursor: pointer;
    box-shadow: 0 12px 24px -16px hsla(var(--afc-shadow) / 0.7);
    transition: transform 0.25s ease, color 0.25s ease, background 0.25s ease;
  }
  .afc-gallery__button:hover,
  .afc-gallery__button:focus-visible {
    transform: translateY(-2px);
    color: #fff;
    background: var(--afc-blue);
  }
  .afc-gallery__button:focus-visible { outline: 3px solid color-mix(in srgb, var(--afc-aqua) 55%, transparent); }

  .afc-gallery__counter {
    min-width: 62px;
    color: var(--afc-ink-soft);
    font-size: 0.86rem;
    font-weight: 700;
    text-align: center;
  }

  @media (max-width: 900px) {
    .afc-location__inner { grid-template-columns: 1fr; }
    .afc-gallery { order: -1; }
  }

  @media (max-width: 560px) {
    .afc-location { padding-left: 16px; padding-right: 16px; }
    .afc-location__actions { width: 100%; flex-direction: column; }
    .afc-location__actions .afc-btn { width: 100%; }
    .afc-gallery__viewport { border-radius: 20px; }
    .afc-gallery__slide { aspect-ratio: 4 / 5; }
  }

  /* ---------------------------------------------------------
     Responsivo
  --------------------------------------------------------- */
  @media (max-width: 900px) {
    .afc-hero__inner {
      grid-template-columns: 1fr;
    }
    .afc-photo { order: -1; }
    .afc-hero__copy { align-items: flex-start; }
  }

  @media (max-width: 1080px) {
    .afc-plans__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  @media (max-width: 480px) {
    .afc-header { padding: 6px 16px; }
    .afc-logo { height: 56px; max-height: 56px; padding: 4px 8px; }
    .afc-hero { padding-left: 16px; padding-right: 16px; }
    .afc-cta { width: 100%; justify-content: center; }
    .afc-photo { border-radius: 20px; }
    .afc-plans { scroll-margin-top: 90px; }
    .afc-plan-card__actions { flex-direction: column; align-items: stretch; }
    .afc-plan-card__actions .afc-btn { width: 100%; }
    .afc-plan-card__price { gap: 12px; }
  }

  @media (max-width: 640px) {
    .afc-whatsapp-wrap {
      right: calc(14px + env(safe-area-inset-right, 0px));
      bottom: calc(14px + env(safe-area-inset-bottom, 0px));
      gap: 10px;
    }
    .afc-whatsapp {
      width: 60px;
      height: 60px;
    }
    .afc-whatsapp__icon svg {
      width: 29px;
      height: 29px;
    }
    .afc-whatsapp__tooltip {
      font-size: 0.82rem;
      padding: 9px 14px;
    }
    .afc-whatsapp__tooltip-text--full { display: none; }
    .afc-whatsapp__tooltip-text--short { display: inline; }
    .afc-plans__grid { grid-template-columns: 1fr; }
  }

  /* ---------------------------------------------------------
     Bloque final — Cierre emocional
     Fondo azul marino profundo, ondas y luces suaves. Reutiliza
     .afc-btn / .afc-btn--primary ya existentes; solo se agrega
     la variante de WhatsApp.
  --------------------------------------------------------- */
  .afc-farewell {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    padding: clamp(76px, 11vw, 132px) clamp(20px, 5vw, 56px) clamp(64px, 9vw, 100px);
    background: linear-gradient(165deg, #05192E 0%, var(--afc-navy) 55%, #0C3860 100%);
  }

  .afc-farewell__glow {
    position: absolute;
    z-index: 0;
    border-radius: 50%;
    filter: blur(64px);
    pointer-events: none;
  }
  .afc-farewell__glow--1 {
    width: 420px;
    height: 420px;
    top: -140px;
    left: -100px;
    background: radial-gradient(circle, color-mix(in srgb, var(--afc-turquoise) 55%, transparent) 0%, transparent 72%);
    animation: afc-farewell-drift-1 15s ease-in-out infinite;
  }
  .afc-farewell__glow--2 {
    width: 380px;
    height: 380px;
    bottom: -150px;
    right: -80px;
    background: radial-gradient(circle, color-mix(in srgb, var(--afc-aqua) 50%, transparent) 0%, transparent 72%);
    animation: afc-farewell-drift-2 18s ease-in-out infinite;
  }
  @keyframes afc-farewell-drift-1 {
    0%, 100% { transform: translate(0, 0); opacity: 0.65; }
    50% { transform: translate(26px, 18px); opacity: 1; }
  }
  @keyframes afc-farewell-drift-2 {
    0%, 100% { transform: translate(0, 0); opacity: 0.55; }
    50% { transform: translate(-22px, -16px); opacity: 0.9; }
  }

  .afc-farewell__waves {
    position: absolute;
    z-index: 0;
    left: 0;
    right: 0;
    bottom: -2px;
    width: 100%;
    height: auto;
    pointer-events: none;
  }
  .afc-farewell__wave--1 { fill: color-mix(in srgb, var(--afc-turquoise) 24%, transparent); }
  .afc-farewell__wave--2 { fill: color-mix(in srgb, var(--afc-aqua) 16%, transparent); }

  .afc-farewell__inner {
    position: relative;
    z-index: 1;
    max-width: 760px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 22px;
    text-align: center;
  }

  .afc-farewell__title {
    margin: 0;
    font-family: "Fraunces", ui-serif, Georgia, serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-size: clamp(2rem, 4vw, 3rem);
    line-height: 1.15;
    letter-spacing: -0.01em;
    text-wrap: balance;
    color: #FFFFFF;
  }

  .afc-farewell__text {
    margin: 0;
    max-width: 56ch;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: clamp(1rem, 1.1vw, 1.1rem);
    line-height: 1.65;
    color: rgba(255, 255, 255, 0.82);
    text-wrap: balance;
  }

  .afc-farewell__points {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: clamp(18px, 3vw, 34px);
    list-style: none;
    margin: 6px 0 0;
    padding: 0;
  }
  .afc-farewell__point {
    display: flex;
    align-items: center;
    gap: 12px;
    max-width: 260px;
    text-align: left;
  }
  .afc-farewell__point-icon {
    flex: none;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: var(--afc-aqua);
  }
  .afc-farewell__point-icon svg {
    width: 21px;
    height: 21px;
  }
  .afc-farewell__point-text {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 0.94rem;
    font-weight: 500;
    line-height: 1.42;
    color: rgba(255, 255, 255, 0.9);
  }

  .afc-farewell__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
    margin-top: 10px;
  }

  .afc-btn--whatsapp {
    background: #25D366;
    border: none;
    box-shadow: 0 12px 26px -14px rgba(37, 211, 102, 0.6);
  }
  .afc-btn--whatsapp:hover {
    transform: scale(1.045);
    box-shadow: 0 18px 34px -12px rgba(37, 211, 102, 0.7);
  }
  .afc-btn__icon {
    display: inline-flex;
    flex: none;
  }
  /* Misma especificidad reforzada que .afc-btn--primary: ".afc-block a { color: inherit; }"
     pesa más por el selector de tipo extra, así que se fija el blanco aquí en todos los
     estados del enlace. */
  .afc-block a.afc-btn--whatsapp,
  .afc-block a.afc-btn--whatsapp:link,
  .afc-block a.afc-btn--whatsapp:visited,
  .afc-block a.afc-btn--whatsapp:hover,
  .afc-block a.afc-btn--whatsapp:focus,
  .afc-block a.afc-btn--whatsapp:focus-visible,
  .afc-block a.afc-btn--whatsapp:active {
    color: #FFFFFF;
  }

  /* Entrada suave al hacer scroll — solo para este bloque de cierre. */
  .afc-farewell__reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .afc-farewell__reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
  }
  .afc-farewell__reveal--1 { transition-delay: 0.12s; }
  .afc-farewell__reveal--2 { transition-delay: 0.24s; }
  .afc-farewell__reveal--3 { transition-delay: 0.36s; }

  @media (max-width: 560px) {
    .afc-farewell__actions {
      flex-direction: column;
      align-items: stretch;
    }
    .afc-farewell__actions .afc-btn {
      width: 100%;
    }
    .afc-farewell__points {
      flex-direction: column;
      align-items: flex-start;
      gap: 16px;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .afc-farewell__glow--1,
    .afc-farewell__glow--2 { animation: none; }
    .afc-farewell__reveal {
      opacity: 1;
      transform: none;
      transition: none;
    }
  }