
/* Meal Prep Systems - Clean Healthy Style */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
    --brand: #2d5a27;
    --accent: #7cb342;
    --light-bg: #f1f8e9;
    --white: #ffffff;
    --text: #1b5e20;
    --muted: #558b2f;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body {
    font-family: 'Inter', -apple-system, sans-serif;
    background: var(--white);
    color: var(--text);
    line-height: 1.6;
}

.container { max-width: 1200px; margin: 0 auto; padding: 0 25px; }

/* Simple top navigation */
header {
    background: var(--white);
    border-bottom: 2px solid var(--light-bg);
    padding: 20px 0;
}
header .container { display: flex; justify-content: space-between; align-items: center; }
header h1 a { color: var(--brand); text-decoration: none; font-size: 1.4em; font-weight: 700; }
header nav { display: flex; gap: 25px; }
header nav a { color: var(--muted); text-decoration: none; font-weight: 500; }
header nav a:hover { color: var(--brand); }

main { padding: 50px 0; }

/* Hero - Clean white with green border */
.hero {
    background: var(--white);
    border: 2px solid var(--accent);
    border-radius: 16px;
    padding: 60px 50px;
    margin-bottom: 50px;
}
.hero h2 { font-size: 2.5em; color: var(--brand); margin-bottom: 15px; }
.hero p { font-size: 1.15em; color: var(--muted); margin-bottom: 25px; max-width: 600px; }
.hero a { display: inline-block; background: var(--brand); color: white; padding: 14px 35px; border-radius: 8px; text-decoration: none; font-weight: 600; }

/* Article grid - 3 column neat grid */
.articles-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
.article-card {
    background: var(--light-bg);
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.2s;
}
.article-card:hover { transform: translateY(-4px); }
.article-card .card-image {
    height: 140px;
    background: var(--brand);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 2.5em;
}
.article-card .card-body { padding: 20px; }
.article-card h3 { margin: 0 0 10px 0; font-size: 1.1em; }
.article-card h3 a { color: var(--brand); text-decoration: none; }
.article-card p { color: var(--muted); margin: 0 0 12px 0; font-size: 0.9em; }
.article-card .read-more { color: var(--accent); text-decoration: none; font-weight: 600; font-size: 0.9em; }

/* Content elements */
.pro-tip { border-left: 3px solid var(--brand); background: var(--light-bg); padding: 18px; margin: 22px 0; border-radius: 0 8px 8px 0; }
.highlight-box { background: var(--light-bg); border: 1px solid var(--accent); border-radius: 8px; padding: 15px; margin: 20px 0; }
blockquote { border-left: 3px solid var(--accent); padding-left: 18px; font-style: italic; color: var(--muted); margin: 22px 0; }

/* Footer */
footer {
    background: var(--brand);
    color: white;
    padding: 45px 0;
    margin-top: 70px;
}
footer .container { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; }
footer a { color: rgba(255,255,255,0.85); text-decoration: none; }
.social-links a { display: inline-block; margin-left: 12px; padding: 8px 18px; border: 1px solid rgba(255,255,255,0.3); border-radius: 6px; color: white; }

@media (max-width: 900px) {
    .articles-grid { grid-template-columns: 1fr; }
}

