/* SwiftRamp framed layout. Palette and type stay the brand's; only the structure changes. */
:root{--frame:1240px;--cell:clamp(24px,4.4vw,64px)}
#main-page.shell{width:100%;max-width:none;margin:0}
[hidden]{display:none!important}

.risk-bar{padding:9px 16px;background:var(--panel);border-bottom:1px solid var(--line);color:var(--muted);font-size:.8125rem;line-height:1.45;text-align:center}
.risk-bar a{color:var(--accent);text-underline-offset:3px}

header{position:sticky;top:0;z-index:50;height:68px;margin:0;gap:44px;justify-content:flex-start;padding:0 max(24px,calc((100% - var(--frame))/2));border:0;border-radius:0;background:rgba(8,11,18,.84);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.editorial-nav{gap:30px}
.editorial-nav a{font-size:.875rem;font-weight:500}
.topnav{margin-left:auto;gap:8px}
.nav-pill{height:38px;padding:0 18px;border:1px solid var(--line);border-radius:8px;font-size:.875rem;font-weight:550}

/* Open layout: only figures + assets, and the feature block, are framed. */
main{position:relative;width:min(var(--frame),calc(100% - 48px));margin:36px auto 0;padding:0;gap:0;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch;min-height:0}
.stats,.market-section,.platform,.workflow,.payout-editorial,.home-faq,.last-call{position:relative;grid-column:1/-1;margin:0}
.market-section::before,.platform-body::before{content:"";position:absolute;left:-4px;right:-4px;bottom:-4px;height:7px;z-index:2;pointer-events:none;background:linear-gradient(var(--accent),var(--accent)) 0 0/7px 7px no-repeat,linear-gradient(var(--accent),var(--accent)) 100% 0/7px 7px no-repeat}
.stats::before{content:"";position:absolute;inset:-4px;z-index:2;pointer-events:none;background:linear-gradient(var(--accent),var(--accent)) 0 0/7px 7px no-repeat,linear-gradient(var(--accent),var(--accent)) 100% 0/7px 7px no-repeat,linear-gradient(var(--accent),var(--accent)) 0 100%/7px 7px no-repeat,linear-gradient(var(--accent),var(--accent)) 100% 100%/7px 7px no-repeat}

/* Hero: the form must be usable from the first paint, so no entrance animation here. */
.intro,.card{animation:none}
.intro{display:flex;flex-direction:column;justify-content:center;padding:clamp(48px,6vw,88px) var(--cell)}
.intro::after{display:none}
.intro-eyebrow{margin-bottom:26px;font-size:.75rem}
.intro h1{font-size:clamp(2.9rem,5vw,4.5rem);font-weight:500;letter-spacing:-.04em;line-height:1.06}
.intro p{max-width:40ch;margin:24px 0 0;font-size:1.0625rem;line-height:1.65}
.intro-actions{margin:32px 0 0}
.intro-actions .intro-primary{display:none}
.intro-primary{min-height:46px;font-size:.9375rem;font-weight:600}
.intro-secondary{min-height:46px;padding:0 18px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--text);font-size:.9375rem;font-weight:500;transition:border-color .2s,background-color .2s}
.intro-secondary:hover{border-color:#495163;background:var(--panel-2);color:var(--text)}
.proof{margin-top:32px;gap:18px}
.proof>span{font-size:.875rem}
.card{align-self:center;margin:clamp(16px,2.4vw,32px);border-radius:14px;box-shadow:0 0 130px rgba(152,241,91,.075),0 24px 70px rgba(0,0,0,.35)}

/* Figures */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;border:1px solid var(--line);background:var(--line)}
.stat{padding:clamp(28px,3.4vw,44px) 16px;background:var(--bg);text-align:center}
.stat span{display:block;color:var(--muted);font-size:.9375rem}
.stat strong{display:block;margin-top:10px;font-size:clamp(2rem,3.2vw,2.75rem);font-weight:500;letter-spacing:-.03em;line-height:1.1;font-variant-numeric:tabular-nums}

