/**
 * PCE.DOCS-PRODUCT.V1 — scoped body styles for product doc pages:
 *   /docs/confidential, /docs/confidential-offer, /docs/stablecoin
 *
 * Derived from the standalone marketing mocks (swapcoin-confidential.html,
 * swapcoin-confidential-offer.html, swapcoin-stablecoin.html). All site-chrome
 * (nav bar, burger, dropdown, footer) and global html/body/* resets have been
 * stripped — this file only ever touches descendants of .pce-docs-product so
 * it is safe to load inside the app shell.
 *
 * Reveal-on-scroll is progressive: content is visible by default (no-JS /
 * reduced-motion safe). Only when .js-reveal is added to the root (by
 * pce-docs-product-reveal.js) do .reveal elements start hidden until they
 * gain .is-visible.
 */

.pce-docs-product {
  --background: #0a0d0a;
  --foreground: #f4f8f4;
  --card: rgba(16, 38, 18, 0.55);
  --card-foreground: #f4f8f4;
  --primary: #36a928;
  --primary-bright: #7ced40;
  --primary-foreground: #ffffff;
  --secondary: rgba(20, 42, 22, 0.5);
  --secondary-foreground: #f4f8f4;
  --muted: rgba(22, 46, 24, 0.5);
  --muted-foreground: #9aa79c;
  --accent: rgba(18, 42, 14, 0.5);
  --accent-foreground: #c8f5a8;
  --border: #1f2a20;
  --ring: #7ced40;
  --radius: 0.625rem;
  --card-radius: 24px;

  color: var(--foreground);
  font-size: 16px;
  font-weight: 300;
  line-height: 1.5;
}

.pce-docs-product ::selection { background: rgba(124, 237, 64, .35); }
.pce-docs-product a { color: inherit; text-decoration: none; }
.pce-docs-product h1,
.pce-docs-product h2,
.pce-docs-product h3,
.pce-docs-product .sans {
  font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, system-ui, sans-serif;
  font-weight: 400;
}

