/*
Theme Name:   Ton Tandem Child
Theme URI:    https://tontandem.com
Description:  Thème enfant Astra — charte graphique Ton Tandem
Author:       Ton Tandem
Template:     astra
Version:      1.3.44
Text Domain:  tontandem-child
*/

/* ==========================================================================
   Polices — Figtree (texte) · Raleway Regular (titres)
   Titres en 400 (Light trop grêle). Leads en encre. Boutons tache inchangés.
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,400;0,500;0,600;1,400&family=Raleway:wght@300;400;500&display=swap");

/* ==========================================================================
   Tokens — charte Ton Tandem
   ========================================================================== */

:root {
  /* Vitrine — structure (ivory, moins taupe) */
  --tt-canvas: #fffcf7;
  --tt-canvas-warm: #f9f6f1;
  --tt-canvas-deep: #f3efe8;
  --tt-canvas-alt: var(--tt-canvas-warm);

  /* Encre — noir prononcé, hiérarchie nette */
  --tt-ink: #121212;
  --tt-ink-light: #252525;
  --tt-ink-muted: #454545;
  --tt-ink-faint: #5c5c5c;

  /* Vitrine — sage structurel (un seul accent hors duo logo) */
  --tt-accent: #a8cdb8;
  --tt-accent-mid: #c5ddd0;
  --tt-accent-soft: #e4f0ea;

  /* Boutons — tache pervenche (style charte d’origine) */
  --tt-btn-tache: #d4d0ea;
  --tt-btn-tache-soft: #eceaf6;

  /* Vitrine — duo signature (toujours ensemble, jamais arc-en-ciel) */
  --tt-v-rose: #efc4ce;
  --tt-v-menthe: #b8e2cf;

  /* Pastels UI SaaS — inchangés (mockups produit) */
  --tt-pastel-rose: #f8e4e8;
  --tt-pastel-peche: #f8e8e2;
  --tt-pastel-beurre: #f6f0d4;
  --tt-pastel-menthe: #dcefe6;
  --tt-pastel-ciel: #dceaf4;
  --tt-pastel-lilas: #e8e0f0;
  --tt-pastel-corail: #f6ded6;
  --tt-pastel-pervenche: #e2e2f4;
  --tt-pastel-sable: #efe6dc;

  /* Marques logo */
  --tt-mark-menthe: #9ed8b8;
  --tt-mark-rose: #e8c5c8;
  --tt-mark-rose-doux: #ecc9cc;
  --tt-mark-lien: #c2d3c7;

  /* Typo */
  --tt-font-sans: "Figtree", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --tt-font-display: "Raleway", "Figtree", ui-sans-serif, system-ui, sans-serif;

  /* Formes */
  --tt-radius-sm: 0.375rem;
  --tt-radius-md: 0.75rem;
  --tt-radius-lg: 1rem;
  --tt-radius-xl: 1.75rem;
  --tt-radius-pill: 9999px;

  /* Ombres & bordures */
  --tt-border: rgba(18, 18, 18, 0.09);
  --tt-border-strong: rgba(18, 18, 18, 0.13);
  --tt-shadow-sm: 0 1px 2px rgba(18, 18, 18, 0.06);
  --tt-shadow-md: 0 1px 2px rgba(18, 18, 18, 0.06), 0 18px 44px -18px rgba(18, 18, 18, 0.16);
  --tt-separator-gradient: linear-gradient(
    90deg,
    transparent 0%,
    color-mix(in srgb, var(--tt-ink) 14%, transparent) 8%,
    color-mix(in srgb, var(--tt-ink) 28%, transparent) 38%,
    var(--tt-v-rose) 47%,
    var(--tt-v-menthe) 53%,
    color-mix(in srgb, var(--tt-ink) 28%, transparent) 62%,
    color-mix(in srgb, var(--tt-ink) 14%, transparent) 92%,
    transparent 100%
  );
  --tt-separator-shadow: 0 3px 12px -4px color-mix(in srgb, var(--tt-v-menthe) 45%, var(--tt-ink));

  /* Espacements contenu — 1400px max */
  --tt-content-width: min(94vw, 87.5rem);
  --tt-content-padding: clamp(1rem, 2.5vw, 2.5rem);
  --tt-logo-header: clamp(1.45rem, 2.4vw, 1.75rem);
  --tt-logo-footer: 1.05rem;
  --tt-line-height: 1.65;
  --tt-line-height-tight: 1.35;

  /* Aliases Astra — remplace les couleurs du customizer si besoin */
  --ast-global-color-0: var(--tt-ink);
  --ast-global-color-1: var(--tt-ink-light);
  --ast-global-color-2: var(--tt-ink-muted);
  --ast-global-color-3: var(--tt-accent);

  /* Sync largeur conteneur Astra (Customizer) */
  --ast-container-default-xlg: 87.5rem;
  --ast-container-default-lg: 87.5rem;
  --ast-container-default-md: 87.5rem;
  --ast-container-default-sm: 100%;
}

/* ==========================================================================
   Largeur page — header, contenu, footer alignés
   ========================================================================== */

.ast-container,
.site-content > .ast-container,
#primary .ast-container,
.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post,
.ast-separate-container .comments-area,
.ast-separate-container .ast-woocommerce-container {
  box-sizing: border-box;
  margin-inline: auto;
  max-width: var(--tt-content-width) !important;
  padding-inline: var(--tt-content-padding) !important;
  width: 100%;
}

#primary,
.site-content,
.ast-separate-container #primary,
.ast-page-builder-template .site-content {
  max-width: 100%;
  width: 100%;
}

.entry-content > .alignwide,
.wp-block-group.alignwide {
  max-width: var(--tt-content-width);
  width: 100%;
}

.entry-content > .alignfull,
.wp-block-cover.alignfull,
.wp-block-group.alignfull {
  max-width: none;
  width: 100%;
}

/* ==========================================================================
   Base
   ========================================================================== */

html {
  scroll-behavior: smooth;
}

body,
body.ast-separate-container,
body.ast-plain-container {
  background-color: var(--tt-canvas);
  color: var(--tt-ink);
  font-family: var(--tt-font-sans);
  font-size: 1rem;
  font-weight: 400;
  line-height: var(--tt-line-height);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::selection {
  background: color-mix(in srgb, var(--tt-accent-soft) 85%, white);
  color: var(--tt-ink);
}

/* ==========================================================================
   Typographie
   ========================================================================== */

h1,
h2,
h3,
h4,
h5,
h6,
.entry-title,
.site-title,
.ast-archive-description .ast-archive-title,
.wp-block-heading {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-weight: 400;
  letter-spacing: 0.015em;
  line-height: var(--tt-line-height-tight);
}

h1,
.entry-title {
  font-size: clamp(1.875rem, 4vw, 2.5rem);
}

h2 {
  font-size: clamp(1.5rem, 3vw, 2rem);
}

h3 {
  font-size: clamp(1.25rem, 2.5vw, 1.5rem);
}

p,
li,
dd,
dt {
  color: var(--tt-ink-light);
}

small,
.meta,
.comment-meta,
.ast-comment-meta,
.wp-block-post-date,
.wp-block-post-author-name {
  color: var(--tt-ink-muted);
}

.tt-eyebrow,
.ast-single-entry-banner .entry-meta,
.entry-meta {
  border-left: 3px solid var(--tt-accent);
  color: var(--tt-ink-muted);
  font-family: var(--tt-font-display);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  padding-left: 0.75rem;
  text-transform: uppercase;
}

/* Emphase contenu vitrine — gras / italique (lecture, pas décoration) */
.tt-section strong,
.tt-accueil__container strong,
.tt-parti-card strong,
.tt-duo strong,
.tt-carousel__copy strong {
  color: var(--tt-ink);
  font-weight: 600;
}

.tt-section em,
.tt-accueil__container em,
.tt-parti-card em,
.tt-duo em,
.tt-carousel__copy em {
  color: var(--tt-ink-muted);
  font-style: italic;
}

.tt-slogan,
.tt-mark-slogan {
  font-family: var(--tt-font-display);
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 400;
  letter-spacing: 0.015em;
}

.tt-baseline,
.tt-support {
  color: var(--tt-ink-muted);
  font-size: 0.9375rem;
}

a {
  color: var(--tt-ink);
  text-decoration-color: color-mix(in srgb, var(--tt-mark-lien) 70%, transparent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.15em;
  transition: color 0.2s ease, text-decoration-color 0.2s ease;
}

a:hover,
a:focus {
  color: var(--tt-ink-light);
  text-decoration-color: var(--tt-mark-lien);
}

/* ==========================================================================
   Conteneurs & sections
   ========================================================================== */

.site-content,
.ast-container,
.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-post:not(.ast-related-post),
.ast-separate-container .comments-area,
.ast-separate-container .ast-comment-list li,
.ast-separate-container .ast-woocommerce-container {
  background-color: transparent;
}

.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post,
.ast-separate-container .comments-area,
.ast-separate-container .ast-woocommerce-container {
  background-color: var(--tt-canvas);
  border: 1px solid var(--tt-border);
  border-radius: var(--tt-radius-lg);
  box-shadow: var(--tt-shadow-sm);
}

.tt-section {
  box-sizing: border-box;
  margin-inline: auto;
  max-width: var(--tt-content-width);
  padding-block: clamp(2rem, 5vw, 3.25rem);
  padding-inline: var(--tt-content-padding);
  position: relative;
  width: 100%;
}

/* Accueil Elementor — marges verticales par section */
.elementor-page .tt-accueil-quoi.tt-section {
  padding-block: clamp(1.25rem, 2.5vw, 2rem) clamp(2.5rem, 5vw, 4rem);
}

.elementor-page .tt-accueil-early.tt-section {
  padding-block: clamp(2rem, 4vw, 3.25rem) !important;
}

.elementor-page .tt-accueil-hero.tt-section {
  padding-block: clamp(2rem, 5vw, 3.25rem) !important;
}

.tt-section--wash {
  background:
    radial-gradient(ellipse 55% 50% at 92% 6%, color-mix(in srgb, var(--tt-accent-mid) 38%, transparent), transparent 58%),
    radial-gradient(ellipse 45% 42% at 4% 88%, color-mix(in srgb, var(--tt-v-rose) 10%, transparent), transparent 52%),
    linear-gradient(175deg, var(--tt-canvas) 0%, var(--tt-canvas-warm) 100%);
}

.tt-accueil-quoi.tt-section {
  background: #fff;
  isolation: isolate;
}

.tt-accueil-quoi.tt-section::before {
  background: var(--tt-separator-gradient);
  box-shadow: var(--tt-separator-shadow);
  content: "";
  display: block;
  height: 3px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  z-index: 2;
}

.tt-accueil-early.tt-section::before {
  background: var(--tt-separator-gradient);
  box-shadow: var(--tt-separator-shadow);
  content: "";
  display: block;
  height: 3px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  z-index: 2;
}

/* Early access — miroir hero, wash rose à droite */
.tt-accueil-early.tt-atmosphere {
  background: #fff;
  isolation: isolate;
}

.tt-accueil-early.tt-section::after {
  background:
    radial-gradient(ellipse 115% 90% at 108% 8%, color-mix(in srgb, var(--tt-v-rose) 58%, transparent), transparent 52%),
    radial-gradient(ellipse 95% 125% at 100% 62%, color-mix(in srgb, var(--tt-mark-rose-doux) 42%, transparent), transparent 54%),
    linear-gradient(260deg, color-mix(in srgb, var(--tt-v-rose) 18%, transparent) 0%, transparent 48%),
    linear-gradient(180deg, transparent 30%, #fff 100%);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 0;
}

.tt-accueil-early .tt-accueil__container {
  position: relative;
  z-index: 1;
}

.tt-atmosphere {
  background:
    radial-gradient(ellipse 70% 55% at 10% 12%, color-mix(in srgb, var(--tt-accent-mid) 82%, transparent), transparent 58%),
    var(--tt-canvas);
}

/* Hero — wash sage depuis le bord gauche du conteneur, fondu dans le blanc (pas de cadre) */
.tt-accueil-hero.tt-atmosphere {
  background: #fff;
  isolation: isolate;
}

.tt-accueil-hero.tt-section::before {
  background:
    radial-gradient(ellipse 110% 85% at -8% 4%, color-mix(in srgb, var(--tt-accent-mid) 48%, transparent), transparent 54%),
    radial-gradient(ellipse 90% 120% at 0% 55%, color-mix(in srgb, var(--tt-accent-soft) 32%, transparent), transparent 56%),
    linear-gradient(100deg, color-mix(in srgb, var(--tt-accent-soft) 14%, transparent) 0%, transparent 52%),
    linear-gradient(180deg, transparent 35%, #fff 100%);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 0;
}

.tt-accueil-hero .tt-accueil__container {
  position: relative;
  z-index: 1;
}

.tt-accueil-hero__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
}

.tt-accueil-hero__preview {
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  z-index: 1;
}

.tt-section--ground {
  background:
    radial-gradient(ellipse 60% 55% at 8% 50%, color-mix(in srgb, var(--tt-accent-soft) 75%, transparent), transparent 62%),
    radial-gradient(ellipse 50% 45% at 96% 20%, color-mix(in srgb, var(--tt-v-menthe) 14%, transparent), transparent 55%),
    var(--tt-canvas);
}

.tt-section--wash-pourquoi {
  background: var(--tt-canvas);
}

.tt-section--wash-access {
  background:
    radial-gradient(ellipse 50% 45% at 88% 12%, color-mix(in srgb, var(--tt-accent-soft) 55%, transparent), transparent 58%),
    radial-gradient(ellipse 45% 40% at 10% 85%, color-mix(in srgb, var(--tt-v-rose) 8%, transparent), transparent 52%),
    linear-gradient(180deg, var(--tt-canvas-warm) 0%, color-mix(in srgb, var(--tt-canvas) 45%, var(--tt-canvas-warm)) 100%);
}

.tt-section--wash-ope {
  background:
    radial-gradient(ellipse 55% 50% at 12% 20%, color-mix(in srgb, var(--tt-accent-soft) 90%, transparent), transparent 62%),
    var(--tt-canvas);
}

.tt-section--wash-interne {
  background:
    radial-gradient(ellipse 50% 45% at 88% 75%, color-mix(in srgb, var(--tt-accent-mid) 55%, transparent), transparent 58%),
    var(--tt-canvas-warm);
}

.tt-prose-stack {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* Legacy — hr masqué si encore présent dans Elementor */
.tt-section-separator,
hr.tt-section-separator,
.tt-fil-section {
  display: none !important;
}

.tt-section--has-separator {
  padding-top: inherit;
}

/* ==========================================================================
   Cartes & blocs
   ========================================================================== */

.tt-card,
.tt-card-lift,
.wp-block-group.is-style-tontandem-card,
.ast-separate-container .ast-article-post {
  background: var(--tt-canvas);
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-lg);
  box-shadow: var(--tt-shadow-md);
}

.tt-card--soft {
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(6px);
}

/* Pastilles fonction */
.tt-badge {
  border-radius: var(--tt-radius-pill);
  color: var(--tt-ink);
  display: inline-block;
  font-size: 0.875rem;
  padding: 0.375rem 0.875rem;
}

.tt-badge--menthe { background: var(--tt-pastel-menthe); }
.tt-badge--rose { background: var(--tt-pastel-rose); }
.tt-badge--lilas { background: var(--tt-pastel-lilas); }
.tt-badge--beurre { background: var(--tt-pastel-beurre); }
.tt-badge--ciel { background: var(--tt-pastel-ciel); }
.tt-badge--peche { background: var(--tt-pastel-peche); }
.tt-badge--corail { background: var(--tt-pastel-corail); }
.tt-badge--sable { background: var(--tt-pastel-sable); }
.tt-badge--pervenche { background: var(--tt-pastel-pervenche); }

/* ==========================================================================
   Boutons — tache pervenche, pas un pavé
   ========================================================================== */

.button,
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.ast-button,
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.uagb-buttons-repeater .uagb-button__link {
  appearance: none;
  background: transparent !important;
  border: 0 !important;
  border-radius: var(--tt-radius-pill) !important;
  box-shadow: none !important;
  color: var(--tt-ink) !important;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--tt-font-sans) !important;
  font-size: 0.9375rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  min-height: auto !important;
  padding: 0.625rem 1.5rem !important;
  position: relative;
  text-decoration: none !important;
  transition: opacity 0.2s ease, transform 0.2s ease;
  z-index: 0;
}

.button::before,
button:not(.menu-toggle):not(.ast-mobile-menu-trigger-minimal):not(.tt-carousel__arrow):not(.tt-carousel__dot)::before,
input[type="button"]::before,
input[type="reset"]::before,
input[type="submit"]::before,
.ast-button::before,
.wp-block-button__link::before,
.woocommerce a.button::before,
.woocommerce button.button::before,
.woocommerce input.button::before {
  background: radial-gradient(
    ellipse 90% 80% at 50% 50%,
    var(--tt-btn-tache) 0%,
    color-mix(in srgb, var(--tt-btn-tache) 78%, transparent) 45%,
    transparent 72%
  );
  border-radius: 40%;
  content: "";
  filter: blur(3px);
  inset: -0.35rem -0.5rem;
  opacity: 0.85;
  pointer-events: none;
  position: absolute;
  z-index: -1;
}

.button:hover::before,
button:not(.menu-toggle):not(.ast-mobile-menu-trigger-minimal):not(.tt-carousel__arrow):not(.tt-carousel__dot):hover::before,
input[type="button"]:hover::before,
input[type="reset"]:hover::before,
input[type="submit"]:hover::before,
.ast-button:hover::before,
.wp-block-button__link:not(.tt-btn-ghost):hover::before,
.woocommerce a.button:hover::before,
.woocommerce button.button:hover::before,
.woocommerce input.button:hover::before {
  opacity: 1;
}

.button:hover,
button:not(.menu-toggle):hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
.ast-button:hover,
.wp-block-button__link:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
  opacity: 1;
  transform: translateY(-1px);
}

.button:hover::before,
button:not(.menu-toggle):not(.ast-mobile-menu-trigger-minimal):hover::before,
input[type="button"]:hover::before,
input[type="reset"]:hover::before,
input[type="submit"]:hover::before,
.ast-button:hover::before,
.wp-block-button__link:hover::before,
.woocommerce a.button:hover::before,
.woocommerce button.button:hover::before,
.woocommerce input.button:hover::before {
  opacity: 1;
}

/* Bouton secondaire / ghost */
.tt-btn-ghost,
.is-style-outline .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent !important;
}

.tt-btn-ghost::before,
.is-style-outline .wp-block-button__link::before,
.wp-block-button.is-style-outline .wp-block-button__link::before {
  background: transparent !important;
  filter: none !important;
}

.tt-btn-ghost:hover,
.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: rgba(62, 59, 56, 0.05) !important;
}

/* Bouton clair — tache pervenche adoucie */
.tt-btn-light::before {
  background: radial-gradient(
    ellipse 90% 80% at 50% 50%,
    var(--tt-btn-tache-soft) 0%,
    color-mix(in srgb, var(--tt-btn-tache-soft) 78%, transparent) 45%,
    transparent 72%
  );
}

/* Boutons duo logo — menthe (1er) · rose (2e) */
.tt-btn-menthe::before,
.tt-btn-rose::before {
  border: none;
  border-radius: 40%;
  filter: blur(3px);
  inset: -0.35rem -0.5rem;
  opacity: 0.88;
}

.tt-btn-menthe::before {
  background: radial-gradient(
    ellipse 90% 80% at 50% 50%,
    var(--tt-mark-menthe) 0%,
    color-mix(in srgb, var(--tt-mark-menthe) 78%, transparent) 45%,
    transparent 72%
  );
}

.tt-btn-rose::before {
  background: radial-gradient(
    ellipse 90% 80% at 50% 50%,
    var(--tt-mark-rose-doux) 0%,
    color-mix(in srgb, var(--tt-mark-rose-doux) 78%, transparent) 45%,
    transparent 72%
  );
}

