@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400..600;1,9..144,400..600&family=Plus+Jakarta+Sans:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');
:root {
  --bg:       #F7F3EA;
  --bg2:      #F1ECDD;
  --bg3:      #EFE9D8;
  --surface:  #FFFFFF;
  --surface2: #FBF0DC;
  --border:   rgba(27,42,34,0.1);
  --border2:  rgba(27,42,34,0.16);
  --text:     #1B2A22;
  /* Contrastes vérifiés sur le fond ivoire #F7F3EA (norme WCAG AA = 4,5:1 min) :
     --text2 5,4:1 · --text3 4,8:1. L'ancien --text3 (#A3A99A) plafonnait à
     2,18:1, sous le seuil : il était illisible pour beaucoup de lecteurs. */
  --text2:    #5E6659;
  --text3:    #666E61;
  --accent:   #1B2A22;
  --accent2:  #2F6B4F;
  --accent3:  rgba(27,42,34,0.08);
  --gold:     #C9962C;
  --gold2:    rgba(201,150,44,0.14);
  --green:    #2F6B4F;
  --green2:   rgba(47,107,79,0.12);
  --coral:    #B5442E;
  --coral2:   rgba(181,68,46,0.12);
  --blue:     #4C6B8A;
  --blue2:    rgba(76,107,138,0.12);
  --pink:     #9C5B7A;
  --pink2:    rgba(156,91,122,0.12);
  --teal:     #3F7D6E;
  --teal2:    rgba(63,125,110,0.12);
  --purple:   #7D5A8C;
  --purple2:  rgba(125,90,140,0.12);
  --r:        12px;
  --r2:       8px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

body {
  font-family: 'Plus Jakarta Sans', sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.65;
  min-height: 100vh;
  overflow-x: hidden;
}

/* ── FOND ANIMÉ ── */
.bg-grid {
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(47,107,79,0.05) 1px, transparent 1px);
  background-size: 100% 32px;
}
.bg-glow1, .bg-glow2 {
  position: fixed; border-radius: 50%;
  filter: blur(100px); pointer-events: none; z-index: 0;
}
.bg-glow1 { width: 600px; height: 600px; background: rgba(91,110,245,0.08); top: -200px; right: -150px; }
.bg-glow2 { width: 500px; height: 500px; background: rgba(34,211,160,0.05); bottom: -100px; left: -100px; }

/* ── NAV ── */
.nav {
  position: sticky; top: 0; z-index: 100;
  background: rgba(8,11,16,0.85);
  backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border);
  padding: 0 32px;
}
.nav-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; height: 58px; gap: 4px;
}
.nav-logo {
  font-family: 'Fraunces', serif;
  font-size: 1.3rem; font-weight: 600;
  color: var(--text); letter-spacing: -0.5px;
  margin-right: 16px; white-space: nowrap;
}
.nav-logo em { color: var(--accent2); font-style: italic; }
.nav-tab {
  background: none; border: none; cursor: pointer;
  font-family: 'Cabinet Grotesk', sans-serif;
  font-size: 13px; font-weight: 700;
  color: var(--text3); padding: 6px 14px;
  border-radius: 6px; transition: all .18s;
  white-space: nowrap; letter-spacing: .3px;
}
.nav-tab:hover { color: var(--text2); background: var(--surface); }
.nav-tab.active { color: var(--text); background: var(--surface2); }
.nav-tab.t-exam.active { color: var(--coral); }
.nav-tab.t-tarif.active { color: var(--gold); }
.nav-sep { width: 1px; height: 20px; background: var(--border); margin: 0 4px; }
.nav-auth { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.btn-connect {
  background: var(--accent); color: white; border: none;
  border-radius: var(--r2); padding: 7px 18px;
  font-family: 'Cabinet Grotesk', sans-serif;
  font-size: 13px; font-weight: 700; cursor: pointer;
  transition: all .18s; white-space: nowrap;
}
.btn-connect:hover { background: var(--accent2); transform: translateY(-1px); }
.nav-user { display: none; align-items: center; gap: 10px; }
.nav-user.show { display: flex; }
.nav-avatar {
  width: 34px; height: 34px; border-radius: 50%;
  background: linear-gradient(135deg, var(--accent), var(--green));
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 800; color: white;
  cursor: pointer; flex-shrink: 0; border: 2px solid var(--border2);
}
.nav-user-name { font-size: 13px; font-weight: 700; color: var(--text); cursor: pointer; }
.nav-plan {
  font-size: 12px; font-weight: 700; padding: 2px 7px;
  border-radius: 20px; display: block;
}
.plan-free { background: var(--surface2); color: var(--text3); }
.plan-essentiel { background: var(--green2); color: var(--green); }
.plan-premium { background: var(--gold2); color: var(--gold); }
.plan-ultime { background: var(--accent3); color: var(--accent2); }
.btn-logout {
  background: none; border: 1px solid var(--border);
  border-radius: var(--r2); padding: 5px 11px;
  font-family: 'Cabinet Grotesk', sans-serif;
  font-size: 12px; font-weight: 700; color: var(--text3);
  cursor: pointer; transition: all .18s;
}
.btn-logout:hover { border-color: var(--coral); color: var(--coral); }

/* ── PAGES ── */
.wrap { max-width: 1200px; margin: 0 auto; padding: 40px 32px 80px; position: relative; z-index: 10; }
.page { display: none; }
.page.active { display: block; animation: fadeUp .25s ease; }
@keyframes fadeUp { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }

/* ── HERO ── */
.hero {
  padding: 56px 0 48px;
  display: grid; grid-template-columns: 1fr auto;
  align-items: center; gap: 40px;
}
.hero-badge {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--accent3); border: 1px solid rgba(91,110,245,0.2);
  color: var(--accent2); font-size: 12.5px; font-weight: 700;
  padding: 4px 12px; border-radius: 20px;
  letter-spacing: 1px; text-transform: uppercase;
  margin-bottom: 16px;
}
.hero-badge::before { content: '●'; font-size: 8px; animation: pulse 2s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.3} }
.hero h1 {
  font-family: 'Fraunces', serif;
  font-size: clamp(2rem, 4.5vw, 3.2rem);
  font-weight: 300; line-height: 1.15;
  color: var(--text); letter-spacing: -1px;
  margin-bottom: 16px;
}
.hero h1 em { font-style: italic; color: var(--accent2); font-weight: 300; }
.hero h1 strong { font-weight: 600; color: var(--green); }
.hero-sub { font-size: 15px; color: var(--text2); max-width: 520px; line-height: 1.8; margin-bottom: 28px; }
.hero-stats { display: flex; gap: 28px; flex-wrap: wrap; }
.hstat { display: flex; flex-direction: column; gap: 2px; }
.hstat-n {
  font-family: 'JetBrains Mono', monospace;
  font-size: 1.8rem; font-weight: 500;
  color: var(--text); letter-spacing: -2px; line-height: 1;
}
.hstat-l { font-size: 12.5px; color: var(--text3); text-transform: uppercase; letter-spacing: 1.5px; }
.hero-right { display: flex; flex-direction: column; gap: 10px; flex-shrink: 0; }
.hero-card-mini {
  background: var(--surface); border: 1px solid var(--border2);
  border-radius: var(--r); padding: 14px 18px;
  display: flex; align-items: center; gap: 12px;
  min-width: 200px;
}
.hcm-icon { font-size: 20px; flex-shrink: 0; }
.hcm-text { font-size: 12px; font-weight: 700; color: var(--text2); }
.hcm-val { font-size: 18px; font-weight: 800; color: var(--text); }

