* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: "DM Sans", sans-serif;
  min-height: 100vh;
  overflow-x: hidden;
  transition:
    background-color 0.3s ease,
    color 0.3s ease;
}

/* NOISE - stays same across themes */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
  pointer-events: none;
  z-index: 9998;
  opacity: 0.6;
}

/* GRID BG - fully responsive theme swap */
.grid-bg {
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
  background-size: 56px 56px;
}

[data-theme="light"] .grid-bg {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 0, 0, 0.05) 1px, transparent 1px);
}

/* THEME TOGGLE - unchanged animation */
.theme-toggle .icon-sun,
.theme-toggle .icon-moon {
  position: absolute;
  transition: all 0.3s;
}

[data-theme="dark"] .icon-sun {
  opacity: 1;
  transform: scale(1);
}

[data-theme="dark"] .icon-moon {
  opacity: 0;
  transform: scale(0.5) rotate(90deg);
}

[data-theme="light"] .icon-sun {
  opacity: 0;
  transform: scale(0.5) rotate(-90deg);
}

[data-theme="light"] .icon-moon {
  opacity: 1;
  transform: scale(1);
}

/* SCROLL REVEAL - no change */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity 0.65s ease,
    transform 0.65s ease;
}

.reveal.in {
  opacity: 1;
  transform: translateY(0);
}

/* PROJECT CARD - borders / hover adaptive */
.proj-card {
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 20px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.02);
  transition:
    border-color 0.25s,
    transform 0.3s,
    box-shadow 0.3s;
  cursor: pointer;
  position: relative;
}

[data-theme="light"] .proj-card {
  border-color: rgba(0, 0, 0, 0.08);
  background: rgba(0, 0, 0, 0.02);
}

.proj-card:hover {
  border-color: rgba(255, 255, 255, 0.18);
  transform: translateY(-4px);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}

[data-theme="light"] .proj-card:hover {
  border-color: rgba(0, 0, 0, 0.2);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.12);
}

/* live demon btn */

.live-demo {
  font-size: 12px;
  color: #000;
  text-decoration: none;
  padding: 5px 12px;
  border-radius: 6px;
  background: #fff;
}

[data-theme="light"] .live-demo {
  background: #000000;
  color: #ffffff;
}

/* SCREENSHOT AREA */
.proj-screen {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16/9;
  background: #0d0d0d;
}

[data-theme="light"] .proj-screen {
  background: #f0f0f0;
}

.proj-screen-inner {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 20px 16px 0;
  transition: transform 0.5s ease;
}

.proj-card:hover .proj-screen-inner {
  transform: translateY(-6px);
}

.browser-bar {
  background: #1a1a1a;
  border-radius: 8px 8px 0 0;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-bottom: none;
  width: 100%;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
}

[data-theme="light"] .browser-bar {
  background: #fff;
  border-color: rgba(0, 0, 0, 0.12);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
}

.browser-top {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  background: #111;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

[data-theme="light"] .browser-top {
  background: #f5f5f5;
  border-color: rgba(0, 0, 0, 0.08);
}

.browser-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.browser-url {
  flex: 1;
  margin-left: 6px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 4px;
  padding: 3px 10px;
  font-family: "Geist Mono", monospace;
  font-size: 9px;
  color: rgba(255, 255, 255, 0.3);
}

[data-theme="light"] .browser-url {
  background: rgba(0, 0, 0, 0.06);
  color: rgba(0, 0, 0, 0.6);
}

.browser-content {
  min-height: 160px;
  position: relative;
  overflow: hidden;
}

.proj-card.featured {
  grid-column: span 2;
}

.proj-card.featured .proj-screen {
  aspect-ratio: 21/9;
}

/* TECH BADGE - theme aware */
.tech-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-family: "Geist Mono", monospace;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.7);
  white-space: nowrap;
  transition: all 0.15s;
}

[data-theme="light"] .tech-badge {
  border-color: rgba(0, 0, 0, 0.12);
  background: rgba(0, 0, 0, 0.04);
  color: rgba(0, 0, 0, 0.7);
}

/* FILTER PILL - adaptive */
.filter-pill {
  padding: 7px 16px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: transparent;
  color: rgba(255, 255, 255, 0.6);
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
}

