@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@500;700&display=swap');
/* *****************************************************

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.

***************************************************** */

/* Custom CSS for Nexus Theme
 *
 * This file allows you to customize the theme colors and styles for the entire Nexus template.
 *
 * To customize colors:
 * - Replace the var() references with your own hex colors or other CSS values.
 * - For example, instead of --primary: #4b5563; use --primary: #your-color;
 * - You can also override any CSS properties here.
 */

:root {
    --white: #fff;

    /* Neutral shades */
    --neutral-50: #fbf9fa;
    --neutral-100: #f4f5f7;
    --neutral-200: #e4e4e7;
    --neutral-300: #d0d5dd;
    --neutral-400: #9ca3af;
    --neutral-500: #6b7280;
    --neutral-600: #4b5563;
    --neutral-700: #374151;
    --neutral-800: #1f2937;
    --neutral-900: #111827;
    --neutral-950: #030712;

    /* Neutral shades */
    /* define own pallet with brand colors */
    --primary-50: var(--neutral-50);
    --primary-100: var(--neutral-100);
    --primary-200: var(--neutral-200);
    --primary-300: var(--neutral-300);
    --primary-400: var(--neutral-400);
    --primary-500: var(--neutral-500);
    --primary-600: var(--neutral-600);
    --primary-700: var(--neutral-700);
    --primary-800: var(--neutral-800);
    --primary-900: var(--neutral-900);
    --primary-950: var(--neutral-900);

    /* Primary colors */
    /* Use shades from comments if `primary` colors use other colors, then neutral */
    --primary: #0B2A4A;
    --primary-lifted: #0E3760;
    --primary-accented: #12457A;

    /* Secondary colors */
    --secondary: var(--neutral-500);
    --secondary-lifted: var(--neutral-600);
    --secondary-accented: var(--neutral-700);

    /* Success colors */
    --success: #00a63e;
    --success-lifted: #008236;
    --success-accented: #016630;

    /* Info colors */
    --info: #155dfc;
    --info-lifted: #1447e6;
    --info-accented: #193cb8;

    /* Notice colors */
    --notice: #7f22fe;
    --notice-lifted: #7008e7;
    --notice-accented: #5d0ec0;

    /* Warning colors */
    --warning: #f54a00;
    --warning-lifted: #ca3500;
    --warning-accented: #9f2d00;

    /* Error colors */
    --error: #e7000b;
    --error-lifted: #c10007;
    --error-accented: #9f0712;

    /* Grayscale colors */
    --grayscale: var(--neutral-900);
    --grayscale-lifted: var(--neutral-800);
    --grayscale-accented: var(--neutral-700);

    /* Neutral colors */
    --neutral: var(--neutral-500);
    --neutral-lifted: var(--neutral-600);
    --neutral-accented: var(--neutral-700);

    /* Text neutral colors */
    --text-inverted: var(--white);
    --text-muted: var(--neutral-400);
    --text-lifted: var(--neutral-500);
    --text-accented: var(--neutral-600);
    --text: #0B2A4A;

    /* Border neutral colors */
    --border-muted: var(--neutral-200);
    --border: var(--neutral-300);
    --border-lifted: var(--neutral-400);
    --border-accented: var(--neutral-600);

    /* Background neutral colors */
    --bg: var(--white);
    --bg-muted: var(--neutral-50);
    --bg-lifted: var(--neutral-100);
    --bg-accented: var(--neutral-200);
    --bg-inverted: #071D33;

    /* Additional colors */
    --yellow-200: #fff085;
    --yellow-300: #ffdf20;
    --teal-300: #46edd5;
    --teal-400: #00d5be;
    --emerald-300: #5ee9b5;
    --pink-400: #fb64b6;

    /* Additional custom properties */
    /* Font sizes */
    --text-xs: 0.625rem;
    --text-sm: 0.75rem;
    --text-md: 0.875rem;
    --text-lg: 1rem;

    /* Spacing */
    --outline-sm: 1px;
    --outline-md: 2px;
    --outline-lg: 3px;

    /* Rounding */
    --rounding-sm: 0.25rem;
    --rounding-md: 0.5rem;
    --rounding-lg: 0.75rem;

    /* Other */
    --letter-spacing: 0em;
    --disabled-opacity: 25%;
}

/* =====================================================
   Register.mu additions (2026-11-07). Source of truth:
   agents/theme/registermu/css/custom.css
   ===================================================== */

:root {
    --rmu-navy: #0B2A4A;
    --rmu-navy-deep: #071D33;
    --rmu-teal: #2DD4BF;
    --rmu-teal-ink: #062A33;
    --rmu-teal-dark: #0E9F8E;
    --rmu-teal-light: #5EEAD4;
    --rmu-soft: #EEF6F7;
    --rmu-line: #D6E3E8;
    --rmu-muted: #4B5D70;
}

body { font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif; }
h1, h2, h3, .rmu-display { font-family: "Space Grotesk", Inter, sans-serif; }

/* Header: text logo */
.rmu-logo { font: 700 28px "Space Grotesk", sans-serif; letter-spacing: -.5px; color: var(--rmu-navy); }
.rmu-logo span { color: var(--rmu-teal-dark); }
.navbar-brand:hover .rmu-logo { opacity: .85; }

