/* Version 1.5 — multilingual flags, cinematic Minden contact section and consent-based Google Maps */

:root {
  --v5-contact-glass: rgba(5, 15, 27, .78);
  --v5-contact-line: rgba(232, 185, 116, .28);
}

/* ─────────────────────────────────────────────────────────────
   Language selection with real flag assets
   ───────────────────────────────────────────────────────────── */
.language-card {
  grid-template-columns: 54px 34px minmax(0, 1fr) auto;
  text-align: left;
  isolation: isolate;
}
.language-card__flag {
  position: relative;
  display: grid;
  place-items: center;
  width: 54px;
  height: 42px;
  border-radius: 11px;
  background: rgba(255,255,255,.055);
  box-shadow: 0 10px 26px rgba(0,0,0,.26), inset 0 0 0 1px rgba(255,255,255,.1);
  overflow: hidden;
  transition: transform .45s cubic-bezier(.16,1,.3,1), box-shadow .35s ease;
}
.language-card__flag::after {
  content: "";
  position: absolute;
  inset: -45% -90%;
  transform: translateX(-70%) rotate(18deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.44), transparent);
  transition: transform .7s cubic-bezier(.16,1,.3,1);
}
.language-card__flag img {
  width: 42px;
  max-height: 28px;
  border-radius: 4px;
  object-fit: cover;
  box-shadow: 0 4px 12px rgba(0,0,0,.25);
}
.language-card:hover .language-card__flag {
  transform: translateY(-4px) rotate(-2deg) scale(1.06);
  box-shadow: 0 18px 36px rgba(0,0,0,.34), 0 0 0 1px rgba(230,182,111,.28);
}
.language-card:hover .language-card__flag::after { transform: translateX(90%) rotate(18deg); }
.language-card__code {
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  font-size: .71rem;
  letter-spacing: .15em;
  color: var(--gold-bright);
}

