/** Nettside Utvikling form #77: desktop parity with the approved Forside enquiry. 
 * Source: homepage hero.css desktop form block. Homepage is unchanged. */
@media (min-width: 1101px) {
  body.page-id-269 .dk-service-lead {
    padding: 0 40px 38px !important;
    background: #000d10;
  }

  body.page-id-269 .dk-service-lead .dk-hero-lead-inner {
    /* Figma title begins at x≈188 on a 1500px artboard. */
    width: 100%;
    max-width: 1204px;
    margin: -37px auto 0;
    position: relative;
    z-index: 4;
  }

  body.page-id-269 .dk-service-lead .wpcf7 {
    /* Equal top/bottom padding, rather than a visibly deeper bottom edge. */
    padding: 28px 38px 28px !important;
    border-radius: 16px;
    border: 1px solid rgba(62,223,208,.7);
    background-color: #001317;
    /* Real overlay lives on ::before; keep only the original PSD streak
       photograph here so the gradient is not lost to background cascades. */
    background-image: url("https://www.digitalkreativ.no/wp-content/uploads/2026/10/pexels-justguryan-19945132-scaled.jpg") !important;
    background-position: center 48% !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    box-shadow: inset 0 0 26px rgba(0,0,0,.40),
      0 14px 30px rgba(0,0,0,.44),
      0 0 18px rgba(62,223,208,.10);
  }

  /* Dedicated full-panel gradient above the texture and below every form
     control. Darkest behind the left copy, with a continuous softer wash
     beneath the right inputs. Explicit layering avoids obscuring controls. */
  body.page-id-269 .dk-service-lead .wpcf7::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    border-radius: inherit !important;
    background:
      linear-gradient(90deg,
        rgba(0,5,8,.88) 0%,
        rgba(0,7,10,.78) 34%,
        rgba(0,8,12,.62) 68%,
        rgba(0,9,13,.52) 100%
      ) !important;
  }
  body.page-id-269 .dk-service-lead .wpcf7 form {
    position: relative !important;
    z-index: 1 !important;
  }

  /*
   * Contact Form 7 adds wpautop paragraph wrappers around shortcodes.
   * Default paragraph bottom margins were stretching the panel under its
   * last input row, even when the outer padding was set correctly.
   */
  body.page-id-269 .dk-service-lead .wpcf7 form,
  body.page-id-269 .dk-service-lead .dk-hero-lead-grid,
  body.page-id-269 .dk-service-lead .dk-hero-lead-fields,
  body.page-id-269 .dk-service-lead .dk-hero-lead-row {
    margin-block: 0 !important;
    padding-block: 0 !important;
  }

  body.page-id-269 .dk-service-lead .wpcf7 form > p,
  body.page-id-269 .dk-service-lead .dk-hero-lead-row > p,
  body.page-id-269 .dk-service-lead .dk-hero-lead-fields > p {
    margin: 0 !important;
    padding: 0 !important;
  }
  
  body.page-id-269 .dk-service-lead .dk-hero-lead-row > p {
    display: contents !important;
  }

  body.page-id-269 .dk-service-lead .wpcf7 form > p:empty {
    display: none !important;
  }

  body.page-id-269 .dk-service-lead .dk-hero-lead-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.07fr) minmax(0, 1fr);
    gap: clamp(22px, 2.27vw, 34px);
    /* Keep both input rows in their original position. */
    align-items: start;
  }

  /* Vertically center the heading + consent together against the complete
     two-row form, rather than using a fixed 24px top offset. The fields and
     the outer panel remain in place when text/font metrics change. */
  body.page-id-269 .dk-service-lead .dk-hero-lead-intro {
    align-self: center !important;
    padding-top: 0 !important;
  }

  body:not(#dk-font-override).page-id-269 .dk-service-lead .dk-hero-lead-intro h2 {
    margin: 0 0 24px !important;
    color: #ffffff !important;
    font-family: 'Playfair Display', Georgia, serif !important;
    font-weight: 700 !important;
    font-size: 33.3333px !important;
    line-height: 33.3333px !important;
    letter-spacing: 0 !important;
  }

  body.page-id-269 .dk-service-lead .dk-hero-lead-consent,
  body.page-id-269 .dk-service-lead .dk-hero-lead-consent label,
  body.page-id-269 .dk-service-lead .dk-hero-lead-consent .wpcf7-list-item-label,
  body.page-id-269 .dk-service-lead .dk-hero-lead-consent span {
    font-family: 'Poppins', Arial, sans-serif !important;
    font-size: 16.6667px !important;
    font-weight: 400 !important;
    line-height: 1.3 !important;
    letter-spacing: -.3333px !important;
    color: #ffffff !important;
  }

  body.page-id-269 .dk-service-lead .dk-hero-lead-consent label {
    gap: 12px;
    align-items: flex-start;
  }

  body.page-id-269 .dk-service-lead .dk-hero-lead-consent .wpcf7-acceptance input[type=checkbox] {
    flex: 0 0 16px !important;
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    min-height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
    inline-size: 16px;
    block-size: 16px;
    margin: 0 !important;
    border: 1.5px solid #3edfd0 !important;
  }

  body.page-id-269 .dk-service-lead .dk-hero-lead-fields {
    gap: 12px;
    min-width: 0;
  }

  body.page-id-269 .dk-service-lead .dk-hero-lead-row {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 13px;
  }

  body.page-id-269 .dk-service-lead .dk-hero-lead-row input:not([type=submit]),
  body.page-id-269 .dk-service-lead .dk-hero-lead-row input[type=submit] {
    width: 100% !important;
    min-width: 0;
    min-height: 48px !important;
    height: 48px;
    margin: 0 !important;
    padding: 0 19px !important;
    border-radius: 999px !important;
    font-family: 'Poppins', Arial, sans-serif !important;
    font-size: 16.6667px !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
  }

  body.page-id-269 .dk-service-lead .dk-hero-lead-row input:not([type=submit]) {
    color: #ffffff !important;
    background: rgba(0,14,17,.88) !important;
    border: 1px solid #3edfd0 !important;
  }

  body.page-id-269 .dk-service-lead .dk-hero-lead-row input::placeholder {
    font-family: 'Poppins', Arial, sans-serif !important;
    color: #d0dddc !important;
    font-weight: 400 !important;
    opacity: 1;
  }

  body.page-id-269 .dk-service-lead .dk-hero-lead-row input[type=submit] {
    border: 0 !important;
    background: #3edfd0 !important;
    color: #000000 !important;
    cursor: pointer;
  }

  body.page-id-269 .dk-service-lead .dk-hero-lead-row input[type=submit]:hover {
    background-color: #28c4bb !important;
  }

  /* Replace a generic text arrow only when the enhancement has completed.
     The original CF7 submit value remains a functional fallback without JS. */
  body.page-id-269 .dk-service-lead .dk-hero-lead-row input[type=submit].dk-lead-arrow-svg {
    background-color: #3edfd0 !important;
    background-image: url("https://www.digitalkreativ.no/wp-content/uploads/2026/10/Digital-Kreativ-Figma-Hero-CTA-Chevron-Dark.svg") !important;
    background-repeat: no-repeat !important;
    background-position: right 22px center !important;
    background-size: 6px 10px !important;
    text-align: left !important;
    padding-left: 21px !important;
    padding-right: 43px !important;
  }

  body.page-id-269 .dk-service-lead .dk-hero-lead-row input[type=submit].dk-lead-arrow-svg:hover {
    background-color: #28c4bb !important;
  }
}

