/* ==========================================================================
   MemoHoney blog section — get-memo-honey.com/blog/
   Loaded in addition to style.css. Prefix: hb-
   ========================================================================== */

.hb-hero{
  background:
    radial-gradient(760px 320px at 82% -10%, rgba(242,193,78,.34), transparent 62%),
    linear-gradient(180deg,#fffdf8,var(--hx-cream-2));
  border-bottom:1px solid var(--hx-line);
  padding:clamp(34px,5vw,62px) 0 clamp(30px,4vw,48px);
}
.hb-hero h1{ margin-bottom:.6rem; }
.hb-kicker{
  font-family:var(--hx-mono); font-size:.7rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--hx-honey-d); margin-bottom:.6rem; display:block;
}

/* ------------------------------------------------------------ index grid */
.hb-filters{ display:flex; flex-wrap:wrap; gap:.5rem; margin:1.4rem 0 0; }
.hb-chip{
  display:inline-block; padding:.42rem .95rem; border-radius:999px;
  border:1px solid var(--hx-line); background:var(--hx-white);
  font-size:.82rem; font-weight:600; color:var(--hx-ink-2); text-decoration:none;
  transition:background .18s ease,color .18s ease,border-color .18s ease;
}
.hb-chip:hover,.hb-chip.is-on{ background:var(--hx-ink); color:var(--hx-honey-l); border-color:var(--hx-ink); text-decoration:none; }

.hb-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1.15rem; }
.hb-card{
  display:flex; flex-direction:column; background:var(--hx-white);
  border:1px solid var(--hx-line); border-radius:18px; padding:1.35rem;
  box-shadow:0 10px 30px rgba(84,62,18,.08); height:100%;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.hb-card:hover{ transform:translateY(-4px); box-shadow:0 22px 48px rgba(64,46,12,.15); border-color:#e0d1b3; }
.hb-card__cat{
  font-family:var(--hx-mono); font-size:.65rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--hx-honey-d); margin-bottom:.6rem; display:block;
}
.hb-card h2,.hb-card h3{ font-size:1.04rem; line-height:1.34; margin-bottom:.5rem; }
.hb-card h2 a,.hb-card h3 a{ color:var(--hx-ink); }
.hb-card h2 a:hover,.hb-card h3 a:hover{ color:var(--hx-honey-d); text-decoration:none; }
.hb-card p{ font-size:.92rem; color:var(--hx-ink-3); margin-bottom:1rem; }
.hb-card__foot{
  margin-top:auto; display:flex; justify-content:space-between; align-items:center;
  gap:.6rem; font-size:.77rem; color:var(--hx-ink-3);
  border-top:1px dashed var(--hx-line); padding-top:.75rem;
}
.hb-card__more{ font-weight:700; color:var(--hx-honey-d); white-space:nowrap; }

/* -------------------------------------------------------------- article */
.hb-article{ padding:clamp(28px,4vw,52px) 0 clamp(40px,6vw,72px); }
.hb-body{ max-width:788px; font-size:17.5px; }
.hb-body h2{
  font-size:clamp(1.4rem,2.9vw,1.92rem); margin:2.35rem 0 .7rem;
  padding-top:.35rem; position:relative;
}
.hb-body h2::before{
  content:""; display:block; width:34px; height:4px; border-radius:99px;
  background:linear-gradient(90deg,var(--hx-honey),var(--hx-honey-d)); margin-bottom:.85rem;
}
.hb-body h3{ font-size:1.16rem; margin:1.6rem 0 .45rem; }
.hb-body p{ margin-bottom:1.1rem; }
.hb-body ul,.hb-body ol{ margin:0 0 1.2rem; padding-left:1.35rem; }
.hb-body li{ margin-bottom:.5rem; }
.hb-body blockquote{
  margin:1.5rem 0; padding:1rem 1.3rem; border-left:4px solid var(--hx-honey);
  background:var(--hx-cream-2); border-radius:0 14px 14px 0; font-size:1.02rem; color:var(--hx-ink-2);
}
.hb-body blockquote p:last-child{ margin-bottom:0; }
.hb-lead{ font-size:1.1rem; color:var(--hx-ink-2); }

.hb-meta{
  display:flex; flex-wrap:wrap; gap:.5rem 1.15rem; align-items:center;
  font-size:.83rem; color:var(--hx-ink-3); margin-bottom:1.1rem;
}
.hb-meta__dot{ width:4px; height:4px; border-radius:50%; background:var(--hx-line); }
.hb-byline{
  display:flex; gap:.85rem; align-items:center; background:var(--hx-white);
  border:1px solid var(--hx-line); border-radius:16px; padding:.9rem 1.1rem;
  font-size:.85rem; color:var(--hx-ink-3); margin-bottom:1.6rem;
}
.hb-byline b{ color:var(--hx-ink); }
.hb-byline__av{
  width:44px; height:44px; flex:none; display:grid; place-items:center;
  background:linear-gradient(140deg,var(--hx-honey-l),var(--hx-honey-d)); color:#1d1507;
  clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);
  font-family:var(--hx-display); font-weight:800; font-size:.95rem;
}

