/*
 * Composants partagés des 7 pages "Location photobooth [ville]"
 * (page-location-photobooth-{slug}.php). Réutilise au maximum le
 * vocabulaire déjà en place (.md-card, .md-faq, .md-cta-banner, tokens.css)
 * plutôt que d'inventer un nouveau langage — seuls les motifs propres à une
 * page produit/ville (bandeau de stats sobre, forfaits, lieux de réception,
 * process, maillage) sont ajoutés ici.
 *
 * Direction : sobriété façon tesla.com/fr_fr/megapack (grandes photos
 * pleine largeur, bandeau de chiffres nus sans carte, beaucoup de blanc)
 * appliquée à la charte Médian (indigo/crème/DM Sans, zéro emoji — les
 * anciennes versions Elementor de ces pages étaient truffées d'emoji,
 * retirés lors de la reprise). Desktop uniquement pour l'instant, comme le
 * reste du thème.
 */

/* ============ BANDEAU STATS (sobre, sans carte — écart volontaire avec
   .md-why-stat de la home qui est en carte : cette variante "nue" évite
   que les 7 pages ville se lisent comme un simple clone de la home). ============ */
.md-stat-strip {
	max-width: 1104px;
	margin: 0 auto;
	background: var(--md-white);
	border: 1px solid var(--md-line);
	border-radius: var(--md-radius-card);
	display: grid;
	/* 2 colonnes sous 640px (audit responsive 2026-09-01) : en repeat(4, 1fr)
	   fixe sans palier mobile, les libellés/chiffres un peu longs ("Jusqu'à
	   450", "Cadres décoratifs"...) dépassaient leur piste de grille et
	   provoquaient un débordement horizontal de toute la page à 375px —
	   aucune des 7 pages ville qui utilisent ce composant n'était épargnée. */
	grid-template-columns: repeat(2, 1fr);
}

@media (min-width: 640px) {
	.md-stat-strip {
		grid-template-columns: repeat(4, 1fr);
	}
}

.md-stat-strip__item {
	text-align: center;
	padding: 32px 20px;
	border-right: 1px solid var(--md-line);
}

/* Sous 640px (grille 2x2) : le 2e item de chaque paire (nth-child(2n))
   est déjà au bord droit de la grille, son séparateur ne sert à rien.
   Restauré en 4 colonnes desktop par le media query ci-dessous — la
   règle :last-child plus bas reste prioritaire dans les deux cas grâce
   à l'ordre des règles en cascade (spécificité identique, elle vient
   après). */
.md-stat-strip__item:nth-child(2n) {
	border-right: none;
}

@media (min-width: 640px) {
	.md-stat-strip__item:nth-child(2n) {
		border-right: 1px solid var(--md-line);
	}
}

.md-stat-strip__item:last-child {
	border-right: none;
}

.md-stat-strip__num {
	display: block;
	font-size: clamp(26px, 3vw, 34px);
	font-weight: 800;
	color: var(--md-ink);
	line-height: 1;
	margin-bottom: 8px;
}

.md-stat-strip__label {
	font-size: 13.5px;
	font-weight: 600;
	color: #6a6a6a;
}

/* ============ SECTION GÉNÉRIQUE (rythme commun à toutes les sections
   de contenu de la page ville) ============ */
.md-vsec {
	padding: clamp(48px, 7vw, 80px) 24px;
	background: var(--md-cream);
}

.md-vsec--white {
	background: var(--md-white);
}

.md-vsec--dark {
	background: var(--md-ink);
	color: var(--md-white);
}

.md-vsec__header {
	max-width: 720px;
	margin: 0 auto 40px;
}

.md-vsec__header.md-vsec__header--wide {
	max-width: 1104px;
}

.md-vsec__eyebrow {
	display: block;
	text-transform: uppercase;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: var(--md-indigo);
	margin: 0 0 10px;
}

.md-vsec--dark .md-vsec__eyebrow {
	color: rgba(255, 255, 255, 0.7);
}

.md-vsec__header h2 {
	font-size: clamp(26px, 3.5vw, 38px);
	font-weight: 700;
	margin: 0 0 12px;
}

.md-vsec__header p {
	margin: 0;
	font-size: 17px;
	color: #4a4a4a;
	line-height: 1.7;
}

.md-vsec--dark .md-vsec__header p {
	color: rgba(255, 255, 255, 0.75);
}

