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

:root{
  --bg:#0f172a;
  --header:#1e293b;
  --tile:rgba(255,255,255,0.08);
  --border:rgba(255,255,255,0.15);
  --text:#f8fafc;
}

body{
  font-family:Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
}

.container{
  width:min(1100px,calc(100% - 32px));
  margin:auto;
}

.site-header{
  background:var(--header);
  padding:50px 0;
}

.header-inner{
  display:flex;
  justify-content:center;
}

.logo-tile{
  background:var(--tile);
  padding:40px 60px;
  border-radius:24px;
  border:1px solid var(--border);
}

.logo-tile img{
  height:120px; /* enlarged */
  max-width:90vw;
}

.project-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:20px;
  padding:40px 0 80px;
}

.project-card{
  height:260px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--tile);
  border-radius:20px;
  border:1px solid var(--border);
  transition:0.2s;
}

.project-card:hover{
  transform:translateY(-5px);
}

.project-card img{
  width:85%;
  height:70%;
  object-fit:contain;
}

.site-footer{
  text-align:center;
  padding:20px;
  border-top:1px solid var(--border);
}

@media(max-width:900px){
  .project-grid{grid-template-columns:repeat(3,1fr);}
}
@media(max-width:600px){
  .project-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:400px){
  .project-grid{grid-template-columns:1fr;}
}
