@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700;900&family=Inter:wght@300;400;500;600&family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400&display=swap');

/* ─── ROOT ────────────────────────────────────── */
:root {
  --bg:        #F8F6F1;
  --surface:   #FFFFFF;
  --border:    #E8E4DC;
  --text:      #1A1A18;
  --muted:     #6B6860;
  --green:     #1B382B;
  --green-dk:  #122019;
  --gold:      #C8A56A;

  /* Ojaya palette */
  --oj-bg:     #060D09;
  --oj-card:   #0C1A10;
  --oj-border: rgba(200,165,106,0.25);
  --oj-gold:   #D4AF6A;
  --oj-text:   #E8D9BC;
}

/* ─── BASE ────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: 'Inter', system-ui, sans-serif;
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
}

h1,h2,h3,h4,.serif { font-family: 'Playfair Display', Georgia, serif; }
.cinzel              { font-family: 'Cinzel', serif; }

/* ─── GOLD GRADIENT TEXT ──────────────────────── */
.gold-text {
  background: linear-gradient(135deg, #F0D080 0%, #D4AF6A 45%, #A07830 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ─── FROSTED GLASS HEADER ────────────────────── */
.glass-header {
  background: rgba(255,255,255,0.93);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

/* ─── OJAYA PORTAL ────────────────────────────── */
.oj-portal-bg {
  background: var(--oj-bg);
}

.oj-card {
  background: var(--oj-card);
  border: 1px solid var(--oj-border);
  transition: border-color .3s, box-shadow .3s;
}

.oj-card:hover {
  border-color: rgba(212,175,106,0.55);
  box-shadow: 0 24px 48px rgba(0,0,0,.55), 0 0 0 1px rgba(212,175,106,.15);
}

/* ─── SCROLLBAR ───────────────────────────────── */
::-webkit-scrollbar       { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: #C8C4BC; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--green); }

.no-scrollbar                    { scrollbar-width: none; -ms-overflow-style: none; }
.no-scrollbar::-webkit-scrollbar { display: none; }