:root{
  --bg:#0b0e13;
  --panel:#121723;
  --muted:#9aa7b5;
  --text:#e6edf3;
  --gold:#e9d28b;
  --gold-2:#b9913b;
  --turq:#00c8d8;
  --silver:#cfd0d1;
  --ring: rgba(0,200,216,0.18);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Outfit,system-ui,Segoe UI,Roboto,Ubuntu,sans-serif;line-height:1.55}
a{color:var(--gold)}
.container{width:min(1100px,92%);margin-inline:auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(11,14,19,0.8);backdrop-filter:blur(6px);border-bottom:1px solid rgba(255,255,255,0.06)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.brand{display:flex;align-items:center;gap:10px}
.logo{height:44px}
.badge{font-weight:700;color:#111;background:linear-gradient(135deg,var(--gold),var(--gold-2));padding:.25rem .5rem;border-radius:999px;font-size:.8rem}
.nav{display:flex;gap:14px;align-items:center}
.nav a{padding:.5rem .75rem;border-radius:10px;text-decoration:none;color:var(--text);opacity:.9;transition:.25s}
.nav a:hover{background:#1a2130;opacity:1}
.btn{display:inline-block;border:1px solid rgba(255,255,255,.15);padding:.8rem 1rem;border-radius:14px;text-decoration:none;font-weight:600;transition:.25s;cursor:pointer}
.btn-outline{background:transparent}
.btn-gold{background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#111;border:none;box-shadow:0 8px 24px rgba(233,210,139,.18)}
.btn-gold:hover{transform:translateY(-1px)}
.btn-ghost{background:#1a2130}
.btn-ghost:hover{border-color:rgba(255,255,255,.3)}

.hero{position:relative;min-height:72vh;display:grid;place-items:center;background:radial-gradient(1200px 400px at 50% 0%, rgba(45,182,194,0.15), transparent 60%), url('data:image/svg+xml;utf8,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 1600 900%22><defs><linearGradient id=%22g%22 x1=%220%22 x2=%221%22><stop offset=%220%25%22 stop-color=%22%23caa65a%22/><stop offset=%2250%25%22 stop-color=%22%23e9d28b%22/><stop offset=%22100%25%22 stop-color=%22%23b9913b%22/></linearGradient></defs><g fill=%22none%22 stroke=%22url(%23g)%22 stroke-opacity=%220.25%22><path d=%22M0 600 Q400 550 800 600 T1600 600%22/><path d=%22M0 640 Q400 590 800 640 T1600 640%22/><path d=%22M0 680 Q400 630 800 680 T1600 680%22/></g></svg>') center/cover no-repeat}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(to top, rgba(11,14,19,1) 0%, rgba(11,14,19,.6) 45%, rgba(11,14,19,0) 100%)}
.hero-content{position:relative;text-align:center;padding:60px 0;animation:fadeUp .8s ease-out both}
.title{font-size:clamp(1.8rem,4.2vw,3.2rem);margin:0 0 .5rem}
.subtitle{max-width:900px;margin:0 auto 1.2rem;color:var(--muted)}
.glow{text-shadow:0 0 18px rgba(233,210,139,0.35)}
.cta-group{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.ticker{position:absolute;bottom:0;width:100%;padding:8px 0;background:rgba(18,23,35,.7);border-top:1px solid rgba(255,255,255,.06);font-size:.9rem;color:var(--muted);overflow:hidden}
.ticker span{display:inline-block;white-space:nowrap;animation:marquee 28s linear infinite}

.section{padding:64px 0}
.section-title{font-size:1.8rem;margin:0 0 .5rem}
.muted{color:var(--muted)}
.grid.modules{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:18px}
.card{background:var(--panel);border:1px solid rgba(255,255,255,.06);padding:18px;border-radius:16px;box-shadow:0 10px 32px rgba(0,0,0,.25);transition:.25s}
.card:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(0,0,0,.35)}
.card h3{margin-top:0}
.card ol{margin:8px 0 0 1rem}

.private-wrap{background:linear-gradient(180deg,rgba(233,210,139,0.08), transparent 35%);padding:18px;border-radius:18px;border:1px solid rgba(233,210,139,0.15)}
.private-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.gate{display:grid;gap:10px;margin:12px 0 18px}
.gate-row{display:flex;gap:8px;flex-wrap:wrap}
.gate input{flex:1;min-width:240px;background:#0e1422;border:1px solid rgba(255,255,255,.12);color:var(--text);padding:.8rem 1rem;border-radius:12px;outline:none;box-shadow:0 0 0 0 var(--ring)}
.gate input:focus{border-color:var(--gold);box-shadow:0 0 0 6px var(--ring)}
.private.hidden{display:none}
.notice{background:#0e1422;border:1px dashed rgba(233,210,139,.35);padding:12px;border-radius:12px;margin-bottom:12px}
details{background:#0f1524;border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:8px 12px;margin:10px 0}
details summary{cursor:pointer;font-weight:600}
.lessons{list-style:none;padding-left:0;margin:8px 0}
.lessons li{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px dashed rgba(255,255,255,.06)}
.lessons li:last-child{border-bottom:none}
.hint{color:var(--muted);font-size:.9rem}

.legal.small{font-size:.85rem;color:var(--muted)}

.site-footer{border-top:1px solid rgba(255,255,255,.06);padding:24px 0;background:#0b0f19}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:16px}
.whatsapp-fab{position:fixed;right:18px;bottom:18px;background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#111;width:54px;height:54px;display:grid;place-items:center;border-radius:999px;box-shadow:0 10px 24px rgba(233,210,139,.35);text-decoration:none}
.whatsapp-fab:hover{transform:translateY(-2px)}

@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

@media (max-width:720px){
  .nav{display:none}
}


/* Logos */
.brand .logo{height:48px; width:auto; display:block}
.brand .xau{height:36px; width:auto; display:block; margin-left:6px}

/* Animated chart canvas in hero */
#chartBg{
  position:absolute; inset:0;
  width:100%; height:100%;
  z-index:0; opacity:0.28;
}

/* Ensure hero content overlays the canvas */
.hero .hero-content, .hero .hero-overlay, .hero .ticker{ position:relative; z-index:1; }

/* Vivid numeric icons for lists */
.card ol{ list-style:none; counter-reset:item; padding-left:0; }
.card ol li{ counter-increment:item; padding-left:44px; position:relative; min-height:32px; }
.card ol li::before{
  content: counter(item);
  position:absolute; left:0; top:4px;
  width:30px; height:30px; display:grid; place-items:center;
  font-weight:800;
  border-radius:999px; color:#111;
  background: radial-gradient(120% 140% at 30% 30%, var(--gold) 0%, var(--gold-2) 60%);
  box-shadow: 0 4px 16px rgba(233,210,139,.35), inset 0 1px 0 rgba(255,255,255,.15);
}

/* Slight animation to numeric icons */
.card ol li::before{ animation:numPulse 3.5s ease-in-out infinite; }
@keyframes numPulse{
  0%,100%{ transform:translateY(0) scale(1); }
  50%{ transform:translateY(-1px) scale(1.03); }
}


/* Updated logo styling */
.logo-wrap{display:block}
.brand .logo{height:52px;width:auto;display:block;filter:drop-shadow(0 2px 10px rgba(0,0,0,.25))}
.brand .xau{height:34px;margin-left:8px;opacity:.95}

/* Footer logo */
.logo-foot{height:34px;width:auto;margin-right:10px;vertical-align:middle;filter:drop-shadow(0 2px 8px rgba(0,0,0,.3))}
.footer-inner .left{display:flex;align-items:center;gap:10px}
.footer-inner .left div{line-height:1.2}


/* v4 palette refinement */
.title, .section-title{ color: var(--turq); text-shadow: 0 0 18px rgba(0,200,216,.25); }
.btn-gold{ background:linear-gradient(135deg,var(--turq), var(--gold)); color:#111; border:none; }
.btn-gold:hover{ box-shadow:0 10px 28px rgba(0,200,216,.25); }
.card{ box-shadow: 0 12px 36px rgba(0,0,0,.35); border-color: rgba(255,255,255,.07); }
.brand .xau{ filter: drop-shadow(0 2px 8px rgba(0,0,0,.3)); }

/* Market banner under header */
.market-banner{
  position:relative; z-index:40;
  background: linear-gradient(90deg, rgba(233,210,139,.12), rgba(0,200,216,.12));
  border-bottom:1px solid rgba(255,255,255,.06);
  overflow:hidden;
}
.market-banner .track{
  white-space:nowrap; display:block; color:var(--silver);
  padding:8px 0; animation:scrollX 28s linear infinite;
  font-weight:600; letter-spacing:.3px;
}
@keyframes scrollX{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

/* Preloader */
#preloader{
  position:fixed; inset:0; background:#0b0e13; display:grid; place-items:center;
  z-index:1000; transition:opacity .35s ease, visibility .35s ease;
}
.pre-box{ text-align:center; }
.pre-logo{ width:90px; height:auto; display:block; margin:0 auto 10px;
  filter: drop-shadow(0 4px 16px rgba(0,0,0,.5)); }
.pre-text{ color:var(--silver); font-weight:700; letter-spacing:.6px; }
.pre-dot::after{ content:"."; animation: dot 1.2s steps(1,end) infinite; }
@keyframes dot { 0%{content:"."} 33%{content:".."} 66%{content:"..."} 100%{content:"."} }

/* Favicons crisp */
.link-fav{}


/* v5: hero centered logo and XAU/USD sticker */
.hero-logo-center{
  width:min(220px,32vw);
  height:auto;
  margin:0 auto 10px;
  display:block;
  filter: drop-shadow(0 8px 22px rgba(0,0,0,.45));
  animation: fadeUp .7s ease-out both;
}
.xau-sticker{
  position:absolute; right:14px; bottom:66px; z-index:2;
  width:120px; height:auto; opacity:.9;
  filter: drop-shadow(0 6px 18px rgba(0,0,0,.5));
}
@media (max-width:560px){
  .xau-sticker{ width:86px; bottom:70px; right:10px; }
}


.warn-text {
  display:block;
  font-size:0.85rem;
  color:#e9d28b;
  margin-top:4px;
  line-height:1.3;
}


/* v8 warning lock icon styling */
.warn-line{
  display:flex;
  align-items:flex-start;
  gap:6px;
  margin:6px 0;
}
.warn-icon{
  flex-shrink:0;
  filter: drop-shadow(0 0 4px rgba(233,210,139,0.4));
}
.warn-text{
  font-size:0.9rem;
  color:var(--gold);
  line-height:1.3;
  text-shadow:0 0 6px rgba(233,210,139,0.15);
}