/* ============================================================
   CHINMAYA — Saffron + Maroon + Cream adaptation
   Layered on top of tokens.css to re-skin the sunset palette
   toward a traditional Hindu spiritual palette while preserving
   editorial restraint.
   ============================================================ */

:root {
  /* Hindu spiritual palette */
  --saffron:        #E8782A;   /* The signature warm saffron */
  --saffron-deep:   #C25A1A;
  --saffron-soft:   #F2A865;
  --vermillion:     #B83020;   /* Sindoor / tilak red */
  --maroon:         #6B1F1A;   /* Temple maroon */
  --maroon-deep:    #4A1410;
  --maroon-ink:     #2D0E0A;
  --gold:           #C99A3F;   /* Antique gold */
  --gold-bright:    #E5B855;
  --gold-deep:      #8A6620;

  /* Surface */
  --paper:          #F8EFD6;   /* Cream (kept from tokens) */
  --paper-soft:     #FBF6E6;
  --paper-deep:     #F0E0AE;
  --paper-shadow:   #E5D6A8;
  --parchment:      #F4E8C8;

  /* Override key brand tokens so any design-system snippet that
     references them adopts the new palette. */
  --color-primary:        var(--saffron);
  --color-primary-deep:   var(--saffron-deep);
  --color-link:           var(--saffron-deep);
  --color-ink:            #1A0F0A;
  --color-ink-tint:       #2D1A12;
  --color-charcoal:       #3F2A20;

  /* Reflavoured sunset stripe → saffron-vermillion-maroon stripe */
  --gradient-sunset-stripe: linear-gradient(
    90deg,
    var(--maroon-deep)   0%,
    var(--maroon)       18%,
    var(--vermillion)   38%,
    var(--saffron)      62%,
    var(--gold-bright)  82%,
    var(--paper)       100%
  );

  --gradient-hero-sky: linear-gradient(
    180deg,
    #1A0608  0%,
    #3A0F0C 22%,
    #6B1F1A 46%,
    #B83020 68%,
    #E8782A 86%,
    #E5B855 100%
  );
}

/* ============================================================
   Shared utility classes used across both homepage directions
   ============================================================ */

.serif    { font-family: var(--font-display); font-weight: 400; }
.serif-it { font-family: var(--font-display); font-weight: 400; font-style: italic; }
.sans     { font-family: var(--font-ui); }

.eyebrow {
  font-family: var(--font-ui);
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

/* Sunset/saffron stripe used as a brand footer recognizer */
.brand-stripe {
  height: 6px;
  width: 100%;
  background: var(--gradient-sunset-stripe);
}

/* Hide the native cursor when our custom one is active */
.custom-cursor-on,
.custom-cursor-on * {
  cursor: none !important;
}

/* Reusable diya flame keyframes */
@keyframes flame-flicker {
  0%, 100% { transform: scaleY(1) scaleX(1) rotate(-1deg); opacity: 1; }
  20%      { transform: scaleY(1.05) scaleX(0.96) rotate(1deg); opacity: 0.92; }
  40%      { transform: scaleY(0.96) scaleX(1.04) rotate(-2deg); opacity: 1; }
  60%      { transform: scaleY(1.08) scaleX(0.94) rotate(2deg); opacity: 0.88; }
  80%      { transform: scaleY(0.98) scaleX(1.02) rotate(-1deg); opacity: 0.96; }
}

@keyframes flame-glow {
  0%, 100% { filter: drop-shadow(0 0 8px rgba(232,120,42,0.55)) drop-shadow(0 0 18px rgba(184,48,32,0.35)); }
  50%      { filter: drop-shadow(0 0 12px rgba(232,120,42,0.75)) drop-shadow(0 0 28px rgba(184,48,32,0.5)); }
}

@keyframes slow-spin {
  to { transform: rotate(360deg); }
}

@keyframes drift {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-12px); }
}