/* OfflineDB extends the shared FraudGuard product-page design. */
.odb-page .hero-grid { grid-template-columns:1.05fr 1fr; gap:68px; padding-block:76px 64px; }
.odb-page .hero h1 { font-size:clamp(43px,4.05vw,58px); }
.odb-page .hero-lede { max-width:505px; }
.odb-page .hero-note { display:flex; flex-wrap:wrap; gap:9px; font-size:11px; }
.odb-page .hero-note>span { color:#688999; }
.odb-flow { min-width:0; border:1px solid #3a5564; border-radius:12px; background:#102c40; box-shadow:0 25px 65px #03152130; overflow:hidden; }
.odb-flow figcaption { display:flex; align-items:center; gap:9px; padding:19px 22px; border-bottom:1px solid #365262; font-size:11px; color:#d3e3e9; }
.odb-light { width:6px; height:6px; border-radius:50%; background:var(--accent); box-shadow:0 0 10px #92ebca55; flex-shrink:0; }
.odb-figure-label { margin-left:auto; color:#a1bac7; font-size:8px; text-transform:uppercase; letter-spacing:1px; white-space:nowrap; }
.odb-flow-body { padding:25px 23px 23px; }
.odb-origin { display:flex; align-items:center; gap:14px; border:1px solid #3b596a; border-radius:6px; background:#153448; padding:15px 18px; }
.odb-origin>svg { width:28px; height:34px; fill:none; stroke:var(--accent); stroke-width:1.4; flex-shrink:0; }
.odb-origin>div>span { display:block; color:#96b4c4; font-size:9px; letter-spacing:1px; text-transform:uppercase; }
.odb-origin strong { display:block; font-size:13px; font-weight:500; margin-top:3px; }
.odb-engine { margin-left:auto; border:1px solid #557d7b; color:#b1e1d4; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:11px; border-radius:4px; padding:3px 8px; }
.odb-transfer { position:relative; height:59px; display:flex; align-items:center; justify-content:center; }
.odb-transfer:before { content:""; position:absolute; width:1px; height:100%; top:0; left:50%; background:#698f95; }
.odb-down { position:relative; color:#a7dbcd; background:#102c40; line-height:1; padding-block:2px; font-size:21px; }
.odb-transfer>span:last-child { position:absolute; left:calc(50% + 16px); color:#a4bfcc; font-size:9px; }
.odb-boundary { border:1px dashed #5b817e; border-radius:7px; background:#92ebca04; padding:17px 17px 20px; }
.odb-boundary-label { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:9px; color:#b5d7d0; text-transform:uppercase; letter-spacing:1px; }
.odb-local { font-size:8px; letter-spacing:.4px; text-transform:none; color:#b5e5d3; }
.odb-local>span { font-size:7px; margin-right:5px; color:var(--accent); }
.odb-database { display:flex; gap:17px; align-items:center; margin-top:24px; padding:16px 15px; border:1px solid #5a8b81; border-radius:6px; background:#163d43; }
.odb-database>svg { width:54px; height:58px; fill:#92ebca08; stroke:#a2e8ce; stroke-width:1.3; flex-shrink:0; }
.odb-database strong { font-size:13px; color:#e1f5ed; font-weight:600; }
.odb-database p { font-size:10px; color:#acccc5; margin-top:4px; }
.odb-format-tags { display:flex; gap:6px; margin-top:12px; }
.odb-format-tags span { font-size:9px; line-height:1.7; color:#b4e4d4; border:1px solid #547c73; border-radius:3px; padding:1px 7px; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; }
.odb-branches { display:grid; grid-template-columns:repeat(3,1fr); height:33px; position:relative; }
.odb-branches:before { content:""; position:absolute; top:0; left:50%; height:16px; border-left:1px solid #5f8f8a; }
.odb-branches:after { content:""; position:absolute; top:16px; left:16.666%; width:66.666%; border-top:1px solid #5f8f8a; }
.odb-branches>span { width:1px; height:17px; margin:16px auto 0; background:#5f8f8a; }
.odb-destinations { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.odb-destinations>div { display:flex; align-items:center; flex-direction:column; border:1px solid #3d6268; border-radius:5px; background:#102c3c; padding:12px 3px 10px; }
.odb-destinations svg { width:22px; height:22px; stroke:#acd7cd; stroke-width:1.25; fill:none; margin-bottom:7px; }
.odb-destinations strong { font-size:10px; font-weight:500; color:#d7eae6; }
.odb-destinations span { font-size:8px; color:#9cb7c3; margin-top:2px; }
.odb-flow-note { text-align:center; font-size:9px; color:#a1bcca; border-top:1px solid #355162; padding:14px; }
.odb-page .section-heading>p { max-width:310px; }
.odb-use-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid #bdcfd5; }
.odb-use-grid article { display:flex; flex-direction:column; padding:27px 34px 0; border-left:1px solid var(--line); }
.odb-use-grid article:first-child { padding-left:0; border:0; }
.odb-use-grid article:last-child { padding-right:0; }
.odb-index { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:10px; color:#557c87; letter-spacing:.4px; margin-bottom:19px; }
.odb-use-grid h3 { font-size:21px; }
.odb-use-grid p { margin-block:14px 22px; color:var(--muted); font-size:14px; line-height:1.85; }
.odb-use-detail { font-size:10px; font-weight:600; color:#47717b; margin-top:auto; }
.odb-formats { background:#eef4f3; border-block:1px solid #dbe5e3; }
.odb-formats-grid { display:grid; grid-template-columns:1fr 1fr; gap:100px; align-items:center; }
.odb-format-copy>p:not(.eyebrow) { font-size:16px; color:var(--muted); line-height:1.85; margin-top:23px; max-width:440px; }
.odb-routine { list-style:none; padding:0; margin:31px 0 0; }
.odb-routine li { display:flex; gap:19px; margin-top:22px; align-items:baseline; }
.odb-routine li>span { font-size:10px; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; color:#587e7d; }
.odb-routine strong { font-family:var(--heading); font-size:15px; font-weight:700; }
.odb-routine p { color:var(--muted); font-size:12px; margin-top:3px; }
.odb-packages { min-width:0; }
.odb-package { display:flex; align-items:center; gap:24px; padding:25px 27px; background:#fff; border:1px solid #cbdcd9; border-radius:8px; }
.odb-package+.odb-package { margin-top:14px; }
.odb-file { width:66px; min-height:78px; display:flex; justify-content:center; flex-direction:column; align-items:center; flex-shrink:0; background:#eff7f3; border:1px solid #b8d5c9; border-radius:4px 13px 4px 4px; position:relative; color:#326d5b; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; }
.odb-file:before { content:""; position:absolute; top:-1px; right:-1px; width:14px; height:14px; background:#d7e9e0; border-left:1px solid #b8d5c9; border-bottom:1px solid #b8d5c9; border-radius:0 12px 0 3px; }
.odb-file>span { font-size:17px; letter-spacing:1px; }
.odb-file small { font-size:8px; margin-top:5px; }
.odb-file-csv { color:#40687c; background:#f0f5f8; border-color:#c4d4de; }
.odb-file-csv:before { background:#dae6ed; border-color:#c4d4de; }
.odb-package h3 { font-size:21px; }
.odb-package p { font-size:13px; color:var(--muted); line-height:1.8; margin-top:8px; }
.odb-package .inline-link { font-size:11px; margin-top:12px; min-height:30px; }
.odb-cadence { display:grid; grid-template-columns:1fr 1fr; gap:26px; padding:24px 5px 0; }
.odb-cadence>div+div { border-left:1px solid #c7d8d4; padding-left:26px; }
.odb-cadence>div>span { display:block; color:#526e74; font-size:10px; text-transform:uppercase; letter-spacing:.8px; }
.odb-cadence strong { display:block; color:#254c51; font-size:21px; font-family:var(--heading); font-weight:600; margin-top:4px; }
.odb-cadence strong span { font-family:var(--font); font-weight:400; font-size:12px; color:#526e74; }
.odb-snapshot-note { font-size:10px; line-height:1.8; color:#5e767a; margin-top:19px; padding:16px 5px 0; border-top:1px solid #cfdfdb; }
.odb-ace-section { background:#f7faf9; padding-block:54px; border-bottom:1px solid #dbe5e3; }
.odb-ace-grid { display:grid; grid-template-columns:145px minmax(0,1fr); align-items:center; gap:48px; max-width:1020px; }
.odb-ace-mark { display:flex; align-items:center; justify-content:center; flex-direction:column; min-height:145px; background:#e6f1ec; border:1px solid #c9ddd2; border-radius:8px; color:#235d50; }
.odb-ace-mark>span { font-size:11px; letter-spacing:2px; }
.odb-ace-mark strong { font-family:var(--heading); font-size:42px; font-weight:600; letter-spacing:-2px; line-height:1.25; }
.odb-ace-mark svg { width:100%; max-width:112px; height:22px; margin-top:11px; fill:none; stroke:#79a995; stroke-width:1.3; }
.odb-ace-grid .eyebrow { font-size:9px; margin-bottom:12px; }
.odb-ace-grid h2 { font-size:30px; letter-spacing:-1px; }
.odb-ace-grid p:not(.eyebrow) { color:var(--muted); font-size:14px; line-height:1.85; margin-top:13px; max-width:700px; }
.odb-ace-grid .inline-link { margin-top:16px; }
.odb-faq { background:#fff; border:0; }
.odb-page .faq-list a { color:var(--blue); text-decoration:underline; text-underline-offset:3px; }
.odb-page .closing-grid { grid-template-columns:1.4fr 1fr; gap:100px; }
.odb-plan { border-left:1px solid #39576b; padding:10px 0 10px 43px; }
.odb-plan h3 { font-size:25px; font-weight:600; margin-top:12px; }
.odb-plan p { font-size:14px; color:#b7cddc; line-height:1.9; margin-top:18px; }
.odb-plan a { display:inline-flex; align-items:center; gap:18px; color:var(--accent); font-size:13px; font-weight:500; padding-block:8px; margin-top:18px; }
.odb-plan a:hover { text-decoration:underline; text-underline-offset:4px; }
@media(max-width:1100px) {
    .odb-page .hero-grid { gap:42px; }
    .odb-flow figcaption { padding-inline:19px; font-size:10px; }
    .odb-flow-body { padding:22px 19px; }
    .odb-origin { gap:11px; padding-inline:14px; }
    .odb-origin strong { font-size:12px; }
    .odb-database { gap:12px; padding-inline:11px; }
    .odb-database strong { font-size:12px; }
    .odb-database p { font-size:9px; }
    .odb-database>svg { width:46px; }
    .odb-use-grid article { padding-inline:26px; }
    .odb-formats-grid { gap:60px; }
    .odb-package { padding:23px; gap:19px; }
    .odb-page .closing-grid { gap:65px; }
}
@media(max-width:900px) {
    .odb-page .hero-grid { grid-template-columns:1fr 1fr; gap:28px; padding-block:54px 45px; }
    .odb-page .hero h1 { font-size:40px; letter-spacing:-1.9px; }
    .odb-page .hero-note { font-size:10px; gap:7px; }
    .odb-flow figcaption { padding:17px 15px; gap:7px; }
    .odb-figure-label { display:none; }
    .odb-flow-body { padding:18px 14px; }
    .odb-origin { padding:13px 11px; gap:9px; }
    .odb-origin>svg { width:24px; }
    .odb-origin strong { font-size:10px; }
    .odb-engine { font-size:9px; padding:2px 5px; }
    .odb-transfer { height:49px; }
    .odb-transfer>span:last-child { font-size:8px; left:calc(50% + 12px); }
    .odb-boundary { padding:14px 11px; }
    .odb-boundary-label { font-size:8px; letter-spacing:.5px; }
    .odb-database { margin-top:18px; gap:9px; padding:13px 10px; }
    .odb-database>svg { width:37px; height:45px; }
    .odb-database strong { font-size:10px; }
    .odb-database p { font-size:8px; }
    .odb-format-tags { margin-top:8px; }
    .odb-format-tags span { font-size:8px; }
    .odb-destinations { gap:5px; }
    .odb-destinations strong { font-size:9px; }
    .odb-destinations span { font-size:7px; }
    .odb-flow-note { font-size:8px; padding:12px; }
    .odb-page .section-heading>p { font-size:12px; max-width:225px; }
    .odb-use-grid article { padding-inline:20px; }
    .odb-use-grid h3 { font-size:18px; }
    .odb-use-grid p { font-size:13px; }
    .odb-use-detail { font-size:9px; }
    .odb-formats-grid { gap:40px; }
    .odb-format-copy>p:not(.eyebrow) { font-size:14px; }
    .odb-package { padding:21px 17px; gap:16px; }
    .odb-file { width:49px; min-height:65px; }
    .odb-file>span { font-size:14px; }
    .odb-package h3 { font-size:19px; }
    .odb-package p { font-size:12px; }
    .odb-package .inline-link { font-size:10px; gap:9px; }
    .odb-cadence { gap:17px; }
    .odb-cadence>div+div { padding-left:17px; }
    .odb-cadence strong { font-size:19px; }
    .odb-cadence strong span { font-size:10px; }
    .odb-snapshot-note { font-size:9px; }
    .odb-ace-grid { gap:31px; grid-template-columns:115px minmax(0,1fr); }
    .odb-ace-mark { min-height:125px; }
    .odb-page .closing-grid { gap:40px; }
    .odb-plan { padding-left:30px; }
    .odb-plan h3 { font-size:23px; }
}
@media(max-width:700px) {
    .odb-page .hero-grid { grid-template-columns:1fr; padding-block:43px 33px; gap:35px; }
    .odb-page .hero h1 { font-size:clamp(35px,8.6vw,58px); letter-spacing:-1.8px; }
    .odb-page .hero-lede { margin-top:23px; max-width:520px; }
    .odb-page .hero-note { font-size:10px; margin-top:17px; }
    .odb-flow { max-width:500px; width:100%; margin:auto; }
    .odb-flow figcaption { padding:18px; font-size:11px; }
    .odb-flow-body { padding:21px 18px; }
    .odb-origin { padding:14px; gap:12px; }
    .odb-origin strong { font-size:12px; }
    .odb-engine { font-size:10px; padding:3px 7px; }
    .odb-transfer { height:53px; }
    .odb-transfer>span:last-child { font-size:9px; }
    .odb-boundary { padding:16px 14px; }
    .odb-boundary-label { font-size:9px; }
    .odb-database { padding:14px 12px; gap:13px; margin-top:20px; }
    .odb-database>svg { width:45px; height:50px; }
    .odb-database strong { font-size:12px; }
    .odb-database p { font-size:9px; }
    .odb-format-tags span { font-size:9px; }
    .odb-destinations { gap:7px; }
    .odb-destinations strong { font-size:10px; }
    .odb-destinations span { font-size:8px; }
    .odb-flow-note { font-size:9px; padding:14px; }
    .odb-page .section-heading>p { max-width:100%; font-size:14px; margin-top:20px; }
    .odb-use-grid { grid-template-columns:1fr; }
    .odb-use-grid article,.odb-use-grid article:first-child,.odb-use-grid article:last-child { border:0; border-bottom:1px solid var(--line); padding:26px 0; }
    .odb-use-grid article:last-child { padding-bottom:0; border:0; }
    .odb-index { margin-bottom:15px; }
    .odb-use-grid h3 { font-size:21px; }
    .odb-use-grid p { font-size:14px; margin-block:13px 18px; }
    .odb-use-detail { font-size:10px; }
    .odb-formats-grid { grid-template-columns:1fr; gap:34px; }
    .odb-format-copy>p:not(.eyebrow) { max-width:520px; margin-top:20px; }
    .odb-routine { margin-top:27px; }
    .odb-routine li { gap:17px; margin-top:20px; }
    .odb-package { padding:24px 21px; gap:22px; }
    .odb-file { width:60px; min-height:77px; }
    .odb-file>span { font-size:17px; }
    .odb-package h3 { font-size:21px; }
    .odb-package p { font-size:13px; }
    .odb-package .inline-link { font-size:11px; min-height:35px; }
    .odb-cadence { padding-top:23px; gap:22px; }
    .odb-cadence>div+div { padding-left:22px; }
    .odb-cadence strong { font-size:21px; }
    .odb-cadence strong span { font-size:11px; }
    .odb-snapshot-note { font-size:10px; }
    .odb-ace-section { padding-block:40px; }
    .odb-ace-grid { grid-template-columns:1fr; gap:23px; }
    .odb-ace-mark { width:80px; min-height:86px; }
    .odb-ace-mark>span { font-size:8px; letter-spacing:1px; }
    .odb-ace-mark strong { font-size:30px; }
    .odb-ace-mark svg { height:16px; margin-top:3px; }
    .odb-ace-grid .eyebrow { font-size:9px; }
    .odb-ace-grid h2 { font-size:29px; }
    .odb-ace-grid p:not(.eyebrow) { font-size:14px; margin-top:16px; }
    .odb-page .closing-grid { grid-template-columns:1fr; gap:36px; }
    .odb-plan { border:0; border-top:1px solid #39576b; padding:28px 0 0; }
}
@media(max-width:375px) {
    .odb-page .hero h1 { font-size:31px; letter-spacing:-1.6px; }
    .odb-flow figcaption { font-size:10px; padding-inline:14px; }
    .odb-flow-body { padding:17px 13px; }
    .odb-origin { padding:12px 10px; gap:9px; }
    .odb-origin strong { font-size:10px; }
    .odb-engine { font-size:9px; padding-inline:5px; }
    .odb-boundary { padding:13px 9px; }
    .odb-database { padding:12px 9px; gap:8px; }
    .odb-database>svg { width:35px; }
    .odb-database strong { font-size:10px; }
    .odb-database p { font-size:8px; }
    .odb-destinations { gap:4px; }
    .odb-destinations strong { font-size:9px; }
    .odb-destinations span { font-size:7px; }
    .odb-flow-note { font-size:8px; }
    .odb-package { padding:20px 16px; gap:16px; }
    .odb-file { width:46px; min-height:66px; }
    .odb-file>span { font-size:14px; }
    .odb-package .inline-link { font-size:10px; gap:8px; }
    .odb-cadence { gap:16px; }
    .odb-cadence>div+div { padding-left:16px; }
    .odb-cadence strong { font-size:19px; }
    .odb-cadence strong span { font-size:10px; }
}
