/* German motion layer. The chart, trade and booking share one timeline. */
.hero{overflow:hidden}
.hero-motion{position:absolute;right:0;top:0;bottom:0;width:49%;z-index:0;pointer-events:none;isolation:isolate}
.hero-motion canvas{position:absolute;inset:6% 2% auto 0;width:98%;height:40%;opacity:.72;mask-image:linear-gradient(90deg,transparent,#000 15%,#000 95%,transparent)}
.hero-inner{position:relative;z-index:1;pointer-events:none}
.hero-copy{pointer-events:auto}
.hero-booking{pointer-events:auto;position:absolute;right:7%;bottom:34px;width:310px;max-width:90%;padding:18px 22px;background:linear-gradient(135deg,#04182aeb,#031120f2);border:1px solid #4599c66b;border-radius:9px;box-shadow:0 10px 40px #0005,0 0 35px #168ce61c;backdrop-filter:blur(10px)}
.hero-booking-top{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;letter-spacing:.08em;color:#c1cfdf}
.motion-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#42c2ff;box-shadow:0 0 9px #2dbaff;margin-right:6px}
.hero-booking strong{display:block;margin:7px 0 3px;font-size:32px;line-height:1.25;font-variant-numeric:tabular-nums;letter-spacing:-.04em;color:#f3d58b}
.hero-booking p{font-size:12px;color:#9db5d0}
.hero-motion .motion-controls{margin-top:12px;gap:10px}
.hero-motion .motion-controls button{font-size:11px;padding:5px 0;min-height:30px}
.hero-motion .motion-controls button+button{margin-left:auto}
.motion-note{font-size:11px;line-height:1.5;color:#a7bdd4}
.motion-controls{display:flex;align-items:center;flex-wrap:wrap;gap:10px 20px}
.motion-controls button{background:transparent;color:#d3e6fb;border-bottom:1px solid #4285aa72;padding:6px 0;font-size:12px;line-height:1.5;min-height:36px}
.motion-controls button:hover{color:var(--gold);border-color:var(--gold)}
.trade-demo{grid-column:1/-1;min-width:0;margin:30px 0 0;padding:23px 22px 19px;background:linear-gradient(135deg,#08233eeb,#030e1e);border:1px solid #2b7cac;border-radius:10px;box-shadow:0 0 50px #147dd218;isolation:isolate;position:relative;overflow:hidden}
.trade-demo:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 15% 50%,#168bf918,transparent 68%);pointer-events:none}
.trade-demo-head{display:flex;justify-content:space-between;align-items:flex-start;gap:15px;margin-bottom:10px}
.trade-demo-head strong{display:block;font-size:18px;line-height:1.4;letter-spacing:-.02em}
.trade-demo-head span{font-size:11px;color:#aec4dc}
.demo-label{font-size:9px;letter-spacing:.12em;padding:4px 8px;border:1px solid #388dbd;color:#78d2ff;white-space:nowrap;border-radius:3px}
.demo-chart{height:240px;width:100%;display:block}
.demo-phase{display:flex;align-items:center;gap:8px;font-size:12px;line-height:1.4;min-height:22px;color:#e7cc84;margin-top:5px}
.demo-phase:before{content:"";display:block;width:6px;height:6px;flex-shrink:0;border-radius:50%;background:var(--gold)}
.demo-accounts{margin:18px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.demo-account{min-width:0;padding:12px 13px;border:1px solid #235574;background:#05192ab3;border-radius:5px}
.demo-account:first-child{grid-column:1/-1;border-color:#4585ad;background:#0b2944b3}
.demo-account-label{display:flex;justify-content:space-between;gap:8px;font-size:10px;color:#9eb7d2}
.demo-account-label em{font-size:9px;letter-spacing:.03em}
.demo-account strong{display:block;font-size:23px;line-height:1.5;font-variant-numeric:tabular-nums;color:#e6f2ff}
.demo-account:first-child strong{font-size:28px}
.demo-account small{display:block;color:#e2c984;font-size:10px;line-height:1.5}
.demo-account [data-demo-profit]{font-size:13px;color:#e2c984}
.demo-summary{margin-top:15px;border-block:1px solid #2b5575;padding:14px 0;display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:12px;color:#bdd0e6}
.demo-summary strong{font-size:27px;line-height:1.2;color:var(--gold);font-variant-numeric:tabular-nums;white-space:nowrap;letter-spacing:-.03em}
.trade-demo>.motion-note{margin-top:13px}
.trade-demo>.motion-controls{margin-top:10px;justify-content:space-between}
.trade-demo[data-hits="1"] .demo-account,.trade-demo[data-hits="2"] .demo-account{border-color:#a68b4590}
.motion-snapshot{display:none}
@media(max-width:1190px){.hero-booking{right:5%;width:280px;bottom:25px}.hero-booking strong{font-size:29px}.trade-demo{padding:20px 16px}.demo-account strong{font-size:22px}}
@media(min-width:681px) and (max-width:960px){.hero-motion{width:40%}.hero-booking{width:260px;right:7%;padding:15px}.hero-booking strong{font-size:27px}.trade-demo{max-width:680px;margin-inline:auto;width:100%}.copy-story .trade-demo{grid-column:1/-1;grid-row:auto;margin-top:25px}.demo-accounts{grid-template-columns:repeat(4,minmax(0,1fr))}.demo-account strong{font-size:21px}.demo-account:first-child{grid-column:1/-1}.demo-chart{height:270px}}
@media(max-width:680px){.hero,.hero-inner{min-height:850px}.hero-inner{padding-bottom:395px}.hero-motion{top:auto;height:380px;width:100%;bottom:0}.hero-motion canvas{inset:0 0 auto 0;height:180px;width:100%;opacity:.55}.hero-booking{right:18px;bottom:17px;width:calc(100% - 36px);max-width:none;padding:13px 17px}.hero-booking-top{font-size:10px}.hero-booking strong{font-size:30px;margin:4px 0 0}.hero-booking p{font-size:11px}.hero-motion .motion-controls{margin-top:5px}.hero-motion .motion-controls button{min-height:36px;font-size:11px}.trade-demo{margin-top:25px;padding:19px 14px 16px}.trade-demo-head strong{font-size:17px}.trade-demo-head span{font-size:10px}.demo-chart{height:225px}.demo-account{padding:11px}.demo-account strong{font-size:21px}.demo-summary strong{font-size:25px}.demo-summary{font-size:11px}.trade-demo>.motion-note{font-size:10px;line-height:1.6}.motion-controls button{min-height:44px}.demo-phase{font-size:11px}.demo-label{font-size:8px;padding:4px 6px}.demo-account-label{font-size:9px}.hero h1{position:relative}}
@media(max-width:370px){.demo-account strong{font-size:19px}.demo-account{padding:10px 8px}.demo-account-label{flex-wrap:wrap;gap:2px}.demo-summary strong{font-size:23px}}
@media(prefers-reduced-motion:reduce){.hero-motion canvas{opacity:.4}}
