/* Hestia Home — light motion. Works only when motion.js adds .de-motion to <html>
   (it does not when the visitor asked the system for reduced motion). Delete this file and motion.js to switch it all off. */

/* Buttons: a soft shine runs across the main buttons every few seconds */
.de-motion .de-btn--cta { position: relative; overflow: hidden; isolation: isolate; translate: var(--mx, 0) var(--my, 0); transition: background-color .2s ease, translate .25s cubic-bezier(.2, .7, .2, 1), box-shadow .25s ease; }
.de-motion .de-btn--cta::after { content: ""; position: absolute; inset: -20% auto -20% -60%; z-index: -1; width: 45%; background: linear-gradient(100deg, transparent 0%, rgba(255, 255, 255, 0.55) 50%, transparent 100%); transform: skewX(-18deg); animation: de-shine 5.5s ease-in-out infinite; animation-delay: var(--shine-delay, 1.2s); pointer-events: none; }
.de-motion .de-btn--cta:hover { box-shadow: 0 10px 24px rgba(224, 153, 19, 0.35); }
@keyframes de-shine { 0%, 62% { left: -60%; } 82%, 100% { left: 130%; } }

/* Arrows inside buttons nudge forward; on hover they move a bit further */
.de-motion .de-btn span[aria-hidden="true"] { display: inline-block; animation: de-nudge 2.6s ease-in-out infinite; }
.de-motion .de-btn:hover span[aria-hidden="true"] { animation: none; transform: translateX(5px); transition: transform .2s ease; }
@keyframes de-nudge { 0%, 70%, 100% { transform: none; } 80% { transform: translateX(4px); } 90% { transform: translateX(1px); } }

/* The first-screen button breathes: a soft ring that fades out */
.de-motion #hero-cta { box-shadow: 0 0 0 0 rgba(224, 153, 19, 0.5); animation: de-ring 3.2s ease-out infinite 2s; }
.de-motion #hero-cta:hover { animation: none; }
@keyframes de-ring { 0% { box-shadow: 0 0 0 0 rgba(224, 153, 19, 0.5); } 60%, 100% { box-shadow: 0 0 0 16px rgba(224, 153, 19, 0); } }

/* First screen: the offer comes in line by line (the layout itself does not change) */
.de-motion .de-herofull__text > * { animation: de-rise .7s cubic-bezier(.2, .7, .2, 1) both; }
.de-motion .de-herofull__text > :nth-child(1) { animation-delay: .05s; }
.de-motion .de-herofull__text > :nth-child(2) { animation-delay: .15s; }
.de-motion .de-herofull__text > :nth-child(3) { animation-delay: .3s; }
.de-motion .de-herofull__text > :nth-child(4) { animation-delay: .42s; }
.de-motion .de-herofull__text > :nth-child(5) { animation-delay: .54s; }
.de-motion .de-herofull__text > :nth-child(6) { animation-delay: .66s; }
@keyframes de-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

/* Cards lift slightly under the pointer */
@media (hover: hover) {
  .de-motion :is(.de-proof__card, .de-pack6 li, .de-vs__card, .de-estate__tiles li) { transition: transform .25s ease, box-shadow .25s ease; }
  .de-motion :is(.de-proof__card, .de-pack6 li, .de-vs__card):hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(32, 47, 76, 0.12); }
  .de-motion .de-estate__tiles li:hover { transform: translateY(-3px); }
  .de-motion .de-pack6 li:hover svg { animation: de-wiggle .5s ease; }
}
@keyframes de-wiggle { 0%, 100% { transform: none; } 30% { transform: rotate(-8deg) scale(1.06); } 60% { transform: rotate(6deg) scale(1.06); } }

/* "Three things": the line fills as you scroll (motion.js sets --fill) */
.de-motion .de-three__list::before { background: linear-gradient(var(--cta) var(--fill, 0%), var(--line) var(--fill, 0%)); }

/* VS and the Zagacie pin pulse softly */
.de-motion .de-vs__badge::after,
.de-motion .de-map__pin--home::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; animation: de-pulse 2.8s ease-out infinite; }
.de-motion .de-vs__badge::after { inset: -6px; border: 2px solid var(--cta); }
.de-motion .de-map__pin--home::after { left: 5px; top: 50%; width: 20px; height: 20px; margin-top: -10px; border: 2px solid var(--cta); }
@keyframes de-pulse { 0% { opacity: .9; transform: scale(.8); } 100% { opacity: 0; transform: scale(1.6); } }

/* Status "Wolny": a tiny live dot */
.de-motion .de-status--free::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: currentColor; vertical-align: middle; animation: de-blink 2s ease-in-out infinite; }
@keyframes de-blink { 50% { opacity: .25; } }