/* LTRA — flattened global stylesheet for deploy (tokens inlined). */

/* ===== fonts.css ===== */
/* LTRA — Webfonts (self-hosted, sourced from Google Fonts open-source families)
   Manrope: primary UI/display sans (300–800)
   Roboto Mono: code, data, technical labels (400–500)
   latin + latin-ext subsets — latin-ext carries Polish glyphs (ą ć ę ł ń ó ś ź ż). */

@font-face{font-family:'Manrope';font-style:normal;font-weight:300;font-display:swap;src:url('assets/fonts/manrope-300-latin-ext.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;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:300;font-display:swap;src:url('assets/fonts/manrope-300-latin.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;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/manrope-400-latin-ext.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;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/manrope-400-latin.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;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500;font-display:swap;src:url('assets/fonts/manrope-500-latin-ext.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;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500;font-display:swap;src:url('assets/fonts/manrope-500-latin.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;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:600;font-display:swap;src:url('assets/fonts/manrope-600-latin-ext.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;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:600;font-display:swap;src:url('assets/fonts/manrope-600-latin.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;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:700;font-display:swap;src:url('assets/fonts/manrope-700-latin-ext.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;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:700;font-display:swap;src:url('assets/fonts/manrope-700-latin.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;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:800;font-display:swap;src:url('assets/fonts/manrope-800-latin-ext.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;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:800;font-display:swap;src:url('assets/fonts/manrope-800-latin.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;}
@font-face{font-family:'Roboto Mono';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/roboto-mono-400-latin-ext.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;}
@font-face{font-family:'Roboto Mono';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/roboto-mono-400-latin.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;}
@font-face{font-family:'Roboto Mono';font-style:normal;font-weight:500;font-display:swap;src:url('assets/fonts/roboto-mono-500-latin-ext.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;}
@font-face{font-family:'Roboto Mono';font-style:normal;font-weight:500;font-display:swap;src:url('assets/fonts/roboto-mono-500-latin.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;}


/* ===== colors.css ===== */
/* LTRA — Color tokens
   Dark-mode is the primary surface. Navy is the anchor (structure, trust);
   teal is the single accent (movement, action). Everything else is a cool
   slate neutral ramp. No third hue, no gradients beyond the brand navy→teal. */

:root{
  /* ---- Brand: Navy (anchor) ---- */
  --navy-900: #0f223d;
  --navy-800: #16304f;
  --navy-700: #1a365d;   /* core brand navy — logo, headings, premium fields */
  --navy-600: #234373;
  --navy-500: #2d4a6f;   /* logo square fill on dark */

  /* ---- Brand: Teal (accent) ---- */
  --teal-700: #0f766e;   /* pressed / darker accent */
  --teal-600: #0d9488;   /* core brand teal — CTA, links, "IT", highlights */
  --teal-500: #14b8a6;   /* hover accent */
  --teal-400: #2dd4bf;   /* rare bright detail */

  /* ---- Ink: cool near-black backgrounds ---- */
  --ink-950: #0a0f1a;    /* page background (dark mode) */
  --ink-900: #0f172a;    /* graphite — gradients, deepest panels */
  --ink-850: #111827;    /* raised surface / card on dark */
  --ink-800: #1f2937;    /* border on dark / hairlines */

  /* ---- Slate: neutral ramp ---- */
  --slate-50:  #f8fafc;  /* lightest light-mode surface */
  --slate-100: #f1f5f9;
  --slate-200: #e2e8f0;  /* light-mode hairline border */
  --slate-300: #cbd5e1;
  --slate-400: #94a3b8;
  --slate-500: #64748b;  /* secondary text on light */
  --slate-600: #475569;  /* body text on light */
  --slate-700: #334155;
  --white: #ffffff;

  /* Light-mode foreground steps used on dark */
  --fg-1: #f9fafb;       /* primary text on dark */
  --fg-2: #9ca3af;       /* secondary text on dark */
  --fg-3: #6b7280;       /* muted text on dark */

  /* ---- Semantic / status ---- */
  --danger: #dc2626;     /* "NIE" / errors / critical findings */
  --danger-bg: #fef2f2;
  --success: #0d9488;    /* "TAK" — brand teal doubles as positive */
  --success-bg: #ecfdf5;
  --warning: #d97706;
  --critical: #dc2626;
  --high: #ea580c;
  --medium: #d97706;
  --low: #0d9488;

  /* =====================================================================
     SEMANTIC ALIASES — default theme = DARK (primary brand surface)
     ===================================================================== */
  --bg-page: var(--ink-950);
  --bg-deep: var(--ink-900);
  --surface-card: var(--ink-850);
  --surface-raised: var(--ink-850);
  --surface-sunken: var(--ink-900);

  --border-subtle: var(--ink-800);
  --border-strong: #2a3a4f;
  --border-accent: var(--teal-600);

  --text-primary: var(--fg-1);
  --text-secondary: var(--fg-2);
  --text-muted: var(--fg-3);
  --text-accent: var(--teal-600);
  --text-on-accent: #ffffff;
  --text-inverse: var(--ink-950);

  --accent: var(--teal-600);
  --accent-hover: var(--teal-500);
  --accent-press: var(--teal-700);

  --link: var(--teal-600);
  --link-hover: var(--teal-500);

  --focus-ring: var(--teal-500);
}

/* =====================================================================
   LIGHT THEME — for in-page light panels (statements, services, cases).
   Apply by adding class="theme-light" to a section/container.
   ===================================================================== */
.theme-light{
  --bg-page: var(--white);
  --bg-deep: var(--slate-50);
  --surface-card: var(--white);
  --surface-raised: var(--white);
  --surface-sunken: var(--slate-50);

  --border-subtle: var(--slate-200);
  --border-strong: var(--slate-300);
  --border-accent: var(--teal-600);

  --text-primary: var(--navy-700);
  --text-secondary: var(--slate-500);
  --text-muted: var(--slate-400);
  --text-accent: var(--teal-600);
  --text-inverse: var(--white);

  color: var(--text-primary);
}

/* =====================================================================
   TRUST THEME — "corporate trust" direction (2026 site refresh).
   Light, spacious, navy as the single confident accent. Teal is demoted to a
   functional "live / active" status signal only. Apply class="theme-trust".
   ===================================================================== */
.theme-trust{
  --bg-page: #ffffff;
  --bg-deep: #f6f8fb;          /* faint cool wash for alternating sections */
  --surface-card: #ffffff;
  --surface-raised: #ffffff;
  --surface-sunken: #f3f6fa;

  --border-subtle: #e4e9f0;    /* hairline */
  --border-strong: #d4dce6;
  --border-accent: #16304f;

  --text-primary: #16304f;     /* deep navy ink */
  --text-secondary: #51647d;   /* slate-navy */
  --text-muted: #8294aa;
  --text-accent: #16304f;
  --text-on-accent: #ffffff;
  --text-inverse: #ffffff;

  --accent: #16304f;           /* navy = the trust accent */
  --accent-hover: #1f4374;
  --accent-press: #0f223d;
  --accent-tint: #eef2f8;      /* navy wash for chips/hover fields */

  --link: #16304f;
  --link-hover: #1f4374;

  --status-live: #0d9488;      /* the one functional teal — "24/7 active" */
  --focus-ring: #1f4374;

  color: var(--text-primary);
}

/* Subtle neutral light panel (alternate background). */
.theme-alt{
  --bg-page: var(--slate-50);
  --bg-deep: var(--slate-100);
  --surface-card: var(--white);
  --surface-sunken: var(--slate-100);
  --border-subtle: var(--slate-200);
  --border-strong: var(--slate-300);
  --text-primary: var(--navy-700);
  --text-secondary: var(--slate-500);
  --text-muted: var(--slate-400);
  color: var(--text-primary);
}


/* ===== typography.css ===== */
/* LTRA — Typography tokens
   Display & UI: Manrope. Code/data/technical labels: Roboto Mono.
   Voice: tight, geometric, confident. Big bold headings (700/800, negative
   tracking), light bodies (300/400), uppercase micro-labels with wide tracking. */

:root{
  /* Families */
  --font-sans: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'Roboto Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --font-display: var(--font-sans);

  /* Weights (Manrope ships 300–800) */
  --fw-light: 300;      /* @kind font */
  --fw-regular: 400;    /* @kind font */
  --fw-medium: 500;     /* @kind font */
  --fw-semibold: 600;   /* @kind font */
  --fw-bold: 700;       /* @kind font */
  --fw-extrabold: 800;  /* @kind font */

  /* Type scale — fluid where it matters, fixed where it shouldn't move.
     Display sizes use clamp() so heroes scale on mobile. */
  --fs-display: clamp(2.5rem, 6vw, 4.5rem);   /* @kind font */
  --fs-h1: clamp(1.75rem, 4.5vw, 3.5rem);     /* @kind font */
  --fs-h2: clamp(1.75rem, 4vw, 2.75rem);      /* @kind font */
  --fs-h3: 1.5rem;                            /* @kind font */
  --fs-h4: 1.125rem;                          /* @kind font */
  --fs-lead: clamp(1rem, 1.8vw, 1.25rem);     /* @kind font */
  --fs-body: 1rem;                            /* @kind font */
  --fs-body-sm: 0.9375rem;                    /* @kind font */
  --fs-sm: 0.875rem;                          /* @kind font */
  --fs-xs: 0.8125rem;                         /* @kind font */
  --fs-2xs: 0.75rem;                          /* @kind font */
  --fs-micro: 0.6875rem;                      /* @kind font */

  /* Line heights */
  --lh-tight: 1.1;     /* @kind font */
  --lh-snug: 1.15;     /* @kind font */
  --lh-heading: 1.3;   /* @kind font */
  --lh-body: 1.6;      /* @kind font */
  --lh-relaxed: 1.75;  /* @kind font */

  /* Letter spacing */
  --ls-tighter: -0.03em;  /* @kind font */
  --ls-tight: -0.02em;    /* @kind font */
  --ls-snug: -0.01em;     /* @kind font */
  --ls-normal: 0;         /* @kind font */
  --ls-wide: 0.08em;       /* @kind font */
  --ls-wider: 0.15em;      /* @kind font */
  --ls-widest: 0.2em;      /* @kind font */

  /* Semantic roles */
  --text-eyebrow-size: var(--fs-2xs);          /* @kind font */
  --text-eyebrow-spacing: var(--ls-wider);     /* @kind font */
}


/* ===== spacing.css ===== */
/* LTRA — Spacing, sizing & layout tokens
   8px base grid. Generous whitespace is a brand value — sections breathe with
   full-viewport vertical rhythm. Thin geometric lines; small, deliberate radii. */

:root{
  /* Spacing scale (8px base; a couple of 4px half-steps) */
  --space-0: 0;
  --space-1: 0.25rem;   /* 4 */
  --space-2: 0.5rem;    /* 8 */
  --space-3: 0.75rem;   /* 12 */
  --space-4: 1rem;      /* 16 */
  --space-5: 1.25rem;   /* 20 */
  --space-6: 1.5rem;    /* 24 */
  --space-8: 2rem;      /* 32 */
  --space-10: 2.5rem;   /* 40 */
  --space-12: 3rem;     /* 48 */
  --space-14: 3.5rem;   /* 56 */
  --space-16: 4rem;     /* 64 */
  --space-20: 5rem;     /* 80 */
  --space-24: 6rem;     /* 96 */
  --space-32: 8rem;     /* 128 */

  /* Section rhythm — sections are full-viewport panels that breathe */
  --section-py: clamp(5rem, 10vw, 8rem);     /* @kind spacing */
  --container-px: clamp(1.5rem, 5vw, 4rem);  /* @kind spacing */
  --container-max: 1100px;
  --container-narrow: 800px;
  --measure: 540px;        /* readable paragraph width */
  --nav-h: 72px;

  /* Radii — small and deliberate. The brand reads as structured, not soft.
     Pills are reserved for buttons/CTA only. */
  --radius-xs: 1px;
  --radius-sm: 2px;     /* cards, case panels — nearly square */
  --radius-md: 3px;     /* logo square, inputs */
  --radius-lg: 8px;     /* boxes, callouts */
  --radius-xl: 16px;    /* large feature panels */
  --radius-pill: 9999px;

  /* Border widths */
  --bw-hairline: 1px;
  --bw-thin: 1.5px;
  --bw-accent: 2px;
  --bw-bar: 3px;        /* navy top-bar on signatures, accent bars */

  /* Icon sizing — stroke icons, 1.5 stroke weight */
  --icon-sm: 16px;
  --icon-md: 24px;
  --icon-lg: 48px;      /* service teaser icon */
  --icon-stroke: 1.5;  /* @kind other */
}


/* ===== effects.css ===== */
/* LTRA — Effects: shadows, gradients, glows, motion
   The aesthetic is technical-but-clean. Shadows are subtle (or absent) — depth
   comes from hairline borders and surface contrast, not heavy drop shadows.
   The one signature flourish is a soft teal glow on accent elements. */

:root{
  /* Shadows — restrained. On dark, prefer borders + glow over shadow. */
  --shadow-none: none;
  --shadow-card: 0 1px 2px rgba(10, 15, 26, 0.06);
  --shadow-raised: 0 4px 20px rgba(10, 15, 26, 0.08);   /* light-mode cards */
  --shadow-pop: 0 10px 40px rgba(10, 15, 26, 0.12);     /* business card / modal */

  /* Teal accent shadows & glows (the brand's only "lighting") */
  --shadow-teal: 0 4px 24px rgba(13, 148, 136, 0.25);
  --shadow-teal-strong: 0 6px 32px rgba(13, 148, 136, 0.40);
  --glow-teal: 0 0 40px rgba(13, 148, 136, 0.15);
  --glow-teal-soft: 0 0 0 8px rgba(13, 148, 136, 0);    /* pulse end-state */

  /* Gradients — only two, both brand-anchored. No neon/AI gradients. */
  --gradient-brand: linear-gradient(135deg, #0f172a 0%, #1a365d 50%, #0d9488 100%);  /* @kind color */
  --gradient-navy: linear-gradient(135deg, #0f172a 0%, #1a365d 100%);  /* @kind color */
  --gradient-text: linear-gradient(135deg, #1a365d 0%, #0d9488 100%); /* clip-text on heroes @kind color */
  /* Radial ambient washes used behind heroes (very low opacity) */
  --wash-teal: radial-gradient(circle, rgba(13,148,136,.06) 0%, transparent 65%);  /* @kind color */
  --wash-navy: radial-gradient(circle, rgba(26,54,93,.15) 0%, transparent 70%);  /* @kind color */

  /* Backdrop blur (scrolled nav, overlays) */
  --blur-nav: blur(20px);  /* @kind other */

  /* Motion — calm, confident. Ease, never bounce on UI. Fades + short rises. */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);  /* @kind other */
  --ease-standard: ease;  /* @kind other */
  --dur-fast: 0.2s;  /* @kind other */
  --dur-base: 0.25s;  /* @kind other */
  --dur-slow: 0.35s;  /* @kind other */
  --dur-reveal: 0.8s;     /* @kind other */
  --reveal-rise: 40px;    /* @kind spacing */

  /* Focus ring */
  --ring: 0 0 0 3px rgba(20, 184, 166, 0.45);
}


/* ===== base.css ===== */
/* LTRA — Base layer: keyframes & a few shared utilities the components rely on.
   Kept minimal; this is not a utility framework. */

/* Teal pulse on the logo accent dot — the brand's signature "alive" detail */
@keyframes ltra-pulse-teal{
  0%,100%{ box-shadow: 0 0 0 0 rgba(13,148,136,.4); }
  50%    { box-shadow: 0 0 0 8px rgba(13,148,136,0); }
}

/* Scroll-reveal rise+fade */
@keyframes ltra-rise{
  from{ opacity:0; transform: translateY(20px); }
  to  { opacity:1; transform: translateY(0); }
}

/* Reveal utility (JS toggles .is-visible) */
.ltra-reveal{
  opacity:0;
  transform: translateY(var(--reveal-rise));
  transition: opacity var(--dur-reveal) var(--ease-out),
              transform var(--dur-reveal) var(--ease-out);
}
.ltra-reveal.is-visible{ opacity:1; transform:none; }

/* Mono technical label */
.ltra-mono{
  font-family: var(--font-mono);
  font-size: var(--fs-2xs);
  letter-spacing: 0.02em;
}

/* Eyebrow / kicker */
.ltra-eyebrow{
  font-size: var(--fs-2xs);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  color: var(--text-accent);
}

@media (prefers-reduced-motion: reduce){
  .ltra-reveal{ transition:none; opacity:1; transform:none; }
  *{ animation: none !important; }
}