/*
Theme Name: CCOM' agency — Child
Theme URI: https://ccom-agency.fr
Template: ccom-agency
Author: Bruno — CCOM' agency
Author URI: https://ccom-agency.fr
Description: Thème enfant de "CCOM' agency". Toutes les personnalisations spécifiques (overrides de templates, de patterns, de styles, ajouts de fonctions) doivent être faites ici pour ne pas être écrasées lors d'une mise à jour du thème parent.
Version: 1.0.0
Requires at least: 6.7
Tested up to: 7.0
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: ccom-agency-child
Tags: block-templates, full-site-editing
*/

/* === Formulaire de contact === */
.ccom-contact-form { display: flex; flex-direction: column; gap: 20px; }
.ccom-contact-form .ccom-field { display: flex; flex-direction: column; gap: 6px; }
.ccom-contact-form .ccom-field-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
@media (max-width: 600px) {
	.ccom-contact-form .ccom-field-row { grid-template-columns: 1fr; }
}
.ccom-contact-form label {
	font-size: 13px;
	font-weight: 500;
	color: var(--wp--preset--color--navy);
	letter-spacing: 0.02em;
}
.ccom-contact-form label span[aria-hidden] {
	color: var(--wp--preset--color--orange);
	margin-left: 2px;
}
.ccom-contact-form input,
.ccom-contact-form select,
.ccom-contact-form textarea {
	font-family: var(--wp--preset--font-family--inter);
	font-size: 15px;
	color: var(--wp--preset--color--navy);
	background: #fff;
	border: 0.5px solid rgba(80, 111, 131, 0.3);
	border-radius: 2px;
	padding: 12px 14px;
	width: 100%;
	box-sizing: border-box;
	transition: border-color 0.15s ease;
}
.ccom-contact-form input:focus,
.ccom-contact-form select:focus,
.ccom-contact-form textarea:focus {
	border-color: var(--wp--preset--color--orange);
	outline: none;
}
.ccom-contact-form textarea { resize: vertical; min-height: 120px; }
.ccom-contact-form select { cursor: pointer; }
.ccom-contact-submit {
	font-family: var(--wp--preset--font-family--inter);
	font-size: 14px;
	font-weight: 500;
	background: var(--wp--preset--color--orange);
	color: #fff;
	border: none;
	border-radius: 2px;
	padding: 14px 28px;
	cursor: pointer;
	align-self: flex-start;
	transition: background 0.15s ease, transform 0.15s ease;
}
.ccom-contact-submit:hover {
	background: var(--wp--preset--color--orange-hover, #c46300);
	transform: translateY(-1px);
}
.ccom-form-note {
	font-size: 12px;
	line-height: 1.5;
	color: var(--wp--preset--color--slate);
	opacity: 0.75;
	margin: 0;
}
.ccom-form-note a {
	color: var(--wp--preset--color--orange);
	text-decoration: underline;
}

/* === Message d'erreur === */
.ccom-form-error {
	background: rgba(196, 99, 0, 0.08);
	border-left: 3px solid var(--wp--preset--color--orange);
	color: var(--wp--preset--color--navy);
	padding: 14px 18px;
	margin-bottom: 24px;
	font-size: 14px;
	line-height: 1.5;
}

/* === Message succès === */
.ccom-form-success {
	text-align: center;
	padding: 40px 20px;
}
.ccom-form-success h2 {
	font-family: var(--wp--preset--font-family--fraunces) !important;
	font-size: 36px !important;
	font-weight: 500 !important;
	color: var(--wp--preset--color--navy) !important;
	letter-spacing: -0.02em;
	margin: 0 0 16px !important;
}
.ccom-form-success p {
	font-size: 17px;
	line-height: 1.6;
	color: var(--wp--preset--color--slate);
	margin: 0;
}

/* === Bloc coordonnées directes (colonne droite) === */
.ccom-contact-direct .ccom-contact-label {
	font-size: 11px !important;
	letter-spacing: 0.16em !important;
	text-transform: uppercase !important;
	color: var(--wp--preset--color--orange) !important;
	font-weight: 500 !important;
	margin: 0 0 6px !important;
}
.ccom-contact-direct .ccom-contact-value {
	font-size: 16px !important;
	color: var(--wp--preset--color--navy) !important;
	margin: 0 0 24px !important;
}
.ccom-contact-direct .ccom-contact-value a {
	color: var(--wp--preset--color--navy);
	text-decoration: none;
	border-bottom: 1px solid rgba(80, 111, 131, 0.3);
	transition: border-color 0.15s ease, color 0.15s ease;
}
.ccom-contact-direct .ccom-contact-value a:hover {
	color: var(--wp--preset--color--orange);
	border-bottom-color: var(--wp--preset--color--orange);
}

/* === Styles cards Réalisations === */
.ccom-card {
	background: #ffffff;
	border: 0.5px solid rgba(80, 111, 131, 0.2);
	border-radius: 2px;
	padding: 32px 28px;
	transition: border-color 0.2s, transform 0.2s;
}
.ccom-card:hover {
	border-color: var(--wp--preset--color--orange);
	transform: translateY(-2px);
}
.ccom-tag {
	font-size: 11px !important;
	letter-spacing: 0.16em !important;
	text-transform: uppercase !important;
	color: var(--wp--preset--color--orange) !important;
	font-weight: 500 !important;
	margin: 0 0 14px !important;
}
.ccom-card-meta {
	font-size: 13px !important;
	color: var(--wp--preset--color--slate) !important;
	opacity: 0.75;
	padding-top: 18px;
	border-top: 0.5px solid rgba(80, 111, 131, 0.15);
	margin: auto 0 0 !important;
}
.ccom-card-meta a {
	color: var(--wp--preset--color--orange) !important;
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: border-color 0.15s ease;
}
.ccom-card-meta a:hover {
	border-bottom-color: var(--wp--preset--color--orange);
}

/* === Anti margin-block-start 24px === */
.ccom-card + .ccom-card {
	margin-block-start: 0 !important;
}
main.wp-block-group > * + * {
	margin-block-start: 0 !important;
}

/* === Pictos des piliers Communication / Conseil === */
.ccom-pillar-icon {
	width: 36px;
	height: 36px;
	flex-shrink: 0;
	color: var(--wp--preset--color--orange);
	display: block;
}

/* === Pictos Communication / Conseil (CSS pur, indépendant du PHP) === */

/* On masque les badges "C" textuels d'origine */
.ccom-badge {
	display: none !important;
}

/* Le H2 devient un flex container pour aligner picto + texte */
#communication > .wp-block-group h2.wp-block-heading,
#conseil > .wp-block-group h2.wp-block-heading {
	display: flex;
	align-items: center;
	gap: 14px;
}

