/* Σπουργίτης — nav.css
 * Υπομενού (mega menu) κύριας μπάρας, ακορντεόν κινητού, λωρίδα υπηρεσίας,
 * 5η στήλη υποσέλιδου. Φορτώνει ΤΕΛΕΥΤΑΙΟ, και στην αρχική (main.css) και στις
 * εσωτερικές (shell.css) — τα δύο σύνολα έχουν ΙΔΙΟΥΣ κανόνες κεφαλίδας.
 * Μόνο tokens της v29 (--navy, --ink, --line, --sh-3 …)· κόκκινο ΠΟΤΕ εδώ
 * (Brand Platform §7: μόνο στο κύριο CTA).
 * Μελέτη: _clients/spourgitis.gr/strategy/meleti-menou-ploigisis-2026-10-05.md
 */

/* ── 1. Μπάρα: λίστα αντί για σκέτα <a> ─────────────────────────────── */
/* gap:inherit — η απόσταση ορίζεται στο «.nav» της v29 (24px, 13px ≤1400). */
.nav-list{display:flex;align-items:center;gap:inherit;margin:0;padding:0;list-style:none}
.nav-item{display:flex;align-items:center}
/* Σύνδεσμος + κουμπί (disclosure). Το βελάκι ζει μέσα στον σύνδεσμο (γεωμετρία
 * v29)· το κουμπί είναι διάφανη επιφάνεια 24×40 ΠΑΝΩ του — ο σύνδεσμος πάει στη
 * σελίδα-κόμβο, το βελάκι ανοίγει το πάνελ. Το .nav-pair ΔΕΝ είναι το li: το
 * πάνελ πρέπει να έχει containing block την .hdr (πλάτος οθόνης). */
.nav-pair{position:relative;display:inline-flex;align-items:center}
.nav-tgl{position:absolute;top:50%;right:-5px;width:24px;height:40px;margin:0;padding:0;transform:translateY(-50%);
  background:transparent;border:0;border-radius:6px;cursor:pointer}
.nav-link svg{transition:transform .2s var(--ease)}
.has-mega.is-open .nav-link svg{transform:rotate(180deg)}
.has-mega.is-open .nav-link{color:var(--navy);border-bottom-color:var(--navy)}

/* ── 2. Πάνελ: πλάτος κεφαλίδας (η .hdr είναι fixed → containing block) ── */
.mega{position:absolute;inset:100% 0 auto;z-index:5;background:#fff;border-top:1px solid var(--line);
  box-shadow:var(--sh-3);max-height:calc(100vh - var(--hdr-total));overflow-y:auto;
  visibility:hidden;opacity:0;transform:translateY(-4px);
  transition:opacity .15s var(--ease),transform .15s var(--ease),visibility 0s linear .15s}
.has-mega.is-open > .mega{visibility:visible;opacity:1;transform:none;transition-delay:0s}
/* Hover μόνο σε συσκευή με ποντίκι — σε οθόνη αφής ανοίγει το κουμπί. Μικρή
 * καθυστέρηση στο κλείσιμο, για να μη χάνεται το πάνελ σε λοξή κίνηση. */
@media (hover:hover) and (pointer:fine){
  .has-mega:hover > .mega{visibility:visible;opacity:1;transform:none;transition-delay:.08s}
  /* :not(.is-open) — αλλιώς η καθυστέρηση κλεισίματος καθυστερούσε κατά 270ms
     και το ΑΝΟΙΓΜΑ με πληκτρολόγιο (QA 05/10). */
  .has-mega:not(:hover):not(.is-open) > .mega{transition-delay:.12s,.12s,.27s}
  .has-mega:hover .nav-link{color:var(--navy);border-bottom-color:var(--navy)}
  /* Esc πάνω από το μενού: κλείνει παρά το hover (nav.js → is-dismissed). */
  .has-mega.is-dismissed:not(.is-open):hover > .mega{visibility:hidden;opacity:0;transition:none}
}
.mega-in{padding-block:32px 28px}
.mega-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 40px}
.mega-cols.is-cols-1{grid-template-columns:minmax(0,1fr)}
.mega-cols.is-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.mega-cols.is-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.mega-cols.is-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.mega-col.is-wide{grid-column:span 2}
.mega-col.is-wide ul{columns:2;column-gap:40px}
.mega-col.is-wide li{break-inside:avoid}
/* Όλες οι χώρες στο μενού (05/10/2026): 6 θέσεις — Ευρώπη ×3, εκτός Ευρώπης ×2, δέμα ×1. */
.mega-cols.is-cols-6{grid-template-columns:repeat(6,minmax(0,1fr));column-gap:28px}
.mega-col.is-wide-3{grid-column:span 3}
.mega-col.is-wide-3 ul{columns:3;column-gap:28px}
.mega-cols.is-cols-6 .mega-col.is-wide ul{column-gap:28px}
.nav .mega .is-cols-6 a{padding:5px 0}
/* Τίτλος στήλης: <p>, όχι επικεφαλίδα (επαναλαμβάνεται σε κάθε σελίδα). */
.mega-h{margin:0 0 12px;padding-bottom:10px;border-bottom:1px solid var(--line);
  font-size:var(--fs-eyebrow);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--navy)}
