/* ===== General Styles ===== */
body {
  margin: 0;
  font-family: 'Segoe UI', sans-serif;
  background: #f8f9fa;
  color: #333;
}

main {
  padding: 100px 10px 10px;
  max-width: 1800px;
  margin: auto;
}

h1, h2 {
  color: #004aad;
}

/* ===== Header Styling ===== */
header {
  background: linear-gradient(90deg, #004aad, #0066cc);
  color: #fff;
  padding: 15px 30px;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1000;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15);
}

nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1200px;
  margin: auto;
}

nav .logo {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 1.4rem;
  font-weight: bold;
}

nav .logo img {
  height: 70px;
  width: auto;
}
.logo-text h1 {
  font-size: 20px; /* Company name */
  margin: 0;
  font-family: 'Segoe UI';
  background: linear-gradient(90deg, #ffffff, #ffffff, #ffffff);
  background-size: 200% auto;
  animation: shine 2s linear infinite;
  display: inline-block;
  position: relative;
}
.logo-text h1 {
  font-size: 20px; /* Company name */
  margin: 0;
  font-family: 'Segoe UI';
  background: linear-gradient(90deg, #ffffff, #ffffff, #ffffff);
  background: linear-gradient(90deg, #ffffff, #ffffff, #ffffff);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shine 2s linear infinite;
  display: inline-block;
  position: relative;
}



/* ===== Navigation ===== */
nav ul {
  display: flex;
  list-style: none;
  gap: 25px;
  margin: 0;
  padding: 0;
}

nav a {
  position: relative;
  color: #fff;
  text-decoration: none;
  font-weight: 500;
  font-size: 1rem;
  cursor: pointer;
  transition: color 0.3s ease;
  padding: 5px 0;
}

nav a::after {
  content: "";
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 0;
  height: 2px;
  background: #edecea;
  transition: width 0.3s ease;
}

nav a:hover {
  color: #faf4f4;
}

nav a:hover::after {
  width: 100%;
}


/* ===== Grid Section ===== */
.grid-section {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  margin-bottom: 40px;
}

@media(min-width:600px){
  .grid-section {
    grid-template-columns: repeat(2,1fr);
  }
}

.grid-card {
  background: #fff;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.grid-card h3 {
  margin-top: 0;
}

ul.benefits {
  list-style: disc;
  padding-left: 20px;
}

/* ===== Carousel ===== */
.carousel-container {
  overflow-x: auto;        /* real scroll */
  scroll-behavior: smooth; /* smooth manual scrolling */
  -webkit-overflow-scrolling: touch;
  width: 120%;
  position: relative;
  white-space: nowrap;     /* keep items inline */
}

.carousel-track {
  display: inline-flex;
  gap: 20px;
}

.talent-card {
  flex: 0 0 auto;
  width: 200px;
  background: #fff;
  border-radius: 12px;
  text-align: center;
  padding: 20px;
  box-shadow: 0 8px 28px rgba(0,0,0,0.25);
}
.talent-card img {
  max-width: 100%;
  border-radius: 8px;
  margin-bottom: 12px;
}

@keyframes scrollLoop {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ===== Accordion ===== */
.accordion-header {
  background: #eee;
  padding: 12px;
  border: none;
  width: 100%;
  text-align: left;
  cursor: pointer;
  font-size: 1.05rem;
  font-weight: 500;
  margin-top: 10px;
}

.accordion-content {
  display: none;
  padding: 12px;
  background: #f9f9f9;
}

.accordion-content.show {
  display: block;
}

/* ===== Forms ===== */
form input,
form textarea {
  width: 100%;
  margin: 10px 0;
  padding: 12px;
  font-size: 1rem;
  border: 1px solid #ccc;
  border-radius: 5px;
}

form button {
  background: #004aad;
  color: #fff;
  border: none;
  padding: 12px 20px;
  cursor: pointer;
  font-size: 1rem;
  border-radius: 5px;
}

form button:hover {
  background: #00307a;
}




/**
 * Swiper 11.2.10
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2025 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: June 28, 2025
 */

@font-face{font-family:swiper-icons;src:url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:'';position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:var(--swiper-navigation-top-offset,50%);width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size)/ 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important}.swiper-button-next svg,.swiper-button-prev svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-next svg,.swiper-rtl .swiper-button-prev svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset,10px);right:auto}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-lock{display:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:'next'}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom,8px);top:var(--swiper-pagination-top,auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius,50%);background:var(--swiper-pagination-bullet-inactive-color,#000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{right:var(--swiper-pagination-right,8px);left:var(--swiper-pagination-left,auto);top:50%;transform:translate3d(0px,-50%,0)}.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0;display:block}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color,inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color,rgba(0,0,0,.25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size,4px);left:0;top:0}.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar{width:var(--swiper-pagination-progressbar-size,4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius,10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color,rgba(0,0,0,.1))}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset,1%);bottom:var(--swiper-scrollbar-bottom,4px);top:var(--swiper-scrollbar-top,auto);z-index:50;height:var(--swiper-scrollbar-size,4px);width:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar.swiper-scrollbar-vertical,.swiper-vertical>.swiper-scrollbar{position:absolute;left:var(--swiper-scrollbar-left,auto);right:var(--swiper-scrollbar-right,4px);top:var(--swiper-scrollbar-sides-offset,1%);z-index:50;width:var(--swiper-scrollbar-size,4px);height:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color,rgba(0,0,0,.5));border-radius:var(--swiper-scrollbar-border-radius,10px);left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active{pointer-events:auto}.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}

/* Blue Dot Background */
body {
  margin: 0;
  background-color: #150bf9; /* fallback */ /* fallback */
  background-image: radial-gradient(circle, rgb(239, 242, 245) 18px, transparent 110px);
  background-size: 40px 40px; /* controls spacing of dots */
  position: relative;
  overflow-x: hidden;
  animation: moveDots 13s linear infinite; /* animate background */
}

/* Animate background position for shimmer effect */
@keyframes moveDots {
  0%   { background-position: 0 0; }
  50%  { background-position: 50px 50px; }
  100% { background-position: 0 0; }
}

/* Shimmer Glow Following Cursor */
body::before {
  content: "";
  position: fixed;
  top: var(--y, 50%);
  left: var(--x, 50%);
  width: 400px;
  height: 400px;
  border-radius: 100%;
  pointer-events: none;
  background: radial-gradient(circle, rgba(0,90,555,0.1) 0%, transparent 70%);
  transform: translate(-50%, -50%);
  transition: top 0.15s ease-out, left 0.15s ease-out;
  z-index: 0;
}

/* Push all content above background + shimmer */
main, header, footer {
  position: relative;
  z-index: 1;
}


.about-section {
  padding: 80px 20px;
  background: rgba(249, 250, 251, 0);
}

.about-section .container {
  max-width: 1200px;
  margin: 0 auto;
}

.about-section .grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}

