:root {
  --bg: #f5f5fc;
  --font: "Gilroy", sans-serif;
  --secColor: #e92056;
  --secSoft: #e9205652;
  --bgColor: #171726;
}

/* -------------------------- General -------------------------- */
*,
*::before,
*::after {
  padding: 0;
  margin: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font);
  background-color: var(--bgColor);
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
  position: relative;
  min-height: 100vh;
}

body.noscroll {
  overflow: hidden;
}

a {
  color: var(--main-text-color);
  text-decoration: none;
}

a:hover, a:active, a:focus {
  outline: none;
  text-decoration: none;
}

ul,
ol {
  list-style: none;
}

:active,
:focus {
  outline: 0;
}

button {
  background: transparent;
  border: none;
}

/* -------------------------- General Styling -------------------------- */
.cl-white {
  color: #fff;
}

.cl-black {
  color: #000;
}

.cl-main {
  color: var(--main-color);
}

.cl-secondary {
  color: var(--secondary-color);
}

.bg-white {
  color: #fff;
}

.bg-black {
  color: #000;
}

.bg-main {
  color: var(--main-color);
}

.bg-secondary {
  color: var(--secondary-color);
}

.container {
  position: relative;
  max-width: 1250px;
  width: 100%;
  margin: 0 auto;
  padding: 0 15px;
}

.d-none {
  display: none !important;
}

.d-flex {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
}

.d-grid {
  display: -ms-grid !important;
  display: grid !important;
}

.grid-2 {
  -ms-grid-columns: 1fr 1fr;
      grid-template-columns: 1fr 1fr;
}

.grid-3 {
  -ms-grid-columns: 1fr 1fr 1fr;
      grid-template-columns: 1fr 1fr 1fr;
}

.grid-4 {
  -ms-grid-columns: 1fr 1fr 1fr 1fr;
      grid-template-columns: 1fr 1fr 1fr 1fr;
}

.grid-auto {
  -ms-grid-columns: auto !important;
      grid-template-columns: auto !important;
}

.grid-g-0 {
  grid-gap: 0 !important;
}

.grid-g-1 {
  grid-gap: 0.25rem !important;
}

.grid-g-2 {
  grid-gap: 0.5rem !important;
}

.grid-g-3 {
  grid-gap: 1rem !important;
}

.grid-g-4 {
  grid-gap: 1.5rem !important;
}

.grid-g-5 {
  grid-gap: 3rem !important;
}

.grid-cg-0 {
  -webkit-column-gap: 0 !important;
          column-gap: 0 !important;
}

.grid-cg-1 {
  -webkit-column-gap: 0.25rem !important;
          column-gap: 0.25rem !important;
}

.grid-cg-2 {
  -webkit-column-gap: 0.5rem !important;
          column-gap: 0.5rem !important;
}

.grid-cg-3 {
  -webkit-column-gap: 1rem !important;
          column-gap: 1rem !important;
}

.grid-rg-0 {
  row-gap: 0 !important;
}

.grid-rg-1 {
  row-gap: 0.25rem !important;
}

.grid-rg-2 {
  row-gap: 0.5rem !important;
}

.grid-rg-3 {
  row-gap: 1rem !important;
}

.grid-w100 {
  grid-column: 1 / -1;
}

.well {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 0 -10px;
}

.well [class^="ww"] {
  padding: 0 10px;
}

.well.form {
  margin: 0 -7px;
}

.well.form [class^="ww"] {
  padding: 0 7px;
}

.well .ww-2 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: 16.66666667%;
}

.well .ww-3 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: 25%;
}

.well .ww-4 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: 33.33333333%;
}

.well .ww-5 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: 41.66666667%;
}

.well .ww-6 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: 50%;
}

.well .ww-7 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: 58.33333333%;
}

.well .ww-8 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: 66.66666667%;
}

.well .ww-9 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: 75%;
}

.well .ww-10 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: 83.33333333%;
}

.well .ww-12 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: 100%;
}

.align-items-center {
  -webkit-box-align: center !important;
      -ms-flex-align: center !important;
          align-items: center !important;
}

.justify-content-center {
  -webkit-box-pack: center !important;
      -ms-flex-pack: center !important;
          justify-content: center !important;
}

.p-absolute {
  position: absolute;
}

.p-relative {
  position: relative;
}

.w-100 {
  width: 100% !important;
}

.miw-100 {
  min-width: 100% !important;
}

.maw-100 {
  max-width: 100% !important;
}

