/* TelegramMT4 complete-site design system
   Extends the approved homepage and How It Works visual language. */

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  color: var(--color-text);
  background:
    radial-gradient(circle at 18% -10%, rgba(46, 167, 255, .16), transparent 34rem),
    radial-gradient(circle at 88% 4%, rgba(65, 211, 158, .08), transparent 30rem),
    var(--color-bg);
  font-family: var(--font-sans);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.nav-open { overflow: hidden; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
::selection { color: #04101c; background: var(--color-cyan); }

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.skip-link {
  position: fixed;
  z-index: 9999;
  left: 1rem;
  top: 1rem;
  padding: .75rem 1rem;
  border-radius: .75rem;
  background: var(--color-white);
  color: var(--color-bg-deep);
  transform: translateY(-160%);
  transition: transform var(--transition);
}
.skip-link:focus { transform: translateY(0); }

.container { width: min(calc(100% - 2rem), var(--container)); margin-inline: auto; }
.narrow-container { width: min(calc(100% - 2rem), 860px); margin-inline: auto; }
.section { position: relative; padding: clamp(4.5rem, 8vw, 7.5rem) 0; }
.section--tight { padding-block: clamp(3.5rem, 6vw, 5rem); }
.section--surface {
  border-block: 1px solid var(--color-line);
  background: linear-gradient(180deg, rgba(15, 32, 53, .58), rgba(7, 17, 31, .38));
}
.section--deep { background: rgba(4, 10, 19, .5); }
.section--glow::before {
  content: "";
  position: absolute;
  width: 35rem;
  height: 35rem;
  left: 50%;
  top: 10%;
  border-radius: 50%;
  pointer-events: none;
  background: rgba(46, 167, 255, .08);
  filter: blur(100px);
  transform: translateX(-50%);
}

/* Header and navigation */
.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 1200;
  height: var(--header-height);
  border-bottom: 1px solid transparent;
  transition: background .24s ease, border-color .24s ease, box-shadow .24s ease;
}
.site-header.is-scrolled,
.site-header:focus-within,
body.nav-open .site-header {
  background: rgba(4, 10, 19, .87);
  border-color: var(--color-line);
  box-shadow: 0 18px 55px rgba(0, 0, 0, .2);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}
.nav-shell { display: flex; align-items: center; gap: 1.25rem; min-height: var(--header-height); }
.brand { display: inline-flex; flex: 0 0 auto; align-items: center; width: clamp(178px, 16vw, 226px); }
.brand img { width: 100%; height: auto; }
.primary-nav { display: flex; align-items: center; justify-content: center; gap: .2rem; margin-left: auto; }
.primary-nav > a,
.nav-group > button {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 44px;
  padding: .65rem .78rem;
  border: 0;
  border-radius: .75rem;
  background: transparent;
  color: var(--color-text-soft);
  font-weight: 650;
  font-size: .91rem;
  cursor: pointer;
  transition: color var(--transition), background var(--transition);
}
.primary-nav > a:hover,
.primary-nav > a:focus-visible,
.nav-group > button:hover,
.nav-group > button:focus-visible,
.primary-nav > a[aria-current="page"],
.nav-group.is-open > button {
  color: var(--color-white);
  background: rgba(148, 169, 194, .09);
}
.nav-caret { width: .55rem; height: .55rem; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform var(--transition); }
.nav-group.is-open .nav-caret { transform: rotate(225deg) translate(-1px, -1px); }
.nav-group { position: relative; }
.mega-panel {
  position: absolute;
  top: calc(100% + .75rem);
  left: 50%;
  width: min(720px, calc(100vw - 2rem));
  padding: .75rem;
  border: 1px solid var(--color-line-strong);
  border-radius: 1.2rem;
  background: rgba(8, 20, 35, .98);
  box-shadow: var(--shadow-lg);
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, .6rem) scale(.98);
  transform-origin: 50% 0;
  transition: opacity var(--transition), transform var(--transition), visibility var(--transition);
}
.nav-group.is-open .mega-panel { opacity: 1; visibility: visible; transform: translate(-50%, 0) scale(1); }
.mega-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.mega-link {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: .8rem;
  align-items: start;
  padding: .85rem;
  border-radius: .95rem;
  border: 1px solid transparent;
  transition: background var(--transition), border-color var(--transition), transform var(--transition);
}
.mega-link:hover, .mega-link:focus-visible { background: rgba(46, 167, 255, .07); border-color: rgba(102, 227, 255, .15); transform: translateY(-1px); }
.mega-link img { width: 38px; height: 38px; padding: .45rem; border-radius: .75rem; background: rgba(46, 167, 255, .1); }
.mega-link strong { display: block; margin-bottom: .12rem; font-size: .94rem; }
.mega-link small { display: block; color: var(--color-muted); font-size: .78rem; line-height: 1.4; }
.nav-actions { display: flex; align-items: center; gap: .7rem; flex: 0 0 auto; }
.nav-login { color: var(--color-text-soft); font-weight: 700; font-size: .91rem; }
.nav-login:hover, .nav-login:focus-visible { color: var(--color-white); }
.nav-toggle { display: none; width: 44px; height: 44px; padding: 0; border: 1px solid var(--color-line-strong); border-radius: .8rem; background: rgba(15, 32, 53, .7); cursor: pointer; }
.nav-toggle span:not(.sr-only) { display: block; width: 19px; height: 1.5px; margin: 4px auto; background: var(--color-text); transition: transform var(--transition), opacity var(--transition); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { transform: translateY(5.5px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(4) { transform: translateY(-5.5px) rotate(-45deg); }

/* Buttons */
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  min-height: 46px;
  padding: .8rem 1.15rem;
  border: 1px solid transparent;
  border-radius: .85rem;
  font-weight: 780;
  font-size: .93rem;
  line-height: 1;
  cursor: pointer;
  transition: transform var(--transition), box-shadow var(--transition), background var(--transition), border-color var(--transition), color var(--transition);
}
.button:hover { transform: translateY(-2px); }
.button:active { transform: translateY(0); }
.button:focus-visible, a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(102, 227, 255, .28); outline-offset: 3px; }
.button--primary { color: #03111e; background: var(--gradient-brand); box-shadow: var(--shadow-brand); }
.button--primary:hover { box-shadow: 0 20px 60px rgba(46, 167, 255, .34); }
.button--ghost { color: var(--color-text); border-color: var(--color-line-strong); background: rgba(15, 32, 53, .55); }
.button--ghost:hover { border-color: rgba(102, 227, 255, .38); background: rgba(20, 41, 67, .75); }
.button--soft { color: var(--color-cyan); border-color: rgba(102, 227, 255, .18); background: rgba(46, 167, 255, .08); }
.button--danger { color: #ffe4df; border-color: rgba(255, 116, 88, .3); background: rgba(255, 116, 88, .1); }
.button--small { min-height: 40px; padding: .68rem .95rem; border-radius: .75rem; font-size: .86rem; }
.button--large { min-height: 54px; padding: 1rem 1.35rem; font-size: .98rem; }
.button svg { width: 1.05rem; height: 1.05rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* Page hero — match homepage hero eyebrow/title position */
.page-hero {
  position: relative;
  isolation: isolate;
  min-height: 900px;
  overflow: hidden;
  padding: calc(var(--header-height) + 80px) 0 54px;
}
.page-hero--compact { min-height: auto; padding-bottom: clamp(4rem, 7vw, 6rem); }
.hero-atmosphere { position: absolute; inset: 0; z-index: -2; overflow: hidden; pointer-events: none; }
.hero-atmosphere::before {
  content: "";
  position: absolute;
  inset: -20%;
  opacity: .42;
  background-image:
    linear-gradient(rgba(148, 169, 194, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148, 169, 194, .07) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: linear-gradient(to bottom, black 10%, transparent 85%);
  transform: perspective(700px) rotateX(60deg) translateY(-10%);
  transform-origin: 50% 0;
}
.hero-atmosphere::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 18% 36%, rgba(46, 167, 255, .2), transparent 27rem),
    radial-gradient(circle at 82% 25%, rgba(65, 211, 158, .12), transparent 24rem),
    linear-gradient(to bottom, transparent 65%, var(--color-bg));
}
.hero-orb { position: absolute; border-radius: 50%; filter: blur(15px); opacity: .65; }
.hero-orb--a { width: 20rem; height: 20rem; right: 5%; top: 12%; background: rgba(46, 167, 255, .12); }
.hero-orb--b { width: 14rem; height: 14rem; left: 10%; bottom: 8%; background: rgba(159, 140, 255, .1); }
.hero-streams { position: absolute; inset: 0; overflow: hidden; opacity: .55; }
.hero-streams span { position: absolute; width: 1px; height: 120px; background: linear-gradient(transparent, rgba(102, 227, 255, .75), transparent); transform: rotate(35deg); }
.hero-streams span:nth-child(1) { left: 12%; top: 15%; }
.hero-streams span:nth-child(2) { left: 38%; top: 5%; height: 180px; }
.hero-streams span:nth-child(3) { right: 28%; top: 9%; height: 140px; }
.hero-streams span:nth-child(4) { right: 8%; top: 35%; height: 190px; }
.hero-layout { display: grid; grid-template-columns: minmax(0, .95fr) minmax(520px, 1.05fr); align-items: center; gap: clamp(2.5rem, 5vw, 5rem); }
.hero-copy { max-width: 660px; }
.page-eyebrow,
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: 1.1rem;
  padding: .5rem .75rem;
  border: 1px solid rgba(102, 227, 255, .18);
  border-radius: var(--radius-pill);
  color: var(--color-cyan);
  background: rgba(46, 167, 255, .07);
  font-size: .78rem;
  font-weight: 780;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.page-eyebrow img { width: 1rem; height: 1rem; }
.live-dot { width: .55rem; height: .55rem; border-radius: 50%; background: var(--color-success); box-shadow: 0 0 0 5px rgba(65, 211, 158, .1); }
.hero-copy h1 {
  max-width: 670px;
  margin: 0;
  font-size: clamp(2.9rem, 4.5vw, 4.6rem);
  font-weight: 790;
  line-height: .98;
  letter-spacing: -.06em;
  text-wrap: balance;
}
.hero-copy h1 span { color: transparent; background: var(--gradient-brand); -webkit-background-clip: text; background-clip: text; }
.hero-lede { max-width: 62ch; margin: 1.45rem 0 0; color: var(--color-text-soft); font-size: clamp(1rem, 1.5vw, 1.16rem); line-height: 1.75; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: 1.8rem; }
.hero-assurances { display: flex; flex-wrap: wrap; gap: .6rem 1.1rem; margin: 1.4rem 0 0; padding: 0; list-style: none; color: var(--color-muted); font-size: .83rem; }
.hero-assurances li { display: inline-flex; align-items: center; gap: .42rem; }
.hero-assurances span { display: grid; place-items: center; width: 1.1rem; height: 1.1rem; border-radius: 50%; color: var(--color-success); background: rgba(65, 211, 158, .1); font-size: .7rem; }
.hero-note { margin-top: 1rem; color: var(--color-muted-2); font-size: .78rem; }

/* Shared hero visual shell */
.hero-visual { position: relative; min-width: 0; }
.visual-window {
  position: relative;
  overflow: hidden;
  min-height: 500px;
  border: 1px solid rgba(148, 169, 194, .22);
  border-radius: 1.65rem;
  background: linear-gradient(145deg, rgba(18, 38, 62, .94), rgba(7, 19, 33, .96));
  box-shadow: 0 40px 120px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255, 255, 255, .04);
}
.visual-window::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(120deg, rgba(102, 227, 255, .08), transparent 25%, transparent 70%, rgba(65, 211, 158, .05));
}
.visual-window-bar { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; min-height: 54px; padding: 0 1rem; border-bottom: 1px solid var(--color-line); background: rgba(4, 10, 19, .36); }
.window-title { display: flex; align-items: center; gap: .7rem; color: var(--color-text-soft); font-size: .8rem; font-weight: 720; }
.window-dots { display: inline-flex; gap: .3rem; }
.window-dots i { width: .52rem; height: .52rem; border-radius: 50%; background: rgba(148, 169, 194, .32); }
.window-dots i:first-child { background: rgba(255, 116, 88, .7); }
.window-dots i:nth-child(2) { background: rgba(245, 199, 107, .7); }
.window-dots i:nth-child(3) { background: rgba(65, 211, 158, .7); }
.motion-toggle { display: inline-flex; align-items: center; gap: .45rem; min-height: 34px; padding: .45rem .65rem; border: 1px solid var(--color-line); border-radius: .65rem; background: rgba(15, 32, 53, .55); color: var(--color-muted); font-size: .72rem; font-weight: 700; cursor: pointer; }
.motion-icon { position: relative; width: .7rem; height: .7rem; }
.motion-icon::before, .motion-icon::after { content: ""; position: absolute; top: 0; width: 2px; height: .7rem; border-radius: 2px; background: currentColor; }
.motion-icon::before { left: .1rem; } .motion-icon::after { right: .1rem; }
[data-motion-paused="true"] .motion-icon::before { width: 0; height: 0; left: .15rem; border-top: .35rem solid transparent; border-bottom: .35rem solid transparent; border-left: .55rem solid currentColor; background: transparent; }
[data-motion-paused="true"] .motion-icon::after { display: none; }
.visual-scene { position: relative; z-index: 1; min-height: 446px; padding: 1.15rem; }
.visual-statusbar { display: flex; justify-content: space-between; gap: 1rem; padding: .75rem 1rem; border-top: 1px solid var(--color-line); color: var(--color-muted); font-size: .72rem; }
.status-live { display: inline-flex; align-items: center; gap: .42rem; color: var(--color-success); }
.status-live::before { content: ""; width: .45rem; height: .45rem; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px rgba(65, 211, 158, .08); }

/* Visual primitives */
.ui-card { border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(7, 17, 31, .72); box-shadow: var(--shadow-sm); }
.ui-card__head { display: flex; align-items: center; gap: .7rem; padding: .8rem .9rem; border-bottom: 1px solid var(--color-line); }
.ui-card__head img { width: 34px; height: 34px; padding: .38rem; border-radius: .65rem; background: rgba(46, 167, 255, .1); }
.ui-card__head strong { display: block; font-size: .82rem; }
.ui-card__head small { display: block; color: var(--color-muted); font-size: .65rem; }
.ui-badge { margin-left: auto; padding: .24rem .45rem; border-radius: var(--radius-pill); color: var(--color-cyan); background: rgba(46, 167, 255, .09); font-size: .62rem; font-weight: 780; }
.ui-badge--green { color: var(--color-success); background: rgba(65, 211, 158, .1); }
.ui-badge--amber { color: var(--color-warning); background: rgba(245, 199, 107, .1); }
.ui-row { display: flex; align-items: center; gap: .65rem; padding: .65rem .8rem; border-top: 1px solid rgba(148, 169, 194, .1); color: var(--color-text-soft); font-size: .75rem; }
.ui-row:first-child { border-top: 0; }
.ui-row strong { margin-left: auto; color: var(--color-text); font-family: var(--font-mono); font-size: .7rem; }
.ui-check { display: grid; place-items: center; width: 1.25rem; height: 1.25rem; border-radius: 50%; color: var(--color-success); background: rgba(65, 211, 158, .12); font-size: .72rem; font-weight: 900; }
.ui-icon { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: .7rem; background: rgba(46, 167, 255, .09); }
.ui-icon img { width: 1.35rem; height: 1.35rem; }
.metric { padding: .8rem; border: 1px solid var(--color-line); border-radius: .9rem; background: rgba(7, 17, 31, .66); }
.metric small { display: block; color: var(--color-muted); font-size: .65rem; }
.metric strong { display: block; margin-top: .25rem; font-size: 1.08rem; }
.metric em { color: var(--color-success); font-style: normal; font-size: .68rem; }

/* Hero visual variants */
.mini-flow { display: grid; grid-template-columns: 1fr 50px 1fr 50px 1fr; align-items: center; min-height: 390px; gap: .25rem; }
.mini-node { min-width: 0; overflow: hidden; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(7, 17, 31, .75); }
.mini-node__label { display: flex; align-items: center; gap: .55rem; padding: .75rem; border-bottom: 1px solid var(--color-line); }
.mini-node__label img { width: 30px; height: 30px; }
.mini-node__label span { min-width: 0; }
.mini-node__label strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .76rem; }
.mini-node__label small { display: block; color: var(--color-muted); font-size: .6rem; }
.mini-node__body { padding: .7rem; }
.signal-bubble { padding: .72rem; border-radius: .8rem .8rem .2rem .8rem; background: rgba(46, 167, 255, .1); color: var(--color-text-soft); font-family: var(--font-mono); font-size: .64rem; line-height: 1.65; }
.signal-bubble b { color: var(--color-success); }
.parser-lines { display: grid; gap: .42rem; }
.parser-lines span { display: flex; justify-content: space-between; padding: .42rem .5rem; border-radius: .5rem; background: rgba(148, 169, 194, .06); color: var(--color-muted); font-size: .6rem; }
.parser-lines strong { color: var(--color-text); font-family: var(--font-mono); }
.account-mini { display: grid; gap: .45rem; }
.account-mini div { display: grid; grid-template-columns: 1.5rem 1fr auto; align-items: center; gap: .45rem; padding: .5rem; border: 1px solid rgba(148, 169, 194, .1); border-radius: .65rem; font-size: .6rem; }
.account-mini img { width: 1.35rem; height: 1.35rem; }
.account-mini small { display: block; color: var(--color-muted); }
.mini-route { position: relative; height: 2px; background: linear-gradient(90deg, rgba(46, 167, 255, .2), rgba(102, 227, 255, .65), rgba(46, 167, 255, .2)); }
.mini-route i { position: absolute; top: 50%; width: .55rem; height: .55rem; border: 2px solid var(--color-cyan); border-radius: 50%; background: var(--color-bg); transform: translate(-50%, -50%); box-shadow: 0 0 18px rgba(102, 227, 255, .45); }

