/* ==========================================================================
   MAISON ARMIERRE — Feuille de style principale
   Palette : noir chaud / or bruni / crème / bordeaux profond
   ========================================================================== */

:root{
  --noir:        #0c0b09;
  --noir-2:      #141210;
  --carte:       #1a1713;
  --carte-2:     #211d18;
  --or:          #b8965a;
  --or-clair:    #d9bd8a;
  --or-terne:    #8a7148;
  --creme:       #f3ede1;
  --creme-att:   #cfc4ac;
  --taupe:       #948a76;
  --bordeaux:    #4a2222;
  --ligne:       rgba(216,189,138,0.16);
  --ligne-forte: rgba(216,189,138,0.32);

  --serif: 'Cormorant Garamond', 'Georgia', serif;
  --sans:  'Jost', 'Helvetica Neue', Arial, sans-serif;

  --container: 1180px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; overflow-x:hidden; }
body{
  margin:0;
  overflow-x:hidden;
  background:var(--noir);
  color:var(--creme);
  font-family:var(--sans);
  font-weight:300;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{
  font-family:var(--serif);
  font-weight:500;
  color:var(--creme);
  margin:0 0 .5em;
  letter-spacing:.01em;
}
p{ margin:0 0 1em; color:var(--creme-att); }
.container{ max-width:var(--container); margin:0 auto; padding:0 32px; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* ---------- Eyebrow / labels ---------- */
.eyebrow{
  font-family:var(--sans);
  text-transform:uppercase;
  letter-spacing:.28em;
  font-size:.72rem;
  color:var(--or-clair);
  font-weight:500;
  display:inline-flex;
  align-items:center;
  gap:12px;
}
.eyebrow::before{
  content:"";
  width:26px; height:1px;
  background:var(--or);
  display:inline-block;
}

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(12,11,9,0.88);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--ligne);
}
.site-header .container{
  display:flex; align-items:center; justify-content:space-between;
  height:84px; max-width:1360px; gap:24px;
}
.logo{
  display:flex; align-items:center;
  flex-shrink:0;
}
.logo img{
  height:74px; width:auto; display:block;
}
.logo small{
  font-family:var(--sans);
  font-size:.52rem;
  letter-spacing:.24em;
  color:var(--or);
  margin-top:4px;
  font-weight:400;
  white-space:nowrap;
}
nav.main-nav{ display:flex; align-items:center; gap:15px; flex-wrap:nowrap; }
nav.main-nav a{
  font-size:.62rem;
  letter-spacing:.045em;
  text-transform:uppercase;
  color:var(--creme-att);
  padding:6px 0;
  border-bottom:1px solid transparent;
  transition:color .25s, border-color .25s;
  white-space:nowrap;
}
nav.main-nav a:hover, nav.main-nav a.active{
  color:var(--or-clair);
  border-color:var(--or);
}
.btn-cta{
  font-family:var(--sans);
  font-size:.7rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--noir);
  background:var(--or);
  padding:13px 24px;
  border:1px solid var(--or);
  white-space:nowrap;
  transition:background .25s, color .25s, border-color .25s;
  display:inline-block;
}
.btn-cta:hover{ background:var(--or-clair); border-color:var(--or-clair); }
.header-cta{ padding:10px 15px; font-size:.6rem; letter-spacing:.07em; margin-left:2px; flex-shrink:0; }
.btn-outline{
  font-family:var(--sans);
  font-size:.7rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--creme);
  background:transparent;
  padding:13px 24px;
  border:1px solid var(--ligne-forte);
  white-space:nowrap;
  transition:border-color .25s, color .25s;
  display:inline-block;
}
.btn-outline:hover{ border-color:var(--or); color:var(--or-clair); }

.nav-toggle{ display:none; }

