/*
 * Ajustes propios de WordPress sobre el diseño de la maqueta (maqueta.css).
 * Aquí solo va lo necesario para que los bloques de WordPress se vean
 * exactamente como la maqueta.
 */

/* --- Base (lo que en la maqueta ponía el visor) --- */
:root { box-sizing: border-box; }
img { max-width: 100%; }
[hidden]:not([hidden=until-found i]) { display: none !important; }
body { margin: 0; }
.wp-site-blocks { padding: 0; }
.wp-site-blocks > * + * { margin-block-start: 0; }
:where(.wp-site-blocks) > * { margin-block-start: 0; margin-block-end: 0; }
.screen-reader-text {
	border: 0; clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden;
	padding: 0; position: absolute; width: 1px; word-wrap: normal !important;
}
.skip-link:focus { clip-path: none; height: auto; width: auto; z-index: 100000; background: var(--cream); color: var(--wine); padding: .8rem 1.2rem; }

/* Los bloques de WordPress no deben añadir márgenes propios dentro de las secciones. */
:where(.cp-main) :where(p, h1, h2, h3, h4, ul, ol, blockquote) { margin-block-start: 0; }
:where(.cp-main) :where(.wp-block-group) { margin-block-start: 0; margin-block-end: 0; }
:where(.cp-main) :where(.is-layout-flow, .is-layout-constrained) > * { margin-block-start: 0; }
/* Las figuras conservan el margen por defecto del navegador, como en la maqueta. */
:where(figure) { margin: 1em 40px; }
:where(.a-body) :where(figure) { margin: 2rem 0; }
/* La maqueta da a todas las fotos alto completo y recorte (object-fit); WordPress lo cambia a «auto». */
.cp-main .wp-block-image img { display: block; height: 100%; }
.cp-main ul.wp-block-list { padding-left: 0; }

/* La animación de aparición solo si el JavaScript funciona; en el editor, todo visible. */
html:not(.cp-js) .rv,
html:not(.cp-js) .rev-track,
html:not(.cp-js) .rev-card,
html:not(.cp-js) .panel-list li,
.editor-styles-wrapper .rv,
.editor-styles-wrapper .rev-track,
.editor-styles-wrapper .rev-card,
.editor-styles-wrapper .panel-list li { opacity: 1 !important; transform: none !important; }
html:not(.cp-js) .pr-ill .ic-stem { stroke-dashoffset: 0; }
html:not(.cp-js) .pr-ill .ic-leaf, html:not(.cp-js) .pr-ill .ic-petal, html:not(.cp-js) .pr-ill .ic-heart { opacity: 1; transform: none; }

/* Cabecera fija también con la barra de administración. */
.admin-bar .site-head { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-head { top: 46px; } }

