:root {
  --keechilot-ink: #25324a;
  --keechilot-sky: #a0b4d3;
  --keechilot-sky-deep: #587eae;
  --keechilot-sky-dark: #365d8b;
  --keechilot-surface: rgba(247, 250, 255, 0.94);
  --keechilot-button: #e9eef6;
  --keechilot-button-hover: #dce6f3;
  --keechilot-shadow: 0 8px 24px rgba(29, 48, 78, 0.16);
}

/* Replace the UI kit's pink primary palette on Keechilot presentation pages. */
.bg-gradient-primary {
  background-image: linear-gradient(310deg, var(--keechilot-sky-dark), var(--keechilot-sky)) !important;
}

.text-primary {
  color: var(--keechilot-sky-dark) !important;
}

.text-gradient.text-primary {
  background-image: linear-gradient(310deg, var(--keechilot-sky-dark), var(--keechilot-sky-deep));
}

.btn.bg-gradient-primary {
  border-color: var(--keechilot-sky-deep);
  background-image: linear-gradient(310deg, var(--keechilot-sky-dark), var(--keechilot-sky-deep)) !important;
  box-shadow: 0 4px 12px rgba(54, 93, 139, 0.25);
}

.site-nav-shell { position: absolute; inset: 0 0 auto; z-index: 1030; padding: .75rem clamp(.75rem, 2.5vw, 2rem); }
.site-navbar { width: 100%; min-height: 72px; border: 1px solid rgba(255,255,255,.7); border-radius: 2rem; background: var(--keechilot-surface); box-shadow: var(--keechilot-shadow); backdrop-filter: blur(16px); }
.site-brand { display: inline-flex; min-width: 0; align-items: center; gap: .75rem; color: var(--keechilot-ink); font-size: clamp(.82rem, 1.4vw, 1rem); font-weight: 700; white-space: nowrap; }
.site-brand:hover { color: var(--keechilot-ink); }
.site-brand img { flex: 0 0 auto; border-radius: 50%; object-fit: cover; }
.site-nav-actions { gap: .5rem; }
.site-nav-button { display: inline-flex; min-width: 112px; min-height: 38px; margin: 0; align-items: center; justify-content: center; border: 0; border-radius: 999px; background: var(--keechilot-button); color: var(--keechilot-ink); font-size: .75rem; font-weight: 700; line-height: 1; text-transform: uppercase; white-space: nowrap; box-shadow: 0 3px 10px rgba(29,48,78,.12); }
.site-nav-button:hover, .site-nav-button:focus { background: var(--keechilot-button-hover); color: var(--keechilot-ink); transform: translateY(-1px); }
.site-nav-caret { width: 10px; height: 6px; margin-left: .4rem; object-fit: contain; }
.site-menu-toggle { margin-left: auto; border: 0; box-shadow: none !important; }
.site-menu-icon { display: grid; width: 24px; gap: 5px; }
.site-menu-icon span { display: block; width: 100%; height: 2px; border-radius: 999px; background: var(--keechilot-ink); }
.site-submenu {
  z-index: 1080;
  min-width: 250px;
  padding: .55rem;
  overflow: hidden;
  border: 1px solid #d7e1ef;
  border-radius: 1rem;
  background: #fff;
  color: var(--keechilot-ink);
  box-shadow: 0 16px 36px rgba(29, 48, 78, .24);
}
.site-submenu .dropdown-item {
  display: block;
  width: 100%;
  padding: .7rem .85rem;
  border-radius: .65rem;
  color: var(--keechilot-ink);
  font-size: .85rem;
  line-height: 1.35;
  white-space: nowrap;
}
.site-submenu .dropdown-item:hover,
.site-submenu .dropdown-item:focus {
  background: #e8eff8;
  color: var(--keechilot-sky-dark);
}

/* Override the UI kit's mobile `overflow: scroll` dropdown rule. */
.site-navbar .dropdown.nav-item .site-submenu {
  height: auto;
  max-height: none;
  overflow: visible;
  background: #fff;
}
.site-family-message { display: grid; width: 270px; gap: .55rem; padding: .65rem; color: var(--keechilot-ink); white-space: normal; }
.site-family-message span { font-size: .8rem; line-height: 1.45; }
.site-login-prompt { width: fit-content; min-width: 96px; margin-top: .25rem; }

.contact-section { background: linear-gradient(180deg, #f8fbff 0%, #e7eff9 100%); }
.contact-card { overflow: hidden; border: 1px solid rgba(160, 180, 211, .55); border-radius: 1.5rem; }
.contact-form-panel { padding: clamp(1.5rem, 4vw, 3rem); background: #fff; }
.contact-info-panel { padding: clamp(1.5rem, 4vw, 3rem); background: linear-gradient(145deg, var(--keechilot-sky-dark), var(--keechilot-sky-deep)); color: #fff; }
.contact-info-panel h3, .contact-info-panel p { color: #fff; }
.contact-info-panel p { line-height: 1.7; opacity: .9; }
.contact-kicker { display: inline-block; margin-bottom: 1.25rem; font-size: .75rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; opacity: .8; }
.contact-title { margin-bottom: .4rem; color: var(--keechilot-ink); }
.contact-intro { margin-bottom: 1.5rem; color: #66758d; }
.contact-form-panel .form-label { color: var(--keechilot-ink); font-weight: 600; }
.contact-form-panel .form-control { border: 1px solid #cbd7e7; background: #f9fbfe; color: var(--keechilot-ink); }
.contact-form-panel .form-control:focus { border-color: var(--keechilot-sky-deep); box-shadow: 0 0 0 .2rem rgba(88, 126, 174, .15); }
.contact-form-panel .form-control[readonly] { background: #edf3fa; color: #52627a; }
.contact-submit-row { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.contact-submit { min-width: 150px; margin: 0; }
.contact-submit:disabled { cursor: wait; opacity: .7; }
.contact-response { color: #66758d; font-size: .9rem; }
.contact-response.is-success { color: #247341; }
.contact-response.is-error { color: #b42318; }

@media (max-width: 991.98px) {
  .site-nav-shell { padding: .75rem; }
  .site-navbar { min-height: 64px; border-radius: 1.5rem; }
  .site-brand img { width: 42px; height: 42px; }
  .site-navbar .navbar-collapse { padding: .75rem 0 .25rem; }
  .site-nav-actions { align-items: center; gap: .5rem; }
  .site-nav-actions > .nav-item { width: 100%; text-align: center; }
  .site-nav-actions > .nav-item > .site-nav-button { width: min(180px, 100%); }
  .site-submenu {
    width: min(290px, calc(100vw - 3rem));
    min-width: 0;
    max-width: calc(100vw - 3rem);
    margin: .5rem auto 0;
    overflow: visible;
    text-align: left;
  }
  .site-submenu .dropdown-item { white-space: normal; }
  .site-family-message { width: 100%; }
}