:root {
      --nla-navy: #051426;
      --nla-navy-soft: #0c223e;
      --nla-gold: #d4a548;
      --nla-gold-soft: #f5e2bf;
      --nla-bg: #f5f7fb;
      --nla-border: #dde2ee;
      --nla-text: #1f2933;
      --nla-muted: #64748b;
      --nla-error: #b91c1c;
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    body {
      font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
        sans-serif;
      background: var(--nla-bg);
      color: var(--nla-text);
      line-height: 1.6;
    }

    a {
      color: inherit;
      text-decoration: none;
    }
    /* GLOBAL BUTTONS */

    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0.6rem 1.2rem;
      border-radius: 999px;
      font-size: 0.88rem;
      font-weight: 600;
      border: 1px solid transparent;
      cursor: pointer;
      transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease,
        box-shadow 0.2s ease, transform 0.08s ease;
      white-space: nowrap;
    }

    .btn-primary {
      background: linear-gradient(135deg, var(--nla-gold), #f6d68a);
      color: #111827;
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35);
    }

    .btn-primary:hover {
      transform: translateY(-1px);
      box-shadow: 0 10px 24px rgba(0, 0, 0, 0.4);
    }

    .btn-outline {
      background: transparent;
      color: #111;
      border-color: rgba(148, 163, 184, 0.9);
    }
    .btn-outline-2 {
      background: transparent;
      color: #fff;
      border-color: rgba(148, 163, 184, 0.9);
    }

    .btn-outline-2:hover {
      background: rgba(15, 23, 42, 0.85);
      color: #fff;
    }
    .btn-outline:hover {
      background: rgba(15, 23, 42, 0.85);
      color: #fff;
    }

    /* PAGE WRAPPER */

    main.page--registered-agents {
      padding-bottom: 3rem;
    }

    /* HERO */

    .ra-hero {
      padding: 2.5rem 1.5rem 2.2rem;
      background: radial-gradient(
          circle at top left,
          rgba(212, 165, 72, 0.16),
          transparent 55%
        ),
        radial-gradient(circle at bottom right, rgba(15, 23, 42, 0.9), #020617);
      color: #fff;
    }

    .ra-hero-inner {
      max-width: 1180px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: minmax(0, 3fr) minmax(0, 2.1fr);
      gap: 2.2rem;
      align-items: center;
    }

    .ra-hero-kicker {
      font-size: 0.8rem;
      text-transform: uppercase;
      letter-spacing: 0.16em;
      opacity: 0.85;
      margin-bottom: 0.6rem;
    }

    .ra-hero-title {
      font-size: 2rem;
      line-height: 1.25;
      margin-bottom: 0.7rem;
    }

    .ra-hero-title span {
      color: var(--nla-gold);
    }

    .ra-hero-text {
      font-size: 0.95rem;
      max-width: 36rem;
      opacity: 0.95;
      margin-bottom: 1rem;
    }

    .ra-hero-meta {
      font-size: 0.82rem;
      opacity: 0.9;
      margin-bottom: 1.2rem;
    }

    .ra-hero-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 0.75rem;
    }

    .ra-hero-visual {
      border-radius: 18px;
      padding: 1.5rem 1.4rem;
      border: 1px solid rgba(148, 163, 184, 0.5);
      background: radial-gradient(
          circle at top,
          rgba(212, 165, 72, 0.3),
          transparent 60%
        ),
        linear-gradient(150deg, rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.8));
      box-shadow: 0 14px 35px rgba(15, 23, 42, 0.8);
    }

    .ra-hero-aside-title {
      font-size: 0.9rem;
      text-transform: uppercase;
      letter-spacing: 0.16em;
      margin-bottom: 0.4rem;
    }

    .ra-hero-aside-text {
      font-size: 0.85rem;
      opacity: 0.95;
    }

    .ra-badge-row {
      display: flex;
      flex-wrap: wrap;
      gap: 0.45rem;
      margin-top: 0.8rem;
    }

    .ra-badge {
      font-size: 0.76rem;
      padding: 0.28rem 0.7rem;
      border-radius: 999px;
      border: 1px solid rgba(148, 163, 184, 0.7);
      background: rgba(15, 23, 42, 0.9);
    }

    .ra-mini-stat {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0.8rem;
      margin-top: 1.1rem;
    }

    .ra-mini-stat-item {
      border-radius: 10px;
      padding: 0.6rem 0.75rem;
      border: 1px solid rgba(148, 163, 184, 0.7);
      background: rgba(15, 23, 42, 0.9);
      font-size: 0.8rem;
    }

    .ra-mini-stat-item span {
      display: block;
      opacity: 0.75;
      margin-bottom: 0.2rem;
    }

    .ra-mini-stat-item strong {
      display: block;
      font-size: 0.9rem;
    }

    /* SECTIONS */

    .ra-section {
      max-width: 1180px;
      margin: 0 auto;
      margin-top: 2.2rem;
      padding: 1.8rem 1.7rem;
      border-radius: 14px;
      background: #ffffff;
      border: 1px solid var(--nla-border);
      box-shadow: 0 4px 14px rgba(15, 23, 42, 0.03);
    }

    .ra-section-header {
      display: flex;
      justify-content: space-between;
      gap: 1rem;
      align-items: baseline;
      margin-bottom: 1.1rem;
    }

    .ra-section-title-wrap {
      display: flex;
      align-items: center;
      gap: 0.6rem;
    }

    .ra-section-icon {
      width: 28px;
      height: 28px;
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 0.8rem;
      border: 1px solid var(--nla-gold);
      background: #fff7eb;
      color: var(--nla-navy);
    }

    .ra-section-title {
      font-size: 1.1rem;
    }

    .ra-section-kicker {
      font-size: 0.84rem;
      color: var(--nla-muted);
      max-width: 22rem;
    }

    .ra-section-text {
      font-size: 0.9rem;
      color: var(--nla-muted);
      margin-bottom: 0.9rem;
    }

    /* DIRECTORY */

    .ra-directory-wrapper {
      border-radius: 12px;
      border: 1px solid var(--nla-border);
      overflow: hidden;
    }

    .ra-table {
      width: 100%;
      border-collapse: collapse;
      font-size: 0.88rem;
    }

    .ra-table thead {
      background: #f1f5f9;
    }

    .ra-table th,
    .ra-table td {
      padding: 0.65rem 0.9rem;
      border-bottom: 1px solid var(--nla-border);
      text-align: left;
      vertical-align: top;
    }

    .ra-table th {
      font-size: 0.78rem;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: #6b7280;
    }

    .ra-table tbody tr:nth-child(even) {
      background: #f9fafb;
    }

    .ra-agent-name {
      font-weight: 600;
      color: var(--nla-navy-soft);
      margin-bottom: 0.12rem;
    }

    .ra-agent-tag {
      font-size: 0.78rem;
      color: var(--nla-muted);
    }

    .ra-agent-contact small {
      display: block;
      font-size: 0.78rem;
      color: var(--nla-muted);
    }

    .ra-agent-contact a {
      text-decoration: underline;
      text-underline-offset: 2px;
    }

    .ra-badge-status {
      display: inline-flex;
      padding: 0.22rem 0.6rem;
      border-radius: 999px;
      font-size: 0.75rem;
      background: #ecfdf3;
      color: #0f766e;
      border: 1px solid #a7f3d0;
      margin-bottom: 0.14rem;
    }

    .ra-badge-status--alert {
      background: #fef3c7;
      color: #92400e;
      border-color: #fed7aa;
    }

    .ra-footnote {
      font-size: 0.78rem;
      color: var(--nla-muted);
      margin-top: 0.55rem;
    }

    /* IMAGE ROW */

    .ra-image-row {
      display: grid;
      grid-template-columns: minmax(0, 3fr) minmax(0, 2.1fr);
      gap: 1.5rem;
      margin-top: 1.2rem;
      align-items: center;
    }

    .ra-image-row-text p {
      font-size: 0.9rem;
      color: var(--nla-muted);
      margin-bottom: 0.6rem;
    }

    .ra-image-row-text ul {
      padding-left: 1.1rem;
      font-size: 0.85rem;
      color: var(--nla-muted);
    }

    .ra-image-row-text li {
      margin-bottom: 0.35rem;
    }

    .ra-image-col img {
      width: 100%;
      max-height: 230px;
      object-fit: cover;
      border-radius: 14px;
      border: 1px solid var(--nla-border);
      display: block;
    }

    /* STEPS */

    .ra-steps {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap: 1rem;
      margin-top: 0.7rem;
    }

    .ra-step {
      border-radius: 12px;
      border: 1px solid var(--nla-border);
      background: #f9fafb;
      padding: 0.9rem 0.95rem;
      font-size: 0.86rem;
    }

    .ra-step h3 {
      font-size: 0.9rem;
      margin-bottom: 0.3rem;
      display: flex;
      align-items: center;
      gap: 0.35rem;
    }

    .ra-step-badge {
      width: 22px;
      height: 22px;
      border-radius: 999px;
      border: 1px solid var(--nla-gold);
      font-size: 0.7rem;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      background: #fff7ed;
    }

    .ra-cta-row {
      margin-top: 1rem;
      display: flex;
      gap: 0.75rem;
      flex-wrap: wrap;
    }

    /* FORMS GRID */

    .ra-forms-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
      gap: 0.9rem;
      margin-top: 0.7rem;
    }

    .ra-form-item {
      border-radius: 10px;
      border: 1px solid var(--nla-border);
      background: #f9fafb;
      padding: 0.85rem 0.95rem;
      font-size: 0.86rem;
    }

    .ra-form-item h3 {
      font-size: 0.92rem;
      margin-bottom: 0.3rem;
    }

    .ra-form-item p {
      font-size: 0.82rem;
      color: var(--nla-muted);
      margin-bottom: 0.35rem;
    }

    .ra-form-item a {
      font-size: 0.8rem;
      text-decoration: underline;
      text-underline-offset: 2px;
    }

    /* COMPLAINT FORM */

    .ra-complaint-layout {
      display: grid;
      grid-template-columns: minmax(0, 2.4fr) minmax(0, 2fr);
      gap: 1.5rem;
    }

    .ra-complaint-note {
      font-size: 0.86rem;
      color: var(--nla-muted);
    }

    .ra-complaint-note ul {
      padding-left: 1.1rem;
      margin-top: 0.4rem;
    }

    .ra-complaint-note li {
      margin-bottom: 0.35rem;
    }

    .ra-form-row {
      margin-bottom: 0.7rem;
      font-size: 0.86rem;
    }

    .ra-form-row-inline {
      display: flex;
      align-items: flex-start;
      gap: 0.45rem;
    }

    .ra-form-row-inline input[type="checkbox"] {
      margin-top: 0.15rem;
    }

    label {
      font-size: 0.82rem;
      font-weight: 600;
      color: var(--nla-navy-soft);
    }

    .ra-required {
      color: var(--nla-error);
    }

    input[type="text"],
    input[type="email"],
    textarea,
    select {
      width: 100%;
      padding: 0.5rem 0.55rem;
      border-radius: 8px;
      border: 1px solid var(--nla-border);
      font-size: 0.86rem;
      font-family: inherit;
      background: #ffffff;
    }

    textarea {
      min-height: 110px;
      resize: vertical;
    }

    .ra-form-helper {
      font-size: 0.75rem;
      color: var(--nla-muted);
      margin-top: 0.18rem;
    }

    .ra-form-actions {
      margin-top: 0.6rem;
      display: flex;
      flex-wrap: wrap;
      gap: 0.6rem;
      align-items: center;
    }

    .ra-form-status-note {
      font-size: 0.76rem;
      color: var(--nla-muted);
    }

    @media screen and (max-width: 900px) {
        .ra-mini-stat {
            display: block !important;
        }
        .ra-mini-stat .ra-mini-stat-item {
            margin: 10px 0;
        }
      .ra-hero-inner,
      .ra-image-row,
      .ra-complaint-layout {
        grid-template-columns: minmax(0, 1fr);
      }

      .ra-hero {
        padding: 2rem 1.25rem;
      }

      .ra-section {
        margin-top: 1.8rem;
        padding: 1.5rem 1.3rem;
      }

      .ra-section-header {
        flex-direction: column;
        align-items: flex-start;
      }
    }