/* ── WELCOME CONNECTÉ ── */
.welcome-bar {
  background: linear-gradient(135deg, var(--surface) 0%, rgba(91,110,245,0.08) 100%);
  border: 1px solid rgba(91,110,245,0.15);
  border-radius: var(--r); padding: 20px 24px;
  margin-bottom: 36px;
  display: none; align-items: center; gap: 20px;
}
.welcome-bar.show { display: flex; }
.wb-avatar {
  width: 48px; height: 48px; border-radius: 50%;
  background: linear-gradient(135deg, var(--accent), var(--green));
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 800; color: white; flex-shrink: 0;
}
.wb-text h3 { font-size: 16px; font-weight: 800; color: var(--text); margin-bottom: 2px; }
.wb-text p { font-size: 13px; color: var(--text3); }
.wb-stats { margin-left: auto; display: flex; gap: 20px; }
.wb-stat { text-align: center; }
.wb-stat-n { font-family: 'JetBrains Mono', monospace; font-size: 1.4rem; font-weight: 500; color: var(--text); }
.wb-stat-l { font-size: 12px; color: var(--text3); text-transform: uppercase; letter-spacing: 1px; }
.wb-cta {
  background: var(--accent); color: white; border: none;
  border-radius: var(--r2); padding: 9px 18px;
  font-family: 'Cabinet Grotesk', sans-serif;
  font-size: 13px; font-weight: 700; cursor: pointer;
  transition: all .18s; white-space: nowrap; flex-shrink: 0;
}
.wb-cta:hover { background: var(--accent2); }

/* ── BLOCS ── */
.bloc-header {
  display: flex; align-items: center; gap: 12px;
  padding: 24px 0 16px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 18px;
}
.bloc-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px; font-weight: 500; letter-spacing: 2px;
  text-transform: uppercase; padding: 4px 12px;
  border-radius: 20px; flex-shrink: 0;
}
.bn1 { background: rgba(34,211,160,0.1); color: var(--green); }
.bn2 { background: var(--gold2); color: var(--gold); }
.bn3 { background: var(--blue2); color: var(--blue); }
.bn4 { background: var(--pink2); color: var(--pink); }
.bloc-title {
  font-family: 'Fraunces', serif;
  font-size: 1.15rem; font-weight: 300;
  color: var(--text2); font-style: italic;
}
.bloc-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-left: auto; }
.btag {
  font-size: 12px; font-weight: 700; padding: 2px 8px;
  border-radius: 20px; border: 1px solid var(--border2);
  color: var(--text3); white-space: nowrap;
}
.bloc-section { margin-bottom: 40px; }

/* ── CARDS ── */
.cards-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }

.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r);
  padding: 22px; display: flex; flex-direction: column; gap: 12px;
  position: relative; overflow: hidden;
  transition: border-color .2s, transform .2s, background .2s;
}
.card::after {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  opacity: 0; transition: opacity .2s;
}
.card:hover { border-color: var(--border2); background: var(--surface2); transform: translateY(-2px); }
.card:hover::after { opacity: 1; }
.card.clickable { cursor: pointer; }

.card.c-green::after { background: linear-gradient(90deg, transparent, var(--green), transparent); }
.card.c-gold::after  { background: linear-gradient(90deg, transparent, var(--gold), transparent); }
.card.c-blue::after  { background: linear-gradient(90deg, transparent, var(--blue), transparent); }
.card.c-pink::after  { background: linear-gradient(90deg, transparent, var(--pink), transparent); }
.card.c-teal::after  { background: linear-gradient(90deg, transparent, var(--teal), transparent); }
.card.c-purple::after{ background: linear-gradient(90deg, transparent, var(--purple), transparent); }

/* Stat bar dans carte */
.card-stat-bar {
  display: flex; gap: 10px; align-items: center;
  background: var(--bg3); border-radius: 6px; padding: 8px 12px;
}
.csb-icon { font-size: 14px; flex-shrink: 0; }
.csb-info { flex: 1; }
.csb-label { font-size: 12.5px; color: var(--text2); text-transform: uppercase; letter-spacing: 1px; }
.csb-val { font-family: 'JetBrains Mono', monospace; font-size: 13px; font-weight: 500; color: var(--text); }
.csb-bar { flex: 1; height: 3px; background: var(--border2); border-radius: 2px; overflow: hidden; }
.csb-fill { height: 100%; border-radius: 2px; transition: width .6s ease; }

.card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.card-icon {
  width: 38px; height: 38px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 17px; flex-shrink: 0;
}
.c-green .card-icon { background: var(--green2); }
.c-gold  .card-icon { background: var(--gold2); }
.c-blue  .card-icon { background: var(--blue2); }
.c-pink  .card-icon { background: var(--pink2); }
.c-teal  .card-icon { background: var(--teal2); }
.c-purple .card-icon { background: var(--purple2); }

.card-badge {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; font-weight: 500; letter-spacing: 1.5px;
  text-transform: uppercase; padding: 3px 8px; border-radius: 4px;
}
.c-green .card-badge { background: var(--green2); color: var(--green); }
.c-gold  .card-badge { background: var(--gold2);  color: var(--gold); }
.c-blue  .card-badge { background: var(--blue2);  color: var(--blue); }
.c-pink  .card-badge { background: var(--pink2);  color: var(--pink); }
.c-teal  .card-badge { background: var(--teal2);  color: var(--teal); }
.c-purple .card-badge { background: var(--purple2); color: var(--purple); }

