/**
 * All Smile — dizajnové tokeny
 *
 * Jediné miesto, kde sú definované farby, odstupy a časovania.
 * Hodnoty sú vytiahnuté z pôvodných snippetov (výskyty vo WPCode kóde).
 * Keď zmeníš odtieň tu, prepíše sa všade.
 */

:root {
	/* --- Značka ------------------------------------------------ */
	--asp-brand:            #ff3600; /* hlavný akcent, 51 výskytov */
	--asp-brand-hover:      #ff4b08;
	--asp-brand-soft:       #ff6a1a;
	--asp-brand-tint:       #ffe7df;

	/* --- Doplnková paleta -------------------------------------- */
	--asp-accent-orange:    #ff8403;
	--asp-accent-orange-2:  #ff8a00;
	--asp-accent-pink:      #ffbccb;
	--asp-accent-green:     #136c40;
	--asp-accent-green-2:   #177a43;
	--asp-accent-blue:      #13496c;

	/* --- Neutrály ---------------------------------------------- */
	--asp-black:            #000000;
	--asp-ink:              #0b0b0b;
	--asp-ink-deep:         #050505;
	--asp-ink-soft:         #0a0a0a;
	--asp-gray-900:         #111111;
	--asp-gray-500:         #6b6b6b;
	--asp-gray-200:         #e5e5e5;
	--asp-white:            #ffffff;

	/* --- Plochy ------------------------------------------------ */
	--asp-bg:               var(--asp-white);
	--asp-bg-dark:          var(--asp-ink);
	--asp-text:             var(--asp-ink);
	--asp-text-invert:      var(--asp-white);
	--asp-border:           rgba(0, 0, 0, .12);
	--asp-border-invert:    rgba(255, 255, 255, .16);

	/* --- Typografia -------------------------------------------- */
	/* Switzer je na webe nahraný ako dve samostatné rodiny, obe s váhou
	   400. font-weight: 700 by preto browser dopočítal umelo (faux bold)
	   a písmo by vyzeralo rozmazane — na tučný rez treba siahnuť rodinou. */
	--asp-font:             inherit;
	--asp-font-bold:        "Switzer-Bold", "Switzer-Regular", system-ui, sans-serif;
	--asp-fs-eyebrow:       clamp(.75rem, .7rem + .2vw, .875rem);
	--asp-fs-body:          clamp(1rem, .95rem + .2vw, 1.125rem);
	--asp-fs-h2:            clamp(1.75rem, 1.3rem + 2vw, 3rem);
	--asp-fs-h1:            clamp(2.25rem, 1.5rem + 3.4vw, 4.5rem);
	--asp-lh-tight:         1.1;
	--asp-lh-body:          1.6;
	--asp-tracking-eyebrow: .08em;

	/* --- Rytmus ------------------------------------------------ */
	--asp-space-xs:         .5rem;
	--asp-space-sm:         1rem;
	--asp-space-md:         1.5rem;
	--asp-space-lg:         2.5rem;
	--asp-space-xl:         4rem;
	--asp-space-2xl:        6rem;
	--asp-section-y:        clamp(3rem, 2rem + 5vw, 7rem);

	/* --- Tvar -------------------------------------------------- */
	--asp-radius-sm:        6px;
	--asp-radius:           12px;
	--asp-radius-lg:        24px;
	--asp-radius-pill:      999px;

	/* --- Tiene ------------------------------------------------- */
	--asp-shadow-sm:        0 1px 2px rgba(0, 0, 0, .06);
	--asp-shadow:           0 8px 24px rgba(0, 0, 0, .10);
	--asp-shadow-lg:        0 24px 60px rgba(0, 0, 0, .18);

	/* --- Pohyb ------------------------------------------------- */
	--asp-ease:             cubic-bezier(.22, .61, .36, 1);
	--asp-ease-out:         cubic-bezier(.16, 1, .3, 1);
	--asp-dur-fast:         .18s;
	--asp-dur:              .32s;
	--asp-dur-slow:         .6s;

	/* --- Rozmery ----------------------------------------------- */
	--asp-container:        1440px;
	--asp-container-wide:   1920px;
	--asp-gutter:           clamp(1rem, .5rem + 2vw, 2.5rem);

	/* --- Vrstvenie --------------------------------------------- */
	--asp-z-base:           1;
	--asp-z-sticky:         100;
	--asp-z-header:         500;
	--asp-z-popup:          9000;
	--asp-z-preloader:      9999;
}

/* Kto si vypne animácie v systéme, nech ich nedostane. */
@media (prefers-reduced-motion: reduce) {
	:root {
		--asp-dur-fast: .01ms;
		--asp-dur:      .01ms;
		--asp-dur-slow: .01ms;
	}
}

/* Spoločný kontajner sekcií — pôvodne sa opakoval v každom snippete. */
.asp-container {
	width: 100%;
	max-width: var(--asp-container);
	margin-inline: auto;
	padding-inline: var(--asp-gutter);
}

.asp-container--wide {
	max-width: var(--asp-container-wide);
}

.asp-section {
	padding-block: var(--asp-section-y);
}

.asp-section--dark {
	background: var(--asp-bg-dark);
	color: var(--asp-text-invert);
}

/* Prístupné skrytie — používa viacero sekcií. */
.asp-visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}