.ccr-pgrid {
    --ccr-dark: var(--e-global-color-primary, #160903);
    --ccr-cream: var(--e-global-color-secondary, #f3e5c6);
    --ccr-ink: var(--e-global-color-text, #100602);
    --ccr-white: var(--e-global-color-cc00001, #ffffff);
    --ccr-dark-hover: var(--e-global-color-cc00002, #3a1d0c);
    --ccr-brown: var(--e-global-color-cc00003, #8a5a2b);
    --ccr-eyebrow: var(--e-global-color-cc00024, #8a5a2bbf);
    --ccr-media-bg: var(--e-global-color-cc00025, #8a5a2b12);
    --ccr-muted: var(--e-global-color-cc0000c, #160903b3);
    --ccr-subtle: var(--e-global-color-cc0000e, #1609038c);
    --ccr-faint: var(--e-global-color-cc0000f, #16090380);
    --ccr-line: var(--e-global-color-cc00012, #16090338);
    --ccr-wash: var(--e-global-color-cc00010, #1609030d);
    --ccr-shadow: var(--e-global-color-cc00015, #16090305);
    --ccr-accent: var(--e-global-color-accent, #f5bb70);
    --ccr-card-shadow: 0 18px 30px -16px color-mix(in srgb, var(--ccr-dark) 10%, transparent), 0 44px 70px -30px color-mix(in srgb, var(--ccr-brown) 24%, transparent);
    --ccr-serif: var(--e-global-typography-primary-font-family, "Fraunces"), Georgia, serif;
    --ccr-sans: var(--e-global-typography-text-font-family, "Figtree"), system-ui, sans-serif;
    --ccr-gap: 20px;
    --ccr-ease: cubic-bezier(.2, .7, .2, 1);
    container-type: inline-size;
    width: 100%;
    color: var(--ccr-dark);
}

.elementor-widget:has(.ccr-pgrid) {
    min-width: var(--container-widget-width, 0px);
}

.ccr-pgrid *,
.ccr-pgrid *::before,
.ccr-pgrid *::after {
    box-sizing: border-box;
}

.ccr-pgrid,
.ccr-pgrid .ccr-card {
    scroll-margin-top: calc(var(--ccr-header-h, 100px) + 24px);
}

.ccr-pgrid .ccr-card.is-highlight {
    animation: ccr-card-highlight 2.6s var(--ccr-ease) both;
}

@keyframes ccr-card-highlight {
    0% {
        outline: 2px solid transparent;
        outline-offset: 14px;
    }

    18%,
    70% {
        outline: 2px solid var(--ccr-accent);
        outline-offset: 6px;
    }

    100% {
        outline: 2px solid transparent;
        outline-offset: 6px;
    }
}

.ccr-pgrid__defs {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    pointer-events: none;
}

.ccr-pgrid .ccr-pgrid__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 30px var(--ccr-gap);
    max-width: 440px;
    margin: 0 auto;
    padding: 0;
}

.ccr-pgrid .ccr-card {
    --ccr-pad: 30px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--ccr-gap);
    min-width: 0;
    margin: 0;
    padding: 0 0 var(--ccr-pad);
    background: var(--ccr-white);
    border-radius: 28px 28px 18px 18px;
    box-shadow: var(--ccr-card-shadow);
}

.ccr-pgrid .ccr-card > :not(.ccr-card__media) {
    margin-inline: var(--ccr-pad);
}

.ccr-pgrid .ccr-card__media {
    --ccr-obj-top: 11.4%;
    --ccr-obj-size: 106%;
    position: relative;
    aspect-ratio: 340 / 354;
    margin: 0;
    overflow: hidden;
    border-radius: 28px 28px 0 0;
    background: var(--ccr-media-bg);
    isolation: isolate;
}

.ccr-pgrid .ccr-card__media::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 92%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(closest-side, color-mix(in srgb, var(--ccr-accent) 50%, transparent), color-mix(in srgb, var(--ccr-accent) 18%, transparent) 55%, transparent);
    opacity: 0;
    translate: -50% -50%;
    scale: .8;
    transition: opacity 1.1s var(--ccr-ease), scale 1.4s var(--ccr-ease);
    pointer-events: none;
}

.ccr-pgrid .ccr-card__media-link {
    position: absolute;
    inset: 0;
    display: block;
    transform-origin: 50% 62%;
    transition: transform 1.3s var(--ccr-ease);
}

.ccr-pgrid .ccr-card:hover .ccr-card__media::before,
.ccr-pgrid .ccr-card:has(:focus-visible) .ccr-card__media::before {
    opacity: 1;
    scale: 1;
}

.ccr-pgrid .ccr-card:hover .ccr-card__media-link,
.ccr-pgrid .ccr-card:has(:focus-visible) .ccr-card__media-link {
    transform: scale(1.035);
}

.ccr-pgrid .ccr-card__img {
    position: absolute;
    top: 5.5%;
    left: 5%;
    width: 90%;
    max-width: none;
    height: auto;
    aspect-ratio: 305 / 430;
    margin: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    object-fit: contain;
    object-position: center top;
    transition: opacity .4s ease;
}

.ccr-pgrid .ccr-card__img.has-box {
    top: calc(var(--ccr-obj-top) - var(--ccr-obj-size) * var(--ccr-ot) / var(--ccr-oh));
    left: 50%;
    width: auto;
    height: calc(var(--ccr-obj-size) / var(--ccr-oh));
    aspect-ratio: auto;
    object-fit: fill;
    translate: calc(var(--ccr-oc) * -100%) 0;
    filter: url("#ccr-soft-shadow");
}

.ccr-pgrid .ccr-card.is-unavailable .ccr-card__img {
    opacity: .6;
}

.ccr-pgrid .ccr-card__eyebrow {
    position: absolute;
    top: 16px;
    left: 20px;
    z-index: 1;
    max-width: calc(100% - 130px);
    color: var(--ccr-eyebrow);
    font-family: var(--e-global-typography-ca00006-font-family, "Fraunces"), Georgia, serif;
    font-size: var(--e-global-typography-ca00006-font-size, 12px);
    font-weight: var(--e-global-typography-ca00006-font-weight, 600);
    line-height: var(--e-global-typography-ca00006-line-height, 1.5em);
    letter-spacing: var(--e-global-typography-ca00006-letter-spacing, 3px);
    text-transform: var(--e-global-typography-ca00006-text-transform, uppercase);
    pointer-events: none;
}

.ccr-pgrid .ccr-card__stock {
    position: absolute;
    top: 15px;
    right: 19px;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    border-radius: 19px;
    background: var(--ccr-white);
    color: var(--ccr-dark);
    font-family: var(--e-global-typography-ca00020-font-family, "Figtree"), system-ui, sans-serif;
    font-size: var(--e-global-typography-ca00020-font-size, 11px);
    font-weight: var(--e-global-typography-ca00020-font-weight, 600);
    line-height: 16.5px;
    letter-spacing: var(--e-global-typography-ca00020-letter-spacing, .5px);
    white-space: nowrap;
    pointer-events: none;
}

.ccr-pgrid .ccr-card__stock[data-stock="onbackorder"] {
    background: var(--ccr-cream);
}

.ccr-pgrid .ccr-card__stock[data-stock="outofstock"] {
    background: var(--ccr-dark);
    color: var(--ccr-cream);
}

.ccr-pgrid .ccr-card__title {
    margin-block: 0;
    padding: calc(var(--ccr-pad) - var(--ccr-gap)) 0 0;
    color: var(--ccr-ink);
    font-family: var(--e-global-typography-ca00004-font-family, "Fraunces"), Georgia, serif;
    font-size: var(--e-global-typography-ca00004-font-size, 24px);
    font-weight: var(--e-global-typography-ca00004-font-weight, 400);
    line-height: var(--e-global-typography-ca00004-line-height, 30px);
    letter-spacing: var(--e-global-typography-ca00004-letter-spacing, .5px);
    text-transform: none;
    text-wrap: balance;
}

.ccr-pgrid .ccr-card__title a {
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    line-height: inherit;
    text-decoration: none;
}

.ccr-pgrid .ccr-card__title a:hover,
.ccr-pgrid .ccr-card__title a:focus {
    color: inherit;
    text-decoration: none;
}

.ccr-pgrid .ccr-card__subtitle {
    display: block;
    margin-top: 2px;
    font-family: var(--e-global-typography-ca00005-font-family, "Fraunces"), Georgia, serif;
    font-size: var(--e-global-typography-ca00005-font-size, 18px);
    font-weight: var(--e-global-typography-ca00005-font-weight, 400);
    line-height: var(--e-global-typography-ca00005-line-height, 30px);
    letter-spacing: var(--e-global-typography-ca00005-letter-spacing, .5px);
}

.ccr-pgrid .ccr-card__desc {
    margin-block: 0;
    color: var(--ccr-muted);
    font-family: var(--e-global-typography-ca00015-font-family, "Figtree"), system-ui, sans-serif;
    font-size: var(--e-global-typography-ca00015-font-size, 14px);
    font-weight: var(--e-global-typography-ca00015-font-weight, 500);
    line-height: var(--e-global-typography-ca00015-line-height, 23px);
    letter-spacing: var(--e-global-typography-ca00015-letter-spacing, .14px);
}

.ccr-pgrid .ccr-card__tags {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    gap: 5px;
    margin-block: 0;
    padding: 0;
    list-style: none;
}

.ccr-pgrid .ccr-card__tag {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 2px 10px;
    border-radius: 19px;
    background: var(--ccr-cream);
    color: var(--ccr-dark);
    font-family: var(--e-global-typography-ca0001f-font-family, "Figtree"), system-ui, sans-serif;
    font-size: var(--e-global-typography-ca0001f-font-size, 11px);
    font-weight: var(--e-global-typography-ca0001f-font-weight, 500);
    line-height: 16.5px;
    letter-spacing: var(--e-global-typography-ca0001f-letter-spacing, .5px);
    white-space: nowrap;
}

.ccr-pgrid .ccr-card__form {
    display: flex;
    flex-direction: column;
    gap: var(--ccr-gap);
    margin-block: auto 0;
    padding: 0;
}

.ccr-pgrid .ccr-card__options {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

.ccr-pgrid .ccr-card__options-label {
    color: var(--ccr-faint);
    font-family: var(--e-global-typography-ca00022-font-family, "Figtree"), system-ui, sans-serif;
    font-size: var(--e-global-typography-ca00022-font-size, 11px);
    font-weight: var(--e-global-typography-ca00022-font-weight, 500);
    line-height: var(--e-global-typography-ca00022-line-height, 1em);
    letter-spacing: var(--e-global-typography-ca00022-letter-spacing, 1.5px);
    text-transform: var(--e-global-typography-ca00022-text-transform, uppercase);
}

.ccr-pgrid .ccr-card__choices {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-content: start;
    gap: 10px;
}

.ccr-pgrid .ccr-choice {
    position: relative;
    display: block;
    min-width: 0;
    margin: 0;
    cursor: pointer;
}

.ccr-pgrid .ccr-choice input.ccr-choice__input[type="radio"] {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: none;
    box-shadow: none;
    opacity: 0;
    cursor: pointer;
    appearance: none;
}

.ccr-pgrid .ccr-choice__text {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 35px;
    padding: 0 6px;
    overflow: hidden;
    border: 1px solid var(--ccr-line);
    border-radius: 10px;
    background: transparent;
    color: var(--ccr-dark);
    font-family: var(--e-global-typography-ca0001c-font-family, "Figtree"), system-ui, sans-serif;
    font-size: var(--e-global-typography-ca0001c-font-size, 13px);
    font-weight: var(--e-global-typography-ca0001c-font-weight, 600);
    line-height: 1;
    letter-spacing: var(--e-global-typography-ca0001c-letter-spacing, .5px);
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}

.ccr-pgrid .ccr-choice:hover .ccr-choice__text {
    border-color: var(--ccr-dark);
}

.ccr-pgrid .ccr-choice.is-disabled {
    cursor: not-allowed;
}

.ccr-pgrid .ccr-choice.is-disabled input.ccr-choice__input[type="radio"] {
    cursor: not-allowed;
}

.ccr-pgrid .ccr-choice.is-disabled .ccr-choice__text,
.ccr-pgrid .ccr-choice.is-disabled:hover .ccr-choice__text {
    border-color: var(--ccr-line);
    opacity: .4;
}

.ccr-pgrid .ccr-choice.is-soldout .ccr-choice__text {
    color: var(--ccr-faint);
    text-decoration: line-through;
    text-decoration-thickness: 1px;
}

.ccr-pgrid .ccr-choice input.ccr-choice__input:checked + .ccr-choice__text {
    border-color: var(--ccr-dark);
    background: var(--ccr-dark);
    color: var(--ccr-cream);
}

.ccr-pgrid .ccr-choice input.ccr-choice__input:focus-visible + .ccr-choice__text {
    outline: 2px solid var(--ccr-dark);
    outline-offset: 2px;
}

.ccr-pgrid .ccr-card__buy {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
}

.ccr-pgrid .ccr-qty {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    width: 100px;
    height: 45px;
    padding: 0 4px;
    border: 1px solid var(--ccr-line);
    border-radius: 10px;
    background: var(--ccr-white);
    transition: border-color .25s ease;
}

.ccr-pgrid .ccr-qty:hover {
    border-color: var(--ccr-dark);
}

.ccr-pgrid .ccr-qty:focus-within {
    border-color: var(--ccr-dark);
    box-shadow: 0 0 0 1px var(--ccr-dark);
}

.ccr-pgrid .ccr-qty button.ccr-qty__btn {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 35px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    box-shadow: none;
    color: var(--ccr-dark);
    font-family: var(--ccr-sans);
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0;
    cursor: pointer;
    transition: background-color .2s ease, opacity .2s ease;
}

.ccr-pgrid .ccr-qty button.ccr-qty__btn:hover,
.ccr-pgrid .ccr-qty button.ccr-qty__btn:focus {
    border: 0;
    background: var(--ccr-wash);
    color: var(--ccr-dark);
}

.ccr-pgrid .ccr-qty button.ccr-qty__btn:focus-visible {
    outline: 2px solid var(--ccr-dark);
    outline-offset: 1px;
    box-shadow: none;
}

.ccr-pgrid .ccr-qty button.ccr-qty__btn:disabled {
    background: transparent;
    opacity: .3;
    cursor: default;
}

.ccr-pgrid .ccr-qty input.ccr-qty__input[type="number"],
.ccr-pgrid .ccr-qty input.ccr-qty__input[type="number"]:focus {
    width: 32px;
    min-width: 0;
    height: 35px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    outline: 0;
    color: var(--ccr-dark);
    font-family: var(--e-global-typography-ca0001c-font-family, "Figtree"), system-ui, sans-serif;
    font-size: var(--e-global-typography-ca0001c-font-size, 13px);
    font-weight: var(--e-global-typography-ca0001c-font-weight, 600);
    line-height: 1;
    letter-spacing: var(--e-global-typography-ca0001c-letter-spacing, .5px);
    text-align: center;
    appearance: textfield;
    -moz-appearance: textfield;
}

.ccr-pgrid .ccr-qty input.ccr-qty__input::-webkit-inner-spin-button,
.ccr-pgrid .ccr-qty input.ccr-qty__input::-webkit-outer-spin-button {
    margin: 0;
    -webkit-appearance: none;
}

.ccr-pgrid .ccr-card__price {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 7px;
    min-width: 0;
    text-align: right;
}

.ccr-pgrid .ccr-card__amount {
    display: block;
    color: var(--ccr-dark);
    font-family: var(--e-global-typography-ca0001d-font-family, "Figtree"), system-ui, sans-serif;
    font-size: var(--e-global-typography-ca0001d-font-size, 24px);
    font-weight: var(--e-global-typography-ca0001d-font-weight, 600);
    line-height: var(--e-global-typography-ca0001d-line-height, 22px);
    letter-spacing: var(--e-global-typography-ca0001d-letter-spacing, .5px);
    white-space: nowrap;
}

.ccr-pgrid .ccr-card__amount del {
    position: absolute;
    right: 0;
    bottom: 100%;
    margin-bottom: 4px;
    color: var(--ccr-faint);
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    text-decoration-thickness: 1px;
}

.ccr-pgrid .ccr-card__amount ins {
    background: none;
    color: inherit;
    text-decoration: none;
}

.ccr-pgrid .ccr-card__unit {
    color: var(--ccr-subtle);
    font-family: var(--e-global-typography-ca0001c-font-family, "Figtree"), system-ui, sans-serif;
    font-size: var(--e-global-typography-ca0001c-font-size, 13px);
    font-weight: var(--e-global-typography-ca0001c-font-weight, 600);
    line-height: var(--e-global-typography-ca0001c-line-height, 1.5em);
    letter-spacing: var(--e-global-typography-ca0001c-letter-spacing, .5px);
    white-space: nowrap;
}

.ccr-pgrid .ccr-card__actions {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    align-items: center;
    gap: 10px 18px;
    min-width: 0;
}

.ccr-pgrid button.ccr-card__submit {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 45px;
    margin: 0;
    padding: 0 30px;
    border: 1px solid var(--ccr-dark);
    border-radius: 10px;
    background: var(--ccr-dark);
    box-shadow: none;
    color: var(--ccr-cream);
    font-family: var(--e-global-typography-ca00013-font-family, "Figtree"), system-ui, sans-serif;
    font-size: var(--e-global-typography-ca00013-font-size, 15px);
    font-weight: var(--e-global-typography-ca00013-font-weight, 600);
    line-height: var(--e-global-typography-ca00013-line-height, 1.5em);
    letter-spacing: var(--e-global-typography-ca00013-letter-spacing, .5px);
    text-transform: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color .3s ease, border-color .3s ease, color .3s ease, transform .15s ease;
}

.ccr-pgrid button.ccr-card__submit:hover,
.ccr-pgrid button.ccr-card__submit:focus {
    border-color: var(--ccr-dark-hover);
    background: var(--ccr-dark-hover);
    color: var(--ccr-cream);
}

.ccr-pgrid button.ccr-card__submit:active {
    transform: scale(.98);
}

.ccr-pgrid button.ccr-card__submit:focus-visible {
    outline: 2px solid var(--ccr-dark);
    outline-offset: 2px;
    box-shadow: none;
}

.ccr-pgrid button.ccr-card__submit:disabled,
.ccr-pgrid button.ccr-card__submit:disabled:hover {
    border-color: var(--ccr-line);
    background: transparent;
    color: var(--ccr-faint);
    cursor: not-allowed;
    transform: none;
}

.ccr-pgrid .ccr-card__submit-text {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: opacity .2s ease;
}

.ccr-pgrid .ccr-card.is-added .ccr-card__submit-text::before {
    content: "";
    width: 12px;
    height: 7px;
    margin-top: -3px;
    border-bottom: 2px solid currentColor;
    border-left: 2px solid currentColor;
    transform: rotate(-45deg);
}

.ccr-pgrid .ccr-card.is-loading .ccr-card__submit-text {
    opacity: 0;
}

.ccr-pgrid .ccr-card.is-loading button.ccr-card__submit::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 18px;
    height: 18px;
    margin: -9px 0 0 -9px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: ccr-spin .7s linear infinite;
}

.ccr-pgrid .ccr-card.is-loading button.ccr-card__submit {
    cursor: progress;
}

.ccr-pgrid a.ccr-card__cart-link {
    color: var(--ccr-dark);
    font-family: var(--e-global-typography-ca0001c-font-family, "Figtree"), system-ui, sans-serif;
    font-size: var(--e-global-typography-ca0001c-font-size, 13px);
    font-weight: var(--e-global-typography-ca0001c-font-weight, 600);
    line-height: var(--e-global-typography-ca0001c-line-height, 1.5em);
    letter-spacing: var(--e-global-typography-ca0001c-letter-spacing, .5px);
    text-decoration: underline;
    text-decoration-color: var(--ccr-line);
    text-underline-offset: 4px;
    white-space: nowrap;
    transition: text-decoration-color .25s ease, color .25s ease;
    animation: ccr-fade-in .35s var(--ccr-ease);
}

.ccr-pgrid a.ccr-card__cart-link:hover {
    color: var(--ccr-brown);
    text-decoration: underline;
    text-decoration-color: currentColor;
}

.ccr-pgrid .ccr-card__notice {
    flex-basis: 100%;
    margin: 0;
    color: var(--ccr-brown);
    font-family: var(--e-global-typography-ca0001a-font-family, "Figtree"), system-ui, sans-serif;
    font-size: var(--e-global-typography-ca0001a-font-size, 13px);
    font-weight: var(--e-global-typography-ca0001a-font-weight, 500);
    line-height: var(--e-global-typography-ca0001a-line-height, 1.5em);
}

.ccr-pgrid .ccr-card__announce {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

.ccr-pgrid .ccr-card__notice:empty,
.ccr-pgrid .ccr-card__unit[hidden],
.ccr-pgrid a.ccr-card__cart-link[hidden] {
    display: none;
}

@keyframes ccr-spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes ccr-fade-in {
    from {
        opacity: 0;
        transform: translateX(-4px);
    }
}

@supports (grid-template-rows: subgrid) {
    .ccr-pgrid .ccr-card {
        display: grid;
        grid-row: span 7;
        grid-template-rows: subgrid;
        row-gap: var(--ccr-gap);
        grid-template-columns: minmax(0, 1fr);
        padding: 0;
        background: none;
        box-shadow: none;
    }

    .ccr-pgrid .ccr-card > * {
        grid-column: 1;
    }

    .ccr-pgrid .ccr-card::before {
        content: "";
        grid-row: 2 / -1;
        grid-column: 1;
        margin-top: calc(-1 * var(--ccr-gap));
        border-radius: 0 0 18px 18px;
        background: var(--ccr-white);
        box-shadow: var(--ccr-card-shadow);
    }

    .ccr-pgrid .ccr-card__media {
        grid-row: 1;
    }

    .ccr-pgrid .ccr-card__title {
        grid-row: 2;
    }

    .ccr-pgrid .ccr-card__desc {
        grid-row: 3;
    }

    .ccr-pgrid .ccr-card__tags {
        grid-row: 4;
    }

    .ccr-pgrid .ccr-card__form {
        display: grid;
        grid-row: 5 / span 3;
        grid-template-rows: subgrid;
        row-gap: var(--ccr-gap);
        margin-block: 0;
    }

    .ccr-pgrid .ccr-card__options {
        grid-row: 1;
    }

    .ccr-pgrid .ccr-card__buy {
        grid-row: 2;
    }

    .ccr-pgrid .ccr-card__actions {
        grid-row: 3;
        margin-bottom: var(--ccr-pad);
    }
}

@container (min-width: 620px) {
    .ccr-pgrid .ccr-pgrid__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        row-gap: 40px;
        max-width: none;
    }
}

@container (min-width: 1000px) {
    .ccr-pgrid .ccr-pgrid__grid {
        grid-template-columns: repeat(var(--ccr-pgrid-cols, 4), minmax(0, 1fr));
    }
}

@container (min-width: 1000px) and (max-width: 1279px) {
    .ccr-pgrid .ccr-card {
        --ccr-pad: 22px;
    }

    .ccr-pgrid .ccr-qty {
        width: 90px;
    }

    .ccr-pgrid button.ccr-card__submit {
        padding-inline: 22px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ccr-pgrid .ccr-card,
    .ccr-pgrid .ccr-card__img,
    .ccr-pgrid .ccr-card__media-link,
    .ccr-pgrid .ccr-choice__text,
    .ccr-pgrid button.ccr-card__submit,
    .ccr-pgrid a.ccr-card__cart-link {
        transition: none;
        animation: none;
    }

    .ccr-pgrid .ccr-card:hover .ccr-card__media-link,
    .ccr-pgrid .ccr-card:has(:focus-visible) .ccr-card__media-link {
        transform: none;
    }
}
