/**
 * Nettside Utvikling project section visual parity with Forside / Referanser.
 * Page 269 only. Preserves its own heading, CTA, shortcode, project data
 * and filter JS. No global/homepage/Referanser styles are changed.
 */
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-filters {
  display:flex!important;align-items:center!important;justify-content:center!important;
  flex-wrap:wrap!important;gap:8px!important;
}
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-ref-filter{
  box-sizing:border-box!important;display:inline-flex!important;
  align-items:center!important;justify-content:center!important;
  min-height:43px!important;padding:9px 18px!important;
  border:1px solid #3edfd0!important;border-radius:999px!important;
  background:transparent!important;color:#fff!important;
  font:400 14px/1.35 'Poppins',Arial,sans-serif!important;
  white-space:nowrap!important;text-decoration:none!important;
}
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-ref-filter:is(.is-active,:hover,:focus-visible),
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-ref-filter[aria-current=page]{
  background:#3edfd0!important;color:#001d20!important;border-color:#3edfd0!important;
}
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-card{
  box-sizing:border-box!important;position:relative!important;display:flex!important;
  flex-direction:column!important;align-items:stretch!important;min-width:0!important;
  border:1px solid rgba(62,223,208,.7)!important;border-radius:20px!important;
  background:rgba(4,55,51,.5)!important;overflow:hidden!important;
  box-shadow:none!important;transform:none!important;
}
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-card[hidden]{
  display:none!important;
}
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-thumb{
  box-sizing:border-box!important;display:block!important;width:100%!important;
  height:174px!important;min-height:174px!important;flex:0 0 174px!important;
  border:0!important;border-radius:19px 19px 11px 11px!important;overflow:hidden!important;
}
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-thumb img{
  display:block!important;width:100%!important;max-width:none!important;
  height:100%!important;object-fit:cover!important;object-position:top center!important;
}
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-card-content{
  box-sizing:border-box!important;display:flex!important;flex-direction:column!important;
  align-items:center!important;justify-content:center!important;gap:8px!important;
  width:100%!important;min-width:0!important;
  min-height:95px!important;height:auto!important;padding:12px!important;
  opacity:1!important;visibility:visible!important;text-align:center!important;
}
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-name,
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-kind{
  margin:0!important;padding:0!important;text-align:center!important;
}
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-name a{
  color:#fff!important;font:600 16px/1.35 'Poppins',Arial,sans-serif!important;
  text-decoration:none!important;white-space:normal!important;
}
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-kind{
  color:#e3eeeb!important;font:400 14px/1.4 'Poppins',Arial,sans-serif!important;
}
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-ref-client-empty[hidden]{
  display:none!important;
}
body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-ref-client-empty:not([hidden]){
  display:block!important;min-height:0!important;margin:12px auto 0!important;
  color:#fff!important;font:400 13px/1.6 'Poppins',Arial,sans-serif!important;text-align:center!important;
}
@media (min-width:768px){
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-list{
    display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
    width:100%!important;gap:22px!important;align-items:stretch!important;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-card{
    min-height:270px!important;height:auto!important;
  }
}
@media (min-width:768px) and (max-width:1023px){
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-list{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media (max-width:767px){
  body.page-id-269 .dk-service-portfolio {
    overflow:hidden!important;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references{
    width:100vw!important;max-width:none!important;
    margin-left:calc(50% - 50vw)!important;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-projects-inner,
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-projects-gallery{
    display:flex!important;flex-direction:column!important;align-items:stretch!important;
    width:100%!important;max-width:none!important;min-width:0!important;
    margin:0!important;padding:0!important;gap:0!important;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-filters{
    box-sizing:border-box!important;display:flex!important;flex-flow:row nowrap!important;
    justify-content:flex-start!important;align-items:center!important;
    width:100vw!important;min-height:46px!important;
    margin:0 0 21px!important;padding:0 19px 7px!important;gap:8px!important;
    overflow-x:auto!important;overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-filters::-webkit-scrollbar{
    display:none!important;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-ref-filter{
    flex:0 0 auto!important;min-height:35px!important;height:35px!important;
    padding:7px 15px!important;font-size:12.5px!important;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-list{
    --dk-service-reference-width:min(69.23vw,270px);
    box-sizing:border-box!important;display:grid!important;
    grid-template-columns:none!important;grid-template-rows:repeat(2,270px)!important;
    grid-auto-flow:column!important;grid-auto-columns:var(--dk-service-reference-width)!important;
    justify-content:start!important;align-items:start!important;
    column-gap:31px!important;row-gap:18px!important;
    width:100vw!important;max-width:none!important;
    margin:0!important;padding:3px calc((100vw - var(--dk-service-reference-width))/2) 8px!important;
    overflow-x:auto!important;overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;
    scroll-padding-inline:calc((100vw - var(--dk-service-reference-width))/2)!important;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-list::-webkit-scrollbar{
    display:none!important;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-card{
    width:100%!important;min-width:0!important;max-width:none!important;
    height:270px!important;min-height:270px!important;max-height:270px!important;
    margin:0!important;scroll-snap-align:center!important;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-card-content{
    height:95px!important;min-height:95px!important;max-height:95px!important;
    padding:10px 12px!important;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-name a{
    font-size:16px!important;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-list:not(:has(.dk-reference-card:not([hidden]))){
    display:block!important;grid-template-rows:none!important;min-height:0!important;
  }
}
@media (max-width:359px){
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-list{
    grid-template-rows:repeat(2,256px)!important;row-gap:16px!important;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-card{
    height:256px!important;min-height:256px!important;max-height:256px!important;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-thumb{
    height:162px!important;min-height:162px!important;flex-basis:162px!important;
  }
  body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-card-content{
    height:94px!important;min-height:94px!important;max-height:94px!important;
  }
}

/* Section 8: Nettside Utvikling references, 1500px PSD desktop parity.
   The same [dk_references mode="featured" limit="6"] shortcode, WordPress
   project content, homepage category/filter JS and project links are reused.
   Reference: heading y4906; filter pills x461..1042 y5018..5066;
   six cards x294/605/917, rows y5120/5440, each ~282x293;
   CTA x575 y5773 349x62. Mobile/tablet keep approved shared card flows.
   No forced first-card hover or hard-coded project screenshots. */
@media(min-width:1101px){
  html body.page-id-269 .dk-service-portfolio{
    background:#000!important;
    padding:55px 0 65px!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-service-shell{
    box-sizing:border-box!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:0!important;
    --gap:0px!important;
    --row-gap:0px!important;
    width:min(1240px,calc(100% - 48px))!important;
    max-width:1240px!important;
    margin:0 auto!important;
    padding:0!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-service-section-heading{
    margin:0 auto 22px!important;
    width:100%!important;
    padding:0!important;
    text-align:center!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-service-section-heading .elementor-heading-title{
    color:#3edfd0!important;
    font-family:'Playfair Display',Georgia,serif!important;
    font-size:33.3333px!important;
    font-weight:700!important;
    line-height:1.3!important;
    letter-spacing:0!important;
    text-align:center!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-service-section-lead{
    box-sizing:border-box!important;
    width:100%!important;
    max-width:1190px!important;
    padding:0!important;
    margin:0 auto 27px!important;
    text-align:center!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-service-section-lead p{
    color:#fff!important;
    font:400 20.8333px/1.55 'Poppins',Arial,sans-serif!important;
    letter-spacing:0!important;
    margin:0!important;
    text-align:center!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-service-portfolio__shortcode{
    width:100%!important;
    margin:0!important;
    padding:0!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references,
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-projects-inner,
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-projects-gallery{
    box-sizing:border-box!important;
    background:transparent!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    min-height:0!important;
    height:auto!important;
    padding:0!important;
    margin:0!important;
    gap:0!important;
    --gap:0px!important;
    --row-gap:0px!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-filters{
    display:flex!important;
    width:max-content!important;
    max-width:100%!important;
    height:48px!important;
    margin:0 auto 54px!important;
    padding:0!important;
    gap:9px!important;
    --gap:9px!important;
    align-items:center!important;
    justify-content:center!important;
    flex-wrap:nowrap!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-ref-filter{
    box-sizing:border-box!important;
    flex:0 0 auto!important;
    height:48px!important;
    min-height:48px!important;
    padding:0 23px!important;
    border:1px solid #3edfd0!important;
    border-radius:999px!important;
    background:transparent!important;
    color:#fff!important;
    font:400 16.6667px/1 'Poppins',Arial,sans-serif!important;
    letter-spacing:0!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-ref-filter:is(.is-active,:hover,:focus-visible){
    background:#3edfd0!important;
    color:#031f20!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-ref-filter:nth-child(1){width:101px!important;}
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-ref-filter:nth-child(2){width:142px!important;}
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-ref-filter:nth-child(3){width:143px!important;}
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-ref-filter:nth-child(4){width:169px!important;}
  /* Homepage and PSD show the same four primary categories at desktop size.
     Extra WordPress categories remain available from the full Referanser page. */
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-ref-filter:nth-child(n+5){
    display:none!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-list{
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,282px))!important;
    grid-auto-rows:293px!important;
    width:min(906px,100%)!important;
    max-width:906px!important;
    margin:0 auto!important;
    padding:0!important;
    column-gap:30px!important;
    row-gap:27px!important;
    --column-gap:30px!important;
    --row-gap:27px!important;
    justify-content:center!important;
    align-items:stretch!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-card{
    box-sizing:border-box!important;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    min-width:0!important;
    height:293px!important;
    min-height:293px!important;
    max-height:293px!important;
    padding:0!important;
    margin:0!important;
    border:1px solid rgba(62,223,208,.68)!important;
    border-radius:14px!important;
    background:#080808!important;
    box-shadow:none!important;
    overflow:hidden!important;
    transform:none!important;
    transition:background-color .2s,border-color .2s,box-shadow .2s!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-card:hover{
    background:#393939!important;
    border-color:#3edfd0!important;
    box-shadow:0 0 18px rgba(62,223,208,.09)!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-card:focus-within{
    outline:2px solid #3edfd0!important;
    outline-offset:2px!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-thumb{
    box-sizing:border-box!important;
    display:block!important;
    position:relative!important;
    flex:0 0 188px!important;
    width:100%!important;
    height:188px!important;
    min-height:188px!important;
    max-height:188px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:13px 13px 0 0!important;
    overflow:hidden!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-thumb img{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:top center!important;
  }
  /* Teal chevron is an interaction affordance in the PSD/homepage, never
     permanently attached to the first card. The entire thumb stays a link. */
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-thumb::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    z-index:4!important;
    top:126px!important;
    right:13px!important;
    width:30px!important;
    height:47px!important;
    padding:0!important;
    border:0!important;
    border-radius:999px!important;
    background:#3edfd0 url("https://www.digitalkreativ.no/wp-content/uploads/2026/10/Digital-Kreativ-Figma-Hero-CTA-Chevron-Dark.svg") center / 9px 13px no-repeat!important;
    opacity:0!important;
    visibility:hidden!important;
    transform:translateX(4px)!important;
    transition:opacity .18s ease,transform .18s ease!important;
    pointer-events:none!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-reference-card:is(:hover,:focus-within) .dk-reference-thumb::after{
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-card-content{
    box-sizing:border-box!important;
    display:flex!important;
    flex:1 1 auto!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:center!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    margin:0!important;
    padding:14px 18px 13px!important;
    gap:8px!important;
    --gap:8px!important;
    text-align:left!important;
    background:transparent!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-name,
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-kind{
    width:100%!important;
    margin:0!important;
    padding:0!important;
    text-align:left!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-name a{
    color:#fff!important;
    font:600 16px/1.25 'Poppins',Arial,sans-serif!important;
    letter-spacing:0!important;
    white-space:normal!important;
    text-decoration:none!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-managed-references .dk-project-kind{
    color:#e2e2e2!important;
    font:400 15px/1.35 'Poppins',Arial,sans-serif!important;
    letter-spacing:0!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-service-portfolio__cta{
    width:auto!important;
    max-width:none!important;
    margin:40px auto 0!important;
    padding:0!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-service-portfolio__cta .elementor-button{
    box-sizing:border-box!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    min-width:349px!important;
    min-height:62px!important;
    padding:0 23px 0 26px!important;
    border:1px solid #fff!important;
    border-radius:999px!important;
    background:transparent!important;
    color:#fff!important;
    font:400 16.6667px/1.25 'Poppins',Arial,sans-serif!important;
    text-decoration:none!important;
    box-shadow:none!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-service-portfolio__cta .elementor-button::after{
    content:""!important;
    display:block!important;
    flex:0 0 9px!important;
    width:9px!important;
    height:9px!important;
    margin-left:17px!important;
    border-top:1.5px solid currentColor!important;
    border-right:1.5px solid currentColor!important;
    transform:rotate(45deg)!important;
    pointer-events:none!important;
  }
  html body.page-id-269 .dk-service-portfolio .dk-service-portfolio__cta .elementor-button:hover{
    border-color:#3edfd0!important;
    background:#3edfd0!important;
    color:#00332f!important;
  }
}
/* The approved homepage-like mobile carousel and tablet grids are unchanged. */