/* ===== deploy-helpcenter-v1 (com_tb4helpcenter1) =====
   3by400 Help Center: landing (/help-center), section pages and article pages, plus the "Related guides" band on
   service pages and the Help Center tiles in the Get Support KB band. Same look as the retired KB landing
   (kb-restyle-v1 + kb-icons): white cards, 14px radius, soft shadow, 42px #F3F8E6 icon tiles with #3DB54A stroke icons,
   Lato. Every rule is scoped to .tb4-hc so nothing leaks to other pages. Nothing is hidden here. ASCII only. */
@font-face { font-family: "Lato"; src: url("/images/home-v4/fonts/Lato-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Lato"; src: url("/images/home-v4/fonts/Lato-Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Libre Baskerville"; src: url("/images/home-v4/fonts/LibreBaskerville-VariableFont_wght.ttf") format("truetype"); font-weight: 400 700; font-style: normal; font-display: swap; }
.tb4-hc {
  --green: #3DB54A; --green-dk: #2f8f3a; --green-ink: #1f6f2a; --ink: #231F20; --ink-soft: #3a3637; --muted: #5c5856;
  --line: #e6e4e1; --tint: #F3F8E6; --serif: "Libre Baskerville", Georgia, serif; --sans: "Lato", "Helvetica Neue", Arial, sans-serif;
  --gut: max(20px, calc((100vw - 1200px) / 2));
  display: block; color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.5; box-sizing: border-box;
}
.tb4-hc *, .tb4-hc *::before, .tb4-hc *::after { box-sizing: border-box; }
.tb4-hc :is(h1, h2, h3, h4, p, a, span, li, label, button, input, th, td) { text-transform: none; letter-spacing: normal; font-family: var(--sans); }
.tb4-hc :is(h1, h2, h3) { color: var(--ink); font-weight: 700; line-height: 1.2; }
.tb4-hc a { color: var(--green-dk); }
.tb4-hc a:hover { color: var(--green-ink); }
html:has(.tb4-hc-page), body:has(.tb4-hc-page) { overflow-x: clip; }
body:has(.tb4-hc-page) #tm-main.uk-section { padding-top: 0; padding-bottom: 0; }
/* full-bleed bands inside the YOOtheme container */
.tb4-hc-page > section { position: relative; width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); padding-left: var(--gut); padding-right: var(--gut); }
.tb4-hc .sp-top { background: #fff; padding-top: 34px; padding-bottom: 26px; border-bottom: 1px solid var(--line); }
.tb4-hc .crumbs { margin: 0 0 18px; font-size: 13px; color: var(--muted); }
.tb4-hc .crumbs a { color: var(--green-dk); font-weight: 700; text-decoration: none; }
.tb4-hc .crumbs span { margin: 0 6px; color: #b7b3ae; }
.tb4-hc .sp-h1 { margin: 0 0 8px; font-family: var(--serif); font-size: clamp(30px, 3.4vw, 44px); line-height: 1.12; letter-spacing: -.015em; overflow-wrap: anywhere; }
.tb4-hc .sp-lede { margin: 0 0 6px; font-size: 17px; line-height: 1.6; color: var(--ink-soft); max-width: 60ch; }
.tb4-hc .sp-work { background: var(--tint); padding-top: 40px; padding-bottom: 72px; }
.tb4-hc .hc-inner { max-width: 1200px; margin: 0 auto; }
/* search (Smart Search, GET) */
.tb4-hc form.kb-search { max-width: 720px; margin: 0 0 28px; }
.tb4-hc .hc-search-label { display: block; margin: 0 0 6px; font-size: 14px; font-weight: 700; color: var(--ink); }
.tb4-hc .hc-search-group { display: flex; align-items: stretch; background: #fff; border: 1px solid #d5d2ce; border-radius: 10px; overflow: hidden; }
.tb4-hc .hc-search-group:focus-within { border-color: var(--green); box-shadow: 0 0 0 3px rgba(61,181,74,.18); }
.tb4-hc .hc-search-cap { display: inline-flex; align-items: center; padding: 0 4px 0 16px; color: var(--muted); }
.tb4-hc .hc-search-input { flex: 1 1 auto; min-width: 0; height: 54px; padding: 0 14px; border: 0; outline: 0; background: transparent; font-size: 17px; color: var(--ink); }
.tb4-hc .hc-search-btn { flex: 0 0 auto; padding: 0 26px; border: 0; background: var(--green-dk); color: #fff; font-size: 16px; font-weight: 700; cursor: pointer; }
.tb4-hc .hc-search-btn:hover, .tb4-hc .hc-search-btn:focus-visible { background: var(--green-ink); }
.tb4-hc .hc-browse-h { margin: 0 0 14px; font-size: 20px; }
/* section cards */
.tb4-hc .kb-cat-grid { display: grid; grid-template-columns: 1fr; gap: 16px; margin: 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .tb4-hc .kb-cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .tb4-hc .kb-cat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tb4-hc .kb-card { background: #fff; border: 0; border-radius: 14px; box-shadow: 0 1px 2px rgba(35,31,32,.06), 0 14px 30px -18px rgba(35,31,32,.28); padding: 22px 22px 18px; height: 100%; }
.tb4-hc .kb-card-head { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; }
.tb4-hc .kb-cat-ic { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 10px; background: #F3F8E6; color: #3DB54A; }
.tb4-hc .kb-cat-ic svg { width: 24px; height: 24px; }
.tb4-hc .card-title { margin: 0; font-size: 18px; line-height: 1.3; }
.tb4-hc .card-title a { color: var(--ink); text-decoration: none; }
.tb4-hc .card-title a:hover { color: var(--green-ink); text-decoration: underline; }
.tb4-hc .kb-card-desc { margin: 0 0 6px; font-size: 14.5px; line-height: 1.5; color: var(--muted); }
.tb4-hc .kb-art-links { list-style: none; margin: 8px 0 0; padding: 0; }
.tb4-hc .kb-art-links li { margin: 0; padding: 8px 0; border-top: 1px solid var(--line); font-size: 15px; line-height: 1.4; }
.tb4-hc .kb-art-links li::before { content: none; }
.tb4-hc .kb-art-links a { color: var(--green-dk); text-decoration: none; }
.tb4-hc .kb-art-links a:hover { color: var(--green-ink); text-decoration: underline; }
.tb4-hc .kb-card-more { margin: 10px 0 0; font-size: 14px; font-weight: 700; }
.tb4-hc .hc-empty { margin: 0; color: var(--muted); }
/* section page: article list with intro */
.tb4-hc .hc-list { display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; max-width: 860px; }
.tb4-hc .hc-list .kb-card h2 { margin: 0 0 6px; font-size: 20px; }
.tb4-hc .hc-list .kb-card h2 a { color: var(--ink); text-decoration: none; }
.tb4-hc .hc-list .kb-card h2 a:hover { color: var(--green-ink); text-decoration: underline; }
.tb4-hc .hc-list .kb-card p { margin: 0; color: var(--ink-soft); font-size: 15.5px; line-height: 1.55; }
/* CTA band */
.tb4-hc .hc-cta { background: #fff; padding-top: 48px; padding-bottom: 56px; border-top: 1px solid var(--line); }
.tb4-hc .hc-cta .hc-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; }
.tb4-hc .hc-cta h2 { margin: 0 0 4px; font-family: var(--serif); font-size: 26px; }
.tb4-hc .hc-cta p { margin: 0; color: var(--ink-soft); }
.tb4-hc .hc-btn { display: inline-block; padding: 13px 24px; border-radius: 8px; background: var(--green-dk); color: #fff; font-weight: 700; text-decoration: none; }
.tb4-hc .hc-btn:hover, .tb4-hc .hc-btn:focus-visible { background: var(--green-ink); color: #fff; }
/* article pages (wrapper added by article/helpcenter.php only when that layout is used) */
.tb4-hc-article .tb4-hc-twin { margin: 0 0 18px; padding: 10px 14px; border-radius: 10px; background: var(--tint); font-size: 15px; }
.tb4-hc-article .tb4-hc-table { font-size: 15px; }
/* related guides band (service pages) */
.tb4-hc.hc-related { padding: 40px var(--gut) 48px; background: var(--tint); }
.tb4-hc.hc-related h2 { margin: 0 0 14px; font-family: var(--serif); font-size: 24px; }
.tb4-hc.hc-related .kb-cat-grid { max-width: 1200px; }
.tb4-hc.hc-related .hc-related-all { margin: 14px 0 0; font-weight: 700; }
@media (max-width: 860px) {
  .tb4-hc .sp-top { padding-top: 22px; padding-bottom: 20px; }
  .tb4-hc .sp-work { padding-top: 24px; padding-bottom: 52px; }
  .tb4-hc form.kb-search { margin-bottom: 20px; }
  .tb4-hc .kb-card { padding: 18px 18px 14px; }
  .tb4-hc .hc-search-input { height: 50px; font-size: 16px; }
  .tb4-hc .hc-search-btn { padding: 0 18px; }
}
/* ===== deploy-helpcenter-v1 END ===== */
