/* =========================================================
   GERGOVIA® — feuille de style partagée
   Palette : noir / doré laiton / crème
   Typo    : Playfair Display (titres) + Poppins (texte)
   ========================================================= */

:root{
  --gold:#c8a24a;
  --gold-soft:#e3cd8f;
  --black:#0c0c0c;
  --black-2:#141414;
  --cream:#f4f1ea;
  --text-dark:#262320;
  --text-muted:#8a7c63;
  --form-brown:rgba(58,46,38,.62);
  --maxw:1100px;
  --serif:'Playfair Display',Georgia,serif;
  --sans:'Poppins',-apple-system,Arial,sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}

body{
  font-family:var(--sans);
  font-weight:300;
  line-height:1.65;
  color:var(--text-dark);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;display:block}
a{color:inherit}

/* ---------- Navigation ---------- */
.nav{
  position:sticky;top:0;z-index:1000;
  background:var(--black);
  border-bottom:1px solid rgba(200,162,74,.4);
  display:flex;justify-content:center;flex-wrap:wrap;gap:6px 28px;
  padding:18px 20px;
}
.nav a{
  color:#fff;text-decoration:none;padding:2px 6px;
  font-size:.78rem;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;
  transition:color .25s;
}
.nav a:hover,.nav a.is-active{color:var(--gold)}