.mega-col ul,.mega-foot ul{margin:0;padding:0;list-style:none}

/* Σύνδεσμοι πάνελ: ο κανόνας «.nav a» της v29 (inline-flex, nowrap, γραμμή
 * από κάτω) είναι για την μπάρα — εδώ ακυρώνεται με μεγαλύτερη ειδικότητα. */
.nav .mega a{display:block;white-space:normal;border-bottom:0;padding:7px 0;color:var(--ink);font-weight:600;line-height:1.35}
.nav .mega a:hover,.nav .mega a[aria-current]{color:var(--navy);border-bottom:0}
.nav .mega a:hover .mega-t{text-decoration:underline;text-underline-offset:3px}
.mega-t{display:block;font-size:1rem}
.mega-d{display:block;margin-top:2px;font-size:.9375rem;font-weight:400;color:var(--ink-soft)}
.nav .mega .mega-all a{display:inline-flex;align-items:center;gap:8px;margin-top:6px;color:var(--navy);font-weight:700}
.nav .mega .mega-all a svg{flex:0 0 auto;opacity:1}

.mega-foot{display:flex;flex-wrap:wrap;align-items:center;gap:6px 24px;margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}
.mega-foot > span{font-weight:700;color:var(--ink-soft)}
.mega-foot ul{display:flex;flex-wrap:wrap;gap:6px 24px}
.nav .mega .mega-foot a{display:inline-block;padding:4px 0;color:var(--navy);font-weight:600}
.nav .mega .mega-foot a:hover{text-decoration:underline;text-underline-offset:3px}

/* Σημαίες χωρών (απόφαση χρήστη 05/10/2026) — sprite assets/img/flags.svg, 4:3.
 * Το περίγραμμα κρατά ορατό το λευκό των σημαιών (Κύπρος, Ιαπωνία) πάνω σε λευκό πάνελ. */
.sp-flag{flex:0 0 auto;width:20px;height:15px;border-radius:2px;box-shadow:0 0 0 1px rgb(0 0 0/.14);overflow:hidden}
.nav .mega a.has-flag{display:flex;align-items:center;gap:10px}
.mnav .mnav-sub a.has-flag{flex-direction:row;justify-content:flex-start;align-items:center;gap:10px}

/* Παραπομπή στον κόμβο για τις χώρες εκτός μενού: κουμπί, όχι απλός σύνδεσμος. */
.nav .mega .mega-foot.is-hub a{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;
  border:1.5px solid var(--navy);border-radius:10px;font-weight:700}
.nav .mega .mega-foot.is-hub a:hover{background:var(--navy);color:#fff;text-decoration:none}
.mnav .msub-foot.is-hub a{display:inline-flex;flex-direction:row;align-items:center;gap:8px;font-weight:700}

/* ── 3. Λωρίδα υπηρεσίας: εργαλείο πριν από τη γλώσσα ─────────────────── */
.topbar-act > a + .lang{margin-left:14px;padding-left:14px;border-left:1px solid rgb(255 255 255/.25)}

/* ── 4. Κινητό: ακορντεόν στο συρτάρι της v29 ─────────────────────────── */
.mnav.is-open{max-height:calc(100vh - var(--hdr-total));overflow-y:auto;overscroll-behavior:contain}
.mnav .mnav-util{color:var(--navy);font-weight:700}
.mnav-grp{border-bottom:1px solid var(--line)}
.mnav-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.mnav .mnav-row a{flex:1 1 auto;border-bottom:0}
.mnav-tgl{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;
  padding:0;background:transparent;border:1px solid var(--line);border-radius:10px;color:var(--navy);cursor:pointer}
.mnav-tgl svg{transition:transform .2s var(--ease)}
.mnav-tgl[aria-expanded="true"] svg{transform:rotate(180deg)}
.mnav-sub{padding:0 0 16px}
.msub-cols{display:grid;gap:16px}
.msub-h{margin:8px 0 4px;font-size:var(--fs-eyebrow);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--navy)}
.msub-col ul,.msub-foot ul{margin:0;padding:0;list-style:none}
.msub-col.is-wide ul{columns:2;column-gap:16px}
.msub-col.is-wide li{break-inside:avoid}
/* Σημεία αφής ≥48px (Brand Platform §7, κοινό 40+). */
.mnav .mnav-sub a{display:flex;flex-direction:column;justify-content:center;min-height:48px;padding:6px 0 6px 12px;
  border-bottom:0;font-weight:600;color:var(--ink)}
