chore: fix conflicts

Author: adithyaakrishna

apps/sim/app/(auth)/login/login-form.tsx

@@ -469,7 +469,7 @@ export default function LoginPage({
       {showDivider && (
         <div className='relative my-6 font-light'>
           <div className='absolute inset-0 flex items-center'>
-            <div className='w-full border-[#2A2A2A] border-t' />
+            <div className='w-full border-[var(--landing-bg-elevated)] border-t' />
           </div>
           <div className='relative flex justify-center text-sm'>
             <span className='bg-[var(--landing-bg)] px-4 font-[340] text-[var(--text-subtle)]'>

apps/sim/app/(auth)/oauth/consent/page.tsx

@@ -195,7 +195,7 @@ export default function OAuthConsentPage() {
       </div>
 
       {session?.user && (
-        <div className='mt-5 flex items-center gap-3 rounded-lg border border-[var(--surface-4)] px-4 py-3'>
+        <div className='mt-5 flex items-center gap-3 rounded-lg border border-[var(--landing-bg-elevated)] px-4 py-3'>
           {session.user.image ? (
             <Image
               src={session.user.image}

apps/sim/app/(auth)/signup/signup-form.tsx

@@ -567,7 +567,7 @@ function SignupFormContent({
       })() && (
         <div className='relative my-6 font-light'>
           <div className='absolute inset-0 flex items-center'>
-            <div className='w-full border-[var(--surface-4)] border-t' />
+            <div className='w-full border-[var(--landing-bg-elevated)] border-t' />
           </div>
           <div className='relative flex justify-center text-sm'>
             <span className='bg-[var(--landing-bg)] px-4 font-[340] text-[var(--text-subtle)]'>

apps/sim/app/(home)/components/collaboration/collaboration.tsx

@@ -25,7 +25,7 @@ function DotGrid({ className, cols, rows, gap = 0 }: DotGridProps) {
       }}
     >
       {Array.from({ length: cols * rows }, (_, i) => (
-        <div key={i} className='h-[1.5px] w-[1.5px] rounded-full bg-[var(--surface-4)]' />
+        <div key={i} className='h-[1.5px] w-[1.5px] rounded-full bg-[var(--landing-bg-elevated)]' />
       ))}
     </div>
   )
@@ -222,7 +222,7 @@ export default function Collaboration() {
       <style dangerouslySetInnerHTML={{ __html: CURSOR_KEYFRAMES }} />
 
       <DotGrid
-        className='overflow-hidden border-[var(--surface-4)] border-y bg-[var(--landing-bg)] p-1.5'
+        className='overflow-hidden border-[var(--landing-bg-elevated)] border-y bg-[var(--landing-bg)] p-1.5'
         cols={120}
         rows={1}
         gap={6}
@@ -256,7 +256,7 @@ export default function Collaboration() {
 
             <Link
               href='/signup'
-              className='group/cta mt-3 inline-flex h-[32px] cursor-none items-center gap-1.5 rounded-[5px] border border-[var(--white)] bg-[var(--white)] px-2.5 font-[430] font-season text-black text-sm transition-colors hover:border-[var(--border-1)] hover:bg-[var(--border-1)]'
+              className='group/cta mt-3 inline-flex h-[32px] cursor-none items-center gap-1.5 rounded-[5px] border border-white bg-white px-2.5 font-[430] font-season text-black text-sm transition-colors hover:border-[#E0E0E0] hover:bg-[#E0E0E0]'
             >
               Build together
               <span className='relative h-[10px] w-[10px] shrink-0'>
@@ -306,7 +306,7 @@ export default function Collaboration() {
           href='/blog/multiplayer'
           target='_blank'
           rel='noopener noreferrer'
-          className='relative mx-4 mb-6 flex cursor-none items-center gap-3.5 rounded-[5px] border border-[var(--surface-4)] bg-[var(--landing-bg)] px-3 py-2.5 transition-colors hover:border-[var(--border-1)] hover:bg-[var(--surface-2)] sm:mx-8 md:absolute md:bottom-10 md:left-[80px] md:z-20 md:mx-0 md:mb-0'
+          className='relative mx-4 mb-6 flex cursor-none items-center gap-3.5 rounded-[5px] border border-[var(--landing-bg-elevated)] bg-[var(--landing-bg)] px-3 py-2.5 transition-colors hover:border-[#3d3d3d] hover:bg-[var(--landing-bg-card)] sm:mx-8 md:absolute md:bottom-10 md:left-[80px] md:z-20 md:mx-0 md:mb-0'
         >
           <div className='relative h-7 w-11 shrink-0'>
             <Image src='/landing/multiplayer-cursors.svg' alt='' fill className='object-contain' />
@@ -323,7 +323,7 @@ export default function Collaboration() {
       </div>
 
       <DotGrid
-        className='overflow-hidden border-[var(--surface-4)] border-y bg-[var(--landing-bg)] p-1.5'
+        className='overflow-hidden border-[var(--landing-bg-elevated)] border-y bg-[var(--landing-bg)] p-1.5'
         cols={120}
         rows={1}
         gap={6}

apps/sim/app/(home)/components/enterprise/enterprise.tsx

@@ -65,13 +65,13 @@ const FEATURE_TAGS = [
 
 function TrustStrip() {
   return (
-    <div className='mx-6 mt-4 grid grid-cols-1 overflow-hidden rounded-lg border border-[var(--surface-4)] sm:grid-cols-3 md:mx-8'>
+    <div className='mx-6 mt-4 grid grid-cols-1 overflow-hidden rounded-lg border border-[var(--landing-bg-elevated)] sm:grid-cols-3 md:mx-8'>
       {/* SOC 2 + HIPAA combined */}
       <Link
         href='https://app.vanta.com/sim.ai/trust/v35ia0jil4l7dteqjgaktn'
         target='_blank'
         rel='noopener noreferrer'
-        className='group flex items-center gap-3 border-[var(--surface-4)] border-b px-4 py-3.5 transition-colors hover:bg-[var(--surface-1)] sm:border-r sm:border-b-0'
+        className='group flex items-center gap-3 border-[var(--landing-bg-elevated)] border-b px-4 py-3.5 transition-colors hover:bg-[var(--landing-bg-surface)] sm:border-r sm:border-b-0'
       >
         <Image
           src='/footer/soc2.png'
@@ -95,7 +95,7 @@ function TrustStrip() {
         href='https://github.com/simstudioai/sim'
         target='_blank'
         rel='noopener noreferrer'
-        className='group flex items-center gap-3 border-[var(--surface-4)] border-b px-4 py-3.5 transition-colors hover:bg-[var(--surface-1)] sm:border-r sm:border-b-0'
+        className='group flex items-center gap-3 border-[var(--landing-bg-elevated)] border-b px-4 py-3.5 transition-colors hover:bg-[var(--landing-bg-surface)] sm:border-r sm:border-b-0'
       >
         <div className='flex h-[22px] w-[22px] shrink-0 items-center justify-center rounded-full bg-[#FFCC02]/10'>
           <GithubIcon width={11} height={11} className='text-[#FFCC02]/75' />
@@ -148,7 +148,7 @@ export default function Enterprise() {
 
           <h2
             id='enterprise-heading'
-            className='max-w-[600px] font-[430] font-season text-[var(--landing-text)] text-[32px] leading-[100%] tracking-[-0.02em] sm:text-[36px] md:text-[40px]'
+            className='max-w-[600px] font-[430] font-season text-[32px] text-[var(--landing-text-dark)] leading-[100%] tracking-[-0.02em] sm:text-[36px] md:text-[40px]'
           >
             Enterprise features for
             <br />
@@ -191,7 +191,7 @@ export default function Enterprise() {
           <TrustStrip />
 
           {/* Scrolling feature ticker — keyframe loop; pause on hover. Tags use transitions for hover. */}
-          <div className='enterprise-feature-marquee relative mt-6 overflow-hidden border-[var(--surface-4)] border-t'>
+          <div className='enterprise-feature-marquee relative mt-6 overflow-hidden border-[var(--landing-bg-elevated)] border-t'>
             <style dangerouslySetInnerHTML={{ __html: ENTERPRISE_FEATURE_MARQUEE_STYLES }} />
             {/* Fade edges */}
             <div
@@ -210,7 +210,7 @@ export default function Enterprise() {
                 (tag, i) => (
                   <span
                     key={i}
-                    className='enterprise-feature-marquee-tag whitespace-nowrap border-[var(--surface-4)] border-r px-5 py-4 font-[430] font-season text-[var(--landing-text-subtle)]/40 text-small leading-none tracking-[0.02em] hover:bg-white/[0.04] hover:text-[var(--landing-text-subtle)]/55'
+                    className='enterprise-feature-marquee-tag whitespace-nowrap border-[var(--landing-bg-elevated)] border-r px-5 py-4 font-[430] font-season text-[color-mix(in_srgb,var(--landing-text-subtle)_40%,transparent)] text-small leading-none tracking-[0.02em] hover:bg-white/[0.04] hover:text-[color-mix(in_srgb,var(--landing-text-subtle)_55%,transparent)]'
                   >
                     {tag}
                   </span>
@@ -219,8 +219,8 @@ export default function Enterprise() {
             </div>
           </div>
 
-          <div className='flex items-center justify-between border-[var(--surface-4)] border-t px-6 py-5 md:px-8 md:py-6'>
-            <p className='font-[430] font-season text-[var(--landing-text-subtle)]/40 text-base leading-[150%] tracking-[0.02em]'>
+          <div className='flex items-center justify-between border-[var(--landing-bg-elevated)] border-t px-6 py-5 md:px-8 md:py-6'>
+            <p className='font-[430] font-season text-[color-mix(in_srgb,var(--landing-text-subtle)_40%,transparent)] text-base leading-[150%] tracking-[0.02em]'>
               Ready for growth?
             </p>
             <DemoRequestModal>