/* =====================================================================
   THOMASBRUSH.COM
   GLOBAL KAJABI THEME
   ===================================================================== */


/* =====================================================================
   FONTS
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Libre+Bodoni:ital,wght@0,400;0,500;1,400&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,500;1,8..60,400&family=Inter:wght@400;500;600&display=swap');


/* =====================================================================
   DESIGN SYSTEM
   ===================================================================== */

:root {

  /* BACKGROUNDS */
  --tb-black: #090908;
  --tb-black-soft: #0d0d0c;
  --tb-panel: #11100f;

  /* TEXT */
  --tb-cream: #b7a890;
  --tb-cream-bright: #c7b79d;
  --tb-muted: #9d907c;
  --tb-muted-dark: #70675b;

  /* ACCENT */
  --tb-orange: #bd5118;
  --tb-orange-bright: #d05b1c;

  /* BORDERS */
  --tb-border-soft: rgba(183, 168, 144, 0.12);
  --tb-border-medium: rgba(183, 168, 144, 0.16);
  --tb-border-strong: rgba(183, 168, 144, 0.24);

  /* DIVIDER */
  --tb-divider-gradient:
    linear-gradient(
      90deg,
      rgba(183, 168, 144, 0) 0%,
      rgba(183, 168, 144, 0.02) 8%,
      rgba(183, 168, 144, 0.04) 18%,
      rgba(183, 168, 144, 0.07) 30%,
      rgba(183, 168, 144, 0.12) 42%,
      rgba(183, 168, 144, 0.16) 50%,
      rgba(183, 168, 144, 0.12) 58%,
      rgba(183, 168, 144, 0.07) 70%,
      rgba(183, 168, 144, 0.04) 82%,
      rgba(183, 168, 144, 0.02) 92%,
      rgba(183, 168, 144, 0) 100%
    );

  /* FONTS */
  --tb-display:
    "Libre Bodoni",
    Didot,
    "Didot LT STD",
    "Bodoni 72",
    "Bodoni MT",
    "Times New Roman",
    serif;

  --tb-serif:
    "Source Serif 4",
    Georgia,
    serif;

  --tb-sans:
    "Inter",
    Helvetica,
    Arial,
    sans-serif;

  /* LAYOUT */
  --tb-content-width: 1440px;
}


/* =====================================================================
   GLOBAL FOUNDATION
   ===================================================================== */

html {
  scroll-behavior: smooth;
  background: var(--tb-black) !important;
}

body {
  margin: 0;

  background: var(--tb-black) !important;
  color: var(--tb-muted) !important;

  font-family: var(--tb-serif) !important;

  font-size: 18px;
  font-weight: 400;
  line-height: 1.6;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  text-rendering: optimizeLegibility;
}

main {
  background: var(--tb-black) !important;
}

* {
  box-sizing: border-box;
}


/* =====================================================================
   KAJABI SECTION FOUNDATION
   ===================================================================== */

section,
.section,
.section-sm,
.section-lg {
  color: var(--tb-muted);
}


/* =====================================================================
   HEADER DIVIDER
   ===================================================================== */

header,
.header {
  background: rgba(9, 9, 8, 0.97) !important;

  color: var(--tb-cream);

  border-top: 0 !important;
  border-right: 0 !important;
  border-left: 0 !important;

  border-bottom-width: 1px !important;
  border-bottom-style: solid !important;
  border-bottom-color: transparent !important;

  border-image-source: var(--tb-divider-gradient) !important;
  border-image-slice: 1 !important;

  box-shadow: none !important;
}


/* =====================================================================
   SECTION DIVIDERS
   ===================================================================== */

main [id^="section-"],
main [data-section-id],

#main-content [id^="section-"],
#main-content [data-section-id],

body > [id^="section-"],
body > [data-section-id] {

  border-top-width: 1px !important;
  border-top-style: solid !important;
  border-top-color: transparent !important;

  border-right: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;

  border-image-source: var(--tb-divider-gradient) !important;
  border-image-slice: 1 !important;

  box-shadow: none !important;
}


/* =====================================================================
   REMOVE DUPLICATE SECTION BORDERS
   ===================================================================== */

main .section,
main .section-sm,
main .section-lg,

