:root {
  --primary: #3CB815;
  --secondary: #f15d30;
  --light: #F7F8FC;
  --dark: #111111;
}
body, html {
    padding: 0;
    margin: 0;
    max-width: 100%;
    width: 100%;
    height: 100%;
    background-color: #f3f7fe;
    font-family: sans-serif;
    line-height: 1.8;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.modal {
    padding-right: 0px !important;
}
a{
  text-decoration: none;
}
p{
  font-size: 16px;
  font-weight: 400;
  color: black !important;
}
h1{
  font-size: 40px;
  font-weight: 600;
  line-height: 1.4;
  display: block;
  margin-block-start: 0.83em;
  margin-block-end: 0.83em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  unicode-bidi: isolate;


}
h2 {

    color: #01295f;
}




main a{
  text-decoration: none;
  color: black;
}
/*.navbar .navbar-nav .nav-link {*/
  /*padding: 25px 15px;*/
  /*color: #555555;
  font-weight: 500;
  outline: none;
}
.navbar a{
  font-size: 20px;
  color: black !important;
}*/

.etiket {
    text-align: center;
    margin: 3px;
    background-color: #f15d30bd;
    padding: 0.5rem 1.5rem 0.5rem 1.5rem;
    border-radius: 3rem;
    font-weight: 400;
    color: white;
    align-content:center;
}

.etiketTarih{
  max-width: 100px;
 background-color:#00000056;
 padding:0.5rem 2rem 0.5rem 2rem;
 border-radius: 3rem;
 font-weight: 400;
 color: white;
}
.basvur{
  background-color: var(--primary);
  color: white;
  width:200px;
  font-size: 20px;
}
.basvur:hover{
  border:2px solid white;
}

.etkinlikH {
    font-weight: 600;
    font-size: 35px;
    color: var(--dark);
    font-weight: 600;
}
.altMenu{
  position: fixed;
  z-index: 9;
  bottom: 10px;
  width:100% !important;
}
.altMenu .card{
  font-size: 20px;
  border:2px solid white;
  border-radius: 15px;
  text-align: center;
  color: white;
  background-color:#05314694;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: 0.4s;

}
.altMenu .card:hover{
  background: var(--secondary);
color: rgb(255, 255, 255);
backdrop-filter: blur(30.7px);
-webkit-backdrop-filter: blur(4.7px);
}

.carousel-control-prev-icon {
    width: 3rem;
    height: 3rem;
    background-color: var(--primary);
    border: 10px solid var(--primary);
    border-radius: 3rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}

.carousel-control-next-icon {
    width: 3rem;
    height: 3rem;
    background-color: var(--primary);
    border: 10px solid var(--primary);
    border-radius: 3rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.owlDiv {
    width: 80%;
    margin: 0 auto;
    padding: 0px !important;
}
 .owlDiv .owl-nav{
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: absolute;
  width: 100% !important;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 0 20px;
  pointer-events: none;
  box-sizing: border-box;
}
.owlDiv .owl-nav .owl-prev,
.owlDiv .owl-nav .owl-next {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  font-family: Arial !important;
  font-size: 22px !important;
  line-height: 1 !important;
  box-sizing: border-box;
  background: white !important;
  color: black !important;
  pointer-events: all;
}
.owlDiv .owl-nav .owl-prev.disabled,
.owlDiv .owl-nav .owl-next.disabled{
  visibility: hidden;
}

.tumuBtn{
    position:absolute;
    right:20px;
    bottom:0px;
}

.oyunCard {
    box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
}
    .oyunCard span {
        background-color: var(--secondary);
        padding:2px;
        width:30%;
        text-align:center;
        border-radius:3rem;
        color:white;
    }


/* Haber kartı hover animasyonu — daha yumuşak/smooth */
.hover-shadow {
    /* İnce ayar değişkenleri */
    --lift: -6px; /* hover’da ne kadar yükselecek */
    --scale: 1.01; /* çok hafif büyüsün */
    --easing: cubic-bezier(.22,.61,.36,1); /* spring-benzeri easing */

    transform: translateY(0) scale(1);
    box-shadow: 0 .25rem .75rem rgba(0,0,0,.08), 0 .75rem 1.5rem rgba(0,0,0,.10);
    transition: transform 420ms var(--easing), box-shadow 420ms var(--easing), filter 420ms var(--easing);
    will-change: transform, box-shadow;
    backface-visibility: hidden;
    transform: translateZ(0); /* jank azaltır */
    contain: paint; /* repaint izolasyonu */
}

    .hover-shadow:hover,
    .hover-shadow:focus-visible {
        transform: translateY(var(--lift)) scale(var(--scale));
        box-shadow: 0 .75rem 1.75rem rgba(0,0,0,.14), 0 .25rem .85rem rgba(0,0,0,.10);
        filter: saturate(1.02); /* çok hafif renk canlılığı */
    }

    /* Tıklarken “yumuşak basma” hissi */
    .hover-shadow:active {
        transform: translateY(calc(var(--lift) / 2)) scale(1.005);
        transition-duration: 220ms;
    }

/* Erişilebilirlik — hareketi azaltanlar için animasyonu kapat */
@media (prefers-reduced-motion: reduce) {
    .hover-shadow {
        transition: none;
    }
}
/* .hover-shadow var; sadece ek kurallar */
.hover-shadow {
    position: relative; /* glare için kapsayıcı */
    transform-style: preserve-3d; /* 3D tilt */
    backface-visibility: hidden;
    will-change: transform, box-shadow;
}

    /* Parıltı (glare) katmanı — JS ekleyecek */
    .hover-shadow .hover-glare {
        position: absolute;
        inset: -1px;
        border-radius: inherit;
        pointer-events: none;
        mix-blend-mode: screen;
        opacity: 0;
        transition: opacity .28s ease;
    }

    .hover-shadow.is-tilting .hover-glare {
        opacity: .55;
    }


/*--------------------------------------------------------------------------------*/

/*başlık css örnek sıfır atık noktaları*/
/* ---- Eco Heading (genel kullanım için yeniden kullanılabilir) ---- */
.eco-title{
  /* Tema değişkenleri (Bootstrap varsa otomatik uyar) */
  --eco: var(--bs-success, #16a34a);
  --eco-rgb: var(--bs-success-rgb, 22,163,74);
  --eco-ink: var(--bs-emphasis-color, #0f172a);

  display:grid;
  place-items:center;
  gap:.6rem;
  text-align:center;
  position:relative;
  margin-bottom:3rem !important;
}

/* Metin */
.eco-text{
  font-weight:800;
  letter-spacing:-.01em;
  line-height:1.1;
  font-size:clamp(1.65rem, 1.05rem + 1.6vw, 2.3rem);
  color: var(--eco-ink);
  animation: eco-fade 520ms cubic-bezier(.2,.8,.2,1) both;
}

/* İnce, merkezden büyüyen çizgi */
.eco-underline{
  display:block;
  width:clamp(140px, 24vw, 100px);
  height:2px;
  border-radius:999px;
  background: linear-gradient(90deg,
    rgba(var(--eco-rgb), .9) 0%,
    rgba(var(--eco-rgb), .55) 100%);
  transform-origin:center;
  transform:scaleX(0);
  animation: eco-line 800ms 120ms ease-out forwards;
}

/* Küçük "filiz" – iki yaprak, alttaki çizginin ortasında nazikçe belirir */
.eco-sprout{
  position:relative;
  width:1.2rem;      /* yaprak genişliği */
  height:.9rem;      /* yaprak yüksekliği */
  margin-top:-.15rem;/* çizgiye bir tık yaklaşsın */
  animation: eco-sprout 620ms 260ms cubic-bezier(.2,.8,.2,1) both;
}
.eco-sprout::before,
.eco-sprout::after{
  content:"";
  position:absolute;
  top:0;
  width:.55rem; 
  height:.9rem;
  background: var(--eco);
  border-radius: 60% 60% 40% 40% / 70% 70% 30% 30%; /* basit yaprak formu */
  opacity:.9;
}
.eco-sprout::before{
  left:0;
  transform-origin:bottom center;
  transform: rotate(-24deg);
}
.eco-sprout::after{
  right:0;
  transform-origin:bottom center;
  transform: rotate(24deg);
}

/* Hover/klavye odağı: çok hafif yeniden vurgu */
.eco-title:hover .eco-underline,
.eco-title:focus-within .eco-underline{
  filter: brightness(1.05);
}

/* Animasyonlar */
@keyframes eco-fade{
  from{ opacity:0; transform:translateY(8px); }
  to  { opacity:1; transform:translateY(0); }
}
@keyframes eco-line{
  to { transform:scaleX(1); }
}
@keyframes eco-sprout{
  0%  { transform: translateY(6px) scale(.9); opacity:0; }
  100%{ transform: translateY(0)   scale(1);   opacity:1; }
}

/* Hareketi azaltma tercihi */
@media (prefers-reduced-motion: reduce){
  .eco-text, .eco-underline, .eco-sprout{ animation:none; }
  .eco-underline{ transform:none; }
}

/* Karanlık mod uyumu */
@media (prefers-color-scheme: dark){
  .eco-text{ color: var(--bs-body-color, #e5e7eb); }
  .eco-underline{
    background: linear-gradient(90deg,
      rgba(var(--eco-rgb), .95) 0%,
      rgba(var(--eco-rgb), .6) 100%);
  }
}

/*--------------------------------------------------------------------------*/

/*haber detay için css*/
/* Makale genişliği ve genel yerleşim */
.news-article {
    max-width: 860px;
}

/* Başlık — ortalı, ince marker vurgusu (Sıfır Atık yeşili tonları) */
.news-title {
    display: grid;
    place-items: center;
    text-align: center;
    margin: 0;
}

.news-title-text {
    position: relative;
    font-weight: 800;
    letter-spacing: -.01em;
    line-height: 1.1;
    font-size: clamp(1.75rem, 1.15rem + 1.8vw, 2.6rem);
    color: var(--bs-emphasis-color);
    padding: .05rem .25rem;
}

    .news-title-text::after {
        content: "";
        position: absolute;
        left: -.35rem;
        right: -.35rem;
        bottom: .14rem;
        height: .6em;
        border-radius: .45em;
        background: linear-gradient(90deg, rgba(var(--bs-success-rgb), .28), rgba(var(--bs-success-rgb), .12) );
        transform-origin: left center;
        transform: scaleX(0);
        z-index: -1;
        animation: marker-sweep 760ms 140ms cubic-bezier(.2,.8,.2,1) forwards;
    }

/* Kapak görseli — yumuşak 3D kart hissi */
.news-cover {
    border-radius: 16px;
    overflow: hidden;
    background: var(--bs-body-bg);
    box-shadow: 0 .75rem 1.75rem rgba(0,0,0,.12), 0 .25rem .75rem rgba(0,0,0,.08);
}

    .news-cover img {
        display: block;
        width: 100%;
        height: auto;
        transform: scale(1.002);
        transition: transform 600ms cubic-bezier(.2,.8,.2,1), filter 600ms;
        will-change: transform;
    }

    .news-cover:hover img {
        transform: scale(1.02);
    }

/* İçerik tipografisi — okunabilir “prose” stili */
.prose {
    color: var(--bs-body-color);
    font-size: 1.05rem;
    line-height: 1.75;
}

    .prose p {
        margin: 0 0 1rem;
    }

    .prose h2, .prose h3, .prose h4 {
        margin-top: 2rem;
        margin-bottom: .75rem;
        font-weight: 800;
        letter-spacing: -.01em;
    }

    .prose h2 {
        font-size: clamp(1.35rem, 1.05rem + .8vw, 1.75rem);
    }

    .prose h3 {
        font-size: clamp(1.2rem, 1.02rem + .6vw, 1.45rem);
    }

    .prose ul, .prose ol {
        padding-left: 1.25rem;
        margin-bottom: 1rem;
    }

    .prose blockquote {
        margin: 1.25rem 0;
        padding: .9rem 1rem;
        border-left: 4px solid rgba(var(--bs-success-rgb), .6);
        background: rgba(var(--bs-success-rgb), .08);
        border-radius: .5rem;
    }

    .prose img {
        max-width: 100%;
        height: auto;
        border-radius: 12px;
    }

/* Geri butonu — ikonlu ve hafif hareketli */
.back-btn {
    position: relative;
    padding-left: 2.5rem; /* okunaklı ikon boşluğu */
    transition: transform 260ms ease, box-shadow 260ms ease;
}

    .back-btn::before {
        content: "←";
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        font-size: 1.1em;
    }

    .back-btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 .5rem 1.25rem rgba(0,0,0,.08);
    }

/* Animasyonlar */
@keyframes title-in {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes marker-sweep {
    from {
        transform: scaleX(0);
    }

    to {
        transform: scaleX(1);
    }
}

/* Hareketi azaltmayı tercih edenler için */
@media (prefers-reduced-motion: reduce) {
    .news-title-text, .news-title-text::after,
    .news-cover img, .back-btn {
        animation: none;
        transition: none;
        transform: none;
    }
}

/* Karanlık mod dokunuşları */
@media (prefers-color-scheme: dark) {
    .news-cover {
        box-shadow: 0 .75rem 1.75rem rgba(0,0,0,.5), 0 .25rem .75rem rgba(0,0,0,.35);
    }

    .prose blockquote {
        background: rgba(var(--bs-success-rgb), .12);
        border-left-color: rgba(var(--bs-success-rgb), .75);
    }
}

/*-----------------------------------------------------------*/
/*slider*/
/* Yükseklik, görsel davranışı */
.modern-carousel {
    --carousel-h: clamp(320px, 55vh, 620px);
}

    .modern-carousel .carousel-item {
        /*height: var(--carousel-h);*/
    }

        .modern-carousel .carousel-item img {
            /*height: 100%;*/
            object-fit: fill; /* Görseli doldurur (istersen contain yapısını aşağıda anlattım) */
            transform: scale(1.01);
            transition: transform 900ms cubic-bezier(.2,.8,.2,1), filter 900ms;
            will-change: transform;
        }

        .modern-carousel .carousel-item.active img {
            /*transform: scale(1.04);*/
        }

    /* Alt-üst okunabilirlik için hafif degrade maske */
    .modern-carousel .carousel-gradient {
        position: absolute;
        inset: 0;
        background: linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,0) 22%, rgba(0,0,0,0) 70%, rgba(0,0,0,.25));
        pointer-events: none;
    }

    /* Cam efektli, yuvarlak kontrol butonları */
    .modern-carousel .carousel-control-prev,
    .modern-carousel .carousel-control-next {
        width: 3rem;
        height: 3rem;
        top: 50%;
        transform: translateY(-50%);
        border-radius: 999px;
        /*background: rgba(15,23,42,.35);*/
        backdrop-filter: blur(4px);
        transition: background 240ms ease, transform 240ms ease;
        margin: 10px;
    }

        .modern-carousel .carousel-control-prev:hover,
        .modern-carousel .carousel-control-next:hover {
            /*background: rgba(15,23,42,.55);*/
            transform: translateY(-50%) scale(1.04);
        }

    .modern-carousel .carousel-control-prev-icon,
    .modern-carousel .carousel-control-next-icon {
        /*filter: invert(1) drop-shadow(0 1px 2px rgba(0,0,0,.35));*/
        background-size: 1rem 1rem;
    }

    /* Göstergeler (dots) */
    .modern-carousel .carousel-indicators {
        gap: .5rem;
        margin-bottom: .75rem;
    }

        .modern-carousel .carousel-indicators [data-bs-target] {
            width: .75rem;
            height: .75rem;
            border-radius: 50%;
            background-color: rgba(255,255,255,.6);
            border: 2px solid rgba(255,255,255,.9);
            opacity: 1;
        }

        .modern-carousel .carousel-indicators .active {
            background-color: #16a34a; /* sıfır atık yeşili */
            border-color: rgba(255,255,255,1);
        }

    /* Alt ilerleme barı */
    .modern-carousel .carousel-progress {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 4px;
        background: rgba(255,255,255,.25);
    }

        .modern-carousel .carousel-progress .progress-bar {
            width: 0%;
            height: 100%;
            background: linear-gradient(90deg, #16a34a, #22c55e);
        }

/* Karanlık mod */
@media (prefers-color-scheme: dark) {
    .modern-carousel .carousel-progress {
        background: rgba(255,255,255,.15);
    }
}

/* Hareketi azaltma */
@media (prefers-reduced-motion: reduce) {
    .modern-carousel .carousel-item img {
        transition: none;
        transform: none;
    }
}

/*------------------------------------------------*/
/*katılımcı kurumlar */
.partner-logo {
    max-height: 120px; /* Hepsini aynı yükseklikte tutar */
    object-fit: contain; /* Oranları bozmadan sığdırır */
    opacity: 0.75;
    transition: all 0.3s ease;
}

    .partner-logo:hover {
        opacity: 1;
        transform: scale(1.05); /* Hafif büyüme efekti */
    }



/*--------------------------------------------------------*/
/*twet div kısmı */

/* ----- CTA / Hero şerit ----- */
.cta-fluid {
    --overlay: rgba(17, 34, 64, .58); /* mavi-yeşil tonlu örtü */
    --overlay2: rgba(17, 34, 64, .35);
    position: relative;
    isolation: isolate; /* overlay katmanlarını izole et */
    overflow: hidden;
    min-height: clamp(320px, 48vh, 560px);
    display: flex;
    align-items: center;
    justify-content: center;
}

    /* Arka plan (Ken Burns) */
    .cta-fluid::before {
        content: "";
        position: absolute;
        inset: -2rem; /* kenarlarda taşma payı */
        background-image: var(--cta-bg);
        background-size: cover;
        background-position: center;
        filter: saturate(1.05) contrast(1.02);
        transform: scale(1.04);
        animation: kenburns 24s ease-in-out infinite alternate;
        z-index: -2;
    }

    /* Renkli overlay + hafif alt/üst degrade */
    .cta-fluid::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(180deg, var(--overlay) 0%, var(--overlay2) 100%);
        z-index: -1;
    }

/* Butona hafif “lift” etkisi */
.btn-lift {
    transition: transform .25s ease, box-shadow .25s ease;
}

    .btn-lift:hover, .btn-lift:focus-visible {
        transform: translateY(-2px);
        box-shadow: 0 .9rem 1.6rem rgba(0,0,0,.18);
    }

/* Metinler daha net dursun diye çok hafif gölge */
.cta-fluid h2, .cta-fluid p {
    text-shadow: 0 2px 6px rgba(0,0,0,.25);
}

/* Ken Burns animasyonu */
@keyframes kenburns {
    0% {
        transform: scale(1.04) translate3d(0, 0, 0);
    }

    100% {
        transform: scale(1.12) translate3d(0, -1.5%, 0);
    }
}

/* Hareketi azaltma tercihi */
@media (prefers-reduced-motion: reduce) {
    .cta-fluid::before {
        animation: none;
        transform: none;
    }

    .btn-lift {
        transition: none;
    }
}


/* --- Show All (CTA) Card --- */
.showall-card{
  --easing: cubic-bezier(.22,.61,.36,1);
  --mx: 50%; --my: 50%;
  position: relative;
  border-radius: 18px;
  padding: 2px; /* gradient kenar için */
  background:
    radial-gradient(60rem 60rem at var(--mx) var(--my),
      rgba(34,197,94,.22), rgba(34,197,94,0) 60%) border-box,
    linear-gradient(135deg,#16a34a,#22c55e 40%,#93d6a1) border-box;
  box-shadow: 0 .3rem .9rem rgba(0,0,0,.08);
  transition: transform .35s var(--easing), box-shadow .35s var(--easing);
}
.showall-card__inner{
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  padding: .9rem 1.4rem;
  border-radius: 16px; /* dıştan 2px küçük */
  background: #fff;
  color: #14532d;
  font-weight: 700;
  letter-spacing: .1px;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.02);
  transition: transform .35s var(--easing), box-shadow .35s var(--easing), background .35s var(--easing);
}
.showall-card__icon{ font-size: 1.15rem; }
.showall-card__arrow{
  display:inline-block;
  transition: transform .35s var(--easing), opacity .35s var(--easing);
  transform: translateX(0);
  opacity:.9;
}
.showall-card:hover{ box-shadow: 0 .9rem 1.6rem rgba(0,0,0,.12); }
.showall-card:hover .showall-card__inner{
  transform: translateY(-3px);
  box-shadow: inset 0 0 0 1px rgba(22,163,74,.08), 0 .6rem 1.1rem rgba(0,0,0,.07);
  background: #fefefe;
}
.showall-card:hover .showall-card__arrow{ transform: translateX(6px); opacity:1; }

/* Karanlık mod uyumu */
@media (prefers-color-scheme: dark){
  .showall-card__inner{ background: #0b1220; color: #e6ffed; }
}

/* Hareketi azaltma */
@media (prefers-reduced-motion: reduce){
  .showall-card, .showall-card__inner, .showall-card__arrow{ transition: none !important; }
}