@import url("https://fonts.googleapis.com/css?family=Open+Sans:100,200,300,400,500,600,700,800,900");
/* 
---------------------------------------------
reset
--------------------------------------------- 
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, div
pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q,
s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
figure, header, nav, section, article, aside, footer, figcaption {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
}

.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.clearfix {
  display: inline-block;
}

html[xmlns] .clearfix {
  display: block;
}

* html .clearfix {
  height: 1%;
}

ul, li {
  padding: 0;
  margin: 0;
  list-style: none;
}

header, nav, section, article, aside, footer, hgroup {
  display: block;
}

* {
  box-sizing: border-box;
}

html, body {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  background-color: #1e1e1e;
  font-size: 16px;
  -ms-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  text-decoration: none !important;
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0px;
  margin-bottom: 0px;
  color: #fff;
  font-weight: 700;
}

ul {
  margin-bottom: 0px;
}

p {
  font-size: 15px;
  line-height: 30px;
  color: #fff;
}

img {
  width: 100%;
  overflow: hidden;
}

/* 
---------------------------------------------
Global Styles
--------------------------------------------- 
*/
html,
body {
  background: #fff;
  font-family: 'Roboto', sans-serif;
}

::selection {
  background: #7453fc;
  color: #fff;
}

::-moz-selection {
  background: #7453fc;
  color: #fff;
}

.border-button a {
  font-size: 14px;
  color: #fff;
  background-color: transparent;
  border: 1px solid #7453fc;
  padding: 12px 30px;
  display: inline-block;
  border-radius: 25px;
  font-weight: 500;
  text-transform: capitalize;
  letter-spacing: 0.5px;
  transition: all .3s;
  position: relative;
  overflow: hidden;
}

.border-button a:after {
  width: 78%;
  height: 2px;
  background-color: #fff;
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
}

.border-button a:hover {
  background-color: #7453fc;
  color: #fff;
}

.main-button a {
  font-size: 14px;
  color: #fff;
  background-color: #7453fc;
  border: 1px solid #7453fc;
  padding: 12px 30px;
  display: inline-block;
  border-radius: 25px;
  font-weight: 500;
  text-transform: capitalize;
  letter-spacing: 0.5px;
  transition: all .3s;
  position: relative;
  overflow: hidden;
}

.main-button a:after {
  width: 78%;
  height: 2px;
  background-color: #fff;
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
}

.main-button a:hover {
  background-color: #fff;
  color: #7453fc;
  border: 1px solid #fff;
}

section {
  margin-top: 120px;
}

.section-heading {
  position: relative;
  z-index: 2;
  margin-top: 0px;
  margin-bottom: 80px;
  text-align: center;
}

.section-heading .line-dec {
  width: 100px;
  height: 2px;
  background-color: #7453fc;
  margin: 0 auto 30px auto;
}

.section-heading h2 {
  margin-top: 10px;
  line-height: 36px;
  font-size: 30px;
  font-weight: 700;
  text-transform: capitalize;
  color: #fff;
}

.section-heading h2 em {
  color: #7453fc;
  font-style: normal;
}

/* 
---------------------------------------------
Pre-loader Style
--------------------------------------------- 
*/

.js-preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.98);
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  opacity: 1;
  visibility: visible;
  z-index: 9999;
  -webkit-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

.js-preloader.loaded {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

@-webkit-keyframes dot {
  50% {
      -webkit-transform: translateX(96px);
      transform: translateX(96px);
  }
}

@keyframes dot {
  50% {
      -webkit-transform: translateX(96px);
      transform: translateX(96px);
  }
}

@-webkit-keyframes dots {
  50% {
      -webkit-transform: translateX(-31px);
      transform: translateX(-31px);
  }
}

@keyframes dots {
  50% {
      -webkit-transform: translateX(-31px);
      transform: translateX(-31px);
  }
}

.preloader-inner {
  position: relative;
  width: 142px;
  height: 40px;
  background: transparent;
}

.preloader-inner .dot {
  position: absolute;
  width: 16px;
  height: 16px;
  top: 12px;
  left: 15px;
  background: #7453fc;
  border-radius: 50%;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -webkit-animation: dot 2.8s infinite;
  animation: dot 2.8s infinite;
}

.preloader-inner .dots {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  margin-top: 12px;
  margin-left: 31px;
  -webkit-animation: dots 2.8s infinite;
  animation: dots 2.8s infinite;
}

.preloader-inner .dots span {
  display: block;
  float: left;
  width: 16px;
  height: 16px;
  margin-left: 16px;
  background: #7453fc;
  border-radius: 50%;
}



/* 
---------------------------------------------
Header Style
--------------------------------------------- 
*/

.background-header {
  background-color: #fff !important;
  height: 70px!important;
  position: fixed!important;
  top: 0!important;
  left: 0;
  right: 0;
  box-shadow: 0px 0px 10px rgba(0,0,0,0.15)!important;
  -webkit-transition: all .5s ease 0s;
  -moz-transition: all .5s ease 0s;
  -o-transition: all .5s ease 0s;
  transition: all .5s ease 0s;
}

.header-area {
  background-color: transparent;
  position: absolute;
  height: 70px;
  top: 30px;
  left: 0;
  right: 0;
  z-index: 100;
  -webkit-transition: all .5s ease 0s;
  -moz-transition: all .5s ease 0s;
  -o-transition: all .5s ease 0s;
  transition: all .5s ease 0s;
}

.header-area .main-nav {
  min-height: 80px;
  background: transparent;
  display: flex;
  background-color: #fff;
  padding: 15px 30px;
  border-radius: 80px;
}

.background-header .main-nav {
  padding: 0px;
  background-color: transparent;
}

.header-area .main-nav .logo {
  flex-basis: 30%;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.header-area .main-nav .logo img {
  width: 223px;
}

.background-header .main-nav .logo {
  margin-top: 8px;
}

.background-header .main-nav .logo img {
  width: 180px;
}

.header-area .main-nav .nav {
  display: inline-flex;
  flex-basis: 70%;
  justify-content: flex-end;
  vertical-align: middle;
  text-align: right;
  margin-top: 15px;
  margin-right: 0px;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  position: relative;
  z-index: 999;
}

.header-area .main-nav .nav li {
  padding-left: 10px;
  padding-right: 10px;
  display: inline-block;
}

.header-area .main-nav .nav li a {
  display: block;
  font-weight: 500;
  font-size: 14px;
  text-transform: capitalize;
  color: #2a2a2a;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  border: transparent;
  padding: 8px 15px;
  border-radius: 18px;
  letter-spacing: 1px;
}

.header-area .main-nav .nav li.has-sub ul.sub-menu li:last-child a:hover,
.background-header .main-nav .nav li.has-sub ul.sub-menu li:last-child a:hover {
  padding-left: 25px !important;
}

.header-area .main-nav .nav li:hover a,
.header-area .main-nav .nav li a.active {
  color: #fff;
  background-color: #7453fc;
}

.background-header .main-nav .nav li:hover a,
.background-header .main-nav .nav li a.active {
  color: #fff;
  opacity: 1;
}

.header-area .main-nav .nav li.has-sub {
  position: relative;
  padding-right: 15px;
}

.header-area .main-nav .menu-trigger {
  cursor: pointer;
  display: block;
  position: absolute;
  top: 33px;
  width: 32px;
  height: 40px;
  text-indent: -9999em;
  z-index: 99;
  right: 20px;
  display: none;
}

.background-header .main-nav .menu-trigger {
  top: 17px;
}

.header-area .main-nav .menu-trigger span,
.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  background-color: #7453fc;
  display: block;
  position: absolute;
  width: 30px;
  height: 2px;
  left: 0;
}

.background-header .main-nav .menu-trigger span,
.background-header .main-nav .menu-trigger span:before,
.background-header .main-nav .menu-trigger span:after {
  background-color: #7453fc;
}

.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  background-color: #7453fc;
  display: block;
  position: absolute;
  width: 30px;
  height: 2px;
  left: 0;
  width: 75%;
}

.background-header .main-nav .menu-trigger span:before,
.background-header .main-nav .menu-trigger span:after {
  background-color: #7453fc;
}

.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
  content: "";
}

.header-area .main-nav .menu-trigger span {
  top: 16px;
}

.header-area .main-nav .menu-trigger span:before {
  -moz-transform-origin: 33% 100%;
  -ms-transform-origin: 33% 100%;
  -webkit-transform-origin: 33% 100%;
  transform-origin: 33% 100%;
  top: -10px;
  z-index: 10;
}

.header-area .main-nav .menu-trigger span:after {
  -moz-transform-origin: 33% 0;
  -ms-transform-origin: 33% 0;
  -webkit-transform-origin: 33% 0;
  transform-origin: 33% 0;
  top: 10px;
}

.header-area .main-nav .menu-trigger.active span,
.header-area .main-nav .menu-trigger.active span:before,
.header-area .main-nav .menu-trigger.active span:after {
  background-color: transparent;
  width: 100%;
}

.header-area .main-nav .menu-trigger.active span:before {
  -moz-transform: translateY(6px) translateX(1px) rotate(45deg);
  -ms-transform: translateY(6px) translateX(1px) rotate(45deg);
  -webkit-transform: translateY(6px) translateX(1px) rotate(45deg);
  transform: translateY(6px) translateX(1px) rotate(45deg);
  background-color: #7453fc;
}

.background-header .main-nav .menu-trigger.active span:before {
  background-color: #7453fc;
}

.header-area .main-nav .menu-trigger.active span:after {
  -moz-transform: translateY(-6px) translateX(1px) rotate(-45deg);
  -ms-transform: translateY(-6px) translateX(1px) rotate(-45deg);
  -webkit-transform: translateY(-6px) translateX(1px) rotate(-45deg);
  transform: translateY(-6px) translateX(1px) rotate(-45deg);
  background-color: #7453fc;
}

.background-header .main-nav .menu-trigger.active span:after {
  background-color: #7453fc;
}

.header-area.header-sticky {
  min-height: 110px;
}

.header-area.header-sticky .nav li a.active {
  color: #fff;
}

@media (max-width: 1200px) {
  .header-area .main-nav .nav li {
    padding-left: 10px;
    padding-right: 10px;
  }
  .header-area .main-nav:before {
    display: none;
  }
}

@media (max-width: 992px) {
  .header-area {
    top: 0;
  }
  .header-area .main-nav {
    background-color: transparent;
    border-radius: 0px;
  }
  .header-area .main-nav .nav {
    height: auto;
    flex-basis: 100%;
  }
  .header-area .main-nav .logo {
    position: absolute;
    left: 30px;
    top: 15px;
  }
  .background-header .main-nav .logo {
    top: 0px;
  }
  .background-header .main-nav .border-button {
    top: 0px !important;
  }
  .header-area .main-nav .border-button {
    position: absolute;
    top: 15px;
    right: 70px;
  }
  .header-area.header-sticky .nav li a:hover,
  .header-area.header-sticky .nav li a.active {
    color: #7453fc!important;
    opacity: 1;
  }
  .header-area.header-sticky .nav li.search-icon a {
    width: 100%;
  }
  .header-area {
    background-color: #f7f7f7;
    padding: 0px 15px;
    height: 100px;
    box-shadow: none;
    text-align: center;
  }
  .header-area .container {
    padding: 0px;
  }
  .header-area .logo {
    margin-left: 0px;
  }
  .header-area .menu-trigger {
    display: block !important;
  }
  .header-area .main-nav {
    overflow: hidden;
  }
  .header-area .main-nav .nav {
    float: none;
    width: 100%;
    display: none;
    -webkit-transition: all 0s ease 0s;
    -moz-transition: all 0s ease 0s;
    -o-transition: all 0s ease 0s;
    transition: all 0s ease 0s;
    margin-left: 0px;
  }
  .header-area.header-sticky .nav {
    margin-top: 85px !important;
    text-align: center;
  }
  .background-header.header-sticky .nav {
    margin-top: 70px !important;
  }
  .header-area .main-nav .nav li:first-child {
    border-top: 1px solid #eee;
  }
  .header-area .main-nav .nav li {
    width: 100%;
    background: #fff;
    border-bottom: 1px solid #eee;
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  .header-area .main-nav .nav li a {
    height: 50px !important;
    line-height: 50px !important;
    padding: 0px !important;
    border: none !important;
    background: #fff !important;
    color: #1e1e1e !important;
  }
  .header-area .main-nav .nav li a:hover {
    background: #fff !important;
    color: #7453fc!important;
  }
  .header-area .main-nav .nav li.has-sub ul.sub-menu {
    position: relative;
    visibility: inherit;
    opacity: 1;
    z-index: 1;
    transform: translateY(0%);
    top: 0px;
    width: 100%;
    box-shadow: none;
    height: 0px;
    transition: all 0s;
  }
  .header-area .main-nav .nav li.submenu ul li a {
    font-size: 12px;
    font-weight: 400;
  }
  .header-area .main-nav .nav li.submenu ul li a:hover:before {
    width: 0px;
  }
  .header-area .main-nav .nav li.has-sub ul.sub-menu {
    height: auto;
  }
  .header-area .main-nav .nav li.has-sub:after {
    color: #3B566E;
    right: 30px;
    font-size: 14px;
    top: 15px;
  }
  .header-area .main-nav .nav li.submenu:hover ul, .header-area .main-nav .nav li.submenu:focus ul {
    height: 0px;
  }
}
/*--------------------------------------- yeni navbar ------------------------------------------------------------*/



/* 
---------------------------------------------
Banner Style
--------------------------------------------- 
*/

.main-banner {
  /*background-image: url(../images/banner-bg.jpg);*/
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding-top: 150px;
  padding-bottom: 240px;
  background-color: #2a2a2a;
}

.main-banner h6 {
  font-size: 20px;
  margin-bottom: 15px;
  font-weight: 500;
  letter-spacing: 0.5px;
}

.main-banner h2 {
  color: #fff;
  font-size: 50px;
  font-weight: 700;
  line-height: 66px;
  text-transform: uppercase;
}

.main-banner p {
  margin-top: 20px;
}

.main-banner .buttons {
  margin-top: 30px;
  display: flex;
  justify-content: start;
}

.main-banner .border-button {
  margin-right: 15px;
}

.main-banner .owl-banner {
  margin-top: -40px;
}

.main-banner .owl-nav {
  position: absolute;
  width: 100%;
  margin: 0 auto;
  bottom: -76px;
  text-align: center;
}

.main-banner .owl-nav .owl-prev {
  margin-right: 7.5px;
}

.main-banner .owl-nav .owl-next {
  margin-left: 7.5px;
}

.main-banner .owl-nav .owl-prev span,
.main-banner .owl-nav .owl-next span  {
  width: 46px;
  height: 46px;
  line-height: 46px;
  font-size: 24px;
  display: inline-block;
  color: #7453fc;
  background-color: #fff;
  border-radius: 50%;
  opacity: 1;
  transition: all .3s;
}

.main-banner .owl-nav .owl-prev span:hover,
.main-banner .owl-nav .owl-next span:hover {
  opacity: 1;
}


/* 
---------------------------------------------
Categories & Collections Style
--------------------------------------------- 
*/

.categories-collections {
  /*background-image: url(../images/dark-bg.jpg);*/
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  /*padding: 120px 0px 150px 0px;*/
  position: relative;
}

.categories-collections:after {
  /*background-image: url(/assets/images/category-collection-dec.png);*/
  width: 300px;
  height: 282px;
  position: absolute;
  bottom: 0;
  right: 30px;
  content: '';
}

.categories .item {
  background-color: #282b2f;
  text-align: center;
  padding: 30px;
  border-radius: 20px;
  border: 1px solid #404245;
  position: relative;
}

.categories .item .icon {
  width: 62px;
  height: 62px;
  display: inline-block;
  text-align: center;
  line-height: 62px;
  background-color: #fff;
  border-radius: 50%;
}

.categories .item .icon img {
  /*
  max-width: 31px;
  */
}

.categories .item h4 {
  margin-top: 15px;
  font-size: 20px;
}

.categories .item .icon-button a {
  display: inline-block;
  width: 46px;
  height: 46px;
  line-height: 46px;
  background-color: #fff;
  color: #7453fc;
  border-radius: 50%;
  font-size: 18px;
  position: absolute;
  left: 50%;
  bottom: -23px;
  transform: translateX(-23px);
  transition: all .3s;
  opacity: 0;
  visibility: hidden;
}

.categories .item .icon-button a:hover {
  background-color: #7453fc;
  color: #fff;
}

.categories .item:hover .icon-button a {
  visibility: visible;
  opacity: 1;
}

.collections {
  margin-top: 140px;
}

.collections .item img {
  border-top-right-radius: 20px;
  border-top-left-radius: 20px;
}

.collections .item .down-content {
  background-color: #282b2f;
  border: 1px solid #404245;
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;
  padding: 30px;
}

.collections .item .down-content h4 {
  font-size: 20px;
  border-bottom: 1px solid rgba(255,255,255,0.2);
  margin-bottom: 20px;
  padding-bottom: 20px;
}

.collections .item {
  padding-bottom: 60px;
}

.collections .item span {
  color: #fff;
  display: inline-block;
  /*width: 48%;*/
  font-size: 15px;
}

.collections .item span strong {
  font-size: 20px;
}

.collections .item span.category {
  text-align: right;
}

.collections .item .main-button a {
  width: 100%;
  text-align: center;
}

.collections .item .main-button {
  margin-top: 20px;
  margin-bottom: -60px;
}

.collections .item .main-button a:hover {
  background-color: #fff;
  border: 1px solid #fff;
  color: #7453fc;
}

.collections .owl-nav {
  position: absolute;
  width: 100%;
  margin: 0 auto;
  top: 50%;
  transform: translateY(-50px);
  text-align: center;
}

.collections .owl-nav .owl-prev {
  position: absolute;
  left: -23px;
}

.collections .owl-nav .owl-next {
  position: absolute;
  right: -23px;
}

.collections .owl-nav .owl-prev span,
.collections .owl-nav .owl-next span  {
  width: 46px;
  height: 46px;
  line-height: 46px;
  font-size: 24px;
  display: inline-block;
  color: #7453fc;
  background-color: #fff;
  border-radius: 50%;
  opacity: 1;
  transition: all .3s;
}

.collections .owl-nav .owl-prev span:hover,
.collections .owl-nav .owl-next span:hover {
  opacity: 1;
}


/* 
---------------------------------------------
Create NFT Style
--------------------------------------------- 
*/

.create-nft {
  /*background-image: url(../images/main-bg.jpg);*/
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 120px 0px;
  position: relative;
}

.create-nft .section-heading .line-dec {
  margin-left: 0%;
  background-color: #fff;
}

.create-nft .section-heading {
  text-align: left;
  margin-bottom: 50px;
}

.create-nft .main-button {
  text-align: right;
}

.create-nft .item {
  margin-top: 30px;
  position: relative;
}

.create-nft .first-item .number {
  position: absolute;
  right: 0;
  top: -20px;
}

.create-nft .first-item:after {
  position: absolute;
  width: 1px;
  height: 95%;
  background-color: rgba(255, 255, 255, 0.2);
  content: '';
  right: 5px;
  top: 5%;
}

.create-nft .second-item .number {
  position: absolute;
  right: 0;
  top: -20px;
}

.create-nft .second-item:after {
  position: absolute;
  width: 1px;
  height: 95%;
  background-color: rgba(255, 255, 255, 0.2);
  content: '';
  right: 5px;
  top: 5%;
}

.item .icon {
  width: 62px;
  height: 62px;
  display: inline-block;
  text-align: center;
  line-height: 62px;
  background-color: #fff;
  border-radius: 50%;
}

.create-nft .item .icon img {
  max-width: 31px;
}

.create-nft h4 {
  font-size: 20px;
  margin-top: 30px;
  margin-bottom: 15px;
}

.create-nft p {
  margin-right: 30px;
}

.create-nft .item a {
  color: #3CF;
}



/* 
---------------------------------------------
Currently Market Style
--------------------------------------------- 
*/

.currently-market {
  /*background-image: url(../images/dark-bg.jpg);*/
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 120px 0px;
  position: relative;
}

.currently-market-item {
  width: 45%;
  margin: 0 auto;
}

.currently-market .section-heading {
  text-align: left;
}

.currently-market .section-heading .line-dec {
  margin-left: 0;
}

.currently-market .filters {
  text-align: right;
}

.currently-market .filters ul li {
  display: inline-block;
  margin-left: 10px;
  font-size: 15px;
  color: #fff;
  font-weight: 500;
  padding: 8px 15px;
  border-radius: 20px;
  cursor: pointer;
  transition: all .3s;
}

.currently-market .filters ul li:first-child {
  margin-left: 0px;
}


.currently-market .filters ul li.active,
.currently-market .filters ul li:hover {
  background-color: #7453fc;
}

.currently-market .item {
  background-color: #282b2f;
  border: 1px solid #404245;
  border-radius: 20px;
  padding: 30px;
  display: flex;
  margin-bottom: 30px;
}

.currently-market .item .right-content {
  margin-left: 30px;
  width: 100%;
}

.currently-market .item .right-content h4 {
  font-size: 20px;
  margin-bottom: 25px;
}

.currently-market .item .right-content span.author {
  display: flex;
  margin-bottom: 25px;
}

.currently-market .item .right-content span.author img {
  margin-right: 15px;
}

.currently-market .item .right-content span.author h6 {
  font-size: 15px;
  font-weight: 400;
  line-height: 25px;
}

.currently-market .item .right-content span.author a {
  color: #7453fc;
  font-weight: 700;
  margin-top: 5px;
}

.currently-market .item span {
  color: #fff;
  display: inline-block;
  font-size: 15px;
}

.currently-market .item .line-dec {
  width: 100%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.2);
  margin-bottom: 25px;
  margin-top: 30px;
}

