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

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#f8faf9;--text:#1d2326;--accent:#0f6b4c;--accent-d:#0a4f38;
  --muted:#5c6b6f;--border:#dde4e1;--surface:#edf2ef;
  --max-w:1060px;--ui:'DM Sans',-apple-system,sans-serif;--body:'Lora',Georgia,serif;
}
html{font-size:16px;scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--body);line-height:1.85}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-d);text-decoration:underline}
img{max-width:100%;height:auto;display:block}

/* NAV — minimal, not sticky */
.site-nav{padding:1.25rem 1.5rem;border-bottom:1px solid var(--border);background:var(--bg)}
.nav-inner{max-width:var(--max-w);margin:0 auto;display:flex;align-items:center;justify-content:space-between}
.nav-logo{font-family:var(--ui);font-weight:700;font-size:1.35rem;color:var(--text);letter-spacing:-0.01em}
.nav-logo em{color:var(--accent);font-style:normal}
.nav-links{display:flex;gap:2rem;list-style:none}
.nav-links a{font-family:var(--ui);font-size:0.83rem;font-weight:500;color:var(--muted);letter-spacing:0.03em;transition:color .15s}
.nav-links a:hover{color:var(--accent);text-decoration:none}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:4px}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--text);margin:5px 0}

/* EDITORIAL BANNER — text only, no image */
.editorial-banner{background:var(--bg);padding:4rem 1.5rem 3rem;text-align:center;border-bottom:1px solid var(--border)}
.banner-eyebrow{font-family:var(--ui);font-size:0.72rem;font-weight:600;text-transform:uppercase;letter-spacing:0.14em;color:var(--accent);margin-bottom:1.25rem}
.banner-headline{font-family:var(--body);font-size:2.6rem;font-weight:600;color:var(--text);line-height:1.18;max-width:680px;margin:0 auto 1.25rem;font-style:italic}
.banner-rule{width:48px;height:3px;background:var(--accent);margin:0 auto 1.25rem;border-radius:2px}
.banner-sub{font-family:var(--ui);font-size:1rem;color:var(--muted);max-width:520px;margin:0 auto;line-height:1.65}

/* MAIN / FEED */
.site-main{max-width:var(--max-w);margin:0 auto;padding:3rem 1.5rem}
.feed-label{font-family:var(--ui);font-size:0.7rem;font-weight:600;text-transform:uppercase;letter-spacing:0.14em;color:var(--accent);margin-bottom:2rem;padding-bottom:0.5rem;border-bottom:1px solid var(--border)}

.post-list{display:flex;flex-direction:column;gap:0}
.post-row{display:grid;grid-template-columns:240px 1fr;gap:1.75rem;padding:2rem 0;border-bottom:1px solid var(--border);align-items:start}
.post-row:first-child{padding-top:0}
.post-thumb{width:240px;height:150px;object-fit:cover;border-radius:4px;flex-shrink:0}
.post-tag{font-family:var(--ui);font-size:0.68rem;font-weight:600;text-transform:uppercase;letter-spacing:0.1em;color:var(--accent);margin-bottom:0.4rem}
.post-title{font-family:var(--body);font-size:1.2rem;font-weight:600;color:var(--text);line-height:1.3;margin-bottom:0.6rem}
.post-title a{color:var(--text)}
.post-title a:hover{color:var(--accent);text-decoration:none}
.post-excerpt{font-family:var(--ui);font-size:0.9rem;color:var(--muted);line-height:1.6;margin-bottom:0.75rem}
.post-meta{font-family:var(--ui);font-size:0.75rem;color:var(--muted)}
.read-more{font-family:var(--ui);font-size:0.82rem;font-weight:600;color:var(--accent);display:inline-block;margin-top:0.4rem}

