/* ================================================================
   Intellivega Design System Ã¢â‚¬â€ Colors & Type Tokens
   Source of truth for fg/bg/border colors, typography, and
   semantic element styles. Import this once on every page.
   ================================================================ */

/* latin-ext */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/fonts/1fc3cbd9-0f4b-44fb-9769-10b7cb226e4d.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/fonts/0c80c5f3-6f1d-4a55-b00b-e941aa1c495f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/1fc3cbd9-0f4b-44fb-9769-10b7cb226e4d.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/0c80c5f3-6f1d-4a55-b00b-e941aa1c495f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/1fc3cbd9-0f4b-44fb-9769-10b7cb226e4d.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/0c80c5f3-6f1d-4a55-b00b-e941aa1c495f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/1fc3cbd9-0f4b-44fb-9769-10b7cb226e4d.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/0c80c5f3-6f1d-4a55-b00b-e941aa1c495f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/1fc3cbd9-0f4b-44fb-9769-10b7cb226e4d.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/0c80c5f3-6f1d-4a55-b00b-e941aa1c495f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/fonts/1fc3cbd9-0f4b-44fb-9769-10b7cb226e4d.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/fonts/0c80c5f3-6f1d-4a55-b00b-e941aa1c495f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("/fonts/1fc3cbd9-0f4b-44fb-9769-10b7cb226e4d.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("/fonts/0c80c5f3-6f1d-4a55-b00b-e941aa1c495f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/d4d04c0e-0145-4f56-8b7b-d9e8991351f6.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/03864da8-c25f-4169-87a8-75c931ee5a55.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/32512ae4-ffa3-426f-91d3-a98caed910c3.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/46de6ff2-47c0-4d3d-aa3c-be66005fa01e.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/5fdb449b-0b2c-4ca7-9a19-2a58763ff694.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/25bd13dd-4abc-478b-b220-3ba30bbb469b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/d4d04c0e-0145-4f56-8b7b-d9e8991351f6.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/03864da8-c25f-4169-87a8-75c931ee5a55.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/32512ae4-ffa3-426f-91d3-a98caed910c3.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/46de6ff2-47c0-4d3d-aa3c-be66005fa01e.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/5fdb449b-0b2c-4ca7-9a19-2a58763ff694.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/25bd13dd-4abc-478b-b220-3ba30bbb469b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/d4d04c0e-0145-4f56-8b7b-d9e8991351f6.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/03864da8-c25f-4169-87a8-75c931ee5a55.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/32512ae4-ffa3-426f-91d3-a98caed910c3.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/46de6ff2-47c0-4d3d-aa3c-be66005fa01e.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/5fdb449b-0b2c-4ca7-9a19-2a58763ff694.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/25bd13dd-4abc-478b-b220-3ba30bbb469b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* ---------- Webfonts (display) ----------
   Futura Std Heavy and Proxima Nova are pulled from the
   AMP project. They are used sparingly for ad/poster headlines
   that should match printed/legacy collateral. */
@font-face {
  font-family: 'Futura Std Heavy';
  src: url("/fonts/f86c5e60-730e-4486-8802-db816ad21994.otf") format('opentype');
  font-weight: 800 900;
  font-display: swap;
}
@font-face {
  font-family: 'Futura';
  src: url("/fonts/48e1081b-9dfd-4fd5-9039-cccdc0ddffec.ttf") format('truetype');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Proxima Nova';
  src: url("/fonts/8c97ef7d-48c7-40ec-aa61-404918ac459f.otf") format('opentype');
  font-weight: 400;
  font-display: swap;
}

:root {
  /* ============ COLOR Ã¢â‚¬â€ BRAND ============ */
  /* Primary green (per brand guidelines docx) */
  --iv-green-50:  #e6f8ee;
  --iv-green-100: #b8ecd0;
  --iv-green-200: #61D89F;   /* mint-light tint     */
  --iv-green-300: #36D88A;   /* friendly mid        */
  --iv-green-400: #00D075;   /* used in AMP product */
  --iv-green-500: #00B25C;   /* PRIMARY brand green */
  --iv-green-600: #128B4F;   /* deep web variant    */
  --iv-green-700: #00733C;
  --iv-green-800: #218555;
  --iv-green-900: #0a4628;

  /* Secondary pink Ã¢â‚¬â€ accent only, never a primary surface */
  /* Lighter pink Ã¢â‚¬â€ for small text (Ã¢â€°Â¤14px) on dark backgrounds.
     At small sizes, pink-500 (#C33382) drops below 4.5:1 contrast on bg-0.
     This tier raises luminance and slightly drops chroma to kill halation. */
  --iv-pink-200: #ff7eb6;
  --iv-pink-300: #e04d9a;
  --iv-pink-500: #ff7eb6;     /* SECONDARY brand pink (brightened to match pink-200 for better legibility on dark) */
  --iv-pink-600: #C33382;     /* original brand pink (from guidelines docx) Ã¢â‚¬â€ reserved for light mode + print */
  --iv-pink-700: #962025;     /* deep magenta from PDF */

  /* ============ COLOR Ã¢â‚¬â€ DARK NEUTRALS ============ */
  /* Plum-leaning dark ramp lifted from the marketing site. */
  --iv-bg-0:    #0a0a0f;       /* deep space body bg */
  --iv-bg-1:    #121019;       /* card / surface     */
  --iv-bg-2:    #1a1726;       /* raised surface     */
  --iv-bg-3:    #221f30;       /* hover surface      */
  --iv-bg-card: rgba(18, 16, 25, 0.7);  /* glass card */

  --iv-line-1:  rgba(255, 255, 255, 0.06);
  --iv-line-2:  rgba(255, 255, 255, 0.10);
  --iv-line-green:    rgba(0, 178, 92, 0.25);
  --iv-line-green-hi: rgba(0, 178, 92, 0.60);

  /* ============ COLOR Ã¢â‚¬â€ FG ============ */
  --iv-fg-1:    #fbfbfb;       /* headings, primary  */
  --iv-fg-2:    rgba(255,255,255,0.82); /* body      */
  --iv-fg-3:    rgba(255,255,255,0.62); /* muted     */
  --iv-fg-4:    rgba(255,255,255,0.40); /* hint      */
  /* Meta labels Ã¢â‚¬â€ 10Ã¢â‚¬â€œ11px uppercase section kickers, table column
     headers, card labels, chart axis ticks. fg-4 (40%) is too quiet
     for caps at this size; this lifts to ~7:1 on bg-0. */
  --iv-fg-meta: rgba(255, 255, 255, 0.70);
  --iv-fg-on-green: #ffffff;
  --iv-fg-on-light: #15141f;   /* dark plum on light */

  /* ============ COLOR Ã¢â‚¬â€ SEMANTIC ============ */
  --iv-success: var(--iv-green-500);
  --iv-info:    #99c1f1;
  --iv-warning: #ffa348;
  --iv-danger:  #f66151;

  /* ============ COLOR Ã¢â‚¬â€ CHART STROKES ============
     Tuned for legibility on dark bg. Use for chart lines, fills,
     and bars only Ã¢â‚¬â€ NOT for typography. Brand pink-500 / green-500
     are too low-luminance for thin strokes at small sizes. */
  --iv-chart-green: var(--iv-green-300);  /* #36D88A */
  --iv-chart-pink:  #FF5BA5;              /* sits between pink-300 and pink-200 */

  /* ============ ADAPTIVE SURFACE TOKENS ============
     These re-point automatically when an ancestor has `.iv-light`
     or `[data-theme="light"]`. Kits should consume THESE tokens,
     not the raw rgba literals. Defaults below are the dark theme. */
  --iv-page-bg:        #0a0a0f;
  --iv-surface-glass:  rgba(18, 16, 25, 0.70);  /* primary glass card     */
  --iv-surface-panel:  rgba(18, 16, 25, 0.92);  /* opaque panel / popover */
  --iv-surface-nav:    rgba(10, 10, 15, 0.85);  /* top nav bar            */
  --iv-surface-deep:   rgba(10, 10, 15, 0.60);  /* recessed (inputs, etc) */
  --iv-surface-sidebar:#0e0d15;                  /* solid sidebar          */
  --iv-surface-task:   rgba(10, 10, 15, 0.70);  /* small card on column   */
  --iv-surface-col:    rgba(18, 16, 25, 0.50);  /* board column           */

  --iv-shadow-card:        0 8px 32px rgba(0, 0, 0, 0.50);
  --iv-shadow-card-hover:  0 28px 56px rgba(0, 0, 0, 0.70), 0 0 30px rgba(0,178,92,0.25), inset 0 0 15px rgba(0,178,92,0.18);
  --iv-shadow-paper:       0 20px 60px rgba(0, 0, 0, 0.50);
  --iv-shadow-drawer:      -20px 0 60px rgba(0, 0, 0, 0.70);
  --iv-shadow-fab:         0 20px 60px rgba(0, 0, 0, 0.60);
  --iv-shadow-task:        0 4px 16px rgba(0, 0, 0, 0.40);

  --iv-headline-glow:      0 0 30px rgba(0, 178, 92, 0.25);
  --iv-headline-glow-em:   0 0 30px rgba(255, 126, 182, 0.40);  /* pink emphasis text-shadow */
  --iv-ambient-glow-bg:    radial-gradient(circle at 50% 20%, rgba(0,178,92,0.08) 0%, transparent 60%),
                           radial-gradient(circle at 80% 80%, rgba(255,126,182,0.05) 0%, transparent 60%);
  --iv-grid-line:          rgba(0, 178, 92, 0.08);
  --iv-grid-line-strong:   rgba(0, 178, 92, 0.18);

  --iv-paper-soft-green:   linear-gradient(135deg, rgba(0,178,92,0.15), rgba(0,178,92,0.05));
  --iv-paper-soft-pink:    linear-gradient(135deg, rgba(255,126,182,0.15), rgba(255,126,182,0.04));

  /* ============ COLOR Ã¢â‚¬â€ LIGHT MODE ============ */
  /* Dark theme is preferred; light is provided for print, docs,
     and the AMP auth shell which inherits MudBlazor light. */
  --iv-light-bg-0: #fbfbfb;
  --iv-light-bg-1: #ffffff;
  --iv-light-bg-2: #eeedf0;
  --iv-light-fg-1: #15141f;
  --iv-light-fg-2: #585f62;

  /* ============ GRADIENTS ============ */
  --iv-grad-green: linear-gradient(135deg, #00B25C 0%, #20c997 100%);
  --iv-grad-green-deep: linear-gradient(135deg, #128B4F 0%, #00B25C 100%);
  --iv-grad-headline: linear-gradient(135deg, #00B25C 0%, #ffffff 100%);
  --iv-grad-pink: linear-gradient(135deg, #C33382 0%, #e04d9a 100%);

  /* Breathing ambient glow used as page-bg ornament */
  --iv-amb-green: radial-gradient(circle at 50% 50%,
                  rgba(0,178,92,0.08) 0%, transparent 60%);

  /* ============ TYPE Ã¢â‚¬â€ FAMILIES ============ */
  /* Outfit is the everyday UI face on intellivega.com.
     Proxima Nova / Futura are kept for legacy print + ads. */
  --iv-font-sans:    'Outfit', 'Proxima Nova', system-ui, -apple-system,
                     'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
  --iv-font-display: 'Outfit', 'Futura Std Heavy', 'Futura', sans-serif;
  --iv-font-mono:    'JetBrains Mono', ui-monospace, SFMono-Regular,
                     Menlo, Consolas, monospace;

  /* ============ TYPE Ã¢â‚¬â€ SIZE SCALE (1.25 ratio) ============ */
  --iv-text-xs:   12px;
  --iv-text-sm:   14px;
  --iv-text-base: 16px;
  --iv-text-md:   18px;
  --iv-text-lg:   22px;
  --iv-text-xl:   28px;
  --iv-text-2xl:  36px;
  --iv-text-3xl:  48px;
  --iv-text-4xl:  64px;
  --iv-text-5xl:  84px;

  /* ============ TYPE Ã¢â‚¬â€ WEIGHTS ============ */
  --iv-w-light:   300;
  --iv-w-regular: 400;
  --iv-w-medium:  500;
  --iv-w-bold:    700;
  --iv-w-xbold:   800;
  --iv-w-black:   900;

  /* ============ SPACING (4px grid) ============ */
  --iv-space-1:  4px;
  --iv-space-2:  8px;
  --iv-space-3:  12px;
  --iv-space-4:  16px;
  --iv-space-5:  24px;
  --iv-space-6:  32px;
  --iv-space-7:  48px;
  --iv-space-8:  64px;
  --iv-space-9:  96px;
  --iv-space-10: 128px;

  /* ============ RADII ============ */
  --iv-radius-xs:    4px;
  --iv-radius-sm:    8px;
  --iv-radius-md:    12px;
  --iv-radius-lg:    16px;     /* default card */
  --iv-radius-xl:    20px;
  --iv-radius-2xl:   28px;
  --iv-radius-pill:  999px;    /* buttons, chips */

  /* ============ SHADOWS / GLOW ============ */
  --iv-shadow-1: 0 4px 12px rgba(0, 0, 0, 0.30);
  --iv-shadow-2: 0 8px 32px rgba(0, 0, 0, 0.50);
  --iv-shadow-3: 0 20px 40px rgba(0, 0, 0, 0.60);
  --iv-glow-green-sm: 0 0 20px rgba(0, 178, 92, 0.35);
  --iv-glow-green-md: 0 0 40px rgba(0, 178, 92, 0.45);
  --iv-glow-green-lg: 0 0 80px rgba(0, 178, 92, 0.35);
  --iv-glow-pink-sm:  0 0 20px rgba(195, 51, 130, 0.40);

  /* Glass blur used by every premium card */
  --iv-blur:        blur(24px);
  --iv-blur-strong: blur(40px);

  /* ============ MOTION ============ */
  --iv-ease:       cubic-bezier(0.25, 0.8, 0.25, 1);
  --iv-ease-soft:  cubic-bezier(0.165, 0.84, 0.44, 1);
  --iv-dur-fast:   160ms;
  --iv-dur-base:   240ms;
  --iv-dur-slow:   500ms;

  /* ============ Z-INDEX ============ */
  --iv-z-nav: 100;
  --iv-z-modal: 1000;
  --iv-z-fab: 9999;
}

/* ================================================================
   Semantic element styles
   Apply class .iv-typo to a root element to opt in.
   ================================================================ */
.iv-typo,
.iv-typo * {
  font-family: var(--iv-font-sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.iv-typo {
  color: var(--iv-fg-1);
  font-size: var(--iv-text-base);
  line-height: 1.55;
}

.iv-typo h1, .iv-h1 {
  font-family: var(--iv-font-display);
  font-size: var(--iv-text-4xl);
  line-height: 1.05;
  letter-spacing: -0.025em;
  font-weight: var(--iv-w-xbold);
  color: var(--iv-fg-1);
  text-shadow: 0 0 24px rgba(0, 178, 92, 0.20);
  margin: 0 0 var(--iv-space-5);
}
.iv-typo h2, .iv-h2 {
  font-family: var(--iv-font-display);
  font-size: var(--iv-text-3xl);
  line-height: 1.1;
  letter-spacing: -0.02em;
  font-weight: var(--iv-w-xbold);
  color: var(--iv-fg-1);
  margin: 0 0 var(--iv-space-4);
}
.iv-typo h3, .iv-h3 {
  font-size: var(--iv-text-2xl);
  line-height: 1.15;
  letter-spacing: -0.01em;
  font-weight: var(--iv-w-bold);
  color: var(--iv-fg-1);
  margin: 0 0 var(--iv-space-3);
}
.iv-typo h4, .iv-h4 {
  font-size: var(--iv-text-xl);
  line-height: 1.25;
  font-weight: var(--iv-w-bold);
  color: var(--iv-fg-1);
  margin: 0 0 var(--iv-space-3);
}
.iv-typo h5, .iv-h5 {
  font-size: var(--iv-text-lg);
  line-height: 1.3;
  font-weight: var(--iv-w-medium);
  color: var(--iv-fg-1);
  margin: 0 0 var(--iv-space-2);
}

.iv-typo p, .iv-p {
  font-size: var(--iv-text-base);
  line-height: 1.6;
  color: var(--iv-fg-2);
  margin: 0 0 var(--iv-space-4);
  text-wrap: pretty;
}
.iv-lead {
  font-size: var(--iv-text-md);
  line-height: 1.55;
  color: var(--iv-fg-2);
  font-weight: var(--iv-w-regular);
}
.iv-eyebrow {
  font-size: var(--iv-text-xs);
  font-weight: var(--iv-w-bold);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--iv-green-500);
  display: inline-block;
}
.iv-quote {
  font-family: var(--iv-font-display);
  font-size: var(--iv-text-2xl);
  line-height: 1.25;
  font-weight: var(--iv-w-medium);
  color: var(--iv-fg-1);
  font-style: italic;
}
.iv-typo small, .iv-small {
  font-size: var(--iv-text-sm);
  color: var(--iv-fg-3);
}
.iv-typo a, .iv-link {
  color: var(--iv-green-300);
  text-decoration: none;
  transition: color var(--iv-dur-base) var(--iv-ease);
}
.iv-typo a:hover, .iv-link:hover { color: var(--iv-pink-500); }

.iv-typo code, .iv-code {
  font-family: var(--iv-font-mono);
  font-size: 0.9em;
  background: rgba(0, 178, 92, 0.08);
  color: var(--iv-green-300);
  padding: 2px 6px;
  border-radius: var(--iv-radius-xs);
  border: 1px solid var(--iv-line-green);
}

.iv-text-gradient {
  background: var(--iv-grad-green);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.iv-text-headline-gradient {
  background: var(--iv-grad-headline);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* ================================================================
   LIGHT MODE
   Add `class="iv-light"` (or `data-theme="light"`) on <html>, <body>,
   or any ancestor of the surface you want light. Every adaptive
   token re-points; brand pink-500 returns to the deep original
   #C33382 because it sits cleanly above 4.5:1 on paper white.
   ================================================================ */
.iv-light,
[data-theme="light"] {
  /* Ã¢â‚¬â€ Brand: pink-500 restored to the original guidelines value Ã¢â‚¬â€ */
  --iv-pink-300: #962025;
  --iv-pink-500: #C33382;
  --iv-pink-700: #962025;

  /* Ã¢â‚¬â€ Neutrals Ã¢â‚¬â€ */
  --iv-bg-0: #fbfbfb;
  --iv-bg-1: #ffffff;
  --iv-bg-2: #f4f3f6;
  --iv-bg-3: #eeedf0;
  --iv-bg-card: rgba(255, 255, 255, 0.75);

  --iv-line-1: rgba(21, 20, 31, 0.06);
  --iv-line-2: rgba(21, 20, 31, 0.10);
  --iv-line-green:    rgba(0, 178, 92, 0.30);
  --iv-line-green-hi: rgba(0, 178, 92, 0.65);

  /* Ã¢â‚¬â€ Foreground Ã¢â‚¬â€ */
  --iv-fg-1: #15141f;
  --iv-fg-2: rgba(21, 20, 31, 0.78);
  --iv-fg-3: rgba(21, 20, 31, 0.56);
  --iv-fg-4: rgba(21, 20, 31, 0.36);
  --iv-fg-meta: rgba(21, 20, 31, 0.68);

  /* Ã¢â‚¬â€ Adaptive surfaces (white-tinted glass) Ã¢â‚¬â€ */
  --iv-page-bg:        #fbfbfb;
  --iv-surface-glass:  rgba(255, 255, 255, 0.72);
  --iv-surface-panel:  rgba(255, 255, 255, 0.96);
  --iv-surface-nav:    rgba(255, 255, 255, 0.88);
  --iv-surface-deep:   rgba(255, 255, 255, 0.65);
  --iv-surface-sidebar:#fbfbfb;
  --iv-surface-task:   #ffffff;
  --iv-surface-col:    rgba(255, 255, 255, 0.55);

  /* Ã¢â‚¬â€ Shadows: softer, no near-black ambient Ã¢â‚¬â€ */
  --iv-shadow-card:        0 4px 24px rgba(21, 20, 31, 0.07), 0 1px 2px rgba(21, 20, 31, 0.04);
  --iv-shadow-card-hover:  0 20px 40px rgba(21, 20, 31, 0.14), 0 6px 14px rgba(0, 178, 92, 0.10), inset 0 0 0 1px rgba(0, 178, 92, 0.18);
  --iv-shadow-paper:       0 16px 48px rgba(21, 20, 31, 0.10);
  --iv-shadow-drawer:      -16px 0 48px rgba(21, 20, 31, 0.14);
  --iv-shadow-fab:         0 16px 48px rgba(21, 20, 31, 0.14);
  --iv-shadow-task:        0 4px 14px rgba(21, 20, 31, 0.07);

  /* Ã¢â‚¬â€ Glow: turn way down; light bg can't absorb 20%+ green bloom Ã¢â‚¬â€ */
  --iv-headline-glow:    none;
  --iv-headline-glow-em: none;
  --iv-ambient-glow-bg:
    radial-gradient(circle at 50% 10%, rgba(0, 178, 92, 0.06) 0%, transparent 55%),
    radial-gradient(circle at 85% 90%, rgba(195, 51, 130, 0.05) 0%, transparent 55%);
  --iv-grid-line:        rgba(0, 178, 92, 0.07);
  --iv-grid-line-strong: rgba(0, 178, 92, 0.12);

  --iv-paper-soft-green: linear-gradient(135deg, rgba(0, 178, 92, 0.14), rgba(0, 178, 92, 0.04));
  --iv-paper-soft-pink:  linear-gradient(135deg, rgba(195, 51, 130, 0.12), rgba(195, 51, 130, 0.03));

  /* Ã¢â‚¬â€ Headline gradient flips dark to read on white Ã¢â‚¬â€ */
  --iv-grad-headline: linear-gradient(135deg, #128B4F 0%, #15141f 100%);
  --iv-grad-pink:     linear-gradient(135deg, #C33382 0%, #962025 100%);

  /* Ã¢â‚¬â€ Code chip Ã¢â‚¬â€ */
  --iv-code-bg: rgba(0, 178, 92, 0.10);
}

/* Headings inside light scope drop the green text-shadow */
.iv-light h1, .iv-light h2, .iv-light .iv-h1, .iv-light .iv-h2,
[data-theme="light"] h1, [data-theme="light"] h2 {
  text-shadow: var(--iv-headline-glow);
}

