/* Large product scene and reference-led patient experience composition. */
.header nav{margin-left:auto}.header .language{margin-left:44px}
.onboarding li{padding-left:0}.onboarding h3{margin-top:0}
.report-showcase{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:64px;padding:56px 7%;border-radius:24px;background:#edf2f5;overflow:hidden}
.phone-stage{display:flex;justify-content:center;align-items:center;padding:6px 0 20px}
.report-phone{position:relative;width:min(100%,330px);padding:10px 9px 16px;background:#202329;border:2px solid #83888e;border-radius:46px;box-shadow:0 32px 44px -24px #273b4d66,0 0 0 3px #d5d9dc;flex-shrink:0}
.report-phone::before,.report-phone::after{content:'';position:absolute;left:-5px;top:110px;height:44px;width:3px;background:#727a82;border-radius:2px}.report-phone::after{top:166px;height:60px}
.phone-hardware{height:27px;display:flex;justify-content:center;align-items:flex-start;gap:8px}.phone-hardware span{height:5px;width:44px;background:#080a0c;border-radius:8px;margin-top:5px}.phone-hardware i{width:8px;height:8px;border:2px solid #343e4b;background:#0a0d12;border-radius:50%;margin-top:3px}
.phone-screen{aspect-ratio:1500/3248;overflow:hidden;border-radius:5px 5px 28px 28px;background:white;touch-action:pan-y}
.phone-track{display:flex;width:100%;height:100%;transition:transform .65s cubic-bezier(.16,1,.3,1);will-change:transform}
.phone-slide{width:100%;height:100%;flex:0 0 100%;background:white}.phone-slide img{display:block;width:100%;height:100%;object-fit:contain;object-position:top;border-radius:0}
.phone-home{position:absolute;bottom:5px;left:36%;width:28%;height:4px;background:#a7adb4;border-radius:5px}
.report-story{max-width:480px}.report-story h3{font-size:clamp(28px,2.7vw,39px);line-height:1.3;letter-spacing:-.03em}.report-story-intro{font-size:16px;line-height:1.8;margin:20px 0 28px;color:#586875}
.report-slide-selectors{border-top:1px solid #cbd4da}.report-slide-select{display:flex;align-items:flex-start;gap:16px;text-align:left;width:100%;background:none;color:#53616b;border:0;border-bottom:1px solid #cbd4da;padding:22px 0;cursor:pointer}.report-slide-select>span:last-child{display:block}.report-slide-select strong{font-size:21px;font-weight:500;line-height:1.4;display:block}.slide-description{display:block;font-size:15px;line-height:1.75;margin-top:10px}.slide-indicator{width:7px;height:7px;border-radius:50%;border:1px solid #9da9b1;margin-top:12px;flex-shrink:0}.report-slide-select.is-active{color:#173d68}.report-slide-select.is-active strong{color:var(--accent)}.report-slide-select.is-active .slide-indicator{background:var(--accent);border-color:var(--accent)}.report-slide-select:hover{color:var(--accent-hover)}.report-slide-select:focus-visible{outline-offset:4px}
.report-zoom{margin-top:24px;border-color:#b7c4cd;color:#253f54;background:transparent}.report-story .report-sample{color:#596b77;margin-top:20px;font-size:12px}
.patient-experience{display:grid;grid-template-columns:.95fr 1.2fr;gap:60px;background:#f2f2f2;border-radius:24px;padding:60px;margin-top:100px;align-items:stretch}
.experience-intro{display:flex;flex-direction:column;align-items:flex-start}.experience-intro h3{font-size:clamp(30px,3vw,42px);font-weight:500;line-height:1.3;letter-spacing:-.035em}.experience-intro>p{font-size:17px;line-height:1.8;margin-top:24px;color:#535c60}.ontol-reader{width:100%;display:flex;justify-content:center;margin:auto 0 0;padding-top:32px}.ontol-reader img{width:min(100%,300px);height:auto;max-height:430px;object-fit:contain;transform-origin:50% 90%;animation:ontol-reading 6s ease-in-out infinite}
@keyframes ontol-reading{0%,100%{transform:rotate(-1deg) translateY(0)}35%{transform:rotate(1.4deg) translateY(3px)}65%{transform:rotate(-.5deg) translateY(1px)}}
.experience-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px}.experience-cards article{display:flex;flex-direction:column;position:relative;min-height:310px;background:white;border-radius:18px;padding:32px 28px}.experience-cards h4{font-size:24px;font-weight:500;line-height:1.4;letter-spacing:-.025em;padding-right:12px;max-width:13ch}.experience-cards p{margin-top:auto;padding-top:44px;font-size:15px;line-height:1.8;color:#515c65}.card-corner{position:absolute;right:24px;top:28px;width:12px;height:12px;background:var(--accent);clip-path:polygon(0 0,100% 0,100% 100%)}.experience-cards article:nth-child(2) .card-corner{background:var(--accent)}.experience-cards article:nth-child(3) .card-corner{background:var(--accent)}.experience-cards article:nth-child(4) .card-corner{background:var(--accent)}
.transition-section h2{max-width:850px}.transition-section h2 br:first-child{display:block}.transition-section>div>p{margin-bottom:24px}
@media(min-width:1600px){.report-showcase{padding-inline:12%}}
@media(max-width:1100px){.brand,.header .brand{width:auto}.brand img,.header .brand img{width:132px}.brand-extension{font-size:17px}.header .language{margin-left:18px}.report-showcase{padding:44px;gap:40px}.report-phone{width:300px}.patient-experience{padding:40px;gap:36px;grid-template-columns:.8fr 1.2fr}.experience-cards article{padding:28px 22px;min-height:300px}.experience-cards h4{font-size:22px}.card-corner{right:18px;top:25px}.experience-intro h3{font-size:34px}}
@media(max-width:900px){.brand,.header .brand{width:auto;gap:10px}.brand-extension{font-size:17px;margin:0;padding-top:7px}.header .language{margin-left:0}.report-showcase{grid-template-columns:.9fr 1fr;gap:28px;padding:36px 28px}.report-phone{width:260px;border-radius:38px}.report-story h3{font-size:29px}.report-story-intro{font-size:15px}.report-slide-select{padding-block:17px;gap:12px}.report-slide-select strong{font-size:18px}.slide-description{font-size:14px}.patient-experience{grid-template-columns:1fr;padding:36px;margin-top:64px;gap:36px}.experience-intro{display:grid;grid-template-columns:1fr 190px;column-gap:30px;align-items:center}.experience-intro h3{font-size:34px;grid-column:1}.experience-intro>p{grid-column:1;margin-top:18px}.ontol-reader{grid-column:2;grid-row:1/3;padding:0;margin:0}.ontol-reader img{max-height:260px}.experience-cards article{min-height:260px}.experience-cards p{padding-top:36px}}
@media(max-width:650px){.brand img,.header .brand img{width:112px}.brand-extension{font-size:16px;padding-top:5px}.report-showcase{grid-template-columns:1fr;padding:30px 22px;border-radius:18px;gap:36px;margin-inline:-4px}.report-phone{width:min(100%,290px)}.phone-stage{padding-bottom:0}.report-story{max-width:none}.report-story h3{font-size:29px}.report-story-intro{margin-block:18px 24px}.report-slide-select{padding-block:20px}.report-slide-select strong{font-size:19px}.slide-description{font-size:14px}.patient-experience{padding:28px 20px;border-radius:18px;margin-inline:-4px}.experience-intro{display:flex}.experience-intro h3{font-size:30px}.experience-intro>p{font-size:15px}.ontol-reader{margin-top:24px}.ontol-reader img{width:210px;max-height:315px}.experience-cards{grid-template-columns:1fr;gap:16px}.experience-cards article{padding:28px;min-height:230px}.experience-cards h4{font-size:23px;max-width:none;padding-right:25px}.experience-cards p{padding-top:32px;font-size:15px}.card-corner{top:30px;right:24px}.onboarding li{padding-left:0}.transition-section h2{font-size:32px}.hero-bottomline>div{gap:0}}
@media(prefers-reduced-motion:reduce){.phone-track{transition:none}.ontol-reader img{animation:none}}

/* Read each use case while the matching original product screen stays in view. */
.patient-experience{align-items:start;gap:clamp(32px,4vw,60px)}
.experience-cards{align-self:start;align-items:start;grid-template-columns:repeat(2,minmax(0,1fr))}
.experience-cards article{min-height:0;height:auto;padding:32px;gap:32px}
.experience-cards p{margin-top:0;padding-top:0}
@media(min-width:901px){.patient-experience .experience-cards{grid-template-columns:1fr}}
@media(max-width:650px){.experience-cards{grid-template-columns:1fr}.experience-cards article{padding:28px 24px;gap:24px}.patient-experience{margin-top:64px}}
.report-scroll-story{align-items:start;overflow:visible;background:#f8fafc}
.report-scroll-story .phone-stage{position:sticky;top:112px;align-self:start}
.report-scroll-story .report-slide-select{min-height:280px;align-items:flex-start;padding-block:48px}
.slide-detail{display:block;font-size:14px;line-height:1.85;margin-top:18px;color:var(--body)}

@media(min-width:901px) and (max-height:900px){.report-scroll-story .report-phone{width:280px}}
@media(max-width:900px){.report-scroll-story{grid-template-columns:1fr;gap:36px}.report-scroll-story .phone-stage{position:static}.report-scroll-story .report-story{max-width:none}.report-scroll-story .report-slide-select{min-height:0;padding-block:28px}.report-scroll-story .slide-detail{margin-top:12px}}

/* Seedance scene: keep the entire head, hands, keyboard and tablet in view. */
.patient-experience{grid-template-columns:1.15fr 1fr;gap:40px;background:#f8fafc;padding:48px}
.ontol-desk-reader{display:block;padding:0;margin:auto 0 0;overflow:hidden;border-radius:16px;background:#eeeae8}
.mascot-desk-video{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain}
.experience-intro:has(.ontol-desk-reader)>p{margin-bottom:36px}
@media(max-width:1100px){
 .patient-experience{grid-template-columns:1fr}
 .experience-intro:has(.ontol-desk-reader){display:grid;grid-template-columns:1fr 1.2fr;align-items:center;column-gap:32px}
 .experience-intro:has(.ontol-desk-reader) h3{grid-column:1}
 .experience-intro:has(.ontol-desk-reader)>p{grid-column:1;margin-bottom:0}
 .ontol-desk-reader{grid-column:2;grid-row:1/3;margin:0}
}
@media(max-width:650px){
 .patient-experience{padding:28px 20px}
 .experience-intro:has(.ontol-desk-reader){display:flex}
 .experience-intro:has(.ontol-desk-reader)>p{margin-bottom:24px}
 .ontol-desk-reader{width:100%;margin:0;border-radius:12px}
}