.card-title {
  font-family: 'Fraunces', serif;
  font-size: 1rem; font-weight: 600; line-height: 1.3; color: var(--text);
}
.card-desc { font-size: 13.5px; color: var(--text2); line-height: 1.7; flex: 1; }
.card-footer {
  display: flex; align-items: center; gap: 8px;
  padding-top: 10px; border-top: 1px solid var(--border);
}
.card-pills { display: flex; gap: 5px; flex-wrap: wrap; flex: 1; }
.cpill {
  font-size: 12px; font-weight: 700; color: var(--text2);
  background: var(--bg3); border: 1px solid var(--border);
  padding: 2px 8px; border-radius: 20px; white-space: nowrap;
}
.card-arrow { font-size: 16px; color: var(--text3); transition: transform .2s, color .2s; }
.card:hover .card-arrow { transform: translateX(3px); color: var(--text2); }

/* Multi-boutons */
.card-multi { cursor: default; }
.card-multi:hover { transform: none; }
.card-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.card-btns.one { grid-template-columns: 1fr; }
.cbtn {
  background: var(--bg3); border: 1px solid var(--border2);
  border-radius: var(--r2); padding: 9px 11px;
  cursor: pointer; font-family: 'Cabinet Grotesk', sans-serif;
  text-align: left; transition: all .18s;
  display: flex; flex-direction: column; gap: 2px;
}
.cbtn:hover { background: var(--surface2); transform: translateY(-1px); }
.c-green .cbtn:hover { border-color: var(--green); }
.c-gold  .cbtn:hover { border-color: var(--gold); }
.c-blue  .cbtn:hover { border-color: var(--blue); }
.c-pink  .cbtn:hover { border-color: var(--pink); }
.c-teal  .cbtn:hover { border-color: var(--teal); }
.cbtn-label { font-size: 12px; font-weight: 700; color: var(--text); }
.cbtn-sub   { font-size: 12px; color: var(--text2); font-weight: 400; }

/* Locked */
.card.locked { opacity: .4; cursor: not-allowed; pointer-events: none; }
.card.locked::before {
  content: 'Bientôt';
  position: absolute; top: 12px; right: 12px;
  font-size: 11px; font-weight: 700; letter-spacing: 1px;
  text-transform: uppercase; color: var(--text3);
  background: var(--bg3); border: 1px solid var(--border);
  padding: 3px 8px; border-radius: 4px;
  font-family: 'JetBrains Mono', monospace;
}

