/* Scoped brand styles for rs-beveiliging (Tailwind v4 compatible). */
/* Let Tailwind's core be provided by globals.css; this file only adds brand classes. */

/* Typography helpers */
html[data-tenant='rs-beveiliging'] .rs-hero {
  font-size: clamp(3rem, 8vw + 1rem, 9.875rem);
  letter-spacing: 0;
  line-height: 1;
  font-weight: normal;
  color: #000000;
}
html[data-tenant='rs-beveiliging'] .rs-h1 {
  font-size: clamp(2rem, 4vw + 1rem, 4.5rem);
  letter-spacing: 0;
  line-height: 1;
  font-weight: normal;
  color: #000000;
}
html[data-tenant='rs-beveiliging'] .rs-h2 {
  font-size: clamp(1.75rem, 3vw + 0.5rem, 3.5rem);
  letter-spacing: 0;
  line-height: 1.1;
  font-weight: normal;
  color: #000000;
}
html[data-tenant='rs-beveiliging'] .rs-h3 {
  font-size: clamp(1.5rem, 2vw + 0.5rem, 2.5rem);
  letter-spacing: 0;
  line-height: 1.2;
  font-weight: normal;
  color: #f28d03; /* brand orange */
}
html[data-tenant='rs-beveiliging'] .rs-body {
  font-size: clamp(1rem, 1vw + 0.25rem, 1.125rem);
  letter-spacing: 0;
  line-height: 1.4;
}

/* Layout helpers */
html[data-tenant='rs-beveiliging'] .rs-content-width {
  max-width: 1340px;
  margin-left: auto;
  margin-right: auto;
}
html[data-tenant='rs-beveiliging'] .rs-section-spacing {
  margin-top: 70px;
  margin-bottom: 70px;
}
html[data-tenant='rs-beveiliging'] .rs-section-spacing-top {
  margin-top: 70px;
}
html[data-tenant='rs-beveiliging'] .rs-section-spacing-bottom {
  margin-bottom: 70px;
}

/* Buttons */
html[data-tenant='rs-beveiliging'] .rs-btn-primary {
  background-color: #f28d03;
  color: #ffffff;
  border-radius: var(--button-radius);
}
html[data-tenant='rs-beveiliging'] .rs-btn-primary:hover {
  background-color: #d67a02;
}

html[data-tenant='rs-beveiliging'] .rs-btn-secondary {
  background-color: #dee9ec;
  color: #000000;
  border: 2px solid #dee9ec;
  border-radius: var(--button-radius);
}
html[data-tenant='rs-beveiliging'] .rs-btn-secondary:hover {
  background-color: #d0dde1;
  border-color: #d0dde1;
}

html[data-tenant='rs-beveiliging'] .rs-btn-outline {
  background-color: transparent;
  color: #f28d03;
  border: 2px solid #f28d03;
  border-radius: var(--button-radius);
}
html[data-tenant='rs-beveiliging'] .rs-btn-outline:hover {
  background-color: #f28d03;
  color: #ffffff;
}

/* Utilities */
html[data-tenant='rs-beveiliging'] .mix-blend-linear-burn {
  mix-blend-mode: linear-burn;
}
html[data-tenant='rs-beveiliging'] .blur-400 {
  filter: blur(400px);
}

/* Hero RichText inheritance helpers */
html[data-tenant='rs-beveiliging'] .rs-hero .payload-richtext h1,
html[data-tenant='rs-beveiliging'] .rs-hero .payload-richtext h2,
html[data-tenant='rs-beveiliging'] .rs-hero .payload-richtext h3,
html[data-tenant='rs-beveiliging'] .rs-hero .payload-richtext h4 {
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
}

/* Links */
html[data-tenant='rs-beveiliging'] .rs-link {
  color: #f28d03;
  text-decoration: none;
}
html[data-tenant='rs-beveiliging'] .rs-link:hover {
  color: #d67a02;
  text-decoration: underline;
}

/* Badges */
html[data-tenant='rs-beveiliging'] .rs-badge {
  background-color: rgba(242, 141, 3, 0.12);
  color: #3d2a00;
  border: 1px solid #f28d03;
  border-radius: 9999px;
  padding: 0.25rem 0.6rem;
  font-weight: 600;
}

/* Card accents */
html[data-tenant='rs-beveiliging'] .rs-card-brand {
  border-color: #f28d03;
}
html[data-tenant='rs-beveiliging'] .rs-card-accent {
  outline: 2px solid #f28d03;
  outline-offset: 2px;
}

/* Generic brand bg/text helpers */
html[data-tenant='rs-beveiliging'] .rs-accent-bg {
  background-color: #f28d03;
  color: #ffffff;
}
html[data-tenant='rs-beveiliging'] .rs-accent-text {
  color: #f28d03;
}

/* Hero CTA button styles */
html[data-tenant='rs-beveiliging'] .rs-hero-btn-primary {
  background-color: #ffffff;
  color: #f28d03;
  border: 2px solid #ffffff;
  border-radius: var(--button-radius) !important;
}
html[data-tenant='rs-beveiliging'] .rs-hero-btn-primary:hover {
  background-color: #f3f4f6; /* gray-100 */
}

html[data-tenant='rs-beveiliging'] .rs-hero-btn-outline {
  background-color: transparent;
  color: #ffffff;
  border: 2px solid #ffffff;
  border-radius: var(--button-radius) !important;
}
html[data-tenant='rs-beveiliging'] .rs-hero-btn-outline:hover {
  background-color: #ffffff;
  color: #f28d03;
}