/* A single hierarchy for the explanation, the offer, and the technical reference. */
.design-page .wrap { max-width: 1160px; padding: 24px 40px 64px; }
.design-page main { --section-space: 88px; }
.design-page .hero { display:grid; grid-template-columns:1.15fr 1fr; align-items:center; gap:72px; text-align:left; padding:80px 0 64px; }
.design-page .hero h1 { font-size:clamp(40px,5.2vw,64px); line-height:1.06; letter-spacing:-.045em; max-width:650px; margin:0; }
.design-page .eyebrow, .design-page .benefit-tag, .flow-label { font-size:11px; font-weight:650; line-height:1.5; letter-spacing:.1em; text-transform:uppercase; color:var(--token-action,#007AFF); margin:0 0 16px; }
.design-page .sub { font-size:17px; line-height:1.65; margin:24px 0 28px; max-width:55ch; }
.design-page .hero .actions { align-items:flex-start; margin:0; }
.design-page .hero .dynamic-cta-row { justify-content:flex-start; }
.design-page .dynamic-hero-download-slot { display:none; }
.design-page .platforms { font-size:12px; margin-top:12px; }
.transfer-overview { border:1px solid var(--token-border,#d2d2d7); border-radius:20px; padding:32px; background:var(--token-surface,#fff); }
.flow-label { color:var(--token-text-muted,#64625c); }
.transfer-steps { list-style:none; padding:0; margin:24px 0; }
.transfer-steps li { display:flex; gap:18px; padding:0 0 26px; position:relative; }
.transfer-steps li:last-child { padding-bottom:0; }
.step-number { flex:none; width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:var(--token-action-container,#e8edff); color:var(--token-action,#007AFF); font-size:11px; font-weight:700; }
.transfer-steps strong { display:block; font-size:16px; padding-top:3px; }
.transfer-steps p, .flow-note { font-size:13px; line-height:1.6; margin:5px 0 0; color:var(--token-text-muted,#64625c); }
.flow-note { padding-top:18px; border-top:1px solid var(--token-border,#d2d2d7); }
.design-page .page-jumps { display:flex; justify-content:flex-start; flex-wrap:wrap; gap:12px 28px; border-block:1px solid var(--token-border,#d2d2d7); padding:20px 0; }
.page-jumps a { text-decoration:none; color:var(--token-text-muted,#64625c); font-size:13px; font-weight:600; }
.page-jumps a:last-child { margin-left:auto; color:var(--token-action,#007AFF); }
.page-jumps a:hover { text-decoration:underline; }
.design-page .section-block { margin:var(--section-space) 0; }
.design-page .section-header, .design-page .section-header.text-center { text-align:left; max-width:740px; margin-bottom:32px; }
.design-page h2, .design-page .section-header h2 { font-size:clamp(28px,3.3vw,38px); line-height:1.16; letter-spacing:-.035em; }
.design-page .section-lead, .design-page .section-header.text-center .section-lead { font-size:16px; line-height:1.7; max-width:65ch; margin:0; }
.design-page .benefits-grid { gap:32px; }
.design-page .benefit-card { border:0; border-top:1px solid var(--token-border,#d2d2d7); border-radius:0; background:none; box-shadow:none; padding:24px 0 0; }
.design-page .benefit-card h3, .design-page .control-card h3 { font-size:18px; line-height:1.4; letter-spacing:-.02em; }
.design-page .benefit-card p, .design-page .control-card p { font-size:15px; line-height:1.7; }
.design-page .controls-grid { gap:24px; }
.design-page .control-card { padding:28px; border-radius:16px; box-shadow:none; }
.design-page .control-card h3 svg { flex-shrink:0; }
.design-page .trust-section { margin:var(--section-space) 0; gap:48px; padding:0; border-radius:0; box-shadow:none; }
.design-page .trust-section .site-editorial-visual__media { max-width:360px; justify-self:center; }
.design-page .trust-section .site-editorial-visual__media img { width:100%; height:auto; min-height:0; object-fit:contain; }
.design-page .trust-section h2 { font-size:32px; }
.design-page .site-editorial-visual p { font-size:15px; line-height:1.7; }
.design-page .full-width-card { border-radius:16px; padding:32px; box-shadow:none; margin-bottom:0; }
.design-page .delivery-card .split-layout-reverse { gap:40px; }
.design-page .highlights-list { font-size:15px; line-height:1.7; }
.design-page .highlights-list li { margin-bottom:16px; }
.design-page .feature-badge { background:none; color:var(--token-action,#007AFF); padding:0; font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.design-page .download-section { margin:var(--section-space) 0; padding:40px; border-radius:20px; box-shadow:none; text-align:left; }
.design-page .download-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; margin-top:28px; }
.design-page .platform-card { background:none; border:0; border-top:1px solid var(--token-border,#d2d2d7); border-radius:0; padding:24px 20px 24px 0; min-width:0; }
.design-page .platform-card .direct-link { background:none; padding:8px 0; border-radius:0; font-size:12px; }
.design-page .platform-card code { white-space:nowrap; }
.design-page .review-metadata-bar { max-width:none!important; margin:0 0 24px!important; padding:16px 0!important; border-width:1px 0!important; border-radius:0!important; background:none!important; line-height:1.8; }
.architecture-details { border:1px solid var(--token-border,#d2d2d7); border-radius:16px; overflow:hidden; }
.architecture-details > summary { padding:24px; cursor:pointer; font-weight:600; font-size:17px; }
.summary-hint { display:block; font-size:13px; color:var(--token-text-muted,#64625c); font-weight:400; margin:8px 0 0 20px; }
.design-page .blueprint-card { background:#15171b; color:#f5f5f7; border-radius:0; box-shadow:none; padding:28px; margin:0; }
.design-page .blueprint-header { margin-bottom:24px; }
.design-page .blueprint-subtitle { color:#cbd5e1!important; }
.design-page .diagram-container { display:block; overflow-x:auto; padding:8px 0; }
.design-page .diagram-container svg { min-width:860px; max-width:100%; }
.design-page .technical-grid { margin:32px 0; gap:24px; }
.design-page .technical-grid .visual-panel, .design-page .technical-grid .card-visual-header { display:none; }
.design-page .technical-grid .split-layout { display:block; }
.design-page .technical-grid .card { padding:28px; border-radius:16px; box-shadow:none; }
.design-page .technical-grid h3 { font-size:22px!important; }
.design-page .archival-history { background:var(--token-surface,#fff); border-color:var(--token-border,#d2d2d7); border-radius:12px; margin-top:24px; }
.design-page .archival-history summary { color:var(--token-text-primary,#171714); font-weight:500; font-size:14px; gap:16px; }
.design-page .archival-history-content { background:#15171b; color:#f5f5f7; }
.design-page .delivery-details { margin-top:24px!important; }
.design-page .site-editorial-visual--conversion { padding:32px; border:1px solid var(--token-border,#d2d2d7); border-radius:16px; grid-template-columns:1fr; }
.design-page .site-editorial-visual--conversion .site-editorial-visual__media { display:none; }
.design-page .site-editorial-visual--conversion h2 { font-size:30px; max-width:650px; }
.design-page :is(a,summary,button):focus-visible { outline:3px solid var(--token-action,#007AFF); outline-offset:5px; }
.design-page :is(.jffi-envelope,.blueprint-flow-line,.rust-gear,.ffi-pulse,.pulse-dot,.speed-needle,.neon-text,.jail-boundary,.shield-vault,.p2p-laser,.firewall-line) { animation:none!important; }
@media(max-width:800px) {
 .design-page .wrap { padding:20px 24px 48px; }
 .design-page main { --section-space:64px; }
 .design-page .hero { gap:36px; grid-template-columns:1fr; padding:48px 0; }
 .design-page .hero h1 { max-width:650px; }
 .transfer-overview { padding:24px; }
 .design-page .trust-section { grid-template-columns:1fr; gap:24px; }
 .design-page .trust-section .site-editorial-visual__media { display:none; }
 .design-page .download-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .design-page .benefits-grid { grid-template-columns:1fr; gap:24px; }
 .design-page .controls-grid { grid-template-columns:1fr; }
 .design-page .download-section { padding:28px; }
 .design-page .page-jumps { gap:16px 24px; }
 .page-jumps a:last-child { margin-left:0; }
}
@media(max-width:480px) {
 .design-page .wrap { padding-inline:20px; }
 .design-page .hero h1 { font-size:42px; }
 .design-page .download-grid { grid-template-columns:1fr; }
 .design-page .download-section { padding:24px; }
 .design-page .control-card,.design-page .full-width-card,.design-page .technical-grid .card { padding:24px; }
 .design-page .grid { grid-template-columns:minmax(0,1fr); }
 .design-page .full-width-card { grid-column:auto; }
 .design-page .blueprint-card { padding:16px; }
 .design-page .section-block { min-width:0; }
}
.design-page .hero .site-action-stack { align-items:flex-start!important; }
.design-page .hero .site-action-group { justify-content:flex-start!important; margin-inline:0!important; }
.design-page .hero .site-platform-note { text-align:left; }
.design-page main [id] { scroll-margin-top:88px; }
.diagram-hint { color:#cbd5e1; font-size:12px; margin:0 0 12px; }
html body.design-page main .hero .actions.site-action-stack { align-items:flex-start!important; margin-top:0!important; }
html body.design-page main .download-section > p { margin-left:0!important; margin-right:0!important; text-align:left; }
html body.design-page main h2 { padding-top:0; }
html body.design-page main h2::before,html body.design-page main h2::after { display:none; }
.design-page .concept-caption { display:block; margin-top:12px; color:var(--token-text-muted,#64625c); font-size:12px; line-height:1.5; text-align:center; }
.design-page .trust-section .site-editorial-visual__media { text-decoration:none; }
.design-page .technical-grid .card { justify-content:flex-start; }

/* Static discovery and contact links remain usable without JavaScript. */
.static-page-links, .static-page-footer { display: flex; gap: 16px; flex-wrap: wrap; }
.static-page-footer { padding-top: 24px; border-top: 1px solid var(--token-border); font-size: 14px; }
.static-page-footer a { color: var(--token-text-body); }
/* The enhanced footer supplies the same links; keep the fragment destination. */
body:has(#sf-footer-root) .static-page-footer { display: none; }

.architecture-summary { max-width:860px; margin:0 auto 28px; }
.architecture-summary h3 { font-size:20px; margin-bottom:12px; }
.architecture-summary p { color:var(--token-text-body); font-size:15px; line-height:1.7; margin:0 0 12px; }

.architecture-talk { margin-top:28px; padding-top:24px; border-top:1px solid var(--token-border); }
.architecture-talk h3 { font-size:20px; margin:0 0 12px; }
.architecture-talk p { font-size:15px; line-height:1.7; color:var(--token-text-body); margin:0 0 12px; }
.architecture-talk a { color:var(--token-action); text-underline-offset:3px; }
.architecture-talk .architecture-talk__note { margin-top:12px; font-size:13px; color:var(--token-text-muted); }

.architecture-talk__preview { max-width:720px; aspect-ratio:16/9; margin-top:20px; overflow:hidden; border-radius:12px; background:#15171b; }
.architecture-talk__preview iframe { display:block; width:100%; height:100%; border:0; }
.architecture-talk__play { position:relative; display:block; width:100%; height:100%; padding:0; border:0; background:#15171b; cursor:pointer; color:white; }
.architecture-talk__play img { display:block; width:100%; height:100%; object-fit:contain; opacity:.7; }
.architecture-talk__play span { position:absolute; inset:auto 16px 16px; padding:12px; border-radius:8px; background:rgba(0,0,0,.85); font:600 16px/1.4 var(--font-family-ui); color:white; }
.architecture-talk__play:focus-visible { outline:3px solid var(--token-action); outline-offset:-3px; }

.architecture-talk__label { display:block; font-size:14px; font-weight:600; margin:16px 0 8px; }
.architecture-talk__select { display:block; width:100%; max-width:720px; min-height:44px; padding:10px; margin-bottom:14px; font:inherit; color:var(--token-text-primary); background:var(--token-surface-subtle); border:1px solid var(--token-border); border-radius:8px; }

/* One quiet video card, with controls kept together below the player. */
.architecture-talk { max-width:860px; margin:32px auto 0; padding:28px; border:1px solid var(--token-border); border-radius:16px; background:var(--token-surface-subtle); }
.architecture-talk .architecture-talk__kicker { margin-bottom:8px; color:var(--token-text-muted); font-size:12px; font-weight:600; }
.architecture-talk__preview { max-width:none; margin-top:20px; min-height:200px; }
.architecture-talk__controls { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px 20px; margin-top:18px; }
.architecture-talk__label { grid-column:1 / -1; margin:0; }
.architecture-talk__select { max-width:none; margin:0; min-width:0; font-size:14px; text-overflow:ellipsis; }
.architecture-talk__controls a { font-size:14px; white-space:nowrap; }
.architecture-talk .architecture-talk__note { margin:20px 0 0; font-size:12px; }
@media(max-width:600px) {
 .architecture-talk { padding:20px; }
 .architecture-talk__controls { grid-template-columns:minmax(0,1fr); gap:10px; }
 .architecture-talk__controls a { justify-self:start; }
 .architecture-talk__play span { font-size:14px; inset:auto 12px 12px; padding:10px; }
}
