/* Loft — sombre et raffiné : fond profond, liseré laiton, typo élégante */

.tsb-site[data-tsb-template="loft"] .tsb-hero-bg {
	filter: saturate(0.85) brightness(0.85);
}
.tsb-site[data-tsb-template="loft"] .tsb-hero-kicker {
	letter-spacing: 0.04em;
}
.tsb-site[data-tsb-template="loft"] .tsb-hero-title {
	font-weight: 500;
}
/* v1.9.0 — scoped to .tsb-btn-primary (not the bare .tsb-btn), same fix as
   template-nature.css: this used to also repaint ".tsb-btn-outline" and
   ".tsb-btn-urgent" transparent/ink, erasing the hero's white/transparent
   contrast and the Urgence CTA's distinct alert color. */
.tsb-site[data-tsb-template="loft"] .tsb-btn-primary {
	border-color: var(--tsb-accent);
	/* item #102 — custom CTA color, falls back to Loft's own transparent/ink
	   pair when unset (same var()-fallback pattern as base.css). */
	background: var(--tsb-cta-bg, transparent);
	color: var(--tsb-cta-text, var(--tsb-ink));
}
/* 37e vague, retour Chloé — bug : cette règle (3 sélecteurs) gagnait
   toujours sur le bouton "Réserver" de l'en-tête face à la règle dédiée de
   base.css (2 sélecteurs, moins spécifique), sans jamais lire
   header_cta_bg/header_cta_text (36e vague, item 6). Règle à spécificité
   strictement supérieure (4 sélecteurs), même repli transparent/ink
   qu'avant quand ces champs ne sont pas réglés. */
.tsb-site[data-tsb-template="loft"] .tsb-nav-cta.tsb-btn-primary {
	background: var(--tsb-header-cta-bg, var(--tsb-cta-bg, transparent));
	color: var(--tsb-header-cta-text, var(--tsb-cta-text, var(--tsb-ink)));
}
/* 110e vague (suite, 2) — même correctif que la règle "Réserver" (en-tête)
   juste au-dessus, cette fois pour le bouton "Prendre rendez-vous" du
   bandeau de réservation (voir base.css pour le détail complet). */
.tsb-site[data-tsb-template="loft"] .tsb-cta-actions .tsb-btn-primary {
	background: var(--tsb-cta-banner-cta-bg, var(--tsb-cta-bg, transparent));
	color: var(--tsb-cta-banner-cta-text, var(--tsb-cta-text, var(--tsb-ink)));
}
.tsb-site[data-tsb-template="loft"] .tsb-btn-primary:hover {
	background: var(--tsb-accent);
	/* v1.9.6 — item #85: was a flat var(--tsb-paper) — Loft's paper is
	   near-black, and several Loft accents (ex. "Bordeaux", "Émeraude") are
	   themselves dark, so dark-on-dark was unreadable on hover/focus. */
	color: var(--tsb-on-accent, var(--tsb-paper));
}

.tsb-site[data-tsb-template="loft"] .tsb-section-title {
	position: relative;
	padding-bottom: 16px;
}
.tsb-site[data-tsb-template="loft"] .tsb-section-title::after {
	content: "";
	position: absolute;
	left: 0; bottom: 0;
	width: 60px; height: 1px;
	background: var(--tsb-accent);
}

.tsb-site[data-tsb-template="loft"] .tsb-about-text {
	opacity: 0.8;
}

.tsb-site[data-tsb-template="loft"] .tsb-gallery {
	overflow-x: auto;
}
.tsb-site[data-tsb-template="loft"] .tsb-gallery-grid {
	grid-auto-flow: column;
	grid-auto-columns: 260px;
	grid-template-columns: none;
	overflow-x: auto;
	padding-bottom: 8px;
}
.tsb-site[data-tsb-template="loft"] .tsb-gallery-item img {
	height: 340px;
}

.tsb-site[data-tsb-template="loft"] .tsb-booking {
	background: var(--tsb-sand);
	border-top: 1px solid var(--tsb-accent);
	border-bottom: 1px solid var(--tsb-accent);
}

.tsb-site[data-tsb-template="loft"] .tsb-testimonial {
	border: 1px solid var(--tsb-accent);
	background: transparent;
}
.tsb-site[data-tsb-template="loft"] .tsb-testimonial-stars {
	color: var(--tsb-accent-text, var(--tsb-accent));
}

.tsb-site[data-tsb-template="loft"] .tsb-footer {
	border-top: 1px solid var(--tsb-accent);
	background: var(--tsb-paper);
}

.tsb-site[data-tsb-template="loft"] .tsb-service-card { border: 1px solid var(--tsb-accent); }
.tsb-site[data-tsb-template="loft"] .tsb-team { background: var(--tsb-sand); }
.tsb-site[data-tsb-template="loft"] .tsb-faq-question { letter-spacing: 0.01em; }

.tsb-site[data-tsb-template="loft"] .tsb-nav { border-bottom-color: var(--tsb-sand); }
.tsb-site[data-tsb-template="loft"] .tsb-nav-brand { letter-spacing: 0.02em; }
.tsb-site[data-tsb-template="loft"] .tsb-page-banner { border-bottom-color: var(--tsb-accent); }
.tsb-site[data-tsb-template="loft"] .tsb-cta-banner { border-top: 1px solid var(--tsb-accent); border-bottom: 1px solid var(--tsb-accent); }