
@media (max-width: 768px) {
    .articles-container {
        grid-template-columns: 1fr;
        gap: 24px;
        padding: 20px;
    }
    .articles-sidebar {
        position: static;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }
    .sidebar-card { padding: 16px; }
    .stats-card { grid-column: 1 / -1; }
}



@media (max-width: 768px) {
    .art-card {
        flex-direction: column; /* Mobilde görsel üstte, yazı altta */
    }
    .art-img {
        width: 100%;
        min-width: 100%;
        height: 220px;
        border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    }
    .art-body {
        padding: 24px;
    }
}

@media (min-width: 1025px) {
    .footer-grid { grid-template-columns: 2fr 1fr 1fr 1fr; }
}

/* ═══════════════════════════════════════════════════════════ */
/* ── RESPONSIVE BREAKPOINT SİSTEMİ ── */
/* ═══════════════════════════════════════════════════════════ */

/* 1920px - Ultra Wide */
@media (min-width: 1920px) {
    body { font-size: 18px; }
    .hero h1 { font-size: 72px; }
    .s-h2 { font-size: 52px; }
    .about-container { max-width: 1400px; }
}

/* 1440px - Büyük Ekran */
@media (max-width: 1440px) {
    .hero { gap: 40px; }
    .about-container { gap: 40px; }
    
}

/* 1280px - Standart Masaüstü */
@media (max-width: 1280px) {
    .hero { padding: 60px 5% 80px; }
    .articles-container { padding: 30px 40px 60px; }
    .product-grid { padding: 30px 40px; }
    .grow-profile-section { padding: 30px 40px; }
    .grow-section-academy { padding: 50px 40px 70px; }
    .grow-notes-section-academy { padding: 50px 40px 70px; }
    .about-project { padding: 80px 40px; }
    .how-it-works { padding: 80px 40px; }
    .cta { padding: 60px 40px; }
    .market-hero-glass { margin-left: 20px; margin-right: 20px; }
    .filter-panel { padding: 20px 24px; }
    .feat-grid-detailed { grid-template-columns: repeat(2, 1fr); }
}

/* 1200px - Grow responsive */
@media (max-width: 1200px) {
    .grow-card-grid { grid-template-columns: repeat(2, 1fr); }
    .grow-card-academy.wide-card { grid-column: span 2; }
    .grow-profile-stats { grid-template-columns: repeat(2, 1fr); }
    .color-stat-row { grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); }
}

/* 1024px - Laptop / Tablet Yatay */
@media (max-width: 1024px) {
    .genis-video-alani video {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: 50% 50% !important; /* Inline -120px/-150px offseti mobilde sıfırla */
        display: block;
    }
    .grow-section-academy, .hero, section, footer { padding-left: 4%; padding-right: 4%; }
    .grow-cognitive-grid { grid-template-columns: 1fr; }
    .grow-hero-academy { padding: 20px; }
    .grow-hero-academy-content h1.s-h2 { font-size: 36px !important; }
    .gradient-title { font-size: 36px; }
    .grow-profile-glass { flex-direction: column; }

    
    /* Hero */
    .hero { flex-direction: column; text-align: center; gap: 40px; }
    .hero p { max-width: 100%; margin-left: auto; margin-right: auto; }
    .hero-cta { justify-content: center; }
    .hero-bubbles { justify-content: center; }
    .hero-right { width: 100%; max-width: 600px; margin: 0 auto; }
    
    /* Features */
    .feat-grid-detailed { grid-template-columns: repeat(2, 1fr); }
    
    /* Academy filter */
    
    /* Dashboard */
    
    /* Market hero */
    .market-hero-glass { padding: 40px 30px; }
    .market-title { font-size: 36px; }
    
    /* Steps */
    .steps-container { gap: 16px; }
    .step-card { min-width: 180px; max-width: 260px; padding: 28px 20px; }
    .step-arrow { display: none; }
    .mobile-nav-toggle { display: block; }
    .nav-actions { display: none; }
    .mobile-only-nav-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        gap: 18px; /* Üye Ol / Giriş Yap butonları arasında boşluk */
    }

    nav { padding: 0 20px; }
    
    .nav-links { gap: 10px; }
    .nav-links a { padding: 8px 12px; font-size: 14px; }
    .nav-links {
        position: fixed;
        top: 0;
        right: -100%;
        width: min(300px, 85vw);
        height: 100vh;
        height: 100dvh;
        background: var(--white);
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        gap: 16px;
        padding: 108px 24px 40px;
        overflow-y: auto;
        transition: right 0.4s cubic-bezier(0.77, 0.2, 0.05, 1), visibility 0.4s, opacity 0.4s;
        box-shadow: -12px 0 30px rgba(0, 0, 0, 0.08);
        z-index: 99;
        border-radius: 0;
        /* Kapalıyken menü hiçbir şekilde görünmesin / etkileşime alınmasın */
        visibility: hidden;
        opacity: 0;
        pointer-events: none;
    }

    .nav-links.active {
        right: 0;
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
    }

    .nav-links a {
        font-size: 17px;
        width: 100%;
        text-align: center;
        padding: 12px 14px;
    }

    .articles-container {
        grid-template-columns: 260px 1fr;
        gap: 24px;
        padding: 30px 40px 60px;
    }
    .sidebar-card { padding: 18px; }
}

