.mockframe{transition:all .5s cubic-bezier(.075,.82,.165,1);display:inline-block;position:relative;box-sizing:content-box!important}.mockframe .screen{z-index:3;background:#fff;border-radius:1px;width:100%;height:100%;display:block;position:relative;overflow:hidden;box-shadow:0 0 0 3px #111}.mockframe .top-bar,.mockframe .bottom-bar{background:#000;width:100%;height:3px;display:block}.mockframe .middle-bar{background:#000;width:3px;height:4px;position:absolute;top:0;left:90px}.mockframe.iphone8{background:#d9dbdc;border-radius:56px;width:375px;height:667px;padding:105px 24px;box-shadow:inset 0 0 3px #0003}.mockframe.iphone8:before{content:"";z-index:1;background:#f8f8f8;border-radius:50px;width:calc(100% - 12px);height:calc(100% - 12px);position:absolute;top:6px;left:6px}.mockframe.iphone8:after{content:"";z-index:2;border-radius:48px;width:calc(100% - 16px);height:calc(100% - 16px);position:absolute;top:8px;left:8px;box-shadow:inset 0 0 3px #0000001a,inset 0 0 6px 3px #fff}.mockframe.iphone8 .home{z-index:3;background:linear-gradient(135deg,#303233 0%,#b5b7b9 50%,#f0f2f2 69%,#303233 100%);border-radius:100%;width:68px;height:68px;margin-left:-34px;position:absolute;bottom:22px;left:50%}.mockframe.iphone8 .home:before{content:"";background:#f8f8f8;border-radius:100%;width:calc(100% - 8px);height:calc(100% - 8px);position:absolute;top:4px;left:4px}.mockframe.iphone8 .top-bar{background:#bfbfc0;height:14px;position:absolute;top:68px;left:0}.mockframe.iphone8 .bottom-bar{background:#bfbfc0;height:14px;position:absolute;bottom:68px;left:0}.mockframe.iphone8 .sleep{background:#d9dbdc;border-radius:0 2px 2px 0;width:4px;height:66px;position:absolute;top:190px;right:-4px}.mockframe.iphone8 .volume{z-index:0;background:#d9dbdc;border-radius:2px 0 0 2px;width:4px;height:66px;position:absolute;top:188px;left:-4px}.mockframe.iphone8 .volume:before{background:inherit;content:"";border-radius:2px 0 0 2px;width:2px;height:40px;display:block;position:absolute;top:-78px;left:2px}.mockframe.iphone8 .volume:after{background:inherit;content:"";border-radius:2px 0 0 2px;width:4px;height:66px;display:block;position:absolute;top:82px;left:0}.mockframe.iphone8 .camera{z-index:3;background:#3c3d3d;border-radius:100%;width:12px;height:12px;margin-left:-6px;position:absolute;top:24px;left:50%}.mockframe.iphone8 .sensor{z-index:3;background:#3c3d3d;border-radius:100%;width:16px;height:16px;position:absolute;top:49px;left:134px}.mockframe.iphone8 .speaker{z-index:3;background:#292728;border-radius:6px;width:70px;height:6px;margin-left:-35px;position:absolute;top:54px;left:50%}.mockframe.iphone8.gold{background:#f9e7d3}.mockframe.iphone8.gold .top-bar,.mockframe.iphone8.gold .bottom-bar{background:#fff}.mockframe.iphone8.gold .sleep,.mockframe.iphone8.gold .volume{background:#f9e7d3}.mockframe.iphone8.gold .home{background:linear-gradient(135deg,#cebba9 0%,#f9e7d3 50%,#cebba9 100%)}.mockframe.iphone8.black{background:#464646;box-shadow:inset 0 0 3px #000000b3}.mockframe.iphone8.black:before{background:#080808}.mockframe.iphone8.black:after{box-shadow:inset 0 0 3px #0000001a,inset 0 0 6px 3px #212121}.mockframe.iphone8.black .top-bar,.mockframe.iphone8.black .bottom-bar{background:#212121}.mockframe.iphone8.black .volume,.mockframe.iphone8.black .sleep{background:#464646}.mockframe.iphone8.black .camera{background:#080808}.mockframe.iphone8.black .home{background:linear-gradient(135deg,#080808 0%,#464646 50%,#080808 100%)}.mockframe.iphone8.black .home:before{background:#080808}.mockframe.iphone8.landscape{width:667px;height:375px;padding:24px 105px}.mockframe.iphone8.landscape .sleep{border-radius:0 0 2px 2px;width:66px;height:4px;top:100%;right:190px}.mockframe.iphone8.landscape .volume{border-radius:2px 2px 0 0;width:66px;height:4px;top:-4px;left:calc(100% - 254px)}.mockframe.iphone8.landscape .volume:before{border-radius:2px 2px 0 0;width:40px;height:2px;top:2px;left:auto;right:-78px}.mockframe.iphone8.landscape .volume:after{border-radius:2px 2px 0 0;width:66px;height:4px;top:0;left:-82px}.mockframe.iphone8.landscape .top-bar{width:14px;height:100%;top:0;left:calc(100% - 82px)}.mockframe.iphone8.landscape .bottom-bar{width:14px;height:100%;top:0;left:68px}.mockframe.iphone8.landscape .home{margin-top:-34px;margin-left:0;top:50%;left:22px}.mockframe.iphone8.landscape .sensor{top:134px;left:calc(100% - 65px)}.mockframe.iphone8.landscape .speaker{width:6px;height:70px;margin-top:-35px;margin-left:0;top:50%;left:calc(100% - 60px)}.mockframe.iphone8.landscape .camera{margin-top:-5px;margin-left:0;top:50%;left:calc(100% - 32px)}.mockframe.iphone8plus{background:#d9dbdc;border-radius:56px;width:414px;height:736px;padding:112px 26px;box-shadow:inset 0 0 3px #0003}.mockframe.iphone8plus:before{content:"";z-index:1;background:#f8f8f8;border-radius:50px;width:calc(100% - 12px);height:calc(100% - 12px);position:absolute;top:6px;left:6px}.mockframe.iphone8plus:after{content:"";z-index:2;border-radius:48px;width:calc(100% - 16px);height:calc(100% - 16px);position:absolute;top:8px;left:8px;box-shadow:inset 0 0 3px #0000001a,inset 0 0 6px 3px #fff}.mockframe.iphone8plus .home{z-index:3;background:linear-gradient(135deg,#303233 0%,#b5b7b9 50%,#f0f2f2 69%,#303233 100%);border-radius:100%;width:68px;height:68px;margin-left:-34px;position:absolute;bottom:24px;left:50%}.mockframe.iphone8plus .home:before{content:"";background:#f8f8f8;border-radius:100%;width:calc(100% - 8px);height:calc(100% - 8px);position:absolute;top:4px;left:4px}.mockframe.iphone8plus .top-bar{background:#bfbfc0;height:14px;position:absolute;top:68px;left:0}.mockframe.iphone8plus .bottom-bar{background:#bfbfc0;height:14px;position:absolute;bottom:68px;left:0}.mockframe.iphone8plus .sleep{background:#d9dbdc;border-radius:0 2px 2px 0;width:4px;height:66px;position:absolute;top:190px;right:-4px}.mockframe.iphone8plus .volume{z-index:0;background:#d9dbdc;border-radius:2px 0 0 2px;width:4px;height:66px;position:absolute;top:188px;left:-4px}.mockframe.iphone8plus .volume:before{background:inherit;content:"";border-radius:2px 0 0 2px;width:2px;height:40px;display:block;position:absolute;top:-78px;left:2px}.mockframe.iphone8plus .volume:after{background:inherit;content:"";border-radius:2px 0 0 2px;width:4px;height:66px;display:block;position:absolute;top:82px;left:0}.mockframe.iphone8plus .camera{z-index:3;background:#3c3d3d;border-radius:100%;width:12px;height:12px;margin-left:-6px;position:absolute;top:29px;left:50%}.mockframe.iphone8plus .sensor{z-index:3;background:#3c3d3d;border-radius:100%;width:16px;height:16px;position:absolute;top:54px;left:154px}.mockframe.iphone8plus .speaker{z-index:3;background:#292728;border-radius:6px;width:70px;height:6px;margin-left:-35px;position:absolute;top:59px;left:50%}.mockframe.iphone8plus.gold{background:#f9e7d3}.mockframe.iphone8plus.gold .top-bar,.mockframe.iphone8plus.gold .bottom-bar{background:#fff}.mockframe.iphone8plus.gold .sleep,.mockframe.iphone8plus.gold .volume{background:#f9e7d3}.mockframe.iphone8plus.gold .home{background:linear-gradient(135deg,#cebba9 0%,#f9e7d3 50%,#cebba9 100%)}.mockframe.iphone8plus.black{background:#464646;box-shadow:inset 0 0 3px #000000b3}.mockframe.iphone8plus.black:before{background:#080808}.mockframe.iphone8plus.black:after{box-shadow:inset 0 0 3px #0000001a,inset 0 0 6px 3px #212121}.mockframe.iphone8plus.black .top-bar,.mockframe.iphone8plus.black .bottom-bar{background:#212121}.mockframe.iphone8plus.black .volume,.mockframe.iphone8plus.black .sleep{background:#464646}.mockframe.iphone8plus.black .camera{background:#080808}.mockframe.iphone8plus.black .home{background:linear-gradient(135deg,#080808 0%,#464646 50%,#080808 100%)}.mockframe.iphone8plus.black .home:before{background:#080808}.mockframe.iphone8plus.landscape{width:736px;height:414px;padding:26px 112px}.mockframe.iphone8plus.landscape .sleep{border-radius:0 0 2px 2px;width:66px;height:4px;top:100%;right:190px}.mockframe.iphone8plus.landscape .volume{border-radius:2px 2px 0 0;width:66px;height:4px;top:-4px;left:calc(100% - 254px)}.mockframe.iphone8plus.landscape .volume:before{border-radius:2px 2px 0 0;width:40px;height:2px;top:2px;left:auto;right:-78px}.mockframe.iphone8plus.landscape .volume:after{border-radius:2px 2px 0 0;width:66px;height:4px;top:0;left:-82px}.mockframe.iphone8plus.landscape .top-bar{width:14px;height:100%;top:0;left:calc(100% - 82px)}.mockframe.iphone8plus.landscape .bottom-bar{width:14px;height:100%;top:0;left:68px}.mockframe.iphone8plus.landscape .home{margin-top:-34px;margin-left:0;top:50%;left:24px}.mockframe.iphone8plus.landscape .sensor{top:154px;left:calc(100% - 70px)}.mockframe.iphone8plus.landscape .speaker{width:6px;height:70px;margin-top:-35px;margin-left:0;top:50%;left:calc(100% - 65px)}.mockframe.iphone8plus.landscape .camera{margin-top:-5px;margin-left:0;top:50%;left:calc(100% - 29px)}.mockframe.iphone-x{background:#fdfdfd;border-radius:66px;width:375px;height:812px;padding:26px;box-shadow:inset 0 0 11px #000}.mockframe.iphone-x .overflow{border-radius:66px;width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden}.mockframe.iphone-x .shadow{background:radial-gradient(#0009 0%,#fff0 60%);border-radius:100%;width:90px;height:90px;position:absolute}.mockframe.iphone-x .shadow--tl{top:-20px;left:-20px}.mockframe.iphone-x .shadow--tr{top:-20px;right:-20px}.mockframe.iphone-x .shadow--bl{bottom:-20px;left:-20px}.mockframe.iphone-x .shadow--br{bottom:-20px;right:-20px}.mockframe.iphone-x:before{content:"";z-index:1;background:#000;border-radius:61px;width:calc(100% - 10px);height:calc(100% - 10px);position:absolute;top:5px;left:5px}.mockframe.iphone-x .inner-shadow{z-index:1;border-radius:56px;width:calc(100% - 20px);height:calc(100% - 20px);position:absolute;top:10px;left:10px;overflow:hidden;box-shadow:inset 0 0 15px #ffffffa8}.mockframe.iphone-x .inner-shadow:before{content:"";z-index:2;border-radius:200px/112px;width:100%;height:116%;position:absolute;top:-8%;left:0;box-shadow:inset 0 0 20px #fff}.mockframe.iphone-x .screen{box-shadow:none;border-radius:40px}.mockframe.iphone-x .top-bar,.mockframe.iphone-x .bottom-bar{background:#0000001a;width:100%;height:8px;position:absolute;left:0}.mockframe.iphone-x .top-bar{top:80px}.mockframe.iphone-x .bottom-bar{bottom:80px}.mockframe.iphone-x .volume,.mockframe.iphone-x .volume:before,.mockframe.iphone-x .volume:after,.mockframe.iphone-x .sleep{background:#b5b5b5;width:3px;position:absolute}.mockframe.iphone-x .volume{height:32px;top:116px;left:-3px}.mockframe.iphone-x .volume:before{content:"";height:62px;top:62px;left:0}.mockframe.iphone-x .volume:after{content:"";height:62px;top:140px;left:0}.mockframe.iphone-x .sleep{height:96px;top:200px;right:-3px}.mockframe.iphone-x .camera{background:#0d4d71;border-radius:100%;width:6px;height:6px;position:absolute;top:9px;left:154px}.mockframe.iphone-x .speaker{background:#171818;border-radius:6px;width:60px;height:6px;margin-left:-30px;position:absolute;top:9px;left:50%}.mockframe.iphone-x .notch{z-index:4;background:#000;border-bottom-right-radius:24px;border-bottom-left-radius:24px;width:210px;height:30px;position:absolute;top:26px;left:108px}.mockframe.iphone-x .notch:before,.mockframe.iphone-x .notch:after{content:"";width:8px;height:8px;position:absolute;top:0}.mockframe.iphone-x .notch:after{background:radial-gradient(circle at 0 100%,#0000 0 70%,#000 70% 100%);left:-8px}.mockframe.iphone-x .notch:before{background:radial-gradient(circle at 100% 100%,#0000 0 70%,#000 70% 100%);right:-8px}.mockframe.iphone-x.landscape{width:812px;height:375px}.mockframe.iphone-x.landscape .top-bar,.mockframe.iphone-x.landscape .bottom-bar{width:8px;height:100%;top:0}.mockframe.iphone-x.landscape .top-bar{left:80px}.mockframe.iphone-x.landscape .bottom-bar{bottom:auto;left:auto;right:80px}.mockframe.iphone-x.landscape .volume,.mockframe.iphone-x.landscape .volume:before,.mockframe.iphone-x.landscape .volume:after,.mockframe.iphone-x.landscape .sleep{height:3px}.mockframe.iphone-x.landscape .inner-shadow:before{border-radius:112px/200px;width:116%;height:100%;top:0;left:-8%}.mockframe.iphone-x.landscape .volume{width:32px;top:auto;bottom:-3px;left:116px}.mockframe.iphone-x.landscape .volume:before{width:62px;top:0;left:62px}.mockframe.iphone-x.landscape .volume:after{width:62px;top:0;left:140px}.mockframe.iphone-x.landscape .sleep{width:96px;top:-3px;left:200px;right:auto}.mockframe.iphone-x.landscape .camera{top:auto;bottom:154px;left:9px}.mockframe.iphone-x.landscape .speaker{width:6px;height:60px;margin-top:-30px;margin-left:0;top:50%;left:9px}.mockframe.iphone-x.landscape .notch{border-top-right-radius:24px;border-bottom-right-radius:24px;border-bottom-left-radius:0;width:30px;height:210px;top:auto;bottom:108px;left:26px}.mockframe.iphone-x.landscape .notch:before,.mockframe.iphone-x.landscape .notch:after{left:0}.mockframe.iphone-x.landscape .notch:after{background:radial-gradient(circle at 100% 100%,#0000 0 70%,#000 70% 100%);top:auto;bottom:-8px}.mockframe.iphone-x.landscape .notch:before{background:radial-gradient(circle at 100% 0,#0000 0 70%,#000 70% 100%);top:-8px}.mockframe.iphone17{background:linear-gradient(145deg,#4a4a4a 0%,#333 15%,#252525 50%,#333 85%,#4a4a4a 100%);border-radius:52px;width:375px;height:812px;padding:12px;position:relative;box-shadow:inset 0 0 0 1px #fff3,inset 0 1px #ffffff40,0 30px 60px -15px #00000080,0 0 0 1px #0006}.mockframe.iphone17:before{content:"";z-index:1;background:linear-gradient(145deg,#1a1a1a 0%,#111 100%);border-radius:50px;position:absolute;inset:3px}.mockframe.iphone17:after{content:"";z-index:2;background:#000;border-radius:44px;position:absolute;inset:10px}.mockframe.iphone17 .antenna{z-index:5;background:linear-gradient(90deg,#0000 0%,#1a1a1a 15%,#0a0a0a 50%,#1a1a1a 85%,#0000 100%);border-radius:1px;width:12px;height:3px;position:absolute}.mockframe.iphone17 .antenna.top-left{top:82px;left:0}.mockframe.iphone17 .antenna.top-right{top:82px;right:0}.mockframe.iphone17 .antenna.bottom-left{bottom:82px;left:0}.mockframe.iphone17 .antenna.bottom-right{bottom:82px;right:0}.mockframe.iphone17 .corner-highlight{z-index:1;pointer-events:none;width:60px;height:60px;position:absolute}.mockframe.iphone17 .corner-highlight.tl{background:radial-gradient(at 100% 100%,#ffffff26 0%,#ffffff0f 30%,#0000 60%);border-radius:46px 0 0;top:6px;left:6px}.mockframe.iphone17 .corner-highlight.tr{background:radial-gradient(at 0 100%,#ffffff26 0%,#ffffff0f 30%,#0000 60%);border-radius:0 46px 0 0;top:6px;right:6px}.mockframe.iphone17 .corner-highlight.bl{background:radial-gradient(at 100% 0,#ffffff1f 0%,#ffffff0d 30%,#0000 60%);border-radius:0 0 0 46px;bottom:6px;left:6px}.mockframe.iphone17 .corner-highlight.br{background:radial-gradient(at 0 0,#ffffff1f 0%,#ffffff0d 30%,#0000 60%);border-radius:0 0 46px;bottom:6px;right:6px}.mockframe.iphone17 .inner-edge{z-index:1;pointer-events:none;border:1px solid #50505080;border-radius:45px;position:absolute;inset:9px}.mockframe.iphone17 .screen{z-index:3;background:#fff;border-radius:42px;width:100%;height:100%;position:relative;overflow:hidden;box-shadow:0 0 0 2px #000}.mockframe.iphone17 .dynamic-island{z-index:10;box-sizing:border-box;background:#000;border-radius:15px;justify-content:flex-end;align-items:center;gap:6px;width:128px;height:29px;padding-right:11px;display:flex;position:absolute;top:22px;left:50%;transform:translate(-50%)}.mockframe.iphone17 .dynamic-island .indicator{background:#22c55e;border-radius:50%;width:6px;height:6px;box-shadow:0 0 5px #22c55e,0 0 8px #22c55e80}.mockframe.iphone17 .dynamic-island .camera{background:radial-gradient(circle at 40% 40%,#3a3a4a 0%,#252530 40%,#15151a 70%,#0a0a0f 100%);border-radius:50%;width:11px;height:11px;position:relative;box-shadow:inset 0 1px 2px #000c,0 0 0 1px #3c3c504d}.mockframe.iphone17 .dynamic-island .camera:before{content:"";background:radial-gradient(#64649666 0%,#0000 100%);border-radius:50%;width:3px;height:2px;position:absolute;top:2px;left:2px}.mockframe.iphone17 .dynamic-island .camera:after{content:"";background:radial-gradient(circle,#3c508c59 0%,#0000 70%);border-radius:50%;width:5px;height:5px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.mockframe.iphone17 .sleep{z-index:4;background:linear-gradient(#5a5a5a 0%,#454545 8%,#353535 20%,#2d2d2d 50%,#353535 80%,#454545 92%,#5a5a5a 100%);border-radius:0 2px 2px 0;width:3px;height:85px;position:absolute;top:165px;right:-3px;box-shadow:1px 0 2px #0000004d}.mockframe.iphone17 .action{z-index:4;background:linear-gradient(#5a5a5a 0%,#454545 8%,#353535 20%,#2d2d2d 50%,#353535 80%,#454545 92%,#5a5a5a 100%);border-radius:2px 0 0 2px;width:3px;height:34px;position:absolute;top:165px;left:-3px;box-shadow:-1px 0 2px #0000004d}.mockframe.iphone17 .volume{z-index:4;background:linear-gradient(#5a5a5a 0%,#454545 8%,#353535 20%,#2d2d2d 50%,#353535 80%,#454545 92%,#5a5a5a 100%);border-radius:2px 0 0 2px;width:3px;height:58px;position:absolute;top:215px;left:-3px;box-shadow:-1px 0 2px #0000004d}.mockframe.iphone17 .volume:before{content:"";background:linear-gradient(#5a5a5a 0%,#454545 8%,#353535 20%,#2d2d2d 50%,#353535 80%,#454545 92%,#5a5a5a 100%);border-radius:2px 0 0 2px;width:3px;height:58px;position:absolute;top:70px;left:0;box-shadow:-1px 0 2px #0000004d}.mockframe.iphone17 .camera-control{z-index:4;background:linear-gradient(#5a5a5a 0%,#454545 8%,#353535 20%,#2d2d2d 50%,#353535 80%,#454545 92%,#5a5a5a 100%);border-radius:0 2px 2px 0;width:3px;height:42px;position:absolute;top:380px;right:-3px;box-shadow:1px 0 2px #0000004d}.mockframe.iphone17 .top-bar,.mockframe.iphone17 .bottom-bar,.mockframe.iphone17 .home,.mockframe.iphone17 .sensor,.mockframe.iphone17 .speaker,.mockframe.iphone17 .sensors,.mockframe.iphone17 .more-sensors,.mockframe.iphone17 .inner,.mockframe.iphone17 .inner-shadow{display:none}.mockframe.iphone17.white{background:linear-gradient(145deg,#fafaf7 0%,#e8e8e3 15%,#d8d8d3 50%,#e8e8e3 85%,#fafaf7 100%);box-shadow:inset 0 0 0 1px #fffffff2,inset 0 1px #fff,0 30px 60px -15px #0003,0 0 0 1px #0000000f}.mockframe.iphone17.white:before{background:linear-gradient(145deg,#d0d0cb 0%,#c0c0bb 100%)}.mockframe.iphone17.white .antenna{background:linear-gradient(90deg,#0000 0%,#a0a09b 15%,#888883 50%,#a0a09b 85%,#0000 100%)}.mockframe.iphone17.white .corner-highlight.bl,.mockframe.iphone17.white .corner-highlight.br{background:radial-gradient(at 50% 0,#fff9 0%,#fff3 40%,#0000 70%)}.mockframe.iphone17.white .corner-highlight.tl,.mockframe.iphone17.white .corner-highlight.tr{background:radial-gradient(at 50% 100%,#ffffffb3 0%,#ffffff40 40%,#0000 70%)}.mockframe.iphone17.white .inner-edge{border-color:#b4b4af99}.mockframe.iphone17.white .sleep,.mockframe.iphone17.white .camera-control,.mockframe.iphone17.white .action,.mockframe.iphone17.white .volume,:is(.mockframe.iphone17.white .sleep,.mockframe.iphone17.white .camera-control,.mockframe.iphone17.white .action,.mockframe.iphone17.white .volume):before{box-shadow:none;background:linear-gradient(#f0f0eb 0%,#d8d8d3 15%,#c8c8c3 50%,#d8d8d3 85%,#f0f0eb 100%)}.mockframe.iphone17.mist-blue{background:linear-gradient(145deg,#c8d5e0 0%,#a8bac8 15%,#95a8b8 50%,#a8bac8 85%,#c8d5e0 100%);box-shadow:inset 0 0 0 1px #ffffff8c,inset 0 1px #ffffffa6,0 30px 60px -15px #00000047,0 0 0 1px #0000001a}.mockframe.iphone17.mist-blue:before{background:linear-gradient(145deg,#8598a8 0%,#758898 100%)}.mockframe.iphone17.mist-blue .antenna{background:linear-gradient(90deg,#0000 0%,#6a7a8a 15%,#5a6a7a 50%,#6a7a8a 85%,#0000 100%)}.mockframe.iphone17.mist-blue .corner-highlight{opacity:.7}.mockframe.iphone17.mist-blue .inner-edge{border-color:#788ca080}.mockframe.iphone17.mist-blue .sleep,.mockframe.iphone17.mist-blue .camera-control,.mockframe.iphone17.mist-blue .action,.mockframe.iphone17.mist-blue .volume,:is(.mockframe.iphone17.mist-blue .sleep,.mockframe.iphone17.mist-blue .camera-control,.mockframe.iphone17.mist-blue .action,.mockframe.iphone17.mist-blue .volume):before{box-shadow:none;background:linear-gradient(#bccad5 0%,#a0b2c2 15%,#90a5b5 50%,#a0b2c2 85%,#bccad5 100%)}.mockframe.iphone17.sage{background:linear-gradient(145deg,#c5d4c0 0%,#a5b8a1 15%,#94a890 50%,#a5b8a1 85%,#c5d4c0 100%);box-shadow:inset 0 0 0 1px #ffffff8c,inset 0 1px #ffffffa6,0 30px 60px -15px #00000047,0 0 0 1px #0000001a}.mockframe.iphone17.sage:before{background:linear-gradient(145deg,#859884 0%,#758874 100%)}.mockframe.iphone17.sage .antenna{background:linear-gradient(90deg,#0000 0%,#6a7a69 15%,#5a6a59 50%,#6a7a69 85%,#0000 100%)}.mockframe.iphone17.sage .corner-highlight{opacity:.7}.mockframe.iphone17.sage .inner-edge{border-color:#78967380}.mockframe.iphone17.sage .sleep,.mockframe.iphone17.sage .camera-control,.mockframe.iphone17.sage .action,.mockframe.iphone17.sage .volume,:is(.mockframe.iphone17.sage .sleep,.mockframe.iphone17.sage .camera-control,.mockframe.iphone17.sage .action,.mockframe.iphone17.sage .volume):before{box-shadow:none;background:linear-gradient(#b8cab5 0%,#9eb89a 15%,#8ea88a 50%,#9eb89a 85%,#b8cab5 100%)}.mockframe.iphone17.lavender{background:linear-gradient(145deg,#e0d2e8 0%,#c5b5d2 15%,#b5a2c2 50%,#c5b5d2 85%,#e0d2e8 100%);box-shadow:inset 0 0 0 1px #ffffff8c,inset 0 1px #ffffffa6,0 30px 60px -15px #00000047,0 0 0 1px #0000001a}.mockframe.iphone17.lavender:before{background:linear-gradient(145deg,#9c8cac 0%,#8c7c9c 100%)}.mockframe.iphone17.lavender .antenna{background:linear-gradient(90deg,#0000 0%,#7c6c8c 15%,#6c5c7c 50%,#7c6c8c 85%,#0000 100%)}.mockframe.iphone17.lavender .corner-highlight{opacity:.7}.mockframe.iphone17.lavender .inner-edge{border-color:#9682a580}.mockframe.iphone17.lavender .sleep,.mockframe.iphone17.lavender .camera-control,.mockframe.iphone17.lavender .action,.mockframe.iphone17.lavender .volume,:is(.mockframe.iphone17.lavender .sleep,.mockframe.iphone17.lavender .camera-control,.mockframe.iphone17.lavender .action,.mockframe.iphone17.lavender .volume):before{box-shadow:none;background:linear-gradient(#d2c5dc 0%,#baa8ca 15%,#aa98ba 50%,#baa8ca 85%,#d2c5dc 100%)}.mockframe.iphone17.cosmic-orange{background:linear-gradient(145deg,#f9a66d 0%,#f6823d 15%,#e5712c 50%,#f6823d 85%,#f9a66d 100%);box-shadow:inset 0 0 0 1px #ffffff8c,inset 0 1px #ffffffa6,0 30px 60px -15px #00000047,0 0 0 1px #0000001a}.mockframe.iphone17.cosmic-orange:before{background:linear-gradient(145deg,#c5612a 0%,#b55520 100%)}.mockframe.iphone17.cosmic-orange .antenna{background:linear-gradient(90deg,#0000 0%,#a54a1a 15%,#8a3a10 50%,#a54a1a 85%,#0000 100%)}.mockframe.iphone17.cosmic-orange .corner-highlight{opacity:.7}.mockframe.iphone17.cosmic-orange .inner-edge{border-color:#b4643c80}.mockframe.iphone17.cosmic-orange .sleep,.mockframe.iphone17.cosmic-orange .camera-control,.mockframe.iphone17.cosmic-orange .action,.mockframe.iphone17.cosmic-orange .volume,:is(.mockframe.iphone17.cosmic-orange .sleep,.mockframe.iphone17.cosmic-orange .camera-control,.mockframe.iphone17.cosmic-orange .action,.mockframe.iphone17.cosmic-orange .volume):before{box-shadow:none;background:linear-gradient(#f8955a 0%,#f6823d 15%,#e5712c 50%,#f6823d 85%,#f8955a 100%)}.mockframe.iphone17.deep-blue{background:linear-gradient(145deg,#6a7499 0%,#4a547f 15%,#3a446f 50%,#4a547f 85%,#6a7499 100%);box-shadow:inset 0 0 0 1px #ffffff59,inset 0 1px #ffffff73,0 30px 60px -15px #0006,0 0 0 1px #0003}.mockframe.iphone17.deep-blue:before{background:linear-gradient(145deg,#3a446a 0%,#2a345a 100%)}.mockframe.iphone17.deep-blue .antenna{background:linear-gradient(90deg,#0000 0%,#2a345a 15%,#1a244a 50%,#2a345a 85%,#0000 100%)}.mockframe.iphone17.deep-blue .corner-highlight{opacity:.5}.mockframe.iphone17.deep-blue .inner-edge{border-color:#505a7880}.mockframe.iphone17.deep-blue .sleep,.mockframe.iphone17.deep-blue .camera-control,.mockframe.iphone17.deep-blue .action,.mockframe.iphone17.deep-blue .volume,:is(.mockframe.iphone17.deep-blue .sleep,.mockframe.iphone17.deep-blue .camera-control,.mockframe.iphone17.deep-blue .action,.mockframe.iphone17.deep-blue .volume):before{box-shadow:none;background:linear-gradient(#5a6489 0%,#4a547f 15%,#3a446f 50%,#4a547f 85%,#5a6489 100%)}.mockframe.iphone17.landscape{width:812px;height:375px;padding:12px}.mockframe.iphone17.landscape .antenna.top-left{background:linear-gradient(#0000 0%,#1a1a1a 15%,#0a0a0a 50%,#1a1a1a 85%,#0000 100%);width:3px;height:12px;top:0;left:82px}.mockframe.iphone17.landscape .antenna.top-right{background:linear-gradient(#0000 0%,#1a1a1a 15%,#0a0a0a 50%,#1a1a1a 85%,#0000 100%);width:3px;height:12px;top:0;left:auto;right:82px}.mockframe.iphone17.landscape .antenna.bottom-left{background:linear-gradient(#0000 0%,#1a1a1a 15%,#0a0a0a 50%,#1a1a1a 85%,#0000 100%);width:3px;height:12px;bottom:0;left:82px}.mockframe.iphone17.landscape .antenna.bottom-right{background:linear-gradient(#0000 0%,#1a1a1a 15%,#0a0a0a 50%,#1a1a1a 85%,#0000 100%);width:3px;height:12px;bottom:0;left:auto;right:82px}.mockframe.iphone17.landscape .dynamic-island{top:50%;left:-28px;transform:translateY(-50%)rotate(90deg)}.mockframe.iphone17.landscape .sleep{border-radius:2px 2px 0 0;width:85px;height:3px;top:-3px;left:165px;right:auto;box-shadow:0 -1px 2px #0000004d}.mockframe.iphone17.landscape .action{border-radius:0 0 2px 2px;width:34px;height:3px;top:auto;bottom:-3px;left:165px;box-shadow:0 1px 2px #0000004d}.mockframe.iphone17.landscape .volume{border-radius:0 0 2px 2px;width:58px;height:3px;top:auto;bottom:-3px;left:215px;box-shadow:0 1px 2px #0000004d}.mockframe.iphone17.landscape .volume:before{border-radius:0 0 2px 2px;width:58px;height:3px;top:0;left:70px;box-shadow:0 1px 2px #0000004d}.mockframe.iphone17.landscape .camera-control{border-radius:2px 2px 0 0;width:42px;height:3px;top:-3px;left:380px;right:auto;box-shadow:0 -1px 2px #0000004d}