.md-vsec__inner {
	max-width: 1104px;
	margin: 0 auto;
}

.md-vsec__inner--narrow {
	max-width: 780px;
}

/* ============ INTRO SEO + PETITES CARTES FEATURE (grille 3 col, réutilise
   .md-card mais en variante compacte) ============ */
.md-feature-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
	margin-top: 32px;
}

@media (min-width: 720px) {
	.md-feature-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

.md-feature {
	background: var(--md-white);
	border: 1px solid var(--md-line);
	border-radius: var(--md-radius-card);
	padding: 24px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03), 0 6px 20px rgba(15, 23, 42, 0.05);
}

.md-feature__icon {
	width: 40px;
	height: 40px;
	border-radius: 10px;
	background: var(--md-blue);
	color: var(--md-indigo);
	display: grid;
	place-items: center;
	margin-bottom: 14px;
}

.md-feature__icon svg {
	width: 20px;
	height: 20px;
}

.md-feature h3 {
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 6px;
}

.md-feature p {
	font-size: 14px;
	color: #5a5a5a;
	line-height: 1.6;
	margin: 0;
}

/* ============ LIEUX DE RÉCEPTION — cartes à icône, pas de photo (on
   n'a pas de vraies photos des lieux nommés eux-mêmes, seulement du
   matériel/produit — jamais illustrer un lieu avec une photo qui n'en est
   pas une). ============ */
.md-lieu-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
	margin-top: 32px;
}

@media (min-width: 640px) {
	.md-lieu-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 960px) {
	.md-lieu-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

.md-lieu {
	background: var(--md-white);
	border: 1px solid var(--md-line);
	border-radius: var(--md-radius-card);
	padding: 22px 20px;
}

.md-lieu__icon {
	width: 40px;
	height: 40px;
	border-radius: 10px;
	background: var(--md-blue);
	color: var(--md-indigo);
	display: grid;
	place-items: center;
	margin-bottom: 14px;
}

.md-lieu__icon svg {
	width: 20px;
	height: 20px;
}

.md-lieu__body {
	padding: 0;
}

.md-lieu__tag {
	display: inline-block;
	font-size: 12px; /* 11,5 px avant : aucune police sous 12 px (audit 19 points, 2026-10-11) */
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--md-indigo);
	margin-bottom: 6px;
}

.md-lieu h3 {
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 6px;
}

.md-lieu p {
	font-size: 13.5px;
	color: #5a5a5a;
	line-height: 1.6;
	margin: 0;
}

/* ============ VIDÉOS ============ */
.md-video-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 24px;
	margin-top: 8px;
}

@media (min-width: 760px) {
	.md-video-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	/* Une seule vidéo (depuis le retrait de la vidéo KRUU, 2026-09-23) :
	   elle occupe toute la ligne au lieu de laisser la seconde colonne vide,
	   centrée et bornée à la largeur de l'en-tête de section
	   (.md-vsec__header, 720px) : bords alignés sur le titre, et pas
	   d'écran géant. */
	.md-video-grid > .md-video:only-child {
		grid-column: 1 / -1;
		justify-self: center;
		width: 100%;
		max-width: 720px;
	}
}

.md-video {
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: var(--md-radius-card);
	overflow: hidden;
}

.md-video iframe {
	width: 100%;
	aspect-ratio: 16 / 9;
	display: block;
	border: none;
}

.md-video__caption {
	padding: 14px 18px;
	font-size: 13.5px;
	font-weight: 600;
	color: rgba(255, 255, 255, 0.8);
}

/* ============ FORFAITS ============ */
.md-plans {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
	align-items: start;
	margin-top: 8px;
}

@media (min-width: 860px) {
	.md-plans {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* Swipe horizontal sur mobile plutôt qu'un empilement vertical (2026-09-02,
   demande Damien, "c'est stylé ça") — plusieurs formules à comparer (3
   depuis la grille 2026), la pile verticale demandait beaucoup de défilement
   pour tout parcourir. Même technique déjà éprouvée sur le carrousel
   catalogue de la page d'accueil (.md-catalog__track, assets/css/
   components/carousel.css) : scroll-snap natif, aucun JS. Débordement
   jusqu'au bord de l'écran (marge négative -24px, symétrique au padding
   horizontal de .md-vsec) avec un aperçu de la carte suivante (flex-basis
   85%) pour signaler qu'il y a plus à voir. Desktop (≥860px) inchangé,
   toujours en grille — cette règle ne s'applique qu'en dessous. padding-top
   18px (pas 4px) : overflow-x:auto force overflow-y à "auto" aussi (même
   piège CSS déjà rencontré sur le menu mobile du header) et sans cette
   marge le badge "Le plus choisi" de .md-plan--pop (top:-13px) se ferait
   couper en haut. */
