/*
Theme Name: Divi Child
Theme URI: http://www.elegantthemes.com/gallery/divi/
Template: Divi
Author: Elegant Themes
Author URI: http://www.elegantthemes.com
Description: Smart. Flexible. Beautiful. Divi is the most powerful theme in our collection.
Version: 5.7.4.1782145296
Updated: 2026-06-22 16:21:36

*/

/* =====================================================================
 * Eagle Moving — Vintage Detail CSS
 * For: child theme style.css
 * Author: Bridge Road Marketing (via Claude)
 *
 * HOW THIS WORKS:
 * Divi handles typography, colors, button presets, and basic layout via
 * its theme options. This file adds the vintage character details that
 * Divi can't do natively. Adam will apply these as CSS Classes on Divi
 * modules (every Divi module has an "Advanced > CSS ID & Classes" field).
 *
 * INSTALLATION:
 * 1. Open child theme's style.css (or Divi → Theme Options → Custom CSS
 *    if child theme isn't ready yet — but child theme is preferred)
 * 2. Paste this whole file at the bottom, below any other rules
 * 3. Save. Refresh the front-end.
 *
 * APPLYING CLASSES:
 * In any Divi module: Advanced tab → CSS ID & Classes → CSS Class field
 * Enter the class name (without the leading dot). Multiple classes
 * separated by spaces. Examples below in each section.
 * ===================================================================== */


/* ─────────────────────────────────────────────────────────────────────
 * BRAND TOKENS (CSS variables)
 * These mirror the Divi global colors so custom CSS can reference them.
 * ───────────────────────────────────────────────────────────────────── */
:root {
  --eg-ink: #1a1612;
  --eg-ink-soft: #2d2620;
  --eg-paper: #f4ede0;
  --eg-paper-warm: #ebe1cd;
  --eg-paper-deep: #ddd0b3;
  --eg-cream: #faf6ea;
  --eg-red: #c83a30;
  --eg-red-deep: #9c2820;
  --eg-red-shadow: #7a1f18;
  --eg-eagle-green: #3a5a4a;
  --eg-eagle-green-deep: #283f33;
  --eg-gold: #c19a3a;
  --eg-gold-deep: #8a6c20;
  --eg-rule: #2a221a;
}


/* ─────────────────────────────────────────────────────────────────────
 * PAPER GRAIN BACKGROUND TEXTURE
 * Applied to body globally. Subtle, almost invisible — adds warmth.
 * No class needed; this targets body directly.
 * ───────────────────────────────────────────────────────────────────── */
body {
  background-color: var(--eg-paper);
  background-image:
    radial-gradient(ellipse at top left, rgba(193, 154, 58, 0.05), transparent 60%),
    radial-gradient(ellipse at bottom right, rgba(156, 40, 32, 0.04), transparent 60%),
    repeating-linear-gradient(0deg, transparent 0, transparent 2px, rgba(26, 22, 18, 0.012) 2px, rgba(26, 22, 18, 0.012) 3px),
    repeating-linear-gradient(90deg, transparent 0, transparent 2px, rgba(26, 22, 18, 0.008) 2px, rgba(26, 22, 18, 0.008) 3px);
  background-attachment: fixed;
}


/* ─────────────────────────────────────────────────────────────────────
 * EYEBROW LABEL
 * Small uppercase label with red dash before it. Used above all section
 * headlines. Apply to a Divi Text module containing the eyebrow text.
 *
 * Usage: CSS Class = "eg-eyebrow"
 * ───────────────────────────────────────────────────────────────────── */
.eg-eyebrow,
.eg-eyebrow p {
  font-family: 'Special Elite', 'Courier New', monospace !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: var(--eg-red-deep) !important;
  display: inline-block !important;
  position: relative;
  padding-left: 28px !important;
  margin-bottom: 8px !important;
}
.eg-eyebrow::before,
.eg-eyebrow p::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 20px;
  height: 2px;
  background: var(--eg-red-deep);
  transform: translateY(-50%);
}

/* Light-on-dark variant for hero sections */
.eg-eyebrow-gold,
.eg-eyebrow-gold p {
  color: var(--eg-gold) !important;
}
.eg-eyebrow-gold::before,
.eg-eyebrow-gold p::before {
  background: var(--eg-gold);
}


