/* ============================================================
   TOKENS
   ============================================================ */
:root{
  --smoke:#F2F4F3;
  --paper:#FFFFFF;
  --ink:#2A2D34;
  --ink-70:rgba(42,45,52,.70);
  --ink-45:rgba(42,45,52,.45);
  --red:#E00506;
  --steel:#628395;
  --line:rgba(42,45,52,.12);
  --line-dark:rgba(242,244,243,.18);

  --serif:Georgia,"Gelasio","Times New Roman",serif;
  --sans:"Figtree",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  --wrap:1120px;
  --narrow:820px;
  --gut:clamp(20px,5vw,44px);
  --sect:clamp(60px,7.5vw,104px);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--smoke);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{margin:0;font-family:var(--serif);font-weight:400;line-height:1.1;letter-spacing:-.015em}
h1{font-size:clamp(36px,5.4vw,60px)}
h2{font-size:clamp(28px,3.6vw,42px)}
h3{font-size:clamp(18px,1.8vw,21px);line-height:1.3}
p{margin:0 0 1em}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:var(--gut)}
.narrow{max-width:var(--narrow);margin:0 auto}
.eyebrow{font-size:12.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--steel);margin:0 0 18px}
.lead{font-size:clamp(17px,1.7vw,19px);color:var(--ink-70)}
.center{text-align:center}
.center .lead{margin-left:auto;margin-right:auto;max-width:58ch}

.btn{display:inline-flex;align-items:center;gap:9px;padding:14px 24px;border-radius:3px;border:1px solid transparent;
     font-size:15px;font-weight:600;text-decoration:none;transition:transform .15s,background .15s,border-color .15s}
.btn-primary{text-transform:uppercase; background:var(--red);color:#fff}
.btn-primary:hover{transform:translateY(-2px)}
.btn-ghost{border-color:var(--line);color:var(--ink);background:var(--paper)}
.btn-ghost:hover{border-color:var(--ink)}
a:focus-visible,button:focus-visible{outline:2px solid var(--red);outline-offset:3px}

/* logo */
.brand{gap:0}
.brand img{height:24px;width:auto;display:block}
.ftr .brand img{height:26px}
@media (max-width:600px){.brand img{height:21px}}

/* ============================================================
   HEADER (clair)
   ============================================================ */
.hdr{position:sticky;top:0;z-index:60;background:rgba(242,244,243,.88);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;height:70px}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;font-family:var(--serif);font-size:19px}
.nav{display:flex;align-items:center;gap:28px}
.nav a{font-size:14.5px;font-weight:500;text-decoration:none;color:var(--ink-70);transition:color .15s}
.nav a:hover{color:var(--ink)}
.hdr .btn{padding:10px 18px;font-size:14px}
.burger{display:none;background:none;border:0;padding:8px;cursor:pointer}
.burger span{display:block;width:22px;height:1.5px;background:var(--ink);margin:5px 0}

/* ============================================================
   HERO
   ============================================================ */
.hero{padding:clamp(44px,6vw,80px) 0 clamp(44px,5vw,72px)}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,5vw,66px);align-items:center}
.hero h1{max-width:15ch}
.hero .lead{margin-top:22px;max-width:52ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hero-note{font-size:13.5px;color:var(--ink-45);margin-top:14px}

/* stats */
.stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper)}
.stats-in{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}
.stat{background:var(--paper);padding:26px 20px;text-align:center}
.stat b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(26px,3vw,34px);line-height:1}
.stat span{display:block;margin-top:8px;font-size:13px;color:var(--ink-45)}

/* ============================================================
   SECTIONS
   ============================================================ */
.sect{padding:var(--sect) 0}
.sect-head{margin-bottom:clamp(32px,4vw,48px)}
.sect-head p{margin-top:16px}

/* qui je suis */
.about-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,64px);align-items:center}
.ph{background:rgba(98,131,149,.08);border:1px dashed rgba(98,131,149,.5);display:flex;align-items:center;
    justify-content:center;text-align:center;padding:22px}
.ph span{font-size:11.5px;font-weight:500;line-height:1.8;letter-spacing:.05em;color:var(--steel);text-transform:uppercase}
.ph-portrait{aspect-ratio:4/5}
img.ph-portrait, img.ph-wide{width:100%;height:100%;object-fit:cover;border:0}
.about blockquote{margin:0 0 22px;font-family:var(--serif);font-size:clamp(22px,2.6vw,30px);line-height:1.28}


