/* ============ Modern Footer Skin (no HTML changes) ============ */

/* Overall footer */
#footer.dark {
  background: #0b1220;               /* deep navy */
  color: rgba(255,255,255,.82);
  padding-top: 56px;
  border-top: 1px solid rgba(255,255,255,.08);
}

/* tighten default widget spacing, create "cards" */
#footer .footer-widgets-wrap {
  padding: 0 0 28px 0;
}

#footer .widget {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 20px 20px;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}

/* logo spacing */
#footer .footer-logo {
  margin-bottom: 14px;
  filter: drop-shadow(0 6px 14px rgba(0,0,0,.25));
}

/* remove the world-map “boxy” feel without breaking it */
#footer .widget [style*="world-map.png"] {
  border-radius: 12px;
  padding: 16px !important;
  background-color: rgba(255,255,255,.02);
  border: 1px dashed rgba(255,255,255,.12);
}



/* headings */
#footer h4,
#footer h5 {
  color: #fff;
  letter-spacing: .2px;
}

#footer h4 {
  font-size: 16px;
  margin-bottom: 12px;
}

#footer h5 {
  font-size: 14px;
  line-height: 1.45;
  margin-bottom: 14px;
}

/* addresses + labels */
#footer address,
#footer abbr,
#footer strong {
  color: rgba(255,255,255,.9);
}

#footer abbr strong {
  font-weight: 700;
}

/* Inputs */
#footer .form-control {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  color: #fff;
  border-radius: 12px;
  height: 44px;
  box-shadow: none;
}

#footer .form-control::placeholder {
  color: rgba(255,255,255,.55);
}

#footer textarea.form-control,
#footer .short-textarea {
  height: auto;
  min-height: 90px;
  padding-top: 12px;
  padding-bottom: 12px;
  border-radius: 12px;
}

/* Input group icons */
#footer .input-group-addon {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.75);
  border-radius: 12px 0 0 12px;
}

#footer .input-group .form-control {
  border-left: 0;
  border-radius: 0 12px 12px 0;
}

/* Buttons (keep your existing btn classes) */
#footer .btn {
  border-radius: 12px;
  padding: 10px 14px;
  font-weight: 700;
  letter-spacing: .2px;
  border: 1px solid rgba(255,255,255,.14);
  transition: transform .12s ease, filter .12s ease;
}

#footer .btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.05);
}

/* Make Subscribe button feel modern without changing class */
#footer .btn.btn-success {
  background: linear-gradient(135deg, #16a34a, #22c55e);
  border-color: rgba(34,197,94,.35);
}

/* Make Send Email button modern */
#footer .btn.btn-danger {
  background: linear-gradient(135deg, #dc2626, #ef4444);
  border-color: rgba(239,68,68,.35);
}

/* Social icons layout in widget area */
#footer .social-icon {
  border-radius: 14px;
  box-shadow: 0 10px 20px rgba(0,0,0,.25);
  transition: transform .12s ease, opacity .12s ease;
}

#footer .social-icon:hover {
  transform: translateY(-2px);
  opacity: .95;
}

/* ===== Copyright bar ===== */
#copyrights {
  background: rgba(0,0,0,.35);
  border-top: 1px solid rgba(255,255,255,.08);
  padding: 18px 0;
  color: rgba(255,255,255,.72);
}

#copyrights .copyrights-menu a {
  color: rgba(255,255,255,.85);
  text-decoration: none;
}

/* The quote line currently uses <a> incorrectly — but we can style it anyway */
#copyrights .copyrights-menu a {
  display: inline-block;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  padding: 8px 12px;
  border-radius: 999px;
  margin-bottom: 10px;
}

/* Bottom social icons */
#copyrights .social-icon.si-small {
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
}

/* Responsive: stack columns cleanly */
@media (max-width: 991px) {
  #footer .col_one_third,
  #footer .col_half {
    float: none !important;
    width: 100% !important;
    margin-bottom: 18px;
  }

  #footer .col_last,
  #footer .tright {
    text-align: left !important;
  }

  #footer .fright {
    float: none !important;
  }
}

/* =========================
   Footer Buttons ? Orange
   ========================= */

/* Subscribe button */
#footer .btn.btn-success {
  background: linear-gradient(135deg, #fc943f, #ff7a1a);
  border: none;
  color: #fff;
  font-weight: 700;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(252,148,63,0.35);
  transition: all 0.2s ease;
}

/* Send Email button */
#footer .btn.btn-danger {
  background: linear-gradient(135deg, #fc943f, #ff7a1a);
  border: none;
  color: #fff;
  font-weight: 700;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(252,148,63,0.35);
  transition: all 0.2s ease;
}

