/* ============================================================
Contact Us — premium build (brand #ff7a45 / black / white / cream)
============================================================ */
.drc,
.drc h1,
.drc h2,
.drc h3,
.drc h4,
.drc h5,
.drc p,
.drc span,
.drc a,
.drc div,
.drc li,
.drc label,
.drc input,
.drc select,
.drc textarea,
.drc button {
   font-family: "Poppins", sans-serif
}

.drc {
   --o: #ff7a45;
   --o2: #ff9e6b;
   --od: #e5622f;
   --ink: #141414;
   --cream: #FFF4EF;
   --dark: #0e0f12;
   --dark2: #17181d;
   position: relative;
   z-index: 2
}

#mainfooter {
   position: relative;
   z-index: 1
}

.drc * {
   box-sizing: border-box
}

#mainheader {
   min-height: 0 !important;
   padding: 0 !important
}

.drc .container {
   max-width: 1180px;
   width: 100%;
   margin-left: auto;
   margin-right: auto;
   padding-left: 20px;
   padding-right: 20px
}

.drc .cmn_padd {
   padding: 88px 20px
}

/* reveal */
.drc .reveal {
   opacity: 0;
   transform: translateY(26px);
   transition: opacity .7s cubic-bezier(.16, 1, .3, 1), transform .7s cubic-bezier(.16, 1, .3, 1);
   transition-delay: var(--d, 0s)
}

.drc .reveal.in {
   opacity: 1;
   transform: none
}

@media(prefers-reduced-motion:reduce) {
   .drc .reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important
   }
}

/* ============================================================
HERO (dark, compact)
============================================================ */
.drc-hero {
   padding: 160px 20px 48px;
   text-align: center;
}

.drc-hero:before {
   top: -200px;
   left: 50%;
   transform: translateX(-50%);
   width: 760px;
   height: 560px;
   background: radial-gradient(circle, rgba(255, 122, 69, .26), transparent 62%);
}

