/*
Theme Name: 記念日Tシャツ屋さん
Author: Print Robin / Robin Factory
Description: 「記念日Tシャツ屋さん by Print Robin」のための、軽量なWooCommerce対応ブロックテーマです。
Version: 0.6.5
Requires at least: 6.9
Requires PHP: 8.3
Text Domain: robin-celebration-store
*/

/* =========================================================
   Design language: 「祝い札（いわいふだ）」
   - 地色は paper と ink の2色のみ。sun は帯とラベル、red は行動、leaf は補助。
   - 角丸は札＝0 / カード＝16px。影はぼかしを使わず ink のオフセットのみ。
   - 見出しは明朝（祝い）、本文とUIはゴシック（読みやすさ）。
   ========================================================= */

:root {
  --rpc-ink: var(--wp--preset--color--ink);
  --rpc-paper: var(--wp--preset--color--paper);
  --rpc-red: var(--wp--preset--color--celebration-red);
  --rpc-leaf: var(--wp--preset--color--leaf);
  --rpc-sun: var(--wp--preset--color--sun);
  --rpc-line: 2px solid var(--wp--preset--color--ink);
  --rpc-hairline: 1px solid rgb(23 33 28 / 14%);
  --rpc-pop: 4px 4px 0 var(--wp--preset--color--ink);
  --rpc-pop-sm: 3px 3px 0 var(--wp--preset--color--ink);
  --rpc-radius-large: 18px;
  --rpc-radius-medium: 14px;
  --rpc-content-padding: clamp(16px, 4vw, 48px);
  --rpc-display: var(--wp--preset--font-family--japanese-serif);
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: var(--rpc-paper);
}

.wp-site-blocks {
  overflow: clip;
}

#products,
#occasions,
#how-it-works,
#faq {
  scroll-margin-top: 5rem;
}

a {
  text-underline-offset: 0.18em;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline: 3px solid var(--rpc-red);
  outline-offset: 3px;
}

.rpc-hero a:focus-visible,
.rpc-hero button:focus-visible,
.rpc-maker-section a:focus-visible,
.rpc-maker-section button:focus-visible,
.rpc-footer-inner a:focus-visible,
.rpc-footer-inner button:focus-visible {
  outline-color: var(--rpc-sun);
}

.rpc-skip-link {
  position: fixed;
  z-index: 100000;
  top: 8px;
  left: 8px;
  padding: 0.65rem 1rem;
  border-radius: 8px;
  background: var(--rpc-ink);
  color: #fff;
  font-weight: 800;
  transform: translateY(-150%);
}

.rpc-skip-link:focus {
  transform: translateY(0);
}

/* ---------- header ---------- */

.wp-site-blocks > header {
  position: sticky;
  z-index: 20;
  top: 0;
  border-bottom: var(--rpc-line);
  background: var(--rpc-paper);
}

.admin-bar .wp-site-blocks > header {
  top: var(--wp-admin--admin-bar--height, 32px);
}

.rpc-header-inner,
.rpc-footer-inner {
  padding-inline: var(--rpc-content-padding);
}

.rpc-header-inner {
  padding-block: 10px;
}

.rpc-header-inner > .wp-block-group {
  width: 100%;
  max-width: var(--wp--style--global--wide-size);
  gap: clamp(0.55rem, 2vw, 1.4rem);
}

.rpc-brand-lockup {
  gap: 0.05rem;
  min-width: 0;
  flex-shrink: 0;
}

.rpc-brand-lockup .wp-block-site-title {
  margin: 0;
  overflow: hidden;
  font-family: var(--rpc-display);
  font-size: clamp(1.05rem, 2.2vw, 1.4rem);
  white-space: nowrap;
  font-weight: 900;
  letter-spacing: 0.01em;
  line-height: 1.25;
}

.rpc-brand-lockup .wp-block-site-title a {
  color: var(--rpc-ink);
  text-decoration: none;
}

.rpc-brand-byline {
  margin: 0;
  color: var(--rpc-leaf);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.06em;
}

.rpc-brand-prefix {
  display: block;
  color: var(--rpc-red);
  font-family: var(--wp--preset--font-family--japanese-sans);
  font-size: 0.68em;
  line-height: 1.4;
}

.rpc-brand-name {
  display: block;
}

.rpc-header-actions {
  gap: clamp(0.35rem, 1.5vw, 1rem);
}

.rpc-primary-nav .wp-block-navigation-item__content {
  color: var(--rpc-ink);
  text-decoration-thickness: 2px;
}

.rpc-primary-nav .wp-block-navigation__responsive-container-open,
.rpc-primary-nav .wp-block-navigation__responsive-container-close {
  min-width: 44px;
  min-height: 44px;
  justify-content: center;
}