.currently-market .item span strong {
  font-size: 20px;
}

.currently-market .item span.bid {
  line-height: 35px;
}

.currently-market .item span.bid em,
.currently-market .item span.ends em {
  font-style: normal;
}

.currently-market .item span.ends {
  text-align: right;
  float: right;
  line-height: 35px;
}

.currently-market .item .text-button {
  margin-top: 40px;
}

.currently-market .item .text-button a {
  font-size: 15px;
  font-weight: 700;
  color: #7453fc;
  border-bottom: 1px solid #7453fc;
}



/* 
---------------------------------------------
Footer Style
--------------------------------------------- 
*/
/*
footer {
  background: rgb(125,90,254);
  background: linear-gradient(132deg, rgba(125,90,254,1) 25%, rgba(160,84,244,1) 100%);
  text-align: center;
  padding: 25px 0px;
}

footer p {
  color: #fff;
}

footer p a {
  color: #fff;
  font-weight: 500;
  transition: all .3s;
}

footer p a:hover {
  color: #fff;
  opacity: 0.75;
}

*/
/* 
---------------------------------------------
Page Heading Style
--------------------------------------------- 
*/

.normal-space {
  padding: 250px 0px 120px 0px !important;
}

.page-heading {
  /*background-image: url(../images/heading-bg.jpg);*/
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding-top: 250px;
  text-align: center;
  background-color: #2a2a2a;
}

.page-heading h6 {
  font-size: 20px;
  margin-bottom: 15px;
  font-weight: 500;
  letter-spacing: 0.5px;
}

.page-heading h2 {
  color: #fff;
  font-size: 50px;
  font-weight: 700;
  line-height: 66px;
  text-transform: uppercase;
}

.page-heading span {
  color: #8a75da;
  font-size: 15px;
}

.page-heading span a {
  color: #fff;
}

.page-heading .buttons {
  margin-top: 35px;
  display: flex;
  justify-content: center;
}

.page-heading .buttons .main-button {
  margin-right: 15px;
}

.page-heading .buttons .border-button {
  margin-left: 15px;
}



/* 
---------------------------------------------
Explore Style
--------------------------------------------- 
*/

.featured-explore {
  margin-top: 60px;
  margin-bottom: -300px;
}

.featured-explore .owl-features {
  min-height: 100%;
}

.featured-explore .item .thumb {
  position: relative;
  overflow: hidden;
}

.featured-explore .item .thumb:hover .hover-effect {
  visibility: visible;
  opacity: 1;
  right: 30px;
}

.featured-explore .item .thumb .hover-effect {
  position: absolute;
  right: -100%;
  bottom: 30px;
  padding: 30px 40px;
  border-radius: 20px;
  border: 1px solid rgba(64, 66, 69, 0.9);
  background-color: rgba(40, 43, 47, 0.9);
  opacity: 0;
  visibility: hidden;
  transition: all .5s;
}

.featured-explore .item .hover-effect .content h4 {
  font-size: 20px;
  margin-bottom: 25px;
}

.featured-explore .item .hover-effect .content span.author {
  display: flex;
  margin-bottom: 0px;
}

.featured-explore .item .hover-effect .content span.author img {
  margin-right: 15px;
}

.featured-explore .item .hover-effect .content span.author h6 {
  font-size: 15px;
  font-weight: 400;
  line-height: 25px;
  text-align: left;
}

.featured-explore .item .hover-effect .content span.author a {
  color: #7453fc;
  font-weight: 700;
  margin-top: 5px;
}

.featured-explore .owl-nav {
  position: absolute;
  width: 100%;
  margin: 0 auto;
  top: 50%;
  transform: translateY(-23px);
  text-align: center;
}

.featured-explore .owl-nav .owl-prev {
  position: absolute;
  left: 30px;
}

.featured-explore .owl-nav .owl-next {
  position: absolute;
  right: 30px;
}

.featured-explore .owl-nav .owl-prev span,
.featured-explore .owl-nav .owl-next span  {
  width: 46px;
  height: 46px;
  line-height: 46px;
  font-size: 22px;
  font-weight: 700;
  display: inline-block;
  color: #7453fc;
  background-color: #fff;
  border-radius: 50%;
  opacity: 0.5;
  transition: all .3s;
}

.featured-explore .owl-nav .owl-prev span:hover,
.featured-explore .owl-nav .owl-next span:hover {
  opacity: 1;
}

.discover-items {
  /*background-image: url(../images/dark-bg.jpg);*/
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 400px 0px 120px 0px;
  position: relative;
}

.discover-items .section-heading {
  text-align: left;
}

.discover-items .section-heading .line-dec {
  margin-left: 0;
}

.discover-items #search-form {
  margin-top: 15px;
}

.discover-items #search-form input,
.discover-items #search-form select {
  width: 100%;
  height: 46px;
  outline: none;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 23px;
  background-color: transparent;
  padding: 0px 15px;
  font-size: 14px;
  color: #fff;
}

.discover-items #search-form select {
  cursor: pointer;
}

.discover-items #search-form select option {
  background-color: #2a2a2a;
}

.discover-items #search-form input::placeholder,
.discover-items #search-form select::placeholder {
  color: #fff;
}

.discover-items #search-form button {
  font-size: 14px;
  color: #fff;
  background-color: #7453fc;
  border: 1px solid #7453fc;
  height: 46px;
  line-height: 46px;
  text-align: center;
  width: 100%;
  display: inline-block;
  border-radius: 25px;
  font-weight: 500;
  text-transform: capitalize;
  letter-spacing: 0.5px;
  transition: all .3s;
  position: relative;
  overflow: hidden;
}

.discover-items #search-form button:after {
  width: 78%;
  height: 2px;
  background-color: #fff;
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
}

.discover-items #search-form button:hover {
  background-color: #fff;
  color: #7453fc;
  border: 1px solid #fff;
}

.discover-items .item span.banner {
  font-size: 15px;
  background-color: #7453fc;
  color: #fff;
  font-weight: 500;
  padding: 5px 15px;
  display: inline-block;
  position: absolute;
  border-radius: 16px;
  left: 50%;
  transform: translateX(-50%);
  top: -16px;
}

.discover-items .item span.author {
  display: inline-flex;
  width: 100%;
}

.discover-items .item span.author img {
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.discover-items .item img {
  margin-top: -32px;
  position: relative;
  z-index: 1;
}

.discover-items .item h4 {
  font-size: 20px;
  margin-top: 30px;
}

.discover-items .item .line-dec {
  width: 100%;
  height: 1px;
  background-color: rgba(255,255,255,0.2);
  margin: 30px 0px;
}

.discover-items .item {
  background-color: #282b2f;
  border: 1px solid #404245;
  padding: 30px;
  border-radius: 20px;
  position: relative;
  margin-bottom: 52px;
}

.discover-items .item span {
  color: #fff;
  display: inline-block;
  font-size: 15px;
}

.discover-items .item span strong {
  font-size: 20px;
}

.discover-items .item span.category {
  text-align: right;
}

.discover-items .item .main-button {
  margin-top: 20px;
  margin-bottom: -60px;
  text-align: center;
}

.top-seller {
  /*background-image: url(../images/main-bg.jpg);*/
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 120px 0px 90px 0px;
  position: relative;
}

.top-seller .section-heading .line-dec {
  background-color: #fff;
}

.top-seller .item {
  display: flex;
  margin-bottom: 30px;
}

.top-seller .item img {
  margin-right: 15px;
}

.top-seller .item h4 {
  font-size: 20px;
  margin-top: 12px;
  margin-right: 10px;
}

.top-seller .item h6 {
  font-size: 20px;
  font-weight: 700;
  line-height: 25px;
  text-align: left;
}

.top-seller .item a {
  font-size: 14px;
  cursor: auto;
  color: #fff;
  font-weight: 400;
  margin-top: 5px;
}


/* 
---------------------------------------------
Details Page Style
--------------------------------------------- 
*/

.item-details-page {
  /*background-image: url(../images/dark-bg.jpg);*/
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 120px 0px 120px 0px;
  position: relative;
}

.item-details-page:after {
  /*background-image: url(/assets/images/category-collection-dec.png);*/
  width: 300px;
  height: 282px;
  position: absolute;
  bottom: 0;
  right: 30px;
  content: '';
  z-index: 1;
}

.item-details-page .left-image {
  margin-right: 30px;
}

.item-details-page h4 {
  font-size: 20px;
  margin-bottom: 25px;
}

.item-details-page span.author {
  display: flex;
  margin-bottom: 30px;
}

.item-details-page span.author img {
  margin-right: 15px;
}

.item-details-page span.author h6 {
  font-size: 15px;
  font-weight: 400;
  line-height: 25px;
}

.item-details-page span.author a {
  color: #7453fc;
  font-weight: 700;
  margin-top: 5px;
}

.item-details-page p {
  margin-bottom: 30px;
}

.item-details-page span {
  color: #fff;
  display: inline-block;
  font-size: 15px;
}

.item-details-page span strong {
  font-size: 20px;
  color: #7453fc;
}

.item-details-page p {
  position: relative;
  z-index: 2;
}

.item-details-page span.bid,
.item-details-page span.owner,
.item-details-page span.ends  {
  line-height: 35px;
  position: relative;
  z-index: 2;
}

.item-details-page span.bid em,
.item-details-page span.ends em,
.item-details-page span.owner em {
  font-style: normal;
  color: #afafaf;
}

.item-details-page form {
  margin-top: 40px;
}


.item-details-page form label {
  color: #afafaf;
  font-size: 15px;
  font-weight: 500;
  margin-right: 10px;
}

.item-details-page form input {
  width: 100px;
  height: 46px;
  border: 1px solid #7453fc;
  outline: none;
  border-radius: 23px;
  background-color: transparent;
  color: #fff;
  text-align: center;
  margin-right: 15px;
}

.item-details-page form input::placeholder {
  color: #fff;
}

.item-details-page button {
  font-size: 14px;
  color: #fff;
  background-color: #7453fc;
  border: 1px solid #7453fc;
  padding: 12px 30px;
  display: inline-block;
  border-radius: 25px;
  font-weight: 500;
  text-transform: capitalize;
  letter-spacing: 0.5px;
  transition: all .3s;
  position: relative;
  overflow: hidden;
}

.item-details-page button:after {
  width: 50%;
  height: 2px;
  background-color: #fff;
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
}

.item-details-page button:hover {
  background-color: #fff;
  color: #7453fc;
  border: 1px solid #fff;
}

.current-bid {
  margin-top: 120px;
}

.current-bid select {
  float: right;
  width: 150px;
  background-color: transparent;
  color: #fff;
  font-weight: 500;
  font-size: 14px;
  border: none;
  outline: none;
  cursor: pointer;
}

.current-bid .mini-heading h4 {
  background-color: #7453fc;
  display: inline-block;
  font-size: 20px;
  padding: 10px 20px;
  border-radius: 22px;
}

.current-bid .item {
  position: relative;
  z-index: 2;
  margin-top: 30px;
  display: flex;
  border-radius: 20px;
  overflow: hidden;
  background-color: #282b2f;
  border: 1px solid #404245;
}

.current-bid .item .left-img {
  flex-basis: 80%;
  display: inline-flex;
}

.current-bid .item .right-content {
  padding: 30px;
  width: 100%;
}

.current-bid .item .right-content h4 {
  font-size: 20px;
  margin-bottom: 0px;
}

.current-bid .item .right-content a {
  font-size: 15px;
  color: #7453fc;
  font-weight: 700;
}

.current-bid .item .right-content .line-dec {
  width: 100%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.2);
  margin: 25px 0px;
}

.current-bid .item .right-content h6 {
  font-size: 15px;
  font-weight: 400;
  margin-bottom: 8px;
}

.current-bid .item .right-content h6 em {
  font-size: 18px;
  color: #7453fc;
  font-style: normal;
  font-weight: 700;
}

.current-bid .item .right-content span.date {
  font-size: 15px;
  color: #7453fc;
}


/* 
---------------------------------------------
Author Page Style
--------------------------------------------- 
*/

.author-page {
  /*background-image: url(../images/dark-bg.jpg);*/
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 120px 0px 120px 0px;
  position: relative;
}

.author-page .author {
  display: flex;
}

.author-page .author h4 {
  margin-top: 60px;
  font-size: 20px;
  margin-left: 30px;
}