/* ce que je fais */
.offers{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.4vw,26px)}
.offer{background:var(--paper);border:1px solid var(--line);padding:30px 28px 32px;text-decoration:none;display:block;
       transition:border-color .15s,transform .15s}
.offer:hover{border-color:var(--ink);transform:translateY(-3px)}
.offer .tag{font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--steel)}
.offer h3{margin:14px 0 10px}
.offer p{margin:0;font-size:15.5px;color:var(--ink-70)}
.offer .go{display:inline-block;margin-top:18px;font-size:14px;font-weight:600;color:var(--red)}

/* indépendance */
.indep{background:var(--ink);color:var(--smoke)}
.indep h2{color:#fff;max-width:20ch}
.indep .lead{color:rgba(242,244,243,.7);max-width:56ch}
.indep .eyebrow{color:#93AEBD}
.nots{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,38px);margin-top:clamp(32px,4vw,48px)}
.not{border-top:1px solid var(--line-dark);padding-top:18px}
.not h3{margin:0 0 8px;color:#fff;font-size:19px}
.not p{margin:0;color:rgba(242,244,243,.62);font-size:15.5px}

/* avis */
.revs-more{margin-top:28px;display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center}
.revs-more a{font-weight:600;font-size:14.5px;color:var(--ink);text-underline-offset:5px}

/* vidéos */
.vids{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,26px)}
.vid{display:block}
.vid-thumb{position:relative;aspect-ratio:16/9;background:var(--ink);overflow:hidden;border:1px solid var(--line);cursor:pointer}
.vid-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.vid:hover .vid-thumb img{transform:scale(1.03)}
.vid-thumb iframe{width:100%;height:100%;border:0;display:block}
.vid h3{margin:15px 0 5px;font-size:18px}
.vid .chan{font-size:13px;color:var(--steel);margin:0}
.vid-thumb{background:transparent;border:0;box-shadow:var(--sh);transition:box-shadow .18s ease,transform .18s ease}
.vid:hover .vid-thumb{box-shadow:var(--sh-up);transform:translateY(-3px)}
.vid-thumb img{border-radius:var(--r)}

@media (prefers-reduced-motion:reduce){
  .vid-thumb{transition:none}
  .vid:hover .vid-thumb{transform:none}
}

/* CTA final */
.final{background:var(--paper);border-top:1px solid var(--line)}
.final-grid{display:grid;grid-template-columns:1fr .9fr;gap:clamp(28px,5vw,68px);align-items:start}
.steps-call{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.steps-call li{border-bottom:1px solid var(--line);padding:16px 0;display:flex;gap:16px;align-items:baseline}
.steps-call .n{font-family:var(--serif);font-size:17px;color:var(--red)}
.steps-call p{margin:0;font-size:15px;color:var(--ink-70)}
.steps-call strong{color:var(--ink);font-weight:600;display:block;font-size:16.5px}

/* footer */
.ftr{background:var(--ink);color:rgba(242,244,243,.66);padding:56px 0 30px;font-size:14.5px}
.ftr-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px}
.ftr h4{margin:0 0 14px;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#93AEBD}
.ftr ul{list-style:none;margin:0;padding:0}
.ftr li{margin-bottom:9px}
.ftr a{color:rgba(242,244,243,.66);text-decoration:none}
.ftr a:hover{color:#fff}
.ftr .brand{color:var(--smoke)}
.ftr .ftr-mail{color:#fff;font-size:15.5px}
.ftr-bot{margin-top:44px;padding-top:18px;border-top:1px solid var(--line-dark);display:flex;flex-wrap:wrap;gap:10px 24px;
         justify-content:space-between;font-size:12.5px;color:rgba(242,244,243,.42)}
.nowrap{white-space:nowrap}
.flag{display:inline-block;width:auto;vertical-align:-0.5em;margin-left:.15em;}

/* motion */
.rv{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s ease}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none;transition:none}
  .btn:hover,.offer:hover,.vid:hover .vid-thumb img{transform:none}
}

/* responsive */
@media (max-width:900px){
  .stats-in{grid-template-columns:1fr 1fr}
  .hero-grid,.about-grid,.final-grid,.offers{grid-template-columns:1fr}
  .hero-media,.about-media{max-width:300px;margin:0 auto}
  .nots,.vids{grid-template-columns:1fr}
  .ftr-grid{grid-template-columns:1fr 1fr}
  .nav{position:absolute;top:70px;left:0;right:0;background:var(--smoke);flex-direction:column;align-items:flex-start;gap:0;
       padding:6px var(--gut) 22px;display:none;border-bottom:1px solid var(--line)}
  .nav.open{display:flex}
  .nav a{padding:13px 0;font-size:16px;width:100%;border-bottom:1px solid var(--line)}
  .nav .btn{margin-top:14px;width:100%;justify-content:center}
  .burger{display:block}
  .hdr .nav-cta{display:none}
}
@media (max-width:560px){.ftr-grid{grid-template-columns:1fr}}

/* ============================================================
   PAGES INTÉRIEURES
   ============================================================ */
.nav a.active{color:var(--ink);font-weight:600}

/* hero de page */
.phero{padding:clamp(44px,5.5vw,72px) 0 clamp(36px,4vw,56px);border-bottom:1px solid var(--line)}
.phero h1{max-width:17ch}
.phero .lead{margin-top:20px;max-width:56ch}
.phero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}

/* ============================================================
   SECTION "CE QU'ILS ME DISENT"
   ============================================================ */
.echo{background:var(--paper)}
.echo-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(32px,5vw,72px);align-items:center}

