/* =====================================================================
   Socle graphique — inspiré de clementhoubart.fr (docs/01-vision.md)
   Les univers (DA) ne redéfinissent que des variables --da-* (S3).
   ===================================================================== */
:root{
  --socle-fond:#05060B; --socle-fond-2:#11131D; --socle-encre:#FFF4E8; --socle-accent:#FF2A2A;
  --socle-filet:rgba(255,255,255,.13); --socle-verre:rgba(255,255,255,.06);
  --socle-halo-1:rgba(255,42,42,.22); --socle-halo-2:rgba(0,229,255,.11);
  --texte:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:dark;
}
:root,[data-univers]{
  --fond:var(--da-fond,var(--socle-fond)); --fond-2:var(--da-fond-2,var(--socle-fond-2));
  --encre:var(--da-encre,var(--socle-encre)); --accent:var(--da-accent,var(--socle-accent));
  --sur-accent:var(--da-sur-accent,#05060B);
  --filet:var(--da-filet,var(--socle-filet)); --verre:var(--da-verre,var(--socle-verre));
  --halo-1:var(--da-halo-1,var(--socle-halo-1)); --halo-2:var(--da-halo-2,var(--socle-halo-2));
  --titre:var(--da-titre,"Space Grotesk","Inter",sans-serif);
  --titre-graisse:var(--da-titre-graisse,400); --titre-casse:var(--da-titre-casse,uppercase);
  --titre-interlettrage:var(--da-titre-interlettrage,.05em);
  --rayon:var(--da-rayon,0px);
  --entree-duree:var(--da-entree-duree,.9s); --entree-distance:var(--da-entree-distance,0px); --entree-echelle:var(--da-entree-echelle,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
html,body{margin:0}
body{font-family:var(--texte);color:var(--encre);min-height:100vh;line-height:1.6;font-size:16px;
  background:var(--da-fond-image,radial-gradient(circle at 12% 5%,var(--halo-1),transparent 420px),
             radial-gradient(circle at 86% 10%,var(--halo-2),transparent 420px)),var(--fond);
  background-attachment:fixed;transition:background-color .6s,color .6s}
/* Transitions entre univers (navigateurs compatibles) : fondu croisé des pages. */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.6s}
img{max-width:100%;display:block}
a{color:inherit}
p{margin:0 0 1em}
h1,h2,h3{margin:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
::selection{background:var(--accent);color:var(--sur-accent)}
.evitement{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--accent);color:var(--sur-accent);padding:10px 14px}
.evitement:focus{left:8px}
.doux{opacity:.72}
.petit{font-size:13px}

/* ---------- Typographie ---------- */
.marque,.nav a,.entete-bouton,.pied-socle nav a,.pied-titre{font-weight:800;font-size:12px;letter-spacing:.32em;text-transform:uppercase;text-decoration:none;margin:0}
.surtitre{display:flex;align-items:center;gap:10px;font-weight:900;font-size:12px;letter-spacing:.34em;text-transform:uppercase;opacity:.68;margin:0 0 14px}
.surtitre::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent);flex:none}
.titre,.heros-titre{font-family:var(--titre);font-weight:var(--titre-graisse);text-transform:var(--titre-casse);letter-spacing:var(--titre-interlettrage);line-height:.98;margin:0 0 20px;hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:10 4 4;overflow-wrap:break-word}
.titre{font-size:clamp(34px,7vw,72px)}
.titre-2,.section-titre{font-family:var(--titre);font-weight:var(--titre-graisse);text-transform:var(--titre-casse);letter-spacing:.12em;font-size:clamp(18px,2.4vw,24px);margin:0}
.titre-2{margin:44px 0 16px}
.devise{font-weight:900;font-size:13px;letter-spacing:.34em;text-transform:uppercase;opacity:.84;margin:0 0 22px}
.lien-fleche{font-weight:800;font-size:11px;letter-spacing:.24em;text-transform:uppercase;text-decoration:none;opacity:.86}
.lien-fleche:hover{opacity:1}

/* ---------- En-tête (structure fixe) ---------- */
.entete{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:20px;padding:18px clamp(16px,3vw,32px);
  background:color-mix(in srgb,var(--fond) 72%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--filet)}