/* 768px - Tablet Dikey */
@media (max-width: 768px) {
    .grow-section-academy { padding: 30px 20px 40px; }
    .grow-card-grid { grid-template-columns: 1fr; }
    .grow-card-academy.wide-card { grid-column: span 1; }
    .grow-cognitive-grid { grid-template-columns: 1fr; }
    .grow-hero-academy { padding: 20px; }
    .grow-hero-academy-content h1.s-h2 { font-size: 28px !important; }
    .grow-academy-features { gap: 16px; }
    .grow-af-item { max-width: 140px; }
    .grow-af-icon { width: 52px; height: 52px; }
    .grow-profile-glass { padding: 24px 20px; }
    .grow-profile-stats { grid-template-columns: repeat(2, 1fr); }
    .gradient-title { font-size: 28px; }
    .grow-profile-section { padding: 20px; margin-top: -60px; }

    /* Hero */
    .hero { padding: 40px 5% 60px; gap: 32px; }
    .hero h1 { font-size: clamp(28px, 8vw, 36px); }
    .hero p { font-size: 15px; }
    .hero-badge { font-size: 12px; padding: 6px 16px; }
    .hero-cta { flex-direction: column; align-items: center; }
    .btn-big-pink, .btn-big-sky { width: 100%; max-width: 320px; justify-content: center; }
    
    /* Cute dashboard */
    .cute-dashboard { padding: 24px; }
   
    .baby-age-tag { margin-left: 0; }
    .color-stat-row { grid-template-columns: repeat(2, 1fr); }
    

    
    /* Development */

    .dev-card-top { flex-direction: column; align-items: flex-start; gap: 12px; }

    
    /* Academy */
 
    .academy-hero-content h1 { font-size: 32px; }
    
    /* Article detail */
    .article-container { grid-template-columns: 1fr; margin-top: -40px; }
   
    .article-sidebar { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
   
    
    /* Market */
    .market-hero-glass { padding: 30px 20px; border-radius: 24px; }
    .market-title { font-size: 28px; }
    .market-subtitle { font-size: 15px; }
    .search-box-hero { flex-direction: column; gap: 10px; background: transparent; border: none; padding: 0; box-shadow: none; }
    .search-btn-hero { width: 100%; justify-content: center; }
    .hero-stats { gap: 16px; flex-direction: column; align-items: center; }
    .stat-bubble { min-width: 200px; width: 100%; max-width: 280px; }
    
    /* Filter panel */
    .filter-panel { padding: 16px; top: 78px; }
    .filter-container { flex-direction: column; gap: 16px; }
    .category-filter-section { min-width: 100%; }
    .sort-view-section { flex-direction: column; width: 100%; gap: 12px; }
    .sort-select { width: 100%; min-width: auto; }
    .view-results { width: 100%; justify-content: space-between; }
    
    /* Product grid */
    .product-grid { padding: 20px; grid-template-columns: repeat(2, 1fr); gap: 16px; }
    
    /* About */
    .about-project { padding: 60px 20px; }
    .about-container { grid-template-columns: 1fr; gap: 40px; }
    
    /* How it works */
    .how-it-works { padding: 60px 20px; }
    .step-card { min-width: 100%; max-width: 100%; }
    
    /* Testimonials */
    
    /* Featured detailed */
    .feat-grid-detailed { grid-template-columns: 1fr; }
    
    /* CTA */
    .cta { padding: 50px 20px; }
    .cta h2 { font-size: 28px; }
    
    /* Academy features grow */
    .grow-academy-features { flex-wrap: wrap; justify-content: center; gap: 12px; }
    .grow-af-item { max-width: 100px; }
    
    /* Sleep stats */
}

/* 640px - Büyük Telefon */
@media (max-width: 640px) {
    .hero h1 { font-size: clamp(24px, 7vw, 28px); }
  
    
    
    
    .articles-main { padding: 0; }
    .art-grid { gap: 20px; }
    .product-grid { grid-template-columns: 1fr; }
    .articles-sidebar { grid-template-columns: 1fr; }
    .article-sidebar { grid-template-columns: 1fr; }
    .certification-logos { flex-wrap: wrap; gap: 12px; }
    .academy-hero { padding: 20px; }
    .academy-hero-content h1 { font-size: 28px; }
    .academy-features { gap: 20px; }
    
    /* Product card improvements */
    .product-info { padding: 16px; }
    .prod-title { font-size: 16px; }
    .prod-actions { flex-direction: column; }
    .btn-buy, .btn-cart { width: 100%; }
    
    /* Grow dashboard */
    
    /* Grow card */
    .grow-card-header { padding: 14px 18px; }
    .grow-card-body { padding: 16px 18px; }
    .grow-card-header h3 { font-size: 15px; }
    
    /* Hero bubbles */
    .hero-bubbles { flex-direction: column; align-items: center; }
    .bubble-stat { width: 100%; max-width: 200px; }
    
    /* Articles container */
    .articles-container { padding: 20px 16px; }
    

    /* Market suggestions */
    .search-suggestions { gap: 6px; }
    .suggestion-chip { font-size: 12px; padding: 4px 12px; }
    
    /* Grow notes */
    .grow-notes-section-academy { padding: 30px 16px 50px; }
    
    /* Academy features */
    .grow-af-icon { width: 44px; height: 44px; font-size: 22px; }
    .grow-af-item span { font-size: 12px; }
}

/* 480px - Mobil Yatay */
@media (max-width: 480px) {
    /* Hero */
    .hero { padding: 30px 4% 40px; gap: 24px; }
    .hero h1 { font-size: 24px; }
    .hero p { font-size: 14px; margin-bottom: 24px; }
    .hero-cta { gap: 10px; }
    .btn-big-pink, .btn-big-sky { padding: 14px 24px; font-size: 15px; }
    .hero-badge { font-size: 11px; padding: 4px 14px; margin-bottom: 20px; }
    .hero .circle-1, .hero .circle-2, .hero .circle-3 { display: none; }
    
    /* Cute dashboard */
    .cute-dashboard { padding: 20px; }
    .cute-dashboard::before { display: none; }
    .baby-info h3 { font-size: 18px; }
    .color-stat-row { grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .color-stat { padding: 10px 8px; }
    .color-stat strong { font-size: 14px; }
    
    
    /* Dev card */
    
    .dev-card-top h3 { font-size: 18px; }
    


    
    /* Articles */

    
    /* Art cards */
    .art-card h3 { font-size: 15px; }
    .art-body { padding: 16px; }
    .art-img { width: 100%; min-width: 100%; height: 200px; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
    
    /* Product grid */
    .product-grid { grid-template-columns: 1fr; padding: 16px; }
    .product-card { max-width: 100%; }
    
    /* Market */
    .market-hero-glass { padding: 24px 16px; }
    .market-title { font-size: 24px; }
    .hero-stats { gap: 12px; }
    .stat-bubble { padding: 16px 20px; }
    .stat-number { font-size: 26px; }
    
    /* About */
    .about-project { padding: 40px 16px; }
    .about-container { gap: 24px; }
    .about-impact { gap: 16px; }
    
    /* How it works */
    .how-it-works { padding: 40px 16px; }
    .steps-container { gap: 16px; }
    .step-card { padding: 24px 20px; }
    
    /* Testimonials */
    
    /* Feat detailed */
    .feat-detailed-body { padding: 20px; }
    .feat-detailed-features { grid-template-columns: 1fr; }
    
    /* CTA */
    .cta { padding: 40px 16px; }
    .cta h2 { font-size: 24px; }
    .cta p { font-size: 15px; }
    .btn-cta-white, .btn-cta-tr { padding: 12px 24px; font-size: 14px; }
    
    /* Footer */
    footer { padding: 30px 4% 20px; }
    
    /* Grow hero */
    
    /* Grow profile */
    .grow-profile-glass { padding: 20px 16px; }
    .grow-profile-avatar { width: 64px; height: 64px; }
    .grow-profile-info h1 { font-size: 22px; }
    .grow-profile-left { flex-direction: column; text-align: center; min-width: 100%; }
    .grow-profile-meta { justify-content: center; }
    .grow-profile-stats { grid-template-columns: repeat(2, 1fr); gap: 6px; }
    .btn-edit-profile-sm { width: 100%; text-align: center; }
    

    /* Grow card */
    .grow-card-header { padding: 14px 18px; }
    .grow-card-body { padding: 16px 18px; }
    .grow-card-header h3 { font-size: 15px; }
    .grow-card-academy { border-radius: 16px; }
    
    /* Grow teeth */
    
    /* Grow sleep */
    
    /* Grow notes */
    .grow-notes-section-academy { padding: 24px 16px 40px; }
    
    /* Gradients */
    .gradient-title { font-size: 22px; }
    
    /* Section headings */
    .section-emoji { font-size: 36px; }
    
    /* Cognitive grid */
    .grow-cognitive-grid { grid-template-columns: 1fr; }
    

    /* Academy features */
    .grow-af-item { max-width: 100px; }
    .grow-af-icon { width: 44px; height: 44px; font-size: 22px; }
    .grow-af-item span { font-size: 12px; }
    
    /* Featured detailed grid */
    .feat-grid-detailed { grid-template-columns: 1fr; gap: 16px; }
    
    /* Milestone album */
    .grow-milestone-album { gap: 10px; }
    .grow-milestone-card { padding: 16px; gap: 12px; }
    .ms-icon { width: 44px; height: 44px; font-size: 28px; }
    .ms-content strong { font-size: 14px; }
}

/* 375px - Mobil Orta */
@media (max-width: 375px) {
    .hero h1 { font-size: 22px; }
    .hero p { font-size: 13px; }
    .hero-badge { font-size: 10px; padding: 4px 12px; }
    .btn-big-pink, .btn-big-sky { padding: 12px 20px; font-size: 14px; }
    .cute-dashboard { padding: 16px; }
    .baby-info h3 { font-size: 16px; }
    .color-stat-row { gap: 6px; }
    .color-stat { padding: 8px 6px; }
    .color-stat strong { font-size: 13px; }
    


    
    
    .product-grid { gap: 12px; }
    .market-title { font-size: 22px; }
    .about-container { gap: 20px; }
    .step-card h3 { font-size: 16px; }
    .step-icon { font-size: 36px; }
    .cta h2 { font-size: 22px; }
    .cta p { font-size: 14px; }
    .grow-profile-info h1 { font-size: 20px; }
    .grow-profile-avatar { width: 56px; height: 56px; font-size: 28px; }
    .grow-card-header { padding: 12px 14px; gap: 10px; }
    .grow-card-header h3 { font-size: 14px; }
    .grow-card-icon { font-size: 22px; }
    .grow-card-body { padding: 14px; }
    .gradient-title { font-size: 20px; }
    .grow-af-item { max-width: 80px; }
    .grow-af-icon { width: 40px; height: 40px; font-size: 20px; }
    .grow-af-item span { font-size: 11px; }

}

/* 320px - Mobil Küçük */
@media (max-width: 320px) {
    .hero h1 { font-size: 20px; }
    .hero p { font-size: 12px; }
    .hero-badge { font-size: 9px; padding: 3px 10px; }
    .btn-big-pink, .btn-big-sky { padding: 10px 16px; font-size: 13px; }
    .cute-dashboard { padding: 12px; }
    
    .baby-info h3 { font-size: 14px; }
    .baby-age-tag { font-size: 11px; padding: 4px 12px; }
    .color-stat-row { grid-template-columns: 1fr 1fr; }
    .color-stat { padding: 6px 4px; }
    .color-stat strong { font-size: 12px; }
    


    .s-tag { font-size: 11px; padding: 4px 14px; }
    .s-h2 { font-size: 20px; }
    .s-p { font-size: 13px; }

    
    
   
    
   
    .art-card h3 { font-size: 14px; }
    .art-card p { font-size: 12px; }
    .articles-container { padding: 16px 12px; }
    .grow-card-grid { gap: 14px; }
    .grow-card-header { padding: 10px 12px; }
    .grow-card-header h3 { font-size: 13px; }
    .grow-card-body { padding: 12px; }
    .grow-profile-section { margin-top: -30px; }
    .grow-profile-glass { padding: 16px 12px; }
    .grow-profile-info h1 { font-size: 18px; }
    .grow-profile-avatar { width: 48px; height: 48px; font-size: 24px; border-radius: 16px; }
    .grow-profile-meta span { font-size: 11px; }
    .gradient-title { font-size: 18px; }
    .grow-af-icon { width: 36px; height: 36px; font-size: 18px; border-radius: 12px; }
    .grow-af-item { max-width: 70px; }
    .grow-af-item span { font-size: 10px; }
    .grow-card-academy { border-radius: 14px; }
    .market-hero-glass { padding: 20px 12px; }
    .market-title { font-size: 20px; }
    .about-project { padding: 30px 12px; }
    .about-desc { font-size: 14px; }
    .impact-item { gap: 10px; }
    .impact-icon { width: 40px; height: 40px; font-size: 24px; }
    .how-it-works { padding: 30px 12px; }
    .step-card h3 { font-size: 15px; }
    .step-icon { font-size: 32px; }
    .cta { padding: 30px 12px; }
    .cta h2 { font-size: 20px; }
    .cta p { font-size: 13px; }
    footer { padding: 24px 4% 16px; }
    .footer-grid { gap: 16px; }
    .fc h4 { font-size: 14px; }
    .fc ul li a { font-size: 13px; }
    .product-grid { padding: 12px; gap: 12px; }
    .product-info { padding: 12px; }
    .prod-title { font-size: 14px; }
    .prod-desc { font-size: 12px; }
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .product-detail-content {
        grid-template-columns: 1fr;
    }
    .product-detail-visual {
        padding: 24px;
        border-right: none;
        border-bottom: 1px solid var(--border);
    }
    .detail-visual-box {
        width: 160px;
        height: 160px;
        font-size: 64px;
    }
    .product-detail-info {
        padding: 24px 20px;
    }
    .detail-title {
        font-size: 22px;
    }
    .detail-price-current {
        font-size: 26px;
    }
    .detail-features {
        grid-template-columns: 1fr;
    }
    .product-detail-modal {
        max-height: 96vh;
    }
}
/* 640px - Büyük telefon: paneli tam ekran yap */
@media (max-width: 640px) {
    .nav-links { width: 100%; }
    .nav-links.active { right: 0; visibility: visible; opacity: 1; pointer-events: auto; }
    .logo-text { font-size: 19px; }
    .logo-img { width: 40px; height: 40px; }
}

/* 480px - Mobil yatay */
@media (max-width: 480px) {
    nav { padding: 0 14px; gap: 8px; }
    .logo { gap: 6px; }
    .logo-text { font-size: 17px; }
    .logo-img { width: 38px; height: 38px; }
    .mobile-nav-toggle { font-size: 22px; padding: 6px; }
    .nav-links { padding: 100px 16px 32px; gap: 12px; }
}

/* 375px - Küçük telefon */
@media (max-width: 375px) {
    nav { padding: 0 12px; }
    .logo-text { font-size: 15px; }
    .logo-img { width: 34px; height: 34px; }
    .nav-links a { font-size: 16px; padding: 11px 12px; }
}

/* 320px - En küçük ekran */
@media (max-width: 320px) {
    .logo { gap: 4px; }
    .logo-text { font-size: 14px; }
    .logo-img { width: 32px; height: 32px; }
    .nav-links { padding: 96px 12px 28px; }
}




/*   GROW DAKİ MEDİA CSS KODLARI ── */

/* Mobilde daha küçük */
@media (max-width: 768px) {
    .grow-chart-container.main { height: 200px; }
    .grow-chart-container.small { height: 140px; }
    .grow-chart-container.medium { height: 160px; }
}
/* Responsive: tablette panel alta geçer */
@media (max-width: 768px) {
    .grow-teeth-split {
        flex-direction: column;
    }
    
    .grow-teeth-arch {
        align-items: center;
    }
    
    #teethUpperArch, #teethLowerArch {
        max-width: 240px;
    }
    
    .grow-teeth-panel {
        min-height: auto;
    }
    
    .grow-teeth-footer {
        flex-direction: column;
        gap: 6px;
        align-items: flex-start;
    }
}

@media (max-width: 480px) {
    .grow-teeth-arch .grow-tooth {
        width: 34px;
        height: 34px;
        font-size: 16px;
        border-radius: 8px;
    }
    
    #teethUpperArch, #teethLowerArch {
        max-width: 200px;
    }
    
    .teeth-legend {
        flex-wrap: wrap;
        gap: 8px;
    }
}


@media (max-width: 1200px) {
    .grow-card-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .grow-card-academy.wide-card {
        grid-column: span 2;
    }

    .grow-profile-stats {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 1024px) {

    .grow-section-academy,
    .grow-profile-section {
        padding-left: 4%;
        padding-right: 4%;
    }

    /* İnline grid stilleri media query'yi ezdiği için mobilde kapsayıcı tek kolon
       (Motor, Dil, Bilişsel vb. bölümlerde kartların daralıp sığmaması için) */
    .grow-section-academy .grow-card-grid {
        grid-template-columns: 1fr !important;
    }
    .grow-section-academy .grow-card-academy.wide-card {
        grid-column: span 1 !important;
    }

    .grow-cognitive-grid {
        grid-template-columns: 1fr;
    }

    .grow-profile-glass {
        flex-direction: column;
    }

    .grow-teeth-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
    }

    .grow-tooth {
        width: 50px;
        height: 50px;
        font-size: 24px;
    }
}

@media (max-width: 768px) {
    .grow-section-academy {
        padding: 30px 20px 40px;
    }

    .grow-card-grid,
    .grow-card-academy.wide-card {
        grid-template-columns: 1fr;
        grid-column: 1;
    }



    .grow-mood-week {
        gap: 4px;
    }

    /* Motor timeline checkbox'larının mobilde taşmasını önle */
    .grow-check-item {
        padding: 11px 12px;
        gap: 6px;
        min-width: 0;
    }
    .grow-check-item > span:first-child {
        min-width: 0;
        overflow-wrap: break-word;
        word-break: break-word;
        white-space: normal;
    }
    .grow-check-item .tick-icon {
        flex-shrink: 0;
    }
    .grow-phase-label {
        font-size: 11px;
        padding: 2px 10px;
    }
    .grow-motor-timeline { gap: 14px; }
    .grow-motor-phase { padding-left: 12px; }

    .mood-emoji {
        font-size: 20px;
    }

    .grow-cognitive-grid {
        grid-template-columns: 1fr;
    }

    .grow-teeth-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 6px;
    }

    .grow-tooth {
        width: 50px;
        height: 50px;
        font-size: 24px;
    }

    .grow-profile-glass {
        padding: 24px 20px;
    }

    .grow-profile-stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .gradient-title {
        font-size: 28px;
    }

    .grow-profile-section {
        padding: 20px;
        margin-top: -60px;
    }

    .grow-hero-visual {
        height: 350px;
    }

    .growth-mini-stats {
        grid-template-columns: repeat(3, 1fr);
        gap: 6px;
    }

    .grow-card-grid {
        gap: 16px;
    }





    .grow-card-header {
        padding: 16px 20px;
    }

    .grow-card-body {
        padding: 16px 20px;
    }

    .grow-sleep-stats {
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
    }

    .grow-note-card {
        padding: 16px 20px;
    }
}

