/* ============================================================
   MQ-COURSES — design system (from the Charte Graphique v1)
   Black · Paper · one flame. The "0" is the mark.
   Used by: MQ-Courses homepage, storefronts, hub, forms.
   Pairs with mq.js (reveals, parallax, counters, chain, forms).
   ============================================================ */

:root{
  /* palette */
  --ink:#0E0E0E;        /* primary ground — 70% */
  --paper:#F7F3EA;      /* light bands — 22% */
  --vermilion:#F23005;  /* the accent — kickers, CTAs, the "0" — 6% */
  --gold:#F5B400;       /* rare premium accent on ink only — 2% */
  --crimson:#C3001E;    /* alt: hover, errors, don'ts, print */
  --body:#26231d;       /* long-form body on paper */
  --muted:#9a948a;      /* captions & metadata */
  --paper-dim:#d3cdc1;  /* body on ink */
  --paper-dim2:#cbc5b9; /* secondary body on ink */
  --line:rgba(14,14,14,.14);      /* hairline on paper */
  --line-ink:rgba(247,243,234,.16);/* hairline on ink */
  /* type */
  --sans:'Space Grotesk',sans-serif;
  --mono:'Space Mono',monospace;
  --serif:'Newsreader',serif;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{ font-family:var(--serif); color:var(--body); background:var(--paper);
  -webkit-font-smoothing:antialiased; overflow-x:hidden; }
a{ color:var(--vermilion); text-decoration:none; }
a:hover{ color:var(--crimson); }
img{ max-width:100%; display:block; }
*:focus-visible{ outline:3px solid var(--gold); outline-offset:3px; }

/* ---------- layout shells ---------- */
.mq-section{ position:relative; overflow:hidden; padding:96px 6vw; }
.mq-section--ink{ background:var(--ink); color:var(--paper); }
.mq-section--paper{ background:var(--paper); color:var(--body); }
.mq-wrap{ max-width:1285px; margin:0 auto; position:relative; z-index:2; }
.mq-wrap--wide{ max-width:1240px; }
@media(max-width:760px){ .mq-section{ padding:66px 20px; } }

/* ---------- editorial atoms ---------- */
.mq-kicker{ font-family:var(--mono); font-size:12px; letter-spacing:.28em;
  text-transform:uppercase; color:var(--vermilion); margin-bottom:14px; }
.mq-eyebrow{ font-family:var(--mono); font-size:11px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--muted); }
.mq-display{ font-family:var(--sans); font-weight:700; font-size:clamp(46px,9vw,95px);
  line-height:.88; letter-spacing:-.02em; }
.mq-h1{ font-family:var(--sans); font-weight:700; font-size:clamp(38px,5.4vw,62px);
  line-height:.94; letter-spacing:-.02em; }
.mq-h2{ font-family:var(--sans); font-weight:700; font-size:clamp(24px,3vw,32px);
  line-height:1.05; letter-spacing:-.01em; }
.mq-lead{ font-family:var(--serif); font-size:clamp(18px,2.2vw,24px); line-height:1.42; }
.mq-body{ font-family:var(--serif); font-size:17px; line-height:1.62; max-width:62ch; }
.mq-epigraph{ font-family:var(--serif); font-style:italic; font-size:clamp(20px,2.6vw,26px); line-height:1.32; }
.mq-rule{ width:88px; height:4px; background:var(--vermilion); margin:34px 0 26px; }
.mq-rule--sm{ width:46px; height:3px; margin:16px 0 0; }
.mq-divider{ height:2px; background:var(--ink); margin:26px 0 40px; }
.mq-section--ink .mq-divider{ background:rgba(247,243,234,.85); }
.mq-red{ color:var(--vermilion); }
.mq-wordmark{ font-family:var(--sans); font-weight:700; letter-spacing:-.01em; }
.mq-wordmark i{ font-style:normal; color:var(--vermilion); }

/* ghosted section numeral — place as first child of a positioned section */
.mq-ghost{ position:absolute; top:34px; left:40px; font-family:var(--sans); font-weight:700;
  font-size:clamp(120px,20vw,210px); line-height:1; pointer-events:none; z-index:1;
  color:rgba(14,14,14,.055); }
.mq-section--ink .mq-ghost{ color:rgba(247,243,234,.05); }

/* ---------- the "0" mark (clipped watermark) ---------- */
/* Rule: never shown whole — it bleeds off the top-right corner. */
.mq-zero{ position:absolute; top:-190px; right:-150px; width:640px; height:auto;
  pointer-events:none; z-index:1; }
.mq-zero text{     font-family: var(--sans);
    font-weight: 700;
    font-size: 150px;
    fill: #0e0e0e;
    stroke: #50180b;
    stroke-width: .55;
    opacity: 1;}
@media(max-width:760px){ .mq-zero{ width:360px; top:-96px; right:-92px; } }

/* ---------- chain-of-zeros pattern (filled by mq.js, contour variant) ---------- */
.mq-chain{ position:absolute; inset:0; width:100%; height:100%; opacity:.3;
  pointer-events:none; z-index:0; }

/* ---------- sticky nav ---------- */
.mq-nav{ position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(14,14,14,0); border-bottom:1px solid rgba(247,243,234,0);
  transition:background .35s ease, border-color .35s ease; }
.mq-nav.solid{ background:rgba(14,14,14,.94); border-bottom-color:var(--line-ink); }
.mq-nav__in{ max-width:1385px; margin:0 auto; padding:18px 40px; display:flex;
  align-items:center; justify-content:space-between; gap:24px; }
.mq-nav__brand{ display:inline-flex; align-items:center; gap:11px; font-family:var(--sans); font-weight:700; font-size:18px;
  letter-spacing:-.01em; color:var(--paper); }
