body {font-family: 'Poppins', sans-serif;background-color: #0b1220;color: #0f172a;line-height: 1.45;background-image: url("");background-size: cover;background-position: center;background-repeat: no-repeat;margin:0;min-height: 100vh} .popup-overlay {position: fixed;top: 0;right: 0;bottom: 0;left: 0;display: flex;align-items: center;justify-content: center;background-color: rgba(0, 0, 0, 0.6)} .popup-container {background-color: #ffffff;border: 1px solid #646464;color: #000000;border-radius: 20px;box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);padding: 14px;width: 100%;max-width: 420px;text-align: center} .popup-header {margin-bottom: 22px} .popup-title {font-size: 2rem;font-weight: 700;color: #000000;margin-bottom: 8px;letter-spacing: -0.02em;font-size: 1.9rem} .popup-subtitle {color: #000000;font-size: 0.80rem;font-weight: 400} .gender-grid {display: grid;gap: 16px;margin-bottom: 24px} .gender-option {display: flex;align-items: center;gap: 16px;padding: 12px;background-color: white;border: 2px solid transparent;border-radius: 16px;text-decoration: none;color: #1e293b;cursor: pointer;position: relative;overflow: hidden} .gender-option::before {position: absolute;top: 0;left: -100%;width: 100%;height: 100%} .gender-icon {width: 48px;height: 48px;border-radius: 12px;display: flex;align-items: center;justify-content: center;font-size: 24px;flex-shrink: 0} .gender-label {font-size: 1.1rem;font-weight: 600;flex: 1;text-align: left} .gender-arrow {width: 20px;height: 20px;opacity: 0.5;transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1)} .gender-option:hover .gender-arrow {opacity: 1;transform: translateX(4px)} .male {border-color: #a2bae0} .male:hover {border-color: #3b82f6} .male .gender-icon {background-color: rgba(59, 130, 246, 0.1);color: #3b82f6} .female {border-color: rgba(236, 72, 153, 0.2)} .female:hover {border-color: #ec4899} .female .gender-icon {background-color: rgba(236, 72, 153, 0.1);color: #ec4899} .popup__footer {font-size: 0.875rem;line-height: 1.5;color: #ffffff} @media (max-width: 480px) {.popup-container {margin: 20px;width: min(80%, 100%)} .popup-title {font-size: 1.75rem} .gender-option {padding: 16px} .gender-icon {width: 40px;height: 40px;font-size: 20px} .gender-label {font-size: 1rem} } .cookie-extra {display: grid;gap: 6px;font-size: .85rem;color: #000000;padding: 20px 12px;border-radius: 12px;background-color: #fbfbfb;border: 1px solid #e9e9e9;margin-top: 20px} .cookie-links {display: flex;gap: 12px;justify-content: center;flex-wrap: wrap} .cookie-links a {text-underline-offset: 3px;opacity: .9;font-size: 0.85em} .collapsible {background-color: #ebebeb;border-radius: 12px;overflow: hidden;max-height: 0;padding: 0 14px;transition: max-height .25s ease, padding-top .25s ease, padding-bottom .25s ease} .collapsible.is-open {max-height: 60px;padding-top: 10px;padding-bottom: 10px;overflow: auto;font-size: 0.65rem} .collapsible p {margin: 10px 0;line-height: 1.5} .cookie-disclaimer {text-align: center;font-size: .52rem;opacity: .95} .modal__footer {font-size: .84rem;text-align: center;margin: 25px 0;color: #ffffff} a {color: #000000} .popup-line-close {width: 100%;display: flex;justify-content: flex-end} .modal__close:hover {background-color: #f1f5f9;color: #334155} .modal__close:focus-visible {outline: 2px solid #00bf63;outline-offset: 2px} .modal__close svg {width: 20px;height: 20px} body {background-image: url("../images/843acac387615a53_mobile.jpg");background-size: cover;background-position: top;background-repeat: no-repeat;min-height: 100vh;margin: 0} @media (max-width: 1024px) and (min-aspect-ratio: 3/4) and (max-aspect-ratio: 4/3) {body {background-image: url("../images/843acac387615a53_tablet.jpg")} } @media (min-width: 1025px) and (max-width: 1920px) {body {background-image: url("../images/843acac387615a53_desktop.jpg")} } @media (min-width: 1921px) {body {background-image: url("../images/843acac387615a53_ultra.jpg")} }