.author-page .author h4 a {
  font-size: 15px;
  color: #7453fc;
}

.author-page .right-info {
  background-color: #282b2f;
  border: 1px solid #404245;
  padding: 20px 30px;
  border-radius: 20px;
  margin-left: 100px;
}

.author-page .right-info .info-item {
  margin-bottom: 20px;
}

.author-page .right-info i {
  color: #7453fc;
  font-size: 22px;
}

.author-page .right-info h6 {
  font-size: 20px;
  color: #7453fc;
  margin-top: 4px;
}

.author-page .right-info h6 em {
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  color: #fff;
}

.author-page .right-info h5 {
  font-size: 20px;
  color: #afafaf;
  margin-top: 10px;
}

.author-page .right-info .main-button a {
  width: 100%;
  text-align: center;
}

.author-page .section-heading {
  margin-top: 80px;
  text-align: left;
}

.author-page .section-heading .line-dec {
  margin-left: 0;
}

.author-page .item span.author {
  display: inline-flex;
  width: 100%;
}

.author-page .item span.author img {
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.author-page .item img {
  margin-top: -32px;
  position: relative;
  z-index: 1;
}

.author-page .item h4 {
  font-size: 20px;
  margin-top: 30px;
}

.author-page .item .line-dec {
  width: 100%;
  height: 1px;
  background-color: rgba(255,255,255,0.2);
  margin: 30px 0px;
}

.author-page .item {
  background-color: #282b2f;
  border: 1px solid #404245;
  padding: 30px;
  border-radius: 20px;
  position: relative;
  margin-bottom: 52px;
}

.author-page .item span {
  color: #fff;
  display: inline-block;
  font-size: 15px;
}

.author-page .item span strong {
  font-size: 20px;
}

.author-page .item span.category {
  text-align: right;
}

.author-page .item .main-button {
  margin-top: 20px;
  margin-bottom: -60px;
  text-align: center;
}


/* ---------------------------------------------
Create Page Style (Contact)
--------------------------------------------- */

#contact {
  background-color: #37393c;
  border-radius: 20px;
  padding: 60px 30px;
  margin-bottom: 0; /* sayfana göre 120px de yapabilirsin */
}

#contact input {
  width: 100%;
  height: 46px;
  text-align: left;
  padding: 0px 15px;
  background-color: #282b2f;
  border: 1px solid #404245;
  margin-bottom: 30px;
  font-weight: 500;
  color: #afafaf;
}

#contact input::placeholder {
  color: #afafaf;
}

#contact label {
  font-size: 15px;
  color: #fff;
  margin-bottom: 8px;
  display: block;
}

/* textarea’yı input ile aynı stile yaklaştırdık (blade içinde inline verdik)
   istersen burada da tanımlayabilirsin: */
#contact textarea {
  width: 100%;
  text-align: left;
  padding: 12px 15px;
  background-color: #282b2f;
  border: 1px solid #404245;
  margin-bottom: 30px;
  font-weight: 500;
  color: #afafaf;
}

#contact textarea::placeholder {
  color: #afafaf;
}

#contact input#file {
  padding: 8px 0px;
  background-color: transparent;
  border: none;
  border-radius: 0px;
}

#contact button {
  margin-top: 10px;
  width: 100%;
  text-align: center;
}




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

body {
  overflow-x: hidden;
}

@media (max-width: 767px) {
  .top-seller .item {
    justify-content: center;
  }
}

@media (max-width: 992px) {
  .main-banner .owl-banner {
    margin-top: 80px;
  }
  .categories .item {
    margin-bottom: 35px;
  }
  .create-nft .section-heading,
  .currently-market .section-heading {
    text-align: center;
  }
  .currently-market-item {
    width: 100%;
  }
  .create-nft .section-heading .line-dec,
  .currently-market .section-heading .line-dec {
    margin: 0 auto;
  }
  .create-nft .main-button,
  .currently-market .filters {
    text-align: center;
  }
  .currently-market .filters {
    margin-bottom: 30px;
    margin-top: -30px;
  }
  .create-nft p {
    margin-right: 0px;
  }
  .create-nft .first-item:after,
  .create-nft .second-item:after,
  .create-nft .first-item .number,
  .create-nft .second-item .number {
    display: none;
  }
  .create-nft .item {
    text-align: center;
    margin-top: 45px;
  }
  .discover-items #search-form {
    margin-bottom: 40px;
    margin-top: -30px;
  }
  .discover-items #search-form fieldset {
    margin-bottom: 30px;
  }
  .top-seller .item h6 {
    font-size: 16px;
  }
  .item-details-page .left-image {
    margin-right: 0px;
    margin-bottom: 30px;
  }
  .current-bid select {
    float: none;
  }
  .author-page .author {
    justify-content: center;
  }
  .author-page .right-info {
    margin-left: 0px;
    margin-top: 30px;
  }
}

@media (max-width: 1200px) {
  
}

/*------- coursel tasrım ----------------------------------------------------------------*/

/* Cosmo hero - Owl senkron slider */
.cosmo-hero .owl-hero-text .hero-text-item {
  padding-right: 15px;
}

.cosmo-hero .owl-hero-text .owl-nav,
.cosmo-hero .owl-hero-text .owl-dots {
  display: none !important; /* sol tarafta ok/dot olmasın */
}

.cosmo-hero .owl-hero-images .item img {
  border-radius: 20px;
}

/* Mobile: görsel üstte olmasın, Liberty gibi alt alta gelsin */
@media (max-width: 992px) {
  .cosmo-hero .owl-hero-images {
    margin-top: 30px;
  }
}

/* =========================
   SOCIAL ICONS - sol ortalı sabit
========================= */

.header-social{
  position: fixed;
  left: 14px;            /* sol boşluk */
  top: 50%;              /* dikey ortalama */
  transform: translateY(-50%);
  z-index: 1200;

  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
}

/* ikon kutusu */
.header-social a{
  width: 44px;
  height: 44px;
  border-radius: 999px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  background: #ffffff;
  box-shadow: 0 10px 25px rgba(0,0,0,.12);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;

  text-decoration: none;
}

/* ikonun kendisi (fontawesome/bi fark etmez) */
.header-social a i{
  font-size: 20px;
  line-height: 1;
}

/* hover */
.header-social a:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(0,0,0,.16);
}

/* çok küçük ekranlarda soldan taşmasın */
@media (max-width: 420px){
  .header-social{ left: 8px; }
  .header-social a{ width: 40px; height: 40px; }
  .header-social a i{ font-size: 18px; }
}

/* İstersen mobilde gizle (açık kalsın istiyorsan bu bloğu sil) */
/*
@media (max-width: 992px){
  .header-social{ display:none; }
}
*/

.social-icons a[aria-label="Facebook"] {
    color: #3b5998;
}

.social-icons a[aria-label="Instagram"] {
    color: #e4405f;
}

.social-icons a[aria-label="Twitter"] {
    color: #55acee;
}

.social-icons a[aria-label="Youtube"] {
    color: #cd201f;
}

.social-icons a[aria-label="Linkedin"] {
    color: #0077b5;
}

.social-icons a[aria-label="Whatsapp"] {
    color: #25d366;
}

.social-icons a[aria-label="Tiktok"] {
    color: #000000;
}

/* =========================
   SOCIAL ICON LABEL (hover text)
========================= */

.header-social a{
  position: relative;
  overflow: visible;
}

/* yazı */
.header-social a::after{
  content: attr(data-title);
  position: absolute;
  left: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%) translateX(-6px);

  white-space: nowrap;
  padding: 6px 12px;
  border-radius: 8px;

  background: #7453fc;
  color: #fff;
  font-size: 13px;
  font-weight: 500;

  opacity: 0;
  pointer-events: none;
  transition: all .2s ease;

  box-shadow: 0 10px 25px rgba(0,0,0,.18);
}

/* küçük ok */
.header-social a::before{
  content: "";
  position: absolute;
  left: calc(100% + 2px);
  top: 50%;
  transform: translateY(-50%);

  border-width: 6px;
  border-style: solid;
  border-color: transparent #7453fc transparent transparent;

  opacity: 0;
  transition: all .2s ease;
}

/* hover */
.header-social a:hover::after,
.header-social a:hover::before{
  opacity: 1;
  transform: translateY(-50%) translateX(0);
}


/* Slogan 2 satırda kes */
.collections .owl-collection .item .down-content .collection{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Owl oklarını zorla göster */
.owl-collection .owl-nav{
  display: block !important;
}


/* çözümlerimiz ana sayfa tasarımı -------------------------------------------*/

/* ================================
   Solutions Page - HERO
================================ */
.page-heading.page-heading-solutions{
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 160px 0 90px 0;  /* header yüksekliğini düşünerek */
  overflow: hidden;
}

.page-heading.page-heading-solutions .page-heading-overlay{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.55);
  z-index: 0;
}

.page-heading.page-heading-solutions .container{
  position: relative;
  z-index: 1;
}

.page-heading.page-heading-solutions h6,
.page-heading.page-heading-solutions h2,
.page-heading.page-heading-solutions span,
.page-heading.page-heading-solutions .page-heading-slogan{
  color: #fff !important;
}

.page-heading.page-heading-solutions .page-heading-slogan{
  max-width: 820px;
  margin: 15px auto 0;
  font-size: 16px;
  line-height: 1.7;
  opacity: .95;
}

/* ================================
   Solutions Page - BODY
================================ */
.solutions-body{
  padding: 80px 0 20px;
}

.solutions-body-content{
  color: #fff; /* şablon koyu temada, içerik beyaz daha iyi */
  font-size: 16px;
  line-height: 1.8;
}

/* İçerikten gelen h2/h3/ul görünsün */
.solutions-body-content h2,
.solutions-body-content h3{
  color: #fff;
  margin-top: 22px;
}
.solutions-body-content ul{
  padding-left: 18px;
}
.solutions-body-content li{
  margin-bottom: 6px;
}

/* ================================
   Solutions List - Cards
================================ */
.solutions-list{
  padding-top: 40px;
}

/* Kart görsel */
.solution-thumb-link{
  display:block;
  border-radius: 20px;
  overflow:hidden;
}
.solution-thumb{
  width: 100%;
  height: 210px;
  object-fit: cover;
  border-radius: 20px;
  transition: transform .25s ease;
}
.solution-thumb-link:hover .solution-thumb{
  transform: scale(1.03);
}

/* Kart başlık link */
.solution-title a{
  color: #fff;
  text-decoration: none;
}
.solution-title a:hover{
  text-decoration: underline;
}

/* Slogan taşmasını kontrol et (2 satır) */
.solution-excerpt{
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255,255,255,0.88);

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 45px;
}

/* Mobilde hero padding ayarı */
@media (max-width: 992px){
  .page-heading.page-heading-solutions{
    padding: 130px 0 70px 0;
  }
  .solution-thumb{
    height: 200px;
  }
}
.solutions-body{
  margin-top: 0;
}


/* ---------------------------------- uygulama sürecimiz adım adım-----------------*/

/* =========================
   PROCESS STEPS (Categories)
   ========================= */
.process-steps .process-item {
  cursor: pointer;
  position: relative;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(35, 38, 45, .75);
  backdrop-filter: blur(6px);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  overflow: hidden;
  padding: 26px 18px 18px;
  min-height: 210px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/* hover / active */
.process-steps .process-item:hover,
.process-steps .process-item.is-active {
  transform: translateY(-2px);
  border-color: rgba(120, 89, 255, .7);
  box-shadow: 0 0 0 3px rgba(120, 89, 255, .20), 0 18px 45px rgba(0,0,0,.35);
}

/* ikon dairesi */
.process-steps .process-item .icon {
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: rgba(255,255,255, .95);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 14px;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}

.process-steps .process-item .icon img {
  /*
  width: 60px;
  height: 60px;
  */
  object-fit: contain;
  display: block;
}

/* başlık */
.process-steps .process-item h4 {
  margin: 0;
  font-weight: 700;
  color: #fff;
  text-align: center;
  line-height: 1.2;
  font-size: 18px;
}

/* ok butonu */
.process-steps .process-item .icon-button {
  margin-top: 14px;
}

.process-steps .process-item .icon-button a {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(120, 89, 255, .95);
  color: #fff;
  transition: transform .16s ease, filter .16s ease;
}

.process-steps .process-item .icon-button a:hover {
  transform: translateX(2px);
  filter: brightness(1.05);
}

/* CTA kartı ufak vurgu (isteğe bağlı) */
.process-steps .process-item.process-cta {
  border-color: rgba(120, 89, 255, .25);
}

/* Detay kutusu */
.process-details-box {
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(35, 38, 45, .65);
  backdrop-filter: blur(6px);
  padding: 22px;
  box-shadow: 0 14px 50px rgba(0,0,0,.25);
}

.process-details-head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 10px;
}

.process-details-icon {
  width: 54px;
  height: 54px;
  border-radius: 14px;
  background: rgba(255,255,255,.95);
  display: flex;
  align-items: center;
  justify-content: center;
}

.process-details-icon img {
  /*
  width: 34px;
  height: 34px;
  */
  object-fit: contain;
  display: block;
}

.process-details-title {
  margin: 0;
  color: #fff;
  font-weight: 800;
  font-size: 20px;
}

.process-details-text {
  margin: 0;
  color: rgba(255,255,255,.78);
  line-height: 1.65;
  font-size: 15px;
}

/* mobil düzen */
@media (max-width: 991px) {
  .process-steps .process-item {
    min-height: 190px;
    padding: 22px 16px 16px;
  }
  .process-steps .process-item h4 {
    font-size: 16px;
  }
  .process-details-title { font-size: 18px; }
}

/* =========================
   FIX: OK BUTONU GÖRÜNMÜYOR
   ========================= */

/* Kart dışına taşan ok kırpılmasın */
.process-steps .process-item{
  overflow: visible !important; /* <-- kritik */
}

/* Ok butonunu kartın altına sabitle */
.process-steps .process-item .icon-button{
  position: absolute;
  left: 50%;
  bottom: -22px;               /* yarısı dışarıda */
  transform: translateX(-50%);
  margin-top: 0 !important;
  z-index: 10;                 /* kartın üstünde */
}

/* Ok linki tıklanabilir olsun */
.process-steps .process-item .icon-button a{
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(120, 89, 255, 1);
  color: #fff;
  box-shadow: 0 10px 26px rgba(0,0,0,.35);
  position: relative;
  z-index: 11;
}

/* Ok ikon boyutu */
.process-steps .process-item .icon-button i{
  font-size: 22px;
  line-height: 1;
}

/* Hover animasyon (isteğe bağlı) */
.process-steps .process-item:hover .icon-button a,
.process-steps .process-item.is-active .icon-button a{
  transform: translateY(-2px);
  filter: brightness(1.06);
}

/* Ok alanı kartın altına taşınca alttan boşluk bırak (aşağıdaki açıklama kutusuna değmesin) */
.process-steps{
  padding-bottom: 28px;
}

/* Mobilde kart yüksekliği azalıyorsa ok taşmasın diye bottom ayarı */
@media (max-width: 991px){
  .process-steps .process-item .icon-button{
    bottom: -20px;
  }
  .process-steps .process-item .icon-button a{
    width: 48px;
    height: 48px;
  }
}

/* -----------------------   ürünlerimiz genel sayfa ------------------- */

.products-header span {
  color: #ffffff;
  font-size: 15px;
}

.products-page .filter-card{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  padding:16px;
  position: sticky;
  top: 16px;
}

