/** Shopify CDN: Minification failed

Line 1451:34 The "-" operator only works if there is whitespace on both sides

**/
:root {
    --background: #efeae4;
    --light-coral: #ffac99;
    --coral: #f29586;
    --dark-blue: #283949;
    --light-gray: #a9b0b6;
    --gray: #d6d4d0;
    --cubic: cubic-bezier(.7,0,.3,1);
    --beige: #ffded2;
    --idle-text: #7E8892;
    --idle-pink: #f5d4ca;
    --idle-graphics-small: #d2d0cb;
    --mist: #f9f7f4;
}


/* Containers */
.max-width--634 {
    max-width: calc(634px + 40px);
}
.max-width--720 {
    max-width: calc(720px + 40px);
}
.max-width--830 {
    max-width: calc(830px + 40px);
}
.max-width--930 {
    max-width: calc(930px + 40px);
}
.max-width--1000 {
    max-width: calc(1000px + 40px);
}
.max-width--1030 {
    max-width: calc(1030px + 40px);
}
.max-width--1040 {
    max-width: calc(1040px + 40px);
}
.max-width--1080 {
    max-width: calc(1080px + 40px);
}
.max-width--1090 {
    max-width: calc(1090px + 40px);
}
.max-width--1110 {
    max-width: calc(1110px + 40px);
}
.max-width--1200 {
    max-width: calc(1200px + 40px);
}
.max-width--1220 {
    max-width: calc(1220px + 40px);
}
.max-width--1260 {
    max-width: calc(1260px + 40px);
}
.max-width--1440 {
    max-width: calc(1440px + 40px);
}
.max-width--variable {
    max-width: calc(var(--max-width) + 40px);
}
*[class*="max-width--"] {
    padding-left: 20px;
    padding-right: 20px;
    margin-left: auto;
    margin-right: auto;
}


/* Flex Containers */
[class*="flex--"] {
  display: flex;
}
.flex--wrap {
  flex-wrap: wrap;
}
.flex--contents {
  display: contents;
}
.flex--align-center {
  align-items: center;
}
.flex--align-end {
  align-items: flex-end;
}
.flex--columns {
  flex-direction: column;
}
.flex--justify-start {
  justify-content: flex-start;
}
.flex--justify-center {
  justify-content: center;
}  
.flex--justify-end {
  justify-content: flex-end;
}  
.flex--justify-between {
  justify-content: space-between;
}
.flex--gap-4 { gap: calc(4/16 * 1em) }
.flex--gap-6 { gap: calc(6/16 * 1em) }
.flex--gap-8 { gap: calc(8/16 * 1em) }
.flex--gap-10 { gap: calc(10/16 * 1em) }
.flex--gap-12 { gap: calc(12/16 * 1em) }                
.flex--gap-16 { gap: calc(16/16 * 1em) }
.flex--gap-20 { gap: calc(20/16 * 1em) }
.flex--gap-30 { gap: calc(30/16 * 1em) }
.flex--gap-40 { gap: calc(40/16 * 1em) }
.flex--gap-50 { gap: calc(50/16 * 1em) }


/* 12 Column Grid */
@media not screen and (max-width: 767px) and (orientation: portrait) {
    .grid {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        & .col-start-1 {
            position: relative;
            z-index: 0;            
        }
    }
    .grid--gap-12 {
        gap: 0 calc(12/16 * 1em);
    }
    .grid--gap-20 {
        gap: 0 calc(20/16 * 1em);
    }
    .col-start-1 { grid-column-start: 1; }
    .col-start-2 { grid-column-start: 2; }
    .col-start-3 { grid-column-start: 3; }
    .col-start-4 { grid-column-start: 4; }
    .col-start-5 { grid-column-start: 5; }
    .col-start-6 { grid-column-start: 6; }
    .col-start-7 { grid-column-start: 7; }
    .col-start-8 { grid-column-start: 8; }
    .col-start-9 { grid-column-start: 9; }
    .col-start-10 { grid-column-start: 10; }
    .col-start-11 { grid-column-start: 11; }
    .col-start-12 { grid-column-start: 12; }
    .col-span-1 { grid-column-end: span 1; }
    .col-span-2 { grid-column-end: span 2; }
    .col-span-3 { grid-column-end: span 3; }
    .col-span-4 { grid-column-end: span 4; }
    .col-span-5 { grid-column-end: span 5; }
    .col-span-6 { grid-column-end: span 6; }
    .col-span-7 { grid-column-end: span 7; }
    .col-span-8 { grid-column-end: span 8; }
    .col-span-9 { grid-column-end: span 9; }
    .col-span-10 { grid-column-end: span 10; }
    .col-span-11 { grid-column-end: span 11; }
    .col-span-12 { grid-column-end: span 12; }
}


/* Common */
body,html {
    min-height: 100dvh;
}
html {
    scroll-behavior: smooth;
    @media screen and (max-width: 767px) and (orientation: portrait) {
        scroll-padding-top:calc(60/16 * 1em);
    }
    &:has(.alert-bar) {
        @media screen and (max-width: 767px) and (orientation: portrait) {
            scroll-padding-top:calc(80/16 * 1em);
            .bk-header {
                padding: clamp(50px,calc(50/16 * 1em),50px) 0 calc(20/16 * 1em) 0;
            }
            .bk-header.header--compact {
                padding: calc(20/16 * 1em) 0;
            }
        }
        @media not screen and (max-width: 767px) and (orientation: portrait) {
            scroll-padding-top:calc(110/16 * 1em);
        }        
    }
}
body {
    color: var(--dark-blue);
    display: flex;
    flex-direction: column;
}
hr {
    height: 1px;
    background-color: var(--light-gray);
    margin: 0;
}
@media screen and (max-width: 767px) and (orientation: portrait) {
    .desktop {
        display: none!important;
    }
}
@media not screen and (max-width: 767px) and (orientation: portrait) {
    .mobile {
        display: none!important;
    }
}


/* Main Content */
.main-content {
  width: 100%;
  max-width: 100%;
  padding: 0;
  margin-bottom: 0;
  transition: padding 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  flex: 1 0 auto;
  @media screen and (max-width: 767px) and (orientation: portrait) {
    padding-top: calc(80/16 * 1em);
    overflow-x: clip;
  }
  @media not screen and (max-width: 767px) and (orientation: portrait) {
    padding-top: calc(200/16 * 1em);
    &:has(.alert-bar) {
        padding-top: 0;

    }
  }

  &:has(.hero--fullscreen){
    padding-top: 0;
  }
}



/* Layout */
.bk-header { 
    position: fixed;
    z-index: 10;
    top: 0;
    right: 0;
    left: 0;
    opacity: 0;
    animation: smoothSlideDown 0.5s var(--cubic) forwards .25s;
    transition: background-color .5s ease-in-out, padding .15s ease-in-out;
    &.header--compact {
        background-color: color-mix(in srgb, var(--background) 95%, transparent);
    }
}
.bk-header__logo, .bk-footer__logo {
    display: block;
    img {
        display: block;
        transition: opacity .25s ease-in-out;
    }
}
.bk-header__logo {
    position: relative;
    .logo--dark {
        opacity: 1;
    }
    .logo--light {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        opacity: 0;
    }
}
.header-nav__tier-1-link--current,
.header-nav__tier-2-link--current,
.header-nav__tier-3-link--current,
.drawer-menu__tier-1-link--current,
.drawer-menu__tier-2-link--current,
.drawer-menu__tier-3-link--current {
    text-decoration: underline;
    text-decoration-color: var(--coral);
    text-underline-offset: 0.3em;
}
.bk-header__anouncement {
    display: none;
    align-items: center;
    padding: calc(6/12 * 1em) 1em;
    background-color: color-mix(in srgb, var(--coral) 30%, transparent);
    border-radius: 1.5em;    
    font-size: calc(12/16 * 1em);
    line-height: 1.5em;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--coral);
    a {
      color: var(--coral);  
    }
    &:before {
        display: block;
        content: '';
        width: calc(9/12 * 1em);
        height: calc(9/12 * 1em);
        background-color: var(--coral);
        border-radius: 50%;   
    }
    &:has(a) {
        &:hover{
            background-color:var(--coral);  
            &:before {
                background-color: #fff;
            }
            a {
                color: #fff;  
            }
        }
    }
}

.bk-footer {
    opacity: 0;
    animation: smoothSlideUp 0.5s var(--cubic) forwards 1s;
    p, address, .bk-footer__phone {
        letter-spacing: -0.04em;
    }
}
.bk-footer__logo {
    margin-bottom: calc(30/16 * 1em);
}
.bk-footer__phone {
    color: var(--dark-blue);
}
.bk-footer__signup {
    margin-top: calc(30/16 * 1em);
}
.bk-footer__signup .klaviyo-form button {
    letter-spacing: 0.04em !important;
    font-weight: 500 !important;
}
.bk-footer__menu {
    padding-left: 0;
    font-size: 1em;
    margin-bottom: 0;
    margin-top: calc(40/16 * 1em);
}
.bk-footer__menu li:not(:last-child) {
    margin-bottom: calc(20/16 * 1em);
}
.bk-footer__menu a {
    color: var(--dark-blue);
    text-decoration: underline;
    text-transform: uppercase;
}
.site-header__controls svg {
    display: block;
}
.site-header__controls shopify-account, .site-header__controls .account-button,  shopify-account::part(signed-out-avatar) {
    font-size: 1em;
}

.site-header__cart-button:has(.site-header__cart-count[data-count="0"]) .full {
    display: none;
}
.site-header__cart-button:has(.site-header__cart-count:not([data-count="0"])) .empty {
    display: none;
}
.site-header__cart-count {
    font-size: 12px;
    width: 20px;
    /* text-align: center; */
}

/* BK Footer - social icons */
.bk-footer__social-icons {
    margin-top: calc(40/16 * 1em);
    ul {
        display: flex;
        align-items: center;
        gap: calc(16/16 * 1em);
        list-style: none;
        padding: 0;
        margin: calc(20/16 * 1em) 0 0 0;   
        font-size: 1em;     
    }
    li {
        margin: 0;
    }
    a::before {
        content: none;
    }
    a {
        display: block;
        padding: 0;
        transition: transform .15s ease-in-out;
    }   
    a:hover {
        transform: scale(1.1);
    } 
    img {
        display: block;
        width: calc(40/16 * 1em);
        height: calc(40/16 * 1em);
    }
}



