/* =========================================================
   650 KGL SOCIAL V1.1
   FOOTER CLEANUP + CONTACT STACK INTEGRATION
   ========================================================= */

:root {
  --kgl-v11-footer-copy: rgba(255,255,255,.82);
  --kgl-v11-footer-line: rgba(255,255,255,.24);
  --kgl-v11-deep: #203d68;
  --kgl-v11-muted: #657381;
  --kgl-v11-orange: #d58b45;
  --kgl-v11-aqua: #48a9b8;
}

/* Shared icon linework */
.kgl-v11-icon-bubble svg,
.kgl-footer-social-row-v11 svg,
.kgl-v11-contact-method-card svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* =========================================================
   FOOTER
   ========================================================= */

.kgl-footer-contact-v11 {
  font-family: Helvetica, "Helvetica Neue", Arial, sans-serif !important;
}

/* Social row sits close to the actual contact details. */
.kgl-footer-social-row-v11 {
  display: flex;
  align-items: center;
  gap: 7px;

  margin: 9px 0 7px !important;
  padding: 0 !important;
}

.kgl-footer-social-row-v11 .kgl-social-icon-link {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  width: 28px;
  height: 28px;
  padding: 6px;

  border: 1px solid var(--kgl-v11-footer-line);
  border-radius: 50%;

  color: rgba(255,255,255,.88) !important;
  background: transparent !important;

  text-decoration: none !important;

  transition:
    transform .18s ease,
    color .18s ease,
    border-color .18s ease,
    background .18s ease;
}

.kgl-footer-social-row-v11 .kgl-social-icon-link:hover,
.kgl-footer-social-row-v11 .kgl-social-icon-link:focus-visible {
  color: #fff !important;
  border-color: rgba(213,139,69,.8);
  background: rgba(213,139,69,.12) !important;
  transform: translateY(-1px);
  outline: none;
}

/* Email/location use the exact same circular visual language. */
.kgl-footer-contact-line-v11 {
  display: flex !important;
  align-items: center;
  gap: 8px;

  width: fit-content;
  max-width: 100%;

  margin: 4px 0 0 !important;
  padding: 0 !important;

  color: var(--kgl-v11-footer-copy) !important;
  font-family: Helvetica, "Helvetica Neue", Arial, sans-serif !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;

  text-decoration: none !important;
}

a.kgl-footer-contact-line-v11:hover,
a.kgl-footer-contact-line-v11:focus-visible {
  color: #fff !important;
}

.kgl-footer-contact-line-v11 .kgl-v11-icon-bubble {
  flex: 0 0 28px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 28px;
  height: 28px;
  padding: 6px;

  border: 1px solid var(--kgl-v11-footer-line);
  border-radius: 50%;

  color: rgba(255,255,255,.80);
}

.kgl-footer-contact-copy-v11 {
  min-width: 0;
}

/* =========================================================
   CONTACT PAGE
   ========================================================= */

/* V1 panel must never survive V1.1. */
.kgl-contact-social-connect {
  display: none !important;
}

/*
 * New cards deliberately mimic the existing Contact-page cards:
 * no separate section, no large heading, no competing panel.
 */
.kgl-v11-contact-method-card {
  display: flex !important;
  align-items: center;
  gap: 14px;

  width: 100%;
  min-height: 68px;

  margin: 0 !important;
  padding: 15px 18px !important;

  border: 1px solid #dce3e7;
  border-radius: 7px;

  background: #fff;

  color: var(--kgl-v11-deep) !important;
  font-family: Helvetica, "Helvetica Neue", Arial, sans-serif !important;

  text-decoration: none !important;

  box-shadow: none;
  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}

.kgl-v11-contact-method-card:hover,
.kgl-v11-contact-method-card:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(41,74,123,.30);
  box-shadow: 0 9px 22px rgba(31,58,99,.07);
  outline: none;
}

/* Match the existing colored outline-icon chips. */
.kgl-v11-contact-method-icon {
  flex: 0 0 34px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 34px;
  height: 34px;
  padding: 7px;

  border: 1px solid rgba(72,169,184,.42);
  border-radius: 9px;

  color: var(--kgl-v11-aqua);
  background: rgba(72,169,184,.08);
}

.kgl-v11-tiktok .kgl-v11-contact-method-icon {
  color: var(--kgl-v11-deep);
  border-color: rgba(41,74,123,.28);
  background: rgba(41,74,123,.055);
}

.kgl-v11-contact-method-copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.kgl-v11-contact-method-copy strong {
  color: var(--kgl-v11-deep);
  font-family: Helvetica, "Helvetica Neue", Arial, sans-serif;
  font-size: 13px;
  line-height: 1.2;
  font-weight: 700;
}

.kgl-v11-contact-method-copy small {
  margin-top: 3px;

  color: var(--kgl-v11-muted);
  font-family: Helvetica, "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  line-height: 1.25;
  font-weight: 400;
}

/* Existing cards appear to use vertical spacing via parent gap. Ensure ours
   participate correctly if the parent itself does not define a gap. */
.kgl-v11-contact-stack > .kgl-v11-contact-method-card {
  margin-top: 12px !important;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 680px) {
  .kgl-footer-social-row-v11 {
    margin-bottom: 6px !important;
  }

  .kgl-footer-social-row-v11 .kgl-social-icon-link,
  .kgl-footer-contact-line-v11 .kgl-v11-icon-bubble {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
  }

  .kgl-v11-contact-method-card {
    min-height: 64px;
    padding: 14px 15px !important;
  }
}