.filter-card__head h5{ margin:0 0 12px; font-weight:800; }
.filter-block{ padding:12px 0; border-top:1px solid rgba(0,0,0,.06); }
.filter-title{ font-weight:700; margin-bottom:10px; }
.filter-meta{ font-size:13px; color:#6b7280; margin-top:6px; }

.filter-list{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:8px; }
.filter-item{
  display:flex; align-items:center; gap:10px;
  font-size:14px; color:#111827;
}
.filter-item input{ width:16px; height:16px; }

.products-topbar .search-wrap{
  position: relative;
}
.products-topbar .search-wrap i{
  position:absolute; left:12px; top:50%;
  transform:translateY(-50%);
  color:#6b7280;
}
.products-topbar .search-wrap input{
  padding-left:38px;
  height:44px;
  border-radius:12px;
}

.product-card{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  overflow:hidden;
  height:100%;
  transition:transform .15s ease, box-shadow .15s ease;
}
.product-card:hover{
  transform: translateY(-2px);
  box-shadow:0 16px 40px rgba(0,0,0,.10);
}

.product-card__img{
  position:relative;
  display:block;
  background:#f3f4f6;
  padding:14px;
  min-height:240px;
}
.product-card__img img{
  width:100%;
  height:220px;
  object-fit:contain;
  display:block;
}

.product-card__fav{
  position:absolute;
  right:12px; top:12px;
  width:34px; height:34px;
  border-radius:10px;
  border:1px solid rgba(0,0,0,.10);
  background:#fff;
  display:flex; align-items:center; justify-content:center;
}

.product-card__body{ padding:14px; }
.product-card__cat{
  font-size:12px;
  color:#6b7280;
  margin-bottom:6px;
}
.product-card__title{
  font-size:16px;
  font-weight:800;
  margin:0 0 10px;
}
.product-card__title a{ color:#111827; text-decoration:none; }

.product-card__bullets{
  list-style:none; padding:0; margin:0 0 12px;
  display:flex; flex-direction:column; gap:6px;
}
.product-card__bullets li{
  font-size:13px;
  color:#4b5563;
  display:flex; gap:8px; align-items:flex-start;
}

.product-card__footer{ margin-top:auto; }

.product-card__price{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  margin-top:10px;
  margin-bottom:10px;
  font-weight:700;
}

.product-card__price .price{
  font-size:18px;
}

.product-card__price .price--na{
  font-size:14px;
  font-weight:600;
  opacity:.7;
}

/* ---- ürünlerimiz kategorize alanı --- */


/* Sol filtre paneli: sticky + scroll */
.products-page .filter-card {
  position: sticky;
  top: 90px;                 /* header yüksekliğine göre ayarla */
  max-height: calc(100vh - 110px);
  overflow: auto;
  padding-right: 6px;        /* scrollbar taşmasını önler */
}

/* mobilde sticky iptal (isteğe bağlı) */
@media (max-width: 991px) {
  .products-page .filter-card {
    position: relative;
    top: auto;
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
}

/* Daha “kullanıcı dostu” scrollbar (Chrome/Safari/Edge) */
.products-page .filter-card::-webkit-scrollbar {
  width: 8px;
}
.products-page .filter-card::-webkit-scrollbar-thumb {
  background: rgba(120, 89, 255, .35);
  border-radius: 10px;
}
.products-page .filter-card::-webkit-scrollbar-track {
  background: rgba(255,255,255,.06);
  border-radius: 10px;
}

/* Sidebar kart */
.filter-card{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  overflow:hidden;
}

/* Başlık */
.filter-card__head{
  padding:14px 14px;
  border-bottom:1px solid rgba(0,0,0,.08);
}

/* İçerik: kaydırmalı alan */
.filter-card__body{
  padding:14px 14px;
  max-height: calc(100vh - 220px);
  overflow:auto;
}

/* Alt butonlar: sabit */
.filter-card__footer{
  padding:12px 14px;
  border-top:1px solid rgba(0,0,0,.08);
  background:#fff;
  position: sticky;
  bottom: 0;
  z-index: 5;
}

/* Sidebar sayfada sabit dursun (sticky) */
@media (min-width: 992px){
  .products-page aside.col-lg-3 .filter-card{
    position: sticky;
    top: 90px;
  }
}

/* Mobilde normal akış */
@media (max-width: 991px){
  .filter-card__body{ max-height: none; }
  .filter-card__footer{ position: relative; }
}

/* =========================
   MOBILE FILTER DRAWER
========================= */

/* Mobilde sol sidebarı gizle (desktop aynı kalsın) */
@media (max-width: 991px){
  .products-page aside.col-lg-3 { display: none; }
}

/* Filtre butonu (isteğe göre konum) */
.products-filter-btn{
  white-space: nowrap;
  border-radius: 999px;
}

/* Drawer wrapper */
.filter-drawer{
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none; /* kapalıyken tıklanmasın */
}

.filter-drawer.is-open{
  pointer-events: auto;
}

/* Overlay */
.filter-drawer__overlay{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.45);
  opacity: 0;
  transition: opacity .25s ease;
}

.filter-drawer.is-open .filter-drawer__overlay{
  opacity: 1;
}

/* Panel (sağdan gelir) */
.filter-drawer__panel{
  position: absolute;
  top: 0;
  right: 0;
  width: min(420px, 92vw);
  height: 100%;
  background: #fff;
  transform: translateX(110%);
  transition: transform .25s ease;
  display: flex;
  flex-direction: column;
  box-shadow: -20px 0 60px rgba(0,0,0,.25);
}

.filter-drawer.is-open .filter-drawer__panel{
  transform: translateX(0);
}

/* Head */
.filter-drawer__head{
  padding: 14px 14px;
  border-bottom: 1px solid rgba(0,0,0,.08);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.filter-drawer__title{
  font-weight: 800;
  font-size: 16px;
}

.filter-drawer__close{
  width: 40px;
  height: 40px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

/* Body scroll */
.filter-drawer__body{
  padding: 14px 14px;
  overflow: auto;
  flex: 1 1 auto;
}

/* Footer fixed inside drawer */
.filter-drawer__footer{
  padding: 12px 14px;
  border-top: 1px solid rgba(0,0,0,.08);
  background: #fff;
}
/* =========================
   MOBİL FİLTRE BUTONU
========================= */

.products-filter-btn{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  border-radius: 14px;
  font-weight: 700;
  border: 1px solid rgba(116, 83, 252, .35);
  background: linear-gradient(135deg, #7453fc, #9b7bff);
  color: #fff;
  box-shadow: 0 8px 22px rgba(116,83,252,.35);
  transition: all .2s ease;
  white-space: nowrap;
}

.products-filter-btn i{
  font-size: 14px;
}

.products-filter-btn:hover{
  transform: translateY(-1px);
  filter: brightness(1.05);
}

.products-filter-btn:active{
  transform: translateY(0);
}

/* SADECE MOBİLDE GÖRÜNSÜN */
@media (min-width: 992px){
  .products-filter-btn{
    display: none !important;
  }
}

/* --------------------satış kartı alanı-------------------   */
/* =========================
   SALES CARD GRID AREA
========================= */
.sales-cards-area{
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 90px 0 90px;
  margin-top:0px;
}

/* Kart kabuğu */
.sales-card-shell{
  border-radius: 20px;
  overflow: hidden;
  position: relative;
}

/* Owl item içi */
.sales-card-shell .item .thumb{
  position: relative;
  overflow: hidden;
  border-radius: 20px;
}

/* Resim: taşma yok, ürün kadraja sığsın */
.sales-thumb-img{
  width: 100%;
  height: clamp(260px, 32vw, 360px); /* responsive yükseklik */
  display: block;
  object-fit: contain;               /* ürün komple görünsün */
  background: rgba(0,0,0,.18);       /* boşluk kalırsa kötü durmasın */
  border-radius: 20px;
}

/* Hover panel: sağdan kayarak gelsin */
.sales-card-shell .hover-effect{
  position: absolute;
  right: -120%;
  bottom: 18px;
  padding: 18px 18px;
  border-radius: 16px;
  border: 1px solid rgba(64, 66, 69, 0.9);
  background-color: rgba(40, 43, 47, 0.92);
  opacity: 0;
  visibility: hidden;
  transition: all .35s ease;
  z-index: 5;
  max-width: calc(100% - 36px);
}

/* Desktop hover */
.sales-card-shell .thumb:hover .hover-effect{
  right: 18px;
  opacity: 1;
  visibility: visible;
}

/* Mobile/touch: JS ile .is-open */
.sales-card-shell .thumb.is-open .hover-effect{
  right: 18px;
  opacity: 1;
  visibility: visible;
}

.sales-hover-title{ color:#fff; text-decoration:none; }
.sales-hover-title:hover{ text-decoration: underline; }

.sales-card-shell .author{
  display:flex;
  gap:12px;
  align-items:center;
}

.sales-avatar{
  width: 46px !important;
  height: 46px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  display: block;
  flex: 0 0 46px;           /* flex içinde ezilmesin */
  max-width: none !important;/* global img max-width bozmasın */
}
.sales-card-shell .author .sales-avatar{
  width: 46px !important;
  height: 46px !important;
}
/* =========================
   OWL NAV (Liberty tarzı)
========================= */
.sales-card-shell .owl-nav{
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translateY(-50%);
  pointer-events: none; /* buton dışı tıklanabilsin */
  z-index: 6;
}

.sales-card-shell .owl-nav button{
  pointer-events: all; /* sadece buton tıklansın */
  position: absolute;
  width: 44px;
  height: 44px;
  border-radius: 50% !important;
  background: rgba(255,255,255,.85) !important;
  border: none !important;
  display: grid !important;
  place-items: center;
  opacity: .75;
  transition: .2s ease;
}

.sales-card-shell .owl-nav button:hover{
  opacity: 1;
  transform: scale(1.03);
}

.sales-card-shell .owl-nav .owl-prev{ left: 12px; }
.sales-card-shell .owl-nav .owl-next{ right: 12px; }

.sales-card-shell .owl-nav button span{
  font-size: 26px;
  font-weight: 700;
  line-height: 1;
  color: #7453fc;
}

/* Dots kapalı ama güvenlik */
.sales-card-shell .owl-dots{ display:none !important; }

.cosmo-about {
  margin-top: 0px;
}

.contact-margin {
  margin-top: 0px;
}
/* ---------------------------  footer alanı ----------------------------*/

/* =========================
   COSMO FOOTER (NEW)
========================= */
.cosmo-footer{
  position: relative;
  background-color: #6f55f2; /* görsel yoksa fallback mor */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
}

.cosmo-footer-overlay{
  position:absolute;
  inset:0;
  background: linear-gradient(90deg,
    rgba(116,83,252,.92),
    rgba(116,83,252,.82)
  );
  pointer-events:none;
}

.cosmo-footer-container{
  position: relative;
  z-index: 1;
  padding: 70px 16px 22px;
}

/* TOP GRID */
.cosmo-footer-top{
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 28px;
  align-items: center;
  margin-bottom: 34px;
}

.cosmo-footer-logo img{
  max-width: 360px;
  width: 100%;
  height: auto;
  display:block;
  filter: drop-shadow(0 18px 28px rgba(0,0,0,.25));
}

.cosmo-footer-desc{
  margin: 14px 0 0;
  color: rgba(255,255,255,.84);
  line-height: 1.8;
  font-size: 14.5px;
  max-width: 560px;
}

/* Subscribe box */
.cosmo-subscribe-form{
  border: 1px solid rgba(255,255,255,.15);
  background: rgba(0,0,0,.18);
  border-radius: 18px;
  padding: 18px 18px;
  backdrop-filter: blur(8px);
}

.cosmo-subscribe-title{
  margin: 0 0 6px 0;
  color: #fff;
  font-weight: 900;
  font-size: 16px;
}

.cosmo-subscribe-sub{
  margin: 0 0 14px 0;
  color: rgba(255,255,255,.8);
  font-size: 13.5px;
  line-height: 1.6;
}

.cosmo-subscribe-row{
  display:flex;
  gap: 12px;
  align-items: center;
}

.cosmo-subscribe-input{
  flex: 1 1 auto;
  height: 44px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.92);
  outline: none;
  font-weight: 600;
}

.cosmo-subscribe-btn{
  height: 44px;
  padding: 0 18px;
  border-radius: 999px;
  border: none;
  cursor: pointer;
  font-weight: 900;
  color: #1b1b1b;
  background: #fff;
  transition: .2s ease;
  white-space: nowrap;
}

.cosmo-subscribe-btn:hover{
  transform: translateY(-1px);
  filter: brightness(1.02);
}

/* CENTER LINKS */
.cosmo-footer-center{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.16);
}

.cosmo-footer-title{
  margin: 0 0 12px 0;
  color: #fff;
  font-weight: 900;
  font-size: 14px;
}

.cosmo-footer-links{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 10px;
}

.cosmo-footer-links a{
  color: rgba(255,255,255,.86);
  text-decoration: none;
  font-size: 13.5px;
}

.cosmo-footer-links a:hover{
  text-decoration: underline;
}

/* BOTTOM */
.cosmo-footer-bottom{
  margin-top: 26px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.16);
}

.cosmo-footer-bottom-inner{
  display:flex;
  gap: 14px;
  align-items:center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.cosmo-footer-bottom-links{
  display:flex;
  gap: 14px;
  flex-wrap: wrap;
}

.cosmo-footer-bottom-links a{
  color: rgba(255,255,255,.78);
  text-decoration:none;
  font-size: 12.5px;
}

.cosmo-footer-bottom-links a:hover{
  text-decoration: underline;
}

.cosmo-footer-copy{
  margin: 0;
  color: rgba(255,255,255,.72);
  font-size: 12.5px;
}

/* RESPONSIVE */
@media (max-width: 992px){
  .cosmo-footer-top{
    grid-template-columns: 1fr;
  }
  .cosmo-footer-center{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .cosmo-subscribe-row{
    flex-direction: column;
    align-items: stretch;
  }
  .cosmo-subscribe-btn{
    width: 100%;
  }
}

@media (max-width: 576px){
  .cosmo-footer-center{
    grid-template-columns: 1fr;
  }
  .cosmo-footer-logo img{
    max-width: 280px;
  }
}

/* ------------------- Ürün Detay (Beyaz Tema) ------------------- */

/* Genel arkaplan */
.shop-page{
  background:#ffffff;
}

/* Kart görünümü (beyaz zemin üzerinde net ayrım) */
.product-detail-card{
  background:#ffffff;
  border: 1px solid rgba(17,24,39,.08);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(17,24,39,.06);
}

/* Sol galeri alanı (hafif ayrım) */
.image-zoom-section{
  background: linear-gradient(180deg, #ffffff 0%, #fbfbfc 100%);
  border-right: 1px solid rgba(17,24,39,.06);
}

/* Sağ bilgi alanı */
.product-info-section{
  background:#ffffff;
}

/* Başlık + fiyat */
.product-info-section h3{
  color:#111827;
  letter-spacing: -.2px;
}

.product-price{
  color:#111827;
  font-weight: 800;
  letter-spacing: -.2px;
}

/* Açıklama */
.product-info-section p.text-muted{
  color:#6b7280 !important;
  line-height: 1.7;
}

/* --- Main Image --- */
.product-detail-card .product-main-img{
  width: 100%;
  height: auto;
  object-fit: contain;
  max-height: 520px;
  background: #ffffff;
  border-radius: 14px;
}

/* Swiper ana alan çerçeve */
.productGalleryMain{
  border: 1px solid rgba(17,24,39,.08) !important;
  border-radius: 16px !important;
  background:#ffffff;
}

/* Swiper okları (beyaz temaya uygun) */
.productGalleryPrev,
.productGalleryNext{
  width: 38px !important;
  height: 38px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(17,24,39,.10) !important;
  box-shadow: 0 8px 18px rgba(17,24,39,.10);
}
.productGalleryPrev::after,
.productGalleryNext::after{
  font-size: 14px !important;
  font-weight: 800;
  color:#111827;
}

/* --- Thumbs --- */
.productGalleryThumbs .swiper-slide{
  width: auto;
}

.thumb-btn{
  border: 1px solid rgba(17,24,39,.10);
  background: #ffffff;
  border-radius: 12px;
  padding: 6px;
  width: 86px;
  height: 86px;
  display: grid;
  place-items: center;
  transition: all .15s ease;
}

.thumb-btn:hover{
  border-color: rgba(17,24,39,.20);
  box-shadow: 0 8px 16px rgba(17,24,39,.08);
  transform: translateY(-1px);
}

.thumb-img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
}

/* Aktif thumb (Swiper active sınıfı üzerinden) */
.productGalleryThumbs .swiper-slide-thumb-active .thumb-btn{
  border-color: rgba(59,130,246,.55);
  box-shadow: 0 10px 22px rgba(59,130,246,.12);
}

/* --- Butonlar --- */
.btn-ecomm{
  padding: 12px 14px;
  border-radius: 14px;
  font-weight: 700;
}

.btn-ecomm.btn-success{
  box-shadow: 0 10px 20px rgba(16,185,129,.18);
}

.btn-ecomm.btn-light{
  background:#f9fafb;
  border: 1px solid rgba(17,24,39,.10);
  color:#111827;
}

/* Disabled buton (sepete ekle yakında) */
.btn-ecomm[disabled]{
  opacity: .65;
  cursor: not-allowed;
  box-shadow: none;
}

/* Opsiyonel tek rozet */
.opt-single .badge{
  background:#f9fafb !important;
  color:#111827;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px dashed rgba(17,24,39,.18);
}

/* (Sosyal alanı şimdilik kullanmayacağını söyledin ama stil kalsın) */
.share-pill{
  width: 44px;
  height: 44px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(17,24,39,.10);
  background: #ffffff;
  color: #111827;
  text-decoration: none;
  transition: all .15s ease;
}
.share-pill:hover{
  transform: translateY(-1px);
  border-color: rgba(17,24,39,.18);
  box-shadow: 0 10px 18px rgba(17,24,39,.10);
}

/* DL satırları */
.product-info-section dt{
  color:#111827;
  font-weight: 700;
}
.product-info-section dd{
  color:#4b5563;
}

/* Responsive */
@media (max-width: 991px){
  .image-zoom-section{
    border-right: 0;
    border-bottom: 1px solid rgba(17,24,39,.06);
  }
  .product-detail-card .product-main-img{
    max-height: 420px;
  }
  .thumb-btn{
    width: 74px;
    height: 74px;
  }
}

.share-pill{
  width: 44px;
  height: 44px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(0,0,0,.10);
  background: #fff;
  color: #111827;
  text-decoration: none;
  transition: .15s ease;
}

.share-pill:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 18px rgba(0,0,0,.08);
}

/* === Highlight features list === */
.ps-as{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 10px;
}

.ps-a{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  background: #fff;
}

.ps-aiw{
  font-size: 18px;
  color: #0d6efd; /* bootstrap primary */
  flex-shrink: 0;
}

.ps-ak{
  min-width: 140px;
  color: #111827;
}

.ps-av{
  color: #6b7280;
}

.product-info-section h6{
  color: #111827; /* koyu gri-siyah */
  font-weight: 600;
}

/* -------------ürün detay sayfası teknik özellikler alanı ----------------*/

/* =========================
   COSMO TECHNICAL SPECS
========================= */

.cosmo-tech-specs {
  background: #ffffff;
  padding: 64px 0;
  margin-top: 0px;
}

.cosmo-tech-header {
  margin-bottom: 24px;
}

.cosmo-tech-header h2 {
  font-size: 28px;
  font-weight: 700;
  color: #111827;
  margin-bottom: 8px;
}

.cosmo-tech-desc {
  color: #6b7280;
  font-size: 15px;
  max-width: 720px;
}

/* TABLE */
.cosmo-tech-table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  background: #ffffff;
}

.cosmo-tech-table thead th {
  background: #f9fafb;
  color: #374151;
  font-size: 14px;
  font-weight: 600;
  border-bottom: 1px solid #e5e7eb;
  padding: 14px 16px;
}

.cosmo-tech-table tbody tr {
  transition: background 0.2s ease;
}

.cosmo-tech-table tbody tr:hover {
  background: #f9fafb;
}

.cosmo-tech-table tbody th,
.cosmo-tech-table tbody td {
  padding: 14px 16px;
  border-bottom: 1px solid #e5e7eb;
  font-size: 14px;
  color: #111827;
  vertical-align: middle;
}

.cosmo-tech-table tbody th {
  font-weight: 600;
  width: 40%;
}

/* value highlight */
.cosmo-tech-table tbody td:last-child {
  font-weight: 500;
  color: #0f172a;
}

@media (max-width: 768px) {
  .cosmo-tech-table thead {
    display: none;
  }

  .cosmo-tech-table,
  .cosmo-tech-table tbody,
  .cosmo-tech-table tr,
  .cosmo-tech-table td,
  .cosmo-tech-table th {
    display: block;
    width: 100%;
  }

  .cosmo-tech-table tr {
    margin-bottom: 16px;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 12px;
  }

  .cosmo-tech-table td,
  .cosmo-tech-table th {
    border: none;
    padding: 6px 0;
  }

  .cosmo-tech-table td::before,
  .cosmo-tech-table th::before {
    content: attr(data-label);
    display: block;
    font-size: 12px;
    color: #6b7280;
    margin-bottom: 2px;
  }

  .cosmo-tech-table tbody th {
    font-size: 15px;
  }
}

.cosmo-tech-header{
  margin-bottom: 16px;
}

.cosmo-tech-title{
  font-size: 28px;
  font-weight: 700;
  color: #111827;
  margin: 0 0 8px 0;
}

.cosmo-tech-desc{
  margin: 0;
  color: #6b7280;
  font-size: 15px;
  max-width: 720px;
}

.advantage-use {
  margin-top:0px;
}

.body-2 {
  margin-top: 0px;
}


/* ----------------  benzer ürünler alanı -------*/

/* =========================
   Similar Products (White UI)
   Sadece .similar-products alanını etkiler
========================= */

.similar-products{
  background:#fff;
  color:#111827;
  padding: 56px 0;
}

/* başlık */
.similar-products .sp-head h5{
  margin:0 0 6px;
  font-weight:900;
  letter-spacing:-.02em;
  color:#111827 !important;
}
.similar-products .sp-head p{
  margin:0;
  color:#6B7280 !important;
}
.similar-products .sp-hr{
  height:1px;
  background: rgba(0,0,0,.10);
  margin: 18px 0 22px;
}

/* kart */
.similar-products .sp-card{
  background:#fff;
  border:1px solid rgba(0,0,0,.12);
  border-radius: 12px;
  overflow:hidden;
  box-shadow: 0 10px 22px rgba(17,24,39,.06);
  height: 100%;
  display:flex;
  flex-direction:column;
}

/* görsel alanı (t-shirt örneği gibi) */
.similar-products .sp-media{
  background:#E5E7EB;
  height: 260px;              /* kritik: tüm kartlarda sabit yükseklik */
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
}
.similar-products .sp-media img{
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;         /* kritik: ürün ortalanır */
  padding: 18px;
  display:block;
}

/* içerik alanı */
.similar-products .sp-body{
  padding: 14px 14px 12px;
  display:flex;
  flex-direction:column;
  gap: 10px;
  flex:1;
}

/* highlight list (ikon + değer) */
.similar-products .sp-features{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.similar-products .sp-features li{
  display:flex;
  align-items:flex-start;
  gap:8px;
  color:#111827 !important;
  font-size: 13px;
  line-height: 1.35;
}
.similar-products .sp-features i{
  margin-top: 2px;
  color:#111827 !important;
  opacity:.75;
}
.similar-products .sp-features .sp-k{
  font-weight:800;
  color:#111827 !important;
  margin-right:4px;
}
.similar-products .sp-features .sp-v{
  color:#374151 !important;
  font-weight:600;
}

/* başlık + link */
.similar-products .sp-title{
  margin: 2px 0 0;
  font-size: 14px;
  font-weight: 900;
  color:#111827 !important;
  line-height: 1.35;
}
.similar-products .sp-more{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size: 13px;
  color:#2563EB !important;
  font-weight: 800;
  text-decoration:none;
}
.similar-products .sp-more:hover{ text-decoration:underline; }

/* butonlar */
.similar-products .sp-actions{
  margin-top:auto; /* kartın en altına yapıştır */
  display:flex;
  flex-direction:column;
  gap:10px;
}
.similar-products .sp-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius:10px;
  padding:10px 12px;
  font-weight:800;
  border:1px solid rgba(0,0,0,.12);
  text-decoration:none;
  width:100%;
  cursor:pointer;
}
.similar-products .sp-btn-wa{
  background:#22C55E;
  color:#fff !important;
  border-color: rgba(34,197,94,.35);
}
.similar-products .sp-btn-wa:hover{ filter: brightness(.98); }

.similar-products .sp-btn-cart{
  background:#F9FAFB;
  color:#6B7280 !important;
}
.similar-products .sp-btn-cart[disabled]{
  opacity:.75;
  cursor:not-allowed;
}

/* responsive */
@media (max-width: 1200px){
  .similar-products .sp-media{ height: 240px; }
}
@media (max-width: 992px){
  .similar-products .sp-media{ height: 220px; }
}
@media (max-width: 576px){
  .similar-products{ padding: 38px 0; }
  .similar-products .sp-media{ height: 220px; }
}

/* --------------------- çözümlerimiz detay sayfası -----------*/

/* ================================
   COSMO | Solutions Detail (csd-*)
   ================================ */

/* Root */
.csd-page{
  --csd-text:#E5E7EB;
  --csd-muted:#AEB6C4;
  --csd-title:#FFFFFF;
  --csd-card:#0B0F16;
  --csd-border:rgba(255,255,255,.10);
  --csd-shadow: 0 22px 60px rgba(0,0,0,.45);
  --csd-radius:18px;
}

/* HERO */
.csd-hero{
  position:relative;
  padding: clamp(32px, 4vw, 56px) 0;
  color: var(--csd-title);
  overflow:hidden;
  background:#0b0f16;
}

.csd-hero__media{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  transform:scale(1.02);
}

/* overlay for readability */
.csd-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.70) 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,.55) 100%),
    linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,.70) 100%);
  z-index:1;
}

