/*
 * Tasting Box : pages d'arrivée des annonces, abonnement et cadeau de Noël (56k, 13/10/2026).
 * Chargé par mu-plugins/46-tb-landing.php sur ces deux gabarits seulement.
 * S'appuie sur tb-pages.css (charte, boutons, sections de l'accueil, composeur de /souscription/).
 */

/* ---------- Bandeau d'aperçu (jamais affiché une fois la page publiée) ---------- */
#tb-accueil p.tbl-apercu {
	margin: 0 0 1.5rem; padding: .75rem 1rem;
	border: 2px dashed rgba(255,254,244,.55); border-radius: 14px; background: rgba(255,254,244,.06);
	font-size: .9rem; line-height: 1.45; color: var(--creme);
}
#tb-accueil p.tbl-apercu strong { color: var(--ciel); }

/* ---------- Haut de page ---------- */
.tbl-hero__grid { align-items: center; }
@media (min-width: 861px) {
	.tbl-hero--abo .tbl-hero__grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); }
	.tbl-hero--noel .tbl-hero__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
}
/* La taille du titre suit la largeur de sa colonne : chaque ligne garde au moins deux mots */
.tbl-hero__texte { min-width: 0; container-type: inline-size; }
#tb-accueil .tbl-h1 {
	font-family: var(--titre); font-weight: 400; letter-spacing: 0; line-height: 1.04;
	color: var(--creme); margin: 0 0 1.1rem; text-wrap: wrap;
}
#tb-accueil .tbl-h1 .tbl-l { display: block; }
/* « Apprenez à la nommer. » (13,9 fois la taille de la police) tient sur une ligne */
#tb-accueil .tbl-hero--abo .tbl-h1 { font-size: 1.5rem; font-size: min(3.6rem, 6.95cqi); }
/* « Offrez un cours » (9,25 fois la taille) tient sur une ligne : jamais de mot seul */
#tb-accueil .tbl-hero--noel .tbl-h1 { font-size: 2rem; font-size: min(3.8rem, 10.2cqi); }
#tb-accueil .tbc-hero .tbl-lead { margin: 0 0 1.4rem; max-width: 36rem; }
#tb-accueil p.tbl-prix {
	display: inline-block; margin: 0 0 1.5rem; padding: .55rem 1.1rem;
	border-radius: 14px; background: var(--creme); color: var(--vin);
	font-weight: 700; font-size: 1.05rem; line-height: 1.35;
}
#tb-accueil p.tbl-prix strong { font-family: var(--titre); font-weight: 400; font-size: 1.5rem; line-height: 1; }
#tb-accueil .tbl-actions { align-items: center; gap: .9rem 1.5rem; }
#tb-accueil .tbl-hero .tbh-hero__note { margin-top: 1.1rem; }
#tb-accueil ul.tbl-preuves { margin-top: 1.25rem; }
#tb-accueil .tbl-hero .tbh-burst { --bw: 118px; width: var(--bw); right: -.4rem; left: auto; top: -1.4rem; bottom: auto; }
#tb-accueil .tbl-hero .tbh-burst span { font-size: calc(var(--bw) * .1); line-height: 1.1; }
@media (min-width: 861px) {
	#tb-accueil .tbl-hero .tbh-burst { --bw: 150px; right: auto; left: -2rem; top: auto; bottom: -2rem; }
}
@media (max-width: 600px) {
	#tb-accueil .tbl-actions a.tbh-btn { flex: 1 1 100%; }
	#tb-accueil .tbc-hero .tbl-lead { font-size: 1.05rem; }
}

/* ---------- Emplacements réservés (produit d'appel, réduction, date de Noël) ---------- */
#tb-accueil .tbl-slot--vide {
	padding: .9rem 1.1rem; border: 2px dashed rgba(47,18,16,.45); border-radius: 14px;
	background: rgba(191,219,239,.35); color: var(--vin); font-weight: 700; font-size: .95rem; line-height: 1.45;
}
#tb-accueil .tbl-slot.tbl-slot--section { margin: 2.25rem auto 0; }
#tb-accueil .tbc-hero .tbl-slot--vide { margin-top: 1rem; border-color: rgba(255,254,244,.55); background: rgba(255,254,244,.06); color: var(--creme); }
#tb-accueil .tbl-slot.tbl-slot--recap { margin: .25rem 0 .5rem; }

/* ---------- Composeur ---------- */
.tbl-compo { padding-top: clamp(4.5rem, 9vw, 7rem); }
#tb-accueil .tbl-intro { margin-top: .9rem; max-width: 40rem; font-size: 1.1rem; }
#tb-accueil .tbl-recap__total { font-size: .95rem; color: rgba(30,30,30,.75); }
#tb-accueil .tbl-recap__total strong { color: var(--vin); }
#tb-accueil .tbl-champs-autre[hidden] { display: none; }

/* ---------- Appel final ---------- */
#tb-accueil .tbh-final .tbl-final__prix { margin: -.75rem 0 1.5rem; font-weight: 600; color: rgba(255,254,244,.88); }

/* ---------- Barre du bas : effacée tant que les boutons du haut de page sont à l'écran ---------- */
.tbap-barre.tbl-cachee { transform: translateY(110%); opacity: 0; pointer-events: none; }

/* ---------- Tailles : les groupes de mots insécables tiennent dans leur colonne ---------- */
#tb-accueil .tbh-faq .tbh-h2 { font-size: clamp(1.7rem, 1rem + 1.6vw, 2.4rem); }
@media (max-width: 400px) {
	#tb-accueil .tbh-h2 { font-size: 1.7rem; }
	#tb-accueil .tbs-recap__nom { font-size: 1.4rem; }
	#tb-accueil .tbh-fiche__head { font-size: 1.25rem; }
}