.about-section .content h2 {
  font-size: 2rem;
  color: #004aad;
  margin: 10px 0;
}

.about-section .content p {
  font-size: 1.1rem;
  color: #333;
  line-height: 1.6;
}

.badge {
  display: inline-block;
  background: rgb(230, 240, 255);
  color: #004aad;
  font-size: 0.9rem;
  padding: 6px 12px;
  border-radius: 20px;
  font-weight: 600;
}

.stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin-top: 30px;
}

.stat .number {
  font-size: 2rem;
  font-weight: bold;
  color: #004aad;
}

.stat .label {
  font-size: 0.9rem;
  color: #666;
}

.expertise {
  margin-top: 40px;
}

.expertise h3 {
  font-size: 1.3rem;
  margin-bottom: 15px;
  color: #004aad;
}

.tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.tag {
  display: inline-block;
  padding: 6px 12px;
  border: 1px solid #004aad;
  border-radius: 20px;
  font-size: 0.85rem;
  color: #004aad;
  background: #fff;
}

.images {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.images img {
  width: 100%;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  object-fit: cover;
}

.images .col {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.images .col.offset {
  padding-top: 40px;
}


.stats-box {
  background: rgba(51, 107, 182, 0.51);
  border-radius: 16px;
  padding: 40px;
  margin: 60px 0;
  text-align: center;
}
.stats-box h3 {
  font-size: 1.8rem;
  color: #0d00ff;
  margin-bottom: 30px;
}
.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 30px;
}
.stat .number {
  font-size: 2rem;
  font-weight: bold;
  color: #0d00ff;
}
.stat .label {
  font-weight: 600;
}
.stat .desc {
  font-size: 0.9rem;
  color: #666;
}

.core-values {
  margin: 60px 0;
  text-align: center;
}
.values-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
  margin-top: 30px;
}
.value-card {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 20px #004aad;
  padding: 20px;
}
.value-card .icon {
  font-size: 2rem;
  margin-bottom: 10px;
  color: #004aad;
}
.value-card h4 {
  margin-bottom: 8px;
  color: #004aad;
}


/* Leadership Carousel */
.carousel-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}

.carousel-container {
  overflow: hidden;
  width: 100%;
}

.carousel-track {
  display: flex;
  gap: 20px;
  transition: transform 0.5s ease;
}

.leader-card {
  max-width: 200px;
  margin: 0 5px;
  background: #fff;
  border-radius: 12px;
  padding: 5px;
  box-shadow: 0 40px 20px #004aad;
  text-align: center;
}

.leader-card .avatar {
  width: 200px;
  height: 250px;
  margin: 0 auto 5px;
  border-radius: 0%;
  overflow: hidden;
  border: 5px solid   rgba(255, 255, 255, 0);
}

.leader-card .avatar img {
  width: 100%;
  height: 100%;
  object-fit: scale-up;
}

/* arrows */
.carousel-btn {
  background: #004aad;
  color: #fff;
  border: none;
  font-size: 2rem;
  cursor: pointer;
  padding: 10px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
}

.carousel-btn.prev { left: -40px; }
.carousel-btn.next { right: -40px; }

/* dots */
.carousel-dots {
  text-align: center;
  margin-top: 15px;
}

.carousel-dots button {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: none;
  margin: 0 5px;
  background: #ccc;
  cursor: pointer;
}

.carousel-dots button.active {
  background: #004aad;
}

.tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.tag {
  border: 1px solid #004aad;
  color: #004aad;
  padding: 6px 12px;
  border-radius: 20px;
  font-size: 0.9rem;
  background: #fff;
}
.awards ul {
  list-style: none;
  padding: 0;
}
.awards li {
  margin: 8px 0;
  padding-left: 15px;
  position: relative;
  font-size: 0.95rem;
  color: #555;
}
.awards li::before {
  content: "•";
  color: #004aad;
  position: absolute;
  left: 0;
}
}

