/* =========================================================
   MYSTÈRE DES ROSES — feuille de style principale
   Palette (d'apres photo de reference) : creme / vert olive profond / or / rose corail soutenu
   Typo : Cormorant Garamond (display) + Jost (texte)
   Signature : anneau doré circulaire (repris du logo) + touche de vert (feuilles de rose)
========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Jost:wght@300;400;500;600&display=swap');

:root{
  --ivory:#FBF8F3;        /* creme */
  --card:#FFFFFF;
  --burgundy:#3E3B2C;     /* olive fonce/charbon, ancre des titres et du footer */
  --burgundy-light:#57543E;
  --rose:#E8AFA6;         /* rose corail soutenu, d'apres la photo */
  --rose-soft:#F5DEDA;    /* rose corail, teinte claire pour fonds */
  --rose-deep:#DD968B;    /* rose corail plus soutenu, hover */
  --gold:#C9A24A;         /* or */
  --gold-light:#DBBD7E;
  --olive:#63693F;        /* vert olive profond - boutons et accents principaux */
  --olive-deep:#4F5433;
  --sage:#A8B8A5;         /* vert sauge clair - touches decoratives (feuilles) */
  --sage-deep:#8FA28B;
  --taupe:#C8B8A8;        /* taupe clair */
  --ink:#3E3B2C;
  --ink-soft:#8A8570;
  --line:#EAE3D6;
  --shadow: 0 12px 40px rgba(62,59,44,.10);
  --radius: 2px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--ivory);
  color:var(--ink);
  font-family:'Jost', sans-serif;
  font-weight:400;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4{
  font-family:'Cormorant Garamond', serif;
  font-weight:600;
  color:var(--burgundy);
  margin:0 0 .5em;
  letter-spacing:.01em;
}
h1{font-size:clamp(2.6rem,5vw,4.2rem); line-height:1.05;}
h2{font-size:clamp(2rem,3.4vw,2.9rem); line-height:1.1;}
h3{font-size:1.5rem;}
p{margin:0 0 1em; text-align:left;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
ul{margin:0; padding:0; list-style:none;}
button, input, textarea, select{font-family:inherit;}

.container{max-width:1180px; margin:0 auto; padding:0 28px;}
.eyebrow{
  display:inline-block;
  font-family:'Jost',sans-serif;
  font-size:.72rem;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:14px;
}
.section{padding:88px 0;}
.section-tight{padding:56px 0;}
.center{text-align:center;}
.lede{color:var(--ink-soft); font-size:1.06rem; max-width:100%; line-height:1.75;}
.center .lede, .lede.center{text-align:left;}

/* ---------- Anneau doré signature + touche de vert sauge ---------- */
.ring-divider{
  display:flex; align-items:center; justify-content:center;
  gap:14px; margin:0 auto 26px;
}
.ring-divider::before, .ring-divider::after{
  content:''; width:44px; height:1px; background:var(--line);
}
.ring-divider .dot{
  width:9px; height:9px; border-radius:50%;
  border:1px solid var(--gold); position:relative;
}
.ring-divider .dot::after{
  content:''; position:absolute; inset:2px; border-radius:50%; background:var(--gold);
}
.ring-divider .leaf{
  width:15px; height:15px; color:var(--sage-deep); display:inline-flex; align-items:center; justify-content:center;
}
.ring-divider .leaf svg{width:100%; height:100%; fill:currentColor;}
/* Logo affiche en entier, sans cercle ni anneau dore autour (demande client) */
.ring-frame{
  position:relative;
  overflow:visible;
}
.ring-frame img{width:100%; height:auto; object-fit:contain;}

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(248,243,236,.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 28px; max-width:1180px; margin:0 auto;
}
.brand{display:flex; align-items:center; gap:12px;}
.brand img{height:48px; width:auto; max-width:110px; object-fit:contain;}
.brand-text{font-family:'Cormorant Garamond',serif; line-height:1.05;}
.brand-text .m{display:block; font-size:1.18rem; letter-spacing:.12em; color:var(--burgundy); font-weight:600;}
.brand-text .r{display:block; font-size:.62rem; letter-spacing:.32em; color:var(--gold); text-transform:uppercase;}

.nav-links{display:flex; align-items:center; gap:34px;}
.nav-links a{
  font-size:.82rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink); position:relative; padding:4px 0;
}
.nav-links a::after{
  content:''; position:absolute; left:0; right:100%; bottom:-2px; height:1px;
  background:var(--gold); transition:right .25s ease;
}
.nav-links a:hover::after, .nav-links a.active::after{right:0;}
.nav-links a.active{color:var(--burgundy);}

