/* ──────────────────────────────────────────────────────────────────────
   Module « Catalogue 2026 » de la landing page.
   Données : /catalogue/catalogue-2026.json, généré depuis le fichier maître
   (Produits\00-MAITRE PRODUITS\_outil catalogue\gen_catalogue_web.py).
   Charte RCA : vert #006637, vif #37AE4A, lime #E0F12E, papier #F6F4EC.
   ────────────────────────────────────────────────────────────────────── */
.catalogue{
  --cat-lime:#E0F12E;--cat-papier:#F6F4EC;--cat-nuit:#00381e;--cat-vert:#006637;--cat-vif:#37AE4A;
  grid-column:span 12;position:relative;overflow:hidden;
  /* Le module déborde un peu de la colonne de 940 px sur grand écran. */
  width:min(1200px,calc(100vw - 48px));margin-left:calc(50% - min(600px,calc(50vw - 24px)));
  margin-top:10px;border-radius:34px;color:#fff;
  background:
    radial-gradient(900px 420px at 85% -10%,rgba(55,174,74,.45),transparent 60%),
    radial-gradient(700px 500px at -5% 110%,rgba(224,241,46,.10),transparent 60%),
    linear-gradient(160deg,#00532d 0%,var(--cat-nuit) 70%);
  box-shadow:0 30px 80px rgba(0,56,30,.28);
  padding:38px 38px 0;scroll-margin-top:12px;isolation:isolate
}
/* Bandes de champs (reprises du logo et des couvertures du catalogue) */
.catalogue::after{
  content:"";position:absolute;left:-10%;right:-10%;bottom:-1px;height:90px;z-index:-1;pointer-events:none;
  background:
    radial-gradient(120% 90px at 50% 100%,#0B7A3E 60%,transparent 61%),
    radial-gradient(130% 120px at 50% 120%,#009447 60%,transparent 61%);
  opacity:.55
}
.catalogue *{box-sizing:border-box}
.catalogue button{font:inherit;color:inherit;cursor:pointer}
.catalogue :focus-visible{outline:3px solid var(--cat-lime);outline-offset:3px;border-radius:10px}

/* ── En-tête ── */
.cat-entete{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.cat-entete .kicker{color:var(--cat-lime);opacity:1}
.cat-entete h2{margin:10px 0 10px;font-size:clamp(30px,5.4vw,54px);line-height:1;letter-spacing:-.035em;max-width:720px}
.cat-entete h2 span{color:var(--cat-lime)}
.cat-entete p{margin:0;max-width:600px;color:rgba(255,255,255,.82);font-size:17px;line-height:1.5}
.cat-compteurs{display:flex;gap:10px;flex-wrap:wrap}
.cat-compteur{min-width:92px;padding:12px 14px;border-radius:18px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(6px)}
.cat-compteur b{display:block;font-size:28px;letter-spacing:-.03em;color:var(--cat-lime);line-height:1}
.cat-compteur small{font-size:12px;font-weight:700;color:rgba(255,255,255,.75)}

/* ── Barre d'outils ── */
.cat-barre{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:26px 0 18px}
.cat-vues{display:inline-flex;padding:4px;border-radius:999px;background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.12)}
.cat-vues button{border:0;background:transparent;padding:10px 18px;border-radius:999px;font-weight:800;font-size:14px;min-height:42px;display:inline-flex;align-items:center;gap:8px;color:rgba(255,255,255,.8)}
.cat-vues button[aria-selected="true"]{background:var(--cat-lime);color:var(--cat-nuit)}
.cat-sections{display:flex;gap:8px;flex-wrap:wrap;flex:1}
.cat-sections button{
  border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);border-radius:999px;padding:8px 14px;min-height:40px;
  font-weight:700;font-size:13px;color:rgba(255,255,255,.88);display:inline-flex;gap:7px;align-items:center;transition:.18s
}
.cat-sections button i{font-style:normal;color:var(--cat-lime);font-weight:900}
.cat-sections button:hover{background:rgba(255,255,255,.12)}
.cat-sections button[aria-pressed="true"]{background:#fff;color:var(--cat-vert);border-color:#fff}
.cat-sections button[aria-pressed="true"] i{color:var(--cat-vert)}
.cat-pdf{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:14px;color:#fff;padding:10px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.22);min-height:42px}
.cat-pdf:hover{background:rgba(255,255,255,.1)}
.cat-pdf svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ── Vue « Feuilleter » ── */
.cat-livre-zone{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px;align-items:start}
.cat-scene{position:relative;perspective:2600px;padding:0 6px}
.cat-incline{transition:transform .5s cubic-bezier(.2,.7,.2,1);transform-style:preserve-3d}
.cat-livre{
  position:relative;display:grid;grid-template-columns:1fr 1fr;aspect-ratio:1.545;width:100%;
  border-radius:6px;filter:drop-shadow(0 30px 40px rgba(0,0,0,.45));touch-action:pan-y;user-select:none
}
.cat-livre.simple{grid-template-columns:1fr;aspect-ratio:.7727;max-width:560px;margin:auto}
.cat-page{position:relative;background:var(--cat-papier);overflow:hidden;cursor:zoom-in}
.cat-page img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.cat-page.vide{background:transparent;cursor:default}
.cat-livre:not(.simple) .cat-page.gauche{border-radius:6px 0 0 6px}
.cat-livre:not(.simple) .cat-page.droite{border-radius:0 6px 6px 0}
/* Pli central : ombre de reliure */
.cat-livre:not(.simple) .cat-page.gauche::after,.cat-livre:not(.simple) .cat-page.droite::after{content:"";position:absolute;top:0;bottom:0;width:60px;pointer-events:none}
.cat-livre:not(.simple) .cat-page.gauche::after{right:0;background:linear-gradient(90deg,transparent,rgba(0,0,0,.16))}
.cat-livre:not(.simple) .cat-page.droite::after{left:0;background:linear-gradient(270deg,transparent,rgba(0,0,0,.2))}
.cat-page .cat-num{position:absolute;bottom:10px;padding:3px 8px;border-radius:999px;background:rgba(0,56,30,.78);color:#fff;font-size:11px;font-weight:800;opacity:0;transition:.2s}
.cat-page.gauche .cat-num{left:10px}.cat-page.droite .cat-num,.cat-livre.simple .cat-num{right:10px}
.cat-livre:hover .cat-num{opacity:1}

/* Feuille qui tourne */
.cat-feuille{position:absolute;top:0;height:100%;width:50%;transform-style:preserve-3d;z-index:5;pointer-events:none;
  transition:transform .85s cubic-bezier(.45,.05,.2,1),opacity .85s ease}
.cat-livre.simple .cat-feuille{width:100%}
.cat-feuille .face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:var(--cat-papier);overflow:hidden}
.cat-feuille .face img{width:100%;height:100%;object-fit:cover;display:block}
.cat-feuille .face::after{content:"";position:absolute;inset:0;pointer-events:none;transition:opacity .85s;opacity:0}
.cat-feuille .face.dos{transform:rotateY(180deg)}
.cat-feuille.avant{left:50%;transform-origin:left center}
.cat-feuille.arriere{left:0;transform-origin:right center}
.cat-livre.simple .cat-feuille.avant,.cat-livre.simple .cat-feuille.arriere{left:0;transform-origin:left center}
.cat-feuille.avant .face.recto::after{background:linear-gradient(90deg,rgba(0,0,0,.35),transparent 70%)}
.cat-feuille.arriere .face.recto::after{background:linear-gradient(270deg,rgba(0,0,0,.35),transparent 70%)}
.cat-feuille.tourne .face::after{opacity:1}

.cat-fleche{
  position:absolute;top:50%;z-index:6;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;
  border:0;background:var(--cat-lime);color:var(--cat-nuit);display:grid;place-items:center;
  box-shadow:0 10px 26px rgba(0,0,0,.35);transition:transform .2s,opacity .2s
}
.cat-fleche:hover{transform:translateY(-50%) scale(1.07)}
.cat-fleche:disabled{opacity:0;pointer-events:none}
.cat-fleche.prec{left:-18px}.cat-fleche.suiv{right:-18px}
.cat-fleche svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.cat-indice{margin:14px 0 0;text-align:center;font-size:13px;color:rgba(255,255,255,.7)}
.cat-indice b{color:#fff}

/* « Sur ces pages » */
.cat-ici{background:rgba(255,255,255,.96);color:var(--ink,#18211c);border-radius:22px;padding:16px;box-shadow:0 18px 40px rgba(0,0,0,.2);max-height:min(640px,80vh);overflow:auto}
.cat-ici h3{margin:2px 4px 2px;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--cat-vert)}
.cat-ici .cat-ici-titre{margin:0 4px 12px;font-size:15px;font-weight:800;color:#2f3133;line-height:1.3}
.cat-ici-liste{display:flex;flex-direction:column;gap:8px}
.cat-mini{
  display:grid;grid-template-columns:64px 1fr;gap:10px;align-items:center;text-align:left;width:100%;
  padding:8px;border-radius:14px;border:1px solid rgba(0,102,55,.12);background:#fff;transition:.18s;color:inherit
}
.catalogue .cat-mini{color:#18211c}
.cat-mini:hover{border-color:var(--cat-vif);transform:translateX(3px);box-shadow:0 8px 20px rgba(0,102,55,.12)}
.cat-mini .ph{width:64px;height:64px;border-radius:10px;background:radial-gradient(circle at 50% 40%,#fff,#eaf3ec);display:grid;place-items:center;overflow:hidden}
.cat-mini .ph img{max-width:92%;max-height:92%;object-fit:contain;mix-blend-mode:multiply}
.cat-mini small{display:block;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--cat-vert)}
.cat-mini b{display:block;font-size:13.5px;line-height:1.25;margin-top:2px}
.cat-mini code{font:600 11px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#5f6b64}
.cat-ici-vide{padding:6px 4px 10px;color:#5f6b64;font-size:14px;line-height:1.5}
.cat-ici-vide button{margin-top:10px;border:0;background:var(--cat-vert);color:#fff;font-weight:800;border-radius:999px;padding:10px 16px;min-height:44px}
.cat-ici-appel{display:flex;align-items:center;gap:10px;margin-top:12px;padding:12px;border-radius:14px;background:#eef7ea;color:var(--cat-vert);font-weight:800;font-size:14px}
.cat-ici-appel span{display:block;font-size:12px;font-weight:600;color:#5f6b64}
.cat-ici-appel svg{flex:none;width:34px;height:34px;padding:8px;border-radius:50%;background:var(--cat-vert);color:#fff;stroke:currentColor;fill:none;stroke-width:2}

/* Pellicule */
.cat-pellicule{grid-column:1/-1;display:flex;gap:16px;overflow-x:auto;padding:18px 4px 30px;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.3) transparent}
.cat-groupe{flex:none;scroll-snap-align:start}
.cat-groupe > span{display:block;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.65);margin:0 0 7px 2px;white-space:nowrap}
.cat-groupe > span i{font-style:normal;color:var(--cat-lime)}
.cat-groupe > div{display:flex;gap:6px}
.cat-vignette{position:relative;width:62px;aspect-ratio:.7727;border-radius:5px;overflow:hidden;border:2px solid transparent;padding:0;background:#ddd;opacity:.6;transition:.18s}
.cat-vignette img{width:100%;height:100%;object-fit:cover;display:block}
.cat-vignette:hover{opacity:1;transform:translateY(-3px)}
.cat-vignette[aria-current="true"]{opacity:1;border-color:var(--cat-lime);transform:translateY(-4px)}
.cat-vignette b{position:absolute;left:3px;bottom:3px;font-size:9.5px;background:rgba(0,56,30,.85);color:#fff;border-radius:5px;padding:1px 4px}

/* ── Vue « Tous les produits » ── */
.cat-recherche{position:relative;max-width:460px;margin-bottom:16px}
.cat-recherche input{
  width:100%;min-height:50px;border-radius:16px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);
  color:#fff;font:inherit;font-size:16px;padding:12px 16px 12px 46px
}
.cat-recherche input::placeholder{color:rgba(255,255,255,.6)}
.cat-recherche input:focus{outline:none;border-color:var(--cat-lime);background:rgba(255,255,255,.12)}
.cat-recherche svg{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:20px;height:20px;stroke:rgba(255,255,255,.7);fill:none;stroke-width:2}
.cat-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;padding-bottom:40px}
.cat-carte{
  position:relative;display:flex;flex-direction:column;text-align:left;border:0;padding:0;border-radius:22px;overflow:hidden;
  background:#fff;color:#18211c;box-shadow:0 14px 34px rgba(0,0,0,.22);transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s
}
.catalogue .cat-carte{color:#18211c}
.cat-carte:hover{transform:translateY(-6px);box-shadow:0 26px 50px rgba(0,0,0,.32)}
.cat-carte .ph{position:relative;aspect-ratio:4/3;background:radial-gradient(circle at 50% 42%,#fff 0%,#eef5ee 70%,#e2eee3 100%);display:grid;place-items:center;overflow:hidden}
.cat-carte .ph img{max-width:84%;max-height:84%;object-fit:contain;mix-blend-mode:multiply;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.cat-carte:hover .ph img{transform:scale(1.08) translateY(-3px)}
.cat-carte .pastille{position:absolute;top:10px;left:10px;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;background:var(--cat-vert);color:#fff;padding:5px 9px;border-radius:999px;max-width:calc(100% - 20px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cat-carte .p{position:absolute;top:10px;right:10px;font-size:10.5px;font-weight:800;color:var(--cat-vert);background:rgba(255,255,255,.9);border:1px solid rgba(0,102,55,.15);padding:4px 8px;border-radius:999px}
.cat-carte .corps{padding:14px 14px 16px;display:flex;flex-direction:column;gap:8px;flex:1}
.cat-carte b{font-size:15px;line-height:1.25;letter-spacing:-.01em;color:#0f2a1b}
.cat-carte .bas{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto}
.cat-vedette{display:inline-flex;align-items:center;padding:5px 10px;border-radius:10px;background:var(--cat-vert);color:var(--cat-lime);font-weight:900;font-size:14px;letter-spacing:-.01em;box-shadow:0 0 0 2px rgba(55,174,74,.45);white-space:nowrap}
.cat-carte code{font:600 10.5px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#5f6b64;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cat-aucun{grid-column:1/-1;padding:30px;text-align:center;color:rgba(255,255,255,.8)}

/* ── Fiche produit (dialogue) ── */
.cat-fiche{
  width:min(980px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:0;border:0;border-radius:28px;overflow:hidden;
  background:#fff;color:#18211c;box-shadow:0 40px 120px rgba(0,0,0,.5)
}
.cat-fiche::backdrop{background:rgba(0,30,16,.62);backdrop-filter:blur(6px)}
.cat-fiche[open]{animation:cat-entree .35s cubic-bezier(.2,.7,.2,1)}
@keyframes cat-entree{from{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:none}}
.cat-fiche-grille{display:grid;grid-template-columns:1.05fr 1fr;max-height:calc(100dvh - 24px)}
.cat-fiche-photo{position:relative;background:radial-gradient(circle at 50% 40%,#fff 0%,#eef5ee 60%,#dcebdd 100%);display:flex;flex-direction:column;justify-content:center;align-items:center;padding:40px 30px 24px;min-height:420px}
.cat-fiche-photo > img{max-width:100%;max-height:360px;object-fit:contain;mix-blend-mode:multiply;animation:cat-flotte 6s ease-in-out infinite}
@keyframes cat-flotte{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.cat-fiche-page{display:flex;align-items:center;gap:10px;margin-top:22px;border:1px solid rgba(0,102,55,.18);background:#fff;border-radius:14px;padding:6px 12px 6px 6px;font-weight:800;font-size:13px;color:var(--cat-vert)}
.cat-fiche-page img{width:34px;height:44px;object-fit:cover;border-radius:4px;box-shadow:0 2px 6px rgba(0,0,0,.18)}
.cat-fiche-page:hover{border-color:var(--cat-vif)}
.cat-fiche-texte{padding:34px 32px 28px;overflow:auto;display:flex;flex-direction:column}
.cat-fiche-fermer{position:absolute;top:14px;right:14px;z-index:2;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.92);box-shadow:0 4px 14px rgba(0,0,0,.15);font-size:18px;color:#18211c}
.cat-fiche .pastille{align-self:flex-start;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;background:var(--cat-vert);color:#fff;padding:6px 10px;border-radius:999px}
.cat-fiche h3{margin:12px 0 6px;font-size:clamp(24px,3.4vw,32px);line-height:1.08;letter-spacing:-.025em;color:#0f2a1b}
.cat-fiche .sku{font:600 13px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#5f6b64}
.cat-fiche .cat-vedette{align-self:flex-start;margin:16px 0 6px;font-size:24px;padding:8px 14px;border-radius:14px}
.cat-fiche dl{display:grid;grid-template-columns:auto 1fr;gap:9px 18px;margin:14px 0 20px;font-size:14.5px}
.cat-fiche dt{color:#5f6b64}
.cat-fiche dd{margin:0;font-weight:700;color:#18211c}
.cat-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:auto}
.cat-actions a,.cat-actions button{
  display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px;border-radius:15px;font-weight:800;font-size:15px;
  border:1px solid rgba(0,102,55,.2);background:#fff;color:var(--cat-vert);padding:0 14px;text-align:center
}
.cat-actions svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.cat-actions .principal{grid-column:1/-1;background:var(--cat-vert);color:#fff;border-color:var(--cat-vert);min-height:56px;font-size:16px;box-shadow:0 10px 24px rgba(0,102,55,.3)}
.cat-actions .principal small{font-weight:700;opacity:.85}
.cat-actions .agripro{grid-column:1/-1;background:var(--cat-lime);color:var(--cat-nuit);border-color:var(--cat-lime)}
.cat-actions a:hover,.cat-actions button:hover{filter:brightness(1.04);border-color:var(--cat-vif)}
.cat-note{margin:12px 0 0;font-size:12.5px;color:#5f6b64;line-height:1.45}
.cat-copie{position:fixed;left:50%;bottom:100px;transform:translateX(-50%);background:#0f2a1b;color:#fff;padding:10px 16px;border-radius:999px;font-weight:700;font-size:14px;z-index:80;opacity:0;transition:opacity .2s;pointer-events:none}
.cat-copie.vu{opacity:1}

/* ── Loupe (page en grand) ── */
.cat-loupe{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgba(0,20,10,.94)}
.cat-loupe::backdrop{background:rgba(0,20,10,.9)}
.cat-loupe-defile{width:100%;height:100%;overflow:auto;display:grid;place-items:start center;padding:60px 12px 30px}
.cat-loupe img{width:min(1020px,100%);height:auto;border-radius:6px;box-shadow:0 30px 80px rgba(0,0,0,.6);cursor:zoom-out}
.cat-loupe .cat-fiche-fermer{position:fixed}
.cat-loupe-nav{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);display:flex;gap:8px}
.cat-loupe-nav button{min-width:48px;min-height:48px;border-radius:999px;border:0;background:var(--cat-lime);color:var(--cat-nuit);font-weight:900;padding:0 16px}

/* ── Accès depuis le bandeau ── */
.pill.lime{background:#E0F12E;color:#00381e}

@media(max-width:980px){
  .cat-livre-zone{grid-template-columns:1fr}
  .cat-ici{max-height:none}
}
@media(max-width:720px){
  .catalogue{border-radius:26px;padding:26px 16px 0;width:calc(100vw - 16px);margin-left:calc(50% - 50vw + 8px)}
  .cat-entete h2{font-size:32px}
  .cat-entete p{font-size:16px}
  .cat-compteurs{width:100%}
  .cat-compteur{flex:1;min-width:0}
  .cat-barre{gap:10px}
  .cat-vues{width:100%}.cat-vues button{flex:1;justify-content:center}
  .cat-sections{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
  .cat-sections button{flex:none}
  .cat-fleche{width:44px;height:44px}
  .cat-fleche.prec{left:-6px}.cat-fleche.suiv{right:-6px}
  .cat-grille{grid-template-columns:1fr 1fr;gap:10px}
  .cat-carte .corps{padding:10px 10px 12px}
  .cat-carte b{font-size:13.5px}
  .cat-vedette{font-size:12.5px;padding:4px 8px}
  .cat-carte code{display:none}
  .cat-fiche{width:100vw;max-width:100vw;max-height:94dvh;margin:auto 0 0;border-radius:26px 26px 0 0}
  .cat-fiche[open]{animation:cat-monte .35s cubic-bezier(.2,.7,.2,1)}
  @keyframes cat-monte{from{transform:translateY(40%)}to{transform:none}}
  .cat-fiche-grille{grid-template-columns:1fr;max-height:94dvh;overflow:auto}
  .cat-fiche-photo{min-height:0;padding:34px 20px 16px}
  .cat-fiche-photo > img{max-height:220px}
  .cat-fiche-texte{padding:20px 18px calc(22px + env(safe-area-inset-bottom));overflow:visible}
  .cat-actions{grid-template-columns:1fr 1fr}
}
@media(prefers-reduced-motion:reduce){
  .cat-feuille{transition:none}
  .cat-fiche-photo > img{animation:none}
}