/* Hover state ? subtle blue brand */
#footer .btn.btn-success:hover,
#footer .btn.btn-danger:hover {
  background: linear-gradient(135deg, #3B5998, #2f4b84);
  box-shadow: 0 8px 20px rgba(59,89,152,0.35);
  transform: translateY(-2px);
}


/* =========================
   Footer Phone + Email Highlight (no HTML changes)
   ========================= */

/* The phone/email text are plain text after these abbr labels.
   Style the whole line, then keep the label subtle. */
#footer abbr[title="Phone Number"],
#footer abbr[title="Email Address"]{
  display: inline-block;
  min-width: 62px; /* keeps labels aligned */
  color: rgba(255,255,255,.75) !important;
}

#footer abbr[title="Phone Number"] + strong,
#footer abbr[title="Email Address"] + strong{
  color: #ff7a1a !important;     /* ICG orange */
  font-weight: 800 !important;
  font-size: 18px !important;
  letter-spacing: .2px;
}

/* If there is NO <strong> right after abbr (your current HTML is like: </abbr>  954... )
   then style the whole containing block and re-tone the labels. */
#footer .widget [style*="world-map.png"]{
  font-size: 14px; /* base */
}

/* Make the lines stand out */
#footer .widget [style*="world-map.png"] br{
  line-height: 1.9;
}

/* Force-highlight the entire line that contains Phone/Email by targeting the abbr and styling its parent */
#footer .widget [style*="world-map.png"] abbr[title="Phone Number"],
#footer .widget [style*="world-map.png"] abbr[title="Email Address"]{
  font-weight: 700;
}

/* Apply orange/bold to everything AFTER the label by making the parent a little bigger,
   then making the label dimmer. This visually makes the value pop even if it's plain text. */
#footer .widget [style*="world-map.png"]{
  font-size: 15px !important;
}

#footer .widget [style*="world-map.png"] abbr[title="Phone Number"] + * ,
#footer .widget [style*="world-map.png"] abbr[title="Email Address"] + *{
  color: #ff7a1a !important;
  font-weight: 800 !important;
  font-size: 18px !important;
}


/* =========================
   FORCE phone/email values to be orange + bold
   (works even if they are plain text nodes)
   ========================= */

/* 1) Make the whole contact block orange/bold by default */
#footer .widget [style*="world-map.png"]{
  color: #ff7a1a !important;      /* orange */
  font-weight: 800 !important;
  font-size: 18px !important;
  line-height: 1.7;
}

/* 2) Keep the address area normal (not orange) */
#footer .widget [style*="world-map.png"] address,
#footer .widget [style*="world-map.png"] address *{
  color: rgba(255,255,255,.90) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}

/* 3) Keep the "Phone:" and "Email:" labels normal (not orange) */
#footer .widget [style*="world-map.png"] abbr,
#footer .widget [style*="world-map.png"] abbr strong{
  color: rgba(255,255,255,.80) !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-decoration: none !important; /* removes underline if any */
}

/* Make logo hoverable (works even if .footer-logo is an IMG) */
#footer .footer-logo {
  transition: filter .25s ease, transform .25s ease, opacity .25s ease;
  cursor: pointer;
}

/* If logo is an <img class="footer-logo"> */
#footer img.footer-logo:hover {
  transform: translateY(-1px);
  opacity: 1;
  filter:
    drop-shadow(0 0 10px rgba(79,195,247,.55))  /* light blue glow */
    drop-shadow(0 0 12px rgba(252,148,63,.55)); /* orange glow */
}

/* If logo is inside a link */
/* Make logo hoverable (works even if .footer-logo is an IMG) */
#footer .footer-logo {
  transition: filter .25s ease, transform .25s ease, opacity .25s ease;
  cursor: pointer;
}

/* If logo is an <img class="footer-logo"> */
#footer img.footer-logo:hover {
  transform: translateY(-1px);
  opacity: 1;
  filter:
    drop-shadow(0 0 10px rgba(79,195,247,.55))  /* light blue glow */
    drop-shadow(0 0 12px rgba(252,148,63,.55)); /* orange glow */
}

/* If logo is inside a link */
#footer a:hover .footer-logo,
#footer .footer-logo a:hover img,
#footer .footer-logo:hover img {
  transform: translateY(-1px);
  filter:
    drop-shadow(0 0 10px rgba(79,195,247,.55))
    drop-shadow(0 0 12px rgba(252,148,63,.55));
}


/* Footer logo hover: blue + orange "gradient" feel */
#footer img.footer-logo{
  transition: transform .35s ease, filter .35s ease;
  cursor: pointer;
}

#footer img.footer-logo:hover{
  transform: translateY(-2px);
  filter:
    brightness(1.08)
    contrast(1.12)
    saturate(1.35)
    drop-shadow(0 0 10px rgba(79,195,247,.75))   /* light blue */
    drop-shadow(0 0 16px rgba(252,148,63,.85));  /* orange */
}