/* Release 4 — targeted fixes on top of approved Release 3.
 * Loaded after style.css so it only overrides the specific points requested.
 * 1 Standort/legal split · 2 contact-card logos · 3 brand union · 4 VALSET artwork
 * 5 compact Telegram CTA · 6 mobile drawer motion · 7 gloves in light theme
 */

/* 1 — Standort block: address only, legal facts live on the Impressum page */
.address-strip .address-legal{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.address-strip .address-legal .micro{color:var(--ink-3)}

/* 2 — brand logos inside the two contact cards */
.contact-head{display:flex;align-items:center;gap:14px;margin-bottom:4px}
.contact-head h3{margin:0}
.contact-logo{width:54px;height:54px;object-fit:contain;flex:0 0 auto;background:#fff;padding:6px;border:1px solid var(--line)}
.contact-card.b .contact-logo{background:#fff;border-color:#f4cc4655;padding:0;object-fit:cover;object-position:50% 7%}
@media(max-width:540px){.contact-logo{width:44px;height:44px}}

/* 3 — AK-LOEWEN × VALSET union composition (cinematic impact) */
.brand-union{--rx:0deg;--ry:0deg}
.brand-union .brand-union-stage{perspective:1000px;transform-style:preserve-3d;
  transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform .5s cubic-bezier(.16,1,.3,1)}
.brand-union .union-glow{position:absolute;inset:-16%;border-radius:50%;opacity:0;
  background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--accent) 55%,transparent) 0%,#0000 62%);
  transition:opacity .9s ease}
.brand-union.is-impact .union-glow{opacity:.72;animation:ak-union-breathe 4.2s ease-in-out .35s infinite}
.brand-union .union-ring{position:absolute;width:52%;height:52%;border-radius:50%;
  border:2px solid color-mix(in srgb,var(--accent) 75%,transparent);opacity:0;transform:scale(.2)}
.brand-union.is-impact .union-ring{animation:ak-union-shock 1.5s cubic-bezier(.08,.82,.17,1) .18s forwards}
.brand-union.is-impact .union-ring.r2{animation-delay:.12s}
.brand-union.is-impact .union-ring.r3{animation-delay:.24s}
.brand-union .union-flash{position:absolute;width:46%;height:46%;border-radius:50%;opacity:0;
  background:radial-gradient(circle,#fff 0%,color-mix(in srgb,var(--accent) 80%,#fff) 34%,#0000 70%);
  mix-blend-mode:screen;transform:scale(.4)}
.brand-union.is-impact .union-flash{animation:ak-union-flash .7s ease-out .16s forwards}
.brand-union .union-sparks{position:absolute;inset:0;display:block}
.brand-union .union-sparks i{position:absolute;left:50%;top:50%;width:5px;height:5px;border-radius:50%;
  background:var(--accent);opacity:0;box-shadow:0 0 12px color-mix(in srgb,var(--accent) 85%,transparent)}
.brand-union.is-impact .union-sparks i{animation:ak-union-spark 1.1s cubic-bezier(.1,.75,.2,1) .16s forwards}
.brand-union .union-sparks i:nth-child(1){--a:0deg;--d:128px;animation-delay:.02s}
.brand-union .union-sparks i:nth-child(2){--a:30deg;--d:96px;animation-delay:.06s}
.brand-union .union-sparks i:nth-child(3){--a:62deg;--d:142px;animation-delay:.03s}
.brand-union .union-sparks i:nth-child(4){--a:95deg;--d:104px;animation-delay:.09s}
.brand-union .union-sparks i:nth-child(5){--a:124deg;--d:150px;animation-delay:.05s}
.brand-union .union-sparks i:nth-child(6){--a:152deg;--d:88px;animation-delay:.11s}
.brand-union .union-sparks i:nth-child(7){--a:186deg;--d:134px;animation-delay:.04s}
.brand-union .union-sparks i:nth-child(8){--a:212deg;--d:100px;animation-delay:.1s}
.brand-union .union-sparks i:nth-child(9){--a:243deg;--d:146px;animation-delay:.02s}
.brand-union .union-sparks i:nth-child(10){--a:276deg;--d:92px;animation-delay:.08s}
.brand-union .union-sparks i:nth-child(11){--a:305deg;--d:138px;animation-delay:.06s}
.brand-union .union-sparks i:nth-child(12){--a:334deg;--d:110px;animation-delay:.12s}
.brand-union .union-x{position:absolute;z-index:4;translate:8% 4%;font-weight:700;font-size:clamp(34px,7vw,58px);line-height:1;color:var(--accent);
  opacity:0;transform:scale(.3) rotate(-25deg);text-shadow:0 0 22px color-mix(in srgb,var(--accent) 70%,transparent);
  transform-origin:center}
.brand-union.is-impact .union-x{animation:ak-union-x .9s cubic-bezier(.2,1.5,.3,1) .12s forwards}
@keyframes ak-union-shock{0%{opacity:.9;transform:scale(.2)}70%{opacity:.3}100%{opacity:0;transform:scale(2.1)}}
@keyframes ak-union-flash{0%{opacity:0;transform:scale(.3)}18%{opacity:.95;transform:scale(1)}100%{opacity:0;transform:scale(1.7)}}
@keyframes ak-union-spark{0%{opacity:0;transform:rotate(var(--a)) translateX(10px) scale(.6)}
 20%{opacity:1}100%{opacity:0;transform:rotate(var(--a)) translateX(var(--d)) scale(.2)}}
@keyframes ak-union-x{0%{opacity:0;transform:scale(.3) rotate(-25deg)}45%{opacity:1;transform:scale(1.25) rotate(0)}100%{opacity:.9;transform:scale(1) rotate(0)}}
@keyframes ak-union-breathe{0%,100%{opacity:.4}50%{opacity:.62}}
@keyframes ak-union-float{0%,100%{translate:0 0}50%{translate:0 -7px}}

.brand-union{width:100%}
.brand-union-stage{position:relative;width:min(360px,100%);aspect-ratio:1;display:grid;place-items:center;margin-inline:auto}
.brand-union .union-mark{position:absolute;width:62%;height:62%;object-fit:contain;opacity:0;
  transition:transform 1.25s cubic-bezier(.2,1.12,.24,1),opacity .55s ease,filter 1.2s ease}
.brand-union .union-ak{z-index:3;transform:translate3d(-172%,6%,0) rotate(-26deg) scale(.66);filter:blur(3px)}
.brand-union .union-valset{z-index:1;width:42%;height:44%;background:#fff;padding:0;border:0;
  object-fit:cover;object-position:50% 7%;
  transform:translate3d(190%,18%,0) rotate(28deg) scale(.6);filter:blur(3px)}
.brand-union .union-spark{position:absolute;z-index:0;width:74%;height:74%;border:1px solid var(--accent);opacity:0;transform:rotate(-20deg) scale(.6);
  transition:transform 1.1s cubic-bezier(.16,1,.3,1),opacity .9s ease}
.brand-union.is-joined .union-ak{opacity:1;filter:blur(0);transform:translate3d(-40%,-12%,0) rotate(-3deg) scale(1)}
.brand-union.is-joined .union-valset{opacity:1;filter:blur(0);transform:translate3d(58%,22%,0) rotate(4deg) scale(1)}
.brand-union.is-joined .union-spark{opacity:.45;transform:rotate(-20deg) scale(1);animation:ak-union-spin 26s linear 1.2s infinite}
.brand-union.is-impact .union-ak{animation:ak-union-float 6s ease-in-out 1.2s infinite}
.brand-union.is-impact .union-valset{animation:ak-union-float 6s ease-in-out 1.55s infinite}
@keyframes ak-union-spin{from{transform:rotate(-20deg) scale(1)}to{transform:rotate(340deg) scale(1)}}
@media(max-width:800px){.brand-union-stage{width:min(280px,100%)}.brand-union .union-mark{width:66%;height:66%}}
@media(max-width:540px){.brand-union-stage{width:min(240px,86vw);margin-inline:0}}
@media(prefers-reduced-motion:reduce){
 .brand-union .union-mark,.brand-union .union-spark,.brand-union .brand-union-stage,.brand-union .union-glow{transition:none!important;animation:none!important}
 .brand-union .union-ak,.brand-union.is-joined .union-ak{opacity:1;filter:none;transform:translate3d(-40%,-12%,0)}
 .brand-union .union-valset,.brand-union.is-joined .union-valset{opacity:1;filter:none;transform:translate3d(58%,22%,0)}
 .brand-union .union-spark{opacity:.45;transform:rotate(-20deg) scale(1)}
 .brand-union .union-x{opacity:.9;transform:none;animation:none!important}
 .brand-union .union-glow{opacity:.4}
 .brand-union .union-ring,.brand-union .union-flash,.brand-union .union-sparks i{animation:none!important;opacity:0}
}

/* 4 — VALSET artwork fills its gold frame like in Release 3, caption removed */
.valset-art{align-self:start}
.valset-art img{display:block}
.valset-art figcaption{display:none}

/* 5 — compact Telegram CTA that expands on hover/focus */
.telegram-booking.tg-compact{gap:0;max-width:none;width:auto;padding:0;border-radius:999px;overflow:hidden;
  background:#229ED9;border-color:#229ED9;box-shadow:0 12px 30px #0006;
  transition:transform .28s cubic-bezier(.16,1,.3,1),background .28s ease,box-shadow .28s ease}
.telegram-booking.tg-compact .tg-icon{display:grid;place-items:center;width:56px;height:56px;flex:0 0 auto}
.telegram-booking.tg-compact .tg-label{display:block;max-width:0;opacity:0;white-space:nowrap;overflow:hidden;
  padding-right:0;font-size:13px;letter-spacing:.02em;
  transition:max-width .34s cubic-bezier(.16,1,.3,1),opacity .24s ease,padding-right .34s ease}
.telegram-booking.tg-compact:hover,.telegram-booking.tg-compact:focus-visible{transform:translateY(-3px);background:#1b8cc4}
.telegram-booking.tg-compact:hover .tg-label,
.telegram-booking.tg-compact:focus-visible .tg-label,
.telegram-booking.tg-compact.is-open .tg-label{max-width:230px;opacity:1;padding-right:22px}
.telegram-booking.tg-compact:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media(hover:none){
 .telegram-booking.tg-compact .tg-label{max-width:200px;opacity:1;padding-right:18px}
 .telegram-booking.tg-compact .tg-icon{width:50px;height:50px}
}
@media(max-width:540px){.telegram-booking.tg-compact{right:14px;bottom:max(14px,env(safe-area-inset-bottom));padding:0;font-size:12px}}
@media(prefers-reduced-motion:reduce){.telegram-booking.tg-compact,.telegram-booking.tg-compact .tg-label{transition:none!important}}

/* 6 — mobile drawer: smooth open/close instead of an instant jump */
@media(prefers-reduced-motion:no-preference){
 dialog#mobile-menu{translate:100% 0;opacity:0;
  transition:translate .34s cubic-bezier(.22,1,.36,1),opacity .26s ease,overlay .34s allow-discrete,display .34s allow-discrete}
 dialog#mobile-menu[open]{translate:0 0;opacity:1}
 @starting-style{dialog#mobile-menu[open]{translate:100% 0;opacity:0}}
 dialog#mobile-menu::backdrop{background:#0000;transition:background .34s ease,overlay .34s allow-discrete,display .34s allow-discrete}
 dialog#mobile-menu[open]::backdrop{background:#000b}
 @starting-style{dialog#mobile-menu[open]::backdrop{background:#0000}}
 dialog#mobile-menu[open] .menu-top,dialog#mobile-menu[open]>nav:not(.languages) a,dialog#mobile-menu[open]>.languages{
  animation:ak-menu-item .42s cubic-bezier(.16,1,.3,1) both}
 dialog#mobile-menu[open]>nav:not(.languages) a:nth-child(1){animation-delay:.06s}
 dialog#mobile-menu[open]>nav:not(.languages) a:nth-child(2){animation-delay:.1s}
 dialog#mobile-menu[open]>nav:not(.languages) a:nth-child(3){animation-delay:.14s}
 dialog#mobile-menu[open]>nav:not(.languages) a:nth-child(4){animation-delay:.18s}
 dialog#mobile-menu[open]>nav:not(.languages) a:nth-child(5){animation-delay:.22s}
 dialog#mobile-menu[open]>nav:not(.languages) a:nth-child(n+6){animation-delay:.26s}
 dialog#mobile-menu[open]>.languages{animation-delay:.3s}
}
@keyframes ak-menu-item{from{opacity:0;transform:translate3d(18px,0,0)}to{opacity:1;transform:none}}

/* 7 — boxing gloves stay visible in the light theme */
[data-theme="light"] .glove-world{opacity:.42!important}
[data-theme="light"] .glove{filter:brightness(.68) contrast(1.18) saturate(1.05) drop-shadow(0 26px 26px rgba(20,16,12,.28))}
[data-theme="light"] .glove-near{opacity:.6}
[data-theme="light"] .glove-far{opacity:.52}
@media(max-width:800px){[data-theme="light"] .glove-world{opacity:.34!important}}
