/* ============================================================
   Aitchison Homepage — Scoped CSS
   All rules are scoped under #smooth-wrapper to prevent
   any conflicts with the existing website stylesheet.
   ============================================================ */

/* ---------- Utilities ---------- */

#smooth-wrapper .o-hidden {
  overflow: hidden;
}

#smooth-wrapper .d-flex {
  display: flex;
}

#smooth-wrapper .position-relative {
  position: relative;
}

#smooth-wrapper .text-uppercase {
  text-transform: uppercase;
}

#smooth-wrapper .text-align-center {
  text-align: center;
}

#smooth-wrapper .p-0 {
  padding: 0 !important;
}

#smooth-wrapper .mb-80px {
  margin-bottom: 80px !important;
}

#smooth-wrapper .mt-30px {
  margin-top: 30px !important;
}

#smooth-wrapper .fs-14 {
  font-size: 14px !important;
}

#smooth-wrapper .fs-16 {
  font-size: 16px !important;
}

#smooth-wrapper .fs-18 {
  font-size: 18px !important;
}

#smooth-wrapper .fs-24 {
  font-size: 24px !important;
  line-height: 32px;
}

#smooth-wrapper .fs-75 {
  font-size: 75px !important;
}

#smooth-wrapper .fw-500 {
  font-weight: 500 !important;
}

#smooth-wrapper .w-80px {
  width: 80px;
}

#smooth-wrapper .min-w-100 {
  min-width: 100%;
}

#smooth-wrapper .z-index-2 {
  z-index: 2;
}

/* ---------- Background ---------- */

#smooth-wrapper .bg-img {
  background-size: cover !important;
}

/* ---------- Fit Image ---------- */

#smooth-wrapper .fit-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  vertical-align: inherit;
}

/* ---------- Video ---------- */

#smooth-wrapper video {
  background-size: cover;
  display: table-cell;
  vertical-align: middle;
  width: 100%;
}

#smooth-wrapper video.bgvid {
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* ---------- Rotate Circle ---------- */

#smooth-wrapper .rotate-circle {
  animation-name: aitchison-rotateCircle;
  animation-duration: 20s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@keyframes aitchison-rotateCircle {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* ---------- Circle Button ---------- */

#smooth-wrapper .circle-button {
  position: relative;
  display: inline-block;
}

#smooth-wrapper .circle-button .icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}

#smooth-wrapper .circle-button .textcircle {
  width: 250px;
  fill: #fff;
}

/* ---------- Hero Style 1 ---------- */

#smooth-wrapper .hero-style1 {
  position: relative;
  /* padding: 100px 0 120px; */
  z-index: 10;
}

#smooth-wrapper .hero-style1 .bg-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}

#smooth-wrapper .hero-style1 h1 {
  line-height: 1;
}

#smooth-wrapper .hero-style1 .circle-button {
  margin-top: -30px;
}

#smooth-wrapper .hero-style1 .circle-button svg {
  fill: #000000;
}

#smooth-wrapper .hero-style1 .tags a {
  width: max-content;
  padding: 10px 20px;
  border: 1px solid  !important;
  border-radius: 30px;
  font-size: 14px;
  margin: 3px 0;
  transition: all 0.4s;
  color: #00205b !important;
}

#smooth-wrapper .hero-style1 .tags a:hover {
  background: #00205b;
  color: #ffffff !important;
}

.tags.md-mb50 a {
  display: inline-block;
  padding: 10px 20px !important;
  background-color: #ffffff;
}
.maxzw-100 .container{
    max-width: 100% !important;
}

/* ---------- Button: Arrow ---------- */

#smooth-wrapper .butn-arrow {
  padding: 7px 7px 7px 20px;
  border-radius: 10px;
  backdrop-filter: blur(10px);
  background: #00205b;
  color: #fff;
  border: 1px solid #00205b3a;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: max-content;
  transition: all 0.4s;
}

#smooth-wrapper .butn-arrow.butn-blur {
  padding: 7px 7px 7px 20px;
  background:#fff;
  backdrop-filter: blur(10px);
  color: #00205b;
}

#smooth-wrapper .butn-arrow.butn-blur .arrow-icon {
  background: #00205b;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
#smooth-wrapper .butn-arrow.butn-blur .arrow-icon svg path{
  stroke: white !important;
}

#smooth-wrapper .butn-arrow.butn-blur:hover {
  background: rgba(0, 0, 0, 0.15);


  border: 1px solid rgba(255, 255, 255, 1);
  
  color: #ffffff !important;
}

#smooth-wrapper .butn-arrow .arrow-icon {
  width: 38px;
  height: 38px;
  line-height: 38px;
  text-align: center;
  border-radius: 5px;
  background: #EDEDED;
  margin-left: 20px;
  color: #fff;
  position: relative;
  overflow: hidden;
}

#smooth-wrapper .butn-arrow .arrow-icon svg {
  stroke: #00205b;
  width: 32px;
  transition: all 0.4s;
}

#smooth-wrapper .butn-arrow .arrow-icon svg:first-of-type {
  position: absolute;
  top: 0;
  height: 100%;
  transform: translateY(-40px);
}

