:root {
  --light-blue-100: #00A4E5;
  --blue-100: #23356E;
  --red-100: #D23737;
  --base: #4A4A4A;
}

.c-lightblue { color: var(--light-blue-100); }



h1, h2, h3 { margin: 0; padding: 0; }

p { margin: 0; font-family: 'Georgia', sans-serif; color: var(--base); font-family: Georgia; font-size: 20px; font-weight: 400; line-height: 32px; }

figure { margin: 0; padding: 0; }
figure img { width: 100%; }

@font-face {
  font-family: "source-serif-pro-reg";
  src: url("https://s3.amazonaws.com/konsciousketo.com/fonts/Source+Serif+Pro.ttf");
}
@font-face {
  font-family: "source-serif-pro-semi";
  src: url("https://s3.amazonaws.com/konsciousketo.com/fonts/Source+Serif+Pro+Semibold.ttf");
}

.default-content > *{ margin-bottom: 26px; }
.default-content > *:last-child{ margin-bottom: 0; }

.hero { padding-top: 60.09px; padding-bottom: 57px; background-image: url('https://s3.amazonaws.com/konsciousketo.com/samcart/upsell-images/pre-tb/tb-hero-banner-v2.webp'); background-repeat: no-repeat; background-size: cover; background-position: center; }
.hero .wrapper { max-width: 1000px; width: 100%; margin: 0 auto; }
.hero .content-wrapper { max-width: 736px; width: 100%; display: flex; flex-direction: column; }
.hero .content-wrapper > figure { width: 56.41px; height: 56.41px; margin-bottom: 19.91px; }
.hero .content-wrapper .doctor { font-family: "Helvetica", sans-serif; color: white; font-size: 18px; font-weight: 400; line-height: normal; letter-spacing: 2px; text-transform: uppercase; position: relative; margin-bottom: 17.59px; }
.hero .content-wrapper .doctor::after { content: ""; position: relative; width: 220px; height: 6px; background-color: var(--light-blue-100); margin-top: 20px; display: block; }
.hero .content-wrapper h1 { color: #FFF; font-family: "source-serif-pro-reg"; font-size: 60px; font-weight: 600; line-height: 130%; margin-bottom: 16px; }
.hero .content-wrapper .posted { color: #FFF; font-family: Helvetica; font-size: 14px; font-weight: 400; line-height: normal; }


.main-content { padding: 45px 0 65px; }
.main-content .wrapper { width: 100%; }
.main-content .content-wrapper { max-width: 800px; margin: 0 auto; width: 100%; display: flex; flex-direction: column; gap: 32px; padding: 0 22px;  }
.main-content .figure-wrapper { width: calc(100% + 44px); transform: translateX(-22px); }
.main-content .content-wrapper h2 { color: var(--red-100); text-align: center; font-family: Georgia; font-size: 28px; font-weight: 700; line-height: 120%; text-transform: capitalize; }
.main-content .gif-wrapper { border-radius: 4.762px; border: 3.81px solid #000; box-shadow: 0px 4.444px 4.444px 0px rgba(0, 0, 0, 0.25); margin-bottom: 24px; }
.main-content .gif-wrapper a { display: flex; position: relative; }
.main-content .gif-wrapper video { width: 100%; }
.main-content .gif-wrapper figure { position: absolute; inset: 0; }
.main-content .figure-wrapper p { font-size: 10px; line-height: 24px; }
.main-content .doctor-wrapper { display: flex; align-items: center; gap: 18px; }
.main-content .doctor-wrapper > figure { max-width: 150px; width: 100%; flex: 1; }
.main-content .doctor-wrapper .default-content { flex: 1; }
.main-content .doctor-wrapper .default-content p:first-child { font-size: 13.477px; line-height: 24px; margin-bottom: 15px; }
.main-content .doctor-wrapper .default-content p:not(:first-child) { font-size: 12.75px; line-height: 24px; }

footer { padding: 24px 0; background-color: var(--blue-100); }
footer .wrapper { padding: 0 16px; }
footer .wrapper .content-wrapper { max-width: 1240px; width: 100%; margin: 0 auto; }
footer p, footer a { color: #FFF !important; text-align: center; font-family: "Work Sans"; font-size: 12px; font-weight: 400; line-height: 130%; } 

footer p.footer-links a:not(:first-child):before {
  content: "|";
  padding-right: 4px;
  padding-left: 0;
}


@media (max-width: 768px) {
  .hero {background-image: url('https://s3.amazonaws.com/konsciousketo.com/samcart/upsell-images/pre-tb/tb-hero-banner-m-v2.webp');background-repeat: no-repeat;background-position: center;background-size: 100%;padding-top: 20px;padding-bottom: 20px;}
  .hero .wrapper { padding: 0 39px; }
  .hero .content-wrapper h1 { font-size: 35px; line-height: 145%; margin-bottom: 20px; }
  .hero .content-wrapper > figure { margin-bottom: 20px; }
  .hero .content-wrapper .doctor { font-size: 13px; margin-bottom: 20px; }
  .hero .content-wrapper .doctor::after { margin-top: 15px; }


  .main-content { padding: 30px 0 58px; }
  .main-content .content-wrapper { gap: 30px; padding: 0 39px; }
  .main-content .content-wrapper h2 { font-size: 24px; }
  .main-content .figure-wrapper { width: calc(100% + 78px); transform: translateX(-39px); }
  .main-content .figure-wrapper p { font-size: 16px; line-height: 140%; }
  .main-content .img-1 { transform: unset; max-width: 302px; width: 100%; margin: 0 auto; }
  .main-content .doctor-wrapper figure { max-width: 170px; width: 100%; }
  .main-content .doctor-wrapper .default-content p:first-child { font-size: 17.969px; line-height: 32px; }
  .default-content > * { margin-bottom: 15px; }
  .main-content .doctor-wrapper .default-content p:not(:first-child) { font-size: 17px; line-height: 32px; }
  .main-content .gif-wrapper { border-left: 0; border-right: 0; border-radius: 0; }
  .hero .content-wrapper .posted { font-size: 12px; }


  footer { padding: 16px 0; }
}


