/* ═══════════════════════════════════════════════════════════════
   BLOG — Un Jour d'Or
   CSS partagé entre l'index du blog et les articles
   Hérite de la palette principale, ajoute styles éditoriaux
   ═══════════════════════════════════════════════════════════════ */

:root{
  --gold:#C9A96E; --gold-light:#E8D5A3; --gold-warm:#D8B985; --gold-pale:#FAF5EC;
  --dark:#1A1310; --dark-soft:#2A1F19; --brown:#5C4439;
  --cream:#F4EAD5; --cream-warm:#EFE0C0; --ivory:#FBF5E6;
  --text:#1A1310; --muted:#8C7060; --muted-light:#B5998A;
  --shadow-soft:0 8px 32px rgba(92,68,57,.12);
  --shadow-gold:0 8px 32px rgba(201,169,110,.25);
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;overflow-x:hidden;max-width:100vw;}
body{font-family:'Jost',sans-serif;background:var(--ivory);color:var(--text);overflow-x:hidden;-webkit-font-smoothing:antialiased;line-height:1.6;}

/* Nav blog */
nav.blog-nav{position:fixed;top:0;width:100%;z-index:100;padding:14px 32px;display:flex;align-items:center;justify-content:space-between;background:rgba(251,245,230,.96);border-bottom:1px solid rgba(201,169,110,.15);backdrop-filter:blur(10px);}
nav.blog-nav a.logo{display:flex;align-items:center;text-decoration:none;}
nav.blog-nav a.logo img{height:32px;width:auto;}
nav.blog-nav .nav-links{display:flex;gap:24px;align-items:center;}
nav.blog-nav .nav-links a{font-family:Georgia,serif;font-size:13px;color:var(--brown);text-decoration:none;letter-spacing:1.5px;text-transform:uppercase;transition:color .2s;}
nav.blog-nav .nav-links a:hover{color:var(--gold);}

/* Breadcrumb */
.breadcrumb{padding:88px 32px 0;max-width:880px;margin:0 auto;font-family:Georgia,serif;font-size:13px;color:var(--muted);letter-spacing:1px;}
.breadcrumb a{color:var(--brown);text-decoration:none;transition:color .2s;}
.breadcrumb a:hover{color:var(--gold);}
.breadcrumb .sep{margin:0 8px;color:var(--gold);}

/* ─────────── BLOG INDEX (page liste) ─────────── */
.blog-hero{padding:60px 32px 40px;max-width:880px;margin:0 auto;text-align:center;}
.blog-hero .eyebrow{font-family:Georgia,serif;font-size:13px;letter-spacing:6px;color:var(--gold);text-transform:uppercase;margin-bottom:18px;}
.blog-hero h1{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(42px,6vw,68px);font-weight:300;line-height:1.05;margin-bottom:16px;}
.blog-hero h1 em{color:var(--gold);font-style:italic;}
.blog-hero .lead{font-family:Georgia,serif;font-size:17px;font-style:italic;color:var(--brown);max-width:640px;margin:0 auto;line-height:1.7;}

.articles-grid{max-width:1100px;margin:40px auto 60px;padding:0 32px;display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:32px;}

.article-card{background:white;border:1px solid rgba(201,169,110,.18);overflow:hidden;transition:all .4s cubic-bezier(.22,1,.36,1);text-decoration:none;color:inherit;display:flex;flex-direction:column;}
.article-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-soft);border-color:var(--gold);}
.article-card-image{aspect-ratio:16/9;background:linear-gradient(135deg,var(--cream) 0%,var(--cream-warm) 100%);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;}
.article-card-image .placeholder{font-family:'Cormorant Garamond',serif;font-size:80px;color:rgba(201,169,110,.3);font-style:italic;}
.article-card-image img{width:100%;height:100%;object-fit:cover;}
.article-card-body{padding:24px 22px 28px;flex:1;display:flex;flex-direction:column;}
.article-card-category{font-family:Georgia,serif;font-size:11px;letter-spacing:3px;color:var(--gold);text-transform:uppercase;margin-bottom:10px;}
.article-card-title{font-family:'Cormorant Garamond',Georgia,serif;font-size:24px;font-weight:400;line-height:1.25;margin-bottom:10px;color:var(--text);}
.article-card-excerpt{font-family:Georgia,serif;font-size:14px;color:var(--brown);line-height:1.6;flex:1;}
.article-card-meta{display:flex;justify-content:space-between;align-items:center;margin-top:16px;padding-top:14px;border-top:1px solid rgba(201,169,110,.15);font-family:Georgia,serif;font-size:12px;color:var(--muted);font-style:italic;}
.article-card-cta{color:var(--gold);font-weight:600;}

