/* HireUA long-form guide — ported from hireua-long-form-guide-final.html (header/footer CSS removed). */
:root {
  --dark:var(--hu-navy);--dark2:var(--hu-navy-2);--blue:var(--hu-blue);--yellow:var(--hu-yellow);--yellow-hover:var(--hu-yellow-hover);
  --ink:var(--hu-ink);--muted:var(--hu-muted);--surface:var(--hu-surface);--line:var(--hu-line);
}
.hu-tpl-guide * {box-sizing:border-box}
html {scroll-behavior:smooth}
body {
  margin:0;color:var(--ink);background:var(--hu-white);
  font-family:Inter, "Inter Fallback",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.hu-tpl-guide a {color:inherit;text-decoration:none}
.hu-tpl-guide img {max-width:100%;display:block}
.wrap {width:min(1180px,calc(100% - 48px));margin:0 auto}
.eyebrow {
  font-size:11px;line-height:1;font-weight:800;letter-spacing:.16em;
  text-transform:uppercase;color:var(--blue);
}
@media(max-width:560px){
.wrap {width:min(100% - 28px,1180px)}
}
.article-hero {background:var(--hu-white);padding:70px 0 58px;border-bottom:1px solid var(--line)}
.article-hero-inner {max-width:1010px}
.article-hero h1 {max-width:980px;margin:14px 0 20px;font-size:clamp(52px,6vw,82px);line-height:.96;letter-spacing:-.055em;color:var(--dark)}
.article-hero h1 span {color:var(--blue)}
.article-dek {max-width:860px;margin:0;color:#53617a;font-size:20px;line-height:1.55}
.byline {display:flex;align-items:center;gap:13px;margin-top:28px;color:var(--hu-muted);font-size:12px;line-height:1.5}
.avatar {width:42px;height:42px;border-radius:999px;background:var(--dark);color:var(--yellow);display:grid;place-items:center;font-weight:850}
.article-shell {padding:52px 0 0}
.article-grid {display:grid;grid-template-columns:220px minmax(0,760px);gap:58px;align-items:start}
.toc-wrap {position:sticky;top:100px}
.toc {border-left:1px solid #cfd8e5;padding-left:14px}
.toc-label {margin-bottom:12px;color:var(--blue);font-size:10px;letter-spacing:.13em;text-transform:uppercase;font-weight:850}
.toc a {display:block;padding:7px 0;color:var(--hu-muted);font-size:12px;line-height:1.4}
.toc a:hover {color:var(--blue)}
.left-cta {margin-top:22px;background:var(--dark);color:var(--hu-white);border-radius:7px;padding:20px}
.left-cta .eyebrow {color:var(--yellow)}
.left-cta h3 {margin:10px 0 8px;font-size:20px;line-height:1.15}
.left-cta p {margin:0;color:var(--hu-on-dark);font-size:12px;line-height:1.5}
.left-cta a {display:flex;align-items:center;justify-content:center;margin-top:16px;min-height:48px;padding:0 12px;background:var(--yellow);color:var(--dark);border-radius:5px;font-size:12px;font-weight:800;text-align:center}
.article-content {min-width:0}
.article-content .lead {font-size:22px;line-height:1.5;color:#27344b}
.article-content p {margin:0 0 21px;color:var(--hu-text-body);font-size:17px;line-height:1.75}
.article-content h2 {scroll-margin-top:110px;margin:64px 0 20px;font-size:40px;line-height:1.08;letter-spacing:-.04em;color:var(--dark)}
.article-content h3 {margin:38px 0 14px;font-size:27px;line-height:1.15;letter-spacing:-.025em;color:var(--dark)}
.article-content ul,
.article-content ol {margin:0 0 22px;padding-left:24px}
.article-content li {margin:8px 0;color:var(--hu-text-body);font-size:16px;line-height:1.65}
.article-content a {color:var(--blue);text-decoration:underline;text-underline-offset:2px}
.article-content strong {color:var(--dark)}
.article-content hr {border:0;border-top:1px solid var(--line);margin:52px 0}
.article-content blockquote {margin:28px 0;padding:22px 24px;background:var(--dark);color:var(--hu-white);border-left:5px solid var(--yellow);border-radius:6px;font-size:24px;line-height:1.4;font-weight:760}
.article-content blockquote small {display:block;margin-top:10px;color:#a9b6c9;font-size:10px;letter-spacing:.12em;text-transform:uppercase}
.article-content table {width:100%;border-collapse:collapse;margin:26px 0 34px;font-size:14px}
.article-content th {background:var(--blue);color:var(--hu-white);text-align:left;padding:13px;border:1px solid var(--hu-line)}
.article-content td {padding:13px;border:1px solid var(--hu-line);vertical-align:top}
.article-content .inline-cta {background:var(--surface);border:1px solid var(--line);border-radius:7px;padding:22px;margin:34px 0}
@media(max-width:980px){
.article-grid {grid-template-columns:1fr}
.toc-wrap {position:static}
.toc {display:grid;grid-template-columns:1fr 1fr;gap:0 20px;border-left:0;border-top:1px solid var(--line);padding:16px 0 0}
.left-cta {max-width:480px}
}
@media(max-width:560px){
.article-hero {padding:50px 0 42px}
.article-hero h1 {font-size:48px}
.article-dek {font-size:18px}
.toc {grid-template-columns:1fr}
.article-content h2 {font-size:34px}
.article-content h3 {font-size:24px}
.article-content p {font-size:16px}
}
:root {--dark:var(--hu-navy);--blue:var(--hu-blue);--yellow:var(--hu-yellow);--line:var(--hu-line);--muted:var(--hu-muted);}
.article-hero {padding:74px 0 56px!important}
.article-hero h1 {color:var(--dark)!important}
.article-hero .title-segment {color:var(--dark)!important}
.article-hero .title-accent {color:var(--blue)!important}
.article-dek {max-width:900px!important}
.key-takeaways-section {padding:18px 0 62px!important;background:var(--hu-white)!important}
.key-takeaways-wrap {max-width:1010px!important}
/* v0.3.2 Key Takeaways card: Electric Yellow, navy type, darker-yellow border */
.key-takeaways {background:var(--hu-yellow)!important;color:var(--hu-navy)!important;border:1px solid var(--hu-yellow-hover)!important;border-radius:8px!important;padding:30px 32px!important}
.key-takeaways-heading {margin:0 0 16px!important;font-size:26px!important;line-height:1.15!important;font-weight:850!important;letter-spacing:-.025em!important;color:var(--hu-navy)!important}
.key-takeaways-list {display:grid!important;gap:0!important;margin:0!important;padding:0!important;list-style:none!important}
.takeaway-row {display:grid!important;grid-template-columns:56px 1fr!important;gap:18px!important;align-items:baseline!important;margin:0!important;padding:18px 0!important;border-top:1px solid rgba(var(--hu-navy-rgb),.15)!important}
.takeaway-row::marker {content:none}
.takeaway-row:first-child {border-top:0!important;padding-top:4px!important}
.takeaway-row:last-child {padding-bottom:2px!important}
.takeaway-number {font-size:26px!important;line-height:1!important;font-weight:900!important;letter-spacing:-.04em!important;color:var(--hu-navy)!important;font-variant-numeric:tabular-nums}
.takeaway-row p {margin:0!important;font-size:16px!important;line-height:1.55!important;color:var(--hu-navy)!important}
.takeaway-row p a {color:var(--hu-navy)!important;text-decoration:underline}
.article-content p,
.article-content p:first-child {font-size:17px!important;line-height:1.75!important}
.article-content .proof-company-pill {display:inline-flex!important;align-items:center!important;min-height:25px!important;padding:0 9px!important;border-radius:999px!important;background:var(--yellow)!important;color:var(--dark)!important;font-size:9px!important;font-weight:850!important;letter-spacing:.09em!important;margin-bottom:10px!important}
.faq-item {padding:22px 0!important;border-top:1px solid var(--line)!important}
.faq-item:last-of-type {border-bottom:1px solid var(--line)!important}
.faq-item h3 {margin:0 0 10px!important;font-size:22px!important}
@media(max-width:700px){
.takeaway-row {grid-template-columns:38px 1fr!important}
}

/* ---- v0.2.0 additions: blocks the mockup rendered without dedicated CSS ---- */
.hu-tpl-guide .article-grid.no-toc {grid-template-columns:minmax(0,760px);justify-content:center}
.toc-quiet-cta {margin-top:22px;padding-left:15px;display:grid;gap:6px;font-size:12px;color:var(--hu-muted)}
.toc-quiet-cta a {color:var(--blue);font-weight:800}
.article-content h2[id] {scroll-margin-top:96px}
.article-content figure {margin:28px 0}
.article-content img {height:auto;border-radius:8px}
.article-content ul {padding-left:22px}
.article-content .callout {margin:30px 0;padding:24px 26px;background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--blue);border-radius:8px}
.article-content .callout h3 {margin-top:0}
.article-content .w5-grid {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:24px 0}
.article-content .w5-grid > div {padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:8px;font-size:14px}
.article-content table.compare, .article-content .wp-block-table table {width:100%;border-collapse:collapse;margin:24px 0;font-size:15px}
.author-box {display:flex;gap:22px;align-items:flex-start;margin:56px 0 0;padding:28px;background:var(--surface);border:1px solid var(--line);border-radius:10px}
.author-avatar-large {flex:0 0 80px;width:80px;height:80px;border-radius:999px;background:var(--dark);color:var(--yellow);display:grid;place-items:center;font-weight:850;font-size:24px;overflow:hidden}
.author-avatar-large img {width:100%;height:100%;object-fit:cover}
.author-copy h3 {margin:8px 0 6px !important;font-size:24px !important}
.author-copy p {margin:0 !important;font-size:15px !important;color:#53617a}
.article-bottom-cta {margin:40px 0 0;padding:40px;background:var(--yellow);color:var(--dark);border-radius:12px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:center}
.article-bottom-cta .eyebrow {color:var(--dark)}
.article-bottom-cta h2 {margin:10px 0 10px !important;font-size:clamp(30px,3.6vw,44px) !important;line-height:1 !important;letter-spacing:-.04em;color:var(--dark)}
.article-bottom-cta p {margin:0 !important;font-size:16px !important;color:var(--hu-dark-line)}
.article-bottom-cta-button {display:inline-flex;align-items:center;gap:12px;min-height:56px;padding:0 24px;background:var(--dark);color:var(--hu-white) !important;border-radius:6px;font-weight:800;font-size:15px;white-space:nowrap;text-decoration:none !important}
.article-bottom-cta-button span {color:var(--yellow)}
.related-guides {margin:56px 0 80px}
.related-guides h2 {margin:10px 0 22px !important;font-size:34px !important}
.related-guides-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.related-guide-card {display:flex;flex-direction:column;gap:8px;padding:22px;border:1px solid var(--line);border-radius:10px;background:var(--hu-white);text-decoration:none !important;transition:border-color .15s, box-shadow .15s}
.related-guide-card:hover {border-color:var(--blue);box-shadow:0 12px 30px rgba(var(--hu-navy-rgb),.08)}
.related-guide-card span {font-size:10px;letter-spacing:.14em;font-weight:850;color:var(--blue)}
.related-guide-card h3 {margin:0 !important;font-size:19px !important;line-height:1.2 !important;color:var(--dark)}
.related-guide-card p {margin:0 !important;font-size:14px !important;line-height:1.5 !important;color:var(--hu-muted)}
.related-guide-card b {margin-top:auto;font-size:13px;color:var(--dark)}
@media (max-width:860px){
.article-bottom-cta {grid-template-columns:1fr;padding:28px}
.related-guides-grid {grid-template-columns:1fr}
.article-content .w5-grid {grid-template-columns:1fr 1fr}
}
@media (max-width:560px){ .author-box {flex-direction:column} }

/* v0.3.0 Deep / Electric interaction states (colour only) */
.left-cta a {transition:background-color .16s ease,color .16s ease}
.left-cta a:hover,.left-cta a:focus-visible,.left-cta a:active {background:var(--hu-cta-hover-bg);color:var(--hu-cta-hover-fg)}
.article-content a:hover,.toc-quiet-cta a:hover {color:var(--hu-link-hover)}
.article-bottom-cta-button {transition:background-color .16s ease}
/* navy button -> darker navy; white label and yellow arrow unchanged */
.article-bottom-cta-button:hover,.article-bottom-cta-button:focus-visible,.article-bottom-cta-button:active {background:var(--hu-btn-dark-hover-bg)}

/* v0.3.2: the 'On this page' TOC and its 'Need help hiring? Start Hiring' box
   are desktop-only. At the single-column breakpoint (<=980px) they are hidden
   and the article runs full width. */
@media (max-width:980px){
.hu-tpl-guide .toc-wrap {display:none!important}
.hu-tpl-guide .article-grid {grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
.key-takeaways {padding:24px 20px!important}
.key-takeaways-heading {font-size:22px!important}
.takeaway-number {font-size:22px!important}
.takeaway-row p {font-size:15px!important}
}
/* v0.3.2: in-body ToC blocks never show on guides (template also strips them) */
.hu-tpl-guide .wp-block-yoast-seo-table-of-contents,
.hu-tpl-guide .yoast-table-of-contents {display:none!important}

/* v0.3.7 Key Takeaways spacing: modest gap above the card (below the
   header/meta divider) and ~36px / 24px between the card and the article. */
.key-takeaways-section {padding:24px 0 0!important}
.key-takeaways-section + .article-shell {padding-top:36px!important}
@media (max-width:700px){
.key-takeaways-section {padding-top:20px!important}
.key-takeaways-section + .article-shell {padding-top:24px!important}
}

/* v0.3.18 Hero style (inc/hero-style.php): Default White; Dark / Electric Yellow on request.
   Colours come from heroes.css (.hu-hero--dark|yellow variables); layout unchanged. */
.article-hero.is-hero-custom:is(.hu-hero--dark, .hu-hero--yellow) {background:var(--hero-bg);border-bottom-color:var(--hero-edge)}
.article-hero.is-hero-custom:is(.hu-hero--dark, .hu-hero--yellow) .eyebrow {color:var(--hero-kicker)}
.article-hero.is-hero-custom:is(.hu-hero--dark, .hu-hero--yellow) h1,
.article-hero.is-hero-custom:is(.hu-hero--dark, .hu-hero--yellow) .title-segment {color:var(--hero-heading)!important}
.article-hero.is-hero-custom:is(.hu-hero--dark, .hu-hero--yellow) .title-accent {color:var(--hero-accent)!important}
.article-hero.is-hero-custom:is(.hu-hero--dark, .hu-hero--yellow) .article-dek {color:var(--hero-soft)}
.article-hero.is-hero-custom:is(.hu-hero--dark, .hu-hero--yellow) .byline {color:var(--hero-soft)}
.article-hero.is-hero-custom:is(.hu-hero--dark, .hu-hero--yellow) .byline strong {color:var(--hero-heading)}
.article-hero.is-hero-custom.hu-hero--dark .avatar {background:var(--hu-yellow);color:var(--hu-navy)}

/* v0.3.47 Mobile "On this page": the sidebar TOC is hidden at <=980px (v0.3.2), so
   the same list shows as a collapsible navy card above the article. Links land
   below the sticky header (scroll-margin-top) and the card closes after a tap
   (hireua-theme.js). Desktop is unchanged. */
.hu-toc-mobile {display:none}
@media (max-width:980px){
.hu-tpl-guide .article-grid {row-gap:28px}
.hu-tpl-guide .hu-toc-mobile {display:block;margin:0;background:var(--hu-navy);color:var(--hu-white);border-radius:8px;border-left:5px solid var(--hu-yellow);overflow:hidden}
.hu-toc-mobile summary {display:flex;align-items:center;gap:12px;min-height:56px;padding:12px 18px;cursor:pointer;list-style:none;-webkit-tap-highlight-color:transparent}
.hu-toc-mobile summary::-webkit-details-marker {display:none}
.hu-toc-mobile summary::marker {content:none}
.hu-toc-mobile summary::after {content:"";flex:0 0 auto;width:9px;height:9px;margin:-4px 4px 0 0;border:solid var(--hu-yellow);border-width:0 2.5px 2.5px 0;transform:rotate(45deg);transition:transform .18s ease}
.hu-toc-mobile[open] summary::after {margin-top:4px;transform:rotate(-135deg)}
.hu-toc-mobile summary:focus-visible {outline:2px solid var(--hu-yellow);outline-offset:-4px}
.hu-toc-mobile-label {color:var(--hu-yellow);font-size:12px;letter-spacing:.13em;text-transform:uppercase;font-weight:850}
.hu-toc-mobile-count {margin-left:auto;color:var(--hu-on-dark,#c9d3e3);font-size:13px;font-weight:600}
.hu-toc-mobile ol {margin:0;padding:4px 18px 14px;list-style:none;counter-reset:hutoc;border-top:1px solid rgba(255,255,255,.12)}
.hu-toc-mobile li {counter-increment:hutoc;margin:0;border-top:1px solid rgba(255,255,255,.08)}
.hu-toc-mobile li:first-child {border-top:0}
.hu-toc-mobile a {display:grid;grid-template-columns:30px 1fr;align-items:baseline;padding:11px 0;color:var(--hu-white);font-size:15px;line-height:1.4;font-weight:600;text-decoration:none}
.hu-toc-mobile a::before {content:counter(hutoc,decimal-leading-zero);color:var(--hu-yellow);font-size:12px;font-weight:850;font-variant-numeric:tabular-nums}
.hu-toc-mobile a:hover,.hu-toc-mobile a:focus-visible {color:var(--hu-yellow)}
}
/* Sticky header clearance for every in-guide anchor target (h2 already had it). */
.hu-tpl-guide .article-content [id] {scroll-margin-top:96px}

/* v0.3.60 Batch 4: post buttons (legacy/imported/scheduled) use the theme's yellow button */
.article-content .wp-block-buttons.hu-post-btns { display: flex; flex-wrap: wrap; gap: 12px; margin: 28px 0 !important; }
.article-content .wp-block-button.hu-post-btn { width: auto !important; margin: 0 !important; }
.article-content .wp-block-button.hu-post-btn .wp-block-button__link {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 14px 26px !important;
	border-radius: 5px !important; background: var(--hu-yellow, #FFF04A) !important; color: var(--hu-navy, #07152A) !important;
	font-size: 16px !important; font-weight: 850; line-height: 1.2; text-decoration: none !important; border: 0 !important; box-shadow: none;
}
.article-content .wp-block-button.hu-post-btn .wp-block-button__link:is(:hover, :focus-visible) { background: #E6D52F !important; color: var(--hu-navy, #07152A) !important; }
@media (max-width: 600px) { .article-content .wp-block-button.hu-post-btn, .article-content .wp-block-button.hu-post-btn .wp-block-button__link { width: 100% !important; } }

/* v0.3.60 Batch 4: table of contents = light grey box with blue accents (desktop + mobile); Key Takeaways stays yellow */
.hu-tpl-guide .toc-wrap .toc { background: #F3F5F9; border: 1px solid #E3E8F0; border-left: 4px solid var(--hu-blue, #155EEF); border-radius: 8px; padding: 16px 16px 12px 16px; }
.hu-tpl-guide .toc-wrap .toc a { color: #334155; }
.hu-tpl-guide .toc-wrap .toc a:hover { color: var(--hu-blue, #155EEF); }
.hu-tpl-guide .hu-toc-mobile { background: #F3F5F9 !important; color: var(--hu-navy, #07152A) !important; border: 1px solid #E3E8F0; border-left: 5px solid var(--hu-blue, #155EEF) !important; }
.hu-toc-mobile summary::after { border-color: var(--hu-blue, #155EEF) !important; }
.hu-toc-mobile summary:focus-visible { outline-color: var(--hu-blue, #155EEF) !important; }
.hu-toc-mobile-label { color: var(--hu-blue, #155EEF) !important; }
.hu-toc-mobile-count { color: #5B6B82 !important; }
.hu-toc-mobile ol { border-top-color: #E3E8F0 !important; }
.hu-toc-mobile li { border-top-color: #E8ECF3 !important; }
.hu-toc-mobile a { color: var(--hu-navy, #07152A) !important; }
.hu-toc-mobile a::before { color: var(--hu-blue, #155EEF) !important; }
.hu-toc-mobile a:hover, .hu-toc-mobile a:focus-visible { color: var(--hu-blue, #155EEF) !important; }

/* v0.3.60 Batch 4: Kyle's author box on long-form blog posts (copied from founder-file.css) */
.hu-tpl-guide .ff-hero.is-hero-custom.hu-hero--yellow .ff-optin {background:var(--hu-white);box-shadow:0 18px 44px rgba(var(--hu-navy-rgb),.14)} /* no yellow box on a yellow hero */

/* v0.3.46 Founder Files author box: navy card, yellow accents, Kyle's photo, Book a call + More Founder Files. */
.hu-tpl-guide .ff-author {margin-top:40px;padding:30px;border-radius:12px;display:grid;grid-template-columns:132px minmax(0,1fr);gap:28px;align-items:start;
  background:radial-gradient(circle at 88% 12%, rgba(var(--hu-blue-rgb),.30), transparent 42%),linear-gradient(135deg,var(--navy),var(--hu-navy-mid));color:var(--hu-white);box-shadow:0 18px 44px rgba(var(--hu-navy-rgb),.16)}
.hu-tpl-guide .ff-author-media {position:relative;width:132px;height:132px}
.hu-tpl-guide .ff-author-media img, .ff-author-initials {width:132px;height:132px;border-radius:50%;object-fit:cover;display:block;border:3px solid var(--yellow);box-shadow:0 0 0 6px rgba(var(--hu-yellow-rgb),.14)}
.hu-tpl-guide .ff-author-initials {display:grid;place-items:center;background:var(--navy);color:var(--yellow);font-weight:850;font-size:36px}
.hu-tpl-guide .ff-author-eyebrow {font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:var(--yellow)}
.hu-tpl-guide .ff-author-name {margin:6px 0 2px;font-size:28px;line-height:1.1;letter-spacing:-.03em;font-weight:850;color:var(--hu-white)}
.hu-tpl-guide .ff-author-role {font-size:13px;font-weight:650;color:#B9C8DA}
.hu-tpl-guide .ff-author-bio {margin:14px 0 20px;font-size:15px;line-height:1.65;color:#DCE6F2}
.hu-tpl-guide .ff-author-actions {display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px}
.hu-tpl-guide .ff-author-btn {display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 20px;border-radius:5px;border:1px solid var(--hu-yellow-edge);background:var(--yellow);color:var(--navy) !important;font-size:14px;font-weight:850;text-decoration:none !important;transition:background-color .16s ease,transform .16s ease}
.hu-tpl-guide .ff-author-btn:is(:hover,:focus-visible,:active) {background:var(--yellow-hover);transform:translateY(-1px)}
.hu-tpl-guide .ff-author-link {font-size:14px;font-weight:800;color:var(--hu-white) !important;text-decoration:none !important;border-bottom:2px solid rgba(var(--hu-yellow-rgb),.7);padding-bottom:2px}
.hu-tpl-guide .ff-author-link:is(:hover,:focus-visible) {color:var(--yellow) !important}
.hu-tpl-guide .ff-author-btn:focus-visible, .ff-author-link:focus-visible, .ff-author-socials a:focus-visible {outline:3px solid var(--yellow);outline-offset:3px}
.hu-tpl-guide .ff-author-socials {list-style:none;margin:18px 0 0;padding:14px 0 0;border-top:1px solid rgba(255,255,255,.12);display:flex;flex-wrap:wrap;gap:8px 16px}
.hu-tpl-guide .ff-author-socials a {font-size:12px;font-weight:700;color:#B9C8DA !important;text-decoration:none !important}
@media(max-width:640px){
  .ff-author {grid-template-columns:1fr;gap:18px;padding:24px 20px}
  .ff-author-media, .ff-author-media img, .ff-author-initials {width:96px;height:96px}
  .ff-author-btn {width:100%;justify-content:center}
}
.hu-tpl-guide .article-content .ff-author h2.ff-author-name{margin:6px 0 2px}
.hu-tpl-guide .ff-author{--navy:var(--hu-navy)}