/**
 * Tamal Datta — The Executive Study
 * Design Tokens & CSS Custom Properties
 * Adhering strictly to TAMAL-DATTA-REDESIGN-PROMPT.md
 */

:root {
  /* Exact Logo-Led Colour System — Light Appearance (Default) */
  --td-bg: #FFFFFF;              /* Main page surface */
  --td-surface: #FFFFFF;         /* Forms and occasional inset surfaces */
  --td-surface-alt: #F4F8F8;     /* Quiet pale-teal section variation */
  --td-text: #32373F;            /* Logo charcoal: headings and primary text */
  --td-muted: #53656A;           /* Supporting text and metadata */
  --td-accent: #70ACA9;          /* Logo teal: links, selected states and artwork */
  --td-accent-strong: #3D7F7D;   /* Teal text on white and keyboard focus */
  --td-button: #32373F;          /* Primary button background */
  --td-button-text: #FFFFFF;     /* Primary button text */
  --td-rule: #D7E6E6;            /* Fine dividers */
  --td-control-border: #8A9A9E;  /* Visible input/button boundaries */
  --td-focus: #3D7F7D;           /* Keyboard focus outline */
  --td-error: #9B3328;           /* Form errors, accompanied by text */

  /* Typography */
  --td-font-serif: 'Newsreader', Georgia, 'Times New Roman', serif;
  --td-font-sans: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Spacing Scale (4, 8, 12, 16, 24, 32, 48, 64, 96px) */
  --td-space-1: 4px;
  --td-space-2: 8px;
  --td-space-3: 12px;
  --td-space-4: 16px;
  --td-space-5: 24px;
  --td-space-6: 32px;
  --td-space-7: 48px;
  --td-space-8: 64px;
  --td-space-9: 96px;

  /* Layout Constraints */
  --td-max-width: 1200px;
  --td-article-max-width: 720px;
  --td-gutter-desktop: 48px;
  --td-gutter-tablet: 32px;
  --td-gutter-mobile: 20px;
  --td-section-gap-desktop: 96px;
  --td-section-gap-mobile: 60px;

  /* Radii — Square or fine edges (max 4px-6px) */
  --td-radius-button: 3px;
  --td-radius-card: 4px;
  --td-radius-img: 2px;

  /* 3D Theme-Aligned Interactive Tokens (Logo-Led Brand System) */
  --td-theme-gradient: linear-gradient(135deg, #3D7F7D 0%, #70ACA9 100%);
  --td-theme-gradient-hover: linear-gradient(135deg, #326A68 0%, #62A09D 100%);
  --td-theme-shadow-3d: #265452;
  --td-theme-glow: rgba(112, 172, 169, 0.42);
  --td-theme-tint: rgba(112, 172, 169, 0.08);
  --td-theme-tint-shadow: rgba(61, 127, 125, 0.35);
  --td-theme-border: #70ACA9;
  --td-theme-light: #9DD4D0;
  --td-theme-rgb: 112, 172, 169;
}