/* ============================================================
   DELIVERY PRIME GGSB LLC — main stylesheet
   Motif: electrical breaker load center
   Palette:
     panel-steel body .......... #262B31
     switchboard-white text .... #E9ECEF
     main-amber accent ......... #DBA03A
     dead-front ivory .......... #F1EEE7 (ink #26241E)
     bus-graphite .............. #2E353D
     panel-deep ................ #171A1F
     seam-line ................. #3B444E
     trip-flag red ............. #BE4A38
   No gradients on text. No rgba. No opacity decimals.
   ============================================================ */

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-size: 16px;
  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  background-color: #262B31;
  color: #E9ECEF;
  line-height: 1.7;
  overflow-x: hidden;
}

.dp-site-wrap {
  width: 100%;
  min-height: 100%;
}

p {
  margin: 0 0 1em;
}

a {
  color: #DBA03A;
  text-decoration: none;
}

a:hover,
a:focus {
  text-decoration: underline;
}

/* ------------------------------------------------------------
   NAVIGATION — ROCKERS DEAD FRONT
   ------------------------------------------------------------ */

.dp-rockersrow {
  background-color: #2E353D;
  border-bottom: 4px solid #171A1F;
  box-shadow: inset 0 -2px 0 #3B444E;
  padding: 20px 22px 26px;
}

.dp-rockersinner {
  max-width: 1240px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 26px;
  flex-wrap: wrap;
}

.dp-directorycard {
  background-color: #F1EEE7;
  color: #26241E;
  border: 3px solid #171A1F;
  border-radius: 4px;
  padding: 10px 16px 12px;
  min-width: 240px;
  position: relative;
  box-shadow: 4px 4px 0 #171A1F;
}

.dp-directorycard::before {
  content: "";
  position: absolute;
  top: 6px;
  right: 8px;
  width: 10px;
  height: 10px;
  background-color: #BE4A38;
  border-radius: 50%;
}

.dp-directorybrand {
  display: block;
  font-size: 1.22rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  color: #26241E;
  text-transform: uppercase;
}

.dp-directorydesk {
  display: block;
  font-size: 0.78rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: #3B444E;
  margin-top: 3px;
}

.dp-rockergroups {
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 1 1 520px;
  min-width: 300px;
}

.dp-rockerrow {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}

.dp-rockerrow-two {
  padding-left: 40px;
}

.dp-rocker {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  min-width: 118px;
  padding: 12px 18px 14px;
  background-color: #F1EEE7;
  color: #26241E;
  border: 3px solid #171A1F;
  border-radius: 7px;
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-decoration: none;
  position: relative;
  box-shadow: 0 5px 0 #3B444E, 0 7px 0 #171A1F;
  transition: transform 140ms ease, box-shadow 140ms ease;
}

.dp-rocker:hover,
.dp-rocker:focus {
  text-decoration: none;
  transform: translateY(2px);
  box-shadow: 0 3px 0 #3B444E, 0 5px 0 #171A1F;
  color: #26241E;
}

.dp-rockerwindow {
  display: block;
  width: 34px;
  height: 9px;
  margin-bottom: 9px;
  background-color: #171A1F;
  border-radius: 2px;
  position: relative;
  overflow: hidden;
}

.dp-rockerwindow::after {
  content: "";
  position: absolute;
  inset: 1px 1px 1px 15px;
  background-color: #DBA03A;
  border-radius: 1px;
}

.dp-rocker-lift {
  margin-top: 14px;
}

.dp-rocker-drop {
  margin-top: -6px;
}

.dp-rocker-accent {
  background-color: #DBA03A;
  color: #26241E;
  box-shadow: 0 5px 0 #8A5F13, 0 7px 0 #171A1F;
}

.dp-rocker-accent:hover,
.dp-rocker-accent:focus {
  color: #26241E;
  box-shadow: 0 3px 0 #8A5F13, 0 5px 0 #171A1F;
}

.dp-rocker-accent .dp-rockerwindow::after {
  background-color: #171A1F;
}

.dp-navtoggle {
  display: none;
  background-color: #DBA03A;
  color: #26241E;
  border: 3px solid #171A1F;
  border-radius: 6px;
  font-size: 0.86rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 10px 18px;
  cursor: pointer;
  align-self: flex-start;
}

/* ------------------------------------------------------------
   HERO — BUS BAR BAY
   ------------------------------------------------------------ */

