/* GML 97.33 - consolidated cascade: base, player, interface. */

/* ===== assets/gml-97-26/site.css ===== */
/* Source 1 base */

        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        :root {
            --gold: #b6955c;
            --gold-dark: #806332;
            --gold-medium: #98753e;
            --gold-light: #c5a56b;
            --dark-bg: #0a0a0a;
            --dark-section: #141414;
            --text-light: #e0e0e0;
            --alert-red: #ff3b30;
            --matrix-green: #00ff41;
        }

        body {
            font-family: "Inter", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
            background: var(--dark-bg);
            color: var(--text-light);
            overflow-x: hidden;
            line-height: 1.6;
            font-weight: 400;

            /* Anti-Select & Anti-Drag Protection */




            -webkit-touch-callout: none;
        }

        /* Allow text selection only in modals where it makes sense */
        .text-modal-content {
            -webkit-user-select: text;
            -moz-user-select: text;
            -ms-user-select: text;
            user-select: text;
        }

        /* Protect images and videos from being dragged */
        img, video {
            -webkit-user-drag: none;
        }

        /* --- SCROLL PROGRESS BAR --- */
        .progress-container {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 2.5px;
            background: transparent;
            z-index: 100000;
        }

        .progress-bar {
            height: 100%;
            background: linear-gradient(90deg, var(--gold-dark) 0%, var(--gold) 54%, #e4c895 100%);
            width: 0%;
            box-shadow: 0 0 8px rgba(175, 141, 95, 0.7);
            transition: width 0.1s ease-out;
        }

        /* --- FILM GRAIN OVERLAY --- */
        .film-grain {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            pointer-events: none;
            z-index: 99998;
            opacity: 0.08;
            mix-blend-mode: overlay;
            background: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='2.5' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='1'/%3E%3C/svg%3E");
            animation: grainFlicker 0.2s steps(1) infinite;
        }

        @keyframes grainFlicker {
            0%, 100% { background-position: 0 0; }
            20% { background-position: 20px -20px; }
            40% { background-position: -20px 20px; }
            60% { background-position: 10px -10px; }
            80% { background-position: -10px 10px; }
        }

        /* --- PRELOADER STYLES --- */
        #preloader {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: var(--dark-bg);
            z-index: 99999;
            display: flex;
            justify-content: center;
            align-items: center;
            transition: opacity 0.8s ease, visibility 0.8s ease;
        }

        #preloader.hidden {
            opacity: 0;
            visibility: hidden;
        }

        .loader-content {
            text-align: center;
        }

        .loader-logo {
            width: 80px;
            height: auto;
            margin-bottom: 20px;
            animation: pulseGold 2s infinite ease-in-out;
        }

        .loader-bar-container {
            width: 200px;
            height: 2px;
            background: rgba(175, 141, 95, 0.2);
            margin: 0 auto;
            position: relative;
            overflow: hidden;
        }

        .loader-bar {
            width: 0%;
            height: 100%;
            background: var(--gold);
            position: absolute;
            top: 0;
            left: 0;
            animation: loadProgress 2s ease-out forwards;
        }

        @keyframes pulseGold {
            0% { transform: scale(0.95); opacity: 0.8; filter: drop-shadow(0 0 0 rgba(175, 141, 95, 0)); }
            50% { transform: scale(1.05); opacity: 1; filter: drop-shadow(0 0 20px rgba(175, 141, 95, 0.6)); }
            100% { transform: scale(0.95); opacity: 0.8; filter: drop-shadow(0 0 0 rgba(175, 141, 95, 0)); }
        }

        @keyframes loadProgress {
            0% { width: 0%; }
            50% { width: 70%; }
            100% { width: 100%; }
        }

        /* Bebas Neue for all headlines */
        h1, h2, h3, h4, h5, h6,
        .hero .simulator-brand,
        .section-title,
        .feature-card h3,
        .video-info h3,
        .contact-info h3,
        .about-text h3,
        .text-modal h2,
        nav .logo {
            font-family: "Bebas Neue", "Impact", sans-serif;
            letter-spacing: 2px;
        }


        /* --- MODAL STYLES (Video & Text & Fullscreen) --- */
        .video-modal, .text-modal, .fullscreen-modal {
            display: none;
            position: fixed;
            z-index: 10000;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.95);
            animation: fadeIn 0.3s ease;
            touch-action: none;
            align-items: center;
            justify-content: center;
        }

        .video-modal.active, .text-modal.active, .fullscreen-modal.active {
            display: flex;
        }

        /* Follow the actually visible browser area after iPad rotation/toolbars. */
        .video-modal {
            top: var(--video-vv-top, 0px);
            left: var(--video-vv-left, 0px);
            width: var(--video-vv-width, 100%);
            height: var(--video-vv-height, 100dvh);
        }

        /* Spezifische Styles für Text Modals */
        .text-modal {
            align-items: flex-start;
            padding-top: 50px;
            overflow-y: auto;
            touch-action: pan-y;
        }

        .text-modal-content {
            background: var(--dark-section);
            border: 1px solid var(--gold);
            padding: 3rem;
            max-width: 800px;
            width: 90%;
            margin: 2rem auto;
            position: relative;
            animation: slideUp 0.4s ease;
            box-shadow: 0 0 50px rgba(0,0,0,0.8);
        }

        .text-modal h2 {
            color: var(--gold);
            font-size: 2.5rem;
            margin-bottom: 1.5rem;
            border-bottom: 1px solid rgba(175, 141, 95, 0.3);
            padding-bottom: 1rem;
        }

        .text-modal h3 {
            color: var(--text-light);
            font-size: 1.5rem;
            margin-top: 2rem;
            margin-bottom: 1rem;
        }

        .text-modal p {
            margin-bottom: 1rem;
            color: #ccc;
            font-size: 0.95rem;
        }

        .legal-text a {
            color: var(--gold-light);
            text-decoration: none;
            text-underline-offset: 3px;
        }

        .legal-text a:hover,
        .legal-text a:focus-visible {
            color: #fff;
            text-decoration: underline;
        }

        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }

        /* --- DYNAMISCHES VIDEO MODAL --- */
        .modal-content {
            position: relative;
            width: 90%;
            max-height: 90vh;
            animation: slideUp 0.4s ease;
            touch-action: none;
            pointer-events: auto;
            transition: max-width 0.3s ease, aspect-ratio 0.3s ease;
            background: #000;
            border: 2px solid var(--gold);
            box-shadow: 0 0 50px rgba(175, 141, 95, 0.22);
        }

        /* 16:9 Format (z.B. für Modality) */
        .modal-content.format-16-9 {
            max-width: 1000px;
            aspect-ratio: 16/9;
        }

        /* 9:16 Format (Shorts) */
        .modal-content.format-9-16 {
            max-width: 450px;
            aspect-ratio: 9/16;
        }

        /* Fullscreen Modal Content (für Mobile Tap-to-Explore) */
        .fullscreen-modal-content {
            position: relative;
            width: 90%;
            max-width: 500px;
            aspect-ratio: 1/1; /* Quadratisch */
            display: flex;
            align-items: center;
            justify-content: center;
            background: #000;
            border: 2px solid var(--gold);
            box-shadow: 0 0 50px rgba(175, 141, 95, 0.3);
            animation: slideUp 0.4s ease;
        }

        .fullscreen-modal-content video {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        @keyframes slideUp {
            from { opacity: 0; transform: translateY(50px); }
            to { opacity: 1; transform: translateY(0); }
        }

        .modal-content > video {
            display: block;
            width: 100%;
            height: 100%;
            border: 0;
            object-fit: contain;
            background: #000;
        }

        .video-share-button {
            position: absolute;
            right: 6px;
            bottom: 64px;
            z-index: 10003;
            width: 36px;
            height: 36px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            background: transparent;
            border: 0;
            border-radius: 50%;
            cursor: pointer;
            box-shadow: none;
            opacity: 1;
            visibility: visible;
            transition: opacity 0.18s ease, visibility 0.18s ease, background 0.12s ease;
        }

        .video-share-button svg {
            width: 19px;
            height: 19px;
        }

        .video-share-button:hover,
        .video-share-button:focus-visible {
            background: rgba(58, 58, 58, 0.86);
            outline: none;
        }

        .video-share-button.is-hidden {
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
        }

        .video-modal .modal-close svg {
            display: block;
            width: 22px;
            height: 22px;
        }

        .video-modal .modal-close.is-hidden {
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
        }

        .video-share-menu {
            position: absolute;
            z-index: 10004;
            box-sizing: border-box;
            left: auto;
            top: auto;
            right: 52px;
            bottom: 64px;
            width: min(330px, calc(100% - 64px));
            padding: 1.15rem;
            color: var(--text-light);
            background: rgba(5, 5, 5, 0.58);
            border: 1px solid rgba(175, 141, 95, 0.62);
            border-radius: 20px;
            box-shadow: 0 14px 34px rgba(0, 0, 0, 0.5), 0 0 18px rgba(175, 141, 95, 0.1);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            animation: videoShareMenuIn 0.15s ease-out;
            transform: none;
        }

        @keyframes videoShareMenuIn {
            from { opacity: 0; transform: translateY(8px) scale(0.985); }
            to { opacity: 1; transform: translateY(0) scale(1); }
        }

        @keyframes videoShareMenuInCentered {
            from { opacity: 0; transform: translate(-50%, calc(-50% + 8px)) scale(0.985); }
            to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
        }

        .video-share-menu[hidden] {
            display: none;
        }

        .video-share-title {
            position: static;
            width: auto;
            height: auto;
            margin: 0 0 0.9rem;
            padding: 0;
            overflow: visible;
            clip: auto;
            white-space: normal;
            color: var(--gold-light);
            border: 0;
            font-family: "Orbitron", sans-serif;
            font-size: 0.82rem;
            font-weight: 600;
            letter-spacing: 0.16em;
            line-height: 1.2;
            text-align: center;
            text-transform: uppercase;
        }

        .video-share-options {
            display: grid;
            grid-template-columns: repeat(4, 58px);
            justify-content: center;
            gap: 0.9rem 0.95rem;
        }

        .video-share-option {
            width: 58px;
            height: 58px;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 0;
            color: var(--gold);
            background: rgba(0, 0, 0, 0.28);
            border: 1px solid rgba(175, 141, 95, 0.52);
            border-radius: 50%;
            text-decoration: none;
            cursor: pointer;
            transition: border-color 0.12s ease, background 0.12s ease, transform 0.12s ease;
        }

        .video-share-option:hover,
        .video-share-option:focus-visible {
            color: #fff;
            background: rgba(175, 141, 95, 0.16);
            border-color: #fff;
            transform: translateY(-1px) scale(1.025);
            box-shadow: 0 4px 11px rgba(175, 141, 95, 0.22);
            outline: none;
        }

        .video-share-mark {
            width: 29px;
            height: 29px;
            flex: 0 0 29px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: currentColor;
        }

        

        /* Optical rather than merely mathematical icon alignment. */
        [data-share-channel="whatsapp"] .video-share-mark { width: 31px; height: 31px; flex-basis: 31px; }
        [data-share-channel="telegram"] .video-share-mark { width: 32px; height: 32px; flex-basis: 32px; transform: translate(-1px, 1px); }
        [data-share-channel="facebook"] .video-share-mark { width: 29px; height: 29px; flex-basis: 29px; }
        [data-share-channel="x"] .video-share-mark { width: 29px; height: 29px; flex-basis: 29px; }
        [data-share-channel="linkedin"] .video-share-mark { width: 27px; height: 27px; flex-basis: 27px; }
        [data-share-channel="reddit"] .video-share-mark { width: 33px; height: 33px; flex-basis: 33px; }
        [data-share-channel="email"] .video-share-mark,
        #copyVideoLink .video-share-mark { width: 29px; height: 29px; flex-basis: 29px; }

        .video-share-status {
            min-height: 0;
            margin-top: 0;
            color: #fff;
            font-size: 0.68rem;
            line-height: 1.35;
            text-align: center;
        }

        .video-share-status:not(:empty) {
            min-height: 1.1rem;
            margin-top: 0.7rem;
        }

        .video-loading {
            position: absolute;
            inset: 0;
            z-index: 2;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 0.9rem;
            padding: 2rem;
            color: var(--gold-light);
            background: rgba(0, 0, 0, 0.84);
            font-family: "Orbitron", sans-serif;
            font-size: 0.78rem;
            letter-spacing: 0.12em;
            text-align: center;
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.2s ease, visibility 0.2s ease;
        }

        .video-loading.active {
            opacity: 1;
            visibility: visible;
        }

        .video-next-notice {
            position: absolute;
            z-index: 3;
            left: 50%;
            bottom: max(18px, env(safe-area-inset-bottom));
            transform: translate(-50%, 10px);
            display: flex;
            align-items: center;
            gap: 0.55rem;
            max-width: calc(100% - 32px);
            padding: 0.55rem 0.85rem;
            color: var(--gold-light);
            background: rgba(0, 0, 0, 0.72);
            border: 1px solid rgba(175, 141, 95, 0.48);
            border-radius: 999px;
            font-family: "Inter", sans-serif;
            font-size: 0.72rem;
            font-weight: 600;
            letter-spacing: 0.07em;
            line-height: 1.2;
            text-transform: uppercase;
            white-space: nowrap;
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
        }

        .video-next-notice.active {
            opacity: 1;
            visibility: visible;
            transform: translate(-50%, 0);
        }

        .video-next-arrows {
            color: var(--gold);
            font-size: 1rem;
            letter-spacing: -0.08em;
        }

        .video-share-mark svg {
            display: block;
            width: 100%;
            height: 100%;
        }

        #videoFrame:fullscreen,
        #videoFrame:-webkit-full-screen {
            width: 100vw !important;
            height: 100vh !important;
            margin: 0 !important;
            padding: 0 !important;
            border: 0 !important;
            outline: 0 !important;
            box-shadow: none !important;
            background: #000 !important;
            object-fit: contain;
        }

        #videoFrame::backdrop {
            background: #000;
        }

        .video-loading.error .video-loading-spinner {
            display: none;
        }

        .video-loading-spinner {
            width: 42px;
            height: 42px;
            border: 3px solid rgba(175, 141, 95, 0.28);
            border-top-color: var(--gold-light);
            border-radius: 50%;
            animation: videoLoadingSpin 0.8s linear infinite;
        }

        @keyframes videoLoadingSpin {
            to { transform: rotate(360deg); }
        }

        .video-modal .modal-close {
            top: -18px;
            right: -18px;
            box-shadow: 0 0 0 1px rgba(175, 141, 95, 0.5), 0 8px 20px rgba(0, 0, 0, 0.5);
        }

        .modal-close {
            position: absolute;
            top: 10px;
            right: 10px;
            color: var(--gold);
            font-size: 30px;
            font-weight: bold;
            cursor: pointer;
            transition: all 0.3s ease;
            background: rgba(0, 0, 0, 0.7);
            border: none;
            width: 35px;
            height: 35px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            z-index: 10001;
            backdrop-filter: blur(10px);
        }

        .text-modal .modal-close {
            top: 10px;
            right: 10px;
            position: absolute;
        }

        .fullscreen-modal .modal-close {
            position: absolute;
            top: 10px;
            right: 10px;
        }

        .modal-close:hover {
            color: var(--gold-light);
            background: rgba(0, 0, 0, 0.9);
            transform: rotate(90deg);
        }

        /* Navigation */
        nav {
            position: fixed;
            top: 0;
            width: 100%;
            background: rgba(10, 10, 10, 0.6);
            backdrop-filter: blur(10px);
            padding: 0 5%;
            z-index: 1000;
            transition: all 0.3s ease;
            border-bottom: 1px solid rgba(175, 141, 95, 0.1);
        }

        nav.scrolled {
            padding: 0 5%;
            background: rgba(10, 10, 10, 0.86);
            box-shadow: 0 5px 30px rgba(0, 0, 0, 0.5);
        }

        nav .container {
            max-width: 1400px;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
            position: relative;
            height: 72px;
        }

        /* Hamburger Menu Icon */
        .hamburger {
            display: none;
            flex-direction: column;
            cursor: pointer;
            gap: 5px;
            z-index: 10003;
            position: relative;
        }

        .hamburger span {
            width: 30px;
            height: 3px;
            background: var(--gold);
            transition: all 0.3s ease;
            border-radius: 2px;
        }

        .hamburger.active span:nth-child(1) {
            transform: rotate(45deg) translate(8px, 8px);
        }

        .hamburger.active span:nth-child(2) {
            opacity: 0;
        }

        .hamburger.active span:nth-child(3) {
            transform: rotate(-45deg) translate(8px, -8px);
        }

        nav .logo {
            font-size: 1.5rem;
            font-weight: bold;
            color: var(--gold);
            text-decoration: none;
            letter-spacing: 2px;
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        nav .logo img {
            height: 44px;
            width: auto;
        }

        nav ul {
            display: flex;
            list-style: none;
            gap: 3rem;
        }

        nav a {
            color: var(--text-light);
            text-decoration: none;
            font-weight: 500;
            transition: all 0.3s ease;
            position: relative;
        }

        nav a:hover {
            color: var(--gold);
        }

        nav a::after {
            content: "";
            position: absolute;
            bottom: -5px;
            left: 0;
            width: 0;
            height: 2px;
            background: var(--gold);
            transition: width 0.3s ease;
        }

        nav a:hover::after {
            width: 100%;
        }

        /* Language Switcher */
        .language-switcher {
            position: relative;
            z-index: 10004;
        }

        .language-trigger {
            height: 36px;
            min-width: 84px;
            padding: 0 0.75rem;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0.5rem;
            background: rgba(10, 10, 10, 0.72);
            border: 1px solid rgba(175, 141, 95, 0.46);
            border-radius: 0;
            color: var(--text-light);
            cursor: pointer;
            font-family: "Inter", sans-serif;
            font-size: 0.78rem;
            font-weight: 600;
            letter-spacing: 0.08em;
            transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease;
        }

        .language-trigger:hover,
        .language-trigger[aria-expanded="true"] {
            color: var(--gold);
            border-color: var(--gold);
            background: rgba(20, 20, 20, 0.96);
        }

        .language-trigger svg {
            width: 16px;
            height: 16px;
            stroke-width: 1.8;
        }

        .language-chevron {
            transition: transform 0.2s ease;
        }

        .language-trigger[aria-expanded="true"] .language-chevron {
            transform: rotate(180deg);
        }

        .language-menu {
            position: absolute;
            top: calc(100% + 10px);
            right: 0;
            width: 220px;
            padding: 0.4rem;
            background: rgba(10, 10, 10, 0.98);
            border: 1px solid rgba(175, 141, 95, 0.56);
            box-shadow: 0 22px 55px rgba(0, 0, 0, 0.55);
            backdrop-filter: blur(18px);
        }

        .language-menu[hidden] {
            display: none;
        }

        .language-option {
            width: 100%;
            min-height: 40px;
            padding: 0.55rem 0.7rem;
            display: grid;
            grid-template-columns: 34px 1fr;
            align-items: center;
            gap: 0.65rem;
            border: 0;
            border-left: 2px solid transparent;
            border-radius: 0;
            background: transparent;
            color: rgba(224, 224, 224, 0.72);
            font-family: "Inter", sans-serif;
            font-size: 0.82rem;
            text-align: left;
            cursor: pointer;
            transition: color 0.18s ease, background 0.18s ease, border-color 0.18s ease;
        }

        .language-option:hover,
        .language-option:focus-visible {
            color: white;
            background: rgba(175, 141, 95, 0.1);
            outline: none;
        }

        .language-option.active {
            color: var(--gold-light);
            background: rgba(175, 141, 95, 0.13);
            border-left-color: var(--gold);
        }

        .language-code {
            color: var(--gold);
            font-size: 0.7rem;
            font-weight: 700;
            letter-spacing: 0.1em;
        }

        /* Hero Section */
        .hero {
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            overflow: hidden;
            background: linear-gradient(135deg, #0a0a0a 0%, #1a1a2e 50%, #0a0a0a 100%);
            padding-top: 90px;
            padding-bottom: 130px;
        }

        .hero::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background:
                radial-gradient(ellipse at 20% 30%, rgba(212, 175, 55, 0.15) 0%, transparent 50%),
                radial-gradient(ellipse at 80% 70%, rgba(212, 175, 55, 0.1) 0%, transparent 50%);
            animation: pulseGlow 8s ease-in-out infinite;
        }

        @keyframes pulseGlow {
            0%, 100% { opacity: 0.5; }
            50% { opacity: 1; }
        }

        .particles {
            position: absolute;
            width: 100%;
            height: 100%;
            overflow: hidden;
        }

        .particle {
            position: absolute;
            background: var(--gold);
            border-radius: 50%;
            opacity: 0;
            animation: float 15s infinite;
        }

        @keyframes float {
            0% {
                opacity: 0;
                transform: translateY(100vh) scale(0);
            }
            10% {
                opacity: 0.5;
            }
            90% {
                opacity: 0.5;
            }
            100% {
                opacity: 0;
                transform: translateY(-100vh) scale(1);
            }
        }

        .hero-content {
            text-align: center;
            z-index: 2;
            animation: fadeInUp 1.5s ease-out;
            margin-top: 0;
            width: 100%; /* Ensure full width availability */
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(40px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* --- NEW CONTAINER FOR VIDEO & BUTTON --- */
        .hero-player-container {
            position: relative;
            width: 100%;
            max-width: 720px; /* PC GRÖßE */
            margin: 20px auto 3rem auto;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        /* Hero Wrapper for Cinema Engine - UPDATED ASPECT RATIO & GLOW */
        .hero-video-wrapper {
            position: relative;
            width: 100%;
            aspect-ratio: 1/1; /* SQUARE */
            cursor: pointer;
            display: block;
            overflow: hidden;

            /* Design: Rounded corners + Static Glow */
            border-radius: 20px;
            border: 1px solid rgba(175, 141, 95, 0.2);
            box-shadow: 0 0 30px rgba(175, 141, 95, 0.2); /* Basis-Glow (Dezent & Statisch) */
            transition: all 0.5s ease; /* Weicher Übergang für Hover */
        }

        /* Hover Effect: Glow verstärkt sich, KEINE Bewegung/Scale */
        .hero-video-wrapper:hover {
            box-shadow: 0 0 60px rgba(175, 141, 95, 0.5), 0 0 20px rgba(175, 141, 95, 0.3);
            border-color: rgba(175, 141, 95, 0.5);
        }

        /* Fullscreen State Adjustments */
        .hero-video-wrapper:fullscreen {
            border-radius: 0;
            border: none;
            max-width: 100%;
            aspect-ratio: auto;
            box-shadow: none;
            background: #000;
        }

        /* Die beiden Video-Player (Double Buffering) */
        .hero-video-player {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: contain;
            opacity: 0;
            transition: opacity 0.5s ease-in-out;
            z-index: 1;
            /* Disable pointer events to stop right clicks directly on the video tag */
            pointer-events: none;
        }

        .hero-video-player.active {
            opacity: 1;
            z-index: 2;
        }

        /* Fallback Image - liegt ganz hinten */
        .hero-fallback-img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: contain;
            z-index: 0;
            pointer-events: none;
        }

        /* --- CONTROL PILL (Dynamic Island Style) --- */
        .control-pill {
            position: absolute;
            bottom: 10px; /* <--- DEUTLICH WEITER UNTEN */
            left: 50%; /* <--- IN DIE MITTE GESCHOBEN */
            transform: translateX(-50%); /* <--- EXAKT ZENTRIERT */
            z-index: 10;
            background: rgba(0, 0, 0, 0.6);
            border: 1px solid var(--gold);
            border-radius: 30px; /* Pill shape */
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 0 10px;
            height: 32px; /* Schmaler als das alte Symbol */
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            box-shadow: 0 5px 15px rgba(0,0,0,0.5);
            transition: all 0.3s ease;
        }

        .control-pill:hover {
            background: rgba(0, 0, 0, 0.8);
            box-shadow: 0 5px 20px rgba(175, 141, 95, 0.3);
        }

        .pill-btn {
            background: transparent;
            border: none;
            color: var(--gold);
            height: 100%;
            width: 32px; /* Quadratisch innerhalb der Pille */
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: all 0.3s ease;
            opacity: 0.6;
        }

        .pill-btn:hover {
            opacity: 1;
            transform: scale(1.15);
        }

        .pill-btn.active {
            opacity: 1;
            color: #fff; /* Leuchtet weiß, wenn aktiv (Autoplay/Fullscreen) */
            text-shadow: 0 0 10px rgba(255,255,255,0.5);
        }

        .pill-btn svg {
            width: 16px;
            height: 16px;
        }

        /* Separator inside Pill */
        .pill-separator {
            width: 1px;
            height: 14px;
            background: rgba(175, 141, 95, 0.3);
            margin: 0 4px;
        }

        /* --- REPLAY BUTTON --- */
        .simulation-btn {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background: rgba(0, 0, 0, 0.58);
            border: 1px solid rgba(212, 184, 150, 0.86);
            color: var(--gold-light);
            padding: 0.9rem 1.7rem;
            border-radius: 0;
            font-family: "Inter", sans-serif;
            font-weight: 600;
            font-size: 0.82rem;
            letter-spacing: 0.12em;
            text-transform: uppercase;
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            cursor: pointer;
            z-index: 20;
            opacity: 0;
            pointer-events: none;
            transition: opacity 0.25s ease, transform 0.2s ease, background 0.2s ease;
            box-shadow: 0 8px 24px rgba(0, 0, 0, 0.38);
        }

        .simulation-btn.visible {
            opacity: 1;
            pointer-events: auto;
        }

        .simulation-btn:hover {
            background: rgba(0, 0, 0, 0.78);
            transform: translate(-50%, -50%) scale(1.05);
        }

        .hero .simulator-brand {
            font-size: 4.5rem;
            margin-bottom: 0.8rem;
            line-height: 0.9;
            background: linear-gradient(135deg, #d4b896, var(--gold-light) 25%, var(--gold) 55%, var(--gold-dark) 85%);
            filter: drop-shadow(0 0 18px rgba(175,141,95,.3));
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            animation: fadeInUp 1.5s ease-out 0.3s both;
            font-weight: 400;
        }

        .hero p {
            font-size: 1.3rem;
            color: var(--text-light);
            margin-top: 0;
            margin-bottom: 2.5rem;
            animation: fadeInUp 1.5s ease-out 0.6s both;
        }

        .cta-button {
            display: inline-block;
            padding: 1rem 3rem;
            background: transparent;
            color: var(--gold);
            text-decoration: none;
            font-weight: 600;
            font-size: 1.1rem;
            border: 2px solid var(--gold);
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
            animation: fadeInUp 1.5s ease-out 0.9s both;
            font-family: "Inter", sans-serif;
            letter-spacing: 1px;
            text-transform: uppercase;
        }

        .cta-button::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 0;
            height: 100%;
            background: linear-gradient(135deg, var(--gold-dark), var(--gold));
            transition: width 0.4s ease;
            z-index: -1;
        }

        .cta-button:hover::before {
            width: 100%;
        }

        .cta-button:hover {
            color: var(--dark-bg);
            border-color: var(--gold);
            box-shadow: 0 0 20px rgba(175, 141, 95, 0.5);
        }

        /* Section Styles */
        section {
            padding: 80px 5%;
            position: relative;
        }

        .section-title {
            font-size: 3.5rem;
            text-align: center;
            margin-bottom: 3rem;
            background: linear-gradient(135deg, #d4b896 0%, var(--gold-light) 25%, var(--gold) 50%, var(--gold-dark) 75%, #6b5433 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            font-weight: 400;
            width: fit-content;
            margin: 0 auto 3rem auto;
            padding: 0 0.5em;
            filter: drop-shadow(0 0 25px rgba(175, 141, 95, 0.5));
        }

        /* About Section */
        .about {
            background: var(--dark-section);
        }

        /* Keep the studio subtitle visually connected to the section heading. */
        .about .section-title {
            margin-bottom: 1.25rem;
        }

        .about-content {
            max-width: 900px;
            margin: 0 auto;
            text-align: center;
        }

        .about-text h3 {
            font-size: clamp(2rem, 3vw, 2.5rem);
            color: var(--gold);
            margin-bottom: 1.25rem;
            font-weight: 400;
            width: fit-content;
            margin: 0 auto 1.25rem auto;
            padding: 0 0.5em;
        }

        /* Stronger desktop hierarchy without enlarging tablet/mobile headings. */
        @media (min-width: 1181px) {
            .section-title {
                font-size: 4.2rem;
            }

            .about .section-title {
                margin-bottom: 0.65rem;
            }

            .about-text h3 {
                font-size: 2rem;
                margin-bottom: 1.15rem;
            }
        }

        .about-text p {
            font-size: 1.2rem;
            line-height: 1.8;
            margin-bottom: 1.5rem;
        }

        .about-text .studio-outlook {
            margin-top: 2.2rem;
            padding: 1.6rem 1.8rem;
            border-top: 1px solid rgba(175, 141, 95, 0.34);
            border-bottom: 1px solid rgba(175, 141, 95, 0.34);
            color: var(--gold-light);
            font-size: 1.08rem;
            line-height: 1.75;
        }

        /* Features Section */
        .features {
            background: var(--dark-bg);
            position: relative;
            overflow: hidden;
        }

        .features::before {
            content: "";
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background:
                radial-gradient(circle at 20% 50%, rgba(175, 141, 95, 0.15) 0%, transparent 50%),
                radial-gradient(circle at 80% 80%, rgba(129, 98, 54, 0.1) 0%, transparent 50%),
                radial-gradient(circle at 40% 20%, rgba(140, 109, 65, 0.08) 0%, transparent 50%);
            animation: backgroundShift 20s ease-in-out infinite;
            z-index: 0;
        }

        @keyframes backgroundShift {
            0%, 100% {
                transform: translate(0, 0) rotate(0deg);
            }
            33% {
                transform: translate(5%, 5%) rotate(5deg);
            }
            66% {
                transform: translate(-5%, 3%) rotate(-3deg);
            }
        }

        .features .section-title,
        .features-grid {
            position: relative;
            z-index: 1;
        }

        .features-grid {
            max-width: 1400px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 3rem;
        }

        @media (max-width: 1200px) {
            .features-grid {
                grid-template-columns: repeat(2, 1fr);
            }
        }

        /* Static production cards with a restrained hover accent */
        .feature-card {
            background: rgba(20, 20, 20, 0.4);
            backdrop-filter: none;
            -webkit-backdrop-filter: none;
            padding: 3rem 2rem;
            border-radius: 0;
            text-align: center;
            transition: transform 0.18s ease-out, background-color 0.18s ease-out,
                        border-color 0.18s ease-out, box-shadow 0.18s ease-out;
            border: 1px solid rgba(175, 141, 95, 0.2);
            position: relative;
            overflow: hidden;
            z-index: 1;
        }

        .feature-card::before {
            content: "";
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(175, 141, 95, 0.1), transparent);
            transition: left 0.22s ease-out;
            z-index: 0;
            pointer-events: none;
        }

        @media (hover: hover) and (pointer: fine) {
            .feature-card:hover::before {
                left: 100%;
            }

            .feature-card:hover {
                transform: translateY(-4px);
                background: rgba(24, 24, 24, 0.62);
                box-shadow: 0 14px 38px rgba(0, 0, 0, 0.3);
                border-color: rgba(255, 255, 255, 0.82);
            }
        }

        .feature-number {
            font-size: 1rem;
            color: var(--gold);
            font-weight: bold;
            margin-bottom: 1.5rem;
            opacity: 0.5;
            letter-spacing: 2px;
        }

        .feature-icon {
            width: 60px;
            height: 60px;
            margin: 0 auto 1.5rem;
            color: var(--gold);
            stroke-width: 1.5;
        }

        .feature-icon svg {
            width: 100%;
            height: 100%;
        }

        .feature-card h3 {
            font-size: 2rem;
            color: var(--gold);
            margin-bottom: 1rem;
            font-weight: 400;
        }

        .feature-card p {
            font-size: 1rem;
            line-height: 1.6;
        }

        /* Compact 3 x 2 production grid for iPads and similar tablets */
        @media (min-width: 769px) and (max-width: 1180px) {
            .features-grid {
                grid-template-columns: repeat(3, minmax(0, 1fr));
                gap: 1.25rem;
            }

            .feature-card {
                padding: 1.65rem 0.9rem;
                cursor: default;
            }

            .feature-card.expanded {
                background: rgba(10, 10, 10, 0.85);
                border-color: rgba(255, 255, 255, 0.7);
            }

            .feature-icon {
                width: 40px;
                height: 40px;
                margin-bottom: 0.85rem;
            }

            .feature-card h3 {
                min-height: 2.5em;
                margin-bottom: 0;
                font-size: 1.22rem;
                line-height: 1.25;
                display: flex;
                align-items: center;
                justify-content: center;
            }

            .feature-card p {
                max-height: none;
                margin-top: 0.65rem;
                overflow: visible;
                opacity: 1;
                font-size: 0.82rem;
                line-height: 1.45;
                transition: none;
            }

            .feature-card.expanded p {
                max-height: none;
                margin-top: 0.65rem;
                opacity: 1;
            }
        }

        /* Videos Section */
        .videos {
            background: var(--dark-section);
        }

        .showcase-heading {
            text-align: center;
            margin-bottom: 2.25rem;
        }

        .videos .showcase-heading .section-title {
            margin-bottom: 0;
        }

        .showcase-tabs {
            width: min(100%, 920px);
            margin: 0 auto 2.4rem;
            padding: 5px;
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 5px;
            background: rgba(8, 8, 8, 0.72);
            border: 1px solid rgba(175, 141, 95, 0.24);
        }

        .showcase-tab {
            min-width: 0;
            min-height: 58px;
            padding: 0.65rem 0.8rem;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 0.16rem;
            border: 1px solid transparent;
            border-radius: 0;
            background: transparent;
            color: rgba(224, 224, 224, 0.58);
            font: inherit;
            cursor: pointer;
            transition: color 0.25s ease, background 0.25s ease, border-color 0.25s ease;
        }

        .showcase-tab:hover,
        .showcase-tab:focus-visible {
            color: var(--gold-light);
            border-color: rgba(175, 141, 95, 0.32);
            outline: none;
        }

        .showcase-tab[aria-selected="true"] {
            color: var(--dark-bg);
            border-color: var(--gold);
            background: linear-gradient(135deg, var(--gold-dark), var(--gold-light));
        }

        .showcase-tab-brand {
            font-family: "Inter", sans-serif;
            font-size: 0.62rem;
            font-weight: 700;
            letter-spacing: 0.15em;
            opacity: 0.78;
        }

        .showcase-tab-type {
            font-family: "Bebas Neue", sans-serif;
            font-size: 1.05rem;
            letter-spacing: 0.1em;
            line-height: 1;
        }

        .showcase-panel[hidden] {
            display: none;
        }

        .showcase-track {
            width: min(100%, 1240px);
            margin: 0 auto;
            
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 1.15rem;
            align-items: start;
        }

        .showcase-video-card {
            
            
            padding: 0;
            overflow: hidden;
            background: var(--dark-bg);
            border: 1px solid rgba(175, 141, 95, 0.22);
            border-radius: 0;
            color: var(--text-light);
            font: inherit;
            text-align: left;
            box-shadow: 0 12px 36px rgba(0, 0, 0, 0.28);
            transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
            -webkit-appearance: none;
            appearance: none;
        }

        button.showcase-video-card {
            cursor: pointer;
            touch-action: manipulation;
        }

        button.showcase-video-card:hover,
        button.showcase-video-card:focus-visible {
            transform: translateY(-5px);
            border-color: rgba(212, 184, 150, 0.55);
            box-shadow: 0 18px 46px rgba(175, 141, 95, 0.18);
            outline: none;
        }

        .showcase-poster {
            position: relative;
            width: 100%;
            aspect-ratio: 9 / 16;
            overflow: hidden;
            display: grid;
            place-items: center;
            background:
                linear-gradient(145deg, rgba(175, 141, 95, 0.13), transparent 48%),
                #050505;
            border-bottom: 1px solid rgba(175, 141, 95, 0.2);
        }

        .showcase-poster img {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .showcase-preview {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            background: #050505;
            pointer-events: none;
        }

        /* Prevent WebKit from placing its own platform play symbol over cards. */
        .showcase-preview::-webkit-media-controls,
        .showcase-preview::-webkit-media-controls-panel,
        .showcase-preview::-webkit-media-controls-start-playback-button,
        .showcase-preview::-webkit-media-controls-overlay-play-button {
            display: none !important;
            -webkit-appearance: none;
            opacity: 0;
        }

        .showcase-poster::after {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(180deg, transparent 60%, rgba(0, 0, 0, 0.72));
            pointer-events: none;
        }

        .showcase-play {
            position: relative;
            z-index: 2;
            width: 54px;
            height: 54px;
            display: grid;
            place-items: center;
            border: 1px solid rgba(212, 184, 150, 0.78);
            background: rgba(0, 0, 0, 0.56);
            color: var(--gold-light);
            
            line-height: 0;
            transition: transform 0.25s ease, background 0.25s ease;
        }

        /* CSS triangle instead of a font glyph: identical on Windows and Apple. */
        .showcase-play::before {
            content: "";
            width: 0;
            height: 0;
            border-top: 10px solid transparent;
            border-bottom: 10px solid transparent;
            border-left: 16px solid var(--gold-light);
            transform: translate(2px, 8px);
            filter: drop-shadow(0 0 5px rgba(212, 184, 150, 0.28));
        }

        button.showcase-video-card:hover .showcase-play,
        button.showcase-video-card:focus-visible .showcase-play {
            transform: scale(1.08);
            background: rgba(0, 0, 0, 0.9);
        }

        .showcase-placeholder-mark {
            position: relative;
            z-index: 1;
            color: rgba(175, 141, 95, 0.34);
            font-family: "Bebas Neue", sans-serif;
            font-size: clamp(2.4rem, 5vw, 4.5rem);
            letter-spacing: 0.08em;
        }

        .showcase-card-copy {
            min-height: 88px;
            padding: 1rem 1.05rem;
            display: block;
        }

        .showcase-card-copy strong {
            display: block;
            margin: 0 0 0.3rem;
            color: var(--gold);
            font-size: 1rem;
            font-weight: 500;
        }

        .showcase-card-copy > span {
            display: block;
            color: var(--text-muted);
            font-size: 0.76rem;
            margin: 0;
        }

        .showcase-carousel-controls {
            display: none;
        }

        @media (min-width: 769px) and (max-width: 980px) {
            .showcase-track {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }
        }

        @media (max-width: 768px) {
            .videos {
                overflow: hidden;
            }

            .showcase-heading {
                margin-bottom: 1.6rem;
            }

            .showcase-tabs {
                margin-bottom: 1.8rem;
                padding: 4px;
                gap: 4px;
            }

            .showcase-tab {
                min-height: 52px;
                padding: 0.55rem 0.25rem;
            }

            .showcase-tab-brand {
                font-size: 0.5rem;
                letter-spacing: 0.08em;
            }

            .showcase-tab-type {
                font-size: 0.82rem;
                letter-spacing: 0.06em;
            }

            .showcase-panel {
                width: calc(100% + 10vw);
                margin-left: -5vw;
            }

            .showcase-track {
                width: 100%;
                display: flex;
                gap: 12px;
                overflow-x: auto;
                overscroll-behavior-inline: contain;
                scroll-snap-type: x mandatory;
                scroll-padding-inline: calc((100vw - min(56vw, 220px)) / 2);
                padding: 0 calc((100vw - min(56vw, 220px)) / 2) 0.8rem;
                scrollbar-width: none;
                -webkit-overflow-scrolling: touch;
            }

            .showcase-track::-webkit-scrollbar {
                display: none;
            }

            .showcase-video-card {
                flex: 0 0 min(56vw, 220px);
                width: min(56vw, 220px);
                scroll-snap-align: center;
                scroll-snap-stop: always;
            }

            .showcase-placeholder-mark {
                font-size: 2.8rem;
            }

            .showcase-play {
                width: 48px;
                height: 48px;
                border: 1px solid rgba(212, 184, 150, 0.88);
                border-radius: 0;
                background: rgba(0, 0, 0, 0.64);
                box-shadow: 0 8px 22px rgba(0, 0, 0, 0.34);
            }

            .showcase-play::before {
                border-top-width: 9px;
                border-bottom-width: 9px;
                border-left-width: 15px;
            }

            button.showcase-video-card:active .showcase-play {
                transform: scale(0.94);
                background: rgba(0, 0, 0, 0.94);
            }

            .showcase-card-copy {
                min-height: 76px;
                padding: 0.8rem 0.85rem;
            }

            .showcase-card-copy strong {
                font-size: 0.9rem;
            }

            .showcase-card-copy > span {
                font-size: 0.7rem;
            }

            .showcase-carousel-controls {
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 0.85rem;
                margin-top: 0.75rem;
            }

            .showcase-arrow {
                width: 40px;
                height: 36px;
                display: grid;
                place-items: center;
                border: 1px solid rgba(175, 141, 95, 0.42);
                border-radius: 0;
                background: transparent;
                color: var(--gold);
                font: inherit;
                font-size: 1.1rem;
                cursor: pointer;
            }

            .showcase-arrow:disabled {
                opacity: 0.28;
                cursor: default;
            }

            .showcase-counter {
                min-width: 58px;
                color: rgba(224, 224, 224, 0.62);
                font-size: 0.74rem;
                letter-spacing: 0.12em;
                text-align: center;
            }
        }

        /* Tools Section */
        .tools {
            background: var(--dark-bg);
            padding: 60px 5%;
            overflow: hidden;
            position: relative;
        }

        .tools-title {
            font-size: 2rem;
            text-align: center;
            margin-bottom: 3rem;
            color: var(--gold);
            font-family: "Bebas Neue", sans-serif;
            letter-spacing: 2px;
        }

        /* Updated Slider CSS for Interaction */
        .tools-slider {
            display: flex;
            align-items: center;
            width: 100%;
            overflow: hidden;
            position: relative;
            mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
            -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
            cursor: grab; /* Shows hand icon */
            touch-action: pan-y; /* Allows vertical scroll but captures horizontal */
        }

        .tools-slider:active {
            cursor: grabbing; /* Shows gripping hand */
        }

        .tools-track {
            display: flex;
            gap: 3.2rem;
            will-change: transform;
            transform: translate3d(0, 0, 0);
            backface-visibility: hidden;
            contain: layout paint;
        }

        .tool-item {
            flex-shrink: 0;
            width: 80px;
            height: 80px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: rgba(20, 20, 20, 0.5);
            border: 1px solid rgba(175, 141, 95, 0.2);
            border-radius: 10px;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
            padding: 0.3rem;
            pointer-events: none; /* Images inside shouldn't be draggable themselves */
        }

        

        .tool-item:hover::before {
            background: transparent;
        }

        .tool-item:hover img {
            filter: grayscale(100%) invert(0.65) brightness(1);
        }

        .tool-item.active::before {
            background: white;
        }

        .tool-item img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            filter: grayscale(100%) invert(0.65) brightness(1);
            transition: filter 0.3s ease;
            position: relative;
            z-index: 1;
        }

        .tool-item:hover img {
            filter: none;
        }

        .tool-item.active img {
            filter: none;
        }

        @media (min-width: 769px) and (max-width: 1180px) {
            .tool-item {
                width: 76px;
                height: 76px;
                padding: 0.2rem;
            }

            .tools-track {
                gap: 2.35rem;
            }
        }

        @media (max-width: 768px) {
            .tool-item {
                width: 68px;
                height: 68px;
                padding: 0.1rem;
            }
            .tools-track {
                gap: 1.6rem;
            }
            .tools-title {
                font-size: 1.8rem;
                margin-bottom: 2rem;
            }
        }

        .tool-item::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: transparent;
            border-radius: 10px;
            transition: background 0.3s ease;
            z-index: 0;
        }

        .tool-item:hover::before {
            background: white;
        }

        .tool-item span {
            font-family: "Inter", sans-serif;
            font-size: 0.9rem;
            font-weight: 600;
            color: var(--gold);
            opacity: 0.7;
            transition: opacity 0.3s ease;
            text-align: center;
            padding: 0 1rem;
        }

        .tool-item:hover span {
            opacity: 1;
        }

        .video-grid {
            max-width: 1400px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
            gap: 2rem;
        }

        .video-card {
            background: var(--dark-bg);
            border-radius: 0;
            overflow: hidden;
            transition: transform 0.3s ease;
            border: 1px solid rgba(175, 141, 95, 0.1);
            cursor: pointer;
        }

        .video-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 15px 40px rgba(175, 141, 95, 0.2);
        }

        .video-card:hover .play-icon {
            transform: scale(1.3);
        }

        .video-thumbnail {
            width: 100%;
            height: 250px;
            background: linear-gradient(135deg, #1a1a2e, #0a0a0a);
            background-size: cover;
            background-position: center;
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            overflow: hidden;
        }

        .video-thumbnail::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0, 0, 0, 0.3);
            transition: background 0.3s ease;
        }

        .video-card:hover .video-thumbnail::before {
            background: rgba(0, 0, 0, 0.5);
        }

        .play-icon {
            font-size: 4rem;
            color: var(--gold);
            opacity: 0.8;
            transition: all 0.3s ease;
            position: relative;
            z-index: 1;
        }

        .video-card:hover .play-icon {
            opacity: 1;
            transform: scale(1.2);
        }

        .video-info {
            padding: 1.5rem;
        }

        .video-info h3 {
            color: var(--gold);
            margin-bottom: 0.5rem;
        }

        .video-hidden {
            display: none;
        }

        .load-more-container {
            text-align: center;
            margin-top: 3rem;
        }

        .load-more-btn {
            display: inline-block;
            padding: 1rem 3rem;
            background: transparent;
            color: var(--gold);
            text-decoration: none;
            font-weight: 600;
            font-size: 1rem;
            border: 2px solid var(--gold);
            cursor: pointer;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
            font-family: "Inter", sans-serif;
            letter-spacing: 1px;
            text-transform: uppercase;
        }

        .load-more-btn::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 0;
            height: 100%;
            background: linear-gradient(135deg, var(--gold-dark), var(--gold));
            transition: width 0.4s ease;
            z-index: -1;
        }

        .load-more-btn:hover::before {
            width: 100%;
        }

        .load-more-btn:hover {
            color: var(--dark-bg);
            border-color: var(--gold);
            box-shadow: 0 0 20px rgba(175, 141, 95, 0.5);
        }

        .load-more-btn.hidden {
            display: none;
        }

        /* Contact Section */
        .contact {
            background: var(--dark-bg);
            padding-bottom: 0;
        }

        .contact-container {
            max-width: 1180px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
            background: linear-gradient(135deg, rgba(25, 25, 25, 0.98), rgba(12, 12, 12, 0.98));
            border: 1px solid rgba(175, 141, 95, 0.28);
            box-shadow: 0 28px 80px rgba(0, 0, 0, 0.38);
            position: relative;
            overflow: hidden;
        }

        .contact-container::before,
        .contact-container::after {
            content: "";
            position: absolute;
            width: 46px;
            height: 1px;
            background: var(--gold);
            z-index: 2;
        }

        .contact-container::before {
            top: 14px;
            left: -12px;
            transform: rotate(-45deg);
        }

        .contact-container::after {
            right: -12px;
            bottom: 14px;
            transform: rotate(-45deg);
        }

        .contact-intro {
            padding: clamp(2rem, 5vw, 4rem);
            border-right: 1px solid rgba(175, 141, 95, 0.18);
            display: flex;
            flex-direction: column;
            justify-content: center;
            min-width: 0;
        }

        .contact-kicker {
            color: var(--gold-light);
            font-family: "Bebas Neue", sans-serif;
            font-size: 0.95rem;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            margin-bottom: 1rem;
        }

        .contact-intro h3 {
            font-family: "Bebas Neue", sans-serif;
            font-size: clamp(2.2rem, 4vw, 3.6rem);
            line-height: 0.98;
            letter-spacing: 0.025em;
            color: var(--gold);
            margin-bottom: 1.35rem;
        }

        .contact-intro p {
            color: rgba(224, 224, 224, 0.76);
            max-width: 36rem;
        }

        .contact-promise {
            margin-top: 2rem;
            padding-top: 1.35rem;
            border-top: 1px solid rgba(175, 141, 95, 0.18);
            display: grid;
            gap: 0.7rem;
            color: rgba(224, 224, 224, 0.72);
            font-size: 0.82rem;
        }

        .contact-promise span {
            display: flex;
            align-items: center;
            gap: 0.7rem;
        }

        .contact-promise span::before {
            content: "";
            width: 16px;
            height: 1px;
            background: var(--gold);
            flex-shrink: 0;
        }

        .project-form {
            padding: clamp(2rem, 5vw, 4rem);
            display: grid;
            gap: 1.3rem;
            min-width: 0;
        }

        .form-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 1.1rem;
        }

        .form-field {
            display: grid;
            gap: 0.55rem;
        }

        .form-field label {
            color: rgba(224, 224, 224, 0.78);
            font-size: 0.74rem;
            font-weight: 600;
            letter-spacing: 0.11em;
            text-transform: uppercase;
        }

        .form-field input,
        .form-field textarea {
            width: 100%;
            border: 1px solid rgba(175, 141, 95, 0.28);
            border-radius: 0;
            background: rgba(4, 4, 4, 0.72);
            color: var(--text-light);
            font: inherit;
            font-size: 0.95rem;
            padding: 0.95rem 1rem;
            outline: none;
            transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
            -webkit-user-select: text;
            user-select: text;
        }

        .form-field textarea {
            min-height: 170px;
            resize: vertical;
        }

        .form-field input::placeholder,
        .form-field textarea::placeholder {
            color: rgba(224, 224, 224, 0.34);
        }

        .form-field input:focus,
        .form-field textarea:focus {
            border-color: var(--gold-light);
            background: rgba(10, 10, 10, 0.95);
            box-shadow: 0 0 0 1px rgba(175, 141, 95, 0.22), 0 0 24px rgba(175, 141, 95, 0.08);
        }

        .privacy-check {
            display: grid;
            grid-template-columns: 18px 1fr;
            align-items: start;
            gap: 0.75rem;
            color: rgba(224, 224, 224, 0.62);
            font-size: 0.76rem;
            line-height: 1.55;
        }

        .privacy-check input {
            width: 17px;
            height: 17px;
            margin-top: 0.15rem;
            accent-color: var(--gold);
        }

        .privacy-check a {
            color: var(--gold-light);
            text-underline-offset: 3px;
        }

        .form-privacy-link {
            padding: 0;
            border: 0;
            background: none;
            color: var(--gold-light);
            font: inherit;
            text-decoration: underline;
            text-underline-offset: 3px;
            cursor: pointer;
        }

        .form-submit {
            min-height: 52px;
            border: 1px solid var(--gold);
            border-radius: 0;
            background: var(--gold);
            color: var(--dark-bg);
            font: inherit;
            font-size: 0.82rem;
            font-weight: 700;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            cursor: pointer;
            transition: background 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
        }

        .form-submit:hover:not(:disabled),
        .form-submit:focus-visible {
            background: var(--gold-light);
            border-color: var(--gold-light);
            box-shadow: 0 0 28px rgba(175, 141, 95, 0.25);
        }

        .form-submit:disabled {
            cursor: wait;
            opacity: 0.55;
        }

        .form-status {
            min-height: 1.5em;
            color: rgba(224, 224, 224, 0.72);
            font-size: 0.78rem;
            text-align: center;
        }

        .form-status.success {
            color: #b9d7b7;
        }

        .form-status.error {
            color: #ef9992;
        }

        .form-honeypot {
            position: absolute !important;
            left: -10000px !important;
            width: 1px !important;
            height: 1px !important;
            overflow: hidden !important;
        }

        .channel-strip {
            max-width: 1180px;
            margin: 1.4rem auto 0;
            padding-top: 1.1rem;
            padding-bottom: 50px;
            border-top: 1px solid rgba(175, 141, 95, 0.12);
            text-align: center;
        }

        .channel-label {
            color: rgba(224, 224, 224, 0.42);
            font-size: 0.7rem;
            letter-spacing: 0.14em;
            text-transform: uppercase;
        }

        .social-links {
            display: flex;
            justify-content: center;
            gap: 0.85rem;
            margin-top: 0.9rem;
            margin-bottom: 0;
            flex-wrap: nowrap;
        }

        .social-links a,
        .social-link {
            width: 50px;
            height: 50px;
            background: transparent;
            border: 1px solid rgba(175, 141, 95, 0.42);
            border-radius: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--gold);
            text-decoration: none;
            transition: all 0.3s ease;
            flex-shrink: 0;
        }

        .social-link.pending {
            opacity: 0.42;
            cursor: default;
        }

        .social-links a svg,
        .social-link svg {
            width: 28px;
            height: 28px;
        }

        .social-links a:hover {
            color: white;
            border-color: white;
            transform: translateY(-3px);
            box-shadow: 0 5px 15px rgba(175, 141, 95, 0.4);
        }

        /* Footer */
        footer {
            background: var(--dark-section);
            padding: 0 5%;
            border-top: 1px solid rgba(175, 141, 95, 0.1);
        }

        .footer-inner {
            max-width: 1400px;
            margin: 0 auto;
            min-height: 72px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 2rem;
        }

        .footer-brand {
            display: flex;
            align-items: center;
            gap: 0.8rem;
            text-align: left;
        }

        .footer-brand img {
            width: 40px;
            height: 40px;
            object-fit: contain;
            flex-shrink: 0;
        }

        .footer-brand strong {
            display: block;
        }

        .footer-brand strong {
            color: var(--text-light);
            font-size: 0.95rem;
            letter-spacing: 0.02em;
        }

        .footer-division,
        .footer-copyright {
            display: block;
            margin-top: 0.1rem;
            font-size: 0.72rem;
            color: rgba(224, 224, 224, 0.58);
        }

        .footer-division a {
            color: inherit;
            
            text-underline-offset: 3px;
            transition: color 0.2s ease;
        }

        .footer-division a:hover,
        .footer-division a:focus-visible {
            color: var(--gold-light);
            text-decoration: underline;
            outline: none;
        }

        .footer-right {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 0.3rem;
            text-align: right;
        }

        .footer-links {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 1rem;
        }

        .footer-links a {
            color: var(--gold);
            text-decoration: none;
            font-size: 0.9rem;
            transition: color 0.3s ease;
            cursor: pointer;
        }

        .footer-links a:hover {
            color: white;
        }

        .footer-links .separator {
            color: var(--gold);
            opacity: 0.5;
        }

        /* Tablet fine-tuning: denser studio copy and a tighter handoff to the footer */
        @media (min-width: 769px) and (max-width: 1180px) {
            .about {
                padding-top: 64px;
                padding-bottom: 64px;
            }

            .about-content {
                max-width: 820px;
            }

            .about .section-title {
                margin-bottom: 1.1rem;
            }

            .about-text h3 {
                font-size: 2.2rem;
                margin-bottom: 1.15rem;
            }

            .about-text p {
                font-size: 1.08rem;
                line-height: 1.66;
                margin-bottom: 1.15rem;
            }

            .about-text .studio-outlook {
                margin-top: 1.6rem;
                padding: 1.25rem 1.4rem;
                font-size: 1rem;
                line-height: 1.62;
            }

            footer {
                padding: 0 5%;
            }

            .footer-inner {
                min-height: 72px;
            }
        }

        /* --- TOUCH DEVICE ADAPTIONS (iPads, Tablets, Phones) --- */
        @media (hover: none) and (pointer: coarse) {
            /* Hide Fullscreen on touch devices (Fixes iPadOS/iOS QuickTime bug) */
            #fullscreenToggle,
            #fullscreenToggle + .pill-separator {
                display: none !important;
            }
        }

        /* Responsive & Mobile Fixes */
        @media (max-width: 768px) {
            .hamburger {
                display: flex;
            }

            .hamburger {
                position: relative;
                z-index: 10002;
            }

            nav ul {
                position: fixed;
                top: 0;
                right: -100%;
                width: 70%;
                height: 100vh;
                background: rgba(10, 10, 10, 0.75);
                backdrop-filter: blur(20px);
                flex-direction: column;
                justify-content: center;
                align-items: center;
                gap: 3rem;
                transition: right 0.4s ease;
                border-left: 1px solid var(--gold);
                z-index: 10001;
            }

            nav ul.active {
                right: 0;
            }

            nav ul li {
                opacity: 0;
                transform: translateX(50px);
                transition: all 0.4s ease;
            }

            nav ul.active li {
                opacity: 1;
                transform: translateX(0);
            }

            nav ul.active li:nth-child(1) { transition-delay: 0.1s; }
            nav ul.active li:nth-child(2) { transition-delay: 0.2s; }
            nav ul.active li:nth-child(3) { transition-delay: 0.3s; }
            nav ul.active li:nth-child(4) { transition-delay: 0.4s; }
            nav ul.active li:nth-child(5) { transition-delay: 0.5s; }

            nav a {
                font-size: 1.5rem;
            }

            .hero {
                min-height: auto;
                align-items: flex-start;
                padding-top: 66px;
                padding-bottom: 50px;
            }

            .hero .simulator-brand {
                font-size: 2.5rem;
                margin-bottom: 0.3rem; /* Etwas mehr Luft auf Mobile */
            }

            .hero p {
                font-size: 0.95rem;
                margin-top: 0;
                margin-bottom: 2rem;
            }

            .hero-content {
                margin-top: 0;
            }

            .hero-player-container {
                margin-top: 20px;
                margin-bottom: 2rem;
            }

            .about,
            .features {
                padding-top: 52px;
                padding-bottom: 52px;
            }

            .tools {
                padding-top: 50px;
                padding-bottom: 50px;
            }

            .section-title {
                font-size: 2.2rem;
                margin-bottom: 2rem;
                /* Sicherstellen, dass Bugfix auch hier greift */
                width: fit-content;
                margin-left: auto;
                margin-right: auto;
            }

            .about .section-title {
                margin-bottom: 0.9rem;
            }

            .about-text h3 {
                font-size: 1.65rem;
                width: fit-content;
                margin-left: auto;
                margin-right: auto;
            }

            .about-text p {
                font-size: 1rem;
                line-height: 1.65;
                margin-bottom: 1.15rem;
            }

            .about-text .studio-outlook {
                margin-top: 1.5rem;
                padding: 1.2rem 1rem;
                line-height: 1.6;
            }

            /* 2 columns for feature cards on mobile */
            .features-grid {
                grid-template-columns: repeat(2, 1fr);
                gap: 1.2rem;
            }

            .feature-card {
                padding: 1.5rem 0.8rem;
                cursor: pointer;
            }

            .feature-card.expanded {
                background: rgba(10, 10, 10, 0.85);
                border-color: rgba(255, 255, 255, 0.7);
            }

            .feature-card h3 {
                font-size: 1.1rem;
                line-height: 1.2;
            }

            .feature-card p {
                font-size: 0.75rem;
                max-height: 0;
                overflow: hidden;
                opacity: 0;
                transition: all 0.3s ease;
                margin-top: 0;
                line-height: 1.4;
            }

            .feature-card.expanded p {
                max-height: 200px;
                opacity: 1;
                margin-top: 0.5rem;
            }

            .feature-icon {
                width: 35px;
                height: 35px;
                margin-bottom: 0.8rem;
            }

            .video-grid {
                grid-template-columns: 1fr;
            }

            nav .logo img {
                height: 40px;
            }

            .contact-container {
                grid-template-columns: 1fr;
            }

            

            

            

            .contact-intro {
                border-right: 0;
                border-bottom: 1px solid rgba(175, 141, 95, 0.18);
            }

            .form-grid {
                grid-template-columns: 1fr;
            }

            .form-field input,
            .form-field textarea {
                font-size: 16px;
            }

            .channel-strip {
                margin-top: 1rem;
                padding-top: 0.9rem;
                padding-bottom: 48px;
            }

            .contact {
                padding-top: 52px;
                padding-bottom: 0;
            }

            .social-links {
                gap: 0.5rem;
            }

            .social-links a,
            .social-link {
                width: clamp(48px, 13vw, 50px);
                height: clamp(48px, 13vw, 50px);
            }

            .social-links a svg,
            .social-link svg {
                width: 27px;
                height: 27px;
            }

            .cta-button {
                font-size: 0.95rem;
                padding: 0.9rem 2.5rem;
            }

            /* Center language switcher on mobile */
            nav .container {
                position: relative;
                height: 66px;
            }

            .language-switcher {
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
                z-index: 10004;
            }

            .language-trigger {
                height: 36px;
                min-width: 78px;
                padding: 0 0.65rem;
            }

            .language-menu {
                left: 50%;
                right: auto;
                width: min(250px, calc(100vw - 2rem));
                transform: translateX(-50%);
            }

            footer {
                padding: 0.35rem 5%;
            }

            .footer-inner {
                min-height: 72px;
                flex-direction: column;
                align-items: stretch;
                gap: 0.35rem;
            }

            .footer-brand {
                width: 100%;
                justify-content: flex-start;
                text-align: left;
                align-items: center;
            }

            .footer-right {
                width: 100%;
                text-align: center;
                align-items: center;
            }

            .footer-links {
                justify-content: center;
                gap: 0.55rem;
                width: 100%;
            }

            .footer-links a {
                font-size: 0.78rem;
                white-space: nowrap;
            }

            .footer-copyright {
                font-size: 0.62rem;
                line-height: 1.35;
                color: rgba(224, 224, 224, 0.46);
            }

            /* --- NEU: Fix für Impressum & Datenschutz auf Handy --- */

            /* 1. Container geht bis ganz nach oben */
            .text-modal {
                padding-top: 0 !important;
                align-items: flex-start !important;
            }

            /* 2. Die Box füllt den ganzen Bildschirm aus */
            .text-modal-content {
                margin: 0 !important;
                width: 100% !important;
                min-height: 100vh; /* Volle Bildschirmhöhe */
                border: none; /* Kein Rahmen mehr nötig */
                border-radius: 0;
                padding: 5rem 1.5rem 2rem 1.5rem; /* Oben viel Platz lassen für den X-Button */
            }

            /* 3. Schriftgröße verkleinern & Umbruch erlauben */
            .text-modal h2 {
                font-size: 1.8rem; /* Kleiner als 2.5rem */
                word-wrap: break-word; /* Erzwingt Umbruch bei langen Wörtern */
                hyphens: auto; /* Automatische Silbentrennung */
                line-height: 1.2;
            }

            /* 4. Schließen-Button festpinnen, damit er beim Scrollen sichtbar bleibt */
            .text-modal .modal-close {
                position: fixed; /* Bleibt stehen beim Scrollen */
                top: 20px;
                right: 20px;
                background: rgba(0, 0, 0, 0.8); /* Dunkler Hintergrund für Lesbarkeit */
                z-index: 10005;
            }

            /* Compact replay control, centered over the final frame. */
            .simulation-btn {
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                margin: 0;
                padding: 0.75rem 1.1rem;
                font-size: 0.72rem;
            }

            .simulation-btn.visible {
                position: absolute;
            }

            .simulation-btn:hover {
                transform: translate(-50%, -50%) scale(1.05);
            }
        }

        @media (max-width: 1180px) and (pointer: coarse) {
            .video-modal {
                background: #000;
            }

            .video-modal .modal-content,
            .video-modal .modal-content.format-9-16,
            .video-modal .modal-content.format-16-9 {
                width: 100%;
                height: 100%;
                max-width: none;
                max-height: none;
                aspect-ratio: auto;
                border: 0;
                box-shadow: none;
            }

            .video-modal .modal-close {
                width: 44px;
                height: 44px;
            }

            .video-share-button {
                right: max(8px, env(safe-area-inset-right));
                bottom: max(36px, calc(env(safe-area-inset-bottom) + 26px));
                color: rgba(255, 255, 255, 0.78);
                transition: opacity 0.35s ease, visibility 0.35s ease, background 0.12s ease;
            }

            .video-share-menu {
                left: 50%;
                top: 50%;
                right: auto;
                bottom: auto;
                width: min(330px, calc(100% - 28px - env(safe-area-inset-left) - env(safe-area-inset-right)));
                transform: translate(-50%, -50%);
                animation: videoShareMenuInCentered 0.15s ease-out;
            }
        }

        /* The browser-level iOS player already supplies its own close control.
           This lightweight control is only for GML's large in-page player. */
        @media (max-width: 1180px) and (pointer: coarse) {
            .is-ios .video-share-button {
                right: max(2px, env(safe-area-inset-right));
                bottom: max(28px, calc(env(safe-area-inset-bottom) - 4px));
            }

            .is-ios .video-modal .modal-close {
                top: max(12px, calc(env(safe-area-inset-top) + 12px));
                right: max(2px, env(safe-area-inset-right));
                color: rgba(255, 255, 255, 0.78);
                background: transparent;
                border: 0;
                border-radius: 50%;
                box-shadow: none;
                backdrop-filter: none;
                -webkit-backdrop-filter: none;
                transform: none;
                opacity: 1;
                visibility: visible;
                transition: opacity 0.4s ease, visibility 0.4s ease, background 0.12s ease;
            }

            .is-ios .video-modal .modal-close:hover,
            .is-ios .video-modal .modal-close:focus-visible,
            .is-ios .video-modal .modal-close:active {
                color: rgba(255, 255, 255, 0.92);
                background: rgba(58, 58, 58, 0.72);
                transform: none;
                outline: none;
            }

            .is-ios .video-modal .modal-close svg {
                width: 20px;
                height: 20px;
                stroke-width: 1.85;
            }

            .is-ios .video-modal .modal-close.is-hidden {
                opacity: 0;
                visibility: hidden;
                pointer-events: none;
            }
        }
        #gml-shadow-cameo {
            position: fixed; left: 0; top: 50%; bottom: auto;
            transform: translateY(-50%) scale(1.1);
            width: min(64.8vh, 630px, 90vw); height: min(64.8vh, 630px, 90vw);
            pointer-events: none; z-index: 890; opacity: 0;
            transition: opacity 0.8s ease;
        }
        #gml-shadow-cameo { transform-origin: left center; }
        #gml-shadow-cameo.is-visible { opacity: 1; }
        #gml-shadow-cameo.is-right-shadow {
            transform: translateY(-50%) scale(1.21);
            transform-origin: right center;
        }
        @media (min-width: 600px) and (orientation: portrait) and (pointer: coarse) {
            #gml-shadow-cameo {
                width: min(77.76vh, 756px, 108vw);
                height: min(77.76vh, 756px, 108vw);
            }
        }
        @media (min-width: 1181px) and (pointer: fine) {
            #gml-shadow-cameo { width: 90vh; height: 90vh; }
        }
        @media (hover: hover) and (pointer: fine) {
            #gml-shadow-cameo { transform: translateY(-50%) scale(.99); }
            #gml-shadow-cameo.is-right-shadow { transform: translateY(-50%) scale(1.1495); }
        }
        .gml-idle-ant { position:fixed; z-index:901; pointer-events:none; overflow:visible; }
        .gml-idle-ant .leg { transform-box:fill-box; transform-origin:50% 0; animation:gml-ant-step .22s ease-in-out infinite alternate; }
        .gml-idle-ant .leg.b { animation-delay:-.22s; }
        @keyframes gml-ant-step { from { transform:rotate(-14deg); } to { transform:rotate(14deg); } }
        #gml-scan { position:fixed; inset:0; z-index:889; pointer-events:none; overflow:hidden; }
        #gml-scan .beam { position:absolute; top:0; bottom:0; width:2px; background:#b5ffff; box-shadow:0 0 12px #70edf4,0 0 48px 15px #64e7ed55; }