@media (max-width: 640px) {
    .grow-section-academy {
        padding: 24px 16px 40px;
    }







    .grow-card-header {
        padding: 14px 18px;
    }

    .grow-card-body {
        padding: 16px 18px;
    }

    .grow-card-header h3 {
        font-size: 15px;
    }

    .grow-profile-section {
        padding: 16px;
        margin-top: -40px;
    }

    .grow-profile-glass {
        padding: 20px 16px;
    }

    .grow-profile-left {
        flex-direction: column;
        text-align: center;
    }

    .grow-profile-meta {
        justify-content: center;
    }

    .grow-profile-stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 6px;
    }

    .gradient-title {
        font-size: 22px;
    }

    .grow-hero-visual {
        height: 300px;
    }

    .grow-sleep-stats {
        gap: 8px;
    }

    .grow-note-card {
        padding: 14px 18px;
    }

    .grow-profile-info h1 {
        font-size: 22px;
    }

    .grow-profile-avatar {
        width: 64px;
        height: 64px;
    }

    .grow-teeth-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 6px;
    }

    .grow-tooth {
        width: 44px;
        height: 44px;
        font-size: 20px;
    }

    .grow-lang-item {
        flex-direction: column;
        gap: 6px;
        align-items: flex-start;
    }

    .grow-social-item {
        flex-direction: column;
        gap: 4px;
        align-items: flex-start;
    }

    .grow-flag {
        flex-direction: column;
        text-align: center;
    }

    .grow-milestone-card {
        flex-direction: column;
        text-align: center;
    }

    .grow-hero-academy {
        padding: 16px;
    }

    .grow-hero-academy-content h1.s-h2 {
        font-size: 22px !important;
    }

    .grow-academy-features {
        gap: 10px;
    }

    .grow-af-item {
        max-width: 100px;
    }

    .grow-af-icon {
        width: 44px;
        height: 44px;
        font-size: 22px;
    }

    .grow-af-item span {
        font-size: 11px;
    }

    .growth-mini-stats {
        grid-template-columns: 1fr;
    }

    .profile-form-row {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .profile-date-group {
        gap: 4px;
    }
}