.dp-busbarbay {
  background-color: #262B31;
  border-bottom: 4px solid #171A1F;
  position: relative;
  overflow: hidden;
}

.dp-busbarbay::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 12px;
  background-color: #2E353D;
  border-bottom: 2px solid #3B444E;
}

.dp-busbarinner {
  max-width: 1240px;
  margin: 0 auto;
  padding: 64px 24px 72px;
  display: grid;
  grid-template-columns: 55fr 45fr;
  gap: 52px;
  align-items: center;
}

.dp-bayeyebrow {
  display: inline-block;
  background-color: #2E353D;
  border-left: 5px solid #DBA03A;
  color: #E9ECEF;
  font-size: 0.76rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 7px 14px;
  margin-bottom: 20px;
}

.dp-bayheadline {
  font-size: 3.1rem;
  line-height: 1.12;
  margin: 0 0 20px;
  color: #E9ECEF;
  font-weight: 800;
  letter-spacing: -0.015em;
}

.dp-bayamber {
  color: #DBA03A;
}

.dp-baypara {
  font-size: 1.06rem;
  color: #E9ECEF;
  max-width: 58ch;
  margin-bottom: 30px;
}

.dp-baycopy {
  position: relative;
  z-index: 2;
}

.dp-mentionlead {
  color: #E9ECEF;
  font-size: 0.96rem;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 2px solid #3B444E;
}

.dp-bayctas {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.dp-togglebtn {
  display: inline-block;
  background-color: #DBA03A;
  color: #26241E;
  border: 3px solid #171A1F;
  border-radius: 6px;
  padding: 14px 26px 16px;
  font-weight: 800;
  font-size: 0.92rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-decoration: none;
  box-shadow: 0 6px 0 #8A5F13, 0 8px 0 #171A1F;
  transition: transform 140ms ease, box-shadow 140ms ease;
}

.dp-togglebtn:hover,
.dp-togglebtn:focus {
  text-decoration: none;
  color: #26241E;
  transform: translateY(3px);
  box-shadow: 0 3px 0 #8A5F13, 0 5px 0 #171A1F;
}

.dp-togglebtn-ghost {
  background-color: #F1EEE7;
  box-shadow: 0 6px 0 #3B444E, 0 8px 0 #171A1F;
}

.dp-togglebtn-ghost:hover,
.dp-togglebtn-ghost:focus {
  box-shadow: 0 3px 0 #3B444E, 0 5px 0 #171A1F;
}

/* Mounted load center enclosure */

.dp-loadcenter {
  background-color: #2E353D;
  border: 4px solid #171A1F;
  border-radius: 5px;
  padding: 22px 22px 26px;
  position: relative;
  box-shadow: 10px 10px 0 #171A1F;
}

.dp-conduit {
  position: absolute;
  top: -46px;
  left: 50%;
  transform: translateX(-50%);
  width: 44px;
  height: 46px;
  background-color: #3B444E;
  border: 3px solid #171A1F;
  border-bottom: none;
  border-radius: 4px 4px 0 0;
}

.dp-conduit::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 22px;
  height: 20px;
  background-color: #171A1F;
  border-radius: 2px 2px 0 0;
}

.dp-lcdoorlabel {
  background-color: #F1EEE7;
  color: #26241E;
  border: 2px solid #171A1F;
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-align: center;
  padding: 6px 8px;
  margin-bottom: 16px;
}

.dp-busbars {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-bottom: 18px;
}

.dp-busbar {
  background-color: #8A5F13;
  border: 2px solid #171A1F;
  border-radius: 3px;
  padding: 12px 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.dp-tapscrew {
  width: 18px;
  height: 18px;
  background-color: #DBA03A;
  border: 2px solid #171A1F;
  border-radius: 50%;
  position: relative;
}

.dp-tapscrew::after {
  content: "";
  position: absolute;
  top: 6px;
  left: 2px;
  width: 10px;
  height: 2px;
  background-color: #171A1F;
}

.dp-branchrow {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 18px;
}

.dp-branch {
  display: flex;
  align-items: center;
  gap: 12px;
  background-color: #171A1F;
  border: 2px solid #3B444E;
  border-radius: 4px;
  padding: 7px 10px;
}

.dp-branch:nth-child(2) {
  margin-left: 24px;
}

.dp-branch:nth-child(4) {
  margin-left: 12px;
}

.dp-branch:nth-child(6) {
  margin-left: 30px;
}

.dp-branchswitch {
  width: 30px;
  height: 16px;
  background-color: #F1EEE7;
  border: 2px solid #171A1F;
  border-radius: 3px;
  position: relative;
  flex: 0 0 auto;
}

.dp-branchswitch::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 10px;
  height: 8px;
  background-color: #DBA03A;
  border-radius: 2px;
}

