:root{--ink:#eef2f7;--muted:#aab3c2;--night:#0b1018;--night2:#111927;--panel:#151f2e;--gold:#d9b56d;--blue:#7798bb;--line:rgba(255,255,255,.11);--serif:'Cormorant Garamond',Georgia,serif;--sans:'DM Sans',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--night);color:var(--ink);font-family:var(--sans);line-height:1.7;overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit}.shell{width:min(1160px,calc(100% - 40px));margin:auto}.narrow{max-width:800px;text-align:center}.section{padding:110px 0}.skip-link{position:fixed;left:12px;top:-60px;background:white;color:#111;padding:10px 16px;z-index:100}.skip-link:focus{top:12px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-header{position:fixed;z-index:50;width:100%;top:0;transition:.3s}.site-header.scrolled{background:rgba(8,13,20,.88);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}.nav{height:82px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px;font-weight:600;letter-spacing:.02em}.brand-mark{width:38px;height:38px;border:1px solid rgba(217,181,109,.6);border-radius:50%;display:grid;place-items:center;font-family:var(--serif);font-size:20px;color:var(--gold);position:relative}.brand-mark span{font-size:11px;position:absolute;right:5px;bottom:2px;color:var(--blue)}.nav-links{display:flex;align-items:center;gap:30px;color:#cbd3df;font-size:14px}.nav-links a:hover{color:white}.nav-cta{border:1px solid rgba(217,181,109,.5);padding:9px 16px;border-radius:99px}.menu-toggle{display:none;background:none;border:0;padding:8px}.menu-toggle>span:not(.sr-only){display:block;width:24px;height:1px;background:white;margin:6px}
.hero{min-height:100vh;display:grid;align-items:center;position:relative;background:radial-gradient(circle at 70% 25%,rgba(66,89,122,.24),transparent 35%),linear-gradient(145deg,#091018,#101927 55%,#0c121c)}.hero:after{content:'';position:absolute;inset:auto 0 0;height:160px;background:linear-gradient(transparent,var(--night))}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:80px;align-items:center;padding-top:80px;position:relative;z-index:2}.eyebrow{text-transform:uppercase;letter-spacing:.24em;font-size:11px;color:var(--gold);font-weight:600}.hero h1,.section h2{font-family:var(--serif);font-weight:500;line-height:.95;margin:20px 0}.hero h1{font-size:clamp(64px,8vw,112px);letter-spacing:-.04em}.hero h1 em{color:#aabbd0;font-weight:500}.hero-text{max-width:600px;color:var(--muted);font-size:18px}.hero-actions{display:flex;gap:14px;margin-top:34px}.button{padding:13px 21px;border-radius:99px;font-size:14px;font-weight:600}.primary{background:var(--gold);color:#111722}.primary:hover{background:#e9c983}.ghost{border:1px solid var(--line)}.ghost:hover{background:rgba(255,255,255,.05)}
.hero-sky{position:absolute;inset:0;overflow:hidden}.moon{position:absolute;width:360px;height:360px;border-radius:50%;right:9%;top:12%;background:radial-gradient(circle at 38% 35%,#eef2f4,#a5b4c5 45%,#53647b 72%,#263245);opacity:.14;filter:blur(.2px)}.star{position:absolute;width:2px;height:2px;background:white;border-radius:50%;box-shadow:0 0 8px white}.s1{top:18%;left:12%}.s2{top:31%;left:44%}.s3{top:15%;left:63%}.s4{top:63%;left:20%}.s5{top:74%;left:77%}.s6{top:38%;left:88%}.dream-window{aspect-ratio:4/5;border:1px solid rgba(255,255,255,.18);border-radius:220px 220px 28px 28px;position:relative;overflow:hidden;background:linear-gradient(#0b1830,#31506c 46%,#101c24);box-shadow:0 40px 100px rgba(0,0,0,.5),inset 0 0 70px rgba(9,15,24,.35)}.dream-window:before{content:'';position:absolute;inset:18px;border:1px solid rgba(255,255,255,.1);border-radius:200px 200px 20px 20px;z-index:8}.window-stars{position:absolute;inset:0 0 45%;background-image:radial-gradient(white 1px,transparent 1px);background-size:55px 55px;opacity:.45}.mountain{position:absolute;left:-10%;width:120%;clip-path:polygon(0 100%,22% 40%,35% 70%,52% 24%,72% 68%,88% 35%,100% 100%)}.mountain-back{bottom:30%;height:38%;background:#273b4c}.mountain-front{bottom:18%;height:34%;background:#142630;transform:scaleX(1.1)}.forest{position:absolute;bottom:19%;width:100%;height:21%;background:repeating-linear-gradient(72deg,transparent 0 18px,#0b1519 19px 25px,transparent 26px 40px);clip-path:polygon(0 100%,0 70%,5% 35%,10% 70%,15% 20%,21% 68%,27% 28%,33% 74%,40% 18%,46% 69%,54% 30%,61% 74%,68% 15%,75% 70%,82% 24%,90% 72%,95% 34%,100% 70%,100% 100%)}.water{position:absolute;bottom:0;width:100%;height:24%;background:linear-gradient(rgba(81,121,145,.55),#081119);clip-path:polygon(0 12%,100% 0,100% 100%,0 100%)}.window-caption{position:absolute;z-index:10;bottom:28px;left:35px;right:35px;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#d4dbe4}.scroll-cue{position:absolute;bottom:30px;left:50%;z-index:3}.scroll-cue span{display:block;width:1px;height:55px;background:linear-gradient(var(--gold),transparent);animation:pulse 2s infinite}@keyframes pulse{50%{transform:translateY(8px);opacity:.5}}
.intro{background:var(--night)}.ornament{color:var(--gold);font-size:22px}.intro-lead{font-family:var(--serif);font-size:clamp(28px,4vw,43px);line-height:1.25;color:#dce2e9;margin:22px 0}.intro .narrow>p:last-child{color:var(--muted)}
.stories{background:linear-gradient(180deg,var(--night),#0f1722)}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:45px}.section h2{font-size:clamp(48px,6vw,78px)}.section-heading>p{max-width:480px;color:var(--muted)}.story-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.story-card{background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:.35s}.story-card:hover{transform:translateY(-7px);border-color:rgba(217,181,109,.3);box-shadow:0 25px 60px rgba(0,0,0,.22)}.story-art{height:280px;position:relative;overflow:hidden;background:#192536}.story-number{position:absolute;right:20px;top:13px;font-family:var(--serif);font-size:44px;color:rgba(255,255,255,.17)}.story-body{padding:28px}.tags{display:flex;gap:7px;flex-wrap:wrap}.tags span{font-size:9px;letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--line);border-radius:99px;padding:5px 8px;color:var(--muted)}.story-body h3{font-family:var(--serif);font-size:37px;margin:17px 0 8px}.story-body p{color:var(--muted);font-size:14px}.text-link{color:var(--gold);background:none;border:0;padding:4px 0;cursor:pointer;font-weight:600}.text-link span{display:inline-block;transition:.2s}.text-link:hover span{transform:translateX(5px)}.well .story-art{background:radial-gradient(circle at 50% 65%,#020407 0 12%,#33404e 13% 15%,#101923 16% 34%,transparent 35%),linear-gradient(#273746,#0a1118)}.well-ring{position:absolute;width:190px;height:190px;border:18px solid #45515b;border-radius:50%;bottom:-30px;left:50%;transform:translateX(-50%);box-shadow:inset 0 0 20px #000,0 0 0 10px rgba(0,0,0,.2)}.chase .story-art{background:linear-gradient(150deg,#74899c,#d6dde1 50%,#536777)}.chase .story-art:after{content:'';position:absolute;inset:35% 0 0;background:linear-gradient(165deg,transparent 0 20%,#f0f3f5 21% 40%,#b5c1ca 41% 47%,#edf1f4 48%)}.footprints{position:absolute;z-index:2;left:43%;bottom:35px;writing-mode:vertical-rl;letter-spacing:18px;color:#5b6671;font-size:38px;transform:rotate(-18deg)}.ice .story-art{background:linear-gradient(#182a3c,#527a95 54%,#b6d2df 55%,#5f879d)}.ice-crack{position:absolute;inset:55% 0 0;background:linear-gradient(112deg,transparent 48%,rgba(255,255,255,.9) 49% 50%,transparent 51%),linear-gradient(72deg,transparent 45%,rgba(255,255,255,.6) 46% 47%,transparent 48%)}
.quote-section{background:#d7d5ce;color:#101820}.quote-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:90px;align-items:center}.quote-art{height:490px;display:grid;place-items:center;background:linear-gradient(145deg,#c4c3bd,#e8e6df);border-radius:180px 180px 12px 12px}.door{height:270px;width:150px;border-radius:80px 80px 4px 4px;background:#171d26;box-shadow:0 0 80px rgba(20,27,40,.35);display:grid;place-items:center}.door span{width:1px;height:100%;background:linear-gradient(transparent,#d9b56d,transparent);box-shadow:0 0 18px #d9b56d}.quote-section blockquote{margin:0}.quote-mark{font-family:var(--serif);font-size:100px;color:#9e7f46;line-height:.4}.quote-section blockquote p{font-family:var(--serif);font-size:clamp(33px,4vw,53px);line-height:1.15;margin:30px 0}.quote-section footer{letter-spacing:.14em;text-transform:uppercase;font-size:12px;color:#61656a}
.about{background:#0e1621}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:start}.about-copy>p:not(.eyebrow){color:var(--muted)}.about-copy strong{color:var(--ink)}.signature{font-family:var(--serif);font-style:italic;font-size:54px;color:var(--gold);margin-top:20px}.values{border-top:1px solid var(--line)}.value{display:grid;grid-template-columns:56px 130px 1fr;gap:20px;padding:28px 0;border-bottom:1px solid var(--line);align-items:start}.value>span{font-family:var(--serif);font-size:28px;color:var(--gold)}.value h3{margin:3px 0;font-family:var(--serif);font-size:24px}.value p{margin:3px 0;color:var(--muted);font-size:14px}
.newsletter{background:linear-gradient(#0e1621,#0a1018)}.newsletter-card{border:1px solid rgba(217,181,109,.25);background:radial-gradient(circle at 85% 20%,rgba(97,130,164,.2),transparent 30%),rgba(255,255,255,.025);border-radius:24px;padding:60px;display:flex;justify-content:space-between;align-items:end;gap:40px}.newsletter h2{font-size:clamp(42px,5vw,66px);margin-bottom:12px}.newsletter p{color:var(--muted)}.social-placeholder{white-space:nowrap;display:flex;gap:12px;color:var(--gold);font-size:14px}.site-footer{border-top:1px solid var(--line);padding:30px 0;background:#080d14}.footer-inner{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:12px}.footer-inner .brand{color:var(--ink)}
.story-dialog{max-width:620px;width:calc(100% - 30px);border:1px solid rgba(217,181,109,.3);border-radius:20px;background:#111a27;color:var(--ink);padding:42px;box-shadow:0 30px 100px #000}.story-dialog::backdrop{background:rgba(3,6,10,.78);backdrop-filter:blur(8px)}.story-dialog h2{font-family:var(--serif);font-size:54px;margin:10px 0}.story-dialog p{color:var(--muted)}.dialog-note{font-size:12px;border-top:1px solid var(--line);padding-top:18px;margin-top:25px}.dialog-close{position:absolute;right:16px;top:12px;background:none;border:0;color:white;font-size:30px;cursor:pointer}.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:900px){.nav-links{position:fixed;inset:82px 0 auto;background:#0b111a;border-bottom:1px solid var(--line);padding:25px;display:none;flex-direction:column}.nav-links.open{display:flex}.menu-toggle{display:block}.hero-grid,.quote-grid,.about-grid{grid-template-columns:1fr}.hero-grid{padding-top:130px;padding-bottom:100px}.dream-window{width:min(520px,100%);justify-self:center}.story-grid{grid-template-columns:1fr}.story-art{height:240px}.quote-grid{gap:55px}.quote-art{height:350px}.section-heading,.newsletter-card{align-items:start;flex-direction:column}.about-grid{gap:50px}.value{grid-template-columns:45px 120px 1fr}.footer-inner{flex-direction:column;gap:16px}.scroll-cue{display:none}}
@media(max-width:560px){.shell{width:min(100% - 24px,1160px)}.section{padding:78px 0}.hero h1{font-size:58px}.hero-actions{flex-direction:column;align-items:flex-start}.section-heading{align-items:start;flex-direction:column}.dream-window{border-radius:170px 170px 22px 22px}.story-art{height:210px}.newsletter-card{padding:34px 24px}.social-placeholder{white-space:normal;flex-wrap:wrap}.value{grid-template-columns:38px 1fr}.value p{grid-column:2}.quote-section blockquote p{font-size:34px}.quote-art{height:300px}.door{height:210px;width:120px}.story-dialog{padding:34px 24px}.story-dialog h2{font-size:44px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.scroll-cue span{animation:none}}

/* Direction artistique KatAli — nuit, forêt, encre et or */
:root{--gold:#d8ae68;--gold-light:#f0c982;--night:#03080d;--night2:#07111b;--panel:#0b1621;--ink:#f3eadb;--muted:#b6b0a7}
body{background:#03080d;background-image:radial-gradient(circle at 50% 10%,rgba(34,57,76,.18),transparent 38%)}
.site-header{background:linear-gradient(rgba(2,7,11,.88),rgba(2,7,11,.35),transparent);border-bottom:0;backdrop-filter:none}
.brand-mark{border-color:rgba(216,174,104,.65);color:var(--gold-light)}
.nav-links a{font-family:var(--serif);font-size:17px;letter-spacing:.04em}
.nav-cta{border-color:rgba(216,174,104,.5)!important;color:var(--gold-light)!important}

.hero-image{min-height:100svh;display:grid;place-items:center;position:relative;overflow:hidden;background-image:url('assets/intro-katali.webp');background-size:cover;background-position:center center}
.hero-image:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(1,5,8,.55),transparent 32%,transparent 68%,rgba(1,5,8,.35)),linear-gradient(180deg,rgba(1,5,8,.28),transparent 35%,rgba(1,5,8,.55))}
.hero-overlay{position:absolute;inset:0;background:radial-gradient(ellipse at center 32%,rgba(15,33,45,.02),rgba(1,5,8,.2) 64%,rgba(1,5,8,.65));z-index:1}
.hero-content{position:relative;z-index:2;text-align:center;display:flex;flex-direction:column;align-items:center;padding-top:5rem;text-shadow:0 3px 18px rgba(0,0,0,.72)}
.hero-welcome{font-family:var(--serif);font-size:clamp(30px,4.2vw,58px);line-height:1;margin:0;color:var(--gold-light);letter-spacing:.015em}
.hero-divider{width:min(430px,80vw);display:flex;align-items:center;gap:18px;margin:22px 0 8px;color:var(--gold-light)}
.hero-divider span{height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--gold-light))}.hero-divider span:last-child{background:linear-gradient(90deg,var(--gold-light),transparent)}
.hero-divider b{font-size:30px;font-weight:400}
.hero-signature{font-family:'Cormorant Garamond',Georgia,serif!important;font-style:italic;font-weight:500!important;font-size:clamp(82px,12vw,168px)!important;line-height:.76!important;margin:16px 0 26px!important;color:#e1b77b;letter-spacing:-.07em!important;text-shadow:0 0 25px rgba(225,183,123,.14),0 4px 20px rgba(0,0,0,.85)}
.hero-tagline{font-family:var(--serif);font-size:clamp(20px,2vw,29px);letter-spacing:.14em;color:#ead5b5;margin:0;text-transform:uppercase}
.hero-actions{justify-content:center;margin-top:38px}
.button{border-radius:2px;text-transform:uppercase;letter-spacing:.12em;font-size:11px;padding:14px 22px}
.primary{background:linear-gradient(135deg,#e0ba78,#b98a47);color:#071018;box-shadow:0 10px 35px rgba(0,0,0,.35)}
.ghost{border-color:rgba(232,205,162,.48);background:rgba(2,7,11,.32);color:#f1dfc3;backdrop-filter:blur(4px)}

.intro{background:radial-gradient(circle at 15% 35%,rgba(45,72,91,.16),transparent 28%),linear-gradient(180deg,#03080d,#07111b)}
.intro-grid{display:grid;grid-template-columns:minmax(280px,520px) 1fr;gap:clamp(55px,8vw,120px);align-items:center}
.book-cover{margin:0;position:relative;filter:drop-shadow(0 30px 55px rgba(0,0,0,.6))}
.book-cover:before{content:'';position:absolute;inset:5% -7% -5%;z-index:-1;background:radial-gradient(ellipse,rgba(205,159,87,.18),transparent 68%);filter:blur(28px)}
.book-cover img{display:block;width:100%;height:auto;border:1px solid rgba(218,177,108,.25)}
.intro-copy{text-align:left}.intro-copy h2{font-size:clamp(48px,6vw,82px);line-height:.95;margin:18px 0 28px;color:#f0e2ca}.intro-copy h2 em{font-weight:500;color:var(--gold-light)}
.intro-copy .ornament{display:block;letter-spacing:.55em;margin:0 0 28px;color:var(--gold)}
.intro-copy .intro-lead{font-size:clamp(24px,2.6vw,36px);text-align:left;color:#ded3c2}
.intro-copy>p:not(.eyebrow):not(.intro-lead){color:var(--muted)}
.intro-copy .text-link{display:inline-block;margin-top:18px;text-transform:uppercase;letter-spacing:.12em;font-size:11px}

.section-heading h2,.about h2,.newsletter h2{color:#f0dfc2}.story-card{background:linear-gradient(145deg,rgba(18,31,43,.88),rgba(5,13,20,.9));border-color:rgba(216,174,104,.16)}
.story-body h3{color:#ead5b4}.quote-section{background:#d8cfbd}.signature{color:var(--gold-light);font-style:italic}.newsletter-card{background:radial-gradient(circle at 85% 20%,rgba(122,91,48,.18),transparent 30%),rgba(255,255,255,.02)}

@media(max-width:900px){.hero-image{background-position:48% center}.intro-grid{grid-template-columns:1fr}.book-cover{width:min(520px,90%);justify-self:center}.intro-copy{text-align:center}.intro-copy .intro-lead{text-align:center}}
@media(max-width:560px){.hero-content{padding-top:2rem}.hero-image{min-height:92svh;background-position:45% center}.hero-welcome{font-size:31px}.hero-signature{font-size:88px!important}.hero-tagline{font-size:14px;letter-spacing:.12em}.hero-actions{width:100%;align-items:center}.button{width:min(320px,90%);text-align:center}.intro-grid{gap:45px}.intro-copy h2{font-size:48px}}

/* Affiches officielles des histoires */
.story-art{
  position:relative;
  overflow:hidden;
  background:#050b11!important;
}
.story-art img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition:transform .65s ease,filter .65s ease;
}
.story-card:hover .story-art img{
  transform:scale(1.035);
  filter:brightness(1.06);
}
.story-art::after{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(2,7,11,.03) 48%,rgba(2,7,11,.36) 100%);
}
.story-number{
  z-index:2;
  color:rgba(243,234,219,.72);
  text-shadow:0 2px 12px rgba(0,0,0,.8);
}
.well .story-art img{object-position:center center}
.chase .story-art img{object-position:center center}
.ice .story-art img{object-position:center center}
@media(max-width:900px){
  .story-art{height:300px}
}
@media(max-width:560px){
  .story-art{height:235px}
}

/* Correction de l'affiche La Poursuite : retire l'ancien décor abstrait superposé */
.chase .story-art::after{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(2,7,11,.02) 55%,rgba(2,7,11,.28) 100%);
}
.chase .story-art img{
  object-fit:cover;
  object-position:center center;
}


/* Page d’accueil v6 — la signature KatAli et la lune sont celles de l’image officielle */
.hero-content{padding-top:11rem}
.hero-welcome{margin-bottom:22px}
.hero-tagline{margin-top:0}
.hero-actions{margin-top:34px}
@media(max-width:900px){.hero-content{padding-top:10rem}}
@media(max-width:560px){
  .hero-content{padding-top:8rem}
  .hero-welcome{margin-bottom:18px}
  .hero-actions{margin-top:28px}
}


/* Page d’accueil v7 — séparateur lunaire discret entre les deux phrases */
.hero-welcome{margin-bottom:0}
.hero-divider{
  width:min(360px,72vw);
  gap:15px;
  margin:18px 0 13px;
  opacity:.86;
}
.hero-divider span{
  background:linear-gradient(90deg,transparent,rgba(240,201,130,.82));
}
.hero-divider span:last-child{
  background:linear-gradient(90deg,rgba(240,201,130,.82),transparent);
}
.hero-divider b{
  color:var(--gold-light);
  font-family:var(--serif);
  font-size:23px;
  line-height:1;
  text-shadow:0 0 14px rgba(240,201,130,.24);
}
.hero-actions{margin-top:29px}
@media(max-width:560px){
  .hero-divider{width:min(285px,78vw);margin:15px 0 11px}
  .hero-divider b{font-size:20px}
  .hero-actions{margin-top:25px}
}


/* Page d’accueil v8 — titre du recueil entre la signature KatAli et l’invitation */
.hero-series-title{
  display:flex;
  flex-direction:column;
  align-items:center;
  margin:0 0 17px;
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(25px,2.65vw,39px);
  line-height:.82;
  letter-spacing:.075em;
  text-transform:uppercase;
  background:linear-gradient(180deg,#f1d39a 0%,#d5a75e 58%,#a77739 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 3px 8px rgba(0,0,0,.72));
}
.hero-series-title span:last-child{
  margin-top:8px;
  font-size:1.16em;
  letter-spacing:.115em;
}
.hero-welcome{font-size:clamp(29px,3.75vw,53px)}
.hero-divider{margin-top:16px}
@media(max-width:900px){
  .hero-series-title{font-size:clamp(24px,4vw,35px);margin-bottom:15px}
}
@media(max-width:560px){
  .hero-content{padding-top:7.5rem}
  .hero-series-title{font-size:23px;line-height:.86;letter-spacing:.055em;margin-bottom:13px}
  .hero-series-title span:last-child{margin-top:6px;letter-spacing:.09em}
  .hero-welcome{font-size:29px}
  .hero-divider{margin-top:13px}
}

/* Page d’accueil v9 — finition visuelle */
/* Masque délicatement l’ancien texte intégré au haut de l’image, sans cacher l’ornement lunaire. */
.hero-overlay::before{
  content:'';
  position:absolute;
  z-index:0;
  top:0;
  left:50%;
  width:min(680px,72vw);
  height:72px;
  transform:translateX(-50%);
  pointer-events:none;
  background:radial-gradient(ellipse at 50% 0%,rgba(2,8,13,.99) 0%,rgba(2,8,13,.97) 42%,rgba(2,8,13,.72) 64%,rgba(2,8,13,0) 84%);
}

/* Le nom du recueil gagne légèrement en présence et se rapproche de la signature KatAli. */
.hero-series-title{
  margin:-24px 0 16px;
  font-size:clamp(28px,3vw,44px);
  background:linear-gradient(180deg,#f8dda8 0%,#e4ba70 55%,#b9823e 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 3px 9px rgba(0,0,0,.82)) drop-shadow(0 0 10px rgba(222,177,99,.12));
}

/* Les appels à l’action restent raffinés, mais deviennent plus faciles à lire. */
.button{
  font-size:12px;
  letter-spacing:.105em;
  padding:15px 24px;
}

@media(max-width:900px){
  .hero-overlay::before{width:min(600px,84vw);height:68px}
  .hero-series-title{margin:-16px 0 15px;font-size:clamp(26px,4.6vw,38px)}
}

@media(max-width:560px){
  .hero-overlay::before{width:92vw;height:58px}
  .hero-series-title{margin:-8px 0 13px;font-size:25px}
  .button{font-size:11px;padding:14px 20px}
}


/* Section des chroniques v11 — cartes rapprochées et entièrement interactives */
.stories .section-heading{margin-bottom:24px}
.story-card[role="button"]{cursor:pointer;outline:none;display:flex;flex-direction:column}
.story-card .story-body{display:flex;flex:1;flex-direction:column}
.story-card .story-body>p{flex:1}
.story-card[role="button"]:focus-visible{
  border-color:rgba(232,194,122,.72);
  box-shadow:0 0 0 3px rgba(217,181,109,.16),0 25px 60px rgba(0,0,0,.28);
  transform:translateY(-5px);
}
.story-card .story-open{display:inline-block;margin-top:auto;padding-top:10px}
.story-card:hover .story-open span,
.story-card:focus-visible .story-open span{transform:translateX(5px)}
@media(max-width:560px){.stories .section-heading{margin-bottom:20px}}

/* Section manifeste v13 — une porte lumineuse au cœur de la nuit */
.quote-section{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:720px;
  display:grid;
  align-items:center;
  color:#f0e5d2;
  background:
    radial-gradient(circle at 18% 43%,rgba(213,172,99,.095),transparent 28%),
    radial-gradient(circle at 76% 12%,rgba(78,111,143,.16),transparent 32%),
    linear-gradient(180deg,#071019 0%,#0b1621 48%,#060d14 100%);
  border-top:1px solid rgba(217,181,109,.12);
  border-bottom:1px solid rgba(217,181,109,.12);
}
.quote-section::before{
  content:'';
  position:absolute;
  z-index:-3;
  inset:0;
  opacity:.34;
  background-image:
    radial-gradient(circle at 11% 18%,rgba(255,244,216,.82) 0 1px,transparent 1.7px),
    radial-gradient(circle at 26% 33%,rgba(255,244,216,.58) 0 1px,transparent 1.6px),
    radial-gradient(circle at 42% 14%,rgba(255,244,216,.72) 0 1px,transparent 1.7px),
    radial-gradient(circle at 59% 26%,rgba(255,244,216,.48) 0 1px,transparent 1.7px),
    radial-gradient(circle at 77% 16%,rgba(255,244,216,.72) 0 1px,transparent 1.7px),
    radial-gradient(circle at 91% 37%,rgba(255,244,216,.55) 0 1px,transparent 1.7px);
  background-size:290px 220px,330px 270px,260px 240px,350px 260px,300px 230px,370px 280px;
}
.quote-section::after{
  content:'';
  position:absolute;
  z-index:-2;
  inset:auto -8% -18% -8%;
  height:58%;
  opacity:.74;
  background:
    linear-gradient(180deg,transparent 0%,rgba(3,8,12,.34) 22%,rgba(2,6,10,.94) 100%),
    repeating-conic-gradient(from 33deg at 50% 100%,transparent 0 6deg,#050c12 6.4deg 10deg,transparent 10.4deg 17deg);
  clip-path:polygon(0 100%,0 58%,4% 43%,8% 67%,12% 28%,16% 62%,21% 38%,25% 73%,30% 25%,35% 64%,40% 42%,45% 75%,50% 30%,55% 66%,61% 37%,67% 71%,72% 24%,77% 62%,82% 34%,87% 68%,92% 30%,96% 60%,100% 46%,100% 100%);
}
.quote-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(300px,.82fr) minmax(430px,1.18fr);
  gap:clamp(64px,8vw,120px);
  align-items:center;
}
.quote-mist{
  position:absolute;
  z-index:-1;
  pointer-events:none;
  border-radius:50%;
  filter:blur(30px);
  opacity:.27;
}
.quote-mist-one{
  width:54%;
  height:120px;
  left:-8%;
  bottom:17%;
  background:linear-gradient(90deg,transparent,rgba(124,152,171,.38),transparent);
  transform:rotate(-4deg);
}
.quote-mist-two{
  width:48%;
  height:95px;
  right:-5%;
  top:24%;
  background:linear-gradient(90deg,transparent,rgba(104,130,153,.25),transparent);
  transform:rotate(5deg);
}
.quote-forest{position:absolute;inset:0;z-index:-2;pointer-events:none}
.quote-art{
  position:relative;
  height:500px;
  display:grid;
  place-items:center;
  background:none;
  border-radius:0;
  perspective:1000px;
}
.quote-art::before{
  content:'';
  position:absolute;
  width:360px;
  height:420px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(212,168,91,.18),rgba(212,168,91,.06) 40%,transparent 70%);
  filter:blur(18px);
}
.quote-art::after{
  content:'';
  position:absolute;
  left:50%;
  bottom:17px;
  width:330px;
  height:70px;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(226,184,106,.24),rgba(0,0,0,.38) 46%,transparent 72%);
  filter:blur(8px);
}
.dream-gateway{
  position:relative;
  z-index:2;
  width:286px;
  height:420px;
  padding:22px;
  border-radius:150px 150px 18px 18px;
  background:
    radial-gradient(circle at 18% 20%,rgba(255,255,255,.05) 0 2px,transparent 3px),
    radial-gradient(circle at 72% 38%,rgba(255,255,255,.04) 0 2px,transparent 3px),
    linear-gradient(145deg,#1a222b 0%,#0d141c 48%,#202832 100%);
  border:1px solid rgba(219,179,106,.42);
  box-shadow:
    0 35px 80px rgba(0,0,0,.58),
    inset 0 0 0 8px rgba(0,0,0,.28),
    inset 0 0 32px rgba(215,174,98,.07),
    0 0 42px rgba(210,164,82,.08);
}
.dream-gateway::before,
.dream-gateway::after{
  content:'';
  position:absolute;
  pointer-events:none;
  border:1px solid rgba(225,191,128,.16);
  border-radius:inherit;
}
.dream-gateway::before{inset:9px}
.dream-gateway::after{inset:15px;border-color:rgba(255,255,255,.045)}
.gateway-opening{
  position:relative;
  width:100%;
  height:100%;
  overflow:hidden;
  border-radius:125px 125px 7px 7px;
  background:
    radial-gradient(circle at 50% 67%,rgba(238,197,119,.68),rgba(197,145,67,.28) 12%,transparent 31%),
    linear-gradient(180deg,#06111d 0%,#0a1d2b 54%,#0e1a20 100%);
  border:1px solid rgba(230,196,134,.22);
  box-shadow:inset 0 0 55px rgba(0,0,0,.86),inset 0 -40px 50px rgba(0,0,0,.55);
}
.gateway-opening::before{
  content:'';
  position:absolute;
  inset:0;
  opacity:.36;
  background-image:radial-gradient(circle,rgba(255,245,219,.9) 0 1px,transparent 1.7px);
  background-size:46px 52px;
  mask-image:linear-gradient(#000 0 60%,transparent 86%);
}
.gateway-opening::after{
  content:'';
  position:absolute;
  inset:auto -14% 0;
  height:48%;
  background:
    linear-gradient(180deg,transparent,rgba(2,7,10,.95)),
    repeating-conic-gradient(from 31deg at 50% 100%,transparent 0 7deg,#03090d 7.4deg 11deg,transparent 11.4deg 19deg);
  clip-path:polygon(0 100%,0 70%,8% 45%,14% 77%,22% 34%,29% 72%,37% 48%,45% 78%,54% 31%,63% 71%,71% 43%,80% 75%,89% 38%,96% 69%,100% 53%,100% 100%);
}
.gateway-moon{
  position:absolute;
  z-index:2;
  top:61px;
  left:50%;
  transform:translateX(-50%);
  color:#edc87f;
  font-family:var(--serif);
  font-size:35px;
  text-shadow:0 0 18px rgba(237,200,127,.5);
}
.gateway-star{position:absolute;z-index:2;width:3px;height:3px;border-radius:50%;background:#f4d898;box-shadow:0 0 9px rgba(244,216,152,.9)}
.gateway-star-one{top:84px;left:57px}.gateway-star-two{top:117px;right:54px}.gateway-star-three{top:155px;left:42px}.gateway-star-four{top:183px;right:42px}
.gateway-horizon{
  position:absolute;
  z-index:3;
  left:50%;
  bottom:105px;
  width:104px;
  height:3px;
  transform:translateX(-50%);
  background:radial-gradient(ellipse,rgba(252,213,139,.95),rgba(211,160,77,.24) 50%,transparent 72%);
  box-shadow:0 0 25px rgba(238,190,106,.78);
}
.gateway-path{
  position:absolute;
  z-index:3;
  left:50%;
  bottom:-2px;
  width:124px;
  height:126px;
  transform:translateX(-50%);
  clip-path:polygon(42% 0,58% 0,100% 100%,0 100%);
  background:linear-gradient(180deg,rgba(240,200,123,.62),rgba(139,99,48,.12) 58%,rgba(2,6,9,.05));
  filter:drop-shadow(0 0 14px rgba(229,182,94,.28));
}
.gateway-step{
  position:absolute;
  z-index:1;
  left:50%;
  height:17px;
  transform:translateX(-50%);
  border:1px solid rgba(221,182,110,.2);
  background:linear-gradient(180deg,#1a222b,#0b1016);
  box-shadow:0 8px 16px rgba(0,0,0,.38);
}
.gateway-step-one{bottom:-17px;width:326px}.gateway-step-two{bottom:-34px;width:370px;opacity:.72}
.dream-particles{position:absolute;z-index:4;inset:0;pointer-events:none}
.dream-particles i{position:absolute;width:4px;height:4px;border-radius:50%;background:#e8bc6e;box-shadow:0 0 12px rgba(232,188,110,.9);animation:dreamFloat 4.5s ease-in-out infinite}
.dream-particles i:nth-child(1){left:21%;top:27%;animation-delay:-.4s}.dream-particles i:nth-child(2){left:75%;top:31%;animation-delay:-1.5s}.dream-particles i:nth-child(3){left:12%;top:55%;animation-delay:-2.4s}.dream-particles i:nth-child(4){left:84%;top:61%;animation-delay:-.9s}.dream-particles i:nth-child(5){left:29%;top:78%;animation-delay:-3.3s}.dream-particles i:nth-child(6){left:68%;top:82%;animation-delay:-2s}.dream-particles i:nth-child(7){left:50%;top:14%;animation-delay:-1.1s}
@keyframes dreamFloat{0%,100%{transform:translateY(0);opacity:.34}50%{transform:translateY(-11px);opacity:1}}
.dream-quote{position:relative;margin:0;max-width:690px;padding:34px 0}
.quote-section blockquote .quote-eyebrow{
  margin:0 0 15px;
  color:#d7aa5d;
  font-size:11px;
  font-family:var(--sans)!important;
  font-weight:600;
  letter-spacing:.25em;
  line-height:1.4!important;
  text-transform:uppercase;
}
.quote-mark{
  display:block;
  height:48px;
  margin-left:-5px;
  color:#d6a958;
  font-family:var(--serif);
  font-size:112px;
  line-height:.55;
  text-shadow:0 0 26px rgba(214,169,88,.16);
}
.quote-section blockquote .quote-text{
  margin:24px 0 25px;
  color:#eee3d1;
  font-family:var(--serif);
  font-size:clamp(34px,3.5vw,51px);
  font-weight:500;
  line-height:1.12;
  text-wrap:balance;
  text-shadow:0 3px 18px rgba(0,0,0,.34);
}
.quote-text span{color:#e2b86f;text-shadow:0 0 15px rgba(226,184,111,.12)}
.quote-signature{
  margin:0;
  color:#e3b96e!important;
  font-family:'Allura','Cormorant Garamond',Georgia,serif;
  font-size:54px!important;
  font-weight:400;
  line-height:1;
  letter-spacing:.01em!important;
  text-transform:none!important;
  text-shadow:0 0 18px rgba(227,185,110,.16);
}
.quote-divider{display:flex;align-items:center;width:min(290px,64%);gap:13px;margin-top:15px;color:#d8aa5d}
.quote-divider span{height:1px;flex:1;background:linear-gradient(90deg,rgba(216,170,93,.06),rgba(216,170,93,.7))}.quote-divider span:last-child{background:linear-gradient(90deg,rgba(216,170,93,.7),rgba(216,170,93,.06))}
.quote-divider b{font-family:var(--serif);font-size:19px;font-weight:400;line-height:1}
@media(max-width:960px){
  .quote-section{min-height:auto;padding:95px 0 110px}
  .quote-grid{grid-template-columns:1fr;gap:65px;text-align:center}
  .quote-art{height:445px}
  .dream-gateway{width:250px;height:368px;padding:19px}
  .gateway-step-one{width:286px}.gateway-step-two{width:322px}
  .dream-quote{justify-self:center;max-width:720px;padding:0}
  .quote-mark{margin-left:0}
  .quote-divider{margin:15px auto 0}
}
@media(max-width:560px){
  .quote-section{padding:78px 0 90px}
  .quote-grid{gap:48px}
  .quote-art{height:365px}
  .dream-gateway{width:204px;height:305px;padding:15px;border-radius:112px 112px 14px 14px}
  .gateway-opening{border-radius:98px 98px 5px 5px}
  .gateway-moon{top:43px;font-size:28px}
  .gateway-star-one{top:65px;left:43px}.gateway-star-two{top:93px;right:41px}.gateway-star-three{top:121px;left:32px}.gateway-star-four{top:145px;right:31px}
  .gateway-horizon{bottom:77px;width:80px}.gateway-path{height:96px;width:95px}
  .gateway-step-one{width:230px;bottom:-14px}.gateway-step-two{width:260px;bottom:-28px}
  .quote-section blockquote .quote-eyebrow{font-size:10px}
  .quote-mark{font-size:88px;height:37px}
  .quote-section blockquote .quote-text{font-size:clamp(30px,9vw,39px);line-height:1.13}
  .quote-signature{font-size:47px!important}
  .quote-divider{width:min(260px,78%)}
}
@media(prefers-reduced-motion:reduce){.dream-particles i{animation:none}}

/* Section À propos v14 — manifeste d’auteure dans la continuité onirique */
.about{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:105px 0 128px;
  background:
    radial-gradient(circle at 16% 24%,rgba(215,174,98,.09),transparent 29%),
    radial-gradient(circle at 82% 15%,rgba(76,109,142,.13),transparent 34%),
    linear-gradient(180deg,#0b151f 0%,#0e1823 55%,#080f17 100%);
  border-top:1px solid rgba(217,181,109,.1);
  border-bottom:1px solid rgba(217,181,109,.09);
}
.about::before{
  content:'';
  position:absolute;
  z-index:-3;
  inset:0;
  opacity:.28;
  pointer-events:none;
  background-image:
    radial-gradient(circle at 12% 22%,rgba(255,244,220,.82) 0 1px,transparent 1.7px),
    radial-gradient(circle at 28% 41%,rgba(255,244,220,.48) 0 1px,transparent 1.7px),
    radial-gradient(circle at 48% 16%,rgba(255,244,220,.68) 0 1px,transparent 1.7px),
    radial-gradient(circle at 66% 34%,rgba(255,244,220,.5) 0 1px,transparent 1.7px),
    radial-gradient(circle at 86% 18%,rgba(255,244,220,.74) 0 1px,transparent 1.7px);
  background-size:300px 250px,340px 270px,280px 230px,360px 290px,310px 260px;
}
.about::after{
  content:'';
  position:absolute;
  z-index:-2;
  left:-5%;
  right:-5%;
  bottom:-28px;
  height:190px;
  pointer-events:none;
  opacity:.72;
  background:
    linear-gradient(180deg,transparent 0%,rgba(4,10,15,.48) 35%,rgba(2,6,10,.98) 100%),
    repeating-conic-gradient(from 31deg at 50% 100%,transparent 0 7deg,#040b10 7.4deg 11deg,transparent 11.4deg 19deg);
  clip-path:polygon(0 100%,0 72%,4% 44%,8% 70%,13% 31%,17% 68%,22% 43%,27% 74%,32% 28%,37% 65%,42% 42%,47% 76%,52% 32%,57% 68%,62% 40%,67% 73%,72% 27%,77% 65%,82% 37%,87% 70%,92% 31%,96% 62%,100% 48%,100% 100%);
}
.about-mist{
  position:absolute;
  z-index:-1;
  pointer-events:none;
  height:95px;
  border-radius:50%;
  filter:blur(32px);
  opacity:.23;
}
.about-mist-left{width:50%;left:-9%;bottom:19%;background:linear-gradient(90deg,transparent,rgba(118,145,166,.38),transparent);transform:rotate(-3deg)}
.about-mist-right{width:44%;right:-7%;top:21%;background:linear-gradient(90deg,transparent,rgba(96,126,151,.28),transparent);transform:rotate(5deg)}
.about-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(390px,.95fr) minmax(520px,1.05fr);
  gap:clamp(78px,8vw,125px);
  align-items:center;
}
.about-copy{
  position:relative;
  min-height:470px;
  padding:46px 22px 40px 8px;
}
.about-copy>*:not(.about-celestial){position:relative;z-index:2}
.about-celestial{
  position:absolute;
  z-index:0;
  top:-40px;
  left:-105px;
  width:520px;
  height:360px;
  pointer-events:none;
  opacity:.55;
}
.about-crescent{
  position:absolute;
  left:30px;
  top:10px;
  color:rgba(217,181,109,.12);
  font-family:var(--serif);
  font-size:310px;
  line-height:1;
  transform:rotate(-11deg);
  text-shadow:0 0 65px rgba(217,181,109,.06);
}
.about-constellation{
  position:absolute;
  right:0;
  bottom:6px;
  width:330px;
  height:190px;
  overflow:visible;
  opacity:.3;
}
.about-constellation path{fill:none;stroke:#d9b56d;stroke-width:.8;stroke-dasharray:3 7}
.about-constellation circle{fill:#e3bd75;filter:drop-shadow(0 0 5px rgba(227,189,117,.55))}
.about .eyebrow{margin-bottom:22px}
.about h2{
  margin:0 0 28px;
  color:#f1dfc1;
  font-size:clamp(58px,5.2vw,82px);
  letter-spacing:-.035em;
  text-shadow:0 3px 24px rgba(0,0,0,.42);
}
.about-copy>p:not(.eyebrow){
  max-width:610px;
  margin:0 0 21px;
  color:#aeb9c8;
  font-size:16px;
  line-height:1.82;
}
.about-copy strong{color:#efe2cf;font-weight:600}
.about-signature-lockup{display:inline-flex;flex-direction:column;align-items:flex-start;margin-top:13px}
.about .signature{
  margin:0;
  color:#e5b86b;
  font-family:'Allura','Cormorant Garamond',Georgia,serif;
  font-size:72px;
  font-style:normal;
  font-weight:400;
  line-height:.95;
  text-shadow:0 0 20px rgba(229,184,107,.16);
}
.about-signature-divider{display:flex;align-items:center;width:230px;gap:11px;margin-top:8px;color:#d6aa60}
.about-signature-divider span{height:1px;flex:1;background:linear-gradient(90deg,rgba(214,170,96,.05),rgba(214,170,96,.62))}
.about-signature-divider span:last-child{background:linear-gradient(90deg,rgba(214,170,96,.62),rgba(214,170,96,.05))}
.about-signature-divider b{font-family:var(--serif);font-size:17px;font-weight:400;line-height:1}
.about .values{
  position:relative;
  padding:9px 0 9px;
  border:0;
}
.about .values::before{
  content:'';
  position:absolute;
  top:57px;
  bottom:57px;
  left:83px;
  width:1px;
  background:linear-gradient(180deg,rgba(217,181,109,.08),rgba(217,181,109,.55) 22%,rgba(217,181,109,.4) 78%,rgba(217,181,109,.05));
  box-shadow:0 0 14px rgba(217,181,109,.08);
}
.about .value{
  position:relative;
  display:grid;
  grid-template-columns:50px 66px 1fr;
  gap:22px;
  align-items:center;
  min-height:142px;
  padding:24px 0;
  border:0;
}
.about .value:not(:last-child)::after{
  content:'';
  position:absolute;
  left:139px;
  right:0;
  bottom:0;
  height:1px;
  background:linear-gradient(90deg,rgba(255,255,255,.13),rgba(255,255,255,.025));
}
.value-number{
  align-self:start;
  padding-top:17px;
  color:#d8aa5f;
  font-family:var(--serif);
  font-size:25px;
  line-height:1;
}
.value-icon{
  position:relative;
  z-index:2;
  width:56px;
  height:56px;
  display:grid;
  place-items:center;
  border:1px solid rgba(217,181,109,.38);
  border-radius:50%;
  color:#dfb66d;
  background:radial-gradient(circle at 35% 30%,rgba(221,180,104,.09),rgba(8,16,24,.92) 68%);
  box-shadow:0 0 0 7px rgba(10,20,29,.86),0 0 26px rgba(217,181,109,.08);
}
.value-icon::before{
  content:'';
  position:absolute;
  inset:6px;
  border:1px solid rgba(217,181,109,.11);
  border-radius:50%;
}
.value-icon svg{width:31px;height:31px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.value-copy{padding:5px 0}
.about .value h3{
  margin:0 0 7px;
  color:#f0dfc2;
  font-family:var(--serif);
  font-size:31px;
  font-weight:500;
  line-height:1.05;
}
.about .value p{
  max-width:430px;
  margin:0;
  color:#aeb8c6;
  font-size:14px;
  line-height:1.7;
}
.about .value:hover .value-icon{border-color:rgba(229,190,117,.7);box-shadow:0 0 0 7px rgba(10,20,29,.86),0 0 30px rgba(217,181,109,.16)}
.about .value:hover .value-icon svg{filter:drop-shadow(0 0 5px rgba(223,182,109,.35))}

@media(max-width:1000px){
  .about{padding:95px 0 118px}
  .about-grid{grid-template-columns:1fr;gap:48px;max-width:800px}
  .about-copy{min-height:auto;text-align:center;padding:30px 20px 15px}
  .about-copy>p:not(.eyebrow){margin-left:auto;margin-right:auto}
  .about-celestial{left:50%;top:-65px;transform:translateX(-58%);opacity:.4}
  .about-signature-lockup{align-items:center}
  .about .values{width:min(680px,100%);margin:0 auto}
}
@media(max-width:620px){
  .about{padding:78px 0 102px}
  .about-grid{gap:36px}
  .about-copy{padding:22px 0 10px}
  .about-celestial{width:390px;height:285px;top:-48px;transform:translateX(-55%)}
  .about-crescent{font-size:235px}
  .about-constellation{width:250px;height:145px}
  .about h2{font-size:54px;margin-bottom:23px}
  .about-copy>p:not(.eyebrow){font-size:15px;line-height:1.75}
  .about .signature{font-size:62px}
  .about .values::before{left:27px;top:52px;bottom:52px}
  .about .value{grid-template-columns:56px 1fr;gap:17px;min-height:0;padding:25px 0}
  .about .value:not(:last-child)::after{left:74px}
  .value-number{display:none}
  .value-icon{width:54px;height:54px}
  .about .value h3{font-size:28px}
  .about .value p{font-size:13px}
}


/* Ajustements v15 — constellation sans lune et numéros dans les médaillons */
.about-crescent{display:none!important}
.about-celestial{
  top:-5px;
  left:-25px;
  width:430px;
  height:270px;
  opacity:.42;
}
.about-constellation{
  right:auto;
  left:0;
  bottom:8px;
  width:330px;
  height:190px;
  opacity:.27;
}
.about .values::before{left:28px}
.about .value{
  grid-template-columns:66px 1fr;
  gap:27px;
}
.about .value:not(:last-child)::after{left:93px}
.value-number{display:none!important}
.value-icon{
  font-family:var(--serif);
  font-size:22px;
  font-weight:600;
  letter-spacing:.04em;
  line-height:1;
}
.value-icon::before{inset:6px}
.about .value:hover .value-icon{
  color:#efc77d;
  transform:translateY(-1px);
}
@media(max-width:1000px){
  .about-celestial{left:50%;transform:translateX(-50%);top:-18px;width:410px;opacity:.34}
  .about-constellation{left:50%;transform:translateX(-50%)}
}
@media(max-width:560px){
  .about-celestial{width:310px;height:220px;top:-5px}
  .about-constellation{width:275px;height:158px}
  .about .values::before{left:24px}
  .about .value{grid-template-columns:56px 1fr;gap:18px}
  .about .value:not(:last-child)::after{left:74px}
  .value-icon{width:49px;height:49px;font-size:19px}
}


/* ===== Pied de page final — v16 ===== */
.site-footer{
  position:relative;
  overflow:hidden;
  padding:50px 0 38px;
  border-top:1px solid rgba(217,181,109,.13);
  background:
    radial-gradient(circle at 50% 0%,rgba(89,119,148,.08),transparent 38%),
    linear-gradient(180deg,#060d14 0%,#050a10 100%);
}
.site-footer::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.20;
  background-image:
    radial-gradient(circle at 18% 35%,rgba(241,220,180,.7) 0 1px,transparent 1.6px),
    radial-gradient(circle at 72% 28%,rgba(241,220,180,.55) 0 1px,transparent 1.6px),
    radial-gradient(circle at 88% 70%,rgba(241,220,180,.35) 0 1px,transparent 1.6px);
}
.footer-inner.footer-final{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:0;
  text-align:center;
  color:var(--muted);
}
.footer-final .brand{
  color:#f1dfc0;
  font-size:15px;
}
.footer-final .brand-mark{
  width:36px;
  height:36px;
  font-size:19px;
}
.footer-tagline{
  margin:15px 0 0;
  color:#d8b979;
  font-family:var(--serif);
  font-size:19px;
  font-style:italic;
  letter-spacing:.025em;
}
.footer-divider{
  display:flex;
  align-items:center;
  width:min(230px,64vw);
  margin:15px auto 14px;
  color:#c99c54;
}
.footer-divider span{
  height:1px;
  flex:1;
  background:linear-gradient(90deg,transparent,rgba(201,156,84,.58));
}
.footer-divider span:last-child{
  background:linear-gradient(90deg,rgba(201,156,84,.58),transparent);
}
.footer-divider b{
  padding:0 13px;
  font-family:var(--serif);
  font-size:18px;
  font-weight:400;
  line-height:1;
}
.footer-links{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px;
  color:#aeb7c2;
  font-size:13px;
}
.footer-links a{
  transition:color .2s ease;
}
.footer-links a:hover,
.footer-links a:focus-visible{
  color:#e1bd79;
}
.footer-links span{
  color:rgba(217,181,109,.42);
}
.footer-copyright{
  margin:18px 0 0;
  color:#77818d;
  font-size:11px;
  letter-spacing:.035em;
}
@media(max-width:560px){
  .site-footer{padding:43px 0 32px}
  .footer-tagline{font-size:17px}
  .footer-links{gap:8px;font-size:12px}
}


/* Correctifs de lancement v23 */
html{scroll-padding-top:90px}
section[id],article[id],main[id]{scroll-margin-top:90px}

.story-card{
  display:flex;
  flex-direction:column;
  cursor:pointer;
  color:inherit;
  outline:none;
}
.story-card .story-body{display:flex;flex:1;flex-direction:column}
.story-card .story-body>p{flex:1}
.story-card:focus-visible{
  border-color:rgba(217,181,109,.72);
  box-shadow:0 0 0 3px rgba(217,181,109,.22),0 25px 60px rgba(0,0,0,.25);
  transform:translateY(-4px);
}
.story-card .story-open{display:inline-block;margin-top:auto;padding-top:10px}
.story-card:hover .story-open span,
.story-card:focus-visible .story-open span{transform:translateX(5px)}

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

@media(prefers-reduced-motion:reduce){
  .js .reveal{opacity:1;transform:none;transition:none}
}


/* Page 404 */
.not-found-page{background:#050a10}
.not-found{
  min-height:100svh;
  position:relative;
  display:grid;
  place-items:center;
  padding:32px;
  background:url("assets/intro-katali.webp") center/cover no-repeat;
}
.not-found-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(2,7,11,.64),rgba(2,7,11,.86));
}
.not-found-card{
  position:relative;
  z-index:1;
  width:min(620px,100%);
  padding:clamp(38px,7vw,72px);
  text-align:center;
  border:1px solid rgba(217,181,109,.28);
  border-radius:24px;
  background:rgba(6,14,23,.76);
  backdrop-filter:blur(15px);
  box-shadow:0 30px 100px rgba(0,0,0,.45);
}
.not-found-card h1{
  margin:10px 0 0;
  font-family:var(--serif);
  font-size:clamp(100px,18vw,190px);
  font-weight:500;
  line-height:.85;
  color:#f0dfc2;
}
.not-found-card>p:not(.eyebrow){
  margin:28px auto;
  color:#d0d7df;
  font-family:var(--serif);
  font-size:clamp(24px,4vw,34px);
}
.not-found-card .footer-divider{margin:28px auto}


/* Navigation interne centrée — v24 */
section[id],
article[id],
main[id]{
  scroll-margin-top:0;
}

/* Avec JavaScript, le calcul tient compte du contenu réel de chaque section. */
html.js{
  scroll-padding-top:0;
}

/* Sans JavaScript, l’ancre native reste dégagée sous le menu fixe. */
html.no-js{
  scroll-padding-top:90px;
}


/* Finitions mobiles v27 — accueil */
@media(max-width:560px){
  .hero-image{
    min-height:86svh;
    max-height:920px;
    background-position:50% center;
  }

  .hero-content{
    padding-top:6.25rem;
  }

  .hero-series-title{
    margin-bottom:10px;
  }

  .hero-welcome{
    line-height:1.05;
  }

  .hero-divider{
    margin-top:11px;
    margin-bottom:9px;
  }

  .hero-actions{
    gap:10px;
    margin-top:20px;
  }

  .hero-actions .button{
    padding-top:12px;
    padding-bottom:12px;
  }
}

@media(max-width:390px){
  .hero-image{
    min-height:88svh;
  }

  .hero-content{
    padding-top:5.6rem;
  }

  .hero-series-title{
    font-size:21px;
  }

  .hero-welcome{
    font-size:27px;
  }

  .hero-tagline{
    font-size:13px;
  }
}