/* Homepage depth: a useful next step, published reading, and short answers. */
.bh-tool,.bh-reading,.bh-faq{margin-top:44px}
.bh-tool{display:grid;grid-template-columns:1fr 1fr;gap:40px;border:1px solid var(--line);border-radius:16px;padding:30px 34px;background:#fff}
.bh-eyebrow{display:flex;align-items:center;gap:8px;color:var(--blue);font-size:12px;font-weight:600;line-height:1.5;margin:0 0 9px}
.bh-eyebrow svg{width:18px;height:18px}
.bh-tool h2,.bh-section-heading h2,.bh-faq h2{font-size:26px;font-weight:680;line-height:1.45;letter-spacing:-.45px;margin:0}
.bh-tool-copy>p:not(.bh-eyebrow){max-width:430px;font-size:15px;line-height:1.8;color:var(--muted);margin:12px 0 20px}
.bh-tool .button{font-size:15px;min-height:46px;padding:10px 18px;gap:20px}
.bh-cost-path{align-self:center;text-align:center;border-left:1px solid var(--line);padding-left:40px;min-width:0}
.bh-cost-caption{font-size:13px;color:var(--muted);margin:0 0 20px}
.bh-cost-path ol{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:0;padding:0}
.bh-cost-path li{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0}
.bh-cost-path li+li:before{content:"";position:absolute;top:23px;left:-15px;width:7px;height:7px;border-top:1px solid #9caad0;border-right:1px solid #9caad0;transform:rotate(45deg)}
.bh-cost-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;color:var(--blue);margin-bottom:4px}
.bh-cost-icon svg{width:38px;height:38px}
.bh-cost-path strong{font-size:16px;font-weight:600;line-height:1.4}
.bh-cost-path li>span:last-child{font-size:12px;line-height:1.6;color:var(--muted)}
.bh-cost-path>.text-link{margin-top:15px;font-size:13px;min-height:44px;justify-content:center;gap:6px}
.bh-cost-path>.text-link svg{width:16px;height:16px}
.bh-section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:22px}
.bh-section-heading>.text-link{font-size:14px;min-height:44px;flex-shrink:0}
.bh-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.bh-guide{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);border-radius:12px;padding:23px 24px 16px;background:#fff;transition:border-color .15s ease}
.bh-guide:focus-within,.bh-guide:hover{border-color:#b4c5ff}
.bh-guide-topic{display:flex;align-items:center;gap:10px;margin-bottom:15px}
.bh-guide-topic>span{display:flex;color:var(--blue)}
.bh-guide-topic svg{width:26px;height:26px}
.bh-guide-topic>p{font-size:12px;color:var(--muted);margin:0}
.bh-guide h3{font-size:17px;font-weight:650;line-height:1.6;margin:0}
.bh-guide h3 a{color:var(--ink)}
.bh-guide h3 a:hover{color:var(--blue);text-decoration:none}
.bh-guide-excerpt{font-size:14px;line-height:1.8;color:var(--muted);margin:10px 0 14px}
.bh-guide>.text-link{align-self:flex-start;font-size:13px;min-height:44px;margin-top:auto;gap:8px}
.bh-guide>.text-link svg{width:18px;height:18px}
.bh-faq .faq-section{display:grid;grid-template-columns:1fr 2fr;gap:40px;margin:0;padding:30px 0 0;border-top:1px solid var(--line)}
.bh-faq .section-heading{display:block;margin:0}
.bh-faq .section-heading h2{font-size:23px;max-width:320px;line-height:1.55}
.bh-faq .section-heading .text-link{min-height:44px;font-size:13px;margin-top:14px}
.bh-faq .faq-list{margin:0;border:0;min-width:0}
.bh-faq .faq-list details{margin:0;border-top:0;border-bottom:1px solid var(--line);padding:0}
.bh-faq .faq-list details:last-child{border-bottom:0}
.bh-faq .faq-list summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:52px;padding:12px 0;font-size:15px;font-weight:550;line-height:1.65}
.bh-faq .details-indicator{flex-shrink:0}
.bh-faq .details-indicator svg{width:18px;height:18px}
.bh-faq .faq-list details p{font-size:14px;line-height:1.85;color:var(--muted);margin:0;padding:0 34px 16px 0;max-width:none}
.bh-about-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;border-top:1px solid var(--line);padding-top:14px;margin-top:24px}
.bh-about-links a{display:flex;align-items:center;justify-content:center;gap:9px;min-height:44px;font-size:13px;color:var(--muted)}
.bh-about-links a:hover{color:var(--blue);text-decoration:none}
.bh-about-links a>svg:first-child{width:19px;height:19px;color:var(--blue)}
.bh-about-links a>svg:last-child{width:15px;height:15px}
@media(max-width:1050px){
 .bh-tool{gap:24px;padding:26px}
 .bh-tool h2,.bh-section-heading h2{font-size:23px}
 .bh-cost-path{padding-left:24px}
 .bh-guide{padding:20px 18px 12px}
 .bh-guide h3{font-size:16px}
 .bh-faq .faq-section{gap:26px}
}
@media(max-width:720px){
 .bh-tool,.bh-reading,.bh-faq{margin-top:30px}
 .bh-tool{grid-template-columns:1fr;gap:22px;padding:22px 20px;border-radius:12px}
 .bh-tool h2,.bh-section-heading h2{font-size:22px;letter-spacing:-.3px}
 .bh-tool-copy>p:not(.bh-eyebrow){font-size:14px;margin:10px 0 15px}
 .bh-tool .button{min-height:46px;font-size:14px}
 .bh-cost-path{border-left:0;border-top:1px solid var(--line);padding:20px 0 0}
 .bh-cost-caption{margin-bottom:14px}
 .bh-cost-path ol{gap:12px}
 .bh-cost-path li+li:before{left:-9px}
 .bh-cost-path strong{font-size:15px}
 .bh-cost-path li>span:last-child{font-size:12px}
 .bh-cost-icon svg{width:34px;height:34px}
 .bh-section-heading{align-items:start;gap:12px;margin-bottom:16px}
 .bh-section-heading>.text-link{align-self:end;font-size:12px;gap:5px}
 .bh-section-heading>.text-link svg{width:17px;height:17px}
 .bh-section-heading h2{max-width:230px}
 .bh-guide-grid{grid-template-columns:1fr;gap:12px}
 .bh-guide{padding:20px 20px 12px}
 .bh-guide-topic{margin-bottom:12px}
 .bh-guide h3{font-size:16px}
 .bh-guide-excerpt{margin-top:8px;margin-bottom:8px}
 .bh-faq .faq-section{grid-template-columns:1fr;gap:12px;padding-top:24px}
 .bh-faq .section-heading{display:flex;align-items:start;justify-content:space-between;gap:12px}
 .bh-faq .section-heading h2{max-width:225px;font-size:21px}
 .bh-faq .section-heading .text-link{font-size:12px;white-space:nowrap;gap:4px;margin-top:0}
 .bh-faq .section-heading .text-link svg{width:16px;height:16px}
 .bh-faq .faq-list summary{font-size:14px}
 .bh-faq .faq-list details p{padding-right:22px;font-size:14px}
 .bh-about-links{gap:0;grid-template-columns:1fr;margin-top:18px;padding-top:12px}
 .bh-about-links a{justify-content:flex-start;min-height:44px}
 .bh-about-links a>svg:last-child{margin-left:auto}
}
@media(max-width:380px){
 .page-home .blue-hero-actions{flex-wrap:wrap;gap:8px 18px}
 .page-home .blue-hero-actions .button{flex:0 0 auto}
 .page-home .blue-hero-actions .text-link{min-height:44px}
 .blue-hero .deck-arrow{width:28px;height:28px;top:14px;right:14px}
 .blue-hero .deck-arrow svg{width:20px;height:20px}
}

