/* Cero FSE — estilos del front. */
a { text-underline-offset: 0.2em; }
:focus-visible { outline: 2px solid var(--wp--preset--color--forest); outline-offset: 3px; }
::selection { background: var(--wp--preset--color--forest); color: #fff; }

/* Kicker */
.cero-kicker {
    font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase;
    color: var(--wp--preset--color--forest); margin-bottom: 0.6rem;
}

/* Header */
.cero-header { position: sticky; top: 0; background: var(--wp--preset--color--paper); z-index: 50; }
.cero-header .wp-block-site-logo img { max-height: 44px; width: auto; }
.cero-logo { display: inline-flex; align-items: center; text-decoration: none; flex: none; }
.cero-logo img { height: 44px; width: auto; }
@media (max-width: 600px) {
    .cero-logo img { height: 36px; }
}

/* Hero */
.cero-hero { padding-block: var(--wp--preset--spacing--80) var(--wp--preset--spacing--60); }
.cero-hero img { border-radius: 1rem; aspect-ratio: 9 / 11; object-fit: cover; height: auto; }

/* Banda de contacto */
.cero-band {
    background: linear-gradient(160deg, #1E6B4A 0%, #14503A 100%);
    color: #FBFAF6; border-radius: 1.25rem;
    padding: clamp(2rem, 5vw, 3.5rem);
    margin-block: var(--wp--preset--spacing--80);
}
.cero-band .cero-kicker { color: #A9D8C0; }
.cero-band h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 600; margin-bottom: 2rem; }
.cero-band__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.75rem; }
.cero-band__card svg { width: 26px; height: 26px; margin-bottom: 0.6rem; opacity: 0.9; }
.cero-band__card a { color: inherit; text-decoration: none; }
.cero-band__card a:hover { text-decoration: underline; }
.cero-band__card > div { font-size: 0.9rem; line-height: 1.5; }
@media (max-width: 860px) { .cero-band__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .cero-band__grid { grid-template-columns: 1fr; } }

/* Sección oscura de tratamientos */
.cero-dark { background: var(--wp--preset--color--ink); color: #FBFAF6; padding: var(--wp--preset--spacing--80) 0; margin-block: var(--wp--preset--spacing--80); }
.cero-dark h3 { color: #FBFAF6; }
.cero-dark .wp-block-button__link { background: #FBFAF6; color: var(--wp--preset--color--ink); }
.cero-dark .wp-block-button__link:hover { background: var(--wp--preset--color--mint); }

/* FAQ (details/summary nativo, cero JS) */
.cero-faq-item summary {
    cursor: pointer; list-style: none;
    padding: 0.95rem 0; border-top: 1px solid var(--wp--preset--color--line);
    font-size: 1.15rem;
}
.cero-faq-item summary::-webkit-details-marker { display: none; }
.cero-faq-item summary::after {
    content: "+"; float: right; color: var(--wp--preset--color--forest); font-weight: 600;
}
.cero-faq-item[open] summary::after { content: "\2212"; }
.cero-faq-item p { padding-bottom: 1.1rem; color: var(--wp--preset--color--muted); }

/* Formulario */
.cero-form-block { padding-block: var(--wp--preset--spacing--80); }
.cero-form-intro { color: var(--wp--preset--color--muted); }
.cero-form p { margin: 0 0 1.15rem; }
.cero-form label {
    display: block; font-size: 0.8rem; font-weight: 550;
    margin-bottom: 0.35rem;
}
.cero-form input:not([type="checkbox"]), .cero-form textarea {
    width: 100%; background: transparent;
    border: 1px solid var(--wp--preset--color--line); border-radius: 0.5rem;
    padding: 0.7rem 0.8rem; font: inherit; color: inherit;
}
.cero-form input:focus, .cero-form textarea:focus {
    outline: none; border-color: var(--wp--preset--color--forest);
}
.cero-form button { cursor: pointer; }
.cero-form-status { font-size: 0.85rem; min-height: 1.3em; color: var(--wp--preset--color--forest); }
.cero-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.15rem; }
@media (max-width: 560px) { .cero-form__row { grid-template-columns: 1fr; gap: 0; } }
.cero-form__rgpd label { display: flex; gap: 0.5rem; align-items: baseline; font-weight: 400; font-size: 0.8rem; }
.cero-form__rgpd input[type="checkbox"] { width: auto; }
.cero-form__rgpd small { display: block; margin-top: 0.4rem; font-size: 0.68rem; color: var(--wp--preset--color--muted); }

/* Footer bajo el pliegue: render diferido */
.cero-footer { content-visibility: auto; contain-intrinsic-size: auto 520px; }
.cero-footer a { color: inherit; text-decoration: none; }
.cero-footer a:hover { text-decoration: underline; }

@media (prefers-reduced-motion: no-preference) {
    .wp-block-button__link { transition: background-color .15s ease, color .15s ease; }
}

/* ---------- Pase de diseño v2 ---------- */

/* Header: más presencia, fondo blanco difuminado */
.cero-header {
    background: color-mix(in srgb, var(--wp--preset--color--paper) 92%, transparent);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    padding-block: 0.9rem !important;
}
.cero-header .wp-block-navigation { font-size: 0.92rem; font-weight: 500; }
.cero-header .wp-block-navigation a { color: var(--wp--preset--color--ink); text-decoration: none; padding: 0.4rem 0.7rem; }
.cero-header .wp-block-navigation a:hover { color: var(--wp--preset--color--forest); }

/* Hero: sección con aire, título grande y hero de verdad */
.cero-hero {
    padding-block: clamp(3rem, 7vw, 6rem) clamp(2.5rem, 5vw, 4rem);
}
.cero-hero h1 {
    font-size: clamp(2.6rem, 5.2vw, 4.2rem);
    line-height: 1.02;
    letter-spacing: -0.03em;
    max-width: 13ch;
}
.cero-hero .cero-kicker { font-weight: 600; }
.cero-hero .has-large-font-size { max-width: 34rem; }

/* Imágenes: redondeo, sombra suave, proporción */
.wp-block-image img {
    border-radius: 1rem;
    box-shadow: 0 20px 50px -18px rgba(24, 21, 18, 0.25);
}
.cero-hero img { aspect-ratio: 4 / 5; object-fit: cover; }

/* Secciones alternas: fondo crema para separar bloques de contenido */
.cero-alt {
    background: #F3F0E8;
    border-radius: 1.5rem;
    padding: clamp(2rem, 5vw, 4rem) !important;
    margin-block: var(--wp--preset--spacing--60);
}

/* Tarjetas de tratamientos: fondo mint sobre sección oscura */
.cero-dark .wp-block-column {
    background: rgba(251, 250, 246, 0.06);
    border: 1px solid rgba(251, 250, 246, 0.14);
    border-radius: 1rem;
    padding: 1.75rem;
}
.cero-dark .wp-block-column h3 { margin-top: 0; }

/* Botones: sombra y micro-interacción */
.wp-block-button__link {
    box-shadow: 0 6px 16px -6px rgba(30, 107, 74, 0.45);
}
.wp-block-button.is-style-outline .wp-block-button__link {
    background: transparent;
    color: var(--wp--preset--color--forest);
    border: 1.5px solid var(--wp--preset--color--forest);
    box-shadow: none;
}

/* FAQ: más aire y pregunta más grande */
.cero-faq h2 { margin-bottom: 1.5rem; }
.cero-faq-item summary { font-weight: 500; }

/* Formulario: campos más altos, foco más visible */
.cero-form input:not([type="checkbox"]), .cero-form textarea {
    border: 1.5px solid var(--wp--preset--color--line);
    background: #fff;
    padding: 0.9rem 1rem;
}
.cero-form input:focus, .cero-form textarea:focus {
    border-color: var(--wp--preset--color--forest);
    box-shadow: 0 0 0 3px rgba(30, 107, 74, 0.12);
}

/* Banda de contacto: altura de tarjetas equilibrada */
.cero-band__card { align-items: start; }
.cero-band__card svg { flex: none; }

/* Footer: jerarquía mejorada */
.cero-footer h3 {
    text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.72rem;
    opacity: 0.7; margin-bottom: 1rem;
}