.bulles{list-style:none;margin:0;padding:0}
.bulles li{
  position:relative;background:var(--smoke);border:1px solid var(--line);
  border-radius:var(--r) var(--r) var(--r) 2px;
  padding:16px 20px;margin-bottom:14px;max-width:38ch;
  font-family:var(--serif);font-size:clamp(16px,1.7vw,18px);line-height:1.35;
  box-shadow:var(--sh);
}
.bulles li::before{content:"«\00a0"}
.bulles li::after{content:"\00a0»"}
.bulles li:nth-child(even){margin-left:clamp(16px,4vw,44px)}
.bulles li:nth-child(3){margin-left:clamp(8px,2vw,22px)}
.bulles li:last-child{margin-bottom:0;border-color:rgba(224,5,6,.35)}

.echo h2{max-width:18ch}
.echo .lead{margin-top:20px;max-width:48ch}
.delai{
  font-family:var(--serif);font-size:clamp(20px,2.4vw,26px);line-height:1.45;
  margin:26px 0 0;padding-left:20px;border-left:2px solid var(--red);
}

@media (max-width:900px){
  .echo-grid{grid-template-columns:1fr}
  .bulles li,.bulles li:nth-child(even),.bulles li:nth-child(3){margin-left:0;max-width:100%}
}

/* Étiquette de l'accompagnement, sur toutes les cartes témoignage : la page
   témoignages comme la sélection de la page d'accueil. Ciblé sur .tcard et
   non sur l'identifiant du conteneur, qui diffère d'une page à l'autre. */
.tcard .tag{font-size:11.5px;font-weight:600;text-transform:uppercase;color:var(--steel)}


/* étapes ATLAS détaillées */
.steps{border-top:1px solid var(--line)}
.step{display:grid;grid-template-columns:120px 1fr 1fr;gap:clamp(18px,3vw,40px);padding:clamp(26px,3vw,38px) 0;border-bottom:1px solid var(--line);align-items:start}
.step-ltr{font-family:var(--serif);font-size:clamp(42px,5vw,64px);line-height:.9;color:var(--red)}
.step-ltr small{display:block;font-family:var(--sans);font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-45);margin-top:10px}
.step h3{font-size:clamp(21px,2.2vw,26px)}
.step-txt p{margin:12px 0 0;color:var(--ink-70);font-size:16px}
.step ul{list-style:none;margin:0;padding:0}
.step li{position:relative;padding-left:20px;margin-bottom:9px;font-size:15.5px;color:var(--ink-70)}
.step li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;background:var(--steel);transform:rotate(45deg)}

/* tarif */
.price{background:var(--paper);border:1px solid var(--line);border-left:3px solid var(--red);padding:clamp(26px,3vw,38px)}
.price h3{margin:0 0 12px;font-size:clamp(21px,2.2vw,26px)}
/* Pas de max-width : le texte occupe toute la largeur du cadre blanc.
   Tenable parce que le bloc est court ; au-delà de deux ou trois lignes,
   il faudrait rétablir une mesure de lecture. */