/* ---------- Filigrane logo (sections sombres) ---------- */
.dark{position:relative;background:var(--black);color:#fff;overflow:hidden}
.dark .watermark{
  position:absolute;top:50%;left:50%;
  width:min(560px,85%);transform:translate(-50%,-50%);
  opacity:.06;pointer-events:none;user-select:none;
}
.dark > .inner{position:relative;z-index:1}

/* ---------- Boutons ---------- */
.btn{
  display:inline-block;text-decoration:none;
  font-weight:600;letter-spacing:1px;text-transform:uppercase;font-size:.82rem;
  padding:13px 30px;border-radius:4px;transition:.25s;
}
.btn-gold{background:var(--gold);color:#1a1407}
.btn-gold:hover{background:var(--gold-soft)}
.btn-ghost{background:rgba(0,0,0,.55);color:var(--gold);border:1px solid rgba(200,162,74,.6)}
.btn-ghost:hover{background:rgba(0,0,0,.75)}

/* ---------- Titres ---------- */
.kicker{
  font-family:var(--serif);font-weight:700;color:var(--gold);
  letter-spacing:4px;text-transform:uppercase;font-size:1rem;
}
.h-serif{font-family:var(--serif);font-weight:700;line-height:1.15}

/* séparateur astérisque */
.sep{color:var(--gold);font-size:1.6rem;text-align:center;margin:34px 0}

/* ---------- Footer ---------- */
.footer{
  background:var(--black);color:#7b7b7b;text-align:center;
  padding:30px 20px;font-size:.82rem;border-top:1px solid #1e1e1e;
}
.footer a{color:#9a9a9a;text-decoration:none}
.footer a:hover{color:var(--gold)}

/* =========================================================
   ACCUEIL
   ========================================================= */
.hero{background:var(--black);color:#fff;text-align:center;padding:46px 20px 0}
.hero h1{
  font-family:var(--serif);font-weight:700;color:#fff;
  font-size:clamp(1.7rem,4.4vw,3rem);line-height:1.2;
  letter-spacing:1px;text-transform:uppercase;
  max-width:900px;margin:16px auto 26px;
}
.hero-figure{position:relative}
.hero-figure img{width:100%;height:clamp(280px,42vw,520px);object-fit:cover;display:block}
.hero-figure .btn{
  position:absolute;left:50%;bottom:26px;transform:translateX(-50%);
  line-height:1.2;white-space:nowrap;
}

.concept{max-width:820px;margin:0 auto;text-align:center;padding:70px 20px}
.concept p{
  font-family:var(--sans);font-weight:300;
  font-size:clamp(1.5rem,3.4vw,2.4rem);line-height:1.4;color:var(--text-muted);
}

.exigence{padding:80px 20px}
.exigence .inner{max-width:var(--maxw);margin:0 auto}
.exigence h2{
  font-family:var(--serif);font-weight:700;color:var(--gold);
  font-size:clamp(1.4rem,2.6vw,1.9rem);text-transform:uppercase;margin-bottom:34px;
}
.exigence-row{display:flex;gap:48px;align-items:flex-start;flex-wrap:wrap}
.exigence .col{flex:1;min-width:300px}
.exigence img{border-radius:6px;width:100%;object-fit:cover}
.exigence p{color:#d9d4cb;margin-bottom:14px;font-size:.98rem}

/* =========================================================
   CATALOGUE
   ========================================================= */
.cat-header{text-align:center;padding:70px 20px 40px}
.cat-header h1{
  font-family:var(--serif);font-weight:700;color:var(--gold);
  font-size:clamp(1.8rem,4vw,2.6rem);text-transform:uppercase;margin-bottom:18px;
}
.cat-header p{max-width:720px;margin:0 auto;color:#cfc9bd;font-size:.95rem}

.produit{
  max-width:960px;margin:64px auto;padding:0 20px;
  display:flex;gap:46px;align-items:center;flex-wrap:wrap;
}
.produit:nth-child(even){flex-direction:row-reverse}
.produit .ph{flex:0 0 44%;min-width:280px}
.produit .ph img{width:100%;height:300px;object-fit:cover;border-radius:6px}
.produit .info{flex:1;min-width:280px}
.produit h2{
  font-family:var(--serif);font-weight:700;color:var(--gold);
  font-size:clamp(1.4rem,2.6vw,1.9rem);text-transform:uppercase;margin-bottom:12px;
}
.produit .desc{color:#d9d4cb;margin-bottom:16px}
.badges{list-style:none}
.badges li{position:relative;padding-left:26px;margin-bottom:7px;color:#efe9dd;font-size:.92rem}
.badges li::before{content:"✔";position:absolute;left:0;color:var(--gold)}
.utilisation{margin-top:16px;font-size:.84rem;font-style:italic;color:#a59d8c}
.utilisation b{font-style:normal;color:var(--gold-soft)}

/* =========================================================
   ENGAGEMENTS
   ========================================================= */
.eng-top{
  max-width:var(--maxw);margin:70px auto;padding:0 20px;
  display:flex;gap:50px;align-items:center;flex-wrap:wrap;
}
.eng-visuals{flex:1;min-width:300px;display:flex;gap:18px;justify-content:center}
.eng-visuals img{border-radius:10px;object-fit:cover;box-shadow:0 14px 30px rgba(0,0,0,.18)}
.eng-visuals .v1{width:46%;align-self:flex-start}
.eng-visuals .v2{width:42%;align-self:flex-end}
.eng-text{flex:1;min-width:300px}
.eng-text h1{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(2.2rem,5vw,3.4rem);line-height:1.1;text-transform:uppercase;margin-bottom:22px;
}
.eng-text p{font-size:1.08rem;color:#403a32}

.transparence{padding:80px 20px}
.transparence h2{
  font-family:var(--serif);font-weight:700;text-align:center;
  font-size:clamp(1.8rem,4.4vw,2.8rem);text-transform:uppercase;letter-spacing:1px;
  margin-bottom:54px;color:#fff;
}
.pillars{max-width:var(--maxw);margin:0 auto;display:flex;gap:46px;flex-wrap:wrap}
.pillar{flex:1;min-width:260px}
.pillar::before{
  content:"\201C";font-family:Georgia,serif;color:var(--gold);
  font-size:3.4rem;line-height:.6;display:block;margin-bottom:10px;
}
.pillar h3{color:var(--gold);text-transform:uppercase;font-size:1rem;letter-spacing:.5px;margin-bottom:14px}
.pillar p{color:#d4cfc6;font-size:.95rem}

/* =========================================================
   PARTENARIAT
   ========================================================= */
.part-intro{max-width:820px;margin:70px auto;text-align:center;padding:0 20px}
.part-intro h1{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(2rem,5vw,3rem);line-height:1.15;text-transform:uppercase;margin-bottom:18px;
}
.part-intro .sub{text-transform:uppercase;letter-spacing:1px;font-weight:600;font-size:.9rem;color:#5b5346;margin-bottom:22px}
.part-intro p{font-size:1.08rem;color:#403a32}

.part-black{padding:80px 20px;text-align:center}
.part-black .inner{max-width:760px;margin:0 auto}
.part-black h2{font-family:var(--serif);font-weight:700;color:var(--gold);font-size:clamp(1.8rem,4vw,2.4rem);text-transform:uppercase;margin-bottom:22px}
.part-black p{color:#e0dbd2;font-size:1.06rem}

.labels{max-width:980px;margin:74px auto;text-align:center;padding:0 20px}
.labels h2{font-family:var(--serif);font-weight:700;font-size:clamp(1.6rem,4vw,2.3rem);text-transform:uppercase;margin-bottom:46px}
.labels-grid{display:flex;justify-content:center;align-items:center;gap:60px;flex-wrap:wrap}
.labels-grid img{width:160px;height:160px;object-fit:contain}

/* =========================================================
   CONTACT
   ========================================================= */
.contact-wrap{
  max-width:1160px;margin:0 auto;padding:70px 20px 90px;
  display:flex;gap:56px;align-items:center;flex-wrap:wrap;
}
.contact-intro{flex:1;min-width:300px;position:relative;display:flex;flex-direction:column;justify-content:center;min-height:420px}
.contact-intro .watermark{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:440px;max-width:120%;opacity:.07;pointer-events:none;
}
.contact-intro .txt{position:relative;z-index:1;font-weight:600;font-size:clamp(1.3rem,2.8vw,1.9rem);line-height:1.4}
.contact-intro .txt .strong{color:#fff}
.socials{position:relative;z-index:1;margin-top:34px;display:flex;gap:16px}
.socials a{
  width:44px;height:44px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:#1d1d1d;color:#fff;font-size:1.15rem;text-decoration:none;transition:.25s;
}
.socials a:hover{background:var(--gold);color:#1a1407}

.contact-form{
  flex:1;min-width:300px;background:var(--form-brown);
  border:1px solid rgba(200,162,74,.25);border-radius:16px;padding:38px;
  backdrop-filter:blur(2px);
}
.contact-form h2{font-family:var(--serif);font-weight:700;color:var(--gold);font-size:1.8rem;margin-bottom:24px}
.field{margin-bottom:20px}
.field label{display:block;margin-bottom:8px;color:var(--gold);font-size:.9rem;font-weight:600}
.field input,.field textarea{
  width:100%;padding:12px 14px;border-radius:6px;
  background:rgba(0,0,0,.28);border:1px solid #6a5f4e;color:#fff;font:inherit;
}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--gold)}
.btn-submit{
  width:100%;padding:14px;border:none;border-radius:8px;cursor:pointer;
  background:var(--gold);color:#1a1407;font-weight:600;letter-spacing:.5px;font-size:1rem;transition:.25s;
}
.btn-submit:hover{background:var(--gold-soft)}
.form-note{margin-top:14px;font-size:.78rem;color:#a99e89;text-align:center}
.form-banner{
  padding:12px 16px;border-radius:8px;margin-bottom:20px;font-size:.92rem;font-weight:400;
}
.form-banner.is-ok{background:rgba(80,140,80,.18);border:1px solid #5b9c5b;color:#cdeccd}
.form-banner.is-err{background:rgba(170,70,70,.18);border:1px solid #b96a6a;color:#f1cccc}
.gold-bar{height:18px;background:var(--gold)}

/* =========================================================
   MENTIONS LÉGALES
   ========================================================= */
.legal{max-width:920px;margin:0 auto;padding:60px 24px 80px}
.legal h1{
  font-family:var(--serif);font-weight:700;text-align:center;
  font-size:clamp(2.4rem,7vw,4.2rem);margin-bottom:48px;
}
.legal p{margin-bottom:18px;color:#3a352e}
.legal p b{color:#0c0c0c}

/* =========================================================
   BLOG
   ========================================================= */
.blog-header{padding:70px 20px;text-align:center}
.blog-header h1{font-family:var(--serif);font-weight:700;font-size:clamp(2rem,5vw,3rem);text-transform:uppercase;margin:6px 0 14px;color:#fff}
.blog-sub{color:#cfc9bd;max-width:600px;margin:0 auto}

.blog-list{max-width:var(--maxw);margin:60px auto;padding:0 20px;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:34px}
.blog-empty{grid-column:1/-1;text-align:center;color:var(--text-muted);padding:40px 0}
.article-card{display:flex;flex-direction:column;background:#fff;border-radius:10px;overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 8px 22px rgba(0,0,0,.07);transition:transform .25s,box-shadow .25s}
.article-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(0,0,0,.12)}
.card-cover{height:190px;background-size:cover;background-position:center;background-color:#222}
.card-body{padding:22px 24px 26px}
.card-date{font-size:.78rem;color:var(--gold);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px}
.article-card h2{font-family:var(--serif);font-weight:700;font-size:1.3rem;line-height:1.25;margin-bottom:12px;color:var(--text-dark)}
.card-excerpt{color:#555;font-size:.94rem;margin-bottom:16px}
.card-link{color:var(--gold);font-weight:600;font-size:.9rem}

/* Page article */
.article{padding-bottom:60px}
.article-cover{height:clamp(240px,38vw,440px);background-size:cover;background-position:center;background-color:#222}
.article-body{max-width:760px;margin:0 auto;padding:48px 20px 0}
.article-back{display:inline-block;color:var(--gold);text-decoration:none;font-weight:600;font-size:.9rem;margin-bottom:22px}
.article-back:hover{text-decoration:underline}
.article-body h1{font-family:var(--serif);font-weight:700;font-size:clamp(1.8rem,4.5vw,2.7rem);line-height:1.15;color:var(--text-dark);margin-bottom:14px}
.article-date{color:var(--text-muted);font-size:.9rem;margin-bottom:34px}

/* Contenu rédigé par le CM (sortie de l'éditeur) */
.article-content{font-size:1.05rem;line-height:1.75;color:#33302b}
.article-content h2{font-family:var(--serif);font-weight:700;color:var(--gold);font-size:1.6rem;margin:38px 0 14px}
.article-content h3{font-family:var(--serif);font-weight:700;color:var(--text-dark);font-size:1.25rem;margin:28px 0 10px}
.article-content p{margin-bottom:18px}
.article-content ul,.article-content ol{margin:0 0 18px 24px}
.article-content li{margin-bottom:8px}
.article-content a{color:var(--gold);text-decoration:underline}
.article-content blockquote{border-left:4px solid var(--gold);margin:24px 0;padding:6px 0 6px 20px;color:#555;font-style:italic}
.article-content strong{color:var(--text-dark)}

/* Recettes (fiche détail) */
.recipe-meta{display:flex;gap:12px;flex-wrap:wrap;margin:6px 0 28px}
.recipe-meta .chip{background:#f4f1ea;border:1px solid #e7dfca;border-radius:30px;padding:8px 16px;font-size:.85rem;color:#5b5346}
.recipe-meta .chip b{color:var(--gold)}
.recipe-lead{font-size:1.08rem;line-height:1.7;color:#33302b;margin-bottom:24px}
.recipe-cheese{background:#faf7ef;border:1px solid #e7dfca;border-left:4px solid var(--gold);border-radius:8px;padding:14px 18px;margin-bottom:32px;font-size:.96rem}
.recipe-cheese a{color:var(--gold);font-weight:600;text-decoration:underline}
.recipe-cols{display:grid;grid-template-columns:1fr 1.4fr;gap:44px;align-items:start}
.recipe h2{font-family:var(--serif);font-weight:700;color:var(--gold);font-size:1.5rem;margin-bottom:16px}
.recipe-ingredients ul{list-style:none}
.recipe-ingredients li{position:relative;padding-left:22px;margin-bottom:12px;color:#33302b;line-height:1.5}
.recipe-ingredients li::before{content:"";position:absolute;left:0;top:9px;width:8px;height:8px;border-radius:50%;background:var(--gold)}
.recipe-steps ol{margin:0;padding-left:0;list-style:none;counter-reset:step}
.recipe-steps li{position:relative;padding-left:44px;margin-bottom:20px;line-height:1.65;color:#33302b}
.recipe-steps li::before{counter-increment:step;content:counter(step);position:absolute;left:0;top:-2px;width:30px;height:30px;border-radius:50%;background:var(--gold);color:#1a1407;font-weight:600;display:flex;align-items:center;justify-content:center;font-size:.9rem}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media(max-width:760px){
  .exigence-row,.eng-top,.contact-wrap{gap:34px}
  .produit{gap:26px}
  .produit:nth-child(even){flex-direction:column}
  .produit{flex-direction:column}
  .produit .ph{flex:0 0 100%;width:100%}
  .pillars{gap:30px}
  .eng-visuals .v1,.eng-visuals .v2{align-self:auto}
  .hero-figure .btn{font-size:.72rem;padding:11px 18px;letter-spacing:.5px;bottom:16px}
  .exigence-row,.eng-top,.contact-wrap{flex-direction:column}
  .exigence .col,.eng-text,.eng-visuals,.contact-intro,.contact-form{min-width:0;width:100%}
  .recipe-cols{grid-template-columns:1fr;gap:10px}
}
