/*
 * Download landing page (blocks/document-single/). Handle "tfp-document-single", after the gallery styles
 * (.pg-head hero, .pg-band CTA) and the card styles. Navy hero, then a reading column with a sticky preview
 * card beside it from 1024px. Theme rules: 1px borders, 4px radius, no shadows or gradients; yellow is a rule
 * or a button surface, never text on white.
 */

.ds { --ds-ink: var(--ind-ink, #0D3556); --ds-blue: var(--ind-blue, #005B97); --ds-yellow: var(--ind-yellow, #FAC410); --ds-n50: var(--ind-n50, #F3F4F6); --ds-n100: var(--ind-n100, #E7E9ED); --ds-n200: var(--ind-n200, #D3D8DE); --ds-muted: #5F6B78; }
.ds-wrap { width: 100%; max-width: 1312px; margin: 0 auto; padding-left: clamp(1rem, 3.5vw, 4rem); padding-right: clamp(1rem, 3.5vw, 4rem); }

/* ---- Hero --------------------------------------------------------------- */
.ds .ds-chip { display: inline-block; margin: 0 0 1rem; padding: 3px 8px; border: 1px solid rgba(255, 255, 255, .35); border-radius: 4px; font-size: 12px; line-height: 16px; letter-spacing: .08em; text-transform: uppercase; color: #fff; }
.ds-hero__title { max-width: 26ch; }
.ds .ds-meta { margin: 1.25rem 0 0; font-size: 13px; line-height: 20px; letter-spacing: .06em; text-transform: uppercase; color: rgba(255, 255, 255, .78); }
.ds .ds-reviewed { margin: .5rem 0 0; font-size: 15px; color: rgba(255, 255, 255, .86); }
.ds-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 1.75rem; }
.ds-hero__actions .button { margin: 0; }
.ds-lock { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; color: rgba(255, 255, 255, .8); }
.ds-lock .dc-ico { width: 16px; height: 16px; }
html[data-theme="light"] .ds .ds-chip { border-color: var(--ds-n200); color: var(--ds-blue); }
html[data-theme="light"] .ds .ds-meta, html[data-theme="light"] .ds .ds-reviewed, html[data-theme="light"] .ds-hero .ds-lock { color: var(--ds-muted); }

/* ---- Body: reading column + preview card -------------------------------- */
.ds-body { padding: clamp(2.5rem, 5vw, 4.5rem) 0; }
.ds-body__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; }
@media (min-width: 1024px) { .ds-body__grid { grid-template-columns: minmax(0, 1fr) 380px; gap: 64px; align-items: start; } }
.ds-main { max-width: 760px; }
.ds-sec + .ds-sec { margin-top: clamp(2.25rem, 4vw, 3rem); }
.ds .ds-h2 { margin: 0 0 1rem; color: var(--ds-ink); font-size: clamp(24px, 2.2vw, 30px); line-height: 1.2; letter-spacing: -.01em; }

/* What's inside: the benefit list — a 3px yellow rule per item (a surface, not text). */
.ds .ds-inside { display: grid; gap: 12px; }
.ds .ds-inside li { position: relative; padding: 2px 0 2px 20px; font-size: 18px; line-height: 28px; color: var(--ind-text, #2B3440); }
.ds .ds-inside li::before { content: ""; position: absolute; left: 0; top: 4px; bottom: 4px; width: 3px; border-radius: 2px; background: var(--ds-yellow); }

.ds-prose { font-size: 18px; line-height: 30px; }
.ds-prose h2, .ds-prose h3 { color: var(--ds-ink); line-height: 1.25; margin: 1.75rem 0 .75rem; }
.ds-prose h2 { font-size: clamp(22px, 2vw, 26px); }
.ds-prose h3 { font-size: 20px; }
.ds-prose p { margin: 0 0 1rem; }
.ds-prose ul { margin: 0 0 1rem 1.25rem; list-style: disc; }
.ds-prose ul li { margin: 0 0 .35rem; }
.ds-prose a { color: var(--ds-blue); }

.ds-specs { width: 100%; border-collapse: collapse; border: 1px solid var(--ds-n200); border-radius: 4px; font-size: 16px; }
.ds-specs th, .ds-specs td { padding: 12px 16px; border-bottom: 1px solid var(--ds-n200); text-align: left; vertical-align: top; }
.ds-specs tr:last-child th, .ds-specs tr:last-child td { border-bottom: 0; }
.ds-specs th { width: 42%; background: var(--ds-n50); color: var(--ds-ink); font-weight: 600; }
.ds-specs td { color: var(--ds-ink); font-size: 15px; }

.ds .ds-std { display: flex; flex-wrap: wrap; gap: 8px; }
.ds .ds-std li { padding: 6px 10px; border: 1px solid var(--ds-n200); border-radius: 4px; font-size: 14px; line-height: 20px; color: var(--ds-ink); }
.ds .ds-std a { color: var(--ds-blue); }

.ds-aside { position: relative; }
@media (min-width: 1024px) { .ds-aside { position: sticky; top: 108px; } body.admin-bar .ds-aside { top: 140px; } }
.ds-card { padding: 20px; border: 1px solid var(--ds-n200); border-radius: 4px; background: #fff; }
.ds-cover { margin: 0; padding: 16px; border-radius: 4px; background: var(--ds-n50); }
.ds-cover__img { display: block; width: 100%; height: auto; max-height: 460px; object-fit: contain; border: 1px solid var(--ds-n200); background: #fff; }
.ds .ds-pages { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.ds-pages img { display: block; width: 100%; height: auto; border: 1px solid var(--ds-n200); border-radius: 4px; }
.ds .ds-card__meta { margin: 16px 0 12px; font-size: 12px; line-height: 18px; letter-spacing: .06em; text-transform: uppercase; color: var(--ds-muted); }
.ds-card__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.ds-card .ds-lock { color: var(--ds-muted); font-size: 13px; }
@media (max-width: 1023px) { .ds-aside { order: -1; } .ds-cover__img { max-height: 340px; } .ds .ds-pages { display: none; } }

/* ---- Used on ------------------------------------------------------------ */
.ds-used { padding: clamp(2.5rem, 5vw, 4.5rem) 0; border-top: 1px solid var(--ds-n100); }
.ds .ds-products { display: grid; grid-template-columns: 1fr; gap: 16px; margin-top: 1.25rem; }
@media (min-width: 640px) { .ds .ds-products { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .ds .ds-products { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.ds-product { display: grid; grid-template-columns: 72px minmax(0, 1fr) 20px; align-items: center; gap: 14px; min-height: 88px; padding: 8px 14px 8px 8px; border: 1px solid var(--ds-n200); border-radius: 4px; color: var(--ds-ink) !important; text-decoration: none !important; transition: border-color .15s ease-out; }
.ds-product:hover, .ds-product:focus-visible { border-color: var(--ds-blue); }
.ds-product__media { display: block; width: 72px; height: 72px; overflow: hidden; border-radius: 4px; background: var(--ds-n50); }
.ds-product__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ds-product__name { font-weight: 700; font-size: 16px; line-height: 22px; }
.ds-product__go .dc-ico { color: var(--ds-blue); }
.ds .ds-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 1.25rem 0 0; }
.ds-link { display: inline-flex; align-items: center; min-height: 40px; padding: 0 12px; border: 1px solid var(--ds-n200); border-radius: 4px; color: var(--ds-ink) !important; font-size: 15px; font-weight: 600; text-decoration: none !important; }
.ds-link:hover { border-color: var(--ds-ink); background: var(--ds-n50); }

/* ---- Proof -------------------------------------------------------------- */
.ds-proof { padding: clamp(2.5rem, 5vw, 4.5rem) 0; border-top: 1px solid var(--ds-n100); }
.ds .ds-proof__stat { margin: -.25rem 0 1.25rem; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--ds-blue); }
.ds .ds-photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (min-width: 1024px) { .ds .ds-photos { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } }
.ds-photos a { display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 4px; background: var(--ds-ink); }
.ds-photos img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ds .ds-cases { display: grid; gap: 8px; margin-top: 1.25rem; }
.ds .ds-cases li { font-size: 17px; line-height: 26px; }
.ds-cases a { color: var(--ds-ink); font-weight: 700; }
.ds-cases__tag { display: inline-block; margin-right: 8px; padding: 2px 6px; border-radius: 4px; background: var(--ds-ink); color: #fff; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; vertical-align: 2px; }
.ds .ds-proof__more { margin: 1.25rem 0 0; font-weight: 700; }

.ds .dl-list { background: var(--ds-n50); }