/** Shopify CDN: Minification failed

Line 16:14 Expected ")" to end URL token

**/
/*

Please add any custom CSS code in here, it will be easier to transfer if updating themes.

We highly recommend labelling changes, or App installs, so these can also be updated or removed as needed.

*/

@font-face {
  font-family: "Heavitas";
  src: url({{ "Heavitas.tff" | asset_url }}) format("TrueType");
}

@media screen and (max-width: 767px) {

  .popup--close-btn{
    left: 100px;
    top: 15px;
  }
}


/* JR global font import for google fonts */

.roboto-thin {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.roboto-light {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.roboto-regular {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.roboto-medium {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.roboto-bold {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.roboto-black {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.roboto-thin-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: italic;
}

.roboto-light-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.roboto-regular-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.roboto-medium-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: italic;
}

.roboto-bold-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.roboto-black-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-style: italic;
}

.dm-sans {
  font-family: "DM Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}

/* jr sections CSS + globals */


/* taken original from pdp form */
.best-seller-tag{
  font-size: 13px;
  line-height: 15px;
  position: absolute;
  z-index:100;
  top: -1rem;
  right: -1rem;
  display: flex;
  height: 63px;
  width: 63px;
  background-color:#B69451;
  justify-content: center;
  border-radius: 9999px;
}
.single-tag{
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  padding: 0.5rem;
  text-align: center;
}

.collection-tagline{

  left: 844px;
  top: 188px;
  margin-top: 2rem;
  font-family: 'Baron Neue';
  font-style: normal;
  font-weight: 700;
  font-size: 17px;
  line-height:1;
  background: linear-gradient(270deg, #C8AA6A 35.07%, #A07622 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
}

html:has(.new-pdp-main-form) {
  scroll-behavior: smooth;
}

.jr-section-padding {
  padding: 2.5rem 0;
}

.jr-mw {
  max-width: 1200px;
  padding: 3% 8%;
  margin: 0 auto;
}

.jr-mw .col {
  padding: 0;
}

.jr-mw.no-pad {
  padding: 0;
}

.primary-button {
  color: #282828;
  background-color: #deb14c;
  width: 100%;
  height: 55px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  text-align: center;
  border-radius: 100px;
  text-transform: uppercase;
  font-family: "DM Sans";
  font-weight: bold;
  font-size: 16px;
  border: none;
  margin: 0.5rem 0;
  transition: 300ms;
  cursor: pointer;
}

html body .new-pdp-main-form .col .atc-form .primary-button:focus {
  opacity: 0.5 !important;
  background-color: #deb14c !important;
}

.primary-button.btn-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.primary-button:hover {
  background-color: #deb24cb8;
}

.jr-faq {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2rem;
}

.faq-accordion {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.faq-accordion .accordion-item,
.faq-accordion h3 {
  border-bottom: 1px solid lightgray;
}

.faq-accordion .accordion-content {
  overflow: hidden;
  transition: 300ms;  
}

.jr-faq .accordion-item.open .accordion-inner {
  margin-bottom: 1rem;
  color: black;
}

.faq-accordion svg {
  position: absolute;
  right: 0;
  top: 50%;
  transition: transform 0.3s ease;
  width: 24px;
}


.jr-faq .accordion-item.open svg {
  transform: rotate(90deg);
}

.jr-faq h2 {
  color: #282828;
  font-family: 'Roboto';
  font-size: 35px;
  font-style: normal;
  font-weight: 700;
  text-transform: capitalize;
  line-height: 45px; /* 128.571% */
  letter-spacing: 0;
}

.jr-faq .faq-accordion h4,
.jr-faq .faq-accordion p {
  color: #3B312E;
  font-family: "DM Sans";
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 25px; /* 138.889% */
  letter-spacing: -0.18px;;
  text-transform: none;
  margin: 0;
}   

.jr-faq .faq-container h4 {
  font-weight: bold;
}

.jr-faq .faq-container p {
  padding-bottom: 1rem;
}

.jr-faq .faq-container {
  display: flex;
  flex-direction: column;
}

.jr-faq .faq-text-area {
  border-bottom: 2px solid lightgray;
}

.jr-faq button {
  background-color: transparent;
  border: none;
  width: 100%;
  padding: 1rem 0;
  text-align: left;
  position: relative;
}

.single-testimonial {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
  text-align: center;
  border-radius: 10px;
}

.single-testimonial h3,
.single-testimonial .quote-area,
.single-testimonial p {
  color: #3B312E;
  font-family: "DM Sans";
  text-align: center;
  margin: 0;
  text-transform: none;
}

.single-testimonial h3 {
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 25px; /* 147.059% */
  letter-spacing: -0.17px;
  
}

.single-testimonial .quote-area {
  font-size: 22px;
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 21.5px; /* 119.444% */
}

.single-testimonial p {
  font-size: 14.5px;
  font-style: normal;
  font-weight: 400;
  line-height: 21.5px; /* 159.259% */
  color: #3B312E;
}
.single-testimonial .verified-container {
  color: #7B7B7B;
  font-family: "DM Sans";
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 21.5px;
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  align-items: center;
}

body .jr-faq .faq-accordion .accordion-item button:focus,
body .info-and-image .col .nav-area button:focus {
  background-color: transparent !important; 
}

.jr-5050 {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 3rem;
}

.jr-5050 img {
  max-width: 100%;
  border-radius: 10px;
}

.jr-5050 img.comparison-image {
  max-width: none !important;
}

.jr-5050 h2,
.jr-5050 h3, 
.jr-5050 p,
.jr-5050 li {
  font-family: 'Roboto';
  color: #282828;
  text-transform: none;
  letter-spacing: 0;
  font-size: 16.5px;
}

.jr-5050 h2 {
  font-weight: 600;
}

.jr-5050 li {
  margin: 1rem 0;
}

.jr-5050 ul {
  padding-left: 1.5rem;
  margin: 0;
}

.jr-5050 a {
  max-width: 330px;
}

.jr-5050 a:hover {
  text-decoration: none;
}

.desktop-only {
  display: block;
}

.mobile-only {
  display: none;
}

.info-and-image {
  display: flex;
  flex-direction: row;
  border-radius: 10px;
  gap: 3rem;
}

.info-and-image .col {
  padding: 0;
}

.info-and-image .col:has(img) {
  flex: 3;
  display: flex;
  justify-content: center;
  align-items: center;
}

.info-and-image .col:has(img) img {
  max-width: 100%;
  height: 100%;
  object-fit: contain;
}

.info-and-image .col:has(.nav-area) {
  flex: 7;
  overflow: hidden;
}

.info-and-image .nav-area {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  margin-bottom: 2rem;
}

.info-and-image button {
  border: none;
  color: #5C5C5C;
  text-decoration: none;
  background-color: transparent;
  text-align: center;
  font-family: Roboto;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px; /* 133.333% */
  letter-spacing: 0.09px;
}

body .info-and-image .col .nav-area button.active {
  color: #BF8651 !important;
  border-bottom: 2px solid #BF8651;
}

.info-and-image .info-container {
  position: relative;
}

.info-and-image .info-area {
  opacity: 0;
  position: absolute;
  transition: 300ms;
  font-size: 17.5px;
  color: #282828;
}

.info-and-image .info-area.active {
  height: auto;
  position: relative;
  opacity: 1;
}

.new-pdp-main-form {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
}

.new-pdp-main-form .col.info {
  display: flex;
  flex-direction: column;
}
.new-pdp-main-form .stars {
  margin-bottom: 0.5rem;
}

.new-pdp-main-form h3 {
  color: #4880AE;
  font-family: "DM Sans";
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: 0.75px;
  text-transform: uppercase;
}

.new-pdp-main-form h1, .product-heading {
  color: #282828;
  font-family: Roboto;
  font-size: 30px !important;
  font-style: normal;
  font-weight: 700;
  line-height: normal !important;
  margin-bottom: 1rem;
  letter-spacing: 1px;
  text-transform: capitalize;
}

.new-pdp-main-form form {
  margin-bottom: 1rem;
}

.new-pdp-main-form .pdp-value-props {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.new-pdp-main-form .pdp-value-prop {
  color: #282828;
  font-family: Roboto;
  font-size: 16.5px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  display: flex;
  flex-direction: row;
  gap: 1rem;
  align-items: center;
}

.new-pdp-main-form .template-value-props {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  justify-content: space-evenly;
}

.new-pdp-main-form .template-value-prop-container {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  text-align: center;
  justify-content: center;
  align-items: center;
}

.new-pdp-main-form .template-value-prop-container img {
  max-width: 55px;
}

.new-pdp-main-form .template-value-prop-container h4 {
  color: #282828;
  text-align: center;
  font-family: Roboto;
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: 1.4; 
  letter-spacing: 0.5px;
  text-transform: capitalize;
}

.new-pdp-main-form .shop-pay-blurb {
  margin-bottom: 2.5rem;
  color: black;
  font-size: 13px;
}

.new-pdp-main-form .main-carousel {
  margin-bottom: 2rem;
}

.new-pdp-main-form .main-carousel .flickity-page-dots {
  visibility: hidden;
}

.new-pdp-main-form .col {
  flex: 1;
}
.new-pdp-main-form .col .carousel-cell img {
  width: 100%;
  height: auto;
}

.new-pdp-main-form .col .carousel-cell img {
  visibility: hidden;
}

.new-pdp-main-form .col .flickity-enabled .carousel-cell img {
  visibility: visible;
}

.new-pdp-main-form .carousel-cell.nav-thumb {
  margin: 0 5px;
}

.new-pdp-main-form .main-carousel .page{
  display: none;
}

.new-pdp-main-form .carousel-cell.nav-thumb img {
  width: 100%;
  height: 100%;
  max-width: 110px;
  object-fit: contain;
}

.new-pdp-main-form .shop-pay-blurb svg {
  width: 60px;
  height: auto;
}

.new-pdp-main-form .carousel-cell {
  min-height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.new-pdp-main-form .dot.is-selected {
  background-color: #BB7F46 !important;
}

.new-pdp-main-form form .input-container {
  cursor: pointer;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1rem;
  padding: 0.75rem 0;
}

.new-pdp-main-form form .variant-border {
  border-bottom: 1px solid lightgray;
}

.new-pdp-main-form form .input-container .purchase-info {
  display: flex;
  flex-direction: column;
}

.new-pdp-main-form form .input-container .purchase-pricing {
  margin-left: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: end;
  gap: 0.25rem;
}

.new-pdp-main-form form .input-container .prices {
  display: flex;
  gap: 0.5rem;
}

.new-pdp-main-form .custom-radio ~ .purchase-info,
.new-pdp-main-form .custom-radio ~ .purchase-pricing .strike-through,
.new-pdp-main-form .custom-radio ~ .purchase-pricing .final-price {
  opacity: 0.6;
}

.new-pdp-main-form .custom-radio:checked ~ .purchase-info,
.new-pdp-main-form .custom-radio:checked ~ .purchase-pricing .strike-through,
.new-pdp-main-form .custom-radio:checked ~ .purchase-pricing .final-price {
  opacity: 1;
}

.new-pdp-main-form .options-container {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 2rem 0;
}

.new-pdp-main-form .purchase-title {
  color: #3B312E;
  font-family: "DM Sans";
  font-size: 17px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.2
}

.new-pdp-main-form .shipping-info {
  color: #3B312E;
  font-family: "DM Sans";
  font-size: 12.5px;
  font-style: normal;
  font-weight: 400;
  line-height: 22.5px; /* 180% */
}

/* test */

.new-pdp-main-form .custom-radio {
  display: none;
}

.new-pdp-main-form .custom-radio + label {
  position: relative;
  padding-left: 20px;
  cursor: pointer;
}

.new-pdp-main-form .custom-radio + label::before {
  content: '';
  position: absolute;
  left: 0;
  top: -7px;
  width: 24px;
  height: 24px;
  border: 0.5px solid #35689A;
  border-radius: 50%;
  background-color: transparent;
}

.new-pdp-main-form .custom-radio:checked + label::before {
  border-width: 8px;
}

.strike-through {
  text-decoration: line-through;
}

.new-pdp-main-form .strike-through {
  color: #A6A6A6;
  text-align: right;
  font-family: "DM Sans";
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 22.5px; /* 187.5% */
}

.new-pdp-main-form .final-price {
  color: #3B312E;
  font-family: "DM Sans";
  font-size: 17px;
  font-style: normal;
  font-weight: 600;
  line-height: 22.5px;
}

.new-pdp-main-form .percent-off-badge {
  color: #FEFDFD;
  text-align: center;
  font-family: "DM Sans";
  font-size: 11px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  border-radius: 100px;
  background: linear-gradient(90deg, #0E5082 0%, #65C2F4 100%);
  padding: 4px 8px;
}

.new-pdp-main-form .shopify-payment-button__more-options {
  display: none !important;
}

.new-pdp-main-form .shopify-payment-button__button {
  border-radius: 10px;
}

.new-pdp-main-form .shop-pay .shopify-cleanslate > div {
  border-radius: 50px;
}

.new-pdp-main-form .shop-pay .shopify-payment-button__button {
  height: 55px;
  margin-top: 0;
}

.new-pdp-main-form .shop-pay.disabled {
  opacity: 0.5;
  pointer-events: none;
}

@media screen and (max-width: 768px) {
  .desktop-only {
    display: none;
  }
  .mobile-only {
    display: block;
  }
  .jr-mw {
    padding: 2rem 1rem;
  }
  .jr-faq {
    gap: 1rem;
  }
  .jr-section-padding {
    padding: 1rem 0;
  }
  .col.one,
  .col.two {
    flex: 1;
  }
  .jr-5050 h3, 
  .jr-5050 p {
    margin: 0 !important;
  }
  .jr-5050 h2 {
    margin-bottom: 10px !important;
  }
  .jr-5050 ul {
    padding-left: 0.75rem;
  }
  .jr-5050 {
    gap: 1rem;
  }
  .jr-5050 a {
    margin: 0 auto !important;
  }
  .info-and-image {
    flex-direction: column;
    gap: 2rem;
    position: relative;
    margin-top: 35vh;
  }
  .info-and-image .nav-area {
    justify-content: space-evenly;
  }
  .info-and-image .col:has(img) img {
    max-width: 35vw;
    width: 100%;
  }
  .info-and-image .col:has(img) {
    position: absolute;
    left: 0;
    top: -30vh;
  }
  .info-and-image .col:has(.nav-area) {
    padding-top: 18vh;
  }
  .info-and-image button {
    line-height: 1.5;
    font-size: 14px;
  }
  .new-pdp-main-form .main-carousel .flickity-page-dots {
    visibility: visible;
  }
  .new-pdp-main-form .nav-thumbs {
    display: none;
  }
  .new-pdp-main-form {
    flex-direction: column;
    gap: 0.5rem;
  }
  .new-pdp-main-form .flickity-page-dots .dot {
    width: 8px;
    height: 8px;
    margin: 0 5px;
  }
  .new-pdp-main-form h3 {
    font-size: 13px;
    letter-spacing: 0.65px;
  }
  .new-pdp-main-form h1, .product-heading {
    font-size: 26px !important;
    line-height: normal !important;
  }
  .new-pdp-main-form .options-container {
    margin: 1rem 0;
  }
  .new-pdp-main-form form .input-container {
    gap: 0rem;
  }
  .new-pdp-main-form form .input-container .purchase-info {
    margin-left: 1rem;
  }
  .new-pdp-main-form .template-value-props {
    gap: 0.5rem;
  }
  .new-pdp-main-form .template-value-prop-container h4 {
    flex-grow: 1;
  }
  .new-pdp-main-form .template-value-prop-container {
    gap: 1rem;
  }
  .new-pdp-main-form .template-value-prop-container img {
    max-width: none;
    width: 50px;
    height: 50px;
  }
  .new-pdp-main-form .shop-pay-blurb {
    margin-bottom: 1.5rem;
  }
  .single-testimonial .quote-area {
    font-size: 14px;
  }
  .single-testimonial h3 {
    font-size: 17px;
  }
  .jr-5050 h2,
  .jr-5050 h3, 
  .jr-5050 p,
  .jr-5050 li {
    font-size: 13px;
  }
  .info-and-image .info-area {
    font-size: 13px;
  }
}


@media screen and (max-width: 571px) { 
  .info-and-image .col:has(img) {
    top: -25vh;
  }
  .info-and-image .col:has(img) img {
    max-width: 40vw;
  }
}
/* ══════════════════════════════════════════════════════════════════
   Formatting polish (2026-10-14). Each rule below is anchored to one
   page's own classes, so nothing else on the site is affected. These
   pages are Liquid page templates, which are not edited directly.
   ══════════════════════════════════════════════════════════════════ */

/* Results (/pages/clinicals, templates/page.clinical_trials.liquid):
   the theme container's 15px side padding left white strips beside the
   burgundy and cream bands; run the bands edge to edge like the hsp page.
   The hero headline's one-word last line ("proven.") is balanced. */
.jgcr2-stat-block {
  margin-left: -15px;
  margin-right: -15px;
}
.jgcr2-hero__headline { text-wrap: balance; }

/* Our Story (templates/page.our_story.liquid): the overlay heading
   "HAVE THE BEST ALL IN ONE" had no side padding and touched the image
   edge; one-word last lines in the section headings are balanced. */
body.page-title--our-story p.position-absolute.text-left {
  margin-left: clamp(20px, 3vw, 48px);
}
body.page-title--our-story h3 { text-wrap: balance; }

/* Search results, 404 and policy pages: headings used the theme's old
   heading font (DM Serif Display) in near-black; match the site's
   Cormorant Garamond 500 burgundy headings. */
body.template-search .title-bar h2,
body.template-search h4.search_article,
#notfound .title-bar h2,
.shopify-policy__container h1,
.shopify-policy__container h2,
.shopify-policy__container h3 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  color: #7A2535;
}

/* Search results pagination: 32x34 links get a 44px tap area on phones
   (invisible; the links look the same). */
@media (max-width: 767px) {
  body.template-search .pagination .page-link { position: relative; }
  body.template-search .pagination .page-link::after {
    content: '';
    position: absolute;
    inset: -6px -6px;
  }
}

/* ══════════════════════════════════════════════════════════════════
   Flagship consistency pass (2026-10-17). Page-anchored, formatting only.
   ══════════════════════════════════════════════════════════════════ */

/* Short pages (404, policy pages, search with few results): the footer
   stopped partway down the screen and left an empty white band below it.
   The content area now fills the remaining height, so the footer sits at
   the bottom. No effect on pages taller than the screen. */
body.template-404 #main-body > #main,
body.template-search #main-body > #main,
body:has(.shopify-policy__container) #main-body > #main { flex-grow: 1; }

/* Results (/pages/clinicals): the hero sub-line and the stat labels on the
   white and cream bands were near-black #1A1A1A; burgundy like the rest of
   the page (the burgundy band keeps its cream labels). */
.jgcr2-hero__sub,
.jgcr2-stat-block--white .jgcr2-stat-block__stat-label,
.jgcr2-stat-block--cream .jgcr2-stat-block__stat-label { color: #7A2535; }

/* Policy pages: body text (lists, bold text, spans) fell back to the
   theme's IBM Plex Sans; Inter like the rest of the site. */
.shopify-policy__container,
.shopify-policy__container p,
.shopify-policy__container li,
.shopify-policy__container span,
.shopify-policy__container strong,
.shopify-policy__container td { font-family: 'Inter', -apple-system, sans-serif; }

/* Search results: product titles, prices and pagination fell back to the
   theme's IBM Plex Sans; Inter like the product cards elsewhere. */
body.template-search .indiv-product-title-text,
body.template-search .money,
body.template-search .page-link,
body.template-search .indiv-product small { font-family: 'Inter', -apple-system, sans-serif; }

/* Headings that left a single word on their last line at some widths
   (Our Story statement, Giving Back feature, homepage clinical and
   category headings): balanced line breaks. Sizes are unchanged. */
.jgos-statement__headline,
.jggb-feature__headline,
.bcp__heading,
.bcat__heading { text-wrap: balance; }