[data-theme="light"] .filter-pill {
  border-color: rgba(0, 0, 0, 0.12);
  color: rgba(0, 0, 0, 0.6);
}

.filter-pill:hover {
  border-color: rgba(255, 255, 255, 0.22);
  color: rgba(255, 255, 255, 0.9);
}

[data-theme="light"] .filter-pill:hover {
  border-color: rgba(0, 0, 0, 0.25);
  color: #000;
}

.filter-pill.active {
  background: rgba(255, 255, 255, 1);
  color: #000;
  border-color: transparent;
}

[data-theme="light"] .filter-pill.active {
  background: #09090b;
  color: #fff;
}

/* MODAL */
.modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: rgba(0, 0, 0, 0.85);
  backdrop-filter: blur(16px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s;
}

.modal-overlay.open {
  opacity: 1;
  pointer-events: all;
}

.modal-box {
  background: #0a0a0a;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 24px;
  max-width: 900px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  transform: translateY(20px) scale(0.97);
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
  position: relative;
}

[data-theme="light"] .modal-box {
  background: #fff;
  border-color: rgba(0, 0, 0, 0.1);
}

.modal-overlay.open .modal-box {
  transform: translateY(0) scale(1);
}

.model-name-set {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-bottom: 28px;
}
.model-name-l {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 12px;
  padding: 16px;
  text-align: center;
}
.model-name-p {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.35);
  margin-top: 4px;
}
.close-btn-model {
  position: sticky;
  top: 38px;
  float: right;
  margin: 50px 16px 0 0;
  z-index: 10;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.1);
  cursor: pointer;
}
[data-theme="light"] .model-name-l{
  background: rgba(0, 0, 0, 0.05);
  border: 1px solid #e5e7eb;
}
[data-theme="light"] .close-btn-model{
  background: rgba(141, 138, 138, 0.05);
  border: 1px solid #e5e7eb;
}
[data-theme="light"] .model-name-p {
  color: #2a2a34;
}


@media (max-width: 755px) {
  .model-name-set {
    display: contents;
  }
  .model-name-l {
    margin-bottom: 20px;
  }
}

/* STATS TICKER unchanged */
@keyframes tickUp {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.tick-up {
  animation: tickUp 0.4s ease both;
}

.proj-card.hidden-card {
  display: table-column-group;
}

.proj-card.featured::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
    ellipse at 50% 0%,
    rgba(99, 102, 241, 0.08) 0%,
    transparent 60%
  );
  pointer-events: none;
  z-index: 0;
}

::-webkit-scrollbar {
  width: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 3px;
}

[data-theme="light"] ::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.15);
}

@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fade-up {
  animation: fadeUp 0.55s ease both;
}

.d1 {
  animation-delay: 0.1s;
}

.d2 {
  animation-delay: 0.2s;
}

.d3 {
  animation-delay: 0.3s;
}

.d4 {
  animation-delay: 0.4s;
}

@keyframes sp {
  0%,
  100% {
    opacity: 1;
  }

  50% {
    opacity: 0.4;
  }
}

.sp {
  animation: sp 2s ease-in-out infinite;
}

.cat-label {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 10;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 10px;
  font-family: "Geist Mono", monospace;
  font-weight: 500;
  letter-spacing: 0.05em;
  backdrop-filter: blur(8px);
}

.card-hover-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    transparent 50%,
    rgba(0, 0, 0, 0.8) 100%
  );
  opacity: 0;
  transition: opacity 0.3s;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: 20px;
  z-index: 5;
}

[data-theme="light"] .card-hover-overlay {
  background: linear-gradient(
    to bottom,
    transparent 50%,
    rgba(0, 0, 0, 0.15) 100%
  );
}

.proj-screen:hover .card-hover-overlay {
  opacity: 1;
}

/* ========== LIGHT MODE TEXT OVERRIDES (fixes all contrast bugs) ========== */
[data-theme="light"] h1,
[data-theme="light"] h2,
[data-theme="light"] h3,
[data-theme="light"] .proj-card h3,
[data-theme="light"] .hero-title,
[data-theme="light"] .stats-number,
[data-theme="light"] .stat-value {
  color: #09090b !important;
}

