/* ============ CONSENT BAR ============ */
.consent-bar{
  position:fixed;left:14px;right:14px;bottom:14px;z-index:80;
  max-width:760px;margin:0 auto;
  background:#1A0F08;color:#FFF7EC;
  border:2px solid #FF6A1F;
  border-radius:14px;
  box-shadow:0 18px 48px rgba(0,0,0,.45);
  font-family:"Manrope",system-ui,sans-serif;
  transform:translateY(140%);
  opacity:0;
  transition:transform .35s cubic-bezier(.2,.7,.2,1), opacity .25s;
  pointer-events:none;
}
.consent-bar.show{
  transform:translateY(0);
  opacity:1;
  pointer-events:auto;
}
.consent-inner{
  display:flex;align-items:center;gap:18px;
  padding:18px 22px;
  flex-wrap:wrap;
}
.consent-text{flex:1 1 280px;min-width:240px}
.consent-text strong{
  display:block;
  font-family:"Anton",sans-serif;
  font-size:18px;letter-spacing:.04em;text-transform:uppercase;
  color:#FF6A1F;margin-bottom:4px;
}
.consent-text p{
  margin:0;font-size:14px;line-height:1.45;
  color:rgba(255,247,236,.85);
}
.consent-actions{
  display:flex;gap:8px;flex-shrink:0;
  flex-wrap:wrap;
}
.consent-btn{
  font-family:"Manrope",sans-serif;
  font-weight:800;font-size:13px;
  letter-spacing:.04em;text-transform:uppercase;
  padding:12px 18px;border-radius:999px;
  border:2px solid transparent;
  cursor:pointer;
  transition:background .2s, color .2s, transform .15s;
  white-space:nowrap;
}
.consent-accept{
  background:#FF6A1F;color:#1A0F08;
  border-color:#FF6A1F;
}
.consent-accept:hover{background:#FF8A3D;border-color:#FF8A3D;transform:translateY(-1px)}
.consent-deny{
  background:transparent;color:#FFF7EC;
  border-color:rgba(255,247,236,.3);
}
.consent-deny:hover{border-color:#FFF7EC;color:#FFF7EC}

@media (max-width:560px){
  .consent-bar{left:10px;right:10px;bottom:80px}  /* leave space for mobile sticky CTA */
  .consent-inner{padding:14px 16px;gap:12px}
  .consent-text{flex:1 1 100%;min-width:0}        /* drop the rigid 240px floor */
  .consent-text strong{font-size:16px}
  .consent-text p{font-size:13px}
  .consent-actions{width:100%;gap:8px}
  .consent-btn{flex:1;text-align:center;padding:12px 10px;font-size:12px;white-space:normal}
}

/* Push the bar above the mobile-sticky CTA when both shown */
@media (max-width:780px){
  .consent-bar{bottom:80px}
}

/* Footer "Cookies" link */
#consent-reopen{cursor:pointer}

/* =================================================================
   MOBILE POLISH — fixes horizontal overflow + footer link wrapping
   ================================================================= */

/* Safety net: never let the page scroll horizontally on phones */
html, body{ max-width:100vw; overflow-x:hidden; }

/* Footer links must wrap — was forcing onto a single row, pushing
   the "Cookies" / "FAQ" buttons off the right edge on Samsung */
.footer-links{flex-wrap:wrap;row-gap:10px}

@media (max-width:640px){
  .footer-inner{
    flex-direction:column;
    align-items:flex-start;
    gap:20px;
  }
  .footer-brand{flex-wrap:wrap;gap:14px}
  .footer-logo-lucky{margin-left:0}   /* prevents tiny push-overflow */
  .footer-links{
    width:100%;
    gap:14px 18px;
    font-size:14px;
  }
  .footer-links a{padding:4px 0}     /* bigger tap targets */
}

/* Hero meta band — make sure 2-up doesn't squish on very narrow */
@media (max-width:380px){
  .hero-meta{grid-template-columns:1fr;gap:18px}
}

/* Nav on mobile: logo left, text middle, Lucky logo right, NO CTA */
@media (max-width:780px){
  .nav-cta{display:none}                          /* mobile sticky CTA covers this */
  .nav-inner{height:auto;min-height:60px;padding:10px 0}
  .brand{flex:1 1 100%;gap:10px}
  .brand-name{
    display:block;
    font-size:clamp(15px, 4.8vw, 22px);            /* scale up with viewport */
    letter-spacing:.04em;
    line-height:1.0;
    flex:1 1 auto;
    min-width:0;
    max-width:none;
    text-wrap:balance;
    text-align:center;                             /* center between the two logos */
  }
  .brand-logo-lucky{
    margin-left:auto;                             /* push to far right */
  }
}
@media (max-width:380px){
  .brand-name{font-size:clamp(14px, 4.4vw, 18px)}
}

/* Match cards — ensure no rogue width on small phones */
@media (max-width:560px){
  .match-card{padding:24px 20px;min-height:0}
  .match-top{flex-wrap:wrap;gap:8px}
  .match-teams{gap:12px}
  .team{font-size:22px}
  .match-foot{flex-wrap:wrap;gap:8px}
}

/* Location card — chunky shadow can poke off-screen on very small */
@media (max-width:560px){
  .loc-card{
    padding:28px 22px;
    box-shadow:6px 6px 0 var(--warm-ink, #1A0F08);
  }
  .loc-row{grid-template-columns:96px 1fr;gap:12px;padding:14px 0}
  .loc-row .k{font-size:11px}
  .loc-row .v{font-size:15px;word-break:break-word}
}

/* FAQ — keep plus icon from being clipped */
@media (max-width:560px){
  .faq-q{padding:24px 0;gap:14px;font-size:18px}
  .faq-q .plus{width:34px;height:34px;font-size:18px}
}

/* Team band — long unbreakable Dutch words can push width */
.team-band-title{overflow-wrap:break-word;hyphens:auto}

/* Anything inside .wrap should never break out horizontally */
.wrap{overflow-x:visible}
.wrap > *{max-width:100%}