/* Optional motion keeps the server-rendered content and layout intact. */
.page-home .blue-hero{position:relative}
.blue-hero .deck-binance{--bh-card-angle:-3deg;--bh-float-time:7.2s;--bh-float-delay:-.8s}
.blue-hero .deck-okx{--bh-card-angle:-1.5deg;--bh-float-time:8s;--bh-float-delay:-3.4s}
.blue-hero .deck-kraken{--bh-card-angle:2.4deg;--bh-float-time:7.6s;--bh-float-delay:-5.1s}
@keyframes bh-card-float{
 0%,100%{transform:translateY(0) rotate(var(--bh-card-angle))}
 50%{transform:translateY(var(--bh-float-distance,-7px)) rotate(var(--bh-card-angle))}
}
@media(prefers-reduced-motion:no-preference){
 .bh-motion-enabled .blue-hero .bh-deck-active .deck-card{animation:bh-card-float var(--bh-float-time) ease-in-out var(--bh-float-delay) infinite}
 .bh-motion-enabled .blue-hero .exchange-deck:hover .deck-card,.bh-motion-enabled .blue-hero .exchange-deck:focus-within .deck-card{animation-play-state:paused}
 .bh-motion-enabled .bh-guide{transition:translate .22s ease,box-shadow .22s ease,border-color .22s ease}
 .bh-motion-enabled .blue-hero-actions .button>svg,.bh-motion-enabled .bh-tool .button>svg,.bh-motion-enabled .bh-guide>.text-link>svg,.bh-motion-enabled .bh-about-links a>svg:last-child{transition:translate .2s ease}
 .bh-motion-enabled .blue-hero-actions .button:focus-visible>svg,.bh-motion-enabled .bh-tool .button:focus-visible>svg,.bh-motion-enabled .bh-guide>.text-link:focus-visible>svg{translate:3px 0}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .bh-motion-enabled .bh-guide:hover{translate:0 -3px;box-shadow:0 7px 18px #1c4efa0b}
 .bh-motion-enabled .blue-hero-actions .button:hover>svg,.bh-motion-enabled .bh-tool .button:hover>svg,.bh-motion-enabled .bh-guide>.text-link:hover>svg,.bh-motion-enabled .bh-about-links a:hover>svg:last-child{translate:3px 0}
}
@media(max-width:720px){
 .blue-hero .deck-card{--bh-float-distance:-4px}
}
@media(prefers-reduced-motion:reduce){
 .page-home .blue-hero .deck-card{animation:none}
}
@media print{.page-home .blue-hero .deck-card{animation:none!important}}
.bh-regions{margin-top:64px}
.bh-regions h2{font-size:clamp(23px,2.4vw,32px);font-weight:730;letter-spacing:-.7px;margin-bottom:10px}
.bh-regions p{font-size:16px;line-height:1.7;color:var(--muted);max-width:66ch}
.bh-regions .landing-region-links{margin:22px 0 0}
@media(max-width:720px){.bh-regions{margin-top:44px}.bh-regions h2{font-size:24px}.bh-regions p{font-size:15px}}

.hero-subject,.heading-subject{display:block;font-weight:500;letter-spacing:0;color:var(--muted);line-height:1.5}
.hero-subject{font-size:clamp(15px,1.35vw,19px);margin-top:16px;max-width:30ch}
.heading-subject{font-size:clamp(14px,1.15vw,16px);margin:8px auto 0;max-width:60ch;text-align:center}
.blue-home-disclosure{display:flex;align-items:center;justify-content:center;gap:7px;font-size:13px;line-height:1.6}
.blue-home-disclosure svg{width:15px;height:15px;flex:0 0 auto;color:#7c89a2}
@media(max-width:720px){
 .hero-subject{font-size:15px;margin-top:12px;max-width:none}
 .heading-subject{font-size:14px;margin-left:0;margin-right:0;text-align:left}
 .blue-home-disclosure{font-size:12px}
}
