/* Shared base styles for Ankush Gupta Tech main pages */
:root {
  --bg-dark: #050816;
  --bg-light: #0A0F24;
  --primary: #2563EB;
  --primary-hover: #1D4ED8;
  --accent: #7C3AED;
  --text-main: #F8FAFC;
  --text-muted: #94A3B8;
  --card-bg: #111827;
  --card-border: #1F2937;
}

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

body{ font-family:'Inter',sans-serif; background:var(--bg-dark); color:var(--text-main); line-height:1.6; }

.container{ width:90%; max-width:1200px; margin:auto; }

section{ padding:90px 0; }

h1,h2,h3{ font-family:'Space Grotesk',sans-serif; line-height:1.3; }

p{ color:var(--text-muted); margin-top:15px; font-size:17px; }

a{ color:var(--primary); text-decoration:none; }
a:hover{ text-decoration:underline; }

.highlight{ color:var(--primary); }

/* NAVBAR */
nav{ display:flex; justify-content:space-between; align-items:center; padding:24px 0; }
.brand{ font-family:'Space Grotesk',sans-serif; font-size:1.5rem; font-weight:700; letter-spacing:-0.5px; display:flex; align-items:center; gap:12px; color:var(--text-main); text-decoration:none; }
.brand img{ height:36px; width:auto; border-radius:50%; }
.nav-links{ display:flex; gap:24px; font-size:0.9rem; font-weight:500; }
.nav-links a{ color:var(--text-muted); text-decoration:none; transition:color 0.2s; }
.nav-links a:hover{ color:var(--text-main); }
.nav-links a.active{ color:var(--primary); }

/* MOBILE NAV */
.nav-toggle{ display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px; }
.nav-toggle span{ display:block; width:22px; height:2px; background:var(--text-main); border-radius:2px; transition:0.3s; }
.nav-overlay{ display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:999; }
.nav-overlay.open{ display:block; }
.nav-drawer{ display:none; position:fixed; top:0; right:0; width:260px; height:100vh; background:var(--bg-light); border-left:1px solid var(--card-border); z-index:1000; padding:72px 32px 40px; flex-direction:column; gap:24px; overflow-y:auto; }
.nav-drawer.open{ display:flex; }
.nav-drawer a{ color:var(--text-muted); text-decoration:none; font-size:1.05rem; font-weight:500; transition:color 0.2s; }
.nav-drawer a:hover{ color:var(--text-main); }
.drawer-close{ position:absolute; top:24px; right:24px; background:none; border:none; color:var(--text-muted); font-size:1.5rem; cursor:pointer; line-height:1; }

@media(max-width:900px){
  .nav-links{ display:none; }
  .nav-toggle{ display:flex; }
}

/* BUTTONS */
.btn{ display:inline-block; padding:14px 28px; border-radius:6px; font-weight:500; font-size:1rem; text-decoration:none; cursor:pointer; transition:background 0.2s ease,transform 0.18s ease,box-shadow 0.18s ease,border-color 0.2s ease; text-align:center; }
.btn-primary{ background:var(--primary); color:white; border:1px solid var(--primary); }
.btn-primary:hover{ background:var(--primary-hover); border-color:var(--primary-hover); text-decoration:none; transform:translateY(-2px); box-shadow:0 8px 28px rgba(37,99,235,0.38); }
.btn-outline{ background:transparent; color:var(--text-main); border:1px solid var(--card-border); }
.btn-outline:hover{ border-color:var(--text-muted); background:rgba(255,255,255,0.05); text-decoration:none; transform:translateY(-2px); box-shadow:0 4px 18px rgba(255,255,255,0.07); }

/* CARDS */
.card{ background:var(--card-bg); border:1px solid var(--card-border); border-radius:12px; padding:32px; transition:transform 0.2s, border-color 0.2s; }
.card:hover{ border-color:var(--primary); transform:translateY(-2px); }
.card h3{ margin-bottom:12px; font-size:1.25rem; color:var(--text-main); }

/* FOOTER */
footer{ padding:40px 0; text-align:center; color:var(--text-muted); font-size:0.85rem; border-top:1px solid var(--card-border); }
footer a{ color:inherit; text-decoration:none; }
footer a:hover{ color:var(--text-main); }

/* ANIMATIONS */
.gradient-text{ background:linear-gradient(135deg,#3B82F6 0%,#8B5CF6 50%,#06B6D4 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hero-glow{ position:relative; isolation:isolate; }
.hero-glow::before{ content:''; position:absolute; inset:0; background:radial-gradient(ellipse 60% 50% at 20% 40%,rgba(37,99,235,0.13) 0%,transparent 70%),radial-gradient(ellipse 40% 60% at 75% 60%,rgba(124,58,237,0.08) 0%,transparent 65%); pointer-events:none; z-index:-1; }