@media screen and (max-width: 767px) and (orientation: portrait) {
    .bk-header {
        padding: calc(14/16 * 1em) 0;
    }
    .bk-header__logo {
        max-width: calc(120/16 * 1em);
        /* margin: 0 auto; */
    }
    .bk-header__anouncement {
        padding: calc(6/12 * 1em) calc(10/12 * 1em);
        &:before {
            margin-right: calc(8/12 * 1em);
        }
    }
    .bk-footer {
        padding: calc(50/16 * 1em) 0 calc(80/16 * 1em) 0;    
        .col-start-7 {
            margin-top: calc(54/16 * 1em);
            padding-bottom: calc(50/16 * 1em);
        } 
    }
    .bk-footer__logo {
        max-width: calc(180/16 * 1em);
    }
    /* Kaviyo */
    .bk-footer__signup .klaviyo-form button {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    .bk-footer__signup .klaviyo-form button, .bk-footer__signup .klaviyo-form input {
        font-size: 16px !important;
    }
    .site-header__controls svg {
        width: 24px;
        height: 24px;
    }
    .bk-header .site-header__cart-button svg {
        font-size: 28px;
        height: 1em;
        width: 1em;
        margin-top: -4px
    }
    .site-header__cart-count {
        margin-left: 5px;
        margin-right: -18px;
    }
}
@media not screen and (max-width: 767px) and (orientation: portrait) {
    .bk-header {
        padding: calc(50/16 * 1em) 0 calc(20/16 * 1em) 0;
        &.header--compact {
            padding: calc(20/16 * 1em) 0 calc(20/16 * 1em) 0;
        }
    }
    .bk-header__logo {
        max-width: calc(190/16 * 1em);
    }
    .bk-header__anouncement {
        padding: calc(6/12 * 1em) 1em;
        &:before {
            margin-right: 1em;
        }
    }
    .bk-footer {
        padding: calc(100/16 * 1em) 0 calc(160/16 * 1em) 0;
        .col-start-1 {
            border-right: 1px solid var(--light-gray);
            padding-right: calc(54/16 * 1em);
        }    
        .col-start-7 {
            padding-left: calc(54/16 * 1em);
            padding-top: calc(20/16 * 1em);
            padding-bottom: calc(80/16 * 1em);
        }    
    }  
    .bk-header .h1--super {
        margin-bottom: calc(20/40 * 1em);
    }  
    .bk-footer__logo {
        max-width: calc(230/16 * 1em);
    }
    /* Kaviyo */
    .bk-footer__signup .klaviyo-form button {
        padding-left: 40px !important;
        padding-right: 40px !important;
    }
    .bk-header .header-nav ul {
        font-size: 1em;
        padding: 0;
        align-items: center;
        justify-content: center;
    }
    .bk-header .header-nav li {
        margin: 0 calc(25   /16 * 1em);;
    }
    .bk-header .header-nav a {
        font-size: calc(16/16 * 1em);
        line-height: 1em;
        font-weight: bold;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        text-decoration: underline;
        text-underline-offset: calc(10/16 * 1em);
        padding: calc(8/16 * 1em) calc(20/16 * 1em);
    }
    .bk-header .header-nav a.header-nav__tier-1-link--current {
        text-decoration: none;
    }
    .bk-header .header-nav a.header-nav__tier-1-link--current svg {
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translateX(-50%);
        width: calc(30/16 * 1em);
        height: auto;
    }
    .bk-header .header-nav a.header-nav__tier-1-link--current svg * {
        fill: var(--dark-blue);
    }
    .bk-header .site-header__controls {
        min-width: calc(190/16 * 1em);
    }
    .bk-header .site-header__controls svg {
        width: calc(30/16 * 1em);
        height: calc(30/16 * 1em);
    }
    .bk-header .site-header__cart-button svg {
        font-size: calc(35/16 * 1em);
        height: 1em;
        width: 1em;
        margin-top: calc(5/35 * 1em * -1);
    }
    .bk-header .site-header__menu-button {
        display: none;
    }
    .site-header__cart-count {
        margin-left: 5px;
        margin-right: -28px;
    }
}  
/*
body:has(.hero--fullscreen) .bk-header:not(.header--compact) .bk-header__logo .logo--dark {
    opacity: 0;
}
body:has(.hero--fullscreen) .bk-header:not(.header--compact) .bk-header__logo .logo--light {
    opacity: 1;
}
body:has(.hero--fullscreen) .bk-header:not(.header--compact) .header-nav a {
    color: color-mix(in srgb, var(--background) 40%, transparent);
}
body:has(.hero--fullscreen) .bk-header:not(.header--compact) .header-nav a:hover, body:has(.hero--fullscreen) .bk-header:not(.header--compact) .site-header__cart-count {
    color: color-mix(in srgb, var(--background) 100%, transparent);
}
body:has(.hero--fullscreen) .bk-header:not(.header--compact) .site-header__controls svg * {
    fill: var(--background);
}
*/

.main-content[data-url*="/loop_subscriptions"] {
    @media screen and (max-width: 767px) and (orientation: portrait) {
        margin-top: calc(50/16 * 1em);
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        margin-top: calc(100/16 * 1em);
    }
}


/* Mobile Drawer Nav */
.drawer-nav__overlay {
    background-color: var(--dark-blue);
}
.drawer-nav ul {
    font-size: 1em;
}
.drawer-nav li {
    margin-bottom: 0;
}
.drawer-nav span[slot="signed-out-avatar"], .drawer-nav li a {
    font-size: calc(18/24 * 1em);
}
.drawer-nav__flyout-header {
    padding-left: 20px;
    padding-right: 20px;
}
.drawer-nav__flyout-header::after {
    left: 0;
}
.drawer-nav li a {
    border-bottom: 1px solid var(--light-gray);
    padding-left: 20px;
    padding-right: 20px;
    color: var(--dark-blue);
    text-decoration: none;
}
.drawer-nav li a:hover {
    background-color: var(--idle-graphics-small)
}
.drawer-menu__tier-1-link--current {
    background-color: var(--idle-pink);
}
.drawer-nav__flyout {
    background-color: var(--background);
    padding: 1rem 0;
}
.drawer-nav__flyout-header::after {
    background-color: var(--light-gray);
    opacity: 1;
}
.drawer-menu__tier-1-link, .drawer-menu__tier-2-link, .drawer-menu__tier-3-link {
    padding: calc(12/24 * 1em) 0;
}


/* Lead Capture Hero */
.lead-capture-hero {
    overflow-x: clip;
    .col-start-7 {
        position: relative;
    }
    .lead-capture-hero__heading span {
        color: var(--coral);
    }
    .lead-capture-hero__subheading {
        text-wrap: balance;
    }
    .lead-capture-hero__crumbs {
        position: absolute;
        pointer-events: none;
    }
    .lead-capture-hero__form {
        background-color: var(--mist);
        border-radius: calc(35/16 * 1em);
        text-align: center;
    }
    .lead-capture-hero__form-heading {
        line-height: 1.25em;
    }
    .lead-capture-hero__body {
        opacity: 0;
        animation: smoothSlideUp 0.33s var(--cubic) forwards 0.85s;
        p:last-child {
            margin-bottom: 0;
        }
    }
    .lead-capture-hero__content-row, .lead-capture-hero__form-row {
        position: relative;
        opacity: 0;   
    }
    .lead-capture-hero__content-row {
        animation: smoothSlideUp 0.5s var(--cubic) forwards 0.5s;
        z-index: 1;
    }
    .lead-capture-hero__form-row {
        animation: smoothSlideUp 0.66s var(--cubic) forwards 0.85s;
    }
    .klaviyo-form label {
        font-size: calc(11/16 * 1em) !important;
        line-height: 1.72em;
        color: var(--dark-blue);
        text-transform: uppercase!important;
        font-weight: 600!important;
    }
    .klaviyo-form button {
        letter-spacing: 0.03em!important;
        font-weight: 500 !important;
    }
    .klaviyo-form [data-testid="form-row"]:has(button), .klaviyo-form [data-testid="form-row"]:has(.klaviyo-form-richtext) {
        width: 100%!important;
    }
    .lead-capture-hero__form-embed {
        margin-top: calc(36/16 * 1em);
    }
    .klaviyo-form > div > .needsclick:has(input[id*="founder_pricing"]){
        margin-inline: auto;
    }
    .klaviyo-form > div > .needsclick:has(input[id*="founder_pricing"]) label div{
        font-size: 14px!important;
    }
    .klaviyo-form  > div > .needsclick:has(input[id*="founder_pricing"]) > div > div > fieldset > div > label {
        padding-bottom: 0;
    }
    @media screen and (max-width: 767px) and (orientation: portrait) {
        padding: calc(80/16 * 1em) 0 calc(90/16 * 1em) 0;
        .lead-capture-hero__content {
            margin-top: calc(70/16 * 1em);
        }
        .lead-capture-hero__body {
            margin-top: calc(40/16 * 1em);
   
        }
        .lead-capture-hero__crumbs {
            width: 95%; /*90%;*/
            top: calc(20/16 * 1em * -1); /*15/16*/
            left: calc(65/16 * 1em); /*50/16*/
        }
        .lead-capture-hero__form {
            padding: calc(30/16 * 1em) calc(20/16 * 1em) calc(20/16 * 1em) calc(20/16 * 1em);
        }
        .lead-capture-hero__form-row {
            padding-top: calc(40/16 * 1em);
            margin-top: calc(30/16 * 1em);
        }
        .klaviyo-form [data-testid="form-row"]:has(input[id*="Dog_Name"]) {
            margin-top: calc(24/16 * 1em);
        }
        .klaviyo-form button {
            font-size: 16px!important;
        }
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        padding: calc(50/16 * 1em) 0 calc(90/16 * 1em) 0;
        .col-start-1 {
            padding-right: calc(44/16 * 1em);
        } 
        .lead-capture-hero__content {
            margin-top: calc(184/16 * 1em);
        }
        .lead-capture-hero__body {
            margin-top: calc(50/16 * 1em);
            padding-right: 20%;
        }
        .lead-capture-hero__subheading {
            padding-right: 25%;
            margin-bottom: calc(40/16 * 1em);
        }
        .lead-capture-hero__crumbs {
            width: 84.94623655913979%;
            top: calc(55/16 * 1em); /*70/16*/
            left: calc(40/16 * 1em);
        }
        .lead-capture-hero__form {
            padding: calc(54/16 * 1em) calc(50/16 * 1em) calc(66/16 * 1em) calc(50/16 * 1em);
        }
        .lead-capture-hero__form-row {
            padding-top: calc(70/16 * 1em);
        }
        .lead-capture-hero__form-embed {
            min-height: 315px;
            &:not(:has(.klaviyo-form)) {
                border: 2px dotted #dadada;
                border-radius: calc(10/16 * 1em);
                display: flex;
                align-content: center;
                justify-content: center;
                align-items: center;
                &:before {
                    content: 'loading';
                    font-size: 11px;
                    text-transform: uppercase;
                    color: var(--light-gray);
                    animation: text-pulse .4s linear infinite;
                }
            }
        }
        .klaviyo-form > div {
            flex-direction: row !important;
            flex-wrap: wrap;
            justify-content: space-between!important;
        }
        .klaviyo-form [data-testid="form-row"]:has(input[id*="first_name"]), .klaviyo-form [data-testid="form-row"]:has(input[id*="Dog_Name"]) {
            width: calc(50% - 13px);
        }
        .klaviyo-form [data-testid="form-row"]:has(input[id*="email"]), .klaviyo-form [data-testid="form-row"]:has(button) {
            width: 100%;
        }
    }

}


/* Layered Animated Images - gsap */
.layered-image {
  display: grid;
  width: 100%;
  overflow: hidden;
}
.background-wrapper {
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: 100%;
}
.layered-image img, .background-wrapper {
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.background {
  z-index: 0;
}
.mask {
  z-index: 1;
}
.outside, .outside-2 {
  z-index: 2;
}
.lines-animation {
    z-index: 3;
}
.layered-image--lead-capture-hero {
    .background-wrapper {
        -webkit-mask-image: url(/cdn/shop/files/coming-soon-image-mask-no-lines.png?v=1785971463);
        mask-image: url(/cdn/shop/files/coming-soon-image-mask-no-lines.png?v=1785971463);        
    }
    @media screen and (max-width: 767px) and (orientation: portrait) {
        width: 80%;
        margin-inline: auto;
        margin-top: calc(50/16 * 1em * -1);
        margin-bottom: calc(40/16 * 1em * -1);
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        margin-top: calc(60/16 * 1em * -1);
        margin-bottom: calc(60/16 * 1em * -1);
    }
}
.layered-image--benefits {
    .background-wrapper {
        -webkit-mask-image: url(/cdn/shop/files/benefits-image-mask.png?v=1786750354);
        mask-image: url(/cdn/shop/files/benefits-image-mask.png?v=1786750354);        
    } 
    @media screen and (max-width: 767px) and (orientation: portrait) {
        margin-top: calc(30/16 * 1em * -1);
        margin-bottom: calc(25/16 * 1em * -1);
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        margin-top: calc(80/16 * 1em * -1);
        margin-bottom: calc(55/16 * 1em * -1);
    }
}


/* Animations */
@keyframes fadein {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 100;
  }
}
@keyframes smoothSlideUp{
    0% {
      transform: translateY(15%);
      opacity: 0;
    }
    100% {
      transform: translateY(0);
      opacity: 1;
    }
}
@keyframes smoothSlideDown{
    0% {
      transform: translateY(-15%);
      opacity: 0;
    }
    100% {
      transform: translateY(0);
      opacity: 1;
    }
}
@keyframes scrollingTagsMarquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(calc(-100% / 6));
    }
}
@keyframes alertBarMarquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(calc(-100% / 3));
    }
}
@keyframes scrollingIngredientsMarquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(calc(-100% / 4));
    }
}
@keyframes scrollingFeaturesMarquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(calc(-100% / 4));
    }
}
@keyframes staticReviewsMarquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(calc(-100% / 4));
    }
}
@keyframes text-pulse {
	0% {
		opacity: 1;
	}
	50% {
		opacity: .4;
	}
	100% {
		opacity: 1;
	}
}