.csd-hero__inner{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 24px;
  align-items:center;
}

.csd-hero__kicker{
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color: rgba(255,255,255,.85);
}

.csd-hero__title{
  font-size: clamp(28px, 3.2vw, 44px);
  line-height:1.15;
  margin:10px 0 10px;
  font-weight:900;
}

.csd-hero__slogan{
  margin:0;
  color: rgba(255,255,255,.82);
  line-height:1.75;
  max-width: 58ch;
  font-size: 15.5px;
}

.csd-breadcrumb{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:14px;
  font-size:13px;
  color: rgba(255,255,255,.75);
}
.csd-breadcrumb a{ color: rgba(255,255,255,.85); text-decoration:none; }
.csd-breadcrumb a:hover{ text-decoration:underline; }
.csd-breadcrumb .csd-sep{ opacity:.65; }

/* Optional right column card */
.csd-hero__side{
  background: rgba(0,0,0,.35);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--csd-radius);
  padding: 16px;
  box-shadow: 0 18px 50px rgba(0,0,0,.35);
  backdrop-filter: blur(6px);
}
.csd-hero__side h3{
  margin:0 0 8px;
  font-size:14px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color: rgba(255,255,255,.85);
}
.csd-hero__side p{
  margin:0;
  color: rgba(255,255,255,.78);
  line-height:1.7;
  font-size:14px;
}

/* BODY background (space) */
.csd-body{
  padding: clamp(28px, 3.6vw, 52px) 0;
  background-color:#05060a;
  background-size:cover;
  background-position:center;
  position:relative;
}

.csd-body::before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(ellipse at 20% 20%, rgba(124,58,237,.10), transparent 45%),
              radial-gradient(ellipse at 80% 40%, rgba(59,130,246,.10), transparent 45%),
              linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.70) 100%);
  pointer-events:none;
}
.csd-body__inner{
  position:relative;
  z-index:1;
}

.csd-topline{
  text-align:center;
  margin-bottom: 26px;
}
.csd-topline__mini{
  display:inline-block;
  height:3px;
  width:48px;
  border-radius:999px;
  background:#7C3AED;
  margin-bottom:10px;
}
.csd-topline__title{
  margin:0;
  font-size: clamp(18px, 2.2vw, 26px);
  font-weight:900;
  color: var(--csd-title);
}
.csd-topline__desc{
  margin:10px auto 0;
  max-width: 78ch;
  color: var(--csd-muted);
  line-height:1.8;
  font-size:14.5px;
}

/* Content card wrapper for admin HTML */
.csd-content-wrap{
  max-width: 1080px;
  margin: 0 auto;
  background: rgba(0,0,0,.28);
  border: 1px solid var(--csd-border);
  border-radius: 22px;
  padding: clamp(16px, 2.6vw, 26px);
  box-shadow: var(--csd-shadow);
  backdrop-filter: blur(6px);
}

/* Normalize admin HTML inside */
.csd-content{
  color: var(--csd-text);
  font-size: 15px;
  line-height: 1.85;
}

/* headings inside admin HTML */
.csd-content h2,
.csd-content h3{
  color: var(--csd-title);
  font-weight: 900;
  letter-spacing: -.2px;
  margin: 18px 0 10px;
}
.csd-content h2{ font-size: 22px; }
.csd-content h3{ font-size: 18px; }

.csd-content p{
  margin: 0 0 12px;
  color: var(--csd-text);
}

/* lists */
.csd-content ul,
.csd-content ol{
  padding-left: 18px;
  margin: 8px 0 14px;
}
.csd-content li{
  margin: 6px 0;
  color: var(--csd-text);
}

/* links */
.csd-content a{
  color: #93C5FD;
  text-decoration: none;
}
.csd-content a:hover{ text-decoration: underline; }

/* Cards grid like “avantajlar” */
.csd-cards{
  margin-top: 18px;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.csd-card{
  background: rgba(0,0,0,.32);
  border: 1px solid var(--csd-border);
  border-radius: 18px;
  padding: 16px;
}
.csd-card__title{
  margin:0 0 8px;
  font-size: 16px;
  font-weight: 900;
  color: var(--csd-title);
}
.csd-card__text{
  margin:0;
  color: var(--csd-muted);
  line-height: 1.75;
  font-size: 14px;
}

/* Responsive */
@media (max-width: 992px){
  .csd-hero__inner{ grid-template-columns: 1fr; }
  .csd-hero__side{ order: 2; }
  .csd-cards{ grid-template-columns: 1fr; }
}

.csd-body {
  margin-top: 0px;
}

/* -----------------hakkımızda alanı---------------- */
/* =========================================================
   ABOUT PAGE (Cosmo) - Scoped
   Fix: sticky header -> hero offset
   ========================================================= */

#ca2About.ca2-about{
  background:#fff;
  color:#0f172a;
  isolation:isolate;
  --ca2-header-h: 0px; /* JS yazacak */
}

/* Dark theme override (sende genel tema koyuysa) */
#ca2About .ca2-section p,
#ca2About .ca2-section li,
#ca2About .ca2-section span{ color:#334155 !important; }
#ca2About .ca2-section h1,
#ca2About .ca2-section h2,
#ca2About .ca2-section h3{ color:#0b1220 !important; }

/* HERO */
#ca2About .ca2-hero{
  position:relative;
  min-height:460px;
  display:flex;
  align-items:flex-end;
  padding: calc(56px + var(--ca2-header-h)) 0 42px;
  overflow:hidden;
}

#ca2About .ca2-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--ca2-hero);
  background-size:cover;
  background-position:center;
  transform:scale(1.02);
  z-index:0;
}

#ca2About .ca2-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.58) 0%, rgba(0,0,0,.45) 45%, rgba(0,0,0,.18) 100%);
  z-index:1;
}

#ca2About .ca2-hero__box{
  position:relative;
  z-index:2;
  max-width:860px;
  padding:18px;
  border-radius:18px;
  background:rgba(0,0,0,.18);
  border:1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow:0 18px 40px rgba(0,0,0,.25);
}

#ca2About .ca2-kicker{
  display:inline-flex;
  padding:7px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#fff !important;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.20);
}

#ca2About .ca2-title{
  margin:10px 0 10px;
  font-size:44px;
  line-height:1.12;
  font-weight:900;
  letter-spacing:-.6px;
  color:#fff !important;
}

#ca2About .ca2-lead{
  margin:0;
  font-size:16px;
  line-height:1.85;
  color:rgba(255,255,255,.92) !important;
  max-width:72ch;
}

/* CTA */
#ca2About .ca2-cta{
  margin-top:16px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
#ca2About .ca2-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:12px;
  font-weight:800;
  border:1px solid rgba(255,255,255,.22);
  text-decoration:none !important;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
  white-space:nowrap;
}
#ca2About .ca2-btn--primary{
  background:#16a34a;
  border-color:rgba(22,163,74,.45);
  color:#fff !important;
  box-shadow:0 12px 26px rgba(22,163,74,.22);
}
#ca2About .ca2-btn--primary:hover{ transform:translateY(-1px); }
#ca2About .ca2-btn--ghost{
  background:rgba(255,255,255,.10);
  color:#fff !important;
}
#ca2About .ca2-btn--ghost:hover{ transform:translateY(-1px); }

/* Cards */
#ca2About .ca2-card{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:18px;
  padding:18px;
  box-shadow:0 14px 34px rgba(15,23,42,.06);
}
#ca2About .ca2-h2{
  margin:0 0 10px;
  font-size:22px;
  font-weight:900;
  letter-spacing:-.2px;
}
#ca2About .ca2-h2--xl{ font-size:28px; }
#ca2About .ca2-h3{
  margin:0 0 8px;
  font-size:18px;
  font-weight:900;
}
#ca2About .ca2-text{
  margin:0;
  line-height:1.85;
}

/* Badges */
#ca2About .ca2-badge{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  background:#ecfeff;
  border:1px solid rgba(6,182,212,.25);
  color:#0f172a !important;
  margin-bottom:10px;
}
#ca2About .ca2-badge--alt{
  background:#f0fdf4;
  border-color:rgba(22,163,74,.25);
}

/* Values list */
#ca2About .ca2-sub{ margin:0; color:#64748b !important; line-height:1.7; }
#ca2About .ca2-list{
  margin:10px 0 0;
  padding-left:18px;
  line-height:1.85;
}
#ca2About .ca2-list li{ margin:6px 0; }

@media (max-width: 991px){
  #ca2About .ca2-hero{
    min-height:340px;
    padding: calc(44px + var(--ca2-header-h)) 0 26px;
  }
  #ca2About .ca2-title{ font-size:30px; }
}

/* ---------------------- iletişim sayfası ------------*/

/* =========================================================
   COSMO CONTACT (Scoped) - Contact Page Theme
   Kullanım: <main class="cosmo-contact" id="cosmoContact"> ...
   ========================================================= */

.cosmo-contact{
  background:#fff;
  color:#0f172a;
  isolation:isolate;
}

/* Yazı renkleri (global dark theme override olmasın diye) */
.cosmo-contact p,
.cosmo-contact li,
.cosmo-contact span,
.cosmo-contact small{
  color:#334155;
}

.cosmo-contact h1,
.cosmo-contact h2,
.cosmo-contact h3{
  color:#0b1220;
}