.w-fit {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.h-100 {
  height: 100%;
}

.h-fit {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}

.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.m-auto {
  margin: auto !important;
}

.mt-0 {
  margin-top: 0 !important;
}

.mt-1 {
  margin-top: 0.25rem !important;
}

.mt-2 {
  margin-top: 0.5rem !important;
}

.mt-3 {
  margin-top: 1rem !important;
}

.mt-4 {
  margin-top: 1.5rem !important;
}

.mt-5 {
  margin-top: 3rem !important;
}

.mt-auto {
  margin-top: auto !important;
}

.me-0 {
  margin-right: 0 !important;
}

.me-1 {
  margin-right: 0.25rem !important;
}

.me-2 {
  margin-right: 0.5rem !important;
}

.me-3 {
  margin-right: 1rem !important;
}

.me-4 {
  margin-right: 1.5rem !important;
}

.me-5 {
  margin-right: 3rem !important;
}

.me-auto {
  margin-right: auto !important;
}

.mb-0 {
  margin-bottom: 0 !important;
}

.mb-1 {
  margin-bottom: 0.25rem !important;
}

.mb-2 {
  margin-bottom: 0.5rem !important;
}

.mb-3 {
  margin-bottom: 1rem !important;
}

.mb-4 {
  margin-bottom: 1.5rem !important;
}

.mb-5 {
  margin-bottom: 3rem !important;
}

.mb-auto {
  margin-bottom: auto !important;
}

.ms-0 {
  margin-left: 0 !important;
}

.ms-1 {
  margin-left: 0.25rem !important;
}

.ms-2 {
  margin-left: 0.5rem !important;
}

.ms-3 {
  margin-left: 1rem !important;
}

.ms-4 {
  margin-left: 1.5rem !important;
}

.ms-5 {
  margin-left: 3rem !important;
}

.ms-auto {
  margin-left: auto !important;
}

.p-0 {
  padding: 0 !important;
}

.p-1 {
  padding: 0.25rem !important;
}

.p-2 {
  padding: 0.5rem !important;
}

.p-3 {
  padding: 1rem !important;
}

.p-4 {
  padding: 1.5rem !important;
}

.p-5 {
  padding: 3rem !important;
}

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

.px-1 {
  padding-right: 0.25rem !important;
  padding-left: 0.25rem !important;
}

.px-2 {
  padding-right: 0.5rem !important;
  padding-left: 0.5rem !important;
}

.px-3 {
  padding-right: 1rem !important;
  padding-left: 1rem !important;
}

.px-4 {
  padding-right: 1.5rem !important;
  padding-left: 1.5rem !important;
}

.px-5 {
  padding-right: 3rem !important;
  padding-left: 3rem !important;
}

.py-0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.py-1 {
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
}

.py-2 {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

.py-3 {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

.py-4 {
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important;
}

.py-5 {
  padding-top: 3rem !important;
  padding-bottom: 3rem !important;
}

.pt-0 {
  padding-top: 0 !important;
}

.pt-1 {
  padding-top: 0.25rem !important;
}

.pt-2 {
  padding-top: 0.5rem !important;
}

.pt-3 {
  padding-top: 1rem !important;
}

.pt-4 {
  padding-top: 1.5rem !important;
}

.pt-5 {
  padding-top: 3rem !important;
}

.pe-0 {
  padding-right: 0 !important;
}

.pe-1 {
  padding-right: 0.25rem !important;
}

.pe-2 {
  padding-right: 0.5rem !important;
}

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

.pe-4 {
  padding-right: 1.5rem !important;
}

.pe-5 {
  padding-right: 3rem !important;
}

.pb-0 {
  padding-bottom: 0 !important;
}

.pb-1 {
  padding-bottom: 0.25rem !important;
}

.pb-2 {
  padding-bottom: 0.5rem !important;
}

.pb-3 {
  padding-bottom: 1rem !important;
}

.pb-4 {
  padding-bottom: 1.5rem !important;
}

.pb-5 {
  padding-bottom: 3rem !important;
}

.ps-0 {
  padding-left: 0 !important;
}

.ps-1 {
  padding-left: 0.25rem !important;
}

.ps-2 {
  padding-left: 0.5rem !important;
}

.ps-3 {
  padding-left: 1rem !important;
}

.ps-4 {
  padding-left: 1.5rem !important;
}

.ps-5 {
  padding-left: 3rem !important;
}

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

.fw-bold {
  font-weight: 700 !important;
}

.br0 {
  border-radius: 0 !important;
}

.br5 {
  border-radius: 5px !important;
}

.br8 {
  border-radius: 8px !important;
}

.br10 {
  border-radius: 10px !important;
}

.br12 {
  border-radius: 12px !important;
}

.br15 {
  border-radius: 15px !important;
}

.br25 {
  border-radius: 25px !important;
}

.fs14 {
  font-size: 14px !important;
}

.fs16 {
  font-size: 16px !important;
}

.fs18 {
  font-size: 18px !important;
}

.fs20 {
  font-size: 20px !important;
}

.butto {
  color: #fff;
  border: none;
  font-weight: 500;
  font-family: var(--font);
  cursor: pointer;
  padding: 8px 15px;
  text-decoration: none !important;
  font-size: 16px;
  border-radius: 5px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  display: inline-block;
}

.butto:hover {
  -webkit-filter: brightness(0.9);
          filter: brightness(0.9);
}

.badge {
  color: #fff;
  border: none;
  font-weight: 500;
  display: inline-block;
  padding: 8px 15px;
  font-size: 15px;
  line-height: normal;
  border-radius: 5px;
}

.badge:hover {
  -webkit-filter: brightness(0.9);
          filter: brightness(0.9);
}

.butto-xs,
.badge-xs {
  padding: 3px 12px;
  font-size: 14px;
}

.butto-lg,
.badge-lg {
  padding: 12px 20px !important;
  font-size: 16px;
}

.butto-xlg,
.badge-xlg {
  padding: 15px 25px !important;
  font-size: 18px;
}

.butto-main,
.badge-main {
  background: var(--main-color);
}

.butto-primary,
.badge-primary {
  background: #6a7bf5;
}

.butto-success,
.badge-success {
  background: #57c781;
}

.butto-warning,
.badge-warning {
  background: #ebb35f;
}

.butto-danger,
.badge-danger {
  background: #f56a6a !important;
}

.butto-secondary,
.badge-secondary {
  background: var(--secondary-color);
}

.butto-light,
.badge-light {
  color: #5f728a !important;
  background: #dce6f3;
}

.alert {
  position: relative;
  padding: 0.75rem 1.25rem;
  margin-bottom: 1rem;
  border-radius: 5px;
}

.alert-primary {
  background: #bfcaff;
  color: #1b3a76;
}

.alert-danger {
  background: #febdbe;
  color: #8f2630;
}

.alert-warning {
  background: #ffddb0;
  color: #72602e;
}

.alert-success {
  background: #acedc3;
  color: #155724;
}

.alert-light {
  background: #e7e9f3;
  color: #565b74;
}

.btnAnimated {
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.btnAnimated::before {
  content: "";
  position: absolute;
  left: -30%;
  top: 0;
  bottom: 0;
  width: 100%;
  -webkit-transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  background: #ffffff10;
  -webkit-clip-path: polygon(0 0, 100% 0%, 95% 100%, 0% 100%);
          clip-path: polygon(0 0, 100% 0%, 95% 100%, 0% 100%);
  z-index: -1;
}

.btnAnimated:hover:before {
  left: -20%;
}

.card {
  background: #fff;
  border-radius: 5px;
}

.card .card-header {
  color: var(--main-text-color);
  font-size: 18px;
  font-weight: 600;
  padding: 20px 25px;
  border-bottom: 1px solid var(--bg);
}

.card .card-header.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.card .card-footer {
  color: var(--main-text-color);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  padding: 20px;
  border-top: 1px solid var(--bg);
}

.checkbox,
.radio {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

[type="checkbox"],
[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 24px;
  min-width: 24px;
  height: 24px;
  background: #f8f9fc;
  border: 1px solid #e6e8ed;
  border-radius: 5px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-right: 7px;
  cursor: pointer;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}

[type="checkbox"]:checked,
[type="radio"]:checked {
  position: relative;
  background: var(--main-color);
  border: transparent;
}

[type="checkbox"]:checked::before,
[type="radio"]:checked::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  background-color: #fff;
  border-radius: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 12px;
  color: #fff;
}

.checkbox label,
.radio label {
  font-size: 16px;
  color: var(--main-color);
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
}

.switch {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
}

.switch > span {
  width: 34px;
  height: 20px;
  display: block;
  background: #fff;
  border-radius: 12px;
  position: relative;
}

.switch > span::before {
  content: "";
  position: absolute;
  left: 3px;
  top: 3px;
  width: 14px;
  height: 14px;
  border-radius: 100%;
  background: var(--main-color);
  -webkit-transition: 0.2s;
  transition: 0.2s;
}

.switch > label {
  margin-left: 5px;
}

.switch.active > span {
  background: var(--main-color);
}

.switch.active > span::before {
  left: calc(100% - 17px);
  background: #fff;
}

.modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  z-index: 11;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}

.modal .modal-content {
  position: relative;
  left: 50%;
  top: 50vh;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  max-width: 750px;
  width: 100%;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  opacity: 0;
  padding: 15px;
  padding-bottom: 75px;
}

.modal .modal-content.modal-lg {
  max-width: 1100px;
}

.modal .modal-content .modalArea {
  background: #fff;
  border-radius: 5px;
  position: relative;
}

.modal .modal-content .modalArea .modal-close {
  position: absolute;
  right: -5px;
  top: -5px;
  font-size: 34px;
  color: var(--main-color);
  background: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 100%;
  cursor: pointer;
}

.modal.show {
  opacity: 1;
  visibility: visible;
  pointer-events: inherit;
  overflow: auto;
  background-color: #00000090;
}

.modal.show .modal-content {
  top: 6vh;
  opacity: 1;
}

.modalHead h6 {
  font-size: 18px;
}

.modalHead {
  padding: 15px 20px;
  border-bottom: 1px solid var(--bg);
  color: var(--main-text-color);
  font-size: 16px;
  font-weight: 600;
}

.modalFoot {
  margin-top: 15px;
  padding-top: 15px;
  border-top: 1px solid var(--bg);
}

section#intro {
  padding: 50px 0 0;
  position: relative;
  background-color: var(--bgColor);
  z-index: 1;
  clip-path: ellipse(120% 100% at top center);
}

section#intro::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: #000;
  opacity: .2;
  z-index: -1;
}

section#intro::before, body::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: url(img/wbg.webp);
  opacity: .06;
  z-index: -1;
}