[data-theme="light"] .proj-card p,
[data-theme="light"] .proj-card .description-text,
[data-theme="light"] .hero-sub,
[data-theme="light"] .stats-label,
[data-theme="light"] .filter-pill,
[data-theme="light"] .tech-badge,
[data-theme="light"] .cat-label,
[data-theme="light"] .browser-url,
[data-theme="light"] .footer-text,
[data-theme="light"] .modal-content p,
[data-theme="light"] .modal-meta,
[data-theme="light"] .proj-card span:not(.tech-badge) {
  color: #1f1f2e !important;
}

[data-theme="light"] .proj-card .text-muted,
[data-theme="light"] .stat-description,
[data-theme="light"] .text-mono-light {
  color: #3b3b4a !important;
}

[data-theme="light"] .proj-card .inline-text,
[data-theme="light"] .hero-badge {
  color: #2c2c3a !important;
}

[data-theme="light"] .proj-card .border-accent {
  border-color: rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .proj-card .card-footer span {
  color: #2c2c3a !important;
}

[data-theme="light"] .stats-container {
  border-color: rgba(0, 0, 0, 0.1);
}

[data-theme="light"] .stats-container div {
  border-color: rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .modal-box h2,
[data-theme="light"] .modal-box h3,
[data-theme="light"] .modal-box p:not(.tech-badge) {
  color: #111 !important;
}

[data-theme="light"] .modal-box .tech-badge {
  color: #1f1f2e !important;
  background: rgba(0, 0, 0, 0.05);
  border-color: rgba(0, 0, 0, 0.1);
}

[data-theme="light"] .modal-box div[style*="background:rgba(99,102,241,.05)"] p,
[data-theme="light"]
  .modal-box
  div[style*="background:rgba(52,211,153,.05)"]
  p {
  color: #2d2d3a !important;
}

[data-theme="light"] nav a:not(.active-link),
[data-theme="light"] .nav-link {
  color: #2c2c3a !important;
}

[data-theme="light"] footer,
[data-theme="light"] footer div {
  color: #2c2c3a !important;
}

[data-theme="light"] .hero-stats span,
[data-theme="light"] .stat-number {
  color: #09090b !important;
}

[data-theme="light"] .proj-card .live-badge {
  color: #10b981 !important;
}

[data-theme="light"] .proj-card .live-badge span {
  background: #10b981 !important;
}

/* preserve interactive elements but fix readability */
[data-theme="light"] .proj-card .text-white-force {
  color: #09090b !important;
}

[data-theme="light"] .proj-card [style*="color:#fff"],
[data-theme="light"] .proj-card [style*="color:rgba(255,255,255"] {
  color: #1f1f2e !important;
}

[data-theme="light"] .hero-gradient-text {
  color: #111 !important;
}

[data-theme="light"] .proj-card .button-light {
  background: #09090b !important;
  color: white !important;
}

.pf-item {
  font-family: "Syne";
  font-weight: 800;
  font-size: 32px;
  letter-spacing: -2px;
  color: #fff;
  line-height: 1;
}
.pf-item-div {
  display: inline-flex;
  gap: 0;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 0;
}
.pf-item-div-ul {
  padding: 20px 32px;
  border-right: 1px solid rgba(255, 255, 255, 0.07);
}

@media (max-width: 768px) {
  .proj-card.featured {
    grid-column: span 1;
  }

  .proj-card.featured .proj-screen {
    aspect-ratio: 16/9;
  }

  .proj-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 640px) {
  .filter-scroll {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 4px;
  }

  .filter-scroll::-webkit-scrollbar {
    display: none;
  }
}
@media (max-width: 640px) {
  .filter-scroll {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 4px;
  }

  .filter-scroll::-webkit-scrollbar {
    display: none;
  }
}
@media (max-width: 667px) {
  .pf-item-div {
    display: ruby;
    border: none;
    border-radius: none;
  }
  .pf-item-div-ul {
    border-right: none;
  }
}

/* ============================================
   LIGHT MODE COLOR FIXES (only overrides)
   Preserves all animations & responsiveness
   ============================================ */

[data-theme="light"] {
  /* Global text & background overrides */
  color-scheme: light;
}

/* Main background and text */
[data-theme="light"] body {
  background: #fafafa !important;
  color: #111 !important;
}

/* Navigation */
[data-theme="light"] nav {
  background: rgba(250, 250, 250, 0.9) !important;
  border-bottom-color: rgba(0, 0, 0, 0.08) !important;
}

[data-theme="light"] nav a,
[data-theme="light"] .nav-link {
  color: #2c2c3a !important;
}

[data-theme="light"] nav a[href="#"]:hover {
  background: rgba(0, 0, 0, 0.05) !important;
  color: #000 !important;
}

/* Hero section */
[data-theme="light"] .hero-badge,
[data-theme="light"] .fade-up span {
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(0, 0, 0, 0.02) !important;
  color: #2c2c3a !important;
}

[data-theme="light"] h1,
[data-theme="light"] h2,
[data-theme="light"] h3,
[data-theme="light"] .syne-heading {
  color: #09090b !important;
}

[data-theme="light"] h1 span {
  color: rgba(0, 0, 0, 0.25) !important;
}

[data-theme="light"] .hero-sub,
[data-theme="light"] p.lead {
  color: #2c2c3a !important;
}

/* Stats container */
[data-theme="light"] .stats-container,
[data-theme="light"] div[style*="border:1px solid rgba(255,255,255,.07)"] {
  border-color: rgba(0, 0, 0, 0.1) !important;
}

[data-theme="light"] .stats-container > div {
  border-right-color: rgba(0, 0, 0, 0.08) !important;
}

[data-theme="light"] .stat-number,
[data-theme="light"] .stats-number {
  color: #09090b !important;
}

[data-theme="light"] .stat-label,
[data-theme="light"] .stats-container div > div:last-child {
  color: #4b4b5a !important;
}

/* Filter bar */
[data-theme="light"] #filterBar {
  background: rgba(250, 250, 250, 0.92) !important;
  border-top-color: rgba(0, 0, 0, 0.06) !important;
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}

[data-theme="light"] .filter-pill {
  border-color: rgba(0, 0, 0, 0.12) !important;
  color: #2c2c3a !important;
}

[data-theme="light"] .filter-pill:hover {
  border-color: rgba(0, 0, 0, 0.25) !important;
  color: #000 !important;
}

[data-theme="light"] .filter-pill.active {
  background: #09090b !important;
  color: #fff !important;
  border-color: transparent !important;
}

/* Project cards */
[data-theme="light"] .proj-card {
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(0, 0, 0, 0.02) !important;
}

[data-theme="light"] .proj-card:hover {
  border-color: rgba(0, 0, 0, 0.2) !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.08) !important;
}

