/* ==========================================================================
   Le Château de Fanny — feuille de style unique
   Écrit à la main. Aucune dépendance. Couleurs héraldiques, pierre, or, nuit.
   ========================================================================== */

@font-face{font-family:"Cinzel";font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/cinzel-400-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cinzel";font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/cinzel-400-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cinzel";font-style:normal;font-weight:700;font-display:swap;
  src:url(../fonts/cinzel-700-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cinzel";font-style:normal;font-weight:700;font-display:swap;
  src:url(../fonts/cinzel-700-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cinzel";font-style:normal;font-weight:900;font-display:swap;
  src:url(../fonts/cinzel-900-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cinzel";font-style:normal;font-weight:900;font-display:swap;
  src:url(../fonts/cinzel-900-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:300;font-display:swap;
  src:url(../fonts/cormorant-garamond-300-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:300;font-display:swap;
  src:url(../fonts/cormorant-garamond-300-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/cormorant-garamond-400-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/cormorant-garamond-400-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:400;font-display:swap;
  src:url(../fonts/cormorant-garamond-400i-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:400;font-display:swap;
  src:url(../fonts/cormorant-garamond-400i-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;
  src:url(../fonts/cormorant-garamond-600-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;
  src:url(../fonts/cormorant-garamond-600-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"IM Fell English";font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/im-fell-english-400-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IM Fell English";font-style:italic;font-weight:400;font-display:swap;
  src:url(../fonts/im-fell-english-400i-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --night:#05090e;
  --night-2:#09111b;
  --forest-0:#0a1511;
  --forest-1:#0f1e17;
  --forest-2:#162a20;
  --forest-3:#1e3a2b;
  --stone-0:#f2ebdd;
  --stone-1:#e9e0cd;
  --stone-2:#d8cbb3;
  --stone-3:#b6a88d;
  --parch-0:#f1e7d2;
  --parch-1:#e6d9be;
  --ink:#161813;
  --ink-soft:#3c4038;
  --ink-mute:#64685c;
  --ivory:#f4ecdb;
  --ivory-dim:#c9c1ae;
  --gold:#c19a4e;
  --gold-2:#e0c184;
  --gold-3:#f4e3b8;
  --gold-ink:#77571d;
  --gold-deep:#6d4f1c;
  --gules:#b4575f;
  --azure:#6f8fb8;
  --sinople:#6f9d7a;
  --pourpre:#a47ab0;
  --serif:"Cormorant Garamond",Iowan Old Style,"Palatino Linotype",Georgia,serif;
  --display:"Cinzel","Trajan Pro","Optima",Georgia,serif;
  --fell:"IM Fell English",Georgia,serif;
  --wrap:1240px;
  --gut:clamp(1.15rem,4vw,3.25rem);
  --sec:clamp(4.5rem,9vw,8rem);
  --ease:cubic-bezier(.19,.71,.25,1);
  --shadow:0 40px 80px -36px rgba(0,0,0,.85);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:86px;overflow-x:clip}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--night);color:var(--ivory);
  font-family:var(--serif);font-weight:400;font-size:clamp(1.08rem,.42vw + .98rem,1.24rem);
  line-height:1.66;letter-spacing:.004em;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
h1,h2,h3,h4,p,ul,ol,dl,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
::selection{background:rgba(193,154,78,.32);color:#fff}
:focus-visible{outline:2px solid var(--gold-2);outline-offset:4px;border-radius:1px}

/* ---------------------------------- outils -------------------------------- */
.wrap{width:min(100% - 2 * var(--gut),var(--wrap));margin-inline:auto}
.label{
  font-family:var(--display);font-weight:400;font-size:.66rem;letter-spacing:.3em;
  text-transform:uppercase;color:var(--gold-2);display:flex;align-items:center;gap:.7rem;
}
.label::before{content:"";width:1.8rem;height:1px;background:currentColor;opacity:.55;flex:none}
.label--plain::before{display:none}
.lede{font-size:clamp(1.12rem,1.2vw,1.3rem);line-height:1.6;color:var(--ivory-dim);max-width:44ch}
.note{font-family:var(--fell);font-style:italic;font-size:.98rem;line-height:1.55;color:#8d8a7b}
.h-display{
  font-family:var(--display);font-weight:400;line-height:1.06;letter-spacing:.005em;
  font-size:clamp(2rem,4.2vw,3.4rem);text-wrap:balance;
}
.h-display em{font-style:normal;color:var(--gold-2)}
.rule{height:1px;background:linear-gradient(90deg,transparent,rgba(193,154,78,.55),transparent);border:0}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:fixed;left:1rem;top:-100px;z-index:200;background:var(--stone-0);color:var(--ink);
  padding:.7rem 1rem;font-family:var(--display);font-size:.8rem;letter-spacing:.12em}
.skip:focus{top:1rem}
.crenel{width:100%;height:22px;display:block;position:relative;z-index:2;margin-bottom:-1px}
.crenel--down{margin-top:-1px;margin-bottom:0}

/* --------------------------------- entête -------------------------------- */
.topbar{
  position:fixed;inset:0 0 auto;z-index:100;display:flex;align-items:center;gap:1rem;
  padding:.95rem var(--gut);transition:background .5s var(--ease),box-shadow .5s var(--ease),padding .4s;
}
.topbar.is-stuck{background:rgba(5,10,15,.95);backdrop-filter:blur(14px) saturate(1.1);
  box-shadow:0 1px 0 rgba(193,154,78,.22),0 18px 40px -30px #000;padding-block:.65rem}
.brand{display:flex;align-items:center;gap:.7rem;min-width:0}
.brand svg{width:26px;height:auto;color:var(--gold-2);flex:none}
.brand__txt{display:grid;line-height:1.05}
.brand__name{font-family:var(--display);font-size:.82rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory)}
.brand__sub{font-family:var(--fell);font-style:italic;font-size:.72rem;color:#a9a390;letter-spacing:.02em}
.topnav{display:flex;gap:1.6rem;margin-left:auto;align-items:center}
.topnav a{
  font-family:var(--display);font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;
  color:#cfc7b4;padding:.4rem 0;border-bottom:1px solid transparent;transition:.3s;
}
.topnav a:hover{color:var(--gold-3);border-color:rgba(224,193,132,.6)}
.plan{display:none;margin-left:auto;position:relative}
.plan summary{
  list-style:none;cursor:pointer;border:1px solid rgba(224,193,132,.35);padding:.5rem .8rem;
  font-family:var(--display);font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-2)
}
.plan summary::-webkit-details-marker{display:none}
.plan__panel{
  position:absolute;right:0;top:calc(100% + .6rem);width:min(84vw,300px);
  background:#0b1611;border:1px solid rgba(193,154,78,.35);padding:1.1rem;box-shadow:var(--shadow)
}
.plan__panel a{display:block;padding:.5rem 0;border-bottom:1px solid rgba(193,154,78,.12);
  font-family:var(--display);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:#ded5c1}
.plan__panel a:last-child{border:0}
.plan__panel .dot{width:7px;height:7px;border-radius:50%;display:inline-block;margin-right:.5rem;vertical-align:1px}

/* ---------------------------------- héros -------------------------------- */
.hero{position:relative;min-height:100svh;display:block;overflow:clip;isolation:isolate}
.hero__art{position:absolute;inset:0;z-index:-2}
.hero__art svg{width:100%;height:100%;object-fit:cover}
.hero__veil{position:absolute;inset:0;z-index:-1;background:
  linear-gradient(180deg,rgba(3,6,9,.28) 0%,rgba(3,6,9,.06) 24%,rgba(3,6,9,0) 46%,rgba(3,6,9,0) 74%,rgba(3,6,9,.4) 100%),
  linear-gradient(90deg,rgba(3,6,9,.55) 0%,rgba(3,6,9,.12) 34%,rgba(3,6,9,0) 60%);}
.hero__inner::before{content:"";position:absolute;z-index:-1;top:-5rem;left:-12%;width:58%;height:74%;pointer-events:none;
  background:radial-gradient(ellipse at 30% 40%,rgba(3,6,9,.85) 0%,rgba(3,6,9,.45) 45%,transparent 74%);filter:blur(12px)}
.hero__inner{position:relative;display:grid;align-content:start;gap:clamp(.85rem,1.5vw,1.3rem);min-height:100svh;padding-block:clamp(6.2rem,12vh,8.6rem) 2rem;max-width:min(100% - 2*var(--gut),var(--wrap))}
.hero__kicker{display:flex;align-items:center;gap:.8rem;font-family:var(--display);font-size:.68rem;
  letter-spacing:.34em;text-transform:uppercase;color:#d8cbb0}
.hero__kicker svg{width:30px;color:var(--gold-2)}
.hero__name{
  font-family:var(--display);font-weight:700;font-size:clamp(4rem,13.2vw,11.5rem);
  line-height:.82;letter-spacing:.015em;padding-bottom:.08em;
  background:linear-gradient(175deg,#fbf0d2 0%,#e6cb93 28%,#c19a4e 58%,#8f6b2c 78%,#e7cd96 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 18px 34px rgba(0,0,0,.6));
}
.hero__name em{font-style:normal;font-size:.28em;vertical-align:.9em;letter-spacing:.1em;color:var(--gold-2);
  -webkit-text-fill-color:var(--gold-2)}
.hero__sub{display:block;margin-top:.5rem;font-family:var(--display);font-weight:400;font-size:clamp(.8rem,1.45vw,1.02rem);
  letter-spacing:.26em;text-transform:uppercase;color:#e6d2a4;max-width:40ch;text-shadow:0 2px 18px rgba(0,0,0,.8)}
.hero__lede{font-size:clamp(1.04rem,1.35vw,1.2rem);line-height:1.6;color:#e2dac8;max-width:42ch;margin-top:.55rem;text-shadow:0 2px 22px rgba(0,0,0,.75)}
.hero__actions{display:flex;flex-wrap:wrap;align-items:center;gap:1.2rem;margin-top:.8rem}
.enter{
  display:inline-flex;align-items:center;gap:.7rem;border:1px solid rgba(224,193,132,.5);
  padding:.9rem 1.15rem;font-family:var(--display);font-size:.66rem;letter-spacing:.24em;
  text-transform:uppercase;color:#f6ecd4;background:rgba(10,16,12,.25);transition:.4s var(--ease);
}
.enter:hover{background:rgba(193,154,78,.18);border-color:var(--gold-2);transform:translateY(-2px)}
.enter svg{width:14px;height:14px;transition:transform .4s}
.enter:hover svg{transform:translateY(3px)}
.hero__meta{position:absolute;left:var(--gut);bottom:clamp(1.2rem,3vw,2.4rem);display:flex;gap:1.6rem;
  font-family:var(--display);font-size:.64rem;letter-spacing:.24em;text-transform:uppercase;color:#a8a292}
.hero__meta span{display:flex;align-items:center;gap:.45rem}
.hero__meta i{width:4px;height:4px;background:var(--gold);border-radius:50%;display:inline-block}
.hero__side{position:absolute;right:calc(var(--gut) * .6);top:38%;transform:translateY(-50%) rotate(180deg);
  writing-mode:vertical-rl;font-family:var(--display);font-size:.58rem;letter-spacing:.42em;
  text-transform:uppercase;color:#8d8878}
.hero__frame{position:absolute;inset:18px;border:1px solid rgba(224,193,132,.18);pointer-events:none}
.hero__frame::before,.hero__frame::after{content:"";position:absolute;width:10px;height:10px;border:1px solid rgba(224,193,132,.5)}
.hero__frame::before{left:-1px;top:-1px;border-right:0;border-bottom:0}
.hero__frame::after{right:-1px;bottom:-1px;border-left:0;border-top:0}
.scrollcue{position:absolute;left:50%;bottom:1.1rem;transform:translateX(-50%);width:1px;height:46px;
  background:linear-gradient(180deg,transparent,rgba(224,193,132,.7));opacity:.8}
.scrollcue::after{content:"";position:absolute;left:-2.5px;bottom:0;width:5px;height:5px;border-radius:50%;
  background:var(--gold-2);animation:cue 2.6s var(--ease) infinite}
@keyframes cue{0%{transform:translateY(-40px);opacity:0}35%{opacity:1}100%{transform:translateY(0);opacity:0}}

/* ---------------------------------- seuil -------------------------------- */
.seuil{background:var(--stone-0);color:var(--ink);position:relative;
  background-image:
    repeating-linear-gradient(0deg,rgba(90,76,50,.055) 0 1px,transparent 1px 72px),
    repeating-linear-gradient(90deg,rgba(90,76,50,.035) 0 1px,transparent 1px 120px),
    radial-gradient(90% 60% at 70% 0%,#f7f1e4,transparent 70%);}
.seuil__grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,.85fr);gap:clamp(2rem,6vw,5rem);padding-block:var(--sec)}
.seuil .label{color:var(--gold-ink)}
.seuil h2{margin:.9rem 0 1.5rem;max-width:24ch;font-size:clamp(2rem,4.4vw,3.5rem)}
.seuil h2 em{font-style:normal;color:var(--gold-ink)}
.seuil p+p{margin-top:1rem}
.seuil__lead p{max-width:58ch;color:#2a2d26;font-size:clamp(1.1rem,1.1vw,1.2rem)}
.seuil__lead .dropcap::first-letter{
  float:left;font-family:var(--display);font-weight:700;font-size:4.4em;line-height:.78;
  padding:.06em .12em 0 0;color:var(--gold-ink);
}
.seuil__aside{border-left:1px solid rgba(109,79,28,.25);padding-left:clamp(1.2rem,3vw,2.2rem);display:grid;gap:1.4rem;align-content:start}
.seuil__aside .label{color:var(--gold-ink);font-size:.6rem}
.seuil__aside .label::before{display:none}
.stats{display:grid;gap:0;margin-top:.2rem}
.stat{display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:.9rem;border-bottom:1px solid rgba(109,79,28,.18);padding:.8rem 0}
.stat b{font-family:var(--display);font-weight:700;font-size:2.3rem;line-height:.9;color:var(--gold-ink);letter-spacing:.02em;min-width:2.6ch}
.stat span{font-family:var(--display);font-size:.6rem;line-height:1.6;letter-spacing:.18em;text-transform:uppercase;color:#5c5a4c}
.compass{width:120px;height:120px;color:var(--gold-ink);opacity:.75;margin-top:.4rem}
.seuil__sign{font-family:var(--fell);font-style:italic;font-size:1rem;color:#5b5849}

/* --------------------------------- galerie ------------------------------- */
.galerie{background:var(--forest-0);position:relative;color:var(--ivory);
  background-image:
    radial-gradient(1100px 520px at 50% -8%,rgba(193,154,78,.13),transparent 62%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.014) 0 1px,transparent 1px 160px),
    linear-gradient(180deg,#0b1712 0%,#0a1511 45%,#0c1914 100%);
}
.galerie::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 80% at 50% 30%,transparent 45%,rgba(0,0,0,.45) 100%)}
.galerie>.wrap{position:relative;z-index:1;padding-block:var(--sec)}
.sec-head{display:grid;gap:1rem;max-width:62rem}
.sec-head h2{margin-top:.4rem}
.sec-head .lede{margin-top:.2rem}
.keys{display:flex;flex-wrap:wrap;gap:.55rem;align-items:center;margin-top:clamp(1.8rem,4vw,3rem)}
.key{
  display:inline-flex;align-items:center;gap:.55rem;padding:.55rem .8rem;
  border:1px solid rgba(228,217,194,.2);background:rgba(255,255,255,.018);
  font-family:var(--display);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;
  color:#ded5c1;cursor:pointer;transition:.3s var(--ease);
}
.key svg{width:15px;height:15px;color:var(--gold-2);flex:none}
.key b{font-family:var(--serif);font-weight:400;font-size:.8rem;letter-spacing:0;color:#a9a390}
.key:hover{border-color:rgba(224,193,132,.55);transform:translateY(-1px)}
.key[aria-pressed="true"]{background:linear-gradient(180deg,rgba(193,154,78,.26),rgba(193,154,78,.08));
  border-color:rgba(233,204,143,.8);color:#fff;box-shadow:inset 0 0 24px rgba(193,154,78,.12)}
.key[aria-pressed="true"] b{color:var(--gold-3)}
.search{display:flex;align-items:center;gap:.55rem;flex:1 1 230px;min-width:180px;
  border-bottom:1px solid rgba(224,193,132,.3);padding:.35rem .2rem}
.search svg{width:15px;height:15px;color:#9c9582;flex:none}
.search input{
  width:100%;background:transparent;border:0;color:var(--ivory);font-family:var(--serif);
  font-size:.98rem;padding:.25rem 0;outline:none;
}
.search input::placeholder{color:#8b8676;font-style:italic}
.count{margin-top:1rem;font-family:var(--display);font-size:.6rem;letter-spacing:.24em;
  text-transform:uppercase;color:#938d7c}
.count b{color:var(--gold-2);font-weight:400}

.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(222px,42vw),1fr));
  gap:clamp(1.6rem,3.2vw,2.8rem) clamp(1rem,2.4vw,2.1rem);margin-top:clamp(1.6rem,3vw,2.4rem)}
.gallery>li{display:block}
.portrait{
  position:relative;display:block;width:100%;padding:0;border:0;background:none;
  text-align:center;cursor:pointer;color:inherit;isolation:isolate;
}
.portrait::before{content:"";position:absolute;inset:-12% -18% 22%;z-index:-1;opacity:0;
  background:radial-gradient(ellipse at 50% 40%,rgba(244,214,150,.28),transparent 66%);
  transition:opacity .6s var(--ease);pointer-events:none}
.portrait:hover::before,.portrait:focus-visible::before{opacity:1}
.portrait__frame{
  position:relative;display:block;padding:8px;border-radius:999px 999px 5px 5px;
  background:linear-gradient(155deg,#f0dca7 0%,#c9a75f 26%,#8a6728 52%,#e2c482 74%,#9a7433 100%);
  box-shadow:0 26px 44px -26px #000, inset 0 0 0 1px rgba(255,246,220,.35);
  transition:transform .55s var(--ease),box-shadow .55s var(--ease);
}
.portrait__frame::before{content:"";position:absolute;inset:5px;border-radius:inherit;
  background:#0b1410;box-shadow:inset 0 0 0 1px rgba(0,0,0,.6)}
.portrait__frame img{
  position:relative;width:100%;aspect-ratio:3/4;object-fit:cover;object-position:50% 28%;
  border-radius:999px 999px 1px 1px;background:#1a211b;
  transition:filter .5s var(--ease);
}
.portrait__frame::after{content:"";position:absolute;inset:8px;border-radius:999px 999px 2px 2px;
  box-shadow:inset 0 0 46px rgba(8,6,3,.55),inset 0 0 0 1px rgba(0,0,0,.4);pointer-events:none}
.portrait:hover .portrait__frame{transform:translateY(-7px);box-shadow:0 36px 60px -28px #000,0 0 0 1px rgba(244,227,184,.5)}
.plaque{
  display:block;position:relative;z-index:2;margin:-15px auto 0;width:90%;padding:.55rem .45rem .6rem;
  background:linear-gradient(180deg,#182c21,#0d1a14);
  border:1px solid rgba(193,154,78,.5);box-shadow:0 12px 24px -16px #000;
}
.plaque__wing{display:block;font-family:var(--display);font-size:.56rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold-2);opacity:.9}
.plaque__name{display:block;font-family:var(--display);font-size:clamp(.84rem,1.2vw,1rem);
  line-height:1.25;letter-spacing:.04em;color:#f5eddb;margin-top:.18rem}
.plaque__dates{display:block;font-family:var(--fell);font-size:.8rem;font-style:italic;color:#a8a18c;margin-top:.12rem}
.empty{margin-top:2rem;padding:2rem 0;border-top:1px solid rgba(193,154,78,.2);color:#b3ab97;font-style:italic}
.reset{margin-top:.8rem;border:1px solid rgba(224,193,132,.4);background:none;padding:.5rem .8rem;
  font-family:var(--display);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;color:var(--gold-2)}

/* ----------------------------------- rose -------------------------------- */
.rose{position:relative;border-top:1px solid rgba(193,154,78,.22);
  background:radial-gradient(900px 620px at 22% 40%,rgba(60,96,120,.16),transparent 60%),
             linear-gradient(180deg,#08110d,#060c09);}
.rose__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(2rem,6vw,5rem);align-items:center;padding-block:clamp(3.6rem,7vw,6rem)}
.rose__art{position:relative;display:grid;place-items:center}
.rose__art svg{width:min(100%,600px);height:auto;filter:drop-shadow(0 0 70px rgba(193,154,78,.18))}
.rose__caption{margin-top:1rem;min-height:2.4rem;text-align:center;font-family:var(--display);
  font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-2)}
.rose__caption b{display:block;font-family:var(--serif);font-size:1.05rem;letter-spacing:.02em;
  text-transform:none;color:var(--ivory);margin-top:.3rem}
.rose__text h2{margin:.6rem 0 1rem;max-width:20ch}
.rose__text p{color:#c4bdab;max-width:44ch}
.legende{margin-top:2rem;display:grid;gap:.1rem}
.legende button{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.9rem;
  width:100%;padding:.85rem .2rem;border:0;border-top:1px solid rgba(224,193,132,.14);
  background:none;text-align:left;cursor:pointer;transition:.3s}
.legende button:hover{padding-left:.6rem;background:rgba(255,255,255,.02)}
.legende .sw{width:12px;height:12px;border-radius:50%;box-shadow:0 0 14px currentColor}
.legende .nm{font-family:var(--display);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#e9e1ce}
.legende .nm small{display:block;font-family:var(--serif);font-size:.86rem;letter-spacing:0;
  text-transform:none;color:#a39c89;margin-top:.15rem}
.legende .ct{font-family:var(--display);font-size:.7rem;color:var(--gold-2)}
.rose__hint{margin-top:1.4rem;font-family:var(--fell);font-style:italic;color:#8d8877;font-size:.95rem}

/* ----------------------------------- frise ------------------------------- */
.frise{background:var(--stone-0);color:var(--ink);position:relative;
  background-image:
    repeating-linear-gradient(0deg,rgba(90,76,50,.05) 0 1px,transparent 1px 64px),
    radial-gradient(80% 50% at 20% 0%,#f8f2e6,transparent 65%)}
.frise>.wrap{padding-block:var(--sec)}
.frise .label{color:var(--gold-ink)}
.frise h2{margin:.5rem 0 1rem}
.frise__intro{max-width:60ch;color:#33362e}
.frise__grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(1rem,2.4vw,2rem);margin-top:clamp(2.4rem,5vw,4rem)}
.siecle{border-top:2px solid var(--gold-ink);padding-top:1rem}
.siecle h3{font-family:var(--display);font-size:clamp(1.3rem,2vw,1.7rem);font-weight:700;color:var(--gold-ink);line-height:1}
.siecle h3 small{display:block;font-family:var(--serif);font-size:.78rem;letter-spacing:.12em;
  text-transform:uppercase;color:#6a6757;margin-top:.35rem}
.siecle ul{margin-top:1rem;display:grid;gap:.55rem}
.siecle li{display:grid;grid-template-columns:auto 1fr;gap:.5rem;align-items:baseline}
.siecle button{display:contents;cursor:pointer;border:0;background:none;text-align:left;color:#22251f}
.siecle .yr{font-family:var(--display);font-size:.6rem;letter-spacing:.08em;color:#7d7967}
.siecle .nm{font-size:.95rem;line-height:1.25;border-bottom:1px solid transparent;transition:.25s}
.siecle button:hover .nm{border-color:rgba(109,79,28,.5);color:#000}
.siecle .wdot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:.4rem;vertical-align:1px}

/* -------------------------------- cabinet -------------------------------- */
.cabinet{background:var(--parch-0);color:#23261f;position:relative;border-top:1px solid rgba(109,79,28,.28);
  background-image:radial-gradient(70% 60% at 80% 10%,#f8f0de,transparent 60%),
                   repeating-linear-gradient(90deg,rgba(120,95,55,.035) 0 1px,transparent 1px 90px)}
.cabinet>.wrap{padding-block:var(--sec)}
.cabinet .label{color:var(--gold-ink)}
.cabinet h2{margin:.5rem 0 1rem}
.cabinet__intro{max-width:58ch;color:#3a3d34}
.fictions{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));
  gap:clamp(1.2rem,2.6vw,2rem);margin-top:clamp(2.2rem,4vw,3.4rem)}
.fiche{height:100%;position:relative;background:linear-gradient(180deg,#f7efdd,#eee2c8);border:1px solid rgba(109,79,28,.3);
  padding:1.7rem 1.5rem 1.6rem;box-shadow:0 22px 40px -32px rgba(60,45,20,.8);display:grid;gap:.7rem;align-content:start}
.fiche::before{content:"";position:absolute;inset:7px;border:1px solid rgba(109,79,28,.18);pointer-events:none}
.fiche__initial{font-family:var(--display);font-weight:700;font-size:2.6rem;line-height:.9;color:var(--gold-ink);opacity:.5}
.fiche h3{font-family:var(--display);font-size:1.22rem;font-weight:700;letter-spacing:.03em;line-height:1.2}
.fiche__work{font-family:var(--fell);font-style:italic;font-size:.98rem;color:#5e5440}
.fiche p{font-size:.99rem;line-height:1.6;color:#33362d}
.fiche__meta{font-family:var(--display);font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:#7c6a45;margin-top:.2rem}
.ailleurs{margin-top:3rem;padding-top:1.4rem;border-top:1px solid rgba(109,79,28,.25);
  font-family:var(--fell);font-style:italic;color:#5b5849;max-width:70ch}

/* -------------------------------- colophon ------------------------------- */
.colophon{background:var(--night);color:#d7d0bf;position:relative;
  background-image:radial-gradient(900px 500px at 50% 0%,rgba(193,154,78,.09),transparent 65%)}
.colophon>.wrap{padding-block:var(--sec)}
.colophon h2{margin:.5rem 0 .4rem;color:var(--ivory)}
.colophon .label{color:var(--gold-2)}
.colo__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(1.8rem,3.4vw,3rem);margin-top:2.4rem}
.colo__grid h3{font-family:var(--display);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold-2);margin-bottom:.8rem;font-weight:400}
.colo__grid p{font-size:.96rem;line-height:1.65;color:#b9b2a1}
.colo__grid p+p{margin-top:.7rem}
.colo__grid a{border-bottom:1px solid rgba(224,193,132,.35)}
.colo__grid a:hover{color:var(--gold-3);border-color:var(--gold-2)}
.dedicace{margin-top:clamp(3rem,6vw,5rem);padding-top:2rem;border-top:1px solid rgba(193,154,78,.22);
  display:grid;gap:1rem;justify-items:center;text-align:center}
.dedicace svg{width:64px;color:var(--gold-2)}
.dedicace p{font-family:var(--fell);font-style:italic;font-size:clamp(1.15rem,2.2vw,1.55rem);
  line-height:1.5;color:#efe4cc;max-width:44ch}
.dedicace small{font-family:var(--display);font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:#8f8978}
.credits{margin-top:2.6rem;border-top:1px solid rgba(224,193,132,.15);padding-top:1.2rem}
.credits summary{cursor:pointer;font-family:var(--display);font-size:.62rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold-2);list-style:none}
.credits summary::-webkit-details-marker{display:none}
.credits summary::before{content:"+ ";color:var(--gold-2)}
.credits[open] summary::before{content:"− "}
.credits ul{margin-top:1rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));
  gap:.55rem 1.6rem}
.credits li{font-size:.8rem;line-height:1.45;color:#8f8a7c}
.credits b{color:#c3bba8;font-weight:400}
.footer{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;
  margin-top:2.4rem;padding-top:1.2rem;border-top:1px solid rgba(224,193,132,.15);
  font-family:var(--display);font-size:.56rem;letter-spacing:.22em;text-transform:uppercase;color:#7f7a6c}
.footer a:hover{color:var(--gold-2)}

/* --------------------------------- dialogue ------------------------------ */
.salle{border:0;padding:0;background:transparent;width:min(1080px,94vw);max-height:92svh;color:var(--ivory);overflow:visible}
.salle::backdrop{background:rgba(3,6,9,.82);backdrop-filter:blur(6px)}
.salle__panel{position:relative;display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  background:linear-gradient(160deg,#132419,#0b1611 60%);border:1px solid rgba(193,154,78,.45);
  box-shadow:0 60px 120px -40px #000;max-height:92svh;overflow:auto;overscroll-behavior:contain}
.salle__art{padding:clamp(1.4rem,3vw,2.6rem);display:grid;align-content:start;gap:1rem;
  background:radial-gradient(120% 80% at 50% 0%,rgba(193,154,78,.14),transparent 60%)}
.salle__frame{align-self:start;justify-self:center;width:100%;padding:9px;border-radius:999px 999px 5px 5px;
  background:linear-gradient(155deg,#f0dca7,#c9a75f 30%,#8a6728 60%,#e2c482);box-shadow:0 30px 50px -28px #000}
.salle__frame img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;object-position:50% 28%;
  border-radius:999px 999px 1px 1px;background:#1a211b}
.salle__body{padding:clamp(1.6rem,3.4vw,3rem);display:grid;gap:1rem;align-content:start}
.salle__body .label{color:var(--gold-2)}
.salle__body h2{font-family:var(--display);font-weight:400;font-size:clamp(1.7rem,3.2vw,2.6rem);line-height:1.1}
.salle__role{font-family:var(--fell);font-style:italic;font-size:1.1rem;color:#c8bfa9;margin-top:-.5rem}
.salle__facts{display:flex;flex-wrap:wrap;gap:.6rem 1.8rem;margin:.6rem 0 .4rem;
  padding:.8rem 0;border-top:1px solid rgba(224,193,132,.2);border-bottom:1px solid rgba(224,193,132,.2)}
.salle__facts div{display:grid;gap:.15rem}
.salle__facts dt{font-family:var(--display);font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;color:#98917f}
.salle__facts dd{margin:0;font-size:.98rem;color:#eee5d2}
.salle__body p{color:#d3ccba;font-size:1rem;line-height:1.7;max-width:62ch}
.salle__reperes{display:grid;gap:.45rem;margin-top:.4rem}
.salle__reperes li{display:grid;grid-template-columns:auto 1fr;gap:.6rem;font-size:.94rem;color:#c0b8a5}
.salle__reperes li::before{content:"";width:5px;height:5px;margin-top:.55rem;border-radius:50%;background:var(--gold)}
.salle__nav{display:flex;justify-content:space-between;gap:1rem;margin-top:1.2rem;padding-top:1rem;
  border-top:1px solid rgba(224,193,132,.2)}
.salle__nav button{border:1px solid rgba(224,193,132,.35);background:none;padding:.6rem .8rem;cursor:pointer;
  font-family:var(--display);font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:#ded5c1;transition:.3s}
.salle__nav button:hover{border-color:var(--gold-2);color:#fff}
.salle__credit{font-size:.72rem;color:#8b8577;line-height:1.5}
.salle__credit a{border-bottom:1px solid rgba(224,193,132,.3)}
.salle__close{position:absolute;right:.7rem;top:.7rem;z-index:3;width:40px;height:40px;display:grid;place-items:center;
  border:1px solid rgba(224,193,132,.4);background:rgba(6,10,14,.75);cursor:pointer;color:#e8dfc9}
.salle__close:hover{border-color:var(--gold-2);color:#fff}
.salle__close svg{width:16px;height:16px}

/* ---------------------------------- 404 ---------------------------------- */
.err{min-height:100svh;display:grid;place-items:start center;align-content:start;text-align:center;position:relative;overflow:clip;
  background:radial-gradient(70% 60% at 50% 20%,#132437,#070c13 70%)}
.err__in{position:relative;display:grid;gap:1.2rem;justify-items:center;padding:clamp(4rem,15vh,9rem) 1.4rem 2rem;z-index:2}
.err h1{font-family:var(--display);font-weight:700;font-size:clamp(3rem,9vw,6rem);
  background:linear-gradient(180deg,#f7e9c4,#c19a4e 65%,#8a6728);-webkit-background-clip:text;
  background-clip:text;color:transparent;line-height:1}
.err p{max-width:36ch;color:#c9c1ae}
.err .enter{margin-top:.6rem}
.err__art{position:absolute;inset:auto 0 0;height:60svh;opacity:.55;pointer-events:none;overflow:clip}
.err__art svg{width:100%;height:100%}

/* -------------------------------- licences ------------------------------- */
.lic{background:var(--stone-0);color:var(--ink);min-height:100svh}
.lic .wrap{padding-block:clamp(3rem,7vw,6rem)}
.lic h1{font-family:var(--display);font-weight:400;font-size:clamp(1.8rem,4vw,3rem);margin:.8rem 0 1rem}
.lic p{max-width:70ch;color:#33362e}
.lic table{width:100%;border-collapse:collapse;margin-top:2rem;font-size:.86rem}
.lic th,.lic td{text-align:left;padding:.6rem .5rem;border-bottom:1px solid rgba(109,79,28,.2);vertical-align:top}
.lic th{font-family:var(--display);font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:#6d5a34}
.lic td a{border-bottom:1px solid rgba(109,79,28,.4)}
.lic .back{margin-top:2rem;display:inline-block;font-family:var(--display);font-size:.62rem;
  letter-spacing:.18em;text-transform:uppercase;border-bottom:1px solid}

/* -------------------------------- animations ----------------------------- */
.reveal{opacity:1}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .reveal{animation:rise linear both;animation-timeline:view();animation-range:entry 4% cover 26%}
    .gallery>li{animation:rise linear both;animation-timeline:view();animation-range:entry 2% cover 20%}
  }
}
@keyframes rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .scrollcue::after{animation:none}
  .portrait:hover .portrait__frame{transform:none}
}

/* ------------------------------- responsive ------------------------------ */
@media (max-width:1100px){
  .seuil__grid{grid-template-columns:1fr;gap:2.4rem}
  .seuil__aside{border-left:0;border-top:1px solid rgba(109,79,28,.25);padding-left:0;padding-top:1.6rem;
    grid-template-columns:1fr 1fr;align-items:center}
  .stats{grid-template-columns:1fr 1fr}
  .compass{justify-self:end}
  .rose__grid{grid-template-columns:1fr;gap:2.4rem}
  .rose__art svg{width:min(78vw,440px)}
  .frise__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .salle__panel{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
}
@media (max-width:1000px){
  .colo__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .topnav{display:none}
  .plan{display:block}
  .hero__inner{padding-block:7.5rem 7rem}
  .hero__veil{background:
    linear-gradient(180deg,rgba(3,6,9,.86) 0%,rgba(3,6,9,.58) 38%,rgba(3,6,9,.1) 62%,rgba(3,6,9,.72) 100%)}
  .hero__inner::before{left:-8%;width:112%;top:-6rem;height:82%;
    background:radial-gradient(ellipse at 42% 34%,rgba(3,6,9,.92) 0%,rgba(3,6,9,.6) 52%,transparent 82%)}
  .hero__name{font-size:clamp(4rem,22vw,7rem)}
  .hero__side{display:none}
  .hero__frame{inset:10px}
  .hero__meta{left:var(--gut);right:var(--gut);gap:1rem;flex-wrap:wrap;font-size:.52rem}
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .plaque__wing{font-size:.46rem;letter-spacing:.18em}
  .salle__panel{grid-template-columns:1fr}
  .salle__art{grid-template-columns:1fr;justify-items:center;padding-top:3.8rem;padding-bottom:0}
  .salle__frame{width:min(58vw,240px)}
  .salle__body{padding-top:1rem}
  .salle{max-height:94svh}
}
@media (max-width:620px){
  .colo__grid{grid-template-columns:1fr}
  .seuil__aside{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr}
  .compass{display:none}
  .keys{gap:.4rem}
  .key{font-size:.55rem;padding:.5rem .6rem;letter-spacing:.12em}
  .key svg{width:13px;height:13px}
  .search{flex-basis:100%}
  .frise__grid{grid-template-columns:1fr;gap:1.8rem}
  .siecle ul{grid-template-columns:1fr 1fr;column-gap:1.2rem}
  .gallery{gap:1.8rem .9rem}
  .portrait__frame{padding:6px}
  .plaque{width:94%;padding:.4rem .3rem .5rem}
  .plaque__name{font-size:.72rem}
  .plaque__dates{font-size:.68rem}
  .label{font-size:.6rem;letter-spacing:.24em}
  .hero__lede{max-width:30ch}
  .colophon .h-display{font-size:1.9rem}
  .lic table,.lic tbody,.lic tr,.lic td{display:block;width:100%}
  .lic th{display:none}
  .lic tr{padding:.6rem 0;border-bottom:1px solid rgba(109,79,28,.2)}
  .lic td{border:0;padding:.15rem 0}
}
@media (max-width:380px){
  .gallery{grid-template-columns:1fr 1fr;gap:1.4rem .7rem}
  .plaque__name{font-size:.66rem}
}

/* ---------------------------------- print -------------------------------- */
@media print{
  .topbar,.hero__art,.hero__veil,.scrollcue,.rose,.salle__close,.salle__nav,.keys,.search{display:none!important}
  body{background:#fff;color:#000}
  .hero{min-height:auto}
  .hero__inner{padding:1rem 0}
  .hero__name{color:#000;-webkit-text-fill-color:#000;background:none;font-size:4rem}
  .galerie,.colophon,.cabinet,.frise,.seuil{background:#fff!important;color:#000!important}
  .gallery{grid-template-columns:repeat(4,1fr)}
  .portrait__frame{box-shadow:none}
  .salle{display:none!important}
}

/* ------------------------------ ajouts sûrs ------------------------------ */
[hidden]{display:none!important}
.light{cursor:pointer;transition:filter .45s var(--ease)}
.light:hover,.light:focus-visible{filter:brightness(1.28) saturate(1.08)}
.light:focus-visible{outline:none}

/* pastilles d'aile (remplace les styles en ligne pour la CSP) */
.dot--plumes,.sw--plumes,.wdot--plumes{background:#b8862f}
.dot--scenes,.sw--scenes,.wdot--scenes{background:#8f2f38}
.dot--savoirs,.sw--savoirs,.wdot--savoirs{background:#2f5680}
.dot--stades,.sw--stades,.wdot--stades{background:#2f6b4a}
.dot--engagements,.sw--engagements,.wdot--engagements{background:#5e3a70}
.sw--plumes{color:#b8862f}.sw--scenes{color:#8f2f38}.sw--savoirs{color:#2f5680}
.sw--stades{color:#2f6b4a}.sw--engagements{color:#5e3a70}