/* ==========================================================================
   Between Us: inner page system (About, Contact, Download, Privacy & Terms)
   Loaded after style.css and fx.css.
   ========================================================================== */

/* ---------- living background: slow monochrome aurora + film grain ---------- */
.bg-aurora{position:fixed; inset:0; z-index:-1; pointer-events:none; overflow:hidden; background:#000;}
.bg-aurora::before,.bg-aurora::after{
  content:""; position:absolute; width:70vmax; height:70vmax; border-radius:50%; filter:blur(90px); opacity:.16;
  background:radial-gradient(circle at center, #ffffff 0%, transparent 62%);
  animation:auroraA 26s ease-in-out infinite alternate;
}
.bg-aurora::before{top:-30vmax; left:-20vmax;}
.bg-aurora::after{bottom:-35vmax; right:-25vmax; opacity:.10; animation:auroraB 32s ease-in-out infinite alternate;}
.bg-aurora .grain{position:absolute; inset:-50%; opacity:.06; animation:grain 1.2s steps(6) infinite;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");}
@keyframes auroraA{to{transform:translate(18vmax, 22vmax) scale(1.15);}}
@keyframes auroraB{to{transform:translate(-20vmax, -16vmax) scale(1.1);}}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-5%)}60%{transform:translate(-2%,4%)}80%{transform:translate(5%,2%)}100%{transform:translate(0,0)}}

