/* SPG Realty brand tokens, from the approved social template system (spg-templates/templates/base.css).
   Paste into :root. Fonts: see the BRAND.md <link>. No gold anywhere. Green is for WhatsApp/CTA only. */
:root{
  /* colour */
  --spg-navy:#0C305B;          /* primary */
  --spg-navy-deep:#071D38;     /* overlays, gradients, dark glass, footer band */
  --spg-white:#FFFFFF;
  --spg-paper:#F4F6F9;         /* light canvas (template .canvas.light) */
  --spg-green:#28CB69;         /* WhatsApp / CTA ONLY */
  /* navy tints (navy on white, solid equivalents) */
  --spg-navy-72:#506A89;       /* secondary text on white (5.6:1) */
  --spg-navy-42:#99A8BA;       /* hairlines / disabled on white */
  --spg-navy-16:#D8DEE5;       /* borders on white */
  --spg-navy-08:#ECEEF2;       /* subtle fills */
  /* white on navy (solid equivalents of the template opacities) */
  --spg-on-navy-92:#ECEEF2;    /* EN lines, body .92 */
  --spg-on-navy-72:#BBC5D1;    /* legal / meta .72 (7.6:1) */
  --spg-on-navy-42:#7287A0;    /* frame hairline .42 (decorative only) */
  --spg-on-navy-30:#556E8C;    /* .hair divider .30 (decorative only) */
  /* type */
  --spg-font-ar:'IBM Plex Sans Arabic','IBM Plex Sans',Tahoma,sans-serif;
  --spg-font-en:'IBM Plex Sans','IBM Plex Sans Arabic',system-ui,sans-serif;
  --spg-lh-hl-ar:1.16; --spg-lh-body-ar:1.55; --spg-lh-en:1.3;
  --spg-track-caps:.34em;      /* spaced Latin caps: kickers / tags, weight 500 */
  /* layout (1080 canvas values; scale for web, see BRAND.md) */
  --spg-margin:72px; --spg-frame-inset:40px; --spg-tick:20px;
  --spg-radius-glass:18px; --spg-radius-pill:999px;
  /* motif */
  --spg-hairline:1px solid rgba(255,255,255,.42);
  --spg-glass-bg:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.07));
  --spg-glass-dark-bg:linear-gradient(135deg,rgba(7,29,56,.62),rgba(7,29,56,.44));
  --spg-glass-blur:blur(22px) saturate(1.2);
  --spg-glass-border:1px solid rgba(255,255,255,.24);
  --spg-glass-dark-border:1px solid rgba(255,255,255,.18);
  --spg-photo-fade:linear-gradient(to bottom,rgba(7,29,56,0) 38%,rgba(7,29,56,.55) 56%,rgba(7,29,56,.92) 78%,#071D38 100%);
  --spg-vignette:radial-gradient(120% 90% at 50% 40%,rgba(7,29,56,0) 55%,rgba(7,29,56,.55) 100%);
}