/*
 * Prop firms (/prop-firm-trading/): page CSS for templates/prop.php, loaded after site.css (PA_Seo page_css).
 * Mobile first, kit tokens only. No figures here; the record's styling (pa-stat, pa-ledger) is never used for the
 * planner's own arithmetic. Amber stays the Gold market's hue: it is not used on this page.
 */

/* hero: the copy, then (from 1024 px, beside it) the record's proof card, lit by Jim's glass prism */
.pa-pp-hero .pa-hero__h1 { font-size: clamp(2.1rem, 1.2rem + 3.8vw, 4.4rem); }
.pa-pp-hero .pa-hero__h1 > span { display: block; }
.pa-pp-hero .pa-hero__lede { margin-top: 18px; }
.pa-pp-rec { position: relative; margin-top: 44px; }
.pa-pp-glass { position: absolute; z-index: 1; top: -40px; right: 14px; width: 84px; height: auto; pointer-events: none; background: radial-gradient(closest-side, rgba(106, 162, 255, .35), transparent); filter: drop-shadow(0 14px 26px rgba(60, 211, 238, .35)); }
.pa-pp-proof { --pa-mono: var(--pa-font); gap: 14px; box-shadow: var(--pa-shadow), 0 50px 120px -50px rgba(60, 211, 238, .45); }
.pa-pp-proof .pa-proof__head { padding-right: 76px; }
.pa-pp-rech { align-items: flex-start; }
.pa-pp-rech::before { margin-top: .2em; }
.pa-pp-acct { display: block; margin-top: 3px; color: var(--pa-text-2); }
.pa-pp-proof .pa-stat__value { font-weight: 700; }
.pa-pp-proof .pa-spark { height: clamp(84px, 9vw, 116px); }
.pa-pp-proof .pa-spark-line { stroke-width: 2.5; filter: drop-shadow(0 0 6px rgba(60, 211, 238, .55)); }
.pa-pp-proof .pa-proof__curve .pa-note { margin-top: 8px; }
@media (min-width: 600px) { .pa-pp-glass { top: -52px; right: 20px; width: 124px; } .pa-pp-proof .pa-proof__head { padding-right: 112px; } }
@media (min-width: 1024px) {
	.pa-pp-hero { padding-top: clamp(28px, 3vw, 48px); }
	.pa-pp-hero .pa-hero__top { align-items: center; }
	.pa-pp-rec { margin-top: 40px; }
}