.mq-nav__brand span{ color:var(--vermilion); }
.mq-nav__logo{ height:40px; width:auto; display:block; }
.mq-nav__suffix{ font-family:var(--mono); font-weight:400; font-size:10.5px; letter-spacing:.16em;
  text-transform:uppercase; color:#9a948a; padding-left:11px; border-left:1px solid rgba(247,243,234,.2); }
.mq-foot__logo{ height:40px; width:auto; display:block; }
.mq-boxshot{ width:100%; max-width:340px; height:auto; display:block; margin:0 auto;
  filter:drop-shadow(0 26px 50px rgba(0,0,0,.5)); transition:opacity .3s ease; }
/* account chip + locked-session badges (injected by mq-lock.js) */
.mq-nav__acct{ font-family:var(--sans)!important; font-weight:700; font-size:12.5px!important;
  letter-spacing:.02em!important; text-transform:none!important; color:var(--paper)!important;
  border:1px solid rgba(247,243,234,.28); padding:9px 15px; border-radius:8px; }
.mq-nav__acct:hover{ border-color:var(--vermilion); color:#fff!important; }
.mq-seance.mq-locked{ position:relative; }
.mq-lockbadge{ position:absolute; top:12px; right:12px; z-index:6; font-family:var(--mono);
  font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; background:rgba(14,14,14,.86);
  color:#ffb9a5; border:1px solid rgba(242,48,5,.55); padding:5px 9px; border-radius:20px;
  display:inline-flex; align-items:center; gap:5px; }
.mq-nav__links{ display:flex; gap:28px; align-items:center; flex-wrap:wrap; }
.mq-nav__links a{ font-family:var(--mono); font-size:11px; letter-spacing:.18em;
  text-transform:uppercase; color:#c9c3b7; }
.mq-nav__links a:hover{ color:var(--paper); }
.mq-nav__cta{ font-family:var(--sans)!important; font-weight:700; font-size:12.5px!important;
  letter-spacing:.04em!important; text-transform:none!important;
  background:var(--vermilion); color:var(--paper)!important; padding:11px 20px; }
.mq-nav__cta:hover{ background:var(--crimson); }
@media(max-width:760px){
  .mq-nav__in{ padding:14px 22px; }
  .mq-nav__links{ gap:16px; }
  .mq-nav__links a:not(.mq-nav__cta){ display:none; }
}

/* ---------- mega dropdown (built by mq.js from the catalog) ---------- */
.mq-nav__trigger{ position:relative; }
.mq-nav__trigger::after{ content:"▾"; font-size:9px; margin-left:6px; opacity:.7; }
.mq-mega{ position:fixed; left:0; right:0; top:62px; z-index:99; background:rgba(14,14,14,.985);
  border-top:1px solid var(--line-ink); border-bottom:3px solid var(--vermilion);
  box-shadow:0 34px 70px rgba(0,0,0,.55); overflow:hidden;
  opacity:0; visibility:hidden; transform:translateY(-10px);
  transition:opacity .24s ease, transform .24s ease, visibility .24s; }
.mq-mega.open{ opacity:1; visibility:visible; transform:none; }
.mq-mega__in{ position:relative; z-index:2; max-width:1240px; margin:0 auto; padding:44px 40px 30px;
  display:grid; grid-template-columns:repeat(3,1fr); gap:44px; }
.mq-mega__prog{ display:block; padding-bottom:14px; border-bottom:2px solid rgba(247,243,234,.16); margin-bottom:18px; }
.mq-mega__prog .n{ font-family:var(--sans); font-weight:700; font-size:20px; letter-spacing:-.01em; color:var(--paper); }
.mq-mega__prog .s{ display:block; font-family:var(--mono); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-top:6px; }
.mq-mega__prog:hover .n{ color:var(--vermilion); }
.mq-mega__grp{ margin-bottom:15px; }
.mq-mega__ct{ display:inline-block; font-family:var(--mono); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--vermilion); margin-bottom:7px; }
.mq-mega__ct:hover{ color:var(--paper); }
.mq-mega__list{ list-style:none; margin:0; padding:0; columns:2; column-gap:20px; }
.mq-mega__list li{ break-inside:avoid; }
.mq-mega__list a{ display:block; font-family:var(--serif); font-size:14px; line-height:1.3; color:var(--paper-dim); padding:4px 0; border-left:2px solid transparent; padding-left:0; transition:color .14s ease, border-color .14s ease, padding-left .14s ease; }
.mq-mega__list a:hover{ color:var(--paper); border-left-color:var(--vermilion); padding-left:8px; }
.mq-mega__foot{ position:relative; z-index:2; max-width:1240px; margin:0 auto; padding:16px 40px 20px;
  border-top:1px solid var(--line-ink); display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; }
.mq-mega__foot a{ font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--paper); }
.mq-mega__foot a.mq-red{ color:var(--vermilion); }
.mq-mega__foot a:hover{ color:var(--vermilion); }
@media(max-width:900px){ .mq-mega{ display:none !important; } }

/* ---------- hero ---------- */
.mq-hero{ background:var(--ink); color:var(--paper); position:relative; overflow:hidden;
  min-height:100vh; display:flex; align-items:center; }
.mq-hero__in{ max-width:1480px; margin:0 auto; padding:120px 6vw 90px; width:100%; position:relative; z-index:2; }
.mq-hero__cue{ position:absolute; left:50%; bottom:26px; transform:translateX(-50%);
  font-family:var(--mono); font-size:22px; color:var(--vermilion); }

/* ---------- buttons ---------- */
.mq-btn{ font-family:var(--sans); font-weight:700; font-size:14.5px; letter-spacing:.02em;
  background:var(--vermilion); color:var(--paper); padding:15px 26px; display:inline-block;
  border:0; cursor:pointer; transition:background .16s ease, color .16s ease, transform .16s ease; }
.mq-btn:hover{ background:var(--crimson); color:var(--paper); transform:translateY(-1px); }
.mq-btn--outline{ background:transparent; border:1.5px solid var(--paper); color:var(--paper); padding:13.5px 26px; }
.mq-btn--outline:hover{ background:var(--paper); color:var(--ink); }
.mq-btn--outline-ink{ background:transparent; border:1.5px solid var(--ink); color:var(--ink); padding:13.5px 26px; }
.mq-btn--outline-ink:hover{ background:var(--ink); color:var(--paper); }
.mq-btn--lg{ font-size:16px; padding:18px 34px; }
.mq-btn--sm{ font-size:12px; padding:10px 16px; }
.mq-btn-row{ display:flex; gap:16px; flex-wrap:wrap; }
.mq-cc-actions{ display:flex; gap:10px; margin-top:16px; position:relative; z-index:2; }

/* ---------- course card ---------- */
.mq-course-card{ display:flex; flex-direction:column; background:var(--paper); color:var(--body);
  padding:26px 28px; border-left:5px solid var(--vermilion); text-decoration:none;
  transition:transform .2s cubic-bezier(.16,1,.3,1), box-shadow .2s ease; }
.mq-course-card:hover{ transform:translateY(-6px); box-shadow:0 22px 50px rgba(14,14,14,.16); }
.mq-course-card__tag{ font-family:var(--mono); font-size:10.5px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--vermilion); margin-bottom:12px; }
.mq-course-card__title{ font-family:var(--sans); font-weight:700; font-size:23px;
  letter-spacing:-.01em; color:var(--ink); }