.rpc-primary-nav .wp-block-navigation__responsive-container.is-menu-open {
  padding: 1.25rem var(--rpc-content-padding) 2rem;
}

.rpc-primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
  gap: 0;
  align-items: stretch;
}

.rpc-primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
  border-bottom: var(--rpc-hairline);
}

.rpc-primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
  display: block;
  padding-block: 0.9rem;
  font-size: 1rem;
}

.rpc-header-cta {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 0.55rem 1.1rem;
  border: var(--rpc-line);
  border-radius: 999px;
  background: var(--rpc-red);
  box-shadow: var(--rpc-pop-sm);
  color: #fff;
  font-size: 0.84rem;
  font-weight: 900;
  text-decoration: none;
  white-space: nowrap;
  transition: transform 140ms ease, box-shadow 140ms ease;
}

/* ---------- hero ---------- */

.rpc-front-main {
  padding: 0 0 clamp(24px, 5vw, 48px);
}

.rpc-front-main > .rpc-hero {
  max-width: none;
  margin-bottom: 0;
}

.rpc-hero {
  gap: clamp(24px, 4vw, 56px);
  padding: clamp(30px, 5vw, 68px) var(--rpc-content-padding) clamp(34px, 5vw, 72px);
  background: var(--rpc-ink) !important;
  color: var(--rpc-paper);
}

.rpc-hero-copy {
  padding: 0;
}

.rpc-hero .rpc-eyebrow {
  display: inline-block;
  margin: 0 0 1rem;
  padding: 0.4rem 0.9rem;
  background: var(--rpc-sun);
  color: var(--rpc-ink);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.rpc-eyebrow {
  margin: 0 0 0.7rem;
  color: var(--rpc-red);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.1em;
}

.rpc-hero h1 {
  max-width: 100%;
  margin: 0;
  color: var(--rpc-paper);
  font-family: var(--rpc-display);
  font-size: clamp(1.55rem, 3.3vw, 2.65rem);
  font-weight: 900;
  line-height: 1.3;
  letter-spacing: 0.005em;
  text-wrap: balance;
  word-break: auto-phrase;
}

.rpc-hero-title-keep {
  display: block;
  color: var(--rpc-sun);
  white-space: nowrap;
}

.rpc-hero-lead {
  max-width: 34rem;
  margin-top: 1.1rem;
  color: rgb(255 250 240 / 82%);
  font-size: clamp(0.95rem, 2vw, 1.08rem);
  line-height: 2;
  text-wrap: pretty;
}

.rpc-hero-note {
  margin: 1rem 0 0;
  color: rgb(255 250 240 / 66%);
  font-size: 0.78rem;
  font-weight: 700;
}

.rpc-hero .wp-block-buttons {
  gap: 0.7rem;
  margin-top: 1.5rem;
}

.rpc-hero .wp-block-button__link,
.rpc-customizer-cta .wp-block-button__link {
  min-height: 52px;
  padding: 0.85rem 1.5rem;
  border: var(--rpc-line);
  box-shadow: var(--rpc-pop-sm);
  font-weight: 900;
}

.rpc-hero .is-style-outline .wp-block-button__link {
  border-color: rgb(255 250 240 / 55%);
  box-shadow: none;
  color: var(--rpc-paper);
}

/* before → after の説明図（商品画像は本番でWooの画像へ差し替え可能） */

.rpc-hero-visual {
  display: flex;
  min-height: 0;
  align-items: center;
  background: none;
}

.rpc-hero-product {
  width: min(100%, 31rem);
  margin: 0 auto;
  padding: clamp(10px, 2vw, 16px);
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-large);
  background: var(--rpc-paper);
  box-shadow: var(--rpc-pop);
}

.rpc-hero-product-link,
.rpc-hero-product-media {
  display: block;
}

.rpc-hero-product-media {
  overflow: hidden;
  border: 2px solid var(--rpc-ink);
  border-radius: 12px;
  background: #fff;
}

.rpc-hero-product-image {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  object-fit: cover;
}

.rpc-hero-product figcaption {
  display: grid;
  gap: 0.25rem;
  padding: 0.75rem 0.2rem 0.1rem;
  color: var(--rpc-ink);
}

.rpc-hero-product figcaption span {
  color: var(--rpc-red);
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.rpc-hero-product figcaption strong {
  font-family: var(--rpc-display);
  font-size: clamp(1rem, 2.3vw, 1.25rem);
  line-height: 1.45;
}

.rpc-hero-product figcaption small {
  color: rgb(23 33 28 / 68%);
  font-size: 0.68rem;
  line-height: 1.6;
}

/* 縦積み時に高さが0にならないようにする */
@media (max-width: 781px) {
  .rpc-hero > .wp-block-column {
    flex: 0 0 auto;
    flex-basis: auto !important;
  }
}

.rpc-mock {
  display: grid;
  width: 100%;
  align-items: center;
  gap: 0.5rem;
  grid-template-columns: 1fr auto 1fr;
}

.rpc-mock-panel {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  padding: 0.7rem;
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-medium);
  background: var(--rpc-paper);
  box-shadow: var(--rpc-pop);
}