/* 2026-04-15 修复图片溢出与卡片布局 */
.card-image, .card-image-wrap { overflow:hidden; border-radius:10px; background:#f0f0f0; }
.card-image img, .card-image-wrap img { display:block; width:100%; height:100%; object-fit:cover; max-width:100%; }
.article-image, figure.article-image { overflow:hidden; border-radius:12px; margin:1.2rem 0; }
.article-image img, figure.article-image img { display:block; width:100%; max-width:100%; height:auto; object-fit:cover; }
.full-article img { display:block; width:100%; max-width:100%; height:auto; object-fit:cover; border-radius:10px; margin:.8rem 0; }
.articles-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:1.2rem; }
.article-card { background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 2px 10px rgba(0,0,0,.06); transition:box-shadow .2s, transform .2s; }
.article-card:hover { transform:translateY(-3px); box-shadow:0 5px 18px rgba(0,0,0,.12); }
.card-body { padding:1rem 1.1rem; }
.pagination { display:flex; flex-wrap:wrap; gap:.6rem; justify-content:center; margin:1.5rem 0; }
.pagination a { padding:.5rem .8rem; border-radius:999px; background:#f4f4f4; text-decoration:none; font-size:.9rem; }
.pagination .current { background:#1a3a4a; color:#fff; font-weight:700; }


/* 2026-04-15 hardening: consistent card media + trust page layout */
.card-media{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:12px 12px 0 0;background:#ececec;}
.card-media img{display:block;width:100%;height:100%;object-fit:cover;max-width:100%;}
.article-card{display:flex;flex-direction:column;height:100%;}
.article-card .card-body{display:flex;flex-direction:column;gap:.7rem;flex:1;}
.article-card .read-more{margin-top:auto;}
.full-article img, .article-image img, figure.article-image img{display:block;width:100%;max-width:100%;height:auto;object-fit:cover;border-radius:12px;}
.page-hero{padding:2.4rem 0 1.2rem;}
.page-hero h1{margin:0 0 .5rem;}
.page-hero p{max-width:760px;opacity:.88;}
.articles-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.25rem;align-items:stretch;}
.pagination{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin:1.8rem 0 0;}
.pagination a{padding:.5rem .85rem;border-radius:999px;background:#f4f4f4;text-decoration:none;font-size:.92rem;}
.pagination .current{background:#1a3a4a;color:#fff;font-weight:700;}
.trust-shell{max-width:980px;margin:2rem auto;background:#fff;border-radius:16px;box-shadow:0 6px 24px rgba(0,0,0,.06);overflow:hidden;}
.trust-hero{padding:2rem 2rem 1.2rem;border-bottom:1px solid rgba(0,0,0,.08);}
.trust-hero p{margin-top:.65rem;max-width:720px;color:#666;}
.trust-body{padding:1.2rem 2rem 2rem;display:grid;gap:1rem;}
.trust-block{background:#fafafa;border:1px solid rgba(0,0,0,.08);border-radius:12px;padding:1rem 1.1rem;}
.trust-block h2{margin:0 0 .55rem;}
.calc-shell{max-width:760px;margin:2rem auto;background:#fff;border-radius:16px;box-shadow:0 6px 24px rgba(0,0,0,.06);padding:2rem;}
.calc-shell p{color:#666;margin:.4rem 0 1rem;}
@media (max-width: 768px){.trust-shell{margin:1rem auto;}.trust-hero,.trust-body,.calc-shell{padding:1.2rem;}}


/* 2026-04-15 hardening v2: article/layout consistency */
.card-media{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:14px 14px 0 0;background:#e9ecef;}
.card-media img{display:block;width:100%;height:100%;object-fit:cover;}
.article-card{display:flex;flex-direction:column;height:100%;overflow:hidden;}
.article-card .card-body{display:flex;flex-direction:column;gap:.75rem;flex:1;}
.article-card .read-more{margin-top:auto;}
.article-card p{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;}
.article-page{max-width:940px;margin:0 auto;}
.article-heading{margin-bottom:1.25rem;}
.article-heading h1{font-size:clamp(2rem,4vw,3rem);line-height:1.12;margin:0 0 .6rem;}
.article-subtitle{font-size:1.06rem;line-height:1.7;color:#6c757d;max-width:780px;}
.article-hero-media{max-width:780px;margin:1.25rem auto 1.6rem;}
.article-hero-media figure{margin:0;}
.article-hero-media .article-image{margin:0;overflow:hidden;border-radius:16px;background:#eef1f4;aspect-ratio:16/10;}
.article-hero-media .article-image img{display:block;width:100%;height:100%;object-fit:cover;}
.article-hero-media figcaption{font-size:.92rem;color:#7a7a7a;margin-top:.55rem;text-align:center;}
.full-article{max-width:820px;margin:0 auto;}
.full-article img, .article-image img, figure.article-image img{display:block;width:100%;max-width:100%;height:100%;object-fit:cover;border-radius:14px;}
.full-article .article-image, .full-article figure.article-image{max-width:780px;margin:1.4rem auto;overflow:hidden;aspect-ratio:16/10;background:#eef1f4;border-radius:16px;}
.full-article p, .full-article li{font-size:1.03rem;line-height:1.9;}
.full-article h2{margin:2rem 0 .8rem;line-height:1.25;}
.full-article h3{margin:1.4rem 0 .6rem;line-height:1.3;}
.page-hero{padding:2.4rem 0 1.3rem;}
.page-hero h1{margin:0 0 .5rem;}
.page-hero p{max-width:780px;opacity:.9;line-height:1.75;}
.articles-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.3rem;align-items:stretch;}
.pagination{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin:2rem 0 0;}
.pagination a{padding:.55rem .9rem;border-radius:999px;background:#f4f4f4;text-decoration:none;font-size:.92rem;}
.pagination .current{background:#1a3a4a;color:#fff;font-weight:700;}
.trust-shell{max-width:1000px;margin:2rem auto;background:#fff;border-radius:18px;box-shadow:0 8px 30px rgba(0,0,0,.06);overflow:hidden;}
.trust-hero{padding:2.1rem 2rem 1.2rem;border-bottom:1px solid rgba(0,0,0,.08);}
.trust-hero p{margin-top:.7rem;max-width:760px;color:#666;line-height:1.8;}
.trust-body{padding:1.2rem 2rem 2rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;}
.trust-block{background:#fafafa;border:1px solid rgba(0,0,0,.08);border-radius:14px;padding:1.1rem 1.2rem;}
.trust-block h2{margin:0 0 .55rem;line-height:1.25;}
.trust-block p{line-height:1.8;}
.calc-shell{max-width:920px;margin:2rem auto;background:#fff;border-radius:18px;box-shadow:0 8px 30px rgba(0,0,0,.06);overflow:hidden;}
.calc-hero{padding:2rem 2rem 1rem;border-bottom:1px solid rgba(0,0,0,.08);}
.calc-hero p{color:#666;max-width:760px;line-height:1.75;}
.calc-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:0;}
.calc-main{padding:1.6rem 2rem 2rem;}
.calc-side{padding:1.6rem 2rem 2rem;background:#f8faf8;border-left:1px solid rgba(0,0,0,.06);}
.calc-note{background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:14px;padding:1rem 1.1rem;line-height:1.75;}
.footer-columns{display:grid;grid-template-columns:1.3fr .9fr .9fr;gap:2rem;align-items:start;width:100%;}
.footer-columns ul{list-style:none;padding:0;margin:.6rem 0 0;display:grid;gap:.45rem;}
.footer-note{width:100%;padding-top:1rem;margin-top:1rem;border-top:1px solid rgba(255,255,255,.16);font-size:.9rem;opacity:.9;}
@media (max-width: 900px){.trust-body,.calc-grid,.footer-columns{grid-template-columns:1fr;}.calc-side{border-left:0;border-top:1px solid rgba(0,0,0,.06);}}
@media (max-width: 768px){.trust-shell,.calc-shell{margin:1rem auto;}.trust-hero,.trust-body,.calc-hero,.calc-main,.calc-side{padding:1.2rem;}}


/* 2026-04-15 final polish */
body.theme-mealprep{display:block !important;}
body.theme-mealprep header, body.theme-mealprep footer{width:auto !important;height:auto !important;position:relative !important;overflow:visible !important;}
body.theme-mealprep main{display:block !important;flex:none !important;}
body.theme-mealprep footer{background:#24461f !important;color:#f5faee !important;}
body.theme-mealprep footer a, body.theme-mealprep .footer-columns h3, body.theme-mealprep .footer-note, body.theme-mealprep footer p{color:#f5faee !important;}
body.theme-mealprep .footer-note{border-top:1px solid rgba(245,250,238,.2) !important;}
body.theme-mealprep .trust-body{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
body.theme-mealprep .full-article img{height:auto !important;}
body.theme-mealprep .full-article .article-image img, body.theme-mealprep .article-hero-media .article-image img{height:100% !important;}


/* 2026-04-15 reference-grade repair */
body.theme-sourdough, body.theme-drone, body.theme-mealprep { display:block !important; }
body.theme-sourdough main, body.theme-drone main, body.theme-mealprep main { display:block !important; flex:none !important; width:auto !important; max-width:none !important; }
body.theme-sourdough header, body.theme-sourdough footer,
body.theme-drone header, body.theme-drone footer,
body.theme-mealprep header, body.theme-mealprep footer { width:auto !important; height:auto !important; position:relative !important; overflow:visible !important; }
body.theme-sourdough .article-page, body.theme-drone .article-page, body.theme-mealprep .article-page,
body.theme-sourdough .full-article, body.theme-drone .full-article, body.theme-mealprep .full-article { max-width:820px !important; margin:0 auto !important; width:100% !important; background:transparent !important; }
body.theme-sourdough .article-heading, body.theme-drone .article-heading, body.theme-mealprep .article-heading { background:transparent !important; width:100% !important; }
body.theme-sourdough .article-hero-media, body.theme-drone .article-hero-media, body.theme-mealprep .article-hero-media { max-width:780px !important; margin:1.25rem auto 1.6rem !important; overflow:hidden !important; }
body.theme-sourdough .article-hero-media .article-image, body.theme-drone .article-hero-media .article-image, body.theme-mealprep .article-hero-media .article-image,
body.theme-sourdough .full-article figure.article-image, body.theme-drone .full-article figure.article-image, body.theme-mealprep .full-article figure.article-image { aspect-ratio:16/10 !important; overflow:hidden !important; border-radius:16px !important; background:#eef1f4 !important; }
body.theme-sourdough .article-hero-media .article-image img, body.theme-drone .article-hero-media .article-image img, body.theme-mealprep .article-hero-media .article-image img,
body.theme-sourdough .full-article figure.article-image img, body.theme-drone .full-article figure.article-image img, body.theme-mealprep .full-article figure.article-image img { width:100% !important; height:100% !important; max-width:100% !important; object-fit:cover !important; display:block !important; }
body.theme-sourdough .full-article img:not(.logo), body.theme-drone .full-article img:not(.logo), body.theme-mealprep .full-article img:not(.logo) { max-width:100% !important; height:auto !important; }
body.theme-sourdough footer, body.theme-drone footer, body.theme-mealprep footer { color:#f7f4ef !important; }
body.theme-sourdough footer a, body.theme-sourdough footer p, body.theme-sourdough .footer-columns h3, body.theme-sourdough .footer-note,
body.theme-drone footer a, body.theme-drone footer p, body.theme-drone .footer-columns h3, body.theme-drone .footer-note,
body.theme-mealprep footer a, body.theme-mealprep footer p, body.theme-mealprep .footer-columns h3, body.theme-mealprep .footer-note { color:#f7f4ef !important; }
body.theme-sourdough footer { background:#3d2914 !important; }
body.theme-drone footer { background:#122538 !important; }
body.theme-mealprep footer { background:#24461f !important; }
body.theme-sourdough .footer-note, body.theme-drone .footer-note, body.theme-mealprep .footer-note { border-top:1px solid rgba(255,255,255,.22) !important; }
.page-content { background:#fff; padding:60px; border-radius:8px; max-width:900px; margin:0 auto; }
.page-content h1 { font-size:36px; margin-bottom:30px; color:#2c3e50; }
.page-content h2 { font-size:24px; margin-top:30px; margin-bottom:15px; color:#2c3e50; }
.page-content p { margin-bottom:20px; line-height:1.8; }
.page-content ul { margin:0 0 20px 24px; line-height:1.8; }
.page-content li { margin-bottom:8px; }
@media (max-width:768px){ .page-content{padding:30px 20px;} .page-content h1{font-size:28px;} }


.back-home-wrap { margin-top: 2.25rem; text-align: center; }
.back-home-btn { display: inline-block; padding: 0.85rem 1.35rem; border-radius: 999px; text-decoration: none; font-weight: 600; border: 2px solid #7cb342; color: #2d5a27; background: #f1f8e9; transition: all 0.2s ease; }
.back-home-btn:hover { background: #7cb342; color: #fff; }
