/* H Conseil – Widget Hero (repris de la maquette, préfixé hch-) */
.hch {
	position: relative; height: clamp(620px, 52vw, 900px); overflow: hidden; background: #6d8fb5;
	color: #fff; isolation: isolate;
}
.hch-full { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.hch-img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover; object-position: 70% 50%; z-index: 0; }
.hch-houle .hch-img { animation: hch-houle 18s ease-in-out infinite alternate; }
@keyframes hch-houle { from { transform: scale(1.02) translateY(0); } to { transform: scale(1.05) translateY(-8px); } }
.hch::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(100deg, rgba(18,40,60,.35), rgba(18,40,60,0) 55%); pointer-events: none; }
.hch::after { content: ""; position: absolute; inset: 0; z-index: 2; background: rgba(12,28,20,.55); opacity: 0; transition: opacity .45s; pointer-events: none; }
.hch-voile.is-dim::after { opacity: 1; }
.hch-voile.is-dim .hch-bulles { opacity: .25; }
.hch-bulles, .hch-titre { transition: opacity .45s; }

/* Logo */
.hch-logo { position: absolute; z-index: 5; left: clamp(16px, 3.4vw, 66px); top: 32px; display: block; line-height: 0; }
.hch-logo img { width: 135px; height: auto; filter: drop-shadow(0 2px 6px rgba(0,0,0,.2)); }

/* Titre + description */
.hch-titre { position: absolute; z-index: 4; pointer-events: none; left: clamp(16px, 5.5vw, 108px); top: clamp(190px, 12.5vw, 245px); max-width: min(900px, 62vw); }
.hch-titre .hch-h, .hch-plus { pointer-events: auto; }
.hch-titre .hch-h {
	display: inline; margin: 0; padding: 0; color: #fff;
	font: 300 clamp(34px, 3.9vw, 62px)/1 var(--hcw-display); letter-spacing: .01em; text-transform: uppercase;
	text-shadow: 0 2px 18px rgba(0,0,0,.25);
}
.hch-plus {
	display: inline-grid; place-items: center; width: 38px; height: 38px; margin-left: 6px; padding: 0; border: 0; border-radius: 50%;
	background: var(--hcw-vert); color: #fff; font: 400 30px/1 var(--hcw-display); vertical-align: top;
	transform: translateY(-14px); transition: transform .35s, background .2s; box-shadow: 0 4px 14px rgba(0,0,0,.2);
}
.hch-titre:hover .hch-plus, .hch-titre.is-open .hch-plus { transform: translateY(-14px) rotate(45deg); background: var(--hcw-vert-profond); }
.hch-desc {
	max-width: 560px; margin-top: 18px; color: #fff; font: 300 clamp(17px, 1.3vw, 21px)/1.5 var(--hcw-body);
	text-shadow: 0 1px 12px rgba(0,0,0,.35); opacity: 0; transform: translateY(-8px); pointer-events: none; transition: opacity .35s, transform .35s;
}
.hch-desc p { margin: 0 0 .6em; }
.hch-titre:hover .hch-desc, .hch-titre.is-open .hch-desc, .hch-titre:focus-within .hch-desc { opacity: 1; transform: none; pointer-events: auto; }

/* Bulles */
.hch-bulles { position: absolute; z-index: 4; pointer-events: none; left: clamp(16px, 12vw, 240px); top: clamp(310px, 18vw, 350px); display: flex; align-items: center; gap: 30px; }
.hch-bulle {
	--hch-zoom: 1.14;
	pointer-events: auto; position: relative; display: grid; place-items: center; width: clamp(220px, 15vw, 290px); aspect-ratio: 1;
	border-radius: 50%; background: var(--hcw-vert); color: #fff !important; text-align: center; text-decoration: none !important;
	transition: transform .5s cubic-bezier(.3,1.5,.5,1), box-shadow .4s; isolation: isolate;
}
.hch-bulle::before, .hch-bulle::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid rgba(255,255,255,.7); z-index: -1; opacity: 0; transform: scale(.9); }
.hch-bulle:hover::before, .hch-bulle:focus-visible::before { animation: hcw-onde 1.6s ease-out infinite; }
.hch-bulle:hover::after, .hch-bulle:focus-visible::after { animation: hcw-onde 1.6s .8s ease-out infinite; }
.hch-bulle:hover, .hch-bulle:focus-visible { transform: scale(var(--hch-zoom)); box-shadow: 0 30px 60px rgba(20,60,20,.35); z-index: 2; }
.hch-bulle-in { display: block; padding: 0 11%; }
.hch-lab { display: block; font: 400 clamp(26px, 1.8vw, 34px)/1 var(--hcw-display); letter-spacing: .02em; }
.hch-cross { display: block; margin-top: 4px; font: 200 44px/1 var(--hcw-display); transition: transform .5s; }
.hch-bulle:hover .hch-cross { transform: rotate(90deg); }
.hch-txt { display: block; margin-top: 10px; font-weight: 400; font-size: clamp(14px, 1vw, 17px); line-height: 1.35; }
.hch-more {
	display: block; max-height: 0; overflow: hidden; opacity: 0; font-size: 13px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
	transition: max-height .45s, opacity .45s, margin .45s;
}
.hch-bulle:hover .hch-more, .hch-bulle:focus-visible .hch-more { max-height: 80px; opacity: 1; margin-top: 10px; }

/* Vagues papier */
.hch-vagues { position: absolute; left: 0; right: 0; bottom: -2px; z-index: 4; height: clamp(120px, 15vw, 240px); pointer-events: none; }
.hch-vagues svg { position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; overflow: visible; }
.hch-v1 { filter: drop-shadow(-4px -8px 16px rgba(20,30,25,.15)); animation: hch-derive 14s ease-in-out infinite alternate; }
.hch-v2 { filter: drop-shadow(-2px -5px 9px rgba(20,30,25,.12)); animation: hch-derive 18s ease-in-out infinite alternate-reverse; }
@keyframes hch-derive { from { transform: translateX(0); } to { transform: translateX(-2.5%); } }

/* Mobile */
@media (max-width: 900px) {
	.hch { height: auto; min-height: 0; padding-block: 150px 180px; }
	.hch-titre, .hch-bulles { position: relative; left: auto; top: auto; max-width: none; padding-inline: 16px; }
	.hch-titre { margin-bottom: 26px; }
	.hch-bulles { gap: 14px; flex-wrap: wrap; }
}
@media (max-width: 560px) {
	.hch-bulle { width: min(200px, 44vw); }
}

/* Le hero colle aux bords : on annule la marge interne du conteneur Elementor qui le contient
   (Conteneur classique ou Flexbox d'Elementor 4) et la marge sous le widget. */
.elementor-widget-hc_hero { margin: 0 !important; }
.elementor-widget-hc_hero > .elementor-widget-container { margin: 0 !important; padding: 0 !important; }
.e-con:has(> .elementor-widget-hc_hero),
.e-con:has(> .e-con-inner > .elementor-widget-hc_hero),
.e-flexbox-base:has(> .elementor-widget-hc_hero),
[data-elementor-type] :is(.e-flexbox-base, .e-div-block-base, [data-element_type="e-flexbox"], [data-element_type="e-div-block"]):has(.elementor-widget-hc_hero),
.elementor-section:has(.elementor-widget-hc_hero) > .elementor-container > .elementor-column > .elementor-widget-wrap {
	padding-top: 0 !important; padding-bottom: 0 !important; margin-top: 0 !important;
	--padding-top: 0px; --padding-bottom: 0px;
}