/* ─────────────────────────────────────────────────────────────────────
 * DOUBLE-RULE DIVIDER
 * Vintage triple-line divider. Apply to a Divi Divider module OR
 * use as a class on any container that needs a top/bottom border.
 *
 * Usage: CSS Class = "eg-rule-vintage"
 * ───────────────────────────────────────────────────────────────────── */
.eg-rule-vintage {
  border: 0 !important;
  height: 6px !important;
  background:
    linear-gradient(var(--eg-rule), var(--eg-rule)) top/100% 1px no-repeat,
    linear-gradient(var(--eg-rule), var(--eg-rule)) bottom/100% 1px no-repeat,
    linear-gradient(var(--eg-rule), var(--eg-rule)) center/100% 1px no-repeat !important;
  margin: 24px 0 !important;
}


/* ─────────────────────────────────────────────────────────────────────
 * STAR SEPARATOR
 * Spaced dots/stars between sections. Apply to a Text module containing
 * "★ ★ ★" or similar.
 *
 * Usage: CSS Class = "eg-sep-star"
 * ───────────────────────────────────────────────────────────────────── */
.eg-sep-star {
  text-align: center !important;
  font-family: 'Alfa Slab One', Georgia, serif !important;
  color: var(--eg-red) !important;
  font-size: 1.4rem !important;
  letter-spacing: 1em !important;
  margin: 32px 0 28px !important;
  padding-left: 1em !important;
}


/* ─────────────────────────────────────────────────────────────────────
 * HARD OFFSET SHADOWS (cards)
 * The hallmark "vintage poster" look — solid color block shadow behind
 * cards/images, instead of soft drop shadows. Three variants.
 *
 * Usage: CSS Class = "eg-shadow-red" (or eg-shadow-green, eg-shadow-gold)
 * Apply to any Divi container/section/image that should have the lift.
 * ───────────────────────────────────────────────────────────────────── */
.eg-shadow-red {
  box-shadow: 12px 12px 0 var(--eg-red) !important;
  border: 3px solid var(--eg-ink) !important;
}
.eg-shadow-green {
  box-shadow: 12px 12px 0 var(--eg-eagle-green) !important;
  border: 3px solid var(--eg-ink) !important;
}
.eg-shadow-gold {
  box-shadow: 12px 12px 0 var(--eg-gold) !important;
  border: 3px solid var(--eg-ink) !important;
}

/* Smaller variant for cards in grids */
.eg-shadow-sm-red {
  box-shadow: 8px 8px 0 var(--eg-red) !important;
  border: 2px solid var(--eg-ink) !important;
}
.eg-shadow-sm-green {
  box-shadow: 8px 8px 0 var(--eg-eagle-green) !important;
  border: 2px solid var(--eg-ink) !important;
}
.eg-shadow-sm-gold {
  box-shadow: 8px 8px 0 var(--eg-gold) !important;
  border: 2px solid var(--eg-ink) !important;
}

/* Hover lift effect — pair with eg-shadow-* on interactive cards */
.eg-shadow-lift {
  transition: all 0.25s ease;
}
.eg-shadow-lift:hover {
  transform: translate(-3px, -3px);
}


/* ─────────────────────────────────────────────────────────────────────
 * TAPE / STAMP DECORATION
 * Gold or red rectangular "tape" label, slightly rotated. Used for
 * "PACKING SERVICE", "JUNK REMOVAL", "APPROVED ACCOUNTS" badges.
 *
 * Usage: CSS Class = "eg-tape" (gold), or "eg-tape eg-tape-red" (red)
 * ───────────────────────────────────────────────────────────────────── */
.eg-tape {
  display: inline-block !important;
  background: var(--eg-gold) !important;
  padding: 4px 14px !important;
  font-family: 'Special Elite', 'Courier New', monospace !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.1em !important;
  color: var(--eg-ink) !important;
  transform: rotate(-1.5deg);
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  text-transform: uppercase !important;
}
.eg-tape-red {
  background: var(--eg-red) !important;
  color: var(--eg-cream) !important;
}
.eg-tape-green {
  background: var(--eg-eagle-green) !important;
  color: var(--eg-cream) !important;
}

