/* ===== RESPONSIVE STILLER ===== */

/* Tablet ve küçük dizüstü bilgisayarlar */
@media screen and (max-width: 992px) {
  .container {
    padding: 0 15px;
  }
  
  .site-title {
    font-size: 2.2rem;
  }
  
  .site-description {
    max-width: 95%;
  }
  
  .makale-section__inner {
    padding: 25px 20px;
  }
  
  .telegram-box, .twitter-box {
    flex-direction: column;
    text-align: center;
    gap: 20px;
    padding: 25px;
  }
  
  .telegram-icon, .twitter-icon {
    margin: 0 auto;
  }
  
  .feature-item {
    padding: 25px 15px;
  }
  
  .footer-credit {
    gap: 20px;
  }
}

/* Tablet ve büyük telefonlar */
@media screen and (max-width: 768px) {
  .site-header .container {
    text-align: center;
  }
  
  .site-title {
    font-size: 2rem;
  }
  
  .menu-toggle {
    display: block;
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 100;
  }
  
  .main-navigation {
    position: relative;
  }
  
  .menu-list {
    display: none;
    flex-direction: column;
    width: 100%;
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 5px 10px rgba(0,0,0,0.1);
    z-index: 99;
    padding: 10px 0;
  }
  
  .menu-list.active {
    display: flex;
  }
  
  .menu-list a {
    padding: 12px 20px;
    text-align: center;
    border-radius: 0;
  }
  
  .auth-buttons {
    flex-direction: row;
    justify-content: center;
    margin: 20px 0;
  }
  
  .page-title {
    font-size: 1.8rem;
  }
  
  .makale-section__title {
    font-size: 1.6rem;
  }
  
  .makale-section__subtitle {
    font-size: 1.3rem;
  }
  
  .status-box {
    padding: 25px 20px;
  }
  
  .faq-question h3 {
    font-size: 1rem;
  }
  
  .steps-guide {
    padding: 20px 15px;
  }
  
  .footer-credit {
    justify-content: center;
  }
}

/* Telefonlar */
@media screen and (max-width: 576px) {
  .site-title {
    font-size: 1.8rem;
  }
  
  .site-description {
    font-size: 0.9rem;
  }
  
  .logo img, .logo-svg {
    width: 150px;
  }
  
  .auth-buttons {
    flex-direction: column;
    width: 100%;
  }
  
  .btn {
    width: 100%;
    padding: 12px 20px;
  }
  
  .page-title {
    font-size: 1.6rem;
  }
  
  .breadcrumbs {
    font-size: 0.8rem;
  }
  
  .makale-section {
    padding: 30px 10px;
  }
  
  .makale-section__inner {
    padding: 20px 15px;
  }
  
  .makale-section__title {
    font-size: 1.4rem;
  }
  
  .feature-item {
    padding: 20px 15px;
  }
  
  .hero-section {
    margin: 20px 0 40px;
  }
  
  .entry-banner__caption {
    font-size: 0.9rem;
    padding: 10px 20px;
  }
  
  .current-link-box, .telegram-box, .twitter-box, .info-alert {
    padding: 20px 15px;
  }
  
  .faq-question {
    padding: 12px 15px;
  }
  
  .faq-answer {
    padding: 0 15px;
  }
  
  .faq-item.active .faq-answer {
    padding: 15px;
  }
  
  .footer-credit {
    flex-direction: column;
    gap: 15px;
  }
  
  .site-footer__credit-author {
    font-size: 1rem;
  }
  
  .site-footer__logos {
    gap: 15px;
  }
  
  .error-container {
    padding: 30px 20px;
  }
  
  .error-code {
    font-size: 5rem;
  }
  
  .error-title {
    font-size: 1.6rem;
  }
  
  #play-welcome {
    font-size: 0.9rem;
    padding: 10px 20px;
    right: 10px;
    bottom: 10px;
  }
}

/* Küçük telefonlar */
@media screen and (max-width: 375px) {
  .site-title {
    font-size: 1.6rem;
  }
  
  .logo img, .logo-svg {
    width: 120px;
  }
  
  .page-title {
    font-size: 1.4rem;
  }
  
  .makale-section__title {
    font-size: 1.3rem;
  }
  
  .makale-section__subtitle {
    font-size: 1.1rem;
  }
  
  .entry-banner__caption {
    font-size: 0.8rem;
    padding: 8px 16px;
  }
  
  .site-footer {
    padding: 30px 0 15px;
  }
}

/* Yüksek DPI cihazlar için iyileştirmeler */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
}