/* ARTICLE PAGES */
.article-header{max-width:680px;margin:2.5rem auto 0;padding:0 1.5rem}
.article-tag{font-family:var(--ui);font-size:0.7rem;font-weight:600;text-transform:uppercase;letter-spacing:0.12em;color:var(--accent);margin-bottom:0.6rem}
.article-title{font-family:var(--body);font-size:1.9rem;font-weight:600;color:var(--text);line-height:1.2;margin-bottom:0.65rem;font-style:italic}
.article-sub{font-family:var(--ui);font-size:0.97rem;color:var(--muted);line-height:1.6;margin-bottom:1rem}
.article-meta{font-family:var(--ui);font-size:0.77rem;color:var(--muted);display:flex;gap:1.25rem;flex-wrap:wrap;margin-bottom:2rem}
.article-meta strong{color:var(--text)}

/* full-bleed hero */
.article-hero-wrap{width:100%;margin:0 0 0;overflow:hidden}
.article-hero-img{width:100%;height:440px;object-fit:cover;object-position:center}

/* prose */
.article-body{max-width:680px;margin:2.5rem auto;padding:0 1.5rem 3rem}
.disclosure{background:#fef9e7;border-left:3px solid #d4a017;padding:0.8rem 1.1rem;font-family:var(--ui);font-size:0.79rem;color:#7a5a00;line-height:1.5;margin-bottom:2rem;border-radius:0 4px 4px 0}
.article-body h2{font-family:var(--ui);font-size:1.15rem;font-weight:700;color:var(--text);margin:2.25rem 0 0.6rem;padding-top:0.5rem;border-top:1px solid var(--border)}
.article-body h3{font-family:var(--ui);font-size:1rem;font-weight:600;color:var(--text);margin:1.5rem 0 0.4rem}
.article-body p{font-family:var(--body);font-size:1rem;color:var(--text);margin-bottom:1.35rem;line-height:1.88}
.article-body ul,.article-body ol{padding-left:1.6rem;margin-bottom:1.35rem}
.article-body li{font-family:var(--body);font-size:0.97rem;color:var(--text);margin-bottom:0.5rem;line-height:1.75}
.article-body blockquote{border-left:3px solid var(--accent);padding:0.9rem 1.25rem;background:var(--surface);margin:1.75rem 0;border-radius:0 4px 4px 0}
.article-body blockquote p{font-style:italic;color:var(--muted);margin-bottom:0;font-size:1.02rem}
.inline-img{width:100%;border-radius:4px;margin:1.75rem 0;height:320px;object-fit:cover;object-position:center top}

/* ingredient grid */
.ing-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.5rem 0}
.ing-card{background:var(--surface);border-radius:6px;padding:1.1rem;border-left:3px solid var(--accent)}
.ing-card h4{font-family:var(--ui);font-size:0.9rem;font-weight:700;color:var(--text);margin-bottom:0.3rem}
.ing-card p{font-family:var(--ui);font-size:0.83rem;color:var(--muted);line-height:1.55;margin:0}

/* rating */
.rating-box{background:var(--surface);border-radius:8px;padding:1.5rem;margin:1.75rem 0;border:1px solid var(--border)}
.rating-box h3{font-family:var(--ui);font-size:0.9rem;font-weight:700;color:var(--text);margin-bottom:1rem}
.r-row{display:flex;align-items:center;gap:0.75rem;margin-bottom:0.5rem}
.r-label{font-family:var(--ui);font-size:0.82rem;font-weight:600;color:var(--text);width:150px;flex-shrink:0}
.r-bar{flex:1;background:var(--border);border-radius:99px;height:7px}
.r-fill{height:100%;border-radius:99px;background:var(--accent)}
.r-score{font-family:var(--ui);font-size:0.8rem;font-weight:700;color:var(--accent);width:32px;text-align:right}

