/* Proxeed Car, design v3 "Noir": reading pages (conditions-location, the three guides, the two legal pages).
   Shared layout under .doc: a contents list (a box on phones, a sticky rail from 1024 px), numbered sections in
   .prose with a reading measure. Tokens of app.css only. Guide extras under .t-guide, legal extras under .t-legal. */

/* hero without a card: text column only */
.doc-hero .hero-in{grid-template-columns:minmax(0,760px)}
.doc-hero.plain{background:var(--carbon)}
.doc-hero.plain .hero-in{padding-top:clamp(26px,4vw,48px);padding-bottom:clamp(26px,4vw,44px)}
.byline{display:flex;flex-wrap:wrap;gap:6px 0;margin:18px 0 0;padding:14px 0 0;border-top:1px solid var(--line-d);font:500 13px/1.4 var(--sans);color:#cfcbc5;list-style:none}
.byline li+li:before{content:"·";margin:0 10px;color:var(--muted-d)}
.byline time{color:#fff}
@media (max-width:559px){.byline li:nth-child(3){flex-basis:100%;margin-top:2px}.byline li:nth-child(3):before{display:none}}

/* the grid: contents + text */
.doc-grid{display:grid;gap:26px}
@media (min-width:1024px){.doc-grid{grid-template-columns:250px minmax(0,1fr);gap:56px}}
.doc-main{min-width:0}

/* contents: a box on phones and tablets, a sticky rail on wide screens */
.doc-toc{padding:14px 16px 10px;background:var(--white);border:1px solid var(--line);border-radius:6px;font-size:14px}
.doc-toc-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:0 0 8px;font:600 11px/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
.doc-toc-h span{letter-spacing:.06em;text-transform:none;font-weight:500;color:var(--muted)}
.doc-toc ol{list-style:none;margin:0;padding:0}
.doc-toc li{break-inside:avoid}
.doc-toc li a{display:grid;grid-template-columns:26px minmax(0,1fr);gap:4px;padding:7px 0;border-top:1px solid var(--line);color:var(--text);line-height:1.35;text-decoration:none;transition:color .3s,padding .4s var(--ease)}
.doc-toc li a:hover{color:var(--red);padding-left:4px}
.doc-toc .n{font:700 15px/1.25 var(--serif);color:var(--red);font-variant-numeric:lining-nums tabular-nums}
.doc-toc-foot{margin:8px 0 2px;padding-top:9px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.doc-toc-foot a{color:var(--red);text-underline-offset:3px}
@media (min-width:620px) and (max-width:1023px){.doc-toc ol{columns:2;column-gap:28px}}
@media (min-width:1024px){
  .doc-toc{position:sticky;top:90px;align-self:start;max-height:calc(100vh - 110px);overflow-y:auto;padding:0;background:none;border:0;border-radius:0;font-size:13.5px;scrollbar-width:thin}
  .doc-toc li a{padding:8px 0}
}

/* numbered articles */
.doc-art{padding:30px 0 22px;border-top:1px solid var(--line)}
.doc-main>.doc-art:first-child{padding-top:0;border-top:0}
.doc-art-head{display:grid;grid-template-columns:38px minmax(0,1fr);align-items:baseline;gap:8px;margin-bottom:10px}
.doc-n{font:700 24px/1 var(--serif);color:var(--red);letter-spacing:0;font-variant-numeric:lining-nums tabular-nums}
.doc-art h2{margin:0;font-size:clamp(20px,1.9vw,24px)}
.doc-art .prose,.doc-body{max-width:61ch}
@media (min-width:760px){.doc-body{padding-left:46px}}
.doc-body>:last-child{margin-bottom:0}
.doc-body .prose{max-width:none}
.doc-body .note{margin-top:16px}
.doc-body .note b{display:block;margin-bottom:2px;font:600 11px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}

/* items as a clean list (title, then text) */
.doc-list{margin:14px 0 4px;border-top:1px solid var(--line)}
.doc-list>div{display:grid;gap:2px 20px;padding:10px 0;border-bottom:1px solid var(--line)}
@media (min-width:560px){.doc-list>div{grid-template-columns:minmax(120px,190px) minmax(0,1fr)}}
.doc-list dt{font-weight:700;color:var(--ink)}
.doc-list dd{margin:0;color:var(--muted);font-size:15px}
.doc-list dd p{margin:0}
.doc-list dd p+p{margin-top:6px}
.doc-list a{color:var(--red)}

/* summary strip (conditions "En bref") */
.doc-brief .sec-head{margin-bottom:18px}
.brief{display:grid;margin:0;border-top:1px solid var(--line)}
.brief>div{display:grid;grid-template-columns:118px minmax(0,1fr);gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.brief dt{font:600 11px/1.6 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.brief dd{margin:0;font-size:15px;color:var(--text)}
.brief dd p{margin:0}
@media (min-width:760px){.brief{grid-template-columns:repeat(3,1fr);column-gap:28px}.brief>div{grid-template-columns:1fr;gap:4px}}
@media (min-width:1100px){.brief{grid-template-columns:repeat(5,1fr);column-gap:0;border-top:0}.brief>div{padding:2px 22px;border-bottom:0;border-left:1px solid var(--line)}.brief>div:first-child{padding-left:0;border-left:0}}

/* the reservation insert after a long read */
.doc-book .split{align-items:center}
.doc-book .contract{max-width:460px}
@media (min-width:900px){.doc-book .contract{justify-self:end;width:100%}}

/* part 2 below */
/* guides: band photo inside the reading column, sources as numbered footnotes */
.doc-band{margin:8px 0 30px;aspect-ratio:16/10}
@media (min-width:760px){.doc-band{aspect-ratio:21/9}}
.doc-band img{position:absolute;inset:0}
.fn{list-style:none;margin:0;padding:0;counter-reset:fn;font-size:14px;line-height:1.5}
.fn li{position:relative;padding:8px 0 8px 32px;border-top:1px solid var(--line);overflow-wrap:anywhere}
.fn li:last-child{border-bottom:1px solid var(--line)}
.fn li:before{counter-increment:fn;content:counter(fn);position:absolute;left:0;top:8px;min-width:22px;font:700 15px/1.4 var(--serif);color:var(--red);font-variant-numeric:lining-nums tabular-nums}
.fn a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px;transition:text-decoration-color .3s,color .3s}
.fn a:hover{color:var(--red);text-decoration-color:currentColor}
.fn-d{color:var(--muted);white-space:nowrap}
.doc-sources h2{margin-bottom:12px;font-size:clamp(18px,1.6vw,20px)}
.t-guide .prose h3{margin:1.5em 0 .45em}
.t-guide .prose>:first-child{margin-top:0}

/* legal pages: identity facts (.kv) and the photo credits */
.t-legal .kv{margin:14px 0 4px;padding:16px 18px;background:var(--white);border:1px solid var(--line);border-radius:6px;gap:0 22px}
.t-legal .kv dt,.t-legal .kv dd{padding:8px 0;border-bottom:1px solid var(--line)}
.t-legal .kv dt:last-of-type,.t-legal .kv dd:last-of-type{border-bottom:0}
.t-legal .kv dd{overflow-wrap:anywhere}
@media (max-width:559px){.t-legal .kv{grid-template-columns:1fr}.t-legal .kv dt{padding:9px 0 0;border-bottom:0}.t-legal .kv dd{padding:2px 0 9px}}
.credits{list-style:none;margin:14px 0 0;padding:0;border-top:1px solid var(--line);font-size:14px}
.credits li{display:grid;gap:2px 20px;padding:9px 0;border-bottom:1px solid var(--line)}
@media (min-width:640px){.credits li{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}}
.cr-what{color:var(--ink)}
.cr-who{color:var(--muted);overflow-wrap:anywhere}
.cr-who a{color:var(--red);text-underline-offset:3px}
