
:root{
  --bg:#043F49;--bg2:#075F6D;--paper:#F5F2EA;--ink:#182724;--body:#35423f;
  --muted:#74807c;--accent:#AA604D;--line:rgba(24,39,36,.15);--shadow:rgba(0,0,0,.28);
  --max:1180px;--pageh:747px;--body-size:17px;--title-size:24px;--subhead-size:22px;--bullet-size:19px;
}
*{box-sizing:border-box}html{background:var(--bg2);scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(circle at 50% 16%,rgba(3,195,232,.18),transparent 38%),linear-gradient(180deg,var(--bg),var(--bg2));}a{color:inherit}button{font:inherit;cursor:pointer}
.site-header{display:none;position:fixed;z-index:100;top:0;left:0;right:0;height:58px;background:rgba(4,63,73,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.10);color:#f6f3ec}.book-open .site-header{display:block}.header-inner{height:100%;width:min(var(--max),calc(100% - 36px));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:22px}.brand{font:600 20px/1 Georgia,serif;text-decoration:none;letter-spacing:-.02em}.top-nav{display:flex;gap:8px;align-items:center;font-size:13px}.top-nav a{padding:8px 10px;border-radius:99px;text-decoration:none;color:rgba(255,255,255,.78)}.top-nav a:hover,.top-nav a:focus-visible{background:rgba(255,255,255,.08);color:#fff;outline:none}.top-nav .primary{border:1px solid rgba(255,255,255,.22);color:#fff}
/* COVER */
.cover-view{min-height:100vh;display:grid;place-items:center;padding:24px;overflow:hidden}.book-open .cover-view{display:none}.cover-fit{width:590px;height:747px;transform-origin:center center;will-change:transform}.closed-cover{position:relative;width:590px;height:747px;border-radius:4px 16px 16px 4px;background:var(--cover-gradient);color:var(--paper);box-shadow:0 34px 60px rgba(0,0,0,.34),inset 18px 0 24px rgba(0,0,0,.22),inset -2px 0 0 rgba(255,255,255,.08)}.closed-cover:before{content:"";position:absolute;left:16px;top:16px;bottom:16px;width:2px;border-radius:2px;background:rgba(245,242,234,.16);box-shadow:8px 0 18px rgba(0,0,0,.22)}.cover-title{position:absolute;top:48px;left:74px;right:64px;margin:0 auto;max-width:430px;text-align:center;font:500 38px/1.08 Georgia,serif;letter-spacing:-.025em}.cover-subtitle{position:absolute;top:218px;left:74px;right:64px;margin:0 auto;max-width:470px;text-align:center;color:rgba(245,242,234,.80);font-size:15px;line-height:1.55}.cover-subtitle .site-url{display:block;margin-top:3px;font-weight:750;color:var(--paper);white-space:nowrap}.cover-prompt{position:absolute;left:74px;right:64px;bottom:326px;text-align:center;color:rgba(245,242,234,.90);font-size:15px;line-height:1.35;font-weight:650}.cover-actions{position:absolute;left:74px;right:64px;bottom:270px;display:flex;justify-content:center;gap:10px}.cover-btn{border:1px solid rgba(245,242,234,.46);border-radius:999px;padding:11px 16px;color:var(--paper);font-size:13px;font-weight:750;background:rgba(255,255,255,.05)}.cover-btn:hover,.cover-btn:focus-visible{background:rgba(255,255,255,.15);outline:2px solid rgba(245,242,234,.45);outline-offset:2px}
/* BOOK */
.home-story{display:none;position:relative}.book-open .home-story{display:block}.home-stage{position:sticky;top:58px;height:calc(100vh - 58px);min-height:0;display:block;overflow:hidden;padding:22px 20px 28px}.book-fit-content{position:absolute;left:50%;top:0;width:var(--max);margin-left:calc(var(--max)/-2);transform-origin:top center;will-change:transform}.book-shell{width:var(--max);filter:drop-shadow(0 28px 42px var(--shadow));overflow:visible}.book{width:var(--max);height:var(--pageh);display:grid;grid-template-columns:1fr 1fr;position:relative;overflow:visible;perspective:2200px;transform-style:preserve-3d}.book-page{position:relative;overflow:hidden;background:var(--paper);border:1px solid rgba(33,45,42,.12)}.book-left{border-radius:8px 0 0 8px;z-index:3}.book-right{border-radius:0 8px 8px 0;z-index:2}.book-paper-shade{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 44%,rgba(255,255,255,.32),transparent 69%)}.book-copy{position:absolute;inset:6.333333% 5.25% 7% 5.75%;overflow:hidden;color:var(--body);font-size:var(--body-size);line-height:1.58;display:flex;flex-direction:column;justify-content:center}.normal-line{margin:0;padding:0;min-height:1.58em;font:inherit;color:var(--body)}.book-copy h2{margin:0 0 18px;color:var(--ink);font:500 var(--title-size)/1.02 Georgia,serif;letter-spacing:-.025em;text-wrap:balance}.book-copy h3.subhead{margin:0 0 7px;color:var(--ink);font:600 var(--subhead-size)/1.22 Georgia,serif}.book-copy .cap{margin:0 0 14px;color:var(--accent);font-size:15px;line-height:1.3;font-weight:750;text-transform:uppercase;letter-spacing:.14em}.book-copy .bullet{position:relative;margin:0 0 12px;padding-left:18px;color:var(--body)}.book-copy .bullet:before{content:"•";position:absolute;left:0;top:0;width:18px;height:26.86px;display:flex;align-items:center;justify-content:center;color:#111;font-size:var(--bullet-size);line-height:1;font-weight:900}.book-copy .separator{height:1px;min-height:1px;margin:17px 0;background:var(--line)}.book-copy .review-change{color:#2D63B8!important}.book-copy h2.review-change,.book-copy h3.review-change{color:#2D63B8!important}.book-copy .bullet.review-change:before{color:#2D63B8}.book-copy .questionnaire-cta{display:flex;align-items:center;justify-content:center;min-height:48px;margin-top:6px;border:1px solid var(--ink);border-radius:7px;padding:11px 14px;text-decoration:none;color:var(--ink);font-weight:760;background:rgba(255,255,255,.2)}.book-copy .questionnaire-cta:hover,.book-copy .questionnaire-cta:focus-visible{background:var(--ink);color:var(--paper);outline:none}.book-copy .questionnaire-cta.review-change{border-color:#2D63B8;color:#2D63B8}.book-copy .questionnaire-cta.review-change:hover{background:#2D63B8;color:#fff}.book-scene{position:absolute;inset:0;display:grid;place-items:center;padding:7%}.book-scene img,.turn-front img{width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}.book-num{position:absolute;bottom:3.5%;font-size:11px;color:#8b9692;letter-spacing:.08em}.book-left .book-num{left:5.75%}.book-right .book-num{right:5.25%}.turn-page{position:absolute;left:50%;top:0;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;-webkit-transform-style:preserve-3d;z-index:30;pointer-events:none;will-change:transform;visibility:hidden}.turn-front,.turn-back{position:absolute;inset:0;overflow:hidden;background:var(--paper);border-top:1px solid rgba(33,45,42,.12);border-right:1px solid rgba(33,45,42,.12);border-bottom:1px solid rgba(33,45,42,.12)}.turn-front{backface-visibility:visible;-webkit-backface-visibility:visible;border-radius:0 8px 8px 0;display:grid;place-items:center;padding:7%}.turn-back{backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:rotateY(180deg);border-radius:0 8px 8px 0}.turn-front-backtext{position:absolute;inset:0;opacity:0;pointer-events:none;transform:scaleX(-1)}.turn-front-backtext .book-copy,.turn-back-inner .book-copy{position:absolute;inset:6.333333% 5.25% 7% 5.75%}.turn-front-backtext .book-num,.turn-back-inner .book-num{left:5.75%}.turn-back-inner{position:absolute;inset:0}.curl{position:absolute;inset:0;pointer-events:none;opacity:0;background:linear-gradient(92deg,transparent 0%,rgba(255,255,255,.52) 44%,rgba(45,52,49,.12) 58%,transparent 74%);mix-blend-mode:multiply}.gutter{position:absolute;z-index:80;left:50%;top:1.1%;bottom:1.1%;width:24px;transform:translateX(-50%);background:linear-gradient(90deg,transparent 0%,rgba(25,33,31,.07) 27%,rgba(25,33,31,.19) 48%,rgba(255,255,255,.17) 56%,transparent 100%);pointer-events:none;opacity:.82}.book-ui{width:var(--max);margin:13px auto 0;color:rgba(244,244,239,.75);display:grid;grid-template-columns:1fr minmax(150px,260px) auto;gap:15px;align-items:center;font-size:11px}.progress-track{height:2px;background:rgba(255,255,255,.16);overflow:hidden;border-radius:999px}.progress-fill{height:100%;width:0;background:rgba(255,255,255,.8)}
/* VERTICAL */
.home-mobile{display:none;padding:82px 14px 50px;background:var(--bg2)}.vertical-mode.book-open .home-story{display:block!important;position:absolute!important;top:0;left:0;width:100%;height:100vh!important;overflow:hidden!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important;z-index:-1!important}.vertical-mode.book-open .home-mobile{display:block}.mobile-paper{width:min(760px,100%);margin:0 auto;background:var(--paper);border-radius:8px;overflow:hidden;box-shadow:0 24px 48px rgba(0,0,0,.22)}.mobile-section{padding:34px 24px;border-top:1px solid var(--line)}.mobile-section:first-child{border-top:0}.mobile-section .book-copy-mobile{color:var(--body);font-size:16px;line-height:1.65}.mobile-section .normal-line{min-height:1.65em}.mobile-section h2{font:500 25px/1.05 Georgia,serif;margin:0 0 16px;color:var(--ink)}.mobile-section .bullet{position:relative;padding-left:18px;margin:0 0 12px}.mobile-section .bullet:before{content:"•";position:absolute;left:0;font-weight:900}.mobile-section .review-change{color:#2D63B8!important}.mobile-scene{display:grid;place-items:center;min-height:220px;padding:16px}.mobile-scene img{width:100%;max-height:290px;object-fit:contain}.mobile-section .questionnaire-cta{display:flex;align-items:center;justify-content:center;min-height:48px;margin-top:12px;border:1px solid var(--ink);border-radius:7px;padding:11px 14px;text-decoration:none;color:var(--ink);font-weight:760}
.review-note{display:none;position:fixed;z-index:130;right:14px;bottom:14px;background:#eef4ff;border:1px solid #9bb8e8;color:#234c8c;border-radius:8px;padding:9px 12px;font-size:12px;box-shadow:0 8px 22px rgba(0,0,0,.16)}.style-review .review-note{display:block}
@media(max-width:680px){.header-inner{width:calc(100% - 22px);gap:8px}.brand{font-size:17px}.top-nav{font-size:12px;gap:2px}.top-nav a{padding:7px 8px}.top-nav a:first-child{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.turn-page{display:none}.book-scene img{opacity:1!important}}

/* V31 — navigation minimale + marque stylisée */
.header-inner{justify-content:center!important}
.top-nav{display:none!important}
.brand{font-family:"Palatino Linotype","Book Antiqua",Palatino,Georgia,serif!important;font-size:25px!important;font-weight:700!important;font-style:italic;letter-spacing:.025em!important;text-decoration:none!important;color:#f7f0df!important;text-shadow:0 1px 0 rgba(0,0,0,.35),0 0 14px rgba(231,206,148,.16)}
.brand:hover,.brand:focus-visible{color:#fff8e8!important;text-shadow:0 1px 0 rgba(0,0,0,.35),0 0 18px rgba(231,206,148,.32);outline:none}
.book-copy .questionnaire-cta,.mobile-section .questionnaire-cta{position:relative;z-index:120;pointer-events:auto!important;touch-action:manipulation;cursor:pointer}


/* V33 — couverture eau importée du prototype V05 ; moteur/livre/questionnaires V32 inchangés */
.water-cover-view{padding:0 18px;background:radial-gradient(circle at 50% 16%,rgba(3,195,232,.18),transparent 38%),linear-gradient(180deg,var(--bg),var(--bg2))}
.water-cover-fit{width:590px;height:747px;display:grid;place-items:center}
.water-cover-frame{position:relative;width:560px;height:747px;aspect-ratio:1086/1448}
.water-cover-image{display:block;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 28px 44px rgba(0,0,0,.34))}
.water-cover-hit{position:absolute;z-index:8;border:0;background:transparent;padding:0;margin:0;border-radius:999px;cursor:pointer;-webkit-tap-highlight-color:transparent;color:transparent}
.water-cover-hit:hover,.water-cover-hit:focus-visible{outline:2px solid rgba(245,242,234,.55);outline-offset:3px;background:rgba(255,255,255,.035)}
.water-cover-hit-student{left:24.68%;top:82.60%;width:23.02%;height:5.04%}
.water-cover-hit-nonstudent{left:48.90%;top:82.60%;width:27.72%;height:5.04%}
.water-cover-association-patch{position:absolute;z-index:7;left:27.2%;top:22.2%;width:47.5%;min-height:8.1%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#f3eee2;font-family:Georgia,"Times New Roman",serif;font-size:15px;line-height:1.42;background:radial-gradient(ellipse at center,rgba(9,44,34,.995) 0%,rgba(8,41,31,.985) 58%,rgba(8,41,31,.90) 78%,rgba(8,41,31,0) 100%);text-shadow:0 1px 1px rgba(0,0,0,.35)}
.water-cover-association-patch strong{font-size:16px;font-weight:500;margin-top:2px}
@media(max-width:680px){.water-cover-view{padding:0 8px}}

/* Atelier central V34: le header global est fourni par la coque principale. */
body.tool-embedded .site-header{display:none!important}
body.tool-embedded.book-open .home-stage{top:0!important;height:100vh!important}
body.tool-embedded .home-mobile{padding-top:24px!important}


/* V40 — couverture commune comic : image 1536×2048, hotspots en coordonnées normalisées */
.comic-cover-view{padding:0 18px;background:radial-gradient(circle at 50% 16%,rgba(3,195,232,.18),transparent 38%),linear-gradient(180deg,var(--bg),var(--bg2))}
.comic-cover-fit{width:590px;height:747px;display:grid;place-items:center}
.comic-cover-frame{position:relative;height:747px;aspect-ratio:3/4;max-width:100%;overflow:hidden;border-radius:8px}
.comic-cover-image{display:block;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 28px 44px rgba(0,0,0,.34));transform:scale(1.002);transform-origin:center center;border-radius:8px}
.comic-cover-hit{position:absolute;z-index:12;border:0;background:transparent;padding:0;margin:0;border-radius:999px;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;color:transparent}
.comic-cover-hit:hover,.comic-cover-hit:focus-visible{outline:3px solid rgba(255,255,255,.72);outline-offset:3px;background:rgba(255,255,255,.035)}
/* Hotspots calculés sur le master 1536×2048 ; ils suivent donc exactement tout redimensionnement proportionnel. */
.comic-cover-hit-student{left:25.4%;top:61.41%;width:49.0%;height:7.4%}
.comic-cover-hit-nonstudent{left:22.5%;top:72.72%;width:57.1%;height:7.4%}
@media(max-width:680px){.comic-cover-view{padding:0 8px}}

/* V41 — correction bord gauche du PNG sans modifier le master + hotspots homogènes */

/* V42 — hotspots robustes dans iframe/Safari */
.comic-cover-image{pointer-events:none!important}
.comic-cover-hit{display:block!important;pointer-events:auto!important;text-decoration:none!important;-webkit-user-select:none;user-select:none}
.comic-cover-frame{isolation:isolate}

/* V44 — test couverture arrondie uniquement à droite + typographie du livre rapprochée de la couverture comic.
   Les questionnaires restent volontairement inchangés. */
:root{
  --book-comic-body:"Trebuchet MS","Arial Rounded MT Bold","Comic Sans MS",sans-serif;
  --book-comic-display:"Arial Rounded MT Bold","Trebuchet MS","Comic Sans MS",sans-serif;
}
/* Couverture : tranche gauche droite/carrée, seulement les coins extérieurs droits sont arrondis. */
.comic-cover-frame{border-radius:0 8px 8px 0!important}
.comic-cover-image{border-radius:0 8px 8px 0!important}

/* Livre ouvert : typographie plus ronde/comic sans toucher au questionnaire. */
.book-copy,
.book-copy .normal-line,
.book-copy .bullet,
.book-copy .questionnaire-cta,
.book-num,
.book-ui,
.mobile-section .book-copy-mobile,
.mobile-section .normal-line,
.mobile-section .bullet,
.mobile-section .questionnaire-cta{
  font-family:var(--book-comic-body)!important;
}
.book-copy h2,
.book-copy h3.subhead,
.book-copy .cap,
.mobile-section h2,
.mobile-section h3.subhead,
.mobile-section .cap{
  font-family:var(--book-comic-display)!important;
  font-weight:700!important;
  letter-spacing:0!important;
}

/* V50.2 — correctif Aix : empêcher les éléments du texte de se compresser
   verticalement quand certaines lignes se replient avec la police comic.
   La pagination et l'ordre des images restent inchangés. */
.book-copy > h2,
.book-copy > h3,
.book-copy > .normal-line,
.book-copy > .bullet,
.book-copy > .cap,
.book-copy > .separator,
.book-copy > .questionnaire-cta{
  flex-shrink:0!important;
}
.book-copy .normal-line.v502-blank-line{
  min-height:.86em!important;
  height:.86em!important;
  line-height:.86!important;
}
.book-copy.v502-fit-measure{
  justify-content:flex-start!important;
}


/* V50 mobile cover fix — no transform scaling on phones.
   The comic cover is sized directly from the visible viewport so it stays
   centered, fully visible and proportional on iPhone/Android. */
@media (max-width:680px){
  html,body{max-width:100%;overflow-x:hidden}
  body.cover-mode{min-height:100vh}
  .cover-view.comic-cover-view{
    width:100%;
    min-height:100vh;
    height:100vh;
    padding:8px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
  }
  .comic-cover-fit{
    width:calc(100vw - 16px);
    max-width:min(560px,calc((100vh - 16px) * .75));
    height:auto;
    aspect-ratio:3/4;
    display:block;
    flex:0 0 auto;
    transform:none!important;
    margin:0 auto;
  }
  .comic-cover-frame{
    width:100%;
    height:100%;
    max-width:none;
    aspect-ratio:3/4;
    margin:0;
  }
  .comic-cover-image{width:100%;height:100%;object-fit:contain}
}
@supports (height:100svh){
  @media (max-width:680px){
    body.cover-mode{min-height:100svh}
    .cover-view.comic-cover-view{min-height:100svh;height:100svh}
    .comic-cover-fit{max-width:min(560px,calc((100svh - 16px) * .75))}
  }
}

/* V50.9 — média vidéo responsive sur la page droite. */
.book-video-overlay{position:absolute;left:50%;top:0;width:50%;height:100%;z-index:42;display:grid;place-items:center;padding:7%;pointer-events:auto;background:var(--paper);overflow:hidden}
.book-video-overlay[hidden]{display:none!important}
.book-video-overlay iframe,.book-video-overlay video{width:100%;max-width:100%;aspect-ratio:16/9;border:0;border-radius:7px;background:#000;box-shadow:0 10px 26px rgba(0,0,0,.16)}
.book-video-overlay video{height:auto;max-height:100%;object-fit:contain}
.mobile-scene iframe,.mobile-scene video{width:100%;max-width:100%;aspect-ratio:16/9;border:0;border-radius:7px;background:#000}
.mobile-section.is-blank{min-height:420px}

/* V50.12 — nom du site : police distincte de référence. */
.site-header .brand{font-family:"Arial Rounded MT Bold","Trebuchet MS","Arial Black",Impact,Haettenschweiler,sans-serif!important;font-size:clamp(23px,2.4vw,31px)!important;font-weight:900!important;font-style:normal!important;line-height:1!important;letter-spacing:-.025em!important;color:#fff!important;-webkit-text-stroke:1.4px #0b0b0b;paint-order:stroke fill;text-shadow:0 3px 0 #0b0b0b,0 0 2px #0b0b0b!important;text-decoration:none!important}

.book-video-local-preview{width:82%;max-width:460px;aspect-ratio:16/9;border-radius:8px;background:#111;display:grid;place-items:center;padding:24px;text-align:center;box-shadow:0 8px 22px rgba(0,0,0,.16)}
.book-video-local-preview a{color:#fff;text-decoration:none;font-weight:800;line-height:1.45}

/* V50.13 — lien externe vidéo */
.book-copy .external-link-marker,.mobile-section .external-link-marker{color:#195e8a;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;overflow-wrap:anywhere;cursor:pointer;pointer-events:auto;position:relative;z-index:125}
.book-copy .external-link-marker:hover,.mobile-section .external-link-marker:hover{color:#0f3f5e}