.bundle-scene { display: grid; grid-template-columns: 1fr .8fr; gap: .8rem; align-items: stretch; min-height: 405px; }
.bundle-left { display: grid; grid-template-rows: 1fr 1fr; gap: .8rem; }
.bundle-card { padding: .9rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(7, 17, 31, .72); }
.bundle-card__top { display: flex; align-items: center; gap: .65rem; margin-bottom: .7rem; }
.bundle-card__top img { width: 34px; height: 34px; }
.bundle-card__top strong { font-size: .78rem; }
.bundle-card__top small { display: block; color: var(--color-muted); font-size: .62rem; }
.bundle-pipeline { position: relative; display: grid; place-items: center; padding: .75rem; border: 1px solid rgba(102, 227, 255, .16); border-radius: 1rem; background: radial-gradient(circle at center, rgba(46, 167, 255, .1), rgba(7, 17, 31, .72)); }
.bundle-pipeline::before { content: ""; position: absolute; inset: 12% 50%; width: 1px; background: linear-gradient(transparent, var(--color-cyan), transparent); }
.bundle-account { width: 100%; padding: .85rem; border: 1px solid var(--color-line); border-radius: .85rem; background: rgba(15, 32, 53, .85); }
.bundle-account + .bundle-account { margin-top: 2rem; }
.bundle-account strong { display: flex; align-items: center; justify-content: space-between; font-size: .72rem; }
.bundle-account small { display: block; margin-top: .25rem; color: var(--color-muted); font-size: .6rem; }

