:root{
  --paper: #ececea;
  --ink: #14130f;
  --grey: #6f6d64;
  --line: #dedad2;
  --frame-bg: #efece5;
  --frame-hover: #e2ddd1;
  --signal: #b3392a;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'EB Garamond', serif;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
}
.mono{font-family:'Space Mono', monospace;}
a{color:inherit; text-decoration:none;}
img{display:block; max-width:100%;}

/* ---------- NAV ---------- */
header{
  position:fixed; top:0; left:0; right:0;
  display:flex; justify-content:space-between; align-items:center;
  padding:0.9rem clamp(1.2rem, 4vw, 3rem);
  z-index:100;
  background:rgba(236,236,234,0.72);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  border-bottom:1px solid rgba(222,218,210,0.6);
  color:var(--ink);
}
header .brand{font-family:'EB Garamond', serif; display:flex; flex-direction:column; align-items:stretch; width:max-content; gap:0.3rem;}
header .brand .name{font-size:1.15rem; letter-spacing:0.04em; text-transform:uppercase; white-space:nowrap;}
header .brand .role{font-family:'Space Mono', monospace; font-size:0.52rem; letter-spacing:0.03em; text-transform:uppercase; opacity:0.75; white-space:nowrap; text-align:left;}
nav ul{display:flex; gap:clamp(0.9rem,2.4vw,2.2rem); list-style:none; flex-wrap:wrap; justify-content:flex-end;}
nav a{font-size:0.7rem; letter-spacing:0.06em; text-transform:uppercase;}
nav a.current{border-bottom:1px solid currentColor;}
nav .num{font-family:'Space Mono', monospace; font-size:0.68rem; opacity:0.6; margin-right:0.3em;}

/* ---------- MENU ADAPTATIF (hamburger sous 880px) ---------- */
.nav-toggle{position:absolute; opacity:0; pointer-events:none;}
.nav-toggle-label{
  display:none; position:relative; z-index:200;
  width:26px; height:18px; cursor:pointer; flex-shrink:0;
}
.nav-toggle-label span, .nav-toggle-label::before, .nav-toggle-label::after{
  content:''; position:absolute; left:0; right:0; height:2px; background:currentColor;
  transition:transform 0.25s ease, opacity 0.25s ease;
}
.nav-toggle-label::before{top:0;}
.nav-toggle-label span{top:8px;}
.nav-toggle-label::after{top:16px;}
.nav-toggle:checked ~ .nav-toggle-label::before{transform:translateY(8px) rotate(45deg);}
.nav-toggle:checked ~ .nav-toggle-label span{opacity:0;}
.nav-toggle:checked ~ .nav-toggle-label::after{transform:translateY(-8px) rotate(-45deg);}

.nav-backdrop{display:none;}

@media (max-width:880px){
  header{flex-wrap:wrap;}
  .nav-toggle-label{display:block;}
  .nav-backdrop{
    display:block; position:fixed; inset:0; background:rgba(20,19,15,0.4);
    opacity:0; pointer-events:none; transition:opacity 0.3s ease; z-index:150;
    mix-blend-mode:normal;
  }
  .nav-toggle:checked ~ .nav-backdrop{opacity:1; pointer-events:auto;}
  nav{
    position:fixed; top:0; right:0; bottom:0; z-index:190;
    width:min(78vw, 320px);
    background:var(--ink); color:#fff;
    mix-blend-mode:normal;
    transform:translateX(100%);
    transition:transform 0.35s ease;
    padding:6rem 2rem 2rem;
    overflow-y:auto;
  }
  .nav-toggle:checked ~ nav{transform:translateX(0);}
  nav ul{flex-direction:column; align-items:flex-start; gap:1.5rem; justify-content:flex-start;}
  nav a{font-size:1.05rem; color:#fff;}
  nav .num{opacity:0.55;}
}

main, section{padding:clamp(4rem,10vw,8rem) clamp(1.2rem,4vw,3rem);}

/* page header used on every non-hero page (breadcrumb-like intro) */
.page-top{
  padding-top:clamp(7rem,13vw,9.5rem) !important;
}

/* ---------- HERO (home) ---------- */
.hero{
  min-height:100svh;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding-bottom:clamp(2.5rem,6vw,5rem);
  border-bottom:1px solid var(--line);
  position:relative;
}
.hero-frame{
  position:absolute; top:6.5rem; left:clamp(1.2rem,4vw,3rem);
  font-size:0.72rem; letter-spacing:0.08em; color:var(--grey);
}
.hero h1{
  font-family:'EB Garamond', serif;
  font-weight:500;
  font-size:clamp(3rem, 9vw, 7.5rem);
  line-height:0.96;
  letter-spacing:-0.01em;
  max-width:16ch;
}
.hero .sub{
  margin-top:1.6rem;
  display:flex; justify-content:space-between; align-items:flex-end;
  flex-wrap:wrap; gap:1rem;
  border-top:1px solid var(--line);
  padding-top:1.2rem;
}
.hero .sub p{font-size:0.95rem; color:var(--grey); max-width:34ch; font-weight:400;}
.hero .sub .scroll{font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink);}