/* ---------- Hero ---------- */
.hero{
  position:relative;
  min-height:86vh;
  display:flex; align-items:center;
  overflow:hidden;
  background:
    linear-gradient(100deg, rgba(9,8,7,0.92) 0%, rgba(9,8,7,0.72) 32%, rgba(9,8,7,0.32) 58%, rgba(9,8,7,0.55) 100%),
    linear-gradient(0deg, rgba(9,8,7,0.55) 0%, transparent 30%),
    url('../images/hero/hero-accueil.jpg') left 42% / cover no-repeat;
  border-bottom:1px solid var(--ligne);
}
.hero-flame{ display:none; }
.hero .container{ position:relative; z-index:2; padding-top:60px; padding-bottom:60px; }
.hero-content{ max-width:640px; }
.hero h1{
  font-size:clamp(2.6rem, 5.4vw, 4.4rem);
  line-height:1.02;
  letter-spacing:.01em;
  margin:22px 0 18px;
}
.hero h1 em{ color:var(--or-clair); font-style:italic; }
.hero .lead{
  font-size:1.02rem;
  color:var(--creme-att);
  max-width:520px;
  margin-bottom:30px;
}
.hero-actions{ display:flex; gap:16px; flex-wrap:wrap; margin-bottom:34px; }
.hero-tags{
  display:flex; gap:10px; flex-wrap:wrap;
  font-size:.68rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--or-terne);
}
.hero-tags span{
  border:1px solid var(--ligne); padding:8px 14px;
  color:var(--creme-att);
}

/* ---------- Section scaffolding ---------- */
section{ padding:100px 0; }
.section-tight{ padding:70px 0; }
.legal-content h2{ font-size:1.35rem; margin-top:2.2em; padding-top:1.2em; border-top:1px solid var(--ligne); }
.legal-content h2:first-child{ margin-top:0; padding-top:0; border-top:none; }
.legal-content h3{ font-size:1.05rem; margin-top:1.4em; }
.legal-content p{ font-size:.95rem; line-height:1.7; }
.legal-content ul{ margin:0 0 1em 1.2em; padding:0; color:var(--creme-att); font-size:.95rem; line-height:1.7; }
.legal-content li{ margin-bottom:.4em; }
.legal-content a{ color:var(--or-clair); text-decoration:underline; }
.legal-content a:hover{ color:var(--creme); }
.section-head{ max-width:680px; margin-bottom:56px; }
.section-head h2{ font-size:clamp(1.9rem,3.4vw,2.8rem); margin-top:16px; }
.section-alt{ background:var(--noir-2); }
.divider{ height:1px; background:var(--ligne); border:0; margin:0; }

/* ---------- Grids ---------- */
.grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--ligne); }
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:36px; }
.grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }

/* ---------- Universe / feature cards ---------- */
.univers-card{
  background:var(--carte);
  padding:44px 34px;
  position:relative;
  transition:background .3s;
}
.univers-card:hover{ background:var(--carte-2); }
.univers-card .num{
  font-family:var(--serif); font-style:italic;
  color:var(--or-terne); font-size:.95rem; letter-spacing:.05em;
}
.univers-card h3{ font-size:1.35rem; margin:18px 0 12px; }
.univers-card p{ font-size:.92rem; margin-bottom:22px; }
.univers-card.univers-photo{ padding:0; overflow:hidden; }
.univers-card.univers-photo .univers-visual{ height:170px; overflow:hidden; background:linear-gradient(150deg, var(--carte) 0%, var(--noir-2) 100%); }
.univers-card.univers-photo .univers-visual img{ width:100%; height:100%; object-fit:cover; display:block; }
.univers-card.univers-photo .univers-body{ padding:26px 28px 30px; }
.univers-card.univers-photo h3{ margin-top:0; }
.univers-card a{
  font-size:.68rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--or-clair); border-bottom:1px solid var(--or-terne); padding-bottom:4px;
}

/* ---------- Collection card ---------- */
.collection-card{
  border:1px solid var(--ligne);
  padding:0;
  overflow:hidden;
}
.collection-visual{
  height:220px;
  background:linear-gradient(150deg, var(--carte) 0%, var(--noir-2) 100%);
  position:relative;
  display:flex; align-items:center; justify-content:center;
}
.collection-visual svg{ width:64px; height:64px; opacity:.85; }
.collection-visual img{ width:100%; height:100%; object-fit:cover; display:block; }
.collection-body{ padding:30px 30px 34px; }
.collection-body .eyebrow{ margin-bottom:14px; }
.collection-body h3{ font-size:1.4rem; margin-bottom:10px; }
.collection-body p{ font-size:.9rem; }

/* ---------- Process steps ---------- */
.process{
  display:grid; grid-template-columns:repeat(5,1fr); gap:0;
  border-top:1px solid var(--ligne); border-bottom:1px solid var(--ligne);
}
.process-step{
  padding:34px 24px;
  border-right:1px solid var(--ligne);
}
.process-step:last-child{ border-right:none; }
.process-step .idx{ font-family:var(--serif); font-style:italic; color:var(--or); font-size:1.1rem; }
.process-step h4{ font-size:1rem; margin:14px 0 8px; }
.process-step p{ font-size:.82rem; margin:0; }