.pce-docs-product .container { width: 100%; max-width: 1080px; margin: 0 auto; padding: 0 1.5rem; }
.pce-docs-product .grad { background: linear-gradient(90deg, #36a928, #7ced40); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ============================================================
   Buttons / badges / cards
   ============================================================ */
.pce-docs-product .btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; border: 1px solid transparent; border-radius: 18px; font-family: inherit; font-size: .8125rem; font-weight: 400; padding: .625rem 1.25rem; cursor: pointer; transition: background .15s, transform .1s, box-shadow .15s; white-space: nowrap; }
.pce-docs-product .btn:active { transform: translateY(1px); }
.pce-docs-product .btn-lg { padding: .875rem 1.75rem; font-size: .9375rem; border-radius: 20px; }
.pce-docs-product .btn-primary { background: linear-gradient(180deg, #36a928, #1e5d16); color: #ffffff; }
.pce-docs-product .btn-secondary { background: var(--secondary); color: var(--secondary-foreground); }
.pce-docs-product .btn-secondary:hover { background: #262b26; }
.pce-docs-product .btn-outline { background: transparent; color: var(--foreground); border-color: var(--border); }
.pce-docs-product .btn-outline:hover { background: var(--muted); }

.pce-docs-product .badge { display: inline-flex; align-items: center; gap: .375rem; padding: .25rem .625rem; border-radius: 9999px; font-size: .625rem; letter-spacing: .08em; text-transform: uppercase; }
.pce-docs-product .badge-outline { background: transparent; border: 1px solid var(--border); color: var(--muted-foreground); }
.pce-docs-product .badge-accent { background: var(--accent); color: var(--accent-foreground); }

.pce-docs-product .card { background: rgba(16, 38, 18, 0.28); border: 1px solid var(--border); border-radius: var(--card-radius); overflow: hidden; backdrop-filter: blur(10px) saturate(1.2); -webkit-backdrop-filter: blur(10px) saturate(1.2); }
.pce-docs-product .card-hover { transition: border-color .2s, transform .2s, box-shadow .2s; }
.pce-docs-product .card-hover:hover { border-color: rgba(124, 237, 64, .5); transform: translateY(-3px); box-shadow: 0 12px 32px rgba(0, 0, 0, .35); }
.pce-docs-product .card-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--border); }
.pce-docs-product .card-meta { font-size: .6875rem; color: var(--muted-foreground); }
.pce-docs-product .card-body { padding: 1.25rem; }

/* ============================================================
   Reveal-on-scroll — progressive, no-JS-safe
   ============================================================ */
.pce-docs-product .reveal { opacity: 1; transform: none; transition: opacity .55s ease, transform .55s ease; }
.pce-docs-product.js-reveal .reveal { opacity: 0; transform: translateY(14px); }
.pce-docs-product.js-reveal .reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .pce-docs-product.js-reveal .reveal { opacity: 1; transform: none; transition: none; }
}

/* ============================================================
   Hero
   ============================================================ */
/* Hero inherits the shared PCE/public shell surface — no page-local backdrop layer. */
.pce-docs-product .hero { display: flex; align-items: center; justify-content: center; padding: 3rem 0 3.5rem; text-align: center; }
.pce-docs-product .hero .inner { max-width: 56rem; margin: 0 auto; }
.pce-docs-product .hero h1 { font-size: clamp(2.5rem, 6.5vw, 4.5rem); font-weight: 400; letter-spacing: -.035em; line-height: 1.05; }
.pce-docs-product .hero p { font-size: 1.15rem; color: var(--muted-foreground); max-width: 42rem; margin: 1.25rem auto 0; line-height: 1.6; }
.pce-docs-product .hero-actions { display: inline-flex; gap: .75rem; margin-top: 2rem; flex-wrap: wrap; justify-content: center; }
.pce-docs-product .hero-proof { display: flex; justify-content: center; gap: .65rem; flex-wrap: wrap; margin-bottom: 1.25rem; }

.pce-docs-product .stat-card { background: rgba(16, 38, 18, 0.28); border: 1px solid var(--border); border-radius: var(--card-radius); padding: 1.5rem 1.5rem; box-shadow: none; text-align: center; }
.pce-docs-product .stat-value { font-size: 2.5rem; font-weight: 400; letter-spacing: -.03em; font-family: 'IBM Plex Sans', sans-serif; color: var(--primary); }
.pce-docs-product .stat-hint { font-size: .6875rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted-foreground); margin-top: .25rem; }

/* hero stat strip */
.pce-docs-product .hero-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; max-width: 54rem; margin: 2.75rem auto 0; }
.pce-docs-product .hero-stats .stat-card { padding: 1.125rem 1rem; }
.pce-docs-product .hero-stats .stat-value { font-size: 1.75rem; }

/* ============================================================
   Sections
   ============================================================ */
.pce-docs-product .section { padding: 4rem 0; }
.pce-docs-product .section.alt { background: transparent; }
.pce-docs-product .sec-head { text-align: center; max-width: 46rem; margin: 0 auto 3rem; }
.pce-docs-product .sec-head .badge { margin-bottom: 1rem; }
.pce-docs-product .sec-head h2 { font-size: clamp(1.75rem, 3.5vw, 2.5rem); font-weight: 400; letter-spacing: -.02em; }
.pce-docs-product .sec-head p { color: var(--muted-foreground); margin-top: .75rem; line-height: 1.6; }

.pce-docs-product .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.pce-docs-product .grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.pce-docs-product .grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; }

/* feature card with top icon */
.pce-docs-product .feature { padding: 1.5rem; }
.pce-docs-product .feature .icon { width: 3rem; height: 3rem; border-radius: 1rem; background: var(--accent); color: var(--primary); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 1rem; }
.pce-docs-product .feature h3 { font-size: 1rem; font-weight: 400; }
.pce-docs-product .feature p { color: var(--muted-foreground); font-size: .875rem; margin-top: .375rem; line-height: 1.55; }