/* ---------- CAROUSEL (home) ---------- */
.carousel{
  position:relative;
  aspect-ratio:16/8;
  overflow:hidden;
  border-top:1px solid var(--line);
  padding:0 !important;
  background:var(--ink);
}
.carousel-hero{
  aspect-ratio:auto;
  min-height:100vh;
  min-height:100svh;
  border-top:none;
}
.carousel-track{position:relative; width:100%; height:100%;}
.carousel-slide{
  position:absolute; inset:0;
  opacity:0; visibility:hidden;
  transition:opacity 0.6s ease;
}
.carousel-slide.is-active{opacity:1; visibility:visible;}
.carousel-slide img{width:100%; height:100%; object-fit:cover;}
.carousel-caption{
  position:absolute; left:0; bottom:0; right:0;
  padding:clamp(1.4rem,4vw,2.6rem) clamp(1.2rem,4vw,3rem);
  background:linear-gradient(0deg, rgba(20,19,15,0.65), transparent);
}
.carousel-caption .eyebrow{
  display:block; color:#fff; font-size:0.68rem; letter-spacing:0.08em;
  text-transform:uppercase; opacity:0.85; margin-bottom:0.5rem;
}
.carousel-caption h3{
  font-family:'EB Garamond', serif; font-style:italic; font-weight:400;
  font-size:clamp(1.3rem,3vw,2rem);
}
.carousel-caption h3 a{color:#fff; border-bottom:1px solid rgba(255,255,255,0.5);}
.carousel-caption h3 a:hover{border-color:#fff;}
.carousel-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  background:none; border:none; color:#fff; font-size:2rem; cursor:pointer;
  padding:0.6rem 1rem; opacity:0.75; z-index:5;
}
.carousel-nav:hover{opacity:1;}
.carousel-prev{left:0;}
.carousel-next{right:0;}
.carousel-dots{
  position:absolute; bottom:1rem; right:clamp(1.2rem,4vw,3rem);
  display:flex; gap:0.5rem; z-index:5;
}
.carousel-dot{
  width:8px; height:8px; border-radius:50%; border:1px solid #fff;
  background:transparent; cursor:pointer; padding:0;
}
.carousel-dot.is-active{background:#fff;}
@media (max-width:720px){
  .carousel{aspect-ratio:4/5;}
  .carousel-hero{aspect-ratio:auto; min-height:100vh; min-height:100svh;}
}

/* ---------- SECTION HEADS ---------- */
.section-head{
  display:flex; align-items:baseline; gap:1rem;
  margin-bottom:1.2rem;
  flex-wrap:nowrap;
}
.section-head h2{white-space:nowrap;}
.section-head .idx{font-size:0.75rem; color:var(--signal); white-space:nowrap;}
.section-head h2{
  font-family:'EB Garamond', serif; font-weight:500;
  font-size:clamp(1.8rem,4vw,2.8rem);
}
.section-head .line{flex:1; min-width:1rem; height:1px; background:var(--line);}

.series-intro{
  display:flex; justify-content:space-between; align-items:flex-end;
  flex-wrap:wrap; gap:1rem;
  margin-bottom:clamp(2rem,5vw,3.2rem);
}
.series-intro h3{
  font-family:'EB Garamond', serif; font-style:italic; font-weight:400;
  font-size:clamp(1.3rem,2.6vw,1.8rem);
  max-width:32ch;
}
.series-intro .count{font-size:0.72rem; color:var(--grey);}

/* ---------- CONTACT SHEET GRID (PHOTOGRAPHIE) ---------- */
.sheet{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.frame{
  background:var(--frame-bg);
  aspect-ratio:3/2;
  position:relative;
  overflow:hidden;
  cursor:pointer;
}
.frame img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 0.6s ease;
}
.frame:hover img{transform:scale(1.035);}
.frame .tag{
  position:absolute; left:0.7rem; bottom:0.6rem; right:0.7rem;
  display:flex; justify-content:space-between; align-items:flex-end;
  opacity:0; transition:opacity 0.3s ease;
}
.frame:hover .tag{opacity:1;}
.frame .tag .no{
  font-size:0.68rem; color:#fff; background:rgba(20,19,15,0.55);
  padding:0.15rem 0.45rem;
}

/* ---------- LIGHTBOX ---------- */
.lightbox{
  position:fixed; inset:0; background:rgba(20,19,15,0.97);
  display:none; align-items:center; justify-content:center;
  z-index:1000; flex-direction:column;
}
.lightbox.open{display:flex;}
.lightbox img{max-width:88vw; max-height:78vh; object-fit:contain;}
.lightbox .lb-meta{
  margin-top:1.2rem; color:#cfccc3; font-size:0.75rem;
  display:flex; gap:1.4rem; align-items:center;
}
.lightbox .lb-caption{
  margin-top:0.5rem; color:#fff; font-family:'EB Garamond', serif; font-style:italic;
  font-size:0.95rem; max-width:70vw; text-align:center;
}
.lightbox .lb-close{
  position:absolute; top:1.6rem; right:clamp(1.2rem,4vw,3rem);
  color:#fff; font-size:0.75rem; letter-spacing:0.06em; cursor:pointer;
}
.lightbox .lb-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  color:#fff; font-size:1.6rem; cursor:pointer; padding:1rem;
  opacity:0.7;
}
.lightbox .lb-nav:hover{opacity:1;}
.lb-prev{left:clamp(0.4rem,2vw,2rem);}
.lb-next{right:clamp(0.4rem,2vw,2rem);}

/* ---------- BOOKS / DOCUMENTAIRES ---------- */
.book-list{}

/* ---------- FICHE DÉPLIABLE (4e de couverture / ils en parlent) ---------- */
.book-entry{border-bottom:1px solid var(--line);}
.book-entry summary{
  list-style:none; cursor:pointer; position:relative;
  padding-right:2.4rem;
}
.book-entry summary::-webkit-details-marker{display:none;}
.book-entry summary::after{
  content:'+';
  position:absolute; right:0; top:50%; transform:translateY(-50%);
  font-family:'Space Mono', monospace; font-size:1rem; color:var(--signal);
}
.book-entry[open] summary::after{content:'–';}
.book-entry summary .book,
.book-entry summary{
  border-bottom:none;
}
.book-detail{
  padding:0 2.4rem clamp(1.6rem,3vw,2.4rem) calc(110px + clamp(1.2rem,4vw,3rem));
  animation:reveal 0.25s ease;
}
.book-oblong + .book-detail, .book-entry-oblong .book-detail{
  padding-left:calc(194px + clamp(1.2rem,4vw,3rem));
}
.book-detail h4{
  font-size:0.68rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--grey);
  margin-bottom:0.5rem;
}
.book-detail h4:not(:first-child){margin-top:1.6rem;}
.book-detail .back-cover-text{
  font-size:0.95rem; line-height:1.65; color:var(--ink); max-width:58ch;
}
.book-detail .press-list{list-style:none;}
.book-detail .press-list li{
  padding:0.3rem 0; font-size:0.85rem;
}
.book-detail .press-list a{border-bottom:1px dotted var(--grey);}
.book-detail .press-list a:hover{border-bottom-style:solid; border-color:var(--ink);}
@keyframes reveal{from{opacity:0;} to{opacity:1;}}
.book{
  display:grid;
  grid-template-columns:110px 1fr auto;
  gap:clamp(1.2rem,4vw,3rem);
  align-items:center;
  padding:clamp(1.4rem,3vw,2.2rem) 0;
  border-bottom:1px solid var(--line);
  transition:padding-left 0.35s ease;
}
.book:hover{padding-left:0.6rem;}
.book-cover{
  width:110px; height:150px;
  background:var(--frame-bg);
  position:relative;
}
.book-title{font-family:'EB Garamond', serif; font-size:clamp(1.3rem,2.4vw,1.9rem); font-weight:400;}
.book-meta{color:var(--grey); font-size:0.85rem; margin-top:0.4rem; max-width:46ch;}
.book-year{font-size:0.78rem; color:var(--grey); text-align:right; align-self:start;}