.tt-btn-menthe::after,
.tt-btn-rose::after {
  content: none;
}

/* ==========================================================================
   Formulaires
   ========================================================================== */

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea,
select,
.wpcf7-form-control,
.wp-block-search__input {
  background: #ffffff;
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-md);
  box-shadow: var(--tt-shadow-sm);
  color: var(--tt-ink);
  font-family: var(--tt-font-sans);
  font-size: 1rem;
  line-height: 1.5;
  padding: 0.75rem 1rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

/* Select : éviter le tronquage vertical (Safari / Chrome / Astra) */
select {
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23454545' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: right 1rem center;
  background-repeat: no-repeat;
  background-size: 0.75rem;
  box-sizing: border-box;
  height: auto;
  line-height: normal;
  min-height: 3.25rem;
  overflow: visible;
  padding: 0.9rem 2.75rem 0.9rem 1rem;
}

input:focus,
textarea:focus,
select:focus,
.wpcf7-form-control:focus,
.wp-block-search__input:focus {
  border-color: color-mix(in srgb, var(--tt-accent) 65%, white);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--tt-accent) 35%, transparent);
  outline: none;
}

label,
.wpcf7 label {
  color: var(--tt-ink);
  font-size: 0.9375rem;
  font-weight: 500;
}

/* ==========================================================================
   Header & footer HTML custom (template-parts)
   ========================================================================== */

/* Masque le header/footer Astra (starter) quand le chrome custom est actif */
body.tt-chrome-active #masthead,
body.tt-chrome-active #ast-desktop-header,
body.tt-chrome-active #ast-mobile-header,
body.tt-chrome-active .site-footer,
body.tt-chrome-active #colophon,
body.tt-chrome-active .ast-footer-wrap,
body.tt-chrome-active .footer-adv {
  display: none !important;
}

.tt-logo {
  color: var(--tt-ink);
  text-decoration: none;
}

.tt-logo--empile {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  font-family: var(--tt-font-display);
  font-size: 1.05rem;
  letter-spacing: 0.01em;
  line-height: 0.92;
}

.tt-site-header__brand .tt-logo--empile {
  font-size: var(--tt-logo-header);
}

.tt-site-footer__logo-link .tt-logo--empile {
  font-size: var(--tt-logo-footer);
}

.tt-logo__ton {
  color: var(--tt-ink-light);
  font-size: 0.52em;
  font-weight: 400;
  white-space: nowrap;
}

.tt-logo__ton .tt-logo__t {
  color: var(--tt-ink);
  font-weight: 500;
}

.tt-logo__tandem {
  font-weight: 500;
  margin-top: 0.08em;
  padding-left: 0.42em;
  white-space: nowrap;
}

.tt-logo__t-cell {
  display: inline-block;
  position: relative;
}

.tt-logo__t {
  display: inline-block;
  position: relative;
  z-index: 1;
}

/* --------------------------------------------------------------------------
   Chrome site — barre blanche sticky + séparateur signature
   -------------------------------------------------------------------------- */

.tt-site-header {
  background: #fff;
  border-bottom: 0;
  box-sizing: border-box;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  max-width: 100vw;
  position: sticky;
  top: 0;
  width: 100vw;
  z-index: 100;
}

.tt-site-header::after {
  background: var(--tt-separator-gradient);
  bottom: 0;
  box-shadow: var(--tt-separator-shadow);
  content: "";
  height: 3px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  z-index: 1;
}

.tt-site-header__bar {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin-inline: auto;
  max-width: var(--tt-content-width);
  padding-block: 1rem;
  padding-inline: var(--tt-content-padding);
  width: 100%;
}

.tt-site-header__brand {
  flex-shrink: 0;
  isolation: isolate;
  overflow: visible;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.tt-site-header__brand:hover,
.tt-site-header__brand:focus {
  opacity: 0.8;
}

.tt-site-nav__list {
  display: flex;
  gap: 0.125rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.tt-site-nav--desktop {
  display: none;
}

.tt-site-nav__link {
  border-radius: var(--tt-radius-sm);
  color: var(--tt-ink-muted);
  display: inline-block;
  font-family: var(--tt-font-sans);
  font-size: 0.9375rem;
  font-weight: 400;
  padding: 0.375rem 0.875rem;
  position: relative;
  text-decoration: none;
  transition: color 0.2s ease;
}

.tt-site-nav__link:hover,
.tt-site-nav__link:focus {
  color: var(--tt-ink);
}

.tt-site-nav__link.is-active {
  color: var(--tt-ink);
  font-weight: 500;
}

.tt-site-nav__link.is-active::after {
  background: var(--tt-accent);
  bottom: 0;
  content: "";
  height: 2px;
  left: 0.875rem;
  position: absolute;
  right: 0.875rem;
}

.tt-site-header__actions {
  align-items: center;
  display: flex;
  gap: 1rem;
}

.tt-lang {
  align-items: baseline;
  display: flex;
  font-family: var(--tt-font-sans);
  font-size: 0.8125rem;
  gap: 0.35rem;
  letter-spacing: 0.02em;
}

.tt-lang__sep {
  color: var(--tt-ink-faint);
}

.tt-lang__current {
  color: var(--tt-ink);
  font-weight: 600;
}

.tt-lang__link {
  color: var(--tt-ink-muted);
  text-decoration: none;
}

.tt-lang__link:hover,
.tt-lang__link:focus {
  color: var(--tt-ink);
}

.tt-site-header__app-link {
  color: var(--tt-ink-muted);
  font-family: var(--tt-font-sans);
  font-size: 0.9375rem;
  text-decoration: none;
  transition: color 0.2s ease;
  white-space: nowrap;
}

.tt-site-header__app-link:hover,
.tt-site-header__app-link:focus {
  color: var(--tt-ink);
}

.tt-site-nav--mobile {
  border-top: 1px solid color-mix(in srgb, var(--tt-ink) 5%, transparent);
  margin-inline: auto;
  max-width: var(--tt-content-width);
  padding: 0.5rem var(--tt-content-padding);
  width: 100%;
}

.tt-site-nav__list--scroll {
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.tt-site-nav__list--scroll::-webkit-scrollbar {
  display: none;
}

.tt-site-nav__link--mobile {
  font-size: 0.75rem;
  white-space: nowrap;
}

.tt-site-nav__link--mobile.is-active {
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--tt-ink) 30%, transparent);
  text-underline-offset: 0.25rem;
}

.tt-site-footer {
  background: #fff;
  border-top: 0;
  box-sizing: border-box;
  clear: both;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  margin-top: 0;
  max-width: 100vw;
  padding-block: 3rem;
  position: relative;
  width: 100vw;
}

/* Séparateur coloré — entre Early access et footer */
.tt-site-footer::before {
  background: var(--tt-separator-gradient);
  box-shadow: var(--tt-separator-shadow);
  content: "";
  height: 3px;
  left: 50%;
  pointer-events: none;
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  width: min(calc(100% - 2 * var(--tt-content-padding)), var(--tt-content-width));
  z-index: 2;
}

.tt-site-footer__inner {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  margin-inline: auto;
  max-width: var(--tt-content-width);
  padding-inline: var(--tt-content-padding);
  position: relative;
  width: 100%;
  z-index: 1;
}

.tt-site-footer__logo-link {
  display: inline-block;
  isolation: isolate;
  overflow: visible;
  position: relative;
  text-decoration: none;
}

.tt-site-footer__brand {
  overflow: visible;
}

.tt-site-footer__tagline {
  color: var(--tt-ink-muted);
  font-size: 0.8125rem;
  line-height: 1.6;
  margin: 0.75rem 0 0;
  max-width: 22rem;
}

.tt-site-footer .tt-mark-slogan {
  font-size: 0.9375rem;
}

.tt-site-footer__nav-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.tt-site-footer__nav-list a {
  color: var(--tt-ink-muted);
  font-size: 0.875rem;
  text-decoration: none;
  transition: color 0.2s ease;
}

.tt-site-footer__nav-list a:hover,
.tt-site-footer__nav-list a:focus {
  color: var(--tt-ink);
}

.tt-site-footer__domains {
  color: var(--tt-ink-muted);
  font-size: 0.75rem;
  line-height: 1.65;
  margin: 1.5rem 0 0;
}

.tt-site-footer__domains a {
  color: var(--tt-ink-muted);
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--tt-ink) 20%, transparent);
  text-underline-offset: 0.15em;
  transition: color 0.2s ease, text-decoration-color 0.2s ease;
}

.tt-site-footer__domains a:hover,
.tt-site-footer__domains a:focus {
  color: var(--tt-ink);
  text-decoration-color: color-mix(in srgb, var(--tt-ink) 40%, transparent);
}

.tt-site-footer__legal-bar {
  margin-top: 0;
}

.tt-site-footer__domains + .tt-site-footer__legal-bar {
  margin-top: 1.15rem;
}

.tt-site-footer__legal {
  color: var(--tt-ink-muted);
  display: flex;
  flex-wrap: wrap;
  font-size: 0.8125rem;
  gap: 0.35rem 1.15rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.tt-site-footer__legal a {
  color: var(--tt-ink-muted);
  text-decoration: none;
  transition: color 0.2s ease;
}

.tt-site-footer__legal a:hover,
.tt-site-footer__legal a:focus {
  color: var(--tt-ink);
}

@media (min-width: 768px) {
  .tt-site-nav--desktop {
    display: block;
  }

  .tt-site-nav--mobile {
    display: none;
  }

  .tt-site-footer__inner {
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
  }

  .tt-site-footer__aside {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
  }

  .tt-site-footer__nav-list {
    justify-content: flex-end;
  }

  .tt-site-footer__domains {
    text-align: right;
  }

  .tt-site-footer__legal {
    justify-content: flex-end;
  }
}

/* Anciens sélecteurs Astra header/footer — conservés si builder réactivé */
.main-header-bar,
.site-header,
.ast-primary-header-bar,
.ast-above-header-bar,
.ast-below-header-bar {
  background: color-mix(in srgb, var(--tt-canvas) 88%, white);
  border-bottom: 1px solid var(--tt-border);
}

.main-header-menu > .menu-item > .menu-link,
.main-navigation .menu-link {
  color: var(--tt-ink);
  font-family: var(--tt-font-sans);
  font-size: 0.9375rem;
  font-weight: 500;
}

.main-header-menu > .menu-item:hover > .menu-link,
.main-header-menu > .menu-item.current-menu-item > .menu-link,
.main-header-menu > .menu-item.current-menu-ancestor > .menu-link {
  color: var(--tt-ink-light);
}

/* ==========================================================================
   Footer
   ========================================================================== */

.site-footer,
.site-below-footer-wrap,
.site-above-footer-wrap,
.site-primary-footer-wrap {
  background: var(--tt-canvas-alt);
  border-top: 1px solid var(--tt-border);
  color: var(--tt-ink-muted);
}

.site-footer a,
.site-below-footer-wrap a {
  color: var(--tt-ink);
}

/* ==========================================================================
   Blocs Gutenberg utiles
   ========================================================================== */

.wp-block-quote {
  border-left: 3px solid var(--tt-accent);
  color: var(--tt-ink-light);
  padding-left: 1.25rem;
}

.wp-block-separator {
  border: 0;
  height: 2px;
  max-width: min(calc(100% - 2rem), var(--tt-content-width));
  background: linear-gradient(
    90deg,
    transparent,
    rgba(62, 59, 56, 0.18),
    transparent
  );
}

.wp-block-table table {
  border-color: var(--tt-border-strong);
}

.wp-block-table th {
  background: var(--tt-canvas-alt);
  color: var(--tt-ink);
  font-weight: 600;
}

/* ==========================================================================
   Utilitaires charte — classes à poser dans l’éditeur
   ========================================================================== */

.tt-text-muted { color: var(--tt-ink-muted) !important; }
.tt-text-ink { color: var(--tt-ink) !important; }
.tt-bg-canvas { background-color: var(--tt-canvas) !important; }
.tt-bg-canvas-alt { background-color: var(--tt-canvas-alt) !important; }
.tt-bg-menthe { background-color: var(--tt-pastel-menthe) !important; }
.tt-bg-rose { background-color: var(--tt-pastel-rose) !important; }
.tt-bg-lilas { background-color: var(--tt-pastel-lilas) !important; }
.tt-bg-beurre { background-color: var(--tt-pastel-beurre) !important; }
.tt-bg-ciel { background-color: var(--tt-pastel-ciel) !important; }
.tt-bg-corail { background-color: var(--tt-pastel-corail) !important; }
.tt-bg-sage { background-color: var(--tt-accent) !important; }
.tt-bg-sage-soft { background-color: var(--tt-accent-soft) !important; }
.tt-bg-canvas-warm { background-color: var(--tt-canvas-warm) !important; }
.tt-bg-canvas-deep { background-color: var(--tt-canvas-deep) !important; }
.tt-rounded-lg { border-radius: var(--tt-radius-lg) !important; }
.tt-rounded-xl { border-radius: var(--tt-radius-xl) !important; }

.tt-mark-halo {
  border-radius: 0.2em;
  inset: -0.1em -0.06em -0.08em;
  pointer-events: none;
  position: absolute;
  z-index: 0;
}

.tt-mark-halo.tt-mark-halo-menthe {
  background: radial-gradient(
    ellipse 78% 70% at 50% 48%,
    var(--tt-mark-menthe) 0%,
    color-mix(in srgb, var(--tt-mark-menthe) 78%, transparent) 38%,
    color-mix(in srgb, var(--tt-mark-menthe) 32%, transparent) 60%,
    transparent 76%
  );
}

.tt-mark-halo.tt-mark-halo-rose {
  background: radial-gradient(
    ellipse 78% 70% at 50% 48%,
    var(--tt-mark-rose-doux) 0%,
    color-mix(in srgb, var(--tt-mark-rose-doux) 78%, transparent) 38%,
    color-mix(in srgb, var(--tt-mark-rose-doux) 32%, transparent) 60%,
    transparent 76%
  );
}

.tt-logo__t.tt-mark-halo-menthe::before,
.tt-logo__t.tt-mark-halo-rose::before {
  border-radius: 0.2em;
  content: "";
  inset: -0.1em -0.06em -0.08em;
  pointer-events: none;
  position: absolute;
  z-index: 0;
}

.tt-logo__t.tt-mark-halo-menthe::before {
  background: radial-gradient(
    ellipse 78% 70% at 50% 48%,
    var(--tt-mark-menthe) 0%,
    color-mix(in srgb, var(--tt-mark-menthe) 78%, transparent) 38%,
    color-mix(in srgb, var(--tt-mark-menthe) 32%, transparent) 60%,
    transparent 76%
  );
}

.tt-logo__t.tt-mark-halo-rose::before {
  background: radial-gradient(
    ellipse 78% 70% at 50% 48%,
    var(--tt-mark-rose-doux) 0%,
    color-mix(in srgb, var(--tt-mark-rose-doux) 78%, transparent) 38%,
    color-mix(in srgb, var(--tt-mark-rose-doux) 32%, transparent) 60%,
    transparent 76%
  );
}

/* ==========================================================================
   Page d’accueil — early access
   ========================================================================== */

body.home .entry-header,
body.home .ast-single-entry-banner,
body.home .tt-accueil-wrap > .ast-container {
  display: none;
}

body.home .tt-accueil-wrap,
body.home .tt-accueil-wrap #primary,
body.home .tt-accueil-wrap .site-main {
  margin: 0;
  max-width: 100%;
  padding: 0;
  width: 100%;
}

.tt-accueil__container {
  box-sizing: border-box;
  margin-inline: auto;
  max-width: none;
  padding-inline: 0;
  width: 100%;
}

.tt-accueil-hero__nom {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(2.75rem, 6vw, 4.5rem);
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.1;
  margin: 0;
}

.tt-accueil-hero__nom-ton {
  color: var(--tt-ink-light);
  font-weight: 400;
}

.tt-accueil-hero__nom-tandem {
  font-weight: 500;
}

.tt-logo--hero {
  font-size: clamp(2.75rem, 6vw, 4.5rem);
}

.tt-accueil-h2 {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.5rem, 3vw, 1.875rem);
  font-weight: 400;
  line-height: var(--tt-line-height-tight);
  margin: 0;
}

.tt-accueil-h3 {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.35rem, 2.5vw, 1.5rem);
  font-weight: 400;
  margin: 0.5rem 0 0;
}

.tt-accueil-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 2.25rem;
}

@media (max-width: 639px) {
  .tt-accueil-actions,
  .tt-accueil-hero .tt-accueil-actions,
  .tt-faq-contact__actions {
    justify-content: center;
  }

  .tt-accueil-actions .wp-block-button__link,
  .tt-faq-contact__actions .wp-block-button__link {
    min-height: 2.75rem;
  }
}

.tt-accueil-actions--center {
  justify-content: center;
  margin-top: 2rem;
}

.tt-accueil-hero .tt-accueil-actions {
  gap: 1.35rem;
  padding-bottom: 0.5rem;
}

/* Bouton unique early : centré sous le bloc texte (même largeur max que le slogan) */
.tt-accueil-hero .tt-accueil-actions--center {
  justify-content: center;
  max-width: 28rem;
  width: 100%;
}


.tt-accueil-hero__grid {
  align-items: stretch;
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr;
  min-height: 0;
  padding-block: 0;
}

.tt-accueil-hero__slogan {
  color: var(--tt-ink);
  font-size: clamp(1.5rem, 3vw, 1.875rem);
  font-weight: 500;
  line-height: 1.35;
  margin-top: 1.5rem;
  max-width: 28rem;
}

.tt-accueil-hero__baseline {
  color: var(--tt-ink-muted);
  font-size: clamp(1rem, 2vw, 1.125rem);
  line-height: 1.65;
  margin: 1rem 0 0;
  max-width: 28rem;
}

.tt-accueil-hero__support {
  font-size: clamp(0.9375rem, 1.5vw, 1rem);
  line-height: 1.65;
  margin: 0.75rem 0 0;
  max-width: 28rem;
}

/* Illustrations accueil — mockups ProductShot (HTML, pas PNG) */
.tt-accueil-preview-wrap {
  isolation: isolate;
  overflow: visible;
  position: relative;
}

.tt-accueil-preview-wrap::before {
  background:
    radial-gradient(ellipse 72% 88% at 0% 52%, color-mix(in srgb, var(--tt-v-rose) 72%, white), transparent 68%),
    radial-gradient(ellipse 72% 88% at 100% 48%, color-mix(in srgb, var(--tt-v-menthe) 72%, white), transparent 68%);
  border-radius: calc(var(--tt-radius-xl) + 0.5rem);
  content: "";
  filter: blur(18px);
  inset: -0.85rem -0.85rem -0.5rem;
  opacity: 0.5;
  pointer-events: none;
  position: absolute;
  z-index: 0;
}

.tt-accueil-preview-wrap .tt-app-frame {
  border-color: color-mix(in srgb, var(--tt-accent) 40%, var(--tt-border-strong));
  box-shadow:
    var(--tt-shadow-md),
    0 14px 42px -16px color-mix(in srgb, var(--tt-v-rose) 32%, transparent),
    0 10px 30px -12px color-mix(in srgb, var(--tt-v-menthe) 36%, transparent);
  position: relative;
  z-index: 1;
}

.tt-accueil-preview-wrap .tt-app-frame__bar {
  background: linear-gradient(180deg, #fff 0%, color-mix(in srgb, var(--tt-canvas-warm) 65%, white) 100%);
  border-bottom: none;
  padding: 0.55rem 0.875rem;
  position: relative;
}

.tt-accueil-preview-wrap .tt-app-frame__bar::after {
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--tt-v-rose) 55%, transparent) 0%,
    color-mix(in srgb, var(--tt-accent) 45%, transparent) 50%,
    color-mix(in srgb, var(--tt-v-menthe) 55%, transparent) 100%
  );
  bottom: 0;
  content: "";
  height: 2px;
  left: 0;
  opacity: 0.85;
  position: absolute;
  right: 0;
}

