/* Objectif Photographie — feuille de style partagée */
:root{
  --ink:#211d19;
  --ivory:#f4efe7;
  --ivory-2:#ece4d8;
  --gold:#b7975c;
  --muted:#8c8478;
  --line:rgba(33,29,25,.14);
  --serif:'Playfair Display',Georgia,serif;
  --sans:'Jost',system-ui,-apple-system,Segoe UI,sans-serif;
  --script:'Pinyon Script',cursive;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--ivory);color:var(--ink);font-family:var(--sans);font-weight:300;line-height:1.7;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:1220px;margin:0 auto;padding:0 clamp(20px,5vw,64px)}
.label{font-family:var(--sans);font-size:.7rem;font-weight:400;letter-spacing:.34em;text-transform:uppercase;color:var(--gold)}
.script{font-family:var(--script);font-weight:400;color:var(--gold)}

/* placeholder élégant (slots sans photo) */
.ph{position:relative;background:linear-gradient(135deg,#e7ded1,#ddd2c1 60%,#d2c6b2);overflow:hidden}
.ph::after{content:attr(data-ph);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-style:italic;font-size:.9rem;letter-spacing:.08em;color:rgba(33,29,25,.4);text-align:center;padding:1em}

/* NAV */
header{position:fixed;top:0;left:0;right:0;z-index:60;padding:24px 0;transition:.45s}
header .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{font-family:var(--serif);font-size:1.3rem;font-weight:500;letter-spacing:.02em;color:#fff;transition:.45s;white-space:nowrap}
nav ul{display:flex;gap:26px;list-style:none;align-items:center}
nav a{font-size:.74rem;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.92);transition:.3s;white-space:nowrap}
nav a.active{color:#e9d9b8}
header.solid{background:rgba(244,239,231,.95);backdrop-filter:blur(10px);padding:14px 0;box-shadow:0 1px 0 var(--line)}
header.solid .brand{color:var(--ink)}
header.solid nav a{color:var(--ink)}
header.solid nav a.active{color:var(--gold)}
nav a:hover{color:var(--gold)}
.burger{display:none;font-size:1.4rem;background:none;border:0;color:#fff;cursor:pointer;line-height:1}
header.solid .burger{color:var(--ink)}
/* header opaque forcé (pages sans hero sombre) */
header.pinned{background:rgba(244,239,231,.95);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--line)}
header.pinned .brand{color:var(--ink)}
header.pinned nav a{color:var(--ink)}
header.pinned nav a.active{color:var(--gold)}
header.pinned .burger{color:var(--ink)}
#mobnav{display:none;position:fixed;inset:0;z-index:59;background:rgba(25,21,18,.97);flex-direction:column;align-items:center;justify-content:center;gap:28px}
#mobnav.open{display:flex}
#mobnav a{color:var(--ivory);font-family:var(--serif);font-size:1.6rem;letter-spacing:.02em}
#mobnav .close{position:absolute;top:26px;right:28px;font-size:1.8rem;background:none;border:0;color:var(--ivory);cursor:pointer}

/* HERO accueil (plein écran) */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;background-size:cover;background-position:center}
.hero .script{font-size:clamp(2rem,4vw,2.8rem);color:#e9d9b8;display:block;margin-bottom:.1em}
.hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(2.8rem,7.5vw,6rem);line-height:1.05;letter-spacing:.01em;margin:.15em 0 .55em}
.hero .sub{font-size:.8rem;letter-spacing:.32em;text-transform:uppercase;color:rgba(255,255,255,.85)}
.hero .cta,.closer .cta{display:inline-block;margin-top:38px;padding:15px 34px;font-size:.76rem;letter-spacing:.24em;text-transform:uppercase;transition:.35s}
.hero .cta{border:1px solid rgba(255,255,255,.75);color:#fff}
.hero .cta:hover{background:#fff;color:var(--ink)}
.scrollcue{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);font-size:.64rem;letter-spacing:.34em;text-transform:uppercase;color:rgba(255,255,255,.75)}

/* HERO interne (bandeau) */
.page-hero{position:relative;min-height:56vh;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;background-size:cover;background-position:center;padding:120px 0 60px}
.page-hero .ph{position:absolute;inset:0}
.page-hero .inner{position:relative;z-index:2}
.page-hero .scrim{position:absolute;inset:0;background:linear-gradient(rgba(20,17,14,.4),rgba(20,17,14,.5));z-index:1}
.page-hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(2.4rem,5.5vw,4rem);line-height:1.1;margin:.15em 0 .3em}
.page-hero .sub{font-size:.78rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.85)}

section{padding:clamp(72px,11vw,140px) 0}
.intro{text-align:center}
.intro h2{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,4.6vw,3.3rem);line-height:1.25;max-width:20ch;margin:.5em auto .5em}
.intro p{color:var(--muted);max-width:56ch;margin:0 auto;font-size:1.02rem}
.center-cta{text-align:center;margin-top:48px}
.btn-dark{display:inline-block;background:var(--ink);color:var(--ivory);padding:15px 34px;font-size:.76rem;letter-spacing:.24em;text-transform:uppercase;transition:.35s}
.btn-dark:hover{background:var(--gold);color:#fff}
.btn-line{display:inline-block;border-bottom:1px solid var(--gold);padding-bottom:5px;color:var(--gold);font-size:.76rem;letter-spacing:.24em;text-transform:uppercase}

/* bandes plein cadre */
.band,.quote{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;background-size:cover;background-position:center}
.band{min-height:70vh}
.quote{min-height:64vh}
.band .in .script{font-size:clamp(1.8rem,3.4vw,2.6rem);color:#e9d9b8}
.quote blockquote{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(1.6rem,3.6vw,2.6rem);line-height:1.4;max-width:22ch;margin:0 auto}
.quote cite{display:block;margin-top:24px;font-style:normal;font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.8)}

/* split (bio / prestations) */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,80px);align-items:center}
.split .shot{aspect-ratio:4/5;overflow:hidden}
.split .shot img,.split .shot .ph{width:100%;height:100%;object-fit:cover}
.split h2,.split h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.8rem,3.6vw,2.6rem);margin:.35em 0 .55em;line-height:1.2}
.split p{color:var(--muted);margin-bottom:1em}
.split .sign{font-family:var(--script);font-size:2rem;color:var(--gold)}