/* Buttons: teal call-to-action */
.btn-rmu { background: var(--rmu-teal); color: var(--rmu-teal-ink); border: 0; border-radius: 10px; font-weight: 700; }
.btn-rmu:hover, .btn-rmu:focus { background: var(--rmu-teal-light); color: var(--rmu-teal-ink); }

/* Home page */
.rmu-home { color: var(--rmu-navy); }
.rmu-home a { color: inherit; }
.rmu-wrap { max-width: 1200px; margin: 0 auto; padding-left: 24px; padding-right: 24px; }
.rmu-section { padding-top: 64px; padding-bottom: 64px; }
.rmu-soft { background: var(--rmu-soft); }
.rmu-h2 { font: 700 30px "Space Grotesk", sans-serif; text-align: center; margin: 0 0 28px; color: var(--rmu-navy); }
.rmu-muted { color: var(--rmu-muted); }

.rmu-hero { background: var(--rmu-navy); color: #fff; }
.rmu-hero-inner { max-width: 1000px; margin: 0 auto; padding: 96px 24px 88px; text-align: center; }
.rmu-hero h1 { font: 700 52px/1.1 "Space Grotesk", sans-serif; letter-spacing: -1px; margin: 0 0 20px; color: #fff; }
.rmu-hero p { font-size: 19px; opacity: .9; max-width: 640px; margin: 0 auto 28px; }
.rmu-search { display: flex; flex-wrap: wrap; gap: 8px; max-width: 720px; margin: 0 auto; }
.rmu-search input { flex: 1 1 320px; min-height: 60px; border: 0; border-radius: 10px; padding: 0 20px; font: 500 19px Inter, sans-serif; color: #111; }
.rmu-search .btn-rmu { min-height: 60px; padding: 0 32px; font-size: 17px; }
.rmu-hero .rmu-transfer { display: inline-block; margin-top: 18px; font-size: 14px; color: #fff; opacity: .85; }

.rmu-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 20px; }
.rmu-card { background: #fff; border: 1px solid var(--rmu-line); border-radius: 16px; padding: 28px; display: flex; flex-direction: column; gap: 8px; }
.rmu-ext { font: 700 34px "Space Grotesk", sans-serif; color: var(--rmu-navy); }
.rmu-price { font-size: 26px; font-weight: 700; margin-top: 8px; }
.rmu-price small { font-size: 14px; font-weight: 500; color: var(--rmu-muted); }
.rmu-alt { font-size: 13px; color: var(--rmu-muted); margin-top: -6px; }
.rmu-card .btn-rmu { margin-top: 8px; padding: 12px; text-align: center; }
a.rmu-card { text-decoration: none; }
a.rmu-card:hover { border-color: var(--rmu-teal-dark); text-decoration: none; }
.rmu-card svg { stroke: var(--rmu-navy); }
.rmu-card-title { font-weight: 700; font-size: 19px; }
.rmu-from { margin-top: auto; font-weight: 700; font-size: 17px; color: var(--rmu-navy); }

.rmu-trust { display: flex; gap: 16px; align-items: flex-start; }
.rmu-icon { flex: none; width: 48px; height: 48px; border-radius: 12px; background: var(--rmu-soft); color: var(--rmu-navy); display: flex; align-items: center; justify-content: center; }
.rmu-trust strong { display: block; font-size: 17px; }

.rmu-step { text-align: center; }
.rmu-step-n { width: 52px; height: 52px; border-radius: 50%; background: var(--rmu-teal); color: var(--rmu-teal-ink); display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; font: 700 22px "Space Grotesk", sans-serif; }

.rmu-faq { max-width: 820px; margin: 0 auto; }
.rmu-faq details { background: #fff; border: 1px solid var(--rmu-line); border-radius: 12px; padding: 18px 22px; margin-bottom: 12px; }
.rmu-faq summary { font-weight: 600; font-size: 16px; cursor: pointer; }
.rmu-faq p { margin: 12px 0 0; color: var(--rmu-muted); }

/* Footer (all pages) */
.rmu-footer { background: var(--rmu-navy-deep); color: #E6F0F5; font-size: 14px; }
.rmu-footer a { color: #E6F0F5; }
.rmu-footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 32px; padding-top: 56px; padding-bottom: 24px; }
.rmu-footer-grid > div { display: flex; flex-direction: column; gap: 8px; }
.rmu-footer .rmu-logo { color: #fff; font-size: 22px; }
.rmu-footer .rmu-logo span { color: var(--rmu-teal-light); }
.rmu-footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-top: 16px; padding-bottom: 28px; opacity: .8; font-size: 13px; }
.rmu-footer .btn-outline-light { font-size: 13px; }

@media (max-width: 576px) {
    .rmu-hero h1 { font-size: 36px; }
    .rmu-hero-inner { padding: 64px 20px; }
}

/* Home page runs full width (header.tpl drops the container on the home page) */
.rmu-home-body { padding: 0 !important; }
.rmu-home-body > div > .row { margin: 0; }
.rmu-home-body .primary-content { padding: 0; }
.rmu-trust .rmu-muted { display: block; }

/* Fonts everywhere (Nexus sets its own font on some elements) */
body, button, input, select, textarea, .btn, .form-control, .navbar, .nav-link, .dropdown-menu, .card, .table, .sidebar, .list-group-item, .modal { font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .card-title, .rmu-logo { font-family: "Space Grotesk", Inter, sans-serif; }

/* Nexus bug: KB article excerpts use the background colour (near-white) as text colour */
.kb-article-item small { color: var(--rmu-muted); }