/**
 * Digital Kreativ — OM OSS mobile PSD alignment.
 * Source: user-provided 390px "Digital kreative website design MV.psd".
 * Mobile-only page 78. Desktop and tablet >=768px are unchanged.
 * Keep native Elementor image, editable text and three reason widgets.
 */
@media (max-width: 767px) {
  body.page-id-78 .dk-about-section {
    box-sizing: border-box !important;
    position: relative !important;
    isolation: isolate !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: #000 !important;
    color: #fff !important;
  }

  /* Subtle photo-wave decoration near the image, not behind the copy. */
  body.page-id-78 .dk-about-section::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 0 auto !important;
    z-index: 0 !important;
    width: 100% !important;
    height: 370px !important;
    opacity: .43 !important;
    background: url("https://www.digitalkreativ.no/wp-content/uploads/2026/10/visax-8oni9vTWj7U-unsplash-scaled.jpg") center top / cover no-repeat !important;
    transform: none !important;
    pointer-events: none !important;
  }
  body.page-id-78 .dk-about-section::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    background: linear-gradient(to bottom, transparent 0, transparent 270px, rgba(0,0,0,.76) 400px, #000 525px) !important;
    pointer-events: none !important;
  }

  body.page-id-78 .dk-about-section .dk-about-inner {
    box-sizing: border-box !important;
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    width: 100% !important;
    max-width: 390px !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 74px 22px 13px !important;
    gap: 0 !important;
  }

  /* Image in PSD: ~x22–369, landscape 346 × 227, 20px round corners. */
  body.page-id-78 .dk-about-section .dk-about-photo-box {
    box-sizing: border-box !important;
    order: 1 !important;
    position: relative !important;
    inset: auto !important;
    display: block !important;
    flex: none !important;
    width: 100% !important;
    max-width: 346px !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 346 / 227 !important;
    margin: 0 auto 33px !important;
    padding: 0 !important;
    border: 1px solid #3edfd0 !important;
    border-radius: 21px !important;
    background: #061618 !important;
    overflow: hidden !important;
    box-shadow: none !important;
  }
  body.page-id-78 .dk-about-section .dk-about-photo,
  body.page-id-78 .dk-about-section .dk-about-photo .elementor-widget-container {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
  body.page-id-78 .dk-about-section .dk-about-photo img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center center !important;
    border-radius: 0 !important;
    transform: none !important;
  }

  body.page-id-78 .dk-about-section .dk-about-copy {
    box-sizing: border-box !important;
    order: 2 !important;
    position: relative !important;
    inset: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    text-align: center !important;
  }
  body.page-id-78 .dk-about-section .dk-about-kicker {
    display: block !important;
    width: 82px !important;
    max-width: 82px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0 auto 16px !important;
    padding: 0 !important;
  }
  body:not(#dk-font-override).page-id-78 .dk-about-section .dk-about-kicker .elementor-heading-title {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 10px !important;
    border: 1px solid #3edfd0 !important;
    border-radius: 999px !important;
    color: #fff !important;
    background: transparent !important;
    font-family: 'Poppins', Arial, sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 400 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
  }

  body.page-id-78 .dk-about-section .dk-about-title-a,
  body.page-id-78 .dk-about-section .dk-about-title-b {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    align-self: stretch !important;
    text-align: center !important;
  }
  body:not(#dk-font-override).page-id-78 .dk-about-section .dk-about-title-a .elementor-heading-title {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #fff !important;
    font-family: 'Playfair Display', Georgia, serif !important;
    font-size: clamp(22px, 6.41vw, 25px) !important;
    font-weight: 700 !important;
    line-height: 1.24 !important;
    letter-spacing: 0 !important;
    white-space: normal !important;
    text-align: center !important;
  }
  body:not(#dk-font-override).page-id-78 .dk-about-section .dk-about-title-b .elementor-heading-title {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #3edfd0 !important;
    font-family: 'Playfair Display', Georgia, serif !important;
    font-size: clamp(28px, 8.547vw, 33.333px) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    white-space: normal !important;
    text-align: center !important;
  }

  body.page-id-78 .dk-about-section .dk-about-intro {
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    max-width: 346px !important;
    margin: 19px auto 0 !important;
    padding: 0 1px !important;
    text-align: center !important;
  }
  body:not(#dk-font-override).page-id-78 .dk-about-section .dk-about-intro p {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #fff !important;
    font-family: 'Poppins', Arial, sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 400 !important;
    line-height: 2 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    text-wrap: balance;
  }
  /* Second PSD sentence is injected as real, screen-reader-readable text
     by the mobile-only companion script; never added to desktop markup. */

  /* Reference is a 2-column 1-2 / 3 layout, not the legacy 3 stacked rows. */
  body.page-id-78 .dk-about-section .dk-about-reasons {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: auto auto !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 32px 0 0 !important;
    padding: 0 !important;
    column-gap: 0 !important;
    row-gap: 28px !important;
    align-items: start !important;
    text-align: left !important;
  }
  body.page-id-78 .dk-about-section .dk-about-reason {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: 25px minmax(0, 1fr) !important;
    column-gap: 13px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 13px !important;
    border: 0 !important;
    background: transparent !important;
    text-align: left !important;
  }
  body.page-id-78 .dk-about-section .dk-about-reason:nth-child(3) {
    grid-column: 1 / 2 !important;
  }
  body.page-id-78 .dk-about-section .dk-about-number {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: none !important;
    width: 25px !important;
    min-width: 25px !important;
    max-width: 25px !important;
    height: 25px !important;
    min-height: 25px !important;
    max-height: 25px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: #3edfd0 !important;
  }
  body:not(#dk-font-override).page-id-78 .dk-about-section .dk-about-number .elementor-heading-title {
    margin: 0 !important;
    padding: 0 !important;
    color: #003a35 !important;
    font-family: 'Poppins', Arial, sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-align: center !important;
  }
  body.page-id-78 .dk-about-section .dk-about-reason-copy {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 7px !important;
    text-align: left !important;
  }
  body.page-id-78 .dk-about-section .dk-about-reason-title,
  body.page-id-78 .dk-about-section .dk-about-reason-text {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  body:not(#dk-font-override).page-id-78 .dk-about-section .dk-about-reason-title .elementor-heading-title {
    display: block !important;
    color: #3edfd0 !important;
    font-family: 'Poppins', Arial, sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
    white-space: normal !important;
  }
  body:not(#dk-font-override).page-id-78 .dk-about-section .dk-about-reason-text p {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #fff !important;
    font-family: 'Poppins', Arial, sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    letter-spacing: 0 !important;
    white-space: normal !important;
    text-wrap: wrap !important;
    text-align: left !important;
  }
}

@media (max-width: 359px) {
  body.page-id-78 .dk-about-section .dk-about-inner {
    padding: 58px 15px 12px !important;
  }
  body.page-id-78 .dk-about-section .dk-about-photo-box {
    margin-bottom: 27px !important;
  }
  body.page-id-78 .dk-about-section .dk-about-reasons {
    row-gap: 20px !important;
  }
  body:not(#dk-font-override).page-id-78 .dk-about-section .dk-about-reason-title .elementor-heading-title,
  body:not(#dk-font-override).page-id-78 .dk-about-section .dk-about-reason-text p {
    font-size: 11.5px !important;
  }
}