/* HERO reference: https://beyondgym.net/kurume/ (2026-09-24).
   Original reference SVG artwork; Hakata copy and photography retained. */
.hk-reference-hero{position:relative;overflow:hidden;background:#062233 url('../images/hero-reference/bg-mv-lp2.jpg') center/cover;color:#fff}
.hk-reference-head{padding:15px 15px 0}
.hk-reference-head h1{margin:0;font-size:16px;font-weight:500;line-height:1.5}
.hk-reference-eyebrow{display:block;font-size:12px;margin-bottom:10px}
.hk-reference-brand{display:flex;align-items:center;gap:15px}
.hk-reference-brand img{display:block;width:180px;height:auto}
.hk-reference-main{position:relative;margin-top:40px}
.hk-reference-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 30px;max-width:1140px;margin:0 auto 20px;padding:0 15px;align-items:start}
.hk-reference-copy{min-width:0}
.hk-reference-heading{display:block;width:100%;height:auto;margin:0 0 20px}
.hk-reference-badges{display:flex;gap:30px;list-style:none;padding:0;margin:0 0 20px;justify-content:center}
.hk-reference-badges li{flex:1;min-width:0;max-width:190px}
.hk-reference-badges img{display:block;width:100%;height:auto}
.hk-reference-fine{font-size:12px;line-height:1.5;margin:0 0 20px;color:white}
.hk-reference-visual{grid-column:2;grid-row:1;min-width:0}
.hk-reference-photo{display:block;width:100%;height:auto;aspect-ratio:645/620;object-fit:cover;object-position:center 34%}
.hk-reference-trial{position:absolute;right:15px;top:67.5%;width:calc(50% - 30px);height:31%;display:flex;background:#fff;clip-path:polygon(10% 0,100% 0,100% 100%,0 100%);border-top:5px solid #63b7c8;border-bottom:5px solid #63b7c8;overflow:hidden;color:#172c37}
.hk-reference-trial-copy{position:relative;z-index:1;width:60%;padding:9px 0 4px 9%;display:flex;flex-direction:column;align-items:center;white-space:nowrap}
.hk-reference-trial-title{font-size:clamp(18px,2vw,27px);line-height:1.4}
.hk-reference-trial strong{display:block;background:#e85359;color:#fff;font-size:clamp(22px,2.7vw,36px);font-weight:500;line-height:1.5;padding:0 13px;margin:6px 0 2px;transform:skew(-10deg)}
.hk-reference-trial small{font-size:14px}.hk-reference-trial del{color:#dc555c}
.hk-reference-trial>img{width:40%;height:100%;object-fit:cover;object-position:center 38%}
.hk-reference-side{position:absolute;right:15px;top:50%;transform:translateY(-50%);writing-mode:vertical-rl;font:12px Arial,sans-serif;letter-spacing:2px;margin:0}
.hk-reference-side::before,.hk-reference-side::after{content:'';position:absolute;left:50%;width:1px;height:20px;background:#fff}
.hk-reference-side::before{top:-30px}.hk-reference-side::after{bottom:-30px}
.hk-reference-scroll{display:block;width:60.5px;margin:auto}.hk-reference-scroll img{display:block;width:100%;height:auto}
.hk-reference-diagonal{display:block;width:100%;height:auto}
@media(min-width:1400px){.hk-reference-grid{max-width:1320px}}
@media(max-width:1199px){.hk-reference-grid{max-width:960px}.hk-reference-side{display:none}}
@media(max-width:991px){
 .hk-reference-grid{max-width:720px;grid-template-columns:minmax(0,1fr);gap:0;padding:0 15px}
 .hk-reference-visual{grid-column:1;grid-row:1;margin-bottom:20px}
 .hk-reference-photo{aspect-ratio:750/420;object-position:center 34%}
 .hk-reference-copy{grid-column:1;grid-row:2}
 .hk-reference-trial{position:relative;grid-column:1;grid-row:3;top:auto;right:auto;width:calc(100% + 30px);margin:0 -15px;height:190px}
 .hk-reference-trial-title{font-size:27px}.hk-reference-trial strong{font-size:36px}
 .hk-reference-scroll{display:none}
}
@media(max-width:767px){.hk-reference-grid{max-width:540px}.hk-reference-main{margin-top:20px}}
@media(max-width:575px){
 .hk-reference-grid{max-width:100%}.hk-reference-badges{gap:30px}
 .hk-reference-head{padding-top:15px}.hk-reference-fine{font-size:12px}
 .hk-reference-trial{height:132px}.hk-reference-trial-title{font-size:19px}.hk-reference-trial strong{font-size:25px;padding:0 8px;margin-top:5px}.hk-reference-trial small{font-size:10px}
}
@media(max-width:991px){.hk-reference-photo{object-position:center top}}