/* Scrolling Tags */
.scrolling-tags {
    opacity: 0;
    animation: smoothSlideUp 0.5s var(--cubic) forwards 1s;
    position: relative;
    padding: calc(95/16 * 1em) 0 calc(90/16 * 1em) 0;
    text-align: center;
    background-image: url(/cdn/shop/files/scrolling-tags-blue-bg.png?v=1785953458);
    background-size: cover;
    &:after {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        height: 20px;
        background-position: center;
    }
    &:after {
        background-image: url(/cdn/shop/files/scrolling-tags-wavy-edge-gray.png?v=1785953458);
        bottom: 0;
        transform: translateY(10px);
    }
}
.scrolling-tags__heading {
    margin: 0 auto calc(30/16 * 1em) auto;
    color: var(--background);
}
.scrolling-tags__marquee {
    display: flex;
    justify-content: center;
    margin-top: calc(26/16 * 1em);
    overflow: hidden;
    mask-image: linear-gradient(to right, transparent, #000 25%, #000 75%, transparent);
}
.scrolling-tags__track {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: calc(10/16 * 1em);
    animation: scrollingTagsMarquee 20s linear infinite reverse;
}
.scrolling-tags__tag {
    flex-shrink: 0;
    white-space: nowrap;
    padding: calc(5/14 * 1em) calc(14/14 * 1em);
    border-radius: calc(8/14 * 1em);
    color: var(--dark-blue);
    font-size: calc(14/16 * 1em);
    font-weight: 500;
    text-transform: uppercase;
    background-color: var(--light-gray);
}


/* Stats Bar */
.stats-bar {
    position: relative;
    background-size: cover;
    &:before, &:after {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        height: 20px;
        background-image: url(/cdn/shop/files/scrolling-tags-wavy-edge-gray.png?v=1785953458);
        background-position: center;
    }
    &:before {
        top: 0;
        transform: translateY(-10px) rotate(180deg);
    }
    &:after {
        bottom: 0;
        transform: translateY(10px);
    }
}


.stats-bar__item-number {
    display: block;
    color: var(--light-coral);
    font-weight: bold;
    letter-spacing: 0.04em;
}
.stats-bar__item-content {
    color: var(--background);
    text-wrap: balance;
}
.stats-bar__item-number {
    font-size: calc(90/16 * 1em);
    line-height: calc(41/90 * 1em);
}

@media screen and (max-width: 767px) and (orientation: portrait) {
    .template-product .stats-bar {
        display: none;
    }
    .stats-bar {
        padding: calc(105/16 * 1em) 0 calc(80/16 * 1em) 0;
        background-image: url(/cdn/shop/files/blue-bg-vertical.png?v=1788902935);
    }
    .stats-bar__items {
        text-align: center;
    }
    .stats-bar__item {
        max-width: calc(190/16 * 1em);
        margin-left: auto;
        margin-right: auto;
    }
    .stats-bar__item:not(:last-child) {
        margin-bottom: calc(80/16 * 1em); 
    }
    .stats-bar__item-content {
        margin: calc(30/16 * 1em) 0 0 0;
    }
    .stats-bar__item-number {
        margin-left: calc(50/16 * 1em * -1);
        margin-right: calc(50/16 * 1em * -1);
    }
}
@media not screen and (max-width: 767px) and (orientation: portrait) {
    .stats-bar {
        padding: calc(95/16 * 1em) 0 calc(80/16 * 1em) 0;
        background-image: url(/cdn/shop/files/scrolling-tags-blue-bg.png?v=1785953458);
    }
    .stats-bar__items {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: calc(50/16 * 1em);
    }
    .stats-bar__item {
        max-width: calc(220/16 * 1em);
    }
    .stats-bar__item:nth-child(2) .stats-bar__item-number {
        transform: translateX(calc(60/90 * 1em * -1));
    }
    .stats-bar__item:nth-child(4) .stats-bar__item-content {
        margin-right: calc(30/18 * 1em * -1);
    }
    .stats-bar__item-content {
        margin: calc(30/18 * 1em) 0 0 0;
    }
}

.stats-bar-coral {
    position: relative;
    background-color: var(--light-coral);
    &:before, &:after {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        height: 20px;
        background-image: url(/cdn/shop/files/scrolling-tags-wavy-edge-gray.png?v=1785953458);
        background-position: center;
    }
    &:before {
        top: 0;
        transform: translateY(-10px) rotate(180deg);
    }
    &:after {
        bottom: 0;
        transform: translateY(10px);
    }
}
.stats-bar-coral__item-number {
    display: block;
    color: var(--background);
    font-weight: bold;
    letter-spacing: 0.04em;
}
.stats-bar-coral__item-content {
    color: var(--dark-blue);
    text-wrap: balance;
}
.stats-bar-coral__item-number {
    font-size: calc(90/16 * 1em);
    line-height: calc(41/90 * 1em);
}

@media screen and (max-width: 767px) and (orientation: portrait) {
    .template-index .stats-bar-coral {
        display: none;
    }    
    .stats-bar-coral {
        padding: calc(105/16 * 1em) 0 calc(80/16 * 1em) 0;
    }
    .stats-bar-coral__items {
        text-align: center;
    }
    .stats-bar-coral__item {
        max-width: calc(190/16 * 1em);
        margin-left: auto;
        margin-right: auto;
    }
    .stats-bar-coral__item:not(:last-child) {
        margin-bottom: calc(80/16 * 1em);
    }
    .stats-bar-coral__item-content {
        margin: calc(30/16 * 1em) 0 0 0;
    }
    .stats-bar-coral__item-number {
        margin-left: calc(50/16 * 1em * -1);
        margin-right: calc(50/16 * 1em * -1);
    }
}
@media not screen and (max-width: 767px) and (orientation: portrait) {
    .stats-bar-coral {
        padding: calc(95/16 * 1em) 0 calc(80/16 * 1em) 0;
    }
    .stats-bar-coral__items {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: calc(50/16 * 1em);
    }
    .stats-bar-coral__item {
        max-width: calc(280/16 * 1em);
    }
    .stats-bar-coral__item-content {
        margin: calc(30/18 * 1em) 0 0 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .alert-bar__track {
        animation: none;
    }
    .scrolling-tags__track {
        animation: none;
    }
    .scrolling-ingredients__track {
        animation: none;
    }
    .scrolling-features__track {
        animation: none;
    }
    .static-reviews__track {
        animation: none;
    }
}


/* Scrolling Ingredients */
.scrolling-ingredients {
    position: relative;
    z-index: 1;
    background-color: var(--light-coral);
    opacity: 0;
    animation: smoothSlideUp 0.5s var(--cubic) forwards 1s;
    &::before, &:after {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        height: 20px;
        background-image: url(/cdn/shop/files/scrolling-tags-wavy-edge.png?v=1785953458);
        background-position: center;
    }
    &::before {
        top: 0;
        transform: translateY(-15px);
    }
    &:after {
        bottom: 0;
        transform: translateY(18px) rotate(180deg);
    }
    @media screen and (max-width: 767px) and (orientation: portrait) {
        padding: calc(40/16 * 1em) 0 calc(60/16 * 1em) 0;
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        padding: calc(60/16 * 1em) 0 calc(120/16 * 1em) 0;
    }
}
.scrolling-ingredients__heading {
    text-align: center;
}
.scrolling-ingredients__marquee {
    display: flex;
    justify-content: center;
    margin-top: calc(40/16 * 1em);
    overflow: hidden;
    mask-image: linear-gradient(to right, transparent, #000 15%, #000 85%, transparent);
}
.scrolling-ingredients__track {
    display: flex;
    flex-shrink: 0;
    align-items: stretch;
    gap: calc(24/16 * 1em);
    animation: scrollingIngredientsMarquee 48s linear infinite;
}
.scrolling-ingredients__item {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    background-color: var(--beige);
    max-width: calc(280/16 * 1em);
    border-radius: calc(24/16 * 1em);
    overflow: hidden;
}
.scrolling-ingredients__content-wrapper {
    padding: calc(35/16 * 1em) calc(25/16 * 1em) calc(55/16 * 1em) calc(25/16 * 1em)
}
.scrolling-ingredients__item-image {
    display: block;
    width: 100%;
    height: auto;
}
.scrolling-ingredients__item-heading {
}
.scrolling-ingredients__item-subheading {
    font-size: calc(12/16 * 1em);
    font-weight: 700;
}
.scrolling-ingredients__item-content {
    font-size: calc(14/16 * 1em);
}


/* Static Reviews */
.icon-play circle, .icon-play path  {
    /* transition: opacity .15s ease-in-out; */
}
.icon-play:hover path {
    opacity:1;
}
.icon-play:hover circle {
    opacity: .6;
}
.icon-play circle {
    fill: var(--background);
    opacity: .4;
}
.icon-play path {
    fill: #fff;
    opacity: .7;
}
.static-reviews {
    text-align: center;
    
}
.static-reviews__inner {
    @media screen and (max-width: 767px) and (orientation: portrait) {
        padding: calc(60/16 * 1em) 0 calc(80/16 * 1em) 0;
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        padding: calc(90/16 * 1em) 0 calc(120/16 * 1em) 0;
    }
}
.static-reviews__rating {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(4/16 * 1em);
}
.static-reviews__rating-text {
    text-transform: uppercase;
}
.static-reviews__rating-stars {
    display: flex;
    gap: calc(4/16 * 1em);
    margin-top: calc(4/16 * 1em);
    margin-bottom: calc(30/16 * 1em);
    svg {
        width: calc(24/16 * 1em);
        height: calc(24/16 * 1em);
        fill: var(--coral);
    }
}
.static-reviews__headline {
    margin: 0 auto;
}
.max-width--1090 {
    @media screen and (max-width: 767px) and (orientation: portrait) {
        padding-left: 0;
        padding-right: 0;        
    }
}
.static-reviews__videos {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: calc(30/16 * 1em);
    margin-top: calc(70/16 * 1em);
    @media screen and (max-width: 767px) and (orientation: portrait) {
        display: block;
        opacity: 0;
        transition: opacity 0.25s ease-in-out;
        &.flickity-enabled {
            opacity: 1;
        }
        .flickity-page-dots {
            position: static;
            display: flex;
            justify-content: center;
            align-items: center;
            gap: calc(12/16 * 1em);
            list-style: none;
            font-size: inherit;
            margin: calc(24/16 * 1em) 0 0 0;
            padding: 0;
            .dot {
                width: calc(10/16 * 1em);
                height: calc(10/16 * 1em);
                margin: 0;
                border-radius: 50%;
                border: 1px solid var(--dark-blue);
                background: none;
                opacity: 1;
                cursor: pointer;
                &.is-selected {
                    background: var(--dark-blue);
                }
            }
        }
    }
}
.static-reviews__video {
    position: relative;
    border-radius: calc(12/16 * 1em);
    overflow: hidden;
    @media screen and (max-width: 767px) and (orientation: portrait) {
        width: 70%;
        margin: 0 calc(8/16 * 1em);
    }
}
.static-reviews__video::after {
    position: absolute;
    z-index: 0;
    /* content: ''; */
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: var(--coral);
    pointer-events: none;
}
.static-reviews__video-element {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 9 / 16;
    background-color: var(--mist);
    background-size: cover;
    background-position: center;
}
.static-reviews__video-play {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: calc(65/16 * 1em);
    height: calc(65/16 * 1em);
    padding: 0;
    border: none;
    background: none;
    cursor: pointer;
}
.static-reviews__video::after, .static-reviews__video-play {
    transition: opacity .25s ease-in-out;
}
.static-reviews__video::after {
    opacity: .7;
}
.static-reviews__video-play {
    opacity: 1;
}
.static-reviews__video.playing::after, .static-reviews__video.playing .static-reviews__video-play  {
    opacity: .0;
}
.static-reviews__marquee {
    display: flex;
    justify-content: center;
    margin-top: calc(96/16 * 1em);
    overflow: hidden;
    mask-image: linear-gradient(to right, transparent, #000 15%, #000 85%, transparent);
}
.static-reviews__track {
    display: flex;
    flex-shrink: 0;
    align-items: stretch;
    gap: calc(30/16 * 1em);
    animation: staticReviewsMarquee 48s linear infinite;
}
.static-reviews__item {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    text-align: center;
    width: calc(320/16 * 1em);
    border-radius: calc(24/16 * 1em);
}
.static-reviews__item-stars {
    display: flex;
    gap: calc(5/16 * 1em);
    margin-bottom: calc(12/16 * 1em);
    justify-content: center;
    svg {
        width: calc(15/16 * 1em);
        height: calc(15/16 * 1em);
        fill: var(--coral);
    }
}
.static-reviews__item-title {
    text-wrap: balance;
}
.static-reviews__item-title:not(:last-child) {
    margin: 0 0 calc(8/16 * 1em) 0;
}
.static-reviews__item-review {
    margin: 0 0 calc(12/16 * 1em) 0;
}
.static-reviews__item-author {
    margin: 0;
    font-weight: 700;
}

@media screen and (max-width: 767px) and (orientation: portrait) {
    .static-reviews .h1--super {
        font-size: calc(28/16 * 1em);
    }
}




/* Static Ingredients */
.static-ingredients {
    position: relative;
    z-index: 1;
    @media screen and (max-width: 767px) and (orientation: portrait) {
        margin: calc(40/16 * 1em) 0 calc(60/16 * 1em) 0;
        .static-ingredients__heading {
            margin-bottom: calc(70-40 * 1em);
            .static-ingredients__heading {
                margin-bottom: calc(70/30 * 1em)
            }
        }
        .static-ingredients__items {
            margin-left: -20px;
            margin-right: -20px;
        }
        .static-ingredients__item {
            height: 100%;
        }
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        margin: calc(120/16 * 1em) 0 calc(120/16 * 1em) 0;
        .static-ingredients__heading {
            margin-bottom: calc(70/40 * 1em)
        }
        .static-ingredients__items {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: calc(30/16 * 1em);
        }
    }
}
.static-ingredients__heading {
    text-align: center;
}
.static-ingredients__items {
    margin-top: calc(40/16 * 1em);
    gap: calc(30/16 * 1em);
    @media screen and (max-width: 767px) and (orientation: portrait) {
        display: block;
        opacity: 0;
        transition: opacity .25s ease-in-out;
        &.flickity-enabled {
            opacity: 1;
        }
        .flickity-page-dots {
            position: static;
            display: flex;
            justify-content: center;
            align-items: center;
            gap: calc(12/16 * 1em);
            list-style: none;
            font-size: inherit;
            margin: calc(24/16 * 1em) 0 0 0;
            padding: 0;
            .dot {
                width: calc(10/16 * 1em);
                height: calc(10/16 * 1em);
                margin: 0;
                border-radius: 50%;
                border: 1px solid var(--dark-blue);
                background: none;
                opacity: 1;
                cursor: pointer;
                &.is-selected {
                    background: var(--dark-blue);
                }
            }
        }
    }
}
.static-ingredients__item {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    background-color: var(--mist);
    border-radius: calc(24/16 * 1em);
    overflow: hidden;
    @media screen and (max-width: 767px) and (orientation: portrait) {
        display: block;
        width: 70%;
        margin: 0 calc(8/16 * 1em);
    }
}
.static-ingredients__content-wrapper {
    padding: calc(24/16 * 1em) calc(25/16 * 1em) calc(55/16 * 1em) calc(25/16 * 1em)
}
.static-ingredients__item-image {
    display: block;
    width: 100%;
    aspect-ratio: 350 / 142;
    object-fit: cover
}
.static-ingredients__item-heading:not(:last-child) {
    margin-bottom: calc(10/24 * 1em);
}
.static-ingredients__item-subheading {
    font-size: calc(14/16 * 1em);
    line-height: calc(18/14 * 1em);
    font-weight: 700;
}
.static-ingredients__cta {
    text-align: center;
    margin-top: calc(90/16 * 1em);
}


/* Buttons */
*[class*="button--"] {
    background: none;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    border-radius: 10px;
    letter-spacing: 0.04em;
    font-size: calc(14/16 * 1em);
    min-height: calc(32/14 * 1em);
    font-weight: 500;
    padding: calc(4/14 * 1em) calc(20/14 * 1em);
}
.button--coral {
    background-color: var(--coral);
    color: var(--dark-blue);
    &:hover {
       background-color: var(--dark-blue); 
       color: #fff;
    }
}
.button--coral {
    background-color: var(--light-coral);
    color: var(--dark-blue);
    &:hover {
       background-color: var(--dark-blue); 
       color: #fff;
    }
}
.button--blue {
    background-color: var(--dark-blue); 
    color: var(--background);    
    &:hover {
        background-color: var(--light-coral);
        color: var(--dark-blue);
    }
}
.button--gray {
        background-color: var(--gray);
        color: var(--dark-blue);
    &:hover {
        background-color: var(--light-coral);
        color: var(--dark-blue);        
    }
}
.button--large {
    font-size: calc(19/16 * 1em);
    min-height: calc(54/19 * 1em);
    padding: calc(10/19 * 1em) calc(40/19 * 1em);
}
.button--100 {
    width: 100%;
}

@media screen and (max-width: 767px) and (orientation: portrait) {
    .button--large {
        font-size: calc(12/16 * 1em);
        min-height: calc(40/12 * 1em);
        padding: calc(10/12 * 1em) calc(30/12 * 1em);
    }  
    .button--mobile-wide {
        width: 100%;
    }
}



/* Scrolling Features */
.shopify-section.scrolling-features-section, .template-page-founder-last-chance .shopify-section.scrolling-features-section{
    overflow: hidden;
    margin-bottom: calc(100/16 * 1em);
}
.scrolling-features {
    .scrolling-features__heading {
        text-align: center;
        line-height: 1.2em;
        margin-bottom: calc(12/40 * 1em);
        span {
            position: relative;
            top: calc(52/40 * 1em * -1);
            display: inline-block;
            margin-bottom: calc(101/40 * 1em * -1);
            color: transparent;
            width: calc(106/40 * 1em);
            height: calc(101/40 * 1em);
            background-image: url(/cdn/shop/files/FC-ComingSoonPage-Assets-NOTAnimation.gif?v=1785967226);
            background-size: cover;
            transform: translateX(4%);
        }
    }
    .scrolling-features__subheading {
        text-align: center;
        margin: 0;
    }
    hr {
        margin-bottom: calc(100/16 * 1em);
    }
    .scrolling-features__marquee {
        display: flex;
        justify-content: center;
        margin-top: calc(60/16 * 1em);
        overflow: hidden;
        mask-image: linear-gradient(to right, transparent, #000     5%, #000 85%, transparent);
    }
    .scrolling-features__track {
        display: flex;
        flex-shrink: 0;
        align-items: stretch;
        gap: calc(24/16 * 1em);
        animation: scrollingFeaturesMarquee 40s linear infinite;
    }
    .scrolling-features__item {
        display: flex;
        flex-direction: column;
        flex-shrink: 0;
        background-color: var(--mist);
        max-width: calc(300/16 * 1em);
        padding: calc(30/16 * 1em) calc(35/16 * 1em) calc(35/16 * 1em) calc(35/16 * 1em);
        border-radius: calc(24/16 * 1em);
    }
    .scrolling-features__pills {
        display: flex;
        flex-wrap: wrap;
        gap: calc(8/16 * 1em);
        margin-bottom: calc(24/16 * 1em);
    }
    .scrolling-features__pill {
        display: flex;
        align-items: center;
        flex-shrink: 0;
        white-space: nowrap;
        padding: calc(5/11 * 1em) calc(11/11 * 1em);
        border-radius: calc(8/14 * 1em);
        color: var(--dark-blue);
        font-weight: 500;
        text-transform: uppercase;
        background-color: var(--light-coral);
        min-height: calc(26/11 * 1em);
    }
    .scrolling-features__content {
        margin-bottom: 0;
    }
    @media screen and (max-width: 767px) and (orientation: portrait) {
        .scrolling-features__marquee {
            margin-left: calc(20/16 * 1em * -1);
            margin-right: calc(20/16 * 1em * -1);
        }
        .scrolling-features__item-heading {
            margin-bottom: calc(18/28 * 1em);
        }          
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        .scrolling-features__marquee {
            margin-left: calc(50/16 * 1em * -1);
            margin-right: calc(50/16 * 1em * -1);
        }
        .scrolling-features__item-heading {
            margin-bottom: calc(18/32 * 1em);
        }
    }
}


/* Features Slider */
.shopify-section.features-slider-section, .template-page-founder-last-chance .shopify-section.features-slider-section{
    overflow: hidden;
    margin-bottom: calc(100/16 * 1em);
}
.features-slider {
    .features-slider__heading {
        text-align: center;
        line-height: 1.2em;
        margin-bottom: calc(12/40 * 1em);
        span {
            position: relative;
            top: calc(52/40 * 1em * -1);
            display: inline-block;
            margin-bottom: calc(101/40 * 1em * -1);
            color: transparent;
            width: calc(106/40 * 1em);
            height: calc(101/40 * 1em);
            background-image: url(/cdn/shop/files/FC-ComingSoonPage-Assets-NOTAnimation.gif?v=1785967226);
            background-size: cover;
            transform: translateX(4%);
        }
    }
    .features-slider__subheading {
        text-align: center;
        margin: 0;
    }
    hr {
        margin-bottom: calc(100/16 * 1em);
    }
    .features-slider__viewport {
        margin-top: calc(60/16 * 1em);
    }
    .features-slider__items {
        display: block;
        opacity: 0;
        transition: opacity .25s ease-in-out;
        &.flickity-enabled {
            opacity: 1;
        }
        .flickity-viewport {
            overflow: hidden;
        }
        .flickity-prev-next-button {
            background: none;
            &:hover {
                background: none;
            }
            &:focus {
                box-shadow: none;
            }
        }
        .flickity-prev-next-button .flickity-button-icon {
            fill: var(--dark-blue);
            margin: 0;
        }
        .flickity-prev-next-button.previous {
            transform: translateY(-50%) rotate(180deg);
        }
        .flickity-prev-next-button:hover .flickity-button-icon * {
            transition: fill 0.15s ease-in-out;
        }
        .flickity-prev-next-button:hover .flickity-button-icon * {
            fill: var(--coral);
        }
        .flickity-page-dots {
            position: static;
            display: flex;
            justify-content: center;
            align-items: center;
            gap: calc(12/16 * 1em);
            list-style: none;
            font-size: inherit;
            margin: calc(24/16 * 1em) 0 0 0;
            padding: 0;
            .dot {
                width: calc(10/16 * 1em);
                height: calc(10/16 * 1em);
                margin: 0;
                border-radius: 50%;
                border: 1px solid var(--dark-blue);
                background: none;
                opacity: 1;
                cursor: pointer;
                &.is-selected {
                    background: var(--dark-blue);
                }
            }
        }
    }
    .features-slider__item {
        display: flex;
        flex-direction: column;
        flex-shrink: 0;
        max-width: calc(300/16 * 1em);
        background-color: var(--mist);
        padding: calc(30/16 * 1em) calc(35/16 * 1em) calc(35/16 * 1em) calc(35/16 * 1em);
        border-radius: calc(24/16 * 1em);
    }
    .features-slider__pills {
        display: flex;
        flex-wrap: wrap;
        gap: calc(8/16 * 1em);
        margin-bottom: calc(24/16 * 1em);
    }
    .features-slider__pill {
        display: flex;
        align-items: center;
        flex-shrink: 0;
        white-space: nowrap;
        padding: calc(5/11 * 1em) calc(11/11 * 1em);
        border-radius: calc(8/14 * 1em);
        color: var(--dark-blue);
        font-weight: 500;
        text-transform: uppercase;
        background-color: var(--light-coral);
        min-height: calc(26/11 * 1em);
    }
    .features-slider__content {
        margin-bottom: 0;
    }
    @media screen and (max-width: 767px) and (orientation: portrait) {
        .features-slider__viewport {
            margin-left: -20px;
            margin-right: -20px;
        }
        .features-slider__item {
            width: 70%;
            margin: 0 calc(8/16 * 1em);
        }
        .features-slider__item-heading {
            margin-bottom: calc(18/28 * 1em);
        }
        .features-slider__items .flickity-prev-next-button {
            display: none;
        }
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        .features-slider__items .flickity-viewport {
            mask-image: linear-gradient(to right, transparent, #000 5%, #000 85%, transparent);
        }
        .features-slider__item {
            width: 27%;
            margin: 0 calc(12/16 * 1em);
        }
        .features-slider__item-heading {
            margin-bottom: calc(18/32 * 1em);
        }
        .features-slider__items .flickity-page-dots{
            display: none;
        }
    }
}


/* Features with Icons */
.features-with-icons {
    position: relative;
    background-image: url(/cdn/shop/files/scrolling-tags-blue-bg.png?v=1785953458);
    background-size: cover;
    &:before {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        height: 20px;
        background-position: center;
    }
    &:before {
        background-image: url(/cdn/shop/files/scrolling-tags-wavy-edge-gray.png?v=1785953458);
        top: -10px;
        transform: rotate(180deg);
    }
    & * {
        color: var(--background);
    }
    .features-with-icons__heading {
        text-align: center;
        text-wrap: balance;
    }
    .features-with-icons__items {
        display: flex;
        flex-wrap: wrap;
        margin-top: calc(44/16 * 1em);
    }
    .features-with-icons__item {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .features-with-icons__item-image {
        display: block;
        width: calc(60/16 * 1em);
        margin-bottom: calc(15/16 * 1em);
    }
    .features-with-icons__item-heading {

        font-weight: 400;
        margin-bottom: 0;
    }
    @media screen and (max-width: 767px) and (orientation: portrait) {
        padding: calc(60/16 * 1em) 0;
        .features-with-icons__heading {
            font-size: calc(24/16 * 1em);
            line-height: 1.1em;
            padding: 0;
        }
        .features-with-icons__items {
            justify-content: center;
            gap: calc(40/16 * 1em) 0;
            margin-left: calc(10/16 * 1em * -1);
            margin-right: calc(10/16 * 1em * -1);
        }
        .features-with-icons__item {
            width: calc(33.3%);
            max-width: 150px;
        }
        .features-with-icons__item-heading {
            font-size: calc(14/16 * 1em);
            line-height: calc(13.5/14 * 1em); 
        }
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        padding: calc(100/16 * 1em)  calc(40/16 * 1em) calc(120/16 * 1em)  calc(40/16 * 1em);
        .features-with-icons__items {
            justify-content: space-around;
            gap: calc(40/16 * 1em) calc(10/16 * 1em);
        }
        .features-with-icons__item-heading {
            font-size: calc(20/16 * 1em);
            line-height: calc(18/20 * 1em);            
        }
    }
    @media screen and (min-width: 1280px) {
        .features-with-icons__item {
            width: calc(150/16 * 1em);
        }
    }
}
.homepage-hero-section + .features-with-icons-section .features-with-icons::before {
    display: none;
}



/* Scrolling Features with Icons */
.scrolling-features-with-icons {
    position: relative;
    padding: calc(24/16 * 1em) 0;
    background-color: var(--light-coral);
    &:before, &:after {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        height: 20px;
        background-position: center;
    }
    &:before {
        background-image: url(/cdn/shop/files/scrolling-tags-wavy-edge.png?v=1785953458);
        top: -10px;
    }
    &:after {
        background-image: url(/cdn/shop/files/scrolling-tags-wavy-edge.png?v=1785953458);
        bottom: -10px;
        transform: rotate(180deg);
    }

}
.scrolling-features-with-icons__marquee {
    display: flex;
    overflow: hidden;
    mask-image: linear-gradient(to right, transparent, #000 15%, #000 85%, transparent);
}
.scrolling-features-with-icons__track {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: calc(60/16 * 1em);
    animation: scrollingFeaturesWithIconsMarquee 30s linear infinite;
}
.scrolling-features-with-icons__item {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    max-width: calc(200/16 * 1em);
}
.scrolling-features-with-icons__item-image {
    display: block;
    width: calc(48/16 * 1em);
    height: calc(48/16 * 1em);
    object-fit: contain;
    margin-right: calc(16/16 * 1em);
}
.scrolling-features-with-icons__item-heading {
    text-transform: uppercase;
}
@keyframes scrollingFeaturesWithIconsMarquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(calc(-100% / 6));
    }
}
@media (prefers-reduced-motion: reduce) {
    .scrolling-features-with-icons__track {
        animation: none;
    }
}


/* Static Features with Icons */
.static-features-with-icons {
    position: relative;
    padding: calc(34/16 * 1em) 0 calc(24/16 * 1em) 0;
    background-color: var(--light-coral);
    &:before, &:after {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        height: 20px;
        background-position: center;
    }
    &:before {
        background-image: url(/cdn/shop/files/scrolling-tags-wavy-edge.png?v=1785953458);
        top: -10px;
    }
    &:after {
        background-image: url(/cdn/shop/files/scrolling-tags-wavy-edge.png?v=1785953458);
        bottom: -10px;
        transform: rotate(180deg);
    }

}
.static-features-with-icons__items {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: calc(40/16 * 1em);
}
.static-features-with-icons__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: calc(140/16 * 1em);
    gap: calc(16/16 * 1em);
}
.static-features-with-icons__item-image {
    display: block;
    width: calc(60/16 * 1em);
    height: calc(60/16 * 1em);
    object-fit: contain;
}
.static-features-with-icons__item-heading {
   text-align: center;
   margin: 0;
}

@media screen and (max-width: 767px) and (orientation: portrait) {
    .static-features-with-icons__item {
        max-width: calc(80/16 * 1em);

    }
    .static-features-with-icons__item-heading {
        font-size: calc(14/16 * 1em);
      line-height: calc(16/14 * 1em);
    }
}


/* Featured Image */
.featured-image-section {
    text-align: center;
    .featured-image__image {
        display: block;
        width: 100%;
        height: auto;
        margin: 0 auto;
    }
    @media screen and (max-width: 767px) and (orientation: portrait) {
        padding: calc(80/16 * 1em) 0;
        .featured-image__heading {
            margin-bottom: calc(20/30 * 1em);
        }
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        padding: calc(110/16 * 1em) 0;
        .featured-image__heading {
            margin-bottom: calc(40/40 * 1em);
        }
    }
}


/* Benefits */
.benefits {
    .benefits__items {
        position: relative;
        &::before {
            position: absolute;
            content: '';
        }
    }
    .benefits__item {
        position: relative;
        &::before, &::after {
            content: '';
            position: absolute;
        }
        &::before {
            width: calc(28/16 * 1em);
            height: calc(28/16 * 1em);
            border-radius: calc(8/16 * 1em);
            background: var(--background);
            border: calc(3/16 * 1em) solid var(--light-gray);
            top:0;
            left: 0;
        }
        &::after {
            top: calc(6/16 * 1em);
            left: calc(6/16 * 1em);
            background: var(--light-gray);
            width: calc(16/16 * 1em);
            height: calc(16/16 * 1em);
            border-radius: calc(3/16 * 1em);
        }
    }
    .benefits__item-heading, .benefits__item-content {
        color: var(--light-gray);
        transition: all .25s ease-in-out;
    }
    .benefits__item-heading {
        margin-bottom: calc(20/24 * 1em);
    }
    .benefits__cta {
        text-align: center;
        margin-top: calc(100/16 * 1em);
        /* font-weight: 700; */
    }
    @media screen and (max-width: 767px) and (orientation: portrait) {
        margin-bottom: calc(80/16 * 1em);
        hr {
            margin-bottom: calc(50/16 * 1em)
        }
        .benefits__items {
            margin-top: calc(50/16 * 1em);
            margin-left: -20px;
            margin-right: -20px;
            &::before {
                width: 1px;
                top: calc(70/16 * 1em * -1);
                bottom: calc(70/16 * 1em * -1);
                left: calc(14/16 * 1em);
                background: linear-gradient(to bottom,  rgba(169,176,182,0) 0%,rgba(169,176,182,1) 10%,rgba(169,176,182,1) 90%,rgba(169,176,182,0) 100%);
            }
        }
        .benefits__item {
            padding-left: calc(60/16 * 1em);
            &:not(:last-child) {
                margin-bottom: calc(60/16 * 1em);
            }
        }
        .benefits__item--active .benefits__item-heading, .benefits__item--active .benefits__item-content {
            color: var(--dark-blue);
        }
        .benefits__item-content {
            font-size: calc(13/16 * 1em);
            line-height: calc(20/13 * 1em);  
            padding-right: 9%;          
        }
        .benefits__item--active::before {
            border: 3px solid var(--coral);
        }
        .benefits__item--active::after {
            background: var(--coral);
        }
        .benefits__cta .button--large {
            /* padding: calc(10/19 * 1em) calc(20/19 * 1em) */
        }
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        margin-bottom: calc(130/16 * 1em);
        .benefits__content-column {
            display: flex;
            flex-direction: column;
            justify-content: center;
        }
        .benefits__heading {
            margin-bottom: calc(30/40 * 1em);
        }        
        .layered-image--benefits {
            margin-top: calc(100/16 * 1em * -1);
            margin-left: calc(20/16 * 1em);
            margin-right: calc(20/16 * 1em);
        }
        .benefits__items {
            display: flex;
            gap: calc(55/16 * 1em);
            margin-top: calc(80 /16 * 1em);
            &::before {
                height: 1px;
                top: calc(14/16 * 1em);
                left: calc(70/16 * 1em * -1);
                right: calc(70/16 * 1em * -1);
                background: linear-gradient(to right,  rgba(169,176,182,0) 0%,rgba(169,176,182,1) 10%,rgba(169,176,182,1) 90%,rgba(169,176,182,0) 100%);
                z-index: 0;
            }
        }
        .benefits__item-heading, .benefits__item-content {
            cursor: pointer;
        }
        .benefits__item {
            padding-top: calc(80/16 * 1em);
        }
        .benefits__item:hover .benefits__item-heading, .benefits__item:hover .benefits__item-content {
            color: var(--dark-blue);
        }
        .benefits__item:hover::before {
            border: 3px solid var(--coral);
        }
        .benefits__item:hover::after {
            background: var(--coral);
        }
    }

}


/* FAQ */
.template-index .shopify-section.faq-section, .template-page-founder-last-chance .shopify-section.faq-section {
    margin-top: calc(60/16 * 1em);
}
.template-index .shopify-section.faq-section:not(:last-child), .template-page-founder-last-chance .shopify-section.faq-section:not(:last-child) {
    margin-bottom: calc(60/16 * 1em);
}
.faq-section {
    .faq-section__heading {
        text-align: center;
        margin-bottom: calc(76/40 * 1em);
    }
    .faq-section__cta {
        text-align: center;
    }
    @media screen and (max-width: 767px) and (orientation: portrait) {
        .faq-section__inner {
            padding-top: calc(80/16 * 1em);
            padding-bottom: calc(100/16 * 1em);
        }
        .faq-section__cta {
            margin-top: calc(60/16 * 1em);
        }
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        .faq-section__inner {
            padding-top: calc(120/16 * 1em);
            padding-bottom: calc(150/16 * 1em);
        }
        .faq-section__cta {
            margin-top: calc(110/16 * 1em);
        }
    }
}

/* Accordion (shared: FAQ + Product Hero) */
.accordion-item {
    position: relative;
    border-top: 1px solid var(--light-gray);
    padding: calc(16/16 * 1em) 0;
    &:last-child {
        border-bottom: 1px solid var(--light-gray);
    }
}
.accordion-item-question {
    cursor: pointer;
    list-style: none;
    padding-right: 10px;
    &::-webkit-details-marker {
        display: none;
    }
    .accordion-item-question-heading {
        margin: 0;
        font-weight: 700;
    }
    svg {
        width: calc(15/16 * 1em);
        height: calc(15/16 * 1em);
        transition: transform .15s ease-in-out;
        margin-left: 20px;
    }
    svg * {
        fill: var(--light-gray);
    }
}
.accordion-item .accordion-item-question svg rect[height="100"] {
    transform: scaleY(1);
    transform-origin: center;
    /* transition: transform .5s ease-in-out; */
}
.accordion-item[open] .accordion-item-question svg rect[height="100"] {
    transform: scaleY(0);
}
.accordion-item[open] .accordion-item-question svg {
    position: absolute;
    right: 10px;
    top: 50%;
}
.accordion-item-content {
    margin: calc(15/16 * 1em) 0 calc(40/16 * 1em) 0;
}
@media screen and (max-width: 767px) and (orientation: portrait) {
    .accordion-item-content {
        margin: calc(15/16 * 1em) 0 calc(30/16 * 1em) 0;
    }
}
@media not screen and (max-width: 767px) and (orientation: portrait) {
    .accordion-item-content {
        margin: calc(20/16 * 1em) 15% calc(40/16 * 1em) 0;
        p {
            max-width: 100%;
        }
    }
}


/* Coming Soon Hero*/

.alert-bar {
    --marqueeDuration: 15;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 10;
    background-color: var(--dark-blue);
    color: var(--background);
    .alert-bar--inner {
        font-size: 11px;
        line-height: 14px;
        font-weight: 700;
        text-transform: uppercase;
    }
    .alert-bar__line a {
        text-decoration: underline;
        color: var(--background);
    }
    @media screen and (max-width: 767px) and (orientation: portrait) {
        padding: clamp(10px, calc(10/16 * 1em), 12px) 0;
        min-height: 40px;
        .alert-bar--inner {
            min-width: 0;
        }
        .alert-bar__marquee {
            display: flex;
            overflow: hidden;
            mask-image: linear-gradient(to right, transparent, #000 10%, #000 90%, transparent);
        }
        .alert-bar__track {
            display: flex;
            flex-shrink: 0;
            align-items: center;
            gap: calc(30/16 * 1em);
            padding-left: 20px;
            white-space: nowrap;
            animation: alertBarMarquee calc(var(--marqueeDuration) * 1s) linear infinite;
        }
        .alert-bar__line {
            white-space: nowrap;
        }
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        padding: calc(12/16 * 1em) 20px;
        justify-content: center;
        color: var(--background);
        .alert-bar__line a {
            color: var(--background); 
        }
        .alert-bar__line a:hover {
            color: #fff;
        }
        .alert-bar--inner {
            display: flex;
            align-items: center;
            justify-content: center;
        }
        span.alert-bar--divider {
            display: block;
            padding: 0 calc(30/16 * 1em);
        }
    }
}


.product-hero {
    overflow-x: clip;
    .product-hero__slider, .product-hero__slider-nav {
        opacity: 0;
        transition: opacity 0.25s ease-in-out 1s;              
    }
    .product-hero__slider.flickity-enabled, .product-hero__slider-nav.flickity-enabled {
        opacity: 1;
    }
    .product-hero__slider {
        .product-hero__image {
            display: block;
            object-fit: cover;
            aspect-ratio: 1 / 1;
        } 
    }
    .product-hero__slider-nav {
        margin-top: calc(15/16 * 1em);
        .product-hero__slide {
            width: calc(66/16 * 1em);;
            padding: 0 calc(7/16 * 1em);
        }
        .product-hero__image {
            display: block;
            width: 100%;
            height: auto;
            background-color: #fff;
            border-radius: calc(8/16 * 1em);
            aspect-ratio: 1 / 1;
            object-fit: contain;
        }
    }
    .product-hero__product-size {
        display: flex;
        align-items: center;
        text-transform: uppercase; 
    }
    .product-hero__stars {
        display: flex;
        align-items: center;
        margin-left:calc(12/16 * 1em);
    }
    .product-hero__stars svg {
        width: calc(12/16 * 1em);
        height: calc(12/16 * 1em);
        margin-left: calc(3/16 * 1em);
    }
    .product-hero__stars svg * {
        fill: var(--coral);
    }
    .product-hero__promo-bullet svg  {
        width: calc(20/16 * 1em);
        margin: calc(3/16 * 1em) calc(5/16 * 1em) 0 calc(2/16 * 1em * -1);
        height: auto;
    }
    .product-hero__promo-bullet svg * { fill: var(--coral)}
    [class*="disclaimer"] {
        color: var(--idle-text);
    }
    .product-hero__product-title  {
        span {
            position: relative;
        }
        svg {
            display: none;
            position: absolute;
            left: 100%;
            top: 0; 
            transform: translate(3px,-42%);
        }
        svg * {
            fill: var(--light-coral);
        }
        img {
            position: absolute;
            left: 100%;
            top: 0;
            transform: translate(3px,-42%);
        }
    }
    .product-hero__cta .button--blue {
        margin-bottom: 16px;
    }
    #founder-subscribe {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: calc(8/16 * 1em);
    }
    .product-hero__cta-price {
        display: flex;
        align-items: baseline;
        gap: calc(6/16 * 1em);
    }
    .product-hero__cta button {
        padding-left: calc(10/19 * 1em);
        padding-right: calc(10/19 * 1em);
        letter-spacing: 0;
    }
    .product-hero__cta-compare-price {
        /* opacity: 0.6; */
        font-weight: 400;
    }
    .product-hero__cta-disclaimer {
        margin-top: 8px;
        text-align: center;
    }
    .product-hero__product-size {
        margin-bottom: calc(12/11 * 1em);
    }
    .product-hero__launch-tagline {
        margin-bottom: calc(12/16 * 1em);
    }
    .product-hero__product-headline {
        text-wrap: balance;
    }
    .product-hero__product-headline.desktop {
        margin-bottom: calc(35/14 * 1em);
    }
    .product-hero__product-headline.mobile {
        margin-top: calc(20/14 * 1em);
        margin-bottom: 0;
    }
    .product-hero__promo {
        margin-top: calc(30/16 * 1em)
    }
    .product-hero__promo-bullet {
        margin-bottom: calc(16/24 * 1em);
    }
    .product-hero__subscription-renewal {
        text-transform: uppercase;
        text-align: center;
    }
    .product-hero__subscription-disclaimer {
        margin-bottom: 1em;
    }
    .product-hero__products {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: calc(15/16 * 1em);
        margin-top: calc(52/16 * 1em);
        margin-bottom: calc(40/16 * 1em);
    }
    .product-hero__product {
        display: flex;
        flex-direction: column;
        position: relative;
        background-color: color-mix(in srgb, var(--dark-blue) 12%, transparent);
        padding: calc(13/16 * 1em) calc(18/16 * 1em);
        cursor: pointer;
        transition: border-color 0.15s var(--cubic), background-color 0.15s var(--cubic);
        border-radius: calc(10/16 * 1em);
        border: none;
        font-size: inherit;
        input[type="radio"] {
            position: absolute;
            inset: 0;
            margin: 0;
            opacity: 0;
            cursor: pointer;
        }
        &:has(input:focus-visible) {
            outline: 2px solid #7aa7c7;
            outline-offset: 2px;
        }
        &:has(input:checked) {
            background-color: color-mix(in srgb, var(--light-coral) 35%, transparent);
            .product-hero__product-discounted-price {
                background-color: var(--light-coral);
            }
        }
    }
    .product-hero__product-days {
        margin-bottom: calc(5/18 * 1em);
    }
    .product-hero__product-price {
        text-transform: uppercase;
        margin-top: 10px;
        font-weight: 700;  
        text-decoration: line-through;        
    }
    .product-hero__product-renews {
        text-transform: uppercase;
        display: block;
        margin-top:  calc(6/11 * 1em * -1);
        margin-bottom: calc(10/11 * 1em);
    }
    .product-hero__product-discounted-price {
        background-color: color-mix(in srgb, var(--dark-blue) 16%, transparent);
        width: fit-content;
        text-align: center;
    }
    .product-hero__accordion {
        margin-top: calc(60/16 * 1em);
    }
    .accordion-item-content {
        margin-right: 5%;
    }
    &.product-hero--product-page .product-hero__subscription-disclaimer {
        text-align: center;
    }
    &.product-hero--product-page .accordion-item-content {
        margin-bottom: calc(20/16 * 1em);    
    }
    &.product-hero--product-page .accordion-item-content ul {
        column-count: 2;
    }
    &.product-hero--product-page .accordion-item-content li::marker {
        color: var(--coral);
    }
    &.product-hero--product-page .accordion-item-content.ingredients p {
        font-size: calc(10.5/16 * 1em);
        line-height: calc(14/10.5 * 1em);
        letter-spacing: 0.02em;
    }
    #product-hero-buy-once-form, #sticky-buy-once-form {
        font-size: 1em;
    }
    .default-shopify-add-to-cart {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: calc(12/16 * 1em);
        margin-top: calc(16/16 * 1em);
        margin-bottom: calc(16/16 * 1em);
    }
    .default-shopify-add-to-cart input[type="number"] {
        margin: 0;
        border: 1px solid var(--light-gray);
        border-radius: calc(4/16 * 1em);
        width: calc(40/16 * 1em);;
        height: calc(30/16 * 1em);;
    }
    .default-shopify-add-to-cart .small-text-buttons {
        border: none;
        background: none;
        text-decoration: underline;
        text-transform: uppercase;
        color: var(--dark-blue);
    }
    .product-hero__quantity-wrapper {
        display: none;
    }
    .product-hero__quantity-input {
        width: calc(60/16 * 1em);
        text-align: center;
    }
    @media screen and (max-width: 767px) and (orientation: portrait) {
        padding-bottom: calc(80/16 * 1em);
        &:has(.alert-bar) .product-hero__columns {
             margin-top: calc(64/16 * 1em); 
        }
        .alert-bar {
           margin-top: calc(80/16 * 1em * -1); 
        }
        .product-hero__slider  {
            margin: 0 -20px;
        }
        .product-hero__slide {
            width: 64%;
            margin: 0 6px;
            img {
                border-radius: calc(10/16 * 1em);
            }
        }        
        .product-hero__slider-nav {
            display: none;
        }
        .product-hero__content-column {
            margin-top: calc(40/16 * 1em);
        }
        .product-hero__product {
            text-align: center;
        }
        .product-hero__product-title {
            margin-bottom: calc(10/30 * 1em);
            svg {
                width: calc(30/30 * 1em);
                height: calc(52/30 * 1em); 
            }
            img {
                width: calc(38/36 * 1em);
                height: calc(62/36 * 1em);
            }
        }
        .product-hero__products {
            gap: calc(8/16 * 1em);
        }
        .product-hero__product-days {
            margin-bottom: 7px;
            line-height: 1em;
        }
        .product-hero__product {
            padding: calc(12/16 * 1em) calc(6/16 * 1em) calc(10/16 * 1em);
            &:has(input:checked) {
                outline: calc(2/16 * 1em) solid var(--coral);
                outline-offset: calc(3/16 * 1em);
            }
        }
        .product-hero__product-discounted-price {
            padding: calc(2/20 * 1em) calc(12/20 * 1em);
            border-radius: calc(5/18 * 1em);
            margin-left: auto;
            margin-right: auto;
        } 
        .product-hero__subscription-renewal {
            font-size: calc(12/16 * 1em);
            line-height: 1em;
            letter-spacing: 0.04em;
            margin: calc(4/12 * 1em) 0 1em 0;
        }
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        padding-bottom: calc(120/16 * 1em);
        .product-hero__slider {
            .flickity-viewport {
                border-radius: calc(10/16 * 1em);
                overflow: hidden;
            }
        }
        .product-hero__columns {
            display: flex;
            padding-right: calc(60/16 * 1em);
        }  
        &:has(.alert-bar) .product-hero__columns {
             margin-top: calc(200/16 * 1em); 
        }
        .product-hero__images-column, .product-hero__content-column {
            width: 50%;
        }
        &.product-hero--coming-soon .product-hero__content-column {
            margin-top: calc(58/16 * 1em * -1);
        }
        &.product-hero--product-page .product-hero__content-column {
            margin-top: calc(6/16 * 1em * -1);
        }
        .product-hero__content-column {
            padding-left: calc(50/16 * 1em);
        }
        .product-hero__product-title {
            margin-bottom: calc(10/40 * 1em);
            svg {
                width: calc(43/40 * 1em);
                height: calc(78/40 * 1em); 
            }
            img {
                width: calc(52/40 * 1em);
                height: calc(85/40 * 1em);
            }
        }
        .product-hero__product {
            &:has(input:checked) {
                outline: calc(3/16 * 1em) solid var(--coral);
                outline-offset: calc(6/16 * 1em);
            }
        } 
        .product-hero__product-discounted-price {
            padding: calc(5/20 * 1em) calc(16/20 * 1em);
            border-radius: calc(5/20 * 1em);
            min-width: calc(104/20 * 1em);
        } 
        .product-hero__subscription-renewal {
            font-size: calc(16/16 * 1em);
            line-height: 1em;
            letter-spacing: 0.04em;
            margin: calc(4/16 * 1em) 0 calc(8/16 * 1em) 0;
            font-weight: 600;
        }
    }
}

.product-hero__slider-nav, .product-hero__slider  {
    margin-left: auto;
    margin-right: auto;
    .flickity-prev-next-button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: none; 
        -webkit-appearance: none;
        &:hover {
            background: none; 
        } 
        &:focus {
            box-shadow: none;
        }      
    }
    .flickity-prev-next-button .flickity-button-icon {
        width: 40%;
        height: 40%;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        margin: 0;
        padding: 0;
    }    
}

.product-hero__slider-nav {
    @media screen and (max-width: 767px) and (orientation: portrait) {
        max-width: calc(5 * (66/16 * 1em + 2 * 7/16 * 1em)); /* 5 cells * (cell width + left/right padding) */
        .flickity-prev-next-button.next {
            right: -25px;
        }
        .flickity-prev-next-button.previous {
            left: -25px;
        }  
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        max-width: calc(5 * (66/16 * 1em + 2 * 7/16 * 1em)); /* 5 cells * (cell width + left/right padding) */
        .flickity-prev-next-button.next {
            right: -30px;
        }
        .flickity-prev-next-button.previous {
            left: -30px;
        }           
    }
}

.product-hero__slider {
    @media screen and (max-width: 767px) and (orientation: portrait) {
        .flickity-prev-next-button.next {
            right: calc(50/16 * 1em * -1);
        }
        .flickity-prev-next-button.previous {
            left: calc(50/16 * 1em * -1);
        }  
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        .flickity-prev-next-button {
            display: none;
        }
        /*
        .flickity-prev-next-button.next {
            right: -30px;
        }
        .flickity-prev-next-button.previous {
            left: -30px;
        }
        */
    }
}

/* Dogs */

svg[class*="dog-icon--"] {
    .head, .tail, .body {
        transform-box: fill-box;
        transition: all .5s var(--cubic);
    }
    .anchor {
        fill: #ff0000;
    }
}
.dog-icon--small {
    .anchor {
        display: none;
    }
    .head {
        transform-origin: 0 90%;
        transform: rotate(20deg);
    }  
    .tail {
        transform-origin: 86.86% 61.95%;
        transform: rotate(20deg);
    }  
}
.dog-icon--medium {
    .anchor {
        display: none;
    }
    .head {
        transform-origin: 0 51%;
        transform: rotate(20deg);
    }
    .tail {
        transform-origin: 90.37% 68.26%;
        transform: rotate(20deg);
    } 
}
.dog-icon--large {
    .anchor {
        display: none;
    }
    .head {
        transform-origin: 0 79.90%;
        transform: rotate(20deg);
    }
    .tail {
        transform-origin: 67.07% 56.45%;
        transform: rotate(20deg);
    }
}
button.active {
    .dog-icon--small .head, .dog-icon--medium .head, .dog-icon--large .head {
        transform: rotate(0deg);
    }
}

/* Weight Selector */
.weight-selector {
    --item-width: 110;
    --side-padding: 30;
    width: 100%;
    border-radius: 10px;
    margin-top: calc(20/16 * 1em);
    margin-bottom: calc(52/16 * 1em);
    .sr-only {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
    }
    .icon-row {
        display: flex;
        justify-content: space-between;
        margin-bottom: calc(10/16   * 1em);
    }
    .icon-btn {
        background: none;
        border: none;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        width: calc(var(--item-width)/16 * 1em);
        &:focus-visible {
            outline: 2px solid #7aa7c7;
            outline-offset: 2px;
        }
        svg {
            height: calc(46/16 * 1em);
            width: auto;
            fill: var(--gray);
            transition: fill .5s var(--cubic);
            pointer-events: none;
        }
        &.active svg {
            fill: var(--dark-blue);
        }
    }
    .slider-wrap {
        position: relative;
        &:after {
            display: block;
            position: absolute;
            top: 0;
            z-index: -1;
            content: '';
            height: 3px;
            background: var(--gray);
        }
    }
    input[type="range"] {
        -webkit-appearance: none;
        width: 100%;
        height: 3px;
        background: var(--gray);
        border-radius: 2px;
        margin: 0;
        display: block;
        &::-webkit-slider-thumb {
            -webkit-appearance: none;
            width: calc(var(--item-width)/16 * 1em);
            height: clamp(12px,calc(15/16 * 1em),15px);
            border-radius: 4px;
            background: var(--coral);
            border: none;
            cursor: pointer;
        }
        /* &:active::-webkit-slider-thumb {
            transform: scale(1.15);
        } */
        &::-moz-range-thumb {
            width: calc(var(--item-width)/16 * 1em);
            height: clamp(12px,calc(15/16 * 1em),15px);
            border-radius: 4px;
            background: var(--coral);
            border: none;
            cursor: pointer;
        }

        &:focus-visible {
            outline: 2px solid #7aa7c7;
            outline-offset: 4px;
            border-radius: 2px;
        }
    }

    .label-row {
        display: flex;
        justify-content: space-between;
        margin-top: 14px;
    }

    .label-btn {
        background: none;
        border: none;
        cursor: pointer;
        padding: 0;
        text-transform: uppercase;
        color: var(--light-gray);
        transition: color 0.15s ease;
        text-align: center;
        width: calc(var(--item-width)/14 * 1em);
        &:focus-visible {
            outline: 2px solid #7aa7c7;
            outline-offset: 1px;
        }
        &.active { color: var(--dark-blue); }
    }
    @media screen and (max-width: 767px) and (orientation: portrait) {
        .slider-wrap {
            &:after {
                left: calc(10/16 * 1em * -1);
                right: calc(10/16 * 1em * -1);
            }
        }
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        padding: 0 calc(var(--side-padding)/16 * 1em);
        .slider-wrap {
            &:after {
                left: calc(var(--side-padding)/16 * 1em * -1);
                right: calc(var(--side-padding)/16 * 1em * -1);
            }
        }
    }
}




@media screen and (max-width: 767px) and (orientation: portrait) {
    #product-widget {
        /* display: none; */
    }
}

/* Sticky Product Widget */

.sticky-product-widget {
    --radius: 8px;
    position: fixed;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 10;
    background-color: var(--background);
    transform: translateY(0%);
    transition: transform .5s ease-in-out;
    padding: 20px 20px 20px 20px;
    .sticky-product-widget__toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        left: 50%;
        bottom: 100%;
        transform: translateX(-50%);
        border: none;
        background-color: #fff;
        width: 88px;
        height: 24px;
        border-radius: var(--radius) var(--radius) 0 0;
        svg {
            font-size: 14px;
            width: .58em;
            height: 1em;
            transform: rotate(90deg);
            transition: transform .25s ease-in-out;
        }
        svg * {
            fill: #d0d0d0;
        }
    }
    .sticky-product-widget__inner, .sticky-product-widget__shop-now {
        transition: opacity .25s ease-in-out;
    }
    .sticky-product-widget__inner, .sticky-product-widget__cta {
        opacity: 1;
    }
    .sticky-product-widget__cta {
        /* border-top: 1px solid #d2d0cb; */
        display: flex;
        gap: 10px;
        margin-top: 10px;

        .founder-subscribe, .just-free-jar  {
            height: 40px;
        }
        .founder-subscribe {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-wrap: wrap;
            gap: calc(4/12 * 1em);
        }
        .sticky-product-widget__cta-price {
            display: flex;
            align-items: baseline;
            gap: calc(4/12 * 1em);
        }
        .sticky-product-widget__cta-compare-price {
            font-weight: 400;
        }
    }
    .sticky-product-widget__cta, .shopify-product-form {
        button, a {
            font-size: 12px;
            line-height: 16px; 
            letter-spacing: -0.005em;
            padding: calc(4/14 * 1em) calc(10/14 * 1em);           
        }        
    }
    .sticky-product-widget__cta-disclaimer {
        width: 106%;
        margin: 8px -3% 0 -3%;
        font-size: 10.5px;
        text-align: center;
    }    
    .sticky-product-widget__shop-now {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        width: 100%;
        height: 50px;
        padding: 10px 20px;
        border: none;
        background: transparent;
        font-size: 12px;
        line-height: 16px;
        text-transform: uppercase;
        text-decoration: underline;
        opacity: 0;
        background-color: var(--dark-blue);
        color: var(--background);
    }
    &[data-status="closed"], &[data-status="hidden"] {
        transform: translateY(calc(100% - 50px));
        .sticky-product-widget__toggle {
            /* background-color: var(--dark-blue); */
            svg {
                transform: rotate(-90deg);
            }
            svg * {
                fill: #a4a8aa;
            }
        }
        .sticky-product-widget__inner {
            opacity: 0;
            pointer-events: none;
        }
        .sticky-product-widget__shop-now {
            opacity: 1;
        }
    }
    /* &[data-status="hidden"] {
        transform: translateY(calc(100%));
    } */
    &:before {
        position: absolute;
        content: '';
        width: 100%;
        height: 50px;
        top: 0;
        left: 0;
        right: 0;
        transform: translateY(-100%);
        background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%);
        opacity: .25;
        z-index: 0;
    }
    .dropdown-field {
        position: relative;
        font-size: 12px;
        z-index: 1;
        &:not(:last-child) {
            margin-bottom: 8px;
        }
        &:has(.dropdown-trigger[aria-expanded="true"]) .dropdown-panel {
            box-shadow: 0 0 40px rgba(41,39,36,.2);
        }
        .dropdown-trigger {
            position: relative;
            z-index: 1;
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            background: #fff;
            border: none;
            padding: 0 calc(16/12 * 1em);
            height: calc(40/12 * 1em);
            cursor: pointer;
            text-align: left;
            border-radius: var(--radius);
            &[aria-expanded="true"] .dropdown-arrow {
                transform: rotate(-90deg);
            }
            .dropdown-label {
                color: #999;
                letter-spacing: 0.5px;
            }
            .dropdown-value {
                display: flex;
                align-items: center;
                gap: 8px;
                color: var(--dark-blue);
            }
            .dropdown-value-price {
                margin-right: auto;
                display: inline-flex;
                background-color: var(--light-coral);
                color: var(--dark-blue);
                font-weight: 700;
                padding: 4px 8px;
                border-radius: 4px;
            }
            .dropdown-value-icon {
                margin-left: 10px;
                svg {
                    display: block;
                    width: 30px;
                    height: 30px;
                }
            }
            .dropdown-arrow {
                transform: rotate(90deg);
                margin-left: 16px;
                svg {
                    display: block;
                    font-size: 14px;
                    width: .58em;
                    height: 1em;
                }
                svg * {
                    fill: #b3b5b5;
                }
            }
        }
        &[data-field="dogSize"] .dropdown-label {
            margin-right: auto;
        }
        &[data-field="supply"] .dropdown-label {
            width: 116px;
        }
        .dropdown-panel {
            list-style: none;
            margin: 0;
            padding: 0;
            position: absolute;
            bottom: 0;
            width: 100%;
            border-radius: var(--radius);
            background: var(--background);
            padding-bottom: calc(40/12 * 1em);
            &[hidden] {
                display: none;
            }
            li {
                margin: 0;
                padding: 0 16px;
                cursor: pointer;
                display: flex;
                align-items: center;
                height: 40px;
                &:not(:last-child) {
                    border-bottom: 1px solid #d2d0cb;
                }
                &:first-child {
                    border-radius: var(--radius) var(--radius) 0 0;
                }
                &:last-child {
                    border-radius: 0 0 var(--radius) var(--radius);
                }
                &:hover, &[aria-selected="true"] {
                    /* background: #fff; */
                }
                svg {
                    display: block;
                    width: 30px;
                    height: 30px;
                }
            }
            &#size-options li {
                justify-content: flex-end;
                padding-right: 40px;
                svg {
                    margin-left: 10px;
                }
            }
            &#supply-options li {
                justify-content: space-between;
                padding-right:40px;
                .option-price {                    
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    font-size: 10px;
                    line-height: 14px;                    
                }
                strong {
                    margin: 0 0 0 5px;
                    width: 11ch;
                }
            }
        }
    }
    .default-shopify-add-to-cart {
        margin: calc(8/16 * 1em) 0;
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        display: none;
    }
}