@media (max-width: 480px) {
    .grow-section-academy {
        padding: 20px 12px 32px;
    }







    .grow-card-header {
        padding: 12px 14px;
    }

    .grow-card-body {
        padding: 14px;
    }

    .grow-card-header h3 {
        font-size: 14px;
    }

    .grow-card-icon {
        font-size: 24px;
    }

    .grow-profile-section {
        padding: 12px;
        margin-top: -30px;
    }

    .grow-profile-glass {
        padding: 16px 12px;
    }

    .grow-profile-avatar {
        width: 56px;
        height: 56px;
        font-size: 28px;
    }

    .grow-profile-info h1 {
        font-size: 20px;
    }

    .grow-profile-meta span {
        font-size: 12px;
    }

    .gradient-title {
        font-size: 20px;
    }

    .grow-hero-visual {
        height: 260px;
    }

    .grow-hero-academy-content {
        padding: 0 12px;
    }

    .grow-hero-academy-content h1.s-h2 {
        font-size: 20px !important;
    }

    .grow-card-grid {
        gap: 12px;
    }



    .grow-teeth-grid {
        gap: 4px;
    }

    .grow-tooth {
        width: 38px;
        height: 38px;
        font-size: 18px;
        border-radius: 10px;
    }

    .grow-notes-timeline {
        gap: 8px;
    }

    .grow-note-card {
        padding: 12px 14px;
        gap: 10px;
    }

    .grow-note-icon {
        font-size: 22px;
    }

    .grow-mood-week {
        gap: 3px;
    }

    .mood-day {
        padding: 6px 2px;
    }

    .mood-emoji {
        font-size: 18px;
    }

    .grow-sleep-stats {
        gap: 4px;
    }

    .sleep-stat {
        padding: 8px;
    }

    .sleep-val {
        font-size: 18px;
    }

    .growth-mini-stats {
        gap: 4px;
    }

    .growth-mini-stat {
        padding: 8px 10px;
    }

    .growth-mini-stat .stat-value {
        font-size: 16px;
    }

    .grow-vac-item {
        flex-wrap: wrap;
        gap: 8px;
    }

    .feeding-item {
        flex-wrap: wrap;
        gap: 6px;
    }

    .grow-word-input {
        flex-wrap: wrap;
    }

    .btn-word-add {
        width: 100%;
    }

    .grow-doctor-note {
        flex-direction: column;
        gap: 6px;
    }

    .allergy-item {
        flex-wrap: wrap;
    }

    .grow-milestone-card {
        padding: 14px;
        gap: 10px;
    }

    .ms-icon {
        width: 44px;
        height: 44px;
        font-size: 28px;
    }

    .ms-content strong {
        font-size: 14px;
    }

    .grow-bmi-display {
        padding: 10px;
    }

    .bmi-val {
        font-size: 34px;
    }

    .grow-hero-visual-bg::after {
        font-size: 32px;
        bottom: 8px;
        right: 16px;
        letter-spacing: 10px;
    }

    .grow-af-icon {
        width: 38px;
        height: 38px;
        font-size: 20px;
    }

    .grow-af-item {
        max-width: 80px;
    }

    .grow-af-item span {
        font-size: 10px;
    }
}

