/* Give the story the whole chapter; type follows the former menu introduction. */
.concept{width:100vw}
.concept-layout{position:absolute;left:max(6%,90px);right:5%;top:28px;height:calc(var(--content-h) - 56px);display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:5vw}
.concept .concept-artwork{position:relative;left:auto;top:auto;right:auto;width:100%;height:100%;border-radius:48% 48% 6px 6px / 24% 24% 6px 6px;overflow:hidden;min-height:0}
.concept .concept-slides,.concept .concept-shade{clip-path:none;border-radius:inherit}
.concept .concept-slides{background:#9d9c85}
.concept .concept-slide{position:absolute;inset:0;display:block;background-position:center;background-repeat:no-repeat;background-size:cover;opacity:0;transition:opacity 1.4s ease}
.concept .concept-slide.is-active{opacity:1}
.concept .concept-shade{background:linear-gradient(180deg,#29221920,transparent 35%,#2922190a 55%,#292219ae)}
.concept .concept-lamp{left:50%;translate:-50% 0;right:auto;top:-16px;width:76px;height:122px;z-index:2}
.concept-cover-title{position:absolute;left:9%;right:7%;bottom:7%;color:var(--cream)}
.concept-cover-title>p{font:500 9px/1.6 Arial,sans-serif;letter-spacing:.14em;margin-bottom:10px}
.concept-cover-title h2{font:400 clamp(40px,4.5vw,68px)/1.1 Arial,sans-serif;letter-spacing:-.045em}
.concept-cover-cue{display:none}
.concept-story{min-width:0;min-height:0;display:flex;flex-direction:column;justify-content:space-between;gap:22px;padding:6px 5px 9px 0;overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:thin;color:var(--green)}
.concept-chapter{flex:none;min-width:0}
.concept-chapter h3{font-size:clamp(19px,2vw,30px);line-height:1.5;letter-spacing:-.04em;font-weight:500;margin:0 0 14px}
.concept-chapter p{font-size:clamp(12px,1.35vw,20px);line-height:1.8;letter-spacing:-.035em;margin:0;overflow-wrap:anywhere}
.concept-chapter p+p{margin-top:13px}
@media(min-width:768px) and (max-height:780px){
 .concept-layout{top:22px;height:calc(var(--content-h) - 44px);gap:4vw}
 .concept-story{gap:14px;padding-top:2px;padding-bottom:5px}
 .concept-chapter h3{margin-bottom:9px}
 .concept-chapter p+p{margin-top:9px}
}
@media(max-width:767px){
 .concept{width:200vw}
 .concept-layout{left:0;right:auto;top:0;width:200vw;height:var(--content-h);grid-template-columns:100vw 100vw;gap:0;align-items:start}
 .concept .concept-artwork{width:calc(100vw - 40px);height:calc(var(--content-h) - 40px);margin:20px;border-radius:48% 48% 5px 5px / 21% 21% 5px 5px}
 .concept .concept-lamp{width:63px;height:105px;top:-14px}
 .concept-cover-title{bottom:7%;left:9%;right:8%}
 .concept-cover-title>p{font-size:8px;margin-bottom:12px;letter-spacing:.08em}
 .concept-cover-title h2{font-size:clamp(35px,11vw,49px);letter-spacing:-.04em}
 .concept-cover-cue{display:block;font-size:11px;line-height:1.8;letter-spacing:.04em;margin-top:22px}
 .concept-story{margin:72px 20px 20px;height:calc(var(--content-h) - 92px);width:calc(100vw - 40px);padding:14px 6px 18px 0;gap:27px;justify-content:flex-start}
 .concept-chapter h3{font-size:21px;line-height:1.55;letter-spacing:-.045em;margin-bottom:15px}
 .concept-chapter p{font-size:16px;line-height:1.9;letter-spacing:-.035em}
 .concept-chapter p+p{margin-top:13px}
}

/* Keep the story in a centered reading area with space around it. */
@media(min-width:768px){
 .concept-story{width:min(100%,650px);height:auto;max-height:100%;align-self:center;justify-self:center;justify-content:safe center;gap:22px;padding:30px clamp(12px,1.6vw,28px)}
}
@media(min-width:768px) and (max-height:780px){
 .concept-story{gap:18px;padding-top:24px;padding-bottom:24px}
}
@media(max-width:767px){
 .concept-story{margin:84px 30px 30px;width:calc(100vw - 60px);height:calc(var(--content-h) - 114px);padding:20px 2px;gap:29px;justify-content:safe center}
}

@media(min-width:768px){
 .concept-story .concept-chapter h3{margin-bottom:10px;line-height:1.4}
 .concept-story .concept-chapter p{line-height:1.65}
 .concept-story .concept-chapter p+p{margin-top:8px}
}
