/* Gmina Złotów — design tokens (dokładnie ze źródła Lovable) */
:root {
  --radius: 0.75rem;
  --background: oklch(0.985 0.01 80);
  --foreground: oklch(0.18 0.02 25);
  --ink: oklch(0.16 0.015 25);
  --cream: oklch(0.97 0.015 80);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.18 0.02 25);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.18 0.02 25);
  --primary: oklch(0.46 0.18 25);
  --primary-foreground: oklch(0.98 0.01 80);
  --primary-glow: oklch(0.58 0.21 28);
  --secondary: oklch(0.94 0.025 75);
  --secondary-foreground: oklch(0.25 0.03 25);
  --muted: oklch(0.95 0.015 75);
  --muted-foreground: oklch(0.45 0.025 30);
  --accent: oklch(0.93 0.04 75);
  --accent-foreground: oklch(0.25 0.05 35);
  --gold: oklch(0.78 0.14 80);
  --gold-foreground: oklch(0.2 0.04 50);
  --border: oklch(0.9 0.02 75);
  --input: oklch(0.9 0.02 75);
  --ring: oklch(0.46 0.18 25);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background-color: var(--background);
  color: var(--foreground);
  font-family: "Inter", system-ui, -apple-system, sans-serif;
  font-feature-settings: "ss01", "cv11";
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img, video, svg { display: block; max-width: 100%; }
h1, h2, h3, h4, h5 {
  font-family: "Fraunces", "Playfair Display", Georgia, serif;
  letter-spacing: -0.02em;
}

/* utilities */
.font-display { font-family: "Fraunces", "Playfair Display", Georgia, serif; }
.text-balance { text-wrap: balance; }
.bg-gradient-hero { background-image: linear-gradient(135deg, color-mix(in oklab, var(--primary) 92%, black) 0%, var(--primary) 50%, color-mix(in oklab, var(--primary) 80%, var(--gold)) 100%); }
.bg-gradient-gold { background-image: linear-gradient(135deg, var(--gold) 0%, color-mix(in oklab, var(--gold) 70%, white) 100%); }

.shadow-elegant { box-shadow: 0 20px 60px -20px color-mix(in oklab, var(--primary) 35%, transparent); }
.shadow-soft { box-shadow: 0 8px 30px -8px color-mix(in oklab, var(--ink) 18%, transparent); }
.shadow-card { box-shadow: 0 2px 12px -2px color-mix(in oklab, var(--ink) 10%, transparent); }
.transition-smooth { transition: all 400ms cubic-bezier(0.22, 1, 0.36, 1); }

/* Tailwind CDN on WordPress can miss the custom Lovable color tokens. These
   fallbacks keep the exported HTML visually identical even before/without CDN
   custom color generation. */
.bg-background { background-color: var(--background) !important; }
.bg-background\/60 { background-color: color-mix(in oklab, var(--background) 60%, transparent) !important; }
.bg-background\/85 { background-color: color-mix(in oklab, var(--background) 85%, transparent) !important; }
.bg-card { background-color: var(--card) !important; }
.bg-ink { background-color: var(--ink) !important; }
.bg-primary { background-color: var(--primary) !important; }
.bg-primary\/10 { background-color: color-mix(in oklab, var(--primary) 10%, transparent) !important; }
.bg-primary\/15 { background-color: color-mix(in oklab, var(--primary) 15%, transparent) !important; }
.bg-secondary { background-color: var(--secondary) !important; }
.bg-secondary\/30 { background-color: color-mix(in oklab, var(--secondary) 30%, transparent) !important; }
.bg-secondary\/40 { background-color: color-mix(in oklab, var(--secondary) 40%, transparent) !important; }
.bg-secondary\/50 { background-color: color-mix(in oklab, var(--secondary) 50%, transparent) !important; }
.bg-secondary\/60 { background-color: color-mix(in oklab, var(--secondary) 60%, transparent) !important; }
.bg-gold { background-color: var(--gold) !important; }
.bg-gold\/10 { background-color: color-mix(in oklab, var(--gold) 10%, transparent) !important; }
.bg-gold\/15 { background-color: color-mix(in oklab, var(--gold) 15%, transparent) !important; }
.bg-gold\/20 { background-color: color-mix(in oklab, var(--gold) 20%, transparent) !important; }
.bg-gold\/25 { background-color: color-mix(in oklab, var(--gold) 25%, transparent) !important; }
.bg-cream\/10 { background-color: color-mix(in oklab, var(--cream) 10%, transparent) !important; }
.bg-cream\/15 { background-color: color-mix(in oklab, var(--cream) 15%, transparent) !important; }
.bg-cream\/20 { background-color: color-mix(in oklab, var(--cream) 20%, transparent) !important; }
[class~="bg-cream/[0.06]"] { background-color: color-mix(in oklab, var(--cream) 6%, transparent) !important; }

