/* ==========================================================================
   tor-pages.css — commun aux pages intérieures dessinées (Réalisations, Services) :
   en-tête de page, chapitres numérotés, cartes de prix, corps d'état, encadré.
   Jetons : style.css (:root --tor-*). Chargée par functions-tor.php.
   ========================================================================== */

.real{
  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-io:cubic-bezier(.77,0,.175,1);
  box-sizing:border-box;max-width:72rem;margin:0 auto;padding:0 clamp(1rem,4vw,2rem)}
/* téléphone : la mise en page WordPress donne déjà 24 px de marge ; on n'en rajoute pas
   (le texte était à 40 px du bord, contre 24 sur les autres pages) */
@media (max-width:560px){.real{padding-inline:0}}

/* --- en-tête de page ------------------------------------------------------ */
.real__tete{max-width:56rem;padding-top:clamp(.5rem,2vw,1.5rem);padding-bottom:clamp(2.2rem,5vw,3.6rem)}
.real__kicker{font:600 .74rem var(--archivo);letter-spacing:.2em;text-transform:uppercase;color:var(--tor-encre-2);margin:0 0 .9rem}
.real__kicker::before{content:"";display:inline-block;width:2.2rem;height:1px;background:var(--tor-or);vertical-align:middle;margin-right:.8rem}
.real__h1{font:900 clamp(2.4rem,6vw,4.4rem)/.96 var(--archivo);letter-spacing:-.03em;margin:0 0 1rem;color:var(--tor-encre);text-wrap:balance}
.real__chapo{font-size:clamp(1.05rem,1.6vw,1.2rem);line-height:1.55;color:var(--tor-encre-2);max-width:60ch;margin:0}

/* --- chapitres : le même en-tête pour le curseur et pour le livre --------- */
.chap{margin-bottom:clamp(3.5rem,8vw,6rem)}
.chap__tete{display:grid;grid-template-columns:auto 1fr;gap:.4rem 1.1rem;align-items:start;padding-top:1.3rem;margin-bottom:clamp(1.2rem,2.5vw,1.8rem);border-top:1px solid var(--tor-trait)}
.chap__num{font:800 .78rem/1 var(--archivo);letter-spacing:.18em;color:var(--tor-or-texte);padding:.45rem .5rem .4rem .6rem;border:1px solid var(--tor-or);border-radius:6px;margin-top:.35rem}
.chap__h{font:800 clamp(1.55rem,3.2vw,2.3rem)/1.05 var(--archivo);letter-spacing:-.02em;color:var(--tor-encre);margin:0 0 .45rem;text-wrap:balance}
.chap__lead{margin:0;color:var(--tor-encre-2);line-height:1.55;max-width:58ch}
.chap__note{margin:1.2rem 0 0;text-align:center;font-size:.82rem;color:var(--tor-encre-2)}

/* le curseur prend la largeur du chapitre et partage l'ombre du livre */
.real .aa{max-width:none;margin:0}
.real .aa__cadre{box-shadow:0 14px 34px rgba(21,26,34,.16)}

/* --- cartes de chantiers types (Services, chapitre 01) ---------------------- */
.tarifs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,17.5rem),1fr));gap:1.1rem}
.tarif{position:relative;display:flex;flex-direction:column;gap:.55rem;padding:1.5rem 1.5rem 1.4rem;background:var(--tor-surface);border:1px solid var(--tor-trait);border-top:3px solid var(--tor-or);border-radius:var(--tor-rayon-carte);box-shadow:var(--tor-ombre);
  transition:transform 200ms var(--ease-out),box-shadow 200ms var(--ease-out)}
