#page-blog{ background:#fff; }
.bl-topback{ max-width:1120px; margin:0 auto; padding:14px 24px 0; }
.bl-topback button{ display:inline-flex; align-items:center; gap:6px; background:transparent; border:1.5px solid rgba(36,52,71,0.18); color:#243447; padding:7px 16px; border-radius:50px; font-size:0.78rem; font-weight:700; cursor:pointer; font-family:inherit; }
.bl-topback button:hover{ background:#f3f7f1; }
.bl-wrap{ max-width:1120px; margin:0 auto; padding:8px 24px 70px; }
.bl-hero{ padding:34px 0 8px; }
.bl-eyebrow{ font-size:0.7rem; font-weight:800; letter-spacing:0.16em; text-transform:uppercase; color:#7d9e77; margin-bottom:10px; }
.bl-h1{ font-family:Georgia,serif; font-weight:700; color:#243447; font-size:clamp(2rem,4.4vw,2.9rem); margin:0; line-height:1.1; }
.bl-hero-sub{ margin:14px 0 0; font-size:1.05rem; color:#5a6a78; line-height:1.6; max-width:640px; }
.bl-filters{ margin:26px 0 4px; }
.bl-cats{ display:flex; flex-wrap:wrap; gap:8px; }
.bl-catbtn{ font-size:0.78rem; font-weight:700; color:#46566a; background:#fff; border:1.5px solid #e3e8ea; border-radius:999px; padding:8px 15px; cursor:pointer; font-family:inherit; transition:.15s; white-space:nowrap; }
.bl-catbtn:hover{ border-color:#7d9e77; }
.bl-catbtn.bl-caton{ background:#243447; border-color:#243447; color:#fff; }
.bl-activetag{ margin-top:12px; font-size:0.84rem; color:#5a6a78; }
.bl-activetag strong{ color:#243447; }
.bl-clear{ background:none; border:none; color:#2f5d3a; font-weight:800; cursor:pointer; font-family:inherit; font-size:0.82rem; text-decoration:underline; padding:0 0 0 4px; }
.bl-grid{ margin-top:24px; display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:22px; }
.bl-post{ background:#fff; border:1px solid #dde6d8; border-radius:20px; overflow:hidden; box-shadow:0 4px 20px rgba(36,52,71,0.05); display:flex; flex-direction:column; cursor:pointer; transition:transform .18s, box-shadow .18s; }
.bl-post:hover{ transform:translateY(-4px); box-shadow:0 16px 36px rgba(36,52,71,0.10); }
.bl-img{ aspect-ratio:16/9; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.bl-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.bl-img-ph{ background:linear-gradient(135deg,#e7efe4,#dfeaf3); }
.bl-img-ph span{ font-size:2.8rem; }
.bl-post-body{ padding:18px 19px 20px; display:flex; flex-direction:column; flex:1; }
.bl-cat{ align-self:flex-start; font-size:0.63rem; font-weight:800; letter-spacing:0.04em; text-transform:uppercase; color:#4a7a4e; background:rgba(125,164,126,0.15); border-radius:8px; padding:4px 10px; margin-bottom:11px; cursor:pointer; border:none; font-family:inherit; }
.bl-cat:hover{ background:rgba(125,164,126,0.28); }
.bl-post-title{ font-family:Georgia,serif; font-weight:700; font-size:1.18rem; color:#243447; line-height:1.3; margin:0; }
.bl-excerpt{ font-size:0.9rem; color:#5a6a78; line-height:1.55; margin:10px 0 0; }
.bl-meta{ font-size:0.76rem; color:#8a96a2; margin-top:13px; font-weight:600; }
.bl-kws{ display:flex; flex-wrap:wrap; gap:7px; margin-top:13px; }
.bl-kw{ font-size:0.72rem; font-weight:600; color:#5b8db8; background:none; border:none; cursor:pointer; font-family:inherit; padding:0; }
.bl-kw:hover{ text-decoration:underline; }
.bl-read{ margin-top:15px; align-self:flex-start; background:none; border:none; color:#2f5d3a; font-weight:800; font-size:0.86rem; cursor:pointer; font-family:inherit; padding:0; }
.bl-read:hover{ text-decoration:underline; }
.bl-empty{ margin-top:24px; text-align:center; background:#f6f9f5; border:1px dashed #cdd9ce; border-radius:20px; padding:52px 24px; }
.bl-empty-ico{ font-size:2.4rem; }
.bl-empty-t{ font-family:Georgia,serif; font-weight:700; color:#243447; font-size:1.2rem; margin:10px 0 6px; }
.bl-empty-p{ font-size:0.92rem; color:#5a6a78; max-width:440px; margin:0 auto; line-height:1.55; }
.bl-empty-p strong{ color:#243447; }
/* article view */
.bl-article{ max-width:760px; margin:8px auto 0; }
.bl-back{ display:inline-flex; align-items:center; gap:6px; background:transparent; border:1.5px solid rgba(36,52,71,0.18); color:#243447; padding:8px 18px; border-radius:50px; font-size:0.8rem; font-weight:700; cursor:pointer; font-family:inherit; margin:22px 0 6px; }
.bl-back::before{ content:"\2190"; font-weight:700; }
.bl-back:hover{ background:#f3f7f1; }
.bl-img-lg{ aspect-ratio:21/9; border-radius:22px; margin-bottom:24px; }
.bl-img-lg.bl-img-ph span{ font-size:4rem; }
.bl-art-title{ font-family:Georgia,serif; font-weight:700; color:#243447; font-size:clamp(1.8rem,4vw,2.5rem); line-height:1.15; margin:14px 0 0; }
.bl-art-meta{ font-size:0.85rem; color:#8a96a2; font-weight:600; margin-top:12px; padding-bottom:20px; border-bottom:1px solid #eef2f0; }
.bl-art-body{ margin-top:22px; color:#3c4a58; font-size:1.04rem; line-height:1.75; }
.bl-art-body p{ margin:0 0 18px; }
.bl-art-body h3{ font-family:Georgia,serif; font-weight:700; color:#243447; font-size:1.3rem; margin:28px 0 12px; }
.bl-art-body ul{ margin:0 0 18px; padding-left:22px; }
.bl-art-body li{ margin:0 0 8px; }
.bl-art-body strong{ color:#243447; }
.bl-art-kws{ margin-top:28px; padding-top:20px; border-top:1px solid #eef2f0; }
.bl-related{ margin-top:42px; padding-top:30px; border-top:1px solid #eef2f0; }
.bl-related-h{ font-family:Georgia,serif; font-weight:700; color:#243447; font-size:1.3rem; margin-bottom:18px; }
.bl-related-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:16px; }
.bl-rel{ display:flex; flex-direction:column; text-align:left; background:#fff; border:1px solid #dde6d8; border-radius:16px; overflow:hidden; cursor:pointer; padding:0; font-family:inherit; transition:transform .16s, box-shadow .16s; }
.bl-rel:hover{ transform:translateY(-3px); box-shadow:0 12px 26px rgba(36,52,71,0.10); }
.bl-rel-img{ height:98px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.bl-rel-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.bl-rel-ph{ background:linear-gradient(135deg,#e7efe4,#dfeaf3); font-size:1.9rem; }
.bl-rel-body{ padding:12px 13px 14px; display:flex; flex-direction:column; gap:5px; }
.bl-rel-cat{ font-size:0.6rem; font-weight:800; letter-spacing:0.04em; text-transform:uppercase; color:#4a7a4e; }
.bl-rel-title{ font-weight:700; color:#243447; font-size:0.92rem; line-height:1.3; }
.bl-rel-meta{ font-size:0.72rem; color:#8a96a2; }
.bl-cta{ margin-top:40px; background:linear-gradient(135deg,#243447,#2f4a40); border-radius:22px; padding:36px 30px; text-align:center; }
.bl-cta-emoji{ font-size:2rem; }
.bl-cta-h{ font-family:Georgia,serif; font-weight:700; color:#fff; font-size:1.5rem; margin-top:8px; }
.bl-cta-p{ color:rgba(255,255,255,0.82); font-size:0.95rem; line-height:1.6; margin:10px auto 18px; max-width:440px; }
.bl-cta-row{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; max-width:460px; margin:0 auto; }
.bl-cta-input{ flex:1; min-width:200px; border:none; border-radius:999px; padding:13px 18px; font-size:0.9rem; font-family:inherit; color:#243447; }
.bl-cta-input:focus{ outline:2px solid #7d9e77; }
.bl-cta-btn{ background:#fff !important; color:#243447 !important; border:none; border-radius:999px; padding:13px 26px; font-size:0.9rem; font-weight:800; cursor:pointer; font-family:inherit; transition:.16s; }
.bl-cta-btn:hover{ transform:translateY(-1px); filter:brightness(0.96); }
.bl-cta-note{ margin-top:13px; font-size:0.84rem; font-weight:700; min-height:1em; }
/* reader features */
.bl-progress{ position:fixed; top:0; left:0; right:0; height:3px; background:transparent; z-index:1200; pointer-events:none; }
.bl-progress > i{ display:block; height:100%; width:0; background:linear-gradient(90deg,#A8B8A0,#2F5D50); }
#blToast{ position:fixed; left:50%; bottom:28px; transform:translateX(-50%) translateY(20px); background:#1F3A5F; color:#fff; padding:13px 22px; border-radius:999px; font-size:0.88rem; font-weight:600; box-shadow:0 10px 30px rgba(0,0,0,0.25); opacity:0; pointer-events:none; transition:opacity .25s, transform .25s; z-index:1300; max-width:90vw; text-align:center; }
#blToast.show{ opacity:1; transform:translateX(-50%) translateY(0); }
.bl-tools{ display:flex; flex-wrap:wrap; gap:9px; margin:18px 0 4px; padding-bottom:20px; border-bottom:1px solid #eef2f0; }
.bl-tool{ background:#fff !important; border:1.5px solid #dde6d8; color:#1F3A5F !important; border-radius:999px; padding:9px 16px; font-size:0.82rem; font-weight:700; cursor:pointer; font-family:inherit; transition:.15s; }
.bl-tool:hover{ border-color:#A8B8A0; background:#f3f7f1 !important; }
.bl-comments{ margin-top:42px; padding-top:30px; border-top:1px solid #eef2f0; }
.bl-comments-h{ font-family:Georgia,serif; font-weight:700; color:#1F3A5F; font-size:1.3rem; margin-bottom:16px; }
.bl-comment-form{ display:flex; flex-direction:column; gap:10px; }
.bl-comment-name,.bl-comment-text{ width:100%; box-sizing:border-box; border:1.5px solid #dde6d8; border-radius:12px; padding:12px 14px; font-size:0.92rem; font-family:inherit; color:#1F3A5F; }
.bl-comment-name:focus,.bl-comment-text:focus{ outline:none; border-color:#A8B8A0; }
.bl-comment-text{ resize:vertical; min-height:80px; }
.bl-comment-btn{ align-self:flex-start; background:#2F5D50 !important; color:#fff !important; border:none; border-radius:999px; padding:11px 24px; font-size:0.88rem; font-weight:800; cursor:pointer; font-family:inherit; transition:.16s; }
.bl-comment-btn:hover{ filter:brightness(0.93); }
.bl-comment-note{ font-size:0.8rem; color:#7a8893; margin:12px 0 18px; }
.bl-comment-list{ display:flex; flex-direction:column; gap:12px; }
.bl-comment{ background:#f3f7f1; border:1px solid #dde6d8; border-radius:14px; padding:14px 16px; }
.bl-comment-meta{ font-size:0.78rem; color:#7a8893; margin-bottom:5px; }
.bl-comment-meta strong{ color:#1F3A5F; }
.bl-comment-body{ font-size:0.92rem; color:#3c4a58; line-height:1.5; }
.bl-comment-empty{ font-size:0.9rem; color:#8a96a2; font-style:italic; }
/* ===== Greedy Guts rich article content ===== */
.gg-kicker{ font-size:0.7rem; font-weight:800; letter-spacing:0.1em; text-transform:uppercase; color:#2F5D50; margin-bottom:14px; }
.gg-pullquote{ margin:0 0 26px; padding:20px 24px; background:#f3f7f1; border-left:4px solid #A8B8A0; border-radius:0 14px 14px 0; font-family:Georgia,serif; font-style:italic; font-size:1.15rem; color:#1F3A5F; line-height:1.5; }
.gg-bubbles{ display:flex; flex-wrap:wrap; gap:12px; margin:18px 0 22px; }
.gg-bubble{ background:#fff; border:1.5px solid #dde6d8; border-radius:18px 18px 18px 5px; padding:12px 16px; font-size:0.92rem; color:#1F3A5F; font-weight:600; box-shadow:0 3px 12px rgba(31,58,95,0.05); }
.gg-timeline{ display:flex; flex-direction:column; gap:14px; margin:18px 0 22px; }
.gg-tl-step{ display:flex; gap:15px; align-items:flex-start; background:#fff; border:1px solid #e8eef0; border-radius:16px; padding:16px 18px; }
.gg-tl-num{ flex:none; width:34px; height:34px; border-radius:50%; background:#2F5D50; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:0.95rem; }
.gg-tl-label{ font-weight:800; color:#1F3A5F; font-size:1.02rem; }
.gg-tl-text{ color:#5a6a78; font-size:0.92rem; margin-top:3px; line-height:1.5; }
.gg-cols{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; margin:18px 0 22px; }
.gg-col{ background:#fff; border:1px solid #dde6d8; border-radius:18px; padding:20px 18px; text-align:center; }
.gg-col-ic{ font-size:1.9rem; }
.gg-col-h{ font-weight:800; color:#1F3A5F; margin:8px 0 6px; font-size:1rem; }
.gg-col p{ margin:0; font-size:0.88rem; color:#5a6a78; line-height:1.5; }
.gg-panel{ margin:26px 0; background:linear-gradient(135deg,#fbf6ee,#f3f7f1); border:1px solid #e7ddc9; border-radius:20px; padding:24px 26px; }
.gg-panel-h{ font-family:Georgia,serif; font-weight:700; color:#1F3A5F; font-size:1.3rem; margin-bottom:12px; }
.gg-panel p{ margin:0 0 12px; }
.gg-panel-words{ display:flex; flex-wrap:wrap; gap:10px; margin:6px 0 14px; }
.gg-panel-words span{ background:#fff; border:1px dashed #cbb896; border-radius:999px; padding:6px 16px; font-weight:700; color:#9a6a3a; font-size:0.85rem; }
.gg-widget{ margin:28px 0; background:#1F3A5F; border-radius:22px; padding:30px 28px; text-align:center; }
.gg-widget-h{ font-family:Georgia,serif; font-weight:700; color:#fff; font-size:1.3rem; margin-bottom:18px; }
.gg-opts{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.gg-opt{ background:rgba(255,255,255,0.1) !important; border:1.5px solid rgba(255,255,255,0.3); color:#fff !important; border-radius:999px; padding:11px 22px; font-size:0.9rem; font-weight:700; cursor:pointer; font-family:inherit; transition:.16s; }
.gg-opt:hover{ background:rgba(255,255,255,0.2) !important; }
.gg-opt.gg-on{ background:#A8B8A0 !important; border-color:#A8B8A0; color:#1F3A5F !important; }
.gg-resp{ color:rgba(255,255,255,0.9); font-size:0.95rem; line-height:1.6; max-width:520px; margin:0 auto; overflow:hidden; max-height:0; transition:max-height .3s ease, margin-top .3s ease; }
.gg-resp.gg-show{ max-height:240px; margin-top:18px; }
.gg-info{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:11px; margin:18px 0 22px; }
.gg-cell{ display:flex; align-items:center; gap:11px; background:#f3f7f1; border:1px solid #dde6d8; border-radius:14px; padding:13px 16px; font-size:0.92rem; font-weight:600; color:#1F3A5F; }
.gg-cell-ic{ font-size:1.3rem; }
.gg-compare{ display:flex; flex-direction:column; gap:14px; margin:18px 0 22px; }
.gg-vs{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.gg-bad,.gg-good{ border-radius:16px; padding:16px 18px; font-size:0.95rem; font-weight:600; line-height:1.45; }
.gg-bad{ background:#f5f3ef; border:1px solid #e6e1d8; color:#7a6f63; }
.gg-good{ background:#eef4ea; border:1px solid #cfe0c6; color:#2F5D50; }
.gg-sage{ margin:30px 0; background:linear-gradient(135deg,#A8B8A0,#93a98a); border-radius:24px; padding:34px 32px; }
.gg-sage-h{ font-family:Georgia,serif; font-weight:700; color:#1F3A5F; font-size:1.5rem; margin-bottom:12px; }
.gg-sage p{ margin:0 0 12px; color:#1c3148; font-size:1rem; line-height:1.65; }
.gg-sage p:last-child{ margin-bottom:0; }
.gg-quote{ margin:30px 0 8px; padding:26px 30px; text-align:center; font-family:Georgia,serif; font-style:italic; font-size:1.25rem; color:#1F3A5F; line-height:1.55; border-top:1px solid #eef2f0; border-bottom:1px solid #eef2f0; }
@media(max-width:600px){ .gg-vs{ grid-template-columns:1fr; } }
.gg-sage ol,.gg-sage ul{ margin:8px 0 12px; padding-left:22px; }
.gg-sage li{ color:#1c3148; margin:5px 0; line-height:1.55; }
.gg-checks{ display:flex; flex-wrap:wrap; gap:9px; margin:8px 0 2px; }
.gg-checks span{ background:#eef4ea; border:1px solid #cfe0c6; border-radius:999px; padding:7px 15px; font-weight:700; color:#2F5D50; font-size:0.85rem; }
@media(max-width:640px){ .bl-img-lg{ aspect-ratio:16/9; } }