/* ---------- layout ---------- */
.wrap{max-width:1120px; margin:0 auto; padding:0 24px;}
.sec{padding:clamp(64px,9vw,112px) 0;}
.sec.tight{padding-top:clamp(40px,5vw,64px);}
.split{display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(36px,6vw,72px); align-items:center;}
.split.rev > :first-child{order:2;}
.grid2{display:grid; grid-template-columns:repeat(2,1fr); gap:20px;}
.grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.grid4{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
@media (max-width:920px){ .split{grid-template-columns:1fr;} .split.rev > :first-child{order:0;} .grid3,.grid4{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .grid2,.grid3,.grid4{grid-template-columns:1fr;} }

/* ---------- type ---------- */
.eyebrow{display:inline-flex; align-items:center; gap:10px; font-size:12px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:#8f8f8f; margin-bottom:18px;}
.eyebrow::before{content:none;}
.sec h2.display{font-family:"Anton",Impact,sans-serif; font-weight:400; font-size:clamp(38px,5.4vw,68px); line-height:.98; letter-spacing:.005em; text-transform:uppercase;
  border:none; padding:0; margin:0 0 22px; color:#fff;}
.sec h2.display em{font-style:normal; -webkit-text-stroke:1.5px #fff; color:transparent;}
.lead{font-size:clamp(16px,1.5vw,18.5px); color:#cfcfcf; line-height:1.75; margin-bottom:18px;}
.muted{color:#8a8a8a;}
.center-head{text-align:center; max-width:720px; margin:0 auto 48px;}
.center-head .eyebrow{justify-content:center;}

/* ---------- cards ---------- */
.pcard{border:1px solid #232323; border-radius:24px; padding:28px 26px; background:linear-gradient(180deg, rgba(20,20,20,.92), rgba(6,6,6,.92));
  box-shadow:0 1px 0 rgba(255,255,255,.04) inset;}
.pcard h3{font-size:18px; margin:0 0 10px; color:#fff;}
.pcard p{font-size:14.5px; color:#a9a9a9; line-height:1.65; margin:0;}
.ic{width:50px; height:50px; border-radius:15px; border:1.5px solid #fff; display:grid; place-items:center; margin-bottom:20px;}
.ic svg{width:24px; height:24px; stroke:#fff; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;}
a.pcard{display:block; text-decoration:none; color:inherit; transition:border-color .25s ease;}
a.pcard .go{display:inline-flex; align-items:center; gap:8px; margin-top:18px; font-size:13.5px; font-weight:700; color:#fff;}
a.pcard .go span{transition:transform .25s ease;}
a.pcard:hover .go span{transform:translateX(5px);}

/* ---------- buttons ---------- */
.btns{display:flex; gap:12px; flex-wrap:wrap; margin-top:10px;}
.btn-solid,.btn-ghost{display:inline-flex; align-items:center; gap:10px; padding:14px 22px; border-radius:999px; font-weight:800; font-size:14px; letter-spacing:.04em; text-decoration:none; transition:transform .2s ease, background .2s ease, color .2s ease;}
.btn-solid{background:#fff; color:#000; border:2px solid #fff;}
.btn-ghost{background:transparent; color:#fff; border:2px solid #3a3a3a;}
.btn-solid:hover,.btn-ghost:hover{transform:translateY(-2px);}
.btn-ghost:hover{border-color:#fff;}

/* ---------- phone mockup (illustration, sample content only) ---------- */
.stage{position:relative; display:grid; place-items:center; min-height:560px;}
.rings{position:absolute; inset:0; display:grid; place-items:center; pointer-events:none;}
.rings span{position:absolute; width:260px; height:260px; border-radius:50%; border:1px solid rgba(255,255,255,.22); animation:ringOut 6s linear infinite; opacity:0;}
.rings span:nth-child(2){animation-delay:2s;} .rings span:nth-child(3){animation-delay:4s;}
@keyframes ringOut{0%{transform:scale(.6); opacity:0;} 15%{opacity:.9;} 100%{transform:scale(2.4); opacity:0;}}
.phone{position:relative; width:270px; height:556px; border-radius:46px; background:#060606; border:9px solid #161616;
  box-shadow:0 50px 120px rgba(0,0,0,.85), 0 0 0 1px #2b2b2b, inset 0 0 0 1px #222; overflow:hidden; z-index:1;}
.phone::before{content:""; position:absolute; top:10px; left:50%; transform:translateX(-50%); width:84px; height:24px; border-radius:14px; background:#000; z-index:3;}
.phone .screen{position:absolute; inset:0; padding:46px 14px 16px; display:flex; flex-direction:column; gap:11px; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;}
.float{animation:floatY 7s ease-in-out infinite;}
.float.slow{animation-duration:9s; animation-delay:-3s;}
@keyframes floatY{0%,100%{transform:translateY(0) rotate(var(--rot,0deg));} 50%{transform:translateY(-16px) rotate(var(--rot,0deg));}}
.duo{position:relative; display:flex; justify-content:center; align-items:center; min-height:600px;}
.duo .phone:nth-child(2){--rot:-7deg; margin-right:-60px; margin-top:60px;}
.duo .phone:last-child{--rot:6deg;}
@media (max-width:600px){ .duo{overflow:hidden; padding:20px 0;} .duo .phone{width:190px; height:392px; border-radius:36px; border-width:7px;} .duo .phone:nth-child(2){margin-right:-74px;} .stage,.duo{min-height:460px;} }

.m-top{display:flex; justify-content:space-between; align-items:center; color:#fff; font-weight:800; font-size:14px; padding:0 2px 4px;}
.m-top i{width:22px; height:22px; border-radius:50%; background:linear-gradient(135deg,#f4c6ff,#9ad7ff);}
.m-tabs{display:flex; gap:6px;}
.m-tabs span{font-size:10.5px; padding:5px 10px; border-radius:999px; border:1px solid #2a2a2a; color:#aaa;}
.m-tabs span.on{background:#fff; color:#000; border-color:#fff; font-weight:700;}
.m-card{border:1px solid #1d1d1d; border-radius:18px; padding:11px; background:#0d0d0e;}
.m-head{display:flex; align-items:center; gap:9px; margin-bottom:9px;}
.m-av{width:30px; height:30px; border-radius:50%; flex-shrink:0;}
.m-av.a1{background:linear-gradient(135deg,#ffd29a,#ff8fa3);} .m-av.a2{background:linear-gradient(135deg,#9ad7ff,#b49cff);} .m-av.a3{background:linear-gradient(135deg,#b6f5c8,#5ad1c3);} .m-av.a4{background:linear-gradient(135deg,#ffe58a,#ffb36b);}
.m-head b{display:block; font-size:11.5px; color:#ff8fb1;} .m-head small{display:block; font-size:9.5px; color:#777;}
.m-text{font-size:11px; color:#ddd; line-height:1.45; margin:0 0 8px;}
.m-audio{display:flex; align-items:center; gap:8px;}
.m-play{width:24px; height:24px; border-radius:50%; background:#fff; flex-shrink:0; position:relative;}
.m-play::after{content:""; position:absolute; left:9px; top:7px; border-left:8px solid #000; border-top:5px solid transparent; border-bottom:5px solid transparent;}
.m-wave{display:flex; align-items:center; gap:2.5px; height:22px; flex:1;}
.m-wave i{display:block; width:2.5px; height:100%; border-radius:3px; background:#fff; opacity:.8; animation:fxWave 1.1s ease-in-out infinite;}
.m-meta{display:flex; gap:12px; font-size:9.5px; color:#8a8a8a; margin-top:8px;}
.m-room{border:1px solid #1d1d1d; border-radius:20px; padding:14px; background:radial-gradient(120% 80% at 50% 0%, #1a1a1d, #0b0b0c);}
.m-room h4{margin:0 0 4px; font-size:13px; color:#fff;} .m-room .live{font-size:9.5px; color:#ff6b88; font-weight:800; letter-spacing:.08em;}
.m-speakers{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:16px; justify-items:center;}
.m-speak{position:relative; width:52px; height:52px; border-radius:50%;}
.m-speak.talk::after{content:""; position:absolute; inset:-5px; border-radius:50%; border:2px solid #fff; animation:speakPulse 1.4s ease-out infinite;}
@keyframes speakPulse{0%{transform:scale(.92); opacity:1;} 100%{transform:scale(1.25); opacity:0;}}
.m-label{font-size:9px; color:#aaa; text-align:center; margin-top:4px;}
.m-sheet{margin-top:auto; border:1px solid #232323; border-radius:18px; padding:12px; background:#101011;}
.m-sheet .row{display:flex; align-items:center; gap:10px; padding:9px 6px; border-bottom:1px solid #1c1c1c; font-size:11.5px; color:#ddd;}
.m-sheet .row:last-child{border-bottom:none;}
.m-sheet .row i{width:22px; height:22px; border-radius:7px; border:1.3px solid #fff; flex-shrink:0;}
.m-toast{position:absolute; left:14px; right:14px; bottom:16px; background:#fff; color:#000; border-radius:14px; padding:11px 12px; font-size:11px; font-weight:700;
  display:flex; align-items:center; gap:8px; animation:toastLoop 7s ease-in-out infinite; z-index:2;}
.m-toast::before{content:"\2713"; width:18px; height:18px; border-radius:50%; background:#000; color:#fff; display:grid; place-items:center; font-size:11px; flex-shrink:0;}
@keyframes toastLoop{0%,12%{transform:translateY(140%); opacity:0;} 20%,70%{transform:none; opacity:1;} 80%,100%{transform:translateY(140%); opacity:0;}}

/* ---------- credits / list rows ---------- */
.credits{display:grid; grid-template-columns:repeat(5,1fr); gap:14px;}
@media (max-width:920px){ .credits{grid-template-columns:repeat(2,1fr);} }
.credit{border:1px solid #232323; border-radius:20px; padding:20px; text-decoration:none; color:inherit; background:rgba(10,10,10,.85); transition:border-color .25s ease;}
.credit .mono{width:42px; height:42px; border-radius:12px; background:#fff; color:#000; display:grid; place-items:center; font-family:"Anton",Impact,sans-serif; font-size:20px; margin-bottom:14px;}
.credit b{display:block; font-size:15px; color:#fff;}
.credit small{display:block; font-size:12.5px; color:#8f8f8f; margin-top:4px; line-height:1.5;}
.credit:hover{border-color:#fff;}

/* ---------- founders ---------- */
.founder{display:flex; gap:18px; align-items:flex-start;}
.founder .mono-lg{width:64px; height:64px; border-radius:20px; flex-shrink:0; display:grid; place-items:center; font-weight:800; font-size:20px; color:#000;}
.founder .role{font-size:12.5px; color:#8f8f8f; margin:2px 0 12px;}

/* ---------- call-to-action band ---------- */
.cta-band{position:relative; overflow:hidden; border:1px solid #262626; border-radius:32px; padding:clamp(40px,6vw,72px); text-align:center;
  background:radial-gradient(90% 140% at 50% 0%, #1b1b1e 0%, #050505 70%);}
.cta-band h2{font-family:"Anton",Impact,sans-serif; font-weight:400; font-size:clamp(36px,5vw,62px); border:none; padding:0; margin:0 0 14px; text-transform:uppercase; line-height:1;}
.cta-band p{color:#bdbdbd; margin:0 auto 26px; max-width:520px;}
.cta-band .btns{justify-content:center;}
.cta-band .wave{position:absolute; left:0; right:0; bottom:-6px; height:70px; opacity:.12; gap:6px; margin:0;}
.cta-band .wave b{width:6px;}

/* ---------- notice strip ---------- */
.notice{display:flex; gap:16px; align-items:flex-start; border:1px solid #3a2a2a; background:linear-gradient(90deg, rgba(255,90,110,.08), rgba(255,90,110,.02)); border-radius:20px; padding:20px 22px;}
.notice .dot{width:10px; height:10px; border-radius:50%; background:#ff5a6e; margin-top:7px; flex-shrink:0; box-shadow:0 0 0 0 rgba(255,90,110,.6); animation:sosPulse 2s infinite;}
@keyframes sosPulse{0%{box-shadow:0 0 0 0 rgba(255,90,110,.55);} 70%{box-shadow:0 0 0 14px rgba(255,90,110,0);} 100%{box-shadow:0 0 0 0 rgba(255,90,110,0);}}
.notice p{margin:0; font-size:14.5px; color:#e3c9cc;}
.notice b{color:#fff;}

/* ---------- store buttons ---------- */
.store{display:flex; align-items:center; gap:14px; border:1.5px solid #2e2e2e; border-radius:20px; padding:16px 22px; text-decoration:none; color:#fff; background:rgba(10,10,10,.85); transition:border-color .25s ease, transform .25s ease;}
.store:hover{border-color:#fff; transform:translateY(-2px);}
.store svg{width:34px; height:34px; flex-shrink:0;}
.store small{display:block; font-size:11.5px; color:#9a9a9a;}
.store strong{display:block; font-size:18px;}

/* ---------- legal: at a glance + table of contents ---------- */
.glance{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
@media (max-width:920px){ .glance{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){ .glance{grid-template-columns:1fr;} }
.glance .pcard{padding:22px;}
.glance .pcard h3{font-size:15.5px;}
.legal-layout{display:grid; grid-template-columns:250px 1fr; gap:56px; align-items:start;}
@media (max-width:920px){ .legal-layout{grid-template-columns:1fr;} .toc{position:static !important; display:none;} }
.toc{position:sticky; top:96px; border-left:1px solid #262626; padding-left:18px;}
.toc .toc-h{font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:#777; margin:0 0 10px; font-weight:700;}
.toc a{display:block; font-size:13.5px; color:#8f8f8f; text-decoration:none; padding:6px 0; transition:color .2s ease, transform .2s ease;}
.toc a:hover{color:#fff;}
.toc a.on{color:#fff; transform:translateX(4px);}
.toc .toc-h + a{margin-top:0;}
.toc .gap{height:18px;}
.legal-doc{max-width:760px;}
.legal-doc .doc-title{font-family:"Anton",Impact,sans-serif; font-weight:400; font-size:clamp(34px,4.4vw,52px); text-transform:uppercase; border:none; padding:0; margin:0 0 10px; scroll-margin-top:90px;}
.legal-doc .doc-sub{color:#8f8f8f; font-size:14px; margin-bottom:36px;}
.legal-sec{border-top:1px solid #1f1f1f; padding:28px 0 8px; scroll-margin-top:90px;}
.legal-sec h3{display:flex; gap:14px; align-items:baseline; font-size:18px; margin:0 0 12px;}
.legal-sec h3 .n{font-family:"Anton",Impact,sans-serif; font-weight:400; font-size:15px; color:#6f6f6f; min-width:26px;}
.legal-sec p,.legal-sec li{font-size:15.5px; color:#cfcfcf; line-height:1.75;}
.legal-sec ul{padding-left:20px;}
.legal-sec li{margin-bottom:8px;}
.legal-sec li::marker{color:#666;}
.legal-sec a{color:#fff;}
.doc-break{height:72px;}

@media (prefers-reduced-motion: reduce){
  .bg-aurora::before,.bg-aurora::after,.bg-aurora .grain,.rings span,.float,.m-wave i,.m-speak.talk::after,.m-toast,.notice .dot{animation:none;}
  .m-toast{transform:none; opacity:1;}
}

/* ==========================================================================
   Privacy page hero: cipher field, self-drawing shield, decoding title
   ========================================================================== */
.cipher-hero{position:relative; height:clamp(460px,72svh,760px); overflow:hidden; background:#000; display:grid; place-items:center;}
.cipher-field{position:absolute; inset:0; width:100%; height:100%;}
.cipher-center{position:relative; z-index:2; text-align:center; padding:0 24px; max-width:720px;}
.cipher-center h1{font-family:"Anton",Impact,sans-serif; font-weight:400; font-size:clamp(46px,8vw,104px); line-height:.95; letter-spacing:.01em; text-transform:uppercase; margin:0 0 14px; color:#fff;}
.cipher-center .updated{margin:0 0 26px; color:#9a9a9a; font-size:14.5px; letter-spacing:.04em;}
.cipher-links{display:flex; gap:12px; justify-content:center; flex-wrap:wrap;}
.cipher-links a{display:inline-flex; align-items:center; gap:8px; padding:12px 20px; border-radius:999px; border:1.5px solid #3a3a3a; color:#fff; text-decoration:none; font-size:14px; font-weight:700; background:rgba(0,0,0,.6); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); transition:border-color .2s ease, transform .2s ease;}
.cipher-links a:hover{border-color:#fff; transform:translateY(-2px);}

.shield-anim{position:relative; width:88px; height:100px; margin:0 auto 22px;}
.shield-anim svg{position:relative; z-index:1; width:100%; height:100%; overflow:visible;}
.shield-anim .s{fill:none; stroke:#fff; stroke-width:2.2; stroke-linejoin:round; stroke-dasharray:320; stroke-dashoffset:320; animation:shieldDraw 1.6s .15s cubic-bezier(.6,0,.2,1) forwards;}
.shield-anim .lock{opacity:0; transform:translateY(6px); transform-box:fill-box; animation:lockIn .6s 1.35s ease forwards;}
.shield-anim .lock rect,.shield-anim .lock path{fill:none; stroke:#fff; stroke-width:2.2; stroke-linecap:round;}
.shield-anim::before,.shield-anim::after{content:""; position:absolute; left:50%; top:50%; width:150px; height:150px; margin:-75px 0 0 -75px; border-radius:50%; border:1px solid rgba(255,255,255,.35); opacity:0; animation:shieldPulse 3.2s 1.8s ease-out infinite;}
.shield-anim::after{animation-delay:3.4s;}
@keyframes shieldDraw{to{stroke-dashoffset:0;}}
@keyframes lockIn{to{opacity:1; transform:none;}}
@keyframes shieldPulse{0%{transform:scale(.5); opacity:.9;} 100%{transform:scale(1.9); opacity:0;}}
.cipher-hero::after{content:""; position:absolute; left:0; right:0; bottom:0; height:120px; background:linear-gradient(transparent,#000); z-index:1; pointer-events:none;}

/* drifting dot pattern behind the summary cards */
.pattern-sec{position:relative;}
.pattern-sec::before{content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.55;
  background-image:radial-gradient(rgba(255,255,255,.22) 1px, transparent 1.4px); background-size:22px 22px;
  -webkit-mask-image:radial-gradient(70% 80% at 50% 50%, #000 30%, transparent 75%); mask-image:radial-gradient(70% 80% at 50% 50%, #000 30%, transparent 75%);
  animation:dotDrift 30s linear infinite;}
@keyframes dotDrift{to{background-position:220px 110px;}}

@media (prefers-reduced-motion: reduce){
  .shield-anim .s{animation:none; stroke-dashoffset:0;} .shield-anim .lock{animation:none; opacity:1; transform:none;}
  .shield-anim::before,.shield-anim::after,.pattern-sec::before{animation:none;}
}

/* ==========================================================================
   Page heroes v2 (About, Contact, Download): text left, motion behind
   ========================================================================== */
.hero2{position:relative; min-height:clamp(560px, 86svh, 900px); overflow:hidden; background:#000; display:flex; align-items:center;}
.hero-canvas{position:absolute; inset:0; width:100%; height:100%;}
.hero2::after{content:""; position:absolute; left:0; right:0; bottom:0; height:140px; background:linear-gradient(transparent,#000); pointer-events:none; z-index:1;}
.hero2 .wrap{position:relative; z-index:2; width:100%; max-width:1200px;}
.hero2-grid{display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:48px; align-items:center; padding:72px 0;}
.hero2-text{max-width:700px;}
.hero2-title{font-family:"Anton",Impact,sans-serif; font-weight:400; text-transform:uppercase; text-align:left; letter-spacing:.005em;
  font-size:clamp(44px,6.6vw,94px); line-height:.94; margin:0 0 24px; color:#fff;}
.hero2-title .ln{display:block; overflow:hidden; padding-bottom:.04em;}
.hero2-title .ln > span{display:inline-block; transform:translateY(105%); animation:lineUp .9s cubic-bezier(.2,.8,.2,1) forwards;}
.hero2-title .ln:nth-child(2) > span{animation-delay:.12s;} .hero2-title .ln:nth-child(3) > span{animation-delay:.24s;}
.hero2-title em{font-style:normal; -webkit-text-stroke:1.6px #fff; color:transparent;}
@keyframes lineUp{to{transform:none;}}
.hero2-sub{font-size:clamp(16px,1.6vw,19px); color:#cfcfcf; line-height:1.7; max-width:540px; margin:0 0 28px; text-align:left; opacity:0; animation:fadeUp .8s .45s ease forwards;}
.hero2 .btns{opacity:0; animation:fadeUp .8s .6s ease forwards;}
.hero2 .eyebrow{opacity:0; animation:fadeUp .7s .05s ease forwards;}
@keyframes fadeUp{from{opacity:0; transform:translateY(12px);} to{opacity:1; transform:none;}}
@media (max-width:900px){
  .hero2-grid{grid-template-columns:1fr; gap:36px; padding:56px 0 72px;}
  .hero2{min-height:auto;}
}

/* section heads: left aligned, title + note side by side on wide screens */
.sec-head{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.8fr); gap:24px 56px; align-items:end; margin-bottom:44px;}
.sec-head h2.display{margin:0;}
.sec-head p{margin:0; color:#a9a9a9; font-size:16px; line-height:1.7;}
@media (max-width:900px){ .sec-head{grid-template-columns:1fr;} }
.wrap.wide{max-width:1200px;}

/* ---------- Download: phone with orbiting features ---------- */
.orbit-stage{position:relative; width:min(520px, 100%); aspect-ratio:1; margin:0 auto; display:grid; place-items:center;}
.orbit-stage .phone{transition:transform .25s ease-out; width:236px; height:486px;}
.orbit{position:absolute; inset:0; border-radius:50%; border:1px dashed rgba(255,255,255,.18); animation:spin 36s linear infinite;}
.orbit.o2{inset:12%; animation-duration:26s; animation-direction:reverse;}
.orbit .planet{position:absolute; top:-26px; left:50%; margin-left:-26px; width:52px; height:52px; border-radius:16px; background:#0c0c0c; border:1.5px solid #fff; display:grid; place-items:center;
  animation:spin 36s linear infinite reverse; box-shadow:0 10px 30px rgba(0,0,0,.6);}
.orbit.o2 .planet{animation-duration:26s; animation-direction:normal;}
.orbit .planet.p2{top:auto; bottom:-26px;}
.orbit .planet svg{width:24px; height:24px; stroke:#fff; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;}
@keyframes spin{to{transform:rotate(360deg);}}
@media (max-width:600px){ .orbit-stage .phone{width:190px; height:392px; border-radius:36px; border-width:7px;} .orbit .planet{width:44px; height:44px; margin-left:-22px; top:-22px;} .orbit .planet.p2{bottom:-22px;} }

/* ---------- store badges (accurate Apple / Google Play marks) ---------- */
.badges{display:flex; gap:12px; flex-wrap:wrap; margin:6px 0 16px;}
.badge{display:inline-flex; align-items:center; gap:10px; height:56px; padding:0 18px 0 14px; border-radius:12px; background:#000; border:1.5px solid #a6a6a6; color:#fff; text-decoration:none; transition:border-color .2s ease, transform .2s ease;}
.badge:hover{border-color:#fff; transform:translateY(-2px);}
.badge svg{width:28px; height:28px; fill:#fff; flex-shrink:0;}
.badge .t{display:flex; flex-direction:column; line-height:1.05;}
.badge small{font-size:11px; letter-spacing:.02em;}
.badge strong{font-size:21px; font-weight:600; letter-spacing:-.01em;}
.badge.play small{text-transform:uppercase; font-size:10px; letter-spacing:.06em;}

/* ---------- a different moving pattern for each page ---------- */
.pat{position:relative; isolation:isolate; overflow-x:clip;}
.stage{overflow-x:clip;}
.pat::before{content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  -webkit-mask-image:radial-gradient(75% 80% at 50% 50%, #000 25%, transparent 78%); mask-image:radial-gradient(75% 80% at 50% 50%, #000 25%, transparent 78%);}
.pat-lines::before{opacity:.5; background-image:repeating-linear-gradient(135deg, rgba(255,255,255,.10) 0 1px, transparent 1px 18px); animation:patLines 24s linear infinite;}
@keyframes patLines{to{background-position:254px 0;}}
.pat-rings::before{opacity:.55; background-image:repeating-radial-gradient(circle at 50% 50%, rgba(255,255,255,.10) 0 1px, transparent 1px 34px); background-size:100% 100%; animation:patRings 8s ease-in-out infinite;}
@keyframes patRings{0%,100%{transform:scale(1);} 50%{transform:scale(1.06);}}
.pat-grid::before{opacity:.5; background-image:linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px); background-size:44px 44px; animation:patGrid 20s linear infinite;}
@keyframes patGrid{to{background-position:44px 44px, 44px 44px;}}

@media (prefers-reduced-motion: reduce){
  .hero2-title .ln > span,.hero2-sub,.hero2 .btns,.hero2 .eyebrow{animation:none; transform:none; opacity:1;}
  .orbit,.orbit .planet,.pat::before{animation:none;}
}

/* ---------- links inside running text are always underlined ---------- */
.lead a,.pcard p a,.legal-sec a,.notice a,.doc-sub a,.muted a,.hero2-sub a,.bios a,.art-credits a,.credit-note a{
  color:#fff; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; text-decoration-color:rgba(255,255,255,.55); transition:text-decoration-color .2s ease;}
.lead a:hover,.pcard p a:hover,.legal-sec a:hover,.notice a:hover,.doc-sub a:hover,.muted a:hover,.hero2-sub a:hover,.bios a:hover,.art-credits a:hover,.credit-note a:hover{text-decoration-color:#fff;}

/* ---------- credits with real logos: every logo in an identical tile ---------- */
.credit{display:flex; flex-direction:column;}
.credit .logo{width:100%; max-width:128px; height:64px; border-radius:18px; background:#111; border:1px solid #262626; display:grid; place-items:center; margin-bottom:16px; flex-shrink:0; overflow:hidden; padding:0 14px; box-sizing:border-box;}
.credit .logo svg{width:36px; height:36px; display:block;}
.credit .logo img{max-width:100%; max-height:34px; width:auto; height:auto; object-fit:contain; display:block;}
.credit .logo img.invert{filter:invert(1);}
.credit .logo .mono{width:38px; height:38px; margin:0; font-size:18px; border-radius:10px;}
.credit b{min-height:1.4em;}
.art-credits{margin-top:28px; border-top:1px solid #1f1f1f; padding-top:22px; color:#9a9a9a; font-size:13.5px; line-height:1.9;}
.art-credits b{color:#d6d6d6; font-weight:700;}

/* ---------- About: closing band with a sweeping light border + breathing glow ---------- */
.cta-band.sweep{border:none; background:#060606; isolation:isolate;}
.cta-band.sweep::before{content:""; position:absolute; inset:-60%; z-index:-2;
  background:conic-gradient(from 0deg, transparent 0 62%, rgba(255,255,255,.75) 72%, transparent 82% 100%); animation:sweepSpin 6s linear infinite;}
.cta-band.sweep::after{content:""; position:absolute; inset:1.5px; border-radius:31px; z-index:-1;
  background:radial-gradient(60% 90% at 50% 0%, #19191c 0%, #050505 70%);}
.cta-band.sweep .glow{position:absolute; left:50%; top:46%; width:420px; height:420px; margin:-210px 0 0 -210px; border-radius:50%; z-index:-1; pointer-events:none;
  background:radial-gradient(circle, rgba(255,255,255,.10) 0%, transparent 65%); animation:breathe 5s ease-in-out infinite;}
@keyframes sweepSpin{to{transform:rotate(360deg);}}
@keyframes breathe{0%,100%{transform:scale(.85); opacity:.6;} 50%{transform:scale(1.15); opacity:1;}}

/* ---------- the co-founders: one section, side by side, text only ---------- */
.founders{border:1px solid #232323; border-radius:28px; padding:clamp(28px,4vw,48px); background:linear-gradient(180deg, rgba(18,18,18,.9), rgba(6,6,6,.9));}
.founders .row{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(28px,4vw,56px); margin-top:30px;}
.founders article{border-top:1px solid #2a2a2a; padding-top:22px;}
.founders h3{font-size:20px; color:#fff; margin:0 0 4px;}
.founders .role{font-size:13px; letter-spacing:.06em; text-transform:uppercase; color:#8f8f8f; margin:0 0 14px;}
.founders p{font-size:15px; color:#bdbdbd; line-height:1.8; margin:0 0 14px;}
.founders .mail{font-size:14.5px; margin:0;}
.founders a{color:#fff; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; text-decoration-color:rgba(255,255,255,.55);}
.founders a:hover{text-decoration-color:#fff;}
@media (max-width:760px){ .founders .row{grid-template-columns:1fr;} }
@media (prefers-reduced-motion: reduce){ .cta-band.sweep::before,.cta-band.sweep .glow{animation:none;} }