/* "Stamp" corner badge — for LOA cards. Position parent must be relative. */
.eg-stamp-corner {
  position: absolute !important;
  top: -18px !important;
  right: 24px !important;
  background: var(--eg-paper) !important;
  border: 2px solid var(--eg-ink) !important;
  padding: 6px 14px !important;
  font-family: 'Special Elite', 'Courier New', monospace !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: var(--eg-red-deep) !important;
}


/* ─────────────────────────────────────────────────────────────────────
 * HERO EMBLEM ("Family Owned · 68 Years")
 * Round emblem with dashed inner border. Floats top-right of hero.
 * Build with an inline HTML/Divi Code module.
 *
 * HTML structure to use inside a Code module:
 * <div class="eg-emblem">
 *   <div class="eg-emblem-top">Family Owned</div>
 *   <div class="eg-emblem-big">68</div>
 *   <div class="eg-emblem-top">Years</div>
 *   <div class="eg-emblem-bot">1958 — Now</div>
 * </div>
 * ───────────────────────────────────────────────────────────────────── */
.eg-emblem {
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: var(--eg-cream);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  border: 6px solid var(--eg-red);
  box-shadow: 6px 6px 0 var(--eg-ink);
  transform: rotate(-6deg);
  position: relative;
  margin: 0 auto;
}
.eg-emblem::before {
  content: '';
  position: absolute;
  inset: 8px;
  border: 2px dashed var(--eg-red-deep);
  border-radius: 50%;
}
.eg-emblem-top {
  font-family: 'Special Elite', 'Courier New', monospace;
  font-size: 0.65rem;
  letter-spacing: 0.2em;
  color: var(--eg-ink);
  text-transform: uppercase;
}
.eg-emblem-big {
  font-family: 'Alfa Slab One', Georgia, serif;
  font-size: 3.4rem;
  line-height: 1;
  color: var(--eg-red-deep);
}
.eg-emblem-bot {
  font-family: 'Oswald', sans-serif;
  font-size: 0.95rem;
  letter-spacing: 0.1em;
  color: var(--eg-ink);
  margin-top: 6px;
  text-transform: uppercase;
  font-weight: 600;
}

@media (max-width: 880px) {
  .eg-emblem { display: none !important; }
}


/* ─────────────────────────────────────────────────────────────────────
 * BRAND TAGLINE PILL
 * The rotating gold pill that lives under the logo. Adam adds a placeholder
 * span in the header via a Code module. The JS (rex-tagline.js) cycles
 * the text every 6 seconds.
 *
 * HTML to place in Code module within header brand area:
 * <span class="eg-tagline" id="brandTagline">Order Some Carryout.</span>
 * ───────────────────────────────────────────────────────────────────── */
.eg-tagline {
  display: inline-block;
  font-family: 'Oswald', sans-serif;
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--eg-ink);
  background: var(--eg-gold);
  padding: 2px 10px 3px;
  margin-top: 6px;
  transform: rotate(-1.5deg);
  border: 1px solid rgba(0, 0, 0, 0.15);
  font-weight: 600;
  transition: opacity 0.4s ease;
  white-space: nowrap;
}
@media (max-width: 880px) {
  .eg-tagline { font-size: 0.6rem; padding: 1px 8px 2px; }
}
@media (max-width: 540px) {
  .eg-tagline { display: none; }
}


/* ─────────────────────────────────────────────────────────────────────
 * TICKER BAR (horizontal scrolling text)
 * Used on home page below hero. Apply to a Divi Code module containing
 * the ticker HTML structure.
 *
 * HTML to use:
 * <div class="eg-ticker">
 *   <div class="eg-ticker-inner">
 *     <span>Local Moves</span><span>Long Distance</span>... (repeat 2x)
 *   </div>
 * </div>
 * ───────────────────────────────────────────────────────────────────── */