.mq-course-card__desc{ font-family:var(--serif); font-size:14.5px; line-height:1.55; margin:8px 0 18px; flex:1; }
.mq-course-card__foot{ display:flex; justify-content:space-between; align-items:baseline;
  border-top:1px solid var(--line); padding-top:14px; }
.mq-course-card__price{ font-family:var(--mono); font-size:13px; font-weight:700; color:var(--ink); }
.mq-course-card__go{ font-family:var(--sans); font-weight:700; font-size:13.5px; color:var(--vermilion); }
.mq-course-card:hover .mq-course-card__go{ color:var(--crimson); }
.mq-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:22px; }
.mq-grid--2{ grid-template-columns:repeat(auto-fit,minmax(360px,1fr)); }

/* ---------- pull quote / stat ---------- */
.mq-quote{ border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  padding:24px 0; text-align:center; }
.mq-section--ink .mq-quote{ border-color:rgba(247,243,234,.3); }
.mq-stat__n{ font-family:var(--sans); font-weight:700; font-size:clamp(44px,6vw,64px); line-height:.9; }
.mq-stat__n .u{ color:var(--gold); }
.mq-stat__l{ font-family:var(--mono); font-size:11px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--muted); margin-top:10px; }

/* ---------- footer ---------- */
.mq-foot{ background:var(--ink); color:var(--muted); padding:52px 6vw; position:relative; overflow:hidden; }
.mq-foot__in{ max-width:1180px; margin:0 auto; display:flex; justify-content:space-between;
  align-items:center; gap:28px; flex-wrap:wrap; position:relative; z-index:2; }
.mq-foot a{ color:var(--paper-dim); }
.mq-foot__meta{ font-family:var(--mono); font-size:11.5px; letter-spacing:.18em; text-transform:uppercase; }

/* ============================================================
   FORM KIT — custom, on-brand (order + enrollment)
   Default styles assume a PAPER background; add .on-ink on dark.
   ============================================================ */
.mq-form{ max-width:640px; }
.mq-form__row{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media(max-width:620px){ .mq-form__row{ grid-template-columns:1fr; } }
.mq-field{ display:flex; flex-direction:column; margin-bottom:22px; }
.mq-label{ font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--muted); margin-bottom:9px; }
.mq-label .req{ color:var(--vermilion); }
.mq-input,.mq-select,.mq-textarea{ font-family:var(--serif); font-size:16px; color:var(--body);
  background:#fff; border:1.5px solid var(--line); padding:13px 15px; width:100%;
  border-radius:0; transition:border-color .16s ease, box-shadow .16s ease; appearance:none; }
.mq-textarea{ min-height:120px; resize:vertical; }
.mq-select{ background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);
  background-position:calc(100% - 20px) 55%, calc(100% - 14px) 55%; background-size:6px 6px,6px 6px; background-repeat:no-repeat; padding-right:40px; }
.mq-input:focus,.mq-select:focus,.mq-textarea:focus{ outline:none; border-color:var(--vermilion);
  box-shadow:0 0 0 3px rgba(242,48,5,.14); }
