/* RC26: comportament mòbil de serveis i projectes. Carregat al final de la cascada. */
.project-sheet-handle{display:none}

@media(max-width:620px){
  .service-grid{overflow-anchor:none}
  .service-detail{transform-origin:top;animation:rc26-service-down .34s cubic-bezier(.16,1,.3,1) both}

  .project-dialog{
    position:fixed!important;
    inset:auto 0 0!important;
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
    height:90dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:44px 20px max(24px,env(safe-area-inset-bottom))!important;
    border-radius:22px 22px 0 0!important;
    border-bottom:0;
    overflow-y:auto;
    overscroll-behavior-y:contain;
    touch-action:pan-y;
    scrollbar-width:none;
    transform:translateY(var(--sheet-drag,0));
    transition:transform .56s cubic-bezier(.16,1,.3,1);
  }
  .project-dialog::-webkit-scrollbar{display:none}
  .project-dialog[open]{animation:rc28-sheet-in .68s cubic-bezier(.16,1,.3,1) both!important}
  .project-dialog[open].is-entered{animation:none!important}
  .project-dialog.is-snapping{animation:none!important;transition:transform .56s cubic-bezier(.16,1,.3,1)!important}
  .project-dialog.is-expanded{height:90dvh!important;border-radius:22px 22px 0 0!important}
  .project-dialog.is-dragging{animation:none!important;transition:none!important;transform:translateY(var(--sheet-drag,0))!important}
  .project-dialog[open].is-closing{animation:none!important;transition:transform .56s cubic-bezier(.4,0,.2,1)!important;transform:translateY(102%)!important}
  .project-dialog::backdrop{background:#000b;backdrop-filter:blur(4px)}
  .project-close{display:none!important}
  .project-sheet-handle{
    position:sticky;
    top:-44px;
    z-index:120;
    display:flex;
    align-items:flex-start;
    justify-content:center;
    height:44px;
    margin:-44px -20px 10px;
    padding-top:11px;
    background:linear-gradient(180deg,#101213 72%,#10121300);
    touch-action:none;
  }
  .project-sheet-handle span{display:block;width:46px;height:4px;border-radius:4px;background:#747879}
  .project-about{margin:18px 0 0!important;padding:26px 0!important;gap:20px}
  .project-about ul{padding:0!important;margin:0!important}
  .project-domain,.project-domain:hover,.project-domain:active,.project-domain:focus,.project-domain:focus-visible{border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;padding:0!important}
  .project-domain:focus,.project-domain:focus-visible{color:var(--lime)}
}

@keyframes rc26-service-down{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@keyframes rc26-sheet-in{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes rc28-sheet-in{from{transform:translateY(104%);opacity:.68}to{transform:translateY(0);opacity:1}}

@media(prefers-reduced-motion:reduce){
  .service-detail,.project-dialog[open]{animation:none!important}
}

/* RC29: sense indicador de focus als projectes i més aire entre CTA i imatge. */
.project-dialog:focus,
.project-dialog:focus-visible,
.featured-projects:focus,
.featured-projects:focus-visible,
.featured-project-open:focus,
.featured-project-open:focus-visible,
.project-card [data-project]:focus,
.project-card [data-project]:focus-visible{
  outline:0!important;
  box-shadow:none!important;
}
@media(max-width:900px){
  .featured-slide{gap:24px!important}
}
@media(max-width:620px){
  .featured-slide{gap:28px!important}
}