/* ════════════════════════════════════════════════════════════════
   LES DEUX SEUILS — la même grille et les mêmes éléments que dans
   les voies. Rien d'inventé ici : seules les deux portes sont
   propres au seuil.
   ════════════════════════════════════════════════════════════════ */

/* la grille du seuil : lecture large, notes à droite, comme la maison I */
body[data-maison="seuil"] .lecture{grid-column:2/span 8}
body[data-maison="seuil"] .notes{grid-column:11/span 2;padding-top:230px;
  border-left:1px solid var(--filet-clair);padding-left:20px}
body[data-maison="seuil"] h1{font-family:var(--serif);font-weight:300;font-size:46px;
  line-height:1.2;letter-spacing:-.015em}
body[data-maison="seuil"] h1 > span{display:block}
.etat{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);white-space:nowrap}

/* la planche du seuil : trois entrées de texte, pas de chiffres */
body[data-maison="seuil"] .planche .c .ti{font-family:var(--serif);font-weight:400;font-size:19px;
  line-height:1.3;margin-bottom:9px}
body[data-maison="seuil"] .planche .c .ti.non{color:var(--rompu)}
body[data-maison="seuil"] .planche .c p{margin:0;font-size:14px;line-height:1.68;color:var(--gris);
  max-width:none}


/* ── la colonne contextuelle ──────────────────────────────────────
   Les points saillants du concept, selon la page. Ce n'est pas de
   l'ornement : c'est ce qu'on doit avoir sous les yeux en lisant. */
body[data-maison="seuil"] .notes{padding-top:92px}
body[data-maison="seuil"] .notes .t{font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--faint);padding-bottom:13px;border-bottom:1px solid var(--encre)}
body[data-maison="seuil"] .notes .n{font-size:12px;line-height:1.7;color:var(--gris);padding:18px 0;
  border-top:1px solid var(--filet-clair)}
body[data-maison="seuil"] .notes .n:first-of-type{border-top:0}
body[data-maison="seuil"] .notes .n em{display:block;margin-bottom:5px;font-style:normal;
  font-family:var(--serif);font-weight:400;font-size:14.5px;line-height:1.35;color:var(--encre)}
body[data-maison="seuil"] .notes .n.cle em{color:var(--rompu)}
body[data-maison="seuil"] .notes .n.cle{color:var(--muted)}

/* ── les deux portes ──────────────────────────────────────────── */
.portes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin-top:52px;
  border-top:1px solid var(--encre)}
.bloc{display:flex;flex-direction:column;min-width:0}
.bloc[data-v="occasion"]{background:#F4F7FA;--a:#2E4A63;--cl:#9DB2C4;--fi:#D3E0EA}
.bloc[data-v="presence"]{background:#FAF7F1;--a:#7A6647;--cl:#C4B492;--fi:#E4DAC7}
.porte{flex:1 1 auto;display:flex;flex-direction:column;align-items:stretch;
  justify-content:flex-start;background:none;border:0;padding:30px 28px 24px;
  font-family:var(--sans);color:inherit;text-align:left;cursor:pointer;
  transition:background 220ms var(--e)}
.bloc[data-v="occasion"] .porte:hover{background:#EAF1F7}
.bloc[data-v="presence"] .porte:hover{background:#F5EFE4}
.porte .n{display:block;font-family:var(--serif);font-weight:300;font-size:32px;line-height:1;
  color:var(--cl);margin-bottom:14px}
.porte h2{margin:0 0 10px;font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.3;
  color:var(--encre)}
.porte p{margin:0 0 16px !important;font-size:14.5px !important;line-height:1.65 !important;
  color:var(--muted) !important;max-width:none !important}
.porte .tags{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-bottom:22px}
.porte .tags span{display:flex;align-items:center;font-size:11px;line-height:1.35;color:var(--muted);
  background:#fff;border:1px solid var(--fi);padding:6px 9px;min-height:32px}
.porte .tags span.fort{color:var(--a);font-weight:600}
.porte .go{margin-top:auto;display:inline-flex;align-items:center;gap:10px;font-size:11.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--a);font-weight:600}
.porte .go::before{content:'';flex:0 0 auto;width:7px;height:7px;border-radius:50%;
  background:var(--a);animation:appel 2200ms ease-in-out infinite}
@keyframes appel{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.6);opacity:.3}}
@media (prefers-reduced-motion: reduce){ .porte .go::before{animation:none} }

/* ── la question, en rompu : dans le pied et dans la page ─────── */
.pied .c .t.alerte{color:var(--rompu)}
.suite span.alerte{color:var(--rompu)}

.bloc .ec{display:flex;align-items:center;gap:13px;width:100%;padding:15px 28px 19px;
  border:0;border-top:1px solid var(--fi);background:none;cursor:pointer;
  font-family:var(--sans);color:inherit;text-align:left;min-height:86px;
  transition:background 220ms var(--e)}
.bloc .ec:hover{background:rgba(255,255,255,.7)}
.bloc .ec .b{flex:0 0 auto;width:34px;height:34px;border-radius:50%;background:var(--a);color:#fff;
  display:flex;align-items:center;justify-content:center;transition:transform 220ms var(--e)}
.bloc .ec:hover .b{transform:scale(1.08)}
.bloc .ec .x{flex:1 1 auto;min-width:0}
.bloc .ec .x b{display:block;font-size:13px;font-weight:600}
.bloc .ec .x span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  margin-top:2px;font-size:12.5px;color:var(--gris);line-height:1.45}
.bloc .ec .d{flex:0 0 auto;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--faint);white-space:nowrap}

