/* North East Business Support — site styles.
   Palette and type live here; index.html carries no inline styles. */

:root {
  --nebs-ink: #1F2933;
  --nebs-ink-deep: #171F28;
  --nebs-granite: #52606D;
  --nebs-accent: #2F6F6B;
  --nebs-accent-soft: #9DC3BE;
  --nebs-accent-tint: #EAF1F0;
  --nebs-warm: #F7F5F2;
  --nebs-border: #E7E4DF;
  --nebs-on-dark: #CBD2D9;
  --nebs-on-dark-muted: #9AA5B1;
  --nebs-on-hero: #E8EDEC;
}

html {
  scroll-behavior: smooth;
}

[v-cloak] {
  display: none;
}

/* Typography: Inter for body, Source Serif 4 for headings.
   Vuetify 3 sets font-family with !important on its text-* classes,
   so these overrides need it too. */

.v-application,
.v-application .text-body-1,
.v-application .text-body-2,
.v-application .text-subtitle-1,
.v-application .text-subtitle-2,
.v-application .v-btn {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

.v-application .text-h1,
.v-application .text-h2,
.v-application .text-h3,
.v-application .text-h4,
.v-application .text-h5,
.v-application .text-h6 {
  font-family: 'Source Serif 4', Georgia, 'Times New Roman', serif !important;
  letter-spacing: -0.01em !important;
}

/* Section backgrounds */

.section-white {
  background-color: #FFFFFF;
}

.section-warm {
  background-color: var(--nebs-warm);
}

.section-dark {
  background-color: var(--nebs-ink);
}

/* Shared text treatments */

.eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--nebs-accent);
}

.eyebrow-on-dark {
  color: var(--nebs-accent-soft);
}

.rule {
  width: 48px;
  height: 2px;
  background: var(--nebs-accent);
}

.lede {
  font-size: 1.125rem;
  line-height: 1.75;
  color: var(--nebs-granite);
}

.lede-on-dark {
  color: var(--nebs-on-dark);
}

.text-ink {
  color: var(--nebs-ink);
}

.measure {
  max-width: 680px;
}

/* Brand mark — a vertical rule with three ascending bars, echoing the Allineare
   parent logo in NEBS teal. Single source: favicon.svg, used as both the page
   icon and the on-page mark. */

.nebs-mark {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.nebs-mark-hero {
  width: 52px;
  height: 52px;
}

.nebs-mark-footer {
  width: 30px;
  height: 30px;
}

/* Hero */

.hero-container {
  position: relative;
}

.hero-lede {
  max-width: 680px;
  font-weight: 400;
  line-height: 1.6;
  color: var(--nebs-on-hero);
}

.hero-scroll {
  position: absolute;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
}

/* Buttons */

.btn-accent {
  background-color: var(--nebs-accent);
  color: #FFFFFF;
}

/* Service cards */

.service-card {
  border: 1px solid var(--nebs-border);
  border-radius: 6px;
  height: 100%;
  transition: border-color 0.2s ease, transform 0.2s ease;
}

.service-card:hover {
  border-color: var(--nebs-accent);
  transform: translateY(-3px);
}

.service-card-copy {
  color: var(--nebs-granite);
  line-height: 1.7;
}

.icon-chip {
  width: 44px;
  height: 44px;
  border-radius: 6px;
  background: var(--nebs-accent-tint);
  display: flex;
  align-items: center;
  justify-content: center;
}

.icon-chip .v-icon {
  color: var(--nebs-accent);
}

/* Credibility facts */

.fact-value {
  color: var(--nebs-accent-soft);
}

.fact-label {
  color: var(--nebs-on-dark-muted);
}

/* Footer */

.v-application .site-footer {
  background-color: var(--nebs-ink-deep);
}

.site-footer-text {
  color: var(--nebs-on-dark-muted);
  line-height: 1.9;
}

.site-footer-text a {
  color: var(--nebs-accent-soft);
}