.rpc-mock-label {
  color: rgb(23 33 28 / 62%);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.12em;
}

.rpc-mock-panel--after .rpc-mock-label {
  color: var(--rpc-red);
}

.rpc-mock-frame {
  display: grid;
  align-content: center;
  justify-items: center;
  padding: 0.9rem 0.6rem;
  aspect-ratio: 4 / 5;
  border-radius: 10px;
  background: #f3ecdd;
  color: rgb(23 33 28 / 55%);
  font-size: 0.66rem;
  font-weight: 800;
  line-height: 1.7;
  text-align: center;
}

.rpc-mock-frame--base {
  border: 2px dashed rgb(23 33 28 / 28%);
}

.rpc-mock-face {
  display: grid;
  width: 54%;
  aspect-ratio: 1;
  place-items: center;
  border: 3px solid var(--rpc-ink);
  border-radius: 50%;
  background: var(--rpc-sun);
  color: var(--rpc-ink);
  font-size: 0.62rem;
  font-weight: 900;
  line-height: 1.5;
}

.rpc-mock-caption {
  width: 100%;
  margin-top: 0.7rem;
  padding: 0.4rem 0.3rem;
  border-radius: 6px;
  background: var(--rpc-ink);
  color: var(--rpc-paper);
  font-size: 0.68rem;
  font-weight: 900;
}

.rpc-mock-arrow {
  display: grid;
  gap: 0.2rem;
  justify-items: center;
  color: var(--rpc-sun);
  font-size: 1.1rem;
  font-weight: 900;
}

.rpc-mock-arrow small {
  font-size: 0.6rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  writing-mode: vertical-rl;
}

/* ---------- trust strip ---------- */

.rpc-trust-strip {
  border-bottom: var(--rpc-line);
  background: var(--rpc-sun);
}

.rpc-trust-items {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}

.rpc-trust-items li {
  position: relative;
  padding: 0.7rem 0.35rem;
  font-size: 0.7rem;
  font-weight: 800;
  line-height: 1.5;
  text-align: center;
}

.rpc-trust-items li + li {
  border-left: var(--rpc-hairline);
}

.rpc-trust-items strong,
.rpc-trust-items span {
  display: block;
}

/* ---------- product mode navigation ---------- */

.rpc-product-mode-nav {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(12px, 2vw, 20px);
  padding: clamp(20px, 4vw, 36px) var(--rpc-content-padding) 0;
}

.rpc-product-mode-nav a {
  display: grid;
  gap: 0.3rem;
  padding: clamp(16px, 3vw, 24px);
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-medium);
  background: #fff;
  box-shadow: var(--rpc-pop-sm);
  color: var(--rpc-ink);
  text-decoration: none;
}

.rpc-product-mode-nav a:first-child {
  background: var(--rpc-sun);
}

.rpc-product-mode-nav strong {
  font-family: var(--rpc-display);
  font-size: clamp(1.08rem, 3vw, 1.35rem);
}

.rpc-product-mode-nav span {
  color: rgb(23 33 28 / 74%);
  font-size: 0.82rem;
  line-height: 1.65;
}

@media (max-width: 600px) {
  .rpc-product-mode-nav {
    grid-template-columns: 1fr;
  }
}

.rpc-trust-items strong {
  color: var(--rpc-ink);
}

.rpc-trust-items span {
  color: rgb(23 33 28 / 74%);
  font-size: 0.9em;
  font-weight: 700;
}

/* ---------- sections ---------- */

.rpc-section {
  padding-block: clamp(44px, 7vw, 92px);
  padding-inline: var(--rpc-content-padding);
}

.rpc-products-section {
  padding-top: clamp(36px, 6vw, 72px);
}

.rpc-section-title {
  max-width: 22ch;
  margin: 0 auto;
  font-family: var(--rpc-display);
  font-size: clamp(1.65rem, 5vw, 2.9rem);
  font-weight: 900;
  line-height: 1.35;
  letter-spacing: 0.005em;
  text-align: center;
  text-wrap: balance;
  word-break: auto-phrase;
}

.rpc-section-lead {
  max-width: 40rem;
  margin: 0.9rem auto 0;
  color: rgb(23 33 28 / 78%);
  text-align: center;
  text-wrap: pretty;
}

