:root {
  --purple: #4b2c82;
  --lavender: #E6DAF5;
  --white: #FFFFFF;
  --dark: #2E1F33;
}

* { margin:0; padding:0; box-sizing:border-box; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }
body { background:var(--white); color:var(--dark); line-height:1.6; }

header { background:var(--purple); color:var(--white); padding:15px 0; }
.nav-container { display:flex; align-items:center; justify-content:space-between; width:90%; margin:0 auto; }
.logo { display:flex; align-items:center; gap:12px; }
.logo img { height:56px; width:56px; object-fit:cover; border-radius:8px; background:#ddd; }
.logo h1 { font-size:1.2rem; }
nav a { color:var(--white); text-decoration:none; margin-left:18px; font-weight:600; }
nav a:hover, nav a.active { text-decoration:underline; }

main { width:90%; margin:28px auto; }
.about { background:var(--lavender); padding:32px; border-radius:12px; box-shadow:0 2px 8px rgba(0,0,0,0.05); }
.about h2 { color:var(--purple); margin-bottom:12px; }

.brands { margin-top:30px; text-align:center; }
.brands h2 { color:var(--purple); margin-bottom:16px; }
.brand-logos { display:flex; justify-content:center; gap:26px; flex-wrap:wrap; }
.brand-item { text-align:center; }
.brand-item img { width:150px; height:150px; object-fit:contain; border-radius:12px; background:#e9e6f2; padding:10px; }
.brand-item p { margin-top:10px; font-weight:700; color:var(--purple); }

.careers h2 { color:var(--purple); margin-bottom:10px; }
.job-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(280px,1fr)); gap:22px; margin-top:20px; }
.job-card { background:var(--lavender); padding:16px; border-radius:10px; box-shadow:0 2px 6px rgba(0,0,0,0.06); }
.job-card h3 { color:var(--purple); margin-bottom:6px; }
.job-poster { width:100%; height:150px; object-fit:cover; border-radius:8px; background:#ddd; margin-bottom:10px; }
.apply-btn { display:inline-block; margin-top:10px; background:var(--purple); color:var(--white); padding:8px 14px; border-radius:6px; text-decoration:none; font-weight:600; }
.apply-btn:hover { background:#3e2166; }

.apply h2 { color:var(--purple); margin-bottom:10px; }
.apply-box { background:var(--lavender); padding:18px; border-radius:10px; text-align:center; margin-top:18px; }

footer { text-align:center; padding:12px; background:var(--purple); color:var(--white); margin-top:28px; font-size:0.95rem; }