/* =================================================================
   Martin BTC — Acces aux outils liberte (2026-10-28)
   - Page de deverrouillage, servie par outils/acces.php a l'adresse de
     chaque outil liberte tant que le visiteur n'a pas saisi son code, et
     page /outils/acces (lien de la derniere page de l'ebook).
   - Pastille « Avec l'ebook » des cartes de l'accueil et de /outils/.
   Fichier a part : modifier style.css ou outils.css aurait oblige a changer
   le ?v= de toutes les pages qui les chargent.
   ================================================================= */

/* ---------- 1. Mention au-dessus du titre ---------- */
.acces-kicker { display: flex; margin-top: 1rem; }
.acces-kicker + h1 { margin-top: 0.55rem; }

/* ---------- 2. Les deux cartes ---------- */
.acces { padding-top: clamp(0.4rem, 1.5vw, 1rem); }
.acces-grille {
  display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: var(--gap); align-items: stretch;
}
.acces-carte {
  border: 1px solid var(--line-2); border-radius: var(--radius-lg);
  padding: clamp(1.3rem, 3.5vw, 2rem);
  background: linear-gradient(180deg, var(--surface), var(--bg-2));
}
.acces-carte h2 { margin: 0; }
.acces-carte p { color: var(--muted); }
.acces-carte p a, .acces-gratuit a, .acces-mail a {
  color: var(--orange-2); text-decoration: underline; text-decoration-thickness: 1px;
  text-underline-offset: 0.18em; text-decoration-color: rgba(247, 147, 26, 0.55);
}

/* Carte « J'ai l'ebook » */
.acces-carte--code { display: flex; flex-direction: column; }
.acces-icone {
  display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px;
  border-radius: 14px; border: 1px solid var(--orange-line); background: var(--orange-soft);
  color: var(--orange-2); margin-bottom: 1rem;
}
.acces-icone svg { width: 22px; height: 22px; }
.acces-carte--code > p { margin-top: 0.5rem; }
.acces-form { display: grid; gap: 0.9rem; margin-top: 1.3rem; }
.acces-form input {
  font-family: var(--font-mono); font-size: 1.05rem; letter-spacing: 0.08em; text-transform: uppercase;
}
.acces-form input::placeholder { color: var(--muted-2); opacity: 1; }
.acces-form .btn { justify-self: start; }
.acces-erreur {
  border-left: 3px solid #F2555A; background: rgba(242, 85, 90, 0.1); color: var(--text);
  padding: 0.7rem 0.9rem; border-radius: 0 10px 10px 0; font-size: 0.92rem; line-height: 1.5;
}
.acces-form input[aria-invalid="true"] { border-color: #F2555A; }

/* Carte « Pas encore l'ebook ? » : l'offre, mise en avant comme le parcours */
.acces-carte--achat {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1.2rem 1.5rem; align-items: start;
  border-color: var(--orange-line);
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(247, 147, 26, 0.16), rgba(247, 147, 26, 0.03) 60%),
    linear-gradient(180deg, var(--surface), var(--bg-2));
  box-shadow: var(--shadow);
}
.acces-livres { display: flex; gap: 0.6rem; }
.acces-livres img {
  width: 132px; height: auto; border-radius: 6px;
  box-shadow: 0 18px 40px -16px rgba(0, 0, 0, 0.85), 0 0 0 1px rgba(255, 255, 255, 0.07);
}
/* Page anglaise : les deux editions, cote a cote */
.acces-livres--en img { width: 96px; }
.acces-livre-nom { font-family: var(--font-display); font-weight: 600; color: var(--text) !important; margin-top: 0.35rem; }
.acces-achat-corps > p:not(.acces-livre-nom) { margin-top: 0.6rem; }
.acces-liste { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: 0.5rem; }
.acces-liste li { position: relative; padding-left: 1.7rem; color: var(--text); font-size: 0.95rem; line-height: 1.5; }
.acces-liste li::before {
  content: ""; position: absolute; left: 0; top: 0.2em; width: 1.1rem; height: 1.1rem; border-radius: 50%;
  background: var(--orange-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFB347' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center / 0.7rem no-repeat;
  border: 1px solid var(--orange-line);
}
.acces-boutons { display: grid; gap: 0.7rem; justify-items: start; margin-top: 1.4rem; }
/* Libelles longs (« Acheter l'ebook + l'acces aux outils ») : retour a la ligne
   permis, sinon le bouton elargit toute la grille au telephone. */
.acces-boutons .btn { white-space: normal; text-align: left; line-height: 1.25; }
.acces-prix { font-family: var(--font-display); font-size: 1.6rem; font-weight: 700; color: var(--text) !important; line-height: 1; }
.acces-mail { font-size: 0.86rem; margin-top: 0.8rem; }

.acces-gratuit { margin-top: 1.5rem; color: var(--muted); font-size: 0.93rem; max-width: 72ch; }

/* Page « C'est debloque » : la grille des outils reprise de /outils/ */
.acces-ok { padding-top: 0.6rem; }

@media (max-width: 900px) {
  .acces-grille { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
  .acces-carte--achat { grid-template-columns: minmax(0, 1fr); }
  .acces-livres img { width: 116px; }
  .acces-livres--en img { width: 96px; }
  .acces-form .btn, .acces-boutons .btn { justify-self: stretch; justify-content: center; text-align: center; }
  .acces-boutons { justify-items: stretch; }
}

/* ---------- 3. Pastille « Avec l'ebook » (accueil, /outils/) ---------- */
.badge-ebook {
  display: inline-flex; align-items: center; gap: 0.35rem; white-space: nowrap;
  font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; line-height: 1;
  color: var(--orange-2); border: 1px solid var(--orange-line); background: var(--orange-soft);
  border-radius: 999px; padding: 0.32rem 0.6rem;
}
.badge-ebook svg { width: 0.95em; height: 0.95em; flex-shrink: 0; }
/* Sur une carte : en haut a droite, a hauteur de l'icone */
.card > .badge-ebook { position: absolute; top: 1.35rem; right: 1.35rem; }
/* Dans le bloc du parcours : sous les quatre etapes */
.tools-plan-ebook { margin-top: 0.9rem; }