/* why: a centered head, "Risk, by design" as a divider, four icon features (not cards) */
.pa-pp-why__h { display: flex; align-items: center; gap: 16px; font: 650 var(--pa-fs-xs)/1.2 var(--pa-font) !important; letter-spacing: .14em; text-transform: uppercase; color: var(--pa-text-2); margin-bottom: clamp(24px, 3vw, 36px) !important; }
.pa-pp-why__h::before, .pa-pp-why__h::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--pa-line-strong)); }
.pa-pp-why__h::after { background: linear-gradient(90deg, var(--pa-line-strong), transparent); }
.pa-pp-feats { display: grid; gap: 26px; margin: 0; padding: 0; list-style: none; }
.pa-pp-feats li { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 4px 16px; align-content: start; color: var(--pa-text-2); font-size: var(--pa-fs-sm); }
.pa-pp-feats h4 { margin: 0; line-height: 1.25; }
.pa-pp-ic { grid-row: span 2; display: grid; place-items: center; width: 52px; height: 52px; border: 1px solid transparent; border-radius: 16px; background: linear-gradient(160deg, #16264a, var(--pa-ink-1)) padding-box, var(--pa-spectrum) border-box; color: var(--pa-lit); box-shadow: 0 16px 40px -18px rgba(60, 211, 238, .6); }
.pa-pp-ic svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
@media (min-width: 600px) {
	.pa-pp-feats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 32px; }
	.pa-pp-feats li { grid-template-columns: none; gap: 10px; }
	.pa-pp-ic { grid-row: auto; width: 60px; height: 60px; margin-bottom: 6px; border-radius: 18px; }
	.pa-pp-ic svg { width: 30px; height: 30px; }
}
@media (min-width: 1024px) {
	.pa-pp-feats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
	.pa-pp-feats li { justify-items: center; padding: 4px 26px; text-align: center; }
	.pa-pp-feats li + li { border-left: 1px solid var(--pa-line); }
}

/* two columns from 900 px: a head beside a visual */
.pa-pp-split { display: grid; gap: 28px; }
.pa-pp-br > .pa-h2-2 { display: block; text-wrap: balance; }
.pa-pp-mode .pa-head > p:not([class]) { color: var(--pa-text-2); }
@media (min-width: 900px) {
	.pa-pp-split { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 56px; align-items: center; }
	.pa-pp-split > .pa-head { margin-bottom: 0; }
}

/* Prop Firm mode: one more block for each $10,000 bracket (decoration; the words say it) */
.pa-pp-stairs { margin: 0; padding: clamp(18px, 3vw, 30px); border-radius: var(--pa-r-3); border: 1px solid var(--pa-card-line); background: radial-gradient(90% 70% at 80% 0%, rgba(106, 162, 255, .13), transparent 70%), var(--pa-card-bg); box-shadow: var(--pa-elev); }
.pa-pp-stairs__k { font: 650 var(--pa-fs-xs)/1.2 var(--pa-font); letter-spacing: .12em; text-transform: uppercase; color: var(--pa-lit); }
.pa-pp-stairs__plot { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(6px, 1.4vw, 14px); align-items: end; margin: 18px 0 14px; }
.pa-pp-stairs__col { display: flex; flex-direction: column; gap: 5px; }
.pa-pp-stairs i { display: block; height: clamp(22px, 3.2vw, 34px); border: 1px solid rgba(60, 211, 238, .32); border-radius: 7px; background: linear-gradient(180deg, rgba(60, 211, 238, .34), rgba(60, 211, 238, .1)); }
.pa-pp-stairs i:first-child { border-color: var(--pa-fx); background: linear-gradient(180deg, rgba(60, 211, 238, .7), rgba(62, 224, 127, .28)); box-shadow: 0 0 22px -4px rgba(60, 211, 238, .6); }
.pa-pp-stairs__col span { min-height: calc(2.4em + 8px); margin-top: 5px; padding-top: 8px; border-top: 1px solid var(--pa-line-strong); font: 500 var(--pa-fs-xs)/1.2 var(--pa-font); color: var(--pa-text-2); text-align: center; }
.pa-pp-stairs__col--more i, .pa-pp-stairs__col--more i:first-child { border: 1px dashed rgba(60, 211, 238, .3); background: rgba(60, 211, 238, .05); box-shadow: none; }
@media (min-width: 600px) { .pa-pp-stairs__col span { min-height: 0; } }
@media (prefers-reduced-motion: no-preference) {
	.pa-js .pa-pp-stairs i { opacity: 0; transform: translateY(10px); transition: opacity .45s var(--pa-ease), transform .45s var(--pa-ease); transition-delay: calc(var(--i) * 110ms + 120ms); animation: pa-failsafe 0s 3s forwards; }
	.pa-js .pa-pp-stairs.is-in i { opacity: 1; transform: none; animation: none; }
	.pa-io .pa-pp-stairs:not(.is-in) i { animation: none; }
}

/* the planner: the form, then (from 1024 px, beside it) the checklist */
.pa-pl { display: grid; gap: 16px; }
.pa-pl__card { position: relative; display: grid; gap: 18px; align-content: start; min-width: 0; padding: clamp(18px, 2.6vw, 28px); border: 1px solid var(--pa-card-line); border-radius: var(--pa-r-3); background: var(--pa-card-bg); box-shadow: var(--pa-elev); }
.pa-pl__out { overflow: hidden; border-color: rgba(60, 211, 238, .4); }
.pa-pl__out::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: var(--pa-spectrum); }
.pa-pl__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; }
.pa-pl__f { display: flex; flex-direction: column; justify-content: flex-end; gap: 7px; min-width: 0; }
.pa-pl__f--w, .pa-pl__f--pw { grid-column: 1 / -1; }
@media (min-width: 600px) { .pa-pl__f--pw { grid-column: auto; } }
.pa-pl__f label { font: 650 var(--pa-fs-xs)/1.2 var(--pa-font); letter-spacing: .1em; text-transform: uppercase; color: var(--pa-text-2); }
.pa-pl__sel { position: relative; display: block; }
.pa-pl__sel::after { content: ""; position: absolute; right: 16px; top: 50%; width: 8px; height: 8px; margin-top: -6px; border-right: 2px solid var(--pa-text-2); border-bottom: 2px solid var(--pa-text-2); transform: rotate(45deg); pointer-events: none; }
.pa-pl select { -webkit-appearance: none; appearance: none; display: block; width: 100%; min-height: 48px; margin: 0; padding: 0 36px 0 14px; border: 1px solid var(--pa-line-strong); border-radius: 12px; background: var(--pa-ink-1); color: var(--pa-text); font: 500 var(--pa-fs-sm)/1.2 var(--pa-font); text-overflow: ellipsis; cursor: pointer; }
.pa-pl select:hover { border-color: var(--pa-text-2); }
.pa-pl option { background: var(--pa-ink-1); color: var(--pa-text); }
.pa-pl__go { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 22px; }
.pa-pl__ctx { justify-self: start; padding: 6px 12px; border: 1px solid var(--pa-line-strong); border-radius: 12px; font-size: var(--pa-fs-xs); color: var(--pa-text-2); }
.pa-pl__room { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pa-pl__room > div { grid-template-columns: none !important; align-content: start; gap: 6px !important; padding: 12px; border: 1px solid var(--pa-line); border-radius: 14px; background: rgba(5, 8, 15, .4); }
.pa-pl__room dd b { font-weight: 650; }
.pa-pl__room > div:last-child { grid-column: 1 / -1; }
.pa-pl__room dd span { display: block; margin-top: 2px; font-size: var(--pa-fs-xs); color: var(--pa-text-3); }
.pa-pl__list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; counter-reset: pa-pl; font-size: var(--pa-fs-sm); color: var(--pa-text-2); }
.pa-pl__list li { position: relative; padding-left: 36px; counter-increment: pa-pl; }
.pa-pl__list b { color: var(--pa-text); font-weight: 650; }
.pa-pl__list li::before { content: counter(pa-pl, decimal-leading-zero); position: absolute; left: 0; top: .1em; font: 600 var(--pa-fs-xs)/1.5 var(--pa-mono); color: var(--pa-fx); }
.pa-pl__next { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; padding-top: 18px; border-top: 1px solid var(--pa-line); }
.pa-pl__next .pa-note { flex: 1 1 14em; }
@media (max-width: 599px) {
	.pa-pl__ctx { display: none; }
	/* "Max drawdown" wraps in a half-width tile: both labels take two lines' room, so the amounts stay level */
	.pa-pl__room > div:not(:last-child) dt { display: flex; align-items: flex-end; min-height: 2.4em; }
}
@media (min-width: 600px) { .pa-pl__room > div { padding: 14px 16px; } }
@media (min-width: 1024px) {
	.pa-pl { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 24px; align-items: start; }
	.pa-pl > form { position: sticky; top: calc(var(--pa-header-h) + 20px); }
	/* the sticky form's green button is in view here: this one steps down to the line style (one green per view) */
	.pa-pl__buy, .pa-pl__buy:visited { border-color: var(--pa-go); color: var(--pa-go); background: transparent; box-shadow: none; }
	.pa-pl__buy:hover, .pa-pl__buy:focus { border-color: var(--pa-go); color: var(--pa-go); background: rgba(62, 224, 127, .1); box-shadow: none; }
}

