:root {
  --vc-navy: #0c2d30;
}

body.site-v3 {
  overflow-x: clip;
}

/* VIKTOR uses the same layout system, typography, spacing and palette as the
   current kresimirmatic.com site. These rules only adapt the product identity
   and protect contrast in dark sections. */
.site-v3 .header {
  grid-template-columns: minmax(220px, 0.8fr) auto auto;
}

.vc-identity {
  min-width: 220px;
  gap: 0.75rem;
}

.vc-brand-mark {
  width: 54px;
  height: 54px;
  flex: 0 0 54px;
  object-fit: contain;
}

.vc-identity strong {
  letter-spacing: 0.05em;
}

.vc-identity small {
  color: #5f6967;
}

.mobile-menu:not([open]) nav {
  display: none;
}

.vc-founder-link,
.vc-section-link {
  color: inherit;
  font-weight: 800;
  text-decoration: none;
}

.vc-founder-link::after {
  margin-left: 0.35rem;
  content: "\2197";
}

.vc-section-link {
  display: inline-flex;
  margin-top: 2rem;
  border-bottom: 1px solid currentColor;
}

/* The opening section is an existing site section. Explicit values prevent
   strong text and the secondary button from inheriting dark-on-dark colors. */
.v3-viktor-hero .v3-hero-copy > p,
.v3-viktor-hero .v3-hero-copy > p strong {
  color: rgba(255, 255, 255, 0.82);
}

.v3-viktor-hero .v3-hero-copy > p strong {
  color: #ffffff;
}

.v3-viktor-hero .v3-button:not(.v3-button-primary) {
  border-color: rgba(255, 255, 255, 0.72);
  color: #ffffff;
  background: transparent;
}

.v3-viktor-hero .v3-button:not(.v3-button-primary):hover {
  color: var(--vc-navy);
  background: #ffffff;
}

.v3-proof .vc-section-link {
  color: #ffffff;
}

.vc-founder-section {
  color: #f5f0e6;
  background: var(--vc-navy);
}

.vc-founder-section .v3-kicker,
.vc-founder-section .v3-lead {
  color: #f5f0e6;
}

.vc-founder-section .v3-lead {
  opacity: 0.88;
}

.vc-footer-brand {
  display: flex;
  align-items: center;
  gap: 0.9rem;
}

.vc-footer-brand img {
  width: 64px;
  height: 64px;
  object-fit: contain;
}

.vc-footer-brand h2,
.vc-footer-brand p {
  margin: 0;
}

.vc-footer-brand p {
  margin-top: 0.25rem;
}

.vc-page-hero-copy {
  max-width: 62rem;
}

.vc-security-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin-top: 3rem;
  border: 1px solid rgba(12, 45, 48, 0.18);
  background: rgba(12, 45, 48, 0.18);
}

.vc-security-grid article {
  padding: clamp(1.5rem, 3vw, 3rem);
  background: #f7f2e8;
}

.vc-security-grid h3 {
  margin-top: 0;
}

.vc-security-grid p {
  margin-bottom: 0;
  color: #5f6865;
  line-height: 1.7;
}

.vc-contact-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(2rem, 6vw, 7rem);
  align-items: start;
}

@media (max-width: 1180px) {
  .site-v3 .header {
    grid-template-columns: minmax(200px, 1fr) auto auto;
  }

  .desktop-nav a:nth-child(5),
  .desktop-nav a:nth-child(6) {
    display: none;
  }
}

@media (max-width: 760px) {
  .site-v3 .header {
    grid-template-columns: 1fr auto;
  }

  .vc-identity {
    min-width: 0;
  }

  .vc-brand-mark {
    width: 46px;
    height: 46px;
    flex-basis: 46px;
  }

  .vc-identity small {
    display: none;
  }

  .vc-security-grid,
  .vc-contact-panel {
    grid-template-columns: 1fr;
  }
}