/* Light base */
        :root {
            --bg: #FFFFFF;
            --text: #000000;
            --border: #000000;
            --hero-op: 0.1;
        }
        
        /* Manual dark override */
        [data-theme="dark"] {
            --bg: #000000;
            --text: #FFFFFF;
            --border: #FFFFFF;
            --hero-op: 0.2;
        }
        
        /* Auto system dark */
        @media (prefers-color-scheme: dark) {
            :root:not([data-theme="light"]) {
                --bg: #000000;
                --text: #FFFFFF;
                --border: #FFFFFF;
                --hero-op: 0.2;
            }
        }
        
        * { margin: 0; padding: 0; box-sizing: border-box; }
        
        html {
            background: var(--bg);
            -webkit-text-size-adjust: 100%;
        }
        
        body { 
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Inter, Helvetica, sans-serif; 
            background: var(--bg); 
            color: var(--text); 
            line-height: 1.6; 
            position: relative;
            /* FIX 2: Completely removed 'overflow-x: hidden' and 'transition' from body to stop iOS Safari height miscalculations */
        }

        /* FIX 3: The Site Wrapper securely locks the layout */
        .site-wrapper {
            width: 100%;
            min-height: 100dvh; /* dvh adapts smoothly to the iOS URL bar hiding/showing */
            display: flex;
            flex-direction: column;
            background: var(--bg);
            /* Move the theme transition here, away from the body tag */
            transition: color 0.3s ease, background 0.3s ease;
            /* Use 'clip' instead of 'hidden'. It strictly cuts off overflow without breaking iOS scroll boundaries */
            overflow-x: clip; 
        }
        /* Toggle: Corporate switch */
        .theme-toggle {
            position: fixed; top: 1.5rem; right: 1.5rem; z-index: 100;
            width: 48px; height: 28px; background: var(--border); border-radius: 14px;
            cursor: pointer; transition: background 0.3s ease; border: none;
            display: flex; align-items: center; padding: 0 4px;
        }
        .toggle-knob {
            width: 22px; height: 22px; background: var(--bg); border-radius: 50%;
            box-shadow: 0 2px 4px rgba(0,0,0,0.3); transition: transform 0.3s ease, box-shadow 0.3s ease;
            position: relative;
        }
        [data-theme="dark"] .toggle-knob { transform: translateX(20px); box-shadow: 0 2px 4px rgba(255,255,255,0.3); }
        .toggle-line { 
            position: absolute; left: 50%; top: 50%; width: 12px; height: 2px;
            background: var(--text); transform: translate(-50%, -50%) rotate(-45deg);
            opacity: 0.5; transition: opacity 0.3s ease; 
        }
        [data-theme="dark"] .toggle-line { opacity: 0; }
        
        /* Hero */
        .hero { 
            min-height: 70dvh; /* Upgraded from vh to dvh (Dynamic Viewport Height) */
            position: relative; display: flex; flex-direction: column; 
            justify-content: center; align-items: center; text-align: center; 
            padding: 4rem 2rem; max-width: 1200px; margin: 0 auto; 
            overflow: clip; /* clip instead of hidden */
        }
        .hero::before {
            content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0;
            background: 
                linear-gradient(90deg, transparent 49%, var(--border) 50%, var(--border) 51%, transparent 52%),
                linear-gradient(0deg, transparent 49%, var(--border) 50%, var(--border) 51%, transparent 52%);
            background-size: 40px 40px, 60px 20px; opacity: var(--hero-op); transition: opacity 0.3s ease;
        }
        .hero-content { position: relative; z-index: 2; max-width: 800px; }
        .hero h1 { font-size: clamp(3rem, 10vw, 6rem); font-weight: 800; letter-spacing: -0.02em; margin-bottom: 0.5rem; }
        .hero h2 { font-size: clamp(1.5rem, 4vw, 2.5rem); font-weight: 400; opacity: 0.8; }
        
        /* Services */
        .services { padding: 6rem 2rem 4rem; max-width: 900px; margin: 0 auto; text-align: center; flex: 1; }
        .services h2 { font-size: clamp(2.25rem, 5vw, 3.5rem); margin-bottom: 2rem; font-weight: 700; letter-spacing: -0.01em; }
        .services p { font-size: 1.125rem; line-height: 1.8; max-width: 750px; margin: 0 auto; opacity: 0.9; }
        
        /* Evgenii */
        .evgenii { padding: 4rem 2rem 6rem; max-width: 800px; margin: 0 auto; text-align: center; 
                   border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);
                   transition: border-color 0.3s ease; width: 100%; }
        .photo { 
            width: 280px; height: 280px; object-fit: cover; border: 6px solid var(--border); 
            margin-bottom: 2rem; filter: grayscale(100%) contrast(1.1); border-radius: 8px;
            transition: filter 0.3s ease, border-color 0.3s ease; 
        }
        [data-theme="dark"] .photo { filter: grayscale(100%) contrast(1.3) brightness(1.1); }
        .evgenii h2 { font-size: clamp(2rem, 6vw, 3rem); font-weight: 700; margin-bottom: 0.5rem; letter-spacing: -0.01em; }
        .evgenii-subtitle { font-size: 1.25rem; font-weight: 400; margin-bottom: 1.5rem; opacity: 0.8; }
        
        /* Footer */
        footer { 
            padding: 3rem 2rem; text-align: center; 
            font-size: 0.875rem; opacity: 0.8; width: 100%;
            /* FIX 5: Prevent the iOS home swipe bar from pulling the page height down */
            padding-bottom: calc(3rem + env(safe-area-inset-bottom));
        }
        
        @media (max-width: 768px) { 
            .theme-toggle { top: 1rem; right: 1rem; width: 44px; height: 24px; }
            .toggle-knob { width: 18px; height: 18px; }
            .photo { width: 220px; height: 220px; } 
            .services, .evgenii { padding-left: 1rem; padding-right: 1rem; }
        }
    
.site-wrapper, .theme-toggle { -webkit-font-smoothing: antialiased; }
.theme-toggle:focus-visible { outline: 2px solid #2015ff; outline-offset: 4px; }