/* Comparison Chart */
.comparison-chart {
    .comparison-chart__heading {
        text-align: center;
    }
    .comparison-chart__legend {
        color: var(--idle-text);
    }
    .comparison-chart__legend-item {
        display: flex;
        align-items: center;
        &:not(:last-child) {
            margin-bottom: calc(14/16 * 1em);
        }
    }
    .comparison-chart__legend-icon.covered, .comparison-chart__legend-icon.partial {
        width: calc(14/16 * 1em);
        height: calc(14/16 * 1em);
        border-radius: 50%;
        margin-right: calc(10/16 * 1em);
    }
    .comparison-chart__legend-icon.covered {
        background-color: var(--dark-blue);
    }
    .comparison-chart__legend-icon.partial {
        border: 1px solid var(--dark-blue);
    }
    .comparison-chart__legend-icon.alternative {
        font-size: calc(14/16 * 1em);
        line-height: calc(18/14 * 1em);
        letter-spacing: 0.02em;
        color: var(--idle-text);
         width: calc(14/14 * 1em);
        margin-right: calc(10/14 * 1em);
        text-align: center;
    }

    
    @media screen and (max-width: 767px) and (orientation: portrait) {
        padding-top: calc(80/16 * 1em);
        padding-bottom: calc(80/16 * 1em);
        --scroll-padding: calc(10/16 * 1em);
        .comparison-chart__heading {
            margin-bottom: calc(60/36 * 1em);
        }
        .comparison-chart__inner {
            overflow-x: scroll;
            padding-bottom: var(--scroll-padding);
        }
        .comparison-chart__wrapper {
            position: relative;
            &::after{
                width: calc(80/16 * 1em);
                position: absolute;
                content: '';
                background: linear-gradient(to right,  rgba(239,234,228,0) 0%,rgba(239,234,228,1) 100%);
                right: 0;
                top: 0;
                bottom: var(--scroll-padding);
            }
        }
        .comparison-chart__legend {
            margin-top: calc(60/16 * 1em);
        }
        .comparison-chart__legend-description {
            padding-right: 20%;
        }
        .comparison-chart__legend-items {
            margin-top: calc(20/16 * 1em)
        }
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        padding: calc(110/16 * 1em) 0;
        .comparison-chart__heading {
            margin-bottom: calc(40/40 * 1em);
        }
        .comparison-chart__wrapper, .comparison-chart__legend {
            padding: 0 calc(15/16 * 1em);
        }
        .comparison-chart__legend {
            margin-top: calc(46/16 * 1em);
            display: flex;
            justify-content: space-between;
        }
        .comparison-chart__legend-description {
            max-width: calc(284/10.5 * 1em)
        }
        .comparison-chart__legend-items {
            min-width: calc(200/16 * 1em)
        }
    }
}



