/* Page-scoped interface compositions. The existing site remains the design system. */
.saas-page .hero > .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.06fr);gap:28px;align-items:center}
.saas-page .hero .inner{padding:76px 0 68px}
.saas-page .hero .h1{font-size:clamp(26px,2.65vw,34px)}
.saas-page .hero .lead{font-size:18px;max-width:480px}
.saas-page .hero .glow{opacity:.65}
.saas-page .saas-showcase{width:100%;max-width:none;margin:0;animation:none}
.saas-showcase::before{display:none}
.saas-screens{position:relative;aspect-ratio:1.13;isolation:isolate}
.saas-page .saas-screens img{position:absolute;height:auto;border-radius:10px;border:1px solid #dcddea;box-shadow:0 18px 40px -19px rgba(33,29,76,.36)}
.saas-page .saas-screens .saas-report{top:2%;right:0;width:95%;z-index:1}
.saas-page .saas-screens .saas-users{top:43%;left:0;width:61%;z-index:3;transform:rotate(-3deg)}
.saas-page .saas-screens .saas-billing{top:57%;right:-1%;width:44%;z-index:2;transform:rotate(3deg)}
.saas-showcase figcaption{font-size:12px;color:#626779;text-align:right;margin:8px 0 0}
.saas-page .saas-intro{padding:38px 0 24px}
.saas-intro .prose{max-width:100%}
.saas-page .saas-scenarios{padding:36px 0 64px}
.saas-scenarios > .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
.saas-scenarios .h2{font-size:clamp(25px,2.4vw,32px);max-width:550px}
.saas-scenarios .checklist{padding-left:21px}
.saas-page .saas-scenarios .checklist li{padding-left:2px;margin:9px 0;list-style:disc;font-size:16px;line-height:1.6}
.saas-page .saas-scenarios .checklist li::before,.saas-page .saas-scenarios .checklist li::after{content:none;display:none}
.saas-scenarios .checklist li::marker{color:#9297a9}
.saas-scenario-visual{margin:0;min-width:0;padding:25px 0}
.saas-scenario-visual img{display:block;width:100%;height:auto;border-radius:12px;border:1px solid #dddfea;box-shadow:0 22px 54px -28px rgba(38,33,78,.3)}
.saas-scenario-caption{margin-top:24px}
.saas-scenario-visual h3{font-family:'Schibsted Grotesk',sans-serif;font-size:21px;letter-spacing:-.4px;margin:0 0 10px}
.saas-scenario-visual p{color:var(--sub);font-size:16px;line-height:1.65;margin:0;max-width:470px}
.saas-scenario-visual .saas-concept-note{font-size:12px;color:#777c8d;margin-top:14px}
@media(min-width:1500px){.saas-page .hero > .wrap{max-width:1280px;gap:46px}.saas-page .hero .inner{padding:90px 0 80px}}
@media(max-width:1024px){.saas-page .hero > .wrap{grid-template-columns:minmax(0,1fr);gap:0}.saas-page .hero .inner{padding:54px 0 24px;max-width:740px}.saas-page .hero .lead{max-width:640px}.saas-page .saas-showcase{max-width:640px;margin:0 auto 34px}.saas-screens{aspect-ratio:1.2}.saas-page .saas-screens .saas-users{top:43%;width:57%}.saas-page .saas-screens .saas-billing{top:52%;width:40%}.saas-scenarios > .wrap{gap:30px}.saas-scenarios .h2{font-size:26px}}
@media(max-width:760px){.saas-scenarios > .wrap{grid-template-columns:minmax(0,1fr);gap:12px}.saas-page .saas-scenarios{padding:28px 0 44px}.saas-scenario-visual{padding:0}.saas-page .saas-intro{padding:28px 0 10px}.saas-scenario-caption{margin-top:18px}}
@media(max-width:480px){.saas-page .hero .inner{padding:40px 0 26px}.saas-page .saas-showcase{margin-bottom:26px}.saas-page .saas-screens img{border-radius:6px}.saas-showcase figcaption{text-align:left;font-size:11px}.saas-page .hero .lead{font-size:17px}}