/* Deep pages (lot 08 of vitrine): loaded after sales.css, which gives the header, terminals, final section and footer. */
.deep .deep-hero { padding-block: clamp(1.5rem, 5vw, 3.5rem) 1.5rem; }
.deep .deep-hero h1 { max-width: 28ch; }
.deep .deep-hero .lead { max-width: 64ch; margin-block-end: 1rem; }
.deep .deep-date { margin: 0; font-family: var(--mono); font-size: .85rem; color: var(--ink-3); }
.deep .crumbs ol { display: flex; flex-wrap: wrap; gap: .25rem .5rem; margin: 0 0 1.25rem; padding: 0; list-style: none; font-family: var(--mono); font-size: .85rem; color: var(--ink-3); }
.deep .crumbs li:not(:last-child)::after { content: '/'; margin-inline-start: .5rem; color: var(--ink-3); }
.deep .crumbs a { color: var(--ink-2); display: inline-block; padding-block: .35rem; }
/* the current page is the heading just below: announced to screen readers, not repeated on screen */
.deep .crumbs li:last-child { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Reading layout: contents beside the article on a wide screen, above it on a phone */
.deep .deep-columns { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; padding-block-end: clamp(2rem, 5vw, 4rem); }
@media (min-width: 64rem) { .deep .deep-columns { grid-template-columns: 15rem minmax(0, 46rem); gap: 4rem; } .deep .toc { position: sticky; top: 1.5rem; align-self: start; } }
.deep .toc { font-size: .92rem; }
.deep .toc h2 { font-size: .85rem; font-weight: 500; color: var(--ink-3); margin-block-end: .5rem; }
.deep .toc ol { margin: 0; padding: 0; list-style: none; border-inline-start: 1px solid var(--line-2); }
.deep .toc a { display: block; padding: .4rem 0 .4rem .9rem; color: var(--ink-2); text-decoration: none; }
.deep .toc a:hover { color: var(--ink); text-decoration: underline; }
.deep .deep-article section { padding-block: 0 2.5rem; scroll-margin-top: 1rem; }
.deep .deep-article h2 { font-size: clamp(1.3rem, 2.4vw, 1.75rem); margin-block-end: .9rem; }
.deep .deep-article p, .deep .terms dd { max-width: 68ch; color: var(--ink-2); font-size: 1.05rem; }
.deep .deep-article p { margin-block: 0 1rem; }
.deep .deep-article a, .deep .terms a { color: var(--accent); }
.deep .deep-article code, .deep .terms code { font-size: .9em; color: var(--accent-2); overflow-wrap: anywhere; }
.deep .deep-article .step-screen { margin-block: 1.5rem .5rem; }

/* Glossary: one anchored definition per term */
.deep .terms { margin: 0; }
.deep .term { padding-block: 1.1rem; border-block-start: 1px solid var(--line-2); scroll-margin-top: 1rem; }
.deep .term:target { border-color: var(--accent); }
.deep .term:target dfn { color: var(--accent); }
.deep .terms dt { font-family: var(--mono); font-size: 1.1rem; font-weight: 700; }
.deep .terms dfn { font-style: normal; }
.deep .terms dd { margin: .4rem 0 0; }

/* Link cards: resources index and « read next » */
.deep .deep-list { padding-block: 0 2.5rem; }
.deep .deep-list h2 { font-size: clamp(1.3rem, 2.4vw, 1.75rem); }
.deep .link-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.deep .link-cards li { padding: 1.1rem 1.2rem; background: var(--bg-2); border: 1px solid var(--line-2); border-radius: .75rem; }
.deep .link-cards a { font-weight: 600; color: var(--ink); }
.deep .link-cards p { margin: .4rem 0 0; color: var(--ink-2); font-size: .95rem; }
.deep .related ul { padding-inline-start: 1.2rem; }
.sales .more a { color: var(--accent); }