@media (max-width: 375px) {
    .grow-section-academy {
        padding: 16px 10px 28px;
    }




    .grow-card-header {
        padding: 10px 12px;
        gap: 8px;
    }

    .grow-card-header h3 {
        font-size: 13px;
    }

    .grow-card-body {
        padding: 12px;
    }

    .grow-tooth {
        width: 34px;
        height: 34px;
        font-size: 16px;
    }

    .grow-profile-avatar {
        width: 48px;
        height: 48px;
        font-size: 24px;
        border-radius: 16px;
    }

    .grow-profile-info h1 {
        font-size: 18px;
    }

    .gradient-title {
        font-size: 18px;
    }

    .grow-hero-visual {
        height: 220px;
    }

    .grow-af-icon {
        width: 34px;
        height: 34px;
        font-size: 18px;
        border-radius: 12px;
    }

    .grow-af-item {
        max-width: 70px;
    }
}

@media (max-width: 320px) {
    .grow-section-academy {
        padding: 14px 8px 24px;
    }






    .grow-card-header h3 {
        font-size: 12px;
    }

    .grow-tooth {
        width: 30px;
        height: 30px;
        font-size: 14px;
        border-radius: 8px;
    }

    .grow-profile-avatar {
        width: 40px;
        height: 40px;
        font-size: 20px;
    }

    .grow-profile-info h1 {
        font-size: 16px;
    }

    .gradient-title {
        font-size: 16px;
    }

    .grow-hero-visual {
        height: 180px;
    }

    .grow-af-icon {
        width: 30px;
        height: 30px;
        font-size: 16px;
    }

    .grow-af-item {
        max-width: 60px;
    }

    .grow-af-item span {
        font-size: 9px;
    }

    .grow-card-academy {
        border-radius: 12px;
    }
}
/* Mobile responsive */
@media (max-width: 768px) {
    .kalori-big { font-size: 40px !important; }
    .grow-lab-item { padding: 10px 6px !important; }
    .grow-lab-item .lab-value { font-size: 18px !important; }
}
@media (max-width: 480px) {
    .grow-beslenme-gunler .bes-gun-btn {
        padding: 8px 4px !important; font-size: 11px !important; min-width: 34px !important;
    }
    .grow-beslenme-gunler { gap: 4px !important; }
}
@media (max-width: 768px) {
    .neu-grid-2 { grid-template-columns: 1fr; }
    .neu-macro-grid { gap: 10px; }
    .neu-macro-card { padding: 14px 10px; }
    .neu-besin-ekle { flex-direction: column; }
    .neu-add-btn { width: 100%; border-radius: 16px; height: 48px; }
}
@media (max-width: 768px) {
    .health-grid { grid-template-columns: 1fr !important; }
    .grow-labs-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .grow-burc-grid { grid-template-columns: 1fr; }
    .grow-evler-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 480px) {
    .grow-evler-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Responsive: tek kolon */
@media (max-width: 1024px) {
    .grow-layout {
        grid-template-columns: 1fr;
        padding: 0;
        gap: 0;
        min-height: 0;
    }
    .grow-layout-side {
        position: static;
        height: auto;
        overflow: visible;
        padding: 12px 12px 0;
    }
    .grow-side-panel {
        height: auto;                   /* Sabit yüksekliği kaldır → taşma/kesilme olmaz */
        max-height: none;
        overflow: visible;
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        padding: 18px 14px;
        border-radius: 22px;
    }
    .grow-side-panel .grow-profile-glass {
        flex-direction: row;
        flex-wrap: wrap;
        text-align: left;
        justify-content: center;
        gap: 12px;
    }
    .grow-side-panel .grow-profile-left {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
    }
    .grow-side-panel .grow-profile-info h1 { font-size: 20px; }
    .grow-side-panel .grow-profile-stats {
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
    }
    .grow-side-panel .grow-ps-item {
        flex-direction: column;
        text-align: center;
        gap: 4px;
        padding: 8px 4px;
    }
    /* Menü 2 sütunlu temiz grid */
    .grow-side-panel .grow-side-nav {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
        flex: none;
    }
    .grow-side-panel .grow-side-title {
        grid-column: 1 / -1;
        width: 100%;
        margin-bottom: 2px;
    }
    .grow-side-panel .grow-side-link {
        width: 100%;
        flex: none;
        min-width: 0;
        justify-content: center;
        padding: 12px 10px;
        font-size: 13px;
        border-radius: 14px;
    }
    .grow-layout-main {
        padding: 24px 16px 50px;
    }
}
@media (max-width: 640px) {
    .grow-side-panel .grow-profile-avatar {
        width: 68px;
        height: 68px;
        font-size: 30px;
    }
    .grow-side-panel .grow-profile-glass {
        justify-content: center;
    }
    .grow-side-panel .grow-profile-left {
        flex-direction: column;
        align-items: center;
    }
    .grow-side-panel .grow-profile-stats {
        grid-template-columns: repeat(2, 1fr);   /* 4'lü grid telefonlarda dardı → 2'li */
    }
    .grow-side-panel .grow-side-nav {
        grid-template-columns: 1fr;               /* Menü tek kolon → tam genişlik */
        gap: 6px;
    }
    .grow-side-panel .grow-side-link {
        justify-content: flex-start;
        padding: 12px 16px;
        font-size: 14px;
        text-align: left;
    }
    .grow-layout-main {
        padding: 18px 12px 40px;
    }
}
@media (max-width: 480px) {
    .grow-side-panel {
        border-radius: 18px;
        padding: 14px 10px;
    }
    .grow-side-panel .grow-profile-glass { padding: 14px 10px; }
    .grow-side-panel .grow-profile-info h1 { font-size: 18px; }
}
/* ═══════════════════════════════════════════════════ */
/* BEBEK AKADEMİ - RESPONSIVE / DUYARLI AYARLAR       */
/* ═══════════════════════════════════════════════════ */

/* 1024px - Tablet / Küçük Laptop */
@media (max-width: 1024px) {
    .articles-container { padding: 30px 20px 50px; }
    .academy-hero { padding: 16px 24px; }
    .academy-hero-content h1 { font-size: clamp(24px, 4vw, 34px); }
    .academy-features { gap: 16px; }
}

/* 900px - Dikey tablet: kenar çubuk tek kolona / üste al */
@media (max-width: 900px) {
    .articles-container {
        grid-template-columns: 1fr;
        gap: 28px;
    }
    .articles-sidebar {
        position: static;
    }
}

/* 600px - Telefon: sidebar tek kolon, hero/kartlar küçülür */
@media (max-width: 600px) {
    .academy-hero { padding: 12px 16px; }
    .academy-hero-content { padding: 0 8px; }
    .academy-hero-content h1 { font-size: clamp(20px, 5.5vw, 28px); line-height: 1.3; }
    .academy-features { gap: 12px; }

    .af-icon { width: 52px; height: 52px; font-size: 24px; border-radius: 16px; }
    .af-item { max-width: 140px; }
    .af-item span { font-size: 12px; }

    .articles-sidebar { grid-template-columns: 1fr; }
    .sidebar-card { padding: 14px; }
    .cat-btn { padding: 10px 12px; font-size: 13px; }

    .art-grid { gap: 24px; }
    .art-card {
        border-radius: var(--radius-lg);
        transform: none !important;   /* Dokunmatik ekranda hover kaymasını kapat */
    }
    .art-card:hover { transform: none !important; box-shadow: none !important; }
    .art-card::after { display: none; }  /* Parlama efekti mobilde gereksiz */
    .art-img { height: 190px; }
    .art-body { padding: 16px; }
    .art-card h3 { font-size: 15px; }
    .art-footer { padding-top: 14px; }
    .art-footer a {
        display: block;
        width: 100%;
        text-align: center;
        padding: 12px 16px;
        font-size: 14px;
    }
}

/* 400px - Çok küçük ekran */
@media (max-width: 400px) {
    .academy-hero-content h1 { font-size: clamp(18px, 6vw, 24px); }
    .af-icon { width: 44px; height: 44px; font-size: 20px; border-radius: 14px; }
    .art-img { height: 170px; }
    .art-body { padding: 14px; }
    .art-footer a { padding: 12px 14px; }
}