/* ============================================================
   NBR MOBILITY — Brand Alignment PREVIEW (homepage only)
   Brochure reskin scoped to body.home. Loaded only when
   NBR_BRAND_PREVIEW is true (see functions.php).

   THROWAWAY FILE: deleted in Phase 4 when the brand is applied
   at source. See ~/BRAND_ALIGNMENT_PLAN.md.

   Tokens from websiteupdate/nbr-brand.css (brochure system).
   ============================================================ */

/* ---- 1. Tokens + WP preset remap ------------------------------
   Preset classes (.has-primary-background-color etc.) reference
   var(--wp--preset--color--*), so remapping the variables under
   body.home recolours every preset usage on the homepage only. */
body.home {
	/* Brochure tokens */
	--nbr-navy-deep: #0f1c44;
	--nbr-navy: #16265c;
	--nbr-blue: #1f3f93;
	--nbr-blue-2: #2a5fd0;
	--nbr-bright: #3d7bf4;
	--nbr-sky: #dce8fc;
	--nbr-mist: #f3f6fc;
	--nbr-line: #e2e9f5;
	--nbr-ink: #111b3b;
	--nbr-slate: #586489;
	--nbr-slate-2: #7a85a6;
	--nbr-green: #1f9d57;
	--nbr-gold: #f6b32c;
	--nbr-on-dark-soft: #c4d2ee;
	--nbr-on-dark-blue: #7fb0ff;
	--nbr-navy-wash: linear-gradient(160deg, #1d326f 0%, #14245a 60%, #101d49 100%);
	--nbr-display: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--nbr-body: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

	/* WP preset remap (old palette -> brochure) */
	--wp--preset--color--primary: var(--nbr-navy);
	--wp--preset--color--primary-light: var(--nbr-blue-2);
	--wp--preset--color--accent: var(--nbr-bright);
	--wp--preset--color--accent-light: var(--nbr-on-dark-blue);
	--wp--preset--color--dark: var(--nbr-navy-deep);
	--wp--preset--color--dark-lighter: #1d326f;
	--wp--preset--color--muted: var(--nbr-on-dark-soft);      /* homepage: used on dark surfaces only (top bar, footer) */
	--wp--preset--color--muted-dark: var(--nbr-slate);
	--wp--preset--color--border: var(--nbr-line);
	--wp--preset--color--light: var(--nbr-mist);
	--wp--preset--color--lighter: #f7f9fd;
	--wp--preset--color--blue-50: var(--nbr-sky);
	--wp--preset--color--yellow: var(--nbr-gold);
	--wp--preset--color--green: var(--nbr-green);
}

/* ---- 2. Typography --------------------------------------------
   Body -> Manrope. Headings / buttons / nav / stats -> Plus Jakarta
   Sans with the brochure's tight negative letter-spacing. */
body.home {
	font-family: var(--nbr-body);
	color: var(--nbr-ink);
}

body.home h1,
body.home h2,
body.home h3,
body.home h4,
body.home h5,
body.home h6 {
	font-family: var(--nbr-display);
	letter-spacing: -0.5px;
}

body.home h3,
body.home h4 {
	letter-spacing: -0.3px;
}

body.home .wp-block-button__link,
body.home .nbr-nav a,
body.home .nbr-hero-badge,
body.home .nbr-stat-number,
body.home .nbr-usp-title,
body.home .nbr-category-title,
body.home .wp-block-search__button {
	font-family: var(--nbr-display);
}

/* ---- 3. Buttons: brochure corners (tight, 8px) ----------------*/
body.home .wp-block-button__link {
	border-radius: 8px !important;
	font-weight: 700;
}

/* ---- 4. Header -------------------------------------------------*/
/* Top bar background flips to navy-deep via the preset remap.
   Link hover on dark -> on-dark-blue. */
body.home .nbr-top-bar a:hover {
	color: var(--nbr-on-dark-blue);
}

body.home .nbr-main-header {
	border-bottom: 1px solid var(--nbr-line);
}

/* Search bar */
body.home .wp-block-search.nbr-search-form .wp-block-search__inside-wrapper {
	border-color: var(--nbr-line);
	background: #f7f9fd;
}

body.home .wp-block-search.nbr-search-form .wp-block-search__inside-wrapper:focus-within {
	border-color: var(--nbr-bright);
	box-shadow: 0 0 0 4px rgba(61, 123, 244, 0.12);
}

body.home .wp-block-search.nbr-search-form .wp-block-search__input::placeholder {
	color: var(--nbr-slate-2);
}

body.home .wp-block-search.nbr-search-form .wp-block-search__button {
	background: var(--nbr-blue-2) !important;
}

body.home .wp-block-search.nbr-search-form .wp-block-search__button:hover {
	background: var(--nbr-blue) !important;
}

/* Navigation bar: brand navy ramp */
body.home .nbr-nav {
	background: linear-gradient(135deg, #16265c 0%, #1f3f93 100%);
}

body.home .nbr-nav a {
	font-weight: 600;
}

body.home .nbr-nav a:hover {
	color: var(--nbr-on-dark-blue);
}

body.home .nbr-nav a::after {
	background: var(--nbr-bright);
}

body.home .nbr-nav .wp-block-navigation-item.has-child:hover > .wp-block-navigation-item__content,
body.home .nbr-nav .wp-block-navigation-item.has-child:hover .wp-block-navigation__submenu-icon {
	color: var(--nbr-on-dark-blue) !important;
}

body.home .nbr-nav .wp-block-navigation__submenu-container.wp-block-navigation-submenu {
	background: linear-gradient(135deg, #16265c 0%, #1f3f93 100%) !important;
}

body.home .nbr-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	color: var(--nbr-on-dark-blue) !important;
}

/* ---- 5. Hero: brochure navy wash -------------------------------*/
body.home .nbr-hero {
	background: var(--nbr-navy-wash);
}

body.home .nbr-hero::before {
	background: radial-gradient(circle, rgba(61, 123, 244, 0.16) 0%, transparent 60%);
}

/* Badge -> brochure "pill on navy" (translucent blue) */
body.home .nbr-hero-badge {
	background: rgba(118, 160, 250, 0.22) !important;
	border: 1px solid rgba(150, 185, 255, 0.35);
	color: #cfe0ff !important;
	box-shadow: none;
	letter-spacing: 1.3px !important;
}

body.home .nbr-hero h1 {
	letter-spacing: -0.5px;
}

body.home .nbr-hero p:not(.nbr-hero-badge) {
	color: var(--nbr-on-dark-soft);
}

/* Hero buttons */
body.home .nbr-btn-primary .wp-block-button__link,
body.home .wp-block-button.nbr-btn-primary .wp-block-button__link {
	color: var(--nbr-navy) !important;
}

/* ---- 6. USP bar -------------------------------------------------*/
body.home .nbr-usp-bar {
	background: linear-gradient(180deg, #f7f9fd 0%, #ffffff 100%);
}

body.home .nbr-usp-item {
	border: 1px solid var(--nbr-line);
	border-radius: 12px;
	box-shadow: none;
}

body.home .nbr-usp-item::before {
	background: linear-gradient(90deg, var(--nbr-blue) 0%, var(--nbr-bright) 100%);
}

body.home .nbr-usp-item:hover {
	box-shadow: 0 18px 50px rgba(20, 30, 60, 0.10);
}

body.home .nbr-usp-icon {
	background: var(--nbr-sky);
	color: var(--nbr-blue-2);
	border-radius: 10px;
}

body.home .nbr-usp-item:hover .nbr-usp-icon {
	background: linear-gradient(135deg, var(--nbr-navy) 0%, var(--nbr-blue-2) 100%);
	box-shadow: 0 10px 25px rgba(42, 95, 208, 0.35);
}

body.home .nbr-usp-title {
	color: var(--nbr-navy);
}

body.home .nbr-usp-text {
	color: var(--nbr-slate);
}

/* ---- 7. Category grid ------------------------------------------*/
body.home .nbr-categories-section {
	background: linear-gradient(180deg, #ffffff 0%, var(--nbr-mist) 100%);
}

body.home .nbr-category-card {
	border: 1px solid var(--nbr-line);
	border-radius: 12px;
}

body.home .nbr-category-card::after {
	background: linear-gradient(90deg, var(--nbr-navy) 0%, var(--nbr-blue-2) 100%);
}

body.home .nbr-category-card:hover {
	box-shadow: 0 18px 50px rgba(20, 30, 60, 0.12);
}

body.home .nbr-category-image {
	background: linear-gradient(135deg, #f7f9fd 0%, var(--nbr-mist) 100%);
}

body.home .nbr-category-card:hover .nbr-category-image {
	background: linear-gradient(135deg, var(--nbr-mist) 0%, var(--nbr-sky) 100%);
}

body.home .nbr-category-icon {
	background: var(--nbr-sky);
	border-radius: 10px;
}

body.home .nbr-category-icon svg {
	stroke: var(--nbr-blue-2);
}

body.home .nbr-category-card:hover .nbr-category-icon {
	background: linear-gradient(135deg, var(--nbr-navy) 0%, var(--nbr-blue-2) 100%);
	box-shadow: 0 10px 25px rgba(42, 95, 208, 0.3);
}

body.home .nbr-category-title {
	color: var(--nbr-navy);
}

body.home .nbr-category-price {
	color: var(--nbr-blue-2) !important;
}

body.home .nbr-category-arrow {
	background: var(--nbr-mist);
}

body.home .nbr-category-arrow svg {
	stroke: var(--nbr-slate);
}

body.home .nbr-category-card:hover .nbr-category-arrow {
	background: var(--nbr-blue-2);
}

/* ---- 8. Stats bar: navy wash band -------------------------------*/
body.home .nbr-stats-bar {
	background: var(--nbr-navy-wash);
}

body.home .nbr-stats-bar::before {
	background: radial-gradient(ellipse at center, rgba(61, 123, 244, 0.14) 0%, transparent 60%);
}

body.home .nbr-stat-label {
	color: var(--nbr-on-dark-soft) !important;
	font-family: var(--nbr-body);
}

/* ---- 9. About intro ---------------------------------------------*/
body.home .nbr-about-intro {
	background: linear-gradient(180deg, #ffffff 0%, #f7f9fd 100%);
	border-bottom: 1px solid var(--nbr-line);
}

body.home .nbr-contact-icon {
	stroke: var(--nbr-blue-2);
}

body.home .nbr-contact-item a {
	color: var(--nbr-navy);
}

body.home .nbr-contact-item a:hover {
	color: var(--nbr-blue-2);
}

/* ---- 10. CTA section: navy wash ---------------------------------*/
body.home .nbr-cta-section {
	background: var(--nbr-navy-wash);
}

body.home .nbr-cta-section::before {
	background: radial-gradient(ellipse at center top, rgba(127, 176, 255, 0.18) 0%, transparent 60%);
}

body.home .nbr-cta-section p {
	color: var(--nbr-on-dark-soft);
}

body.home .nbr-cta-button .wp-block-button__link {
	color: var(--nbr-navy) !important;
}

body.home .nbr-cta-button .wp-block-button__link:hover {
	background: var(--nbr-sky) !important;
}

/* ---- 11. Footer: navy-deep ---------------------------------------*/
body.home .nbr-footer {
	background: linear-gradient(180deg, var(--nbr-navy-deep) 0%, #0a1129 100%);
	color: var(--nbr-on-dark-soft);
}

body.home .nbr-footer a {
	color: var(--nbr-on-dark-soft);
}

body.home .nbr-footer a:hover {
	color: var(--nbr-on-dark-blue);
}

body.home .nbr-footer-bottom {
	border-top: 1px solid rgba(196, 210, 238, 0.18);
}

body.home .nbr-social-icon {
	background: #1d326f;
	color: var(--nbr-on-dark-soft);
}

body.home .nbr-social-icon:hover {
	background: var(--nbr-blue-2);
}

/* ---- 12. Generic section titles ----------------------------------*/
body.home .nbr-section-title {
	color: var(--nbr-navy);
	letter-spacing: -0.5px;
}

body.home .nbr-section-subtitle {
	color: var(--nbr-slate);
}

/* ---- 13. Mobile header --------------------------------------------*/
body.home .nbr-mobile-action-bar {
	background: var(--nbr-navy-deep);
}

body.home .nbr-mobile-header {
	border-bottom: 1px solid var(--nbr-line);
}

body.home .nbr-mobile-icon-btn {
	color: var(--nbr-blue-2);
}

/* ---- 14. Focus rings (brochure accessibility spec) ----------------*/
body.home a:focus-visible,
body.home button:focus-visible,
body.home input:focus-visible,
body.home select:focus-visible,
body.home textarea:focus-visible {
	outline: 3px solid var(--nbr-bright);
	outline-offset: 2px;
}