.dp-branchlabel {
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #E9ECEF;
}

.dp-clampmeter {
  position: absolute;
  bottom: -18px;
  right: 26px;
  width: 96px;
  height: 40px;
  background-color: #DBA03A;
  border: 3px solid #171A1F;
  border-radius: 20px 20px 6px 6px;
  transform: rotate(-8deg);
}

.dp-clampmeter::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 14px;
  width: 30px;
  height: 16px;
  background-color: #171A1F;
  border-radius: 2px;
}

/* ------------------------------------------------------------
   SHARED SECTION SHELL
   ------------------------------------------------------------ */

.dp-bay-section {
  padding: 78px 24px 84px;
}

.dp-bay-section-graphite {
  background-color: #2E353D;
  border-top: 3px solid #3B444E;
  border-bottom: 3px solid #3B444E;
}

.dp-bay-section-deep {
  background-color: #171A1F;
  border-top: 3px solid #3B444E;
}

.dp-bay-section-steel {
  background-color: #262B31;
}

.dp-contain {
  max-width: 1180px;
  margin: 0 auto;
}

.dp-kicker {
  display: inline-block;
  color: #DBA03A;
  font-size: 0.78rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 12px;
}

.dp-secheading {
  font-size: 2.1rem;
  line-height: 1.2;
  margin: 0 0 18px;
  color: #E9ECEF;
  font-weight: 800;
}

.dp-secheading-ink {
  color: #E9ECEF;
  font-size: 1.35rem;
  margin-top: 8px;
}

.dp-seclead {
  font-size: 1.04rem;
  color: #E9ECEF;
  max-width: 74ch;
  margin-bottom: 42px;
}

/* ------------------------------------------------------------
   SECTION — CIRCUIT DIRECTORY WALL
   ------------------------------------------------------------ */

.dp-circuitledger {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 34px;
  align-items: start;
}

.dp-ledgercol {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.dp-ledgercol-lower {
  padding-top: 58px;
}

.dp-circuitcard {
  background-color: #F1EEE7;
  color: #26241E;
  border: 3px solid #171A1F;
  border-radius: 5px;
  padding: 22px 24px 24px 74px;
  position: relative;
  box-shadow: 7px 7px 0 #171A1F;
}

.dp-circuitcard-tall {
  padding-bottom: 42px;
}

.dp-circuitcard-short {
  padding-bottom: 18px;
}

.dp-breakertoggle {
  position: absolute;
  top: 24px;
  left: 18px;
  width: 34px;
  height: 62px;
  background-color: #2E353D;
  border: 3px solid #171A1F;
  border-radius: 6px;
}

.dp-breakertoggle::after {
  content: "";
  position: absolute;
  top: 6px;
  left: 5px;
  width: 18px;
  height: 26px;
  background-color: #DBA03A;
  border: 2px solid #171A1F;
  border-radius: 3px;
}

.dp-amptag {
  display: inline-block;
  background-color: #171A1F;
  color: #DBA03A;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  padding: 4px 10px;
  border-radius: 3px;
  margin-bottom: 10px;
}

.dp-cardheading {
  font-size: 1.28rem;
  margin: 0 0 10px;
  color: #26241E;
  font-weight: 800;
}

.dp-cardpara {
  font-size: 0.95rem;
  color: #26241E;
  margin-bottom: 0.9em;
}

.dp-cardpara:last-child {
  margin-bottom: 0;
}

.dp-tripchip {
  display: inline-block;
  background-color: #BE4A38;
  color: #F1EEE7;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 5px 12px;
  border-radius: 3px;
  margin-top: 12px;
}

.dp-cardlink {
  display: inline-block;
  margin-top: 12px;
  color: #8A5F13;
  font-weight: 700;
  font-size: 0.86rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.dp-cardlink:hover,
.dp-cardlink:focus {
  color: #26241E;
}

/* ------------------------------------------------------------
   INLINE SERVICE MENTIONS
   ------------------------------------------------------------ */

.dp-mentionlist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px 34px;
}

.dp-mentionitem {
  border-left: 4px solid #DBA03A;
  padding: 4px 0 4px 16px;
  color: #E9ECEF;
  font-size: 0.98rem;
}

.dp-mentionitem a {
  font-weight: 700;
}

/* ------------------------------------------------------------
   PANEL DEEP FEATURE STRIP
   ------------------------------------------------------------ */

.dp-deepgrid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 46px;
  align-items: start;
}

