/*
Theme Name:        Brahamaj
Theme URI:         https://brahamaj.com
Author:            Brahamaj / Priyancaa Jain
Description:       Custom Elementor-powered theme for Brahamaj — Tarot, Akashic Records & Psychic Readings.
Version:           1.0.0
Requires at least: 6.3
Tested up to:      6.5
Requires PHP:      8.0
License:           Private
Text Domain:       brahamaj
Tags:              elementor, custom-post-types, acf, spiritual
*/

/* ═══ DESIGN TOKENS ═══ */
:root {
  --bj-deep-purple:    #3b0764;
  --bj-purple-mid:     #5b21b6;
  --bj-purple-accent:  #7c3aed;
  --bj-purple-light:   #ede9fe;
  --bj-purple-soft:    #f5f3ff;
  --bj-gold:           #a16207;
  --bj-gold-mid:       #ca8a04;
  --bj-gold-light:     #eab308;
  --bj-gold-pale:      #fef9c3;
  --bj-crimson:        #7f1d1d;
  --bj-crimson-light:  #b91c1c;
  --bj-page-bg:        #f9f7ff;
  --bj-surface:        #ffffff;
  --bj-surface-2:      #f3f0ff;
  --bj-surface-3:      #ede9fe;
  --bj-dark:           #1e0a3c;
  --bj-text-dark:      #1e0a3c;
  --bj-text-body:      #3b0764;
  --bj-text-muted:     #6b7280;
  --bj-text-light:     #374151;
  --bj-border:         rgba(124,58,237,0.15);
  --bj-shadow-purple:  rgba(124,58,237,0.12);
  --bj-font-display:   'Cinzel', serif;
  --bj-font-body:      'Cormorant Garamond', serif;
  --bj-font-ui:        'Raleway', sans-serif;
  --bj-transition:     all 0.3s ease;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--bj-font-ui);
  background-color: var(--bj-page-bg);
  color: var(--bj-text-body);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: var(--bj-transition); }

/* ═══ PICK-A-CARD SECTION ═══ */
.bj-pick-cards {
  display: flex; align-items: flex-end; justify-content: center;
  perspective: 1000px; height: 180px; position: relative; margin: 48px auto 32px;
}
.bj-pick-card {
  width: 90px; height: 140px; border-radius: 10px;
  border: 2px solid rgba(212,175,55,0.35);
  background: linear-gradient(145deg, var(--bj-surface-3) 0%, var(--bj-purple-light) 60%, var(--bj-gold-pale) 100%);
  cursor: pointer; transition: all 0.4s cubic-bezier(0.175,0.885,0.32,1.275);
  transform-origin: bottom center; position: absolute;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 2px 4px 20px rgba(0,0,0,0.15); user-select: none; overflow: hidden;
}
.bj-pick-card::before { content: '✦'; font-size: 1.8rem; color: rgba(124,58,237,0.3); pointer-events: none; }
.bj-pick-card .bj-card-cover-img,
.bj-pick-card .bj-card-active-img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; border-radius: 8px; transition: opacity 0.4s ease;
}
.bj-pick-card .bj-card-active-img { opacity: 0; }
.bj-pick-card.active-state .bj-card-cover-img  { opacity: 0; }
.bj-pick-card.active-state .bj-card-active-img { opacity: 1; }
.bj-pick-card[data-pos="0"] { transform: rotate(-20deg) translateY(10px); left: calc(50% - 225px); }
.bj-pick-card[data-pos="1"] { transform: rotate(-12deg) translateY(4px);  left: calc(50% - 150px); }
.bj-pick-card[data-pos="2"] { transform: rotate(-4deg)  translateY(0px);  left: calc(50% - 75px);  }
.bj-pick-card[data-pos="3"] { transform: rotate(4deg)   translateY(0px);  left: calc(50% - 15px);  }
.bj-pick-card[data-pos="4"] { transform: rotate(12deg)  translateY(4px);  left: calc(50% + 60px);  }
.bj-pick-card[data-pos="5"] { transform: rotate(20deg)  translateY(10px); left: calc(50% + 135px); }
.bj-pick-card:hover {
  transform: translateY(-40px) rotate(0deg) scale(1.08) !important;
  border-color: var(--bj-purple-accent);
  box-shadow: 0 20px 50px rgba(124,58,237,0.25), 0 0 30px rgba(234,179,8,0.2); z-index: 10;
}
.bj-pick-card.picked {
  transform: translateY(-50px) rotate(0deg) scale(1.15) !important;
  border-color: var(--bj-purple-accent); border-width: 2.5px;
  box-shadow: 0 24px 60px rgba(124,58,237,0.35), 0 0 40px rgba(124,58,237,0.25);
  z-index: 20; pointer-events: none;
  background: linear-gradient(145deg, var(--bj-purple-accent), var(--bj-purple-mid), var(--bj-deep-purple));
}
.bj-pick-card.picked::before { content: ''; }