.eg-ticker {
  background: var(--eg-ink);
  color: var(--eg-cream);
  padding: 14px 0;
  overflow: hidden;
  border-bottom: 3px double var(--eg-gold);
}
.eg-ticker-inner {
  display: flex;
  gap: 48px;
  white-space: nowrap;
  animation: eg-tick 40s linear infinite;
  font-family: 'Oswald', sans-serif;
  font-size: 0.92rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.eg-ticker-inner span {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.eg-ticker-inner span::before {
  content: '★';
  color: var(--eg-gold);
}
@keyframes eg-tick {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}


/* ─────────────────────────────────────────────────────────────────────
 * TIMELINE (Our Story page)
 * Vertical timeline with red dot pins and dashed connector line.
 *
 * HTML to use inside Code module:
 * <div class="eg-timeline">
 *   <div class="eg-tl-entry">
 *     <span class="eg-tl-year">1958</span>
 *     <h3>Title</h3>
 *     <p>Description...</p>
 *   </div>
 *   <!-- repeat -->
 * </div>
 * ───────────────────────────────────────────────────────────────────── */
.eg-timeline {
  position: relative;
  max-width: 880px;
  margin: 0 auto;
  padding: 0 32px;
}
.eg-timeline::before {
  content: '';
  position: absolute;
  left: 32px;
  top: 0;
  bottom: 0;
  width: 3px;
  background: repeating-linear-gradient(
    to bottom,
    var(--eg-ink) 0 8px,
    transparent 8px 14px
  );
}
.eg-tl-entry {
  position: relative;
  padding-left: 80px;
  margin-bottom: 56px;
}
.eg-tl-entry::before {
  content: '';
  position: absolute;
  left: 24px;
  top: 6px;
  width: 19px;
  height: 19px;
  background: var(--eg-red);
  border: 3px solid var(--eg-ink);
  border-radius: 50%;
  box-shadow: 0 0 0 3px var(--eg-paper);
}
.eg-tl-year {
  font-family: 'Alfa Slab One', Georgia, serif;
  font-size: 1.6rem;
  color: var(--eg-red-deep);
  display: block;
  margin-bottom: 6px;
}
.eg-tl-entry h3 {
  font-family: 'Alfa Slab One', Georgia, serif;
  font-size: 1.4rem;
  margin-bottom: 10px;
}
.eg-tl-entry p {
  color: var(--eg-ink-soft);
  font-size: 1rem;
  line-height: 1.65;
}


/* ─────────────────────────────────────────────────────────────────────
 * RECEIPT IMAGE (rotated frame)
 * For the 1958 chattel mortgage on Our Story page. Apply to a Divi Image
 * module to make it look like a tilted photographic print.
 *
 * Usage: CSS Class = "eg-receipt-frame"
 * ───────────────────────────────────────────────────────────────────── */
.eg-receipt-frame img,
.eg-receipt-frame {
  border: 4px solid var(--eg-ink) !important;
  box-shadow: 8px 8px 0 var(--eg-red) !important;
  transform: rotate(-2deg);
  background: var(--eg-cream) !important;
}


/* ─────────────────────────────────────────────────────────────────────
 * FOOTER STRIPED BAND
 * The perforated red/black/cream stripe at the top of the footer.
 *
 * Add a Divider module at the very top of footer with class:
 * Usage: CSS Class = "eg-footer-stripe"
 * (Module needs a height of 8px set in Divi.)
 * ───────────────────────────────────────────────────────────────────── */
.eg-footer-stripe {
  height: 8px !important;
  background: repeating-linear-gradient(
    90deg,
    var(--eg-red) 0 28px,
    var(--eg-ink) 28px 32px,
    var(--eg-cream) 32px 60px,
    var(--eg-ink) 60px 64px
  ) !important;
  border: 0 !important;
  margin: 0 !important;
}


/* ─────────────────────────────────────────────────────────────────────
 * FUNNEL STEP BAR
 * The 4-step progress indicator at the top of each funnel form.
 * Gravity Forms has its own multi-page styling — we'll override it.
 *
 * Rex: target the GF page indicator with these selectors. Adjust the
 * specific GF form ID once form is created.
 * ───────────────────────────────────────────────────────────────────── */
.gform_page_steps,
.gf_progressbar_wrapper {
  background: var(--eg-paper-warm);
  border-bottom: 2px solid var(--eg-ink);
  padding: 18px 32px;
  margin-bottom: 0;
}
.gform_page_step {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  flex: 1;
}
.gform_page_step_label {
  font-family: 'Oswald', sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--eg-ink-soft);
}
.gform_page_step.gform_page_step_active .gform_page_step_label {
  color: var(--eg-ink);
  font-weight: 600;
}
.gform_page_step_number {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--eg-cream);
  border: 2px solid var(--eg-ink);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Alfa Slab One', Georgia, serif;
  font-size: 0.85rem;
  color: var(--eg-ink);
}
.gform_page_step.gform_page_step_active .gform_page_step_number {
  background: var(--eg-red);
  color: var(--eg-cream);
}
.gform_page_step.gform_page_step_completed .gform_page_step_number {
  background: var(--eg-eagle-green);
  color: var(--eg-cream);
}


