/* Approved product presentation: Clipform Ink & Brass, static HTML illustrations.
   Used by the developer page and audience-specific English/Spanish homepages. */
.dp-showcase { color: var(--cf-ink); line-height: 1.7; }
.dp-showcase h1, .dp-showcase h2, .dp-showcase h3 { font-weight: 800; letter-spacing: -.035em; line-height: 1.15; }
.dp-showcase h1 { font-size: clamp(2.8rem, 4.5vw, 4rem); margin: 0 0 1.5rem; }
.dp-showcase h2 { font-size: clamp(1.9rem, 3vw, 2.55rem); margin-bottom: 1.25rem; }
.dp-showcase p { max-width: 60ch; }
.dp-showcase a { color: inherit; }
.dp-nav { border-bottom: 2px solid var(--cf-brass); }
.dp-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 4rem; }
.dp-hero { padding: 4.5rem 0 4rem; }
.dp-eyebrow { display: flex; align-items: center; gap: .6rem; margin-bottom: 1.2rem; text-transform: uppercase; letter-spacing: .08em; font-size: .7rem; font-weight: 800; line-height: 1.6; }
.dp-eyebrow::before { content: ''; width: 7px; height: 7px; flex: 0 0 auto; background: var(--cf-brass); }
.dp-highlight { background: var(--cf-brass-soft); padding: 0 .08em; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.dp-lede { color: var(--cf-muted); font-size: 1.05rem; line-height: 1.8; margin-bottom: 1.65rem; }
.dp-actions { display: flex; flex-wrap: wrap; gap: 1rem; }
.dp-primary, .dp-secondary, .dp-light-button { min-height: 48px; padding: .75rem 1rem; border: 2px solid var(--cf-ink); border-radius: 5px; font-size: .875rem; font-weight: 750; }
.dp-primary { box-shadow: 3px 3px 0 var(--cf-ink); }
.dp-secondary { background: var(--cf-surface); }
.dp-primary:hover, .dp-secondary:hover { transform: translateY(-1px); }
.dp-small { font-size: .8rem; line-height: 1.75; }
.dp-muted { color: var(--cf-muted); }
.dp-browser-example, .dp-export-example, .dp-api-diagram { margin: 0; min-width: 0; }
.dp-showcase figcaption { color: var(--cf-muted); text-align: center; font-size: .7rem; line-height: 1.65; margin-top: 1rem; }
.dp-browser { overflow: hidden; background: var(--cf-surface); border: 2px solid var(--cf-ink); border-radius: 12px; box-shadow: 6px 6px 0 var(--cf-ink); }
.dp-browser-bar { display: flex; gap: .8rem; align-items: center; padding: .8rem 1rem; border-bottom: 2px solid var(--cf-ink); font-size: .65rem; }
.dp-browser-dots { display: flex; gap: 4px; }
.dp-browser-dots i { width: 5px; height: 5px; border-radius: 50%; border: 1px solid var(--cf-ink); }
.dp-example-label { margin-left: auto; background: var(--cf-brass-soft); color: var(--cf-ink); font-size: .6rem; padding: .1rem .4rem; border-radius: 3px; font-weight: 650; }
.dp-website { padding: 1.5rem; }
.dp-website-nav { display: flex; justify-content: space-between; gap: 1rem; font-size: .6rem; margin-bottom: 1.75rem; }
.dp-website-nav > span { border-bottom: 2px solid var(--cf-brass); }
.dp-site-title { font-size: 1.5rem; font-weight: 800; line-height: 1.2; letter-spacing: -.035em; margin-bottom: .65rem; }
.dp-sheet { border: 1px solid var(--cf-ink); border-radius: 10px; overflow: hidden; margin-top: 1rem; background: #fff; }
.dp-sheet-head { background: #1e2938; color: #fff; padding: 1rem; }
.dp-sheet-head strong { display: block; font-size: .8rem; }
.dp-sheet-head > span { display: block; color: #cbd1d8; font-size: .65rem; margin-top: .15rem; }
.dp-sheet-body { padding: .9rem; }
.dp-sheet-row { border: 1px solid #e0e4e8; display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .75rem; border-radius: 6px; margin-bottom: .6rem; }
.dp-sheet-row strong { font-size: .75rem; display: block; }
.dp-sheet-row > div > span { display: block; color: #5e6671; font-size: .65rem; }
.dp-sheet-button { background: var(--cf-ink); color: #fff; border-radius: 4px; padding: .25rem .5rem; font-size: .6rem; font-weight: 750; white-space: nowrap; }
.dp-sheet-button.dp-closed { background: #f5f6f8; color: #6c727c; border: 1px solid #e0e4e8; }
.dp-full { background: #f8f9fa; }
.dp-slots { display: flex; gap: 3px; margin-top: .35rem; }
.dp-slots i { width: 11px; height: 5px; background: #e0e4e8; border-radius: 3px; }
.dp-slots i.filled { background: var(--cf-ink); }
.dp-powered { font-size: .6rem; text-align: center; color: #5e6671; margin: .75rem 0 0; }
.dp-browser-note { display: flex; gap: .6rem; align-items: center; border-top: 2px solid var(--cf-ink); padding: .65rem 1rem; background: var(--cf-brass-soft); font-size: .65rem; font-weight: 650; }
.dp-browser-note > span { font-size: 1rem; font-weight: 800; }
.dp-feature-strip { border-block: 1px solid var(--cf-ink); background: var(--cf-surface); }
.dp-feature-strip dl { display: grid; grid-template-columns: 1fr 1fr 1.45fr 1fr; margin: 0; }
.dp-feature-strip dl > div { padding: 1.3rem 1.4rem; border-left: 1px solid var(--cf-border); }
.dp-feature-strip dl > div:first-child { padding-left: 0; border: 0; }
.dp-feature-strip dt { font-size: .8rem; }
.dp-feature-strip dd { color: var(--cf-muted); font-size: .7rem; margin: .15rem 0 0; }
.dp-section { padding: 5rem 0; scroll-margin-top: 1rem; }
.dp-section p { color: var(--cf-muted); font-size: .9rem; }
.dp-section p.dp-eyebrow { color: var(--cf-ink); font-size: .7rem; }
.dp-paper { background: var(--cf-surface); }
.dp-text-link { font-size: .85rem; font-weight: 750; text-decoration-thickness: 1px; text-underline-offset: .3em; }
.dp-text-link:hover { color: var(--cf-brass-text); }
.dp-mini-heading { font-size: .65rem !important; font-weight: 750; text-transform: uppercase; letter-spacing: .07em; color: var(--cf-ink) !important; }
.dp-embed-setup { border: 2px solid var(--cf-ink); border-radius: 8px; padding: 1.75rem; background: var(--cf-page); box-shadow: 5px 5px 0 var(--cf-brass-soft); }
.dp-steps { list-style: none; counter-reset: step; padding: 0; margin: 1.5rem 0; }
.dp-steps li { counter-increment: step; display: flex; gap: .9rem; margin-bottom: 1.25rem; }
.dp-steps li::before { content: counter(step); display: grid; place-items: center; align-self: flex-start; min-width: 30px; height: 30px; border: 1px solid var(--cf-ink); border-radius: 5px; background: var(--cf-surface); font-size: .8rem; font-weight: 750; }
.dp-steps strong { display: block; font-size: .8rem; }
.dp-steps small { display: block; font-size: .75rem; line-height: 1.6; color: var(--cf-muted); margin-top: .1rem; }
.dp-section .dp-product-note { font-size: .75rem; margin: 0; padding-top: 1rem; border-top: 1px solid var(--cf-border); }
.dp-product-note strong { display: block; margin-bottom: .3rem; color: var(--cf-ink); }
.dp-export-window { border: 2px solid var(--cf-ink); border-radius: 8px; overflow: hidden; background: var(--cf-surface); box-shadow: 5px 5px 0 var(--cf-ink); }
.dp-window-head { display: flex; align-items: center; gap: .75rem; border-bottom: 1px solid var(--cf-ink); background: var(--cf-brass-soft); padding: 1rem 1.25rem; }
.dp-export-content { padding: 1.5rem; }
.dp-export-content h3 { font-size: 1rem; margin-bottom: .3rem; }
.dp-export-content table { width: 100%; font-size: .75rem; margin-top: 1rem; }
.dp-export-content caption { caption-side: top; font-size: .65rem; padding: 0 0 .7rem; color: var(--cf-muted); }
.dp-export-content th { background: var(--cf-page); font-weight: 650; }
.dp-export-content th, .dp-export-content td { padding: .6rem .5rem; border-bottom: 1px solid var(--cf-border); }
.dp-export-content th:last-child, .dp-export-content td:last-child { text-align: right; }
.dp-export-path { display: flex; flex-direction: column; align-items: center; font-size: .65rem; margin: 1rem 0 .5rem; }
.dp-export-path > span:last-child { font-size: 1.25rem; line-height: 1.5; }
.dp-export-formats { display: grid; grid-template-columns: .7fr .8fr 1.5fr; gap: .5rem; }
.dp-export-formats > div { padding: .6rem .25rem; border: 1px solid var(--cf-ink); border-radius: 4px; text-align: center; }
.dp-export-formats strong { display: block; font-size: .7rem; }
.dp-export-formats span { display: block; color: var(--cf-muted); font-size: .6rem; }
.dp-ink { background: var(--cf-ink); color: var(--cf-surface); }
.dp-ink p, .dp-ink p.dp-eyebrow { color: #d1d2ce; }
.dp-ink .dp-highlight { color: var(--cf-ink); }
.dp-light-button { background: var(--cf-surface); color: var(--cf-ink) !important; border-color: var(--cf-surface); margin-top: .5rem; }
.dp-light-button:hover { background: var(--cf-brass-soft); border-color: var(--cf-brass-soft); }
.dp-api-diagram { border: 1px solid #74756f; border-radius: 9px; padding: 1.5rem; background: #2c2f32; }
.dp-api-topline { display: flex; align-items: center; gap: .8rem; font-size: .75rem; font-weight: 650; padding-bottom: 1rem; border-bottom: 1px solid #66685f; }
.dp-code-symbol { display: grid; place-items: center; width: 35px; height: 35px; border: 1px solid var(--cf-brass-soft); border-radius: 5px; color: var(--cf-brass-soft); font-size: 1rem; }
.dp-api-diagram ol { list-style: none; margin: 1.5rem 0; padding: 0; }
.dp-api-diagram li { display: flex; gap: .9rem; align-items: center; padding: .8rem; border: 1px solid #74756f; background: var(--cf-ink); border-radius: 5px; position: relative; }
.dp-api-diagram li + li { margin-top: 1.5rem; }
.dp-api-diagram li + li::before { content: '↓'; position: absolute; bottom: calc(100% + .12rem); left: 1.25rem; color: var(--cf-brass-soft); line-height: 1.25rem; }
.dp-api-number { min-width: 25px; height: 25px; display: grid; place-items: center; background: var(--cf-brass-soft); border-radius: 4px; color: var(--cf-ink); font-size: .7rem; font-weight: 750; }
.dp-api-diagram strong { display: block; font-size: .8rem; }
.dp-api-diagram li div > span { display: block; color: #d1d2ce; font-size: .65rem; line-height: 1.6; margin-top: .15rem; }
.dp-api-diagram figcaption { color: #c7c9c4; text-align: left; margin-top: 1.25rem; font-size: .65rem; }
.dp-section-intro { max-width: 620px; margin-bottom: 2.5rem; }
.dp-use-cases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; }
.dp-use-cases article { min-width: 0; }
.dp-use-cases h3 { font-size: 1.15rem; line-height: 1.25; }
.dp-use-cases p { font-size: .8rem; }
.dp-use-cases .dp-text-link { font-size: .75rem; }
.dp-use-art { display: flex; flex-direction: column; justify-content: center; min-height: 205px; padding: 1rem; margin-bottom: 1.5rem; border: 1px solid var(--cf-ink); border-radius: 7px; background: var(--cf-page); font-size: .7rem; }
.dp-mini-embed { padding: 0; justify-content: flex-start; overflow: hidden; }
.dp-mini-browser-bar { padding: .5rem .8rem; border-bottom: 1px solid var(--cf-ink); font-size: .6rem; }
.dp-mini-embed > div { margin: 1rem; border: 1px solid var(--cf-border); border-radius: 5px; overflow: hidden; background: #fff; }
.dp-mini-embed strong { display: block; background: #1e2938; color: #fff; padding: .6rem; }
.dp-mini-embed div > span { display: flex; justify-content: space-between; gap: .5rem; padding: .5rem .6rem; border-bottom: 1px solid #e0e4e8; font-size: .6rem; }
.dp-mini-embed b { font-weight: 550; }
.dp-mini-embed small { display: block; text-align: center; padding: .4rem; font-size: .5rem; color: #5e6671; }
.dp-mini-folder { position: relative; background: var(--cf-brass-wash); justify-content: flex-start; padding-top: 1.7rem; }
.dp-folder-tab { position: absolute; top: -.6rem; left: 1rem; padding: .1rem .6rem; background: var(--cf-brass-soft); border: 1px solid var(--cf-ink); border-radius: 4px; font-size: .6rem; }
.dp-mini-folder strong { margin-bottom: .8rem; }
.dp-mini-folder > span:not(.dp-folder-tab) { background: var(--cf-surface); border: 1px solid var(--cf-border); padding: .45rem .65rem; display: flex; justify-content: space-between; border-radius: 4px; margin-bottom: .4rem; font-size: .6rem; }
.dp-mini-team { text-align: center; }
.dp-team-people { display: flex; justify-content: center; gap: .35rem; }
.dp-team-people span { padding: .3rem .4rem; border: 1px solid var(--cf-ink); border-radius: 4px; font-size: .55rem; background: var(--cf-surface); }
.dp-team-connector { margin: .3rem; font-size: 1.1rem; }
.dp-mini-team > strong { padding: .5rem; border: 1px solid var(--cf-ink); background: var(--cf-brass-soft); border-radius: 4px; }
.dp-team-sheets { display: flex; justify-content: center; gap: .35rem; margin-top: .5rem; }
.dp-team-sheets span { padding: .35rem; background: var(--cf-surface); border: 1px solid var(--cf-border); border-radius: 3px; font-size: .55rem; }
.dp-section .dp-use-note { margin: 2rem 0 0; padding-top: 1.5rem; border-top: 1px solid var(--cf-border); max-width: none; font-size: .7rem; }
.dp-questions .dp-split { align-items: start; }
.dp-answers article + article { border-top: 1px solid var(--cf-border); padding-top: 1.25rem; margin-top: 1.25rem; }
.dp-answers h3 { font-size: .95rem; letter-spacing: -.015em; margin-bottom: .6rem; }
.dp-answers p { font-size: .8rem; margin: 0; }
.dp-final { padding: 0 0 4rem; }
.dp-final-panel { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 2.5rem; border: 2px solid var(--cf-ink); border-radius: 8px; background: var(--cf-brass-soft); box-shadow: 5px 5px 0 var(--cf-ink); }
.dp-final-panel .dp-eyebrow::before { background: var(--cf-ink); }
.dp-final-panel h2 { font-size: 2rem; }
.dp-final-panel p:last-child { font-size: .8rem; margin-bottom: 0; }
.dp-final-actions { display: flex; align-items: flex-start; flex-direction: column; gap: 1.25rem; }
.dp-final-actions .dp-text-link { font-size: .75rem; }
@media (min-width: 1400px) { .dp-showcase .container, .dp-nav .container { max-width: 1140px; } }
@media (max-width: 991.98px) {
  .dp-split { gap: 2.5rem; }
  .dp-hero { padding-top: 3rem; }
  .dp-showcase h1 { font-size: 2.8rem; }
  .dp-section { padding: 3.5rem 0; }
  .dp-feature-strip dl > div { padding: 1rem; }
  .dp-use-cases { gap: 1.3rem; }
  .dp-use-art { min-height: 190px; padding-inline: .65rem; }
  .dp-mini-embed { padding-inline: 0; }
  .dp-mini-embed > div { margin: .75rem .5rem; }
  .dp-final-panel { padding: 2rem; }
}
@media (max-width: 767.98px) {
  .dp-showcase .container { padding-inline: 1.4rem; }
  .dp-split { grid-template-columns: 1fr; gap: 2.5rem; }
  .dp-showcase h1 { font-size: clamp(2.45rem, 8.5vw, 3.5rem); }
  .dp-showcase h2 { font-size: 2rem; }
  .dp-hero { padding: 2.5rem 0 2rem; }
  .dp-lede { font-size: 1rem; }
  .dp-browser { box-shadow: 4px 4px 0 var(--cf-ink); }
  .dp-website { padding: 1.25rem; }
  .dp-browser-bar { padding-inline: .75rem; gap: .55rem; font-size: .6rem; }
  .dp-website-nav { margin-bottom: 1.5rem; }
  .dp-feature-strip dl { grid-template-columns: 1fr 1fr; }
  .dp-feature-strip dl > div { padding: .9rem 0; border: 0; }
  .dp-feature-strip dl > div:nth-child(even) { padding-left: 1rem; border-left: 1px solid var(--cf-border); }
  .dp-feature-strip dl > div:nth-child(n+3) { border-top: 1px solid var(--cf-border); }
  .dp-feature-strip dt { font-size: .7rem; }
  .dp-section { padding: 3rem 0; }
  .dp-embed-setup, .dp-export-content { padding: 1.25rem; }
  .dp-visual-first > figure { order: 2; }
  .dp-visual-first > div { order: 1; }
  .dp-use-cases { grid-template-columns: 1fr; gap: 2.5rem; }
  .dp-use-art { min-height: 210px; padding: 1.25rem; }
  .dp-mini-embed { padding: 0; }
  .dp-mini-embed > div { margin: 1.25rem; }
  .dp-mini-embed strong { font-size: .8rem; }
  .dp-mini-embed div > span { font-size: .7rem; }
  .dp-mini-folder { margin-top: .5rem; padding-top: 1.5rem; }
  .dp-mini-folder strong, .dp-mini-team > strong { font-size: .85rem; }
  .dp-mini-folder > span:not(.dp-folder-tab) { font-size: .7rem; }
  .dp-team-people span, .dp-team-sheets span { font-size: .65rem; }
  .dp-use-cases h3 { font-size: 1.25rem; }
  .dp-use-cases p, .dp-use-cases .dp-text-link { font-size: .85rem; }
  .dp-questions .dp-split { gap: 1rem; }
  .dp-final { padding-bottom: 3rem; }
  .dp-final-panel { flex-direction: column; align-items: flex-start; padding: 1.5rem; }
  .dp-final-panel h2 { font-size: 1.75rem; }
}
@media (max-width: 359.98px) {
  .dp-website { padding: .9rem; }
  .dp-sheet-body { padding: .6rem; }
  .dp-sheet-row { padding: .6rem; gap: .4rem; }
  .dp-website-nav { font-size: .55rem; }
  .dp-browser-dots { display: none; }
}

/* Shared audience stories and the diagram library. */
.dp-showcase h1 { overflow-wrap: break-word; }
.dp-showcase .cf-product-preview .sheet-mockup { transform: none; }
.dp-showcase .cf-product-preview { width: 100%; }
.sc-feature-strip dl { grid-template-columns: repeat(3, minmax(0,1fr)); }
.sc-feature-strip dd { line-height: 1.6; }
.sc-feature-story h2 { max-width: 22ch; }
.dp-section p.sc-qualification { font-size: .75rem; line-height: 1.75; border-top: 1px solid var(--cf-border); padding-top: 1rem; }
.sc-qualification strong { display: block; color: var(--cf-ink); margin-bottom: .4rem; }
.dp-ink .sc-qualification strong { color: var(--cf-brass-soft); }
/* Override the source stylesheet's high-specificity generic link palette. */
body.cf-ink-brass .dp-ink a.dp-text-link { color: var(--cf-brass-soft) !important; }
body.cf-ink-brass .dp-ink a.dp-text-link:hover { color: #fff !important; }
.dp-ink :focus-visible { outline-color: var(--cf-brass-soft); }
.sc-illustration { margin: 0; min-width: 0; }
.sc-visual { color: var(--cf-ink); background: var(--cf-surface); border: 2px solid var(--cf-ink); border-radius: 9px; padding: 1.75rem; box-shadow: 5px 5px 0 var(--cf-ink); }
.dp-ink .sc-visual { border-color: var(--cf-brass-soft); box-shadow: 5px 5px 0 #676450; }
.dp-ink .sc-visual p { color: var(--cf-ink); }
.dp-ink .sc-illustration figcaption { color: #d1d2ce; }
.sc-visual > .dp-mini-heading { margin: 0 0 1.4rem; font-size: .65rem; }
.sc-node { display: flex; flex-direction: column; gap: .3rem; border: 1px solid var(--cf-ink); background: var(--cf-page); border-radius: 5px; padding: .9rem 1rem; }
.sc-node strong { font-size: .85rem; line-height: 1.4; }
.sc-node > span { font-size: .7rem; line-height: 1.6; color: var(--cf-muted); }
.sc-sequence .sc-node + .sc-node { margin-top: 1.6rem; position: relative; }
.sc-sequence .sc-node + .sc-node::before { content: '↓'; position: absolute; bottom: calc(100% + .1rem); left: 1rem; height: 1.4rem; font-size: 1.2rem; font-weight: 650; }
.sc-sequence .sc-node:last-child { background: var(--cf-brass-soft); }
.sc-template-paper { position: relative; background: var(--cf-page); padding: 1.5rem 1rem 1rem; border: 1px solid var(--cf-ink); border-radius: 5px; }
.sc-template-paper > strong { display: block; font-size: .9rem; margin-bottom: .8rem; line-height: 1.5; }
.sc-tab { display: inline-block; padding: .15rem .5rem; border: 1px solid var(--cf-ink); border-radius: 3px; background: var(--cf-brass-soft); font-size: .6rem; line-height: 1.5; font-weight: 700; }
.sc-template-paper > .sc-tab, .sc-ai-brief > .sc-tab { position: absolute; top: -.7rem; left: 1rem; }
.sc-paper-row { display: flex; justify-content: space-between; gap: 1rem; padding: .6rem; margin-top: .5rem; border: 1px solid var(--cf-border); border-radius: 4px; background: var(--cf-surface); font-size: .75rem; }
.sc-paper-row b { flex-shrink: 0; }
.sc-down { text-align: center; font-size: 1.4rem; font-weight: 650; margin: .5rem 0; line-height: 1.4; }
.sc-schedule-title { font-size: .9rem; font-weight: 750; margin-bottom: 1rem; }
.sc-schedule > div { display: flex; align-items: center; gap: .8rem; padding: .9rem .65rem; border: 1px solid var(--cf-border); background: var(--cf-page); border-radius: 4px; margin-top: .6rem; }
.sc-calendar-icon { font-size: 1.4rem; color: var(--cf-brass-text); }
.sc-schedule strong { display: block; font-size: .75rem; }
.sc-schedule small { display: block; color: var(--cf-muted); font-size: .65rem; }
.sc-schedule b { margin-left: auto; font-size: .6rem; padding: .15rem .3rem; background: var(--cf-brass-soft); border-radius: 3px; }
.sc-link-bar { border: 1px solid var(--cf-ink); border-radius: 4px; background: var(--cf-brass-soft); padding: .75rem; display: flex; justify-content: center; gap: .6rem; font-size: .8rem; font-weight: 700; }
.sc-device-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; text-align: center; padding-top: .5rem; }
.sc-device-grid strong { display: block; font-size: .65rem; margin-top: .7rem; }
.sc-device { display: flex; align-items: flex-end; justify-content: center; border: 2px solid var(--cf-ink); background: var(--cf-page); padding: 5px; margin: 0 auto; width: 36px; height: 55px; border-radius: 5px; }
.sc-device i { display: block; width: 80%; height: 65%; border: 1px solid var(--cf-ink); background: var(--cf-brass-soft); border-radius: 2px; }
.sc-device-tablet { width: 55px; }
.sc-device-computer { width: 70px; height: 48px; margin-top: 7px; border-bottom-width: 5px; }
.sc-role-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }
.sc-role-grid > span { padding: .4rem .65rem; font-size: .65rem; border: 1px solid var(--cf-ink); border-radius: 4px; background: var(--cf-page); }
.sc-folder-paper { background: var(--cf-brass-wash); }
.sc-question-paper { border: 1px solid var(--cf-border); background: var(--cf-page); border-radius: 5px; padding: 1rem; font-size: .8rem; }
.sc-question-field { margin-top: 1rem; }
.sc-question-field > span, .sc-question-field > small { display: block; font-size: .7rem; }
.sc-question-field > i { display: block; height: 30px; background: var(--cf-surface); border: 1px solid var(--cf-border); border-radius: 4px; margin: .35rem 0; }
.sc-question-field > small { font-size: .6rem; color: var(--cf-muted); }
.sc-mail { border: 1px solid var(--cf-ink); border-radius: 6px; overflow: hidden; background: #fff; }
.sc-mail-top { display: flex; align-items: center; gap: .6rem; background: var(--cf-ink); color: #fff; padding: 1rem; font-size: .8rem; }
.sc-mail p { margin: .75rem 1rem; font-size: .75rem; }
.sc-mail p.sc-mail-subject { font-size: .85rem; font-weight: 750; }
.sc-mail-choice { border-left: 3px solid var(--cf-brass); margin: 1rem; background: var(--cf-page); padding: .8rem; }
.sc-mail-choice strong, .sc-mail-choice span { display: block; font-size: .75rem; }
.sc-mail-choice span { font-size: .65rem; color: var(--cf-muted); }
.sc-mail-link { display: block; font-size: .7rem; text-decoration: underline; margin: 1rem; }
.sc-export-table { width: 100%; font-size: .7rem; margin-top: 1rem; }
.sc-export-table caption { caption-side: top; font-size: .65rem; color: var(--cf-muted); padding-bottom: .7rem; }
.sc-export-table th, .sc-export-table td { padding: .65rem .4rem; border-bottom: 1px solid var(--cf-border); }
.sc-export-table th { background: var(--cf-page); }
.sc-export-table th:last-child, .sc-export-table td:last-child { text-align: right; }
.sc-ai-brief { position: relative; padding: 1.25rem 1rem 1rem; background: var(--cf-page); border: 1px solid var(--cf-ink); border-radius: 4px; margin-top: 1rem; }
.sc-ai-brief p { font-size: .8rem; margin-bottom: .4rem; }
.sc-ai-brief small { font-size: .65rem; color: var(--cf-muted); }
.sc-theme-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .7rem; margin-bottom: 1.5rem; }
.sc-theme { --theme: #35734f; --paper: #e7efe7; border: 1px solid var(--theme); background: var(--paper); padding: .75rem .5rem; text-align: center; border-radius: 5px; }
.sc-theme-brass { --theme: #8e711c; --paper: #f3ecd2; }
.sc-theme-rose { --theme: #9e4460; --paper: #f6e6eb; }
.sc-theme strong { display: block; color: var(--theme); font-size: .6rem; }
.sc-theme-sheet { display: block; border-top: 12px solid var(--theme); border-radius: 3px; background: #fff; padding: .6rem; margin: 0 auto .6rem; }
.sc-theme-sheet i { display: block; background: var(--paper); height: 10px; margin: 5px 0; border-left: 3px solid var(--theme); }
.sc-use-art { background: var(--cf-page); min-height: 180px; justify-content: flex-start; padding: 1.2rem; }
.sc-use-art > .dp-mini-heading { margin-bottom: .4rem; }
.sc-use-art > strong { font-size: .85rem; line-height: 1.5; margin-bottom: .8rem; }
.sc-use-row { display: flex; justify-content: space-between; align-items: center; gap: .6rem; padding: .6rem; border: 1px solid var(--cf-border); background: var(--cf-surface); margin-top: .4rem; border-radius: 4px; }
.sc-use-row > span { font-size: .65rem; line-height: 1.5; }
.sc-use-row > b { font-size: .6rem; white-space: nowrap; font-weight: 600; }
.sc-embed-page { border: 1px solid var(--cf-ink); border-radius: 5px; background: var(--cf-page); overflow: hidden; padding-bottom: 1rem; }
.sc-embed-bar { padding: .6rem .9rem; background: var(--cf-surface); border-bottom: 1px solid var(--cf-ink); font-size: .65rem; }
.sc-embed-page > strong { display: block; font-size: 1.1rem; padding: 1rem; }
.sc-embed-sheet { margin: 0 1rem; background: #fff; border: 1px solid var(--cf-border); border-radius: 4px; overflow: hidden; padding-bottom: .5rem; }
.sc-embed-sheet-title { padding: .75rem; background: var(--cf-ink); color: #fff; font-size: .7rem; font-weight: 700; }
.sc-embed-sheet .sc-paper-row { margin: .5rem .5rem 0; align-items: center; font-size: .65rem; }
.sc-embed-sheet .sc-paper-row small { display: block; font-size: .6rem; color: var(--cf-muted); }
.sc-embed-sheet b { font-size: .55rem; }
@media (max-width: 767.98px) {
  .sc-feature-strip dl { grid-template-columns: 1fr 1fr; }
  .sc-feature-strip dl > div:last-child { grid-column: 1 / -1; }
  .sc-visual { padding: 1.25rem; }
  .sc-feature-story h2 { max-width: none; }
  .sc-use-art { min-height: 190px; }
  .sc-theme-grid { gap: .5rem; }
  .sc-theme { padding-inline: .3rem; }
}