/* horizontal feature (icon left) */
.pce-docs-product .hfeature { display: flex; gap: 1rem; align-items: flex-start; padding: 1.25rem 1.5rem; }
.pce-docs-product .hfeature .icon { width: 2.75rem; height: 2.75rem; border-radius: .875rem; background: var(--accent); color: var(--primary); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pce-docs-product .hfeature h3 { font-size: 1rem; font-weight: 400; }
.pce-docs-product .hfeature p { color: var(--muted-foreground); font-size: .875rem; margin-top: .25rem; line-height: 1.55; }

/* numbered steps */
.pce-docs-product .steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; counter-reset: step; }
.pce-docs-product .step { padding: 1.5rem; position: relative; }
.pce-docs-product .step .num { font-family: 'IBM Plex Sans', sans-serif; font-size: .75rem; font-weight: 400; color: var(--primary); letter-spacing: .08em; display: inline-flex; align-items: center; gap: .5rem; margin-bottom: 1rem; }
.pce-docs-product .step .num .ic { width: 2.5rem; height: 2.5rem; border-radius: .875rem; background: var(--primary); color: var(--primary-foreground); display: inline-flex; align-items: center; justify-content: center; }
.pce-docs-product .step h3 { font-size: 1rem; font-weight: 400; }
.pce-docs-product .step p { color: var(--muted-foreground); font-size: .875rem; margin-top: .375rem; line-height: 1.55; }
.pce-docs-product .step .act { margin-top: 1rem; }

/* faq */
.pce-docs-product .faq-list { max-width: 46rem; margin: 0 auto; }
.pce-docs-product .faq { border: 1px solid var(--border); border-radius: 1.125rem; background: rgba(16, 38, 18, 0.28); margin-bottom: .75rem; overflow: hidden; }
.pce-docs-product .faq summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 1rem; padding: 1.125rem 1.25rem; font-family: 'IBM Plex Sans', sans-serif; font-weight: 400; font-size: .9375rem; }
.pce-docs-product .faq summary::-webkit-details-marker { display: none; }
.pce-docs-product .faq[open] summary { color: var(--primary); }
.pce-docs-product .faq .tog { margin-left: auto; color: var(--muted-foreground); transition: transform .2s; }
.pce-docs-product .faq[open] .tog { transform: rotate(45deg); color: var(--primary); }
.pce-docs-product .faq .ans { padding: 0 1.25rem 1.125rem; color: var(--muted-foreground); font-size: .875rem; line-height: 1.6; }

/* CTA */
.pce-docs-product .cta { background: transparent; color: var(--card-foreground); text-align: center; padding: 4.5rem 1.25rem; width: 100%; }
.pce-docs-product .cta h2 { font-size: clamp(1.75rem, 4vw, 2.75rem); font-weight: 400; letter-spacing: -.03em; }
.pce-docs-product .cta p { color: var(--muted-foreground); max-width: 30rem; margin: 1rem auto 2rem; line-height: 1.6; }

