/* ==========================================================================
   KGS Web UI Kit — LIGHT · v1.3 draft (DS 2b + stone-2; page base pure white #FFFFFF) · 2026-10-25 (local, not deployed)
   NAMESPACED (CMO, 25 Oct): every component/utility class is prefixed kgs- (.kgs-btn, .kgs-card, .kgs-chip …)
   so the file drops into proto_v7b without collisions. CSS custom properties (--kl-*, --kd-*, --fs-* …) are unchanged.
   This file has NO bare element selectors. Global element resets (html, body, a, h1–h4, p, *) are in
   kgs-light.base.css: optional, only for standalone pages such as kit.html.
   Class map old → new: README.md
   One family: Archivo (variable, wdth 62–125, wght 400–800).
   Light base everywhere; dark only for the data band (+ optional CTA, footer).
   Source tokens: brand/05_design-tokens/kgs-tokens.css v2.1 · DESIGN_SYSTEM_navrh.md §2b (light, 25. 10. 2026) · v1.1
   ========================================================================== */

@font-face{font-family:"Archivo";src:url("assets/fonts/Archivo-latin-b92029.woff2") format("woff2");
  font-weight:400 800;font-stretch:62% 125%;font-display:swap;
  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:"Archivo";src:url("assets/fonts/Archivo-latin-ext-c422bf.woff2") format("woff2");
  font-weight:400 800;font-stretch:62% 125%;font-display:swap;
  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}

:root{
  /* ---- surfaces (light) · DESIGN_SYSTEM 2b ---- */
  --kl-white:#FFFFFF;          /* surface-1: cards, map, HUD, inputs, chips */
  --kl-paper:#FFFFFF;          /* base: page, hero = PURE WHITE (Dominik, 25 Oct 12:38; like kubicasupply.com). 2b #FAF7F2 retired */
  --kl-sand:#F1EBE2;           /* surface-2: subtle separation only (alternate band, hover) (2b --sand) */
  --kl-stone:#ECE5DA;          /* surface-3: inset, pressed, disabled, iso platform tops (2b --stone) */
  --kl-stone-2:#E7E2DB;        /* 2b stone-2 (CMO, 25 Oct): illustration backdrop = iso platform floor. Art only, never a text surface */
  --kl-art-1:var(--kl-stone-2); --kl-art-2:var(--kl-stone-2);   /* illustration tile bed in cards = backdrop B #E7E2DB (Dominik). Was cream gradient #F7F2EB→#EFE8DE, retired 25 Oct 12:38 */
  --kl-cream:#F1EBE2;          /* DEPRECATED alias (v1.0 cream #F2EDE4) → use --kl-sand */

  /* ---- ink (text) · 2b ---- */
  --kl-ink:#110E0D;            /* headings, active chip, focus ring, text on ember */
  --kl-ink2:#2A2320;           /* body text                                 */
  --kl-ink3:#5E554F;           /* lead, descriptions, secondary text        */
  --kl-mute:#6B625C;           /* counts, metadata, captions, map labels    */
  --kl-ink-2:#5E554F;          /* v1.0 alias → --kl-ink3                    */
  --kl-ink-3:#6B625C;          /* v1.0 alias → --kl-mute                    */
  --kl-ink-4:#6B625C;          /* v1.0 #8A817B retired (3.57:1) → --kl-mute; disabled = mute on stone */

  /* ---- ember accent · 2b ---- */
  --kl-ember:#D7602D;          /* fills, button bg (INK text), route, bullets, corner marks; text only ≥24px / ≥18.7px bold */
  --kl-ember-hover:#E9773F;    /* 2b --e4 · primary hover                   */
  --kl-et:#A9441A;             /* 2b --et ember-text: overline, links, chip numbers, "Na dopyt", sea labels (all small ember text) */
  --kl-ember-700:#A9441A;      /* v1.0 alias (#AB4A21) → --kl-et            */
  --kl-ember-800:#8F3D1B;      /* text on ember tint                        */
  --kl-ember-100:#FBEDE4;      /* 2b mode-active tint (v1.0 #F9E8E1)        */

  /* ---- lines · 2b ---- */
  --kl-hl:rgba(17,14,13,.09);  /* 2b --hl: hairlines, card frames (decor)   */
  --kl-hl2:rgba(17,14,13,.16); /* 2b --hl2: stronger divider, hairline on sand */
  --kl-line:var(--kl-hl); --kl-line-cream:var(--kl-hl2);
  --kl-bd:#8C837C;             /* 2b --bd: control outlines ≥3:1            */
  --kl-line-ctl:#8C837C;       /* alias → --kl-bd                           */
  --kl-rule:#110E0D;           /* 2px structural rule                       */

  /* ---- states (no green / blue: DS §2) — always dot/shape + word ---- */
  --kl-st-done:#110E0D;        /* done / delivered / "Dodávame": ink, filled */
  --kl-st-active:#D7602D;      /* in progress / in transit: ember (shape), label in --kl-et */
  --kl-st-wait:#5E554F;        /* planned / waiting / on request: ink3, hollow */
  --kl-st-alert:#A9441A;       /* delayed / attention: ember-text + "!" mark */
  --kl-error:#B92727;          /* FORM ERRORS ONLY (CMO, 25 Oct): always icon + text, never colour alone; not for status/alerts/brand */

  /* ---- dark exceptions · 2b ---- */
  --kd-bg:#110E0D; --kd-bg-2:#171311; --kd-panel:#211B18;
  --kd-fg:#FFFFFF;             /* numbers, headings 19.2:1                  */
  --kd-fg-2:#DCD6CD;           /* CTA text, labels 13.3:1                   */
  --kd-fg-3:#A39A93;           /* captions, footer, overline 7.0:1          */
  --kd-accent:#E9773F;         /* units, chip numbers on ink                */
  --kd-line:rgba(244,239,232,.10);

  /* ---- type ---- */
  --kl-font:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  /* fluid scale: min @390px → max @1440px */
  --fs-hero:clamp(2.75rem,1.543rem + 4.952vw,6rem);       /* 44→96 */
  --fs-display:clamp(2.5rem,2.129rem + 1.524vw,3.5rem);    /* 40→56 */
  --fs-stat:clamp(2.5rem,1.943rem + 2.286vw,4rem);         /* 40→64 */
  --fs-h1:clamp(2rem,1.814rem + .762vw,2.5rem);            /* 32→40 */
  --fs-h2:clamp(1.625rem,1.532rem + .381vw,1.875rem);      /* 26→30 */
  --fs-h3:clamp(1.25rem,1.204rem + .19vw,1.375rem);        /* 20→22 */
  --fs-h4:1.125rem;                                        /* 18    */
  --fs-lead:clamp(1.0625rem,1.016rem + .19vw,1.1875rem);   /* 17→19 */
  --fs-body:1rem; --fs-small:.875rem; --fs-caption:.75rem; --fs-overline:.6875rem;
  --lh-tight:.95; --lh-head:1.12; --lh-body:1.55;
  --wd-display:112%; --wd-text:100%; --wd-label:112%; --wd-index:125%;

  /* ---- shape / space / motion ---- */
  --r-1:2px; --r-2:4px;
  --ctl-sm:32px; --ctl-md:40px; --ctl-lg:48px;
  --hdr-h:72px; --container:1280px; --gutter:24px;
  --sec-y:clamp(4rem,3.07rem + 3.81vw,6rem);
  --ease:cubic-bezier(.2,0,0,1); --t-fast:120ms; --t:200ms;
  --focus:2px solid var(--kl-ink); --focus-dark:2px solid var(--kd-fg);
  /* elevation (light): 0 flat hairline · 1 resting card · 2 hover card (2b) · 3 floating HUD/tooltip */
  --sh-0:none;
  --sh-1:0 1px 0 rgba(17,14,13,.04);
  --sh-2:0 22px 40px -28px rgba(17,14,13,.35);
  --sh-3:0 1px 2px rgba(17,14,13,.06),0 12px 28px -12px rgba(17,14,13,.22);
  --shadow-float:var(--sh-3);
}
@media (max-width:767px){:root{--hdr-h:60px;--gutter:20px}}

