/**
 * About Us — kill white header/breadcrumb bleed and lock a dark canvas.
 */

body.page-id-about-us .page-header,
body.page-template-about .entry-header,
body.about-us-page .breadcrumb-wrap,
body.page-slug-about-us .ast-breadcrumbs-wrapper,
body.page-slug-about-us .page-title-bar,
body.page-slug-about-us .site-content .entry-header,
body.page-slug-about-us .page-header,
body.page-slug-about-us .entry-header,
body.page-slug-about-us .breadcrumb-page,
body.page-slug-about-us .tbay-breadcrumb,
body.page-slug-about-us .breadcrumbs-page {
  background-color: #0b1118 !important;
  background: #0b1118 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}

body.page-id-about-us .breadcrumb,
body.page-id-about-us .breadcrumbs,
body.page-id-about-us .woocommerce-breadcrumb,
body.page-id-about-us header.entry-header,
body.page-slug-about-us .breadcrumb,
body.page-slug-about-us .breadcrumbs,
body.page-slug-about-us .woocommerce-breadcrumb,
body.page-slug-about-us .breadcrumb-page,
body.page-slug-about-us .breadcrumbs-page,
body.page-slug-about-us .tbay-breadcrumb,
body.page-slug-about-us header.entry-header,
body.page-slug-about-us .page-header,
body.page-slug-about-us .entry-header,
body.page-slug-about-us .page-title,
body.page-slug-about-us .entry-title,
body.page-slug-about-us .ast-breadcrumbs-wrapper,
body.page-slug-about-us .page-title-bar {
  display: none !important;
}

html.dark-mode body.page-id-about-us #primary,
html.dark-mode body.page-id-about-us #main,
html.dark-mode body.page-id-about-us .site-main,
html.dark-mode body.page-id-about-us .elementor,
html.autx-theme-dark body.page-slug-about-us #primary,
html.autx-theme-dark body.page-slug-about-us #main,
html.autx-theme-dark body.page-slug-about-us .site-main,
body.dark-mode.page-slug-about-us #primary,
body.dark-mode.page-slug-about-us #main,
body.dark-mode.page-slug-about-us .site-main,
body.page-id-about-us #primary,
body.page-id-about-us #main,
body.page-id-about-us .site-main,
body.page-id-about-us .elementor,
body.page-slug-about-us #primary,
body.page-slug-about-us #main,
body.page-slug-about-us .site-main,
body.page-slug-about-us .elementor,
body.page-slug-about-us #tbay-main-content,
body.page-slug-about-us #main-container,
body.page-slug-about-us #main-content,
body.page-slug-about-us .site-content,
body.page-slug-about-us .content-area,
body.page-slug-about-us #autx-native-main,
body.page-slug-about-us.autx-native-page #autx-native-main,
body.page-slug-about-us .entry-content {
  background: #0b1118 !important;
  background-color: #0b1118 !important;
  color: #e2e8f0 !important;
}

body.page-slug-about-us #tbay-main-content,
body.page-slug-about-us #main-container {
  min-height: 0 !important;
  padding-bottom: 0 !important;
}

.autx-about {
  --about-bg: #0b1118;
  display: block;
  width: 100%;
  max-width: 100%;
  color: #e2e8f0;
  background: #0b1118;
  font-family: var(--autx-font, "Segoe UI", "Noto Sans", sans-serif);
  line-height: 1.65;
}

