.mockframe{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;margin-left:-105px;position:absolute;top:26px;left:50%}.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;margin:-105px 0 0;top:50%;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{width:402px;height:874px;box-shadow:inset 0 0 0 .667px var(--mf-b1),inset 0 0 0 1.333px var(--mf-b2),inset 0 0 0 2px var(--mf-b3),inset 0 0 0 2.667px var(--mf-b4),inset 0 0 0 3.333px var(--mf-b5),inset 0 0 0 3.667px var(--mf-b6),inset 0 0 0 4px var(--mf-b7),inset 0 0 0 4.333px var(--mf-b8),inset 0 0 0 4.667px var(--mf-b9),inset 0 0 0 5px var(--mf-b10),inset 0 0 0 5.333px var(--mf-b11),inset 0 0 0 5.667px var(--mf-b12),inset 0 0 3px 8.5px var(--mf-glass);--mf-b1:#333536;--mf-b2:#434445;--mf-b3:#555657;--mf-b4:#656667;--mf-b5:#767778;--mf-b6:#898a8b;--mf-b7:#999a9a;--mf-b8:#a7a8a8;--mf-b9:#999a9b;--mf-b10:#737575;--mf-b11:#4d4e4f;--mf-b12:#353636;--mf-glass:#393939;background:#000;border-radius:78.4px;padding:14.33px 14.67px}.mockframe.iphone17 .screen{box-shadow:none;border-radius:63.5px}.mockframe.iphone17 .dynamic-island{z-index:10;background:#000;border-radius:18px;width:124.67px;height:36px;margin-left:-62.33px;position:absolute;top:28.67px;left:50%}.mockframe.iphone17 .dynamic-island:before,.mockframe.iphone17 .dynamic-island:after{content:"";position:absolute}.mockframe.iphone17 .dynamic-island:before{background:#060606;border-radius:17px;width:78px;height:34px;top:1px;left:.33px}.mockframe.iphone17 .dynamic-island:after{background:#000;border-radius:11px;width:65.67px;height:22px;top:7px;left:6.67px}.mockframe.iphone17 .dynamic-island .camera{top:13px;right:13px;box-shadow:0 0 0 4.5px #0a0d10,0 0 0 12.33px #060606}.mockframe.iphone17:before{background:#0d0d0d;width:85.33px;height:3px;margin-left:-42.67px;top:5.67px}.mockframe.iphone17 .action{height:41.67px;top:185px}.mockframe.iphone17 .volume{height:67.67px;top:257.33px}.mockframe.iphone17 .sleep{height:106.67px;top:280.67px}.mockframe.iphone17.white{--mf-b1:#8e8e8d;--mf-b2:#989796;--mf-b3:#a7a6a5;--mf-b4:#bbbab9;--mf-b5:#cbcbca;--mf-b6:#d8d8d7;--mf-b7:#e1e1e0;--mf-b8:#e8e8e8;--mf-b9:#dfdfde;--mf-b10:#c9c8c8;--mf-b11:#9d9d9c;--mf-b12:#555;--mf-glass:#494949}.mockframe.iphone17.mist-blue{--mf-b1:#5e6c83;--mf-b2:#728198;--mf-b3:#8897af;--mf-b4:#9cabc5;--mf-b5:#aab9d2;--mf-b6:#b7c5dd;--mf-b7:#c1cee4;--mf-b8:#cbd7ea;--mf-b9:#c1cde2;--mf-b10:#a8b6ce;--mf-b11:#818ea2;--mf-b12:#4a4f57;--mf-glass:#494949}.mockframe.iphone17.sage{--mf-b1:#5d694d;--mf-b2:#6e7a5b;--mf-b3:#7a8867;--mf-b4:#869572;--mf-b5:#99a884;--mf-b6:#b0bf9c;--mf-b7:#c1cfae;--mf-b8:#cedbbe;--mf-b9:#bfccad;--mf-b10:#9fad89;--mf-b11:#778365;--mf-b12:#4b5042;--mf-glass:#393939}.mockframe.iphone17.lavender{--mf-b1:#91879c;--mf-b2:#9e95aa;--mf-b3:#b0a6bb;--mf-b4:#beb5ca;--mf-b5:#cac1d5;--mf-b6:#d8d1e1;--mf-b7:#e4deea;--mf-b8:#ece8f1;--mf-b9:#e5e0eb;--mf-b10:#d2cada;--mf-b11:#a49dad;--mf-b12:#57545b;--mf-glass:#494949}.mockframe.iphone17.cosmic-orange{--mf-b1:#c14e23;--mf-b2:#da6837;--mf-b3:#ea824d;--mf-b4:#f59d67;--mf-b5:#fbb885;--mf-b6:#fdcca1;--mf-b7:#fed8b6;--mf-b8:#fee0c5;--mf-b9:#fedfc6;--mf-b10:#f4ba97;--mf-b11:#d3784f;--mf-b12:#a84825;--mf-glass:#535252}.mockframe.iphone17.deep-blue{--mf-b1:#252b3b;--mf-b2:#353b4c;--mf-b3:#444b5e;--mf-b4:#585f73;--mf-b5:#727a90;--mf-b6:#8c93aa;--mf-b7:#9fa6be;--mf-b8:#aeb5cd;--mf-b9:#adb4cc;--mf-b10:#7c8399;--mf-b11:#3d4355;--mf-b12:#212736;--mf-glass:#3b3b3b}.mockframe.iphone17.landscape{width:874px;height:402px;padding:14.67px 14.33px}.mockframe.iphone17.landscape:before{width:3px;height:85.33px;margin:-42.67px 0 0;top:50%;left:5.67px}.mockframe.iphone17.landscape .dynamic-island{width:36px;height:124.67px;margin:-62.33px 0 0;top:50%;left:28.67px}.mockframe.iphone17.landscape .dynamic-island:before{width:34px;height:78px;top:auto;bottom:.33px;left:1px}.mockframe.iphone17.landscape .dynamic-island:after{width:22px;height:65.67px;top:auto;bottom:6.67px;left:7px}.mockframe.iphone17.landscape .dynamic-island .camera{top:13px;left:13px;right:auto}.mockframe.iphone17.landscape .action{width:41.67px;left:185px}.mockframe.iphone17.landscape .volume{width:67.67px;left:257.33px}.mockframe.iphone17.landscape .sleep{width:106.67px;left:280.67px}.mockframe.iphone18pro{width:402px;height:874px;box-shadow:inset 0 0 0 .667px var(--mf-b1),inset 0 0 0 1.333px var(--mf-b2),inset 0 0 0 2px var(--mf-b3),inset 0 0 0 2.667px var(--mf-b4),inset 0 0 0 3.333px var(--mf-b5),inset 0 0 0 4px var(--mf-b6),inset 0 0 0 4.333px var(--mf-b7),inset 0 0 0 4.667px var(--mf-b8),inset 0 0 0 5px var(--mf-b9),inset 0 0 0 5.333px var(--mf-b10),inset 0 0 0 5.667px var(--mf-b11),inset 0 0 0 6.333px var(--mf-b12),inset 0 0 3px 9.3px var(--mf-glass);--mf-b1:#141314;--mf-b2:#161516;--mf-b3:#1b191b;--mf-b4:#222022;--mf-b5:#2e2c2e;--mf-b6:#444144;--mf-b7:#605d60;--mf-b8:#747173;--mf-b9:#747174;--mf-b10:#4f4c4f;--mf-b11:#272527;--mf-b12:#232223;--mf-glass:#3d3d3d;background:#000;border-radius:80.5px;padding:15.67px 15.83px}.mockframe.iphone18pro .screen{box-shadow:none;border-radius:63.6px}.mockframe.iphone18pro .dynamic-island{z-index:10;background:#000;border-radius:18px;width:94px;height:36px;margin-left:-47px;position:absolute;top:30px;left:50%}.mockframe.iphone18pro .dynamic-island .camera{top:13px;right:13px;box-shadow:0 0 0 5.5px #080a0c}.mockframe.iphone18pro:before{background:#020202;width:162px;height:2.33px;margin-left:-81px;top:6.33px}.mockframe.iphone18pro .action{height:41.67px;top:186px}.mockframe.iphone18pro .volume{height:67.67px;top:258.33px}.mockframe.iphone18pro .sleep{height:107px;top:281.67px}.mockframe.iphone18pro.silver{--mf-b1:#727272;--mf-b2:#8c8c8c;--mf-b3:#a4a4a4;--mf-b4:#b9b9b9;--mf-b5:#c9c9c9;--mf-b6:#d7d7d7;--mf-b7:#e2e2e2;--mf-b8:#e8e8e8;--mf-b9:#e8e8e8;--mf-b10:#d4d4d4;--mf-b11:#aaa;--mf-b12:#777;--mf-glass:#3d3d3d}.mockframe.iphone18pro.glacier{--mf-b1:#788598;--mf-b2:#8a97aa;--mf-b3:#9daabe;--mf-b4:#b0bccf;--mf-b5:#bfcada;--mf-b6:#cdd6e5;--mf-b7:#d9e1ed;--mf-b8:#e0e7f1;--mf-b9:#dfe6f0;--mf-b10:#cad4e2;--mf-b11:#a1adbf;--mf-b12:#6f7c8f;--mf-glass:#3d3d3d}.mockframe.iphone18pro.burgundy{--mf-b1:#341d21;--mf-b2:#392024;--mf-b3:#402529;--mf-b4:#4a2c31;--mf-b5:#58373c;--mf-b6:#70494f;--mf-b7:#8d6068;--mf-b8:#a3727a;--mf-b9:#a4737b;--mf-b10:#7e555c;--mf-b11:#503036;--mf-b12:#381f24;--mf-glass:#3d3d3d}.mockframe.iphone18pro.gold{--mf-b1:#797262;--mf-b2:#948c78;--mf-b3:#aea48c;--mf-b4:#c4b99f;--mf-b5:#d3c9b1;--mf-b6:#dfd7c3;--mf-b7:#e8e2d4;--mf-b8:#ede8dc;--mf-b9:#ede8dc;--mf-b10:#ddd4be;--mf-b11:#b4aa91;--mf-b12:#7e7766;--mf-glass:#3d3d3d}.mockframe.iphone18pro.natural-titanium{--mf-b1:#5e5a53;--mf-b2:#69645e;--mf-b3:#77716b;--mf-b4:#8d8780;--mf-b5:#afa89f;--mf-b6:#d0cac1;--mf-b7:#dfd9d0;--mf-b8:#e4ded5;--mf-b9:#dad4cb;--mf-b10:#b6afa7;--mf-b11:#7d7770;--mf-b12:#403c37;--mf-glass:#393939}.mockframe.iphone18pro.landscape{width:874px;height:402px;padding:15.83px 15.67px}.mockframe.iphone18pro.landscape:before{width:2.33px;height:162px;margin:-81px 0 0;top:50%;left:6.33px}.mockframe.iphone18pro.landscape .dynamic-island{width:36px;height:94px;margin:-47px 0 0;top:50%;left:30px}.mockframe.iphone18pro.landscape .dynamic-island .camera{top:13px;left:13px;right:auto}.mockframe.iphone18pro.landscape .action{width:41.67px;left:186px}.mockframe.iphone18pro.landscape .volume{width:67.67px;left:258.33px}.mockframe.iphone18pro.landscape .sleep{width:107px;left:281.67px}:is(.mockframe.iphone17,.mockframe.iphone18pro):before{content:"";border-radius:0 0 2px 2px;position:absolute;left:50%}:is(.mockframe.iphone17,.mockframe.iphone18pro).landscape:before{border-radius:0 2px 2px 0}:is(.mockframe.iphone17,.mockframe.iphone18pro) .dynamic-island .camera{background:radial-gradient(circle at 50% 40%,#3b3a8f 0%,#1f1c63 25%,#0d0b30 50%,#12394a 66%,#0a1118 80%,#05070a 100%);border-radius:50%;width:10px;height:10px;position:absolute}:is(.mockframe.iphone17,.mockframe.iphone18pro) .action,:is(.mockframe.iphone17,.mockframe.iphone18pro) .volume,:is(.mockframe.iphone17,.mockframe.iphone18pro) .sleep{z-index:0;position:absolute}:is(.mockframe.iphone17,.mockframe.iphone18pro) .action,:is(.mockframe.iphone17,.mockframe.iphone18pro) .volume{background:linear-gradient(to left,var(--mf-b1)0%,var(--mf-b3)25%,var(--mf-b4)50%,var(--mf-b6)68%,var(--mf-b8)80%,var(--mf-b10)100%);border-radius:1.5px 0 0 1.5px;width:3px;left:-3px;box-shadow:inset 0 1px .5px #ffffff4d,inset 0 -1px .5px #ffffff4d}:is(.mockframe.iphone17,.mockframe.iphone18pro) .volume:before{content:"";border-radius:inherit;background:inherit;width:100%;height:100%;box-shadow:inherit;position:absolute;top:85.67px;left:0}:is(.mockframe.iphone17,.mockframe.iphone18pro) .sleep{background:linear-gradient(to right,var(--mf-b1)0%,var(--mf-b3)25%,var(--mf-b4)50%,var(--mf-b6)68%,var(--mf-b8)80%,var(--mf-b10)100%);border-radius:0 1.5px 1.5px 0;width:2.67px;right:-2.67px;box-shadow:inset 0 1px .5px #ffffff4d,inset 0 -1px .5px #ffffff4d}:is(.mockframe.iphone17,.mockframe.iphone18pro).landscape .action,:is(.mockframe.iphone17,.mockframe.iphone18pro).landscape .volume{background:linear-gradient(to bottom,var(--mf-b1)0%,var(--mf-b3)25%,var(--mf-b4)50%,var(--mf-b6)68%,var(--mf-b8)80%,var(--mf-b10)100%);border-radius:0 0 1.5px 1.5px;height:3px;top:auto;bottom:-3px;box-shadow:inset 1px 0 .5px #ffffff4d,inset -1px 0 .5px #ffffff4d}:is(.mockframe.iphone17,.mockframe.iphone18pro).landscape .volume:before{top:0;left:85.67px}:is(.mockframe.iphone17,.mockframe.iphone18pro).landscape .sleep{background:linear-gradient(to top,var(--mf-b1)0%,var(--mf-b3)25%,var(--mf-b4)50%,var(--mf-b6)68%,var(--mf-b8)80%,var(--mf-b10)100%);border-radius:1.5px 1.5px 0 0;height:2.67px;top:-2.67px;right:auto;box-shadow:inset 1px 0 .5px #ffffff4d,inset -1px 0 .5px #ffffff4d}:is(.mockframe.iphone17,.mockframe.iphone18pro)>.camera,:is(.mockframe.iphone17,.mockframe.iphone18pro) .top-bar,:is(.mockframe.iphone17,.mockframe.iphone18pro) .bottom-bar,:is(.mockframe.iphone17,.mockframe.iphone18pro) .home,:is(.mockframe.iphone17,.mockframe.iphone18pro) .sensor,:is(.mockframe.iphone17,.mockframe.iphone18pro) .speaker,:is(.mockframe.iphone17,.mockframe.iphone18pro) .sensors,:is(.mockframe.iphone17,.mockframe.iphone18pro) .more-sensors,:is(.mockframe.iphone17,.mockframe.iphone18pro) .inner,:is(.mockframe.iphone17,.mockframe.iphone18pro) .inner-shadow{display:none}.mockframe.iphone-duo{--duo-k1:#4c5564;--duo-k2:#252d3a;--duo-k3:#121821;--duo-k4:#1a202a;--duo-k5:#333d4c;--duo-k6:#b9d1f3;--duo-k7:#a8c3ea;--duo-k8:#90aacf;--duo-k9:#778eaf;--duo-k10:#5f738e;--duo-k11:#45556c;--duo-k12:#2d3949;--duo-k13:#1e2631;--duo-k14:#151b24;--duo-k15:#10161d;--duo-k16:#030406;--duo-k17:#010102;--duo-k18:#1c2028;--duo-k19:#181b21;--duo-k20:#111318;--duo-k21:#0b0d10;--duo-k22:#040506;--duo-k23:#000;--duo-k24:#000;--duo-strip-r:linear-gradient(to left,#495260 .33px,#0b0f14 1px,#050607 1.67px,#030305 2.33px,#232c38 3px,#44546a 3.67px,#5b6f8a 4.33px,#8099bb 5px,#acc5e9 5.67px,#1e232b 6.33px,#000104 7px,#0f1217 7.67px,#1e232b 8.33px,#13161b 9px,#0e1014 9.67px,#0a0c0f 10.33px,#060709 11px,#030304 11.67px,#010101 12.33px,#000 13px,#000 13.67px,#000 14.33px);--duo-strip-b:linear-gradient(to top,#454e5b .33px,#191e25 1px,#111317 1.67px,#090a0d 2.33px,#7d93b3 3px,#8ba4c8 3.67px,#5d708c 4.33px,#3e4c61 5px,#2e394a 5.67px,#1a2029 6.33px,#0b0c0f 7px,#111318 7.67px,#1d2129 8.33px,#13161b 9px,#0e1014 9.67px,#090b0e 10.33px,#060708 11px,#020303 11.67px,#010101 12.33px,#000 13px,#000 13.67px,#000 14.33px);--duo-strip-l:linear-gradient(to right,#26303e .33px,#89a3c7 1px,#262f3c 1.67px,#020305 2.33px,#010203 3px,#000102 3.67px,#000102 4.33px,#000101 5px,#07080a 5.67px,#21252e 6.33px,#14171d 7px,#0f1115 7.67px,#0b0c0f 8.33px,#07080a 9px,#040405 9.67px,#010101 10.33px,#000 11px,#000 11.67px,#000 12.33px,#000 13px);--duo-spine:linear-gradient(to right,#2b3545 .33px,#1a2233 1px,#47556d 1.67px,#7e94b5 2.33px,#6b7d9a 3px,#404b5e 3.67px,#2c3546 4.33px,#212837 5px,#1d2330 5.67px,#1c232f 6.33px,#1c222e 7px,#1b212d 7.67px,#1c222e 8.33px,#1b222e 9px,#1c232f 9.67px,#1e2531 10.33px,#1e2531 11px,#26303f 11.67px);--duo-btn-stops:#25313f 6.2%,#2e3b4d 18.8%,#324156 31.2%,#37475e 43.8%,#3d4f68 56.2%,#4b5f78 68.8%,#a1b7da 81.2%,#03070d 93.8%;--duo-o1:#4f5b72;--duo-o2:#141b27;--duo-o3:#111826;--duo-o4:#252f42;--duo-o5:#46546e;--duo-o6:#637594;--duo-o7:#7d92b9;--duo-o8:#98afda;--duo-o9:#697b9b;--duo-o10:#232c3d;--duo-o11:#03070e;--duo-o12:#141618;--duo-o13:#252628;--duo-o14:#434345;--duo-o15:#414243;--duo-o16:#2f2f31;--duo-o17:#2a2a2c;--duo-o18:#141516;--duo-o-bg:#030303;--duo-hinge-slot:#1e1f20;--duo-hinge-hi:#ceddf7;--duo-wall-l:linear-gradient(to left,#080911 0%,#08090d 14%,#2c3543 29%,#415063 43%,#4e5c71 57%,#5a677d 71%,#626f86 86%,#68758d 100%);--duo-wall-r:linear-gradient(to right,#05060e 0%,#030306 14%,#171d26 29%,#2a3544 43%,#39485f 57%,#65758e 71%,#50627f 86%,#475771 100%);--duo-fold-shade:.22}.mockframe.iphone-duo.star-white{--duo-k1:#6c6d6d;--duo-k2:#616160;--duo-k3:#444442;--duo-k4:#383836;--duo-k5:#41403d;--duo-k6:#6d6a65;--duo-k7:#f8f8f7;--duo-k8:#f7f6f5;--duo-k9:#f2f2f1;--duo-k10:#edecea;--duo-k11:#e2e1df;--duo-k12:#d2d1cc;--duo-k13:#bab8b1;--duo-k14:#a09d95;--duo-k15:#8c8982;--duo-k16:#686661;--duo-k17:#3f3e3d;--duo-k18:#1b1d21;--duo-k19:#3a3f4a;--duo-k20:#25292f;--duo-k21:#1a1d21;--duo-k22:#0c0d0f;--duo-k23:#010101;--duo-k24:#000;--duo-strip-r:linear-gradient(to left,#3f3e3d .33px,#232220 1px,#33312d 1.67px,#474440 2.33px,#908d86 3px,#c7c4be 3.67px,#d7d5d0 4.33px,#e5e4e0 5px,#f1f0ee 5.67px,#746f69 6.33px,#54504c 7px,#333539 7.67px,#3b404b 8.33px,#262930 9px,#1c1f24 9.67px,#14161a 10.33px,#0d0e10 11px,#060708 11.67px,#010202 12.33px,#000 13px,#000 13.67px,#000 14.33px);--duo-strip-b:linear-gradient(to top,#41403f .33px,#292725 1px,#383532 1.67px,#4e4944 2.33px,#d1cfcc 3px,#e5e4e1 3.67px,#d4d2ce 4.33px,#b9b6af 5px,#96938b 5.67px,#65635e 6.33px,#464543 7px,#1d1f23 7.67px,#373c45 8.33px,#25282e 9px,#1b1e23 9.67px,#131418 10.33px,#0b0c0e 11px,#050506 11.67px,#010101 12.33px,#000 13px,#000 13.67px,#000 14.33px);--duo-strip-l:linear-gradient(to right,#4e4d4b .33px,#9a9993 1px,#55534f 1.67px,#d4d2ce 2.33px,#e8e7e5 3px,#ebeae8 3.67px,#ececea 4.33px,#edecea 5px,#2d2c2d 5.67px,#3f4550 6.33px,#282b32 7px,#1e2126 7.67px,#16181c 8.33px,#0e0f11 9px,#070809 9.67px,#020203 10.33px,#000 11px,#000 11.67px,#000 12.33px,#000 13px);--duo-spine:linear-gradient(to right,#615f5e .33px,#53514c 1px,#7f7c75 1.67px,#c5c2bb 2.33px,#97948d 3px,#636159 3.67px,#5a5750 4.33px,#5a574f 5px,#5f5b53 5.67px,#6e6b62 6.33px,#817e74 7px,#969389 7.67px,#a9a69d 8.33px,#b7b4ab 9px,#bfbcb4 9.67px,#bebbb4 10.33px,#b1aea7 11px,#82817c 11.67px);--duo-btn-stops:#83817c 6.2%,#9d998f 18.8%,#a5a298 31.2%,#adaaa0 43.8%,#b6b3aa 56.2%,#cfcdc6 68.8%,#fff 81.2%,#444038 93.8%;--duo-o1:#74726e;--duo-o2:#4e4c46;--duo-o3:#615f59;--duo-o4:#82807a;--duo-o5:#b3b1aa;--duo-o6:#d6d4ce;--duo-o7:#eae8e3;--duo-o8:#f5f4f0;--duo-o9:#dbd9d3;--duo-o10:#837f77;--duo-o11:#23211c;--duo-o12:#1c1d1e;--duo-o13:#363738;--duo-o14:#4c4d4f;--duo-o15:#48494a;--duo-o16:#343536;--duo-o17:#2f3031;--duo-o18:#171819;--duo-o-bg:#040404;--duo-hinge-slot:#212223;--duo-hinge-hi:#dbdbdb;--duo-wall-l:linear-gradient(to left,#26241f 0%,#a3a19a 14%,#eeece6 29%,#f6f4ee 43%,#f8f7f1 57%,#faf8f3 71%,#fbf9f4 86%,#fcfbf6 100%);--duo-wall-r:linear-gradient(to right,#090806 0%,#0e0d09 14%,#97948d 29%,#c2bfb7 43%,#d3d1c9 57%,#dfdcd5 71%,#cbc9c2 86%,#ece9e3 100%)}.mockframe.iphone-duo .duo-device{transform-origin:0 0;position:absolute;top:0;left:0}.mockframe.iphone-duo .screen{z-index:3;box-shadow:none;background:#fff;position:absolute;overflow:hidden}.mockframe.iphone-duo .duo-content{transform-origin:0 0;position:absolute;top:0;left:0}.mockframe.iphone-duo .duo-camera{z-index:5;background:radial-gradient(circle,#0c0c0e 0,#0e0d14 1px,#1d1d46 2px,#15191f 3px,#212129 4px,#14131a 5px,#13121b 9.5px,#010101 10.5px);border-radius:50%;position:absolute}.mockframe.iphone-duo .duo-btn{position:absolute}.mockframe.iphone-duo .duo-btn--side{background:linear-gradient(to right,var(--duo-btn-stops));border-radius:0 1.33px 1.33px 0;width:2.67px;height:112.67px;top:202.33px;right:-2.67px}.mockframe.iphone-duo .duo-btn--vol-up,.mockframe.iphone-duo .duo-btn--vol-down{background:linear-gradient(to top,var(--duo-btn-stops));border-radius:1.33px 1.33px 0 0;width:65.67px;height:2.67px;top:-2.67px}.mockframe.iphone-duo .duo-btn--vol-up{right:207px}.mockframe.iphone-duo .duo-btn--vol-down{right:126px}.mockframe.iphone-duo .duo-spine{background:var(--duo-spine);border-radius:12px 0 0 12px;width:16px;position:absolute;top:6px;bottom:6px;left:0}.mockframe.iphone-duo .duo-panel{box-shadow:inset 0 0 0 .333px var(--duo-k1),inset 0 0 0 .667px var(--duo-k2),inset 0 0 0 1px var(--duo-k3),inset 0 0 0 1.333px var(--duo-k4),inset 0 0 0 1.667px var(--duo-k5),inset 0 0 0 2px var(--duo-k6),inset 0 0 0 2.333px var(--duo-k7),inset 0 0 0 2.667px var(--duo-k8),inset 0 0 0 3px var(--duo-k9),inset 0 0 0 3.333px var(--duo-k10),inset 0 0 0 4px var(--duo-k11),inset 0 0 0 4.667px var(--duo-k12),inset 0 0 0 5.333px var(--duo-k13),inset 0 0 0 6px var(--duo-k14),inset 0 0 0 6.333px var(--duo-k15),inset 0 0 0 7px var(--duo-k16),inset 0 0 0 7.667px var(--duo-k17),inset 0 0 0 8.333px var(--duo-k18),inset 0 0 0 9px var(--duo-k19),inset 0 0 0 9.667px var(--duo-k20),inset 0 0 0 10.667px var(--duo-k21),inset 0 0 0 12px var(--duo-k22),inset 0 0 0 13.667px var(--duo-k23),inset 0 0 0 15.667px var(--duo-k24);background:#000;border-radius:4px 73.97px 73.97px 4px;position:absolute;inset:0 0 0 11.67px}.mockframe.iphone-duo .duo-panel:before,.mockframe.iphone-duo .duo-panel:after{content:"";position:absolute}.mockframe.iphone-duo .duo-panel:before{background:var(--duo-strip-l);width:13.33px;top:6px;bottom:6px;left:0;-webkit-mask-image:linear-gradient(#0000,#000 6px calc(100% - 6px),#0000);mask-image:linear-gradient(#0000,#000 6px calc(100% - 6px),#0000)}.mockframe.iphone-duo .duo-panel:after{background:var(--duo-strip-r);width:14.67px;top:70px;bottom:70px;right:0;-webkit-mask-image:linear-gradient(#0000,#000 24px calc(100% - 24px),#0000);mask-image:linear-gradient(#0000,#000 24px calc(100% - 24px),#0000)}.mockframe.iphone-duo .duo-strip-b{background:var(--duo-strip-b);height:14.67px;position:absolute;bottom:0;left:6px;right:70px;-webkit-mask-image:linear-gradient(90deg,#0000,#000 6px calc(100% - 24px),#0000);mask-image:linear-gradient(90deg,#0000,#000 6px calc(100% - 24px),#0000)}.mockframe.iphone-duo .duo-outer .screen{border-radius:7.97px 58.04px 58.04px 7.97px;top:16px;left:25.67px}.mockframe.iphone-duo .duo-outer .duo-camera{width:36px;height:36px;top:45.83px;right:45.67px}.mockframe.iphone-duo .duo-inner .duo-frame{background:var(--duo-o-bg);box-shadow:inset 0 0 0 .667px var(--duo-o1),inset 0 0 0 1.333px var(--duo-o2),inset 0 0 0 1.667px var(--duo-o3),inset 0 0 0 2px var(--duo-o4),inset 0 0 0 2.333px var(--duo-o5),inset 0 0 0 2.667px var(--duo-o6),inset 0 0 0 3px var(--duo-o7),inset 0 0 0 3.333px var(--duo-o8),inset 0 0 0 3.667px var(--duo-o9),inset 0 0 0 4px var(--duo-o10),inset 0 0 0 4.333px var(--duo-o11),inset 0 0 0 4.667px var(--duo-o12),inset 0 0 0 5px var(--duo-o13),inset 0 0 0 6px var(--duo-o14),inset 0 0 0 7px var(--duo-o15),inset 0 0 0 16.667px var(--duo-o16),inset 0 0 0 17.333px var(--duo-o17),inset 0 0 0 18px var(--duo-o18);-webkit-mask-image:conic-gradient(from -49deg at 50% 4.33px,transparent 98deg,#000 0),conic-gradient(from 131deg at 50% calc(100% - 4.33px),transparent 98deg,#000 0);-webkit-mask-composite:source-in;-webkit-mask-image:conic-gradient(from -49deg at 50% 4.33px,transparent 98deg,#000 0),conic-gradient(from 131deg at 50% calc(100% - 4.33px),transparent 98deg,#000 0);-webkit-mask-image:conic-gradient(from -49deg at 50% 4.33px,transparent 98deg,#000 0),conic-gradient(from 131deg at 50% calc(100% - 4.33px),transparent 98deg,#000 0);mask-image:conic-gradient(from -49deg at 50% 4.33px,transparent 98deg,#000 0),conic-gradient(from 131deg at 50% calc(100% - 4.33px),transparent 98deg,#000 0);-webkit-mask-composite:source-in;border-radius:75.11px;position:absolute;inset:0;-webkit-mask-composite:source-in;mask-composite:intersect}.mockframe.iphone-duo .duo-inner .screen{border-radius:53.49px;top:20.67px;left:20.67px}.mockframe.iphone-duo .duo-inner .duo-camera{width:29.5px;height:29.5px;top:47.21px;right:278.2px}.mockframe.iphone-duo .duo-inner .duo-btn--vol-up{right:206.67px}.mockframe.iphone-duo .duo-inner .duo-btn--vol-down{right:125.67px}.mockframe.iphone-duo .duo-hinge{background:var(--duo-hinge-slot);z-index:1;border-radius:1.33px;width:68px;height:2.67px;margin-left:-34px;position:absolute;left:50%}.mockframe.iphone-duo .duo-hinge:before{content:"";background:var(--duo-hinge-hi);width:1.33px;height:2.67px;margin-left:-.67px;position:absolute;left:50%}.mockframe.iphone-duo .duo-hinge--top{top:6.33px}.mockframe.iphone-duo .duo-hinge--top:before{top:-2.67px}.mockframe.iphone-duo .duo-hinge--bottom{bottom:6.33px}.mockframe.iphone-duo .duo-hinge--bottom:before{bottom:-2.67px}.mockframe.iphone-duo .duo-half{transform-origin:0 0;position:absolute;top:0;left:0}.mockframe.iphone-duo .duo-half>.duo-device{position:relative}.mockframe.iphone-duo .duo-wall{z-index:-1;width:50%;position:absolute;top:0;bottom:0}.mockframe.iphone-duo .duo-wall--left{background:var(--duo-wall-l)left/7.1px 100% no-repeat,#080911;border-radius:75.11px 0 0 75.11px;left:-7.1px}.mockframe.iphone-duo .duo-wall--right{background:var(--duo-wall-r)right/7.1px 100% no-repeat,#05060e;border-radius:0 75.11px 75.11px 0;right:-7.1px}.mockframe.iphone-duo .duo-shade{z-index:4;pointer-events:none;border-radius:53.49px;position:absolute;inset:20.67px}.mockframe.iphone-duo .duo-shade--left{background:rgba(0,0,0,var(--duo-fold-shade))}.mockframe.iphone-duo .duo-shade--right{background:linear-gradient(to right,transparent 50%,rgba(0,0,0,calc(var(--duo-fold-shade)*.8))50%,transparent calc(50% + 90px))}.mockframe.iphone-duo .duo-half--left{clip-path:inset(-12px calc(50% - .5px) -12px -12px)}.mockframe.iphone-duo .duo-half--right{clip-path:inset(-12px -12px -12px 50%)}.mockframe.iphone-duo .duo-scene{transform-style:preserve-3d;perspective-origin:50%;position:absolute}.mockframe.iphone-duo .duo-scene .duo-shade,.mockframe.iphone-duo .duo-scene .duo-wall{transition:opacity .9s}.mockframe.iphone-duo .duo-scene--flat .duo-shade,.mockframe.iphone-duo .duo-scene--flat .duo-wall{opacity:0}.mockframe.iphone-duo .duo-leaf{width:50%;height:100%;transform-style:preserve-3d;position:absolute;top:0}.mockframe.iphone-duo .duo-leaf--left{transform-origin:100%;left:0}.mockframe.iphone-duo .duo-leaf--right{transform-origin:0;left:50%}.mockframe.iphone-duo .duo-face{backface-visibility:hidden;width:100%;height:100%;position:absolute;top:0;left:0}.mockframe.iphone-duo .duo-face>.duo-device{top:0}.mockframe.iphone-duo .duo-face--front{clip-path:inset(-12px 0 -12px -12px)}.mockframe.iphone-duo .duo-face--right{clip-path:inset(-12px -12px -12px 0)}.mockframe.iphone-duo .duo-face--right>.duo-device{left:-100%}.mockframe.iphone-duo .duo-face--back{transform:rotateY(180deg)}.mockframe.iphone-duo .duo-face--back>.duo-device{left:-11.67px}