[data-theme="light"] .proj-card h3,
[data-theme="light"] .proj-card .card-title {
  color: #09090b !important;
}

[data-theme="light"] .proj-card p,
[data-theme="light"] .proj-card .description {
  color: #2c2c3a !important;
}

[data-theme="light"] .proj-card .meta-text,
[data-theme="light"] .proj-card [style*="color:rgba(255,255,255,.3)"] {
  color: #6b6b7a !important;
}

[data-theme="light"] .tech-badge {
  border-color: rgba(0, 0, 0, 0.1) !important;
  background: rgba(0, 0, 0, 0.04) !important;
  color: #1f1f2e !important;
}

[data-theme="light"] .cat-label {
  background: rgba(0, 0, 0, 0.05) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  color: #2c2c3a !important;
}

/* Card hover overlay */
[data-theme="light"] .card-hover-overlay {
  background: linear-gradient(
    to bottom,
    transparent 50%,
    rgba(0, 0, 0, 0.1) 100%
  ) !important;
}

[data-theme="light"] .card-hover-overlay span {
  background: rgba(0, 0, 0, 0.05) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  color: white !important;
}
/* loadMore option btn color */

[data-theme="light"] .load-more {
  background: black !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  color: white !important;
}

/* project open btn error fix */
[data-theme="light"] .nav-inner .nav-right .com-size-btn {
  background: black !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  color: white !important;
}

