
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600&family=Spline+Sans+Mono&display=swap');

body {
  margin: 0;
  font-family: 'Inter', sans-serif;
  background-color: #2C2C2C; /* Mycelium Dust */
  color: #E3E3E3;            /* Soft Luminous Gray */
}

/* Header styles removed - now using Tailwind classes */

/* Remove the header h1 styles since we're using Tailwind classes now */
/* header h1 {
  margin: 0;
  font-family: 'Spline Sans Mono', monospace;
  color: #C1FFD7;
} */

nav a {
  color: #FFF4A3; /* Soft Glowing Yellow */
  margin-left: 1rem;
  text-decoration: none;
  font-weight: 600;
}

.hero {
  padding: 4rem 2rem;
  text-align: center;
}

.hero h2 {
  font-family: 'Spline Sans Mono', monospace;
  font-size: 2rem;
  margin-bottom: 1rem;
  color: #C1FFD7; /* Spore Glow */
}

.hero p {
  font-size: 1.1rem;
  max-width: 600px;
  margin: 0 auto;
}

.cta-button {
  margin-top: 2rem;
  background-color: #4C3F91; /* Blue-Violet */
  color: #E3E3E3;
  padding: 0.75rem 1.5rem;
  border: none;
  border-radius: 8px;
  font-weight: 600;
  font-size: 1rem;
  cursor: pointer;
  transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.cta-button:hover {
  background-color: #FFF4A3; /* Soft Glowing Yellow */
  color: #2C2C2C;
  box-shadow: 0 0 10px #FFF4A3;
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */

/* Logo styles - added here to ensure they override Tailwind */
.logo-sparkspore, 
a.logo-sparkspore {
  font-family: 'Spline Sans Mono', monospace !important;
  color: #C1FFD7 !important; /* Spore Glow */
  font-weight: 600 !important;
}

/* Additional specificity for header logo */
header .logo-sparkspore,
header a.logo-sparkspore {
  color: #C1FFD7 !important; /* Spore Glow */
}


