/* ================== Variables & Reset (identiques) ================== */
:root{
  --black:#0a0a0a; --panel:#121212; --text:#EDEDED; --muted:#C9C9C9;
  --gold:#D6B36A; --gold-strong:#C9A34F; --beige:#E9D7B1; --beige-text:#1E1A14;
  --line:rgba(255,255,255,.08);
  --radius:14px; --shadow:0 8px 20px rgba(0,0,0,.45);
  --container:1280px;            /* + large sur desktop */
}
*,*::before,*::after{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0; background:var(--black); color:var(--text);
  font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif;
  line-height:1.55; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;

  /* structure pour coller le footer en bas si peu de contenu */
  min-height:100dvh; display:flex; flex-direction:column;
}
main{ flex:1 0 auto; }
.container{ width:min(92%, var(--container)); margin-inline:auto; }

/* ================== Header + Burger ================== */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(10,10,10,.7); backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}

/* grille mobile (brand | espace | burger) + nav pleine largeur */
.site-header .container{
  display:grid; grid-template-columns:auto 1fr auto; align-items:center;
  gap:.6rem; padding:.6rem 0; position:relative;
}
.brand{ display:inline-flex; align-items:center; gap:.6rem; color:inherit; text-decoration:none; }
.brand__logo{ width:44px; height:auto; }
.brand__name{ font-family:Cinzel,serif; letter-spacing:.08em; font-weight:700; color:var(--gold); font-size:1.08rem; }

/* Icone burger */
.nav-toggle{ display:none; }
.burger{ display:inline-flex; grid-column:3; justify-self:end;
  flex-direction:column; gap:5px; padding:.4rem .2rem; cursor:pointer; z-index:5; }
.burger span{
  width:26px; height:2px; background:var(--text); border-radius:2px;
  transition:transform .2s ease, opacity .2s ease;
}

/* Nav mobile : accordéon */
.nav{
  grid-column:1 / -1;
  display:flex; flex-direction:column; gap:.8rem;
  padding:.8rem 0 0; border-top:1px solid var(--line);
  max-height:0; overflow:hidden; transition:max-height .25s ease;
}
.nav__link{
  color:var(--text); text-decoration:none; font-size:.95rem; letter-spacing:.03em;
  padding:.45rem 0; border-bottom:1px solid transparent;
}
.nav__link:hover{ border-color:var(--gold); color:var(--gold); }

/* ouverture menu */
.nav-toggle:checked ~ .nav{ max-height:220px; }
.nav-toggle:checked + .burger span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle:checked + .burger span:nth-child(2){ opacity:0; }
.nav-toggle:checked + .burger span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ================== HERO ================== */
.hero{ padding:1.2rem 0 2.2rem; }
.hero__title{
  font-family:Cinzel,serif; color:var(--gold); font-weight:700;
  font-size:clamp(1.6rem, 5vw + .2rem, 3.2rem);
  line-height:1.12; margin:.4rem 0 1rem; max-width:22ch; text-wrap:balance; hyphens:auto;
}
.hero__title br{ display:none; } /* pas de <br> en mobile */
.lead{ margin:.6rem 0; color:var(--text); font-size:clamp(.98rem, 1.2vw, 1.06rem); }
.lead--gold{ color:var(--gold); }

.hero__actions{
  display:grid; grid-template-columns:1fr; gap:.8rem; margin-top:1.2rem;
}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.95rem 1.2rem; border-radius:999px; text-decoration:none; font-weight:700;
  letter-spacing:.04em; border:1px solid rgba(0,0,0,.15); box-shadow:var(--shadow); text-align:center;
}
.btn--beige{ background:var(--beige); color:var(--beige-text); }
.btn--beige:hover{ filter:brightness(.96); }

/* ================== Footer ================== */
.site-footer{
  border-top:1px solid var(--line); padding:1.2rem 0 2rem; color:#bfbfbf; font-size:.95rem;
}

/* ================== TABLET ================== */
@media (min-width:768px){
  .brand__logo{ width:46px; }
  .brand__name{ font-size:1.12rem; }
  .hero{ padding:1.6rem 0 2.6rem; }
  .hero__title{ font-size:clamp(2.2rem, 3.6vw, 3.2rem); }
}

/* ================== DESKTOP ================== */
@media (min-width:1024px){
  /* Header inline + nav visible + burger caché */
  .site-header .container{
    display:flex; align-items:center; justify-content:space-between; padding:1rem 0;
  }
  .burger{ display:none; }
  .nav-toggle{ display:none; }
  .nav{
    display:flex; flex-direction:row; gap:1.2rem; border-top:0; padding:0; max-height:none;
  }
  .nav__link{ font-size:.88rem; padding:.3rem 0; white-space:nowrap; }

  .brand__logo{ width:50px; }
  .brand__name{ font-size:1.15rem; }

  /* Hero qui “occupe l’espace” */
  .hero{
    padding:6vh 0 7vh;
    background: radial-gradient(1200px 600px at 65% -10%, #141b29 0%, var(--black) 60%);
  }
  .hero .container{
    max-width:1100px;
    display:grid;
    grid-template-columns:minmax(540px, 1fr) auto;
    column-gap:clamp(2rem, 4vw, 4rem);
    align-items:start;
  }

  .hero__title{
    max-width:28ch; line-height:1.1;
    font-size:clamp(3rem, 4.4vw, 4.2rem);
  }
  .hero__title br{ display:initial; }

  .hero__actions{
    grid-template-columns:repeat(3, max-content);
    justify-content:start; gap:1rem; margin-top:1.6rem;
  }
  .btn{ padding:1rem 1.3rem; }
}

/* ================== VERY WIDE (2K/4K) ================== */
@media (min-width:1440px){
  .hero .container{ max-width:1200px; }
  .hero__title{ font-size:clamp(3.4rem, 3.6vw, 4.6rem); }
}