#main-content .section,
#main-content .section-sm,
#main-content .section-lg {

  border: 0 !important;
  border-image: none !important;

  box-shadow: none !important;
}


.tb-section,
.tb-hero,
.tb-story,
.tb-contact {

  border-top: 0 !important;
  border-bottom: 0 !important;

  border-image: none !important;

  box-shadow: none !important;
}


/* =====================================================================
   TEXT SELECTION
   ===================================================================== */

::selection {
  background: var(--tb-orange);
  color: var(--tb-black);
}


/* =====================================================================
   ALL HEADINGS
   EDITORIAL SMALL CAPS
   ===================================================================== */

h1,
h2,
h3,
h4,
h5,
h6,

h1 *,
h2 *,
h3 *,
h4 *,
h5 *,
h6 *,

.tb-hero__title,
.tb-card__title,
.tb-watch-item__title {

  font-family: var(--tb-display) !important;

  color: var(--tb-cream) !important;

  font-weight: 400 !important;

  font-optical-sizing: auto;

  font-variant-caps: small-caps !important;

  font-feature-settings:
    "smcp" 1,
    "kern" 1 !important;

  text-transform: none !important;

  font-style: normal !important;
}


/* Prevent Kajabi bold overrides */

h1 strong,
h1 b,
h2 strong,
h2 b,
h3 strong,
h3 b,
h4 strong,
h4 b,
h5 strong,
h5 b,
h6 strong,
h6 b {

  font-family: inherit !important;

  font-weight: 400 !important;
}


/* =====================================================================
   H1
   ===================================================================== */

h1 {
  margin-top: 0;
  margin-bottom: 26px;

  font-size:
    clamp(68px, 7.7vw, 126px) !important;

  line-height: 1 !important;

  letter-spacing: 0.24em !important;
}


/* =====================================================================
   H2
   ===================================================================== */

h2 {
  margin-top: 0;
  margin-bottom: 28px;

  font-size:
    clamp(40px, 4.3vw, 68px) !important;

  line-height: 1.08 !important;

  letter-spacing: 0.18em !important;
}


/* =====================================================================
   H3
   ===================================================================== */

h3 {
  margin-top: 0;
  margin-bottom: 12px;

  font-size:
    clamp(28px, 2.5vw, 40px) !important;

  line-height: 1.12 !important;

  letter-spacing: 0.16em !important;
}


/* =====================================================================
   H4
   ===================================================================== */

h4 {
  margin-top: 0;
  margin-bottom: 10px;

  font-size:
    clamp(23px, 2vw, 32px) !important;

  line-height: 1.15 !important;

  letter-spacing: 0.15em !important;
}


/* =====================================================================
   H5
   ===================================================================== */

h5 {
  margin-top: 0;
  margin-bottom: 8px;

  font-size:
    clamp(19px, 1.6vw, 25px) !important;

  line-height: 1.18 !important;

  letter-spacing: 0.14em !important;
}


/* =====================================================================
   H6
   ===================================================================== */

h6 {
  margin-top: 0;
  margin-bottom: 8px;

  font-size:
    clamp(16px, 1.3vw, 20px) !important;

  line-height: 1.2 !important;

  letter-spacing: 0.13em !important;
}


/* =====================================================================
   SMALL CAPS UTILITY
   ===================================================================== */

.tb-smallcaps {

  font-family: var(--tb-display) !important;

  color: var(--tb-cream) !important;

  font-weight: 400 !important;

  font-variant-caps: small-caps !important;

  font-feature-settings:
    "smcp" 1,
    "kern" 1 !important;

  text-transform: none !important;

  letter-spacing: 0.18em !important;
}


/* =====================================================================
   BODY COPY
   ===================================================================== */

p,
li {

  font-family: var(--tb-serif) !important;

  color: var(--tb-muted) !important;

  font-size: 18px;
  font-weight: 400;

  line-height: 1.62;

  letter-spacing: normal !important;

  font-variant-caps: normal !important;
}

p {
  margin-top: 0;
  margin-bottom: 18px;
}

strong,
b {
  color: var(--tb-cream);
}


/* =====================================================================
   ORANGE SANS LABEL
   ===================================================================== */

