.background-preview-202610 {
    margin: 0;
    min-height: 100vh;
    background-color: #fff;
}

.background-preview-202610 a:focus-visible {
    outline: 3px solid #433f7c;
    outline-offset: 4px;
}

.background-preview-202610__hero {
    padding-block: 60px;
}

.background-preview-202610__heading {
    width: 90%;
    margin-inline: auto;
}

.background-preview-202610__visual {
    display: block;
    width: 100%;
    height: auto;
}

.points-campaign-202610 {
    padding-top: clamp(36px, 7vw, 64px);
    padding-bottom: clamp(36px, 7vw, 64px);
    background: #fff;
}

.points-campaign-202610__garland {
    display: block;
    width: 90%;
    height: auto;
    margin: 0 auto clamp(20px, 4vw, 30px);
}

.points-campaign-202610__banners {
    display: grid;
    gap: clamp(24px, 5vw, 40px);
    width: 85%;
    margin-inline: auto;
}

.points-campaign-202610__banners img,
.points-campaign-202610__links img {
    display: block;
    width: 100%;
    height: auto;
}

.points-campaign-202610__guides {
    display: grid;
    gap: clamp(28px, 6vw, 48px);
    margin-top: clamp(36px, 7vw, 64px);
}

.points-campaign-202610__divider {
    display: block;
    width: 90%;
    height: auto;
    margin-inline: auto;
}

.points-campaign-202610__links {
    display: grid;
    gap: clamp(20px, 4vw, 32px);
    width: 75%;
    margin-inline: auto;
}

.points-campaign-202610__links a {
    display: block;
}

.points-campaign-202610__links a:focus-visible {
    outline: 3px solid #433f7c;
    outline-offset: 4px;
}

.reservation-202610 {
    display: grid;
    justify-items: center;
    padding-bottom: clamp(36px, 7vw, 64px);
    background: #fff;
}

.reservation-202610__banner {
    display: block;
    width: 85%;
}

.reservation-202610__banner img {
    display: block;
    width: 100%;
    height: auto;
}

.reservation-202610__banner:focus-visible {
    outline: 3px solid #433f7c;
    outline-offset: 4px;
}

.campaign-preview-202610 {
    background: #e9ac77 url("../img/202610/_parts/pickup-bg-stripe.svg") repeat;
    background-size: 40px 40px;
}

.pickup-preview-202610 {
    padding-block: 48px;
}

.pickup-preview-202610__panel {
    container-type: inline-size;
    width: 90%;
    margin-inline: auto;
    overflow: hidden;
    border-radius: 18px;
    background-color: #f3ebdd;
}

.pickup-preview-202610__title {
    position: relative;
    margin: 0;
    padding-top: 30cqw;
    isolation: isolate;
}

.pickup-preview-202610__title::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    z-index: -1;
    width: 100%;
    aspect-ratio: 4 / 3;
    background: url("../img/202610/_parts/pickup-halloween-top-ghost-spaced.webp") center top / 100% auto no-repeat;
    mask-image: linear-gradient(#000 80%, transparent);
}

.pickup-preview-202610__copy {
    width: 68%;
    margin-inline: auto;
    text-align: center;
}

.pickup-preview-202610__label {
    display: block;
    width: 73.5%;
    height: auto;
    margin-inline: auto;
}

.pickup-preview-202610__headline {
    width: 90%;
    max-width: 380px;
    margin: 3cqw auto 0;
}

.pickup-preview-202610__headline-image {
    display: block;
    width: 100%;
    height: auto;
}

.pickup-preview-202610__intro {
    position: relative;
    isolation: isolate;
    width: 84%;
    margin-inline: auto;
    padding-top: 4cqw;
    color: #262020;
    font-family: inherit;
    font-weight: 400;
}

