/* -----------------------------------------------------------------------------
   İl Bilge Akademi – Base Design System (v2)  |  2025-05-10
   -----------------------------------------------------------------------------
   Bu dosya tüm site genelinde kullanılacak tek CSS kaynağıdır.  
   Bootstrap 5 üzerine hafif katman; cam-kart, istatistik bloğu ve marka renk
   yardımcıları dâhil edilmiştir.
------------------------------------------------------------------------------ */

/* -----------------------------------------------------------------------------
   0.  KÖK DEĞİŞKENLER (DESIGN TOKENS)
------------------------------------------------------------------------------ */
:root {
  /* Brand Colors */
  --color-primary: #030161;       /* Deep Navy */
  --color-secondary: #4F4E91;     /* Bluish Purple */
  --color-accent-orange: #35a931; /* Accent Orange */
  --color-accent-yellow: #f8f9fa; /* Accent Yellow */
  --color-white: #FFFFFF;
  --color-black: #000000;

  /* Gradients */
  --grad-primary: linear-gradient(135deg, #030161 0%, #4F4E91 100%);

  /* Typography */
  --font-family-base: "Inter", "Helvetica Neue", Arial, sans-serif;
  --font-size-base: 16px;
  --line-height-base: 1.6;

  /* Layout */
  --radius-base: 0.5rem;
  --radius-lg: 1.25rem;
  --shadow-card: 0 10px 16px rgba(0, 0, 0, 0.05);
  --blur-glass: blur(16px);
}

/* -----------------------------------------------------------------------------
   1.  RESET & GLOBAL BASE
------------------------------------------------------------------------------ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:var(--font-size-base);scroll-behavior:smooth}
body{
  font-family:var(--font-family-base);
  line-height:var(--line-height-base);
  color:var(--color-primary);
  background-color:var(--color-white);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}

/* Links */
a{color:var(--color-accent-orange);text-decoration:none;transition:color .2s}
a:hover,a:focus{color:var(--color-secondary)}

/* Typography */
h1,h2,h3,h4,h5,h6{font-weight:800;color:var(--color-primary);line-height:1.2;margin-bottom:.5em}
p{margin-bottom:1em}

@media(min-width:768px){h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.75rem}}

/* -----------------------------------------------------------------------------
   2.  LAYOUT UTILITIES
------------------------------------------------------------------------------ */
.container{width:90%;max-width:1200px;margin-inline:auto}
@media(max-width:767px){.container{width:94%}}

.mt-0{margin-top:0!important}
.mt-1{margin-top:1rem!important}
.mb-1{margin-bottom:1rem!important}
.pt-1{padding-top:1rem!important}
.pb-1{padding-bottom:1rem!important}

/* -----------------------------------------------------------------------------
   3.  BRAND BUTTONS
------------------------------------------------------------------------------ */
.btn{display:inline-block;padding:.75em 1.5em;border:none;border-radius:var(--radius-base);font-weight:600;cursor:pointer;transition:background-color .2s,box-shadow .2s}
.btn-primary{background-color:var(--color-primary);color:var(--color-white)}
.btn-primary:hover,.btn-primary:focus{background-color:var(--color-secondary)}
.btn-accent{background-color:var(--color-accent-orange);color:var(--color-white)}
.btn-accent:hover,.btn-accent:focus{background-color:var(--color-accent-yellow);color:var(--color-primary)}

/* -----------------------------------------------------------------------------
   4.  CARDS & GLASSMORPHISM
------------------------------------------------------------------------------ */
.card{
  background-color:var(--color-white);
  border-radius:var(--radius-base);
  box-shadow:var(--shadow-card);
  padding:2rem;
}

.glass-card{
  backdrop-filter:var(--blur-glass);
  background:rgba(255,255,255,.22);
  border:1px solid rgba(255,255,255,.3);
  border-radius:var(--radius-lg);
  color:var(--color-white);
  box-shadow:0 8px 28px rgba(0,0,0,.15);
  transition:transform .3s;
}
.glass-card:hover{transform:translateY(-6px)}

