/*
Theme Name: Bela Custom
Author: David
Version: 1.0
*/

:root{
  --bela-purple: #7A1B7E;
  --bela-purple-dark: #5E0F61;
  --bela-soft: rgba(122, 27, 126, .10);

  --text: #111;
  --muted: #6b7280;
  --border: rgba(0,0,0,.10);

  --radius: 16px;
}

/* Base */
*{ box-sizing: border-box; }
html, body{ margin:0; padding:0; }
html.bela-no-scroll{ overflow:hidden; }
body{ font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color: var(--text); }

.bela-container{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

/* =========================
   HEADER (logo | menu | cta)
   ========================= */

.bela-header{
  background: #fff;
  border-bottom: 1px solid rgba(0,0,0,.06);
}

.bela-header__inner{
  max-width: 1200px;
  margin: 0 auto;
  padding: 14px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

/* Logo */
.bela-brand{ display:flex; align-items:center; text-decoration:none; }
.bela-brand img{ max-height: 44px; width:auto; display:block; }
.bela-brand__text{ font-weight:800; color:#111; }

/* Nav Desktop */
.bela-nav{ flex: 1; display:flex; justify-content:center; min-width: 0; }
.bela-nav__list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap: 18px;
  align-items:center;

  /* CLAVE para que no “bote” raro */
  flex-wrap: wrap;
  justify-content: center;
  row-gap: 10px;
}

.bela-nav__list a{
  text-decoration:none;
  color:#111;
  font-weight:600;
  font-size:14px;
  padding: 10px 12px;
  border-radius: 999px;
}
.bela-nav__list a:hover{
  background: var(--bela-soft);
}
.bela-nav__list .current-menu-item > a{
  background: var(--bela-soft);
  color: var(--bela-purple-dark);
}

/* CTA */
.bela-cta{ display:flex; justify-content:flex-end; }
.bela-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 10px 16px;
  border-radius: 999px;
  text-decoration:none;
  font-weight:700;
  font-size:14px;
  border: 1px solid rgba(0,0,0,.08);
  transition: transform .15s ease, opacity .15s ease;
}
.bela-btn:hover{ transform: translateY(-1px); opacity:.95; }

.bela-btn--primary{
  background: var(--bela-purple);
  color:#fff;
  box-shadow: 0 10px 25px rgba(122,27,126,.18);
}
.bela-btn--ghost{
  background:#fff;
  color: var(--bela-purple-dark);
  border: 1px solid rgba(122,27,126,.25);
}
.bela-btn--full{ width:100%; }

/* ===== Burger pro (icono + animación) ===== */
.bela-burger{
  display:none;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.85);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  cursor:pointer;
  position: relative;
  box-shadow: 0 12px 26px rgba(0,0,0,.08);
}

.bela-burger span{
  position:absolute;
  left: 14px;
  right: 14px;
  height: 2px;
  background:#111;
  border-radius: 2px;
  transition: transform .18s ease, top .18s ease, opacity .18s ease;
}

.bela-burger span:nth-child(1){ top: 16px; }
.bela-burger span:nth-child(2){ top: 22px; }
.bela-burger span:nth-child(3){ top: 28px; }

/* Cuando el menú está abierto (usamos aria-expanded=true) */
.bela-burger[aria-expanded="true"] span:nth-child(1){
  top: 22px;
  transform: rotate(45deg);
}
.bela-burger[aria-expanded="true"] span:nth-child(2){
  opacity: 0;
}
.bela-burger[aria-expanded="true"] span:nth-child(3){
  top: 22px;
  transform: rotate(-45deg);
}

/* ===== Overlay más elegante ===== */
.bela-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.35);
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease;
  z-index: 998;
}
.bela-overlay.is-open{
  opacity: 1;
  pointer-events: auto;
}

/* ===== Panel móvil premium ===== */
.bela-mobile{
  position: fixed;
  top: 14px;
  right: 14px;
  width: min(380px, 92vw);
  height: calc(100vh - 28px);
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 22px;
  box-shadow: 0 30px 80px rgba(0,0,0,.18);
  transform: translateX(110%);
  transition: transform .22s ease;
  z-index: 999;
  padding: 16px;
  display:flex;
  flex-direction:column;
  gap: 14px;
}
.bela-mobile.is-open{ transform: translateX(0); }

.bela-mobile__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
}
.bela-mobile__title{
  font-weight: 900;
  letter-spacing: -0.01em;
}

.bela-mobile__close{
  width: 44px;
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.85);
  cursor:pointer;
}

.bela-mobile__list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap: 10px;
}
.bela-mobile__list a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 14px;
  border-radius: 16px;
  text-decoration:none;
  color:#111;
  font-weight:800;
  background: rgba(0,0,0,.03);
  border: 1px solid rgba(0,0,0,.05);
}
.bela-mobile__list a:hover{
  background: var(--bela-soft);
  border-color: rgba(122,27,126,.18);
}

.bela-mobile__cta{ margin-top:auto; }

/* =========================
   HOME (Hero/Sections) - tu base
   ========================= */
.bela-main{ padding: 0; }

/* Hero */
.bela-hero{
  background: #fff;
  padding: 34px 0 10px;
}
.bela-hero__inner{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 24px;
  align-items:center;
}
.bela-kicker{
  display:inline-flex;
  padding: 8px 12px;
  border-radius: 999px;
  background: var(--bela-soft);
  color: var(--bela-purple-dark);
  font-weight: 700;
  margin: 0 0 14px;
}
.bela-h1{
  font-size: clamp(34px, 4vw, 56px);
  line-height: 1.05;
  margin: 0 0 14px;
  letter-spacing: -0.02em;
}
.bela-accent{ color: var(--bela-purple); }
.bela-lead{
  color: var(--muted);
  font-size: 16px;
  line-height: 1.6;
  margin: 0 0 18px;
  max-width: 54ch;
}
.bela-hero__actions{ display:flex; gap: 12px; flex-wrap: wrap; }

.bela-trust{
  margin-top: 14px;
  color: var(--muted);
  display:flex;
  align-items:center;
  gap: 10px;
  font-weight: 600;
  font-size: 13px;
}
.bela-dot{
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #f59e0b;
  display:inline-block;
}

/* Hero media */
.bela-hero__card{
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 22px;
  padding: 16px;
  background: #fff;
  box-shadow: 0 22px 60px rgba(0,0,0,.08);
}
.bela-hero__badge{
  display:inline-flex;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.06);
  font-weight: 800;
  font-size: 12px;
  margin-bottom: 12px;
}
.bela-hero__image{
  height: 320px;
  border-radius: 18px;
  background:
    radial-gradient(circle at 20% 20%, rgba(122,27,126,.18), transparent 60%),
    radial-gradient(circle at 80% 40%, rgba(122,27,126,.12), transparent 55%),
    linear-gradient(135deg, rgba(122,27,126,.14), rgba(255,255,255,.35)),
    url("/wp-content/uploads/2026/02/img1.webp") center/cover no-repeat;
}

/* Sections */
.bela-section{ padding: 40px 0; }
.bela-h2{
  font-size: 34px;
  letter-spacing: -0.02em;
  margin: 0 0 8px;
}
.bela-subtitle{
  margin: 0 0 20px;
  color: var(--muted);
  line-height: 1.6;
}

.bela-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.bela-card{
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 18px;
  padding: 18px;
  background:#fff;
  box-shadow: 0 12px 32px rgba(0,0,0,.06);
}
.bela-icon{
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: var(--bela-soft);
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom: 10px;
  font-size: 18px;
}
.bela-card h3{ margin: 0 0 8px; }
.bela-card p{ margin: 0; color: var(--muted); line-height: 1.6; }

/* CTA final (el bloque morado) */
.bela-cta-section{
  padding: 26px 0 52px;
  background: rgba(122,27,126,.05);
}
.bela-cta-box{
  width: 100%;
  border: 1px solid rgba(122,27,126,.18);
  border-radius: 22px;
  padding: 26px;
  background: radial-gradient(circle at 20% 20%, rgba(122,27,126,.12), transparent 55%),
              #fff;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 18px;

  /* CLAVE para que no quede pegado en móvil */
  margin: 0 auto;
}

/* =========================
   Responsive
   ========================= */
@media (max-width: 980px){
  .bela-nav{ display:none; }
  .bela-cta{ display:none; }
  .bela-burger{ display:inline-flex; }

  .bela-hero__inner{
    grid-template-columns: 1fr;
  }
  .bela-grid{
    grid-template-columns: 1fr;
  }

  .bela-cta-box{
    flex-direction: column;
    align-items: flex-start;
    padding: 18px;
  }
}

