/* ==========================================================================
   Cartes et affiches de formation « proposition 01 » (chantier cours6, docs/technique.md §34.2).
   Reprise à l'identique de la maquette (reference/styles.css : .course-card, .course-cover--*, .course-symbol,
   anneaux ::before/::after, niveau, méta, pied formateur + flèche, survol soulevé) pour toutes les cartes du site :
   partials/course_card, partials/course_cover, partials/path_card, packs, classes en direct, espaces apprenant et
   formateur, visuel de la fiche formation. Chargée partout par partials/head.php, après app.css.
   Couleurs : jetons --fs-p01-* (tokens.css) ; thème sombre des espaces connectés : variables --p01c-* redéfinies.
   ========================================================================== */

/* ---- Carte ---- */
.p01-card{--p01c-bg:#fff;--p01c-ink:var(--fs-p01-c-16203a);--p01c-text:var(--fs-p01-c-5a6985);--p01c-meta:var(--fs-p01-c-5a6985);--p01c-line:var(--fs-p01-c-e0e6f0);--p01c-divider:var(--fs-p01-c-edf0f5);--p01c-icon:var(--fs-p01-c-6477cb);--p01c-go:var(--fs-p01-c-17284d);--p01c-go-hover:var(--fs-p01-c-5a4bdd);--p01c-track:var(--fs-p01-c-edf0f5);--p01c-accent:var(--fs-p01-c-4d47c8);--p01c-trainer:var(--fs-p01-c-55647e);
  position:relative;display:flex;flex-direction:column;height:100%;min-width:0;overflow:hidden;padding:0;border:1px solid var(--p01c-line);border-radius:1.1875rem;background:var(--p01c-bg);box-shadow:0 10px 35px rgba(28,47,90,.065);transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease}
.p01-card:hover,.p01-card.card-hover:hover{transform:translateY(-6px);border-color:var(--p01c-line);box-shadow:0 22px 48px rgba(26,42,82,.13)}
.p01-card:focus-within{outline:3px solid rgba(9,216,245,.72);outline-offset:3px}
.p01-card.is-sponsored{border-color:var(--fs-accent-border)}
[data-theme="dark"] .p01-card{--p01c-bg:var(--fs-surface);--p01c-ink:var(--fs-text);--p01c-text:var(--fs-text-secondary);--p01c-meta:var(--fs-text-muted);--p01c-line:var(--fs-border);--p01c-divider:var(--fs-divider);--p01c-icon:var(--fs-p01-c-b298ff);--p01c-go:var(--fs-p01-c-5a4bdd);--p01c-go-hover:var(--fs-p01-c-6b48ff);--p01c-track:var(--fs-surface-sunken);--p01c-accent:var(--fs-p01-c-bca1ff);--p01c-trainer:var(--fs-text-secondary);box-shadow:0 10px 35px rgba(0,0,0,.25)}
.p01c-media{position:relative}

