/* =============================================================
   Skydent — Design Tokens
   Re-skinned to the "Skydent Homepage" design (Sora/Instrument Sans,
   light airy OKLCH teal+navy system). Token NAMES are unchanged so
   every existing rule keeps working — only the VALUES moved.
   Design refs: teal #teal-deep primary · ink navy · tint surfaces.
   ============================================================= */

:root {
  /* --- Brand palette (from skydent.css "Skydent (3)" redesign — brighter cyan-teal) --- */
  --sk-primary:        #076d84;  /* teal-deep — primary buttons    */
  --sk-primary-dark:   #055868;  /* teal-ink  — hover / links       */
  --sk-primary-darker: #044a59;  /* deepest teal                    */
  --sk-primary-light:  #0a8ba8;  /* teal      — accent line / icons */
  --sk-primary-50:     #eef6f8;  /* tint      — light section bg    */
  --sk-tint-deep:      #dcecf0;  /* tint-deep — icon chip / pill    */
  --sk-navy:           oklch(0.29 0.05 260);   /* ink       — topbar/footer/text */
  --sk-accent:         #0a8ba8;  /* teal                            */
  --sk-whatsapp:       #25d366;

  /* --- Neutrals / surfaces --- */
  --sk-bg:        oklch(0.99 0.004 210);
  --sk-surface:   #eef6f8;  /* tint      */
  --sk-surface-2: #dcecf0;  /* tint-deep */
  --sk-text:      oklch(0.29 0.05 260);    /* ink       */
  --sk-text-soft: oklch(0.47 0.032 250);   /* ink-soft  */
  --sk-text-mute: oklch(0.60 0.022 245);   /* ink-faint */
  --sk-border:    oklch(0.912 0.014 210);  /* line      */
  --sk-border-2:  oklch(0.86 0.018 208);

  /* --- Typography --- */
  --sk-font-base: "Instrument Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --sk-font-head: "Sora", "Instrument Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --sk-fs-xs:   0.8125rem;  /* 13px */
  --sk-fs-sm:   0.9375rem;  /* 15px */
  --sk-fs-base: 1rem;       /* 16px */
  --sk-fs-lg:   1.125rem;   /* 18px */
  --sk-fs-xl:   1.375rem;   /* 22px */
  --sk-fs-2xl:  1.75rem;    /* 28px */
  --sk-fs-3xl:  2.25rem;    /* 36px */
  --sk-fs-4xl:  3rem;       /* 48px */

  --sk-lh-tight: 1.18;
  --sk-lh-base:  1.65;
  --sk-fw-normal: 400;
  --sk-fw-medium: 500;
  --sk-fw-semi:   600;
  --sk-fw-bold:   700;

  /* --- Spacing scale (8pt-ish) — roomier upper steps for more breathing room --- */
  --sk-space-1: 0.25rem;
  --sk-space-2: 0.5rem;
  --sk-space-3: 0.75rem;
  --sk-space-4: 1rem;
  --sk-space-5: 1.5rem;
  --sk-space-6: 2.25rem;   /* was 2rem   */
  --sk-space-7: 3.5rem;    /* was 3rem   */
  --sk-space-8: 5rem;      /* was 4rem   */
  --sk-space-9: 7.5rem;    /* was 6rem — bigger section rhythm */

  /* --- Layout --- */
  --sk-container:    1180px;
  --sk-container-sm: 880px;   /* tighter measure for comfy reading */
  --sk-gutter:       1.5rem;

  /* --- Radius (design: 18 cards · 12 sm · 22 media · pill) --- */
  --sk-radius-sm: 12px;
  --sk-radius:    18px;
  --sk-radius-lg: 22px;
  --sk-radius-full: 999px;

  /* --- Shadow (design: shadow-card / shadow-lift) --- */
  --sk-shadow-sm: 0 1px 2px oklch(0.29 0.05 260 / .04), 0 4px 12px -8px oklch(0.29 0.05 260 / .10);
  --sk-shadow:    0 1px 2px oklch(0.29 0.05 260 / .04), 0 8px 24px -12px oklch(0.29 0.05 260 / .12);
  --sk-shadow-lg: 0 2px 4px oklch(0.29 0.05 260 / .05), 0 18px 40px -16px oklch(0.29 0.05 260 / .22);

  /* --- Motion --- */
  --sk-ease: cubic-bezier(.4, 0, .2, 1);
  --sk-dur:  .2s;

  /* Map our brand onto Elementor's global vars so Elementor widgets
     inherit the palette automatically where possible. */
  --e-global-color-primary:   var(--sk-primary);
  --e-global-color-secondary: var(--sk-navy);
  --e-global-color-accent:    var(--sk-accent);
  --e-global-color-text:      var(--sk-text);
  --e-global-typography-primary-font-family: "Sora";
  --e-global-typography-text-font-family:    "Instrument Sans";
}