/* Card Reveal */
.bj-pick-reveal-wrap { max-width: 680px; margin: 0 auto; display: none; }
.bj-pick-reveal-wrap.visible { display: block; animation: bjRevealIn 0.5s ease both; }
@keyframes bjRevealIn { from { opacity:0; transform: translateY(24px); } to { opacity:1; transform:translateY(0); } }
.bj-pick-reveal-box {
  background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 40%, #fef9c3 100%);
  border: 1.5px solid rgba(124,58,237,0.2); border-radius: 16px;
  padding: 44px 48px; text-align: center;
  box-shadow: 0 20px 60px rgba(124,58,237,0.12); margin-top: 32px;
}

/* ═══ COMMENTS ═══ */
.bj-comments-wrap { max-width: 780px; margin: 64px auto 0; }
.bj-comment-form {
  background: linear-gradient(145deg, #fff, #f5f3ff);
  border: 1.5px solid rgba(124,58,237,0.14); border-radius: 12px;
  padding: 36px; box-shadow: 0 4px 24px rgba(124,58,237,0.09);
  display: flex; flex-direction: column; gap: 16px; margin-bottom: 40px;
}
.bj-comment-input, .bj-comment-textarea {
  background: #fff; border: 1.5px solid rgba(124,58,237,0.22); border-radius: 8px;
  padding: 13px 16px; color: var(--bj-text-dark);
  font-family: var(--bj-font-ui); font-size: 0.88rem;
  outline: none; transition: var(--bj-transition); width: 100%;
}
.bj-comment-input:focus, .bj-comment-textarea:focus {
  border-color: var(--bj-purple-accent); background: #f9f7ff;
  box-shadow: 0 0 0 3px rgba(124,58,237,0.1);
}
.bj-comment-textarea { resize: vertical; min-height: 110px; line-height: 1.6; }
.bj-comments-list { display: flex; flex-direction: column; gap: 16px; }
.bj-comment-card {
  background: var(--bj-surface); border: 1px solid var(--bj-border);
  border-radius: 6px; padding: 22px 24px;
  box-shadow: 0 1px 8px rgba(124,58,237,0.05); transition: border-color 0.3s;
}
.bj-comment-card:hover { border-color: rgba(124,58,237,0.25); }
.bj-comment-card.hidden-comment { display: none; }
.bj-comment-card-avatar {
  width: 34px; height: 34px; border-radius: 50%;
  background: linear-gradient(135deg, var(--bj-purple-accent), var(--bj-crimson));
  border: 1.5px solid rgba(212,175,55,0.3);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--bj-font-display); font-size: 0.72rem;
  color: var(--bj-gold-light); font-weight: 700; flex-shrink: 0;
}
.bj-res-tag-yes     { color: #4ade80; border-color: rgba(74,222,128,0.3); background: rgba(74,222,128,0.08); }
.bj-res-tag-partial { color: var(--bj-gold); border-color: rgba(212,175,55,0.3); background: rgba(212,175,55,0.08); }
.bj-res-tag-no      { color: #f87171; border-color: rgba(248,113,113,0.3); background: rgba(248,113,113,0.08); }
.bj-load-more-btn {
  font-family: var(--bj-font-display); font-size: 0.68rem; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--bj-purple-accent);
  border: 1.5px solid rgba(124,58,237,0.3); padding: 11px 32px; border-radius: 9999px;
  cursor: pointer; background: rgba(255,255,255,0.6); transition: var(--bj-transition);
}
.bj-load-more-btn:hover { background: var(--bj-purple-light); border-color: var(--bj-purple-accent); }

/* ═══ TESTIMONIAL SLIDERS ═══ */
.bj-slider-track-wrap { overflow: hidden; padding: 12px 0 24px; }
.bj-slider-track {
  display: flex; gap: 20px; padding: 0 48px;
  transition: transform 0.5s cubic-bezier(0.25,0.8,0.25,1); will-change: transform;
}
.bj-tcard-video {
  background: linear-gradient(160deg, var(--bj-surface-3), var(--bj-purple-light));
  border: 1px solid rgba(124,58,237,0.2); border-radius: 8px;
  width: 220px; min-width: 220px; aspect-ratio: 9/16;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 14px; cursor: pointer; position: relative; overflow: hidden;
  transition: all 0.35s cubic-bezier(0.25,0.8,0.25,1); flex-shrink: 0;
}
.bj-tcard-video:hover {
  border-color: rgba(124,58,237,0.5); transform: translateY(-8px) scale(1.02);
  box-shadow: 0 20px 40px rgba(124,58,237,0.15);
}
.bj-tcard-text {
  background: var(--bj-surface); border: 1px solid var(--bj-border); border-radius: 8px;
  box-shadow: 0 2px 12px rgba(124,58,237,0.06); padding: 32px 28px;
  width: 340px; min-width: 340px; display: flex; flex-direction: column; gap: 16px;
  transition: all 0.35s; flex-shrink: 0; position: relative; overflow: hidden;
}
.bj-tcard-text:hover {
  border-color: rgba(124,58,237,0.3); transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(124,58,237,0.1);
}
.bj-slider-dots { display: flex; gap: 6px; justify-content: center; margin-top: 20px; }
.bj-slider-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: rgba(124,58,237,0.15); border: 1px solid rgba(124,58,237,0.25);
  cursor: pointer; transition: var(--bj-transition);
}
.bj-slider-dot.active { background: var(--bj-purple-accent); width: 20px; border-radius: 3px; }
.bj-slider-btn {
  width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid rgba(124,58,237,0.25); background: var(--bj-surface-3);
  color: var(--bj-purple-accent); display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: var(--bj-transition);
}
.bj-slider-btn:hover {
  background: var(--bj-purple-accent); color: #fff; border-color: var(--bj-purple-accent);
}