@media (max-width: 1024px) {
  .pce-docs-product .grid-3,
  .pce-docs-product .steps { grid-template-columns: repeat(2, 1fr); }
  .pce-docs-product .grid-4 { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
  .pce-docs-product .grid-2,
  .pce-docs-product .grid-3 { grid-template-columns: 1fr; }
  .pce-docs-product .steps { grid-template-columns: 1fr; }
  .pce-docs-product .grid-4 { grid-template-columns: 1fr; }
  .pce-docs-product .hide-mobile { display: none !important; }
  .pce-docs-product .container { padding: 0 1.15rem; }
  .pce-docs-product .hero { padding: 2.5rem 0 3rem; }
  .pce-docs-product .hero h1 { font-size: clamp(2rem, 9vw, 3rem); }
  .pce-docs-product .hero p { font-size: 1rem; }
  .pce-docs-product .section { padding: 3rem 0; }
  .pce-docs-product .sec-head h2 { font-size: clamp(1.5rem, 6vw, 2rem); }
  .pce-docs-product .cta { padding: 3rem 1.25rem !important; }
  .pce-docs-product .hero-stats { grid-template-columns: repeat(2, 1fr); }
}

/* ============================================================
   Confidential / offer / stablecoin — page-local additions
   (cf-* confidential, of-* offer, sc-* stablecoin, shared below)
   ============================================================ */
.pce-docs-product .rich-link { color: var(--primary-bright); text-decoration: underline; text-underline-offset: 3px; transition: color .15s; }
.pce-docs-product .rich-link:hover { color: var(--primary); }
.pce-docs-product .rule { background: var(--border); height: 1px; }

/* tone variants */
.pce-docs-product .cf-badge-warn,
.pce-docs-product .of-badge-warn { background: rgba(253, 230, 138, .10); color: #fde68a; }
.pce-docs-product .cf-card--warn,
.pce-docs-product .of-card--warn { border-color: rgba(253, 230, 138, .26); background: linear-gradient(180deg, rgba(253, 230, 138, .07), rgba(16, 38, 18, .28)); }
.pce-docs-product .cf-card--ok,
.pce-docs-product .of-card--ok { border-color: rgba(124, 237, 64, .30); background: linear-gradient(180deg, rgba(124, 237, 64, .09), rgba(16, 38, 18, .28)); }

/* flow diagrams: origin -> hub -> destination (confidential / offer / stablecoin) */
.pce-docs-product .cf-flow,
.pce-docs-product .of-flow,
.pce-docs-product .sc-flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: .75rem; }
.pce-docs-product .cf-node,
.pce-docs-product .of-node,
.pce-docs-product .sc-node { padding: 1.5rem 1.25rem; border: 1px solid var(--border); border-radius: 20px; background: rgba(16, 38, 18, 0.28); text-align: center; }
.pce-docs-product .cf-node--hub,
.pce-docs-product .of-node--hub,
.pce-docs-product .sc-node--hub { border-color: rgba(124, 237, 64, .38); background: linear-gradient(180deg, rgba(124, 237, 64, .10), rgba(16, 38, 18, .28)); }
.pce-docs-product .cf-node .icon,
.pce-docs-product .of-node .icon,
.pce-docs-product .sc-node .icon { width: 2.75rem; height: 2.75rem; border-radius: .875rem; background: var(--accent); color: var(--primary); display: inline-flex; align-items: center; justify-content: center; margin-bottom: .875rem; }
.pce-docs-product .cf-node-tag,
.pce-docs-product .of-node-tag,
.pce-docs-product .sc-node-tag { display: block; font-size: .625rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted-foreground); margin-bottom: .375rem; }
.pce-docs-product .cf-node h3,
.pce-docs-product .of-node h3,
.pce-docs-product .sc-node h3 { font-size: .9375rem; font-weight: 400; }
.pce-docs-product .cf-node p,
.pce-docs-product .of-node p,
.pce-docs-product .sc-node p { color: var(--muted-foreground); font-size: .8125rem; margin-top: .375rem; line-height: 1.55; }
.pce-docs-product .cf-link,
.pce-docs-product .of-link,
.pce-docs-product .sc-link { display: flex; flex-direction: column; align-items: center; gap: .5rem; width: 6.5rem; }
.pce-docs-product .cf-link svg,
.pce-docs-product .of-link svg,
.pce-docs-product .sc-link svg { width: 100%; height: 18px; }
.pce-docs-product .cf-link span,
.pce-docs-product .of-link span,
.pce-docs-product .sc-link span { font-size: .625rem; letter-spacing: .06em; text-transform: uppercase; color: var(--muted-foreground); text-align: center; line-height: 1.4; }
.pce-docs-product .cf-caption,
.pce-docs-product .sc-caption { text-align: center; color: var(--muted-foreground); font-size: .875rem; max-width: 46rem; margin: 2rem auto 0; line-height: 1.65; }
@media (max-width: 900px) {
  .pce-docs-product .cf-flow,
  .pce-docs-product .of-flow,
  .pce-docs-product .sc-flow { grid-template-columns: 1fr; }
  .pce-docs-product .cf-link,
  .pce-docs-product .of-link,
  .pce-docs-product .sc-link { width: 100%; }
  .pce-docs-product .cf-link svg,
  .pce-docs-product .of-link svg,
  .pce-docs-product .sc-link svg { width: 132px; height: 18px; }
}

