/* ═══════════════════════════════════════
   AlarmO'Clock — Inner Pages Shared Styles
   Mobile-first (v1.84.0)
   ═══════════════════════════════════════ */

/* ── PAGE HERO ── */
.page-hero {
  text-align: center;
  padding: 120px var(--content-pad) 48px;
  position: relative;
}

.page-hero h1 {
  font-size: clamp(26px, 6vw, 42px);
  font-weight: 800;
  color: var(--text);
  text-shadow: 0 4px 24px rgba(100,60,180,0.2);
  margin-bottom: 12px;
  line-height: 1.2;
}

.page-hero p {
  font-family: 'DM Mono', monospace;
  font-size: 14px;
  color: rgba(255,255,255,0.75);
  line-height: 1.7;
}

/* ── DESKTOP ── */
@media (min-width: 769px) {
  .page-hero { padding: 140px var(--content-pad) 56px; }
  .page-hero h1 { font-size: clamp(28px, 5vw, 42px); }
}

@media (max-width: 768px) {
  .page-hero { padding: 70px var(--content-pad) 32px !important; }
}