/* ==========================================================================
   Service Nav Strip — shared component
   ========================================================================== */
.sh-nav{background:var(--white);padding:30px 40px;width:100%}
.sh-nav-eyebrow{font-size:12px;font-weight:800;letter-spacing:0.3em;text-transform:uppercase;color:rgba(0,0,0,0.32);text-align:center;display:block;margin-bottom:20px}
.sh-nav-grid{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.sh-nav-item{display:flex;align-items:center;gap:14px;padding:14px 28px;text-decoration:none;cursor:pointer}
.sh-nav-circle{width:24px;height:24px;border-radius:50%;flex-shrink:0;position:relative;overflow:hidden;transition:transform 0.3s cubic-bezier(0.4,0,0.2,1)}
.sh-nav-circle::before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:rgba(255,255,255,0.55);transition:width 0.6s ease,height 0.6s ease,top 0.6s ease,left 0.6s ease;transform:translate(-50%,-50%);z-index:1}
.sh-nav-item:hover .sh-nav-circle{transform:scale(1.15)}
.sh-nav-item:hover .sh-nav-circle::before{width:60px;height:60px}
.sh-nav-title{font-size:clamp(20px,2.8vw,42px);font-weight:900;line-height:0.9;letter-spacing:-0.03em;text-transform:uppercase}

@media (max-width: 1024px) {
  .sh-nav-title { font-size: clamp(14px, 1.8vw, 26px); }
}

@media (max-width: 768px) {
  .sh-nav-grid { grid-template-columns: repeat(2, 1fr); }
  .sh-nav-item { padding: 14px 0; }
}