/* Formulario (lo que no está en la maqueta). */
.cp-trampa { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.form-aviso { padding: 1rem 1.2rem; margin-bottom: 1.4rem; border-radius: 4px; font-size: .95rem; }
.form-ok { background: rgba(247,242,231,.14); color: var(--cream); border: 1px solid rgba(247,242,231,.4); }
.form-err { background: var(--cream); color: var(--wine-deep); }
.form-aviso a { color: inherit; }
.form .consent a { color: inherit; text-decoration: underline; }
.rgpd-basica { margin-top: .4rem; font-size: .78rem; line-height: 1.55; color: rgba(247,242,231,.85); }
.rgpd-basica summary { cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.rgpd-basica dl { display: grid; grid-template-columns: max-content 1fr; gap: .35rem 1rem; margin: .9rem 0; }
.rgpd-basica dt { font-weight: 700; }
.rgpd-basica dd { margin: 0; }
.rgpd-basica a { color: inherit; }

/* Avisos que solo se ven en el editor. */
.cp-vacio { padding: 1.2rem; border: 1px dashed var(--rose); color: var(--wine); font-size: .9rem; background: var(--rose-soft); }

/* En el editor, las secciones de la portada ocupan todo el ancho, como en la web. */
.editor-styles-wrapper .is-root-container > section.wp-block-group { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }

/* Páginas legales y páginas normales. */
:where(.legal-body) > :where(ul, ol, table, figure, .wp-block-group) { margin-top: 0; margin-bottom: 1rem; }
.legal.article-wrap .legal-body a { color: var(--wine); }
.cp-pagina { padding-block: clamp(3rem, 7vw, 6rem); }

/* Artículo: contenido escrito en el editor (bloques de WordPress). */
.a-body > * + * { margin-top: 1.4rem; }
.a-body img { height: auto; }
.a-body .wp-block-quote { margin: 2.2rem 0; padding-left: 1.4rem; border-left: 2px solid var(--rose); font-family: var(--display); font-style: italic; font-weight: 300; font-size: 1.4rem; color: var(--wine-deep); line-height: 1.4; }
.a-body .wp-block-quote p { margin: 0; max-width: none; }
.a-cover img { width: 100%; height: 100%; object-fit: cover; }

/* Paginación del blog. */
.cp-paginacion { display: flex; justify-content: center; gap: 1rem; margin-top: 3rem; font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; }
.cp-paginacion a, .cp-paginacion span { color: var(--wine); text-decoration: none; padding: .4rem .6rem; }
.cp-paginacion .current { color: var(--ink); border-bottom: 1px solid var(--wine); }

/* --- Detalles de marcado de WordPress frente a la maqueta --- */
.panel-env { --pbg: #EFE3D4; --pshadow: 92,64,40; }

.mini-first { margin-top: 1.8rem; }
.blog-todos { margin-top: 2rem; }
.faq-side h2, .dv-h2, .blog-h2 { font-size: clamp(2rem,4.6vw,3.3rem); font-weight: 300; }
.faq-side h2 em, .dv-h2 em { color: var(--wine); }
.blog-cats a { font-family: var(--body); font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
	color: var(--wine-deep); background: var(--cream); border-radius: 999px; padding: .72rem 1.25rem; text-decoration: none;
	box-shadow: 0 8px 16px -10px rgba(92,64,40,.38), 0 2px 5px -3px rgba(92,64,40,.18), inset 0 2px 5px rgba(255,255,255,.7); }
.blog-cats a.active { background: var(--wine); color: var(--cream); }
@media (max-width:760px) { .blog-cats a { flex: 0 0 auto; } }
.cp-divulgacion .pod-grid { grid-template-columns: 1fr; }
.dv-foto .dv-clip { margin: 0; }
#pag-divulgacion .panel-env .cp-divulgacion > .posts-head:first-of-type { margin-top: 0; }

/* Móviles muy estrechos (320–374 px): la marca y el botón del menú caben sin desbordar. */
@media (max-width: 374px) {
	.head-in { gap: .7rem; }
	.brand { gap: .6rem; font-size: 1.28rem; }
	.brand-mark { height: 34px; }
	.brand small { letter-spacing: .24em; }
	.menu-btn { padding: .55rem .7rem; gap: .45rem; flex-shrink: 0; }
}
@media (max-width: 339px) {
	.menu-btn .mb-txt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
	.menu-btn { padding: .65rem .7rem; }
}

/* Contraste suficiente (WCAG AA) sobre el fondo vino: el mismo rosa, un punto más claro. */
.area h2 em, .contact h2 em { color: #E8A0AF; }
.area .close { color: #F0B3BF; }
.contact .marker .k { color: #F0B3BF; }
.contact .mini, .contact .form label { color: #E9D3D7; }
.a-contact-mini { color: var(--ink-soft); }

/* En el editor, los botones y las fotos se ven igual que en la web. */
.editor-styles-wrapper .wp-block-button.btn { display: inline-flex; flex-wrap: nowrap; }
.editor-styles-wrapper .wp-block-button.btn > .wp-block-button__link { background: none !important; color: inherit !important; padding: 0 !important; border: 0 !important; border-radius: 0; font: inherit; letter-spacing: inherit; text-transform: inherit; box-shadow: none; width: auto; }
.editor-styles-wrapper .wp-block-image img { height: 100% !important; width: 100% !important; object-fit: cover; }
.editor-styles-wrapper .wp-block-image > div, .editor-styles-wrapper .wp-block-image .components-resizable-box__container { height: 100% !important; width: 100% !important; position: absolute; inset: 0; }