.tt-accueil-preview-wrap .tt-app-frame__dots span {
  background: color-mix(in srgb, var(--tt-ink) 14%, transparent);
  height: 0.3125rem;
  width: 0.3125rem;
}

.tt-accueil-preview-wrap .tt-app-frame__dot-accent {
  background: var(--tt-v-menthe) !important;
}

.tt-accueil-preview-wrap .tt-app-frame__title {
  color: var(--tt-ink-light);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: none;
}

.tt-accueil-preview-wrap .tt-shot-canvas {
  background: linear-gradient(180deg, #fff 0%, var(--tt-canvas-warm) 100%);
}

/* Hub neutre — pont entre barre et cartes colorées */
.tt-accueil-preview-wrap .tt-shot-panel {
  background: #fff;
  border-color: var(--tt-border-strong);
  box-shadow: var(--tt-shadow-sm);
  padding: 1.05rem 1.25rem 1rem;
}

.tt-accueil-preview-wrap .tt-shot-panel .tt-shot-eyebrow {
  color: color-mix(in srgb, var(--tt-accent) 55%, var(--tt-ink-muted));
  letter-spacing: 0.14em;
}

.tt-accueil-preview-wrap .tt-shot-panel .tt-shot-eyebrow::after {
  background: linear-gradient(90deg, var(--tt-v-rose) 0%, var(--tt-v-menthe) 100%);
  border-radius: var(--tt-radius-pill);
  content: "";
  display: block;
  height: 2px;
  margin: 0.45rem auto 0;
  opacity: 0.72;
  width: 2.75rem;
}

.tt-accueil-preview-wrap .tt-shot-panel .tt-shot-heading {
  font-size: 1.0625rem;
  font-weight: 500;
  margin-top: 0.65rem;
}

.tt-accueil-preview-wrap .tt-shot-stack {
  gap: 0.75rem;
  margin-top: 0.875rem;
}

.tt-shot-metier .tt-shot-stack {
  gap: 0.75rem;
  margin-top: 0.875rem;
}

.tt-accueil-preview-wrap .tt-shot-metier .tt-shot-canvas,
.tt-shot-metier .tt-shot-canvas {
  background: #fff;
  padding: 1rem;
}

.tt-accueil-preview-wrap .tt-shot-metier .tt-shot-panel,
.tt-shot-metier .tt-shot-panel {
  background: #fff;
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-lg);
  box-shadow: none;
  padding: 1.15rem 1.25rem 1.1rem;
  text-align: center;
}

.tt-accueil-preview-wrap .tt-shot-metier .tt-shot-panel .tt-shot-eyebrow,
.tt-shot-metier .tt-shot-panel .tt-shot-eyebrow {
  color: var(--tt-ink-light);
  letter-spacing: 0.14em;
}

.tt-accueil-preview-wrap .tt-shot-metier .tt-shot-panel .tt-shot-eyebrow::after,
.tt-shot-metier .tt-shot-panel .tt-shot-eyebrow::after {
  display: none;
}

.tt-accueil-preview-wrap .tt-shot-metier .tt-shot-heading,
.tt-shot-metier .tt-shot-panel .tt-shot-heading {
  font-family: var(--tt-font-display);
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.3;
  margin-top: 0.55rem;
}

.tt-accueil-preview-wrap .tt-shot-stack--single {
  margin-top: 0.75rem;
}

/* Référence hero — mint / rose, pastilles blanches */
.tt-accueil-preview-wrap .tt-shot-stack .tt-shot-card--clients,
.tt-shot-metier .tt-shot-stack .tt-shot-card--clients,
.tt-shot-metier .tt-shot-stack .tt-shot-card:first-child {
  background: #f0f9f4;
  border-color: color-mix(in srgb, var(--tt-mark-menthe) 24%, #dde8e2);
}

.tt-accueil-preview-wrap .tt-shot-stack .tt-shot-card--activite,
.tt-shot-metier .tt-shot-stack .tt-shot-card--activite,
.tt-shot-metier .tt-shot-stack .tt-shot-card:last-child {
  background: #fff5f5;
  border-color: color-mix(in srgb, var(--tt-pastel-rose) 42%, #ebe4e4);
}

.tt-accueil-preview-wrap .tt-shot-metier .tt-shot-card,
.tt-shot-metier .tt-shot-card {
  border-radius: var(--tt-radius-lg);
  border-width: 1px;
  box-shadow: none;
}

/* Ancien HTML avec bande latérale — masquer */
.tt-shot-metier .tt-shot-stripe {
  display: none;
}

.tt-accueil-preview-wrap .tt-shot-metier .tt-shot-tag--ciel,
.tt-accueil-preview-wrap .tt-shot-metier .tt-shot-tag--lilas,
.tt-shot-metier .tt-shot-tag--ciel,
.tt-shot-metier .tt-shot-tag--lilas {
  background: #fff;
  border: 1px solid color-mix(in srgb, var(--tt-ink) 14%, transparent);
  border-radius: 0.4375rem;
  box-shadow: 0 1px 2px rgba(62, 59, 56, 0.07);
  font-weight: 500;
}

.tt-accueil-preview-wrap .tt-shot-metier .tt-shot-card__body,
.tt-shot-metier .tt-shot-card__body {
  padding: 1rem 1.05rem 1.05rem;
}

.tt-accueil-preview-wrap .tt-shot-metier .tt-shot-card__title,
.tt-shot-metier .tt-shot-card__title {
  font-size: 1.1875rem;
  font-weight: 600;
  line-height: 1.25;
}

.tt-accueil-preview-wrap .tt-shot-metier .tt-shot-card__text,
.tt-shot-metier .tt-shot-card__text {
  color: var(--tt-ink-light);
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
  margin-top: 0.45rem;
}

.tt-accueil-preview-wrap .tt-shot-metier .tt-shot-tag,
.tt-shot-metier .tt-shot-tag {
  font-size: 0.8125rem;
  padding: 0.32rem 0.62rem;
}

.tt-accueil-preview-wrap .tt-shot-metier .tt-shot-tags,
.tt-shot-metier .tt-shot-tags {
  gap: 0.35rem;
  margin-top: 0.65rem;
}

.tt-accueil-preview-wrap .tt-shot-badge {
  background: #fff;
  border-color: color-mix(in srgb, var(--tt-accent) 35%, var(--tt-border-strong));
}

.tt-accueil-preview-wrap .tt-shot-tabs__active {
  background: #fff;
  border-color: color-mix(in srgb, var(--tt-accent) 45%, transparent);
}

/* Caption — halos duo + trait pont */
.tt-accueil-caption,
.tt-accueil-hero__caption {
  background-image: linear-gradient(90deg, var(--tt-v-rose) 0%, var(--tt-v-menthe) 100%);
  background-position: bottom center;
  background-repeat: no-repeat;
  background-size: min(11rem, 72%) 2px;
  color: var(--tt-ink);
  display: block;
  font-family: var(--tt-font-display);
  font-size: clamp(0.975rem, 1.55vw, 1.125rem);
  font-weight: 500;
  letter-spacing: 0.015em;
  line-height: 1.4;
  margin-inline: auto;
  max-width: 100%;
  padding: 0.85em 1.35em 1.15em;
  position: relative;
  text-align: center;
  width: fit-content;
  z-index: 0;
}

.tt-accueil-caption::before,
.tt-accueil-hero__caption::before {
  background: radial-gradient(
    ellipse 85% 95% at 8% 50%,
    color-mix(in srgb, var(--tt-mark-menthe) 62%, white),
    transparent 68%
  );
  border: none;
  border-radius: 0;
  content: "";
  filter: blur(12px);
  inset: -0.35em 28% -0.75em -12%;
  opacity: 0.62;
  pointer-events: none;
  position: absolute;
  z-index: -1;
}

.tt-accueil-caption::after,
.tt-accueil-hero__caption::after {
  background: radial-gradient(
    ellipse 85% 95% at 92% 50%,
    color-mix(in srgb, var(--tt-mark-rose-doux) 62%, white),
    transparent 68%
  );
  border: none;
  border-radius: 0;
  content: "";
  filter: blur(12px);
  inset: -0.35em -12% -0.75em 28%;
  opacity: 0.62;
  pointer-events: none;
  position: absolute;
  z-index: -1;
}

.tt-accueil-hero__caption {
  background-image: none;
  grid-column: 1 / -1;
  margin: clamp(1.5rem, 3vw, 2rem) auto 0;
  padding-bottom: 0.85em;
}

.tt-accueil-quoi .tt-accueil-caption {
  margin-top: 3rem;
}

@media (min-width: 900px) {
  .tt-accueil-hero__caption {
    white-space: nowrap;
  }
}

.tt-shot-figure__caption {
  color: var(--tt-ink-light);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.65;
  margin: 1rem 0 0;
}

.tt-shot-figure {
  margin: 0;
}

.tt-app-frame {
  background: #fff;
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-xl);
  box-shadow: var(--tt-shadow-md);
  overflow: hidden;
}

.tt-app-frame--compact {
  border-radius: var(--tt-radius-lg);
}

.tt-app-frame__bar {
  align-items: center;
  background: var(--tt-canvas);
  border-bottom: 1px solid var(--tt-border);
  display: flex;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
}

.tt-app-frame__dots {
  display: flex;
  gap: 0.25rem;
}

.tt-app-frame__dots span {
  background: color-mix(in srgb, var(--tt-ink) 15%, transparent);
  border-radius: 999px;
  height: 0.375rem;
  width: 0.375rem;
}

.tt-app-frame__dot-accent {
  background: var(--tt-mark-menthe) !important;
}

.tt-app-frame__title {
  color: var(--tt-ink-light);
  font-family: var(--tt-font-display);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  margin: 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.tt-shot-canvas {
  background: linear-gradient(180deg, var(--tt-canvas) 0%, var(--tt-canvas-warm) 100%);
  padding: 0.875rem;
}

.tt-shot-panel {
  background: #fff;
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-lg);
  box-shadow: var(--tt-shadow-sm);
  padding: 1rem 1.25rem;
}

.tt-shot-panel--center {
  text-align: center;
}

.tt-shot-eyebrow {
  color: var(--tt-ink-light);
  font-family: var(--tt-font-display);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  margin: 0;
  text-transform: uppercase;
}

.tt-shot-eyebrow--tight {
  letter-spacing: 0.12em;
  margin-top: 0.75rem;
}

.tt-shot-heading {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 500;
  line-height: 1.25;
  margin: 0.5rem 0 0;
}

.tt-shot-lead {
  color: var(--tt-ink-light);
  font-size: 0.6875rem;
  font-weight: 500;
  line-height: 1.55;
  margin: 0.5rem auto 0;
  max-width: 18rem;
}

.tt-shot-stack {
  display: grid;
  gap: 0.625rem;
  margin-top: 0.75rem;
}

.tt-shot-card {
  background: #fff;
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-md);
  box-shadow: var(--tt-shadow-sm);
  display: flex;
  overflow: hidden;
}

.tt-shot-stripe {
  flex-shrink: 0;
  width: 0.375rem;
}

.tt-shot-card__body {
  min-width: 0;
  padding: 0.75rem 0.875rem;
}

.tt-shot-card__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.25;
  margin: 0;
}

.tt-shot-card__text {
  color: var(--tt-ink-light);
  font-size: 0.6875rem;
  font-weight: 500;
  line-height: 1.45;
  margin: 0.35rem 0 0;
}

.tt-shot-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-top: 0.5rem;
}

.tt-shot-tag {
  border: 1px solid var(--tt-border);
  border-radius: var(--tt-radius-sm);
  color: var(--tt-ink);
  font-size: 0.5625rem;
  font-weight: 600;
  padding: 0.125rem 0.375rem;
}

.tt-shot-stripe.tt-bg-ciel,
.tt-shot-stripe.tt-bg-lilas,
.tt-shot-stripe.tt-bg-sage {
  background: linear-gradient(180deg, var(--tt-v-rose) 0%, var(--tt-v-menthe) 100%) !important;
}

.tt-shot-tag--ciel { background: color-mix(in srgb, var(--tt-accent-soft) 65%, white); }
.tt-shot-tag--lilas { background: color-mix(in srgb, var(--tt-accent-soft) 65%, white); }

.tt-shot-mission__grid {
  display: grid;
  gap: 0;
}

.tt-shot-mission__main {
  border-bottom: 1px solid var(--tt-border);
  padding: 1rem 1.125rem;
}

.tt-shot-mission__recap {
  background: rgba(255, 255, 255, 0.72);
  padding: 1rem 1.125rem 1.125rem;
}

.tt-shot-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
}

.tt-shot-badge {
  border-radius: var(--tt-radius-sm);
  font-size: 0.5625rem;
  font-weight: 600;
  padding: 0.125rem 0.375rem;
}

.tt-shot-badge--mono {
  background: color-mix(in srgb, var(--tt-ink) 5%, transparent);
  color: var(--tt-ink-muted);
  font-family: ui-monospace, monospace;
}

.tt-shot-badge--urgent {
  background: color-mix(in srgb, var(--tt-pastel-corail) 60%, white);
  color: var(--tt-ink);
}

.tt-shot-mission__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: 0.9375rem;
  font-weight: 300;
  line-height: 1.35;
  margin: 0.5rem 0 0;
}

.tt-shot-mission__client {
  color: var(--tt-ink-muted);
  font-size: 0.625rem;
  font-style: italic;
  margin: 0.125rem 0 0;
}

.tt-shot-chrono {
  align-items: center;
  background: color-mix(in srgb, var(--tt-pastel-beurre) 40%, white);
  border-radius: var(--tt-radius-md);
  display: flex;
  gap: 0.5rem;
  margin-top: 0.75rem;
  padding: 0.5rem 0.625rem;
}

.tt-shot-chrono__dot {
  background: #8b5cf6;
  border-radius: 999px;
  flex-shrink: 0;
  height: 0.375rem;
  width: 0.375rem;
}

.tt-shot-chrono__label {
  color: var(--tt-ink);
  font-size: 0.5625rem;
  font-weight: 600;
}

.tt-shot-chrono__time {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: 0.875rem;
  font-variant-numeric: tabular-nums;
  font-weight: 300;
  margin-left: auto;
}

.tt-shot-thread {
  display: grid;
  gap: 0.625rem;
  margin-top: 0.625rem;
}

.tt-shot-bubble {
  border-radius: var(--tt-radius-md);
  padding: 0.5rem 0.625rem;
}

.tt-shot-bubble--in {
  background: color-mix(in srgb, var(--tt-pastel-ciel) 45%, white);
  border-top-left-radius: 0.125rem;
}

.tt-shot-bubble--out {
  background: color-mix(in srgb, var(--tt-pastel-lilas) 45%, white);
  border-top-right-radius: 0.125rem;
  margin-left: 0.75rem;
}

.tt-shot-bubble--live {
  background: color-mix(in srgb, var(--tt-pastel-menthe) 20%, white);
  border: 1px dashed color-mix(in srgb, var(--tt-pastel-menthe) 55%, transparent);
}

.tt-shot-bubble__meta {
  color: var(--tt-ink-muted);
  font-size: 0.5rem;
  font-weight: 600;
  margin: 0;
}

.tt-shot-bubble__text {
  color: var(--tt-ink);
  font-size: 0.625rem;
  line-height: 1.35;
  margin: 0.125rem 0 0;
}

.tt-shot-tabs {
  display: flex;
  gap: 0.25rem;
  margin-top: 0.375rem;
}

.tt-shot-tabs span {
  border-radius: var(--tt-radius-sm);
  color: var(--tt-ink-muted);
  font-size: 0.5625rem;
  padding: 0.125rem 0.375rem;
}

.tt-shot-tabs__active {
  background: #fff;
  box-shadow: var(--tt-shadow-sm);
  color: var(--tt-ink) !important;
  font-weight: 500;
}

.tt-shot-recap__name {
  color: var(--tt-ink);
  font-size: 0.8125rem;
  font-weight: 600;
  margin: 0.625rem 0 0;
}

.tt-shot-recap__block {
  border-radius: var(--tt-radius-md);
  margin-top: 0.625rem;
  padding: 0.5rem 0.625rem;
}

.tt-shot-recap__block--menthe { background: color-mix(in srgb, var(--tt-pastel-menthe) 35%, white); }
.tt-shot-recap__block--beurre { background: color-mix(in srgb, var(--tt-pastel-beurre) 45%, white); }
.tt-shot-recap__block--peche { background: color-mix(in srgb, var(--tt-pastel-peche) 40%, white); }
.tt-shot-recap__block--lilas { background: color-mix(in srgb, var(--tt-pastel-lilas) 30%, white); }

.tt-shot-recap__label {
  color: var(--tt-ink);
  font-size: 0.5625rem;
  font-weight: 600;
  margin: 0;
  text-transform: uppercase;
}

.tt-shot-recap__hint {
  color: var(--tt-ink);
  font-size: 0.5625rem;
  line-height: 1.4;
  margin: 0.125rem 0 0;
}

.tt-shot-progress {
  background: color-mix(in srgb, var(--tt-ink) 8%, transparent);
  border-radius: 999px;
  height: 0.25rem;
  margin-top: 0.375rem;
  overflow: hidden;
}

.tt-shot-progress span {
  background: var(--tt-mark-menthe);
  border-radius: 999px;
  display: block;
  height: 100%;
}

.tt-shot-interne__grid {
  display: grid;
  gap: 0;
}

.tt-shot-interne__col {
  padding: 0.75rem;
}

.tt-shot-interne__col + .tt-shot-interne__col {
  border-top: 1px solid var(--tt-border);
}

.tt-shot-interne__sub {
  color: var(--tt-ink-muted);
  font-size: 0.5625rem;
  margin: 0.125rem 0 0;
}

.tt-shot-stats {
  display: grid;
  gap: 0.375rem;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 0.5rem;
}

.tt-shot-stat {
  background: #fff;
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-md);
  padding: 0.375rem 0.25rem;
  text-align: center;
}

.tt-shot-stat strong {
  color: var(--tt-ink);
  display: block;
  font-family: var(--tt-font-display);
  font-size: 0.875rem;
  font-weight: 300;
}

.tt-shot-stat span {
  color: var(--tt-ink-muted);
  display: block;
  font-size: 0.5rem;
  margin-top: 0.125rem;
}

.tt-shot-list {
  display: grid;
  gap: 0.375rem;
  margin-top: 0.5rem;
}

.tt-shot-list__item {
  background: #fff;
  border: 1px solid color-mix(in srgb, var(--tt-pastel-lilas) 40%, transparent);
  border-radius: var(--tt-radius-md);
  padding: 0.375rem 0.5rem;
}

.tt-shot-list__title {
  color: var(--tt-ink);
  font-size: 0.6875rem;
  font-weight: 600;
  margin: 0;
}

.tt-shot-list__meta {
  color: var(--tt-ink-muted);
  font-size: 0.5rem;
  margin: 0.125rem 0 0;
}

.tt-shot-pub {
  align-items: center;
  background: #fff;
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-md);
  display: flex;
  gap: 0.375rem;
  padding: 0.375rem 0.5rem;
}

.tt-shot-pub__state {
  color: var(--tt-ink);
  flex-shrink: 0;
  font-size: 0.5rem;
  font-weight: 600;
  padding: 0.125rem 0.375rem;
}

