/* ============================================================
   HelmetsAdvisor — Design System (2026)
   Brick-red · warm charcoal · cream · Space Grotesk + Inter
   "Research Desk" authority · engineered, trustworthy, plain
   Ported from the tiptopsleep tts.css recipe, re-skinned to
   the helmetsadvisor brand + retokenised for helmet-safety.
   Namespace: body.ha  ·  component prefix .ha-*
   NB: existing content classes (.ha-qa/.ha-call/.ha-next/.ha-signs
   /.ha-info) are HARMONISED here to consume --ha-* tokens.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');

:root{
  /* brand */
  --ha-red:#bb3b2e; --ha-red-d:#8f2d23; --ha-red-tint:#fbeeec;
  /* neutrals (warm) */
  --ha-ink:#16130f; --ha-dark:#211d17; --ha-dark-2:#2e2920;
  --ha-cream:#f7f5ef; --ha-cream-2:#efe7d8;
  --ha-muted:#5f5a52; --ha-muted-2:#a9a296;
  --ha-card:#ffffff; --ha-line:#e3ddd0;
  /* secondary accents (pillars, cert badges) */
  --ha-amber:#e0a32e; --ha-amber-d:#b47d16;   /* "certified / pass" */
  --ha-steel:#3f6b7d; --ha-steel-d:#2f5361;   /* "standards / tech" */
  --ha-sage:#5f7a52;                            /* "safe / verified"  */
  /* effects */
  --ha-shadow:0 10px 30px -12px rgba(22,19,15,.16);
  --ha-shadow-lg:0 24px 60px -20px rgba(22,19,15,.26);
  --ha-r:16px; --ha-r-sm:11px; --ha-r-lg:26px;
  --ha-serif:'Space Grotesk',-apple-system,'Segoe UI',sans-serif; /* headings */
  --ha-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --ha-max:1160px;
}

/* ---- base ---- */
body.ha{background:var(--ha-cream);color:var(--ha-ink);font-family:var(--ha-sans);
  font-size:18px;line-height:1.7;-webkit-font-smoothing:antialiased;}
.ha h1,.ha h2,.ha h3,.ha h4{font-family:var(--ha-serif);color:var(--ha-ink);
  line-height:1.12;letter-spacing:-.02em;font-weight:700;margin:0 0 .5em;}
.ha a{color:var(--ha-red-d);text-decoration:none;}
.ha a:hover{text-decoration:underline;}

/* ---- layout ---- */
.ha-wrap{max-width:var(--ha-max);margin:0 auto;padding:0 24px;}
.ha-section{padding:84px 0;}
.ha-section--tight{padding:54px 0;}
.ha-eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--ha-sans);
  font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ha-red-d);margin-bottom:16px;}
.ha-eyebrow::before{content:"";width:26px;height:2px;background:var(--ha-red);border-radius:2px;}
.ha-lead{font-size:20px;color:var(--ha-muted);max-width:60ch;}

