/* ProGPS — στατικό site. Αναθεώρηση UX/UI 29/07/2026.
   Διορθώθηκαν: 4 διαφορετικά αριστερά περιθώρια, γραμμές 102 χαρακτήρων,
   μενού που έσπαγε σε 3 σειρές στο κινητό, κουκκίδες εκτός κέντρου. */
:root{
  --blue:#0b5bb4; --blue-d:#094a94; --cyan:#1a9eca; --ink:#3f3a37; --muted:#6b6560;
  --bg:#f4f4ef; --panel:#fff; --line:#e5e5dd;
  --wrap:960px; --gut:32px; --r:6px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);
  font:16px/1.7 "Helvetica Neue",Helvetica,Arial,"Liberation Sans",sans-serif}
img{max-width:100%;height:auto;display:block}
a{color:var(--blue)}
a:hover,a:focus-visible{color:var(--blue-d)}
:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 16px}

/* ── Header: το banner ευθυγραμμίζεται ΑΚΡΙΒΩΣ με το κείμενο της κάρτας ── */
header.site{background:var(--panel)}
header.site .wrap{padding:18px 16px 16px}
.banner-box{padding:0 var(--gut)}
.banner{width:100%;max-width:896px}

/* ── Nav: το CTA σπρώχνεται δεξιά και ξεχωρίζει ── */
nav.main{background:var(--blue);box-shadow:inset 0 -3px 0 rgba(0,0,0,.12)}
nav.main ul{list-style:none;margin:0 auto;padding:0 16px;display:flex;flex-wrap:wrap;
  align-items:stretch;max-width:var(--wrap)}
nav.main li{display:flex}
nav.main a{display:flex;align-items:center;padding:14px 16px;color:#fff;
  text-decoration:none;font-size:15px;font-weight:600;line-height:1.2}
nav.main a:hover,nav.main a:focus-visible{background:var(--blue-d);color:#fff}
nav.main a[aria-current="page"]{background:var(--cyan)}
nav.main li.cta{margin-left:auto}
nav.main li.cta a{background:rgba(255,255,255,.14);font-weight:700}
nav.main li.cta a:hover{background:var(--cyan)}
nav.main li.cta a::after{content:"↗";margin-left:7px;font-size:12px}

/* ── Content ── */
main{padding:28px 0 44px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);
  padding:8px var(--gut) 36px;box-shadow:0 1px 3px rgba(0,0,0,.05)}
/* μέτρο ανάγνωσης: ~68 χαρακτήρες, όχι 102 */
.card > p,.card > ul,.card > h2,.card > h1{max-width:68ch}
h1{font-size:30px;line-height:1.2;margin:26px 0 18px;color:var(--blue);
  font-weight:700;letter-spacing:-.01em}
h2{font-size:20px;line-height:1.3;margin:34px 0 12px;color:var(--blue);font-weight:700}
h2::after{content:"";display:block;width:44px;height:3px;background:var(--cyan);
  margin-top:9px;border-radius:2px}
p{margin:0 0 16px}
.lead{font-size:17.5px;color:var(--muted)}
ul.checks{list-style:none;margin:0 0 20px;padding:0}
ul.checks li{position:relative;padding:4px 0 4px 24px;line-height:1.6}
ul.checks li::before{content:"";position:absolute;left:5px;top:.85em;
  width:7px;height:7px;border-radius:50%;background:var(--cyan)}
/* το hero γεμίζει την κάρτα άκρη-άκρη */
.hero{margin:0 calc(var(--gut) * -1) 26px;border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);overflow:hidden}
.hero img{width:100%}
.cta{display:inline-block;background:var(--blue);color:#fff;padding:13px 26px;
  border-radius:var(--r);font-weight:700;text-decoration:none;margin-top:8px}
.cta:hover,.cta:focus-visible{background:var(--blue-d);color:#fff}
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:8px 34px;max-width:100%}
.contact-grid h2{margin-top:22px}
address{font-style:normal;line-height:1.8}

footer.site{background:var(--ink);color:#dedad7;margin-top:0;padding:20px 0;font-size:14px}
footer.site .wrap{padding:0 calc(16px + var(--gut))}
footer.site a{color:#8fd0e8}

@media (max-width:760px){
  :root{--gut:20px}
  header.site .wrap{padding:14px 16px 12px}
  /* Το μενού έσπαγε σε 3 σειρές (158px). Τώρα: μονή κυλιόμενη σειρά ~48px. */
  nav.main ul{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;padding:0 6px}
  nav.main ul::-webkit-scrollbar{display:none}
  nav.main li{flex:0 0 auto}
  nav.main li.cta{margin-left:6px}
  nav.main a{padding:13px 13px;font-size:14px;white-space:nowrap}
  nav.main li.cta a{background:rgba(255,255,255,.18)}
  /* ένδειξη ότι το μενού κυλάει */
  nav.main{position:relative}
  nav.main::after{content:"";position:absolute;right:0;top:0;bottom:0;width:26px;
    background:linear-gradient(90deg,rgba(11,91,180,0),var(--blue));pointer-events:none}
  main{padding:18px 0 30px}
  .card{padding:6px var(--gut) 28px}
  h1{font-size:24px;margin:20px 0 14px}
  h2{font-size:18px;margin:28px 0 10px}
  .lead{font-size:16.5px}
  .contact-grid{gap:0 24px}
  footer.site .wrap{padding:0 16px}
}

/* Skip link — ορατό μόνο με πληκτρολόγιο */
.skip{position:absolute;left:-9999px;top:0;background:var(--blue);color:#fff;
  padding:10px 16px;z-index:100;border-radius:0 0 var(--r) 0}
.skip:focus{left:0}

/* Nav: σταθερό ύψος μπάρας — απέτρεψε το stretch που την έκανε 77px στο κινητό,
   και το wrap σε 2 σειρές στα ~768px (tablet). */
nav.main ul{align-items:center;min-height:0}
nav.main li{align-items:center}
nav.main li.cta{margin-top:0;margin-bottom:0}
nav.main a{min-height:46px;box-sizing:border-box}
@media (max-width:980px){
  /* κυλιόμενη μονή σειρά ήδη από tablet, ώστε να μη σπάει στα 768 */
  nav.main ul{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;padding:0 8px}
  nav.main ul::-webkit-scrollbar{display:none}
  nav.main li{flex:0 0 auto}
  nav.main li.cta{margin-left:8px}
  nav.main a{white-space:nowrap;min-height:44px;padding:11px 13px;font-size:14px}
  nav.main{position:relative}
  nav.main::after{content:"";position:absolute;right:0;top:0;bottom:0;width:24px;
    background:linear-gradient(90deg,rgba(11,91,180,0),var(--blue));pointer-events:none}
}

/* Τελική ευθυγράμμιση nav: ίδιο ακριβώς κουτί για ΚΑΘΕ σύνδεσμο,
   ώστε το CTA να μη κάθεται 8px χαμηλότερα από τα υπόλοιπα. */
nav.main ul{align-items:stretch}
nav.main li,nav.main li.cta{display:flex;align-items:stretch;margin-top:0;margin-bottom:0}
nav.main a,nav.main li.cta a{display:flex;align-items:center;min-height:48px;
  padding-top:0;padding-bottom:0;line-height:1.2}

/* Ερωτήσεις FAQ */
.card h3{font-size:16.5px;line-height:1.4;margin:22px 0 6px;color:var(--ink);font-weight:700;max-width:68ch}
.card h3 + p{margin-bottom:14px}
