* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font: 16px/1.5 system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  background: linear-gradient(135deg, #264653 0%, #2a9d8f 100%);
  min-height: 100vh; color: #1f2733;
}
main { max-width: 980px; margin: 0 auto; padding: 80px 24px; }
header { text-align: center; color: white; margin-bottom: 60px; }
header h1 { font-size: 38px; font-weight: 700; letter-spacing: -.5px; }
header p { opacity: .85; margin-top: 8px; font-size: 17px; }

.apps {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
}
.app-card {
  background: white; border-radius: 14px; padding: 28px 24px;
  text-decoration: none; color: inherit;
  box-shadow: 0 4px 12px rgba(0,0,0,.1);
  border-top: 4px solid var(--accent, #2a9d8f);
  transition: transform .15s, box-shadow .15s;
}
.app-card:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.app-card .icon { font-size: 36px; margin-bottom: 12px; }
.app-card h2 { font-size: 20px; margin-bottom: 6px; }
.app-card p { color: #6b7280; font-size: 14px; }
.ver { color: rgba(255,255,255,.6); text-align: center; margin-top: 60px; font-size: 12px; letter-spacing: .5px; }