/* 각 고민의 글과 그림을 하나의 화면으로 넘긴다. 내부 사례 카드는 그대로 유지한다. */
/* 취향 소개와 고민 슬라이드의 배경을 분리한다. */
.story-section-band{background:#f0efec;border-top:1px solid #e5e4df;border-bottom:1px solid #e5e4df;}
.story-carousel{--soft:#fff;--muted:#6a6d67;--dark:#29302a;--on-dark:#fff;--line:#e5e6e1;--paper:#fff;--fg:#292e29;--fg-sub:#6a6d67;--fg-on-dark:#fff;--ok:#647256;--ok-line:#e0e4da;--bg-panel:#f6f7f4;max-width:1400px;margin:0 auto;padding:56px 5% 64px;color:#232a25;}
.story-carousel button{font:inherit;cursor:pointer;border:0;}
.story-carousel button:focus-visible,#story-slider:focus-visible{outline:3px solid #718461;outline-offset:3px;}
#story-slider{display:flex;align-items:flex-start;gap:24px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;border-radius:20px;}
#story-slider::-webkit-scrollbar{display:none;}
#story-slider>.landing-chapter{flex:0 0 100%;min-width:0;width:100%;margin:0;box-sizing:border-box;scroll-snap-align:start;scroll-snap-stop:always;padding:36px;min-height:530px;display:grid;align-content:center;background:var(--paper);color:var(--fg);border:1px solid var(--line);border-radius:20px;}
#story-slider .landing-story-grid{width:100%;max-width:none;grid-template-columns:1fr 1fr;gap:38px;align-items:center;}
#story-slider .choice-copy h2{font-size:clamp(1.8rem,3vw,2.75rem);}
#story-slider .choice-copy>p:not(.landing-eyebrow){font-size:.9375rem;line-height:1.8;}
#story-slider .choice-materials,#story-slider .choice-materials>img{min-height:310px;height:310px;}
#story-slider .choice-gallery{max-width:440px;}
#story-slider .choice-question{padding:12px;}
#story-slider .choice-question strong{font-size:.9375rem;}
#story-slider .comparison-layout{width:100%;max-width:none;display:flex;flex-direction:row-reverse;gap:36px;align-items:center;}
#story-slider .comparison-copy{text-align:left;max-width:none;flex:1;}
#story-slider .comparison-copy h2,#story-slider .landing-centered h2{font-size:clamp(1.8rem,3vw,2.75rem);}
#story-slider .comparison-scene{margin:0;}
#story-slider .comparison-visual{width:55%;}
#story-slider .comparison-scene>img{max-height:240px;object-fit:contain;}
#story-slider .comparison-captions h3{font-size:1rem;}
#story-slider .landing-blind{display:grid;grid-template-columns:1fr 1.1fr;gap:32px;align-items:center;}
#story-slider .landing-centered{width:100%;text-align:left;margin:0;}
#story-slider .landing-centered>p:not(.landing-eyebrow){font-size:.9375rem;line-height:1.8;}
#story-slider .landing-before-after{margin:0;width:100%;gap:14px;}
#story-slider .landing-receipt,#story-slider .landing-unknown{padding:24px;}
/* 흰 카드와 짙은 글자를 기본으로 하고 핵심에만 올리브를 쓴다. */
#story-slider .choice-copy h2,#story-slider .comparison-copy h2,#story-slider .landing-centered h2{color:var(--fg);}
#story-slider .choice-copy h2 em,#story-slider .comparison-copy h2 em,#story-slider .landing-centered h2 em{color:var(--ok);}
#story-slider .landing-eyebrow,#story-slider .choice-copy>p:not(.landing-eyebrow),#story-slider .comparison-copy>p:not(.landing-eyebrow),#story-slider .landing-centered>p:not(.landing-eyebrow){color:var(--fg-sub);}
#story-slider .choice-controls button{color:var(--fg);}
#story-slider .choice-selectors button span{background:var(--ok);}
#story-slider .choice-viewport .choice-slide{border-color:var(--paper);box-shadow:0 2px 0 #e5e6e1,0 12px 30px #292e2910;}
#story-slider .choice-question{background:var(--paper);border-color:var(--line);}
#story-slider .choice-materials figcaption{background:var(--paper);color:var(--fg);}
#story-slider .landing-receipt{background:var(--paper);border-color:var(--line);}
#story-slider .landing-receipt>div{border-color:var(--line);color:var(--fg-sub);}
#story-slider .landing-unknown{background:#f4f5f1;border-color:#d8ddd0;}
#story-slider .landing-unknown>span{color:#9aa38f;}
#story-slider .landing-unknown p{color:var(--fg-sub);}
#story-slider .comparison-scene{box-shadow:0 8px 24px #292e290a;border:1px solid var(--line);}
#story-slider .comparison-captions>div{background:#fafafa;}
#story-slider .comparison-captions>div+div{background:#f1f4ec;border-left:1px solid #e0e4da;}
#story-slider .comparison-captions>div+div span,#story-slider .comparison-captions>div+div h3,#story-slider .comparison-captions>div+div p{color:var(--fg);}
#story-slider .comparison-captions>div+div>span{color:var(--ok);}
@media(max-width:760px){
 .story-carousel{padding:32px 5% 40px;}
 #story-slider>.landing-chapter{padding:24px;min-height:0;}
 #story-slider .landing-story-grid{grid-template-columns:minmax(0,1fr);gap:24px;}
 #story-slider .choice-copy h2{font-size:1.75rem;}
 #story-slider .choice-copy h2 br:first-child{display:none;}
 #story-slider .choice-copy>p:not(.landing-eyebrow){font-size:.8125rem;line-height:1.65;}
 #story-slider .choice-viewport{padding:28px 8px 8px;}
 #story-slider .choice-materials,#story-slider .choice-materials>img{min-height:280px;height:280px;}
 #story-slider .choice-question{padding:9px;}
 #story-slider .choice-question strong{font-size:.75rem;}
 #story-slider .choice-image-note{display:none;}
 #story-slider .choice-materials figcaption{font-size:.6875rem;padding:10px;}
 #story-slider .comparison-layout{flex-direction:column-reverse;gap:22px;}
 #story-slider .comparison-visual{width:100%;}
 #story-slider .comparison-copy h2,#story-slider .landing-centered h2{font-size:1.75rem;}
 #story-slider .comparison-copy p,#story-slider .landing-centered>p:not(.landing-eyebrow){font-size:.8125rem;}
 #story-slider .comparison-scene>img{min-height:150px;object-fit:cover;}
 #story-slider .comparison-captions{gap:8px;}
 #story-slider .comparison-captions h3{font-size:.8125rem;}
 #story-slider .landing-blind{display:flex;flex-direction:column;justify-content:center;gap:28px;}
 #story-slider .landing-before-after{display:grid;grid-template-columns:1fr;gap:12px;}
 #story-slider .landing-receipt,#story-slider .landing-unknown{padding:18px;}
 #story-slider .landing-receipt strong{margin:10px 0 12px;}
 #story-slider .landing-receipt>div{padding:8px 0;font-size:.75rem;}
 #story-slider .landing-receipt small{margin-top:10px;font-size:.6875rem;}
 #story-slider .landing-unknown{min-height:100px;flex-direction:row;gap:16px;}
 #story-slider .landing-unknown>span{font-size:3.5rem;}
 #story-slider .landing-unknown p{font-size:.75rem;}
 #story-slider .comparison-answer{margin-top:16px;padding-top:12px;}
 #story-slider .comparison-captions p{font-size:.75rem;line-height:1.5;}

}
