/* ============================
   RAID Tactical Media — Mobile Overrides
   Nur fuer Screens <= 767px
   Desktop bleibt komplett unberuehrt.
   ============================ */

@media (max-width: 767px) {

  /* ============================
     TYPOGRAPHY — kleiner + zentriert
     ============================ */

  h1 {
    font-size: var(--text-3xl);
  }

  h2 {
    font-size: var(--text-2xl);
  }

  h3 {
    font-size: var(--text-xl);
  }

  h1, h2, h3, h4 {
    text-align: center;
  }

  p {
    text-align: center;
  }

  .overline {
    text-align: center;
  }

  .section__header {
    text-align: center;
  }

  .divider {
    margin-inline: auto;
  }

  /* ============================
     HERO — Claim nicht abschneiden, zentrieren
     ============================ */

  .hero__claim--large .hero__claim-line {
    font-size: clamp(2rem, 9vw, 3rem);
    white-space: normal;
  }

  .hero__content--bottom-left {
    padding: 0 var(--space-4) calc(var(--space-12) + 40px);
    text-align: left;
    margin-right: 0;
  }

  .hero--page .hero__content {
    text-align: center;
    max-width: 100%;
    padding-inline: var(--space-4);
  }

  .hero__subtitle {
    font-size: var(--text-sm);
  }

  .hero__claim {
    align-items: flex-start;
  }

  .hero__claim-line {
    text-align: center;
  }

  /* Scroll-Indicator auf Mobile zentrieren */
  .hero__scroll-indicator {
    right: auto;
    left: 50%;
    transform: translateX(-50%);
  }

  /* ============================
     ABOUT-SPLIT — zentriert, kein Ghosting
     ============================ */

  .about-split__text {
    text-align: center;
  }

  .about-split__text .overline {
    text-align: center;
  }

  .about-split__text p {
    margin-inline: auto;
  }

  .about-split__image {
    overflow: hidden;
  }

  /* Dekorative Pseudo-Elements auf Mobile entfernen */
  .about-split__image::before,
  .about-split__image::after {
    display: none;
  }

  /* Underline-Buttons zentrieren — ueberall */
  .btn--underline {
    display: block;
    width: fit-content;
    margin-inline: auto;
  }

  /* ============================
     GALLERY — kein Ghosting
     ============================ */

  .gallery-grid__item {
    overflow: hidden;
  }

  .gallery-grid__item::before,
  .gallery-grid__item::after {
    display: none;
  }

  /* ============================
     PROJECT CARDS — kompakter
     ============================ */

  .project-card__info {
    padding: var(--space-4);
    text-align: center;
  }

  .project-card__title {
    font-size: var(--text-lg);
  }

  /* ============================
     SERVICE CARDS — zentriert
     ============================ */

  .service-card {
    text-align: center;
  }

  .service-card__icon {
    margin-inline: auto;
  }

  /* ============================
     STATS — kompakter
     ============================ */

  .stat {
    padding: var(--space-4);
  }

  .stat__number {
    font-size: clamp(2rem, 8vw, 3rem);
  }

  /* ============================
     SERVICE LIST — zentriert
     ============================ */

  .service-list {
    align-items: center;
  }

  .service-list li {
    padding-left: var(--space-6);
    text-align: left;
  }

  /* ============================
     CLOSING STATEMENT — kompakter
     ============================ */

  .closing-statement {
    text-align: center;
  }

  /* ============================
     RESULTS INTRO — kompakter
     ============================ */

  .results-intro {
    font-size: var(--text-base);
  }

  /* ============================
     CTA — Glow kleiner
     ============================ */

  .section--cta::before {
    width: 300px;
    height: 300px;
  }

  .section--cta h2 {
    text-align: center;
  }

  .cta-block {
    text-align: center !important;
  }

  /* ============================
     CONTACT — zentriert
     ============================ */

  .contact-info {
    text-align: center;
  }

  /* ============================
     FOOTER — schon gut, aber sicher
     ============================ */

  .footer__inner {
    flex-direction: column;
    text-align: center;
  }

  .footer__links {
    justify-content: center;
  }

}