:root{
  --bg:#FFF8F1;
  --orange:#FF6500;
  --orange-dark:#E95800;
  --text:#1F1F1F;
  --muted:#737373;
  --card:#FFFFFF;
  --shadow-orange:rgba(255,101,0,.10);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  overflow-x:hidden;
  font-family:"Heebo",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  background:linear-gradient(180deg,#FFF3E6 0%,var(--bg) 55%,var(--bg) 100%);
  color:var(--text);
  line-height:1.5;
}
img{max-width:100%;display:block}
.wrap{max-width:760px;margin:0 auto;padding:0 20px}

a:focus-visible,
button:focus-visible{
  outline:3px solid var(--text);
  outline-offset:3px;
  border-radius:10px;
}

/* ---------- Hero ---------- */
header.hero{
  text-align:center;
  padding:44px 20px 8px;
}
.logo-frame{
  width:128px;height:128px;
  margin:0 auto 26px;
  background:#fff;
  border-radius:32px;
  display:flex;align-items:center;justify-content:center;
  padding:14px;
  box-shadow:0 12px 30px var(--shadow-orange);
}
.logo-frame img{
  width:100%;height:100%;object-fit:contain;border-radius:20px;
}
.logo-frame .logo-emoji{
  font-size:56px;line-height:1;
}
header.hero h1{
  font-size:clamp(24px,5.4vw,34px);
  font-weight:800;
  margin:0 0 14px;
  color:var(--text);
}
header.hero p.tagline{
  font-size:clamp(15px,3.6vw,17px);
  font-weight:400;
  color:var(--muted);
  max-width:520px;
  margin:0 auto 32px;
}

.cta-main{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:58px;
  background:var(--orange);
  color:#fff;
  font-size:18px;
  font-weight:700;
  padding:16px 40px;
  border-radius:16px;
  text-decoration:none;
  box-shadow:0 10px 26px rgba(255,101,0,.32);
  animation:pulse-cta 2.8s ease-in-out infinite;
  border:none;
  cursor:pointer;
  font-family:inherit;
}
@media (hover:hover) and (pointer:fine){
  .cta-main:hover{
    background:var(--orange-dark);
    animation-play-state:paused;
    transform:translateY(-2px);
    box-shadow:0 14px 30px rgba(255,101,0,.4);
  }
}
@keyframes pulse-cta{
  0%,100%{ box-shadow:0 10px 26px rgba(255,101,0,.32); transform:scale(1); }
  50%{ box-shadow:0 14px 32px rgba(255,101,0,.46); transform:scale(1.025); }
}
@media (prefers-reduced-motion:reduce){
  .cta-main{animation:none}
}

/* Coming-soon state (niches with no invite link configured yet) — inert,
   not a link, no pulse, visually muted so it never reads as clickable. */
.cta-main.disabled{
  background:#D8D2CB;
  color:#7A7368;
  box-shadow:none;
  animation:none;
  cursor:not-allowed;
}
@media (hover:hover) and (pointer:fine){
  .cta-main.disabled:hover{
    background:#D8D2CB;
    transform:none;
    box-shadow:none;
  }
}

/* ---------- Bullets ---------- */
section.bullets{padding:52px 0 56px}
.bullets ul{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:1fr 1fr;gap:16px;
}
.bullets li{
  background:var(--card);
  border-radius:18px;
  padding:26px 18px;
  text-align:center;
  box-shadow:0 4px 18px rgba(0,0,0,.05);
  transition:transform .15s ease, box-shadow .15s ease;
}
@media (hover:hover) and (pointer:fine){
  .bullets li:hover{
    transform:translateY(-3px);
    box-shadow:0 10px 24px rgba(0,0,0,.08);
  }
}
.bullets li .emoji{display:block;font-size:34px;margin-bottom:12px;line-height:1}
.bullets li span.label{
  display:block;
  font-weight:700;
  font-size:15.5px;
  color:var(--text);
}

footer{
  text-align:center;
  padding:8px 20px 64px;
}
footer p{color:var(--muted);font-size:13px;margin:0}

/* ---------- Sticky mobile CTA ---------- */
.sticky-cta{
  position:fixed;
  inset-inline:0;
  bottom:0;
  z-index:40;
  display:none;
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  background:linear-gradient(0deg, rgba(255,248,241,.98) 55%, rgba(255,248,241,0));
  transform:translateY(120%);
  transition:transform .25s ease;
}
.sticky-cta.visible{transform:translateY(0)}
.sticky-cta a{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  background:var(--orange);
  color:#fff;
  font-weight:700;
  font-size:16px;
  border-radius:14px;
  text-decoration:none;
  box-shadow:0 8px 22px rgba(255,101,0,.38);
}

@media (max-width:640px){
  header.hero{padding:28px 20px 4px}
  .logo-frame{width:104px;height:104px;margin-bottom:18px}
  header.hero h1{margin-bottom:10px}
  header.hero p.tagline{margin-bottom:24px}
  .cta-main{width:100%;max-width:420px;padding:16px 24px}
  section.bullets{padding:36px 0 120px}
  .bullets ul{grid-template-columns:1fr}
  .sticky-cta{display:block}
}