/* ═══ ANIMATIONS ═══ */
@keyframes bjFadeUp { from { opacity:0; transform:translateY(30px); } to { opacity:1; transform:translateY(0); } }
@keyframes bjPulseLine { 0%,100% { opacity:0.4; } 50% { opacity:1; } }

/* ═══ RESPONSIVE ═══ */
@media (max-width: 768px) {
  .bj-pick-cards { height: 160px; }
  .bj-pick-card { width: 72px; height: 112px; }
  .bj-pick-card[data-pos="0"] { left: calc(50% - 168px); }
  .bj-pick-card[data-pos="1"] { left: calc(50% - 110px); }
  .bj-pick-card[data-pos="2"] { left: calc(50% - 54px);  }
  .bj-pick-card[data-pos="3"] { left: calc(50% - 0px);   }
  .bj-pick-card[data-pos="4"] { left: calc(50% + 54px);  }
  .bj-pick-card[data-pos="5"] { left: calc(50% + 108px); }
  .bj-pick-reveal-box { padding: 28px 24px; }
  .bj-slider-track { padding: 0 20px; }
  .bj-tcard-video { width: 180px; min-width: 180px; }
  .bj-tcard-text  { width: 280px; min-width: 280px; }
}
@media (max-width: 480px) {
  .bj-pick-cards { height: 140px; }
  .bj-pick-card { width: 60px; height: 94px; }
  .bj-pick-card[data-pos="0"] { left: calc(50% - 140px); }
  .bj-pick-card[data-pos="1"] { left: calc(50% - 92px);  }
  .bj-pick-card[data-pos="2"] { left: calc(50% - 46px);  }
  .bj-pick-card[data-pos="3"] { left: calc(50% + 0px);   }
  .bj-pick-card[data-pos="4"] { left: calc(50% + 46px);  }
  .bj-pick-card[data-pos="5"] { left: calc(50% + 92px);  }
  .bj-comment-form { padding: 22px 18px; }
  .bj-tcard-video { width: 160px; min-width: 160px; }
  .bj-tcard-text  { width: 260px; min-width: 260px; }
}