/* ============================================================================
   Siuntos į Angliją — „Kaimynas" design tokens  (live site)
   Vocabulary mirrors design-system/tokens.css v2.0.0 · spec: ../design-system/DESIGN.md

   Everything above the EXTENSIONS rule is copied verbatim from the spec so the
   two files share one vocabulary. Below it are the tokens the live, responsive
   site needs that a 1440-only spec does not define.

   Replaces the retired „Amber Road" system. Do not reintroduce --sa-* tokens,
   #FFB703 / #FB8500 amber, #0B1F3A navy, or the dashed lane motif.
   ========================================================================== */

:root {

  /* ---------------------------------------------------------------- paper */
  --k-paper:        #FCF4E4;  /* page ground (carries the speckle texture)   */
  --k-paper-2:      #F6E9CE;  /* tinted alternating band, chips              */
  --k-paper-3:      #FBF1DC;  /* receipt stock, quiet inner surfaces         */
  --k-card:         #FFFBF2;  /* raised card surface                         */
  --k-photo:        #FFFDF7;  /* polaroid stock — lightest surface           */

  /* ------------------------------------------------------------------ ink */
  --k-ink:          #2C2118;  /* all body text + every SVG stroke   14.35:1  */
  --k-ink-2:        #4A3B2C;  /* secondary text, captions            9.83:1  */
  --k-ink-3:        #6B5946;  /* muted text FLOOR                    5.56:1  */

  /* ----------------------------------------------------------- terracotta */
  /* three steps on purpose — see DESIGN.md §3.3                            */
  --k-terra-100:    #F0D3C2;  /* icon-tile wash, active nav pill             */
  --k-terra-500:    #C4552C;  /* ILLUSTRATION ONLY — never carries text      */
  --k-terra-600:    #B0451F;  /* interactive fill; safe as text     5.17:1   */
  --k-terra-700:    #9E3F1D;  /* text on paper                      6.03:1   */

  /* ---------------------------------------------------------------- olive */
  --k-olive-100:    #D8E2C2;  /* icon-tile wash, reassurance panel           */
  --k-olive-600:    #4E6B3C;  /* filled pills, checks, lang switch  5.50:1   */
  --k-olive-900:    #2F3F26;  /* the one dark band on the page               */

  /* --------------------------------------------------------------- butter */
  --k-butter-100:   #FAE6B4;  /* icon-tile wash, tip panel                   */
  --k-butter-500:   #F0BE4B;  /* CTA band, user bubble, tape, sun            */

  /* ---------------------------------------------------------------- berry */
  --k-berry-100:    #EFD3DA;
  --k-berry-600:    #8E3F58;  /* fourth accent                      6.40:1   */

  /* ---------------------------------------------------------------- water */
  --k-water-300:    #A9CBD6;  /* water + ALL glass/windows in drawings       */

  /* ------------------------------------------------------------- on-colour
     The only text colours permitted on top of a filled accent.              */
  --k-on-terra:     #FFF6EC;  /* on terra-600                       5.29:1   */
  --k-on-terra-2:   #FFF3EA;  /* on terra-600, day chip             5.18:1   */
  --k-on-ribbon:    #FFEFE2;  /* on terra-600, ribbon               5.03:1   */
  --k-on-olive:     #F6FAEE;  /* on olive-600                       5.68:1   */
  --k-on-olive-2:   #DCE8CA;  /* on olive-600, sub-line             4.71:1   */
  --k-on-dark:      #F7F2E2;  /* on olive-900                      10.08:1   */
  --k-on-dark-2:    #DDD6C0;  /* on olive-900, secondary            7.77:1   */
  --k-on-dark-3:    #C9C2AC;  /* on olive-900, placeholder          6.34:1   */
  --k-on-ink:       #EFE5D4;  /* on ink (footer)                   12.58:1   */
  --k-on-ink-2:     #D8CCB8;  /* on ink, list items                 9.90:1   */
  --k-on-ink-3:     #C9BCA6;  /* on ink, italic note                8.39:1   */
  --k-on-ink-4:     #BFB09A;  /* on ink, bottom bar                 7.39:1   */

  /* ------------------------------------------------------------- WhatsApp
     ONLY on controls whose action is "open WhatsApp".
     ONLY --k-wa-ink on --k-wa = 7.24:1. White on green = 1.98:1 = forbidden. */
  --k-wa:           #25D366;
  --k-wa-ink:       #10301C;

  /* ------------------------------------------------- illustration palette
     The complete legal fill set for SVG scenes. Do not invent new ones.     */
  --k-ill-paper:    #FFFBF2;  --k-ill-cloud:   #FFFDF6;
  --k-ill-plaster:  #FBEBD2;
  --k-ill-land:     #CBD6AC;  --k-ill-land-2:  #BCCB9A;
  --k-ill-leaf:     #7E9A5E;  --k-ill-leaf-2:  #6E8C52;
  --k-ill-trunk:    #5A4A3A;  --k-ill-timber:  #B99A72;
  --k-ill-glass:    #A9CBD6;  --k-ill-lit:     #F7D77E;
  --k-ill-roof:     #B04B2B;  --k-ill-brick:   #B46A4C;
  --k-ill-brick-2:  #C68B62;  --k-ill-slate:   #5F6E70;
  --k-ill-stone:    #E8D6B4;  --k-ill-dome:    #DCE4E6;
  --k-ill-tyre:     #3A2F24;  --k-ill-bus:     #B03A2E;
  --k-ill-skin:     #F2C79C;  --k-ill-road:    #F3E7CF;

  /* ----------------------------------------------------------- typography */
  --k-font-sans:  "Trebuchet MS", "Segoe UI", Verdana, Geneva, sans-serif;
  --k-font-serif: Georgia, "Iowan Old Style", "Times New Roman", serif;

  --k-text-h1:      60px;   --k-lh-h1:      1.06;   --k-ls-h1:  -1.4px;
  --k-text-h2:      42px;   --k-lh-h2:      1.12;   --k-ls-h2:  -0.4px;
  --k-text-h2-lg:   44px;
  --k-text-display: 46px;
  --k-text-stat:    38px;
  --k-text-h3:      23px;
  --k-text-h4:      21px;
  --k-text-h5:      20px;
  --k-text-kicker:  20px;
  --k-text-lead-lg: 19.5px;
  --k-text-lead:    18px;
  --k-text-body:    17px;   --k-lh-body:    1.65;
  --k-text-sm:      15.5px;
  --k-text-caption: 14px;
  --k-text-micro:   13px;   /* uppercase only — absolute floor              */

  /* --------------------------------------------------------------- space */
  --k-space-1:   4px;   --k-space-2:   8px;   --k-space-3:  12px;
  --k-space-4:  16px;   --k-space-5:  22px;   --k-space-6:  26px;
  --k-space-7:  34px;   --k-space-8:  46px;   --k-space-9:  56px;
  --k-space-10: 78px;   --k-space-11:100px;

  --k-container: 1200px;   /* inside a 1440px design width                  */

  /* -------------------------------------------------------------- radius */
  --k-radius-pill:  999px;
  --k-radius-map:    44px;
  --k-radius-lg:     32px;
  --k-radius-md:     30px;
  --k-radius-note:   26px;
  --k-radius-sm:     18px;
  --k-radius-tile:   20px;
  --k-radius-photo:  10px;
  --k-radius-tape:    3px;

  /* -------------------------------------------------------------- border */
  --k-border-xl:  3.5px solid var(--k-ink);   /* map card, band edges       */
  --k-border:       3px solid var(--k-ink);   /* cards, buttons, bubbles    */
  --k-border-sm:  2.5px solid var(--k-ink);   /* chips, icon tiles          */
  --k-rule:         2px solid rgba(44,33,24,.12);  /* inner divider         */
  --k-rule-strong:  3px solid var(--k-ink);        /* price row divider     */
  /* NO dashed borders anywhere in this system.                             */

  /* ------------------------------------------------- shadow: hard, blur 0 */
  --k-shadow-sm:      0  4px 0 var(--k-ink);
  --k-shadow-btn:     0  5px 0 var(--k-ink);
  --k-shadow-btn-up:  0  7px 0 var(--k-ink);            /* hover            */
  --k-shadow-btn-down:0  2px 0 var(--k-ink);            /* active           */
  --k-shadow-pin:     0  5px 0 rgba(44,33,24,.16);
  --k-shadow-card:    0  8px 0 rgba(44,33,24,.14);
  --k-shadow-photo:   0  9px 0 rgba(44,33,24,.14);
  --k-shadow-receipt: 0 12px 0 rgba(0,0,0,.28);         /* on the dark band */
  --k-shadow-map:     0 14px 0 rgba(44,33,24,.12);

  /* ------------------------------------------------------------- rotation */
  --k-tilt-a: -2.2deg;  --k-tilt-b:  1.4deg;
  --k-tilt-c: -1.1deg;  --k-tilt-d:  2.4deg;   /* row rhythm                */
  --k-tilt-tape: -4deg;                        /* counter to the card       */
  --k-tilt-stamp: -14deg;                      /* the one exception         */

  /* --------------------------------------------------------------- motion */
  --k-ease:      cubic-bezier(.22,.61,.36,1);
  --k-dur-fast:  140ms;
  --k-dur:       200ms;
  --k-dur-slow:  320ms;

  /* --------------------------------------------------------- decoration */
  --k-texture:
    radial-gradient(rgba(44,33,24,.050) 1px, transparent 1.3px),
    radial-gradient(rgba(44,33,24,.032) 1px, transparent 1.3px);
  --k-sky: linear-gradient(180deg,#DFEDEE 0%, #EFF0E2 42%, #FBF1DC 100%);
  --k-blob-radius: 58% 42% 47% 53% / 48% 55% 45% 52%;

  /* ==========================================================================
     EXTENSIONS — live site only.
     The spec is render-tested at a fixed 1440px; the real site must hold from
     1440 down to 375. Nothing here overrides a spec token: the fluid ramps all
     TOP OUT at the spec's fixed value, so at 1440px the two agree exactly.
     ====================================================================== */

  /* Fluid type. Upper bound === the spec's fixed --k-text-* on the right. */
  --k-fluid-h1:      clamp(2.25rem, 1.15rem + 3.6vw, 3.75rem);   /* →  60px */
  --k-fluid-h2:      clamp(1.75rem, 1.1rem + 2.1vw, 2.625rem);   /* →  42px */
  --k-fluid-h2-lg:   clamp(1.85rem, 1.1rem + 2.4vw, 2.75rem);    /* →  44px */
  --k-fluid-display: clamp(2rem, 1.3rem + 2.2vw, 2.875rem);      /* →  46px */
  --k-fluid-stat:    clamp(1.75rem, 1.2rem + 1.7vw, 2.375rem);   /* →  38px */
  --k-fluid-lead-lg: clamp(1rem, .95rem + .35vw, 1.21875rem);    /* →19.5px */

  /* Headings share one tight leading before the per-level overrides land. */
  --k-lh-tight:      1.1;

  /* Rhythm that has to breathe on small screens (spec: fixed 100px / 120px) */
  --k-sec-y:         clamp(56px, 7vw, 100px);   /* --k-space-11 at 1440     */
  --k-gutter:        24px;                      /* 16px under 640           */

  /* Bare border WIDTHS, for the places that set border-width alone.
     Values match --k-border-xl / --k-border / --k-border-sm. */
  --k-border-w-xl:   3.5px;
  --k-border-w:      3px;
  --k-border-w-sm:   2.5px;

  /* Raw rule colours, for borders that are not a full --k-rule shorthand. */
  --k-rule-ink:      rgba(44, 33, 24, .12);
  --k-rule-ink-2:    rgba(44, 33, 24, .22);   /* tape edge                  */

  /* The in-chat receipt sits on --k-paper, not on the dark band, so its
     torn edge needs a stock BRIGHTER than the ground to read at all.       */
  --k-receipt-stock: var(--k-photo);

  /* Floating chat widget — the spec has no fixed-position surface. */
  --k-shadow-float:  0 10px 0 rgba(44, 33, 24, .18), 0 18px 40px rgba(44, 33, 24, .18);

  /* Layers */
  --k-z-blob:        0;
  --k-z-content:     2;
  --k-z-pin:         3;
  --k-z-header:     40;
  --k-z-fab:        60;
  --k-z-chat:       70;
}

@media (max-width: 640px) {
  :root { --k-gutter: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --k-dur-fast: 1ms;
    --k-dur:      1ms;
    --k-dur-slow: 1ms;
  }
}