/* Manual vs. algorithmic trading. Approved kit scenes; all layout and copy are DOM. */
.trading-comparison {
  --compare-bg:#061525;--compare-card-bg:#0b1c30;--compare-card-border:rgba(139,179,208,.16);
  --compare-white:#f8fbff;--compare-muted:#9ebfe6;--compare-muted-dark:#6f98c6;--compare-green:#00e7a0;--compare-red:#ff4b64;
  background:radial-gradient(ellipse at 50% 65%,rgba(21,55,84,.1),transparent 72%),var(--compare-bg);color:var(--compare-white);
}
.trading-comparison-container { width:100%;max-width:1180px;margin:0 auto;padding:0 24px; }
.trading-comparison-header { text-align:center;margin-bottom:18px; }
.trading-comparison-header h2 { margin:0 0 18px;font-size:clamp(32px,2.65vw,46px);font-weight:800;line-height:1.2;letter-spacing:-.035em; }
.trading-comparison-header h2 span { color:var(--compare-green); }
body.site-page .trading-comparison-header p { color:var(--compare-muted);font-size:17px;line-height:1.55;margin:0; }
.trading-comparison-grid { display:grid;grid-template-columns:minmax(0,1fr) 76px minmax(0,1fr);gap:16px;align-items:stretch; }
.trading-comparison-card { --compare-accent:var(--compare-green);min-width:0;border:1px solid var(--compare-card-border);border-radius:20px;background:linear-gradient(135deg,#0a1a2b,var(--compare-card-bg));overflow:hidden;box-shadow:0 16px 40px rgba(0,0,0,.12);display:flex;flex-direction:column; }
.trading-comparison-card--manual { --compare-accent:var(--compare-red); }
.trading-comparison-card-heading { position:relative;z-index:1;padding:18px 35px 24px; }
.trading-comparison-labels { display:flex;align-items:center;gap:32px;margin-bottom:12px;color:var(--compare-accent); }
.trading-comparison-number { display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--compare-accent);border-radius:50%;font-size:18px;font-weight:700;flex-shrink:0; }
.trading-comparison-pill { display:inline-flex;align-items:center;min-height:34px;padding:5px 14px;border:1px solid color-mix(in srgb,var(--compare-accent) 38%,transparent);border-radius:14px;background:color-mix(in srgb,var(--compare-accent) 10%,transparent);color:var(--compare-accent);font-size:13px;font-weight:700; }
.trading-comparison-card h3 { margin:0 0 8px;font-size:27px;line-height:1.2;letter-spacing:-.025em;color:var(--compare-white); }
body.site-page .trading-comparison-card-heading>p { max-width:47ch;margin:0;color:var(--compare-muted);font-size:16px;line-height:1.4;min-height:2.8em; }
.trading-comparison-scene { display:block;margin-top:auto; }
.trading-comparison-scene img { display:block;width:100%;height:auto; }
.trading-comparison-transition { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:var(--compare-muted-dark);text-align:center;font-size:12px;line-height:1.45;padding-top:36px; }
.trading-comparison-transition svg { width:52px;height:26px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round; }
/* Clean kit scenes at every size; labels are real cards below each image. */
.trading-comparison-benefits { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;padding:18px 20px 22px;margin:0;list-style:none; }
.trading-comparison-benefits li { display:flex;align-items:center;gap:8px;min-width:0;min-height:76px;padding:10px;border:1px solid color-mix(in srgb,var(--compare-accent) 25%,transparent);border-radius:9px;background:color-mix(in srgb,var(--compare-accent) 5%,transparent);color:var(--compare-muted);font-size:14px;font-weight:700;line-height:1.5; }
.trading-comparison-benefits li::before { content:'';width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:var(--compare-accent); }
.trading-comparison-banner { display:flex;align-items:center;gap:32px;min-height:102px;margin-top:24px;padding:24px 34px;border:1px solid var(--compare-card-border);border-left:3px solid var(--compare-green);border-radius:18px;background:linear-gradient(110deg,rgba(13,34,52,.4),rgba(13,30,47,.65)); }
.trading-comparison-banner>svg { width:38px;height:42px;flex:0 0 38px;fill:none;stroke:var(--compare-green);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
.trading-comparison-banner strong { display:block;color:var(--compare-white);font-size:15px;line-height:1.55;font-weight:700; }
body.site-page .trading-comparison-banner p { color:var(--compare-muted-dark);font-size:14px;line-height:1.6;margin:6px 0 0; }
.trading-comparison-cta-row { text-align:center;margin-top:22px; }
.trading-comparison-cta { display:inline-flex;justify-content:center;align-items:center;gap:10px;min-height:52px;padding:13px 42px;border:1px solid var(--compare-green);border-radius:14px;color:var(--compare-green);font-size:15px;line-height:1.5;font-weight:700;background:transparent;transition:background .2s,box-shadow .2s; }
.trading-comparison-cta svg { width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
.trading-comparison-cta:hover { color:var(--compare-green);background:rgba(0,231,160,.07);box-shadow:0 0 24px rgba(0,231,160,.12); }
.trading-comparison-cta:focus-visible { outline:3px solid var(--compare-green);outline-offset:5px; }
@media(max-width:1179px) {
  .trading-comparison-grid { grid-template-columns:1fr;gap:22px; }
  .trading-comparison-transition { padding:0;gap:10px; }
  .trading-comparison-transition svg { transform:rotate(90deg);width:36px;height:36px; }
  .trading-comparison-transition span br { display:none; }
  .trading-comparison-transition span { max-width:none;word-spacing:2px; }
  .trading-comparison-banner { gap:20px;padding:22px; }
}
@media(max-width:640px) {
  .trading-comparison-container { padding:0 16px; }
  .trading-comparison-header { margin-bottom:28px; }
  .trading-comparison-header h2 { font-size:clamp(28px,7.5vw,34px);line-height:1.15;margin-bottom:18px; }
  body.site-page .trading-comparison-header p { font-size:14px;line-height:1.65; }
  body.site-page .trading-comparison-header p+p { margin-top:8px; }
  .trading-comparison-card-heading { padding:20px 20px 20px; }
  .trading-comparison-labels { gap:18px;margin-bottom:16px; }
  .trading-comparison-card h3 { font-size:23px;line-height:1.2; }
  body.site-page .trading-comparison-card-heading>p { font-size:14px;line-height:1.6;min-height:0; }
  .trading-comparison-scene img { aspect-ratio:495/368;object-fit:contain; }
  .trading-comparison-benefits { grid-template-columns:1fr;padding:16px 20px 22px; }
  .trading-comparison-benefits li { min-height:40px;padding:9px 12px;gap:10px; }
  .trading-comparison-banner { align-items:flex-start;gap:14px;padding:20px 16px; }
  .trading-comparison-banner>svg { width:28px;height:32px;flex-basis:28px; }
  .trading-comparison-banner strong { font-size:13px; }
  body.site-page .trading-comparison-banner p { font-size:12px; }
  .trading-comparison-cta { width:100%;padding:14px 12px;font-size:14px; }
}
@media(prefers-reduced-motion:reduce) { .trading-comparison-cta { transition:none; } }
/* Tablet: keep the comparison compact instead of stretching each image full width. */
@media(min-width:768px) and (max-width:1179px) {
 .trading-comparison-grid { grid-template-columns:minmax(0,1fr) 54px minmax(0,1fr);gap:10px; }
 .trading-comparison-header h2 { font-size:clamp(28px,3.1vw,36px); }
 body.site-page .trading-comparison-header p { font-size:15px; }
 .trading-comparison-card-heading { padding:18px 20px 22px; }
 .trading-comparison-card h3 { font-size:22px; }
 body.site-page .trading-comparison-card-heading>p { font-size:14px;line-height:1.5; }
 .trading-comparison-labels { gap:12px; }
 .trading-comparison-number { width:30px;height:30px;font-size:16px; }
 .trading-comparison-pill { font-size:11px;padding:5px 10px; }
 .trading-comparison-transition { gap:10px;padding-top:30px; }
 .trading-comparison-transition svg { width:40px;height:24px;transform:none; }
 .trading-comparison-transition span { font-size:10px;line-height:1.5;word-spacing:normal; }
 .trading-comparison-transition span br { display:initial; }
 .trading-comparison-benefits { grid-template-columns:1fr;padding:14px 16px 18px;gap:8px; }
 .trading-comparison-benefits li { min-height:42px;padding:9px 10px;font-size:13px; }
}
/* Space between the comparison heading and the cards after removing the subtitle. */
.trading-comparison-header { margin-bottom:48px; }
.trading-comparison-header h2 { margin-bottom:0; }
@media(max-width:1179px) { .trading-comparison-header { margin-bottom:36px; } }
@media(max-width:640px) { .trading-comparison-header { margin-bottom:32px; } }