/* ---- Couverture (partials/course_cover) ---- */
.p01c-cover,.course-card .p01c-cover{position:relative;min-height:177px;display:grid;place-items:center;overflow:hidden;isolation:isolate;color:#fff;background:linear-gradient(145deg,var(--fs-p01-c-071a4c),var(--fs-p01-c-2253e3) 53%,var(--fs-p01-c-9b25d5));text-decoration:none}
.course-card .p01c-cover{aspect-ratio:auto}
.p01c-cover::before,.p01c-cover::after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.p01c-cover::before{width:170px;height:170px;top:-83px;inset-inline-end:-48px;border:1px solid rgba(255,255,255,.25);box-shadow:0 0 0 22px rgba(255,255,255,.045)}
.p01c-cover::after{width:120px;height:120px;bottom:-60px;inset-inline-start:-45px;background:rgba(255,255,255,.07)}
/* Les quatre couvertures de la maquette */
.cover.p01c-cover.p01c-cover--ai{background:linear-gradient(145deg,var(--fs-p01-c-071a4c),var(--fs-p01-c-2253e3) 53%,var(--fs-p01-c-9b25d5))}
.cover.p01c-cover.p01c-cover--business{background:linear-gradient(145deg,var(--fs-p01-c-082c51),var(--fs-p01-c-057bb6) 48%,var(--fs-p01-c-09d3cd))}
.cover.p01c-cover.p01c-cover--design{background:linear-gradient(145deg,var(--fs-p01-c-421263),var(--fs-p01-c-9c29c2) 50%,var(--fs-p01-c-ef3fa7))}
.cover.p01c-cover.p01c-cover--language{background:linear-gradient(145deg,var(--fs-p01-c-18315a),var(--fs-p01-c-5b47d8) 50%,var(--fs-p01-c-2b9fea))}
/* Déclinaisons de la palette pour les autres catégories réelles (App\Services\CourseCover::SLUGS) */
.cover.p01c-cover.p01c-cover--tech{background:linear-gradient(145deg,var(--fs-p01-c-0a1541),var(--fs-p01-c-157feb) 52%,var(--fs-p01-c-11dff3))}
.cover.p01c-cover.p01c-cover--marketing{background:linear-gradient(145deg,var(--fs-p01-c-3d2985),var(--fs-p01-c-d443bd) 50%,var(--fs-p01-c-ff6681))}
.cover.p01c-cover.p01c-cover--finance{background:linear-gradient(145deg,var(--fs-p01-c-082c51),var(--fs-p01-c-1dab86) 52%,var(--fs-p01-c-4cdfa1))}
.cover.p01c-cover.p01c-cover--growth{background:linear-gradient(145deg,var(--fs-p01-c-35236d),var(--fs-p01-c-7c4ade) 48%,var(--fs-p01-c-ef518f))}
.cover.p01c-cover.p01c-cover--office{background:linear-gradient(145deg,var(--fs-p01-c-101947),var(--fs-p01-c-4434e5) 50%,var(--fs-p01-c-1fc6dc))}
.cover.p01c-cover.p01c-cover--health{background:linear-gradient(145deg,var(--fs-p01-c-082c51),var(--fs-p01-c-078fb0) 48%,var(--fs-p01-c-39cf95))}
/* Vraie image : même cadre, voile haut/bas pour la pastille, le niveau et les badges */
.cover.p01c-cover.p01c-cover--image{background:var(--fs-p01-navy-800)}
.p01c-cover--image::before{display:none}
.p01c-cover--image::after{inset:0;width:auto;height:auto;z-index:1;border-radius:0;background:linear-gradient(180deg,rgba(3,12,38,.42),rgba(3,12,38,0) 38%,rgba(3,12,38,0) 58%,rgba(3,12,38,.6))}
.p01c-img{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.p01-card:hover .p01c-img{transform:scale(1.04)}
/* Médaillon de verre incliné */
.p01c-symbol{position:relative;z-index:1;width:78px;height:78px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.35);border-radius:1.5625rem;background:rgba(255,255,255,.12);box-shadow:0 18px 32px rgba(4,9,38,.28),inset 0 1px rgba(255,255,255,.28);-webkit-backdrop-filter:var(--fs-blur-glass);backdrop-filter:var(--fs-blur-glass);transform:rotate(-4deg)}
.p01-card:nth-child(even) .p01c-symbol{transform:rotate(4deg)}
.p01c-symbol svg{width:46px;height:46px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.p01c-symbol svg.p01c-symbol-ic{width:40px;height:40px;stroke-width:1.3}
/* Pastille de catégorie, numéro, niveau, badges */
.p01c-top{position:absolute;top:12px;inset-inline-start:12px;z-index:2;display:flex;align-items:center;gap:6px;max-width:calc(100% - 104px)}
.p01c-pill,.p01c-num{min-width:0;padding:4px 8px;border:1px solid rgba(255,255,255,.27);border-radius:var(--fs-radius-full);background:rgba(3,12,38,.22);-webkit-backdrop-filter:var(--fs-blur-chip);backdrop-filter:var(--fs-blur-chip);font-size:.75rem;font-weight:850;line-height:1.3;letter-spacing:.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p01c-num{flex:0 0 auto;font-variant-numeric:tabular-nums}
.p01c-level{position:absolute;inset-inline-end:12px;bottom:11px;z-index:2;font-size:.75rem;font-weight:700;opacity:.92;text-shadow:0 1px 2px rgba(3,12,38,.45)}
.p01c-cover--image .p01c-pill,.p01c-cover--image .p01c-num{background:rgba(3,12,38,.55)}
.p01c-cover--image .p01c-level{padding:2px 8px;border-radius:var(--fs-radius-full);background:rgba(3,12,38,.55);opacity:1}
.p01c-flags{position:absolute;inset-inline-start:12px;bottom:9px;z-index:2;display:flex;flex-wrap:wrap;align-items:center;gap:5px;max-width:62%}
.p01c-flags .badge{min-height:22px;padding:2px 8px;border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.94);color:var(--fs-p01-c-16203a);font-size:.75rem;font-weight:800;box-shadow:0 6px 14px rgba(4,9,38,.18)}
.p01c-flags .badge-gradient,.p01c-flags .badge-live{border-color:transparent;background:var(--fs-p01-gradient);color:#fff}
.p01c-flags .badge-success{color:var(--fs-success-text)}
.p01c-flags .badge-accent{color:var(--fs-p01-c-e92790)}
.p01c-flags .badge-cyan{color:var(--fs-p01-c-086fae)}
.p01c-flags .badge .ic{width:.875rem;height:.875rem}
/* Actions sur la couverture : comparer, favori */
.p01c-actions{position:absolute;top:10px;inset-inline-end:10px;z-index:3;display:flex;gap:6px}
.p01c-act{width:38px;height:38px;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.4);border-radius:var(--fs-radius-full);background:rgba(3,12,38,.3);color:#fff;cursor:pointer;-webkit-backdrop-filter:var(--fs-blur-chip);backdrop-filter:var(--fs-blur-chip);transition:background .2s ease,color .2s ease,transform .2s ease}
.p01c-act:hover{background:rgba(3,12,38,.55);transform:translateY(-1px)}
.p01c-act.on,.p01c-act[aria-pressed="true"]{border-color:#fff;background:#fff;color:var(--fs-p01-c-e92790)}
.p01c-act.on .ic{fill:currentColor}
.p01c-act:focus-visible,.p01c-go:focus-visible,.p01c-resume:focus-visible{outline:3px solid var(--fs-p01-cyan);outline-offset:2px}

/* ---- Corps ---- */
.p01-card .p01c-body{display:flex;flex-direction:column;gap:0;flex:1;padding:20px 18px 17px}
.p01-card .p01c-body h3{min-height:2.8em;margin:0 0 8px;color:var(--p01c-ink);font-size:1.03rem;font-weight:800;line-height:1.4;letter-spacing:-.018em;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.p01-card .p01c-body h3 a{color:inherit;text-decoration:none}
.p01-card .p01c-body h3 a:hover{color:var(--p01c-accent)}
.p01-card .p01c-sub{min-height:2.9em;margin:0 0 12px;color:var(--p01c-text);font-size:.79rem;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.p01-card .p01c-note{min-height:0;display:flex;align-items:center;gap:6px;margin:-4px 0 10px;color:var(--p01c-meta);font-size:.75rem}
.p01-card .sponsor-mention{margin:0 0 8px}
.p01c-meta{display:flex;flex-wrap:wrap;gap:6px 11px;padding-bottom:14px;color:var(--p01c-meta);font-size:.75rem}
.p01c-meta span{display:inline-flex;align-items:center;gap:4px}
.p01-card .p01-ic,.p01-poster .p01-ic{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.p01c-meta .p01-ic{width:13px;height:13px;stroke:var(--p01c-icon);stroke-width:1.7}
.p01c-rating .ic{width:13px;height:13px;color:var(--fs-warning);fill:currentColor;stroke:none}
.p01c-rating b{color:var(--p01c-ink);font-weight:800}
.p01c-rating small{font-size:.75rem}
/* Prix : barré Omnibus et mention d'abonnement conservés */
.p01c-price{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 10px;margin-top:auto;padding-bottom:13px}
.p01-card .p01c-price .price:not(.free){color:var(--p01c-ink)}
.p01-card .p01c-price .price{font-size:1.125rem;font-weight:850;letter-spacing:-.02em}
.p01-card .p01c-price .price .old{font-size:.8125rem;color:var(--p01c-meta)}
.p01-card .p01c-sub-note{margin:0;display:inline-flex;align-items:center;gap:5px;color:var(--p01c-accent);font-size:.75rem;font-weight:700}
/* Progression d'un inscrit : barre en dégradé de la marque */
.p01c-progress-label{display:flex;justify-content:space-between;margin-top:auto;margin-bottom:6px;color:var(--p01c-meta);font-size:.75rem;font-weight:700}
.p01c-progress{height:8px;margin-bottom:14px;overflow:hidden;border-radius:var(--fs-radius-full);background:var(--p01c-track)}
.p01c-progress > span{display:block;width:var(--p,0%);height:100%;border-radius:inherit;background:var(--fs-p01-gradient)}
/* Pied : formateur + flèche de la maquette */
.p01c-footer{display:flex;align-items:center;gap:8px;padding-top:13px;border-top:1px solid var(--p01c-divider)}
.p01c-avatar{width:28px;height:28px;flex:0 0 auto;display:grid;place-items:center;border-radius:.5625rem;color:#fff;background:var(--fs-p01-c-5269dd);font-size:.75rem;font-weight:850;object-fit:cover}
.p01c-avatar--one{background:linear-gradient(135deg,var(--fs-p01-c-08bfdc),var(--fs-p01-c-4666df))}
.p01c-avatar--two{background:linear-gradient(135deg,var(--fs-p01-c-7646df),var(--fs-p01-c-da3bbb))}
.p01c-avatar--three{background:linear-gradient(135deg,var(--fs-p01-c-ef518f),var(--fs-p01-c-8b4de7))}
.p01c-avatar--four{background:linear-gradient(135deg,var(--fs-p01-c-248bdc),var(--fs-p01-c-27c5bb))}
.p01c-trainer{flex:1;min-width:0;overflow:hidden;color:var(--p01c-trainer);font-size:.75rem;font-weight:700;white-space:nowrap;text-overflow:ellipsis}
.p01c-trainer a{color:inherit;text-decoration:none}
.p01c-trainer a:hover{color:var(--p01c-accent);text-decoration:underline}
.p01c-footer .badge{flex:0 0 auto}
.p01c-go{position:relative;width:29px;height:29px;flex:0 0 auto;display:grid;place-items:center;margin-inline-start:auto;border-radius:.5625rem;color:#fff;background:var(--p01c-go);transition:background .2s ease,transform .2s ease}
.p01c-go::before{content:"";position:absolute;inset:-8px}
.p01c-go .p01-ic{width:14px;height:14px;stroke-width:2}
.p01-card:hover .p01c-go,.p01c-go:hover{background:var(--p01c-go-hover);transform:translateX(2px)}
[dir="rtl"] .p01c-go .p01-ic{transform:scaleX(-1)}
[dir="rtl"] .p01-card:hover .p01c-go,[dir="rtl"] .p01c-go:hover{transform:translateX(-2px)}
.p01c-resume{flex:0 0 auto;min-height:34px;display:inline-flex;align-items:center;gap:6px;padding:0 14px;border-radius:var(--fs-radius-full);color:#fff;background:linear-gradient(118deg,var(--fs-p01-c-1aa4f7),var(--fs-p01-c-6346ec) 72%,var(--fs-p01-c-bd2dcc));box-shadow:0 8px 20px rgba(75,73,218,.24);font-size:.8125rem;font-weight:800;white-space:nowrap;text-decoration:none}
.p01c-resume:hover{color:#fff;filter:brightness(1.06)}
.p01c-resume .ic{width:.875rem;height:.875rem}

/* ---- Cartes de l'espace formateur (instructor/courses : .course-tile, studio.css chargée après) ---- */
.course-tile.p01-card .p01c-cover{aspect-ratio:auto}
.course-tile.p01-card .p01c-flags .badge{position:static}
.course-tile.p01-card .p01c-body{gap:8px;padding:18px 18px 12px}
.course-tile.p01-card .p01c-body > strong{color:var(--p01c-ink);font-size:1rem;font-weight:800;line-height:1.4}
.course-tile.p01-card .p01c-body > strong a{color:inherit}
.course-tile.p01-card .p01c-body > small{color:var(--p01c-meta)}
.course-tile.p01-card .foot{display:flex;align-items:center;gap:8px;margin:0 18px;padding:12px 0 14px;border-top:1px solid var(--p01c-divider);background:transparent}
.course-tile.p01-card .progress > span{background:var(--fs-p01-gradient)}

/* ---- Vignettes de reprise (tableau de bord, mes formations) ---- */
.p01c-thumb{width:180px;flex:0 0 auto;display:block;overflow:hidden;border-radius:.875rem;box-shadow:0 18px 40px rgba(4,9,38,.28)}
.p01c-thumb .p01c-cover{min-height:0;aspect-ratio:16/9}
.p01c-thumb .p01c-symbol,.p01c-thumb .p01c-cover--poster .p01c-symbol{width:54px;height:54px;border-radius:1.0625rem}
.p01c-thumb .p01c-symbol svg,.p01c-thumb .p01c-cover--poster .p01c-symbol svg{width:32px;height:32px}
.p01c-thumb .p01c-symbol svg.p01c-symbol-ic{width:28px;height:28px}
.p01c-thumb .p01c-cover::before{width:110px;height:110px;top:-55px;inset-inline-end:-30px;box-shadow:0 0 0 14px rgba(255,255,255,.045)}
.p01c-thumb--row{width:100%;border-radius:.75rem;box-shadow:none}
.p01c-progress--on-dark{margin-bottom:6px;background:rgba(255,255,255,.25)}
.p01c-progress--on-dark > span{background:linear-gradient(90deg,var(--fs-p01-cyan),#fff)}
.p01c-progress--sm{height:6px;margin-bottom:0}
.p01-row{border-radius:1.1875rem}

/* ---- Affiche principale (fiche formation, parcours, pack : .p01-poster) ---- */
.p01-poster{overflow:hidden;border-radius:1.1875rem}
.p01c-cover--poster{min-height:0;aspect-ratio:16/9}
.p01c-cover--poster .p01c-symbol{width:104px;height:104px;border-radius:2rem}
.p01c-cover--poster .p01c-symbol svg{width:60px;height:60px}
.p01c-cover--poster .p01c-symbol svg.p01c-symbol-ic{width:54px;height:54px}
.p01-poster .p01c-play{position:absolute;inset:0;z-index:3;display:grid;place-items:center;color:#fff;background:rgba(3,12,38,.28)}
.p01-poster .p01c-play .ic{width:64px;height:64px;padding:18px;border:1px solid rgba(255,255,255,.4);border-radius:50%;background:rgba(255,255,255,.18);-webkit-backdrop-filter:var(--fs-blur-chip);backdrop-filter:var(--fs-blur-chip)}

.course-side .p01-poster .p01c-cover{border-radius:0}
/* Encart d'achat de la fiche : prix à l'encre de la maquette, remise en dégradé de la marque */
.p01-buy .price{color:var(--fs-p01-c-16203a);font-weight:850;letter-spacing:-.02em}
.p01-buy .price.free{color:var(--fs-success-text)}
.p01-buy .price .badge-accent{border-color:transparent;background:var(--fs-p01-gradient);color:#fff;font-weight:800}
[data-theme="dark"] .p01-buy .price:not(.free){color:var(--fs-text)}
/* Badges de l'en-tête de fiche : pastilles de verre de la maquette */
.p01-hero-badges .badge{min-height:26px;padding:3px 10px;border:1px solid rgba(255,255,255,.27);border-radius:var(--fs-radius-full);font-size:.75rem;font-weight:800;letter-spacing:.02em}
.p01-hero-badges .badge-gradient{border-color:transparent;background:var(--fs-p01-gradient);color:#fff}

@media (max-width:640px){
  .p01c-cover{min-height:190px}
  .p01c-thumb{width:100%}
  .p01c-cover--poster{min-height:0}
}
@media (prefers-reduced-motion:reduce){
  .p01-card,.p01c-go,.p01c-img,.p01c-act{transition:none}
  .p01-card:hover,.p01-card.card-hover:hover,.p01-card:hover .p01c-go,.p01c-go:hover,[dir="rtl"] .p01-card:hover .p01c-go,.p01-card:hover .p01c-img{transform:none}
}
[data-motion="reduce"] .p01-card:hover,[data-motion="reduce"] .p01-card:hover .p01c-go,[data-motion="reduce"] .p01-card:hover .p01c-img{transform:none}