:root {
      --neutral: #BFB9B9; --neutral-dark: #8A8585; --dark: #222222; --dark-hover: #333333; --dark-green: #4E8020; --dark-green-hover: #3a6018; --gold: #DDB945; --gold-light: #eed783; --orange: #E87928; --orange-dark: #d05e11; --text-dark: #2B2B2B; --text-light: #fafafa; --bg-light: #fafafa; --bg-light-contrast: #f1f1f1; --container-width: 1200px; --container-full: 100%; --transition: 0.3s ease; --section-spacing: 5rem; --card-shadow: 0 8px 20px rgba(0,0,0,0.08);
    }
    *, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
    body { font-family:'League Spartan',sans-serif; background:var(--bg-light); color:var(--text-dark); line-height:1.6; }
    img { display:block; max-width:100%; height:auto; }
    ul { list-style:none; }
    a { text-decoration:none; color:inherit; }
    .container { max-width:var(--container-width); margin:auto; padding:0 1.5rem; }
    header { background:var(--dark); padding:1rem 0; box-shadow:0 2px 8px rgba(0,0,0,0.2); position:sticky; top:0; z-index:100; }
    nav.container { display:flex; align-items:center; justify-content:space-between; }
    .logo { display:flex; align-items:center; gap:0.5rem; font-size:1.75rem; color:var(--gold); font-weight:700; }
    .logo img { width:60%; margin-left:-10px; }
    nav .nav-links { display:flex; gap:2rem; }
    nav a { color:var(--bg-light); font-weight:500; transition:color var(--transition); position:relative; padding:0.25rem 0; }
    nav a:hover { color:var(--gold); }
    nav a::after { content:''; position:absolute; width:0; height:2px; background:var(--gold); bottom:-2px; left:0; transition:width var(--transition); }
    nav a:hover::after { width:0%; display: none; }
    .mobile-menu-btn { display:none; color:var(--gold); font-size:1.5rem; cursor:pointer; border: none; background: none;box-shadow: none;}
    .main-content { padding:4rem 0; min-height:calc(100vh - 80px - 300px); }
    .event-summary { display:flex; align-items:flex-start; gap:2rem; margin-bottom:3rem; padding-bottom:2rem; }
    .event-image { flex:1; border-radius:12px;  box-shadow:var(--card-shadow); }
    .event-details { flex:2; }
    .event-details h1 { font-size:2.5rem; color:var(--dark-green); margin-bottom:0.5rem; }
    .event-artist { font-style:italic; color:var(--neutral-dark); margin-bottom:1rem; font-size:1.2rem; }
    .event-info { display:flex; flex-wrap:wrap; gap:1.5rem; margin-bottom:1.5rem; }
    .event-info-item { display:flex; align-items:center; gap:0.5rem; }
    .event-info-item i { color:var(--orange); font-size:1.2rem; }
    .event-description { margin-bottom:1.5rem; font-size:1.05rem; line-height:1.7; }
    .checkout-btn { background:var(--orange); color:white; border:none; padding:1rem 2rem; border-radius:8px; font-weight:600; font-size:0.95rem; cursor:pointer; display:inline-flex; align-items: center; height: 45px; transition:all .3s ease; }
    .checkout-btn:hover { background:var(--orange-dark); transform:translateY(-3px); box-shadow:0 5px 15px rgba(232,121,40,.3); }
    footer { padding:4rem 0 2rem; background:var(--dark); color:var(--text-light); }
    .footer-content { display:flex; flex-wrap:wrap; justify-content:space-between; margin-bottom:3rem; }
    .footer-links a{ padding:0 10px; }
    .contact-info p{ display:flex; align-items:center; gap:0.75rem; margin-bottom:1rem; color:rgba(255,255,255,0.8); }
    .social-links{ display:flex; gap:1rem; }
    .social-links a{ background:rgba(255,255,255,0.1); color:#fff; width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; transition:all .3s ease; }
    .social-links a:hover{ background:var(--orange); color:#fff; transform:translateY(-3px); }
    .footer-bottom{ display:flex; justify-content:space-between; padding-top:2rem; text-align:center; border-top:1px solid rgba(255,255,255,0.1); color:rgba(255,255,255,0.7); font-size:0.9rem; }
    .payment-security{ border-top:1px solid rgba(255,255,255,0.1); padding-top:1.5rem; margin:1.5rem 0; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:1.5rem; }
    .payment-logos{ display:flex; align-items:center; gap:12px; color:rgba(255,255,255,0.8); }
    .payment-logos img{ height:30px; width:auto; object-fit:contain; background:#fff; padding:3px; border-radius:4px; transition:transform .3s ease; }
    .payment-logos img:hover{ transform:translateY(-3px); }
    .security-badges{ display:flex; gap:16px; flex-wrap:wrap; }
    .ssl-badge, .secure-payment{ display:flex; align-items:center; gap:8px; color:rgba(255,255,255,0.8); background-color:rgba(255,255,255,0.05); padding:6px 12px; border-radius:6px; font-size:0.85rem; }
    .ssl-badge i, .secure-payment i{ color:var(--gold); font-size:1rem; }
    .logo.head-logo{ width:27%; }
    .skip-link { position:absolute; top:-40px; left:6px; background:#000; color:#fff; padding:8px; text-decoration:none; z-index:100; }
    .skip-link:focus { top:6px; }
    .about-hero { padding:6rem 0 6rem; background: linear-gradient(rgba(34,34,34,0.9), rgba(34,34,34,0.7)), url('img/komuniteeventshero.jpeg'); background-size:cover; background-position:center; color:var(--text-light); text-align:center; margin-bottom:3rem; position: relative; }
    .hero-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(rgba(34,34,34,0.6), rgba(34,34,34,0.4)); z-index: 1; }
    .about-hero .container { position: relative; z-index: 2; }
    .about-hero h1 { font-size:3.5rem; color:var(--gold); margin-bottom:1.5rem; }
    .about-hero p { max-width:800px; margin:0 auto; font-size:1.2rem; line-height:1.8; }
    .breadcrumb-nav { background:var(--bg-light-contrast); padding:1rem 0; }
    .breadcrumb-nav ol { display:flex; gap:0.5rem; align-items:center; }
    .events-filter-bar { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; margin-bottom:2rem; padding-bottom:1rem; border-bottom:1px solid var(--bg-light-contrast); }
    .filter-tabs { display:flex; background-color:var(--bg-light-contrast); border-radius:30px; overflow:hidden; }
    .filter-tab { padding:0.75rem 1.5rem; font-weight:500; cursor:pointer; transition:all .3s ease; border:none; background:transparent; font-family:'League Spartan',sans-serif; color: #000;}
    .filter-tab.active { background-color:var(--dark); color:var(--text-light); }
    .search-box { display:flex; align-items:center; background:var(--bg-light-contrast); border-radius:30px; padding:0.5rem 1rem; width:300px; }
    .search-box input { border:none; background:transparent; padding:0.25rem 0.5rem; width:100%; font-family:'League Spartan',sans-serif; }
    .search-box input:focus { outline:none; }
	.hero-text{    max-width: 800px;margin: 0 auto;font-size: 1.2rem;line-height: 1.8;}
    .search-box i { color:var(--neutral-dark); }
    .events-list { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-bottom:3rem; }
    .event-card { display:flex; flex-direction:column; background:#fff; border-radius:10px; overflow:hidden; box-shadow:var(--card-shadow); transition:transform .3s ease, box-shadow .3s ease; height:100%; }
    .event-card:hover { transform: translateY(-5px); box-shadow:0 12px 25px rgba(0,0,0,0.1); }
    .event-content { flex:1; padding:1.25rem 2rem; display:flex; flex-direction:column; }
    .event-category { display:inline-block; background-color:var(--dark-green); color:#fff; font-size:0.85rem; padding:0.25rem 0.75rem; border-radius:20px; margin-bottom:0.75rem; }
    .event-content h3 { font-size:1.25rem; margin-bottom:0.5rem; font-weight:600; }
    .event-content .event-artist { color:var(--neutral-dark); font-style:italic; margin-bottom:0.75rem; font-size:0.9rem; }
    .events-details { display:grid; grid-template-columns:1fr 1fr 1fr; gap:0.75rem; margin-bottom:1rem; font-size:0.85rem; }
    .event-detail { display:flex; align-items:center; gap:0.5rem; color:var(--neutral-dark); }
    .event-detail i { color:var(--gold); }
    .event-actions { margin-top:auto; display:flex; justify-content:center; }
    .event-actions .btn { padding:0.6rem 1.25rem; border-radius:10px; font-weight:500; transition:all .3s ease; text-align:center; width:100%; cursor:pointer; background-color: #222222;}
    .btn-coming-soon { background-color:var(--orange); color:#fff; }
    .pagination { display:flex; justify-content:center; gap:0.5rem; margin:3rem 0; }
    .pagination-item { width:40px; height:40px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--bg-light-contrast); cursor:pointer; transition:all .3s ease; }
    .pagination-item.active { background-color:var(--orange); color:#fff; }
    .pagination-item:hover:not(.active){ background-color:var(--neutral); color:#fff; }
    footer { padding:4rem 0 2rem; background:var(--dark); color:var(--text-light); }
    .no-logo-hover::after{ content:none; }
    .footer-content { display:flex; flex-wrap:wrap; justify-content:space-between; margin-bottom:3rem; }
    .footer-links a{ padding:0 10px; }
    .social-links{ display:flex; gap:1rem; }
    .social-links a{ background:rgba(255,255,255,0.1); color:#fff; width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; transition:all .3s ease; }
    .social-links a:hover{ background:var(--orange); color:#fff; transform:translateY(-3px); }
    .contact-info p{ display:flex; align-items:center; gap:0.75rem; margin-bottom:1rem; color:rgba(255,255,255,0.8); }
    .footer-bottom{ display:flex; justify-content:space-between; padding-top:2rem; text-align:center; border-top:1px solid rgba(255,255,255,0.1); color:rgba(255,255,255,0.7); font-size:0.9rem; }
    .filter-status{ margin-bottom:1.5rem; font-size:1.1rem; color:var(--neutral-dark); }
    .filter-status span{ font-weight:600; color:var(--text-dark); }
    .no-events{ text-align:center; padding:3rem; background:var(--bg-light-contrast); border-radius:10px; margin:2rem 0; }
    .no-events i{ font-size:3rem; color:var(--neutral); margin-bottom:1rem; }
    .no-events h3{ font-size:1.5rem; margin-bottom:1rem; }
    .no-events p{ max-width:500px; margin:0 auto; color:var(--neutral-dark); }
    .payment-security{ border-top:1px solid rgba(255,255,255,0.1); padding-top:1.5rem; margin:1.5rem 0; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:1.5rem; }
    .payment-logos{ display:flex; align-items:center; gap:12px; color:rgba(255,255,255,0.8); }
    .payment-logos img{ height:30px; width:auto; object-fit:contain; background:#fff; padding:3px; border-radius:4px; transition:transform .3s ease; }
    .payment-logos img:hover{ transform:translateY(-3px); }
    .security-badges{ display:flex; gap:16px; flex-wrap:wrap; }
    .ssl-badge, .secure-payment{ display:flex; align-items:center; gap:8px; color:rgba(255,255,255,0.8); background-color:rgba(255,255,255,0.05); padding:6px 12px; border-radius:6px; font-size:0.85rem; }
    .ssl-badge i, .secure-payment i{ color:var(--gold); font-size:1rem; }
    @media (max-width:768px){.filter-tabs{ justify-content: center; } .mobile-menu-btn{ display:block; } nav .nav-links{ display:none; position:absolute; top:100%; left:0; right:0; background:var(--dark); padding:1rem; flex-direction:column; text-align:center; gap:1rem; box-shadow:0 4px 8px rgba(0,0,0,0.2); z-index:999; } nav .nav-links.active{ display:flex !important; } nav a:hover::after{ width:0; } .events-list{ grid-template-columns:1fr; } .events-filter-bar{ flex-direction:column; align-items:stretch; } .search-box{ width:100%; } .event-actions{ flex-direction:column; gap:1rem; align-items:stretch; } .footer-bottom{ flex-direction:column; gap:1rem; } .about-hero h1{ font-size:2.5rem; } }
    @media (max-width:992px){ .event-summary{ flex-direction:column; } .event-image{ width:100%; } }
    @media (max-width:768px){.logo img{width: 100%} .mobile-menu-btn{ display:block; } nav .nav-links{ display:none; position:absolute; top:100%; left:0; right:0; background:var(--dark); padding:1rem; flex-direction:column; text-align:center; gap:1rem; box-shadow:0 4px 8px rgba(0,0,0,0.2); z-index:999; } nav .nav-links.active{ display:flex !important; } nav a:hover::after{ width:0; } .footer-bottom{ flex-direction:column; gap:1rem; } }


    
/* === COOKIE CONSENT STYLES === */

/* Cookie Consent Banner */
.cookie-consent {
  position: fixed;
  bottom: -200px;
  left: 0;
  right: 0;
  background: var(--dark);
  backdrop-filter: blur(10px);
  padding: 1.5rem;
  z-index: 9999;
  transition: bottom 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.3);
}

.cookie-consent.show {
  bottom: 0;
}

.cookie-content {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
}

.cookie-icon {
  font-size: 2rem;
  color: #ffffff;
  animation: bounce 2s infinite;
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-10px);
  }
  60% {
    transform: translateY(-5px);
  }
}

.cookie-text {
  flex: 1;
  min-width: 300px;
}

.cookie-text h3 {
  color: #ffffffcf;
  font-size: 1.3rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}

.cookie-text p {
  color: #cccccc;
  font-size: 0.95rem;
  line-height: 1.5;
  margin: 0;
}

.cookie-actions {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

.btn-cookie {
  padding: 0.75rem 1.5rem;
  border: none;
  border-radius: 25px;
  font-weight: 600;
  font-size: 0.9rem;
  cursor: pointer;
  transition: all 0.3s ease;
  font-family: inherit;
  white-space: nowrap;
}

.btn-reject {
  background: #666666;
  color: #ffffff;
  border: 2px solid #666666;
}

.btn-reject:hover {
  background: #555555;
  color: #ffffff;
  border-color: #555555;
  transform: translateY(-2px);
}

.btn-details {
  background: #333333;
  color: #ffffff;
  border: 2px solid #333333;
}

.btn-details:hover {
  transform: translateY(-2px);
}

.btn-accept {
  background: #666666;
  color: #fff;
  border: 2px solid #666666;
}

.btn-accept:hover {
  transform: translateY(-2px);
}

.btn-save {
  background: #000000;
  color: #ffffff;
  border: 2px solid #000000;
}

.btn-save:hover {
  background: #333333;
  border-color: #333333;
  transform: translateY(-2px);
}

/* Cookie Settings Modal */
.cookie-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
}

.cookie-modal.open {
  opacity: 1;
  visibility: visible;
}

.cookie-modal-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(5px);
}

.cookie-modal-content {
  position: relative;
  background: #ffffff;
  border-radius: 16px;
  max-width: 600px;
  width: 90%;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  transform: scale(0.8);
  transition: transform 0.3s ease;
  border: 2px solid #000000;
}

.cookie-modal.open .cookie-modal-content {
  transform: scale(1);
}

.cookie-modal-header {
  padding: 2rem 2rem 1rem;
  border-bottom: 2px solid #000000;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.cookie-modal-header h2 {
  color: #000000;
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0;
}

.cookie-modal-close {
  background: none;
  border: none;
  font-size: 1.5rem;
  color: #666666;
  cursor: pointer;
  padding: 0.5rem;
  border-radius: 50%;
  transition: all 0.3s ease;
}



.cookie-modal-body {
  padding: 2rem;
}

.cookie-modal-body > p {
  color: #000000;
  margin-bottom: 2rem;
  line-height: 1.6;
}

.cookie-category {
  margin-bottom: 2rem;
  padding: 1.5rem;
  background: #f8f8f8;
  border-radius: 12px;
  border-left: 4px solid #000000;
}

.cookie-category-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}

.cookie-category h3 {
  color: #000000;
  font-size: 1.1rem;
  font-weight: 600;
  margin: 0;
}

.cookie-toggle {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 24px;
}

.cookie-toggle.disabled {
  background: #000000;
  color: #ffffff;
  padding: 0.25rem 0.75rem;
  border-radius: 12px;
  font-size: 0.8rem;
  font-weight: 600;
}

.cookie-toggle input[type="checkbox"] {
  opacity: 0;
  width: 0;
  height: 0;
}

.toggle-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #cccccc;
  transition: 0.3s;
  border-radius: 24px;
}

.toggle-slider:before {
  position: absolute;
  content: "";
  height: 18px;
  width: 18px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  transition: 0.3s;
  border-radius: 50%;
}

input:checked + .toggle-slider {
  background-color: #000000;
}

input:checked + .toggle-slider:before {
  transform: translateX(26px);
}

.cookie-category p {
  color: #666666;
  font-size: 0.9rem;
  margin: 0;
  line-height: 1.5;
}

.cookie-modal-footer {
  padding: 1rem 2rem 2rem;
  display: flex;
  gap: 1rem;
  justify-content: flex-end;
  flex-wrap: wrap;
}

/* Responsive Design for Cookie Components */
@media (max-width: 768px) {
  .cookie-content {
    flex-direction: column;
    align-items: stretch;
    text-align: center;
  }
  
  .cookie-actions {
    justify-content: center;
  }
  
  .btn-cookie {
    flex: 1;
    min-width: 120px;
  }
  
  .cookie-modal-content {
    width: 95%;
    margin: 1rem;
  }
  
  .cookie-modal-header {
    padding: 1.5rem 1.5rem 1rem;
  }
  
  .cookie-modal-body {
    padding: 1.5rem;
  }
  
  .cookie-modal-footer {
    padding: 1rem 1.5rem 1.5rem;
    flex-direction: column;
  }
  
  .cookie-modal-footer .btn-cookie {
    width: 100%;
  }
  
  .cookie-category-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
  }
}

@media (max-width: 480px) {
  .cookie-consent {
    padding: 1rem;
  }
  
  .cookie-text h3 {
    font-size: 1.1rem;
  }
  
  .cookie-text p {
    font-size: 0.85rem;
  }
  
  .btn-cookie {
    padding: 0.6rem 1.2rem;
    font-size: 0.85rem;
  }
}

/* Animation for cookie consent */
@keyframes slideUp {
  from {
    transform: translateY(100%);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.cookie-consent.show {
  animation: slideUp 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Focus styles for accessibility */


.cookie-toggle input[type="checkbox"]:focus + .toggle-slider {
  box-shadow: 0 0 0 2px #000000;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
  .cookie-consent {
    background: black;
    border-top-color: white;
  }
  
  .cookie-text h3 {
    color: white;
  }
  
  .cookie-text p {
    color: white;
  }
  
  .btn-cookie {
    border-width: 3px;
  }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
  .cookie-consent,
  .cookie-modal,
  .cookie-modal-content,
  .btn-cookie,
  .toggle-slider,
  .toggle-slider:before {
    transition: none;
  }
  
  .cookie-icon {
    animation: none;
  }
}

/* Print styles - hide cookie components */
@media print {
  .cookie-consent,
  .cookie-modal {
    display: none !important;
  }
}