header {
  background: #004aad; /* dark blue header background */
  padding: 10px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

header nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.logo {
  display: flex;
  align-items: center;
}

.logo img {
  height: 50px;
  margin-right: 15px;
}

.logo-text h1.busname {
  font-size: 20px;
  margin: 0;
  color: #fff; /* ✅ makes text visible */
  font-weight: bold;
}
.comparison-column ul {
  list-style: none;   /* removes bullets */
  padding: 0;
  margin: 0;
}

.comparison-column li {
  margin: 10px 0;
  font-size: 16px;
  display: flex;
  align-items: center;
}

.comparison-column .icon {
  margin-right: 8px;
  font-weight: bold;
}

.comparison-column .icon:contains("✖️"),
.comparison-column .icon.red {
  color: red;   /* make X red */
}

.comparison-column .icon:contains("✔️"),
.comparison-column .icon.green {
  color: green; /* optional: make checkmarks green */
}

/*service categories*/
.highlights-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 30px;
  padding: 20px 0;
}

.highlight-item {
  perspective: 1200px;
}

.card {
  width: 100%;
  min-height: 250px;
  max-height: none; /* allow expansion */
  position: relative;
  transform-style: preserve-3d;
  transition: transform 0.8s ease;
  cursor: pointer;
}

.card:hover {
  transform: rotateX(180deg) scale(1.4); /* zoom slightly */
}

.front, .back {
  position: absolute;
  width: 100%;
  min-height: 250px;
  padding: 15px;
  border-radius: 15px;
  backface-visibility: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 20px rgba(0,0,0,0.2);
}

.back {
  background: linear-gradient(135deg, #004aad, #0066ff);
  color: #fff;
  transform: rotateY(180deg);
  text-align: center;
  flex-wrap: wrap; /* allow subcategories to wrap */
}

.subcategories-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 15px;
  margin-top: 20px;
  width: 100%;
  opacity: 1; /* always visible */
  transform: translateY(0); /* no animation hiding them */
}
}

.card:hover .subcategories-grid {
  opacity: 1;
  transform: translateY(0);
}

.subcat {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: rgba(255,255,255,0.1);
  border-radius: 10px;
  padding: 10px;
  transition: transform 0.3s ease, background 0.3s ease;
}

.subcat i {
  font-size: 24px;
  margin-bottom: 5px;
}

.subcat span {
  font-size: 14px;
  text-align: center;
}

.subcat:hover {
  background-color: rgba(255,255,255,0.2);
  transform: scale(1.1);
}

/*modal*/
/* Modal Styles */
.modal {
  display: none; 
  position: fixed; 
  z-index: 10000; 
  left: 0; top: 0;
  width: 100%; height: 100%; 
  overflow: auto; 
  background-color: rgba(0,0,0,0.6);
}

.modal-content {
  background-color: #fff;
  margin: 10% auto; 
  padding: 20px;
  border-radius: 12px;
  max-width: 500px;
  text-align: center;
}

.modal-content h3 { color: #004aad; margin-bottom: 15px; }
.modal-content p { color: #333; }

.modal .close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
}

.modal .close:hover { color: #000; }
/* 4 cards in 1 row */
.highlights {
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap; /* allows wrapping on smaller screens */
}

/*testimonials*/
.testimonial-row {
  display: flex;
  justify-content: right;
  gap: 100px;
  flex-wrap: wrap;
  margin-top: 20px;
}

.testimonial-card {
  flex: 1 1 45%;
  max-width: 800px;
  text-align: center;
}

.video-wrapper {
  position: relative;
  width: 100%;
  padding-top: 0%; /* 16:9 aspect ratio */
  border-radius: 12px;
  overflow: hidden;
  background: rgba(0, 0, 0, 0); /* fallback for unloaded video */
}

.video-wrapper iframe {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
}

.video-overlay {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
  color: white;
  background: rgba(0,0,0,0.4);
  cursor: pointer;
  transition: background 0.3s;
}

.video-overlay:hover {
  background: rgba(0,0,0,0.6);
}

.testimonial-card video {
  width: 100%;
  height: 300px;
  object-fit: cover;
  border-radius: 12px;
  display: block;          /* removes inline baseline issues */
  vertical-align: middle;  /* aligns consistently in row */
}

.testimonial-grid {
  display: flex; /* or grid */
  align-items: center; /* or center */
}
/* Dots */
.swiper-dots {
  display: flex;
  justify-content: center;
  margin-top: 15px;
  gap: 8px;
}

.swiper-dots .dot {
  width: 10px;
  height: 10px;
  background: #ccc;
  border-radius: 50%;
  cursor: pointer;
}

.swiper-dots .dot.active {
  background: #004aad;
}


/*Benefits*/
.benefits-section {
  padding: 60px 20px;
}

.benefits-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
  align-items: center;
  max-width: 1200px;
  margin: auto;
}

.benefits-content h3 {
  font-size: 24px;
  margin-bottom: 20px;
  color: #222;
}

.benefits-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 24px;
}

.benefit-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  color: #555;
}

.benefit-item .dot {
  width: 8px;
  height: 8px;
  background: #004aad; /* brand color */
  border-radius: 50%;
  flex-shrink: 0;
}

.benefits-buttons {
  margin-top: 20px;
}

.btn {
  display: inline-block;
  padding: 10px 18px;
  border-radius: 8px;
  font-size: 14px;
  text-decoration: none;
  font-weight: 500;
  transition: 0.3s;
}

