/* Standard-Cursor für alle Elemente NICHT ausblenden, um einen Fallback zu haben. */ /* Hier ist der native System-Cursor VORRANGIG. */ body, a { cursor: default !important; } /* NEU: Deaktiviert den Standard-Cursor NUR, wenn JavaScript die Klasse auf setzt. */ body.custom-cursor-active, body.custom-cursor-active a { cursor: none !important; } /* ---------------------------------------------------------------- */ /* --- CUSTOM MOUSE CURSOR (Rest unverändert) --- */ /* ---------------------------------------------------------------- */ #custom-cursor { position: fixed; pointer-events: none; top: 0; left: 0; z-index: 9999; mix-blend-mode: difference; transition: width 0.3s ease, height 0.3s ease, border-color 0.3s ease, transform 0.1s linear, opacity 0.3s ease; transform: translate(-50%, -50%); display: flex; justify-content: center; align-items: center; } .cursor-inner { width: 20px; height: 20px; border-radius: 50%; mix-blend-mode: difference; background-color: #ffffff; transition: transform 0.3s ease, opacity 0.3s ease; transform: scale(1); opacity: 1; } #custom-cursor.is-hovering { width: 50px; height: 50px; } #custom-cursor.is-hovering .cursor-inner { mix-blend-mode: difference; background-color: #ffffff; transform: scale(3.0); } /* ... Rest des CSS-Codes (Fonts, Layout, Media Queries) bleibt unverändert ... */ @font-face { font-family: 'Arizona Flare'; src: url('ABCArizonaFlare-Light.woff2') format('woff2'), url('ABCArizonaFlare-Light.woff') format('woff'), url('ABCArizonaFlare-Light.otf') format('opentype'); font-weight: 300; font-style: normal; } @font-face { font-family: 'Arizona Flare'; src: url('ABCArizonaFlare-Regular.woff2') format('woff2'), url('ABCArizonaFlare-Regular.woff') format('woff'), url('ABCArizonaFlare-Regular.otf') format('opentype'); font-weight: 400; font-style: normal; } * { box-sizing: border-box; margin: 0; padding: 0; } body { font-family: 'Arizona Flare', sans-serif; font-weight: 300; color: #2d1919; background-color: #fff; min-height: 100dvh; } .container { padding: 20px; position: relative; min-height: 100dvh; } a { color: inherit; text-decoration: none; position: relative; display: inline-block; } a::after { content: ''; position: absolute; bottom: 0; left: 0; height: 1px; background-color: #2d1919; width: 0; transition: width 0.3s ease-out; } a:hover::after { width: 100%; } .logo { position: fixed; top: 20px; left: 20px; z-index: 10; } .logo img { height: 80px; width: auto; } .logo a:hover::after { width: 0; } .right-top { position: fixed; top: 20px; right: 20px; width: 340px; text-align: left; z-index: 10; display: block; } .kanzlei-name h1 { font-size: 2.2em; font-weight: 300; line-height: 1.2; margin: 0; } .right-bottom { position: fixed; bottom: 20px; right: 20px; width: 340px; text-align: left; font-size: 2.2em; font-weight: 300; line-height: 1.2; font-style: normal; z-index: 10; display: block; } .right-bottom a::after { height: 2px; } .footer-nav { position: fixed; bottom: 20px; left: 20px; z-index: 10; text-align: left; } .footer-nav a { margin-right: 15px; font-size: 1.2em; } .footer-nav a.active::after { width: 100%; } .content-wrapper { position: absolute; top: 135px; bottom: 60px; left: 20px; width: 45%; max-width: 500px; z-index: 11; overflow-y: auto; padding-right: 10px; } .text-block { line-height: 1.2; display: none; font-size: 1.08em; } #firstext { margin-bottom: 1em; } .text-block.active-content { display: flex; flex-direction: column; min-height: 100%; } #about.active-content { justify-content: flex-end; } #imprint.active-content, #datenschutz.active-content { justify-content: flex-start; } .text-block h2, .text-block h3 { margin-top: 15px; margin-bottom: 2px; font-weight: 400; font-size: .85em; } #imprint h2:first-of-type, #datenschutz h3:first-of-type, #datenschutz h2:first-of-type { margin-top: 0px; } .text-block .portrait { height: auto; width: 200px; max-width: 100%; display: block; margin-bottom: 20px; } @media (max-width: 800px) { body { min-height: 100dvh; display: block; } ul { list-style: none; padding-left: 0; } .container { display: flex; flex-direction: column; justify-content: center; align-items: center; min-height: 100dvh; padding: 20px; position: static; } .container.content-is-active-mobile { min-height: auto; justify-content: flex-start; padding-bottom: 80px; padding-top: 20px; } #about.text-block { line-height: 1.2; font-size: 1.4em; height: 100%; } .logo { position: static; text-align: center; width: 100%; margin-top: 0; margin-bottom: 40px; top: auto; left: auto; } .logo img { height: 55px; } .right-top { position: static; width: 100%; text-align: center; margin-top: auto; margin-bottom: 10px; top: auto; right: auto; } .container.content-is-active-mobile .right-top { display: none !important; } .kanzlei-name h1 { font-size: 2em; } .right-bottom { position: static; width: 100%; text-align: center; font-size: 2em; bottom: auto; right: auto; } .container.content-is-active-mobile .right-bottom { display: none !important; } .right-bottom p { margin-top: 10px; } a::after { height: 1.5px; } .right-bottom a::after { height: 1.5px; } .footer-nav { display: flex; justify-content: center; position: fixed; bottom: 0; left: 0; width: 100%; z-index: 100; top: auto; padding-top: 15px; padding-bottom: calc(15px + env(safe-area-inset-bottom)); padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); background-color: inherit; text-align: center; } .footer-nav a { font-size: 1.4em; } .footer-nav a:last-of-type { margin-right: 0px; } .content-wrapper { position: static; top: auto; bottom: auto; left: auto; width: 100%; max-width: 100%; min-height: 100px; height: auto; overflow: visible; padding: 0 10px; } #about.active-content, #imprint.active-content, #datenschutz.active-content { justify-content: flex-start; } .content-wrapper .text-block.active-content { overflow-y: visible; } #imprint.active-content, #datenschutz.active-content, #about.active-content { min-height: 100%; } .text-block .portrait { display: none; } } @media (max-width: 600px){ #about.text-block { line-height: 1.2; font-size: 1.08em; height: 100%; } .footer-nav a { font-size: 1.08em; } }