/* ─────────────────────────────────────────────────────────────────────
 * FUNNEL CHOICE TILES
 * Big clickable tiles for "Move Type", "Home Size", etc. in funnels.
 * Style Gravity Forms radio buttons to look like the prototype's choice grid.
 *
 * Rex: apply this as a per-field CSS class in Gravity Forms.
 * Add the class "eg-choice-grid" to the radio field's Appearance > CSS Class.
 * ───────────────────────────────────────────────────────────────────── */
.eg-choice-grid .gfield_radio {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}
.eg-choice-grid .gfield_radio .gchoice {
  background: var(--eg-cream);
  border: 2px solid var(--eg-ink);
  padding: 22px 18px;
  cursor: pointer;
  transition: all 0.15s ease;
  position: relative;
  font-family: 'Bitter', Georgia, serif;
  margin: 0 !important;
}
.eg-choice-grid .gfield_radio .gchoice input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  top: 0;
  left: 0;
}
.eg-choice-grid .gfield_radio .gchoice label {
  cursor: pointer;
  font-family: 'Alfa Slab One', Georgia, serif;
  font-size: 1.1rem;
  margin: 0;
}
.eg-choice-grid .gfield_radio .gchoice:hover {
  background: var(--eg-paper-warm);
}
.eg-choice-grid .gfield_radio .gchoice:has(input:checked) {
  background: var(--eg-ink);
  color: var(--eg-cream);
  transform: translate(-2px, -2px);
  box-shadow: 4px 4px 0 var(--eg-red);
}
.eg-choice-grid .gfield_radio .gchoice:has(input:checked) label {
  color: var(--eg-cream);
}

@media (max-width: 540px) {
  .eg-choice-grid .gfield_radio { grid-template-columns: 1fr; }
}


/* ─────────────────────────────────────────────────────────────────────
 * FUNNEL CONFIRMATION CHECK
 * The big green checkmark on the funnel "thank you" page.
 *
 * HTML to use:
 * <div class="eg-confirm-check">✓</div>
 * ───────────────────────────────────────────────────────────────────── */
.eg-confirm-check {
  width: 84px;
  height: 84px;
  margin: 0 auto 24px;
  background: var(--eg-eagle-green);
  border: 3px solid var(--eg-ink);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--eg-cream);
  font-family: 'Alfa Slab One', Georgia, serif;
  font-size: 2.6rem;
  box-shadow: 6px 6px 0 var(--eg-ink);
}


/* ─────────────────────────────────────────────────────────────────────
 * CTA BAND (red full-width section)
 * Used at bottom of pages for "Ready when you are." CTAs.
 *
 * Apply to a Divi Section with red background. Class adds the
 * subtle diagonal stripe overlay.
 *
 * Usage: CSS Class = "eg-cta-band"
 * ───────────────────────────────────────────────────────────────────── */
.eg-cta-band {
  position: relative;
  overflow: hidden;
}
.eg-cta-band::before {
  content: '';
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    45deg,
    transparent 0 12px,
    rgba(244, 237, 224, 0.04) 12px 13px
  );
  pointer-events: none;
}
.eg-cta-band > .et_pb_row,
.eg-cta-band > .et_pb_column {
  position: relative;
  z-index: 2;
}


/* ─────────────────────────────────────────────────────────────────────
 * SERVICE CARD HOVER (used on home services trio)
 * ───────────────────────────────────────────────────────────────────── */
