/* ==========================================
   Idea2Founder v3.0
   Responsive Stylesheet
========================================== */

@media (max-width: 1024px){

    .hero h1{
        font-size:52px;
    }

    nav{
        gap:18px;
    }

}

@media (max-width:768px){

    .navbar .container{

        flex-direction:column;

        gap:15px;

        padding:15px 0;

    }

    nav{

        flex-wrap:wrap;

        justify-content:center;

    }

    .hero{

        padding:120px 20px 60px;

        height:auto;

        min-height:100vh;

    }

    .hero h1{

        font-size:38px;

    }

    .hero p{

        font-size:18px;

    }

    .buttons{

        flex-direction:column;

        align-items:center;

    }

    .primary-btn,
    .secondary-btn{

        width:240px;

        text-align:center;

    }

}

@media (max-width:480px){

    .brand span{

        font-size:20px;

    }

    .hero h1{

        font-size:30px;

    }

    .hero p{

        font-size:16px;

    }

}
/* ==========================================
   Idea2Founder v3.1
   Responsive Styles
========================================== */

/* Tablet */

@media (max-width:1024px){

    .nav-links{
        gap:18px;
    }

    .hero h1{
        font-size:52px;
    }

    .stats .container,
    .idea-grid,
    .features-grid,
    .story-grid{
        grid-template-columns:repeat(2,1fr);
    }

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

    .footer .container{
        grid-template-columns:1fr;
        text-align:center;
    }

}

/* Mobile */

@media (max-width:768px){

    .navbar .container{
        flex-direction:column;
        height:auto;
        padding:20px 0;
    }

    .nav-links{
        flex-wrap:wrap;
        justify-content:center;
        margin:20px 0;
        gap:15px;
    }

    .actions{
        margin-top:10px;
    }

    .hero{
        height:auto;
        padding:140px 20px 80px;
    }

    .hero h1{
        font-size:36px;
    }

    .hero p{
        font-size:18px;
    }

    .buttons{
        flex-direction:column;
        align-items:center;
    }

    .stats .container,
    .idea-grid,
    .features-grid,
    .story-grid,
    .steps{
        grid-template-columns:1fr;
    }

}

/* Small Mobile */

@media (max-width:480px){

    .brand span{
        font-size:20px;
    }

    .brand img{
        width:40px;
        height:40px;
    }

    .hero h1{
        font-size:30px;
    }

    .hero p{
        font-size:16px;
    }

    .primary-btn,
    .secondary-btn{
        width:100%;
        text-align:center;
    }

}
/* ==========================================
   Large Mobile Improvements
========================================== */

@media (max-width:600px){

    section{
        padding:70px 20px;
    }

    .hero{
        padding-top:130px;
    }

    .hero-badge{
        font-size:14px;
        padding:8px 18px;
    }

    .hero h1{
        font-size:28px;
        line-height:1.3;
    }

    .section-subtitle{
        font-size:16px;
        padding:0 10px;
    }

    .card,
    .idea-card,
    .step-card,
    .feature-box,
    .story-card{
        padding:25px;
    }

}

/* ==========================================
   Extra Small Devices
========================================== */

@media (max-width:360px){

    .container{
        width:94%;
    }

    .brand span{
        font-size:18px;
    }

    .hero h1{
        font-size:24px;
    }

    .hero p{
        font-size:15px;
    }

    .primary-btn,
    .secondary-btn{
        padding:14px 20px;
        font-size:15px;
    }

    .card h2{
        font-size:34px;
    }

    .footer-logo img{
        width:55px;
    }

}