/*
Theme Name: Zourit
Theme URI: https://zourit.net
Author: Gwendoline pour Zourit / Ceméa
Description: Thème de blocs pour Zourit.net — reconstruction sans constructeur de pages.
Version: 1.7.4
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 8.1
License: GPLv3
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: zourit
Tags: block-theme, one-column, custom-colors, custom-typography
*/

/* ---------- base ---------- */
html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

/* ---------- en-tête ---------- */
.za-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background-image: linear-gradient(40deg, #426589 0%, #ad0c78 100%);
	box-shadow: 0 2px 12px rgba(60, 10, 45, .18);
}
.admin-bar .za-header { top: 32px; }
.za-header__inner {
	display: flex;
	align-items: center;
	gap: clamp(1rem, 3vw, 2.5rem);
	max-width: 1180px;
	margin: 0 auto;
	padding: .7rem 1.25rem;
	flex-wrap: wrap;
}
.za-brand { display: flex; align-items: center; gap: .65rem; text-decoration: none; }
.za-brand img { height: 44px; width: auto; display: block; }
.za-brand span {
	font-family: var(--wp--preset--font-family--ubuntu);
	font-weight: 700;
	font-size: 1.15rem;
	color: #fff;
	letter-spacing: .01em;
}
.za-nav { margin-left: 0; }
/* aérer les entrées du menu */
.za-nav .wp-block-navigation__container {
	gap: clamp(1.2rem, 2.4vw, 2.4rem) !important;
	row-gap: 1rem !important;
}
.za-nav .wp-block-navigation-item__content { padding-block: .25rem; }
.za-nav a,
.za-nav .wp-block-navigation-item__content {
	color: #fff;
	text-decoration: none;
	opacity: .93;
}
.za-nav a:hover,
.za-nav .wp-block-navigation-item__content:hover { opacity: 1; text-decoration: underline; text-underline-offset: .35em; }
.za-nav .wp-block-navigation-item__content.wp-block-navigation-item__content { color: #fff; }
.za-nav .wp-block-navigation__responsive-container-open,
.za-nav .wp-block-navigation__responsive-container-close { color: #fff; }
.za-connect { margin: 0 0 0 auto; }
.za-connect .wp-block-button__link {
	background: #fff;
	color: #ad0c78;
	font-size: .95rem;
	padding: .6rem 1.3rem;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .12);
}
.za-connect .wp-block-button__link:hover { background: #f6f2f4; color: #a90071; }

/* ---------- héros ---------- */
.za-hero {
	background-image: linear-gradient(40deg, #426589 0%, #ad0c78 100%);
	color: #fff;
	padding: clamp(2.5rem, 6vw, 5rem) 1.25rem;
	position: relative;
	overflow: hidden;
}
.za-hero::after {
	content: "";
	position: absolute;
	right: -12vw;
	bottom: -22vw;
	width: 46vw;
	height: 46vw;
	border-radius: 50%;
	background: rgba(255, 255, 255, .06);
	pointer-events: none;
}
.za-hero__grid {
	display: grid;
	grid-template-columns: minmax(180px, 320px) 1fr;
	gap: clamp(1.5rem, 5vw, 4rem);
	align-items: center;
	max-width: 1180px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}
.za-hero h1, .za-hero h2 { color: #fff; }
.za-hero p { color: rgba(255, 255, 255, .92); }
.za-hero__logo img { width: 100%; max-width: 320px; margin: 0 auto; display: block; filter: drop-shadow(0 12px 30px rgba(0, 0, 0, .18)); }
.za-hero .wp-block-buttons { margin-top: 1.6rem; }
.za-hero .wp-block-button__link {
	background: #fff;
	color: #a90071;
	font-weight: 700;
	box-shadow: 0 6px 22px rgba(0, 0, 0, .22);
}
.za-hero .wp-block-button__link:hover { background: #f6f2f4; color: #000; }
.za-lede { font-size: clamp(1.1rem, 1.5vw, 1.3rem); line-height: 1.65; }

/* ---------- sections ---------- */
.za-section { padding: clamp(2.5rem, 6vw, 5rem) 1.25rem; }
.za-section--serre { padding-top: clamp(1.5rem, 3vw, 2.5rem); padding-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.za-section--clair { background: #f6f2f4; }
.za-section--magenta {
	background-image: linear-gradient(40deg, #426589 0%, #ad0c78 100%);
	color: #fff;
}
.za-section--magenta h2, .za-section--magenta h3 { color: #fff; }
.za-section__inner { max-width: 1180px; margin: 0 auto; }
.za-section__inner--texte { max-width: 760px; margin: 0 auto; }
.za-section h2 { margin-top: 0; }

/* ---------- cartes services ---------- */
.za-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(258px, 1fr));
	gap: clamp(1rem, 2vw, 1.75rem);
	margin-top: 2.5rem;
}
.za-card {
	background: #fff;
	border: 1px solid #e6dfe3;
	border-radius: 18px;
	padding: clamp(1.25rem, 2vw, 1.85rem);
	box-shadow: 0 10px 30px rgba(70, 20, 55, .05);
	transition: transform .18s ease, box-shadow .18s ease;
	display: flex;
	flex-direction: column;
	gap: .6rem;
}
.za-card:hover { transform: translateY(-3px); box-shadow: 0 16px 38px rgba(70, 20, 55, .1); }
.za-card img, .za-card .za-card__icon { width: 54px; height: 54px; object-fit: contain; margin: 0 0 .4rem; }
.za-card h3 { margin: 0; font-size: 1.15rem; }
.za-card p { margin: 0; font-size: .98rem; color: #54595f; line-height: 1.6; }

/* ---------- valeurs ---------- */
.za-valeurs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	max-width: 980px;
	margin-left: auto;
	margin-right: auto;
	gap: clamp(1.5rem, 4vw, 3rem);
	margin-top: 2.5rem;
	text-align: center;
}
.za-valeur h3 { font-size: 1.15rem; margin: .9rem 0 .5rem; }
.za-valeur p { color: rgba(255, 255, 255, .9); font-size: .97rem; margin: 0; }
.za-valeur__icone {
	width: 56px; height: 56px; margin: 0 auto;
	display: grid; place-items: center;
	border-radius: 50%;
	background: rgba(255, 255, 255, .14);
}
.za-valeur__icone svg { width: 28px; height: 28px; fill: #fff; }

/* ---------- tarifs ---------- */
.za-tarifs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 1.25rem;
	margin-top: 2rem;
	align-items: stretch;
}
.za-tarif {
	background: #fff;
	border: 1px solid #e6dfe3;
	border-radius: 18px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: 0 10px 30px rgba(70, 20, 55, .06);
}
.za-tarif__entete { background: #ad0c78; color: #fff; padding: 1.1rem 1.25rem; text-align: center; }
.za-tarif__entete h3 { color: #fff; margin: 0; font-size: 1.05rem; }
.za-tarif__prix { font-family: var(--wp--preset--font-family--ubuntu); font-size: 2.1rem; font-weight: 700; line-height: 1.1; margin: .5rem 0 0; }
.za-tarif__prix small { font-size: .8rem; font-weight: 400; display: block; opacity: .9; }
.za-tarif ul { margin: 0; padding: 1.1rem 1.25rem 1.1rem 2.3rem; font-size: .95rem; color: #54595f; flex: 1; }
.za-tarif li { margin-bottom: .45rem; }
.za-tarif__pied { padding: 0 1.25rem 1.25rem; }
.za-tarif__pied .wp-block-button__link { font-size: .9rem; padding: .55rem 1.1rem; }

/* ---------- encarts ---------- */
.za-encart {
	border-left: 4px solid #ad0c78;
	background: #f6f2f4;
	border-radius: 0 14px 14px 0;
	padding: 1.25rem 1.5rem;
	margin: 2rem 0;
}
.za-encart p:last-child { margin-bottom: 0; }
.za-annonce {
	background: #fff;
	border: 2px solid #ad0c78;
	border-radius: 18px;
	padding: clamp(1.25rem, 3vw, 2rem);
	margin: 2rem 0;
}
.za-annonce h3 { margin-top: 0; color: #ad0c78; }

/* ---------- vidéo ---------- */
.za-video { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; border-radius: 18px; box-shadow: 0 18px 44px rgba(70, 20, 55, .16); margin: 2rem 0; }
.za-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ---------- logos partenaires ---------- */
.za-partenaires { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: clamp(2rem, 5vw, 4rem); max-width: 1180px; margin: 2.5rem auto 0; }
.za-partenaires img { max-height: 76px; width: auto; }
.za-partenaire { text-align: center; }
.za-partenaire p { font-size: .85rem; text-transform: uppercase; letter-spacing: .06em; color: #54595f; margin: .8rem 0 0; }

/* ---------- formulaire de contact ---------- */
.za-form { max-width: 760px; margin: 0 auto; display: grid; gap: 1rem; grid-template-columns: 1fr 1fr; }
.za-form .za-champ--large { grid-column: 1 / -1; }
.za-form label { display: block; font-family: var(--wp--preset--font-family--ubuntu); font-size: .9rem; font-weight: 500; margin-bottom: .35rem; color: #231f22; }
.za-form input, .za-form textarea {
	box-sizing: border-box;
	max-width: 100%;
	width: 100%;
	padding: .75rem .9rem;
	border: 1px solid #cfc4ca;
	border-radius: 10px;
	font-family: inherit;
	font-size: 1rem;
	background: #fff;
	color: #231f22;
}
.za-form input:focus, .za-form textarea:focus { outline: 2px solid #ad0c78; outline-offset: 1px; border-color: #ad0c78; }
.za-form textarea { min-height: 170px; resize: vertical; }
.za-form button { justify-self: start; cursor: pointer; border: 0; border-radius: 100px; background: #ad0c78; color: #fff; font-family: var(--wp--preset--font-family--ubuntu); font-size: 1rem; font-weight: 500; padding: .8rem 1.9rem; }
.za-form button:hover { background: #a90071; }
.za-form__message { grid-column: 1 / -1; padding: 1rem 1.25rem; border-radius: 12px; font-size: .97rem; }
.za-form__message--ok { background: #eaf4dc; border: 1px solid #97c039; color: #3d5216; }
.za-form__message--erreur { background: #fbe9ef; border: 1px solid #ad0c78; color: #7a0a55; }
.za-cache { position: absolute; left: -9999px; }

/* ---------- pied de page ---------- */
.za-footer {
	background: #231f22;
	padding: clamp(2.5rem, 5vw, 3.75rem) 1.25rem;
}
.za-footer__liens {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.75rem 3rem;
	max-width: 900px;
	margin: 0 auto;
}
.za-footer__colonne { text-align: center; }
.za-footer__colonne ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .9rem; }
.za-footer a { color: #fff; text-decoration: none; opacity: .82; font-size: .97rem; }
.za-footer a:hover { opacity: 1; text-decoration: underline; text-underline-offset: .3em; }

/* ---------- contenus éditoriaux ---------- */
.za-page__entete {
	background-image: linear-gradient(40deg, #426589 0%, #ad0c78 100%);
	padding: clamp(2rem, 5vw, 3.5rem) 1.25rem;
}
.za-page__entete .wp-block-post-title {
	color: #fff;
	margin: 0 auto;
	max-width: 1180px;
	font-size: clamp(2rem, 4vw, 3rem);
}
.za-article { padding: clamp(2rem, 4vw, 3.5rem) 1.25rem; }
.za-article > * { max-width: 780px; margin-left: auto; margin-right: auto; }
.za-article h2 { margin-top: 2.4rem; }
.za-article h3 { margin-top: 1.9rem; }
.za-article ul, .za-article ol { padding-left: 1.35rem; }
.za-article li { margin-bottom: .4rem; }
.za-fil { font-size: .85rem; color: #857c81; letter-spacing: .04em; text-transform: uppercase; margin-bottom: .5rem; }

/* ---------- adaptatif ---------- */
@media (max-width: 900px) {
	.za-footer__liens { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.za-hero__grid { grid-template-columns: 1fr; text-align: left; }
	.za-hero__logo { order: -1; }
	.za-hero__logo img { max-width: 190px; margin: 0; }
	.za-header__inner { gap: .75rem; justify-content: space-between; }
	.za-nav { order: 1; width: auto; margin-left: 0; }
	.za-connect { order: 2; margin-left: 0; }
}
@media (max-width: 600px) {
	.za-footer__liens { grid-template-columns: 1fr; gap: 1.25rem; }
	.za-form { grid-template-columns: 1fr; }
	.za-brand span { font-size: 1rem; }
	.za-hero { padding-top: 2rem; }
}

/* ---------- ajustements de structure ---------- */
/* WordPress pose un margin-block-start sur les enfants successifs des groupes :
   dans une grille, cela décale toutes les cellules sauf la première. */
.za-cards > *, .za-tarifs > *, .za-tarif > *, .za-valeurs > *, .za-galerie > *,
.za-partenaires > *, .za-hero__grid > *, .za-footer__liens > * { margin-block-start: 0 !important; }
/* pas de respiration entre l'en-tête collé et la première section :
   le décalage vient du margin-block-start que WordPress pose sur le conteneur main */
main.wp-block-group, .za-header { margin-block-start: 0 !important; }
/* WordPress enveloppe les parties de gabarit dans un div qui hérite du block-gap :
   d'où une bande blanche entre le contenu et le pied de page. */
.wp-site-blocks > .wp-block-template-part { margin-block-start: 0 !important; }

/* bouton contour sur fond dégradé */
.za-hero .is-style-outline .wp-block-button__link {
	background: transparent;
	color: #fff;
	border: 2px solid rgba(255, 255, 255, .75);
	box-shadow: none;
}
.za-hero .is-style-outline .wp-block-button__link:hover {
	background: rgba(255, 255, 255, .14);
	color: #fff;
}

/* sections et colonnes du contenu : pas de block-gap entre elles,
   sinon une bande blanche apparaît entre deux fonds différents */
.wp-block-post-content > section,
.wp-block-post-content > .wp-block-columns,
.wp-block-post-content > p:empty { margin-block-start: 0 !important; }
.wp-block-post-content > p:empty { display: none; }

/* bande des logos partenaires : la couleur reste pleine largeur,
   c'est le contenu qui reçoit un padding latéral pour se resserrer.
   !important nécessaire : l'éditeur pose padding-left/right:0 en style inline. */
.wp-block-post-content > .wp-block-columns.has-texte-background-color {
  padding-left: clamp(2rem, 12vw, 12rem) !important;
  padding-right: clamp(2rem, 12vw, 12rem) !important;
}

/* galeries d'images */
.za-galerie {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 1rem;
	margin: 2rem 0;
}
.za-galerie img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 3; border-radius: 14px; }

/* tableaux */
.wp-block-table table { border-collapse: collapse; width: 100%; font-size: .97rem; }
.wp-block-table td, .wp-block-table th { border: 1px solid #e6dfe3; padding: .7rem .9rem; vertical-align: top; }
.wp-block-table tr:nth-child(odd) td { background: #faf8f9; }

/* citations et code */
.wp-block-quote { border-left: 4px solid #ad0c78; padding-left: 1.2rem; font-style: italic; }
code { background: #f6f2f4; padding: .1em .35em; border-radius: 5px; font-size: .92em; }

/* titres des tarifs en petit */
.za-tarif__entete h3 small { font-size: .8rem; font-weight: 400; opacity: .9; }