/* Harbour: warm beige, navy text, clear blue accent, navy anchor bands. The main page theme (design 1). */

:root {
  --bg: #f3ede2;
  --panel: #fbf8f2;
  --panel-2: #e9e1d2;
  --line: #ddd3c1;
  --line-soft: #e7dfcf;
  --text: #14243b;
  --text-2: #34445a;
  --muted: #6f6a60;
  --accent: #1f5fae;
  --accent-hover: #174c8c;
  --on-accent: #ffffff;
  --live: #2e8b57;
  --logo-letter: #6aa0e6;
  --navy: #14243b;

  --font-display: "Outfit", "Segoe UI", sans-serif;
  --font-body: "Source Sans 3", "Segoe UI", sans-serif;

  --radius: 10px;
  --radius-lg: 18px;

  --page-bg: radial-gradient(900px 520px at 100% -10%, rgba(31, 95, 174, 0.08), transparent 60%);
}

body { font-size: 1.1rem; }
h1, h2, h3, h4 { font-weight: 600; letter-spacing: -0.02em; }
.hero-title { font-size: clamp(2.8rem, 5.6vw, 4.6rem); }
.hero-title .blur-seg:nth-last-child(-n+3) { color: var(--accent); }

.quote, .bento-item, .feature, .tech, .circuits, .users li {
  background-color: var(--panel);
  border-color: var(--line-soft);
  box-shadow: 0 1px 2px rgba(20, 36, 59, 0.05), 0 16px 36px -24px rgba(20, 36, 59, 0.3);
}
.bento-item:hover, .feature:hover { border-color: rgba(31, 95, 174, 0.35); }

.kicker .num { border-radius: 999px; padding-inline: 0.55rem; }

/* Navy anchor bands */
.facts, .contact-inner {
  --text: #f3ede2; --text-2: #d6dce6; --muted: #a9b6c8; --line: #2b3d58;
  background: var(--navy); color: var(--text);
}
.facts .stats { border-color: transparent; }
.stat dd { font-weight: 600; }
.stat:first-child dd { color: #8fbaf0; }
.contact-inner { border-color: var(--navy); }
.contact .btn-ghost { border-color: #5a6b85; }

.hero-photo, .portrait { border: 0; border-radius: var(--radius-lg); box-shadow: 0 30px 60px -34px rgba(20, 36, 59, 0.55); }
.photo img { border-color: transparent; }
.photo-strip img { filter: none; }

/* Quote highlights: blue text on a soft sand marker */
.quote mark { color: var(--accent); background: linear-gradient(transparent 60%, #ecdcbc 0); }