/* ══════════════════════════════════════════════
   NutrientsCalculator Theme — main.css
   ══════════════════════════════════════════════ */

:root {
  --green-50: #f0faf4; --green-100: #d4f0e0; --green-400: #2ec27e;
  --green-500: #1fa868; --green-600: #17865a; --green-900: #0a3828;
  --lime-400: #b5e34a; --ink: #0f1a12; --ink-60: rgba(15,26,18,0.6);
  --ink-20: rgba(15,26,18,0.12); --cream: #faf9f5; --white: #ffffff;
  --amber: #f59e0b;
  --radius-md: 14px; --radius-lg: 22px; --radius-xl: 32px;
  --shadow-sm: 0 1px 4px rgba(0,0,0,0.06),0 4px 16px rgba(0,0,0,0.04);
  --shadow-md: 0 4px 24px rgba(0,0,0,0.08),0 1px 4px rgba(0,0,0,0.04);
  --shadow-lg: 0 12px 48px rgba(0,0,0,0.12),0 2px 8px rgba(0,0,0,0.06);
  --font-display: 'Playfair Display',Georgia,serif;
  --font-body: 'DM Sans',sans-serif;
  --font-mono: 'DM Mono',monospace;
  --nav-h: 72px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
figure{margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);background:var(--cream);color:var(--ink);line-height:1.65;overflow-x:hidden}
img{max-width:100%;height:auto}
a{color:var(--green-500)}