/* ── VIEWER ── */
#viewer {
  position: fixed; inset: 0; z-index: 200;
  background: var(--bg); display: none; flex-direction: column;
}
#viewer.open { display: flex; }
.viewer-bar {
  display: flex; align-items: center; gap: 12px;
  background: rgba(8,11,16,.97); backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  padding: 0 20px; height: 50px; flex-shrink: 0;
}
.viewer-back {
  display: flex; align-items: center; gap: 7px;
  background: var(--surface); border: 1px solid var(--border2);
  border-radius: var(--r2); padding: 5px 13px;
  font-family: 'Cabinet Grotesk', sans-serif;
  font-size: 13px; font-weight: 700; color: var(--text2);
  cursor: pointer; transition: all .18s; white-space: nowrap;
}
.viewer-back:hover { color: var(--text); border-color: var(--accent); }
.viewer-title {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12.5px; color: var(--text3); flex: 1;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.viewer-title span { color: var(--accent2); }
.viewer-open {
  background: var(--surface); border: 1px solid var(--border2);
  border-radius: var(--r2); padding: 5px 13px;
  font-family: 'Cabinet Grotesk', sans-serif;
  font-size: 12px; font-weight: 700; color: var(--text3);
  cursor: pointer; text-decoration: none; display: flex;
  align-items: center; gap: 5px; transition: all .18s;
}
.viewer-open:hover { color: var(--text); }
.viewer-body { flex: 1; position: relative; overflow: hidden; }
.viewer-loading {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 14px;
  background: var(--bg); transition: opacity .3s;
}
.viewer-loading.hidden { opacity: 0; pointer-events: none; }
.spin {
  width: 36px; height: 36px; border: 2px solid var(--border2);
  border-top-color: var(--accent2); border-radius: 50%;
  animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
.viewer-loading p { font-size: 13px; color: var(--text3); }
#courseFrame { width: 100%; height: 100%; border: none; display: block; }

/* ── MODAL AUTH ── */
.modal-overlay {
  position: fixed; inset: 0; z-index: 300;
  background: rgba(0,0,0,.75); backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  padding: 20px; opacity: 0; pointer-events: none; transition: opacity .2s;
}
.modal-overlay.open { opacity: 1; pointer-events: all; }
.modal {
  background: var(--surface); border: 1px solid var(--border2);
  border-radius: 16px; padding: 32px; width: 100%; max-width: 400px;
  position: relative; transform: translateY(12px); transition: transform .25s;
  box-shadow: 0 32px 80px rgba(0,0,0,.6);
}
.modal-overlay.open .modal { transform: translateY(0); }
.modal-x {
  position: absolute; top: 14px; right: 14px;
  background: var(--bg3); border: 1px solid var(--border);
  border-radius: var(--r2); width: 28px; height: 28px;
  cursor: pointer; color: var(--text3); font-size: 16px;
  display: flex; align-items: center; justify-content: center;
  transition: all .18s;
}
.modal-x:hover { color: var(--text); }
.modal-logo {
  font-family: 'Fraunces', serif; font-size: 1.3rem;
  font-weight: 300; color: var(--text); margin-bottom: 4px;
}
.modal-logo em { color: var(--accent2); font-style: italic; }
.modal-sub { font-size: 13px; color: var(--text3); margin-bottom: 22px; }
.modal-tabs {
  display: flex; background: var(--bg3); border-radius: var(--r2);
  padding: 3px; gap: 3px; margin-bottom: 22px;
}
.mtab {
  flex: 1; background: none; border: none; cursor: pointer;
  font-family: 'Cabinet Grotesk', sans-serif;
  font-size: 13px; font-weight: 700; color: var(--text3);
  padding: 8px; border-radius: 6px; transition: all .18s;
}
.mtab.active { background: var(--surface2); color: var(--text); }
.oauth-btns { display: flex; flex-direction: column; gap: 9px; margin-bottom: 18px; }
.oauth-btn {
  display: flex; align-items: center; gap: 12px;
  background: var(--bg3); border: 1px solid var(--border2);
  border-radius: var(--r2); padding: 11px 16px;
  cursor: pointer; font-family: 'Cabinet Grotesk', sans-serif;
  font-size: 13px; font-weight: 700; color: var(--text);
  transition: all .18s; width: 100%;
}
.oauth-btn:hover { background: var(--surface2); border-color: var(--accent); transform: translateY(-1px); }
.oauth-btn svg { width: 18px; height: 18px; flex-shrink: 0; }
.modal-div {
  display: flex; align-items: center; gap: 10px;
  color: var(--text3); font-size: 12.5px; margin: 14px 0;
}
.modal-div::before, .modal-div::after { content: ''; flex: 1; height: 1px; background: var(--border); }
.form { display: flex; flex-direction: column; gap: 11px; }
.flabel { font-size: 12px; font-weight: 700; color: var(--text2); display: block; margin-bottom: 4px; }
.finput {
  background: var(--bg3); border: 1px solid var(--border2);
  border-radius: var(--r2); padding: 10px 13px;
  font-family: 'Cabinet Grotesk', sans-serif;
  font-size: 13px; color: var(--text); outline: none;
  width: 100%; transition: border-color .18s;
}
.finput:focus { border-color: var(--accent); }
.finput::placeholder { color: var(--text3); }
.fsubmit {
  background: var(--accent); color: white; border: none;
  border-radius: var(--r2); padding: 12px;
  font-family: 'Cabinet Grotesk', sans-serif;
  font-size: 14px; font-weight: 800; cursor: pointer;
  transition: all .18s; margin-top: 2px;
}
.fsubmit:hover { background: var(--accent2); transform: translateY(-1px); }
.fsubmit:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.flink { font-size: 12px; color: var(--text3); text-align: center; }
.flink a { color: var(--accent2); cursor: pointer; }
.ferror {
  background: var(--coral2); border: 1px solid var(--coral);
  border-radius: var(--r2); padding: 9px 13px;
  font-size: 13px; color: var(--coral); display: none;
}
.ferror.show { display: block; }
.fsuccess {
  background: var(--green2); border: 1px solid var(--green);
  border-radius: var(--r2); padding: 9px 13px;
  font-size: 13px; color: var(--green); display: none;
}
.fsuccess.show { display: block; }

/* ── DASHBOARD ── */
.dash-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap: 12px; margin-bottom: 28px; }
.dstat {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r); padding: 18px 20px;
}
.dstat-n {
  font-family: 'JetBrains Mono', monospace;
  font-size: 2rem; font-weight: 500; color: var(--text);
  letter-spacing: -2px; line-height: 1;
}
.dstat-l { font-size: 12.5px; color: var(--text3); text-transform: uppercase; letter-spacing: 1.5px; margin-top: 4px; }
.dblocs { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: 12px; margin-bottom: 28px; }
.dbloc { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r); padding: 16px 18px; }
.dbloc-head { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.dbloc-title { font-size: 13px; font-weight: 700; color: var(--text); }
.dpbar { background: var(--bg3); border-radius: 3px; height: 5px; overflow: hidden; margin-bottom: 5px; }
.dpfill { height: 100%; border-radius: 3px; transition: width .6s ease; }
.dptext { font-size: 12.5px; color: var(--text3); }
.dfaib {
  background: var(--surface); border: 1px solid var(--border);
  border-left: 3px solid var(--gold); border-radius: var(--r);
  padding: 16px 20px; margin-bottom: 28px;
}
.dfaib-item {
  display: flex; align-items: center; gap: 12px;
  padding: 8px 0; border-bottom: 1px solid var(--border);
}
.dfaib-item:last-child { border-bottom: none; }
.dfaib-mat { font-size: 13px; color: var(--text); flex: 1; }
.dscore-bad { color: var(--coral); font-family: 'JetBrains Mono', monospace; font-size: 12px; font-weight: 500; }
.dscore-mid { color: var(--gold); font-family: 'JetBrains Mono', monospace; font-size: 12px; font-weight: 500; }
.dscore-ok  { color: var(--green); font-family: 'JetBrains Mono', monospace; font-size: 12px; font-weight: 500; }
.dhisto { display: flex; flex-direction: column; gap: 8px; }
.dhisto-item {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r2); padding: 11px 15px;
  display: flex; align-items: center; gap: 12px;
}
.dhisto-emoji { font-size: 16px; flex-shrink: 0; }
.dhisto-title { font-size: 13px; font-weight: 700; color: var(--text); }
.dhisto-date { font-size: 12.5px; color: var(--text3); }
.dash-sec { font-size: 12px; font-weight: 700; color: var(--text3); text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 12px; display: flex; align-items: center; gap: 10px; }
.dash-sec::after { content: ''; flex: 1; height: 1px; background: var(--border); }
.empty-state { text-align: center; padding: 40px 20px; color: var(--text3); font-size: 14px; }
.empty-state-icon { font-size: 32px; margin-bottom: 10px; }