/* Picto Communication : bulle de dialogue */
#communication > .wp-block-group h2.wp-block-heading::before {
	content: "";
	width: 36px;
	height: 36px;
	flex-shrink: 0;
	background-repeat: no-repeat;
	background-size: contain;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%23E16820' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M5 8 a3 3 0 0 1 3-3 h16 a3 3 0 0 1 3 3 v11 a3 3 0 0 1 -3 3 h-8 l-6 5 v-5 h-2 a3 3 0 0 1 -3-3 z'/></svg>");
}

/* Picto Conseil : boussole nord-sud */
#conseil > .wp-block-group h2.wp-block-heading::before {
	content: "";
	width: 36px;
	height: 36px;
	flex-shrink: 0;
	background-repeat: no-repeat;
	background-size: contain;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%23E16820' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><circle cx='16' cy='16' r='11'/><path d='M16 7 L19 14 L16 16 L13 14 Z' fill='%23E16820' stroke='none'/><path d='M16 25 L19 18 L16 16 L13 18 Z'/></svg>");
}

/* === Texte justifié dans le contenu principal === */
main p {
	text-align: justify;
}

/* Éléments d'interface : restent à gauche */
main p.ccom-tag,
main p.ccom-card-meta,
main p.ccom-eyebrow,
main p.ccom-eyebrow-lg,
main p.ccom-page-lede,
main p.ccom-cta-lede,
main p.ccom-form-note,
main p.ccom-contact-label,
main p.ccom-contact-value {
	text-align: left;
}

/* === Téléphone du footer ===
   À AJOUTER À LA FIN de wp-content/themes/ccom-agency-child/style.css
*/
.ccom-footer-phone {
	font-size: 14.3px !important;
	color: rgba(255, 255, 255, 0.85) !important;
	margin: 14px 0 0 11px !important;
	font-style: normal !important;
}
.ccom-footer-phone a {
	color: rgba(255, 255, 255, 0.85) !important;
	text-decoration: none;
	border-bottom: 1px solid rgba(255, 255, 255, 0.3);
	transition: border-color 0.15s ease, color 0.15s ease;
}
.ccom-footer-phone a:hover {
	border-bottom-color: var(--wp--preset--color--orange);
	color: var(--wp--preset--color--orange) !important;
}

/* === Mail général dans le footer ===
   À AJOUTER À LA FIN de wp-content/themes/ccom-agency-child/style.css
   (en complément du CSS du téléphone déjà en place — que tu as ajusté à 14.2px)
*/
.ccom-footer-mail {
	font-size: 13.1px !important;
	color: rgba(255, 255, 255, 0.85) !important;
	margin: 6px 0 0 11px !important;
	font-style: normal !important;
}
.ccom-footer-mail a {
	color: rgba(255, 255, 255, 0.85) !important;
	text-decoration: none;
	border-bottom: 1px solid rgba(255, 255, 255, 0.3);
	transition: border-color 0.15s ease, color 0.15s ease;
}
.ccom-footer-mail a:hover {
	border-bottom-color: var(--wp--preset--color--orange);
	color: var(--wp--preset--color--orange) !important;
}