:root {
      --green:  #2d7a1f;
      --green2: #4caf2a;
      --red:    #c0392b;
      --yellow: #f9c923;
      --cream:  #fffbea;
      --dark:   #1a1a1a;
      --white:  #ffffff;
    }
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    body { font-family: 'Nunito', sans-serif; background: var(--cream); color: var(--dark); overflow-x: hidden; }

    #page-accueil    { display: block; }
    #page-formulaire { display: none;  }

    /* ── HERO ── */
    .hero {
      min-height: 100vh;
      background: linear-gradient(160deg, #e8f5e2 0%, #fffbea 50%, #fff3cd 100%);
      display: flex; flex-direction: column; align-items: center;
      justify-content: center; text-align: center;
      padding: 60px 20px 80px; position: relative;
    }
    .hero::before, .hero::after { content:''; position:absolute; border-radius:50%; opacity:.12; }
    .hero::before { width:500px; height:500px; background:var(--green2); top:-120px; left:-120px; }
    .hero::after  { width:350px; height:350px; background:var(--red); bottom:-80px; right:-80px; }

    .badge {
      display:inline-block; background:var(--green2); color:var(--white);
      font-size:.8rem; font-weight:800; letter-spacing:2px; text-transform:uppercase;
      padding:6px 20px; border-radius:50px; margin-bottom:24px;
      animation:fadeDown .6s ease both;
    }
    .hero h1 {
      font-family:'Playfair Display',serif; font-size:clamp(2.2rem,6vw,4rem);
      font-weight:900; line-height:1.15; color:var(--green); max-width:720px;
      animation:fadeDown .7s .1s ease both;
    }
    .hero h1 span { color:var(--red); }
    .welcome-text {
      margin-top:22px; font-size:clamp(1rem,2.5vw,1.2rem); font-weight:600;
      color:#555; max-width:580px; line-height:1.7;
      animation:fadeDown .7s .2s ease both;
    }
    .logo-wrapper { margin-top:36px; animation:fadeDown .7s .3s ease both; }
    .logo-circle {
      width:140px; height:140px; border-radius:50%;
      border:5px solid var(--green2);
      box-shadow:0 8px 32px rgba(76,175,42,.25), 0 2px 8px rgba(0,0,0,.1);
      object-fit:cover; background:#fff; display:block;
    }

    /* ── SECTIONS ── */
    section { padding:70px 20px; }
    .container { max-width:860px; margin:0 auto; }
    .section-title {
      font-family:'Playfair Display',serif; font-size:clamp(1.6rem,4vw,2.4rem);
      color:var(--green); margin-bottom:32px; text-align:center; position:relative;
    }
    .section-title::after {
      content:''; display:block; width:60px; height:4px;
      background:var(--yellow); border-radius:4px; margin:10px auto 0;
    }

    /* ── INFOS CLÉS ── */
    .info-section { background:var(--white); }
    .cards-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; }
    .card {
      background:linear-gradient(135deg,#f0fbe8,#fffbea); border:2px solid #d4edba;
      border-radius:18px; padding:28px 22px; text-align:center;
      transition:transform .25s, box-shadow .25s;
    }
    .card:hover { transform:translateY(-4px); box-shadow:0 12px 32px rgba(45,122,31,.12); }
    .card-icon  { font-size:2.2rem; margin-bottom:12px; }
    .card-label { font-size:.75rem; font-weight:800; letter-spacing:1.5px; text-transform:uppercase; color:var(--green2); margin-bottom:6px; }
    .card-value { font-size:1.05rem; font-weight:700; color:var(--dark); }

    /* ── MODULES ── */
    .modules-section { background:linear-gradient(135deg,#1e5c10,#2d7a1f); }
    .modules-section .section-title { color:var(--yellow); }
    .modules-section .section-title::after { background:var(--white); }
    .modules-list { list-style:none; display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; }
    .modules-list li {
      background:rgba(255,255,255,.1); border:1.5px solid rgba(255,255,255,.2);
      border-radius:14px; padding:18px 22px; color:var(--white);
      font-size:1rem; font-weight:600; display:flex; align-items:center; gap:12px;
      backdrop-filter:blur(4px); transition:background .2s;
    }
    .modules-list li:hover { background:rgba(255,255,255,.18); }
    .modules-list li::before { content:'🍃'; font-size:1.3rem; flex-shrink:0; }

    /* ── PRIX ── */
    .price-section { background:var(--cream); }
    .price-box {
      background:var(--white); border-radius:24px; border:3px solid var(--green2);
      padding:40px 36px; text-align:center; box-shadow:0 12px 40px rgba(45,122,31,.1);
      max-width:640px; margin:0 auto;
    }
    .price-amount { font-family:'Playfair Display',serif; font-size:clamp(2.4rem,6vw,3.4rem); font-weight:900; color:var(--red); margin-bottom:6px; }
    .price-sub  { font-size:.95rem; color:#666; margin-bottom:28px; }
    .price-nb   { background:#fff8e1; border-left:4px solid var(--yellow); border-radius:8px; padding:14px 18px; font-size:.92rem; color:#555; text-align:left; margin-bottom:24px; line-height:1.7; }
    .price-nb strong { color:var(--dark); }
    .payment-methods { display:flex; flex-direction:column; gap:12px; text-align:left; }
    .payment-item { background:linear-gradient(90deg,#f0fbe8,#fffbea); border:1.5px solid #c8e6b0; border-radius:12px; padding:14px 20px; font-size:.95rem; font-weight:600; color:var(--dark); }
    .payment-item span { color:var(--green); font-weight:800; }
    .whatsapp-note { margin-top:20px; background:#e8f5e2; border-radius:12px; padding:14px 20px; font-size:.92rem; color:#2d7a1f; font-weight:700; display:flex; align-items:center; gap:10px; }

    /* ── MODALITÉS ── */
    .modalities-section { background:var(--white); }
    .modalities-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; }
    .modality-card { border-radius:16px; padding:28px 22px; text-align:center; }
    .modality-card.green  { background:linear-gradient(135deg,#2d7a1f,#4caf2a); color:#fff; }
    .modality-card.red    { background:linear-gradient(135deg,#c0392b,#e74c3c); color:#fff; }
    .modality-card.yellow { background:linear-gradient(135deg,#f0a500,#f9c923); color:#1a1a1a; }
    .modality-card-icon { font-size:2.4rem; margin-bottom:12px; }
    .modality-card h3 { font-size:1rem; font-weight:800; margin-bottom:8px; }
    .modality-card p  { font-size:.9rem; line-height:1.6; opacity:.9; }

    /* ── CTA ── */
    .cta-section { background:linear-gradient(135deg,#e8f5e2,#fffbea); text-align:center; padding:80px 20px; }
    .cta-section p { font-size:1.1rem; color:#555; margin-bottom:32px; max-width:520px; margin-left:auto; margin-right:auto; }

    /* ── BOUTON S'INSCRIRE ── */
    .btn-register {
      display:inline-block; background:linear-gradient(135deg,#1565c0,#1e88e5);
      color:var(--white); font-family:'Nunito',sans-serif; font-size:1.15rem;
      font-weight:800; padding:18px 52px; border-radius:50px; border:none;
      cursor:pointer; box-shadow:0 8px 28px rgba(21,101,192,.35);
      transition:transform .2s, box-shadow .2s; letter-spacing:.5px;
      text-decoration:none;
    }
    .btn-register:hover { transform:translateY(-3px) scale(1.03); box-shadow:0 14px 36px rgba(21,101,192,.45); }

    /* ── BOUTON HERO (sous logo) ── */
    .btn-hero {
      margin-top: 28px;
      opacity: 1 !important;
      transform: none !important;
      -webkit-tap-highlight-color: transparent;
      touch-action: manipulation;
      font-size: 1rem;
      padding: 16px 36px;
    }

    /* ── FOOTER ── */
    footer { background:var(--dark); color:rgba(255,255,255,.6); text-align:center; padding:28px 20px; font-size:.85rem; }
    footer strong { color:var(--yellow); }

    /* ── PAGE FORMULAIRE ── */
    #page-formulaire {
      min-height:100vh;
      background:linear-gradient(160deg,#e8f5e2 0%,#fffbea 60%,#fff3cd 100%);
      flex-direction:column; align-items:center; justify-content:center; padding:40px 20px;
    }
    #page-formulaire.active { display:flex; }

    .back-link {
      align-self:flex-start; margin-bottom:20px; font-size:.9rem; font-weight:700;
      color:var(--green); background:none; border:none; cursor:pointer;
      display:flex; align-items:center; gap:6px;
      transition:color .2s; font-family:'Nunito',sans-serif;
    }
    .back-link:hover { color:var(--green2); }

    .form-card {
      background:var(--white); border-radius:28px;
      box-shadow:0 16px 60px rgba(45,122,31,.13);
      padding:48px 40px; max-width:540px; width:100%;
    }
    .form-card-header { text-align:center; margin-bottom:36px; }
    .form-card-header .emoji { font-size:2.8rem; display:block; margin-bottom:12px; }
    .form-card-header h1 { font-family:'Playfair Display',serif; font-size:clamp(1.6rem,4vw,2rem); color:var(--green); margin-bottom:10px; }
    .form-card-header p { font-size:.97rem; color:#666; line-height:1.65; }

    .form-group { margin-bottom:22px; }
    label { display:block; font-size:.88rem; font-weight:800; text-transform:uppercase; letter-spacing:1px; color:var(--green); margin-bottom:8px; }
    input {
      width:100%; padding:14px 18px; border:2px solid #d4edba; border-radius:12px;
      font-family:'Nunito',sans-serif; font-size:1rem; font-weight:600;
      color:var(--dark); background:#f8fdf5;
      transition:border-color .2s, box-shadow .2s; outline:none;
    }
    input:focus { border-color:var(--green2); box-shadow:0 0 0 3px rgba(76,175,42,.15); background:var(--white); }
    input::placeholder { color:#aaa; font-weight:400; }

    .btn-submit {
      width:100%; background:linear-gradient(135deg,#1b7a0d,#2d7a1f,#4caf2a);
      color:var(--white); font-family:'Nunito',sans-serif; font-size:1.1rem;
      font-weight:800; padding:17px; border:none; border-radius:50px; cursor:pointer;
      box-shadow:0 8px 28px rgba(45,122,31,.35); transition:transform .2s, box-shadow .2s;
      margin-top:10px; letter-spacing:.4px;
    }
    .btn-submit:hover  { transform:translateY(-3px) scale(1.02); box-shadow:0 14px 36px rgba(45,122,31,.45); }
    .btn-submit:active { transform:scale(.98); }

    .success-msg {
      display:none; margin-top:24px;
      background:linear-gradient(135deg,#e8f5e2,#f0fbe8);
      border:2px solid var(--green2); border-radius:16px;
      padding:24px 22px; text-align:center;
    }
    .success-msg .check { font-size:2.6rem; display:block; margin-bottom:10px; }
    .success-msg p { font-size:1rem; font-weight:700; color:var(--green); line-height:1.7; }
    .dismiss-btn {
      margin-top:16px; display:inline-block; background:var(--green2);
      color:var(--white); font-family:'Nunito',sans-serif; font-size:.9rem;
      font-weight:800; padding:10px 28px; border:none; border-radius:50px;
      cursor:pointer; transition:background .2s;
    }
    .dismiss-btn:hover { background:var(--green); }

    .spinner {
      display:none; width:22px; height:22px;
      border:3px solid rgba(255,255,255,.4); border-top-color:var(--white);
      border-radius:50%; animation:spin .7s linear infinite; margin:0 auto;
    }
    @keyframes spin { to { transform:rotate(360deg); } }

    .error-msg {
      display:none; margin-top:16px; background:#fdecea;
      border:2px solid var(--red); border-radius:12px; padding:14px 18px;
      color:var(--red); font-weight:700; font-size:.92rem; text-align:center;
    }

    @keyframes fadeDown {
      from { opacity:0; transform:translateY(-20px); }
      to   { opacity:1; transform:translateY(0); }
    }

    @media (max-width:500px) {
      .form-card { padding:32px 22px; }
      .btn-register { padding:16px 32px; font-size:1rem; }
    }