.tb-label {

  display: block;

  margin: 0 0 10px 0;

  color: var(--tb-orange) !important;

  font-family: var(--tb-sans) !important;

  font-size: 12px !important;
  font-weight: 600 !important;

  line-height: 1.2 !important;

  letter-spacing: 0.28em !important;

  text-transform: uppercase !important;

  font-style: normal !important;

  font-variant-caps: normal !important;
}


.tb-eyebrow {

  display: block;

  margin-bottom: 10px;

  color: var(--tb-orange) !important;

  font-family: var(--tb-sans) !important;

  font-size: 10px !important;
  font-weight: 600 !important;

  line-height: 1.2;

  letter-spacing: 0.25em !important;

  text-transform: uppercase !important;

  font-style: normal !important;

  font-variant-caps: normal !important;
}


/* =====================================================================
   LINKS
   ===================================================================== */

a {

  color: inherit;

  text-decoration: none;

  transition:
    color 180ms ease,
    opacity 180ms ease,
    border-color 180ms ease,
    background-color 180ms ease;
}

a:hover {
  color: var(--tb-orange-bright);
}


/* =====================================================================
   HEADER CONTENT
   ===================================================================== */

header .container,
.header .container {
  max-width: var(--tb-content-width);
}


/* =====================================================================
   HEADER NAVIGATION
   ===================================================================== */

header a,
.header a,
header nav a,
.header nav a,
.header__content a,
.header__nav a {

  font-family: var(--tb-sans) !important;

  color: var(--tb-cream) !important;

  font-size: 10px !important;
  font-weight: 500 !important;

  line-height: 1 !important;

  letter-spacing: 0.21em !important;

  text-transform: uppercase !important;

  font-variant-caps: normal !important;

  transition:
    color 180ms ease,
    opacity 180ms ease !important;
}


/* =====================================================================
   HEADER HOVER
   ===================================================================== */

header a:hover,
header a:focus,

.header a:hover,
.header a:focus,

header nav a:hover,
header nav a:focus,

.header nav a:hover,
.header nav a:focus,

.header__content a:hover,
.header__content a:focus,

.header__nav a:hover,
.header__nav a:focus {

  color: var(--tb-orange) !important;

  opacity: 1 !important;
}


/* HEADER LOGO */

header img,
.header img {

  border-radius: 0 !important;

  box-shadow: none !important;
}


/* =====================================================================
   BUTTONS
   ===================================================================== */

.btn,
a.btn,
.button,
.btn-primary,
.btn-secondary,
button,
input[type="submit"] {

  appearance: none;

  background: transparent !important;

  color: var(--tb-cream) !important;

  border-width: 1px !important;
  border-style: solid !important;
  border-color: var(--tb-orange) !important;

  border-radius: 0 !important;

  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;

  font-family: var(--tb-sans) !important;

  font-size: 10px !important;
  font-weight: 600 !important;

  line-height: 1 !important;

  letter-spacing: 0.20em !important;

  text-transform: uppercase !important;

  font-variant-caps: normal !important;

  padding: 16px 27px !important;

  box-shadow: none !important;

  transition:
    background-color 180ms ease,
    border-color 180ms ease,
    color 180ms ease;
}


/* BUTTON HOVER */

.btn:hover,
a.btn:hover,
.button:hover,
.btn-primary:hover,
.btn-secondary:hover,
button:hover,
input[type="submit"]:hover {

  background: var(--tb-orange) !important;

  border-color: var(--tb-orange) !important;

  color: var(--tb-black) !important;

  opacity: 1 !important;
}


/* =====================================================================
   FORCE BUTTONS SQUARE
   ===================================================================== */

.btn,
a.btn,
.button,
button,
.btn-primary,
.btn-secondary,
[class*="btn-"],
[class*="button-"],

.btn *,
a.btn *,
.button *,
button *,

.btn::before,
.btn::after,

a.btn::before,
a.btn::after,

.button::before,
.button::after,

button::before,
button::after,

.btn-wrapper,
.button-wrapper,
[class*="btn_wrapper"],
[class*="button_wrapper"] {

  border-radius: 0 !important;

  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}


/* =====================================================================
   CUSTOM SECTION STRUCTURE
   ===================================================================== */

