/* LUNA RISING™ - Brand Architecture
   80% Enchanted (Indie/Iridescent) | 20% Structured (Scientific Efficiency)
*/

@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;1,300&family=Inter:wght@300;400;700&display=swap");

:root {
  /* 20% B Structure: High-Readability Tones */
  --luna-ink: #1a1523; /* Deep Violet-Black (Headlines) */
  --luna-graphite: #4b5563; /* Dark Gray (TM & Secondary Text) */

  /* 80% A Vibe: Enchanted Accents */
  --solar-flare: #fde68a; /* Lighter, shimmering soft gold */
  --luna-violet: #4c1d95; /* Core Brand Violet */
  --luna-cream: #fdfaff; /* Background Base */
}

body {
  font-family: "Inter", sans-serif;
  background-color: var(--luna-cream);
  color: var(--luna-ink);
  margin: 0;
  -webkit-font-smoothing: antialiased;
}

/* Iridescent Mesh Background */
.iridescent-mesh {
  background-image: radial-gradient(
      at 0% 0%,
      rgba(196, 181, 253, 0.15) 0px,
      transparent 50%
    ),
    radial-gradient(at 100% 0%, rgba(253, 230, 138, 0.12) 0px, transparent 50%),
    radial-gradient(at 50% 100%, rgba(244, 114, 182, 0.05) 0px, transparent 50%);
  background-attachment: fixed;
}

/* Slogan Typography */
.serif-slogan {
  font-family: "Cormorant Garamond", serif;
  font-weight: 300;
  letter-spacing: -0.02em;
  line-height: 1.05;
}

/* TM Logic: Dark Gray, No Italics, Small & Precise */
.wordmark-wrapper {
  position: relative;
  display: inline-block;
}

.tm-mark {
  position: absolute;
  top: -1px;
  right: -1.2rem;
  font-size: 7.5px;
  font-weight: 700;
  color: var(--luna-graphite);
  font-style: normal;
  letter-spacing: 0.05em;
  line-height: 1;
}

/* Structured Glass Cards */
.glass-box {
  background: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(12px);
  border: 1.5px solid var(--luna-ink);
  box-shadow: 6px 6px 0px rgba(46, 16, 101, 0.05);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.glass-box:hover {
  border-color: var(--solar-flare);
  transform: translate(-2px, -2px);
  box-shadow: 10px 10px 0px rgba(253, 230, 138, 0.2);
}

/* Highlight Text (Ingredients) */
.text-solar-flare {
  color: #d1a100; /* Darker version for readability on white, but same family */
  font-weight: 700;
}

.btn-luna {
  background-color: var(--luna-ink);
  color: white;
  border-radius: 2px;
  transition: all 0.3s ease;
}

.btn-luna:hover {
  background-color: var(--luna-violet);
  box-shadow: 0 10px 20px -10px var(--luna-violet);
}