/* ─────────── ARTICLE (page lecture) ─────────── */
.article-header{padding:50px 32px 30px;max-width:780px;margin:0 auto;text-align:center;}
.article-header .category{font-family:Georgia,serif;font-size:13px;letter-spacing:5px;color:var(--gold);text-transform:uppercase;margin-bottom:18px;}
.article-header h1{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(36px,5vw,56px);font-weight:300;line-height:1.1;margin-bottom:18px;color:var(--text);}
.article-header h1 em{color:var(--gold);font-style:italic;}
.article-header .meta{font-family:Georgia,serif;font-size:14px;color:var(--muted);font-style:italic;letter-spacing:1px;margin-bottom:30px;}
.article-header .meta span{margin:0 8px;color:var(--gold);}
.article-header .ornament{margin:30px auto 0;display:flex;align-items:center;justify-content:center;gap:14px;}
.article-header .ornament::before,.article-header .ornament::after{content:"";height:1px;width:80px;background:linear-gradient(90deg,transparent,var(--gold),transparent);}
.article-header .ornament span{color:var(--gold);font-size:16px;}

.article-content{max-width:720px;margin:0 auto;padding:30px 32px 60px;font-family:Georgia,serif;font-size:17px;color:var(--text);line-height:1.85;}
.article-content p{margin-bottom:20px;}
.article-content p.intro{font-size:19px;font-style:italic;color:var(--brown);margin-bottom:32px;line-height:1.7;}
.article-content h2{font-family:'Cormorant Garamond',Georgia,serif;font-size:32px;font-weight:400;color:var(--text);margin:50px 0 18px;line-height:1.2;}
.article-content h2 em{color:var(--gold);font-style:italic;}
.article-content h3{font-family:'Cormorant Garamond',Georgia,serif;font-size:24px;font-weight:500;color:var(--text);margin:36px 0 14px;}
.article-content ul,.article-content ol{margin:16px 0 24px 0;padding-left:0;list-style:none;}
.article-content ul li{padding:8px 0 8px 28px;position:relative;}
.article-content ul li::before{content:"✦";position:absolute;left:0;top:8px;color:var(--gold);font-size:12px;}
.article-content ol{counter-reset:item;padding-left:0;}
.article-content ol li{counter-increment:item;padding:8px 0 8px 36px;position:relative;}
.article-content ol li::before{content:counter(item) ".";position:absolute;left:0;top:8px;color:var(--gold);font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;font-size:18px;}
.article-content strong{color:var(--text);font-weight:600;}
.article-content blockquote{border-left:3px solid var(--gold);padding:18px 24px;margin:30px 0;background:var(--cream);font-style:italic;color:var(--brown);font-size:18px;line-height:1.7;}
.article-content a{color:var(--gold);text-decoration:underline;text-underline-offset:3px;transition:color .2s;}
.article-content a:hover{color:var(--brown);}
.article-content .key-box{background:var(--cream-warm);border-left:3px solid var(--gold);padding:24px 26px;margin:32px 0;}
.article-content .key-box h4{font-family:'Cormorant Garamond',serif;font-size:20px;color:var(--text);margin-bottom:10px;font-weight:500;}

/* CTA en bas d'article */
.article-cta{background:var(--dark);color:var(--cream);padding:60px 32px;text-align:center;margin-top:40px;}
.article-cta h3{color:var(--cream);font-family:'Cormorant Garamond',serif;font-size:clamp(28px,4vw,40px);font-weight:300;margin-bottom:12px;}
.article-cta h3 em{color:var(--gold);font-style:italic;}
.article-cta p{font-family:Georgia,serif;font-style:italic;color:var(--muted-light);font-size:15px;margin-bottom:28px;max-width:520px;margin-left:auto;margin-right:auto;}
.cta-button{display:inline-block;background:var(--gold);color:var(--dark);padding:16px 38px;font-family:'Jost',sans-serif;font-size:11px;letter-spacing:4px;text-transform:uppercase;font-weight:600;text-decoration:none;transition:all .3s;border:1px solid var(--gold);}
.cta-button:hover{background:transparent;color:var(--gold);box-shadow:var(--shadow-gold);}

/* Articles similaires */
.related-section{background:var(--cream);padding:50px 32px;}
.related-section .wrap{max-width:1100px;margin:0 auto;}
.related-section h3{font-family:'Cormorant Garamond',serif;font-size:28px;color:var(--text);margin-bottom:24px;font-weight:400;text-align:center;}
.related-section h3 em{color:var(--gold);font-style:italic;}
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;}

/* Footer minimal blog */
footer.blog-footer{background:var(--dark-soft);color:var(--muted-light);padding:36px 32px;text-align:center;font-family:Georgia,serif;font-size:13px;line-height:1.8;}
footer.blog-footer a{color:var(--gold);text-decoration:none;}

/* Mobile */
@media (max-width:720px){
  nav.blog-nav{padding:12px 16px;}
  nav.blog-nav .nav-links{gap:14px;}
  nav.blog-nav .nav-links a{font-size:11px;letter-spacing:1px;}
  .breadcrumb{padding:78px 18px 0;font-size:12px;}
  .blog-hero{padding:40px 18px 30px;}
  .articles-grid{padding:0 18px;gap:22px;grid-template-columns:1fr;}
  .article-header{padding:40px 18px 20px;}
  .article-content{padding:20px 18px 40px;font-size:16px;}
  .article-content h2{font-size:26px;margin:36px 0 14px;}
  .article-content h3{font-size:20px;margin:28px 0 12px;}
  .article-cta{padding:50px 18px;}
  .related-section{padding:40px 18px;}
  .related-grid{grid-template-columns:1fr;}
}