/* couverture au format paysage (livre à l'italienne) : colonne élargie, même hauteur que les autres, pas de recadrage nécessaire car le ratio correspond à l'image */
.book-oblong{grid-template-columns:194px 1fr auto;}
.book-oblong .book-cover{width:194px; height:150px;}

/* ---------- LISTES LÉGÈRES (presse, institutionnel) ---------- */
.plain-list{}
.plain-row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:1.5rem;
  align-items:baseline;
  padding:clamp(1.1rem,2.4vw,1.6rem) 0;
  border-bottom:1px solid var(--line);
  transition:padding-left 0.35s ease;
}
.plain-row:hover{padding-left:0.6rem;}
.plain-row .row-title{font-family:'EB Garamond', serif; font-size:clamp(1.1rem,2vw,1.35rem); font-style:italic;}
.plain-row .row-meta{color:var(--grey); font-size:0.85rem; margin-top:0.2rem;}
.plain-row .row-date{font-size:0.78rem; color:var(--grey); white-space:nowrap;}

/* ---------- ABOUT ---------- */
.about{
  display:grid;
  grid-template-columns:1fr 1.3fr;
  gap:clamp(2rem,6vw,5rem);
  align-items:start;
}
.about-portrait{
  aspect-ratio:3/4;
  background:var(--frame-bg);
  overflow:hidden;
}
.about-portrait img{width:100%; height:100%; object-fit:cover;}
.about p{font-size:clamp(1.05rem,2vw,1.3rem); font-weight:400; line-height:1.6; max-width:48ch;}
.about .mono{display:block; margin-top:1.6rem; font-size:0.72rem; color:var(--grey);}

