
:root{--bg:#f7f5f1;--paper:#fff;--ink:#151515;--muted:#6c6963;--line:#dedbd4;--max:1480px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.55}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.header{position:sticky;top:0;z-index:20;height:88px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;background:rgba(247,245,241,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}
.brand img{width:112px;max-height:62px;object-fit:contain}
.nav{display:flex;gap:20px;align-items:center;font-size:12px;text-transform:uppercase;letter-spacing:.12em}
.nav a{padding:10px 0;border-bottom:1px solid transparent}
.nav a:hover{border-bottom-color:var(--ink)}
.menu-button{display:none;border:0;background:none;font:inherit;text-transform:uppercase;letter-spacing:.12em}
.hero{position:relative;height:min(78vh,840px);min-height:520px;overflow:hidden;background:#111}
.hero>img{width:100%;height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.52),rgba(0,0,0,.08) 65%)}
.hero-content{position:absolute;left:7vw;bottom:12%;color:white;max-width:780px}
.hero-content p,.kicker,.section-title p{text-transform:uppercase;letter-spacing:.24em;font-size:11px}
.hero-content h1{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(48px,7vw,108px);line-height:.95;margin:14px 0 22px}
.hero-content span{font-size:15px;letter-spacing:.08em}
.about{max-width:var(--max);margin:0 auto;padding:110px 5vw;display:grid;grid-template-columns:minmax(260px,430px) 1fr;gap:8vw;align-items:center}
.about-photo img{width:100%;aspect-ratio:4/5;object-fit:cover}
.about-text{max-width:760px}
.about-text h2,.section-title h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(42px,5vw,76px);line-height:1;margin:12px 0 34px}
.about-text p:not(.kicker){font-size:17px;color:#333}
.category-index{max-width:var(--max);margin:0 auto 90px;padding:0 5vw;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
.category-index a{display:flex;gap:16px;padding:24px 10px;border-bottom:1px solid var(--line);font-family:Georgia,'Times New Roman',serif;font-size:22px}
.category-index span{font-family:Arial,sans-serif;font-size:10px;color:var(--muted);padding-top:7px}
.gallery-section{max-width:var(--max);margin:0 auto;padding:90px 5vw;border-top:1px solid var(--line);scroll-margin-top:85px}
.section-title{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:45px}
.section-title h2{margin:0}
.gallery-grid{columns:3 320px;column-gap:18px}
.photo{display:block;width:100%;margin:0 0 18px;padding:0;border:0;background:none;cursor:zoom-in;break-inside:avoid}
.photo img{width:100%;height:auto;transition:opacity .25s ease}
.photo:hover img{opacity:.78}
.empty{padding:40px;border:1px solid var(--line);color:var(--muted)}
.footer{max-width:var(--max);margin:50px auto 0;padding:45px 5vw 70px;border-top:1px solid var(--line);display:flex;align-items:center;gap:30px;font-size:12px}
.footer img{width:42px}
.footer a{margin-left:auto}
.lightbox{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.92);display:none;align-items:center;justify-content:center;padding:40px}
.lightbox.show{display:flex}
.lightbox img{max-width:94vw;max-height:90vh;object-fit:contain}
.lightbox-close{position:absolute;top:18px;right:26px;border:0;background:none;color:white;font-size:42px;cursor:pointer}
@media(max-width:1100px){
 .nav{gap:12px;font-size:10px}
 .category-index{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:800px){
 .header{height:70px}
 .brand img{width:86px}
 .menu-button{display:block}
 .nav{display:none;position:absolute;top:70px;left:0;right:0;background:var(--bg);padding:20px 6vw 30px;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--line);font-size:12px}
 .nav.open{display:flex}
 .hero{min-height:500px;height:70vh}
 .hero-content{left:7vw;right:7vw}
 .about{grid-template-columns:1fr;padding-top:70px;gap:45px}
 .about-photo{max-width:440px}
 .category-index{grid-template-columns:1fr}
 .gallery-section{padding-top:65px}
 .gallery-grid{columns:2 220px}
 .footer{align-items:flex-start;flex-wrap:wrap}
}
@media(max-width:520px){
 .gallery-grid{columns:1}
 .hero-content h1{font-size:52px}
 .about-text h2,.section-title h2{font-size:42px}
}


/* Navigation dans l'agrandissement */
.lightbox-figure{
  margin:0;
  max-width:calc(100% - 130px);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
}
.lightbox-counter{
  color:rgba(255,255,255,.82);
  font-size:12px;
  letter-spacing:.14em;
}
.lightbox-nav{
  width:54px;
  height:54px;
  border:1px solid rgba(255,255,255,.45);
  border-radius:50%;
  background:rgba(0,0,0,.28);
  color:white;
  font-family:Arial,Helvetica,sans-serif;
  font-size:40px;
  line-height:1;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}
.lightbox-nav:hover{background:rgba(255,255,255,.16)}
.lightbox-nav:focus-visible,.lightbox-close:focus-visible{
  outline:2px solid white;
  outline-offset:4px;
}
.lightbox-nav[hidden]{display:none}
@media(max-width:700px){
  .lightbox{padding:24px 10px}
  .lightbox-figure{max-width:calc(100% - 88px)}
  .lightbox-nav{width:42px;height:42px;font-size:32px}
  .lightbox-close{top:8px;right:14px}
}