.trial-scene { display: grid; align-content: center; gap: 1rem; min-height: 400px; }
.trial-calendar { display: grid; grid-template-columns: repeat(7, 1fr); gap: .45rem; }
.trial-day { position: relative; display: grid; place-items: center; min-height: 70px; padding: .5rem; border: 1px solid var(--color-line); border-radius: .8rem; background: rgba(7, 17, 31, .7); text-align: center; }
.trial-day b { font-size: .8rem; }
.trial-day small { color: var(--color-muted); font-size: .55rem; }
.trial-day i { position: absolute; right: .35rem; top: .35rem; width: .45rem; height: .45rem; border-radius: 50%; background: rgba(148, 169, 194, .25); }
.trial-day.is-current { border-color: rgba(102, 227, 255, .4); background: rgba(46, 167, 255, .08); }
.trial-day.is-current i { background: var(--color-cyan); box-shadow: 0 0 12px rgba(102, 227, 255, .5); }
.trial-checks { display: grid; grid-template-columns: repeat(2, 1fr); gap: .55rem; }
.trial-checks div { display: flex; align-items: center; gap: .55rem; padding: .7rem; border: 1px solid var(--color-line); border-radius: .75rem; background: rgba(7, 17, 31, .6); color: var(--color-text-soft); font-size: .66rem; }

.pricing-scene { display: grid; align-content: center; min-height: 405px; }
.visual-plan-stack { display: grid; grid-template-columns: repeat(3, 1fr); align-items: end; gap: .55rem; }
.visual-plan { position: relative; padding: .9rem .75rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(7, 17, 31, .72); }
.visual-plan:nth-child(2) { min-height: 250px; border-color: rgba(102, 227, 255, .35); background: linear-gradient(180deg, rgba(46, 167, 255, .13), rgba(7, 17, 31, .78)); box-shadow: 0 20px 50px rgba(46, 167, 255, .12); }
.visual-plan small { color: var(--color-muted); font-size: .58rem; }
.visual-plan strong { display: block; margin: .35rem 0 .65rem; font-size: 1.25rem; }
.visual-plan ul { display: grid; gap: .4rem; margin: 0; padding: 0; list-style: none; color: var(--color-text-soft); font-size: .58rem; }
.visual-plan li::before { content: "✓"; margin-right: .35rem; color: var(--color-success); }

