/* Line 16377 (forefront-doors-13-r1, ai.features.forefront_doors_13): the trust doors on the Google path. Linked last in <head>
   by App\Support\GooglePathLayouts::headLinks() (config/google_path_layouts.d/forefront-doors-13-r1.php) only on /contact,
   /footer/privacy_policy, /footer/term_of_use, /footer/about_netshow, /cookie-policy and /accessibility, after
   css/ns-tokens.css and css/pages/google-path-shared-layouts.css, when <body> carries data-ns-gp-layout (the --ns-* light set,
   and the dark set under the app's data-bs-theme="dark"). This sheet carries no colour of its own.
   1. One reading column: Roboto on one scale (28 / 20 / 16 px, 24 px title at 375), a 72-character measure, 20 px gutters
      at 375 instead of the 48 px p-5 padding, calm hairlines.
   2. The contact cards and form on the tokens: surface cards with one hairline, the accent for links, 44 px targets,
      one filled next step (Send message).
   3. The privacy page's two opt-out buttons read as one outlined and one text action on the tokens. */

/* 1. One reading column. */
body[data-ns-gp-layout] #main-content .container.p-5 {
    max-width: 760px;
    padding: 40px 24px 56px !important;
    font-family: var(--ns-font);
    font-size: 1rem;
    line-height: 1.6;
    color: var(--ns-text);
}

body[data-ns-gp-layout] #main-content .container.p-5 h1 {
    font-size: 1.75rem;
    line-height: 1.25;
    font-weight: 500;
    color: var(--ns-text);
}

body[data-ns-gp-layout] #main-content .container.p-5 :is(h2, h3) {
    font-size: 1.25rem;
    line-height: 1.35;
    font-weight: 500;
    color: var(--ns-text);
    margin-top: 2rem;
}

body[data-ns-gp-layout] #main-content .container.p-5 :is(p, li) { color: var(--ns-text); max-width: 72ch; }

body[data-ns-gp-layout] #main-content .container.p-5 :is(.lead, [data-ns-legal-ai-line]) { color: var(--ns-text-2); font-size: 1.0625rem; }

body[data-ns-gp-layout] #main-content .container.p-5 hr { border-color: var(--ns-border); opacity: 1; }

body[data-ns-gp-layout] #main-content .container.p-5 a:not(.btn) {
    color: var(--ns-gold-light);
    text-decoration: underline;
    text-underline-offset: 3px;
}

body[data-ns-gp-layout] #main-content .container.p-5 code {
    color: var(--ns-text);
    background: var(--ns-surface);
    border-radius: 4px;
    padding: 0 4px;
}

/* 2. The contact cards and form. */
body[data-ns-gp-layout] #main-content .ns-contact-grid { gap: 16px; }

body[data-ns-gp-layout] #main-content .ns-contact-card {
    background: var(--ns-card);
    border: 1px solid var(--ns-border);
    border-radius: var(--ns-radius);
    color: var(--ns-text);
    box-shadow: none;
    padding: 20px;
}

body[data-ns-gp-layout] #main-content .container.p-5 .ns-contact-card h3 { color: var(--ns-text); font-size: 1.0625rem; margin-top: 0; }

body[data-ns-gp-layout] #main-content .ns-contact-card p { color: var(--ns-text-2); margin-bottom: .25rem; }

body[data-ns-gp-layout] #main-content .ns-contact-card a { color: var(--ns-gold-light); }

body[data-ns-gp-layout] #main-content .ns-contact-icon { background: var(--ns-surface); color: var(--ns-text-2); }

body[data-ns-gp-layout] #main-content .ns-contact-form .form-label { color: var(--ns-text); }

body[data-ns-gp-layout] #main-content .ns-contact-form :is(.form-control, .form-select) {
    background-color: var(--ns-bg);
    color: var(--ns-text);
    border: 1px solid var(--ns-border-strong);
    border-radius: 8px;
}

body[data-ns-gp-layout] #main-content .ns-contact-form :is(.form-control, .form-select):focus {
    border-color: var(--ns-gold);
    box-shadow: 0 0 0 3px var(--ns-gold-glow, rgba(249, 171, 0, .22));
}

body[data-ns-gp-layout] #main-content :is(.ns-contact-form .btn-primary, .container.p-5 .btn-outline-primary) {
    background: var(--ns-gold);
    border: 1px solid var(--ns-gold);
    color: var(--ns-on-accent);
    border-radius: 999px;
    font-weight: 500;
    min-height: 44px;
    padding: 10px 24px;
    box-shadow: none;
}

/* 3. The privacy opt-out pair: one filled, one text. */
body[data-ns-gp-layout] #main-content .container.p-5 .btn-link {
    color: var(--ns-gold-light);
    min-height: 44px;
}

@media (max-width: 575.98px) {
    body[data-ns-gp-layout] #main-content .container.p-5 { padding: 24px 20px 40px !important; }
    body[data-ns-gp-layout] #main-content .container.p-5 h1 { font-size: 1.5rem; }
    body[data-ns-gp-layout] #main-content .ns-contact-form .btn-primary { width: 100%; }
}

/* Keep the server's existing reading gutter beside the phone host after the page padding is applied. */
@media (max-width: 480px) {
    body[data-ns-gp-layout] #main-content.ns-dock-gutter-phone > .container.p-5 {
        padding-inline-end: calc(16px + 44px * 1.27 + 6px + 8px) !important;
    }
}