.price p{margin:0 0 .8em;color:var(--ink-70)}
.price p:last-child{margin-bottom:0}

/* FAQ */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:20px 40px 20px 0;position:relative;font-family:var(--serif);font-size:clamp(18px,1.9vw,21px)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:18px;color:var(--red);font-size:22px;font-family:var(--sans)}
.faq details[open] summary::after{content:"–"}
.faq .ans{padding:0 0 22px;max-width:70ch}
.faq .ans p{margin:0 0 .8em;color:var(--ink-70);font-size:16px}
.faq .ans p:last-child{margin-bottom:0}

@media (max-width:900px){
  .step{grid-template-columns:1fr;gap:14px}
  .step-ltr{display:flex;align-items:baseline;gap:14px;font-size:38px}
  .step-ltr small{margin-top:0}
}

/* ============================================================
   PAGE TÉMOIGNAGES
   ============================================================ */
.tgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(20px,2.4vw,26px)}
/* Variante 3 colonnes pour la sélection de la page d'accueil. */
.tgrid-3{grid-template-columns:repeat(3,1fr)}
.tcard{background:var(--paper);border:1px solid var(--line);display:flex;flex-direction:column}
.tcard .media{position:relative;aspect-ratio:16/9;background:var(--ink);overflow:hidden}
.tcard video{width:100%;height:100%;object-fit:cover;display:block;background:var(--ink)}
.tcard .media .ph{position:absolute;inset:0;background:rgba(42,45,52,.94);border-color:rgba(147,174,189,.4)}
/* Durée de la vidéo, en pastille sur la miniature.
   pointer-events:none pour ne jamais intercepter le clic de lecture. */
.tcard .media .dur{position:absolute;right:10px;bottom:10px;pointer-events:none;
  padding:3px 7px;border-radius:4px;background:rgba(22,24,28,.82);color:#fff;
  font-size:12.5px;font-weight:600;line-height:1.35;letter-spacing:.02em;
  font-variant-numeric:tabular-nums;transition:opacity .18s ease}
.tcard .media.playing .dur{opacity:0}
/* Calque de lecture : couvre toute la miniature pour que le clic parte
   de n'importe où. Il s'efface dès la lecture et rend la main aux
   contrôles natifs de la vidéo. */
.tcard .media .vplay{position:absolute;inset:0;width:100%;height:100%;
  border:0;padding:0;background:transparent;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:opacity .18s ease}
.tcard .media .vplay::before{content:"";width:56px;height:56px;border-radius:50%;
  background:var(--red);box-shadow:0 4px 16px rgba(0,0,0,.3);transition:transform .18s ease}
.tcard .media .vplay::after{content:"";position:absolute;
  border-style:solid;border-width:9px 0 9px 15px;
  border-color:transparent transparent transparent #fff;margin-left:4px}
.tcard .media .vplay:hover::before{transform:scale(1.08)}
.tcard .media .vplay:focus-visible{outline:2px solid var(--red);outline-offset:-4px}
.tcard .media.playing .vplay{opacity:0;pointer-events:none}
@media (prefers-reduced-motion:reduce){
  .tcard .media .vplay::before,
  .tcard .media .vplay:hover::before{transition:none;transform:none}
}
.tcard .media .ph span{color:#93AEBD}
.tcard .body{padding:24px 26px 28px}
.tcard blockquote{margin:0;font-family:var(--serif);font-size:clamp(17px,1.8vw,19px);line-height:1.4}
.tcard .who{margin-top:16px;font-size:13.5px;color:var(--ink-45)}
/* Nom et intitulé de l'accompagnement sur une seule ligne, séparés par un
   point médian. Si l'ensemble ne tient pas, le retour se fait après le
   séparateur : le nom ne se retrouve jamais seul en fin de ligne. */
.tcard .who b{color:var(--ink);font-weight:600;font-size:15px}
.tcard .who .sep{margin:0 6px;color:var(--ink-45)}


/* La variante 3 colonnes repasse à 2 avant de tomber à 1 sur mobile.
   L'ordre compte : la règle 680px doit rester la dernière pour l'emporter. */
@media (max-width:1000px){.tgrid-3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:680px){.tgrid,.tgrid-3{grid-template-columns:1fr}}

/* point rouge en fin de titre */
.pt{color:var(--red)}

/* variante : hero de page centré (pages sans visuel à droite) */
.phero-center{text-align:center}
.phero-center h1{margin:0 auto}
.phero-center .lead{margin-left:auto;margin-right:auto}
.phero-center .phero-cta{justify-content:center}

/* ============================================================
   PAGE QUI JE SUIS
   ============================================================ */
.phero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,5vw,64px);align-items:center}