.tb-section {
  padding: 90px 0;
}

.tb-section--compact {
  padding: 60px 0;
}

.tb-container {

  width:
    min(
      calc(100% - 80px),
      var(--tb-content-width)
    );

  margin-left: auto;
  margin-right: auto;
}


/* =====================================================================
   SMALL ORANGE RULE
   ===================================================================== */

.tb-rule {

  display: block;

  width: 30px;
  height: 1px;

  margin: 18px 0 24px;

  background: var(--tb-orange);
}


/* =====================================================================
   KAJABI FEATURE CARDS
   SAFE THREE-COLUMN / EQUAL HEIGHT SYSTEM
   ===================================================================== */

/*
   IMPORTANT:

   We only target the actual .feature class.

   We DO NOT use [class*="feature"] here because that was causing
   Kajabi wrappers to become full-width.
*/


/* Keep Kajabi's existing row/column widths */

@media (min-width: 901px) {

  .section .row,
  .section-sm .row,
  .section-lg .row {

    align-items: stretch !important;
  }


  /*
     Do NOT define width or flex-basis here.

     Kajabi/Bootstrap remains responsible for:
     33.33%, 50%, etc.
  */

  .section .row > [class*="col-"],
  .section-sm .row > [class*="col-"],
  .section-lg .row > [class*="col-"] {

    display: flex !important;

    flex-direction: column !important;
  }


  /* Actual feature card stretches vertically */

  .section .row > [class*="col-"] > .feature,
  .section-sm .row > [class*="col-"] > .feature,
  .section-lg .row > [class*="col-"] > .feature {

    display: flex !important;

    flex-direction: column !important;

    width: 100% !important;

    height: 100% !important;
  }
}


/* =====================================================================
   FEATURE IMAGE
   ===================================================================== */

.feature img {

  display: block !important;

  width: 100% !important;

  height: auto !important;

  max-width: 100% !important;

  object-fit: contain !important;

  aspect-ratio: auto !important;

  border-top:
    2px solid
    var(--tb-orange) !important;

  border-radius: 0 !important;
}


/* =====================================================================
   FEATURE TEXT PADDING
   ===================================================================== */

/*
   We pad the actual text rather than expanding the whole feature.
*/

.feature h1,
.feature h2,
.feature h3,
.feature h4,
.feature h5,
.feature h6 {

  padding-left: 28px !important;

  padding-right: 28px !important;
}


.feature p {

  padding-left: 28px !important;

  padding-right: 28px !important;
}


/* First text item gets space from image */

.feature h1:first-of-type,
.feature h2:first-of-type,
.feature h3:first-of-type,
.feature h4:first-of-type,
.feature h5:first-of-type,
.feature h6:first-of-type {

  margin-top: 22px !important;
}


/* Last paragraph gets bottom breathing room */

.feature p:last-child {

  margin-bottom: 28px !important;
}


/* =====================================================================
   CUSTOM TB GRID
   ===================================================================== */

.tb-grid {

  display: grid;

  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap: 18px;

  align-items: stretch;
}


/* =====================================================================
   CUSTOM TB CARDS
   ===================================================================== */

.tb-card {

  position: relative;

  display: flex;

  flex-direction: column;

  height: 100%;

  overflow: hidden;

  background: var(--tb-black-soft);

  border:
    1px solid
    var(--tb-border-soft);

  border-radius: 0 !important;
}


.tb-card__image-wrap {

  position: relative;

  overflow: hidden;

  flex: 0 0 auto;

  border-top:
    2px solid
    var(--tb-orange);
}


.tb-card__image {

  display: block;

  width: 100%;

  aspect-ratio: 16 / 9;

  object-fit: cover;

  transform: scale(1);

  transition:
    transform 450ms cubic-bezier(.2,.7,.2,1),
    opacity 250ms ease;
}


.tb-card:hover .tb-card__image {

  transform: scale(1.025);
}


.tb-card__content {

  display: flex;

  flex-direction: column;

  flex: 1 1 auto;

  padding: 22px 28px 28px;
}


