/* ============================================================
   MOBILE PREMIUM v12 — COUCHE DÉFINITIVE (chargée en dernier)
   Direction artistique mobile : aérée, hiérarchique, tactile.
   ============================================================ */

@media (max-width: 1023px) {
  /* ---- Base ---- */
  html { -webkit-text-size-adjust: 100%; }
  body { padding-top: 68px; overflow-x: hidden; }
  .nav { height: 68px; }
  .nav-symbol { height: 28px; }
  .nav-word { font-size: .66rem; letter-spacing: .18em; }

  /* ---- Typographie fluide ---- */
  .label { font-size: .72rem; letter-spacing: .18em; margin-bottom: 1rem; }
  .headline { font-size: clamp(1.45rem, 6.2vw, 2rem); line-height: 1.14; letter-spacing: .015em; }
  .doctrine { font-size: 1.12rem; line-height: 1.55; }
  .doctrine.big { font-size: 1.18rem; }
  .hero .headline { font-size: clamp(1.75rem, 8.2vw, 2.5rem); letter-spacing: .01em; }

  /* ---- Rythme des sections : une seule échelle ---- */
  .sec { padding: 3.25rem 5%; }
  .hero { min-height: 82svh; padding: 3.5rem 5% 2.75rem; }
  .hero-watermark svg { height: 38vh; }
  .hero-source { letter-spacing: .2em; font-size: .68rem; }
  .hero-sub { font-size: .95rem; line-height: 1.7; margin-top: 1.1rem; }
  .hairline { margin: 1.25rem 0 2rem; }
  .hairline-c { margin: 1.35rem auto; }

  /* ---- Boutons : pleine largeur, zones tactiles 52px ---- */
  .btn-gold, .btn-outline { width: 100%; min-height: 52px; padding: 1rem 1.5rem; font-size: .8rem; }
  .hero-ctas { flex-direction: column; align-items: stretch; gap: .75rem; max-width: 360px; margin: 1.75rem auto 0; }
  .doc-foot .btn-sm, .art-share .btn-sm { width: auto; min-height: 40px; }

  /* ---- Cartes & panneaux ---- */
  .card-panel, .doc { padding: 1.4rem; }
  .grid { gap: 1.1rem; }
  .card-index { margin-bottom: .9rem; }
  .card-panel p, .tier-feats li { font-size: .9rem; }
  .tier-price .price { font-size: 1.8rem; }
  .tier-feats { gap: .7rem; margin-bottom: 1.75rem; }
  .doc-body { font-size: .94rem; line-height: 1.8; }
  .doc-quote { font-size: 1.08rem; }

  /* ---- Étapes / chiffres / confiance ---- */
  .steps { gap: 1.4rem; }
  .step { padding-top: 1rem; }
  .step-n { margin-bottom: .6rem; }
  .band { padding: 2.75rem 5%; }
  .band-grid { grid-template-columns: 1fr 1fr; gap: 1.5rem; }
  .band-n { font-size: 1.9rem; margin-bottom: .5rem; }
  .band-l { font-size: .68rem; }
  .trust { padding: 2.25rem 5%; }
  .trust-row { gap: .7rem 1.5rem; }
  .stats-grid { gap: .7rem; }

  /* ---- Tableau comparatif → fiche technique élégante ---- */
  .table-scroll { overflow: visible; }
  .cmp, .cmp tbody, .cmp tr, .cmp td { display: block; width: 100%; min-width: 0; }
  .cmp thead { display: none; }
  .cmp { border: none; }
  .cmp tr { background: var(--ink); border: 1px solid var(--line); margin-bottom: .9rem; padding: .25rem 0; }
  .cmp td { border-top: none; padding: .55rem 1.1rem; text-align: left; }
  .cmp td.feat { background: rgba(201,168,76,.07); font-weight: 600; color: var(--paper); padding: .75rem 1.1rem; }
  .cmp td.feat::before { content: "◆"; color: var(--gold); margin-right: .6rem; font-size: .7rem; }
  .cmp td:not(.feat) { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
  .cmp td:not(.feat)::before { content: attr(data-label); font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--grey); }
  .cmp td.hl { background: rgba(201,168,76,.09); border-left: 2px solid var(--gold); }
  .footnote { font-size: .74rem; }

  /* ---- FAQ ---- */
  .faq-item summary { padding: 1.15rem 0; font-size: .88rem; gap: 1rem; }
  .faq-a { font-size: .9rem; }

  /* ---- Advantage / CTA ---- */
  .adv-watermark svg { height: 55vh; }
  .adv-answer { font-size: .98rem; }
  .cta-symbol svg { height: 42px; }
  .cta-symbol { margin-bottom: 1.5rem; }
  .cta-sub { margin-bottom: 2rem; }

  /* ---- Articles ---- */
  .art-grid { gap: 1.1rem; }
  .art-body { font-size: .98rem; line-height: 1.85; }
  .art-body blockquote { font-size: 1.1rem; margin: 1.75rem 0; padding-left: 1.25rem; }
  .art-body h2 { margin: 2rem 0 1rem; }
  .art-share { gap: .5rem; }

  /* ---- Image + texte / détails produit & briefing ---- */
  .tcol { gap: 1.75rem; }
  .tcol-media img { aspect-ratio: 4/3; object-fit: cover; }
  .tcol-body { font-size: .95rem; }

  /* ---- Formulaires : 16px (anti-zoom iOS), empilés ---- */
  input, select, textarea { font-size: 16px; }
  .nl-form { flex-direction: column; }
  .nl-form input, .nl-form .btn-gold { width: 100%; }
  .form .btn-gold { width: 100%; }
  .nl-sub { margin-bottom: 1.5rem; }

  /* ---- Menu plein écran : symbole en filigrane + liens royaux ---- */
  .nav-links {
    background: var(--onyx) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 248'%3E%3Cpath d='M52,28 L150,22 L160,32 L170,72 L190,98 L171,114 L150,152 L140,188 L121,216 L107,234 L95,212 L83,176 L88,136 L77,123 L43,119 L29,96 L40,60 Z' fill='%23FFFFFF' fill-opacity='0.035'/%3E%3Cpath d='M163,30 L174,72 L196,100 L177,118 L156,156 L147,191 L128,219 L113,240' fill='none' stroke='%23C9A84C' stroke-opacity='0.12' stroke-width='9' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center 72% / 46vh;
  }
  .nav-link { font-size: 1.28rem; font-weight: 700; letter-spacing: .05em; }
  .nav-links .nav-lang { align-self: flex-start; }

  /* ---- Bandeau RGPD au-dessus de la barre CTA ---- */
  #rgpd { bottom: calc(70px + env(safe-area-inset-bottom)); left: 12px; right: 12px; }

  /* ---- Barre CTA collante (conversion mobile premium) ---- */
  .sticky-cta {
    display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
    background: rgba(10,10,10,.97); border-top: 1px solid rgba(201,168,76,.4);
    padding: .7rem 5% calc(.7rem + env(safe-area-inset-bottom));
  }
  .sticky-cta .btn-gold { min-height: 48px; }

  /* ---- Espace membre / boutique ---- */
  .card-panel[style*="justify-content:space-between"] { flex-direction: column; align-items: stretch !important; }
  .card-panel[style*="justify-content:space-between"] > div:last-child { align-items: stretch !important; }
  .card-panel[style*="justify-content:space-between"] .btn-gold { width: 100%; }

  /* ---- Footer ---- */
  .footer { padding: 3rem 5% 0; }
  .footer-top { gap: 2rem; padding-bottom: 2.5rem; }
  .footer-bottom { flex-direction: column; align-items: center; gap: .6rem; text-align: center; padding-bottom: calc(1.25rem + env(safe-area-inset-bottom)); }
  .footer-legal { gap: 1rem; }
}