/* ===== Mobile menu: hover/active con sombra morada (como desktop) ===== */
.bela-mobile__list a{
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.bela-mobile__list a:hover{
  box-shadow: 0 10px 24px rgba(122,27,126,.18);
  transform: translateY(-1px);
}

.bela-mobile__list .current-menu-item > a{
  background: var(--bela-soft);
  border-color: rgba(122,27,126,.22);
  color: var(--bela-purple-dark);
  box-shadow: 0 10px 24px rgba(122,27,126,.16);
}

/* ===== Mejoras MENU MÓVIL (look premium) ===== */
.bela-mobile__list .current-menu-item > a{
  background: var(--bela-soft);
  border-color: rgba(122,27,126,.22);
  color: var(--bela-purple-dark);
  box-shadow: 0 10px 24px rgba(122,27,126,.16);
}

/* Hover/Focus con sombra morada */
.bela-mobile__list a:hover,
.bela-mobile__list a:focus{
  background: var(--bela-soft);
  border-color: rgba(122,27,126,.22);
  box-shadow: 0 10px 24px rgba(122,27,126,.14);
  outline: none;
}

/* =========================
   FOOTER v6 (Premium Clinic) - 100% responsive
   ========================= */
.bela-btn--fullOnMobile{ width:auto; }

.bela-footer6{
  margin-top: 34px;
  background: #fff;
  border-top: 1px solid rgba(0,0,0,.06);
}

.bela-footer6__panel{
  margin: 0 auto;
  padding: 22px 0 20px;
}

.bela-footer6__panel{
  border-top: 4px solid rgba(122,27,126,.18);
}

/* Panel suave (sin fondo oscuro, look premium) */
.bela-footer6__panel{
  background:
    radial-gradient(circle at 15% 10%, rgba(122,27,126,.08), transparent 45%),
    radial-gradient(circle at 90% 0%, rgba(122,27,126,.05), transparent 40%),
    #fff;
  border-radius: 22px 22px 0 0;
}

/* Grid */
.bela-footer6__grid{
  display:grid;
  grid-template-columns: 1.35fr .95fr .95fr;
  gap: 20px;
  padding: 18px 0 8px;
  align-items:start;
}

/* Brand */
.bela-footer6__logo{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
  margin-bottom: 10px;
}
.bela-footer6__logo img{ max-height: 42px; width:auto; display:block; }
.bela-footer6__logoText{
  font-weight: 900;
  color:#111;
  letter-spacing:-0.02em;
  font-size:18px;
}

.bela-footer6__desc{
  margin: 0 0 14px;
  color: var(--muted);
  line-height: 1.7;
  font-weight: 650;
  max-width: 62ch;
}

/* Actions */
.bela-footer6__actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

/* Trust */
.bela-footer6__trust{
  color: var(--muted);
  display:flex;
  align-items:center;
  gap: 10px;
  font-weight: 650;
  font-size: 13px;
}
.bela-footer6__dot{
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #f59e0b;
  display:inline-block;
}

/* Titles */
.bela-footer6__title{
  margin: 0 0 12px;
  font-size: 13px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(17,17,17,.68);
  font-weight: 900;
}

/* Links (grid limpio, no “contamina”) */
.bela-footer6__linkGrid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.bela-footer6__linkGrid a{
  text-decoration:none;
  color:#111;
  font-weight: 800;
  padding: 12px 12px;
  border-radius: 14px;
  background: rgba(0,0,0,.02);
  border: 1px solid rgba(0,0,0,.05);
  transition: background .15s ease, transform .15s ease, border-color .15s ease;
}
.bela-footer6__linkGrid a:hover{
  background: var(--bela-soft);
  border-color: rgba(122,27,126,.22);
  transform: translateY(-1px);
}

/* Contact card */
.bela-footer6__card{
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 18px;
  background: rgba(255,255,255,.85);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: 14px;
  box-shadow: 0 18px 45px rgba(0,0,0,.06);
}

.bela-footer6__row{
  display:flex;
  justify-content:space-between;
  gap: 12px;
  padding: 10px 10px;
  border-radius: 14px;
}
.bela-footer6__row + .bela-footer6__row{
  border-top: 1px solid rgba(0,0,0,.06);
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.bela-footer6__label{
  font-weight: 900;
  color: rgba(17,17,17,.62);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.bela-footer6__value{
  font-weight: 900;
  color:#111;
  text-decoration:none;
}
.bela-footer6__value:hover{
  color: var(--bela-purple-dark);
}

/* Pills */
.bela-footer6__pills{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.bela-footer6__pill{
  display:inline-flex;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(122,27,126,.18);
  background: rgba(122,27,126,.06);
  color: var(--bela-purple-dark);
  font-weight: 900;
  font-size: 12px;
}

/* Bottom */
.bela-footer6__bottom{
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(0,0,0,.06);
  display:flex;
  justify-content: space-between;
  align-items:center;
  gap: 12px;
  flex-wrap: wrap;
}

.bela-footer6__legal{
  display:flex;
  gap: 10px;
  align-items:center;
  flex-wrap: wrap;
  font-weight: 800;
  font-size: 13px;
  color: rgba(17,17,17,.70);
}
.bela-footer6__legal a{
  color: rgba(17,17,17,.72);
  text-decoration:none;
  padding: 8px 10px;
  border-radius: 999px;
}
.bela-footer6__legal a:hover{
  background: rgba(0,0,0,.03);
  color:#111;
}
.bela-footer6__sep{ opacity:.6; }

.bela-footer6__copy{
  color: rgba(17,17,17,.68);
  font-weight: 900;
  font-size: 13px;
}

/* ===== Responsive Breakpoints ===== */
@media (max-width: 1024px){
  .bela-footer6__grid{
    grid-template-columns: 1.2fr 1fr;
  }
  .bela-footer6__contact{
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px){
  .bela-footer6__grid{
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .bela-footer6__linkGrid{
    grid-template-columns: 1fr; /* links 1 col en móvil */
  }

  .bela-footer6__row{
    flex-direction: column;     /* contact stack en móvil */
    align-items:flex-start;
  }

  .bela-btn--fullOnMobile{
    width: 100%;               /* CTAs a full ancho */
  }
}

/* --- FOOTER: fondo extendido (sin corte) --- */

/* El fondo bonito vive en TODO el footer */
.bela-footer6{
  background:
    radial-gradient(circle at 15% 0%, rgba(122,27,126,.08), transparent 52%),
    radial-gradient(circle at 90% 10%, rgba(122,27,126,.06), transparent 55%),
    rgba(122,27,126,.03);
  border-top: 1px solid rgba(0,0,0,.06);
}

/* El panel YA NO tiene fondo (para que no se vea como bloque cortado) */
.bela-footer6__panel{
  background: transparent;
  border-radius: 0;
  border-top: 4px solid rgba(122,27,126,.18);
}

/* Si querías el “panel” tipo tarjeta, lo dejamos sutil con padding y nada de corte */
.bela-footer6__panel{
  padding: 34px 0 22px;
}

/* =========================
   Sticky CTA (Mobile Only)
   ========================= */
.bela-sticky-cta{
  display:none;
}

@media (max-width: 980px){
  .bela-sticky-cta{
    display:block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 997; /* debajo del panel móvil (999) y overlay (998) */
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
    background: rgba(255,255,255,.82);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-top: 1px solid rgba(0,0,0,.08);
  }

  .bela-sticky-cta__inner{
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    align-items: center;
  }

  .bela-sticky-cta__btn{
    height: 46px;
    width: 100%;
    justify-content: center;
    box-shadow: 0 14px 30px rgba(122,27,126,.18);
  }

  .bela-sticky-cta__icon{
    height: 46px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,.08);
    background: rgba(255,255,255,.92);
    text-decoration: none;
    font-weight: 900;
    color: #111;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
  }
  .bela-sticky-cta__icon:hover{
    background: var(--bela-soft);
    border-color: rgba(122,27,126,.22);
  }

  /* Evita que el sticky tape el footer/último contenido */
  body{
    padding-bottom: 86px;
  }
}

/* Si el menú móvil está abierto, ocultamos el sticky CTA */
@media (max-width: 980px){
  html.bela-no-scroll .bela-sticky-cta{
    display:none;
  }
}

/* =========================
   FIX: Menú móvil con scroll interno
   ========================= */

/* El panel móvil debe poder contener scroll interno */
.bela-mobile{
  overflow: hidden; /* evita que todo el panel “tiemble” */
}

/* El listado del menú: scroll vertical dentro del panel */
.bela-mobile__list{
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  max-height: calc(100vh - 220px); /* ajusta el espacio: top + cta */
  padding-right: 6px; /* espacio para la barra de scroll */
}

/* Si tienes CTA abajo, asegúrate que no tape el menú */
.bela-mobile__cta{
  margin-top: auto;
  padding-top: 10px;
}

/* Mejora visual del scroll (opcional, no rompe) */
.bela-mobile__list::-webkit-scrollbar{
  width: 8px;
}
.bela-mobile__list::-webkit-scrollbar-thumb{
  background: rgba(122,27,126,.25);
  border-radius: 10px;
}

/* Fuerza layout flex correcto para permitir scroll interno */
.bela-mobile{
  display: flex;
  flex-direction: column;
}
.bela-mobile__list{
  flex: 1;
  min-height: 0; /* CLAVE para que flex permita overflow */
}

/* ===== FIX MENÚ MÓVIL: CTA visible + lista con scroll ===== */
.bela-mobile{
  height: min(680px, calc(100vh - 28px)); /* panel más compacto */
}

.bela-mobile__list{
  flex: 1;
  min-height: 0;
  overflow-y: auto;                 /* scroll solo en la lista */
  -webkit-overflow-scrolling: touch;
  padding-right: 4px;               /* evita que el scroll tape contenido */
}

.bela-mobile__cta{
  margin-top: 12px;                 /* pequeño respiro arriba del botón */
}

/* Logo WP dentro del header */
.bela-brand .custom-logo-link{
  display:flex;
  align-items:center;
  text-decoration:none;
}

.bela-brand .custom-logo{
  max-height: 44px;
  width: auto;
  display:block;
}

/* Fix: header no debe “romper” el menu a 2 líneas por el logo */
.bela-header__inner{
  gap: 14px; /* antes 18px */
}

.bela-brand img{
  max-height: 38px; /* antes 44px */
}

.bela-nav__list{
  gap: 14px;         /* antes 18px */
  row-gap: 8px;      /* si llega a romper, se ve menos feo */
}

.bela-nav__list a{
  padding: 9px 10px; /* antes 10px 12px */
  font-size: 13px;   /* antes 14px */
}

/* El CTA ocupa bastante: lo compactamos */
.bela-cta .bela-btn{
  padding: 9px 14px;
  font-size: 13px;
}

@media (max-width: 980px){
  .bela-cta-section{
    background:
      radial-gradient(circle at 20% 20%, rgba(122,27,126,.08), transparent 55%),
      radial-gradient(circle at 90% 20%, rgba(122,27,126,.06), transparent 55%),
      linear-gradient(180deg, rgba(255,255,255,1), rgba(122,27,126,.04));
  }
}

@media (max-width: 980px){
  .bela-sticky-cta__icon{
    display:none !important;
  }
}

/* FIX URGENTE: evita que algo empuje la web a un lado */
html, body{
  max-width: 100%;
  overflow-x: hidden;
}
img, svg{
  max-width: 100%;
  height: auto;
}

/* =========================
   TRUST BAR (Acreditaciones / Alianzas)
   ========================= */
.bela-trustbar{
  padding: 12px 0 26px;
  background:
    radial-gradient(circle at 20% 20%, rgba(122,27,126,.06), transparent 55%),
    radial-gradient(circle at 90% 10%, rgba(122,27,126,.04), transparent 55%),
    #fff;
}

.bela-trustbar__kicker{
  margin: 0 0 10px;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(17,17,17,.60);
  font-weight: 900;
}

.bela-trustbar__row{
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
}

.bela-badge{
  display:inline-flex;
  align-items:center;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(122,27,126,.18);
  background: rgba(122,27,126,.06);
  color: var(--bela-purple-dark);
  font-weight: 900;
  font-size: 13px;
}

@media (max-width: 980px){
  .bela-badge{
    font-size: 12px;
    padding: 9px 11px;
  }
}

/* =========================
   HOME: Procedimientos destacados (cards)
   ========================= */
.bela-sectionHead{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}

.bela-proc{
  background: linear-gradient(180deg, rgba(255,255,255,1), rgba(122,27,126,.03));
}

.bela-procGrid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.bela-procCard{
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 18px;
  background:
    radial-gradient(circle at 15% 10%, rgba(122,27,126,.08), transparent 55%),
    #fff;
  padding: 16px;
  box-shadow: 0 14px 34px rgba(0,0,0,.06);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.bela-procCard:hover{
  transform: translateY(-2px);
  border-color: rgba(122,27,126,.20);
  box-shadow: 0 18px 46px rgba(122,27,126,.10);
}

.bela-procCard h3{
  margin: 0 0 8px;
  font-size: 16px;
  letter-spacing: -0.01em;
}

.bela-procCard p{
  margin: 0 0 12px;
  color: var(--muted);
  line-height: 1.6;
}

.bela-procLink{
  display:inline-flex;
  text-decoration:none;
  font-weight: 900;
  color: var(--bela-purple-dark);
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(122,27,126,.08);
  border: 1px solid rgba(122,27,126,.16);
}

.bela-procLink:hover{
  background: rgba(122,27,126,.12);
  border-color: rgba(122,27,126,.22);
}

.bela-procCtaRow{
  margin-top: 14px;
}

/* Responsive */
@media (max-width: 980px){
  .bela-procGrid{
    grid-template-columns: 1fr;
  }
}

/* ===============================
   PROCEDIMIENTOS PAGE
=================================*/

/* HERO PREMIUM */

.procedimientos-hero {
    position: relative;
    padding: 200px 20px 160px;
    overflow: hidden;
    text-align: center;
    color: #111;
}

.hero-bg {
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg,#f3e8f7,#ffffff,#f7f0fa);
    background-size: 300% 300%;
    animation: gradientMove 10s ease infinite;
}

@keyframes gradientMove {
    0% { background-position: 0% 50%;}
    50% { background-position: 100% 50%;}
    100% { background-position: 0% 50%;}
}

.hero-content {
    position: relative;
    z-index: 2;
}

.hero-title {
    font-size: clamp(36px,6vw,72px);
    font-weight: 500;
    margin-bottom: 20px;
    letter-spacing: -2px;
}

.hero-sub {
    font-size: 20px;
    max-width: 650px;
    margin: 0 auto 40px;
    color: #555;
}

.btn-hero {
    padding: 18px 45px;
    background: linear-gradient(135deg,#7a1c7c,#b42ab5);
    color: white;
    border-radius: 60px;
    font-weight: 600;
    text-decoration: none;
    transition: 0.3s ease;
}

.btn-hero:hover {
    transform: translateY(-5px);
    box-shadow: 0 25px 50px rgba(122,28,124,0.3);
}

/* GRID RESPONSIVE REAL */

.procedimientos-grid {
    padding: 80px 20px;
}

.procedimientos-grid .container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 40px;
}

.procedimiento-card {
    background: #ffffff;
    padding: 30px;
    border-radius: 28px;
    box-shadow: 0 30px 70px rgba(0,0,0,0.04);
    transition: all 0.4s ease;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid rgba(0,0,0,0.03);
}

.procedimiento-card:hover {
    transform: translateY(-12px);
    box-shadow: 0 40px 90px rgba(122,28,124,0.15);
}

.procedimiento-card img {
    width: 100%;
    height: 240px;
    object-fit: cover;
    border-radius: 20px;
    margin-bottom: 20px;
    transition: 0.4s ease;
}

.procedimiento-card:hover img {
    transform: scale(1.04);
}

.procedimiento-card h3 {
    font-size: 24px;
    margin-bottom: 12px;
    font-weight: 600;
}

.procedimiento-card p {
    color: #666;
    margin-bottom: 25px;
    flex-grow: 1;
    line-height: 1.6;
}

/* CTA */

.procedimientos-cta {
    padding: 150px 20px;
    text-align: center;
    background: linear-gradient(135deg,#7a1c7c,#b42ab5);
    color: white;
    position: relative;
    overflow: hidden;
}

.procedimientos-cta::before {
    content: "";
    position: absolute;
    top: -100%;
    left: -50%;
    width: 200%;
    height: 300%;
    background: radial-gradient(circle, rgba(255,255,255,0.2), transparent 60%);
    animation: pulseLight 6s infinite linear;
}

@keyframes pulseLight {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.btn-primary {
    display: inline-block;
    padding: 16px 38px;
    background: linear-gradient(135deg,#7a1c7c,#b42ab5);
    color: white;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    transition: 0.3s ease;
}

.btn-primary:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 40px rgba(122,28,124,0.3);
}

.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: 0.8s ease;
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* ===============================
   BELA PAGE SYSTEM (BASE)
=================================*/

.bela-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

.bela-hero { position: relative; padding: 160px 0 110px; overflow: hidden; }
.bela-hero .hero-inner { text-align: center; max-width: 900px; margin: 0 auto; }
.bela-badge { display:inline-block; padding: 8px 16px; border-radius: 999px; background: rgba(122,28,124,.10); color:#7a1c7c; font-weight:600; font-size:14px; }

.bela-hero__title { font-size: clamp(40px, 5vw, 70px); line-height: 1.05; margin: 18px 0; letter-spacing: -1px; }
.bela-hero__sub { font-size: 18px; color:#555; max-width: 720px; margin: 0 auto; line-height: 1.6; }

.bela-section { padding: 90px 0; }
.bela-sectionHead { text-align:center; margin-bottom: 40px; }
.bela-h2 { font-size: clamp(26px, 3vw, 38px); margin-bottom: 12px; }
.bela-subtitle { color:#666; max-width: 760px; margin: 0 auto; }

.bela-grid { display:grid; gap: 32px; }
.bela-grid--cards { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.bela-grid--feature { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.bela-grid--posts { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.bela-grid--gallery { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.bela-grid--quotes { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }

.bela-card {
  background:#fff;
  border-radius: 24px;
  padding: 26px;
  border: 1px solid rgba(0,0,0,.03);
  box-shadow: 0 30px 70px rgba(0,0,0,.04);
  transition: .35s ease;
}
.bela-card:hover { transform: translateY(-8px); box-shadow: 0 40px 90px rgba(122,28,124,.14); }

.bela-media img { width:100%; height: 240px; object-fit: cover; border-radius: 18px; }
.bela-cardBody { padding-top: 16px; }
.bela-h3 { font-size: 22px; margin: 0 0 10px; }
.bela-link { color:#7a1c7c; font-weight: 600; text-decoration:none; }
.bela-link:hover { text-decoration: underline; }

.bela-btn { display:inline-block; text-decoration:none; font-weight:600; border-radius: 999px; padding: 14px 28px; transition:.25s ease; }
.bela-btn--primary { background: linear-gradient(135deg,#7a1c7c,#b42ab5); color:#fff; }
.bela-btn--primary:hover { transform: translateY(-3px); box-shadow: 0 20px 45px rgba(122,28,124,.28); }
.bela-btn--outline { border: 1px solid rgba(122,28,124,.3); color:#7a1c7c; background:#fff; }
.bela-btn--outline:hover { background: rgba(122,28,124,.06); }

.bela-ctaBox{
  margin-top: 60px;
  text-align:center;
  padding: 60px 20px;
  border-radius: 30px;
  background: linear-gradient(180deg,#faf7fc,#f3eef6);
}
.bela-ctaBox h2{ font-size: clamp(24px,3vw,34px); margin-bottom: 10px; }
.bela-ctaBox p{ color:#666; margin-bottom: 24px; }

/* Quotes */
.bela-quote { background:#fff; border-radius: 24px; padding: 26px; box-shadow: 0 30px 70px rgba(0,0,0,.04); border:1px solid rgba(0,0,0,.03); position:relative; }
.bela-quoteMark { font-size: 60px; color: rgba(122,28,124,.25); line-height: 1; }
.bela-quoteUser { display:flex; gap: 12px; align-items:center; margin-top: 16px; }
.bela-avatar { width:44px; height:44px; border-radius: 50%; background: linear-gradient(135deg,#7a1c7c,#b42ab5); opacity:.25; }

/* Chips */
.bela-filterRow { display:flex; gap: 10px; flex-wrap:wrap; justify-content:center; margin: 20px 0 40px; }
.bela-chip { border:1px solid rgba(122,28,124,.25); background:#fff; color:#7a1c7c; padding: 10px 14px; border-radius: 999px; cursor:pointer; font-weight:600; }
.bela-chip.is-active, .bela-chip:hover { background: rgba(122,28,124,.08); }

/* Simple reveal (si ya usas el observer) */
.reveal { opacity:0; transform: translateY(24px); transition:.8s ease; }
.reveal.active { opacity:1; transform: translateY(0); }

@media (max-width: 768px){
  .bela-media img{ height: 200px; }
  .bela-hero { padding: 130px 0 90px; }
}

/* SUBMENU PROCEDIMIENTOS */
.proc-subnav { padding: 20px 0 10px; }
.proc-subnav__inner {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}
.proc-tab{
  display:inline-flex;
  align-items:center;
  padding: 10px 16px;
  border-radius: 999px;
  text-decoration:none;
  font-weight: 600;
  color: #7a1c7c;
  border: 1px solid rgba(122,28,124,.25);
  background: #fff;
  transition: .2s ease;
}
.proc-tab:hover{ background: rgba(122,28,124,.08); }
.proc-tab.is-active{
  background: linear-gradient(135deg,#7a1c7c,#b42ab5);
  color:#fff;
  border-color: transparent;
}
@media (max-width: 768px){
  .proc-subnav__inner{ justify-content:flex-start; overflow:auto; padding-bottom: 6px; }
  .proc-tab{ white-space: nowrap; }
}

/* =========================
   HEADER PRO: sticky + compacto
   ========================= */
.bela-header{
  position: sticky;
  top: 0;
  z-index: 997; /* debajo del menu móvil (999) y overlay (998) */
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.bela-header__inner{
  padding: 10px 20px; /* antes 14px */
}

.bela-brand img{
  max-height: 36px; /* antes 44/38 */
}

.bela-nav__list a{
  padding: 8px 10px; /* un poco más compacto */
  font-size: 13px;
}

.bela-cta .bela-btn{
  padding: 8px 14px;
  font-size: 13px;
}

/* Evita salto visual cuando queda sticky */
.bela-hero{
  padding-top: 24px; /* reduce espacio inicial */
}

/* =========================
   TOP BAR (Banner bajo el menú)
   ========================= */
.bela-topbar{
  border-top: 1px solid rgba(0,0,0,.05);
  border-bottom: 1px solid rgba(0,0,0,.05);
  background:
    radial-gradient(circle at 20% 20%, rgba(122,27,126,.10), transparent 55%),
    rgba(122,27,126,.03);
}

.bela-topbar__inner{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 20px;
}

.bela-topbar__left{
  display:flex;
  align-items:center;
  gap: 10px;
  min-width: 0;
}

.bela-topbar__badge{
  display:inline-flex;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(122,27,126,.12);
  color: var(--bela-purple-dark);
  font-weight: 900;
  font-size: 12px;
  border: 1px solid rgba(122,27,126,.16);
}

.bela-topbar__text{
  color: rgba(17,17,17,.70);
  font-weight: 700;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bela-topbar__link{
  text-decoration:none;
  font-weight: 900;
  font-size: 13px;
  color: var(--bela-purple-dark);
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(122,27,126,.18);
}
.bela-topbar__link:hover{
  background: var(--bela-soft);
}

/* Móvil: que no se rompa */
@media (max-width: 980px){
  .bela-topbar__inner{
    flex-direction: column;
    align-items: flex-start;
  }
  .bela-topbar__text{
    white-space: normal;
  }
}

/* =========================
   FIX TOPBAR en móvil/tablet (compacta + pro)
   ========================= */

/* Por defecto ok en desktop */
.bela-topbar__inner{
  gap: 12px;
}

/* Tablet/Móvil */
@media (max-width: 980px){
  .bela-topbar__inner{
    flex-direction: row;          /* NO columna */
    align-items: center;
    justify-content: space-between;
    padding: 8px 14px;            /* menos alto */
    gap: 10px;
  }

  .bela-topbar__left{
    min-width: 0;                 /* para truncar texto */
    gap: 8px;
  }

  .bela-topbar__badge{
    padding: 5px 9px;
    font-size: 11px;
    flex: 0 0 auto;
  }

  /* Texto en una línea con ellipsis (no empuja la página) */
  .bela-topbar__text{
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 55vw;
  }

  /* CTA compacto */
  .bela-topbar__link{
    flex: 0 0 auto;
    padding: 7px 10px;
    font-size: 12px;
    white-space: nowrap;
  }
}

/* Móvil pequeño: ocultamos el badge para ganar espacio */
@media (max-width: 520px){
  .bela-topbar__badge{
    display: none;
  }
  .bela-topbar__text{
    max-width: 65vw;
  }
}

/* =========================
   HOME: Experiencia BELA / Journey
   ========================= */
.bela-journey{
  background:
    radial-gradient(circle at 16% 10%, rgba(122,27,126,.06), transparent 48%),
    linear-gradient(180deg, #fff, rgba(122,27,126,.025));
}

.bela-journeyGrid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 18px;
}

.bela-journeyCard{
  position: relative;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 22px;
  background: #fff;
  padding: 22px;
  box-shadow: 0 18px 46px rgba(0,0,0,.06);
  overflow: hidden;
}

.bela-journeyCard::before{
  content:"";
  position:absolute;
  inset: 0;
  background: radial-gradient(circle at 20% 0%, rgba(122,27,126,.10), transparent 50%);
  pointer-events:none;
}

.bela-journeyNumber{
  position: relative;
  display:inline-flex;
  width: 46px;
  height: 46px;
  border-radius: 16px;
  align-items:center;
  justify-content:center;
  background: var(--bela-soft);
  color: var(--bela-purple-dark);
  font-weight: 900;
  margin-bottom: 14px;
}

.bela-journeyCard h3,
.bela-journeyCard p{
  position: relative;
}

.bela-journeyCard h3{
  margin: 0 0 8px;
}

.bela-journeyCard p{
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
}

@media (max-width: 980px){
  .bela-journeyGrid{
    grid-template-columns: 1fr;
  }
}

/* =========================
   HOME: compactar espacios entre secciones
   ========================= */

/* Hero más compacto */
.bela-hero{
  padding-top: 14px !important;
  padding-bottom: 0 !important;
}

/* Menos aire entre secciones generales */
.bela-section{
  padding: 28px 0 !important;
}

/* Trustbar más pegada al hero */
.bela-trustbar{
  padding: 16px 0 !important;
}

/* Ajuste especial: primera sección después del trustbar */
.bela-trustbar + .bela-section{
  padding-top: 30px !important;
}

/* Menos aire en Procedimientos */
.bela-proc{
  padding-top: 30px !important;
  padding-bottom: 36px !important;
}

/* CTA final más compacto */
.bela-cta-section{
  padding: 24px 0 38px !important;
}

/* Responsive */
@media (max-width: 980px){
  .bela-hero{
    padding-top: 18px !important;
  }

  .bela-section{
    padding: 24px 0 !important;
  }

  .bela-trustbar{
    padding: 14px 0 !important;
  }

  .bela-proc{
    padding-top: 24px !important;
    padding-bottom: 30px !important;
  }
}

/* =========================
   HOME: Aliados estratégicos
   ========================= */
.bela-partners{
  padding: 18px 0 !important;
}

.bela-partners__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 16px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.bela-partners__text{
  margin: 0;
  color: var(--muted);
  font-weight: 650;
  font-size: 14px;
  max-width: 62ch;
}

.bela-partners__grid{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
}

.bela-partnerLogo{
  min-height: 88px;
  border-radius: 18px;
  border: 1px solid rgba(122,27,126,.12);
  background: rgba(255,255,255,.82);
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 16px;
  box-shadow: 0 12px 32px rgba(0,0,0,.04);
}

.bela-partnerLogo img{
  max-width: 100%;
  max-height: 54px;
  object-fit: contain;
  filter: grayscale(1);
  opacity: .72;
  transition: filter .18s ease, opacity .18s ease, transform .18s ease;
}

.bela-partnerLogo:hover img{
  filter: grayscale(0);
  opacity: 1;
  transform: translateY(-1px);
}

@media (max-width: 980px){
  .bela-partners__grid{
    grid-template-columns: repeat(2, 1fr);
  }

  .bela-partnerLogo{
    min-height: 78px;
  }
}

@media (max-width: 520px){
  .bela-partners__grid{
    grid-template-columns: 1fr;
  }
}

/* =========================
   HOME: Journey Premium
   ========================= */
.bela-sectionHead--center{
  text-align:center;
  max-width: 820px;
  margin: 0 auto 20px;
}

.bela-sectionHead--center .bela-subtitle{
  margin-left:auto;
  margin-right:auto;
}

.bela-journey--premium{
  background:
    radial-gradient(circle at 20% 10%, rgba(122,27,126,.07), transparent 45%),
    linear-gradient(180deg, #fff, rgba(122,27,126,.025));
}

.bela-journeyFlow{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  position:relative;
}

.bela-flowCard{
  position:relative;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 24px;
  padding: 24px;
  background:#fff;
  box-shadow: 0 20px 50px rgba(0,0,0,.06);
  overflow:hidden;
}

.bela-flowCard::before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at 20% 0%, rgba(122,27,126,.10), transparent 55%);
  pointer-events:none;
}

.bela-flowCard--featured{
  transform: translateY(-10px);
  border-color: rgba(122,27,126,.20);
  box-shadow: 0 26px 70px rgba(122,27,126,.13);
}

.bela-flowStep,
.bela-flowIcon,
.bela-flowCard h3,
.bela-flowCard p{
  position:relative;
}

.bela-flowStep{
  display:inline-flex;
  padding: 8px 10px;
  border-radius: 14px;
  background: var(--bela-soft);
  color: var(--bela-purple-dark);
  font-weight:900;
  margin-bottom: 14px;
}

.bela-flowIcon{
  font-size: 26px;
  margin-bottom: 10px;
}

.bela-flowCard h3{
  margin: 0 0 8px;
}

.bela-flowCard p{
  margin:0;
  color: var(--muted);
  line-height:1.7;
}

/* =========================
   HOME: Procedimientos Premium
   ========================= */
.bela-proc--premium{
  background:
    radial-gradient(circle at 92% 10%, rgba(122,27,126,.06), transparent 48%),
    #fff;
}

.bela-procPremiumGrid{
  display:grid;
  grid-template-columns: 1.15fr 1fr 1fr;
  gap: 14px;
}

.bela-procPremiumCard{
  position:relative;
  min-height: 178px;
  border-radius: 22px;
  border: 1px solid rgba(0,0,0,.06);
  background:
    radial-gradient(circle at 10% 0%, rgba(122,27,126,.08), transparent 48%),
    #fff;
  padding: 20px;
  box-shadow: 0 16px 42px rgba(0,0,0,.055);
  overflow:hidden;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.bela-procPremiumCard:hover{
  transform: translateY(-3px);
  border-color: rgba(122,27,126,.20);
  box-shadow: 0 24px 65px rgba(122,27,126,.10);
}

.bela-procPremiumCard--main{
  grid-row: span 2;
  min-height: 370px;
  background:
    radial-gradient(circle at 20% 10%, rgba(122,27,126,.16), transparent 52%),
    linear-gradient(135deg, rgba(122,27,126,.08), rgba(255,255,255,1));
}

.bela-procEmoji{
  font-size: 36px;
  margin: 20px 0 12px;
}

.bela-procTag{
  display:inline-flex;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(122,27,126,.08);
  color: var(--bela-purple-dark);
  border: 1px solid rgba(122,27,126,.14);
  font-size: 12px;
  font-weight:900;
}

.bela-procPremiumCard h3{
  margin: 14px 0 8px;
}

.bela-procPremiumCard p{
  margin: 0 0 14px;
  color: var(--muted);
  line-height:1.6;
}

@media (max-width: 980px){
  .bela-journeyFlow{
    grid-template-columns: 1fr;
  }

  .bela-flowCard--featured{
    transform:none;
  }

  .bela-procPremiumGrid{
    grid-template-columns: 1fr;
  }

  .bela-procPremiumCard--main{
    grid-row:auto;
    min-height:auto;
  }
}

/* =========================
   Página Testimonios
   ========================= */

.testi-hero{
  padding: 46px 0 24px;
  background:
    radial-gradient(circle at 20% 10%, rgba(122,27,126,.08), transparent 48%),
    #fff;
}

.testi-hero__inner{
  text-align:center;
  max-width: 860px;
  margin: 0 auto;
}

.bela-pageHero__title{
  font-size: clamp(42px, 6vw, 82px);
  line-height: .95;
  letter-spacing: -0.04em;
  margin: 14px 0 14px;
}

.bela-pageHero__text{
  color: var(--muted);
  font-size: 18px;
  line-height: 1.6;
  margin: 0 auto 20px;
  max-width: 760px;
}

.testi-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.testi-card{
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 24px;
  background:#fff;
  overflow:hidden;
  box-shadow: 0 18px 46px rgba(0,0,0,.06);
}

.testi-card__photo{
  height: 230px;
  background: rgba(122,27,126,.05);
}

.testi-card__photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.testi-card__content{
  padding: 22px;
}

.testi-card__quote{
  display:block;
  color: rgba(122,27,126,.25);
  font-size: 54px;
  line-height: .8;
  font-weight: 900;
  margin-bottom: 8px;
}

.testi-card__content p{
  margin: 0 0 18px;
  color: var(--text);
  line-height: 1.7;
}

.testi-card__person{
  display:flex;
  flex-direction:column;
  gap: 2px;
}

.testi-card__person strong{
  color:#111;
  font-weight: 900;
}

.testi-card__person span{
  color: var(--muted);
  font-size: 14px;
}

.testi-video-section{
  background: rgba(122,27,126,.035);
}

.testi-video-box{
  border: 1px solid rgba(122,27,126,.14);
  border-radius: 24px;
  background:#fff;
  padding: 26px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap: 18px;
  box-shadow: 0 18px 46px rgba(0,0,0,.045);
}

@media (max-width: 980px){
  .testi-grid{
    grid-template-columns: 1fr;
  }

  .testi-video-box{
    flex-direction:column;
    align-items:flex-start;
  }

  .testi-card__photo{
    height: 260px;
  }
}

/* =========================
   Página Testimonios Premium
   ========================= */

.testi-hero{
  padding: 42px 0 26px;
  background:
    radial-gradient(circle at 20% 10%, rgba(122,27,126,.08), transparent 48%),
    #fff;
}

.testi-hero__inner{
  text-align:center;
  max-width: 860px;
  margin: 0 auto;
}

.bela-pageHero__title{
  font-size: clamp(42px, 6vw, 82px);
  line-height: .95;
  letter-spacing: -0.04em;
  margin: 14px 0 14px;
}

.bela-pageHero__text{
  color: var(--muted);
  font-size: 18px;
  line-height: 1.6;
  margin: 0 auto 20px;
  max-width: 760px;
}

/* Testimonio destacado */
.testi-featured-section{
  padding-top: 24px !important;
  background: #fff;
}

.testi-featured{
  display:grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 24px;
  align-items:center;
  border: 1px solid rgba(122,27,126,.14);
  border-radius: 28px;
  background:
    radial-gradient(circle at 15% 10%, rgba(122,27,126,.10), transparent 52%),
    #fff;
  padding: 18px;
  box-shadow: 0 22px 70px rgba(0,0,0,.07);
}

.testi-featured__image{
  height: 520px;
  border-radius: 22px;
  overflow:hidden;
  background: rgba(122,27,126,.06);
}

.testi-featured__image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}

.testi-featured__content{
  padding: 14px 18px;
}

.testi-featured__content p{
  color: var(--muted);
  line-height: 1.8;
  font-size: 17px;
}

.testi-person{
  display:flex;
  flex-direction:column;
  gap: 3px;
  margin-top: 18px;
}

.testi-person strong{
  font-weight: 900;
  color:#111;
}

.testi-person span{
  color: var(--muted);
}

/* Grid */
.testi-list{
  padding-top: 34px !important;
}

.testi-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.testi-card{
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 24px;
  background:#fff;
  overflow:hidden;
  box-shadow: 0 18px 46px rgba(0,0,0,.06);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.testi-card:hover{
  transform: translateY(-3px);
  border-color: rgba(122,27,126,.18);
  box-shadow: 0 24px 65px rgba(122,27,126,.10);
}

.testi-card__photo{
  height: 340px;
  background: rgba(122,27,126,.05);
}

.testi-card__photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
  display:block;
}

.testi-card__content{
  padding: 22px;
}

.testi-card__quote{
  display:block;
  color: rgba(122,27,126,.25);
  font-size: 54px;
  line-height: .8;
  font-weight: 900;
  margin-bottom: 8px;
}

.testi-card__content p{
  margin: 0 0 18px;
  color: var(--text);
  line-height: 1.7;
}

.testi-card__person{
  display:flex;
  flex-direction:column;
  gap: 2px;
}

.testi-card__person strong{
  color:#111;
  font-weight: 900;
}

.testi-card__person span{
  color: var(--muted);
  font-size: 14px;
}

/* Card final suave */
.testi-card--soft{
  background:
    radial-gradient(circle at 20% 10%, rgba(122,27,126,.12), transparent 52%),
    rgba(122,27,126,.035);
  border-color: rgba(122,27,126,.14);
}

.testi-card__content--center{
  min-height: 100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
}

.testi-card__content--center h3{
  margin: 0 0 10px;
  font-size: 24px;
}

/* Responsive */
@media (max-width: 980px){
  .testi-featured{
    grid-template-columns: 1fr;
  }

  .testi-featured__image{
    height: 430px;
  }

  .testi-grid{
    grid-template-columns: 1fr;
  }

  .testi-card__photo{
    height: 430px;
  }
}

@media (max-width: 520px){
  .testi-hero{
    padding-top: 30px;
  }

  .testi-featured{
    padding: 14px;
  }

  .testi-featured__image,
  .testi-card__photo{
    height: 360px;
  }

  .testi-featured__content,
  .testi-card__content{
    padding: 18px;
  }
}

/* =========================
   Página Postoperatorio / Recovery House
   ========================= */

/* Hero */
.pos-hero{
  padding: 42px 0 34px !important;
  background:
    radial-gradient(circle at 18% 10%, rgba(122,27,126,.08), transparent 44%),
    radial-gradient(circle at 90% 20%, rgba(122,27,126,.045), transparent 45%),
    #fff;
}

.pos-hero__inner{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 34px;
  align-items:center;
}

.pos-hero__content{
  max-width: 820px;
}

.pos-hero .bela-pageHero__title{
  font-size: clamp(44px, 6vw, 86px);
  line-height: .96;
  letter-spacing: -0.055em;
  margin: 18px 0 18px;
}

.pos-hero .bela-pageHero__text{
  color: var(--muted);
  font-size: 19px;
  line-height: 1.65;
  max-width: 760px;
  margin: 0 0 24px;
}

/* Panel derecho del hero */
.pos-hero__panel{
  border: 1px solid rgba(122,27,126,.14);
  border-radius: 30px;
  background:
    radial-gradient(circle at 20% 0%, rgba(122,27,126,.13), transparent 52%),
    linear-gradient(180deg, #fff, rgba(122,27,126,.035));
  padding: 26px;
  box-shadow: 0 24px 70px rgba(0,0,0,.07);
}

.pos-hero__mini{
  border-radius: 22px;
  background:#fff;
  border: 1px solid rgba(122,27,126,.10);
  padding: 20px;
  margin-bottom: 16px;
  box-shadow: 0 14px 36px rgba(0,0,0,.045);
}

.pos-hero__mini strong{
  display:block;
  font-size: 24px;
  font-weight: 900;
  color: var(--bela-purple-dark);
  margin-bottom: 6px;
}

.pos-hero__mini span{
  display:block;
  color: var(--muted);
  line-height: 1.6;
}

.pos-hero__list{
  display:grid;
  gap: 10px;
}

.pos-hero__list span{
  display:flex;
  align-items:center;
  gap: 8px;
  border-radius: 16px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(122,27,126,.10);
  padding: 12px 14px;
  color: #2b2b2b;
  font-weight: 750;
  box-shadow: 0 10px 24px rgba(0,0,0,.035);
}

/* Intro cards */
.pos-intro{
  background:
    linear-gradient(180deg, rgba(122,27,126,.035), #fff);
}

.pos-featureGrid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}

.pos-featureCard{
  position:relative;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 24px;
  background:#fff;
  padding: 22px;
  box-shadow: 0 18px 46px rgba(0,0,0,.055);
  overflow:hidden;
}

.pos-featureCard::before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at 20% 0%, rgba(122,27,126,.09), transparent 52%);
  pointer-events:none;
}

.pos-featureIcon,
.pos-featureCard h3,
.pos-featureCard p{
  position:relative;
}

.pos-featureIcon{
  display:inline-flex;
  width: 48px;
  height: 48px;
  border-radius: 16px;
  align-items:center;
  justify-content:center;
  background: var(--bela-soft);
  font-size: 22px;
  margin-bottom: 14px;
}

.pos-featureCard h3{
  margin: 0 0 8px;
  font-size: 19px;
}

.pos-featureCard p{
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

/* Proceso */
.pos-process{
  background:#fff;
}

.pos-steps{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  margin-top: 20px;
}

.pos-step{
  border: 1px solid rgba(122,27,126,.12);
  border-radius: 22px;
  background:
    radial-gradient(circle at 20% 0%, rgba(122,27,126,.09), transparent 52%),
    #fff;
  padding: 20px;
  box-shadow: 0 16px 42px rgba(0,0,0,.05);
}

.pos-step span{
  display:inline-flex;
  width: 42px;
  height: 42px;
  border-radius: 15px;
  align-items:center;
  justify-content:center;
  background: var(--bela-soft);
  color: var(--bela-purple-dark);
  font-weight: 900;
  margin-bottom: 14px;
}

.pos-step h3{
  margin: 0 0 8px;
  font-size: 18px;
}

.pos-step p{
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

/* Servicios */
.pos-services{
  background:
    radial-gradient(circle at 90% 10%, rgba(122,27,126,.055), transparent 48%),
    rgba(122,27,126,.025);
}

.pos-serviceGrid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.pos-serviceCard{
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 22px;
  background:#fff;
  padding: 22px;
  box-shadow: 0 16px 42px rgba(0,0,0,.055);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.pos-serviceCard:hover{
  transform: translateY(-3px);
  border-color: rgba(122,27,126,.20);
  box-shadow: 0 24px 65px rgba(122,27,126,.10);
}

.pos-serviceCard h3{
  margin: 0 0 8px;
  font-size: 20px;
}

.pos-serviceCard p{
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

/* Internacional */
.pos-international{
  background:#fff;
}

.pos-international__box{
  border: 1px solid rgba(122,27,126,.14);
  border-radius: 28px;
  background:
    radial-gradient(circle at 12% 10%, rgba(122,27,126,.11), transparent 50%),
    #fff;
  padding: 28px;
  box-shadow: 0 22px 70px rgba(0,0,0,.06);
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items:center;
}

.pos-international__cards{
  display:grid;
  gap: 14px;
}

.pos-international__cards article{
  border: 1px solid rgba(122,27,126,.12);
  border-radius: 20px;
  background: rgba(255,255,255,.82);
  padding: 20px;
  box-shadow: 0 14px 34px rgba(0,0,0,.04);
}

.pos-international__cards h3{
  margin: 0 0 8px;
}

.pos-international__cards p{
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

/* Cierre */
.pos-close{
  background: rgba(122,27,126,.035);
}

.pos-close__box{
  border: 1px solid rgba(122,27,126,.14);
  border-radius: 26px;
  background:#fff;
  padding: 28px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap: 20px;
  box-shadow: 0 18px 46px rgba(0,0,0,.045);
}

/* Responsive */
@media (max-width: 1100px){
  .pos-featureGrid{
    grid-template-columns: repeat(2, 1fr);
  }

  .pos-steps{
    grid-template-columns: repeat(2, 1fr);
  }

  .pos-serviceGrid{
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 980px){
  .pos-hero__inner{
    grid-template-columns: 1fr;
  }

  .pos-hero .bela-pageHero__title{
    font-size: clamp(42px, 12vw, 68px);
  }

  .pos-international__box{
    grid-template-columns: 1fr;
  }

  .pos-close__box{
    flex-direction:column;
    align-items:flex-start;
  }
}

@media (max-width: 640px){
  .pos-hero{
    padding-top: 30px !important;
  }

  .pos-featureGrid,
  .pos-steps,
  .pos-serviceGrid{
    grid-template-columns: 1fr;
  }

  .pos-hero__panel,
  .pos-international__box,
  .pos-close__box{
    padding: 18px;
    border-radius: 22px;
  }

  .pos-hero__mini{
    padding: 16px;
  }
}

/* =========================
   POSTOPERATORIO: Hero con imágenes
   ========================= */

.pos-hero__inner{
  display:grid;
  grid-template-columns: 1.02fr .98fr;
  gap: 34px;
  align-items:center;
}

.pos-hero__media{
  display:flex;
  flex-direction:column;
  gap: 14px;
}

.pos-collage{
  position:relative;
  display:grid;
  grid-template-columns: 1.12fr .88fr;
  gap: 12px;
}

.pos-collage img{
  width:100%;
  height: 214px;
  object-fit:cover;
  display:block;
  border-radius: 24px;
  box-shadow: 0 18px 46px rgba(0,0,0,.08);
  border: 1px solid rgba(122,27,126,.10);
}

.pos-collage img.pos-collage__main{
  height: 440px;
  grid-row: span 2;
}

.pos-collage__badge{
  position:absolute;
  left: 18px;
  bottom: 18px;
  max-width: 300px;
  border-radius: 20px;
  padding: 16px 18px;
  background: rgba(255,255,255,.90);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(122,27,126,.14);
  box-shadow: 0 18px 46px rgba(0,0,0,.12);
}

.pos-collage__badge strong{
  display:block;
  color: var(--bela-purple-dark);
  font-weight: 900;
  margin-bottom: 4px;
}

.pos-collage__badge span{
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.pos-hero__list--media{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}

.pos-hero__list--media span{
  border-radius: 999px;
  padding: 10px 12px;
  background: rgba(122,27,126,.06);
  border: 1px solid rgba(122,27,126,.12);
  color: var(--bela-purple-dark);
  font-weight: 800;
  font-size: 13px;
}

/* =========================
   POSTOPERATORIO: Galería Recovery House
   ========================= */

.pos-gallery{
  background:
    radial-gradient(circle at 10% 10%, rgba(122,27,126,.06), transparent 45%),
    #fff;
}

.pos-galleryGrid{
  display:grid;
  grid-template-columns: 1.15fr .85fr .85fr;
  gap: 16px;
}

.pos-galleryCard{
  position:relative;
  min-height: 310px;
  border-radius: 26px;
  overflow:hidden;
  background:#fff;
  box-shadow: 0 20px 55px rgba(0,0,0,.07);
  border: 1px solid rgba(0,0,0,.06);
}

.pos-galleryCard--large{
  grid-row: span 2;
  min-height: 636px;
}

.pos-galleryCard img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  position:absolute;
  inset:0;
}

.pos-galleryCard::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, transparent 38%, rgba(0,0,0,.58));
}

.pos-galleryCard div{
  position:absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  z-index:2;
  color:#fff;
}

.pos-galleryCard span{
  display:block;
  font-weight: 900;
  font-size: 18px;
  margin-bottom: 6px;
}

.pos-galleryCard p{
  margin:0;
  line-height:1.55;
  color: rgba(255,255,255,.88);
}

/* Responsive */
@media (max-width: 980px){
  .pos-hero__inner{
    grid-template-columns: 1fr;
  }

  .pos-collage{
    grid-template-columns: 1fr 1fr;
  }

  .pos-collage img.pos-collage__main{
    grid-column: 1 / -1;
    grid-row:auto;
    height: 360px;
  }

  .pos-hero__list--media{
    grid-template-columns: 1fr;
  }

  .pos-galleryGrid{
    grid-template-columns: 1fr;
  }

  .pos-galleryCard,
  .pos-galleryCard--large{
    min-height: 360px;
    grid-row:auto;
  }
}

@media (max-width: 520px){
  .pos-collage{
    grid-template-columns: 1fr;
  }

  .pos-collage img,
  .pos-collage img.pos-collage__main{
    height: 300px;
  }

  .pos-collage__badge{
    position:relative;
    left:auto;
    bottom:auto;
    max-width: none;
    margin-top: -4px;
  }

  .pos-galleryCard,
  .pos-galleryCard--large{
    min-height: 320px;
  }
}

/* =========================
   Página Procedimientos Premium
   ========================= */

.procx-hero{
  padding: 54px 0 34px;
  background:
    radial-gradient(circle at 20% 10%, rgba(122,27,126,.09), transparent 46%),
    linear-gradient(180deg, #fff, rgba(122,27,126,.025));
}

.procx-hero__inner{
  display:grid;
  grid-template-columns: 1.02fr .98fr;
  gap: 34px;
  align-items:center;
}

.procx-hero__media{
  border-radius: 30px;
  overflow:hidden;
  min-height: 460px;
  box-shadow: 0 24px 70px rgba(0,0,0,.09);
  border: 1px solid rgba(122,27,126,.12);
  background: rgba(122,27,126,.04);
}

.procx-hero__media img{
  width:100%;
  height:100%;
  min-height: 460px;
  object-fit:cover;
  display:block;
}

.procx-subnav{
  position: sticky;
  top: 86px;
  z-index: 20;
  padding: 0 0 12px;
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(0,0,0,.05);
}

.procx-subnav__inner{
  display:flex;
  justify-content:center;
  gap: 10px;
  flex-wrap:wrap;
}

.procx-tab{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 11px 18px;
  border-radius: 999px;
  color: var(--bela-purple-dark);
  background: #fff;
  border: 1px solid rgba(122,27,126,.14);
  font-weight: 900;
  text-decoration:none;
  box-shadow: 0 10px 26px rgba(0,0,0,.035);
}

.procx-tab:hover,
.procx-tab.is-active{
  background: var(--bela-soft);
  border-color: rgba(122,27,126,.24);
}

.procx-highlights{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 22px;
}

.procx-highlights article{
  border-radius: 22px;
  background:#fff;
  border: 1px solid rgba(122,27,126,.12);
  padding: 18px;
  box-shadow: 0 16px 42px rgba(0,0,0,.045);
}

.procx-highlights strong{
  display:block;
  color:#111;
  font-weight:900;
  margin-bottom: 5px;
}

.procx-highlights span{
  color: var(--muted);
}

.procx-section--soft{
  background: rgba(122,27,126,.032);
}

.procx-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.procx-grid--small{
  grid-template-columns: repeat(2, 1fr);
}

.procx-card{
  border-radius: 24px;
  background:#fff;
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 18px 46px rgba(0,0,0,.06);
  overflow:hidden;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.procx-card:hover{
  transform: translateY(-3px);
  border-color: rgba(122,27,126,.20);
  box-shadow: 0 26px 70px rgba(122,27,126,.11);
}

.procx-card__image{
  position:relative;
  height: 210px;
  overflow:hidden;
  background: rgba(122,27,126,.04);
}

.procx-card__image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition: transform .22s ease;
}

.procx-card:hover .procx-card__image img{
  transform: scale(1.035);
}

.procx-card__image span{
  position:absolute;
  left: 14px;
  top: 14px;
  display:inline-flex;
  padding: 7px 11px;
  border-radius: 999px;
  color: var(--bela-purple-dark);
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(122,27,126,.14);
  backdrop-filter: blur(10px);
  font-size: 12px;
  font-weight:900;
}

.procx-card__body{
  padding: 19px;
}

.procx-card__body h3{
  margin: 0 0 8px;
  font-size: 19px;
  line-height:1.2;
}

.procx-card__body p{
  margin: 0 0 16px;
  color: var(--muted);
  line-height:1.6;
  font-size: 15px;
}

.procx-card__link{
  color: var(--bela-purple-dark);
  font-weight: 900;
  text-decoration:none;
}

.procx-guide{
  background:
    radial-gradient(circle at 14% 10%, rgba(122,27,126,.08), transparent 42%),
    rgba(122,27,126,.035);
}

.procx-guide__box{
  border-radius: 28px;
  border: 1px solid rgba(122,27,126,.14);
  background:#fff;
  padding: 28px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap: 20px;
  box-shadow: 0 20px 55px rgba(0,0,0,.055);
}

@media (max-width: 1180px){
  .procx-grid{
    grid-template-columns: repeat(3, 1fr);
  }

  .procx-grid--small{
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 980px){
  .procx-hero__inner{
    grid-template-columns: 1fr;
  }

  .procx-hero__media,
  .procx-hero__media img{
    min-height: 360px;
  }

  .procx-subnav{
    top: 72px;
  }

  .procx-highlights{
    grid-template-columns: 1fr;
  }

  .procx-grid,
  .procx-grid--small{
    grid-template-columns: 1fr 1fr;
  }

  .procx-guide__box{
    flex-direction:column;
    align-items:flex-start;
  }
}

@media (max-width: 620px){
  .procx-hero{
    padding: 34px 0 22px;
  }

  .procx-hero__media,
  .procx-hero__media img{
    min-height: 300px;
  }

  .procx-grid,
  .procx-grid--small{
    grid-template-columns: 1fr;
  }

  .procx-card__image{
    height: 240px;
  }

  .procx-tab{
    width: calc(50% - 6px);
    padding: 10px 12px;
    font-size: 13px;
  }
}

/* =========================
   Página Paquetes Premium
   ========================= */

.pkx-hero{
  padding: 54px 0 36px;
  background:
    radial-gradient(circle at 18% 10%, rgba(122,27,126,.09), transparent 46%),
    linear-gradient(180deg, #fff, rgba(122,27,126,.025));
}

.pkx-hero__inner{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 34px;
  align-items:center;
}

.pkx-hero__panel{
  border-radius: 30px;
  border: 1px solid rgba(122,27,126,.14);
  background:
    radial-gradient(circle at 18% 8%, rgba(122,27,126,.12), transparent 52%),
    #fff;
  padding: 26px;
  box-shadow: 0 24px 70px rgba(0,0,0,.075);
}

.pkx-panel__label{
  display:inline-flex;
  padding: 8px 12px;
  border-radius: 999px;
  background: var(--bela-soft);
  color: var(--bela-purple-dark);
  font-weight: 900;
  margin-bottom: 18px;
}

.pkx-panel__item{
  display:flex;
  gap: 14px;
  padding: 18px 0;
  border-top: 1px solid rgba(0,0,0,.06);
}

.pkx-panel__item:first-of-type{
  border-top: 0;
}

.pkx-panel__item strong{
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 16px;
  background: rgba(122,27,126,.08);
  color: var(--bela-purple-dark);
  font-weight: 900;
}

.pkx-panel__item h3{
  margin: 0 0 5px;
}

.pkx-panel__item p{
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.pkx-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  align-items: stretch;
}

.pkx-card{
  position:relative;
  border-radius: 26px;
  border: 1px solid rgba(0,0,0,.06);
  background:#fff;
  padding: 24px;
  box-shadow: 0 18px 48px rgba(0,0,0,.06);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap: 18px;
  overflow:hidden;
}

.pkx-card::before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at 20% 0%, rgba(122,27,126,.08), transparent 55%);
  pointer-events:none;
}

.pkx-card--featured{
  transform: translateY(-12px);
  border-color: rgba(122,27,126,.24);
  box-shadow: 0 28px 80px rgba(122,27,126,.15);
}

.pkx-card__top,
.pkx-card__list,
.pkx-card .bela-btn{
  position:relative;
}

.pkx-card__tag{
  display:inline-flex;
  padding: 7px 11px;
  border-radius: 999px;
  color: var(--bela-purple-dark);
  background: rgba(122,27,126,.08);
  border: 1px solid rgba(122,27,126,.14);
  font-size: 12px;
  font-weight: 900;
  margin-bottom: 14px;
}

.pkx-card h3{
  margin: 0 0 10px;
  font-size: 24px;
  letter-spacing: -0.02em;
}

.pkx-card p{
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

.pkx-card__list{
  list-style:none;
  padding: 0;
  margin: 0;
  display:grid;
  gap: 10px;
}

.pkx-card__list li{
  color: #222;
  font-weight: 700;
  line-height: 1.45;
}

.pkx-card__list li::before{
  content:"✓";
  color: var(--bela-purple-dark);
  font-weight: 900;
  margin-right: 8px;
}

.pkx-includes{
  background: rgba(122,27,126,.032);
}

.pkx-includeGrid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.pkx-includeGrid article{
  border-radius: 24px;
  background:#fff;
  border: 1px solid rgba(0,0,0,.06);
  padding: 22px;
  box-shadow: 0 18px 46px rgba(0,0,0,.055);
}

.pkx-includeGrid span{
  width: 48px;
  height: 48px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 16px;
  background: var(--bela-soft);
  margin-bottom: 14px;
  font-size: 22px;
}

.pkx-includeGrid h3{
  margin: 0 0 8px;
}

.pkx-includeGrid p{
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

.pkx-international__box{
  border-radius: 30px;
  border: 1px solid rgba(122,27,126,.14);
  background:
    radial-gradient(circle at 16% 10%, rgba(122,27,126,.10), transparent 48%),
    #fff;
  padding: 28px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  box-shadow: 0 22px 65px rgba(0,0,0,.065);
}

.pkx-international__steps{
  display:grid;
  gap: 12px;
}

.pkx-international__steps article{
  border-radius: 20px;
  background: rgba(122,27,126,.045);
  border: 1px solid rgba(122,27,126,.11);
  padding: 16px;
}

.pkx-international__steps strong{
  display:block;
  margin-bottom: 5px;
  color:#111;
}

.pkx-international__steps span{
  color: var(--muted);
  line-height: 1.55;
}

.pkx-close{
  background: rgba(122,27,126,.035);
}

.pkx-close__box{
  border-radius: 26px;
  border: 1px solid rgba(122,27,126,.14);
  background:#fff;
  padding: 28px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap: 20px;
  box-shadow: 0 18px 46px rgba(0,0,0,.045);
}

@media (max-width: 980px){
  .pkx-hero__inner,
  .pkx-international__box{
    grid-template-columns: 1fr;
  }

  .pkx-grid,
  .pkx-includeGrid{
    grid-template-columns: 1fr;
  }

  .pkx-card--featured{
    transform:none;
  }

  .pkx-close__box{
    flex-direction:column;
    align-items:flex-start;
  }
}

@media (max-width: 520px){
  .pkx-hero{
    padding: 34px 0 24px;
  }

  .pkx-hero__panel,
  .pkx-card,
  .pkx-international__box,
  .pkx-close__box{
    padding: 18px;
    border-radius: 22px;
  }
}

/* =========================
   PAQUETES: Hero image panel
   ========================= */

.pkx-hero__imagePanel{
  border-radius: 30px;
  overflow: hidden;
  min-height: 460px;
  border: 1px solid rgba(122,27,126,.14);
  background: rgba(122,27,126,.04);
  box-shadow: 0 24px 70px rgba(0,0,0,.09);
}

.pkx-hero__imagePanel img{
  width: 100%;
  height: 100%;
  min-height: 460px;
  object-fit: cover;
  display: block;
}

@media (max-width: 980px){
  .pkx-hero__imagePanel,
  .pkx-hero__imagePanel img{
    min-height: 380px;
  }
}

@media (max-width: 520px){
  .pkx-hero__imagePanel,
  .pkx-hero__imagePanel img{
    min-height: 300px;
    border-radius: 22px;
  }
}

/* =========================
   RESULTADOS - Redirección Instagram
   ========================= */

.rsx-hero--social{
  padding: 58px 0 44px;
  background:
    radial-gradient(circle at 14% 15%, rgba(122,27,126,.10), transparent 42%),
    linear-gradient(180deg, #fff, rgba(122,27,126,.025));
}

.rsx-socialPanel{
  border-radius: 32px;
  border: 1px solid rgba(122,27,126,.16);
  background:
    radial-gradient(circle at 18% 8%, rgba(122,27,126,.12), transparent 46%),
    #fff;
  padding: 34px;
  box-shadow: 0 26px 74px rgba(0,0,0,.075);
}

.rsx-socialPanel > span{
  display:inline-flex;
  padding: 9px 14px;
  border-radius: 999px;
  background: var(--bela-soft);
  color: var(--bela-purple-dark);
  font-weight: 900;
  margin-bottom: 18px;
}

.rsx-socialPanel h3{
  margin: 0 0 12px;
  font-size: 30px;
  line-height: 1.16;
  letter-spacing: -.02em;
}

.rsx-socialPanel p{
  margin: 0;
  color: var(--muted);
  line-height: 1.75;
}

.rsx-socialPanel__actions{
  margin-top: 24px;
  display:flex;
  gap: 12px;
  flex-wrap:wrap;
}

.rsx-socialPanel__actions a{
  display:inline-flex;
  padding: 12px 16px;
  border-radius: 999px;
  color: var(--bela-purple-dark);
  background: rgba(122,27,126,.07);
  border: 1px solid rgba(122,27,126,.14);
  font-weight: 900;
  text-decoration:none;
}

.rsx-trust{
  background:#fff;
}

.rsx-trustGrid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.rsx-trustGrid article{
  border-radius: 26px;
  background:#fff;
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 18px 48px rgba(0,0,0,.055);
  padding: 24px;
}

.rsx-trustGrid span{
  display:inline-flex;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  align-items:center;
  justify-content:center;
  background: var(--bela-soft);
  color: var(--bela-purple-dark);
  font-weight: 900;
  margin-bottom: 16px;
}

.rsx-trustGrid h3{
  margin: 0 0 10px;
  font-size: 22px;
  letter-spacing: -.02em;
}

.rsx-trustGrid p{
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

.rsx-instagram{
  background: rgba(122,27,126,.035);
}

.rsx-instagramBox{
  border-radius: 30px;
  border: 1px solid rgba(122,27,126,.14);
  background:
    radial-gradient(circle at 12% 20%, rgba(122,27,126,.10), transparent 44%),
    #fff;
  padding: 32px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 26px;
  box-shadow: 0 22px 62px rgba(0,0,0,.06);
}

.rsx-instagramBox__buttons{
  display:flex;
  flex-wrap:wrap;
  gap: 12px;
  justify-content:flex-end;
}

@media (max-width: 980px){
  .rsx-trustGrid{
    grid-template-columns: 1fr;
  }

  .rsx-instagramBox{
    flex-direction:column;
    align-items:flex-start;
  }

  .rsx-instagramBox__buttons{
    justify-content:flex-start;
  }
}

@media (max-width: 560px){
  .rsx-hero--social{
    padding: 34px 0 28px;
  }

  .rsx-socialPanel,
  .rsx-instagramBox,
  .rsx-trustGrid article{
    padding: 20px;
    border-radius: 22px;
  }

  .rsx-socialPanel h3{
    font-size: 24px;
  }

  .rsx-socialPanel__actions,
  .rsx-instagramBox__buttons{
    flex-direction:column;
    width:100%;
  }

  .rsx-socialPanel__actions a,
  .rsx-instagramBox__buttons a{
    width:100%;
    justify-content:center;
  }
}

/* =========================================================
   BLOG BELA - FINAL LIMPIO
   Página principal corta + artículos individuales por URL
   ========================================================= */

html{
  scroll-behavior: smooth;
}

.blogclean-page{
  background:#fff;
}

/* HERO */
.blogclean-hero{
  padding: 72px 0 50px;
  background:
    radial-gradient(circle at 16% 8%, rgba(122,27,126,.10), transparent 45%),
    linear-gradient(180deg, #fff, rgba(122,27,126,.025));
}

.blogclean-hero__inner{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 36px;
  align-items:center;
}

.blogclean-hero__panel{
  border-radius: 32px;
  border: 1px solid rgba(122,27,126,.15);
  background:
    radial-gradient(circle at 16% 8%, rgba(122,27,126,.12), transparent 48%),
    #fff;
  padding: 34px;
  box-shadow: 0 24px 70px rgba(0,0,0,.07);
}

.blogclean-hero__panel span{
  display:inline-flex;
  padding: 8px 13px;
  border-radius: 999px;
  background: var(--bela-soft, rgba(122,27,126,.10));
  color: var(--bela-purple-dark, #6b0f72);
  font-weight: 900;
  margin-bottom: 16px;
}

.blogclean-hero__panel h3{
  margin: 0 0 12px;
  color:#080808;
  font-size: 30px;
  line-height: 1.08;
  letter-spacing: -.03em;
  font-weight: 950;
}

.blogclean-hero__panel p{
  margin:0;
  color: var(--muted);
  line-height:1.72;
}

/* INDEX */
.blogclean-index{
  background:
    radial-gradient(circle at 10% 0%, rgba(122,27,126,.055), transparent 38%),
    #fff;
}

.blogclean-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:22px;
}

.blogclean-card{
  border-radius: 30px;
  border:1px solid rgba(122,27,126,.14);
  background:
    radial-gradient(circle at 12% 0%, rgba(122,27,126,.10), transparent 45%),
    linear-gradient(135deg, #fff, #fff8ff);
  box-shadow: 0 22px 60px rgba(0,0,0,.06);
  padding:26px;
  min-height: 310px;
  display:grid;
  grid-template-columns:auto 1fr;
  gap:18px;
  align-items:start;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.blogclean-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 30px 78px rgba(0,0,0,.085);
  border-color: rgba(122,27,126,.24);
}

.blogclean-card__number{
  width:54px;
  height:54px;
  border-radius:999px;
  background: var(--bela-soft, rgba(122,27,126,.10));
  color: var(--bela-purple-dark, #6b0f72);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:950;
  box-shadow: inset 0 0 0 1px rgba(122,27,126,.12);
}

.blogclean-eyebrow{
  display:inline-flex;
  width:fit-content;
  padding:7px 11px;
  border-radius:999px;
  background: rgba(122,27,126,.07);
  color: var(--bela-purple-dark, #6b0f72);
  font-size:12px;
  font-weight:900;
  margin-bottom:14px;
}

.blogclean-card h3{
  margin:0 0 12px;
  color:#080808;
  font-size:24px;
  line-height:1.08;
  letter-spacing:-.035em;
  font-weight:950;
}

.blogclean-card p{
  margin:0 0 18px;
  color:var(--muted);
  font-size:15.5px;
  line-height:1.62;
}

.blogclean-card__link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:fit-content;
  padding:12px 16px;
  border-radius:999px;
  background: var(--bela-purple, #8c1c91);
  color:#fff !important;
  font-weight:900;
  font-size:14px;
  text-decoration:none;
  box-shadow: 0 14px 34px rgba(122,27,126,.20);
}

/* REELS */
.blogclean-reels{
  background: rgba(122,27,126,.035);
}

.blogclean-reelGrid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:18px;
}

.blogclean-reel{
  border-radius:26px;
  border:1px solid rgba(122,27,126,.11);
  background:#fff;
  box-shadow:0 18px 48px rgba(0,0,0,.055);
  padding:24px;
  min-height:235px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

.blogclean-reel span{
  display:inline-flex;
  width:fit-content;
  padding:7px 11px;
  border-radius:999px;
  background: var(--bela-soft, rgba(122,27,126,.10));
  color:var(--bela-purple-dark, #6b0f72);
  font-size:12px;
  font-weight:900;
  margin-bottom:14px;
}

.blogclean-reel h3{
  margin:0 0 10px;
  color:#080808;
  font-size:21px;
  line-height:1.16;
  letter-spacing:-.02em;
  font-weight:900;
}

.blogclean-reel p{
  margin:0 0 18px;
  color:var(--muted);
  line-height:1.6;
}

.blogclean-reel a{
  color:var(--bela-purple-dark, #6b0f72);
  font-weight:900;
  text-decoration:none;
}

/* CTA */
.blogclean-close{
  background:#fff;
}

.blogclean-close__box{
  border-radius:28px;
  border:1px solid rgba(122,27,126,.14);
  background:
    radial-gradient(circle at 12% 0%, rgba(122,27,126,.08), transparent 45%),
    #fff;
  box-shadow:0 20px 56px rgba(0,0,0,.055);
  padding:30px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}

/* SINGLE ARTICLE */
.blogclean-single{
  padding: 70px 0;
  background:
    radial-gradient(circle at 12% 4%, rgba(122,27,126,.09), transparent 42%),
    #fff;
}

.blogclean-single__wrap{
  max-width: 980px;
}

.blogclean-back{
  display:inline-flex;
  margin-bottom:22px;
  color:var(--bela-purple-dark, #6b0f72);
  font-weight:900;
  text-decoration:none;
}

.blogclean-single__article{
  border-radius:34px;
  border:1px solid rgba(122,27,126,.14);
  background:#fff;
  box-shadow:0 28px 80px rgba(0,0,0,.07);
  overflow:hidden;
}

.blogclean-single__hero{
  padding:42px 46px 34px;
  background:
    radial-gradient(circle at 12% 0%, rgba(122,27,126,.13), transparent 45%),
    linear-gradient(135deg, #fff, #fff7ff);
  border-bottom:1px solid rgba(122,27,126,.11);
}

.blogclean-single__hero span{
  display:inline-flex;
  padding:8px 13px;
  border-radius:999px;
  background:var(--bela-soft, rgba(122,27,126,.10));
  color:var(--bela-purple-dark, #6b0f72);
  font-weight:900;
  margin-bottom:18px;
}

.blogclean-single__hero h1{
  margin:0;
  color:#080808;
  font-size:clamp(34px, 5vw, 58px);
  line-height:.98;
  letter-spacing:-.055em;
  font-weight:950;
}

.blogclean-single__hero p{
  max-width:720px;
  margin:18px 0 0;
  color:var(--muted);
  line-height:1.65;
}

.blogclean-single__content{
  padding:42px 48px;
  color:#263244;
  font-size:18px;
  line-height:1.85;
}

.blogclean-single__content br{
  display:block;
  margin-bottom:8px;
  content:"";
}

.blogclean-single__cta{
  margin:0 48px 48px;
  padding:28px;
  border-radius:26px;
  background:rgba(122,27,126,.045);
  border:1px solid rgba(122,27,126,.12);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:22px;
}

.blogclean-single__nav{
  margin-top:24px;
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:16px;
}

.blogclean-single__nav a{
  border-radius:22px;
  border:1px solid rgba(122,27,126,.12);
  background:#fff;
  padding:18px;
  text-decoration:none;
  box-shadow:0 14px 38px rgba(0,0,0,.045);
}

.blogclean-single__nav small{
  display:block;
  color:var(--bela-purple-dark, #6b0f72);
  font-weight:900;
  margin-bottom:8px;
}

.blogclean-single__nav strong{
  display:block;
  color:#080808;
  line-height:1.25;
}

/* RESPONSIVE */
@media (max-width:1180px){
  .blogclean-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .blogclean-reelGrid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width:900px){
  .blogclean-hero__inner{
    grid-template-columns:1fr;
  }

  .blogclean-close__box,
  .blogclean-single__cta{
    flex-direction:column;
    align-items:flex-start;
  }
}

@media (max-width:620px){
  .blogclean-hero{
    padding:42px 0 30px;
  }

  .blogclean-hero__panel,
  .blogclean-card,
  .blogclean-reel,
  .blogclean-close__box,
  .blogclean-single__article{
    border-radius:24px;
  }

  .blogclean-hero__panel,
  .blogclean-card,
  .blogclean-reel,
  .blogclean-close__box{
    padding:20px;
  }

  .blogclean-grid,
  .blogclean-reelGrid,
  .blogclean-single__nav{
    grid-template-columns:1fr;
  }

  .blogclean-card{
    min-height:auto;
    grid-template-columns:1fr;
  }

  .blogclean-card__number{
    width:48px;
    height:48px;
  }

  .blogclean-card h3{
    font-size:22px;
  }

  .blogclean-card__link{
    width:100%;
  }

  .blogclean-single{
    padding:42px 0;
  }

  .blogclean-single__hero{
    padding:30px 22px 24px;
  }

  .blogclean-single__content{
    padding:28px 22px;
    font-size:15.8px;
    line-height:1.75;
  }

  .blogclean-single__cta{
    margin:0 18px 24px;
    padding:22px;
  }

  .blogclean-single__cta .bela-btn,
  .blogclean-close__box .bela-btn{
    width:100%;
    justify-content:center;
  }
}


/* =========================
   RESULTADOS: showcase visual
   ========================= */

.rsx-showcase{
  border-radius: 30px;
  border: 1px solid rgba(122,27,126,.14);
  background:#fff;
  padding: 18px;
  box-shadow: 0 24px 70px rgba(0,0,0,.075);
}

.rsx-showcase__image{
  border-radius: 24px;
  overflow:hidden;
  background: rgba(122,27,126,.04);
}

.rsx-showcase__image img{
  width:100%;
  display:block;
  height:auto;
}

.rsx-showcase__note{
  margin-top: 18px;
  padding: 20px;
  border-radius: 22px;
  background:
    radial-gradient(circle at 14% 10%, rgba(122,27,126,.08), transparent 44%),
    rgba(122,27,126,.035);
  border: 1px solid rgba(122,27,126,.12);
}

.rsx-showcase__note span{
  display:inline-flex;
  padding: 7px 11px;
  border-radius: 999px;
  background: var(--bela-soft);
  color: var(--bela-purple-dark);
  font-weight: 900;
  font-size: 12px;
  margin-bottom: 10px;
}

.rsx-showcase__note h3{
  margin: 0 0 8px;
  font-size: 24px;
  letter-spacing: -.02em;
}

.rsx-showcase__note p{
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
}

@media (max-width: 620px){
  .rsx-showcase{
    padding: 12px;
    border-radius: 22px;
  }

  .rsx-showcase__image{
    border-radius: 18px;
  }

  .rsx-showcase__note{
    padding: 16px;
    border-radius: 18px;
  }
}

/* =========================
   PAGE NOSOTROS - BELA PREMIUM
   ========================= */

.aboutx-page{
  background:#fff;
}

.aboutx-page .bela-section{
  padding-top: 62px;
  padding-bottom: 62px;
}

/* HERO */
.aboutx-hero{
  padding: 50px 0 42px;
  background:
    radial-gradient(circle at 14% 12%, rgba(122,27,126,.09), transparent 42%),
    linear-gradient(180deg, #fff, rgba(122,27,126,.025));
}

.aboutx-hero__inner{
  display:grid;
  grid-template-columns: 1fr .92fr;
  gap: 38px;
  align-items:center;
}

.aboutx-hero__content{
  max-width: 650px;
}

.aboutx-heroVisual{
  max-width: 520px;
  margin-left:auto;
}

.aboutx-heroPhoto{
  position:relative;
  border-radius: 30px;
  overflow:hidden;
  background:#fff;
  border: 1px solid rgba(122,27,126,.14);
  box-shadow: 0 24px 70px rgba(0,0,0,.08);
}

.aboutx-heroPhoto img{
  width:100%;
  height: 430px;
  object-fit:cover;
  object-position:center top;
  display:block;
}

.aboutx-heroCaption{
  position:absolute;
  left: 16px;
  right: 16px;
  bottom: 16px;
  padding: 16px;
  border-radius: 20px;
  background: rgba(122,27,126,.92);
  color:#fff;
  backdrop-filter: blur(8px);
}

.aboutx-heroCaption strong,
.aboutx-heroCaption span{
  display:block;
}

.aboutx-heroCaption strong{
  font-size: 22px;
  font-weight: 900;
}

.aboutx-heroCaption span{
  opacity:.92;
}

.aboutx-heroMini{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 14px;
}

.aboutx-heroMini article{
  padding: 16px;
  border-radius: 20px;
  background:#fff;
  border: 1px solid rgba(122,27,126,.14);
  box-shadow: 0 14px 34px rgba(0,0,0,.045);
}

.aboutx-heroMini span{
  display:block;
  color: var(--bela-purple-dark);
  font-weight:900;
  font-size: 13px;
  margin-bottom: 5px;
}

.aboutx-heroMini strong{
  font-size: 17px;
  line-height:1.25;
}

/* MISIÓN / VISIÓN */
.aboutx-twoGrid{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
}

.aboutx-infoCard{
  padding: 28px;
  border-radius: 28px;
  background:#fff;
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 18px 46px rgba(0,0,0,.055);
}

.aboutx-infoCard--soft{
  background:
    radial-gradient(circle at 16% 10%, rgba(122,27,126,.08), transparent 48%),
    #fff;
}

.aboutx-infoCard p{
  margin-bottom: 0;
  color: var(--muted);
  line-height: 1.75;
}

/* MOSAICO */
.aboutx-gallerySection{
  background:
    radial-gradient(circle at 90% 8%, rgba(122,27,126,.055), transparent 36%),
    #fff;
}

.aboutx-mosaic{
  display:grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 16px;
}

.aboutx-mosaicCard{
  position:relative;
  min-height: 300px;
  border-radius: 28px;
  overflow:hidden;
  background:#fff;
  box-shadow: 0 22px 60px rgba(0,0,0,.075);
}

.aboutx-mosaicCard--large{
  grid-row: span 2;
  min-height: 616px;
}

.aboutx-mosaicCard img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.aboutx-mosaicCard::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, transparent 44%, rgba(0,0,0,.62));
  z-index:1;
}

.aboutx-mosaicText{
  position:absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  z-index:2;
  color:#fff;
}

.aboutx-mosaicText span{
  display:inline-flex;
  padding: 7px 11px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  color: var(--bela-purple-dark);
  font-weight:900;
  font-size:12px;
  margin-bottom:8px;
}

.aboutx-mosaicText strong{
  display:block;
  font-size: 22px;
  line-height:1.15;
}

/* QUALITY */
.aboutx-quality{
  background: rgba(122,27,126,.032);
}

.aboutx-qualityBox{
  display:grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 26px;
  align-items:center;
  padding: 30px;
  border-radius: 30px;
  background:#fff;
  border: 1px solid rgba(122,27,126,.14);
  box-shadow: 0 22px 65px rgba(0,0,0,.06);
}

.aboutx-qualityList{
  display:grid;
  gap: 12px;
}

.aboutx-qualityList article{
  padding: 16px;
  border-radius: 20px;
  background: rgba(122,27,126,.045);
  border: 1px solid rgba(122,27,126,.11);
}

.aboutx-qualityList strong{
  display:block;
  margin-bottom: 5px;
}

.aboutx-qualityList span{
  color: var(--muted);
  line-height:1.6;
}

/* VALORES */
.aboutx-valuesGrid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.aboutx-valueCard{
  padding: 22px;
  border-radius: 24px;
  background:#fff;
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 18px 46px rgba(0,0,0,.055);
}

.aboutx-valueCard span{
  width: 48px;
  height: 48px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 16px;
  background: var(--bela-soft);
  color: var(--bela-purple-dark);
  font-weight:900;
  margin-bottom: 14px;
}

.aboutx-valueCard h3{
  margin: 0 0 8px;
}

.aboutx-valueCard p{
  margin:0;
  color: var(--muted);
  line-height:1.65;
}

/* EQUIPO */
.aboutx-team{
  background: rgba(122,27,126,.032);
}

.aboutx-teamGrid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.aboutx-teamCard{
  border-radius: 28px;
  overflow:hidden;
  background:#fff;
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 18px 46px rgba(0,0,0,.06);
}

.aboutx-teamCard--featured{
  grid-column: span 2;
}

.aboutx-teamCard__image{
  height: 320px;
  background: rgba(122,27,126,.04);
}

.aboutx-teamCard--featured .aboutx-teamCard__image{
  height: 430px;
}

.aboutx-teamCard__image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
  display:block;
}

.aboutx-teamCard__body{
  padding: 18px;
}

.aboutx-teamCard__body span{
  display:inline-flex;
  padding: 7px 11px;
  border-radius: 999px;
  background: var(--bela-soft);
  color: var(--bela-purple-dark);
  font-weight:900;
  font-size:12px;
  margin-bottom:10px;
}

.aboutx-teamCard__body h3{
  margin:0;
  font-size: 21px;
  line-height:1.2;
}

/* QUÉ ENCONTRARÁS */
.aboutx-experience{
  background:#fff;
}

.aboutx-expGrid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.aboutx-expGrid article{
  padding: 22px;
  border-radius: 24px;
  background:#fff;
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 18px 46px rgba(0,0,0,.055);
}

.aboutx-expGrid span{
  width: 54px;
  height: 54px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 18px;
  background: var(--bela-soft);
  color: var(--bela-purple-dark);
  font-weight:900;
  font-size: 20px;
  margin-bottom: 14px;
}

.aboutx-expGrid h3{
  margin: 0 0 8px;
}

.aboutx-expGrid p{
  margin:0;
  color: var(--muted);
  line-height:1.65;
}

/* FOOD */
.aboutx-food{
  background:
    radial-gradient(circle at 14% 10%, rgba(122,27,126,.055), transparent 42%),
    #fff;
}

.aboutx-foodBox{
  display:grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 24px;
  align-items:center;
  padding: 28px;
  border-radius: 30px;
  background:#fff;
  border: 1px solid rgba(122,27,126,.14);
  box-shadow: 0 22px 60px rgba(0,0,0,.06);
}

.aboutx-foodText{
  max-width: 520px;
}

.aboutx-foodGallery{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.aboutx-foodGallery > div{
  height: 300px;
  border-radius: 24px;
  overflow:hidden;
  background: rgba(122,27,126,.04);
}

.aboutx-foodGallery img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* CTA */
.aboutx-close{
  background: rgba(122,27,126,.035);
}

.aboutx-closeBox{
  border-radius: 26px;
  border: 1px solid rgba(122,27,126,.14);
  background:#fff;
  padding: 28px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap: 20px;
  box-shadow: 0 18px 46px rgba(0,0,0,.045);
}

/* PLACEHOLDER */
.aboutx-imgPlaceholder{
  width:100%;
  height:100%;
  min-height: 260px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:
    radial-gradient(circle at 20% 10%, rgba(122,27,126,.12), transparent 46%),
    rgba(122,27,126,.04);
  color: var(--bela-purple-dark);
  font-weight:900;
}

.aboutx-imgPlaceholder span{
  display:inline-flex;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(122,27,126,.12);
}

/* RESPONSIVE */
@media (max-width: 1100px){
  .aboutx-valuesGrid,
  .aboutx-expGrid,
  .aboutx-teamGrid{
    grid-template-columns: repeat(2, 1fr);
  }

  .aboutx-teamCard--featured{
    grid-column: span 2;
  }

  .aboutx-mosaic{
    grid-template-columns: 1fr 1fr;
  }

  .aboutx-mosaicCard--large{
    grid-column: span 2;
    grid-row:auto;
    min-height: 430px;
  }
}

@media (max-width: 900px){
  .aboutx-hero__inner,
  .aboutx-twoGrid,
  .aboutx-qualityBox,
  .aboutx-foodBox{
    grid-template-columns: 1fr;
  }

  .aboutx-heroVisual{
    max-width: 100%;
    margin-left:0;
  }

  .aboutx-closeBox{
    flex-direction:column;
    align-items:flex-start;
  }
}

@media (max-width: 620px){
  .aboutx-page .bela-section{
    padding-top: 42px;
    padding-bottom: 42px;
  }

  .aboutx-hero{
    padding: 34px 0 28px;
  }

  .aboutx-heroPhoto img{
    height: 360px;
  }

  .aboutx-heroMini,
  .aboutx-valuesGrid,
  .aboutx-expGrid,
  .aboutx-teamGrid,
  .aboutx-mosaic,
  .aboutx-foodGallery{
    grid-template-columns: 1fr;
  }

  .aboutx-teamCard--featured{
    grid-column:auto;
  }

  .aboutx-teamCard__image,
  .aboutx-teamCard--featured .aboutx-teamCard__image{
    height: 340px;
  }

  .aboutx-mosaicCard,
  .aboutx-mosaicCard--large{
    grid-column:auto;
    min-height: 300px;
  }

  .aboutx-infoCard,
  .aboutx-qualityBox,
  .aboutx-foodBox,
  .aboutx-closeBox{
    padding: 18px;
    border-radius: 22px;
  }

  .aboutx-foodGallery > div{
    height: 260px;
  }
}

.aboutx-heroPhoto{
  position: relative;
  border-radius: 30px;
  overflow: hidden;
  background: linear-gradient(180deg, #faf6fb, #ffffff);
  border: 1px solid rgba(122,27,126,.14);
  box-shadow: 0 24px 70px rgba(0,0,0,.08);

  /* mejor organización interna */
  padding: 14px 14px 18px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.aboutx-heroPhoto img{
  width: 100%;
  height: 620px;
  object-fit: contain;
  object-position: center bottom;
  display: block;
  border-radius: 24px;
  background: #f8f4f9;
}

.aboutx-heroCaption{
  position: static;
  margin: 0;
  padding: 18px 18px 16px;
  border-radius: 22px;
  background: rgba(122,27,126,.96);
  color: #fff;
  box-shadow: 0 12px 28px rgba(122,27,126,.20);
}

.aboutx-heroCaption strong,
.aboutx-heroCaption span{
  display: block;
}

.aboutx-heroCaption strong{
  font-size: 20px;
  line-height: 1.15;
  font-weight: 900;
  margin-bottom: 6px;
}

.aboutx-heroCaption span{
  font-size: 14px;
  line-height: 1.35;
  opacity: .96;
}

@media (max-width: 768px){
  .aboutx-heroPhoto{
    padding: 12px 12px 16px;
    gap: 14px;
    border-radius: 24px;
  }

  .aboutx-heroPhoto img{
    height: 500px;
    border-radius: 20px;
  }

  .aboutx-heroCaption{
    padding: 16px 16px 14px;
    border-radius: 18px;
  }

  .aboutx-heroCaption strong{
    font-size: 18px;
  }

  .aboutx-heroCaption span{
    font-size: 13px;
  }
}

@media (max-width: 520px){
  .aboutx-heroPhoto img{
    height: 440px;
  }
}

/* =========================
   HOME HERO - Misma card de Nosotros
   ========================= */

.bela-hero .bela-homeFounder{
  width: 100%;
  max-width: 520px;
  margin-left: auto;
}

.bela-hero .bela-homeFounder .aboutx-heroPhoto{
  padding: 14px 14px 18px;
  border-radius: 30px;
  background: linear-gradient(180deg, #faf6fb, #ffffff);
  border: 1px solid rgba(122,27,126,.14);
  box-shadow: 0 24px 70px rgba(0,0,0,.08);
  display: flex;
  flex-direction: column;
  gap: 16px;
  overflow: hidden;
}

.bela-hero .bela-homeFounder .aboutx-heroPhoto img{
  width: 100%;
  height: 620px;
  object-fit: contain;
  object-position: center bottom;
  display: block;
  border-radius: 24px;
  background: #f8f4f9;
}

.bela-hero .bela-homeFounder .aboutx-heroCaption{
  position: static;
  margin: 0;
  padding: 18px;
  border-radius: 22px;
  background: rgba(122,27,126,.96);
  color: #fff;
  box-shadow: 0 12px 28px rgba(122,27,126,.20);
}

.bela-hero .bela-homeFounder .aboutx-heroCaption strong,
.bela-hero .bela-homeFounder .aboutx-heroCaption span{
  display: block;
}

.bela-hero .bela-homeFounder .aboutx-heroCaption strong{
  font-size: 22px;
  line-height: 1.15;
  font-weight: 900;
  margin-bottom: 6px;
}

.bela-hero .bela-homeFounder .aboutx-heroCaption span{
  font-size: 15px;
  line-height: 1.35;
  opacity: .96;
}

/* Tablet */
@media (max-width: 980px){
  .bela-hero .bela-homeFounder{
    max-width: 520px;
    margin: 0 auto;
  }

  .bela-hero .bela-homeFounder .aboutx-heroPhoto img{
    height: 560px;
  }
}

/* Mobile */
@media (max-width: 560px){
  .bela-hero .bela-homeFounder .aboutx-heroPhoto{
    padding: 10px 10px 14px;
    border-radius: 24px;
    gap: 12px;
  }

  .bela-hero .bela-homeFounder .aboutx-heroPhoto img{
    height: 430px;
    border-radius: 20px;
  }

  .bela-hero .bela-homeFounder .aboutx-heroCaption{
    padding: 16px;
    border-radius: 18px;
  }

  .bela-hero .bela-homeFounder .aboutx-heroCaption strong{
    font-size: 19px;
  }

  .bela-hero .bela-homeFounder .aboutx-heroCaption span{
    font-size: 13px;
  }
}

/* =========================
   HOME - Aliados estratégicos 6 logos
   ========================= */

.bela-partners{
  padding: 26px 0 28px !important;
}

.bela-partners__head{
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 24px;
  align-items: end;
  margin-bottom: 16px;
}

.bela-partners__text{
  max-width: 560px;
  margin: 0;
  color: var(--muted);
  font-weight: 700;
  line-height: 1.45;
}

.bela-partners__grid{
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
  align-items: center;
}

.bela-partnerLogo{
  height: 88px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid rgba(122,27,126,.13);
  box-shadow: 0 14px 32px rgba(0,0,0,.045);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px;
}

.bela-partnerLogo img{
  width: 100%;
  max-width: 150px;
  max-height: 54px;
  object-fit: contain;
  filter: grayscale(1);
  opacity: .68;
  transition: transform .18s ease, filter .18s ease, opacity .18s ease;
}

.bela-partnerLogo:hover img{
  filter: grayscale(0);
  opacity: 1;
  transform: translateY(-2px);
}

/* Tablet */
@media (max-width: 980px){
  .bela-partners__head{
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .bela-partners__grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Mobile */
@media (max-width: 560px){
  .bela-partners{
    padding: 22px 0 24px !important;
  }

  .bela-partners__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .bela-partnerLogo{
    height: 78px;
    border-radius: 16px;
    padding: 12px;
  }

  .bela-partnerLogo img{
    max-width: 128px;
    max-height: 46px;
  }
}