/* -----------------------------------------------------------------------------
   5.  BRAND COLOR HELPERS
------------------------------------------------------------------------------ */
.bg-primary{background-color:var(--color-primary)!important;color:var(--color-white)!important}
.bg-secondary{background-color:var(--color-secondary)!important;color:var(--color-white)!important}
.bg-accent-orange{background-color:var(--color-accent-orange)!important;color:var(--color-white)!important}
.bg-accent-yellow{background-color:var(--color-accent-yellow)!important;color:var(--color-primary)!important}

.text-primary{color:var(--color-primary)!important}
.text-secondary{color:var(--color-secondary)!important}
.text-accent-orange{color:var(--color-accent-orange)!important}
.text-accent-yellow{color:var(--color-accent-yellow)!important}

/* -----------------------------------------------------------------------------
   6.  FORMS
------------------------------------------------------------------------------ */
input[type="text"],input[type="email"],input[type="password"],textarea,select{
  width:100%;padding:.75em 1em;border:2px solid var(--color-secondary);border-radius:var(--radius-base);background-color:var(--color-white);font-size:1rem;font-family:var(--font-family-base);color:var(--color-primary);
}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--color-accent-orange)}

/* -----------------------------------------------------------------------------
   7.  BADGES & BURSTS
------------------------------------------------------------------------------ */
.badge-burst{display:inline-block;background:var(--color-accent-orange);color:var(--color-white);padding:.4em .8em;border-radius:9999px;font-weight:700;font-size:.875rem}