.dp-deepcopy p {
  color: #E9ECEF;
  font-size: 1rem;
}

.dp-deeplist {
  list-style: none;
  margin: 0;
  padding: 0;
}

.dp-deeplist li {
  background-color: #262B31;
  border: 2px solid #3B444E;
  border-left: 5px solid #DBA03A;
  border-radius: 4px;
  padding: 14px 18px;
  margin-bottom: 12px;
  color: #E9ECEF;
  font-size: 0.95rem;
}

/* ------------------------------------------------------------
   ACCENT STRIP — LOAD TEST
   ------------------------------------------------------------ */

.dp-loadtest {
  background-color: #DBA03A;
  color: #26241E;
  border-top: 4px solid #171A1F;
  border-bottom: 4px solid #171A1F;
  padding: 30px 24px;
}

.dp-loadtestinner {
  max-width: 1180px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 22px;
  flex-wrap: wrap;
}

.dp-loadtestpen {
  flex: 0 0 auto;
  width: 22px;
  height: 66px;
  background-color: #171A1F;
  border-radius: 4px;
  position: relative;
}

.dp-loadtestpen::after {
  content: "";
  position: absolute;
  bottom: -12px;
  left: 7px;
  width: 8px;
  height: 14px;
  background-color: #BE4A38;
  border-radius: 0 0 3px 3px;
}

.dp-loadtesttext {
  font-size: 1.12rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  margin: 0;
  color: #26241E;
}

.dp-loadtesttext strong {
  letter-spacing: 0.06em;
}

/* ------------------------------------------------------------
   PROCESS / STEPS
   ------------------------------------------------------------ */

.dp-steplist {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
}

.dp-step {
  background-color: #2E353D;
  border: 3px solid #171A1F;
  border-radius: 5px;
  padding: 24px;
  box-shadow: 6px 6px 0 #171A1F;
}

.dp-stepnum {
  display: inline-block;
  background-color: #DBA03A;
  color: #26241E;
  font-weight: 800;
  font-size: 0.82rem;
  letter-spacing: 0.14em;
  padding: 4px 12px;
  border-radius: 3px;
  margin-bottom: 14px;
}

.dp-steptitle {
  font-size: 1.12rem;
  margin: 0 0 10px;
  color: #E9ECEF;
  font-weight: 800;
}

.dp-steppara {
  font-size: 0.94rem;
  color: #E9ECEF;
  margin: 0;
}

/* ------------------------------------------------------------
   WIREWAY TROUGH FOOTER
   ------------------------------------------------------------ */

.dp-wirewaybase {
  background-color: #171A1F;
  color: #E9ECEF;
  border-top: 4px solid #3B444E;
  position: relative;
  padding: 0 24px 0;
}

.dp-wirewaytrough {
  max-width: 1180px;
  margin: 0 auto;
  padding: 26px 0 12px;
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 1fr;
  gap: 26px;
  position: relative;
}

.dp-wirewaytrough::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 16px;
  background-color: #3B444E;
  border-bottom: 3px solid #171A1F;
  border-radius: 0 0 3px 3px;
}

.dp-slot {
  position: absolute;
  top: 4px;
  width: 10px;
  height: 8px;
  background-color: #171A1F;
  border-radius: 2px;
}

.dp-slot-a { left: 12%; }
.dp-slot-b { left: 38%; }
.dp-slot-c { left: 64%; }
.dp-slot-d { left: 88%; }

.dp-cabletie {
  position: absolute;
  top: 8px;
  left: 30%;
  width: 46px;
  height: 22px;
  border: 3px solid #DBA03A;
  border-radius: 12px;
  border-bottom-color: #3B444E;
  border-right-color: #3B444E;
}

.dp-cabletie-two {
  left: 56%;
}

.dp-cabletie-three {
  left: 82%;
}

.dp-tiegroup {
  position: relative;
  padding-top: 14px;
}

.dp-tieheading {
  font-size: 0.82rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #DBA03A;
  font-weight: 800;
  margin: 0 0 12px;
}