/* SEO/UI preservation additions */
html { scroll-behavior: smooth; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(212,165,72,.65); outline-offset: 3px; }
.ra-breadcrumb { max-width: 1180px; margin: 0 auto 0.9rem; font-size: .78rem; color: rgba(255,255,255,.78); }
.ra-breadcrumb a { color: rgba(255,255,255,.86); text-decoration: underline; text-underline-offset: 2px; }
.ra-hero-logo { width: 160px; max-width: 100%; height: auto; display:block; margin-bottom: .85rem; }
.ra-trust-row { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .8rem; margin-top: 1rem; }
.ra-trust-item { border-radius: 12px; border: 1px solid rgba(148,163,184,.42); background: rgba(15,23,42,.7); padding: .7rem .8rem; font-size: .78rem; }
.ra-trust-item strong { display:block; color:#fff; margin-bottom:.15rem; }
.ra-alert-note { margin-top: .9rem; border-left: 3px solid var(--nla-gold); background:#fffbeb; border-radius: 10px; padding:.75rem .85rem; color:#6b4a0f; font-size:.84rem; }
.ra-directory-wrapper { overflow-x:auto; }
.ra-table small { display:block; color: var(--nla-muted); margin-top:.18rem; }
.ra-agent-contact span { display:block; margin-top:.25rem; }
.ra-agent-contact a[target="_blank"]::after { content:" ↗"; font-size:.75em; }
.ra-section-footer-links { display:flex; flex-wrap:wrap; gap:.65rem; margin-top:1rem; }
.ra-info-grid { display:grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap:1rem; margin-top:.8rem; }
.ra-info-card { border-radius: 12px; border: 1px solid var(--nla-border); background:#f9fafb; padding:.9rem .95rem; font-size:.84rem; }
.ra-info-card h3 { font-size:.92rem; margin-bottom:.25rem; color: var(--nla-navy-soft); }
.ra-disclaimer { font-size:.78rem; color: var(--nla-muted); margin-top:.75rem; }
.ra-final-strip { max-width:1180px; margin:2.2rem auto 0; border-radius: 14px; background:#020617; color:#e5e7eb; border:1px solid rgba(148,163,184,.35); padding:1.2rem 1.4rem; display:grid; grid-template-columns:minmax(0,1.7fr) minmax(0,1fr); gap:1rem; align-items:center; }
.ra-final-strip h2 { color:#fbbf24; font-size:1.05rem; margin-bottom:.25rem; }
.ra-final-strip p { font-size:.86rem; color:#cbd5e1; }
.ra-final-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.65rem; }
.ra-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
@media (max-width: 900px) { .ra-trust-row, .ra-info-grid, .ra-final-strip { grid-template-columns:1fr; } .ra-final-actions { justify-content:flex-start; } .ra-table { min-width: 860px; } }