/* ---------- Sans l'animation mot à mot du site (elle coupe les espaces insécables des titres) ---------- */
/* La page n'a pas la classe tbh sur <main> : le script de mouvement du site ne s'y applique pas. */
.tbl [id] { scroll-margin-top: 6.5rem; }
.tbl section.tbl-compo[id] { scroll-margin-top: calc(7rem - clamp(4.5rem, 9vw, 7rem)); }
@media (max-width: 600px) {
	.tbl [id] { scroll-margin-top: 5rem; }
	.tbl section.tbl-compo[id] { scroll-margin-top: calc(6.25rem - 4.5rem); }
}

/* ---------- Petits écrans : chaque groupe de mots tient dans sa colonne ---------- */
@media (max-width: 400px) {
	#tb-accueil .tbh-bento h3 { font-size: 1.05rem; }
	#tb-accueil .tbh-fiche__head { font-size: 1.1rem; }
	#tb-accueil .tbap-barre__nom { font-size: 1rem; }
	#tb-accueil .tbap-barre #tbap-rythme, #tb-accueil .tbap-barre .tbl-sep { display: none; }
}

/* ---------- Corrections relevées par le contrôle de toutes les lignes (13/10) ---------- */
@media (min-width: 861px) and (max-width: 1100px) {
	#tb-accueil .tbh-bento h3 { font-size: 1.1rem; }
}
/* Colonne des choix étroite à côté du récapitulatif : les options passent l'une sous l'autre */
@media (min-width: 901px) and (max-width: 1100px) {
	.tbl .tbs-rythmes { grid-template-columns: 1fr; }
	.tbl .tbs-rythme { min-height: 0; }
}
@media (max-width: 400px) {
	.tbl .tbh-bento__text { padding-inline: 1rem; }
	#tb-accueil .tbh-bento h3 { font-size: 1rem; }
}
@media (max-width: 360px) {
	#tb-accueil .tbh-h2 { font-size: 1.45rem; }
}
@media (max-width: 340px) {
	#tb-accueil .tbap-barre { padding-inline: 1rem; gap: .6rem; }
	#tb-accueil button.tbap-barre__btn { padding-inline: 1rem; }
	#tb-accueil .tbap-barre__nom { font-size: .95rem; }
}
@media (min-width: 861px) and (max-width: 1100px) {
	.tbl .tbh-bento__text { padding-inline: 1rem; }
	#tb-accueil .tbh-bento h3 { font-size: 1rem; }
}
@media (min-width: 901px) and (max-width: 1100px) {
	#tb-accueil .tbs-level__nom { font-size: 1.2rem; }
}
@media (min-width: 861px) and (max-width: 940px) {
	#tb-accueil .tbh-bento h3 { font-size: .94rem; }
}
@media (min-width: 901px) and (max-width: 1000px) {
	#tb-accueil .tbs-level__nom { font-size: 1.05rem; }
}

/* ---------- Finitions vues à la capture ---------- */
/* Boutons en pilule (le thème impose des coins à 4 px à tous les boutons d'envoi) */
html body.tbl-page[data-button-style] #tb-accueil button.tbs-submit,
html body.tbl-page[data-button-style] #tb-accueil button.tbap-barre__btn { border-radius: 999px !important; }
/* Pastille d'étape : toujours ronde, même quand l'intitulé passe sur deux lignes */
.tbl .tbs-step__num { flex: none; }
/* Bouton « préférences cookies » : à droite sur téléphone, pour ne pas couvrir le début des lignes */
@media (max-width: 600px) {
	body.tbl-page .cky-btn-revisit-wrapper { left: auto !important; right: 12px !important; width: 40px !important; height: 40px !important; }
}
/* Message d'erreur du formulaire (par exemple e-mail de la personne manquant) : lisible, aux couleurs du site */
#tb-accueil .tbs-notices .woocommerce-error,
#tb-accueil .tbs-notices .woocommerce-message,
#tb-accueil .tbs-notices .woocommerce-info {
	margin: 0 0 1.5rem !important; padding: .9rem 1.1rem !important; list-style: none;
	background: var(--creme) !important; color: var(--vin) !important;
	border: 2px solid var(--vin) !important; border-radius: 14px !important; box-shadow: 4px 4px 0 var(--vigne);
}
#tb-accueil .tbs-notices .woocommerce-error::before, #tb-accueil .tbs-notices .woocommerce-error::after { content: none !important; display: none !important; }
#tb-accueil .tbs-notices li { margin: 0; padding: 0; font-weight: 700; color: var(--vin) !important; }
#tb-accueil .tbs-notices :focus { outline: 3px solid var(--mer); outline-offset: 2px; }
/* Intitulé d'étape sur deux lignes : un seul bloc de texte à côté de la pastille */
.tbl .tbl-legende { min-width: 0; }
/* Une seule colonne sur téléphone : son contenu ne peut pas l'élargir */
@media (max-width: 900px) { .tbl .tbs-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 360px) { #tb-accueil .tbs-step legend { font-size: 1.3rem; } }
@media (max-width: 360px) {
	.tbl .tbs-recap { padding: 1.15rem; }
	#tb-accueil .tbs-recap__nom { font-size: 1.2rem; }
}

/* ---------- Grille du 13/10 : le port sur deux niveaux, sous le prix ---------- */
#tb-accueil p.tbl-port { margin: -.75rem 0 1.5rem; font-size: .95rem; font-weight: 600; color: rgba(255,254,244,.85); }
@media (max-width: 600px) { #tb-accueil p.tbl-port { font-size: .9rem; } }
