:root{
  --black:#0d0b09; --ink:#1b1712; --muted:#7a7166; --line:#ddd4c7; --paper:#f4efe7; --sand:#e6dccd; --amber:#c98a2e; --amber-d:#96601a; --pale:#f0c777;
  --title:"Cormorant Garamond", Georgia, serif; --sans:"Raleway", system-ui, sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);font-size:15.5px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.t{font-family:var(--title);font-weight:400;line-height:1.02;letter-spacing:-.01em}
.t em{font-style:italic;font-weight:400}
.kick{display:block;font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;font-weight:600}
.ico{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;height:48px;padding:0 24px;border-radius:40px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;white-space:nowrap}
.btn-amber{background:var(--amber-d);color:#fff}

/* Header */
.hdr{position:absolute;top:0;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:18px 20px;color:#fff}
.logo img{height:42px;width:auto}
.menu-state{position:absolute;right:20px;top:18px;width:44px;height:44px;opacity:0;z-index:13;cursor:pointer}
.burger{position:relative;z-index:12;width:44px;height:44px;border:1px solid currentColor;border-radius:50%;display:flex;align-items:center;justify-content:center}
.ico-close{display:none}
.nav{position:fixed;inset:0;z-index:11;background:var(--black);display:none;flex-direction:column;justify-content:center;gap:22px;padding:40px 28px;font-family:var(--title);font-size:38px;line-height:1.1}
.menu-state:checked~.nav{display:flex}
.menu-state:checked~.burger .ico-open{display:none}
.menu-state:checked~.burger .ico-close{display:block}
.menu-state:focus-visible~.burger{outline:2px solid var(--pale);outline-offset:3px}

/* Hero */
.hero{position:relative;height:100svh;min-height:600px;max-height:900px;overflow:hidden;background:#111;color:#fff}
.hero>img{width:100%;height:100%;object-fit:cover;object-position:88% center}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.42) 0,rgba(0,0,0,0) 26%,rgba(0,0,0,.05) 44%,rgba(0,0,0,.82) 100%)}
.hero .txt{position:absolute;left:20px;right:20px;bottom:96px;z-index:2}
.hero h1{font-size:clamp(68px,21vw,82px);line-height:.88;margin:12px 0 18px}
.hero h1 em{display:block;padding-left:44px;color:var(--pale)}
.hero .side{font-size:14px}

