:root {
  --kp-accent: #169cb6;
  --kp-accent-dark: #08708a;
  --kp-accent-light: #58c5d7;
}

.kp-function-dock-v17 {
  position: fixed;
  z-index: 990;
  top: clamp(104px, 13vh, 132px);
  left: 0;
  display: grid;
  gap: 8px;
  transform: none;
}

.kp-function-toggle-v17 {
  display: none !important;
}

.kp-function-links-v17 {
  display: grid;
  gap: 8px;
}

.kp-function-links-v17 a {
  display: grid;
  width: 52px;
  height: 52px;
  grid-template-columns: 52px 142px;
  align-items: center;
  overflow: hidden;
  border: 1px solid rgb(255 255 255 / 82%);
  border-left: 0;
  border-radius: 0 16px 16px 0;
  background: linear-gradient(145deg, var(--kp-accent-light), var(--kp-accent));
  box-shadow: 0 12px 28px rgb(3 24 40 / 25%);
  color: #fff;
  text-decoration: none;
  transition: width 220ms cubic-bezier(.2,.8,.2,1), filter 180ms ease, box-shadow 180ms ease;
}

.kp-function-links-v17 a:hover,
.kp-function-links-v17 a:focus-visible {
  width: 194px;
  filter: saturate(1.12) brightness(.96);
  box-shadow: 0 15px 34px rgb(3 24 40 / 32%);
  outline: none;
}

.kp-function-icon-v17 {
  display: grid;
  width: 52px;
  height: 52px;
  place-items: center;
}

.kp-function-icon-v17 svg,
.kp-round-button-v17 svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.kp-function-label-v17 {
  padding-right: 16px;
  font: 850 12px/1.2 Arial, Helvetica, sans-serif;
  white-space: nowrap;
}

.kp-contact-dock-v17 {
  position: fixed;
  z-index: 995;
  right: 18px;
  bottom: 18px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.kp-round-button-v17 {
  display: grid;
  width: 56px;
  height: 56px;
  padding: 0;
  place-items: center;
  border: 1px solid rgb(255 255 255 / 74%);
  border-radius: 50%;
  color: #fff;
  cursor: pointer;
  box-shadow: 0 12px 28px rgb(3 24 40 / 28%);
}

.kp-whatsapp-v17 { background: #21c967; }
.kp-up-v17 { background: linear-gradient(145deg, var(--kp-accent-light), var(--kp-accent-dark)); }

.kp-whatsapp-card-v17 {
  position: absolute;
  right: 0;
  bottom: 68px;
  width: min(360px, calc(100vw - 36px));
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--kp-accent) 35%, #d9e8ea);
  border-radius: 22px;
  background: #f5f0e9;
  color: #233947;
  box-shadow: 0 25px 70px rgb(3 24 40 / 32%);
}

.kp-whatsapp-card-v17[hidden] { display: none; }
.kp-whatsapp-card-v17 > button {
  position: absolute;
  z-index: 2;
  top: 10px;
  right: 10px;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 8px;
  background: #fff;
  color: var(--kp-accent-dark);
  cursor: pointer;
  font-size: 22px;
}

.kp-whatsapp-card-v17 > div {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 46px 14px 15px;
  background: var(--kp-accent-dark);
  color: #fff;
}

.kp-whatsapp-card-v17 img {
  width: 54px;
  height: 54px;
  border: 2px solid rgb(255 255 255 / 72%);
  border-radius: 50%;
  background: #d9eef0;
  object-fit: cover;
  object-position: 50% 12%;
}

.kp-whatsapp-card-v17 span { display: grid; gap: 2px; }
.kp-whatsapp-card-v17 small { font-size: 10px; }
.kp-whatsapp-card-v17 p { margin: 20px; padding: 17px; border-radius: 0 16px 16px; background: #fff; font: 13px/1.6 Arial, Helvetica, sans-serif; }
.kp-whatsapp-card-v17 p strong { display: block; }
.kp-whatsapp-card-v17 > a { display: block; margin: 0 20px 20px; padding: 13px; border-radius: 999px; background: #21c967; color: #fff; font: 850 13px/1.2 Arial, Helvetica, sans-serif; text-align: center; text-decoration: none; }

/* Only the shared v18 controls stay active. Historical docks and arrows are retired. */
body.kp-controls-v18-ready .back-to-top,
body.kp-controls-v18-ready .function-dock,
body.kp-controls-v18-ready .kp-function-dock,
body.kp-controls-v18-ready .contact-dock,
body.kp-controls-v18-ready .kp-contact-dock { display: none !important; }

/* At compact desktop widths the fixed rail must never cover the hero copy. */
@media (min-width: 651px) and (max-width: 1199px) {
  body.kp-controls-v18-ready:not([data-kp-topic="immo-invest"]) .hero-copy {
    margin-left: 46px !important;
    max-width: calc(100% - 46px);
  }
}

@media (max-width: 650px) {
  .kp-function-dock-v17 {
    top: auto;
    right: auto;
    bottom: 12px;
    left: 12px;
    display: flex;
    align-items: flex-start;
    flex-direction: column-reverse;
    transform: none;
  }

  .kp-function-toggle-v17 {
    display: grid !important;
    width: 48px;
    height: 48px;
    padding: 0;
    place-items: center;
    border: 1px solid rgb(255 255 255 / 82%);
    border-radius: 50%;
    background: linear-gradient(145deg, var(--kp-accent-light), var(--kp-accent-dark));
    box-shadow: 0 12px 28px rgb(3 24 40 / 28%);
    color: #fff;
    cursor: pointer;
  }

  .kp-function-toggle-grid-v17 { display: grid; grid-template-columns: repeat(2, 5px); gap: 4px; }
  .kp-function-toggle-grid-v17 i { width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
  .kp-function-links-v17 { gap: 6px; opacity: 0; pointer-events: none; transform: translateY(10px); visibility: hidden; transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease; }
  .kp-function-dock-v17.is-open .kp-function-links-v17 { opacity: 1; pointer-events: auto; transform: translateY(0); visibility: visible; }
  .kp-function-links-v17 a { width: 44px; height: 44px; grid-template-columns: 44px 130px; border: 1px solid rgb(255 255 255 / 82%); border-radius: 13px; }
  .kp-function-links-v17 a:hover,
  .kp-function-links-v17 a:focus-visible { width: 174px; }
  .kp-function-icon-v17 { width: 44px; height: 44px; }
  .kp-function-icon-v17 svg { width: 21px; height: 21px; }
  .kp-function-label-v17 { font-size: 11px; }
  .kp-contact-dock-v17 { right: 12px; bottom: 12px; }
  .kp-round-button-v17 { width: 50px; height: 50px; }
}

@media (prefers-reduced-motion: reduce) {
  .kp-function-links-v17 a { transition: none; }
}
