*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f5f0e8;color:#171717;font-family:Inter,Arial,sans-serif}img{display:block;width:100%;max-width:100%}a{color:inherit}h1,h2,h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:400;line-height:.96;margin:0}h1{font-size:clamp(54px,8vw,118px);max-width:980px}h2{font-size:clamp(38px,5vw,76px)}h3{font-size:30px;margin-bottom:14px}.nav{position:fixed;top:0;left:0;right:0;z-index:50;padding:24px 6vw;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(to bottom,rgba(0,0,0,.42),rgba(0,0,0,0));color:#fff}.logo{font-family:"Cormorant Garamond",Georgia,serif;font-size:29px;text-decoration:none}.nav nav{display:flex;gap:28px;align-items:center}.nav nav a{text-decoration:none;font-size:14px;letter-spacing:.02em}.nav-btn{border:1px solid rgba(255,255,255,.7);border-radius:999px;padding:10px 18px}.hero{position:relative;min-height:100vh;background:url("assets/hero-salon-verriere.jpg") center/cover no-repeat;display:flex;align-items:center;padding:0 7vw}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.62),rgba(0,0,0,.22),rgba(0,0,0,.08))}.hero-content{position:relative;z-index:2;color:#fff}.lead{font-size:clamp(20px,2.25vw,31px);line-height:1.45;max-width:720px;margin:28px 0 0;color:#f5f0e8}.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:13px;font-weight:600;margin:0 0 18px;color:#b79a69}.eyebrow.light{color:#f1d7a2}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}.actions.centered{justify-content:center}.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border-radius:999px;padding:15px 25px;font-size:14px;font-weight:600;transition:.25s ease}.btn-light{background:#fff;color:#171717}.btn-light:hover{background:#b79a69;color:#fff}.btn-outline{border:1px solid rgba(255,255,255,.72);color:#fff}.btn-outline:hover{background:#fff;color:#171717}.btn-dark{background:#171717;color:#fff}.btn-dark:hover{background:#b79a69}.intro{padding:105px 7vw 70px;display:grid;grid-template-columns:1.15fr .85fr;gap:80px;align-items:end}.intro-copy p,.about-text p,.service-card p,.proof-card p,.statement-content p,.contact p{line-height:1.78;color:#6f675e;font-size:16px}.proof{padding:0 7vw 105px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.proof-card,.service-card{background:#fff;border-radius:30px;padding:34px;box-shadow:0 20px 60px rgba(34,24,14,.07)}.proof-card span{color:#b79a69;font-weight:700;font-size:13px}.portfolio{background:#171717;color:#fff;padding:110px 7vw}.section-title{max-width:980px;margin-bottom:54px}.section-title.center{text-align:center;margin-left:auto;margin-right:auto}.gallery{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:320px;gap:18px}.gallery-item{position:relative;margin:0;overflow:hidden;border-radius:26px;background:#222}.gallery-item.large{grid-column:span 2;grid-row:span 2}.gallery-item img{height:100%;object-fit:cover;transition:transform .75s ease,filter .75s ease}.gallery-item:hover img{transform:scale(1.055);filter:brightness(.78)}figcaption{position:absolute;left:18px;bottom:18px;background:rgba(255,255,255,.92);color:#171717;border-radius:999px;padding:9px 15px;font-size:13px;opacity:0;transform:translateY(8px);transition:.3s ease}.gallery-item:hover figcaption{opacity:1;transform:translateY(0)}.about{padding:115px 7vw;display:grid;grid-template-columns:1fr 1fr;gap:74px;align-items:center}.about-image img{border-radius:34px;aspect-ratio:4/5;object-fit:cover}.about-text p{font-size:17px}.services{padding:110px 7vw 120px}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.statement{position:relative;min-height:78vh;display:flex;align-items:flex-end;overflow:hidden}.statement>img{position:absolute;inset:0;height:100%;object-fit:cover}.statement-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.68),rgba(0,0,0,.12))}.statement-content{position:relative;z-index:2;color:#fff;max-width:800px;padding:0 7vw 90px}.statement-content p{color:#eee}.contact{background:#171717;color:#fff;text-align:center;padding:120px 7vw}.contact-inner{max-width:820px;margin:auto}.contact p{color:#d8d0c5}.note{font-size:13px!important;opacity:.7;margin-top:22px}footer{background:#0f0f0f;color:#c9c0b5;padding:34px 7vw;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.reveal{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .75s ease}.reveal.visible{opacity:1;transform:translateY(0)}@media(max-width:1000px){.intro,.about,.proof,.service-grid{grid-template-columns:1fr}.gallery{grid-template-columns:1fr 1fr}.gallery-item.large{grid-column:span 2;grid-row:span 1}.nav nav{display:none}}@media(max-width:640px){.hero{min-height:88vh;padding:0 6vw}.intro,.portfolio,.about,.services,.contact{padding-left:6vw;padding-right:6vw}.proof{padding-left:6vw;padding-right:6vw}.gallery{grid-template-columns:1fr;grid-auto-rows:270px}.gallery-item.large{grid-column:span 1}.actions{flex-direction:column}.btn{text-align:center}footer{display:block}}

/* Formulaire de contact Netlify */
.contact-form {
  margin: 42px auto 28px;
  max-width: 820px;
  text-align: left;
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.contact-form label {
  display: block;
  color: #f5f0e8;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 18px;
}

.contact-form input,
.contact-form select,
.contact-form textarea {
  width: 100%;
  margin-top: 8px;
  padding: 16px 18px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 16px;
  background: rgba(255,255,255,.08);
  color: #ffffff;
  font: inherit;
  outline: none;
}

.contact-form input::placeholder,
.contact-form textarea::placeholder {
  color: rgba(255,255,255,.52);
}

.contact-form select option {
  color: #171717;
}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus {
  border-color: #b79a69;
  background: rgba(255,255,255,.12);
}

.form-button {
  border: none;
  cursor: pointer;
  margin-top: 8px;
}

.hidden {
  display: none;
}

.contact-direct {
  margin-top: 22px;
}

@media(max-width:640px){
  .form-grid {
    grid-template-columns: 1fr;
    gap: 0;
  }
}