/* ── NAV ── */
.nc-nav{position:sticky;top:0;z-index:100;height:var(--nav-h);background:rgba(10,56,40,0.97);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,0.08);display:flex;align-items:center;justify-content:flex-start;padding:0 5%;gap:2rem}
.nc-nav .logo img,.nc-nav .custom-logo{height:48px;width:auto;display:block}
.nc-nav .logo{flex-shrink:0;display:flex;align-items:center;margin-right:3rem}
.nc-nav .nav-menu{list-style:none;display:flex;gap:2rem;margin:0;padding:0;flex-grow:1}
.nc-nav .nav-menu a{text-decoration:none;color:rgba(255,255,255,0.7);font-size:15px;font-weight:500;transition:color 0.2s}
.nc-nav .nav-menu a:hover,.nc-nav .nav-menu .current-menu-item > a{color:#fff}
.nav-cta{background:var(--green-400);color:#fff!important;padding:9px 20px;border-radius:50px;font-size:14px;font-weight:600;transition:background 0.2s,transform 0.15s;text-decoration:none}
.nav-cta:hover{background:var(--green-500)!important;transform:translateY(-1px)}

/* ── HAMBURGER ── */
.hamburger{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:40px;height:40px;cursor:pointer;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.15);border-radius:10px;flex-shrink:0;transition:background 0.2s}
.hamburger:hover{background:rgba(255,255,255,0.15)}
.hamburger span{display:block;width:20px;height:2px;background:#fff;border-radius:2px;transition:transform 0.3s,opacity 0.3s}
.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ── MOBILE MENU ── */
.mobile-menu{display:none;position:fixed;top:var(--nav-h);left:0;right:0;background:rgba(10,56,40,0.98);backdrop-filter:blur(20px);z-index:99;padding:1.5rem 5% 2rem;border-bottom:1px solid rgba(255,255,255,0.1);transform:translateY(-10px);opacity:0;transition:transform 0.3s ease,opacity 0.3s ease;pointer-events:none}
.mobile-menu.open{transform:translateY(0);opacity:1;pointer-events:all}
.mobile-menu .nav-menu{flex-direction:column;gap:0}
.mobile-menu .nav-menu li a{display:block;padding:1rem 0;font-size:17px;font-weight:500;color:rgba(255,255,255,0.8);text-decoration:none;border-bottom:1px solid rgba(255,255,255,0.08);transition:color 0.2s,padding-left 0.2s}
.mobile-menu .nav-menu li a:hover{color:#fff;padding-left:6px}
.mobile-menu .nav-menu li:last-child a{border-bottom:none}
.mobile-menu-cta {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(255,255,255,0.1);
}
.mobile-cta-analyze {
  background: var(--green-400);
  color: #fff;
  padding: 14px 28px;
  border-radius: 50px;
  font-size: 16px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  width: 100%;
  font-family: 'DM Sans', sans-serif;
  transition: background 0.2s;
  text-align: center;
}
.mobile-cta-analyze:hover { background: var(--green-500); }
.mobile-cta-auth {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.mobile-cta-signin {
  display: block;
  text-align: center;
  padding: 13px 16px;
  border-radius: 50px;
  border: 1.5px solid rgba(255,255,255,0.3);
  color: rgba(255,255,255,0.9) !important;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none !important;
  transition: all 0.2s;
  font-family: 'DM Sans', sans-serif;
}
.mobile-cta-signin:hover { border-color: rgba(255,255,255,0.6); color: #fff !important; }
.mobile-cta-signup {
  display: block;
  text-align: center;
  padding: 13px 16px;
  border-radius: 50px;
  background: #fff;
  color: var(--green-900) !important;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none !important;
  transition: all 0.2s;
  font-family: 'DM Sans', sans-serif;
}
.mobile-cta-signup:hover { background: var(--green-50); }
.mobile-cta-profile {
  display: block;
  text-align: center;
  padding: 13px 24px;
  border-radius: 50px;
  background: rgba(46,194,126,0.15);
  border: 1.5px solid rgba(46,194,126,0.35);
  color: #2ec27e !important;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none !important;
  transition: all 0.2s;
  font-family: 'DM Sans', sans-serif;
}
.mobile-cta-profile:hover { background: rgba(46,194,126,0.25); }

/* ── AFFILIATE BANNERS ── */
.aff-subheader{background:#fffbeb;border-bottom:1px solid #fde68a;padding:10px 5%;display:flex;align-items:center;justify-content:center;gap:1.5rem;flex-wrap:wrap;text-decoration:none;transition:background 0.2s}
.aff-subheader:hover{background:#fef3c7}
.aff-sh-pill{background:var(--amber);color:#78350f;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:1px;padding:3px 10px;border-radius:50px;white-space:nowrap;flex-shrink:0}
.aff-sh-text{font-size:14px;font-weight:500;color:#78350f;display:flex;align-items:center;gap:0.5rem;flex-wrap:wrap;justify-content:center}
.aff-sh-text strong{font-weight:700}
.aff-sh-cta{font-size:13px;font-weight:700;color:#92400e;white-space:nowrap;border-bottom:1.5px solid #f59e0b;padding-bottom:1px}
.aff-sh-disc{font-size:11px;color:#b45309;opacity:0.7}

.aff-lb{background:var(--green-900);padding:1.25rem 5%;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
.aff-lb-left{display:flex;align-items:center;gap:1.25rem}
.aff-lb-badge{background:var(--amber);color:#7c4a00;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:1px;padding:4px 10px;border-radius:50px;white-space:nowrap}
.aff-lb-title{color:#fff;font-size:15px;font-weight:600}
.aff-lb-sub{color:rgba(255,255,255,0.6);font-size:13px}
.aff-lb-stars{color:var(--amber);font-size:13px;margin-top:2px}
.aff-lb-btn{background:var(--amber);color:#7c4a00;padding:10px 22px;border-radius:50px;font-size:14px;font-weight:700;text-decoration:none;white-space:nowrap;transition:transform 0.15s;flex-shrink:0}
.aff-lb-btn:hover{transform:translateY(-1px)}
.aff-lb-disc{color:rgba(255,255,255,0.35);font-size:11px}

.aff-spotlight{background:linear-gradient(135deg,#fff8ec,#fff3d4);border:1.5px solid #f5d08a;border-radius:var(--radius-xl);margin:0 3%;padding:2.5rem 4%;display:grid;grid-template-columns:1fr auto;align-items:center;gap:3rem}
.aff-spot-lbl{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:1.5px;color:#8a5c00;margin-bottom:6px}
.aff-spot-h{font-family:var(--font-display);font-size:22px;font-weight:700;color:#4a3000;line-height:1.3}
.aff-spot-p{font-size:14px;color:#7a5500;margin-top:6px;line-height:1.6}
.aff-spot-checks{display:flex;gap:1.5rem;margin-top:1rem;flex-wrap:wrap}
.aff-check{font-size:13px;color:#5a3e00;font-weight:500;display:flex;align-items:center;gap:5px}
.aff-spot-right{text-align:center}
.aff-spot-img{font-size:80px;line-height:1;display:block;margin-bottom:0.5rem}
.aff-spot-price{font-size:13px;color:#8a5c00;margin-bottom:0.75rem}
.aff-spot-price strong{font-size:22px;font-family:var(--font-display);color:#4a3000}
.aff-spot-btn{display:block;background:#f59e0b;color:#4a3000;padding:12px 24px;border-radius:50px;font-size:14px;font-weight:700;text-decoration:none;text-align:center;transition:transform 0.15s}
.aff-spot-btn:hover{transform:translateY(-1px)}
.aff-disc{font-size:10px;color:#b07a00;margin-top:6px;opacity:0.7}

.aff-cmp{background:var(--white);border:1px solid var(--ink-20);border-radius:var(--radius-lg);overflow:hidden;margin:2rem 0}
.aff-cmp-hdr{background:var(--green-900);color:#fff;padding:1rem 1.5rem;display:flex;align-items:center;gap:.75rem;font-size:14px;font-weight:600}
.aff-cmp-row{display:flex;align-items:center;gap:1rem;padding:1rem 1.5rem;border-bottom:1px solid var(--ink-20);text-decoration:none;color:var(--ink);transition:background 0.15s}
.aff-cmp-row:last-child{border-bottom:none}
.aff-cmp-row:hover{background:var(--green-50)}
.aff-cmp-rank{width:28px;height:28px;border-radius:50%;background:var(--green-50);border:1.5px solid var(--green-100);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--green-600);flex-shrink:0}
.aff-cmp-rank.gold{background:#fef3c7;border-color:var(--amber);color:#92400e}
.aff-cmp-icon{font-size:28px;flex-shrink:0}
.aff-cmp-info{flex:1}
.aff-cmp-name{font-size:14px;font-weight:600}
.aff-cmp-sub{font-size:12px;color:var(--ink-60)}
.aff-cmp-stars{color:var(--amber);font-size:12px}
.aff-cmp-price{font-family:var(--font-mono);font-size:15px;font-weight:700}
.aff-cmp-btn{background:var(--green-500);color:#fff;padding:7px 14px;border-radius:50px;font-size:12px;font-weight:700;white-space:nowrap}

.aff-pf{background:var(--green-900);padding:3rem 5%;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;border-top:1px solid rgba(255,255,255,0.08)}
.aff-pf-card{background:transparent;padding:1.5rem 2rem;text-decoration:none;color:#fff;border-right:1px solid rgba(255,255,255,0.08);display:flex;flex-direction:column;transition:background 0.2s}
.aff-pf-card:last-child{border-right:none}
.aff-pf-card:hover{background:rgba(255,255,255,0.05)}
.aff-pf-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:var(--lime-400);margin-bottom:.4rem}
.aff-pf-icon{font-size:32px;margin-bottom:.6rem}
.aff-pf-title{font-size:15px;font-weight:600;margin-bottom:4px}
.aff-pf-sub{font-size:13px;color:rgba(255,255,255,0.55);line-height:1.5;flex:1}
.aff-pf-link{display:inline-flex;align-items:center;gap:5px;margin-top:1rem;font-size:13px;font-weight:600;color:var(--green-400)}

/* ── COMMON SECTION STYLES ── */
.nc-section{padding:6rem 5%}
.section-label{display:inline-block;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:1.5px;color:var(--green-500);margin-bottom:1rem}
.section-title{font-family:var(--font-display);font-size:clamp(2rem,3.5vw,3rem);font-weight:700;line-height:1.2;letter-spacing:-0.8px;max-width:680px}
.section-title em{font-style:normal;color:var(--green-500)}
.section-sub{font-size:17px;color:var(--ink-60);line-height:1.75;max-width:560px;margin-top:1rem}
.btn-primary{background:var(--green-500);color:#fff;padding:14px 28px;border-radius:50px;font-size:16px;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:8px;transition:background 0.2s,transform 0.15s,box-shadow 0.2s;box-shadow:0 4px 24px rgba(31,168,104,0.35)}
.btn-primary:hover{background:var(--green-600);transform:translateY(-2px);box-shadow:0 8px 32px rgba(31,168,104,0.45)}
.btn-secondary{background:transparent;color:var(--ink);padding:14px 28px;border-radius:50px;font-size:16px;font-weight:500;text-decoration:none;border:1.5px solid var(--ink-20);display:inline-flex;align-items:center;gap:8px;transition:border-color 0.2s,background 0.2s}
.btn-secondary:hover{border-color:var(--ink);background:rgba(15,26,18,0.04)}
.btn-white{background:#fff;color:var(--green-600);padding:15px 36px;border-radius:50px;font-size:16px;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;gap:8px;transition:transform 0.2s,box-shadow 0.2s;box-shadow:0 4px 24px rgba(0,0,0,0.15)}
.btn-white:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,0,0,0.2)}

/* ── TRUST BAR ── */
.trust-bar{background:var(--green-50);border-top:1px solid var(--green-100);border-bottom:1px solid var(--green-100);padding:2rem 5%;display:flex;align-items:center;justify-content:center;gap:4rem;flex-wrap:wrap}
.trust-item{display:flex;align-items:center;gap:10px;color:var(--green-600);font-size:14px;font-weight:600}

/* ── CTA BANNER ── */
.cta-banner{background:var(--green-500);color:#fff;text-align:center;padding:5rem 5%;position:relative;overflow:hidden}
.cta-banner::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 100% at 50% 50%,rgba(255,255,255,0.08) 0%,transparent 70%)}
.cta-banner h2{font-family:var(--font-display);font-size:clamp(2rem,4vw,3.2rem);font-weight:700;margin-bottom:1rem;position:relative}
.cta-banner p{font-size:18px;opacity:.85;max-width:480px;margin:0 auto 2.5rem;position:relative}
.cta-banner .btn-white{position:relative}

/* ── NEWSLETTER ── */
.nl-bar{background:var(--white);border:1px solid var(--ink-20);border-radius:var(--radius-xl);padding:3rem 4%;margin:4rem 3%;display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.nl-bar h3{font-family:var(--font-display);font-size:26px;font-weight:700;line-height:1.25;margin-bottom:.5rem}
.nl-bar p{font-size:15px;color:var(--ink-60)}
.nl-form{display:flex;gap:10px}
.nl-input{flex:1;padding:13px 18px;border:1.5px solid var(--ink-20);border-radius:50px;font-size:15px;font-family:var(--font-body);background:var(--cream);outline:none;transition:border-color 0.2s}
.nl-input:focus{border-color:var(--green-400)}
.nl-input::placeholder{color:var(--ink-60)}
.nl-btn{background:var(--green-500);color:#fff;padding:13px 24px;border-radius:50px;font-size:15px;font-weight:600;border:none;cursor:pointer;font-family:var(--font-body);transition:background 0.2s;white-space:nowrap}
.nl-btn:hover{background:var(--green-600)}

/* ── FAQ ── */
.faq-wrap{max-width:760px;margin:0 auto}
.faq-list{margin-top:2.5rem}
.faq-item{border-bottom:1px solid var(--ink-20)}
.faq-q{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 0;cursor:pointer;font-size:16px;font-weight:600;user-select:none;gap:1rem;transition:color 0.2s;list-style:none}
.faq-q:hover{color:var(--green-500)}
.faq-chev{font-size:20px;flex-shrink:0;transition:transform 0.3s}
.faq-a{font-size:15px;color:var(--ink-60);line-height:1.7;max-height:0;overflow:hidden;transition:max-height 0.35s ease,padding 0.35s ease}
.faq-item.open .faq-a{max-height:300px;padding-bottom:1.25rem}
.faq-item.open .faq-chev{transform:rotate(180deg)}
.faq-item.open .faq-q{color:var(--green-500)}

/* ── FOOTER ── */
.nc-footer{background:var(--ink);color:rgba(255,255,255,0.7);padding:4rem 5% 2rem}
.ft-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:3rem;margin-bottom:3rem}
.ft-logo{display:flex;align-items:center;gap:10px;margin-bottom:1rem;text-decoration:none}
.ft-logo img,.ft-logo .custom-logo{height:32px;width:auto;filter:brightness(0) invert(1);opacity:.9}
.ft-brand p{font-size:14px;line-height:1.7;max-width:280px}
.ft-col h4{color:#fff;font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;margin-bottom:1rem}
.ft-col ul{list-style:none;display:flex;flex-direction:column;gap:.6rem;padding:0}
.ft-col ul a{text-decoration:none;color:rgba(255,255,255,0.6);font-size:14px;transition:color 0.2s}
.ft-col ul a:hover{color:var(--green-400)}
.ft-bottom{border-top:1px solid rgba(255,255,255,0.1);padding-top:2rem;display:flex;align-items:center;justify-content:space-between}
.ft-bottom p{font-size:13px}
.ft-badge{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);border-radius:50px;padding:5px 12px;font-size:12px;font-weight:500;color:rgba(255,255,255,0.7)}
.ft-badges{display:flex;gap:.8rem}

/* ── BLOG ── */
/* old blog styles removed */
.nc-post-body{padding:1.25rem;flex:1;display:flex;flex-direction:column}
.nc-post-cat{display:inline-block;background:var(--green-500);color:#fff;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;padding:3px 10px;border-radius:50px;margin-bottom:.6rem}
.nc-post-meta{font-size:12px;color:var(--ink-60);margin-bottom:.6rem}
.nc-post-title{font-size:17px;font-weight:600;line-height:1.4;flex:1;margin-bottom:1rem;color:var(--ink)}
.nc-post-read{font-size:13px;font-weight:600;color:var(--green-500)}
.nc-sidebar .widget{background:var(--white);border:1px solid var(--ink-20);border-radius:var(--radius-lg);padding:1.5rem;margin-bottom:1.5rem}
.nc-sidebar .widget-title{font-family:var(--font-display);font-size:18px;font-weight:700;margin-bottom:1rem;color:var(--ink)}
.nc-pagination{display:flex;justify-content:center;gap:.5rem;margin-top:3rem}
.nc-pagination a,.nc-pagination span{padding:8px 16px;border-radius:50px;font-size:14px;font-weight:600;text-decoration:none;border:1.5px solid var(--ink-20);color:var(--ink);transition:all .2s}
.nc-pagination .current,.nc-pagination a:hover{background:var(--green-500);border-color:var(--green-500);color:#fff}

/* ── SINGLE POST ── */
.nc-single{max-width:760px;margin:0 auto;padding:4rem 5%}
.nc-single-hero{margin-bottom:2.5rem}
.nc-single-hero img{width:100%;border-radius:var(--radius-lg);aspect-ratio:16/9;object-fit:cover}
.nc-single-cats{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}
.nc-single-title{font-family:var(--font-display);font-size:clamp(2rem,4vw,3rem);font-weight:700;line-height:1.15;letter-spacing:-1px;margin-bottom:1rem}
.nc-single-meta{font-size:14px;color:var(--ink-60);margin-bottom:2rem;display:flex;gap:1.5rem;flex-wrap:wrap}
.nc-single-content{font-size:17px;line-height:1.8;color:var(--ink)}
.nc-single-content h2,.nc-single-content h3{font-family:var(--font-display);margin:2.5rem 0 1rem}
.nc-single-content h2{font-size:1.8rem}
.nc-single-content h3{font-size:1.4rem}
.nc-single-content p{margin-bottom:1.5rem}
.nc-single-content ul,.nc-single-content ol{margin:1rem 0 1.5rem 1.5rem}
.nc-single-content li{margin-bottom:.5rem}
.nc-single-content blockquote{border-left:4px solid var(--green-400);padding:.5rem 1.5rem;margin:2rem 0;background:var(--green-50);border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-style:italic}
.nc-single-content a{color:var(--green-500);text-decoration:underline}
.nc-single-content img{border-radius:var(--radius-md);margin:2rem 0;width:100%}

/* ── ANIMATIONS ── */
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
@keyframes scanDown{0%{top:0;opacity:1}80%{top:100%;opacity:.5}100%{top:0;opacity:0}}
@keyframes floatTag{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:translateY(0)}

/* ══════════════════════════════════════════════
   RESPONSIVE — tablet (≤900px) + mobile (≤480px)
   ══════════════════════════════════════════════ */

@media(max-width:900px){

  /* NAV */
  .nc-nav .nav-menu,.nc-nav .nav-cta{display:none}
  .hamburger{display:flex}
  .mobile-menu{display:block}

  /* Mobile menu: account for sticky nav height */
  .mobile-menu{top:var(--nav-h)}

  /* AFFILIATE SUB-HEADER — compact on mobile */
  .aff-subheader{padding:8px 4%;gap:.75rem;flex-wrap:wrap;justify-content:center}
  .aff-sh-text{font-size:12px;text-align:center;justify-content:center}
  .aff-sh-disc{display:none}
  .aff-sh-cta{font-size:12px}

  /* HERO */
  .hero{grid-template-columns:1fr;min-height:auto;padding:2.5rem 5% 3rem;gap:2rem}
  .hero-visual,.floating-tags{display:none}
  .hero h1{font-size:clamp(2rem,8vw,3rem);letter-spacing:-1px}
  .hero > div > p{font-size:15px;margin:1rem 0 1.5rem}
  .hero-actions{flex-direction:column;gap:.75rem}
  .hero-actions .btn-primary,.hero-actions .btn-secondary{width:100%;justify-content:center;text-align:center}
  .hero-stats{gap:1.5rem;flex-wrap:wrap}
  .hero-badge{font-size:11px}

  /* HERO INLINE AFF BANNER */
  .aff-hero{max-width:100%;flex-wrap:wrap}
  .aff-hero-btn{width:100%;text-align:center;margin-top:.5rem}

  /* LEADERBOARD BANNER */
  .aff-lb{flex-direction:column;text-align:center;padding:1.25rem 5%;gap:1rem}
  .aff-lb-left{flex-direction:column;align-items:center;gap:.6rem}
  .aff-lb-btn{width:100%;text-align:center}

  /* STEPS */
  .steps{grid-template-columns:1fr;gap:1rem;margin-top:2rem}

  /* PRODUCT ROW */
  .aff-prod-row{grid-template-columns:1fr;gap:1rem}
  .aff-prod-badge{font-size:9px}

  /* MACRO SECTION */
  .macro-sec{border-radius:var(--radius-lg);margin:0 4%;padding:3rem 5%}
  .macro-grid{grid-template-columns:1fr;gap:2.5rem}
  .macro-content .section-title{font-size:1.8rem}

  /* SPOTLIGHT */
  .aff-spotlight{grid-template-columns:1fr;gap:1.5rem;margin:0 4%;padding:2rem 5%}
  .aff-spot-right{text-align:left}
  .aff-spot-img{font-size:56px}
  .aff-spot-checks{gap:1rem}

  /* AUDIENCE GRID */
  .audience-grid{grid-template-columns:1fr;gap:1rem;margin-top:2rem}

  /* ARTICLES */
  .art-header{flex-direction:column;align-items:flex-start;gap:.75rem;margin-bottom:1.5rem}
  .art-grid{grid-template-columns:1fr;gap:1.25rem}

  /* COMPARISON */
  .aff-cmp-price{display:none}
  .aff-cmp-btn{font-size:11px;padding:6px 10px}

  /* TOOLS */
  .tools-grid{grid-template-columns:1fr;gap:1rem;margin-top:2rem}

  /* NEWSLETTER */
  .nl-bar{grid-template-columns:1fr;margin:2rem 4%;padding:2rem 5%;gap:1.5rem;border-radius:var(--radius-lg)}
  .nl-form{flex-direction:column;gap:.75rem}
  .nl-input,.nl-btn{width:100%;border-radius:14px}

  /* PRE-FOOTER 3-PANEL */
  .aff-pf{grid-template-columns:1fr;gap:0;padding:2rem 5%}
  .aff-pf-card{border-right:none;border-bottom:1px solid rgba(255,255,255,0.08);padding:1.5rem 0}
  .aff-pf-card:last-child{border-bottom:none}

  /* FOOTER */
  .ft-top{grid-template-columns:1fr;gap:2rem;margin-bottom:2rem}
  .ft-brand p{max-width:100%}
  .ft-bottom{flex-direction:column;gap:1rem;text-align:center}
  .ft-badges{justify-content:center;flex-wrap:wrap}

  /* BLOG */


  /* SINGLE POST */
  .nc-single{padding:2rem 5%}
  .nc-single-title{font-size:clamp(1.6rem,6vw,2.4rem)}
  .nc-single-meta{gap:1rem;flex-wrap:wrap}

  /* SECTIONS */
  .nc-section{padding:3.5rem 5%}
  .section-title{font-size:clamp(1.7rem,5.5vw,2.4rem);letter-spacing:-.5px}
  .section-sub{font-size:15px}

  /* CTA BANNER */
  .cta-banner{padding:3.5rem 5%}
  .cta-banner h2{font-size:clamp(1.8rem,6vw,2.6rem)}
  .cta-banner p{font-size:16px}
  .btn-white{width:100%;max-width:320px;justify-content:center}
}

/* ── SMALL MOBILE (≤480px) ── */
@media(max-width:480px){
  :root{--nav-h:64px}

  .nc-nav{padding:0 4%}
  .nc-nav .logo img,.nc-nav .custom-logo{height:38px}

  .aff-subheader{padding:8px 4%;gap:.5rem}
  .aff-sh-text{font-size:11px}
  .aff-sh-pill{font-size:9px;padding:2px 8px}
  .aff-sh-cta{display:none}

  .hero{padding:2rem 4% 2.5rem}
  .hero h1{font-size:clamp(1.75rem,7.5vw,2.5rem)}
  .hero-stats .stat-num{font-size:22px}
  .hero-stats .stat-label{font-size:10px}

  .steps .step-card{padding:1.5rem}
  .step-num{font-size:56px}

  .macro-sec{margin:0 3%;padding:2.5rem 4%}
  .donut-svg{width:140px;height:140px}

  .aud-card{padding:1.5rem}
  .aud-emoji{font-size:32px}

  .nc-section{padding:3rem 4%}
  .faq-q{font-size:14px}

  .ft-top{gap:1.5rem}
  .ft-col h4{font-size:13px}
  .ft-col ul a{font-size:13px}

  .aff-pf-card{padding:1.25rem 0}
  .aff-pf-icon{font-size:24px}
  .aff-pf-title{font-size:14px}

  .aff-cmp-row{padding:.85rem 1rem;gap:.6rem}
  .aff-cmp-icon{font-size:22px}
  .aff-cmp-name{font-size:13px}
  .aff-cmp-btn{display:none}

  .nl-bar{margin:1.5rem 3%;padding:1.75rem 4%}
  .nl-bar h3{font-size:20px}

  .nc-single{padding:1.75rem 4%}
}

/* ── Full-width dashboard page ── */
.nc-fullwidth-page {
  width: 100%;
  padding: 0;
  margin: 0;
  min-height: calc(100vh - var(--nav-h, 64px));
}
.nc-fullwidth-page .ncd-dashboard,
.nc-fullwidth-page .ncd-auth-wrap {
  width: 100%;
  max-width: 100%;
  margin: 0;
  border-radius: 0;
  box-shadow: none;
}

/* ── Profile / Dashboard page ── */
.ncd-page-wrap {
  width: 100%;
  padding: 0;
  min-height: calc(100vh - var(--nav-h, 64px));
}
/* Remove any WP-injected padding on the profile page */
.ncd-page-wrap > *,
.ncd-page-wrap .ncd-dashboard,
.ncd-page-wrap .ncd-auth-wrap {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ── Nav auth buttons ── */
.nav-auth { display:flex;align-items:center;gap:8px;flex-shrink:0; }
.nav-signin { color:rgba(255,255,255,0.82);font-size:13px;font-weight:500;text-decoration:none!important;padding:7px 12px;border-radius:50px;border:1.5px solid rgba(255,255,255,0.2);transition:all .2s;white-space:nowrap; }
.nav-signin:hover { color:#fff!important;border-color:rgba(255,255,255,0.45); }
.nav-signup { color:#0a3828!important;background:#2ec27e;font-size:13px;font-weight:700;text-decoration:none!important;padding:7px 14px;border-radius:50px;transition:all .2s;white-space:nowrap; }
.nav-signup:hover { background:#fff!important; }
.nav-avatar-link { display:flex;align-items:center;justify-content:center;text-decoration:none!important; }
.nav-avatar-img { width:34px;height:34px;border-radius:50%;object-fit:cover;border:2px solid rgba(46,194,126,0.5); }
.nav-avatar-initials { width:34px;height:34px;border-radius:50%;background:#1fa868;color:#fff!important;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;font-family:'DM Sans',sans-serif;border:2px solid rgba(46,194,126,0.5); }
/* Mobile: hide text auth buttons, keep only avatar */
@media (max-width:900px) {
  .nav-auth .nav-signin,
  .nav-auth .nav-signup { display:none; }
  .nav-auth { gap:4px; }
  /* Show avatar on mobile if logged in */
  .nav-auth .nav-avatar-link { display:flex; }
}

/* ── SEO Editorial Text Block ── */
.nc-seo-block {
  background: var(--cream);
  padding: 4rem 5%;
  border-top: 1px solid rgba(15,26,18,0.08);
}
.nc-seo-inner {
  max-width: 860px;
  margin: 0 auto;
}
.nc-seo-inner h2 {
  font-family: var(--font-head);
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--ink);
  margin: 0 0 1rem;
  letter-spacing: -.3px;
}
.nc-seo-inner h3 {
  font-family: var(--font-head);
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--ink);
  margin: 1.75rem 0 .6rem;
}
.nc-seo-inner p {
  font-size: 15px;
  line-height: 1.8;
  color: var(--ink-60);
  margin: 0 0 .75rem;
}
.nc-seo-inner strong { color: var(--ink); font-weight: 600; }
.nc-seo-links {
  display: flex;
  gap: 1.5rem;
  flex-wrap: wrap;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(15,26,18,0.08);
}
.nc-seo-links a {
  font-size: 14px;
  font-weight: 600;
  color: var(--green-500);
  text-decoration: none;
  transition: color .2s;
}
.nc-seo-links a:hover { color: var(--green-600); text-decoration: underline; }
@media (max-width: 600px) {
  .nc-seo-links { flex-direction: column; gap: .75rem; }
}

/* ── Logo alignment & size overrides ── */
.nc-nav .logo {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  text-decoration: none;
  margin-left: 0 !important;
  padding-left: 0 !important;
  margin-right: 3rem !important;
}
/* WordPress custom_logo wraps in <figure> and <a> — strip all spacing */
.nc-nav .logo figure,
.nc-nav .logo .wp-block-site-logo,
.nc-nav .custom-logo-link {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}
.nc-nav .logo img,
.nc-nav .custom-logo {
  height: 48px !important;
  width: auto !important;
  max-width: none !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}
@media (max-width: 768px) {
  .nc-nav .logo img,
  .nc-nav .custom-logo { height: 38px !important; }
  .nc-nav .logo { margin-right: 1.5rem !important; }
}

/* ══════════════════════════════════════════════════
   BLOG PAGE — Editorial Magazine Style
══════════════════════════════════════════════════ */

/* ── Hero header ── */
.bl-hero {
  background: linear-gradient(160deg, #0a3828 0%, #0d4a34 60%, #0f5a3e 100%);
  padding: 5rem 5% 4rem;
  position: relative;
  overflow: hidden;
}
.bl-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%234ade80' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  pointer-events: none;
}
.bl-hero-inner {
  position: relative;
  max-width: 760px;
}
.bl-hero-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #4ade80;
  margin-bottom: 1rem;
}
.bl-hero-title {
  font-family: var(--font-display);
  font-size: clamp(2.2rem, 4vw, 3.4rem);
  font-weight: 700;
  color: #fff;
  line-height: 1.15;
  letter-spacing: -1px;
  margin-bottom: 1rem;
}
.bl-hero-title em { font-style: normal; color: #4ade80; }
.bl-hero-sub {
  font-size: 16px;
  color: rgba(255,255,255,0.65);
  line-height: 1.7;
  max-width: 560px;
  margin-bottom: 2rem;
}

/* Search bar */
.bl-search {
  display: flex;
  align-items: center;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 50px;
  padding: 6px 6px 6px 16px;
  max-width: 560px;
  margin-bottom: 2rem;
  transition: border-color .2s, background .2s;
}
.bl-search:focus-within {
  background: rgba(255,255,255,0.13);
  border-color: rgba(74,222,128,0.5);
}
.bl-search-icon { font-size: 16px; margin-right: 8px; opacity: 0.6; }
.bl-search-input {
  flex: 1;
  background: none;
  border: none;
  outline: none;
  color: #fff;
  font-size: 14px;
  font-family: var(--font-sans);
}
.bl-search-input::placeholder { color: rgba(255,255,255,0.4); }
.bl-search-btn {
  background: #2ec27e;
  color: #fff;
  border: none;
  border-radius: 50px;
  padding: 8px 18px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background .2s;
}
.bl-search-btn:hover { background: #25a86c; }

/* Category pills */
.bl-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.bl-cat-pill {
  font-size: 12px;
  font-weight: 600;
  color: rgba(255,255,255,0.6);
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.12);
  padding: 5px 14px;
  border-radius: 50px;
  text-decoration: none;
  transition: all .2s;
  white-space: nowrap;
}
.bl-cat-pill:hover,
.bl-cat-pill.active {
  background: #2ec27e;
  border-color: #2ec27e;
  color: #fff;
}
.bl-cat-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.15);
  border-radius: 50px;
  padding: 0 6px;
  font-size: 10px;
  margin-left: 4px;
  min-width: 18px;
}
.bl-cat-pill.active .bl-cat-count,
.bl-cat-pill:hover .bl-cat-count { background: rgba(255,255,255,0.25); }

/* ── Featured article ── */
.bl-featured-wrap {
  padding: 0 5%;
  margin: 3rem auto 0;
  max-width: 1400px;
}
.bl-featured {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-radius: 20px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  background: var(--white);
  border: 1px solid var(--ink-20);
  box-shadow: 0 8px 40px rgba(0,0,0,0.08);
  transition: box-shadow .3s, transform .3s;
  min-height: 380px;
}
.bl-featured:hover { transform: translateY(-3px); box-shadow: 0 16px 56px rgba(0,0,0,0.12); }
.bl-feat-img {
  position: relative;
  overflow: hidden;
  background: #e6f7ee;
  min-height: 340px;
}
.bl-feat-photo { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s; }
.bl-featured:hover .bl-feat-photo { transform: scale(1.03); }
.bl-feat-fallback {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #e6f7ee 0%, #c8f0d8 100%);
  font-size: 96px;
  position: relative;
}
.bl-feat-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(270deg, transparent 50%, rgba(10,56,40,0.08) 100%);
}
.bl-feat-body {
  padding: 3rem 2.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.bl-feat-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 12px;
  color: var(--ink-60);
  margin-bottom: 1rem;
}
.bl-feat-badge {
  background: #0a3828;
  color: #4ade80;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  padding: 3px 10px;
  border-radius: 50px;
  text-transform: uppercase;
}
.bl-feat-cat {
  background: var(--green-50);
  color: var(--green-600);
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 50px;
}
.bl-feat-dot { color: var(--ink-30); }
.bl-feat-title {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.5px;
  color: var(--ink);
  margin-bottom: 1rem;
}
.bl-feat-excerpt {
  font-size: 15px;
  color: var(--ink-60);
  line-height: 1.7;
  margin-bottom: 1.5rem;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.bl-feat-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 700;
  color: #2ec27e;
  transition: gap .2s;
}
.bl-featured:hover .bl-feat-cta { gap: 12px; }
.bl-feat-arrow { font-size: 18px; }

/* ── Main layout ── */
.bl-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 3rem;
  padding: 3rem 5% 5rem;
  max-width: 1400px;
  margin: 0 auto;
}

/* Results header */
.bl-results-hdr {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 2px solid var(--ink-20);
}
.bl-results-label {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 700;
  color: var(--ink);
}
.bl-results-count {
  font-size: 12px;
  color: var(--ink-60);
  background: var(--ink-20);
  padding: 3px 10px;
  border-radius: 50px;
  font-weight: 600;
}

/* ── Article grid ── */
.bl-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.75rem;
}
.bl-card {
  background: var(--white);
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid var(--ink-20);
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  transition: transform .25s, box-shadow .25s;
  animation: bl-card-in .5s ease both;
}
.bl-card:hover { transform: translateY(-5px); box-shadow: 0 12px 40px rgba(0,0,0,0.1); }
@keyframes bl-card-in {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
.bl-card-img {
  position: relative;
  aspect-ratio: 16/9;
  overflow: hidden;
  background: var(--green-50);
}
.bl-card-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
}
.bl-card:hover .bl-card-photo { transform: scale(1.05); }
.bl-card-fallback {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 54px;
  background: linear-gradient(135deg, #e6f7ee, #c8f0d8);
}
.bl-card-cat {
  position: absolute;
  bottom: 10px;
  left: 12px;
  font-size: 11px;
  font-weight: 700;
  background: rgba(10,56,40,0.85);
  color: #4ade80;
  padding: 3px 10px;
  border-radius: 50px;
  backdrop-filter: blur(4px);
}
.bl-card-body {
  padding: 1.25rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.bl-card-meta {
  font-size: 11px;
  color: var(--ink-60);
  margin-bottom: 0.6rem;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bl-card-dot { color: var(--ink-30); }
.bl-card-title {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--ink);
  margin-bottom: 0.5rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.bl-card-excerpt {
  font-size: 13px;
  color: var(--ink-60);
  line-height: 1.6;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 1rem;
}
.bl-card-read {
  font-size: 12px;
  font-weight: 700;
  color: #2ec27e;
  margin-top: auto;
}

/* ── Pagination ── */
.bl-pagination {
  margin-top: 3rem;
  display: flex;
  justify-content: center;
}
.bl-pagination .page-numbers {
  list-style: none;
  display: flex;
  gap: 6px;
  padding: 0;
  margin: 0;
}
.bl-pagination .page-numbers li a,
.bl-pagination .page-numbers li span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  border: 1px solid var(--ink-20);
  color: var(--ink);
  text-decoration: none;
  transition: all .2s;
}
.bl-pagination .page-numbers li a:hover { background: var(--green-50); border-color: var(--green-200); color: var(--green-600); }
.bl-pagination .page-numbers li span.current { background: #0a3828; color: #fff; border-color: #0a3828; }

/* ── Empty state ── */
.bl-empty {
  text-align: center;
  padding: 5rem 2rem;
  grid-column: 1 / -1;
}
.bl-empty > span { font-size: 64px; display: block; margin-bottom: 1.5rem; }
.bl-empty h3 { font-size: 24px; font-weight: 700; margin-bottom: 0.5rem; }
.bl-empty p  { color: var(--ink-60); margin-bottom: 1.5rem; }
.bl-empty-btn {
  display: inline-flex;
  align-items: center;
  background: #0a3828;
  color: #fff;
  padding: 10px 24px;
  border-radius: 50px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: background .2s;
}
.bl-empty-btn:hover { background: #0d4a34; }

/* ── Sidebar ── */
.bl-sidebar { display: flex; flex-direction: column; gap: 1.5rem; }

/* Newsletter widget */
.bl-sb-newsletter {
  background: #0a3828;
  border-radius: 16px;
  padding: 1.75rem;
  text-align: center;
  color: #fff;
}
.bl-sb-nl-icon { font-size: 32px; margin-bottom: 0.75rem; }
.bl-sb-newsletter h4 { font-size: 17px; font-weight: 700; margin-bottom: 0.4rem; }
.bl-sb-newsletter p  { font-size: 13px; color: rgba(255,255,255,0.65); line-height: 1.5; margin-bottom: 1rem; }
.bl-sb-nl-form { display: flex; flex-direction: column; gap: 8px; }
.bl-sb-nl-form input {
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.15);
  background: rgba(255,255,255,0.08);
  color: #fff;
  font-size: 13px;
  outline: none;
}
.bl-sb-nl-form input::placeholder { color: rgba(255,255,255,0.4); }
.bl-sb-nl-form button {
  padding: 10px;
  background: #2ec27e;
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: background .2s;
}
.bl-sb-nl-form button:hover { background: #25a86c; }
.bl-sb-nl-note { font-size: 11px; color: rgba(255,255,255,0.4); margin-top: 0.5rem; display: block; }

/* Topics widget */
.bl-sb-widget {
  background: var(--white);
  border: 1px solid var(--ink-20);
  border-radius: 16px;
  padding: 1.5rem;
}
.bl-sb-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--ink-20);
}
.bl-sb-cats { display: flex; flex-direction: column; gap: 4px; }
.bl-sb-cat {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 10px;
  text-decoration: none;
  color: var(--ink);
  font-size: 13px;
  transition: background .2s;
}
.bl-sb-cat:hover { background: var(--green-50); }
.bl-sb-cat-name { flex: 1; font-weight: 500; }
.bl-sb-cat-count {
  font-size: 11px;
  color: var(--ink-60);
  background: var(--ink-20);
  padding: 2px 7px;
  border-radius: 50px;
}

/* Affiliate widget */
.bl-sb-aff {
  background: linear-gradient(135deg, #fff8e1 0%, #fffbf0 100%);
  border: 1px solid #f0c040;
  border-radius: 16px;
  padding: 1.5rem;
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.5rem;
  transition: transform .2s, box-shadow .2s;
}
.bl-sb-aff:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(240,192,64,0.2); }
.bl-sb-aff-badge { font-size: 11px; font-weight: 700; color: #b8860b; letter-spacing: 0.5px; }
.bl-sb-aff-icon  { font-size: 40px; }
.bl-sb-aff-body  { display: flex; flex-direction: column; gap: 2px; }
.bl-sb-aff-body strong { font-size: 14px; font-weight: 700; color: var(--ink); }
.bl-sb-aff-body span   { font-size: 12px; color: var(--ink-60); }
.bl-sb-aff-stars { color: #f0c040; font-size: 13px; }
.bl-sb-aff-btn   { font-size: 13px; font-weight: 700; color: #b8860b; }

/* ── Responsive ── */
@media (max-width: 1024px) {
  .bl-grid { grid-template-columns: repeat(2, 1fr); }
  .bl-layout { grid-template-columns: 1fr 260px; gap: 2rem; }
}
@media (max-width: 768px) {
  .bl-hero { padding: 3rem 5% 2.5rem; }
  .bl-hero-title { font-size: 2rem; }
  .bl-featured { grid-template-columns: 1fr; }
  .bl-feat-img { min-height: 220px; }
  .bl-layout { grid-template-columns: 1fr; padding: 2rem 5% 3rem; }
  .bl-sidebar { display: none; }
  .bl-grid { grid-template-columns: 1fr; gap: 1.25rem; }
  .bl-featured-wrap { margin-top: 2rem; }
}
@media (max-width: 480px) {
  .bl-cats { gap: 6px; }
  .bl-cat-pill { font-size: 11px; padding: 4px 10px; }
}