@font-face { font-family: VinylCPSans; src: url('../fonts/sohne-buch.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: VinylCPSans; src: url('../fonts/sohne-halbfett.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
/* Fixed layer, independent of page/ad geometry and scrolling. */
.vinyl-survey { position: fixed; z-index: 2147483000; top: 50%; left: 50%; transform: translate(-50%, -50%); width: min(800px, calc(100vw - 32px)); box-sizing: border-box; margin: 0; padding: 0; border: 0; background: #000; color: #fff; box-shadow: 0 8px 40px #0008; text-align: left; line-height: 1.3; }
.vinyl-survey *, .vinyl-survey *::after { box-sizing: border-box; }
.vinyl-survey[hidden] { display: none !important; }
.vinyl-survey__creative { display: grid; grid-template-columns: 1fr 1fr; min-height: min(600px, calc(100vh - 32px)); min-height: min(600px, calc(100dvh - 32px)); max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow: auto; overscroll-behavior: contain; cursor: pointer; }
.vinyl-survey picture { position: relative; grid-column: 2; grid-row: 1; display: block; min-height: 100%; margin: 0; }
.vinyl-survey .vinyl-survey__photo { position: absolute; inset: 0; display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; object-position: 50% 50%; }
.vinyl-survey__content { grid-column: 1; grid-row: 1; padding: 28px 26px 68px; overflow-wrap: anywhere; }
.vinyl-survey .vinyl-survey__logo { display: block; width: 190px; max-width: 100%; height: auto; margin: 0 0 48px; }
.vinyl-survey .vinyl-survey__heading { margin: 0 0 16px; padding: 0; color: #fff; font: 700 40px/1.04 VinylCPSans, Arial, sans-serif; letter-spacing: -.7px; text-transform: none; }
.vinyl-survey .vinyl-survey__subheading { margin: 0 0 20px; padding: 0; color: #fff; font: 400 20px/1.15 VinylCPSans, Arial, sans-serif; white-space: pre-line; letter-spacing: 0; text-transform: none; }
.vinyl-survey .vinyl-survey__terms { margin: 0 0 28px; padding: 0; color: #fff; font: 700 11px/1.3 VinylCPSans, Arial, sans-serif; }
.vinyl-survey .vinyl-survey__link { display: inline-block; margin: 0; padding: 8px 10px; border: 0; background: #dec898; color: #000; font: 700 20px/1.15 VinylCPSans, Arial, sans-serif; text-transform: none; text-decoration: none; }
.vinyl-survey .vinyl-survey__link:hover { background: #edddbd; color: #000; }
.vinyl-survey__close { position: absolute; z-index: 2; top: 14px; right: 14px; display: flex; justify-content: center; align-items: center; width: 44px; height: 44px; margin: 0; padding: 0; border: 0; border-radius: 0; background: #000; color: #fff; font: bold 26px/1 Arial, sans-serif; cursor: pointer; }
.vinyl-survey .vinyl-survey__close:hover, .vinyl-survey .vinyl-survey__close:focus-visible { background: #dec898; color: #000; }
.vinyl-survey .vinyl-survey__close:active { background: #c5ac78; color: #000; }
.vinyl-survey__close:focus-visible, .vinyl-survey__link:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@media (max-width: 600px) {
    .vinyl-survey { width: min(360px, calc(100vw - 32px)); }
    .vinyl-survey__creative { grid-template-columns: 1fr; min-height: 0; }
    .vinyl-survey__content { grid-column: 1; grid-row: 1; padding: 24px 28px; }
    .vinyl-survey picture { grid-column: 1; grid-row: 2; height: 310px; min-height: 310px; }
    .vinyl-survey .vinyl-survey__logo { width: 110px; margin-bottom: 28px; }
    .vinyl-survey .vinyl-survey__heading { font-size: 32px; line-height: 1.02; letter-spacing: -.4px; }
    .vinyl-survey .vinyl-survey__subheading { font-size: 16px; margin-bottom: 14px; }
    .vinyl-survey .vinyl-survey__terms { font-size: 10px; margin-bottom: 14px; }
    .vinyl-survey .vinyl-survey__link { font-size: 16px; padding: 6px 8px; }
    .vinyl-survey__close { top: 10px; right: 10px; }
}
