/* Japanese edition: localized type and dedicated pop packaging presentation. */
@font-face {
  font-family: "Moss Noto JP";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/assets/fonts/moss-noto-jp.woff2?v=jp-type-20261026") format("woff2");
}
:root {
  --jp: "Moss Noto JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  --display: "Archivo", var(--jp);
}
body { font-family: "Archivo", var(--jp); line-break: strict; overflow-wrap: anywhere; }
/* Reading copy has its own weight and scale; Black stays on poster lettering. */
.hero-small, .pouch-copy > p:not(.club-kicker), .moss-proof-card p,
.shop-summary, .club-gallery-intro > div p, .club-faq-intro,
.faq-cards p, .shop-note, .shop-facts, .club-footer,
.jp-privacy p, .jp-privacy dd { font-weight: 450; }
.pouch-copy > p:not(.club-kicker), .shop-summary,
.club-gallery-intro > div p, .club-faq-intro { font-size: 1rem; }
.faq-cards p, .shop-note { font-size: .9375rem; }
.faq-cards summary { font-weight: 700; }
.club-logo { overflow-wrap: normal; }
.club-logo b { font-family: "Archivo", sans-serif; }
.club-header nav a { font-size: .78rem; }
.club-header-cta { font-size: .88rem; }
.club-header-cta, .club-hero-cta { white-space: nowrap; }
.pouch-copy, .club-faq > header, .faq-cards { min-width: 0; }
.faq-cards { grid-template-columns: minmax(0, 1fr); }
.faq-cards details { min-width: 0; }
.club-hero h1, .pouch-copy h2, .moss-proof h2, .club-gallery h2,
.shop-heading h2, .club-faq h2, .club-closing h2 {
  font-family: var(--jp);
  font-stretch: normal;
  font-feature-settings: "palt";
  letter-spacing: -.055em;
  line-height: 1.15;
  word-break: keep-all;
  overflow-wrap: normal;
}
.club-hero h1 { font-size: clamp(4rem, 7.8vw, 8.8rem); margin: 1.5rem 0; }
.club-hero h1 span, .club-closing h2 span {
  display: inline-block;
  font-family: var(--jp);
  font-size: 1em;
  font-style: normal;
  font-weight: 900;
  letter-spacing: -.055em;
  transform: rotate(-4deg);
}
.hero-small { font-size: 1rem; line-height: 1.9; max-width: 29rem; }
.club-hero-copy > p:first-child, .club-kicker { font-size: .75rem; letter-spacing: .09em; line-height: 1.7; }
.hero-sticker span { line-height: 1.5; font-size: .8125rem; font-weight: 700; }
.hero-sticker strong { display: flex; align-items: baseline; gap: .12em; font-family: var(--jp); font-size: 1.5rem; font-weight: 900; line-height: 1.4; letter-spacing: -.04em; white-space: nowrap; }
.hero-sticker em { font-family: "Archivo", sans-serif; font-size: 1.35em; font-style: normal; letter-spacing: -.05em; }
.moss-ticker { font-size: .85rem; }
.moss-ticker span { letter-spacing: .08em; }
.pouch-copy h2 { font-size: clamp(2.5rem, 4.1vw, 4.7rem); }
.pouch-copy h2, .club-faq h2 { word-break: normal; overflow-wrap: anywhere; }
.pouch-copy > p:not(.club-kicker), .moss-proof-card p,
.shop-summary, .club-gallery-intro > div p, .club-faq-intro, .faq-cards p {
  line-height: 1.9;
}
.truth-stamps strong { white-space: normal; line-height: 1.55; font-size: clamp(.88rem, 1.15vw, 1.1rem); letter-spacing: 0; }
.pouch-stage-label { font-size: .8125rem; font-weight: 700; letter-spacing: .04em; }
.moss-proof-head h2 { font-size: clamp(3rem, 5.4vw, 6rem); }
.moss-proof-tag { font-family: var(--jp); font-style: normal; font-size: clamp(1.3rem, 2vw, 2rem); font-weight: 800; line-height: 1.7; letter-spacing: -.02em; max-width: none; }
.jp-flavour-phrase { display: block; overflow-wrap: normal; }
.jp-word { white-space: nowrap; }
.moss-proof-visual figcaption { grid-template-columns: auto 1fr; gap: 1rem; }
.moss-proof-visual figcaption strong { font-size: clamp(1rem, 1.8vw, 1.9rem); line-height: 1.45; letter-spacing: 0; }
.moss-proof-visual figcaption span, .moss-proof-card > span { font-size: .8125rem; font-weight: 700; }
.moss-proof-card h3 { font-size: clamp(1.2rem, 1.8vw, 1.8rem); line-height: 1.45; letter-spacing: -.02em; }
.moss-proof-card p { font-size: .9375rem; }
.moss-proof-card { container: jp-fact / inline-size; }
.moss-proof-card > strong { line-height: 1.15; white-space: nowrap; }
.moss-details-count span { font-size: .8125rem; line-height: 1.6; }
.shop-heading h2, .club-faq h2 { font-size: clamp(2.8rem, 5.4vw, 6rem); }
.shop-options h3 { line-height: 1.2; }
.shop-options article { container: jp-offer / inline-size; }
.shop-options article > p { font-size: .8125rem; font-weight: 700; letter-spacing: .02em; }
.shop-options article > span { font-size: .9375rem; font-weight: 600; line-height: 1.8; }
.shop-options .jp-unit-price { display: block; font-weight: 700; }
.shop-options .jp-selection-detail { display: block; margin-top: .4rem; font-size: .875rem; font-weight: 450; }
.shop-options article > strong { font-family: "Archivo", var(--jp); font-size: clamp(2.75rem, 5.2vw, 5.5rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.25; }
.shop-options article > small { font-weight: 600; line-height: 1.7; }
.shop-note { max-width: 52rem; line-height: 1.9; }
.option-burst { font-size: .78rem; }
.option-stepper > span { font-weight: 600; letter-spacing: .02em; line-height: 1.6; }
.pouch-pile-badge { font-size: .8125rem; letter-spacing: .04em; }
.shop-facts { line-height: 1.9; }
.club-gallery-intro h2 { font-size: clamp(2.8rem, 5.2vw, 5.6rem); }
.club-gallery-intro { grid-template-columns: .7fr 1.3fr 1fr; }
.club-gallery-card figcaption, .moss-proof-cut figcaption { gap: .5rem 1rem; line-height: 1.5; flex-wrap: wrap; }
.club-gallery-card figcaption span, .moss-proof-cut figcaption span { font-size: .8125rem; font-weight: 600; }
.club-gallery-card figcaption b, .moss-proof-cut figcaption b { font-size: .9375rem; white-space: nowrap; }
.faq-cards summary { grid-template-columns: minmax(0, 1fr) auto; gap: .75rem; line-height: 1.7; padding-right: 0; }
.club-closing { gap: 2rem; }
.club-closing h2 { font-size: clamp(3.5rem, 8.3vw, 9rem); }
.club-footer { font-size: .875rem; line-height: 1.9; gap: 1.5rem; }
.footer-links { display: flex; flex-direction: column; }
.interest-dialog::backdrop { backdrop-filter: blur(4px); background: rgb(23 71 220 / 82%); }
.interest-panel { background: var(--cream); border: 3px solid var(--ink); border-radius: 0; box-shadow: 9px 9px 0 var(--ink); }
.interest-close { background: var(--yellow); border: 2px solid var(--ink); box-shadow: 3px 3px 0 var(--ink); }
.interest-kicker { color: var(--blue); font-weight: 900; letter-spacing: .04em; }
.interest-title, .interest-success h2 { font-family: var(--jp); font-weight: 900; font-size: clamp(1.65rem, 6vw, 2.5rem); letter-spacing: -.04em; line-height: 1.4; }
.interest-copy, .interest-fineprint, .interest-consent, .interest-success p { line-height: 1.85; }
.interest-copy, .interest-fineprint, .interest-success p { font-weight: 450; }
.interest-consent span { font-size: .875rem; font-weight: 500; }
.interest-selection { background: var(--yellow); border: 2px solid var(--ink); border-radius: 0; gap: .75rem; flex-wrap: wrap; }
.interest-selection span { line-height: 1.6; }
.interest-selection b { white-space: nowrap; }
.interest-field input { border: 2px solid var(--ink); border-radius: 0; }
.interest-field input:focus { border-color: var(--ink); box-shadow: 4px 4px 0 var(--blue); }
.interest-field input[aria-invalid="true"] { border-color: #a52622; }
.interest-submit { background: var(--coral); border: 3px solid var(--ink); border-radius: 0; box-shadow: 4px 4px 0 var(--ink); color: var(--ink); }
.interest-quantity { border: 2px solid var(--ink); border-radius: 0; flex-wrap: wrap; }
.interest-stepper button { background: var(--yellow); border: 2px solid var(--ink); border-radius: 0; box-shadow: 3px 3px 0 var(--ink); color: var(--ink); min-height: 44px; min-width: 44px; }
.interest-stepper button:disabled { box-shadow: none; }
.interest-success-mark { background: var(--yellow); color: var(--ink); }
.interest-region { display: flex; gap: 1rem; margin: 0; font-size: .85rem; }
.interest-region small { margin-left: auto; font-size: .8rem; }
.interest-region { flex-wrap: wrap; row-gap: .25rem; }
.interest-status { line-height: 1.7; }
.jp-privacy main { max-width: 56rem; margin: auto; padding: 5rem 1.5rem; }
.jp-privacy header, .jp-privacy footer { display: flex; gap: 1rem; justify-content: space-between; padding: 1.5rem; border-bottom: 3px solid var(--ink); }
.jp-privacy h1 { font-size: clamp(2rem, 5.5vw, 4rem); font-weight: 900; line-height: 1.4; letter-spacing: -.04em; }
.jp-privacy h2 { font-size: 1.3rem; }
.jp-privacy p, .jp-privacy dd { line-height: 1.9; }
.jp-privacy section { padding: 2rem 0; border-top: 2px solid var(--ink); }
.jp-privacy aside { background: var(--yellow); padding: 1.5rem; margin: 2rem 0; border: 2px solid var(--ink); }
.jp-privacy dt { font-weight: 800; margin-top: 1rem; }
.jp-privacy dd { margin: .5rem 0 1rem; }
@media (max-width: 1100px) and (min-width: 901px) {
  .club-header { grid-template-columns: 1fr auto; }
  .club-header nav { display: none; }
  .club-footer { grid-template-columns: 1fr 1fr 1fr; }
}
@media (max-width: 900px) {
  .club-gallery-intro { grid-template-columns: 1fr 2fr; }
  .club-gallery-intro > div { grid-column: 2; }
  .pouch-copy h2 { font-size: clamp(2.8rem, 7vw, 4.8rem); }
}
@media (max-width: 1100px) {
  .club-header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .75rem; padding-block: .75rem; }
}
@media (max-width: 640px) {
  .club-header-cta { font-size: .75rem; }
  .club-hero h1 { font-size: clamp(3.8rem, 17vw, 6rem); margin: .75rem 0 1.25rem; }
  .club-hero-copy { padding: 1.25rem 1rem 2rem; }
  .hero-small { font-size: .92rem; }
  .pouch-copy h2, .shop-heading h2, .club-faq h2,
  .moss-proof-head h2, .club-gallery-intro h2 { font-size: clamp(2.3rem, 10.5vw, 3.8rem); }
  .moss-proof-tag { font-size: 1.2rem; }
  .moss-proof-visual figcaption { grid-template-columns: 1fr; gap: .5rem; }
  .moss-proof-visual figcaption strong { font-size: 1.2rem; }
  .moss-proof-card > strong { font-size: 3rem; }
  .moss-proof-card h3 { font-size: 1.4rem; }
  .shop-options h3 { font-size: 2.5rem; }
  .shop-options article > small { font-size: .94rem; }
  .shop-options article > span { font-size: .9375rem; }
  .option-stepper { flex-wrap: wrap; }
  .option-stepper > span { flex-basis: 100%; }
  .shop-facts { grid-template-columns: 1fr; }
  .club-gallery-intro { grid-template-columns: 1fr; }
  .club-gallery-intro > div { grid-column: auto; }
  .club-closing h2 { font-size: clamp(3rem, 13vw, 5rem); }
  .club-footer { font-size: .85rem; }
  .interest-dialog { padding: .5rem; }
  .interest-panel { position: relative; bottom: auto; width: 100%; max-height: calc(100dvh - 1rem); padding: 1.25rem; }
  .interest-title { padding-right: 1.5rem; }
  .jp-privacy header, .jp-privacy footer { flex-direction: column; }
}

/* Visual edition 2: Japanese poster typography at three deliberate moments. */
@font-face {
  font-family: "Moss Mincho JP";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url("/assets/fonts/moss-mincho-jp.woff2") format("woff2");
}
:root { --jp-mincho: "Moss Mincho JP", "Yu Mincho", "Hiragino Mincho ProN", serif; }
.jp-logo-reading { font-family: var(--jp); font-size: .625rem; font-weight: 700; line-height: 1; letter-spacing: .08em; margin-top: .65rem; }
.club-hero { background: var(--blue); container: jp-hero / inline-size; }
.club-hero > img { object-position: right center; }
.club-hero-copy { width: 46%; padding: 2.5rem 4vw; }
.club-hero-copy > p:first-child { margin-top: 0; }
.club-hero h1 {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-feature-settings: "vert", "vrt2";
  font-size: clamp(4.5rem, 8vw, 7.7rem);
  letter-spacing: .015em;
  line-height: 1.12;
  margin: 1.25rem 0 1.8rem;
  overflow: visible;
}
.club-hero h1 .jp-hero-line {
  color: var(--cream);
  display: block;
  font-family: var(--jp);
  font-size: 1em;
  font-weight: 900;
  font-style: normal;
  letter-spacing: inherit;
  transform: none;
  white-space: nowrap;
}
.club-hero h1 .jp-hero-line--accent { color: var(--yellow); }
.hero-small { max-width: 24rem; font-size: 1rem; }
.club-hero-cta { min-width: 17rem; margin-top: 1.1rem; }
.hero-sticker { height: 7.5rem; width: 7.5rem; right: 3%; bottom: 4%; }
.jp-pack-rail {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-family: var(--jp-mincho);
  font-feature-settings: "vert", "vrt2";
  font-size: clamp(1rem, 1.7vw, 1.6rem);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: .12em;
  white-space: nowrap;
  padding: 1.1rem .85rem;
  left: 1.5rem;
  top: 2.5rem;
  transform: rotate(-2deg);
}
.club-pack-stage { min-width: 0; width: 100%; background: #ff5796; }
.club-pack-stage .club-sun { background: #ff981d; }
.club-pack-product { width: min(80%, 38rem); }
/* The new pouch has genuine alpha; use its own silhouette without clipping. */
.club-gallery-intro { grid-template-columns: minmax(0, 1.8fr) minmax(14rem, 1fr); gap: 2rem 4vw; align-items: end; }
.club-gallery-intro > .club-kicker { grid-column: 1 / -1; margin: 0; }
.club-gallery-intro h2 { word-break: normal; overflow-wrap: anywhere; font-family: var(--jp-mincho); font-size: clamp(3.4rem, 5.8vw, 6.5rem); font-weight: 900; line-height: 1.35; letter-spacing: -.05em; }
.club-gallery-intro > div { grid-column: 2; }
.club-gallery-card--pouch img { object-position: 50% center; }
.club-closing { container: jp-closing / inline-size; align-items: stretch; padding: 3rem 7vw 4rem; gap: 2.5rem; }
.club-closing > p { text-align: left; }
.club-closing .jp-closing-title {
  align-self: center;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto;
  column-gap: 3vw;
  margin: 0;
  text-align: left;
}
.club-closing .jp-closing-title span { display: block; color: var(--ink); font-family: var(--jp); font-style: normal; font-weight: 900; letter-spacing: -.04em; transform: none; }
.club-closing .jp-closing-title .jp-closing-rail {
  grid-column: 2; grid-row: 1 / 3;
  align-self: center;
  writing-mode: vertical-rl;
  font-feature-settings: "vert", "vrt2";
  font-size: clamp(1.4rem, 2.5vw, 2.6rem);
  letter-spacing: .1em; line-height: 1.2;
  border-left: 3px solid var(--ink);
  padding-left: 1.5rem;
}
.club-closing .jp-closing-title .jp-closing-invitation { grid-column: 1; grid-row: 1; font-size: clamp(2.2rem, 4vw, 4rem); }
.club-closing .jp-closing-title .jp-closing-go { grid-column: 1; grid-row: 2; font-size: clamp(5rem, 12.8vw, 13rem); white-space: nowrap; line-height: 1.3; }
.club-closing-cta { align-self: flex-end; margin-right: 7vw; }
@media (max-width: 900px) {
  .club-hero, .club-hero-copy { min-height: 44rem; }
  .club-hero-copy { width: 46%; }
  .club-hero::after { display: none; }
  .hero-sticker { height: 6.5rem; width: 6.5rem; }
  .hero-sticker strong { font-size: 1.25rem; }
  .club-pack-stage { min-height: 31rem; aspect-ratio: 4 / 3; }
  .club-pack-product { width: min(60%, 31rem); max-height: 90%; }
  .jp-pack-rail { font-size: 1.35rem; left: 1.5rem; top: 1.5rem; }
  .club-gallery-intro { grid-template-columns: 1fr; }
  .club-gallery-intro h2 { font-size: clamp(3rem, 6.5vw, 4.8rem); }
  .club-gallery-intro > div { grid-column: 1; max-width: 36rem; }
}
@media (max-width: 760px) {
  .club-hero { display: flex; flex-direction: column; min-height: 0; }
  .club-hero > img { position: static; inset: auto; width: 100%; max-width: none; height: clamp(21rem, 70vw, 33rem); margin: 0; object-fit: cover; object-position: right center; aspect-ratio: auto; }
  .club-hero-copy { min-height: 0; display: flex; flex-direction: column; align-items: stretch; gap: 1.25rem; width: 100%; padding: 1.5rem 1rem 2rem; }
  .club-hero-copy > p:first-child { margin: 0; font-size: .8125rem; text-align: center; }
  .club-hero h1 { align-self: center; font-size: clamp(2.8rem, 13.8vw, 4rem); margin: 0; line-height: 1.12; }
  .hero-small { align-self: center; max-width: 32rem; font-size: 1rem; line-height: 1.9; margin: 0; }
  .club-hero-cta { align-self: center; font-size: .9375rem; min-width: 0; width: 100%; max-width: 32rem; margin: 0; padding: 1rem; }
  .hero-sticker { top: 1rem; right: 1rem; bottom: auto; height: 6.5rem; width: 6.5rem; }
  .club-pack-stage { min-height: 29rem; aspect-ratio: auto; padding: 1.5rem 1rem 2.5rem 3rem; }
  .club-pack-product { width: min(83%, 20rem); height: auto; max-height: 25rem; }
  .jp-pack-rail { font-size: 1.1rem; letter-spacing: .12em; left: .8rem; top: 1.3rem; padding: .9rem .65rem; }
  .club-gallery-intro { gap: 1.4rem; padding: 3rem 1rem; }
  .club-gallery-intro h2 { font-size: clamp(2.2rem, 9.7vw, 3.6rem); line-height: 1.5; letter-spacing: -.05em; }
  .club-closing { padding: 2.5rem 1rem; min-height: 24rem; gap: 2rem; }
  .club-closing .jp-closing-title { column-gap: .5rem; }
  .club-closing .jp-closing-title .jp-closing-rail { font-size: 1.1rem; padding-left: .6rem; }
  .club-closing .jp-closing-title .jp-closing-invitation { font-size: 2rem; }
  .club-closing .jp-closing-title .jp-closing-go { font-size: clamp(3.4rem, 16.5vw, 6.5rem); }
  .club-closing-cta { margin-right: .25rem; }
}

/* Text-size changes reduce usable character width even at the same viewport. */
@media (max-width: 760px) {
  @container jp-hero (max-width: 24em) {
    .club-hero-copy > p:first-child { letter-spacing: .02em; }
    .hero-small { max-width: 100%; }
  }
}
@container jp-closing (max-width: 14em) {
  .club-closing .jp-closing-title { grid-template-columns: minmax(0, 1fr); width: 100%; }
  .club-closing .jp-closing-title .jp-closing-rail {
    grid-column: 1; grid-row: 1; writing-mode: horizontal-tb; font-feature-settings: normal;
    border: 0; padding: 0 0 1rem; font-size: 1rem;
  }
  .club-closing .jp-closing-title .jp-closing-invitation { grid-row: 2; font-size: 1.5rem; }
  .club-closing .jp-closing-title .jp-closing-go { grid-row: 3; font-size: 22cqi; }
  .club-closing-cta { align-self: stretch; margin-right: 0; text-align: center; }
}

/* Keep the emotional portrait clear of live copy and the mobile fact badge. */
@media (min-width: 761px) {
  .club-hero .hero-small { max-width: min(20rem, 28vw); }
  .club-hero .club-hero-cta { min-width: 0; width: min(17rem, 28vw); }
}
@media (max-width: 760px) {
  .hero-sticker { left: 1rem; right: auto; }
}

/* Dense pop artwork stays in its own panel when a tablet crop consumes the
   original negative space. Typography remains on uninterrupted cobalt. */
@media (min-width: 761px) and (max-width: 1200px) {
  .club-hero > img { left: 40%; right: 0; width: 60%; }
  .club-hero-copy { width: 40%; padding-left: 3vw; padding-right: 3vw; }
  .club-hero .hero-small,
  .club-hero-copy > p:first-child { max-width: 100%; }
  .club-hero .club-hero-cta { width: 100%; }
}

/* A larger text setting needs the same reading space as a narrow screen. */
@container jp-hero (max-width: 40em) {
  .club-hero > img { position: static; inset: auto; display: block; width: 100%; height: clamp(21rem, 70cqi, 33rem); margin: 0; object-fit: cover; object-position: right center; }
  .club-hero-copy { display: flex; flex-direction: column; align-items: stretch; width: 100%; min-height: 0; padding: 1.5rem 1rem 2rem; gap: 1.25rem; }
  .club-hero-copy > p:first-child { max-width: 100%; margin: 0; font-size: .8125rem; text-align: center; }
  .club-hero h1 { align-self: center; font-size: clamp(2.8rem, 13.8cqi, 4rem); margin: 0; }
  .club-hero .hero-small { align-self: center; max-width: 32rem; margin: 0; }
  .club-hero .club-hero-cta { align-self: center; width: 100%; max-width: 32rem; min-width: 0; margin: 0; font-size: .9375rem; }
  .hero-sticker { top: 1rem; left: 1rem; right: auto; bottom: auto; }
}
@container jp-offer (max-width: 20em) {
  .shop-options article > strong { font-size: min(5.5rem, 18cqi); white-space: nowrap; }
}
@container jp-offer (max-width: 14em) {
  .shop-options article > p:first-of-type { max-width: 100%; margin-top: 5.5rem; }
}
@container jp-fact (max-width: 20em) {
  .moss-proof-card > strong { font-size: min(3rem, 17cqi); }
}