/* Browser mockup inside cards */
[data-theme="light"] .browser-bar {
  background: #fff !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08) !important;
}

[data-theme="light"] .browser-top {
  background: #f5f5f5 !important;
  border-bottom-color: rgba(0, 0, 0, 0.08) !important;
}

[data-theme="light"] .browser-url {
  background: rgba(0, 0, 0, 0.05) !important;
  color: #4b4b5a !important;
}

[data-theme="light"] .browser-content {
  background: #fafafa !important;
}

/* Buttons & links inside cards */
[data-theme="light"] .proj-card a.button-light,
[data-theme="light"] .proj-card [style*="background:#fff"] {
  background: #09090b !important;
  color: #fff !important;
}

[data-theme="light"] .proj-card a.button-outline {
  border-color: rgba(0, 0, 0, 0.15) !important;
  color: #2c2c3a !important;
}

/* Modal */
[data-theme="light"] .modal-box {
  background: #fff !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
}

[data-theme="light"] .modal-box h2,
[data-theme="light"] .modal-box h3,
[data-theme="light"] .modal-box p:not(.tech-badge) {
  color: #111 !important;
}

[data-theme="light"] .modal-box .tech-badge {
  background: rgba(0, 0, 0, 0.05) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  color: #1f1f2e !important;
}

[data-theme="light"] .modal-box div[style*="background:rgba(99,102,241,.05)"] {
  background: rgba(99, 102, 241, 0.05) !important;
  border-color: rgba(99, 102, 241, 0.15) !important;
}

[data-theme="light"] .modal-box div[style*="background:rgba(52,211,153,.05)"] {
  background: rgba(52, 211, 153, 0.05) !important;
  border-color: rgba(52, 211, 153, 0.15) !important;
}

/* CTA strip */
[data-theme="light"] .cta-strip,
[data-theme="light"]
  section[style*="border-top:1px solid rgba(255,255,255,.07)"] {
  border-top-color: rgba(0, 0, 0, 0.06) !important;
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
  background: rgba(0, 0, 0, 0.01) !important;
}

[data-theme="light"] .cta-strip h2,
[data-theme="light"] section[style*="Let's build"] h2 {
  color: #09090b !important;
}

[data-theme="light"] .cta-strip p,
[data-theme="light"] section[style*="Let's build"] p {
  color: #2c2c3a !important;
}

[data-theme="light"] .cta-strip a,
[data-theme="light"] section[style*="Request a Proposal"] a {
  background: #09090b !important;
  color: #fff !important;
}

/* Footer */
[data-theme="light"] footer {
  border-top-color: rgba(0, 0, 0, 0.06) !important;
}

[data-theme="light"] footer div,
[data-theme="light"] footer .footer-text {
  color: #2c2c3a !important;
}

[data-theme="light"] footer .status-text {
  color: #4b4b5a !important;
}

/* Scrollbar */
[data-theme="light"] ::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2) !important;
}

/* Misc inline overrides (catch any remaining white text) */
[data-theme="light"] [style*="color:#fff"],
[data-theme="light"] [style*="color:white"],
[data-theme="light"] [style*="color: rgba(255,255,255"] {
  color: #09090b !important;
}

[data-theme="light"] [style*="color:rgba(255,255,255,.5)"] {
  color: #2c2c3a !important;
}

[data-theme="light"] [style*="color:rgba(255,255,255,.3)"] {
  color: #6b6b7a !important;
}

[data-theme="light"] [style*="color:rgba(255,255,255,.45)"] {
  color: #4b4b5a !important;
}

/* Keep gradient backgrounds intact but ensure text is readable */
[data-theme="light"] .browser-content [style*="background:linear-gradient"] {
  opacity: 0.9;
}

/* Preserve all animations, transforms, transitions */
[data-theme="light"] .reveal,
[data-theme="light"] .fade-up,
[data-theme="light"] .sp,
[data-theme="light"] .tick-up,
[data-theme="light"] .proj-card:hover,
[data-theme="light"] .modal-box,
[data-theme="light"] .theme-toggle svg {
  transition-duration: inherit;
  animation: inherit;
  transform: inherit;
}