/* récit */
.story{max-width:70ch}
.story p{font-size:clamp(17px,1.7vw,19px);color:var(--ink-70)}
.story p.big{font-family:var(--serif);font-size:clamp(22px,2.6vw,30px);color:var(--ink);line-height:1.3;margin:36px 0}

/* frise */
.tline{position:relative;padding-left:clamp(26px,4.5vw,54px);margin-top:clamp(36px,4.5vw,56px)}
.tline-track{position:absolute;left:5px;top:10px;bottom:10px;width:1px;background:var(--line)}
.tline-fill{position:absolute;left:0;top:0;width:100%;height:0;background:var(--red)}
.tstep{position:relative;padding-bottom:clamp(34px,4vw,50px);max-width:62ch}
.tstep:last-child{padding-bottom:0}
.tstep::before{content:"";position:absolute;left:calc(-1 * clamp(26px,4.5vw,54px));top:10px;width:11px;height:11px;
  background:var(--smoke);border:1px solid var(--ink-45);transform:rotate(45deg)}
.tstep.key::before{background:var(--red);border-color:var(--red)}
.tstep .yr{font-size:12.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--steel)}
.tstep h3{margin:8px 0 10px;font-size:clamp(20px,2.2vw,25px)}
.tstep.key h3{color:var(--red);font-size:clamp(24px,3.2vw,34px)}
.tstep p{margin:0 0 .7em;color:var(--ink-70);font-size:16.5px}
.tstep p:last-child{margin-bottom:0}

/* photos en bande */
.band{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,24px);margin-top:clamp(40px,5vw,64px)}
.band img{aspect-ratio:16/10}

/* convictions */
.creed{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,38px);margin-top:clamp(32px,4vw,48px)}
.cr{padding-top:4px}
.cr h3{margin:0 0 9px;font-size:20px;line-height:1.25;text-wrap:balance}
.cr p{margin:0;color:var(--ink-70);font-size:16px}

/* Numérotation des fun facts. Sans bordure, c'est le chiffre qui aligne
   les trois colonnes et porte le rythme - même procédé que la frise ATLAS. */
.cr-n{display:block;margin-bottom:12px;font-family:var(--serif);
  font-size:clamp(30px,3.2vw,40px);line-height:.9;color:var(--red);
  font-variant-numeric:tabular-nums}

@media (max-width:900px){
  .phero-grid{grid-template-columns:1fr}
  .phero-media{max-width:300px}
  .band,.creed{grid-template-columns:1fr}
}

/* ============================================================
   PAGE RÉSERVATION
   ============================================================ */
.booking{background:var(--paper);border:1px solid var(--line);padding:clamp(10px,1.5vw,18px);margin-top:clamp(28px,3.5vw,44px)}
.booking iframe{width:100%;border:0;display:block;min-height:720px}
.booking-fallback{margin:14px 2px 4px;font-size:14px;color:var(--ink-45)}
.booking-fallback a{color:var(--ink)}

.assure{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(24px,3vw,36px)}
.as{background:var(--paper);padding:22px 20px;text-align:center}
.as b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(21px,2.4vw,26px);line-height:1}
.as span{display:block;margin-top:7px;font-size:13.5px;color:var(--ink-45)}


@media (max-width:900px){
  .assure{grid-template-columns:1fr}
  .booking iframe{min-height:640px}
}

/* ============================================================
   ARRONDIS ET OMBRES
   ============================================================ */
:root{
  --r:6px;
  --r-sm:4px;
  --sh:0 1px 2px rgba(42,45,52,.04), 0 4px 14px rgba(42,45,52,.07);
  --sh-up:0 2px 4px rgba(42,45,52,.05), 0 12px 28px rgba(42,45,52,.11);
}

