/* BEC — page Tarifs (après site.css). Courte, presque sèche : la grille, ce qui est compris,
   ce qui est facturé à part, la frontière. Préfixe tr- (t- est réservé aux fragments). */

/* page courte : sections plus serrées que sur Produit ou Méthode */
.tr-included, .tr-extra, .tr-boundary { padding-block: clamp(64px, 7vw, 104px); }

/* ------------------------------------------------------------ 1. Héros */
.tr-hero__grid { grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr); }
.tr-hero .display { max-width: 8em; }
.tr-hero .lede { max-width: 30em; }
/* le prix d'un usage : aucune carte, un filet et la typographie */
.tr-price { justify-self: end; width: min(100%, 470px); padding: 6px 0; }
.tr-price__label { font-size: 12px; line-height: 1.3; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 650; color: var(--cobalt); }
.tr-price__amount { margin-top: 14px; font-size: clamp(4.1rem, 2.3rem + 4.4vw, 7.25rem); line-height: 0.92; font-weight: 560; letter-spacing: -0.055em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tr-price__amount small { margin-left: 0.28em; font-size: 0.3em; letter-spacing: 0; font-weight: 600; color: var(--ink-soft); }
.tr-price__note { margin-top: 20px; font-size: clamp(1.0625rem, 1rem + 0.2vw, 1.1875rem); line-height: 1.45; letter-spacing: -0.01em; }
.tr-price__def { margin-top: 26px; padding-top: 16px; border-top: 1px solid var(--border); font-size: 14px; line-height: 1.6; color: var(--ink-faint); }
.tr-price__def a { margin-left: 6px; color: var(--cobalt); font-weight: 600; white-space: nowrap; }
.tr-price__def a::after { content: " ↓"; }
.tr-price__def a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* -------------------------------------------------------------- 2. La grille */
/* tableau pleine largeur : lignes hautes, filets fins ; la colonne pilote porte le filet bleu */
.tr-table { width: 100%; margin-top: 48px; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.tr-table th, .tr-table td { padding: 22px 24px; text-align: left; vertical-align: baseline; border-bottom: 1px solid var(--border); }
.tr-table th:first-child { padding-left: 0; }
.tr-table thead th { padding-top: 0; padding-bottom: 16px; font-size: 12px; line-height: 1.3; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 650; color: var(--ink-faint); border-bottom: 1.5px solid var(--ink); vertical-align: bottom; }
.tr-table thead .tr-pilot { color: var(--cobalt); border-bottom-color: var(--cobalt); }
.tr-table thead .tr-pilot span { display: block; margin-top: 6px; font-size: 13px; letter-spacing: 0; text-transform: none; font-weight: 500; color: var(--ink-soft); }
.tr-table tbody th { width: 30%; font-size: clamp(1.125rem, 1rem + 0.35vw, 1.375rem); font-weight: 600; letter-spacing: -0.015em; color: var(--ink); }
.tr-table tbody td { width: 35%; font-size: clamp(1.75rem, 1.2rem + 1.6vw, 2.75rem); line-height: 1; font-weight: 500; letter-spacing: -0.045em; color: var(--ink-soft); white-space: nowrap; }
.tr-table tbody .tr-pilot { font-weight: 600; color: var(--ink); }
.tr-table small { margin-left: 6px; font-size: 0.4em; letter-spacing: 0; font-weight: 600; color: var(--ink-faint); }

/* ------------------------------------ 2 et 3. Ce qui est compris ; un usage */
.tr-included__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px clamp(40px, 6vw, 96px); align-items: start; }
.tr-block-title { margin-top: 18px; }
.tr-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; margin-top: 22px; border-top: 1px solid var(--border); }
.tr-list li { position: relative; padding: 12px 0 12px 22px; font-size: 15.5px; line-height: 1.4; border-bottom: 1px solid var(--border); }
.tr-list li::before { content: ""; position: absolute; left: 2px; top: 1.3em; width: 10px; height: 2px; border-radius: 1px; background: var(--cobalt); }
.tr-dims { margin-top: 22px; border-top: 1px solid var(--border); }
.tr-dims div { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.tr-dims dt { font-size: 12px; line-height: 1.6; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 650; color: var(--cobalt); }
.tr-dims dd { font-size: 15.5px; line-height: 1.45; color: var(--ink-soft); }
.tr-note { margin-top: 20px; font-size: 15px; line-height: 1.55; font-weight: 500; text-wrap: pretty; }

/* ------------------------------------------ 4. Interventions complémentaires */
.tr-extra .h2 { margin-top: 22px; }
.tr-extra__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px clamp(40px, 6vw, 96px); margin-top: 44px; }
.tr-extra__item { display: grid; align-content: start; gap: 10px; padding-top: 18px; border-top: 1.5px solid var(--ink); }
.tr-extra__item p { font-size: 16px; line-height: 1.55; color: var(--ink-soft); }
.tr-extra__item .tr-extra__kind { font-size: 12px; line-height: 1.3; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 650; color: var(--cobalt); }
.tr-extra__item .tr-extra__price { font-size: clamp(1.75rem, 1.3rem + 1.3vw, 2.5rem); line-height: 1.05; font-weight: 560; letter-spacing: -0.04em; color: var(--ink); font-variant-numeric: tabular-nums; }
.tr-extra__price small { margin-left: 8px; font-size: 0.4em; letter-spacing: 0; font-weight: 600; color: var(--ink-faint); }
.tr-extra__item .tr-extra__price--text { color: var(--ink); }

