/* ============================================================================
   GOOD ALLURE — feuille de base, remise à blanc du 2026-08-09
   ----------------------------------------------------------------------------
   Les designs repartent de zéro. Ce fichier ne porte plus que le socle :
   les polices, les jetons de couleur et de taille, la remise à zéro du
   navigateur, et l'en-tête, seul élément conservé sur les pages.

   Tout le reste (hero, grilles, cartes produit, pied de page, newsletter,
   animations au scroll) vit dans le commit 96ea4e6 et dans `shop.css`, qui
   reste sur le disque sans être chargé. On y repuise si besoin.

   Piège vérifié, à respecter dans le nouveau design : l'état par défaut est
   TOUJOURS l'état visible. Tout `opacity:0` doit être enfermé dans
   `@supports (animation-timeline)` + `prefers-reduced-motion:no-preference`.
   Firefox ne sait pas encore animer au scroll : un `opacity:0` posé dehors y
   reste invisible pour de bon, et la page s'affiche blanche.
   ========================================================================== */

/* ── Polices ─────────────────────────────────────────────────────────────── */
/* Le corps est un GROTESQUE NEUTRE (Archivo), pas une géométrique. C'est ce qui
   sépare une boutique de mode d'un site de marque : les capitales sont étroites,
   les terminaisons horizontales, l'ensemble se lit sans se faire remarquer.
   Jost est conservé en repli pour les pages héritées qui partagent ce fichier. */
