/* ============================================================
   Allmacht Space — brand & mobile overrides
   Loaded after style.css so these rules win.
   ============================================================ */

/* --- global safety: never allow horizontal scroll on mobile --- */
html, body { overflow-x: hidden; max-width: 100%; }
img, svg, video, iframe { max-width: 100%; height: auto; }
.company-map iframe { width: 100%; border: 0; height: auto; }

/* --- bootstrap-icon sizing to match the template's inline svg icons --- */
.topbar-right li a i,
.topbar-left li a i { margin-right: 6px; vertical-align: -2px; }
.hotline-area .icon i { font-size: 26px; line-height: 1; }
.lang-btn i { font-size: 16px; line-height: 1; display: inline-block; }
.footer-about-text { margin-top: 18px; opacity: .68; max-width: 360px; line-height: 1.7; }

/* --- breadcrumb watermark must never push the page wider --- */
.breadcrumb-section { overflow: hidden; }
.breadcrumb-section .company-name { pointer-events: none; max-width: 100%; }

/* ============================================================
   Mobile
   ============================================================ */
@media (max-width: 991px) {
  .breadcrumb-section .company-name { font-size: 64px; }
}
@media (max-width: 767px) {
  .breadcrumb-section .company-name { font-size: 44px; }
}
@media (max-width: 575px) {
  .breadcrumb-section .company-name { font-size: 34px; }
  .copyright-area p { font-size: 13px; }
}

/* ============================================================
   Homepage hero (overlaid on #home3-banner-bg)
   ============================================================ */
.banner3-section .banner-wrapper.allmacht-hero {
  display: flex;
  align-items: center;
  z-index: 2;
}
.allmacht-hero-content { max-width: 840px; }
.allmacht-hero-content .hero-eyebrow {
  display: inline-block;
  color: #fff;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 26px;
  opacity: .9;
  border: 1px solid rgba(255, 255, 255, .28);
  padding: 9px 18px;
  border-radius: 40px;
}
.allmacht-hero-content h1 {
  color: #fff;
  font-size: 66px;
  line-height: 1.07;
  margin-bottom: 24px;
}
.allmacht-hero-content p {
  color: rgba(255, 255, 255, .82);
  font-size: 18px;
  line-height: 1.7;
  margin-bottom: 36px;
  max-width: 620px;
}
.allmacht-hero-content .hero-btns {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

/* mission badge in the about section (replaces clutch review) */
.about-mission-badge {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 26px;
  border-left: 2px solid rgba(0, 0, 0, .12);
}
.about-mission-badge strong { font-size: 18px; line-height: 1.3; }
.about-mission-badge span { opacity: .65; font-size: 14px; margin-top: 4px; }

@media (max-width: 1199px) {
  .allmacht-hero-content h1 { font-size: 54px; }
}
@media (max-width: 991px) {
  .banner3-section #home3-banner-bg { position: absolute; inset: 0; height: 100% !important; min-height: 100%; }
  .banner3-section .banner-wrapper.allmacht-hero { position: relative; min-height: 580px; padding: 150px 0 80px; }
  .allmacht-hero-content h1 { font-size: 44px; }
}
@media (max-width: 767px) {
  .allmacht-hero-content h1 { font-size: 33px; }
  .allmacht-hero-content p { font-size: 16px; }
  .allmacht-hero-content .hero-eyebrow { font-size: 11px; margin-bottom: 18px; }
  .allmacht-hero-content .hero-btns .primary-btn1,
  .allmacht-hero-content .hero-btns .primary-btn2 { width: 100%; justify-content: center; }
}
@media (max-width: 575px) {
  .allmacht-hero-content h1 { font-size: 28px; }
  .banner3-section .banner-wrapper.allmacht-hero { min-height: 520px; padding: 130px 0 60px; }
}

/* ============================================================
   Homepage capabilities teaser
   ============================================================ */
.capabilities-teaser .cap-head { text-align: center; }
.capabilities-teaser .cap-head h2 { margin-left: auto; margin-right: auto; max-width: 760px; }
.cap-card {
  display: flex; flex-direction: column; height: 100%;
  padding: 42px 34px;
  border: 1px solid rgba(13, 23, 32, .12);
  border-radius: 16px;
  background: #fff;
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.cap-card:hover { transform: translateY(-6px); box-shadow: 0 28px 60px rgba(13, 23, 32, .10); border-color: transparent; }
.cap-card .cap-num { font-size: 13px; letter-spacing: 3px; font-weight: 700; opacity: .35; }
.cap-card h4 { margin: 16px 0 12px; }
.cap-card p { opacity: .7; line-height: 1.75; margin-bottom: 22px; flex: 1 1 auto; }
.cap-card .cap-link { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; }
.cap-card .cap-link svg { transition: transform .3s ease; }
.cap-card:hover .cap-link svg { transform: translate(3px, -3px); }
@media (max-width: 575px) { .cap-card { padding: 30px 24px; } }

/* ============================================================
   Mobile polish — header CTA, counters, spacing, card alignment
   ============================================================ */
@media (max-width: 991px) {
  /* hide the header "Get in Touch" button on mobile (the slide-in menu already has one) */
  .header-area .nav-right .primary-btn2 { display: none !important; }

  /* center & balance the about-section counters (the about image is hidden on mobile) */
  .home3-about-section .counter-and-about-img { justify-content: center; }
  .home3-about-section .counter-wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 26px;
  }
  .home3-about-section .counter-wrap .single-counter { width: auto; justify-content: center; }
  .home3-about-section .about-content { text-align: center; }
  .home3-about-section .btn-and-review { justify-content: center; }
  .home3-about-section .about-mission-badge { border-left: 0; padding-left: 0; align-items: center; text-align: center; }
}
@media (max-width: 767px) {
  /* tighten vertical rhythm between sections on phones */
  .mb-130 { margin-bottom: 60px !important; }
  .mb-100 { margin-bottom: 44px !important; }
  .pt-130 { padding-top: 60px !important; }
  /* center capability card content for a cleaner stacked look */
  .cap-card { align-items: center; text-align: center; }
  .cap-card .cap-link { justify-content: center; }
}