/* features-hux-14.css — 写真とキャッチを横並びにした帯バナー。旧 features-th23 の置き換え。
 * 旧版は高さ 140px に潰れ、背景写真が切れてテキストが写真に被っていた。
 * 対策: 帯の高さを内容で決めさせ、写真は器を aspect-ratio で確定。重ねない。 */
.features-hux-14 .mx-auto{margin-inline:auto}
.features-hux-14 .max-w-7xl{max-width:80rem}
.features-hux-14 .px-4{padding-inline:1rem}
.features-hux-14 .py-8{padding-block:2rem}

.features-hux-14 .hux14-band{display:grid;grid-template-columns:1fr;gap:0;border-radius:.75rem;overflow:hidden;background:var(--color-surface,var(--color-bg))}
.features-hux-14 .hux14-media{margin:0;aspect-ratio:16/9;max-height:460px;overflow:hidden}
.features-hux-14 .hux14-media img{display:block;width:100%;height:100%;object-fit:cover}
.features-hux-14 .hux14-body{padding:1.75rem 1.25rem}
.features-hux-14 .hux14-title{margin:0 0 .6em;line-height:1.35;text-wrap:balance}
.features-hux-14 .hux14-text{margin:0 0 1.5rem}
.features-hux-14 .hux14-more{margin:0}
.features-hux-14 .hux-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.7em 2.2em;border-radius:999px;background:var(--color-primary);color:var(--color-on-primary);text-decoration:none;font-weight:600}
.features-hux-14 .hux-btn:hover{opacity:.88}

@media (min-width:768px){
  .features-hux-14 .px-4{padding-inline:1.5rem}
  .features-hux-14 .hux14-band{grid-template-columns:minmax(0,42fr) minmax(0,58fr);align-items:center}
  .features-hux-14 .hux14-media{aspect-ratio:1/1;height:100%}
  .features-hux-14 .hux14-body{padding:2.25rem 2rem}
}
@media (min-width:1024px){
  .features-hux-14 .px-4{padding-inline:2rem}
  .features-hux-14 .hux14-media{aspect-ratio:4/3}
  .features-hux-14 .hux14-body{padding:3rem 2.75rem}
}