/* ============================================================
   HappyMac.gr — motion.css (site-wide motion pass, 31/7/2026)
   Φορτώνεται σε ΟΛΕΣ τις σελίδες. Μόνο transform/opacity —
   κανένα layout/paint κόστος. Ζευγάρι: /js/motion.js
   ============================================================ */

/* 1. View transitions μεταξύ σελίδων — 0.9s slide-up + fade
      (επιλογή Θανάση 31/7· δοκιμάστηκαν 0.35s/0.6s/0.9s).
      Browsers χωρίς υποστήριξη το αγνοούν σιωπηλά. */
@view-transition {
    navigation: auto;
}
@keyframes hm-page-out {
    to { opacity: 0; }
}
@keyframes hm-page-in {
    from { opacity: 0; transform: translateY(28px); }
    to   { opacity: 1; transform: none; }
}
::view-transition-old(root) {
    animation: hm-page-out 0.45s ease forwards;
}
::view-transition-new(root) {
    animation: hm-page-in 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}

/* 2. Scroll reveal (interior σελίδες — το JS προσθέτει .hm-reveal
      ΜΟΝΟ σε στοιχεία κάτω από το fold· χωρίς JS όλα ορατά) */
.hm-reveal {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity 0.55s ease, transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
    transition-delay: calc(var(--hm-stagger, 0) * 70ms);
}
.hm-reveal.hm-in {
    opacity: 1;
    transform: none;
}

/* 3α. Logo: παιχνιδιάρικο τίναγμα στο hover */
.nav-logo img {
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.nav-logo:hover img {
    transform: rotate(-6deg) scale(1.08);
}

/* 3β. Nav CTA «Ζήτα Ραντεβού»: ελαστικό spring + glow */
.nav-cta {
    transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1),
                background 0.25s ease, color 0.25s ease, box-shadow 0.25s ease !important;
}
.nav-cta:hover {
    transform: translateY(-2px) scale(1.08);
    box-shadow: 0 6px 24px rgba(232, 96, 28, 0.35);
}

/* 3γ. Βελάκια: κείμενο «→» (τυλιγμένο από το JS σε .hm-arrow)
      και SVG βελάκια κουμπιών γλιστράνε δεξιά στο hover */
.hm-arrow {
    display: inline-block;
    transition: transform 0.25s ease;
}
a:hover .hm-arrow,
button:hover .hm-arrow {
    transform: translateX(4px);
}
.tips-see-all svg,
.btn-primary svg {
    transition: transform 0.25s ease;
}
.tips-see-all:hover svg,
.btn-primary:hover svg {
    transform: translateX(4px);
}

/* 3δ. «Σχετικοί οδηγοί» (tips) & «Σχετικές υπηρεσίες»: το βελάκι
      ::before πάλλεται δεξιά-αριστερά όσο κρατάς το hover */
.related-tips a::before,
.related-link::before {
    display: inline-block;
    /* 0.65em: ώστε στο peak του παλμού (+5px) να μένει κενό από τα
       γράμματα — ένα τσικ αριστερά κατ' εντολή Θανάση 31/7 */
    margin-right: 0.65em;
}
@keyframes hm-nudge {
    0%, 100% { transform: translateX(0); }
    50%      { transform: translateX(5px); }
}
.related-tips a:hover::before,
.related-link:hover::before {
    animation: hm-nudge 0.7s ease-in-out infinite;
}

/* 4. prefers-reduced-motion: όλα ανενεργά */
@media (prefers-reduced-motion: reduce) {
    ::view-transition-old(root),
    ::view-transition-new(root) { animation: none; }
    .hm-reveal { opacity: 1; transform: none; transition: none; }
    .nav-logo img, .nav-cta, .hm-arrow,
    .tips-see-all svg, .btn-primary svg { transition: none; }
    .nav-logo:hover img, .nav-cta:hover { transform: none; box-shadow: none; }
    .related-tips a:hover::before, .related-link:hover::before { animation: none; }
}