.cosmo-contact a{ color:#2563eb; text-decoration:none; }
.cosmo-contact a:hover{ text-decoration:underline; }

/* ---------------- HERO ---------------- */
.cosmo-contact .cc-hero{
  position:relative;
  min-height:420px;
  display:flex;
  align-items:flex-end;
  padding:56px 0 36px;
  overflow:hidden;
}

/* background image via CSS var */
.cosmo-contact .cc-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--cc-hero);
  background-size:cover;
  background-position:center;
  transform:scale(1.02);
  z-index:0;
}

/* overlay */
.cosmo-contact .cc-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 360px at 70% 0%, rgba(99,102,241,.25), transparent 55%),
    linear-gradient(180deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.45) 45%, rgba(0,0,0,.25) 100%);
  z-index:1;
}

.cosmo-contact .cc-hero__inner{
  position:relative;
  z-index:2;
  max-width:920px;
  padding:18px 18px;
  border-radius:18px;
  background:rgba(0,0,0,.18);
  border:1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow:0 18px 40px rgba(0,0,0,.25);
}

.cosmo-contact .cc-kicker{
  display:inline-flex;
  padding:7px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:#ffffff;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.20);
}

.cosmo-contact .cc-title{
  margin:10px 0 8px;
  font-size:44px;
  line-height:1.12;
  font-weight:900;
  letter-spacing:-.6px;
  color:#ffffff;
}

.cosmo-contact .cc-breadcrumb{
  display:flex;
  gap:8px;
  align-items:center;
  font-size:13px;
  margin-bottom:10px;
  color:rgba(255,255,255,.85);
}
.cosmo-contact .cc-breadcrumb a{
  color:rgba(255,255,255,.92);
  font-weight:700;
  text-decoration:none;
}
.cosmo-contact .cc-breadcrumb a:hover{ text-decoration:underline; }
.cosmo-contact .cc-sep{ opacity:.75; }

.cosmo-contact .cc-lead{
  margin:0;
  font-size:16px;
  line-height:1.85;
  color:rgba(255,255,255,.92);
  max-width:75ch;
}

.cosmo-contact .cc-hero__actions{
  margin-top:16px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

/* Buttons */
.cosmo-contact .cc-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border-radius:12px;
  font-weight:800;
  border:1px solid rgba(255,255,255,.22);
  text-decoration:none !important;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
  white-space:nowrap;
}

.cosmo-contact .cc-btn--primary{
  background:#16a34a;
  border-color:rgba(22,163,74,.45);
  color:#fff !important;
  box-shadow:0 12px 26px rgba(22,163,74,.22);
}
.cosmo-contact .cc-btn--primary:hover{
  transform:translateY(-1px);
  color:#fff !important;
}

.cosmo-contact .cc-btn--ghost{
  background:rgba(255,255,255,.10);
  color:#fff !important;
}
.cosmo-contact .cc-btn--ghost:hover{
  transform:translateY(-1px);
}

/* ---------------- BODY ---------------- */
.cosmo-contact .cc-section{
  padding:34px 0 44px;
  background:#fff;
}

/* 2 kolon layout (kart + harita) */
.cosmo-contact .cc-grid{
  display:grid;
  grid-template-columns: 1fr 1.15fr;
  gap:16px;
  align-items:stretch;
}

/* Cards */
.cosmo-contact .cc-card{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:18px;
  padding:18px;
  box-shadow:0 14px 34px rgba(15,23,42,.06);
}

.cosmo-contact .cc-card__head{
  margin-bottom:12px;
}

.cosmo-contact .cc-h2{
  margin:0 0 6px;
  font-size:22px;
  font-weight:900;
  letter-spacing:-.2px;
  color:#0b1220;
}

.cosmo-contact .cc-sub{
  margin:0;
  color:#64748b;
  line-height:1.7;
}

/* list */
.cosmo-contact .cc-list{
  list-style:none;
  padding:0;
  margin:14px 0 0;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.cosmo-contact .cc-list li{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:12px;
  border-radius:14px;
  background:#f8fafc;
  border:1px solid rgba(0,0,0,.06);
}

.cosmo-contact .cc-ico{
  width:36px;
  height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:#eef2ff;
  border:1px solid rgba(37,99,235,.16);
  color:#1d4ed8;
  flex:0 0 auto;
}

.cosmo-contact .cc-li{
  flex:1;
}
.cosmo-contact .cc-li__k{
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#64748b;
  margin-bottom:2px;
}
.cosmo-contact .cc-li__v{
  font-size:15px;
  font-weight:800;
  color:#0f172a;
  line-height:1.45;
}
.cosmo-contact .cc-li__v a{ color:#0f172a; }

/* note */
.cosmo-contact .cc-note{
  margin-top:14px;
  padding:12px;
  border-radius:14px;
  background: linear-gradient(135deg, rgba(37,99,235,.08), rgba(16,185,129,.08));
  border:1px solid rgba(0,0,0,.08);
  color:#334155;
  line-height:1.75;
}

/* Map */
.cosmo-contact .cc-card--map{
  display:flex;
  flex-direction:column;
}

.cosmo-contact .cc-map{
  position:relative;
  margin-top:10px;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(0,0,0,.08);
  min-height:360px;
  background:#f8fafc;
}

.cosmo-contact .cc-map iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

.cosmo-contact .cc-map__empty{
  display:flex;
  align-items:center;
  justify-content:center;
  height:360px;
  color:#64748b;
  font-weight:800;
}

.cosmo-contact .cc-map__actions{
  margin-top:12px;
}

/* ---------------- Responsive ---------------- */
@media (max-width: 991px){
  .cosmo-contact .cc-hero{
    min-height:320px;
    padding:44px 0 26px;
  }
  .cosmo-contact .cc-title{ font-size:30px; }
  .cosmo-contact .cc-grid{
    grid-template-columns:1fr;
  }
  .cosmo-contact .cc-map{
    min-height:320px;
  }
}

/*** ------------------müşterilerimiz alanı -----------*/

/* =========================================================
   COSMO - Müşterilerimiz (clients) - DARK / SPACE THEME
   Fully scoped: .cosmo-clients
   ========================================================= */

.cosmo-clients{
  --bg1:#050611;
  --bg2:#070a1a;
  --g1:rgba(59,130,246,.16);
  --g2:rgba(16,185,129,.12);
  --g3:rgba(168,85,247,.14);
  --card:rgba(255,255,255,.06);
  --border:rgba(255,255,255,.14);
  --text:rgba(255,255,255,.88);
  --muted:rgba(255,255,255,.68);

  background:
    radial-gradient(900px 520px at 15% 10%, var(--g3), rgba(0,0,0,0) 60%),
    radial-gradient(1000px 560px at 85% 0%, var(--g1), rgba(0,0,0,0) 60%),
    radial-gradient(900px 560px at 10% 85%, var(--g2), rgba(0,0,0,0) 58%),
    linear-gradient(180deg, var(--bg2), var(--bg1));
  color:var(--text);
  isolation:isolate;
  position:relative;
  overflow:hidden;
}

/* star dots */
.cosmo-clients::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(1px 1px at 20% 30%, rgba(255,255,255,.55), rgba(0,0,0,0) 60%),
    radial-gradient(1px 1px at 70% 20%, rgba(255,255,255,.45), rgba(0,0,0,0) 60%),
    radial-gradient(1px 1px at 40% 80%, rgba(255,255,255,.35), rgba(0,0,0,0) 60%),
    radial-gradient(1px 1px at 85% 75%, rgba(255,255,255,.40), rgba(0,0,0,0) 60%),
    radial-gradient(1px 1px at 10% 65%, rgba(255,255,255,.30), rgba(0,0,0,0) 60%);
  opacity:.35;
}

/* HERO */
.cosmo-clients .cc-hero{
  position:relative;
  min-height:420px;
  display:flex;
  align-items:flex-end;
  padding:56px 0 36px;
  overflow:hidden;
}
.cosmo-clients .cc-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--cc-hero);
  background-size:cover;
  background-position:center;
  transform:scale(1.02);
  z-index:0;
  filter:saturate(1.05) contrast(1.05);
}
.cosmo-clients .cc-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.70) 0%, rgba(0,0,0,.55) 50%, rgba(0,0,0,.35) 100%);
  z-index:1;
}

.cosmo-clients .cc-hero__box{
  position:relative;
  z-index:2;
  max-width:920px;
  padding:18px 18px;
  border-radius:18px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow:0 18px 50px rgba(0,0,0,.35);
}

.cosmo-clients .cc-kicker{
  display:inline-flex;
  padding:7px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:#fff !important;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.16);
}
.cosmo-clients .cc-title{
  margin:10px 0 10px;
  font-size:44px;
  line-height:1.12;
  font-weight:900;
  letter-spacing:-.6px;
  color:#fff !important;
}
.cosmo-clients .cc-lead{
  margin:0;
  font-size:16px;
  line-height:1.85;
  color:rgba(255,255,255,.86) !important;
  max-width:72ch;
}

/* Actions */
.cosmo-clients .cc-actions{
  margin-top:16px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.cosmo-clients .cc-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:12px;
  font-weight:900;
  border:1px solid rgba(255,255,255,.18);
  text-decoration:none !important;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
  white-space:nowrap;
}
.cosmo-clients .cc-btn--primary{
  background: rgba(34,197,94,.92);
  border-color: rgba(34,197,94,.40);
  color:#fff !important;
  box-shadow:0 14px 28px rgba(34,197,94,.18);
}
.cosmo-clients .cc-btn--primary:hover{ transform:translateY(-1px); }
.cosmo-clients .cc-btn--ghost{
  background:rgba(255,255,255,.08);
  color:#fff !important;
}
.cosmo-clients .cc-btn--ghost:hover{ transform:translateY(-1px); }

/* Badges */
.cosmo-clients .cc-badges{
  margin-top:14px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.cosmo-clients .cc-badge{
  display:inline-flex;
  gap:8px;
  align-items:center;
  padding:8px 10px;
  border-radius:999px;
  background: rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.82);
  font-size:12px;
  font-weight:900;
}
.cosmo-clients .cc-dot{
  width:8px;height:8px;border-radius:50%;
  background: #93c5fd;
  box-shadow: 0 0 0 6px rgba(147,197,253,.12);
}
.cosmo-clients .cc-dot--g{
  background:#22c55e;
  box-shadow: 0 0 0 6px rgba(34,197,94,.12);
}

/* SECTIONS */
.cosmo-clients .cc-section{ padding:28px 0; background:transparent; }

.cosmo-clients .cc-card{
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px;
  padding:18px;
  box-shadow:0 18px 44px rgba(0,0,0,.28);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.cosmo-clients .cc-head{
  text-align:center;
  margin-bottom:12px;
}
.cosmo-clients .cc-h2{
  margin:0 0 10px;
  font-size:26px;
  font-weight:900;
  letter-spacing:-.2px;
  color:#fff !important;
}
.cosmo-clients .cc-sub{
  margin:0 auto;
  max-width:72ch;
  color:rgba(255,255,255,.72) !important;
  line-height:1.7;
}

/* Rich text from admin */
.cosmo-clients .cc-rich,
.cosmo-clients .cc-rich *{
  color: rgba(255,255,255,.80) !important;
}
.cosmo-clients .cc-rich h1,
.cosmo-clients .cc-rich h2,
.cosmo-clients .cc-rich h3{
  color: #fff !important;
}

/* CLIENT CARDS (Clickable) */
.cosmo-clients .cc-client{
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px;
  padding:16px;
  box-shadow:0 18px 44px rgba(0,0,0,.28);
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
  color: inherit;
}
.cosmo-clients .cc-client:hover{
  transform: translateY(-2px);
  border-color: rgba(255,255,255,.22);
  box-shadow:0 22px 60px rgba(0,0,0,.38);
}

.cosmo-clients .cc-client__top{
  display:flex;
  gap:12px;
  align-items:flex-start;
}
.cosmo-clients .cc-logo{
  width:56px;
  height:56px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(0,0,0,.25);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  flex:0 0 56px;
  box-shadow:0 10px 24px rgba(0,0,0,.25);
}
.cosmo-clients .cc-logo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.cosmo-clients .cc-logo--fallback{
  background:linear-gradient(135deg, rgba(147,197,253,.18), rgba(34,197,94,.14));
}
.cosmo-clients .cc-logo--fallback span{
  font-weight:900;
  color:#fff;
  font-size:18px;
}

.cosmo-clients .cc-h3{
  margin:0 0 6px;
  font-size:18px;
  font-weight:900;
  color:#fff !important;
}
.cosmo-clients .cc-text{
  margin:0;
  line-height:1.75;
  color: rgba(255,255,255,.72) !important;
}

.cosmo-clients .cc-client__bottom{
  margin-top:12px;
  display:flex;
  gap:10px;
  justify-content:flex-start;
  flex-wrap:wrap;
}
.cosmo-clients .cc-link{
  font-weight:900;
  color:#93c5fd !important;
  text-decoration:none;
}
.cosmo-clients .cc-link--muted{ color: rgba(255,255,255,.50) !important; }

/* EMPTY */
.cosmo-clients .cc-empty{
  margin-top:14px;
  background: rgba(255,255,255,.05);
  border:1px dashed rgba(255,255,255,.22);
  border-radius:18px;
  padding:18px;
}
.cosmo-clients .cc-empty .cc-h3{ color:#fff !important; }
.cosmo-clients .cc-empty .cc-text{ color: rgba(255,255,255,.72) !important; }

/* responsive */
@media (max-width: 991px){
  .cosmo-clients .cc-hero{ min-height:320px; padding:44px 0 26px; }
  .cosmo-clients .cc-title{ font-size:30px; }
}

/*-----müşterilerimi kart alanı ---*/

/* =========================================================
   NFT STYLE GRADIENT / GLASS CARD (Cosmo)
   ========================================================= */

.nft-card{
  --bg1:#0b0f1c;
  --bg2:#060814;
  --g1:rgba(59,130,246,.22);
  --g2:rgba(168,85,247,.18);
  --g3:rgba(16,185,129,.16);
  --line:rgba(255,255,255,.12);
  --text:rgba(255,255,255,.90);
  --muted:rgba(255,255,255,.68);

  display:flex;
  gap:18px;
  align-items:stretch;
  border-radius:22px;
  padding:16px;
  position:relative;
  overflow:hidden;

  background:
    radial-gradient(900px 500px at 20% 0%, var(--g2), rgba(0,0,0,0) 55%),
    radial-gradient(900px 520px at 85% 15%, var(--g1), rgba(0,0,0,0) 60%),
    radial-gradient(900px 520px at 10% 90%, var(--g3), rgba(0,0,0,0) 55%),
    linear-gradient(180deg, var(--bg1), var(--bg2));

  border:1px solid rgba(255,255,255,.10);
  box-shadow: 0 26px 70px rgba(0,0,0,.40);
  text-decoration:none;
  transition: transform .18s ease, box-shadow .18s ease;
}

.nft-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(1px 1px at 18% 22%, rgba(255,255,255,.45), rgba(0,0,0,0) 60%),
    radial-gradient(1px 1px at 62% 18%, rgba(255,255,255,.35), rgba(0,0,0,0) 60%),
    radial-gradient(1px 1px at 38% 76%, rgba(255,255,255,.25), rgba(0,0,0,0) 60%),
    radial-gradient(1px 1px at 88% 72%, rgba(255,255,255,.30), rgba(0,0,0,0) 60%),
    radial-gradient(1px 1px at 10% 66%, rgba(255,255,255,.20), rgba(0,0,0,0) 60%);
  opacity:.35;
  pointer-events:none;
}

.nft-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 34px 90px rgba(0,0,0,.52);
}

/* LEFT MEDIA */
.nft-card__media{
  width:220px;
  flex:0 0 220px;
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  box-shadow: 0 18px 44px rgba(0,0,0,.35);
  position:relative;
  z-index:1;
}

.nft-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.nft-card__placeholder{
  width:100%;
  height:100%;
  min-height:190px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.86);
  font-weight:900;
  font-size:44px;
  letter-spacing:.02em;
}

/* RIGHT CONTENT */
.nft-card__body{
  flex:1 1 auto;
  min-width:0;
  padding:6px 4px;
  position:relative;
  z-index:1;
  color:var(--text);
}

.nft-card__top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.nft-card__title{
  margin:2px 0 2px;
  font-size:22px;
  line-height:1.2;
  font-weight:900;
  color:#fff;
}

.nft-card__chip{
  display:inline-flex;
  align-items:center;
  padding:7px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.03em;
  color:#fff;
  background: rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  white-space:nowrap;
}

.nft-card__desc{
  margin:10px 0 12px;
  color:var(--muted);
  line-height:1.75;
  font-size:14px;
  max-width:72ch;
}

/* META GRID */
.nft-card__meta{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:12px;
  padding-top:10px;
  border-top:1px solid rgba(255,255,255,.10);
}