.btn.primary {
  background: #004aad;
  color: #fff;
  margin-right: 10px;
}

.btn.primary:hover {
  background: #00347a;
}

.btn.outline {
  border: 2px solid #004aad;
  color: #004aad;
  background: transparent;
}

.btn.outline:hover {
  background: #004aad;
  color: #fff;
}

.benefits-image img {
  max-width: 400px;
  width: 100%;
  display: block;
  margin: auto;
}

/* Responsive */
@media (min-width: 992px) {
  .benefits-grid {
    grid-template-columns: 1fr 1fr;
  }
}

/*service buttons*/
service-pages {
  text-align: center;
  margin: 60px auto;
  padding: 20px;
}

.service-pages h2 {
  font-size: 24px;
  margin-bottom: 25px;
}

.service-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 15px;
}

.service-links .service-btn {
  display: inline-block;
  background: #004aad;
  color: #fff;
  padding: 10px 20px;
  border-radius: 8px;
  font-size: 15px;
  text-decoration: none;
  font-weight: 600;
  transition: background 0.3s ease;
}

.service-links .service-btn:hover {
  background: #0077ff;
}

footer {
  background: #111;
  color: #fff;
  padding: 15px 30px;
}

.footer-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.footer-left {
  flex: 1;
  text-align: left;
  font-size: 0.9rem;
  margin: 0;
}

.footer-logo {
  flex: 1;
  text-align: center;
}

.footer-logo img {
  max-height: 200px; /* adjust as needed */
  width: auto;
}

.social-icons {
  flex: 1;
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

.social-icons a {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 1.2rem;
  transition: all 0.3s ease;
}

/* Brand colors */
.social-icons a.linkedin {
  background-color: #0077b5;
}
.social-icons a.facebook {
  background-color: #1877f2;
}
.social-icons a.instagram {
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, 
              #fd5949 45%, #d6249f 60%, #285AEB 90%);
}

/* Hover */
.social-icons a:hover {
  transform: scale(1.1);
  opacity: 0.9;
}

/* Fix Font Awesome conflict */
footer .social-icons .fa,
footer .social-icons .fab {
  font-family: "Font Awesome 6 Brands" !important;
  font-weight: 400 !important;
  font-style: normal;
}

nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

nav ul {
  list-style: none;
  display: flex;
  gap: 20px;
  margin: 0;
  padding: 0;
}

nav ul li {
  position: relative;
}

nav ul li a {
  text-decoration: none;
  padding: 8px 12px;
  display: block;
  color: #f7f7f7;
  font-weight: bold;
}

/* Navigation base */
nav ul {
  list-style: none;
  display: flex;
  gap: 20px;
  margin: 0;
  padding: 0;
}

nav ul li {
  position: relative; /* Needed for dropdown positioning */
}

nav ul li a {
  text-decoration: none;
  padding: 8px 12px;
  display: block;
  color: #dbe3ed;
  font-weight: bold;
}

/* ========= RESPONSIVE OPTIMIZATION FOR ABMRPO ========= */

/* GLOBAL */
body {
  font-size: 16px;
}
img {
  max-width: 100%;
  height: auto;
}

/* HEADER & NAV */
nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem;
  flex-wrap: wrap;
}

nav ul {
  list-style: none;
  display: flex;
  gap: 1.5rem;
}

nav ul li {
  position: relative;
}

.hamburger {
  display: none;
  font-size: 1.8rem;
  cursor: pointer;
}

/* HERO SECTION */
#home > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}

#home h1 {
  font-size: 2.2rem;
  line-height: 1.3;
}

/* FORMS */
.contact-form form {
  width: 100%;
  max-width: 500px;
  padding: 1rem;
}

/* FOOTER */
.footer-content {
  flex-wrap: wrap;
  text-align: center;
  gap: 1rem;
}

/* Universal reset for responsiveness */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}

/* Make all images and videos fluid */
img, video {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Force text and containers to shrink gracefully */
.container, section, div {
  max-width: 1200px;
  box-sizing: border-box;
  padding: 1rem;
}

/* Tables */
table {
  width: 100%;
  border-collapse: collapse;
}
/* mobile version */
/* --- Base --- */
nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem;
}

nav ul {
  display: flex;
  gap: 1.5rem;
  list-style: none;
}