/* ---------- Signature / quote block ---------- */
.signature-block{
  text-align:center; max-width:820px; margin:0 auto;
}
.signature-block .mark{
  font-family:var(--serif); font-style:italic; color:var(--or);
  font-size:1.1rem; display:block; margin-bottom:20px;
}
.signature-block h2{ font-size:clamp(1.8rem,3.6vw,2.6rem); }

/* ---------- Stats bar ---------- */
.bar{
  border-top:1px solid var(--ligne);
  background:var(--noir-2);
}
.bar .container{
  display:flex; flex-wrap:wrap; gap:0;
}
.bar-item{
  flex:1 1 220px;
  display:flex; align-items:center; gap:16px;
  padding:26px 24px;
  border-right:1px solid var(--ligne);
}
.bar-item:last-child{ border-right:none; }
.bar-item svg{ width:30px; height:30px; color:var(--or); flex-shrink:0; }
.bar-item .t1{ font-size:.82rem; letter-spacing:.05em; color:var(--creme); text-transform:uppercase; }
.bar-item .t2{ font-size:.8rem; color:var(--taupe); }

/* ---------- Cards generic ---------- */
.card{
  border:1px solid var(--ligne);
  padding:38px 32px;
  background:var(--carte);
}
.card h3{ font-size:1.25rem; }
.card p{ font-size:.9rem; margin-bottom:0; }
.card-photo{ padding:0; overflow:hidden; }
.card-photo .card-visual{ height:170px; overflow:hidden; background:linear-gradient(150deg, var(--carte) 0%, var(--noir-2) 100%); }
.card-photo .card-visual img{ width:100%; height:100%; object-fit:cover; display:block; }
.card-photo .card-body{ padding:26px 28px 30px; }
.card-photo h3{ margin-top:0; }

