
@font-face{font-family:"Roboto";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/rf/font/roboto-400.woff2) format("woff2")}
@font-face{font-family:"Roboto";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/rf/font/roboto-500.woff2) format("woff2")}
@font-face{font-family:"Roboto";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/rf/font/roboto-700.woff2) format("woff2")}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:Roboto,-apple-system,"Segoe UI",sans-serif;color:#000;background:#fff;-webkit-font-smoothing:antialiased;line-height:1.55}
a{color:#327AD9;text-decoration:none}
button{font-family:inherit}
.page{display:flex;min-height:100vh;align-items:stretch}
/* ---- linke Spalte ---- */
.hero{position:relative;flex:0 0 512px;width:512px;margin:17px;min-height:calc(100vh - 34px);border-radius:21.33px;overflow:hidden;padding:64px;color:#fff;background:#194797}
.hero video{position:absolute;top:10%;left:0;width:100%;height:100%;object-fit:cover}
.hero .ov1{position:absolute;inset:0;background:linear-gradient(rgb(25,71,151) 0%,rgba(0,98,178,.7) 60%,rgba(0,98,178,.2) 120%)}
.hero .ov2{position:absolute;inset:0;mix-blend-mode:multiply;backdrop-filter:blur(2px);background:linear-gradient(rgb(25,71,151) 0%,rgba(0,98,178,.7) 100%,rgba(61,134,195,.1) 120%)}
.stack{position:relative;display:flex;flex-direction:column;gap:64px;height:100%;min-height:840px}
.rf-logo{width:210px;height:40px;color:#fff;display:block}
.hero h1{margin:0;font-size:32px;line-height:32px;font-weight:700;color:#fff}
.hero h1 span{color:#71AA28}
.adv{display:flex;flex-direction:column;gap:42.67px}
.adv-row{display:flex;gap:21.33px;align-items:flex-start}
.adv-row img{height:48px;width:48px;display:block}
.adv-row p{margin:0}
.adv-t{font-size:20px;line-height:30px;font-weight:500}
.adv-s{font-size:16px;line-height:16px;font-weight:400;opacity:.7}
.ratings{display:flex;gap:42.67px;align-items:center}
.ratings img{height:44px;display:block}
.trusted{margin-top:auto;display:flex;align-items:center;gap:16px;padding:24px;border:1px solid rgba(255,255,255,.35);border-radius:12.8px;background:rgba(255,255,255,.04)}
.rf-trusted-icon{width:40px;height:40px;flex:0 0 40px;color:#fff}
.trusted p{margin:0}
.trusted .t{font-size:18px;line-height:24px;font-weight:500}
.trusted .s{font-size:16px;line-height:24px;opacity:.7}
.trusted-mobile{display:none}
/* ---- rechte Spalte ---- */
.main{flex:1 1 auto;display:flex;flex-direction:column;align-items:center;padding:0 17px 17px;min-width:0}
.card{width:405px;max-width:100%;margin-top:60px}
.tabs{display:flex;border-bottom:1px solid #E6E9ED;height:52px}
.tab{flex:1;display:flex;align-items:center;justify-content:center;font-size:21.33px;font-weight:500;color:#687587;border-bottom:2px solid transparent;margin-bottom:-1px;text-decoration:none}
.tab.active{color:#2D6FC5;border-bottom-color:#2D6FC5}
form{margin-top:42px}
.field{position:relative;margin-bottom:20px}
.input{display:block;width:100%;height:48px;padding:14px;border:1px solid #CED4DA;border-radius:4.27px;background:#fff;font:400 14px/20px Roboto,sans-serif;color:#000;outline:none;-webkit-appearance:none;appearance:none}
.input::placeholder{color:#687587;opacity:1}
.input:focus{border-color:#2D6FC5}
.field.error .input{border-color:#E03131}
.err{display:none;margin:4px 0 0 17px;font-size:13px;color:#E03131}
.field.error .err{display:block}
.phone{display:flex;gap:8px;align-items:flex-start;margin-bottom:0}
.phone .plus{width:9px;margin-top:13px;font-size:16px;line-height:1;color:#333}
.phone .input{flex:1}
.hint{margin:4px 0 0 17px;font-size:13px;line-height:18px;color:#C9CED5}
.partner{margin-top:4px;display:inline-flex;align-items:center;gap:2px;font-size:16px;line-height:20px;color:#2D6FC5;background:none;border:0;padding:0;cursor:pointer}
.partner svg{width:20px;height:20px;transition:transform .4s;transform:rotate(180deg)}
.partner.open svg{transform:rotate(0deg)}
.partner-field{display:none;margin-top:12px}
.partner-field.open{display:block}
.checks{margin-top:36px;display:flex;flex-direction:column;gap:18px}
.check{display:flex;gap:13px;align-items:flex-start;cursor:pointer}
.check input{position:absolute;opacity:0;width:0;height:0}
.box{flex:0 0 24px;width:24px;height:24px;border:1px solid #CED4DA;border-radius:4.27px;background:#fff;display:flex;align-items:center;justify-content:center;margin-top:1px}
.box svg{width:18px;height:18px;opacity:0}
.check input:checked + .box{background:#2D6FC5;border-color:#2D6FC5}
.check input:checked + .box svg{opacity:1}
.check input:focus-visible + .box{outline:2px solid #2D6FC5;outline-offset:2px}
.check .txt{font-size:14.93px;line-height:20px;color:#687587}
.check.error .box{border-color:#E03131}
.btn{display:block;width:100%;height:48px;margin-top:30px;border:0;border-radius:4px;background:#2D6FC5;color:#fff;font-size:18px;font-weight:500;cursor:pointer}
.btn:hover{background:#2762B0}
.btn[disabled]{opacity:.7;cursor:default}
.byreg{margin:20px 0 0;text-align:center;font-size:13px;line-height:18.46px;color:#333}
.legal{width:100%;margin-top:20px;color:#A1AEB7;font-size:12.8px;line-height:16px}
.legal p{margin:0}
.legal .copy{margin-top:22px}
.legal a{color:#327AD9}
/* Code-Schritt */
.step{display:none}
.step.active{display:block}
.float{position:relative}
.float label{position:absolute;top:-8px;left:12px;padding:0 4px;background:#fff;font-size:12px;line-height:16px;color:#687587}
.float .input{height:56px;padding:18px 14px 14px}
.note{margin:22px 0 0;font-size:16px;line-height:24px;color:#333}
.back{display:block;margin:22px auto 0;background:none;border:0;font-size:18px;font-weight:500;color:#2D6FC5;cursor:pointer}
.formerr{display:none;margin:16px 0 0;padding:12px 14px;border-radius:4px;background:#FFF5F5;color:#C92A2A;font-size:14px;line-height:20px}
.formerr.show{display:block}
.mt20{margin-top:20px}
.mt34{margin-top:34px}
/* Captcha-Weiterreichung (nur wenn RoboForex sie verlangt) */
.cap{margin-top:30px;border:1px solid #CED4DA;border-radius:4.27px;padding:14px}
.cap-title{font-size:14px;color:#333;margin:0 0 10px}
.cap-stage{position:relative;width:240px;height:150px;margin:0 auto;border-radius:4px;overflow:hidden;background:#f1f3f5}
.cap-stage canvas{position:absolute;top:0;left:0}
.slider{position:relative;width:240px;margin:10px auto 0;height:40px;border-radius:4px;background:#E9ECEF;overflow:hidden}
.slider .knob{position:absolute;top:0;left:0;width:50px;height:40px;border-radius:4px;background:#2D6FC5;cursor:grab;touch-action:none;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;user-select:none}
.slider .hint2{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:13px;color:#687587;pointer-events:none}
.cap-tools{display:flex;justify-content:flex-end;width:240px;margin:6px auto 0}
.cap-tools button{background:none;border:0;color:#2D6FC5;font-size:13px;cursor:pointer}
.hidden-sm{display:block}
/* Mobil-Kopf */
.sb{display:none}
.mhero{display:none}
@media (max-width:1023px){
  .page{display:block}
  .hero{display:none}
  .sb{display:flex;align-items:center;gap:12px;height:77px;padding:0 17px;background:#fff;border-bottom:1px solid #E6E9ED}
  .sb .x{width:24px;height:24px;color:#C9CED5;font-size:22px;line-height:24px;text-align:center}
  .sb .app{width:48px;height:48px;border-radius:12px;background:#1E64D0;display:flex;align-items:center;justify-content:center}
  .sb .app svg{width:30px;height:30px;color:#fff}
  .sb .name{flex:1;font-size:20px;font-weight:700;color:#1E4FA3}
  .sb .dl{height:40px;padding:0 18px;border:0;border-radius:4px;background:#71AA28;color:#fff;font-size:16px;font-weight:500;text-decoration:none;display:inline-flex;align-items:center}
  .mhero{display:block;position:relative;height:230px;overflow:hidden;background:#002887;color:#fff}
  .mhero video{position:absolute;top:0;left:0;width:100%;height:120%;object-fit:cover}
  .mhero .ov{position:absolute;inset:0;mix-blend-mode:multiply;backdrop-filter:blur(2px);background:linear-gradient(rgb(0,40,135) 0%,rgba(0,40,135,.9) 70%,rgba(0,40,135,.8) 100%)}
  .mhero .in{position:relative;display:flex;flex-direction:column;align-items:center;gap:22px;padding-top:40px}
  .mhero .rf-logo{width:210px;height:40px}
  .car{position:relative;width:300px;height:48px}
  .car .adv-t{white-space:nowrap}
  .car .adv-row{position:absolute;inset:0;opacity:0;animation:car 9s infinite}
  .car .adv-row:nth-child(2){animation-delay:3s}
  .car .adv-row:nth-child(3){animation-delay:6s}
  @keyframes car{0%{opacity:0}5%{opacity:1}30%{opacity:1}36%{opacity:0}100%{opacity:0}}
  .main{display:block;padding:0}
  .card{width:auto;margin:-26px 0 0;background:#fff;border-radius:24px 24px 0 0;padding:16px 17px 0}
  .tabs{height:52px}
  form{margin-top:42px}
  .legal{padding:0 17px 17px;margin-top:26px}
  .trusted-mobile{display:flex;align-items:center;gap:16px;margin:40px 17px 0;padding:16px;border:1px solid #E6E9ED;border-radius:8.5px;background:#fff;color:#333}
  .trusted-mobile .rf-trusted-icon{width:36px;height:36px;flex:0 0 36px;color:#71AA28}
  .trusted-mobile p{margin:0}
  .trusted-mobile .t{font-size:14px;line-height:20px;font-weight:500}
  .trusted-mobile .s{font-size:12px;line-height:16px;opacity:.7}
}