.text-foreground { color: var(--foreground) !important; }
.text-foreground\/80 { color: color-mix(in oklab, var(--foreground) 80%, transparent) !important; }
.text-foreground\/85 { color: color-mix(in oklab, var(--foreground) 85%, transparent) !important; }
.text-foreground\/90 { color: color-mix(in oklab, var(--foreground) 90%, transparent) !important; }
.text-primary { color: var(--primary) !important; }
.text-primary-foreground { color: var(--primary-foreground) !important; }
.text-secondary-foreground { color: var(--secondary-foreground) !important; }
.text-muted-foreground { color: var(--muted-foreground) !important; }
.text-gold { color: var(--gold) !important; }
.text-gold\/95 { color: color-mix(in oklab, var(--gold) 95%, transparent) !important; }
.text-gold-foreground { color: var(--gold-foreground) !important; }
.text-cream { color: var(--cream) !important; }
.text-cream\/50 { color: color-mix(in oklab, var(--cream) 50%, transparent) !important; }
.text-cream\/60 { color: color-mix(in oklab, var(--cream) 60%, transparent) !important; }
.text-cream\/70 { color: color-mix(in oklab, var(--cream) 70%, transparent) !important; }
.text-cream\/75 { color: color-mix(in oklab, var(--cream) 75%, transparent) !important; }
.text-cream\/80 { color: color-mix(in oklab, var(--cream) 80%, transparent) !important; }
.text-cream\/85 { color: color-mix(in oklab, var(--cream) 85%, transparent) !important; }
.text-cream\/90 { color: color-mix(in oklab, var(--cream) 90%, transparent) !important; }

.border-border { border-color: var(--border) !important; }
.border-border\/60 { border-color: color-mix(in oklab, var(--border) 60%, transparent) !important; }
.border-cream\/10 { border-color: color-mix(in oklab, var(--cream) 10%, transparent) !important; }
.border-cream\/20 { border-color: color-mix(in oklab, var(--cream) 20%, transparent) !important; }
.border-cream\/30 { border-color: color-mix(in oklab, var(--cream) 30%, transparent) !important; }
.border-gold\/30 { border-color: color-mix(in oklab, var(--gold) 30%, transparent) !important; }

.hover\:text-gold:hover { color: var(--gold) !important; }
.hover\:text-primary:hover { color: var(--primary) !important; }
.hover\:bg-secondary:hover { background-color: var(--secondary) !important; }
.hover\:bg-secondary\/50:hover { background-color: color-mix(in oklab, var(--secondary) 50%, transparent) !important; }
.hover\:bg-cream\/20:hover { background-color: color-mix(in oklab, var(--cream) 20%, transparent) !important; }
.hover\:bg-primary-glow:hover { background-color: var(--primary-glow) !important; }
.group:hover .group-hover\:text-primary { color: var(--primary) !important; }
.group:hover .group-hover\:text-primary-foreground { color: var(--primary-foreground) !important; }
.group:hover .group-hover\:bg-primary { background-color: var(--primary) !important; }
.group:hover .group-hover\:bg-primary\/10 { background-color: color-mix(in oklab, var(--primary) 10%, transparent) !important; }
.group:hover .group-hover\:bg-cream\/15 { background-color: color-mix(in oklab, var(--cream) 15%, transparent) !important; }

.bg-gradient-to-b.from-transparent.to-background { background-image: linear-gradient(to bottom, transparent, var(--background)) !important; }
.bg-gradient-to-br.from-secondary\/60.to-background { background-image: linear-gradient(to bottom right, color-mix(in oklab, var(--secondary) 60%, transparent), var(--background)) !important; }
.bg-gradient-to-br.from-secondary\/60.via-card.to-card { background-image: linear-gradient(to bottom right, color-mix(in oklab, var(--secondary) 60%, transparent), var(--card), var(--card)) !important; }

@keyframes fade-up { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes slow-zoom { from { transform: scale(1); } to { transform: scale(1.08); } }
.animate-fade-up { animation: fade-up 0.9s cubic-bezier(0.22,1,0.36,1) both; }
.animate-fade-in { animation: fade-in 1.2s ease-out both; }
.animate-slow-zoom { animation: slow-zoom 18s ease-out infinite alternate; }

/* Whitespace preserve for contact cards */
.whitespace-pre-line { white-space: pre-line; }

/* Site nav submenu */
.gz-submenu { display: none; position: absolute; left: 0; top: 100%; padding-top: 0.75rem; width: 20rem; z-index: 60; }
.gz-has-children:hover .gz-submenu, .gz-has-children:focus-within .gz-submenu { display: block; }
.gz-submenu-inner { background: var(--background); border-radius: 1rem; box-shadow: 0 20px 60px -20px color-mix(in oklab, var(--primary) 35%, transparent); border: 1px solid var(--border); padding: 0.5rem; overflow: hidden; }
.gz-submenu a { display: block; padding: 0.75rem 1rem; border-radius: 0.75rem; transition: all .25s; text-decoration: none; }
.gz-submenu a:hover { background: var(--secondary); color: var(--primary); }

/* Editor: prevent overlap */
.editor-styles-wrapper { background-color: var(--background); color: var(--foreground); }

/* Hero video */
.gz-hero-video { position: absolute; inset: 0; height: 100%; width: 100%; object-fit: cover; }

/* Mobile menu */
.gz-mobile-nav { display: none; }
.gz-mobile-nav.open { display: block; }

/* News grid breadcrumbs */
.breadcrumbs a { color: inherit; text-decoration: none; }
.breadcrumbs a:hover { color: var(--gold); }

/* WordPress block output should not add a second layout system around Lovable sections. */
.gz-front-page > *,
.gz-page-content > *,
.gz-page-content .wp-block-html,
.gz-front-page .wp-block-html {
  margin-block-start: 0;
  margin-block-end: 0;
}

.gz-page-content > .wp-block-group,
.gz-page-content > .wp-block-cover,
.gz-page-content > .wp-block-html {
  max-width: none;
}

.gz-article-content p {
  color: color-mix(in oklab, var(--foreground) 85%, transparent);
  font-size: 1.125rem;
  line-height: 1.75;
  margin: 0 0 1.5rem;
}

.gz-article-content a {
  color: var(--primary);
  font-weight: 600;
}

.gz-page-content input,
.gz-page-content textarea,
.gz-page-content button {
  font: inherit;
}