.comparison-chart__table {
    width: 100%;
    th, td {
        border-radius: 0;
        padding: 0;
    }
    .comparison-chart__mark--filled, .comparison-chart__mark--open {
        &:before {
            display: inline-flex;
            border-radius: 50%;
            content: '';
            width: calc(14/16 * 1em);
            height: calc(14/16 * 1em);            
        }
    }
    .comparison-chart__mark--filled:before {
        background-color: var(--coral);
    }
    .comparison-chart__mark--open:before {
        border: 1px solid var(--dark-blue);
    }
    .comparison-chart__value--us .text-buttons {
        font-size: calc(23/16 * 1em);
        color: var(--coral);
        font-weight: bold;
    }   
    .comparison-chart__brand img {
        display: block;
    }
    @media screen and (max-width: 767px) and (orientation: portrait) {
        --fixed-el-width: calc(150/16 * 1em);
        width: calc(800/16 * 1em);
        .comparison-chart__brand img {
            height: calc(48/16 * 1em);
            margin: calc(10/16 * 1em) 0;
        }
        .comparison-chart__brand img[alt="Pet is Hooman"] {
            transform: translateY(2%);
        }
        .comparison-chart__brand img[alt="Pet Sincerity"], .comparison-chart__brand img[alt="A Kinn"] {
            transform: translateY(-12%);
        }
        tbody td, tbody th {
            height: calc(72/16 * 1em);
        }
        thead th {
            padding-bottom: calc(16 /16 * 1em);
            text-transform: uppercase;
            text-align: left;
        }
        thead tr, tbody tr {
            border-bottom: 1px solid #b3b5b5;
        }
        td, th {
            text-align: left;
            &:last-child {
                padding-right: calc(50/16 * 1em);
            }            
        }
        tbody th, thead th {
            &:first-child {
                position: absolute;                
            }
        }
        tbody th {
            &:first-child {
                background: linear-gradient(to right, rgba(239,234,228,1) 85%, rgba(239,234,228,0) 100%);
                width: calc(var(--fixed-el-width) + (0/16 * 1em));
                height: calc(71/16 * 1em);
            }
        }
        thead th {
            &:first-child {
                background: linear-gradient(to right, rgba(239,234,228,1) 0%, rgba(239,234,228,0) 100%);
                width: calc(80/16 * 1em);
                height: calc(44/16 * 1em);
            }
        }
        thead tr th:nth-child(2) {
            padding-left: var(--fixed-el-width);
        }
        tbody tr th + td {
            padding-left: var(--fixed-el-width);
        }
    }

    @media not screen and (max-width: 767px) and (orientation: portrait) {
        thead tr, tbody tr:not(:last-child) {
            border-bottom: 1px solid #b3b5b5;
        }
        th {
            padding: 10px 0;
        }
        td {
            height: calc(64/16 * 1em);
        }
        .text-buttons {
            text-transform: uppercase;
            white-space: nowrap;
        }
        .comparison-chart__mark, .comparison-chart__value {
            text-align: center;
        }  
        .comparison-chart__row-label {
            width: 16%; 
        }
        .comparison-chart__value {
            width: 8.5%; 
        }   
        .comparison-chart__brand img {
            height: calc(60/16 * 1em);
            margin: 0 auto;
        }            
    }
}