.intHead {
  color: #fff;
  text-align: center;
  font-size: 20px;
  text-transform: uppercase;
  display: flex;
  gap: 30px;
  justify-content: center;
}

.intHead .text {
  padding-top: 80px;
}

.intHead .image img {
  display: block;
  max-width: 400px;
  margin-bottom: -50px;
}

.intHead span {
  display: block;
}

.intHead h1 {
  font-weight: 500;
}

.intHead h1 span {
  font-size: 45px;
  font-weight: bold;
}

.serviceList {
  border-radius: 35px;
  transform: translateY(-5px);
  z-index: 3;
  position: relative;
  margin-bottom: 50px;
}

.serviceList .head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 30px;
  padding-bottom: 25px;
  height: 100px;
  border-radius: 30px 30px 0 0;
}

.serviceList .head .text {
  color: #fff;
  font-size: 18px;
}

.serviceList .head .text span {
  display: block;
  font-weight: bold;
  text-transform: uppercase;
  font-size: 22px;
}

.serviceList .head .icon {
  font-size: 28px;
  color: #fff;
}

.serviceList .head .icon i {
  display: block;
}

.serviceList .list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 12px;
  border-radius: 25px;
}

.serviceList .list .item {
  display: flex;
  align-items: center;
  background: #fff;
  padding: 20px;
  border-radius: 2px;
  color: var(--pcolor);
  transition: all .3s;
}