.dp-tielinks {
  list-style: none;
  margin: 0;
  padding: 0;
}

.dp-tielinks li {
  margin-bottom: 8px;
}

.dp-tielinks a {
  color: #E9ECEF;
  font-size: 0.94rem;
}

.dp-tielinks a:hover,
.dp-tielinks a:focus {
  color: #DBA03A;
}

.dp-footcard {
  background-color: #F1EEE7;
  color: #26241E;
  border: 3px solid #3B444E;
  border-radius: 4px;
  padding: 16px 18px;
  margin-top: 14px;
}

.dp-footbrand {
  display: block;
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #26241E;
  margin-bottom: 8px;
}

.dp-footblurb {
  font-size: 0.88rem;
  color: #26241E;
  margin: 0;
}

.dp-wirewaysill {
  max-width: 1180px;
  margin: 0 auto;
  border-top: 3px solid #3B444E;
  padding: 20px 0 26px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  font-size: 0.88rem;
  color: #E9ECEF;
}

.dp-sillitem {
  margin: 0;
}

.dp-sillitem a {
  color: #DBA03A;
}

.dp-breakerglyph {
  display: inline-block;
  width: 16px;
  height: 24px;
  vertical-align: middle;
  background-color: #2E353D;
  border: 2px solid #3B444E;
  border-radius: 3px;
  position: relative;
  margin-right: 6px;
}

.dp-breakerglyph::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 6px;
  height: 8px;
  background-color: #DBA03A;
  border-radius: 1px;
}

/* ------------------------------------------------------------
   GENERIC CONTENT PAGES (services / contact)
   ------------------------------------------------------------ */

.dp-serviceblock {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 26px;
  background-color: #2E353D;
  border: 3px solid #171A1F;
  border-radius: 5px;
  padding: 28px 30px;
  margin-bottom: 26px;
  box-shadow: 6px 6px 0 #171A1F;
}

.dp-servicebadge {
  background-color: #DBA03A;
  color: #26241E;
  border: 3px solid #171A1F;
  border-radius: 4px;
  height: 74px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.dp-servicetitle {
  font-size: 1.35rem;
  margin: 0 0 12px;
  color: #E9ECEF;
  font-weight: 800;
}

.dp-servicepara {
  color: #E9ECEF;
  font-size: 0.98rem;
  margin-bottom: 0.85em;
}

.dp-servicepara:last-child {
  margin-bottom: 0;
}

.dp-ctaband {
  background-color: #DBA03A;
  color: #26241E;
  border: 4px solid #171A1F;
  border-radius: 6px;
  padding: 38px 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  flex-wrap: wrap;
}

.dp-ctatext {
  margin: 0;
  max-width: 62ch;
}

.dp-ctatitle {
  font-size: 1.7rem;
  margin: 0 0 10px;
  color: #26241E;
  font-weight: 800;
}

.dp-ctapara {
  margin: 0;
  color: #26241E;
  font-size: 1rem;
}

.dp-ctabtn {
  display: inline-block;
  background-color: #171A1F;
  color: #E9ECEF;
  border: 3px solid #26241E;
  border-radius: 6px;
  padding: 14px 26px;
  font-weight: 800;
  font-size: 0.9rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
}

.dp-ctabtn:hover,
.dp-ctabtn:focus {
  text-decoration: none;
  color: #DBA03A;
}

/* Contact page */

.dp-contactgrid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 40px;
  align-items: start;
}

.dp-contactcard {
  background-color: #2E353D;
  border: 3px solid #171A1F;
  border-radius: 5px;
  padding: 30px;
  box-shadow: 6px 6px 0 #171A1F;
}

.dp-fieldlabel {
  display: block;
  font-size: 0.8rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #DBA03A;
  font-weight: 800;
  margin-bottom: 7px;
}

.dp-fieldinput,
.dp-fieldtextarea {
  width: 100%;
  background-color: #F1EEE7;
  color: #26241E;
  border: 3px solid #171A1F;
  border-radius: 4px;
  padding: 12px 14px;
  font-size: 1rem;
  font-family: inherit;
  margin-bottom: 18px;
}

.dp-fieldtextarea {
  min-height: 140px;
  resize: vertical;
}

.dp-fieldinput:focus,
.dp-fieldtextarea:focus {
  outline: 3px solid #DBA03A;
  outline-offset: 1px;
}