.nav{display:flex;gap:clamp(16px,2.2vw,28px);margin-left:auto;align-items:center}
.marque,.nav a,.entete-bouton{white-space:nowrap}
.nav a{opacity:.82}.nav a:hover,.nav a[aria-current]{opacity:1}
.nav a[aria-current]{box-shadow:0 2px 0 var(--accent)}
.univers-courant{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;margin:0;opacity:.85}
.univers-courant i{width:8px;height:8px;border-radius:50%;background:var(--accent)}
.entete-actions{display:flex;gap:10px;align-items:center}
.entete-bouton{background:none;border:1px solid var(--filet);color:var(--encre);padding:9px 13px;cursor:pointer;font-family:var(--texte);border-radius:var(--rayon)}
.entete-bouton:hover{border-color:color-mix(in srgb,var(--encre) 45%,transparent)}
.compteur{color:var(--accent);margin-left:4px}
.menu-bouton{display:none}

/* ---------- Boutons ---------- */
.btn{display:inline-flex;gap:14px;align-items:center;justify-content:center;padding:16px 20px;background:var(--verre);border:1px solid var(--filet);color:var(--encre);
  font:400 11px Arial,"Helvetica Neue",sans-serif;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;cursor:pointer;border-radius:var(--rayon);transition:border-color .2s,background .2s}
.btn:hover{border-color:color-mix(in srgb,var(--encre) 45%,transparent)}
.btn.plein{background:var(--accent);border-color:var(--accent);color:var(--sur-accent)}
.btn.plein:hover{filter:brightness(1.08)}
.btn.lien{background:none;border:0;padding:0;font:800 11px var(--texte);letter-spacing:.24em}
.btn.large{width:100%}
.btn[disabled]{opacity:.45;cursor:not-allowed}

