/* ===== Piel común de las páginas interiores (aspecto de la portada B) =====
   Solo actúa con body.sfx-site, que pone el mu-plugin en Sobre Sofía, Artículos, Reservas y el blog.
   site.js marca los elementos (sfx-panel, sfx-eyebrow, sfx-card...) a partir de cómo están hechos en Elementor. */
body.sfx-site{background:#FAF9F6;--sf-ease:cubic-bezier(.22,.8,.26,1)}

/* Paneles: cada bloque principal pasa a ser una tarjeta grande redondeada sobre el fondo crema */
body.sfx-site .sfx-panel{width:auto!important;max-width:none!important;margin:12px max(12px,calc((100% - 1240px)/2)) 0!important;border-radius:28px;overflow:clip;isolation:isolate}
@media (min-width:1024px){body.sfx-site .sfx-panel{margin:16px max(16px,calc((100% - 1240px)/2)) 0!important;border-radius:40px}}
body.sfx-site .sfx-panel.sfx-light{background-color:#fff!important}
body.sfx-site .sfx-panel.sfx-sage{background-color:#F3F6F2!important}
/* Brillo menta en la cabecera de cada página y en los bloques de llamada a la acción */
body.sfx-site .sfx-panel.sfx-glow{background-image:radial-gradient(520px 420px at 100% 0%,rgba(159,216,189,.38),rgba(231,241,234,.35) 45%,transparent 72%),radial-gradient(420px 360px at 0% 100%,rgba(231,241,234,.9),transparent 70%)!important}
body.sfx-site .sfx-panel.sfx-dark.sfx-glow{background-image:radial-gradient(520px 420px at 100% 0%,rgba(159,216,189,.22),transparent 70%)!important}

/* Antetítulos: píldora menta, como en la portada */
body.sfx-site .sfx-eyebrow{display:inline-flex!important;align-items:center;gap:8px;width:auto!important;background:#E7F1EA!important;color:#004328!important;-webkit-text-fill-color:#004328;border-radius:999px;padding:7px 16px!important;font:600 12.5px/1.4 Inter,sans-serif!important;letter-spacing:.14em!important;text-transform:uppercase}
body.sfx-site .sfx-eyebrow::before,body.sfx-site .sfx-eyebrow::after{display:none!important}
body.sfx-site .sfx-dark .sfx-eyebrow{background:rgba(255,255,255,.1)!important;color:#9FD8BD!important;-webkit-text-fill-color:#9FD8BD}
body.sfx-site .sfx-hide{display:none!important}

/* El dorado de las páginas antiguas pasa a la paleta verde de la portada */
body.sfx-site .sfx-gold{color:#004328!important;-webkit-text-fill-color:#004328}
body.sfx-site .sfx-dark .sfx-gold{color:#9FD8BD!important;-webkit-text-fill-color:#9FD8BD}
body.sfx-site .sfx-goldline{border-color:#9FD8BD!important}
body.sfx-site .sfx-goldbg{background-color:#9FD8BD!important}

/* Tarjetas */
body.sfx-site .sfx-card{border-radius:24px!important;border-color:transparent!important;box-shadow:0 1px 2px rgba(16,40,28,.04),0 8px 24px rgba(16,40,28,.06)!important;transition:transform .3s ease,box-shadow .3s ease,opacity .8s var(--sf-ease)}
body.sfx-site .sfx-card:hover{transform:translateY(-4px);box-shadow:0 2px 6px rgba(16,40,28,.06),0 18px 40px rgba(16,40,28,.11)!important}
body.sfx-site .sfx-card.sfx-warm::before{background-image:linear-gradient(135deg,#004328 0%,#2E7D5B 50%,#9FD8BD 100%)!important}
body.sfx-site .sfx-card.sfx-accentbar{border-left:4px solid #9FD8BD!important}

/* Botones */
body.sfx-site .sfx-btn{border-radius:12px!important;box-shadow:0 6px 16px rgba(0,67,40,.18);transition:background .25s ease,transform .25s ease,box-shadow .25s ease!important}
body.sfx-site .sfx-btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(0,67,40,.24)}
body.sfx-site .sfx-btn.sfx-gold-btn{background-color:#004328!important;color:#fff!important}
body.sfx-site .sfx-btn.sfx-gold-btn:hover{background-color:#00301D!important}

/* «Leer artículo»: el CSS de la página ponía content:"2192" (le faltaba la barra del escape) y salía el número */
body.sfx-site .elementor-post__read-more::after{content:"\2192"!important;display:inline-block;margin-left:6px;transition:transform .25s ease}
body.sfx-site .elementor-post__read-more:hover::after{transform:translateX(3px)}

/* Imágenes dentro de los paneles: esquinas suaves */
body.sfx-site .sfx-panel .elementor-widget-image img{border-radius:24px}

/* Aparición escalonada al bajar */
body.sfx-site .sfx-rv{opacity:0;transform:translateY(26px);transition:opacity .8s var(--sf-ease),transform .8s var(--sf-ease)}
body.sfx-site .sfx-rv.sfx-in{opacity:1;transform:none}
body.sfx-site .sfx-card.sfx-rv.sfx-in:hover{transform:translateY(-4px)}
body.sfx-site .sfx-rvs{opacity:0;transform:scale(.97);transition:opacity .9s var(--sf-ease),transform .9s var(--sf-ease)}
body.sfx-site .sfx-rvs.sfx-in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  body.sfx-site .sfx-rv,body.sfx-site .sfx-rvs{opacity:1!important;transform:none!important;transition:none!important}
  body.sfx-site .sfx-card:hover,body.sfx-site .sfx-btn:hover{transform:none}
}

/* ===== Respiración consciente (página 1566): efectos de respiración =====
   Ciclo de 10 s: 4 s inhalar, 6 s exhalar. site.js pone los elementos solo en esa página. */
@keyframes sfbBreath{0%{transform:scale(.62)}40%{transform:scale(1)}100%{transform:scale(.62)}}
@keyframes sfbRing{0%{transform:scale(.55);opacity:0}15%{opacity:.55}40%{transform:scale(1);opacity:.35}100%{transform:scale(1.25);opacity:0}}
body.sfx-site .dr-post-hero{position:relative}
.sfb-rings{position:absolute;right:-90px;top:50%;width:380px;height:380px;margin-top:-190px;pointer-events:none;z-index:-1}
.sfb-rings i{position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(0,67,40,.18);animation:sfbRing 10s var(--sf-ease) infinite}
.sfb-rings i:nth-child(2){animation-delay:-3.3s}
.sfb-rings i:nth-child(3){animation-delay:-6.6s}
.sfb-rings b{position:absolute;inset:28%;border-radius:50%;background:radial-gradient(circle,rgba(159,216,189,.55),rgba(231,241,234,0) 70%);animation:sfbBreath 10s ease-in-out infinite}
@media (max-width:767px){.sfb-rings{width:240px;height:240px;margin-top:-120px;right:-110px;opacity:.7}}

.sfb-guide{display:flex;align-items:center;gap:28px;margin:32px 0;padding:28px;border-radius:28px;background:#F3F6F2;font-family:Inter,sans-serif}
.sfb-orb{position:relative;flex:0 0 150px;height:150px;display:grid;place-items:center}
.sfb-orb::before,.sfb-orb::after{content:"";position:absolute;inset:0;border-radius:50%}
.sfb-orb::before{background:radial-gradient(circle at 40% 35%,#9FD8BD,#3f8f6c 70%,#004328);box-shadow:0 0 0 14px rgba(159,216,189,.25),0 18px 40px -12px rgba(0,67,40,.45);animation:sfbBreath 10s ease-in-out infinite}
.sfb-orb::after{border:1.5px dashed rgba(0,67,40,.25)}
.sfb-orb span{position:relative;color:#fff;font:600 15px/1 Inter,sans-serif;letter-spacing:.06em;text-shadow:0 1px 6px rgba(0,0,0,.25)}
.sfb-guide.is-paused .sfb-orb::before{animation-play-state:paused}
.sfb-txt{display:flex;flex-direction:column;gap:10px;min-width:0}
.sfb-txt p{margin:0!important;font-size:15.5px;line-height:1.55;color:#2b3a33}
.sfb-txt strong{font-family:"Playfair Display",Georgia,serif;font-size:21px;font-weight:600;color:#004328}
.sfb-btn{align-self:flex-start;border:0;border-radius:999px;background:#004328;color:#fff;padding:10px 20px;font:600 14px Inter,sans-serif;cursor:pointer}
.sfb-btn:hover{background:#00321e}.sfb-btn:focus-visible{outline:3px solid #9FD8BD;outline-offset:3px}
@media (max-width:600px){.sfb-guide{flex-direction:column;text-align:center;padding:24px 20px}.sfb-btn{align-self:center}}
@media (prefers-reduced-motion:reduce){.sfb-rings i,.sfb-rings b,.sfb-orb::before{animation:none}.sfb-rings i{opacity:.3}.sfb-orb::before{transform:scale(.85)}.sfb-btn{display:none}}