.mq-input::placeholder,.mq-textarea::placeholder{ color:#b7b1a6; }
/* on ink */
.mq-form.on-ink .mq-label{ color:var(--paper-dim2); }
.mq-form.on-ink .mq-input,.mq-form.on-ink .mq-select,.mq-form.on-ink .mq-textarea{
  background:rgba(247,243,234,.05); border-color:var(--line-ink); color:var(--paper); }
.mq-form.on-ink .mq-input::placeholder,.mq-form.on-ink .mq-textarea::placeholder{ color:#7d776c; }
.mq-form.on-ink .mq-select{ background-image:linear-gradient(45deg,transparent 50%,var(--paper) 50%),linear-gradient(135deg,var(--paper) 50%,transparent 50%);
  background-position:calc(100% - 20px) 55%, calc(100% - 14px) 55%; background-size:6px 6px,6px 6px; background-repeat:no-repeat; }

/* choice chips (radio / checkbox as bordered options) */
.mq-choices{ display:flex; gap:12px; flex-wrap:wrap; }
.mq-choice{ position:relative; }
.mq-choice input{ position:absolute; opacity:0; inset:0; cursor:pointer; }
.mq-choice__box{ display:block; border:1.5px solid var(--line); padding:13px 18px; cursor:pointer;
  font-family:var(--sans); font-weight:700; font-size:14px; color:var(--ink);
  transition:border-color .16s ease, background .16s ease, color .16s ease; }
.mq-choice__box .sub{ display:block; font-family:var(--mono); font-weight:400; font-size:10.5px;
  letter-spacing:.1em; color:var(--muted); margin-top:5px; text-transform:uppercase; }
.mq-choice input:checked + .mq-choice__box{ border-color:var(--vermilion); background:rgba(242,48,5,.06); }
.mq-choice input:focus-visible + .mq-choice__box{ outline:3px solid var(--gold); outline-offset:2px; }
.mq-form.on-ink .mq-choice__box{ border-color:var(--line-ink); color:var(--paper); }
.mq-form.on-ink .mq-choice input:checked + .mq-choice__box{ background:rgba(242,48,5,.16); border-color:var(--vermilion); }

/* validation */
.mq-input.invalid,.mq-select.invalid,.mq-textarea.invalid{ border-color:var(--crimson); }
.mq-error{ font-family:var(--mono); font-size:11px; letter-spacing:.06em; color:var(--crimson);
  margin-top:7px; min-height:0; display:none; }
.mq-error.show{ display:block; }

/* summary line (e.g. selected course + price) */
.mq-form__summary{ display:flex; justify-content:space-between; align-items:baseline;
  border-top:2px solid var(--ink); padding-top:16px; margin:6px 0 22px; }
.mq-form.on-ink .mq-form__summary{ border-top-color:rgba(247,243,234,.85); }
.mq-form__summary .amt{ font-family:var(--sans); font-weight:700; font-size:22px; color:var(--vermilion); }

/* two-column form layout: form + a visual aside */
.mq-formwrap{ display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(40px,5vw,64px); align-items:start; }
@media(max-width:920px){ .mq-formwrap{ grid-template-columns:1fr; gap:44px; } .mq-formwrap .mq-form{ max-width:none; } }
.mq-aside{ position:sticky; top:30px; }
@media(max-width:920px){ .mq-aside{ position:static; order:-1; } }

/* CSS book-cover mockup (ZÉRO DINAR) */
.mq-book{ width:min(340px,86%); aspect-ratio:2/3; background:var(--ink); color:var(--paper);
  position:relative; overflow:hidden; padding:32px 30px; display:flex; flex-direction:column;
  border:1px solid rgba(247,243,234,.1); box-shadow:26px 26px 0 rgba(242,48,5,.18); }
.mq-book__0{ position:absolute; top:-74px; right:-56px; width:230px; height:auto; pointer-events:none; }
.mq-book__0 text{ font-family:var(--sans); font-weight:700; font-size:150px; fill:none; stroke:var(--vermilion); stroke-width:1.3; opacity:.5; }
.mq-book__top{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; position:relative; z-index:2; }
.mq-book__tag{ font-family:var(--mono); font-size:8.5px; letter-spacing:.2em; text-transform:uppercase; color:#8f897e; max-width:120px; line-height:1.5; }
.mq-book__wm{ font-family:var(--sans); font-weight:700; font-size:15px; }
.mq-book__wm span{ color:var(--vermilion); }
.mq-book__k{ font-family:var(--mono); font-size:9px; letter-spacing:.28em; text-transform:uppercase; color:var(--vermilion); margin-bottom:10px; }
.mq-book__title{ font-family:var(--sans); font-weight:700; font-size:clamp(40px,8vw,54px); line-height:.88; letter-spacing:-.025em; margin:0; position:relative; z-index:2; }
.mq-book__title span{ color:var(--vermilion); }
.mq-book__sub{ font-family:var(--serif); font-size:12.5px; line-height:1.4; color:#d3cdc1; margin:14px 0 0; max-width:32ch; }
.mq-book__author{ margin-top:auto; position:relative; z-index:2; }
.mq-book__author .n{ font-family:var(--sans); font-weight:600; font-size:13px; letter-spacing:.02em; }
.mq-book__author .r{ font-family:var(--mono); font-size:9px; letter-spacing:.06em; color:#8f897e; margin-top:4px; }
.mq-aside__quote{ font-family:var(--serif); font-style:italic; font-size:16px; line-height:1.4; color:var(--body); margin:30px 0 0; border-left:3px solid var(--vermilion); padding-left:16px; }
.mq-section--ink .mq-aside__quote{ color:var(--paper-dim); }

/* 3D book (real spine + page-edge stack) — shared by order form + homepage */
.book{ position:relative; width:335px;margin:auto!important; max-width:100%; aspect-ratio:.66 / 1; margin:6px 0 30px;
  transform:perspective(1700px) rotateY(-15deg) rotateX(1.5deg); transform-origin:center left;
  transition:transform .6s cubic-bezier(.16,1,.3,1); }
.book:hover{ transform:perspective(1700px) rotateY(-6deg); }
.book__cover{ position:absolute; inset:0; background:var(--ink); color:var(--paper); overflow:hidden;
  padding:32px 30px 26px; display:flex; flex-direction:column; border-radius:2px 5px 5px 2px;
  box-shadow:3px 0 0 #e6dfd0, 6px 0 0 #dcd5c4, 9px 0 0 #d0c9b7, 12px 0 0 #c5beac, 0 34px 54px -18px rgba(0,0,0,.62); }
.book__cover::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:18px; z-index:3;
  background:linear-gradient(90deg, rgba(255,255,255,.15), rgba(255,255,255,0) 72%), rgba(0,0,0,.4);
  border-right:1px solid rgba(0,0,0,.5); }
/* the giant "0" — bleeds off the TOP-RIGHT corner, clipped by the cover, exactly like the book */
.book__0{ position:absolute; top:-84px; right:-58px; font-family:var(--sans); font-weight:700;
  font-size:320px; line-height:1; color:transparent; -webkit-text-stroke:2px rgba(242,48,5,.45);
  text-stroke:2px rgba(242,48,5,.45); pointer-events:none; z-index:1; }
.book__top{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; position:relative; z-index:2; padding-left:12px; }
.book__tag{ font-family:var(--mono); font-size:8px; letter-spacing:.18em; text-transform:uppercase; color:#8f897e; max-width:120px; line-height:1.5; }
.book__wm{ font-family:var(--sans); font-weight:700; font-size:14px; } .book__wm span{ color:var(--vermilion); }
.book__k{ font-family:var(--mono); font-size:9px; letter-spacing:.26em; text-transform:uppercase; color:var(--vermilion); position:relative; z-index:2; padding-left:12px; }
.book__title{ font-family:var(--sans); font-weight:700; font-size:clamp(40px,8vw,52px); line-height:.86; letter-spacing:-.025em; margin:8px 0 0; position:relative; z-index:2; padding-left:12px; }
.book__title span{ color:var(--vermilion); }
.book__sub{ font-family:var(--serif); font-size:12px; line-height:1.42; color:#d3cdc1; margin:13px 0 0; max-width:30ch; position:relative; z-index:2; padding-left:12px; }
.book__auth{ position:relative; z-index:2; padding:14px 0 0 12px; border-top:1px solid rgba(247,243,234,.18); margin-top:16px; }
.book__auth .n{ font-family:var(--sans); font-weight:600; font-size:12.5px; letter-spacing:.02em; }
.book__auth .r{ font-family:var(--mono); font-size:8.5px; letter-spacing:.06em; color:#8f897e; margin-top:4px; }
@media(max-width:920px){ .book{ transform:none; margin-inline:auto; } .book:hover{ transform:none; } }

/* mini deck-cover "tease" (mirrors the real course slide) */
.deckcard{ position:relative; overflow:hidden; background:var(--ink); color:var(--paper); aspect-ratio:16 / 9;
  padding:30px 30px 26px; display:flex; flex-direction:column; justify-content:center;
  box-shadow:0 30px 70px -22px rgba(0,0,0,.6), 0 3px 10px rgba(0,0,0,.35); border-radius:2px; }
.deckcard__k{ font-family:var(--mono); font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--vermilion); margin-bottom:14px; }
.deckcard__title{ font-family:var(--sans); font-weight:700; font-size:clamp(26px,3.4vw,36px); line-height:.96; letter-spacing:-.02em; color:var(--paper); }
.deckcard__title .q{ color:var(--vermilion); }
.deckcard__rule{ width:0; height:4px; background:var(--vermilion); margin:16px 0; animation:tease-rule 1s cubic-bezier(.16,1,.3,1) .3s forwards; }
.deckcard__lead{ font-family:var(--serif); font-size:14.5px; line-height:1.5; color:#cfc9bd; max-width:40ch; }
.deckcard__meta{ position:absolute; left:30px; bottom:20px; font-family:var(--mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--vermilion); }
.deckcard__badge{ position:absolute; top:16px; right:18px; font-family:var(--mono); font-size:9px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); border:1px solid rgba(247,243,234,.2); padding:5px 9px; }
.deckcard__wm{ position:absolute; right:26px; bottom:18px; font-family:var(--sans); font-weight:700; font-size:12px; color:#6b655b; }
.deckcard__wm i{ font-style:normal; color:var(--vermilion); }
@keyframes tease-rule{ to{ width:64px; } }

/* ============================================================
   Global preloader — the REAL ZÉRO DINAR cover (verbatim from
   zero-dinar-book-enhanced.html) opens on its spine → MQ-COURSES.
   Injected by mq.js, once per session, reduced-motion safe.
   ============================================================ */
.mq-preloader{ position:fixed; inset:0; z-index:2000; background:var(--ink); display:grid; place-items:center; overflow:hidden; }
.mq-preloader.mq-pre-done{ opacity:0; visibility:hidden; transition:opacity .6s ease, visibility .6s; }
.mq-pl-fit{ position:absolute; top:50%; left:50%; transform-origin:center center; }  /* centred + scaled by mq.js (translate(-50%,-50%) scale) — robust at any viewport */
.mq-pl-scene{ perspective:2900px; perspective-origin:50% 46%;
  animation:mq-pl-slide 1.3s cubic-bezier(.6,0,.12,1) .5s both; }  /* closed book centred → slides right as it opens */
/* the book is the full OPEN spread (2 pages wide); the cover starts folded over the right page */
.mq-pl-book{ position:relative; width:296mm; height:210mm; transform-style:preserve-3d;
  animation:mq-pl-in .6s cubic-bezier(.16,1,.3,1) both; }

/* right page — the MQ-COURSES title page (revealed as the cover opens) */
.mq-pl-page{ position:absolute; top:0; right:0; width:148mm; height:210mm; background:var(--paper); color:var(--ink); overflow:hidden;
  box-shadow:inset 12px 0 30px -16px rgba(0,0,0,.45), 0 24px 55px rgba(0,0,0,.45);
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.mq-pl-page__k{ font-family:var(--mono); font-size:11px; letter-spacing:.34em; text-transform:uppercase; color:var(--vermilion); opacity:0; animation:mq-pl-reveal .6s ease 1.85s both; }
.mq-pl-page__wm{ font-family:var(--sans); font-weight:700; font-size:64px; letter-spacing:-.02em; color:var(--ink); margin-top:16px; opacity:0; animation:mq-pl-reveal .6s ease 1.98s both; }
.mq-pl-page__wm span{ color:var(--vermilion); }
.mq-pl-page__rule{ width:64px; height:4px; background:var(--vermilion); margin:26px 0; opacity:0; animation:mq-pl-reveal .6s ease 2.1s both; }
.mq-pl-page__sub{ font-family:var(--serif); font-style:italic; font-size:18px; color:var(--body); }
/* page text is always present — just uncovered by the opening cover (no fade of its own) */
.mq-pl-page__k, .mq-pl-page__wm, .mq-pl-page__rule, .mq-pl-page__sub{ opacity:1 !important; animation:none !important; }

/* ===== the cover: sits on the right page, hinged on its LEFT edge (the spine = centre),
        swings flat to the left and STAYS (two-sided, like a real book) ===== */
.mq-pl-cover{ position:absolute; top:0; right:0; width:148mm; height:210mm; transform-origin:left center; transform-style:preserve-3d;
  animation:mq-pl-open 1.3s cubic-bezier(.6,0,.12,1) .5s forwards; }
.mq-pl-cover__face{ position:absolute; inset:0; overflow:hidden; backface-visibility:hidden;
  box-shadow:0 24px 55px rgba(0,0,0,.5), 0 0 0 1px rgba(247,243,234,.1); }
.mq-pl-cover__front{ background:var(--ink); color:var(--paper); }
/* the inside of the cover (endpaper) — what you see once it's opened to the side */
/* underside of the cover — the hero pitch, revealed as the cover opens */
.mq-pl-cover__back{ transform:rotateY(180deg); background:var(--ink); color:var(--paper); }
.mq-pl-cover__back .bk-inner{ position:absolute; inset:0; padding:44px 40px; display:flex; flex-direction:column; justify-content:center; }
.mq-pl-cover__back .bk-k{ font-family:var(--mono); font-size:11px; letter-spacing:.32em; text-transform:uppercase; color:var(--vermilion); margin-bottom:18px; }
.mq-pl-cover__back .bk-t{ font-family:var(--sans); font-weight:700; font-size:60px; line-height:.9; letter-spacing:-.02em; margin:0; color:var(--paper); }
.mq-pl-cover__back .bk-t span{ color:var(--vermilion); }
.mq-pl-cover__back .bk-sub{ font-family:var(--serif); font-size:16px; line-height:1.45; color:var(--paper-dim2); max-width:320px; margin:24px 0 0; }
/* spine crease down the hinge of the cover */
.mq-pl-cover::after{ content:""; position:absolute; left:0; top:0; bottom:0; width:20px; z-index:6; pointer-events:none;
  background:linear-gradient(90deg, rgba(0,0,0,.5), transparent 85%); }

/* the EXACT .frontcover (verbatim), scoped to the front face */
.mq-pl-cover .fc-zero{ position:absolute; top:-140px; right:-70px; font-family:var(--sans); font-weight:700; font-size:640px; line-height:1; color:transparent; -webkit-text-stroke:2px rgba(242,48,5,.42); pointer-events:none; }
.mq-pl-cover .fc-inner{ position:absolute; inset:0; padding:40px 38px; display:flex; flex-direction:column; z-index:2; }
.mq-pl-cover .fc-top{ display:flex; justify-content:space-between; align-items:flex-start; }
.mq-pl-cover .fc-top .tag{ font-family:var(--mono); font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:#8f897e; max-width:200px; line-height:1.6; }
.mq-pl-cover .wm{ font-family:var(--sans); font-weight:700; letter-spacing:-.01em; font-size:19px; }
.mq-pl-cover .wm i{ color:var(--crimson); font-style:normal; }
.mq-pl-cover .fc-kicker{ font-family:var(--mono); font-size:11px; letter-spacing:.32em; color:var(--vermilion); margin-bottom:16px; }
.mq-pl-cover .fc-title{ font-family:var(--sans); font-weight:700; font-size:80px; line-height:.9; letter-spacing:-.025em; margin:0; }
.mq-pl-cover .fc-title span{ color:var(--vermilion); }
.mq-pl-cover .fc-sub{ font-family:var(--serif); font-size:17px; line-height:1.42; max-width:320px; margin:22px 0 8px; color:#d3cdc1; }
.mq-pl-cover .fc-fr{ font-family:var(--mono); font-size:11px; letter-spacing:.04em; color:#7d776c; margin:0; }
.mq-pl-cover .fc-author{ border-top:1px solid rgba(247,243,234,.18); padding-top:16px; }
.mq-pl-cover .fc-author .n{ font-family:var(--sans); font-weight:600; font-size:16px; letter-spacing:.02em; }
.mq-pl-cover .fc-author .r{ font-family:var(--mono); font-size:11px; letter-spacing:.08em; color:#8f897e; margin-top:5px; }

@keyframes mq-pl-in{ from{ opacity:0; transform:translateY(22px) scale(.965); } to{ opacity:1; transform:none; } }
@keyframes mq-pl-open{ 0%{ transform:rotateY(0); } 100%{ transform:rotateY(-170deg); } }
@keyframes mq-pl-slide{ from{ transform:translateX(-74mm); } to{ transform:translateX(0); } }
/* the revealed page text is simply uncovered by the opening cover — no fade of its own */
@keyframes mq-pl-reveal{ from{ opacity:1; transform:none; } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce){ .mq-preloader{ display:none !important; } }

/* "what's included" aside panel */
.mq-incl{ border:1px solid var(--line); border-top:4px solid var(--vermilion); background:#fff; padding:30px 30px 26px; }
.mq-section--ink .mq-incl{ background:rgba(247,243,234,.04); border-color:var(--line-ink); border-top-color:var(--vermilion); }
.mq-incl__k{ font-family:var(--mono); font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--vermilion); margin-bottom:16px; }
.mq-incl__list{ list-style:none; margin:0; padding:0; }
.mq-incl__list li{ font-family:var(--serif); font-size:15.5px; line-height:1.5; padding:10px 0 10px 26px; position:relative; border-bottom:1px solid var(--line); }
.mq-section--ink .mq-incl__list li{ border-bottom-color:rgba(247,243,234,.12); }
.mq-incl__list li::before{ content:"→"; position:absolute; left:0; color:var(--vermilion); font-family:var(--sans); font-weight:700; }

/* success panel (shown after submit) */
.mq-success{ display:none; border-left:5px solid var(--vermilion); background:#fff; padding:34px 32px; }
.mq-form.on-ink ~ .mq-success,.mq-success.on-ink{ background:rgba(247,243,234,.05); color:var(--paper); }
.mq-success.show{ display:block; animation:mq-rise .6s cubic-bezier(.16,1,.3,1); }
.mq-success h3{ font-family:var(--sans); font-weight:700; font-size:28px; letter-spacing:-.01em; color:var(--ink); margin-bottom:10px; }
.mq-success.on-ink h3{ color:var(--paper); }
.mq-success p{ font-family:var(--serif); font-size:16px; line-height:1.6; }

/* ---------- wax-seal "verrouillé" course cards (verbatim from the export) ----------
   Each card has two draped chain straps (upright chain pattern, the STRAP is rotated).
   On hover/focus the straps slide off along their axis and the lock tag fades. */
[data-strap="a"]{ transform:translateX(var(--oa,0%)) rotate(var(--sa,-24deg)); }
[data-strap="b"]{ transform:translateX(var(--ob,0%)) rotate(var(--sb,11deg)); }
[data-locked]{ transition:transform .55s cubic-bezier(.16,1,.3,1), box-shadow .55s ease; }
[data-locked]:hover, [data-locked]:focus-within{ transform:translateY(-8px) scale(1.035); box-shadow:0 30px 70px rgba(14,14,14,.38); z-index:3; }
[data-locked]:hover [data-strap="a"], [data-locked]:focus-within [data-strap="a"]{ transform:translateX(var(--oa,0%)) rotate(var(--sa,-24deg)) translateX(var(--da,-185%)); }
[data-locked]:hover [data-strap="b"], [data-locked]:focus-within [data-strap="b"]{ transform:translateX(var(--ob,0%)) rotate(var(--sb,11deg)) translateX(var(--db,185%)); }
[data-locked]:hover [data-lock-tag], [data-locked]:focus-within [data-lock-tag]{ opacity:0; transform:translateY(-8px); }
@media (prefers-reduced-motion: reduce){
  [data-strap], [data-lock-tag]{ transition:none !important; }
  [data-locked]:hover, [data-locked]:focus-within{ transform:none; }
}

/* ---------- wax-seal cards + marquee (class-based, shared by homepage + catalog) ---------- */
.mq-lock{ position:relative; overflow:hidden; isolation:isolate;
  transition:transform .55s cubic-bezier(.16,1,.3,1), box-shadow .55s ease; }
.mq-lock:hover, .mq-lock:focus-visible, .mq-lock:focus-within{ transform:translateY(-8px) scale(1.035);
  box-shadow:0 30px 70px rgba(14,14,14,.38); z-index:3; }
.mq-course-card--ink{ background:var(--ink); color:var(--paper); border-left:5px solid var(--vermilion); }
.mq-course-card--ink .mq-course-card__title, .mq-course-card--ink .mq-course-card__price{ color:var(--paper); }
.mq-course-card--ink .mq-course-card__desc{ color:#a8a294; }
.mq-course-card--ink .mq-course-card__foot{ border-top-color:rgba(247,243,234,.18); }
.mq-course-card--ink .per{ color:var(--muted); font-weight:400; }
.mq-lock__tag{ position:absolute; top:14px; right:14px; z-index:4; font-family:var(--mono); font-size:9px;
  letter-spacing:.22em; color:var(--vermilion); border:1px solid rgba(242,48,5,.5); padding:5px 8px;
  transition:opacity .4s ease, transform .4s ease; pointer-events:none; }
.mq-lock:hover .mq-lock__tag, .mq-lock:focus-visible .mq-lock__tag, .mq-lock:focus-within .mq-lock__tag{ opacity:0; transform:translateY(-8px); }
.mq-strap{ position:absolute; left:-45%; width:190%; height:150px; margin-top:-75px; transform-origin:50% 50%;
  pointer-events:none; z-index:-1; transition:transform .7s cubic-bezier(.5,0,.12,1); }
.mq-strap .mq-chain{ right:auto; width:calc(100% + 120px); opacity:.32;
  animation-name:mq-chain-slide; animation-timing-function:linear; animation-iteration-count:infinite; }
.mq-strap--a{ transform:translateX(var(--oa,0%)) rotate(var(--sa,-24deg)); }
.mq-strap--b{ transform:translateX(var(--ob,0%)) rotate(var(--sb,11deg)); }
.mq-lock:hover .mq-strap--a, .mq-lock:focus-visible .mq-strap--a, .mq-lock:focus-within .mq-strap--a{ transform:translateX(var(--oa,0%)) rotate(var(--sa,-24deg)) translateX(var(--da,-185%)); }
.mq-lock:hover .mq-strap--b, .mq-lock:focus-visible .mq-strap--b, .mq-lock:focus-within .mq-strap--b{ transform:translateX(var(--ob,0%)) rotate(var(--sb,11deg)) translateX(var(--db,185%)); }
.mq-marquee{ background:var(--ink); height:132px; overflow:hidden; position:relative;
  border-top:1px solid var(--line-ink); border-bottom:1px solid var(--line-ink); }
.mq-marquee .mq-chain{ right:auto; width:calc(100% + 140px); opacity:.4; animation:mq-chain-slide 6.5s linear infinite; }
@media (prefers-reduced-motion: reduce){
  .mq-lock, .mq-strap, .mq-lock__tag{ transition:none !important; }
  .mq-lock:hover, .mq-lock:focus-visible, .mq-lock:focus-within{ transform:none; box-shadow:none; }
}

/* ---------- rich séance "poster" cards (storefronts) ---------- */
.mq-seances{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; counter-reset:seance; margin-top:42px; }
@media(max-width:760px){ .mq-seances{ grid-template-columns:1fr; } }
.mq-seance{ counter-increment:seance; position:relative; overflow:hidden; isolation:isolate; min-width:0;
  display:flex; flex-direction:column; min-height:200px; background:var(--ink); color:var(--paper);
  border-left:5px solid var(--vermilion); padding:30px 28px 24px; text-decoration:none;
  box-shadow:0 0 0 1px rgba(247,243,234,.07), 0 16px 34px -20px rgba(0,0,0,.55);
  transition:transform .24s cubic-bezier(.16,1,.3,1), box-shadow .24s ease; }
.mq-seance:hover{ transform:translateY(-7px);
  box-shadow:0 0 0 1px rgba(242,48,5,.55), 0 30px 60px -22px rgba(0,0,0,.65); }
.mq-seance .mq-chain{ opacity:.12; z-index:0; transition:opacity .32s ease; }
.mq-seance:hover .mq-chain{ opacity:.28; }
.mq-seance__num{ position:absolute; top:-10px; right:12px; z-index:1; font-family:var(--sans); font-weight:700;
  font-size:110px; line-height:1; color:rgba(247,243,234,.05); pointer-events:none; }
.mq-seance__num::before{ content:counter(seance,decimal-leading-zero); }
.mq-seance__tag{ position:relative; z-index:2; font-family:var(--mono); font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--vermilion); }
.mq-seance__title{ position:relative; z-index:2; font-family:var(--sans); font-weight:700; font-size:21px; line-height:1.06; letter-spacing:-.01em; color:var(--paper); margin:11px 0 0; }
.mq-seance__desc{ position:relative; z-index:2; font-family:var(--serif); font-size:14.5px; line-height:1.5; color:#a8a294; margin:11px 0 22px; flex:1; }
.mq-seance__go{ position:relative; z-index:2; font-family:var(--sans); font-weight:700; font-size:13px; letter-spacing:.02em; color:var(--vermilion); margin-top:auto; }
.mq-seance:hover .mq-seance__go{ text-decoration:underline; text-underline-offset:3px; }

/* ---------- FAQ — built from charte devices (mono index · Grotesk question · Newsreader answer) ---------- */
.faq-grid{ display:grid; grid-template-columns:1fr 1fr; gap:46px 60px; margin-top:16px; }
@media(max-width:720px){ .faq-grid{ grid-template-columns:1fr; gap:36px; } }
.faq-q{ border-top:2px solid var(--ink); padding-top:20px; }
.mq-section--ink .faq-q{ border-top-color:rgba(247,243,234,.85); }
.faq-q__k{ font-family:var(--mono); font-size:12px; font-weight:700; letter-spacing:.16em; color:var(--vermilion); margin-bottom:14px; }
.faq-q__q{ font-family:var(--sans); font-weight:700; font-size:clamp(20px,2.2vw,23px); line-height:1.06; letter-spacing:-.01em; color:var(--ink); margin:0; }
.mq-section--ink .faq-q__q{ color:var(--paper); }
.faq-q__a{ font-family:var(--serif); font-size:16px; line-height:1.62; color:var(--body); margin:13px 0 0; }
.mq-section--ink .faq-q__a{ color:var(--paper-dim); }
.faq-q__a b{ color:var(--ink); } .mq-section--ink .faq-q__a b{ color:var(--paper); }

/* ---------- reveal keyframes (mq.js replays on intersect) ---------- */
@keyframes mq-rise{ from{ opacity:0; transform:translateY(30px); } to{ opacity:1; transform:none; } }
@keyframes mq-zero-in{ from{ opacity:0; transform:translate(90px,-50px); } to{ opacity:1; transform:none; } }
@keyframes mq-cue{ 0%,100%{ transform:translate(-50%,0); opacity:.45; } 50%{ transform:translate(-50%,10px); opacity:1; } }
@keyframes mq-chain-slide{ from{ transform:translateX(0); } to{ transform:translateX(-120px); } }
.mq-hero__cue{ animation:mq-cue 1.8s ease-in-out infinite; }

/* resting state is ALWAYS visible — if JS never runs, nothing is stranded hidden */
[data-rise]{ opacity:1; }

/* ---------- chain-invert toggle (optional control) ---------- */
.mq-chain-toggle{ position:fixed; right:24px; bottom:24px; z-index:60; display:flex; align-items:center;
  gap:11px; background:var(--ink); color:var(--paper); border:1px solid rgba(247,243,234,.3);
  padding:13px 18px; font-family:var(--mono); font-size:10.5px; letter-spacing:.2em;
  text-transform:uppercase; cursor:pointer; box-shadow:0 12px 34px rgba(0,0,0,.4); }
.mq-chain-toggle:hover{ border-color:var(--vermilion); color:var(--vermilion); }
.mq-chain-toggle .dot{ width:9px; height:9px; border-radius:50%; background:var(--vermilion); }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ animation:none !important; }
  .mq-course-card, .mq-btn{ transition:none !important; }
}