/* -----------------------------------------------------------------------------
   8.  STATISTICS SECTION (Glass Cards + Counter)
------------------------------------------------------------------------------ */
.stats-section{background:var(--grad-primary);position:relative;color:var(--color-white)}
.stats-overlay{position:absolute;inset:0;background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGNpcmNsZSBjeD0iMyIgY3k9IjMiIHI9IjEiIGZpbGw9IiNmZmYiIG9wYWNpdHk9Ii4wMiIvPjxjaXJjbGUgY3g9IjEyIiBjeT0iMTIiIHI9IjEiIGZpbGw9IiNmZmYiIG9wYWNpdHk9Ii4wMiIvPjwvc3ZnPg==") repeat;opacity:.18;mix-blend-mode:overlay;pointer-events:none}

.stat-card{backdrop-filter:var(--blur-glass);background:rgba(255,255,255,.20);border:1px solid rgba(255,255,255,.3);border-radius:var(--radius-lg);color:var(--color-white);transition:transform .3s}
.stat-card:hover{transform:translateY(-6px)}

.counter{font-size:2.5rem;font-weight:700;color:var(--color-white)}
.stat-label{font-size:1rem;opacity:.9;color:var(--color-accent-yellow)}

/* -----------------------------------------------------------------------------
   9.  ANIMATIONS (helper keyframes)
------------------------------------------------------------------------------ */
@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

/* -----------------------------------------------------------------------------
   10.  MEDIA QUERIES FINE-TUNE
------------------------------------------------------------------------------ */
@media(max-width:575px){
  h1{font-size:2rem}
  .counter{font-size:2rem}
}

/* ▬▬ Program Kartı ▬▬ */
.programs-section{
  background:#999999;
  background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMTAnIGhlaWdodD0nMTAnIHhtbG5zPSdodHRwOi8vd3d3Lncz
Lm9yZy8yMDAwL3N2Zyc+PGNpcmNsZSByPScxJyBjeD0nMicgY3k9JzUnIGZpbGw9JyNmZmYnIG9wYWNp
dHk9Jy4wMycvPjwvc3ZnPg==");
  background-size:120px;
}
.program-card{
  display:flex;flex-direction:column;
  border-radius:1.5rem;
  background:rgba(255,255,255,0.7);
  backdrop-filter:blur(12px);
  box-shadow:0 10px 20px rgba(3,1,97,.15);
  transition:transform .4s cubic-bezier(.22,1,.36,1);
}
.program-card:hover{transform:translateY(-8px) rotate(.4deg);}

/* Card başlık & paragraf rengi */
.program-card h3{color:#030161;font-weight:700;}
.program-card p{color:#4F4E91;font-size:.925rem}

/* ▬▬ Cam Modal ▬▬ */
.glass-modal .modal-content{
  border:none;border-radius:1.75rem;
  background:rgba(255,255,255,.15);
  backdrop-filter:blur(32px);
  box-shadow:0 25px 40px rgba(0,0,0,.12);
  overflow:hidden;
}
.glass-modal .modal-header{
  background:linear-gradient(135deg,#030161 0%,#4F4E91 100%);
  color:#FFFFFF;
  border-bottom:none;
}
.glass-modal .modal-title{font-weight:700;}
.glass-modal .modal-body{color:#FFFFFF;background:rgba(3,1,97,.25);}
.glass-modal .modal-footer{
  background:linear-gradient(90deg,#f8f9fa 0%,#999999 100%);
}
.glass-modal .btn-primary{
  background:#FFFFFF;color:#030161;font-weight:600;border:none;
}
.glass-modal .btn-primary:hover{background:#999999;color:#030161}


/* ▬▬▬▬▬▬ KOÇLUK BLOK V2 ▬▬▬▬▬▬ */
.process-section{
  background:
    radial-gradient(ellipse at 50% -160px, rgba(240,217,139,.50) 0%, rgba(0,0,0,0) 60%),
    linear-gradient(140deg,#030161 0%,#4F4E91 90%);
  color:#FFF;                     /* temel metin */
  position:relative;
}


/* merkez çizgi */
.process-timeline{position:relative}
.process-timeline::before{
  content:"";position:absolute;left:50%;top:0;bottom:0;transform:translateX(-50%);
  width:6px;background:linear-gradient(#f8f9fa,#999999);
  border-radius:3px;filter:drop-shadow(0 0 6px rgba(240,217,139,.45));
}
@media(max-width:991px){.process-timeline::before{display:none}}

/* kart */
.step-card{
  background:rgba(255,255,255,.12);
  backdrop-filter:blur(18px);
  border-radius:1.5rem;padding:2rem 2rem 1.5rem;height:100%;
  box-shadow:0 10px 24px rgba(0,0,0,.15);
  transition:transform .4s cubic-bezier(.22,1,.36,1);
}
.step-card:hover{
  transform:translateY(-12px) scale(1.03);
  box-shadow:0 20px 40px rgba(0,0,0,.25),0 0 12px rgba(240,217,139,.35);
}

/* marker + ikon */
.step-marker{
  position:absolute;top:-28px;left:50%;transform:translateX(-50%);
  width:56px;height:56px;border-radius:50%;font-size:1.35rem;font-weight:700;
  background:#999999;color:#030161;border:4px solid #f8f9fa;
  display:flex;align-items:center;justify-content:center;
}
.step-icon{font-size:3rem;color:#999999;text-shadow:0 0 6px rgba(240,217,139,.55)}

/* liste işaretleri */
.list-check{margin-top:1rem;padding-left:0}
.list-check li{position:relative;padding-left:1.55rem;margin-bottom:.25rem}
.list-check li::before{
  content:"\F26E";font-family:"bootstrap-icons";font-size:1rem;
  position:absolute;left:0;top:.2rem;color:#f8f9fa;
}

/* typography */
.step-card h4{color:#FFFFFF;font-weight:700}
.step-card p{color:#D8DBFF;font-size:.95rem}

.object-cover{
  object-fit:cover;
}

/* ------------------------------- END OF FILE ----------------------------- */