/* SWEET'ART - style.css */
:root {
  --noir: #2D2420;
  --noir-chaud: #F5EFE6;
  --ambre: #C47E2E;
  --or: #D4954A;
  --blanc-casse: #2D2420;
  --gris-chaud: #6B5B50;
  --gris-trait: #9A8878;
  --police-titre: "Cormorant Garamond", Georgia, serif;
  --police-corps: "Quicksand", system-ui, sans-serif;
  --transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  --ombre: 0 25px 60px rgba(0,0,0,0.4);
}
*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body {
  background:#FBF7F2;
  color:#2D2420;
  font-family:var(--police-corps);
  line-height:1.7;
  overflow-x:hidden;
}
img { max-width:100%; display:block; user-select:none; -webkit-user-drag:none; pointer-events:none; }
a { color:inherit; text-decoration:none; }
/* NAVIGATION */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between;
  padding:1.2rem 4rem;
  transition:var(--transition);
}
.nav.defilée {
  background:rgba(251,247,242,0.97);
  backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(200,135,58,0.15);
  padding:0.8rem 4rem;
}
.nav__logo {
  font-family:var(--police-titre);
  font-size:1.6rem;
  color:#2D2420;
  letter-spacing:0.05em;
}
.nav__logo span { color:var(--ambre); }
.nav__liens { display:flex; align-items:center; gap:2.5rem; list-style:none; }
.nav__liens a {
  font-size:0.85rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--gris-chaud);
  transition:var(--transition);
  position:relative;
}
.nav__liens a::after {
  content:""; position:absolute; bottom:-4px; left:0;
  width:0; height:1px; background:var(--ambre);
  transition:var(--transition);
}
.nav__liens a:hover { color:#2D2420; }
.nav__liens a:hover::after { width:100%; }
.nav__droite { display:flex; align-items:center; gap:1.5rem; }
.nav__langue {
  display:flex; gap:0.3rem;
  font-size:0.75rem; letter-spacing:0.1em; text-transform:uppercase;
}
.nav__langue button {
  background:none; border:none; cursor:pointer;
  color:var(--gris-chaud); padding:0.3rem 0.5rem;
  transition:var(--transition); font-family:var(--police-corps);
}
.nav__langue button.actif { color:var(--ambre); border-bottom:1px solid var(--ambre); }
.nav__burger { display:none; background:none; border:none; cursor:pointer; flex-direction:column; gap:5px; }
.nav__burger span { display:block; width:24px; height:1.5px; background:var(--blanc-casse); transition:var(--transition); }
.nav__mobile {
  display:none; position:fixed; inset:0; z-index:999;
  background:rgba(251,247,242,0.99); backdrop-filter:blur(20px);
  flex-direction:column; align-items:center; justify-content:center; gap:2rem;
}
.nav__mobile.ouvert { display:flex; }
.nav__mobile a { font-family:var(--police-titre); font-size:2rem; color:#2D2420; transition:var(--transition); }
.nav__mobile a:hover { color:var(--ambre); }
/* HERO */
.hero {
  min-height:100vh; display:grid; grid-template-columns:1fr 1fr;
  align-items:center; padding:6rem 4rem 3rem;
  position:relative; overflow:hidden;
  gap:2rem;
}
.hero__bg {
  position:absolute; inset:0; z-index:0;
  background:url("../img/hero-bg.webp") center/cover no-repeat;
}
.hero__bg::after {
  content:""; position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(251,247,242,0.88) 40%, rgba(245,239,230,0.6) 100%);
}
.hero__contenu { position:relative; z-index:1; }
.hero__marque {
  font-size:0.75rem; letter-spacing:0.3em; text-transform:uppercase;
  color:var(--ambre); margin-bottom:1.5rem;
  display:flex; align-items:center; gap:1rem;
}
.hero__marque::before { content:""; flex:1; max-width:40px; height:1px; background:var(--ambre); }
.hero__titre {
  font-family:var(--police-titre);
  font-size:clamp(4rem, 9vw, 8rem);
  font-weight:300;
  line-height:1.0; color:#2D2420; margin-bottom:1rem;
  letter-spacing:0.02em;
}
.hero__titre span { color:var(--ambre); }
.hero__slogan { font-family:var(--police-titre); font-style:italic; font-size:clamp(1.2rem, 2.8vw, 2rem); font-weight:400; color:#6B5B50; margin-bottom:0.8rem; }
.hero__sous-titre {
  font-size:0.85rem; letter-spacing:0.15em; text-transform:uppercase;
  color:#9A8878; margin-bottom:2rem;
}
.hero__boutons { display:flex; gap:1.5rem; align-items:center; flex-wrap:wrap; }
.btn-primaire {
  display:inline-flex; align-items:center; gap:0.7rem;
  background:linear-gradient(135deg, var(--ambre), var(--or));
  color:var(--noir); font-weight:600; font-size:0.85rem;
  letter-spacing:0.1em; text-transform:uppercase;
  padding:1rem 2rem; border:none; cursor:pointer;
  transition:var(--transition); clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));
}
.btn-primaire:hover { transform:translateY(-2px); box-shadow:0 10px 30px rgba(200,135,58,0.4); }
.btn-secondaire {
  display:inline-flex; align-items:center; gap:0.7rem;
  color:#2D2420; font-size:0.85rem; letter-spacing:0.1em;
  text-transform:uppercase; background:none; border:none; cursor:pointer;
  transition:var(--transition);
}
.btn-secondaire:hover { color:var(--ambre); }
.btn-secondaire .fleche { transition:var(--transition); }
.btn-secondaire:hover .fleche { transform:translateX(6px); }
.hero__image { position:relative; z-index:1; display:flex; justify-content:flex-end; }
.hero__cadre {
  position:relative; width:min(520px, 95%);
}
.hero__photo {
  width:100%; aspect-ratio:4/5; object-fit:cover;
  filter:grayscale(20%) contrast(1.1);
  clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,20px 100%,0 calc(100% - 20px));
}
.hero__cadre::before {
  content:""; position:absolute; inset:-12px;
  border:1px solid rgba(200,135,58,0.3);
  clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,20px 100%,0 calc(100% - 20px));
  z-index:-1;
}
.hero__badge {
  position:absolute; bottom:2rem; left:-2rem;
  background:rgba(18,16,14,0.95); backdrop-filter:blur(20px);
  border:1px solid rgba(200,135,58,0.3);
  padding:1rem 1.5rem;
}
.hero__badge-titre { font-family:var(--police-titre); font-size:1.4rem; color:var(--ambre); }
.hero__badge-texte { font-size:0.7rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--gris-chaud); }
.hero__defilement {
  position:absolute; bottom:2rem; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:0.8rem;
  z-index:1; animation:rebond 2s ease-in-out infinite;
}
.hero__defilement span { font-size:0.65rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--gris-trait); }
.hero__defilement svg { color:var(--ambre); }
@keyframes rebond { 0%,100%{transform:translateX(-50%) translateY(0);} 50%{transform:translateX(-50%) translateY(8px);} }
/* SEPARATEUR */
.separateur {
  display:flex; align-items:center; gap:2rem;
  padding:0 4rem; margin:4rem 0;
}
.separateur__ligne { flex:1; height:1px; background:linear-gradient(90deg,transparent,rgba(200,135,58,0.3),transparent); }
.separateur__ornement { color:var(--ambre); font-size:1.2rem; }
/* SECTION L'ARTISTE */
.artiste {
  padding:5rem 4rem;
  background:linear-gradient(180deg, #FBF7F2 0%, #F5EFE6 50%, #FBF7F2 100%);
}
.section__entete { text-align:center; margin-bottom:3rem; }
.section__surtitre {
  font-size:0.7rem; letter-spacing:0.35em; text-transform:uppercase;
  color:var(--ambre); margin-bottom:1rem;
}
.section__titre { font-family:var(--police-titre); font-size:clamp(2.5rem, 5vw, 4.5rem); font-weight:400; color:#2D2420; margin-bottom:1rem; line-height:1.1; letter-spacing:0.02em; }
.section__ligne { width:60px; height:1px; background:var(--ambre); margin:1.5rem auto; }
.section__sous-titre { color:var(--gris-chaud); max-width:500px; margin:0 auto; }
.artiste__grille { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.artiste__photos { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:auto auto; gap:1rem; }
.artiste__photo-principale {
  grid-column:1; grid-row:1/3;
  position:relative;
}
.artiste__photo-principale img {
  width:100%; height:500px; object-fit:cover;
  clip-path:polygon(0 0,calc(100% - 15px) 0,100% 15px,100% 100%,0 100%);
  filter:grayscale(10%) contrast(1.05);
}
.artiste__photo-secondaire img {
  width:100%; height:240px; object-fit:cover;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 15px),calc(100% - 15px) 100%,0 100%);
  filter:grayscale(10%) contrast(1.05);
}
.artiste__contenu { padding:1rem 0; }
.artiste__paragraphe { color:var(--gris-chaud); margin-bottom:1.5rem; line-height:1.8; }
.artiste__stats { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:3rem; padding-top:3rem; border-top:1px solid rgba(200,135,58,0.2); }
.artiste__stat-chiffre { font-family:var(--police-titre); font-size:2.5rem; font-weight:300; color:var(--ambre); display:block; }
.artiste__stat-label { font-size:0.7rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--gris-trait); }
/* SECTION GALERIE */
.galerie { padding:5rem 4rem; }
.galerie__filtres { display:flex; gap:0.8rem; justify-content:center; flex-wrap:wrap; margin-bottom:3rem; }
.galerie__filtre {
  background:none; border:1px solid rgba(200,135,58,0.3);
  color:var(--gris-chaud); padding:0.5rem 1.5rem;
  font-size:0.75rem; letter-spacing:0.15em; text-transform:uppercase;
  cursor:pointer; transition:var(--transition); font-family:var(--police-corps);
}
.galerie__filtre.actif, .galerie__filtre:hover {
  background:var(--ambre); color:var(--noir); border-color:var(--ambre);
}
.galerie__coming-soon {
  text-align:center; padding:6rem 2rem;
  border:1px dashed rgba(200,135,58,0.3);
}
.galerie__coming-soon-icone { font-size:3rem; margin-bottom:1.5rem; opacity:0.6; }
.galerie__coming-soon-titre { font-family:var(--police-titre); font-size:2rem; color:#2D2420; margin-bottom:1rem; }
.galerie__coming-soon-texte { color:var(--gris-chaud); max-width:400px; margin:0 auto 2rem; }
.galerie__grille { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.galerie__carte {
  position:relative; overflow:hidden; background:#EDE5D8;
  cursor:pointer;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%);
}
.galerie__carte-img { width:100%; aspect-ratio:3/4; object-fit:cover; transition:transform 0.6s ease; }
.galerie__carte:hover .galerie__carte-img { transform:scale(1.05); }
.galerie__carte-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(10,10,10,0.95) 30%, transparent 100%);
  opacity:0; transition:var(--transition); display:flex; flex-direction:column;
  justify-content:flex-end; padding:1.5rem;
}
.galerie__carte:hover .galerie__carte-overlay { opacity:1; }
.galerie__carte-titre { font-family:var(--police-titre); font-size:1.1rem; color:#2D2420; margin-bottom:0.5rem; }
.galerie__carte-lien { font-size:0.7rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--ambre); }
.galerie__carte-protection { position:absolute; inset:0; z-index:10; }
.galerie__filigrane {
  position:absolute; bottom:0.5rem; right:0.5rem;
  font-size:0.6rem; letter-spacing:0.1em; color:rgba(245,240,232,0.3);
  pointer-events:none; user-select:none; z-index:20;
}
.galerie__placeholder {
  border:1px dashed rgba(200,135,58,0.2);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  aspect-ratio:3/4; gap:1rem; background:rgba(237,229,216,0.5);
}
.galerie__placeholder-icone { font-size:2rem; opacity:0.3; }
.galerie__placeholder-texte { font-size:0.7rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--gris-trait); }
.galerie__vide {
  text-align:center; padding:4rem 2rem;
  border:1px dashed rgba(196,126,46,0.2);
}
.galerie__vide-icone { font-size:2.5rem; display:block; margin-bottom:1rem; opacity:0.4; }
.galerie__vide-texte { font-size:0.85rem; letter-spacing:0.1em; color:var(--gris-trait); font-style:italic; }
/* SECTION COMMANDER */
.commander {
  padding:5rem 4rem;
  background:linear-gradient(180deg, #F5EFE6 0%, #EDE5D8 100%);
}
.commander__grille { display:grid; grid-template-columns:1fr 1.5fr; gap:4rem; align-items:start; }
.commander__info-liste { list-style:none; margin-top:2.5rem; display:flex; flex-direction:column; gap:1rem; }
.commander__info-item { display:flex; align-items:center; gap:1rem; color:var(--gris-chaud); font-size:0.9rem; }
.commander__info-icone { color:var(--ambre); font-size:1.1rem; flex-shrink:0; }
.formulaire { display:flex; flex-direction:column; gap:1.5rem; }
.formulaire__ligne { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.formulaire__groupe { display:flex; flex-direction:column; gap:0.5rem; }
.formulaire__label { font-size:0.7rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--gris-chaud); }
.formulaire__champ {
  background:#FFFFFF; border:1px solid rgba(196,126,46,0.3);
  color:#2D2420; padding:0.9rem 1.2rem;
  font-family:var(--police-corps); font-size:0.9rem;
  transition:var(--transition); outline:none; width:100%;
}
.formulaire__champ:focus { border-color:var(--ambre); background:#FFFFFF; }
.formulaire__champ::placeholder { color:var(--gris-trait); }
.formulaire__textarea { min-height:140px; resize:vertical; }
.formulaire__select { appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23C8873A' stroke-width='1.5' fill='none'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 1rem center; cursor:pointer; }
.formulaire__select option { background:#EDE5D8; }
.formulaire__erreur { font-size:0.75rem; color:#e74c3c; display:none; }
.formulaire__erreur.visible { display:block; }
.formulaire__champ.invalide { border-color:#e74c3c; }
/* UPLOAD PHOTOS */
.formulaire__upload { position:relative; }
.formulaire__upload-input {
  position:absolute; inset:0; width:100%; height:100%;
  opacity:0; cursor:pointer; z-index:2;
}
.formulaire__upload-zone {
  border:2px dashed rgba(196,126,46,0.4);
  padding:2rem; text-align:center;
  transition:var(--transition); background:#FFFFFF;
}
.formulaire__upload-zone:hover,
.formulaire__upload.survol .formulaire__upload-zone {
  border-color:var(--ambre);
  background:rgba(196,126,46,0.04);
}
.formulaire__upload-icone { font-size:2rem; display:block; margin-bottom:0.5rem; }
.formulaire__upload-texte { font-size:0.9rem; color:#6B5B50; margin:0 0 0.3rem; }
.formulaire__upload-limite { font-size:0.7rem; letter-spacing:0.1em; color:var(--gris-trait); margin:0; }
.formulaire__upload-apercu {
  display:flex; flex-wrap:wrap; gap:0.8rem; margin-top:1rem;
}
.formulaire__upload-miniature {
  position:relative; width:80px; height:80px;
}
.formulaire__upload-miniature img {
  width:80px; height:80px; object-fit:cover;
  border:1px solid rgba(196,126,46,0.3);
  pointer-events:none; user-select:none;
}
.formulaire__upload-suppr {
  position:absolute; top:-6px; right:-6px;
  width:20px; height:20px; border-radius:50%;
  background:var(--ambre); color:#2D2420;
  font-size:11px; font-weight:700; border:none;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  line-height:1; pointer-events:all;
}

.formulaire__bouton {
  align-self:flex-start;
  background:linear-gradient(135deg, var(--ambre), var(--or));
  color:var(--noir); font-weight:700; font-size:0.85rem;
  letter-spacing:0.15em; text-transform:uppercase;
  padding:1.1rem 2.5rem; border:none; cursor:pointer; transition:var(--transition);
  display:inline-flex; align-items:center; gap:0.8rem;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));
}
.formulaire__bouton:hover { transform:translateY(-2px); box-shadow:0 10px 30px rgba(200,135,58,0.4); }
.formulaire__bouton:disabled { opacity:0.6; cursor:not-allowed; transform:none; }
.formulaire__succes {
  display:none; text-align:center; padding:3rem;
  border:1px solid rgba(200,135,58,0.3); background:rgba(237,229,216,0.5);
}
.formulaire__succes.visible { display:block; }
.formulaire__succes-titre { font-family:var(--police-titre); font-size:1.8rem; color:var(--ambre); margin-bottom:1rem; }
.formulaire__succes-texte { color:var(--gris-chaud); }
/* FOOTER */
.footer {
  background:#EDE5D8; border-top:1px solid rgba(200,135,58,0.15);
  padding:5rem 4rem 2rem;
}
.footer__grille { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:4rem; margin-bottom:4rem; }
.footer__logo { font-family:var(--police-titre); font-size:1.8rem; color:#2D2420; margin-bottom:1rem; }
.footer__logo span { color:var(--ambre); }
.footer__description { color:var(--gris-chaud); font-size:0.9rem; line-height:1.7; margin-bottom:1.5rem; }
.footer__titre { font-size:0.7rem; letter-spacing:0.2em; text-transform:uppercase; color:#2D2420; margin-bottom:1.5rem; }
.footer__liens { list-style:none; display:flex; flex-direction:column; gap:0.7rem; }
.footer__liens a { color:var(--gris-chaud); font-size:0.9rem; transition:var(--transition); }
.footer__liens a:hover { color:var(--ambre); padding-left:0.3rem; }
.footer__contact-item { display:flex; align-items:flex-start; gap:0.7rem; color:var(--gris-chaud); font-size:0.85rem; margin-bottom:0.7rem; }
.footer__contact-icone { color:var(--ambre); flex-shrink:0; margin-top:2px; }
.footer__reseaux { display:flex; gap:1rem; }
.footer__reseau {
  width:40px; height:40px; border:1px solid rgba(200,135,58,0.3);
  display:flex; align-items:center; justify-content:center;
  color:var(--gris-chaud); font-size:1rem; transition:var(--transition); cursor:pointer;
}
.footer__reseau:hover { background:var(--ambre); color:var(--noir); border-color:var(--ambre); }
.footer__bas {
  border-top:1px solid rgba(200,135,58,0.1);
  padding-top:2rem; display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:1rem;
}
.footer__copyright { font-size:0.75rem; color:var(--gris-trait); }
.footer__protection { font-size:0.7rem; color:var(--gris-trait); letter-spacing:0.05em; }
/* ANIMATIONS */
.animer { opacity:0; transform:translateY(30px); transition:opacity 0.7s ease, transform 0.7s ease; }
.animer.visible { opacity:1; transform:translateY(0); }
.animer-delai-1 { transition-delay:0.1s; }
.animer-delai-2 { transition-delay:0.2s; }
.animer-delai-3 { transition-delay:0.3s; }
.animer-delai-4 { transition-delay:0.4s; }
/* RESPONSIVE */

/* ── Grands écrans (1400px+) : plus d'espace latéral */
@media (min-width:1400px) {
  .hero, .artiste, .galerie, .commander, .footer { padding-left:8rem; padding-right:8rem; }
}

/* ── Tablette paysage (1024px) */
@media (max-width:1024px) {
  .nav { padding:1rem 2rem; }
  .nav.defilée { padding:0.8rem 2rem; }
  .hero { grid-template-columns:1.2fr 0.8fr; padding:5rem 2.5rem 3rem; gap:1.5rem; }
  .hero__titre { font-size:clamp(3rem,6vw,5rem); }
  .hero__cadre { width:min(380px,100%); }
  .artiste__grille { grid-template-columns:1fr 1fr; gap:2.5rem; }
  .artiste__photos { grid-template-columns:1fr 1fr; }
  .commander__grille { grid-template-columns:1fr 1.5fr; gap:2.5rem; }
  .footer__grille { grid-template-columns:1fr 1fr; gap:2rem; }
  .galerie, .artiste, .commander { padding:4rem 2.5rem; }
  .footer { padding:4rem 2.5rem 2rem; }
}

/* ── Tablette portrait (768px) */
@media (max-width:768px) {
  .nav__liens, .nav__langue { display:none; }
  .nav__burger { display:flex; }
  .nav { padding:1rem 1.5rem; }
  .hero { grid-template-columns:1fr; padding:5rem 1.5rem 3rem; }
  .hero__image { display:none; }
  .hero__contenu { text-align:center; }
  .hero__marque { justify-content:center; }
  .hero__boutons { justify-content:center; flex-direction:row; flex-wrap:wrap; }
  .hero__defilement { display:none; }
  .artiste__grille { grid-template-columns:1fr; gap:2.5rem; }
  .artiste__photos { grid-template-columns:1fr 1fr; }
  .artiste__photo-principale img { height:350px; }
  .galerie__grille { grid-template-columns:repeat(2,1fr); gap:1rem; }
  .galerie, .artiste, .commander { padding:3.5rem 1.5rem; }
  .commander__grille { grid-template-columns:1fr; gap:2rem; }
  .formulaire__ligne { grid-template-columns:1fr; }
  .footer__grille { grid-template-columns:1fr 1fr; gap:1.5rem; }
  .footer { padding:3rem 1.5rem 1.5rem; }
  .footer__bas { flex-direction:column; text-align:center; }
}

/* ── Mobile (480px) */
@media (max-width:480px) {
  .hero { padding:4.5rem 1rem 2.5rem; }
  .hero__titre { font-size:clamp(2.5rem,12vw,4rem); }
  .hero__boutons { flex-direction:column; align-items:center; width:100%; }
  .btn-primaire { width:100%; justify-content:center; }
  .galerie__grille { grid-template-columns:1fr; gap:1rem; }
  .galerie, .artiste, .commander { padding:3rem 1rem; }
  .footer__grille { grid-template-columns:1fr; }
  .artiste__stats { grid-template-columns:1fr; gap:1rem; }
  .separateur { padding:0 1rem; }
  .formulaire__bouton { width:100%; justify-content:center; }
}