@font-face{font-family:"Archivo";font-style:normal;font-weight:300 700;font-display:swap;src:url("assets/fonts/archivo-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:"Archivo";font-style:normal;font-weight:300 700;font-display:swap;src:url("assets/fonts/archivo-latin.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:"Jost";font-style:normal;font-weight:300 700;font-display:swap;src:url("assets/fonts/jost-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:"Jost";font-style:normal;font-weight:300 700;font-display:swap;src:url("assets/fonts/jost-latin.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:"GA Mono";font-style:normal;font-weight:400 500;font-display:swap;src:url("assets/fonts/ibm-plex-mono-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:"GA Mono";font-style:normal;font-weight:400 500;font-display:swap;src:url("assets/fonts/ibm-plex-mono-latin.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;}
/* La police du LOGO good allure : Open Sans italique (variable 300-800), grasse et
   arrondie. On l'oppose au bâton du corps. C'est le contraste de la page. */
@font-face{font-family:"GA Display";font-style:italic;font-weight:300 800;font-display:swap;src:url("assets/fonts/open-sans-italic-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:"GA Display";font-style:italic;font-weight:300 800;font-display:swap;src:url("assets/fonts/open-sans-italic-latin.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;}

/* ── Jetons ──────────────────────────────────────────────────────────────── */
:root{
  --bg:#ffffff;                   /* la page, blanc */
  --paper:#ffffff;                /* la couleur qui contraste avec un élément plein */
  --tile:#efefef;                 /* les tuiles produit = fond des packshots (gris clair) */
  --raise:#f6f6f6;                /* une surface à peine soulevée */
  --ink:rgba(0,0,0,.84);          /* le noir de la DA : 84 %, pas 100 */
  --ink-full:#000000;
  --ink-60:rgba(0,0,0,.58);
  --ink-40:rgba(0,0,0,.56);
  --line:rgba(0,0,0,.12);
  --line-2:rgba(0,0,0,.20);
  --pop:#000000;                  /* l'accent est l'encre elle-même, aucune couleur */
  /* Alias de compat pour les pages pro et événements qui partagent ce socle. */
  --ink-50:rgba(0,0,0,.56);
  --ink-35:rgba(0,0,0,.42);

  --mono:"GA Mono","SFMono-Regular",Menlo,Consolas,monospace;
  --sans:"Archivo","Helvetica Neue",Helvetica,Arial,sans-serif;

  --t-xs:11px; --t-s:12px; --t-m:14px; --t-l:16px; --t-xl:20px;
  --t-disp:clamp(28px,5vw,52px);

  /* L'INTERFACE parle en capitales serrées : nav, boutons, prix, labels. */
  --ui-track:.09em;
  --ui-track-l:.14em;

  --gap:20px;
  --pad:clamp(10px,2vw,22px);
  --ease:cubic-bezier(.22,1,.36,1);
}

/* ── Remise à zéro ───────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  font-family:var(--sans);font-weight:400;font-size:var(--t-m);line-height:1.6;
  color:var(--ink);background:var(--bg);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{display:block;max-width:100%;height:auto}

/* ── La photo est en noir et blanc ───────────────────────────────────────── */
/* Décision d'Enzo du 2026-08-22, prise après l'analyse de Pyrène et de Wise :
   la maison ne montre que des photos en noir et blanc. Les photos de la banque
   sont converties dans le fichier même, ce filtre est le filet qui tient pour
   toute image ajoutée ensuite. Une seule exception, marquée `data-couleur` : le
   packshot d'une pièce, parce que la couleur d'un textile est une information
   d'achat. Cette règle vit dans `base.css`, chargé par les pages vitrine, et
   JAMAIS dans `styles.css` que charge l'atelier : là-bas, la couleur du textile
   et le logo déposé par le client sont la matière même de l'outil. */
img{filter:grayscale(1)}
img[data-couleur],.bar__logo img{filter:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul{list-style:none}
::selection{background:var(--pop);color:var(--paper)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:10px;top:10px;z-index:999;background:var(--pop);color:var(--paper);padding:10px 16px}

/* Le corps vide garde de la hauteur : sans lui, l'en-tête collant flotterait
   au-dessus d'une page de zéro pixel et le blanc n'aurait pas de surface. */
main{min-height:calc(100vh - 58px)}

/* ── En-tête ─────────────────────────────────────────────────────────────── */
/* Le seul élément conservé de l'ancien design. `app.js` lui pose `is-solid`
   faute de `.hero` sur la page : le trait est donc visible d'emblée. */
.bar{
  position:sticky;top:0;z-index:50;background:rgba(255,255,255,.72);
  backdrop-filter:saturate(140%) blur(14px);-webkit-backdrop-filter:saturate(140%) blur(14px);
  border-bottom:1px solid transparent;transition:border-color .3s,background .3s;
}
.bar.is-solid{border-bottom-color:var(--line);background:rgba(255,255,255,.92)}
.bar__in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;height:58px;padding:0 var(--pad)}
.bar__nav{display:flex;gap:22px;min-width:0}
.bar__nav a,.bar__act a,.bar__act button{
  font-size:var(--t-xs);font-weight:500;letter-spacing:var(--ui-track-l);text-transform:uppercase;color:var(--ink);
  white-space:nowrap;transition:opacity .25s;
}
.bar__nav a:hover,.bar__act a:hover{opacity:.55}
.bar__logo{justify-self:center;display:inline-flex;align-items:center;min-height:44px}
.bar__logo img{height:20px;width:auto;max-width:100%}
@media (max-width:460px){.bar__logo img{height:17px}}
.bar__act{justify-self:end;display:flex;align-items:center;gap:18px;min-width:0}
.bar__act a{display:inline-flex;align-items:center;min-height:44px}
.bar__cart{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}
.bar__count{
  position:absolute;top:7px;right:0;min-width:15px;height:15px;padding:0 4px;
  display:grid;place-items:center;border-radius:50%;background:var(--pop);color:var(--paper);
  font-size:9px;font-weight:600;line-height:1;
}
@media (max-width:820px){.bar__nav a:nth-child(n+3){display:none}}
@media (max-width:460px){.bar__nav a:nth-child(n+2){display:none}}

.progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:70;transform-origin:0 50%;transform:scaleX(0);background:var(--pop)}