.serviceList .list .item .icon {
  font-size: 25px;
  height: 45px;
  min-width: 45px;
  width: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: var(--pcolor);
  border-radius: 2px;
  margin-right: 10px;
}

.serviceList .list .item .pname {
  text-transform: uppercase;
  font-weight: bold;
  font-size: 18px;
}

.serviceList .list .item .subtext {
  font-size: 18px;
  margin-left: 5px;
}

.serviceList .list .item:hover {
  background: var(--pcolor);
  transform: scale(1.05);
  color: #fff;
}

.serviceList .list .item:hover .icon {
  background: #ffffff15;
  border: 1px solid #ffffff20;
}

.intHead span.companyName {
  font-size: 16px;
  display: flex;
  align-items: center;
  margin: 0 auto;
  width: fit-content;
  padding: 5px 15px;
  border: 1px solid #fff;
  border-radius: 30px;
  gap: 5px;
  margin-bottom: 13px;
}

a.intHeadBTn {
  display: flex;
  align-items: center;
  gap: 5px;
  width: fit-content;
  background: #fff;
  padding: 12px 30px;
  font-size: 18px;
  color: var(--bgColor);
  font-weight: 700;
  border-radius: 40px;
  margin: 0 auto;
  margin-top: 20px;
  transition: .2s;
}

a.intHeadBTn:hover {
  padding: 12px 35px;
}

.page-head .content {
  position: relative;
  display: grid;
  grid-template-columns: auto 570px;
  gap: 30px;
  align-items: center;
}
.page-head .content .image {
  width: 300px;
  padding-top: 50px;
  margin: 0 auto;
  align-self: flex-end;
}
.page-head .content .image img {
  width: 100%;
  height: auto;
  animation: float 2s ease infinite;
  display: block;
}
.serviceList .list .item .icon i {
  display: block;
}

.page-head .content .image::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100px;
  background: linear-gradient(to bottom, transparent, var(--bgColor));
  z-index: 1;
}
.page-head .content .image .ww img {
  position: absolute;
  width: 50px;
  left: calc(50% - 14px);
  top: -60px;
  animation: 3s infinite ww;
  animation-timing-function: linear;
  z-index: -1;
}
.page-head .content .image .mainIMG {
  position: relative;
}
.page-head .content .image .mainIMG .bb img {
  position: absolute;
  bottom: 0;
  width: 360px;
  left: 50%;
  opacity: 0;
  transition: 0.2s;
  transform: translateX(-50%) rotateY(180deg);
  animation: 1s ease bbIn;
  animation-fill-mode: forwards;
}

.page-head {
  background-size: cover !important;
  background-position: bottom !important;
  background-position-y: -200px !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  position: relative;
  padding: 50px 0 0;
  min-height: 330px;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.page-head.pgcont {
  margin-bottom: -49px;
}
.page-head.special {
  padding-bottom: 95px;
}
.page-head.auto {
  min-height: auto;
}
.page-head .content .breadcrumbs {
  margin-bottom: 15px;
}
.page-head .breadcrumbs {
  width: 100%;
  top: 0;
  position: absolute;
  background: #00000010;
}
.page-head.new_main {
  position: relative;
  padding: 0;
  margin-bottom: -50px;
}
.page-head.auto.colorz.ifmobi.new_main::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: url(../img/wbg.webp);
  display: block;
  opacity: 0.04;
}
.page-head .content .detail .title span {
  color: #fff;
  display: block;
  font-size: 45px !important;
  line-height: 45px !important;
  font-weight: bold !important;
  position: relative;
}

.page-head .content .detail .title span > span {
  color: var(--secColor);
}

