/* Apps page (Oct 2026): the Beam family in the cosmic desert style */
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/cormorant-garamond-latin-500-normal.woff2) format('woff2')}
.apps-page{--ap-ink:#17132e;--ap-soft:#4f4865}
.apps-page main{background:linear-gradient(180deg,#fbf8ff,#fdf7f3)}
.ap-eyebrow{margin:0 0 .9rem;font-size:.78rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#e6c27a}
.ap-eyebrow--violet{color:#7b4dff}
.ap-grad{background:linear-gradient(90deg,#f6d79a,#ffb38a 45%,#d79bff);-webkit-background-clip:text;background-clip:text;color:transparent}

/* Hero */
.ap-hero{position:relative;overflow:hidden;text-align:center;color:#fff;padding:clamp(4rem,9vw,7rem) 0 clamp(6rem,11vw,9rem);background:
  radial-gradient(60rem 24rem at 50% 108%,rgba(255,165,110,.45),transparent 70%),
  radial-gradient(40rem 30rem at 15% 20%,rgba(140,80,255,.3),transparent 70%),
  linear-gradient(180deg,#0b0826 0%,#180e42 55%,#33175e 100%)}
.ap-stars{position:absolute;inset:0;background:radial-gradient(1.5px 1.5px at 7% 20%,#fff 50%,transparent),radial-gradient(1px 1px at 18% 60%,#ffffffb0 50%,transparent),radial-gradient(2px 2px at 29% 14%,#fff 50%,transparent),radial-gradient(1px 1px at 42% 40%,#ffffffa0 50%,transparent),radial-gradient(1.5px 1.5px at 58% 10%,#fff 50%,transparent),radial-gradient(1px 1px at 69% 52%,#ffffffb0 50%,transparent),radial-gradient(2px 2px at 81% 22%,#fff 50%,transparent),radial-gradient(1px 1px at 93% 46%,#fff 50%,transparent)}
.ap-hero__arc{position:absolute;left:50%;bottom:-62%;width:min(110rem,170%);aspect-ratio:1;transform:translateX(-50%);border-radius:50%;border-top:2px solid rgba(255,225,200,.95);box-shadow:0 -14px 60px -10px rgba(255,170,130,.75),inset 0 20px 80px -30px rgba(200,140,255,.6)}
.ap-hero::after{content:"";position:absolute;left:-10%;right:-10%;bottom:-1px;height:4.5rem;background:#fbf8ff;border-radius:50% 50% 0 0/100% 100% 0 0}
.ap-hero__inner{position:relative;z-index:1;max-width:48rem}
.ap-hero h1{font-size:clamp(2.6rem,1.6rem + 4.2vw,4.8rem);line-height:1.02;letter-spacing:-.035em;margin:0 0 1.2rem;color:#fff}
.ap-lead{font-size:clamp(1.05rem,.95rem + .4vw,1.2rem);line-height:1.65;color:#ddd3f2;margin:0 auto;max-width:38rem}
.ap-icons{display:flex;justify-content:center;gap:1.2rem;margin-top:2.4rem}
.ap-icons img,.ap-icons__re{width:4.5rem;height:4.5rem;border-radius:1.2rem;box-shadow:0 14px 30px -12px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.15)}
.ap-icons__re{display:grid;place-items:center;background:#fff;color:#14112a;font-family:Georgia,'Times New Roman',serif;font-weight:700;font-size:1.7rem}
.ap-icons__re i,.ap-app__mark i{font-style:normal;color:#a54bff}

/* App panels */
.ap-list{padding:clamp(2rem,5vw,3.5rem) 0 clamp(3rem,6vw,5rem)}
.ap-list .container{display:grid;gap:clamp(1.6rem,3vw,2.4rem)}
.ap-app{position:relative;display:grid;overflow:hidden;border-radius:34px;box-shadow:0 40px 80px -50px rgba(40,20,80,.7)}
@media (min-width:56rem){.ap-app{grid-template-columns:1.05fr .95fr}.ap-app:nth-child(even) .ap-app__copy{order:2}}
.ap-app__copy{position:relative;z-index:1;padding:clamp(1.8rem,4.5vw,3.4rem)}
.ap-app h2{display:flex;align-items:center;gap:.8rem;font-size:clamp(2rem,1.5rem + 2vw,2.9rem);letter-spacing:-.03em;margin:.8rem 0 .3rem}
.ap-app__icon{width:3.2rem;height:3.2rem;border-radius:.9rem;box-shadow:0 10px 20px -10px rgba(0,0,0,.5)}
.ap-app__mark{display:inline-grid;place-items:center;width:3.2rem;height:3.2rem;border-radius:.9rem;background:#fff;color:#14112a;font-family:Georgia,'Times New Roman',serif;font-size:1.25rem;box-shadow:0 10px 20px -10px rgba(80,40,160,.5)}
.ap-app__tag{font-size:1.15rem;font-weight:600;margin:0 0 1rem}
.ap-app__copy>p:not([class]){line-height:1.7;margin:0;max-width:34rem;font-size:1.05rem}
.ap-app__status{display:flex;align-items:center;gap:.7rem;margin:0;font-size:.85rem;opacity:.9}
.ap-app__status span{padding:.3rem .8rem;border-radius:999px;font-weight:700;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
.ap-ticks{list-style:none;padding:0;margin:1.4rem 0 1.8rem;display:grid;gap:.55rem}
.ap-ticks li{position:relative;padding-left:1.8rem}
.ap-ticks li::before{content:"";position:absolute;left:0;top:.35rem;width:1.05rem;height:1.05rem;border-radius:50%}
.ap-btn{display:inline-flex;gap:.45rem;align-items:center;padding:.9rem 1.6rem;border-radius:999px;font-weight:700;text-decoration:none;transition:transform .2s}
.ap-btn:hover{transform:translateY(-2px)}
.ap-app__visual{position:relative;min-height:22rem;display:flex;align-items:center;justify-content:center;padding:2.5rem 1rem}
.ap-app__sky{position:absolute;inset:0}
.ap-phone{position:relative;width:min(15rem,62vw);padding:.5rem;border-radius:2.4rem}
.ap-phone img{display:block;width:100%;height:auto;border-radius:2rem}
.ap-phone--light{background:linear-gradient(145deg,#efe1ea,#bba5b8 40%,#f6ecf2 60%,#a3909f);box-shadow:0 40px 70px -30px rgba(60,30,90,.6);transform:rotate(-3deg)}
.ap-phone--dark{background:linear-gradient(145deg,#6d5470,#2a2140 30%,#141024 60%,#7a5a6a);box-shadow:0 40px 80px -30px rgba(0,0,0,.8),0 0 100px -20px rgba(255,170,110,.4);transform:rotate(3deg)}

/* Re. palette */
.ap-app--re{background:linear-gradient(130deg,#f6efff 0%,#f3e5fa 45%,#ffe6dc 100%);color:var(--ap-ink)}
.ap-app--re .ap-app__copy>p:not([class]),.ap-app--re .ap-ticks{color:var(--ap-soft)}
.ap-app--re .ap-app__tag{background:linear-gradient(90deg,#7b4dff,#d85fd0 55%,#ff7a5c);-webkit-background-clip:text;background-clip:text;color:transparent}
.ap-app--re .ap-app__status span{background:#ede4ff;color:#5b34e6}
.ap-app--re .ap-ticks li::before{background:linear-gradient(135deg,#7b4dff,#ff8a7a)}
.ap-btn--re{background:linear-gradient(90deg,#6b46ff,#9b55f5);color:#fff;box-shadow:0 14px 28px -14px rgba(107,70,255,.8)}
.ap-app__sky--re{background:url(/assets/img/re-hero-sky.webp) center 40%/cover;-webkit-mask-image:linear-gradient(90deg,transparent,#000 35%);mask-image:linear-gradient(90deg,transparent,#000 35%)}

/* sleepkind palette */
.ap-app--sk{background:linear-gradient(180deg,#0a0f26,#17143f 60%,#2a1c4f);color:#f7efe6}
.ap-app--sk .ap-app__copy>p:not([class]),.ap-app--sk .ap-ticks{color:#d8d0e6}
.ap-app--sk h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:500;color:#F3DDB2}
.ap-app--sk .ap-app__tag{color:#EAC88F}
.ap-app--sk .ap-app__status span{background:rgba(234,200,143,.16);color:#EAC88F}
.ap-app--sk .ap-ticks li::before{background:radial-gradient(circle at 35% 35%,#F3DDB2,#C9955F)}
.ap-btn--sk{background:linear-gradient(180deg,#F3DDB2,#E3AE72);color:#1b1533}
.ap-app__sky--sk{background:url(/assets/img/sleepkind-horizon.jpg) center 30%/cover;opacity:.85;-webkit-mask-image:linear-gradient(180deg,transparent,#000 40%);mask-image:linear-gradient(180deg,transparent,#000 40%)}

/* Beam palette */
.ap-app--beam{background:radial-gradient(60% 80% at 80% 110%,rgba(255,165,110,.35),transparent 70%),linear-gradient(160deg,#160a3a,#2a0f5e 55%,#3d1a74);color:#fff}
.ap-app--beam .ap-app__copy>p:not([class]),.ap-app--beam .ap-ticks{color:#ddd3f2}
.ap-app--beam .ap-app__tag{color:#f3cf8f}
.ap-app--beam .ap-app__status span{background:rgba(243,207,143,.16);color:#f3cf8f}
.ap-app--beam .ap-ticks li::before{background:radial-gradient(circle at 35% 35%,#ffe2a8,#e39a5c)}
.ap-btn--beam{background:linear-gradient(90deg,#f3cf8f,#ffb08a);color:#2a1456}
.ap-app__visual--mascot{padding:1.5rem}
.ap-app__visual--mascot img{width:100%;max-width:30rem;height:auto;border-radius:28px;-webkit-mask-image:radial-gradient(closest-side,#000 70%,transparent 100%);mask-image:radial-gradient(closest-side,#000 70%,transparent 100%)}

/* Picker */
.ap-pick{position:relative;overflow:hidden;text-align:center;padding:clamp(4rem,8vw,6.5rem) 0;background:linear-gradient(180deg,#fdf7f3 0%,#f4eaff 50%,#ffe8dd 100%)}
.ap-pick__arc{position:absolute;left:50%;top:50%;width:160%;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;border-top:2px solid rgba(255,255,255,.95);box-shadow:0 -10px 50px -10px rgba(255,170,200,.7)}
.ap-pick .container{position:relative}
.ap-pick h2{font-size:clamp(1.9rem,1.3rem + 2.2vw,2.9rem);letter-spacing:-.03em;color:var(--ap-ink);margin:0 0 2.2rem}
.ap-pick__grid{display:grid;gap:1rem;max-width:62rem;margin:0 auto}
@media (min-width:48rem){.ap-pick__grid{grid-template-columns:repeat(3,1fr)}}
.ap-pick__card{display:flex;flex-direction:column;justify-content:space-between;gap:1.6rem;min-height:10rem;padding:1.6rem;border-radius:24px;text-align:left;text-decoration:none;transition:transform .2s,box-shadow .2s;box-shadow:0 20px 40px -30px rgba(40,20,80,.7)}
.ap-pick__card:hover{transform:translateY(-3px)}
.ap-pick__card span{font-size:1.15rem;font-weight:600;line-height:1.35}
.ap-pick__card strong{font-size:.95rem}
.ap-pick__card strong::after{content:" \2192"}
.ap-pick__card--re{background:linear-gradient(140deg,#7b4dff,#c45ad8 60%,#ff8a7a);color:#fff}
.ap-pick__card--sk{background:linear-gradient(160deg,#0a0f26,#2a1c4f);color:#F3DDB2}
.ap-pick__card--beam{background:linear-gradient(160deg,#210052,#4a2680);color:#fff}
.ap-pick__card--beam strong{color:#f3cf8f}
.ap-pick__note{margin:1.8rem 0 0;color:var(--ap-soft)}
.ap-icons__re,.ap-app__mark{display:inline-flex;align-items:center;justify-content:center}
