/* ==========================================================================
   Design Tokens — Inner Space Creation
   Single source of truth for all brand values.
   Reference these via var(--isc-*) in Elementor custom CSS and theme styles.
   ========================================================================== */

:root {
  /* === COLOURS: Primary Palette === */
  --isc-ink-black:      #1A1A1A;
  --isc-warm-stone:     #8C7355;  /* DECORATIVE ONLY — fills, borders. NEVER for text. */
  --isc-pale-stone:     #E8DFD0;
  --isc-off-white:      #F5F2EE;

  /* === COLOURS: WCAG-Verified Text === */
  --isc-text-charcoal:      #2D2D2D;  /* primary body — 12.99:1 on cream */
  --isc-text-driftwood:     #5E5850;  /* secondary body — 6.63:1 */
  --isc-text-stone:         #6E5A3E;  /* accent text, labels, links — 5.89:1 */
  --isc-text-deep-linen:    #6B6358;  /* captions, footnotes — 5.91:1 */
  --isc-text-accent-mid:    #B09070;  /* accent on dark backgrounds — 5.86:1 on black */
  --isc-bg-stone:           #7A6245;  /* coloured backgrounds — white text on it 5.74:1 */

  /* === COLOURS: Semantic Aliases === */
  --isc-color-body:         var(--isc-text-charcoal);
  --isc-color-heading:      var(--isc-ink-black);
  --isc-color-caption:      var(--isc-text-deep-linen);
  --isc-color-link:         var(--isc-text-stone);
  --isc-color-link-hover:   var(--isc-ink-black);
  --isc-color-bg-page:      var(--isc-off-white);
  --isc-color-bg-section:   var(--isc-pale-stone);
  --isc-color-bg-dark:      var(--isc-ink-black);
  --isc-color-border:       var(--isc-warm-stone);

  /* === TYPOGRAPHY === */
  --isc-font-display:  'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --isc-font-body:     'Jost', 'Gill Sans', 'Segoe UI', sans-serif;

  --isc-fw-light:    300;
  --isc-fw-regular:  400;
  --isc-fw-medium:   500;

  /* Font sizes — mobile-first, clamp for fluid scaling */
  --isc-fs-hero:      clamp(2rem, 5vw, 3.5rem);        /* 32px → 56px */
  --isc-fs-h1:        clamp(1.75rem, 4vw, 2.75rem);     /* 28px → 44px */
  --isc-fs-h2:        clamp(1.5rem, 3vw, 2.25rem);      /* 24px → 36px */
  --isc-fs-h3:        clamp(1.25rem, 2.5vw, 1.75rem);   /* 20px → 28px */
  --isc-fs-h4:        clamp(1.125rem, 2vw, 1.375rem);   /* 18px → 22px — Cormorant minimum */
  --isc-fs-body:      clamp(0.875rem, 1.5vw, 1rem);     /* 14px → 16px */
  --isc-fs-caption:   clamp(0.75rem, 1.25vw, 0.875rem); /* 12px → 14px */
  --isc-fs-eyebrow:   0.75rem;                            /* 12px, always uppercase */

  /* Line heights */
  --isc-lh-display:   1.2;
  --isc-lh-heading:   1.3;
  --isc-lh-body:      1.7;
  --isc-lh-caption:   1.5;

  /* Letter spacing */
  --isc-ls-eyebrow:   0.15em;
  --isc-ls-heading:   -0.01em;
  --isc-ls-body:      0.01em;

  /* === SPACING SCALE (8px base) === */
  --isc-space-xs:     0.25rem;  /*  4px */
  --isc-space-sm:     0.5rem;   /*  8px */
  --isc-space-md:     1rem;     /* 16px */
  --isc-space-lg:     1.5rem;   /* 24px */
  --isc-space-xl:     2rem;     /* 32px */
  --isc-space-2xl:    3rem;     /* 48px */
  --isc-space-3xl:    4rem;     /* 64px */
  --isc-space-4xl:    6rem;     /* 96px */

  /* === LAYOUT === */
  --isc-max-width:    1200px;
  --isc-gutter:       1.5rem;   /* 24px */

  /* === BORDERS & RADIUS === */
  --isc-radius-sm:    4px;
  --isc-radius-md:    8px;
  --isc-radius-lg:    12px;

  /* === SHADOWS === */
  --isc-shadow-sm:    0 1px 3px rgba(26, 26, 26, 0.08);
  --isc-shadow-md:    0 4px 12px rgba(26, 26, 26, 0.1);
  --isc-shadow-lg:    0 8px 24px rgba(26, 26, 26, 0.12);

  /* === TRANSITIONS === */
  --isc-transition-fast:   150ms cubic-bezier(0.4, 0, 0.2, 1);
  --isc-transition-base:   250ms cubic-bezier(0.4, 0, 0.2, 1);
  --isc-transition-slow:   400ms cubic-bezier(0.22, 1, 0.36, 1);
  --isc-ease-bounce:       cubic-bezier(0.34, 1.56, 0.64, 1);

  /* === FOCUS (WCAG 2.1 AA) === */
  --isc-focus-color:   var(--isc-text-stone);  /* #6E5A3E */
  --isc-focus-width:   2px;
  --isc-focus-offset:  3px;
  --isc-focus-ring:    var(--isc-focus-width) solid var(--isc-focus-color);

  /* === Z-INDEX SCALE === */
  --isc-z-dropdown:    100;
  --isc-z-sticky:      200;
  --isc-z-fixed:       300;
  --isc-z-modal:       400;
  --isc-z-skip-nav:    9999;

  /* === TOUCH TARGETS (WCAG) === */
  --isc-touch-min:     44px;
}