/* Nettsider: only panel placement differs from homepage hero-overlap. */
body.page-id-269 .dk-service-lead.dk-hero-lead-wrap {
  padding:0 40px 38px!important;
  background:#000d10!important;
}
body.page-id-269 .dk-service-lead .dk-hero-lead-inner {
  width:100%!important;max-width:1204px!important;margin:0 auto!important;
}
@media (min-width:1101px) {
  body.page-id-269 .dk-service-lead .wpcf7 {
    min-height:0!important;padding:28px 38px!important;
    border-radius:16px!important;
    border-color:rgba(62,223,208,.7)!important;
    box-shadow:inset 0 0 26px rgba(0,0,0,.4),0 14px 30px rgba(0,0,0,.44),0 0 18px rgba(62,223,208,.10)!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-grid {
    display:grid!important;grid-template-columns:minmax(0,1.07fr) minmax(0,1fr)!important;
    gap:clamp(22px,2.27vw,34px)!important;align-items:start!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-intro {
    align-self:center!important;align-items:flex-start!important;
  }
  body:not(#dk-font-override).page-id-269 .dk-service-lead .dk-hero-lead-intro h2 {
    font-size:33.3333px!important;font-weight:700!important;line-height:33.3333px!important;
    letter-spacing:0!important;margin:0 0 24px!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-consent,
  body.page-id-269 .dk-service-lead .dk-hero-lead-consent label,
  body.page-id-269 .dk-service-lead .dk-hero-lead-consent span {
    font:400 16.6667px/1.3 'Poppins',Arial,sans-serif!important;
    letter-spacing:-.3333px!important;color:#fff!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-consent label {align-items:flex-start!important;gap:12px!important}
  body.page-id-269 .dk-service-lead .dk-hero-lead-consent .wpcf7-acceptance input[type=checkbox] {
    width:16px!important;min-width:16px!important;max-width:16px!important;
    height:16px!important;min-height:16px!important;max-height:16px!important;
    flex:0 0 16px!important;margin:0!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-row {
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:13px!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-fields {gap:12px!important}
  body.page-id-269 .dk-service-lead .dk-hero-lead-row input:not([type=submit]),
  body.page-id-269 .dk-service-lead .dk-hero-lead-row input[type=submit] {
    width:100%!important;height:48px!important;min-height:48px!important;max-height:48px!important;
    padding:0 19px!important;border-radius:999px!important;
    font:400 16.6667px/1.2 'Poppins',Arial,sans-serif!important;letter-spacing:0!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-row input:not([type=submit]) {
    border:1px solid #3edfd0!important;background:rgba(0,14,17,.88)!important;color:#fff!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-row input[type=submit] {
    background-color:#3edfd0!important;border:0!important;color:#000!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-row input::placeholder {
    font:400 16.6667px/1.2 'Poppins',Arial,sans-serif!important;color:#d0dddc!important;
  }
}
/* Keep the same two-column responsive arrangement on tablet too.
   The old service-page CSS switched to a different form at 780px. */
@media (min-width:768px) and (max-width:1100px) {
  body.page-id-269 .dk-service-lead.dk-hero-lead-wrap {
    padding:0 30px 38px!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-inner {
    width:100%!important;max-width:1150px!important;margin:0 auto!important;
  }
  body.page-id-269 .dk-service-lead .wpcf7 {
    min-height:0!important;padding:21px 23px!important;border-radius:16px!important;
    background-color:#001317!important;
    background-image:url("https://www.digitalkreativ.no/wp-content/uploads/2026/10/pexels-justguryan-19945132-scaled.jpg")!important;
    background-position:center 48%!important;background-size:cover!important;
    background-repeat:no-repeat!important;
  }
  body.page-id-269 .dk-service-lead .wpcf7::before {
    background:linear-gradient(90deg,
      rgba(0,5,8,.88) 0%,
      rgba(0,7,10,.78) 34%,
      rgba(0,8,12,.62) 68%,
      rgba(0,9,13,.52) 100%)!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-grid {
    display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)!important;
    gap:25px!important;align-items:center!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-intro h2 {
    font:700 23px/1.2 'Playfair Display',Georgia,serif!important;
    margin-bottom:14px!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-intro {
    align-items:flex-start!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-consent,
  body.page-id-269 .dk-service-lead .dk-hero-lead-consent label {
    font:400 11px/1.55 'Poppins',Arial,sans-serif!important;
    align-items:flex-start!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-fields {
    display:flex!important;flex-direction:column!important;gap:11px!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-row {
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;
  }
  body.page-id-269 .dk-service-lead .dk-hero-lead-row input:not([type=submit]),
  body.page-id-269 .dk-service-lead .dk-hero-lead-row input[type=submit] {
    width:100%!important;height:43px!important;min-height:43px!important;max-height:43px!important;
    font:400 12px/1.4 'Poppins',Arial,sans-serif!important;
  }
}

/* The desktop chevron stays identical, including its position in the button. */
body.page-id-269 .dk-service-lead .dk-hero-lead-row input[type=submit].dk-lead-arrow-svg {
  background-image:url("https://www.digitalkreativ.no/wp-content/uploads/2026/10/Digital-Kreativ-Figma-Hero-CTA-Chevron-Dark.svg")!important;
  background-repeat:no-repeat!important;background-position:right 22px center!important;background-size:6px 10px!important;
  text-align:left!important;padding-left:21px!important;padding-right:43px!important;
}
