/* Aoyama screen layer: presentation only. Commerce hooks and form behavior remain untouched. */
:root { --aoyama-display: #103e28; --aoyama-moss: #dbe8b9; --aoyama-paper: #f7f9f2; }
html { scroll-behavior: smooth; }
body { background: #fff; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid #f76700; outline-offset: 3px; }
.site-header { border-bottom: 1px solid var(--aoyama-border); }
.main-header-menu .menu-link { font-weight: 600; }
.site-header .ast-builder-button-wrap .ast-custom-button { font-weight: 700; }

/* Home: the hero is the page heading; remove the redundant Astra title only here. */
body.home .entry-header, body.aoyama-zh-home .entry-header { display: none; }
body.home.ast-plain-container #primary { margin-top: 25px !important; }
body.aoyama-zh-home.ast-plain-container #primary { margin-top: 25px !important; }
body.home .site-content .ast-container { max-width: 1220px; }
body.home .entry-content { margin-top: 0; }
.aoyama-home { color: var(--aoyama-fg); }
.aoyama-home p { line-height: 1.8; }
.aoyama-home .aoyama-eyebrow { color: var(--aoyama-accent); font-size: .72rem; font-weight: 700; letter-spacing: .2em; line-height: 1.5; margin: 0 0 16px; text-transform: uppercase; }
.aoyama-home-hero { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); min-height: 475px; overflow: hidden; background: var(--aoyama-display); color: #fff; position: relative; }
.aoyama-home-hero::before { content: ''; position: absolute; inset: 0 45% 0 0; opacity: .16; pointer-events: none; background: repeating-linear-gradient(142deg, transparent 0 45px, #8bb678 46px, transparent 47px 94px); }
.aoyama-home-hero__copy { z-index: 1; align-self: center; padding: 52px clamp(28px, 5vw, 78px); }
.aoyama-home-hero .aoyama-eyebrow { color: #e6b871; }
.aoyama-home-hero h1 { font-size: clamp(2.5rem, 4.2vw, 4.4rem); font-weight: 700; letter-spacing: -.03em; line-height: 1.28; color: #fff; margin: 0 0 23px; }
.aoyama-home-hero__lead { max-width: 32em; font-size: 1.06rem; color: #edf4e8; margin: 0 0 28px; }
.aoyama-home-hero__actions { display: flex; flex-wrap: wrap; gap: 11px; align-items: center; }
.aoyama-action { display: inline-flex; align-items: center; justify-content: center; gap: 20px; min-height: 51px; padding: 11px 22px; font-weight: 700; font-size: .93rem; text-decoration: none !important; border: 1px solid transparent; border-radius: 3px; transition: transform .18s, background-color .18s, color .18s; }
.aoyama-action:hover { transform: translateY(-2px); }
.aoyama-action--light { background: #f8f6e8; color: var(--aoyama-display) !important; }
.aoyama-action--light:hover { background: #fff; }
.aoyama-action--outline { color: #fff !important; border-color: rgba(255,255,255,.7); }
.aoyama-action--outline:hover { background: rgba(255,255,255,.12); }
.aoyama-action--dark { background: var(--aoyama-display); color: #fff !important; white-space: nowrap; }
.aoyama-action--dark:hover { background: #082d1c; }
.aoyama-home-hero__contact { color: #edf4e8; font-size: .78rem; margin: 28px 0 0; }
.aoyama-home-hero__contact a { color: #fff; font-weight: 700; text-decoration: none; }
.aoyama-home-hero__contact span { opacity: .82; margin-left: 7px; }
.aoyama-home-hero__visual { position: relative; overflow: hidden; min-height: 100%; background: #8db85e; }
.aoyama-home-hero__image, .aoyama-home-hero__fallback { width: 100%; height: 100%; object-fit: cover; display: block; }
.aoyama-home-hero__fallback { min-height: 400px; background: linear-gradient(170deg,#d0e9d5 0 50%,#5c9950 50% 100%); }
.aoyama-home-hero__seal { position: absolute; right: 25px; bottom: 25px; display: flex; flex-direction: column; justify-content: center; width: 145px; height: 145px; border-radius: 50%; background: #fff9e6; color: var(--aoyama-display); text-align: center; box-shadow: 0 12px 30px #103e2833; transform: rotate(8deg); }
.aoyama-home-hero__seal span { font-size: .58rem; letter-spacing: .12em; font-weight: 700; margin-bottom: 7px; }
.aoyama-home-hero__seal strong { font-size: 1.05rem; line-height: 1.4; }
.aoyama-home-stats { position: relative; z-index: 2; max-width: 830px; margin: -26px auto 0; padding: 0 16px; }
.aoyama-home-stats .aoyama-stats { margin: 0; border-radius: 3px; box-shadow: 0 15px 36px #173d1e1a; padding: 17px 8px; }
.aoyama-home-section { padding: 72px 0 0; }
.aoyama-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 25px; }
.aoyama-section-heading h2, .aoyama-home-cta h2 { margin: 0 !important; padding: 0 !important; border: 0 !important; color: var(--aoyama-display); font-size: clamp(1.7rem,2.5vw,2.3rem); line-height: 1.35; font-weight: 700; letter-spacing: -.025em; }
.aoyama-section-heading > p { font-size: .9rem; color: #53685a; max-width: 32em; margin: 0 0 4px; }
.aoyama-section-heading .aoyama-eyebrow { margin-bottom: 9px; }
.aoyama-text-link { display: inline-flex; align-items: center; gap: 17px; color: var(--aoyama-display); font-weight: 700; border-bottom: 1px solid currentColor; padding-bottom: 5px; white-space: nowrap; text-decoration: none !important; }
.aoyama-text-link:hover { color: var(--aoyama-accent); }
.aoyama-home-section--find { padding: 76px 0 46px; }
.aoyama-home-section--find .aoyama-search { margin: 0 0 15px; gap: 0; max-width: 700px; }
.aoyama-home-section--find .aoyama-search input[type=search] { border-radius: 3px 0 0 3px; min-width: 0; min-height: 52px; background: var(--aoyama-paper); }
.aoyama-home-section--find .aoyama-search button { border-radius: 0 3px 3px 0; font-weight: 700; }
.aoyama-home-section--find .aoyama-pills { margin: 15px 0 30px; }
.aoyama-home-section--find .aoyama-pills__item { border-radius: 3px; padding: 7px 18px; }
.aoyama-home-section--find .aoyama-quicklinks { margin: 0; border-radius: 3px; background: var(--aoyama-paper); }
.aoyama-home-section--find .aoyama-quicklinks__item { font-weight: 600; background: transparent; min-height: 67px; }
.aoyama-home-section--find .aoyama-quicklinks__item:hover { background: var(--aoyama-moss); }
.aoyama-home .aoyama-quicklinks__item, .aoyama-home .aoyama-pills__item { text-decoration: none; }
.aoyama-home-section--products { border-top: 1px solid var(--aoyama-border); }
.aoyama-home-section--products ul.products { margin-bottom: 0 !important; }
.aoyama-home-section--promises { margin-top: 75px; padding: 69px 0 72px; border-top: 1px solid var(--aoyama-border); border-bottom: 1px solid var(--aoyama-border); }
.aoyama-promise-list { list-style: none; margin: 34px 0 0 !important; padding: 0 !important; display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; }
.aoyama-promise-list li { border-top: 2px solid var(--aoyama-primary); padding: 19px 0 0; }
.aoyama-promise-list li > span { color: var(--aoyama-accent); font-size: .77rem; letter-spacing: .13em; font-weight: 700; }
.aoyama-promise-list h3 { font-size: 1.08rem; color: var(--aoyama-display); margin: 17px 0 10px; }
.aoyama-promise-list p { font-size: .87rem; color: #56675c; margin: 0; }
.aoyama-home-cta { margin-top: 74px; padding: clamp(28px,5vw,58px); display: flex; align-items: center; justify-content: space-between; gap: 35px; background: #e8f0d7; }
.aoyama-home-cta .aoyama-eyebrow { margin-bottom: 11px; }
.aoyama-home-cta p:last-child { margin: 15px 0 0; max-width: 42em; font-size: .9rem; }
.aoyama-home-note { color: #6b7a70; font-size: .75rem; margin: 16px 0 0; }
.aoyama-zh-categories { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; }
.aoyama-zh-categories a { display: flex; flex-direction: column; gap: 7px; padding: 22px; background: var(--aoyama-paper); border-top: 2px solid var(--aoyama-primary); color: var(--aoyama-display); font-weight: 700; text-decoration: none; }
.aoyama-zh-categories a:hover { background: var(--aoyama-moss); }
.aoyama-zh-categories span { font-size: .78rem; color: #596a5f; font-weight: 400; }

/* Shop cards: refine the stock catalog without replacing WooCommerce markup. */
.woocommerce-shop .ast-woocommerce-container { padding-top: 20px; }
.woocommerce-shop .woocommerce-products-header__title { font-size: clamp(2rem,3vw,3rem); color: var(--aoyama-display); letter-spacing: -.025em; }
.woocommerce-shop .woocommerce-breadcrumb { color: #617167; font-size: .78rem; }
.woocommerce ul.products li.product { background: #fff; border: 1px solid var(--aoyama-border); padding: 0 0 20px !important; transition: box-shadow .2s, transform .2s; }
.woocommerce ul.products li.product:hover { box-shadow: 0 12px 35px #12382317; transform: translateY(-3px); }
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap { background: var(--aoyama-paper); }
.woocommerce ul.products li.product img { border-radius: 0; margin-bottom: 0; }
.woocommerce ul.products li.product .ast-woo-shop-product-description, .woocommerce ul.products li.product .astra-shop-summary-wrap { padding-left: 17px; padding-right: 17px; }
.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 1.04rem; font-weight: 700; line-height: 1.5; color: var(--aoyama-display); }
.woocommerce ul.products li.product .button { margin-left: 17px; margin-right: 17px; border-radius: 3px; }
.woocommerce ul.products li.product .aoyama-badge { border-radius: 2px; top: 12px; left: 12px; }
.woocommerce ul.products li.product .aoyama-chips, .woocommerce ul.products li.product .aoyama-delivery { margin-top: 9px; }
.woocommerce ul.products li.product .price { font-size: 1.1rem; }

/* Informational pages keep their content and forms, with clearer reading rhythm. */
.page:not(.home):not(.woocommerce-page) .entry-title { color: var(--aoyama-display); font-size: clamp(1.8rem,3vw,2.8rem); letter-spacing: -.02em; }
.page:not(.home) .entry-content > h2 { border-bottom: 1px solid var(--aoyama-border); padding-bottom: 12px; }
.aoyama-legal-footer { background: var(--aoyama-display); border-top: 0; margin-top: 70px; padding: 38px 16px; }
.aoyama-legal-footer__menu a { color: #f4f8ec; }
.aoyama-legal-footer__meta { color: #c9d9cd; }

@media (max-width: 921px) {
  .aoyama-home-hero { min-height: 415px; }
  .aoyama-home-hero__copy { padding: 35px; }
  .aoyama-promise-list, .aoyama-zh-categories { grid-template-columns: repeat(2,1fr); }
  .aoyama-home-cta { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 680px) {
  body.home .site-content .ast-container { padding-left: 14px; padding-right: 14px; }
  .aoyama-home-hero { display: flex; flex-direction: column; }
  .aoyama-home-hero__copy { padding: 34px 23px 32px; }
  .aoyama-home-hero h1 { font-size: clamp(2rem,8.6vw,3rem); }
  .aoyama-home-hero__lead { font-size: .94rem; }
  .aoyama-home-hero__visual { height: 240px; min-height: 240px; }
  .aoyama-home-hero__seal { width: 105px; height: 105px; right: 13px; bottom: 13px; }
  .aoyama-home-hero__seal span { font-size: .45rem; margin-bottom: 4px; }
  .aoyama-home-hero__seal strong { font-size: .78rem; }
  .aoyama-home-stats { margin-top: 0; padding: 0; }
  .aoyama-home-stats .aoyama-stats { box-shadow: none; border-top: 0; }
  .aoyama-home-section { padding-top: 54px; }
  .aoyama-section-heading { display: block; }
  .aoyama-section-heading > p { margin: 11px 0 0; }
  .aoyama-section-heading--split .aoyama-text-link { margin-top: 18px; }
  .aoyama-home-section--find .aoyama-search button { padding: 0 17px; }
  .aoyama-promise-list { gap: 18px; }
  .aoyama-promise-list h3 { margin-top: 8px; }
  .aoyama-home-section--promises { margin-top: 53px; padding-bottom: 53px; }
  .aoyama-home-cta { margin-top: 54px; }
  .aoyama-zh-categories { gap: 8px; }
  .aoyama-zh-categories a { padding: 15px; }
  /* 親に内側余白があるので幅は差し引かない（デスクトップ側と同じ理由） */
  .woocommerce ul.products li.product .button { display: block; width: 100%; margin-left: 0; margin-right: 0; padding: 11px 6px; min-height: 44px; font-size: .84rem; line-height: 1.3; white-space: nowrap; }
}
@media (max-width: 420px) {
  .aoyama-promise-list { grid-template-columns: 1fr; }
  .aoyama-home-hero__contact span { display: block; margin-left: 0; }
  .aoyama-home-hero__actions { align-items: stretch; }
  .aoyama-home-hero__actions .aoyama-action { flex: 1 1 100%; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .aoyama-action, .woocommerce ul.products li.product { transition: none; }
  .aoyama-action:hover, .woocommerce ul.products li.product:hover { transform: none; }
}

/* -------------------------------------------------------------------------
 * Mini-program home treatment
 * Keep the existing WooCommerce markup and links, but bring the first view
 * closer to miniprogram/pages/index: warm paper canvas, compact farm hero,
 * three small stats, pill search and a two-column product shelf.
 * ---------------------------------------------------------------------- */
body.home {
  background: var(--aoyama-bg);
}

body.home .site-content .ast-container {
  max-width: 820px;
  padding-left: 24px;
  padding-right: 24px;
}

body.home .site-header {
  background: var(--aoyama-bg);
  border-bottom: 0;
}

body.home .site-content .aoyama-home {
  padding-bottom: 72px;
}

body.home .aoyama-home-hero {
  display: block;
  min-height: 0;
  margin: 18px 0 18px;
  border: 1px solid #dce8d6;
  border-radius: 24px;
  overflow: hidden;
  background: linear-gradient(135deg, #e8f3e4 0%, #f0f6ec 55%, #fbfaf5 100%);
  color: var(--aoyama-fg);
  box-shadow: 0 12px 30px rgba(15, 77, 42, .06);
}

body.home .aoyama-home-hero::before { display: none; }
body.home .aoyama-home-hero__copy { padding: 32px 32px 24px; }
body.home .aoyama-home-hero .aoyama-eyebrow {
  color: var(--aoyama-primary);
  font-size: .78rem;
  letter-spacing: .08em;
  margin-bottom: 8px;
}
body.home .aoyama-home-hero h1 {
  max-width: 15em;
  margin-bottom: 10px;
  color: var(--aoyama-primary);
  font-size: clamp(2rem, 5vw, 3.2rem);
  line-height: 1.25;
}
body.home .aoyama-home-hero__lead {
  max-width: 36em;
  margin-bottom: 22px;
  color: #4d6356;
  font-size: .97rem;
}
body.home .aoyama-home-hero__actions { gap: 9px; }
body.home .aoyama-home-hero .aoyama-action {
  min-height: 42px;
  padding: 9px 16px;
  border-radius: 999px;
  font-size: .83rem;
}
body.home .aoyama-home-hero .aoyama-action--light {
  background: var(--aoyama-primary);
  color: #fff !important;
}
body.home .aoyama-home-hero .aoyama-action--outline {
  border-color: #b8cbb8;
  color: var(--aoyama-primary) !important;
}
body.home .aoyama-home-hero__contact {
  margin-top: 18px;
  color: #607367;
}
body.home .aoyama-home-hero__contact a { color: var(--aoyama-primary); }
body.home .aoyama-home-hero__visual {
  height: 178px;
  min-height: 178px;
  background: #d9e9d4;
}
body.home .aoyama-home-hero__image,
body.home .aoyama-home-hero__fallback { min-height: 178px; }
body.home .aoyama-home-hero__seal {
  right: 18px;
  bottom: 16px;
  width: 106px;
  height: 106px;
  background: #fff9e6;
}
body.home .aoyama-home-hero__seal span { font-size: .47rem; }
body.home .aoyama-home-hero__seal strong { font-size: .8rem; }

body.home .aoyama-home-stats {
  max-width: none;
  margin: 0 0 18px;
  padding: 0;
}
body.home .aoyama-home-stats .aoyama-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
body.home .aoyama-home-stats .aoyama-stats__item {
  min-width: 0;
  flex-direction: column;
  gap: 4px;
  padding: 15px 8px;
  border: 1px solid var(--aoyama-border);
  border-radius: 16px;
  background: #fff;
  text-align: center;
}
body.home .aoyama-home-stats .aoyama-stats__icon { font-size: 21px; }
body.home .aoyama-home-stats .aoyama-stats__body { align-items: center; }
body.home .aoyama-home-stats .aoyama-stats__label { font-size: .72rem; }
body.home .aoyama-home-stats .aoyama-stats__value { font-size: 1rem; }
body.home .aoyama-home-stats .aoyama-stats__value small { font-size: .7rem; }
body.home .aoyama-home-stats .aoyama-stats__paypay { font-size: .7rem; }

body.home .aoyama-home-section {
  padding: 28px 0 0;
}
body.home .aoyama-home-section--find {
  padding: 0 0 30px;
}
body.home .aoyama-section-heading {
  display: block;
  margin-bottom: 16px;
}
body.home .aoyama-section-heading .aoyama-eyebrow {
  margin-bottom: 7px;
  color: var(--aoyama-primary);
  font-size: .7rem;
  letter-spacing: .08em;
}
body.home .aoyama-section-heading h2,
body.home .aoyama-home-cta h2 {
  font-size: clamp(1.45rem, 3vw, 2rem);
}
body.home .aoyama-section-heading > p { margin-top: 8px; }
body.home .aoyama-home-section--find .aoyama-search {
  display: flex;
  max-width: none;
  margin: 0 0 14px;
  gap: 0;
}
body.home .aoyama-home-section--find .aoyama-search input[type=search] {
  min-height: 46px;
  padding: 10px 18px;
  border: 1px solid var(--aoyama-border);
  border-radius: 999px 0 0 999px;
  background: #fff;
}
body.home .aoyama-home-section--find .aoyama-search button {
  min-width: 72px;
  border-radius: 0 999px 999px 0;
  background: var(--aoyama-primary);
}
body.home .aoyama-home-section--find .aoyama-pills {
  margin: 0 0 16px;
  gap: 7px;
}
body.home .aoyama-home-section--find .aoyama-pills__item {
  padding: 6px 14px;
  border-radius: 999px;
  font-size: .8rem;
}
body.home .aoyama-home-section--find .aoyama-quicklinks {
  margin: 0;
  border-radius: 16px;
  background: #fff;
}
body.home .aoyama-home-section--find .aoyama-quicklinks__item {
  min-height: 52px;
  padding: 11px 6px;
  font-size: .82rem;
}

body.home .aoyama-home-section--products {
  padding-top: 28px;
  border-top: 1px solid var(--aoyama-border);
}
body.home .aoyama-home-section--products ul.products {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
body.home .aoyama-home-section--products ul.products li.product {
  width: auto !important;
  margin: 0 !important;
  padding-bottom: 14px !important;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 8px 20px rgba(15, 77, 42, .05);
}
body.home .aoyama-home-section--products ul.products li.product .astra-shop-thumbnail-wrap {
  min-height: 180px;
}
body.home .aoyama-home-section--products ul.products li.product img {
  width: 100%;
  min-height: 180px;
  object-fit: cover;
}
body.home .aoyama-home-section--products ul.products li.product .woocommerce-loop-product__title {
  min-height: 2.8em;
  margin-top: 14px;
  font-size: .92rem;
}
body.home .aoyama-home-section--products ul.products li.product .price {
  font-size: 1.02rem;
}
body.home .aoyama-home-section--products ul.products li.product .button {
  width: calc(100% - 34px);
  min-height: 39px;
  margin: 8px 17px 0;
  border-radius: 999px;
  background: var(--aoyama-primary);
  font-size: .78rem;
}

@media (max-width: 600px) {
  body.home .site-content .ast-container { padding-left: 14px; padding-right: 14px; }
  body.home .aoyama-home-hero { margin-top: 12px; border-radius: 20px; }
  body.home .aoyama-home-hero__copy { padding: 27px 22px 21px; }
  body.home .aoyama-home-hero__visual,
  body.home .aoyama-home-hero__image,
  body.home .aoyama-home-hero__fallback { height: 150px; min-height: 150px; }
  body.home .aoyama-home-section--products ul.products { gap: 10px; }
  body.home .aoyama-home-section--products ul.products li.product .astra-shop-thumbnail-wrap,
  body.home .aoyama-home-section--products ul.products li.product img { min-height: 142px; }
  body.home .aoyama-home-section--products ul.products li.product .ast-woo-shop-product-description,
  body.home .aoyama-home-section--products ul.products li.product .astra-shop-summary-wrap { padding-left: 13px; padding-right: 13px; }
  body.home .aoyama-home-section--products ul.products li.product .button { width: 100%; margin-left: 0; margin-right: 0; }
}

/* Product archive: use the same mini-program shelf without changing
 * WooCommerce queries, sorting, pagination or add-to-cart behavior. */
body.woocommerce-shop,
body.tax-product_cat,
body.post-type-archive-product {
  background: var(--aoyama-bg);
}

/* ホームは 820px の「アプリ風の細い段」で通すが、商品一覧だけは広げる。
   820px に 4 カラムを詰めるとカード 183px になり、商品名 11px・
   ボタンのラベルが 3 行折り返しと、読めない大きさまで落ちていた。
   1140px なら 1 枚 262px 取れる。 */
body.woocommerce-shop .site-content .ast-container,
body.tax-product_cat .site-content .ast-container,
body.post-type-archive-product .site-content .ast-container {
  max-width: 1140px;
  padding-left: 24px;
  padding-right: 24px;
}

body.woocommerce-shop .ast-woocommerce-container,
body.tax-product_cat .ast-woocommerce-container,
body.post-type-archive-product .ast-woocommerce-container {
  padding-top: 24px;
}

body.woocommerce-shop .woocommerce-products-header__title,
body.tax-product_cat .woocommerce-products-header__title,
body.post-type-archive-product .woocommerce-products-header__title {
  color: var(--aoyama-primary);
  font-size: clamp(1.7rem, 4vw, 2.45rem);
}

body.woocommerce-shop ul.products,
body.tax-product_cat ul.products,
body.post-type-archive-product ul.products {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

body.woocommerce-shop ul.products li.product,
body.tax-product_cat ul.products li.product,
body.post-type-archive-product ul.products li.product {
  width: auto !important;
  margin: 0 !important;
  padding-bottom: 14px !important;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 8px 20px rgba(15, 77, 42, .05);
}

body.woocommerce-shop ul.products li.product .astra-shop-thumbnail-wrap,
body.tax-product_cat ul.products li.product .astra-shop-thumbnail-wrap,
body.post-type-archive-product ul.products li.product .astra-shop-thumbnail-wrap {
  min-height: 180px;
}

body.woocommerce-shop ul.products li.product img,
body.tax-product_cat ul.products li.product img,
body.post-type-archive-product ul.products li.product img {
  width: 100%;
  min-height: 180px;
  object-fit: cover;
}

/* 一覧の目的は「商品を選ぶこと」なので、カード内で最も強い文字は商品名にする。
   以前はチップ群のほうが目立ち、視線誘導が逆になっていた。
   2 行で打ち切ってカードの高さも揃える。 */
body.woocommerce-shop ul.products li.product .woocommerce-loop-product__title,
body.tax-product_cat ul.products li.product .woocommerce-loop-product__title,
body.post-type-archive-product ul.products li.product .woocommerce-loop-product__title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.9em;
  margin-top: 12px;
  font-size: 1rem;
  font-weight: 700;
}

/* ボタンの親 .astra-shop-summary-wrap には左右 17px の内側余白が既にある。
   そこへ calc(100% - 34px) を重ねていたため二重に削られ、
   幅 120px に 9 文字が押し込まれて 3 行折り返していた。
   親の内側いっぱいに広げる。 */
body.woocommerce-shop ul.products li.product .button,
body.tax-product_cat ul.products li.product .button,
body.post-type-archive-product ul.products li.product .button {
  display: block;
  width: 100%;
  min-height: 44px;          /* タップ領域 (WCAG 2.5.5) */
  margin: 10px 0 0;
  padding: 11px 10px;
  border-radius: 999px;
  background: var(--aoyama-primary);
  font-size: .88rem;
  line-height: 1.4;
  /* 日本語は任意の位置で折り返せてしまうので、ボタン内では禁止する */
  white-space: nowrap;
}

@media (max-width: 600px) {
  body.woocommerce-shop .site-content .ast-container,
  body.tax-product_cat .site-content .ast-container,
  body.post-type-archive-product .site-content .ast-container { padding-left: 14px; padding-right: 14px; }
  body.woocommerce-shop ul.products,
  body.tax-product_cat ul.products,
  body.post-type-archive-product ul.products { gap: 10px; }
  body.woocommerce-shop ul.products li.product .astra-shop-thumbnail-wrap,
  body.woocommerce-shop ul.products li.product img,
  body.tax-product_cat ul.products li.product .astra-shop-thumbnail-wrap,
  body.tax-product_cat ul.products li.product img,
  body.post-type-archive-product ul.products li.product .astra-shop-thumbnail-wrap,
  body.post-type-archive-product ul.products li.product img { min-height: 142px; }
  body.woocommerce-shop ul.products li.product .ast-woo-shop-product-description,
  body.woocommerce-shop ul.products li.product .astra-shop-summary-wrap,
  body.tax-product_cat ul.products li.product .ast-woo-shop-product-description,
  body.tax-product_cat ul.products li.product .astra-shop-summary-wrap,
  body.post-type-archive-product ul.products li.product .ast-woo-shop-product-description,
  body.post-type-archive-product ul.products li.product .astra-shop-summary-wrap { padding-left: 13px; padding-right: 13px; }
  body.woocommerce-shop ul.products li.product .button,
  body.tax-product_cat ul.products li.product .button,
  body.post-type-archive-product ul.products li.product .button { width: 100%; margin-left: 0; margin-right: 0; }
}

/* ============================================================
   公式アカウント QR 枠（ヒーロー右側）
   マークアップは 75-aoyama-screen.php の [aoyama_qr_panel]。

   枠は画像が未設定でも常に出す。入れ物が消えたり現れたりすると、
   農場側が QR を差し替えた瞬間にヒーローの段組みが変わってしまう。

   ヒーローは 2 種類ある:
     - 日本語ホーム (body.home)  … 明るい淡色。コピーの右が空いている
     - 中国語ホーム (/zh/)        … 濃緑 2 カラム。右は写真
   共通の見た目を変数で持たせ、配置だけを各ヒーローで指定する。
   ============================================================ */
.aoyama-qr-panel {
  /* 既定は明るい面に置く想定。以前は濃緑ヒーロー用(白文字)を既定にしていたため、
     フッターに置いたとき白地に白文字になって消えていた。
     反転が要るのは濃緑ヒーローの中だけなので、そこだけ上書きする。 */
  --qr-bg: #fff;
  --qr-border: #dce8d6;
  --qr-title: var(--aoyama-primary);
  --qr-text: #4d6356;
  align-self: center;
  margin: 0;
  padding: 18px;
  border: 1px solid var(--qr-border);
  border-radius: 18px;
  background: var(--qr-bg);
}
.aoyama-qr-panel__title {
  margin: 0 0 4px;
  color: var(--qr-title);
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .04em;
}
.aoyama-qr-panel__lead {
  margin: 0 0 14px;
  color: var(--qr-text);
  font-size: .72rem;
  line-height: 1.6;
}
.aoyama-qr-panel__list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.aoyama-qr { margin: 0; text-align: center; }
/* QR は白地でないと読み取り精度が落ちるので、枠の中は常に白のままにする */
.aoyama-qr__frame {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  padding: 6px;
  border: 1px solid #dce8d6;
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}
.aoyama-qr__image { width: 100%; height: 100%; object-fit: contain; display: block; }
/* 画像未設定のときの中身。差し込み先だと分かる程度に留める */
.aoyama-qr__empty {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border: 2px dashed #c3d8c6;
  border-radius: 8px;
  color: #9db3a3;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
}
.aoyama-qr__name {
  margin: 8px 0 0;
  color: var(--qr-title);
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.3;
}
.aoyama-qr__note {
  margin: 2px 0 0;
  color: var(--qr-text);
  font-size: .66rem;
  line-height: 1.4;
}

/* --- 中国語ホーム(濃緑ヒーロー): コピーと写真のあいだに細い列を挟む --- */
.aoyama-home-hero {
  /* QR 列の分は写真から削る。コピー列を狭めると見出しの折り返しが増え、
     もとの 2 行組み(「把清晨采摘的蔬菜，/ 送到您的餐桌。」)が崩れるため。 */
  grid-template-columns: minmax(0, 1.08fr) clamp(205px, 19%, 255px) minmax(0, .5fr);
  grid-template-areas: "copy qr visual";
}
.aoyama-home-hero__copy { grid-area: copy; }
.aoyama-home-hero__visual { grid-area: visual; }
.aoyama-home-hero .aoyama-qr-panel { grid-area: qr; margin-right: clamp(14px, 2vw, 26px); }

/* --- 濃緑ヒーロー(中国語ホーム)の中だけ、地と文字を反転する --- */
body:not(.home) .aoyama-home-hero .aoyama-qr-panel {
  --qr-bg: rgba(255, 255, 255, .10);
  --qr-border: rgba(255, 255, 255, .30);
  --qr-title: #fff;
  --qr-text: #edf4e8;
}

/* --- 日本語ホーム(淡色ヒーロー): 空いているコピー右に置く --- */
body.home .aoyama-home-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(230px, 26%, 310px);
  grid-template-areas:
    "copy qr"
    "visual visual";
  align-items: center;
}
body.home .aoyama-qr-panel {
  margin: 0 32px 0 0;
  box-shadow: 0 8px 20px rgba(15, 77, 42, .05);
}

/* --- 狭い画面ではヒーローを縦積みにする --- */
@media (max-width: 1000px) {
  .aoyama-home-hero,
  body.home .aoyama-home-hero {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "copy"
      "qr"
      "visual";
  }
  .aoyama-home-hero .aoyama-qr-panel,
  body.home .aoyama-qr-panel {
    margin: 0 clamp(20px, 5vw, 35px) 24px;
  }
  /* 縦積みでは幅が余るので、枠が間延びしないよう上限を付ける */
  .aoyama-qr-panel__list { max-width: 330px; }
}

/* ============================================================
   アクセシビリティ対応（WCAG 2.1 AA）
   実測で不適合だったものだけを直す。計測値は docs/08-screen-design.md。
   ============================================================ */

/* ---- 1.4.3 コントラスト ----
   アクセント #f76700 は白抜き文字の下地としても、小さな文字の色としても
   比が足りない（白抜き 3.05:1 / 文字 2.59:1、いずれも 4.5:1 必要）。
   「図形に使う色」と「文字に使う色」を分ける。
   #f76700 … 下線・ドット・アイコンなど文字でないもの（1.4.11 の 3:1 で足りる）
   #c2410c … 淡色背景に載せる文字（4.96:1）*/
.aoyama-home .aoyama-eyebrow,
.aoyama-eyebrow { color: #c2410c; }
/* 濃緑ヒーロー(中国語ホーム)の見出しは淡い金のまま。
   body.home を付けずに上書きすると、濃緑の上に濃緑を載せてしまう。 */
body.home .aoyama-home-hero .aoyama-eyebrow { color: var(--aoyama-primary); }

/* 在庫表示。#77a464 は 2.89:1 しかなかった */
.woocommerce .summary .stock,
.woocommerce div.product .stock { color: #3f6b30; }

/* 注記まわり。#6b7a70 は 4.33:1 でわずかに届かない */
.aoyama-home-note { color: #5c6b61; }

/* ---- 2.5.5 タップ領域 44px ----
   屋外・片手・年齢層高めの利用を想定しているので基準どおり確保する。 */
.woocommerce div.product form.cart .button,
.woocommerce div.product form.cart .qty,
.woocommerce .single_add_to_cart_button {
  min-height: 44px;
}
.woocommerce div.product form.cart .button {
  padding: 12px 28px;
  border-radius: 999px;
  font-size: 1rem;
}

/* ---- 商品詳細の見出し ----
   詳細に来た時点で商品は選ばれている。知りたいのは「これは何か」で、
   価格はその次。以前は 商品名 20px < 価格 24px と逆転していた。 */
.woocommerce div.product .product_title {
  font-size: 1.65rem;
  line-height: 1.45;
  margin-bottom: 6px;
}
.woocommerce div.product .summary .price { font-size: 1.4rem; }

/* ---- 最小文字サイズ ----
   日本語・中国語は同じ級数でもラテン文字よりつぶれる。
   1 文字あたりの画数が多く、12px を切ると判別しづらい。
   欧文サイトの数値をそのまま持ち込まない。 */
.aoyama-qr__note { font-size: .75rem; }
.aoyama-qr-panel__lead { font-size: .78rem; }
.aoyama-eyebrow { font-size: .75rem; }

/* ---- カード上部の分類表示 ----
   チップで同じ情報を出しているので、カテゴリー行は情報を増やしていない。
   行が 1 本減るぶん商品名が上がる。 */
body.woocommerce-shop ul.products li.product .ast-woo-product-category,
body.tax-product_cat ul.products li.product .ast-woo-product-category,
body.post-type-archive-product ul.products li.product .ast-woo-product-category { display: none; }

/* チップと配送表示を 1 行にまとめる（以前は 2 行を占有していた） */
.aoyama-chips, .aoyama-delivery { display: inline-flex; margin: 6px 6px 0 0; }

/* ---- 価格の色 ----
   70-aoyama-design.php は価格をブランドカラーに指定しているが、
   この層が上書きして #1f3128 になっていた。指定どおりに戻す。 */
.woocommerce ul.products li.product .price,
.woocommerce div.product .summary .price { color: var(--aoyama-primary); }

/* ---- 購入ボタンの色をそろえる ----
   同じ「カートに入れる」操作なのに、一覧では深緑・詳細ではオレンジだった。
   同じ行為は同じ色にする。深緑は白文字とのコントラストも 9.9:1 で余裕がある。 */
.woocommerce div.product form.cart .single_add_to_cart_button,
.woocommerce div.product form.cart button[type="submit"] {
  background: var(--aoyama-primary);
  color: #fff;
}
.woocommerce div.product form.cart .single_add_to_cart_button:hover,
.woocommerce div.product form.cart button[type="submit"]:hover {
  background: var(--aoyama-primary-dark, #0b3a20);
}

/* ---- 残っていた 1.4.3 不適合 ----
   実測で 4.5:1 に届かなかったものだけを個別に詰める。 */

/* 統計バーの数字。#f76700 は 16px でも 3.05:1 しかない */
.aoyama-stats__value { color: #c2410c; }

/* 淡色チップ・ラベルの文字。#6b7a70 は 4.04:1 */
.aoyama-chip--fresh-picked,
.aoyama-stats__label,
.aoyama-chip:not([class*="--popular"]):not([class*="--standard"]):not([class*="--gift"]) {
  color: #5c6b61;
}

/* パンくずのリンク。4.29:1 */
.ast-breadcrumbs a,
.ast-breadcrumbs .last { color: var(--aoyama-primary); }

/* ---- CTA セクションの QR 枠 ----
   右半分がまるごと空いていたので、そこへ公式アカウントの枠を入れる。
   本文が「LINE / WeChat の公式アカウントでも受け付けています」と言っている
   すぐ隣に QR が出るので、読んだその場で読み取れる。 */
.aoyama-home-cta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "copy   qr"
    "action qr";
  align-items: center;
  justify-content: initial;
}
.aoyama-home-cta > div { grid-area: copy; }
.aoyama-home-cta > p { grid-area: action; margin: 0; }
.aoyama-home-cta .aoyama-qr-panel {
  grid-area: qr;
  --qr-bg: rgba(255, 255, 255, .72);
  --qr-border: rgba(15, 77, 42, .16);
  --qr-title: var(--aoyama-primary);
  --qr-text: #4d6356;
  width: clamp(215px, 24vw, 265px);
}

@media (max-width: 900px) {
  .aoyama-home-cta {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "copy" "qr" "action";
    justify-items: start;
  }
  .aoyama-home-cta .aoyama-qr-panel { width: 100%; max-width: 330px; }
}

/* ---- 残りの 1.4.3 ---- */

/* 「4 つの約束」の連番。#f76700 は 12px で 2.91:1 */
.aoyama-promise-list li > span { color: #c2410c; }

/* CTA の見出し。背景が淡緑なので白地より比が落ち、#c2410c でも 4.41:1 */
.aoyama-home-cta .aoyama-eyebrow { color: #a33a0a; }

/* パンくず。Astra / WooCommerce いずれの実装でも #777 が出る */
.woocommerce-breadcrumb,
.ast-breadcrumbs-wrapper,
.ast-breadcrumbs .trail-items,
.woocommerce-breadcrumb a,
.ast-breadcrumbs-wrapper a,
.ast-breadcrumbs .trail-items a { color: #566b5c; }
.woocommerce-breadcrumb a,
.ast-breadcrumbs-wrapper a,
.ast-breadcrumbs .trail-items a { color: var(--aoyama-primary); }

/* PayPay のロゴは 1.4.3 の対象外（商標・ロゴは適用除外）なので触らない */

/* 濃緑ヒーロー(中国語ホーム)の見出しは淡い金のまま残す。
   .aoyama-home .aoyama-eyebrow が後から同じ詳細度で当たって
   濃いオレンジに置き換わり、濃緑の上で 2.33:1 まで落ちていた。 */
body:not(.home) .aoyama-home-hero .aoyama-eyebrow { color: #e6b871; }

/* パンくず。#777 は 4.29:1 で AA にわずかに届かない。
   Astra は動的 CSS を <head> のインラインで出しており、
   こちらの外部スタイルシートより後に評価される。詳細度を上げても
   勝てないので、ここだけ !important で上書きする。 */
body.woocommerce .woocommerce-breadcrumb { color: #566b5c !important; }
body.woocommerce .woocommerce-breadcrumb a { color: var(--aoyama-primary) !important; }

/* ---- アイコン(lucide) ----
   マークアップは 60-aoyama-icons.php。ミニプログラムと同じ字形。 */
.aoyama-submit{display:inline-flex;align-items:center;gap:8px}
/* カートに入れるボタン。ミニプログラムの ProductCard も ShoppingCart を添えている */
.woocommerce ul.products li.product .button,
.woocommerce div.product form.cart .button{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
}
.woocommerce ul.products li.product .button{display:flex}
/* 統計バーとクイックリンクは、アイコンと文言を中心で揃える */
.aoyama-stats__item,.aoyama-quicklinks__item{align-items:center}