.eg-svc-card {
  background: var(--eg-cream);
  border: 2px solid var(--eg-ink);
  padding: 36px 32px 32px !important;
  position: relative;
  transition: all 0.25s ease;
  cursor: pointer;
}
.eg-svc-card::before {
  content: '';
  position: absolute;
  inset: 6px;
  border: 1px solid var(--eg-ink);
  pointer-events: none;
  opacity: 0.3;
}
.eg-svc-card:hover {
  transform: translate(-3px, -3px);
  box-shadow: 8px 8px 0 var(--eg-red);
}


/* ─────────────────────────────────────────────────────────────────────
 * UTILITY BAR (top dark strip)
 * For the line above the main header with hours, phone, LOA link.
 *
 * If Adam builds this as a Divi global Section above the header, add
 * the class "eg-utility-bar" to that Section.
 * ───────────────────────────────────────────────────────────────────── */
.eg-utility-bar {
  background: var(--eg-ink) !important;
  color: var(--eg-paper-warm) !important;
  font-family: 'Special Elite', 'Courier New', monospace !important;
  font-size: 0.78rem !important;
  padding: 8px 0 !important;
  letter-spacing: 0.05em;
}
.eg-utility-bar a {
  color: var(--eg-paper-warm) !important;
  text-decoration: none !important;
}
.eg-utility-bar a:hover {
  color: var(--eg-gold) !important;
}

@media (max-width: 880px) {
  .eg-utility-bar { font-size: 0.72rem !important; padding: 6px 0 !important; }
}


/* ─────────────────────────────────────────────────────────────────────
 * PRIMARY CTA BUTTON
 * Apply on top of Divi's button preset for the "lift" hover effect with
 * hard offset shadow.
 *
 * Usage: CSS Class = "eg-btn-primary"
 * ───────────────────────────────────────────────────────────────────── */
.eg-btn-primary {
  background: var(--eg-red) !important;
  color: var(--eg-cream) !important;
  border: none !important;
  border-radius: 0 !important;
  font-family: 'Oswald', sans-serif !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  box-shadow: 4px 4px 0 var(--eg-ink) !important;
  transition: all 0.2s ease !important;
  padding: 14px 26px !important;
}
.eg-btn-primary:hover {
  background: var(--eg-red-deep) !important;
  transform: translate(-2px, -2px) !important;
  box-shadow: 6px 6px 0 var(--eg-ink) !important;
}

.eg-btn-green {
  background: var(--eg-eagle-green) !important;
  color: var(--eg-cream) !important;
  border: none !important;
  border-radius: 0 !important;
  font-family: 'Oswald', sans-serif !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  box-shadow: 4px 4px 0 var(--eg-ink) !important;
  transition: all 0.2s ease !important;
  padding: 14px 26px !important;
}
.eg-btn-green:hover {
  background: var(--eg-eagle-green-deep) !important;
  transform: translate(-2px, -2px) !important;
  box-shadow: 6px 6px 0 var(--eg-ink) !important;
}


/* ─────────────────────────────────────────────────────────────────────
 * RESPONSIVE HELPERS
 * ───────────────────────────────────────────────────────────────────── */
@media (max-width: 540px) {
  .eg-emblem,
  .eg-tagline { display: none !important; }
}


/* End of file */
/* Get Started CTA button in nav */
.nav-cta a,
ul li.nav-cta a {
  background: #C8102E !important;
  color: #fff !important;
  padding: 10px 18px !important;
  border-radius: 4px !important;
}
ul li.nav-cta a:hover {
  background: #9E0C24 !important;
}
ss/* Utility bar responsive */
@media (max-width: 880px) {
  .eg-utility-bar span:first-child {
    display: none;
  }
}

@media (max-width: 540px) {
  .eg-utility-bar {
    justify-content: center;
  }
  .eg-utility-bar span:last-child a:first-child ~ * {
    display: none;
  }
/* Footer responsive */
@media (max-width: 880px) {
  .et_pb_footer .et_pb_row {
    flex-wrap: wrap;
  }
  .et_pb_footer .et_pb_column {
    width: 50% !important;
    margin-bottom: 30px;
  }
}
@media (max-width: 540px) {
  .et_pb_footer .et_pb_column {
    width: 100% !important;
  }
}
	.et_pb_section:last-of-type {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
#main-content {
  padding-bottom: 0 !important;
}