/* ── Layout 2 colonnes Stripe Checkout (identique à /abonnement.html) ── */
  .rg-checkout{
    width:min(1280px, 100%);
    margin:0 auto;
    display:grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
    gap:0;
    min-height:100vh;
  }
  @media (max-width:920px){
    .rg-checkout{grid-template-columns:1fr; min-height:auto}
    /* 2026-08-28 (retour QA vtc-qa-tours) : en pile mobile, l'ordre du DOM
       (récap plan/prix d'abord, formulaire ensuite) mettait ~600px de contenu
       "carte à 0,00€" avant le premier champ à remplir — impression de page
       vide/cassée. Le formulaire (l'action réelle) passe en premier, le récap
       suit juste en dessous. Desktop inchangé (2 colonnes, aucun souci signalé). */
    .rg-form-wrap{order:1}
    .rg-summary{order:2}
  }

  /* Colonne gauche : récap sticky */
  .rg-summary{
    background:linear-gradient(180deg, rgba(1,1,2,0.72) 0%, rgba(1,1,2,0.4) 100%);
    border-right:1px solid var(--border-glass);
    padding:48px 56px 56px;
  }
  @media (min-width:921px){.rg-summary{position:sticky;top:0;align-self:start;height:100vh;overflow-y:auto}}
  @media (max-width:920px){.rg-summary{padding:32px 24px;border-right:0;border-bottom:1px solid var(--border-glass)}}
  .rg-summary-inner{max-width:440px;margin:0 auto;display:flex;flex-direction:column;gap:28px}

  .rg-back{
    display:inline-flex;align-items:center;gap:8px;
    color:var(--text-2);font-size:14px;font-weight:500;text-decoration:none;
    width:fit-content;padding:6px 0;
    transition:color .25s, transform .25s;
  }
  .rg-back svg{width:18px;height:18px;transition:transform .25s}
  .rg-back:hover{color:var(--cream)}
  .rg-back:hover svg{transform:translateX(-3px)}

  .rg-merchant{display:flex;align-items:center;gap:12px}
  .rg-merchant-mark{
    width:38px;height:38px;border-radius:10px;
    background:linear-gradient(135deg, var(--copper) 0%, var(--gold) 100%);
    display:grid;place-items:center;
    font-family:'JetBrains Mono',monospace;font-weight:700;font-size:14px;
    color:var(--bg-deep);
    box-shadow:0 8px 22px rgba(155,27,48,.45), inset 0 1px 0 rgba(255,255,255,.4);
  }
  .rg-merchant-name{font-family:'Inter',sans-serif;font-weight:600;font-size:15px;color:var(--cream);letter-spacing:-0.01em}

  .rg-step-label{
    color:var(--text-3);font-size:14px;font-weight:500;margin:0;
    display:flex;align-items:center;gap:10px;
  }
  .rg-step-label .step-num{
    display:inline-grid;place-items:center;
    width:22px;height:22px;border-radius:50%;
    background:rgba(155,27,48,.15);
    border:1px solid rgba(155,27,48,.4);
    color:var(--copper-bright);
    font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700;
  }
  .rg-step-label strong{color:var(--cream);font-weight:600}

  .rg-price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:-8px}
  .rg-amount{
    font-family:'Inter',sans-serif;font-weight:700;
    font-size:56px;line-height:1;letter-spacing:-0.035em;color:var(--cream);
    display:inline-flex;align-items:baseline;
  }
  .rg-amount .ccy{font-size:32px;margin-right:4px;color:var(--copper-bright);font-weight:600}
  .rg-amount .decimals{font-size:32px;font-weight:600;color:var(--text-2);margin-left:2px}
  .rg-cycle-text{color:var(--text-2);font-size:15px;font-weight:500}
  @media (max-width:920px){
    .rg-amount{font-size:42px}
    .rg-amount .ccy, .rg-amount .decimals{font-size:24px}
  }

  .rg-lines{
    border-top:1px solid var(--border-glass);
    border-bottom:1px solid var(--border-glass);
    padding:20px 0;display:flex;flex-direction:column;gap:14px;
  }
  .rg-line{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;font-size:14px;color:var(--text-2)}
  .rg-line-name{display:flex;flex-direction:column;gap:2px}
  .rg-line-name strong{color:var(--cream);font-weight:600;font-size:14px}
  .rg-line-name span{color:var(--text-3);font-size:12px}
  .rg-line-amount{color:var(--cream);font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
  .rg-line-divider{height:1px;background:var(--border-glass);margin:2px 0}
  .rg-line-total{font-size:16px;color:var(--cream);font-weight:600}
  .rg-line-total .rg-line-amount{font-size:18px;font-weight:700;color:var(--copper-bright)}

  .rg-trial-badge{
    background:rgba(16,185,129,0.1);
    border:1px solid rgba(16,185,129,0.28);
    border-radius:var(--r-md);
    padding:14px 16px;
    display:flex;align-items:flex-start;gap:12px;
    color:#a7f3d0;font-size:13px;line-height:1.45;
  }
  .rg-trial-badge svg{width:18px;height:18px;flex-shrink:0;margin-top:1px;color:#10b981}
  .rg-trial-badge strong{color:#d1fae5;font-weight:600}

  .rg-change-link{color:var(--copper-bright);text-decoration:none;font-size:13px;font-weight:500;display:inline-flex;align-items:center;gap:6px}
  .rg-change-link:hover{color:var(--gold);text-decoration:underline}

  /* Colonne droite : formulaire */
  .rg-form-wrap{padding:48px 56px 56px;background:var(--bg-deep)}
  @media (max-width:920px){.rg-form-wrap{padding:32px 24px 56px}}
  .rg-form-inner{max-width:480px;margin:0 auto}

  .rg-head h1{
    font-family:'Inter',sans-serif;font-weight:700;
    font-size:clamp(26px,3vw,34px);
    letter-spacing:-0.025em;line-height:1.15;color:var(--cream);
    margin:0 0 8px;
  }
  .rg-head p{color:var(--text-2);font-size:15px;line-height:1.5;margin:0 0 32px}
  .rg-head p a{color:var(--copper-bright);text-decoration:none;font-weight:500}
  .rg-head p a:hover{color:var(--gold);text-decoration:underline}

  .rg-form{display:flex;flex-direction:column;gap:18px}
  .rg-field{display:flex;flex-direction:column;gap:7px}
  .rg-label{color:var(--cream);font-size:13px;font-weight:600;letter-spacing:-0.005em}
  .rg-input-wrap{position:relative}
  .rg-input{
    width:100%;
    padding:14px 16px;
    background:rgba(255,255,255,0.03);
    border:1.5px solid var(--border-glass);
    border-radius:var(--r-md);
    color:var(--cream);
    font-family:'Inter',sans-serif;font-size:15px;outline:none;
    transition:border-color .25s, background .25s, box-shadow .25s;
  }
  .rg-input::placeholder{color:var(--text-4)}
  .rg-input:focus{border-color:var(--copper-bright);background:rgba(255,255,255,0.05);box-shadow:0 0 0 3px rgba(155,27,48,0.18)}
  .rg-input.has-error{border-color:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,0.18)}
  .rg-hint{font-size:12px;color:var(--text-3);line-height:1.4}
  .rg-pwd-toggle{
    position:absolute;right:10px;top:50%;transform:translateY(-50%);
    width:36px;height:36px;border-radius:8px;
    background:transparent;border:none;cursor:pointer;
    color:var(--text-3);
    display:grid;place-items:center;
    transition:color .2s, background .2s;
  }
  .rg-pwd-toggle:hover{color:var(--cream);background:rgba(255,255,255,0.05)}
  .rg-pwd-toggle svg{width:18px;height:18px}

  .rg-pwd-strength{display:flex;gap:4px;margin-top:2px}
  .rg-pwd-strength span{flex:1;height:3px;border-radius:2px;background:rgba(255,255,255,0.08);transition:background .25s}
  .rg-pwd-strength.s1 span:nth-child(-n+1){background:#ef4444}
  .rg-pwd-strength.s2 span:nth-child(-n+2){background:#D5D9E0}
  .rg-pwd-strength.s3 span:nth-child(-n+3){background:#10b981}
  .rg-pwd-strength.s4 span{background:#10b981}

  .rg-checkbox{display:flex;align-items:flex-start;gap:11px;margin-top:6px}
  .rg-checkbox input{width:18px;height:18px;accent-color:var(--copper-bright);cursor:pointer;flex-shrink:0;margin-top:2px}
  .rg-checkbox label{color:var(--text-2);font-size:13px;line-height:1.5;cursor:pointer;user-select:none}
  .rg-checkbox a{color:var(--copper-bright);text-decoration:none;font-weight:500}
  .rg-checkbox a:hover{color:var(--gold);text-decoration:underline}

  .rg-submit{
    width:100%;
    display:inline-flex;align-items:center;justify-content:center;gap:12px;
    padding:18px 28px;
    border:none;border-radius:var(--r-md);
    background:linear-gradient(135deg, var(--copper) 0%, var(--copper-bright) 50%, var(--gold) 100%);
    color:var(--bg-deep);
    font-family:'Inter',sans-serif;font-size:16px;font-weight:700;letter-spacing:-0.01em;
    cursor:pointer;
    box-shadow:
      0 18px 44px -10px rgba(155,27,48,.55),
      0 4px 12px -4px rgba(155,27,48,.4),
      inset 0 1px 0 rgba(255,255,255,.4);
    transition:transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s, filter .25s;
    margin-top:8px;
  }
  .rg-submit:hover:not(:disabled){
    transform:translateY(-2px);
    box-shadow:
      0 26px 60px -10px rgba(155,27,48,.7),
      0 6px 18px -4px rgba(155,27,48,.5),
      inset 0 1px 0 rgba(255,255,255,.5);
    filter:brightness(1.05);
  }
  .rg-submit:active:not(:disabled){transform:translateY(0); transition-duration:.08s}
  .rg-submit:disabled, .rg-submit.is-loading{opacity:.7;cursor:wait}
  .rg-submit.is-loading{color:transparent !important;position:relative}
  .rg-submit.is-loading::after{
    content:'';position:absolute;top:50%;left:50%;
    width:22px;height:22px;margin:-11px 0 0 -11px;
    border:2.5px solid rgba(255,255,255,0.35);
    border-top-color:#ffffff;border-radius:50%;
    animation:rgSpin .7s linear infinite;
  }
  .rg-submit svg{width:18px;height:18px;flex-shrink:0}
  @keyframes rgSpin{to{transform:rotate(360deg)}}

  .rg-error{
    margin-top:12px;
    background:rgba(239,68,68,0.1);
    border:1px solid rgba(239,68,68,0.3);
    color:#fca5a5;
    border-radius:var(--r-md);
    padding:12px 14px;
    font-size:13px;line-height:1.45;
    display:none;
  }
  .rg-error.is-visible{display:block}

  /* Bloc actionnable "email déjà utilisé" — propose 2 actions concrètes
     plutôt qu'un constat passif (règle alertes proactives) */
  .rg-conflict{
    margin-top:14px;
    background:linear-gradient(180deg, rgba(155,27,48,0.10), rgba(155,27,48,0.04));
    border:1px solid rgba(155,27,48,0.4);
    border-radius:var(--r-md);
    padding:16px;
    display:none;
  }
  .rg-conflict.is-visible{display:block}
  .rg-conflict-title{
    display:flex;align-items:center;gap:10px;
    color:var(--copper-bright);
    font-family:'Inter',sans-serif;font-size:14px;font-weight:700;
    margin-bottom:6px;letter-spacing:-0.01em;
  }
  .rg-conflict-title svg{width:18px;height:18px;flex-shrink:0}
  .rg-conflict-text{color:var(--text-2);font-size:13px;line-height:1.55;margin:0 0 14px}
  .rg-conflict-text strong{color:var(--cream);font-weight:600}
  .rg-conflict-actions{display:flex;gap:10px;flex-wrap:wrap}
  .rg-conflict-btn{
    flex:1;min-width:140px;
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    padding:11px 16px;
    border-radius:var(--r-md);
    font-family:'Inter',sans-serif;font-size:13px;font-weight:600;letter-spacing:-0.005em;
    text-decoration:none;cursor:pointer;
    transition:transform .2s, box-shadow .2s, filter .2s;
    border:none;
  }
  .rg-conflict-btn.primary{
    background:linear-gradient(135deg, var(--copper) 0%, var(--gold) 100%);
    color:var(--bg-deep);
    box-shadow:0 8px 22px rgba(155,27,48,.35), inset 0 1px 0 rgba(255,255,255,.4);
  }
  .rg-conflict-btn.primary:hover{transform:translateY(-1px);filter:brightness(1.05)}
  .rg-conflict-btn.ghost{
    background:rgba(255,255,255,0.04);
    border:1px solid var(--border-glass);
    color:var(--cream);
  }
  .rg-conflict-btn.ghost:hover{background:rgba(255,255,255,0.07);border-color:var(--border-glass-hover)}
  .rg-conflict-btn svg{width:14px;height:14px}

  .rg-secure{display:flex;align-items:center;justify-content:center;gap:8px;margin:14px 0 0;color:var(--text-3);font-size:12px}
  .rg-secure svg{width:14px;height:14px;color:var(--text-3)}
  .rg-secure strong{color:#635bff;font-weight:700;letter-spacing:-0.01em}

  body > .ck-header{display:none !important}