/* Auto-generated theme for trimtech.ie — IP-safe scoped overrides.
 * Source: theme-extractor.js from live site computed styles.
 * Regenerate via: node lib/theme-generator.js trimtech.ie
 */

:root {
  --font-heading: "Bai Jamjuree", "Montserrat", sans-serif;
  --font-body: "Kumbh Sans", "Open Sans", sans-serif;
  --font-nav: "Helvetica Neue", "Bai Jamjuree", "Montserrat", sans-serif;
  --font-button: "Arial", "Bai Jamjuree", "Montserrat", sans-serif;

  --color-primary: #b573df;
  --color-accent: #b573df;
  --color-text: #ffffff;
  --color-heading: #b573df;
  --color-background: #000000;
  --color-header-bg: #000000;
  --color-footer-bg: #000000;
  --color-card-bg: #000000;
  --color-button-bg: #b573df;
  --color-button-text: #000000;
  --color-nav-link: #b573df;
  --color-topbar-bg: #000000;
  --color-topbar-text: #ffffff;
  --size-header-height: 189px;
  --size-logo-height: 94px;
  --size-logo-width: 233px;

  --size-h1: 50px;
  --size-h2: 31px;
  --size-h3: 22px;
  --size-body: 16px;
  --size-button: 10px;
  --size-nav: 13px;

  --weight-heading: 700;
  --weight-body: 400;
}

/* !important is used throughout to beat Astro's component-scoped selectors,
 * which have higher specificity than global rules targeting the same class.
 * Long-term fix is to have components consume these vars directly; this
 * is the bridge until that refactor lands.
 */

body {
  font-family: var(--font-body) !important;
  font-size: var(--size-body) !important;
  color: var(--color-text) !important;
  background: var(--color-background) !important;
}

.header { background: var(--color-header-bg) !important; }
.header__inner { min-height: 189px !important; }
.header__logo img {
  height: 94px !important;
  width: 233px !important;
  max-width: 100% !important;
}
.header__link,
.header__link > span,
.header__link > span > span {
  font-family: var(--font-nav) !important;
  font-size: var(--size-nav) !important;
  font-weight: 400 !important;
  color: #b573df !important;
  text-transform: uppercase !important;
  letter-spacing: normal !important;
}

/* Top strip (pinnedTopCenter) — brand/contact strip above the main header.
 * Sticky-to-top mirrors Wix's pinned layer behaviour. */
.topbar {
  position: sticky !important;
  top: 0 !important;
  z-index: 200 !important;
  border-bottom: 2px solid var(--color-primary) !important;
}
.topbar { background-color: #000000 !important; }
.topbar, .topbar__item, .topbar__social-link, .topbar__social-link svg { color: #ffffff !important; fill: #ffffff !important; }
.topbar__inner { min-height: 58px !important; }

/* FAQ question/answer colours */
.faq__heading { color: var(--color-heading) !important; }
.faq__question,
.faq__question span,
.faq__question > * {
  color: var(--color-heading) !important;
  font-family: var(--font-heading) !important;
}
.faq__answer,
.faq__answer p {
  color: var(--color-text) !important;
  font-family: var(--font-body) !important;
}
.faq {
  background: var(--color-background) !important;
}

.hero {
  background: var(--color-background) !important;
}
.hero__heading {
  font-family: var(--font-heading) !important;
  font-size: var(--size-h1) !important;
  font-weight: var(--weight-heading) !important;
  color: var(--color-heading) !important;
}
.hero__subtext {
  font-family: var(--font-body) !important;
  color: var(--color-text) !important;
}

.about__heading,
.services__heading,
.info-cards__heading,
.faq__heading,
.testimonials__heading,
.cta-strip__heading {
  font-family: var(--font-heading) !important;
  color: var(--color-heading) !important;
}

.services__title,
.info-cards__title {
  font-family: var(--font-heading) !important;
  color: var(--color-heading) !important;
}

.about__text,
.services__desc,
.info-cards__text,
.faq__answer,
.testimonials__quote,
.cta-strip__text {
  font-family: var(--font-body) !important;
  color: var(--color-text) !important;
}

.hero__button,
.cta-strip__button,
.header__cta,
.services__card--overlay,
.about__button {
  font-family: var(--font-button) !important;
  background-color: var(--color-button-bg) !important;
  color: var(--color-button-text) !important;
}

.services__card,
.info-cards__card {
  border-top-color: var(--color-primary) !important;
  background-color: var(--color-card-bg) !important;
}
.services__arrow,
.info-cards__arrow {
  color: var(--color-primary) !important;
}

.footer {
  background: var(--color-footer-bg) !important;
  font-family: var(--font-body) !important;
}

/* Sections inherit site background */
.about, .services, .info-cards, .faq, .testimonials, .cta-strip, .gallery {
  background: var(--color-background) !important;
}