/* =========================================================
   glasz — Formation & Masterclass
   Page formation.html + bandeau « Nouveau » de l'accueil.
   Chargé après css/site.css ; classes préfixées « g-fm- »
   (page) et « g-mc- » (maquette de la page Masterclass de l'app).
   ========================================================= */

/* ---------- Hero ---------- */
.g-hero--fm { background: var(--red); }
.g-hero--fm .g-word { padding-top: 0.14em; color: var(--black); }
.g-hero--fm .g-word .l:hover .li { color: var(--white); }
.g-fm-hero__media { background: radial-gradient(60% 70% at 58% 30%, #ff3a62 0%, transparent 70%); }
.g-fm-hero__media::before, .g-fm-hero__media::after { display: none; }
.g-fm-hero__ph { position: absolute; left: 56%; top: 13%; translate: -50% 0; rotate: 8deg; }
.g-fm-hero__ph .g-phone { --w: clamp(200px, 17vw, 290px); box-shadow: 0 60px 90px -30px rgba(61, 3, 19, 0.75); }
.g-fm-hero__ph .g-phone__scr > img { position: static; width: 100%; height: 100%; object-fit: cover; filter: none; transform: none; }
.g-fm-new { display: inline-flex; align-items: center; gap: 10px; padding: 6px 12px 6px 6px; background: var(--black); color: var(--white); }
.g-fm-new b { padding: 4px 8px; background: var(--white); color: var(--red); font-weight: 600; }

/* ---------- Listes ---------- */
.g-fm-list { display: grid; gap: 0; margin-top: 22px; border-top: 1.5px solid currentColor; }
.g-fm-list li { position: relative; padding: 12px 0 12px 26px; border-bottom: 1px solid rgba(255, 255, 255, 0.18); font-weight: 500; }
.g-fm-list li::before { content: ''; position: absolute; left: 2px; top: 19px; width: 10px; height: 10px; background: var(--red); }
.g-fm-lvl--red .g-fm-list li { border-color: rgba(0, 0, 0, 0.22); }
.g-fm-lvl--red .g-fm-list li::before { background: var(--black); }

/* ---------- Deux niveaux ---------- */
.g-fm-duo { background: var(--black); color: var(--white); padding-block: clamp(90px, 11vw, 170px); overflow: hidden; }
.g-fm-duo__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px; background: var(--line); border: 2px solid var(--line); }
.g-fm-lvl { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 18px; padding: clamp(24px, 3vw, 44px); background: var(--black-soft); overflow: hidden; }
.g-fm-lvl__top { display: flex; justify-content: space-between; align-items: center; gap: 12px; width: 100%; }
.g-fm-lvl__n { color: var(--ink-soft); }
.g-fm-lvl h3 { font-size: clamp(30px, 3.6vw, 60px); line-height: 0.9; text-transform: uppercase; }
.g-fm-lvl > p { max-width: 46ch; color: #b9b8be; font-size: 17px; }
.g-fm-lvl .g-fm-list { width: 100%; max-width: 46ch; }
.g-fm-lvl .btn { margin-top: auto; }
.g-fm-lvl__phone { align-self: center; margin-top: 18px; margin-bottom: calc(-1 * clamp(160px, 18vw, 260px)); }
.g-fm-lvl__phone .g-phone { --w: clamp(220px, 22vw, 300px); }
.g-fm-lvl--red { background: var(--red); }
.g-fm-lvl--red > p { color: rgba(255, 255, 255, 0.92); }
.g-fm-lvl--red .g-fm-lvl__n { color: rgba(0, 0, 0, 0.55); }

/* ---------- La page Masterclass ---------- */
.g-fm-hub { background: var(--paper); color: var(--black); padding-block: clamp(90px, 11vw, 170px); overflow: hidden; }
.g-fm-hub__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  grid-template-areas: "head phone points";
  gap: clamp(32px, 4.5vw, 80px);
  align-items: center;
}
.g-fm-hub__head { grid-area: head; }
.g-fm-hub__head h2 { margin-top: 18px; }
.g-fm-lead { margin-top: 26px; color: var(--ink); font-size: 18px; max-width: 36ch; }
.g-fm-hub__phone { grid-area: phone; display: grid; justify-items: center; gap: 16px; }
.g-fm-hub__phone .g-phone { --w: clamp(270px, 24vw, 340px); }
.g-fm-fict { color: var(--ink-soft); }
.g-fm-points { grid-area: points; display: grid; border-top: 2px solid var(--black); }
.g-fm-points li { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; padding: 18px 0; border-bottom: 1.5px solid var(--line-ink); }
.g-fm-points li > .mono { color: var(--red); padding-top: 4px; }
.g-fm-points h3 { font-size: clamp(17px, 1.4vw, 22px); text-transform: uppercase; }
.g-fm-points p { margin-top: 8px; color: var(--ink); font-size: 15px; }

/* Maquette : unités en cqw, comme .g-mock de l'accueil */
.g-mc { position: absolute; inset: 0; container-type: inline-size; background: #f3f2ef; color: #0a0a0d; overflow: hidden; }
.g-mc__in { height: 100%; overflow-y: auto; overscroll-behavior: contain; padding: 17cqw 5cqw 10cqw; scrollbar-width: none; }
.g-mc__in::-webkit-scrollbar { display: none; }
.g-mc__in:focus-visible { outline: 2px solid var(--red); outline-offset: -4px; }
.g-mc .m { font-family: var(--font-mono); font-size: 2.3cqw; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: #6c6b71; }
.g-mc__back { display: grid; place-items: center; width: 11cqw; aspect-ratio: 1; border: 0.3cqw solid #0a0a0d; }
.g-mc__back svg { width: 5cqw; fill: none; stroke: currentColor; stroke-width: 2; }
.g-mc__title { margin-top: 4cqw; font-family: var(--font-display); font-size: 8.6cqw; line-height: 1; text-transform: uppercase; letter-spacing: -0.02em; }
.g-mc__count { margin-top: 2.6cqw; font-size: 3.6cqw; color: #6c6b71; font-variant-numeric: tabular-nums; }
.g-mc__count b { font-weight: 500; color: #0a0a0d; }
.g-mc__lbl { display: block; margin: 8cqw 0 2.6cqw; }
.g-mc__lbl span { color: var(--red); }
.g-mc__moment { display: grid; grid-template-columns: 1fr 1fr; gap: 2cqw; }
.g-mc__hero { position: relative; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: 1.6cqw; min-height: 44cqw; padding: 3cqw; text-align: left; color: #fff; cursor: pointer; transition: transform 0.25s var(--ease); }
.g-mc__hero--spirit { background: linear-gradient(180deg, #3a2414 0%, #6b3f1d 45%, #1b0f07 100%); }
.g-mc__hero--wine { background: linear-gradient(180deg, #2a0710 0%, #4b0f20 45%, #12030a 100%); }
.g-mc__hero b { font-family: var(--font-display); font-size: 3.4cqw; line-height: 1.02; text-transform: uppercase; font-weight: 400; }
.g-mc__kind { padding: 0.8cqw 1.4cqw; background: #fff; color: var(--red); font-family: var(--font-mono); font-size: 2.1cqw; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; }
.g-mc__sub { font-size: 2.6cqw; color: rgba(255, 255, 255, 0.82); }
.g-mc__sub i { font-style: normal; }
.g-mc__row { margin-top: 8cqw; }
.g-mc__rh { display: flex; justify-content: space-between; align-items: flex-end; gap: 3cqw; margin-bottom: 2.6cqw; }
.g-mc__rh b { font-family: var(--font-display); font-size: 4.4cqw; line-height: 1; text-transform: uppercase; font-weight: 400; }
.g-mc__rh .m { white-space: nowrap; }
.g-mc__shelf { display: flex; gap: 2.4cqw; margin-inline: -5cqw; padding-inline: 5cqw; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.g-mc__shelf::-webkit-scrollbar { display: none; }
.g-mc__card { flex: 0 0 39cqw; scroll-snap-align: start; display: flex; flex-direction: column; align-items: flex-start; gap: 1.8cqw; padding: 2.4cqw 2.4cqw 3cqw; background: #fff; border: 0.5cqw solid #0a0a0d; text-align: left; cursor: pointer; transition: transform 0.25s var(--ease); }
.g-mc__card:hover, .g-mc__hero:hover { transform: translateY(-0.8cqw); }
.g-mc__card:focus-visible, .g-mc__hero:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }
.g-mc__th { display: flex; align-items: flex-end; width: 100%; aspect-ratio: 16 / 9; padding: 1.6cqw; }
.g-mc__th--wine { background: linear-gradient(135deg, #f0cdd6, #a52a4a); }
.g-mc__th--spirit { background: linear-gradient(135deg, #f1dfc2, #c58a3e); }
.g-mc__th--brand { background: linear-gradient(135deg, #2a2a30, #0a0a0d); }
.g-mc__th .m { padding: 0.6cqw 1.2cqw; background: #fff; color: #0a0a0d; font-style: normal; font-size: 2cqw; }
.g-mc__card em { font-style: normal; font-size: 2.5cqw; font-weight: 700; color: var(--red); margin-bottom: -1cqw; }
.g-mc__card b { font-size: 3.2cqw; line-height: 1.22; font-weight: 600; min-height: 7.8cqw; }
.g-mc__st { display: inline-flex; align-items: center; gap: 1.6cqw; }
.g-mc__st i { width: 2.6cqw; aspect-ratio: 1; border: 0.35cqw solid var(--red); transition: background-color 0.2s, border-color 0.2s; }
.g-mc__card[aria-pressed="true"] .g-mc__st i { background: #6c6b71; border-color: #6c6b71; }
.g-mc__card.is-pop .g-mc__st i, .g-mc__hero.is-pop .g-mc__kind { animation: g-mc-pop 0.45s var(--ease); }
@keyframes g-mc-pop { 0% { transform: scale(1); } 40% { transform: scale(1.5); } 100% { transform: scale(1); } }

/* ---------- Suivre une masterclass ---------- */
.g-fm-run { background: var(--black); color: var(--white); padding-block: clamp(90px, 11vw, 170px); }
.g-fm-run__grid { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(32px, 5vw, 90px); align-items: start; }
.g-fm-steps { display: grid; counter-reset: s; border-top: 1.5px solid var(--line); }
.g-fm-steps li { counter-increment: s; display: grid; grid-template-columns: 54px minmax(0, 1fr); column-gap: 14px; padding: 22px 0; border-bottom: 1.5px solid var(--line); }
.g-fm-steps li::before { content: counter(s, decimal-leading-zero); grid-row: 1 / 3; font-family: var(--font-display); font-size: 30px; line-height: 1; color: var(--red); }
.g-fm-steps b { font-family: var(--font-display); font-size: clamp(20px, 1.8vw, 28px); text-transform: uppercase; line-height: 1; }
.g-fm-steps p { margin-top: 8px; color: #b9b8be; max-width: 46ch; }

.g-fm-demo { position: relative; background: var(--white); color: var(--black); padding: clamp(20px, 2.4vw, 34px); overflow: hidden; }
.g-fm-demo::after { content: ''; position: absolute; top: 0; right: 0; width: 14px; height: 14px; background: var(--red); }
.g-fm-demo__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.g-fm-demo__head .mono { color: var(--ink-soft); }
.g-fm-demo__head h3 { margin-top: 8px; font-size: clamp(24px, 2.4vw, 38px); text-transform: uppercase; }
.g-fm-demo__state { flex: none; padding: 5px 9px; border: 1.5px solid var(--red); color: var(--red); white-space: nowrap; }
.g-fm-demo.is-done .g-fm-demo__state { background: var(--black); border-color: var(--black); color: var(--white); }
.g-fm-demo__intro { margin: 14px 0 18px; color: var(--ink); max-width: 52ch; }
.g-fm-item { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 14px 0; border-top: 1.5px solid var(--line-ink); }
.g-fm-item__ic { display: grid; place-items: center; width: 44px; height: 44px; background: var(--black); color: var(--white); transition: background-color 0.25s; }
.g-fm-item__ic svg { width: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
.g-fm-item.is-done .g-fm-item__ic { background: var(--red); }
.g-fm-item__body { display: grid; gap: 4px; min-width: 0; }
.g-fm-item__body b { font-weight: 600; }
.g-fm-item__body .mono { color: var(--ink-soft); }
.g-fm-bar { display: block; height: 6px; margin-top: 4px; background: rgba(10, 10, 13, 0.1); overflow: hidden; }
.g-fm-bar i { display: block; height: 100%; background: var(--red); transform-origin: left; transform: scaleX(var(--p, 0)); transition: transform 0.35s var(--ease); }
.g-fm-item__btn, .g-fm-quiz__opts button { min-height: 44px; padding: 0 16px; background: var(--black); color: var(--white); font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; transition: background-color 0.25s, opacity 0.25s; }
.g-fm-item__btn:hover { background: var(--red); }
.g-fm-item__btn:disabled { opacity: 0.25; cursor: default; background: var(--black); }
.g-fm-quiz { padding: 16px 0 6px; border-top: 1.5px solid var(--line-ink); }
.g-fm-quiz__q { display: grid; gap: 8px; }
.g-fm-quiz__q .mono { color: var(--red); }
.g-fm-quiz__q b { font-size: 17px; font-weight: 600; }
.g-fm-quiz__opts { display: grid; gap: 6px; margin-top: 12px; }
.g-fm-quiz__opts button { justify-content: flex-start; padding: 10px 14px; text-align: left; letter-spacing: 0.02em; text-transform: none; font-size: 14px; font-weight: 600; background: transparent; color: var(--black); border: 1.5px solid var(--black); }
.g-fm-quiz__opts button:hover:not(:disabled) { background: var(--black); color: var(--white); }
.g-fm-quiz__opts button:disabled { cursor: default; opacity: 0.35; }
.g-fm-quiz__opts button.is-ok { opacity: 1; background: var(--red); border-color: var(--red); color: var(--white); }
.g-fm-quiz__opts button.is-ko { opacity: 1; text-decoration: line-through; }
.g-fm-quiz__msg { margin-top: 12px; color: var(--ink-soft); }
.g-fm-demo__foot { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 14px; padding-top: 14px; border-top: 2px solid var(--black); }
.g-fm-demo__foot .mono { font-size: 13px; font-weight: 600; }
.g-fm-demo .g-stamp { top: 26px; transform: rotate(-10deg) scale(2.2); }
.g-fm-demo.is-done .g-stamp { opacity: 1; transform: rotate(-10deg) scale(1); }

/* ---------- Managers ---------- */
.g-fm-mgr { background: var(--paper); color: var(--black); padding-block: clamp(90px, 11vw, 170px); }
.g-fm-mgr__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.g-fm-brands { grid-column: 2 / 4; grid-row: 1 / 3; }
.g-fm-brands__note { margin: 0 !important; padding-top: 16px; border-top: 1.5px solid var(--line-ink); max-width: 70ch !important; font-size: 14px !important; }
.g-fm-brands__note a { color: var(--red); text-decoration: underline; text-underline-offset: 3px; }
.g-fm-kv { display: grid; border-top: 2px solid var(--black); }
.g-fm-kv li { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 11px 0; border-bottom: 1.5px solid var(--line-ink); }
.g-fm-kv span { font-weight: 600; }
.g-fm-kv b { font-family: var(--font-mono); font-size: 11px; font-weight: 500; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ink-soft); text-align: right; }
.g-fm-brands__pick { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.g-fm-brands__pick button { min-height: 40px; padding: 0 14px; border: 1.5px solid var(--black); font-size: 13px; font-weight: 600; transition: background-color 0.2s, color 0.2s; }
.g-fm-brands__pick button[aria-pressed="true"] { background: var(--black); color: var(--white); }
.g-fm-brands__pick button[aria-pressed="true"]::before { content: '✓ '; color: var(--red); }
.g-fm-brands__list { display: grid; border-top: 2px solid var(--black); }
.g-fm-brands__list li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 11px 2px; border-bottom: 1.5px solid var(--line-ink); transition: opacity 0.3s, transform 0.3s var(--ease); }
.g-fm-brands__list li b { font-weight: 600; }
.g-fm-brands__list li .mono { color: var(--ink-soft); white-space: nowrap; }
.g-fm-brands__list li:not([data-of=""]) .mono { color: var(--red); }
.g-fm-brands__list li.is-off { opacity: 0.22; transform: translateX(10px); }
.g-fm-brands__list li.is-off b { text-decoration: line-through; text-decoration-thickness: 1.5px; }
.g-fm-brands__count { margin-top: 14px; font-size: 12px; font-weight: 600; }

/* ---------- Marques partenaires ---------- */
.g-fm-rules { display: grid; border-top: 2px solid rgba(0, 0, 0, 0.35); }
.g-fm-rules li { display: grid; gap: 8px; padding: 22px 0; border-bottom: 2px solid rgba(0, 0, 0, 0.35); }
.g-fm-rules b { font-family: var(--font-display); font-size: clamp(20px, 2vw, 30px); text-transform: uppercase; line-height: 1; }
.g-fm-rules span { color: rgba(255, 255, 255, 0.92); max-width: 44ch; }

/* ---------- Formules ---------- */
.g-fm-incl { background: var(--black); color: var(--white); padding-block: clamp(90px, 11vw, 170px); }
.g-fm-incl__row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px; background: var(--line); border: 2px solid var(--line); }
.g-fm-plan { display: grid; align-content: start; gap: 14px; padding: clamp(22px, 2.6vw, 36px); background: var(--black-soft); }
.g-fm-plan .mono { color: var(--ink-soft); }
.g-fm-plan b { font-family: var(--font-display); font-size: clamp(30px, 3.4vw, 54px); text-transform: uppercase; line-height: 0.9; }
.g-fm-plan ul { display: grid; gap: 8px; margin-top: 8px; }
.g-fm-plan li { position: relative; padding-left: 24px; font-weight: 500; }
.g-fm-plan li::before { content: ''; position: absolute; left: 0; top: 4px; width: 14px; height: 8px; border-left: 2px solid var(--red); border-bottom: 2px solid var(--red); transform: rotate(-45deg); }
.g-fm-plan--hot { background: var(--red); }
.g-fm-plan--hot .mono { color: rgba(255, 255, 255, 0.8); }
.g-fm-plan--hot li::before { border-color: var(--black); }
.g-fm-incl__cta { margin-top: 32px; }

/* ---------- Passeport employé ---------- */
.g-fm-pp { background: var(--red); color: var(--white); padding-block: clamp(90px, 11vw, 170px); overflow: hidden; }
.g-fm-pp__grid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(32px, 6vw, 110px); align-items: center; }
.g-fm-pp__head h2 { margin-top: 18px; }
.g-fm-pp__hl { color: var(--black); }
.g-fm-pp__lead { margin-top: 26px; max-width: 48ch; font-size: 18px; color: rgba(255, 255, 255, 0.92); }
.g-fm-pp__steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(20px, 3vw, 44px); margin-top: 36px; counter-reset: s; }
.g-fm-pp__steps li { counter-increment: s; display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 10px; padding: 18px 0; border-top: 2px solid rgba(0, 0, 0, 0.35); }
.g-fm-pp__steps li::before { content: counter(s, decimal-leading-zero); grid-row: 1 / 3; font-family: var(--font-display); font-size: 24px; line-height: 1; color: var(--black); }
.g-fm-pp__steps b { font-family: var(--font-display); font-size: clamp(18px, 1.6vw, 24px); text-transform: uppercase; line-height: 1; }
.g-fm-pp__steps p { margin-top: 8px; color: rgba(255, 255, 255, 0.92); font-size: 15px; }
.g-fm-pp__phone { display: grid; justify-items: center; gap: 16px; }
.g-fm-pp__phone .g-phone { --w: clamp(270px, 24vw, 340px); box-shadow: 0 60px 90px -30px rgba(61, 3, 19, 0.75); }
.g-fm-pp__hint { max-width: 34ch; text-align: center; color: rgba(255, 255, 255, 0.85); }
.g-fm-pp__hint a { color: var(--white); text-decoration: underline; text-underline-offset: 3px; }
.g-fm-pp__rules { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 44px); margin-top: clamp(56px, 7vw, 100px); }
.g-fm-pp__rules li { display: grid; align-content: start; gap: 10px; padding-top: 20px; border-top: 2px solid var(--black); }
.g-fm-pp__rules b { font-family: var(--font-display); font-size: clamp(20px, 2vw, 30px); text-transform: uppercase; line-height: 1; }
.g-fm-pp__rules span { color: rgba(255, 255, 255, 0.92); max-width: 44ch; }
.g-fm-pp__legal { margin-top: 36px; max-width: 80ch; font-size: 14px; color: rgba(255, 255, 255, 0.8); }
.g-fm-pp__legal a { color: var(--white); text-decoration: underline; text-underline-offset: 3px; }

/* Maquette « Mes certifications » (thème sombre de l'app), en cqw */
.g-pp { position: absolute; inset: 0; container-type: inline-size; background: #0a0a0d; color: #fff; overflow: hidden; }
.g-pp__in { height: 100%; overflow-y: auto; overscroll-behavior: contain; padding: 17cqw 5cqw 10cqw; scrollbar-width: none; }
.g-pp__in::-webkit-scrollbar { display: none; }
.g-pp__in:focus-visible { outline: 2px solid var(--white); outline-offset: -4px; }
.g-pp .m { font-family: var(--font-mono); font-size: 2.3cqw; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: #8a8990; }
.g-pp__back { display: grid; place-items: center; width: 11cqw; aspect-ratio: 1; border: 0.3cqw solid #fff; }
.g-pp__back svg { width: 5cqw; fill: none; stroke: currentColor; stroke-width: 2; }
.g-pp__title { margin-top: 4cqw; font-family: var(--font-display); font-size: 7.6cqw; line-height: 0.95; text-transform: uppercase; letter-spacing: -0.02em; }
.g-pp__card { display: grid; gap: 2cqw; margin-top: 6cqw; padding: 4.6cqw; background: #131217; border: 0.3cqw solid #2a2a30; border-top: 1.4cqw solid var(--red); }
.g-pp__name { display: flex; align-items: center; gap: 2.4cqw; font-family: var(--font-display); font-size: 9cqw; line-height: 1; text-transform: uppercase; font-weight: 400; }
.g-pp__count { display: flex; align-items: baseline; gap: 2.4cqw; }
.g-pp__count b { font-family: var(--font-display); font-size: 6cqw; color: var(--red); font-weight: 400; line-height: 1; }
.g-pp__count .m { color: #fff; font-size: 2.8cqw; }
.g-pp__note { font-size: 3cqw; color: #b9b8be; line-height: 1.35; }

/* Sceau « certifié » : carré + carré tourné à 45° = étoile à 8 pointes */
.g-pp__mini, .g-pp__seal { position: relative; display: inline-grid; place-items: center; flex: none; }
.g-pp__mini::before, .g-pp__mini::after, .g-pp__seal::before, .g-pp__seal::after { content: ''; position: absolute; inset: 15%; background: var(--red); }
.g-pp__mini::after, .g-pp__seal::after { transform: rotate(45deg); }
.g-pp__mini { width: 6.4cqw; aspect-ratio: 1; }
.g-pp__mini svg { position: relative; z-index: 1; width: 52%; fill: none; stroke: #0a0a0d; stroke-width: 3.4; stroke-linecap: square; }

.g-pp__wall { display: grid; grid-template-columns: 1fr 1fr; gap: 2.6cqw; margin-top: 2.6cqw; }
.g-pp__cert { display: grid; justify-items: center; align-content: start; gap: 2cqw; padding: 3.6cqw 2.4cqw 4cqw; background: #131217; border: 0.3cqw solid #2a2a30; text-align: center; }
.g-pp__cert > b { font-family: var(--font-display); font-size: 3cqw; line-height: 1.05; text-transform: uppercase; font-weight: 400; }
.g-pp__seal { width: 26cqw; aspect-ratio: 1; margin-block: 1cqw; }
.g-pp__seal > span { position: relative; z-index: 1; display: grid; place-items: center; gap: 0.6cqw; width: 48%; aspect-ratio: 1; background: #0a0a0d; }
.g-pp__seal b { font-family: var(--font-display); font-size: 3.5cqw; line-height: 1; font-weight: 400; }
.g-pp__seal i { font-family: var(--font-mono); font-style: normal; font-size: 1.6cqw; letter-spacing: 0.1em; text-transform: uppercase; color: var(--red); margin-top: -2cqw; }

/* La certification à gagner : grisée tant que la démo « Suivre une masterclass » n'est pas terminée */
.g-pp__cert--new { border-style: dashed; transition: border-color 0.3s; }
.g-pp__cert--new .g-pp__seal, .g-pp__cert--new > b { opacity: 0.3; filter: grayscale(1); transition: opacity 0.3s, filter 0.3s; }
.g-pp.is-new .g-pp__cert--new { border-style: solid; border-color: var(--red); }
.g-pp.is-new .g-pp__cert--new .g-pp__seal, .g-pp.is-new .g-pp__cert--new > b { opacity: 1; filter: none; }
.g-pp.is-new .g-pp__cert--new .g-pp__seal { animation: g-mc-pop 0.6s var(--ease); }
.g-pp.is-new .g-pp__cert--new > .m:last-child { color: var(--red); }

/* ---------- Accueil : bandeau « Nouveau · Masterclass » ---------- */
.g-fm-band { background: var(--red); color: var(--white); padding-block: clamp(70px, 9vw, 140px); overflow: hidden; }
.g-fm-band__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: clamp(32px, 5vw, 90px); align-items: center; }
.g-fm-band h2 { margin-top: 18px; font-size: clamp(1.7rem, 4.6vw, 5.2rem); }
.g-fm-band__lead { margin-top: 24px; max-width: 46ch; font-size: 18px; color: rgba(255, 255, 255, 0.92); }
.g-fm-band__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.g-fm-band__cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.g-fm-band__card { position: relative; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: 10px; min-height: clamp(220px, 22vw, 320px); padding: clamp(16px, 1.6vw, 24px); color: var(--white); box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.6); }
.g-fm-band__card:nth-child(1) { background: linear-gradient(180deg, #3a2414 0%, #6b3f1d 45%, #1b0f07 100%); transform: rotate(-3deg) translateY(10px); }
.g-fm-band__card:nth-child(2) { background: linear-gradient(180deg, #2a0710 0%, #4b0f20 45%, #12030a 100%); transform: rotate(3deg) translateY(-10px); }
.g-fm-band__card .mono { padding: 4px 8px; background: var(--white); color: var(--red); font-weight: 600; }
.g-fm-band__card b { font-family: var(--font-display); font-size: clamp(16px, 1.5vw, 24px); line-height: 1.02; text-transform: uppercase; }
.g-fm-band__card span:last-child { font-size: 14px; color: rgba(255, 255, 255, 0.8); }
.g-fm-band__note { grid-column: 1 / -1; margin-top: 6px; color: rgba(255, 255, 255, 0.8); }
.g-fm-more { display: inline-block; margin-top: 8px; color: var(--red); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Responsive ---------- */
@media (max-width: 1200px) {
  .g-fm-hub__grid { grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "phone head" "phone points"; align-items: start; }
  .g-fm-hub__phone { align-self: center; }
}
@media (max-width: 900px) {
  .g-fm-hero__ph { left: auto; right: -40px; top: 18%; translate: none; opacity: 0.3; }
  .g-fm-duo__grid, .g-fm-run__grid, .g-fm-band__grid { grid-template-columns: minmax(0, 1fr); }
  .g-fm-hub__grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "phone" "points"; }
  .g-fm-mgr__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .g-fm-brands { grid-column: 1 / 3; grid-row: auto; }
  .g-fm-incl__row { grid-template-columns: minmax(0, 1fr); }
  .g-fm-pp__grid, .g-fm-pp__rules { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .g-fm-hero__ph { display: none; }
  .g-fm-mgr__grid { grid-template-columns: minmax(0, 1fr); }
  .g-fm-brands { grid-column: auto; }
  .g-fm-item { grid-template-columns: 40px minmax(0, 1fr); }
  .g-fm-item__ic { width: 40px; height: 40px; }
  .g-fm-item__btn { grid-column: 2; justify-self: start; }
  .g-fm-demo__head { flex-direction: column-reverse; }
  .g-fm-demo .g-stamp { top: auto; bottom: 70px; right: 12px; }
  .g-fm-lvl__phone { margin-bottom: -150px; }
  .g-fm-pp__steps { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .g-mc__card, .g-mc__hero, .g-fm-brands__list li, .g-fm-bar i, .g-pp__cert--new, .g-pp__cert--new .g-pp__seal, .g-pp__cert--new > b { transition: none !important; animation: none !important; }
}