/* ---------- Héros ---------- */
.heros{position:relative;min-height:min(86vh,820px);display:grid;align-content:end;padding:120px clamp(16px,3vw,32px) 72px;overflow:hidden;isolation:isolate}
.heros-fond{position:absolute;inset:0;z-index:-1;background:var(--heros-image,var(--da-heros,linear-gradient(120deg,#2a0f3d,#05060B 55%,#1b1f6b)));background-size:cover;background-position:center;opacity:.95}
.heros-fond::after{content:"";position:absolute;inset:0;opacity:calc(var(--da-voile,.6) / .6);
  background:linear-gradient(90deg,color-mix(in srgb,var(--fond) 88%,transparent) 0%,color-mix(in srgb,var(--fond) 35%,transparent) 65%),linear-gradient(to top,var(--fond),transparent 45%)}
.heros-texte{max-width:760px}
.heros-titre{font-size:clamp(40px,8.6vw,124px)}
.heros-paragraphe{max-width:54ch;opacity:.82;margin-bottom:28px}

/* ---------- Sections et grilles ---------- */
.section{padding:0 clamp(16px,3vw,32px);max-width:1440px;margin:0 auto}
.section-tete{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;margin:72px 0 26px;scroll-margin-top:90px}
.mosaique{display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}
.grille{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}

/* ---------- Cartes ---------- */
.carte-oeuvre{position:relative;border:1px solid var(--filet);border-radius:var(--rayon);overflow:hidden;background:var(--fond-2)}
.carte-lien{display:block;position:relative;aspect-ratio:4/5;color:#fff;text-decoration:none}
.carte-image{position:absolute;inset:0;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.carte-image img{width:100%;height:100%;object-fit:cover}
.carte-oeuvre:hover .carte-image{transform:scale(1.05)}
.carte-lien::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(5,6,11,.78),transparent 52%)}
.carte-texte{position:absolute;left:18px;right:18px;bottom:18px;z-index:1;display:grid;gap:6px}
.carte-titre{font-family:"Space Grotesk",sans-serif;font-weight:600;font-size:19px;letter-spacing:-.045em}
.carte-sous-titre{font-weight:800;font-size:10px;letter-spacing:.24em;text-transform:uppercase;opacity:.82}
.carte-pastille,.carte-prix{position:absolute;top:14px;z-index:1;font-weight:800;font-size:10px;letter-spacing:.14em;text-transform:uppercase;background:rgba(5,6,11,.55);backdrop-filter:blur(6px);padding:6px 10px;border-radius:999px}
.carte-pastille{right:14px}.carte-pastille::before{content:"● ";opacity:.6}
.carte-prix{left:14px;letter-spacing:.06em}
.carte{border:1px solid var(--filet);background:rgba(255,255,255,.03);padding:22px;border-radius:var(--rayon)}

/* ---------- Filtres ---------- */
.filtres{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 22px}
.filtre{font-weight:800;font-size:10px;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;padding:9px 12px;border:1px solid var(--filet);background:var(--verre);border-radius:var(--rayon)}
.filtre[aria-current]{border-color:var(--accent)}

/* ---------- Formulaires, tableaux, messages ---------- */
.champ{display:grid;gap:7px;font-size:11px;letter-spacing:.22em;text-transform:uppercase;font-weight:800}
.champ input,.champ select,.champ textarea,select.petit{font:400 15px var(--texte);letter-spacing:0;text-transform:none;color:var(--encre);background:var(--fond-2);
  border:1px solid var(--filet);padding:12px;border-radius:var(--rayon);width:100%}
select.petit{width:auto;padding:9px 10px;font-size:14px}
.formulaire{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));align-items:end}
.table{width:100%;border-collapse:collapse;font-size:14px}
.table th{font-size:11px;letter-spacing:.24em;text-transform:uppercase;text-align:left;opacity:.6;font-weight:800;padding:10px 12px;border-bottom:1px solid var(--filet)}
.table td{padding:12px;border-bottom:1px solid var(--filet);vertical-align:middle}
.etiquette{display:inline-block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:800;padding:5px 8px;border:1px solid var(--filet)}
.etiquette.actif{border-color:var(--accent)}
.alerte{border:1px solid var(--filet);border-left:3px solid var(--accent);padding:14px 16px;margin:0 0 24px}
.avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;border:1px solid var(--filet)}
.page{max-width:1180px;margin:0 auto;padding:48px clamp(16px,3vw,32px) 96px}

/* ---------- Tiroir panier (socle uniquement) ---------- */
.voile{position:fixed;inset:0;z-index:40;background:rgba(0,0,0,.55)}
.tiroir{position:fixed;top:0;right:0;z-index:50;height:100%;width:min(400px,100%);display:flex;flex-direction:column;gap:20px;padding:24px;
  background:#0B0C12;color:#FFF4E8;border-left:1px solid rgba(255,255,255,.13);--encre:#FFF4E8;--filet:rgba(255,255,255,.13);--fond-2:#11131D;--rayon:0px;text-align:left}
.tiroir[hidden],.voile[hidden]{display:none}
.tiroir-tete{display:flex;justify-content:space-between;align-items:center}
.tiroir-vide{margin:auto 0;text-align:left}
.tiroir-pied{border-top:1px solid rgba(255,255,255,.13);padding-top:18px}

/* ---------- Pied de page (structure fixe) ---------- */
.pied-socle{margin-top:96px;padding:48px clamp(16px,3vw,32px) 28px;border-top:1px solid var(--filet);display:grid;gap:32px;grid-template-columns:2fr 1fr 1fr;font-size:14px}
.pied-socle nav{display:grid;gap:10px;align-content:start}
.pied-socle nav a{font-weight:600;letter-spacing:.12em;font-size:11px;opacity:.75}
.pied-socle nav a:hover{opacity:1}
.pied-titre{opacity:.5;margin-bottom:4px}
.pied-bas{grid-column:1/-1;border-top:1px solid var(--filet);padding-top:20px;margin:0;font-size:12px}

/* ---------- Univers : couches de matière ---------- */
.couche-texture,.couche-grain{position:fixed;inset:0;pointer-events:none;z-index:-2}
.couche-texture{background:var(--da-texture,none) center/cover no-repeat;opacity:var(--da-texture-opacite,0);filter:blur(var(--da-texture-flou,0px));transform:scale(1.1)}
.couche-grain{z-index:60;opacity:var(--da-grain,0);mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- Univers : compositions (choisies par la DA, structure inchangée) ---------- */
[data-heros="plein_cadre_centre"] .heros{align-content:center;text-align:center}
[data-heros="plein_cadre_centre"] .heros-texte{margin:0 auto}
[data-heros="plein_cadre_centre"] .heros .surtitre{justify-content:center}
[data-heros="plein_cadre_centre"] .heros-paragraphe{margin-left:auto;margin-right:auto}
[data-heros="titre_geant"] .heros{align-content:end}
[data-heros="titre_geant"] .heros-texte{max-width:none}
[data-heros="titre_geant"] .heros-titre{font-size:clamp(48px,10.5vw,200px);line-height:.9}
[data-heros="titre_geant"] .heros-fond{inset:12% 0 18% 38%;opacity:.85}
[data-grille="grille_4"] .mosaique{grid-template-columns:repeat(4,1fr)}
[data-grille="editoriale"] .mosaique>:first-child{grid-column:span 2;grid-row:span 2}
[data-grille="editoriale"] .mosaique>:first-child .carte-lien{aspect-ratio:auto;height:100%;min-height:420px}
[data-survol="aucun"] .carte-oeuvre:hover .carte-image{transform:none}
[data-survol="voile_couleur"] .carte-oeuvre:hover .carte-image{transform:none}
[data-survol="voile_couleur"] .carte-lien::before{content:"";position:absolute;inset:0;z-index:1;background:var(--accent);mix-blend-mode:color;opacity:0;transition:opacity .5s}
[data-survol="voile_couleur"] .carte-oeuvre:hover .carte-lien::before{opacity:.55}

/* ---------- Univers : mouvement d'entrée ---------- */
@keyframes apparition{from{opacity:0;transform:translateY(var(--entree-distance)) scale(var(--entree-echelle))}to{opacity:1;transform:none}}
.heros-texte>*{animation:apparition var(--entree-duree) cubic-bezier(.2,.7,.2,1) both}
.heros-texte>:nth-child(2){animation-delay:.08s}.heros-texte>:nth-child(3){animation-delay:.16s}.heros-texte>:nth-child(n+4){animation-delay:.24s}
@supports (animation-timeline:view()){
  .mosaique>*{animation:apparition linear both;animation-timeline:view();animation-range:entry 0% entry 35%}
}

/* ---------- Son d'ambiance (coupé par défaut) ---------- */
.bouton-son[aria-pressed="true"]{border-color:var(--accent)}
.bouton-son[aria-pressed="true"]::before{content:"● ";color:var(--accent)}
.bandeau-apercu{position:relative;z-index:70;background:#FFC24A;color:#05060B;font:800 11px var(--texte);letter-spacing:.2em;text-transform:uppercase;text-align:center;padding:6px}

/* ---------- Mobile ---------- */
@media (max-width:860px){
  .mosaique,[data-grille="grille_4"] .mosaique{grid-template-columns:repeat(2,1fr)}
  .pied-socle{grid-template-columns:1fr 1fr}.pied-socle>div:first-child{grid-column:1/-1}
}
@media (max-width:1040px){
  .entete-admin .menu-bouton{display:inline-block}
  .entete-admin .nav{display:none;order:5;width:100%;flex-direction:column;align-items:flex-start;gap:18px;padding:14px 0 6px;margin:0}
  .entete-admin .nav.ouverte{display:flex}
  .entete-admin{flex-wrap:wrap}
  .entete-actions{margin-left:auto}
}
@media (max-width:720px){
  .entete{flex-wrap:wrap;gap:12px}
  .entete-actions{margin-left:auto}
  .menu-bouton{display:inline-block}
  .nav{display:none;order:5;width:100%;flex-direction:column;align-items:flex-start;gap:18px;padding:14px 0 6px;margin:0}
  .nav.ouverte{display:flex}
  .univers-courant{order:4;width:100%}
  .mosaique,[data-grille="grille_4"] .mosaique{grid-template-columns:1fr}
  [data-grille="editoriale"] .mosaique>:first-child{grid-column:auto;grid-row:auto}
  .heros{padding-top:80px;min-height:78vh}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* ---------- Back-office : catalogue ---------- */
.barre-titre{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:flex-end;margin-bottom:28px}
.barre-titre .titre{margin:0}
.vignette{position:relative;display:block;aspect-ratio:1;overflow:hidden;border:1px solid var(--filet)}
.vignette img{width:100%;height:100%;object-fit:cover}
.vignette-etat{position:absolute;inset:auto 8px 8px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:800;opacity:.8}
.grille-oeuvres{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.oeuvre-tuile{display:grid;gap:8px;text-decoration:none;font-size:13px}
.oeuvre-tuile strong{font-weight:600;line-height:1.3}
.choix-oeuvre{position:relative;cursor:pointer}
.choix-oeuvre input{position:absolute;top:8px;left:8px;z-index:1;width:18px;height:18px;accent-color:var(--accent)}
.choix-oeuvre:has(input:checked) .vignette{outline:2px solid var(--accent);outline-offset:-2px}
.collection-carte{display:grid;grid-template-columns:120px 1fr;gap:18px;align-items:center;text-decoration:none}
.collection-carte .vignettes{display:grid;grid-template-columns:1fr 1fr;gap:3px}
.liste-cartes{display:grid;gap:12px}
.statut-publiee{border-color:#3FD18B;color:#3FD18B}
.statut-programmee{border-color:#FFC24A;color:#FFC24A}
.statut-archivee{opacity:.55}
.affiche{border-color:var(--accent);color:var(--accent)}
.colonnes{display:grid;gap:24px;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);align-items:start}
.pile{display:grid;gap:16px}
.champ textarea{min-height:120px;resize:vertical;line-height:1.5}
.champ small{font-weight:400;letter-spacing:0;text-transform:none;opacity:.6;font-size:12px}
.actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.danger{color:#FF7A7A}
.btn.danger{border-color:rgba(255,122,122,.4)}
.mesure{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--filet);font-size:14px}
.mesure:last-child{border:0}
.ok{color:#3FD18B}.moyen{color:#FFC24A}.faible{color:#FF7A7A}
.depot{border:1px dashed color-mix(in srgb,var(--encre) 35%,transparent);padding:22px;display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.pastille-couleur{display:inline-block;width:14px;height:14px;border-radius:50%;border:1px solid var(--filet);vertical-align:-2px;margin-right:4px}
@media (max-width:860px){.colonnes{grid-template-columns:1fr}.collection-carte{grid-template-columns:84px 1fr}}
.table td.nombre{white-space:nowrap;text-align:right}

/* ---------- Back-office : éditeur d'univers ---------- */
.editeur{display:grid;grid-template-columns:minmax(300px,380px) minmax(0,1fr);gap:20px;align-items:start}
.editeur-reglages{position:sticky;top:84px;max-height:calc(100vh - 100px);overflow:auto;padding-right:4px}
.groupe{border:1px solid var(--filet);margin:0;display:grid;gap:12px;min-width:0;min-inline-size:0}
.groupe legend{float:left;width:100%;display:flex;align-items:center;margin:0;padding:0}
.groupe legend .heriter{margin-left:auto}
.groupe[data-groupe]:has([data-heriter]:not(:checked))>:not(legend){opacity:.4;pointer-events:none}
.heriter{font-size:10px;letter-spacing:.14em;display:flex;gap:6px;align-items:center;opacity:1}
.couleurs{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.champ input[type=color]{height:42px;padding:4px;cursor:pointer}
.champ input[type=range]{padding:0;accent-color:var(--accent);background:none;border:0}
.halo{display:grid;grid-template-columns:auto 42px repeat(3,minmax(0,1fr));gap:8px;align-items:center}
.halo input[type=range],.champ input[type=range]{width:100%;min-width:0}
.halo input[type=color]{width:42px;height:30px;padding:2px;border:1px solid var(--filet);background:none}
.mini{display:grid;font-size:10px;opacity:.7;text-transform:uppercase;letter-spacing:.1em}
.mini input{accent-color:var(--accent)}
.cadre-apercu{margin-top:12px;border:1px solid var(--filet);background:#000;display:flex;justify-content:center;height:min(78vh,900px)}
.cadre-apercu iframe{width:100%;height:100%;border:0;background:#05060B;transition:width .3s}
.controles{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:14px}
.controles li{display:grid;gap:2px;padding-left:14px;border-left:3px solid var(--filet)}
.controles span{opacity:.72;font-size:13px}
.controle-ok{border-color:#3FD18B!important}.controle-attention{border-color:#FFC24A!important}.controle-bloquant{border-color:#FF7A7A!important}
@media (max-width:1100px){.editeur{grid-template-columns:1fr}.editeur-reglages{position:static;max-height:none}}

/* ---------- Back-office : assistant IA ---------- */
.propositions{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));align-items:start}
.proposition.retenue{border-color:#3FD18B}
.mini-apercu{position:relative;aspect-ratio:4/3;overflow:hidden;border:1px solid var(--filet);background:#000}
.mini-apercu iframe{position:absolute;top:0;left:0;width:400%;height:400%;border:0;transform:scale(.25);transform-origin:0 0;pointer-events:none}
.retouche{display:flex;gap:10px;flex-wrap:wrap;align-items:end}
.retouche .champ{flex:1;min-width:220px}

/* ---------- Back-office : produits ---------- */
.grille-produits{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.produit-tuile{display:grid;gap:8px;text-decoration:none;padding:12px}
.placement svg{width:100%;height:auto;display:block;border:1px solid var(--filet)}
.petit-champ{width:96px;font:400 14px var(--texte);color:var(--encre);background:var(--fond-2);border:1px solid var(--filet);padding:8px}

/* ---------- Boutique : transitions ---------- */
.heros-fond,.galerie-principale{view-transition-name:visuel}
::view-transition-group(visuel){animation-duration:.55s;animation-timing-function:cubic-bezier(.2,.7,.2,1)}

/* ---------- Boutique : page produit ---------- */
.fiche-produit{padding-top:28px}
.fil{font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:800;opacity:.7;margin-bottom:22px}
.fil a{text-decoration:none}
.produit{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
.galerie{position:sticky;top:90px;display:grid;gap:12px}
.galerie-principale{width:100%;height:auto;border:1px solid var(--filet);border-radius:var(--rayon);background:var(--fond-2)}
.galerie-vignettes{display:flex;gap:8px;flex-wrap:wrap}
.galerie-vignettes button{padding:0;border:1px solid var(--filet);background:none;cursor:pointer;width:72px;border-radius:var(--rayon);overflow:hidden}
.achat{display:grid;gap:18px;align-content:start}
.produit-titre{font-size:clamp(30px,4.4vw,56px);margin:0}
.prix{font-size:22px;font-weight:600;margin:0}
.choix{border:0;padding:0;margin:0;display:grid;gap:10px}
.choix legend{padding:0;margin-bottom:10px}
.pastille-choix{width:34px;height:34px;border-radius:50%;background:var(--c);border:1px solid var(--filet);cursor:pointer;outline-offset:3px}
.pastille-choix[aria-pressed="true"]{outline:2px solid var(--accent)}
.filtre[aria-pressed="true"]{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 18%,transparent)}
.filtre:disabled{opacity:.3;text-decoration:line-through;cursor:not-allowed}
button.filtre{color:var(--encre);cursor:pointer;font-family:var(--texte)}
.info{border-top:1px solid var(--filet);padding:14px 0}
.info summary{cursor:pointer;font-weight:800;font-size:12px;letter-spacing:.24em;text-transform:uppercase}
.info p{margin:10px 0 0;opacity:.85}
.oeuvre-info{display:flex;gap:14px;align-items:center;margin-top:12px}
.oeuvre-info img{width:84px;height:84px;object-fit:cover;border:1px solid var(--filet)}
.texte-produit{opacity:.88}
@media (max-width:860px){.produit{grid-template-columns:1fr}.galerie{position:static}}

/* ---------- Boutique : catalogue et recherche ---------- */
.filtres-boutique{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin:8px 0 18px}
.recherche{width:min(680px,calc(100% - 32px));max-height:80vh;margin:10vh auto auto;padding:0;border:1px solid rgba(255,255,255,.13);background:#0B0C12;color:#FFF4E8;--encre:#FFF4E8;--filet:rgba(255,255,255,.13);--fond-2:#11131D}
.recherche::backdrop{background:rgba(0,0,0,.6);backdrop-filter:blur(4px)}
.recherche-tete{display:flex;gap:12px;padding:16px;border-bottom:1px solid rgba(255,255,255,.13)}
.recherche-tete input{flex:1;font:400 18px var(--texte);background:none;border:0;color:inherit;outline:none}
.recherche-resultats{padding:8px 16px 18px;display:grid;gap:8px;overflow:auto;max-height:60vh}
.recherche-resultats .surtitre{margin:12px 0 2px}
.resultat-produit{display:flex;gap:12px;align-items:center;text-decoration:none;padding:6px;border-left:2px solid var(--accent)}
.resultat-produit img{width:52px;height:52px;object-fit:cover;background:#11131D}
.resultat-produit span{display:grid}
.resultat-collection{display:flex;gap:10px;align-items:center;text-decoration:none}
.resultat-collection i{width:10px;height:10px;border-radius:50%}

/* ---------- Panier et commande ---------- */
.tiroir{overflow:auto}
.tiroir-contenu{display:flex;flex-direction:column;flex:1;gap:16px}
.tiroir-pied{margin-top:auto}
.panier-lignes{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.panier-ligne{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:start;font-size:14px}
.panier-ligne img,.panier-visuel{width:64px;height:64px;object-fit:cover;background:#11131D;border:1px solid rgba(255,255,255,.13)}
.panier-ligne div{display:grid;gap:4px}
.panier-ligne a{text-decoration:none}
.panier-ligne.indisponible{opacity:.5}
.panier-prix{display:grid;justify-items:end;gap:6px;white-space:nowrap}
.quantite{display:inline-flex;align-items:center;gap:10px}
.quantite button{width:28px;height:28px;border:1px solid rgba(255,255,255,.2);background:none;color:inherit;cursor:pointer}
.alerte-panier{border-left:3px solid #FFC24A;padding-left:10px;margin:0}
.commande-grille{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,1fr);gap:24px;align-items:start}
.recap{position:sticky;top:90px;display:grid;gap:10px}
.recap-ligne{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;font-size:14px}
.recap-ligne img{width:56px;height:56px;object-fit:cover;border:1px solid var(--filet)}
.mesure.total{font-weight:700;font-size:17px}
.case{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.5}
.case input{margin-top:4px;accent-color:var(--accent)}
@media (max-width:860px){.commande-grille{grid-template-columns:1fr}.recap{position:static;order:-1}}

/* ---------- Pages légales ---------- */
.texte-legal{max-width:72ch;line-height:1.7}
.texte-legal h2{font-family:var(--titre);font-weight:400;text-transform:uppercase;letter-spacing:.1em;font-size:18px;margin:36px 0 10px}
.texte-legal ul{padding-left:20px}
.comparaison{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.comparaison figure{margin:0}
@media (max-width:900px){.comparaison{grid-template-columns:1fr}}
.code-promo{display:flex;gap:10px;align-items:center;margin:4px 0}
.code-promo input{flex:1;font:400 14px var(--texte);color:#FFF4E8;background:#11131D;border:1px solid rgba(255,255,255,.13);padding:9px;text-transform:uppercase}
.bouton-envie{font-size:18px;padding:12px 16px}
.bouton-envie[aria-pressed="true"]{color:var(--accent);border-color:var(--accent)}
.histogramme svg{width:100%;height:auto;display:block;overflow:visible}
.histogramme .grille-ligne{stroke:var(--filet);stroke-width:1}
.histogramme .axe{fill:var(--encre);opacity:.6;font:400 11px var(--texte)}
.histogramme .barre path{fill:var(--accent)}
.histogramme .barre:hover path{fill:color-mix(in srgb,var(--accent) 70%,var(--encre))}
.tuiles{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.tuile{display:grid;gap:4px;text-decoration:none}
.tuile .chiffre{font-family:var(--titre);font-size:30px;letter-spacing:.02em}
.tuile.alerte-tuile{border-color:#FFC24A}
.entete-admin .nav{flex-wrap:wrap;justify-content:flex-end;row-gap:10px}
.pied-bas .langues{float:right;display:inline-flex;gap:10px}
.pied-bas .langues a{letter-spacing:.12em;text-decoration:none;opacity:.6}
.pied-bas .langues a[aria-current]{opacity:1;text-decoration:underline;text-underline-offset:4px}