/* sa-tokens.css: dizaino sistemos tokenai įskiepiui (surinkta iš sa-design-system/tokens/*.css).
   Skirtumai nuo originalo: Google Fonts importas pakeistas savais failais (latin + latin-ext);
   base.css body ir a taisyklės nekraunamos, nes perrašytų visą svetainę; pridėtas --sa-ease alias,
   nes sa-woocommerce.css jį naudoja, o tokenai turi tik --sa-ease-out. */
@font-face{font-family:'Familjen Grotesk';font-style:normal;font-weight:400 700;font-display:swap;src:url('../fonts/FamiljenGrotesk-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:'Familjen Grotesk';font-style:normal;font-weight:400 700;font-display:swap;src:url('../fonts/FamiljenGrotesk-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:'Familjen Grotesk';font-style:italic;font-weight:400 700;font-display:swap;src:url('../fonts/FamiljenGrotesk-Italic-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:'Familjen Grotesk';font-style:italic;font-weight:400 700;font-display:swap;src:url('../fonts/FamiljenGrotesk-Italic-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:'Gloock';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/Gloock-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:'Gloock';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/Gloock-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;}
:root {
  /* ── Foundation: kennel palette (skraidanciosausytes.lt) ── */
  --sa-cream: #F9F6EF;          /* page background, same as the site */
  --sa-cream-line: #E8E2D5;
  --sa-ink: #2E3A43;
  --sa-paper: #FFFFFF;          /* cards, panels, inputs */
  --sa-surface: #F1EBE0;        /* warm panels, image wells, filters */
  --sa-surface-2: #F4EEE4;      /* checkout summary column */
  --sa-surface-3: #FBF7F0;      /* selected radio row */
  --sa-line: #E8E2D5;           /* hairlines, dividers */
  --sa-line-strong: #DFD7C7;    /* chip and icon-button borders */
  --sa-line-input: #D9CFBF;     /* input borders */
  --sa-line-control: #D9CFBF;   /* stepper, variant boxes */

  /* ── Text ───────────────────────────────────────────────── */
  --sa-text: #2E3A43;
  --sa-text-body: #52606B;
  --sa-text-muted: #6F6857;
  --sa-text-faint: #6F6857;     /* placeholders, 4.5:1 minimum */
  --sa-text-disabled: #AFA79A;
  --sa-on-ink: #FFFFFF;
  --sa-on-ink-body: #C6CDD2;
  --sa-on-ink-muted: #B4BCC2;
  --sa-on-ink-faint: #AEB6BC;

  /* ── Accent ─────────────────────────────────────────────── */
  /* Savininko pasirinkimas 2026-09-12: dizaino sistemos leistina alternatyva „forest“ vietoj kennel oranžinės.
     Šviesūs atspalviai pagal guidelines/colors-accent.html: soft = 10 % akcento ant baltos. */
  --sa-accent: #1E6F5C;          /* fills; white text clears 4.5:1 */
  --sa-accent-text: #1B6252;     /* small accent text and links on cream */
  --sa-accent-hover: #165344;
  --sa-accent-site: #D2542B;     /* site-owned header CTA only */
  --sa-accent-soft: color-mix(in srgb, #1E6F5C 10%, #FFFFFF);
  --sa-accent-soft-line: color-mix(in srgb, #1E6F5C 25%, #FFFFFF);
  --sa-accent-soft-text: #165344;
  --sa-on-accent: #FFFFFF;

  /* ── Mustard: stickers, counts, PDF badges, focus ring ──── */
  --sa-mustard: #F6BE2C;
  --sa-on-mustard: #2E3A43;
  --sa-focus: #F6BE2C;
  --sa-focus-glow: rgba(246, 190, 44, .45);

  /* ── Semantic ───────────────────────────────────────────── */
  --sa-success: #1A7F37;
  --sa-success-soft: #EDF2EC;
  --sa-danger: #B4261B;
  --sa-danger-soft: #FBEDEB;     /* Notice tone="danger" iš components/sa.jsx */
  --sa-scrim: rgba(46, 58, 67, .45);

  /* ── Aliases used by components ─────────────────────────── */
  --sa-bg: var(--sa-cream);
  --sa-fg: var(--sa-text);
  --sa-cta: var(--sa-accent);
  --sa-cta-hover: var(--sa-accent-hover);
}

/* Alternate accents, set on <html>, <body> or any subtree.
   Parduotuvėje naudojama forest (nustatyta :root viršuje). */
[data-sa-accent="kennel"], .sa-theme-kennel { --sa-accent: #B8441E; --sa-accent-text: #A8401B; --sa-accent-hover: #983514; }
[data-sa-accent="slate"], .sa-theme-slate { --sa-accent: #2E3A43; --sa-accent-text: #2E3A43; --sa-accent-hover: #1E272E; }
[data-sa-accent="forest"], .sa-theme-forest { --sa-accent: #1E6F5C; --sa-accent-text: #1B6252; --sa-accent-hover: #165344; }
:root {
  --sa-font-sans: 'Familjen Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --sa-font-display: 'Gloock', Georgia, 'Times New Roman', serif;

  /* Text sizes (px). Body copy never below 13.5px; UI labels never below 10px. */
  --sa-text-2xs: 10px;     /* badges */
  --sa-text-xs: 10.5px;    /* kickers, marquee, counts */
  --sa-text-sm: 12px;      /* buttons-small, meta, notes */
  --sa-text-sm-plus: 12.5px; /* card kind line, helper text */
  --sa-text-base: 13.5px;  /* dense body (cards, notes) */
  --sa-text-md: 14px;      /* inputs, body */
  --sa-text-lg: 15px;      /* lead paragraphs */
  --sa-text-xl: 17px;      /* hero paragraph */
  --sa-text-2xl: 22px;     /* prices, drawer titles */
  --sa-text-3xl: 28px;     /* sheet titles, mobile menu items */

  /* Display sizes: fluid */
  --sa-display-sm: clamp(26px, 3vw, 36px);   /* sub-section h2, quotes */
  --sa-display-md: clamp(30px, 3.4vw, 44px); /* product h1 */
  --sa-display-lg: clamp(34px, 4.2vw, 56px); /* section h2 */
  --sa-display-xl: clamp(42px, 6vw, 82px);   /* hero h1 */
  --sa-numeral: 36px;                        /* Gloock 01 / 02 / 03 */

  --sa-leading-display: .95;
  --sa-leading-heading: 1.02;
  --sa-leading-tight: 1.3;
  --sa-leading-body: 1.6;
  --sa-leading-relaxed: 1.65;

  --sa-tracking-display: -.035em;  /* all bold sans headlines */
  --sa-tracking-heading: -.02em;
  --sa-tracking-button: .06em;
  --sa-tracking-badge: .1em;
  --sa-tracking-caps: .14em;       /* variant labels, counts */
  --sa-tracking-caps-wide: .16em;  /* kickers, marquee */

  --sa-weight-regular: 400;
  --sa-weight-medium: 500;
  --sa-weight-semibold: 600;
  --sa-weight-bold: 700;
}
:root {
  /* 4px base scale */
  --sa-space-1: 4px;
  --sa-space-2: 8px;
  --sa-space-3: 12px;
  --sa-space-4: 16px;
  --sa-space-5: 20px;
  --sa-space-6: 24px;
  --sa-space-7: 28px;
  --sa-space-8: 32px;
  --sa-space-10: 40px;
  --sa-space-12: 48px;
  --sa-space-14: 56px;
  --sa-space-16: 64px;
  --sa-space-20: 80px;
  --sa-space-22: 88px;

  /* Layout */
  --sa-page-max: 1440px;
  --sa-gutter: clamp(16px, 4vw, 40px);         /* page side padding */
  --sa-section-gap: clamp(48px, 6vw, 88px);    /* vertical rhythm between sections */
  --sa-section-pad: clamp(28px, 4.5vw, 64px);  /* inside coloured panels */
  --sa-header-h: 68px;
  --sa-touch: 44px;                             /* minimum hit target */
  --sa-grid-gap-x: clamp(14px, 2vw, 28px);
  --sa-grid-gap-y: clamp(24px, 3vw, 44px);

  /* Breakpoints (reference only: CSS vars can't be used in @media):
     mobile < 760px · tablet 760-1023px · desktop ≥ 1024px · wide ≥ 1440px */
}
:root {
  --sa-radius-sm: 10px;    /* thumbnails inside cart rows, bank chips */
  --sa-radius-md: 14px;    /* inputs, selects, variant boxes, notes */
  --sa-radius-lg: 20px;    /* product cards, panels, why-cards */
  --sa-radius-xl: 22px;    /* category cards, service cards */
  --sa-radius-2xl: 24px;   /* product gallery, newsletter block */
  --sa-radius-3xl: 28px;   /* hero image, coloured sections, sheets, footer top */
  --sa-radius-pill: 999px; /* buttons, chips, badges, steppers */
}
:root {
  /* Shadows are rare and soft: only on things that float or lift. Flat by default. */
  --sa-shadow-lift: 0 18px 40px -22px rgba(17, 17, 17, .35);   /* card hover */
  --sa-shadow-float: 0 16px 40px -18px rgba(0, 0, 0, .35);     /* floating chips over photos */
  --sa-shadow-sticker: 0 12px 30px -12px rgba(0, 0, 0, .35);
  --sa-shadow-cover: 0 30px 60px -30px rgba(17, 17, 17, .5);   /* PDF cover, large */
  --sa-shadow-drawer: -20px 0 60px rgba(0, 0, 0, .18);
  --sa-shadow-sheet: 0 -20px 60px rgba(0, 0, 0, .2);
}
:root {
  --sa-ease-out: cubic-bezier(.2, .7, .2, 1);
  --sa-dur-fast: .3s;   /* colour changes, hover lift */
  --sa-dur-base: .5s;   /* image zoom, progress bars */
  --sa-dur-slow: .6s;   /* entrance rise */
  --sa-marquee-dur: 34s;
}

@keyframes sa-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes sa-rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes sa-wiggle { 0%, 100% { transform: rotate(-7deg); } 50% { transform: rotate(-3deg); } }

.sa-marquee { display: flex; width: max-content; animation: sa-marquee var(--sa-marquee-dur) linear infinite; }
.sa-rise { animation: sa-rise var(--sa-dur-slow) var(--sa-ease-out) both; }
.sa-rise-1 { animation-delay: .1s; }
.sa-rise-2 { animation-delay: .2s; }
.sa-wiggle { display: inline-block; animation: sa-wiggle 5s ease-in-out infinite; }
.sa-lift { transition: transform var(--sa-dur-fast) var(--sa-ease-out), box-shadow var(--sa-dur-fast); }
.sa-lift:hover { transform: translateY(-4px); box-shadow: var(--sa-shadow-lift); }
.sa-zoom img, .sa-zoom image-slot { transition: transform var(--sa-dur-base) var(--sa-ease-out); }
.sa-zoom:hover img, .sa-zoom:hover image-slot { transform: scale(1.04); }

@media (prefers-reduced-motion: reduce) {
  .sa-marquee, .sa-rise, .sa-wiggle { animation: none; }
  .sa-lift, .sa-zoom img { transition: none; }
}
:root{--sa-ease:var(--sa-ease-out);}
.sa-focusable:focus-visible{outline:3px solid var(--sa-focus);outline-offset:2px}
.sa-focus-inset:focus-visible{outline-offset:-3px}
.sa-summary{list-style:none}.sa-summary::-webkit-details-marker{display:none}