@media (max-width: 859px) {
	.md-plans {
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-padding-left: 24px;
		gap: 16px;
		margin: 8px -24px 0;
		padding: 18px 24px 12px;
	}

	.md-plan {
		flex: 0 0 85%;
		max-width: 340px;
		scroll-snap-align: start;
	}
}

/* Sous 1280px, la formule recommandée (.md-plan--pop, l'Illimitée) passe en
   première carte : dans le swipe mobile elle était troisième, hors écran
   (0.85.1, demande Damien). Ordre visuel seulement, le HTML garde Numérique /
   Essentiel / Illimitée ; à 1280px et plus, l'ordre d'origine revient. */
@media (max-width: 1279px) {
	.md-plans > .md-plan--pop {
		order: -1;
	}
}

/* Variante 4 colonnes, sans usage depuis la grille 2026 (0.85.0 : 3 formules,
   Numérique / Essentiel / Illimitée, dans template-parts/photobooth-formules.php,
   qui emploie .md-plans tel quel). Gardée pour une future grille à 4 cartes. */
.md-plans--4 {
	grid-template-columns: 1fr;
}

@media (min-width: 700px) {
	.md-plans--4 {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1040px) {
	.md-plans--4 {
		grid-template-columns: repeat(4, 1fr);
	}
	.md-plans--4 .md-plan {
		padding: 28px 20px;
	}
}

.md-plan {
	position: relative;
	background: var(--md-white);
	border: 1px solid var(--md-line);
	border-radius: 16px;
	padding: 32px 24px;
}

.md-plan--pop {
	border: 2px solid var(--md-indigo);
}

.md-plan__badge {
	position: absolute;
	top: -13px;
	left: 50%;
	transform: translateX(-50%);
	background: var(--md-indigo);
	color: var(--md-white);
	font-size: 12px; /* 11,5 px avant : aucune police sous 12 px (audit 19 points, 2026-10-11) */
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	padding: 5px 16px;
	border-radius: var(--md-radius-pill);
	white-space: nowrap;
}

.md-plan__name {
	font-size: 22px;
	font-weight: 800;
	margin: 0 0 4px;
}

.md-plan__tag {
	font-size: 13.5px;
	color: #6a6a6a;
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 1px solid var(--md-line);
}

.md-plan__list {
	list-style: none;
	margin: 0 0 28px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.md-plan__list li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--md-ink);
}

.md-plan__list li.is-off {
	color: #5A6178;
}

.md-plan__check {
	flex: none;
	width: 18px;
	height: 18px;
	margin-top: 1px;
	color: var(--md-indigo);
}

.md-plan__list li.is-off .md-plan__check {
	color: #c8c8c8;
}

.md-plan .md-btn {
	display: block;
	text-align: center;
	width: 100%;
}

/* ============ GRILLE TARIFAIRE 2026 (template-parts/photobooth-formules.php, 0.85.0) ============
   Page centrale et 8 pages ville. Cartes blanches à bordure fine, rayon carte, aucun flou ni halo
   (skill median-events-design). */
.md-plan__prix {
	font-size: 32px;
	font-weight: 800;
	color: var(--md-indigo);
	margin: 0 0 4px;
	line-height: 1.2;
}

.md-plan__prix span {
	font-size: 14px;
	font-weight: 600;
	color: #5A6178;
}

.md-plan__plus {
	margin: -12px 0 24px;
	padding: 10px 12px;
	border-radius: 8px;
	background: var(--md-blue);
	color: var(--md-indigo);
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1.45;
}

.md-grille__inclus,
.md-grille__local {
	display: grid;
	grid-template-columns: 1fr;
	gap: 24px;
	align-items: center;
	background: var(--md-white);
	border: 1px solid var(--md-line);
	border-radius: 12px;
	padding: 24px;
	margin: 8px 0 32px;
}

.md-grille__local {
	margin: 32px 0 0;
}

