/*
Theme Name: FinoBazaar Premium
Theme URI: https://finobazaar.com/
Author: Finobazaar
Description: FinoBazaar Premium 2.0 — the official FinoBazaar logo and its colours, a premium mobile-first design system, one SVG icon language and calm motion, on top of the same service registry, hooks and plugin contracts as the Finobazaar theme 2.1. Presentation only: calculators, loans, property, DLC, banking, insurance and accounts stay in their plugins.
Version: 2.0.1
Requires at least: 6.3
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: finobazaar
Tags: finance, property, custom-logo, custom-menu, featured-images, translation-ready, accessibility-ready, rtl-language-support
*/

/* =====================================================================
   1. Fonts — IBM Plex Sans (body, Latin + Devanagari) and Source Serif 4
   (headings, Latin), self-hosted, OFL. The serif answers the serif of the
   official wordmark; Devanagari headings use Plex Sans Devanagari, so a
   Hindi page never downloads the serif.
   ===================================================================== */
@font-face {
	font-family: "Finobazaar Sans";
	src: url("assets/fonts/plex-sans-latin-400.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Finobazaar Sans";
	src: url("assets/fonts/plex-sans-latin-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Finobazaar Sans";
	src: url("assets/fonts/plex-sans-devanagari-400.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
@font-face {
	font-family: "Finobazaar Sans";
	src: url("assets/fonts/plex-sans-devanagari-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}

@font-face {
	font-family: "Finobazaar Display";
	src: url("assets/fonts/source-serif-4-latin-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Finobazaar Display";
	src: url("assets/fonts/plex-sans-devanagari-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}

/* =====================================================================
   2. Tokens — derived from the official logo (measured on the file):
   logo blue #0C5EE8 (the "fino" letters and the .com mark), logo black
   #111111 (the "bazaar" letters), white (inside the mark). Every other
   colour is a tint, shade or neutral of these. Contrast on white:
   blue 5.6:1, blue-dark 7.2:1, deep 10.3:1, ink 18.9:1, text-2 6.4:1.
   The logo has black letters, so it is always shown on light surfaces.
   ===================================================================== */
:root {
	/* Brand (from the logo) */
	--fb-logo-blue: #0c5ee8;
	--fb-logo-black: #111111;

	--fb-brand-primary: #0c5ee8;        /* actions, links, active states */
	--fb-brand-primary-dark: #0a4fc4;   /* hover, pressed */
	--fb-brand-primary-deep: #073a93;   /* dense text on tints, deep accents */
	--fb-brand-primary-light: #e8f0fe;  /* selected, soft highlight */
	--fb-brand-primary-surface: #f4f7fd;/* information blocks, alternate sections */
	--fb-brand-primary-line: #c9dafb;   /* blue-tinted borders */
	--fb-brand-sky: #dbe8fd;            /* light blue (illustrations, chips) */

	--fb-text: #1f2733;                 /* body text */
	--fb-text-2: #57606e;               /* secondary text (6.4:1 on white) */
	--fb-bg: #f6f8fb;                   /* cool page background for alternate bands */
	--fb-border: #e2e7ef;               /* borders */

	/* Names used by components and plugins since theme 2.0 (kept): the
	   "green" and "navy" names now resolve to the logo palette. */
	--fb-brand-green: var(--fb-brand-primary);
	--fb-brand-green-dark: var(--fb-brand-primary-dark);
	--fb-brand-green-light: var(--fb-brand-primary-light);
	--fb-brand-green-surface: var(--fb-brand-primary-surface);
	--fb-brand-green-line: var(--fb-brand-primary-line);
	--fb-brand-navy: var(--fb-logo-black);
	--fb-brand-navy-ink: var(--fb-logo-black);
	--fb-brand-gold: var(--fb-brand-primary);       /* no gold in the logo: accents are blue */
	--fb-brand-gold-ink: var(--fb-brand-primary-deep);
	--fb-brand-gold-light: var(--fb-brand-primary-light);
	--fb-on-dark-accent: #9ec0fb;

	--fb-brand-blue: var(--fb-brand-primary);
	--fb-brand-blue-dark: var(--fb-brand-primary-dark);
	--fb-brand-blue-deep: var(--fb-brand-primary-deep);
	--fb-brand-blue-light: var(--fb-brand-primary-light);
	--fb-brand-blue-surface: var(--fb-brand-primary-surface);
	--fb-brand-blue-line: var(--fb-brand-primary-line);
	--fb-brand-blue-on-dark: var(--fb-on-dark-accent);
	--fb-brand-black: var(--fb-logo-black);

	--fb-green: var(--fb-brand-primary);
	--fb-green-800: var(--fb-brand-primary-dark);
	--fb-green-900: var(--fb-brand-primary-deep);
	--fb-green-100: var(--fb-brand-primary-line);
	--fb-green-50: var(--fb-brand-primary-light);
	--fb-blue: var(--fb-brand-primary);
	--fb-blue-800: var(--fb-brand-primary-deep);
	--fb-blue-50: var(--fb-brand-primary-light);
	--fb-gold: var(--fb-brand-primary);
	--fb-gold-ink: var(--fb-brand-primary-deep);
	--fb-gold-50: var(--fb-brand-primary-light);

	/* Neutrals */
	--fb-white: #fff;
	--fb-ivory: var(--fb-bg);
	--fb-beige: var(--fb-brand-primary-surface);
	--fb-gray: #eef1f6;
	--fb-line: var(--fb-border);
	--fb-line-strong: #c7cfdb;
	--fb-ink: var(--fb-text);
	--fb-heading: var(--fb-logo-black);
	--fb-muted: var(--fb-text-2);
	--fb-placeholder: #6b7482;
	--fb-ghost: #8a93a1;

	/* Status (data labels). Functional only, never brand colours. */
	--fb-ok: #1e6b3f;
	--fb-ok-bg: #e9f5ee;
	--fb-user: #3d4f66;
	--fb-user-bg: #eef2f7;
	--fb-warn: #7f5200;
	--fb-warn-bg: #fdf0d2;
	--fb-warn-dot: #b97800;
	--fb-na: #5f6368;
	--fb-na-bg: #f1f3f5;
	--fb-error: #a12a2a;
	--fb-error-bg: #fbeaea;
	--fb-focus: var(--fb-brand-primary-dark);

	/* Back-compat aliases used by plugins built for theme 1.x */
	--fb-teal-950: var(--fb-logo-black);
	--fb-teal-900: var(--fb-brand-blue-dark);
	--fb-teal-800: var(--fb-brand-blue-dark);
	--fb-teal-700: var(--fb-brand-blue);
	--fb-teal-600: var(--fb-brand-blue);
	--fb-teal-100: var(--fb-brand-blue-line);
	--fb-teal-50: var(--fb-brand-blue-light);
	--fb-gold-100: var(--fb-brand-primary-light);
	--fb-gold-hover: var(--fb-brand-primary-deep);
	--fb-paper: var(--fb-bg);
	--fb-ok-line: #bfe0cc;
	--fb-user-line: #cdd6e2;
	--fb-warn-line: #ecd08a;
	--fb-na-line: #c7cfdb;

	/* Type */
	--fb-font: "Finobazaar Sans", "IBM Plex Sans", "IBM Plex Sans Devanagari", system-ui, -apple-system, "Segoe UI", "Noto Sans", "Noto Sans Devanagari", sans-serif;
	--fb-font-body: var(--fb-font);
	--fb-font-display: "Finobazaar Display", "Source Serif 4", Georgia, "Times New Roman", serif;
	--fb-fs-xs: 0.8125rem;
	--fb-fs-sm: 0.875rem;
	--fb-fs-base: 1rem;
	--fb-fs-md: 1.125rem;
	--fb-fs-lg: 1.375rem;
	--fb-fs-xl: clamp(1.5rem, 1.2rem + 1.2vw, 1.875rem);
	--fb-fs-2xl: clamp(1.875rem, 1.4rem + 2vw, 2.5rem);
	--fb-fs-3xl: clamp(2.125rem, 1.4rem + 3.4vw, 3.5rem);
	--fb-fs-4xl: clamp(2.5rem, 1.5rem + 4.4vw, 4.25rem);
	--fb-lh-body: 1.6;
	--fb-lh-head: 1.15;
	--fb-track-head: -0.015em;

	/* Shape and depth (shadows tinted with a cool navy, never flat grey) */
	--fb-r-xs: 4px;
	--fb-r-sm: 6px;
	--fb-r-btn: 12px;
	--fb-r-md: 14px;
	--fb-r-lg: 20px;
	--fb-r-xl: 28px;
	--fb-r-pill: 999px;
	--fb-sh-1: 0 1px 2px rgba(10, 32, 80, 0.06), 0 1px 1px rgba(10, 32, 80, 0.04);
	--fb-sh-2: 0 12px 28px -16px rgba(10, 40, 110, 0.28), 0 2px 6px -2px rgba(10, 40, 110, 0.06);
	--fb-sh-3: 0 34px 70px -34px rgba(10, 40, 110, 0.38);
	--fb-sh-focus: 0 0 0 4px rgba(12, 94, 232, 0.18);

	/* Layout */
	--fb-container: 76rem;
	--fb-container-narrow: 46rem;
	--fb-gutter: clamp(1rem, 4vw, 2rem);
	--fb-space-section: clamp(3.5rem, 7vw, 6rem);
	--fb-header-h: 4.25rem;

	/* Motion */
	--fb-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
	--fb-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
	--fb-dur-1: 160ms;
	--fb-dur-2: 280ms;
	--fb-dur-3: 560ms;
}

/* Devanagari needs taller lines for matras; headings loosen a little more. */
:lang(hi),
:lang(mr) {
	--fb-lh-body: 1.75;
	--fb-lh-head: 1.35;
	--fb-track-head: 0;
}

/* =====================================================================
   3. Reset and base
   ===================================================================== */
*,
*::before,
*::after { box-sizing: border-box; }
[hidden] { display: none !important; }

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	scroll-padding-top: calc(var(--fb-header-h) + 1rem);
}

body {
	margin: 0;
	background: var(--fb-white);
	color: var(--fb-ink);
	font: 400 var(--fb-fs-base) / var(--fb-lh-body) var(--fb-font);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
}

body.fb-locked { overflow: hidden; }

img,
svg,
video { display: block; max-width: 100%; height: auto; }

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 0.5em;
	color: var(--fb-heading);
	font-family: var(--fb-font-display);
	font-weight: 600;
	line-height: var(--fb-lh-head);
	letter-spacing: var(--fb-track-head);
	text-wrap: balance;
}

h1 { font-size: var(--fb-fs-3xl); }
h2 { font-size: var(--fb-fs-2xl); }
h3 { font-size: var(--fb-fs-lg); }
h4 { font-size: var(--fb-fs-md); }

p { margin: 0 0 1em; text-wrap: pretty; }

a {
	color: var(--fb-green);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
	transition: color var(--fb-dur-1) var(--fb-ease);
}
a:hover { color: var(--fb-green-900); }

:focus-visible {
	outline: 3px solid var(--fb-focus);
	outline-offset: 2px;
	border-radius: var(--fb-r-xs);
}

button,
input,
select,
textarea { font: inherit; color: inherit; }

button { cursor: pointer; }

::selection { background: var(--fb-green-100); color: var(--fb-green-900); }

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.skip-link:focus {
	position: fixed !important;
	inset-block-start: 0.5rem;
	inset-inline-start: 0.5rem;
	z-index: 1000;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0.75rem 1rem;
	clip: auto;
	clip-path: none;
	background: var(--fb-white);
	color: var(--fb-ink);
	font-weight: 600;
	border-radius: var(--fb-r-sm);
	box-shadow: var(--fb-sh-2);
}

/* =====================================================================
   4. Layout primitives
   ===================================================================== */
.fb-container {
	width: 100%;
	max-width: calc(var(--fb-container) + var(--fb-gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--fb-gutter);
}
.fb-container--narrow { max-width: calc(var(--fb-container-narrow) + var(--fb-gutter) * 2); }

.fb-main { display: block; outline: 0; }

.fb-section { padding-block: var(--fb-space-section); }
.fb-section--tint { background: var(--fb-ivory); }
.fb-section--alt { background: var(--fb-ivory); }
.fb-section--first { padding-block-start: clamp(2rem, 5vw, 3.5rem); }

.fb-section__head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 0.75rem 2rem;
	margin-block-end: clamp(1.5rem, 3vw, 2.25rem);
}
.fb-section__head > div { max-width: 44rem; }
.fb-section__title { margin: 0; font-size: var(--fb-fs-2xl); }
.fb-section__desc { margin: 0.6rem 0 0; color: var(--fb-muted); font-size: var(--fb-fs-md); }
.fb-section__link { font-weight: 600; white-space: nowrap; }

.fb-grid { display: grid; gap: 1.25rem; margin: 0; padding: 0; list-style: none; }
@media (min-width: 40rem) { .fb-grid--2, .fb-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .fb-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.fb-muted { color: var(--fb-muted); }

/* =====================================================================
   5. Buttons
   ===================================================================== */
.fb-btn {
	--fb-btn-bg: var(--fb-green);
	--fb-btn-fg: var(--fb-white);
	--fb-btn-bd: var(--fb-green);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 3rem;
	padding: 0.7rem 1.25rem;
	border: 1.5px solid var(--fb-btn-bd);
	border-radius: var(--fb-r-btn);
	background: var(--fb-btn-bg);
	color: var(--fb-btn-fg);
	font: 600 var(--fb-fs-base) / 1.2 var(--fb-font);
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color var(--fb-dur-1) var(--fb-ease), border-color var(--fb-dur-1) var(--fb-ease), color var(--fb-dur-1) var(--fb-ease), box-shadow var(--fb-dur-2) var(--fb-ease), transform var(--fb-dur-1) var(--fb-ease);
}
.fb-btn:hover { --fb-btn-bg: var(--fb-green-800); --fb-btn-bd: var(--fb-green-800); color: var(--fb-btn-fg); box-shadow: var(--fb-sh-2); }
.fb-btn:active { transform: translateY(1px); box-shadow: none; }
.fb-btn .fb-icon { width: 1.15em; height: 1.15em; }
.fb-btn__arrow { transition: transform var(--fb-dur-2) var(--fb-ease); }
.fb-btn:hover .fb-btn__arrow { transform: translateX(3px); }
[dir="rtl"] .fb-btn__arrow { transform: scaleX(-1); }
[dir="rtl"] .fb-btn:hover .fb-btn__arrow { transform: scaleX(-1) translateX(3px); }

.fb-btn--primary {}
.fb-btn--secondary { --fb-btn-bg: var(--fb-brand-blue-light); --fb-btn-fg: var(--fb-brand-blue-dark); --fb-btn-bd: var(--fb-brand-blue-line); }
.fb-btn--secondary:hover { --fb-btn-bg: var(--fb-white); --fb-btn-fg: var(--fb-brand-blue-dark); --fb-btn-bd: var(--fb-brand-blue); box-shadow: none; }
.fb-btn--outline { --fb-btn-bg: var(--fb-white); --fb-btn-fg: var(--fb-brand-blue); --fb-btn-bd: var(--fb-brand-blue-line); }
.fb-btn--outline:hover { --fb-btn-bg: var(--fb-green-50); --fb-btn-fg: var(--fb-green-900); --fb-btn-bd: var(--fb-green); box-shadow: none; }
/* 'gold' is the historical name of the accent button; it is brand blue now. */
.fb-btn--gold { --fb-btn-bg: var(--fb-brand-blue); --fb-btn-fg: var(--fb-white); --fb-btn-bd: var(--fb-brand-blue); }
.fb-btn--gold:hover { --fb-btn-bg: var(--fb-brand-blue-dark); --fb-btn-bd: var(--fb-brand-blue-dark); --fb-btn-fg: var(--fb-white); }
.fb-btn--light { --fb-btn-bg: var(--fb-white); --fb-btn-fg: var(--fb-green-900); --fb-btn-bd: var(--fb-white); }
.fb-btn--light:hover { --fb-btn-bg: var(--fb-green-50); --fb-btn-bd: var(--fb-green-50); --fb-btn-fg: var(--fb-green-900); }
.fb-btn--ghost-light { --fb-btn-bg: transparent; --fb-btn-fg: var(--fb-white); --fb-btn-bd: rgba(255, 255, 255, 0.45); }
.fb-btn--ghost-light:hover { --fb-btn-bg: rgba(255, 255, 255, 0.1); --fb-btn-bd: var(--fb-white); --fb-btn-fg: var(--fb-white); box-shadow: none; }
.fb-btn--text { --fb-btn-bg: transparent; --fb-btn-fg: var(--fb-green); --fb-btn-bd: transparent; min-height: 2.75rem; padding-inline: 0.25rem; }
.fb-btn--text:hover { --fb-btn-bg: transparent; --fb-btn-bd: transparent; --fb-btn-fg: var(--fb-green-900); box-shadow: none; text-decoration: underline; }
.fb-btn--icon { width: 2.75rem; min-height: 2.75rem; padding: 0; --fb-btn-bg: transparent; --fb-btn-fg: var(--fb-ink); --fb-btn-bd: transparent; }
.fb-btn--icon:hover { --fb-btn-bg: var(--fb-gray); --fb-btn-bd: var(--fb-gray); --fb-btn-fg: var(--fb-ink); box-shadow: none; }
.fb-btn--sm { min-height: 2.5rem; padding: 0.45rem 0.9rem; font-size: var(--fb-fs-sm); }
.fb-btn--lg { min-height: 3.5rem; padding-inline: 1.6rem; font-size: var(--fb-fs-md); }
.fb-btn--block { width: 100%; }
.fb-btn[disabled],
.fb-btn[aria-disabled="true"] { opacity: 0.55; pointer-events: none; }

/* =====================================================================
   6. Form controls
   ===================================================================== */
.fb-field { display: grid; gap: 0.35rem; }
.fb-field__label { font-size: var(--fb-fs-sm); font-weight: 600; color: var(--fb-ink); }
.fb-field__hint { font-size: var(--fb-fs-xs); color: var(--fb-muted); }

.fb-input,
.fb-select,
.fb-textarea,
.fb-search__input {
	width: 100%;
	min-height: 3rem;
	padding: 0.7rem 0.95rem;
	border: 1.5px solid var(--fb-line-strong);
	border-radius: var(--fb-r-btn);
	background: var(--fb-white);
	color: var(--fb-ink);
	transition: border-color var(--fb-dur-1) var(--fb-ease), box-shadow var(--fb-dur-1) var(--fb-ease);
}
.fb-input:hover,
.fb-select:hover,
.fb-textarea:hover { border-color: var(--fb-muted); }
.fb-input:focus,
.fb-select:focus,
.fb-textarea:focus,
.fb-search__input:focus { outline: 0; border-color: var(--fb-green); box-shadow: var(--fb-sh-focus); }
.fb-input[aria-invalid="true"] { border-color: var(--fb-error); }
.fb-input::placeholder,
.fb-search__input::placeholder { color: var(--fb-placeholder); }

/* =====================================================================
   7. Motion system
   One orchestrated load sequence in the hero (home.css), a quiet reveal
   for sections, and motion that answers what the person did. Everything
   is off when the visitor prefers reduced motion.
   ===================================================================== */
@keyframes fb-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes fb-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes fb-pulse { 0% { transform: scale(0.6); opacity: 0.55; } 100% { transform: scale(2.6); opacity: 0; } }
@keyframes fb-shimmer { from { background-position: -200% 0; } to { background-position: 200% 0; } }

html.js [data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity var(--fb-dur-3) var(--fb-ease), transform var(--fb-dur-3) var(--fb-ease); transition-delay: calc(var(--fb-i, 0) * 70ms); }
html.js [data-reveal].is-in { opacity: 1; transform: none; }

.fb-skeleton {
	border-radius: var(--fb-r-sm);
	background: linear-gradient(90deg, var(--fb-gray) 0%, #e4e9f1 40%, var(--fb-gray) 80%);
	background-size: 200% 100%;
	animation: fb-shimmer 1.4s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		transition-delay: 0ms !important;
		scroll-behavior: auto !important;
	}
	html.js [data-reveal] { opacity: 1; transform: none; }
}