.rpc-section > .rpc-eyebrow {
  display: block;
  text-align: center;
}

.has-sun-background-color .rpc-eyebrow {
  color: var(--rpc-ink);
}

/* 売場・一覧は contentSize(760px) より広く使う */

.rpc-front-main .rpc-section > * {
  max-width: min(100%, 68rem);
  margin-inline: auto;
}

.rpc-front-main .rpc-section > .rpc-products-empty {
  max-width: 46rem;
}

/* ---------- products ---------- */

.rpc-product-grid .products,
.rpc-product-grid .wc-block-grid__products,
.rpc-product-grid .wc-block-product-template {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(14px, 2.5vw, 24px);
  margin-top: 1.9rem;
  padding: 0;
  list-style: none;
}

.rpc-product-grid .product,
.rpc-product-grid .wc-block-grid__product,
.rpc-product-grid .wc-block-product {
  display: flex;
  width: auto !important;
  flex-direction: column;
  margin: 0 !important;
  padding: 10px 10px 18px !important;
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-medium);
  background: #fff;
  box-shadow: var(--rpc-pop);
  transition: transform 140ms ease, box-shadow 140ms ease;
}

.rpc-product-grid .products::before,
.rpc-product-grid .products::after {
  display: none !important;
}

.rpc-product-grid .product a,
.rpc-product-grid .wc-block-grid__product a {
  text-decoration: none;
}

.rpc-product-grid .product img,
.rpc-product-grid .wc-block-grid__product-image img,
.rpc-product-grid .wc-block-components-product-image img {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 8px;
  background: #f3ecdd;
  object-fit: cover;
}

.rpc-product-grid .woocommerce-loop-product__title,
.rpc-product-grid .wc-block-grid__product-title,
.rpc-product-grid .wp-block-post-title {
  padding-inline: 0.3rem;
  color: var(--rpc-ink);
  font-size: 1rem !important;
  font-weight: 800;
  line-height: 1.6;
}

.rpc-product-grid .price,
.rpc-product-grid .wc-block-grid__product-price,
.rpc-product-grid .wc-block-components-product-price {
  padding-inline: 0.3rem;
  color: var(--rpc-ink) !important;
  font-weight: 900 !important;
}

.rpc-product-grid .button,
.rpc-product-grid .wp-block-button__link {
  margin: auto 0.3rem 0;
  border: var(--rpc-line);
  background: var(--rpc-ink);
  color: var(--rpc-paper);
  text-align: center;
}

.rpc-products-empty {
  max-width: 46rem;
  margin: 1.9rem auto 0;
  padding: clamp(22px, 4vw, 36px);
  border: 2px dashed rgb(23 33 28 / 30%);
  border-radius: var(--rpc-radius-medium);
  background: #fff;
  text-align: center;
}

.rpc-products-empty h3 {
  margin-top: 0;
  font-family: var(--rpc-display);
  font-size: clamp(1.2rem, 4vw, 1.6rem);
}

.rpc-products-empty p {
  max-width: 37rem;
  margin-inline: auto;
}

.rpc-products-ready .rpc-products-empty {
  display: none;
}

.rpc-products-pending #products .woocommerce-info {
  display: none;
}

.rpc-empty-note {
  max-width: 42rem;
  margin: 1.2rem auto 0;
  padding: 0.85rem 1rem;
  border-radius: 10px;
  background: rgb(243 191 74 / 30%);
  font-size: 0.82rem;
  text-align: center;
}

/* ---------- occasions ---------- */

.rpc-occasions-section {
  border-block: var(--rpc-line);
}

.rpc-occasion-featured {
  display: grid;
  max-width: 62rem;
  margin: 2rem auto 0.9rem;
  gap: 1rem;
  padding: clamp(20px, 4vw, 34px);
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-large);
  background: var(--rpc-ink);
  box-shadow: var(--rpc-pop);
  color: var(--rpc-paper);
  text-decoration: none;
}

.rpc-occasion-featured small {
  display: inline-block;
  justify-self: start;
  padding: 0.3rem 0.7rem;
  background: var(--rpc-sun);
  color: var(--rpc-ink);
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.06em;
}

.rpc-occasion-featured b {
  display: block;
  font-family: var(--rpc-display);
  font-size: clamp(2rem, 7vw, 3rem);
  font-weight: 900;
  line-height: 1.2;
}

.rpc-occasion-featured b span {
  margin-left: 0.6rem;
  color: var(--rpc-sun);
  font-size: 0.42em;
}

.rpc-occasion-featured p {
  max-width: 30rem;
  margin: 0;
  color: rgb(255 250 240 / 80%);
  font-size: 0.9rem;
  line-height: 1.9;
}

