:root{--bg:#fff;--text:#16161d;--muted:#6f7180;--line:#e9e9ef;--hot:#ff4f7b;--hot2:#ff7356;--soft:#fff2f6;--shadow:0 24px 70px rgba(40,30,55,.14)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Arial,sans-serif;line-height:1.5}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;max-width:1180px;margin:auto;padding:18px 28px;background:rgba(255,255,255,.88);backdrop-filter:blur(18px)}.brand{display:inline-flex;gap:10px;align-items:center;color:var(--text);text-decoration:none;font-weight:800;font-size:22px}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;color:#fff;background:linear-gradient(135deg,var(--hot),var(--hot2));box-shadow:0 8px 24px rgba(255,79,123,.24)}.top-action,.text-link{color:var(--text);font-weight:700;text-decoration:none}.top-action{padding:10px 15px;border:1px solid var(--line);border-radius:14px}.section{max-width:1180px;margin:auto;padding:92px 28px}.hero{min-height:690px;display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center;padding-top:70px}.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:12px;font-weight:800;color:var(--hot);margin-bottom:16px}.hero h1,.section h2{margin:0;letter-spacing:-.045em;line-height:1.02}.hero h1{font-size:clamp(52px,7vw,88px);max-width:760px}.hero h1 span{color:#a5a5b0}.hero-text{max-width:620px;font-size:20px;color:var(--muted);margin:28px 0}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.button{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 24px;border-radius:18px;font-weight:800;text-decoration:none}.button.primary{color:#fff;background:linear-gradient(135deg,var(--hot),var(--hot2));box-shadow:0 14px 35px rgba(255,79,123,.25)}.button.secondary{color:var(--text);background:#f5f5f8}.microcopy{font-size:13px;color:#9798a4;margin:13px 4px}.hero-visual{position:relative;min-height:610px}.orb{position:absolute;border-radius:50%;filter:blur(1px)}.orb-one{width:350px;height:350px;background:#ffe1ea;right:25px;top:70px}.orb-two{width:220px;height:220px;background:#ffe9db;left:10px;bottom:40px}.profile-stack{position:absolute;inset:0;display:grid;place-items:center;perspective:1200px}.phone-card{position:absolute;width:min(330px,72vw);border-radius:34px;padding:12px;background:#fff;box-shadow:var(--shadow);overflow:hidden;transform-origin:50% 88%;will-change:transform,opacity;transition:transform .9s cubic-bezier(.22,.72,.24,1),opacity .72s ease,filter .72s ease}.profile-card{z-index:1;opacity:0;pointer-events:none;transform:translate3d(0,34px,0) scale(.9) rotate(0deg);filter:saturate(.88)}.profile-card.is-front{z-index:6;opacity:1;pointer-events:auto;transform:translate3d(24px,-6px,0) scale(1) rotate(2deg);filter:none}.profile-card.is-next{z-index:5;opacity:1;transform:translate3d(-26px,28px,0) scale(.95) rotate(-7deg);filter:saturate(.94)}.profile-card.is-third{z-index:4;opacity:1;transform:translate3d(18px,48px,0) scale(.9) rotate(6deg);filter:saturate(.86)}.profile-card.is-exit-left{z-index:8;opacity:1;transform:translate3d(-135%,6px,0) scale(.98) rotate(-18deg)}.profile-card.is-exit-right{z-index:8;opacity:1;transform:translate3d(135%,6px,0) scale(.98) rotate(18deg)}.profile-photo{display:block;width:100%;height:400px;border-radius:26px;object-fit:cover;object-position:center 30%;background:#f1f1f4}.photo-badge{position:absolute;left:26px;top:26px;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.9);font-size:12px;font-weight:700;box-shadow:0 4px 14px rgba(0,0,0,.08)}.fake-caption{display:flex;flex-direction:column;gap:3px;padding:16px 10px 10px}.fake-caption strong{font-size:22px}.fake-caption span{font-size:14px;color:var(--muted)}.fake-actions{display:flex;justify-content:center;gap:18px;padding:7px 0 12px}.fake-actions button{border:0;width:52px;height:52px;border-radius:50%;background:#f4f4f7;font-size:27px;cursor:default}.fake-actions .like{background:var(--soft);color:var(--hot)}.stats{padding-top:28px;padding-bottom:28px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.stats div{display:flex;flex-direction:column;gap:2px}.stats strong{font-size:22px}.stats span{color:var(--muted)}.section-heading{max-width:700px}.section h2{font-size:clamp(38px,5vw,62px)}.steps,.safety-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:42px}.steps article,.safety-grid article{padding:30px;border:1px solid var(--line);border-radius:28px}.steps article>span{font-size:13px;font-weight:800;color:var(--hot)}h3{font-size:23px;margin:18px 0 9px;letter-spacing:-.02em}.steps p,.safety-grid p,.unified p,.cta p{color:var(--muted);margin:0}.unified-card{padding:56px;border-radius:38px;background:#17171d;color:#fff;display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.unified-card .eyebrow{color:#ff8aa7}.unified-card p{font-size:18px;margin:24px 0}.unified-card .text-link{color:#fff}.sync-diagram{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}.sync-node{display:grid;place-items:center;width:110px;height:110px;border-radius:30px;background:#2a2a33;font-weight:800}.sync-node.hot{background:linear-gradient(135deg,var(--hot),var(--hot2));box-shadow:0 20px 50px rgba(255,79,123,.25)}.sync-diagram span{color:#777784;font-size:26px}.icon{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;background:var(--soft);color:var(--hot);font-weight:900}.cta{padding-top:40px}.cta-box{text-align:center;padding:78px 28px;border-radius:38px;background:linear-gradient(160deg,#fff2f6,#fff7ed)}.cta-box p{font-size:19px;margin:18px 0 28px}footer{max-width:1180px;margin:auto;padding:36px 28px 54px;border-top:1px solid var(--line);display:flex;align-items:center;gap:24px;color:var(--muted)}footer .brand{margin-right:auto}.footer-note{font-weight:800}@media(prefers-reduced-motion:reduce){.phone-card{transition:none}}@media(max-width:800px){.topbar{padding:14px 18px}.section{padding:66px 18px}.hero{grid-template-columns:1fr;gap:10px;min-height:auto;padding-top:45px}.hero h1{font-size:52px}.hero-text{font-size:18px}.hero-visual{min-height:570px}.profile-card.is-front{transform:translate3d(14px,-4px,0) scale(1) rotate(2deg)}.profile-card.is-next{transform:translate3d(-16px,24px,0) scale(.95) rotate(-6deg)}.stats,.steps,.safety-grid,.unified-card{grid-template-columns:1fr}.stats{gap:16px}.stats div{padding:4px 0}.unified-card{padding:34px 24px}.sync-diagram{margin-top:8px}footer{align-items:flex-start;flex-wrap:wrap}.top-action{font-size:14px}}@media(max-width:420px){.hero h1{font-size:45px}.hero-actions .button{width:100%}.profile-photo{height:350px}.hero-visual{min-height:520px}.phone-card{width:280px}.sync-node{width:84px;height:84px;border-radius:24px}}

@media(max-width:800px){
  .hero{display:grid;grid-template-columns:1fr;gap:0;padding-top:24px;padding-bottom:42px;align-items:start}
  .hero-copy{display:contents}
  .hero-copy .eyebrow{order:1;margin:0 0 10px;font-size:11px}
  .hero-copy h1{order:2;font-size:clamp(37px,10.6vw,46px);line-height:.98;max-width:11.5ch}
  .hero-visual{order:3;min-height:390px;margin:8px -8px 4px}
  .hero-text{order:4;margin:10px 0 16px;font-size:16px;line-height:1.42;max-width:34em}
  .hero-actions{order:5;gap:10px}
  .hero-actions .button{min-height:50px;padding:0 20px;border-radius:16px}
  .microcopy{order:6;margin:10px 2px 0;font-size:12px;line-height:1.4}
  .phone-card{width:min(268px,72vw);border-radius:28px;padding:10px}
  .profile-photo{height:300px;border-radius:21px}
  .photo-badge{left:20px;top:20px;padding:6px 9px;font-size:11px}
  .fake-caption{padding:12px 8px 7px}
  .fake-caption strong{font-size:19px}
  .fake-caption span{font-size:12px;line-height:1.35}
  .fake-actions{gap:14px;padding:4px 0 8px}
  .fake-actions button{width:44px;height:44px;font-size:23px}
  .orb-one{width:250px;height:250px;right:18px;top:48px}
  .orb-two{width:160px;height:160px;left:8px;bottom:26px}
}
@media(max-width:420px){
  .topbar{padding:12px 16px}
  .brand{font-size:20px}.brand-mark{width:32px;height:32px}
  .hero{padding-top:18px;padding-left:16px;padding-right:16px}
  .hero-copy h1{font-size:clamp(34px,10.2vw,41px);max-width:10.8ch}
  .hero-visual{min-height:360px;margin-top:4px}
  .phone-card{width:min(248px,70vw)}
  .profile-photo{height:276px}
  .hero-actions .button{width:auto;flex:1 1 150px}
}

/* Mobile-only refinement: keep profiles visible immediately without overpowering the hero copy. */
@media(max-width:800px){
  .hero-visual{min-height:330px;margin-top:2px;margin-bottom:2px}
  .phone-card{width:min(230px,64vw);border-radius:25px;padding:9px}
  .profile-photo{height:255px;border-radius:19px}
  .photo-badge{left:17px;top:17px;padding:5px 8px;font-size:10px}
  .fake-caption{padding:10px 7px 6px}
  .fake-caption strong{font-size:17px}
  .fake-caption span{font-size:11px;line-height:1.3}
  .fake-actions{gap:12px;padding:3px 0 7px}
  .fake-actions button{width:39px;height:39px;font-size:20px}
  .profile-card.is-front{transform:translate3d(10px,-2px,0) scale(1) rotate(2deg)}
  .profile-card.is-next{transform:translate3d(-13px,18px,0) scale(.95) rotate(-6deg)}
  .profile-card.is-third{transform:translate3d(12px,34px,0) scale(.9) rotate(6deg)}
  .orb-one{width:220px;height:220px;right:18px;top:42px}
  .orb-two{width:140px;height:140px;left:10px;bottom:22px}
}
@media(max-width:420px){
  .hero-visual{min-height:310px}
  .phone-card{width:min(214px,62vw)}
  .profile-photo{height:236px}
}

/* Final mobile balance: more breathing room between headline, cards and body copy. */
@media(max-width:800px){
  .hero-copy h1{font-size:clamp(33px,9.6vw,41px);line-height:.99;max-width:11.8ch}
  .hero-visual{min-height:292px;margin-top:0;margin-bottom:10px}
  .phone-card{width:min(202px,57vw);border-radius:23px;padding:8px}
  .profile-photo{height:220px;border-radius:17px}
  .photo-badge{left:15px;top:15px;padding:4px 7px;font-size:9px}
  .fake-caption{padding:8px 6px 5px}
  .fake-caption strong{font-size:15px}
  .fake-caption span{font-size:10px;line-height:1.25}
  .fake-actions{gap:10px;padding:2px 0 6px}
  .fake-actions button{width:34px;height:34px;font-size:18px}
  .profile-card.is-front{transform:translate3d(8px,0,0) scale(1) rotate(2deg)}
  .profile-card.is-next{transform:translate3d(-11px,14px,0) scale(.95) rotate(-6deg)}
  .profile-card.is-third{transform:translate3d(10px,27px,0) scale(.9) rotate(6deg)}
  .orb-one{width:190px;height:190px;right:18px;top:34px}
  .orb-two{width:122px;height:122px;left:12px;bottom:20px}
  .hero-text{margin-top:4px}
}
@media(max-width:420px){
  .hero-copy h1{font-size:clamp(30px,9vw,36px);max-width:11.6ch}
  .hero-visual{min-height:280px;margin-bottom:8px}
  .phone-card{width:min(194px,56vw)}
  .profile-photo{height:212px}
}