/* L'artiste */
.split{display:grid}
.split .pic{height:400px;overflow:hidden}
.split .pic img{width:100%;height:100%;object-fit:cover;object-position:center 18%}
.split .body{padding:44px 20px 50px}
.split h2{font-size:48px;margin:14px 0 18px}
.split h2 em{color:var(--amber-d)}
.split p{color:#4a4339}
.split .kick{color:var(--amber-d)}
.steps{list-style:none;margin-top:26px;border-top:1px solid var(--line)}
.steps li{display:grid;grid-template-columns:42px 1fr;padding:14px 0;border-bottom:1px solid var(--line)}
.steps small{font-size:11px;letter-spacing:.14em;color:var(--amber-d);font-weight:600;padding-top:5px}
.steps b{display:block;font-family:var(--title);font-weight:500;font-size:22px;line-height:1.2}
.steps span{font-size:13.5px;color:var(--muted)}

/* Œuvres */
.tiles{display:grid;grid-template-columns:1fr 1fr}
.tile{position:relative;overflow:hidden;min-height:190px}
.tile img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.tile.card{padding:20px 18px;display:flex;flex-direction:column;justify-content:flex-end}
.tile.card .kick{font-size:9.5px;margin-bottom:8px}
.tile.card b{font-family:var(--title);font-weight:500;font-size:23px;line-height:1.08}
.tile.card .d{font-size:12.5px;line-height:1.4;margin-top:6px}
.lead-tile{grid-column:1/-1;background:var(--black);color:#fff;padding:44px 20px 40px}
.lead-tile .kick{color:var(--pale)}
.lead-tile h2{font-size:58px;margin:14px 0 16px}
.lead-tile p{color:#c9c2b8;font-size:15px}
.amber{background:var(--amber-d);color:#fff}
.sand{background:var(--sand);color:var(--ink)}
.ink{background:var(--black);color:#fff}
.ink .kick{color:var(--pale)}
.sand .kick{color:var(--amber-d)}
.wide2{grid-column:1/-1;min-height:250px}

.more{display:grid;grid-template-columns:1fr 1fr;gap:18px 8px;padding:34px 20px 0}
.more img{width:100%;aspect-ratio:4/3;object-fit:cover}
.more figcaption{font-family:var(--title);font-size:19px;line-height:1.15;padding-top:8px}
.more figcaption span{display:block;font-family:var(--sans);font-size:12px;color:var(--muted);margin-top:3px}

/* Fournaise */
.fire{display:grid;margin-top:34px}
.fire .body{padding:46px 20px 44px}
.fire .kick{color:var(--amber-d)}
.fire h2{font-size:52px;margin:14px 0 16px}
.fire h2 em{color:var(--amber-d)}
.fire p{color:#4a4339;margin-top:12px}
.fire .quote{text-wrap:balance;font-family:var(--title);font-style:italic;font-size:25px;line-height:1.22;color:var(--ink);margin-top:22px;padding-left:18px;border-left:2px solid var(--amber)}
.fire .imgs{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:130px}
.fire .imgs img{width:100%;height:100%;object-fit:cover}
.fire .imgs .big{grid-column:span 3;grid-row:span 2}

/* Collaborations */
.collab{background:var(--black);color:#fff;padding:48px 20px 0}
.collab .kick{color:var(--pale)}
.collab h2{font-size:52px;margin:14px 0}
.collab .names{font-size:14px;color:#c9c2b8;line-height:1.6}
.collab .names b{color:#fff;font-weight:500}
.cgrid{display:grid;grid-template-columns:1fr 1fr;margin:28px -20px 0;gap:1px;background:#2a2622}
.cb{position:relative;height:180px;overflow:hidden}
.cb.big{grid-column:1/-1;height:230px}
.cb img{width:100%;height:100%;object-fit:cover}
.cb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.8))}
.cb figcaption{position:absolute;left:12px;right:12px;bottom:10px;z-index:2}
.cb b{display:block;font-family:var(--title);font-weight:500;font-size:19px;line-height:1.08}
.cb span{font-size:11.5px;line-height:1.3;color:#e8e2d9;display:block;margin-top:3px}

/* Contact */
.end{padding:50px 20px 60px}
.end .kick{color:var(--amber-d)}
.end h2{font-size:58px;margin:14px 0 20px}
.end h2 em{color:var(--amber-d)}
.cols{display:grid;gap:18px;margin-top:30px}
.cols small{display:block;font-size:10px;letter-spacing:.24em;text-transform:uppercase;font-weight:600;color:var(--amber-d);margin-bottom:4px}
.cols p{font-size:14.5px;color:#4a4339}
.cols b{color:var(--ink);font-weight:600}
.cols a{border-bottom:1px solid var(--line)}
.frame{position:relative;margin-top:34px;height:300px}
.frame::after{content:"";position:absolute;top:-14px;bottom:18px;right:0;width:22px;background:var(--amber-d)}
.frame img{position:relative;z-index:1;width:calc(100% - 12px);height:100%;object-fit:cover}
.press{display:flex;gap:14px;align-items:center;margin-top:30px;padding-top:20px;border-top:1px solid var(--line)}
.press img{width:62px;height:82px;object-fit:cover}
.press span{font-size:13px;color:var(--muted);line-height:1.45}
.press b{display:block;color:var(--ink);font-family:var(--title);font-size:20px;font-weight:500}
.ftr{background:var(--black);color:#b3aca2;padding:26px 20px 104px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;display:flex;justify-content:space-between;align-items:center}
.ftr img{height:32px;width:auto}

/* Barre de contact mobile */
.sticky{position:fixed;left:14px;right:14px;bottom:16px;z-index:9;display:flex;gap:8px;padding:8px;background:rgba(255,255,255,.97);border-radius:40px;box-shadow:0 14px 34px -10px rgba(0,0,0,.4)}
.sticky .btn{flex:1;height:48px}
.sticky .round{width:48px;height:48px;border:1px solid var(--line);border-radius:50%;display:flex;align-items:center;justify-content:center}

@media (hover:hover){
  .nav a:hover,.cols a:hover{color:var(--amber)}
  .btn-amber:hover{background:#7f5015}
  .tile img,.more img,.cb img{transition:transform .5s ease}
  .tile:hover img,.more figure:hover img,.cb:hover img{transform:scale(1.03)}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .tile img,.more img,.cb img{transition:none}
}

@media (min-width:900px){
  body{font-size:16px}
  .hdr{padding:26px clamp(32px,4.4vw,72px)}
  .logo img{height:50px}
  .menu-state,.burger{display:none}
  .nav,.menu-state:checked~.nav{position:static;display:flex;flex-direction:row;background:none;padding:0;gap:34px;font-family:var(--sans);font-size:11px;letter-spacing:.22em;text-transform:uppercase;font-weight:500;line-height:1.6}

  .hero{height:clamp(640px,90vh,860px);max-height:none}
  .hero>img{object-position:center 22%}
  .hero::after{background:linear-gradient(90deg,rgba(0,0,0,.76) 0,rgba(0,0,0,.42) 44%,rgba(0,0,0,0) 72%),linear-gradient(180deg,rgba(0,0,0,.4) 0,rgba(0,0,0,0) 20%)}
  .hero .txt{left:clamp(32px,4.4vw,72px);right:auto;top:50%;bottom:auto;transform:translateY(-42%)}
  .hero h1{font-size:clamp(116px,13.7vw,196px);margin:18px 0 0}
  .hero h1 em{padding-left:.85em}
  .hero .side{margin-top:26px;font-size:16px;padding-left:9.4em}

  .split{grid-template-columns:42% 1fr}
  .split .pic{height:auto;min-height:640px}
  .split .body{padding:clamp(48px,6vw,76px) clamp(32px,5vw,64px);display:grid;grid-template-columns:1.25fr .75fr;column-gap:clamp(28px,4.4vw,56px);align-items:start}
  .split h2{font-size:clamp(50px,5.6vw,76px);margin-top:18px}
  .steps{margin-top:0;border-top:0}
  .steps li{grid-template-columns:40px 1fr;padding:18px 0}
  .steps li:first-child{padding-top:30px}

  .tiles{grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(220px,21vw,340px)}
  .tile{min-height:0}
  .tile.card{padding:26px}
  .tile.card b{font-size:clamp(25px,2.4vw,32px)}
  .tile.card .d{font-size:13.5px}
  .lead-tile{grid-column:span 2;grid-row:span 2;padding:clamp(32px,4vw,54px) clamp(28px,3.4vw,40px);display:flex;flex-direction:column;justify-content:flex-end}
  .lead-tile h2{font-size:clamp(72px,8.1vw,112px);margin:18px 0 20px}
  .lead-tile p{font-size:16px;max-width:430px}
  .wide2{grid-column:span 2;min-height:0}

  .more{grid-template-columns:repeat(3,1fr);gap:34px 22px;padding:64px clamp(32px,4.4vw,72px) 0}
  .more figcaption{font-size:23px}
  .more figcaption span{font-size:13px}

  .fire{grid-template-columns:1fr 1fr;margin-top:64px}
  .fire .body{padding:clamp(48px,6.5vw,84px) clamp(32px,5vw,64px)}
  .fire h2{font-size:clamp(58px,6.5vw,88px);margin:18px 0 22px}
  .fire .quote{font-size:32px;margin-top:30px}
  .fire .imgs{grid-auto-rows:1fr}

  .collab{padding:90px clamp(32px,4.4vw,72px) 0}
  .collab .head{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:end}
  .collab h2{font-size:clamp(58px,6.5vw,88px);margin:18px 0 0}
  .collab .names{font-size:17px}
  .cgrid{grid-template-columns:2fr 1fr 1fr;margin:50px calc(-1*clamp(32px,4.4vw,72px)) 0}
  .cb,.cb.big{height:clamp(240px,25vw,380px);grid-column:auto}
  .cb.big{grid-row:span 2;height:auto}
  .cb b{font-size:clamp(22px,2.1vw,28px)}
  .cb span{font-size:13px}
  .cb figcaption{left:22px;right:22px;bottom:18px}

  .end{padding:90px clamp(32px,4.4vw,72px);display:grid;grid-template-columns:1.1fr .9fr .9fr;gap:clamp(32px,4.4vw,56px);align-items:start}
  .end h2{font-size:clamp(62px,7vw,96px);margin:18px 0 28px}
  .cols{gap:24px;margin-top:30px}
  .frame{margin-top:18px;height:400px}
  .press{margin-top:42px}
  .ftr{padding:26px clamp(32px,4.4vw,72px)}
  .sticky{display:none}
}