.hb-key{
  background:var(--hx-white); border:1px solid var(--hx-line); border-left:5px solid var(--hx-honey);
  border-radius:16px; padding:1.2rem 1.35rem; margin:0 0 1.7rem;
  box-shadow:0 10px 30px rgba(84,62,18,.07);
}
.hb-key h2{ font-size:.98rem !important; margin:0 0 .55rem !important; font-family:var(--hx-mono);
  letter-spacing:.14em; text-transform:uppercase; color:var(--hx-ink-3); }
.hb-key h2::before{ display:none; }
.hb-key p{ margin-bottom:0; font-size:1.01rem; color:var(--hx-ink-2); }

.hb-toc{
  background:var(--hx-cream-2); border:1px solid var(--hx-line); border-radius:16px;
  padding:1.1rem 1.3rem; margin-bottom:1.8rem;
}
.hb-toc p{ font-family:var(--hx-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--hx-ink-3); margin-bottom:.55rem; }
.hb-toc ol{ margin:0; padding-left:1.2rem; font-size:.94rem; }
.hb-toc li{ margin-bottom:.28rem; }

.hb-cta{
  background:linear-gradient(135deg,#1e1709,#2e2411 62%,#1e1709);
  border-radius:20px; padding:1.5rem 1.6rem; margin:2rem 0; color:#ded3c0;
  border:1px solid #3a2f18;
}
.hb-cta h3{ color:#fff; font-size:1.16rem; margin-bottom:.5rem; }
.hb-cta p{ color:#c4b8a3; font-size:.95rem; margin-bottom:1.1rem; }
.hb-cta a.hx-btn{ margin-bottom:.35rem; }
.hb-cta small{ display:block; color:#93866f; font-size:.77rem; }

.hb-cta--light{
  background:linear-gradient(135deg,var(--hx-cream-2),#fff);
  border:1px solid var(--hx-line); border-left:5px solid var(--hx-honey); color:var(--hx-ink-2);
}
.hb-cta--light h3{ color:var(--hx-ink); }
.hb-cta--light p{ color:var(--hx-ink-3); }
.hb-cta--light small{ color:var(--hx-ink-3); }

.hb-table{ width:100%; border-collapse:collapse; font-size:.93rem; margin-bottom:1.4rem; }
.hb-table th,.hb-table td{ border:1px solid var(--hx-line); padding:.62rem .8rem; text-align:left; vertical-align:top; }
.hb-table th{ background:var(--hx-cream-2); color:var(--hx-ink); font-weight:700; }
.hb-tablewrap{ overflow-x:auto; margin-bottom:1.5rem; }

.hb-pros{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1rem; margin:1.5rem 0; }
.hb-pros__box{ border-radius:16px; padding:1.15rem 1.25rem; border:1px solid var(--hx-line); background:var(--hx-white); }
.hb-pros__box h3{ margin:0 0 .6rem; font-size:1.02rem; }
.hb-pros__box ul{ margin:0; padding-left:1.15rem; font-size:.93rem; }
.hb-pros__box--up{ border-color:#c8e5d7; background:#f4faf7; }
.hb-pros__box--up h3{ color:var(--hx-mint); }
.hb-pros__box--down{ border-color:#f0cdc7; background:#fdf5f3; }
.hb-pros__box--down h3{ color:var(--hx-red); }

.hb-verdict{
  border:1px solid var(--hx-line); border-radius:18px; background:var(--hx-white);
  padding:1.35rem 1.45rem; box-shadow:0 10px 30px rgba(84,62,18,.08); margin:1.7rem 0;
}
.hb-verdict__score{
  display:flex; align-items:baseline; gap:.55rem; font-family:var(--hx-display);
  font-weight:800; color:var(--hx-ink); font-size:2.3rem; line-height:1;
}
.hb-verdict__score span{ font-size:.92rem; color:var(--hx-ink-3); font-weight:600; font-family:var(--hx-text); }
.hb-verdict__stars{ color:var(--hx-honey); letter-spacing:2px; }

.hb-share{ display:flex; gap:.55rem; flex-wrap:wrap; margin:1.6rem 0 0; }

/* -------------------------------------------------------------- sidebar */
.hb-side{ position:sticky; top:calc(var(--hx-header-h) + 18px); }
.hb-widget{
  background:var(--hx-white); border:1px solid var(--hx-line); border-radius:18px;
  padding:1.25rem; margin-bottom:1.15rem; box-shadow:0 10px 30px rgba(84,62,18,.07);
}
.hb-widget h2,.hb-widget h3{ font-size:.98rem; margin-bottom:.85rem; }
.hb-widget ul{ list-style:none; padding:0; margin:0; font-size:.92rem; }
.hb-widget li{ padding:.42rem 0; border-bottom:1px dashed var(--hx-line); }
.hb-widget li:last-child{ border-bottom:0; }
.hb-widget a{ color:var(--hx-ink-2); }
.hb-widget a:hover{ color:var(--hx-honey-d); text-decoration:none; }
.hb-widget--buy{ background:linear-gradient(160deg,#1e1709,#2e2411); border-color:#3a2f18; color:#cfc3ad; text-align:center; }
.hb-widget--buy h3{ color:#fff; }
.hb-widget--buy img{ max-height:150px; margin-bottom:.85rem !important; }
.hb-widget--buy p{ font-size:.88rem; color:#bcb09a; }
.hb-widget--buy .hb-price{ font-family:var(--hx-display); font-size:1.85rem; font-weight:800; color:var(--hx-honey-l); line-height:1.1; }
.hb-widget--buy small{ display:block; color:#8f836e; font-size:.75rem; margin-top:.6rem; }

.hb-related{ border-top:1px solid var(--hx-line); margin-top:2.4rem; padding-top:1.8rem; }

.hb-pager{ display:flex; gap:.5rem; flex-wrap:wrap; justify-content:center; margin-top:2.2rem; }
.hb-pager a,.hb-pager span{
  min-width:42px; text-align:center; padding:.5rem .8rem; border-radius:11px;
  border:1px solid var(--hx-line); background:var(--hx-white); font-size:.9rem; font-weight:600;
  color:var(--hx-ink-2); text-decoration:none;
}
.hb-pager a:hover{ background:var(--hx-cream-2); color:var(--hx-honey-d); text-decoration:none; }
.hb-pager .is-on{ background:var(--hx-ink); color:var(--hx-honey-l); border-color:var(--hx-ink); }

@media (max-width:991.98px){
  .hb-side{ position:static; }
}
@media (max-width:575.98px){
  .hb-body{ font-size:16.8px; }
  .hb-grid{ grid-template-columns:1fr; }
}
