/* Only the two approved introduction blocks. No shared theme rules. */
#kaede-premium-intro-menu,
#kaede-premium-intro-beauty {
  box-sizing: border-box;
  clear: both;
  min-width: 0;
}
#kaede-premium-intro-menu *,
#kaede-premium-intro-beauty * { box-sizing: border-box; }
#kaede-premium-intro-menu {
  width: min(1100px, 92%);
  max-width: 100%;
  margin: 0 auto 48px;
  padding: 0;
}
#kaede-premium-intro-beauty {
  margin-left: auto;
  margin-right: auto;
}
#kaede-premium-intro-menu .kpi-box,
#kaede-premium-intro-beauty .kpi-box {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-areas: "eyebrow image" "title image" "copy image" "link image";
  column-gap: 26px;
  align-items: start;
  width: 100%;
  min-width: 0;
  margin: 0 auto;
  padding: 32px 34px;
  border: 1px solid #b69a65;
  background: #f8f5ee;
  color: #363a32;
  font: 400 16px/1.85 var(--kaede-sans, 'Noto Sans JP', 'Yu Gothic', Meiryo, sans-serif);
}
#kaede-premium-intro-menu .kpi-eyebrow,
#kaede-premium-intro-beauty .kpi-eyebrow {
  grid-area: eyebrow;
  padding: 0;
  margin: 0 0 11px;
  font: 400 11px/1.6 var(--kaede-sans, 'Noto Sans JP', sans-serif) !important;
  letter-spacing: .12em;
  color: #8c754b;
  text-align: left;
}
#kaede-premium-intro-menu .kpi-title,
#kaede-premium-intro-beauty .kpi-title {
  grid-area: title;
  display: block;
  width: auto;
  padding: 0;
  margin: 0 0 14px;
  color: #363a32;
  font: 500 24px/1.6 var(--kaede-serif, 'Noto Serif JP', 'Yu Mincho', serif) !important;
  text-align: left !important;
  letter-spacing: .025em;
}
#kaede-premium-intro-menu .kpi-image,
#kaede-premium-intro-beauty .kpi-image {
  grid-area: image;
  align-self: center;
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  object-fit: contain;
}
#kaede-premium-intro-menu .kpi-copy,
#kaede-premium-intro-beauty .kpi-copy { grid-area: copy; min-width: 0; }
#kaede-premium-intro-menu .kpi-copy p,
#kaede-premium-intro-beauty .kpi-copy p {
  margin: 0 0 18px;
  padding: 0;
  font: 400 16px/1.85 var(--kaede-sans, 'Noto Sans JP', 'Yu Gothic', Meiryo, sans-serif) !important;
  color: #363a32;
  text-align: left;
}
#kaede-premium-intro-menu a.kpi-link,
#kaede-premium-intro-beauty a.kpi-link {
  grid-area: link;
  justify-self: start;
  display: inline-block;
  width: auto;
  max-width: 100%;
  min-height: 44px;
  padding: 12px 14px;
  margin: 0;
  border: 1px solid #b69a65;
  border-radius: 0;
  background: #292e2b;
  color: #f8f5ee;
  font: 400 14px/1.8 var(--kaede-sans, 'Noto Sans JP', 'Yu Gothic', Meiryo, sans-serif) !important;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  overflow-wrap: anywhere;
}
#kaede-premium-intro-beauty .kpi-box {
  background: #292e2b;
  color: #d5bf93;
  padding: 35px 38px;
}
#kaede-premium-intro-beauty .kpi-eyebrow {
  font-size: 15px !important;
  letter-spacing: normal;
  color: #d5bf93 !important;
  margin-bottom: 14px;
}
#kaede-premium-intro-beauty .kpi-title {
  color: #f8f5ee !important;
  font-size: 29px !important;
}
#kaede-premium-intro-beauty .kpi-copy p { color: #d5bf93 !important; }
#kaede-premium-intro-beauty a.kpi-link {
  background: #d5bf93 !important;
  color: #000 !important;
  border-color: #d5bf93;
  padding: 12px 20px;
}
#kaede-premium-intro-menu a.kpi-link:focus-visible,
#kaede-premium-intro-beauty a.kpi-link:focus-visible { outline: 3px solid #b69a65; outline-offset: 4px; }
@media (max-width: 767px) {
  #kaede-premium-intro-menu { margin-bottom: 32px; }
  #kaede-premium-intro-menu .kpi-box,
  #kaede-premium-intro-beauty .kpi-box {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "eyebrow" "title" "image" "copy" "link";
    column-gap: 0;
    padding: 26px 22px;
  }
  #kaede-premium-intro-beauty .kpi-box { padding: 27px 23px; }
  #kaede-premium-intro-beauty .kpi-title { font-size: 25px !important; }
  #kaede-premium-intro-menu .kpi-image,
  #kaede-premium-intro-beauty .kpi-image { margin: 2px 0 22px; }
  #kaede-premium-intro-menu a.kpi-link,
  #kaede-premium-intro-beauty a.kpi-link { width: 100%; justify-self: stretch; padding: 12px 10px; }
}