.signal-scene { display: grid; grid-template-columns: 1.15fr .85fr; gap: .8rem; align-content: center; min-height: 405px; }
.signal-card-large { padding: .9rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(7, 17, 31, .72); }
.signal-channel { display: flex; align-items: center; gap: .6rem; padding-bottom: .7rem; border-bottom: 1px solid var(--color-line); }
.signal-avatar { display: grid; place-items: center; width: 2.3rem; height: 2.3rem; border-radius: .75rem; background: var(--gradient-brand); color: #04101c; font-weight: 900; font-size: .75rem; }
.signal-channel strong { font-size: .76rem; }
.signal-channel small { display: block; color: var(--color-muted); font-size: .6rem; }
.signal-order { margin-top: .75rem; padding: .8rem; border-radius: .75rem .75rem .18rem .75rem; background: rgba(46, 167, 255, .1); font-family: var(--font-mono); font-size: .64rem; line-height: 1.75; }
.signal-order b { color: var(--color-success); }
.risk-stack { display: grid; gap: .6rem; }
.risk-gauge { display: grid; place-items: center; aspect-ratio: 1; border: 1px solid var(--color-line); border-radius: 50%; background: conic-gradient(var(--color-success) 0 32%, rgba(148, 169, 194, .1) 32% 100%); }
.risk-gauge::before { content: "1%\A risk"; white-space: pre; display: grid; place-items: center; width: 76%; aspect-ratio: 1; border-radius: 50%; background: var(--color-surface); text-align: center; font-size: .65rem; font-weight: 800; line-height: 1.3; }

.ea-scene { display: grid; grid-template-columns: 1.1fr .9fr; align-items: stretch; gap: .8rem; min-height: 405px; }
.terminal-card { padding: .8rem; border: 1px solid var(--color-line); border-radius: 1rem; background: #06101c; font-family: var(--font-mono); font-size: .61rem; }
.terminal-card .code-line { display: block; margin-bottom: .55rem; color: var(--color-muted); }
.terminal-card .code-line b { color: var(--color-cyan); font-weight: 600; }
.terminal-card .code-line em { color: var(--color-success); font-style: normal; }
.ea-chip { display: grid; place-items: center; gap: .7rem; padding: 1rem; border: 1px solid rgba(102, 227, 255, .2); border-radius: 1rem; background: radial-gradient(circle at 50% 30%, rgba(46, 167, 255, .15), rgba(7, 17, 31, .7)); text-align: center; }
.ea-chip img { width: 72px; height: 72px; padding: 1rem; border-radius: 1.2rem; background: rgba(46, 167, 255, .1); }
.ea-chip strong { font-size: .82rem; }
.ea-chip small { color: var(--color-muted); font-size: .62rem; }

.affiliate-scene { display: grid; align-content: center; gap: .75rem; min-height: 405px; }
.referral-link { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .7rem; padding: .85rem; border: 1px solid rgba(102, 227, 255, .2); border-radius: .9rem; background: rgba(46, 167, 255, .06); font-family: var(--font-mono); font-size: .63rem; }
.referral-link button { border: 0; border-radius: .55rem; padding: .45rem .6rem; background: var(--gradient-brand); color: #04101c; font-size: .58rem; font-weight: 800; }
.commission-list { display: grid; gap: .55rem; }
.commission-row { display: grid; grid-template-columns: 2rem 1fr auto; align-items: center; gap: .65rem; padding: .7rem; border: 1px solid var(--color-line); border-radius: .8rem; background: rgba(7, 17, 31, .67); }
.commission-row img { width: 1.65rem; height: 1.65rem; }
.commission-row strong { font-size: .7rem; }
.commission-row small { display: block; color: var(--color-muted); font-size: .58rem; }
.commission-row b { color: var(--color-success); font-family: var(--font-mono); font-size: .68rem; }

.results-scene { display: grid; grid-template-rows: auto 1fr; gap: .75rem; min-height: 405px; }
.myfxbook-chart-frame {
  display: block;
  overflow: hidden;
  min-height: 235px;
  border: 1px solid var(--color-line);
  border-radius: 1rem;
  background: rgba(7,17,31,.72);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.myfxbook-chart-frame:hover,
.myfxbook-chart-frame:focus-visible {
  border-color: rgba(102,227,255,.35);
  box-shadow: 0 0 0 1px rgba(102,227,255,.12);
  outline: none;
}
.myfxbook-chart-frame img {
  display: block;
  width: 100%;
  height: auto;
  min-height: 220px;
  object-fit: cover;
  object-position: left center;
  background: #111b2e;
}
.myfxbook-chart-frame--dashboard {
  margin: 0 0 1rem;
  min-height: 0;
}
.dashboard-bar a {
  color: var(--color-cyan);
  font-weight: 700;
  text-decoration: none;
}
.dashboard-bar a:hover { text-decoration: underline; }
.metric-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .55rem; }
.chart-panel { position: relative; overflow: hidden; min-height: 260px; padding: .8rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(7, 17, 31, .72); }
.chart-grid { position: absolute; inset: .8rem; opacity: .35; background-image: linear-gradient(rgba(148,169,194,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(148,169,194,.12) 1px, transparent 1px); background-size: 25% 25%; }
.chart-panel svg { position: absolute; inset: .8rem; width: calc(100% - 1.6rem); height: calc(100% - 1.6rem); overflow: visible; }
.chart-panel path { fill: none; stroke: var(--color-cyan); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 6px rgba(102, 227, 255, .35)); }
.chart-panel .area { fill: url(#chart-gradient); stroke: none; opacity: .5; }

.reviews-scene { position: relative; display: grid; place-items: center; min-height: 405px; }
.review-orbit { position: relative; width: min(100%, 430px); aspect-ratio: 1.2; }
.review-orbit::before { content: ""; position: absolute; inset: 16%; border: 1px dashed rgba(102, 227, 255, .24); border-radius: 50%; }
.review-focal { position: absolute; inset: 26% 24%; display: grid; place-items: center; padding: 1rem; border: 1px solid rgba(102, 227, 255, .25); border-radius: 1.1rem; background: rgba(15, 32, 53, .92); text-align: center; box-shadow: var(--shadow-md); }
.review-focal strong { font-size: 1.9rem; color: var(--color-warning); }
.review-focal small { color: var(--color-muted); font-size: .65rem; }
.orbit-card { position: absolute; width: 135px; padding: .65rem; border: 1px solid var(--color-line); border-radius: .8rem; background: rgba(7, 17, 31, .88); font-size: .58rem; line-height: 1.45; }
.orbit-card::before { content: "★★★★★"; display: block; margin-bottom: .25rem; color: var(--color-warning); letter-spacing: .08em; }
.orbit-card:nth-child(2) { left: 0; top: 8%; }
.orbit-card:nth-child(3) { right: 0; top: 13%; }
.orbit-card:nth-child(4) { left: 6%; bottom: 0; }
.orbit-card:nth-child(5) { right: 4%; bottom: 3%; }

.security-scene { display: grid; grid-template-columns: .85fr 1.3fr .85fr; align-items: center; gap: .65rem; min-height: 405px; }
.security-endpoint { padding: .8rem; border: 1px solid var(--color-line); border-radius: .9rem; background: rgba(7,17,31,.72); text-align: center; }
.security-endpoint img { width: 44px; height: 44px; margin: 0 auto .55rem; padding: .55rem; border-radius: .8rem; background: rgba(46,167,255,.1); }
.security-endpoint strong { display: block; font-size: .72rem; }
.security-endpoint small { color: var(--color-muted); font-size: .58rem; }
.trust-boundary { position: relative; padding: .75rem; border: 1px dashed rgba(102, 227, 255, .36); border-radius: 1rem; background: rgba(46, 167, 255, .04); }
.trust-boundary::before { content: "Authorized automation boundary"; position: absolute; left: .75rem; top: -.65rem; padding: .15rem .4rem; border-radius: .4rem; background: var(--color-surface); color: var(--color-cyan); font-size: .54rem; font-weight: 750; }
.boundary-list { display: grid; gap: .45rem; margin-top: .45rem; }
.boundary-list div { display: flex; align-items: center; gap: .45rem; padding: .55rem; border-radius: .65rem; background: rgba(7,17,31,.64); color: var(--color-text-soft); font-size: .59rem; }
.boundary-list div::before { content: "✓"; color: var(--color-success); }
.boundary-list .denied::before { content: "×"; color: var(--color-danger); }

.path-scene { position: relative; display: grid; align-content: center; gap: .65rem; min-height: 405px; padding-inline: .3rem; }
.path-line { position: absolute; left: 2.05rem; top: 3rem; bottom: 3rem; width: 1px; background: linear-gradient(var(--color-cyan), rgba(102,227,255,.08)); }
.path-step { position: relative; z-index: 1; display: grid; grid-template-columns: 2.4rem 1fr auto; align-items: center; gap: .7rem; padding: .68rem .75rem; border: 1px solid var(--color-line); border-radius: .8rem; background: rgba(7,17,31,.8); }
.path-step span { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: .7rem; background: rgba(46,167,255,.1); color: var(--color-cyan); font-size: .68rem; font-weight: 850; }
.path-step strong { font-size: .7rem; }
.path-step small { display: block; color: var(--color-muted); font-size: .58rem; }
.path-step i { color: var(--color-success); font-style: normal; }

.calculator-scene { display: grid; grid-template-columns: .85fr 1.15fr; align-items: stretch; gap: .8rem; min-height: 405px; }
.calculator-inputs { display: grid; align-content: center; gap: .7rem; padding: .85rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(7,17,31,.72); }
.calculator-inputs label { color: var(--color-muted); font-size: .61rem; }
.calculator-inputs strong { display: block; margin-top: .2rem; color: var(--color-text); font-family: var(--font-mono); font-size: .76rem; }
.fake-range { position: relative; height: 5px; margin-top: .4rem; border-radius: 5px; background: rgba(148,169,194,.15); }
.fake-range i { position: absolute; left: 0; top: 0; width: 45%; height: 100%; border-radius: inherit; background: var(--gradient-brand); }
.fake-range::after { content: ""; position: absolute; left: 45%; top: 50%; width: .75rem; height: .75rem; border-radius: 50%; background: var(--color-cyan); transform: translate(-50%, -50%); box-shadow: 0 0 14px rgba(102,227,255,.5); }
.growth-chart { display: flex; align-items: end; gap: .35rem; padding: 1rem .8rem .7rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(7,17,31,.72); }
.growth-bar { flex: 1; min-width: 0; border-radius: .35rem .35rem 0 0; background: linear-gradient(to top, rgba(46,167,255,.25), var(--color-cyan)); opacity: .8; }
.growth-bar:nth-child(1){height:22%}.growth-bar:nth-child(2){height:28%}.growth-bar:nth-child(3){height:36%}.growth-bar:nth-child(4){height:44%}.growth-bar:nth-child(5){height:55%}.growth-bar:nth-child(6){height:68%}.growth-bar:nth-child(7){height:82%}.growth-bar:nth-child(8){height:95%}

.pro-scene { display: grid; grid-template-columns: repeat(2, 1fr); gap: .7rem; align-content: center; min-height: 405px; }
.account-card { padding: .75rem; border: 1px solid var(--color-line); border-radius: .9rem; background: rgba(7,17,31,.72); }
.account-card__top { display: flex; align-items: center; gap: .55rem; }
.account-card__top img { width: 28px; height: 28px; }
.account-card__top strong { font-size: .68rem; }
.account-card__top small { display: block; color: var(--color-muted); font-size: .56rem; }
.account-card__top i { margin-left: auto; width: .5rem; height: .5rem; border-radius: 50%; background: var(--color-success); box-shadow: 0 0 0 4px rgba(65,211,158,.08); }
.account-value { display: flex; align-items: end; justify-content: space-between; margin-top: .65rem; }
.account-value strong { font-size: 1rem; }
.account-value small { color: var(--color-success); font-size: .58rem; }
.account-spark { height: 30px; margin-top: .5rem; background: linear-gradient(135deg, transparent 0 15%, rgba(102,227,255,.8) 15% 18%, transparent 18% 32%, rgba(102,227,255,.8) 32% 35%, transparent 35% 48%, rgba(102,227,255,.8) 48% 51%, transparent 51% 64%, rgba(102,227,255,.8) 64% 67%, transparent 67% 78%, rgba(102,227,255,.8) 78% 81%, transparent 81%); opacity: .45; }

.pool-scene { display: grid; grid-template-columns: 1fr .85fr; gap: .8rem; align-content: center; min-height: 405px; }
.pool-summary { display: grid; gap: .65rem; padding: .85rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(7,17,31,.75); }
.pool-balance { padding: .8rem; border-radius: .8rem; background: linear-gradient(135deg, rgba(46,167,255,.12), rgba(65,211,158,.06)); }
.pool-balance small { color: var(--color-muted); font-size: .6rem; }
.pool-balance strong { display: block; margin-top: .15rem; font-size: 1.55rem; }
.pool-balance em { color: var(--color-warning); font-style: normal; font-size: .6rem; }
.pool-flow { display: grid; gap: .5rem; }
.pool-flow div { display: grid; grid-template-columns: 1.5rem 1fr; gap: .5rem; padding: .6rem; border: 1px solid var(--color-line); border-radius: .7rem; background: rgba(7,17,31,.65); font-size: .61rem; }
.pool-flow span { display: grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; color: var(--color-cyan); background: rgba(46,167,255,.1); font-weight: 800; }
.pool-warning { align-self: center; padding: .85rem; border: 1px solid rgba(245,199,107,.25); border-radius: 1rem; background: rgba(245,199,107,.06); }
.pool-warning img { width: 44px; height: 44px; margin-bottom: .55rem; }
.pool-warning strong { display: block; font-size: .75rem; }
.pool-warning p { margin: .4rem 0 0; color: var(--color-muted); font-size: .62rem; }

.cloud-scene { display: grid; grid-template-columns: 1fr 80px 1fr; align-items: center; min-height: 405px; }
.cloud-option { padding: .9rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(7,17,31,.72); text-align: center; }
.cloud-option.is-muted { opacity: .62; }
.cloud-option img { width: 64px; height: 64px; margin: 0 auto .7rem; padding: .8rem; border-radius: 1rem; background: rgba(46,167,255,.1); }
.cloud-option strong { display: block; font-size: .78rem; }
.cloud-option small { display: block; margin-top: .4rem; color: var(--color-muted); font-size: .6rem; }
.cloud-switch { display: grid; place-items: center; gap: .5rem; color: var(--color-cyan); font-size: .6rem; font-weight: 750; }
.cloud-switch span { display: grid; place-items: center; width: 2.8rem; height: 2.8rem; border: 1px solid rgba(102,227,255,.25); border-radius: 50%; background: rgba(46,167,255,.08); }

.browser-scene { position: relative; display: grid; place-items: center; min-height: 405px; }
.browser-cloud { position: relative; z-index: 2; display: grid; place-items: center; width: 135px; height: 110px; border: 1px solid rgba(102,227,255,.28); border-radius: 50%; background: radial-gradient(circle, rgba(46,167,255,.18), rgba(7,17,31,.9)); text-align: center; }
.browser-cloud img { width: 42px; height: 42px; }
.browser-cloud strong { font-size: .67rem; }
.device-card { position: absolute; width: 125px; padding: .65rem; border: 1px solid var(--color-line); border-radius: .8rem; background: rgba(7,17,31,.86); text-align: center; }
.device-card img { width: 32px; height: 32px; margin: 0 auto .35rem; }
.device-card strong { display: block; font-size: .62rem; }
.device-card small { color: var(--color-muted); font-size: .53rem; }
.device-card:nth-child(2){left:4%;top:10%}.device-card:nth-child(3){right:4%;top:10%}.device-card:nth-child(4){left:6%;bottom:8%}.device-card:nth-child(5){right:6%;bottom:8%}
.browser-line { position: absolute; width: 32%; height: 1px; background: linear-gradient(90deg, transparent, rgba(102,227,255,.35), transparent); }
.browser-line--a{left:20%;top:36%;transform:rotate(25deg)}.browser-line--b{right:20%;top:36%;transform:rotate(-25deg)}.browser-line--c{left:20%;bottom:31%;transform:rotate(-25deg)}.browser-line--d{right:20%;bottom:31%;transform:rotate(25deg)}

.compare-scene { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; align-content: center; min-height: 405px; }
.compare-card { padding: .8rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(7,17,31,.72); }
.compare-card.is-primary { border-color: rgba(102,227,255,.28); background: linear-gradient(180deg, rgba(46,167,255,.1), rgba(7,17,31,.76)); }
.compare-logo { display: flex; align-items: center; gap: .55rem; padding-bottom: .65rem; border-bottom: 1px solid var(--color-line); }
.compare-logo img { width: 34px; height: 34px; }
.compare-logo strong { font-size: .72rem; }
.compare-logo small { display: block; color: var(--color-muted); font-size: .56rem; }
.compare-list { display: grid; gap: .4rem; margin-top: .65rem; }
.compare-list div { display: flex; justify-content: space-between; gap: .5rem; padding: .45rem .5rem; border-radius: .55rem; background: rgba(148,169,194,.05); color: var(--color-muted); font-size: .57rem; }
.compare-list b { color: var(--color-text); }

.blog-scene { position: relative; display: grid; place-items: center; min-height: 405px; }
.article-stack { position: relative; width: min(92%, 430px); height: 320px; }
.article-sheet { position: absolute; inset: 0; padding: .9rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(7,17,31,.92); box-shadow: var(--shadow-md); }
.article-sheet:nth-child(1){transform:translate(-1.2rem,1.4rem) rotate(-5deg);opacity:.45}.article-sheet:nth-child(2){transform:translate(1.2rem,.7rem) rotate(4deg);opacity:.7}.article-sheet:nth-child(3){transform:translate(0,0);}
.article-sheet .article-tag { display: inline-flex; padding: .25rem .45rem; border-radius: var(--radius-pill); color: var(--color-cyan); background: rgba(46,167,255,.1); font-size: .55rem; font-weight: 750; }
.article-sheet h3 { margin: .7rem 0 .4rem; font-size: 1rem; line-height: 1.25; }
.article-sheet p { margin: 0; color: var(--color-muted); font-size: .62rem; }
.article-lines { display: grid; gap: .45rem; margin-top: .8rem; }
.article-lines i { display: block; height: .42rem; border-radius: .3rem; background: rgba(148,169,194,.11); }
.article-lines i:nth-child(2){width:85%}.article-lines i:nth-child(3){width:68%}

.legal-scene { display: grid; place-items: center; min-height: 330px; }
.legal-doc { width: min(82%, 330px); padding: 1rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(7,17,31,.85); box-shadow: var(--shadow-md); }
.legal-doc__head { display: flex; align-items: center; gap: .65rem; padding-bottom: .7rem; border-bottom: 1px solid var(--color-line); }
.legal-doc__head img { width: 38px; height: 38px; }
.legal-doc__head strong { font-size: .72rem; }
.legal-doc__head small { display: block; color: var(--color-muted); font-size: .56rem; }
.legal-lines { display: grid; gap: .55rem; margin-top: .8rem; }
.legal-lines i { display: block; height: .45rem; border-radius: .3rem; background: rgba(148,169,194,.1); }
.legal-lines i:nth-child(2),.legal-lines i:nth-child(5){width:82%}.legal-lines i:nth-child(3){width:65%}

/* Section headings and layouts */
.section-heading { max-width: 760px; margin-bottom: clamp(2rem, 4vw, 3.25rem); }
.section-heading--center { margin-inline: auto; text-align: center; }
.section-kicker { display: inline-flex; align-items: center; gap: .45rem; margin-bottom: .65rem; color: var(--color-cyan); font-size: .76rem; font-weight: 780; letter-spacing: .07em; text-transform: uppercase; }
.section-kicker::before { content: ""; width: 1.4rem; height: 1px; background: currentColor; opacity: .7; }
.section-heading h2 { margin: 0; font-size: clamp(2rem, 4vw, 3.55rem); line-height: 1.08; letter-spacing: -.035em; text-wrap: balance; }
.section-heading p { margin: .9rem 0 0; color: var(--color-muted); font-size: clamp(.98rem, 1.3vw, 1.08rem); }
.split-layout { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.split-copy h2 { margin: 0; font-size: clamp(2rem, 4vw, 3.3rem); line-height: 1.08; letter-spacing: -.035em; }
.split-copy > p { color: var(--color-muted); font-size: 1.02rem; }
.check-list { display: grid; gap: .75rem; margin: 1.4rem 0 0; padding: 0; list-style: none; }
.check-list li { display: grid; grid-template-columns: 1.5rem 1fr; gap: .7rem; color: var(--color-text-soft); }
.check-list li::before { content: "✓"; display: grid; place-items: center; width: 1.4rem; height: 1.4rem; margin-top: .08rem; border-radius: 50%; color: var(--color-success); background: rgba(65,211,158,.1); font-size: .72rem; font-weight: 900; }
.check-list strong { color: var(--color-text); }
.info-panel { position: relative; padding: clamp(1.2rem, 2.5vw, 2rem); border: 1px solid var(--color-line); border-radius: 1.4rem; background: var(--gradient-surface); box-shadow: var(--shadow-md); }
.info-panel--cyan { border-color: rgba(102,227,255,.22); background: linear-gradient(145deg, rgba(20,41,67,.95), rgba(7,24,40,.95)); }
.info-panel--warning { border-color: rgba(245,199,107,.25); background: linear-gradient(145deg, rgba(54,45,25,.5), rgba(14,22,32,.95)); }
.info-panel--danger { border-color: rgba(255,116,88,.25); background: linear-gradient(145deg, rgba(55,28,28,.45), rgba(14,22,32,.95)); }
.info-panel h3 { margin: 0 0 .6rem; font-size: 1.25rem; }
.info-panel p:last-child { margin-bottom: 0; }

.stats-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: .8rem; margin-top: -2rem; position: relative; z-index: 4; }
.stat-card { padding: 1.15rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(11,24,41,.88); box-shadow: var(--shadow-sm); }
.stat-card strong { display: block; font-size: 1.45rem; letter-spacing: -.025em; }
.stat-card small { display: block; margin-top: .25rem; color: var(--color-muted); font-size: .72rem; }

.card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.card-grid--2 { grid-template-columns: repeat(2, 1fr); }
.card-grid--4 { grid-template-columns: repeat(4, 1fr); }
.feature-card { position: relative; overflow: hidden; min-height: 220px; padding: 1.25rem; border: 1px solid var(--color-line); border-radius: 1.15rem; background: rgba(11,24,41,.7); transition: transform var(--transition), border-color var(--transition), background var(--transition), box-shadow var(--transition); }
.feature-card:hover { transform: translateY(-4px); border-color: rgba(102,227,255,.24); background: rgba(15,32,53,.78); box-shadow: var(--shadow-sm); }
.feature-card::after { content: ""; position: absolute; width: 8rem; height: 8rem; right: -4rem; top: -4rem; border-radius: 50%; background: rgba(46,167,255,.06); }
.feature-icon { display: grid; place-items: center; width: 3rem; height: 3rem; margin-bottom: 1rem; border: 1px solid rgba(102,227,255,.12); border-radius: .9rem; background: rgba(46,167,255,.08); }
.feature-icon img { width: 1.8rem; height: 1.8rem; }
.feature-card h3 { margin: 0; font-size: 1.05rem; }
.feature-card p { margin: .55rem 0 0; color: var(--color-muted); font-size: .9rem; }
.feature-card a { display: inline-flex; align-items: center; gap: .35rem; margin-top: 1rem; color: var(--color-cyan); font-size: .82rem; font-weight: 750; }
.feature-card a::after { content: "→"; transition: transform var(--transition); }
.feature-card a:hover::after { transform: translateX(3px); }

.steps-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .85rem; counter-reset: step; }
.step-card { position: relative; padding: 1.2rem; border: 1px solid var(--color-line); border-radius: 1.1rem; background: rgba(11,24,41,.68); counter-increment: step; }
.step-card::before { content: "0" counter(step); display: inline-flex; margin-bottom: 1.1rem; color: var(--color-cyan); font-family: var(--font-mono); font-size: .75rem; font-weight: 800; }
.step-card:not(:last-child)::after { content: ""; position: absolute; top: 2.1rem; right: -.9rem; width: 1.8rem; height: 1px; background: linear-gradient(90deg, var(--color-cyan), transparent); }
.step-card h3 { margin: 0; font-size: 1rem; }
.step-card p { margin: .55rem 0 0; color: var(--color-muted); font-size: .86rem; }

.process-rail { display: grid; gap: .8rem; }
.process-item { display: grid; grid-template-columns: 3rem 1fr auto; align-items: center; gap: 1rem; padding: 1rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(11,24,41,.65); }
.process-item__icon { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: .9rem; background: rgba(46,167,255,.08); }
.process-item__icon img { width: 1.8rem; height: 1.8rem; }
.process-item h3 { margin: 0; font-size: .98rem; }
.process-item p { margin: .25rem 0 0; color: var(--color-muted); font-size: .82rem; }
.process-item b { color: var(--color-muted-2); font-family: var(--font-mono); font-size: .72rem; }

/* Tabs */
.tab-shell { display: grid; grid-template-columns: 280px minmax(0,1fr); gap: 1rem; }
.tab-list { display: grid; align-content: start; gap: .45rem; padding: .55rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(11,24,41,.65); }
.tab-button { display: grid; grid-template-columns: 2.3rem 1fr; align-items: center; gap: .65rem; width: 100%; padding: .7rem; border: 1px solid transparent; border-radius: .75rem; background: transparent; color: var(--color-muted); text-align: left; cursor: pointer; }
.tab-button img { width: 2.15rem; height: 2.15rem; padding: .4rem; border-radius: .65rem; background: rgba(46,167,255,.07); }
.tab-button strong { display: block; color: var(--color-text-soft); font-size: .82rem; }
.tab-button small { display: block; font-size: .65rem; }
.tab-button[aria-selected="true"] { border-color: rgba(102,227,255,.18); background: rgba(46,167,255,.08); color: var(--color-cyan); }
.tab-button[aria-selected="true"] strong { color: var(--color-white); }
.tab-panel { min-height: 420px; padding: clamp(1.3rem,3vw,2rem); border: 1px solid var(--color-line); border-radius: 1.2rem; background: var(--gradient-surface); }
.tab-panel[hidden] { display: none; }
.tab-panel h3 { margin: 0 0 .6rem; font-size: 1.5rem; }
.tab-panel > p { color: var(--color-muted); }
.tab-feature-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: .75rem; margin-top: 1.25rem; }
.tab-feature { padding: .9rem; border: 1px solid var(--color-line); border-radius: .85rem; background: rgba(7,17,31,.5); }
.tab-feature strong { display: block; font-size: .84rem; }
.tab-feature small { display: block; margin-top: .25rem; color: var(--color-muted); font-size: .72rem; }

/* Tables and comparison */
.table-shell { overflow: hidden; border: 1px solid var(--color-line); border-radius: 1.2rem; background: rgba(11,24,41,.65); box-shadow: var(--shadow-sm); }
.table-scroll { overflow-x: auto; }
.comparison-table { width: 100%; min-width: 760px; border-collapse: collapse; }
.comparison-table th, .comparison-table td { padding: .95rem 1rem; border-bottom: 1px solid var(--color-line); text-align: left; vertical-align: middle; }
.comparison-table th { position: sticky; top: 0; z-index: 1; color: var(--color-text); background: rgba(15,32,53,.95); font-size: .77rem; letter-spacing: .02em; }
.comparison-table th:first-child { min-width: 220px; }
.comparison-table td { color: var(--color-text-soft); font-size: .82rem; }
.comparison-table tr:last-child td { border-bottom: 0; }
.comparison-table td.is-brand, .comparison-table th.is-brand { background: rgba(46,167,255,.055); }
.table-check { color: var(--color-success); font-weight: 900; }
.table-cross { color: var(--color-muted-2); }
.table-note { color: var(--color-warning); font-size: .72rem; }
.table-methodology { margin: .8rem 0 0; color: var(--color-muted-2); font-size: .72rem; }
.criteria-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .8rem; }
.criteria-card { padding: 1rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(11,24,41,.65); }
.criteria-card strong { display: block; font-size: .9rem; }
.criteria-card p { margin: .35rem 0 0; color: var(--color-muted); font-size: .8rem; }

/* Pricing */
.pricing-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .7rem; margin-bottom: 1.6rem; }
.segmented { display: inline-flex; padding: .28rem; border: 1px solid var(--color-line); border-radius: .9rem; background: rgba(7,17,31,.7); }
.segmented button { min-height: 38px; padding: .55rem .8rem; border: 0; border-radius: .65rem; background: transparent; color: var(--color-muted); font-size: .78rem; font-weight: 760; cursor: pointer; }
.segmented button[aria-pressed="true"] { color: var(--color-white); background: rgba(46,167,255,.12); box-shadow: inset 0 0 0 1px rgba(102,227,255,.13); }
.price-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: .9rem; }
.price-card { position: relative; display: flex; flex-direction: column; padding: 1.2rem; border: 1px solid var(--color-line); border-radius: 1.2rem; background: rgba(11,24,41,.72); }
.price-card.is-featured { border-color: rgba(102,227,255,.35); background: linear-gradient(180deg, rgba(46,167,255,.12), rgba(11,24,41,.8)); box-shadow: 0 28px 75px rgba(46,167,255,.13); }
.price-ribbon { position: absolute; right: 1rem; top: 1rem; padding: .28rem .5rem; border-radius: var(--radius-pill); color: #04101c; background: var(--gradient-brand); font-size: .62rem; font-weight: 850; }
.price-card h3 { margin: 0; font-size: 1rem; }
.price-card > p { min-height: 3.2rem; color: var(--color-muted); font-size: .8rem; }
.price { display: flex; align-items: end; gap: .3rem; margin: .55rem 0 .9rem; }
.price strong { font-size: 2.15rem; line-height: 1; letter-spacing: -.04em; }
.price span { color: var(--color-muted); font-size: .72rem; }
.price-card ul { display: grid; gap: .55rem; margin: 0 0 1.2rem; padding: 0; list-style: none; color: var(--color-text-soft); font-size: .76rem; }
.price-card li { display: grid; grid-template-columns: 1rem 1fr; gap: .45rem; }
.price-card li::before { content: "✓"; color: var(--color-success); font-weight: 900; }
.price-card .button { margin-top: auto; width: 100%; }
.price-footnote { margin-top: 1rem; padding: .85rem 1rem; border: 1px solid var(--color-line); border-radius: .9rem; color: var(--color-muted); background: rgba(7,17,31,.55); font-size: .75rem; }

/* Dashboard mockups */
.dashboard-shell { overflow: hidden; border: 1px solid var(--color-line); border-radius: 1.4rem; background: #07111f; box-shadow: var(--shadow-lg); }
.dashboard-bar { display: flex; align-items: center; justify-content: space-between; padding: .9rem 1rem; border-bottom: 1px solid var(--color-line); background: rgba(15,32,53,.65); }
.dashboard-bar strong { font-size: .85rem; }
.dashboard-bar small { color: var(--color-muted); font-size: .68rem; }
.dashboard-grid { display: grid; grid-template-columns: 210px 1fr; min-height: 480px; }
.dashboard-nav { padding: .8rem; border-right: 1px solid var(--color-line); background: rgba(4,10,19,.35); }
.dashboard-nav a { display: flex; align-items: center; gap: .55rem; padding: .65rem; border-radius: .65rem; color: var(--color-muted); font-size: .7rem; }
.dashboard-nav a.is-active { color: var(--color-white); background: rgba(46,167,255,.08); }
.dashboard-nav img { width: 1.25rem; height: 1.25rem; }
.dashboard-content { padding: 1rem; }
.dashboard-metrics { display: grid; grid-template-columns: repeat(4,1fr); gap: .65rem; }
.dashboard-table { margin-top: .8rem; overflow: hidden; border: 1px solid var(--color-line); border-radius: .85rem; }
.dashboard-table__row { display: grid; grid-template-columns: 1.2fr .8fr .8fr .8fr auto; gap: .6rem; align-items: center; padding: .65rem .75rem; border-top: 1px solid var(--color-line); color: var(--color-text-soft); font-size: .68rem; }
.dashboard-table__row:first-child { border-top: 0; color: var(--color-muted); background: rgba(15,32,53,.55); font-size: .6rem; text-transform: uppercase; letter-spacing: .05em; }
.status-chip { display: inline-flex; align-items: center; gap: .35rem; width: fit-content; padding: .22rem .42rem; border-radius: var(--radius-pill); color: var(--color-success); background: rgba(65,211,158,.08); font-size: .58rem; font-weight: 760; }

/* Reviews */
.review-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; }
.review-card { display: flex; flex-direction: column; min-height: 280px; padding: 1.15rem; border: 1px solid var(--color-line); border-radius: 1.1rem; background: rgba(11,24,41,.7); }
.review-stars { color: var(--color-warning); letter-spacing: .1em; font-size: .8rem; }
.review-card h3 { margin: .7rem 0 .45rem; font-size: 1rem; }
.review-card blockquote { margin: 0; color: var(--color-text-soft); font-size: .84rem; }
.review-card footer { display: flex; align-items: center; gap: .6rem; margin-top: auto; padding-top: 1rem; }
.review-avatar { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: .7rem; color: #04101c; background: var(--gradient-brand); font-size: .66rem; font-weight: 850; }
.review-card footer strong { display: block; font-size: .72rem; }
.review-card footer small { display: block; color: var(--color-muted); font-size: .62rem; }
.review-source-note { margin-top: 1rem; color: var(--color-muted-2); font-size: .72rem; }

/* Calculator */
.calculator-shell { display: grid; grid-template-columns: .85fr 1.15fr; gap: 1rem; padding: 1rem; border: 1px solid var(--color-line); border-radius: 1.2rem; background: rgba(11,24,41,.7); }
.calc-controls { display: grid; align-content: start; gap: .85rem; padding: .4rem; }
.form-field { display: grid; gap: .38rem; }
.form-field label { color: var(--color-text-soft); font-size: .78rem; font-weight: 700; }
.form-field small { color: var(--color-muted); font-size: .68rem; }
.form-control { width: 100%; min-height: 48px; padding: .78rem .85rem; border: 1px solid var(--color-line-strong); border-radius: .75rem; color: var(--color-text); background: rgba(4,10,19,.45); outline: none; transition: border-color var(--transition), box-shadow var(--transition), background var(--transition); }
.form-control:focus { border-color: rgba(102,227,255,.45); background: rgba(7,17,31,.75); box-shadow: 0 0 0 4px rgba(46,167,255,.08); }
input[type="range"] { width: 100%; accent-color: var(--color-brand); }
.calc-result { display: grid; align-content: center; padding: 1.2rem; border: 1px solid rgba(102,227,255,.16); border-radius: 1rem; background: radial-gradient(circle at 50% 20%, rgba(46,167,255,.1), rgba(7,17,31,.62)); text-align: center; }
.calc-result small { color: var(--color-muted); }
.calc-result strong { display: block; margin: .4rem 0; font-size: clamp(2rem,5vw,3.6rem); letter-spacing: -.05em; }
.calc-result p { margin: 0; color: var(--color-muted); font-size: .72rem; }
.calc-bars { display: flex; align-items: end; gap: .25rem; height: 120px; margin-top: 1.3rem; }
.calc-bars i { flex: 1; min-width: 0; border-radius: .25rem .25rem 0 0; background: linear-gradient(to top, rgba(46,167,255,.18), var(--color-cyan)); opacity: .72; }

/* FAQ */
.faq-list { display: grid; gap: .7rem; max-width: 900px; margin-inline: auto; }
.faq-item { overflow: hidden; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(11,24,41,.65); }
.faq-question { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; min-height: 64px; padding: .95rem 1.05rem; border: 0; background: transparent; color: var(--color-text); text-align: left; font-weight: 750; cursor: pointer; }
.faq-question::after { content: "+"; display: grid; place-items: center; flex: 0 0 auto; width: 1.65rem; height: 1.65rem; border-radius: 50%; color: var(--color-cyan); background: rgba(46,167,255,.08); font-size: 1.1rem; font-weight: 400; transition: transform var(--transition); }
.faq-question[aria-expanded="true"]::after { transform: rotate(45deg); }
.faq-answer { overflow: hidden; max-height: 0; transition: max-height .26s ease; }
.faq-answer > div { padding: 0 1.05rem 1rem; color: var(--color-muted); font-size: .88rem; }
.faq-answer > div > p { margin: 0 0 .7rem; }
.faq-answer > div > p:last-child { margin-bottom: 0; }

/* Blog */
.blog-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.3rem; }
.blog-search { position: relative; flex: 1 1 360px; max-width: 480px; }
.blog-search img { position: absolute; left: .85rem; top: 50%; width: 1.2rem; height: 1.2rem; transform: translateY(-50%); opacity: .7; }
.blog-search input { padding-left: 2.8rem; }
.blog-filters { display: flex; flex-wrap: wrap; gap: .45rem; }
.blog-filter { padding: .55rem .75rem; border: 1px solid var(--color-line); border-radius: var(--radius-pill); background: rgba(7,17,31,.55); color: var(--color-muted); font-size: .72rem; font-weight: 720; cursor: pointer; }
.blog-filter[aria-pressed="true"] { border-color: rgba(102,227,255,.22); color: var(--color-cyan); background: rgba(46,167,255,.08); }
.featured-article { display: grid; grid-template-columns: 1.05fr .95fr; gap: 1rem; padding: 1rem; border: 1px solid rgba(102,227,255,.2); border-radius: 1.25rem; background: linear-gradient(145deg, rgba(20,41,67,.85), rgba(7,17,31,.8)); }
.featured-art { position: relative; overflow: hidden; min-height: 280px; border-radius: 1rem; background: radial-gradient(circle at 55% 40%, rgba(46,167,255,.22), rgba(7,17,31,.9)); }
.featured-art::before { content: ""; position: absolute; inset: 12%; border: 1px solid rgba(102,227,255,.18); border-radius: 1rem; transform: rotate(-5deg); }
.featured-art::after { content: "Telegram → Parser → MT5"; position: absolute; inset: 28% 16%; display: grid; place-items: center; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(11,24,41,.88); color: var(--color-cyan); font-family: var(--font-mono); font-size: .78rem; box-shadow: var(--shadow-md); }
.featured-copy { align-self: center; padding: 1rem; }
.article-meta { display: flex; flex-wrap: wrap; gap: .5rem .85rem; color: var(--color-muted); font-size: .7rem; }
.article-tag { color: var(--color-cyan); font-weight: 760; }
.featured-copy h2 { margin: .6rem 0; font-size: clamp(1.6rem,3vw,2.5rem); line-height: 1.1; }
.featured-copy p { color: var(--color-muted); }
.article-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; margin-top: 1rem; }
.article-card { display: flex; flex-direction: column; min-height: 300px; overflow: hidden; border: 1px solid var(--color-line); border-radius: 1.05rem; background: rgba(11,24,41,.68); transition: transform var(--transition), border-color var(--transition); }
.article-card:hover { transform: translateY(-4px); border-color: rgba(102,227,255,.22); }
.article-card__art { position: relative; height: 118px; border-bottom: 1px solid var(--color-line); background: linear-gradient(135deg, rgba(46,167,255,.12), rgba(159,140,255,.06), rgba(7,17,31,.8)); }
.article-card__art::before { content: ""; position: absolute; width: 46px; height: 46px; left: 1rem; bottom: 1rem; border: 1px solid rgba(102,227,255,.2); border-radius: .8rem; background: rgba(7,17,31,.72) url('/assets/icons/book.svg') center/24px no-repeat; }
.article-card__body { display: flex; flex-direction: column; flex: 1; padding: 1rem; }
.article-card h3 { margin: .55rem 0 .45rem; font-size: 1rem; line-height: 1.3; }
.article-card p { margin: 0; color: var(--color-muted); font-size: .8rem; }
.article-card a { margin-top: auto; padding-top: .9rem; color: var(--color-cyan); font-size: .76rem; font-weight: 760; }