.rpc-occasion-featured em {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-self: start;
  padding: 0.7rem 1.4rem;
  border: var(--rpc-line);
  border-radius: 999px;
  background: var(--rpc-red);
  color: #fff;
  font-size: 0.95rem;
  font-style: normal;
  font-weight: 900;
}

.rpc-occasion-list {
  display: grid;
  max-width: 62rem;
  margin-inline: auto;
  gap: 0.7rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.rpc-occasion-card {
  display: flex;
  min-height: 64px;
  align-items: center;
  gap: 0.8rem;
  padding: 0.7rem 0.9rem;
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-medium);
  background: var(--rpc-paper);
  box-shadow: var(--rpc-pop-sm);
  color: var(--rpc-ink);
  font-size: clamp(0.95rem, 3.2vw, 1.1rem);
  font-weight: 900;
  line-height: 1.35;
  text-decoration: none;
  transition: transform 140ms ease, box-shadow 140ms ease;
}

.rpc-occasion-age {
  display: grid;
  width: 40px;
  height: 40px;
  flex: none;
  place-items: center;
  border: 2px solid var(--rpc-ink);
  border-radius: 50%;
  background: var(--rpc-sun);
  font-family: var(--rpc-display);
  font-size: 0.9rem;
  font-weight: 900;
}

.rpc-occasion-card small {
  display: block;
  color: rgb(23 33 28 / 62%);
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}

/* ---------- customizer CTA ---------- */

.rpc-customizer-cta {
  max-width: 62rem;
  padding: clamp(26px, 5vw, 56px);
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-large);
  background: var(--rpc-paper);
  box-shadow: var(--rpc-pop);
}

.rpc-customizer-cta .rpc-eyebrow {
  color: var(--rpc-red);
}

.rpc-customizer-cta h2 {
  margin-top: 0;
  font-family: var(--rpc-display);
  font-size: clamp(1.5rem, 4.6vw, 2.4rem);
  font-weight: 900;
  line-height: 1.4;
}

/* ---------- how it works ---------- */

.rpc-card-grid {
  display: grid;
  gap: clamp(14px, 2.5vw, 24px);
  grid-template-columns: 1fr;
  max-width: 68rem;
  margin-inline: auto;
}

.rpc-card-grid > .wp-block-column {
  padding: clamp(18px, 3vw, 26px);
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-medium);
  background: #fff;
  box-shadow: var(--rpc-pop-sm);
}

.rpc-card-grid h3 {
  margin: 0.7rem 0 0.4rem;
  font-size: 1.08rem;
  font-weight: 900;
}

.rpc-card-grid p:not(.rpc-step-number) {
  margin: 0;
  color: rgb(23 33 28 / 78%);
  font-size: 0.88rem;
  line-height: 1.9;
  text-wrap: pretty;
}

.rpc-step-number {
  display: block;
  width: auto;
  height: auto;
  margin: 0;
  border-radius: 0;
  background: none;
  color: var(--rpc-red);
  font-family: var(--rpc-display);
  font-size: 2.4rem;
  font-weight: 900;
  line-height: 1;
}

/* ---------- maker ---------- */

.rpc-maker-section {
  border-top: var(--rpc-line);
  background: var(--rpc-ink) !important;
  color: var(--rpc-paper);
}

.rpc-maker-section .rpc-eyebrow {
  color: var(--rpc-sun);
}

.rpc-maker-section .rpc-section-title {
  color: var(--rpc-paper);
}

.rpc-manufacturing-note {
  max-width: 44rem;
  margin: 1.1rem auto 0;
  color: rgb(255 250 240 / 82%);
  line-height: 2;
  text-align: center;
  text-wrap: pretty;
}

.rpc-maker-section .wp-block-button__link {
  min-height: 52px;
  border: var(--rpc-line);
  box-shadow: var(--rpc-pop-sm);
  font-weight: 900;
}

/* ---------- faq ---------- */

.rpc-faq-section {
  border-top: var(--rpc-line);
}

.rpc-faq-list {
  max-width: 50rem;
  margin-top: clamp(24px, 4vw, 40px);
}

.rpc-faq-item {
  margin-block: 0.6rem;
  padding: 0;
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-medium);
  background: #fff;
  box-shadow: var(--rpc-pop-sm);
}

.rpc-faq-item summary {
  position: relative;
  min-height: 52px;
  padding: 1rem 3rem 1rem 1.1rem;
  cursor: pointer;
  font-weight: 800;
  line-height: 1.6;
  list-style: none;
}

.rpc-faq-item summary::-webkit-details-marker {
  display: none;
}

.rpc-faq-item summary::after {
  position: absolute;
  top: 50%;
  right: 1.1rem;
  color: var(--rpc-red);
  content: "+";
  font-size: 1.35rem;
  transform: translateY(-50%);
}