.autx-about__hero {
  padding: clamp(2.2rem, 5vw, 3.6rem) 0 1.4rem;
  background:
    radial-gradient(900px 320px at 8% -20%, rgba(0, 136, 176, 0.18), transparent 60%),
    linear-gradient(180deg, #0b1118 0%, rgba(17, 24, 39, 0.55) 100%);
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.autx-about .autx-page__inner,
.autx-about__hero .autx-page__inner,
.autx-about__body {
  max-width: 1120px;
  margin-left: auto;
  margin-right: auto;
}

.autx-about__hero .autx-page__inner {
  display: block !important;
  grid-template-columns: none !important;
}

.autx-about__hero .autx-page__title {
  color: #f8fafc;
}

.autx-about__hero .autx-page__lead {
  max-width: 46rem;
  color: #cbd5e1;
}

.autx-about__body {
  padding: 1.5rem 30px 4.5rem;
}

.autx-about__intro,
.autx-about__presence {
  margin: 0 0 1.75rem;
  padding: 1.3rem 1.4rem 1.25rem;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 16px;
  background: rgba(17, 24, 39, 0.72);
}

.autx-about h2 {
  margin: 0 0 0.75rem;
  font-size: clamp(1.2rem, 2.2vw, 1.5rem);
  color: #f8fafc;
}

.autx-about__intro p,
.autx-about__presence p,
.autx-about__card p,
.autx-about__card li {
  margin: 0 0 0.7rem;
  color: #cbd5e1;
  font-size: 0.98rem;
}

.autx-about__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 0.85rem;
}

.autx-about__card {
  grid-column: span 12;
  padding: 1.2rem 1.2rem 1.15rem;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 16px;
  background: rgba(17, 24, 39, 0.72);
  box-shadow: 0 16px 36px -28px rgba(0, 0, 0, 0.8);
}

@media (min-width: 760px) {
  .autx-about__card {
    grid-column: span 6;
  }
}

@media (min-width: 1100px) {
  .autx-about__card:nth-child(-n + 3) {
    grid-column: span 4;
  }
  .autx-about__card:nth-child(n + 4) {
    grid-column: span 6;
  }
}

.autx-about__icon {
  display: inline-flex;
  width: 2.4rem;
  height: 2.4rem;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.55rem;
  border-radius: 10px;
  background: rgba(0, 136, 176, 0.14);
  font-size: 1.15rem;
}

.autx-about__card h3 {
  margin: 0 0 0.45rem;
  color: #f8fafc;
  font-size: 1.12rem;
}

.autx-about__card ul {
  margin: 0.35rem 0 0.9rem;
  padding-left: 1.15rem;
}

.autx-about[dir="rtl"] .autx-about__card ul {
  padding-left: 0;
  padding-right: 1.15rem;
}

.autx-about__offices {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

@media (min-width: 700px) {
  .autx-about__offices {
    grid-template-columns: 1fr 1fr;
  }
}

.autx-about__offices h3 {
  margin: 0 0 0.35rem;
  color: #67e8f9;
  font-size: 1rem;
}

.autx-about__offices a {
  color: #67e8f9;
}

.autx-about__note {
  margin-top: 1rem !important;
  font-size: 0.92rem !important;
}

.autx-about[lang="ar"],
.autx-about[lang="ur"] {
  direction: rtl;
  text-align: right;
}

.autx-about[lang="ml"] {
  font-family: "Noto Sans Malayalam", "Noto Sans", "Segoe UI", sans-serif;
}

.autx-about[lang="hi"] {
  font-family: "Noto Sans Devanagari", "Noto Sans", "Segoe UI", sans-serif;
}

.autx-about[lang="ar"] {
  font-family: "Noto Naskh Arabic", Tahoma, "Segoe UI", sans-serif;
}

.autx-about[lang="ur"] {
  font-family: "Noto Nastaliq Urdu", "Noto Naskh Arabic", Tahoma, "Segoe UI", sans-serif;
}

html[data-autx-theme="light"] body.page-slug-about-us #tbay-main-content,
html[data-autx-theme="light"] body.page-slug-about-us #main-container,
html.light-mode body.page-slug-about-us #tbay-main-content,
html.light-mode body.page-slug-about-us #main-container {
  background-color: #f8f9fa !important;
  color: #0f172a !important;
}

html[data-autx-theme="light"] .autx-about,
html.light-mode .autx-about {
  color: #0f172a;
  background: #f8f9fa;
}

html[data-autx-theme="light"] .autx-about__hero,
html.light-mode .autx-about__hero {
  background:
    radial-gradient(900px 320px at 8% -20%, rgba(0, 136, 176, 0.1), transparent 60%),
    linear-gradient(180deg, #f8f9fa 0%, #eef2ff 100%);
  border-bottom-color: #e2e8f0;
}

html[data-autx-theme="light"] .autx-about__hero .autx-page__title,
html.light-mode .autx-about__hero .autx-page__title,
html[data-autx-theme="light"] .autx-about h2,
html.light-mode .autx-about h2,
html[data-autx-theme="light"] .autx-about__card h3,
html.light-mode .autx-about__card h3 {
  color: #0f172a;
}

html[data-autx-theme="light"] .autx-about__intro,
html[data-autx-theme="light"] .autx-about__presence,
html[data-autx-theme="light"] .autx-about__card,
html.light-mode .autx-about__intro,
html.light-mode .autx-about__presence,
html.light-mode .autx-about__card {
  background: #ffffff;
  border-color: #e2e8f0;
}

html[data-autx-theme="light"] .autx-about__intro p,
html[data-autx-theme="light"] .autx-about__presence p,
html[data-autx-theme="light"] .autx-about__card p,
html[data-autx-theme="light"] .autx-about__card li,
html[data-autx-theme="light"] .autx-about__hero .autx-page__lead,
html.light-mode .autx-about__intro p,
html.light-mode .autx-about__presence p,
html.light-mode .autx-about__card p,
html.light-mode .autx-about__card li,
html.light-mode .autx-about__hero .autx-page__lead {
  color: #334155;
}

@media screen and (max-width: 768px) {
  .autx-about__body {
    padding: 1.1rem 16px 5.5rem;
  }

  .autx-about__card,
  .autx-about__intro,
  .autx-about__presence {
    padding: 1rem 0.95rem 0.95rem;
  }
}
