/* Common layout styles */
body { font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; background:#f5f6f8; color:#222; margin:0; }
.wrap { max-width:900px; margin:6vh auto; padding:28px; background:#fff; border-radius:8px; box-shadow:0 10px 30px rgba(15,20,30,0.06); }
.actions { margin-top:18px }
.btn { display:inline-block; padding:10px 16px; background:#1f6feb; color:#fff; text-decoration:none; border-radius:6px }
.link { color:#1f6feb; text-decoration:none }

/* Styles for outage image */
.outage-wrapper { width:100%; display:flex; justify-content:center; align-items:center; padding:12px 0 6px; box-sizing:border-box }
.outage-image { display:block; width:100%; max-width:100%; height:auto; object-fit:cover; border-radius:8px; }

/* Two-column layout: text left, image right */
.content-row { display:flex; gap:28px; align-items:center; }
.content-left { flex:1 1 40%; }
.content-right { flex:0 0 60%; max-width:420px; display:flex; justify-content:center; }

/* Smaller screens: stack vertically */
@media (max-width:900px) {
  .content-row { flex-direction:column-reverse; }
  .content-right, .content-left { flex:1 1 100%; }
  .content-right { margin-bottom:12px }
}

@media (max-width:600px) {
  .outage-image { max-width:95%; border-radius:6px }
  .wrap { padding:18px }
}