#gml-lucia-spotlight {
            position:fixed; inset:0; width:100%; height:100%; z-index:889;
            pointer-events:none; opacity:0; mix-blend-mode:screen;
        }
        #gml-marc-focus {
            position:fixed; inset:0; z-index:889; pointer-events:none;
            background:rgba(0,0,0,0); backdrop-filter:blur(0px); -webkit-backdrop-filter:blur(0px);
        }
    

/* Source 2 base */

/* Modality: full viewport opening; existing studio design is preserved. */
#preloader { display:none !important; }
.film-entry { position:relative; height:100vh; height:100svh; width:100%; overflow:hidden; background:#0a0a0a; isolation:isolate; }
.film-entry-image, .film-entry-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 50%; }
.film-entry-image { z-index:-3; }
.film-entry-video { z-index:-2; opacity:0; transition:opacity .45s ease; }
.film-entry.has-frame .film-entry-video { opacity:1; }
.film-entry::after { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(180deg,rgba(0,0,0,.42),transparent 25%,transparent 52%,rgba(10,10,10,.35) 76%,#0a0a0a 100%); }
nav:not(.scrolled) { background:linear-gradient(180deg,rgba(0,0,0,.3),rgba(0,0,0,.03)); backdrop-filter:none; -webkit-backdrop-filter:none; border-bottom-color:rgba(175,141,95,.08); }
.film-entry-copy { position:absolute; left:max(6vw,24px); bottom:clamp(54px,9vh,110px); max-width:calc(100% - 48px); }
.film-entry-eyebrow { color:#e4d8c4; font-size:clamp(.6rem,.72vw,.8rem); letter-spacing:.18em; text-transform:uppercase; font-weight:500; margin:0 0 4px; text-shadow:0 1px 8px #000; }
.film-entry-title { font-family:"Bebas Neue",sans-serif; font-size:clamp(3.5rem,7.2vw,8rem); font-weight:400; line-height:1; letter-spacing:.06em; color:#d9bd88; margin:0; text-shadow:0 2px 22px rgba(0,0,0,.3); }
.film-entry-links { display:flex; flex-wrap:wrap; gap:12px 24px; margin-top:20px; }
.film-entry-links a { color:#f2e9da; font-size:.76rem; letter-spacing:.05em; text-decoration:none; border-bottom:1px solid rgba(208,175,117,.7); padding:4px 0 7px; }
.film-entry-links a:hover { color:#d9bd88; }
.film-entry-toggle { position:absolute; right:max(6vw,24px); bottom:clamp(54px,9vh,110px); width:38px; height:38px; display:grid; place-items:center; border:1px solid rgba(216,186,130,.55); border-radius:0; color:#e3c890; background:rgba(0,0,0,.28); cursor:pointer; }
.film-entry-toggle svg { width:15px; height:15px; fill:currentColor; }
.film-entry-toggle[hidden] { display:none; }
.film-entry-toggle .film-icon-play { display:none; }
.film-entry-toggle.is-paused .film-icon-pause { display:none; }
.film-entry-toggle.is-paused .film-icon-play { display:block; }
.film-entry a:focus-visible,.film-entry button:focus-visible { outline:2px solid #e3c890; outline-offset:5px; }
@media(max-width:767px) {
 .film-entry-copy { bottom:64px; max-width:calc(100% - 90px); }
 .film-entry-eyebrow { max-width:240px; line-height:1.7; }
 .film-entry-toggle { right:18px; bottom:64px; }
 .film-entry-links { gap:12px 18px; margin-top:14px; }
 .film-entry-links a { font-size:.68rem; }
}
@media(max-height:480px) and (orientation:landscape) {
 .film-entry-copy,.film-entry-toggle { bottom:28px; }
 .film-entry-title { font-size:3.5rem; }
 .film-entry-links { margin-top:8px; }
}
@media(prefers-reduced-motion:reduce) { .film-entry-video { transition:none; } }



/* Source 3 gml-card-edge-style */

/* Proximity border light: no blur, masks or full-card light layer. */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
    .gml-edge-card::after {
        content:"";
        position:absolute;
        inset:0;
        pointer-events:none;
        z-index:3;
        border:1px solid transparent;
        border-image-source:radial-gradient(180px circle at var(--gml-edge-x,-999px) var(--gml-edge-y,-999px), rgba(212,175,110,.96) 0%, rgba(190,149,84,.72) 36%, rgba(175,141,95,0) 76%);
        border-image-slice:1;
        opacity:var(--gml-edge-opacity,0);
        transition:opacity .12s ease-out;
    }
}



/* Source 4 film-entry96-refinements */

#home.film-entry { padding:0; }
/* A clear language button over the opening film. Dropdown stays legible. */
nav:not(.scrolled) .language-trigger,
nav:not(.scrolled) .language-trigger:hover,
nav:not(.scrolled) .language-trigger[aria-expanded="true"] {
    background:transparent;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    box-shadow:none;
}
/* Portrait phone and tablet: square picture, copy underneath. */
@media (orientation:portrait) and (max-width:1180px) {
    #home.film-entry { height:auto; min-height:0; padding-top:72px; }
    #filmEntry.film-entry { position:relative !important; inset:auto !important; height:auto; min-height:0; }
    #filmEntry .film-entry-image,
    #filmEntry .film-entry-video { inset:0 0 auto; width:100%; height:auto; aspect-ratio:1 / 1; object-fit:cover; object-position:center; }
    #filmEntry::after { inset:0 0 auto; height:auto; aspect-ratio:1 / 1; background:linear-gradient(180deg,transparent 60%,rgba(10,10,10,.15) 85%,#0a0a0a 100%); }
    #filmEntry .film-entry-copy { position:relative; left:auto; bottom:auto; max-width:none; margin-top:100%; padding:20px 24px 36px; }
    #filmEntry .film-entry-title { font-size:clamp(3.5rem,10vw,6rem); }
    #filmEntry .film-entry-eyebrow { max-width:none; }
    #filmEntry .film-entry-toggle { top:16px; right:16px; bottom:auto; }
}
@media (orientation:portrait) and (max-width:767px) {
    #home.film-entry { padding-top:66px; }
}



/* Source 5 film-entry96-white-title */

.film-entry-title { color:#f4f4f2; }
.film-entry-eyebrow,.film-entry-links a { color:#d9bd88; }
.film-entry-links a:hover { color:#ffffff; }


/* Source 6 gml-wide-layout */

:root { --page-gutter:clamp(16px,2.5vw,72px); --gallery-gap:clamp(12px,1.1vw,24px); }
nav,nav.scrolled { padding-inline:var(--page-gutter); }
nav .container { width:100%; max-width:none; gap:24px; }
@media(min-width:769px) {
 nav ul { margin-left:auto; margin-right:clamp(12px,2vw,48px); gap:clamp(16px,2.1vw,48px); white-space:nowrap; font-size:clamp(.78rem,.9vw,1rem); }
}
section:not(#home):not(#simulation), .tools { padding-inline:var(--page-gutter); }
.film-entry-copy { left:var(--page-gutter); }
.film-entry-toggle { right:var(--page-gutter); }
#about .about-content,.features-grid,.showcase-panels,.contact-container,.channel-strip,.footer-inner { width:100%; max-width:none; }
#about .about-text { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px clamp(32px,5vw,140px); text-align:left; }
#about .about-text h3 {  justify-self:start; margin:0; padding:0; }
#about .about-text p { width:100%; max-width:75ch; margin:0; justify-self:center; font-size:clamp(1rem,.95vw,1.2rem); }
#about .about-text .studio-outlook { padding:1.5rem; }
.features-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(18px,1.7vw,44px); }
.feature-card { padding:clamp(28px,2.4vw,56px) clamp(20px,2vw,44px); }
.feature-card p { max-width:45ch; margin-inline:auto; }
.showcase-tabs { width:100%; max-width:none; margin-bottom:20px; }
.gallery-toolbar { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:12px 18px; margin-bottom:26px; min-height:40px; color:#d5c5aa; font-size:.78rem; }
.gallery-toolbar label { white-space:nowrap; }
.gallery-toolbar input { width:clamp(130px,15vw,240px); accent-color:#af8d5f; cursor:pointer; }
.gallery-toolbar output { min-width:7em; color:#e0e0e0; font-variant-numeric:tabular-nums; }
.gallery-toolbar button { padding:7px 12px; border:1px solid rgba(175,141,95,.5); border-radius:0; background:transparent; color:#d5c5aa; cursor:pointer; font:inherit; }
.gallery-toolbar :focus-visible { outline:2px solid #d9bd88; outline-offset:4px; }
.showcase-panel { width:100%; margin-left:0; }
.showcase-track { width:100%; max-width:none; margin:0; display:grid; grid-template-columns:repeat(var(--gml-gallery-columns,4),minmax(0,1fr)); gap:var(--gallery-gap); padding:0; overflow:visible; scroll-snap-type:none; }
.showcase-video-card { width:100%; min-width:0; flex:initial; }
.showcase-card-copy strong { overflow-wrap:anywhere; }
.showcase-card-copy { min-height:84px; }
.showcase-carousel-controls { display:none !important; }
.contact-container { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.contact-intro { padding:clamp(24px,3.5vw,80px); }
.contact-intro p { max-width:65ch; }
.project-form { width:100%; max-width:1100px; justify-self:end; padding:clamp(24px,3.5vw,80px); }
footer { padding-inline:var(--page-gutter); }
.studio-experiment { width:100%; margin-top:40px; border:1px solid rgba(175,141,95,.3); background:#101010; }
.studio-experiment summary { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 24px; cursor:pointer; color:#d9bd88; list-style:none; font-size:.85rem; letter-spacing:.04em; }
.studio-experiment summary::-webkit-details-marker { display:none; }
.studio-experiment summary::after { content:"+"; font-size:1.6rem; line-height:1; }
.studio-experiment[open] summary::after { content:"−"; }
.studio-experiment summary:focus-visible { outline:2px solid #d9bd88; outline-offset:3px; }
.studio-experiment #simulation { min-height:0; padding:30px 24px 50px; }
.studio-experiment .hero-player-container { max-width:720px; margin:0 auto 30px; }
.studio-experiment .hero-content { animation:none; }
@media(min-width:2400px) {
 #about .about-text { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .features-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }
}
@media(max-width:1180px) {
 .features-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 #about .about-text { gap:22px 32px; }
}
@media(max-width:768px) {
 nav .container { gap:12px; }
 #about .about-text { grid-template-columns:1fr; }
 #about .about-text h3 { font-size:1.7rem; }
 .features-grid { grid-template-columns:1fr; }
 .gallery-toolbar { justify-content:flex-start; gap:12px; }
 .gallery-toolbar input { flex:1 1 100px; min-width:100px; width:auto; }
 .gallery-toolbar output { min-width:6em; }
 .showcase-panel { width:100%; margin:0; }
 .showcase-track { display:grid; padding:0; overflow:visible; width:100%; }
 .showcase-video-card { width:100%; flex:initial; }
 .showcase-tabs { margin-bottom:16px; }
 .showcase-card-copy { padding:12px; }
 .showcase-card-copy strong { font-size:.85rem; }
 .contact-container { grid-template-columns:1fr; }
 .project-form { max-width:none; }
 .studio-experiment summary { padding:18px 16px; }
 .studio-experiment #simulation { padding:24px 12px 36px; }
 footer { padding-inline:var(--page-gutter); }
}



/* Source 7 gml-mobile961 */

/* Keep the familiar icon; give it native button semantics and a full touch target. */
.hamburger { appearance:none; background:transparent; border:0; padding:7px; width:44px; height:44px; align-items:center; justify-content:center; flex-shrink:0; }
.hamburger:focus-visible { outline:2px solid var(--gold-light); outline-offset:3px; }
.language-menu { max-height:calc(100vh - 90px); max-height:calc(100dvh - 90px); overflow-y:auto; overscroll-behavior:contain; }
@media(max-width:768px) {
 #navMenu { height:100vh; height:100dvh; padding:82px 16px 24px; gap:clamp(12px,4vh,40px); overflow-y:auto; overscroll-behavior:contain; visibility:hidden; pointer-events:none; }
 #navMenu.active { visibility:visible; pointer-events:auto; }
 #navMenu a { display:block; min-height:44px; padding:4px 0; }
}
@media(max-width:768px) and (max-height:480px) {
 #navMenu { justify-content:flex-start; padding:70px 16px 12px; gap:4px; }
 #navMenu a { min-height:44px; font-size:1.25rem; line-height:1.4; }
}
@media(pointer:coarse) {
 .language-trigger,.language-option { min-height:44px; }
 #navMenu a { display:flex; align-items:center; min-height:44px; }
 .film-entry-toggle { width:44px; height:44px; background:rgba(0,0,0,.62); }
 .gallery-toolbar input { min-height:44px; }
 .gallery-toolbar button { min-height:44px; }
 .form-field input,.form-field textarea { font-size:16px; }
 /* Applies to all touch browsers, including large iPads in landscape. */
 .video-modal .modal-close,.is-ios .video-modal .modal-close { top:max(12px,env(safe-area-inset-top)); right:max(12px,env(safe-area-inset-right)); width:44px; height:44px; }
 .video-share-button { width:44px; height:44px; }
}
@media(prefers-reduced-motion:reduce) {
 #navMenu,#navMenu li { transition:none; }
}


/* Source 8 gml-refinements962 */

#navbar { --nav-progress:0; background:linear-gradient(180deg,rgba(0,0,0,calc(.3 * (1 - var(--nav-progress)))),rgba(0,0,0,calc(.03 * (1 - var(--nav-progress))))),rgba(10,10,10,calc(.86 * var(--nav-progress))); backdrop-filter:blur(calc(24px * var(--nav-progress))); -webkit-backdrop-filter:blur(calc(24px * var(--nav-progress))); box-shadow:0 5px 30px rgba(0,0,0,calc(.5 * var(--nav-progress))); transition:none; }
#navbar .language-trigger { background:rgba(10,10,10,calc(.38 + .24 * var(--nav-progress))); backdrop-filter:blur(28px); -webkit-backdrop-filter:blur(28px); border-color:rgba(217,189,136,.5); color:#f4f4f2; }
#navbar .language-trigger:hover,#navbar .language-trigger[aria-expanded="true"] { background:rgba(10,10,10,.7); }
#navbar .language-menu { background:rgba(10,10,10,.82); backdrop-filter:blur(36px); -webkit-backdrop-filter:blur(36px); }
.showcase-card-copy { display:flex; flex-direction:column; min-height:0; }
.showcase-card-copy strong { min-height:var(--gallery-title-height,0px); flex:none; }
.showcase-card-copy > span { min-height:var(--gallery-subtitle-height,0px); margin-top:auto; }
@media (orientation:landscape) and (min-width:769px) and (max-width:1400px) { .features-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) {
 .showcase-card-copy { padding:10px 6px; }
 .showcase-card-copy strong { font-size:.72rem; line-height:1.4; }
 .showcase-card-copy > span { font-size:.6rem; line-height:1.4; overflow-wrap:anywhere; }
 .showcase-track { gap:8px; }
 .showcase-play { width:32px; height:32px; font-size:16px; }
}


/* Source 9 gml-grid-toggle963 */

.showcase-panels { touch-action:pan-y; }
.gallery-toolbar-compact { transition:opacity .3s ease; }
.gallery-toolbar-compact.is-gesture-hidden:not(:focus-within) { opacity:0; }
.gallery-toolbar-compact { justify-content:flex-end; margin-bottom:14px; min-height:36px; }
#gallerySizeToggle { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-width:58px; min-height:36px; padding:6px 10px; border-color:rgba(175,141,95,.18); color:#c7b99f; background:transparent; font-size:.72rem; }
#gallerySizeToggle svg { width:16px; height:16px; }
#gallerySizeToggle:hover { color:#e3c890; border-color:rgba(175,141,95,.5); background:rgba(175,141,95,.06); }
.gallery-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(pointer:coarse) { #gallerySizeToggle { min-height:44px; min-width:64px; } }


/* Source 10 gml-language-contrast964 */

#navbar .language-option { color:rgba(244,244,242,.94); }
#navbar .language-option.active { color:var(--gold-light); background:rgba(175,141,95,.2); }
#navbar .language-option:hover,#navbar .language-option:focus-visible { color:#fff; background:rgba(175,141,95,.24); }


/* Source 11 gml-language-backdrop964 */

#navbar { background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none; }
#navbar::before { content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,calc(.3 * (1 - var(--nav-progress)))),rgba(0,0,0,calc(.03 * (1 - var(--nav-progress))))),rgba(10,10,10,calc(.86 * var(--nav-progress)));backdrop-filter:blur(calc(24px * var(--nav-progress)));-webkit-backdrop-filter:blur(calc(24px * var(--nav-progress))); }


/* Source 12 gml-phone-production965 */

@media(max-width:768px) {
 .features-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
 .feature-card { min-width:0; padding:22px 10px; }
 .feature-card h3 { font-size:clamp(.95rem,4vw,1.1rem); line-height:1.25; overflow-wrap:anywhere; }
 .feature-card p { font-size:.75rem; line-height:1.5; }
 .feature-card.expanded p { max-height:none; overflow:visible; }
 .feature-icon { width:32px; height:32px; margin:0 auto 12px; }
}


/* Source 13 gml-play-icons966 */

.showcase-play { display:flex; align-items:center; justify-content:center; font-size:0; line-height:normal; flex-shrink:0; }
.showcase-play::before { content:none; display:none; }
.showcase-play > svg { display:block; width:40%; height:40%; flex:none; fill:currentColor; transform:translateX(1px); pointer-events:none; }


/* Source 14 gml-grid-motion968 */

.showcase-panels { overflow-anchor:none; }
@media(hover:none) { button.showcase-video-card:hover { transform:none; } }


/* Source 15 gml-poster-ratio969 */

.showcase-poster { aspect-ratio:3 / 4; }
.showcase-poster img,.showcase-preview { object-fit:cover; object-position:50% 25%; }


/* Source 16 gml-worlds97 */

.interactive-worlds { background:#0c0c0c; }
.world-project { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); border:1px solid rgba(175,141,95,.26); background:linear-gradient(130deg,#141310,#101010 65%); }
.world-project-visual { display:block; position:relative; min-width:0; align-self:center; margin:clamp(16px,2.5vw,48px); overflow:hidden; border:1px solid rgba(175,141,95,.25); color:#f0e9df; text-decoration:none; }
.world-project-visual img { display:block; width:100%; height:auto; }
.world-visual-caption { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 18px; background:#101010; font-size:.65rem; letter-spacing:.13em; }
.world-project svg { flex:none; width:18px; height:18px; }
.world-project-copy { min-width:0; padding:clamp(26px,3.5vw,72px) clamp(24px,3vw,64px) clamp(26px,3.5vw,72px) 0; align-self:center; }
.world-project-kicker { color:#c2aa84; font-size:.65rem; text-transform:uppercase; letter-spacing:.13em; line-height:1.8; margin-bottom:16px; }
.world-project-copy h3 { font-family:"Bebas Neue",sans-serif; font-weight:400; font-size:clamp(2.6rem,4vw,5.5rem); letter-spacing:.055em; line-height:1.1; color:#e8e5df; margin-bottom:16px; overflow-wrap:anywhere; }
.world-project-tagline { color:#ddd4c6; font-size:clamp(1.05rem,1.35vw,1.65rem); line-height:1.4; margin-bottom:20px; }
.world-project-description { max-width:55ch; font-size:clamp(.85rem,.9vw,1.05rem); line-height:1.85; color:#bdbab5; }
.world-project-disciplines { font-size:.7rem; line-height:1.8; color:#b59c74; margin:24px 0; }
.world-project-primary,.world-project-secondary { display:inline-flex; align-items:center; justify-content:center; gap:18px; min-height:46px; padding:12px 20px; text-decoration:none; font-size:.78rem; line-height:1.6; }
.world-project-primary { background:#c2a16a; color:#101010; border:1px solid #c2a16a; }
.world-project-primary:hover { background:#dec28e; border-color:#dec28e; }
.world-project-secondary { color:#d9bd88; border:1px solid rgba(175,141,95,.45); background:transparent; flex-shrink:0; }
.world-project-secondary:hover { color:#fff; border-color:#d9bd88; }
.world-project-offer { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:28px; padding:28px clamp(24px,3vw,64px); border-top:1px solid rgba(175,141,95,.22); }
.world-offer-heading { color:#ddd4c6; font-size:1rem; margin-bottom:5px; }
.world-offer-description { color:#a9a6a1; font-size:.8rem; line-height:1.8; max-width:70ch; }
.world-project a:focus-visible { outline:2px solid #e3c890; outline-offset:5px; }
@media(min-width:2400px) { .world-project { grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); } .world-project-description { font-size:1.2rem; } }
@media(max-width:1050px) {
 .world-project { grid-template-columns:minmax(0,1fr); }
 .world-project-visual { margin:24px 24px 0; }
 .world-project-copy { padding:28px 32px 36px; }
 .world-project-copy h3 { font-size:clamp(2.7rem,6vw,4.5rem); }
 .world-project-offer { padding:28px 32px; }
}
@media(max-width:600px) {
 #worlds { scroll-margin-top:76px; }
 .world-project-visual { margin:12px 12px 0; }
 .world-visual-caption { padding:12px 10px; font-size:.55rem; letter-spacing:.07em; }
 .world-project-copy { padding:24px 20px 28px; }
 .world-project-kicker { font-size:.6rem; letter-spacing:.1em; }
 .world-project-copy h3 { font-size:clamp(2.4rem,10vw,3.5rem); }
 .world-project-description { font-size:.85rem; }
 .world-project-disciplines { font-size:.65rem; }
 .world-project-offer { flex-direction:column; align-items:stretch; gap:18px; padding:24px 20px; }
 .world-project-primary,.world-project-secondary { width:100%; white-space:normal; gap:12px; padding-inline:12px; }
}


/* Source 17 gml-refinements971 */

/* Three columns / two rows on landscape tablets. Portrait stays as before. */
.modality-original-label {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
.modality-original-mark {display:block;width:clamp(280px,34vw,640px);height:auto;overflow:hidden;}
@media(orientation:portrait) and (max-width:1180px) {.modality-original-mark {width:clamp(260px,58vw,540px);}}
@media(orientation:landscape) and (min-width:769px) and (max-width:1400px) {
 .features-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
.showcase-panels,.showcase-panels * { touch-action:pan-y; }
.showcase-panels .showcase-video-card:hover,.showcase-panels .showcase-video-card:focus-visible { transform:none; }
.is-grid-moving .showcase-video-card { transition-property:border-color,box-shadow; }
.gml-edge-card {position:relative;}
.feature-card.expanded {border-color:rgba(175,141,95,.68);}
button.showcase-video-card:focus-visible,.world-project:focus-within {border-color:rgba(175,141,95,.7);}
@media(hover:hover) and (pointer:fine) {
 .feature-card:hover,button.showcase-video-card:hover,.world-project:hover {border-color:rgba(175,141,95,.68);}
}
.world-project-copy h3 { line-height:1; }
.world-project-wordmark { display:block; width:min(100%,420px); height:auto; }
.world-project-primary,.world-project-secondary {
 position:relative; isolation:isolate; overflow:hidden; background:transparent; color:var(--gold);
 border:2px solid var(--gold); font-size:.85rem; font-weight:700; letter-spacing:.055em;
 text-transform:uppercase; min-height:50px; padding:13px 24px;
 transition:color .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.world-project-primary::before,.world-project-secondary::before {
 content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(135deg,var(--gold-dark),var(--gold-light));
 transform:scaleX(0);transform-origin:left;transition:transform .35s ease;
}
.world-project-primary:hover,.world-project-secondary:hover { background:transparent;color:var(--gold);border-color:var(--gold); }
@media(hover:hover) and (pointer:fine) {
 .world-project-primary:hover,.world-project-secondary:hover { color:var(--dark-bg);box-shadow:0 0 22px rgba(175,141,95,.25); }
 .world-project-primary:hover::before,.world-project-secondary:hover::before { transform:scaleX(1); }
}
.world-project-primary:focus-visible,.world-project-secondary:focus-visible,
.world-project-primary:active,.world-project-secondary:active { color:var(--dark-bg); }
.world-project-primary:focus-visible::before,.world-project-secondary:focus-visible::before,
.world-project-primary:active::before,.world-project-secondary:active::before { transform:scaleX(1); }
.form-submit { position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(135deg,var(--gold-dark),var(--gold-light)); }
.form-submit::before {content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 25%,rgba(255,255,255,.16),transparent 75%);transform:translateX(-120%);}
@media(hover:hover) and (pointer:fine) {
 .form-submit:hover:not(:disabled)::before {transform:translateX(120%);transition:transform .65s ease;}
}
.form-submit:focus-visible {outline:2px solid var(--gold-light);outline-offset:4px;}
#worlds { padding-bottom:32px; }
#contact { padding-top:40px; }
#about .about-text .studio-release-note {
 grid-column:1/-1;max-width:none;font-size:clamp(.8rem,.85vw,.95rem);line-height:1.7;color:#a09c95;padding:4px 0 0;
}
.studio-simulator { margin-top:36px; }
.studio-simulator-label {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
.studio-simulator #simulation {min-height:0;padding:0;background:none;}
.studio-simulator .hero-content {max-width:none;animation:none;opacity:1;padding:0;}
.studio-simulator .hero-player-container {width:min(100%,680px);max-width:680px;margin:0 auto;}
.studio-simulator .hero-video-wrapper {border-radius:0;border:0;box-shadow:none;background:transparent;}
.studio-simulator .hero-video-wrapper:hover {border:0;box-shadow:none;}
.studio-simulator #particles {display:none;}
.footer-brand > div,.footer-right { display:grid;grid-template-rows:auto auto;row-gap:1px;align-content:center; }
.footer-brand strong {line-height:20px;margin:0;}
.footer-division,.footer-copyright {margin:0;line-height:14px;}
.footer-right {justify-items:end;gap:1px;}
.footer-links {min-height:20px;line-height:20px;}
.footer-links a {line-height:20px;}
@media(max-width:768px) {
 .footer-right {justify-items:center;}
 .footer-inner {gap:8px;padding-block:8px;}
}
@media(max-width:600px) {
 .world-project-wordmark {width:min(100%,300px);}
 .world-project-primary,.world-project-secondary {padding:12px;font-size:.78rem;}
 #worlds {padding-bottom:24px;} #contact {padding-top:32px;}
 
}
@media(prefers-reduced-motion:reduce) {
 .world-project-primary::before,.world-project-secondary::before,.form-submit::before {transition:none;}
}



/* Source 18 gml-polish972 */

/* Modest title size, centered studio transition and a compact square player. */
.modality-original-mark {width:clamp(257.6px,31.28vw,588.8px);max-width:100%;}
@media(orientation:portrait) and (max-width:1180px) {
 .modality-original-mark {width:clamp(239.2px,53.36vw,496.8px);}
}
#about .about-text .studio-release-note {text-align:center;}
#about .about-text .studio-outlook {border:1px solid rgba(175,141,95,.34);}
#about {padding-bottom:36px;}
.studio-simulator {width:min(100%,680px);margin:36px auto 0;}
.studio-simulator #simulation::before {content:none;animation:none;}
.studio-simulator .hero-player-container {width:100%;padding:0;border:1px solid rgba(175,141,95,.3);background:#0d0d0d;}
@media(max-width:600px) {
 #about {padding-bottom:28px;}
 .studio-simulator {margin-top:28px;}
 .studio-simulator .hero-player-container {padding:0;}
}


/* Source 19 gml-touch973 */

.showcase-intro {max-width:74ch;margin:16px auto 0;font-size:clamp(.85rem,.95vw,1rem);line-height:1.7;color:#c4c0b8;}
/* Touch feedback complements the desktop proximity border. */
.gml-edge-card.is-touch-lit {
 border-color:rgba(212,175,110,.94);
 box-shadow:0 0 20px rgba(175,141,95,.24),inset 0 0 0 1px rgba(212,175,110,.16);
 /* Reveal code sets an inline transition; taps need immediate feedback. */
 transition:none !important;
}
.showcase-play {width:clamp(24px,20%,44px);height:auto;aspect-ratio:1;}
.showcase-play > svg {width:20px;height:20px;max-width:60%;max-height:60%;}
@media(prefers-reduced-motion:reduce) {.gml-edge-card.is-touch-lit {transition:none;}}


/* Source 20 gml-contact974 */

/* Keep input fields comfortable before choosing a second column. */
.form-field,.form-field input,.form-field textarea {min-width:0;}
@media(min-width:769px) {
 .project-form .form-grid {grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));}
}
/* Portrait tablets: introduction above a full-width inquiry form. */
@media(orientation:portrait) and (min-width:769px) and (max-width:1180px) {
 .contact-container {grid-template-columns:minmax(0,1fr);}
 .contact-intro {border-right:0;border-bottom:1px solid rgba(175,141,95,.18);}
 .contact-intro,.project-form {padding:clamp(24px,3.5vw,36px);}
 .project-form {max-width:none;justify-self:stretch;}
 .contact-promise {margin-top:20px;padding-top:18px;}
}


/* Source 21 gml-polish976 */

/* Colour refinement only: warm gold accents, neutral reading text. */
.section-title {background-image:linear-gradient(135deg,#d8bd86 0%,var(--gold-light) 25%,var(--gold) 50%,var(--gold-dark) 75%,#6b5433 100%);}
.showcase-card-copy strong {color:var(--gold-light);}
.form-field label,.channel-label {color:#c7b58f;}
.world-project-kicker,.world-project-details {color:#c9ad78;}
.showcase-tab:not([aria-selected="true"]) {color:#bca782;}
.form-field select {
 width:100%;min-width:0;min-height:54px;border:1px solid rgba(175,141,95,.28);border-radius:0;
 background-color:rgba(4,4,4,.72);color:var(--text-light);font:inherit;font-size:.95rem;padding:.95rem 2.75rem .95rem 1rem;outline:none;
 appearance:none;-webkit-appearance:none;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%23c5a56b' stroke-width='1.5'/%3E%3C/svg%3E");
 background-repeat:no-repeat;background-position:right 16px center;
 transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease;
}
.form-field select:focus {border-color:var(--gold-light);background-color:rgba(10,10,10,.95);box-shadow:0 0 0 1px rgba(175,141,95,.22);}
.form-field select option {background:#141414;color:#e0e0e0;}
@media(pointer:coarse), (max-width:768px) {.form-field select {font-size:16px;}}
#videos {padding-bottom:clamp(28px,3vw,48px);}
.simulator-section {background:var(--dark-section);padding-block:8px 40px;}
.simulator-section .studio-simulator {margin:0 auto;}
@media(max-width:600px) {.simulator-section {padding-bottom:28px;}}


/* Source 22 gml-toolkit9710 */

/* App tiles keep their native artwork; rounding is confined to the toolkit. */
.tools .tool-item{border-radius:22.5%;}
.tools .tool-item::before{border-radius:inherit;}
.tools .tool-item--app{padding:0;}
.tools .tool-item--app img{filter:grayscale(1) brightness(.9);}
.tools .tool-item--app.active img{filter:none;}
/* Compensate only for the empty perimeter already present in the Resolve asset. */
.tools .tool-item--davinci img{width:110%;height:110%;max-width:none;flex:0 0 110%;}
/* Legal links match the existing contact-consent text; spacing remains unchanged. */
.footer-links a{font-size:.76rem;}


/* Source 23 gml-composition9711 */

/* The trigger shares the navigation surface instead of stacking a second tint. */
:root{--gml-control-scroll:0;}
#navbar .language-trigger{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;transition:border-color .2s ease,color .2s ease;}
#navbar .language-trigger:hover,#navbar .language-trigger:focus-visible,#navbar .language-trigger[aria-expanded="true"]{background:transparent;backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);}
#navbar .language-menu{background:rgba(10,10,10,calc(.38 + .48 * var(--gml-control-scroll)));backdrop-filter:blur(40px) saturate(1.1);-webkit-backdrop-filter:blur(40px) saturate(1.1);}
#filmEntryToggle{background:rgba(10,10,10,calc(.86 * var(--gml-control-scroll)));backdrop-filter:blur(calc(24px * var(--gml-control-scroll)));-webkit-backdrop-filter:blur(calc(24px * var(--gml-control-scroll)));transition:border-color .2s ease,color .2s ease;}
#filmEntryToggle:hover,#filmEntryToggle:focus-visible{backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){#navbar .language-menu{background:rgba(10,10,10,.94);}}
/* Alternating film and explanatory sections use the existing neutral surfaces. */
#about{background:var(--dark-bg);padding-bottom:clamp(48px,4vw,64px);}
#about .about-text h3{grid-column:1/-1;justify-self:center;text-align:center;}
#videos{background:var(--dark-section);padding-bottom:clamp(48px,4vw,64px);}
#features{background:var(--dark-bg);}
#simulatorSection{background:var(--dark-section);padding-block:clamp(48px,5vw,80px);}
#simulatorSection .simulator-heading{margin:0 auto clamp(28px,3vw,44px);}
#simulatorSection .studio-simulator{margin:0 auto;}
#worlds{padding-bottom:40px;}
#productionTools{background:var(--dark-section);padding-block:40px;}
#contact{background:var(--dark-bg);padding-top:clamp(48px,4vw,64px);}
/* Keep all category controls on one line, including narrow phones. */
.showcase-controls{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;margin:0 0 22px;}
.showcase-controls .showcase-tabs{width:100%;min-width:0;margin:0;}
.showcase-controls .gallery-toolbar{margin:0;min-height:44px;gap:0;flex-wrap:nowrap;}
.showcase-controls #gallerySizeToggle{min-width:52px;min-height:44px;padding:8px;gap:6px;}
@media(max-width:600px){
 .showcase-controls{gap:8px;margin-bottom:16px;}
 .showcase-controls #gallerySizeToggle{min-width:44px;width:44px;padding:6px;gap:4px;}
 .showcase-controls #gallerySizeToggle svg{width:14px;height:14px;}
 .showcase-controls .showcase-tab-brand{font-size:.48rem;letter-spacing:.04em;}
 .showcase-controls .showcase-tab-type{font-size:.8rem;letter-spacing:.035em;}
 #worlds{padding-bottom:28px;}
 #productionTools{padding-block:36px;}
}


/* Source 24 gml-toolkit9712 */

/* One dark surface and one rounded outer edge; no baked-in app frame. */
.tools .tool-item--symbol{padding:10px;background:#0a0a0a;}
.tools .tool-item--symbol img{filter:invert(1) brightness(.8);}
.tools .tool-item--symbol.active img{filter:none;}
.tools .tool-item--symbol.active::before{background:#fff;}
.tools .tool-item[data-tool="higgsfield"].active::before{background:#d1fe17;}
/* A monochrome mark needs a polarity change, not a barely visible brightness change. */
.tools .tool-item[data-tool="leonardo"] img{filter:grayscale(1) brightness(.85);}
.tools .tool-item[data-tool="leonardo"].active img{filter:invert(1);}


/* Source 25 gml-footer9713 */

.footer-brand strong{color:var(--gold-light);}
.footer-division a{color:#c8c8c8;text-decoration:none;}
.footer-division a:hover,.footer-division a:focus-visible{color:#fff;text-decoration:none;}


/* Source 26 base */

/* Audit accessibility and narrow layouts; approved gold-on-black styling retained. */
.skip-link {position:fixed;top:8px;left:12px;z-index:50000;background:#141414;color:#f0d5a4;border:1px solid #c5a36b;padding:12px 18px;transform:translateY(-180%);}
.skip-link:focus {transform:translateY(0);outline:2px solid #e0c18a;outline-offset:3px;}
#mainContent {outline:none;}
.feature-disclosure {border:0;background:none;color:inherit;font:inherit;line-height:inherit;letter-spacing:inherit;text-align:inherit;padding:0;width:100%;cursor:pointer;}
.feature-disclosure:disabled {opacity:1;color:inherit;cursor:default;-webkit-text-fill-color:currentColor;}
.feature-disclosure:focus-visible {outline:2px solid #d6b47b;outline-offset:5px;}
.feature-card h3,.feature-card p {overflow-wrap:anywhere;hyphens:auto;min-width:0;}
.feature-card p[hidden] {display:none;}
.footer-copyright {color:#aaa !important;opacity:1;}
.toolkit-pause {display:block;margin:-12px auto 20px;padding:8px 14px;border:1px solid rgba(175,141,95,.35);background:transparent;color:#c8b38e;font:inherit;font-size:.75rem;cursor:pointer;}
.toolkit-pause:hover,.toolkit-pause[aria-pressed="true"] {border-color:#c5a36b;color:#e3c795;}
.toolkit-pause:focus-visible {outline:2px solid #d6b47b;outline-offset:4px;}
body {user-select:text;-webkit-user-select:text;}
.showcase-video-card,.tools-slider {user-select:none;-webkit-user-select:none;}
@media(max-width:768px){.feature-card{padding-inline:10px;}.feature-disclosure{min-height:44px;}.feature-card.expanded p{max-height:none;overflow:visible;}}
@media(prefers-reduced-motion:reduce){.tools-slider{overflow-x:auto;cursor:default;}.tools-track{transform:none!important;animation:none!important;transition:none!important;}.tools-track>[aria-hidden="true"]{display:none;}.toolkit-pause{display:none;}}


/* ===== assets/gml-97-17/player.css ===== */
@font-face{font-family:"GML Caption Inter";src:url("/assets/gml-97-17/caption-inter-latin.woff2") format("woff2");font-style:normal;font-weight:300 700;font-display:swap}
.gml-caption-styled::cue{color:#fff;background-color:transparent;font-family:"GML Caption Inter","Yu Gothic","Malgun Gothic","Segoe UI",Arial,sans-serif;font-weight:600;font-style:normal;font-size:var(--gml-caption-font-size,1em);line-height:1.16;white-space:pre-line;text-shadow:.8px 0 0 rgba(0,0,0,.96),-.8px 0 0 rgba(0,0,0,.96),0 .8px 0 rgba(0,0,0,.96),0 -.8px 0 rgba(0,0,0,.96),.6px .6px 0 rgba(0,0,0,.9),-.6px .6px 0 rgba(0,0,0,.9),.6px -.6px 0 rgba(0,0,0,.9),-.6px -.6px 0 rgba(0,0,0,.9),0 1.5px 3px rgba(0,0,0,.5),0 0 2px rgba(222,177,95,.65),0 0 7px rgba(211,164,78,.52)}
.gml-cc-controls{position:absolute;right:56px;bottom:64px;z-index:10005;display:flex;align-items:center;isolation:isolate;font:14px/1.4 "Inter","Segoe UI",sans-serif;color:#fff}
.gml-cc-controls[hidden],.gml-cc-menu[hidden]{display:none!important}
.gml-cc-toggle,.gml-cc-language{height:44px;display:flex;align-items:center;justify-content:center;border:0;background:rgba(10,10,10,.72);color:#fff;cursor:pointer;padding:0;box-shadow:none}
.gml-cc-toggle{width:44px;border-radius:4px 0 0 4px;position:relative}
.gml-cc-toggle[aria-pressed=true]::after{content:"";position:absolute;bottom:6px;left:11px;right:11px;height:2px;background:#d5af72}
.gml-cc-language{width:26px;border-radius:0 4px 4px 0}
.gml-cc-toggle svg{width:26px;height:20px}.gml-cc-language svg{width:14px;height:14px}
.gml-cc-toggle:hover,.gml-cc-language:hover{background:rgba(55,46,31,.94)}
.gml-cc-controls button:focus-visible{outline:2px solid #e5c58f;outline-offset:-3px}
.gml-cc-menu{position:absolute;right:0;bottom:calc(100% + 8px);width:230px;max-width:calc(100vw - 32px);max-height:min(420px,calc(100dvh - 170px));overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;border:1px solid rgba(208,171,109,.45);border-radius:5px;background:rgba(12,12,12,.96);color:#eee;box-shadow:0 8px 24px rgba(0,0,0,.35);padding:7px;transform-origin:bottom right;animation:gmlCcIn .13s ease-out}
.gml-cc-title{font-size:12px;color:#d0b384;text-align:left;padding:8px 10px;border-bottom:1px solid #34302a;margin-bottom:4px;letter-spacing:.02em}
.gml-cc-options{display:grid;gap:1px}.gml-cc-options button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:36px;text-align:left;padding:7px 10px;background:transparent;color:#eee;border:0;border-radius:2px;font:inherit;cursor:pointer}
.gml-cc-options button:hover{background:#29251e}.gml-cc-options button[aria-checked=true]{background:#352d21;color:#f4deb8}.gml-cc-check{visibility:hidden;color:#dfbd84}.gml-cc-options button[aria-checked=true] .gml-cc-check{visibility:visible}
#videoModal.gml-cc-menu-open,#videoModal.gml-cc-menu-open .modal-content,.gml-caption-host.gml-cc-menu-open{touch-action:pan-y}
.gml-caption-host.gml-cc-menu-open>video{touch-action:none}
@keyframes gmlCcIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.gml-cc-menu{animation:none}}
@media(max-width:600px){.gml-cc-controls{right:56px;bottom:calc(64px + env(safe-area-inset-bottom,0px))}.gml-cc-options button{min-height:40px}}
.gml-player-host{container-type:inline-size;isolation:isolate}
.gml-player-bar{position:absolute;left:0;right:0;bottom:0;z-index:10006;padding:20px max(8px,env(safe-area-inset-right,0px)) max(5px,env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px));background:linear-gradient(transparent,rgba(0,0,0,.72) 28%,rgba(0,0,0,.9));color:#fff;opacity:1;visibility:visible;transition:opacity .24s ease,visibility .24s ease;box-sizing:border-box;touch-action:manipulation}
.gml-player-row{display:flex;align-items:center;gap:2px;min-width:0;height:44px}
.gml-player-bar button{font:inherit;flex-shrink:0;cursor:pointer;color:#fff;box-shadow:none}
.gml-player-button,.gml-player-bar #shareVideoButton{position:static;display:inline-flex;justify-content:center;align-items:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:0;border-radius:3px;background:transparent;opacity:1;visibility:visible;transform:none;transition:background .15s ease;pointer-events:auto}
.gml-player-bar #shareVideoButton svg{width:21px;height:21px}
.gml-player-button:hover,.gml-player-bar #shareVideoButton:hover,.gml-player-bar .gml-cc-toggle:hover,.gml-player-bar .gml-cc-language:hover{background:rgba(211,174,115,.17)}
.gml-player-bar button:focus-visible,.gml-player-seek:focus-visible{outline:2px solid #dfbd84;outline-offset:-2px}
.gml-player-time{font:500 12px/1 "Inter","Segoe UI",sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap;flex:1;min-width:0;padding:0 4px;text-align:left;letter-spacing:0}
.gml-player-bar .gml-cc-controls{position:relative;right:auto;bottom:auto;z-index:auto;display:flex;flex:0 0 60px;isolation:auto}
.gml-player-bar .gml-cc-toggle{width:38px;background:transparent}
.gml-player-bar .gml-cc-language{width:22px;background:transparent}
.gml-player-bar .gml-cc-toggle svg{width:24px;height:19px}
.gml-player-bar .gml-cc-toggle[aria-pressed=true]::after{left:9px;right:9px}
.gml-player-seek{appearance:none;-webkit-appearance:none;display:block;width:100%;height:24px;min-height:24px;margin:0;padding:0;background:transparent;border:0;cursor:pointer;touch-action:pan-y}
.gml-player-seek::-webkit-slider-runnable-track{height:3px;border-radius:2px;background:linear-gradient(to right,#d8b57c 0 var(--gml-played,0%),rgba(255,255,255,.4) var(--gml-played,0%) 100%)}
.gml-player-seek::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;margin-top:-4.5px;border:0;border-radius:50%;background:#e8cfaa}
.gml-player-seek::-moz-range-track{height:3px;border-radius:2px;background:rgba(255,255,255,.4)}
.gml-player-seek::-moz-range-progress{height:3px;background:#d8b57c}
.gml-player-seek::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:#e8cfaa}
.gml-player-host.gml-player-idle .gml-player-bar{opacity:0;visibility:hidden;pointer-events:none}
.gml-player-host.gml-player-idle{cursor:none}
.gml-player-host:has(.gml-cc-menu:not([hidden])) .gml-player-bar,.gml-player-host:has(#videoShareMenu:not([hidden])) .gml-player-bar{opacity:1;visibility:visible;pointer-events:auto}
.gml-player-host #videoShareMenu{left:auto;top:auto;right:12px;bottom:92px;width:min(330px,calc(100% - 24px));transform:none;animation:gmlCcIn .13s ease-out;max-height:calc(100% - 110px);overflow:auto;overscroll-behavior:contain;touch-action:pan-y}
.gml-player-host:is(:fullscreen,:-webkit-full-screen,.gml-player-expanded){width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;aspect-ratio:auto!important;border:0!important;background:#000;box-shadow:none}
.gml-player-host:is(:fullscreen,:-webkit-full-screen,.gml-player-expanded)>video{width:100%;height:100%;object-fit:contain}
.gml-player-host.gml-player-expanded{position:fixed!important;inset:0;z-index:10010}
.gml-native-fullscreen .gml-player-bar{display:none}
@container(max-width:345px){.gml-player-row{gap:0}.gml-player-time{font-size:12px;padding:0 2px}.gml-player-duration{display:none}.gml-player-button,.gml-player-bar #shareVideoButton{flex-basis:42px;width:42px}}
@media(prefers-reduced-motion:reduce){.gml-player-bar{transition:none}}

/* GML 97.17: white sharing controls, dark glass and restrained champagne gold. */
#videoModal{--gml-player-gold:#b49b78;--gml-player-gold-light:#dbc9af}
#videoModal .modal-content{border-color:var(--gml-player-gold);box-shadow:0 0 40px rgba(180,155,120,.15)}
#videoModal .gml-player-seek::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--gml-player-gold) 0 var(--gml-played,0%),rgba(255,255,255,.4) var(--gml-played,0%) 100%)}
#videoModal .gml-player-seek::-webkit-slider-thumb{background:var(--gml-player-gold-light)}
#videoModal .gml-player-seek::-moz-range-progress{background:var(--gml-player-gold)}
#videoModal .gml-player-seek::-moz-range-thumb{background:var(--gml-player-gold-light)}
#videoModal .gml-cc-toggle[aria-pressed=true]::after{background:var(--gml-player-gold)}
#videoModal .gml-player-button:hover,#videoModal .gml-player-bar #shareVideoButton:hover,#videoModal .gml-cc-toggle:hover,#videoModal .gml-cc-language:hover{background:rgba(180,155,120,.16)}
#videoModal .gml-player-bar button:focus-visible,#videoModal .gml-player-seek:focus-visible{outline-color:var(--gml-player-gold-light)}
#videoModal .modal-close{color:var(--gml-player-gold-light);border-color:rgba(180,155,120,.35)}
#videoShareMenu{padding:17px 16px 16px;color:#f6f6f4;background:rgba(15,16,18,.68);border:0;border-radius:16px;box-shadow:0 12px 36px rgba(0,0,0,.4);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
#videoShareMenu .video-share-title{margin:0 0 15px;color:#f6f6f4;font:600 14px/1.35 "Inter","Segoe UI",sans-serif;letter-spacing:.015em;text-transform:none;text-align:center}
#videoShareMenu .video-share-options{grid-template-columns:repeat(4,minmax(44px,1fr));gap:10px}
#videoShareMenu .video-share-option{width:100%;height:auto;max-width:54px;min-width:44px;aspect-ratio:1;justify-self:center;color:#f6f6f4;background:rgba(255,255,255,.065);border:1px solid rgba(255,255,255,.17);border-radius:50%;box-shadow:none;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background .15s ease,border-color .15s ease}
#videoShareMenu .video-share-option:hover,#videoShareMenu .video-share-option:focus-visible{color:#fff;background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.52);transform:none;box-shadow:none}
#videoShareMenu .video-share-option:focus-visible{outline:2px solid #fff;outline-offset:3px}
#videoShareMenu .video-share-mark{width:26px;height:26px;flex-basis:26px}
#videoShareMenu .video-share-status{color:#f6f6f4}
@media(prefers-reduced-motion:reduce){#videoShareMenu .video-share-option{transition:none}}

/* ===== assets/gml-97-31/interface.css ===== */

.gml-player-pip[hidden]{display:none!important}
.gml-native-status{position:absolute;left:12px;right:12px;bottom:100%;font:13px/1.5 Inter,sans-serif;color:#fff;background:#151515}
.gml-native-status:empty{display:none}
@container(max-width:420px){.gml-player-row:has(.gml-player-pip:not([hidden])) .gml-player-time{display:none}}
@container(max-width:345px){.gml-player-row:has(.gml-player-pip:not([hidden])) .gml-player-button,.gml-player-row:has(.gml-player-pip:not([hidden])) #shareVideoButton{width:40px;flex-basis:40px}}

/* Keep the controls right-aligned even when the time label is hidden for PiP. */
.gml-player-bar .gml-cc-controls{margin-left:auto}

/* Same gold palette as the page's top scroll-progress bar. */
#videoModal .gml-player-seek::-webkit-slider-runnable-track{
 background:linear-gradient(90deg,var(--gold-dark) 0%,var(--gold) 54%,#e4c895 100%) left center/var(--gml-played,0%) 100% no-repeat,rgba(255,255,255,.4);
}
#videoModal .gml-player-seek::-webkit-slider-thumb{
 background:linear-gradient(135deg,#e4c895 0%,var(--gold) 48%,var(--gold-dark) 100%);
 border:1px solid var(--gold-dark);
}
#videoModal .gml-player-seek::-moz-range-progress{
 background:linear-gradient(90deg,var(--gold-dark) 0%,var(--gold) 54%,#e4c895 100%);
}
#videoModal .gml-player-seek::-moz-range-thumb{
 background:linear-gradient(135deg,#e4c895 0%,var(--gold) 48%,var(--gold-dark) 100%);
 border:1px solid var(--gold-dark);
 box-sizing:border-box;
}

/* Keep the live video in the rendering tree for native WebKit PiP.
   display:none on its ancestor can leave the replacement video black. */
#videoModal.gml-in-pip{display:flex!important;background:transparent!important;pointer-events:none}
#videoModal.gml-in-pip .modal-content{position:fixed;left:-10000px;top:0;pointer-events:none}

/* Explicitly honor hidden over the custom button display rule. */
.gml-player-bar .gml-player-fullscreen[hidden]{display:none!important}
/* iOS has one large in-page player. Use live CSS viewport dimensions instead
   of pixel snapshots that can lag behind rotation or a presentation change. */
.is-ios #videoModal{top:0;left:0;width:100%;height:100vh;height:100dvh}
.is-ios #videoModal:not(.gml-in-pip) .modal-content{width:100%;height:100%;max-width:none;max-height:none;aspect-ratio:auto;border:0;box-shadow:none}

/* Keyboard visibility and page scrolling under the persistent navigation. */
html{scroll-padding-top:88px}
#companySiteLink:focus-visible,
#languageTrigger:focus-visible,
.language-option:focus-visible,
.showcase-tab:focus-visible,
#autoplayToggle:focus-visible,
#soundToggle:focus-visible,
#fullscreenToggle:focus-visible,
.form-field :is(input,textarea,select):focus-visible,
.modal-close:focus-visible,
.is-ios .video-modal .modal-close:focus-visible{
 outline:2px solid var(--gold-light);outline-offset:3px;
}
#companySiteLink:focus-visible{text-decoration:none}
.form-field :is(input,textarea,select){scroll-margin-top:20px;scroll-margin-bottom:24px}
@media(forced-colors:active){
 :focus-visible{outline:2px solid Highlight!important;outline-offset:3px}
}

/* Retain the simulator pill size, tucked safely into the lower-right corner. */
#heroControlPill{left:auto;right:max(12px,env(safe-area-inset-right,0px));bottom:max(12px,env(safe-area-inset-bottom,0px));transform:none;background:rgba(0,0,0,.35);border:1px solid rgba(182,149,92,.65);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 3px 14px rgba(0,0,0,.25)}
#heroControlPill:hover,#heroControlPill:focus-within{background:rgba(0,0,0,.55)}
/* The close control belongs inside the player at every viewport size. */
#videoModal .modal-content .modal-close{top:max(8px,env(safe-area-inset-top,0px));right:max(8px,env(safe-area-inset-right,0px));width:44px;height:44px}
/* Related projects: a filled primary action and a light secondary action. */
.world-project-primary,.world-project-primary:hover,.world-project-primary:focus-visible,.world-project-primary:active{background:linear-gradient(135deg,var(--gold-dark),var(--gold-light));color:var(--dark-bg)}
.world-project-primary::before{background:linear-gradient(110deg,transparent,rgba(255,255,255,.16),transparent)}
.world-project-secondary{border-width:1px;background:rgba(0,0,0,.12);color:var(--gold-light)}
/* Compact, balanced text inset inside the existing studio statement frame. */
#about .about-text .studio-outlook{padding:1rem 1.25rem;margin-block:0}
@media(max-width:1100px) and (orientation:portrait){.studio-note-tail{display:block}}
/* A quiet icon replaces the prominent toolkit pause label. */
#productionTools{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:start}
#productionTools>.tools-title{grid-column:2;grid-row:1}
@media(max-width:600px){#productionTools>.tools-title{font-size:clamp(1.15rem,5vw,1.8rem);overflow-wrap:anywhere}}
#productionTools>.tools-slider{grid-column:1/-1;min-width:0}
#toolkitPause{grid-column:3;grid-row:1;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;margin:0;padding:10px;border:0;background:transparent;color:var(--gold-light);opacity:.65}
#toolkitPause svg{width:19px;height:19px}
#toolkitPause:hover,#toolkitPause:focus-visible{opacity:1;background:rgba(182,149,92,.08)}
@media(prefers-reduced-motion:reduce){#toolkitPause{display:none}}
.social-links a[aria-label="Instagram"] svg,.social-links [data-platform="Facebook"] svg,.social-links a[aria-label="TikTok"] svg{width:31px;height:31px}
.social-links a[aria-label="X"] svg{width:30px;height:30px}

/* Preserve content when text is enlarged or user text spacing increases. */
.footer-right{min-width:0;max-width:100%}
.footer-links{min-width:0;max-width:100%;flex-wrap:wrap}
.footer-copyright{max-width:100%;overflow-wrap:anywhere}
.footer-links a{white-space:normal;overflow-wrap:anywhere;max-width:100%}
.showcase-tab,.showcase-tab span{min-width:0;overflow-wrap:anywhere;max-width:100%}
.world-project-primary span,.world-project-secondary span{min-width:0;overflow-wrap:anywhere}
.contact-intro h3,.contact-intro p,.contact-principles span{min-width:0;overflow-wrap:anywhere}
.section-title{max-width:100%;overflow-wrap:anywhere}
#about .about-text>*{min-width:0;overflow-wrap:anywhere}

/* Explain a failed selected subtitle track without interrupting the film. */
.gml-caption-status{position:absolute;left:12px;right:12px;bottom:calc(78px + env(safe-area-inset-bottom,0px));z-index:10007;color:#fff;font:500 .75rem/1.45 Inter,"Segoe UI",sans-serif;pointer-events:none;overflow-wrap:anywhere}
.gml-caption-status:not(:empty){padding:8px 10px;border:1px solid rgba(182,149,92,.45);background:rgba(12,12,12,.94)}
.gml-cc-menu-open .gml-caption-status{opacity:0}

/* GML 97.34: request picker, shared glass / gold language-menu treatment. */
#projectType[hidden], .project-type-list[hidden] {display:none!important;}
.project-type-picker {position:relative;min-width:0;}
.project-type-trigger {display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%;min-height:52px;padding:.85rem 1rem;border:1px solid rgba(175,141,95,.35);border-radius:0;background:rgba(10,10,10,.65);color:var(--gold-light);font:inherit;font-size:16px;line-height:1.5;text-align:left;cursor:pointer;}
.project-type-value,.project-type-option span {min-width:0;overflow-wrap:anywhere;}
.project-type-trigger>svg,.project-type-option>svg {width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.project-type-trigger>svg {transition:transform .18s ease;}
.project-type-trigger[aria-expanded="true"] {border-color:var(--gold-light);}
.project-type-trigger[aria-expanded="true"]>svg {transform:rotate(180deg);}
.project-type-trigger:focus-visible {outline:2px solid var(--gold-light);outline-offset:3px;}
.project-type-list {position:absolute;z-index:30;inset:calc(100% + 8px) 0 auto;padding:.4rem;background:rgba(10,10,10,.87);border:1px solid rgba(175,141,95,.56);box-shadow:0 22px 55px rgba(0,0,0,.55);backdrop-filter:blur(36px);-webkit-backdrop-filter:blur(36px);overflow-y:auto;overscroll-behavior:contain;}
.opens-up .project-type-list {inset:auto 0 calc(100% + 8px);}
.project-type-option {display:flex;align-items:center;justify-content:space-between;gap:.65rem;min-height:44px;padding:.6rem .7rem;border-left:2px solid transparent;color:rgba(224,224,224,.85);font-size:1rem;line-height:1.5;cursor:pointer;}
.project-type-option>svg {visibility:hidden;}
.project-type-option[aria-selected="true"] {color:var(--gold-light);background:rgba(175,141,95,.13);border-left-color:var(--gold);}
.project-type-option[aria-selected="true"]>svg {visibility:visible;}
.project-type-option.is-active {color:#fff;background:rgba(175,141,95,.22);outline:1px solid rgba(175,141,95,.65);outline-offset:-1px;}
@media(hover:hover) {.project-type-option:hover {color:#fff;background:rgba(175,141,95,.18);}}
@media(prefers-reduced-motion:reduce) {.project-type-trigger>svg {transition:none;}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {.project-type-list {background:#141414;}}
@media(forced-colors:active) {.project-type-trigger,.project-type-list {border-color:ButtonText;background:Canvas;color:CanvasText;}.project-type-trigger:focus-visible {outline-color:Highlight;}.project-type-option[aria-selected="true"],.project-type-option.is-active {background:Highlight;color:HighlightText;border-color:Highlight;outline-color:Highlight;}}


/* GML 97.35: let the project offer reflow when enlarged text needs room. */
.world-project-primary,.world-project-secondary{min-width:0;max-width:100%}
@media(min-width:601px){
 .world-project-offer{flex-wrap:wrap}
 .world-project-offer>div{flex:1 1 16rem;min-width:0}
}
