:root{
  --bg:#f8fafc; /* light neutral background to play nicely with Bootstrap */
  --muted:#6c757d;
  --accent:#5ef7d4;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{
  font-family: 'Inter', 'Space Grotesk', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
  background: linear-gradient(180deg,#07111a 0%, #08121a 100%);
  color: #eaf6ff;
}

/* Centered, minimal text layout (dark background friendly) */
.container h1{font-weight:600;color:#ffffff}
.container p{color:rgba(234,246,255,0.78);max-width:720px;margin:0 auto}

@media (max-width:576px){
  .container h1{font-size:1.5rem}
}

.maintenance{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:3rem}
.card.maintenance-card{max-width:820px;width:100%;padding:2.5rem;border-radius:12px;box-shadow:0 8px 40px rgba(15,23,42,0.08)}
.logo{font-size:28px;margin-bottom:6px}
.title{font-size:2rem;font-weight:600;margin-bottom:.25rem}
.subtitle{color:var(--muted);margin-bottom:1rem}
.progress{height:12px;background:#e9ecef;border-radius:999px;padding:3px;margin-top:1rem;overflow:hidden}
.progress .bar{height:100%;width:0%;background:linear-gradient(90deg,var(--accent),#64b6ff);border-radius:999px;transition:width 1.6s cubic-bezier(.2,.9,.3,1)}
.credit{margin-top:1rem;color:var(--muted);font-size:.9rem;text-align:center}

@media (max-width:576px){
  .card.maintenance-card{padding:1.25rem}
  .title{font-size:1.4rem}
}


/* Media styles: single centered responsive image */
.media-wrap{display:flex;justify-content:center;align-items:center}
.media-wrap .thumb{
  width:100%;
  max-width:900px; /* limits image width on large screens */
  height:auto; /* keep natural aspect ratio */
  max-height:65vh; /* don't exceed viewport height */
  object-fit:cover;
  border-radius:8px;
  display:block;
}
.media-grid .media-item{display:flex;flex-direction:column}
.media-grid .media-item .small{color:var(--muted)}

@media (max-width:576px){
  .media-wrap .thumb{max-width:100%;max-height:50vh}
}

/* subtle hover for visual feedback (no click action) */
.media-wrap .thumb:hover{transform:scale(1.01);transition:transform .25s ease}