.rpc-faq-item[open] summary::after {
  content: "−";
}

.rpc-faq-item > p {
  margin: 0;
  padding: 0 1.1rem 1.1rem;
  color: rgb(23 33 28 / 78%);
  line-height: 1.95;
}

/* ---------- catalog / single ---------- */

.rpc-catalog-intro {
  max-width: 48rem;
  margin: 0 auto clamp(24px, 4vw, 42px);
  padding: 0.9rem 1.1rem;
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-medium);
  background: #fff;
  box-shadow: var(--rpc-pop-sm);
  font-weight: 700;
}

.rpc-catalog-help,
.rpc-product-assurance {
  margin-top: clamp(32px, 6vw, 64px);
  padding: clamp(20px, 4vw, 34px);
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-medium);
  background: #fff;
  box-shadow: var(--rpc-pop-sm);
}

.rpc-catalog-help h2 {
  margin-top: 0;
  font-family: var(--rpc-display);
  font-weight: 900;
}

.rpc-catalog-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.rpc-catalog-links a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  padding: 0.55rem 1rem;
  border: var(--rpc-line);
  border-radius: 999px;
  background: var(--rpc-paper);
  color: var(--rpc-ink);
  font-weight: 800;
  text-decoration: none;
}

.rpc-product-assurance {
  margin-bottom: clamp(36px, 6vw, 72px);
  text-align: center;
}

.rpc-product-assurance p {
  margin-block: 0.35rem;
}

.rpc-page-main .wp-block-post-title {
  font-family: var(--rpc-display);
  font-size: clamp(1.9rem, 5.5vw, 3rem);
  font-weight: 900;
  line-height: 1.35;
}

/* ---------- WooCommerce shared ---------- */

.woocommerce div.product,
.woocommerce-cart main,
.woocommerce-checkout main,
.woocommerce-account main {
  padding-block: clamp(32px, 6vw, 72px);
}

.woocommerce div.product .product_title {
  font-family: var(--rpc-display);
  font-weight: 900;
  line-height: 1.4;
}

.woocommerce div.product div.images img {
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-medium);
  background: #fff;
}

.woocommerce div.product .summary {
  box-sizing: border-box;
  padding: clamp(18px, 3vw, 32px);
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-medium);
  background: #fff;
  box-shadow: var(--rpc-pop-sm);
}

/* 00085-CVT shared body-color preview. The original WooCommerce image stays
   available as a fail-closed fallback until both trusted preview layers load. */

.woocommerce-product-gallery.rpc-has-shirt-preview .woocommerce-product-gallery__wrapper,
.woocommerce-product-gallery.rpc-has-shirt-preview .flex-control-thumbs {
  display: none;
}

.rpc-shirt-preview {
  margin: 0;
}

.rpc-shirt-preview__stage {
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 1;
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-medium);
  background: #f3ecdd;
}

.rpc-shirt-preview__base,
.rpc-shirt-preview__overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.rpc-shirt-preview__overlay {
  pointer-events: none;
}

/* Transparent artwork must not inherit the gallery image's white background. */
.woocommerce div.product div.images .rpc-shirt-preview__base,
.woocommerce div.product div.images .rpc-shirt-preview__overlay {
  background: transparent;
  border: 0;
  border-radius: 0;
}

.rpc-shirt-preview__caption {
  margin-top: 0.55rem;
  color: rgb(23 33 28 / 72%);
  font-size: 0.75rem;
  line-height: 1.6;
}

.rpc-shirt-color-picker {
  container-type: inline-size;
  margin-block: 1rem 1.4rem;
  padding: clamp(0.9rem, 2.5vw, 1.2rem);
  border: 2px solid rgb(23 33 28 / 18%);
  border-radius: 14px;
  background: #fffaf0;
}

.rpc-shirt-color-picker__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.8rem;
  gap: 0.55rem 0.8rem;
  flex-wrap: wrap;
}

.rpc-shirt-color-picker h2 {
  margin: 0;
  font-family: var(--rpc-display);
  font-size: 1rem;
  font-weight: 900;
}

.rpc-shirt-color-picker__selection {
  display: inline-flex;
  align-items: baseline;
  margin: 0;
  padding: 0.35rem 0.55rem;
  border: 1px solid rgb(23 33 28 / 20%);
  border-radius: 999px;
  background: #fff;
  font-size: 0.75rem;
  gap: 0.35rem;
  line-height: 1.25;
}

.rpc-shirt-color-picker__selection-label {
  color: rgb(23 33 28 / 64%);
  font-size: 0.68rem;
  font-weight: 700;
}