.page-head .content .icons > img {
  position: absolute;
}
.page-head .content p.pageDescription {
  color: #d3d8ef;
  font-size: 18px;
  margin-top: 15px;
  line-height: 26px;
}
.page-head .content .image .icons {
  position: relative;
}
.page-head .content .icons > img.icon1 {
  left: -24px;
  top: -3px;
  width: 66px;
  transform: rotate(-18deg);
}
.page-head .content .icons > img.icon2 {
  left: -75px;
  top: 131px;
  width: 64px;
  transform: rotate(17deg);
}
.page-head .content .icons > img.icon3 {
  left: -117px;
  top: 267px;
  width: 62px;
  transform: rotate(-5deg);
}
.page-head .content .icons > img.icon4 {
  right: -25px;
  top: 10px;
  width: 66px;
  transform: rotate(13deg);
}
.page-head .content .icons > img.icon5 {
  right: -80px;
  top: 125px;
  width: 64px;
  transform: rotate(-12deg);
}
.page-head .content .icons > img.icon6 {
  right: -105px;
  top: 270px;
  width: 62px;
  transform: rotate(12deg);
}
.cropAct {
  position: relative;
  padding: 0px 15px;
  width: fit-content;
  color: #fff;
  border: 2px solid var(--secSoft);
  margin-bottom: 20px;
  min-height: 40px;
  display: flex;
  align-items: center;
}
.cropAct::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: var(--secColor);
  opacity: 0.1;
  z-index: -1;
}
.cropAct h1 {
  font-size: 22px !important;
  font-weight: 500 !important;
}
.cropAct [class*="dots"] {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 100%;
  background: var(--secColor);
}
.cropAct .dots1 {
  left: -6px;
  top: -6px;
}
.cropAct .dots2 {
  left: -6px;
  bottom: -6px;
}
.cropAct .dots3 {
  right: -6px;
  top: -6px;
}
.cropAct .dots4 {
  right: -6px;
  bottom: -6px;
}

/* -------------------------- Keyframes -------------------------- */
@-webkit-keyframes rotateOpacity {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
    opacity: 0.3;
  }
  50% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(720deg);
            transform: rotate(720deg);
    opacity: 0.3;
  }
}
@keyframes rotateOpacity {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
    opacity: 0.3;
  }
  50% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(720deg);
            transform: rotate(720deg);
    opacity: 0.3;
  }
}

@-webkit-keyframes rotate {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes rotate {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

/* -------------------------- Media -------------------------- */
@media (max-width: 1200px) {
  .lg-d-none {
    display: none !important;
  }
  .lg-w-100 {
    width: 100% !important;
  }
  .lg-miw-100 {
    min-width: 100% !important;
  }
  .lg-maw-100 {
    max-width: 100% !important;
  }
  .lg-h-100 {
    height: 100% !important;
  }
  .lg-m-0 {
    margin: 0 !important;
  }
  .lg-d-grid {
    display: -ms-grid !important;
    display: grid !important;
  }
  .lg-grid-g-0 {
    grid-gap: 0 !important;
  }
  .lg-grid-g-1 {
    grid-gap: 0.25rem !important;
  }
  .lg-grid-g-2 {
    grid-gap: 0.5rem !important;
  }
  .lg-grid-g-3 {
    grid-gap: 1rem !important;
  }
  .lg-grid-g-4 {
    grid-gap: 1.5rem !important;
  }
  .lg-grid-g-5 {
    grid-gap: 3rem !important;
  }
  .lg-grid-auto {
    -ms-grid-columns: auto !important;
        grid-template-columns: auto !important;
  }
  .lg-grid-2 {
    -ms-grid-columns: 1fr 1fr !important;
        grid-template-columns: 1fr 1fr !important;
  }
  .lg-grid-3 {
    -ms-grid-columns: 1fr 1fr 1fr !important;
        grid-template-columns: 1fr 1fr 1fr !important;
  }
  .lg-grid-w100 {
    grid-column: 1 / -1;
  }
  .lg-flex-d-column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .well .lg-ww-2 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 16.66666667%;
  }
  .well .lg-ww-3 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 25%;
  }
  .well .lg-ww-4 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 33.33333333%;
  }
  .well .lg-ww-5 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 41.66666667%;
  }
  .well .lg-ww-6 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 50%;
  }
  .well .lg-ww-7 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 58.33333333%;
  }
  .well .lg-ww-8 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 66.66666667%;
  }
  .well .lg-ww-9 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 75%;
  }
  .well .lg-ww-10 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 83.33333333%;
  }
  .well .lg-ww-12 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 100%;
  }

  .page-head .content .image {
    width: 250px;
  }

  .page-head .content {
    grid-template-columns: 50% auto;
    min-height: auto;
  }

  .page-head .content .detail .title span {
    font-size: 32px !important;
    line-height: 34px !important;
  }
}

