/* ==========================================================================
   RANGASETU — DESIGN TOKENS
   All branding lives here. A rebrand = edit this file only.
   Palette source: final brand colour palette PDF "Color with momentum" (branding/). Logo rules: final "RangSetu logo standards" PDF.
   ========================================================================== */

:root {
  /* ---- Brand palette ---------------------------------------------------- */
  --rang-saffron:   #FFB900;  /* Primary  – hero moments, key actions        */
  --setu-violet:    #8175AB;  /* Primary  – geometric mark, section anchors  */
  --sun-marigold:   #F29F05;  /* Secondary – hover, charts                   */
  --deep-violet:    #5E527F;  /* Secondary – panels, depth                   */
  --festival-coral: #F1645D;  /* Accent   – highlights, alerts               */
  --rani-rose:      #D94F8A;  /* Accent   – gradient sparks                  */
  --paper:          #FFF9F0;  /* Neutral  – warm canvas                      */
  --mist:           #EAE7EF;  /* Neutral  – quiet surfaces                   */
  --slate:          #6B6572;  /* Neutral  – secondary text                   */
  --ink:            #0B0A0C;  /* Neutral  – type, linework                   */
  --arc-teal:       #55BFD0;  /* Only for the logo-arc gradient (from artwork; not in palette) */

  /* ---- Semantic roles --------------------------------------------------- */
  --c-bg:            var(--paper);
  --c-surface:       #ffffff;
  --c-surface-alt:   var(--mist);
  --c-text:          var(--ink);
  --c-text-muted:    var(--slate);
  --c-primary:       var(--rang-saffron);
  --c-primary-hover: var(--sun-marigold);
  --c-on-primary:    var(--ink);
  --c-secondary:     var(--setu-violet);
  --c-secondary-deep:var(--deep-violet);
  --c-accent:        var(--festival-coral);
  --c-accent-2:      var(--rani-rose);
  --c-stage:         var(--ink);
  --c-line:          rgba(11, 10, 12, 0.12);
  --c-line-strong:   rgba(11, 10, 12, 0.28);
  --c-focus:         var(--deep-violet);

  --arc-gradient: conic-gradient(from 205deg,
      rgba(85, 191, 208, 0) 0deg,
      var(--arc-teal) 35deg,
      var(--setu-violet) 105deg,
      var(--rani-rose) 185deg,
      var(--rang-saffron) 255deg,
      rgba(255, 185, 0, 0) 305deg,
      rgba(255, 185, 0, 0) 360deg);

  /* ---- Typography ------------------------------------------------------- */
  /* Laila for headings and body, Marathi and English. Noto Sans Devanagari is only a glyph fallback. */
  --font-display: "Laila", "Noto Sans Devanagari", Georgia, serif;
  --font-body:    "Laila", "Noto Sans Devanagari", Georgia, serif;
  --display-weight: 700;
  --display-tracking: -0.01em;
  --display-case: none;

  --fs-xs:   0.8125rem;
  --fs-sm:   0.9375rem;
  --fs-base: 1.125rem;                              /* 18px — comfortable for Devanagari */
  --fs-lg:   clamp(1.2rem, 1.1rem + 0.5vw, 1.4rem);
  --fs-h4:   clamp(1.15rem, 1.05rem + 0.5vw, 1.35rem);
  --fs-h3:   clamp(1.35rem, 1.2rem + 0.8vw, 1.75rem);
  --fs-h2:   clamp(1.85rem, 1.4rem + 2.2vw, 3rem);
  --fs-h1:   clamp(2.3rem, 1.6rem + 3.6vw, 4.4rem);

  --lh-body: 1.7;
  --lh-head: 1.15;

  /* ---- Shape, space, depth --------------------------------------------- */
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 24px;
  --r-xl: 36px;
  --r-pill: 999px;

  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4.5rem;
  --sp-9: 6.5rem;

  --container: 1200px;
  --gutter: clamp(1rem, 4vw, 2rem);
  --section-y: clamp(3.5rem, 7vw, 6.5rem);
  --header-h: 72px;

  --shadow-sm: 0 1px 2px rgba(11, 10, 12, 0.06), 0 2px 8px rgba(11, 10, 12, 0.05);
  --shadow-md: 0 4px 12px rgba(11, 10, 12, 0.07), 0 12px 32px rgba(11, 10, 12, 0.08);
  --shadow-lg: 0 10px 30px rgba(11, 10, 12, 0.12), 0 30px 70px rgba(11, 10, 12, 0.12);

  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Devanagari needs more vertical room (matras above/below the line) */
:root[lang="mr"] {
  --lh-body: 1.8;
  --lh-head: 1.32;
  --display-tracking: 0;
}