/* Article template */
.article-hero { padding-bottom: 3rem; }
.article-hero .hero-copy { max-width: 900px; margin-inline: auto; text-align: center; }
.article-hero .hero-copy h1 { max-width: 20ch; margin-inline: auto; font-size: clamp(2.25rem,4.5vw,4.1rem); }
.article-hero .hero-lede { margin-inline: auto; }
.article-layout { display: grid; grid-template-columns: 220px minmax(0,760px) 220px; justify-content: center; gap: 2rem; align-items: start; }
.article-toc { position: sticky; top: calc(var(--header-height) + 1.5rem); padding: .9rem; border: 1px solid var(--color-line); border-radius: .9rem; background: rgba(11,24,41,.65); }
.article-toc strong { display: block; margin-bottom: .6rem; font-size: .75rem; }
.article-toc a { display: block; padding: .35rem 0; color: var(--color-muted); font-size: .7rem; }
.article-toc a:hover { color: var(--color-cyan); }
.article-content { min-width: 0; }
.article-content h2 { margin: 2.4rem 0 .8rem; font-size: 1.8rem; line-height: 1.2; }
.article-content h3 { margin: 1.7rem 0 .6rem; font-size: 1.25rem; }
.article-content p, .article-content li { color: var(--color-text-soft); }
.article-content a { color: var(--color-cyan); text-decoration: underline; text-underline-offset: 3px; }
.article-content blockquote { margin: 1.5rem 0; padding: 1rem 1.1rem; border-left: 3px solid var(--color-cyan); border-radius: 0 .8rem .8rem 0; background: rgba(46,167,255,.06); color: var(--color-text-soft); }
.article-content img { border-radius: 1rem; border: 1px solid var(--color-line); }
.article-content .content-slot { min-height: 500px; padding: 1.2rem; border: 1px dashed rgba(102,227,255,.22); border-radius: 1rem; background: rgba(7,17,31,.35); }
.article-aside { position: sticky; top: calc(var(--header-height) + 1.5rem); }
.article-cta-card { padding: 1rem; border: 1px solid rgba(102,227,255,.2); border-radius: 1rem; background: linear-gradient(145deg, rgba(46,167,255,.08), rgba(11,24,41,.7)); }
.article-cta-card h3 { margin: 0; font-size: .95rem; }
.article-cta-card p { color: var(--color-muted); font-size: .75rem; }
.article-cta-card .button { width: 100%; }