.tb-card__title {

  margin-bottom: 10px;

  color: var(--tb-cream) !important;

  font-family: var(--tb-display) !important;

  font-size: 20px;

  font-weight: 400;

  line-height: 1.15;

  letter-spacing: 0.14em !important;

  font-variant-caps: small-caps !important;

  text-transform: none !important;
}


.tb-card__description {

  color: var(--tb-muted) !important;

  font-family: var(--tb-serif) !important;

  font-size: 16px;

  line-height: 1.5;

  letter-spacing: normal !important;
}


/* =====================================================================
   PRESS
   ===================================================================== */

.tb-press {

  margin-top: 22px;

  padding-top: 20px;

  border-top:
    1px solid
    var(--tb-border-soft);
}


.tb-press__quote {

  margin-bottom: 17px;

  color: var(--tb-cream) !important;

  font-family: var(--tb-serif) !important;

  font-size: 18px;

  font-style: italic;

  line-height: 1.4;

  letter-spacing: normal !important;
}


.tb-press__logo {

  display: block;

  width: auto;
  height: auto;

  max-width: 120px;
  max-height: 40px;

  object-fit: contain;

  opacity: 0.9;
}


/* =====================================================================
   PRESS QUOTE + LOGO — KAJABI
   ===================================================================== */

.tb-press-quote {

  margin: 22px auto 0 !important;

  max-width: 90%;

  color: var(--tb-cream) !important;

  font-family: var(--tb-serif) !important;

  font-size: 17px !important;

  font-weight: 400 !important;

  font-style: italic !important;

  line-height: 1.4 !important;

  letter-spacing: 0 !important;

  text-align: center;

  font-variant-caps: normal !important;
}


.tb-press-logo {

  display: block !important;

  width: auto !important;
  height: auto !important;

  max-width: 110px !important;
  max-height: 34px !important;

  margin: 16px auto 4px !important;

  object-fit: contain;

  border: 0 !important;

  opacity: 0.92;
}


/* =====================================================================
   FILM META
   ===================================================================== */

.tb-meta {

  display: flex;

  align-items: center;

  gap: 14px;

  margin-top: 15px;

  color: var(--tb-muted) !important;

  font-family: var(--tb-sans) !important;

  font-size: 9px !important;

  letter-spacing: 0.15em;

  text-transform: uppercase;

  font-variant-caps: normal !important;
}


.tb-status {

  color: var(--tb-orange) !important;

  font-family: var(--tb-serif) !important;

  font-style: italic;
}


/* =====================================================================
   HERO
   ===================================================================== */

.tb-hero {

  position: relative;

  display: flex;

  align-items: stretch;

  min-height: 700px;

  overflow: hidden;
}


.tb-hero__image {

  position: absolute;

  top: 0;

  right: 0;

  width: 67%;

  height: 100%;

  object-fit: cover;

  object-position: center;

  opacity: 0.94;
}


.tb-hero::after {

  content: "";

  position: absolute;

  inset: 0;

  pointer-events: none;

  background:
    linear-gradient(
      90deg,
      rgba(9, 9, 8, 1) 0%,
      rgba(9, 9, 8, 0.99) 22%,
      rgba(9, 9, 8, 0.82) 42%,
      rgba(9, 9, 8, 0.28) 68%,
      rgba(9, 9, 8, 0.08) 100%
    );
}


.tb-hero__content {

  position: relative;

  z-index: 2;

  display: flex;

  flex-direction: column;

  justify-content: center;

  width: min(48%, 700px);

  padding: 90px 0;
}


.tb-hero__title {

  margin: 0 0 28px;

  color: var(--tb-cream) !important;

  font-family: var(--tb-display) !important;

  font-size:
    clamp(74px, 8.2vw, 136px) !important;

  font-weight: 400 !important;

  line-height: 1 !important;

  letter-spacing: 0.24em !important;

  font-variant-caps: small-caps !important;

  text-transform: none !important;
}


.tb-hero__tagline {

  margin-bottom: 22px;

  color: var(--tb-orange) !important;

  font-family: var(--tb-sans) !important;

  font-size: 11px !important;

  font-weight: 500 !important;

  line-height: 1.2 !important;

  letter-spacing: 0.25em !important;

  text-transform: uppercase !important;

  font-variant-caps: normal !important;
}


