/* ====== custom.css (Blocksy Child) ====== */ .blockslider-pagination.blockslider-pagination-square span { width: 45px; margin: 5 10px !important; } .logo-diff, .title-diff { mix-blend-mode: overlay; } .title-diff{ color:#fff; } .hero-headline, .hero-paragraph { mix-blend-mode: difference; } .noise-overlay { z-index: 1 !important; } #header { --theme-palette-color-5: transparent; background-color: var(--theme-palette-color-5) !important; transition: background-color 0.4s ease, padding 0.4s ease, height 0.4s ease; } .ct-sticky-container #header, body.is-header-stuck #header { --theme-palette-color-5: #ffffff00; background-color: var(--theme-palette-color-5) !important; } /* Hide system cursor except in text fields */ html, body, * { cursor: none !important; } input, textarea, select, [contenteditable="true"] { cursor: text !important; } /* Cursor mover */ #cursor-dot { position: fixed; top: 0; left: 0; transform: translate3d(-100px,-100px,0); pointer-events: none; z-index: 2147483647; contain: layout style; mix-blend-mode: difference; /* ensure blending works */ } /* The visible dot */ #cursor-dot::before { content: ""; --size: 10px; width: var(--size); height: var(--size); margin-top: calc(var(--size)/-2); margin-left: calc(var(--size)/-2); display: block; border-radius: 50%; background: #fff; /* white base */ transform: scale(1); transition: transform .25s cubic-bezier(.4,0,.2,1); } /* Hover grow */ #cursor-dot.is-hover::before { transform: scale(1.4); } /* Mouse down */ #cursor-dot.is-down::before { transform: scale(.85); } #cursor-dot.is-hover.is-down::before { transform: scale(.85); } /* Fallback if blend unsupported */ @supports not (mix-blend-mode: difference) { #cursor-dot { mix-blend-mode: normal; } #cursor-dot::before { background: #000; } } /* Disable on small touch devices */ @media (max-width: 768px) { #cursor-dot { display: none; } } /* Avoid fights with our JS scroller; we'll handle anchors ourselves */ html, body { scroll-behavior: auto !important; } /* Start hidden */ body { opacity: 0; transition: opacity 0.6s ease; } /* Fade in when loaded */ body.fade-in { opacity: 1 !important; } #header { --theme-palette-color-5: transparent; background-color: var(--theme-palette-color-5) !important; transition: background-color 0.4s ease, padding 0.4s ease, height 0.4s ease; } .ct-sticky-container #header, body.is-header-stuck #header { --theme-palette-color-5: #ffffff00; background-color: var(--theme-palette-color-5) !important; } .ct-panel-content, .ct-panel ct-header active { z-index: 50 !important; } /* --- OFF-CANVAS MUST WIN THE STACKING + CAPTURE TOUCHES --- */ .ct-panel-overlay { position: fixed !important; inset: 0 !important; z-index: 99998 !important; pointer-events: auto !important; } .ct-panel { /* the sliding drawer itself */ z-index: 99999 !important; pointer-events: auto !important; } /* Prevent any decorative layers from stealing taps */ .live-gradient, .noise-overlay, .floating-projects { pointer-events: none !important; } /* Lock page when the menu is open (Blocksy adds this class to ) */ body.ct-panel-open { overflow: hidden !important; touch-action: none !important; overscroll-behavior: contain !important; } /* On touch devices, don’t hide/alter the system cursor; hide custom dot */ @media (hover:none) and (pointer:coarse){ html, body, * { cursor: auto !important; } #cursor-dot { display: none !important; } }