/* ============================================================
   DataDock documentation — shared styles (all /docs/ pages)
   ============================================================ */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { margin:0; background:#0c1322; color:#dce2f8; font-family:'Manrope',sans-serif; overflow-x:hidden; -webkit-font-smoothing:antialiased; }
::selection { background:rgba(45,212,191,.3); }
a { color:inherit; }
img { max-width:100%; }
@keyframes ddglow { 0%,100%{opacity:.45} 50%{opacity:.85} }
@keyframes ddfloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }

/* ambient glows */
.dd-glows { position:fixed; inset:0; pointer-events:none; z-index:0; overflow:hidden; }
.dd-glows i { position:absolute; display:block; border-radius:50%; filter:blur(20px); }
.dd-glows i:nth-child(1){ top:-220px; left:50%; transform:translateX(-50%); width:900px; height:560px; background:radial-gradient(ellipse at center,rgba(45,212,191,.13),transparent 65%); animation:ddglow 8s ease-in-out infinite; }
.dd-glows i:nth-child(2){ top:520px; right:-160px; width:520px; height:520px; background:radial-gradient(circle at center,rgba(91,141,239,.1),transparent 65%); animation:ddglow 10s ease-in-out infinite; }

/* ---- nav ---- */
nav#dd-nav { position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:space-between; padding:14px 28px; border-bottom:1px solid rgba(148,163,184,.12); background:rgba(12,19,34,.82); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.dd-brand { display:flex; align-items:center; gap:11px; text-decoration:none; color:#dce2f8; }
.dd-brand img { width:30px; height:30px; border-radius:8px; display:block; }
.dd-brand .dd-wordmark { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:19px; letter-spacing:-.02em; }
.dd-brand .dd-badge { font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:13px; color:#5eead4; background:rgba(45,212,191,.1); border:1px solid rgba(45,212,191,.2); padding:2px 9px; border-radius:7px; }
.dd-navactions { display:flex; align-items:center; gap:8px; }
.dd-navlink { color:#9aa6c4; text-decoration:none; font-size:14px; font-weight:600; padding:8px 14px; border-radius:8px; transition:color .2s; }
.dd-navlink:hover { color:#dce2f8; }
.dd-nav-btn { display:flex; align-items:center; gap:7px; color:#dce2f8; text-decoration:none; font-size:14px; font-weight:600; padding:9px 16px; border-radius:9px; border:1px solid rgba(148,163,184,.2); }
.dd-nav-btn:hover { border-color:rgba(148,163,184,.4); background:rgba(255,255,255,.03); }
.dd-nav-cta { display:flex; align-items:center; gap:7px; color:#00322c; text-decoration:none; font-size:14px; font-weight:700; padding:10px 18px; border-radius:9px; background:linear-gradient(135deg,#2dd4bf,#14b8a6); box-shadow:0 6px 20px rgba(45,212,191,.32); }

/* ---- layout ---- */
.dd-doc { position:relative; z-index:1; max-width:1300px; margin:0 auto; display:grid; grid-template-columns:248px 1fr; gap:48px; padding:0 28px 120px; align-items:start; }

/* ---- sidebar (cross-page nav) ---- */
aside#dd-side { position:sticky; top:74px; align-self:start; max-height:calc(100vh - 90px); overflow-y:auto; padding:28px 8px 40px 0; }
aside#dd-side::-webkit-scrollbar { width:8px; }
aside#dd-side::-webkit-scrollbar-thumb { background:rgba(148,163,184,.18); border-radius:8px; }
.dd-side-group { font-size:11px; letter-spacing:.12em; color:#66728f; font-weight:700; margin:22px 12px 8px; }
.dd-side-group:first-child { margin-top:0; }
aside#dd-side a { display:block; color:#9aa6c4; text-decoration:none; font-size:14px; font-weight:500; padding:8px 12px; border-radius:8px; border-left:2px solid transparent; transition:color .15s, background .15s, border-color .15s; }
aside#dd-side a:hover { color:#dce2f8; background:rgba(255,255,255,.03); }
aside#dd-side a.active { color:#5eead4; background:rgba(45,212,191,.08); border-left-color:#2dd4bf; font-weight:600; }

/* ---- content ---- */
main#dd-main { min-width:0; padding-top:28px; }
.dd-breadcrumb { font-size:13px; color:#66728f; font-weight:600; margin-bottom:18px; }
.dd-breadcrumb a { color:#9aa6c4; text-decoration:none; }
.dd-breadcrumb a:hover { color:#5eead4; }
.dd-eyebrow { font-size:13px; font-weight:700; letter-spacing:.14em; color:#2dd4bf; margin-bottom:14px; }
main#dd-main h1 { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:clamp(32px,4.6vw,46px); letter-spacing:-.03em; line-height:1.05; margin:0 0 16px; }
main#dd-main h2 { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:clamp(23px,3vw,30px); letter-spacing:-.02em; margin:38px 0 14px; scroll-margin-top:90px; padding-top:8px; }
main#dd-main h3 { font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:18px; margin:26px 0 10px; color:#eef1f7; }
main#dd-main p { font-size:15.5px; line-height:1.7; color:#aeb9c4; margin:0 0 16px; }
main#dd-main li { font-size:15.5px; line-height:1.65; color:#aeb9c4; margin:0 0 8px; }
main#dd-main ul, main#dd-main ol { margin:0 0 18px; padding-left:22px; }
main#dd-main strong { color:#dce2f8; }
main#dd-main a.dd-inline { color:#5eead4; text-decoration:none; font-weight:600; border-bottom:1px solid rgba(45,212,191,.3); }
main#dd-main a.dd-inline:hover { border-bottom-color:#2dd4bf; }
code { font-family:'JetBrains Mono',monospace; font-size:.86em; color:#e0a14a; background:rgba(224,161,74,.1); padding:2px 7px; border-radius:5px; }
kbd { font-family:'JetBrains Mono',monospace; font-size:.8em; color:#dce2f8; background:rgba(148,163,184,.12); border:1px solid rgba(148,163,184,.22); border-bottom-width:2px; padding:2px 7px; border-radius:6px; }
pre { font-family:'JetBrains Mono',monospace; font-size:13px; line-height:1.7; color:#aeb9c4; background:#0a0f1c; border:1px solid rgba(148,163,184,.12); border-radius:12px; padding:18px 20px; overflow-x:auto; margin:0 0 18px; }
pre code { color:inherit; background:none; padding:0; font-size:13px; }
.dd-kw { color:#5b8def; } .dd-fn { color:#2dd4bf; } .dd-num { color:#e0a14a; } .dd-cm { color:#66728f; }

/* screenshots */
figure.dd-shot { margin:22px 0; border-radius:14px; overflow:hidden; border:1px solid rgba(148,163,184,.14); background:#0a0f1c; box-shadow:0 24px 60px rgba(0,0,0,.45); }
figure.dd-shot img { display:block; width:100%; height:auto; }
figure.dd-shot figcaption { font-size:13px; color:#7e8aa8; padding:11px 16px; border-top:1px solid rgba(148,163,184,.1); background:#0e1626; }
figure.dd-shot figcaption strong { color:#cdd6ec; }

/* cards & callouts */
.dd-card { border:1px solid rgba(148,163,184,.12); background:#131b2c; border-radius:14px; padding:20px 22px; margin:0 0 16px; }
.dd-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:0 0 16px; }
.dd-note { display:flex; gap:13px; border-radius:12px; padding:16px 18px; margin:0 0 18px; border:1px solid rgba(45,212,191,.25); background:linear-gradient(160deg,rgba(45,212,191,.08),#131b2c); }
.dd-note.warn { border-color:rgba(224,161,74,.3); background:linear-gradient(160deg,rgba(224,161,74,.08),#131b2c); }
.dd-note .dd-note-ic { flex:none; font-size:16px; line-height:1.5; }
.dd-note p { margin:0; font-size:14.5px; color:#cdd6ec; }
.dd-note strong { color:#fff; }
.dd-steps { counter-reset:step; list-style:none; padding-left:0; }
.dd-steps > li { position:relative; padding-left:42px; margin-bottom:16px; }
.dd-steps > li::before { counter-increment:step; content:counter(step); position:absolute; left:0; top:-2px; width:28px; height:28px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:14px; color:#00322c; background:linear-gradient(135deg,#2dd4bf,#14b8a6); }
.dd-pill { display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:600; color:#5eead4; background:rgba(45,212,191,.1); border:1px solid rgba(45,212,191,.2); padding:4px 11px; border-radius:999px; font-family:'JetBrains Mono',monospace; }
.dd-engine-h { display:flex; align-items:center; gap:13px; margin:28px 0 10px; }
.dd-engine-h img { width:30px; height:30px; }
.dd-engine-h h3 { margin:0; font-size:19px; }
table.dd-table { width:100%; border-collapse:collapse; margin:0 0 18px; font-size:14px; }
table.dd-table th, table.dd-table td { text-align:left; padding:10px 14px; border-bottom:1px solid rgba(148,163,184,.1); }
table.dd-table th { color:#66728f; font-weight:700; font-size:12px; letter-spacing:.04em; text-transform:uppercase; }
table.dd-table td { color:#aeb9c4; }
table.dd-table td code { white-space:nowrap; }

/* hub cards (docs index) */
.dd-hub { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; margin:26px 0 8px; }
.dd-hub a { display:block; text-decoration:none; border:1px solid rgba(148,163,184,.12); background:#131b2c; border-radius:14px; padding:22px; transition:transform .25s, border-color .25s; }
.dd-hub a:hover { transform:translateY(-4px); border-color:rgba(45,212,191,.4); }
.dd-hub h3 { font-family:'Space Grotesk',sans-serif; font-size:17px; font-weight:600; margin:0 0 7px; color:#eef1f7; }
.dd-hub p { font-size:13.5px; line-height:1.55; color:#9aa6c4; margin:0; }
.dd-hub .dd-hub-ic { width:40px; height:40px; border-radius:11px; display:flex; align-items:center; justify-content:center; background:rgba(45,212,191,.12); color:#2dd4bf; margin-bottom:14px; font-size:20px; }

/* prev/next pager */
.dd-pager { display:flex; gap:14px; margin-top:46px; padding-top:26px; border-top:1px solid rgba(148,163,184,.1); }
.dd-pager a { flex:1; text-decoration:none; border:1px solid rgba(148,163,184,.14); border-radius:12px; padding:16px 18px; transition:border-color .2s, background .2s; }
.dd-pager a:hover { border-color:rgba(45,212,191,.4); background:rgba(255,255,255,.02); }
.dd-pager .dir { font-size:12px; color:#66728f; font-weight:700; letter-spacing:.06em; }
.dd-pager .ttl { display:block; margin-top:4px; color:#dce2f8; font-weight:600; font-size:15px; }
.dd-pager a.next { text-align:right; }

/* download buttons row */
.dd-btnrow { display:flex; gap:14px; flex-wrap:wrap; margin:22px 0 6px; }
.dd-dl { display:flex; align-items:center; gap:9px; color:#00322c; text-decoration:none; font-size:15px; font-weight:700; padding:13px 24px; border-radius:11px; background:linear-gradient(135deg,#2dd4bf,#14b8a6); box-shadow:0 8px 26px rgba(45,212,191,.3); }
.dd-ghost { display:flex; align-items:center; gap:9px; color:#dce2f8; text-decoration:none; font-size:15px; font-weight:700; padding:13px 22px; border-radius:11px; border:1px solid rgba(148,163,184,.22); }

/* footer */
footer.dd-footer { position:relative; z-index:1; border-top:1px solid rgba(148,163,184,.1); background:#0a0f1c; }
footer.dd-footer .wrap { max-width:1180px; margin:0 auto; padding:52px 28px; display:flex; flex-direction:column; align-items:center; gap:16px; text-align:center; }
footer.dd-footer img { width:168px; height:42px; object-fit:contain; mix-blend-mode:screen; }
footer.dd-footer p { font-size:15px; line-height:1.6; color:#9aa6c4; max-width:46ch; margin:0; font-weight:500; }
footer.dd-footer .flinks { display:flex; gap:18px; flex-wrap:wrap; justify-content:center; font-size:14px; font-weight:600; }
footer.dd-footer .flinks a { color:#9aa6c4; text-decoration:none; }
footer.dd-footer .flinks a.cur { color:#5eead4; }
footer.dd-footer .meta { margin-top:4px; display:flex; gap:14px; flex-wrap:wrap; justify-content:center; color:#66728f; font-size:13px; font-weight:600; }

/* mobile sidebar toggle */
#dd-side-toggle { display:none; }
@media (max-width: 940px) {
  .dd-doc { grid-template-columns:1fr; gap:0; }
  aside#dd-side { position:static; max-height:none; padding:0; margin:18px 0 8px; border:1px solid rgba(148,163,184,.12); border-radius:14px; background:#0e1626; overflow:hidden; }
  #dd-side-nav { display:none; padding:8px 10px 14px; }
  #dd-side-nav.open { display:block; }
  #dd-side-toggle { display:flex; align-items:center; justify-content:space-between; width:100%; padding:15px 18px; background:none; border:none; color:#dce2f8; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:15px; cursor:pointer; }
  main#dd-main { padding-top:8px; }
  .dd-grid2 { grid-template-columns:1fr; }
  nav#dd-nav { padding:12px 18px; }
  .dd-nav-hide { display:none !important; }
}
@media (max-width: 560px) { .dd-doc { padding-left:16px; padding-right:16px; } .dd-pager { flex-direction:column; } }