/* ── TARIFS ── */
.tarif-toggle {
  display: flex; background: var(--surface); border: 1px solid var(--border);
  border-radius: 30px; padding: 4px; gap: 3px;
  margin: 0 auto 32px; width: fit-content;
}
.ttoggle {
  background: none; border: none; cursor: pointer;
  font-family: 'Cabinet Grotesk', sans-serif;
  font-size: 13px; font-weight: 700; color: var(--text3);
  padding: 8px 22px; border-radius: 26px; transition: all .18s;
}
.ttoggle.active { background: var(--accent); color: white; }
.plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px,1fr)); gap: 13px; margin-bottom: 16px; }
.plan {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r); padding: 22px;
  display: flex; flex-direction: column; gap: 14px;
  position: relative; transition: border-color .18s;
}
.plan.featured { border: 2px solid var(--gold); }
.featured-tag {
  position: absolute; top: -10px; left: 50%; transform: translateX(-50%);
  font-size: 11px; font-weight: 800; background: var(--gold); color: #1B2A22;
  padding: 3px 12px; border-radius: 20px; white-space: nowrap;
  font-family: 'JetBrains Mono', monospace; letter-spacing: 1px; text-transform: uppercase;
}
.plan-bar { width: 28px; height: 3px; border-radius: 2px; margin-bottom: 2px; }
.plan-name { font-size: 14px; font-weight: 800; color: var(--text); }
.plan-desc { font-size: 12px; color: var(--text3); }
.plan-price {
  font-family: 'JetBrains Mono', monospace;
  font-size: 2rem; font-weight: 500; color: var(--text);
  letter-spacing: -2px; line-height: 1;
}
.plan-price .per { font-size: 13px; font-weight: 400; color: var(--text3); }
.plan-annual { font-size: 12.5px; color: var(--green); margin-top: 2px; }
.plan-sep { height: 1px; background: var(--border); }
.plan-feats { display: flex; flex-direction: column; gap: 7px; flex: 1; }
.pfeat { display: flex; gap: 8px; align-items: flex-start; }
.pfeat-icon { font-size: 12px; margin-top: 2px; flex-shrink: 0; }
.pfeat-text { font-size: 12px; color: var(--text2); line-height: 1.4; }
.pfeat-text.muted { color: var(--text3); text-decoration: line-through; }
.plan-cta {
  background: var(--surface2); border: 1px solid var(--border2);
  border-radius: var(--r2); padding: 10px; text-align: center;
  font-size: 13px; font-weight: 800; color: var(--text2);
  cursor: pointer; transition: all .18s;
}
.plan-cta:hover { background: var(--accent); border-color: var(--accent); color: white; }
.plan.featured .plan-cta { background: var(--gold); border-color: var(--gold); color: #1B2A22; }
.bundle {
  background: var(--surface); border: 2px solid var(--accent);
  border-radius: var(--r); padding: 22px; margin-top: 13px;
  display: flex; align-items: center; gap: 20px; position: relative;
}
.bundle-tag {
  position: absolute; top: -10px; left: 22px;
  font-size: 11px; font-weight: 800; background: var(--accent); color: white;
  padding: 3px 12px; border-radius: 20px;
  font-family: 'JetBrains Mono', monospace; letter-spacing: 1px; text-transform: uppercase;
}
.bundle-info { flex: 1; }
.bundle-name { font-size: 15px; font-weight: 800; color: var(--text); margin-bottom: 4px; }
.bundle-desc { font-size: 12px; color: var(--text3); }
.bundle-right { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex-shrink: 0; }
.bundle-old { font-size: 12px; color: var(--text3); text-decoration: line-through; }
.bundle-price {
  font-family: 'JetBrains Mono', monospace;
  font-size: 2rem; font-weight: 500; color: var(--accent2);
  letter-spacing: -2px; line-height: 1;
}
.bundle-save {
  font-size: 12px; font-weight: 800; color: var(--green);
  background: var(--green2); padding: 2px 8px; border-radius: 20px;
}
.bundle-note { font-size: 12.5px; color: var(--text3); }

/* ── EXAMENS ── */
.exam-group-title {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px; font-weight: 500; letter-spacing: 2px;
  text-transform: uppercase; color: var(--text3);
  margin-bottom: 12px; display: flex; align-items: center; gap: 10px;
}
.exam-group-title::after { content: ''; flex: 1; height: 1px; background: var(--border); }
.exam-item {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r); margin-bottom: 9px; overflow: hidden;
  transition: border-color .18s;
}
.exam-item:hover { border-color: var(--border2); }
.exam-item.open { border-color: rgba(240,96,96,.2); }
.exam-head {
  display: flex; align-items: center; gap: 13px;
  padding: 15px 20px; cursor: pointer; user-select: none;
}
.exam-emoji { font-size: 18px; flex-shrink: 0; }
.exam-info-block { flex: 1; }
.exam-matiere {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 3px;
}
.exam-title { font-size: 13px; font-weight: 700; color: var(--text); line-height: 1.3; }
.exam-meta { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 5px; }
.emeta {
  font-size: 12px; color: var(--text3); background: var(--bg3);
  border: 1px solid var(--border); padding: 2px 7px; border-radius: 20px;
}
.exam-chev { font-size: 18px; color: var(--text3); transition: transform .25s; flex-shrink: 0; }
.exam-item.open .exam-chev { transform: rotate(90deg); }
.exam-body { display: none; padding: 0 20px 20px; border-top: 1px solid var(--border); }
.exam-item.open .exam-body { display: block; animation: fadeUp .2s ease; }
.exam-ctx {
  background: var(--bg3); border-left: 3px solid var(--coral);
  border-radius: 6px; padding: 13px 16px;
  margin: 14px 0; font-size: 13px; line-height: 1.75; color: var(--text2);
}
.exam-ctx strong {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px; text-transform: uppercase; letter-spacing: 1.5px;
  color: var(--coral); display: block; margin-bottom: 6px;
}
.exam-qs { display: flex; flex-direction: column; gap: 10px; margin: 14px 0; }
.exam-q {
  background: var(--surface2); border: 1px solid var(--border);
  border-radius: var(--r2); overflow: hidden;
}
.exam-q-head {
  display: flex; align-items: flex-start; gap: 11px;
  padding: 13px 15px; cursor: pointer;
}
.eq-num {
  font-family: 'JetBrains Mono', monospace; font-size: 12px; font-weight: 500;
  background: var(--coral2); color: var(--coral);
  border-radius: 4px; padding: 2px 7px; flex-shrink: 0; margin-top: 2px;
}
.eq-text { font-size: 13px; color: var(--text); flex: 1; line-height: 1.5; }
.eq-pts { font-family: 'JetBrains Mono', monospace; font-size: 12px; color: var(--text3); flex-shrink: 0; margin-top: 2px; }
.eq-chev { font-size: 16px; color: var(--text3); flex-shrink: 0; transition: transform .2s; margin-top: 2px; }
.exam-q.open .eq-chev { transform: rotate(90deg); }
.exam-q-corr { display: none; padding: 13px 15px; border-top: 1px solid var(--border); background: var(--bg3); }
.exam-q.open .exam-q-corr { display: block; animation: fadeUp .2s ease; }
.corr-label {
  font-family: 'JetBrains Mono', monospace; font-size: 11px;
  text-transform: uppercase; letter-spacing: 2px; color: var(--green);
  margin-bottom: 7px; display: flex; align-items: center; gap: 5px;
}
.corr-label::before { content: '✓'; }
.exam-q-corr p { font-size: 13px; color: var(--text2); line-height: 1.7; }
.calc-block {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r2); padding: 11px 13px; margin: 9px 0;
  font-family: 'JetBrains Mono', monospace; font-size: 12px;
  color: var(--green); line-height: 1.9;
}
.exam-q-corr ul { padding-left: 18px; margin: 7px 0; }
.exam-q-corr ul li { font-size: 13px; color: var(--text2); margin-bottom: 5px; line-height: 1.6; }
.exam-prog-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 26px; }
.eptab {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 20px; padding: 6px 16px;
  font-size: 12px; font-weight: 700; color: var(--text3);
  cursor: pointer; transition: all .18s;
}
.eptab:hover { border-color: var(--border2); color: var(--text2); }
.eptab.active { background: var(--coral2); border-color: var(--coral); color: var(--coral); }