.pickup-preview-202610__intro::before {
    content: "";
    position: absolute;
    inset: 0 -9.5%;
    z-index: -1;
    background: url("../img/202610/_parts/pickup-moon-soft-clouds.webp") calc(50% - 12cqw) 45% / 75% auto no-repeat;
    mask-image: linear-gradient(transparent, #000 12%, #000 88%, transparent);
    opacity: 0.4;
    pointer-events: none;
}

.pickup-preview-202610__intro p {
    margin: 0;
    font-size: 28px;
    line-height: 1.9;
    text-align: center;
    line-break: strict;
    overflow-wrap: break-word;
    text-wrap: pretty;
}

.pickup-preview-202610__intro p + p {
    margin-top: 0.7em;
}

.pickup-preview-202610__line {
    display: block;
    white-space: nowrap;
}

.pickup-preview-202610__footer {
    display: block;
    width: 100%;
    height: auto;
    mask-image: linear-gradient(transparent, #000 10%);
}

.category-preview-202610 {
    display: grid;
    gap: clamp(40px, 7vw, 64px);
    padding-block: 20px 80px;
}

.category-preview-202610__section {
    min-width: 0;
}

.category-preview-202610__heading {
    width: min(54%, 260px);
    margin-inline: auto;
    container-type: inline-size;
}

.category-preview-202610__ghost,
.category-preview-202610__mascot {
    position: relative;
    z-index: 1;
    display: block;
    width: 112%;
    max-width: none;
    height: auto;
    margin: 0 -6% -4%;
}

.category-title-202610 {
    --category-accent: #e9a063;
    --category-secondary: #795397;
    --category-ink: #45273e;
    position: relative;
    isolation: isolate;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    aspect-ratio: 1.05;
    padding: 10% 8% 24%;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 88%, 0 100%);
    background: var(--category-accent);
    color: var(--category-ink);
    font-family: "Zen Maru Gothic", "Hiragino Maru Gothic ProN", sans-serif;
    font-weight: 900;
    text-align: center;
}

.category-title-202610::before {
    content: "";
    position: absolute;
    inset: 12px 12px 20%;
    border: 1px dashed currentColor;
    opacity: 0.35;
    pointer-events: none;
}

.category-title-202610--body {
    --category-accent: #b7a0c8;
    --category-secondary: #fff4da;
}

.category-title-202610--inner {
    --category-accent: #f4dfad;
    --category-secondary: #a95329;
}

.category-title-202610__image {
    display: block;
    width: 100%;
    height: auto;
    margin-inline: auto;
}

.category-title-202610__spark {
    position: absolute;
    color: var(--category-secondary);
    font-size: clamp(14px, 6cqw, 20px);
    line-height: 1;
}

.category-title-202610__spark--left {
    left: 10%;
    top: 8%;
    transform: rotate(-15deg);
}

.category-title-202610__spark--right {
    right: 13%;
    top: 66%;
    transform: rotate(12deg);
}

.product-card-202610 {
    container-type: inline-size;
    --product-text-size: 18px;
    box-sizing: border-box;
    width: 90%;
    margin: clamp(24px, 5vw, 40px) auto 0;
    padding: clamp(20px, 4vw, 36px);
    border: 1px solid #9273ac;
    border-radius: clamp(14px, 2.5vw, 20px);
    background-color: #f3ebdd;
}

.product-card-202610--product {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    grid-template-areas: "headline headline" "details visual";
    gap: 28px;
    align-items: start;
}

.product-card-202610--product > .product-card-202610__headline {
    grid-area: headline;
}

.product-card-202610__visual {
    grid-area: visual;
    display: block;
    width: 100%;
    height: auto;
    max-width: 300px;
    justify-self: center;
}

.product-card-202610__visual.product-card-202610__visual--single {
    width: 65%;
    max-width: 180px;
}

/* Exclude the supplied image's transparent top/bottom without scaling the product. */
.product-card-202610__visual--placentop {
    position: relative;
    aspect-ratio: 600 / 340;
    overflow: hidden;
}

.product-card-202610__visual--placentop > img {
    position: absolute;
    top: -38.235294%;
    display: block;
    width: 100%;
    height: auto;
}

.product-card-202610__visual--pair {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 0.6fr) minmax(0, 1fr);
    align-items: end;
    gap: 12px;
}