.language-flag {
  flex: 0 0 auto;
  width: 28px;
  height: 19px;
  border-radius: 4px;
  object-fit: cover;
  box-shadow: 0 4px 12px rgba(0,0,0,.25), 0 0 0 1px rgba(255,255,255,.12);
}
.language-switcher__current {
  min-height: 38px;
  padding: 6px 10px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 999px;
  background: rgba(255,255,255,.025);
  transition: border-color .3s ease, background .3s ease, transform .3s ease;
}
.language-switcher__current:hover {
  transform: translateY(-1px);
  border-color: rgba(230,182,111,.35);
  background: rgba(230,182,111,.06);
}
.language-switcher__current .language-flag { transition: transform .45s cubic-bezier(.16,1,.3,1); }
.language-switcher.is-open .language-switcher__current .language-flag { transform: rotateY(180deg); }
.language-switcher__menu {
  width: 218px;
  padding: 10px;
  border-radius: 18px;
  background: rgba(6,15,26,.96);
  box-shadow: 0 26px 75px rgba(0,0,0,.5), inset 0 0 0 1px rgba(255,255,255,.03);
  backdrop-filter: blur(24px);
}
.language-switcher__menu button {
  display: grid;
  grid-template-columns: 30px 30px 1fr;
  min-height: 48px;
  gap: 10px;
  padding: 9px 10px;
  transition: transform .25s ease, background .25s ease;
}
.language-switcher__menu button:hover {
  transform: translateX(4px);
  background: linear-gradient(90deg, rgba(230,182,111,.12), rgba(255,255,255,.025));
}
.language-switcher__menu button[aria-selected="true"] {
  background: rgba(230,182,111,.09);
  box-shadow: inset 2px 0 var(--gold-bright);
}
.language-switcher__menu button b {
  font-size: .68rem;
  letter-spacing: .13em;
  color: var(--gold-bright);
}
.language-switcher__menu button span { color: #c7d0db; }

/* ─────────────────────────────────────────────────────────────
   Cinematic Minden contact section
   ───────────────────────────────────────────────────────────── */
.contact.contact--minden {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(360px, .85fr) minmax(560px, 1.15fr);
  gap: clamp(34px, 5vw, 84px);
  min-height: 900px;
  padding-top: clamp(95px, 9vw, 150px);
  padding-bottom: clamp(95px, 9vw, 150px);
  color: #f7f3ea;
  background: #07101d;
  overflow: hidden;
}
.contact-city-bg {
  --city-x: 0px;
  --city-y: 0px;
  position: absolute;
  inset: 0;
  z-index: -3;
  overflow: hidden;
  background: #07101d;
}
.contact-city-bg__photo {
  position: absolute;
  inset: -4%;
  background-size: cover;
  background-position: center;
  transform: translate3d(var(--city-x), var(--city-y), 0) scale(1.07);
  will-change: transform, opacity;
  animation: cityKenBurns 22s ease-in-out infinite alternate;
}
.contact-city-bg__photo--weser {
  background-image: url('../img/minden-weser.webp');
  opacity: .66;
  filter: saturate(.78) contrast(1.08) brightness(.63);
  animation-name: cityKenBurns, cityCrossfadeOne;
  animation-duration: 22s, 18s;
  animation-timing-function: ease-in-out, ease-in-out;
  animation-iteration-count: infinite, infinite;
  animation-direction: alternate, normal;
}
.contact-city-bg__photo--skyline {
  background-image: url('../img/minden-skyline.webp');
  background-position: center 38%;
  opacity: 0;
  filter: saturate(.62) contrast(1.12) brightness(.52);
  animation-name: cityKenBurnsAlt, cityCrossfadeTwo;
  animation-duration: 24s, 18s;
  animation-timing-function: ease-in-out, ease-in-out;
  animation-iteration-count: infinite, infinite;
  animation-direction: alternate, normal;
}
.contact-city-bg__veil {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(900px circle at 73% 38%, rgba(231,184,113,.12), transparent 55%),
    linear-gradient(90deg, rgba(4,12,22,.96) 0%, rgba(4,12,22,.82) 36%, rgba(4,12,22,.5) 68%, rgba(4,12,22,.79) 100%),
    linear-gradient(180deg, rgba(4,12,22,.4), rgba(4,12,22,.92));
}
.contact-city-bg__lines {
  position: absolute;
  inset: 0;
  opacity: .28;
  background-image:
    linear-gradient(115deg, transparent 0 38%, rgba(230,182,111,.16) 38.1% 38.2%, transparent 38.3% 100%),
    radial-gradient(circle at 84% 18%, transparent 0 162px, rgba(230,182,111,.14) 163px, transparent 164px),
    radial-gradient(circle at 84% 18%, transparent 0 244px, rgba(230,182,111,.08) 245px, transparent 246px);
  animation: contactLinesDrift 13s ease-in-out infinite alternate;
}
.contact-glass,
.map-card--google {
  position: relative;
  z-index: 2;
}
.contact-glass {
  align-self: center;
  padding: clamp(30px, 4vw, 58px);
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 28px;
  background:
    radial-gradient(420px circle at var(--contact-spot-x, 14%) var(--contact-spot-y, 16%), rgba(230,182,111,.1), transparent 48%),
    linear-gradient(145deg, rgba(7,20,34,.89), rgba(5,14,25,.7));
  box-shadow: 0 36px 100px rgba(0,0,0,.42);
  backdrop-filter: blur(20px) saturate(1.1);
  overflow: hidden;
}
.contact-glass::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(230,182,111,.58), transparent 22%, transparent 76%, rgba(255,255,255,.18));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}
.location-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 24px;
  padding: 8px 13px;
  border: 1px solid rgba(230,182,111,.28);
  border-radius: 999px;
  background: rgba(230,182,111,.07);
  color: #e8c18b;
  font-size: .67rem;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.location-badge span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--gold-bright);
  box-shadow: 0 0 0 6px rgba(230,182,111,.09), 0 0 18px rgba(230,182,111,.6);
  animation: locationDot 2.2s ease-in-out infinite;
}
.contact--minden .contact__copy h2 {
  color: #fffaf1;
  text-shadow: 0 16px 45px rgba(0,0,0,.42);
}
.contact--minden .contact__copy > p:not(.eyebrow) {
  color: #c8d1dc;
  max-width: 610px;
  font-size: 1rem;
}
.contact--minden .contact-list {
  border-color: rgba(255,255,255,.13);
}
.contact--minden .contact-list > * {
  position: relative;
  grid-template-columns: 42px 1fr auto;
  align-items: center;
  border-color: rgba(255,255,255,.105);
  color: #f7f3ea;
  overflow: hidden;
}
.contact--minden .contact-list > *::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-101%);
  background: linear-gradient(90deg, rgba(230,182,111,.1), transparent 68%);
  transition: transform .5s cubic-bezier(.16,1,.3,1);
  pointer-events: none;
}
.contact--minden .contact-list > *:hover::after { transform: translateX(0); }
.contact--minden .contact-list > * > span { color: #e2b570; }
.contact--minden .contact-list small { color: #91a0af; }
.contact--minden .contact-list strong { color: #f4f5f7; }
.contact--minden .contact-list i {
  position: relative;
  z-index: 1;
  color: var(--gold-bright);
  font-style: normal;
  transition: transform .35s ease;
}
.contact--minden .contact-list > *:hover i { transform: translate(4px,-3px); }

/* Real Google Maps card, loaded only after consent */
.map-card.map-card--google {
  align-self: center;
  min-height: 690px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 30px;
  background: rgba(5,14,25,.72);
  box-shadow: 0 38px 110px rgba(0,0,0,.5), 0 0 0 1px rgba(230,182,111,.04) inset;
  backdrop-filter: blur(18px);
  overflow: hidden;
}
.map-card--google::before {
  content: "";
  position: absolute;
  inset: -2px;
  z-index: 4;
  border-radius: 31px;
  padding: 1px;
  background: conic-gradient(from var(--map-angle,0deg), transparent 0 38%, rgba(230,182,111,.8) 44%, transparent 50% 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  animation: mapBorderSpin 10s linear infinite;
}
.map-frame {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(145deg, #0d2034, #07111f);
  background-size: 42px 42px, 42px 42px, auto;
}
.map-frame iframe {
  width: 100%;
  height: 100%;
  border: 0;
  opacity: 0;
  filter: saturate(.86) contrast(1.02);
  transform: scale(1.025);
  transition: opacity .7s ease, transform 1.2s cubic-bezier(.16,1,.3,1);
}
.map-card--google.is-loaded .map-frame iframe {
  opacity: 1;
  transform: scale(1);
}
.map-consent {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: clamp(34px, 6vw, 76px);
  text-align: center;
  color: #f5f1e8;
  background:
    radial-gradient(500px circle at 50% 36%, rgba(230,182,111,.13), transparent 58%),
    linear-gradient(145deg, rgba(13,35,57,.97), rgba(4,13,24,.96));
  transition: opacity .55s ease, visibility .55s ease, transform .8s cubic-bezier(.16,1,.3,1);
}
.map-consent::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .15;
  background-image: linear-gradient(rgba(230,182,111,.18) 1px, transparent 1px), linear-gradient(90deg, rgba(230,182,111,.18) 1px, transparent 1px);
  background-size: 48px 48px;
  transform: perspective(700px) rotateX(58deg) scale(1.7) translateY(12%);
  transform-origin: center bottom;
  animation: mapGridMove 18s linear infinite;
}
.map-consent > * { position: relative; z-index: 1; }
.map-card--google.is-loaded .map-consent {
  opacity: 0;
  visibility: hidden;
  transform: scale(1.04);
  pointer-events: none;
}
.map-consent h3 {
  max-width: 560px;
  margin: 8px 0 15px;
  font-size: clamp(2.1rem, 3.7vw, 4rem);
  text-wrap: balance;
}
.map-consent > p:not(.eyebrow) {
  max-width: 570px;
  color: #aeb9c5;
}
.map-consent .button { margin-top: 20px; }
.map-consent > a {
  margin-top: 18px;
  color: #d6b078;
  font-size: .7rem;
  font-weight: 750;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.map-consent__pin {
  position: relative;
  width: 72px;
  height: 72px;
  margin-bottom: 20px;
  border: 1px solid rgba(230,182,111,.45);
  border-radius: 50%;
  background: rgba(230,182,111,.08);
  box-shadow: 0 0 0 15px rgba(230,182,111,.035), 0 0 55px rgba(230,182,111,.16);
  animation: mapPinFloat 3s ease-in-out infinite;
}
.map-consent__pin::before {
  content: "";
  position: absolute;
  left: 24px;
  top: 18px;
  width: 22px;
  height: 28px;
  border: 2px solid var(--gold-bright);
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
}
.map-consent__pin span {
  position: absolute;
  left: 32px;
  top: 25px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--gold-bright);
}
.map-card--google .map-card__panel {
  z-index: 5;
  left: 22px;
  right: 22px;
  bottom: 22px;
  padding: 24px 26px;
  border-color: rgba(255,255,255,.18);
  background: rgba(4,13,24,.86);
  box-shadow: 0 22px 60px rgba(0,0,0,.34);
  transform: translateY(130%);
  transition: transform .75s cubic-bezier(.16,1,.3,1);
}
.map-card--google.is-loaded .map-card__panel { transform: translateY(0); }
.map-card__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 18px;
}
.map-reset {
  padding: 10px 0;
  border: 0;
  background: none;
  color: #aeb9c5;
  cursor: pointer;
  font-size: .68rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.map-reset:hover { color: #fff; }

.site-footer__credits {
  max-width: 1180px;
  margin: 9px auto 0;
  color: #6f7c89;
  font-size: .62rem;
  line-height: 1.55;
  text-align: center;
}
.site-footer__credits a { color: #a88a61; text-decoration: underline; text-underline-offset: 3px; }

@keyframes cityCrossfadeOne {
  0%, 42% { opacity: .66; }
  52%, 91% { opacity: 0; }
  100% { opacity: .66; }
}
@keyframes cityCrossfadeTwo {
  0%, 42% { opacity: 0; }
  52%, 91% { opacity: .58; }
  100% { opacity: 0; }
}
@keyframes cityKenBurns { from { transform: translate3d(var(--city-x),var(--city-y),0) scale(1.05); } to { transform: translate3d(calc(var(--city-x) - 1.5%),calc(var(--city-y) - 1%),0) scale(1.13); } }
@keyframes cityKenBurnsAlt { from { transform: translate3d(calc(var(--city-x) - 1%),var(--city-y),0) scale(1.08); } to { transform: translate3d(calc(var(--city-x) + 1%),calc(var(--city-y) - 1.5%),0) scale(1.15); } }
@keyframes contactLinesDrift { from { transform: translate3d(-8px,0,0); } to { transform: translate3d(12px,-7px,0); } }
@keyframes locationDot { 0%,100% { transform: scale(.85); opacity: .75; } 50% { transform: scale(1.15); opacity: 1; } }
@keyframes mapBorderSpin { to { --map-angle: 360deg; } }
@keyframes mapGridMove { to { background-position: 48px 48px, 48px 48px; } }
@keyframes mapPinFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

@property --map-angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}

@media (max-width: 1100px) {
  .contact.contact--minden {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .contact-glass { max-width: 820px; }
  .map-card.map-card--google { min-height: 650px; }
  .contact-city-bg__veil {
    background: linear-gradient(180deg, rgba(4,12,22,.93), rgba(4,12,22,.63) 55%, rgba(4,12,22,.9));
  }
}
@media (max-width: 720px) {
  .language-card { grid-template-columns: 48px 1fr auto; gap: 12px; }
  .language-card__flag { width: 48px; height: 38px; }
  .language-card__code { display: none; }
  .language-switcher__current { padding: 6px 8px; }
  .language-switcher__current #currentLanguage { display: none; }
  .language-switcher__menu { right: -16px; }
  .contact.contact--minden {
    padding-left: 18px;
    padding-right: 18px;
    padding-top: 78px;
    padding-bottom: 78px;
    gap: 26px;
  }
  .contact-glass { padding: 26px 20px; border-radius: 22px; }
  .contact--minden .contact-list > * { grid-template-columns: 34px minmax(0,1fr) auto; gap: 10px; }
  .contact--minden .contact-list strong { font-size: .84rem; }
  .map-card.map-card--google { min-height: 610px; border-radius: 22px; }
  .map-consent { padding: 34px 22px 150px; }
  .map-consent h3 { font-size: 2.15rem; }
  .map-card--google .map-card__panel { left: 12px; right: 12px; bottom: 12px; padding: 20px; }
  .map-card--google .map-card__panel h3 { font-size: 1.6rem; }
  .map-card__actions .button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .contact-city-bg__photo,
  .contact-city-bg__lines,
  .location-badge span,
  .map-card--google::before,
  .map-consent::before,
  .map-consent__pin { animation: none !important; }
  .contact-city-bg__photo--weser { opacity: .62; }
  .contact-city-bg__photo--skyline { opacity: 0; }
}

.mini-flags {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 10px;
}
.mini-flags img {
  width: 28px;
  height: 19px;
  border-radius: 4px;
  object-fit: cover;
  box-shadow: 0 5px 15px rgba(0,0,0,.22), 0 0 0 1px rgba(255,255,255,.1);
  transition: transform .35s cubic-bezier(.16,1,.3,1), filter .3s ease;
}
.mini-flags img:hover {
  transform: translateY(-4px) rotate(-2deg) scale(1.08);
  filter: brightness(1.08);
}
.map-frame { transition: transform .55s cubic-bezier(.16,1,.3,1); transform-origin: 50% 50%; }