.site-footer.footer-reference {
  --footer-unit: clamp(0.42px, 0.04375vw, 1.68px);
  margin-top: 0;
  padding: calc(40 * var(--footer-unit)) 0 calc(8 * var(--footer-unit));
  background:
    radial-gradient(ellipse at 20% -60%, transparent 48%, rgb(0 8 18 / 35%) 48.2%, transparent 70%),
    radial-gradient(ellipse at 100% 0%, transparent 55%, rgb(0 18 34 / 50%) 55.2%, transparent 78%),
    linear-gradient(125deg, #061a2c, #031526 55%, #041b2e);
  color: #acbfd7;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: calc(20 * var(--footer-unit));
  line-height: 1.4;
}

.footer-reference-inner { width: 80%; margin: 0 auto; }
.footer-reference-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, 1.35fr) minmax(112px, 180px); gap: 3%; }
.footer-explore, .footer-contact { justify-self: center; }
.footer-contact {
  display: block;
  width: 100%;
  justify-self: stretch;
}
.footer-map {
  position: relative;
  grid-column: 4;
  grid-row: 1;
  width: 100%;
  max-width: 180px;
  aspect-ratio: 1;
  justify-self: end;
  overflow: hidden;
  border: 1px solid #35546f;
  border-radius: 4px;
  background: #061a2c;
}
.footer-map iframe { display: block; width: 100%; height: 100%; border: 0; pointer-events: none; }
.footer-map-link { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.footer-map-link:hover { background: rgb(16 184 233 / 12%); }
.footer-map-link:focus-visible { outline: 2px solid #10b8e9; outline-offset: -3px; }
.footer-brand-logo { display: block; width: 77%; margin: calc(18 * var(--footer-unit)) 0 calc(28 * var(--footer-unit)); }
.footer-brand-logo img { display: block; width: min(100%, 120.7px); height: auto; }
.footer-brand p { margin: 0 0 calc(34 * var(--footer-unit)); }
.footer-brand p:last-child { margin-bottom: 0; }
.footer-location { display: flex; align-items: center; gap: calc(18 * var(--footer-unit)); color: #e0e5ee; }
.footer-reference svg { width: calc(30 * var(--footer-unit)); height: calc(30 * var(--footer-unit)); flex-shrink: 0; color: #10b8e9; }
.footer-reference h2 { margin: 0 0 calc(26 * var(--footer-unit)); font-size: calc(28 * var(--footer-unit)); font-weight: 600; line-height: 1.2; color: #f5f6fa; }
.footer-reference h2::after { content: ""; display: block; width: calc(48 * var(--footer-unit)); height: max(2px, calc(4 * var(--footer-unit))); margin-top: calc(14 * var(--footer-unit)); background: #10b8e9; border-radius: 2px; }
.footer-explore > a { display: block; width: fit-content; margin-bottom: calc(12 * var(--footer-unit)); }
.footer-contact > a { display: flex; width: fit-content; max-width: 100%; align-items: center; gap: calc(22 * var(--footer-unit)); margin-bottom: calc(28 * var(--footer-unit)); color: #e0e5ee; font-size: calc(19 * var(--footer-unit)); }
.footer-contact > a:last-child { margin-bottom: 0; }
.footer-contact > a span { overflow-wrap: anywhere; }
.footer-contact .footer-whatsapp-icon { color: #f5f6fa; }
.footer-contact-row { display: flex; align-items: center; justify-content: space-between; gap: calc(14 * var(--footer-unit)); max-width: 100%; margin-bottom: calc(18 * var(--footer-unit)); }
.footer-contact-row .footer-contact-number { min-width: 0; color: #e0e5ee; font-size: calc(19 * var(--footer-unit)); overflow-wrap: anywhere; }
.footer-contact-options { position: relative; flex: 0 0 auto; }
.footer-contact-options > summary { display: flex; width: fit-content; align-items: center; gap: calc(18 * var(--footer-unit)); list-style: none; cursor: pointer; color: #e0e5ee; }
.footer-contact-options > summary::-webkit-details-marker { display: none; }
.footer-contact-options > summary:focus-visible { outline: 2px solid #10b8e9; outline-offset: 3px; border-radius: 2px; }
.footer-contact-options[open] > summary { color: #10b8e9; }
.footer-contact-menu { position: absolute; left: calc(100% + 8px); bottom: 0; z-index: 20; display: grid; min-width: 124px; padding: 4px; border: 1px solid #35546f; border-radius: 4px; background: #061a2c; box-shadow: 0 8px 24px rgb(0 0 0 / 28%); }
.footer-contact-menu a { display: flex; align-items: center; gap: 8px; padding: 9px 12px; color: #f5f6fa; font-size: 13px; line-height: 1.3; white-space: nowrap; }
.footer-contact-menu svg { width: 16px; height: 16px; flex-shrink: 0; color: #10b8e9; }
.footer-contact-menu a:hover { background: #0b3047; color: #fff; }
.footer-reference-bottom { display: flex; align-items: center; justify-content: space-between; gap: calc(20 * var(--footer-unit)); border-top: 1px solid #2a4b63; margin-top: calc(44 * var(--footer-unit)); padding: calc(21 * var(--footer-unit)) 0; font-size: calc(16 * var(--footer-unit)); }
.footer-reference-bottom p { margin: 0; }
.footer-policy-links { display: flex; align-items: center; }
.footer-policy-links a { padding: 0 calc(16 * var(--footer-unit)); white-space: nowrap; }
.footer-policy-links a + a { border-left: 1px solid #35546f; }
.footer-back-top {
  position: fixed;
  right: max(16px, env(safe-area-inset-right));
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 100;
  display: grid;
  width: 44px;
  aspect-ratio: 1;
  place-items: center;
  border: 1px solid rgb(255 255 255 / 55%);
  border-radius: 50%;
  background: #10b8e9;
  color: #061a2c;
  box-shadow: 0 4px 14px rgb(0 8 18 / 32%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(6px);
  transition: opacity 0.18s ease, background-color 0.18s ease, transform 0.18s ease;
}
.footer-back-top.is-visible { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); }
.footer-back-top svg { width: 21px; height: 21px; color: inherit; }
.footer-reference .footer-back-top:hover { background: #fff; color: #061a2c; transform: translateY(-2px); }
.footer-back-top:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.footer-reference a:hover { color: #fff; }

@media (max-width: 1100px) {
  .site-footer.footer-reference { --footer-unit: 0.56px; padding: 24px 0 6px; }
  .footer-reference-grid { grid-template-columns: 1fr 1fr; gap: 22px 34px; }
  .footer-map { grid-column: 2; grid-row: 2; justify-self: center; }
  .footer-explore, .footer-contact { justify-self: start; }
  .footer-brand-logo { max-width: 350px; }
  .footer-reference-bottom { flex-wrap: wrap; gap: 15px; }
  .footer-policy-links { flex-wrap: wrap; gap: 7px 0; }
  .footer-policy-links a:first-child { padding-left: 0; }
}

@media (max-width: 540px) {
  .footer-reference-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 16px; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-contact { display: block; }
  .footer-map {
    grid-column: 1 / -1;
    grid-row: auto;
    justify-self: center;
  }
  .footer-reference h2 { margin-bottom: 14px; }
  .footer-brand p { margin-bottom: 14px; }
  .footer-reference-bottom { align-items: flex-start; flex-direction: column; }
  .footer-policy-links { font-size: 8px; }
  .footer-policy-links a { padding-inline: 8px; }
}
