/* Projects page mobile polish only. Keep desktop composition and content unchanged. */
@media (max-width:700px){
  .projects-page .projects-portfolio{
    padding-top:72px;
    padding-bottom:82px;
  }

  .projects-page .projects-section-head--compact{
    margin-bottom:22px;
  }

  .projects-page .projects-filterbar{
    gap:8px;
    margin-bottom:28px;
  }

  .projects-page .projects-filterbar button{
    min-height:40px;
    padding:9px 12px;
  }

  .projects-page .projects-portfolio-grid{
    grid-template-columns:1fr;
    gap:18px;
  }

  .projects-page .projects-portfolio-grid .portfolio-card{
    border-color:rgba(24,48,91,.15);
    box-shadow:0 12px 30px rgba(18,36,72,.055);
  }

  .projects-page .projects-portfolio-grid .portfolio-visual,
  .projects-page .projects-portfolio-grid .portfolio-card:nth-child(3n+1) .portfolio-visual{
    aspect-ratio:16/10;
  }

  .projects-page .projects-portfolio-grid .portfolio-card:nth-child(-n+3) .portfolio-visual{
    aspect-ratio:4/3;
  }

  .projects-page .projects-portfolio-grid .portfolio-card:nth-child(-n+3){
    border-color:rgba(49,94,251,.24);
    box-shadow:0 16px 38px rgba(26,53,108,.08);
  }

  .projects-page .projects-portfolio-grid .portfolio-card:nth-child(-n+3) .body .h3{
    font-size:1.18rem;
  }

  .projects-page .projects-portfolio-grid .portfolio-visual picture,
  .projects-page .projects-portfolio-grid .portfolio-visual img{
    width:100%;
    height:100%;
    display:block;
  }

  .projects-page .projects-portfolio-grid .portfolio-visual img{
    object-fit:cover;
  }

  .projects-page .projects-portfolio-grid .portfolio-card .body{
    padding:20px 18px 21px;
  }

  .projects-page .projects-portfolio-grid .portfolio-card .body p{
    line-height:1.62;
  }

  .projects-page .projects-portfolio-grid .portfolio-card .btn{
    min-height:44px;
    padding:10px 14px;
    align-items:center;
    justify-content:center;
  }

  .projects-page .projects-portfolio-grid .portfolio-card .btn + .btn{
    margin-top:8px;
  }

  .projects-page .projects-portfolio-grid .portfolio-card:nth-child(3n+4){
    margin-top:12px;
  }
}

@media (max-width:420px){
  .projects-page .projects-portfolio{
    padding-top:62px;
    padding-bottom:72px;
  }

  .projects-page .projects-portfolio-grid{
    gap:16px;
  }

  .projects-page .projects-portfolio-grid .portfolio-card:nth-child(3n+4){
    margin-top:10px;
  }

  .projects-page .projects-portfolio-grid .portfolio-card .body{
    padding:18px 16px 19px;
  }

  .projects-page .projects-portfolio-grid .portfolio-card .btn{
    width:100%;
  }
}