/* ==========================================================================
   Laxmi Batteries — Design Tokens
   --------------------------------------------------------------------------
   EVERY colour, size and shadow in the site resolves back to this file.
   To re-skin the whole site to the exact logo colours, change ONLY the
   five values in the "BRAND" block below. Nothing else needs to be touched.
   ========================================================================== */

:root {
  /* ---- BRAND — sampled from the Laxmi Batteries logo ------------------- */
  /* crimson of the "बॅटरीज" wordmark                                        */
  --brand:        #D9112B;
  --brand-dark:   #A60C21;  /* pressed/hover state, deep panels             */
  --brand-tint:   #FDEBEE;  /* pale red wash — chips, active tab background */

  /* navy of the "EXIDE बॅटरीचे अधिकृत वितरक" line                            */
  --navy:         #1C3A6E;
  --navy-deep:    #12264A;
  --navy-tint:    #EAEFF7;

  /* gold of the crown and jewellery                                        */
  --accent:       #D9A03C;
  --accent-dark:  #A9761F;

  /* lotus pink — decorative only, use sparingly                            */
  --lotus:        #E1497B;

  /* ---- INK / SURFACE --------------------------------------------------- */
  --ink:          #14161C;  /* headings                                     */
  --ink-2:        #3D424D;  /* body copy                                    */
  --muted:        #6B7280;  /* meta, captions                               */
  --line:         #E4E7EC;  /* borders, dividers                            */
  --line-soft:    #F0F2F5;
  --surface:      #FFFFFF;  /* cards                                        */
  --surface-2:    #F6F7F9;  /* page sections that need separation           */
  --surface-3:    #EDEFF3;
  --on-brand:     #FFFFFF;

  /* ---- STATUS ---------------------------------------------------------- */
  --success:      #12805C;
  --success-tint: #E7F5F0;

  /* ---- TYPE ------------------------------------------------------------ */
  --font-head: "Barlow Condensed", "Arial Narrow", "Segoe UI", system-ui, sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, sans-serif;

  /* fluid type scale — min at 360px, max at 1200px */
  --fs-xs:   0.75rem;                              /* 12 */
  --fs-sm:   0.8125rem;                            /* 13 */
  --fs-base: 1rem;                                 /* 16 */
  --fs-md:   clamp(1.0625rem, 0.4vw + 0.98rem, 1.125rem);
  --fs-lg:   clamp(1.25rem,  0.6vw + 1.1rem,  1.5rem);
  --fs-xl:   clamp(1.5rem,   1.2vw + 1.2rem, 2rem);
  --fs-2xl:  clamp(1.875rem, 2vw + 1.35rem,  2.75rem);
  --fs-3xl:  clamp(2.25rem,  3.4vw + 1.4rem, 3.75rem);

  --lh-tight: 1.08;
  --lh-head:  1.18;
  --lh-body:  1.65;

  --ls-caps: 0.08em;

  /* ---- SPACE (4px base) ------------------------------------------------ */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 2.5rem;
  --sp-8: 3rem;
  --sp-9: 4rem;
  --sp-10: 5rem;

  /* vertical rhythm between major page sections */
  --section-y: clamp(2.75rem, 5vw, 5rem);

  /* ---- LAYOUT ---------------------------------------------------------- */
  --container: 1200px;
  --gutter: clamp(1rem, 3vw, 2rem);
  --topbar-h: 38px;
  --header-h: 76px;
  --header-h-condensed: 62px;

  /* ---- RADIUS ---------------------------------------------------------- */
  --r-xs: 4px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 18px;
  --r-xl: 26px;
  --r-pill: 999px;

  /* ---- ELEVATION ------------------------------------------------------- */
  --sh-xs: 0 1px 2px rgba(16, 24, 40, 0.05);
  --sh-sm: 0 1px 3px rgba(16, 24, 40, 0.08), 0 1px 2px rgba(16, 24, 40, 0.04);
  --sh-md: 0 4px 10px rgba(16, 24, 40, 0.07), 0 2px 4px rgba(16, 24, 40, 0.04);
  --sh-lg: 0 12px 28px rgba(16, 24, 40, 0.10), 0 4px 8px rgba(16, 24, 40, 0.04);
  --sh-brand: 0 8px 20px rgba(217, 17, 43, 0.26);

  /* ---- MOTION ---------------------------------------------------------- */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --t-fast: 150ms;
  --t-base: 220ms;
  --t-slow: 400ms;

  /* ---- Z-INDEX --------------------------------------------------------- */
  --z-base: 1;
  --z-sticky: 100;
  --z-header: 200;
  --z-drawer: 300;
  --z-fab: 400;
}