.tb-hero__description {

  max-width: 440px;

  color: var(--tb-muted) !important;

  font-family: var(--tb-serif) !important;

  font-size: 18px !important;

  line-height: 1.6;

  letter-spacing: normal !important;
}


/* =====================================================================
   STORY
   ===================================================================== */

.tb-story {

  display: grid;

  grid-template-columns:
    46% 54%;

  min-height: 520px;
}


.tb-story__image {

  width: 100%;

  height: 100%;

  min-height: 520px;

  object-fit: cover;
}


.tb-story__content {

  display: flex;

  flex-direction: column;

  justify-content: center;

  padding: 70px;
}


.tb-story__quote {

  max-width: 600px;

  margin-top: 30px;

  color: var(--tb-cream) !important;

  font-family: var(--tb-serif) !important;

  font-size: 22px;

  font-style: italic;

  line-height: 1.35;

  letter-spacing: normal !important;
}


/* =====================================================================
   WATCH
   ===================================================================== */

.tb-watch {

  display: grid;

  grid-template-columns:
    1.15fr 1fr;

  gap: 40px;
}


.tb-watch__featured-image {

  display: block;

  width: 100%;

  aspect-ratio: 16 / 9;

  object-fit: cover;

  border-top:
    2px solid
    var(--tb-orange);
}


.tb-watch__list {

  display: flex;

  flex-direction: column;
}


.tb-watch-item {

  display: grid;

  grid-template-columns:
    180px 1fr;

  gap: 20px;

  align-items: center;

  padding: 18px 0;

  border-bottom:
    1px solid
    var(--tb-border-soft);
}


.tb-watch-item:first-child {
  padding-top: 0;
}


.tb-watch-item img {

  display: block;

  width: 100%;

  aspect-ratio: 16 / 9;

  object-fit: cover;
}


.tb-watch-item__meta {

  margin-bottom: 6px;

  color: var(--tb-orange) !important;

  font-family: var(--tb-sans) !important;

  font-size: 9px !important;

  font-weight: 600;

  letter-spacing: 0.18em;

  text-transform: uppercase;

  font-variant-caps: normal !important;
}


.tb-watch-item__title {

  color: var(--tb-cream) !important;

  font-family: var(--tb-display) !important;

  font-size: 21px;

  font-weight: 400;

  line-height: 1.15;

  letter-spacing: 0.14em !important;

  font-variant-caps: small-caps !important;

  text-transform: none !important;
}


/* =====================================================================
   WORK WITH ME
   ===================================================================== */

.tb-contact {

  position: relative;

  display: flex;

  align-items: center;

  min-height: 400px;

  overflow: hidden;
}


.tb-contact__background {

  position: absolute;

  inset: 0 0 0 auto;

  width: 55%;

  height: 100%;

  object-fit: cover;

  opacity: 0.34;
}


.tb-contact::after {

  content: "";

  position: absolute;

  inset: 0;

  pointer-events: none;

  background:
    linear-gradient(
      90deg,
      var(--tb-black) 0%,
      var(--tb-black) 40%,
      rgba(9,9,8,0.80) 62%,
      rgba(9,9,8,0.25) 100%
    );
}


.tb-contact__content {

  position: relative;

  z-index: 2;

  max-width: 620px;

  padding: 80px 0;
}


/* =====================================================================
   GENERIC IMAGES
   ===================================================================== */

img {

  max-width: 100%;

  height: auto;

  border-radius: 0 !important;
}


.card,
.panel,
.feature,
.image,
.image img {

  border-radius: 0 !important;
}


/* =====================================================================
   FORMS
   ===================================================================== */

input,
textarea,
select {

  background: transparent !important;

  color: var(--tb-cream) !important;

  border:
    1px solid
    var(--tb-border-strong) !important;

  border-radius: 0 !important;

  font-family: var(--tb-serif) !important;

  box-shadow: none !important;
}


input,
select {
  min-height: 50px;
}


textarea {
  min-height: 140px;
}


input:focus,
textarea:focus,
select:focus {

  border-color:
    var(--tb-orange) !important;

  outline: none !important;

  box-shadow: none !important;
}


::placeholder {
  color: var(--tb-muted-dark);
}


