/* Paletomat v2 — Modern Manifest
 * "Dokument magazynowy w miękkiej, współczesnej formie":
 * ciepły papier + tusz, pomarańcz #EF6706 jako pieczęć,
 * mono mikro-etykiety, miękkie promienie, subtelne warstwowe cienie. */

:root {
  --bg: #f3f1ec;
  --bg-elev: #f8f6f1;
  --bg-card: #ffffff;
  --bg-card-solid: #f8f6f1;
  --bg-deep: #efece5;

  --bg-section-overlay: rgba(243, 241, 236, 0.94);
  --bg-section-veil: rgba(248, 246, 241, 0.72);

  --ink: #1b1712;
  --ink-soft: #4d463c;
  --ink-muted: #877e6f;
  --ink-mute2: #b5ac9b;
  --ink-mute3: #d5d0c3;

  --line: rgba(181, 172, 155, 0.26);
  --line-2: rgba(181, 172, 155, 0.38);
  --line-3: rgba(181, 172, 155, 0.5);
  --line-edge: rgba(239, 103, 6, 0.28);

  /* Pomarańcz "autumn leaf" — główny akcent (pieczęć) */
  --accent: #ef6706;
  --accent-bright: #f57c22;
  --accent-deep: #d95a04;
  --accent-soft: rgba(239, 103, 6, 0.1);
  --accent-soft-2: rgba(239, 103, 6, 0.16);
  --accent-glow: rgba(239, 103, 6, 0.32);

  /* Aliasy kompatybilności z components.css
     (druga barwa rodziny: bursztyn "hazard", trzecia: jasny pomarańcz) */
  --cyan: #f2b31c;
  --cyan-soft: rgba(242, 179, 28, 0.14);
  --cyan-glow: rgba(242, 179, 28, 0.3);

  --magenta: #f7a154;
  --magenta-soft: rgba(247, 161, 84, 0.16);
  --magenta-glow: rgba(245, 124, 34, 0.26);

  --violet: var(--accent);
  --violet-2: var(--accent-bright);
  --violet-deep: var(--accent-deep);
  --violet-edge: #fbd6ae;
  --magenta-deep: #ef6706;
  --indigo-deep: #b34d05;
  --cyan-rim: var(--cyan);
  --line-violet: var(--line-edge);

  --grad-brand: linear-gradient(135deg, #ef6706 0%, #f57c22 52%, #f2b31c 100%);
  --grad-brand-soft: linear-gradient(160deg, rgba(239, 103, 6, 0.1), rgba(242, 179, 28, 0.06));
  --grad-aurora:
    radial-gradient(ellipse 70% 55% at 12% 18%, rgba(239, 103, 6, 0.08), transparent 58%),
    radial-gradient(ellipse 50% 45% at 88% 72%, rgba(242, 179, 28, 0.07), transparent 62%),
    radial-gradient(ellipse 90% 50% at 50% 105%, rgba(245, 124, 34, 0.05), transparent 70%);

  /* Cienie — miękkie, warstwowe, na ciepłym tuszu (bez neomorfizmu) */
  --neo-raised:
    0 1px 2px rgba(27, 23, 18, 0.05),
    0 10px 28px -18px rgba(27, 23, 18, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  --neo-soft:
    0 1px 2px rgba(27, 23, 18, 0.05),
    0 6px 18px -12px rgba(27, 23, 18, 0.2);
  --neo-pressed:
    inset 0 0 0 1px rgba(181, 172, 155, 0.3),
    inset 0 2px 6px rgba(27, 23, 18, 0.06);
  --neo-float:
    0 2px 4px rgba(27, 23, 18, 0.06),
    0 24px 48px -24px rgba(27, 23, 18, 0.35),
    0 0 0 1px rgba(255, 255, 255, 0.6);
  --neo-indigo:
    0 14px 36px -10px rgba(239, 103, 6, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.35);
  --neo-inner-glow: inset 0 1px 0 rgba(255, 255, 255, 0.95), inset 0 0 20px rgba(239, 103, 6, 0.04);

  --shadow-lg: var(--neo-float);
  --shadow-md: var(--neo-soft);

  --font-sans: "Instrument Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-display: "Bricolage Grotesque", "Instrument Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", "Segoe UI Mono", monospace;
  --font-bar: "Libre Barcode 39", cursive;

  --t-display: clamp(42px, 6.8vw, 88px);
  --t-h1: clamp(36px, 5.4vw, 76px);
  --t-h2: clamp(30px, 4vw, 52px);
  --t-h3: clamp(19px, 1.5vw, 23px);
  --t-body: clamp(15px, 1vw, 17px);
  --t-small: 14px;
  --t-mono: 11px;

  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 64px;
  --s-9: 96px;
  --s-10: 128px;

  --max-w: 1280px;
  --gutter: clamp(20px, 5vw, 56px);

  --r-1: 6px;
  --r-2: 12px;
  --r-3: 18px;
  --r-4: 24px;
  --r-5: 32px;
  --r-btn: 14px;
  --r-card: 20px;

  --ease-expo-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-overshoot: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-power-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-power-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  --d-fast: 180ms;
  --d-base: 320ms;
  --d-slow: 600ms;
  --d-cinema: 950ms;

  --z-canvas: 0;
  --z-bg-fx: 1;
  --z-overlay: 2;
  --z-section: 3;
  --z-nav: 50;
  --z-modal: 100;
  --z-ui: 200;

  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);

  --mx: 50%;
  --my: 50%;
}