.benefits-section + .comparison-chart-section {
    position: relative;
    &:before {
        position: absolute;
        content: '';
        display: block;
        height: calc(1/16 * 1em);
        background-color: var(--light-gray);
        max-width: 1260px;
        margin: 0 auto;
        left:20px;
        right:20px;
    }
}



.fullwidth-cta {
    position: relative;
    z-index: 1;
    overflow-x: clip;
    .fullwidth-cta__image {
        height: auto;
    }
    .fullwidth-cta__outer {
        max-width: 1440px;
        margin: 0 auto;
    }  
    .fullwidth-cta__innner {
        border-radius: 0;
        transition: border-radius .25s ease-in-out;
    }
    @media screen and (min-width: 1440px) {
        .fullwidth-cta__innner {
            overflow: hidden;
            border-radius: 0 0 calc(30/16 *1em) calc(30/16 *1em);
        }   
    }
    @media screen and (max-width: 767px) and (orientation: portrait) {
        margin-top: calc(40/16 * 1em * -1);       
        .fullwidth-cta__image {
            width: 200%;
            max-width: none;
            margin: 0 -90% 0 -10%;
        }
        .fullwidth-cta__content {
            position: relative;
            padding: calc(56/16 * 1em) 20px calc(80/16 * 1em) 20px;
        }
        .fullwidth-cta__content:after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 20px;
            right: 20px;
            background-color: var(--light-gray);
            height: 1px;
        }
        .fullwidth-cta__heading {
            margin-bottom: calc(20/30 * 1em);
        }
        .fullwidth-cta__subheading {
            margin-bottom: calc(50/16 * 1em);
        }
    }
    @media not screen and (max-width: 767px) and (orientation: portrait) {
        margin-top: calc(62/16 * 1em * -1);
        .fullwidth-cta__innner {
            display: grid;
        }
        .fullwidth-cta__innner > * {
            grid-area: 1 / 1;
        }
        .fullwidth-cta__image {
            width: 100%;
        }
        .fullwidth-cta__content {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: flex-start;
            padding-left: 50%;
            padding-right: 20%;
        }
        .fullwidth-cta__heading {
            margin-bottom: calc(20/40 * 1em);
        }
        .fullwidth-cta__subheading {
            margin-bottom: calc(40/18 * 1em);
        }

    }
}

