/* Connected au · Field notes blog styles.
   Pulls in styles.css for base palette + typography variables. */

/* Force a clean white canvas across the entire blog section.
   The site-wide body bg is cream/paper, which reads washed-out on mobile
   for editorial blog content. Blog pages override to pure white. */
body{background:#fff}

/* ===== Blog index ===== */
.blog-index{background:#fff;padding:96px 0 56px;text-align:center;border-bottom:1px solid var(--line)}
.blog-index .label{color:var(--gold-dark);display:block;margin-bottom:18px}
.blog-index h1{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:clamp(44px,5.5vw,72px);line-height:1.04;color:var(--green);margin:0 0 18px}
.blog-index h1 .italic{font-style:italic;color:var(--gold)}
.blog-index .sub{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(17px,1.9vw,21px);color:var(--grey);max-width:580px;margin:0 auto;line-height:1.5}

.blog-grid{background:#fff;padding:64px 0 88px}
.post-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:42px 32px}
.post-card{background:transparent}
.post-card-link{display:block;text-decoration:none;color:inherit;transition:transform .2s}
.post-card-link:hover{transform:translateY(-2px)}
.post-card-img{aspect-ratio:2/3;overflow:hidden;border-radius:4px;background:#f5f0e6}
.post-card-img img{width:100%;height:100%;object-fit:cover;display:block}
.post-card-body{padding:18px 4px 0}
.post-card-cat{font-family:'Montserrat';text-transform:uppercase;letter-spacing:.28em;font-size:10px;font-weight:600;color:var(--gold-dark);display:block;margin-bottom:8px}
.post-card h2{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:22px;line-height:1.18;color:var(--green);margin:0 0 8px}
.post-card p{font-family:'Cormorant Garamond',serif;font-size:15px;line-height:1.5;color:var(--grey);margin:0 0 12px}
.post-card-read{font-family:'Montserrat';text-transform:uppercase;letter-spacing:.2em;font-size:11px;font-weight:600;color:var(--gold-dark)}

.blog-bottom-cta{background:var(--green);color:#fff;padding:88px 0;text-align:center}
.blog-bottom-cta .cta-eyebrow{font-family:'Montserrat';text-transform:uppercase;letter-spacing:.32em;font-size:11px;font-weight:600;color:var(--gold-bright);display:block;margin-bottom:18px}
.blog-bottom-cta h2{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:clamp(40px,5vw,64px);line-height:1.05;color:#fff;margin:0 0 18px}
.blog-bottom-cta h2 .italic{font-style:italic;color:var(--gold-bright)}
.blog-bottom-cta p{font-family:'Cormorant Garamond',serif;font-size:20px;line-height:1.5;color:rgba(255,255,255,.86);max-width:580px;margin:0 auto 30px}

/* ===== Individual post ===== */
.post{background:#fff;padding:0 0 0}
.post-hero-mobile{display:none}
.post-hero-mobile img{width:100%;height:auto;display:block}

.post-wrap{max-width:1200px;margin:0 auto;padding:48px 36px 96px}
.post-grid{display:grid;grid-template-columns:1fr 320px;gap:64px}

.post-back{font-family:'Montserrat';text-transform:uppercase;letter-spacing:.2em;font-size:11px;font-weight:600;color:var(--gold-dark);text-decoration:none;display:inline-block;margin-bottom:36px}
.post-back:hover{color:var(--green)}

.post-category{font-family:'Montserrat';text-transform:uppercase;letter-spacing:.32em;font-size:10px;font-weight:600;color:var(--gold-dark);display:block;margin-bottom:10px}
.post-body h1{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:clamp(36px,4.6vw,56px);line-height:1.06;color:var(--green);margin:0 0 14px}
.post-date{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:15px;color:var(--grey);display:block;margin-bottom:36px}

/* Article body typography */
.post-content{font-family:'Cormorant Garamond',serif;font-size:19px;line-height:1.65;color:var(--ink)}
.post-content h1,.post-content h2{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--green);margin-top:48px;margin-bottom:16px;line-height:1.15}
.post-content h1{font-size:34px}
.post-content h2{font-size:28px}
.post-content h3{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:22px;color:var(--green);margin-top:32px;margin-bottom:10px;line-height:1.2}
.post-content h4{font-family:'Cormorant Garamond',serif;font-weight:600;font-style:italic;font-size:20px;color:var(--green);margin-top:24px;margin-bottom:8px}
.post-content p{margin:0 0 20px}
.post-content strong{color:var(--green);font-weight:600}
.post-content em{font-style:italic;color:var(--ink)}
.post-content ul,.post-content ol{margin:0 0 24px;padding-left:24px}
.post-content li{margin-bottom:10px}
.post-content blockquote{border-left:2px solid var(--gold);padding:6px 0 6px 24px;margin:28px 0;font-style:italic;color:var(--grey)}
.post-content a{color:var(--gold-dark);text-decoration:none;border-bottom:1px solid var(--gold);transition:color .15s}
.post-content a:hover{color:var(--green)}
.post-content hr{border:0;height:1px;background:var(--line);margin:48px auto;width:80px}
.post-content code{font-family:'Montserrat',monospace;font-size:.85em;background:var(--cream);padding:2px 6px;border-radius:2px}

/* Inline section photos */
.post-figure{margin:40px -20px;padding:0}
.post-figure img{width:100%;height:auto;display:block;border-radius:3px}
.post-figure figcaption{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:14px;color:var(--grey);text-align:center;margin-top:10px}

/* Bottom CTA inside the post */
.post-cta{background:var(--green);color:#fff;padding:48px 40px;border-radius:4px;margin-top:64px;text-align:center}
.post-cta .cta-eyebrow{font-family:'Montserrat';text-transform:uppercase;letter-spacing:.32em;font-size:11px;font-weight:600;color:var(--gold-bright);display:block;margin-bottom:14px}
.post-cta h3{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:32px;color:#fff;margin:0 0 14px}
.post-cta p{font-family:'Cormorant Garamond',serif;font-size:18px;line-height:1.55;color:rgba(255,255,255,.86);max-width:480px;margin:0 auto 26px}

/* Desktop side card with the pin + Pinterest save button */
.post-side{position:relative}
.post-pin{position:sticky;top:90px}
.post-pin img{width:100%;height:auto;display:block;border-radius:4px;box-shadow:0 4px 24px rgba(20,43,38,.08)}
.pin-save{display:block;background:#e60023;color:#fff;text-align:center;font-family:'Montserrat';font-weight:600;font-size:12px;letter-spacing:.18em;text-transform:uppercase;padding:14px 16px;border-radius:3px;margin-top:14px;text-decoration:none;transition:background .15s}
.pin-save:hover{background:#c8001f}

/* ===== Responsive ===== */
@media (max-width:900px){
  .post-cards{grid-template-columns:repeat(2,1fr);gap:36px 24px}
  .post-grid{grid-template-columns:1fr;gap:0}
  .post-side{display:none}
  .post-hero-mobile{display:block;margin:0}
  .post-wrap{padding:32px 24px 72px}
  .post-back{margin-top:20px;margin-bottom:24px}
}
@media (max-width:600px){
  .post-cards{grid-template-columns:1fr;gap:48px}
  .blog-index{padding:64px 0 40px}
  .blog-grid{padding:48px 0 64px}
  .blog-bottom-cta{padding:64px 0}
  .post-content{font-size:18px}
  .post-cta{padding:36px 22px}
  .post-figure{margin:32px 0}
}