/* new header */
/* ---------- mobile-first header (namespaced to avoid collisions) ---------- */
.abm-header { width:100%; background:#004aad; border-bottom:1px solid #eee; position:relative; z-index:2200; }
.abm-bar { max-width:1200px; margin:0 auto; padding:0.6rem 1rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.abm-logo-group { display:flex; align-items:center; gap:0.75rem; min-width:0; }
.abm-logo-img { height:44px; width:auto; display:block; }
.abm-logo-text { display:flex; flex-direction:column; min-width:0; }
.abm-busname { color:#f1f5fb; font-weight:700; font-size:1rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.abm-tagline { font-size:.95rem; color:#f9f4f4; line-height:2; }

/* desktop nav (hidden by default; shown on wide screens below) */
.abm-desktop-nav { display:none; }
.abm-desktop-nav ul { display:flex; gap:1.25rem; list-style:none; margin:0; padding:0; align-items:center; }
.abm-desktop-nav a { color:#f2f5f9; text-decoration:none; font-weight:600; padding:0.5rem; }

/* menu toggle (visible by default in mobile-first) */
.abm-menu-toggle { color:#ffffff; display:flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:8px; border: none; background: transparent; cursor:pointer; padding:0; }
.abm-menu-toggle:focus { outline:2px solid rgba(0,74,173,0.15); outline-offset:2px; }

/* Drawer (off-canvas) */
.abm-drawer { position:fixed; left:-360px; top:0; bottom:0; width:320px; max-width:85vw; background:#fff; box-shadow: 8px 0 30px rgba(0,0,0,0.18); transition:left .36s cubic-bezier(.22,.9,.2,1); z-index:2300; display:flex; flex-direction:column; }
.abm-drawer.open { left:0; }
.abm-drawer-header { display:flex; align-items:center; justify-content:space-between; padding:1rem; border-bottom:1px solid #f0f0f0; }
.abm-drawer-brand { display:flex; align-items:center; gap:0.6rem; font-size:1.05rem; }
.abm-drawer-logo { height:50px; width:auto; display:block; }
.abm-drawer-close { background:none; border:none; font-size:1.5rem; line-height:1; cursor:pointer; }

/* Drawer nav */
.abm-drawer-nav { padding:1rem; flex:1 1 auto; overflow:auto; }
.abm-drawer-nav ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0.25rem; }
.abm-drawer-nav a { display:block; padding:0.9rem 0.6rem; text-decoration:none; color:#004aad; font-weight:600; border-radius:6px; }
.abm-drawer-nav a:hover { background:#004aad; }

/* small CTA in drawer */
.abm-drawer-cta { padding:1rem; border-top:1px solid #f0f0f0; }
.abm-btn-primary { display:inline-block; text-decoration:none; padding:0.6rem 0.9rem; background:#004aad; color:#fff; border-radius:8px; font-weight:700; }

/* overlay */
.abm-drawer-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.42); opacity:0; visibility:hidden; transition:opacity .28s ease; z-index:2250; }
.abm-drawer-overlay.show { opacity:1; visibility:visible; }

/* ---------- Desktop adjustments ---------- */
@media (min-width: 981px) {
  /* show horizontal nav and hide the mobile toggle/drawer */
  .abm-desktop-nav { display:flex; }
  .abm-menu-toggle { display:none; }
  .abm-drawer { display:none; }
  .abm-drawer-overlay { display:none; }
  .abm-logo-img { height:80px; }
  .abm-busname { font-size:1.5rem; }
}

.abm-menu-toggle i {
  color: #ffffff !important;   /* force pure white */
}
/* Make the hamburger always visible with a subtle white glow on mobile */
@media (max-width: 980px) {
  .abm-menu-toggle {
    background: rgba(255,255,255,0.12); /* constant soft highlight */
    color: #fff !important;             /* pure white icon */
  }

  /* optional: round edges a bit more if you like */
  .abm-menu-toggle {
    border-radius: 8px;
  }
}

.abm-busname {
  font-size: 22px;
  white-space: nowrap !important;     /* keep it on one line */
  overflow: visible !important;       /* but never hide text */
  text-overflow: clip !important;     /* no ellipsis */
}


@media (min-width:981px) {
  .abm-desktop-nav ul {
    justify-content: flex-end;   /* pack items to the right */
    flex: 1;                     /* allow UL to fill available width */
  }
}

/*meet the team */

/* --- Mobile horizontal scroll for "Meet the Team" --- */
/* Full-width layout with minimal side padding for header, content, and footer */
@media (min-width: 981px) {
  .abm-bar,          /* header inner container */
  .abm-content,      /* your main content wrapper */
  .footer-content {      /* footer inner container */
    max-width: none;     /* remove any width cap */
    width: 100%;
    margin: 0;
    padding-left: 1rem;  /* adjust to taste: 1rem ≈ 16px */
    padding-right: 1rem;
  }
}

/* center the middle logo */
.footer-logo {
  flex: 0 0 auto;                  /* don't stretch */
  text-align: center;
}

.footer-logo img {
  display: block;
  margin: 0 auto;                  /* ensures the image itself is centered */
  max-height: 60px;                /* optional: keep it a reasonable size */
}

html, body { margin:0; padding:0; }
header { margin-top:0; }

/* --- mobile drawer submenu --- */
.abm-drawer-nav .abm-submenu {
  list-style: none;
  margin: 4px 0 0 18px;   /* indent slightly */
  padding: 0;
}
.abm-drawer-nav .abm-submenu li a {
  display: block;
  padding: 0.7rem 0.6rem;
  font-weight: 500;
  color: #004aad;         /* same blue as main links */
}

.abmbrand{color:#004aad;}
.abm-drawer-nav .abm-submenu li a:hover {
  background: #004aad;
  border-radius: 6px;
}

/* Only affects the About page leadership carousel */
/* --- Mobile horizontal scroll + dots --- */
@media (max-width:768px){
  .leaders-mobile-track {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    padding-bottom: 1.5rem; /* space for dots */
  }
  .leader-card {
    flex: 0 0 260px;      /* card width */
    scroll-snap-align: start;
  }

  /* dots container */
  .leaders-dots {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: -1rem;
  }
  .leaders-dots span {
    width: 8px;
    height: 8px;
    background: rgba(0,0,0,0.3);
    border-radius: 50%;
    transition: background 0.3s;
  }
  .leaders-dots span.active {
    background: #004aad;  /* active color */
  }
}

/* Hide dots on desktop */
@media (min-width:769px){
  .leaders-dots { display:none; }
}

/* Desktop layout: show leadership cards in a row */
@media (min-width: 769px){
  .leaders-mobile-track {
    display: flex;            /* row layout */
    flex-wrap: wrap;          /* allow wrapping if many cards */
    justify-content: center;  /* center them across page */
    gap: 2rem;                /* space between cards */
    overflow-x: visible;      /* remove horizontal scroll on desktop */
  }

  .leader-card {
    flex: 0 0 280px;          /* fixed width per card */
    max-width: 280px;
  }
}

/*talent card images */
/* Center talent card images */
.talent-card img {
  display: block;          /* removes inline gap below images */
  margin-left: auto;       /* center horizontally */
  margin-right: auto;
}

@media (max-width: 768px) {
  .talent-card img {
    display: block !important;      /* force block-level */
    margin-left: auto !important;   /* force horizontal centering */
    margin-right: auto !important;
  }
}


/*Stats box and image */
.stats-box img {
   max-width: 100%;
   height: auto;
   display: block;       /* keeps it inside parent */
}

.stats-image {
   position: relative;   /* or static if you don’t need absolute */
   left: auto;
   right: auto;
}

@media (max-width:768px){
   .stats-grid { 
      flex-direction: column;  /* or grid-template-columns: 1fr; */
      gap: 20px;               /* add some spacing */
   }
}

/*careers adjustment */
@media (max-width: 600px) {
  .job-header {
    flex-wrap: wrap;        /* allow wrapping */
    gap: 10px;              /* some space between lines */
  }

  .job-title img {
    width: 60px;            /* shrink the logo a bit */
    height: 60px;
  }

  /* keep the buttons aligned to the right in the new row */
  .job-header > div:last-child {
    margin-left: auto;
    display: flex;
    gap: 8px;
  }
}

/* ===== Mobile adjustments for header logo & text ===== */
@media (max-width: 768px) {
  /* make the logo image bigger */
  .abm-logo-img {
    height: 100px;           /* adjust as needed */
    width: auto;
  }

  /* ensure the company name and tagline stay on one line */
  .abm-busname {
    white-space: nowrap;    /* keep text on a single line */
    overflow: visible;      /* ensure nothing is hidden */
    text-overflow: unset;
    font-size: 1.2rem;        /* tweak sizes to fit if needed */
  }
  .abm-tagline {
    white-space: nowrap;    /* keep text on a single line */
    overflow: visible;      /* ensure nothing is hidden */
    text-overflow: unset;
    font-size: .7rem;        /* tweak sizes to fit if needed */
  }

  /* allow the logo group to grow so text fits beside larger logo */
  .abm-logo-group {
    flex-wrap: nowrap;      /* keep logo and text side-by-side */
    align-items: center;
    gap: 0.75rem;           /* space between logo and text */
    min-width: 0;           /* prevent flex from shrinking text */
  }

  /* optional: slightly reduce font if it still overflows */
  .abm-logo-text {
    font-size: 0.95rem;     /* adjust only if text overflows */
  }
}

/* ===== Mobile: stack logo above text ===== */
@media (max-width: 768px) {
  .abm-logo-group {
    flex-direction: column;     /* stack vertically */
    align-items: center;        /* center both logo and text */
    gap: 0.5rem;                /* space between logo and text */
    text-align: center;         /* center text lines */
  }

  .abm-logo-text {
    display: block;
    min-width: auto;
    text-align: center;
  }

  .abm-busname,
  .abm-tagline {
    white-space: normal;        /* allow wrapping if needed */
    overflow: visible;
    text-overflow: unset;
  }
}

  /* Make the benefits list fully visible */
  @media screen and (max-width: 768px) {
  .benefits-grid {
    flex-direction: column; /* stack content and image */
  }

  .benefits-content,
  .benefits-image {
    width: 100%;
    max-height: none !important;
    overflow: visible !important;
  }

  .benefits-list {
    gap: 10px;
    max-height: none !important;
    overflow: visible !important;
    padding-left: 0; /* remove indentation */
  }

  .benefit-item {
    display: block; /* stack dot and text vertically */
    padding-left: 0; /* remove any left margin */
  }

  .benefit-item .dot {
    display: inline-block; /* keep dot inline */
    margin-right: 8px;
    margin-top: 0;
  }

  .benefit-item span {
    display: inline; /* text inline with dot */
    font-size: 1rem;
    line-height: 1.4;
  }
}

/* Mobile Hero Adjustment */
/* Mobile Hero Adjustment */
@media screen and (max-width: 768px) {
  #home > div {
    display: block !important;  /* override inline grid */
    padding: 0 1rem !important;
  }

  #home > div > div:first-child {
    max-width: 100% !important;
  }

  #home > div > div:last-child {
    margin-top: 2rem !important;
  }

  #home h1 {
    font-size: 2rem !important;
    max-width: 100% !important;
  }

  #home p {
    font-size: 1rem !important;
    max-width: 100% !important;
  }

  #home img {
    width: 100% !important;
    height: auto !important;
  }
}

/* Hide drawer brand on desktop */
/* Off-canvas drawer */
.abmdrawer {
  /* Background matching main page */
  background-color: #f8f9fa; /* replace with your main page bg color */
  
  /* Dotted overlay */
  background-image: radial-gradient(#ccc 1px, transparent 1px);
  background-size: 10px 10px;
  background-repeat: repeat;
  
  /* Drawer sizing */
  width: 100%; /* adjust as needed */
  height: 100%; /* adjust as needed */
  padding: 20px;
  box-sizing: border-box;
  
  /* Optional: smooth entrance */
  transition: transform 0.3s ease;
}

/* Logo inside the drawer */
.abmdrawer .logo {
  display: block;
  width: 180px;   /* increase size as needed */
  height: auto;
  margin: 0 auto 30px auto; /* center horizontally */
}


/*images about */
/* Professional Image Grid Layout */
.images {
  display: grid;
  grid-template-columns: 1fr;
  gap: 15px;
  margin-top: 30px;
}

.images .col {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.images img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.12);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.images img:hover {
  transform: scale(1.03);
  box-shadow: 0 8px 24px rgba(0,0,0,0.18);
}

/* Desktop layout - 2 columns side by side */
@media screen and (min-width: 1024px) {
  .images {
    grid-template-columns: 1fr 1fr;
    gap: 25px;
    align-items: stretch;
  }

  .images img {
    max-width: 100%;
    height: auto;
  }

  /* Optional: make right column slightly staggered for design */
  .images .offset img:first-child {
    margin-top: 25px;
  }
}

/*images about*/
/* Clean Responsive Image Grid */
.images4 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 15px;
  margin-top: 30px;
}

.images4 .col {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.images4 img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.images4 img:hover {
  transform: scale(1.03);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
}

/* Desktop: two-column layout + bigger images */
@media screen and (min-width: 1024px) {
  .images4 {
    grid-template-columns: 1fr 1fr;
    gap: 25px;
    align-items: stretch;
  }

  .images4 img {
    width: 110%;          /* enlarge image */
    max-width: none;
    border-radius: 14px;
  }

  .images4 .offset img:first-child {
    margin-top: 25px;     /* optional stagger effect */
  }
}

.images3 .col img {
  width: 100%;
  display: block;
  border-radius: 12px; /* optional, looks nicer with shadows */
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); /* 👈 this adds the shadow */
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.images3 .col img:hover {
  transform: translateY(-5px); /* subtle lift on hover */
  box-shadow: 0 8px 30px #004aad;
}


/* HERO SECTION: Who We Are */
.hero-who-we-are {
  background-color: rgba(0, 74, 173, 0.39);  /* same as header */
  color: #ffffff;
  text-align: center;
  padding: 80px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-who-we-are .hero-content {
  max-width: 800px;
}

.hero-who-we-are h1 {
  font-size: 2.5rem;
  margin-bottom: 15px;
  font-weight: 700;
}

.hero-who-we-are p {
  font-size: 1.1rem;
  line-height: 1.6;
  margin: 0 auto;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .hero-who-we-are {
    padding: 60px 15px;
  }

  .hero-who-we-are h1 {
    font-size: 2rem;
  }

  .hero-who-we-are p {
    font-size: 1rem;
  }
}

/* ===================== LAYOUT CONTAINERS ===================== */
/* ===============================
   Global Max-Width Layout Adjustments (1800px)
   =============================== */
@media (min-width: 1200px) {
  main,
  .container,
  section,
  .about-section,
  #home > div,
  .comparison-wrapper,
  .industries-grid,
  .testimonials-grid,
  .benefits-grid,
  .contact-form form,
  .carousel-container,
  .core-values,
  .leadership {
    max-width: 1800px !important;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 2rem;
    padding-right: 2rem;
  }

  /* Hero specific tweak */
  #home > div {
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
  }

  /* Comparison / grids / testimonials / carousel */
  .comparison-wrapper,
  .industries-grid,
  .testimonials-grid,
  .benefits-grid,
  .carousel-container,
  .core-values,
  .leadership,
  .about-section {
    gap: 40px;
  }
}

/* Carousel full width support */
.carousel-container {
  width: 100%;
}

.carousel-track {
  width: 100%;
}

/* ===============================
   Full Edge-to-Edge Sections for About Page
   =============================== */
@media (min-width: 1200px) {

  /* Make all main sections edge-to-edge */
  .about-section,
  .core-values,
  .leadership,
  .hero-who-we-are {
    width: 100%;
    max-width: none !important;  /* Remove previous max-width constraints */
    margin: 0;
    padding: 0;
  }

  /* Content wrapper inside sections stays readable */
  .about-section .container,
  .core-values .values-grid,
  .leadership .leaders-mobile-track,
  .hero-who-we-are .hero-content {
    max-width: 1800px;           /* Optional: keeps content aligned and readable */
    margin-left: auto;
    margin-right: auto;
    padding-left: 2rem;
    padding-right: 2rem;
  }

  /* About section image full width */
  .about-section .images3 img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
  }

  /* Core-values grid full width */
  .core-values .values-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 20px;
  }

  /* Leadership carousel full width */
  .leadership,
  .leaders-mobile-track {
    width: 100%;
    display: flex;
    overflow-x: auto;
    gap: 20px;
  }

  /* Hero overlays / backgrounds full width */
  .hero-who-we-are .hero-overlay {
    width: 100%;
    margin: 0;
    padding: 0;
  }

  .hero-who-we-are h1,
  .hero-who-we-are p {
    max-width: 1800px;  /* text readable inside full-width hero */
    margin-left: auto;
    margin-right: auto;
    padding: 2rem;
  }
}

  /* ===============================
   Fully Center About Section
   =============================== */
@media (min-width: 1200px) {
  /* Center the section */
  .about-section {
    width: 100%;
    max-width: 1800px;          /* same max-width as other sections */
    margin-left: auto;
    margin-right: auto;          /* centers the section horizontally */
    padding-left: 2rem;         /* optional inner padding */
    padding-right: 2rem;
    box-sizing: border-box;
  }

  /* Container fills the section but does not shift content */
  .about-section .container {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }

  /* Grid ensures content is centered */
  .about-section .grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;     /* centers all columns inside */
    gap: 2rem;                   /* space between columns */
  }

  /* Columns flex naturally without pushing left */
  .about-section .content,
  .about-section .images {
    flex: 1 1 auto;
    max-width: 1500px;            /* optional: limits width of each column */
    box-sizing: border-box;
  }
}

/* ===============================
   About Section: Text and Images Side by Side
   =============================== */
@media (min-width: 1200px) {
  /* Center the section */
  .about-section {
    width: 100%;
    max-width: 1800px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 2rem;
    padding-right: 2rem;
    box-sizing: border-box;
  }

  /* Container fills section */
  .about-section .container {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
  }

  /* Grid: two columns, text left, images right */
  .about-section .grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; /* text and images spread evenly */
    align-items: flex-start;         /* top-align columns */
    gap: 2rem;                       /* spacing between columns */
  }

  /* Text column */
  .about-section .content {
    flex: 1 1 45%;                    /* roughly 45% of width */
    max-width: 100%;
  }

  /* Images column */
  .about-section .images {
    flex: 1 1 60%;                    /* roughly 45% of width */
    max-width: 100%;
    display: grid;
    grid-template-columns: 4fr 4fr;   /* two images per row */
    gap: 1rem;
  }

  .about-section .images img {
    width: 80%;
    height: auto;
    display: block;
    object-fit: cover;
  }
}