/* =====================================================================
   QUOTES
   ===================================================================== */

blockquote,
.quote,
.testimonial__quote {

  color: var(--tb-cream) !important;

  font-family: var(--tb-serif) !important;

  font-size:
    clamp(24px, 2.2vw, 36px);

  font-style: italic;

  font-weight: 400 !important;

  line-height: 1.35;

  letter-spacing: normal !important;

  font-variant-caps: normal !important;
}


blockquote::before,
blockquote::after {
  color: var(--tb-orange) !important;
}


/* =====================================================================
   FOOTER
   ===================================================================== */

footer,
.footer {

  background: var(--tb-black) !important;

  color: var(--tb-muted) !important;

  border-top-width: 1px !important;
  border-top-style: solid !important;
  border-top-color: transparent !important;

  border-image-source:
    var(--tb-divider-gradient) !important;

  border-image-slice: 1 !important;

  box-shadow: none !important;
}


footer a,
.footer a {

  color: var(--tb-muted) !important;

  font-family: var(--tb-sans) !important;

  font-size: 9px;

  letter-spacing: 0.18em;

  text-transform: uppercase;

  font-variant-caps: normal !important;
}


footer a:hover,
.footer a:hover {

  color: var(--tb-orange) !important;

  opacity: 1 !important;
}


/* =====================================================================
   UTILITIES
   ===================================================================== */

.tb-orange {
  color: var(--tb-orange) !important;
}

.tb-cream {
  color: var(--tb-cream) !important;
}

.tb-muted {
  color: var(--tb-muted) !important;
}

.tb-center {
  text-align: center;
}


/* =====================================================================
   TABLET
   ===================================================================== */

@media (max-width: 900px) {

  body {
    font-size: 17px;
  }


  .tb-container {

    width:
      min(
        calc(100% - 40px),
        var(--tb-content-width)
      );
  }


  .tb-section {
    padding: 65px 0;
  }


  /* HERO */

  .tb-hero {

    display: block;

    min-height: 720px;
  }


  .tb-hero__image {

    position: absolute;

    width: 100%;

    height: 100%;

    opacity: 0.60;

    object-position: 62% center;
  }


  .tb-hero::after {

    background:
      linear-gradient(
        180deg,
        rgba(9,9,8,0.14) 0%,
        rgba(9,9,8,0.40) 35%,
        rgba(9,9,8,0.88) 70%,
        rgba(9,9,8,1) 100%
      );
  }


  .tb-hero__content {

    justify-content: flex-end;

    width: 100%;

    min-height: 720px;

    padding: 80px 0 60px;
  }


  /* CUSTOM GRID */

  .tb-grid {
    grid-template-columns: 1fr;
  }


  /* STORY */

  .tb-story {
    display: block;
  }


  .tb-story__image {
    min-height: 400px;
  }


  .tb-story__content {
    padding: 50px 25px;
  }


  /* WATCH */

  .tb-watch {
    grid-template-columns: 1fr;
  }


  .tb-watch-item {

    grid-template-columns:
      130px 1fr;
  }


  /* CONTACT */

  .tb-contact__background {
    width: 100%;
  }


  .tb-contact::after {
    background: rgba(9,9,8,0.80);
  }


  /* HEADINGS */

  h1,
  .tb-hero__title {

    letter-spacing:
      0.16em !important;
  }


  h2 {

    letter-spacing:
      0.14em !important;
  }


  h3,
  h4 {

    letter-spacing:
      0.12em !important;
  }


  h5,
  h6 {

    letter-spacing:
      0.10em !important;
  }


  .tb-card__title,
  .tb-watch-item__title {

    letter-spacing:
      0.11em !important;
  }


  .tb-label {

    font-size: 11px !important;

    letter-spacing:
      0.24em !important;
  }
}


/* =====================================================================
   MOBILE
   ===================================================================== */