.cart-link{display:flex; align-items:center; gap:8px;}
.cart-badge{
  background:var(--burgundy); color:#fff; font-size:.68rem;
  border-radius:50%; width:20px; height:20px; display:flex; align-items:center; justify-content:center;
}
.nav-toggle{display:none;}

/* ---------- Boutons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:14px 30px;
  font-size:.78rem; letter-spacing:.14em; text-transform:uppercase;
  border:1px solid var(--olive); border-radius:var(--radius);
  background:var(--olive); color:#fff;
  cursor:pointer; transition:all .25s ease;
}
.btn:hover{background:var(--gold); border-color:var(--gold); color:#fff;}
.btn-outline{background:transparent; color:var(--olive); border-color:var(--olive);}
.btn-outline:hover{background:var(--olive); color:#fff;}
.btn-gold{background:var(--gold); border-color:var(--gold);}
.btn-gold:hover{background:var(--olive); border-color:var(--olive);}
.btn-sm{padding:9px 18px; font-size:.7rem;}
.btn-block{width:100%;}
.btn[disabled]{opacity:.5; cursor:not-allowed;}

/* ---------- Hero ---------- */
.hero{
  position:relative;
  padding:70px 0 60px;
  overflow:hidden;
}
.hero-deco{
  position:absolute; pointer-events:none; z-index:0;
}
.hero-deco.leaf-corner{
  top:-10px; left:-10px; width:150px; height:auto; opacity:0.95;
}
.hero-deco.rose-corner{
  bottom:-40px; right:-30px; width:190px; height:auto; opacity:0.9;
}
.hero .container{position:relative; z-index:1;}
.hero-grid{
  display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:center;
}
.hero-copy .eyebrow{margin-bottom:20px;}
.hero-copy p.lede{margin:22px 0 34px;}
.hero-cta{display:flex; gap:16px; flex-wrap:wrap;}
.hero-image-wrap{
  position:relative; justify-self:center;
  width:min(420px, 90%);
}
.hero-image-wrap .ring-frame{width:100%;}

/* ---------- Bandeau valeurs ---------- */
.values-strip{
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  background:var(--card);
}
.values-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:20px;
  padding:34px 0;
}
.value-item{text-align:center; padding:0 12px;}
.value-item .num{
  font-family:'Cormorant Garamond',serif; color:var(--gold); font-size:1.6rem; display:block; margin-bottom:6px;
}
.value-item h4{font-size:1.02rem; margin-bottom:4px;}
.value-item p{color:var(--ink-soft); font-size:.88rem; margin:0;}

/* ---------- Cartes produits ---------- */
.product-grid{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(255px,1fr)); gap:30px;
  margin-top:44px;
}
.product-card{
  background:var(--card); border:1px solid var(--line);
  display:flex; flex-direction:column;
  transition:box-shadow .25s ease, transform .25s ease;
}
.product-card:hover{box-shadow:var(--shadow); transform:translateY(-3px);}
.product-thumb{
  aspect-ratio:1/1; background:var(--rose-soft);
  position:relative; overflow:hidden;
}
/* les vignettes sont des <img loading="lazy"> : le navigateur ne telecharge
   que celles qui arrivent a l'ecran */
.product-thumb img{
  width:100%; height:100%; object-fit:cover; display:block;
}
.product-thumb .badge{
  position:absolute; top:12px; left:12px;
  background:var(--sage-deep); color:#fff; font-size:.64rem; letter-spacing:.1em;
  text-transform:uppercase; padding:5px 10px;
}
.product-body{padding:20px 20px 22px; display:flex; flex-direction:column; gap:8px; flex:1;}

