/* Radical Rise — coming soon
   Layout: one centered column (logo, message, contact buttons) on soft lavender.
   One typeface (Poppins, as in the logo tagline). Light theme by choice. */

/* ---------- tokens ---------- */
:root {
  color-scheme: light;
  --color-ink: #070537;          /* logo wordmark */
  --color-ink-soft: #55526F;
  --color-paper: #F8F6FC;
  --color-card: #FFFFFF;
  --color-line: #E6E1F1;
  --color-violet: #5C02D6;
  --color-magenta: #E31F8B;
  --color-orange: #FA860D;
  --gradient-brand: linear-gradient(90deg, var(--color-violet), var(--color-magenta) 60%, var(--color-orange));

  --font-body: "Poppins", "Segoe UI", system-ui, sans-serif;
  --fs-title: clamp(2rem, 4.4vw, 3.25rem);
  --fs-lead: 1.125rem;
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-tiny: 0.8125rem;

  --space-2: 8px;  --space-3: 12px; --space-4: 16px; --space-6: 24px;
  --space-8: 32px; --space-12: 48px;

  --radius-pill: 999px;
  --radius-card: 16px;
  --shadow-card: 0 16px 40px -24px rgba(34, 2, 137, .3);
  --ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  font: 400 var(--fs-body)/1.6 var(--font-body);
  color: var(--color-ink);
  background:
    radial-gradient(38rem 26rem at 50% 0%, rgba(227, 31, 139, .08), transparent 70%),
    var(--color-paper);
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
a:focus-visible { outline: 3px solid var(--color-magenta); outline-offset: 3px; border-radius: 6px; }

/* ---------- layout ---------- */
.page-shell {
  position: relative;
  overflow: hidden;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-8);
  padding-inline: 16px;
  padding-block: var(--space-12) var(--space-6);
}
.page-shell > * { position: relative; z-index: 1; }


/* ---------- hero ---------- */
.hero {
  width: 100%;
  max-width: 640px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-6);
  text-align: center;
}
.hero .hero-logo { width: 250px; margin-bottom: var(--space-2); }


.hero-title {
  margin: 0;
  font-size: var(--fs-title);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -.02em;
  text-wrap: balance;
}
.hero-title em {
  font-style: normal;
  background: var(--gradient-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.hero-lead { margin: 0; max-width: 48ch; font-size: var(--fs-lead); color: var(--color-ink-soft); }

/* ---------- buttons ---------- */
.hero-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-3); margin-top: var(--space-2); }
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 48px;
  padding: 0 var(--space-6);
  font: 500 var(--fs-body)/1 var(--font-body);
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: var(--radius-pill);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), background-color .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.btn svg { flex: none; width: 20px; height: 20px; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { color: var(--color-card); background: var(--gradient-brand); box-shadow: var(--shadow-card); }
.btn-primary:hover { box-shadow: 0 18px 36px -16px rgba(227, 31, 139, .55); }
.btn-outline { color: var(--color-ink); background: var(--color-card); border-color: var(--color-line); }
.btn-outline:hover { border-color: var(--color-magenta); color: var(--color-magenta); }

/* ---------- footer ---------- */
.site-footer p { margin: 0; font-size: var(--fs-tiny); color: var(--color-ink-soft); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}