.nft-meta{
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  padding:10px 12px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.nft-meta__label{
  font-size:12px;
  color:rgba(255,255,255,.62);
  font-weight:800;
  letter-spacing:.02em;
}

.nft-meta__value{
  margin-top:3px;
  font-size:14px;
  font-weight:900;
  color:#fff;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* FOOTER */
.nft-card__footer{
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.nft-card__link{
  color:#a78bfa;
  font-weight:900;
  font-size:13px;
}

.nft-card__arrow{
  color:rgba(255,255,255,.70);
  font-weight:900;
  font-size:16px;
}

/* RESPONSIVE */
@media (max-width: 991px){
  .nft-card{ flex-direction:column; }
  .nft-card__media{ width:100%; flex:0 0 auto; height:220px; }
  .nft-card__meta{ grid-template-columns: 1fr; }
}

/* ------------ müşterilerimiz detay sayfası ---*/

/* =========================================================
   COSMO DETAIL (Blog / Müşteri Hikayesi / Detay)
   Dark space gradient + readable article
   ========================================================= */

.cosmo-detail{
  --bg1:#050611;
  --bg2:#070a1a;
  --g1:rgba(59,130,246,.22);
  --g2:rgba(168,85,247,.18);
  --g3:rgba(16,185,129,.16);

  --card:rgba(255,255,255,.06);
  --line:rgba(255,255,255,.14);

  --text:rgba(255,255,255,.90);
  --muted:rgba(255,255,255,.70);
  --title:#fff;

  background:
    radial-gradient(900px 520px at 18% 8%, var(--g2), rgba(0,0,0,0) 55%),
    radial-gradient(1000px 560px at 88% 10%, var(--g1), rgba(0,0,0,0) 60%),
    radial-gradient(900px 560px at 10% 90%, var(--g3), rgba(0,0,0,0) 55%),
    linear-gradient(180deg, var(--bg2), var(--bg1));
  color:var(--text);
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

/* star noise */
.cosmo-detail::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(1px 1px at 20% 30%, rgba(255,255,255,.55), rgba(0,0,0,0) 60%),
    radial-gradient(1px 1px at 70% 20%, rgba(255,255,255,.40), rgba(0,0,0,0) 60%),
    radial-gradient(1px 1px at 40% 80%, rgba(255,255,255,.30), rgba(0,0,0,0) 60%),
    radial-gradient(1px 1px at 85% 75%, rgba(255,255,255,.35), rgba(0,0,0,0) 60%),
    radial-gradient(1px 1px at 10% 65%, rgba(255,255,255,.22), rgba(0,0,0,0) 60%);
  opacity:.35;
  pointer-events:none;
  z-index:0;
}

.cosmo-detail .cd-hero,
.cosmo-detail .cd-section{
  position:relative;
  z-index:1;
}

/* HERO */
.cosmo-detail .cd-hero{
  padding:56px 0 26px;
}

.cosmo-detail .cd-hero__grid{
  display:grid;
  grid-template-columns: 360px 1fr;
  gap:22px;
  align-items:stretch;
}

.cosmo-detail .cd-media{
  border-radius:22px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  box-shadow: 0 26px 70px rgba(0,0,0,.40);
}

.cosmo-detail .cd-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  min-height:320px;
}

.cosmo-detail .cd-media__placeholder{
  min-height:320px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:rgba(255,255,255,.86);
  font-weight:900;
  font-size:56px;
  background: rgba(255,255,255,.06);
}

.cosmo-detail .cd-hero__box{
  border-radius:22px;
  padding:18px;
  background: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 18px 44px rgba(0,0,0,.28);
}

.cosmo-detail .cd-kicker{
  display:inline-flex;
  padding:7px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:#fff;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
}

.cosmo-detail .cd-title{
  margin:10px 0 8px;
  font-size:38px;
  line-height:1.14;
  font-weight:950;
  letter-spacing:-.6px;
  color:var(--title);
}

.cosmo-detail .cd-lead{
  margin:0;
  color:var(--muted);
  line-height:1.85;
  font-size:15px;
  max-width:75ch;
}

.cosmo-detail .cd-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}

.cosmo-detail .cd-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:12px;
  font-weight:900;
  text-decoration:none !important;
  border:1px solid rgba(255,255,255,.18);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
  color:#fff;
  white-space:nowrap;
}
.cosmo-detail .cd-btn:hover{ transform:translateY(-1px); }

.cosmo-detail .cd-btn--primary{
  background: rgba(34,197,94,.92);
  border-color: rgba(34,197,94,.40);
  box-shadow: 0 14px 28px rgba(34,197,94,.18);
}
.cosmo-detail .cd-btn--ghost{
  background: rgba(255,255,255,.08);
}

.cosmo-detail .cd-badges{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}
.cosmo-detail .cd-badge{
  display:inline-flex;
  gap:8px;
  align-items:center;
  padding:8px 10px;
  border-radius:999px;
  background: rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.82);
  font-size:12px;
  font-weight:900;
}
.cosmo-detail .cd-dot{
  width:8px;height:8px;border-radius:50%;
  background: rgba(147,197,253,1);
  box-shadow: 0 0 0 6px rgba(147,197,253,.12);
}
.cosmo-detail .cd-dot--g{
  background: rgba(34,197,94,1);
  box-shadow: 0 0 0 6px rgba(34,197,94,.12);
}

/* CONTENT */
.cosmo-detail .cd-section{ padding: 0 0 56px; }

.cosmo-detail .cd-article{
  margin-top:18px;
  border-radius:22px;
  padding:22px;
  background: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 18px 44px rgba(0,0,0,.28);
}

/* typography inside body */
.cosmo-detail .cd-article,
.cosmo-detail .cd-article *{
  color: rgba(255,255,255,.86);
}

.cosmo-detail .cd-article h1,
.cosmo-detail .cd-article h2,
.cosmo-detail .cd-article h3{
  color:#fff;
  font-weight:950;
  letter-spacing:-.3px;
}

.cosmo-detail .cd-article h2{ margin-top:18px; font-size:24px; }
.cosmo-detail .cd-article h3{ margin-top:14px; font-size:18px; }

.cosmo-detail .cd-article p{
  line-height:1.95;
  margin: 10px 0;
  color: rgba(255,255,255,.80);
  font-size:15px;
}

.cosmo-detail .cd-article a{
  color: rgba(167,139,250,1) !important;
  font-weight:900;
  text-decoration:none;
}
.cosmo-detail .cd-article a:hover{ text-decoration:underline; }

.cosmo-detail .cd-article ul,
.cosmo-detail .cd-article ol{
  padding-left: 18px;
  margin: 10px 0;
  color: rgba(255,255,255,.80);
}

.cosmo-detail .cd-article blockquote{
  margin: 14px 0;
  padding: 14px 14px;
  border-radius:16px;
  background: rgba(147,197,253,.10);
  border:1px solid rgba(147,197,253,.22);
  color: rgba(255,255,255,.86);
}

.cosmo-detail .cd-article img{
  max-width:100%;
  height:auto;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.12);
  box-shadow: 0 16px 40px rgba(0,0,0,.35);
  margin: 12px 0;
}

.cosmo-detail .cd-article table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
}
.cosmo-detail .cd-article th,
.cosmo-detail .cd-article td{
  padding:10px 12px;
  border-bottom:1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.82);
}
.cosmo-detail .cd-article th{
  color:#fff;
  font-weight:900;
  background: rgba(255,255,255,.06);
}

@media (max-width: 991px){
  .cosmo-detail .cd-hero{ padding:38px 0 18px; }
  .cosmo-detail .cd-hero__grid{ grid-template-columns: 1fr; }
  .cosmo-detail .cd-title{ font-size:28px; }
  .cosmo-detail .cd-media img,
  .cosmo-detail .cd-media__placeholder{ min-height:220px; }
}

/* ----------- anasayfa düzenlemeleri ------------*/

/* HERO SEO HEAD (slider üstü) */
.cosmo-hero-head{
  margin: 8px 0 18px;
  max-width: 980px;
}
.cosmo-hero-kicker{
  display:inline-flex;
  padding: 8px 12px;
  border-radius: 999px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: 12px;
  color: rgba(255,255,255,.92);
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
}
.cosmo-hero-h1{
  margin: 12px 0 8px;
  font-size: clamp(26px, 3.2vw, 44px);
  line-height: 1.1;
  font-weight: 900;
  color: #fff;
}
.cosmo-hero-intro{
  margin: 0;
  max-width: 72ch;
  color: rgba(255,255,255,.78);
  line-height: 1.7;
  font-size: 14px;
}

/* Slider text hierarchy (opsiyonel) */
.hero-h2{
  margin-top: 10px;
}

/* -------- çözümlerimiz ve adım süreci alanı */

.section-lead{
  margin: 10px 0 0;
  max-width: 85ch;
  color: rgba(255,255,255,.75);
  line-height: 1.7;
  font-size: 14px;
}

.process-step-title{
  font-size: 13px; /* tasarıma göre 12-14 arası */
  font-weight: 800;
  margin: 10px 0 0;
}

.solution-title{
  font-size: 15px;
  font-weight: 900;
  margin: 0 0 6px;
}

/* ---------- sabit iletişim formu ----------*/

.cosmo-contact .contact-card{
  background: rgba(40,43,47,.55);
  border: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(8px);
  border-radius: 18px;
  padding: 18px;
  box-shadow: 0 18px 60px rgba(0,0,0,.35);
}

.cosmo-contact .contact-kicker{
  color: rgba(255,255,255,.75);
  letter-spacing: .6px;
  font-weight: 700;
}

.cosmo-contact .contact-title{
  color: #fff;
}

.cosmo-contact .contact-sub{
  color: rgba(255,255,255,.70);
  max-width: 720px;
  margin: 10px auto 0;
  line-height: 1.7;
}

.cosmo-contact .field label{
  display:block;
  color: rgba(255,255,255,.80);
  margin: 0 0 6px;
  font-weight: 700;
  font-size: 13px;
}

.cosmo-contact .field input,
.cosmo-contact .field select,
.cosmo-contact .field textarea{
  width:100%;
  padding: 12px 14px;
  background-color:#282b2f;
  border:1px solid #404245;
  color:#e5e7eb;
  border-radius: 12px;
  outline: none;
}

.cosmo-contact .field textarea{ min-height: 160px; resize: vertical; }

.cosmo-contact .field input:focus,
.cosmo-contact .field select:focus,
.cosmo-contact .field textarea:focus{
  border-color: rgba(116,83,252,.85);
  box-shadow: 0 0 0 3px rgba(116,83,252,.22);
}

.cosmo-contact .field-help{
  display:block;
  margin-top: 6px;
  color: rgba(255,255,255,.55);
  font-size: 12px;
}

.cosmo-contact .privacy-note{
  margin: 10px 0 0;
  color: rgba(255,255,255,.55);
  font-size: 12px;
  text-align: center;
}
.cosmo-contact .privacy-note a{ color: rgba(255,255,255,.80); text-decoration: underline; }

.cosmo-contact .contact-info-title{
  color:#fff;
  font-weight: 900;
  margin: 0 0 12px;
  font-size: 18px;
}

.cosmo-contact .contact-info-list{ display:flex; flex-direction:column; gap: 12px; }

.cosmo-contact .contact-info-item{
  display:flex;
  gap: 12px;
  padding: 12px;
  border-radius: 14px;
  background: rgba(0,0,0,.20);
  border: 1px solid rgba(255,255,255,.08);
}

.cosmo-contact .contact-icon{
  width: 38px; height: 38px;
  border-radius: 12px;
  display:grid; place-items:center;
  color:#fff;
  background: rgba(116,83,252,.18);
  border: 1px solid rgba(116,83,252,.30);
  flex: 0 0 auto;
}

.cosmo-contact .contact-info-label{
  color: rgba(255,255,255,.70);
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 2px;
}

.cosmo-contact .contact-info-value{
  color:#fff;
  font-weight: 800;
  text-decoration:none;
}

.cosmo-contact .contact-map-link{
  display:block;
  margin-top: 12px;
  text-align:center;
  color:#fff;
  font-weight: 800;
  text-decoration:none;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
}
.cosmo-contact .contact-map-link:hover{ background: rgba(255,255,255,.10); }
/* ===== COSMO SUBMIT BUTTON (Glass + Glow) ===== */
.cosmo-btn-submit{
  position: relative;
  width: 100%;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  cursor: pointer;

  color: #fff;
  font-weight: 800;
  letter-spacing: .3px;

  background: linear-gradient(90deg, rgba(116,83,252,.85), rgba(255,122,24,.75));
  box-shadow:
    0 18px 40px rgba(0,0,0,.35),
    inset 0 0 0 1px rgba(255,255,255,.08);

  overflow: hidden;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}

.cosmo-btn-submit .cosmo-btn-text{
  position: relative;
  z-index: 2;
}

.cosmo-btn-submit .cosmo-btn-glow{
  position: absolute;
  inset: -60%;
  background: radial-gradient(circle, rgba(255,255,255,.40), rgba(255,255,255,.12), transparent 60%);
  opacity: .35;
  filter: blur(16px);
  transform: translateX(-8%);
  transition: opacity .22s ease, transform .22s ease;
}

.cosmo-btn-submit:hover{
  transform: translateY(-1px);
  filter: brightness(1.06);
  box-shadow:
    0 22px 55px rgba(0,0,0,.45),
    0 0 0 2px rgba(116,83,252,.15),
    inset 0 0 0 1px rgba(255,255,255,.12);
}

.cosmo-btn-submit:hover .cosmo-btn-glow{
  opacity: .55;
  transform: translateX(8%) scale(1.02);
}

.cosmo-btn-submit:active{
  transform: translateY(0);
  filter: brightness(1.02);
  box-shadow:
    0 14px 35px rgba(0,0,0,.35),
    inset 0 0 0 1px rgba(255,255,255,.14);
}

/* Klavye ile erişim (SEO/A11y katkısı) */
.cosmo-btn-submit:focus-visible{
  outline: none;
  box-shadow:
    0 0 0 3px rgba(116,83,252,.40),
    0 22px 55px rgba(0,0,0,.45);
}

/* Gönderim sırasında disable istersen */
.cosmo-btn-submit:disabled{
  opacity: .6;
  cursor: not-allowed;
  filter: grayscale(.2);
}

/* ------------- footer alanı -----------*/

.visually-hidden{
  position:absolute !important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

.cosmo-footer-nap{
  margin-top:14px;
  font-style:normal;
  color: rgba(255,255,255,.80);
}
.cosmo-nap-title{
  font-weight:800;
  margin: 0 0 8px 0;
  color:#fff;
}
.cosmo-nap-item{ margin: 0 0 6px 0; }
.cosmo-nap-item a{
  color:#fff;
  text-decoration: none;
  border-bottom: 1px dashed rgba(255,255,255,.35);
}
.cosmo-nap-item a:hover{ border-bottom-color: rgba(255,255,255,.75); }

.cosmo-subscribe-legal{
  margin-top:10px;
  font-size:12px;
  line-height:1.5;
  color: rgba(255,255,255,.70);
}
.cosmo-subscribe-legal a{
  color:#fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/*- ---------- header alani yeni *--------*/

/* ============ COSMO GLASS NAV (NO CONFLICT) ============ */
.cosmo-glass-header{
  position: fixed;
  top: 18px;
  left: 0;
  right: 0;
  z-index: 9999;
  pointer-events: none; /* inner aktif olacak */
}


.cosmo-glass-inner{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 14px;
  pointer-events: auto;
}

.cosmo-glass-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 16px;

  /* cam görünüm */
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);

  border-radius: 999px;
  padding: 14px 18px;

  box-shadow: 0 18px 50px rgba(0,0,0,.25);
  transition: all .25s ease;
}

.cosmo-glass-logo img{
  height: 54px;
  width: auto;
  display:block;
}

.cosmo-glass-nav{
  display:flex;
  align-items:center;
  gap: 14px;
}

.cosmo-glass-menu{
  list-style:none;
  display:flex;
  align-items:center;
  gap: 8px;
  margin: 0;
  padding: 0;
}

.cosmo-glass-item{ position: relative; }

.cosmo-glass-link{
  display:inline-flex;
  align-items:center;
  padding: 10px 14px;
  border-radius: 999px;
  text-decoration:none;
  font-weight: 700;
  font-size: 14px;
  color: rgba(255,255,255,.92);

  background: rgba(0,0,0,.18);
  border: 1px solid rgba(255,255,255,.12);
  transition: .2s ease;
}

.cosmo-glass-link:hover,
.cosmo-glass-link:focus{
  outline: none;
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.22);
}

.cosmo-glass-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 10px 16px;
  border-radius: 999px;
  text-decoration:none;
  font-weight: 900;
  color: #fff;
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
  background: linear-gradient(90deg, rgba(116,83,252,.92), rgba(255,122,24,.88));
  border: 1px solid rgba(255,255,255,.22);
  box-shadow: 0 14px 30px rgba(0,0,0,.25);
  transition: .2s ease;
  white-space: nowrap;
}

.cosmo-glass-cta:hover,
.cosmo-glass-cta:focus{
  filter: none; /* brightness bazen yazıyı “yedirir” */
  transform: translateY(-1px);
  box-shadow: 0 16px 34px rgba(0,0,0,.32);
  border-color: rgba(255,255,255,.35);
  text-shadow: 0 2px 10px rgba(0,0,0,.45);
}
/* Hover’da gradient biraz daha koyu/kontrast */
.cosmo-glass-cta:hover{
  background: linear-gradient(90deg, rgba(92,64,245,.98), rgba(255,122,24,.92));
}