/* Shared headings */
.section-kicker{margin-bottom:18px;font-size:.75rem}
.market-title h2,.platform-head h2,.workflow h2,.payout-heading h2,.home-faq h2{margin:0;font-size:clamp(2.1rem,3.8vw,3.25rem);font-weight:500;letter-spacing:-.035em;line-height:1.12}

.market-title h2,.last-call h2,.page-hero h1{text-wrap:balance}

/* Assets */
.market-section{padding:0;border:1px solid var(--line);border-top:0}
.market-title{flex-direction:column;align-items:center;gap:14px;margin:0;padding:clamp(56px,6.5vw,88px) var(--cell);text-align:center}
.market-title .section-kicker{margin:0 0 16px}
.market-title>span{font-size:.9375rem}
.market-grid{gap:1px;border:0;border-top:1px solid var(--line);border-radius:0;background:var(--line)}
.market-grid .market-tile:nth-child(n){border:0;background:var(--bg);padding:26px 22px;transition:background-color .2s}
.market-grid .market-tile:nth-child(n):hover{background:var(--panel)}
.market-identity{gap:11px}
.market-identity b{font-size:.9375rem;font-weight:500}
.market-identity div>span{margin-top:2px;font-size:.8125rem}
.market-tile>strong{margin-top:22px;font-size:1.25rem}

/* Platform */
.platform-head{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:32px var(--cell);padding:clamp(56px,6.5vw,88px) var(--cell)}
.platform-head p{max-width:42ch;margin:0 0 24px;color:var(--muted);font-size:1.0625rem;line-height:1.65}
.platform-body{position:relative;display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line)}
.feature-cells{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border-right:1px solid var(--line)}
.feature-cell{padding:clamp(28px,3.4vw,44px) clamp(22px,2.8vw,40px);background:var(--bg)}
.feature-cell svg{display:block;color:var(--accent)}
.feature-cell h3{margin:22px 0 10px;font-size:1.1875rem;font-weight:500;letter-spacing:-.015em}
.feature-cell p{margin:0;color:var(--muted);font-size:.9375rem;line-height:1.6}

