/**
 * Digital Kreativ — mobile homepage section rhythm.
 * Reference: 390 × 7895px mobile PSD.
 *
 * The PSD uses ~48–56px visual breathing room at the major transitions,
 * except where the hero lead form overlaps, full-bleed backgrounds change,
 * or the stats and testimonials are intentionally contiguous.
 *
 * Scope: home page #78, phone widths only. Do not change desktop or tablet,
 * card interiors, typography, art direction, slider logic, or CF7 fields.
 */
@media (max-width:767px) {
  body.page-id-78 {
    --dk-mobile-section-space: clamp(42px, 12.3077vw, 48px);
  }

  /* 01→02: the hero form is pulled up; its existing 26px bottom padding
     combines with the services opening space to produce ~48px. */
  body.page-id-78 .dk-services-section .dk-services-layout {
    padding-top: calc(var(--dk-mobile-section-space) - 26px) !important;
    padding-bottom: calc(var(--dk-mobile-section-space) + 16px) !important;
  }

  /* 02→03: teal projects background is an intentional visual change.
     Retain ~60px inside it before the heading and after the carousel. */
  body.page-id-78 .dk-home-managed-references .dk-managed-references.dk-references-featured .dk-projects-inner {
    padding-top: calc(var(--dk-mobile-section-space) + 8px) !important;
    padding-bottom: calc(var(--dk-mobile-section-space) + 6px) !important;
  }

  /* 03→04: avoid the older 74px top gap before the Om Oss photograph.
     PSD has about 45–50px between the background edge and photo. */
  body.page-id-78 .dk-about-section .dk-about-inner {
    padding-top: var(--dk-mobile-section-space) !important;
    padding-bottom: 13px !important;
  }

  /* 04→05: Om Oss's final benefit and the tall CTA card form one sequence.
     Their existing 13px + 30px = 43px seam matches the PSD; keep that. */
  body.page-id-78 .dk-about-cta-section {
    padding-top: 30px !important;
    padding-bottom: calc(var(--dk-mobile-section-space) - 20px) !important;
  }

  /* 05→06: remove the unintentional 69+69=138px blank gap.
     The PSD is ~60px from CTA card bottom to Kundeopplevelser badge:
     28px after the card + 34px before the badge. */
  body.page-id-78 .dkt-v2 .dkt-v2__inner {
    padding-top: calc(var(--dk-mobile-section-space) - 14px) !important;
    padding-bottom: 0 !important;
  }

  /* 06→07: statistics start ~50px after the testimonial card.
     Preserve the compact 2x2 grid and its final 46px bottom edge. */
  body.page-id-78 .dks-statistics .dks-inner.elementor-element {
    padding-top: calc(var(--dk-mobile-section-space) + 6px) !important;
    padding-bottom: calc(var(--dk-mobile-section-space) - 2px) !important;
  }

  /* 07→08: contact starts with the same content inset as other sections.
     Keeps the dark photographic overlay and form panel unchanged. */
  body.page-id-78 .dk-contact-section .dk-contact-inner.elementor-element {
    padding-top: var(--dk-mobile-section-space) !important;
    padding-bottom: var(--dk-mobile-section-space) !important;
  }

  /* 08→09: align footer's first logo row with the 48px opening rhythm.
     Its generous bottom padding is intentionally left for safe-area/legal. */
  body.page-id-78 .dkf-editorial .dkf-in {
    padding-top: var(--dk-mobile-section-space) !important;
  }
}

/* Match the PSD's narrower-phone scaling without altering card geometry. */
@media (max-width:359px) {
  body.page-id-78 .dk-about-cta-section {
    padding-top: 28px !important;
  }
  body.page-id-78 .dk-contact-section .dk-contact-inner.elementor-element {
    padding-top: var(--dk-mobile-section-space) !important;
    padding-bottom: var(--dk-mobile-section-space) !important;
  }
}