/* Velocity site, v5 2026-11-04: the v4 layout restyled to the taste-skill house rules.
   Deep navy like the real dashboard and MT5 charts, gold for actions (it is a gold product), the five
   strategy colours from the dashboard, red only for risk, blue for the equity curve. One family, Archivo.
   No lines, outlines, shadows or gradients: surfaces are told apart by a step in tone, sections by space.
   Five text sizes: --xl display, --l section heads and big figures, --m leads and item heads, --s body, --xs notes.
   Pictures are motion-graphic loops made from the real reports (HyperFrames, Marketing\Videos\hyperframes\site_*.html)
   next to the two real screen recordings.
   Motion (site.js, GSAP) plays once as a block comes into view; it never holds or steers the scroll.
   Without JS or with reduced motion every block is shown in its final state and the loops rest on their posters. */
*{margin:0;padding:0;box-sizing:border-box;}
:root{
  --bg:#0C121C; --bg2:#101826; --card:#151E2D; --card2:#1B2638; --card3:#243149;
  --line:rgba(255,255,255,.08); --line2:rgba(255,255,255,.14);
  --text:#EEF2F7; --mut:#A7B0BE; --dim:#8A94A5;
  --gold:#E8B143; --gold-hi:#F3C766; --blue:#6283FF; --red:#FF5B4F;
  --titan:#E8B143; --strike:#2AA8E0; --surge:#FF5C87; --volt:#3ECF8E; --pulse:#8F7CFF;
  --sans:'Archivo',system-ui,sans-serif; --navh:62px; --r:8px;
  --xl:clamp(38px,5.6vw,84px); --l:clamp(30px,3.8vw,54px); --m:clamp(19px,1.5vw,21px); --s:17px; --xs:15px;
  /* older names still used in page-level styles (reports, pay, status, free, legal) */
  --ink:#FFFFFF; --ink2:var(--mut); --ink3:var(--dim); --rule:var(--line2); --rule2:var(--line);
  --paper:var(--bg); --white:var(--card); --hi:var(--gold);
}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
[id]{scroll-margin-top:76px;}
body{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:var(--s);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
h1,h2,h3{font-stretch:80%;font-weight:760;line-height:1.02;letter-spacing:-.012em;text-wrap:balance;color:#fff;}
h1{font-size:var(--xl);font-stretch:72%;line-height:.96;letter-spacing:-.02em;}
h2{font-size:var(--l);}
h3{font-size:var(--m);font-stretch:88%;font-weight:700;line-height:1.2;letter-spacing:0;}
p{max-width:62ch;}
p,li,figcaption{text-wrap:pretty;}
.h3,.doc .h3{font-size:var(--m);font-stretch:88%;font-weight:700;line-height:1.2;letter-spacing:0;margin-top:0;}
a{color:var(--gold);text-underline-offset:3px;text-decoration-thickness:1px;}
a:hover{text-decoration-thickness:2px;}
img,video,svg{max-width:100%;display:block;}
b,strong{font-weight:680;color:#fff;}
::selection{background:var(--gold);color:var(--bg);}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:3px;}
.wrap{max-width:1160px;margin:0 auto;padding:0 clamp(16px,4vw,40px);}
.note{font-size:var(--xs);line-height:1.55;color:var(--dim);}
.lead{margin-top:18px;color:var(--mut);font-size:var(--m);line-height:1.5;}
.head{max-width:66ch;margin-bottom:clamp(24px,4vw,44px);}
.hl{color:var(--gold);font-weight:700;}

/* notice + nav: a plain solid bar */
.notice{background:var(--gold);color:#16110A;font-size:var(--xs);font-weight:600;line-height:1.4;text-align:center;padding:8px 16px;}
.notice a{color:#16110A;font-weight:760;}
nav.top{position:sticky;top:0;z-index:50;background:var(--bg);}
.navin{display:flex;align-items:center;justify-content:space-between;gap:16px;height:var(--navh);max-width:1160px;margin:0 auto;padding:0 clamp(16px,4vw,40px);}
.brand{display:flex;align-items:center;gap:10px;font-weight:760;font-stretch:84%;font-size:var(--m);color:#fff;text-decoration:none;margin-right:auto;}
.brand .m{width:32px;height:32px;border-radius:var(--r);background:#2B3BEA;display:flex;align-items:center;justify-content:center;}
.brand .m svg{width:18px;height:18px;color:#fff;}
.nlinks{display:flex;gap:clamp(14px,2vw,26px);list-style:none;font-size:var(--xs);font-weight:560;margin-right:8px;}
.nlinks a{color:var(--mut);text-decoration:none;transition:color .15s;}
.nlinks a:hover,.nlinks a[aria-current]{color:#fff;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:12px 24px;font-family:var(--sans);font-size:var(--s);font-weight:700;font-stretch:90%;line-height:1.2;border-radius:var(--r);border:0;text-decoration:none;cursor:pointer;transition:background .15s,color .15s,transform .15s;}
.btn:active{transform:translateY(1px);}
.btn-ink,.btn-gold,.btn-paper{background:var(--gold);color:#16110A!important;}
.btn-ink:hover,.btn-gold:hover,.btn-paper:hover{background:var(--gold-hi);}
.btn-line{background:var(--card3);color:#fff!important;}
.btn-line:hover{background:#2E3D58;}
.btn-sm{min-height:40px;padding:8px 16px;font-size:var(--xs);}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px;}
.burger{display:none;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:none;border:0;cursor:pointer;width:44px;height:44px;margin-right:-10px;position:relative;z-index:62;}
.burger span{width:22px;height:2px;background:#fff;display:block;transition:transform .2s,opacity .2s;}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
#mobnav{display:none;}

/* sections */
.section{padding:clamp(64px,8vw,112px) 0;}
.alt{background:var(--bg2);}
.band-ink{background:var(--bg2);}
.section:not(.alt)+.section:not(.alt),.alt+.alt{padding-top:0;}

/* hero: the title runs the full width on two lines; the lead and the dashboard recording sit under it */
.hero{padding:clamp(36px,6vw,88px) 0 clamp(64px,8vw,112px);}
.hero h1{max-width:none;}
.hero h1 .w{display:inline-block;}
.hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,5vw,72px);align-items:start;margin-top:clamp(28px,4vw,48px);}
.hero .lead{max-width:40ch;margin-top:0;}
.hero .facts{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:28px;font-size:var(--xs);color:var(--mut);}
.device{position:relative;justify-self:end;width:100%;max-width:330px;}
.device video,.device img{width:100%;height:auto;aspect-ratio:600/1488;object-fit:cover;border-radius:var(--r);background:#05080D;}
.device .cap{margin-top:10px;font-size:var(--xs);color:var(--dim);}

/* equity curve */
.curve-card{background:var(--card);border-radius:var(--r);padding:clamp(18px,3vw,40px);}
.curve-top{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;}
.curve-top h2{max-width:20ch;}
.counters{display:flex;gap:clamp(18px,4vw,44px);font-variant-numeric:tabular-nums;}
.counters div{text-align:right;}
.counters b{display:block;font-size:var(--l);font-weight:780;font-stretch:76%;line-height:.95;color:var(--blue);}
.counters span{font-size:var(--xs);color:var(--dim);}
.chart{position:relative;margin-top:clamp(18px,3vw,32px);}
.chart .plot{position:relative;aspect-ratio:1000/400;}
.chart svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;}
.chart .grid{display:none;}
.chart .curve{fill:none;stroke:var(--blue);stroke-width:2.6;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke;}
.chart .area{fill:rgba(98,131,255,.09);}
.chart .pen{fill:none;stroke:var(--red);stroke-width:2.6;stroke-linecap:round;vector-effect:non-scaling-stroke;}
.chart .tip{position:absolute;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--blue);}
.chart .years{position:relative;height:24px;margin-top:10px;font-size:var(--xs);color:var(--dim);font-variant-numeric:tabular-nums;}
.chart .years span{position:absolute;top:0;transform:translateX(-50%);}
.chart .mark{position:absolute;max-width:230px;font-style:italic;font-stretch:88%;font-weight:640;font-size:var(--s);line-height:1.3;color:var(--red);}
.chart .mark b{display:block;font-size:var(--m);font-weight:760;color:var(--red);}
.chips{display:grid;grid-template-columns:repeat(3,minmax(0,max-content));gap:8px clamp(24px,5vw,64px);margin-top:28px;}
.chip{font-size:var(--xs);line-height:1.35;color:var(--mut);font-variant-numeric:tabular-nums;}
.chip b{display:block;margin-bottom:2px;font-size:var(--m);}
.curve-card .note{margin-top:18px;}

/* film + dashboard */
.film{position:relative;border-radius:var(--r);overflow:hidden;background:#000;}
.film video{width:100%;height:auto;}
#vfilm-snd{position:absolute;right:14px;bottom:14px;border:0;background:var(--gold);color:#16110A;border-radius:var(--r);padding:9px 16px;font:700 var(--xs) var(--sans);cursor:pointer;}

/* strategies strip */
.strip{position:relative;background:var(--card);border-radius:var(--r);padding:clamp(16px,2.6vw,32px);}
.srow{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:24px;align-items:center;padding:10px 0;}
.srow .lab b{display:flex;align-items:center;gap:9px;font-size:var(--m);font-weight:760;font-stretch:84%;line-height:1.2;}
.srow .lab b i{flex:none;width:11px;height:11px;border-radius:50%;background:var(--c);}
.srow .lab span{display:block;margin-top:2px;font-size:var(--xs);font-weight:600;color:var(--dim);font-variant-numeric:tabular-nums;}
.cells{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:3px;height:30px;}
.cells i{display:block;background:var(--c);border-radius:2px;}
.cells i.z{background:rgba(255,255,255,.07);}
.srow.any{margin-top:14px;}
.srow.any .cells i{background:#fff;}
.srow.any .cells i.z{background:var(--red);}
.syears{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:24px;margin-bottom:4px;}
.syears div{position:relative;height:22px;font-size:var(--xs);color:var(--dim);}
.syears span{position:absolute;top:0;}
.playhead{position:absolute;top:clamp(16px,2.6vw,32px);bottom:clamp(16px,2.6vw,32px);width:2px;background:#fff;opacity:0;pointer-events:none;}

/* a list beside its picture: the strategies, how it trades, the risks */
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(32px,6vw,88px);align-items:center;}
.split.rev{grid-template-columns:minmax(0,5fr) minmax(0,6fr);}
.split.rev>.loop{order:-1;}
.loop video{width:100%;height:auto;aspect-ratio:1/1;border-radius:var(--r);background:var(--card);}
.loop figcaption{margin-top:12px;font-size:var(--xs);color:var(--dim);}
.named{list-style:none;}
.named li+li{margin-top:26px;}
.named h3{display:flex;align-items:center;gap:10px;}
.named h3 i{flex:none;width:11px;height:11px;border-radius:50%;background:var(--c);}
.named p{margin-top:6px;color:var(--mut);}
#strategies .split{margin-top:clamp(56px,8vw,112px);}

/* how it trades: four rules set two by two, no boxes */
.rules{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 36px;}
.rules p{margin-top:8px;color:var(--mut);}

/* risks: each figure on its own row, set large */
.risks{list-style:none;}
.risks h3{margin-top:10px;}
.risks li+li{margin-top:28px;}
.risks .fig{font-stretch:76%;font-weight:780;font-size:var(--l);line-height:1;color:var(--red);font-variant-numeric:tabular-nums;white-space:nowrap;}
.risks p{margin-top:4px;color:var(--mut);}
#risks .note{margin-top:28px;}

/* reports: table on wide screens, cards on phones (a real table keeps its row lines) */
.tablewrap{background:var(--card);border-radius:var(--r);padding:6px clamp(14px,2.4vw,28px);}
.tbl{width:100%;border-collapse:collapse;font-size:var(--s);font-variant-numeric:tabular-nums;}
.tbl th{text-align:left;font-weight:600;color:var(--dim);font-size:var(--xs);padding:16px 14px 12px 0;border-bottom:1px solid var(--line2);}
.tbl td{padding:16px 14px 16px 0;border-bottom:1px solid var(--line);vertical-align:middle;}
.tbl tr:last-child td{border-bottom:0;}
.tbl td.r,.tbl th.r{text-align:right;}
.tbl .feed{font-weight:700;color:#fff;}
.tbl .big{font-size:var(--m);font-weight:780;font-stretch:80%;color:#fff;}
.tbl .sub{display:block;font-size:var(--xs);color:var(--dim);font-weight:450;}

/* tested brokers */
.brokers{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.broker{background:var(--card);border-radius:var(--r);padding:clamp(20px,3vw,36px);}
.broker.best{background:var(--card2);}
.broker header{display:flex;align-items:center;gap:14px;}
.bicon{flex:none;width:52px;height:52px;border-radius:var(--r);background:#fff;display:flex;align-items:center;justify-content:center;}
.bicon img{width:32px;height:32px;}
.broker h3{font-stretch:84%;}
.bres{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:24px 0 16px;font-variant-numeric:tabular-nums;}
.bres b{display:block;font-size:var(--l);font-weight:780;font-stretch:76%;line-height:1;}
.bres span{font-size:var(--xs);color:var(--dim);}
.broker .note+.note{margin-top:6px;}

/* demo + price */
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:stretch;}
.panel{background:var(--card);border-radius:var(--r);padding:clamp(22px,3vw,40px);}
.panel.gold{background:var(--card2);}
.panel p{color:var(--mut);}
.price{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-top:16px;}
.price .now{font-size:var(--xl);font-weight:780;font-stretch:76%;line-height:.95;color:#fff;}
.price .was{font-size:var(--m);color:var(--dim);text-decoration:line-through;}
.specs{margin-top:24px;font-size:var(--s);font-variant-numeric:tabular-nums;}
.specs div{display:flex;justify-content:space-between;gap:16px;padding:9px 14px;border-radius:var(--r);}
.specs div:nth-child(odd){background:var(--card3);}
.specs span{color:var(--mut);}
.specs b{text-align:right;}
.status-pill{display:inline-block;font-size:var(--xs);font-weight:700;padding:5px 11px;border-radius:var(--r);background:rgba(232,177,67,.16);color:var(--gold)!important;}
.keep{margin-top:40px;}
.keep .hidden-hp{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;}
.keep-row{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap;}
.keep-row input{flex:1;min-width:200px;min-height:52px;background:var(--bg);border:1px solid var(--line2);border-radius:var(--r);padding:12px 14px;color:#fff;font-family:var(--sans);font-size:var(--s);}
.keep-row input::placeholder{color:var(--dim);}
.keep-row input:focus{outline:3px solid var(--gold);outline-offset:1px;}

/* faq: the heading holds the left of the grid, the answers the right; each question sits on its own tone */
.faq-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,5vw,72px);align-items:start;}
.faq-grid .head{margin-bottom:0;}
.faq{max-width:860px;}
.faq details{background:var(--card);border-radius:var(--r);padding:0 clamp(16px,2vw,24px);}
.faq details+details{margin-top:8px;}
.faq summary{list-style:none;cursor:pointer;padding:18px 0;display:flex;align-items:baseline;justify-content:space-between;gap:20px;font-stretch:90%;font-weight:680;font-size:var(--m);line-height:1.3;color:#fff;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";font-weight:500;font-size:var(--m);line-height:1;color:var(--gold);flex:none;transition:transform .2s;}
.faq summary:hover::after{transform:scale(1.25);}
.faq details[open] summary::after{transform:rotate(45deg);}
.faq .ans{padding:0 0 22px;color:var(--mut);font-size:var(--s);max-width:66ch;}

/* contact + footer */
.contact{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px;background:var(--card);border-radius:var(--r);padding:clamp(24px,4vw,48px);}
.contact h2{max-width:18ch;}
.contact p{color:var(--mut);margin-top:10px;}
.aff{margin-top:clamp(32px,5vw,56px);}
.aff img{width:100%;max-width:728px;height:auto;border-radius:var(--r);}
footer{background:var(--bg2);padding:48px 0 52px;margin-top:clamp(56px,8vw,104px);color:var(--dim);}
.foot{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center;}
.fnav{display:flex;gap:10px 22px;flex-wrap:wrap;font-size:var(--xs);}
.fnav a{color:var(--mut);text-decoration:none;}
.fnav a:hover{color:#fff;}
.disc{margin-top:22px;font-size:var(--xs);line-height:1.55;color:var(--dim);max-width:60ch;}
.fbot{margin-top:10px;font-size:var(--xs);color:var(--dim);}

/* text pages: terms, privacy, cookies, status, thanks, free */
.doc{padding-top:clamp(40px,6vw,80px);}
main.wrap.doc{max-width:920px;}
.doc>*{max-width:none;}
.doc h1{font-size:var(--xl);}
.doc h2{font-size:clamp(24px,3vw,30px);margin-top:44px;}
.doc h3{margin-top:26px;}
.doc p,.doc li{color:#C9D0DB;font-size:var(--s);max-width:66ch;}
.doc p{margin-top:14px;}
.doc .lead{font-size:var(--m);}
.doc ul,.doc ol{margin:12px 0 0 22px;}
.doc li{margin-top:6px;}
.doc .items,.doc .steps{margin-left:0;}
.doc .meta{font-size:var(--xs);color:var(--dim);margin-top:12px;}
.doc table{width:100%;border-collapse:collapse;margin-top:16px;font-size:var(--xs);}
.doc th,.doc td{text-align:left;padding:10px 12px 10px 0;border-bottom:1px solid var(--line);vertical-align:top;color:var(--mut);}
.doc th{border-bottom:1px solid var(--line2);color:var(--dim);font-weight:600;}

@media (max-width:900px){
  .nlinks{display:none;}
  .burger{display:flex;}
  #mobnav{display:block;position:fixed;inset:0;z-index:60;background:var(--bg);padding:calc(var(--navh) + 56px) 16px 24px;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s;overflow-y:auto;}
  #mobnav.open{opacity:1;visibility:visible;}
  #mobnav ul{list-style:none;}
  #mobnav a{display:block;padding:14px 4px;font-size:var(--l);font-weight:700;font-stretch:84%;line-height:1.1;color:#fff;text-decoration:none;}
  .navin{position:relative;z-index:61;}
  .hero-grid,.two,.brokers,.split,.split.rev,.faq-grid{grid-template-columns:1fr;}
  .split.rev>.loop{order:0;}
  .device{justify-self:start;max-width:300px;}
  #vfilm-snd{display:none;}
}
@media (max-width:640px){
  .section{padding:72px 0;}
  .hero{padding:28px 0 64px;}
  .hero .btns .btn{width:100%;}
  .btns .btn{width:100%;}
  .navin .btn-sm{min-height:38px;padding:7px 13px;}
  .counters{width:100%;justify-content:flex-start;}
  .counters div{text-align:left;}
  .chart .plot{aspect-ratio:auto;height:250px;}
  .chart .mark{position:static;max-width:none;margin-top:14px;}
  .chart .mark b{display:inline;margin-right:6px;}
  .srow,.syears{grid-template-columns:1fr;gap:8px;}
  .syears>div:first-child{display:none;}
  .cells{gap:1px;height:28px;}
  .chart .years span:first-child{display:none;}
  .chips{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 12px;}
  .rules{grid-template-columns:1fr;gap:24px;}
  .tablewrap{background:none;padding:0;}
  .tbl thead{display:none;}
  .tbl,.tbl tbody{display:block;}
  .tbl tr{display:grid;grid-template-columns:1fr auto;gap:2px 16px;align-items:center;background:var(--card);border-radius:var(--r);padding:16px 18px;margin-bottom:10px;}
  .tbl td{display:block;padding:0;border:0!important;text-align:left!important;}
  .tbl td.feed{grid-column:1;}
  .tbl td.big{grid-column:2;grid-row:1 / span 2;text-align:right!important;}
  .tbl td.dd{grid-column:1;font-size:var(--xs);color:var(--mut);}
  .tbl td.dd::before{content:"Worst drop ";color:var(--dim);}
  .tbl td.go{grid-column:1 / -1;margin-top:8px;font-weight:700;}
  .tbl .hide-m{display:none!important;}
}
/* inner pages: each block rises in once on load (CSS only, so nothing stays hidden without script) */
@keyframes rise{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:none;}}
main.wrap>*:not(section),main.wrap>section>*{animation:rise .7s cubic-bezier(.2,.7,.2,1) backwards;}
main.wrap>*:nth-child(2),main.wrap>section>*:nth-child(2){animation-delay:.07s;}
main.wrap>*:nth-child(3),main.wrap>section>*:nth-child(3){animation-delay:.14s;}
main.wrap>*:nth-child(4),main.wrap>section>*:nth-child(4){animation-delay:.21s;}
main.wrap>*:nth-child(n+5),main.wrap>section>*:nth-child(n+5){animation-delay:.28s;}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important;}}
