/* Coherix — accueil selon la Charte Coherix et NIMBY (2026-10-23).
   Concept : chaque section est une planche d'architecte posée sur du papier calque ;
   en mode sombre, le papier devient un bleu de plan. NIMBY garde son identité de sticker. */
/* polices hebergees sur le site (la politique de securite n autorise que les fichiers du site) */
@font-face{font-family:'Archivo Black';font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/archivo-black-400.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/barlow-condensed-600.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/ibm-plex-mono-500.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Sans';font-style:italic;font-weight:400;font-display:swap;src:url(assets/fonts/ibm-plex-sans-italic.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/ibm-plex-sans.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/ibm-plex-sans.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/ibm-plex-sans.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
:root{
  --paper:#F3F6F5; --paper-raised:#FFFFFF; --ink:#16191C; --ink-muted:#4E5961;
  --plan-blue:#1D4F91; --redline:#B8321F; --hairline:#9AA6AE;
  --nimby-red:#D7261E; --nimby-cream:#F2E8D0; --nimby-black:#151313;
  --font-plan:"Barlow Condensed","Arial Narrow",sans-serif;
  --font-sans:"IBM Plex Sans","Segoe UI",system-ui,sans-serif;
  --font-mono:"IBM Plex Mono",Consolas,monospace;
  --font-poster:"Archivo Black","Arial Black",sans-serif;
  --space-1:4px; --space-2:8px; --space-4:16px; --space-6:24px; --space-12:48px;
  --sheet:1180px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root{
  --paper:#0E2440; --paper-raised:#16304F; --ink:#EEF3F7; --ink-muted:#A9BCCB;
  --plan-blue:#7FB2F0; --redline:#FF8A73; --hairline:#3E5A7A; color-scheme:dark;}}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/26px var(--font-sans);
  background-image:radial-gradient(circle,var(--hairline) 1px,transparent 1.2px);background-size:24px 24px;}
html[lang="fr"] [lang="en"], html[lang="en"] [lang="fr"]{display:none}
img{max-width:100%;height:auto;display:block}
a{color:var(--plan-blue);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--redline)}
:focus-visible{outline:2px solid var(--plan-blue);outline-offset:2px}
h1,h2,h3{font-family:var(--font-plan);font-weight:600;line-height:1;margin:0;text-wrap:balance;letter-spacing:.005em}
p{margin:0}
.mono{font-family:var(--font-mono);font-size:12px;line-height:16px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-muted)}

.skip{position:absolute;left:-999px;top:8px;background:var(--paper-raised);padding:8px 12px;z-index:5}
.skip:focus{left:16px}
.wrap{max-width:var(--sheet);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}

/* en-tete */
.top{border-bottom:1px solid var(--ink);background:var(--paper)}
.top .wrap{display:flex;align-items:center;gap:var(--space-6);padding-block:var(--space-4);flex-wrap:wrap}
.brand{font-family:var(--font-plan);font-weight:600;font-size:30px;line-height:1;color:var(--ink);text-decoration:none;letter-spacing:.01em}
.brand b{color:var(--redline);font-weight:600}
.top nav{display:flex;gap:var(--space-4) var(--space-6);flex-wrap:wrap;margin-left:auto}
.top nav a{color:var(--ink);text-decoration:none;font-size:15px}
.top nav a:hover{color:var(--plan-blue);text-decoration:underline}
.lang{display:flex;border:1px solid var(--ink)}
.lang button{font:500 12px/1 var(--font-mono);letter-spacing:.06em;background:transparent;color:var(--ink);border:0;padding:8px 10px;cursor:pointer}
.lang button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}

/* planche generique */
.sheet{background:var(--paper-raised);border:1px solid var(--ink);margin-block:var(--space-12);position:relative}
.sheet-body{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:var(--space-12);padding:var(--space-12) var(--space-12) var(--space-6)}
.sheet-body > *{min-width:0}
.sheet h2{font-size:56px;line-height:52px;margin-bottom:var(--space-4)}
.lead{font-size:20px;line-height:30px;margin-bottom:var(--space-4)}
.sheet p + p{margin-top:var(--space-4)}
.links{display:flex;gap:var(--space-6);flex-wrap:wrap;margin-top:var(--space-6)}
/* cartouche de plan, en bas a droite de chaque planche */
.cartouche{display:grid;grid-template-columns:auto auto auto;border-top:1px solid var(--ink);margin-left:auto;width:max-content;max-width:100%}
.cartouche > div{border-left:1px solid var(--ink);padding:var(--space-2) var(--space-4)}
.cartouche strong{display:block;font:600 18px/22px var(--font-plan);color:var(--ink);letter-spacing:.02em}

