/* LE NOM DES CHOSES — Édition Atelier v2
 * Surcouche visuelle non destructive. Guide du typographe (Suisse romande).
 * Contraste, efficacité, lecture mobile, sans police ni ressource tierce.
 */
:root {
  --paper:#eae6dc;
  --surface:#fffdf7;
  --ink:#1f2a2e;
  --muted:#566269;
  --line:#c9c6bc;
  --dark:#20292d;
  --leaf:#e8e5d8;
  --copper:#d66e2d;
  --cream:#f3f0e8;
  --shadow:0 12px 28px rgba(33,40,42,.10);
  --tool:#efa64b;
  --tool-dark:#c25d23;
  --steel:#435358;
}
html { scroll-padding-top:24px; }
body {
  background:var(--paper);
  color:var(--ink);
  font-family:"DejaVu Sans",Arial,Helvetica,sans-serif;
  font-size:16px;
}
h1,h2,h3,.brand-text,.card-body strong,.side-note strong,.footer strong {
  font-family:"DejaVu Sans Condensed","Arial Narrow",Arial,Helvetica,sans-serif;
  font-weight:800;
  letter-spacing:-.045em;
}
.site-header {
  background:#20292d;
  color:#fcf6e9;
  border-bottom:4px solid var(--tool);
  position:relative;
  z-index:2;
}
.site-header:after {
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:2px;
  background:repeating-linear-gradient(90deg,transparent 0 34px,rgba(255,255,255,.2) 34px 35px);
  pointer-events:none;
}
.header-in { min-height:92px; gap:30px; }
.brand { gap:15px; }
.logomark {
  background:transparent;
  width:55px;
  height:55px;
  color:var(--tool);
  border-radius:0;
  flex:none;
}
.logomark svg { width:100%;height:100%;display:block; }
.brand-text {
  font-size:25px;
  letter-spacing:-.047em;
  font-weight:900;
  line-height:1.06;
}
.brand-text i { font-style:normal;font-weight:900;color:var(--tool); }
.brand-text small {
  font:700 10px/1.4 "DejaVu Sans",Arial,sans-serif;
  letter-spacing:.135em;
  text-transform:uppercase;
  color:#d9d3c2;
  margin-top:7px;
}
.site-header nav { gap:9px; }
.site-header nav a {
  color:#f4f0e5;
  background:#334044;
  text-decoration:none;
  font-weight:800;
  text-transform:uppercase;
  font-size:11px;
  letter-spacing:.07em;
  border:1px solid #526063;
  border-radius:3px;
  padding:10px 16px;
  transition:background .12s ease,color .12s ease;
}
.site-header nav a:hover, .site-header nav a:focus-visible {
  color:#20292d;
  background:var(--tool);
  text-decoration:none;
}
.eyebrow {
  font-family:"DejaVu Sans",Arial,sans-serif;
  font-size:10px;
  font-weight:900;
  letter-spacing:.16em;
  color:var(--tool-dark);
}
.hero {
  color:#f7f0df;
  position:relative;
  background:
    repeating-linear-gradient(0deg,transparent 0 43px,rgba(255,255,255,.045) 44px 45px),
    repeating-linear-gradient(90deg,transparent 0 43px,rgba(255,255,255,.045) 44px 45px),
    radial-gradient(ellipse at 70% 30%,#465459 0,#273338 53%,#1e292d 100%);
  border-bottom:10px solid var(--tool);
}
.hero:before {
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:7px;
  background:repeating-linear-gradient(120deg,#313c40 0 11px,#f1a043 11px 23px);
  opacity:.8;
}
.hero-grid {
  padding-block:63px 71px;
  grid-template-columns:1.15fr .85fr;
  gap:70px;
  align-items:center;
}
.hero .eyebrow { color:#f2b868;margin-bottom:24px; }
.hero h1 {
  font-size:clamp(47px,5.05vw,74px);
  font-weight:900;
  line-height:1.13;
  letter-spacing:-.06em;
  text-wrap:balance;
}
.hero h1 em {
  color:var(--tool);
  font-weight:900;
  font-style:normal;
  text-decoration:underline;
  text-decoration-thickness:3px;
  text-underline-offset:12px;
}
.hero-lead {
  color:#e1e2da;
  font-size:18px;
  line-height:1.68;
  max-width:625px;
  margin:35px 0 26px;
}
.hero-jump {
  font-size:14px;
  font-weight:900;
  letter-spacing:.01em;
  background:var(--tool);
  color:#20292d;
  padding:15px 22px;
  border:2px solid #ffbc65;
  border-radius:3px;
  box-shadow:5px 5px 0 #0f191b;
  text-decoration:none;
  display:inline-flex;
  justify-content:space-between;
  gap:50px;
  transition:transform .14s ease,box-shadow .14s ease;
}
.hero-jump:hover {
  transform:translate(2px,2px);
  box-shadow:3px 3px 0 #0f191b;
}
.hero-object {
  width:100%;
  max-width:480px;
  margin:0 0 0 auto;
  aspect-ratio:450/420;
  border-radius:4px;
  border:8px solid #c9c2b1;
  outline:2px solid #141f21;
  transform:rotate(-1.25deg);
  padding:22px 29px 20px;
  color:#1f3238;
  box-shadow:14px 17px 0 rgba(14,21,25,.55);
  background:
    repeating-linear-gradient(0deg,transparent 0 23px,rgba(58,89,98,.07) 24px 25px),
    repeating-linear-gradient(90deg,transparent 0 23px,rgba(58,89,98,.07) 24px 25px),
    #e9e9dd;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  position:relative;
}
.hero-object:before,
.hero-object:after {
  content:"";
  width:8px;height:8px;
  position:absolute;top:9px;
  border-radius:50%;
  background:#7d8987;
  box-shadow:inset 1px 1px 1px #353f3e;
}
.hero-object:before{left:8px}
.hero-object:after{right:8px}
.hero-topline,.hero-bottomline {
  width:100%;
  display:flex;
  gap:12px;
  justify-content:space-between;
  color:#546467;
  font-size:9px;
  font-weight:900;
  letter-spacing:.11em;
  text-transform:uppercase;
  padding-bottom:10px;
  border-bottom:2px solid #82959a;
}
.hero-bottomline {
  padding:11px 0 0;
  border-bottom:0;
  border-top:2px solid #82959a;
  font-size:8px;
}
.hero-label {
  align-self:center;
  font:700 15px/1.4 "DejaVu Sans Condensed",Arial,sans-serif;
  letter-spacing:.02em;
  padding:10px 0 0;
  color:#41595a;
}
.hero-object svg{width:100%;max-height:166px;flex:none;filter:drop-shadow(3px 6px 1px rgba(55,71,72,.14))}
.hero-answer{font:600 14px/1.25 "DejaVu Sans",Arial,sans-serif}
.hero-answer strong {
  color:#263b41;
  margin-top:4px;
  font:900 25px/1.2 "DejaVu Sans Condensed",Arial,sans-serif;
  letter-spacing:-.025em;
}
.hero-note{font-size:11px;font-weight:600;color:#4e6663;margin:8px 0 14px}
.catalog-section {
  background:
    linear-gradient(90deg,rgba(50,62,63,.035) 1px,transparent 1px) 0 0 / 80px 80px,
    #efede5;
  padding:82px 0 110px;
}
.section-top{margin-bottom:32px}
.section-top .eyebrow{margin-bottom:13px}
.section-top h2{margin-bottom:13px;max-width:860px;font-size:clamp(33px,3.5vw,52px);line-height:1.1}
.section-top p:not(.eyebrow){font-size:16px;max-width:795px}
.find {
  position:relative;
  background:#fefcf5;
  border-radius:3px;
  padding:31px 34px 25px;
  border:2px solid #2f3e41;
  border-top:7px solid var(--tool);
  box-shadow:7px 7px 0 #c5c3ba;
}
.find:before { content:""; position:absolute;top:-7px;right:0;width:100px;height:7px;background:repeating-linear-gradient(120deg,#242e30 0 9px,#f1a046 9px 18px); }
.search-kicker {
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin-bottom:15px;
  color:#687372;
  font-size:10px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.115em;
}
.find label {font-size:21px;line-height:1.3;font-weight:900;color:var(--ink);margin:0 0 13px}
.search-wrap{
  border:2px solid #637276;
  background:#fff;
  padding:0 15px;
  border-radius:2px;
  box-shadow:inset 0 2px 3px rgba(0,0,0,.045);
}
.search-wrap:focus-within {border-color:var(--tool-dark);outline:2px solid #ecad6d;outline-offset:1px}
.search-wrap>span{font-size:40px;font-weight:900;color:#cb682e}
.search-wrap input{font-size:17px;padding:14px 0;color:var(--ink)}
.search-wrap input::placeholder{color:#58686d}
.search-wrap button{border:1px solid #bbad97;background:#f1e7d6;color:#3c3530;border-radius:2px;font-weight:750}
.search-tip{color:#4f5c60;font-size:12px;font-weight:600}
.filterbar{margin:38px 0 26px;gap:8px}
.filter{
  background:#fffdf6;
  color:#263639;
  border:1px solid #abb1aa;
  border-radius:2px;
  font-size:12px;
  padding:12px 17px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.015em;
}
.filter:hover,.filter[aria-pressed="true"]{color:#182227;background:var(--tool);border-color:#ba772c;box-shadow:inset 0 -3px #b5671f}
.result-meta{color:#46575b;font-weight:900;letter-spacing:.06em;text-transform:uppercase;font-size:11px}
.card-grid{gap:17px}
.object-card{
  border:1px solid #c6c4bb;
  background:#fffdf7;
  border-radius:3px;
  box-shadow:2px 3px 0 #d4d0c4;
}
.object-card:hover{transform:translateY(-3px);box-shadow:4px 7px 0 #c6bdb0;border-color:#bf8b53}
.object-card:focus-within{outline:3px solid #e18b3c;outline-offset:2px}
.drawing{
  background:
    repeating-linear-gradient(90deg,transparent 0 19px,rgba(88,116,120,.085) 19px 20px),
    repeating-linear-gradient(0deg,transparent 0 19px,rgba(88,116,120,.085) 19px 20px),
    #e9e8e0;
  border-bottom:2px solid #c4c9c5;
  aspect-ratio:5/3;
}
.drawing::before{
  content:"";
  position:absolute;
  z-index:1;
  top:11px;left:12px;
  width:7px;height:7px;
  border:2px solid #b5beb9;
  border-radius:50%;
}
.drawing svg{filter:drop-shadow(2px 4px 1px rgba(35,45,45,.12))}
.diagram-label{
  bottom:8px;right:9px;
  padding:4px 6px;
  color:#364d50;
  background:#f5f3ebdb;
  border:1px solid #cbd0cb;
  font-size:8px;
  letter-spacing:.07em;
  font-weight:900;
}
.card-body{padding:17px 17px 19px}
.card-meta{
  color:#a05221;
  font-size:10px;
  letter-spacing:.075em;
  font-weight:900;
  margin-bottom:9px;
}
.card-meta:before{content:"■";font-size:8px;padding-right:7px;vertical-align:2px;color:var(--tool-dark)}
.card-body strong{font-size:22px;line-height:1.16;letter-spacing:-.045em}
.card-question{font-size:12px;color:#4a5b5e;line-height:1.55;margin:12px 0 22px}
.card-cta{
  font-size:11px;
  color:#9d4d21;
  text-transform:uppercase;
  letter-spacing:.03em;
  border-top:1px dashed #c4c4bc;
  padding-top:12px;
  font-weight:900;
}
.card-cta span{font-size:16px}
.no-results{background:#fff4df;border:1px solid #e6b26f}
.method{
  background:#273438;
  color:#f5f2e8;
  border-top:8px solid var(--tool);
  padding:85px 0 90px;
}
.method .eyebrow{color:var(--tool)}
.method h2{font-size:clamp(34px,3.3vw,48px);line-height:1.17}
.method-copy>p:first-child{font-size:17px;color:#f5eee0;line-height:1.72}
.method-rule{border-top:1px solid #66757a;grid-template-columns:205px 1fr;gap:22px}
.method-rule strong{font-size:13px;color:#f3b46a}
.method-rule span{color:#d6dbd6;font-size:13px}
.method-sources{color:#d1d7d2}
.method-sources a{color:#f4ba79}
.footer{background:#141c1f;border-top:1px solid #465253;color:#fff8e9}
.footer strong{font-size:21px;letter-spacing:-.03em}
.footer p{color:#d3d6d0}
.footer a{color:#efb47b}
.crumbs{font-size:12px;color:#3e5255;font-weight:650}
.crumbs a{color:#3d5557}
.fiche-grid{gap:65px}
.fiche-main h1{font-size:clamp(43px,5vw,69px);line-height:1.12}
.fiche-main .eyebrow{color:#ae5526}
.fiche-question{font:800 21px/1.45 "DejaVu Sans Condensed",Arial,sans-serif;color:#a65328}
.fiche-lead{font-size:19px}
.fiche-main h2{font-size:30px}
.aliases{background:#fff6e8;border-left:6px solid var(--tool);border-radius:2px}
.aliases span{color:#914819}
.fiche-caution{border-left:6px solid #c47736;background:#fff6e6;color:#463b32}
.back{color:#995025;text-transform:uppercase;font-size:12px;font-weight:900}
.fiche-side .drawing-large{background-color:#e5e5dc;border:5px solid #4f6063;border-radius:3px}
.side-note{background:#fffdf5;border:1px solid #c9c8be;border-top:6px solid var(--tool);padding:24px}
.side-note span{font-weight:900;color:#995024}
.side-note strong{font-size:21px;font-weight:900}
.related-head h2{font-size:36px}
.error .hero-jump{box-shadow:4px 4px 0 #283439}
@media (max-width:1050px){
  .hero-grid{gap:36px}
  .hero h1{font-size:clamp(43px,5vw,66px)}
  .hero-object{padding:15px}
  .hero-answer strong{font-size:21px}
}
@media (max-width:760px){
  .header-in{min-height:auto;display:flex;flex-wrap:wrap;align-items:center;padding:13px 0 11px;gap:12px}
  .brand{gap:9px;width:100%}
  .logomark{width:37px;height:37px}
  .brand-text{font-size:20px;letter-spacing:-.055em}
  .brand-text small{font-size:9px;margin-top:4px;letter-spacing:.06em}
  .site-header nav{display:grid;grid-template-columns:1fr 1fr;gap:9px;width:100%}
  .site-header nav a{min-height:42px;display:flex;align-items:center;justify-content:center;text-align:center;padding:9px 12px;font-size:11px;letter-spacing:.025em}
  .hero-grid{grid-template-columns:minmax(0,1fr);gap:25px;padding:43px 0 43px}
  .hero h1{font-size:clamp(41px,10vw,61px);line-height:1.17}
  .hero h1 em{text-decoration-thickness:2px;text-underline-offset:7px}
  .hero .eyebrow{font-size:9px;line-height:1.6}
  .hero-lead{font-size:16px;margin:27px 0 22px}
  .hero-jump{font-size:13px;padding:12px 17px;gap:33px}
  .hero-object{max-width:none;min-height:0;height:143px;aspect-ratio:auto;margin:0;border-width:5px;transform:none;display:grid;grid-template-columns:40% minmax(0,1fr);grid-template-rows:1fr;gap:9px;padding:12px 16px;box-shadow:5px 6px 0 #141b1e}
  .hero-object svg{grid-column:1;grid-row:1;width:100%;max-height:113px}
  .hero-topline,.hero-bottomline,.hero-label,.hero-note{display:none}.hero-answer{grid-column:2;grid-row:1;font-size:12px;text-align:left}
  .hero-answer strong{font-size:23px}
  .catalog-section{padding:55px 0 75px}
  .section-top h2{font-size:35px}
  .section-top p:not(.eyebrow){font-size:14px}
  .find{padding:20px 16px 19px;box-shadow:4px 4px 0 #c5c3ba}
  .find label{font-size:17px}
  .search-kicker{font-size:8px;gap:9px}
  .search-kicker span:last-child{display:none}
  .search-wrap{padding:0 10px}
  .search-wrap input{font-size:14px;padding:12px 0}
  .search-wrap>span{font-size:30px}
  .filterbar{gap:7px;margin:27px 0}
  .filter{font-size:10px;padding:10px 12px}
  .card-grid,.related .card-grid{gap:12px}
  .card-body{padding:13px}
  .card-body strong{font-size:18px}
  .card-question{margin:8px 0 16px}
  .diagram-label{font-size:6px;bottom:5px;right:4px;padding:2px 3px}
  .method{padding:63px 0 67px}
  .method-rule{grid-template-columns:1fr;gap:8px}
  .method-copy>p:first-child{font-size:16px}
  .crumbs{margin-bottom:25px}
  .fiche-grid{gap:25px}
  .fiche-main h1{font-size:clamp(42px,9vw,59px)}
  .fiche-question{font-size:19px}
  .side-note{padding:17px}
}
@media(max-width:400px){
  .site-header nav a{font-size:10px;padding:9px 7px}
  .brand-text{font-size:19px}
  .brand-text small{font-size:8px}
  .logomark{width:34px;height:34px}
  .object-link{flex-direction:row}
  .drawing{width:38%;min-height:160px}
  .fiche-side .drawing-large{width:100%;min-height:210px}
  .card-body{width:62%}
  .hero-object{min-height:0;height:133px}
  .hero h1{font-size:40px}
}
@media(prefers-reduced-motion:reduce){.hero-jump{transition:none}}

/* Fiches de repérage : repères concrets sans usurper une homologation. */
.criteria-panel{background:#fff8e9;border-top:5px solid #e7a24b;padding:23px 25px 22px;margin:29px 0;border-left:1px solid #d7cfc2;border-right:1px solid #d7cfc2;border-bottom:1px solid #d7cfc2}
.criteria-panel .eyebrow{margin:0 0 4px;color:#a35825;font-size:10px;letter-spacing:.1em}
.fiche-main .criteria-panel h2{font-size:25px;margin:0 0 12px}
.criteria-intro{font-size:13px;line-height:1.65;color:#516165;margin:0 0 11px}
.criteria-panel ul{margin:0;padding:0;list-style:none}
.criteria-panel li{position:relative;padding:12px 0 11px 27px;border-top:1px solid #e0d8ca;line-height:1.55;font-size:14px;color:#283b3e}
.criteria-panel li:before{content:"✓";position:absolute;left:0;color:#a95d26;font-weight:900;font-size:17px}
.sources-panel{margin:34px 0;border:1px solid #c5cbc3;background:#f8faf4;padding:20px 23px}
.fiche-main .sources-panel h2{font-size:24px;margin:0 0 10px}
.sources-panel>p{font-size:12px;line-height:1.55;color:#546466;margin-bottom:13px}
.sources-panel ul{margin:0;padding:0;list-style:none}
.sources-panel li{padding:12px 0;border-top:1px solid #d4dcd4}
.sources-panel li a{display:block;font-size:14px;line-height:1.4;font-weight:850;color:#864c2c}
.sources-panel li span{display:block;margin-top:5px;color:#566b67;font-size:12px;line-height:1.6}
@media(max-width:760px){.criteria-panel{padding:18px}.criteria-panel li{font-size:13px}.sources-panel{padding:18px}}

/* Photographies contrôlées ; jamais présentées comme preuve de compatibilité. */
.drawing-photo{display:flex;flex-direction:column;align-items:stretch;justify-content:center;background:#ecece7;margin:0;min-width:0}
.drawing-photo img{display:block;max-width:100%;width:100%;height:100%;max-height:100%;object-fit:contain;object-position:center}
.drawing-large.drawing-photo{aspect-ratio:auto;min-height:255px;padding:14px;gap:8px}
.drawing-large.drawing-photo img{max-height:350px;min-height:185px;flex:1;object-fit:contain}
.drawing-photo .photo-credit{width:100%;display:block;border-top:1px solid #bac4be;padding:9px 4px 3px;color:#43565a;font-size:11px;line-height:1.5;text-align:left}
.drawing-photo .photo-credit a{color:#915120;font-weight:800}
.drawing-pending{background:repeating-linear-gradient(0deg,transparent 0 19px,#d7dfd5 20px),#e9ede7;color:#506863}
.drawing-pending svg{max-height:130px;opacity:.6}
.editorial-level{background:#edf2e8;border-left:5px solid #648a6f;color:#294638;padding:13px 17px;font-size:12px;line-height:1.65;margin:22px 0 6px}
.editorial-level strong{font-size:12px;letter-spacing:.015em}
.identification-section{background:transparent;border-top:1px solid #cbd0c8;padding-top:9px;margin-top:29px}
.fiche-main .identification-section h2{font-size:26px;margin:23px 0 9px}
.identification-section p{font-size:15px;color:#405658;line-height:1.72}
@media(max-width:760px){.drawing-large.drawing-photo{min-height:230px;padding:10px}.drawing-large.drawing-photo img{max-height:240px}.drawing-photo .photo-credit{font-size:10px}.fiche-main .identification-section h2{font-size:23px}}
