/* ── ABOUT ────────────────────────────── */
#about { background: #0D0D0D; }
.about-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center;
}
.about-visual {
  position: relative; height: 460px;
}
.about-img-main {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(242,68,5,0.15) 0%, rgba(89,25,2,0.2) 100%);
  border: 1px solid rgba(242,68,5,0.2); border-radius: 20px;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.about-pattern {
  width: 100%; height: 100%;
  background-image:
    repeating-linear-gradient(45deg, rgba(242,68,5,0.04) 0px, rgba(242,68,5,0.04) 1px, transparent 1px, transparent 40px),
    repeating-linear-gradient(-45deg, rgba(242,68,5,0.04) 0px, rgba(242,68,5,0.04) 1px, transparent 1px, transparent 40px);
  display: flex; align-items: center; justify-content: center;
}
.about-center-icon {
  width: 100px; height: 100px; background: var(--primary-color);
  border-radius: 24px; display: flex; align-items: center; justify-content: center;
  font-family: 'Playfair Display', serif; font-weight: 900; font-size: 44px; color: #fff;
}
.about-badge-float {
  position: absolute; bottom: 32px; right: -24px;
  background: #1a1a1a; border: 1px solid rgba(255,255,255,0.1);
  border-radius: 14px; padding: 16px 20px;
  display: flex; align-items: center; gap: 12px;
}
.about-badge-icon {
  width: 40px; height: 40px; background: rgba(242,68,5,0.15);
  border-radius: 10px; display: flex; align-items: center; justify-content: center;
  font-size: 20px;
}
.about-badge-text strong { display: block; font-size: 15px; font-weight: 600; }
.about-badge-text span { font-size: 12px; color: rgba(255,255,255,0.4); }

.about-features { display: flex; flex-direction: column; gap: 20px; margin-top: 36px; }
.about-feat {
  display: flex; gap: 16px; align-items: flex-start;
  padding: 20px; border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.02);
  transition: border-color 0.2s, background 0.2s;
}
.about-feat:hover { border-color: rgba(242,68,5,0.25); background: rgba(242,68,5,0.04); }
.about-feat-icon {
  width: 42px; height: 42px; border-radius: 10px;
  background: rgba(242,68,5,0.12); display: flex; align-items: center; justify-content: center;
  font-size: 18px; flex-shrink: 0;
}
.about-feat h4 { font-size: 15px; font-weight: 600; margin-bottom: 4px; }
.about-feat p { font-size: 14px; color: rgba(255,255,255,0.5); line-height: 1.5; }

@media (max-width: 1100px) {
  .about-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .about-badge-float { right: 0; }
}