/*
Theme Name: VillaMalo
Theme URI: https://esthetique-ansari.fr/
Description: Thème du Centre de chirurgie et médecine esthétique VillaMalo, version « classic chic » : fond blanc, Libre Baskerville et Montserrat, bordeaux #AA2424. Enfant de Twenty Twenty-Five, blocs natifs.
Author: Najib Ansari
Template: twentytwentyfive
Version: 2.0.0
Requires at least: 6.7
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: villamalo
*/
:root { --vm-trait: var(--wp--preset--color--accent-3); --vm-bdx: var(--wp--preset--color--accent-1); --vm-r: 8px; --vm-r-s: 4px; }
body { -webkit-font-smoothing: antialiased; }
.wp-site-blocks { padding-top: 0; }
.wp-site-blocks > * + * { margin-block-start: 0; }
main .wp-block-post-content > * + * { margin-block-start: 0; }

/* ---------- Petites capitales (surtitres) ---------- */
.vm-eyebrow {
	display: flex; align-items: center; gap: 12px;
	font-size: 0.72rem !important; font-weight: 500; letter-spacing: 0.22em; text-transform: uppercase;
	color: var(--vm-bdx); margin: 0 0 1.1rem !important; line-height: 1;
}
.vm-eyebrow::before { content: ""; width: 28px; height: 1px; background: var(--vm-bdx); flex: none; }
.vm-eyebrow a { color: inherit; text-decoration: none; }
.has-text-align-center.vm-eyebrow, .vm-center .vm-eyebrow { justify-content: center; }
.vm-center .vm-eyebrow::after { content: ""; width: 28px; height: 1px; background: var(--vm-bdx); }
.vm-lead { font-size: 1.15rem; line-height: 1.75; color: #4a4a4a; max-width: 34em; }

/* ---------- Liens soulignés ---------- */
.vm-link a, a.vm-link {
	font-size: 0.74rem; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase;
	color: var(--vm-bdx); text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 4px;
}

/* ---------- Boutons ---------- */
.wp-element-button, .wp-block-button__link { border: 1px solid var(--vm-bdx); transition: background .2s, color .2s; }
.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent; color: var(--wp--preset--color--contrast); border-color: var(--wp--preset--color--contrast);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--wp--preset--color--contrast); color: #fff; }

/* ---------- Barre d'informations ---------- */
.vm-topbar p { margin: 0; letter-spacing: 0.04em; font-size: 0.75rem; }
.vm-topbar { border-bottom: 1px solid var(--vm-trait); }
.vm-topbar p { color: var(--wp--preset--color--accent-4); }
.vm-topbar a { color: var(--wp--preset--color--contrast); text-decoration: none; }

/* ---------- En-tête ---------- */
.wp-site-blocks > header.wp-block-template-part { position: sticky; top: 0; z-index: 100; background: #fff; }
.admin-bar .wp-site-blocks > header.wp-block-template-part { top: var(--wp-admin--admin-bar--height, 32px); }
.vm-header .wp-block-navigation-item__content:hover { color: var(--vm-bdx); }
.vm-header .wp-block-navigation__submenu-container {
	border: 1px solid var(--vm-trait) !important; box-shadow: 0 12px 30px rgba(0,0,0,.06); padding: .6rem 0; text-transform: none; letter-spacing: 0.02em;
}

/* ---------- Fil d'Ariane ---------- */
.vm-crumbs { color: var(--wp--preset--color--accent-6); letter-spacing: 0.03em; font-size: 0.75rem !important; border-bottom: 1px solid var(--vm-trait); }
.vm-crumbs a { color: inherit; text-decoration: none; }
.vm-crumbs a:hover { color: var(--vm-bdx); }
.vm-crumbs .breadcrumb_last { color: var(--wp--preset--color--contrast); }

/* ---------- Présentation (haut de page) ---------- */
.vm-hero2 .wp-block-image { position: relative; margin: 0; }
.vm-hero2 .wp-block-image img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; position: relative; z-index: 1; }
.vm-hero2 .wp-block-image::after { content: ""; position: absolute; inset: 18px -18px -18px 18px; border: 1px solid var(--vm-bdx); z-index: 0; }
.vm-home-hero .wp-block-image img { aspect-ratio: 4/5; }
.vm-hero2 h1 { margin-top: 0; }

