/* Product/feature pages: explicit surface and text pairs from shared tokens.
   Loaded last and scoped to these five routes. */
.wc-public-v2.wc-product-pages{--product-on-dark:#fff;--product-muted-on-dark:#e2ddef;--product-link-on-dark:#b9e8ff}
.wc-product-pages .product-icon{display:block;width:26px;height:26px;flex:0 0 auto;max-width:100%}
.wc-product-pages .rv{opacity:1;transform:none}
.wc-product-pages :where(.sol-use-card,.feature-capability,.feature-pillar-card,.feature-related-card,.wc4-family-grid article,.feature-benefit-panel,.feature-truth-card,.sol-detail-card,.sol-compare-card){color:var(--wc-color-text);background:var(--wc-color-surface);border-color:var(--wc-color-border);border-radius:var(--wc-radius-card)}
.wc-product-pages :where(.feature-capability,.sol-use-card,.feature-related-card,.wc4-family-grid article) .product-icon{color:var(--wc-color-primary)}
.wc-product-pages .sol-compare-icon img{display:block;width:32px;height:32px;object-fit:contain}
.wc-product-pages .sol-compare-icon .product-icon{color:var(--wc-color-muted)}
.wc-product-pages .feature-pillar-number{color:var(--wc-color-muted);font-size:26px}
.wc-product-pages .sol-hero-grid,.wc-product-pages .feature-detail-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:42px}
.wc-product-pages :where(.sol-hero-copy,.feature-detail-copy,.features-hero-copy){min-width:0}
.wc-product-pages :where(.sol-hero-copy h1,.feature-detail-copy h1,.features-hero-copy h1){text-wrap:balance;letter-spacing:normal}
.wc-product-pages :where(.prose,.feature-detail-copy,.features-hero-copy)>p{color:var(--wc-color-muted);line-height:2}
.wc-product-pages :where(.sol-use-card,.feature-capability,.feature-related-card,.feature-pillar-card,.feature-truth-card) :where(p,small){line-height:1.95}