/* ---------- CTA band ---------- */
.cta-band{
  background:
    radial-gradient(ellipse 60% 100% at 50% 0%, rgba(184,150,90,0.14), transparent 70%),
    var(--noir-2);
  border-top:1px solid var(--ligne);
  border-bottom:1px solid var(--ligne);
  text-align:center;
  padding:90px 0;
}
.cta-band h2{ font-size:clamp(1.8rem,3.6vw,2.6rem); max-width:640px; margin:16px auto 30px; }
.cta-band-actions{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

/* ---------- Breadcrumb / page header ---------- */
.page-hero{
  padding:170px 0 70px;
  border-bottom:1px solid var(--ligne);
  background:
    radial-gradient(ellipse 60% 60% at 85% 0%, rgba(184,150,90,0.13), transparent 60%),
    var(--noir);
}
.page-hero.hero-hotellerie{
  background:
    linear-gradient(100deg, rgba(9,8,7,0.90) 0%, rgba(9,8,7,0.68) 35%, rgba(9,8,7,0.30) 65%, rgba(9,8,7,0.55) 100%),
    linear-gradient(0deg, rgba(9,8,7,0.55) 0%, transparent 35%),
    url('../images/hotellerie/bandeau-palace.jpg') center 45% / cover no-repeat;
}
.page-hero.hero-yachting{
  background:
    linear-gradient(100deg, rgba(9,8,7,0.90) 0%, rgba(9,8,7,0.68) 35%, rgba(9,8,7,0.30) 65%, rgba(9,8,7,0.55) 100%),
    linear-gradient(0deg, rgba(9,8,7,0.55) 0%, transparent 35%),
    url('../images/yachting/bandeau-yacht.jpg') center 42% / cover no-repeat;
}
.page-hero.hero-gastronomie{
  background:
    linear-gradient(100deg, rgba(9,8,7,0.90) 0%, rgba(9,8,7,0.68) 35%, rgba(9,8,7,0.30) 65%, rgba(9,8,7,0.55) 100%),
    linear-gradient(0deg, rgba(9,8,7,0.55) 0%, transparent 35%),
    url('../images/gastronomie/bandeau-gastronomie.jpg') center 42% / cover no-repeat;
}
.page-hero.hero-evenementiel{
  background:
    linear-gradient(100deg, rgba(9,8,7,0.90) 0%, rgba(9,8,7,0.68) 35%, rgba(9,8,7,0.30) 65%, rgba(9,8,7,0.55) 100%),
    linear-gradient(0deg, rgba(9,8,7,0.55) 0%, transparent 35%),
    url('../images/evenementiel/bandeau-mariage.jpg') center 38% / cover no-repeat;
}
.page-hero.hero-la-maison{
  background:
    linear-gradient(100deg, rgba(9,8,7,0.90) 0%, rgba(9,8,7,0.68) 35%, rgba(9,8,7,0.30) 65%, rgba(9,8,7,0.55) 100%),
    linear-gradient(0deg, rgba(9,8,7,0.55) 0%, transparent 35%),
    url('../images/la-maison/bandeau-atelier.jpg') center 45% / cover no-repeat;
}
.page-hero.hero-sur-mesure{
  background:
    linear-gradient(100deg, rgba(9,8,7,0.90) 0%, rgba(9,8,7,0.68) 35%, rgba(9,8,7,0.30) 65%, rgba(9,8,7,0.55) 100%),
    linear-gradient(0deg, rgba(9,8,7,0.55) 0%, transparent 35%),
    url('../images/sur-mesure/bandeau-faconnage.jpg') center 45% / cover no-repeat;
}
.page-hero.hero-savoir-faire{
  background:
    linear-gradient(100deg, rgba(9,8,7,0.90) 0%, rgba(9,8,7,0.68) 35%, rgba(9,8,7,0.30) 65%, rgba(9,8,7,0.55) 100%),
    linear-gradient(0deg, rgba(9,8,7,0.55) 0%, transparent 35%),
    url('../images/savoir-faire/bandeau-matiere.jpg') center 42% / cover no-repeat;
}
.page-hero.hero-signature-olfactive{
  background:
    linear-gradient(100deg, rgba(9,8,7,0.72) 0%, rgba(9,8,7,0.40) 35%, rgba(9,8,7,0.12) 65%, rgba(9,8,7,0.32) 100%),
    linear-gradient(0deg, rgba(9,8,7,0.42) 0%, transparent 40%),
    url('../images/signature-olfactive/bandeau-atelier-parfumeur.jpg') center 38% / cover no-repeat;
}
.page-hero.hero-professionnels{
  background:
    linear-gradient(100deg, rgba(9,8,7,0.90) 0%, rgba(9,8,7,0.68) 35%, rgba(9,8,7,0.30) 65%, rgba(9,8,7,0.55) 100%),
    linear-gradient(0deg, rgba(9,8,7,0.55) 0%, transparent 35%),
    url('../images/professionnels/bandeau-secteurs.jpg') center 45% / cover no-repeat;
}
.page-hero .eyebrow{ margin-bottom:18px; }
.page-hero h1{ font-size:clamp(2.2rem,4.6vw,3.4rem); max-width:820px; }
.page-hero .lead{ max-width:600px; color:var(--creme-att); font-size:1rem; margin-top:18px; }
.breadcrumb{
  font-size:.7rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--taupe); margin-bottom:22px;
}
.breadcrumb a{ color:var(--taupe); }
.breadcrumb a:hover{ color:var(--or-clair); }

/* ---------- Filters (Réalisations) ---------- */
.filters{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:50px; }
.filter-pill{
  font-size:.7rem; letter-spacing:.1em; text-transform:uppercase;
  border:1px solid var(--ligne-forte); padding:10px 20px; color:var(--creme-att);
  cursor:default;
}
.filter-pill.active{ background:var(--or); color:var(--noir); border-color:var(--or); }

.project-card{ border:1px solid var(--ligne); }
.project-visual{
  height:260px;
  background:linear-gradient(160deg, var(--carte) 0%, var(--noir-2) 100%);
  display:flex; align-items:center; justify-content:center;
}
.project-visual svg{ width:56px; height:56px; opacity:.7; }
.project-visual img{ width:100%; height:100%; object-fit:cover; display:block; }
.project-body{ padding:28px; }
.project-body .eyebrow{ margin-bottom:12px; }
.project-body h3{ font-size:1.15rem; margin-bottom:8px; }
.project-body p{ font-size:.86rem; }

/* ---------- Form (Contact) ---------- */
.form-wrap{
  border:1px solid var(--ligne); background:var(--carte);
  padding:48px;
}
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-bottom:22px; }
.form-field{ display:flex; flex-direction:column; gap:8px; }
.form-field.full{ grid-column:1/-1; }
.form-field label{ font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--taupe); }
.form-field input, .form-field select, .form-field textarea{
  background:var(--noir-2); border:1px solid var(--ligne); color:var(--creme);
  padding:13px 14px; font-family:var(--sans); font-size:.92rem; font-weight:300;
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus{
  outline:2px solid var(--or); outline-offset:1px; border-color:var(--or);
}
.form-field textarea{ resize:vertical; min-height:120px; }
.form-note{ font-size:.78rem; color:var(--taupe); margin-top:18px; }
.submit-row{ margin-top:28px; }
.btn-submit{
  font-family:var(--sans); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--noir); background:var(--or); padding:16px 36px; border:1px solid var(--or);
  cursor:pointer; transition:background .25s;
}
.btn-submit:hover{ background:var(--or-clair); }