.tarif--devis{border-top-color:var(--tor-trait)}
.tarif__type{font:600 .66rem var(--archivo);letter-spacing:.18em;text-transform:uppercase;color:var(--tor-or-texte);margin:0}
.tarif--devis .tarif__type{color:var(--tor-encre-2)}
.tarif__h{font:800 1.3rem/1.15 var(--archivo);letter-spacing:-.01em;color:var(--tor-encre);margin:0}
.tarif__prix{display:flex;flex-direction:column;gap:.1rem;margin:.3rem 0 .6rem;padding-bottom:.9rem;border-bottom:1px solid var(--tor-trait)}
.tarif__prix small{font:600 .72rem var(--archivo);letter-spacing:.08em;text-transform:uppercase;color:var(--tor-encre-2)}
.tarif__prix strong{font:900 clamp(1.9rem,3vw,2.4rem)/1 var(--archivo);letter-spacing:-.03em;color:var(--tor-bleu);font-variant-numeric:tabular-nums}
.tarif--devis .tarif__prix strong{font-size:1.5rem;color:var(--tor-encre-2);letter-spacing:-.01em}
.tarif__liste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45rem;color:var(--tor-encre-2);font-size:.93rem;line-height:1.45;flex:1}
.tarif__liste li{padding-left:1.1rem;position:relative}
.tarif__liste li::before{content:"·";position:absolute;left:.15rem;top:-.05rem;color:var(--tor-or);font-weight:900;font-size:1.3em;line-height:1}
.tarif__lien{margin-top:.9rem;align-self:flex-start;font:700 .85rem var(--archivo);color:var(--tor-bleu);text-decoration:none;padding:.7rem 0;border-bottom:2px solid transparent;transition:border-color 160ms var(--ease-out),transform 160ms var(--ease-out)}
.tarif__lien span{color:var(--tor-or-texte);margin-left:.2rem}   /* a11y : l'or pur tombe a 2,58:1 sur blanc */
.tarif__lien:active{transform:scale(.97)}
.tarif__lien:focus-visible{outline:2px solid var(--tor-or);outline-offset:3px;border-radius:3px}

/* --- corps d'état (Services, chapitre 02) ---------------------------------- */
.metiers{list-style:none;margin:0 0 2rem;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr));gap:1.2rem 2.4rem}
.metier{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:start;padding:1.2rem 0;border-top:1px solid var(--tor-trait)}
.metier__num{font:800 .78rem/1 var(--archivo);letter-spacing:.18em;color:var(--tor-or-texte);padding:.45rem .5rem .4rem .6rem;border:1px solid var(--tor-or);border-radius:6px;margin-top:.2rem}
.metier__h{font:800 1.12rem/1.2 var(--archivo);letter-spacing:-.01em;color:var(--tor-encre);margin:0 0 .35rem}
.metier__p{margin:0;color:var(--tor-encre-2);line-height:1.55;font-size:.95rem}

/* --- encadré « ce que nous ne faisons pas » -------------------------------- */
.cadre{margin:0;padding:1.4rem 1.6rem;background:var(--tor-papier-2);border-left:3px solid var(--tor-or);border-radius:0 var(--tor-rayon-carte) var(--tor-rayon-carte) 0;max-width:64ch}
.cadre__h{font:700 .8rem var(--archivo);letter-spacing:.14em;text-transform:uppercase;color:var(--tor-encre);margin:0 0 .5rem}
.cadre p:last-child{margin:0;color:var(--tor-encre-2);line-height:1.6}

/* survol à la souris seulement */
@media (hover:hover) and (pointer:fine){
  .tarif:hover{transform:translateY(-2px);box-shadow:var(--tor-ombre-haute)}
  .tarif__lien:hover{border-bottom-color:var(--tor-or)}
}
@media (prefers-reduced-motion:reduce){.tarif,.tarif__lien{transition:none}}

/* --- avertissement de prix (Services) -------------------------------------- */
/* bandeau interne : visible pour nous, disparaît dès que plus aucun prix n'est provisoire */
.tarifs__alerte{margin:0 0 1.2rem;padding:.85rem 1.1rem;border-radius:var(--tor-rayon-carte);background:#fdf0ef;border:1px solid var(--tor-erreur);color:#6b1a16;font-size:.9rem;line-height:1.5}
.tarifs__alerte code{font-size:.86em;background:rgba(163,43,37,.1);padding:.1rem .3rem;border-radius:4px}
/* encadré client : les montants affichés ne sont pas des devis */
.cadre--prix{margin-top:1.6rem;max-width:72ch}
.cadre--prix strong{color:var(--tor-encre)}