.tt-shot-pub__title {
  color: var(--tt-ink);
  font-size: 0.6875rem;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (min-width: 640px) {
  .tt-shot-mission__grid {
    grid-template-columns: 1.15fr 0.85fr;
  }

  .tt-shot-mission__main {
    border-bottom: 0;
    border-right: 1px solid var(--tt-border);
  }

  .tt-shot-interne__grid {
    grid-template-columns: 1fr 1fr;
  }

  .tt-shot-interne__col + .tt-shot-interne__col {
    border-left: 1px solid var(--tt-border);
    border-top: 0;
  }
}

/* Accueil — mockup mission en colonne pour respirer */
.tt-accueil-preview-wrap .tt-shot-mission__grid {
  grid-template-columns: 1fr;
}

.tt-accueil-preview-wrap .tt-shot-mission__main {
  border-bottom: 1px solid var(--tt-border);
  border-right: 0;
  padding: 1.125rem 1.25rem 1.25rem;
}

.tt-accueil-preview-wrap .tt-shot-mission__recap {
  padding: 1.125rem 1.25rem 1.375rem;
}

.tt-accueil-preview-wrap .tt-shot-canvas {
  padding: 0;
}

/* Mockups mission / interne — pastels plus présents (aligné hero, sans trahir l’appli) */
.tt-accueil-preview-wrap .tt-shot-mission__main {
  background: color-mix(in srgb, var(--tt-pastel-ciel) 10%, white);
}

.tt-accueil-preview-wrap .tt-shot-mission__recap {
  background: color-mix(in srgb, var(--tt-pastel-ciel) 20%, white);
}

.tt-accueil-preview-wrap .tt-shot-chrono {
  background: color-mix(in srgb, var(--tt-pastel-beurre) 58%, white);
  border: 1px solid color-mix(in srgb, var(--tt-pastel-beurre) 72%, var(--tt-border-strong));
  box-shadow: var(--tt-shadow-sm);
}

.tt-accueil-preview-wrap .tt-shot-bubble--in {
  background: color-mix(in srgb, var(--tt-pastel-ciel) 58%, white);
  border: 1px solid color-mix(in srgb, var(--tt-accent) 24%, transparent);
}

.tt-accueil-preview-wrap .tt-shot-bubble--out {
  background: color-mix(in srgb, var(--tt-pastel-lilas) 56%, white);
  border: 1px solid color-mix(in srgb, var(--tt-v-rose) 20%, transparent);
}

.tt-accueil-preview-wrap .tt-shot-recap__block--menthe {
  background: color-mix(in srgb, var(--tt-pastel-menthe) 52%, white);
  border: 1px solid color-mix(in srgb, var(--tt-mark-menthe) 28%, transparent);
}

.tt-accueil-preview-wrap .tt-shot-recap__block--beurre {
  background: color-mix(in srgb, var(--tt-pastel-beurre) 58%, white);
  border: 1px solid color-mix(in srgb, var(--tt-pastel-beurre) 55%, transparent);
}

.tt-accueil-preview-wrap .tt-shot-recap__block--peche {
  background: color-mix(in srgb, var(--tt-pastel-peche) 54%, white);
  border: 1px solid color-mix(in srgb, var(--tt-pastel-peche) 48%, transparent);
}

.tt-accueil-preview-wrap .tt-shot-interne__col:first-child {
  background: color-mix(in srgb, var(--tt-pastel-ciel) 24%, white);
}

.tt-accueil-preview-wrap .tt-shot-interne__col:last-child {
  background: color-mix(in srgb, var(--tt-pastel-rose) 22%, white);
}

.tt-accueil-preview-wrap .tt-shot-list__item {
  background: #fff;
  border-color: color-mix(in srgb, var(--tt-accent) 18%, var(--tt-border-strong));
  box-shadow: var(--tt-shadow-sm);
}

.tt-accueil-preview-wrap .tt-shot-pub {
  background: #fff;
  border-color: color-mix(in srgb, var(--tt-accent) 16%, var(--tt-border-strong));
  box-shadow: var(--tt-shadow-sm);
}

.tt-accueil-preview-wrap .tt-shot-pub__state.tt-bg-corail {
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--tt-v-rose) 22%, transparent),
    0 0 8px 1px color-mix(in srgb, var(--tt-v-rose) 24%, transparent);
}

.tt-accueil-preview-wrap .tt-shot-pub__state.tt-bg-ciel {
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--tt-accent) 24%, transparent),
    0 0 8px 1px color-mix(in srgb, var(--tt-accent) 26%, transparent);
}

.tt-accueil-preview-wrap .tt-shot-pub__state.tt-bg-lilas {
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--tt-v-rose) 18%, transparent),
    0 0 8px 1px color-mix(in srgb, var(--tt-pastel-lilas) 30%, transparent);
}

.tt-accueil-preview-wrap .tt-shot-stat {
  border-color: color-mix(in srgb, var(--tt-accent) 22%, var(--tt-border-strong));
  box-shadow: var(--tt-shadow-sm);
}

@media (min-width: 1200px) {
  .tt-accueil-preview-wrap .tt-shot-mission__grid {
    grid-template-columns: 1.08fr 0.92fr;
  }

  .tt-accueil-preview-wrap .tt-shot-mission__main {
    border-bottom: 0;
    border-right: 1px solid var(--tt-border);
  }

  .tt-accueil-terrains--diptyque .tt-accueil-preview-wrap .tt-app-frame {
    transform: scale(1.14);
    width: calc(100% / 1.14);
  }
}

/* Section quoi + terrains (fond blanc, typo hero) */
.tt-accueil-quoi .tt-eyebrow {
  color: color-mix(in srgb, var(--tt-accent) 55%, var(--tt-ink-muted));
  font-family: var(--tt-font-display);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  margin: 0;
  text-transform: uppercase;
}

.tt-accueil-quoi__head,
.tt-accueil-quoi__head-block {
  margin-top: 0.75rem;
  max-width: none;
  width: 100%;
}

.tt-accueil-quoi__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.5rem, 3vw, 1.875rem);
  font-weight: 500;
  line-height: 1.35;
  margin: 0.75rem 0 0;
  max-width: none;
}

.tt-accueil-quoi__pictos {
  display: grid;
  gap: clamp(0.75rem, 2vw, 1.75rem);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  list-style: none;
  margin: clamp(2rem, 4vw, 2.75rem) 0 0;
  padding: 0;
  position: relative;
}

.tt-accueil-quoi__pictos::before {
  display: none;
}

@media (min-width: 900px) {
  .tt-accueil-quoi__pictos {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .tt-accueil-quoi__pictos::before {
    background: color-mix(in srgb, var(--tt-ink) 28%, transparent);
    content: "";
    display: block;
    height: 1px;
    left: 6%;
    position: absolute;
    right: 6%;
    top: clamp(2.75rem, 12vw, 4.5rem);
  }
}

.tt-accueil-picto {
  margin: 0;
  min-width: 0;
  position: relative;
  text-align: center;
  z-index: 1;
}

.tt-accueil-picto__halo {
  align-items: center;
  display: flex;
  height: clamp(4.5rem, 14vw, 9rem);
  justify-content: center;
  margin-inline: auto;
  position: relative;
  width: clamp(4.5rem, 14vw, 9rem);
}

.tt-accueil-picto__icon {
  display: block;
  height: 100%;
  position: relative;
  width: 100%;
}

.tt-accueil-picto__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(0.8125rem, 1.6vw, 1.125rem);
  font-weight: 500;
  line-height: 1.3;
  margin: 0.125rem 0 0;
}

.tt-accueil-picto__text {
  color: var(--tt-ink-light);
  font-size: clamp(0.75rem, 1.3vw, 0.9375rem);
  line-height: 1.55;
  margin: 0.5rem auto 0;
  max-width: 14rem;
}

.tt-accueil-quoi__pourquoi {
  border-top: 1px solid transparent;
  border-image: linear-gradient(
      90deg,
      transparent 0%,
      color-mix(in srgb, var(--tt-mark-menthe) 55%, transparent) 18%,
      color-mix(in srgb, var(--tt-mark-rose-doux) 50%, transparent) 82%,
      transparent 100%
    )
    1;
  margin-top: clamp(3rem, 6vw, 4.5rem);
  max-width: none;
  padding-top: clamp(2.5rem, 5vw, 3.5rem);
  width: 100%;
}

.tt-accueil-quoi__subtitle {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.5rem, 3vw, 1.875rem);
  font-weight: 500;
  line-height: 1.35;
  margin: 0.75rem 0 0;
  max-width: none;
}

.tt-accueil-quoi__lead {
  color: var(--tt-ink-light);
  font-size: clamp(0.9375rem, 1.5vw, 1.0625rem);
  line-height: 1.65;
  margin: 1rem 0 0;
  max-width: none;
}

.tt-accueil-terrains {
  display: flex;
  flex-direction: column;
  gap: clamp(3rem, 7vw, 5rem);
  margin-bottom: clamp(0.5rem, 1.5vw, 1rem);
  margin-top: clamp(2.75rem, 5vw, 3.75rem);
}

.tt-accueil-terrain {
  align-items: stretch;
  background: transparent;
  border: 0;
  box-shadow: none;
  display: grid;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  grid-template-columns: 1fr;
  overflow: visible;
}

.tt-accueil-terrain__copy {
  display: flex;
  flex-direction: column;
  gap: 0;
  justify-content: center;
  max-width: 30rem;
  padding: clamp(0.5rem, 1.5vw, 1rem) 0 clamp(0.5rem, 1.5vw, 1rem) clamp(1.1rem, 2vw, 1.35rem);
  position: relative;
}

.tt-accueil-terrain__copy::before {
  border-radius: 999px;
  content: "";
  inset: 0.35rem auto 0.35rem 0;
  position: absolute;
  width: 0.22rem;
}

.tt-accueil-terrain--clients .tt-accueil-terrain__copy::before {
  background: linear-gradient(180deg, var(--tt-mark-rose) 0%, var(--tt-v-rose) 100%);
}

.tt-accueil-terrain--activite .tt-accueil-terrain__copy::before {
  background: linear-gradient(180deg, var(--tt-mark-menthe) 0%, var(--tt-accent) 100%);
}

.tt-accueil-terrain__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.25rem, 2.1vw, 1.4375rem);
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.3;
  margin: 0;
}

.tt-accueil-terrain__points {
  display: flex;
  flex-direction: column;
  gap: 0;
  list-style: none;
  margin: clamp(1rem, 2vw, 1.35rem) 0 0;
  padding: 0;
}

.tt-accueil-terrain__points li {
  color: var(--tt-ink-light);
  font-size: clamp(0.9375rem, 1.45vw, 1.0625rem);
  line-height: 1.6;
  margin: 0;
  padding: 0.85rem 0 0.85rem 1rem;
  position: relative;
}

.tt-accueil-terrain__points li + li {
  border-top: 1px solid color-mix(in srgb, var(--tt-ink) 10%, transparent);
}

.tt-accueil-terrain__points li::before {
  border-radius: 50%;
  content: "";
  height: 0.35rem;
  left: 0;
  position: absolute;
  top: 1.25rem;
  width: 0.35rem;
}

.tt-accueil-terrain--clients .tt-accueil-terrain__points li::before {
  background: var(--tt-mark-rose-doux);
}

.tt-accueil-terrain--activite .tt-accueil-terrain__points li::before {
  background: var(--tt-mark-menthe);
}

.tt-accueil-terrain--clients .tt-accueil-terrain__points li + li {
  border-top-color: color-mix(in srgb, var(--tt-mark-rose-doux) 32%, transparent);
}

.tt-accueil-terrain--activite .tt-accueil-terrain__points li + li {
  border-top-color: color-mix(in srgb, var(--tt-mark-menthe) 28%, transparent);
}

.tt-accueil-terrain__shot {
  background: transparent;
  border: 0;
  min-width: 0;
  padding: 0;
}

.tt-accueil-terrain__shot .tt-accueil-preview-wrap {
  margin-inline: 0;
  max-width: 100%;
}

/* Diptyque — mockups plus grands (colonne élargie + scale contenu) */
.tt-accueil-terrains--diptyque .tt-accueil-preview-wrap::before {
  inset: -1.75rem -1.5rem -1.5rem;
  opacity: 0.68;
}

.tt-accueil-terrains--diptyque .tt-accueil-preview-wrap .tt-app-frame {
  margin-bottom: 2rem;
  margin-inline: auto;
  transform: scale(1.1);
  transform-origin: top center;
  width: calc(100% / 1.1);
}

.tt-accueil-terrains--diptyque .tt-accueil-preview-wrap .tt-app-frame__bar {
  padding: 0.65rem 1rem;
}

.tt-accueil-terrains--diptyque .tt-accueil-preview-wrap .tt-app-frame__title {
  font-size: 0.75rem;
}

.tt-accueil-terrains--diptyque .tt-shot-interne__col {
  padding: 1rem 1.125rem;
}

.tt-accueil-terrain__shot .tt-shot-figure__caption {
  font-style: italic;
  font-weight: 400;
  margin-top: 0.75rem;
  text-align: left;
}

.tt-accueil-quoi .tt-accueil-actions--spaced {
  gap: clamp(1.5rem, 4vw, 3rem);
}

@media (min-width: 900px) {
  .tt-accueil-terrains--diptyque .tt-accueil-terrain {
    align-items: center;
    gap: clamp(2rem, 4vw, 3.5rem);
    grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
  }

  .tt-accueil-terrains--diptyque .tt-accueil-terrain--activite {
    grid-template-columns: minmax(0, 1.22fr) minmax(0, 0.78fr);
  }

  .tt-accueil-terrains--diptyque .tt-accueil-terrain--activite .tt-accueil-terrain__shot {
    order: -1;
  }

  .tt-accueil-terrains--diptyque .tt-accueil-terrain__copy {
    max-width: 24rem;
  }

  .tt-accueil-terrains--diptyque .tt-accueil-preview-wrap .tt-app-frame {
    margin-bottom: 2.75rem;
  }

  .tt-accueil-terrains--diptyque .tt-accueil-terrain--activite .tt-accueil-terrain__copy {
    margin-inline-start: auto;
    padding-left: 1rem;
    padding-right: 0;
  }
}

.tt-accueil-quoi__foot {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: clamp(3.75rem, 7vw, 5.25rem);
  padding-bottom: clamp(1.25rem, 2.5vw, 2rem);
}

.tt-accueil-quoi__foot .tt-accueil-actions--spaced {
  margin-top: 0;
}

.tt-accueil-tarif-hint {
  color: var(--tt-ink-muted);
  font-size: 1rem;
  line-height: 1.4;
  margin: 0.85rem 0 0;
  text-align: left;
}

.tt-accueil-tarif-hint a {
  color: var(--tt-ink);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--tt-accent) 45%, transparent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
}

/* Early access */
.tt-accueil-early__grid {
  align-items: center;
  display: grid;
  gap: clamp(1.5rem, 3vw, 2rem);
  grid-template-columns: 1fr;
  min-height: 0;
  padding-block: 0;
}

.tt-accueil-early__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 32rem;
  position: relative;
  text-align: left;
  z-index: 1;
}

.tt-accueil-early__eyebrow {
  border-left-color: var(--tt-v-rose);
  margin: 0;
}

.tt-accueil-early__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  font-weight: 400;
  letter-spacing: -0.01em;
  line-height: 1.2;
  margin: 0.75rem 0 0;
}

.tt-accueil-early__text {
  color: var(--tt-ink-muted);
  font-size: clamp(1rem, 1.6vw, 1.0625rem);
  line-height: 1.65;
  margin: 1rem 0 0;
}

.tt-accueil-early .tt-accueil-tarif-hint {
  margin-top: 0;
}

.tt-accueil-early__cta {
  align-items: center;
  display: flex;
  justify-content: center;
  position: relative;
  z-index: 1;
}

.tt-accueil-early__cta-inner {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 0;
  max-width: 22rem;
  text-align: center;
}

.tt-accueil-early__btn {
  font-size: 1.0625rem !important;
  padding: 0.75rem 1.875rem !important;
}

.tt-accueil-early__reassure {
  background-image: linear-gradient(90deg, var(--tt-v-rose) 0%, var(--tt-v-menthe) 100%);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: 2.75rem 2px;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin: 1.5rem 0 0;
  max-width: 18rem;
  padding-top: 1.125rem;
  text-align: center;
}

.tt-accueil-early__reassure-trial {
  color: var(--tt-ink-muted);
  font-size: 0.8125rem;
  letter-spacing: 0.03em;
  line-height: 1.45;
}

.tt-accueil-early__reassure-price {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.35;
}

.tt-accueil-pret .tt-accueil-early__cta-inner {
  gap: 0.875rem;
}

.tt-site-footer__aside--early {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  text-align: right;
}

@media (min-width: 900px) {
  .tt-accueil-hero__grid {
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  }

  .tt-accueil-early__grid {
    align-items: stretch;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
    min-height: clamp(13rem, 22vw, 17rem);
  }

  .tt-accueil-early__copy {
    justify-content: center;
  }

  .tt-accueil-early__cta {
    align-items: center;
    align-self: stretch;
    display: flex;
    justify-content: center;
    min-height: 100%;
  }
}

/* ==========================================================================
   Elementor — blocs HTML accueil (pleine largeur)
   ========================================================================== */

body.elementor-page .entry-header,
body.elementor-page .ast-single-entry-banner,
body.elementor-page .entry-title {
  display: none !important;
}

/* Astra : ne pas encadrer le contenu Elementor */
body.elementor-page.ast-page-builder-template .site-content,
body.elementor-page.ast-page-builder-template #primary,
body.elementor-page .site-content,
body.elementor-page #primary,
body.elementor-page .entry-content,
body.elementor-page .hfeed {
  margin: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  width: 100% !important;
}

body.elementor-page.ast-page-builder-template .ast-container,
body.elementor-page .ast-container {
  margin: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  width: 100% !important;
}

body.elementor-page .ast-separate-container .ast-article-single,
body.elementor-page .ast-separate-container .ast-article-post {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  width: 100% !important;
}

body.tt-chrome-active .elementor-section-wrap,
body.tt-chrome-active .elementor-inner,
body.tt-chrome-active .elementor-column,
body.tt-chrome-active .elementor-widget-wrap,
body.tt-chrome-active .elementor-widget-html,
body.tt-chrome-active .elementor-widget-html .elementor-widget-container,
body.tt-chrome-active .elementor-element-populated,
body.tt-chrome-active .elementor-column > .elementor-element-populated,
body.elementor-page .elementor-section-wrap,
body.elementor-page .elementor-inner,
body.elementor-page .elementor-column,
body.elementor-page .elementor-widget-wrap,
body.elementor-page .elementor-widget-html,
body.elementor-page .elementor-widget-html .elementor-widget-container,
body.elementor-page .elementor-element-populated,
body.elementor-page .elementor-column > .elementor-element-populated {
  margin: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  width: 100% !important;
}

.elementor-section.elementor-section-boxed > .elementor-container,
.elementor-section.elementor-section-full_width > .elementor-container {
  max-width: 100% !important;
  padding: 0 !important;
  width: 100% !important;
}

/* Fonds de section HTML : bord à bord, sans interstice Elementor */
body.tt-chrome-active .elementor,
body.tt-chrome-active .elementor-section-wrap,
body.tt-chrome-active .elementor-top-section,
body.tt-chrome-active .elementor-section,
body.tt-chrome-active .elementor-inner,
body.tt-chrome-active .elementor-container,
body.tt-chrome-active .elementor-column,
body.tt-chrome-active .elementor-widget-wrap,
body.tt-chrome-active .e-con,
body.tt-chrome-active .e-con-inner,
body.tt-chrome-active .e-flex,
body.tt-chrome-active .e-parent,
body.tt-chrome-active .e-child,
.elementor-page .elementor,
.elementor-page .elementor-section-wrap,
.elementor-page .elementor-top-section,
.elementor-page .elementor-section,
.elementor-page .elementor-inner,
.elementor-page .elementor-container,
.elementor-page .elementor-column,
.elementor-page .elementor-widget-wrap,
.elementor-page .e-con,
.elementor-page .e-con-inner,
.elementor-page .e-flex,
.elementor-page .e-parent,
.elementor-page .e-child {
  --container-widget-flex-gap: 0px !important;
  --widgets-spacing: 0px !important;
  --widgets-spacing-row: 0px !important;
  --widgets-spacing-column: 0px !important;
  --e-con-flex-direction: column !important;
  background-color: transparent !important;
  gap: 0 !important;
  margin-block: 0 !important;
  padding-block: 0 !important;
  row-gap: 0 !important;
}