.msub-t{display:block}
.msub-d{display:block;font-size:.9375rem;font-weight:400;color:var(--ink-soft)}
.mnav .msub-all a{color:var(--navy);font-weight:700;flex-direction:row;justify-content:flex-start;align-items:center;gap:8px}
.msub-foot{margin-top:12px;padding-top:8px;border-top:1px solid var(--line)}
.msub-foot > span{display:block;margin:8px 0 0;font-weight:700;color:var(--ink-soft)}
.mnav .msub-foot a{color:var(--navy)}

/* ── 4b. Εσωτερικές: ίδια κατώφλια μπάρας με τη v29 ─────────────────────
 * Το shell.css (#16437) κρύβει την μπάρα στα 1080, μετρημένο για λιγότερα
 * στοιχεία. Με τις 6 ετικέτες της v29 (απόφαση 05/10) η μπάρα ξεχείλιζε κατά
 * 68px στα 1100 (QA 05/10). Αντιγραφή αυτούσια του main.css:477-491. */
@media (max-width:1400px){
  body:not(.home) .hdr-in{gap:12px}
  body:not(.home) .nav{gap:13px}
  body:not(.home) .nav-list > li > a{font-size:.9375rem}
  body:not(.home) .tel-btn{padding:10px 13px;gap:7px}
  body:not(.home) .hdr-calc{padding:10px 13px;font-size:.9375rem}
}
@media (max-width:1240px){
  body:not(.home) .nav{display:none}
  body:not(.home) .burger{display:flex}
}

/* ── 5. Υποσέλιδο με 5 στήλες (+ «Δημοφιλείς προορισμοί») ─────────────── */
@media (min-width:1081px){
  .ftr-grid.ftr-grid--5{grid-template-columns:1.4fr repeat(4,1fr);gap:32px}
}

/* ── 6. Μενού v3 (09/10/2026) ──────────────────────────────────────────
 * Μελέτη: _clients/spourgitis.gr/strategy/meleti-menou-v3-taxinomisi-2026-10-09.md
 * Κλάσεις στοιχείων: sp-aside · sp-eyebrow · sp-tel · sp-btn · sp-cards · sp-tiles · sp-join · sp-band (inc/nav.php).
 * Κόκκινο ΠΟΤΕ (Brand Platform §7). */

/* 6a. Ετικέτες μπάρας: --navy-dark αντί --ink-soft του main.css («.nav a»), βελάκι πλήρες
 * (απόφαση Βαγγέλη 09/10: «άτονο»· #132A63 = Navy σκούρο του DESIGN-CONTRACT, αντίθεση ≈13:1). */
.nav-list > li > a,.nav-list .nav-link{color:var(--navy-dark)}
.nav-list .nav-link svg{opacity:1}
.nav-list > li > a:hover,.nav-list > li > a[aria-current]{color:var(--navy)}

