/* Shared DeskFox.Ai navigation and footer for product pages that keep their own brand theme
 * (FoxTake dark teal, HealthFold warm white). Colours inherit from the host page so the bar
 * works on light and dark backgrounds without its own palette.
 */
.getting-started { padding-left: 26px; line-height: 1.8; }
.getting-started li { padding: 8px 0 8px 6px; }
.product-preview { margin: 28px 0; display: flex; align-items: center; gap: 32px; flex-wrap: wrap; }
.product-preview img { width: min(240px, 100%); height: auto; border-radius: 20px; border: 1px solid rgba(128, 144, 170, 0.28); }
.product-preview figcaption { flex: 1 1 220px; line-height: 1.8; }
.df-chrome { font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "PingFang TC", sans-serif; font-size: 14px; line-height: 1.5; color: inherit; }
.df-chrome a { color: inherit; text-decoration: none; border: 0; }
.df-chrome a:hover { text-decoration: underline; text-underline-offset: 4px; }
.df-chrome a:focus-visible { outline: 3px solid #7295C4; outline-offset: 4px; }
.df-chrome .df-wrap { max-width: 1000px; margin: 0 auto; padding: 0 24px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; }
.df-nav { border-bottom: 1px solid rgba(128, 144, 170, 0.28); padding: 14px 0; }
.df-nav .df-brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; letter-spacing: 0.01em; }
.df-nav .df-brand img { width: 28px; height: 28px; }
.df-nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 20px; opacity: 0.85; }
.df-nav li[aria-current] { opacity: 1; font-weight: 600; }
.df-footer { border-top: 1px solid rgba(128, 144, 170, 0.28); padding: 28px 0 40px; font-size: 13px; opacity: 0.9; }
.df-footer .df-wrap { align-items: flex-start; }
.df-footer .df-cols { display: flex; flex-wrap: wrap; gap: 8px 28px; }
.df-footer .df-cols a { white-space: nowrap; }
.df-footer p { margin: 12px 0 0; width: 100%; opacity: 0.75; }
@media (max-width: 540px) { .df-chrome .df-wrap { padding: 0 16px; } }