* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html,body { width:100%; height:100vh; overflow:hidden;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Roboto',Arial,sans-serif; background:#000; }
.ad-container { width:100%; height:100%; min-height:100vh; position:relative; overflow:hidden; cursor:pointer; background:linear-gradient(160deg,#f9e8f2 0%, #e0d0d9 100%); }
.stage { position:absolute; inset:0; display:flex; }
.panel { display:flex; flex-direction:column; min-height:0; }
.brand { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.brand .appicon { border-radius:10px; box-shadow:0 2px 8px rgba(0,0,0,.22); }
.brand span { font-size:13px; font-weight:700; color:#6b586a; letter-spacing:.2px; }
.appicon { display:block; }
.headline { font-size:23px; line-height:1.14; font-weight:800; color:#231623; letter-spacing:-.4px; margin-bottom:8px; }
.subline { font-size:13.5px; line-height:1.4; color:#6b586a; margin-bottom:14px; }
.cta { display:block; text-align:center; color:#fff; font-size:16px; font-weight:800; padding:13px 18px; border-radius:999px; box-shadow:0 8px 20px #c0398f55; letter-spacing:.2px; }
.trust { font-size:12px; font-weight:600; color:#6b586a; margin-top:9px; text-align:center; opacity:.9; }
.mock { width:100%; height:100%; display:block; object-fit:contain; filter:drop-shadow(0 12px 26px rgba(0,0,0,0.16)); }
.hb { flex-direction:column; padding:22px 22px 20px; }
.hb .mockwrap { flex:1 1 auto; min-height:0; display:flex; align-items:center; justify-content:center; }
.hb .mockwrap .mock { max-height:100%; width:auto; }
.hb .panel { flex:0 0 auto; margin-top:6px; }
.hs { flex-direction:row; align-items:center; padding:22px 18px; gap:12px; }
.hs .left { flex:1.2 1 0; min-width:0; }
.hs .right { flex:1 1 0; min-width:0; display:flex; align-items:center; justify-content:center; height:100%; }
.hs .headline { font-size:21px; } .hs .subline { font-size:12.5px; margin-bottom:12px; }
.hs .cta { font-size:15px; padding:12px 14px; } .hs .trust { text-align:left; }
.hs .right .mock { max-height:78%; width:auto; }
.cc { align-items:center; justify-content:center; padding:18px; }
.cc .card { background:#ffffff; border-radius:22px; padding:20px 20px 18px; width:100%; align-items:center; text-align:center; box-shadow:0 18px 44px rgba(0,0,0,0.16); }
.cc .appicon { width:50px; height:50px; border-radius:12px; margin-bottom:11px; box-shadow:0 4px 12px rgba(0,0,0,.22); }
.cc .headline { font-size:21px; margin-bottom:7px; }
.cc .subline { font-size:13px; margin-bottom:12px; }
.cc .mockmini { width:52%; height:120px; margin:0 auto 14px; }
.cc .mockmini .mock { height:100%; }
.cc .cta { width:100%; }
.bt { flex-direction:column; padding:22px 22px 0; }
.bt .panel.top { flex:0 0 auto; }
.bt .mockwrap.big { flex:1 1 auto; min-height:0; display:flex; align-items:flex-end; justify-content:center; margin-top:10px; overflow:hidden; }
.bt .mockwrap.big .mock { max-height:none; height:auto; width:88%; align-self:flex-end; }
.fc { flex-direction:column; padding:24px 22px 0; }
.fc .panel { flex:0 0 auto; }
.fc .mockwrap { flex:1 1 auto; min-height:0; display:flex; align-items:flex-end; justify-content:center; margin-top:12px; overflow:hidden; }
.fc .mockwrap .mock { max-height:none; height:auto; width:84%; align-self:flex-end; }