/* ── PAYWALL ── */
.modal-paywall { max-width:520px; }
.pw-header { text-align:center; margin-bottom:24px; }
.pw-icon { font-size:2.5rem; margin-bottom:10px; }
.pw-title { font-family:'Fraunces',serif; font-size:1.4rem; font-weight:300; color:var(--text); margin-bottom:6px; }
.pw-title em { color:var(--accent2); font-style:italic; }
.pw-sub { font-size:13px; color:var(--text3); line-height:1.6; }
.pw-plans { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:20px 0; }
.pw-plan {
  background:var(--bg3); border:1px solid var(--border2);
  border-radius:var(--r); padding:16px; cursor:pointer;
  transition:all .18s; text-align:center;
}
.pw-plan:hover { border-color:var(--accent); background:var(--surface2); transform:translateY(-2px); }
.pw-plan.featured { border:2px solid var(--gold); background:var(--gold2); }
.pw-plan-name { font-size:12px; font-weight:700; color:var(--text); margin-bottom:4px; }
.pw-plan-price { font-family:'JetBrains Mono',monospace; font-size:1.5rem; font-weight:500; color:var(--accent2); letter-spacing:-1px; }
.pw-plan-price .per { font-size: 12.5px; color:var(--text3); }
.pw-plan.featured .pw-plan-price { color:var(--gold); }
.pw-plan-desc { font-size: 12px; color:var(--text3); margin-top:4px; }
.pw-bundle {
  background:linear-gradient(135deg,var(--accent3),rgba(34,211,160,0.05));
  border:1px solid rgba(91,110,245,0.2);
  border-radius:var(--r); padding:14px 18px;
  display:flex; align-items:center; justify-content:space-between;
  cursor:pointer; transition:all .18s; margin-bottom:16px;
}
.pw-bundle:hover { border-color:var(--accent); }
.pw-bundle-left .pw-bundle-title { font-size:13px; font-weight:700; color:var(--text); }
.pw-bundle-left .pw-bundle-desc { font-size: 12.5px; color:var(--text3); margin-top:2px; }
.pw-bundle-price { font-family:'JetBrains Mono',monospace; font-size:1.6rem; font-weight:500; color:var(--accent2); letter-spacing:-1px; white-space:nowrap; }
.pw-free { text-align:center; font-size:12px; color:var(--text3); margin-top:12px; }
.pw-free a { color:var(--accent2); cursor:pointer; }

/* Cadenas sur les cartes payantes */
.card .lock-badge {
  position:absolute; top:12px; right:12px;
  background:var(--gold2); border:1px solid var(--gold);
  color:var(--gold); font-size: 12px; font-weight:700;
  padding:2px 8px; border-radius:20px;
  font-family:'JetBrains Mono',monospace; letter-spacing:1px;
  z-index:2;
}
.card.is-locked { cursor:pointer; }
.card.is-locked .cbtn { cursor:pointer; }
.card.is-locked:hover { border-color:var(--gold); }
.card.is-locked::after { background:linear-gradient(90deg,transparent,var(--gold),transparent); opacity:0; }
.card.is-locked:hover::after { opacity:1; }