/* 6b. Πάνελ με κάρτα ενέργειας δεξιά */
.mega-in.has-aside{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:48px;align-items:stretch}
.mega-main{min-width:0;display:flex;flex-direction:column}
.mega-main > .mega-cols{flex:1 1 auto}
.mega-aside{align-self:start;display:flex;flex-direction:column;gap:12px;padding:26px 26px 22px;border-radius:var(--r-card);
  background:var(--navy-dark);color:#fff;box-shadow:var(--sh-2)}
.mega-aside-eb{margin:0;font-size:var(--fs-eyebrow);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--navy-bright)}
.mega-aside-t{margin:0;font-size:1.25rem;font-weight:700;line-height:1.25}
.mega-aside-x{margin:0;font-size:1rem;color:rgb(255 255 255/.86)}
.nav .mega .mega-aside a{color:#fff}
.nav .mega a.mega-aside-tel{display:grid;gap:2px;padding:12px 14px;border-radius:12px;background:rgb(255 255 255/.08);
  border:1px solid rgb(255 255 255/.16)}
.nav .mega a.mega-aside-tel:hover{background:rgb(255 255 255/.16);color:#fff}
.mega-aside-tl{font-size:.875rem;font-weight:600;color:rgb(255 255 255/.8)}
.mega-aside-tn{display:inline-flex;align-items:center;gap:8px;font-size:1.25rem;font-weight:800;letter-spacing:.01em}
.mega-aside-th{font-size:.8125rem;font-weight:400;color:rgb(255 255 255/.75)}
.nav .mega a.mega-aside-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;margin-top:4px;
  padding:10px 18px;border-radius:var(--r-btn);background:#fff;color:var(--navy-dark);font-weight:700;white-space:nowrap}
.nav .mega a.mega-aside-btn:hover{background:var(--surface);color:var(--navy-dark)}
.nav .mega a.mega-aside-lnk{display:inline-flex;align-items:center;gap:8px;padding:6px 0;font-weight:700}
.nav .mega a.mega-aside-lnk:hover{text-decoration:underline;text-underline-offset:3px;color:#fff}
.mega-aside svg{flex:0 0 auto}

/* 6c. Δύο ομάδες στο ίδιο κελί («sp-join») */
.mega-col.is-stack > ul + .mega-h,.msub-col.is-stack > ul + .msub-h{margin-top:22px}

/* 6d. Κάρτες 2×2 («sp-cards», τεντώνουν στο ύψος της κάρτας ενέργειας) και πλακίδια («sp-tiles»):
 * όλη η κάρτα σύνδεσμος (κανόνας ομάδας 13.4) + βέλος (13.5) */
.mega-col.is-cards{display:flex;flex-direction:column}
.mega-col.is-cards ul{flex:1 1 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:14px}
.mega-col.is-tiles ul{display:grid;gap:10px}
.nav .mega .is-cards a,.nav .mega .is-tiles li:not(.mega-all) a{position:relative;height:100%;padding:16px 52px 16px 20px;
  border:1px solid var(--line);border-radius:12px;background:#fff;transition:border-color .15s var(--ease),background .15s var(--ease)}
.nav .mega .is-cards a{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;padding-block:20px}
.nav .mega .is-cards a:hover,.nav .mega .is-tiles a:hover{border-color:var(--navy);background:var(--surface)}
.nav .mega .is-cards .mega-t{font-size:1.0625rem}
.mega-arr{position:absolute;right:18px;top:50%;display:flex;transform:translateY(-50%);color:var(--navy);transition:transform .15s var(--ease)}
.nav .mega a:hover .mega-arr{transform:translate(3px,-50%)}
.msub-arr{display:none}

/* 6e. Ζώνη βάσης με τηλέφωνα («sp-foot sp-band») */
.mega-foot.is-band{padding:14px 18px;border-top:0;border-radius:12px;background:var(--surface)}
.mega-foot.is-help{gap:12px 20px}
.mega-foot.is-help > span{color:var(--ink)}
.nav .mega a.mega-pill{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border:1.5px solid var(--navy);
  border-radius:10px;color:var(--navy);font-weight:800;font-size:1.0625rem}
.nav .mega a.mega-pill:hover{background:var(--navy);color:#fff;text-decoration:none}
.mega-pill-l{font-weight:600;font-size:.9375rem;color:var(--ink-soft);margin-right:2px}
.nav .mega a.mega-pill:hover .mega-pill-l{color:#fff}
.nav .mega a.mega-band-lnk{display:inline-flex;align-items:center;gap:8px;margin-left:auto;padding:4px 0;color:var(--navy);font-weight:700}

/* 6f. Κινητό: η κάρτα γίνεται συμπαγές μπλοκ κάτω από τις στήλες */
.msub-aside{display:flex;flex-direction:column;gap:8px;margin-top:14px;padding:16px;border-radius:12px;background:var(--navy-dark);color:#fff}
.msub-aside-eb{margin:0;font-size:var(--fs-eyebrow);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--navy-bright)}
.msub-aside-t{margin:0;font-weight:700;font-size:1.0625rem}
.msub-aside-x{margin:0;color:rgb(255 255 255/.86)}
.mnav .mnav-sub .msub-aside a{padding-left:0;color:#fff}
.mnav .mnav-sub .msub-aside a.msub-aside-lnk{flex-direction:row;justify-content:flex-start;align-items:center;gap:8px}
.mnav .mnav-sub .msub-aside a.msub-aside-btn{flex-direction:row;justify-content:center;align-items:center;gap:10px;
  margin-top:4px;padding:10px 16px;border-radius:var(--r-btn);background:#fff;color:var(--navy-dark);font-weight:700}
.msub-aside-tl,.msub-aside-th{font-size:.875rem;color:rgb(255 255 255/.8);font-weight:400}
.msub-aside-tn{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:1.125rem}
.mnav .msub-foot.is-help a{color:var(--navy);flex-direction:row;justify-content:flex-start;align-items:center;gap:8px}
.msub-pill-l{color:var(--ink-soft);font-weight:600}

@media (prefers-reduced-motion:reduce){
  .mega,.nav-link svg,.mnav-tgl svg{transition:none}
}