@media (min-width: 860px) {
	.md-grille__inclus {
		grid-template-columns: 1.8fr 1fr;
		padding: 32px;
	}

	.md-grille__local {
		grid-template-columns: 1fr 1.8fr;
		padding: 32px;
	}

	/* Photo à gauche en grand écran, sous le texte sur téléphone (le titre d'abord). */
	.md-grille__local .md-grille__photo {
		order: -1;
	}

	/* Sans photo fournie, rien n'est rendu : le texte prend toute la largeur. */
	.md-grille__inclus.md-grille--sans-photo,
	.md-grille__local.md-grille--sans-photo {
		grid-template-columns: 1fr;
	}
}

.md-grille__titre {
	font-size: 19px;
	font-weight: 700;
	margin: 0 0 14px;
}

.md-grille__liste {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px 24px;
}

@media (min-width: 600px) {
	.md-grille__inclus .md-grille__liste {
		grid-template-columns: repeat(2, 1fr);
	}
}

.md-grille__liste li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--md-ink);
}

.md-grille__options {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
	margin-top: 32px;
}

@media (min-width: 760px) {
	.md-grille__options {
		grid-template-columns: repeat(2, 1fr);
	}
}

.md-grille__carte {
	background: var(--md-white);
	border: 1px solid var(--md-line);
	border-radius: 12px;
	padding: 24px;
}

.md-grille__note {
	margin: 14px 0 0;
	font-size: 13.5px;
	line-height: 1.55;
	color: #5A6178;
}

.md-grille__note--fort {
	color: var(--md-ink);
	font-weight: 700;
}

/* Photo de la grille (template-parts/photobooth-formules.php), rendue seulement quand Damien l'a
   fournie : jamais de cadre vide à l'écran. */
.md-grille__photo {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 10px;
}

/* ============ PERSONNALISATION (2 colonnes : texte+liste vs stat-boxes) ============ */
.md-perso {
	display: grid;
	grid-template-columns: 1fr;
	gap: 40px;
	align-items: center;
}

@media (min-width: 900px) {
	.md-perso {
		grid-template-columns: 1fr 1fr;
	}
}