body.tt-chrome-active .elementor-top-section,
body.tt-chrome-active .elementor-section,
.elementor-page .elementor-top-section,
.elementor-page .elementor-section {
  margin: 0 !important;
  padding: 0 !important;
}

body.tt-chrome-active .elementor-top-section + .elementor-top-section,
.elementor-page .elementor-top-section + .elementor-top-section {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.tt-chrome-active #page,
body.tt-chrome-active .site,
body.tt-chrome-active .site-content,
body.tt-chrome-active .site-main,
body.tt-chrome-active .hentry,
body.tt-chrome-active .entry-content,
body.tt-chrome-active #content,
body.tt-chrome-active #primary,
body.elementor-page #page,
body.elementor-page .site,
body.elementor-page .site-content,
body.elementor-page .site-main,
body.elementor-page .hentry,
body.elementor-page .entry-content,
body.elementor-page #content,
body.elementor-page #primary {
  margin-bottom: 0 !important;
  margin-top: 0 !important;
  padding-bottom: 0 !important;
  padding-top: 0 !important;
}

body.tt-chrome-active .tt-site-footer {
  margin-top: 0 !important;
}

.elementor-widget-html .elementor-widget-container {
  display: block;
  line-height: 0;
}

.elementor-widget-html .tt-section {
  box-sizing: border-box;
  display: block;
  line-height: var(--tt-line-height);
  margin-inline: auto;
  max-width: var(--tt-content-width);
  padding-inline: var(--tt-content-padding);
  width: 100%;
}

.elementor-page .elementor-top-section:first-child,
.elementor-page .e-con:first-child,
.elementor-page .elementor-element:first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.elementor-widget-html .elementor-widget-container,
.elementor-widget-html,
.elementor-page .e-con,
.elementor-page .e-con-inner,
.elementor-page .elementor-element {
  overflow: visible !important;
}

/* Contenu accueil — padding porté par .tt-section */
.elementor-widget-html .tt-accueil__container {
  box-sizing: border-box;
  margin-inline: auto;
  max-width: none;
  padding-inline: 0;
  width: 100%;
}

/* ==========================================================================
   Page Réserver ma place
   ========================================================================== */

.tt-reserve.tt-section {
  isolation: isolate;
  /* visible : overflow:hidden coupait le texte des <select> (Safari) */
  overflow: visible;
  padding-block: clamp(3.5rem, 9vw, 6.5rem);
  position: relative;
}

/* Wash duo — menthe à gauche, rose à droite (même famille que hero / early) */
.tt-reserve.tt-section::after {
  background:
    radial-gradient(ellipse 90% 80% at -8% 20%, color-mix(in srgb, var(--tt-v-menthe) 52%, transparent), transparent 55%),
    radial-gradient(ellipse 100% 90% at 108% 12%, color-mix(in srgb, var(--tt-v-rose) 55%, transparent), transparent 52%),
    radial-gradient(ellipse 70% 60% at 88% 78%, color-mix(in srgb, var(--tt-mark-rose-doux) 38%, transparent), transparent 58%),
    radial-gradient(ellipse 55% 50% at 18% 88%, color-mix(in srgb, var(--tt-accent-mid) 45%, transparent), transparent 60%);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 0;
}

.tt-reserve .tt-accueil__container,
.tt-reserve__grid {
  position: relative;
  z-index: 1;
}

.tt-reserve__grid {
  align-items: center;
  display: grid;
  gap: clamp(2rem, 5vw, 3.5rem);
  grid-template-columns: 1fr;
  margin-inline: auto;
  max-width: 56rem;
}

.tt-reserve__copy {
  max-width: 28rem;
}

.tt-reserve__eyebrow {
  margin: 0;
}

.tt-reserve__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(2rem, 5vw, 2.75rem);
  font-weight: 600;
  line-height: 1.15;
  margin: 0.85rem 0 0;
}

.tt-reserve__lead {
  color: var(--tt-ink-muted);
  font-size: 1.08rem;
  line-height: 1.55;
  margin: 1.1rem 0 0;
}

.tt-reserve__points {
  color: var(--tt-ink);
  display: flex;
  flex-direction: column;
  font-size: 0.98rem;
  gap: 0.65rem;
  line-height: 1.45;
  list-style: none;
  margin: 1.75rem 0 0;
  padding: 0;
}

.tt-reserve__points li {
  padding-left: 1.15rem;
  position: relative;
}

.tt-reserve__points li::before {
  background: linear-gradient(90deg, var(--tt-mark-menthe), var(--tt-mark-rose-doux));
  border-radius: 999px;
  content: "";
  height: 0.35rem;
  left: 0;
  position: absolute;
  top: 0.55em;
  width: 0.35rem;
}

.tt-reserve__caption {
  border-image: linear-gradient(90deg, var(--tt-mark-menthe), var(--tt-mark-rose-doux)) 1;
  border-top: 2px solid transparent;
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: 1.05rem;
  font-weight: 400;
  line-height: 1.4;
  margin: 2rem 0 0;
  padding-top: 1.1rem;
}

.tt-reserve__panel {
  background:
    radial-gradient(ellipse 80% 55% at 100% 0%, color-mix(in srgb, var(--tt-mark-rose-doux) 28%, transparent), transparent 60%),
    radial-gradient(ellipse 70% 50% at 0% 100%, color-mix(in srgb, var(--tt-v-menthe) 22%, transparent), transparent 55%),
    #fff;
  border: 1px solid color-mix(in srgb, var(--tt-ink) 6%, transparent);
  border-radius: 1.35rem;
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 80%, transparent) inset,
    0 18px 40px -24px color-mix(in srgb, var(--tt-ink) 28%, transparent);
  padding: clamp(1.5rem, 4vw, 2rem);
}

.tt-reserve-form {
  display: flex;
  flex-direction: column;
  gap: 1.05rem;
}

.tt-reserve-form__honey {
  height: 0;
  margin: 0;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  position: absolute;
  width: 0;
}

.tt-reserve-form__field {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.tt-reserve-form__label {
  color: var(--tt-ink);
  font-size: 0.9rem;
  font-weight: 500;
}

.tt-reserve-form__optional {
  color: var(--tt-ink-muted);
  font-weight: 400;
}

.tt-reserve-form input,
.tt-reserve-form select,
.tt-reserve-form textarea {
  background-color: color-mix(in srgb, var(--tt-canvas) 65%, #fff) !important;
  border-color: color-mix(in srgb, var(--tt-ink) 12%, transparent) !important;
  box-shadow: none !important;
}

.tt-reserve-form select,
.tt-reserve-form select.tt-reserve-form__control {
  -webkit-appearance: none !important;
  appearance: none !important;
  background-color: color-mix(in srgb, var(--tt-canvas) 65%, #fff) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23454545' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-position: right 1rem center !important;
  background-repeat: no-repeat !important;
  background-size: 0.75rem !important;
  box-sizing: border-box !important;
  font-size: 1rem !important;
  height: auto !important;
  line-height: normal !important;
  min-height: 3.25rem !important;
  overflow: visible !important;
  padding: 0.9rem 2.75rem 0.9rem 1rem !important;
}

.tt-reserve-form input:focus,
.tt-reserve-form select:focus,
.tt-reserve-form textarea:focus {
  border-color: color-mix(in srgb, var(--tt-mark-menthe) 55%, var(--tt-ink)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--tt-v-menthe) 35%, transparent) !important;
}

.tt-reserve-form__actions {
  margin-top: 0.35rem;
}

.tt-reserve-form__actions .wp-block-button__link,
.tt-reserve-form__actions button {
  width: 100%;
}

.tt-reserve-form__note {
  color: var(--tt-ink-muted);
  font-size: 0.875rem;
  margin: 0;
  text-align: center;
}

.tt-reserve-form__error {
  background: color-mix(in srgb, var(--tt-mark-rose-doux) 22%, white);
  border-radius: 0.75rem;
  color: var(--tt-ink);
  margin: 0 0 0.25rem;
  padding: 0.85rem 1rem;
}

.tt-reserve-form--success {
  padding-block: 1.25rem;
  text-align: center;
}

.tt-reserve-form__success-title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: 1.85rem;
  font-weight: 600;
  margin: 0;
}

.tt-reserve-form__success-text {
  color: var(--tt-ink-muted);
  margin: 0.85rem 0 0;
}

.tt-reserve-form__back {
  margin: 1.75rem 0 0;
}

@media (min-width: 880px) {
  .tt-reserve__grid {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  }

  .tt-reserve__panel {
    margin-top: 0.25rem;
  }
}

/* ==========================================================================
   Page Pourquoi — lecture aérée (parti pris · carousels empilés)
   ========================================================================== */

.elementor-page .tt-pourquoi-hero.tt-section {
  padding-block: clamp(2rem, 5vw, 3.25rem) !important;
}

.tt-pourquoi-hero__inner {
  max-width: 40rem;
}

.tt-pourquoi-hero .tt-accueil-quoi__title {
  margin-top: 1rem;
}

.tt-pourquoi-hero .tt-accueil-actions {
  margin-top: 1.75rem;
}

/* Eyebrows de section — même rendu que .tt-eyebrow (liséré sage, texte grisé) */
.tt-eyebrow--section,
.tt-accueil-quoi .tt-eyebrow--section {
  border-left-color: var(--tt-accent);
  color: var(--tt-ink-muted);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.16em;
}

.tt-accueil-quoi__head + .tt-parti-grid,
.tt-accueil-quoi__head + .tt-card-grid {
  margin-top: clamp(1.5rem, 3vw, 2.25rem);
}

/* Parti pris — cartes compactes, picto + titre côte à côte */
.tt-parti-grid {
  display: grid;
  gap: 1rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

@media (min-width: 900px) {
  .tt-parti-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.15rem;
  }
}

.tt-parti-card {
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-lg);
  box-shadow: var(--tt-shadow-sm);
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  height: 100%;
  min-width: 0;
  padding: 1.25rem 1.2rem 1.35rem;
}

.tt-parti-card--menthe {
  background: color-mix(in srgb, var(--tt-pastel-menthe) 42%, #fff);
}

.tt-parti-card--beurre {
  background: color-mix(in srgb, var(--tt-pastel-beurre) 50%, #fff);
}

.tt-parti-card--rose {
  background: color-mix(in srgb, var(--tt-pastel-rose) 40%, #fff);
}

.tt-parti-card__top {
  align-items: flex-start;
  display: flex;
  gap: 0.85rem;
}

.tt-parti-card__picto.tt-accueil-picto__halo {
  flex-shrink: 0;
  height: 3.75rem;
  margin: 0;
  width: 3.75rem;
}

.tt-parti-card__picto .tt-accueil-picto__icon {
  height: 2.75rem;
  width: 2.75rem;
}

.tt-parti-card__intro {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-width: 0;
  padding-top: 0.15rem;
}

.tt-parti-card__eyebrow {
  color: var(--tt-ink-muted);
  font-family: var(--tt-font-display);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  margin: 0;
  text-transform: uppercase;
}

.tt-parti-card__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.05rem, 1.8vw, 1.2rem);
  font-weight: 500;
  line-height: 1.3;
  margin: 0.4rem 0 0;
}

@media (min-width: 900px) {
  .tt-parti-card__title {
    /* Aligne les titres entre cartes, desktop seulement */
    min-height: 3.6em;
  }
}

.tt-parti-card__text {
  color: var(--tt-ink-light);
  font-size: 0.875rem;
  line-height: 1.6;
  margin: 0;
}

.tt-parti-card--beurre .tt-parti-card__text {
  /* Ligne de respiration après l’intro (carte IA) */
  padding-bottom: 1rem;
}

.tt-parti-card__list {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  list-style: none;
  margin: auto 0 0;
  padding: 0.35rem 0 0;
}

.tt-parti-card__list li {
  background: color-mix(in srgb, #fff 70%, transparent);
  border-radius: 0.65rem;
  padding: 0.55rem 0.7rem;
}

.tt-parti-card__tag {
  align-items: center;
  color: var(--tt-ink);
  display: flex;
  font-family: var(--tt-font-display);
  font-size: 0.75rem;
  font-weight: 600;
  gap: 0.45rem;
  letter-spacing: 0.04em;
  margin-bottom: 0.25rem;
  text-transform: uppercase;
}

.tt-parti-card__mark-icon {
  display: block;
  flex-shrink: 0;
  height: 1.35rem;
  width: 1.35rem;
}

.tt-parti-card__desc {
  color: var(--tt-ink-light);
  display: block;
  font-size: 0.8125rem;
  line-height: 1.5;
  padding-left: 1.8rem;
}

.tt-accueil-quoi--suite.tt-section::before {
  display: none;
}

.elementor-page .tt-accueil-quoi--suite.tt-section {
  padding-top: 0;
}

.tt-accueil-quoi--suite .tt-accueil-quoi__pourquoi:first-child {
  margin-top: 0;
  padding-top: clamp(2rem, 4vw, 3rem);
}

.tt-accueil-quoi .tt-carousel {
  margin-top: clamp(1.5rem, 3vw, 2rem);
}

/* Carousel empilé — image pleine largeur, texte dessous */
.tt-carousel--stack .tt-carousel__slide--stack {
  display: flex;
  flex-direction: column;
  grid-template-columns: none;
  grid-template-rows: none;
  min-height: 0;
}

.tt-carousel--stack .tt-carousel__stripe {
  display: block;
  flex: 0 0 auto;
  height: 0.35rem;
  order: -1;
  width: 100%;
}

.tt-carousel--stack .tt-carousel__visual {
  background: color-mix(in srgb, var(--tt-canvas-warm) 55%, #fff);
  order: 0;
  padding: 1rem 1.25rem;
}

.tt-carousel--stack .tt-carousel__visual .tt-accueil-preview-wrap {
  margin-inline: auto;
  max-width: 36rem;
}

.tt-carousel--stack .tt-carousel__copy--readable {
  border-right: 0;
  order: 1;
  padding: 1.1rem 1.35rem 1.25rem;
}

/* Moitié / moitié — mockup et texte même hauteur */
.tt-carousel--half .tt-carousel__slide--stack {
  height: min(34rem, 78vh);
  max-height: 78vh;
}

.tt-carousel--half .tt-carousel__visual,
.tt-carousel--half .tt-carousel__copy--readable {
  flex: 1 1 0;
  min-height: 0;
  overflow: auto;
}

.tt-carousel--half .tt-carousel__visual {
  align-items: center;
  display: flex;
  justify-content: center;
}

.tt-carousel--half .tt-carousel__visual .tt-accueil-preview-wrap {
  max-height: 100%;
  width: 100%;
}

.tt-carousel--half .tt-carousel__visual .tt-accueil-preview-wrap .tt-app-frame {
  max-height: min(100%, 14rem);
}

.tt-carousel--half .tt-carousel__points {
  grid-template-columns: 1fr;
  margin-top: 0.75rem;
}

.tt-carousel--half .tt-carousel__points li:last-child:nth-child(odd) {
  grid-column: auto;
}


/* Face-à-face problème ↔ solution (page Pourquoi) */
.tt-duo-list {
  display: flex;
  flex-direction: column;
  gap: clamp(1.75rem, 4vw, 2.75rem);
  margin-top: clamp(1.5rem, 3vw, 2.25rem);
}

.tt-duo {
  align-items: stretch;
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr;
}

@media (min-width: 900px) {
  .tt-duo {
    align-items: stretch;
    gap: 0.75rem 1.25rem;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  }
}

.tt-duo__problem,
.tt-duo__solution {
  border-radius: var(--tt-radius-lg);
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 1.25rem 1.35rem 1.4rem;
}

.tt-duo__problem {
  /* Lisible mais volontairement plus mat que la solution */
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--tt-canvas-deep) 70%, #fff) 0%, color-mix(in srgb, var(--tt-pastel-sable) 35%, #fff) 100%);
  border: 1px solid color-mix(in srgb, var(--tt-ink) 12%, transparent);
  box-shadow: none;
}

.tt-duo__solution {
  background: color-mix(in srgb, var(--tt-pastel-menthe) 32%, #fff);
  border: 1px solid color-mix(in srgb, var(--tt-mark-menthe) 40%, transparent);
  box-shadow: var(--tt-shadow-sm);
}

.tt-duo__label {
  color: var(--tt-ink-faint);
  font-family: var(--tt-font-display);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  margin: 0 0 0.65rem;
  text-transform: uppercase;
}

.tt-duo__label--ok {
  color: color-mix(in srgb, var(--tt-ink) 70%, var(--tt-mark-menthe));
}

.tt-duo__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.15rem, 2vw, 1.35rem);
  font-weight: 500;
  line-height: 1.3;
  margin: 0;
}

.tt-duo__text {
  color: var(--tt-ink-light);
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0.65rem 0 0;
}

.tt-duo__bridge {
  align-items: center;
  color: var(--tt-ink-faint);
  display: none;
  font-size: 1.25rem;
  justify-content: center;
  margin: 0;
  padding-top: 0;
}

@media (min-width: 900px) {
  .tt-duo__bridge {
    display: flex;
  }
}

.tt-duo__bridge span {
  align-items: center;
  background: #fff;
  border: 1px solid var(--tt-border-strong);
  border-radius: 999px;
  display: flex;
  height: 2.25rem;
  justify-content: center;
  width: 2.25rem;
}

.tt-duo__points {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
}

.tt-duo__problem .tt-duo__title {
  color: var(--tt-ink-light);
  font-weight: 400;
}

.tt-duo__solution .tt-duo__title {
  font-weight: 500;
}

.tt-duo__points li {
  background: color-mix(in srgb, #fff 55%, var(--tt-canvas-deep));
  border-left: 3px solid color-mix(in srgb, var(--tt-ink) 14%, transparent);
  border-radius: 0 0.55rem 0.55rem 0;
  color: var(--tt-ink-light);
  font-size: 0.875rem;
  line-height: 1.55;
  padding: 0.6rem 0.8rem;
}

.tt-duo__shot {
  align-items: center;
  display: flex;
  flex: 1;
  justify-content: center;
  margin-top: 1.1rem;
}

.tt-duo__shot .tt-accueil-preview-wrap {
  margin-inline: auto;
  max-width: 26rem;
  width: 100%;
}

.tt-duo__shot .tt-accueil-preview-wrap .tt-app-frame {
  margin-inline: auto;
  transform: scale(0.92);
  transform-origin: center center;
}

/* Shot problème : présent mais moins « vendeur » que la solution */
.tt-duo__shot--problem .tt-accueil-preview-wrap {
  filter: grayscale(0.22) saturate(0.85);
  opacity: 0.92;
}

.tt-duo__shot--problem .tt-accueil-preview-wrap::before {
  opacity: 0.28;
}

.tt-pourquoi-cta {
  gap: clamp(1.25rem, 3vw, 2.25rem) !important;
  margin-top: 2rem;
}

.tt-carousel__step {
  color: var(--tt-ink-faint);
  font-family: var(--tt-font-display);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  margin: 0 0 0.65rem;
  text-transform: uppercase;
}

.tt-carousel--stack .tt-carousel__title {
  color: var(--tt-ink);
  font-size: clamp(1.35rem, 2.5vw, 1.65rem);
  font-weight: 500;
  max-width: 36rem;
}

.tt-carousel--stack .tt-carousel__lead {
  max-width: 42rem;
}

.tt-carousel__points {
  display: grid;
  gap: 0.55rem;
  list-style: none;
  margin: 1.1rem 0 0;
  max-width: 42rem;
  padding: 0;
}

@media (min-width: 768px) {
  .tt-carousel__points {
    grid-template-columns: 1fr 1fr;
  }

  .tt-carousel__points li:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
}

.tt-carousel__points li {
  background: color-mix(in srgb, var(--tt-canvas) 80%, #fff);
  border-left: 3px solid color-mix(in srgb, var(--tt-mark-menthe) 70%, transparent);
  border-radius: 0 0.55rem 0.55rem 0;
  color: var(--tt-ink);
  font-size: 0.875rem;
  line-height: 1.55;
  padding: 0.65rem 0.85rem;
}

.tt-carousel--stack .tt-carousel__consequence {
  background: color-mix(in srgb, var(--tt-pastel-beurre) 45%, #fff);
  border-radius: 0.65rem;
  display: inline-block;
  margin-top: 1rem;
  max-width: 42rem;
  padding: 0.65rem 0.9rem;
}

.tt-carousel--stack .tt-carousel__slide--shift .tt-carousel__copy {
  backdrop-filter: none;
  background: transparent;
}

.tt-accueil-early__btn-secondary {
  font-size: 1.0625rem !important;
  padding: 0.75rem 1.875rem !important;
}


/* ==========================================================================
   Page Logiciel — carousels briques (texte + film d’écran)
   ========================================================================== */

.tt-logiciel-hero .tt-terrain-cards {
  margin-top: 1.35rem;
}

.tt-carousel--logiciel .tt-carousel__slide {
  background: #fff;
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-lg);
  box-shadow: var(--tt-shadow-sm);
  display: grid;
  flex: 0 0 min(92vw, 58rem);
  grid-template-columns: 1fr;
  min-height: 0;
  overflow: hidden;
  scroll-snap-align: start;
}

@media (min-width: 900px) {
  .tt-carousel--logiciel .tt-carousel__slide {
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    min-height: 28rem;
  }
}

.tt-logiciel-slide__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 1.5rem 1.35rem 1.35rem;
}

@media (min-width: 900px) {
  .tt-logiciel-slide__copy {
    border-right: 1px solid color-mix(in srgb, var(--tt-ink) 6%, transparent);
    padding: 2rem 1.75rem 2rem 2rem;
  }
}

.tt-logiciel-slide__step {
  color: var(--tt-ink-faint);
  font-family: var(--tt-font-display);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  margin: 0 0 0.65rem;
  text-transform: uppercase;
}

.tt-logiciel-slide__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.35rem, 2.5vw, 1.65rem);
  font-weight: 500;
  line-height: 1.25;
  margin: 0;
}

