/* Folio — Le Puits */
.story-page{background:#03080d;color:#efe5d4}
.reading-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:100;background:rgba(255,255,255,.04)}
.reading-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,#8c693a,#efca83);box-shadow:0 0 12px rgba(239,202,131,.55)}
.story-header{background:linear-gradient(180deg,rgba(2,6,10,.94),rgba(2,6,10,.72),transparent)}
.story-header.scrolled{background:rgba(3,8,13,.94);backdrop-filter:blur(16px)}
.story-nav-links{display:flex;gap:28px;align-items:center;color:#d2c8b9;font-family:var(--serif);font-size:17px}
.story-nav-links a{transition:color .2s}
.story-nav-links a:hover{color:#f2cc83}
.story-back{border:1px solid rgba(216,174,104,.38);border-radius:999px;padding:8px 15px}
.story-hero{height:min(78vh,790px);min-height:560px;position:relative;display:grid;align-items:end;overflow:hidden;background:#020509}
.story-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.92) contrast(1.05)}
.story-hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,4,7,.16),rgba(1,4,7,.04) 38%,rgba(2,6,10,.9) 100%),linear-gradient(90deg,rgba(1,4,7,.25),transparent 48%,rgba(1,4,7,.12))}
.story-hero-copy{position:relative;z-index:2;text-align:center;padding-bottom:58px;text-shadow:0 4px 20px #000}
.story-hero-label{display:inline-block;margin:0;padding:10px 16px;border:1px solid rgba(216,174,104,.36);background:rgba(2,7,11,.52);backdrop-filter:blur(8px);border-radius:999px;color:#e0c18b;text-transform:uppercase;letter-spacing:.22em;font-size:10px}
.story-scroll{position:absolute;z-index:3;bottom:18px;left:50%}
.story-scroll span{display:block;width:1px;height:42px;background:linear-gradient(#d9b56d,transparent);animation:pulse 2s infinite}
.story-reading{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(180deg,#02070b 0%,#07111a 18%,#050b11 56%,#080d12 100%)}
.story-reading::before{content:'';position:absolute;z-index:-4;inset:0;background:radial-gradient(circle at 50% 5%,rgba(80,116,135,.16),transparent 25%),radial-gradient(circle at 12% 30%,rgba(22,69,76,.13),transparent 18%),radial-gradient(circle at 87% 76%,rgba(114,35,18,.12),transparent 23%)}
.story-reading::after{content:'';position:absolute;z-index:-3;inset:0;opacity:.25;background-image:radial-gradient(circle,rgba(236,219,182,.5) 0 1px,transparent 1.6px);background-size:190px 170px;mask-image:linear-gradient(180deg,#000,transparent 24%,transparent 84%,#000)}
.well-atmosphere{position:absolute;z-index:-1;inset:0;pointer-events:none;color:rgba(210,177,111,.1);font-family:var(--serif)}
.rune{position:absolute;font-size:80px;filter:blur(.2px);transform:rotate(var(--rot,0deg))}
.rune-one{top:13%;left:4%;--rot:-18deg}.rune-two{top:35%;right:5%;--rot:14deg}.rune-three{top:63%;left:3%;font-size:120px;--rot:9deg}.rune-four{top:83%;right:4%;font-size:95px;--rot:-9deg}
.story-shell{width:min(920px,calc(100% - 34px));margin:auto;padding:96px 0 110px}
.story-folio,.story-phase{position:relative;margin:0 auto 74px;padding:clamp(42px,7vw,78px) clamp(27px,8vw,92px);border:1px solid rgba(218,177,108,.13);background:linear-gradient(145deg,rgba(17,28,38,.94),rgba(5,13,20,.96));box-shadow:0 36px 90px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.025)}
.story-folio{border-radius:220px 220px 16px 16px;text-align:center;background:radial-gradient(circle at 50% 0%,rgba(204,165,97,.09),transparent 35%),linear-gradient(145deg,rgba(20,31,41,.97),rgba(5,13,20,.98))}
.story-paragraph{max-width:680px;margin:0 auto 1.48em;font-family:var(--serif);font-size:clamp(22px,2.35vw,29px);line-height:1.65;color:#e5dbc9;text-wrap:pretty}
.story-paragraph:last-child{margin-bottom:0}
.front-matter .story-paragraph,.closing-note .story-paragraph{font-size:clamp(20px,2vw,26px);line-height:1.62;color:#d8cdbd}
.front-matter .story-paragraph:first-of-type{font-size:clamp(27px,3vw,38px);color:#f0dfc3}
.dialogue{color:#f0c982;font-style:italic;padding-left:clamp(18px,4vw,42px);border-left:1px solid rgba(216,174,104,.35)}
.emphasis{font-size:clamp(28px,3vw,39px);line-height:1.3;text-align:center;color:#f1dfc2;margin-top:1.7em;margin-bottom:1.7em;letter-spacing:.01em}
.system-warning{font-family:var(--sans);font-size:clamp(16px,1.8vw,21px);letter-spacing:.08em;text-transform:uppercase;color:#ffb0a2;border:1px solid rgba(195,58,39,.42);background:rgba(83,17,12,.22);padding:24px 28px;text-align:center;box-shadow:inset 0 0 24px rgba(195,58,39,.08)}
.folio-topline,.phase-ornament,.quote-divider{width:min(380px,80%);display:flex;align-items:center;gap:16px;margin:0 auto 42px;color:#d7ae68}
.folio-topline span,.phase-ornament>span{height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(216,174,104,.6))}
.folio-topline span:last-child,.phase-ornament>span:last-child{background:linear-gradient(90deg,rgba(216,174,104,.6),transparent)}
.folio-topline b,.phase-ornament b{font-family:var(--serif);font-weight:400;font-size:23px}
.folio-endmark{text-align:center;color:#d8ae68;margin-top:36px;font-size:20px}
.story-phase{border-radius:18px}
.story-phase::before,.story-phase::after{content:'';position:absolute;pointer-events:none}
.phase-lake{background:radial-gradient(ellipse at 50% 0%,rgba(114,161,176,.13),transparent 35%),linear-gradient(180deg,rgba(14,34,43,.96),rgba(4,13,19,.97))}
.phase-lake::before{inset:0;background:linear-gradient(180deg,transparent 72%,rgba(48,102,114,.08));clip-path:polygon(0 84%,14% 78%,27% 86%,42% 76%,58% 85%,73% 77%,87% 84%,100% 76%,100% 100%,0 100%)}
.water-ripple{height:1px!important;background:linear-gradient(90deg,transparent,rgba(142,191,201,.52))!important}
.phase-forest{background:radial-gradient(circle at 50% 0%,rgba(56,73,57,.16),transparent 35%),linear-gradient(180deg,rgba(9,24,25,.97),rgba(3,10,14,.98))}
.phase-forest::before{left:0;right:0;bottom:0;height:110px;opacity:.24;background:repeating-linear-gradient(76deg,transparent 0 23px,#16251f 24px 31px,transparent 32px 50px);clip-path:polygon(0 100%,0 65%,5% 26%,10% 69%,17% 16%,23% 70%,30% 31%,37% 76%,44% 18%,50% 68%,57% 33%,64% 74%,72% 13%,79% 69%,86% 30%,93% 72%,100% 40%,100% 100%)}
.forest-ornament span{background:linear-gradient(90deg,transparent,rgba(111,139,102,.5))!important}.forest-ornament span:last-child{background:linear-gradient(90deg,rgba(111,139,102,.5),transparent)!important}
.phase-well{border-color:rgba(147,152,151,.18);background:radial-gradient(circle at 50% 4%,rgba(117,126,125,.12),transparent 25%),linear-gradient(180deg,rgba(13,20,24,.98),rgba(3,7,10,.99))}
.phase-well::before{inset:20px;border:1px solid rgba(156,160,158,.08);border-radius:10px;background:repeating-radial-gradient(circle at 50% -20%,transparent 0 82px,rgba(178,181,174,.03) 83px 85px)}
.well-seal{position:relative;z-index:1;width:min(380px,80%);display:flex;align-items:center;justify-content:center;gap:18px;margin:0 auto 44px;color:#aeb1aa}
.well-seal i{height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(174,177,170,.5))}.well-seal i:last-child{background:linear-gradient(90deg,rgba(174,177,170,.5),transparent)}.well-seal span{width:58px;height:58px;border:1px solid rgba(174,177,170,.33);border-radius:50%;display:grid;place-items:center;font-size:19px}
.phase-machine{border-color:rgba(165,60,42,.22);background:radial-gradient(circle at 15% 85%,rgba(214,68,25,.12),transparent 27%),radial-gradient(circle at 84% 18%,rgba(164,24,19,.14),transparent 25%),linear-gradient(145deg,rgba(20,22,25,.98),rgba(5,9,13,.99))}
.phase-machine::before{inset:0;opacity:.14;background:repeating-linear-gradient(90deg,transparent 0 85px,rgba(192,205,208,.2) 86px 87px),repeating-linear-gradient(0deg,transparent 0 105px,rgba(192,205,208,.13) 106px 107px)}
.machine-divider{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:10px;width:min(380px,80%);margin:0 auto 44px}.machine-divider>span{height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(188,79,54,.65))}.machine-divider>span:last-child{background:linear-gradient(90deg,rgba(188,79,54,.65),transparent)}.machine-divider i{width:9px;height:9px;border:1px solid #b25845;transform:rotate(45deg)}.machine-divider b{width:8px;height:8px;border-radius:50%;background:#a93224;box-shadow:0 0 16px #cf4933}
.phase-alarm{border-color:rgba(186,48,34,.3);background:linear-gradient(180deg,rgba(38,12,13,.97),rgba(8,9,12,.99))}
.phase-alarm::before{inset:0;opacity:.22;background:repeating-linear-gradient(135deg,rgba(119,22,18,.16) 0 16px,transparent 16px 32px)}
.alarm-line{position:relative;z-index:1;display:flex;align-items:center;gap:15px;margin:0 auto 46px;width:min(430px,86%)}.alarm-line span{height:1px;flex:1;background:linear-gradient(90deg,transparent,#a72f23)}.alarm-line span:last-child{background:linear-gradient(90deg,#a72f23,transparent)}.alarm-line b{font-family:var(--sans);font-size:10px;letter-spacing:.28em;color:#e96e5b;border:1px solid rgba(233,110,91,.32);padding:7px 11px}
.closing-note{border-radius:16px 16px 220px 220px;margin-bottom:46px}
.closing-note .story-paragraph:last-child{font-family:'Allura',cursive;font-size:clamp(40px,5vw,64px);color:#e1b77b}
.story-bottom-nav{display:flex;justify-content:space-between;align-items:center;gap:22px;padding:28px 6px 0;border-top:1px solid rgba(216,174,104,.15);font-family:var(--serif);font-size:18px;color:#d8c8ae}
.story-bottom-nav a{transition:color .2s,transform .2s}.story-bottom-nav a:hover{color:#f0c982;transform:translateY(-2px)}
.story-footer{background:#02070b;border-top:1px solid rgba(216,174,104,.1)}
.reveal-story{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.reveal-story.visible{opacity:1;transform:none}
@media(max-width:760px){.story-nav-links a:first-child{display:none}.story-back{padding:7px 12px}.story-hero{height:66vh;min-height:500px}.story-hero-copy{padding-bottom:54px}.story-shell{padding-top:70px}.story-folio,.story-phase{padding:45px 25px;margin-bottom:48px}.story-paragraph{font-size:22px;line-height:1.6}.dialogue{padding-left:18px}.rune{opacity:.5}.story-bottom-nav{flex-direction:column;align-items:stretch;text-align:center}}
@media(max-width:480px){.story-header .brand>span:last-child{font-size:14px}.story-header .brand-mark{width:34px;height:34px}.story-back{font-size:14px}.story-hero{min-height:440px}.story-hero-label{font-size:9px;letter-spacing:.14em;padding:9px 12px}.story-shell{width:min(100% - 18px,920px)}.story-folio,.story-phase{padding:39px 20px;border-radius:13px}.story-folio{border-radius:110px 110px 13px 13px}.closing-note{border-radius:13px 13px 110px 110px}.story-paragraph{font-size:20px}.emphasis{font-size:29px}.system-warning{font-size:14px;padding:20px 14px}.story-bottom-nav{font-size:17px}}
@media(prefers-reduced-motion:reduce){.reveal-story{opacity:1;transform:none;transition:none}.story-scroll span{animation:none}}

/* Folio — La Poursuite */
.chase-page .reading-progress span{background:linear-gradient(90deg,#728ca8,#e7c27a,#8a9d63)}
.chase-hero>img{object-position:center top}
.chase-page .story-hero-shade{background:linear-gradient(180deg,rgba(1,4,8,.1),rgba(1,4,8,.03) 42%,rgba(2,7,12,.92) 100%),linear-gradient(90deg,rgba(1,5,10,.25),transparent 48%,rgba(4,6,3,.12))}
.chase-reading{background:linear-gradient(180deg,#020812 0%,#071320 20%,#07100f 45%,#15170f 67%,#07100d 100%)}
.chase-reading::before{background:radial-gradient(circle at 18% 7%,rgba(94,139,188,.2),transparent 25%),radial-gradient(circle at 78% 44%,rgba(210,166,82,.13),transparent 24%),radial-gradient(circle at 30% 88%,rgba(52,93,58,.16),transparent 26%)}
.chase-reading::after{opacity:.34;background-image:radial-gradient(circle,rgba(224,237,246,.66) 0 1px,transparent 1.7px);background-size:145px 125px;mask-image:linear-gradient(180deg,#000,transparent 34%,transparent 72%,#000)}
.chase-atmosphere{position:absolute;z-index:-1;inset:0;pointer-events:none;overflow:hidden;color:rgba(231,203,143,.12)}
.chase-star{position:absolute;font-family:var(--serif);font-size:64px}.star-one{top:8%;left:5%}.star-two{top:23%;right:6%;font-size:92px}.star-three{top:82%;left:6%;font-size:86px}
.chase-trace{position:absolute;width:36vw;max-width:540px;height:1px;background:linear-gradient(90deg,transparent,rgba(218,177,108,.16),transparent);transform:rotate(-17deg)}.trace-one{top:39%;right:-7%}.trace-two{top:74%;left:-9%;transform:rotate(16deg)}
.chase-divider{position:relative;z-index:1;width:min(390px,82%);display:flex;align-items:center;gap:17px;margin:0 auto 44px;color:#d9b56f}.chase-divider span{height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(217,181,111,.55))}.chase-divider span:last-child{background:linear-gradient(90deg,rgba(217,181,111,.55),transparent)}.chase-divider b{font-family:var(--serif);font-weight:400;font-size:21px}
.chase-snow{overflow:hidden;border-color:rgba(128,166,198,.2);background:radial-gradient(circle at 50% 0%,rgba(100,143,188,.17),transparent 34%),linear-gradient(180deg,rgba(9,26,44,.98),rgba(3,10,18,.99))}
.chase-snow::before{inset:0;opacity:.35;background-image:radial-gradient(circle,rgba(232,241,248,.8) 0 1px,transparent 1.7px);background-size:58px 73px;mask-image:linear-gradient(180deg,#000,transparent 70%)}
.chase-snow::after{left:0;right:0;bottom:0;height:95px;background:linear-gradient(180deg,transparent,rgba(195,216,226,.08));clip-path:polygon(0 69%,12% 61%,24% 77%,36% 58%,50% 73%,63% 55%,75% 72%,88% 52%,100% 66%,100% 100%,0 100%)}
.snow-divider{color:#c7dbe9}.snow-divider span{background:linear-gradient(90deg,transparent,rgba(199,219,233,.5))}.snow-divider span:last-child{background:linear-gradient(90deg,rgba(199,219,233,.5),transparent)}
.dream-quote{border:1px solid rgba(209,225,236,.2);background:rgba(154,183,204,.06);padding:26px 28px;border-radius:999px;color:#eef5f8!important;text-shadow:0 0 18px rgba(177,211,233,.22)}
.chase-forest{overflow:hidden;border-color:rgba(84,119,99,.2);background:radial-gradient(circle at 50% 5%,rgba(57,87,78,.17),transparent 35%),linear-gradient(180deg,rgba(7,22,25,.98),rgba(2,9,12,.99))}
.chase-forest::before,.chase-return::before{left:0;right:0;bottom:0;height:135px;opacity:.34;background:repeating-linear-gradient(78deg,transparent 0 23px,#15251e 24px 32px,transparent 33px 51px);clip-path:polygon(0 100%,0 65%,5% 26%,10% 69%,17% 16%,23% 70%,30% 31%,37% 76%,44% 18%,50% 68%,57% 33%,64% 74%,72% 13%,79% 69%,86% 30%,93% 72%,100% 40%,100% 100%)}
.forest-divider{color:#90aa8d}.forest-divider span{background:linear-gradient(90deg,transparent,rgba(144,170,141,.5))}.forest-divider span:last-child{background:linear-gradient(90deg,rgba(144,170,141,.5),transparent)}
.chase-capture{overflow:hidden;border-color:rgba(125,109,96,.22);background:radial-gradient(ellipse at 80% 20%,rgba(87,42,34,.12),transparent 28%),linear-gradient(155deg,rgba(16,20,24,.99),rgba(4,7,10,.99))}
.chase-capture::before{top:0;bottom:0;right:15%;width:28%;background:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent);transform:skewX(-13deg)}
.shadow-divider{color:#9d8e80}.shadow-divider span{background:linear-gradient(90deg,transparent,rgba(157,142,128,.5))}.shadow-divider span:last-child{background:linear-gradient(90deg,rgba(157,142,128,.5),transparent)}
.chase-summer{overflow:hidden;border-color:rgba(211,174,91,.23);background:radial-gradient(circle at 80% 2%,rgba(255,214,111,.18),transparent 29%),radial-gradient(circle at 15% 90%,rgba(101,140,71,.14),transparent 30%),linear-gradient(150deg,rgba(27,31,21,.98),rgba(8,14,12,.99))}
.chase-summer::before{right:6%;top:4%;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(247,205,108,.18),rgba(247,205,108,.03) 45%,transparent 70%);box-shadow:0 0 80px rgba(245,197,84,.1)}
.sun-divider{color:#e3bd6e}.sun-divider span{background:linear-gradient(90deg,transparent,rgba(227,189,110,.58))}.sun-divider span:last-child{background:linear-gradient(90deg,rgba(227,189,110,.58),transparent)}
.chase-hall{overflow:hidden;border-color:rgba(163,160,144,.17);background:radial-gradient(circle at 50% 0%,rgba(181,167,126,.09),transparent 31%),linear-gradient(180deg,rgba(20,23,23,.99),rgba(7,10,12,.99))}
.chase-hall::before{inset:0;opacity:.1;background:repeating-linear-gradient(90deg,transparent 0 110px,rgba(197,190,169,.2) 111px 112px),repeating-linear-gradient(0deg,transparent 0 125px,rgba(197,190,169,.15) 126px 127px)}
.hall-divider{color:#b8af98}.hall-divider span{background:linear-gradient(90deg,transparent,rgba(184,175,152,.48))}.hall-divider span:last-child{background:linear-gradient(90deg,rgba(184,175,152,.48),transparent)}
.chase-return{overflow:hidden;border-color:rgba(79,116,76,.22);background:radial-gradient(circle at 48% 3%,rgba(105,135,77,.14),transparent 34%),linear-gradient(180deg,rgba(8,23,20,.99),rgba(2,9,10,.99))}
.chase-return::after{left:46%;bottom:-80px;width:120px;height:420px;border-left:1px solid rgba(211,177,107,.12);border-right:1px solid rgba(211,177,107,.07);transform:perspective(200px) rotateX(18deg);filter:blur(.2px)}
.path-divider{color:#9bb07c}.path-divider span{background:linear-gradient(90deg,transparent,rgba(155,176,124,.5))}.path-divider span:last-child{background:linear-gradient(90deg,rgba(155,176,124,.5),transparent)}
.wake-note{background:radial-gradient(circle at 50% 100%,rgba(111,132,169,.1),transparent 38%),linear-gradient(145deg,rgba(14,22,31,.98),rgba(5,11,17,.99))}
.wake-heading{font-family:var(--serif)!important;font-size:clamp(30px,4vw,48px)!important;color:#edc981!important;letter-spacing:.03em}
.chase-page .closing-note .story-paragraph:last-child{font-family:var(--serif);font-size:clamp(22px,2.35vw,29px);color:#e5dbc9}
@media(max-width:760px){.chase-hero>img{object-position:center}.chase-star{opacity:.45}.dream-quote{border-radius:24px;padding:22px 20px}}

/* Version 21 — cadrage final de la couverture de La Poursuite */
.chase-hero{
  height:min(86vh,860px);
  min-height:650px;
}
.chase-hero>.chase-cover-image{
  object-position:center top!important;
}
@media(max-width:760px){
  .chase-hero{
    height:72vh;
    min-height:540px;
  }
  .chase-hero>.chase-cover-image{
    object-position:center top!important;
  }
}
@media(max-width:480px){
  .chase-hero{
    min-height:500px;
  }
}

/* Folio — Le Fleuve de glace */
.ice-page .reading-progress span{background:linear-gradient(90deg,#e8f5fb,#62a9bf,#0a5369);box-shadow:0 0 14px rgba(117,204,226,.62)}
.ice-hero{height:min(91vh,940px);min-height:690px;background:#06141d}
.ice-hero-backdrop{position:absolute;inset:-28px;z-index:0;background:linear-gradient(180deg,rgba(3,13,20,.08),rgba(3,13,20,.42)),url("assets/le-fleuve-de-glace.webp") center/cover no-repeat;filter:blur(20px) saturate(.8) brightness(.62);transform:scale(1.08)}
.ice-hero>.ice-cover-image{z-index:1;object-fit:contain;object-position:center;filter:saturate(.96) contrast(1.04)}
.ice-page .story-hero-shade{z-index:2;background:linear-gradient(180deg,rgba(2,10,16,.12),transparent 44%,rgba(2,9,14,.83) 100%),linear-gradient(90deg,rgba(2,10,16,.2),transparent 35%,transparent 68%,rgba(2,10,16,.17))}
.ice-hero .story-hero-copy,.ice-hero .story-scroll{z-index:3}
.ice-reading{background:linear-gradient(180deg,#d4edf5 0%,#658ca2 13%,#0d566c 34%,#062d3e 55%,#031724 79%,#06131d 100%)}
.ice-reading::before{background:radial-gradient(circle at 15% 4%,rgba(255,247,203,.42),transparent 18%),radial-gradient(circle at 74% 24%,rgba(210,240,248,.2),transparent 25%),radial-gradient(circle at 28% 62%,rgba(62,174,194,.14),transparent 24%),radial-gradient(circle at 72% 85%,rgba(3,53,69,.34),transparent 25%)}
.ice-reading::after{opacity:.28;background-image:radial-gradient(circle,rgba(226,249,255,.72) 0 1px,transparent 1.8px);background-size:130px 145px;mask-image:linear-gradient(180deg,#000,transparent 22%,transparent 67%,#000)}
.ice-atmosphere{position:absolute;z-index:-1;inset:0;pointer-events:none;overflow:hidden}
.ice-spark{position:absolute;color:rgba(235,250,255,.2);font-family:var(--serif);font-size:76px}.ice-spark-one{top:6%;left:5%}.ice-spark-two{top:20%;right:4%;font-size:94px}.ice-spark-three{top:88%;left:7%;font-size:110px}
.ice-bubble{position:absolute;border:1px solid rgba(196,240,248,.18);border-radius:50%;box-shadow:inset 0 0 14px rgba(196,240,248,.05)}.bubble-one{width:70px;height:70px;top:48%;right:5%}.bubble-two{width:32px;height:32px;top:55%;right:10%}.bubble-three{width:48px;height:48px;top:71%;left:5%}
.ice-front{background:radial-gradient(circle at 50% 0%,rgba(230,245,247,.13),transparent 38%),linear-gradient(145deg,rgba(20,43,55,.97),rgba(5,18,28,.98));border-color:rgba(185,226,237,.2)}
.ice-divider{position:relative;z-index:1;width:min(400px,84%);display:flex;align-items:center;gap:17px;margin:0 auto 44px}.ice-divider span{height:1px;flex:1}.ice-divider b{font-family:var(--serif);font-weight:400;font-size:22px}
.sun-snow-divider{color:#f2d78b}.sun-snow-divider span{background:linear-gradient(90deg,transparent,rgba(242,215,139,.62))}.sun-snow-divider span:last-child{background:linear-gradient(90deg,rgba(242,215,139,.62),transparent)}
.ice-mountain{overflow:hidden;border-color:rgba(205,233,241,.34);background:radial-gradient(circle at 15% 4%,rgba(255,235,160,.22),transparent 22%),radial-gradient(circle at 80% 7%,rgba(234,250,255,.2),transparent 31%),linear-gradient(180deg,rgba(89,143,169,.97),rgba(18,57,76,.99))}
.ice-mountain::before{left:0;right:0;bottom:0;height:145px;opacity:.42;background:linear-gradient(180deg,transparent,rgba(235,248,251,.14));clip-path:polygon(0 100%,0 71%,10% 46%,18% 68%,29% 35%,40% 73%,50% 42%,61% 69%,72% 29%,82% 67%,91% 44%,100% 72%,100% 100%)}
.ice-mountain::after{right:8%;top:7%;width:110px;height:110px;border-radius:50%;background:radial-gradient(circle,rgba(255,238,169,.22),rgba(255,238,169,.04) 46%,transparent 70%);box-shadow:0 0 90px rgba(255,228,135,.18)}
.scenic-paragraph{color:#f4efe2!important;text-shadow:0 2px 12px rgba(1,13,20,.38)}
.road-divider{color:#d7edf3}.road-divider span{background:linear-gradient(90deg,transparent,rgba(215,237,243,.52))}.road-divider span:last-child{background:linear-gradient(90deg,rgba(215,237,243,.52),transparent)}
.ice-road{overflow:hidden;border-color:rgba(146,191,206,.25);background:radial-gradient(circle at 50% 0%,rgba(183,222,232,.16),transparent 33%),linear-gradient(180deg,rgba(19,62,79,.98),rgba(5,29,42,.99))}
.ice-road::before{left:0;right:0;bottom:0;height:150px;opacity:.38;background:repeating-linear-gradient(78deg,transparent 0 24px,#123442 25px 34px,transparent 35px 55px);clip-path:polygon(0 100%,0 67%,6% 28%,12% 72%,20% 17%,27% 70%,35% 31%,44% 75%,52% 19%,61% 68%,70% 29%,78% 73%,87% 18%,94% 71%,100% 39%,100% 100%)}
.ice-road::after{left:43%;bottom:-125px;width:140px;height:510px;border-left:2px solid rgba(235,246,249,.11);border-right:2px solid rgba(235,246,249,.08);transform:perspective(240px) rotateX(20deg)}
.ice-surface{overflow:hidden;border-color:rgba(155,221,235,.3);background:radial-gradient(circle at 50% 0%,rgba(216,247,252,.18),transparent 31%),linear-gradient(180deg,rgba(14,81,101,.99),rgba(4,34,51,.99))}
.ice-surface::before{inset:0;opacity:.3;background:linear-gradient(117deg,transparent 47.7%,rgba(221,249,252,.82) 48%,transparent 48.4%),linear-gradient(68deg,transparent 53.2%,rgba(221,249,252,.55) 53.5%,transparent 53.8%),linear-gradient(151deg,transparent 61%,rgba(221,249,252,.38) 61.3%,transparent 61.6%)}
.ice-surface::after{left:0;right:0;top:0;height:18px;background:linear-gradient(90deg,transparent,rgba(214,246,250,.5),transparent);box-shadow:0 17px 38px rgba(165,229,239,.08)}
.ice-crack-divider{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:10px;width:min(410px,84%);margin:0 auto 44px}.ice-crack-divider>span{height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(186,233,241,.7))}.ice-crack-divider>span:last-child{background:linear-gradient(90deg,rgba(186,233,241,.7),transparent)}.ice-crack-divider i{width:12px;height:12px;border-left:1px solid #bcebf2;border-bottom:1px solid #bcebf2;transform:rotate(-40deg)}.ice-crack-divider b{width:6px;height:6px;border-radius:50%;background:#dbf5f8;box-shadow:0 0 17px #a8e5ef}
.break-line{font-size:clamp(36px,4.5vw,58px)!important;color:#e7fbff!important;text-shadow:0 0 22px rgba(170,230,240,.35)}
.depth-divider{color:#86c9d9}.depth-divider span{background:linear-gradient(90deg,transparent,rgba(134,201,217,.55))}.depth-divider span:last-child{background:linear-gradient(90deg,rgba(134,201,217,.55),transparent)}
.ice-depth{overflow:hidden;border-color:rgba(66,153,176,.27);background:radial-gradient(ellipse at 50% 0%,rgba(141,223,238,.2),transparent 36%),linear-gradient(180deg,rgba(4,66,85,.99),rgba(2,25,39,.99))}
.ice-depth::before{left:24%;top:-5%;width:26%;height:112%;background:linear-gradient(165deg,rgba(188,240,247,.15),transparent 55%);transform:skewX(-11deg);filter:blur(2px)}
.ice-depth::after{inset:0;opacity:.26;background-image:radial-gradient(circle,rgba(203,245,250,.7) 0 2px,transparent 2.6px);background-size:95px 128px;mask-image:linear-gradient(180deg,transparent,#000 14%,#000 80%,transparent)}
.shark-divider{color:#78aeb9}.shark-divider span{background:linear-gradient(90deg,transparent,rgba(120,174,185,.48))}.shark-divider span:last-child{background:linear-gradient(90deg,rgba(120,174,185,.48),transparent)}
.ice-shark{overflow:hidden;border-color:rgba(55,117,131,.3);background:radial-gradient(ellipse at 38% 0%,rgba(115,215,231,.17),transparent 30%),radial-gradient(ellipse at 86% 53%,rgba(0,0,0,.48),transparent 28%),linear-gradient(180deg,rgba(2,45,59,.99),rgba(1,16,27,.99))}
.ice-shark::before{right:7%;top:35%;width:190px;height:82px;border-radius:55% 45% 50% 50%;background:rgba(0,7,12,.25);filter:blur(8px);transform:rotate(-8deg);box-shadow:-88px 17px 0 -22px rgba(0,7,12,.22)}
.ice-shark::after{left:20%;top:-5%;width:20%;height:115%;background:linear-gradient(167deg,rgba(173,232,240,.12),transparent 58%);transform:skewX(-10deg)}
.shark-reveal{font-size:clamp(29px,3.2vw,43px)!important;color:#f0f8f8!important;text-align:center;padding:27px 22px;border:1px solid rgba(129,191,202,.2);background:rgba(2,20,30,.26)}
.rescue-divider{color:#d3e6dc}.rescue-divider span{background:linear-gradient(90deg,transparent,rgba(211,230,220,.53))}.rescue-divider span:last-child{background:linear-gradient(90deg,rgba(211,230,220,.53),transparent)}
.ice-rescue{overflow:hidden;border-color:rgba(136,180,170,.23);background:radial-gradient(circle at 78% 0%,rgba(212,237,225,.15),transparent 31%),linear-gradient(180deg,rgba(8,57,66,.99),rgba(7,28,37,.99))}
.ice-rescue::before{left:0;right:0;bottom:0;height:105px;opacity:.18;background:linear-gradient(180deg,transparent,rgba(218,235,228,.2));clip-path:polygon(0 75%,12% 59%,24% 71%,36% 53%,50% 73%,62% 55%,75% 70%,88% 50%,100% 67%,100% 100%,0 100%)}
.ice-wake{background:radial-gradient(circle at 50% 100%,rgba(82,152,171,.14),transparent 40%),linear-gradient(145deg,rgba(12,32,43,.98),rgba(4,13,21,.99));border-color:rgba(139,199,213,.18)}
.ice-wake .wake-heading{font-family:var(--serif)!important;font-size:clamp(30px,4vw,48px)!important;color:#d9f0f4!important;letter-spacing:.03em}
.ice-page .closing-note .story-paragraph:last-child{font-family:var(--serif);font-size:clamp(22px,2.35vw,29px);color:#dce8e8}
@media(max-width:760px){.ice-hero{height:72vh;min-height:560px}.ice-hero>.ice-cover-image{object-fit:cover;object-position:center}.ice-hero-backdrop{filter:blur(14px) saturate(.8) brightness(.58)}.ice-spark{opacity:.4}}
@media(max-width:480px){.ice-hero{min-height:510px}.shark-reveal{padding:22px 16px}}



/* Correctifs de lancement v23 */
.story-hero-shade{z-index:2}
.story-hero-copy{z-index:3}
.story-scroll{z-index:4}

.well-page .story-hero::before,
.chase-page .story-hero::before{
  content:'';
  position:absolute;
  inset:-24px;
  z-index:0;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  filter:blur(17px) saturate(.82) brightness(.56);
  transform:scale(1.09);
}
.well-page .story-hero::before{background-image:url("assets/le-puits.webp")}
.chase-page .story-hero::before{background-image:url("assets/la-poursuite.webp")}
.well-page .story-hero>img,
.chase-page .story-hero>img{z-index:1}

.reveal-story{opacity:1;transform:none}
.js .reveal-story{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .7s ease,transform .7s ease;
}
.js .reveal-story.visible{opacity:1;transform:none}

@media(max-width:760px){
  .story-hero,.chase-hero,.ice-hero{
    height:52svh;
    min-height:420px;
    max-height:520px;
  }
  .story-hero>img,
  .chase-hero>.chase-cover-image,
  .ice-hero>.ice-cover-image{
    object-fit:contain!important;
    object-position:center!important;
  }
  .ice-hero-backdrop{filter:blur(14px) saturate(.8) brightness(.58)}
}
@media(max-width:480px){
  .story-hero,.chase-hero,.ice-hero{min-height:400px}
}
@media(prefers-reduced-motion:reduce){
  .js .reveal-story{opacity:1;transform:none;transition:none}
}


/* Finitions mobiles v27 — couvertures des folios */
@media(max-width:760px){
  .story-hero,
  .chase-hero,
  .ice-hero{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    display:grid;
    grid-template-rows:82px auto auto 44px;
    align-items:stretch;
    background:#020509;
    overflow:hidden;
  }

  /* Espace réservé à la barre fixe, sans grand vide décoratif. */
  .story-hero::after{
    content:'';
    grid-row:1;
    position:relative;
    inset:auto;
    display:block;
    height:82px;
    background:linear-gradient(180deg,#02070b,#03080d);
    z-index:0;
  }

  .story-hero>img,
  .chase-hero>.chase-cover-image,
  .ice-hero>.ice-cover-image{
    position:relative!important;
    inset:auto!important;
    grid-row:2;
    width:100%;
    height:auto!important;
    max-height:none!important;
    display:block;
    object-fit:contain!important;
    object-position:center!important;
    filter:saturate(.95) contrast(1.04);
    z-index:1;
  }

  /* Les arrière-plans floutés restent seulement comme prolongement discret. */
  .well-page .story-hero::before,
  .chase-page .story-hero::before,
  .ice-hero-backdrop{
    opacity:.28;
    filter:blur(15px) saturate(.8) brightness(.48);
  }

  .story-hero-shade{
    display:none;
  }

  .story-hero-copy{
    position:relative;
    grid-row:3;
    width:100%;
    padding:15px 14px 12px;
    margin:0;
    text-align:center;
    background:linear-gradient(180deg,#020609,#03080d);
    text-shadow:0 3px 16px #000;
    z-index:3;
  }

  .story-hero-label{
    max-width:calc(100% - 28px);
    font-size:9px;
    letter-spacing:.145em;
    line-height:1.35;
    padding:9px 13px;
    white-space:normal;
  }

  .story-scroll{
    position:relative;
    grid-row:4;
    left:auto;
    bottom:auto;
    width:32px;
    height:44px;
    margin:0 auto;
    display:grid;
    place-items:start center;
    z-index:4;
  }

  .story-scroll span{
    height:34px;
  }
}

@media(max-width:480px){
  .story-hero,
  .chase-hero,
  .ice-hero{
    grid-template-rows:76px auto auto 40px;
  }

  .story-hero::after{
    height:76px;
  }

  .story-hero-copy{
    padding:13px 10px 10px;
  }

  .story-hero-label{
    font-size:8.5px;
    letter-spacing:.12em;
    padding:8px 11px;
  }

  .story-scroll{
    height:40px;
  }

  .story-scroll span{
    height:30px;
  }
}
