/* Cohete CW · Punto Fisio — A · Editorial clínica premium / evolución 1.0.19.
 * Capa visual reversible. Preserva los modos explícitos de cada widget.
 * El protagonismo del original se mantiene: el marcador vuelve a tener masa,
 * sin volver a un rectángulo plano y sin cambios de dimensiones ni de HTML.
 */
body.cw-pf-visual-editorial {
    --cw-a-blue: var(--e-global-color-secondary, #00ACF8);
    --cw-a-green: var(--e-global-color-primary, #00CFAB);
    --cw-a-accent: var(--e-global-color-accent, #36CEAB);
    --cw-a-ease: cubic-bezier(.22, 1, .36, 1);
}

/* MARCO EDITORIAL · contorno óptico discontinuo con geometría real.
 * El radio del borde interior se deriva del radio de la fotografía y de
 * su separación. Se dibuja un borde curvo real y se ocultan solo tramos
 * centrales mediante una máscara: nunca se simulan esquinas curvas con
 * ocho rectángulos de gradiente.
 */
body.cw-pf-visual-editorial .cw-pf-image--has-frame .cw-pf-image__inner {
    border: var(--cw-img-frame-width) solid var(--cw-img-frame) !important;
    border-radius: var(--cw-img-inner-radius, max(0px, calc(var(--cw-img-radius) - var(--cw-img-frame-inset)))) !important;
    background: none !important;
    opacity: .85;
    -webkit-mask-image:
        linear-gradient(#000 0 0), linear-gradient(#000 0 0),
        linear-gradient(#000 0 0), linear-gradient(#000 0 0);
    mask-image:
        linear-gradient(#000 0 0), linear-gradient(#000 0 0),
        linear-gradient(#000 0 0), linear-gradient(#000 0 0);
    -webkit-mask-position: left top, right top, right bottom, left bottom;
    mask-position: left top, right top, right bottom, left bottom;
    -webkit-mask-size: var(--cw-img-inner-segments, 44%) 40%, var(--cw-img-inner-segments, 33%) 45%, var(--cw-img-inner-segments, 44%) 40%, var(--cw-img-inner-segments, 33%) 45%;
    mask-size: var(--cw-img-inner-segments, 44%) 40%, var(--cw-img-inner-segments, 33%) 45%, var(--cw-img-inner-segments, 44%) 40%, var(--cw-img-inner-segments, 33%) 45%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    transition: opacity .4s ease;
}
/* Sin píxeles decorativos sueltos: toda la composición procede del marco. */
body.cw-pf-visual-editorial .cw-pf-image--has-frame .cw-pf-image__inner::after {
    content: none;
    display: none;
}
@media (hover:hover) and (pointer:fine) {
    body.cw-pf-visual-editorial .cw-pf-image--has-frame .cw-pf-image__link:hover .cw-pf-image__inner,
    body.cw-pf-visual-editorial .cw-pf-image--has-frame .cw-pf-image__link:focus-visible .cw-pf-image__inner {
        opacity: .98;
    }
}
/* Los marcos secundarios también siguen el radio de cada fotografía. */
body.cw-pf-visual-editorial .cw-pf-image--secondary-frame .cw-pf-image__secondary-edge {
    border-radius: max(0px, calc(var(--cw-img-secondary-radius) - 7px));
    opacity: .75;
    box-shadow: none;
}
body.cw-pf-visual-editorial .cw-pf-image--tertiary-frame .cw-pf-image__tertiary-edge {
    border-radius: max(0px, calc(var(--cw-img-tertiary-radius) - 6px));
    opacity: .75;
    box-shadow: none;
}
/* Los acentos externos siguen las curvas en vez de imponer ángulos de 90°. */
body.cw-pf-visual-editorial .cw-pf-image--architectural .cw-pf-image__corner--a {
    border-top-left-radius: max(0px, calc(var(--cw-img-radius) + var(--cw-img-offset) * .34));
}
body.cw-pf-visual-editorial .cw-pf-image--architectural .cw-pf-image__corner--b {
    border-bottom-right-radius: max(0px, calc(var(--cw-img-radius) + var(--cw-img-offset) * .34));
}

/* FIRMA TIPOGRÁFICA · un marcador con verdadero peso visual.
 * Una banda principal de color continuo y un filo inferior de contraste.
 * Distinto del resaltado plano heredado, sin sacrificar su presencia.
 * Multi-line safe por el fondo inline y box-decoration-break: clone.
 */
body.cw-pf-visual-editorial .cw-pf-hero--emphasis-soft-marker .cw-pf-hero__title-emphasis {
    --cw-a-marker-end: var(--cw-hero-emphasis-fill, var(--cw-a-green));
    padding-inline: .035em;
    margin-inline: -.035em;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    background-image:
        linear-gradient(104deg,
            color-mix(in srgb, var(--cw-a-blue) 48%, transparent) 0%,
            var(--cw-a-blue) 5%,
            color-mix(in srgb, var(--cw-a-blue) 54%, var(--cw-a-marker-end) 46%) 46%,
            var(--cw-a-marker-end) 95%,
            color-mix(in srgb, var(--cw-a-marker-end) 48%, transparent) 100%),
        linear-gradient(90deg,
            color-mix(in srgb, var(--cw-a-blue) 30%, transparent),
            color-mix(in srgb, var(--cw-a-marker-end) 34%, transparent));
    background-repeat: no-repeat;
    background-size: 100% .225em, 100% .295em;
    background-position: 0 91%, 0 92%;
    text-shadow: none;
}
/* Underline is a deliberately slimmer option, never forced into a thick marker. */
body.cw-pf-visual-editorial .cw-pf-hero--emphasis-underline .cw-pf-hero__title-emphasis {
    background-image: linear-gradient(90deg, var(--cw-a-blue), var(--cw-hero-emphasis-fill, var(--cw-a-green)));
    background-size: 100% .075em;
    background-position: left 99%;
    background-repeat: no-repeat;
}

/* Título Premium · same visual weight when the author selects 'sweep'. */
body.cw-pf-visual-editorial .cw-pf-title--highlight-sweep .cw-pf-title__highlight,
body.cw-pf-visual-editorial .cw-pf-title__highlight--sweep {
    --cw-a-title-end: var(--cw-title-accent, var(--cw-a-green));
    padding: 0 .04em .012em;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    background-image:
        linear-gradient(104deg, color-mix(in srgb, var(--cw-a-blue) 48%, transparent) 0%, var(--cw-a-blue) 5%, var(--cw-a-title-end) 95%, color-mix(in srgb, var(--cw-a-title-end) 48%, transparent) 100%),
        linear-gradient(90deg,
            color-mix(in srgb, var(--cw-a-blue) 18%, transparent),
            color-mix(in srgb, var(--cw-a-title-end) 22%, transparent));
    background-repeat: no-repeat;
    background-size: 100% .215em, 100% .285em;
    background-position: 0 92%, 0 93%;
}
body.cw-pf-visual-editorial .cw-pf-title--highlight-underline .cw-pf-title__highlight,
body.cw-pf-visual-editorial .cw-pf-title__highlight--underline {
    text-decoration: none !important;
    background-image: linear-gradient(90deg, var(--cw-a-blue), var(--cw-title-accent, var(--cw-a-green)));
    background-size: 100% .073em;
    background-position: left 98%;
    background-repeat: no-repeat;
}
body.cw-pf-visual-editorial .cw-pf-title--decorated .cw-pf-title__eyebrow-mark {
    border-color: color-mix(in srgb, var(--cw-a-blue) 44%, var(--cw-a-green) 56%);
    transform: none;
}
body.cw-pf-visual-editorial .cw-pf-title--decorated .cw-pf-title__eyebrow-mark::after {
    background: var(--cw-a-green);
    opacity: .95;
}

/* Encabezado Servicio · resaltar superficie sin convertir la opción subrayado
 * en un bloque. Respeta los dos modos y los demás estilos seleccionados. */
body.cw-pf-visual-editorial .cw-service-hero__highlight--surface {
    --cw-a-service-end: var(--cw-sh-accent, var(--cw-a-green));
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    padding: 0 .045em .015em;
    border-radius: 0;
    background-color: transparent;
    background-image:
        linear-gradient(104deg, color-mix(in srgb, var(--cw-a-blue) 48%, transparent) 0%, var(--cw-a-blue) 5%, var(--cw-a-service-end) 95%, color-mix(in srgb, var(--cw-a-service-end) 48%, transparent) 100%),
        linear-gradient(90deg,
            color-mix(in srgb, var(--cw-a-blue) 16%, transparent),
            color-mix(in srgb, var(--cw-a-service-end) 19%, transparent));
    background-size: 100% .205em, 100% .275em;
    background-position: 0 92%, 0 94%;
    background-repeat: no-repeat;
    text-decoration: none;
}
body.cw-pf-visual-editorial .cw-service-hero__highlight--underline {
    text-decoration: none;
    background-image: linear-gradient(90deg, var(--cw-a-blue), var(--cw-sh-accent, var(--cw-a-green)));
    background-size: 100% .075em;
    background-position: left 98%;
    background-repeat: no-repeat;
}
body.cw-pf-visual-editorial .cw-service-hero__eyebrow-line {
    width: 29px;
    flex-basis: 29px;
    background: linear-gradient(90deg, var(--cw-a-blue), var(--cw-a-green));
}

/* TARJETAS CON FOTO · detalle editorial con la misma contundencia de las
 * imágenes, limitado a las tarjetas visuales (sin tocar tarjetas de texto). */
body.cw-pf-visual-editorial .cw-services .cw-service-card:not(.cw-service-no-media):not(.cw-media-error)::after {
    content: '';
    position: absolute;
    z-index: 3;
    top: 16px;
    left: 16px;
    width: 38px;
    height: 48px;
    border-top: 1px solid rgba(255,255,255,.83);
    border-left: 1px solid rgba(255,255,255,.83);
    pointer-events: none;
    opacity: .94;
    transition: width .46s var(--cw-a-ease), height .46s var(--cw-a-ease);
}
@media (hover:hover) and (pointer:fine) {
    body.cw-pf-visual-editorial .cw-services .cw-service-card:not(.cw-service-no-media):not(.cw-media-error):hover::after,
    body.cw-pf-visual-editorial .cw-services .cw-service-card:not(.cw-service-no-media):not(.cw-media-error):focus-visible::after {
        width: 49px;
        height: 57px;
    }
}
body.cw-pf-visual-editorial .cw-services .cw-service-card:not(.cw-service-no-media):not(.cw-media-error) .cw-service-number {
    color: color-mix(in srgb, #fff 68%, var(--cw-a-accent) 32%) !important;
}

/* IMPACTO · la misma geometría, sin perder su ajuste de radio de Elementor. */
body.cw-pf-visual-editorial .cw-impact.has-inner-border::after {
    border: var(--cw-impact-border-width) solid var(--cw-impact-border) !important;
    border-radius: max(
        var(--cw-impact-border-radius, 0px),
        max(0px, calc(var(--cw-impact-radius, 0px) - var(--cw-impact-border-inset, 12px)))
    );
    background: none;
    -webkit-mask-image:
        linear-gradient(#000 0 0), linear-gradient(#000 0 0),
        linear-gradient(#000 0 0), linear-gradient(#000 0 0);
    mask-image:
        linear-gradient(#000 0 0), linear-gradient(#000 0 0),
        linear-gradient(#000 0 0), linear-gradient(#000 0 0);
    -webkit-mask-position: left top, right top, right bottom, left bottom;
    mask-position: left top, right top, right bottom, left bottom;
    -webkit-mask-size: 44% 40%, 33% 45%, 44% 40%, 33% 45%;
    mask-size: 44% 40%, 33% 45%, 44% 40%, 33% 45%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

/* CLÍNICA · pocos retoques, sin añadir capas que compitan con la fotografía. */
body.cw-pf-visual-editorial .cw-clinical-grid--editorial .cw-clinical-grid__item {
    border-color: color-mix(in srgb, var(--cw-a-blue) 10%, var(--cw-cg-border) 90%);
    box-shadow: 0 10px 30px color-mix(in srgb, var(--cw-pf-text, #333) 5%, transparent);
}
body.cw-pf-visual-editorial .cw-clinical-grid--editorial .cw-clinical-grid__visual:not(.cw-clinical-grid__visual--media) {
    background: color-mix(in srgb, var(--cw-a-blue) 5%, var(--cw-pf-background, #fff) 95%);
    border-color: color-mix(in srgb, var(--cw-a-green) 18%, transparent);
}
@media (max-width:767px) {
    body.cw-pf-visual-editorial .cw-services .cw-service-card:not(.cw-service-no-media):not(.cw-media-error)::after {
        top: 12px;
        left: 12px;
        width: 28px;
        height: 34px;
    }
}
@media (prefers-reduced-motion:reduce) {
    body.cw-pf-visual-editorial .cw-pf-image__inner,
    body.cw-pf-visual-editorial .cw-services .cw-service-card::after {
        transition: none !important;
    }
}

/* Controles independientes: no asociar las esquinas decorativas a la placa. */
body.cw-pf-visual-editorial .cw-pf-image--architectural .cw-pf-image__corner--a{border-top-left-radius:var(--cw-img-corner-radius,max(0px,calc(var(--cw-img-radius) + var(--cw-img-offset)*.34)))}
body.cw-pf-visual-editorial .cw-pf-image--architectural .cw-pf-image__corner--b{border-bottom-right-radius:var(--cw-img-corner-radius,max(0px,calc(var(--cw-img-radius) + var(--cw-img-offset)*.34)))}
