/* Urban Vault · brand tokens (Option H "Laterite"). This is the ONE place brand colours and fonts are defined.
   Every page links this file first. Source of truth: Branding & Marketing\Brand System\brand.md */
@import url("https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@62..125,100..900&family=Instrument+Sans:wdth,wght@75..100,400..700&family=JetBrains+Mono:wght@400;500;600&family=Gloock&display=swap");

:root{
  /* Ground */
  --basalt:#15120F; --basalt-2:#1C1814; --shale:#2A241F; --shale-2:#3A322B;
  /* Type */
  --bone:#ECE3D3; --bone-2:#CFC6B6; --silt:#B3A794;
  /* Signature: laterite (Nagpur's red soil) */
  --lat:#A9482B; --lat-hi:#D0663E; --lat-deep:#7E3420;
  /* Highlight / live data */
  --ochre:#C99A4B; --ochre-hi:#E0BA72;
  /* Minor mineral green (strata, positive trend) */
  --green:#3E5A4A; --up:#86AE92; --down:#D0663E;
  /* Lines */
  --line:rgba(236,227,211,.14); --line-2:rgba(236,227,211,.28);
  /* Fonts */
  --fd:"Archivo","Arial Narrow",system-ui,sans-serif;          /* display: headlines */
  --ft:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif; /* text */
  --fm:"JetBrains Mono",ui-monospace,Consolas,monospace;      /* figures, labels */
  --fs:"Gloock",Didot,Georgia,serif;                          /* wordmark and founder quote only */
  --ease:cubic-bezier(.2,.7,.2,1);
}
html,body{overflow-x:clip}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}

/* ---- appended by agent 1 (append only; nothing above renamed) ---- */
:root{
  --radius:3px;                 /* square-ish corners: cards, inputs, buttons (2-4px) */
  --ochre-deep:#8A6A3E;         /* muted ochre for secondary fills */
  --silt-2:#8F8474;             /* dimmer caption text (still >4.5:1 on basalt) */
  --foot:#100E0B;               /* footer ground, a step below basalt */
  --scrim:rgba(21,18,15,.72);   /* modal / overlay backdrop */
  /* strata (one colour per layer, surface to bedrock) */
  --st1:#A9482B; --st2:#C99A4B; --st3:#7E3420; --st4:#3E5A4A; --st5:#6F6053; --st6:#6A4A36; --st7:#6a625a;
  --out:cubic-bezier(.16,1,.3,1);
}
/* Logo lockup (H mark + "URBAN VAULT" wordmark). Markup:
   <svg class="uvh-mark" viewBox="0 0 200 200"> small-cut paths </svg><span class="uvh-word">Urban Vault</span> */
.uvh-mark{width:36px;height:36px;flex:none;color:var(--ochre);fill:currentColor}
.uvh-mark .kh{fill:var(--lat-hi)}
.uvh-word{font-family:var(--fs);font-weight:400;font-size:16px;letter-spacing:.3em;text-transform:uppercase;color:var(--bone);white-space:nowrap}

/* ---- Light "Bone" UI (added 2026-09-29 after Chirag: dark was too heavy for long reading) ----
   DEFAULT for everything people read or use: member area, login form, landing content, admin content.
   Dark basalt is reserved for brand moments: homepage 3D hero, login brand panel, sidebars, footer.
   All pairs checked: text 15:1, text-2 8:1, text-3 5:1, laterite text 5.9:1, white on laterite 5.8:1 (WCAG AA+). */
:root{
  --paper:#F4EEE4;      /* page background: warm, not white (less glare) */
  --paper-2:#EDE5D8;    /* alternate section / table header */
  --card:#FBF8F2;       /* cards, inputs, panels */
  --text:#1F1A16;       /* main text (not pure black) */
  --text-2:#4F463E;      /* secondary text */
  --text-3:#6E6358;      /* captions, hints, placeholders */
  --lat-text:#9A3F24;   /* laterite as text/links on light */
  --ochre-text:#7E5F2E; /* ochre labels/figures on light (plain ochre is too faint on paper) */
  --up-l:#3E6B50; --down-l:#9A3F24;   /* trends on light */
  --line-l:rgba(31,26,22,.12); --line-l2:rgba(31,26,22,.22);
  --shadow-l:0 1px 2px rgba(31,26,22,.06),0 8px 24px -12px rgba(31,26,22,.18);
}