.fm-toolbar { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; flex-wrap:wrap; gap:10px; }
.fm-counter { font-size:13px; color:var(--text2); }
.fm-counter span { font-weight:700; color:var(--text); }
.fm-prog-wrap { display:flex; align-items:center; gap:8px; }
.fm-prog-bar { width:140px; height:4px; background:var(--border2); border-radius:2px; overflow:hidden; }
.fm-prog-fill { height:100%; border-radius:2px; background:var(--accent); transition:width .4s ease; }
.fm-prog-pct { font-family:'JetBrains Mono',monospace; font-size: 12.5px; color:var(--text3); }
.fm-filters { display:flex; gap:7px; flex-wrap:wrap; margin-bottom:20px; }
.fm-filter { font-size: 12.5px; font-weight:700; padding:5px 14px; border-radius:20px; border:1px solid var(--border2); background:var(--surface); color:var(--text3); cursor:pointer; transition:all .18s; }
.fm-filter:hover { color:var(--text2); }
.fm-filter.active { color:white; border-color:transparent; background:var(--accent); }
.fm-filter.fs2.active { background:var(--green); color:#1B2A22; }
.fm-filter.fs3.active { background:var(--gold); color:#1B2A22; }
.fm-filter.fs4.active { background:var(--blue); color:#1B2A22; }
.fm-filter.fs5.active { background:var(--coral); }
.fm-filter.fs6.active { background:var(--pink); }
.fm-filter.fs7.active { background:var(--teal); color:#1B2A22; }
.fm-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:14px; }
.fm-card { perspective:900px; height:240px; cursor:pointer; }
.fm-card.hidden { display:none; }
.fm-inner { position:relative; width:100%; height:100%; transform-style:preserve-3d; transition:transform .55s cubic-bezier(.4,0,.2,1); }
.fm-card.flipped .fm-inner { transform:rotateY(180deg); }
.fm-front,.fm-back { position:absolute; inset:0; backface-visibility:hidden; border-radius:var(--r); border:1px solid var(--border2); display:flex; flex-direction:column; }
.fm-front { background:var(--surface); padding:22px; justify-content:space-between; overflow:hidden; position:relative; }
.fm-front::after { content:''; position:absolute; bottom:-40px; right:-40px; width:130px; height:130px; border-radius:50%; opacity:.05; pointer-events:none; }
.fmc-strat .fm-front { border-top:2px solid var(--accent); } .fmc-strat .fm-front::after { background:var(--accent); }
.fmc-compta .fm-front { border-top:2px solid var(--green); } .fmc-compta .fm-front::after { background:var(--green); }
.fmc-audit .fm-front { border-top:2px solid var(--blue); } .fmc-audit .fm-front::after { background:var(--blue); }
.fmc-cdg .fm-front { border-top:2px solid var(--gold); } .fmc-cdg .fm-front::after { background:var(--gold); }
.fmc-fiscal .fm-front { border-top:2px solid var(--coral); } .fmc-fiscal .fm-front::after { background:var(--coral); }
.fmc-droit .fm-front { border-top:2px solid var(--pink); } .fmc-droit .fm-front::after { background:var(--pink); }
.fmc-fin .fm-front { border-top:2px solid var(--teal); } .fmc-fin .fm-front::after { background:var(--teal); }
.fm-cat { font-family:'JetBrains Mono',monospace; font-size: 11px; font-weight:500; letter-spacing:2px; text-transform:uppercase; padding:3px 10px; border-radius:20px; width:fit-content; }
.fmc-strat .fm-cat { background:var(--accent3); color:var(--accent2); }
.fmc-compta .fm-cat { background:var(--green2); color:var(--green); }
.fmc-audit .fm-cat { background:var(--blue2); color:var(--blue); }
.fmc-cdg .fm-cat { background:var(--gold2); color:var(--gold); }
.fmc-fiscal .fm-cat { background:var(--coral2); color:var(--coral); }
.fmc-droit .fm-cat { background:var(--pink2); color:var(--pink); }
.fmc-fin .fm-cat { background:var(--teal2); color:var(--teal); }
.fm-title { font-family:'Fraunces',serif; font-size:1.05rem; font-weight:600; color:var(--text); line-height:1.3; flex:1; display:flex; align-items:center; }
.fm-hint { font-size: 12.5px; color:var(--text3); display:flex; align-items:center; gap:5px; }
.fm-back { background:var(--bg2); padding:18px; transform:rotateY(180deg); gap:8px; overflow:hidden; }
.fm-back-head { padding-bottom:8px; border-bottom:1px solid var(--border); }
.fm-back-title { font-family:'JetBrains Mono',monospace; font-size: 12px; letter-spacing:1.5px; text-transform:uppercase; font-weight:500; }
.fmc-strat .fm-back-title { color:var(--accent2); }
.fmc-compta .fm-back-title { color:var(--green); }
.fmc-audit .fm-back-title { color:var(--blue); }
.fmc-cdg .fm-back-title { color:var(--gold); }
.fmc-fiscal .fm-back-title { color:var(--coral); }
.fmc-droit .fm-back-title { color:var(--pink); }
.fmc-fin .fm-back-title { color:var(--teal); }
.fm-body { flex:1; overflow-y:auto; display:flex; flex-direction:column; gap:6px; }
.fm-body::-webkit-scrollbar { width:3px; }
.fm-body::-webkit-scrollbar-thumb { background:var(--border2); border-radius:2px; }
.fm-point { display:flex; gap:8px; align-items:flex-start; }
.fm-dot { width:5px; height:5px; border-radius:50%; flex-shrink:0; margin-top:6px; }
.fmc-strat .fm-dot { background:var(--accent); }
.fmc-compta .fm-dot { background:var(--green); }
.fmc-audit .fm-dot { background:var(--blue); }
.fmc-cdg .fm-dot { background:var(--gold); }
.fmc-fiscal .fm-dot { background:var(--coral); }
.fmc-droit .fm-dot { background:var(--pink); }
.fmc-fin .fm-dot { background:var(--teal); }
.fm-text { font-size:12px; color:var(--text2); line-height:1.55; }
.fm-text strong { color:var(--text); font-weight:700; }
.fm-example { background:var(--bg3); border-radius:6px; padding:7px 10px; font-size: 12.5px; color:var(--text3); line-height:1.5; border-left:2px solid var(--border2); }
.fm-example::before { content:'Ex. '; font-weight:700; color:var(--text2); }
.fm-tags { display:flex; gap:5px; flex-wrap:wrap; }
.fm-tag { font-size: 12px; padding:2px 8px; border-radius:20px; background:var(--bg3); border:1px solid var(--border); color:var(--text3); }

/* ── TOAST ── */
.toast {
  position: fixed; bottom: 24px; right: 24px; z-index: 9999;
  background: var(--surface); border: 1px solid rgba(34,211,160,.3);
  color: var(--green); padding: 11px 16px;
  border-radius: var(--r); font-size: 13px; font-weight: 700;
  box-shadow: 0 8px 32px rgba(0,0,0,.5);
  animation: fadeUp .3s ease;
}

footer {
  position: relative; z-index: 10; text-align: center;
  padding: 24px 32px; border-top: 1px solid var(--border);
  font-family: 'JetBrains Mono', monospace;
  font-size: 12.5px; color: var(--text3); letter-spacing: .5px;
}

@media (max-width: 700px) {
  .wrap { padding: 24px 16px 60px; }
  .nav { padding: 0 16px; }
  .nav-logo { display: none; }
  .hero { grid-template-columns: 1fr; }
  .hero-right { display: none; }
  .cards-grid { grid-template-columns: 1fr; }
  .plans { grid-template-columns: 1fr; }
  .bundle { flex-direction: column; align-items: flex-start; }
  .wb-stats { display: none; }
  .dash-grid { grid-template-columns: repeat(2,1fr); }
}

  /* Fond uni (sans lignes ni halos), identique aux cours */
  .bg-grid { background-image: none !important; background: transparent !important; display: none !important; }
  .bg-glow1, .bg-glow2 { display: none !important; }
  body { background: var(--bg) !important; }

/* ══ Fiches mémo — catégories ajoutées (Budget, Pilotage, Diag. Fin., Management) ══ */
.fmc-budget .fm-front { border-top:2px solid var(--gold); } .fmc-budget .fm-front::after { background:var(--gold); }
.fmc-pilotage .fm-front { border-top:2px solid var(--purple); } .fmc-pilotage .fm-front::after { background:var(--purple); }
.fmc-diag .fm-front { border-top:2px solid var(--teal); } .fmc-diag .fm-front::after { background:var(--teal); }
.fmc-mgmt .fm-front { border-top:2px solid var(--pink); } .fmc-mgmt .fm-front::after { background:var(--pink); }

.fmc-budget .fm-cat { background:var(--gold2); color:var(--gold); }
.fmc-pilotage .fm-cat { background:var(--purple2); color:var(--purple); }
.fmc-diag .fm-cat { background:var(--teal2); color:var(--teal); }
.fmc-mgmt .fm-cat { background:var(--pink2); color:var(--pink); }

.fmc-budget .fm-back-title { color:var(--gold); }
.fmc-pilotage .fm-back-title { color:var(--purple); }
.fmc-diag .fm-back-title { color:var(--teal); }
.fmc-mgmt .fm-back-title { color:var(--pink); }

.fmc-budget .fm-dot { background:var(--gold); }
.fmc-pilotage .fm-dot { background:var(--purple); }
.fmc-diag .fm-dot { background:var(--teal); }
.fmc-mgmt .fm-dot { background:var(--pink); }

/* ══ Fiches verrouillées ══
   Le recto reste entièrement lisible (titre + matière) : c'est le verso
   (la réponse) qui est remplacé par un appel à l'abonnement. */
.fm-card.locked { cursor:pointer; }
.fm-card.locked .fm-front { opacity:.72; }
.fm-card.locked .fm-front .fm-hint::before { content:'🔒 '; }
.fm-lock-badge {
  position:absolute; top:12px; right:12px; font-size:13px; opacity:.55;
  pointer-events:none;
}
.fm-locked-back {
  position:absolute; inset:0; backface-visibility:hidden; transform:rotateY(180deg);
  border-radius:var(--r); border:1px solid var(--border2); background:var(--surface2);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:10px; padding:22px; text-align:center;
}
.fm-locked-icon { font-size:26px; opacity:.6; }
.fm-locked-title {
  font-family:'JetBrains Mono',monospace; font-size: 12px; letter-spacing:1.5px;
  text-transform:uppercase; color:var(--text3);
}
.fm-locked-msg { font-size:13px; color:var(--text2); line-height:1.6; }
.fm-locked-cta {
  margin-top:4px; font-size:12px; font-weight:700; color:var(--accent2);
  border:1px solid var(--accent3); background:var(--accent3);
  border-radius:var(--r2); padding:7px 16px;
}

/* ── Accessibilité : curseur « main » sur tout élément cliquable ──
   Couvre les <div> rendus cliquables en JS, qui n'ont pas de curseur
   par défaut contrairement aux vrais liens. */
[onclick] { cursor: pointer; }
[onclick]:focus-visible { outline: 2px solid var(--accent2); outline-offset: 2px; }

/* ══ Consentement avant paiement (art. L.221-28, 13° C. conso) ══
   Les deux cases doivent être cochées pour activer le bouton : le
   consentement doit être un acte positif, jamais pré-coché. */
.consent-overlay {
  position: fixed; inset: 0; z-index: 600;
  background: rgba(27,42,34,0.55);
  display: flex; align-items: center; justify-content: center;
  padding: 20px; overflow-y: auto;
}
.consent-box {
  background: var(--surface); border-radius: var(--r);
  border: 1px solid var(--border2);
  max-width: 520px; width: 100%; padding: 28px;
  box-shadow: 0 18px 50px rgba(27,42,34,0.25);
}
.consent-offre {
  font-family: 'JetBrains Mono', monospace; font-size: 11px;
  letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--accent2); margin-bottom: 8px;
}
.consent-titre {
  font-family: 'Fraunces', serif; font-weight: 300; font-size: 26px;
  color: var(--text); margin-bottom: 12px;
}
.consent-intro {
  font-size: 13.5px; color: var(--text2); line-height: 1.65;
  margin-bottom: 18px;
}
.consent-ligne {
  display: flex; gap: 12px; align-items: flex-start;
  background: var(--bg3); border: 1px solid var(--border);
  border-radius: var(--r2); padding: 14px 16px; margin-bottom: 12px;
  font-size: 13.5px; color: var(--text); line-height: 1.6;
  cursor: pointer;
}
.consent-ligne:hover { border-color: var(--accent2); }
.consent-ligne input {
  margin-top: 3px; width: 17px; height: 17px;
  accent-color: var(--accent2); cursor: pointer; flex-shrink: 0;
}
.consent-note {
  font-size: 12.5px; color: var(--text2); line-height: 1.6;
  margin: 16px 0 20px;
}
.consent-note a { color: var(--accent2); }
.consent-actions { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; }
.consent-annuler {
  background: none; border: 1px solid var(--border2); color: var(--text2);
  border-radius: var(--r2); padding: 11px 20px;
  font-family: 'Cabinet Grotesk', sans-serif; font-size: 13.5px; font-weight: 700;
  cursor: pointer;
}
.consent-annuler:hover { color: var(--text); border-color: var(--text2); }
.consent-valider {
  background: var(--accent2); border: none; color: #fff;
  border-radius: var(--r2); padding: 11px 22px;
  font-family: 'Cabinet Grotesk', sans-serif; font-size: 13.5px; font-weight: 700;
  cursor: pointer;
}
.consent-valider:disabled {
  background: var(--border2); color: var(--text3); cursor: not-allowed;
}
@media (max-width: 560px) {
  .consent-box { padding: 22px 18px; }
  .consent-actions { flex-direction: column-reverse; }
  .consent-actions button { width: 100%; }
}

/* ══ Onglet Examens — épreuves blanches complètes ══ */
.exam-group-title {
  font-family: 'JetBrains Mono', monospace; font-size: 11px;
  letter-spacing: 2px; text-transform: uppercase; color: var(--text2);
  margin: 26px 0 12px; padding-bottom: 8px; border-bottom: 1px solid var(--border);
}
.exam-card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r); padding: 22px 24px; margin-bottom: 16px;
}
.exam-card.is-locked { background: var(--bg3); }
.exam-card-top { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 14px; }
.exam-emoji {
  font-size: 22px; background: var(--bg3); border: 1px solid var(--border);
  border-radius: var(--r2); width: 42px; height: 42px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.exam-intitule {
  font-family: 'JetBrains Mono', monospace; font-size: 11px;
  letter-spacing: 1.2px; text-transform: uppercase; margin-bottom: 4px;
}
.exam-titre {
  font-family: 'Fraunces', serif; font-size: 18px; font-weight: 600;
  color: var(--text); line-height: 1.35;
}
.exam-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.emeta {
  font-size: 12px; color: var(--text2); background: var(--bg3);
  border: 1px solid var(--border); border-radius: 20px; padding: 4px 11px;
}
.exam-consigne {
  font-size: 13.5px; color: var(--text2); line-height: 1.65;
  background: var(--bg3); border-left: 3px solid var(--gold);
  border-radius: var(--r2); padding: 12px 16px; margin-bottom: 14px;
}
.exam-consigne strong { color: var(--text); }
.exam-dossiers {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 8px; margin-bottom: 16px;
}
.exd {
  display: flex; align-items: center; gap: 9px;
  background: var(--bg3); border: 1px solid var(--border);
  border-radius: var(--r2); padding: 9px 12px; font-size: 13px;
}
.exd-code {
  font-family: 'JetBrains Mono', monospace; font-weight: 700;
  color: var(--accent2); font-size: 12px;
}
.exd-nom { flex: 1; color: var(--text); }
.exd-pts { font-size: 12px; color: var(--text2); white-space: nowrap; }
.exam-open {
  width: 100%; background: var(--accent2); color: #fff; border: none;
  border-radius: var(--r2); padding: 12px 20px;
  font-family: 'Cabinet Grotesk', sans-serif; font-size: 13.5px; font-weight: 700;
  cursor: pointer;
}
.exam-open:hover { filter: brightness(1.08); }
.exam-open.exam-locked {
  background: none; color: var(--text2); border: 1px solid var(--border2);
}
.exam-open.exam-locked:hover { border-color: var(--accent2); color: var(--text); }
@media (max-width: 560px) {
  .exam-card { padding: 18px 16px; }
  .exam-dossiers { grid-template-columns: 1fr; }
}

/* ── SEO : les onglets de la nav sont des liens <a> (Google suit les liens, pas les boutons) ── */
a.nav-tab { text-decoration: none; display: inline-block; }
/* ── Liens du pied de page (plan du site pour Google et les visiteurs) ── */
.footer-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; margin-bottom: 10px; }
.footer-links a { color: var(--text3); text-decoration: none; }
.footer-links a:hover { color: var(--accent2); }