.contact-info{ display:flex; flex-direction:column; gap:26px; }
.contact-info .item{ display:flex; gap:16px; align-items:flex-start; }
.contact-info svg{ width:22px; height:22px; color:var(--or); flex-shrink:0; margin-top:3px; }
.contact-info .item h4{ font-size:.95rem; margin-bottom:4px; }
.contact-info .item p{ font-size:.88rem; margin:0; }

/* ---------- SEO strip ---------- */
.seo-strip{ padding:36px 0; border-top:1px solid var(--ligne); }
.seo-strip .container{ display:flex; flex-wrap:wrap; gap:10px 26px; }
.seo-strip a{ font-size:.76rem; color:var(--taupe); }
.seo-strip a:hover{ color:var(--or-clair); }

/* ---------- Footer ---------- */
footer.site-footer{
  background:var(--noir-2);
  border-top:1px solid var(--ligne);
  padding:70px 0 30px;
}
.footer-grid{
  display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:50px;
  padding-bottom:50px; border-bottom:1px solid var(--ligne);
}
.footer-grid h4{
  font-family:var(--sans); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--or-terne); margin-bottom:20px; font-weight:500;
}
.footer-grid a, .footer-grid p{ font-size:.86rem; color:var(--creme-att); display:block; margin-bottom:12px; }
.footer-grid a:hover{ color:var(--or-clair); }
.footer-logo{ font-family:var(--serif); font-size:1.3rem; letter-spacing:.1em; margin-bottom:14px; }
.footer-logo img{ height:84px; width:auto; display:block; margin-bottom:14px; }
.footer-bottom{
  padding-top:26px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
  font-size:.76rem; color:var(--taupe);
}
.footer-bottom a{ color:var(--taupe); }
.footer-bottom a:hover{ color:var(--or-clair); }
.footer-legal{ display:flex; gap:20px; flex-wrap:wrap; }

/* ---------- Reveal (classe conservée pour usage futur ; contenu toujours visible) ---------- */
.reveal{ opacity:1; transform:none; }

/* ---------- Mobile ---------- */
@media (max-width: 1290px){
  nav.main-nav{
    position:fixed; top:84px; left:0; right:0; height:calc(100vh - 84px);
    background:var(--noir); z-index:105;
    flex-direction:column; align-items:flex-start; padding:36px 32px; gap:22px;
    transform:translateX(100%); transition:transform .3s ease;
    overflow-y:auto;
  }
  nav.main-nav.open{ transform:translateX(0); }
  nav.main-nav a{ font-size:.95rem; }
  .nav-toggle{
    display:flex; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer;
    padding:8px; z-index:110;
  }
  .nav-toggle span{ width:22px; height:1px; background:var(--creme); }
  .header-cta{ display:none; }
  .grid-4{ grid-template-columns:1fr 1fr; }
  .grid-3{ grid-template-columns:1fr; }
  .grid-2{ grid-template-columns:1fr; gap:34px; }
  .process{ grid-template-columns:1fr 1fr; }
  .process-step{ border-bottom:1px solid var(--ligne); }
  .footer-grid{ grid-template-columns:1fr 1fr; gap:34px; }
  .form-row{ grid-template-columns:1fr; }
  section{ padding:70px 0; }
  .hero-flame{ display:none; }
  .hero{
    min-height:auto;
    padding:110px 0 60px;
    background:
      linear-gradient(180deg, rgba(9,8,7,0.55) 0%, rgba(9,8,7,0.45) 45%, rgba(9,8,7,0.85) 100%),
      url('../images/hero/hero-accueil-mobile.jpg') center 30% / cover no-repeat;
  }
  .hero-content{ max-width:100%; }
}
@media (max-width: 600px){
  .hero{ padding:100px 0 50px; }
  .container{ padding:0 20px; }
  .footer-grid{ grid-template-columns:1fr; }
  .bar-item{ flex:1 1 100%; border-right:none; border-bottom:1px solid var(--ligne); }
  .logo img{ height:56px; }
}
