/* Homepage screens from the existing Mini App. */
.hero-showcase.screen-stage{padding:23px 24px 17px;background:#f0f3f8;border-color:#e1e7ef;border-radius:20px;overflow:hidden}
.screen-stage-heading{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:19px}
.screen-stage-name{font-size:13px;font-weight:600;color:#253d59}
.screen-sample-label{font-size:11px;line-height:1.6;color:#5b6a7c;border:1px solid #dce3eb;padding:4px 8px;border-radius:5px;background:#fff;display:inline-block}
.screen-stage-phones{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:0 5px 15px;background-image:linear-gradient(#e4eaf2 1px,transparent 1px),linear-gradient(90deg,#e4eaf2 1px,transparent 1px);background-size:32px 32px;background-position:center 38px}
.screen-device{min-width:0;margin:0}
.screen-device figcaption{font-size:12px;color:#243d5a;line-height:1.6;font-weight:600;margin-bottom:11px}
.screen-device figcaption span{display:block;font-size:11px;font-weight:400;color:#6a788a}
.screen-device-admin{padding-top:24px}
.screen-phone{padding:5px;border:1px solid #24384d;border-radius:22px;background:#172c42;box-shadow:0 12px 24px #182e451c;overflow:hidden}
.screen-phone img{width:100%;height:auto;aspect-ratio:390/844;display:block;border-radius:16px;background:white}
.screen-stage-link{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;font-size:12px;color:#446180;border-top:1px solid #dbe3ed;margin-top:1px}
.screen-stage-link:hover{color:var(--blue)}
.interface-showcase{margin:30px 0 37px}
.interface-intro{display:flex;align-items:flex-start;justify-content:space-between;gap:30px;margin-bottom:24px}
.interface-eyebrow{font-size:11px;letter-spacing:1px;color:#547393;margin-bottom:9px}
.interface-intro h3{font-size:25px;line-height:1.5;font-weight:600;letter-spacing:-.6px}
.interface-intro>div>p:last-child{font-size:14px;line-height:1.85;color:var(--muted);max-width:700px;margin-top:10px}
.interface-intro>.screen-sample-label{flex:none;margin-top:4px}
.interface-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.interface-card{min-width:0;border:1px solid #e3e8ee;border-radius:15px;overflow:hidden;background:white}
.interface-image{display:block;background:#f1f4f8;padding:15px 24px 23px}
.interface-card:nth-child(2) .interface-image{background:#eaf0f6}
.interface-card:nth-child(3) .interface-image{background:#f2f4f6}
.interface-image-top{display:flex;justify-content:space-between;gap:8px;margin-bottom:16px;color:#55718b;font:10px/1.6 var(--mono);letter-spacing:.6px}
.interface-image-top>span:last-child{font:16px/1 var(--sans)}
.interface-image-frame{max-width:280px;margin-inline:auto;border:1px solid #dce3ed;border-radius:12px;overflow:hidden;box-shadow:0 8px 18px #20334c0a;background:#fff}
.interface-image img{display:block;width:100%;height:auto;aspect-ratio:390/844}
.interface-image:hover .interface-image-top{color:var(--blue)}
.interface-card-copy{padding:21px 22px 23px}
.interface-card-copy h4{font-size:18px;font-weight:600;line-height:1.5}
.interface-card-copy p{font-size:14px;color:var(--muted);line-height:1.85;margin-top:8px}
.interface-footer{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;padding-top:17px}
.interface-footer p{font-size:12px;color:var(--muted);line-height:1.8;max-width:580px}
.interface-footer>div{display:flex;flex-wrap:wrap;gap:6px 22px;flex:none}
.interface-footer .text-link{font-size:13px;min-height:30px}
.running-projects-heading{border-top:1px solid var(--line);padding-top:27px;margin-bottom:20px}
.running-projects-heading h3{font-size:20px;font-weight:600}
.running-projects-heading p{font-size:14px;color:var(--muted);margin-top:6px}
@media(max-width:1050px){.hero-showcase.screen-stage{padding:20px 20px 13px}.screen-stage-phones{gap:13px;padding-inline:0}.screen-phone{border-radius:18px}.screen-phone img{border-radius:12px}.interface-image{padding-inline:16px}.interface-card-copy{padding:18px}.interface-intro{gap:20px}.interface-intro h3{font-size:23px}.interface-footer{flex-wrap:wrap;gap:9px}}
@media(max-width:760px){.hero-showcase.screen-stage{max-width:550px}.screen-stage-phones{gap:22px;padding-inline:8px}.screen-device figcaption{font-size:13px}.screen-device figcaption span{font-size:12px}.interface-intro{flex-direction:column;gap:12px}.interface-intro>.screen-sample-label{margin-top:0}.interface-grid{gap:14px}.interface-image{padding-inline:10px}.interface-image-top{font-size:9px;letter-spacing:0}.interface-card-copy{padding:16px 13px}.interface-card-copy h4{font-size:16px}.interface-card-copy p{font-size:13px}}
@media(max-width:600px){.hero-showcase.screen-stage{padding:17px 14px 11px}.screen-stage-heading{gap:8px;margin-bottom:16px}.screen-stage-name{font-size:12px}.screen-sample-label{font-size:10px}.screen-stage-phones{gap:12px;padding:0 0 14px}.screen-device figcaption{font-size:12px}.screen-device figcaption span{font-size:10px}.screen-device-admin{padding-top:20px}.screen-phone{padding:4px;border-radius:17px}.screen-phone img{border-radius:11px}.screen-stage-link{font-size:11px}.interface-showcase{margin-top:25px;margin-bottom:29px}.interface-intro h3{font-size:21px}.interface-intro>div>p:last-child{font-size:14px}.interface-grid{grid-template-columns:1fr;gap:19px}.interface-image{padding:17px 24px 23px}.interface-image-top{font-size:11px;letter-spacing:.6px}.interface-image-frame{max-width:280px}.interface-card-copy{padding:20px}.interface-card-copy h4{font-size:18px}.interface-card-copy p{font-size:14px}.interface-footer>div{flex:initial}.running-projects-heading{padding-top:24px}.running-projects-heading h3{font-size:19px}}
@media(max-width:360px){.screen-stage-name{font-size:11px}.screen-sample-label{font-size:9px;padding:3px 6px}.screen-stage-phones{gap:10px}.interface-image{padding-inline:20px}}

.actual-showcase{padding:30px 0;border-top:1px solid var(--line);margin-bottom:26px}
.actual-showcase h2{font-size:24px;line-height:1.4;margin-bottom:10px}
.actual-showcase>p{font-size:13px;color:var(--muted);line-height:1.8;margin-bottom:18px}
.actual-showcase-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:20px 0}
.actual-showcase-grid figure{margin:0;min-width:0;background:var(--tile);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.actual-showcase-grid img{width:100%;height:auto;display:block;aspect-ratio:390/844}
.actual-showcase-grid figcaption{font-size:14px;padding:12px;display:flex;justify-content:space-between;gap:5px}
@media(max-width:700px){.actual-showcase-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.actual-showcase h2{font-size:22px}}