@media (min-width: 1024px) {
  .sticky-cta { display: none; }
}

@media (max-width: 380px) {
  .headline { font-size: 1.35rem; }
  .hero .headline { font-size: 1.6rem; }
  .band-grid { grid-template-columns: 1fr 1fr; gap: 1.1rem; }
}


/* ---- Sous-menus mobile : ligne tactile dédiée (lien + bouton flèche) ---- */
@media (max-width: 1023px) {
  .nav-row { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
  .nav-caret-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 48px; height: 48px; flex-shrink: 0;
    background: none; border: 1px solid var(--slate); color: var(--gold);
    font-size: 1.05rem; cursor: pointer; transition: all .2s;
  }
  .nav-caret-btn:hover { border-color: var(--gold); }
  .nav-item.open .nav-caret-btn { border-color: var(--gold); background: rgba(201,168,76,.1); transform: rotate(180deg); }
  .nav-item.open > .nav-drop { display: block; }
  .nav-drop { border-left: 2px solid rgba(201,168,76,.35); margin-left: .4rem; }
}
@media (min-width: 1024px) {
  .nav-caret-btn { display: none; }
  .nav-row { display: inline; }
}


/* ---- FIX DÉFINITIF — sous-menus mobile (écrase toute règle desktop résiduelle) ---- */
@media (max-width: 1023px) {
  .nav-item > .nav-drop,
  .nav-drop {
    position: static !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    translate: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    min-width: 0 !important;
    width: auto !important;
    background: transparent !important;
    border: none !important;
    border-left: 2px solid rgba(201,168,76,.4) !important;
    margin: .3rem 0 .6rem 1.1rem !important;
    padding: .15rem 0 !important;
    box-shadow: none !important;
    display: none;
  }
  .nav-item.open > .nav-drop { display: block !important; }
  .nav-drop-link {
    display: block !important;
    padding: .75rem 1rem !important;
    font-size: .95rem !important;
    white-space: normal !important;
    text-align: left !important;
  }
  .nav-drop-link:hover, .nav-drop-link.active {
    background: rgba(201,168,76,.08) !important;
    border-left: 2px solid var(--gold) !important;
  }
}