/* Johnny Joint / Rebuildable Flex Joint Buyers' Guide page styles.
 * Loaded only for slug: johnny-joint-buyers-guide
 */
.tg-hero,.tg-main,.tg-cta,.tg-topics,.tg-filters{--slate:#1c2b3a;--slate-mid:#2d4257;--slate-soft:#3d5166;--steel:#1a6fa8;--steel-lt:#e8f2f9;--red:#c0392b;--red-dark:#9b2d23;--ink:#2d3e50;--mid:#607080;--line:#d0dce8;--bg-alt:#f4f7fa;--white:#fff;--f-head:'Barlow Condensed',system-ui,sans-serif;--f-body:'Inter',system-ui,sans-serif;--max-w:1380px;--pad-x:40px;--r:6px;--ease:cubic-bezier(.25,.46,.45,.94)}
    *,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
.tg-hero a,.tg-main a,.tg-cta a,.tg-topics a{color:inherit}.szr-wrap{max-width:var(--max-w);margin:0 auto;padding:0 var(--pad-x)}
    .szr-breadcrumb{display:flex;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,.5);margin-bottom:20px}.szr-breadcrumb a{color:rgba(255,255,255,.5);text-decoration:none}.szr-breadcrumb a:hover{color:rgba(255,255,255,.85)}.szr-breadcrumb__sep{color:rgba(255,255,255,.25)}
    .szr-btn{display:inline-flex;align-items:center;gap:8px;padding:13px 28px;border-radius:var(--r);font-family:var(--f-head);font-weight:700;font-size:15px;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;transition:all .25s var(--ease);border:2px solid transparent}.szr-btn--primary{background:var(--red);color:#fff;border-color:var(--red)}.szr-btn--primary:hover{background:var(--red-dark);border-color:var(--red-dark);transform:translateY(-2px)}.szr-btn--light-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.42)}.szr-btn--light-outline:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.82);color:#fff;transform:translateY(-2px)}
    .szr-reveal{opacity:1;transform:none}.tg-js-ready .szr-reveal{opacity:0;transform:translateY(22px);transition:opacity .5s var(--ease),transform .5s var(--ease)}.tg-js-ready .szr-reveal.in{opacity:1;transform:none}
    .tg-hero{background:var(--slate);padding:64px 0 56px;position:relative;overflow:hidden}.tg-hero::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(-45deg,transparent,transparent 24px,rgba(255,255,255,.018) 24px,rgba(255,255,255,.018) 25px);pointer-events:none}.tg-hero__inner{position:relative;z-index:1}.tg-hero__top{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;flex-wrap:wrap}.tg-hero__h1{font-family:var(--f-head);font-weight:800;font-size:clamp(36px,5vw,64px);line-height:1;text-transform:uppercase;color:#fff;margin-bottom:14px}.tg-hero__sub{font-size:15px;line-height:1.65;color:rgba(255,255,255,.66);max-width:760px}.tg-hero__stats{display:flex;gap:36px;margin-top:32px;flex-wrap:wrap}.tg-hero__stat-num{font-family:var(--f-head);font-weight:800;font-size:28px;line-height:1;color:#fff}.tg-hero__stat-lbl{font-size:12px;color:rgba(255,255,255,.45);letter-spacing:.04em;margin-top:3px}
    .tg-filters{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}.tg-filters__inner{display:flex;align-items:center;overflow-x:auto;scrollbar-width:none}.tg-filters__inner::-webkit-scrollbar{display:none}.tg-filter-tab{flex-shrink:0;font-family:var(--f-head);font-weight:700;font-size:14px;letter-spacing:.05em;text-transform:uppercase;color:var(--mid);padding:18px 20px;border:0;border-bottom:3px solid transparent;background:none;cursor:pointer;white-space:nowrap}.tg-filter-tab:hover{color:var(--steel)}.tg-filter-tab.active{color:var(--slate);border-bottom-color:var(--red)}.tg-count{display:inline-block;background:var(--bg-alt);color:var(--mid);font-size:11px;font-weight:600;padding:1px 7px;border-radius:20px;margin-left:6px;vertical-align:middle}.tg-filter-tab.active .tg-count{background:var(--steel-lt);color:var(--steel)}
    .tg-main{padding:56px 0 80px}.tg-pill{display:inline-block;font-family:var(--f-head);font-weight:700;font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:3px}.tg-pill--basics{background:var(--steel-lt);color:var(--steel)}.tg-pill--construction{background:#e8ecf0;color:var(--slate)}.tg-pill--materials{background:#fff3e0;color:#b45b1a}.tg-pill--sizing{background:#eaf2ff;color:#1a5fb4}.tg-pill--maintenance{background:#e6f4ea;color:#2a7a43}.tg-pill--troubleshooting{background:#fdecec;color:var(--red)}.tg-pill--comparison{background:#f3e8ff;color:#6d28a8}.tg-pill--featured{background:var(--red);color:#fff}
    .tg-featured{display:grid;grid-template-columns:1fr 420px;gap:0;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-bottom:48px;text-decoration:none;color:inherit;transition:box-shadow .25s var(--ease)}.tg-featured:hover{box-shadow:0 12px 40px rgba(28,43,58,.1)}.tg-featured__img{background:linear-gradient(135deg,var(--slate),var(--slate-soft));min-height:360px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}.tg-featured__img::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0,rgba(255,255,255,.04) 1px,transparent 1px,transparent 48px),repeating-linear-gradient(90deg,rgba(255,255,255,.04) 0,rgba(255,255,255,.04) 1px,transparent 1px,transparent 48px)}.tg-featured__img img,.tg-card__thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .35s var(--ease)}.tg-featured:hover .tg-featured__img img,.tg-card:hover .tg-card__thumb img{transform:scale(1.04)}.tg-featured__img::after,.tg-card__thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,43,58,.08),rgba(28,43,58,.32));pointer-events:none}.tg-featured__body{padding:40px 40px 40px 44px;display:flex;flex-direction:column;justify-content:center}.tg-featured__pills{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}.tg-featured__h2{font-family:var(--f-head);font-weight:800;font-size:clamp(24px,2.5vw,34px);line-height:1.1;text-transform:uppercase;color:var(--slate);margin-bottom:16px}.tg-featured__excerpt{font-size:14.5px;line-height:1.7;color:var(--mid);margin-bottom:28px}.tg-featured__meta{display:flex;align-items:center;gap:20px;font-size:12.5px;color:var(--mid);margin-bottom:28px;flex-wrap:wrap}
    .tg-section{margin-top:46px;scroll-margin-top:86px}.tg-section__head{display:block;margin-bottom:20px}.tg-section__eyebrow{font-family:var(--f-head);font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--steel);margin-bottom:8px}.tg-section__title{font-family:var(--f-head);font-weight:800;font-size:clamp(25px,3vw,38px);line-height:1.08;text-transform:uppercase;color:var(--slate)}.tg-section__desc{max-width:none;color:var(--mid);font-size:14px;line-height:1.65;margin-top:12px}.tg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.tg-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .25s var(--ease),transform .25s var(--ease);text-decoration:none;color:inherit}.tg-card:hover{box-shadow:0 8px 28px rgba(28,43,58,.1);transform:translateY(-3px)}.tg-card__thumb{aspect-ratio:16/9;background:linear-gradient(135deg,var(--slate-mid),var(--slate));position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-shrink:0}.tg-card__thumb::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0,rgba(255,255,255,.04) 1px,transparent 1px,transparent 40px),repeating-linear-gradient(90deg,rgba(255,255,255,.04) 0,rgba(255,255,255,.04) 1px,transparent 1px,transparent 40px)}.tg-card__thumb--basics{background:linear-gradient(135deg,#0b3a5c,#1a6fa8)}.tg-card__thumb--construction{background:linear-gradient(135deg,var(--slate),var(--slate-soft))}.tg-card__thumb--materials{background:linear-gradient(135deg,#3a2808,#7a5518)}.tg-card__thumb--sizing{background:linear-gradient(135deg,#123158,#1a5fb4)}.tg-card__thumb--maintenance{background:linear-gradient(135deg,#1c4a2a,#2a6a3e)}.tg-card__thumb--troubleshooting{background:linear-gradient(135deg,#5b1f1a,#c0392b)}.tg-card__thumb--comparison{background:linear-gradient(135deg,#2a1a40,#4d3080)}.tg-card__body{padding:22px 22px 24px;flex:1;display:flex;flex-direction:column}.tg-card__pill{margin-bottom:12px}.tg-card__title{font-family:var(--f-head);font-weight:700;font-size:18px;text-transform:uppercase;letter-spacing:.02em;color:var(--slate);line-height:1.2;margin-bottom:10px}.tg-card:hover .tg-card__title{color:var(--steel)}.tg-card__excerpt{font-size:13.5px;line-height:1.65;color:var(--mid);margin-bottom:18px;flex:1}.tg-card__meta{display:flex;align-items:center;justify-content:space-between;padding-top:14px;border-top:1px solid var(--line);font-size:12px;color:var(--mid);gap:16px}.tg-card__arrow{font-family:var(--f-head);font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--steel);white-space:nowrap}
    .tg-topics{border-top:1px solid var(--line);padding:48px 0;background:var(--bg-alt)}.tg-topics__inner{display:flex;align-items:center;gap:32px;flex-wrap:wrap}.tg-topics__label{font-family:var(--f-head);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--mid);flex-shrink:0}.tg-topics__tags{display:flex;flex-wrap:wrap;gap:10px}.tg-topic-tag{display:inline-block;background:#fff;border:1px solid var(--line);border-radius:3px;font-family:var(--f-head);font-weight:600;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);padding:7px 14px;text-decoration:none;transition:all .2s var(--ease)}.tg-topic-tag:hover{border-color:var(--steel);color:var(--steel);background:var(--steel-lt)}.tg-cta{background:var(--slate);padding:72px 0}.tg-cta__inner{display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap}.tg-cta__h2{font-family:var(--f-head);font-weight:800;font-size:clamp(28px,3.5vw,46px);line-height:1.05;text-transform:uppercase;color:#fff}.tg-cta__sub{font-size:14px;color:rgba(255,255,255,.62);margin-top:10px;max-width:650px;line-height:1.65}.tg-cta__btns{display:flex;gap:16px;flex-wrap:wrap;flex-shrink:0}
    @media(max-width:1100px){.tg-featured{grid-template-columns:1fr}.tg-featured__img{min-height:240px}.tg-grid{grid-template-columns:repeat(2,1fr)}.tg-hero__top{flex-direction:column;align-items:flex-start}}@media(max-width:768px){.tg-hero,.tg-main,.tg-cta,.tg-topics,.tg-filters{--pad-x:20px}.tg-hero{padding:48px 0 40px}.tg-grid{grid-template-columns:1fr}.tg-hero__stats{gap:24px}.tg-featured__body{padding:28px 24px}.tg-cta__inner{flex-direction:column;align-items:flex-start}}

/* Overrides against global theme/link/button styles. */
.tg-hero,
.tg-main,
.tg-cta,
.tg-topics,
.tg-filters {
  font-family: var(--f-body);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
}

.tg-hero *, .tg-hero *::before, .tg-hero *::after,
.tg-main *, .tg-main *::before, .tg-main *::after,
.tg-cta *, .tg-cta *::before, .tg-cta *::after,
.tg-topics *, .tg-topics *::before, .tg-topics *::after,
.tg-filters *, .tg-filters *::before, .tg-filters *::after {
  box-sizing: border-box;
}

.tg-hero a,
.tg-main a,
.tg-cta a,
.tg-topics a,
.tg-filters a,
.tg-hero a:hover,
.tg-main a:hover,
.tg-cta a:hover,
.tg-topics a:hover,
.tg-filters a:hover,
.tg-hero a:focus,
.tg-main a:focus,
.tg-cta a:focus,
.tg-topics a:focus,
.tg-filters a:focus {
  text-decoration: none !important;
}

.tg-filter-tab,
.tg-filter-tab:hover,
.tg-filter-tab:focus,
.tg-filter-tab.active {
  appearance: none !important;
  background: transparent !important;
  background-color: transparent !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-left: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  text-decoration: none !important;
}

.tg-filter-tab {
  border-bottom: 3px solid transparent !important;
}

.tg-filter-tab.active {
  border-bottom-color: var(--red) !important;
}

.tg-cta .szr-btn,
.tg-featured .szr-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 13px 28px !important;
  border-radius: var(--r) !important;
  border: 2px solid transparent !important;
  box-shadow: none !important;
  font-family: var(--f-head) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}

.tg-cta .szr-btn--primary,
.tg-featured .szr-btn--primary {
  background: var(--red) !important;
  border-color: var(--red) !important;
  color: #fff !important;
}

.tg-cta .szr-btn--primary:hover,
.tg-featured .szr-btn--primary:hover {
  background: var(--red-dark) !important;
  border-color: var(--red-dark) !important;
  color: #fff !important;
  transform: translateY(-2px);
}

.tg-cta .szr-btn--light-outline {
  background: transparent !important;
  border-color: rgba(255,255,255,.42) !important;
  color: #fff !important;
}

.tg-cta .szr-btn--light-outline:hover {
  background: rgba(255,255,255,.12) !important;
  border-color: rgba(255,255,255,.82) !important;
  color: #fff !important;
  transform: translateY(-2px);
}