.product-card-202610__visual--equal-pair {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.product-card-202610__visual--pair > img:not(.product-card-202610__release) {
    display: block;
    width: 100%;
    height: auto;
}

.product-card-202610__headline-release {
    position: relative;
}

.product-card-202610__release {
    position: absolute;
    z-index: 1;
    top: calc(100% + 4px);
    right: -20px;
    width: clamp(72px, 13vw, 100px);
    height: auto;
}

.product-card-202610__details {
    grid-area: details;
    display: grid;
    gap: 24px;
    min-width: 0;
    color: #3b2c28;
    text-align: left;
}

.product-card-202610__description {
    margin: 0;
    font-size: var(--product-text-size);
    line-height: 1.9;
    line-break: strict;
    overflow-wrap: break-word;
    text-wrap: pretty;
}

.product-card-202610__ref {
    font-size: 0.62em;
    font-weight: 400;
    line-height: 0;
    vertical-align: super;
}

.product-card-202610__headline .product-card-202610__ref {
    font-size: 0.6em;
    font-weight: 600;
}

.product-card-202610__notes {
    margin: 6px 0 0;
    text-wrap: balance;
    font-size: clamp(8px, 2cqw, 11px);
    font-weight: 400;
    line-height: 1.4;
    text-align: left;
}

.product-card-202610__notes > span {
    display: block;
}

.product-card-202610__name {
    margin: 0;
    font-size: var(--product-text-size);
    font-weight: 500;
    line-height: 1.7;
    text-wrap: balance;
}

.product-card-202610__name-unit {
    display: inline-block;
}

.product-card-202610__details > .product-details-202610 {
    justify-self: center;
}

.product-details-202610:focus-visible {
    outline: 3px solid #433f7c;
    outline-offset: 4px;
}

.product-card-202610__headline {
    justify-self: stretch;
    margin: 0;
    color: #3b2c28;
    font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
    font-size: clamp(26px, 5vw, 44px);
    font-weight: 600;
    line-height: 1.5;
    text-align: center;
    overflow-wrap: anywhere;
    text-wrap: balance;
}

.product-card-202610__headline > span {
    display: inline;
}

.product-card-202610__headline > .product-card-202610__headline-release {
    display: inline-block;
}

.product-details-202610 {
    --details-purple: #795397;
    --details-orange: #df843c;
    position: relative;
    display: block;
    width: min(100%, 227px);
    height: 44px;
    margin-inline: auto;
    border-radius: 999px;
}

.product-details-202610::before {
    content: "";
    position: absolute;
    inset: 6px 0 0 5px;
    border-radius: inherit;
    background: repeating-linear-gradient(135deg, var(--details-orange) 0 3px, transparent 3px 7px);
}

.product-details-202610__surface {
    position: absolute;
    inset: 0 0 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding-inline: 32px;
    border: 1px solid var(--details-purple);
    border-radius: inherit;
    background: var(--details-purple);
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
}

.product-details-202610__icon {
    position: absolute;
    top: 50%;
    right: 6px;
    box-sizing: border-box;
    width: 24px;
    height: 24px;
    border: 1px solid var(--details-orange);
    border-radius: 50%;
    background: #fff;
    transform: translateY(-50%);
}

.product-details-202610__icon::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 52%;
    width: 10px;
    height: 12px;
    background: url("../img/202610/_parts/button-arrow.svg") center / contain no-repeat;
    transform: translate(-45%, -50%);
}

.app-promo-202610 {
    padding-bottom: 64px;
}

.app-promo-202610__banners {
    display: grid;
    gap: clamp(24px, 5vw, 40px);
    width: 85%;
    margin: clamp(24px, 5vw, 40px) auto 0;
}

.app-promo-202610__banners img {
    display: block;
    width: 100%;
    height: auto;
}

.app-promo-202610__banners a:focus-visible {
    outline: 3px solid #433f7c;
    outline-offset: 4px;
}

.app-promo-202610__flag {
    padding: 18% 10% 24%;
    color: #795397;
}

.app-promo-202610__title {
    width: 80%;
    margin: 0 auto;
}

.app-promo-202610__title-image {
    display: block;
    width: 100%;
    height: auto;
}

.app-promo-202610__note {
    margin: 16px 0 0;
    color: #49332d;
    font-size: clamp(10px, 4.5cqw, 12px);
    font-weight: 700;
    line-height: 1.6;
    text-align: center;
}

.section-headings-preview-202610 {
    container-type: inline-size;
    display: grid;
    gap: clamp(32px, 6vw, 48px);
    padding-bottom: 80px;
}

.section-title-202610 {
    position: relative;
    box-sizing: border-box;
    width: 90%;
    margin: 0 auto;
    padding: clamp(26px, 5vw, 40px) 12%;
    border: 1px solid #9273ac;
    border-radius: 12px;
    background: #f3ebdd;
    color: #795397;
    font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
    font-weight: 600;
    line-height: 1.5;
    text-align: center;
}

.section-title-202610__image {
    display: block;
    width: 60.35%;
    max-width: 312px;
    height: auto;
    margin-inline: auto;
}

.section-title-202610__image--wide {
    width: 100%;
    max-width: 517px;
}

.section-title-202610__star {
    position: absolute;
    color: #b65c2c;
    font-size: clamp(14px, 2.5vw, 20px);
    line-height: 1;
}

.section-title-202610__star--left {
    top: 24%;
    left: 6%;
    transform: rotate(-12deg);
}

.section-title-202610__star--right {
    right: 6%;
    bottom: 24%;
    transform: rotate(12deg);
}