/* ---------- SERIE / TEXT PAGE ---------- */
.eyebrow{
  font-family:'Space Mono', monospace; font-size:0.72rem; color:var(--signal);
  letter-spacing:0.08em; text-transform:uppercase; margin-bottom:1.2rem;
}
.serie-main{max-width:900px; margin:0 auto;}
.serie-main h1{
  font-size:clamp(2.4rem,6vw,4.2rem);
  font-weight:500; line-height:1.05;
  max-width:18ch;
  margin-bottom:1.6rem;
}
.meta-line{
  display:flex; flex-wrap:wrap; gap:1.6rem;
  font-family:'Space Mono', monospace; font-size:0.72rem; color:var(--grey);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  padding:1rem 0; margin-bottom:clamp(3rem,7vw,4.5rem);
}
.meta-line span b{color:var(--ink); font-weight:400;}
.lead-frame{
  width:100%; aspect-ratio:3/2; background:var(--frame-bg);
  margin-bottom:clamp(3rem,7vw,4.5rem); overflow:hidden;
}
.lead-frame img{width:100%; height:100%; object-fit:cover;}
.body-text{font-size:clamp(1.15rem,2.2vw,1.4rem); line-height:1.75; max-width:62ch;}
.body-text p{margin-bottom:1.4em;}
.body-text p:first-of-type::first-letter{
  font-size:3.2em; float:left; line-height:0.85; padding-right:0.08em; padding-top:0.05em;
  font-style:italic; color:var(--signal);
}
.pull-quote{
  font-style:italic; font-size:clamp(1.4rem,3vw,1.9rem);
  color:var(--ink); max-width:34ch;
  margin:clamp(2.5rem,6vw,3.5rem) 0;
  padding-left:1.4rem; border-left:2px solid var(--signal);
}
.back-link{
  display:inline-block; margin-top:clamp(3rem,7vw,4rem);
  font-family:'Space Mono', monospace; font-size:0.75rem;
  border-bottom:1px solid var(--line); padding-bottom:0.2rem;
}
.back-link:hover{border-color:var(--ink);}

.gallery-link{
  display:inline-block; margin-top:0.5rem;
  font-family:'Space Mono', monospace; font-size:0.72rem; color:var(--signal);
  border-bottom:1px solid var(--line); padding-bottom:0.1rem;
}
.gallery-link:hover{border-color:var(--signal);}

/* ---------- FOOTER ---------- */
footer{
  padding:clamp(2.5rem,6vw,4rem) clamp(1.2rem,4vw,3rem);
  border-top:1px solid var(--line);
  display:flex; justify-content:flex-end; align-items:flex-end; flex-wrap:wrap; gap:2rem;
}
footer .big{font-family:'EB Garamond', serif; font-size:clamp(1.6rem,4vw,2.6rem); font-style:italic;}
footer .meta{font-size:0.75rem; color:var(--grey); text-align:right;}
footer .meta a{border-bottom:1px solid var(--line);}
footer .meta a:hover{border-color:var(--ink);}

@media (max-width:720px){
  .sheet{grid-template-columns:repeat(2,1fr);}
  .book{grid-template-columns:70px 1fr; }
  .book-cover{width:70px; height:96px;}
  .book-oblong{grid-template-columns:130px 1fr;}
  .book-oblong .book-cover{width:130px; height:100px;}
  .book-year{display:none;}
  .book-detail{padding-left:1.2rem; padding-right:1.2rem;}
  .book-entry-oblong .book-detail{padding-left:1.2rem;}
  .book-entry summary{padding-right:1.8rem;}
  .about{grid-template-columns:1fr;}
  nav ul{gap:1rem;}
  .lb-nav{font-size:1.2rem; padding:0.6rem;}
}

@media (max-width:380px){
  .section-head{gap:0.6rem;}
  .section-head h2{font-size:1.5rem;}
}

::selection{background:var(--signal); color:#fff;}
@media (prefers-reduced-motion: reduce){
  *{transition:none !important; scroll-behavior:auto !important;}
}