/* TraderiseFX v8.4.1 — cinematic coded homepage hero
   Reference-match rebuild. No hero/laptop screenshot is used.
   Laptop shell, keyboard, market cards, chart container, room scene and lighting are HTML/CSS/canvas. */
:root{
  --hero-blue:#4fa8ff;
  --hero-blue-soft:#77c1ff;
  --hero-violet:#9c78ff;
  --hero-cyan:#36e8b7;
  --hero-red:#ff625f;
  --hero-gold:#f7b72d;
  --hero-ink:#02070b;
  --hero-panel:#0a131c;
  --hero-line:rgba(149,195,235,.22);
}

.landing-page{background:#020609;color:#f6f9fc;overflow-x:hidden}
.landing-page *{box-sizing:border-box}

/* =========================================================
   CINEMATIC HERO STAGE
   ========================================================= */
.landing-page .premium-hero.reference-stage{
  position:relative!important;
  width:100%!important;
  height:clamp(840px,56.25vw,948px)!important;
  min-height:840px!important;
  max-height:948px!important;
  padding:0!important;
  overflow:hidden!important;
  isolation:isolate;
  background:
    radial-gradient(ellipse at 77% 31%,rgba(38,111,188,.23) 0%,rgba(15,55,91,.12) 25%,transparent 52%),
    radial-gradient(ellipse at 46% 108%,rgba(79,111,145,.18),transparent 38%),
    linear-gradient(104deg,#020608 0%,#03080c 40%,#08131e 67%,#050b11 100%)!important;
}
.premium-hero:before{
  content:"";position:absolute;z-index:2;inset:0;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(0,0,0,.30),rgba(0,0,0,.02) 47%,rgba(2,7,11,.02) 78%,rgba(0,0,0,.16)),
    linear-gradient(180deg,rgba(0,0,0,.03),transparent 63%,rgba(0,0,0,.52));
}
.hero-ambient{position:absolute;z-index:0;inset:0;pointer-events:none;overflow:hidden}
.ambient-grid{display:none}
.ambient-orb{position:absolute;border-radius:50%;filter:blur(95px);opacity:.38}
.orb-a{width:520px;height:520px;right:8%;top:-3%;background:#195d9f}
.orb-b{width:430px;height:300px;left:46%;bottom:-18%;background:#6853c8;opacity:.12}

/* Glass-window room, fully coded. */
.room-windows{position:absolute;z-index:0;left:45%;right:-4%;top:-4%;height:68%;opacity:.9;
  background:
    linear-gradient(180deg,rgba(79,112,136,.18),rgba(21,37,50,.05) 55%,rgba(7,14,20,.25)),
    linear-gradient(90deg,rgba(20,39,54,.18),rgba(87,127,159,.14) 42%,rgba(20,40,58,.12));
  filter:saturate(.86)}
.room-windows:before{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,transparent 0 9%,rgba(0,0,0,.74) 9.2% 11.6%,transparent 11.8% 32%,rgba(0,0,0,.67) 32.2% 34.5%,transparent 34.7% 57%,rgba(0,0,0,.68) 57.2% 59.4%,transparent 59.6% 81%,rgba(0,0,0,.7) 81.2% 83.4%,transparent 83.6%),
  linear-gradient(180deg,transparent 0 40%,rgba(10,21,31,.35) 40.4% 41.6%,transparent 42%)}
.room-windows:after{content:"";position:absolute;inset:0;background:
  radial-gradient(circle at 14% 38%,rgba(255,218,154,.62) 0 3px,transparent 5px),
  radial-gradient(circle at 35% 29%,rgba(255,227,174,.38) 0 2px,transparent 5px),
  radial-gradient(circle at 49% 44%,rgba(112,176,255,.32) 0 3px,transparent 7px),
  radial-gradient(circle at 65% 24%,rgba(255,211,145,.44) 0 3px,transparent 7px),
  radial-gradient(circle at 80% 47%,rgba(84,160,239,.3) 0 4px,transparent 8px),
  radial-gradient(circle at 92% 31%,rgba(255,218,158,.42) 0 2px,transparent 6px);
  filter:blur(2.5px)}
.room-windows i{position:absolute;bottom:5%;width:9%;background:linear-gradient(180deg,rgba(16,34,48,.12),rgba(11,21,29,.5));border-top:1px solid rgba(132,178,218,.08)}
.room-windows i:nth-child(1){left:7%;height:25%}.room-windows i:nth-child(2){left:25%;height:36%}.room-windows i:nth-child(3){left:45%;height:22%}.room-windows i:nth-child(4){left:66%;height:31%}.room-windows i:nth-child(5){left:84%;height:18%}
.room-bokeh{position:absolute;left:49%;right:3%;top:8%;height:50%;filter:blur(8px);opacity:.62}
.room-bokeh i{position:absolute;width:22px;height:22px;border-radius:50%;background:rgba(247,215,169,.16);box-shadow:0 0 35px rgba(247,215,169,.2)}
.room-bokeh i:nth-child(1){left:12%;top:27%;width:31px;height:31px}.room-bokeh i:nth-child(2){left:38%;top:13%}.room-bokeh i:nth-child(3){left:54%;top:41%;width:16px;height:16px;background:rgba(91,169,255,.2)}.room-bokeh i:nth-child(4){left:68%;top:21%;width:28px;height:28px}.room-bokeh i:nth-child(5){left:84%;top:48%;width:18px;height:18px;background:rgba(103,177,255,.18)}.room-bokeh i:nth-child(6){left:95%;top:17%;width:14px;height:14px}

/* Desk plane and foreground objects. */
.desk-glow{position:absolute;z-index:1;left:-7%;right:-8%;bottom:-18%;height:49%;transform:perspective(980px) rotateX(63deg);transform-origin:bottom;
  background:
    linear-gradient(90deg,rgba(35,44,51,.78),rgba(67,81,91,.48) 48%,rgba(31,43,51,.64)),
    repeating-linear-gradient(90deg,rgba(255,255,255,.012) 0 2px,transparent 2px 18px);
  border-top:1px solid rgba(208,226,239,.18);box-shadow:0 -35px 90px rgba(33,74,108,.10),inset 0 1px rgba(255,255,255,.06)}
.desk-reflection{position:absolute;z-index:1;left:22%;right:3%;bottom:0;height:34%;background:radial-gradient(ellipse at 70% 20%,rgba(126,173,208,.13),transparent 55%),linear-gradient(180deg,rgba(255,255,255,.015),transparent 50%);filter:blur(2px)}
.city-light{display:none}

.hero-plant{position:absolute;z-index:1;left:-32px;top:66px;width:220px;height:360px;opacity:.40;filter:blur(.2px)}
.hero-plant:before{content:"";position:absolute;left:67px;top:54px;width:5px;height:300px;background:linear-gradient(#142d22,#09150f);transform:rotate(-5deg);border-radius:999px}
.hero-plant i{position:absolute;left:52px;top:90px;width:45px;height:125px;border-radius:80% 8% 80% 8%;background:linear-gradient(145deg,#214831,#09170f 72%);transform-origin:bottom center;box-shadow:inset 6px 0 rgba(255,255,255,.025)}
.hero-plant i:nth-child(1){transform:translate(-30px,-42px) rotate(-42deg)}.hero-plant i:nth-child(2){transform:translate(32px,-38px) rotate(38deg)}.hero-plant i:nth-child(3){transform:translate(-48px,42px) rotate(-58deg);height:150px}.hero-plant i:nth-child(4){transform:translate(48px,52px) rotate(54deg);height:148px}.hero-plant i:nth-child(5){transform:translate(-18px,98px) rotate(-28deg);height:135px}.hero-plant i:nth-child(6){transform:translate(27px,108px) rotate(30deg);height:128px}.hero-plant i:nth-child(7){transform:translate(4px,-62px) rotate(7deg);height:155px}

.hero-books{position:absolute;z-index:3;left:-12px;bottom:90px;width:245px;height:102px;transform:perspective(480px) rotateX(8deg) rotateZ(-2deg);opacity:.72}
.hero-books span{position:absolute;left:0;width:215px;height:25px;border-radius:3px;background:linear-gradient(180deg,#25292c,#090c0e);border:1px solid rgba(193,206,216,.10);box-shadow:0 7px 14px rgba(0,0,0,.35)}
.hero-books span:nth-child(1){bottom:0;left:10px;width:235px}.hero-books span:nth-child(2){bottom:23px;left:-3px;width:217px;background:linear-gradient(180deg,#2c3033,#0c0f11)}.hero-books span:nth-child(3){bottom:47px;left:17px;width:190px;background:linear-gradient(180deg,#1c2023,#080a0c)}
.hero-books b{position:absolute;left:27px;bottom:57px;color:rgba(195,207,217,.22);font-size:11px;line-height:1.18;letter-spacing:.05em;transform:rotate(-2deg)}
.hero-mug{position:absolute;z-index:5;right:-20px;bottom:45px;width:98px;height:150px;border-radius:8px 8px 29px 29px;background:linear-gradient(90deg,#0a0d0f,#343c41 44%,#0c0f11 76%);border:1px solid rgba(206,219,228,.10);box-shadow:0 28px 28px rgba(0,0,0,.5),inset 10px 0 18px rgba(255,255,255,.025)}
.hero-mug:before{content:"";position:absolute;left:4px;right:4px;top:-7px;height:16px;border-radius:50%;background:#050708;border:2px solid #30383d;box-shadow:inset 0 4px 5px #000}.hero-mug i{position:absolute;right:-38px;top:32px;width:44px;height:64px;border:9px solid #1b2125;border-left:0;border-radius:0 28px 28px 0}.hero-mug span{position:absolute;left:13px;bottom:27px;color:rgba(185,197,206,.34);font-size:7px;letter-spacing:.12em;transform:rotate(-3deg)}

/* =========================================================
   HEADER
   ========================================================= */
.premium-header{position:relative;z-index:50;width:min(1590px,calc(100% - 76px));height:102px;margin:0 auto;display:grid;grid-template-columns:minmax(255px,1fr) auto minmax(255px,1fr);align-items:center;gap:26px}
.premium-brand{display:inline-flex;align-items:center;gap:11px;width:max-content;text-decoration:none!important;color:#fff!important}.premium-brand img{width:42px;height:42px;filter:drop-shadow(0 0 17px rgba(91,128,255,.28))}.premium-brand span{font-size:18px;font-weight:850;letter-spacing:.055em}.premium-brand b{color:#9a72ff}
.premium-nav{display:flex;align-items:center;justify-content:center;gap:6px}.premium-nav button,.premium-nav>a{display:inline-flex;align-items:center;gap:7px;min-height:42px;padding:0 13px;border:0;background:transparent;color:#e1e7ed;text-decoration:none;font-size:13px;font-weight:530;cursor:pointer;border-radius:9px;transition:.2s}.premium-nav button:hover,.premium-nav>a:hover,.premium-nav button[aria-expanded="true"]{color:#fff;background:rgba(106,163,224,.07)}.premium-nav i{font-style:normal;color:#7d8d9b;font-size:14px}
.premium-header-actions{justify-self:end;display:flex;align-items:center;gap:12px}.header-login,.header-start{height:54px;border-radius:12px;padding:0 28px;font-size:13px;cursor:pointer;transition:.2s}.header-login{border:1px solid rgba(205,226,244,.34);color:#f7f9fb;background:rgba(8,15,21,.43);box-shadow:inset 0 1px rgba(255,255,255,.025)}.header-start{min-width:174px;border:1px solid rgba(255,255,255,.82);color:#05080b;font-weight:780;background:linear-gradient(115deg,#fff 0%,#dce8f0 26%,#fff 48%,#b9c9d5 75%,#fbfdff 100%);box-shadow:0 0 28px rgba(149,205,255,.22),inset 0 0 26px rgba(255,255,255,.8)}.header-start span{font-size:19px;margin-left:10px}.header-login:hover,.header-start:hover{transform:translateY(-2px)}
.premium-menu-toggle,.premium-mobile-menu{display:none}

/* =========================================================
   COPY — matches reference proportions
   ========================================================= */
.premium-hero-grid{position:relative;z-index:10;width:min(1590px,calc(100% - 80px));height:734px;margin:0 auto;display:grid;grid-template-columns:minmax(620px,44.5%) minmax(760px,55.5%);gap:0;align-items:stretch}
.premium-copy{position:relative;z-index:20;align-self:start;padding:63px 0 0 14px;max-width:700px}
.premium-eyebrow{display:inline-flex;align-items:center;gap:10px;height:39px;padding:0 17px;border:1px solid rgba(140,197,250,.52);border-radius:999px;background:linear-gradient(90deg,rgba(15,32,47,.69),rgba(11,18,27,.38));box-shadow:0 0 24px rgba(65,146,234,.11),inset 0 1px rgba(255,255,255,.055);color:#e2eaf1;font-size:10.5px;font-weight:650;letter-spacing:.035em}.premium-eyebrow i{width:8px;height:8px;border-radius:50%;background:#e6f5ff;box-shadow:0 0 11px #67b5ff,0 0 24px rgba(110,91,255,.9)}
.premium-copy h1{margin:31px 0 19px;font-size:clamp(64px,4.38vw,74px);line-height:1.01;letter-spacing:-.052em;font-weight:735;color:#f8fbff;white-space:normal}.premium-copy h1 span,.premium-copy h1 em{display:block;white-space:nowrap}.premium-copy h1 em{font-style:normal;margin-top:5px;background:linear-gradient(103deg,#61adff 0%,#69b5ff 30%,#8d8cff 66%,#a77cff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 10px 44px rgba(84,112,255,.12)}
.premium-copy>p{max-width:620px;margin:0;color:#b8c1ca;font-size:18px;line-height:1.55;letter-spacing:-.014em}
.premium-cta-row{display:flex;gap:17px;align-items:center;margin-top:32px}.premium-primary-cta,.premium-secondary-cta{height:66px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none!important;cursor:pointer;transition:.22s}.premium-primary-cta{min-width:282px;padding:0 26px;border:1px solid rgba(255,255,255,.9);background:linear-gradient(113deg,#fff 0%,#dce8f0 28%,#fff 48%,#b8c9d5 78%,#f9fcfe 100%);box-shadow:0 0 0 1px rgba(90,175,255,.16),0 12px 38px rgba(64,143,218,.18),0 0 28px rgba(101,165,244,.11),inset 0 0 26px rgba(255,255,255,.8);color:#070b0f;font-size:15px;font-weight:780}.premium-primary-cta span{font-size:22px;margin-left:22px}.premium-secondary-cta{min-width:263px;justify-content:space-between;padding:0 17px 0 28px;border:1px solid rgba(184,216,245,.53);background:rgba(5,11,17,.61);color:#f5f8fb;font-size:15px;font-weight:610;box-shadow:inset 0 1px rgba(255,255,255,.035)}.premium-primary-cta:hover,.premium-secondary-cta:hover{transform:translateY(-3px)}.premium-secondary-cta:hover{border-color:rgba(104,181,255,.9);background:rgba(44,99,150,.13)}.play-chip{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(219,234,247,.43);border-radius:50%;background:linear-gradient(145deg,rgba(141,187,227,.2),rgba(34,55,74,.44));font-size:12px;color:#fff;padding-left:2px}
.premium-trust-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:36px;max-width:675px}.premium-trust-row article{display:flex;align-items:center;gap:11px;min-height:64px;padding:0 18px 0 0}.premium-trust-row article+article{border-left:1px solid rgba(172,204,230,.15);padding-left:19px}.trust-icon{width:35px;flex:0 0 35px;text-align:center;font-size:30px;line-height:1;color:#77c0ff;text-shadow:0 0 13px rgba(65,161,255,.58)}.trust-icon.shield{color:#79bbff}.trust-icon.liquidity{color:#987eff}.premium-trust-row b,.premium-trust-row small{display:block;white-space:nowrap}.premium-trust-row b{font-size:11px;color:#f0f5f9;font-weight:660}.premium-trust-row small{margin-top:6px;font-size:10px;color:#8797a5}

/* =========================================================
   REAL-CODE LAPTOP + LIVE GOLD TERMINAL
   ========================================================= */
.premium-visual{position:relative;z-index:8;min-height:734px;align-self:stretch;isolation:isolate;overflow:visible}
.premium-visual:before{content:"";position:absolute;z-index:-2;left:5%;right:-3%;top:4%;bottom:5%;border-radius:50%;background:radial-gradient(ellipse at 58% 46%,rgba(57,121,183,.18),transparent 63%);filter:blur(17px)}
.hero-lamp{position:absolute;z-index:8;right:10.5%;top:2px;width:58%;height:135px;pointer-events:none}.hero-lamp span{position:absolute;right:3%;top:19px;width:88%;height:17px;border-radius:999px;background:linear-gradient(180deg,#071015,#222a30 41%,#070b0e);transform:rotate(-4.2deg);box-shadow:0 3px 4px #000,0 13px 22px rgba(255,178,95,.20)}.hero-lamp span:after{content:"";position:absolute;left:7%;right:3%;bottom:-2px;height:3px;border-radius:999px;background:linear-gradient(90deg,transparent,#ffbd79 7%,#ffe4c7 78%,transparent);box-shadow:0 8px 30px rgba(255,171,80,.5)}.hero-lamp i{position:absolute;right:-1%;top:24px;width:11px;height:138px;border-radius:999px;background:linear-gradient(90deg,#0c1216,#343d43 46%,#090e11);transform:rotate(4deg);box-shadow:2px 0 5px #000}
.code-laptop{position:absolute;z-index:4;left:12.5%;top:10.2%;width:72.5%;max-width:735px;filter:drop-shadow(0 42px 37px rgba(0,0,0,.62)) drop-shadow(0 10px 28px rgba(58,123,183,.08));transform:translateZ(0)}
.laptop-lid{position:relative;width:100%;aspect-ratio:1.38;border:1px solid rgba(211,225,236,.62);border-radius:18px 18px 9px 9px;padding:11px;background:linear-gradient(145deg,#7e8a94 0%,#29333b 2.3%,#0d1419 5.5%,#05090d 94%,#4f5b64 98%,#9aa5ad 100%);box-shadow:inset 0 0 0 2px rgba(255,255,255,.055),inset 0 0 34px rgba(0,0,0,.88),0 0 0 1px rgba(0,0,0,.8),0 0 28px rgba(75,149,220,.11);transform:perspective(1600px) rotateY(-1deg)}
.laptop-lid:before{content:"";position:absolute;z-index:3;left:5%;right:4%;top:2px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent)}
.laptop-camera{position:absolute;z-index:5;top:4px;left:50%;width:5px;height:5px;border-radius:50%;background:#1b2831;box-shadow:0 0 0 1px #000,0 0 5px rgba(93,163,229,.18)}
.laptop-screen{position:relative;height:100%;overflow:hidden;border-radius:8px;background:linear-gradient(180deg,#06101a 0%,#07111a 52%,#050b11 100%);border:1px solid rgba(93,143,186,.28);box-shadow:inset 0 0 45px rgba(13,43,69,.5),inset 0 0 0 1px rgba(255,255,255,.015)}
.laptop-screen:before{content:"";position:absolute;z-index:0;inset:0;background:radial-gradient(circle at 78% 23%,rgba(51,128,212,.11),transparent 28%),linear-gradient(112deg,rgba(255,255,255,.025),transparent 29%);pointer-events:none}
.screen-topbar{position:relative;z-index:5;height:56px;display:flex;align-items:center;padding:0 15px;border-bottom:1px solid rgba(126,169,207,.12);background:linear-gradient(180deg,rgba(10,19,29,.96),rgba(6,13,21,.83))}.screen-symbol{display:flex;align-items:center;gap:8px;min-width:145px}.gold-dot{color:#f4b942;font-size:16px;text-shadow:0 0 12px rgba(244,185,66,.34)}.screen-symbol strong,.screen-symbol small,.screen-price strong,.screen-price small{display:block}.screen-symbol strong{font-size:11.5px;color:#f6f9fc}.screen-symbol small{margin-top:3px;font-size:7.5px;color:#6a7c8d}.screen-price{margin-left:auto;text-align:right;padding-right:10px}.screen-price strong{font-size:15px;color:#f5f8fb}.screen-price small{margin-top:2px;font-size:7.5px;color:#54d8ad}.screen-price small.down{color:#ff716d}.screen-live{display:inline-flex;align-items:center;gap:5px;height:23px;padding:0 8px;border:1px solid rgba(50,236,181,.23);border-radius:999px;background:rgba(30,220,165,.08);color:#76e8c5;font-size:6.5px;font-weight:800;letter-spacing:.08em}.screen-live i{width:5px;height:5px;border-radius:50%;background:#48edbd;box-shadow:0 0 8px #48edbd;animation:premiumPulse 1.4s ease-in-out infinite}
.screen-toolbar{position:relative;z-index:5;height:36px;display:flex;align-items:center;gap:4px;padding:0 14px;border-bottom:1px solid rgba(119,163,202,.09);background:rgba(5,12,19,.72)}.screen-toolbar span,.screen-toolbar b{height:23px;min-width:29px;padding:0 6px;display:grid;place-items:center;border-radius:6px;color:#6f8294;font-size:7.5px;font-weight:650}.screen-toolbar span.active{color:#e1efff;background:rgba(68,143,218,.13);box-shadow:inset 0 0 0 1px rgba(92,170,245,.14)}.screen-toolbar b{margin-left:3px;border:1px solid rgba(113,157,195,.11);color:#7890a5}
.premium-hero .live-screen{position:relative!important;z-index:2!important;left:auto!important;top:auto!important;width:100%!important;height:calc(100% - 116px)!important;min-height:286px!important;overflow:hidden!important;clip-path:none!important;pointer-events:none!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important}.premium-hero .live-screen:before,.premium-hero .live-screen:after{display:none!important}.premium-hero .live-screen canvas{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;opacity:1!important;filter:none!important}
.screen-footer{position:absolute;z-index:4;left:0;right:0;bottom:0;height:24px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-top:1px solid rgba(111,153,190,.09);background:rgba(4,10,16,.84);font-size:6px;color:#53687a;letter-spacing:.06em}.screen-footer span:first-child{color:#7da9cf}
.laptop-hinge{position:relative;z-index:7;width:88%;height:11px;margin:-2px auto 0;border-radius:0 0 11px 11px;background:linear-gradient(180deg,#83909a,#27323a 35%,#080d10 84%);box-shadow:0 2px 8px #000}
.laptop-base{position:relative;z-index:3;width:116%;height:188px;margin:-3px 0 0 -8%;clip-path:polygon(7% 0,93% 0,100% 85%,95% 100%,5% 100%,0 85%);background:linear-gradient(162deg,#89959e 0%,#3a4751 12%,#1a232a 42%,#0e151a 64%,#6b7881 93%,#202a31 100%);border-top:1px solid rgba(229,238,244,.68);box-shadow:inset 0 4px 9px rgba(255,255,255,.10),inset 0 -13px 22px rgba(0,0,0,.63);transform:perspective(720px) rotateX(53deg);transform-origin:top center}
.keyboard-grid{position:absolute;left:10%;right:10%;top:11%;height:54%;border-radius:7px;background-color:#0b1116;background-image:repeating-linear-gradient(90deg,transparent 0 5.35%,rgba(141,164,181,.28) 5.35% 5.65%),repeating-linear-gradient(180deg,transparent 0 22.4%,rgba(141,164,181,.23) 22.4% 24.2%);box-shadow:inset 0 0 15px rgba(0,0,0,.92),0 0 0 1px rgba(198,218,233,.09)}.keyboard-grid:before{content:"";position:absolute;inset:7% 4%;background:repeating-linear-gradient(90deg,rgba(104,156,210,.075) 0 3.5%,transparent 3.5% 6%);filter:blur(.3px)}.keyboard-grid:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 56% 34%,rgba(68,142,222,.18),transparent 42%);mix-blend-mode:screen}.trackpad{position:absolute;left:37.5%;right:37.5%;bottom:7.5%;height:27%;border:1px solid rgba(193,210,221,.26);border-radius:5px;background:linear-gradient(145deg,rgba(45,55,62,.26),rgba(9,13,16,.2));box-shadow:inset 0 1px rgba(255,255,255,.035)}.base-lip{position:absolute;left:5%;right:5%;bottom:0;height:9%;background:linear-gradient(180deg,rgba(197,211,221,.25),rgba(13,18,22,.78));border-radius:0 0 50% 50%}

/* =========================================================
   THREE LIVE FLOATING MARKET CARDS — exact visual hierarchy
   ========================================================= */
.premium-hero .live-quote-stack{position:absolute!important;z-index:12!important;left:.5%!important;top:14.8%!important;width:205px!important;display:flex!important;flex-direction:column!important;gap:11px!important;pointer-events:none!important}
.premium-hero .quote-card{position:relative!important;width:100%!important;height:124px!important;aspect-ratio:auto!important;padding:14px 15px 11px!important;overflow:hidden!important;border:1px solid rgba(119,189,255,.40)!important;border-radius:14px!important;background:linear-gradient(145deg,rgba(10,29,42,.97),rgba(8,20,29,.93))!important;box-shadow:0 20px 44px rgba(0,0,0,.44),0 0 30px rgba(66,159,248,.10),inset 0 1px 0 rgba(255,255,255,.055)!important;backdrop-filter:blur(18px)!important}
.premium-hero .quote-card:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 98% 2%,rgba(71,169,255,.18),transparent 43%),linear-gradient(110deg,rgba(255,255,255,.018),transparent 38%)}
.premium-hero .quote-card.card-0{height:151px!important;border-color:rgba(98,180,255,.54)!important;box-shadow:0 22px 48px rgba(0,0,0,.48),0 0 26px rgba(65,160,255,.17),inset 0 1px rgba(255,255,255,.07)!important}
.premium-hero .quote-card.card-1{height:112px!important;margin-left:4px;border-color:rgba(255,101,96,.30)!important;background:linear-gradient(145deg,rgba(31,20,25,.96),rgba(13,18,24,.94))!important}.premium-hero .quote-card.card-1:before{background:radial-gradient(circle at 100% 0,rgba(255,83,79,.16),transparent 43%)}
.premium-hero .quote-card.card-2{height:112px!important;margin-left:1px;border-color:rgba(72,218,165,.30)!important;background:linear-gradient(145deg,rgba(10,28,28,.96),rgba(9,18,25,.94))!important}.premium-hero .quote-card.card-2:before{background:radial-gradient(circle at 100% 0,rgba(49,229,170,.15),transparent 43%)}
.premium-hero .quote-card header{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;font-size:10.5px!important;line-height:1!important}.quote-symbol-wrap{display:flex;align-items:center;gap:7px}.quote-asset{width:19px;height:19px;display:grid;place-items:center;border-radius:50%;font-size:10px;font-weight:800}.quote-xau{color:#3c2600;background:linear-gradient(145deg,#ffd56b,#d88a0e);box-shadow:0 0 13px rgba(255,194,60,.25)}.quote-eur{color:#ddecff;background:rgba(69,144,225,.18);border:1px solid rgba(90,170,255,.24)}.quote-btc{color:#fff1d4;background:#f49b22;box-shadow:0 0 12px rgba(244,155,34,.22)}
.premium-hero .quote-card strong{position:relative;z-index:2;display:block;font-size:22px!important;line-height:1.08!important;margin:10px 0 4px!important;font-weight:690!important;letter-spacing:-.035em}.premium-hero .quote-card.card-0 strong{font-size:25px!important;margin-top:11px!important}.premium-hero .quote-card.card-1 strong,.premium-hero .quote-card.card-2 strong{font-size:19px!important;margin:8px 0 3px!important}.premium-hero .quote-card small{position:relative;z-index:2;font-size:9px!important;font-weight:680}.premium-hero .quote-card svg{position:absolute;z-index:1;left:14px;right:14px;bottom:10px;width:calc(100% - 28px)!important;height:29px!important;margin:0!important;opacity:.96}.premium-hero .quote-card.card-0 svg{height:31px!important;bottom:12px!important}.quote-live-badge{display:inline-flex;align-items:center;height:17px;margin-left:6px;padding:0 6px;border:1px solid rgba(62,236,182,.25);border-radius:5px;background:rgba(54,221,169,.09);color:#63e2ba;font-size:5.5px;font-weight:800;letter-spacing:.08em}

/* =========================================================
   RIGHT VERTICAL GLASS STATS RAIL
   ========================================================= */
.premium-hero .hero-rail-live{position:absolute!important;z-index:13!important;right:-2.1%!important;top:8.0%!important;width:132px!important;height:518px!important;border:1px solid rgba(152,203,247,.42)!important;border-radius:15px!important;overflow:hidden!important;background:linear-gradient(155deg,rgba(28,48,64,.88),rgba(9,17,25,.92))!important;box-shadow:0 25px 62px rgba(0,0,0,.44),0 0 27px rgba(77,158,236,.11),inset 0 1px 0 rgba(255,255,255,.075)!important;backdrop-filter:blur(19px)!important;pointer-events:none!important}.premium-hero .hero-rail-live:before{content:"";position:absolute;inset:0;background:linear-gradient(112deg,transparent 42%,rgba(129,196,255,.10) 50%,transparent 58%);pointer-events:none}.premium-hero .hero-rail-item{position:relative;z-index:2;height:25%!important;border-bottom:1px solid rgba(151,192,227,.18)!important}.premium-hero .hero-rail-item:last-child{border-bottom:0!important}.premium-hero .hero-rail-item strong{font-size:21px!important;font-weight:660!important}.premium-hero .hero-rail-item small{font-size:7.5px!important;color:#bdcad5!important;margin-top:7px!important}.premium-hero .speedometer{width:48px!important;margin-bottom:7px!important}.premium-hero .rail-icon{width:48px!important;height:34px!important;margin-bottom:7px!important}.premium-hero .support-wave{width:48px!important;height:30px!important;margin-bottom:7px!important}

/* =========================================================
   BOTTOM FROSTED STATS BAR
   ========================================================= */
.premium-hero .hero-stat-overlay{position:absolute!important;z-index:18!important;left:50%!important;bottom:28px!important;transform:translateX(-50%)!important;width:min(1322px,calc(100% - 312px))!important;height:106px!important;display:grid!important;grid-template-columns:repeat(5,1fr)!important;border:1px solid rgba(149,195,235,.31)!important;border-radius:16px!important;background:linear-gradient(104deg,rgba(15,29,41,.91),rgba(30,45,57,.88) 43%,rgba(11,21,30,.93))!important;box-shadow:0 28px 67px rgba(0,0,0,.36),0 0 27px rgba(67,140,211,.06),inset 0 1px 0 rgba(255,255,255,.055)!important;backdrop-filter:blur(20px)!important;overflow:hidden!important;pointer-events:none!important}.premium-hero .hero-stat-overlay:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.035) 48%,transparent 62%)}.premium-hero .hero-stat-overlay article{position:relative;z-index:2;gap:17px!important}.premium-hero .hero-stat-overlay article+article{border-left:1px solid rgba(157,198,232,.15)!important}.premium-hero .hero-stat-overlay strong{font-size:20px!important;font-weight:660!important}.premium-hero .hero-stat-overlay small{font-size:8.5px!important;color:#98a9b7!important;margin-top:6px!important}.premium-hero .hero-stat-icon{font-size:27px!important;color:#d0e8fa!important;text-shadow:0 0 18px rgba(82,164,239,.26)!important}

/* Popovers */
.premium-hero .nav-popover{top:84px!important;width:min(300px,24vw)!important;border:1px solid rgba(118,176,230,.25)!important;border-radius:14px!important;background:linear-gradient(145deg,rgba(10,20,29,.98),rgba(4,10,15,.99))!important;box-shadow:0 26px 70px rgba(0,0,0,.62),0 0 30px rgba(71,145,218,.07),inset 0 1px 0 rgba(255,255,255,.05)!important}.premium-hero .nav-popover a:hover{background:rgba(76,153,229,.09)!important}.premium-hero .nav-popover-title{color:#b8d8f5!important}

/* =========================================================
   REST OF PUBLIC WEBSITE — same premium material language
   ========================================================= */
.landing-content{position:relative;background:linear-gradient(180deg,#050a0f 0%,#03070b 22%,#071019 100%)!important}.landing-content:before{content:"";position:absolute;left:0;right:0;top:0;height:520px;pointer-events:none;background:radial-gradient(ellipse at 74% 0,rgba(39,98,153,.10),transparent 52%)}
.market-ribbon{background:rgba(5,11,17,.95)!important;border-color:rgba(117,173,222,.13)!important}.ribbon-quote{border-color:rgba(117,173,222,.11)!important}.landing-section{position:relative;border-top-color:rgba(114,169,218,.10)!important}.landing-section:before{background:#397fc2!important;opacity:.055!important}.eyebrow{color:#8ebee9!important}.eyebrow:before{background:linear-gradient(90deg,#76bcff,#8e6dff)!important}.section-heading h2,.section-copy h2{background:linear-gradient(180deg,#fff 0%,#d9e7f2 58%,#88a2b8 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;color:transparent!important}.section-heading p,.section-copy>p{color:#8fa1b0!important}
.landing-page .steel-btn{border-color:rgba(153,201,243,.58)!important;background:linear-gradient(112deg,#f8fbfe 0%,#d8e7f2 28%,#ffffff 48%,#9dbed6 79%,#edf6fc 100%)!important;color:#061019!important;box-shadow:0 13px 38px rgba(51,130,202,.14)!important}.landing-page .steel-btn:hover{box-shadow:0 17px 46px rgba(51,130,202,.22),0 0 0 1px rgba(105,177,241,.16)!important}.landing-page .ghost-btn{border-color:rgba(113,171,223,.24)!important;background:rgba(8,17,25,.72)!important}.landing-page .ghost-btn:hover{border-color:rgba(94,174,246,.55)!important;background:rgba(43,104,158,.10)!important;box-shadow:0 14px 34px rgba(29,85,135,.12)!important}
.terminal-showcase,.market-category,.account-card,.capability-grid article,.faq-item,.cta-panel{border-color:rgba(105,165,218,.16)!important;box-shadow:0 30px 80px rgba(0,0,0,.23),inset 0 1px rgba(255,255,255,.025)!important}.terminal-showcase{background:linear-gradient(145deg,#0a131d,#050a0f)!important}.market-category,.account-card{background:linear-gradient(145deg,rgba(10,20,29,.92),rgba(5,11,17,.95))!important}.market-category:hover,.account-card:hover{border-color:rgba(82,164,239,.34)!important;box-shadow:0 28px 70px rgba(0,0,0,.34),0 0 35px rgba(62,139,211,.07)!important}.category-icon{color:#83c2f7!important;border-color:rgba(99,171,234,.22)!important;background:rgba(51,128,197,.07)!important}.site-footer{background:#03070b!important;border-color:rgba(112,166,213,.10)!important}.site-footer a:hover{color:#79bcf5!important}

@keyframes premiumPulse{0%,100%{opacity:.45;transform:scale(.82)}50%{opacity:1;transform:scale(1.18)}}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media(max-width:1500px){
  .premium-header{width:calc(100% - 52px)}
  .premium-hero-grid{width:calc(100% - 58px);grid-template-columns:minmax(560px,43%) minmax(700px,57%)}
  .premium-copy{padding-left:4px}.premium-copy h1{font-size:clamp(61px,4.25vw,69px)}.premium-copy>p{font-size:16.5px;max-width:570px}.premium-primary-cta{min-width:260px}.premium-secondary-cta{min-width:240px}.premium-trust-row{max-width:610px}
  .code-laptop{left:11.5%;width:74%}.premium-hero .live-quote-stack{left:-4.3%!important;width:190px!important}.premium-hero .hero-rail-live{right:-2.6%!important;width:124px!important}.premium-hero .hero-stat-overlay{width:calc(100% - 190px)!important}
}
@media(max-width:1260px){
  .premium-header{grid-template-columns:minmax(220px,1fr) auto minmax(220px,1fr)}.premium-nav{gap:1px}.premium-nav button,.premium-nav>a{padding-inline:9px}.premium-hero-grid{grid-template-columns:minmax(480px,42%) minmax(650px,58%)}.premium-copy h1{font-size:clamp(56px,4.4vw,64px)}.premium-copy>p{font-size:15px}.premium-primary-cta,.premium-secondary-cta{min-width:0;flex:1 1 220px}.premium-hero .live-quote-stack{width:175px!important}.premium-hero .quote-card.card-0{height:138px!important}.premium-hero .quote-card.card-1,.premium-hero .quote-card.card-2{height:104px!important}.premium-hero .quote-card strong{font-size:18px!important}.premium-hero .quote-card.card-0 strong{font-size:22px!important}.premium-hero .hero-rail-live{width:116px!important;right:-1.5%!important}.premium-trust-row b{font-size:10px}.premium-trust-row small{font-size:9px}
}
@media(max-width:1080px){
  .landing-page .premium-hero.reference-stage{height:auto!important;max-height:none!important;min-height:1040px!important;padding-bottom:104px!important}
  .premium-header{grid-template-columns:1fr auto}.premium-nav{display:none}.premium-header-actions{justify-self:end}.premium-hero-grid{width:calc(100% - 36px);height:auto;display:block}.premium-copy{padding:38px 0 0;max-width:760px}.premium-copy h1{font-size:clamp(56px,7vw,72px)}.premium-copy>p{font-size:16px}.premium-trust-row{max-width:690px}
  .premium-visual{min-height:590px;margin-top:25px}.code-laptop{left:50%;top:72px;width:min(690px,85vw);transform:translateX(-50%)}.hero-lamp{right:7%;width:60%}.premium-hero .live-quote-stack{left:50%!important;top:15px!important;transform:translateX(-50%)!important;width:min(650px,90vw)!important;display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:8px!important}.premium-hero .quote-card,.premium-hero .quote-card.card-0,.premium-hero .quote-card.card-1,.premium-hero .quote-card.card-2{height:104px!important;margin:0!important;padding:11px!important}.premium-hero .quote-card strong,.premium-hero .quote-card.card-0 strong{font-size:17px!important;margin:7px 0 2px!important}.premium-hero .quote-card small{font-size:8px!important}.premium-hero .quote-card svg{height:22px!important;bottom:8px!important}.quote-live-badge{display:none}.premium-hero .hero-rail-live{display:none!important}.premium-hero .hero-stat-overlay{bottom:18px!important;width:calc(100% - 36px)!important;height:82px!important}.hero-books,.hero-mug{opacity:.25}
}
@media(max-width:760px){
  .landing-page .premium-hero.reference-stage{min-height:950px!important;padding-bottom:90px!important;background:radial-gradient(circle at 68% 55%,rgba(42,116,185,.16),transparent 29%),linear-gradient(180deg,#020608,#06101a 62%,#03070b)!important}
  .room-windows,.room-bokeh,.hero-plant,.hero-books,.hero-mug{display:none}.premium-header{width:calc(100% - 28px);height:74px;grid-template-columns:1fr auto;gap:10px}.premium-brand img{width:35px;height:35px}.premium-brand span{font-size:14px}.premium-header-actions{display:none}.premium-menu-toggle{display:grid!important;place-items:center!important;position:relative!important;z-index:60!important;width:42px!important;height:42px!important;border:1px solid rgba(121,181,234,.25)!important;border-radius:11px!important;background:rgba(7,15,22,.78)!important;color:#e6f1fa!important}.premium-mobile-menu{top:62px!important;right:0!important;z-index:70!important;border-color:rgba(105,177,241,.26)!important;background:rgba(4,11,17,.98)!important}.premium-mobile-menu.open{display:grid!important}.premium-mobile-menu .mobile-menu-cta{background:linear-gradient(112deg,#f7fbfe,#cae2f3 48%,#9ec8e4)!important;color:#061019!important}
  .premium-copy{padding:34px 0 0}.premium-eyebrow{height:34px;padding:0 12px;font-size:8px}.premium-copy h1{margin-top:20px;font-size:clamp(46px,12.2vw,66px);line-height:.96}.premium-copy h1 span{white-space:normal}.premium-copy>p{font-size:14px;line-height:1.62;max-width:600px}.premium-cta-row{margin-top:22px;gap:10px}.premium-primary-cta,.premium-secondary-cta{height:54px;flex:1 1 160px;padding-inline:16px;font-size:12px}.premium-primary-cta span{margin-left:12px}.premium-trust-row{display:none}
  .premium-visual{min-height:500px;margin-top:32px}.hero-lamp{display:none}.code-laptop{left:50%;top:80px;width:min(620px,95vw);transform:translateX(-50%)}.laptop-base{height:118px}.screen-topbar{height:50px}.screen-toolbar{height:33px}.premium-hero .live-screen{height:calc(100% - 109px)!important;min-height:220px!important}.screen-symbol{min-width:130px}.screen-symbol strong{font-size:10px}.screen-price strong{font-size:12px}.screen-live{display:none}.premium-hero .live-quote-stack{width:calc(100vw - 24px)!important;grid-template-columns:repeat(3,1fr)!important}.premium-hero .quote-card,.premium-hero .quote-card.card-0,.premium-hero .quote-card.card-1,.premium-hero .quote-card.card-2{height:88px!important;padding:9px!important;border-radius:11px!important}.premium-hero .quote-card strong,.premium-hero .quote-card.card-0 strong{font-size:14px!important}.premium-hero .quote-card small{font-size:7px!important}.premium-hero .quote-card svg{display:none}.premium-hero .quote-card header{font-size:8px!important}.quote-symbol-wrap{gap:4px}.quote-asset{width:16px;height:16px;font-size:8px}
  .premium-hero .hero-stat-overlay{width:calc(100% - 28px)!important;height:74px!important;grid-template-columns:repeat(3,1fr)!important}.premium-hero .hero-stat-overlay article:nth-child(3),.premium-hero .hero-stat-overlay article:nth-child(4){display:none}.premium-hero .hero-stat-overlay strong{font-size:15px!important}.premium-hero .hero-stat-overlay small{font-size:7px!important}.premium-hero .hero-stat-icon{font-size:18px!important}.premium-hero .hero-stat-overlay article{gap:6px!important}.premium-hero .nav-popover{display:none!important}
}
@media(max-width:520px){
  .landing-page .premium-hero.reference-stage{min-height:860px!important}.premium-copy{padding-top:24px}.premium-copy h1{font-size:clamp(42px,13.1vw,58px)}.premium-copy>p{font-size:12.5px}.premium-primary-cta,.premium-secondary-cta{height:49px;flex-basis:145px;font-size:11px}.play-chip{width:34px;height:34px}.premium-visual{min-height:430px;margin-top:24px}.code-laptop{top:70px;width:97vw}.laptop-lid{padding:8px;border-radius:12px}.laptop-base{height:94px}.screen-topbar{height:44px;padding-inline:9px}.screen-toolbar{height:29px;padding-inline:8px}.screen-toolbar span,.screen-toolbar b{min-width:24px;height:20px;font-size:6.5px;padding-inline:4px}.premium-hero .live-screen{height:calc(100% - 97px)!important;min-height:183px!important}.screen-footer{height:21px;padding-inline:8px;font-size:5px}.screen-symbol small{display:none}.screen-price{padding-right:0}.premium-hero .live-quote-stack{gap:5px!important}.premium-hero .quote-card,.premium-hero .quote-card.card-0,.premium-hero .quote-card.card-1,.premium-hero .quote-card.card-2{height:76px!important;padding:8px!important}.premium-hero .quote-card strong,.premium-hero .quote-card.card-0 strong{font-size:12.5px!important}.premium-hero .hero-stat-overlay{height:66px!important}.premium-hero .hero-stat-icon{display:none}.premium-hero .hero-stat-overlay article{text-align:center;gap:0!important}.premium-hero .hero-stat-overlay strong{font-size:14px!important}.premium-hero .hero-stat-overlay small{font-size:6.5px!important}
}
@media(prefers-reduced-motion:reduce){.screen-live i{animation:none!important}.premium-primary-cta,.premium-secondary-cta,.header-start,.header-login{transition:none!important}}

/* v8.4.2 exact-reference hero mode: use the approved hero artwork as the desktop scene,
   then overlay only the live gold chart on the laptop screen so the visual match stays
   extremely close to the approved reference. */
.premium-hero.hero-reference-mode{
  position:relative;
  padding:0 0 3rem;
  background:radial-gradient(circle at 75% 18%,rgba(35,94,176,.18),transparent 32%),#060b11;
}
.hero-reference-shell{
  position:relative;
  width:min(100%,1680px);
  margin:0 auto;
  padding:0;
}
.hero-reference-frame{
  position:relative;
  width:100%;
  aspect-ratio:1680 / 945;
  overflow:hidden;
  border-radius:0 0 24px 24px;
  box-shadow:0 32px 90px rgba(0,0,0,.42);
  background:#060b11;
}
.hero-reference-art{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
  user-select:none;
  -webkit-user-drag:none;
}
.hero-screen-overlay{
  position:absolute;
  left:61.15%;
  top:24.35%;
  width:21.2%;
  height:40.35%;
  border-radius:14px;
  overflow:hidden;
  background:rgba(7,16,27,.10);
  box-shadow:
    inset 0 0 0 1px rgba(124,170,220,.18),
    inset 0 0 30px rgba(4,9,16,.15);
}
.hero-screen-overlay::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(3,8,15,.22),rgba(3,8,15,.06) 18%,rgba(255,255,255,0) 32%,rgba(3,8,15,.10));
  z-index:2;
}
.hero-screen-overlay::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(110deg,rgba(255,255,255,.04) 0%,rgba(255,255,255,.02) 26%,rgba(255,255,255,0) 45%,rgba(255,255,255,.03) 100%);
  mix-blend-mode:screen;
  z-index:2;
}
.hero-screen-overlay canvas{
  position:absolute;
  inset:0;
  width:100% !important;
  height:100% !important;
  display:block;
  filter:saturate(1.05) brightness(.98);
}
.hero-hotspot{
  position:absolute;
  z-index:3;
  background:transparent;
  border:0;
  outline:none;
  cursor:pointer;
  border-radius:22px;
  text-indent:-9999px;
  overflow:hidden;
}
.hero-hotspot:focus-visible{
  box-shadow:0 0 0 2px rgba(255,255,255,.85),0 0 0 5px rgba(71,142,243,.45);
}
.hotspot-login{left:77.1%;top:2.6%;width:6.4%;height:6.7%;border-radius:18px;}
.hotspot-get-started{left:84.5%;top:2.5%;width:11.1%;height:6.8%;border-radius:18px;}
.hotspot-start-trading{left:3.25%;top:52.85%;width:18.2%;height:8.8%;border-radius:18px;}
.hotspot-explore{left:22.35%;top:52.85%;width:18.1%;height:8.8%;border-radius:18px;}

/* Hide the old generated hero chrome when this mode is active. */
.hero-reference-mode .premium-header,
.hero-reference-mode .premium-hero-grid,
.hero-reference-mode .hero-stat-overlay{display:none !important;}

@media (max-width: 980px){
  .hero-reference-shell{padding:0 0 1rem;}
  .hero-reference-frame{border-radius:0 0 20px 20px;}
  .hero-screen-overlay{left:61.05%;top:24.4%;width:21.35%;height:40.1%;border-radius:9px;}
}

@media (max-width: 760px){
  .hero-reference-frame{aspect-ratio:1120 / 945;}
  .hero-reference-art{object-position:63% top;}
  .hero-screen-overlay{display:none;}
  .hero-hotspot{display:none;}
}

/* ===== v8.4.3 GLOBAL NETWORK PINNED-SCROLL FIX =====
   Desktop behavior: the globe remains pinned to the viewport while the 285vh
   network section advances, then releases naturally when the section ends.
   Mobile keeps the existing non-sticky compact behavior from mobile.css. */
@media (min-width: 901px){
  .landing-content{
    overflow:visible!important;
  }
  .network-v76{
    position:relative!important;
    overflow:visible!important;
    height:285vh!important;
    min-height:1800px!important;
  }
  .network-v76 .network-scroll-stage{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:100%!important;
    min-height:100%!important;
    overflow:visible!important;
  }
  .network-v76 .network-sticky{
    position:-webkit-sticky!important;
    position:sticky!important;
    top:0!important;
    width:100%!important;
    height:100vh!important;
    min-height:720px!important;
    overflow:hidden!important;
    z-index:1!important;
  }
}

/* ===== v8.4.4 EXACT MOBILE REFERENCE HERO =====
   Mobile uses the approved 9:16 artwork as the visual source of truth, while
   the XAU/USD canvas remains a live overlay inside the laptop screen. The
   desktop v8.4.2 hero and v8.4.3 pinned globe behavior remain intact. */
.hero-reference-picture{display:block;width:100%;height:100%;}
.hero-mobile-menu-toggle,
.hero-mobile-drawer,
.hero-mobile-menu-backdrop,
.hotspot-mobile-menu,
.hotspot-mobile-start,
.hotspot-mobile-explore{display:none;}

@media (max-width:760px){
  .premium-hero.hero-reference-mode{
    width:100%!important;
    max-width:none!important;
    min-height:0!important;
    padding:0 0 22px!important;
    margin:0!important;
    overflow:visible!important;
    background:#050a11!important;
  }
  .hero-reference-shell{
    position:relative!important;
    width:100%!important;
    max-width:none!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
  }
  .hero-reference-frame{
    position:relative!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:941 / 1672!important;
    min-height:0!important;
    overflow:hidden!important;
    border-radius:0 0 18px 18px!important;
    background:#050a11!important;
    box-shadow:0 24px 60px rgba(0,0,0,.46)!important;
  }
  .hero-reference-picture{
    position:absolute!important;
    inset:0!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
  }
  .hero-reference-art{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center top!important;
    transform:none!important;
    max-width:none!important;
  }

  /* Replace desktop clickable zones with coordinates matching the mobile art. */
  .hotspot-login,
  .hotspot-get-started,
  .hotspot-start-trading,
  .hotspot-explore{display:none!important;}

  .hotspot-mobile-menu,
  .hotspot-mobile-start,
  .hotspot-mobile-explore{
    display:block!important;
    position:absolute!important;
    z-index:8!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    cursor:pointer!important;
    -webkit-tap-highlight-color:transparent;
  }
  .hotspot-mobile-menu{
    left:83.8%!important;
    top:1.35%!important;
    width:11.1%!important;
    height:5.0%!important;
    border-radius:16px!important;
  }
  .hotspot-mobile-menu span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
  .hotspot-mobile-start{
    left:5.25%!important;
    top:36.65%!important;
    width:42.7%!important;
    height:5.15%!important;
    border-radius:16px!important;
  }
  .hotspot-mobile-explore{
    left:50.65%!important;
    top:36.65%!important;
    width:42.8%!important;
    height:5.15%!important;
    border-radius:16px!important;
  }
  .hotspot-mobile-menu:focus-visible,
  .hotspot-mobile-start:focus-visible,
  .hotspot-mobile-explore:focus-visible{
    outline:2px solid rgba(255,255,255,.9)!important;
    outline-offset:-3px!important;
  }

  /* Live gold chart sits only over the chart viewport printed on the laptop. */
  .hero-screen-overlay{
    display:block!important;
    left:38.0%!important;
    top:57.15%!important;
    width:47.5%!important;
    height:16.35%!important;
    border-radius:5px!important;
    overflow:hidden!important;
    background:rgba(4,12,23,.92)!important;
    box-shadow:inset 0 0 0 1px rgba(99,153,219,.16)!important;
    z-index:5!important;
  }
  .hero-screen-overlay::before{
    background:linear-gradient(180deg,rgba(4,12,22,.22),rgba(4,12,22,0) 24%,rgba(4,12,22,.08))!important;
  }
  .hero-screen-overlay::after{
    opacity:.42!important;
  }
  .hero-screen-overlay canvas{
    width:100%!important;
    height:100%!important;
    filter:saturate(1.16) contrast(1.04) brightness(1.02)!important;
  }

  /* Functional drawer is separate from the artwork, so the closed state stays pixel-clean. */
  .hero-mobile-menu-toggle{
    position:fixed!important;
    width:1px!important;
    height:1px!important;
    opacity:0!important;
    pointer-events:none!important;
  }
  .hero-mobile-drawer{
    display:flex!important;
    position:fixed!important;
    z-index:1002!important;
    top:14px!important;
    right:14px!important;
    width:min(86vw,360px)!important;
    max-height:calc(100dvh - 28px)!important;
    padding:18px!important;
    flex-direction:column!important;
    gap:8px!important;
    overflow:auto!important;
    transform:translateX(calc(100% + 32px))!important;
    opacity:0!important;
    pointer-events:none!important;
    transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .22s ease!important;
    border:1px solid rgba(134,176,224,.36)!important;
    border-radius:24px!important;
    background:linear-gradient(155deg,rgba(12,25,43,.98),rgba(4,10,18,.985))!important;
    box-shadow:0 24px 70px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.06)!important;
    backdrop-filter:blur(22px)!important;
    -webkit-backdrop-filter:blur(22px)!important;
  }
  .hero-mobile-drawer-head{
    display:grid!important;
    grid-template-columns:34px 1fr 40px!important;
    align-items:center!important;
    gap:9px!important;
    padding:4px 2px 14px!important;
    border-bottom:1px solid rgba(146,178,214,.16)!important;
  }
  .hero-mobile-drawer-head img{width:30px!important;height:30px!important;object-fit:contain!important;}
  .hero-mobile-drawer-head b{font:800 15px/1.1 Inter,system-ui,sans-serif!important;letter-spacing:.07em!important;color:#f8fbff!important;}
  .hero-mobile-drawer-head b span{color:#a486ff!important;}
  .hero-mobile-drawer-head label{
    display:grid!important;
    place-items:center!important;
    width:38px!important;
    height:38px!important;
    border:1px solid rgba(145,182,225,.28)!important;
    border-radius:12px!important;
    color:#fff!important;
    font:300 28px/1 system-ui!important;
    cursor:pointer!important;
    background:rgba(255,255,255,.025)!important;
  }
  .hero-mobile-drawer>a{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    min-height:48px!important;
    padding:0 14px!important;
    border:1px solid transparent!important;
    border-radius:14px!important;
    color:#e7eef7!important;
    text-decoration:none!important;
    font:650 15px/1 Inter,system-ui,sans-serif!important;
    background:rgba(255,255,255,.018)!important;
  }
  .hero-mobile-drawer>a:hover,
  .hero-mobile-drawer>a:focus-visible{
    border-color:rgba(98,164,249,.32)!important;
    background:rgba(75,132,209,.10)!important;
  }
  .hero-mobile-drawer>a span{color:#73b8ff!important;font-size:18px!important;}
  .hero-mobile-drawer-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
    margin-top:8px!important;
    padding-top:14px!important;
    border-top:1px solid rgba(146,178,214,.16)!important;
  }
  .hero-mobile-drawer-actions a{
    display:grid!important;
    place-items:center!important;
    min-height:48px!important;
    border:1px solid rgba(132,174,221,.32)!important;
    border-radius:14px!important;
    color:#f5f9ff!important;
    text-decoration:none!important;
    font:750 14px/1 Inter,system-ui,sans-serif!important;
  }
  .hero-mobile-drawer-actions a:last-child{
    color:#0a0e16!important;
    background:linear-gradient(120deg,#f8fbff,#b5cfff 45%,#9877ff)!important;
    border-color:rgba(255,255,255,.7)!important;
  }
  .hero-mobile-menu-backdrop{
    display:block!important;
    position:fixed!important;
    inset:0!important;
    z-index:1001!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    background:rgba(2,6,11,.62)!important;
    backdrop-filter:blur(5px)!important;
    -webkit-backdrop-filter:blur(5px)!important;
    transition:opacity .22s ease,visibility .22s ease!important;
  }
  #heroMobileMenuToggle:checked ~ .hero-mobile-drawer{
    transform:translateX(0)!important;
    opacity:1!important;
    pointer-events:auto!important;
  }
  #heroMobileMenuToggle:checked ~ .hero-mobile-menu-backdrop{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }

  /* Keep the next section visually separate after the tall mobile hero. */
  .landing-content{position:relative!important;z-index:1!important;overflow:visible!important;}
  .market-ribbon{margin-top:0!important;}
}

@media (max-width:420px){
  .hero-reference-frame{border-radius:0 0 14px 14px!important;}
  .hero-screen-overlay{left:37.9%!important;top:57.2%!important;width:47.7%!important;height:16.3%!important;}
  .hero-mobile-drawer{top:10px!important;right:10px!important;width:calc(100vw - 20px)!important;max-height:calc(100dvh - 20px)!important;border-radius:20px!important;}
}

/* v8.4.4 chart readiness: keep the reference artwork visible until live XAU candles arrive. */
.hero-screen-overlay canvas{opacity:0;transition:opacity .28s ease;}
.hero-screen-overlay.is-ready canvas{opacity:1;}
.hero-screen-overlay:not(.is-ready){background:transparent!important;box-shadow:none!important;}
@media (max-width:760px){
  .hero-screen-overlay:not(.is-ready)::before,
  .hero-screen-overlay:not(.is-ready)::after{opacity:0!important;}
  .hero-screen-overlay.is-ready{background:rgba(4,12,23,.92)!important;}
}

/* ===== v8.4.5 MOBILE HERO FLOW + SCALE FIX =====
   Fixes the legacy mobile.css fixed-height reservation that left a large black
   void below the 9:16 reference hero. Also gives the artwork a subtle edge-to-
   edge scale-up on phones so the hero reads larger and more premium without
   changing the approved composition or live XAU chart coordinates. */
@media (max-width:760px){
  .landing-page .premium-hero.reference-stage.hero-reference-mode{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
  }
  .premium-hero.hero-reference-mode .hero-reference-shell{
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
  }
  .premium-hero.hero-reference-mode .hero-reference-frame{
    width:104vw!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:941 / 1672!important;
    margin:0 0 0 -2vw!important;
    border-radius:0!important;
    box-shadow:none!important;
  }
  .premium-hero.hero-reference-mode .hero-reference-picture,
  .premium-hero.hero-reference-mode .hero-reference-art{
    width:100%!important;
    height:100%!important;
  }
  .premium-hero.hero-reference-mode .hero-reference-art{
    object-fit:cover!important;
    object-position:center top!important;
  }
  .landing-content{
    margin-top:0!important;
    padding-top:0!important;
  }
  .market-ribbon{
    margin-top:-1px!important;
  }
}

@media (max-width:430px){
  .premium-hero.hero-reference-mode .hero-reference-frame{
    width:105vw!important;
    margin-left:-2.5vw!important;
  }
}

/* ===== v8.4.6 GLOBAL NETWORK HARD PIN FIX =====
   Firefox/desktop-safe pinned globe. The previous sticky-only implementation could
   allow the 100vh visual to scroll out of its 285vh section, leaving a long black
   void before the next section. JS now moves the visual through before/pinned/after
   states while the section itself remains the scroll-progress track. */
@media (min-width:901px){
  .network-v76{
    position:relative!important;
    height:285vh!important;
    min-height:1800px!important;
    overflow:visible!important;
    isolation:isolate!important;
  }
  .network-v76 .network-scroll-stage{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    overflow:visible!important;
  }
  .network-v76 .network-sticky{
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:0!important;
    bottom:auto!important;
    width:100%!important;
    height:100vh!important;
    height:100dvh!important;
    min-height:0!important;
    max-height:none!important;
    overflow:hidden!important;
    z-index:5!important;
    transform:none!important;
    will-change:auto!important;
  }
  .network-v76.network-pin-active .network-sticky{
    position:fixed!important;
    left:0!important;
    right:0!important;
    top:0!important;
    bottom:auto!important;
    width:100vw!important;
    height:100vh!important;
    height:100dvh!important;
    z-index:20!important;
  }
  .network-v76.network-pin-ended .network-sticky{
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:auto!important;
    bottom:0!important;
    width:100%!important;
    height:100vh!important;
    height:100dvh!important;
    z-index:5!important;
  }
  /* Prevent the pinned layer from hiding sections after the network has released. */
  .network-v76 + .landing-section,
  .network-v76 + section{
    position:relative;
    z-index:2;
  }
}

/* ===== v8.4.7 LIVE SCREEN CLEANUP + LOADING + INTERACTION ===== */
.site-loader{position:fixed;inset:0;z-index:99999;display:grid;place-content:center;justify-items:center;gap:12px;background:radial-gradient(circle at 50% 42%,rgba(62,103,187,.18),transparent 30%),#05090f;color:#f7f9ff;transition:opacity .36s ease,visibility .36s ease;overflow:hidden}.site-loader.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.site-loader-mark{position:relative;width:72px;height:72px;display:grid;place-items:center}.site-loader-mark img{width:38px;height:38px;filter:drop-shadow(0 0 18px rgba(112,142,255,.42))}.site-loader-mark span{position:absolute;inset:0;border:1px solid rgba(151,174,255,.17);border-top-color:#8fc8ff;border-right-color:#9a7bff;border-radius:50%;animation:tfxSiteSpin .85s linear infinite}.site-loader>b{font:800 13px/1 Inter,system-ui,sans-serif;letter-spacing:.17em}.site-loader>b span{color:#9a80ff}.site-loader>small{font:600 9px/1 Inter,system-ui,sans-serif;letter-spacing:.17em;text-transform:uppercase;color:#718094}@keyframes tfxSiteSpin{to{transform:rotate(360deg)}}

/* The approved hero artwork already contains a chart. Cover the ENTIRE physical
   laptop display with an opaque coded terminal before drawing live candles so no
   ghost/static chart can show through beneath the live layer. */
.hero-screen-overlay{
  left:57.7%!important;
  top:20.2%!important;
  width:27.2%!important;
  height:47.5%!important;
  display:grid!important;
  grid-template-rows:13% 9% 1fr!important;
  border-radius:13px!important;
  overflow:hidden!important;
  background:#07111c!important;
  border:1px solid rgba(105,153,206,.20)!important;
  box-shadow:inset 0 0 42px rgba(0,0,0,.44),0 0 0 1px rgba(5,11,19,.72)!important;
  z-index:5!important;
  isolation:isolate!important;
}
.hero-screen-overlay::before{content:""!important;position:absolute!important;inset:0!important;z-index:0!important;background:linear-gradient(180deg,#07121f 0%,#06101b 28%,#050d16 100%)!important;opacity:1!important;pointer-events:none!important}
.hero-screen-overlay::after{content:""!important;position:absolute!important;inset:0!important;z-index:4!important;pointer-events:none!important;background:linear-gradient(112deg,rgba(255,255,255,.035),transparent 32%,transparent 72%,rgba(103,166,233,.025))!important;mix-blend-mode:screen!important;opacity:.7!important}
.hero-live-screen-head,.hero-live-screen-tools,.hero-live-canvas{position:relative;z-index:2;min-width:0}
.hero-live-screen-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 12px;border-bottom:1px solid rgba(109,149,186,.12);background:rgba(7,16,27,.98);font-family:Inter,system-ui,sans-serif}.hero-live-screen-head>div{min-width:0}.hero-live-screen-head>div:last-child{display:flex;align-items:center;gap:8px}.hero-live-symbol{display:block;color:#eef5fb;font-size:10px;font-weight:800;letter-spacing:.04em}.hero-live-screen-head small{display:block;color:#657d91;font-size:6px;margin-top:2px}.hero-live-screen-head strong{font-size:12px;color:#dceeff;letter-spacing:-.02em}.hero-live-badge{display:inline-flex;align-items:center;gap:4px;padding:4px 6px;border:1px solid rgba(61,225,178,.28);border-radius:999px;color:#58e5b9;font-size:5px;font-weight:850;letter-spacing:.12em}.hero-live-badge i{width:4px;height:4px;border-radius:50%;background:#54e2b6;box-shadow:0 0 8px #54e2b6;animation:heroLivePulse 1.3s ease-in-out infinite}@keyframes heroLivePulse{50%{opacity:.4;transform:scale(.72)}}
.hero-live-screen-tools{display:flex;align-items:center;gap:4px;padding:4px 10px;border-bottom:1px solid rgba(109,149,186,.09);background:#07111c;font-family:Inter,system-ui,sans-serif}.hero-live-screen-tools span,.hero-live-screen-tools b{display:grid;place-items:center;min-width:25px;height:20px;border-radius:5px;color:#71869a;font-size:6px;font-weight:700}.hero-live-screen-tools span.active{background:rgba(65,133,218,.12);color:#b8d7f7}.hero-live-screen-tools b{margin-left:auto;min-width:18px}.hero-live-screen-tools b+b{margin-left:0}
.hero-live-canvas{overflow:hidden;background:#06101a}.hero-live-canvas canvas{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;display:block!important;opacity:1!important;filter:saturate(1.06) contrast(1.03)!important}.hero-screen-overlay:not(.is-ready){background:#07111c!important;box-shadow:inset 0 0 42px rgba(0,0,0,.44)!important}.hero-screen-overlay:not(.is-ready) .hero-live-canvas::before{content:"Connecting to XAU/USD…";position:absolute;inset:0;z-index:3;display:grid;place-items:center;color:#63798d;font:650 7px/1 Inter,system-ui,sans-serif;letter-spacing:.08em}.hero-screen-overlay:not(.is-ready) canvas{opacity:0!important}.hero-screen-overlay.is-ready canvas{opacity:1!important}

/* The visual buttons are baked into the approved artwork; these interaction halos
   make them feel like real controls without altering the approved composition. */
.hero-hotspot{overflow:visible!important;transition:filter .2s ease,transform .18s ease!important}.hero-hotspot::after{content:"";position:absolute;inset:0;border-radius:inherit;opacity:0;box-shadow:0 0 0 1px rgba(156,192,255,.38),0 0 28px rgba(90,129,255,.30);transition:opacity .2s ease,transform .2s ease;pointer-events:none}@media(hover:hover){.hero-hotspot:hover::after{opacity:1;transform:scale(1.015)}.hero-hotspot:hover{filter:brightness(1.08)}}.hero-hotspot:active{transform:scale(.985)!important}

@media(max-width:760px){
  .hero-screen-overlay{
    left:34.9%!important;
    top:54.45%!important;
    width:54.2%!important;
    height:23.15%!important;
    grid-template-rows:13% 9% 1fr!important;
    border-radius:6px!important;
  }
  .hero-live-screen-head{padding:4px 7px}.hero-live-symbol{font-size:7px}.hero-live-screen-head small{font-size:4.5px}.hero-live-screen-head strong{font-size:8px}.hero-live-badge{font-size:3.8px;padding:2px 4px}.hero-live-screen-tools{padding:2px 6px;gap:2px}.hero-live-screen-tools span,.hero-live-screen-tools b{min-width:18px;height:13px;font-size:4.5px;border-radius:3px}.hero-live-screen-tools b{min-width:12px}
  .hotspot-mobile-menu::after,.hotspot-mobile-start::after,.hotspot-mobile-explore::after{border-radius:inherit}
}

/* ===== v9.0.4 INSTALL APP BUTTON =====
   A real button laid over the hero art (the other hero buttons are part of the picture), under the feature row on
   desktop and under the stats row on phones. Links to /download. */
.hero-install-app{position:absolute;z-index:9;left:4.15%;top:72.6%;display:inline-flex;align-items:center;gap:clamp(8px,.8vw,13px);height:max(46px,6.1%);padding:0 clamp(14px,1.3vw,22px) 0 clamp(6px,.55vw,9px);border:1px solid rgba(160,196,255,.42);border-radius:clamp(13px,1.1vw,18px);background:linear-gradient(135deg,rgba(14,22,34,.82),rgba(10,14,22,.70));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#f5f9ff;text-decoration:none;box-shadow:0 14px 40px rgba(0,0,0,.45),0 0 0 1px rgba(155,124,255,.12),inset 0 1px 0 rgba(255,255,255,.10);transition:transform .18s ease,box-shadow .2s ease,border-color .2s ease}
.hero-install-app:hover{transform:translateY(-2px);border-color:rgba(190,170,255,.75);box-shadow:0 18px 48px rgba(0,0,0,.5),0 0 30px rgba(121,85,231,.35),inset 0 1px 0 rgba(255,255,255,.14)}
.hero-install-app:focus-visible{outline:2px solid rgba(255,255,255,.9);outline-offset:3px}
.hero-install-icon{display:grid;place-items:center;width:clamp(34px,2.6vw,44px);height:clamp(34px,2.6vw,44px);border-radius:clamp(10px,.8vw,13px);background:linear-gradient(120deg,#f8fbff,#b5cfff 45%,#9877ff);color:#0a0e16;flex:none}
.hero-install-icon{overflow:hidden;background:#1565c0!important;box-shadow:0 0 0 1px rgba(255,255,255,.18)}
.hero-install-icon img{display:block;width:100%;height:100%;object-fit:cover}
.hero-install-text{display:grid;line-height:1.1}
.hero-install-text b{font:800 clamp(14px,1.08vw,17px)/1.1 Inter,system-ui,sans-serif;letter-spacing:.01em}
.hero-install-text small{margin-top:3px;font:600 clamp(10.5px,.78vw,12.5px)/1 Inter,system-ui,sans-serif;color:#a9b7c8}
.hero-install-arrow{margin-left:clamp(4px,.5vw,8px);color:#b5cfff;font-size:clamp(16px,1.2vw,20px);transition:transform .18s ease}
.hero-install-app:hover .hero-install-arrow{transform:translateX(3px)}
@media (max-width:760px){
  /* the gap between the stats row (ends ~48%) and the quote cards (start ~54%) of the phone art */
  .hero-install-app{left:5.25%!important;top:48.4%!important;height:5.4%!important;min-height:36px!important;padding:0 14px 0 5px!important;border-radius:12px!important;gap:8px!important}
  .hero-install-icon{width:28px!important;height:28px!important;border-radius:8px!important}
  .hero-install-text b{font-size:13.5px!important}
  .hero-install-text small{margin-top:2px!important;font-size:10px!important}
  .hero-install-arrow{font-size:15px!important}
  .hero-drawer-install{border-color:rgba(155,124,255,.45)!important;background:linear-gradient(120deg,rgba(155,124,255,.18),rgba(114,173,243,.10))!important;color:#fff!important;font-weight:750!important}
}
@media (min-width:761px){.hero-drawer-install{display:none}}