/* inmake/2026 — the teaser identity of Insight Base's own product.
   Dark by kinship: the vizitka family (inbs) established the near-black
   card with a lit horizon, and this page is its sibling in the brand
   violet #8535f5. Every ratio quoted is measured (scratchpad contrast
   script, WCAG 2.1).

   The brand violet is urbanity's lesson mirrored: there the brand cyan
   was too LIGHT to be an ink on white (2.85:1), here the violet is too
   DARK to be an ink on near-black — 3.60:1, a mark and a display voice,
   never small text. It lives at 500 verbatim; the ACTING 600 is the
   same hue lifted to #a880f9 (6.70:1 on the page), and white text is
   not the answer on it either — the on-primary ink is near-black
   violet (6.48:1 on 600).

   The licensed face is Industry, served by Adobe Fonts — the same kit
   the sibling pages use, THE SAME RULES APPLY: it may not be
   self-hosted, the kit is domain-locked, `font-display` lives in the
   kit. The full story is at the head of clients/ingrade/2026/theme.css. */
@import url("https://use.typekit.net/zay0cfm.css");

/* Inter behind Industry as the fallback that can render Czech before
   the kit arrives — self-hosted, the family's shared files. */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../assets/fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+2013-2014, U+2018-201D, U+2026;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../assets/fonts/inter-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-024F, U+1E00-1EFF;
}

:root {
  --color-scheme: dark;

  /* ------------------------------------------------------------------
     COLOR — the violet ramp, role-ordered; 700 above 600 in lightness,
     the dark-theme ordering every sibling uses.
     ------------------------------------------------------------------ */
  --color-primary-50:  #f3ecfe;
  --color-primary-100: #e4d5fd;
  --color-primary-200: #cbb0fb;
  --color-primary-300: #ab82f8;
  --color-primary-400: #9257f6;
  --color-primary-500: #8535f5;   /* the brand, verbatim — 3.60 on the page: display only */
  --color-primary-600: #a880f9;   /* acts — 6.70 on the page */
  --color-primary-700: #bd9dfb;   /* hover — brighter, not darker; 8.83 */
  --color-primary-800: #4a1d96;   /* ink on the 100 chip — 7.99 */
  --color-primary-900: #2e1163;   /* ink on the 200 chip — 8.09; scrim base */

  --color-primary: var(--color-primary-600);

  /* One-colour brand: the secondary is the brand hex itself, so the
     app's client mark carries the true violet, not the lifted ink. */
  --color-secondary: var(--color-primary-500);
  --color-secondary-strong: #5a24b4;   /* 6.49 on the 100 chip */

  /* Surfaces — near-black with a violet cast, a shade lighter than
     pure black so the glass, the glow and the horizon have ground. */
  --color-surface:         #0b0912;
  --color-surface-alt:     #131022;
  --color-surface-inverse: #06040c;

  --color-text:            #f1eef9;   /* 17.27 / 16.30 */
  --color-text-muted:      #a89fc0;   /* 7.90 / 7.45 */
  --color-text-on-primary: #16062e;   /* 6.48 on 600, 8.53 on the 700 hover */
  --color-text-on-inverse: #f1eef9;

  --color-border: #241f38;

  /* Feedback states — the sibling dark tuning: translucent-dark softs,
     light strong inks (9.2–10.0 measured), near-black labels on base. */
  --color-success:        #4ec27d;
  --color-success-soft:   #11251a;
  --color-success-strong: #8bdaa8;
  --color-success-on:     #06150c;

  --color-warning:        #e8802b;
  --color-warning-soft:   #281d0a;
  --color-warning-strong: #f0c274;
  --color-warning-on:     #1a0d03;

  --color-error:          #ef6257;
  --color-error-soft:     #2b1211;
  --color-error-strong:   #ffa49c;
  --color-error-on:       #1c0604;

  --color-info:           #58b6c9;
  --color-info-soft:      #0e2429;
  --color-info-strong:    #96d6e3;
  --color-info-on:        #05161a;

  /* ------------------------------------------------------------------
     TYPOGRAPHY — Industry everywhere, ingrade's measured findings for
     this exact face inherited: 600 headings, positive tracking, the
     0.02em body.
     ------------------------------------------------------------------ */
  --font-heading: "industry", "Inter", system-ui, sans-serif;
  --font-body:    "industry", "Inter", system-ui, sans-serif;
  --font-button:  var(--font-body);

  --font-weight-heading: 600;
  --font-weight-body:    400;
  --font-weight-bold:    600;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   clamp(1.125rem, 1.05rem + 0.4vw, 1.25rem);
  --text-xl:   clamp(1.25rem, 1.1rem + 0.8vw, 1.5rem);
  --text-2xl:  clamp(1.5rem, 1.25rem + 1.4vw, 2rem);
  --text-3xl:  clamp(1.875rem, 1.4rem + 2.4vw, 2.75rem);
  --text-4xl:  clamp(2.5rem, 1.6rem + 4.2vw, 4.5rem);
  --text-5xl:  clamp(2.75rem, 1.75rem + 4.4vw, 5rem);

  --leading-tight:   1.2;
  --leading-normal:  1.6;
  --leading-display: 1.04;

  --tracking-tight:   0.005em;
  --tracking-display: 0.01em;
  --tracking-body:    0.02em;

  /* ------------------------------------------------------------------
     SHAPE — sharp, the family trait: the mark is a bracket around a
     block, and the sibling card set the corners to zero.
     ------------------------------------------------------------------ */
  --radius-sm:   0px;
  --radius-md:   0px;
  --radius-lg:   0px;
  --radius-xl:   0px;
  --radius-full: 999px;
  --radius-panel: 0px;

  --border-width: 1px;

  --space-unit: 0.25rem;
  --section-space: clamp(3.5rem, 1.75rem + 5.5vw, 8rem);
  --container-max: 75rem;

  --shadow-sm: 0 1px 2px rgb(0 0 0 / 0.45);
  --shadow-md: 0 2px 6px rgb(0 0 0 / 0.45), 0 8px 20px rgb(0 0 0 / 0.40);
  --shadow-lg: 0 4px 12px rgb(0 0 0 / 0.45), 0 20px 48px rgb(0 0 0 / 0.55);

  /* ------------------------------------------------------------------
     MOTION — a teaser breathes slowly; nothing on it darts.
     ------------------------------------------------------------------ */
  --ease-out-expo:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-spring:    cubic-bezier(0.34, 1.4, 0.64, 1);
  --motion-easing:  var(--ease-out-expo);

  --motion-duration:      200ms;
  --motion-duration-slow: 400ms;

  --reveal-duration:      600ms;
  --reveal-duration-slow: 800ms;
  --reveal-distance:       16px;
  --reveal-stagger:        70ms;
  --reveal-stagger-group:  70ms;
  --reveal-stagger-line:  100ms;

  /* ------------------------------------------------------------------
     PREMIUM LAYER — glass with a violet hairline; the focus ring
     answers in the brand.
     ------------------------------------------------------------------ */
  --card-surface: rgb(255 255 255 / 0.03);
  --card-border: rgb(133 53 245 / 0.22);
  --card-border-hover: rgb(133 53 245 / 0.45);
  --card-shadow: inset 0 1px 0 rgb(255 255 255 / 0.05), var(--shadow-lg);

  --field-focus-ring: 0 0 0 2px rgb(133 53 245 / 0.45), 0 0 18px rgb(133 53 245 / 0.22);

  --leading-ui: 1.5;
  --label-ink-shift: 0.13em;
  --btn-label-shift: 0.075em;
  --btn-line-height: 1.25;
}