/* ===============================
   Services Page Full Width Sections
   =============================== */

/* Make main content sections full width and centered */
main, .highlights, .process-section, .cta {
  width: 100%;
  max-width: 1800px;      /* or adjust to your preferred max width */
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
  box-sizing: border-box;
}

/* Highlights cards grid */
.highlights {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}

/* Ensure process steps grid aligns nicely */
.process-steps {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 20px;
  justify-items: center;
  margin-top: 30px;
}

@media(min-width: 768px) {
  .process-steps {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media(min-width: 1024px) {
  .process-steps {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* Center the CTA content */
.cta {
  text-align: center;
  padding: 50px 20px;
  border-radius: 12px;
  background: linear-gradient(90deg, #004aad, #0077ff);
  color: #fff;
  margin-top: 60px;
}

/* ===============================
   Services Page Full Width Sections
   =============================== */

/* Make main content sections full width and centered */
main, .highlights, .process-section, .cta {
  width: 100%;
  max-width: 1800px;      /* or adjust to your preferred max width */
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
  box-sizing: border-box;
}

/* Highlights cards grid */
.highlights {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}

/* Ensure process steps grid aligns nicely */
.process-container {
  width: 100%;
  max-width: 1200px;  /* content max width */
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: column;
  align-items: center;  /* center all child content horizontally */
  box-sizing: border-box;
  padding: 0 20px;     /* optional horizontal padding */
}


/*testimonial-careers*/
.testimonial-row {
  display: flex;
  justify-content: center; /* center the two videos */
  gap: 40px;               /* space between videos */
  flex-wrap: wrap;
  width: 100vw;            /* full viewport width */
  margin-left: calc( 1vw + 10%); /* offset any parent padding/margin */
}

/*jobssss*/
/* Full-width jobs section */
#jobs {
  width: 100vw;                       /* full viewport width */
  margin-right: calc( 5vw +50%);     /* offset parent container padding */
  padding: 20px 20px;                 /* spacing around the section */
  box-sizing: border-box;
  background: rgba(249, 249, 249, 0);   
  margin-left: calc( -2vw); /* offset any parent padding/margin */
}/* optional: background color */
}

/* CTA inside jobs section */
#jobs .cta {
  max-width: 1800px;                  /* keeps heading aligned */
  margin: 0 auto 40px;
  text-align: center;
}

/* Job cards layout */
#jobs .job-card {
  max-width: 1500px;                    /* each card width */
  margin: 20px auto;                   /* center cards */
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* Job header responsive adjustments */
#jobs  .job-header .job-card{
  flex-wrap: wrap;
}

/* Job images larger for wide screens */
#jobs .job-card .job-title img {
  width: 120px;
  height: 120px;
}

/* Extra wide screens */
@media (min-width: 1400px) {
  #jobs .job-card{
    max-width: 1400px;
  }
}

/*webdesign*/
/* Make service-pages section full-width edge-to-edge */
.service-pages {
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  padding: 60px 20px; /* spacing top/bottom and sides */
  box-sizing: border-box;
  text-align: center;
  margin-left: calc( 1vw + 15%);
}

/* Center and space service buttons */
.service-pages .service-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px; /* space between buttons */
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .service-pages .service-links {
    flex-direction: column;
    gap: 15px;
  }
}


/* Background only for index.html */
body.home-page {
  background: url('images/blue_abstract_geometric_triangular_background.jpg') no-repeat center center fixed;
  background-size: cover;
}

.highlight { font-weight:bold; color:#004aad; }