/* Real product screens. No carousel, disclosure, or simulated controls. */
.product-stories { display:grid; gap:40px; margin:0 0 76px; }
.bld.product-story { display:block; padding:clamp(24px,4vw,52px); border:0; border-radius:28px; overflow:visible; box-shadow:none; transition:none; }
.story-sarah { background:#edf0e7 !important; }
.story-winbase { background:#f4eee8 !important; }
.story-voice { background:#e8eee9 !important; }
.story-head { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:end; margin-bottom:36px; }
.story-kicker { display:flex; align-items:center; flex-wrap:wrap; gap:10px 18px; margin:0 0 20px; }
.product-story .bld-name { font:600 14px/1.4 var(--font-body); color:var(--green-deep); }
.product-story .bld-tag { font:400 11px/1.5 var(--font-mono); text-transform:none; letter-spacing:0; color:#607064; }
.product-story h3 { font:600 clamp(32px,3.8vw,48px)/1.06 var(--font-display); letter-spacing:-.045em; text-wrap:balance; margin:0; max-width:16ch; }
.product-story .bld-desc { display:block; font:400 16px/1.65 var(--font-body); margin:0; max-width:46ch; color:var(--ink-soft); }
.story-link { display:inline-flex; gap:20px; align-items:center; min-height:44px; margin-top:12px; font-size:14px; font-weight:600; color:var(--green-deep); text-decoration:underline; text-underline-offset:5px; }
.story-link:hover { color:#096d53; }
.story-link:focus-visible { outline:2px solid var(--green-deep); outline-offset:5px; }
.story-phones { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(20px,3vw,36px); align-items:start; }
.product-story figure { margin:0; min-width:0; }
.story-phones figure { display:flex; flex-direction:column; }
.story-phones figcaption { min-height:120px; }
.story-number { display:block; font:500 10px/1.5 var(--font-mono); letter-spacing:.04em; color:#536a58; margin-bottom:10px; text-transform:uppercase; }
.product-story h4 { font:600 21px/1.2 var(--font-display); letter-spacing:-.025em; margin:0 0 10px; }
.product-story figcaption p, .story-extra p, .voice-story-steps p { font-size:14px; line-height:1.6; color:var(--ink-soft); margin:0; text-wrap:pretty; }
.phone-screen { background:#fff; padding:7px; border:1px solid #d3d9ce; border-radius:20px; box-shadow:0 14px 32px -25px #283d3460; overflow:hidden; max-width:350px; }
.phone-screen img { display:block; width:100%; height:auto; border-radius:13px; }
.story-phones .phone-screen { width:100%; }
.story-extra { margin-top:44px; padding-top:36px; border-top:1px solid #cdd6c8; display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(28px,5vw,76px); align-items:center; }
.groove-screen { max-width:280px; justify-self:center; }
.groove-screen img { display:block; width:100%; height:auto; border-radius:16px; border:1px solid #d5dccc; }
.groove-screen figcaption, .voice-story-screen figcaption { margin-top:12px; font:400 11px/1.6 var(--font-mono); color:#5e6d60; }
.story-extra h4 { font-size:clamp(26px,3vw,38px); line-height:1.12; margin-bottom:18px; }
.story-extra p { max-width:38ch; font-size:16px; }
.story-extra .story-close { margin-top:24px; font-size:15px; font-weight:600; color:var(--ink); }
.story-extra .lesson-tracks { font:400 12px/1.8 var(--font-mono); margin-top:10px; color:#61705e; }
.product-story .story-source { font:400 11px/1.6 var(--font-mono); color:#687469; margin:28px 0 0; }
.story-sequence { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); list-style:none; padding:20px 0; margin:0 0 32px; gap:24px; border-top:1px solid #dbd5cd; border-bottom:1px solid #dbd5cd; counter-reset:story; }
.story-sequence li { counter-increment:story; padding-left:26px; position:relative; }
.story-sequence li::before { content:counter(story); position:absolute; left:0; top:0; color:#9f543e; font:500 12px/1.7 var(--font-mono); }
.story-sequence b { display:block; font-size:14px; margin-bottom:5px; }
.story-sequence span { font-size:13px; line-height:1.5; color:var(--ink-soft); display:block; }
.story-documents { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.story-documents figcaption { margin-bottom:20px; }
.document-screen { background:#fff; border:1px solid #ded8d0; border-radius:14px; overflow:hidden; padding:8px; }
.document-screen img { display:block; width:100%; height:auto; }
.story-winbase .bld-more { margin-top:24px; border-color:#dbd5cd; }
.story-winbase .bld-more-in { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.story-winbase .bld-more-in > p { font-size:13px; line-height:1.65; }
.voice-evidence { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(28px,5vw,64px); align-items:start; }
.voice-library { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(28px,5vw,64px); align-items:center; margin:0 0 40px; padding:8px 0 36px; border-bottom:1px solid #c5d3c9; }
.voice-library h4 { font-size:clamp(26px,3vw,34px); max-width:15ch; }
.voice-library p { font-size:15px; line-height:1.65; color:var(--ink-soft); max-width:38ch; margin:14px 0 0; }
.voice-library .voice-library-next { font-size:14px; }
.voice-library figcaption { max-width:430px; margin:12px auto 0; font:400 11px/1.6 var(--font-mono); color:#687469; }
.voice-evidence figcaption { min-height:116px; }
.voice-capture { max-width:430px; margin:auto; border:1px solid #cbd7cf; padding:6px; border-radius:22px; background:#f8f7f0; overflow:hidden; box-shadow:0 18px 32px -26px #283d3460; }
.voice-capture img { display:block; width:100%; height:auto; border-radius:16px; }
.voice-insight { border-top:1px solid #c5d3c9; margin-top:24px; padding-top:20px; }
.voice-insight h4 { font-size:20px; }
.voice-insight p { font-size:14px; line-height:1.65; color:var(--ink-soft); margin:0; max-width:48ch; }
@media(max-width:900px) {
 .story-head { grid-template-columns:1fr; gap:22px; }
 .story-phones { gap:18px; }
 .story-phones figcaption { min-height:144px; }
 .product-story h4 { font-size:19px; }
 .story-winbase .bld-more-in { grid-template-columns:1fr; }
}
@media(max-width:650px) {
 .product-stories { gap:24px; margin-bottom:56px; }
 .bld.product-story { padding:26px 20px; border-radius:20px; }
 .product-story h3 { font-size:34px; }
 .story-head { margin-bottom:32px; }
 .story-kicker { display:block; margin-bottom:16px; }
 .story-kicker .bld-tag { display:block; margin-top:5px; }
 .story-phones, .story-documents, .bld.story-voice { grid-template-columns:minmax(0,1fr); gap:36px; }
 .story-phones figcaption { min-height:0; margin-bottom:18px; }
 .story-phones .phone-screen { margin:auto; }
 .product-story h4 { font-size:22px; }
 .story-extra { grid-template-columns:minmax(0,1fr); gap:24px; margin-top:36px; padding-top:28px; }
 .story-extra > div { grid-row:1; }
 .story-extra h4 { font-size:30px; }
 .groove-screen { width:100%; max-width:300px; }
 .story-sequence { grid-template-columns:1fr; gap:18px; }
 .story-sequence li { padding-left:28px; }
 .story-documents figcaption { margin-bottom:16px; }
 .voice-evidence { grid-template-columns:minmax(0,1fr); gap:36px; }
 .voice-library { grid-template-columns:minmax(0,1fr); gap:24px; margin-bottom:32px; padding-bottom:30px; }
 .voice-evidence figcaption { min-height:0; margin-bottom:20px; }
}
.bld.story-dharma { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(28px,5vw,64px); align-items:center; background:#f0eee6; margin-bottom:28px; }
.story-dharma .bld-desc { margin-top:22px; }
.dharma-question { margin-top:30px; }
.dharma-question h4 { font-size:24px; line-height:1.3; }
.dharma-question p { font-size:14px; line-height:1.65; color:var(--ink-soft); margin:0; }
.story-dharma figure :is(img, video) { display:block; width:100%; height:auto; border:10px solid #080907; border-radius:18px; }
.story-dharma figcaption { font:400 11px/1.6 var(--font-mono); color:#687469; margin-top:12px; }
.bld-theme[data-theme="rag"] .bld-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media(max-width:700px) {
 .bld.story-dharma { grid-template-columns:minmax(0,1fr); }
 .story-dharma figure :is(img, video) { border-width:5px; border-radius:14px; }
 .dharma-question h4 { font-size:23px; }
}
@media(max-width:560px) { .bld-theme[data-theme="rag"] .bld-grid { grid-template-columns:minmax(0,1fr); } }