/* ---------- Bandeaux à colonnes séparées par des filets ---------- */
.vm-strip { border-top: 1px solid var(--vm-trait); border-bottom: 1px solid var(--vm-trait); }
.vm-strip .wp-block-columns { gap: 0 !important; }
.vm-strip .wp-block-column { padding: 2rem 1.6rem; border-left: 1px solid var(--vm-trait); }
.vm-strip .wp-block-column:first-child { border-left: 0; padding-left: 0; }
.vm-strip p { margin: 0; }
.vm-label { font-size: 0.68rem !important; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; color: var(--vm-bdx); margin-bottom: .5rem !important; }
.vm-value { font-family: var(--wp--preset--font-family--libre-baskerville); color: var(--wp--preset--color--contrast); font-size: 1rem; line-height: 1.5; }

/* ---------- Corps des pages intervention ---------- */
.vm-toc { position: sticky; top: 120px; align-self: flex-start; font-size: 0.85rem; }
.vm-toc ul { list-style: none; padding: 0; margin: 0 0 2rem; }
.vm-toc li { border-bottom: 1px solid var(--vm-trait); }
.vm-toc li a { display: block; padding: .6rem 0; color: var(--wp--preset--color--contrast); text-decoration: none; }
.vm-toc li a:hover { color: var(--vm-bdx); }
.vm-card { background: var(--wp--preset--color--accent-5); padding: 1.6rem; }
.vm-card h2, .vm-card h3 { font-size: 1.05rem !important; margin: 0 0 .5rem; }
.vm-card p { font-size: .85rem; margin: 0 0 .8rem; }
.vm-section { scroll-margin-top: 130px; margin-bottom: 4rem !important; }
.vm-body .wp-block-image.aligncenter img { max-width: 420px; }

