/* Shared typography, hero and Japan proof updates, and responsive download flags. */
:root { --font:"Nunito Sans",sans-serif; --heading:"Nunito Sans",sans-serif; }
.download .flags { display:flex; flex-wrap:wrap; justify-content:center; gap:8px 14px; max-width:720px; margin:0 auto; word-spacing:normal; }
.download .flags span { display:block; line-height:1.4; }
.hero { color:#171e36; background:#fafbff; box-shadow:0 0 0 100vmax #fafbff; clip-path:inset(0 -100vmax); }
.hero,.japan-proof { --ink:#171e36; --muted:#636b80; --line:#e1e5f0; --paper:#f2f5fc; --primary:#637bd9; --deep:#455fc0; --font:"Nunito Sans",sans-serif; --heading:"Nunito Sans",sans-serif; --page:1200px; font:17px/1.7 var(--font); }
:is(.hero,.japan-proof) img { max-width:100%; }
:is(.hero,.japan-proof) :focus-visible { outline:3px solid #6884eb; outline-offset:5px; }
:is(.hero,.japan-proof) ::selection { color:#192148; background:#dce3ff; }
.hero { width:min(var(--page),calc(100% - 64px)); min-height:760px; padding:60px 0 84px; grid-template-columns:1.1fr 1fr; gap:44px; }
.hero .eyebrow { display:inline-flex; align-items:center; gap:10px; margin:0; padding:7px 12px; border:1px solid #dfe5f3; border-radius:99px; background:white; color:#485675; font:500 13px var(--heading); letter-spacing:0; }
.hero .eyebrow i { width:7px; height:7px; margin:0; background:#278769; box-shadow:0 0 0 4px #e6f4ed; }
.hero .kicker,.japan-proof .kicker { margin:0 0 14px; font:600 12px var(--heading); letter-spacing:.15em; }
.hero h1 { margin:26px 0 22px; font:700 clamp(48px,5.2vw,72px)/1.12 var(--heading); letter-spacing:-.05em; }
.hero .lead { max-width:470px; font-size:18px; line-height:1.8; }
.hero .trust-line { gap:10px 18px; margin-top:27px; color:#64708c; font-size:13px; }
.hero .trust-line span::before { content:"✓"; margin-right:6px; color:var(--deep); }
.hero .hero-shot { position:relative; align-items:center; min-width:0; height:610px; isolation:isolate; }
.hero .hero-orbit { position:absolute; z-index:-1; width:104%; aspect-ratio:1; border:1px solid #dce2f2; border-radius:50%; background:radial-gradient(circle,#d9e2fc 0%,#eef2fc 52%,transparent 70%); }
.hero .hero-orbit::before,.hero .hero-orbit::after { content:""; position:absolute; inset:12%; border:1px solid #d1daf0; border-radius:50%; }
.hero .hero-orbit::after { inset:-7%; border-style:dashed; opacity:.6; }
.hero .phone { padding:7px; border:1px solid #373e54; border-radius:34px; background:#151c2e; box-shadow:0 30px 65px -25px #22336855,inset 0 0 0 2px #ffffff14; }
.hero .phone img { border-radius:27px; }
.hero .hero-shot .hero-phone-main { position:absolute; width:255px; top:32px; right:0; transform:rotate(8deg); z-index:1; }
.hero .hero-shot .hero-phone-back { position:absolute; width:232px; top:12px; left:2px; transform:rotate(-10deg); }
.hero .hero-label { position:absolute; bottom:14px; left:0; z-index:2; display:flex; align-items:center; gap:12px; padding:16px 20px; border:1px solid white; border-radius:16px; background:#ffffffed; box-shadow:0 16px 45px #273c7520; }
.hero .label-icon { display:grid; place-items:center; width:40px; height:40px; border-radius:12px; color:var(--deep); background:#eaf0ff; font-size:24px; }
.hero .hero-label strong { display:block; font:600 14px var(--heading); }
.hero .hero-label div>span { display:block; margin-top:3px; color:var(--muted); font-size:13px; }
.hero .store-badges { gap:16px; }
.hero .store-badges img { height:48px; }
.hero .store-badge-soon img { opacity:.27; }
.hero .store-badge-soon small { top:50%; transform:translate(-50%,-50%); border:1px solid #d7deef; background:#fafbff; padding:5px 10px; color:#4d566c; font:500 12px var(--heading); letter-spacing:0; text-transform:none; }
.japan-proof { grid-template-columns:1.15fr 1fr; gap:76px; padding:88px max(32px,calc((100vw - var(--page))/2)); background:#131d38; }
.japan-proof .kicker { color:#a6b9ff; }
.japan-proof h2 { margin:0 0 20px; font:600 clamp(28px,3.1vw,42px)/1.25 var(--heading); letter-spacing:-.035em; }
.japan-proof .proof-copy>p:not(.kicker) { max-width:530px; color:#b6c1dc; font-size:16px; }
.japan-proof .proof-stats { grid-template-columns:1fr 1fr 1.1fr; gap:0; margin:32px 0 24px; }
.japan-proof .proof-stats div { display:block; padding:0 16px; border:0; border-left:1px solid #34405e; border-radius:0; background:none; }
.japan-proof .proof-stats div:first-child { padding-left:0; border:0; }
.japan-proof .proof-stats strong { font:600 clamp(22px,2.25vw,30px) var(--heading); letter-spacing:-.045em; }
.japan-proof .proof-stats strong span { color:#f6d98b; font-size:18px; }
.japan-proof .proof-stats small { margin-top:7px; font-size:12px; line-height:1.6; color:#abb8d4; }
.japan-proof .proof-link { font-size:14px; text-decoration:underline; text-underline-offset:5px; color:#d5dfff; }
.japan-proof .proof-copy .proof-note { margin-top:12px!important; font-size:12px!important; color:#a3aec8!important; }
.japan-proof .proof-visual { padding:14px; border-color:#46506a; border-radius:20px; background:#ffffff06; transform:rotate(2deg); box-shadow:none; }
.japan-proof .proof-visual>span { padding:2px 5px 14px; font:500 12px var(--heading); letter-spacing:.12em; color:#d3dcf5; }
.japan-proof .proof-visual img { border-radius:10px; }
@media (min-width:851px) and (prefers-reduced-motion:no-preference) {
  .hero .hero-phone-main { animation:arrive-main .9s ease-out both; }
  .hero .hero-phone-back { animation:arrive-back 1.1s ease-out both; }
  .hero .hero-label { animation:arrive-label 1.2s ease-out both; }
}
@keyframes arrive-main { from { opacity:0; transform:translateY(24px) rotate(4deg); } to { opacity:1; transform:rotate(8deg); } }
@keyframes arrive-back { from { opacity:0; transform:translateY(32px) rotate(-5deg); } to { opacity:1; transform:rotate(-10deg); } }
@keyframes arrive-label { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:1100px) {
  .hero { gap:22px; min-height:670px; }
  .hero .hero-shot { height:520px; }
  .hero .hero-shot .hero-phone-main { width:218px; }
  .hero .hero-shot .hero-phone-back { width:198px; }
  .hero .hero-label { left:-16px; padding:12px 14px; }
  .japan-proof { gap:36px; }
}
@media (max-width:850px) {
  .hero { grid-template-columns:1fr; padding:60px 0 64px; gap:34px; }
  .hero h1 { font-size:clamp(46px,7.8vw,66px); }
  .hero .lead { max-width:540px; }
  .hero .hero-shot { width:460px; max-width:100%; height:570px; margin:auto; }
  .hero .hero-shot .hero-phone-main { width:238px; right:10px; }
  .hero .hero-shot .hero-phone-back { width:212px; left:16px; }
  .hero .hero-label { left:6px; }
  .hero .hero-orbit { width:92%; }
  .japan-proof { grid-template-columns:1fr; padding-top:64px; padding-bottom:64px; gap:36px; }
  .japan-proof .proof-copy,.japan-proof .proof-visual { width:100%; max-width:600px; margin:auto; }
  .japan-proof .proof-visual { transform:none; }
}
@media (max-width:520px) {
  .hero { width:calc(100% - 40px); }
  .hero { padding:42px 0 50px; gap:30px; }
  .hero h1 { margin-top:24px; font-size:clamp(36px,10vw,50px); letter-spacing:-.055em; }
  .hero .lead { font-size:16px; line-height:1.75; }
  .hero .trust-line { flex-direction:row; font-size:12px; gap:6px 12px; }
  .hero .store-badges { gap:12px; }
  .hero .store-badges img { height:43px; }
  .hero .hero-shot { width:330px; height:454px; }
  .hero .hero-shot .hero-phone-main { width:185px; top:26px; right:8px; }
  .hero .hero-shot .hero-phone-back { width:165px; left:4px; top:12px; }
  .hero .phone { padding:5px; border-radius:25px; }
  .hero .phone img { border-radius:20px; }
  .hero .hero-label { left:0; bottom:0; gap:9px; padding:12px; }
  .hero .hero-label strong,.hero .hero-label div>span { font-size:12px; }
  .japan-proof { padding-left:20px; padding-right:20px; }
  .japan-proof .proof-stats { grid-template-columns:1fr 1fr 1.1fr; gap:0; }
  .japan-proof .proof-stats div { padding:0 10px; }
  .japan-proof .proof-stats strong { font-size:21px; }
  .japan-proof .proof-stats small { margin-top:7px; font-size:12px; }
  .japan-proof .proof-visual>span { font-size:12px; letter-spacing:.06em; }
}
@media (max-width:360px) {
  .hero .hero-shot { height:420px; }
  .hero .hero-shot .hero-phone-main { width:170px; }
  .hero .hero-shot .hero-phone-back { width:148px; }
  .japan-proof .proof-stats { grid-template-columns:1fr; gap:18px; }
  .japan-proof .proof-stats div { display:flex; align-items:center; gap:16px; border:0; padding:0; }
  .japan-proof .proof-stats small { margin:0; }
}
@media (prefers-reduced-motion:reduce) {
  :is(.hero,.japan-proof) *,:is(.hero,.japan-proof) *::before,:is(.hero,.japan-proof) *::after { animation:none!important; transition:none!important; }
}