/* Home shortcut cards: bare icons, no tinted frame, larger and bolder.
   Loaded after site.css (index.html), so these rules win at equal specificity. */

/* duotone accent: gold detail inside each icon (.ico-accent); lighter gold on dark surfaces */
:root { --ico-accent: #F4B000; }
:root[data-theme="dark"] { --ico-accent: #FFD43B; }
.shortcut__icon .ico-accent,
.m-short__i .ico-accent { stroke: var(--ico-accent); }
.shortcut__icon .ico-spark,
.m-short__i .ico-spark { fill: var(--ico-accent); stroke-linejoin: round; }
.shortcut__icon .ico-bar,
.m-short__i .ico-bar { stroke-width: 5.5; stroke-linecap: round; }

/* desktop / tablet cards */
.shortcut__icon {
  width: auto;
  height: auto;
  border-radius: 0;
  background: none;
}
.shortcut__icon svg {
  width: 76px;
  height: 76px;
  stroke-width: 2.3;
  overflow: visible;
}
@media (hover: hover), (min-width: 640px) {
  .shortcut:hover .shortcut__icon { background: none; transform: translateY(-2px) scale(1.07); }
}
@media (max-width: 639.98px) {
  .shortcut__icon svg { width: 60px; height: 60px; }
}

/* phone row of small shortcuts */
.page-home .m-short__i span {
  width: auto;
  height: auto;
  border-radius: 0;
  background: none;
}
.page-home .m-short__i span svg {
  width: 32px;
  height: 32px;
  stroke-width: 2.9;
}

/* "Cadastre sua loja": calm loop (transform/opacity only) */
.ico-spark { transform-box: fill-box; transform-origin: center; }
.ico-awning { transform-origin: center; }
.shortcut__btn { position: relative; overflow: hidden; }
@media (prefers-reduced-motion: no-preference) {
  .shortcut--store .ico-awning { animation: ico-breathe 3.6s ease-in-out infinite; }
  .shortcut--store .ico-spark { animation: ico-twinkle 3s ease-in-out 0.8s infinite; }
  .m-short__i--store .ico-spark { animation: ico-twinkle 3s ease-in-out 0.8s infinite; }
  .shortcut--store .shortcut__btn::after {
    content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 40%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.55), transparent);
    transform: translateX(-120%) skewX(-18deg); pointer-events: none;
    animation: ico-shine 1.4s ease-out 0.9s 1 both;
  }
  .shortcut--store:hover .shortcut__btn::after { animation: ico-shine 1.1s ease-out 1 both; }
}
@keyframes ico-breathe { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-1.5px); } }
@keyframes ico-twinkle {
  0%, 60%, 100% { transform: scale(1); opacity: 1; }
  80% { transform: scale(1.22); opacity: 0.6; }
}
@keyframes ico-shine { from { transform: translateX(-120%) skewX(-18deg); } to { transform: translateX(380%) skewX(-18deg); } }
