/* =============================================================
   XMARKETS LANDING REFINEMENT
   Aligns the public site with the calm premium product UI.
   This file intentionally overrides only presentation — no
   landing-page behavior or trading/demo functionality is changed.
   ============================================================= */

:root{
  --xm-public-accent:#d7bc6c;
  --xm-public-accent-2:#f1dfaa;
  --xm-public-accent-soft:rgba(215,188,108,.11);
  --xm-public-blue:#7ca7ff;
  --xm-public-surface:#0d1015;
  --xm-public-surface-2:#11151b;
  --xm-public-border:rgba(255,255,255,.08);
  --xm-public-border-strong:rgba(255,255,255,.13);
}

body.xm-public-body{
  background:
    radial-gradient(900px 700px at 90% -10%,rgba(97,114,164,.08),transparent 56%),
    radial-gradient(700px 520px at -10% 20%,rgba(215,188,108,.045),transparent 58%),
    #050608;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text",Inter,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body.xm-public-body::before{opacity:.12}

/* Navigation -------------------------------------------------- */
.xm-public-nav{
  height:68px;
  border-bottom-color:rgba(255,255,255,.055);
  background:rgba(5,6,8,.72);
  backdrop-filter:blur(24px) saturate(150%);
  -webkit-backdrop-filter:blur(24px) saturate(150%);
}
.xm-public-brand-mark{
  border-radius:11px;
  color:#0a0b0d;
  background:linear-gradient(145deg,#f5e8bd,#c8a852 78%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 7px 20px rgba(215,188,108,.12);
}
.xm-public-brand strong{letter-spacing:.06em;font-weight:730}
.xm-public-brand small{color:#515a67}
.xm-public-links a{color:#7f8997;border-radius:10px}
.xm-public-links a:hover,.xm-public-links a.active{color:#eef1f5;background:rgba(255,255,255,.035)}
.xm-public-links a.active::after{background:var(--xm-public-accent);box-shadow:0 0 10px rgba(215,188,108,.45)}
.xm-nav-login,.xm-nav-signup{border-radius:11px;letter-spacing:.05em}
.xm-nav-login{color:#9ea8b5;background:rgba(255,255,255,.022);border-color:var(--xm-public-border)}
.xm-nav-login:hover{color:#f1dfaa;border-color:rgba(215,188,108,.23);background:rgba(215,188,108,.055)}
.xm-nav-signup{
  color:#0a0b0d;
  background:linear-gradient(145deg,#f5e8bd,#c8a852 78%);
  border-color:rgba(215,188,108,.22);
  box-shadow:0 8px 24px rgba(215,188,108,.09);
}
.xm-nav-signup:hover{box-shadow:0 10px 28px rgba(215,188,108,.15)}

/* Shared typography + accent --------------------------------- */
.xm-section-kicker{color:#bfa85f}
.xm-section-kicker::before{background:var(--xm-public-accent);box-shadow:0 0 12px rgba(215,188,108,.42)}
.xm-section-heading{color:#f5f7fa;letter-spacing:-.045em;font-weight:650}
.xm-section-copy{color:#7f8997}

/* Hero -------------------------------------------------------- */
.xm-hero{min-height:690px}
.xm-hero::before{
  width:680px;height:680px;right:-260px;top:-260px;
  background:radial-gradient(circle,rgba(124,167,255,.075),rgba(215,188,108,.026) 45%,transparent 70%);
  filter:blur(52px);
}
.xm-hero::after{opacity:.07;filter:saturate(.3)}
.xm-hero-eyebrow{
  border-color:rgba(215,188,108,.15);
  background:rgba(215,188,108,.055);
  color:#cdb878;
  letter-spacing:.11em;
}
.xm-hero h1{font-weight:650;letter-spacing:-.06em;color:#f5f7fa}
.xm-hero h1 span{color:var(--xm-public-accent-2);text-shadow:none}
.xm-hero-copy>p{color:#7f8997}
.xm-primary-action{
  color:#090b0d;
  background:#eef1f3;
  border-color:#eef1f3;
  box-shadow:none;
}
.xm-primary-action:hover{box-shadow:0 10px 30px rgba(0,0,0,.22)}
.xm-secondary-action{color:#aeb7c2;border-color:var(--xm-public-border);background:rgba(255,255,255,.022)}
.xm-secondary-action:hover{border-color:var(--xm-public-border-strong);background:rgba(255,255,255,.04)}
.xm-hero-trust-item{color:#65707d}
.xm-hero-trust-item i{background:#697482}

/* Product-preview surfaces ----------------------------------- */
.xm-hero-terminal,.xm-ai-console,.xm-testimonial-console,.xm-demo-shell{
  border-color:var(--xm-public-border);
  background:linear-gradient(145deg,rgba(17,21,27,.9),rgba(9,11,14,.92));
  box-shadow:0 24px 80px rgba(0,0,0,.28);
}
.xm-hero-terminal{border-radius:22px}
.xm-hero-terminal::before{
  opacity:.45;
  background:linear-gradient(135deg,rgba(215,188,108,.13),transparent 27%,transparent 72%,rgba(124,167,255,.05));
  filter:blur(14px);
}
.xm-feature-card,.xm-why-card,.xm-academy-card{
  border-color:var(--xm-public-border);
  background:linear-gradient(145deg,rgba(17,21,27,.88),rgba(9,11,14,.9));
  box-shadow:none;
}
.xm-feature-card:hover,.xm-why-card:hover,.xm-academy-card:hover{border-color:rgba(215,188,108,.18);box-shadow:0 18px 45px rgba(0,0,0,.2)}
.xm-feature-card::after{background:radial-gradient(circle,rgba(215,188,108,.055),transparent 68%)}
.xm-feature-icon{border-color:rgba(215,188,108,.13);background:rgba(215,188,108,.055);color:#cdb878}
.xm-ai-console::after{background:radial-gradient(circle,rgba(124,167,255,.10),transparent 68%)}
.xm-ai-message strong{color:#9eb7ff}

/* Tone down the old red-tech decoration without changing
   semantic buy/sell and positive/negative market colours. */
.xm-demo-zone::before{background:radial-gradient(circle,rgba(215,188,108,.045),transparent 66%)}
.xm-trader-node-zone::before,.xm-trader-node-zone::after{border-color:rgba(215,188,108,.09)}
.xm-final-cta{
  border-color:var(--xm-public-border);
  background:linear-gradient(145deg,#11151b,#090b0f 62%,rgba(215,188,108,.055));
}
.xm-final-cta::before{background:radial-gradient(circle,rgba(215,188,108,.11),transparent 68%)}
.xm-public-footer{border-top-color:rgba(255,255,255,.055)}

/* Mobile refinement ------------------------------------------ */
@media(max-width:720px){
  .xm-container,.xm-public-nav-inner{width:min(100% - 24px,1420px)}
  .xm-public-nav{height:64px}
  .xm-public-actions{gap:6px}
  .xm-nav-login{
    display:inline-flex!important;
    align-items:center;justify-content:center;
    min-height:36px;padding:0 10px;
    font-size:8px;
  }
  .xm-nav-signup{min-height:36px;padding:0 10px;font-size:8px}
  .xm-hero{padding:58px 0 52px}
  .xm-hero-grid{gap:32px}
  .xm-hero h1{font-size:clamp(44px,13vw,66px);line-height:.96;letter-spacing:-.055em}
  .xm-hero-copy>p{font-size:12px;line-height:1.7}
  .xm-hero-terminal{padding:13px;border-radius:18px}
  .xm-feature-card{min-height:auto;padding:20px;border-radius:18px}
  .xm-final-cta{padding:42px 18px;border-radius:22px}
}

@media(max-width:430px){
  .xm-public-brand{gap:8px}
  .xm-public-brand-mark{width:32px;height:32px}
  .xm-public-brand strong{font-size:13px}
  .xm-public-actions{gap:5px}
  .xm-nav-login,.xm-nav-signup{min-height:34px;padding:0 8px;font-size:7px}
  .xm-hero-actions{gap:8px}
}

/* Landing demo feed truthfulness: never show CONNECTED while the selected
   instrument has no fresh real provider quote. */
#xm-demo-feed-wrap.is-live i { background:#22c55e; box-shadow:0 0 9px rgba(34,197,94,.65); }
#xm-demo-feed-wrap.is-live strong { color:#4ade80; }
#xm-demo-feed-wrap.is-delayed i { background:#eab308; box-shadow:0 0 9px rgba(234,179,8,.5); }
#xm-demo-feed-wrap.is-delayed strong { color:#facc15; }
#xm-demo-feed-wrap.is-offline i,
#xm-demo-feed-wrap.is-setup i { background:#ef4444; box-shadow:0 0 9px rgba(239,68,68,.5); }
#xm-demo-feed-wrap.is-offline strong,
#xm-demo-feed-wrap.is-setup strong { color:#f87171; }

/* ============================================================
   Header account actions — cleaner product-level CTA treatment
   ============================================================ */
.xm-public-actions{
  gap:8px;
  padding:3px;
  border:1px solid rgba(255,255,255,.045);
  border-radius:15px;
  background:rgba(8,10,13,.52);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
.xm-nav-login,.xm-nav-signup{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 16px;
  border-radius:11px;
  font-size:9px;
  line-height:1;
  font-weight:800;
  letter-spacing:.035em;
  text-transform:none;
  white-space:nowrap;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease,color .18s ease;
}
.xm-nav-login{
  min-width:76px;
  color:#c0c7d0;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.014));
  border-color:rgba(255,255,255,.075);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.xm-nav-login:hover{
  color:#f3e6bc;
  background:rgba(215,188,108,.06);
  border-color:rgba(215,188,108,.22);
  transform:translateY(-1px);
}
.xm-nav-signup{
  min-width:122px;
  color:#101114;
  background:linear-gradient(135deg,#f6e9bf 0%,#dec270 52%,#c6a34d 100%);
  border-color:rgba(246,233,191,.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 8px 22px rgba(198,163,77,.14);
}
.xm-nav-signup:hover{
  transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.62),0 11px 28px rgba(198,163,77,.2);
}
@media(max-width:720px){
  .xm-public-actions{gap:5px;padding:2px;border-radius:12px}
  .xm-nav-login,.xm-nav-signup{min-height:36px;padding:0 11px;font-size:8px;border-radius:9px}
  .xm-nav-login{min-width:64px}
  .xm-nav-signup{min-width:102px}
}
@media(max-width:430px){
  .xm-nav-login,.xm-nav-signup{min-height:34px;padding:0 9px;font-size:7.5px}
  .xm-nav-login{min-width:58px}
  .xm-nav-signup{min-width:94px}
}