.dp-submitbtn {
  background-color: #DBA03A;
  color: #26241E;
  border: 3px solid #171A1F;
  border-radius: 6px;
  padding: 14px 28px;
  font-weight: 800;
  font-size: 0.92rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: 0 6px 0 #8A5F13, 0 8px 0 #171A1F;
  transition: transform 140ms ease, box-shadow 140ms ease;
}

.dp-submitbtn:hover,
.dp-submitbtn:focus {
  transform: translateY(3px);
  box-shadow: 0 3px 0 #8A5F13, 0 5px 0 #171A1F;
}

.dp-infoplate {
  background-color: #F1EEE7;
  color: #26241E;
  border: 3px solid #171A1F;
  border-radius: 5px;
  padding: 22px 24px;
  margin-bottom: 22px;
  box-shadow: 6px 6px 0 #171A1F;
}

.dp-infokicker {
  display: block;
  font-size: 0.74rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #BE4A38;
  font-weight: 800;
  margin-bottom: 8px;
}

.dp-infovalue {
  display: block;
  color: #26241E;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.55;
}

.dp-infovalue a {
  color: #8A5F13;
  font-weight: 700;
}

.dp-faqitem {
  background-color: #2E353D;
  border: 2px solid #3B444E;
  border-left: 5px solid #DBA03A;
  border-radius: 4px;
  margin-bottom: 16px;
  overflow: hidden;
}

.dp-faqq {
  width: 100%;
  text-align: left;
  background-color: #2E353D;
  color: #E9ECEF;
  border: none;
  padding: 18px 22px;
  font-size: 1.02rem;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
}

.dp-faqq:hover,
.dp-faqq:focus {
  color: #DBA03A;
}

.dp-faqa {
  padding: 0 22px 18px;
  color: #E9ECEF;
  font-size: 0.95rem;
}

.dp-pageintro {
  background-color: #2E353D;
  border-bottom: 4px solid #171A1F;
  padding: 58px 24px 52px;
}

.dp-introinner {
  max-width: 1180px;
  margin: 0 auto;
}

.dp-introhead {
  font-size: 2.6rem;
  margin: 0 0 16px;
  color: #E9ECEF;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.dp-intropara {
  max-width: 78ch;
  color: #E9ECEF;
  font-size: 1.05rem;
  margin: 0;
}

/* ------------------------------------------------------------
   SCROLL REVEAL
   ------------------------------------------------------------ */

.dp-reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 620ms ease, transform 620ms ease;
}

.dp-reveal.dp-shown {
  opacity: 1;
  transform: translateY(0);
}

/* Without JavaScript every reveal element stays fully visible. */
.dp-nojs .dp-reveal {
  opacity: 1;
  transform: none;
}

.dp-noscript-note {
  background-color: #DBA03A;
  color: #26241E;
  padding: 10px 16px;
  font-weight: 700;
  text-align: center;
}

/* ------------------------------------------------------------
   RESPONSIVE
   ------------------------------------------------------------ */

@media (max-width: 980px) {
  .dp-busbarinner {
    grid-template-columns: 1fr;
  }

  .dp-bayheadline {
    font-size: 2.4rem;
  }

  .dp-circuitledger {
    grid-template-columns: 1fr;
  }

  .dp-ledgercol-lower {
    padding-top: 0;
  }

  .dp-deepgrid,
  .dp-contactgrid {
    grid-template-columns: 1fr;
  }

  .dp-steplist {
    grid-template-columns: 1fr;
  }

  .dp-wirewaytrough {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 720px) {
  .dp-navtoggle {
    display: inline-block;
  }

  .dp-rockergroups {
    display: none;
    width: 100%;
  }

  .dp-rockergroups.dp-open {
    display: flex;
  }

  .dp-rockerrow-two {
    padding-left: 0;
  }

  .dp-rocker-lift,
  .dp-rocker-drop,
  .dp-rocker-accent {
    margin-top: 0;
  }

  .dp-rocker {
    flex: 1 1 44%;
  }

  .dp-bayheadline {
    font-size: 2rem;
  }

  .dp-secheading {
    font-size: 1.6rem;
  }

  .dp-serviceblock {
    grid-template-columns: 1fr;
  }

  .dp-wirewaytrough {
    grid-template-columns: 1fr;
  }

  .dp-mentionlist {
    grid-template-columns: 1fr;
  }

  .dp-ctaband {
    padding: 28px 24px;
  }
}