/* accueil */
.hero .sheet-body{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:center}
.hero h1{font-size:68px;line-height:64px;margin:var(--space-4) 0 var(--space-6)}
.hero h1 em{font-style:normal;color:var(--plan-blue)}
.btn{display:inline-block;background:var(--redline);color:#fff;text-decoration:none;font-weight:500;padding:12px 18px;border:1px solid var(--redline)}
.btn:hover{background:transparent;color:var(--redline)}
@media (prefers-color-scheme:dark){.btn{color:var(--paper)}}
figure{margin:0}
.fig{position:relative;padding:22px 0 0 22px}
.fig img{border:1px solid var(--ink);aspect-ratio:16/9;object-fit:cover;width:100%}
/* cotes dessinees autour de l'image */
.dim-h{position:absolute;top:6px;left:22px;right:0;border-top:1px solid var(--plan-blue)}
.dim-h::before,.dim-h::after{content:"";position:absolute;top:-5px;width:1px;height:9px;background:var(--plan-blue)}
.dim-h::before{left:0}.dim-h::after{right:0}
.dim-h span{position:absolute;left:50%;top:-9px;transform:translateX(-50%);background:var(--paper-raised);padding:0 6px;font:500 11px/16px var(--font-mono);color:var(--plan-blue)}
.dim-v{position:absolute;top:22px;bottom:34px;left:6px;border-left:1px solid var(--plan-blue)}
.dim-v::before,.dim-v::after{content:"";position:absolute;left:-5px;height:1px;width:9px;background:var(--plan-blue)}
.dim-v::before{top:0}.dim-v::after{bottom:0}
figcaption{margin-top:var(--space-2)}

.credits{display:flex;gap:var(--space-6);align-items:center;flex-wrap:wrap;padding:var(--space-6) 0}
.credits img{width:160px;background:#fff;border:1px solid var(--ink)}

/* Reality Floor : coupe en trois temps */
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border:1px solid var(--ink);align-self:start}
.steps > div{padding:var(--space-4);border-left:1px solid var(--ink);position:relative}
.steps > div:first-child{border-left:0}
.steps > div:not(:last-child)::after{content:"";position:absolute;right:-7px;top:28px;border:6px solid transparent;border-left-color:var(--ink);z-index:1}
.steps h3{font-size:26px;margin:var(--space-2) 0}
.steps p{font-size:14px;line-height:21px;color:var(--ink-muted)}

/* NIMBY : son identite de sticker, dans sa propre planche */
.nimby{background:var(--nimby-cream);color:var(--nimby-black);border:3px solid var(--nimby-black)}
.nimby .sheet-body{align-items:center}
.nimby h2{font:400 84px/76px var(--font-poster);color:var(--nimby-red);text-transform:uppercase;letter-spacing:-.01em;-webkit-text-stroke:2px var(--nimby-black)}
.nimby .lead{font-weight:600}
.nimby a{color:var(--nimby-black);font-weight:600}
.nimby a:hover{color:var(--nimby-red)}
.nimby .cartouche,.nimby .cartouche > div{border-color:var(--nimby-black)}
.nimby .cartouche strong,.nimby .mono{color:var(--nimby-black)}
.sticker-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4)}
.sticker-row img{width:100%;filter:drop-shadow(0 2px 0 var(--nimby-black))}
.chip{display:inline-block;font:500 12px/16px var(--font-mono);letter-spacing:.06em;text-transform:uppercase;border:2px solid var(--nimby-black);border-radius:999px;padding:4px 12px;background:#fff}

.sofa-art{background:var(--paper);border:1px solid var(--ink);display:grid;place-items:center;padding:var(--space-6)}
.sofa-art img{width:min(256px,100%)}
ul.plain{margin:var(--space-4) 0 0;padding-left:20px}

/* histoire, soutien, contact */
.story .sheet-body{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.story blockquote{margin:var(--space-6) 0 0;padding-left:var(--space-4);border-left:2px solid var(--redline);font-size:20px;line-height:30px}
.contact address{font-style:normal;margin-top:var(--space-4)}
.notes{border-top:1px solid var(--ink);margin-top:var(--space-12);padding-block:var(--space-6)}
.notes ul{margin:var(--space-2) 0 0;padding-left:20px;color:var(--ink-muted);font-size:14px;line-height:22px;max-width:80ch}
footer .wrap{display:flex;gap:var(--space-6);flex-wrap:wrap;align-items:center;padding-block:var(--space-6);border-top:1px solid var(--ink)}
footer p{color:var(--ink-muted);font-size:14px}

@media (max-width:860px){
  .sheet-body,.hero .sheet-body,.story .sheet-body{grid-template-columns:minmax(0,1fr);padding:var(--space-6) var(--space-4) var(--space-4);gap:var(--space-6)}
  .hero h1{font-size:48px;line-height:46px}
  .sheet h2{font-size:42px;line-height:40px}
  .nimby h2{font-size:56px;line-height:52px}
  .steps{grid-template-columns:minmax(0,1fr)}
  .steps > div{border-left:0;border-top:1px solid var(--ink)}
  .steps > div:first-child{border-top:0}
  .steps > div:not(:last-child)::after{display:none}
  .cartouche{grid-template-columns:auto auto;width:100%}
  .top nav{margin-left:0;width:100%}
}

.mt-4{margin-top:var(--space-4)}
.h3-support{font-size:32px;margin-bottom:var(--space-4)}

/* boutons « tampon d'architecte » (modele B, 2026-10-23) : cartouche qui s'ecrase et laisse une empreinte */
.btn{position:relative;display:inline-block;padding:0;border:0;background:none;color:var(--ink);text-decoration:none;font-weight:400;-webkit-tap-highlight-color:transparent}
.btn:hover{background:none;color:var(--ink)}
.btn .face{display:inline-grid;grid-template-columns:auto auto;border:2px solid var(--ink);background:var(--paper-raised);box-shadow:4px 4px 0 var(--ink);transition:transform .06s ease,box-shadow .06s ease}
.btn .face b{font:600 22px/24px var(--font-plan);letter-spacing:.03em;padding:12px 18px;color:var(--ink)}
.btn .face i{font:500 11px/14px var(--font-mono);font-style:normal;letter-spacing:.08em;border-left:2px solid var(--ink);padding:8px 10px;display:flex;align-items:center;color:var(--redline)}
.btn:hover .face{box-shadow:5px 5px 0 var(--ink);transform:translate(-1px,-1px)}
.btn:active .face,.btn.is-down .face{transform:translate(4px,4px);box-shadow:0 0 0 var(--ink)}
.btn:focus-visible{outline:3px solid var(--plan-blue);outline-offset:6px}
.btn .ink{position:absolute;right:-26px;top:-20px;font:500 14px/1 var(--font-mono);letter-spacing:.12em;color:var(--redline);border:3px double var(--redline);padding:6px 8px;opacity:0;pointer-events:none;transform:rotate(-12deg) scale(1.6);white-space:nowrap}
.btn.inked .ink{animation:coh-ink 1.6s ease-out forwards}
@keyframes coh-ink{0%{opacity:0;transform:rotate(-12deg) scale(1.6)}12%{opacity:.9;transform:rotate(-12deg) scale(1)}70%{opacity:.85}100%{opacity:0;transform:rotate(-12deg) scale(1)}}
@media (prefers-color-scheme:dark){.btn .face{box-shadow:4px 4px 0 var(--ink)}}
.lang{box-shadow:2px 2px 0 var(--ink)}
.lang button:active{transform:translateY(1px)}
.sound-toggle{font:500 12px/1 var(--font-mono);letter-spacing:.06em;background:var(--paper-raised);color:var(--ink);border:1px solid var(--ink);padding:8px 10px;cursor:pointer;box-shadow:2px 2px 0 var(--ink)}
.sound-toggle:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--ink)}
.sound-toggle[aria-pressed="false"]{color:var(--ink-muted);text-decoration:line-through}
@media (prefers-reduced-motion:reduce){.btn .face,.btn:active .face,.btn:hover .face{transition:none;transform:none}.btn.inked .ink{animation:none}}