/* CTA */
.cta-box{background:var(--accent);border-radius:8px;padding:2.25rem;text-align:center;margin:2rem 0;color:#fff}
.cta-box h3{font-family:var(--ui);font-size:1.2rem;font-weight:700;margin-bottom:0.4rem}
.cta-box p{font-family:var(--ui);font-size:0.9rem;opacity:0.85;line-height:1.6;margin-bottom:1.25rem;max-width:440px;margin-left:auto;margin-right:auto}
.btn-cta{display:inline-block;background:#fff;color:var(--accent-d);font-family:var(--ui);font-weight:700;font-size:0.97rem;padding:0.8rem 2rem;border-radius:5px;transition:all .15s}
.btn-cta:hover{background:var(--surface);color:var(--accent-d);text-decoration:none}
.cta-note{font-family:var(--ui);font-size:0.72rem;opacity:0.65;margin-top:0.65rem}

/* FDA / disclaimer */
.fda{background:var(--surface);border:1px solid var(--border);border-radius:5px;padding:0.9rem 1.1rem;font-family:var(--ui);font-size:0.76rem;color:var(--muted);line-height:1.5;margin:1.75rem 0}

/* author */
.author-box{display:flex;gap:1rem;background:var(--surface);border-radius:8px;padding:1.25rem;margin:2rem 0;border:1px solid var(--border)}
.author-av{width:52px;height:52px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;font-family:var(--ui);font-size:1.1rem;font-weight:700;color:#fff;flex-shrink:0}
.author-name{font-family:var(--ui);font-size:0.9rem;font-weight:700;color:var(--text);margin-bottom:0.2rem}
.author-bio{font-family:var(--ui);font-size:0.82rem;color:var(--muted);line-height:1.55}

/* about / static */
.text-page{max-width:680px;margin:2.5rem auto;padding:0 1.5rem 4rem}
.text-page h1{font-family:var(--body);font-size:1.75rem;font-weight:600;color:var(--text);margin-bottom:0.4rem;font-style:italic}
.text-page .page-date{font-family:var(--ui);font-size:0.78rem;color:var(--muted);margin-bottom:2rem}
.text-page h2{font-family:var(--ui);font-size:1rem;font-weight:700;color:var(--text);margin:1.75rem 0 0.5rem}
.text-page p,.text-page li{font-family:var(--body);font-size:0.96rem;color:var(--text);line-height:1.85;margin-bottom:1rem}
.text-page ul{padding-left:1.5rem}

/* FOOTER — 2 columns */
.site-footer{background:var(--text);color:rgba(255,255,255,0.6);padding:3rem 1.5rem 1.75rem;margin-top:4rem}
.footer-inner{max-width:var(--max-w);margin:0 auto}
.footer-grid{display:grid;grid-template-columns:2fr 1fr;gap:3rem;margin-bottom:2rem}
.footer-brand{font-family:var(--ui);font-size:1.15rem;font-weight:700;color:#fff;margin-bottom:0.6rem}
.footer-brand em{color:#4ade80;font-style:normal}
.footer-desc{font-family:var(--ui);font-size:0.83rem;line-height:1.7;color:rgba(255,255,255,0.5)}
.footer-head{font-family:var(--ui);font-size:0.7rem;font-weight:600;text-transform:uppercase;letter-spacing:0.1em;color:rgba(255,255,255,0.4);margin-bottom:0.9rem}
.footer-links{list-style:none}
.footer-links li{margin-bottom:0.45rem}
.footer-links a{font-family:var(--ui);font-size:0.84rem;color:rgba(255,255,255,0.55);transition:color .15s}
.footer-links a:hover{color:#fff;text-decoration:none}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.08);padding-top:1.25rem;font-family:var(--ui);font-size:0.74rem;color:rgba(255,255,255,0.3);display:flex;justify-content:space-between;flex-wrap:wrap;gap:0.4rem}

@media(max-width:720px){
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:var(--bg);border-bottom:1px solid var(--border);flex-direction:column;padding:1rem 1.5rem;gap:0.9rem;z-index:99}
  .nav-links.open{display:flex}
  .nav-toggle{display:block}
  .site-nav{position:relative}
  .post-row{grid-template-columns:1fr;gap:1rem}
  .post-thumb{width:100%;height:200px}
  .banner-headline{font-size:1.75rem}
  .article-title{font-size:1.45rem}
  .footer-grid{grid-template-columns:1fr}
  .ing-grid{grid-template-columns:1fr}
}