/* Dark components retain readable headings, copy, and links. */
.wc-public-v2.wc-product-pages .sol-flow{background:var(--wc-color-heading);color:var(--product-on-dark)}
.wc-public-v2.wc-product-pages .sol-flow :where(.sec-title,h3){color:var(--product-on-dark)}
.wc-public-v2.wc-product-pages .sol-flow :where(.sec-sub,p){color:var(--product-muted-on-dark)}
.wc-public-v2.wc-product-pages .sol-flow .sec-tag{color:var(--product-link-on-dark)}
.wc-public-v2.wc-product-pages .sol-flow-grid li{background:#ffffff0e;border-color:#ffffff30;box-shadow:none}
.wc-public-v2.wc-product-pages .sol-definition-card{background:var(--wc-color-heading);color:var(--product-on-dark)}
.wc-public-v2.wc-product-pages .sol-definition-card :where(h3,b){color:var(--product-on-dark)}
.wc-public-v2.wc-product-pages .sol-definition-card small{color:var(--product-muted-on-dark)}
.wc-public-v2.wc-product-pages .feature-note-card{color:var(--product-on-dark);background:var(--wc-color-heading)}
.wc-public-v2.wc-product-pages .feature-note-card h3{color:var(--product-on-dark)}
.wc-public-v2.wc-product-pages .feature-note-card p{color:var(--product-muted-on-dark)}
.wc-public-v2.wc-product-pages .feature-note-card a{color:var(--product-link-on-dark);text-decoration:underline;text-underline-offset:4px}
.wc-public-v2.wc-product-pages .cta-band :where(h2,.cta-title){color:var(--product-on-dark)}
.wc-public-v2.wc-product-pages .cta-band .cta-sub{color:var(--product-muted-on-dark)}
.wc-product-pages :where(.sol-flow-grid,.offline-flow-grid) li{min-width:0}
.wc-product-pages .sol-detail-visual .product-icon{width:27px;height:27px}
.wc-product-pages .sol-arrow .product-icon{width:18px;height:18px}
.wc-product-pages .sol-device{color:#fff;background:var(--wc-color-heading);padding:0}
.wc-product-pages .sol-device .product-icon{width:23px;height:23px;color:#fff}
.wc-product-pages .feature-truth-card>div>span{background:var(--wc-color-primary-soft)}
.wc-product-pages .feature-truth-card .product-icon{width:19px;height:19px;color:var(--wc-color-primary)}

/* Light graphics must not inherit the legacy white text. */
.wc-public-v2.wc-product-pages .features-system-map{color:var(--wc-color-heading);background:var(--wc-color-primary-soft);border-color:var(--wc-color-border-primary);box-shadow:var(--wc-shadow-md)}
.wc-product-pages .features-system-map::before{border-color:var(--wc-color-border-strong);animation:none}
.wc-public-v2.wc-product-pages :where(.features-map-center,.features-map-node){background:var(--wc-color-surface);border-color:var(--wc-color-border-primary);box-shadow:var(--wc-shadow-md);color:var(--wc-color-heading)}
.wc-public-v2.wc-product-pages .features-system-map :where(.features-map-center,.features-map-node) :where(b,strong){color:var(--wc-color-heading)}
.wc-public-v2.wc-product-pages .features-map-center strong span{color:var(--wc-color-primary)}
.wc-public-v2.wc-product-pages :where(.features-map-center,.features-map-node) small{color:var(--wc-color-muted);font-size:12px}
.wc-product-pages .features-map-node>span{background:var(--wc-color-primary-soft);color:var(--wc-color-primary)}
.wc-public-v2.wc-product-pages .offline-diagram{color:var(--wc-color-text);background:var(--wc-color-surface);border-color:var(--wc-color-border-primary);box-shadow:var(--wc-shadow-md)}
.wc-product-pages .offline-cloud{color:var(--wc-color-heading);background:var(--wc-color-primary-soft);border-color:var(--wc-color-border-primary)}
.wc-product-pages .offline-cloud>span{display:flex;justify-content:center;margin-bottom:8px;color:var(--wc-color-primary)}
.wc-public-v2.wc-product-pages .offline-cloud small,.wc-public-v2.wc-product-pages .offline-sync span{color:var(--wc-color-muted);font-size:12px}
.wc-public-v2.wc-product-pages .offline-cloud small{color:var(--wc-color-text)}
.wc-product-pages .feature-benefit-row.is-positive span{color:var(--wc-color-primary)}
.wc-product-pages .offline-device{background:var(--wc-color-heading)}
.wc-product-pages .offline-device-screen{background:var(--wc-gradient-primary);color:#fff}
.wc-product-pages .offline-device-screen .product-icon{width:23px;height:23px}
.wc-public-v2.wc-product-pages .offline-storage small{color:var(--product-muted-on-dark);font-size:11px}

/* Actual app screenshots, with no invented dashboard or live status. */
.wc-product-pages .product-app-preview{margin:0;position:relative;padding:26px 0 0 56px;min-width:0}
.product-tv-frame{position:relative;overflow:hidden;border:7px solid var(--wc-color-heading);border-radius:18px;background:var(--wc-color-heading);box-shadow:var(--wc-shadow-lg)}
.product-tv-frame img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}
.product-tv-frame::after{content:"";display:block;width:60px;height:4px;margin:8px auto 2px;border-radius:4px;background:#a392bc}
.product-panel-frame{position:relative;width:29%;margin:-12% auto 0 0;border:5px solid var(--wc-color-heading);border-radius:20px;overflow:hidden;background:var(--wc-color-surface);box-shadow:var(--wc-shadow-lg)}
.product-panel-frame img{display:block;width:100%;height:auto}
.product-app-preview figcaption{display:flex;align-items:center;justify-content:center;gap:8px;margin:20px 0 0;font-size:12px;color:var(--wc-color-muted);line-height:1.9}
.product-app-preview figcaption>span{width:7px;height:7px;border-radius:50%;background:var(--wc-color-primary);flex:none}

/* Native responsive graphic explaining the workflow. */
.product-playback-visual,.product-playlist-visual{margin:0;padding:26px;border:1px solid var(--wc-color-border-primary);border-radius:var(--wc-radius-panel);background:var(--wc-color-surface);box-shadow:var(--wc-shadow-lg);color:var(--wc-color-text);min-width:0}
.product-visual-heading{display:flex;align-items:center;gap:12px;padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid var(--wc-color-border)}
.product-visual-heading img{object-fit:contain;flex:none}.product-visual-heading div{display:flex;flex-direction:column;gap:3px}
.product-visual-heading strong{font-size:16px;color:var(--wc-color-heading)}
.product-visual-heading span:not(.product-flow-icon){color:var(--wc-color-muted);font-size:12px;line-height:1.9}
.product-flow-library{display:flex;align-items:center;gap:12px;padding:16px;border:1px solid var(--wc-color-border);border-radius:16px;background:var(--wc-color-surface-soft)}
.product-flow-library>div{flex:1;min-width:0}.product-flow-library b,.product-flow-program b{font-size:13px;color:var(--wc-color-heading)}
.product-flow-library small{display:block;color:var(--wc-color-muted);font-size:11px;margin-top:5px;line-height:1.9}
.product-flow-step{display:inline-grid;place-items:center;flex:none;width:30px;height:30px;border-radius:10px;color:var(--wc-color-primary);background:var(--wc-color-primary-soft);font-weight:800;font-size:14px}
.product-flow-icon{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:12px;background:var(--wc-color-primary-soft);color:var(--wc-color-primary)}
.product-flow-connector{display:flex;flex-direction:column;align-items:center;color:var(--wc-color-primary);height:35px;justify-content:center}
.product-flow-connector>span{display:block;width:1px;height:10px;background:var(--wc-color-border-strong)}
.product-flow-connector .product-icon{width:18px;height:18px}
.product-flow-program{border:1px solid var(--wc-color-border-primary);border-radius:16px;padding:16px}
.product-flow-program-heading{display:flex;align-items:center;gap:10px;margin-bottom:14px}.product-flow-program-heading>.product-icon{margin-inline-start:auto;color:var(--wc-color-primary)}
.product-flow-track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.product-flow-track>span{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 5px;border-radius:12px;background:var(--wc-color-primary-soft);color:var(--wc-color-primary)}
.product-flow-track b{font-size:11px;font-weight:600}
.product-flow-track>span:nth-child(2){background:#edf7ff}.product-flow-track>span:nth-child(3){background:var(--wc-color-surface-soft)}
.product-flow-screen{overflow:hidden;border:5px solid var(--wc-color-heading);border-radius:17px;background:var(--wc-color-heading)}
.product-flow-screen-content{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;min-height:140px;padding:20px;color:#fff;background:var(--wc-gradient-hero)}
.product-flow-screen-content>span{display:grid;place-items:center;width:44px;height:44px;border:1px solid #ffffff60;border-radius:50%;background:#ffffff16}
.product-flow-screen-content strong{color:#fff;font-size:14px}.product-flow-screen-content small{font-size:11px;color:var(--product-muted-on-dark)}
.product-flow-screen-note{display:flex;align-items:center;gap:7px;padding:10px;color:var(--product-muted-on-dark);font-size:10px;line-height:1.8}
.product-flow-screen-note .product-icon{width:17px;height:17px;color:var(--product-link-on-dark)}
.product-playback-visual figcaption,.product-playlist-visual figcaption{display:flex;align-items:flex-start;gap:10px;margin-top:20px;line-height:1.95;font-size:12px;color:var(--wc-color-muted)}
.product-playlist-items{display:grid;gap:12px;list-style:none;margin:0;padding:0}
.product-playlist-items li{display:flex;align-items:center;gap:12px;padding:18px 14px;border-radius:14px;background:var(--wc-color-surface-soft);border:1px solid var(--wc-color-border)}
.product-playlist-items li>div{flex:1;min-width:0}.product-playlist-items b{display:block;color:var(--wc-color-heading);font-size:14px}.product-playlist-items small{display:block;color:var(--wc-color-muted);font-size:12px;margin-top:4px;line-height:1.9}
.product-playlist-items .product-icon{color:var(--wc-color-primary);width:23px;height:23px}
.product-playlist-visual figcaption .product-icon{color:var(--wc-color-primary);width:22px;height:22px}

/* Native disclosure works with JavaScript disabled; schema uses the same text. */
.wc-product-pages .product-faq{background:var(--wc-color-surface-soft)}
.product-faq-list{max-width:900px;margin-inline:auto;display:grid;gap:12px}
.product-faq-item{border:1px solid var(--wc-color-border);border-radius:16px;background:var(--wc-color-surface);color:var(--wc-color-text);overflow:hidden}
.product-faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 24px;cursor:pointer;list-style:none;color:var(--wc-color-heading);font-size:15px;font-weight:700;line-height:1.9}
.product-faq-item summary::-webkit-details-marker{display:none}
.product-faq-item summary:focus-visible{outline:3px solid var(--wc-color-primary);outline-offset:-4px;border-radius:16px}
.product-faq-toggle{display:grid;place-items:center;width:28px;height:28px;flex:none;background:var(--wc-color-primary-soft);color:var(--wc-color-primary);border-radius:9px;font-size:22px;font-weight:400}
.product-faq-item[open] .product-faq-toggle{transform:rotate(45deg)}
.product-faq-answer{padding:0 24px 22px;color:var(--wc-color-muted);line-height:2;font-size:14px}.product-faq-answer p{margin:0}

@media(max-width:1050px){.wc-product-pages .sol-hero-grid,.wc-product-pages .feature-detail-grid{grid-template-columns:1fr;gap:36px}.wc-product-pages :where(.product-app-preview,.product-playback-visual,.product-playlist-visual){width:100%;max-width:620px;margin-inline:auto}.wc-product-pages .product-app-preview{padding:12px 0 0 32px}.wc-product-pages .feature-pillar-grid{grid-template-columns:1fr}.wc-product-pages .feature-pillar-card{min-height:0}.wc-product-pages .feature-card-link{margin-top:22px}}
@media(max-width:640px){.wc-product-pages .sol-detail-grid,.wc-product-pages .sol-intro-grid,.wc-product-pages .feature-flow-layout,.wc-product-pages .feature-workflow-layout,.wc-product-pages .feature-readiness,.wc-product-pages .feature-split{grid-template-columns:1fr;gap:24px}.wc-product-pages .sol-detail-card{grid-template-columns:70px minmax(0,1fr);gap:15px;padding:20px}.wc-product-pages .sol-detail-visual{height:85px;border-radius:14px}.wc-product-pages .sol-detail-panel{padding:12px}.wc-product-pages .sol-detail-card h2{font-size:17px}.wc-product-pages .product-app-preview{padding-left:18px}.product-tv-frame{border-width:5px;border-radius:13px}.product-panel-frame{border-width:3px;border-radius:13px;width:28%}.product-playback-visual,.product-playlist-visual{padding:18px}.product-flow-library{padding:12px;gap:8px}.product-flow-library>.product-flow-icon{display:none}.product-visual-heading strong{font-size:15px}.product-playlist-items b{font-size:13px}.product-faq-item summary{padding:18px;font-size:14px}.product-faq-answer{padding:0 18px 18px}.wc-product-pages .sol-flow{padding-block:56px}.wc-product-pages .features-map-node small{font-size:10px}.wc-product-pages .feature-related-card{grid-template-columns:40px minmax(0,1fr) 18px;gap:10px;padding:18px}.wc-product-pages .feature-related-card>span{width:40px;height:40px}}
@media(prefers-reduced-motion:reduce){.wc-product-pages :where(.rv,.feature-pillar-card,.feature-related-card){transition:none;transform:none;opacity:1}.wc-product-pages .offline-sync i{animation:none}}