.rpc-shirt-color-picker__selection strong {
  white-space: nowrap;
}

.rpc-shirt-color-picker__swatches {
  display: grid;
  gap: 0.65rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.rpc-shirt-color-picker__swatch {
  position: relative;
  display: grid;
  align-items: center;
  min-width: 0;
  min-height: 64px;
  padding: 0.55rem 1.75rem 0.55rem 0.55rem;
  border: 2px solid rgb(23 33 28 / 18%);
  border-radius: 10px;
  background: #fff;
  color: var(--rpc-ink);
  cursor: pointer;
  font: inherit;
  gap: 0.55rem;
  grid-template-columns: 2rem minmax(0, 1fr);
  text-align: left;
  transition: border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}

@media (hover: hover) {
  .rpc-shirt-color-picker__swatch:hover {
    border-color: rgb(23 33 28 / 52%);
    transform: translateY(-1px);
  }
}

.rpc-shirt-color-picker__swatch.is-selected {
  border-color: var(--rpc-ink);
  background: #fffdf7;
  box-shadow: 3px 3px 0 var(--rpc-sun);
}

.rpc-shirt-color-picker__swatch:focus-visible {
  outline: 3px solid var(--rpc-blue);
  outline-offset: 2px;
}

.rpc-shirt-color-picker__chip {
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  border: 2px solid rgb(23 33 28 / 35%);
  border-radius: 50%;
  background: var(--rpc-shirt-chip);
}

.rpc-shirt-color-picker__label {
  display: grid;
  min-width: 0;
  gap: 0.1rem;
  line-height: 1.2;
}

.rpc-shirt-color-picker__name {
  overflow-wrap: anywhere;
  font-size: 0.76rem;
  font-weight: 900;
}

.rpc-shirt-color-picker__code {
  color: rgb(23 33 28 / 60%);
  font-size: 0.65rem;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.rpc-shirt-color-picker__selected-mark {
  position: absolute;
  top: 0.4rem;
  right: 0.4rem;
  display: grid;
  width: 1.05rem;
  height: 1.05rem;
  border-radius: 50%;
  background: var(--rpc-ink);
  color: #fff;
  font-size: 0.66rem;
  font-weight: 900;
  line-height: 1;
  opacity: 0;
  place-items: center;
  transform: scale(0.7);
  transition: opacity 120ms ease, transform 120ms ease;
}

.rpc-shirt-color-picker__swatch.is-selected .rpc-shirt-color-picker__selected-mark {
  opacity: 1;
  transform: scale(1);
}

.rpc-shirt-color-picker__notice {
  margin-block: 0.75rem 0;
  color: rgb(23 33 28 / 72%);
  font-size: 0.72rem;
  line-height: 1.6;
}

.rpc-shirt-color-picker--fallback .rpc-shirt-color-picker__notice::before {
  content: "商品画像は現在の登録画像を表示しています。";
  display: block;
  color: var(--rpc-red);
  font-weight: 800;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--rpc-ink);
  font-weight: 900;
}

.woocommerce div.product form.cart .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.wc-block-components-button {
  min-height: 48px;
  border: var(--rpc-line);
  border-radius: 999px;
  box-shadow: var(--rpc-pop-sm);
  font-weight: 900;
}

.woocommerce div.product form.cart .single_add_to_cart_button {
  width: 100%;
  background: var(--rpc-red);
  color: #fff;
}

.woocommerce div.product form.cart .quantity input.qty {
  min-height: 48px;
}

.woocommerce input.input-text,
.woocommerce select,
.woocommerce textarea,
.wc-block-components-text-input input,
.wc-block-components-combobox .wc-block-components-combobox-control input {
  min-height: 48px;
  border: 2px solid rgb(23 33 28 / 22%);
  border-radius: 10px;
  background: #fff;
}

.woocommerce input.input-text:focus,
.woocommerce select:focus,
.woocommerce textarea:focus {
  border-color: var(--rpc-ink);
}

.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce [aria-invalid="true"],
.wc-block-components-text-input input[aria-invalid="true"],
.wc-block-components-combobox input[aria-invalid="true"],
.wc-block-components-validation-error ~ input {
  border-color: var(--rpc-red);
}

.woocommerce form .form-row.woocommerce-invalid label,
.wc-block-components-validation-error {
  color: var(--rpc-red);
  font-weight: 800;
}

.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-medium);
  background: #fff;
  box-shadow: var(--rpc-pop-sm);
}

.woocommerce-error {
  border-color: var(--rpc-red);
}

.woocommerce table.shop_table {
  overflow: hidden;
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-medium);
  background: #fff;
}

.woocommerce table.shop_table th {
  font-weight: 900;
}