.drc-hero:after {
   mask-image: radial-gradient(circle at 50% 30%, #000, transparent 72%);
   -webkit-mask-image: radial-gradient(circle at 50% 30%, #000, transparent 72%);
}

.drc-eyebrow {
   display: inline-flex;
   align-items: center;
   gap: 9px;
   font-size: 12px;
   font-weight: 700;
   letter-spacing: 1.6px;
   text-transform: uppercase;
   color: var(--o2);
   background: rgba(255, 122, 69, .1);
   border: 1px solid rgba(255, 122, 69, .32);
   padding: 8px 16px;
   border-radius: 30px;
   margin-bottom: 20px
}

.drc-eyebrow svg {
   width: 15px;
   height: 15px;
   stroke: var(--o2)
}

.drc-h1 {
   font-size: 48px;
   line-height: 1.07;
   margin: 0 0 16px;
}

.drc .drc-sub {
   font-size: 17.5px;
   line-height: 1.7;
   color: #b9bcc6;
   max-width: 620px;
   margin: 0 auto;
   text-align: center;
}

.drc-hero .anim {
   transform: translateY(24px);
   animation: drcUp .8s cubic-bezier(.16, 1, .3, 1) forwards;
}

.drc-hero .anim.d1 {
   animation-delay: .05s;
}

.drc-hero .anim.d2 {
   animation-delay: .15s;
}

.drc-hero .anim.d3 {
   animation-delay: .25s;
}

@keyframes drcUp {
   to {
      opacity: 1;
      transform: none
   }
}

@media(prefers-reduced-motion:reduce) {}

/* ============================================================
MAIN (two columns)
============================================================ */
.drc-main {
   background: #fff;
   padding-top: 56px !important
}

.drc-wrap {
   display: grid;
   grid-template-columns: 1.5fr 1fr;
   gap: 40px;
   align-items: start
}

.drc-embed {
   width: 100%
}

.drc-embed iframe {
   width: 100%;
   min-height: 520px;
   border: none;
   display: block;
   border-radius: 8px
}

/* both columns share one card shell — matched pair */
.drc-formcard,
.drc-info {
   background: #fff;
   border: 1px solid #ece3dc;
   border-radius: 20px;
   overflow: hidden;
   box-shadow: 0 24px 56px rgba(0, 0, 0, .10)
}

.drc-formcard {
   display: flex;
   flex-direction: column
}

.drc-fhead {
   position: relative;
   background: var(--dark2);
   padding: 26px 32px 24px
}

.drc-fhead:before {
   content: "";
   position: absolute;
   left: 0;
   top: 0;
   height: 5px;
   width: 100%;
   background: linear-gradient(90deg, var(--o), #ff9e6b)
}

.drc-fhead h3 {
   margin: 0;
   color: #fff;
   font-size: 21px;
   font-weight: 700;
   line-height: 1.25
}

.drc-fhead p {
   margin: 8px 0 0;
   color: #c7c1be;
   font-size: 13px;
   line-height: 1.5
}

.drc-fbody {
   padding: 32px
}

.drc-row {
   margin-bottom: 16px
}

.drc-row.two {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 16px;
   margin-bottom: 16px
}

.drc-row.two .drc-row {
   margin-bottom: 0
}

.drc-row label {
   display: block;
   font-size: 11px;
   font-weight: 600;
   color: #111;
   margin-bottom: 7px;
   text-transform: uppercase;
   letter-spacing: .5px
}

.drc-row label .req {
   color: var(--o)
}

.drc-row input,
.drc-row select,
.drc-row textarea {
   width: 100%;
   box-sizing: border-box;
   border: 1px solid #e3ddd8;
   border-radius: 10px;
   padding: 14px 15px;
   font-size: 15px;
   color: #1E1E1E;
   background: #faf8f7;
   font-family: inherit;
   transition: border-color .2s, box-shadow .2s, background .2s
}

.drc-row textarea {
   min-height: 130px;
   resize: vertical
}

.drc-row select {
   appearance: none;
   -webkit-appearance: none;
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
   background-repeat: no-repeat;
   background-position: right 14px center;
   background-size: 16px;
   padding-right: 40px;
   cursor: pointer
}

.drc-row input::placeholder,
.drc-row textarea::placeholder {
   color: #b3b0ad
}

.drc-row input:focus,
.drc-row select:focus,
.drc-row textarea:focus {
   outline: none;
   border-color: var(--o);
   background: #fff;
   box-shadow: 0 0 0 3px rgba(255, 122, 69, .16)
}

.drc-btn {
   width: 100%;
   cursor: pointer;
   margin-top: 8px;
   font-size: 16px;
   font-weight: 600;
   border: 0;
   background: var(--o);
   color: #fff;
   padding: 16px 18px;
   border-radius: 10px;
   font-family: inherit;
   transition: background-color .2s ease, transform .15s ease, box-shadow .2s ease
}

.drc-btn:hover {
   background: var(--od);
   transform: translateY(-2px);
   box-shadow: 0 12px 26px rgba(255, 122, 69, .36)
}

.drc-btn:disabled {
   opacity: .7;
   cursor: default;
   transform: none;
   box-shadow: none
}

.drc-msg {
   margin: 16px 0 0;
   font-size: 14.5px;
   line-height: 1.6;
   font-weight: 600
}

.drc .drc-talk {
   text-align: center;
   margin: 16px 0 0;
   font-size: 14px;
   color: #666
}

.drc-talk a {
   color: var(--o);
   font-weight: 600;
   text-decoration: none
}

.drc-talk a:hover {
   text-decoration: underline
}

.drc-hp {
   position: absolute;
   left: -9999px;
   width: 1px;
   height: 1px;
   opacity: 0
}

/* info card — same shell as form; flex column so the map fills to equal height */
.drc-info {
   --pad: 32px;
   padding: var(--pad);
   display: flex;
   flex-direction: column
}

.drc-info h3 {
   margin: 0 0 4px;
   font-size: 20px;
   font-weight: 700;
   color: #111
}

.drc-info .co {
   font-size: 14px;
   color: #777;
   margin: 0 0 22px
}

.drc-line {
   display: flex;
   align-items: flex-start;
   gap: 14px;
   padding: 14px 0;
   border-top: 1px solid #f2e6de
}

.drc-line:first-of-type {
   border-top: 0;
   padding-top: 0
}

.drc-line .ic {
   flex: 0 0 auto;
   width: 42px;
   height: 42px;
   border-radius: 12px;
   background: linear-gradient(135deg, #fff2ea, #ffe0d1);
   border: 1px solid #ffe0d1;
   display: flex;
   align-items: center;
   justify-content: center
}

.drc-line .ic svg {
   width: 20px;
   height: 20px;
   stroke: var(--o)
}

.drc-line .tx {
   padding-top: 2px
}

.drc-line .lb {
   display: block;
   font-size: 11px;
   font-weight: 700;
   letter-spacing: .5px;
   text-transform: uppercase;
   color: #9a9a9a;
   margin-bottom: 3px
}

.drc-line .vl,
.drc-line .vl a {
   font-size: 15px;
   color: #222;
   font-weight: 500;
   line-height: 1.5;
   text-decoration: none
}

.drc-line a.vl:hover,
.drc-line .vl a:hover {
   color: var(--o)
}

.drc-social {
   display: flex;
   gap: 12px;
   margin: 22px 0 20px
}

.drc-social a {
   width: 40px;
   height: 40px;
   border-radius: 50%;
   background: var(--o);
   border: 1px solid var(--o);
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: transform .25s ease, background .25s ease, box-shadow .25s ease
}

.drc-social a:hover {
   background: var(--od);
   transform: translateY(-3px);
   box-shadow: 0 10px 22px rgba(255, 122, 69, .35)
}

.drc-social a svg {
   width: 18px;
   height: 18px;
   display: block
}

.drc-serving {
   display: flex;
   align-items: center;
   gap: 9px;
   font-size: 13.5px;
   color: #555;
   font-weight: 500;
   background: #fff4ef;
   border: 1px solid #ffd8c6;
   border-radius: 12px;
   padding: 12px 15px
}

.drc-serving svg {
   width: 16px;
   height: 16px;
   stroke: var(--o);
   flex: 0 0 auto
}

.drc-mapembed {
   flex: 1 1 auto;
   min-height: 420px;
   margin: 24px calc(-1 * var(--pad)) calc(-1 * var(--pad));
   border-top: 1px solid #ece3dc;
   line-height: 0
}

.drc-mapembed iframe {
   width: 100%;
   height: 100%;
   min-height: 420px;
   border: 0;
   display: block;
   filter: grayscale(.12)
}

/* secondary CTA (cream) */
.drc-cta {
   background: var(--cream);
   text-align: center
}

.drc-cta h2 {
   font-size: 30px;
   font-weight: 700;
   color: var(--ink);
   margin: 0 auto 22px;
   max-width: 640px;
   line-height: 1.25
}

.drc-cta h2 span {
   color: var(--o)
}

.drc-ctabtn {
   display: inline-flex;
   align-items: center;
   gap: 9px;
   background: var(--o);
   color: #fff;
   font-weight: 600;
   font-size: 15px;
   padding: 15px 30px;
   border-radius: 10px;
   text-decoration: none;
   border: 2px solid var(--o);
   box-shadow: 0 10px 26px rgba(255, 122, 69, .28);
   transition: transform .25s ease, box-shadow .25s ease, background .25s ease
}

.drc-ctabtn:hover {
   background: var(--od);
   border-color: var(--od);
   color: #fff;
   transform: translateY(-3px);
   box-shadow: 0 16px 34px rgba(255, 122, 69, .4)
}

.drc-ctabtn svg {
   width: 17px;
   height: 17px;
   stroke: #fff
}

/* ============================================================
RESPONSIVE
============================================================ */
@media(max-width:900px) {
   .drc-hero {
      padding-top: 140px;
      padding-bottom: 44px;
   }

   .drc-wrap {
      grid-template-columns: 1fr;
      gap: 32px
   }

   .drc-h1 {
      font-size: 38px;
   }
}

@media(max-width:520px) {
   .drc-h1 {
      font-size: 31px;
   }

   .drc-cta h2 {
      font-size: 24px
   }

   .drc-row.two {
      grid-template-columns: 1fr
   }

   .drc-fbody {
      padding: 26px 22px
   }

   .drc-info {
      --pad: 22px
   }
}