/* ---------- FAQ ---------- */
.wp-block-details { border-top: 1px solid var(--vm-trait); margin: 0 !important; padding: 0; }
.wp-block-details:last-of-type { border-bottom: 1px solid var(--vm-trait); }
.wp-block-details summary {
	list-style: none; cursor: pointer; position: relative; padding: 1.3rem 2.8rem 1.3rem 0;
	font-family: var(--wp--preset--font-family--libre-baskerville); font-size: 1.02rem; line-height: 1.5; color: var(--wp--preset--color--contrast);
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after {
	content: ""; position: absolute; right: 6px; top: 50%; width: 11px; height: 11px;
	border-right: 1px solid var(--vm-bdx); border-bottom: 1px solid var(--vm-bdx);
	transform: translateY(-70%) rotate(45deg); transition: transform .2s;
}
.wp-block-details[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.wp-block-details > :not(summary) { font-size: .95rem; }
.wp-block-details > :last-child { padding-bottom: 1.2rem; }

/* ---------- Encadré « Pour aller plus loin » ---------- */
.vm-aside { border-left: 1px solid var(--vm-bdx); padding: .4rem 0 .4rem 1.9rem; }
.vm-aside h2 { font-size: 1.25rem !important; }
.vm-aside p strong { font-family: var(--wp--preset--font-family--libre-baskerville); font-weight: 400; color: var(--wp--preset--color--contrast); font-size: 1.05rem; }

/* ---------- Grilles de liens (interventions associées) ---------- */
.vm-related { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1px; background: var(--vm-trait); border: 1px solid var(--vm-trait); }
.vm-related a { background: #fff; padding: 1.6rem 1.4rem; text-decoration: none; font-family: var(--wp--preset--font-family--libre-baskerville); color: var(--wp--preset--color--contrast); line-height: 1.4; }
.vm-related a:hover { color: var(--vm-bdx); }
.vm-related small { display: block; font-family: var(--wp--preset--font-family--montserrat); font-size: .65rem; letter-spacing: .2em; text-transform: uppercase; color: var(--wp--preset--color--accent-6); margin-bottom: .6rem; }

/* ---------- Familles d'interventions (accueil, rubriques) ---------- */
.vm-fam .wp-block-image img { width: 100%; aspect-ratio: 3/4; object-fit: cover; display: block; }
.vm-fam h3 { margin: 1.3rem 0 .6rem; }
.vm-fam h3 a { color: inherit; text-decoration: none; }
.vm-fam ul { list-style: none; padding: 0; margin: 0 0 1.2rem; font-size: .88rem; line-height: 2; }
.vm-fam ul a { color: var(--wp--preset--color--accent-4); text-decoration: none; }
.vm-fam ul a:hover { color: var(--vm-bdx); }
.vm-split .wp-block-image img { width: 100%; aspect-ratio: 5/4; object-fit: cover; display: block; }

/* ---------- Presse ---------- */
.vm-press img { height: 46px; width: auto; filter: grayscale(1); opacity: .8; }

/* ---------- Prise de rendez-vous ---------- */
.vm-infos { display: grid; grid-template-columns: auto 1fr; gap: .3rem 1.4rem; font-size: .9rem; margin: 1.6rem 0 0; }
.vm-infos dt { color: var(--wp--preset--color--contrast); font-weight: 500; }
.vm-infos dd { margin: 0; }
.vm-rdv .wpcf7 { background: #fff; padding: 2.6rem; border: 1px solid var(--vm-trait); }
.wpcf7 input:not([type="submit"]):not([type="radio"]):not([type="checkbox"]), .wpcf7 textarea, .wpcf7 select {
	width: 100%; border: 0; border-bottom: 1px solid #cfcfcf; border-radius: 0; padding: .7rem 0; font: inherit; background: transparent; color: var(--wp--preset--color--contrast);
}
.wpcf7 input:focus, .wpcf7 textarea:focus { outline: none; border-bottom-color: var(--vm-bdx); }
.wpcf7 textarea { min-height: 110px; }
.wpcf7 input[type="submit"] {
	background: var(--vm-bdx); color: #fff; border: 1px solid var(--vm-bdx); border-radius: 0; padding: 1.05rem 1.9rem;
	font: 500 .74rem/1 var(--wp--preset--font-family--montserrat); letter-spacing: .18em; text-transform: uppercase; cursor: pointer; margin-top: 1rem;
}
.wpcf7 input[type="submit"]:hover { background: var(--wp--preset--color--accent-2); }
.wpcf7 .vm-row { display: flex; flex-wrap: wrap; gap: 0 1.2rem; }
.wpcf7 .vm-col { flex: 1 1 100%; margin-bottom: 1rem; font-size: .85rem; }
.wpcf7 .vm-col-1_2 { flex: 1 1 calc(50% - 0.6rem); }
.wpcf7 .vm-row p, .wpcf7 .vm-col p { margin: 0; }
.wpcf7 .wpcf7-list-item { margin: 0 1.2rem 0 0; }
.wpcf7 .text-center { text-align: left; }

/* ---------- Pied de page ---------- */
.vm-footer { border-top: 1px solid var(--vm-trait); }
.vm-footer a { color: var(--wp--preset--color--accent-4); text-decoration: none; }
.vm-footer a:hover { color: var(--vm-bdx); }
.vm-footer-title { font-family: var(--wp--preset--font-family--montserrat) !important; font-size: .7rem !important; font-weight: 500 !important; letter-spacing: .2em; text-transform: uppercase; color: var(--wp--preset--color--contrast) !important; margin-bottom: 1.1rem !important; }
.vm-footer-logo img { display: block; }
.vm-list-plain { list-style: none; padding-left: 0; line-height: 2.1; }
.vm-footer-bottom { border-top: 1px solid var(--vm-trait); color: var(--wp--preset--color--accent-6); margin-top: 3rem !important; padding-top: 1.2rem; font-size: .75rem; }
.vm-footer-bottom p { margin: 0; }

/* ---------- Barre mobile ---------- */
.vm-mbar { display: none; }
@media (max-width: 781px) {
	.vm-mbar { display: grid; grid-template-columns: 1fr 1fr; position: fixed; left: 0; right: 0; bottom: 0; z-index: 200; }
	.vm-mbar a { padding: 1rem; text-align: center; font: 500 .72rem/1 var(--wp--preset--font-family--montserrat); letter-spacing: .16em; text-transform: uppercase; color: #fff; text-decoration: none; background: var(--wp--preset--color--contrast); }
	.vm-mbar a.vm-mbar-rdv { background: var(--vm-bdx); }
	body { padding-bottom: 52px; }
	.vm-header-cta, .vm-topbar-adresse { display: none !important; }
	.vm-header .vm-logo img { width: 120px !important; }
	.vm-strip .wp-block-column { border-left: 0; padding: 1.2rem 0; border-top: 1px solid var(--vm-trait); }
	.vm-strip .wp-block-column:first-child { border-top: 0; }
	.vm-toc { position: static; }
	.vm-hero2 .wp-block-image::after { inset: 10px -10px -10px 10px; }
	.vm-rdv .wpcf7 { padding: 1.4rem; }
}

/* ---------- Angles adoucis ---------- */
.wp-element-button, .wp-block-button__link, .wpcf7 input[type="submit"], .vm-mbar a { border-radius: var(--vm-r-s); }
.vm-mbar a { border-radius: 0; }
main .wp-block-image img, .vm-fam .wp-block-image img, .vm-split .wp-block-image img { border-radius: var(--vm-r); }
.vm-hero2 .wp-block-image::after { border-radius: var(--vm-r); }
.vm-card, .vm-rdv .wpcf7, .vm-related { border-radius: var(--vm-r); overflow: hidden; }
.vm-header .wp-block-navigation__submenu-container { border-radius: var(--vm-r) !important; }
.vm-footer-logo img { border-radius: var(--vm-r-s); }
.vm-strip { border-radius: 0; }

/* ---------- Compatibilité gabarits ---------- */
main.wp-block-group { padding-top: 0 !important; padding-bottom: 0 !important; margin-top: 0 !important; }
.wp-block-template-part.alignfull { margin-top: 0; }
.home .vm-crumbs { display: none; }

/* ---------- Tablette : menu replié, CTA sur une ligne ---------- */
.vm-header-cta .wp-block-button__link { white-space: nowrap; }
@media (min-width: 600px) and (max-width: 1100px) {
	.vm-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.vm-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}

/* ---------- Grilles régulières (cartes, photos, presse) ---------- */
.vm-cards { gap: 2.5rem 2rem; align-items: start; }
.vm-cards > .vm-fam { margin: 0 !important; }
.vm-cards .vm-fam .wp-block-image { margin: 0; }
.vm-photos { gap: 1.2rem; margin-top: 2rem !important; }
.vm-photos .wp-block-image { margin: 0; }
.vm-photos .wp-block-image img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.vm-presse { gap: 2rem; align-items: start; }
.vm-presse .wp-block-image { margin: 0; }
.vm-presse img { width: 100%; height: auto; display: block; border: 1px solid var(--vm-trait); }

/* ---------- Contact ---------- */
.vm-contact-infos p { margin: 0 0 1.4rem; line-height: 1.8; }
.vm-contact-infos strong { display: block; font: 500 .7rem/1.6 var(--wp--preset--font-family--montserrat); letter-spacing: .2em; text-transform: uppercase; color: var(--vm-bdx); margin-bottom: .3rem; }
.vm-contact-form { background: var(--wp--preset--color--accent-5); padding: 2.6rem; border-radius: var(--vm-r); }
.vm-contact-form h2 { margin-top: 0; }
@media (max-width: 781px) { .vm-contact-form { padding: 1.4rem; } }

/* ---------- Formulaires : champs techniques invisibles ---------- */
.wpcf7 fieldset.hidden-fields-container { display: none; border: 0; padding: 0; margin: 0; }
.wpcf7 form > p:empty, .wpcf7 .vm-row > br { display: none; }


/* ---------- Colonnes fixes des grilles ---------- */
.vm-cards { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
.vm-photos { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
.vm-presse { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
.vm-fam .wp-block-image, .vm-fam .wp-block-image a { display: block; width: 100%; }
.vm-fam .wp-block-image img { width: 100% !important; height: auto; }
@media (max-width: 1000px) { .vm-cards { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 600px) {
	.vm-cards, .vm-presse { grid-template-columns: minmax(0, 1fr) !important; }
	.vm-photos { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
.vm-contact-infos strong + br { display: none; }

/* ---------- Galerie avant / après ---------- */
.vm-gal-fam h2 { margin: 0 0 1.6rem; padding-bottom: .8rem; border-bottom: 1px solid var(--vm-trait); }
.vm-gal-thumbs { gap: 4px !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
.vm-gal-thumbs .wp-block-image { margin: 0; }
.vm-gal-thumbs img { width: 100%; aspect-ratio: 3/4; object-fit: cover; display: block; border-radius: 0 !important; }
.vm-gal-card .vm-gal-thumbs { border-radius: var(--vm-r); overflow: hidden; }
.vm-gal { gap: 1rem 1rem !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; align-items: start; }
.vm-gal .wp-block-image { margin: 0; }
.vm-gal img { width: 100%; height: auto; display: block; }