/* Digital Kreativ — OM OSS + CTA ribbon.
 * Desktop geometry is mapped from the uploaded layered 1500×5257 PSD.
 * Elementor content stays editable; mobile/tablet rules remain below.
 */
.dk-about-section,.dk-about-section *, .dk-about-cta-section,.dk-about-cta-section *{box-sizing:border-box}

/* Original turquoise ringing-phone artwork (Media Library #209).
   Keep the Elementor icon widget for editability, but display the approved
   PNG in the existing icon slot on desktop, tablet, and mobile. */
body.page-id-78 .dk-about-cta-section .dk-about-banner-phone-icon .elementor-icon{
  display:block!important;
  width:100%!important;
  height:100%!important;
  background:url("https://www.digitalkreativ.no/wp-content/uploads/2026/10/Phone-2.png") center/contain no-repeat!important;
}
body.page-id-78 .dk-about-cta-section .dk-about-banner-phone-icon .elementor-icon svg{
  visibility:hidden!important;
}

@media(min-width:1151px){
  .dk-about-section{
    --dka:#3edfd0;
    position:relative!important;
    isolation:isolate;
    overflow:hidden!important;
    width:100%!important;
    max-width:none!important;
    height:min(591px,39.4vw)!important;
    min-height:min(591px,39.4vw)!important;
    margin:0!important;
    padding:0!important;
    color:#fff!important;
    background:#000!important;
    font-family:'Poppins',Arial,sans-serif!important;
  }
  /* PSD source: exact Visax wave photograph already in the Media Library.
     Unlike the old miniature SVG, it covers the full OM OSS area with its
     original black negative space and turquoise curved-line geometry. */
  .dk-about-section::before{
    content:""!important;
    position:absolute!important;
    z-index:0!important;
    pointer-events:none!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    opacity:.48!important;
    background:url("https://www.digitalkreativ.no/wp-content/uploads/2026/10/visax-8oni9vTWj7U-unsplash-scaled.jpg") center center/cover no-repeat!important;
  }
  .dk-about-section::after{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:0!important;
    pointer-events:none!important;
    background:linear-gradient(90deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.02) 58%,rgba(0,0,0,.16) 100%)!important;
  }
  .dk-about-section .dk-about-inner{
    position:relative!important;
    z-index:1!important;
    display:block!important;
    width:100%!important;
    max-width:1500px!important;
    height:100%!important;
    margin:0 auto!important;
    padding:0!important;
  }
  .dk-about-section .dk-about-copy{
    position:absolute!important;
    left:min(75px,5vw)!important;
    top:min(113px,7.5333vw)!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    width:min(663px,44.2vw)!important;
    margin:0!important;
    padding:0!important;
    gap:0!important;
  }
  .dk-about-section .dk-about-kicker{
    width:min(127px,8.4667vw)!important;
    height:min(42px,2.8vw)!important;
    max-width:none!important;
    margin:0 0 min(31px,2.0667vw)!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;
    margin:0!important;
    padding:0!important;
    border:1px solid #3edfd0!important;
    border-radius:999px!important;
    background:transparent!important;
    color:#fff!important;
    font-family:'Poppins',Arial,sans-serif!important;
    font-size:min(16.6667px,1.1111vw)!important;
    font-weight:400!important;
    line-height:1!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
  }
  .dk-about-section .dk-about-title-a,
  .dk-about-section .dk-about-title-b{
    width:100%!important;
    margin:0!important;
    padding:0!important;
  }
  .dk-about-section .dk-about-title-a .elementor-heading-title{
    margin:0!important;
    color:#fff!important;
    font-family:'Playfair Display',Georgia,serif!important;
    font-size:min(33.3333px,2.2222vw)!important;
    font-weight:700!important;
    /* PSD paired-title rhythm: the accent line follows on a 60px step. */
    line-height:min(60px,4vw)!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
  }
  .dk-about-section .dk-about-title-b .elementor-heading-title{
    margin:0!important;
    color:#3edfd0!important;
    font-family:'Playfair Display',Georgia,serif!important;
    font-size:min(50px,3.3333vw)!important;
    font-weight:700!important;
    line-height:min(60px,4vw)!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
  }
  .dk-about-section .dk-about-intro{
    width:min(433px,28.8667vw)!important;
    max-width:none!important;
    margin:min(23px,1.5333vw) 0 0!important;
    padding:0!important;
  }
  .dk-about-section .dk-about-intro p{
    margin:0!important;
    color:#fff!important;
    font-family:'Poppins',Arial,sans-serif!important;
    font-size:min(16.6667px,1.1111vw)!important;
    font-weight:400!important;
    line-height:min(33.3333px,2.2222vw)!important;
    letter-spacing:0!important;
  }
  .dk-about-section .dk-about-reasons{
    position:relative!important;
    display:grid!important;
    grid-template-columns:min(220px,14.6667vw) min(225px,15vw) min(245px,16.3333vw)!important;
    column-gap:min(16px,1.0667vw)!important;
    row-gap:0!important;
    width:min(722px,48.1333vw)!important;
    max-width:none!important;
    margin:min(40px,2.6667vw) 0 0 min(2px,.1333vw)!important;
    padding:0!important;
    align-items:start!important;
  }
  .dk-about-section .dk-about-reason{
    display:grid!important;
    grid-template-columns:min(37px,2.4667vw) minmax(0,1fr)!important;
    column-gap:min(13px,.8667vw)!important;
    align-items:start!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
  }
  .dk-about-section .dk-about-number{
    width:min(37px,2.4667vw)!important;
    max-width:none!important;
    height:min(37px,2.4667vw)!important;
    min-height:0!important;
    margin:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border:0!important;
    border-radius:min(8px,.5333vw)!important;
    background:#3edfd0!important;
    box-shadow:none!important;
  }
  body:not(#dk-font-override).page-id-78 .dk-about-section .dk-about-number .elementor-heading-title{
    margin:0!important;
    color:#003a35!important;
    font-family:'Poppins',Arial,sans-serif!important;
    font-size:min(16.6667px,1.1111vw)!important;
    font-weight:400!important;
    line-height:1!important;
  }
  .dk-about-section .dk-about-reason-copy{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:0!important;
    min-width:0!important;
    margin:min(2px,.1333vw) 0 0!important;
    padding:0!important;
  }
  /* Widen the copy areas to reproduce the PSD's two-line descriptions
     while preserving the 37px badges and 13px badge-to-copy spacing. */
  .dk-about-section .dk-about-reason:nth-child(1) .dk-about-reason-copy{width:min(170px,11.3333vw)!important}
  .dk-about-section .dk-about-reason:nth-child(2) .dk-about-reason-copy{width:min(175px,11.6667vw)!important}
  .dk-about-section .dk-about-reason:nth-child(3) .dk-about-reason-copy{width:min(195px,13vw)!important}
  .dk-about-section .dk-about-reason-title,
  .dk-about-section .dk-about-reason-text{width:100%!important;max-width:none!important}
  .dk-about-section .dk-about-reason-title{
    margin:0 0 min(7px,.4667vw)!important;
    padding:0!important;
  }
  body:not(#dk-font-override).page-id-78 .dk-about-section .dk-about-reason-title .elementor-heading-title{
    margin:0!important;
    color:#3edfd0!important;
    font-family:'Poppins',Arial,sans-serif!important;
    /* Match the 15px descriptions in typography.css at desktop widths. */
    font-size:15px!important;
    font-weight:600!important;
    line-height:1.44!important;
    letter-spacing:0!important;
    white-space:normal!important;
  }
  .dk-about-section .dk-about-reason-text{
    margin:0!important;
    padding:0!important;
  }
  .dk-about-section .dk-about-reason-text p{
    margin:0!important;
    color:#fff!important;
    font-family:'Poppins',Arial,sans-serif!important;
    font-size:min(12.5px,.8333vw)!important;
    font-weight:400!important;
    line-height:min(18.3333px,1.2222vw)!important;
    letter-spacing:0!important;
    white-space:normal!important;
    text-wrap:balance!important;
  }
  .dk-about-section .dk-about-photo-box{
    position:absolute!important;
    left:min(837px,55.8vw)!important;
    top:min(127px,8.4667vw)!important;
    width:min(588px,39.2vw)!important;
    height:min(390px,26vw)!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border:1px solid #3edfd0!important;
    border-radius:min(22px,1.4667vw)!important;
    background:#061618!important;
    box-shadow:none!important;
  }
  .dk-about-section .dk-about-photo{
    width:100%!important;
    height:100%!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
  }
  .dk-about-section .dk-about-photo .elementor-widget-container,
  .dk-about-section .dk-about-photo a,
  .dk-about-section .dk-about-photo img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
  }
  .dk-about-section .dk-about-photo img{
    object-fit:cover!important;
    object-position:center!important;
    border-radius:0!important;
    transform:none!important;
    transition:none!important;
  }

  /* PSD CTA ribbon: 1355×172 at x=73. */
  .dk-about-cta-section{
    --dka:#3edfd0;
    position:relative!important;
    isolation:isolate;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    /* The PSD ribbon ends at y=3502 and the testimonial card begins at
       y=3594: a 92px gap, already supplied by the testimonial card's 92px
       top offset. The former extra 90px bottom padding doubled that gap. */
    padding:0!important;
    background:#000!important;
    font-family:'Poppins',Arial,sans-serif!important;
  }
  .dk-about-cta-section .dk-about-banner{
    position:relative!important;
    isolation:isolate;
    overflow:hidden!important;
    display:block!important;
    width:min(1355px,90.3333vw)!important;
    max-width:none!important;
    height:min(172px,11.4667vw)!important;
    min-height:0!important;
    margin:0 auto!important;
    padding:0!important;
    border:1px solid #3edfd0!important;
    border-radius:min(27px,1.8vw)!important;
    background-color:#001116!important;
    background-image:url("https://www.digitalkreativ.no/wp-content/uploads/2026/10/pexels-karola-g-4862957-scaled.jpg")!important;
    background-repeat:no-repeat!important;
    /* Exact PSD smart-object crop: source 1364×909 positioned -11/-440
       inside the 1355×172 ribbon. */
    background-size:min(1364px,90.9333vw) min(909px,60.6vw)!important;
    background-position:max(-11px,-.7333vw) max(-440px,-29.3333vw)!important;
    box-shadow:none!important;
  }
  .dk-about-cta-section .dk-about-banner::before{
    content:""!important;
    position:absolute!important;
    z-index:0!important;
    inset:0!important;
    pointer-events:none!important;
    border-radius:inherit!important;
    background:
      linear-gradient(
        90deg,
        rgb(0 18 20 / .78) 0%,
        rgb(0 22 24 / .74) 46%,
        rgb(0 18 20 / .78) 100%
      )!important;
  }
  .dk-about-cta-section .dk-about-banner > *{
    position:absolute!important;
    z-index:1!important;
  }
  .dk-about-cta-section .dk-about-banner-logo{
    position:absolute!important;
    left:min(37px,2.4667vw)!important;
    top:min(39px,2.6vw)!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:min(117px,7.8vw)!important;
    max-width:none!important;
    height:min(94px,6.2667vw)!important;
    margin:0!important;
    padding:0 min(37px,2.4667vw) 0 0!important;
    border-right:1px solid #3edfd0!important;
    overflow:visible!important;
  }
  .dk-about-cta-section .dk-about-banner-logo .elementor-widget-container,
  .dk-about-cta-section .dk-about-banner-logo img{
    display:block!important;
    width:min(80px,5.3333vw)!important;
    height:min(94px,6.2667vw)!important;
    max-width:none!important;
    margin:0!important;
    object-fit:contain!important;
  }
  .dk-about-cta-section .dk-about-banner-content{
    position:absolute!important;
    left:min(192px,12.8vw)!important;
    top:min(30px,2vw)!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    width:min(600px,40vw)!important;
    gap:0!important;
    margin:0!important;
    padding:0!important;
  }
  .dk-about-cta-section .dk-about-banner-eyebrow{
    margin:0 0 min(10px,.6667vw)!important;
  }
  body:not(#dk-font-override).page-id-78 .dk-about-cta-section .dk-about-banner-eyebrow .elementor-heading-title{
    margin:0!important;
    color:#fff!important;
    font-family:'Poppins',Arial,sans-serif!important;
    font-size:min(16.6667px,1.1111vw)!important;
    font-weight:400!important;
    line-height:min(20px,1.3333vw)!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
  }
  .dk-about-cta-section .dk-about-banner-title{
    margin:0 0 min(9px,.6vw)!important;
  }
  .dk-about-cta-section .dk-about-banner-title .elementor-heading-title{
    margin:0!important;
    color:#3edfd0!important;
    font-family:'Playfair Display',Georgia,serif!important;
    font-size:min(31.25px,2.0833vw)!important;
    font-weight:700!important;
    line-height:min(38px,2.5333vw)!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
  }
  .dk-about-cta-section .dk-about-banner-desc{
    margin:0!important;
  }
  .dk-about-cta-section .dk-about-banner-desc p{
    margin:0!important;
    color:#fff!important;
    font-family:'Poppins',Arial,sans-serif!important;
    font-size:min(16.6667px,1.1111vw)!important;
    font-weight:400!important;
    line-height:min(25px,1.6667vw)!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
  }
  .dk-about-cta-section .dk-about-banner-btn{
    position:absolute!important;
    left:min(877px,58.4667vw)!important;
    top:min(61px,4.0667vw)!important;
    width:min(172px,11.4667vw)!important;
    height:min(51px,3.4vw)!important;
    margin:0!important;
  }
  .dk-about-cta-section .dk-about-banner-btn .elementor-button{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    padding:0 min(22px,1.4667vw) 0 min(25px,1.6667vw)!important;
    border:0!important;
    border-radius:999px!important;
    background:#3edfd0!important;
    color:#000!important;
    font-family:'Poppins',Arial,sans-serif!important;
    font-size:min(16.6667px,1.1111vw)!important;
    font-weight:400!important;
    line-height:1!important;
    text-decoration:none!important;
    transform:none!important;
    box-shadow:none!important;
  }
  .dk-about-cta-section .dk-about-banner-btn .elementor-button::after{
    content:""!important;
    width:min(10px,.6667vw)!important;
    height:min(14px,.9333vw)!important;
    margin:0!important;
    background:url("https://www.digitalkreativ.no/wp-content/uploads/2026/10/Digital-Kreativ-Figma-Hero-CTA-Chevron-Dark.svg") center/100% 100% no-repeat!important;
  }
  .dk-about-cta-section .dk-about-banner-btn .elementor-button:hover,
  .dk-about-cta-section .dk-about-banner-btn .elementor-button:focus-visible{
    background:#fff!important;
    color:#000!important;
    transform:none!important;
  }
  .dk-about-cta-section .dk-about-banner-divider{
    position:absolute!important;
    left:min(1091px,72.7333vw)!important;
    top:min(65px,4.3333vw)!important;
    width:1px!important;
    min-width:1px!important;
    max-width:1px!important;
    flex:0 0 1px!important;
    --width:1px!important;
    height:min(42px,2.8vw)!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:rgb(62 223 208 / .72)!important;
  }
  .dk-about-cta-section .dk-about-banner-call{
    position:absolute!important;
    left:min(1141px,76.0667vw)!important;
    top:min(68px,4.5333vw)!important;
    display:grid!important;
    grid-template-columns:min(29px,1.9333vw) minmax(0,1fr)!important;
    column-gap:min(21px,1.4vw)!important;
    align-items:start!important;
    width:min(220px,14.6667vw)!important;
    margin:0!important;
    padding:0!important;
  }
  .dk-about-cta-section .dk-about-banner-phone-icon{
    width:min(29px,1.9333vw)!important;
    height:min(29px,1.9333vw)!important;
    margin:min(4px,.2667vw) 0 0!important;
  }
  .dk-about-cta-section .dk-about-banner-phone-icon .elementor-icon{
    color:#3edfd0!important;
    fill:#3edfd0!important;
    font-size:min(29px,1.9333vw)!important;
  }
  .dk-about-cta-section .dk-about-banner-phone-icon svg{
    width:100%!important;
    height:100%!important;
  }
  .dk-about-cta-section .dk-about-banner-call-text{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:min(2px,.1333vw)!important;
    margin:0!important;
    padding:0!important;
  }
  .dk-about-cta-section .dk-about-banner-phone-label,
  .dk-about-cta-section .dk-about-banner-phone{
    margin:0!important;
    padding:0!important;
  }
  body:not(#dk-font-override).page-id-78 .dk-about-cta-section .dk-about-banner-phone-label .elementor-heading-title{
    margin:0!important;
    color:#3edfd0!important;
    font-family:'Poppins',Arial,sans-serif!important;
    font-size:min(16.6667px,1.1111vw)!important;
    font-weight:400!important;
    line-height:min(19px,1.2667vw)!important;
  }
  body:not(#dk-font-override).page-id-78 .dk-about-cta-section .dk-about-banner-phone .elementor-heading-title,
  body:not(#dk-font-override).page-id-78 .dk-about-cta-section .dk-about-banner-phone .elementor-heading-title a{
    margin:0!important;
    color:#fff!important;
    font-family:'Poppins',Arial,sans-serif!important;
    font-size:min(14.5833px,.9722vw)!important;
    font-weight:400!important;
    line-height:min(19px,1.2667vw)!important;
    white-space:nowrap!important;
    text-decoration:none!important;
  }
  .dk-about-section a:focus-visible,
  .dk-about-cta-section a:focus-visible{
    outline:2px solid #e7fffc!important;
    outline-offset:3px!important;
  }
}

