
/* =========================================================
   AGGRO v11 — official brandbook silhouettes + premium motion
   ========================================================= */

/* The hero image remains clean: no secondary AGGRO inscription over meat. */
.hero-signature{display:none!important}

/* Remove the old bounce animation everywhere. */
.feature:hover svg,
.business-card:hover .business-icon,
.process-step:hover .process-icon,
.store-point:hover>span:first-child{
  animation:none!important;
}

/* Main brand silhouette family. */
.feature--silhouette{
  grid-template-columns:78px 1fr!important;
  align-items:center!important;
  min-height:112px;
  transform:translate3d(0,0,0);
  transition:
    transform .72s cubic-bezier(.16,.84,.22,1),
    box-shadow .62s ease,
    background .62s ease,
    border-color .5s ease!important;
}
.feature--silhouette:hover{
  transform:translate3d(0,-4px,0) scale(1.006)!important;
  background:rgba(126,203,182,.20)!important;
  box-shadow:0 22px 48px rgba(130,0,29,.09)!important;
}
.feature-mark{
  position:relative;
  width:70px;height:64px;
  display:grid;place-items:center;
  color:#7ECBB6;
  border-radius:22px;
  background:rgba(255,255,255,.24);
  border:1px solid rgba(130,0,29,.10);
  box-shadow:0 12px 28px rgba(130,0,29,.07),inset 0 0 0 1px rgba(255,255,255,.18);
  overflow:hidden;
  transform:translate3d(0,0,0) rotate(0deg) scale(1);
  transition:
    transform .82s cubic-bezier(.16,.92,.22,1),
    box-shadow .72s ease,
    background .72s ease,
    color .55s ease;
}
.feature-mark::before{
  content:"";position:absolute;inset:-55% -85%;
  background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.66) 50%,transparent 58%);
  transform:translateX(-55%) rotate(12deg);opacity:0;
  transition:transform 1.05s cubic-bezier(.2,.72,.2,1),opacity .45s ease;
}
.feature-mark::after{
  content:"";position:absolute;inset:7px;border-radius:17px;
  border:1px solid rgba(215,20,64,.18);opacity:0;transform:scale(.84);
  transition:opacity .65s ease,transform .82s cubic-bezier(.16,.92,.22,1);
}
.feature--silhouette:hover .feature-mark{
  transform:translate3d(0,-6px,0) rotate(-1.8deg) scale(1.045);
  background:rgba(255,229,194,.74);
  box-shadow:0 22px 38px rgba(130,0,29,.13),inset 0 0 0 1px rgba(126,203,182,.20);
}
.feature--silhouette:hover .feature-mark::before{opacity:.72;transform:translateX(58%) rotate(12deg)}
.feature--silhouette:hover .feature-mark::after{opacity:1;transform:scale(1)}
.feature--silhouette h3{transition:color .5s ease,transform .65s cubic-bezier(.16,.84,.22,1)}
.feature--silhouette p{transition:transform .65s cubic-bezier(.16,.84,.22,1),color .5s ease}
.feature--silhouette:hover h3{color:#82001D;transform:translateX(2px)}
.feature--silhouette:hover p{transform:translateX(2px);color:#82001D}

.brand-pig-mask{
  position:relative;z-index:2;display:block;width:58px;height:38px;background:#7ECBB6;
  -webkit-mask:url('../images/brandbook-pig-official.png') center/contain no-repeat;
  mask:url('../images/brandbook-pig-official.png') center/contain no-repeat;
  transform:translate3d(0,0,0);
  transition:transform .82s cubic-bezier(.16,.92,.22,1),background .55s ease;
}
.feature--silhouette:hover .brand-pig-mask{transform:translate3d(3px,-1px,0) scale(1.045);background:#D71440}
.brand-silhouette{position:relative;z-index:2;width:50px!important;height:50px!important;padding:0!important;fill:currentColor!important;stroke:none!important;background:none!important;box-shadow:none!important;overflow:visible}
.brand-silhouette path{fill:currentColor!important;stroke:none!important}
.brand-silhouette .brand-accent{fill:#D71440!important;transition:fill .55s ease}
.feature--silhouette:hover .brand-silhouette{transform:translate3d(2px,-1px,0) rotate(1deg) scale(1.035)}

/* Business icons follow the same flat silhouette grammar. */
.business-icon--silhouette{
  position:relative;overflow:hidden;width:82px!important;height:76px!important;border-radius:24px!important;
  color:#7ECBB6!important;background:rgba(255,255,255,.24)!important;border:1px solid rgba(130,0,29,.10)!important;
  box-shadow:0 12px 28px rgba(130,0,29,.07)!important;
  transition:transform .82s cubic-bezier(.16,.92,.22,1),box-shadow .7s ease,background .7s ease!important;
}
.business-icon--silhouette::before{
  content:"";position:absolute;inset:-45% -80%;background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.64) 50%,transparent 58%);
  transform:translateX(-60%) rotate(12deg);opacity:0;transition:transform 1.05s cubic-bezier(.2,.72,.2,1),opacity .45s ease
}
.business-card{transition:transform .72s cubic-bezier(.16,.84,.22,1),box-shadow .62s ease,background .62s ease,border-color .55s ease!important}
.business-card:hover{transform:translate3d(0,-5px,0) scale(1.008)!important}
.business-card:hover .business-icon--silhouette{
  transform:translate3d(0,-6px,0) rotate(-1.5deg) scale(1.045)!important;
  background:rgba(255,229,194,.78)!important;box-shadow:0 22px 40px rgba(130,0,29,.13)!important
}
.business-card:hover .business-icon--silhouette::before{opacity:.75;transform:translateX(60%) rotate(12deg)}
.business-icon--silhouette .brand-silhouette{width:52px!important;height:52px!important}

/* Smooth premium micro-motion for the remaining icon systems. */
.process-step,.store-point,.contact-route article,.contact-item{
  transition:transform .7s cubic-bezier(.16,.84,.22,1),box-shadow .62s ease,background .55s ease!important
}
.process-step:hover,.contact-route article:hover,.contact-item:hover{transform:translate3d(0,-4px,0)!important}
.process-icon,.store-point>span:first-child,.contact-route__icon,.contact-item__icon{
  transition:transform .8s cubic-bezier(.16,.92,.22,1),box-shadow .7s ease,background .6s ease!important
}
.process-step:hover .process-icon,.store-point:hover>span:first-child,.contact-route article:hover .contact-route__icon,.contact-item:hover .contact-item__icon{
  transform:translate3d(0,-5px,0) rotate(-1.5deg) scale(1.035)!important
}

@media(max-width:1250px){
  .feature--silhouette{grid-template-columns:70px 1fr!important}
}
@media(max-width:900px){
  .feature--silhouette{grid-template-columns:74px 1fr!important;min-height:96px}
  .feature-mark{width:66px;height:60px}
}
@media(max-width:560px){
  .feature--silhouette{grid-template-columns:68px 1fr!important}
  .feature-mark{width:60px;height:56px;border-radius:18px}
  .brand-pig-mask{width:50px;height:34px}
  .brand-silhouette{width:44px!important;height:44px!important}
}
@media(prefers-reduced-motion:reduce){
  .feature--silhouette,.feature-mark,.brand-pig-mask,.brand-silhouette,.business-card,.business-icon--silhouette,
  .process-step,.process-icon,.store-point,.contact-route article,.contact-item,.contact-route__icon,.contact-item__icon{transition:none!important;transform:none!important}
}