/* images */
img.ph-portrait,
img.ph-wide{width:100%;height:100%;object-fit:cover;border:0;display:block}
img.ph-portrait,
img.ph-wide,
.ph{border-radius:var(--r);box-shadow:var(--sh)}

/* blocs et cartes */
.offer,
.price,
.booking,
.tcard,
.vid-thumb,
.tcard .media,
.assure{border-radius:var(--r);box-shadow:var(--sh)}

/* les grilles à filet fin doivent rogner leurs cellules */
.assure,
.tcard,
.vid-thumb{overflow:hidden}

/* la vidéo et son cadre partagent le même arrondi en haut */
.tcard .media{border-radius:var(--r) var(--r) 0 0;box-shadow:none}
.tcard video,
.tcard .media .ph{border-radius:0;box-shadow:none}
.vid-thumb img{border-radius:0}

/* survols */
.offer:hover,
.tcard:hover{box-shadow:var(--sh-up)}
.tcard{transition:box-shadow .18s ease}

/* boutons */
.btn{border-radius:var(--r-sm)}
.btn-primary{box-shadow:0 2px 8px rgba(224,5,6,.22)}
.btn-primary:hover{box-shadow:0 6px 18px rgba(224,5,6,.28)}

/* en-tête */
.hdr{box-shadow:0 1px 0 rgba(42,45,52,.04)}

@media (prefers-reduced-motion:reduce){
  .tcard{transition:none}
}
/* ============================================================
   PAGES LÉGALES (confidentialité, mentions légales)
   Texte long : mesure de lecture courte, hiérarchie nette.
   ============================================================ */
.legal{max-width:72ch;margin:0 auto}
.legal h2{font-size:clamp(22px,2.4vw,28px);margin:clamp(38px,4vw,54px) 0 14px;scroll-margin-top:90px}
.legal h2:first-child{margin-top:0}
.legal h3{font-family:var(--sans);font-weight:600;font-size:17px;letter-spacing:0;
  margin:30px 0 8px;line-height:1.4}
.legal p{margin:0 0 1.1em;color:var(--ink-70)}
.legal ul{margin:0 0 1.3em;padding-left:22px;color:var(--ink-70)}
.legal li{margin-bottom:.5em}
.legal li::marker{color:var(--steel)}
.legal a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:var(--line)}
.legal a:hover{text-decoration-color:var(--red)}
.legal strong{color:var(--ink);font-weight:600}
.legal .maj{font-size:14px;color:var(--ink-45);margin-bottom:clamp(34px,4vw,48px)}

/* Encadré : point d'attention ou information importante */
.legal .note{background:var(--paper);border:1px solid var(--line);
  border-left:3px solid var(--red);padding:20px 24px;margin:0 0 1.4em;border-radius:2px}
.legal .note p:last-child{margin-bottom:0}

/* Sommaire */
.legal .toc{background:var(--paper);border:1px solid var(--line);
  padding:24px 28px;margin-bottom:clamp(38px,4vw,52px);border-radius:2px}
.legal .toc h2{font-family:var(--sans);font-size:12.5px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;color:var(--steel);margin:0 0 14px}
.legal .toc ol{margin:0;padding-left:20px;color:var(--ink-70);font-size:15.5px}
.legal .toc li{margin-bottom:.4em}

/* Tableau des prestataires */
.legal .tbl{width:100%;overflow-x:auto;margin:0 0 1.4em}
.legal table{width:100%;border-collapse:collapse;font-size:15px;min-width:520px}
.legal th,.legal td{text-align:left;vertical-align:top;padding:11px 14px;
  border-bottom:1px solid var(--line);color:var(--ink-70)}
.legal th{color:var(--ink);font-weight:600;font-size:13px;letter-spacing:.04em;
  text-transform:uppercase;background:var(--paper);white-space:nowrap}
.legal td:first-child{color:var(--ink);font-weight:600;white-space:nowrap}

/* Bloc identité des mentions légales */
.legal .ident{background:var(--paper);border:1px solid var(--line);
  padding:24px 28px;margin:0 0 1.4em;border-radius:2px}
.legal .ident p{margin:0 0 .5em}
.legal .ident p:last-child{margin-bottom:0}

@media (max-width:600px){
  .legal .toc,.legal .ident,.legal .note{padding-inline:20px}
}