/* Homepage Hero */
.homepage-hero {
    display: grid; 
    grid-auto-columns: 1fr; 
    grid-auto-rows: 1fr; 
    grid-template-columns: 1fr; 
    gap: 0px 0px; 
    position: relative;
    color: var(--background);
    overflow-x: clip;
}

.homepage-hero__background {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 0;
}
.alert-bar {
    width: 100vw;
    align-self: flex-start;
    grid-area: 1 / 1 / 2 / 2; 
}
.homepage-hero__content {
    width: 100%;
    position: relative;
    z-index: 2;
    /* text-align: center; */
    grid-area: 2 / 1 / 3 / 2;
}
.homepage-hero__heading *, .homepage-hero__subheading * {
    /* color: var(--background); */
    margin: 0;
    text-wrap: balance;
}
@media screen and (max-width: 767px) and (orientation: portrait) {
    .homepage-hero {
        grid-template-rows: auto auto auto;
        height: 100vh;
        max-height: 177.6833vw;
    }
    .homepage-hero__background {
        object-position: 65% 0;
    }
    .homepage-hero__content {
        padding: calc(120/16 * 1em) 20px calc(100/16 * 1em) 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
        grid-area: 1 / 1 / 3 / 2;
    }
    .homepage-hero__heading {
        margin-bottom: calc(14/16 * 1em);
    }
    .homepage-hero__subheading {
        text-align: center;
    }
    .homepage-hero__cta {
        margin-top: calc(20/16 * 1em);
    }
}
@media not screen and (max-width: 767px) and (orientation: portrait) {
    .homepage-hero {
        grid-template-rows: 1fr auto 1fr;
        height: 48.6111vw;
        /* max-height: 700px; */
    }
    .homepage-hero__content {
        padding: calc(120/16 * 1em) inherit;
    }
    .homepage-hero__heading {
        margin-bottom: calc(20/16 * 1em);
    }
    .homepage-hero__subheading {
        margin-top: calc(14/16 * 1em);
    }
    .homepage-hero__cta {
        margin-top: calc(50/16 * 1em);
    }
}