/* portfolio / galeries */
.pf-head{text-align:center;margin-bottom:48px}
.pf-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,4.6vw,3.2rem);margin-top:.3em}
.mosaic{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.shot{overflow:hidden;position:relative}
.mosaic .shot img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.mosaic .shot:hover img{transform:scale(1.06)}
.m1{grid-column:span 4;aspect-ratio:16/10}
.m2{grid-column:span 2;aspect-ratio:3/4}
.m3{grid-column:span 2;aspect-ratio:3/4}
.m4{grid-column:span 2;aspect-ratio:1/1}
.m5{grid-column:span 2;aspect-ratio:1/1}
.m6{grid-column:span 4;aspect-ratio:16/9}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.grid3 .shot{aspect-ratio:3/4}
.grid3 .shot img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.grid3 .shot:hover img{transform:scale(1.06)}
.pf-more{text-align:center;margin-top:44px}

/* prestations sombre */
.incl{background:var(--ink);color:var(--ivory)}
.incl .label{color:var(--gold)}
.incl h2{font-family:var(--serif);font-weight:400;color:#fff}
.incl .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:38px;margin-top:54px}
.incl .item .n{font-family:var(--serif);font-size:2.6rem;color:var(--gold);line-height:1}
.incl .item h4{font-family:var(--sans);font-weight:400;letter-spacing:.06em;text-transform:uppercase;font-size:.8rem;margin:1em 0 .5em}
.incl .item p{color:rgba(244,239,231,.62);font-size:.92rem}
.incl .divider{width:38px;height:1px;background:var(--gold);margin-top:14px}

/* closer CTA plein cadre */
.closer{position:relative;min-height:78vh;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;background-size:cover;background-position:center}
.closer .script{font-size:clamp(1.8rem,3.4vw,2.6rem);color:#e9d9b8}
.closer h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.2rem,5.4vw,3.8rem);margin:.1em 0 .4em}
.closer p{color:rgba(255,255,255,.85);max-width:42ch;margin:0 auto 32px}
.closer .cta{background:var(--ivory);color:var(--ink)}
.closer .cta:hover{background:var(--gold);color:#fff}

/* pages texte (bio longue, mentions) */
.prose{max-width:70ch;margin:0 auto}
.prose h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.5rem,3vw,2rem);margin:1.6em 0 .5em}
.prose p{color:var(--ink);margin-bottom:1.1em}
.prose .muted{color:var(--muted)}

/* formulaire contact */
.form{max-width:640px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form .full{grid-column:1/-1}
.form label{display:block;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:7px}
.form input,.form textarea{width:100%;background:#fff;border:1px solid var(--line);padding:13px 15px;font-family:var(--sans);font-size:.95rem;color:var(--ink);border-radius:2px}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--gold)}
.form textarea{min-height:140px;resize:vertical}
.contact-info{text-align:center;margin-bottom:48px}
.contact-info a{color:var(--gold)}

/* espace clients */
.gal-list{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:900px;margin:0 auto}
.gal-card{background:#fff;border:1px solid var(--line);overflow:hidden;transition:.3s}
.gal-card:hover{box-shadow:0 12px 40px rgba(33,29,25,.12);transform:translateY(-3px)}
.gal-card .cover{aspect-ratio:4/3;overflow:hidden}
.gal-card .cover img,.gal-card .cover .ph{width:100%;height:100%;object-fit:cover}
.gal-card .body{padding:20px 22px}
.gal-card h3{font-family:var(--serif);font-weight:500;font-size:1.25rem}
.gal-card .date{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.gal-card .lock{margin-top:12px;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}

/* FOOTER */
footer{background:#191512;color:rgba(244,239,231,.72);padding:70px 0 34px;font-size:.9rem}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:44px}
footer .brand{color:#fff;font-size:1.5rem;display:block;margin-bottom:14px}
footer h5{font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);margin-bottom:16px}
footer a:hover{color:#fff}
footer .row{margin-bottom:9px}
footer nav ul{flex-direction:column;gap:9px;align-items:flex-start}
footer nav a{color:rgba(244,239,231,.72);text-transform:none;letter-spacing:normal;font-size:.9rem}
.fbot{border-top:1px solid rgba(244,239,231,.14);margin-top:48px;padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:.76rem;color:rgba(244,239,231,.5)}

@media(max-width:900px){
  nav ul{display:none}
  .burger{display:block}
  .split{grid-template-columns:1fr}
  .mosaic{grid-template-columns:repeat(2,1fr)}
  .m1,.m2,.m3,.m4,.m5,.m6{grid-column:span 1;aspect-ratio:4/5}
  .incl .grid{grid-template-columns:1fr 1fr}
  .grid3,.gal-list{grid-template-columns:1fr 1fr}
  .form{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr}
}
@media(max-width:560px){
  .grid3,.gal-list{grid-template-columns:1fr}
}