/* one license for every phase: account slots as lit squares */
.pa-pp-slots { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.pa-pp-slot { position: relative; display: grid; gap: 14px; align-content: start; padding: clamp(18px, 2.4vw, 26px); border: 1px solid var(--pa-card-line); border-radius: var(--pa-r-3); background: var(--pa-card-bg); box-shadow: var(--pa-elev); overflow: hidden; }
.pa-pp-slot--hi { border-color: rgba(60, 211, 238, .5); }
.pa-pp-slot--hi::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: var(--pa-spectrum); }
.pa-pp-slot__top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.pa-pp-slot__top b { font-size: var(--pa-fs-h3); font-weight: 650; letter-spacing: -.02em; }
.pa-pp-slot__n { display: flex; align-items: baseline; gap: 12px; font-size: var(--pa-fs-sm); color: var(--pa-text-2); }
.pa-pp-slot__n b { font: 700 clamp(3rem, 2.3rem + 2.6vw, 4.25rem)/1 var(--pa-font); letter-spacing: -.04em; color: var(--pa-text); }
.pa-pp-slot__dots { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.pa-pp-slot__dots i { height: 12px; border: 1px dashed var(--pa-line-strong); border-radius: 4px; }
.pa-pp-slot__dots .is-on { border: 0; background: linear-gradient(90deg, var(--pa-fx), #6fe3c1); box-shadow: 0 0 14px -2px rgba(60, 211, 238, .6); }
.pa-pp-slot__price { display: flex; align-items: baseline; gap: 8px; font-size: var(--pa-fs-sm); color: var(--pa-text-3); }
.pa-pp-slot__price b { font: 700 var(--pa-fs-h3)/1 var(--pa-font); letter-spacing: -.02em; color: var(--pa-text); }
.pa-pp-slot__ch { padding-top: 12px; border-top: 1px solid var(--pa-line); font-size: var(--pa-fs-sm); color: var(--pa-text-2); }
.pa-pp-slots__more { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin-top: 18px !important; color: var(--pa-text-2); }
@media (min-width: 768px) { .pa-pp-slots { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }

/* the one prop-firm review, larger */
.pa-pp-quote .pa-rev { padding: clamp(22px, 3vw, 34px); border-radius: var(--pa-r-3); }
.pa-pp-quote .pa-rev__q { font-size: var(--pa-fs-lg); line-height: 1.55; }
.pa-pp-quote .pa-rev__q::before { content: "\201C"; display: block; height: .5em; font: 700 4.5rem/1 var(--pa-font); color: var(--pa-fx); }
.pa-pp-rev .pa-head > p:last-child { margin-top: -4px; }

.pa-closer .pa-note { max-width: 72ch; }