.tt-logiciel-slide__lead {
  color: var(--tt-ink-light);
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0.75rem 0 0;
}

.tt-logiciel-slide__points {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  list-style: none;
  margin: 1.15rem 0 0;
  padding: 0;
}

.tt-logiciel-slide__points li {
  background: color-mix(in srgb, var(--tt-canvas) 75%, #fff);
  border-left: 3px solid color-mix(in srgb, var(--tt-mark-menthe) 70%, transparent);
  border-radius: 0 0.55rem 0.55rem 0;
  color: var(--tt-ink);
  font-size: 0.875rem;
  line-height: 1.55;
  padding: 0.6rem 0.85rem;
}

.tt-logiciel-slide__media {
  align-items: center;
  background: color-mix(in srgb, var(--tt-canvas-warm) 60%, #fff);
  display: flex;
  justify-content: center;
  min-height: 14rem;
  padding: 1.25rem;
}

@media (min-width: 900px) {
  .tt-logiciel-slide__media {
    min-height: 0;
    padding: 1.5rem 1.75rem;
  }
}

.tt-screen-film {
  width: 100%;
}

.tt-screen-film__placeholder .tt-accueil-preview-wrap {
  margin-inline: auto;
  max-width: 28rem;
}

.tt-screen-film__video {
  border-radius: var(--tt-radius-lg);
  display: block;
  height: auto;
  max-height: 22rem;
  object-fit: contain;
  width: 100%;
}

/* Thèmes carousel Logiciel — 2 univers */
.tt-carousel--theme-clients .tt-logiciel-slide {
  background: color-mix(in srgb, var(--tt-pastel-ciel) 28%, #fff);
  border-color: color-mix(in srgb, var(--tt-pastel-ciel) 55%, var(--tt-border-strong));
}

.tt-carousel--theme-clients .tt-logiciel-slide__media {
  background: color-mix(in srgb, var(--tt-pastel-ciel) 18%, #fff);
}

.tt-carousel--theme-clients .tt-logiciel-slide__points li {
  border-left-color: color-mix(in srgb, #7eb6d4 70%, transparent);
}

.tt-carousel--theme-activite .tt-logiciel-slide {
  background: color-mix(in srgb, var(--tt-pastel-lilas) 32%, #fff);
  border-color: color-mix(in srgb, var(--tt-pastel-lilas) 55%, var(--tt-border-strong));
}

.tt-carousel--theme-activite .tt-logiciel-slide__media {
  background: color-mix(in srgb, var(--tt-pastel-lilas) 20%, #fff);
}

.tt-carousel--theme-activite .tt-logiciel-slide__points li {
  border-left-color: color-mix(in srgb, var(--tt-pastel-lilas) 90%, var(--tt-ink));
}



/* ==========================================================================
   Pages secondaires — hero, blocs, carousel, tarifs, FAQ
   ========================================================================== */

.tt-page-hero.tt-section {
  padding-block: clamp(2.5rem, 6vw, 4.5rem);
}

.tt-page-hero__inner {
  max-width: 48rem;
}

.tt-page-hero--center .tt-page-hero__inner {
  margin-inline: auto;
  text-align: center;
}

.tt-page-hero--center .tt-accueil-actions {
  justify-content: center;
}

.tt-page-hero__kicker {
  color: var(--tt-ink);
  font-size: 0.875rem;
  font-weight: 500;
  margin: 0.75rem 0 0;
}

.tt-page-hero__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.85rem, 4vw, 2.5rem);
  font-weight: 400;
  line-height: 1.25;
  margin: 1rem 0 0;
}

.tt-page-hero__lead {
  color: var(--tt-ink-light);
  font-size: clamp(1.05rem, 2vw, 1.125rem);
  line-height: 1.65;
  margin: 1.25rem 0 0;
}

.tt-section-head {
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
  max-width: 42rem;
}

.tt-section-head--center {
  margin-inline: auto;
  text-align: center;
}

.tt-section-head__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.5rem, 3vw, 1.875rem);
  font-weight: 400;
  line-height: 1.3;
  margin: 0.75rem 0 0;
}

.tt-section-head__lead {
  color: var(--tt-ink-light);
  font-size: 1rem;
  line-height: 1.65;
  margin: 0.75rem 0 0;
}

.tt-card-grid {
  display: grid;
  gap: 1.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

@media (min-width: 900px) {
  .tt-card-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.tt-card-grid__item {
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-lg);
  box-shadow: var(--tt-shadow-sm);
  display: flex;
  flex-direction: column;
  padding: 1.75rem 1.5rem;
}

.tt-card-grid__item--menthe {
  background: color-mix(in srgb, var(--tt-pastel-menthe) 45%, #fff);
}

.tt-card-grid__item--beurre {
  background: color-mix(in srgb, var(--tt-pastel-beurre) 55%, #fff);
}

.tt-card-grid__item--rose {
  background: color-mix(in srgb, var(--tt-pastel-rose) 45%, #fff);
}

.tt-card-grid__eyebrow {
  color: var(--tt-ink-muted);
  font-family: var(--tt-font-display);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  margin: 0;
  text-transform: uppercase;
}

.tt-card-grid__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.25rem, 2.5vw, 1.5rem);
  font-weight: 400;
  line-height: 1.3;
  margin: 0.75rem 0 0;
}

.tt-card-grid__text {
  color: var(--tt-ink-light);
  font-size: 0.9375rem;
  line-height: 1.65;
  margin: 1rem 0 0;
}

.tt-card-grid__list {
  margin-top: 0.75rem;
}

.tt-card-grid__list li {
  font-size: 0.8125rem;
}

.tt-carousel__consequence {
  color: var(--tt-ink);
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.55;
  margin: 1rem 0 0;
}

.tt-list-check {
  list-style: none;
  margin: 0;
  padding: 0;
}

.tt-list-check li {
  color: var(--tt-ink);
  display: flex;
  font-size: 0.9375rem;
  gap: 0.625rem;
  line-height: 1.6;
  padding: 0.35rem 0;
}

.tt-list-check li::before {
  background: var(--tt-mark-menthe);
  border-radius: 999px;
  content: "";
  flex-shrink: 0;
  height: 0.375rem;
  margin-top: 0.55rem;
  width: 0.375rem;
}

.tt-carousel {
  margin-top: 2rem;
}

.tt-carousel__track {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  padding-bottom: 0;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.tt-carousel__track::-webkit-scrollbar {
  display: none;
}

.tt-carousel__frame {
  align-items: center;
  display: grid;
  gap: 0.65rem;
  grid-template-columns: auto minmax(0, 1fr) auto;
  position: relative;
}

.tt-carousel__frame .tt-carousel__track {
  min-width: 0;
  width: 100%;
}

.tt-carousel__frame .tt-carousel__slide {
  flex: 0 0 100%;
}

@media (max-width: 639px) {
  .tt-carousel__frame {
    gap: 0;
    grid-template-columns: 1fr;
  }

  .tt-carousel__frame .tt-carousel__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }

  .tt-carousel__frame .tt-carousel__arrow--prev {
    left: 0.35rem;
  }

  .tt-carousel__frame .tt-carousel__arrow--next {
    right: 0.35rem;
  }
}

/* Contrôles carousel : hors tache pervenche — encre + menthe */
.tt-carousel__arrow,
.tt-carousel__dot {
  appearance: none !important;
  box-shadow: none !important;
  font-weight: 500 !important;
  min-height: 0 !important;
  position: relative;
  text-decoration: none !important;
  z-index: 2;
}

.tt-carousel__arrow::before,
.tt-carousel__dot::before {
  content: none !important;
  display: none !important;
}

.tt-carousel__arrow {
  align-items: center;
  background: #fff !important;
  border: 1.5px solid color-mix(in srgb, var(--tt-ink) 28%, transparent) !important;
  border-radius: 999px !important;
  color: var(--tt-ink) !important;
  cursor: pointer;
  display: flex !important;
  flex-shrink: 0;
  font-size: 1.35rem !important;
  height: 2.5rem !important;
  justify-content: center;
  line-height: 1 !important;
  padding: 0 !important;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
  width: 2.5rem !important;
}

.tt-carousel__arrow:hover,
.tt-carousel__arrow:focus-visible {
  background: var(--tt-accent-soft) !important;
  border-color: color-mix(in srgb, var(--tt-accent) 70%, var(--tt-ink)) !important;
  color: var(--tt-ink) !important;
  outline: none;
  transform: none !important;
}

.tt-carousel__arrow span {
  display: block;
  margin-top: -0.1em;
}

.tt-carousel__dots {
  align-items: center;
  display: flex;
  gap: 0.55rem;
  justify-content: center;
  margin-top: 1.15rem;
}

.tt-carousel__dot {
  background: color-mix(in srgb, var(--tt-ink) 32%, transparent) !important;
  border: 0 !important;
  border-radius: 999px !important;
  cursor: pointer;
  display: block !important;
  flex-shrink: 0;
  font-size: 0 !important;
  height: 0.55rem !important;
  line-height: 0 !important;
  padding: 0 !important;
  transition: background 0.15s ease, width 0.15s ease;
  width: 0.55rem !important;
}

.tt-carousel__dot.is-active {
  background: var(--tt-ink) !important;
  width: 1.35rem !important;
}

.tt-carousel__dot:hover {
  background: color-mix(in srgb, var(--tt-ink) 55%, transparent) !important;
  transform: none !important;
}

.tt-carousel__dot:focus-visible {
  outline: 2px solid var(--tt-accent);
  outline-offset: 3px;
}

.tt-carousel__hint {
  display: none;
}

.tt-carousel__slide {
  background: #fff;
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-lg);
  box-shadow: var(--tt-shadow-md);
  display: grid;
  flex: 0 0 min(88vw, 56rem);
  grid-template-rows: auto 1fr;
  min-height: 30rem;
  overflow: hidden;
  scroll-snap-align: start;
}

@media (min-width: 1024px) {
  .tt-carousel__slide {
    grid-template-columns: minmax(15rem, 0.36fr) minmax(0, 0.64fr);
    grid-template-rows: none;
    min-height: 34rem;
  }
}

.tt-carousel__stripe {
  display: block;
  height: 0.375rem;
  width: 100%;
}

@media (min-width: 1024px) {
  .tt-carousel__stripe {
    display: none;
  }
}

.tt-carousel__stripe--desktop {
  border-radius: 999px;
  display: none;
  height: 0.25rem;
  margin-bottom: 1.25rem;
  width: 3rem;
}

@media (min-width: 1024px) {
  .tt-carousel__stripe--desktop {
    display: block;
  }
}

.tt-carousel__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 1.75rem 1.5rem;
}

@media (min-width: 1024px) {
  .tt-carousel__copy {
    border-right: 1px solid color-mix(in srgb, var(--tt-ink) 6%, transparent);
    padding: 2.5rem 2rem;
  }
}

.tt-carousel__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.5rem, 3vw, 1.875rem);
  font-weight: 400;
  line-height: 1.25;
  margin: 0;
}

.tt-carousel__lead {
  color: var(--tt-ink-light);
  font-size: 1rem;
  line-height: 1.65;
  margin: 0.75rem 0 0;
}

.tt-carousel__visual {
  align-items: center;
  background: color-mix(in srgb, var(--tt-canvas-warm) 70%, #fff);
  display: flex;
  justify-content: center;
  min-height: 16rem;
  padding: 1.25rem;
}

@media (min-width: 1024px) {
  .tt-carousel__visual {
    min-height: 0;
    padding: 1.5rem 2rem;
  }
}

.tt-carousel__visual .tt-accueil-preview-wrap {
  max-width: 36rem;
  width: 100%;
}

/* hint remplacé par points (.tt-carousel__dots) */


.tt-carousel__slide--ciel { background: color-mix(in srgb, var(--tt-pastel-ciel) 25%, #fff); }
.tt-carousel__slide--lilas { background: color-mix(in srgb, var(--tt-pastel-lilas) 30%, #fff); }
.tt-carousel__slide--menthe { background: color-mix(in srgb, var(--tt-pastel-menthe) 30%, #fff); }

.tt-carousel__slide--shift .tt-carousel__copy {
  background: rgba(255, 255, 255, 0.78);
  backdrop-filter: blur(2px);
}

.tt-feature-block {
  align-items: center;
  display: grid;
  gap: 2rem;
  scroll-margin-top: 7rem;
}

@media (min-width: 1024px) {
  .tt-feature-block {
    gap: 3rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tt-feature-block--flip .tt-feature-block__copy {
    order: 2;
  }

  .tt-feature-block--flip .tt-feature-block__shot {
    order: 1;
  }
}

.tt-feature-block + .tt-feature-block {
  margin-top: clamp(3rem, 6vw, 5rem);
}

.tt-feature-block__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.25rem, 2.5vw, 1.5rem);
  font-weight: 400;
  margin: 0;
}

.tt-feature-block__text {
  color: var(--tt-ink-light);
  font-size: 0.9375rem;
  line-height: 1.65;
  margin: 0.75rem 0 0;
}

.tt-feature-block__shot {
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-lg);
  box-shadow: var(--tt-shadow-md);
  padding: 1rem;
}

.tt-terrain-cards {
  display: grid;
  gap: 1.25rem;
  margin-top: 3rem;
}

@media (min-width: 640px) {
  .tt-terrain-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.tt-terrain-card {
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-lg);
  box-shadow: var(--tt-shadow-md);
  color: inherit;
  display: flex;
  overflow: hidden;
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.tt-terrain-card:hover,
.tt-terrain-card:focus {
  box-shadow: var(--tt-shadow-lg);
  transform: translateY(-2px);
}

.tt-terrain-card__stripe {
  flex-shrink: 0;
  width: 0.375rem;
}

.tt-terrain-card,
.tt-terrain-card:hover,
.tt-terrain-card:focus,
.tt-terrain-card * {
  text-decoration: none !important;
}

.tt-terrain-cards--compact {
  gap: 0.75rem;
  margin-top: 1.35rem;
}

@media (min-width: 640px) {
  .tt-terrain-cards--compact {
    grid-template-columns: 1fr 1fr;
  }
}

.tt-terrain-card__body {
  padding: 1.25rem 1.5rem;
}

.tt-terrain-cards--compact .tt-terrain-card__body {
  padding: 0.85rem 1.15rem 1rem;
}

.tt-terrain-cards--compact .tt-terrain-card__title {
  font-size: clamp(1.05rem, 2.4vw, 1.2rem);
  line-height: 1.3;
  margin-top: 0.35rem;
}

.tt-terrain-cards--compact .tt-terrain-card__link {
  margin-top: 0.55rem;
}

.tt-terrain-card__eyebrow {
  color: var(--tt-ink-muted);
  font-family: var(--tt-font-display);
  font-size: 0.6875rem;
  letter-spacing: 0.16em;
  margin: 0;
  text-transform: uppercase;
}

.tt-terrain-card__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: 1.5rem;
  font-weight: 400;
  margin: 0.5rem 0 0;
}

.tt-terrain-card__text {
  color: var(--tt-ink-light);
  font-size: 0.875rem;
  line-height: 1.6;
  margin: 0.5rem 0 0;
}

.tt-terrain-card__link {
  color: var(--tt-ink);
  display: inline-block;
  font-size: 0.875rem;
  font-weight: 500;
  margin-top: 1rem;
  text-decoration: none;
}

.tt-terrain-card:hover .tt-terrain-card__link,
.tt-terrain-card:focus .tt-terrain-card__link {
  color: var(--tt-ink-light);
}

.tt-pricing-socle {
  align-items: center;
  display: grid;
  gap: 2.5rem;
}

@media (min-width: 1024px) {
  .tt-pricing-socle {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  }
}

/* Section formules Tarifs — fond clair (pas de wash menthe) + séparateur */
.tt-pricing-formules.tt-section {
  background: #fff;
  isolation: isolate;
  position: relative;
}

.tt-pricing-formules.tt-section::before {
  background: var(--tt-separator-gradient);
  box-shadow: var(--tt-separator-shadow);
  content: "";
  display: block;
  height: 3px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  z-index: 2;
}

.tt-pricing-formules__head {
  margin-inline: auto;
  max-width: 40rem;
  text-align: center;
}

.tt-pricing-formules__head .tt-eyebrow {
  border-left: 0;
  display: inline-block;
  margin-bottom: 0.65rem;
  padding-left: 0;
}

.tt-pricing-formules__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.85rem, 3.8vw, 2.5rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.15;
  margin: 0;
}

.tt-pricing-formules__rule {
  background: var(--tt-separator-gradient);
  border-radius: 999px;
  height: 3px;
  margin: 1.1rem auto 0;
  max-width: 7.5rem;
  opacity: 0.9;
}

.tt-pricing-formules__lead {
  color: var(--tt-ink-light);
  font-size: 1.0625rem;
  line-height: 1.6;
  margin: 1.15rem auto 0;
  max-width: 34rem;
}

.tt-pricing-formules__lead em {
  color: var(--tt-ink);
  font-style: italic;
  font-weight: 500;
}

.tt-pricing-formules__reassure {
  align-items: center;
  background: color-mix(in srgb, var(--tt-pastel-beurre) 55%, #fff);
  border-radius: var(--tt-radius-pill);
  color: var(--tt-ink-light);
  display: inline-flex;
  font-size: 0.875rem;
  font-style: normal;
  gap: 0.55rem;
  line-height: 1.45;
  margin: 1.35rem 0 0;
  max-width: 100%;
  padding: 0.55rem 1rem 0.55rem 0.85rem;
}

.tt-pricing-formules__reassure-mark {
  background: radial-gradient(circle at 40% 40%, var(--tt-v-rose), var(--tt-v-menthe));
  border-radius: 999px;
  flex-shrink: 0;
  height: 0.55rem;
  width: 0.55rem;
}

.tt-pricing-formules__foot {
  color: var(--tt-ink-muted);
  font-size: 0.9375rem;
  line-height: 1.65;
  margin: 2.5rem auto 0;
  max-width: 42rem;
  text-align: center;
}

.tt-pricing-formules__asterisk {
  color: var(--tt-ink-faint);
  font-size: 0.8125rem;
  line-height: 1.45;
  margin: 1rem auto 0;
  max-width: 42rem;
  text-align: center;
}

.tt-pricing-grid {
  display: grid;
  gap: 1.5rem;
  margin-top: 2.75rem;
}

@media (min-width: 1024px) {
  .tt-pricing-grid {
    align-items: end;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.tt-pricing-card {
  background: linear-gradient(180deg, color-mix(in srgb, var(--tt-card-accent, var(--tt-pastel-ciel)) 55%, #fff) 0%, #fff 100%);
  border: 1px solid var(--tt-border-strong);
  border-radius: 1.75rem;
  box-shadow: 0 16px 44px -22px rgba(62, 59, 56, 0.4);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
}

.tt-pricing-card .tt-list-check li::before {
  background: var(--tt-card-bullet, var(--tt-mark-menthe));
}

.tt-pricing-card--featured {
  box-shadow: 0 22px 50px -20px rgba(62, 59, 56, 0.45);
  z-index: 1;
}

@media (min-width: 1024px) {
  .tt-pricing-card--featured {
    margin-bottom: -0.75rem;
    min-height: 36rem;
    transform: translateY(-0.75rem);
  }

  .tt-pricing-card:not(.tt-pricing-card--featured) {
    min-height: 30rem;
  }
}

.tt-pricing-choice {
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px dashed color-mix(in srgb, var(--tt-ink) 12%, transparent);
}

.tt-pricing-choice__label {
  color: var(--tt-ink-muted);
  font-size: 0.8125rem;
  font-weight: 500;
  margin: 0 0 0.55rem;
  text-align: center;
}

.tt-pricing-choice__row {
  display: grid;
  gap: 0.35rem 0.65rem;
  grid-template-columns: 1fr auto 1fr;
  width: 100%;
}

.tt-pricing-choice__option {
  background: color-mix(in srgb, var(--tt-card-accent, var(--tt-pastel-menthe)) 35%, #fff);
  border-radius: 0.55rem;
  display: block;
  font-size: 0.875rem;
  line-height: 1.4;
  padding: 0.55rem 0.65rem;
  text-align: center;
}

.tt-pricing-choice__option small {
  color: var(--tt-ink-faint);
  display: block;
  font-size: 0.75rem;
  margin-top: 0.15rem;
}

.tt-pricing-choice__or {
  align-self: center;
  color: var(--tt-ink-faint);
  font-size: 0.75rem;
  font-style: italic;
  text-align: center;
}

@media (max-width: 420px) {
  .tt-pricing-choice__row {
    grid-template-columns: 1fr;
  }

  .tt-pricing-choice__or {
    padding-block: 0.15rem;
  }
}

.tt-pricing-card__stripe {
  height: 0.625rem;
  width: 100%;
}

.tt-pricing-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 1.25rem 1.5rem 1.75rem;
}

.tt-pricing-card--featured .tt-pricing-card__body {
  padding-bottom: 2.25rem;
  padding-top: 1.75rem;
}

.tt-pricing-card__head {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: space-between;
  min-height: 2rem;
}

.tt-pricing-card__name {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: 1.5rem;
  font-weight: 500;
  margin: 0;
}

.tt-pricing-card__badge {
  border-radius: 999px;
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  padding: 0.25rem 0.625rem;
  text-transform: uppercase;
}

.tt-pricing-card__badge--ciel {
  background: var(--tt-pastel-ciel);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #7eb6d4 35%, transparent);
}

.tt-pricing-card__badge--menthe {
  background: var(--tt-pastel-menthe);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tt-mark-menthe) 40%, transparent);
}

.tt-pricing-card__badge--lilas {
  background: var(--tt-pastel-lilas);
  box-shadow: inset 0 0 0 1px var(--tt-pastel-lilas);
}

.tt-pricing-card__price {
  margin-top: 1.5rem;
  text-align: center;
}

.tt-pricing-card__amount {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: 3rem;
  font-weight: 600;
  line-height: 1;
}

.tt-pricing-card__period {
  color: var(--tt-ink-muted);
  font-size: 0.875rem;
  font-weight: 500;
}

.tt-pricing-card__ttc {
  color: var(--tt-ink-muted);
  font-size: 0.75rem;
  margin-top: 0.375rem;
}

.tt-pricing-card__blurb {
  color: var(--tt-ink-light);
  font-size: 0.875rem;
  line-height: 1.6;
  margin-top: 1.25rem;
  text-align: center;
}

.tt-pricing-card__includes {
  background: rgba(255, 255, 255, 0.92);
  border-radius: var(--tt-radius-lg);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tt-ink) 10%, transparent);
  flex: 1;
  margin-top: 1.25rem;
  padding: 1rem;
}

.tt-pricing-card__includes-label {
  color: var(--tt-ink-muted);
  font-family: var(--tt-font-display);
  font-size: 0.6875rem;
  letter-spacing: 0.14em;
  margin: 0;
  text-transform: uppercase;
}

.tt-pricing-card__cta {
  margin-top: 1.5rem;
}

.tt-pricing-card__cta .wp-block-button__link {
  width: 100%;
}

.tt-pricing-card__cta-note {
  color: var(--tt-ink-faint);
  font-size: 0.75rem;
  line-height: 1.4;
  margin: 0.65rem 0 0;
  text-align: center;
}

/* ——— Tarifs : tableau comparatif (05-comparatif.html) ——— */

.tt-pricing-compare.tt-section {
  background: #fff;
  margin-top: 0;
  padding-block: 0 clamp(2.5rem, 5vw, 3.5rem);
}

.tt-pricing-compare__details {
  background: #fff;
  border: 1px solid var(--tt-border-strong);
  border-radius: var(--tt-radius-xl);
  box-shadow: 0 16px 44px -22px rgba(62, 59, 56, 0.35);
  margin-inline: auto;
  max-width: none;
  overflow: visible;
  width: 100%;
}

.tt-pricing-compare__details:not([open]) .tt-pricing-compare__summary {
  border-radius: var(--tt-radius-xl);
}

.tt-pricing-compare__details[open] .tt-pricing-compare__summary {
  border-radius: var(--tt-radius-xl) var(--tt-radius-xl) 0 0;
}

.tt-pricing-compare__details[open] .tt-pricing-compare__panel {
  border-radius: 0 0 var(--tt-radius-xl) var(--tt-radius-xl);
}

.tt-pricing-compare__summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  list-style: none;
  padding: 1.15rem 1.35rem 1.05rem;
  transition: background 0.15s ease;
}

.tt-pricing-compare__summary::-webkit-details-marker {
  display: none;
}

.tt-pricing-compare__summary::after {
  align-self: center;
  background: var(--tt-btn-tache-soft);
  border: 1px solid color-mix(in srgb, var(--tt-btn-tache) 45%, transparent);
  border-radius: 999px;
  color: var(--tt-ink);
  content: "+";
  flex-shrink: 0;
  font-family: var(--tt-font-display);
  font-size: 1.125rem;
  font-weight: 400;
  height: 2rem;
  line-height: 1.75rem;
  text-align: center;
  width: 2rem;
}

.tt-pricing-compare__details[open] .tt-pricing-compare__summary::after {
  content: "−";
  line-height: 1.65rem;
}

.tt-pricing-compare__summary:hover {
  background: color-mix(in srgb, var(--tt-pastel-pervenche) 35%, #fff);
}

.tt-pricing-compare__summary-text {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.05rem, 2.2vw, 1.25rem);
  font-weight: 400;
  letter-spacing: -0.01em;
}

.tt-pricing-compare__summary-hint {
  display: none;
}

.tt-pricing-compare__panel {
  border-top: 1px solid var(--tt-border);
  padding: 0 0 1.35rem;
}

.tt-pricing-compare__legend {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  list-style: none;
  margin: 0;
  padding: 1rem 1.35rem 0.35rem;
}

@media (min-width: 720px) {
  .tt-pricing-compare__legend {
    align-items: center;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 2rem 3rem;
    justify-content: space-evenly;
    padding-inline: 2rem;
  }

  .tt-pricing-compare__legend-item--visibilite {
    flex: 0 1 auto;
    max-width: none;
  }
}

.tt-pricing-compare__legend-item {
  align-items: center;
  color: var(--tt-ink-muted);
  display: flex;
  font-size: 0.8125rem;
  gap: 1rem;
  line-height: 1.45;
}

.tt-pricing-compare__legend-icon {
  flex-shrink: 0;
  width: 2.25rem;
}

.tt-pricing-compare__legend-icon .tt-pricing-compare__yes,
.tt-pricing-compare__legend-icon .tt-pricing-compare__no,
.tt-pricing-compare__legend-icon .tt-pricing-compare__pick {
  margin-inline: auto;
}

.tt-pricing-compare__legend-label {
  flex: 1;
  min-width: 0;
}

.tt-pricing-compare__legend-item em {
  font-style: italic;
}

.tt-pricing-compare__legend-item--visibilite {
  background: color-mix(in srgb, var(--tt-pastel-menthe) 28%, #fff);
  border-radius: var(--tt-radius-md);
  gap: 1.15rem;
  max-width: 100%;
  padding: 0.55rem 1rem 0.55rem 0.85rem;
}

@media (min-width: 720px) {
  .tt-pricing-compare__legend-item--visibilite {
    gap: 1.35rem;
    padding-inline: 1.15rem;
  }
}

.tt-pricing-compare__pick {
  align-items: center;
  display: inline-flex;
  flex-direction: column;
  gap: 0.15rem;
  vertical-align: middle;
}

.tt-pricing-compare__pick-tag {
  color: color-mix(in srgb, var(--tt-mark-menthe) 45%, var(--tt-ink));
  font-size: 0.5625rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.1;
  text-transform: uppercase;
  white-space: nowrap;
}

.tt-pricing-compare__table tbody td:nth-child(3) .tt-pricing-compare__pick-tag {
  color: color-mix(in srgb, var(--tt-mark-menthe) 55%, var(--tt-ink));
}

@media (min-width: 640px) {
  .tt-pricing-compare__panel {
    padding-inline: 0;
  }
}

.tt-pricing-compare__scroll {
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--tt-border);
  border-radius: 0;
  border-width: 1px 0;
  margin-top: 0.75rem;
  overflow-x: auto;
  overflow-y: visible;
}

.tt-pricing-compare__table--plans {
  margin: 0;
}

.tt-pricing-compare__table--plans thead th {
  border-bottom: 1px solid var(--tt-border-strong);
  padding: 0.85rem 0.65rem 0.75rem;
  vertical-align: bottom;
}

.tt-pricing-compare__plans-th-feature {
  background: #fff;
  color: var(--tt-ink-muted);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-align: left;
  text-transform: uppercase;
}

.tt-pricing-compare__table--body {
  margin-top: 0;
}

.tt-pricing-compare__plans-sticky.is-fixed .tt-pricing-compare__table--plans {
  min-width: 44rem;
  width: 100%;
}

/* Comparatif — en-tête figé (barre div, fiable Elementor / WP) */
body:has(.tt-pricing-compare) .elementor-widget-wrap,
body:has(.tt-pricing-compare) .elementor-widget-container,
body:has(.tt-pricing-compare) .e-con,
body:has(.tt-pricing-compare) .e-con-inner,
.tt-pricing-compare__details,
.tt-pricing-compare__panel,
.tt-pricing-compare__scroll {
  overflow: visible !important;
}

body:has(.tt-site-header) .tt-pricing-compare {
  --tt-compare-sticky-top: 4.25rem;
}

.tt-pricing-compare__table-wrap {
  margin-top: 0.75rem;
}

.tt-pricing-compare__plans-anchor {
  overflow-x: auto;
  overflow-y: visible;
  position: relative;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.tt-pricing-compare__plans-anchor::-webkit-scrollbar {
  display: none;
}

.tt-pricing-compare__table-wrap:has(.tt-pricing-compare__plans-sticky.is-fixed) .tt-pricing-compare__plans-anchor {
  overflow-x: hidden;
}

.tt-pricing-compare__plans-sticky {
  background: #fff;
  box-shadow: 0 1px 0 var(--tt-border-strong);
  position: relative;
  z-index: 1;
}

.tt-pricing-compare__plans-sticky.is-fixed {
  border-bottom: 1px solid var(--tt-border-strong);
  box-shadow: 0 4px 16px -8px rgba(62, 59, 56, 0.35);
  left: var(--tt-compare-bar-left, 0);
  overflow: hidden;
  position: fixed;
  top: var(--tt-compare-sticky-top, 0);
  width: var(--tt-compare-bar-width, 100%);
  z-index: 99;
}

.tt-pricing-compare__plans-row {
  display: grid;
  grid-template-columns: minmax(16rem, 46%) repeat(3, minmax(0, 1fr));
  min-width: 44rem;
  width: max-content;
  max-width: 100%;
}

.tt-pricing-compare__plans-cell {
  box-sizing: border-box;
  padding: 0.7rem 0.85rem;
  text-align: center;
}

.tt-pricing-compare__plans-cell--feature {
  color: var(--tt-ink-muted);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-align: left;
  text-transform: uppercase;
}

.tt-pricing-compare__plans-cell.tt-pricing-compare__plan--ciel {
  background: linear-gradient(180deg, color-mix(in srgb, var(--tt-pastel-ciel) 70%, #fff) 0%, #fff 100%);
  box-shadow: inset 0 0.625rem 0 0 var(--tt-pastel-ciel);
}

.tt-pricing-compare__plans-cell.tt-pricing-compare__plan--menthe {
  background: linear-gradient(180deg, color-mix(in srgb, var(--tt-pastel-menthe) 75%, #fff) 0%, #fff 100%);
  box-shadow: inset 0 0.625rem 0 0 var(--tt-pastel-menthe);
}

.tt-pricing-compare__plans-cell.tt-pricing-compare__plan--lilas {
  background: linear-gradient(180deg, color-mix(in srgb, var(--tt-pastel-lilas) 70%, #fff) 0%, #fff 100%);
  box-shadow: inset 0 0.625rem 0 0 var(--tt-pastel-lilas);
}

.tt-pricing-compare__plans-cell.tt-pricing-compare__plan--featured {
  box-shadow:
    inset 0 0.625rem 0 0 var(--tt-pastel-menthe),
    inset 0 0 0 1px color-mix(in srgb, var(--tt-mark-menthe) 25%, transparent);
}

.tt-pricing-compare__table thead {
  box-shadow: none;
}

.tt-pricing-compare__table thead th {
  position: static;
  box-shadow: none;
}

.tt-pricing-compare__table thead th:first-child {
  background: #fff;
  z-index: 5;
}

.tt-pricing-compare__table {
  --tt-compare-check-ciel: #7eb6d4;
  --tt-compare-check-menthe: var(--tt-mark-menthe);
  --tt-compare-check-lilas: #b8a4d4;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.875rem;
  line-height: 1.45;
  min-width: 44rem;
  table-layout: fixed;
  width: 100%;
}

.tt-pricing-compare__caption {
  display: none;
}

.tt-pricing-compare__col-feature {
  width: 46%;
}

.tt-pricing-compare__col-ciel,
.tt-pricing-compare__col-menthe,
.tt-pricing-compare__col-lilas {
  width: 18%;
}

.tt-pricing-compare__table thead th:first-child {
  background: #fff;
  color: var(--tt-ink-muted);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-align: left;
  text-transform: uppercase;
  z-index: 5;
}

.tt-pricing-compare__plan {
  text-align: center;
}

.tt-pricing-compare__plan--ciel {
  background: linear-gradient(180deg, color-mix(in srgb, var(--tt-pastel-ciel) 70%, #fff) 0%, #fff 100%);
  box-shadow: inset 0 0.625rem 0 0 var(--tt-pastel-ciel);
}

.tt-pricing-compare__plan--menthe {
  background: linear-gradient(180deg, color-mix(in srgb, var(--tt-pastel-menthe) 75%, #fff) 0%, #fff 100%);
  box-shadow: inset 0 0.625rem 0 0 var(--tt-pastel-menthe);
}

.tt-pricing-compare__plan--lilas {
  background: linear-gradient(180deg, color-mix(in srgb, var(--tt-pastel-lilas) 70%, #fff) 0%, #fff 100%);
  box-shadow: inset 0 0.625rem 0 0 var(--tt-pastel-lilas);
}

.tt-pricing-compare__plan--featured {
  box-shadow:
    inset 0 0.625rem 0 0 var(--tt-pastel-menthe),
    inset 0 0 0 1px color-mix(in srgb, var(--tt-mark-menthe) 25%, transparent);
}

.tt-pricing-compare__plan-name {
  color: var(--tt-ink);
  display: block;
  font-family: var(--tt-font-display);
  font-size: 1rem;
  font-weight: 500;
}

.tt-pricing-compare__plan--ciel .tt-pricing-compare__plan-name {
  color: #4a7f9c;
}

.tt-pricing-compare__plan--menthe .tt-pricing-compare__plan-name {
  color: color-mix(in srgb, var(--tt-mark-menthe) 55%, var(--tt-ink));
}

.tt-pricing-compare__plan--lilas .tt-pricing-compare__plan-name {
  color: #7d66a8;
}

.tt-pricing-compare__plan-price {
  color: var(--tt-ink-muted);
  display: block;
  font-size: 0.8125rem;
  font-weight: 500;
  margin-top: 0.2rem;
}

.tt-pricing-compare__plan-price small {
  font-size: 0.75rem;
}

.tt-pricing-compare__table tbody td:nth-child(2) {
  background: color-mix(in srgb, var(--tt-pastel-ciel) 12%, #fff);
}

.tt-pricing-compare__table tbody td:nth-child(3) {
  background: color-mix(in srgb, var(--tt-pastel-menthe) 14%, #fff);
}

.tt-pricing-compare__table tbody td:nth-child(4) {
  background: color-mix(in srgb, var(--tt-pastel-lilas) 12%, #fff);
}

.tt-pricing-compare__theme th {
  background: #fff;
  border-bottom: 1px solid var(--tt-border);
  border-top: 1px solid var(--tt-border);
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  padding: 1rem 0.75rem 0.55rem;
  text-align: left;
  text-transform: uppercase;
}

.tt-pricing-compare__theme th::before {
  background: var(--tt-separator-gradient);
  border-radius: 999px;
  content: "";
  display: inline-block;
  height: 3px;
  margin-right: 0.65rem;
  vertical-align: middle;
  width: 2rem;
}

.tt-pricing-compare__feature {
  background: #fff;
  color: var(--tt-ink);
  font-size: 0.875rem;
  font-weight: 500;
  padding: 0.7rem 0.85rem;
  text-align: left;
  vertical-align: top;
}

.tt-pricing-compare__feature-title {
  display: block;
}

.tt-pricing-compare__feature-hint {
  color: var(--tt-ink-faint);
  display: block;
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.5;
  margin-top: 0.25rem;
}

.tt-pricing-compare__table td {
  border-bottom: 1px solid color-mix(in srgb, var(--tt-ink) 5%, transparent);
  padding: 0.7rem 0.65rem;
  text-align: center;
  vertical-align: middle;
}

.tt-pricing-compare__table tbody tr:last-child td,
.tt-pricing-compare__table tbody tr:last-child th {
  border-bottom: 0;
}

.tt-pricing-compare__yes,
.tt-pricing-compare__no {
  display: inline-block;
  height: 1.35rem;
  position: relative;
  vertical-align: middle;
  width: 1.35rem;
}

.tt-pricing-compare__yes::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%239ed8b8' d='M6.2 11.6 2.8 8.2l1-1 2.4 2.4 6-6 1 1z'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1.1rem;
  content: "";
  display: block;
  height: 1.35rem;
  width: 1.35rem;
}

.tt-pricing-compare__table tbody td:nth-child(2) .tt-pricing-compare__yes::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%237eb6d4' d='M6.2 11.6 2.8 8.2l1-1 2.4 2.4 6-6 1 1z'/%3E%3C/svg%3E");
}

.tt-pricing-compare__table tbody td:nth-child(3) .tt-pricing-compare__yes::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%239ed8b8' d='M6.2 11.6 2.8 8.2l1-1 2.4 2.4 6-6 1 1z'/%3E%3C/svg%3E");
}

.tt-pricing-compare__table tbody td:nth-child(4) .tt-pricing-compare__yes::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23b8a4d4' d='M6.2 11.6 2.8 8.2l1-1 2.4 2.4 6-6 1 1z'/%3E%3C/svg%3E");
}

.tt-pricing-compare__yes--choice::after {
  display: none;
}

.tt-pricing-compare__no::before {
  background: color-mix(in srgb, var(--tt-ink) 18%, transparent);
  border-radius: 999px;
  content: "";
  display: block;
  height: 0.2rem;
  margin-top: 0.55rem;
  width: 0.85rem;
}

.tt-pricing-compare__note-cell {
  background: color-mix(in srgb, var(--tt-pastel-beurre) 35%, #fff) !important;
  color: var(--tt-ink-muted);
  font-size: 0.8125rem;
  line-height: 1.55;
  padding: 0.85rem 1rem !important;
  text-align: center;
}

.tt-pricing-compare__rules-cell {
  background: color-mix(in srgb, var(--tt-pastel-beurre) 28%, #fff) !important;
  padding: 0.85rem 1rem !important;
}

.tt-pricing-compare__rules {
  display: grid;
  gap: 0.85rem 1.5rem;
  text-align: left;
}

@media (min-width: 640px) {
  .tt-pricing-compare__rules {
    grid-template-columns: 1fr 1fr;
  }
}

.tt-pricing-compare__rules-label {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  margin: 0 0 0.25rem;
  text-transform: uppercase;
}

.tt-pricing-compare__rules-text {
  color: var(--tt-ink-muted);
  font-size: 0.8125rem;
  line-height: 1.55;
  margin: 0;
}

.tt-pricing-compare__callouts {
  display: grid;
  gap: 0.75rem;
  margin-top: 1.25rem;
  padding-inline: 1.25rem;
}

@media (min-width: 768px) {
  .tt-pricing-compare__callouts {
    grid-template-columns: 1fr 1fr;
    padding-inline: 1.35rem;
  }
}

.tt-pricing-compare__callout {
  background: #fff;
  border: 1px solid var(--tt-border);
  border-radius: var(--tt-radius-md);
  padding: 0.85rem 1rem;
}

.tt-pricing-compare__callout--visibilite {
  background: color-mix(in srgb, var(--tt-pastel-menthe) 22%, #fff);
  border-color: color-mix(in srgb, var(--tt-mark-menthe) 22%, var(--tt-border-strong));
}

.tt-pricing-compare__callout.tt-pricing-compare__callout--essai {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--tt-pastel-rose) 38%, #fff) 0%,
    color-mix(in srgb, var(--tt-pastel-rose) 22%, #fff) 100%
  );
  border-color: color-mix(in srgb, var(--tt-v-rose) 28%, var(--tt-border));
  box-shadow: inset 0 3px 0 0 color-mix(in srgb, var(--tt-v-rose) 38%, #fff);
}

.tt-pricing-compare__callout-title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: 0.875rem;
  font-weight: 500;
  margin: 0 0 0.5rem;
}

.tt-pricing-compare__callout-list {
  color: var(--tt-ink-muted);
  font-size: 0.8125rem;
  line-height: 1.5;
  margin: 0;
  padding-left: 1.05rem;
}

.tt-pricing-compare__callout-list li + li {
  margin-top: 0.3rem;
}

.tt-pricing-compare__callout-text {
  color: var(--tt-ink-muted);
  font-size: 0.8125rem;
  line-height: 1.55;
  margin: 0;
}

/* footnotes remplacées par .tt-pricing-compare__callouts */
.tt-pricing-compare__footnotes {
  display: none;
}

.tt-essai-glow {
  /* remplacé par .tt-pricing-formules__reassure */
  display: none;
}

.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal !important;
}

.tt-page-cta.tt-section {
  padding-block: clamp(2.5rem, 5vw, 4rem);
}

.tt-page-cta__grid {
  align-items: end;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

@media (min-width: 640px) {
  .tt-page-cta__grid {
    flex-direction: row;
    justify-content: space-between;
  }
}

.tt-page-cta__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.5rem, 3vw, 1.875rem);
  font-weight: 400;
  margin: 0;
}

.tt-page-cta__text {
  color: var(--tt-ink-light);
  font-size: 1rem;
  line-height: 1.65;
  margin: 0.75rem 0 0;
  max-width: 36rem;
}

.tt-faq-hero .tt-accueil-quoi__title {
  margin-top: 0.85rem;
}

.tt-faq-hero .tt-accueil-quoi__lead {
  margin-top: 1rem;
}

.tt-faq-wrap {
  margin-inline: auto;
  max-width: 42rem;
}

.tt-faq-toc {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.5rem;
  justify-content: center;
  margin: 0 0 2.75rem;
}

.tt-faq-toc a {
  align-items: center;
  color: var(--tt-ink);
  display: inline-flex;
  font-family: var(--tt-font-display);
  font-size: 0.6875rem;
  font-weight: 500;
  gap: 0.4rem;
  letter-spacing: 0.1em;
  padding: 0.35rem 0.55rem;
  text-decoration: none;
  text-transform: uppercase;
}

.tt-faq-toc a:hover {
  color: var(--tt-ink);
  text-decoration: none;
}

.tt-faq-toc .tt-parti-card__mark-icon {
  flex-shrink: 0;
  height: 1.35rem;
  width: 1.35rem;
}

.tt-faq-theme + .tt-faq-theme {
  margin-top: 3.25rem;
}

.tt-faq-theme {
  scroll-margin-top: 1.25rem;
}

.tt-faq-theme__title {
  align-items: center;
  background: color-mix(in srgb, var(--tt-canvas-warm) 85%, #fff);
  border-left: 3px solid var(--tt-v-rose);
  border-radius: 0 var(--tt-radius-md) var(--tt-radius-md) 0;
  color: var(--tt-ink);
  display: flex;
  font-family: var(--tt-font-display);
  font-size: 0.8125rem;
  font-weight: 500;
  gap: 0.55rem;
  letter-spacing: 0.14em;
  margin: 0 0 0.35rem;
  padding: 0.55rem 1rem 0.55rem 0.7rem;
  text-transform: uppercase;
}

.tt-faq-theme__title .tt-parti-card__mark-icon {
  flex-shrink: 0;
  height: 1.5rem;
  width: 1.5rem;
}

.tt-faq-theme--produit .tt-faq-theme__title {
  border-left-color: var(--tt-v-rose);
}

.tt-faq-theme--clients .tt-faq-theme__title {
  border-left-color: #7eb6d4;
}

.tt-faq-theme--activite .tt-faq-theme__title {
  border-left-color: #b8a4d4;
}

.tt-faq-theme--tarifs .tt-faq-theme__title {
  border-left-color: var(--tt-v-menthe);
}

.tt-faq-theme--compte .tt-faq-theme__title {
  border-left-color: #c4b5a5;
}

.tt-faq-list {
  border-top: 1px solid color-mix(in srgb, var(--tt-ink) 10%, transparent);
  margin-top: 0;
}

.tt-faq-item {
  border-bottom: 1px solid color-mix(in srgb, var(--tt-ink) 10%, transparent);
}

.tt-faq-theme:last-of-type .tt-faq-item:last-child {
  border-bottom: 0;
}

.tt-faq-item summary {
  color: var(--tt-ink);
  cursor: pointer;
  font-family: var(--tt-font-display);
  font-size: clamp(1rem, 2vw, 1.125rem);
  font-weight: 400;
  line-height: 1.45;
  list-style: none;
  padding: 1.25rem 2rem 1.25rem 0;
  position: relative;
}

.tt-faq-item[open] summary {
  font-weight: 500;
  padding-bottom: 0.45rem;
}

.tt-faq-item summary:focus {
  outline: none;
}

.tt-faq-item summary:focus-visible {
  outline: 1px solid color-mix(in srgb, var(--tt-ink) 28%, transparent);
  outline-offset: 0.2rem;
}

.tt-faq-pass__form {
  margin-inline: auto;
  max-width: 28rem;
}

.tt-faq-pass__form .tt-accueil-quoi__title {
  margin-bottom: 0.5rem;
}

.tt-faq-pass__form .tt-accueil-quoi__lead {
  margin-bottom: 1.25rem;
}

.tt-faq-item summary::-webkit-details-marker {
  display: none;
}

.tt-faq-item summary::after {
  color: var(--tt-ink-muted);
  content: "+";
  font-family: var(--tt-font-display);
  font-size: 1.25rem;
  line-height: 1;
  position: absolute;
  right: 0;
  top: 1.35rem;
  transition: transform 0.2s ease;
}

.tt-faq-item[open] summary::after {
  transform: rotate(45deg);
}

.tt-faq-item__answer {
  color: var(--tt-ink-light);
  font-size: 0.9375rem;
  line-height: 1.65;
  margin: 0;
  padding: 0.15rem 3.25rem 1.35rem 1.15rem;
}

.tt-faq-item__answer em {
  color: var(--tt-ink);
  font-style: italic;
  font-weight: 500;
}

.tt-faq-contact {
  margin-top: 3.25rem;
  padding-top: 0;
  text-align: center;
}

.tt-faq-contact__lead {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.15rem, 2.4vw, 1.35rem);
  font-weight: 400;
  margin: 0;
}

.tt-faq-contact__actions {
  gap: clamp(1.5rem, 4vw, 2.75rem);
  justify-content: center;
  margin-top: 1.35rem;
}

.tt-shot-chaos__body {
  background: color-mix(in srgb, var(--tt-pastel-sable) 30%, #fff);
  padding: 1rem;
}

.tt-shot-chaos__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
}

.tt-shot-chaos__tab {
  background: #fff;
  border: 1px solid color-mix(in srgb, var(--tt-ink) 10%, transparent);
  color: var(--tt-ink-muted);
  font-size: 0.6875rem;
  font-weight: 500;
  padding: 0.25rem 0.5rem;
}

.tt-shot-chaos__tab--active {
  background: var(--tt-pastel-corail);
  color: var(--tt-ink);
}

.tt-shot-chaos__note {
  color: var(--tt-ink-muted);
  font-size: 0.75rem;
  line-height: 1.55;
  margin: 0.75rem 0 0;
}

.tt-shot-chaos__files {
  display: grid;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.tt-shot-chaos__files li {
  align-items: center;
  background: #fff;
  border: 1px solid color-mix(in srgb, var(--tt-ink) 8%, transparent);
  display: flex;
  font-size: 0.75rem;
  justify-content: space-between;
  padding: 0.5rem 0.75rem;
}

.tt-shot-chaos__files li span:last-child {
  color: var(--tt-ink-muted);
  font-size: 0.625rem;
}

.tt-shot-chaos__sheet-title {
  color: var(--tt-ink);
  font-size: 0.875rem;
  font-weight: 600;
  margin: 0;
}

.tt-shot-chaos__sheet-meta {
  color: var(--tt-ink-muted);
  font-size: 0.6875rem;
  margin: 0.25rem 0 0;
}

.tt-shot-chaos__table {
  border: 1px solid color-mix(in srgb, var(--tt-ink) 10%, transparent);
  margin-top: 0.75rem;
  overflow: hidden;
}

.tt-shot-chaos__table-head,
.tt-shot-chaos__table-row {
  display: grid;
  font-size: 0.625rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.tt-shot-chaos__table-head {
  background: color-mix(in srgb, var(--tt-pastel-sable) 60%, #fff);
  color: var(--tt-ink-muted);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.tt-shot-chaos__table-head span,
.tt-shot-chaos__table-row span {
  padding: 0.375rem 0.5rem;
}

.tt-shot-chaos__table-row {
  background: #fff;
  color: var(--tt-ink);
  font-size: 0.75rem;
}

.tt-shot-pilotage__head {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.tt-shot-pilotage__period {
  color: var(--tt-ink-muted);
  font-size: 0.625rem;
}

.tt-shot-pilotage__stats {
  display: grid;
  gap: 0.5rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 0.75rem;
}

.tt-shot-pilotage__stat {
  border-radius: var(--tt-radius-md);
  padding: 0.5rem;
  text-align: center;
}

.tt-shot-pilotage__stat strong {
  color: var(--tt-ink);
  display: block;
  font-family: var(--tt-font-display);
  font-size: 1rem;
}

.tt-shot-pilotage__stat span {
  color: var(--tt-ink-muted);
  display: block;
  font-size: 0.625rem;
  margin-top: 0.125rem;
}

.tt-shot-pilotage__bars {
  display: grid;
  gap: 0.375rem;
  margin-top: 0.75rem;
}

.tt-shot-pilotage__bar-row {
  align-items: center;
  display: grid;
  font-size: 0.625rem;
  gap: 0.5rem;
  grid-template-columns: 1.75rem 1fr;
}

.tt-shot-pilotage__bar-row > span:first-child {
  color: var(--tt-ink-muted);
}

.tt-shot-pilotage__bar-row > span:last-child {
  background: color-mix(in srgb, var(--tt-mark-menthe) 55%, #fff);
  border-radius: 999px;
  display: block;
  height: 0.375rem;
}

/* ==========================================================================
   Responsive — téléphone · tablette · portable
   Desktop large (≥1024 / 1200) : grilles 3–4 col et shots inchangés.
   ========================================================================== */

html {
  overflow-x: clip;
}

.tt-section img,
.tt-accueil__container img,
.tt-faq-wrap img {
  height: auto;
  max-width: 100%;
}

@media (max-width: 899px) {
  .tt-faq-toc {
    justify-content: flex-start;
  }

  .tt-faq-toc a {
    letter-spacing: 0.07em;
  }

  .tt-faq-item summary {
    min-height: 2.85rem;
  }

  .tt-pricing-card__body {
    padding-inline: 1.15rem;
  }
}

@media (max-width: 639px) {
  .tt-faq-toc a {
    font-size: 0.625rem;
    letter-spacing: 0.05em;
    padding: 0.45rem 0.3rem;
  }

  .tt-faq-theme__title {
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    padding: 0.5rem 0.75rem 0.5rem 0.55rem;
  }

  .tt-faq-item summary {
    padding: 1.1rem 1.75rem 1.1rem 0;
  }

  .tt-faq-item[open] summary {
    padding-bottom: 0.4rem;
  }

  .tt-faq-item__answer {
    padding: 0.15rem 1.75rem 1.2rem 0.65rem;
  }

  .tt-faq-item summary::after {
    top: 1.15rem;
  }

  .tt-page-hero__lead,
  .tt-accueil-quoi__lead,
  .tt-section-head__lead {
    font-size: 1rem;
  }
}

/* ==========================================================================
   Pages légales — mentions, CGV, confidentialité
   ========================================================================== */

.tt-legal-hero.tt-section {
  background: #fff;
  isolation: isolate;
  padding-block: clamp(2.25rem, 5vw, 3.5rem) 0.5rem;
}

.tt-legal-hero.tt-section::before {
  background:
    radial-gradient(ellipse 58% 95% at 6% 12%, color-mix(in srgb, var(--tt-v-menthe) 62%, transparent), transparent 64%),
    radial-gradient(ellipse 58% 95% at 96% 8%, color-mix(in srgb, var(--tt-v-rose) 58%, transparent), transparent 64%),
    linear-gradient(180deg, transparent 55%, #fff 100%);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 0;
}

.tt-legal-hero .tt-legal__inner {
  position: relative;
  z-index: 1;
}

.tt-legal-hero__title {
  color: var(--tt-ink);
  font-family: var(--tt-font-display);
  font-size: clamp(1.45rem, 2.6vw, 1.7rem);
  font-weight: 400;
  letter-spacing: 0.01em;
  line-height: 1.3;
  margin: 0.85rem 0 0;
}

.tt-legal-hero__lead {
  color: var(--tt-ink-muted);
  font-size: 1rem;
  line-height: 1.65;
  margin: 0.65rem 0 0;
}

.tt-legal.tt-section {
  padding-block: 1.25rem clamp(2.75rem, 6vw, 4.5rem);
}

.tt-legal__inner {
  margin-inline: auto;
  max-width: 38rem;
}

.tt-legal-prevail {
  color: var(--tt-ink-muted);
  font-size: 0.9375rem;
  margin: 0 0 1rem;
}

.tt-legal__updated {
  color: var(--tt-ink-faint);
  font-size: 0.8125rem;
  margin: 0 0 1.5rem;
}

body.elementor-page .elementor-widget-html .tt-legal h2,
.tt-legal h2 {
  border-left: 3px solid var(--tt-accent);
  color: var(--tt-ink-muted) !important;
  font-family: var(--tt-font-display);
  font-size: 0.75rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.14em;
  line-height: 1.4 !important;
  margin: 2rem 0 0.85rem;
  padding-left: 0.75rem;
  text-transform: uppercase;
}

.tt-legal h2:first-of-type {
  margin-top: 0.25rem;
}

.tt-legal p,
.tt-legal li {
  color: var(--tt-ink-light);
  font-size: 0.9375rem;
  line-height: 1.75;
}

.tt-legal p {
  margin: 0 0 0.85rem;
}

.tt-legal ul {
  margin: 0 0 1rem;
  padding-left: 1.15rem;
}

.tt-legal li + li {
  margin-top: 0.3rem;
}

.tt-legal a {
  color: var(--tt-ink);
  text-decoration-color: color-mix(in srgb, var(--tt-mark-lien) 70%, transparent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

.tt-legal a:hover,
.tt-legal a:focus {
  color: var(--tt-ink-light);
  text-decoration-color: var(--tt-mark-lien);
}

.tt-legal__card {
  background: color-mix(in srgb, var(--tt-canvas-warm) 88%, white);
  border: 1px solid var(--tt-border);
  border-radius: var(--tt-radius-md);
  margin: 0 0 1rem;
  padding: 1.05rem 1.15rem 0.25rem;
}

.tt-legal__card p:last-child {
  margin-bottom: 0.85rem;
}

.tt-legal__card-label {
  color: var(--tt-ink-muted);
  font-family: var(--tt-font-display);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  margin-bottom: 0.45rem;
  text-transform: uppercase;
}

.tt-legal__card-foot {
  border-top: 1px solid var(--tt-border);
  margin-top: 0.15rem;
  padding-top: 0.75rem;
}

.tt-legal__hosts {
  display: grid;
  gap: 0.75rem;
  margin-bottom: 0.35rem;
}

.tt-legal__hosts .tt-legal__card {
  margin-bottom: 0;
}

@media (min-width: 640px) {
  .tt-legal__hosts {
    grid-template-columns: 1fr 1fr;
  }
}

.tt-legal__table-wrap {
  background: color-mix(in srgb, var(--tt-canvas-warm) 88%, white);
  border: 1px solid var(--tt-border);
  border-radius: var(--tt-radius-md);
  margin: 0.35rem 0 1.25rem;
  overflow-x: auto;
  padding: 0.35rem 1rem 0.15rem;
}

.tt-legal table {
  border-collapse: collapse;
  font-size: 0.875rem;
  width: 100%;
}

.tt-legal th,
.tt-legal td {
  border-bottom: 1px solid var(--tt-border);
  padding: 0.6rem 0.75rem 0.6rem 0;
  text-align: left;
  vertical-align: top;
}

.tt-legal tr:last-child td {
  border-bottom: 0;
}

.tt-legal th {
  color: var(--tt-ink-muted);
  font-family: var(--tt-font-display);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.tt-legal td {
  color: var(--tt-ink-light);
}

/* ==========================================================================
   Accessibilité
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}