/* Global – Produkt-Napoj */
html { scroll-behavior: smooth; }
body { font-family: var(--font-body); font-size: var(--font-size-base); color: var(--color-text); background: var(--color-bg); line-height: var(--line-height-normal); }

.container { width: 100%; max-width: var(--container-max); margin-inline: auto; padding-inline: var(--container-padding); }

.section { padding-block: var(--section-py); scroll-margin-top: var(--header-height); }

.section__header { text-align: center; max-width: 640px; margin-inline: auto; margin-bottom: var(--space-12); }

.section__eyebrow { display: inline-block; font-size: var(--font-size-xs); font-weight: var(--font-weight-semi); letter-spacing: 0.15em; text-transform: uppercase; color: var(--color-accent); margin-bottom: var(--space-3); }

.section__title { font-size: clamp(var(--font-size-3xl), 4vw, var(--font-size-5xl)); font-weight: var(--font-weight-black); line-height: var(--line-height-tight); color: var(--color-text); margin-bottom: var(--space-4); }

.section__desc { font-size: var(--font-size-lg); color: var(--color-text-muted); line-height: var(--line-height-relaxed); }

/* Buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); padding: 0.75rem 1.5rem; border-radius: var(--radius-full); font-size: var(--font-size-sm); font-weight: var(--font-weight-semi); white-space: nowrap; cursor: pointer; border: 2px solid transparent; transition: all var(--transition-base); text-decoration: none; }
.btn:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 3px; }
.btn:active { transform: scale(0.97); }
.btn--lg { padding: 1rem 2rem; font-size: var(--font-size-base); }
.btn--full { width: 100%; }
.btn--accent { background: var(--color-accent); color: #fff; box-shadow: 0 0 20px rgba(255,107,0,0.3); }
.btn--accent:hover { background: var(--color-accent-dark); box-shadow: 0 0 32px rgba(255,107,0,0.5); }
.btn--outline-white { background: transparent; color: #fff; border-color: rgba(255,255,255,0.4); }
.btn--outline-white:hover { background: rgba(255,255,255,0.1); border-color: #fff; }

/* Toast */
.toast { position: fixed; bottom: var(--space-6); left: 50%; transform: translateX(-50%) translateY(120%); background: var(--color-surface-2); color: var(--color-text); padding: var(--space-4) var(--space-6); border-radius: var(--radius-full); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); box-shadow: var(--shadow-lg); z-index: var(--z-toast); transition: transform var(--transition-slow); min-width: 260px; text-align: center; border: 1px solid var(--color-border-light); }
.toast.is-visible { transform: translateX(-50%) translateY(0); }
.toast--success { background: #065F46; border-color: transparent; }
.toast--error { background: #991B1B; border-color: transparent; }

/* Reveal */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.6s ease, transform 0.6s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }