/* Lower page: signal flow diagram, copy-trading risk sheet, ground rules, FAQ, contact. */

/* signal flow */
.flow { --g: 16px; max-width: 860px; margin: 0 auto; display: flex; flex-direction: column; }
.fbox {
  display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center;
  padding: 18px 20px; border-radius: 12px; background: var(--card); border: 1px solid var(--border);
}
.fbox b { font: 500 21px/1.25 'Oswald', sans-serif; letter-spacing: .02em; }
.fbox span { font-size: 14.5px; line-height: 1.45; color: var(--muted); }
.fbox.bot { border-color: var(--gold); background: linear-gradient(180deg, rgba(224, 182, 70, .1), rgba(224, 182, 70, .02)); }
.fbox.bot b { color: var(--gold); }
.fbox.dashed { border: 1px dashed #8a918a; background: transparent; }
.fbox.client { background: var(--gold); border-color: var(--gold); }
.fbox.client b, .fbox.client span { color: #1a1505; }
.fcols { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--g); }
.wire { position: relative; height: 44px; }
.wire i { position: absolute; display: block; }
.wire .v { width: 2px; background: var(--gold); }
.wire .h { height: 2px; background: var(--gold); top: calc(50% - 1px); }
.wire .dash { background: none; border-left: 2px dashed #8a918a; }
.wire .h.dash { border-left: 0; border-top: 2px dashed #8a918a; }
.wire .arrow::after {
  content: ""; position: absolute; left: -6px; bottom: -2px; border: 7px solid transparent; border-bottom: 0;
  border-top: 9px solid var(--gold);
}
.wire .arrow.dash::after { left: -8px; border-top-color: #8a918a; }
.c1 { left: calc((100% - 2 * var(--g)) / 6 - 1px); }
.c2 { left: calc(50% - 1px); }
.c3 { left: calc(100% - (100% - 2 * var(--g)) / 6 - 1px); }
.top-half { top: 0; height: 50%; }
.bot-half { top: 50%; height: 50%; }
.full { top: 0; height: 100%; }
.span-l { left: calc((100% - 2 * var(--g)) / 6); width: calc(50% - (100% - 2 * var(--g)) / 6); }
.span-r { left: 50%; width: calc(50% - (100% - 2 * var(--g)) / 6); }
.flow-foot { display: grid; grid-template-columns: 1fr auto; gap: 16px 24px; align-items: center; margin-top: 28px; }
.log { display: flex; gap: 16px; align-items: flex-start; padding: 20px 22px; border-radius: 12px; background: var(--bg3); border: 1px solid var(--border); }
.log .icon { font-size: 26px; color: var(--gold); margin-top: 2px; }
.log p { font-size: 15.5px; color: var(--soft); }
.legend { display: flex; flex-direction: column; gap: 8px; font-size: 13.5px; color: var(--muted); }
.legend span { display: flex; align-items: center; gap: 10px; }
.legend i { width: 28px; height: 0; border-top: 2px solid var(--gold); }
.legend i.dash { border-top: 2px dashed #8a918a; }
.fb-note { margin-top: 20px; font-size: 14.5px; color: var(--muted); max-width: 70ch; }
@media (max-width: 640px) {
  .fbox { padding: 14px 10px; }
  .fbox b { font-size: 18px; }
  .fbox span { font-size: 13px; }
  .flow { --g: 8px; }
  .flow-foot { grid-template-columns: 1fr; }
}

/* copy trading risk sheet */
.risk-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; }
.risk-grid .head { margin-bottom: 0; }
.risk-grid .head p { color: var(--soft); }
.sheet { border-radius: var(--radius); border: 1px solid var(--border); background: var(--card); overflow: hidden; }
.sheet-head { display: flex; align-items: center; gap: 12px; padding: 18px 24px; background: var(--green-dk); font: 500 20px 'Oswald', sans-serif; letter-spacing: .04em; text-transform: uppercase; }
.sheet-head .icon { color: var(--gold); font-size: 22px; }
.sheet dl { display: grid; grid-template-columns: auto 1fr; }
.sheet dt, .sheet dd { padding: 14px 24px; border-top: 1px solid var(--border); font-size: 15.5px; }
.sheet dt { color: var(--muted); }
.sheet dd { color: var(--text); font-weight: 600; text-align: right; }
.sheet dd.warn { color: var(--gold); }
@media (max-width: 860px) { .risk-grid { grid-template-columns: 1fr; gap: 36px; } }
@media (max-width: 520px) {
  .sheet dl { grid-template-columns: 1fr; }
  .sheet dt { padding: 12px 18px 2px; }
  .sheet dd { padding: 0 18px 12px; border-top: 0; text-align: left; }
}

/* ground rules */
.rules { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.rule { display: flex; flex-direction: column; gap: 14px; padding: 32px 28px; border-radius: var(--radius); background: var(--card); border: 1px solid var(--border); border-top: 3px solid var(--gold); }
.rule .icon { font-size: 34px; color: var(--gold); }
.rule p { color: var(--soft); }
@media (max-width: 860px) { .rules { grid-template-columns: 1fr; } }

/* FAQ */
.faq { max-width: 860px; }
.faq details { border-bottom: 1px solid var(--border); }
.faq summary {
  display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px 0; cursor: pointer;
  font: 500 21px/1.3 'Oswald', sans-serif; letter-spacing: .01em; list-style: none;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; flex: none; width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--border); color: var(--gold); display: flex; align-items: center; justify-content: center; font: 400 22px/1 'Public Sans', sans-serif; transition: transform .2s; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { padding: 0 52px 24px 0; color: var(--soft); }
@media (max-width: 640px) { .faq details p { padding-right: 0; } .faq summary { font-size: 19px; } }

/* contact */
.contact { position: relative; text-align: center; overflow: hidden; }
.contact::before {
  content: ""; position: absolute; left: 50%; top: 50%; width: 760px; height: 760px; transform: translate(-50%, -50%);
  background: radial-gradient(circle, rgba(224, 182, 70, .14), transparent 60%); pointer-events: none;
}
.contact .wrap { position: relative; display: flex; flex-direction: column; align-items: center; gap: 22px; }
.contact img { width: 72px; }
.contact .lede { margin: 0 auto; }
.contact .btns { justify-content: center; }
