/* Line 15812 (upskill-doors-13-r1): the Google-path look for the content pages behind ai.features.content_pages_google_path
   (App\Support\ContentPagesGooglePath: /features, /features/{slug}, /for/seniors, /for/families, /help, /help/{slug}) and
   the old guide pages (/guide/tips, /guide/tutorials). Every colour, the type family and the radius come from the .ns-gp
   tokens in css/ns-tokens.css (light by default, dark under prefers-color-scheme: dark); nothing here names a colour of
   its own except the one soft shadow. The pages' inline colours read var(--ns-c-*, <main's literal>): this file is the
   only place --ns-c-* is defined, so a page outside the lit scope keeps main's colours. 375 px first. */

.ns-gp {
    --ns-c-text: var(--ns-text);
    --ns-c-text-2: var(--ns-text-2);
    --ns-c-accent: var(--ns-gold-light);
    --ns-c-gold: var(--ns-gold);
    --ns-c-on-accent: var(--ns-on-accent);
    --ns-c-card: var(--ns-card);
    --ns-c-tint: var(--ns-surface);
    --ns-c-line: var(--ns-border-strong);
}

/* The developer catalog and Swagger reference still read the older palette names. */
body.ns-gp.ns-content-page:has(.catalog-hero, .swagger-page-header) {
    --ns-bg-primary: var(--ns-bg);
    --ns-bg-secondary: var(--ns-surface);
    --ns-bg-card: var(--ns-card);
    --ns-bg-elevated: var(--ns-elevated);
    --ns-text-primary: var(--ns-text);
    --ns-text-secondary: var(--ns-text-2);
    --ns-text-muted: var(--ns-text-2);
    --ns-font-primary: var(--ns-font);
}
.ns-gp.ns-content-page :is(.catalog-hero, .swagger-page-header) h1 {
    background: none;
    -webkit-text-fill-color: currentColor;
    color: var(--ns-text);
}
.ns-gp.ns-content-page :is(.catalog-hero, .swagger-page-header) .text-muted {
    color: var(--ns-text-2) !important;
}
.ns-gp.ns-content-page .ns-openapi-intro__body :is(pre, code),
.ns-gp.ns-content-page .swagger-ui .microlight { color: var(--ns-text) !important; }
.ns-gp.ns-content-page .ns-openapi-intro a { color: var(--ns-gold-light); }

