/* ═══════════════════════════════════════════════════════════════
   arxiki-kinisi.css — ενιαίο σύστημα κίνησης της αρχικής (14/10/2026)
   Ο μειωτήρας (gearbox-v2) μένει ως έχει. Όλα τα άλλα:
   · μία εμφάνιση ανά στοιχείο, ίδια καμπύλη, ίδια απόσταση, κλιμακωτά 70 ms
   · καμία ατέρμονη διακοσμητική κίνηση· ό,τι συνεχές μένει σταματά εκτός οθόνης
   · χωρίς JS ή με μειωμένη κίνηση: όλα ορατά στην τελική θέση
═══════════════════════════════════════════════════════════════ */
:root { --hk-ease: cubic-bezier(.2,.7,.2,1); --hk-dur: .6s; --hk-dy: 16px; }

/* 1. Κοινή εμφάνιση (αντικαθιστά reveal-up, data-reveal, rv-on, «φερμουάρ») */
html.hk-js .hk-r { opacity: 0; transform: translateY(var(--hk-dy)); transition: opacity var(--hk-dur) var(--hk-ease), transform var(--hk-dur) var(--hk-ease); transition-delay: calc(var(--hk-i, 0) * 70ms); }
html.hk-js .hk-r.hk-in { opacity: 1; transform: none; }
.reveal-up { opacity: 1; transform: none; }           /* το παλιό σύστημα δεν κρύβει πια τίποτα */

/* 2. Hero: το σχέδιο του μειωτήρα χαράσσεται μία φορά (Ø138 = πραγματική διάμετρος του μοντέλου) */
.hero-bp-ticks { animation: none; }
.hero-name span { animation: none; }
html.hk-js .hero-bp .hk-draw { stroke-dasharray: 1; stroke-dashoffset: 1; }
html.hk-js .hero-bp .hk-fade { opacity: 0 !important; }
html.hk-js .hero-bp.hk-go .hk-draw { stroke-dashoffset: 0; transition: stroke-dashoffset 1.2s var(--hk-ease); transition-delay: calc(var(--hk-i, 0) * 110ms + .25s); }
html.hk-js .hero-bp.hk-go .hk-fade { opacity: var(--hk-o, .6) !important; transition: opacity .5s ease; transition-delay: calc(var(--hk-i, 0) * 90ms + 1.1s); }
html.hk-js .hero-bp-ticks { transform-origin: 300px 300px; transform: rotate(-24deg); }
html.hk-js .hero-bp.hk-go .hero-bp-ticks { transform: none; transition: transform 1.8s cubic-bezier(.16,1,.3,1) .4s; }

/* 3. Διαστάσεις: ο δρομέας μετρά μία φορά μαζί με τους αριθμούς και σταματά */
.dims-cursor { animation: none; left: 0; transform: translateX(var(--hk-w, 0px)); }
html.hk-js .dims-cursor { transform: translateX(0); }
html.hk-js .dims.is-in .dims-cursor { transform: translateX(var(--hk-w, 0px)); transition: transform 1.4s cubic-bezier(.33,1,.68,1); }

/* 4. Υπηρεσίες: χωρίς αιώρηση και γυάλισμα σε βρόχο· μένει μόνο το hover */
.svc-img img { animation: none !important; }
.svc-img::after { content: none; }

/* 5. Φόρμα: ο τίτλος δεν πάλλεται */
.contact-form-title, .contact-form-title svg { animation: none; }

/* 6. Συνεχείς κινήσεις που μένουν (ticker, υπογραφή): σταματούν εκτός οθόνης */
.hk-off, .hk-off *, .hk-off *::before, .hk-off *::after { animation-play-state: paused !important; }

/* 7. Δείκτης ανάγνωσης: μόνο η λεπτή γραμμή στην κορυφή, με transform */
#progress { width: 100% !important; transform-origin: 0 50%; transform: scaleX(0); }

@media (prefers-reduced-motion: reduce) {
  html.hk-js .hk-r { opacity: 1; transform: none; transition: none; }
  html.hk-js .hero-bp .hk-draw { stroke-dashoffset: 0; }
  html.hk-js .hero-bp .hk-fade { opacity: var(--hk-o, .6) !important; }
  html.hk-js .hero-bp-ticks, html.hk-js .dims-cursor { transform: none; }
  .dims-cursor { transform: translateX(var(--hk-w, 0px)) !important; }
  .ticker-inner { animation: none !important; }
}

/* 8. «Πώς δουλεύουμε»: η σκιά/λάμψη αλλάζει χωρίς μετάβαση (μετάβαση box-shadow = νέα σχεδίαση σε κάθε καρέ)·
      κινούνται μόνο transform και opacity */
.wf-img { transition: transform .5s var(--rd-ease, ease), opacity .45s, border-color .45s !important; }
.wf-dot { transition: background-color .45s, border-color .45s, transform .45s !important; }

/* 9. Πλοήγηση: μικρότερο θόλωμα φόντου (24 → 12 px) με λίγο πιο αδιαφανές χρώμα· ίδια όψη, λιγότερη σχεδίαση σε κάθε καρέ */
nav { background: rgba(12,22,50,.9); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