.woocommerce nav.woocommerce-pagination ul {
  overflow: hidden;
  border: var(--rpc-line);
  border-radius: 999px;
  background: #fff;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  min-width: 44px;
  min-height: 44px;
  line-height: 44px;
}

/* カスタマイザー（DOM契約は変更せず、見た目のみ） */

[data-rpc-customizer] {
  margin-block: 1.2rem;
  padding: clamp(14px, 3vw, 22px);
  border: var(--rpc-line);
  border-radius: var(--rpc-radius-medium);
  background: #fff;
  box-shadow: var(--rpc-pop-sm);
}

[data-rpc-frame] {
  width: 100%;
  border: 2px solid rgb(23 33 28 / 18%);
  border-radius: 10px;
  background: #f3ecdd;
}

[data-rpc-status] {
  margin-top: 0.7rem;
  font-size: 0.82rem;
  font-weight: 800;
}

/* ---------- footer ---------- */

.rpc-footer-inner {
  border-top: var(--rpc-line);
}

.rpc-footer-inner a {
  color: var(--rpc-paper);
}

.rpc-footer-brand {
  margin-bottom: 0.5rem;
  font-family: var(--rpc-display);
  font-size: clamp(1.2rem, 4vw, 1.6rem);
  font-weight: 900;
}

.rpc-footer-brand a {
  text-decoration: none;
}

.rpc-footer-grid {
  gap: clamp(26px, 5vw, 64px);
}

.rpc-footer-column h2 {
  margin-top: 0.25rem;
  color: var(--rpc-sun);
  font-weight: 900;
  letter-spacing: 0.05em;
}

.rpc-footer-links,
.rpc-footer-page-nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.rpc-footer-links li,
.rpc-footer-page-nav li {
  margin-block: 0.4rem;
}

.rpc-footer-links a,
.rpc-footer-page-nav a {
  display: inline-block;
  min-height: 44px;
  padding-block: 0.6rem;
  font-size: 0.84rem;
}

.rpc-footer-pending {
  color: rgb(255 250 240 / 72%);
  font-size: 0.8rem;
}

/* ---------- interactions ---------- */

@media (hover: hover) {
  .rpc-header-cta:hover,
  .rpc-occasion-card:hover,
  .rpc-product-grid .product:hover,
  .rpc-product-grid .wc-block-grid__product:hover,
  .rpc-product-grid .wc-block-product:hover {
    box-shadow: 6px 6px 0 var(--rpc-ink);
    transform: translate(-2px, -2px);
  }

  .rpc-catalog-links a:hover {
    background: var(--rpc-sun);
  }
}

/* ---------- responsive ---------- */

@media (max-width: 479px) {
  .rpc-brand-lockup .wp-block-site-title {
    font-size: 0.98rem;
    line-height: 1.25;
  }

  .rpc-brand-byline {
    display: none;
  }

  .rpc-header-cta {
    max-width: 6.2rem;
    padding-inline: 0.6rem;
    font-size: 0.72rem;
    line-height: 1.25;
    text-align: center;
    white-space: normal;
  }

  .rpc-hero .wp-block-buttons .wp-block-button,
  .rpc-hero .wp-block-buttons .wp-block-button__link {
    width: 100%;
  }

  .rpc-hero .wp-block-buttons .wp-block-button__link {
    text-align: center;
  }
}

/* WordPress core switches to the full menu at 600px, which is too early for
   the six Japanese labels plus the primary CTA. Keep the compact menu until
   the header has enough room for a single clean row. */
@media (min-width: 600px) and (max-width: 1199px) {
  .rpc-primary-nav .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none;
  }

  .rpc-primary-nav .wp-block-navigation__responsive-container-open {
    display: flex;
  }
}

@media (min-width: 540px) {
  .rpc-trust-items li {
    padding-inline: 1rem;
    font-size: 0.8rem;
  }

  .rpc-product-grid .products,
  .rpc-product-grid .wc-block-grid__products,
  .rpc-product-grid .wc-block-product-template {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rpc-occasion-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .rpc-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

}

@container (min-width: 32rem) {
  .rpc-shirt-color-picker__swatches {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 782px) {
  .rpc-header-inner {
    padding-block: 14px;
  }

  .rpc-mock {
    gap: 0.9rem;
  }

  .rpc-occasion-featured {
    align-items: center;
    gap: 1.2rem 2.5rem;
    grid-template-columns: auto 1fr auto;
  }

  .rpc-occasion-featured small {
    grid-column: 1 / -1;
  }

  .rpc-occasion-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 1040px) {
  .rpc-product-grid .products,
  .rpc-product-grid .wc-block-grid__products,
  .rpc-product-grid .wc-block-product-template {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .rpc-occasion-list {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .rpc-card-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}
