/* RIBILO GO - Shared presentation layer */
:root {
  --rb-navy: #102b49;
  --rb-blue: #0875ba;
  --rb-text: #17304a;
  --rb-muted: #52677b;
  --rb-bg: #f5f8fc;
  --rb-border: #dce6f0;
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  color: var(--rb-text);
  background: var(--rb-bg);
  line-height: 1.75;
  overflow-wrap: anywhere;
}

h1, h2, h3 {
  line-height: 1.4;
  letter-spacing: .01em;
}

h1 { font-size: clamp(28px, 4vw, 44px); }
h2 { font-size: clamp(22px, 3vw, 30px); }
h3 { font-size: clamp(18px, 2vw, 23px); }

a, button {
  transition: background-color .15s ease,
              color .15s ease;
}

a:focus-visible,
button:focus-visible {
  outline: 3px solid #3a9de0;
  outline-offset: 3px;
}

img, video, iframe {
  max-width: 100%;
}

.btn {
  border-radius: 9px;
  text-align: center;
}

@media (max-width: 767px) {
  body { font-size: 15px; }

  h1 { font-size: 28px; }
  h2 { font-size: 23px; }

  .wrap, main {
    max-width: 100%;
  }

  .btn {
    max-width: 100%;
    white-space: normal;
  }

  .navlinks {
    flex-wrap: wrap;
    gap: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  a, button { transition: none; }
}