@media (max-width: 560px) {

  .tb-container {

    width:
      calc(100% - 30px);
  }


  .tb-watch-item {

    grid-template-columns:
      105px 1fr;

    gap: 15px;
  }


  .tb-card__content {

    padding:
      18px 20px 22px;
  }


  .btn,
  a.btn,
  .button,
  button,
  input[type="submit"] {

    padding:
      14px 20px !important;
  }


  p,
  li {
    font-size: 17px;
  }


  /* FEATURE COPY */

  .feature h1,
  .feature h2,
  .feature h3,
  .feature h4,
  .feature h5,
  .feature h6,
  .feature p {

    padding-left: 20px !important;
    padding-right: 20px !important;
  }


  /* HEADINGS */

  h1,
  .tb-hero__title {

    letter-spacing:
      0.12em !important;
  }


  h2 {

    letter-spacing:
      0.10em !important;
  }


  h3,
  h4 {

    letter-spacing:
      0.09em !important;
  }


  h5,
  h6 {

    letter-spacing:
      0.08em !important;
  }


  .tb-card__title,
  .tb-watch-item__title {

    letter-spacing:
      0.09em !important;
  }


  .tb-label {

    font-size: 10px !important;

    letter-spacing:
      0.22em !important;
  }
}

/* =====================================================================
   FINAL EQUAL-HEIGHT FIX FOR KAJABI FEATURE CARDS
   ===================================================================== */

@media (min-width: 901px) {

  /* Row establishes the common height */
  .section .row,
  .section-sm .row,
  .section-lg .row {
    align-items: stretch !important;
  }


  /* Each Kajabi column stretches to the tallest column */
  .section .row > [class*="col-"],
  .section-sm .row > [class*="col-"],
  .section-lg .row > [class*="col-"] {
    display: flex !important;
    flex-direction: column !important;
  }


  /* Kajabi usually inserts another block/wrapper around the feature */
  .section .row > [class*="col-"] > *,
  .section-sm .row > [class*="col-"] > *,
  .section-lg .row > [class*="col-"] > * {
    display: flex !important;
    flex-direction: column !important;

    flex: 1 1 auto !important;

    width: 100% !important;
    min-height: 100% !important;
  }


  /* If Kajabi uses a .block wrapper */
  .section .row > [class*="col-"] > .block,
  .section-sm .row > [class*="col-"] > .block,
  .section-lg .row > [class*="col-"] > .block {
    display: flex !important;
    flex-direction: column !important;

    flex: 1 1 auto !important;

    height: 100% !important;
  }


  /* The actual visible bordered feature/card */
  .section .row > [class*="col-"] .feature,
  .section-sm .row > [class*="col-"] .feature,
  .section-lg .row > [class*="col-"] .feature {
    display: flex !important;
    flex-direction: column !important;

    flex: 1 1 auto !important;

    width: 100% !important;
    height: 100% !important;
  }


  /* Common Kajabi inner feature wrappers */
  .feature__inner,
  .feature-inner {
    display: flex !important;
    flex-direction: column !important;

    flex: 1 1 auto !important;

    width: 100% !important;
    height: 100% !important;
  }
}

/* =====================================================================
   KAJABI BUTTON CORNER FIX — FINAL OVERRIDE
   ===================================================================== */

/* Button itself */
a.btn,
.btn,
.button,
button,
input[type="submit"],
[class*="btn--"],
[class*="button--"] {
  border-radius: 0 !important;

  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;

  clip-path: none !important;
  -webkit-clip-path: none !important;

  mask: none !important;
  -webkit-mask: none !important;

  overflow: visible !important;
}


/* Anything INSIDE the button */
a.btn *,
.btn *,
.button *,
button * {
  border-radius: 0 !important;

  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}


/* Button pseudo-elements */
a.btn::before,
a.btn::after,
.btn::before,
.btn::after,
.button::before,
.button::after,
button::before,
button::after {
  border-radius: 0 !important;

  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;

  clip-path: none !important;
}


/* Kajabi button wrappers */
.btn-wrapper,
.button-wrapper,
[class*="btn_wrapper"],
[class*="button_wrapper"],
[class*="btn-wrapper"],
[class*="button-wrapper"] {
  border-radius: 0 !important;

  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;

  overflow: visible !important;

  clip-path: none !important;
}


/* Immediate CTA parent — likely culprit */
*:has(> a.btn),
*:has(> .btn),
*:has(> .button),
*:has(> button) {
  border-radius: 0 !important;

  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;

  clip-path: none !important;
}