/* === ONLINE SIDEHUSTLES - DARK FOREST THEME === */
:root {
  --sky-deep: #050810;
  --sky-mid: #0a1628;
  --forest-deep: #060e09;
  --forest-dark: #091510;
  --forest-mid: #0d1f14;
  --leaf-green: #2d6a4f;
  --leaf-light: #40916c;
  --leaf-accent: #52b788;
  --leaf-bright: #74c69d;
  --gold-accent: #f0c040;
  --text-primary: #e8f0e9;
  --text-secondary: #c8d8cc;
  --text-muted: #8aad90;
  --card-bg: rgba(9,21,12,0.88);
  --card-border: rgba(64,145,108,0.22);
  --nav-bg: rgba(5,8,16,0.95);
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; background:var(--sky-deep); color:var(--text-primary); overflow-x:hidden; }
#starfield { position:fixed; top:0; left:0; width:100%; height:100%; z-index:0; pointer-events:none; }
.nav { position:fixed; top:0; left:0; right:0; z-index:1000; background:var(--nav-bg); backdrop-filter:blur(20px); border-bottom:1px solid rgba(64,145,108,0.12); height:64px; display:flex; align-items:center; padding:0 2rem; }
.nav-inner { max-width:1200px; margin:0 auto; width:100%; display:flex; align-items:center; justify-content:space-between; }
.nav-brand { display:flex; align-items:center; gap:0.6rem; text-decoration:none; font-weight:800; font-size:1rem; color:var(--text-primary); letter-spacing:0.04em; }
.nav-logo { height:30px; width:auto; }
.nav-links { display:flex; align-items:center; gap:0.2rem; }
.nav-link { color:var(--text-secondary); text-decoration:none; padding:0.45rem 0.8rem; border-radius:8px; font-size:0.9rem; font-weight:500; transition:all 0.2s; }
.nav-link:hover { color:var(--leaf-accent); background:rgba(82,183,136,0.08); }
.nav-cta { background:linear-gradient(135deg,var(--leaf-green),var(--leaf-accent)); color:#fff !important; text-decoration:none; padding:0.45rem 1.1rem; border-radius:20px; font-size:0.88rem; font-weight:700; margin-left:0.5rem; transition:all 0.25s; box-shadow:0 0 18px rgba(82,183,136,0.3); }
.nav-cta:hover { transform:translateY(-1px); box-shadow:0 0 30px rgba(82,183,136,0.5); }
.nav-hamburger { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px; }
.nav-hamburger span { width:22px; height:2px; background:var(--text-primary); border-radius:2px; transition:all 0.3s; display:block; }
.mobile-menu { display:none; position:fixed; top:64px; left:0; right:0; background:rgba(5,8,16,0.97); backdrop-filter:blur(20px); border-bottom:1px solid rgba(64,145,108,0.15); padding:1rem; z-index:999; flex-direction:column; gap:0.4rem; }
.mobile-menu.open { display:flex; }
.mobile-menu a { color:var(--text-secondary); text-decoration:none; padding:0.7rem 1rem; border-radius:8px; font-size:0.95rem; transition:all 0.2s; }
.mobile-menu a:hover { background:rgba(82,183,136,0.1); color:var(--leaf-accent); }
.page-wrapper { position:relative; z-index:5; padding-top:64px; }
.section { position:relative; z-index:5; padding:5rem 2rem; }
.section-alt { background:rgba(6,14,9,0.5); }
.container { max-width:1100px; margin:0 auto; }
.section-label { font-size:0.75rem; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--leaf-accent); margin-bottom:0.6rem; }
.section-title { font-size:clamp(1.9rem,3.8vw,2.8rem); font-weight:900; color:var(--text-primary); margin-bottom:1rem; letter-spacing:-0.02em; }
.section-desc { color:var(--text-secondary); font-size:1.05rem; line-height:1.75; max-width:560px; }
.divider { position:relative; z-index:5; border:none; height:1px; background:linear-gradient(90deg,transparent,rgba(64,145,108,0.28),transparent); }
.card { background:var(--card-bg); border:1px solid var(--card-border); border-radius:18px; padding:1.8rem; transition:all 0.3s; backdrop-filter:blur(10px); }
.card:hover { border-color:rgba(82,183,136,0.5); transform:translateY(-4px); box-shadow:0 12px 40px rgba(0,0,0,0.5),0 0 25px rgba(82,183,136,0.1); }
.btn-primary { background:linear-gradient(135deg,#2d6a4f,#52b788); color:white; text-decoration:none; padding:0.9rem 2rem; border-radius:50px; font-weight:700; font-size:1rem; box-shadow:0 0 35px rgba(82,183,136,0.4); transition:all 0.3s; border:none; cursor:pointer; display:inline-block; }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 0 55px rgba(82,183,136,0.6); }
.btn-secondary { background:rgba(255,255,255,0.05); color:var(--text-primary); text-decoration:none; padding:0.9rem 2rem; border-radius:50px; font-weight:600; font-size:1rem; border:1px solid rgba(82,183,136,0.28); transition:all 0.3s; backdrop-filter:blur(8px); display:inline-block; }
.btn-secondary:hover { background:rgba(82,183,136,0.1); border-color:rgba(82,183,136,0.55); transform:translateY(-2px); }
.page-hero { position:relative; z-index:5; padding:5rem 2rem 4rem; text-align:center; background:linear-gradient(180deg,rgba(5,8,16,0.98) 0%,rgba(9,21,14,0.95) 100%); border-bottom:1px solid rgba(64,145,108,0.15); }
.page-hero h1 { font-size:clamp(2rem,5vw,3.5rem); font-weight:900; color:var(--text-primary); letter-spacing:-0.025em; text-shadow:0 0 40px rgba(82,183,136,0.2); }
.page-hero h1 span { color:var(--leaf-accent); }
.page-hero p { color:var(--text-secondary); font-size:1.1rem; max-width:560px; margin:1rem auto 0; line-height:1.75; }
.breadcrumb { font-size:0.82rem; color:var(--text-muted); margin-bottom:1rem; }
.breadcrumb a { color:var(--leaf-accent); text-decoration:none; }
footer { position:relative; z-index:5; background:var(--sky-deep); border-top:1px solid rgba(64,145,108,0.12); padding:3rem 2rem 2rem; }
.footer-inner { max-width:1100px; margin:0 auto; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:3rem; margin-bottom:2.5rem; }
.footer-brand { font-weight:800; font-size:0.95rem; color:var(--text-primary); margin-bottom:0.7rem; }
.footer-tagline { color:var(--text-muted); font-size:0.86rem; line-height:1.65; }
.footer-col h4 { font-size:0.75rem; font-weight:700; text-transform:uppercase; letter-spacing:0.1em; color:var(--text-muted); margin-bottom:1rem; }
.footer-col a { display:block; color:var(--text-secondary); text-decoration:none; font-size:0.88rem; margin-bottom:0.5rem; transition:color 0.2s; }
.footer-col a:hover { color:var(--leaf-accent); }
.footer-bottom { border-top:1px solid rgba(64,145,108,0.1); padding-top:1.5rem; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
.footer-copy { color:var(--text-muted); font-size:0.8rem; }
.footer-links { display:flex; gap:1.5rem; }
.footer-links a { color:var(--text-muted); text-decoration:none; font-size:0.8rem; transition:color 0.2s; }
.footer-links a:hover { color:var(--leaf-accent); }
.fade-in { opacity:1; transform:translateY(0); }
.fade-in.visible { opacity:1; transform:translateY(0); }
.fade-in-delay-1 { transition-delay:0.15s; }
.fade-in-delay-2 { transition-delay:0.3s; }
.fade-in-delay-3 { transition-delay:0.45s; }
@media (max-width:768px) { .nav-links{display:none;} .nav-hamburger{display:flex;} .footer-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:480px) { .footer-grid{grid-template-columns:1fr;} }