/* ---- buttons ---- */
.ha-btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--ha-sans);
  font-weight:600;font-size:16px;padding:15px 28px;border-radius:100px;cursor:pointer;
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease;text-decoration:none;border:0;}
.ha-btn:hover{text-decoration:none;transform:translateY(-2px);}
.ha-btn--primary{background:var(--ha-red);color:#fff;box-shadow:var(--ha-shadow);}
.ha-btn--primary:hover{background:var(--ha-red-d);color:#fff;}
.ha-btn--dark{background:var(--ha-ink);color:#fff;box-shadow:var(--ha-shadow);}
.ha-btn--dark:hover{background:var(--ha-dark-2);color:#fff;}
.ha-btn--ghost{background:transparent;color:var(--ha-ink);border:1.5px solid var(--ha-line);}
.ha-btn--ghost:hover{border-color:var(--ha-ink);color:var(--ha-ink);}
/* Button text must win AT REST over the global .ha a{color:red} (0,1,1) rule.
   Raise specificity so buttons never render red-on-red until hover. */
.ha a.ha-btn--primary,.ha a.ha-btn--primary:hover,
.ha a.ha-btn--dark,.ha a.ha-btn--dark:hover{color:#fff;}
.ha a.ha-btn--ghost,.ha a.ha-btn--ghost:hover{color:var(--ha-ink);}
/* same latent red-on-red trap for the other anchor-buttons/CTAs — force their colour over .ha a */
.ha a.ha-call-btn,.ha a.ha-call-btn:hover{color:#fff;}
.ha a.ha-toc-cta,.ha a.ha-toc-cta:hover{color:#cbc5ba;}

/* ---- cards ---- */
.ha-card{background:var(--ha-card);border:1px solid var(--ha-line);border-radius:var(--ha-r);
  box-shadow:var(--ha-shadow);overflow:hidden;}

/* ---- badges (cert / standard chips) ---- */
.ha-badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--ha-sans);font-weight:600;
  font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;padding:5px 11px;border-radius:100px;}
.ha-badge--pass{background:rgba(95,122,82,.16);color:var(--ha-sage);}
.ha-badge--cert{background:rgba(224,163,46,.18);color:var(--ha-amber-d);}
.ha-badge--std{background:rgba(63,107,125,.15);color:var(--ha-steel-d);}
.ha-badge--warn{background:var(--ha-red-tint);color:var(--ha-red-d);}

/* ---- HERO (split copy/media) ---- */
.ha-hero{position:relative;overflow:hidden;background:
  radial-gradient(120% 90% at 88% -10%, rgba(187,59,46,.12), transparent 58%),
  radial-gradient(90% 80% at 4% 112%, rgba(224,163,46,.14), transparent 55%),
  linear-gradient(180deg,#fbf9f4,#f2ece0),var(--ha-cream);}
.ha-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;padding:92px 0 82px;}
.ha-hero h1{font-size:clamp(38px,5vw,58px);font-weight:700;letter-spacing:-.03em;}
.ha-hero .ha-lead{font-size:21px;margin:22px 0 32px;}
.ha-hero-cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center;}
.ha-hero-media{position:relative;}
.ha-hero-media img{width:100%;border-radius:var(--ha-r-lg);box-shadow:var(--ha-shadow-lg);
  display:block;aspect-ratio:4/3;object-fit:cover;}
.ha-hero-badge{position:absolute;left:-18px;bottom:24px;background:#fff;border-radius:15px;
  padding:13px 18px;box-shadow:var(--ha-shadow);display:flex;align-items:center;gap:12px;
  max-width:255px;border:1px solid var(--ha-line);}
.ha-hero-badge .ha-hero-badge-ic{flex:none;width:44px;height:44px;border-radius:11px;display:grid;
  place-items:center;background:rgba(187,59,46,.12);color:var(--ha-red);}
.ha-hero-badge b{font-family:var(--ha-sans);font-size:14px;color:var(--ha-ink);display:block;}
.ha-hero-badge span{font-size:12.5px;color:var(--ha-muted);}

/* ---- trust bar ---- */
.ha-trustbar{display:flex;gap:30px;flex-wrap:wrap;justify-content:center;padding:22px 0;
  border-top:1px solid var(--ha-line);border-bottom:1px solid var(--ha-line);background:rgba(255,255,255,.5);}
.ha-trustbar span{font-family:var(--ha-sans);font-size:14.5px;color:var(--ha-muted);
  display:inline-flex;align-items:center;gap:9px;font-weight:500;}
.ha-trustbar svg{color:var(--ha-red-d);flex:none;}

/* ---- PILLARS (intent nav) ---- */
.ha-pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.ha-pillar{padding:34px 30px 30px;display:flex;flex-direction:column;text-decoration:none;color:inherit;
  transition:transform .18s ease,box-shadow .18s ease;}
.ha-pillar:hover{transform:translateY(-4px);box-shadow:var(--ha-shadow-lg);text-decoration:none;}
.ha-pillar-ic{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;margin-bottom:20px;}
.ha-pillar-ic svg{width:28px;height:28px;}
.ha-pill-1 .ha-pillar-ic{background:rgba(187,59,46,.13);color:var(--ha-red);}
.ha-pill-2 .ha-pillar-ic{background:rgba(63,107,125,.14);color:var(--ha-steel);}
.ha-pill-3 .ha-pillar-ic{background:rgba(224,163,46,.16);color:var(--ha-amber-d);}
.ha-pillar h3{font-size:22px;margin-bottom:8px;}
.ha-pillar p{color:var(--ha-muted);font-size:16px;margin:0 0 18px;flex:1;}
.ha-pillar .ha-more{font-family:var(--ha-sans);font-weight:600;font-size:15px;color:var(--ha-ink);
  display:inline-flex;gap:7px;align-items:center;}
.ha-pillar:hover .ha-more{color:var(--ha-red-d);}

/* ---- AUTHOR / research desk band ---- */
.ha-author{background:var(--ha-ink);color:#e9e5dd;border-radius:var(--ha-r-lg);
  display:grid;grid-template-columns:.7fr 1.3fr;gap:0;overflow:hidden;box-shadow:var(--ha-shadow-lg);}
.ha-author-img img{width:100%;height:100%;min-height:340px;object-fit:cover;display:block;}
.ha-author-body{padding:48px 46px;}
.ha-author-body .ha-eyebrow{color:var(--ha-amber);}
.ha-author-body h2{color:#fff;font-size:31px;}
.ha-author-body p{color:#cbc5ba;font-size:17px;}
.ha-author-sig{font-family:var(--ha-serif);font-weight:600;font-size:20px;color:var(--ha-amber);margin-top:6px;}

/* ---- GUIDES grid ---- */
.ha-guides{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.ha-guide{display:flex;flex-direction:column;text-decoration:none;color:inherit;
  transition:transform .18s ease,box-shadow .18s ease;}
.ha-guide:hover{transform:translateY(-4px);box-shadow:var(--ha-shadow-lg);text-decoration:none;}
/* absolute-fill so a portrait image can never dictate the container height
   (a flex-item container with aspect-ratio + an in-flow img{height:100%} lets
   the img's intrinsic height win — absolute removes it from flow entirely). */
.ha-guide-media{aspect-ratio:16/10;overflow:hidden;position:relative;
  background:linear-gradient(135deg,rgba(63,107,125,.2),rgba(187,59,46,.18));}
.ha-guide-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
.ha-guide-body{padding:22px 22px 24px;}
.ha-tag{font-family:var(--ha-sans);font-size:12px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ha-red-d);}
.ha-guide h3{font-size:20px;margin:8px 0 0;line-height:1.25;}

/* ---- section heads ---- */
.ha-head{text-align:center;max-width:640px;margin:0 auto 48px;}
.ha-head h2{font-size:clamp(28px,3.5vw,40px);}
.ha-head p{color:var(--ha-muted);font-size:18px;margin-top:8px;}

/* ---- disclaimer note ---- */
.ha-disc{background:var(--ha-cream-2);border:1px solid var(--ha-line);border-radius:var(--ha-r-sm);
  padding:18px 22px;font-size:14px;color:var(--ha-muted);max-width:var(--ha-max);margin:0 auto;line-height:1.6;}
.ha-disc b{color:var(--ha-ink);}

/* ============================================================
   HEADER (custom, sticky) + FOOTER
   ============================================================ */
.ha-hd{position:sticky;top:0;z-index:999;background:rgba(247,245,239,.86);
  backdrop-filter:saturate(140%) blur(12px);-webkit-backdrop-filter:saturate(140%) blur(12px);
  border-bottom:1px solid var(--ha-line);}
.ha-hd-inner{display:flex;align-items:center;justify-content:space-between;height:72px;}
.ha-logo{display:inline-flex;align-items:center;gap:11px;text-decoration:none;}
.ha-logo:hover{text-decoration:none;}
.ha-logo-mark{display:inline-flex;line-height:0;}
.ha-logo-txt{font-family:var(--ha-serif);font-weight:700;font-size:21px;letter-spacing:-.02em;line-height:1;color:var(--ha-ink);}
.ha-logo-txt em{font-style:normal;color:var(--ha-red);}
.ha-nav{display:flex;align-items:center;gap:4px;}
.ha-nav>a{font-family:var(--ha-sans);font-weight:500;font-size:15px;color:var(--ha-ink);
  padding:9px 14px;border-radius:100px;text-decoration:none;transition:background .15s,color .15s;}
.ha-nav>a:hover{background:rgba(22,19,15,.06);color:var(--ha-red-d);text-decoration:none;}
.ha-nav-cta{background:var(--ha-red)!important;color:#fff!important;padding:10px 20px!important;
  margin-left:8px;font-weight:600!important;}
.ha-nav-cta:hover{background:var(--ha-red-d)!important;color:#fff!important;}
.ha-burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;}
.ha-burger span{width:24px;height:2px;background:var(--ha-ink);border-radius:2px;transition:.2s;}

.ha-ft{background:var(--ha-ink);color:#cbc5ba;padding:62px 0 26px;margin-top:auto;}
.ha-ft-top{display:grid;grid-template-columns:1.4fr 2fr;gap:48px;padding-bottom:36px;
  border-bottom:1px solid rgba(255,255,255,.1);}
.ha-ft-brand p{color:#a49d92;font-size:15px;margin:16px 0 18px;max-width:44ch;line-height:1.6;}
.ha-ft-chips{display:flex;gap:8px;flex-wrap:wrap;}
.ha-ft-chips span{font-size:11px;font-weight:700;letter-spacing:.08em;color:#cbc5ba;
  border:1px solid rgba(255,255,255,.18);border-radius:100px;padding:4px 11px;}
.ha-ft-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.ha-ft-cols h4{font-family:var(--ha-sans);font-size:13px;letter-spacing:.12em;text-transform:uppercase;
  color:#fff;margin:0 0 12px;font-weight:600;}
.ha-ft-cols a{display:block;color:#a49d92;font-size:15px;padding:6px 0;text-decoration:none;transition:color .15s;}
.ha-ft-cols a:hover{color:var(--ha-amber);text-decoration:none;}
.ha-ft-disc{padding:24px 0;border-bottom:1px solid rgba(255,255,255,.1);}
.ha-ft-disc p{color:#89827a;font-size:12.5px;line-height:1.65;margin:0 0 10px;max-width:none;}
.ha-ft-disc b{color:#cbc5ba;}
.ha-ft-bar{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-top:22px;
  color:#7a7469;font-size:13px;font-family:var(--ha-sans);}

/* ============================================================
   SINGLE POST layout + sticky TOC sidebar
   ============================================================ */
.ha-post-grid{display:grid;grid-template-columns:minmax(0,1fr) 296px;gap:56px;align-items:start;
  padding-top:52px;padding-bottom:72px;}
.ha-post-main{min-width:0;max-width:768px;}
.ha-post-cats{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:14px;}
.ha-post-cats a{font-size:12.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ha-red-d);text-decoration:none;}
.ha-post-main h1{font-size:clamp(32px,4.4vw,46px);line-height:1.12;margin-bottom:10px;}
.ha-post-byline{display:flex;align-items:center;gap:10px;margin:14px 0 26px;color:var(--ha-muted);font-size:14.5px;}
.ha-post-byline img{width:38px;height:38px;border-radius:50%;object-fit:cover;}
.ha-post-byline b{color:var(--ha-ink);font-weight:600;}
.ha-post-hero{margin:0 0 30px;}
.ha-post-hero img{width:100%;height:auto;border-radius:var(--ha-r);border:1px solid var(--ha-line);display:block;}

.ha-post-aside{position:sticky;top:92px;display:flex;flex-direction:column;gap:18px;}
.ha-toc-card{background:#fff;border:1px solid var(--ha-line);border-radius:var(--ha-r);padding:20px 22px;box-shadow:var(--ha-shadow);}
.ha-toc-title{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ha-muted);margin-bottom:12px;}
#ha-toc{display:flex;flex-direction:column;gap:1px;}
#ha-toc a{font-size:14.5px;line-height:1.35;color:var(--ha-muted);text-decoration:none;
  padding:7px 0 7px 13px;border-left:2px solid var(--ha-line);transition:color .15s,border-color .15s;}
#ha-toc a:hover{color:var(--ha-ink);}
#ha-toc a.active{color:var(--ha-ink);border-left-color:var(--ha-red);font-weight:600;}
.ha-toc-cta{display:block;background:var(--ha-ink);color:#cbc5ba;border-radius:var(--ha-r);padding:20px 22px;
  text-decoration:none!important;font-size:13.5px;line-height:1.5;transition:background .15s;}
.ha-toc-cta:hover{background:var(--ha-dark-2);color:#cbc5ba;}
.ha-toc-cta-eyebrow{display:block;font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ha-amber);margin-bottom:9px;}
.ha-toc-cta-k{display:block;font-family:var(--ha-serif);font-weight:700;font-size:18px;color:#fff;line-height:1.2;margin-bottom:9px;}
.ha-toc-cta-sub{display:block;font-size:13.5px;color:#b3aca1;line-height:1.5;margin-bottom:13px;}
.ha-toc-cta-go{display:inline-block;font-weight:600;font-size:14px;color:var(--ha-amber);}

/* in-content prose (entry-content, restyled to system) */
.ha-post-main .entry-content{font-family:var(--ha-sans);font-size:18px;line-height:1.78;color:#38352f;}
.ha-post-main .entry-content p{margin:0 0 20px;}
.ha-post-main .entry-content h2{font-family:var(--ha-serif);font-size:28px;color:var(--ha-ink);margin:40px 0 14px;}
.ha-post-main .entry-content h3{font-family:var(--ha-serif);font-size:22px;color:var(--ha-ink);margin:30px 0 10px;}
.ha-post-main .entry-content a{color:var(--ha-red-d);text-decoration:underline;text-underline-offset:2px;}
.ha-post-main .entry-content img{border-radius:var(--ha-r);height:auto;max-width:100%;}
.ha-post-main .entry-content ul,.ha-post-main .entry-content ol{margin:0 0 20px;padding-left:22px;}
.ha-post-main .entry-content li{margin:8px 0;}
.ha-post-main .entry-content blockquote{border-left:3px solid var(--ha-red);background:var(--ha-cream-2);
  border-radius:0 12px 12px 0;padding:16px 22px;margin:24px 0;font-style:italic;color:var(--ha-ink);}

/* answer-first box (featured snippet + AI extraction) */
.entry-content .ha-answer,.ha-answer{background:linear-gradient(120deg,rgba(224,163,46,.12),rgba(63,107,125,.08)),#fff;
  border:1px solid var(--ha-line);border-left:4px solid var(--ha-red);border-radius:14px;padding:18px 22px;margin:0 0 26px;}
.ha-answer-k{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ha-red-d);margin-bottom:6px;}
.ha-answer p{margin:0;font-size:17.5px;line-height:1.6;color:var(--ha-ink);}

/* content tables (responsive, never force page h-scroll).
   IMPORTANT: scope to PLAIN tables + .ha-table only. Classed layout tables
   (roundup .btie-style-*, AAWP comparison, etc.) keep their OWN styling —
   my generic rules were clobbering the roundup product cards. */
.entry-content table:not([class]),.ha-table{display:block;width:max-content;max-width:100%;overflow-x:auto;
  border-collapse:collapse;margin:0 0 22px;font-size:15px;-webkit-overflow-scrolling:touch;}
.entry-content table:not([class]) th,.entry-content table:not([class]) td,
.ha-table th,.ha-table td{border:1px solid var(--ha-line);padding:9px 13px;text-align:left;vertical-align:top;}
.entry-content table:not([class]) thead th,.ha-table thead th{background:var(--ha-cream-2);font-weight:700;}

/* NB: the info-post components .ha-qa / .ha-call / .ha-next / .ha-signs come from
   build_info.py's OWN inline <style> (navy/orange/green). We don't redefine them here
   (that just collided + leaked flex) — instead the WP-integration section retints their
   CSS variables (--navy/--orange/--green) to the brand palette. */

/* ---- tool / our-pick card (2-col, reused by tools) ---- */
.ha-tk-card{display:flex;gap:20px;padding:22px;text-decoration:none;color:inherit;align-items:center;
  background:var(--ha-card);border:1px solid var(--ha-line);border-radius:var(--ha-r);box-shadow:var(--ha-shadow);
  transition:transform .18s ease,box-shadow .18s ease;}
.ha-tk-card:hover{transform:translateY(-3px);box-shadow:var(--ha-shadow-lg);text-decoration:none;}

/* ---- Author / Research Desk box (end of every post) ---- */
.ha-authorbox{display:flex;gap:18px;align-items:flex-start;background:var(--ha-cream-2);
  border:1px solid var(--ha-line);border-radius:var(--ha-r);padding:22px 24px;margin:36px 0 0;}
.ha-authorbox-mark{flex:none;width:52px;height:52px;border-radius:13px;display:grid;place-items:center;background:var(--ha-ink);}
.ha-authorbox-k{font-family:var(--ha-sans);font-size:11.5px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ha-red-d);}
.ha-authorbox h4{font-family:var(--ha-serif);font-size:19px;margin:5px 0 7px;color:var(--ha-ink);line-height:1.2;}
.ha-authorbox p{margin:0;font-size:14.5px;line-height:1.6;color:var(--ha-muted);}
.ha-authorbox a{color:var(--ha-red-d);font-weight:600;text-decoration:none;}
.ha-authorbox a:hover{text-decoration:underline;}
@media(max-width:600px){.ha-authorbox{flex-direction:column;gap:12px;}}

/* ---- Lead magnet: cheat-sheet email capture (injected site-wide by the plugin,
   submits to the existing ha_subscribe/Brevo backend; harmonised to brick-red) ---- */
.ha-lm{font-family:var(--ha-sans);max-width:760px;margin:34px auto;background:var(--ha-ink);
  border-radius:var(--ha-r);overflow:hidden;box-shadow:var(--ha-shadow-lg);color:#fff;}
.ha-lm *{box-sizing:border-box;}
.ha-lm-i{display:flex;flex-wrap:wrap;gap:18px;padding:22px 24px;align-items:center;}
.ha-lm-l{flex:1 1 290px;}
.ha-lm-k{display:inline-block;background:var(--ha-red);color:#fff;font-size:11px;font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;padding:4px 11px;border-radius:99px;margin-bottom:9px;}
.ha-lm-l b{display:block;font-family:var(--ha-serif);font-size:19px;line-height:1.25;margin-bottom:6px;}
.ha-lm-l p{margin:0;font-size:13.5px;line-height:1.5;color:#c9c3b8;}
.ha-lm-f{flex:1 1 240px;display:flex;flex-direction:column;gap:9px;margin:0;}
.ha-lm input[type=email]{width:100%;font-size:15px;padding:12px 14px;border:2px solid transparent;
  border-radius:9px;font-family:inherit;color:#1a1a1a;}
.ha-lm input[type=email]:focus{outline:none;border-color:var(--ha-red);}
.ha-lm-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
/* !important because TwentyTwentyOne's `button:not(:hover):not(:active):not(.has-background)`
   is specificity (0,3,1) — a plain class selector can't beat it, and the box lives inside
   .entry-content. This is a scoped component so overriding the theme default is intentional.
   Works for N boxes (sidebar clone + end-of-post). */
.ha-lm .ha-lm-f button{background:var(--ha-red)!important;color:#fff!important;border:none;font-family:inherit;
  font-weight:700;font-size:15px;padding:12px 18px;border-radius:9px;cursor:pointer;transition:filter .15s;}
.ha-lm .ha-lm-f button:hover{filter:brightness(1.08);}
.ha-lm .ha-lm-f button:disabled{opacity:.7;cursor:default;}
.ha-lm-m{font-size:13px;line-height:1.5;color:#c9c3b8;min-height:1px;}
.ha-lm-m a{color:#fff;font-weight:700;text-decoration:underline;}
/* relocated below the TOC in the desktop sidebar */
.ha-lm.ha-lm-side{max-width:none;margin:18px 0 0;}
.ha-lm.ha-lm-side .ha-lm-i{flex-direction:column;align-items:stretch;gap:13px;padding:20px 22px;}
.ha-lm.ha-lm-side .ha-lm-l{flex:0 0 auto;}
.ha-lm.ha-lm-side .ha-lm-l b{font-size:17px;}
.ha-lm.ha-lm-side .ha-lm-l p{font-size:12.5px;line-height:1.45;}
.ha-lm.ha-lm-side .ha-lm-f{flex:0 0 auto;}

/* ============================================================
   HUB / archive (intent-nav landing pages)
   ============================================================ */
.ha-hero--slim{padding:60px 0 22px;text-align:left;}
.ha-hero--slim h1{max-width:20ch;font-size:clamp(30px,4vw,46px);}
.ha-hero--slim .ha-lead{max-width:64ch;}
.ha-hub-grouphead{margin:0 0 26px;}
.ha-hub-grouphead h2{font-size:24px;margin:0;padding-bottom:12px;border-bottom:2px solid var(--ha-line);}
.ha-hub .ha-guide{background:var(--ha-card);border:1px solid var(--ha-line);border-radius:var(--ha-r);
  overflow:hidden;box-shadow:var(--ha-shadow);}
.ha-hub .ha-guide:hover{transform:translateY(-3px);box-shadow:var(--ha-shadow-lg);}
.ha-hub .ha-guide-body h3{font-size:18.5px;margin:8px 0 12px;line-height:1.3;}

/* ============================================================
   responsive
   ============================================================ */
@media(max-width:980px){
  .ha-post-grid{grid-template-columns:1fr;gap:0;}
  .ha-post-aside{position:static;margin-top:34px;}
  .ha-toc-card{display:none;}
  .ha-post-main{max-width:none;}
}
@media(max-width:900px){
  .ha-hero-grid{grid-template-columns:1fr;gap:36px;padding:62px 0 54px;}
  .ha-hero-media{order:-1;}
  .ha-pillars,.ha-guides{grid-template-columns:1fr;}
  .ha-author{grid-template-columns:1fr;}
  .ha-author-img img{min-height:250px;}
  .ha-section{padding:58px 0;}
  .ha-ft-top{grid-template-columns:1fr;gap:32px;}
  .ha-ft-cols{grid-template-columns:repeat(2,1fr);}
  .ha-ft-bar{flex-direction:column;gap:6px;}
  .ha-nav{position:fixed;left:0;right:0;top:72px;background:var(--ha-cream);flex-direction:column;
    align-items:stretch;padding:14px 24px 22px;gap:2px;border-bottom:1px solid var(--ha-line);
    box-shadow:var(--ha-shadow);transform:translateY(-145%);transition:transform .25s ease;z-index:998;}
  body.ha-menu-open .ha-nav{transform:translateY(0);}
  .ha-nav>a{padding:13px 12px;font-size:17px;}
  .ha-nav-cta{margin-left:0;text-align:center;margin-top:6px;}
  .ha-burger{display:flex;}
  .ha-call{flex-direction:column;text-align:center;align-items:center;}
  .ha-next{flex-direction:column;align-items:flex-start;}
}

/* ---- no underline on chrome/components (only in-content prose links underline) ---- */
.ha a.ha-logo,.ha a.ha-logo:hover,.ha-nav a,.ha-nav a:hover,.ha-ft a,.ha-ft a:hover,
.ha-btn,.ha-btn:hover,.ha-pillar,.ha-pillar:hover,.ha-guide,.ha-guide:hover,
.ha-more,.ha-hero-cta a,.ha-hero-cta a:hover,.ha-call-btn{text-decoration:none!important;}

/* ============================================================
   WORDPRESS INTEGRATION (TwentyTwentyOne child)  — ha-chrome
   ============================================================ */
#masthead,.site-header,#colophon,.site-footer,aside.widget-area{display:none!important;}
body.page-id-2452 .hax-disc{display:none!important;}
.single .author-bio{display:none!important;}
body.admin-bar .ha-hd{top:32px;}
@media(max-width:782px){body.admin-bar .ha-hd{top:46px;}}
.single .site-main,.archive .site-main,.blog .site-main,.search .site-main{padding-top:0;}
.single #content .entry-header,.single #content .entry-content{margin-top:0;}
@media(min-width:1000px){.single .blog-sidebar .ha-post-aside{position:sticky;top:92px;align-self:start;}}
body.admin-bar .ha-post-aside{top:124px;}
.entry-content .ha-info{--navy:var(--ha-ink);--orange:var(--ha-red);--green:var(--ha-sage);--bg:var(--ha-cream-2);--line:var(--ha-line);}
.single .entry-content .ha-next a{color:var(--ha-amber);}
/* ---- roundup comparison table (.btie-style-short) → compact cards ---- */
.entry-content table.btie-style-short{display:block!important;width:100%!important;max-width:100%!important;overflow:visible!important;border:0!important;}
.entry-content .btie-style-short tbody{display:block!important;}
.entry-content .btie-style-short tr{display:grid!important;grid-template-columns:104px minmax(0,1fr)!important;column-gap:20px!important;row-gap:0!important;align-items:center!important;background:#fff!important;border:1px solid var(--ha-line)!important;border-radius:14px!important;padding:20px 22px!important;margin:0 0 16px!important;position:relative!important;box-shadow:var(--ha-shadow)!important;height:auto!important;}
.entry-content .btie-style-short td{display:block!important;border:0!important;padding:0!important;}
.entry-content .btie-style-short .toc-det,.entry-content .btie-style-short .toc-pro1,.entry-content .btie-style-short .toc-pro2,.entry-content .btie-style-short .toc-pro3,.entry-content .btie-style-short .toc-but,.entry-content .btie-style-short .toc-rev{grid-column:2!important;grid-row:auto!important;}
.entry-content .btie-style-short .toc-img{grid-column:1!important;grid-row:1/99!important;align-self:center!important;}
.entry-content .btie-style-short .toc-img img{max-width:96px!important;max-height:96px!important;margin:0!important;border-radius:8px!important;}
.entry-content .btie-style-short .toc-det{font-family:var(--ha-serif)!important;font-size:18px!important;font-weight:700!important;line-height:1.25!important;margin-bottom:5px!important;}
.entry-content .btie-style-short .toc-pro1,.entry-content .btie-style-short .toc-pro2,.entry-content .btie-style-short .toc-pro3{font-size:13.5px!important;line-height:1.5!important;color:var(--ha-muted)!important;margin:2px 0!important;}
.entry-content .btie-style-short .toc-but{margin-top:9px!important;}
.entry-content .btie-style-short .toc-but a{background:var(--ha-red)!important;color:#fff!important;padding:8px 16px!important;border-radius:100px!important;font-weight:700!important;font-size:13.5px!important;display:inline-block!important;box-shadow:none!important;}
.entry-content .btie-style-short .toc-rev{margin-top:7px!important;font-size:13px!important;}
.entry-content .btie-style-short .toc-rev a{color:var(--ha-red-d)!important;}
.entry-content .btie-style-short .toc-tag{position:absolute!important;top:-11px!important;left:16px!important;background:var(--ha-ink)!important;color:#fff!important;font-size:10.5px!important;font-weight:700!important;letter-spacing:.06em!important;text-transform:uppercase!important;padding:4px 11px!important;border-radius:100px!important;}
.entry-content .btie-style-short .toc-tag::after{display:none!important;}
.entry-content .btie-style-short caption{display:block!important;width:100%!important;max-width:100%!important;caption-side:top!important;text-align:left!important;margin:0 0 22px!important;}
.entry-content .btie-style-short caption h2,.entry-content .btie-style-short h2{font-family:var(--ha-serif)!important;font-size:clamp(24px,3.2vw,32px)!important;line-height:1.15!important;margin:0!important;text-transform:none!important;width:auto!important;max-width:100%!important;color:var(--ha-ink)!important;font-weight:700!important;}
/* ---- roundup detailed product entries: each <li> → clean card ---- */
.entry-content ol:has(.btie-style-box){list-style:none!important;padding-left:0!important;margin:0!important;counter-reset:harank!important;}
.entry-content li:has(.btie-style-box){list-style:none!important;counter-increment:harank!important;background:#fff!important;border:1px solid var(--ha-line)!important;border-radius:16px!important;padding:24px 26px!important;margin:0 0 24px!important;box-shadow:var(--ha-shadow)!important;position:relative!important;}
.entry-content li:has(.btie-style-box)>h2{font-family:var(--ha-serif)!important;font-size:23px!important;margin:0 0 16px!important;padding-left:46px!important;position:relative!important;line-height:1.25!important;min-height:36px!important;display:flex!important;align-items:center!important;}
.entry-content li:has(.btie-style-box)>h2::before{content:counter(harank)!important;position:absolute!important;left:0!important;top:50%!important;transform:translateY(-50%)!important;width:36px!important;height:36px!important;background:var(--ha-red)!important;color:#fff!important;border-radius:50%!important;display:grid!important;place-items:center!important;font-size:16px!important;font-weight:700!important;}
.entry-content .btie-style-box{margin:0 0 4px!important;}
.entry-content .btie-style-box img{max-width:230px!important;max-height:190px!important;width:auto!important;height:auto!important;border-radius:10px!important;display:block!important;margin:0 0 12px!important;}
.entry-content .btie-style-box p{margin:0 0 10px!important;color:var(--ha-muted)!important;font-size:14px!important;}
.entry-content a.btie-style-box-button{background:var(--ha-red)!important;color:#fff!important;padding:11px 22px!important;border-radius:100px!important;display:inline-block!important;font-weight:700!important;font-size:14.5px!important;text-decoration:none!important;box-shadow:none!important;}
.entry-content a.btie-style-box-button:hover{background:var(--ha-red-d)!important;}
.entry-content .btie-style-desc{margin:14px 0 0!important;}
.entry-content .btie-style-reviews-features{list-style:none!important;margin:16px 0 0!important;padding:16px 0 0!important;border-top:1px solid var(--ha-line)!important;}
.entry-content .btie-style-reviews-features li{font-size:14.5px!important;color:var(--ha-muted)!important;padding:3px 0!important;list-style:none!important;}
.entry-content .btie-style-reviews-features li b,.entry-content .btie-style-reviews-features li strong{color:var(--ha-ink)!important;}
/* ---- single-post header + content ---- */
.single .entry-header{text-align:left;}
.single .entry-header .entry-title,.single .entry-header .intro-text,.single .entry-header .entry-top-meta,.single .post-thumbnail{text-align:left;}
.single .entry-header .intro-text{font-family:var(--ha-sans);font-size:19px;line-height:1.6;color:var(--ha-muted);margin:14px 0 18px;}
.single .entry-header .entry-top-meta{color:var(--ha-muted);font-size:14.5px;}
.single .post-thumbnail{margin:10px 0;}
.single .post-thumbnail img{border-radius:var(--ha-r);border:1px solid var(--ha-line);width:100%;height:auto;display:block;}
.single .entry-content,.archive .entry-content,.search .entry-content{font-family:var(--ha-sans);font-size:18px;line-height:1.78;color:#38352f;}
.single .entry-title,.archive-title,.page-title{font-family:var(--ha-serif)!important;font-weight:700;letter-spacing:-.02em;color:var(--ha-ink);}
.single .entry-content h2,.archive .entry-content h2,.single .entry-content h3,.archive .entry-content h3{font-family:var(--ha-serif);color:var(--ha-ink);}
.single .entry-content a,.archive .entry-content a{color:var(--ha-red-d);}
.single .entry-content blockquote{border-left:3px solid var(--ha-red);background:var(--ha-cream-2);border-radius:0 12px 12px 0;padding:16px 22px;font-style:italic;color:var(--ha-ink);}