.md-perso__checklist {
	list-style: none;
	margin: 20px 0 28px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.md-perso__checklist li {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14.5px;
	color: var(--md-ink);
}

.md-perso__checklist svg {
	flex: none;
	width: 16px;
	height: 16px;
	color: var(--md-indigo);
}

.md-perso__boxes {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

/* Photo de la borne en tête de la colonne des encadrés (pages ville, 0.85.6) : toute la largeur des
   deux colonnes de .md-perso__boxes. */
.md-perso__boxes > .md-photo-card {
	grid-column: 1 / -1;
}

.md-perso__box {
	border-radius: 16px;
	padding: 28px 20px;
	text-align: center;
}

.md-perso__box--indigo {
	background: var(--md-indigo);
	color: var(--md-white);
}

.md-perso__box--cream {
	background: var(--md-cream);
	border: 1px solid var(--md-line);
}

.md-perso__box-num {
	display: block;
	font-size: 30px;
	font-weight: 800;
	line-height: 1;
	margin-bottom: 6px;
}

.md-perso__box-label {
	font-size: 12.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.md-perso__box-full {
	grid-column: span 2;
	background: var(--md-white);
	border: 1px solid var(--md-line);
	border-radius: 16px;
	padding: 20px 18px;
	text-align: left;
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.md-perso__box-full svg {
	flex: none;
	width: 22px;
	height: 22px;
	color: var(--md-indigo);
	margin-top: 2px;
}

/* h3 (pas h4) : corrige un saut de hiérarchie de titres (2026-08-31, audit
   SEO/accessibilité) — ce titre de carte suivait directement le h2 de
   section sans h3 intermédiaire sur les 8 pages qui utilisent
   .md-perso__box-full (les 7 pages ville + la page hub "Location
   Photobooth"), aucune autre utilise ce composant avec un h4 correct. */
.md-perso__box-full h3 {
	font-size: 14.5px;
	font-weight: 700;
	margin: 0 0 3px;
}

.md-perso__box-full p {
	font-size: 13px;
	color: #6a6a6a;
	line-height: 1.5;
	margin: 0;
}

/* ============ PROCESS (étapes numérotées) ============ */
.md-process {
	display: grid;
	/* 1 colonne sous 760px (audit responsive 2026-09-01) : en repeat(3, 1fr)
	   fixe sans palier mobile, chaque étape contient un paragraphe complet
	   (souvent 150-250 caractères) écrasé dans ~1/3 de la largeur d'un
	   écran 375px — moins large que certains mots isolés du texte
	   ("personnalisez", "instantanément"...), ce qui forçait un
	   débordement horizontal de toute la page. Utilisé sur 4 pages ville
	   (Beaune, Chalon-sur-Saône, Dijon, Montceau-les-Mines). */
	grid-template-columns: 1fr;
	gap: 32px;
	margin-top: 8px;
	position: relative;
}

@media (min-width: 760px) {
	.md-process {
		grid-template-columns: repeat(3, 1fr);
	}
}

.md-process__step {
	text-align: center;
	padding: 0 16px;
}

.md-process__num {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--md-indigo);
	color: var(--md-white);
	display: grid;
	place-items: center;
	font-size: 20px;
	font-weight: 800;
	margin: 0 auto 20px;
}

.md-process__step h3 {
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 8px;
}

.md-process__step p {
	font-size: 14px;
	color: #5a5a5a;
	line-height: 1.6;
	margin: 0;
}

/* ============ ÉVÉNEMENTS (grille d'occasions) ============ */
.md-event-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
	margin-top: 32px;
}

@media (min-width: 640px) {
	.md-event-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 960px) {
	.md-event-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

.md-event-card {
	background: var(--md-white);
	border: 1px solid var(--md-line);
	border-left: 3px solid var(--md-indigo);
	border-radius: 0 10px 10px 0;
	padding: 20px 22px;
}

.md-event-card h3 {
	font-size: 15.5px;
	font-weight: 700;
	margin: 0 0 6px;
}

.md-event-card p {
	font-size: 13.5px;
	color: #5a5a5a;
	line-height: 1.6;
	margin: 0;
}

/* ============ ZONE DE LIVRAISON — TAGS VILLAGES ============ */
.md-village-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 9px;
	margin-top: 20px;
}

.md-village-tag {
	background: var(--md-white);
	border: 1px solid var(--md-line);
	border-radius: var(--md-radius-pill);
	padding: 7px 16px;
	font-size: 13px;
	font-weight: 600;
	color: var(--md-ink);
}

.md-village-tag--main {
	background: var(--md-indigo);
	color: var(--md-white);
	border-color: var(--md-indigo);
}

/* ============ MAILLAGE INTERNE ============ */
.md-mesh {
	max-width: 1104px;
	margin: 0 auto;
	background: var(--md-white);
	border: 1px solid var(--md-line);
	border-radius: 16px;
	padding: clamp(24px, 4vw, 36px);
}

.md-mesh h2 {
	font-size: 19px;
	font-weight: 700;
	margin: 0 0 6px;
}

.md-mesh > p {
	margin: 0 0 20px;
	color: #5a5a5a;
	font-size: 14.5px;
}

.md-mesh__links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.md-mesh__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--md-blue);
	color: var(--md-indigo);
	border-radius: 10px;
	padding: 10px 16px;
	font-size: 13.5px;
	font-weight: 600;
	text-decoration: none;
}

/* ============ FAQ — variante fond blanc (les FAQ ville suivent une
   section sombre/carte, le fond crème de .md-faq détonnerait) ============ */
.md-faq--white {
	background: var(--md-white);
}

/* ============ CTA FINAL TEXTE (numéro de tél sous le bouton, motif
   propre aux pages ville — la home n'a pas cet élément) ============ */
.md-cta-banner__phone {
	display: block;
	margin-top: 16px;
	font-size: 13.5px;
	color: rgba(255, 255, 255, 0.65);
}

.md-cta-banner__phone a {
	color: rgba(255, 255, 255, 0.92);
	font-weight: 700;
	text-decoration: none;
}

/* ------------------------------------------------------------------------------------------------------------
 * N11 (audit du 30/09, 0.83.13) : les styles écrits en ligne dans les 8 gabarits ville, ramenés ici tels quels,
 * une classe par style distinct (numérotée par nombre d'emplois). !important garde la priorité qu'avait le style
 * en ligne sur les règles ordinaires : le rendu ne change pas. Les styles qui contiennent du PHP (photos de fond)
 * restent en ligne. Prochaine étape possible : regrouper ces classes par rôle et passer les couleurs en jetons (C11).
 * ---------------------------------------------------------------------------------------------------------- */