body[data-maison="seuil"] .enc{margin-top:0;border-left:3px solid #CFC7B5;background:#fff;
  border-top:1px solid var(--filet-clair)}
body[data-maison="seuil"] .enc .t{font-family:var(--serif);font-weight:400;font-size:18px;
  margin-bottom:7px}

/* ── les deux tiroirs ─────────────────────────────────────────── */
.tr{max-width:720px;margin:44px 0 0}
.tr[hidden]{display:none !important}
#tOcc{--acc:#2E4A63;--acc2:#22384B;--clair:#9DB2C4;--teinte:#F4F7FA;--fil:#D3E0EA}
#tPre{--acc:#7A6647;--acc2:#5E4E36;--clair:#C4B492;--teinte:#FAF7F1;--fil:#E4DAC7}
.tt{display:flex;align-items:baseline;gap:16px;border-top:1px solid var(--acc);padding-top:22px}
.tt .n{font-family:var(--serif);font-weight:300;font-size:30px;line-height:1;color:var(--clair)}
.tt h3{margin:0 !important;font-family:var(--serif);font-weight:400;font-size:26px}
.tr .intro{margin:16px 0 0;font-size:15.5px;line-height:1.7;color:var(--muted);max-width:60ch}
.tr .form{margin-top:26px}
.fermer{display:inline-block;margin-top:20px;padding:10px 0;background:none;border:0;
  font-family:var(--sans);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--faint);cursor:pointer;min-height:44px}
.fermer:hover{color:var(--encre)}
.tr .merci{margin-top:0}

@media (max-width:1180px){
  body[data-maison="seuil"] .lecture{grid-column:1/span 9}
}
@media (max-width:980px){
  /* la colonne ne disparaît pas : elle passe dessous, en pleine largeur */
  body[data-maison="seuil"] .lecture{grid-column:1/span 12}
  body[data-maison="seuil"] .notes{display:block !important;grid-column:1/span 12;
    border-left:0;padding-left:0;padding-top:0;margin-top:56px;
    border-top:1px solid var(--encre);text-align:left}
  body[data-maison="seuil"] .notes .t{padding-top:18px;border-bottom:0}
  body[data-maison="seuil"] .notes .n{max-width:62ch;font-size:13px}
  body[data-maison="seuil"] .notes .n em{font-size:16px}
}
@media (max-width:860px){
  /* La page de garde n'a pas de fil d'Ariane : le nom doit y rester. Le seuil
     du site, lui, porte désormais les deux maisons — la marque lui cède la
     place, comme sur toutes les autres pages. */
  body[data-origine="Page de garde"] .marque{display:inline !important;font-size:12px;letter-spacing:.3em}
  /* une planche de texte ne tient pas en deux colonnes sur un téléphone */
  body[data-maison="seuil"] .planche .grille{grid-template-columns:1fr !important}
  body[data-maison="seuil"] .planche .c{border-left:0 !important;padding:18px 0 4px !important;
    border-top:1px solid var(--filet)}
  body[data-maison="seuil"] .planche .c:first-child{border-top:0;padding-top:6px !important}
  body[data-maison="seuil"] h1{font-size:29px !important;line-height:1.24 !important}
  body[data-maison="seuil"] h1 > span{display:inline}
  .portes{grid-template-columns:1fr;margin-top:34px}
  .bloc[data-v="presence"]{border-left:0}
  .porte{padding:24px 20px 20px}
  .porte h2{font-size:21px}
  .bloc .ec{padding:14px 20px 18px;min-height:70px}
  .bloc .ec .d{display:none}
  .tr{margin-top:32px}
  .tt h3{font-size:22px}
  .etat{display:none}
}