/* ════════════════════════════════════════════════════════════
   RITUAL-KARTEN & TRUST-BAR – übernommen von GroMambo (Startseiten-Aufbau wie bei Marilla)
   ════════════════════════════════════════════════════════════ */
.services-section {background: var(--bg-card);}
.services-header {text-align: center; margin-bottom: 48px;}
.services-deco {color: var(--gold); letter-spacing: 10px; font-size: 0.85rem; margin-bottom: 12px; opacity: 0.6;}
.services-subtitle {color: var(--text-muted); margin-top: -24px; font-size: 1rem;}
.services-grid {display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px;}
@media (max-width: 640px) {
  .services-grid {grid-template-columns: 1fr;}
}
.service-card {position: relative; background: var(--bg-card2); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; text-decoration: none; color: inherit; transition: border-color 0.3s, transform 0.3s, box-shadow 0.3s; display: block;}
.service-card:hover {border-color: var(--gold); transform: translateY(-4px); box-shadow: 0 10px 36px rgba(201,168,76,0.12);}
.service-card-featured {border-color: var(--border-gold); background: linear-gradient(135deg, #111 60%, #1a1200 100%);}
.service-card-badge {position: absolute; top: 14px; right: 14px; background: var(--gold); color: #000; font-size: 0.65rem; font-weight: 700; letter-spacing: 1px; padding: 3px 10px; border-radius: 10px; text-transform: uppercase;}
.service-card-inner {padding: 32px 28px;}
.service-card-thumb {position: relative; width: 100%; height: 180px; overflow: hidden;}
.service-card-thumb img {width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.5s ease;}
.service-card:hover .service-card-thumb img {transform: scale(1.06);}
.service-card-thumb-overlay {position: absolute; inset: 0; background: linear-gradient(to bottom, transparent 40%, rgba(8,8,8,0.85) 100%);}
.service-card-thumb + .service-card-inner {padding: 18px 24px 24px;}
.service-icon {font-size: 1.8rem; color: var(--gold); margin-bottom: 16px; display: block; opacity: 0.7;}
.service-name {font-family: var(--font-heading); font-size: 1.2rem; color: var(--text); margin-bottom: 10px;}
.service-desc {color: var(--text-muted); font-size: 0.88rem; line-height: 1.7; margin-bottom: 20px;}
.service-link {color: var(--gold); font-size: 0.82rem; font-weight: 600; letter-spacing: 0.5px; transition: letter-spacing 0.2s;}
.service-card:hover .service-link {letter-spacing: 1.5px;}
.services-cta {display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; margin-top: 40px;}
@media (min-width: 900px) {
  .services-grid {display: flex; flex-direction: row; height: 460px; gap: 0;}
  .service-card {flex: 1; min-width: 0; border-radius: 0; border: none; border-right: 2px solid #080808;}
  .service-card:last-child {border-right: none;}
  .service-card:hover {transform: none; box-shadow: none; border-color: transparent;}
  .service-card::before {content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, transparent, var(--gold) 25%, var(--gold-light) 50%, var(--gold) 75%, transparent); transform: scaleX(0); transform-origin: center; transition: transform .35s ease; z-index: 3;}
  .service-card:hover::before {transform: scaleX(1);}
  .service-card-thumb {position: absolute; inset: 0; width: auto; height: auto;}
  .service-card-thumb-overlay {background: linear-gradient(to top, rgba(0,0,0,.9) 0%, rgba(0,0,0,.2) 55%, rgba(0,0,0,.04) 100%); transition: background .4s;}
  .service-card:hover .service-card-thumb-overlay {background: linear-gradient(to top, rgba(0,0,0,.95) 0%, rgba(0,0,0,.3) 60%, rgba(0,0,0,.08) 100%);}
  .service-card-inner,
  .service-card-thumb + .service-card-inner {position: absolute; bottom: 0; left: 0; right: 0; padding: 24px 28px 32px; z-index: 2; background: transparent;}
  .service-card .service-name {font-size: 1.3rem;}
  .service-card .service-desc {max-height: 0; overflow: hidden; opacity: 0; margin-bottom: 0; transition: max-height .35s ease, opacity .35s ease, margin-bottom .35s;}
  .service-card:hover .service-desc {max-height: 120px; opacity: 1; margin-bottom: 14px;}
  .service-card:not(:has(.service-card-thumb)) .service-card-inner {position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 24px 28px 32px;}
}
.trust-bar {background: var(--bg-card2); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 20px 0;}
.trust-bar-inner {display: flex; justify-content: center; gap: 40px; flex-wrap: wrap;}
.trust-item {display: flex; align-items: center; gap: 8px; font-size: 0.85rem; color: var(--text-muted);}
.trust-icon {color: var(--gold); font-size: 0.9rem;}

/* ── Bewertungen: Kopf wie bei GroMambo ── */
.testimonials-section { background: var(--bg-dark); padding: 64px 0 52px; overflow: hidden; }
.testimonials-header { text-align: center; margin-bottom: 44px; }
.testimonials-deco { color: var(--gold); letter-spacing: 10px; font-size: 0.8rem; margin-bottom: 12px; opacity: 0.5; }
.testimonials-subtitle { color: var(--text-muted); font-size: 0.9rem; margin-top: 6px; }
.testimonials-cta { text-align: center; margin-top: 40px; }
.testimonials-section .tm-wrap::before { background: linear-gradient(to right, var(--bg-dark), transparent); }
.testimonials-section .tm-wrap::after  { background: linear-gradient(to left,  var(--bg-dark), transparent); }
/* Wenige Bewertungen: zentriert, ohne Laufband und ohne Rand-Verlauf */
.tm-wrap--static::before, .tm-wrap--static::after { display: none; }
.tm-track--static { animation: none !important; width: auto; justify-content: center; flex-wrap: wrap; max-width: 1200px; margin: 0 auto; padding: 0 24px; }