/* ---- layout helpers (element resets live in kgs-light.base.css) ---- */
[class*="kgs-"],[class*="kgs-"]::before,[class*="kgs-"]::after{box-sizing:border-box} /* scoped stand-in for the global reset */
.kgs-container{max-width:calc(var(--container) + 2*var(--gutter));margin-inline:auto;padding-inline:var(--gutter)}
.kgs-section{padding-block:var(--sec-y)}
.kgs-section--white{background:var(--kl-white)} .kgs-section--cream{background:var(--kl-sand)}
.kgs-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---- type roles ---- */
.kgs-t-hero{font-size:var(--fs-hero);line-height:var(--lh-tight);font-weight:800;font-stretch:var(--wd-display);text-transform:uppercase;letter-spacing:-.03em;margin:0}
.kgs-t-display{font-size:var(--fs-display);line-height:1;font-weight:800;font-stretch:var(--wd-display);text-transform:uppercase;letter-spacing:-.02em;margin:0}
.kgs-t-h1{font-size:var(--fs-h1);line-height:var(--lh-head);font-weight:700;letter-spacing:-.02em;margin:0}
.kgs-t-h2{font-size:var(--fs-h2);line-height:1.15;font-weight:700;letter-spacing:-.015em;margin:0}
.kgs-t-h3{font-size:var(--fs-h3);line-height:1.25;font-weight:650;letter-spacing:-.01em;margin:0}
.kgs-t-h4{font-size:var(--fs-h4);line-height:1.3;font-weight:600;margin:0}
.kgs-t-lead{font-size:var(--fs-lead);line-height:1.5;color:var(--kl-ink-2);margin:0}
.kgs-t-body{font-size:var(--fs-body)} .kgs-t-small{font-size:var(--fs-small);line-height:1.5}
.kgs-t-caption{font-size:var(--fs-caption);font-weight:600;font-stretch:var(--wd-label);color:var(--kl-ink-3);letter-spacing:.02em}
.kgs-t-overline{font-size:var(--fs-overline);font-weight:600;font-stretch:var(--wd-label);text-transform:uppercase;letter-spacing:.16em;font-variant-numeric:tabular-nums;color:var(--kl-ink-2)}
.kgs-t-index{font-size:var(--fs-caption);font-weight:600;font-stretch:var(--wd-index);letter-spacing:.06em;font-variant-numeric:tabular-nums lining-nums;color:var(--kl-et)}
.kgs-t-num{font-variant-numeric:tabular-nums lining-nums;font-stretch:var(--wd-display)}

