/* accueil-v2 : vidéo arrondie, chien sur « MOUSTACHE », blocs « Notre concept » réorganisés. */

/* Vidéo YouTube : le cadre coupe les coins (Safari ignore border-radius sur une iframe seule). */
.mt-video {
	display: inline-block;
	max-width: 100%;
	border-radius: 28px;
	overflow: hidden;
	line-height: 0;
	isolation: isolate;
	-webkit-mask-image: -webkit-radial-gradient(white, black);
	box-shadow: 0 18px 40px -18px rgba(25, 25, 25, .45);
}
.mt-video iframe { display: block; max-width: 100%; border-radius: 0 !important; }

/* Chien qui saute sur les lettres du titre. */
.mt-title { position: relative; display: inline-block; }
.mt-dog {
	position: absolute;
	left: 0;
	top: 0;
	width: 12%;
	pointer-events: none;
	opacity: 0;
	transform-origin: 50% 100%;
	filter: drop-shadow(0 0 6px rgba(255, 255, 255, .85));
	will-change: transform, opacity;
}
.mt-dog svg { display: block; width: 100%; height: auto; overflow: visible; }
.mt-dog .mt-legs-jump { display: none; }
.mt-dog.is-air .mt-legs-jump { display: inline; }
.mt-dog.is-air .mt-legs-stand { display: none; }
.mt-spark {
	position: absolute;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 0 8px 2px rgba(255, 255, 255, .9);
	pointer-events: none;
}

/* « Notre concept » : mosaïque au lieu de 4 colonnes égales.
   Horaires (bleu) en haut sur toute la hauteur à gauche, Localisation (orange) en large,
   Contact (vert) et Prestations (jaune) côte à côte en dessous. */
.mt-concept .bt_bb_row_holder {
	display: grid !important;
	grid-template-columns: 1.05fr 1fr 1fr;
	grid-template-rows: auto auto;
	gap: 26px;
	margin: 0 !important;
}
.mt-concept .bt_bb_row_holder > .bt_bb_column {
	width: auto !important;
	max-width: none !important;
	flex: none !important;
	padding: 0 !important;
}
.mt-concept .bt_bb_column_content,
.mt-concept .bt_bb_column_content_inner { height: 100%; }
.mt-concept .bt_bb_column_content_inner { display: flex; flex-direction: column; }
.mt-concept .bt_bb_column_content_inner > .bt_bb_separator { display: none; }
.mt-concept .bt_bb_card {
	flex: 1;
	height: 100%;
	border-radius: 30px;
	background-size: cover !important;
	background-position: center !important;
	transition: transform .35s ease, box-shadow .35s ease;
	box-shadow: 0 16px 34px -20px rgba(25, 25, 25, .35);
}
.mt-concept .bt_bb_column:not(:nth-child(3)) .bt_bb_card { display: flex; flex-direction: column; }
.mt-concept .bt_bb_column:not(:nth-child(3)) .bt_bb_card_inner_content { margin-top: auto; }
.mt-concept .bt_bb_card:hover { transform: translateY(-8px) rotate(-1deg); box-shadow: 0 26px 44px -22px rgba(25, 25, 25, .45); }

/* Ordre des colonnes dans la page : 1 Localisation, 2 Contact, 3 Horaires, 4 Prestations. */
.mt-concept .bt_bb_column:nth-child(1) { grid-column: 2 / 4; grid-row: 1; }
.mt-concept .bt_bb_column:nth-child(2) { grid-column: 2; grid-row: 2; }
.mt-concept .bt_bb_column:nth-child(3) { grid-column: 1; grid-row: 1 / 3; }
.mt-concept .bt_bb_column:nth-child(4) { grid-column: 3; grid-row: 2; }

/* Localisation en large : icône et texte côte à côte. */
.mt-concept .bt_bb_column:nth-child(1) .bt_bb_card_content {
	display: grid;
	grid-template-columns: auto 1fr;
	column-gap: 22px;
	align-items: center;
	text-align: left;
}
.mt-concept .bt_bb_column:nth-child(1) .bt_bb_card_icon { grid-row: 1 / 3; margin: 0 !important; }
.mt-concept .bt_bb_column:nth-child(1) .bt_bb_card_title { margin-top: 0 !important; }

/* Horaires en hauteur : contenu centré verticalement, texte un peu plus grand. */
.mt-concept .bt_bb_column:nth-child(3) .bt_bb_card { display: flex; flex-direction: column; justify-content: center; }
.mt-concept .bt_bb_column:nth-child(3) .bt_bb_card_text { font-size: 1.15em; line-height: 1.8; }

@media (max-width: 1199px) {
	.mt-concept .bt_bb_row_holder { grid-template-columns: 1fr 1fr; }
	.mt-concept .bt_bb_column:nth-child(1) { grid-column: 1 / 3; grid-row: 1; }
	.mt-concept .bt_bb_column:nth-child(3) { grid-column: 1; grid-row: 2 / 4; }
	.mt-concept .bt_bb_column:nth-child(2) { grid-column: 2; grid-row: 2; }
	.mt-concept .bt_bb_column:nth-child(4) { grid-column: 2; grid-row: 3; }
}

/* « TOILETTAGE & BOUTIQUE » caché jusqu'à son animation (affiché d'office après 3 s si le script ne tourne pas). */
#tittle { visibility: hidden; animation: mt-show 0s 3s forwards; }
#tittle.mt-ready { visibility: visible; animation: none; }
#tittle .mt-ch { display: inline-block; white-space: pre; }
@keyframes mt-show { to { visibility: visible; } }

@media (prefers-reduced-motion: reduce) {
	#tittle { visibility: visible; animation: none; }
	.mt-dog, .mt-spark { display: none; }
	.mt-concept .bt_bb_card { transition: none; }
}

/* Le bloc image du thème (overflow: hidden) ne doit pas couper le chien en plein saut. */
.mt-title-box { overflow: visible !important; }
/* Calque des lettres découpées, superposé à l'image d'origine (gardée pour la mise en page et l'alt). */
.mt-letters { position: absolute; pointer-events: none; }
.mt-letter { position: absolute; top: 0; height: 100%; overflow: hidden; will-change: transform; }
.mt-letter img { position: absolute; top: 0; height: 100%; max-width: none !important; }
.mt-title img.mt-hidden { opacity: 0; }
