/* Pages « patrons » (référencement) : par-dessus accueil.css, qui fournit la
   charte (feutrine, coutures, boutons, sections). Préfixe P- pour ce qui leur
   est propre. Les pages sont écrites par outils/construire-patrons.mjs. */

.P-ariane{padding-top:6px;font-size:13px;color:var(--encre-2)}
.P-ariane ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 0}
.P-ariane li+li::before{content:"/";margin-inline:8px;color:var(--encre-3)}
.P-ariane a{color:var(--encre-2);text-underline-offset:3px}
.P-ariane [aria-current]{color:var(--encre);font-weight:600}

.P-hero{padding-block:14px 24px}
.P-hero h1{font-size:clamp(32px,5.4vw,58px)}
.P-hero--index{grid-template-columns:minmax(0,1fr)!important}
.P-hero--index .chapo{max-width:62ch}

.P-schema{margin:0;display:grid;gap:8px;min-width:0}
.P-schema .sch-box{position:relative;isolation:isolate;background-color:var(--scene);background-image:var(--motif);border-radius:var(--r-lg);box-shadow:var(--ombre-1);padding:18px 26px;display:grid;place-items:center;min-height:260px;overflow:hidden}
.P-schema .sch-box svg{width:100%;height:auto;max-height:440px;display:block;overflow:visible}
.P-schema figcaption{font-size:12.5px;color:var(--encre-2);font-family:var(--mono);padding-inline:4px}

.P-ruban{grid-template-columns:repeat(5,minmax(0,1fr))}
.P-ruban b{font-variant-numeric:tabular-nums;line-height:1.15}
.P-ruban small{display:block;font-family:var(--police);font-size:12.5px;font-weight:400;color:var(--encre-2);letter-spacing:0;line-height:1.3}
@media (max-width:700px){.P-ruban{grid-template-columns:1fr 1fr}}

.P-sec{padding-top:40px}
.P-duo{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:16px;align-items:start}
@media (max-width:860px){.P-duo{grid-template-columns:minmax(0,1fr)}}
.P-pile{display:grid;gap:16px;min-width:0}

.P-extrait{grid-template-columns:minmax(0,1fr)}
.P-extrait h3{font-size:17px;margin-bottom:6px}
.P-extrait li{overflow-wrap:anywhere}
.P-extrait b{font-family:var(--mono);font-weight:500;font-variant-numeric:tabular-nums}
@media (max-width:760px){.P-extrait .texte{padding:20px 18px}}

.P-carte{padding:18px 20px}
.P-table{width:100%;border-collapse:collapse;font-size:14px}
.P-table th,.P-table td{padding:7px 0;border-bottom:1px dashed var(--trait);vertical-align:top}
.P-table tr:last-child>*{border-bottom:0}
.P-table th{text-align:left;font-weight:500;color:var(--encre-2);padding-right:12px}
.P-table td{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;text-wrap:pretty}
.P-table th{width:46%}
.P-liste{margin:0;padding-left:18px;display:grid;gap:5px;font-size:14px}

.P-prose{display:grid;gap:12px;font-size:16px;color:var(--encre);max-width:68ch;min-width:0}
.P-coches{list-style:none;margin:4px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:8px}
.P-coches li{position:relative;padding:10px 12px 10px 36px;border-radius:var(--r-md);background-color:var(--surface);background-image:var(--peluches);box-shadow:var(--ombre-1);font-size:14px;line-height:1.4}
.P-coches li::before{content:"";position:absolute;left:12px;top:13px;width:14px;height:14px;border-radius:50%;background:var(--laine);box-shadow:inset 0 0 0 2px var(--fil)}

.P-options dl,.P-tailles,.P-mesures{margin:0;display:grid;gap:12px}
.P-options dl>div,.P-tailles>div{display:grid;gap:6px}
.P-options dt,.P-tailles dt,.P-mesures dt{font-weight:600;font-size:14px}
.P-options dd,.P-tailles dd{margin:0;display:flex;flex-wrap:wrap;gap:5px}
.P-options dd span,.P-tailles dd span{font-size:13px;padding:3px 10px;border-radius:var(--r-pill);background:var(--surface);border:1px solid var(--trait);color:var(--encre)}
.P-mesures>div{display:grid;gap:2px;padding-bottom:10px;border-bottom:1px dashed var(--trait)}
.P-mesures>div:last-child{border-bottom:0;padding-bottom:0}
.P-mesures dt small{font-family:var(--mono);font-weight:400;font-size:12px;color:var(--encre-2);margin-left:6px}
.P-mesures dd{margin:0;font-size:14px;color:var(--encre-2)}
.P-note{font-size:14px;color:var(--encre);padding-top:6px;border-top:2px dashed var(--trait)}

.P-garde{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
@media (max-width:980px){.P-garde{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.P-garde{grid-template-columns:repeat(2,minmax(0,1fr))}}
.P-garde li{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:2px 10px;padding:10px 12px;border-radius:var(--r-md);background-color:var(--surface);background-image:var(--peluches);box-shadow:var(--ombre-1);min-width:0}
.P-garde li.ici{background-color:var(--accent-doux)}
.P-ic{grid-row:span 2;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--laine-clair,var(--surface-2))}
.P-ic svg{width:24px;height:24px;color:var(--encre)}
.P-garde b{font-family:var(--titre);font-weight:var(--w-titre);font-size:15.5px;min-width:0;overflow-wrap:anywhere}
.P-t{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:13px}
.P-t a,.P-t span{display:inline-block;padding-block:6px;min-height:24px}
.P-t a{color:var(--accent-2);text-underline-offset:3px}
:root[data-mode="sombre"] .P-t a{color:var(--accent)}
@media (prefers-color-scheme:dark){:root:not([data-mode="clair"]) .P-t a{color:var(--accent)}}
.P-t [aria-current]{font-weight:600;color:var(--encre)}

.P-index{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
@media (min-width:640px){.P-index{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.P-index{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}}
.P-vet{grid-template-rows:auto auto 1fr auto;align-content:stretch;padding:18px 16px 16px}
.P-vet-t{align-self:end}
.P-vet h2{font-size:22px}
.P-vet p{font-size:14px;color:var(--encre-2)}
.P-vet-t{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}
.P-vet-t a{display:grid;gap:1px;align-content:start;padding:9px 10px;min-width:0;border-radius:var(--r-md);background:var(--surface);text-decoration:none;border:1px solid var(--trait);transition:transform var(--mvt-vif)}
.P-vet-t a:hover{transform:translateY(-2px);border-color:var(--encre)}
.P-vet-t b{font-size:14.5px}
.P-vet-t a>span{font-family:var(--mono);font-size:11.5px;color:var(--encre-2);white-space:nowrap}
.P-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