/* ---------------------------------------------------------- 5. Frontière */
.tr-boundary__grid { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 32px clamp(40px, 6vw, 96px); align-items: start; }
.tr-boundary .h2 { margin-top: 22px; max-width: 12em; }
.tr-boundary__label { font-size: 15px; color: var(--ink-soft); }
.tr-boundary__label--next { margin-top: 24px; }
.tr-extra__item .tr-extra__limit { font-size: 14px; color: var(--ink-faint); }
.tr-boundary__list { display: grid; gap: 2px; margin-top: 8px; }
.tr-boundary__list li { position: relative; padding: 7px 0 7px 28px; font-size: 17px; line-height: 1.45; letter-spacing: -0.01em; }
.tr-boundary__list li::before { content: ""; position: absolute; left: 2px; top: 1.1em; width: 12px; height: 2px; border-radius: 1px; background: var(--cobalt); }
.tr-boundary__legal { margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--border-strong); font-size: clamp(1rem, 0.96rem + 0.2vw, 1.0625rem); line-height: 1.6; font-weight: 500; text-wrap: pretty; }

/* ------------------------------------------------------------ 6. Appel */
.tr-cta-list { margin-top: 14px; border-top: 1px solid rgba(255, 255, 255, 0.14); min-width: min(100%, 380px); }
.tr-cta-list li { display: flex; align-items: baseline; justify-content: space-between; gap: 32px; padding: 12px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.14); }
.tr-cta-list span { font-size: 14px; color: #B9BFC8; }
.tr-cta-list b { font-size: clamp(1.375rem, 1.1rem + 0.8vw, 1.875rem); font-weight: 560; letter-spacing: -0.035em; color: var(--white); font-variant-numeric: tabular-nums; white-space: nowrap; }
.tr-cta-list small { font-size: 0.45em; letter-spacing: 0; font-weight: 600; color: #B9BFC8; }


/* ------------------------------------------------------------ Responsive */
@media (max-width: 1100px) {
  .tr-hero__grid { grid-template-columns: minmax(0, 1fr); }
  .tr-price { justify-self: start; width: 100%; max-width: 560px; margin-top: 8px; padding: 28px 0 0; border-left: 0; border-top: 1px solid var(--border-strong); }
  .tr-included__grid, .tr-boundary__grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 720px) {
  .tr-table th, .tr-table td { padding: 16px 10px; }
  .tr-table tbody th { font-size: 15px; }
  .tr-list { grid-template-columns: minmax(0, 1fr); }
  .tr-dims div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .tr-extra__grid { grid-template-columns: minmax(0, 1fr); }
  .tr-boundary__list li { font-size: 16px; }
}

@media (max-width: 420px) {
  .tr-table thead th { letter-spacing: 0.08em; font-size: 10.5px; }
  .tr-table tbody td { font-size: 1.25rem; }
  .tr-price__amount { font-size: 3.7rem; }
}

/* franchise en base de TVA : une seule mention, sous la grille */
.tr-vat { margin-top: 14px; font-size: 13px; line-height: 1.5; color: var(--ink-faint); }
.tr-price__confirm { margin-top: 8px; max-width: 30em; font-size: 14px; line-height: 1.5; color: var(--ink-soft); }
.tr-note--delay { margin-top: 0; font-weight: 450; color: var(--ink-soft); }

/* Repositionnement du 29 septembre : préparation de la proposition, cadrage, délais. */
.tr-prep__steps { display: grid; margin-top: 16px; border-top: 1px solid var(--border-strong); }
.tr-prep__steps li { display: grid; grid-template-columns: 2.2rem minmax(0, 1fr); gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--border); }
.tr-prep__steps .mono { font-size: 12px; font-weight: 600; color: var(--cobalt); padding-top: 3px; }
.tr-prep__steps b { font-size: 17px; line-height: 1.3; font-weight: 620; letter-spacing: -0.012em; }
.tr-prep__steps p { margin-top: 4px; font-size: 15px; line-height: 1.55; color: var(--ink-soft); text-wrap: pretty; }
.tr-extra .split-head__aside .tr-list { grid-template-columns: minmax(0, 1fr); margin-top: 12px; }
.tr-extra .split-head__aside .tr-note { font-weight: 450; color: var(--ink-soft); }
.tr-extra__item p:not(.tr-extra__kind) { font-size: 16px; line-height: 1.6; color: var(--ink-soft); text-wrap: pretty; }
.tr-delays { display: grid; gap: 10px; margin-top: clamp(40px, 5vw, 64px); padding-top: 18px; border-top: 1px solid var(--border); max-width: 52em; }
.tr-delays .tr-vat { margin-top: 0; }
/* Titre aligné en haut quand l'aparté porte une liste. */
.tr-extra .split-head { align-items: start; }