@media(max-width:1150px){
 /* Make the original PSD wave visible on tablet/mobile as well. */
 .dk-about-section{position:relative!important;isolation:isolate;overflow:hidden!important;background:#000!important}
 .dk-about-section::before{content:""!important;position:absolute!important;inset:0!important;z-index:0!important;pointer-events:none!important;width:100%!important;height:100%!important;opacity:.48!important;background:url("https://www.digitalkreativ.no/wp-content/uploads/2026/10/visax-8oni9vTWj7U-unsplash-scaled.jpg") center center/cover no-repeat!important}
 .dk-about-section .dk-about-inner{position:relative!important;z-index:1!important;padding:76px 30px 54px;gap:32px}
 .dk-about-section .dk-about-reasons{gap:10px!important}
 .dk-about-section .dk-about-reason{grid-template-columns:30px 1fr;gap:7px!important}
 .dk-about-section .dk-about-number{width:30px!important;max-width:30px!important;min-height:30px!important}
 .dk-about-section .dk-about-reason-title .elementor-heading-title{font-size:12px!important}
 .dk-about-section .dk-about-reason-text p{font-size:12px!important}
 .dk-about-cta-section{padding:0 30px 72px!important}
 .dk-about-cta-section .dk-about-banner{grid-template-columns:80px minmax(0,1fr) auto!important;gap:15px!important;padding:20px!important}
 .dk-about-cta-section .dk-about-banner-logo{width:74px!important;max-width:74px!important}
 .dk-about-cta-section .dk-about-banner-divider{display:none!important}
 .dk-about-cta-section .dk-about-banner-call{grid-column:2/4;justify-self:end}
}
@media(max-width:850px){
 .dk-about-section .dk-about-inner{grid-template-columns:1fr!important;gap:31px!important;padding:66px 28px 42px}
 .dk-about-section .dk-about-copy{max-width:735px}
 .dk-about-section .dk-about-photo-box{max-width:735px;margin:0 auto}
 .dk-about-section .dk-about-reasons{gap:18px!important;max-width:740px}
 .dk-about-section:before{left:-24%;bottom:24%;width:115vw;opacity:.4}
 .dk-about-cta-section{padding:0 28px 68px!important}
 .dk-about-cta-section .dk-about-banner{grid-template-columns:75px minmax(0,1fr) auto!important;gap:13px!important}
 .dk-about-cta-section .dk-about-banner-title .elementor-heading-title{font-size:25px!important}
}
@media(max-width:600px){
 .dk-about-section .dk-about-inner{padding:58px 20px 32px;gap:27px!important}
 .dk-about-section .dk-about-kicker{margin-bottom:20px!important}
 .dk-about-section .dk-about-title-a .elementor-heading-title{font-size:27px!important}
 .dk-about-section .dk-about-title-b .elementor-heading-title{font-size:clamp(30px,7.2vw,39px)!important}
 .dk-about-section .dk-about-intro{margin:18px 0 23px!important}
 .dk-about-section .dk-about-intro p{font-size:15px!important}
 .dk-about-section .dk-about-reasons{grid-template-columns:1fr!important;gap:17px!important}
 .dk-about-section .dk-about-reason{grid-template-columns:34px 1fr;gap:12px!important}
 .dk-about-section .dk-about-reason-title .elementor-heading-title{font-size:14px!important}
 .dk-about-section .dk-about-reason-text p{font-size:13px!important}
 .dk-about-section .dk-about-number{width:33px!important;max-width:33px!important;min-height:33px!important}
 .dk-about-cta-section{padding:0 17px 62px!important}
 .dk-about-cta-section .dk-about-banner{grid-template-columns:60px minmax(0,1fr)!important;gap:13px!important;padding:20px 17px!important}
 .dk-about-cta-section .dk-about-banner-logo{width:58px!important;max-width:58px!important;height:75px;padding-right:10px}
 .dk-about-cta-section .dk-about-banner-logo .elementor-widget-container{width:45px;height:65px}
 .dk-about-cta-section .dk-about-banner-logo img{height:65px!important;width:93px!important}
 .dk-about-cta-section .dk-about-banner-content{grid-column:2}
 .dk-about-cta-section .dk-about-banner-title .elementor-heading-title{font-size:21px!important}
 .dk-about-cta-section .dk-about-banner-btn{grid-column:1/-1;justify-self:start}
 .dk-about-cta-section .dk-about-banner-call{grid-column:1/-1;justify-self:start}
 .dk-about-cta-section .dk-about-banner-divider{display:none!important}
}
@media(max-width:360px){
 .dk-about-section .dk-about-inner{padding-inline:16px}
 .dk-about-cta-section{padding-inline:14px!important}
 .dk-about-cta-section .dk-about-banner{padding:17px 14px!important}
 .dk-about-cta-section .dk-about-banner-title .elementor-heading-title{font-size:19px!important}
}
@media(prefers-reduced-motion:reduce){
 .dk-about-section .dk-about-photo img,
 .dk-about-cta-section .dk-about-banner-btn .elementor-button{transition:none!important;transform:none!important}
}