/* ==========================================================
   ebmnt1 — About Us (image + years badge + points + signature)
   ========================================================== */
:root {
  --ebmnt1-about-background-color: var(--ebmnt1-color-helper-white);
  --ebmnt1-about-pattern-color: var(--ebmnt1-color-helper-soft);
  --ebmnt1-about-image-fallback: linear-gradient(150deg, var(--ebmnt1-color-primary), var(--ebmnt1-color-secondary));
  --ebmnt1-about-dots-color: var(--ebmnt1-color-helper-border);
  --ebmnt1-about-years-border-color: var(--ebmnt1-color-primary);
  --ebmnt1-about-years-background-color: var(--ebmnt1-color-helper-white);
  --ebmnt1-about-years-shadow-color: var(--ebmnt1-color-helper-shadow-medium);
  --ebmnt1-about-years-number-color: var(--ebmnt1-color-primary);
  --ebmnt1-about-years-number-font-size: clamp(1.8rem, 1.5rem + 1.4vw, 2.6rem);
  --ebmnt1-about-years-text-color: var(--ebmnt1-color-secondary);
  --ebmnt1-about-years-text-font-size: clamp(1.1rem, 1rem + 0.5vw, 1.4rem);
  --ebmnt1-about-text-color: var(--ebmnt1-color-secondary-soft);
  --ebmnt1-about-text-font-size: clamp(1rem, 0.95rem + 0.25vw, 1.1rem);
  --ebmnt1-about-highlight-color: var(--ebmnt1-color-primary);
  --ebmnt1-about-signature-icon-color: var(--ebmnt1-color-primary);
  --ebmnt1-about-signature-icon-font-size: clamp(2.2rem, 2rem + 1vw, 3rem);
  --ebmnt1-about-signature-name-color: var(--ebmnt1-color-secondary);
  --ebmnt1-about-signature-role-color: var(--ebmnt1-color-helper-muted);
  --ebmnt1-about-signature-name-font-size: clamp(1.05rem, 1rem + 0.3vw, 1.2rem);
  --ebmnt1-about-signature-role-font-size: clamp(0.85rem, 0.8rem + 0.2vw, 0.95rem);
  --ebmnt1-about-media-min-height: clamp(18rem, 70vw, 32rem);
}

.ebmnt1-about {
  background-color: var(--ebmnt1-about-background-color);
  background-image: repeating-radial-gradient(circle at 20% 30%, transparent 0 2.2rem, var(--ebmnt1-about-pattern-color) 2.2rem calc(2.2rem + 1px));
}

.ebmnt1-about__inner {
  align-items: stretch;
  gap: 2.5rem;
}

.ebmnt1-about__media {
  position: relative;
  min-height: var(--ebmnt1-about-media-min-height);
  display: flex;
  background-image: url("../images/about-craftsman.jpg"), var(--ebmnt1-about-image-fallback);
  background-size: cover;
  background-position: center;
}

.ebmnt1-about__dots {
  position: absolute;
  inset-inline-end: -0.75rem;
  bottom: -0.75rem;
  width: 7rem;
  height: 7rem;
  background-image: radial-gradient(var(--ebmnt1-about-dots-color) 2px, transparent 2px);
  background-size: 0.9rem 0.9rem;
}

.ebmnt1-about__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.5rem;
  text-align: start;
}

.ebmnt1-about__years {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.9rem 1.25rem;
  background-color: var(--ebmnt1-about-years-background-color);
  border-inline-start: 3px solid var(--ebmnt1-about-years-border-color);
  box-shadow: 0 0.4rem 1.5rem var(--ebmnt1-about-years-shadow-color);
}

.ebmnt1-about__years-number {
  font-size: var(--ebmnt1-about-years-number-font-size);
  font-weight: 700;
  line-height: 1;
  color: var(--ebmnt1-about-years-number-color);
}

.ebmnt1-about__years-text {
  font-size: var(--ebmnt1-about-years-text-font-size);
  font-weight: 500;
  color: var(--ebmnt1-about-years-text-color);
}

.ebmnt1-about__text {
  font-size: var(--ebmnt1-about-text-font-size);
  line-height: 1.95;
  color: var(--ebmnt1-about-text-color);
}

.ebmnt1-about__highlight {
  color: var(--ebmnt1-about-highlight-color);
  background: none;
  font-weight: 600;
}

.ebmnt1-about__points {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.ebmnt1-about__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.5rem;
}

.ebmnt1-about__signature {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.ebmnt1-about__signature-icon {
  font-size: var(--ebmnt1-about-signature-icon-font-size);
  color: var(--ebmnt1-about-signature-icon-color);
}

.ebmnt1-about__signature-text {
  display: flex;
  flex-direction: column;
  line-height: 1.4;
}

.ebmnt1-about__signature-name {
  font-size: var(--ebmnt1-about-signature-name-font-size);
  font-weight: 700;
  color: var(--ebmnt1-about-signature-name-color);
}

.ebmnt1-about__signature-role {
  font-size: var(--ebmnt1-about-signature-role-font-size);
  color: var(--ebmnt1-about-signature-role-color);
}

@media (min-width: 1024px) {
  .ebmnt1-about__inner {
    flex-direction: row;
    align-items: center;
    gap: 4rem;
  }

  .ebmnt1-about__media { flex: 0 0 42%; align-self: stretch; }
}