.section-title-202610__decoration {
    --decoration-unit: min(0.123cqw, 0.96px);
    --decoration-text-width: min(60.35%, 312px);
    --decoration-character-width: calc(var(--decoration-text-width) / 6);
    --bat-leading-space: calc(7 * var(--decoration-unit));
    display: flex;
    align-items: center;
    gap: calc(10 * var(--decoration-unit));
    width: calc(var(--decoration-text-width) + 1.5 * var(--decoration-character-width) + var(--bat-leading-space));
    height: calc(48 * var(--decoration-unit));
    margin-top: 4px;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: calc((100% - var(--decoration-text-width)) / 2 - var(--decoration-character-width) - var(--bat-leading-space));
}

.pickup-preview-202610__decoration {
    --decoration-text-width: min(61.2%, 380px);
    --decoration-character-width: calc(var(--decoration-text-width) / 8);
    margin-top: 0;
}

.section-title-202610__bat {
    flex: 0 0 auto;
    width: calc(72 * var(--decoration-unit));
    height: 100%;
}

.section-title-202610__wave {
    flex: 1;
    min-width: 0;
    height: 100%;
    background: url("../img/202610/_parts/heading-wave-tile.svg") left center / calc(28 * var(--decoration-unit)) 100% repeat-x;
}

.section-title-202610__image--wide ~ .section-title-202610__decoration {
    --decoration-text-width: min(100%, 517px);
    --decoration-character-width: calc(var(--decoration-text-width) / 10);
}

.banner-section-202610 {
    box-sizing: border-box;
    width: 90%;
    margin-inline: auto;
    padding-bottom: clamp(26px, 5vw, 40px);
    border: 1px solid #9273ac;
    border-radius: 12px;
    background: #f3ebdd;
}

.banner-section-202610 > .section-title-202610 {
    width: 100%;
    padding-inline: 13.333%;
    border: 0;
    background: transparent;
}

.banner-section-202610__items {
    display: grid;
    gap: clamp(20px, 4vw, 30px);
    width: 88%;
    margin-inline: auto;
}

.banner-section-202610__items a,
.banner-section-202610__items img {
    display: block;
    width: 100%;
}

.banner-section-202610__items img {
    height: auto;
}

/* Reuse only the upper product area; the September offer is below it. */
.banner-section-202610__fino-visual {
    display: block;
    aspect-ratio: 1040 / 688;
    overflow: hidden;
}

.banner-section-202610__items a:focus-visible {
    outline: 3px solid #433f7c;
    outline-offset: 4px;
}

.elixir-club-202610 {
    display: grid;
    justify-items: center;
    padding-block: clamp(32px, 6vw, 64px);
    background: #fff;
}

.elixir-club-202610 a {
    display: block;
    width: 85%;
}

.elixir-club-202610 img {
    display: block;
    width: 100%;
    height: auto;
}

.elixir-club-202610 a:focus-visible {
    outline: 3px solid #433f7c;
    outline-offset: 4px;
}

@media (min-width: 641px) {
    .product-card-202610--center-visual > .product-card-202610__visual {
        align-self: center;
    }

    .product-card-202610--release > .product-card-202610__visual {
        margin-top: calc(clamp(72px, 13vw, 100px) - 12px);
    }
}

@media (max-width: 700px) {
    .pickup-preview-202610__intro p {
        font-size: clamp(14px, 3.4vw, 23px);
        line-height: 1.8;
    }
}

@media (max-width: 640px) {
    .campaign-preview-202610 {
        background-image: linear-gradient(90deg, #e9ac77 50%, #ab91bd 50%);
        background-size: calc(200% / 19) 100%;
        background-position: left top;
    }

    .product-card-202610 {
        --product-text-size: 16px;
        width: calc(100% - 28px);
    }

    .product-card-202610--product {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas: "headline" "visual" "details";
        gap: 24px;
    }

    .product-card-202610__headline--mobile-lines > span {
        display: block;
        white-space: nowrap;
    }

    .product-card-202610__headline--mobile-lines > .product-card-202610__headline-release {
        width: fit-content;
        margin-inline: auto;
    }

    .product-card-202610--release > .product-card-202610__headline {
        position: relative;
    }

    .product-card-202610--release .product-card-202610__headline-release {
        position: static;
    }

    .product-card-202610--release .product-card-202610__release {
        right: 0;
    }

    .product-card-202610--release > .product-card-202610__visual {
        margin-top: calc(clamp(72px, 13vw, 100px) - 8px);
    }

    .product-card-202610__visual {
        width: 75%;
        max-width: 240px;
    }

    .background-preview-202610__hero {
        padding-block: 30px;
    }

    .pickup-preview-202610 {
        padding-block: 28px;
    }

    .pickup-preview-202610__panel {
        border-radius: 12px;
    }
}

@media (max-width: 374px) {
    .pickup-preview-202610__intro p {
        font-size: 3.45vw;
    }
}