:root{--book-gold:#d8b66a;--book-gold-hi:#f0d58f;--book-line:rgba(216,182,106,.28);--book-muted:#9b958a;--ink:#f2eee6;--black:#050505}
html{scroll-behavior:smooth;background:#000}body{background-color:#000;background-image:url("../images/wallpaper.png");background-position:center center;background-size:cover;background-repeat:no-repeat;background-attachment:fixed;color:var(--ink)}
 .book-cover{position:relative;min-height:calc(100svh - 82px);margin-top:82px;overflow:hidden;background:transparent;display:grid;grid-template-columns:minmax(0,0.92fr) minmax(0,1.08fr);column-gap:clamp(24px,3vw,72px);align-items:center;padding:clamp(36px,5vh,70px) clamp(28px,4vw,90px);border-bottom:0}
.book-cover:before{display:none}
.cover-image{grid-column:2;grid-row:1;position:relative;inset:auto;width:100%;height:auto;min-width:0;display:flex;align-items:center;justify-content:center;z-index:2}
.cover-image img{display:block;width:100%;max-width:100%;max-height:calc(100svh - 150px);height:auto;object-fit:contain;filter:none;box-shadow:none}
.cover-copy{grid-column:1;grid-row:1;position:relative;z-index:2;min-width:0;width:100%;max-width:100%;padding-top:0;transform:none}
.eyebrow{margin:0 0 15px;font:600 10px/1 Inter,Arial;letter-spacing:.28em;color:var(--book-gold)}
.cover-copy h1{margin:0;max-width:100%;font:500 clamp(48px,7.5vw,150px)/.68 "Cormorant Garamond",serif;letter-spacing:-.025em;color:#f2eee6;white-space:nowrap}
.cover-copy h1 em,.index-head h2 em,.manifesto-big em{font-style:normal;color:var(--book-gold-hi)}
.cover-rule{width:clamp(70px,7vw,120px);height:1px;background:var(--book-gold);margin:clamp(22px,2.5vw,38px) 0 23px}
.cover-intro{max-width:430px;margin:0;color:#c2bcb1;font:400 clamp(16px,1.15vw,22px)/1.38 "Cormorant Garamond",serif}
.cover-signature{margin-top:clamp(22px,2.2vw,34px);color:var(--book-gold-hi);font:italic clamp(22px,1.55vw,30px)/1 "Cormorant Garamond",serif}
.cover-meta{position:absolute;left:max(42px,calc((100vw - 1240px)/2));right:max(42px,calc((100vw - 1240px)/2));top:25px;z-index:3;display:flex;justify-content:space-between;font:500 9px/1 Inter;letter-spacing:.23em;color:#8e897f}.cover-side{position:absolute;right:24px;top:50%;z-index:3;writing-mode:vertical-rl;transform:translateY(-50%);font:500 8px/1 Inter;letter-spacing:.3em;color:rgba(234,209,143,.8)}.cover-scroll{position:absolute;left:max(42px,calc((100vw - 1240px)/2));bottom:30px;color:#aaa49a;text-decoration:none;font:500 9px/1 Inter;letter-spacing:.2em;z-index:3}.cover-scroll span{color:var(--book-gold);font-size:18px;margin-left:12px}
.section{width:min(1240px,calc(100% - 84px));margin:auto}
.book-index{padding:105px 0 65px}.section-heading{display:grid;grid-template-columns:50px 1fr 1fr;gap:18px;align-items:center;margin-bottom:55px}.section-number{font:400 22px/1 "Cormorant Garamond",serif;color:var(--book-gold)}.section-label{font:600 9px/1 Inter;letter-spacing:.25em;color:#686259}.section-heading>div{height:1px;background:var(--book-line)}.index-head{display:grid;grid-template-columns:1.15fr .85fr;gap:90px;align-items:end;margin-bottom:60px}.index-head h2{margin:0;font:500 clamp(65px,8vw,112px)/.72 "Cormorant Garamond",serif;letter-spacing:-.025em}.index-head>p{margin:0;color:var(--book-muted);font:400 20px/1.45 "Cormorant Garamond",serif;max-width:470px}.filter-list{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--book-line);border-left:1px solid var(--book-line)}.filter{appearance:none;border:0;border-right:1px solid var(--book-line);border-bottom:0;background:transparent;color:#777168;text-align:left;padding:18px 17px;min-height:75px;cursor:pointer;font:500 9px/1.25 Inter,Arial;letter-spacing:.14em;transition:background .25s,color .25s}.filter span{display:block;color:#4f4a43;font-size:9px;margin-bottom:7px}.filter:hover,.filter.active{color:var(--book-gold-hi);background:rgba(216,182,106,.055)}.filter.active span{color:var(--book-gold)}
.theme{position:relative;width:min(1380px,calc(100% - 32px));margin:0 auto;padding:110px 0 170px;scroll-margin-top:90px}.theme:nth-child(odd){background:linear-gradient(90deg,transparent,rgba(216,182,106,.018),transparent)}.theme.is-hidden{display:none}.theme-head{display:grid;grid-template-columns:85px 1.15fr .85fr;gap:35px;align-items:end;margin:0 auto 25px;width:min(1240px,calc(100% - 60px))}.theme-number{font:400 76px/.8 "Cormorant Garamond",serif;color:rgba(216,182,106,.45)}.theme-title .eyebrow{margin-bottom:10px}.theme-title h2{margin:0;font:500 clamp(50px,6vw,88px)/.78 "Cormorant Garamond",serif;letter-spacing:-.02em}.theme-copy{border-left:1px solid var(--book-line);padding-left:28px}.theme-copy p{margin:0 0 15px;color:#9e988e;font:400 18px/1.45 "Cormorant Garamond",serif;max-width:440px}.theme-copy span{font:600 8px/1 Inter;letter-spacing:.2em;color:var(--book-gold)}.theme-rule{height:1px;background:linear-gradient(90deg,var(--book-line),transparent);margin:0 auto 55px;width:min(1240px,calc(100% - 60px))}
/* Portfolio layout: large hero + two-column masonry. Images always keep their native aspect ratio. */
.theme-gallery{width:min(1240px,calc(100% - 60px));margin:0 auto;display:block}.photo-feature{appearance:none;position:relative;display:block;width:min(980px,100%);margin:0 auto 70px;padding:0 0 13px;border:0;background:transparent;cursor:zoom-in;text-align:left;overflow:visible}.photo-feature img{display:block;width:100%;height:auto;max-height:none;object-fit:contain;object-position:center;background:#080808}.photo-feature:before{content:"";position:absolute;inset:0 0 13px;border:1px solid rgba(216,182,106,.18);pointer-events:none;z-index:2}.feature-meta,.photo-meta{display:flex;justify-content:space-between;gap:20px;padding:12px 2px 0;font:500 8px/1.25 Inter;letter-spacing:.15em;text-transform:uppercase;color:#777168}.feature-meta span:first-child,.photo-meta span:first-child{color:var(--book-gold)}
.masonry{columns:2 430px;column-gap:30px}.photo-card{position:relative;display:block;width:100%;padding:0 0 12px;margin:0 0 42px;border:0;background:transparent;cursor:zoom-in;text-align:left;break-inside:avoid}.photo-card img{display:block;width:100%;height:auto;object-fit:contain;filter:saturate(.86) contrast(1.03);transition:filter .35s,opacity .35s,transform .35s}.photo-card:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(216,182,106,.11)}.photo-card:hover img{filter:saturate(1) contrast(1.06);opacity:.92;transform:translateY(-2px)}.photo-card:hover .photo-meta span:last-child{color:#d8d1c5}.photo-meta{padding-bottom:9px}
.photo-feature:after{content:"OUVRIR · TAILLE RÉELLE ↗";position:absolute;right:14px;bottom:43px;padding:9px 11px;background:rgba(5,5,5,.78);border:1px solid rgba(216,182,106,.35);color:#ead18f;font:600 8px/1 Inter;letter-spacing:.14em;opacity:0;transform:translateY(6px);transition:.25s;pointer-events:none}.photo-feature:hover:after{opacity:1;transform:none}.photo-card:before{content:"↗";position:absolute;right:12px;top:12px;width:28px;height:28px;display:grid;place-items:center;background:rgba(5,5,5,.75);border:1px solid rgba(216,182,106,.3);color:#ead18f;font:16px/1 Arial;opacity:0;transition:.25s;z-index:3}.photo-card:hover:before{opacity:1}
.lightbox{position:fixed;z-index:300;inset:0;background:rgba(0,0,0,.975);display:none;align-items:center;justify-content:center;padding:28px}.lightbox.open{display:flex}.lightbox figure{margin:0;max-width:96vw;max-height:96vh;text-align:center}.lightbox img{display:block;max-width:96vw;max-height:88vh;width:auto;height:auto;object-fit:contain;margin:auto;image-rendering:auto}.lightbox figcaption{margin-top:12px;color:#c6bfae;font:500 9px/1.4 Inter;letter-spacing:.16em;text-transform:uppercase}.lightbox-close,.lightbox-prev,.lightbox-next{position:absolute;border:0;background:transparent;color:#e9dfca;cursor:pointer}.lightbox-close{top:10px;right:22px;font:200 42px/1 Arial}.lightbox-prev,.lightbox-next{top:50%;transform:translateY(-50%);font:300 76px/1 "Cormorant Garamond",serif;padding:20px}.lightbox-prev{left:16px}.lightbox-next{right:16px}.lightbox button:hover{color:var(--book-gold)}body.lb-open{overflow:hidden}
.final-nav{border-top:1px solid var(--book-line)}
@media (min-width:801px) and (max-width:1439px){.book-cover{padding-left:clamp(45px,7vw,95px);padding-right:clamp(45px,7vw,95px)}.cover-meta,.cover-scroll{left:clamp(45px,7vw,95px);right:clamp(45px,7vw,95px)}.index-head{gap:50px}.filter-list{grid-template-columns:repeat(3,1fr)}.theme-head,.theme-gallery,.theme-rule{width:calc(100% - 50px)}.masonry{columns:2 350px}}
@media (max-width:800px){.book-cover{margin-top:68px;min-height:calc(100svh - 68px);display:block;padding:0 20px}.cover-image{width:100%;height:58%;right:0;top:9%;bottom:auto;opacity:1}.cover-image img{max-width:92%;max-height:100%;box-shadow:none;filter:none}.book-cover:before{display:none}.cover-copy{position:absolute;left:20px;right:20px;bottom:80px;transform:none;max-width:520px}.cover-copy h1{font-size:clamp(78px,23vw,125px)}.cover-intro{font-size:18px;max-width:330px}.cover-meta{left:20px;right:20px}.cover-side{display:none}.cover-scroll{left:20px;bottom:28px}.section{width:calc(100% - 40px)}.book-index{padding:75px 0 45px}.index-head{display:block;margin-bottom:40px}.index-head h2{font-size:clamp(58px,16vw,82px);margin-bottom:25px}.index-head>p{font-size:17px}.filter-list{grid-template-columns:1fr 1fr}.theme{width:calc(100% - 22px);padding:65px 0 105px}.theme-head{display:block;width:calc(100% - 28px);margin-bottom:18px}.theme-number{font-size:48px;margin-bottom:10px}.theme-title h2{font-size:clamp(46px,13vw,68px)}.theme-copy{border-left:0;border-top:1px solid var(--book-line);padding:18px 0 0;margin-top:20px}.theme-copy p{font-size:17px}.theme-rule{width:calc(100% - 28px);margin-bottom:35px}.theme-gallery{width:calc(100% - 28px)}.photo-feature{width:100%;margin-bottom:48px}.masonry{columns:1}.photo-card{margin-bottom:30px}.feature-meta,.photo-meta{font-size:7px;letter-spacing:.1em}.photo-feature:after{opacity:1;transform:none;bottom:40px;right:9px;font-size:7px}.photo-card:before{opacity:1;right:8px;top:8px}.lightbox{padding:18px 6px}.lightbox img{max-width:97vw;max-height:82vh}.lightbox-prev,.lightbox-next{font-size:52px;padding:10px}.lightbox-prev{left:0}.lightbox-next{right:0}.lightbox-close{right:10px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.photo-card img{transition:none}}


/* ==========================================================
   BOOK COVER — DESKTOP FLUID LAYOUT
   The text and hero image share one responsive grid.
   No fixed horizontal translations: the title can never
   intrude into the image column, including Windows scaling.
   ========================================================== */
@media (min-width:801px){
  .book-cover{
    box-sizing:border-box;
    display:grid;
    grid-template-columns:minmax(0, .92fr) minmax(0, 1.08fr);
    align-items:center;
    column-gap:clamp(24px, 3vw, 72px);
    min-height:calc(100svh - 82px);
    margin-top:82px;
    padding:clamp(42px, 5vh, 72px) clamp(28px, 5vw, 110px);
    overflow:hidden;
  }

  .cover-copy{
    position:relative;
    min-width:0;
    max-width:none;
    width:calc(88% - clamp(8px, 1.5vw, 24px));
    margin-left:auto;
    justify-self:end;
    position:relative;
    left:clamp(8px, 1.5vw, 24px);
    container-type:inline-size;
    padding-top:0;
    transform:none;
    z-index:2;
  }

  .cover-copy h1{
    max-width:100%;
    margin:0;
    font-size:clamp(50px, 22cqw, 150px);
    line-height:.72;
    white-space:nowrap;
  }

  .cover-image{
    position:relative;
    inset:auto;
    width:100%;
    min-width:0;
    height:auto;
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:2;
  }

  .cover-image img{
    display:block;
    width:auto;
    max-width:100%;
    height:auto;
    max-height:calc(100svh - 160px);
    object-fit:contain;
  }

  .cover-intro{max-width:100%;font-size:clamp(16px, 1.15vw, 22px)}
  .cover-signature{font-size:clamp(22px, 1.55vw, 30px)}
}

@media (min-width:801px) and (max-width:1250px){
  .book-cover{
    grid-template-columns:minmax(0, .95fr) minmax(0, 1.05fr);
    column-gap:24px;
    padding-left:28px;
    padding-right:28px;
  }

  .cover-copy h1{font-size:clamp(52px, 6.6vw, 92px)}
  .cover-intro{font-size:16px}
  .cover-signature{font-size:22px}
}