/* Fullwidth Image with Button */
.fullwidth-image-with-button {
    display: grid;
}
.fullwidth-image-with-button > * {
    grid-area: 1 / 1;
}
.fullwidth-image-with-button__image {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}
.fullwidth-image-with-button__button {
    align-self: end;
    justify-self: center;
}
.template-index .fullwidth-image-with-button__button, .template-page-faq .fullwidth-image-with-button__button {
    align-self: flex-start;
}
@media screen and (max-width: 767px) and (orientation: portrait) {
    .fullwidth-image-with-button__image {
        aspect-ratio: 1.25 / 1;
    }
    .fullwidth-image-with-button__button {
        margin-bottom: calc(30/16 * 1em);
    }
    .template-index .fullwidth-image-with-button__button, .template-page-faq .fullwidth-image-with-button__button {
       margin-top: calc(40/16 * 1em);
    }
}
@media not screen and (max-width: 767px) and (orientation: portrait) {
    .fullwidth-image-with-button__button {
        margin-bottom: calc(90/16 * 1em);
        width: calc(420/19 * 1em);
    }
    .template-index .fullwidth-image-with-button__button, .template-page-faq .fullwidth-image-with-button__button {
       margin-top: calc(80/16 * 1em);
    }
}

/* Product Info */
.product-info {
    
}

.product-info__image-column, .product-info__content-column {
    /* flex: 1 1 calc(400/16 * 1em); */
}
.product-info__image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: calc(10/16 * 1em)
}
.product-info__heading {
    margin-bottom: calc(30/16 * 1em);
}
.product-info__heading span {
    position: relative;
}
.product-info__heading span img {
    position: absolute;
    left: 100%;
    top: 0;
    transform: translate(3px,-42%);
}
.product-info__points {
    display: flex;
    flex-direction: column;
    gap: calc(20/16 * 1em);
    margin-bottom: calc(30/16 * 1em);
}
.product-info__point {
    display: flex;
    align-items: center;
    gap: calc(12/16 * 1em);
    font-weight: 400;
    svg {
        flex-shrink: 0;
        width: calc(20/16 * 1em);
        height: auto;
    }
    svg * {
        fill: var(--coral);
    }
}
.product-info__point:not(:last-child) {
    margin: 0;
}


@media screen and (max-width: 767px) and (orientation: portrait) {
    .product-info {
        padding: calc(80/16 * 1em) 0 calc(100/16 * 1em) 0;
    }
    .product-info__image-column {
        margin-bottom: calc(50/16 * 1em);
    }
    .product-info__heading span img {
        width: calc(38/36 * 1em);
        height: calc(62/36 * 1em);
    }
}
@media not screen and (max-width: 767px) and (orientation: portrait) {
    .product-info {
        padding: calc(110/16 * 1em) 0 calc(120/16 * 1em) 0;
    }
    .product-info__image-column {
        width: 47.59%;
    }
    .product-info__content-column {
        width: 38.94%;
    }
    .product-info__columns {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: calc(50/16 * 1em);
    }
    .product-info__heading span img {
        width: calc(52/40 * 1em);
        height: calc(85/40 * 1em);
    }
}

/* Advisory Board */
.advisory-board__heading {
    text-align: center;
}
.h-wrapper * {
    margin: 0;
}
.advisory-board__heading:not(:last-child) {
    margin-bottom: calc(70/16 * 1em);
}
.advisory-board__item-card {
    display: flex;
    align-items: start;
}
.advisory-board__item-image {
    display: block;
    width: 30%;
    flex: 1 0 auto;
    height: auto;
    aspect-ratio: 4 / 4.5;
    object-fit: cover;
    border-radius: calc(12/16 * 1em);
}
.advisory-board__item-name {
    text-transform: uppercase;
    margin-top: calc(15/16 * 1em);
}
.advisory-board__item-name * {
    font-weight: bold;
}
.advisory-board .accordion-item-question-heading  {
    color: var(--idle-text);
}
.advisory-board__item-bio {
    display: none;
}
a.advisory-board__item {
    color: var(--dark-blue);
}
a.advisory-board__item:hover {
    color: var(--idle-text);
}
.advisory-board__item span:not(.advisory-board__item-card) {
    display: block;
}
@media screen and (max-width: 767px) and (orientation: portrait) {
    .advisory-board {
        padding: calc(80/16 * 1em) 0 calc(100/16 * 1em) 0;
    }
    .advisory-board__item-description.quotes-wrapper p {
       font-size: calc(13/16 * 1em);
       line-height: calc(22/13 * 1em);
    } 
    .advisory-board__items {
        display: flex;
        flex-direction: column;
        gap: calc(50/16 * 1em);
    }
    .advisory-board__item-card {
        gap: calc(20/16 * 1em);
    }
}
@media not screen and (max-width: 767px) and (orientation: portrait) {
    .advisory-board {
        padding: calc(115/16 * 1em) 0 calc(150/16 * 1em) 0;
    }
    .advisory-board__items {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: calc(50/16 * 1em);
    }
    .advisory-board__item-card {
        gap: calc(30/16 * 1em);
    }
    /*
    .advisory-board__item-image {
        max-width: calc(225/16 * 1em);
    }
    .advisory-board__item-description {
        margin-bottom: calc(105/16 * 1em);
        padding-right: 10%;
    }
    */
    .advisory-board__item-description {
        padding-right: calc(40/16 * 1em);
    }
}

/* Vet Advisory Board */
.vet-advisory-board__heading {
    text-align: center;
}
.vet-advisory-board__item-title:not(:last-child) {
    margin-bottom: calc(20/16 * 1em);
}
.vet-advisory-board__item-quote:not(:last-child) {
    margin-bottom: calc(30/16 * 1em);
}
.vet-advisory-board__item-image {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: calc(12/16 * 1em);
}
@media screen and (max-width: 767px) and (orientation: portrait) {
    .vet-advisory-board {
        padding: calc(60/16 * 1em) 0 0 0;
    }
    .vet-advisory-board__heading:not(:last-child) {
        margin-bottom: calc(50/16 * 1em);
    }
    .vet-advisory-board__items {
        display: flex;
        flex-direction: column;
        gap: calc(60/16 * 1em);
        padding-bottom: calc(50/16 * 1em);
    }
    .vet-advisory-board__item {
        padding-bottom: calc(60/16 * 1em);
    }
    .vet-advisory-board__item:not(:last-child) {
        border-bottom: 1px solid var(--gray);
    }
    .vet-advisory-board__item {
        display: flex;
        flex-direction: column;
        gap: calc(30/16 * 1em);
    }
    .vet-advisory-board__item-image {
        aspect-ratio: 4 / 4.5;
    }
}
@media not screen and (max-width: 767px) and (orientation: portrait) {
    .vet-advisory-board {
        padding: calc(60/16 * 1em) 0 0 0;
    }
    .vet-advisory-board__heading:not(:last-child) {
        margin-bottom: calc(80/16 * 1em);
    }
    .vet-advisory-board__items {
        display: flex;
        flex-direction: column;
        gap: calc(100/16 * 1em);
        padding-bottom: calc(50/16 * 1em);
    }
    .vet-advisory-board__item {
        padding-bottom: calc(100/16 * 1em);
    }
    .vet-advisory-board__item:not(:last-child) {
        border-bottom: 1px solid var(--gray);
    }
    .vet-advisory-board__item {
        display: flex;
        align-items: start;
        gap: calc(60/16 * 1em);
    }
    .vet-advisory-board__item-image {
        width: 38%;
        flex: 1 0 auto;
        aspect-ratio: 4 / 4.5;
    }
}

/* FAQ Categorized */
.faq-categorized {
    padding: calc(60/16 * 1em) 0 calc(120/16 * 1em) 0;
}
.faq-categorized__heading {
    text-align: center;
    margin-bottom: calc(80/16 * 1em);
}
.faq-categorized__nav {
    display: flex;
    flex-direction: column;
}
.faq-categorized__nav-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* width: 100%; */
    text-align: left;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--dark-blue);
    font-weight: 400;
    border-top: 1px solid var(--light-gray);
    span {
        font-family: calc(18/16 * 1em);
        line-height: calc(24/18 * 1em);
        font-weight: bold;
    }
    svg {
        width: calc(10/16 * 1em);
        height: auto;
        flex-shrink: 0;
        margin-left: calc(16/16 * 1em);
        transform: rotate(90deg);
        transition: transform .15s ease-in-out;
    }
    svg * {
        fill: var(--light-gray);
    }
    &:hover {
        background-color: var(--idle-graphics-small);
    }
    &.is-active {
        background-color: var(--idle-pink);
        svg {
            transform: rotate(0deg);
        }
      
    }
}
.faq-categorized .accordion-item-question-heading {
    font-weight: 400;

}
.faq-categorized__panel[hidden] {
    display: none;
}
.faq-categorized__mobile-item {
    &:last-child {
        border-bottom: 1px solid var(--light-gray);
    }
    > summary.faq-categorized__nav-item {
        list-style: none;
        &::-webkit-details-marker {
            display: none;
        }
    }
    &[open] > summary.faq-categorized__nav-item {
        background-color: var(--idle-pink);
        svg {
            transform: rotate(0deg);
        }
    }
}
.faq-categorized__items .metafield-rich_text_field *:last-child {
    margin-bottom: 0;
}
.faq-categorized__items .metafield-rich_text_field ul {
    padding-left: calc(24/14 * 1em)

}
.faq-categorized__items .metafield-rich_text_field li {
    margin-bottom: 0;
}
.faq-categorized__items .accordion-item-content {
    margin: calc(20/16 * 1em) 15% calc(20/16 * 1em) 0
}
.faq-categorized__items .accordion-item-content a {
    color: var(--dark-blue);
    text-decoration: underline;
}
@media screen and (max-width: 767px) and (orientation: portrait) {
    .faq-categorized__layout {
        display: flex;
        flex-direction: column;
        gap: calc(40/16 * 1em);
    }
    .faq-categorized__nav-item {
        padding: calc(20/16 * 1em) calc(10/16 * 1em);
    }
    .faq-categorized__items {
        /* background-color: rgba(255,255,255,.3); */
        margin-bottom: -1px;
    }
    .faq-categorized__items .accordion-item {
        padding-left: calc(20/16 * 1em);
    }
    .faq-categorized__items .accordion-item h3 {
        /* font-weight: 400; */
    }
}
@media not screen and (max-width: 767px) and (orientation: portrait) {
    .faq-categorized__layout {
        display: grid;
        grid-template-columns: 37.5% 1fr;
        gap: calc(50/16 * 1em);
        align-items: start;
    }
    .faq-categorized__nav {
        position: sticky;
        top: 150px;
    }
    .faq-categorized__nav-item {
        min-height: calc(57/16 * 1em);
        padding: calc(16/16 * 1em) calc(10/16 * 1em) calc(16/16 * 1em) calc(20/16 * 1em);
    }
}


/* CART */
.template-cart .page-title {
    margin-bottom: 50px;
}
.template-cart .cart-header {
    font-weight: 700;
    padding-bottom: 16px;
    text-transform: uppercase;
}
.template-cart .cart-instructions * {
    display: none;
}
.template-cart .cart-header, .template-cart .line-item {
    border-color: var(--light-gray);
}
.template-cart .line-item-quantity input {
  border-radius: 4px;
  text-align: center;
}
.template-cart .line-item-prices-discounts {
    margin-bottom: 30px;
}
.template-cart .line-item-image {
    border-radius: 10px;
}
@media (max-width: 768px) {
    .template-cart .page-title {
        margin-top: 30px;
    }
}
@media (min-width: 720px) {
  .template-cart .line-item {
    padding-top: 20px;
    padding-bottom: 20px;
  }
}