.demo .cards{gap:22px}.mock-stage{height:340px;background:#d9d2c6;border-radius:8px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:18px;color:#20252e}.mock-panel:nth-child(2) .mock-stage{background:#c9ced7}.mock-panel:nth-child(3) .mock-stage{background:#dbe1eb}.mock-panel p{margin-bottom:12px}.choice{font:11px/1.7 Mono,monospace;display:block;border-top:1px solid #7e899580;padding-top:12px;letter-spacing:.02em}.business-card{width:100%;aspect-ratio:1.65;background:#fffdf7;box-shadow:0 15px 25px #34291926;padding:25px;transform:rotate(-5deg);display:flex;flex-direction:column;justify-content:space-between}.business-card>img{width:105px;height:68px;object-fit:contain}.business-card strong{font-size:14px;display:block}.business-card span{display:block;font-size:11px;line-height:1.7}.phone-mock{background:#fff;width:213px;height:302px;border:6px solid #272b32;border-radius:25px;box-shadow:9px 12px 18px #16203025;overflow:hidden;text-align:center;padding:8px 9px;color:#20272a;flex-shrink:0}.phone-status{font:9px/1.5 Arial;text-align:left;padding:0 5px}.phone-status span{float:right}.phone-app{font:10px/1.6 Arial;text-align:left;padding:12px 0 8px;border-bottom:1px solid #e9eceb}.phone-avatar{width:72px;height:72px;border-radius:50%;background:#f5eee5;display:flex;align-items:center;justify-content:center;margin:12px auto 7px}.phone-avatar img{width:48px;height:48px;object-fit:contain}.phone-name{display:block;font-size:15px}.phone-label{font:10px/1.8 Arial;color:#66716e}.phone-actions{display:flex;justify-content:center;gap:18px;font:10px/1.8 Arial;color:#1b6851;margin-top:10px}.phone-description{margin-top:10px;border-top:1px solid #e0e5e3;padding:9px 0;font-size:10px;text-align:left}.phone-description span{display:block;color:#69716d;font-size:9px;margin-top:4px}.browser-mock{position:absolute;left:18px;right:18px;top:45px;background:#fff;border:1px solid #b1b9c5;border-radius:8px;overflow:hidden;box-shadow:0 8px 18px #16203020}.browser-tab{background:#e9edf4;height:35px;display:flex;gap:9px;align-items:center;padding:8px 12px;font:11px Arial}.browser-tab img{width:16px;height:16px}.browser-tab b{margin-left:auto}.browser-address{font:10px Arial;background:#f6f7fa;padding:8px 14px}.browser-body{padding:20px;color:#1d293b}.browser-body span{font-size:18px;font-weight:700;line-height:1.15;display:block}.browser-body i{display:block;width:80%;height:4px;background:#e2e8f1;margin-top:9px}.zoom-mark{position:absolute;bottom:19px;left:30px;display:flex;align-items:center;gap:16px}.zoom-mark img{width:48px;height:48px;object-fit:contain}.zoom-mark span{font:10px/1.5 Mono;color:#40516a}.store-mock{width:100%;max-width:320px;box-shadow:9px 14px 18px #41352225}.store-sign{height:99px;background:#f4ede1;padding:12px 25px;border-top:9px solid #c5bcae;border-bottom:6px solid #bbb2a6}.store-sign img{width:100%;height:100%;object-fit:contain}.store-window{height:143px;background:linear-gradient(120deg,#38423f,#69706c 48%,#313b37);border:9px solid #b0a696;position:relative;overflow:hidden}.store-window:after{content:'';position:absolute;left:15%;top:0;width:20%;height:100%;background:#fff1;transform:skew(-20deg)}.store-door{position:absolute;right:8%;top:0;bottom:0;width:30%;border:5px solid #c0b7aa}.store-door:after{content:'';position:absolute;width:3px;height:22px;background:#e2d2b9;right:4px;top:55px}.display-jewel{position:absolute;left:10%;bottom:12px;width:45%;height:24px;background:#ddcbb7;border-bottom:9px solid #a7927c}.display-jewel:before{content:'';position:absolute;border:4px solid #d3b57c;width:23px;height:23px;border-radius:50%;left:30%;top:-28px}.store-step{height:15px;background:#bdb2a0}.shirt-mock{width:100%;height:100%;filter:drop-shadow(6px 12px 8px #1c233333)}.shirt-mock svg{width:100%;height:100%}@media(max-width:650px){.mock-stage{height:340px}.business-card{max-width:290px}.browser-mock{left:24px;right:24px}.demo .cards{gap:34px}.choice{font-size:11px}}
.source-visual{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:#eee7db}.source-visual img{width:100%;height:100%;object-fit:contain}.source-visual:focus-visible{outline:3px solid #2861ed;outline-offset:3px}.mock-stage:has(.source-visual){padding:0;background:#eee7db}

/* Each application keeps its own proportions; never crop approved artwork. */
.business-card{max-width:290px}
.mock-panel{min-width:0}
@media(min-width:901px){
  #seccion-4 .mock-stage{height:420px}
}
@media(max-width:900px){
  .demo .cards{grid-template-columns:1fr;max-width:480px;margin-inline:auto;gap:36px}
  .mock-stage:has(.business-card){height:clamp(230px,70vw,300px)}
  .mock-stage:has(.browser-mock){height:320px}
  .mock-panel:has(.source-visual){width:100%;max-width:400px;margin-inline:auto}
  .mock-stage:has(.source-visual){height:auto}
  .source-visual{height:auto}
  .source-visual img{display:block;width:100%;height:auto;object-fit:contain}
}