body, html {
    margin: 0;
    padding: 0;
    height: 100%;
    overflow: hidden;
}
.split-layout {
    display: flex;
    height: 100vh;
    position: relative;
    overflow: hidden;
}
.left-section, .right-section {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    position: relative;
    transition: transform 0.8s ease-in-out;
}
.left-section {
    background-color: #F8F8F8;
    width: 50vw;
    flex: none;
}
.right-section {
    background-color: #212121;
    width: 50vw;
    flex: none;
}
.split-layout.active .left-section { transform: translateX(-100%); }
.split-layout.active .right-section { transform: translateX(100%); }
.content-wrapper { text-align: center; max-width: 450px; }
.main-title { font-size: 3.5em; font-weight: 600; color: #333; line-height: 1.2; margin-bottom: 20px; }
.highlight-psi { color: #FFD700; }
.tagline { font-size: 1.1em; color: #666; margin-bottom: 40px; line-height: 1.6; }
.action-button {
    padding: 15px 35px;
    background-color: #FFD700;
    color: #212121;
    border: none;
    border-radius: 50px;
    font-size: 1.1em;
    font-weight: 500;
    cursor: pointer;
    transition: transform 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 5px 15px rgba(255, 215, 0, 0.3);
}
.action-button:hover {
    transform: translateY(-3px);
    background-color: #FFEA00;
    box-shadow: 0 8px 20px rgba(255, 215, 0, 0.4);
}
#dynamic-text-container { display: flex; align-items: center; justify-content: center; padding: 20px; text-align: center; }
#dynamic-text {
    font-family: 'Courier New', Courier, monospace;
    font-size: 1.5em;
    color: rgba(255, 215, 0, 0.7);
    font-weight: 500;
    min-height: 1.2em;
}
.typing-cursor::after {
    content: '|';
    display: inline-block;
    animation: blink 0.7s infinite;
    color: rgba(255, 215, 0, 0.7);
}
@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}
@media (max-width: 768px) {
    .split-layout { flex-direction: column; }
    .left-section, .right-section { width: 100vw; height: 50vh; }
    .split-layout.active .left-section { transform: translateY(-100%); }
    .split-layout.active .right-section { transform: translateY(100%); }
    .main-title { font-size: 2.5em; }
    .tagline { font-size: 1em; }
    .action-button { padding: 12px 25px; font-size: 1em; }
}