/* ============================================================
   DISHOILA ENGINEERING LIMITED — DESIGN TOKENS  (v2 · editorial)
   Direction: airier, lighter, fully Garamond, muted gold.
   Single source of truth for the entire site.
   ============================================================ */

:root {
  /* ---- Brand palette ---- */
  --vanta:        #0A0A0A;
  --graphite:     #131313;
  --graphite-2:   #171717;
  --graphite-line:#232323;
  --steel:        #7C7C78;
  --steel-soft:   #A6A6A1;

  /* Gold — muted. Kept as a whisper: mostly hairlines + soft text.
     Base hue slightly desaturated; presence controlled via the
     opacity ramp below rather than solid fills. */
  --gold:         #BFA05A;         /* softened from #C8A44D */
  --gold-bright:  #D6BC79;
  --gold-deep:    #8C7439;

  --gold-text:    rgba(191,160,90,0.85);  /* accent text */
  --gold-dim:     rgba(191,160,90,0.55);  /* quiet text / icons */
  --gold-line:    rgba(191,160,90,0.30);  /* hairlines */
  --gold-faint:   rgba(191,160,90,0.12);  /* washes / grids */

  --white:        #FFFFFF;
  --warm-white:   #F7F6F3;
  --light-grey:   #E9E9E5;
  --ink:          #16160F;
  --ink-soft:     #55554C;

  --text-on-dark:  #E8E8E3;
  --text-on-light: var(--ink);

  /* ---- Gradients (restrained) ---- */
  --grad-overlay: linear-gradient(180deg, rgba(10,10,10,0.10) 0%, rgba(10,10,10,0.45) 55%, rgba(10,10,10,0.90) 100%);

  /* ---- Typography — Garamond everywhere ---- */
  --font-display: "EB Garamond", Georgia, "Times New Roman", serif;
  --font-body:    "EB Garamond", Georgia, "Times New Roman", serif;
  --font-ui:      "EB Garamond", Georgia, serif;

  /* Fluid scale — a touch larger + airier than v1 */
  --fs-hero:    clamp(3rem, 1.7rem + 6.2vw, 5.75rem);
  --fs-page:    clamp(2.4rem, 1.6rem + 3.6vw, 3.5rem);
  --fs-section: clamp(2rem, 1.4rem + 2.8vw, 3rem);
  --fs-card:    clamp(1.5rem, 1.2rem + 1.1vw, 1.95rem);
  --fs-sub:     clamp(1.25rem, 1.1rem + 0.55vw, 1.55rem);
  --fs-body:    1.2rem;
  --fs-small:   1.05rem;
  --fs-xs:      0.9rem;

  --lh-tight: 1.06;
  --lh-snug:  1.3;
  --lh-body:  1.8;

  --ls-hero:  -0.005em;
  --ls-eyebrow: 0.42em;
  --ls-nav:   0.06em;

  --w-body: 400;
  --w-medium: 500;
  --w-display: 400;

  /* ---- Spacing — airier ---- */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4.5rem;
  --space-7: 6.5rem;
  --section-y: clamp(6rem, 4rem + 8vw, 12rem);
  --gutter:    clamp(1.5rem, 0.6rem + 3.4vw, 3.5rem);
  --maxw:      1280px;
  --maxw-text: 62ch;

  /* ---- Radius (subtler) ---- */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 14px;
  --r-pill: 999px;

  /* ---- Shadows — lighter ---- */
  --shadow-sm: 0 2px 10px rgba(0,0,0,0.10);
  --shadow-md: 0 20px 60px rgba(0,0,0,0.22);
  --shadow-lg: 0 40px 100px rgba(0,0,0,0.30);
  --ring-gold: 0 0 0 1px var(--gold-line);

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 0.25s;
  --dur: 0.5s;
  --dur-slow: 1s;

  /* ---- Layout chrome ---- */
  --nav-h: 96px;
  --topbar-h: 42px;
  --z-topbar: 60;
  --z-nav: 70;
  --z-overlay: 90;
  --z-modal: 100;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0.001s; --dur: 0.001s; --dur-slow: 0.001s; }
}