/* CCU Ledger of Clarity v2 */
:root{
  --bg:#000; --gold:#FFD700; --gold-soft:#C0A000; --text:#E8E8E8; --muted:#A9A9A9; --card:#0A0A0A; --line:rgba(255,255,255,0.08);
  --red:#FF3B30; --green:#34C759; --blue:#007AFF;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background: radial-gradient(1200px 800px at 10% -10%, #111 0%, #000 60%) no-repeat, var(--bg);
  color:var(--text); font-family:Poppins, system-ui, -apple-system, Segoe UI, Roboto, sans-serif; overflow-x:hidden;
}
#particles{ position:fixed; inset:0; z-index:0; filter:blur(.2px); opacity:.6; pointer-events:none; }
.watermark{ position:fixed; top:50%; left:50%; width:min(70vmin,900px); transform:translate(-50%,-50%); opacity:.10; z-index:0; pointer-events:none; }
.site-header,.container,.site-footer{ position:relative; z-index:1; }
.site-header{ text-align:center; padding:4rem 1rem 1.2rem; border-bottom:1px solid var(--line); }
.site-header h1{ font-family:Cinzel,serif; letter-spacing:.06em; color:var(--gold); font-size:clamp(1.8rem,2.6vw,2.8rem); margin:.2rem 0 .8rem; }
.tag{ color:#cfcfcf; font-weight:300; letter-spacing:.02em; }
.mantra{ font-weight:600; margin:0 .35rem; }
.mantra.red{ color:var(--red); } .mantra.green{ color:var(--green); } .mantra.blue{ color:var(--blue); }
.container{ max-width:1000px; margin:2rem auto 0; padding:0 1.25rem;}
.search-wrap{ display:flex; justify-content:center; margin:1.5rem 0 2rem;}
#search{ width:min(680px,92vw); padding:0.9rem 1rem; border-radius:12px; border:1px solid var(--line); background:#0b0b0b; color:#fff; outline:none; font-size:1rem; transition: box-shadow .25s ease,border-color .25s ease;}
#search:focus{ box-shadow:0 0 0 6px rgba(255,215,0,0.08); border-color: rgba(255,215,0,0.35);}
.faqs{ display:grid; gap:12px;}
.faq-item{ background:linear-gradient(180deg,#0D0D0D,#0A0A0A); border:1px solid var(--line); border-radius:14px; overflow:hidden; transition:transform .2s, box-shadow .2s;}
.faq-item:hover{ transform:translateY(-1px); box-shadow:0 0 24px rgba(255,215,0,0.10);}
.q{ width:100%; background:transparent; color:var(--gold); text-align:left; padding:1.05rem 1.1rem; border:0; font-weight:600; display:flex; align-items:center; justify-content:space-between; cursor:pointer; font-size:1.02rem;}
.q .chev{ margin-left:1rem; transition:transform .25s;}
.a{ max-height:0; overflow:hidden; background:#0F0F0F; border-top:1px solid var(--line); transition:max-height .4s, padding .2s; padding:0 1.1rem;}
.a p{ color:#d2d2d2; line-height:1.65;}
.faq-item.open .a{ padding:1rem 1.1rem 1.15rem; max-height:640px;} .faq-item.open .q .chev{ transform:rotate(90deg);}
.site-footer{ text-align:center; padding:2rem 1rem 3rem; color:var(--muted); font-size:.95rem; border-top:1px solid var(--line);}

/* VisionBot orb */
.visionbot-orb{ position:fixed; right:24px; bottom:24px; width:74px; height:74px; z-index:3; cursor:pointer; display:grid; place-items:center; }
.orb-core{ width:58px; height:58px; border-radius:50%; background: radial-gradient(circle at 35% 35%, #FFF 0%, #FFF5C4 15%, #FFD700 38%, #C0A000 60%, rgba(0,0,0,0) 70%);
  box-shadow:0 0 24px rgba(255,215,0,0.6), 0 0 60px rgba(255,215,0,0.25); animation:pulse 3.5s ease-in-out infinite; }
.orb-ring{ position:absolute; width:74px; height:74px; border-radius:50%; box-shadow: inset 0 0 16px rgba(255,215,0,0.25); filter: blur(.2px); }
.orb-halo{ position:absolute; width:110px; height:110px; border-radius:50%; background: radial-gradient(circle, rgba(255,215,0,0.18), rgba(255,215,0,0)); animation:breathe 6s ease-in-out infinite; }
@keyframes pulse{ 0%,100%{transform:scale(1)} 50%{transform:scale(1.06)} } @keyframes breathe{ 0%,100%{opacity:.35} 50%{opacity:.6} }

/* Thought bubbles */
.thoughts{ position:absolute; bottom:82px; right:4px; width:220px; pointer-events:none;}
.bubble{ position:absolute; right:0; padding:.55rem .7rem; border-radius:18px; background:rgba(15,15,15,0.9); color:#EDEDED; border:1px solid rgba(255,215,0,0.25); font-size:.86rem; opacity:0; transform:translateY(10px) scale(.98); filter:drop-shadow(0 6px 12px rgba(0,0,0,.25)); animation:rise 8.5s linear forwards; }
@keyframes rise{ 0%{opacity:0; transform:translateY(10px) scale(.98)} 8%{opacity:1} 85%{opacity:1; transform:translateY(-110px) scale(1.02)} 100%{opacity:0; transform:translateY(-140px) scale(1.05)} }

/* Chat */
.chatbox{ position:fixed; right:24px; bottom:110px; width:min(380px,96vw); height:60vh; max-height:560px; background:linear-gradient(180deg,#0E0E0E 0%,#0A0A0A 100%); border:1px solid var(--line); border-radius:16px; box-shadow:0 16px 40px rgba(0,0,0,.45); display:none; flex-direction:column; overflow:hidden; z-index:4;}
.chatbox.open{ display:flex; }
.chat-head{ display:flex; align-items:center; gap:.75rem; padding:.8rem .9rem; border-bottom:1px solid var(--line);}
.chat-head .dot{ width:10px; height:10px; border-radius:50%; background:var(--green); box-shadow:0 0 12px rgba(52,199,89,.6); }
.chat-head .sub{ font-size:.8rem; color:#c9c9c9; }
.chat-head .close{ margin-left:auto; background:transparent; color:#fff; border:0; font-size:1.3rem; cursor:pointer;}
.chat-body{ padding:1rem; overflow:auto; display:flex; flex-direction:column; gap:.6rem;}
.msg{ max-width:85%; padding:.7rem .9rem; border-radius:12px; line-height:1.5; font-size:.95rem; }
.msg.bot{ background:#111; border:1px solid var(--line); }
.msg.user{ background:#141414; border:1px solid rgba(255,255,255,0.07); margin-left:auto; }
.chat-input{ display:flex; gap:.5rem; padding:.8rem .9rem; border-top:1px solid var(--line);}
.chat-input input{ flex:1; padding:.7rem .8rem; border-radius:10px; border:1px solid var(--line); background:#0c0c0c; color:#fff; outline:none;}
.chat-input .send{ background: linear-gradient(90deg, var(--gold), var(--gold-soft)); color:#000; font-weight:700; border:0; padding:.65rem 1rem; border-radius:999px; cursor:pointer; }