/* Legal */
.legal-layout { display: grid; grid-template-columns: 240px minmax(0,800px); justify-content: center; gap: 2rem; align-items: start; }
.legal-toc { position: sticky; top: calc(var(--header-height) + 1.5rem); padding: 1rem; border: 1px solid var(--color-line); border-radius: 1rem; background: rgba(11,24,41,.65); }
.legal-toc strong { display: block; margin-bottom: .6rem; font-size: .8rem; }
.legal-toc a { display: block; padding: .42rem 0; color: var(--color-muted); font-size: .72rem; }
.legal-toc a:hover { color: var(--color-cyan); }
.legal-content { min-width: 0; padding: clamp(1.2rem,3vw,2.2rem); border: 1px solid var(--color-line); border-radius: 1.2rem; background: rgba(11,24,41,.58); }
.legal-content h2 { margin: 2rem 0 .7rem; font-size: 1.45rem; }
.legal-content h2:first-child { margin-top: 0; }
.legal-content p, .legal-content li { color: var(--color-text-soft); }
.legal-content .legal-note { padding: .8rem 1rem; border: 1px solid rgba(245,199,107,.2); border-radius: .8rem; background: rgba(245,199,107,.05); color: var(--color-muted); font-size: .76rem; }

/* Authentication */
.auth-page { min-height: 100svh; display: grid; grid-template-columns: minmax(420px,1.05fr) minmax(420px,.95fr); background: var(--color-bg); }
.auth-story { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; min-height: 100svh; padding: clamp(1.4rem,4vw,3.5rem); border-right: 1px solid var(--color-line); background: radial-gradient(circle at 32% 24%, rgba(46,167,255,.2), transparent 28rem), linear-gradient(145deg,#0a1b2e,#050d17); }
.auth-story::before { content: ""; position: absolute; inset: -10%; opacity: .25; background-image: linear-gradient(rgba(148,169,194,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(148,169,194,.08) 1px,transparent 1px); background-size: 56px 56px; transform: rotate(-8deg); }
.auth-story > * { position: relative; z-index: 1; }
.auth-brand { width: 220px; }
.auth-story-copy { max-width: 620px; }
.auth-story-copy .page-eyebrow { margin-bottom: 1rem; }
.auth-story-copy h1 { margin: 0; max-width: 12ch; font-size: clamp(2.7rem,5vw,5rem); line-height: 1; letter-spacing: -.055em; }
.auth-story-copy h1 span { color: transparent; background: var(--gradient-brand); -webkit-background-clip: text; background-clip: text; }
.auth-story-copy p { max-width: 52ch; color: var(--color-text-soft); }
.auth-mini-flow { display: grid; grid-template-columns: 1fr 42px 1fr 42px 1fr; align-items: center; max-width: 680px; margin-top: 2rem; }
.auth-mini-node { display: grid; place-items: center; gap: .35rem; min-height: 108px; padding: .7rem; border: 1px solid var(--color-line); border-radius: .9rem; background: rgba(7,17,31,.72); text-align: center; }
.auth-mini-node img { width: 34px; height: 34px; }
.auth-mini-node strong { font-size: .67rem; }
.auth-mini-node small { color: var(--color-muted); font-size: .55rem; }
.auth-mini-line { position: relative; height: 1px; background: rgba(102,227,255,.3); }
.auth-mini-line::after { content: ""; position: absolute; top: 50%; width: .45rem; height: .45rem; border-radius: 50%; background: var(--color-cyan); transform: translate(-50%,-50%); box-shadow: 0 0 14px rgba(102,227,255,.5); }
.auth-story-footer { color: var(--color-muted); font-size: .72rem; }
.auth-form-side { display: grid; place-items: center; min-height: 100svh; padding: 2rem; background: radial-gradient(circle at 70% 30%, rgba(159,140,255,.06), transparent 25rem); }
.auth-card { width: min(100%, 480px); padding: clamp(1.3rem,4vw,2.2rem); border: 1px solid var(--color-line); border-radius: 1.3rem; background: rgba(11,24,41,.75); box-shadow: var(--shadow-lg); }
.auth-card h2 { margin: 0; font-size: 2rem; letter-spacing: -.035em; }
.auth-card > p { color: var(--color-muted); }
.auth-form { display: grid; gap: .9rem; margin-top: 1.15rem; }
.input-wrap { position: relative; }
.input-wrap .form-control { padding-right: 3rem; }
.input-action { position: absolute; right: .45rem; top: 50%; display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border: 0; border-radius: .6rem; background: transparent; transform: translateY(-50%); cursor: pointer; opacity: .7; }
.input-action img { width: 1.2rem; height: 1.2rem; }
.auth-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; color: var(--color-muted); font-size: .72rem; }
.auth-row a { color: var(--color-cyan); font-weight: 730; }
.auth-captcha {
  display: grid;
  gap: .7rem;
  padding: .85rem .9rem;
  border: 1px solid rgba(148,169,194,.16);
  border-radius: .95rem;
  background:
    linear-gradient(180deg, rgba(15,32,53,.72), rgba(8,18,32,.88));
}
.auth-captcha-copy { display: grid; gap: .15rem; }
.auth-captcha-copy strong { font-size: .74rem; letter-spacing: -.01em; color: var(--color-text); }
.auth-captcha-copy span { color: var(--color-muted); font-size: .68rem; line-height: 1.45; }
.auth-captcha-widget {
  position: relative;
  width: 100%;
  min-height: 78px;
  overflow: hidden;
  border-radius: .9rem;
  border: 1px solid rgba(148,169,194,.18);
  background: rgba(7,17,31,.35);
}
.auth-captcha-widget > div {
  transform-origin: top left;
}
.auth-captcha-widget iframe {
  border-radius: .9rem !important;
}
.auth-form .button { width: 100%; }
.auth-submit { position: relative; }
.auth-submit svg { transition: opacity .15s ease; }
.auth-submit-spinner {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1.15rem;
  height: 1.15rem;
  margin: 0;
  border: 2px solid rgba(255,255,255,.25);
  border-top-color: #fff;
  border-radius: 50%;
  opacity: 0;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.auth-body.is-busy,
.auth-body.is-busy * { cursor: wait !important; }
.auth-form.is-busy .auth-submit { pointer-events: none; }
.auth-form.is-busy .auth-submit-label,
.auth-form.is-busy .auth-submit svg { opacity: 0; }
.auth-form.is-busy .auth-submit-spinner {
  opacity: 1;
  animation: auth-spin .7s linear infinite;
}
@keyframes auth-spin { to { transform: translate(-50%, -50%) rotate(360deg); } }
.auth-social { margin-top: 1.15rem; }
.auth-google-wrap {
  position: relative;
  display: grid;
  min-height: 52px;
  border: 1px solid rgba(148,169,194,.2);
  border-radius: .9rem;
  background: rgba(255,255,255,.96);
  box-shadow: 0 8px 24px rgba(4,10,19,.18);
  overflow: hidden;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.auth-google-wrap:hover {
  border-color: rgba(102,227,255,.35);
  box-shadow: 0 12px 28px rgba(4,10,19,.24);
  transform: translateY(-1px);
}
.auth-google-face {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .7rem;
  min-height: 52px;
  padding: 0 1rem;
  color: #1f2937;
  font-size: .92rem;
  font-weight: 720;
  letter-spacing: -.01em;
  pointer-events: none;
}
.auth-google-face svg { flex: 0 0 auto; }
.auth-google {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  opacity: 0.011;
  cursor: pointer;
}
.auth-google > div,
.auth-google iframe {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
}
.auth-separator { display: flex; align-items: center; gap: .7rem; margin: 0 0 .85rem; color: var(--color-muted-2); font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; }
.auth-separator::before,.auth-separator::after { content: ""; flex: 1; height: 1px; background: var(--color-line); }
.auth-switch { margin-top: 1rem; color: var(--color-muted); text-align: center; font-size: .76rem; }
.site-scroll-top {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 10031;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: linear-gradient(135deg, #22c55e 0%, #059669 100%);
  color: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.2);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: opacity .2s ease, visibility .2s ease, transform .2s ease, box-shadow .2s ease;
}
.site-scroll-top svg { width: 1.15rem; height: 1.15rem; }
.site-scroll-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.site-scroll-top:hover,
.site-scroll-top:focus-visible { box-shadow: 0 12px 28px rgba(15, 23, 42, 0.28); outline: none; }
@media (max-width: 767px) {
  .site-scroll-top { right: 16px; bottom: 16px; width: 44px; height: 44px; }
}
/* Embedded video + MQL5 EA widgets */
.video-block { max-width: 920px; margin: 0 auto; }
.video-frame {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  overflow: hidden;
  border: 1px solid var(--color-line);
  border-radius: 1rem;
  background: rgba(7, 17, 31, .72);
  box-shadow: var(--shadow-md);
}
.video-frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.video-caption {
  margin: .85rem 0 0;
  color: var(--color-muted);
  text-align: center;
  font-size: .78rem;
}
.video-block--responsive .video-frame--mobile { display: none; }
@media (max-width: 960px) {
  .video-block--responsive .video-frame--desktop { display: none; }
  .video-block--responsive .video-frame--mobile { display: block; }
}
.mql5-ea-widgets {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1rem;
  max-width: 920px;
  margin: 0 auto;
}
.mql5-ea-widget-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .7rem;
  padding: 1.05rem 1rem;
  border: 1px solid var(--color-line);
  border-radius: 1rem;
  background: rgba(15, 32, 53, .55);
  text-decoration: none;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
.mql5-ea-widget-link:hover,
.mql5-ea-widget-link:focus-visible {
  border-color: rgba(102, 227, 255, .35);
  background: rgba(46, 167, 255, .08);
  transform: translateY(-2px);
  outline: none;
}
.mql5-ea-widget-img {
  display: block;
  width: 100%;
  max-width: 400px;
  height: auto;
  border-radius: .45rem;
}
.mql5-ea-widget-meta {
  color: var(--color-muted);
  font-size: .72rem;
  font-weight: 720;
  letter-spacing: .02em;
}

.auth-switch a { color: var(--color-cyan); font-weight: 740; }
.auth-security { display: flex; align-items: flex-start; gap: .55rem; margin-top: 1rem; padding: .75rem; border: 1px solid rgba(102,227,255,.12); border-radius: .75rem; background: rgba(46,167,255,.05); color: var(--color-muted); font-size: .68rem; }
.auth-security img { width: 1.25rem; height: 1.25rem; flex: 0 0 auto; }
.form-message { display: none; padding: .7rem .8rem; border-radius: .7rem; font-size: .72rem; }
.form-message.is-visible { display: block; }
.form-message[hidden] { display: none !important; }
.form-message.is-success { color: #c8ffeb; background: rgba(65,211,158,.1); border: 1px solid rgba(65,211,158,.2); }
.form-message.is-error { color: #ffe0d9; background: rgba(255,116,88,.09); border: 1px solid rgba(255,116,88,.2); }

/* CTA and footer */
.final-cta { position: relative; overflow: hidden; padding: clamp(3rem,6vw,5rem) 0; }
.final-cta::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 20% 50%, rgba(46,167,255,.16), transparent 25rem), radial-gradient(circle at 85% 40%, rgba(65,211,158,.1), transparent 24rem); }
.final-cta-shell { position: relative; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 2rem; padding: clamp(1.5rem,4vw,3rem); border: 1px solid rgba(102,227,255,.2); border-radius: 1.5rem; background: linear-gradient(135deg, rgba(20,41,67,.9), rgba(8,21,36,.94)); box-shadow: var(--shadow-lg); }
.final-cta h2 { margin: 0; font-size: clamp(2rem,4vw,3.4rem); line-height: 1.05; letter-spacing: -.04em; }
.final-cta p { max-width: 58ch; margin: .7rem 0 0; color: var(--color-muted); }
.final-cta-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .7rem; }
.final-cta-actions small { flex-basis: 100%; color: var(--color-muted-2); text-align: right; font-size: .68rem; }
.site-footer { border-top: 1px solid var(--color-line); background: var(--color-bg-deep); }
.footer-main { display: grid; grid-template-columns: 1.4fr repeat(4,1fr); gap: 2rem; padding: 3.5rem 0 2.5rem; }
.footer-brand img { width: 210px; }
.footer-brand p { max-width: 34ch; color: var(--color-muted); font-size: .82rem; }
.footer-trust { display: inline-flex; align-items: center; gap: .55rem; margin-top: .65rem; padding: .45rem .65rem; border: 1px solid var(--color-line); border-radius: .65rem; background: rgba(15,32,53,.45); color: inherit; text-decoration: none; cursor: pointer; transition: border-color .2s ease, background .2s ease; }
.footer-trust:hover,
.footer-trust:focus-visible { border-color: rgba(102,227,255,.35); background: rgba(46,167,255,.08); outline: none; }
.footer-trust span { color: var(--color-warning); font-size: .72rem; letter-spacing: .05em; }
.footer-trust strong { font-size: .68rem; color: inherit; }
.footer-column h3 { margin: 0 0 .7rem; font-size: .78rem; }
.footer-column a { display: block; padding: .3rem 0; color: var(--color-muted); font-size: .75rem; }
.footer-column a:hover { color: var(--color-cyan); }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.2rem 0 1.5rem; border-top: 1px solid var(--color-line); color: var(--color-muted-2); font-size: .68rem; }

/* Reveal states */
.js [data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity .65s ease, transform .65s ease; }
.js [data-reveal].is-visible { opacity: 1; transform: none; }
