/* ==========================================================================
   realestate.asenter.in — Design Tokens
   Enterprise SaaS System inspired by Stripe, Linear, & Vercel
   Full White & Pure Light Palette with Gold Brand Accents
   ========================================================================== */

:root {
  /* Brand & Color Tokens - AS Enterprises Gold Suite */
  --color-accent: #F8B000;
  --color-accent-light: #FFC133;
  --color-accent-deep: #D98A00;
  --color-accent-dark: #A66900;
  --color-accent-glow: rgba(248, 176, 0, 0.25);
  --color-accent-bg: rgba(248, 176, 0, 0.08);
  --color-accent-gradient: linear-gradient(135deg, #FFC133 0%, #F8B000 50%, #D98A00 100%);
  --color-gold-shimmer: linear-gradient(90deg, rgba(248,176,0,0.08) 0%, rgba(255,255,255,0.8) 50%, rgba(248,176,0,0.08) 100%);

  /* Pristine Full White Background System */
  --color-bg: #FFFFFF;
  --color-bg-alt: #FAF9F6;
  --color-bg-mesh: radial-gradient(circle at 50% 0%, rgba(248, 176, 0, 0.08) 0%, #FFFFFF 75%);
  --color-surface: #FFFFFF;
  --color-surface-hover: #F8F8F5;
  --color-surface-dark: #14140F;
  --color-surface-glass: rgba(255, 255, 255, 0.92);
  
  --color-ink: #14140F;
  --color-ink-muted: #5C5B56;
  --color-ink-light: #8E8D8A;
  --color-ink-inverse: #FFFFFF;

  --color-border: rgba(20, 20, 20, 0.08);
  --color-border-hover: rgba(20, 20, 20, 0.18);
  --color-border-accent: rgba(248, 176, 0, 0.35);

  --color-success: #00C853;
  --color-success-bg: rgba(0, 200, 83, 0.08);
  --color-whatsapp: #25D366;
  --color-whatsapp-hover: #20BA5A;

  /* Grid Background Pattern */
  --bg-grid-pattern: radial-gradient(rgba(20, 20, 20, 0.06) 1px, transparent 1px);

  /* Typography Scale */
  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: 'JetBrains Mono', SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;

  --text-display: clamp(2.25rem, 5vw, 4rem); /* 36px to 64px */
  --text-h2: clamp(1.75rem, 3.5vw, 2.5rem);  /* 28px to 40px */
  --text-h3: clamp(1.1875rem, 2vw, 1.375rem); /* 19px to 22px */
  --text-h4: clamp(0.9375rem, 1.5vw, 1rem);   /* 15px to 16px */
  
  --text-body-lg: clamp(1rem, 1.2vw, 1.125rem); /* 16px to 18px */
  --text-body: clamp(0.9375rem, 1vw, 1rem);     /* 15px to 16px */
  --text-body-sm: clamp(0.8125rem, 0.9vw, 0.875rem); /* 13px to 14px */
  --text-label: 0.75rem;                       /* 12px */

  --lh-display: 1.1;
  --lh-heading: 1.2;
  --lh-body: 1.6;
  --lh-tight: 1.3;

  /* Spacing Grid (8pt System) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --space-32: 128px;

  /* Layout Containers */
  --container-max: 1200px;
  --prose-max: 680px;
  --gutter-mobile: 20px;
  --gutter-desktop: 40px;

  /* Border Radii */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-pill: 9999px;

  /* Elevation Shadows */
  --shadow-xs: 0 2px 8px rgba(20, 20, 20, 0.04);
  --shadow-sm: 0 8px 20px rgba(20, 20, 20, 0.06);
  --shadow-md: 0 16px 40px rgba(20, 20, 20, 0.08);
  --shadow-lg: 0 24px 60px rgba(20, 20, 20, 0.12);
  --shadow-gold: 0 8px 24px rgba(248, 176, 0, 0.35);
  --shadow-gold-lg: 0 16px 40px rgba(248, 176, 0, 0.35);
  --shadow-inner: inset 0 2px 4px rgba(0, 0, 0, 0.04);

  /* Motion Timings */
  --motion-instant: 120ms ease-out;
  --motion-fast: 250ms cubic-bezier(0.16, 1, 0.3, 1);
  --motion-base: 400ms cubic-bezier(0.16, 1, 0.3, 1);
  --motion-slow: 700ms cubic-bezier(0.2, 0.7, 0.2, 1);

  /* Z-Indices */
  --z-sticky: 100;
  --z-header: 200;
  --z-modal: 300;
  --z-toast: 400;
}