:root { --orange: #f2a900; --ink: #e7e9e8; --muted: #939a98; --panel: #151817; --line: #303633; }
* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); font-family: "Roboto Mono", monospace; background-color: #0d0f0e; }
main { min-height: 100vh; }
.section-inner { width: min(1120px, calc(100% - 40px)); margin: 0 auto; }
.custody-intro { min-height: min(780px, 88vh); padding: 130px max(20px, calc((100vw - 1120px) / 2)) 70px; display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(480px, 1.1fr); align-items: center; gap: 70px; }
.eyebrow, .section-number, .choice-type { color: var(--orange); text-transform: uppercase; font-size: .72rem; letter-spacing: 0; }
h1 { margin: 14px 0 24px; font: 700 5rem/1.02 "Roboto Mono", monospace; letter-spacing: 0; }
h1 span { color: var(--orange); }
.lead { max-width: 690px; color: #bbc0be; font-size: 1.05rem; line-height: 1.75; }
.key-flow { display: grid; grid-template-columns: 1fr 28px 1fr 28px 1fr; align-items: center; gap: 10px; }
.key-flow > div { min-height: 190px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 11px; border: 1px solid var(--line); background: rgba(18,21,20,.82); text-align: center; padding: 20px 12px; }
.key-flow svg { width: 38px; height: 38px; color: var(--orange); }
.key-flow span { color: var(--muted); font-size: .72rem; line-height: 1.45; }
.key-flow .flow-focus { border-color: rgba(242,169,0,.72); box-shadow: 0 0 24px rgba(242,169,0,.09); }
.key-flow .flow-arrow { width: 22px; color: #606763; }
.plain-explainer, .safety { border-block: 1px solid var(--line); background: rgba(8,10,9,.62); }
.plain-explainer { padding: 90px 0; }
.split-copy, .safety-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; }
h2 { max-width: 760px; margin: 7px 0 28px; font-size: 3rem; line-height: 1.15; letter-spacing: 0; }
.explanation p, .node-lead { color: #b9bfbc; font-size: .98rem; line-height: 1.8; }
.explanation strong { color: var(--orange); }
.choices { padding: 90px 0 110px; }
.goal-picker { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 60px; }
.goal-picker button { padding: 10px 14px; border: 1px solid var(--line); border-radius: 4px; background: #111412; color: #afb5b2; font: inherit; font-size: .78rem; cursor: pointer; }
.goal-picker button:hover, .goal-picker button.active { border-color: var(--orange); color: var(--orange); }
.choice-heading { display: flex; align-items: center; gap: 10px; margin: 0 0 20px; font-size: 1rem; color: #d7dbd9; }
.choice-heading svg { color: var(--orange); }
.choice-grid { display: grid; gap: 14px; }
.wallet-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.signer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.node-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.choice-card { min-height: 320px; padding: 28px; border: 1px solid var(--line); border-radius: 6px; background: rgba(20,23,22,.88); display: flex; flex-direction: column; transition: opacity .2s ease, border-color .2s ease, transform .2s ease; }
.choice-card.highlight { border-color: rgba(242,169,0,.75); transform: translateY(-2px); }
.choice-card.dimmed { opacity: .28; }
.choice-icon { width: 54px; height: 54px; display: grid; place-items: center; border: 1px solid #4c514f; margin-bottom: 20px; }
.choice-icon svg { color: var(--orange); }
.choice-card h4 { margin: 5px 0 14px; font-size: 1.55rem; letter-spacing: 0; }
.choice-card > p:not(.choice-type) { color: #abb1ae; line-height: 1.65; font-size: .86rem; }
.tradeoff { margin: 10px 0 20px; padding-top: 15px; border-top: 1px solid var(--line); display: grid; gap: 7px; }
.tradeoff strong { color: #d9dcda; font-size: .78rem; }
.tradeoff span { color: var(--muted); font-size: .76rem; line-height: 1.55; }
.choice-card a { margin-top: auto; display: inline-flex; align-items: center; gap: 7px; color: var(--orange); font-size: .78rem; text-decoration: none; }
.choice-card a:hover { text-decoration: underline; text-underline-offset: 4px; }
.choice-card a svg { width: 14px; }
.platforms { display: flex; flex-wrap: wrap; gap: 5px; margin: -4px 0 9px; }
.platforms span { padding: 3px 6px; border: 1px solid #363c39; border-radius: 3px; color: #929995; font-size: .64rem; }
.signer-heading, .node-heading { margin-top: 74px; }
.node-lead { max-width: 820px; margin: -5px 0 28px; }
.safety { padding: 90px 0 120px; }
.safety ol { margin: 0; padding: 0; list-style: none; counter-reset: safety; }
.safety li { counter-increment: safety; padding: 18px 0 18px 48px; position: relative; border-bottom: 1px solid var(--line); color: #aeb4b1; line-height: 1.6; font-size: .86rem; }
.safety li::before { content: counter(safety, decimal-leading-zero); position: absolute; left: 0; color: var(--orange); }
.safety li strong { color: #e1e4e2; }
@media (max-width: 900px) {
  .custody-intro { min-height: auto; grid-template-columns: 1fr; padding-top: 110px; gap: 50px; }
  .split-copy, .safety-layout { grid-template-columns: 1fr; gap: 18px; }
  h1 { font-size: 3.6rem; }
  h2 { font-size: 2.35rem; }
  .wallet-grid, .signer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .section-inner { width: min(100% - 28px, 1120px); }
  .custody-intro { padding-inline: 14px; padding-bottom: 50px; }
  h1 { font-size: 2.65rem; }
  .key-flow { grid-template-columns: 1fr; }
  .key-flow > div { min-height: 125px; }
  .key-flow .flow-arrow { transform: rotate(90deg); justify-self: center; }
  .plain-explainer, .choices, .safety { padding-block: 66px; }
  .wallet-grid, .signer-grid, .node-grid { grid-template-columns: 1fr; }
  .choice-card { min-height: 0; padding: 22px; }
  .goal-picker { display: grid; grid-template-columns: 1fr 1fr; margin-bottom: 44px; }
}
