/* ================= RESET ================= */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Sora', Arial, sans-serif;
}

/* ================= VARIABLES ================= */
:root {
    /* Dark Theme (Default) */
    --bg: rgba(11, 11, 13, 1);
    --text:  rgba(242, 242, 242, 1);
    --primary: rgba(0, 168, 255, 1);
    --secondary: #1f2937;
    --accent: #10b981;
    --card-bg: #111827;
    --header-bg: rgba(10, 10, 10, 0.95);
    --hero-bg: rgba(15, 23, 42, 0.7);
    --border: #374151;
    --headerborder:#29333b;
    --shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5);
    --transition: all 0.3s ease;
    --divider:#FFFFFFB8;
    --bigfootertext:  #FFFFFF29; 
 --contacform: #28282a;
--portfoliohero:#111214;
 --a:#ffffff;
  --aboutcontainerbox:#d4d4d4;
  --footersocialmedia:#FFFFFF33;
   
  --textsecondary:#FFFFFFA6;
  --inputbackground:#404447;
  --background-image-logo: url('/images/logo11.png');
}

.light {
    /* Light Theme */
     --inputbackground:#e0e1e2;
   --textsecondary:#000000A6;
--footersocialmedia:#00000033;
     --a:#000000;
      --contacform: #19191b;
   --bigfootertext:  #00000029;
     --divider:#000000B8;
    --bg: rgba(255, 255, 255, 1);
    --text: rgba(17, 18, 20, 1);
    --primary: rgba(0, 168, 255, 1);
    --secondary: #e5e7eb;
    --accent: #059669;
    --card-bg: #ffffff;
    --header-bg: rgba(249, 250, 251, 0.95);
    --hero-bg: rgba(255, 255, 255, 0.9);
    --border: #d1d5db;
    --headerborder:#cbd9e0;
    --shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    --portfoliohero:#F5F6F7;
    --contacform:  #f0f0f0;
    --aboutcontainerbox:transparent;
    --inputboxshadow:1pxx 1px 30px 1px ;
   --background-image-logo:  url('/images/DSYN.png') ;
    
}

/* ================= BODY ================= */
body {
    background: var(--bg);
    color: var(--text);
    transition: var(--transition);
    min-height: 100vh;
    position: relative;
       overflow-x: hidden;

}