/* ── PAGE SHARED STYLES - exakt nach base44 Tailwind ── */

/* Hero Section: pt-36 pb-20 bg-gradient-to-br from-[#f5f7ff] via-white to-[#eef2ff] */
.page-hero-section {
  padding: 130px 0 80px;
  background: linear-gradient(135deg, #f5f7ff 0%, #fff 50%, #eef2ff 100%);
}
.page-hero-notfall {
  padding: 130px 0 80px;
  background: linear-gradient(135deg, #fff5f5 0%, #fff 50%, #eef2ff 100%);
}

/* Hero grid: grid lg:grid-cols-2 gap-14 items-center */
.page-hero-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
}

/* Badge: inline-flex items-center gap-2 bg-blue-50 border border-blue-100 text-[#0a1f5e] rounded-full px-4 py-2 text-xs font-semibold mb-6 */
.page-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #eff6ff;
  border: 1px solid #dbeafe;
  color: #0a1f5e;
  border-radius: 100px;
  padding: 6px 16px;
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 24px;
}
.page-badge svg { width: 14px; height: 14px; flex-shrink: 0; }
.page-badge-red { background: #fee2e2; border-color: #fca5a5; color: #b91c1c; }

/* h1: text-4xl lg:text-5xl font-black text-[#0a1a3e] leading-tight */
.page-h1 {
  font-size: clamp(28px, 4.5vw, 48px);
  font-weight: 900;
  color: #0a1a3e;
  line-height: 1.1;
  letter-spacing: -.02em;
  margin-bottom: 20px;
}

/* Lead: mt-5 text-gray-500 text-lg leading-relaxed */
.page-lead {
  color: #6b7280;
  font-size: 17px;
  line-height: 1.75;
  margin-bottom: 32px;
}

/* Hero img: rounded-3xl shadow-2xl shadow-[#0a1f5e]/15 */
.page-hero-img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: 24px;
  box-shadow: 0 24px 64px rgba(10,31,94,.15);
}

/* Section label: text-[#1a4fd6] font-semibold text-sm uppercase tracking-widest mb-3 */
.sec-label {
  color: #1a4fd6;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-bottom: 12px;
}

/* Section title: text-3xl lg:text-4xl font-black text-[#0a1a3e] */
.sec-title {
  font-size: clamp(24px, 3.5vw, 40px);
  font-weight: 900;
  color: #0a1a3e;
  line-height: 1.1;
  letter-spacing: -.02em;
}

/* Feature card: bg-[#f5f7ff] border border-blue-100 rounded-2xl p-7 */
.feat-card {
  background: #f5f7ff;
  border: 1px solid #dbeafe;
  border-radius: 16px;
  padding: 28px;
}

/* Feature icon: w-12 h-12 bg-white rounded-xl flex items-center justify-center mb-4 shadow-sm */
.feat-icon {
  width: 48px;
  height: 48px;
  background: #fff;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  box-shadow: 0 1px 3px rgba(0,0,0,.1);
  flex-shrink: 0;
}
.feat-icon svg { width: 24px; height: 24px; color: #1a4fd6; flex-shrink: 0; }

/* Card title: font-bold text-[#0a1a3e] text-lg mb-2 */
.feat-title { font-weight: 700; color: #0a1a3e; font-size: 17px; margin-bottom: 8px; }

/* Card desc: text-gray-500 text-sm leading-relaxed */
.feat-desc { color: #6b7280; font-size: 14px; line-height: 1.7; }

/* Red card: bg-red-50/50 border border-red-100 rounded-2xl p-6 */
.feat-card-red {
  background: rgba(254,242,242,.5);
  border: 1px solid #fecaca;
  border-radius: 16px;
  padding: 24px;
}
.feat-card-red .feat-icon { background: #fee2e2; box-shadow: none; }
.feat-card-red .feat-icon svg { color: #f87171; }

/* Steps: text-6xl font-black text-[#0a1f5e]/8 */
.step-nr {
  font-size: 56px;
  font-weight: 900;
  color: rgba(10,31,94,.08);
  line-height: 1;
  display: block;
}

/* Split box: bg-gradient-to-br from-[#0a1f5e] to-[#1a4fd6] rounded-3xl p-10 text-white */
.split-gradient {
  background: linear-gradient(135deg, #0a1f5e, #1a4fd6);
  border-radius: 24px;
  padding: 40px;
  color: #fff;
}

/* Check list */
.orig-check-list { display: flex; flex-direction: column; gap: 12px; }
.orig-check-list li { display: flex; align-items: flex-start; gap: 12px; font-size: 14px; color: #374151; }
.orig-check-list li svg { width: 16px; height: 16px; color: #1a4fd6; flex-shrink: 0; margin-top: 2px; }

/* White card: bg-white rounded-3xl border border-gray-100 p-10 shadow-xl */
.white-card {
  background: #fff;
  border-radius: 24px;
  border: 1px solid #f3f4f6;
  padding: 40px;
  box-shadow: 0 20px 48px rgba(0,0,0,.07);
}

/* Step row for Migrationen */
.step-row-orig {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  background: #fff;
  border: 1px solid #f3f4f6;
  border-radius: 16px;
  padding: 24px;
}

/* Responsive */
@media(max-width: 1023px) {
  .page-hero-grid { grid-template-columns: 1fr; }
  .hide-mobile { display: none !important; }
}
@media(max-width: 768px) {
  .grid-2 { grid-template-columns: 1fr !important; }
  .grid-4 { grid-template-columns: 1fr 1fr !important; }
  .page-hero-section, .page-hero-notfall { padding: 100px 0 60px; }
}
@media(max-width: 480px) {
  .grid-4 { grid-template-columns: 1fr !important; }
}