/* ── Bildband über die volle Breite (gleiche Werte wie Custom Wear/Customizing) ── */
    .rep-heroband {
      position: relative;
      width: 100%;
      height: clamp(160px, 30vw, 500px);
      overflow: hidden;
      background: #0a0e17;
    }
    .rep-heroband img {
      position: absolute; inset: 0;
      width: 100%; height: 100%;
      object-fit: cover;
      object-position: center 45%;
      display: block;
    }
    .rep-heroband::after {
      content: ''; position: absolute; inset: 0; pointer-events: none;
      background: linear-gradient(180deg,
        rgba(8,11,18,.26) 0%,
        rgba(8,11,18,.04) 30%,
        rgba(8,11,18,.42) 84%,
        rgba(8,11,18,.94) 100%);
    }

    /* ══ Layout der Reparaturseite (Präfix rp-) ══
       Ein gemeinsamer Container für Intro, Ablauf und Hauptbereich: gleiche Außenkanten.
       Reihenfolge im HTML = Reihenfolge auf dem Handy; am Desktop ordnet das Raster um. */
    .rp-stage {
      background: linear-gradient(180deg, rgba(5,8,13,.62), rgba(5,8,13,.5) 40%, rgba(5,8,13,.58));
      padding: 36px 0 56px;
    }
    .rp-wrap { display: grid; gap: 24px; grid-template-columns: minmax(0, 1fr); }
    .rp-wrap > *, .rp-form { min-width: 0; scroll-margin-top: 110px; }

    .rp-card {
      position: relative;
      padding: 32px;
      border-radius: 20px;
      background: rgba(10,14,23,.94);
      border: 1px solid rgba(255,255,255,.1);
      box-shadow: 0 18px 44px rgba(0,0,0,.34);
      min-width: 0;
    }
    .rp-card h2 { margin: 0 0 6px; font-size: 1.35rem; line-height: 1.25; color: #f3f6fb; }
    .rp-card h3 { margin: 0; }
    .rp-divider { border: 0; border-top: 1px solid rgba(255,255,255,.08); margin: 26px 0; }

    /* Intro */
    .rp-intro { padding: 4px 0 8px; }
    .rp-intro .hero-title { font-size: clamp(2.1rem, 3.6vw, 3rem) !important; margin: 0 0 6px; line-height: 1.08 !important; }
    .rp-intro .hero-subline { margin: 0 0 10px; }
    .rp-intro .hero-description { max-width: 100ch; font-size: 1rem; line-height: 1.7; }

    /* Ablauf: fünf Schritte nebeneinander, ohne eigene Rahmen */
    .rp-steps-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 18px; margin-bottom: 22px; }
    .rp-steps-head h2 { margin: 0; }
    .rp-steps-head p { margin: 0; color: rgba(243,246,251,.86); font-size: .92rem; }
    .rp-steplist { list-style: none; margin: 0; padding: 0; display: grid; gap: 26px 28px; grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .rp-step { grid-column: span 2; display: block; position: relative; min-width: 0; }
    .rp-step:nth-child(n+4) { grid-column: span 3; }
    .rp-step-num {
      width: 40px; height: 40px; border-radius: 50%; margin-bottom: 12px;
      display: flex; align-items: center; justify-content: center;
      background: linear-gradient(135deg, rgba(192,138,87,.3), rgba(192,138,87,.1));
      border: 2px solid rgba(192,138,87,.5); color: #d3b07a; font-weight: 900; font-size: 1rem;
    }
    .rp-step h3 { font-size: 1rem; line-height: 1.35; color: #f3f6fb; margin: 0 0 6px; }
    .rp-step p { margin: 0; font-size: .9rem; line-height: 1.6; color: rgba(243,246,251,.75); }
    .rp-step p strong { color: #f3f6fb; }
    .rp-step p.rp-step-klein { margin-top: 8px; font-size: .82rem; color: rgba(243,246,251,.84); }
    @media (min-width: 1180px) {
      .rp-steplist { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .rp-step, .rp-step:nth-child(n+4) { grid-column: auto; }
      /* Verbindungslinie zwischen den Nummern */
      .rp-step:not(:last-child)::after {
        content: ''; position: absolute; top: 19px; left: 52px; right: -20px; height: 2px;
        background: linear-gradient(90deg, rgba(192,138,87,.45), rgba(192,138,87,.08));
      }
    }
    @media (max-width: 699px) {
      .rp-steplist { grid-template-columns: minmax(0, 1fr); gap: 0; }
      .rp-step, .rp-step:nth-child(n+4) { grid-column: auto; display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 16px; padding-bottom: 22px; }
      .rp-step:last-child { padding-bottom: 0; }
      .rp-step-num { margin: 0; grid-row: 1 / span 2; }
      .rp-step:not(:last-child)::after {
        content: ''; position: absolute; left: 19px; top: 44px; bottom: 4px; width: 2px;
        background: linear-gradient(180deg, rgba(192,138,87,.45), rgba(192,138,87,.08));
      }
      .rp-step h3, .rp-step p { grid-column: 2; }
      .rp-step h3 { padding-top: 8px; }
    }

    /* Hauptbereich: links Preise + Hinweise (40 %), rechts Formular (60 %) */
    .rp-main {
      display: grid; gap: 24px; align-items: start;
      grid-template-columns: minmax(0, 1fr);
      grid-template-areas: "preise" "form" "hinweise";
    }
    .rp-prices { grid-area: preise; }
    .rp-form { grid-area: form; }
    .rp-hints { grid-area: hinweise; }
    @media (min-width: 901px) {
      .rp-main {
        grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
        grid-template-rows: auto 1fr;
        grid-template-areas: "preise form" "hinweise form";
      }
    }
    @media (max-width: 1100px) { .rp-card { padding: 28px; } }
    @media (max-width: 640px) {
      .rp-stage { padding: 24px 0 40px; }
      .rp-card { padding: 22px 18px; border-radius: 18px; }
      .rp-card h2 { font-size: 1.25rem; }
    }

    /* Preise */
    .price-cat-title {
      font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
      color: rgba(211,176,122,.8); margin: 22px 0 4px; padding-bottom: 8px;
      border-bottom: 1px solid rgba(211,176,122,.25);
    }
    .price-cat-title:first-child { margin-top: 0; }
    .rp-prices h2 { margin-bottom: 18px; }
    .price-rows { display: block; }
    .price-item {
      display: flex; justify-content: space-between; align-items: center; gap: 14px;
      padding: 11px 0; border-bottom: 1px solid rgba(255,255,255,.07);
      font-size: .95rem; line-height: 1.35;
    }
    .price-rows .price-item:last-child { border-bottom: 0; }
    .price-item .pname { display: inline-flex; align-items: center; gap: 6px; min-width: 0; flex: 1 1 auto; overflow-wrap: anywhere; }
    .price-item .ptag {
      display: inline-flex; justify-content: space-between; gap: .4em;
      flex: 0 0 auto; min-width: 5.4em; margin-left: auto; text-align: right;
      font-size: .92rem; font-weight: 700; color: #d3b07a; white-space: nowrap;
      font-variant-numeric: tabular-nums;
    }
    .price-item .ptag-ab { font-weight: 700; }
    .price-orientierung { margin: 18px 0 0; font-size: .86rem; line-height: 1.6; color: rgba(243,246,251,.78); }
    .price-note-box {
      margin-top: 14px; padding: 10px 14px; border-radius: 12px;
      background: rgba(211,176,122,.07); border: 1px solid rgba(211,176,122,.18);
      font-size: .84rem; line-height: 1.5; color: rgba(243,246,251,.7);
    }
    .price-note-box strong { color: #d3b07a; display: block; margin-bottom: 3px; }

    /* Info-Symbole an den Reparaturpositionen */
    .info-btn {
      position: relative; flex: 0 0 auto; width: 24px; height: 24px; padding: 0; margin: 0;
      display: inline-flex; align-items: center; justify-content: center;
      background: none; border: 0; border-radius: 50%; cursor: pointer;
      color: rgba(211,176,122,.84); transition: color .15s ease;
    }
    .info-btn::before { content: ""; position: absolute; inset: -12px -8px; }
    .info-btn:hover, .info-btn[aria-expanded="true"] { color: #d3b07a; }
    .info-btn:focus-visible { outline: 2px solid #d3b07a; outline-offset: 2px; color: #d3b07a; }
    .info-tip {
      position: absolute; z-index: 6000; box-sizing: border-box; width: 17.5rem; max-width: calc(100vw - 16px);
      padding: 10px 13px; border-radius: 10px; background: #0b0d12; color: rgba(243,246,251,.92);
      border: 1px solid rgba(211,176,122,.45); border-top: 2px solid #d3b07a;
      box-shadow: 0 14px 34px rgba(0,0,0,.55); font-size: .8rem; font-weight: 500; line-height: 1.5;
      text-align: left; text-transform: none; letter-spacing: 0; white-space: normal;
    }
    .info-tip[hidden] { display: none; }

    /* Hinweise (links unter den Preisen) */
    .rp-list { margin: 12px 0 0; padding-left: 20px; }
    .rp-list li { margin-bottom: 8px; line-height: 1.6; font-size: .95rem; color: rgba(243,246,251,.88); }
    .rp-list li:last-child { margin-bottom: 0; }
    .rp-hints h3 { font-size: 1.05rem; color: #d3b07a; margin-bottom: 4px; }
    .rp-hint { padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.07); }
    .rp-hint:last-child { border-bottom: 0; padding-bottom: 0; }
    .rp-hint strong { display: block; margin-bottom: 4px; font-size: .95rem; }
    .rp-hint p { margin: 0; font-size: .9rem; line-height: 1.6; color: rgba(243,246,251,.72); }
    .rp-hint .mail-btn { margin-top: 4px; overflow-wrap: anywhere; }
    .rp-hint p a:not(.mail-btn) { color: #d3b07a; text-decoration: underline; }

    /* Formular */
    .rp-form {
      border-color: rgba(211,176,122,.38);
      box-shadow: 0 18px 44px rgba(0,0,0,.34), 0 0 0 1px rgba(211,176,122,.06), 0 -1px 36px rgba(192,138,87,.1);
    }
    .rp-form::before {
      content: ''; position: absolute; left: 32px; right: 32px; top: -1px; height: 2px;
      background: linear-gradient(90deg, transparent, #c08a57, #d3b07a, #c08a57, transparent);
      pointer-events: none;
    }
    .rp-form h2 { font-size: 1.6rem; margin-bottom: 16px; }
    .rp-warn {
      padding: 10px 14px; border-radius: 12px; margin-bottom: 14px;
      background: rgba(255,80,80,.07); border: 1px solid rgba(255,100,100,.25);
      border-left: 3px solid #ff9a9a;
    }
    .rp-warn strong { display: block; color: #ff9a9a; font-size: .88rem; line-height: 1.4; margin-bottom: 3px; }
    .rp-warn p { margin: 0; font-size: .82rem; color: rgba(243,246,251,.72); line-height: 1.5; }
    .rp-lead { margin: 0 0 22px; font-size: .9rem; line-height: 1.6; color: rgba(243,246,251,.7); }
    .contact-form { display: flex; flex-direction: column; gap: 0; }
    .rp-group { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
    .rp-group + .rp-group { margin-top: 26px; padding-top: 26px; border-top: 1px solid rgba(255,255,255,.08); }
    .form-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
    .form-field { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
    .form-field label { font-weight: 700; }
    .form-field input,
    .form-field select,
    .form-field textarea {
      width: 100%; padding: 14px 16px; border-radius: 14px;
      border: 1px solid rgba(255,255,255,.12); background: rgba(8,11,18,.72);
      color: #f3f6fb; font: inherit; box-sizing: border-box;
    }
    .form-field textarea { min-height: 160px; resize: vertical; }
    .rp-opt { font-weight: 400; opacity: .84; }
    .rp-hinweis { font-size: .8rem; color: rgba(243,246,251,.82); margin: 6px 0 0; line-height: 1.5; }
    .rp-photo-note { font-size: .8rem; color: rgba(243,246,251,.82); margin: 6px 0 0; line-height: 1.5; }
    .rp-consent { display: flex; flex-direction: column; gap: 12px; }
    .rp-consent-title { margin: 0; font-size: .85rem; font-weight: 700; color: #d3b07a; }
    .rp-check { display: flex; align-items: flex-start; gap: 10px; font-size: .85rem; line-height: 1.55; color: rgba(243,246,251,.82); cursor: pointer; }
    .rp-check.is-optional { color: rgba(243,246,251,.87); }
    .rp-check input { width: 24px; height: 24px; margin: 0; accent-color: #d3b07a; flex-shrink: 0; }
    .rp-check span { flex: 1; min-width: 0; }
    .rp-check a { color: #d3b07a; text-decoration: underline; }
    .rp-submit { margin-top: 26px; }
    .rp-submit .submit-btn { width: 100%; }
    .form-status { margin: 12px 0 0; min-height: 1.4em; font-weight: 700; }
    .form-status.is-success { color: #9ee3a0; }
    .form-status.is-error { color: #ff9a9a; }
    .form-helper { margin: 6px 0 0; opacity: .8; font-size: .92rem; }
    .sr-only {
      position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
      overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
    }
    @media (max-width: 560px) { .form-grid { grid-template-columns: minmax(0, 1fr); } .rp-form::before { left: 18px; right: 18px; } }