/* The content layout (layouts/content). */
body.ns-gp.ns-content-page { background: var(--ns-bg); color: var(--ns-text); font-family: var(--ns-font); }
.ns-gp.ns-content-page .ns-content-hero::before { background: none; }
.ns-gp.ns-content-page .ns-content-hero h1 { color: var(--ns-text); font-weight: 500; letter-spacing: -0.02em; }
.ns-gp.ns-content-page .ns-content-hero p { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-content-btn-primary { background: var(--ns-gold); color: var(--ns-on-accent); font-weight: 500; }
.ns-gp.ns-content-page .ns-content-btn-primary:hover { transform: none; box-shadow: 0 1px 3px rgba(60, 64, 67, .3); }
.ns-gp.ns-content-page .ns-content-btn-ghost { border-color: var(--ns-border-strong); color: var(--ns-text); font-weight: 500; }
.ns-gp.ns-content-page .ns-content-btn-ghost:hover { border-color: var(--ns-gold); color: var(--ns-text); background: var(--ns-surface); }
.ns-gp.ns-content-page .ns-content-card { background: var(--ns-card); border-color: var(--ns-border-strong); border-radius: var(--ns-radius); }
.ns-gp.ns-content-page .ns-content-card:hover { transform: none; border-color: var(--ns-gold); }
.ns-gp.ns-content-page .ns-content-card h3 { font-weight: 500 !important; }
.ns-gp.ns-content-page .ns-content-cta { background: var(--ns-bg-deep); }
.ns-gp.ns-content-page .ns-content-section h2,
.ns-gp.ns-content-page .ns-prose h2,
.ns-gp.ns-content-page .ns-prose h3,
.ns-gp.ns-content-page .ns-prose strong { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-content-section h2 { font-weight: 500; letter-spacing: -0.01em; }
.ns-gp.ns-content-page .ns-content-section p,
.ns-gp.ns-content-page .ns-prose p,
.ns-gp.ns-content-page .ns-prose ul,
.ns-gp.ns-content-page .ns-prose ol,
.ns-gp.ns-content-page .ns-prose td { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-prose a { color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-prose a:hover { color: var(--ns-gold-deep); }
.ns-gp.ns-content-page .ns-prose blockquote { border-left-color: var(--ns-gold); background: var(--ns-surface); color: var(--ns-text); }
.ns-gp.ns-content-page .ns-prose th { background: var(--ns-surface); border-bottom-color: var(--ns-border-strong); color: var(--ns-text); }
.ns-gp.ns-content-page .ns-prose td { border-bottom-color: var(--ns-border); }
.ns-gp.ns-content-page .ns-prose hr { border-top-color: var(--ns-border); }
.ns-gp.ns-content-page :focus-visible { outline-color: var(--ns-text); }

/* The old guide pages (guide/tips, guide/tutorials): the page root takes .ns-gp itself. */
.ns-gp.ns-guide-gp { background: var(--ns-bg); color: var(--ns-text); font-family: var(--ns-font); border-radius: var(--ns-radius); padding: 16px; }
.ns-gp.ns-guide-gp .card,
.ns-gp.ns-guide-gp .guide-card { background: var(--ns-card); border: 1px solid var(--ns-border-strong) !important; color: var(--ns-text); box-shadow: none !important; border-radius: var(--ns-radius); }
.ns-gp.ns-guide-gp h1, .ns-gp.ns-guide-gp h2, .ns-gp.ns-guide-gp h3, .ns-gp.ns-guide-gp h4, .ns-gp.ns-guide-gp h5, .ns-gp.ns-guide-gp h6,
.ns-gp.ns-guide-gp .text-dark { color: var(--ns-text) !important; font-weight: 500 !important; }
.ns-gp.ns-guide-gp p, .ns-gp.ns-guide-gp li, .ns-gp.ns-guide-gp .text-muted { color: var(--ns-text-2) !important; }
.ns-gp.ns-guide-gp a:not(.btn) { color: var(--ns-gold-light); }
.ns-gp.ns-guide-gp .btn-primary { background: var(--ns-gold); border-color: var(--ns-gold); color: var(--ns-on-accent); border-radius: 22px; min-height: 44px; }
.ns-gp.ns-guide-gp .ns-guide-help-line { margin: 0 0 16px; padding: 12px 16px; border: 1px solid var(--ns-border-strong); border-radius: var(--ns-radius); background: var(--ns-surface); color: var(--ns-text); }
.ns-gp.ns-guide-gp .ns-guide-help-line a { color: var(--ns-gold-light); font-weight: 500; min-height: 44px; display: inline-flex; align-items: center; }
@media (max-width: 480px) { .ns-gp.ns-guide-gp { padding: 12px; } }

/* Pages that read the app design-system words (voice-communication, line 15844) get them on the same tokens, inside the
   page body only: the landing header and footer keep their own. */
.ns-gp.ns-content-page :is(.ns-content-hero, .ns-content-body, .ns-content-cta) {
    --ns-text-primary: var(--ns-text);
    --ns-text-secondary: var(--ns-text-2);
    --ns-accent: var(--ns-gold-light);
    --ns-accent-subtle: var(--ns-surface);
    --ns-accent-glow: var(--ns-border-strong);
}

/* The landing shell around the content pages (layouts/landing): header, glow and footer on the same tokens, so the page
   reads as one surface in light and in dark (the business pages' light pass, line 15737, dresses the same classes). */
body.ns-gp.ns-content-page { --landing-glow: none; }
.ns-gp.ns-content-page .landing-header { background: var(--ns-bg); border-bottom-color: var(--ns-border); }
.ns-gp.ns-content-page .landing-brand { color: var(--ns-text); }
.ns-gp.ns-content-page .landing-link-btn { color: var(--ns-text-2); }
.ns-gp.ns-content-page .landing-link-btn:hover,
.ns-gp.ns-content-page .landing-link-btn:focus-visible,
.ns-gp.ns-content-page .landing-link-btn.is-active { color: var(--ns-text); background: var(--ns-surface); }
.ns-gp.ns-content-page .landing-footer { color: var(--ns-text-2); border-top-color: var(--ns-border); }
.ns-gp.ns-content-page .landing-footer h4 { color: var(--ns-text); }

/* Slice 5: the existing owner guides use the same content-page theme. */
.ns-gp.ns-owner-guide { max-width: 1100px; }
.ns-gp.ns-owner-guide .bg-dark,
.ns-gp.ns-owner-guide .accordion-item,
.ns-gp.ns-owner-guide .accordion-button,
.ns-gp.ns-owner-guide .accordion-body { background: var(--ns-card) !important; color: var(--ns-text); }
.ns-gp.ns-owner-guide .text-muted { color: var(--ns-text-2) !important; }
.ns-gp.ns-owner-guide .accordion-button:not(.collapsed) { background: var(--ns-surface) !important; color: var(--ns-text); }
.ns-gp.ns-owner-guide .btn { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
.ns-gp.ns-owner-guide a:not(.btn) { color: var(--ns-gold-light); }
.ns-gp.ns-owner-guide .btn-primary { background: var(--ns-gold); border-color: var(--ns-gold); color: var(--ns-on-accent); }
.ns-gp.ns-owner-guide .btn-outline-primary { color: var(--ns-text); border-color: var(--ns-border-strong); }
.ns-gp.ns-owner-guide :focus-visible { outline: 2px solid var(--ns-text); outline-offset: 3px; }
@media (max-width: 480px) {
    .ns-gp.ns-owner-guide { padding: 20px 12px !important; }
    .ns-gp.ns-owner-guide .help-section > .d-flex,
    .ns-gp.ns-owner-guide .tips-section > .d-flex { flex-wrap: wrap; gap: 12px; }
}

/* Line 15852 (upskill-factory-7-r2): the Completion Utility (/completion, /completion/request, /completion/{audience})
   behind ai.features.completion_google_path (App\Support\ContentPagesGooglePath::onCompletionPage). The pages keep
   main's bytes (their own dark palette, pinned byte-for-byte while off); lit, each of their colour rules is re-dressed
   here from the --ns-* tokens, light by default and dark under prefers-color-scheme: dark. */
.ns-gp.ns-content-page .ns-cu-eyebrow { color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-cu-loop-step { background: var(--ns-card); border-color: var(--ns-border-strong); }
.ns-gp.ns-content-page .ns-cu-loop-num { color: var(--ns-gold-border); }
.ns-gp.ns-content-page .ns-cu-loop-icon { background: var(--ns-gold-glow); color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-cu-loop-step h3 { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-loop-step p { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-cu-door h3 { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-door p { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-cu-door-tag { color: var(--ns-text-2); border-color: var(--ns-border-strong); }
.ns-gp.ns-content-page .ns-cu-door-tag--amber { color: var(--ns-on-accent); background: var(--ns-gold); }
.ns-gp.ns-content-page .ns-cu-door--flagship { border-color: var(--ns-gold-border); background: var(--ns-card); }
.ns-gp.ns-content-page .ns-cu-textlink { color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-cu-textlink:hover { color: var(--ns-gold-deep); }
.ns-gp.ns-content-page .ns-cu-learn { background: var(--ns-surface); }
.ns-gp.ns-content-page .ns-cu-learn-lead { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-learn-card { background: var(--ns-card); border-color: var(--ns-border-strong); }
.ns-gp.ns-content-page .ns-cu-learn-icon { background: var(--ns-gold-glow); color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-cu-learn-card h3 { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-learn-card p { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-cu-learn-honest { color: var(--ns-text-2); background: var(--ns-surface); border-color: var(--ns-border-strong); }
.ns-gp.ns-content-page .ns-cu-learn-honest i { color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-cu-learn-honest strong { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-eq-icon { background: var(--ns-gold-glow); color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-cu-amp-label { color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-cu-amp-card h3 { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-amp-card p { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-cu-amp-more { color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-cu-live-inner { background: var(--ns-card); border-color: var(--ns-border-strong); }
.ns-gp.ns-content-page .ns-cu-live-inner p { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-cu-amp-badge { color: var(--ns-text-2); border-color: var(--ns-border-strong); }
.ns-gp.ns-content-page .ns-cu-amp-badge .dot { background: var(--ns-gold); }
.ns-gp.ns-content-page .ns-cu-pitch { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-block { background: var(--ns-card); border-color: var(--ns-border-strong); }
.ns-gp.ns-content-page .ns-cu-block .lbl { color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-cu-block h3 { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-block p { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-cu-block ul { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-cu-learn-line { background: var(--ns-gold-glow); border-color: var(--ns-gold-border); color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-learn-line strong { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-learn-line i { color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-cu-alert--success { background: var(--ns-surface); border-color: var(--ns-border-strong); color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-alert--success i { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-after { background: var(--ns-card); border-color: var(--ns-gold-border); }
.ns-gp.ns-content-page .ns-cu-after-icon { background: var(--ns-gold-glow); color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-cu-after h3 { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-after p { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-cu-after strong { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-alert--warning { background: var(--ns-gold-glow); border-color: var(--ns-gold-border); color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-alert--warning i { color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-cu-form { background: var(--ns-card); border-color: var(--ns-border-strong); }
.ns-gp.ns-content-page .ns-cu-field label { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-req { color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-cu-opt { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-cu-form input, .ns-gp.ns-content-page .ns-cu-form textarea { background: var(--ns-surface); border-color: var(--ns-border-strong); color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-form input::placeholder, .ns-gp.ns-content-page .ns-cu-form textarea::placeholder { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-cu-form input:focus, .ns-gp.ns-content-page .ns-cu-form textarea:focus { border-color: var(--ns-gold-border); box-shadow: 0 0 0 3px var(--ns-gold-glow); }
.ns-gp.ns-content-page .ns-cu-hint { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-cu-reflection { background: var(--ns-gold-glow); border-color: var(--ns-gold-border); color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-reflection .ns-cu-reflection-label { color: var(--ns-gold-light); }
.ns-gp.ns-content-page .ns-cu-questions .ns-cu-q label { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-submit-note { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-cu-submit-note a { color: var(--ns-text); }
.ns-gp.ns-content-page .ns-cu-talk { color: var(--ns-text-2); }
.ns-gp.ns-content-page .ns-cu-talk a { color: var(--ns-gold-light); }
/* The few colours the pages write inline. */
.ns-gp.ns-content-page [style*="color:#f59e0b"] { color: var(--ns-gold-light) !important; }
.ns-gp.ns-content-page [style*="color:#94a3b8"] { color: var(--ns-text-2) !important; }
.ns-gp.ns-content-page [style*="color:#f0f0f5"] { color: var(--ns-text) !important; }
@media (max-width: 480px) {
    .ns-gp.ns-content-page .ns-cu-grid2 { grid-template-columns: 1fr; }
}