/* ---------- Cartes produits sans image (accueil) ---------- */
.product-card-text{
  border-top:2px solid var(--gold);
  background:var(--card);
}
.product-card-text .product-body{padding:26px 24px 26px;}
.product-card-text h3{font-size:1.4rem;}
.tag-promo{
  display:inline-block; background:var(--rose-soft); color:var(--burgundy);
  font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; padding:4px 10px; border-radius:20px;
}
.product-body .cat{font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold);}
.product-body h3{font-size:1.28rem; margin:0;}
.product-body p{color:var(--ink-soft); font-size:.88rem; margin:0; flex:1;}
.product-price{display:flex; align-items:baseline; gap:10px; margin-top:6px;}
.product-price .now{font-family:'Cormorant Garamond',serif; font-size:1.35rem; color:var(--burgundy); font-weight:600;}
.product-price .old{font-size:.85rem; color:var(--ink-soft); text-decoration:line-through;}
.product-actions{margin-top:10px; display:flex; flex-direction:column; gap:8px;}
.product-actions form{margin:0;}

/* Bouton WhatsApp */
.btn-whatsapp{
  background:#25D366; border-color:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center; gap:8px;
}
.btn-whatsapp:hover{background:#1da851; border-color:#1da851; color:#fff;}
.btn-whatsapp::before{content:'\260E'; font-size:1em; line-height:1;}

/* (ancien bouton unique, conserve pour compatibilite) */
.btn-buy{
  background:#25D366; border-color:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center; gap:8px;
}
.btn-buy:hover{background:#1da851; border-color:#1da851; color:#fff;}
.btn-buy::before{
  content:'\260E'; font-size:1em; line-height:1;
}
.btn-buy.btn-outline{
  background:transparent; color:#1da851; border-color:#25D366;
}
.btn-buy.btn-outline:hover{background:#25D366; color:#fff;}
.variant-quick-select{
  width:100%; padding:8px 10px; margin-bottom:8px; border:1px solid var(--line);
  background:var(--card); font-size:.82rem; color:var(--ink);
}

/* ---------- Filtres ---------- */
.filter-bar{
  display:flex; flex-wrap:wrap; gap:10px; margin-top:30px;
}
.filter-bar a{
  padding:9px 18px; border:1px solid var(--line); font-size:.76rem;
  letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft);
}
.filter-bar a.active, .filter-bar a:hover{border-color:var(--gold); color:var(--burgundy);}

/* ---------- Page produit détail ---------- */
.product-detail{display:grid; grid-template-columns:.9fr 1fr; gap:60px; align-items:flex-start;}
.product-detail .thumb{aspect-ratio:1/1; background:var(--rose-soft) center/cover no-repeat; border:1px solid var(--line);}
.product-detail .price-row{display:flex; align-items:baseline; gap:14px; margin:18px 0 28px;}
.product-detail .now{font-size:2rem;}
.variant-select{margin-bottom:20px;}
.variant-option{
  display:flex; align-items:center; gap:12px; padding:12px 14px; margin-bottom:8px;
  border:1px solid var(--line); cursor:pointer; transition:border-color .2s ease;
}
.variant-option:has(input:checked){border-color:var(--gold); background:#FBF6EC;}
.variant-option input{width:auto; margin:0;}
.variant-name{font-weight:500; color:var(--burgundy); min-width:70px;}
.variant-ref{font-size:.8rem; color:var(--ink-soft); flex:1;}
.variant-price{font-weight:500; color:var(--burgundy);}
.qty-row{display:flex; align-items:center; gap:14px; margin-bottom:22px;}
.qty-box{display:flex; align-items:center; border:1px solid var(--line);}
.qty-box button{background:none; border:none; width:38px; height:42px; cursor:pointer; font-size:1.1rem;}
.qty-box input{width:44px; text-align:center; border:none; background:none; font-size:1rem;}
.stock-note{font-size:.82rem; color:var(--ink-soft);}

/* ---------- Panier ---------- */
.cart-table{width:100%; border-collapse:collapse; margin-top:20px;}
.cart-table th{
  text-align:left; font-size:.7rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-soft); padding-bottom:14px; border-bottom:1px solid var(--line);
}
.cart-table td{padding:18px 10px; border-bottom:1px solid var(--line); vertical-align:middle;}
.cart-row-product{display:flex; align-items:center; gap:16px;}
.cart-row-product img{width:64px; height:64px; object-fit:cover; border:1px solid var(--line);}
.cart-qty-input{width:56px; padding:6px; border:1px solid var(--line); text-align:center;}
.cart-summary{
  background:var(--card); border:1px solid var(--line); padding:26px; margin-top:30px; max-width:400px; margin-left:auto;
}
.cart-summary .row{display:flex; justify-content:space-between; margin-bottom:10px; font-size:.94rem;}
.cart-summary .total{font-family:'Cormorant Garamond',serif; font-size:1.5rem; color:var(--burgundy); font-weight:600;}
.cart-empty{padding:60px 0; text-align:center; color:var(--ink-soft);}

/* ---------- Formulaires ---------- */
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.form-group{margin-bottom:18px;}
.form-group.full{grid-column:1/-1;}
label{display:block; font-size:.76rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:7px;}
input[type=text], input[type=email], input[type=tel], input[type=number], input[type=password], textarea, select{
  width:100%; padding:13px 14px; border:1px solid var(--line); background:var(--card);
  color:var(--ink); font-size:.95rem;
}
input:focus, textarea:focus, select:focus{outline:2px solid var(--gold); outline-offset:1px;}
textarea{resize:vertical; min-height:130px;}
.payment-options{display:flex; flex-direction:column; gap:12px; margin-bottom:24px;}
.payment-option{
  border:1px solid var(--line); padding:16px 18px; display:flex; align-items:flex-start; gap:12px; cursor:pointer;
}
.payment-option:has(input:checked){border-color:var(--gold); background:#FBF6EC;}
.payment-option input{width:auto; margin-top:3px;}
.payment-option .name{font-weight:500; color:var(--burgundy);}
.payment-option .desc{font-size:.84rem; color:var(--ink-soft);}

.alert{padding:14px 18px; border-left:3px solid var(--gold); background:var(--card); margin-bottom:22px; font-size:.92rem;}
.alert-success{border-color:#5D8A66;}
.alert-error{border-color:#B3453F;}

/* ---------- Contact / Infos ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:60px;}
.info-list li{display:flex; gap:14px; margin-bottom:22px; align-items:flex-start;}
.info-list .ic{
  width:38px; height:38px; border:1px solid var(--gold); border-radius:50%;
  display:flex; align-items:center; justify-content:center; color:var(--gold); flex:none; font-size:1rem;
}
.info-list h4{margin:0 0 3px; font-size:1.02rem;}
.info-list p{margin:0; color:var(--ink-soft); font-size:.92rem;}
.map-frame{border:1px solid var(--line); height:260px; margin-top:26px;}
.map-frame iframe{width:100%; height:100%; border:0;}

/* ---------- Newsletter / CTA bloc ---------- */
.cta-band{
  background:var(--burgundy); color:#F3E6D8;
  padding:70px 0; text-align:center;
}
.cta-band h2{color:#fff;}
.cta-band p{color:#E4C9BE; margin:0 0 30px;}
.cta-band .btn{background:var(--gold); border-color:var(--gold);}
.cta-band .btn:hover{background:#fff; color:var(--burgundy); border-color:#fff;}

/* ---------- Footer ---------- */
.site-footer{background:var(--burgundy); color:#D9D2C0; padding:64px 0 26px; margin-top:0;}

/* ---------- Bouton WhatsApp flottant ---------- */
.whatsapp-float{
  position:fixed; bottom:24px; right:24px; z-index:80;
  width:56px; height:56px; border-radius:50%;
  background:#25D366; color:#fff; font-size:1.6rem;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 24px rgba(0,0,0,.22);
  transition:transform .2s ease;
}
.whatsapp-float:hover{transform:scale(1.08); color:#fff;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; margin-bottom:50px;}
.footer-grid h5{
  color:#EBD6B9; font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; margin-bottom:18px; font-family:'Jost',sans-serif;
}
.footer-grid li{margin-bottom:10px; font-size:.9rem;}
.footer-grid a:hover{color:#EBD6B9;}
.footer-brand{display:flex; align-items:center; gap:12px; margin-bottom:16px;}
.footer-brand img{height:44px; width:auto; max-width:100px; object-fit:contain;}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12); padding-top:22px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:.78rem; color:#B69C93;
}

/* ---------- Utilitaires layout page ---------- */
.page-header{padding:56px 0 20px; text-align:center;}
.breadcrumb{font-size:.78rem; color:var(--ink-soft); margin-bottom:14px;}
.breadcrumb a{color:var(--gold);}

/* ---------- Responsive ---------- */
@media (max-width: 900px){
  .hero-grid{grid-template-columns:1fr;}
  .hero-image-wrap{order:-1; width:min(320px,70%);}
  .values-grid{grid-template-columns:repeat(2,1fr);}
  .product-detail{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .form-grid{grid-template-columns:1fr;}
  .admin-shell{flex-direction:column;}
  .admin-sidebar{width:100%; padding:16px 20px; display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px;}
  .admin-sidebar .brand{margin:0 14px 0 0; flex:none;}
  .admin-sidebar a{margin-bottom:0; padding:8px 10px;}
  .admin-main{padding:24px 20px;}
  .stat-grid{grid-template-columns:repeat(2,1fr);}
  .cart-table{display:block; overflow-x:auto; white-space:nowrap;}
  .admin-table{display:block; overflow-x:auto; white-space:nowrap;}
}
@media (max-width: 680px){
  .nav-links{
    position:fixed; inset:0 0 0 30%; background:var(--ivory); flex-direction:column;
    justify-content:center; align-items:flex-start; padding:40px; gap:26px;
    transform:translateX(100%); transition:transform .3s ease; z-index:60;
    border-left:1px solid var(--line);
  }
  .nav-links.open{transform:translateX(0);}
  .nav-toggle{display:block; background:none; border:none; font-size:1.5rem; cursor:pointer; color:var(--burgundy);}
  .footer-grid{grid-template-columns:1fr;}
  .values-grid{grid-template-columns:1fr;}
  .hero-deco.leaf-corner{width:90px; top:-6px; left:-6px; opacity:.8;}
  .hero-deco.rose-corner{width:110px; bottom:-20px; right:-16px; opacity:.75;}
  .stat-grid{grid-template-columns:1fr 1fr;}
  .whatsapp-float{width:48px; height:48px; font-size:1.3rem; bottom:16px; right:16px;}
}
@media (max-width: 420px){
  .hero-deco{display:none;}
}

/* ---------- Admin (partagé avec admin/assets si besoin) ---------- */
.admin-body{background:#F3EEE7; font-family:'Jost',sans-serif; color:var(--ink); margin:0;}
.admin-shell{display:flex; min-height:100vh;}
.admin-sidebar{
  width:230px; background:var(--burgundy); color:#EBDCD3; flex:none; padding:26px 20px;
}
.admin-sidebar .brand{color:#fff; margin-bottom:30px;}
.admin-sidebar a{
  display:block; padding:11px 12px; border-radius:3px; font-size:.88rem; color:#E6D3C9; margin-bottom:4px;
}
.admin-sidebar a:hover, .admin-sidebar a.active{background:rgba(255,255,255,.1); color:#fff;}
.admin-main{flex:1; padding:34px 40px;}
.admin-topbar{display:flex; justify-content:space-between; align-items:center; margin-bottom:28px; flex-wrap:wrap; gap:12px;}
.admin-card{background:#fff; border:1px solid var(--line); padding:24px; margin-bottom:24px;}
.admin-table{width:100%; border-collapse:collapse;}
.admin-table th, .admin-table td{padding:12px 10px; border-bottom:1px solid var(--line); text-align:left; font-size:.9rem;}
.admin-table th{font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-soft);}
.status-pill{padding:4px 10px; font-size:.72rem; border-radius:20px; background:#EDE3D8; color:var(--ink-soft); text-transform:capitalize;}
.status-pill.payee{background:#DCEBDD; color:#356B3B;}
.status-pill.expediee{background:#DCE4EB; color:#2E5476;}
.status-pill.annulee{background:#EBDCDC; color:#7A3232;}
.toggle-pill{display:inline-flex; align-items:center; gap:8px; font-size:.85rem;}
.admin-login-wrap{min-height:100vh; display:flex; align-items:center; justify-content:center; background:var(--burgundy);}
.admin-login-box{background:#fff; padding:44px; width:360px; text-align:center;}
.admin-login-box p{text-align:center;}
.stat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.stat-card{background:#fff; border:1px solid var(--line); padding:20px;}
.stat-card .n{font-family:'Cormorant Garamond',serif; font-size:2.1rem; color:var(--burgundy); display:block;}
.stat-card .l{font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-soft);}