/* ---- buttons ---- */
.kgs-btn{--h:var(--ctl-md);display:inline-flex;align-items:center;justify-content:center;gap:.5em;height:var(--h);padding:0 1.15em;
  border:1.5px solid transparent;border-radius:var(--r-1);font:600 var(--fs-small)/1 var(--kl-font);font-stretch:var(--wd-label);
  letter-spacing:.04em;text-transform:uppercase;text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:background-color var(--t-fast) var(--ease),color var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease),transform var(--t-fast) var(--ease)}
.kgs-btn--sm{--h:var(--ctl-sm);font-size:var(--fs-caption);padding:0 .9em} .kgs-btn--lg{--h:var(--ctl-lg);font-size:.9375rem;padding:0 1.5em}
.kgs-btn .kgs-arr{transition:transform var(--t) var(--ease)} .kgs-btn:hover .kgs-arr,.kgs-btn.kgs-is-hover .kgs-arr{transform:translateX(3px)}
.kgs-btn--primary{background:var(--kl-ember);border-color:var(--kl-ember);color:var(--kl-ink)}
.kgs-btn--primary:hover,.kgs-btn--primary.kgs-is-hover{background:var(--kl-ember-hover);border-color:var(--kl-ember-hover);color:var(--kl-ink)}
.kgs-btn--primary:active,.kgs-btn--primary.kgs-is-active{background:var(--kl-ember);border-color:var(--kl-ember-800);box-shadow:inset 0 2px 0 rgba(17,14,13,.28);transform:translateY(1px)}
.kgs-btn--secondary{background:transparent;border-color:var(--kl-ink);color:var(--kl-ink)}
.kgs-btn--secondary:hover,.kgs-btn--secondary.kgs-is-hover{background:var(--kl-ink);color:var(--kl-white)}
.kgs-btn--secondary:active,.kgs-btn--secondary.kgs-is-active{background:var(--kl-ink2);border-color:var(--kl-ink2);color:var(--kl-white);transform:translateY(1px)}
.kgs-btn--ghost{background:transparent;border-color:var(--kl-bd);color:var(--kl-ink);padding-inline:.95em}
.kgs-btn--ghost:hover,.kgs-btn--ghost.kgs-is-hover{background:var(--kl-stone);border-color:var(--kl-ink);color:var(--kl-ink)}
.kgs-btn--ghost:active,.kgs-btn--ghost.kgs-is-active{background:#E3DACC;border-color:var(--kl-ink);transform:translateY(1px)}
.kgs-btn--link{height:auto;padding:0;border:0;background:none;color:var(--kl-et);text-transform:none;letter-spacing:0;font-size:var(--fs-body);font-stretch:100%;
  text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.kgs-btn--link:hover,.kgs-btn--link.kgs-is-hover{color:var(--kl-ink);text-decoration-thickness:2px}
.kgs-btn--link:active,.kgs-btn--link.kgs-is-active{color:var(--kl-ink);text-decoration-thickness:3px}
.kgs-btn:focus-visible,.kgs-btn.kgs-is-focus{outline:var(--focus);outline-offset:2px;box-shadow:0 0 0 2px var(--kl-white)}
.kgs-btn:disabled,.kgs-btn.kgs-is-disabled,.kgs-btn[aria-disabled=true]{background:var(--kl-stone);border-color:var(--kl-stone);color:var(--kl-ink-4);cursor:not-allowed;transform:none}
.kgs-btn--link:disabled,.kgs-btn--link.kgs-is-disabled{background:none;border:0;color:var(--kl-mute);text-decoration:none}
.kgs-btn--ghost:disabled,.kgs-btn--ghost.kgs-is-disabled{background:none;border-color:var(--kl-stone)}
/* on dark band */
.kgs-on-dark .kgs-btn--secondary{border-color:var(--kd-fg);color:var(--kd-fg)}
.kgs-on-dark .kgs-btn--secondary:hover,.kgs-on-dark .kgs-btn--secondary.kgs-is-hover{background:var(--kd-fg);color:var(--kd-bg)}
.kgs-on-dark .kgs-btn--ghost{color:var(--kd-fg);border-color:rgba(255,255,255,.4)} .kgs-on-dark .kgs-btn--ghost:hover{background:var(--kd-panel);border-color:var(--kd-fg)}
.kgs-on-dark .kgs-btn--link{color:var(--kd-accent)} .kgs-on-dark .kgs-btn--link:hover{color:var(--kd-fg)}
.kgs-on-dark .kgs-btn:focus-visible,.kgs-on-dark .kgs-btn.kgs-is-focus,.kgs-on-dark :focus-visible{outline:var(--focus-dark);box-shadow:0 0 0 2px var(--kd-bg)}

/* ---- tags / chips / status ---- */
.kgs-tag{display:inline-flex;align-items:center;gap:.45em;height:24px;padding:0 .6em;border-radius:var(--r-1);font:600 var(--fs-overline)/1 var(--kl-font);
  font-stretch:var(--wd-label);letter-spacing:.12em;text-transform:uppercase;background:var(--kl-sand);color:var(--kl-ink-2);white-space:nowrap}
.kgs-section--cream .kgs-tag,.kgs-tag--white{background:var(--kl-white)}
.kgs-tag--ember{background:var(--kl-ember-100);color:var(--kl-ember-800)}
.kgs-tag--deliver{background:var(--kl-ember);color:var(--kl-ink)}                              /* 2b "Dodávame": ink on ember */
.kgs-tag--request{background:var(--kl-white);color:var(--kl-et);box-shadow:inset 0 0 0 1px var(--kl-et)} /* 2b "Na dopyt": #A9441A */
.kgs-tag--check{background:var(--kl-white);color:var(--kl-ink3);box-shadow:inset 0 0 0 1px var(--kl-hl2)}  /* 2b "Preveríme": ink3 */
a.kgs-tag,button.kgs-tag{border:0;cursor:pointer;text-decoration:none;box-shadow:inset 0 0 0 1px var(--kl-bd);background:var(--kl-white);color:var(--kl-ink);transition:all var(--t-fast) var(--ease)}
a.kgs-tag:hover,button.kgs-tag:hover,.kgs-tag.kgs-is-hover{box-shadow:inset 0 0 0 1px var(--kl-ink);background:var(--kl-stone)}
a.kgs-tag:active,button.kgs-tag:active,.kgs-tag.kgs-is-active{background:var(--kl-ink);color:var(--kl-white);box-shadow:none}
a.kgs-tag:focus-visible,button.kgs-tag:focus-visible,.kgs-tag.kgs-is-focus{outline:var(--focus);outline-offset:2px}
button.kgs-tag:disabled,.kgs-tag.kgs-is-disabled{background:var(--kl-stone);color:var(--kl-mute);box-shadow:none;cursor:not-allowed}
.kgs-tag .kgs-x{font-size:12px;line-height:1;margin-right:-2px}
.kgs-tag--outline{background:transparent;border:1px solid var(--kl-line-ctl);color:var(--kl-ink)}
.kgs-tag--ink{background:var(--kl-ink);color:var(--kd-fg)}
.kgs-tag--sq::before{content:"";width:6px;height:6px;background:var(--kl-ember)}
.kgs-status{display:inline-flex;align-items:center;gap:.5em;font:600 var(--fs-caption)/1 var(--kl-font);font-stretch:var(--wd-label);color:var(--kl-ink)}
.kgs-status::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;flex:none}
.kgs-status--done,.kgs-status--ok{color:var(--kl-ink)}
.kgs-status--active,.kgs-status--info{color:var(--kl-ink)} .kgs-status--active::before,.kgs-status--info::before{background:var(--kl-st-active);box-shadow:0 0 0 3px rgba(215,96,45,.22)}
.kgs-status--wait,.kgs-status--warn{color:var(--kl-st-wait)} .kgs-status--wait::before,.kgs-status--warn::before{background:transparent;border:1.5px solid currentColor;width:7px;height:7px}
.kgs-status--alert{color:var(--kl-st-alert)} .kgs-status--alert::before{border-radius:0;transform:rotate(45deg);width:7px;height:7px}
.kgs-status--err{color:var(--kl-error)} /* form validation only */
.kgs-chip{display:inline-flex;align-items:center;gap:.5em;height:var(--ctl-sm);padding:0 .85em;border:1px solid var(--kl-line-ctl);border-radius:var(--r-1);
  background:var(--kl-white);color:var(--kl-ink);font:500 var(--fs-small)/1 var(--kl-font);cursor:pointer;transition:all var(--t-fast) var(--ease)}
.kgs-chip .kgs-n{font-weight:600;font-stretch:var(--wd-index);font-size:var(--fs-caption);color:var(--kl-et);font-variant-numeric:tabular-nums}
.kgs-chip:hover,.kgs-chip.kgs-is-hover{border-color:var(--kl-ink);background:var(--kl-sand)}
.kgs-chip:active,.kgs-chip.kgs-is-active{background:var(--kl-stone);border-color:var(--kl-ink);transform:translateY(1px)}
.kgs-chip:focus-visible,.kgs-chip.kgs-is-focus{outline:var(--focus);outline-offset:2px}
.kgs-chip[aria-pressed=true],.kgs-chip.kgs-is-on{background:var(--kl-ink);border-color:var(--kl-ink);color:#FFFFFF} .kgs-chip.kgs-is-on .kgs-n,.kgs-chip[aria-pressed=true] .kgs-n{color:var(--kd-accent)}
.kgs-chip:disabled,.kgs-chip.kgs-is-disabled{background:var(--kl-stone);border-color:var(--kl-stone);color:var(--kl-mute);cursor:not-allowed}
.kgs-chip:disabled .kgs-n,.kgs-chip.kgs-is-disabled .kgs-n{color:var(--kl-mute)}
/* mode chip (transport mode) — 2b: active #FBEDE4 + ember border */
.kgs-chip--mode .kgs-ico{width:16px;height:16px;flex:none}
.kgs-chip--mode[aria-pressed=true],.kgs-chip--mode.kgs-is-on{background:var(--kl-ember-100);border-color:var(--kl-ember);border-width:1.5px;color:var(--kl-ink)}
.kgs-chip--mode.kgs-is-on .kgs-n,.kgs-chip--mode[aria-pressed=true] .kgs-n{color:var(--kl-et)}

/* ---- section header (§ index) ---- */
.kgs-sh{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 48px;align-items:end;border-top:2px solid var(--kl-rule);padding-top:16px;margin-bottom:clamp(32px,4vw,56px)}
.kgs-sh__meta{grid-column:1/-1;display:flex;gap:16px;align-items:baseline;justify-content:space-between}
.kgs-sh__idx{font:600 var(--fs-caption)/1 var(--kl-font);font-stretch:var(--wd-index);letter-spacing:.06em;color:var(--kl-et);font-variant-numeric:tabular-nums}
.kgs-sh__title{text-wrap:balance;font-size:var(--fs-display);line-height:1;font-weight:800;font-stretch:var(--wd-display);text-transform:uppercase;letter-spacing:-.02em}
.kgs-sh__lead{color:var(--kl-ink-2);font-size:var(--fs-lead);max-width:46ch}
.kgs-sh--compact .kgs-sh__title{text-wrap:balance;font-size:var(--fs-h1);text-transform:none;font-stretch:100%;font-weight:700;letter-spacing:-.02em;line-height:1.1}
@media (max-width:767px){.kgs-sh{grid-template-columns:1fr}}

/* ---- cards ---- */
.kgs-card{position:relative;background:var(--kl-white);border:1px solid var(--kl-hl);border-radius:var(--r-1);box-shadow:var(--sh-1);transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease),transform var(--t) var(--ease)}
.kgs-section--cream .kgs-card{border-color:var(--kl-line-cream)}
a.kgs-card,.kgs-card--link{color:inherit;text-decoration:none}
a.kgs-card:hover,.kgs-card--link:hover,.kgs-card.kgs-is-hover{border-color:var(--kl-hl2);box-shadow:var(--sh-2);transform:translateY(-2px)}
a.kgs-card:active,.kgs-card.kgs-is-active{box-shadow:var(--sh-1);transform:none;border-color:var(--kl-ink)}
.kgs-card--flat{box-shadow:var(--sh-0)} .kgs-card--float{box-shadow:var(--sh-3);border-color:var(--kl-hl2)}
a.kgs-card:focus-visible,.kgs-card.kgs-is-focus{outline:var(--focus);outline-offset:2px}
/* service card */
.kgs-svc{display:flex;flex-direction:column}
.kgs-svc__ill{aspect-ratio:12/7;background:linear-gradient(180deg,var(--kl-art-1),var(--kl-art-2));border-bottom:1px solid var(--kl-line);overflow:hidden;display:grid;place-items:center}
.kgs-svc__ill img{width:100%;height:100%;object-fit:contain}
.kgs-svc__body{padding:20px 24px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.kgs-svc__top{display:flex;justify-content:space-between;align-items:baseline}
.kgs-svc__list{margin:4px 0 0;padding:0;list-style:none;font-size:var(--fs-small);color:var(--kl-ink-2)}
.kgs-svc__list li{padding:7px 0 7px 18px;border-top:1px solid var(--kl-line);position:relative}
.kgs-svc__list li::before{content:"";position:absolute;left:0;top:14px;width:8px;height:2px;background:var(--kl-ember)}
.kgs-svc__foot{margin-top:auto;padding-top:8px}
/* stat card */
.kgs-stat{padding:20px 24px 24px;border-top:2px solid var(--kl-ember)}
.kgs-stat__n{display:block;font-size:var(--fs-stat);line-height:1;font-weight:800;font-stretch:var(--wd-display);letter-spacing:-.02em;font-variant-numeric:tabular-nums lining-nums;text-transform:uppercase}
.kgs-stat__n small{display:block;font-size:var(--fs-h4);font-weight:700;letter-spacing:.02em;margin-top:8px;color:var(--kl-et)}
.kgs-stat__l{display:block;margin-top:12px;color:var(--kl-ink-2);font-size:var(--fs-small)}
/* category card */
.kgs-cat{display:grid;grid-template-rows:auto 1fr;padding:0}
.kgs-cat__ill{display:grid;place-items:center;padding:16px 16px 0}
.kgs-cat__ill img{width:112px;height:112px}
.kgs-cat__body{padding:8px 16px 16px;display:flex;flex-direction:column;gap:6px}
.kgs-cat__t{font-weight:650;font-size:var(--fs-body);line-height:1.25}
.kgs-cat__row{display:flex;justify-content:space-between;align-items:center;margin-top:auto}
.kgs-cat .kgs-go{font-weight:600;color:var(--kl-ink-3);transition:transform var(--t) var(--ease),color var(--t)}
a.kgs-cat:hover .kgs-go{transform:translateX(3px);color:var(--kl-et)}

/* ---- HUD panel (light) ---- */
.kgs-hud{--c:var(--kl-ember);position:relative;background:var(--kl-white);border:1px solid var(--kl-hl2);border-radius:var(--r-1);padding:14px 16px 16px;min-width:220px;
  font-size:var(--fs-small)}
.kgs-hud::before,.kgs-hud::after{content:"";position:absolute;width:10px;height:10px;border:2px solid var(--c)}
.kgs-hud::before{top:-2px;left:-2px;border-right:0;border-bottom:0} .kgs-hud::after{bottom:-2px;right:-2px;border-left:0;border-top:0}
.kgs-hud--float{box-shadow:var(--shadow-float)}
.kgs-hud__h{display:flex;align-items:center;gap:8px;padding-bottom:10px;margin-bottom:6px;border-bottom:1px solid var(--kl-line)}
.kgs-hud__h::before{content:"";width:8px;height:8px;background:var(--c);flex:none}
.kgs-hud__h .kgs-t-overline{color:var(--kl-ink)}
.kgs-hud__row{display:flex;justify-content:space-between;gap:16px;padding:5px 0;color:var(--kl-ink-2)}
.kgs-hud__row b{color:var(--kl-ink);font-weight:600;font-variant-numeric:tabular-nums;font-stretch:var(--wd-label)}
.kgs-hud__row .kgs-status--ok,.kgs-hud__row .kgs-status--done,.kgs-hud__row .kgs-status--info,.kgs-hud__row .kgs-status--active{color:var(--kl-ink)} .kgs-hud__row .kgs-status--warn,.kgs-hud__row .kgs-status--wait{color:var(--kl-st-wait)} .kgs-hud__row .kgs-status--alert{color:var(--kl-st-alert)}
.kgs-hud__bar{height:4px;background:var(--kl-stone);margin-top:10px;position:relative}
.kgs-hud__bar i{position:absolute;inset:0 auto 0 0;background:var(--c)}
.kgs-hud__ex{margin-top:10px;font-size:var(--fs-caption);color:var(--kl-ink-3)}
.kgs-leader{position:absolute;border-top:1px dashed var(--kl-ember);height:0}
.kgs-pin{position:absolute;width:10px;height:10px;border-radius:50%;border:1.5px solid var(--kl-ember);background:var(--kl-white);transform:translate(-50%,-50%)}
.kgs-pin::after{content:"";position:absolute;inset:2px;border-radius:50%;background:var(--kl-ember)}

/* ---- route map (light) ---- */
.kgs-map{position:relative;background:var(--kl-white);border:1px solid var(--kl-line);border-radius:var(--r-1);overflow:hidden}
.kgs-map svg{width:100%;height:auto;display:block}
@media (max-width:767px){.kgs-map__scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}.kgs-map__scroll svg{width:820px;max-width:none}.kgs-band-dark .kgs-band-dark__n em{font-size:var(--fs-h4);letter-spacing:.01em}.kgs-band-dark .kgs-band-hd{gap:16px}.kgs-band-hd>:last-child{white-space:nowrap}.kgs-band-dark .kgs-band-dark__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.kgs-band-dark .kgs-band-dark__n.kgs-is-word{font-size:calc(var(--fs-stat)*.6)}}
.kgs-map__bar{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:center;justify-content:space-between;padding:12px 16px;border-top:1px solid var(--kl-line);background:var(--kl-white)}
.kgs-legend{display:flex;flex-wrap:wrap;gap:6px 20px;margin:0;padding:0;list-style:none;font:600 var(--fs-caption)/1 var(--kl-font);font-stretch:var(--wd-label);color:var(--kl-ink)}
.kgs-legend li{display:flex;align-items:center;gap:8px}
.kgs-legend svg{width:28px;height:8px}
.kgs-map .kgs-hud{position:absolute}
/* ROUTE-MAP:BEGIN */
.kgs-rm-grat{fill:none;stroke:#110E0D;stroke-opacity:.07;stroke-width:1}
.kgs-rm-dots{fill:none;stroke:#7A716A;stroke-opacity:.4;stroke-width:3.1;stroke-linecap:round}
.kgs-rm-r path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.kgs-rm-off path{stroke:#110E0D;stroke-opacity:.10;stroke-width:2.4}
.kgs-rm-transit .kgs-rm-done{stroke:#D7602D;stroke-width:3}
.kgs-rm-transit .kgs-rm-rest{stroke:#D7602D;stroke-width:2.4;stroke-dasharray:.1 7}
.kgs-rm-planned path{stroke:#5E554F;stroke-width:2;stroke-dasharray:7 6;stroke-linecap:butt}
.kgs-rm-delivered path{stroke:#110E0D;stroke-width:2.6}
.kgs-rm-delayed path{stroke:#A9441A;stroke-width:2.8;stroke-dasharray:12 4 2 4;stroke-linecap:butt}
.kgs-rm-n1{fill:#110E0D;stroke:#FFFFFF;stroke-width:2}
.kgs-rm-n2{fill:#FFFFFF;stroke:#4A423E;stroke-width:1.6}
.kgs-rm-l1,.kgs-rm-l2,.kgs-rm-sea-l{font-family:Archivo,sans-serif;font-weight:600;font-stretch:112%;paint-order:stroke;stroke:#FFFFFF;stroke-width:4px;stroke-linejoin:round}
.kgs-rm-l1{font-size:13px;fill:#110E0D} .kgs-rm-l2{font-size:11.5px;fill:#4A423E}
.kgs-rm-sea-l{font-size:10.5px;fill:#A9441A;letter-spacing:.14em;text-transform:uppercase;font-stretch:125%}
.kgs-rm-lb{font-weight:800;font-size:15px}
.kgs-rm-dest circle{fill:#D7602D} .kgs-rm-dest .kgs-rm-halo,.kgs-rm-pos .kgs-rm-halo{fill:none;stroke:#D7602D;stroke-opacity:.45;stroke-width:1.5}
.kgs-rm-pos circle{fill:#D7602D}
.kgs-rm-shadow{fill:#110E0D;fill-opacity:.22}
/* ROUTE-MAP:END */

/* ---- form ---- */
.kgs-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.kgs-field__l{font-weight:600;font-size:var(--fs-small);color:var(--kl-ink)}
.kgs-field__l .kgs-opt{font-weight:400;color:var(--kl-ink-3)}
.kgs-field__h{font-size:var(--fs-caption);color:var(--kl-ink-3);font-weight:500}
.kgs-input,.kgs-select,.kgs-textarea{width:100%;height:var(--ctl-lg);padding:0 14px;border:1px solid var(--kl-line-ctl);border-radius:var(--r-1);background:var(--kl-white);
  color:var(--kl-ink);font:400 var(--fs-body)/1.4 var(--kl-font);transition:border-color var(--t-fast) var(--ease),box-shadow var(--t-fast)}
.kgs-textarea{height:auto;min-height:112px;padding:12px 14px;resize:vertical}
.kgs-input::placeholder,.kgs-textarea::placeholder{color:var(--kl-ink-4)}
.kgs-input:hover,.kgs-select:hover,.kgs-textarea:hover,.kgs-is-hover>.kgs-input{border-color:var(--kl-ink-2)}
.kgs-input:focus,.kgs-select:focus,.kgs-textarea:focus,.kgs-input.kgs-is-focus{outline:var(--focus);outline-offset:0;border-color:var(--kl-ink)}
.kgs-field--err .kgs-input,.kgs-field--err .kgs-textarea{border-color:var(--kl-error);border-width:1.5px}
.kgs-field__err{display:flex;gap:6px;align-items:center;font-size:var(--fs-caption);font-weight:600;color:var(--kl-error)}
.kgs-field__err::before{content:"";flex:none;width:14px;height:14px;background:var(--kl-error);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 0a7 7 0 1 0 0 14A7 7 0 0 0 7 0zm-1 3h2v5H6zm0 6h2v2H6z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 0a7 7 0 1 0 0 14A7 7 0 0 0 7 0zm-1 3h2v5H6zm0 6h2v2H6z'/%3E%3C/svg%3E") center/contain no-repeat} /* icon is built in: a .field__err can never be colour + text only */
.kgs-field__err:empty{display:none} /* no icon without text */
.kgs-input:disabled,.kgs-input.kgs-is-disabled{background:var(--kl-stone);border-color:var(--kl-stone);color:var(--kl-ink-3);cursor:not-allowed}
.kgs-select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--kl-ink) 50%),linear-gradient(135deg,var(--kl-ink) 50%,transparent 50%);
  background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%;background-size:5px 5px;background-repeat:no-repeat}
.kgs-drop{display:flex;align-items:center;gap:16px;padding:18px;border:1.5px dashed var(--kl-line-ctl);border-radius:var(--r-1);background:var(--kl-white)}
.kgs-drop__i{width:40px;height:40px;flex:none;display:grid;place-items:center;background:var(--kl-ember-100);color:var(--kl-et)}
.kgs-check{display:flex;gap:10px;align-items:flex-start;font-size:var(--fs-small);color:var(--kl-ink-2)}
.kgs-check input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--kl-ink)}

/* ---- header ---- */
.kgs-hdr{position:sticky;top:0;z-index:20;height:var(--hdr-h);background:rgba(255,255,255,.94);backdrop-filter:saturate(1.2) blur(8px);border-bottom:1px solid var(--kl-line)}
.kgs-hdr .kgs-container{height:100%;display:flex;align-items:center;gap:32px}
.kgs-hdr__logo img{height:34px;width:auto} .kgs-hdr nav{display:flex;gap:28px;margin-left:auto}
.kgs-hdr nav a{color:var(--kl-ink);text-decoration:none;font-weight:500;font-size:var(--fs-small);padding:6px 0;border-bottom:2px solid transparent}
.kgs-hdr nav a:hover{border-color:var(--kl-line-ctl)} .kgs-hdr nav a[aria-current]{border-color:var(--kl-ember)}
.kgs-hdr__menu{display:none;margin-left:auto}
@media (max-width:959px){.kgs-hdr nav,.kgs-hdr .kgs-btn{display:none}.kgs-hdr .kgs-hdr__menu{display:inline-flex}.kgs-hdr__logo img{height:28px}}

/* ---- dark data band (exception) ---- */
.kgs-band-dark{background:var(--kd-bg);color:var(--kd-fg);padding-block:clamp(48px,4vw,72px)}
.kgs-band-dark .kgs-t-overline{color:var(--kd-fg-3)}
.kgs-band-dark__grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--kd-line)}
.kgs-band-dark__it{padding:24px 24px 0 0;border-right:1px solid var(--kd-line);margin-right:24px}
.kgs-band-dark__it:last-child{border-right:0;margin-right:0}
.kgs-band-dark__n{display:block;font-size:var(--fs-stat);line-height:1;font-weight:800;font-stretch:var(--wd-display);letter-spacing:-.02em;font-variant-numeric:tabular-nums lining-nums;text-transform:uppercase}
.kgs-band-dark__n em{display:block;font-style:normal;color:var(--kd-accent);font-size:var(--fs-h3);font-weight:700;letter-spacing:.02em;margin-top:10px}
.kgs-band-dark__n.kgs-is-word{font-size:calc(var(--fs-stat)*.72)}
.kgs-stat__n.kgs-is-word{font-size:calc(var(--fs-stat)*.56);font-stretch:100%}
.kgs-band-dark__l{display:block;margin-top:12px;color:var(--kd-fg-2);font-size:var(--fs-small);max-width:28ch}
.kgs-band-dark__ill{display:flex;gap:16px;align-items:center}
@media (max-width:959px){.kgs-band-dark__grid{grid-template-columns:1fr 1fr}.kgs-band-dark__it:nth-child(2){border-right:0;margin-right:0}.kgs-band-dark__it{padding-bottom:24px}}

/* ---- CTA band ---- */
.kgs-cta{background:var(--kl-sand);border-top:2px solid var(--kl-rule)}
.kgs-cta__in{display:grid;grid-template-columns:1.4fr 1fr;gap:32px 64px;align-items:end;padding-block:clamp(48px,5vw,80px)}
.kgs-cta__t{font-size:var(--fs-display);line-height:1;font-weight:800;font-stretch:var(--wd-display);text-transform:uppercase;letter-spacing:-.02em;margin:0}
.kgs-cta__side{display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.kgs-cta__side p{color:var(--kl-ink-2);margin:0}
.kgs-cta--dark{background:var(--kd-bg);color:var(--kd-fg);border-top:0}
.kgs-cta--dark .kgs-cta__side p{color:var(--kd-fg-2)}
@media (max-width:767px){.kgs-cta__in{grid-template-columns:1fr}}

/* ---- footer (ink) ---- */
.kgs-ftr{background:var(--kd-bg);color:var(--kd-fg);padding:56px 0 28px;font-size:var(--fs-small)}
.kgs-ftr a{color:var(--kd-fg);text-decoration-color:rgba(244,239,232,.35)} .kgs-ftr a:hover{color:var(--kd-accent)}
.kgs-ftr__top{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:32px;padding-bottom:40px;border-bottom:1px solid var(--kd-line)}
.kgs-ftr__logo img{height:36px;width:auto;margin-bottom:16px}
.kgs-ftr__claim{font-weight:700;font-stretch:var(--wd-display);font-size:var(--fs-h4);max-width:22ch;line-height:1.25}
.kgs-ftr h4{font-size:var(--fs-overline);font-weight:600;font-stretch:var(--wd-label);letter-spacing:.16em;text-transform:uppercase;color:var(--kd-fg-3);margin:0 0 14px}
.kgs-ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.kgs-ftr address{font-style:normal;line-height:1.6;color:var(--kd-fg-2)}
.kgs-ftr__bot{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;padding-top:20px;color:var(--kd-fg-3);font-size:var(--fs-caption)}
@media (max-width:959px){.kgs-ftr__top{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.kgs-ftr__top{grid-template-columns:1fr}}

/* ---- grids / utilities ---- */
.kgs-g{display:grid;gap:var(--gutter)} .kgs-g-2{grid-template-columns:repeat(2,minmax(0,1fr))} .kgs-g-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.kgs-g-4{grid-template-columns:repeat(4,minmax(0,1fr))} .kgs-g-6{grid-template-columns:repeat(6,minmax(0,1fr))}
@media (max-width:1099px){.kgs-g-6{grid-template-columns:repeat(4,minmax(0,1fr))}.kgs-g-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:959px){.kgs-g-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.kgs-g-2,.kgs-g-3{grid-template-columns:1fr}.kgs-g-6{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kgs-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.kgs-stack>*+*{margin-top:var(--s,16px)}
.kgs-rule{border:0;border-top:1px solid var(--kl-line);margin:0} .kgs-rule--ink{border-top:2px solid var(--kl-rule)}
.kgs-muted{color:var(--kl-ink-2)}
@media (prefers-reduced-motion:reduce){[class*="kgs-"],[class*="kgs-"]::before,[class*="kgs-"]::after{transition:none!important;animation:none!important}}