/* A dedicated, responsive vertical HERO. All sizes are component-scoped. */
.kvds-vhero {
  box-sizing:border-box !important;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:auto minmax(0,1fr);
  width:100%; max-width:100%; min-width:0;
  margin:var(--kvds-vhero-margin-top,0px) 0 var(--kvds-vhero-margin-bottom,24px);
  border:var(--kvds-vhero-border,1px) solid var(--kvds-vhero-border-color,#e5e5dd);
  border-radius:var(--kvds-vhero-radius,16px);
  overflow:hidden;
  background:var(--kvds-vhero-bg,#faf7f1);
  color:var(--kvds-vhero-color,#344b44);
  text-align:left;
  isolation:isolate;
}
.kvds-vhero--shadow {box-shadow:0 9px 27px rgba(36,75,59,.09);}
.kvds-vhero__media {
  position:relative; display:block; box-sizing:border-box; width:100%; min-width:0;
  height:var(--kvds-vhero-photo-height,260px);
  /* grid row deliberately fixed; content can grow without cropping its text. */
  overflow:hidden; margin:0; padding:0;
  background:#dce5d7;
}
.kvds-vhero__media img {display:block!important;width:100%!important;height:100%!important;max-width:100%!important;min-height:0!important;object-fit:cover!important;object-position:var(--kvds-vhero-x,50%) var(--kvds-vhero-y,50%)!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;}
.kvds-vhero__image-placeholder {height:100%;display:flex;align-items:center;justify-content:center;color:#47664d;font-size:14px;}
.kvds-vhero__content {
  display:flex;flex-direction:column;box-sizing:border-box;min-width:0;width:100%;max-width:100%;
  min-height:var(--kvds-vhero-text-min,260px);
  padding:var(--kvds-vhero-pad,24px);
  gap:0;
  background:var(--kvds-vhero-bg,#faf7f1);
  color:var(--kvds-vhero-color,#344b44);
}
.kvds-vhero--align-center .kvds-vhero__content {text-align:center;}
.kvds-vhero--align-right .kvds-vhero__content {text-align:right;}
.kvds-vhero__label {display:block;margin:0 0 10px;color:var(--kvds-vhero-label,#7c927b);font-size:12px;font-weight:700;letter-spacing:.1em;line-height:1.4;}
.kvds-vhero__title,
.entry-content .kvds-vhero__title,
.article .kvds-vhero__title {
  display:block;box-sizing:border-box;margin:0 0 12px!important;padding:0!important;
  color:var(--kvds-vhero-title,#283c31)!important;
  font-size:var(--kvds-vhero-title-size,26px)!important;
  font-weight:var(--kvds-vhero-title-weight,700)!important;
  line-height:1.45!important;letter-spacing:normal;
  border:0!important;background:none!important;box-shadow:none!important;
}
.kvds-vhero__title--serif {font-family:'Noto Serif JP','Noto Serif CJK JP',YuMincho,'Yu Mincho',serif!important;}
.kvds-vhero__title--sans {font-family:'Noto Sans JP','Noto Sans CJK JP',Meiryo,sans-serif!important;}
.kvds-vhero__title--inherit {font-family:inherit!important;}
.kvds-vhero__body {min-width:0;width:100%;max-width:100%;box-sizing:border-box;flex:0 1 auto;color:inherit;font-size:var(--kvds-vhero-body-size,15px);line-height:var(--kvds-vhero-body-line,1.8);overflow-wrap:anywhere;}
.kvds-vhero__body > :first-child {margin-top:0!important;}
.kvds-vhero__body > :last-child {margin-bottom:0!important;}
.kvds-vhero__body p {font-size:inherit;line-height:inherit;color:inherit;}
.kvds-vhero__button-wrap {display:flex;min-width:0;width:100%;max-width:100%;box-sizing:border-box;margin-top:auto;padding-top:18px;}
.kvds-vhero--button-left .kvds-vhero__button-wrap {justify-content:flex-start;}
.kvds-vhero--button-center .kvds-vhero__button-wrap {justify-content:center;}
.kvds-vhero--button-right .kvds-vhero__button-wrap {justify-content:flex-end;}
.kvds-vhero__button {
  box-sizing:border-box!important;min-width:0;max-width:min(100%,var(--kvds-vhero-button-max,100%))!important;
  display:inline-flex;align-items:center;justify-content:center;gap:.55em;
  text-align:center;text-decoration:none!important;
  padding:var(--kvds-vhero-button-pad-v,13px) var(--kvds-vhero-button-pad-h,16px);
  background:var(--kvds-vhero-button-bg,#347a58)!important;
  color:var(--kvds-vhero-button-text,#fff)!important;
  border:var(--kvds-vhero-button-border-width,1px) solid var(--kvds-vhero-button-border,#347a58)!important;
  border-radius:var(--kvds-vhero-button-radius,8px)!important;
  font-size:var(--kvds-vhero-button-size,16px)!important;
  font-weight:700;line-height:1.4;overflow-wrap:anywhere;word-break:normal;
}
.kvds-vhero--button-full .kvds-vhero__button {width:100%!important;}
.kvds-vhero__button--missing {opacity:.62;cursor:default;}
.kvds-vhero__button:hover:not(.kvds-vhero__button--missing) {filter:brightness(.96);transform:translateY(-1px);}
@media (max-width:767px) {
  .kvds-vhero__media {height:var(--kvds-vhero-photo-height-mobile,240px);}
  .kvds-vhero__content {min-height:var(--kvds-vhero-text-min-mobile,240px);padding:var(--kvds-vhero-pad-mobile,20px);}
  .kvds-vhero__title,.entry-content .kvds-vhero__title,.article .kvds-vhero__title {font-size:var(--kvds-vhero-title-size-mobile,23px)!important;}
  .kvds-vhero__body {font-size:var(--kvds-vhero-body-size-mobile,15px);}
  .kvds-vhero__button {font-size:var(--kvds-vhero-button-size-mobile,15px)!important;}
}
/* Exact device previews use the same responsive values, independent of iframe width. */
:is(.kvds-preview-device-mobile,.kvds-preview-device-tablet) .kvds-vhero__media {height:var(--kvds-vhero-photo-height-mobile,240px);}
:is(.kvds-preview-device-mobile,.kvds-preview-device-tablet) .kvds-vhero__content {min-height:var(--kvds-vhero-text-min-mobile,240px);padding:var(--kvds-vhero-pad-mobile,20px);}
:is(.kvds-preview-device-mobile,.kvds-preview-device-tablet) .kvds-vhero__title {font-size:var(--kvds-vhero-title-size-mobile,23px)!important;}
:is(.kvds-preview-device-mobile,.kvds-preview-device-tablet) .kvds-vhero__body {font-size:var(--kvds-vhero-body-size-mobile,15px);}
:is(.kvds-preview-device-mobile,.kvds-preview-device-tablet) .kvds-vhero__button {font-size:var(--kvds-vhero-button-size-mobile,15px)!important;}
/* Preserve existing vertical box cards: the old rule used width:100% PLUS
   horizontal margins, which necessarily overflowed the available flex width. */
.kvds-box.kvds-ext-card-vertical-hero > .kvds-box__panel > :is(.kvds-action-button-wrap,.kvds-text-links) {
  box-sizing:border-box!important;
  width:auto!important;
  min-width:0!important;
  max-width:calc(100% - var(--kvds-vertical-hero-effective-padding,24px) - var(--kvds-vertical-hero-effective-padding,24px))!important;
  align-self:stretch;
}
.kvds-box.kvds-ext-card-vertical-hero .kvds-action-button {
  box-sizing:border-box!important;
  min-width:0!important;
  max-width:100%!important;
}
.kvds-box.kvds-ext-card-vertical-hero .kvds-action-button-wrap--full .kvds-action-button {width:100%!important;}