@media (max-width: 1024px) {
  .container {
    max-width: 720px;
  }
  .md-w-100 {
    width: 100% !important;
  }
  .md-miw-100 {
    min-width: 100% !important;
  }
  .md-maw-100 {
    max-width: 100% !important;
  }
  .md-h-100 {
    height: 100% !important;
  }
  .md-d-none {
    display: none !important;
  }
  .md-grid-g-0 {
    grid-gap: 0 !important;
  }
  .md-grid-g-1 {
    grid-gap: 0.25rem !important;
  }
  .md-grid-g-2 {
    grid-gap: 0.5rem !important;
  }
  .md-grid-g-3 {
    grid-gap: 1rem !important;
  }
  .md-grid-g-4 {
    grid-gap: 1.5rem !important;
  }
  .md-grid-g-5 {
    grid-gap: 3rem !important;
  }
  .md-grid-auto {
    -ms-grid-columns: auto !important;
        grid-template-columns: auto !important;
  }
  .md-grid-2 {
    -ms-grid-columns: 1fr 1fr !important;
        grid-template-columns: 1fr 1fr !important;
  }
  .md-grid-w100 {
    grid-column: 1 / -1;
  }
  .md-flex-d-column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media (max-width: 991px) {
  .page-head .content .image .icons {
      display: none;
  }
}

@media (max-width: 768px) {
  .container {
    max-width: 100%;
    width: 100%;
  }
  .sm-d-none {
    display: none !important;
  }
  .sm-w-100 {
    width: 100% !important;
  }
  .sm-miw-100 {
    min-width: 100% !important;
  }
  .sm-maw-100 {
    max-width: 100% !important;
  }
  .sm-h-100 {
    height: 100% !important;
  }
  .sm-grid-g-0 {
    grid-gap: 0 !important;
  }
  .sm-grid-g-1 {
    grid-gap: 0.25rem !important;
  }
  .sm-grid-g-2 {
    grid-gap: 0.5rem !important;
  }
  .sm-grid-g-3 {
    grid-gap: 1rem !important;
  }
  .sm-grid-g-4 {
    grid-gap: 1.5rem !important;
  }
  .sm-grid-g-5 {
    grid-gap: 3rem !important;
  }
  .sm-grid-auto {
    -ms-grid-columns: auto !important;
        grid-template-columns: auto !important;
  }
  .sm-grid-2 {
    -ms-grid-columns: 1fr 1fr !important;
        grid-template-columns: 1fr 1fr !important;
  }
  .sm-grid-w100 {
    grid-column: 1 / -1;
  }
  .sm-flex-d-column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .wubiContentIMG {
    margin-top: 30px;
  }
  .cropAct {
    margin: 0 auto;
    margin-bottom: 15px;
    margin-bottom: 10px;
  }
  .cropAct h1 {
    font-size: 20px !important;
}
  .page-head .content .image .mainIMG .bb {
    display: none;
  }
  .page-head .rateArea {
    position: absolute;
    bottom: 400px;
    left: 50%;
    transform: rotate(0deg) translateX(-50%);
    background: linear-gradient(to bottom, #ffffff30, #ffffff00);
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    min-width: 100%;
    border-radius: 0;
    padding: 15px;
  }
  .page-head .content .image {
    width: auto;
    padding-top: 40px;
    max-width: 310px;
  }
  .page-head .content > .detail {
    position: absolute;
    bottom: 35px;
    max-width: 100%;
    padding: 0 30px;
    text-align: center;
    min-width: 100%;
    z-index: 2;
  }
  .page-head.new_main .container {
    min-width: 100%;
    padding: 0;
  }
  .page-head .content p.pageDescription {
    display: none;
  }
  .page-head .content {
    position: relative;
    display: block;
  }
  .page-head .content:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 320px;
    background: linear-gradient(to top, #171726d1 45%, #1d263800);
    z-index: 1;
  }
  .page-head.new_main {
    background: #1d2638 !important;
  }
  .page-head .content .image img {
    position: relative;
  }
  .page-head .rateArea .detail {
    padding-left: 5px;
    padding-bottom: 2px;
  }
  .page-head .rateArea .icon {
    border-radius: 30px;
    background: #ffffff26;
    color: #fff;
    height: 40px;
    width: 60px;
  }
  .categoryInfoStep {
    grid-template-columns: auto;
  }
}

@media (max-width: 500px) {
  .xs-grid-g-0 {
    grid-gap: 0 !important;
  }
  .xs-grid-g-1 {
    grid-gap: 0.25rem !important;
  }
  .xs-grid-g-2 {
    grid-gap: 0.5rem !important;
  }
  .xs-grid-g-3 {
    grid-gap: 1rem !important;
  }
  .xs-grid-g-3 {
    grid-gap: 1.5rem !important;
  }
  .xs-grid-g-5 {
    grid-gap: 3rem !important;
  }
  .xs-grid-auto {
    -ms-grid-columns: auto !important;
        grid-template-columns: auto !important;
  }
  .xs-grid-2 {
    -ms-grid-columns: 1fr 1fr !important;
        grid-template-columns: 1fr 1fr !important;
  }
  .xs-flex-d-column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}


  .promo-banner{
      margin:40px 0;
      max-width:1280px;
      border-radius:5px;
      padding:48px 64px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:48px;
      background:#fafbfd;
  }


  @media(max-width:992px){
      .promo-banner{
          flex-direction:column;
          padding:40px 24px;
          gap:32px;
      }
  }

  .promo-left{flex:1;}
  .badge{
      display:inline-block;
      background:#e92056;
      color:#fff;
      font-weight:600;
      font-size:14px;
      padding:8px 20px;
      border-radius:8px;
      margin-bottom:20px;
  }
  .promo-left h2{font-size:32px;font-weight:800;line-height:1.3;margin:0 0 20px;color:#111;}
  .promo-left p{font-size:16px;line-height:1.6;color:#555;margin:0 0 14px;}
  .code-wrap{display:flex;align-items:center;gap:24px;flex-wrap:wrap;}
  .code{font-size:20px;font-weight:700;letter-spacing:2px;color:#000;}
  .copy-btn{
      display:flex;
      align-items:center;
      gap:8px;
      background:#e92056;
      color:#fff;
      font-weight:600;
      font-size:15px;
      border:0;
      border-radius:10px;
      padding:14px 28px;
      cursor:pointer;
  }
  .copy-btn:hover{background:#eb4974;}
  .copy-btn svg{width:20px;height:20px;}

  .howto-card{
      flex:0 0 320px;
      background:#fff;
      border-radius:16px;
      box-shadow:0 8px 24px rgba(0,0,0,.05);
      padding:32px 28px;
  }
  @media(max-width:992px){.howto-card{width:100%;}}
  .howto-card h3{margin:0 0 20px;font-size:20px;font-weight:700;color:#111;}
  .howto-card ol{counter-reset:step;list-style:none;margin:0;padding:0;}
  .howto-card li{
      display:flex;
      align-items:flex-start;
      gap:14px;
      font-size:16px;
      color:#333;
      margin-bottom:18px;
      line-height:1.5;
  }
  .howto-card li::before{
      content:counter(step);
      counter-increment:step;
      background:#e92056;
      color:#fff;
      font-weight:700;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      width:30px;
      height:30px;
      border-radius:50%;
      flex:none;
  }

.promo-wrapper{
    max-width:1280px;      /* Diğer elementlerle aynı genişlik */
    margin:0 auto;         /* Ortala */
    padding:0 15px;        /* Masaüstü & mobil yatay boşluk */
    box-sizing:border-box;
}

.promo-banner{margin:40px 0;}

/* ========= RENK DEĞİŞKENLERİ ========= */
:root{
  --se-primary:#e20063; /* Pembe ana renk */
}

/* ========= GENEL ========= */
.se-footer{
  background:var(--se-bg);
  color:#fff;
  font-family:Inter,Arial,sans-serif;
  line-height:1.45;
  overflow-x:hidden;      /* Olası yatay scroll’u da kapatır */
}

/* Merkezi konteyner */
.se-container{
  width:100%;             /* ✨ EKLENDİ: mobilde tam genişlik */
  max-width:1280px;       /* masaüstü sınırı */
  padding:0 16px;         /* kenarlara küçük nefes payı */
  margin-inline:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:40px;
}

/* ---- ÜST BLOK ---- */
.se-footer-top{
  background:var(--se-top-bg);
  border-radius:36px 36px 0 0;
  padding:34px 0;
  position:relative;
}
.se-footer-top::after{   /* Pembe alt şerit */
  content:"";
  position:absolute; left:0; right:0; bottom:0;
  height:4px; background:var(--se-primary);
  border-radius:0 0 4px 4px;
}

/* İletişim alanı */
.se-contact{display:flex; gap:48px; flex-wrap:wrap}
.se-contact-item{display:flex; gap:14px; align-items:center}
.se-icon{width:56px; height:56px; background:var(--se-primary);
         border-radius:14px; display:flex; justify-content:center; align-items:center}
.se-icon img{width:26px; height:26px}
.se-info small{display:block; font-size:13px; color:#c4c4d4}
.se-info a{display:block; font-weight:700; font-size:18px; color:#fff; text-decoration:none}

/* Logo */
.se-logo img{height:52px}

/* Sosyal ikonlar */
.se-social{display:flex; gap:16px; flex-wrap:wrap}
.se-soc{width:52px; height:52px; background:var(--se-primary); border-radius:14px;
        display:flex; justify-content:center; align-items:center}
.se-soc img{width:22px; height:22px}

/* ---- ALT BLOK ---- */
.se-footer-bottom{padding:28px 0}
.se-footer-bottom p{
  color:#b5b5c5;   /* istediğiniz HEX/RGB/var(...) değeri */
}
.se-bottom-inner{flex-wrap:wrap; gap:22px; font-size:14px}
.se-payments{display:flex; gap:18px; align-items:center}
.se-payments img{height:26px}

/* ========= RESPONSIVE ========= */
@media (max-width:992px){
  .se-contact{gap:32px}
}
/* ========= RESPONSIVE ========= */
@media (max-width:600px){
  /* Mobilde boşluk ve gap’i biraz küçültelim */
  .se-container{
    padding:0 12px;
    gap:24px;
  }

  .se-contact, .se-social{justify-content:center}
}
@media (max-width:480px){
  .se-icon{width:46px; height:46px}
  .se-info a{font-size:16px}
  .se-logo img{height:45px}
}

.se-icon i,
.se-soc   i{font-size:22px; color:#fff;}

@media(max-width:480px){
  .se-icon i,
  .se-soc  i{font-size:19px;}
}


/* === SosyalEvin ▸ İş Ortaklarımız (Çakışmasız) ==================== */
.partners-sec{
  background:#111827 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60' fill-opacity='.04'%3E%3Cpath d='M30 0h30v30H30zM0 0h30v30H0zM0 30h30v30H0zM30 30h30v30H30z'/%3E%3C/svg%3E") repeat;
  border-radius:36px;
  padding:48px 0;
  margin:40px 0;
  overflow:hidden;
}

.partners-head{
  display:flex;
  align-items:center;
  gap:12px;
  color:#000000;
  margin-bottom:32px;
}
.partners-ico{
  width:28px;height:28px;flex:0 0 28px;
  color:var(--secColor,#e92056); /* markanın pembe tonu */
}
.partners-head h2{
  font:600 1.5rem/1 var(--font,Inter,Arial,sans-serif);
  margin:0;
}

.partner-grid{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:32px;
  overflow-x:auto;         /* küçük ekranda yana kaydırma */
  scroll-snap-type:x mandatory;
}
.partner-card{scroll-snap-align:start;}

.partner-card figure{
  position:relative;
  aspect-ratio:3/4;
  border-radius:22px;
  overflow:hidden;
  transition:transform .35s;
  cursor:pointer;
}
.partner-card:hover figure{transform:translateY(-6px);}
.partner-card img{
  width:100%;height:100%;object-fit:cover;
}

/* alttaki karartma */
.partner-card figure::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.6) 0%,transparent 60%);
}

/* responsive dokunuş */
@media(max-width:768px){
  .partners-sec{padding:32px 0;}
  .partner-grid{gap:24px;padding-bottom:4px;}
  .partners-head{margin-left:15px;margin-bottom:24px;}
  .partner-card figcaption{font-size:.8rem;}
}

/* === SosyalEvin ▸ İş Ortaklarımız (conflict-free) ================ */
.partners-sec{
  background:#1c1d2e;                           /* koyu kutu */
  border-radius:35px;
  padding:48px 0;
  margin:40px 0;
  overflow:hidden;
}

.partners-head{
  display:flex;align-items:center;gap:12px;
  color:#000000;margin-bottom:32px;
}
.partners-head h2{
  margin:0;font:600 1.5rem/1 var(--font,"Gilroy",sans-serif);
}

.partner-grid{
  list-style:none;margin:0;padding:0;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:32px;
  overflow-x:auto;scroll-snap-type:x mandatory;
}
.partner-card{scroll-snap-align:start;}

.partner-card:hover figure{transform:translateY(-6px);}
.partner-card img{width:100%;height:100%;object-fit:cover;}


/* responsive */
@media(max-width:768px){
  .partners-sec{padding:32px 0;}
  .partner-grid{gap:24px;}
  .partners-head{margin-left:15px;margin-bottom:24px;}
  .partner-tag{font-size:.8rem;}
}

/* === Partner Video Modal (çakışmasız) ============================ */
.partner-modal-back{
  position:fixed;inset:0;background:#000a;display:flex;
  align-items:center;justify-content:center;z-index:9999;
  opacity:0;visibility:hidden;transition:.25s;
}
.partner-modal-back.show{opacity:1;visibility:visible;}
.partner-modal{
  width:90%;max-width:760px;aspect-ratio:16/9;background:#000;
  position:relative;border-radius:12px;overflow:hidden;
}
.partner-modal iframe{width:100%;height:100%;border:0;}
.partner-modal-close{
  position:absolute;top:8px;right:12px;font-size:30px;
  color:#fff;background:none;border:0;cursor:pointer;line-height:1;
}

/* === Partner grid: masaüstünde ortala ============================= */
@media (min-width: 992px){
  .partner-grid{
    /* 4 sabit sütun + gap → genişlik kadar alan kapla, sonra merkeze hizala */
    grid-template-columns: repeat(4, 180px); /* 180px kart genişliği   */
    justify-content: center;                 /* yatayda ortala         */
    gap: 32px;                               /* kartlar arası boşluk   */
  }
}

/* === Partner kutusu: beyaz zemine geç & dış ölçüleri hizala =========== */
.partners-sec{
  /* koyu zemin + desen yerine sade beyaz */
  background:#fff !important;      /* <— en son !important ile garanti  */
  border-radius:25px;              /* sitedeki “buton/promo” kutularına uyum */
  padding:48px 0;                  /* üst-alt nefes payı aynı kalsın     */
  margin:40px 0;                   /* diğer bölümlerle eş boşluk         */

  /* genişliği zaten .container ile sınırlı; ekstra genişlik yok */
}

@media (max-width:768px){
  .partners-sec{
    padding:32px 0;                /* mobilde biraz daralt */
  }
}

/* === Partner kutusu → site kart ölçüsü & sorunsuz hizalama =========== */
.partners-sec{
  /* ➊ kutuyu (promo-banner vb. ile aynı) genişliğe sabitle */
  max-width:1250px !important;      /* masaüstü sınırı                 */
  width:calc(100% - 30px) !important; /* 2×15 px yatay iç padding       */
  margin:40px auto !important;      /* ortala – üst/alt 40 px boşluk   */

  /* ➋ arka plan & köşeler                                              */
  background:#fff !important;       /* tam beyaz zemin                 */
  b