.md-v01 { font-size:clamp(24px,3.2vw,32px) !important; font-weight:700 !important; margin:0 0 16px !important; } /* 20× */
.md-v02 { color:#4a4a4a !important; font-size:16px !important; line-height:1.75 !important; margin:0 !important; } /* 12× */
.md-v03 { color:#4a4a4a !important; font-size:16px !important; line-height:1.75 !important; margin:0 0 16px !important; } /* 10× */
.md-v04 { text-align:center !important; margin-top:32px !important; } /* 9× */
.md-v05 { display:flex !important; gap:14px !important; justify-content:center !important; flex-wrap:wrap !important; } /* 8× */
.md-v06 { max-width:1300px !important; margin:0 auto 24px !important; padding:0 24px !important; } /* 8× */
.md-v07 { max-width:640px !important; } /* 8× */
.md-v08 { color:#4a4a4a !important; font-size:16px !important; line-height:1.75 !important; margin-bottom:16px !important; } /* 7× */
.md-v09 { line-height:1.9 !important; color:#4a4a4a !important; font-size:16px !important; } /* 6× */
.md-v10 { padding-top:40px !important; padding-bottom:40px !important; } /* 6× */
.md-v11 { color:#4a4a4a !important; font-size:16px !important; line-height:1.75 !important; margin-bottom:24px !important; } /* 5× */
.md-v12 { color:#4a4a4a !important; font-size:16px !important; line-height:1.75 !important; margin-bottom:14px !important; } /* 4× */
.md-v13 { color:var(--md-indigo) !important; font-weight:700 !important; } /* 4× */
.md-v14 { font-size:12.5px !important; color:#5A6178 !important; margin-top:16px !important; } /* 4× */
.md-v15 { font-size:13px !important; font-weight:600 !important; color:#6a6a6a !important; } /* 4× */
.md-v16 { font-size:14px !important; font-weight:600 !important; color:#5A6178 !important; } /* 4× */
.md-v17 { font-size:26px !important; font-weight:800 !important; color:var(--md-indigo) !important; margin:0 0 2px !important; } /* 4× */
.md-v18 { font-size:32px !important; font-weight:800 !important; color:var(--md-indigo) !important; margin:0 0 4px !important; } /* 4× */
.md-v19 { line-height:1.9 !important; color:#4a4a4a !important; margin-bottom:0 !important; } /* 4× */
.md-v20 { margin-top:12px !important; color:#5a5a5a !important; font-size:15.5px !important; } /* 4× */
.md-v21 { text-align:center !important; margin-top:28px !important; font-size:13.5px !important; color:#5A6178 !important; } /* 4× */
.md-v22 { color:var(--md-indigo) !important; font-weight:700 !important; margin-left:4px !important; } /* 3× */
.md-v23 { font-size:12px !important; font-weight:400 !important; color:#6a6a6a !important; } /* 3× */
.md-v24 { font-size:13.5px !important; color:#6a6a6a !important; margin-bottom:0 !important; } /* 3× */
.md-v25 { font-size:15px !important; font-weight:700 !important; color:var(--md-indigo) !important; margin:32px 0 5px !important; } /* 3× */
.md-v26 { line-height:1.9 !important; color:#4a4a4a !important; } /* 3× */
.md-v27 { line-height:1.9 !important; color:rgba(255,255,255,.82) !important; font-size:16px !important; } /* 3× */
.md-v28 { margin-top:28px !important; font-size:14.5px !important; color:#5a5a5a !important; } /* 3× */
.md-v29 { width:100% !important; height:min(60vw,560px) !important; object-fit:cover !important; object-position:center 20% !important; border-radius:16px !important; display:block !important; } /* 3× */
.md-v30 { color:#4a4a4a !important; font-size:15.5px !important; line-height:1.75 !important; margin-top:32px !important; } /* 2× */
.md-v31 { color:#4a4a4a !important; font-size:15.5px !important; line-height:1.75 !important; margin:0 !important; } /* 2× */
.md-v32 { color:#4a4a4a !important; font-size:15.5px !important; line-height:1.75 !important; margin:20px 0 0 !important; } /* 2× */
.md-v33 { color:#4a4a4a !important; font-size:15.5px !important; line-height:1.75 !important; margin:28px 0 0 !important; max-width:780px !important; } /* 2× */
.md-v34 { color:#4a4a4a !important; font-size:16px !important; line-height:1.75 !important; margin-bottom:20px !important; } /* 2× */
.md-v35 { color:#4a4a4a !important; font-size:16px !important; line-height:1.75 !important; margin:0 0 8px !important; max-width:780px !important; } /* 2× */
.md-v36 { color:#4a4a4a !important; font-size:16px !important; line-height:1.8 !important; margin:0 0 28px !important; } /* 2× */
.md-v37 { display:grid !important; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)) !important; gap:16px !important; } /* 2× */
.md-v38 { font-size:13px !important; color:#5A6178 !important; margin:16px 0 0 !important; line-height:1.7 !important; } /* 2× */
.md-v39 { line-height:1.9 !important; color:#4a4a4a !important; font-size:16px !important; margin-top:24px !important; margin-bottom:0 !important; } /* 2× */
.md-v40 { line-height:1.9 !important; color:#4a4a4a !important; font-size:16px !important; max-width:780px !important; margin:16px auto 0 !important; } /* 2× */
.md-v41 { margin-bottom:16px !important; } /* 2× */
.md-v42 { margin-top:0 !important; } /* 2× */
.md-v43 { margin:0 0 4px !important; font-size:26px !important; font-weight:800 !important; color:var(--md-ink) !important; } /* 2× */
.md-v44 { margin:0 0 6px !important; font-weight:700 !important; color:var(--md-indigo) !important; } /* 2× */
.md-v45 { margin:0 !important; font-size:13px !important; color:#6a6a6a !important; } /* 2× */
.md-v46 { margin:24px 0 0 !important; } /* 2× */
.md-v47 { max-width:1300px !important; margin:0 auto !important; padding:0 24px !important; } /* 2× */
.md-v48 { max-width:1300px !important; margin:0 auto !important; padding:0 24px !important; background:var(--md-cream) !important; padding-top:24px !important; } /* 2× */
.md-v49 { border-bottom:none !important; padding-bottom:0 !important; margin-bottom:0 !important; } /* 1× */
.md-v50 { color:#4a4a4a !important; font-size:15.5px !important; line-height:1.75 !important; margin:12px 0 0 !important; } /* 1× */
.md-v51 { color:#4a4a4a !important; font-size:15.5px !important; line-height:1.75 !important; margin:28px 0 0 !important; } /* 1× */
.md-v52 { color:#4a4a4a !important; font-size:16px !important; line-height:1.75 !important; margin-bottom:0 !important; } /* 1× */
.md-v53 { color:#4a4a4a !important; font-size:16px !important; line-height:1.75 !important; margin-bottom:8px !important; } /* 1× */
.md-v54 { color:#4a4a4a !important; font-size:16px !important; line-height:1.75 !important; margin:0 0 20px !important; } /* 1× */
.md-v55 { color:#4a4a4a !important; font-size:16px !important; line-height:1.75 !important; margin:0 0 4px !important; } /* 1× */
.md-v56 { color:#4a4a4a !important; font-size:16px !important; line-height:1.75 !important; margin:0 0 8px !important; } /* 1× */
.md-v57 { color:#4a4a4a !important; font-size:16px !important; line-height:1.8 !important; margin:0 0 16px !important; } /* 1× */
.md-v58 { font-size:15px !important; font-weight:700 !important; color:var(--md-indigo) !important; margin:0 0 5px !important; } /* 1× */
.md-v59 { font-size:17px !important; font-weight:700 !important; color:var(--md-indigo) !important; margin:36px 0 4px !important; } /* 1× */
.md-v60 { font-size:26px !important; font-weight:800 !important; color:var(--md-ink) !important; margin:4px 0 6px !important; } /* 1× */
.md-v61 { font-weight:700 !important; color:var(--md-indigo) !important; font-size:12px !important; margin-bottom:6px !important; } /* 1× */
.md-v62 { grid-template-columns:repeat(auto-fit,minmax(210px,1fr)) !important; } /* 1× */
.md-v63 { line-height:1.9 !important; color:#4a4a4a !important; font-size:16px !important; margin-bottom:0 !important; } /* 1× */
.md-v64 { line-height:1.9 !important; color:#4a4a4a !important; font-size:16px !important; margin-top:24px !important; } /* 1× */
.md-v65 { line-height:1.9 !important; color:#4a4a4a !important; font-size:16px !important; max-width:780px !important; margin:0 auto 32px !important; } /* 1× */
.md-v66 { line-height:1.9 !important; color:#4a4a4a !important; font-size:16px !important; max-width:780px !important; margin:0 auto 8px !important; } /* 1× */
.md-v67 { line-height:1.9 !important; color:#4a4a4a !important; font-size:16px !important; max-width:780px !important; margin:28px auto 0 !important; } /* 1× */
.md-v68 { line-height:1.9 !important; color:#4a4a4a !important; font-size:16px !important; max-width:780px !important; margin:28px auto 0 !important; text-align:center !important; } /* 1× */
.md-v69 { line-height:1.9 !important; color:#4a4a4a !important; font-size:16px !important; max-width:780px !important; margin:32px auto 0 !important; } /* 1× */
.md-v70 { line-height:1.9 !important; color:#4a4a4a !important; margin-bottom:28px !important; } /* 1× */
.md-v71 { line-height:1.9 !important; color:#4a4a4a !important; margin-top:-16px !important; margin-bottom:28px !important; } /* 1× */
.md-v72 { line-height:1.9 !important; color:#4a4a4a !important; margin-top:-16px !important; margin-bottom:32px !important; } /* 1× */
.md-v73 { line-height:1.9 !important; color:#4a4a4a !important; margin-top:20px !important; } /* 1× */
.md-v74 { line-height:1.9 !important; color:#4a4a4a !important; margin-top:24px !important; margin-bottom:0 !important; } /* 1× */
.md-v75 { line-height:1.9 !important; color:#4a4a4a !important; margin-top:28px !important; margin-bottom:0 !important; } /* 1× */
.md-v76 { line-height:1.9 !important; color:#4a4a4a !important; margin-top:32px !important; } /* 1× */
.md-v77 { line-height:1.9 !important; color:rgba(255,255,255,.82) !important; font-size:16px !important; margin-bottom:0 !important; } /* 1× */
.md-v78 { line-height:1.9 !important; color:rgba(255,255,255,0.8) !important; } /* 1× */
.md-v79 { line-height:1.9 !important; color:rgba(255,255,255,0.8) !important; margin-bottom:0 !important; } /* 1× */
.md-v80 { margin-bottom:0 !important; } /* 1× */
.md-v81 { margin-bottom:28px !important; } /* 1× */
.md-v82 { margin-bottom:8px !important; } /* 1× */
.md-v83 { margin-top:10px !important; font-size:14.5px !important; color:#5a5a5a !important; } /* 1× */
.md-v84 { margin-top:14px !important; } /* 1× */
.md-v85 { margin-top:24px !important; } /* 1× */
.md-v86 { margin-top:36px !important; } /* 1× */
.md-v87 { margin:16px 0 0 !important; } /* 1× */
.md-v88 { margin:24px 0 24px !important; } /* 1× */
.md-v89 { max-width:1104px !important; margin:0 auto !important; padding:0 24px !important; } /* 1× */
.md-v90 { max-width:1300px !important; margin:0 auto !important; padding:8px 24px 0 !important; } /* 1× */
.md-v91 { max-width:1300px !important; margin:40px auto 0 !important; padding:0 24px !important; } /* 1× */
.md-v92 { max-width:780px !important; margin:0 auto !important; } /* 1× */
.md-v93 { max-width:780px !important; margin:20px auto 0 !important; font-size:13px !important; color:#5A6178 !important; line-height:1.7 !important; } /* 1× */
.md-v94 { max-width:780px !important; margin:32px auto 0 !important; } /* 1× */
.md-v95 { text-align:center !important; color:#6a6a6a !important; font-size:13.5px !important; margin-top:28px !important; } /* 1× */
.md-v96 { text-align:center !important; font-size:19px !important; font-weight:700 !important; color:var(--md-indigo) !important; margin:40px 0 20px !important; } /* 1× */
.md-v97 { text-align:center !important; margin-top:28px !important; font-size:14px !important; color:#5a5a5a !important; } /* 1× */
.md-v98 { width:100% !important; height:min(60vw,560px) !important; object-fit:cover !important; object-position:center 15% !important; border-radius:16px !important; display:block !important; } /* 1× */
.md-v99 { width:100% !important; height:min(60vw,560px) !important; object-fit:cover !important; object-position:center 25% !important; border-radius:16px !important; display:block !important; } /* 1× */
.md-v100 { width:100% !important; height:min(60vw,560px) !important; object-fit:cover !important; object-position:center 30% !important; border-radius:16px !important; display:block !important; } /* 1× */