/* Hero preview typography and primary button measured from Fora's App
   component. Approved Acadex logo and provisional copy are preserved. */
.hero .workspace-welcome {
  width: 100%;
  color: rgba(255, 255, 255, .8);
  font-family: Inter, Arial, sans-serif;
  font-weight: 400;
  letter-spacing: -.02em;
}
.hero .workspace-welcome h2 {
  margin-top: 8px;
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: -.02em;
  color: rgba(255, 255, 255, .8);
}
.hero .workspace-welcome p {
  font-family: inherit;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: -.02em;
  color: rgba(255, 255, 255, .65);
}
.hero .welcome-details {
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  color: rgba(255, 255, 255, .8);
}
.hero .button-cover {
  position: relative;
  width: 100%;
  max-width: 420px;
  height: 42px;
  min-height: 42px;
  padding: 0 36px;
  border: 0;
  border-radius: 768px;
  background: rgba(255, 255, 255, .8);
  color: #000;
  box-shadow: none;
  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  letter-spacing: -.02em;
  white-space: normal;
  transition: background-color .4s var(--source-spring-bounce);
}
.hero .button-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid #fff3f0;
  border-radius: inherit;
  pointer-events: none;
}
.hero .button-cover:hover {
  background: #fff3f0;
  box-shadow: none;
  transform: none;
}
@media (max-width: 809.98px) {
  .hero .workspace-welcome {padding-inline: 16px}
  .hero .welcome-details {gap: 6px 12px}
  .hero .button-cover {padding-inline: 16px}
}
@media (prefers-reduced-motion: reduce) {
  .hero .button-cover {transition: none}
}

/* Community preview: source order, 6px inner gap, 24px between groups. */
.hero .workspace-sidebar nav a[aria-disabled="true"] {cursor:default}
.hero .room-welcome {gap:24px;max-width:476px;margin-top:-40px}
.hero .room-heading {width:100%;display:flex;flex-direction:column;align-items:center;gap:6px}
.hero .room-heading h2 {margin:0;min-height:24px}
.hero .room-members {display:flex;align-items:center;justify-content:center;gap:6px;color:#fffc;font:400 14px/21px Inter,Arial,sans-serif;white-space:nowrap}
.hero .room-avatars {position:relative;display:block;flex:none;width:40px;height:20px}
.hero .room-avatar {position:absolute;top:0;left:0;width:20px;height:20px;border-radius:100px;background-image:url('assets/community/demo-avatars.png');background-size:300% 100%;background-position:0 50%}
.hero .room-avatar:nth-child(2) {left:10px;background-position:50% 50%}
.hero .room-avatar:nth-child(3) {left:20px;background-position:100% 50%}
.hero .room-count-demo {font-size:10px;color:#fffc}
.hero .room-welcome .button-cover {margin:0;flex:none}
.hero .room-welcome p {max-width:420px;min-height:36px;margin:0}
@media(max-width:809.98px) {
  .hero .room-welcome {padding:16px;margin-top:-20px;gap:24px}
  .hero .room-heading h2 {font-size:16px;line-height:24px}
  .hero .room-welcome p {font-size:12px;line-height:18px;min-height:54px}
}