/* ===========================================================
   polish.css — final refinement layer
   Loaded last. Subtle only: rhythm, focus, hover, legibility.
   =========================================================== */

:root{
  --polish-ease: cubic-bezier(.22,.61,.36,1);
}

/* native pointer restored (custom cursor removed) */
html, body{ cursor:auto; }
.cursor-dot, .cursor-ring, .cursor-label, .cursor-burst{ display:none !important; }

/* ---------- Selection + focus ---------- */
::selection{ background:var(--orange,#fd9b15); color:#0b0b0b; }
a:focus-visible, button:focus-visible,
input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline:2px solid var(--orange,#fd9b15);
  outline-offset:3px;
  border-radius:4px;
}

/* ---------- Typography rhythm ---------- */
p{ text-wrap:pretty; }
h1,h2,h3,.display{ text-wrap:balance; }
.section-head p{ max-width:62ch; }

/* ---------- Nav ---------- */
.nav-links a{ position:relative; }
.nav-links a::after{
  content:""; position:absolute; left:0; right:0; bottom:-6px; height:1px;
  background:var(--orange,#fd9b15);
  transform:scaleX(0); transform-origin:right;
  transition:transform .38s var(--polish-ease);
}
.nav-links a:hover::after,
.nav-links a[aria-current="page"]::after{ transform:scaleX(1); transform-origin:left; }

/* ---------- Buttons ---------- */
.btn, .nav-cta{
  transition:background-color .3s var(--polish-ease),
             color .3s var(--polish-ease),
             border-color .3s var(--polish-ease),
             box-shadow .3s var(--polish-ease);
}
.btn:hover, .nav-cta:hover{
  box-shadow:0 10px 30px -14px rgba(253,155,21,.55);
}

/* ---------- Cards ---------- */
.case-card, .work-card, .showcase-card{
  transition:transform .5s var(--polish-ease);
}
.case-card:hover, .work-card:hover{ transform:translateY(-6px); }

.case-card .img-frame, .work-card .img-frame, .showcase-card .img-frame{
  overflow:hidden;
}
.case-card .img-frame img,
.work-card .img-frame img,
.showcase-card img{
  transition:transform .8s var(--polish-ease), filter .6s var(--polish-ease);
  will-change:transform;
}
.case-card:hover .img-frame img,
.work-card:hover .img-frame img,
.showcase-card:hover img{ transform:scale(1.045); }

.case-tag{
  transition:color .3s var(--polish-ease), border-color .3s var(--polish-ease);
}
.case-card:hover .case-tag{ color:var(--orange,#fd9b15); border-color:var(--orange,#fd9b15); }

/* ---------- Images ---------- */
.img-frame{ background:color-mix(in oklab, var(--bg-alt,#111) 88%, #000); }
img{ image-rendering:auto; }

/* ---------- Scroll progress ---------- */
.scroll-progress{
  background:linear-gradient(90deg,
    color-mix(in oklab, var(--orange,#fd9b15) 55%, transparent),
    var(--orange,#fd9b15));
}

/* ---------- Forms ---------- */
.field input, .field textarea, .field select{
  transition:border-color .3s var(--polish-ease), background-color .3s var(--polish-ease);
}
.field input:hover, .field textarea:hover{ border-color:rgba(255,255,255,.28); }

/* ---------- Service scroll list ---------- */
.svc-list-item{ transition:opacity .45s var(--polish-ease), transform .45s var(--polish-ease); }
.svc-list-item.active{ transform:translateX(4px); }

/* ---------- Section separation ---------- */
.section + .section{ padding-top:clamp(64px, 8vw, 120px); }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  .case-card:hover, .work-card:hover{ transform:none; }
  .case-card:hover .img-frame img{ transform:none; }
}