/* data tables (confidential / offer / stablecoin) */
.pce-docs-product .cf-table-wrap,
.pce-docs-product .of-table-wrap,
.pce-docs-product .sc-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-top: 1.5rem; }
.pce-docs-product .cf-table,
.pce-docs-product .of-table,
.pce-docs-product .sc-table { width: 100%; min-width: 320px; border-collapse: collapse; font-size: .875rem; }
.pce-docs-product .cf-table--wide,
.pce-docs-product .of-table--wide { min-width: 760px; }
.pce-docs-product .cf-table th, .pce-docs-product .cf-table td,
.pce-docs-product .of-table th, .pce-docs-product .of-table td,
.pce-docs-product .sc-table th, .pce-docs-product .sc-table td { text-align: left; padding: .8rem .85rem; border-bottom: 1px solid rgba(255, 255, 255, .1); vertical-align: top; }
.pce-docs-product .cf-table th,
.pce-docs-product .of-table th,
.pce-docs-product .sc-table th { font-weight: 400; font-size: .6875rem; letter-spacing: .08em; text-transform: uppercase; color: var(--foreground); }
.pce-docs-product .cf-table td,
.pce-docs-product .of-table td,
.pce-docs-product .sc-table td { color: var(--muted-foreground); line-height: 1.55; }
.pce-docs-product .cf-table td:first-child,
.pce-docs-product .of-table td:first-child,
.pce-docs-product .sc-table td:first-child { color: var(--foreground); white-space: nowrap; }
.pce-docs-product .cf-table tr:last-child td,
.pce-docs-product .of-table tr:last-child td,
.pce-docs-product .sc-table tr:last-child td { border-bottom: none; }
.pce-docs-product .cf-table .cf-no,
.pce-docs-product .of-table .of-no { color: #fde68a; }
.pce-docs-product .cf-table-note,
.pce-docs-product .of-table-note,
.pce-docs-product .sc-table-note { color: var(--muted-foreground); font-size: .8125rem; margin-top: 1.25rem; line-height: 1.6; }

/* checklists (hides / does-not-hide / covered / not-covered) */
.pce-docs-product .cf-list,
.pce-docs-product .of-list,
.pce-docs-product .sc-list { list-style: none; margin: 1.25rem 0 0; padding: 0; }
.pce-docs-product .cf-list li,
.pce-docs-product .of-list li,
.pce-docs-product .sc-list li { display: flex; gap: .75rem; align-items: flex-start; padding: .7rem 0; border-bottom: 1px solid rgba(255, 255, 255, .08); color: var(--muted-foreground); font-size: .875rem; line-height: 1.6; }
.pce-docs-product .cf-list li:last-child,
.pce-docs-product .of-list li:last-child,
.pce-docs-product .sc-list li:last-child { border-bottom: none; }
.pce-docs-product .cf-list b,
.pce-docs-product .of-list b,
.pce-docs-product .sc-list b { color: var(--foreground); font-weight: 400; }
.pce-docs-product .cf-list-ic,
.pce-docs-product .of-list-ic,
.pce-docs-product .sc-list-ic { flex-shrink: 0; color: var(--primary); margin-top: .1875rem; }
.pce-docs-product .cf-check,
.pce-docs-product .of-check,
.pce-docs-product .sc-check { color: var(--primary); }
.pce-docs-product .cf-check--warn,
.pce-docs-product .of-check--warn,
.pce-docs-product .sc-check--warn { color: #fde68a; }

/* in-page content navigation */
.pce-docs-product .pagenav { position: sticky; top: 0; z-index: 20; display: flex; justify-content: center; gap: .375rem; flex-wrap: wrap; padding: .75rem 0; background: rgba(10, 15, 10, .82); backdrop-filter: blur(18px) saturate(1.4); -webkit-backdrop-filter: blur(18px) saturate(1.4); border-bottom: 1px solid var(--border); }
.pce-docs-product .pagenav a { display: inline-flex; align-items: center; gap: .4375rem; padding: .4375rem .75rem; border-radius: 999px; border: 1px solid transparent; color: var(--muted-foreground); font-family: 'IBM Plex Sans', sans-serif; font-size: .75rem; transition: color .15s, border-color .15s, background .15s; }
.pce-docs-product .pagenav a svg { width: 14px; height: 14px; flex-shrink: 0; }
.pce-docs-product .pagenav a:hover { color: var(--foreground); border-color: var(--border); background: rgba(124, 237, 64, .06); }

/* grouped feature blocks */
.pce-docs-product .group + .group { margin-top: 2.75rem; }
.pce-docs-product .group-head { display: flex; align-items: center; gap: .875rem; margin-bottom: 1.25rem; }
.pce-docs-product .group-head .ic { width: 2.25rem; height: 2.25rem; border-radius: .75rem; background: var(--accent); color: var(--primary); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pce-docs-product .group-head h3 { font-size: .75rem; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; color: var(--primary); white-space: nowrap; }
.pce-docs-product .group-head .rule { flex: 1; height: 1px; min-width: 1rem; background: linear-gradient(90deg, rgba(124, 237, 64, .28), transparent); }

/* inline code / API parameters */
.pce-docs-product code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8125em; color: #a7f06b; background: rgba(124, 237, 64, .1); border: 1px solid rgba(124, 237, 64, .16); border-radius: .375rem; padding: .0625rem .3125rem; white-space: nowrap; }

/* cross-link banner */
.pce-docs-product .xlink { display: flex; gap: 1.5rem; align-items: center; padding: 2rem; border: 1px solid rgba(124, 237, 64, .2); border-radius: 1.5rem; background: linear-gradient(120deg, rgba(124, 237, 64, .07), rgba(16, 38, 18, .28)); }
.pce-docs-product .xlink .ic { width: 3.25rem; height: 3.25rem; border-radius: 1.125rem; background: rgba(124, 237, 64, .14); color: var(--primary); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pce-docs-product .xlink-body { flex: 1; }
.pce-docs-product .xlink h3 { font-size: 1.125rem; font-weight: 400; }
.pce-docs-product .xlink p { color: var(--muted-foreground); font-size: .875rem; margin-top: .375rem; line-height: 1.6; }
.pce-docs-product .xlink .act { flex-shrink: 0; }
@media (max-width: 640px) {
  .pce-docs-product .xlink { flex-direction: column; text-align: center; padding: 1.5rem; }
}

/* promotional offer block (confidential-offer, and the mirrored teaser on confidential) */
.pce-docs-product .promo { position: relative; overflow: hidden; display: flex; align-items: center; gap: 2.25rem; padding: 2.5rem; border: 1px solid rgba(124, 237, 64, .3); border-radius: 1.5rem; background: linear-gradient(115deg, rgba(124, 237, 64, .13), rgba(16, 38, 18, .3) 55%, rgba(54, 169, 40, .07)); }
.pce-docs-product .promo::before { content: ''; position: absolute; inset: 0; background: radial-gradient(60% 130% at 10% 0%, rgba(124, 237, 64, .16), transparent 70%); pointer-events: none; }
.pce-docs-product .promo > * { position: relative; z-index: 1; }
.pce-docs-product .promo-badge { display: inline-flex; align-items: center; gap: .5rem; padding: .4375rem .75rem; border-radius: 999px; border: 1px solid rgba(124, 237, 64, .34); background: rgba(124, 237, 64, .12); color: #a7f06b; font-size: .6875rem; letter-spacing: .1em; text-transform: uppercase; }
.pce-docs-product .promo-rate { display: flex; align-items: baseline; gap: .75rem; margin-top: 1.125rem; }
.pce-docs-product .promo-rate .big { font-family: 'IBM Plex Sans', sans-serif; font-size: clamp(3rem, 7vw, 4.25rem); line-height: 1; letter-spacing: -.04em; color: var(--primary); }
.pce-docs-product .promo-rate .was { font-size: 1.125rem; color: var(--muted-foreground); text-decoration: line-through; }
.pce-docs-product .promo h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); margin-top: 1.125rem; }
.pce-docs-product .promo p { color: var(--muted-foreground); font-size: .9375rem; margin-top: .625rem; line-height: 1.6; max-width: 34rem; }
.pce-docs-product .promo-list { list-style: none; margin: 1.25rem 0 0; padding: 0; }
.pce-docs-product .promo-list li { display: flex; gap: .625rem; align-items: flex-start; font-size: .875rem; color: var(--muted-foreground); line-height: 1.6; margin-top: .5rem; }
.pce-docs-product .promo-list svg { flex-shrink: 0; color: var(--primary); margin-top: .1875rem; }
.pce-docs-product .promo-dead { display: flex; align-items: center; gap: .5rem; margin-top: 1.5rem; font-size: .75rem; letter-spacing: .04em; color: var(--muted-foreground); }
.pce-docs-product .promo-dead b { color: var(--foreground); font-weight: 400; }
.pce-docs-product .promo-body { flex: 1; }
.pce-docs-product .promo-act { flex-shrink: 0; width: 15rem; }
.pce-docs-product .promo-act .btn { width: 100%; }
.pce-docs-product .promo-fine { font-size: .6875rem; color: var(--muted-foreground); line-height: 1.55; margin-top: 1rem; }
@media (max-width: 900px) {
  .pce-docs-product .promo { flex-direction: column; align-items: flex-start; gap: 1.75rem; padding: 1.75rem; }
  .pce-docs-product .promo-act { width: 100%; }
}

/* stablecoin-only: transfer vs bridge vs confidential comparison table */
.pce-docs-product .cmp-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-top: 1.75rem; border: 1px solid var(--border); border-radius: 1.25rem; background: rgba(16, 38, 18, .2); }
.pce-docs-product .cmp { width: 100%; min-width: 660px; border-collapse: collapse; font-size: .875rem; }
.pce-docs-product .cmp th, .pce-docs-product .cmp td { text-align: left; padding: .9rem 1.125rem; border-bottom: 1px solid rgba(255, 255, 255, .08); vertical-align: top; }
.pce-docs-product .cmp thead th { font-size: .6875rem; letter-spacing: .08em; text-transform: uppercase; color: var(--foreground); background: rgba(124, 237, 64, .05); font-weight: 400; }
.pce-docs-product .cmp thead th:first-child { color: var(--muted-foreground); }
.pce-docs-product .cmp td { color: var(--muted-foreground); line-height: 1.55; }
.pce-docs-product .cmp td b { color: var(--foreground); font-weight: 400; }
.pce-docs-product .cmp tbody th { text-align: left; font-family: 'IBM Plex Sans', sans-serif; font-weight: 400; color: var(--foreground); font-size: .8125rem; }
.pce-docs-product .cmp tbody tr:last-child th,
.pce-docs-product .cmp tbody tr:last-child td { border-bottom: none; }
.pce-docs-product .cmp .yes { color: var(--primary); }
.pce-docs-product .cmp .no { color: #f87171; }
.pce-docs-product .cmp .mid { color: #fde68a; }

@media (max-width: 640px) {
  .pce-docs-product .pagenav { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .pce-docs-product .pagenav a { white-space: nowrap; }
}