/* =====================================================================
   Atelier Meubles & Déco — theme.css
   Mise en page éditoriale minimale + palette d'origine violet / or / ivoire.
   Chargé APRÈS le <style> de chaque page.
   ===================================================================== */

:root{
  --ink:#2a2320;
  --ink-soft:#786a63;
  --line:#e8ded4;
  --ivory:#fbf7f2;
  --card:#ffffff;
  --plum-950:#2b1330;
  --plum-900:#3d1f3a;
  --plum-700:#6b2d5c;
  --plum-100:#f1e4ee;
  --gold:#b08d57;
  --gold-dark:#8f6f40;
  --radius:0;
  --wa:#25D366;
  --gutter:clamp(16px,2.4vw,36px);
}

html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } *{ transition:none !important; } }

body{
  font-family:'Jost','Helvetica Neue',Arial,sans-serif;
  font-size:14px; font-weight:400; line-height:1.6;
  background:var(--ivory); color:var(--ink);
}
h1,h2,h3,h4{
  font-family:'Jost','Helvetica Neue',Arial,sans-serif;
  font-weight:400; color:var(--plum-900); letter-spacing:-0.005em; line-height:1.2;
}
:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }

/* ---------- Header : logo à gauche, menu centré, icônes à droite ---------- */
header.site-header{ background:var(--plum-900); color:#fff; border-bottom:1px solid rgba(255,255,255,.08); }
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  max-width:none; padding:14px var(--gutter); gap:28px;
}
.logo{
  order:1; color:#fff; gap:12px;
  font-family:'Jost','Helvetica Neue',Arial,sans-serif; font-weight:500; font-size:14px;
  letter-spacing:.26em; text-transform:uppercase;
}
.logo-img{ width:38px; height:38px; border:2px solid var(--gold); }
nav.main-nav{ order:2; flex:1; justify-content:center; gap:24px; }
nav.main-nav a{
  font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:#e9dde5; padding:6px 0;
  border-bottom:1px solid transparent; transition:border-color .15s, color .15s;
}
nav.main-nav a:hover{ color:var(--gold); border-bottom-color:var(--gold); }
.header-icons{ order:3; gap:22px; }
.header-icons button{ color:#fff; font-size:15px; }
.header-icons button:hover{ color:var(--gold); }
.cart-count{ background:var(--gold); color:var(--plum-950); width:17px; height:17px; font-size:10px; top:-9px; right:-11px; }
.search-bar{ background:var(--plum-950); padding:12px var(--gutter); }
.search-bar input{
  max-width:none; border-radius:30px; border:0; padding:10px 18px; font-size:14px; background:#fff; outline:none;
}

@media (max-width:1180px){
  .header-inner{ flex-wrap:wrap; gap:6px 12px; padding:10px 16px; }
  .logo{ order:1; font-size:12.5px; letter-spacing:.2em; }
  .header-icons{ order:2; margin-left:auto; }
  nav.main-nav{ order:3; flex:1 1 100%; justify-content:flex-start; gap:20px; padding-bottom:2px; }
}
@media (max-width:420px){ .logo{ font-size:11px; letter-spacing:.14em; gap:8px; } .logo-img{ width:32px; height:32px; } }

/* ---------- Boutons ---------- */
.btn-gold{
  background:var(--gold); color:var(--plum-950); border-radius:0; padding:15px 34px;
  font-size:11px; letter-spacing:.16em; font-weight:600; text-transform:uppercase; gap:10px;
  transition:background .15s, color .15s;
}
.btn-gold:hover{ background:#c8a06a; }
.btn-gold i{ font-size:11px; }

/* ---------- Hero animé : diaporama plein cadre (zoom lent + fondu) ---------- */
.hero{
  position:relative; isolation:isolate; overflow:hidden;
  min-height:min(88vh,780px); align-items:flex-end; padding:0;
  background:linear-gradient(120deg,#2b1330,#6b2d5c 55%,#3d1f3a); background-size:200% 200%;
  animation:heroGrad 16s ease-in-out infinite;
}
@keyframes heroGrad{ 0%,100%{ background-position:0% 50%; } 50%{ background-position:100% 50%; } }

.hero-slides{ position:absolute; inset:0; z-index:-2; }
.hero-slides span{
  position:absolute; inset:0; opacity:0; will-change:opacity,transform;
  background:var(--img) center/cover no-repeat;
  animation:heroKB 60s linear infinite;
  animation-delay:calc(var(--i) * 10s);
}
.hero-slides span:nth-child(odd){ transform-origin:30% 60%; }
.hero-slides span:nth-child(even){ transform-origin:70% 40%; }
@keyframes heroKB{
  0%    { opacity:0; transform:scale(1.03); }
  3.5%  { opacity:1; }
  16.7% { opacity:1; }
  20.5% { opacity:0; transform:scale(1.17); }
  100%  { opacity:0; transform:scale(1.17); }
}
/* voile violet pour la lisibilité du texte */
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    linear-gradient(0deg, rgba(43,19,48,.90) 0%, rgba(43,19,48,.45) 42%, rgba(43,19,48,.10) 75%),
    linear-gradient(120deg, rgba(107,45,92,.28), rgba(43,19,48,0) 60%);
}
@media (prefers-reduced-motion:reduce){
  .hero, .hero-slides span{ animation:none !important; }
  .hero-slides span:first-child{ opacity:1; transform:none; }
}

.hero-inner{ position:relative; max-width:none; padding:0 var(--gutter) clamp(28px,5vw,64px); }
.hero-inner h1{
  color:#fff; font-weight:300; font-size:clamp(28px,4.4vw,58px); max-width:760px; margin-bottom:14px; letter-spacing:-0.015em;
  text-shadow:0 2px 24px rgba(43,19,48,.45);
}
.hero-inner p{ color:#f1e4ee; font-size:14.5px; max-width:480px; margin-bottom:26px; }

/* ---------- Univers (grille de catégories) ----------
   Compatible avec le balisage actuel : .category-media (photo) + .category-card-content (texte superposé) */
.section-title-block{ text-align:left; max-width:none; margin:0; padding:clamp(40px,6vw,72px) var(--gutter) 22px; }
.section-title-block h2{ font-size:clamp(22px,2.4vw,30px); font-weight:300; margin-bottom:6px; }
.section-title-block p{ color:var(--ink-soft); font-size:13.5px; }
.category-grid{ grid-template-columns:repeat(3,1fr); gap:6px; max-width:none; padding:0 6px clamp(40px,6vw,72px); }
.category-card{
  aspect-ratio:4/5; border:0; border-radius:0; box-shadow:none;
  background:linear-gradient(160deg,#6b2d5c,#3d1f3a);
}
.category-card::before{ height:3px; }
.category-card:hover{ transform:none; box-shadow:none; }
.category-card:hover .category-media img{ transform:scale(1.04); }
.category-card-content{ text-align:left; padding:28px clamp(16px,2vw,28px); }
.category-icon{ display:none; }
.category-card h3{ font-size:13px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; margin-bottom:4px; color:#fff; }
.category-card span{ font-size:12px; color:#e9dde5; letter-spacing:.02em; }
.category-card.no-img h3{ color:#fff; }
.category-card.no-img span{ color:#e9dde5; }
@media (max-width:820px){ .category-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .category-grid{ grid-template-columns:1fr; } .category-card{ aspect-ratio:4/5; } }

/* ---------- Produits ---------- */
.branch-section{ max-width:none; padding:clamp(28px,4vw,48px) var(--gutter); }
.branch-header{ border-bottom:1px solid var(--line); margin-bottom:26px; padding-bottom:18px; gap:0; }
.branch-icon{ display:none; }
.branch-header h2{ font-size:clamp(22px,2.4vw,30px); font-weight:300; }
.branch-header p{ font-size:13.5px; }
.product-grid{ grid-template-columns:repeat(4,1fr); gap:30px 8px; }
.product-card{ background:none; border:0; border-radius:0; overflow:visible; box-shadow:none; }
.product-card:hover{ box-shadow:none; transform:none; }
.product-img{ height:auto; aspect-ratio:3/4; font-size:34px; color:rgba(255,255,255,.7); }
.product-img img{ transition:transform .5s ease; }
.product-card:hover .product-img img{ transform:scale(1.025); }
.ph-0{ background:linear-gradient(135deg,#c98ea9,#8a4a6f); }
.ph-1{ background:linear-gradient(135deg,#a894c9,#6b4a8a); }
.ph-2{ background:linear-gradient(135deg,#9db38a,#5f7a4e); }
.ph-3{ background:linear-gradient(135deg,#d9ab6f,#a5713a); }
.ph-4{ background:linear-gradient(135deg,#cb8564,#8f4d33); }
.ph-5{ background:linear-gradient(135deg,#d99fb0,#a4526b); }
.product-info{ padding:10px 2px 0; }
.product-sub{ font-size:10.5px; letter-spacing:.06em; text-transform:none; color:var(--gold-dark); }
.product-info h4{ font-size:12px; font-weight:500; letter-spacing:.06em; text-transform:uppercase; margin:3px 0 4px; line-height:1.4; }
.product-rating{ display:none; }
.modal-body .product-rating{ display:block; }
.product-price{ font-family:inherit; font-weight:500; font-size:13.5px; color:var(--plum-700); margin-bottom:6px; }
.btn-add-cart{
  width:auto; background:none; color:var(--plum-900); padding:2px 0; border-radius:0; justify-content:flex-start;
  font-size:11px; letter-spacing:.1em; text-transform:uppercase; border-bottom:1px solid var(--gold); gap:6px;
}
.btn-add-cart i{ font-size:10px; }
.btn-add-cart:hover{ background:none; color:var(--plum-700); border-bottom-color:var(--plum-700); }
@media (max-width:1000px){ .product-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:640px){ .product-grid{ grid-template-columns:repeat(2,1fr); gap:24px 6px; } }

/* ---------- Bandeau de réassurance ---------- */
.trust-bar{ background:var(--plum-100); padding:32px var(--gutter); }
.trust-inner{ max-width:none; text-align:left; gap:28px; }
.trust-item i{ font-size:18px; color:var(--plum-700); margin-bottom:8px; }
.trust-item h4{ font-size:11px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; margin-bottom:6px; }
.trust-item p{ font-size:13px; color:var(--ink-soft); max-width:290px; }

/* ---------- Savoir-faire ---------- */
.story-section{ display:block; margin-top:0; min-height:0; }
.story-img{ display:none; }
.story-text{
  background:var(--plum-950); color:#fff; align-items:center; text-align:center;
  padding:clamp(56px,8vw,110px) var(--gutter); gap:16px;
}
.story-text span.eyebrow{ color:var(--gold); font-size:11px; letter-spacing:.2em; }
.story-text h2{ color:#fff; font-size:clamp(24px,3vw,38px); font-weight:300; max-width:720px; }
.story-text p{ color:#d9cbd4; font-size:14.5px; max-width:640px; line-height:1.8; }
.story-text a.seo-link{ border-bottom:1px solid var(--gold); }
.story-text a.seo-link:hover{ color:var(--gold); }

/* ---------- Pied de page ---------- */
footer{ background:var(--plum-950); color:#cbb9c5; padding:64px var(--gutter) 24px; }
.footer-grid{ max-width:none; }
.footer-grid h4{ color:#fff; font-size:11px; font-weight:500; letter-spacing:.16em; }
.footer-grid a, .footer-grid p{ color:#cbb9c5; font-size:13px; }
.footer-grid a:hover{ color:var(--gold); }
.footer-social a{ border-radius:50%; border-color:rgba(255,255,255,.25); }
.footer-social a:hover{ background:var(--gold); border-color:var(--gold); color:var(--plum-950); }
.map-embed{ border-radius:0; filter:grayscale(.3) sepia(.15); height:180px; }
.footer-bottom{ max-width:none; border-top-color:rgba(255,255,255,.12); color:#8a7a85; }

/* ---------- Panier, fenêtres ---------- */
.cart-overlay,.modal-overlay{ background:rgba(43,19,48,.5); }
.cart-head h3{ font-size:12px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; }
.cart-item-thumb{ border-radius:0; }
.cart-item-info h5{ font-weight:500; }
.cart-item-qty button, .qty-selector button{ border-radius:0; }
.cart-item-remove{ color:#b34747; text-decoration:underline; cursor:pointer; }
.cart-subtotal{ font-family:inherit; font-size:15px; font-weight:500; color:var(--plum-900); }
.modal-box{ border-radius:0; }
.modal-close{ border-radius:0; background:rgba(43,19,48,.75); }
.modal-img{ color:rgba(255,255,255,.7); }
.modal-body h2{ font-size:24px; font-weight:300; }
.modal-price{ font-family:inherit; font-size:17px; font-weight:500; color:var(--plum-700); }
.modal-actions .btn-add-cart{
  width:100%; justify-content:center; background:var(--plum-900); color:#fff; border:0;
  padding:14px !important; letter-spacing:.14em;
}
.modal-actions .btn-add-cart:hover{ background:var(--plum-700); color:#fff; }
.btn-wa{
  background:var(--wa); color:#fff; border-radius:0; font-size:11px; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; padding:15px;
}
.btn-wa:hover{ background:#1fb857; }
.modal-reviews h4, .checkout-body h2{ font-weight:400; }
.review-form{ background:var(--ivory); border-radius:0; }
.review-form input[type="text"], .review-form textarea, .checkout-body input, .checkout-body textarea{ border-radius:0; }
.thumb-item{ border-radius:0; }
.thumb-item:hover{ border-color:var(--gold); }
.toast{ background:var(--plum-950); border-radius:0; letter-spacing:.04em; }

/* ---------- Bloc texte SEO des pages catégories ---------- */
.seo-text{ max-width:none; padding:clamp(36px,5vw,64px) var(--gutter); border-top:1px solid var(--line); }
.seo-text h2{ font-size:clamp(18px,2vw,24px); font-weight:400; margin-bottom:10px; max-width:720px; }
.seo-text p{ color:#5c4f4a; font-size:14px; line-height:1.8; max-width:720px; }

/* ---------- Pages catégories : les produits passent avant la navigation entre univers ---------- */
body.page-category{ display:flex; flex-direction:column; min-height:100vh; }
body.page-category > *{ order:0; }
body.page-category .hero{ min-height:min(46vh,420px); }
body.page-category .branch-section{ order:1; }
body.page-category .seo-text{ order:2; }
body.page-category .section-title-block{ order:3; }
body.page-category .category-grid{ order:4; }
body.page-category .trust-bar{ order:5; }
body.page-category .story-section{ order:6; }
body.page-category .complaint-section{ order:7; }
body.page-category footer{ order:8; margin-top:auto; }
body.page-category .section-title-block h2{ font-size:clamp(18px,2vw,24px); }
body.page-category .hero,
body.page-category .branch-section,
body.page-category .seo-text,
body.page-category .section-title-block,
body.page-category .category-grid,
body.page-category .trust-bar,
body.page-category .story-section,
body.page-category .complaint-section,
body.page-category footer{ width:100%; margin-left:0; margin-right:0; }

/* ---------- Réclamations & Support (bandeau avant le footer) ---------- */
.complaint-section{
  background:var(--plum-950); color:#fff;
  padding:clamp(44px,7vw,72px) var(--gutter);
}
.complaint-inner{ max-width:760px; margin:0 auto; text-align:center; }
.complaint-inner h2{
  color:#fff; font-weight:300; font-size:clamp(22px,2.6vw,30px);
  display:flex; align-items:center; justify-content:center; gap:12px; margin-bottom:10px;
}
.complaint-inner h2 i{ color:var(--gold); font-size:0.85em; }
.complaint-inner > p{ color:#d9cbd4; font-size:14px; max-width:560px; margin:0 auto 28px; line-height:1.7; }
.complaint-row{ display:flex; gap:14px; margin-bottom:14px; flex-wrap:wrap; }
.complaint-row input, .complaint-inner textarea{
  flex:1; min-width:220px; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.18);
  color:#fff; padding:14px 16px; font-size:14px; font-family:inherit; border-radius:2px; outline:none;
  transition:border-color .15s, background .15s;
}
.complaint-row input::placeholder, .complaint-inner textarea::placeholder{ color:#b9a6b4; }
.complaint-row input:focus, .complaint-inner textarea:focus{ border-color:var(--gold); background:rgba(255,255,255,0.1); }
.complaint-inner textarea{ width:100%; min-height:110px; resize:vertical; margin-bottom:18px; display:block; }
.btn-complaint-send{
  width:100%; background:var(--wa); color:#fff; border:none; padding:16px; border-radius:2px;
  font-size:13px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; cursor:pointer;
  display:flex; align-items:center; justify-content:center; gap:10px; transition:background .15s;
}
.btn-complaint-send:hover{ background:#1fb857; }
.complaint-recaptcha{ display:flex; justify-content:center; margin:16px 0 2px; }
@media(max-width:560px){ .complaint-row{ flex-direction:column; } }