/* Dropdown */
.cosmo-glass-sub{
  position:absolute;
  top: calc(100% + 10px);
  left: 0;
  min-width: 260px;
  padding: 10px;
  margin: 0;
  list-style:none;

  background: rgba(20,20,25,.55);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-radius: 18px;
  box-shadow: 0 18px 40px rgba(0,0,0,.35);

  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: .18s ease;
  z-index: 9999;
}

.cosmo-has-sub:hover > .cosmo-glass-sub{
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.cosmo-glass-sub .cosmo-glass-link{
  width: 100%;
  justify-content: flex-start;
  border-radius: 14px;
  padding: 10px 12px;
  background: rgba(255,255,255,.06);
}
/* ============ BURGER (MOBİL) ============ */
.cosmo-glass-burger{
  display:none;                 /* desktop'ta gizli */
  width:44px;
  height:44px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.18);

  cursor:pointer;
  padding:0;
  position:relative;            /* span'ler absolute olacak */
  -webkit-tap-highlight-color: transparent;
  outline: none;
  box-shadow: none;
}

/* Çizgiler: margin yerine absolute */
.cosmo-glass-burger span{
  position:absolute;
  left: 12px;
  right: 12px;
  height: 2px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  transform-origin: center;
  transition: transform .18s ease, opacity .18s ease;
}

/* 3 çizginin konumu */
.cosmo-glass-burger span:nth-child(1){ top: 14px; }
.cosmo-glass-burger span:nth-child(2){ top: 21px; }
.cosmo-glass-burger span:nth-child(3){ top: 28px; }

/* Açıkken X olsun */
.cosmo-glass-header.is-open .cosmo-glass-burger span:nth-child(1){
  transform: translateY(7px) rotate(45deg);
}
.cosmo-glass-header.is-open .cosmo-glass-burger span:nth-child(2){
  opacity: 0;
}
.cosmo-glass-header.is-open .cosmo-glass-burger span:nth-child(3){
  transform: translateY(-7px) rotate(-45deg);
}

/* iOS'ta çizgiler daha "sert" görünmesin */
@supports (-webkit-touch-callout: none){
  .cosmo-glass-burger span{ height: 1.8px; }
}

/* ============ MOBİL MENU AÇILIR KUTU ============ */
@media (max-width: 992px){
  /* Menü kutusu */
  .cosmo-glass-menu{
    position: absolute;
    top: calc(100% + 10px);
    right: 14px;
    left: 14px;
    z-index: 9999;

    display:flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px;

    background: rgba(20,20,25,.55);
    border: 1px solid rgba(255,255,255,.14);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-radius: 18px;

    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
  }

  /* Açık durum */
  .cosmo-glass-header.is-open .cosmo-glass-menu{
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }

  /* Burger görünür */
  .cosmo-glass-burger{ display:inline-block; }
}

/* desktop'ta menü normal akışta kalsın diye */
@media (min-width: 992px){
  .cosmo-glass-menu{
    position: static;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    background: transparent;
    border: 0;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    padding: 0;
  }
}

/* ===== Scroll state: full width, radius 0 (3. görsel) ===== */
.cosmo-glass-header.is-scrolled{
  top: 0;
}
.cosmo-glass-header.is-scrolled .cosmo-glass-inner{
  max-width: 100%;
  padding: 0;
}
.cosmo-glass-header.is-scrolled .cosmo-glass-row{
  border-radius: 0;
  padding: 12px 18px;
  background: rgba(255,255,255,.72);
  border-left: 0;
  border-right: 0;
  border-color: rgba(0,0,0,.08);
  box-shadow: 0 12px 32px rgba(0,0,0,.18);
}
/* Scroll modunda menü linkleri koyu olsun */
.cosmo-glass-header.is-scrolled .cosmo-glass-link{
  color: rgba(255,255,255,.92);                /* slate-900 */
  background: rgb(0 0 0);
  border-color: rgb(255,255,255);
}


/* Scroll modunda hover state */
.cosmo-glass-header.is-scrolled .cosmo-glass-link:hover,
.cosmo-glass-header.is-scrolled .cosmo-glass-link:focus{
  background: rgb(255 255 255);
  border-color: rgb(0 0 0);
  color: rgb(0 0 0 / 96%);
}

/* ---------- yeni güncel footer alanı -----------------*/
/* =========================
   COSMO FOOTER (SPACE CLEAN)
   ========================= */

/* yardımcı */
.cosmo-footer .visually-hidden{
  position:absolute !important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

.cosmo-footer{
  position: relative;
  overflow: hidden;
  color: rgba(255,255,255,.86);
  /* Uzay gradyan */
  background:
    radial-gradient(900px 520px at 15% 10%, rgba(124,58,237,.35), transparent 55%),
    radial-gradient(800px 520px at 85% 15%, rgba(34,211,238,.22), transparent 55%),
    radial-gradient(900px 600px at 70% 95%, rgba(34,197,94,.14), transparent 60%),
    linear-gradient(180deg, rgba(6,8,18,.98), rgba(10,12,28,.98));
}

/* yıldız noise */
.cosmo-footer::before{
  content:"";
  position:absolute;
  inset:-2px;
  pointer-events:none;
  opacity:.35;
  background-image:
    radial-gradient(1px 1px at 12% 18%, rgba(255,255,255,.55) 50%, transparent 51%),
    radial-gradient(1px 1px at 22% 72%, rgba(255,255,255,.35) 50%, transparent 51%),
    radial-gradient(1px 1px at 46% 32%, rgba(255,255,255,.45) 50%, transparent 51%),
    radial-gradient(1px 1px at 58% 82%, rgba(255,255,255,.25) 50%, transparent 51%),
    radial-gradient(1px 1px at 68% 18%, rgba(255,255,255,.38) 50%, transparent 51%),
    radial-gradient(1px 1px at 86% 44%, rgba(255,255,255,.30) 50%, transparent 51%),
    radial-gradient(1px 1px at 92% 76%, rgba(255,255,255,.22) 50%, transparent 51%);
  filter: blur(.25px);
}

/* ekstra “cam” overlay (çok bastırmasın) */
.cosmo-footer-overlay{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.05), rgba(255,255,255,0));
  opacity:.6;
}

.cosmo-footer-container{
  position: relative;
  z-index: 1;
  padding: 72px 16px 24px;
}

/* TOP */
.cosmo-footer-top{
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 28px;
  align-items: start;
  margin-bottom: 34px;
}

.cosmo-footer-brand{
  text-align: left;
}

.cosmo-footer-logo img{
  max-width: 260px;
  width: 100%;
  height: auto;
  display:block;
  filter: drop-shadow(0 18px 28px rgba(0,0,0,.35));
}

.cosmo-footer-desc{
  margin: 14px 0 0;
  color: rgba(255,255,255,.82);
  line-height: 1.8;
  font-size: 14.5px;
  max-width: 620px;
}

/* NAP */
.cosmo-footer-nap{
  margin-top: 16px;
  font-style: normal;
  color: rgba(255,255,255,.78);
  text-align: left;
}

.cosmo-nap-title{
  font-weight: 900;
  margin: 0 0 10px 0;
  color: rgba(255,255,255,.92);
  letter-spacing: .2px;
}

.cosmo-nap-item{
  margin: 0 0 8px 0;
  line-height: 1.6;
}

.cosmo-footer a{
  color: rgba(255,255,255,.90);
  text-decoration: none;
}

.cosmo-footer a:hover{
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Subscribe box */
.cosmo-footer-subscribe{
  text-align: left;
}

.cosmo-subscribe-form{
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  border-radius: 18px;
  padding: 18px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 22px 70px rgba(0,0,0,.35);
}

.cosmo-subscribe-title{
  margin: 0 0 6px 0;
  color: rgba(255,255,255,.95);
  font-weight: 900;
  font-size: 16px;
}

.cosmo-subscribe-sub{
  margin: 0 0 14px 0;
  color: rgba(255,255,255,.78);
  font-size: 13.5px;
  line-height: 1.6;
}

.cosmo-subscribe-row{
  display:flex;
  gap: 10px;
  align-items: center;
}

.cosmo-subscribe-input{
  flex: 1 1 auto;
  height: 44px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.92);
  outline: none;
  font-weight: 700;
}

.cosmo-subscribe-btn{
  height: 44px;
  padding: 0 18px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  font-weight: 900;
  color: #0b0b10;
  background: linear-gradient(90deg, #7c3aed, #0ea5e9);
  box-shadow: 0 12px 30px rgba(124,58,237,.25);
  transition: transform .15s ease, filter .15s ease;
  white-space: nowrap;
}

.cosmo-subscribe-btn:hover{
  transform: translateY(-1px);
  filter: brightness(1.06);
}

.cosmo-subscribe-legal{
  margin-top:10px;
  font-size:12px;
  line-height:1.5;
  color: rgba(255,255,255,.70);
}

/* CENTER LINKS */
.cosmo-footer-center{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.14);
  text-align: left;
}

.cosmo-footer-title{
  margin: 0 0 12px 0;
  color: rgba(255,255,255,.92);
  font-weight: 900;
  font-size: 14px;
}

.cosmo-footer-links{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 10px;
}

.cosmo-footer-links a{
  color: rgba(255,255,255,.82);
  font-size: 13.5px;
}

/* BOTTOM */
.cosmo-footer-bottom{
  margin-top: 28px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.14);
}

.cosmo-footer-bottom-inner{
  display:flex;
  gap: 14px;
  align-items:center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.cosmo-footer-bottom-links{
  display:flex;
  gap: 14px;
  flex-wrap: wrap;
}

.cosmo-footer-bottom-links a{
  color: rgba(255,255,255,.74);
  font-size: 12.5px;
}

.cosmo-footer-copy{
  margin: 0;
  color: rgba(255,255,255,.66);
  font-size: 12.5px;
}

/* RESPONSIVE */
@media (max-width: 992px){
  .cosmo-footer-container{ padding: 56px 16px 22px; }

  .cosmo-footer-top{
    grid-template-columns: 1fr;
  }

  .cosmo-footer-center{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cosmo-subscribe-row{
    flex-direction: column;
    align-items: stretch;
  }
  .cosmo-subscribe-btn{ width: 100%; }
}

@media (max-width: 576px){
  .cosmo-footer-center{ grid-template-columns: 1fr; }
  .cosmo-footer-logo img{ max-width: 220px; }
}

/* --performans iyileştirme -*/
.owl-dot:focus-visible{
  outline: 3px solid rgba(34,211,238,.8);
  outline-offset: 3px;
  border-radius: 999px;
}
.hero-kicker{
  font-size: 14px;
  letter-spacing: .12em;
  text-transform: uppercase;
  opacity: .85;
  margin-bottom: 8px;
}
.hero-slide-title{
  margin-top: 8px;
}

/* Filtre alanı: Sıfırla butonu kontrast fix */
.btn-reset-contrast{
  color: rgba(255,255,255,.92) !important;
  border-color: rgba(255,255,255,.45) !important;
  background: rgba(255,255,255,.08) !important;
  font-weight: 700;
}

.btn-reset-contrast:hover,
.btn-reset-contrast:focus{
  color: #0b0b10 !important;
  background: rgba(255,255,255,.92) !important;
  border-color: rgba(255,255,255,.92) !important;
  box-shadow: 0 0 0 .2rem rgba(255,255,255,.18) !important;
}
/* Mobil drawer footer kontrast fix */
.filter-drawer__footer{
  background: rgba(10,10,18,.92);
  border-top: 1px solid rgba(255,255,255,.14);
}
.filter-drawer__footer,
.filter-drawer__footer *{
  color: rgba(255,255,255,.92);
}
.filter-card__footer .btn:focus-visible,
.filter-drawer__footer .btn:focus-visible{
  outline: 2px solid rgba(255,255,255,.85);
  outline-offset: 2px;
}

.btn-outline-secondary{
  color: #495057;          /* koyu gri */
  border-color: #495057;
  background-color: #fff;  /* transparan yerine beyaz */
}

.btn-outline-secondary:hover{
  background-color: #495057;
  color: #fff;
}
.js-apply-filters{
  background-color: #1f3fe3 !important;
  border-color: #1f3fe3 !important;
  color: #ffffff !important;
}

.filter-card h2{
  color:#000000;
}
.filter-title {
  color:#000000;
}

/* Mobile filter drawer header */
.filter-drawer__head {
  background-color: #0f172a; /* koyu lacivert (kontrast yüksek) */
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* Başlık */
.filter-drawer__title {
  color: #ffffff; /* beyaz yazı */
  font-weight: 600;
  margin: 0;
}

/* Kapat butonu */
.filter-drawer__close {
  background: transparent;
  border: 0;
  color: #ffffff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
/* Drawer açılınca çerez butonunu kapat (üst üste binmeyi bitirir) */
body.drawer-open #openCookieSettings {
  display: none !important;
}

/* --- özümlerimiz genel sayfa performans iyileştirmesi */

/* ====== A11Y: Dokunma hedefleri (min 44x44) ====== */

/* Kart içindeki tüm linkleri güvene al */
.solution-card a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  min-width: 44px;
}

/* Görsel linki: tam blok alan + rahat tıklanır */
.solution-thumb-link {
  display: block !important;
  min-height: 44px;
  border-radius: 12px;           /* varsa tasarıma uyum */
  overflow: hidden;              /* görsel taşmasın */
}

/* Görselin kendisi: blok + tıklama alanını bozmasın */
.solution-thumb {
  display: block;
  width: 100%;
  height: auto;
}

/* Başlık linki: metin kadar değil, satır/padding kadar tıklansın */
.solution-title a {
  display: inline-block;
  padding: 10px 8px;
  line-height: 1.3;
}

/* "Daha Fazlası" butonu: gerçek buton gibi 44px */
.main-button a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 16px;
  border-radius: 999px;          /* pill */
}

/* Linkler arası boşluk (yanlış tıklamayı azaltır) */
.solution-title { margin-top: 10px; }
.main-button { margin-top: 12px; }

/* Küçük ekranlarda daha da rahat olsun */
@media (max-width: 576px) {
  .solution-title a { padding: 12px 10px; }
  .main-button a { width: 100%; } /* mobilde tek satır full */
}

/*iletişim performans iyileştrime */

/* Kontrast düzeltme: cc primary buton */
.cc-btn.cc-btn--primary{
  background:#166534 !important;     /* koyu yeşil */
  border-color:#14532d !important;
  color:#ffffff !important;
}

/* Hover / focus durumunda daha da net */
.cc-btn.cc-btn--primary:hover,
.cc-btn.cc-btn--primary:focus{
  background:#14532d !important;
  border-color:#0f3d22 !important;
  color:#ffffff !important;
}

/* İstersen odak (klavye) görünürlüğü */
.cc-btn:focus-visible{
  outline: 3px solid rgba(255,255,255,.65);
  outline-offset: 2px;
}

/* ---- ürünlerimiz detay sayfası performans iyileştirme ---*/
/* Ürün detay sayfası WhatsApp butonu (Bootstrap btn-success override) */
a.btn.btn-success.btn-ecomm{
  background-color:#0b5a2a !important;   /* daha koyu yeşil */
  border-color:#0b5a2a !important;
  color:#ffffff !important;
}

/* Hover */
a.btn.btn-success.btn-ecomm:hover{
  background-color:#084820 !important;
  border-color:#084820 !important;
  color:#ffffff !important;
}

/* Focus (erişilebilirlik) */
a.btn.btn-success.btn-ecomm:focus-visible{
  outline:3px solid rgba(255,255,255,.85);
  outline-offset:2px;
  box-shadow:none;
}


/* Benzer ürünler: custom WhatsApp butonu */
a.sp-btn.sp-btn-wa{
  background-color:#0b5a2a;
  border:1px solid #0b5a2a;
  color:#ffffff;
}

/* Hover */
a.sp-btn.sp-btn-wa:hover{
  background-color:#084820;
  border-color:#084820;
  color:#ffffff;
}

/* Focus */
a.sp-btn.sp-btn-wa:focus-visible{
  outline:3px solid rgba(255,255,255,.85);
  outline-offset:2px;
}

/* Ürün detay sayfası başlık renk fix (sadece bu sayfa/alan) */
.shop-page .product-info-section h1,
.shop-page .product-info-section h2,
.shop-page .product-info-section h3,
.shop-page .product-info-section h4,
.shop-page .product-info-section h5,
.shop-page .product-info-section h6{
  color: #111827 !important; /* koyu yazı */
}

/* Açıklama metni zaten text-muted kullanıyor, ama yine de garanti */
.shop-page .product-info-section p,
.shop-page .product-info-section span,
.shop-page .product-info-section label{
  color: #374151; /* koyu gri */
}

/* text-muted Bootstrap ise bazen override ediliyor */
.shop-page .product-info-section .text-muted{
  color: #6B7280 !important;
}