/* ===============================
   FRONTEND RESPONSIVE
================================ */

@media (max-width: 1200px){

    .service-grid{
        grid-template-columns:repeat(3,1fr);
    }

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

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

}

@media (max-width: 992px){

    .hero-grid{
        grid-template-columns:1fr;
    }

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

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

    .skills-layout{
        grid-template-columns:1fr;
    }

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

    .contact-cta{
        grid-template-columns:1fr;
    }

}

@media (max-width: 768px){

    .navbar{
        height:72px;
    }

    .nav-menu{
        position:absolute;
        top:72px;
        left:0;
        right:0;
        background:#fff;
        flex-direction:column;
        gap:0;
        padding:18px;
        border-bottom:1px solid var(--border);
        display:none;
    }

    .nav-menu.active{
        display:flex;
    }

    .nav-menu a{
        width:100%;
        padding:12px 0;
    }

    .mobile-toggle{
        display:block;
    }

    .nav-phone{
        display:none;
    }

    .hero-section{
        padding:50px 0 35px;
    }

    .hero-title{
        font-size:42px;
    }

    .hero-subtitle{
        font-size:22px;
    }

    .hero-actions{
        flex-direction:column;
        align-items:flex-start;
    }

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

    .service-grid,
    .card-grid,
    .skill-columns{
        grid-template-columns:1fr;
    }

    .section{
        padding:60px 0;
    }

    .section-header h2{
        font-size:34px;
    }

    .cta-info{
        grid-template-columns:1fr;
    }

    .footer-grid{
        grid-template-columns:1fr;
    }

}

@media (max-width: 480px){

    .container{
        width:90%;
    }

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

    .section-header h2{
        font-size:30px;
    }

    .contact-cta{
        padding:28px;
    }

}

/* Premium public UI responsive refinements */

@media (max-width: 1200px){
    .logo-copy small{
        display:none;
    }

    .nav-menu{
        gap:3px;
    }

    .nav-menu a{
        padding-inline:10px;
    }

    .hero-grid{
        grid-template-columns:minmax(0,1fr) minmax(390px,.85fr);
        gap:55px;
    }

    .float-one{
        left:-35px;
    }

    .float-two{
        right:-15px;
    }

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

    .service-card,
    .service-card:nth-last-child(-n+2){
        grid-column:span 1;
    }

    .service-card:last-child{
        grid-column:1/-1;
    }
}

@media (max-width: 992px){
    .navbar{
        height:78px;
    }

    .logo-copy strong{
        max-width:180px;
    }

    .nav-phone{
        display:none;
    }

    .hero-section{
        min-height:auto;
        padding:70px 0 115px;
    }

    .hero-grid{
        grid-template-columns:1fr;
        gap:38px;
    }

    .hero-content{
        max-width:720px;
        padding-bottom:0;
    }

    .hero-image-wrap{
        width:min(100%,620px);
        min-height:570px;
        margin:0 auto;
    }

    .hero-visual-card{
        width:min(100%,500px);
        margin:auto;
    }

    .stats-wrap{
        margin-top:-55px;
    }

    .stats-grid::before{
        display:none;
    }

    .stat-item{
        justify-content:flex-start;
        padding:0 20px;
    }

    .stat-item:nth-child(2){
        border-right:0;
    }

    .skills-layout{
        grid-template-columns:1fr;
    }

    .skills-layout > div:first-child{
        position:static;
        max-width:660px;
    }

    .footer-grid{
        grid-template-columns:1.4fr 1fr 1fr;
    }

    .footer-col:last-child{
        grid-column:2/-1;
    }
}

@media (max-width: 768px){
    .container{
        width:min(100% - 32px,1240px);
    }

    .site-header{
        overflow:visible;
    }

    .navbar{
        height:72px;
    }

    .logo-mark{
        width:39px;
        height:39px;
        border-radius:12px;
    }

    .logo-copy strong{
        max-width:190px;
        font-size:13px;
    }

    .nav-menu{
        top:72px;
        left:16px;
        right:16px;
        gap:4px;
        padding:10px;
        border:1px solid rgba(31,29,46,.08);
        border-radius:0 0 20px 20px;
        box-shadow:0 22px 50px rgba(57,39,50,.13);
    }

    .nav-menu a{
        padding:12px 14px;
        border-radius:10px;
    }

    .mobile-toggle{
        display:grid;
    }

    .hero-section{
        padding:48px 0 100px;
    }

    .hero-section::before{
        mask-image:linear-gradient(to bottom,black,transparent 75%);
    }

    .hero-title{
        font-size:clamp(45px,13vw,62px);
    }

    .hero-subtitle{
        font-size:21px;
    }

    .hero-actions{
        flex-direction:row;
        align-items:center;
        flex-wrap:wrap;
    }

    .hero-image-wrap{
        width:100%;
        min-height:520px;
    }

    .hero-visual-card{
        max-width:430px;
    }

    .hero-image{
        height:390px;
    }

    .stats-grid{
        gap:8px;
        padding:14px;
    }

    .stat-item{
        min-height:82px;
        padding:0 10px;
        border-right:0;
        border-bottom:1px solid var(--border);
    }

    .stat-item:last-child{
        border-bottom:0;
    }

    .section{
        padding:82px 0;
    }

    .section-header{
        margin-bottom:38px;
    }

    .service-grid{
        grid-template-columns:1fr;
    }

    .service-card,
    .service-card:last-child{
        grid-column:auto;
        min-height:245px;
    }

    .card-grid,
    .skill-columns{
        grid-template-columns:1fr;
    }

    .project-card,
    .blog-card,
    .testimonial-card{
        width:min(100%,520px);
        margin-inline:auto;
    }

    .project-card:last-child:nth-child(3n+1),
    .skill-box:last-child:nth-child(odd){
        grid-column:auto;
    }

    .contact-cta{
        grid-template-columns:1fr;
        padding:38px 30px;
    }

    .cta-single-action{
        justify-self:start;
    }

    .footer-grid{
        grid-template-columns:1fr 1fr;
        gap:36px;
    }

    .footer-brand{
        grid-column:1/-1;
    }

    .footer-col:last-child{
        grid-column:auto;
    }
}

@media (max-width: 520px){
    .container{
        width:min(100% - 26px,1240px);
    }

    .logo-copy strong{
        max-width:160px;
    }

    .hero-section{
        padding-top:38px;
    }

    .badge{
        max-width:100%;
        font-size:9px;
    }

    .hero-title{
        font-size:43px;
    }

    .hero-actions{
        align-items:stretch;
    }

    .hero-actions .btn-primary,
    .hero-actions .btn-outline{
        flex:1 1 100%;
    }

    .hero-trust{
        align-items:flex-start;
    }

    .hero-image-wrap{
        min-height:460px;
    }

    .hero-visual-card{
        padding:7px;
        border-radius:25px;
        transform:none;
    }

    .hero-image{
        height:340px;
        border-radius:20px;
    }

    .visual-profile{
        padding:14px 10px 10px;
    }

    .visual-profile strong{
        font-size:19px;
    }

    .visual-profile p{
        max-width:220px;
        font-size:10px;
    }

    .profile-monogram{
        width:42px;
        height:42px;
        border-radius:14px;
    }

    .section-header h2,
    .section-title{
        font-size:37px;
    }

    .service-card{
        padding:24px;
    }

    .card-img{
        height:215px;
    }

    .skills-layout{
        gap:34px;
    }

    .contact-cta{
        padding:32px 23px;
        border-radius:27px;
    }

    .footer-grid{
        grid-template-columns:1fr;
    }

    .footer-brand,
    .footer-col:last-child{
        grid-column:auto;
    }
}