/* SOFA: a visible entry point on the first sheet and a localized player. */
.hero .links{align-items:center}
.sofa-video-shortcut{display:inline-flex;align-items:center;gap:12px;font-weight:500;line-height:22px;max-width:100%;padding:12px 0;text-decoration:none}
.sofa-video-shortcut:hover{text-decoration:underline;text-underline-offset:4px}
.sofa-play-icon{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;border:1px solid currentColor;border-radius:50%;font-size:13px;padding-left:2px}
#sofa-video{scroll-margin-top:24px}
.sofa-presentation{align-self:start;border:1px solid var(--ink);background:var(--paper);min-width:0}
.sofa-video-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px;border-bottom:1px solid var(--ink)}
.sofa-video-heading h3{font-size:30px;line-height:32px}
.sofa-video-heading .mono{white-space:nowrap;color:var(--plan-blue)}
.sofa-video-panel video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#101c23}
.sofa-video-panel video:focus-visible{outline-offset:3px}
.sofa-video-caption{padding:12px 16px 0;font-size:13px;line-height:20px;color:var(--ink-muted)}
.sofa-video-transcript{margin:12px 16px 0;font-size:14px;line-height:22px}
.sofa-video-transcript summary{cursor:pointer;color:var(--plan-blue);text-decoration:underline;text-underline-offset:3px}
.sofa-video-transcript p{margin-top:12px}
.sofa-video-direct{display:inline-block;margin:12px 16px 16px;font-size:13px;line-height:20px}
@media(max-width:860px){#sofa .sheet-body{gap:24px}.sofa-video-heading h3{font-size:28px;line-height:30px}}

/* SOFA store: one purchase, clearly separated platform requirements and direct support. */
#sofa-achat,#sofa-versions{scroll-margin-top:24px}
.sofa-overview{min-width:0}.sofa-overview>p,.sofa-overview>.sofa-purchase{margin-top:16px}
.sofa-overview>.mono{margin-top:0}.sofa-overview>h2{margin-top:12px}
.sofa-purchase{border:2px solid var(--plan-blue);padding:20px;background:var(--paper)}
.sofa-price{font:600 54px/1 var(--font-plan);color:var(--plan-blue)}
.sofa-price>span{font:500 16px/24px var(--font-mono)}
.sofa-purchase>p+p{margin-top:12px}.sofa-buy{margin-top:20px;width:100%;text-align:center}
.sofa-fine{font-size:14px;line-height:22px;color:var(--ink-muted);overflow-wrap:anywhere}
.sofa-store-details{padding:0 48px 36px}.sofa-store-details>h3{font-size:32px;line-height:36px;margin-bottom:20px}
.sofa-platforms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid var(--ink)}
.sofa-platform{padding:24px;min-width:0}.sofa-platform+.sofa-platform{border-left:1px solid var(--ink)}
.sofa-platform h4{font:600 30px/34px var(--font-plan);margin:12px 0 0}
.sofa-platform .plain{font-size:15px;line-height:24px}.sofa-platform li+li{margin-top:8px}
.sofa-platform details{margin-top:20px;font-size:14px;line-height:23px}
.sofa-platform summary,.sofa-existing summary{cursor:pointer;color:var(--plan-blue);font-weight:500}
.sofa-platform ol{padding-left:20px}.sofa-platform details p{margin-top:12px}
.sofa-feedback{margin-top:24px;padding:24px;border-left:4px solid var(--plan-blue);background:var(--paper)}
.sofa-feedback h3{font-size:32px;line-height:36px;margin-top:12px}.sofa-feedback p+p{margin-top:12px}
.sofa-feedback h3+p{margin-top:16px}.sofa-feedback .button{margin:20px 0 12px;max-width:100%;white-space:normal}
.sofa-existing{margin-top:24px;font-size:14px;line-height:23px}.sofa-existing p{margin-top:12px}
.sofa-downloads{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.sofa-download{padding:24px;border:1px solid var(--ink);min-width:0}.sofa-download h2{font-size:34px;line-height:38px}
.sofa-download p,.sofa-download ol{margin-top:16px}.sofa-download .button{margin-top:20px;max-width:100%;white-space:normal}
.sofa-download code{overflow-wrap:anywhere}.sofa-receipt{padding:32px}.sofa-receipt>p{margin:16px 0 24px}
@media(max-width:860px){.sofa-store-details{padding:0 16px 24px}.sofa-platforms,.sofa-downloads{grid-template-columns:minmax(0,1fr)}.sofa-platform+.sofa-platform{border-left:0;border-top:1px solid var(--ink)}.sofa-platform,.sofa-feedback,.sofa-download{padding:20px}.sofa-receipt{padding:20px}.sofa-price{font-size:48px}}

/* Clear, keyboard-accessible purchase/download actions. */
.sofa-purchase .button,.sofa-store-details .button,.sofa-receipt .button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 18px;border:2px solid var(--plan-blue);background:var(--plan-blue);color:var(--paper-raised);font:600 21px/26px var(--font-plan);text-align:center;text-decoration:none;white-space:normal;overflow-wrap:anywhere;box-shadow:3px 3px 0 var(--ink)}
.sofa-purchase .button:hover,.sofa-store-details .button:hover,.sofa-receipt .button:hover{background:var(--paper-raised);color:var(--plan-blue)}
.sofa-purchase .button:active,.sofa-store-details .button:active,.sofa-receipt .button:active{box-shadow:none;transform:translate(2px,2px)}
.sofa-download,.sofa-receipt>p,.sofa-receipt .sofa-feedback{overflow-wrap:anywhere}