*{box-sizing:border-box;}
  html,body{margin:0;padding:0;scroll-behavior:smooth;}
  body{background:#0e0e0f;color:#fff;font-family:'Inter',sans-serif;}
  .material-symbols-outlined{font-variation-settings:'FILL' 0,'wght' 300,'GRAD' 0,'opsz' 24;vertical-align:middle;}
  .glass-panel{background:rgba(255,255,255,0.03);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);}
  .glass-card{background:rgba(38,38,39,0.4);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);}
  .glass-effect{background:rgba(255,255,255,0.03);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);}
  .text-glow{text-shadow:0 0 30px rgba(0,112,255,0.3);}

  /* Navigation */
  .nav-link{position:relative;transition:color 0.3s;color:#94a3b8;text-decoration:none;font-weight:500;}
  .nav-link::after{content:'';position:absolute;bottom:-4px;left:0;width:0;height:2px;background:#5b90ff;transition:width 0.3s;}
  .nav-link:hover{color:#f1f5f9;}
  .nav-link:hover::after{width:100%;}
  .nav-link.active{color:#60a5fa;font-weight:600;}
  .nav-link.active::after{width:100%;}

  /* Page transitions */
  .page{display:none;opacity:0;transition:opacity 0.3s ease;}
  .page.active{display:block;animation:fadeIn 0.35s ease forwards;}
  @keyframes fadeIn{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}

  /* Hero animations */
  @keyframes fadeUp{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:translateY(0);}}
  .au1{animation:fadeUp 0.7s 0.05s ease both;}
  .au2{animation:fadeUp 0.7s 0.2s ease both;}
  .au3{animation:fadeUp 0.7s 0.35s ease both;}
  .au4{animation:fadeUp 0.7s 0.5s ease both;}

  /* Mobile menu */
  #mobileMenu{display:none;flex-direction:column;gap:1rem;padding:1rem 2rem 1.5rem;border-top:1px solid rgba(255,255,255,0.05);}
  #mobileMenu.open{display:flex;}
  #mobileMenu a{color:#94a3b8;text-decoration:none;padding:0.5rem 0;transition:color 0.3s;}
  #mobileMenu a:hover{color:#f1f5f9;}
  #mobileMenu a.active{color:#60a5fa;font-weight:600;}

  /* Portfolio filters */
  .filter-btn{cursor:pointer;transition:all 0.25s;border:none;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:0.875rem;}
  .filter-btn.active{background:#8aacff;color:#000;}
  .project-card{transition:opacity 0.35s,filter 0.35s;}
  .project-card.dimmed{opacity:0.15;pointer-events:none;filter:grayscale(1);}

  /* Calendar */
  .cal-day{cursor:default;display:flex;align-items:center;justify-content:center;aspect-ratio:1;font-size:0.75rem;color:#adaaab;border-radius:0.5rem;transition:all 0.2s;}
  .cal-day.avail{background:rgba(0,109,248,0.15);color:#5b90ff;font-weight:700;border:1px solid rgba(0,109,248,0.3);cursor:pointer;}
  .cal-day.avail:hover{background:rgba(0,109,248,0.35);}
  .cal-day.picked{background:#006df8;color:#fff;}

  /* Form */
  .form-success{display:none;}
  .form-success.show{display:flex;}

  /* Scrollbar */
  ::-webkit-scrollbar{width:6px;}
  ::-webkit-scrollbar-track{background:#0e0e0f;}
  ::-webkit-scrollbar-thumb{background:#262627;border-radius:3px;}

  /* No-scrollbar for filter row */
  .no-scrollbar{scrollbar-width:none;}
  .no-scrollbar::-webkit-scrollbar{display:none;}

  /* ── Theme Toggle Button ── */
  .theme-toggle{background:none;border:1px solid rgba(255,255,255,0.1);border-radius:0.75rem;padding:0.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.3s;}
  .theme-toggle:hover{background:rgba(255,255,255,0.05);}
  .theme-toggle .icon-sun,.theme-toggle .icon-moon{transition:opacity 0.3s,transform 0.3s;}
  html.dark .theme-toggle .icon-sun{display:block;}
  html.dark .theme-toggle .icon-moon{display:none;}
  html:not(.dark) .theme-toggle .icon-sun{display:none;}
  html:not(.dark) .theme-toggle .icon-moon{display:block;}

  /* ══════════════════════════════════════════════════════════════════
     LIGHT MODE OVERRIDES
     ══════════════════════════════════════════════════════════════════ */

  html:not(.dark) body{background:#f8fafc !important;color:#0f172a !important;}

  /* Scrollbar */
  html:not(.dark) ::-webkit-scrollbar-track{background:#f8fafc;}
  html:not(.dark) ::-webkit-scrollbar-thumb{background:#cbd5e1;}

  /* Navbar */
  html:not(.dark) #navbar{background:rgba(255,255,255,0.85) !important;border-bottom-color:rgba(0,0,0,0.08) !important;box-shadow:0 1px 3px rgba(0,0,0,0.06);}
  html:not(.dark) .theme-toggle{border-color:rgba(0,0,0,0.1);}
  html:not(.dark) .theme-toggle:hover{background:rgba(0,0,0,0.05);}
  html:not(.dark) .nav-link{color:#475569 !important;}
  html:not(.dark) .nav-link:hover{color:#0f172a !important;}
  html:not(.dark) .nav-link.active{color:#2563eb !important;}
  html:not(.dark) .nav-link::after{background:#2563eb;}
  html:not(.dark) #mobileMenu{border-top-color:rgba(0,0,0,0.05);}
  html:not(.dark) #mobileMenu button{color:#475569 !important;}

  /* Glass panels */
  html:not(.dark) .glass-panel{background:rgba(255,255,255,0.7) !important;backdrop-filter:blur(20px);}
  html:not(.dark) .glass-card{background:rgba(241,245,249,0.7) !important;backdrop-filter:blur(20px);}
  html:not(.dark) .glass-effect{background:rgba(255,255,255,0.7) !important;backdrop-filter:blur(20px);}

  /* Text glow - softer in light */
  html:not(.dark) .text-glow{text-shadow:none;}

  /* ── HOME PAGE ── */
  html:not(.dark) #page-home .bg-primary-dim\/20,
  html:not(.dark) #page-home .bg-secondary-container\/20{opacity:0.3;}

  /* Trusted by section */
  html:not(.dark) #page-home section:nth-child(2){background:#f1f5f9 !important;border-color:rgba(0,0,0,0.05) !important;}

  /* ── Generic text color overrides ── */
  html:not(.dark) .text-on-surface{color:#0f172a !important;}
  html:not(.dark) .text-on-surface-variant{color:#475569 !important;}
  html:not(.dark) .text-outline{color:#64748b !important;}
  html:not(.dark) .text-primary{color:#2563eb !important;}
  html:not(.dark) .text-on-primary-fixed{color:#fff !important;}
  html:not(.dark) .text-white{color:#0f172a !important;}

  /* Restore white text in dark overlaid areas (portfolio cards, hero overlays) */
  html:not(.dark) .project-card .text-white,
  html:not(.dark) .project-card h3,
  html:not(.dark) [style*="gradient"] .text-white{color:#ffffff !important;}

  /* ── Background overrides ── */
  html:not(.dark) .bg-surface{background:#ffffff !important;}
  html:not(.dark) .bg-surface-container-low{background:#f1f5f9 !important;}
  html:not(.dark) .bg-surface-container{background:#e2e8f0 !important;}
  html:not(.dark) .bg-surface-container-high{background:#f1f5f9 !important;}
  html:not(.dark) .bg-surface-container-highest{background:#e2e8f0 !important;}
  html:not(.dark) .bg-surface-container-lowest{background:#ffffff !important;}
  html:not(.dark) .bg-surface-variant{background:#e2e8f0 !important;}
  html:not(.dark) .bg-slate-950\/40{background:rgba(255,255,255,0.85) !important;}

  /* ── Border overrides ── */
  html:not(.dark) .border-outline-variant\/20{border-color:rgba(148,163,184,0.2) !important;}
  html:not(.dark) .border-outline-variant\/10{border-color:rgba(148,163,184,0.1) !important;}
  html:not(.dark) .border-outline-variant\/30{border-color:rgba(148,163,184,0.3) !important;}
  html:not(.dark) .border-white\/5{border-color:rgba(0,0,0,0.05) !important;}
  html:not(.dark) .border-primary-dim\/20{border-color:rgba(37,99,235,0.2) !important;}

  /* ── Inline style overrides using parent context ── */

  /* Buttons with bg:#006df8 - make them slightly adjusted for light */
  html:not(.dark) [style*="background:#006df8"]{background:#2563eb !important;color:#fff !important;}
  html:not(.dark) [style*="background:#8aacff"]{background:#2563eb !important;color:#fff !important;}

  /* Cards and containers with dark backgrounds */
  html:not(.dark) [style*="background:#201f21"]{background:#e2e8f0 !important;}
  html:not(.dark) [style*="background:#131314"]{background:#f1f5f9 !important;}
  html:not(.dark) [style*="background:#262627"]{background:#e2e8f0 !important;}
  html:not(.dark) [style*="background:rgba(19,19,20"]{background:rgba(255,255,255,0.95) !important;}
  html:not(.dark) [style*="background:rgba(38,38,39"]{background:rgba(241,245,249,0.6) !important;}
  html:not(.dark) [style*="background:rgba(14,14,15"]{background:rgba(255,255,255,0.9) !important;}

  /* Dark border overrides */
  html:not(.dark) [style*="border:1px solid rgba(72,72,73"]{border-color:rgba(148,163,184,0.2) !important;}
  html:not(.dark) [style*="border:1px solid rgba(255,255,255,0.05)"]{border-color:rgba(0,0,0,0.05) !important;}
  html:not(.dark) [style*="border:1px solid rgba(255,255,255,0.1)"]{border-color:rgba(0,0,0,0.08) !important;}
  html:not(.dark) [style*="border:1px solid #0f172a"]{border-color:rgba(0,0,0,0.05) !important;}
  html:not(.dark) [style*="border-bottom:2px solid #006df8"]{border-bottom-color:#2563eb !important;}

  /* Inline text colors */
  html:not(.dark) [style*="color:#fff"]{color:#0f172a !important;}
  html:not(.dark) [style*="color:#f8fafc"]{color:#0f172a !important;}
  html:not(.dark) [style*="color:#adaaab"]{color:#475569 !important;}
  html:not(.dark) [style*="color:#94a3b8"]{color:#64748b !important;}
  html:not(.dark) [style*="color:#5b90ff"]{color:#2563eb !important;}
  html:not(.dark) [style*="color:#006df8"]{color:#2563eb !important;}
  html:not(.dark) [style*="color:#ee93ee"]{color:#c026d3 !important;}
  html:not(.dark) [style*="color:rgba(255,255,255,0.7)"]{color:rgba(0,0,0,0.6) !important;}
  html:not(.dark) [style*="color:rgba(0,0,0,0.7)"]{color:rgba(0,0,0,0.6) !important;}

  /* Gradient overlays - make them fade to white */
  html:not(.dark) [style*="linear-gradient(to bottom,transparent,#0e0e0f)"]{background:linear-gradient(to bottom,transparent,#f8fafc) !important;}
  html:not(.dark) [style*="linear-gradient(to top,#0e0e0f"]{background:linear-gradient(to top,rgba(248,250,252,0.95),transparent) !important;}
  html:not(.dark) [style*="linear-gradient(to top right,rgba(14,14,15"]{background:linear-gradient(to top right,rgba(248,250,252,0.8),transparent) !important;}

  /* Accent background tints */
  html:not(.dark) [style*="background:rgba(0,109,248,0.1)"]{background:rgba(37,99,235,0.08) !important;}
  html:not(.dark) [style*="background:rgba(0,109,248,0.15)"]{background:rgba(37,99,235,0.1) !important;}
  html:not(.dark) [style*="background:rgba(40,60,161,0.1)"]{background:rgba(79,70,229,0.08) !important;}
  html:not(.dark) [style*="background:linear-gradient(to top right,rgba(238,147,238"]{background:linear-gradient(to top right,rgba(192,38,211,0.1),rgba(37,99,235,0.1)) !important;}

  /* The blue CTA banner */
  html:not(.dark) [style*="background:#006df8"][class*="rounded-"]:not(button):not([type="submit"]){background:#2563eb !important;}

  /* Case study button - white bg */
  html:not(.dark) [style*="background:#fff;color:#0e0e0f"]{background:#0f172a !important;color:#fff !important;}

  /* Footer */
  html:not(.dark) footer{background:#f1f5f9 !important;border-top-color:rgba(0,0,0,0.05) !important;}
  html:not(.dark) footer [style*="border-top:1px solid #0f172a"]{border-top-color:rgba(0,0,0,0.08) !important;}
  html:not(.dark) .text-slate-500{color:#64748b !important;}
  html:not(.dark) .text-slate-600{color:#475569 !important;}
  html:not(.dark) .text-slate-50{color:#0f172a !important;}
  html:not(.dark) .text-slate-400{color:#64748b !important;}
  html:not(.dark) .text-slate-100{color:#1e293b !important;}

  /* Avatar circles in About */
  html:not(.dark) [style*="border:2px solid #0e0e0f"]{border-color:#f8fafc !important;}
  html:not(.dark) [style*="border:2px solid #0e0e0f"][style*="background:#262627"]{background:#cbd5e1 !important;color:#0f172a !important;}

  /* Filter buttons */
  html:not(.dark) .filter-btn{background:#e2e8f0 !important;color:#475569 !important;}
  html:not(.dark) .filter-btn.active{background:#2563eb !important;color:#fff !important;}

  /* Calendar */
  html:not(.dark) .cal-day{color:#475569;}
  html:not(.dark) .cal-day.avail{background:rgba(37,99,235,0.1);color:#2563eb;border-color:rgba(37,99,235,0.2);}
  html:not(.dark) .cal-day.avail:hover{background:rgba(37,99,235,0.2);}
  html:not(.dark) .cal-day.picked{background:#2563eb;color:#fff;}

  /* Portfolio cards - keep dark overlays for readability over images */
  html:not(.dark) .project-card{background:#f1f5f9 !important;}
  html:not(.dark) .project-card .text-on-surface-variant{color:rgba(255,255,255,0.7) !important;}
  html:not(.dark) .project-card [style*="color:#5b90ff"],
  html:not(.dark) .project-card .text-primary{color:#93c5fd !important;}

  /* Form inputs */
  html:not(.dark) input,html:not(.dark) select,html:not(.dark) textarea{background:#e2e8f0 !important;color:#0f172a !important;border:1px solid rgba(148,163,184,0.3) !important;}
  html:not(.dark) input::placeholder,html:not(.dark) textarea::placeholder{color:rgba(71,85,105,0.5) !important;}

  /* Blurred decorative elements */
  html:not(.dark) [class*="blur-[120px]"]{opacity:0.4;}
  html:not(.dark) [class*="blur-3xl"]{opacity:0.3;}

  /* Mission & Vision section */
  html:not(.dark) #page-about section:nth-of-type(3){background:#ffffff !important;}

  /* Radial gradient decorations */
  html:not(.dark) [style*="radial-gradient"]{opacity:0.2;}

  /* Keep hero gradient text visible */
  html:not(.dark) .text-transparent{color:transparent !important;}

  /* Navbar brand text */
  html:not(.dark) #navbar button:first-child{color:#0f172a !important;}

  /* Mobile menu hamburger */
  html:not(.dark) #navbar .material-symbols-outlined{color:#475569 !important;}