/* ============================================================
   MEDICAL RECOVERY — hoja principal
   El azul de marca es el color dominante, no el acento. Papel
   azulado, navy en superficies oscuras, cyan del logo para
   remates. Tipografía grande: quien compra aquí muchas veces
   tiene 70 años o está cansado de cuidar a alguien.

   Los colores y tamaños viven en theme.json; aquí sólo se
   consumen como variables --wp--preset--*.
   ============================================================ */

:root{
  --mr-papel:var(--wp--preset--color--papel, #EFF6FB);
  --mr-blanco:var(--wp--preset--color--blanco, #FFFFFF);
  --mr-panel:var(--wp--preset--color--panel, #DDEBF6);
  --mr-navy:var(--wp--preset--color--navy, #0B2A44);
  --mr-navy-profundo:var(--wp--preset--color--navy-profundo, #071E33);
  --mr-marca:var(--wp--preset--color--marca, #0078B5);
  --mr-marca-profundo:var(--wp--preset--color--marca-profundo, #02598A);
  --mr-cyan:var(--wp--preset--color--cyan, #00B4D9);
  --mr-cyan-lavado:var(--wp--preset--color--cyan-lavado, #DBF1F9);
  --mr-tinta-suave:var(--wp--preset--color--tinta-suave, #4A6C86);
  --mr-linea:rgba(11,42,68,.14);
  --mr-linea-fuerte:rgba(11,42,68,.28);
  --mr-sombra-sm:0 1px 2px rgba(11,42,68,.06), 0 4px 14px -6px rgba(11,42,68,.16);
  --mr-sombra-md:0 2px 6px rgba(11,42,68,.07), 0 18px 40px -22px rgba(2,89,138,.45);
  --mr-sombra-lg:0 30px 70px -40px rgba(2,89,138,.65);
  --mr-r-sm:10px; --mr-r-md:18px; --mr-r-lg:28px; --mr-r-xl:44px;
  --mr-ease:cubic-bezier(.22,.61,.36,1);
}

/* ---------- Base ---------- */
/* WordPress no normaliza esto y los campos con width:100% se desbordan. */
input, select, textarea, button{ box-sizing:border-box; }
/* El cajón del mini carrito vive fuera de la pantalla: sin esto, en móvil
   se puede arrastrar la página de lado. */
html{ overflow-x:clip; }
body{ -webkit-font-smoothing:antialiased; overflow-x:clip; }
img{ max-width:100%; height:auto; }
:where(a):focus-visible,
:where(button):focus-visible,
:where(input, select, textarea):focus-visible,
:where(summary):focus-visible{
  outline:3px solid var(--mr-cyan);
  outline-offset:3px;
  border-radius:4px;
}
/* Grano muy sutil: da atmósfera sin pesar. */
body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0; opacity:.22;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.055'/%3E%3C/svg%3E");
}
.wp-site-blocks{ position:relative; z-index:1; }

/* ---------- Antetítulo (estilo de bloque) ---------- */
.is-style-antetitulo{
  font-family:var(--wp--preset--font-family--texto);
  font-size:.78rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--mr-marca); display:flex; align-items:center; gap:.6rem; line-height:1.2;
}
.is-style-antetitulo::before{
  content:""; width:26px; height:2px; background:var(--mr-cyan); border-radius:2px; flex:none;
}
.has-navy-background-color .is-style-antetitulo,
.has-marca-background-color .is-style-antetitulo,
.has-navy-gradient-background .is-style-antetitulo,
.has-marca-gradient-background .is-style-antetitulo{ color:#BEEBF7; }

/* ---------- Botones ---------- */
.mr-btn,
.wp-block-button__link{
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  min-height:54px; border-radius:999px;
  font-weight:600; text-decoration:none; white-space:nowrap; cursor:pointer;
  transition:transform .25s var(--mr-ease), box-shadow .25s var(--mr-ease),
             background-color .25s var(--mr-ease), color .25s var(--mr-ease), border-color .25s var(--mr-ease);
}
.wp-block-button__link{ box-shadow:0 12px 26px -14px rgba(2,89,138,.9); }
.wp-block-button__link:hover{ transform:translateY(-2px); box-shadow:0 18px 34px -14px rgba(2,89,138,.95); }
.wp-block-button.is-style-outline .wp-block-button__link{
  box-shadow:none; border:1.5px solid var(--mr-linea-fuerte); color:var(--mr-navy);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover{
  border-color:var(--mr-navy); background:rgba(11,42,68,.04); color:var(--mr-navy);
}
.wp-block-button.is-style-whatsapp .wp-block-button__link,
.mr-btn--wa{
  background:var(--mr-navy); color:#fff; padding:.95rem 1.6rem;
}
.wp-block-button.is-style-whatsapp .wp-block-button__link:hover,
.mr-btn--wa:hover{ background:var(--mr-navy-profundo); color:#fff; }
.mr-btn--primario{ background:var(--mr-marca); color:#fff; padding:.95rem 1.6rem; }
.mr-btn--primario:hover{ background:var(--mr-marca-profundo); color:#fff; }

/* ---------- Barra superior ---------- */
.mr-topbar{
  background:var(--mr-navy-profundo); color:rgba(255,255,255,.82);
  font-size:.86rem; position:relative; z-index:3;
}
.mr-topbar a{ color:inherit; text-decoration:none; }
.mr-topbar a:hover{ color:#fff; text-decoration:underline; }
.mr-topbar strong{ color:#fff; font-weight:600; }

/* ---------- Encabezado ---------- */
.mr-header{
  position:sticky; top:0; z-index:50;
  background:rgba(239,246,251,.86);
  backdrop-filter:blur(14px) saturate(1.35);
  -webkit-backdrop-filter:blur(14px) saturate(1.35);
  border-bottom:1px solid var(--mr-linea);
}
.admin-bar .mr-header{ top:32px; }
@media (max-width:782px){ .admin-bar .mr-header{ top:46px; } }
/* Dentro del flex el <figure> colapsaba a 0 y el logo desaparecía. */
.mr-header .wp-block-site-logo{ flex:0 0 auto; width:52px; }
.mr-header .wp-block-site-logo a,
.mr-header .wp-block-site-logo img{ width:100%; height:auto; object-fit:contain; }
.mr-marca-lema{ font-size:.72rem; color:var(--mr-tinta-suave); line-height:1.3; }

/* Navegación */
.mr-header .wp-block-navigation{ font-size:.98rem; font-weight:500; }
.mr-header .wp-block-navigation-item__content{
  position:relative; padding:.55rem .2rem; text-decoration:none;
}
.mr-header .wp-block-navigation-item__content::after{
  content:""; position:absolute; left:0; right:0; bottom:.25rem; height:2px;
  background:var(--mr-cyan); border-radius:2px;
  transform:scaleX(0); transform-origin:left; transition:transform .32s var(--mr-ease);
}
.mr-header .wp-block-navigation-item__content:hover::after,
.mr-header .current-menu-item .wp-block-navigation-item__content::after{ transform:scaleX(1); }
.mr-header .wp-block-navigation__responsive-container.is-menu-open{
  background:var(--mr-navy-profundo); color:#fff; padding-top:4rem;
}
.mr-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content::after{ display:none; }

/* Iconos del encabezado */
.mr-icono{
  width:46px; height:46px; display:grid; place-items:center; border-radius:50%;
  border:1px solid var(--mr-linea); background:var(--mr-blanco); color:var(--mr-navy);
  position:relative; text-decoration:none;
  transition:border-color .2s var(--mr-ease), transform .2s var(--mr-ease);
}
.mr-icono:hover{ border-color:var(--mr-navy); transform:translateY(-1px); }
.mr-tel-header{ font-weight:700; font-size:1rem; white-space:nowrap; }
.mr-tel-header a{ color:var(--mr-navy); text-decoration:none; }
.mr-tel-header a:hover{ color:var(--mr-marca); }
@media (max-width:900px){ .mr-tel-header{ display:none; } }

/* ---------- Hero ---------- */
.mr-hero{ position:relative; overflow:hidden; }
.mr-hero::after{
  content:""; position:absolute; top:-32%; right:-16%;
  width:70vw; height:70vw; max-width:900px; max-height:900px; z-index:0; pointer-events:none;
  background:radial-gradient(circle at 50% 50%, rgba(0,180,217,.34), rgba(0,120,181,.10) 45%, rgba(0,180,217,0) 66%);
}
.mr-hero > *{ position:relative; z-index:1; }
.mr-hero h1 em{
  font-style:italic; font-weight:400; color:var(--mr-marca-profundo);
  position:relative; white-space:nowrap;
}
.mr-hero h1 em::after{
  content:""; position:absolute; left:0; right:0; bottom:.06em; height:.14em; border-radius:.1em;
  background:var(--mr-cyan); opacity:.5; transform:scaleX(0); transform-origin:left;
  animation:mr-draw 1.1s .55s var(--mr-ease) forwards;
}
@keyframes mr-draw{ to{ transform:scaleX(1); } }
.mr-hero-lead{ font-size:1.16rem; color:var(--mr-tinta-suave); max-width:36ch; }

.mr-hero-marco{
  position:relative; overflow:hidden;
  border-radius:var(--mr-r-xl) var(--mr-r-xl) var(--mr-r-lg) var(--mr-r-lg);
  background:linear-gradient(168deg, #B8E6F5, #DDF1F9 46%, #F4FBFD);
  box-shadow:var(--mr-sombra-lg);
}
.mr-hero-marco img{ margin-inline:auto; mix-blend-mode:multiply; filter:drop-shadow(0 26px 34px rgba(2,89,138,.22)); }

/* Cifras de confianza */
.mr-cifra{ display:flex; flex-direction:column; gap:.25rem; }
.mr-cifra strong{
  font-family:var(--wp--preset--font-family--display);
  font-size:1.55rem; font-weight:600; line-height:1; color:var(--mr-navy);
}
.mr-cifra span{ font-size:.87rem; color:var(--mr-tinta-suave); }

/* ---------- Franja de garantías ---------- */
.mr-garantias{ color:#fff; }
.mr-garantias .mr-garantia b{ display:block; font-size:.98rem; font-weight:600; color:#fff; }
.mr-garantias .mr-garantia span{ font-size:.86rem; color:rgba(255,255,255,.78); line-height:1.45; }
.mr-garantias svg{ color:#BEEBF7; flex:none; }

/* ---------- Tarjetas ---------- */
.wp-block-group.is-style-tarjeta{
  background:var(--mr-blanco); border:1px solid var(--mr-linea);
  border-radius:var(--mr-r-lg); padding:2rem;
  transition:transform .35s var(--mr-ease), box-shadow .35s var(--mr-ease), border-color .35s var(--mr-ease);
}
.wp-block-group.is-style-tarjeta:hover{
  transform:translateY(-4px); box-shadow:var(--mr-sombra-md); border-color:var(--mr-linea-fuerte);
}
.wp-block-group.is-style-panel-producto{
  background:linear-gradient(160deg, #E9F4FA, var(--mr-panel));
  border-radius:var(--mr-r-md); padding:1.4rem;
  display:grid; place-items:center;
}
.mr-destacada{ border-color:var(--mr-marca); box-shadow:var(--mr-sombra-md); }

.mr-etiqueta{
  display:inline-block; background:var(--mr-cyan-lavado); color:var(--mr-marca-profundo);
  font-size:.76rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  padding:.35rem .8rem; border-radius:999px;
}
.mr-insignia{
  display:inline-block; background:var(--mr-marca); color:#fff;
  font-size:.72rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
  padding:.32rem .75rem; border-radius:999px;
}

/* Lista de características con punto cyan */
.mr-specs{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:.5rem; }
.mr-specs li{
  display:flex; gap:.6rem; align-items:flex-start;
  color:var(--mr-tinta-suave); font-size:.95rem;
}
.mr-specs li::before{
  content:""; width:6px; height:6px; border-radius:50%; background:var(--mr-cyan);
  margin-top:.62rem; flex:none;
}

/* Precio doble: renta y venta */
.mr-precios{
  display:flex; gap:1.8rem; padding-top:1.2rem;
  border-top:1px dashed var(--mr-linea-fuerte); margin-top:auto;
}
.mr-precio .mr-precio__etiqueta{
  display:block; font-size:.78rem; text-transform:uppercase; letter-spacing:.1em;
  color:var(--mr-tinta-suave); font-weight:600;
}
.mr-precio .mr-precio__monto{
  font-family:var(--wp--preset--font-family--display);
  font-size:1.75rem; font-weight:600; line-height:1.15; color:var(--mr-navy); display:block;
}
.mr-precio .mr-precio__monto small{
  font-family:var(--wp--preset--font-family--texto);
  font-size:.85rem; font-weight:500; color:var(--mr-tinta-suave);
}

/* ---------- Pasos ---------- */
.mr-paso{ border-top:2px solid rgba(255,255,255,.16); padding-top:1.5rem; }
.mr-paso .mr-paso__num{
  font-family:var(--wp--preset--font-family--display);
  font-size:3.2rem; font-weight:500; line-height:1; color:#5FD3EE; display:block;
}
.mr-paso h3{ color:#fff; }
.mr-paso p{ color:rgba(255,255,255,.76); }

/* ---------- Testimonios ---------- */
.mr-cita{
  background:var(--mr-blanco); border:1px solid var(--mr-linea);
  border-radius:var(--mr-r-md); padding:1.8rem;
  display:flex; flex-direction:column; gap:1.1rem; height:100%;
}
.mr-cita::before{
  content:"\201C"; font-family:var(--wp--preset--font-family--display);
  font-size:3rem; line-height:.6; color:var(--mr-cyan); height:1.4rem;
}
.mr-cita cite{ font-style:normal; font-weight:600; font-size:.95rem; display:block; }
.mr-cita small{ color:var(--mr-tinta-suave); font-size:.84rem; }
.mr-avatar{
  width:42px; height:42px; border-radius:50%; flex:none;
  background:var(--mr-cyan-lavado); color:var(--mr-marca);
  display:grid; place-items:center; font-weight:700;
  font-family:var(--wp--preset--font-family--display);
}

/* ---------- Preguntas frecuentes ---------- */
.wp-block-details.is-style-faq{
  border:0; border-bottom:1px solid var(--mr-linea);
  border-radius:0; padding:1.25rem 0; background:transparent;
}
.wp-block-details.is-style-faq summary{
  cursor:pointer; list-style:none; font-weight:600; font-size:1.08rem;
  display:block; position:relative; padding-right:2.4rem;
}
.wp-block-details.is-style-faq summary::-webkit-details-marker{ display:none; }
.wp-block-details.is-style-faq summary::after{
  content:"+"; position:absolute; right:0; top:.05em;
  font-size:1.5rem; font-weight:400; line-height:1;
  color:var(--mr-marca); transition:transform .3s var(--mr-ease);
}
.wp-block-details.is-style-faq[open] summary::after{ transform:rotate(45deg); }
.wp-block-details.is-style-faq p{ margin-top:.85rem; color:var(--mr-tinta-suave); max-width:62ch; }

/* ---------- Formulario de cotización ---------- */
.mr-form{
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.22);
  border-radius:var(--mr-r-lg); padding:1.8rem;
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.mr-form label{
  display:block; font-size:.83rem; font-weight:600; letter-spacing:.05em;
  text-transform:uppercase; color:rgba(255,255,255,.78); margin-bottom:.4rem;
}
.mr-form p{ margin-bottom:1.1rem; }
.mr-form input:not([type="submit"]),
.mr-form select,
.mr-form textarea{
  width:100%; min-height:50px; border-radius:var(--mr-r-sm);
  border:1px solid rgba(255,255,255,.3); background:rgba(255,255,255,.94);
  color:var(--mr-navy); padding:.75rem 1rem; font:inherit; font-size:1rem;
}
.mr-form textarea{ min-height:96px; resize:vertical; }
.mr-form input[type="submit"],
.mr-form button[type="submit"]{
  width:100%; min-height:54px; border:0; border-radius:999px;
  background:var(--mr-navy); color:#fff; font:inherit; font-weight:600; cursor:pointer;
  transition:background-color .25s var(--mr-ease), transform .25s var(--mr-ease);
}
.mr-form input[type="submit"]:hover,
.mr-form button[type="submit"]:hover{ background:var(--mr-navy-profundo); transform:translateY(-2px); }
.mr-form .wpcf7-not-valid-tip{ color:#FFD9D0; font-size:.85rem; }
.mr-form .wpcf7-response-output{
  border-color:rgba(255,255,255,.4); color:#fff; border-radius:var(--mr-r-sm); font-size:.9rem;
}

/* Datos de contacto */
.mr-contacto-lista{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:1.1rem; }
.mr-contacto-lista li{ display:flex; gap:.9rem; align-items:flex-start; }
.mr-contacto-lista svg{ flex:none; margin-top:3px; color:rgba(255,255,255,.75); }
.mr-contacto-lista b{
  display:block; font-size:.8rem; text-transform:uppercase; letter-spacing:.1em;
  color:rgba(255,255,255,.68); font-weight:600;
}
.mr-contacto-lista span{ font-size:1.05rem; }
.mr-contacto-lista a{ color:#fff; text-decoration:none; }
.mr-contacto-lista a:hover{ text-decoration:underline; }

/* ---------- Pie de página ---------- */
.mr-footer{ background:var(--mr-navy-profundo); color:rgba(255,255,255,.74); }
.mr-footer a{ color:inherit; text-decoration:none; }
.mr-footer a:hover{ color:#fff; text-decoration:underline; }
.mr-footer h2, .mr-footer h3, .mr-footer h4{
  color:#fff; font-family:var(--wp--preset--font-family--texto);
  font-size:1rem; font-weight:600; letter-spacing:.04em;
}
.mr-footer .wp-block-navigation{ font-size:.95rem; }
.mr-footer .wp-block-social-link{ background:transparent; }
.mr-footer .wp-block-social-links.is-style-logos-only .wp-block-social-link-anchor{
  width:42px; height:42px; border-radius:50%; border:1px solid rgba(255,255,255,.2);
  display:grid; place-items:center; color:rgba(255,255,255,.85);
  transition:background-color .25s var(--mr-ease), border-color .25s var(--mr-ease), color .25s var(--mr-ease);
}
.mr-footer .wp-block-social-links.is-style-logos-only .wp-block-social-link-anchor:hover{
  background:var(--mr-cyan); border-color:var(--mr-cyan); color:var(--mr-navy);
}

/* ---------- WhatsApp flotante ---------- */
.mr-wa-float{
  position:fixed; bottom:1.4rem; right:1.4rem; z-index:60;
  display:flex; align-items:center; gap:.7rem;
  background:var(--mr-marca); color:#fff; text-decoration:none;
  padding:.85rem 1.3rem .85rem .95rem; border-radius:999px;
  font-weight:600; font-size:.98rem;
  box-shadow:0 16px 34px -14px rgba(2,89,138,.9);
  transition:transform .25s var(--mr-ease), background-color .25s var(--mr-ease);
}
.mr-wa-float:hover{ transform:translateY(-3px); background:var(--mr-marca-profundo); color:#fff; }
.mr-wa-float svg{ color:#7BF3AE; }

/* ---------- Revelado al hacer scroll ---------- */
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    .mr-reveal{
      animation:mr-rise linear both;
      animation-timeline:view();
      animation-range:entry 8% cover 26%;
    }
    @keyframes mr-rise{
      from{ opacity:0; transform:translateY(26px); }
      to{ opacity:1; transform:none; }
    }
  }
}

/* ---------- Responsive ---------- */
@media (min-width:600px) and (max-width:781px){
  /* WordPress apila las columnas a 781px; las garantías se ven mejor 2 x 2. */
  .mr-garantias .wp-block-columns > .wp-block-column{ flex-basis:calc(50% - 0.6rem) !important; }
}
@media (max-width:900px){
  .mr-hero-lead{ max-width:none; }
  .mr-topbar .mr-oculto-movil{ display:none; }
}
@media (max-width:640px){
  /* En móvil el nombre y el lema partían el encabezado en cuatro líneas. */
  .mr-header .mr-marca-lema{ display:none; }
  .mr-header .wp-block-site-title{ font-size:1rem; white-space:nowrap; }
  .mr-header .wp-block-site-logo{ width:42px; }
  .mr-header .wp-block-buttons .wp-block-button__link{ padding:0.6rem 1rem; font-size:0.9rem; min-height:44px; }
  /* La fila del encabezado se salía 22px: el hueco entre grupos era de 1.5rem. */
  .mr-header > .wp-block-group > .wp-block-group{ gap:0.5rem; }
  .mr-header .wp-block-group.alignwide > .wp-block-group{ gap:0.55rem; }

  /* El signo + y el espacio entre columnas le robaban ancho al texto. */
  .wp-block-details.is-style-faq summary{ font-size:1rem; padding-right:2rem; }
  .mr-wa-float span{ display:none; }
  .mr-wa-float{ padding:1rem; border-radius:50%; }
  .mr-precios{ gap:1.2rem; }
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}

@media (max-width:480px){
  /* A este ancho no caben logo, nombre, menú, carrito y "Cotizar":
     el logo ya identifica la marca, así que el nombre cede el lugar. */
  .mr-header .wp-block-site-title{ display:none; }
}

/* En monitores grandes el contenido usa el 80% del ancho, con tope
   para que las líneas de texto no se vuelvan ilegibles. */
@media (min-width:1600px){
  .mr-contacto .wp-block-columns{ gap:clamp(3rem,5vw,6rem); }
  .mr-hero-lead{ max-width:42ch; }
}