.device-stage{position:relative;display:flex;align-items:center;justify-content:center;min-height:600px;overflow:hidden;background:radial-gradient(closest-side,rgba(152,241,91,.09),transparent)}
.device{position:absolute;top:50%;left:50%;width:262px;transition:transform .5s cubic-bezier(.2,.8,.2,1),filter .4s ease,opacity .4s ease;padding:14px;border:1px solid #333b4b;border-radius:38px;background:var(--bg);box-shadow:0 30px 80px rgba(0,0,0,.5);text-align:left}
.device-front{z-index:1;transform:translate(calc(-50% - 34px),-50%)}
.device-back{z-index:0;transform:translate(calc(-50% + 156px),-50%) scale(.84);filter:blur(1.4px);opacity:.55;cursor:pointer}
.device-back:hover{filter:blur(.6px);opacity:.8}
.device-back:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.device-bar{display:flex;align-items:center;gap:7px;padding:6px 4px 14px;font-size:.8125rem;font-weight:700;letter-spacing:-.02em}
.device-tabs{display:grid;grid-template-columns:1fr 1fr;gap:3px;margin-bottom:14px;padding:3px;border:1px solid var(--line);border-radius:9px;font-size:.8125rem;font-weight:600;text-align:center;color:var(--muted)}
.device-tabs span{padding:6px;border-radius:6px}
.device-tabs .on{background:var(--panel-2);color:var(--text)}
.device-label{display:block;margin:0 0 6px;color:var(--muted);font-size:.75rem}
.device-amount{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;padding:12px;border:1px solid var(--line);border-radius:9px;background:var(--panel-2);font-size:1.5rem;font-weight:500;letter-spacing:-.03em}
.device-amount small{font-size:.75rem;font-weight:600;letter-spacing:0;color:var(--muted)}
.device-coins{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-bottom:14px;font-size:.6875rem;font-weight:600;text-align:center;color:var(--muted)}
.device-coins span{padding:7px 0;border:1px solid var(--line);border-radius:7px;background:var(--panel-2)}
.device-coins .on{border-color:var(--accent);background:rgba(152,241,91,.08);color:var(--text)}
.device-row{display:flex;justify-content:space-between;gap:10px;padding:5px 0;color:var(--muted);font-size:.75rem}
.device-row b{color:var(--text);font-weight:500}
.device-result{align-items:baseline;margin-top:4px;padding-top:10px;border-top:1px solid var(--line);color:var(--text)}
.device-result b{color:var(--accent);font-size:1.0625rem;font-weight:600;letter-spacing:-.02em}
.device-cta{margin-top:14px;padding:11px;border-radius:9px;background:var(--accent);color:var(--accent-ink);font-size:.8125rem;font-weight:650;text-align:center}
.device-note{position:absolute;right:18px;bottom:16px;z-index:2;color:var(--muted);font-size:.75rem}

/* Quote receipt + steps */
.workflow{grid-template-columns:1fr 1fr;gap:0;padding:0}
.workflow-receipt{display:flex;flex-direction:column;justify-content:center;padding:clamp(40px,5vw,72px) clamp(20px,3.6vw,52px)}
.receipt-tabs{display:flex;gap:22px;margin:0 0 16px 2px}
.receipt-tabs button{padding:4px 0;border:0;background:none;color:var(--muted);font-size:.9375rem;font-weight:500;cursor:pointer;transition:color .2s}
.receipt-tabs button:hover{color:var(--text)}
.receipt-tabs button.active{color:var(--accent)}
.receipt-panel{margin:0;padding:22px 0;list-style:none;counter-reset:line;border:1px solid var(--line);border-radius:12px;background:var(--panel);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:1rem}
.receipt-panel li{counter-increment:line;display:flex;gap:16px;padding:13px 24px}
.receipt-panel li::before{content:counter(line);width:14px;flex:none;color:#566074;text-align:right}
.receipt-panel li span{color:var(--muted)}
.receipt-panel li b{margin-left:auto;font-weight:500;text-align:right;font-variant-numeric:tabular-nums}
.receipt-panel .total b{color:var(--accent)}
.receipt-note{margin:16px 2px 0;color:var(--muted);font-size:.875rem}
.workflow-copy{padding:clamp(48px,6vw,80px) var(--cell)}
.workflow-copy>p{max-width:42ch;margin:20px 0 30px;color:var(--muted);font-size:1.0625rem;line-height:1.65}
.workflow-list li{gap:20px;padding:20px 0;border-top:1px solid var(--line)}
.workflow-list li:first-child{padding-top:20px;border-top:1px solid var(--line)}
.workflow-list li:last-child{padding-bottom:20px;border-bottom:1px solid var(--line)}
.workflow-list li>span{margin-top:3px;font-size:.875rem}
.workflow-list h3{margin:0 0 6px;font-size:1.0625rem}
.workflow-list p{max-width:none;font-size:.9375rem;line-height:1.6}
.workflow-copy>a{margin-top:28px}

/* Payouts and FAQ */
.payout-editorial,.home-faq{grid-template-columns:1fr 1fr;gap:0;padding:0}
.payout-heading,.home-faq>div:first-child{padding:clamp(48px,6vw,80px) var(--cell)}
.payout-heading p{max-width:36ch;margin:20px 0 0;font-size:1.0625rem;line-height:1.65}
.home-faq>div:first-child>h2{margin-bottom:28px}
.payout-table,.home-faq-list{padding:clamp(40px,5vw,72px) var(--cell)}
.payout-table-head{padding-right:40px;font-size:.875rem}
.payout-table>a{padding:20px 0}
.payout-table>a>span{font-size:1.0625rem}
.payout-table i{font-size:.875rem}
.home-faq-list summary{padding:20px 28px 20px 0;font-size:1rem;font-weight:500}
.home-faq-list details p{margin-bottom:20px;font-size:.9375rem;line-height:1.65}

/* Closing call */
.last-call{padding:clamp(72px,9vw,128px) var(--cell);background:radial-gradient(closest-side,rgba(152,241,91,.08),transparent)}
.last-call>span{font-size:.9375rem}
.last-call h2{margin:16px 0 30px;font-size:clamp(2.5rem,5vw,4rem);letter-spacing:-.04em}

/* Footer */
.site-footer{width:min(var(--frame),calc(100% - 48px));margin:0 auto;padding:64px 0 28px;border:0;grid-template-columns:1.55fr repeat(3,1fr);gap:40px}
.footer-brand .brand{color:var(--text)}
.footer-brand p{font-size:.9375rem;line-height:1.65}
.footer-col b{font-size:.9375rem}
.footer-col a{font-size:.9375rem;margin:12px 0}
.footer-bottom{font-size:.8125rem}

/* Scroll reveal is only armed by design.js, so content never depends on it. */
.js-reveal [data-reveal]{opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease}
.js-reveal [data-reveal].is-in{opacity:1;transform:none}

@media(max-width:1020px){
  header{gap:24px}
  .editorial-nav{display:none}
  main{grid-template-columns:minmax(0,1fr);margin-top:20px}
  .intro{padding:48px var(--cell)}
  .intro h1{font-size:clamp(2.9rem,9vw,4.5rem)}
  .intro-actions .intro-primary{display:inline-flex}
  .card{justify-self:center;width:calc(100% - 32px);max-width:560px;margin:24px auto}
  .platform-head,.platform-body,.workflow,.payout-editorial,.home-faq{grid-template-columns:minmax(0,1fr)}
  .platform-head{align-items:start}
  .feature-cells{border-right:0;border-bottom:1px solid var(--line)}
  .workflow-copy{order:-1}
  .market-grid{grid-template-columns:repeat(3,1fr)}
  .market-grid .market-tile:nth-child(n){grid-column:auto;display:block}
  .market-grid .market-tile:last-child{grid-column:span 2}
  .site-footer{grid-template-columns:1.4fr 1fr 1fr;gap:28px}
  .footer-brand,.footer-bottom{grid-column:1/-1}
}
@media(max-width:600px){
  main,.site-footer{width:calc(100% - 24px)}
  header{height:62px;padding:0 14px}
  .risk-bar{font-size:.75rem}
  .card{width:calc(100% - 20px);margin:10px auto;padding:18px 14px}
  .intro{padding:40px 22px}
  .intro h1{font-size:clamp(2.75rem,12.5vw,4rem)}
  .proof{gap:12px}
  .stats{grid-template-columns:1fr 1fr}
  .stat{padding:26px 10px}
  .stat span{font-size:.875rem}
  .market-grid{grid-template-columns:1fr 1fr}
  .market-grid .market-tile:nth-child(n){padding:20px 14px}
  .market-grid .market-tile:last-child{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between}
  .market-grid .market-tile:last-child>strong{margin:0}
  .feature-cells{grid-template-columns:minmax(0,1fr)}
  .device-stage{min-height:560px}
  .device-front{transform:translate(calc(-50% - 22px),-50%)}
  .device-back{transform:translate(calc(-50% + 132px),-50%) scale(.84)}
  .workflow-receipt{padding:32px 14px}
  .receipt-panel{font-size:.875rem}
  .receipt-panel li{gap:10px;padding:7px 14px}
  .payout-table,.home-faq-list{padding:32px 22px}
  .workflow-copy,.payout-heading,.home-faq>div:first-child,.platform-head{padding:48px 22px}
  .site-footer{grid-template-columns:1fr 1fr;padding-top:48px;gap:26px}
  .footer-bottom{flex-direction:column;gap:8px}
}
