:root{
  --red: #E2001A;
  --red-dark: #A8000F;
  --ink: #1E2224;
  --porcelain-blue: #2C5B70;
  --porcelain-blue-light: #DCE9EC;
  --cream: #FAF6EF;
  --paper: #FFFFFF;
  --line: #E4DDD0;
  --muted: #6B6459;
  --radius: 4px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Public Sans', sans-serif;
  color:var(--ink);
  background:var(--cream);
  line-height:1.55;
}
h1,h2,h3,.display{
  font-family:'Fraunces', serif;
  font-weight:600;
  letter-spacing:-0.01em;
  margin:0;
}
a{color:inherit;}
img{max-width:100%;display:block;}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px;}

/* Header */
header.site{
  position:sticky; top:0; z-index:50;
  background:var(--paper);
  border-bottom:1px solid var(--line);
}
.nav{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 24px;max-width:1120px;margin:0 auto;
}
.brand{display:flex;align-items:center;gap:10px;font-family:'Fraunces',serif;font-weight:600;font-size:1.05rem;}
.cross{
  width:26px;height:26px;position:relative;flex:none;
}
.cross::before,.cross::after{
  content:"";position:absolute;background:var(--red);
}
.cross::before{left:40%;top:0;width:20%;height:100%;}
.cross::after{top:40%;left:0;height:20%;width:100%;}
.brand small{display:block;font-family:'Public Sans',sans-serif;font-weight:500;color:var(--muted);font-size:0.68rem;letter-spacing:.03em;text-transform:uppercase;}
nav.links{display:flex;gap:28px;font-size:0.92rem;font-weight:500;}
nav.links a{text-decoration:none;color:var(--ink);opacity:.75;transition:opacity .15s;}
nav.links a:hover{opacity:1;}

/* Overlay pour la lightbox */
.lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.85);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  cursor: pointer;
}
.lightbox.active { display: flex; }
.lightbox img {
  max-width: 90vw;
  max-height: 90vh;
  width: auto;
  height: auto;
  border-radius: 6px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}

/* Hero */
.hero{
  background: linear-gradient(180deg, #fff 0%, var(--cream) 100%);
  border-bottom:1px solid var(--line);
  overflow:hidden;
}
.hero-grid{
  display:grid;grid-template-columns:1.1fr 0.9fr;gap:56px;align-items:center;
  padding:64px 24px 48px;max-width:1120px;margin:0 auto;
}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--porcelain-blue-light);color:var(--porcelain-blue);
  font-size:0.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  padding:6px 12px;border-radius:999px;margin-bottom:18px;
}
.hero h1{font-size:clamp(2.1rem,4vw,3.2rem);line-height:1.06;}
.hero h1 em{font-style:normal;color:var(--red);}
.hero p.lead{margin-top:18px;font-size:1.08rem;color:var(--muted);max-width:46ch;}
.hero-facts{display:flex;gap:28px;margin-top:32px;flex-wrap:wrap;}
.fact b{display:block;font-family:'Fraunces',serif;font-size:1.3rem;}
.fact span{font-size:0.8rem;color:var(--muted);}
.hero-cta{margin-top:34px;display:flex;gap:14px;flex-wrap:wrap;}
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:13px 24px;border-radius:999px;font-weight:600;font-size:0.92rem;
  text-decoration:none;cursor:pointer;border:1.5px solid transparent;transition:transform .12s ease;
}
.btn:active{transform:scale(.97);}
.btn-primary{background:var(--red);color:#fff;}
.btn-primary:hover{background:var(--red-dark);}
.btn-ghost{border-color:var(--ink);color:var(--ink);background:transparent;}

/* Jar illustration */
.jar-art{display:flex;justify-content:center;}
.jar-svg{width:100%;max-width:320px;}

/* Catalogue */
.catalog{padding:64px 24px;}
.catalog-head{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:16px;margin-bottom:28px;}
.catalog-head h2{font-size:1.7rem;}

.product-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 20px;
}
.product-card {
  background-color: #eeeeee;
  border: 1px solid #d0d0d0;
  border-radius: 8px;
  padding: 12px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.12);
  overflow: hidden;
  width: 100%;
  box-sizing: border-box;
  min-width: 0;
  text-align: center;
}
.product-card img {
  width: 200px;
  height: auto;
  display: block;
  margin: 0 auto;
  border-radius: 5px;
  cursor: pointer;
}
.product-tag{font-size:0.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--porcelain-blue);font-weight:700;display:block;margin-top:8px;}
.product-meta{font-size:0.82rem;color:var(--muted);}
.product-price{font-family:'Fraunces',serif;font-size:1.15rem;margin-top:4px;}
.stock{font-size:0.85rem;font-weight:600;margin-top:4px;}
.stock.is-disponible{color:#1a7a3c;}
.stock.is-vendu{color:var(--red);}

/* Practical info */
.info{padding:56px 24px;background:var(--porcelain-blue);color:#fff;}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;max-width:1000px;margin:0 auto;align-items:start;}
.info h2{font-size:1.5rem;color:#fff;}
.info-list{list-style:none;padding:0;margin-top:18px;display:flex;flex-direction:column;gap:14px;}
.info-list li{display:flex;gap:12px;font-size:0.95rem;}
.info-list b{display:block;}
.info-list .dot{width:8px;height:8px;border-radius:50%;background:#fff;margin-top:7px;flex:none;}
.map-frame{border-radius:var(--radius);overflow:hidden;border:1px solid rgba(255,255,255,.25);}

footer{padding:34px 24px;text-align:center;color:var(--muted);font-size:0.82rem;background:var(--ink);color:#cfcac0;}
footer b{color:#fff;}

@media (max-width:820px){
  .hero-grid{grid-template-columns:1fr;padding-top:36px;}
  .jar-art{order:-1;max-width:200px;margin:0 auto;}
  .info-grid{grid-template-columns:1fr;}
  nav.links{display:none;}
}