/** Shopify CDN: Minification failed

Line 248:5 Expected "}" to go with "{"

**/
.formula-container--wrapper {
    padding-top: 0;
    padding-bottom: 0;
}

.formula-container {
    position: relative;
}

.formula-content {
    padding-bottom: calc(var(--med-space) + 17px);
}
.template-index .formula-content{
     padding-top: calc(var(--med-space) + 17px);
}

.formula-content h2,
.formula-content p {
    margin-bottom: var(--med-space);
    max-width: 800px;
}
.formula-content p {
    margin-bottom: calc(var(--med-space) + 15px);
}

.formula-blocks .formula-card {
    padding:25px;
    background: var(--product-card-color);
    border-radius: var(--sp-border-radius);
    width: 82%;
    min-height: 100%;
    margin-right: var(--med-space);
    /* border:1px solid var(--joon-blue); */
    box-shadow:var(--joon-shadow);
    color:var(--product-card-color-text);
}

.formula-blocks:after {
    content: 'flickity';
    display: none; /* hide :after */
}

.formula-container .formula-logo {
    max-width: 250px;
    object-fit: contain;
    height: auto;
}

.subtitle a {
    display: flex;
    align-items: center;
    column-gap:0;
}

.formula-container  .formula-logo-wrapper {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    padding: calc(var(--large-space) - 5px) 0 var(--large-space) 0;
    font-size: 15px;
    font-weight: 700!important;
}

.formula-title {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: var(--med-space);
    margin-bottom: var(--med-space);
    border-bottom: 0.75px solid #1E0633;
}
.formula-animated-gif {
    display: flex;
    padding: 0 0 var(--med-space) 0;
    position: relative;
}
.formula-animated-gif img {
    height: auto;
}

.formula-animated-gif p {
    position: absolute;
    transform: translateX(-100%) rotate(-90deg);
    transform-origin: right;
    left: 100%;
    text-align: center;
    top: -20px;
    font-size: 8px;
}

.formula-accordion .accordion__trigger:after, .formula-accordion .accordion__trigger:before {
    width: 8px;
}

.formula-accordion .accordion__item:first-of-type {
    padding-top: var(--small-space);
    border-top: var(--border-width) solid currentColor;
}

.formula-accordion .accordion__item:last-of-type {
    border-bottom: none;
}

.formula-accordion .accordion__item {
    padding-bottom: var(--small-space);
    margin-bottom: var(--small-space);
}

.formula-card-content {
    padding-bottom: var(--large-space);
}

.formula-modal {
    display: flex;
    visibility: hidden;
    opacity: 0;
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    align-items: center;
    justify-content: center;
    padding: var(--med-space);
    transition: opacity .5s, backdrop-filter .6s;
    background: rgba(0, 0, 0, .3);
    z-index: 999;
    backdrop-filter: blur(0px);
}

.open-formula-modal,
.close-formula-modal {
    cursor: pointer;
}
.close-formula-modal{
    position: sticky;
    top: 0;
    right: 0px;
    text-align: right;
    width: 100%;
    display: block;
    background: transparent;
    transform:translateX(20px) translateY(-18px);
}

.formula-modal.active {
    visibility: visible;
    opacity: 1;
    backdrop-filter: blur(4px);
}

.formula-modal-content {
    padding: var(--large-space);
    background: var(--joon-cream);
    border-radius: var(--sp-border-radius);
    height: 70%;
    overflow: scroll;
    max-height: 70dvh;
    width: 90vw;
    
}
.formula-modal-content--content{
padding-right: 30px;
}
.formula-modal-content--content strong{
    display: inline-block;
    margin-bottom: 6px;
}
.formula-modal-content--heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: var(--large-space);
}

@media (min-width:1020px){
    .formula-container--wrapper {
        padding-top: var(--xlarge-space);
        padding-bottom: var(--xlarge-space);
    }
    .formula-content {
        padding-bottom: calc(var(--xlarge-space) + var(--med-space));
        padding-left: var(--padding-columns) !important;
        padding-right: var(--padding-columns)!important;
    }
    .formula-content h2 {
        max-width: 60%;
    }
    .formula-container .formula-logo {
        position: absolute;
        right: var(--xlarge-space);
        top: 0;
    }
    .formula-blocks {
        display: flex;
        column-gap: var(--med-space);
        flex-wrap: nowrap;
      justify-content: center;
        padding-left: calc(var(--padding-columns) - 5px);
        padding-right: calc(var(--padding-columns) - 5px);
    }
    .formula-blocks .formula-card {
        width: calc(25% - var(--med-space));
        margin-right: 0;
    }
    .formula-blocks:after {
        content: '';
    }
    .formula-modal {
       padding: var(--xlarge-space);
    }
    .formula-modal-content {
        padding: var(--xlarge-space);
        height: auto;
    }
    .formula-container .formula-logo-wrapper {
        padding: 0;
    }
    .formula-blocks {
        
    }
}
@media (max-width:1020px){
.formula-blocks.nojsvs{
    display: flex;
    column-gap: 0;
    flex-wrap: nowrap;
    justify-content: flex-start;
    padding-left: var(--padding-columns);
    overflow-y: auto;
    scroll-snap-type: x mandatory;
      -ms-overflow-style: none;  /* Internet Explorer 10+ */
    scrollbar-width: none;  /* Firefox, Safari 18.2+, Chromium 121+ */
}
.formula-blocks.nojsvs::-webkit-scrollbar { 
    display: none;  /* Older Safari and Chromium */
}

    .formula-blocks.nojsvs .formula-card{
        min-width: 85vw;
    }