#smooth-wrapper .butn-arrow:hover {
  background: #ffffff05 !important;
  color: #00205b !important;
}

#smooth-wrapper .butn-arrow:hover .arrow-icon svg {
  stroke: #ffffff;
}

#smooth-wrapper .butn-arrow:hover .arrow-icon {
  background: #00205b;
}

#smooth-wrapper .butn-arrow:hover .arrow-icon svg:first-of-type {
  transform: translateY(0);
}

#smooth-wrapper .butn-arrow:hover .arrow-icon svg:last-of-type {
  transform: translateY(40px);
}

/* ---------- Horizontal Scroll Section ---------- */

#smooth-wrapper .hr-sec .hr-container {
  width: max-content;
  display: flex;
  flex-wrap: nowrap;
}

#smooth-wrapper .hr-sec .item-panel {
  width: 750px;
  height: 100%;
  padding: 0 15px;
}

#smooth-wrapper .hr-sec .item-panel .see-more {
  position: absolute;
  top: 0;
  left: calc(100% + 15px);
  width: calc(100% - 15px);
  height: 100%;
  padding: 0px 7px !important;
}

#smooth-wrapper .hr-sec .fit-img {
  /* height: 70vh; */
  /* min-height: 480px; */
  width: 100% !important;
  max-width: 100% !important;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
}

#smooth-wrapper .hr-sec .fit-img .cont {
  position: absolute;
  bottom: 30px;
  left: 30px;
}

#smooth-wrapper .hr-sec .fit-img .cont .tags {
  overflow: hidden;
}

#smooth-wrapper .hr-sec .fit-img .cont .tags span {
  width: max-content;
  display: block;
  padding: 0px 0px;
  background: #ffffff00 !important;
  color: #fff !important;
  border-radius: 10px;
  margin: 5px 0;
  transform: translateY(50px);
  opacity: 0;
  transition: all 0.4s;
}

.rotate-circle.fs-24.text-uppercase {
    position: relative;
    z-index: 999 !important;
}

#smooth-wrapper .hr-sec .fit-img .cont .tags span h3{
  font-size: 31px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
}


#smooth-wrapper .hr-sec .fit-img .cont .tags span {
  opacity: 1;
  transform: translateY(0);
}

#smooth-wrapper .hr-sec .fit-img .cont .tags span:nth-of-type(2) {
  transition-delay: 0.1s;
}

#smooth-wrapper .hr-sec .fit-img .cont .tags span:nth-of-type(3) {
  transition-delay: 0.2s;
}

#smooth-wrapper .hr-sec .fit-img .cont .tags span:nth-of-type(4) {
  transition-delay: 0.3s;
}

/* ---------- Responsive ---------- */

@media screen and (max-width: 992px) {
  #smooth-wrapper .md-mb30 {
    margin-bottom: 30px;
  }

  #smooth-wrapper .md-mb50 {
    margin-bottom: 50px !important;
  }

  #smooth-wrapper .md-order-1 {
    order: 1 !important;
  }

  #smooth-wrapper .md-order-2 {
    order: 2 !important;
  }

  #smooth-wrapper .hero-style1 {
    padding-bottom: 80px;
  }

  #smooth-wrapper .hero-style1 h1 {
    font-size: 60px !important;
  }

  #smooth-wrapper .hr-sec .hr-container {
    flex-wrap: wrap;
    width: 100%;
    margin: 0px !important;
  }

  #smooth-wrapper .hr-sec .hr-container .item-panel {
    height: auto;
    width: 100%;
  }

  #smooth-wrapper .hr-sec .hr-container .item-panel .fit-img {
    height: 480px;
  }

  #smooth-wrapper .fs-75 {
    font-size: 50px !important;
  }

  #smooth-wrapper .hr-sec .item-panel .see-more {
      position: relative;
      display: block;
      min-width: 100% !important;
      left: 0px;
      height: 100%;
      margin-top: 30px !important;
  }
  #smooth-wrapper .hero-style1 .circle-button {
    margin-bottom: -50px;
    margin-top: 0px;
  }

  #smooth-wrapper .fs-16.fs-16sm{
    font-size: 12px !important;
  }
}

@media screen and (min-width: 992px) {
  #smooth-wrapper .hr-sec .fit-img{
     aspect-ratio: 16 / 14 !important;
  }
}

@media screen and (max-width: 767px) {
  .pd-sm-0{
    padding: 0px !important;
  }

  .ped-sm-3{
    padding-right: 1rem !important;
  }

  .pdi-sm {
    padding: 0px 24px !important;
  }

  .news-highlights {
    padding-right: 0px !important;
    padding-left: 0px !important;
  }

  .px-18{
    padding: 40px !important;
  }

  .pdis-sm-0,.pdis-sm-0 .col-lg-6 {
    padding-right: 0px !important;
    padding-left: 0px !important;
  }

  #smooth-wrapper .hr-sec .item-panel {
    padding: 0px !important;
  }

  #smooth-wrapper .fit-img.fit-img4 img{
    object-position:right !important;
  }
}