/**
 * AdamsGames — site-wide layout corrections.
 *
 * Lives in its own file on purpose: appending to adamsgames-design.css stopped
 * reaching the browser, because Autoptimize kept serving a bundle built from an
 * older copy of that file. A separate enqueued stylesheet changes the input
 * list, so the bundle is rebuilt every time. (2026-09-21)
 */

/* ── Footer ──
   The grid dropped to two columns at 991px but the text only turned centred at
   767px, so between 521px and 767px the footer showed two centred columns of
   very different heights — a short logo block beside a long list of links. It
   read as broken alignment. Wherever the text is centred, the footer is now a
   single stacked column. */
@media (max-width: 767px) {
	.ag-foot__grid {
		grid-template-columns: 1fr;
		gap: 30px;
	}
}

/* Between 768px and 991px the two columns stay, but they align to the top and
   read left, which is how a list of links is meant to be scanned. */
@media (min-width: 768px) and (max-width: 991px) {
	.ag-foot__grid {
		align-items: start;
		column-gap: 44px;
		row-gap: 38px;
	}
}

/* ── Category copy under the product grid ──
   The descriptions grew from ~150 to 530–910 characters; all of it in the hero
   pushed the products off the first screen. The opening paragraph stays up top,
   the rest reads here. */
.ag-catcopy {
	border-top: 1px solid #eef2f5;
	margin-top: 46px;
	padding: 38px 0 6px;
}
.ag-catcopy__h {
	font-family: "Outfit", "Poppins", sans-serif;
	font-size: 1.3rem;
	font-weight: 800;
	color: var(--ag-ink, #13232e);
	margin: 0 0 14px;
}
.ag-catcopy__body {
	max-width: 760px;
	font-size: 16.5px;
	line-height: 1.72;
	color: #4a6470;
}
.ag-catcopy__body p { margin: 0 0 14px; }
.ag-catcopy__body p:last-child { margin-bottom: 0; }
.ag-catcopy__body strong { color: var(--ag-ink, #13232e); }

/* The hero paragraph is a single lead line now — give it room to breathe. */
.ag-shophero__sub { max-width: 640px; }

/* ── Οριζόντια υπερχείλιση 10px ────────────────────────────────────────────
   Το section 90e53cc του header τραβάει margin -20px, ενώ ο γονέας
   .container-fluid έχει padding 10px. Ξέφευγε 10px δεξιά κι αριστερά, η σελίδα
   αποκτούσε οριζόντια κύλιση, και το footer — που πιάνει 100% της ΟΘΟΝΗΣ, όχι
   του συνολικού πλάτους — έμενε πιο κοντό από το περιεχόμενο.
   Με -10px ακυρώνεται ακριβώς το padding του γονέα: το περιεχόμενο φτάνει
   στην άκρη όπως πριν, χωρίς να ξεφεύγει. */
#header .elementor-element-90e53cc{
	margin-left: -10px !important;
	margin-right: -10px !important;
}

/* Δίχτυ ασφαλείας: κανένα μελλοντικό στοιχείο να μη σπάει ξανά το πλάτος.
   clip (όχι hidden) ώστε να συνεχίσει να δουλεύει το sticky στη στήλη του άρθρου. */
html{ overflow-x: clip; }

/* Το footer πιάνει όλο το πλάτος ό,τι κι αν συμβεί. */
.footer, .footer-builder, #footer{
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

/* Το αιωρούμενο κουμπί των cookies είναι καρφωμένο κάτω αριστερά (45px στο x=15)
   και σκέπαζε τον αριθμό ΕΕΕΠ στην κάτω μπάρα του footer. Σε πλατιές οθόνες το
   .ag-wrap είναι κεντραρισμένο και δεν συναντιούνται· πιο κάτω από 1280px όμως
   πέφτουν το ένα πάνω στο άλλο. Λίγος αέρας από κάτω τα ξεχωρίζει, χωρίς να
   μετακινηθεί οριζόντια το κείμενο. */
@media (max-width: 1280px){
	.ag-foot__bar{ padding-bottom: 46px; }
}
@media (max-width: 600px){
	.ag-foot__bar{ padding-bottom: 54px; }
}

/* ── Το footer δεν έπιανε όλο το πλάτος ────────────────────────────────────
   Το section agftr01 του footer τραβάει margin -20px, ενώ ο γονέας
   .container-fluid έχει padding 10px. Αποτέλεσμα σε οθόνη 375px:
   το footer ξεκινούσε στο -10 και τελείωνε στο 345 — δηλαδή 10px κομμένο
   αριστερά και 30px κενό δεξιά. Αυτό ήταν το «δεξί κομμάτι που δεν είναι
   κεντραρισμένο», και φαινόταν κυρίως στα κινητά.
   Με -10px ακυρώνεται ακριβώς το padding του γονέα· με width:auto το section
   γεμίζει το υπόλοιπο, οπότε πιάνει 0 → 375. */
.footer-builder .elementor-element-agftr01,
#footer .elementor-element-agftr01{
	margin-left: -10px !important;
	margin-right: -10px !important;
	max-width: none !important;
	width: auto !important;
}

/* Ο αριθμός αδείας έσπαγε στη μέση («HGCEGOP-00012-» / «00») επειδή το κείμενο
   ξεπερνούσε τον διαθέσιμο χώρο κατά ελάχιστα pixel. Λίγο λιγότερο padding στη
   στενή οθόνη του δίνει τον χώρο που χρειάζεται. Χωρίς nowrap: αν σε κάποια
   συσκευή η γραμματοσειρά βγει πλατύτερη, θα αλλάξει γραμμή σε κενό αντί να
   κοπεί ο αριθμός. */
@media (max-width: 430px){
	.ag-foot__bar .ag-wrap{ padding-left: 10px; padding-right: 10px; }
	.ag-foot__eeep{ letter-spacing: 0; }
}
/* ===========================================================================
   AdamsGames · FOOTER — ΚΙΝΗΤΟ & TABLET  (ΤΕΛΙΚΗ ΕΚΔΟΣΗ)
   ---------------------------------------------------------------------------
   ΓΙΑΤΙ ΥΠΑΡΧΕΙ ΑΥΤΟ ΤΟ ΑΡΧΕΙΟ:
   Ζητήθηκε το footer να πιάνει ΟΛΟ το πλάτος (χωρίς κενά δεξιά-αριστερά) και
   αυτό υλοποιήθηκε κατά λάθος ως ΚΕΝΤΡΑΡΙΣΜΑ. Πλάτος και στοίχιση όμως είναι
   δύο ανεξάρτητα πράγματα: το σκούρο φόντο μένει edge-to-edge, αλλά το κείμενο
   πρέπει να πατάει σε ΜΙΑ σταθερή αριστερή ακμή. Σε κεντραρισμένη λίστα 14
   συνδέσμων κάθε γραμμή ξεκινά αλλού, οπότε το μάτι ψάχνει την αρχή σε κάθε
   item — γι' αυτό «έγιναν χάλια τα μενού».
   Δεύτερο ζητούμενο («2-3 στήλες»): οι λίστες σπάνε εσωτερικά σε 2 στήλες με
   CSS multi-column, ώστε και οι 22 σύνδεσμοι να μείνουν ΟΡΑΤΟΙ (SEO/εσωτερική
   διασύνδεση) αλλά σε μισό ύψος.

   ΚΑΝΟΝΕΣ ΠΟΥ ΤΗΡΟΥΝΤΑΙ:
   • Ο ΥΠΟΛΟΓΙΣΤΗΣ (≥992px) ΔΕΝ ΑΓΓΙΖΕΤΑΙ — κάθε κανόνας ζει μέσα σε
     media query max-width. Καμία δήλωση δεν διαρρέει πάνω από τα 991px
     (επαληθεύτηκε σε 992/1200/1440px: 0 διαφορές από το σημερινό).
   • ΜΟΝΟ CSS. Κανένα markup, κανένα JS (το wp_kses του Elementor σβήνει ό,τι
     προστεθεί στο html widget).
   • Κανένα display:none σε σύνδεσμο: και οι 22 μένουν ορατοί.
   • Το padding μπαίνει στο .ag-wrap, ΠΟΤΕ στο .ag-foot, ώστε το φόντο να
     φτάνει στις άκρες της οθόνης.

   ΠΡΟΟΡΙΣΜΟΣ: στο ΙΔΙΟ αρχείο με το adamsgames-design.css (στο τέλος του) ή σε
   αρχείο που φορτώνει σίγουρα ΜΕΤΑ από αυτό.

   ΓΙΑΤΙ ΥΠΑΡΧΟΥΝ ΤΑ ΛΙΓΑ !important: τα παλιά κεντραρίσματα μπορεί να είναι
   γραμμένα με βαρύτερους επιλογείς (π.χ. footer.ag-foot .ag-foot__col
   .ag-foot__ct li{justify-content:center}). Σε δοκιμή με τέτοιους επιλογείς,
   η απλή αύξηση ειδικότητας ΕΧΑΣΕ και οι γραμμές επικοινωνίας έμειναν
   κεντραρισμένες. Το !important μπαίνει ΜΟΝΟ στις 4 ιδιότητες στοίχισης
   (text-align, justify-content, justify-items, margin-left) — πουθενά αλλού,
   ώστε να παραμένει εύκολη κάθε μελλοντική διόρθωση.
   =========================================================================== */


/* ===========================================================================
   1) ΒΑΣΗ ΓΙΑ ΟΛΕΣ ΤΙΣ ΜΙΚΡΕΣ ΟΘΟΝΕΣ (≤991px)
   =========================================================================== */
@media (max-width: 991px){

  /* Full-bleed: το φόντο πιάνει όλη την οθόνη. Κανένα πλάγιο περιθώριο εδώ. */
  .ag-foot{
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
  }

  /* ΤΟ ΜΟΝΟ σημείο που ορίζει πλευρικό αέρα. Αν μπει και αλλού, διπλασιάζεται
     η εσοχή και επιστρέφει το «κενό δεξιά-αριστερά». */
  .ag-foot .ag-wrap{
    width: 100%;
    max-width: none;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
  }

  /* --- Η ΚΥΡΙΑ ΔΙΟΡΘΩΣΗ: τέλος το κεντράρισμα -----------------------------
     Ρητή λίστα κλάσεων αντί για .ag-foot * — το καθολικό αστεράκι έχει χαμηλή
     ειδικότητα (χάνει από τους υπάρχοντες κανόνες) και ταυτόχρονα ισοπεδώνει
     ΚΑΘΕ μελλοντικό στοιχείο που μπει στο footer μέσα από το Elementor. */
  .ag-foot .ag-foot__grid,
  .ag-foot .ag-foot__col,
  .ag-foot .ag-foot__col > *,
  .ag-foot .ag-foot__col h3,
  .ag-foot .ag-foot__desc,
  .ag-foot .ag-foot__links,
  .ag-foot .ag-foot__links li,
  .ag-foot .ag-foot__ct,
  .ag-foot .ag-foot__ct li,
  .ag-foot .ag-foot__bar,
  .ag-foot .ag-foot__barin,
  .ag-foot .ag-foot__barin > *{
    text-align: left !important;
  }

  /* Το κεντράρισμα δεν γίνεται μόνο με text-align: τα auto περιθώρια κρατούν
     τα μπλοκ στη μέση ακόμη κι όταν το κείμενο έχει γυρίσει αριστερά. */
  .ag-foot .ag-foot__logo,
  .ag-foot .ag-foot__logo img,
  .ag-foot .ag-foot__desc,
  .ag-foot .ag-foot__soc,
  .ag-foot .ag-foot__links,
  .ag-foot .ag-foot__ct,
  .ag-foot .ag-foot__map{
    margin-left: 0 !important;
    margin-right: auto;
  }

  /* Τρίτος τρόπος κεντραρίσματος: flex/grid. Ακυρώνεται κι αυτός. */
  .ag-foot .ag-foot__grid{
    justify-items: start !important;
    align-items: start;
  }
  .ag-foot .ag-foot__soc,
  .ag-foot .ag-foot__ct li,
  .ag-foot .ag-foot__barin{
    justify-content: flex-start !important;
  }
  .ag-foot .ag-foot__barin{ align-items: flex-start; }

  /* Δίχτυ ασφαλείας για οριζόντια κύλιση: μια μακριά ελληνική λέξη ή η εικόνα
     του χάρτη (600px) σπρώχνουν το min-content πλάτος και η σελίδα «φεύγει»
     πλάγια. Το clip (αντί για hidden) δεν δημιουργεί scroll container, άρα δεν
     χαλάει το sticky/anchor scrolling. Σε Safari <16 αγνοείται — γι' αυτό η
     πραγματική άμυνα είναι τα min-width:0 και overflow-wrap παρακάτω. */
  .ag-foot{ overflow-x: clip; }
  .ag-foot .ag-foot__col{ min-width: 0; }
  .ag-foot .ag-foot__links a,
  .ag-foot .ag-foot__ct a,
  .ag-foot .ag-foot__desc{
    overflow-wrap: break-word;   /* σπάει ΜΟΝΟ λέξη που δεν χωράει */
    word-break: normal;          /* ποτέ στη μέση κανονικών λέξεων */
    hyphens: none;
    text-wrap: pretty;           /* όχι ορφανή λέξη μόνη της στη 2η γραμμή */
  }

  /* --- Τίτλοι ενοτήτων ---------------------------------------------------
     Οι χρήστες σαρώνουν ΤΙΤΛΟΥΣ, δεν διαβάζουν συνδέσμους (Baymard). Σε μία
     στοίβα, ο τίτλος είναι το μόνο που ξεχωρίζει τη μια ομάδα από την άλλη. */
  .ag-foot .ag-foot__col > h3{
    font-size: 13px;
    line-height: 1.25;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: #00b8b8;
    margin: 0 0 12px;
  }

  /* --- ΛΙΣΤΕΣ ΣΥΝΔΕΣΜΩΝ: 2 ΣΤΗΛΕΣ ---------------------------------------
     22 σύνδεσμοι σε μία κολόνα = ~700px μόνο για μενού. Με multi-column το
     ύψος μισεύει ΧΩΡΙΣ να κρυφτεί κανένας σύνδεσμος.
     Δίνεται column-width ΜΑΖΙ με column-count (`columns:150px 2`) ώστε ο
     αριθμός στηλών να προκύπτει από το διαθέσιμο πλάτος και να μη στριμώχνονται
     ποτέ οι μακριές ελληνικές ετικέτες.
     Multi-column (όχι grid) επειδή η σειρά ανάγνωσης μένει ΚΑΘΕΤΗ:
     1-7 αριστερά, 8-14 δεξιά — σαν δύο μικρά μενού, όχι σαν πίνακας. */
  .ag-foot .ag-foot__links{
    list-style: none;
    margin: 0;
    padding: 0;
    columns: 150px 2;
    column-gap: 20px;
    /* Όταν ένα item πιάνει 2 γραμμές οι στήλες ξεσυγχρονίζονται και μοιάζουν
       με «σπασμένες σειρές». Η λεπτή γραμμή δηλώνει ότι είναι δύο ξεχωριστές
       στήλες — η ασυμμετρία γίνεται σκόπιμη — και δίνει στο μάτι δεύτερη
       αριστερή ακμή να πιαστεί. */
    column-rule: 1px solid rgba(0, 184, 184, .13);
  }

  /* Χωρίς αυτό, ένα δίγραμμο item («Ενοικίαση Φουσκωτών & Photo Booth»)
     κόβεται στη μέση και η δεύτερη γραμμή του πετάγεται στην άλλη στήλη. */
  .ag-foot .ag-foot__links li{
    break-inside: avoid;
    page-break-inside: avoid;
    -webkit-column-break-inside: avoid;
    display: block;
    margin: 0 0 2px;   /* 2px νεκρή ζώνη: ένα αστοχημένο πάτημα δεν ανοίγει
                          τον ΔΙΠΛΑΝΟ σύνδεσμο (λάθος σελίδα) */
    padding: 0;
  }

  /* Στόχος αφής: το ύψος το δίνει το ίδιο το <a> (padding, όχι κενό γύρω του),
     ώστε να μη «χάνεται» το tap ανάμεσα σε δύο συνδέσμους. */
  .ag-foot .ag-foot__links li a{
    display: flex;
    align-items: center;
    box-sizing: border-box;
    min-height: 40px;
    padding: 4px 8px 4px 0;
    font-size: 14px;
    line-height: 1.4;
    text-decoration: none;
  }

  /* --- ΕΠΙΚΟΙΝΩΝΙΑ -------------------------------------------------------
     Τηλέφωνα/διεύθυνση ΔΕΝ μπαίνουν σε στήλες: είναι δεδομένα που διαβάζονται
     σειριακά και πατιούνται (tel:/mailto:), όχι μενού. */
  .ag-foot .ag-foot__ct{ list-style: none; margin: 0; padding: 0; }
  .ag-foot .ag-foot__ct li{
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 0;
    margin: 0 0 2px;
    font-size: 14px;
  }

  /* Το εικονίδιο παίρνει ύψος 40px όσο και η γραμμή επαφής και το σχέδιο
     κεντράρεται μέσα του από το viewBox (preserveAspectRatio). Έτσι μένει
     ευθυγραμμισμένο με την 1η γραμμή κειμένου ΧΩΡΙΣ μαγικό margin-top που
     σπάει μόλις αλλάξει μέγεθος γραμματοσειράς ή ο χρήστης μεγαλώσει το
     κείμενο. (Αν κάποιο εικονίδιο δεν έχει viewBox και τεντώνεται, βάλε
     height:18px; margin-top:11px; μόνο σε αυτό.) */
  .ag-foot .ag-foot__ct li svg{
    flex: 0 0 18px;
    width: 18px;
    height: 40px;
    color: #00b8b8;
  }

  /* ΣΤΟΧΟΣ ΑΦΗΣ ΣΤΑ ΤΗΛΕΦΩΝΑ: σε site ενοικιάσεων το tel: είναι το πιο
     πατημένο στοιχείο όλου του footer. Το ύψος μπαίνει στο <a> — αν έμπαινε
     στο <li>, η πραγματική περιοχή επαφής θα ήταν ~24px. */
  .ag-foot .ag-foot__ct li a,
  .ag-foot .ag-foot__ct li > span{
    display: block;
    box-sizing: border-box;
    min-height: 40px;
    padding: 9px 0;
    line-height: 1.4;
    text-decoration: none;
  }

  /* --- ΚΟΙΝΩΝΙΚΑ ---------------------------------------------------------
     Είναι exit points: μένουν εκεί που τα βάζει το HTML (μετά την περιγραφή),
     αριστερά, αλλά με κανονικό μέγεθος αφής 44px. */
  .ag-foot .ag-foot__soc{ display: flex; flex-wrap: wrap; gap: 10px; }
  .ag-foot .ag-foot__soc a{
    display: inline-flex;
    align-items: center;
    justify-content: center;   /* κεντράρισμα ΜΕΣΑ στο κουμπί — όχι στοίχιση κειμένου */
    width: 44px;
    height: 44px;
    line-height: 1;
  }

  /* --- ΧΑΡΤΗΣ -------------------------------------------------------------
     max-width ώστε στα 700-991px να μη γίνει λωρίδα 5,6:1 (άχρηστη και άσχημη).
     Το width/height 100% στο περιεχόμενο πρέπει να ισχύει ΚΑΙ στο tablet:
     αλλιώς η εικόνα 600px απλώς κόβεται από το overflow:hidden και σπρώχνει
     οριζόντια κύλιση. */
  .ag-foot .ag-foot__map{
    width: 100%;
    max-width: 520px;
    border-radius: 12px;
    overflow: hidden;
  }
  .ag-foot .ag-foot__map iframe,
  .ag-foot .ag-foot__map img{
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    border: 0;
    object-fit: cover;
  }
  /* Ο ενσωματωμένος χάρτης «αρπάζει» την κάθετη κύλιση του δαχτύλου. Τον
     αφήνουμε ενεργό γιατί ο ιδιοκτήτης δεν ζήτησε να απενεργοποιηθεί. Αν
     παραπονεθεί ότι «κολλάει το scroll στο footer», ενεργοποίησε τη γραμμή:
     .ag-foot .ag-foot__map iframe{ pointer-events:none; }
     (η διεύθυνση από πάνω είναι ήδη σύνδεσμος, οπότε δεν χάνεται λειτουργία) */

  /* --- ΟΡΑΤΟ FOCUS --------------------------------------------------------
     Πλοήγηση με πληκτρολόγιο/υποστηρικτική τεχνολογία: χωρίς αυτό, ο χρήστης
     δεν βλέπει πού βρίσκεται μέσα σε 22 συνδέσμους. */
  .ag-foot a:focus-visible{
    outline: 2px solid #00b8b8;
    outline-offset: 2px;
    border-radius: 4px;
  }
}


/* ===========================================================================
   2) TABLET 768–991px
   Εδώ ΔΕΝ υπήρχε πρόβλημα κεντραρίσματος (ήταν ήδη 2 στήλες αριστερά), οπότε
   κρατάμε τη δομή 2×2 και απλώς προσθέτουμε τις 2 υποστήλες στις λίστες.
   Δοκιμάστηκε και η εναλλακτική «εταιρεία και επικοινωνία σε πλήρες πλάτος,
   χάρτης δίπλα στα τηλέφωνα»: μετρήθηκε ΨΗΛΟΤΕΡΗ κατά ~78px (1039 έναντι 961
   στα 768px), γιατί προσθέτει τρίτη σειρά στο πλέγμα. Κρατήθηκε η χαμηλότερη.
   =========================================================================== */
@media (min-width: 768px) and (max-width: 991px){

  .ag-foot .ag-wrap{ padding-left: 28px; padding-right: 28px; }

  .ag-foot .ag-foot__grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px 32px;
    align-items: start;   /* η ψηλή στήλη της επικοινωνίας να μην τεντώνει
                             και να μη «βυθίζει» τη διπλανή της */
    padding-top: 44px;
    padding-bottom: 32px;
  }

  /* Πάνω από ~70 χαρακτήρες ανά γραμμή το μάτι χάνει τη σειρά στο γύρισμα. */
  .ag-foot .ag-foot__desc{ font-size: 14px; line-height: 1.6; max-width: 56ch; }

  /* Ο χάρτης κρατά το ύψος του desktop — στη μισή στήλη (~340px) βγαίνει
     αναλογία 2:1, που διαβάζεται ακόμη ως χάρτης. */
  .ag-foot .ag-foot__map{ height: 170px; margin-top: 16px; }

  /* Η κάτω μπάρα χωράει σε 1-2 γραμμές: τα τρία κείμενα ρέουν οριζόντια αντί
     να στοιβαχτούν άσκοπα. */
  .ag-foot .ag-foot__barin{
    display: flex;
    flex-wrap: wrap;
    column-gap: 18px;
    row-gap: 4px;
    padding-top: 14px;
    padding-bottom: 16px;
    font-size: 12.5px;
  }
}


/* ===========================================================================
   3) ΚΙΝΗΤΟ ≤767px — ΕΔΩ ΗΤΑΝ ΤΟ ΠΡΟΒΛΗΜΑ (footer 1798px = 2,2 οθόνες)
   Μία στοίβα 4 ενοτήτων σε πλήρες πλάτος, όλα αριστερά, και ΚΑΘΕ λίστα σε
   2 στήλες: 14 σύνδεσμοι → 7 σειρές, 8 σύνδεσμοι → 4 σειρές.
   =========================================================================== */
@media (max-width: 767px){

  /* justify-items/align-items:start ακυρώνουν το place-items:center που
     κεντράριζε ΟΛΟ το πλέγμα. */
  .ag-foot .ag-foot__grid{
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    align-items: start;
    justify-items: start !important;
    padding-top: 34px;
    padding-bottom: 26px;
  }
  .ag-foot .ag-foot__col{ width: 100%; max-width: 100%; min-width: 0; }

  /* Σε μία στοίβα χωρίς κενά, οι 4 ενότητες μοιάζουν με ένα ατέλειωτο μπλοκ.
     Η λεπτή γραμμή δίνει σαφή σημασιολογικά τμήματα — αυτό που στο desktop
     το κάνουν οι στήλες. */
  .ag-foot .ag-foot__col + .ag-foot__col{
    border-top: 1px solid rgba(0, 184, 184, .20);
    padding-top: 20px;
  }

  /* --- Ενότητα εταιρείας -------------------------------------------------- */
  .ag-foot .ag-foot__logo{ display: inline-block; }
  .ag-foot .ag-foot__logo img{ width: 140px; max-width: 140px; height: auto; display: block; }

  /* 60 λέξεις στα 16px τρώνε μισή οθόνη. Στα 13px/1.55 διαβάζονται άνετα και
     το μπλοκ πέφτει ~3 γραμμές. Το κείμενο ΔΕΝ κόβεται (κανένα line-clamp):
     αν κρυβόταν, ο χρήστης δεν θα είχε κανέναν τρόπο να το ανοίξει σε οθόνη
     αφής — και θα ήταν απόφαση περιεχομένου, που δεν ζητήθηκε. */
  .ag-foot .ag-foot__desc{
    font-size: 13px;
    line-height: 1.55;
    margin: 12px 0 14px;
    max-width: 60ch;
  }

  /* --- Το κυρίως κέρδος ύψους: 140px column-width → 2 στήλες στα ≥360px --- */
  .ag-foot .ag-foot__links{ columns: 140px 2; column-gap: 20px; }
  .ag-foot .ag-foot__links li a{ font-size: 13.5px; }

  /* --- Χάρτης -------------------------------------------------------------
     Στο κινητό ο χάρτης είναι δευτερεύων (η διεύθυνση από πάνω είναι ήδη
     σύνδεσμος): 130px αρκούν για αναγνώριση τοποθεσίας χωρίς να τρώει οθόνη. */
  .ag-foot .ag-foot__map{
    height: 130px;
    margin-top: 14px;
    border-radius: 10px;
  }

  /* --- Κάτω νομική μπάρα ---------------------------------------------------
     Τρία ανεξάρτητα κείμενα σε μία σειρά γίνονται χυλός: στοιβάζονται,
     αριστερά, μικρότερα αλλά με κρατημένη αντίθεση (όχι opacity:.5).
     Το env() κρατά το τελευταίο κείμενο πάνω από τη μπάρα home του iPhone. */
  .ag-foot .ag-foot__bar{ padding: 0; }
  .ag-foot .ag-foot__barin{
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-top: 16px;
    padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
    font-size: 12.5px;
    line-height: 1.45;
  }
  .ag-foot .ag-foot__barin > span{ display: block; width: 100%; }
  .ag-foot .ag-foot__eeep{ font-size: 11.5px; color: rgba(255, 255, 255, .72); }
}


/* ===========================================================================
   4) ΠΟΛΥ ΣΤΕΝΕΣ ΟΘΟΝΕΣ ≤360px (iPhone SE, παλιά Android)
   ΓΙΑΤΙ ΜΕΝΟΥΝ ΟΙ 2 ΣΤΗΛΕΣ: η επιστροφή σε μία στήλη εδώ ΧΕΙΡΟΤΕΡΕΥΕΙ το
   αποτέλεσμα — με στόχο αφής 40px η μονή στοίβα βγαίνει ψηλότερη απ' ό,τι
   ήταν πριν τη διόρθωση. Προτιμάμε ετικέτα που πιάνει 2-3 γραμμές (μένει
   ενιαία χάρη στο break-inside) από στοίβα 14 σειρών.
   =========================================================================== */
@media (max-width: 360px){
  .ag-foot .ag-wrap{ padding-left: 14px; padding-right: 14px; }

  .ag-foot .ag-foot__links{ columns: 124px 2; column-gap: 14px; }
  .ag-foot .ag-foot__links li a{ font-size: 13px; line-height: 1.35; padding-right: 6px; }

  .ag-foot .ag-foot__ct li{ font-size: 13.5px; }
  .ag-foot .ag-foot__desc{ font-size: 12.5px; }
  .ag-foot .ag-foot__map{ height: 120px; }
}


/* ===========================================================================
   ΣΗΜΕΙΩΣΗ (δεν διορθώνεται εδώ, γιατί ο υπολογιστής δεν αγγίζεται):
   στα ~992-1100px η εικόνα/iframe του χάρτη έχει εγγενές πλάτος 600px ενώ η
   στήλη είναι ~210px, οπότε η σελίδα βγάζει οριζόντια κύλιση. Κάτω από τα
   991px το διορθώνει ήδη ο κανόνας .ag-foot__map img{width:100%}. Αν θέλεις
   να φύγει και στο desktop, χρειάζεται μία γραμμή ΕΚΤΟΣ media query — πες το
   ρητά, γιατί παραβιάζει το «μην πειράξεις τον υπολογιστή».
   =========================================================================== */
/* ── Δύο προηγούμενες διορθώσεις που το παραπάνω μπλοκ ακύρωνε ─────────────
   Μπαίνουν ΜΕΤΑ ώστε να κερδίσουν με τη σειρά, όχι με !important. */

/* 1. Το αιωρούμενο κουμπί των cookies είναι καρφωμένο κάτω αριστερά και πιάνει
      τα τελευταία 60px της οθόνης. Με μόλις 18px από κάτω θα ξανασκέπαζε τον
      αριθμό αδείας ΕΕΕΠ. */
@media (max-width: 1280px){
	.ag-foot .ag-foot__barin{
		padding-bottom: calc(52px + env(safe-area-inset-bottom, 0px));
	}
}

/* 2. Ο αριθμός αδείας χωράει σε μία γραμμή μόνο αν το πλάγιο περιθώριο της
      κάτω μπάρας είναι μικρότερο — έσπαγε στα «HGCEGOP-00012-» / «00». */
@media (max-width: 430px){
	.ag-foot .ag-foot__bar .ag-wrap{
		padding-left: 10px;
		padding-right: 10px;
	}
	.ag-foot .ag-foot__eeep{ letter-spacing: 0; }
}

/* Στα 360px ο αριθμός αδείας χωράει οριακά (337px σε 340 διαθέσιμα) και το ✓
   μπροστά τον σπρώχνει σε δεύτερη γραμμή. Μισό pixel γραμματοσειράς αρκεί. */
@media (max-width: 374px){
	.ag-foot .ag-foot__eeep{ font-size: 11px; }
}
/* ============================================================================
   AG FOOTER — ΚΙΝΗΤΟ: ΑΚΥΡΩΣΗ ΤΩΝ 2 ΣΤΗΛΩΝ + ACCORDION
   Προορισμός: ΤΕΛΟΣ του mu-plugins/adamsgames-fixes.css (ΟΧΙ στο design.css).
   Πρέπει να μπει ΜΕΤΑ τα παλιά footer blocks του ίδιου αρχείου, γιατί ακυρώνει
   κανόνες τους με ίδια ειδικότητα (κερδίζει η σειρά).

   ΚΑΝΟΝΑΣ ΑΣΦΑΛΕΙΑΣ: κάθε κανόνας εμφάνισης ζει μέσα σε max-width media
   query. Το μόνο block με min-width (§7) είναι δίχτυ ασφαλείας και απαιτεί
   την κλάση `.ag-foot--acc`, που υπάρχει ΜΟΝΟ όταν τρέχει το accordion στο
   κινητό — σε καθαρό desktop DOM δεν ταιριάζει κανένας επιλογέας του.
   Άρα ο υπολογιστής (≥992px) μένει bit-for-bit ίδιος.
   ============================================================================ */


/* ---------------------------------------------------------------------------
   1. ΑΚΥΡΩΣΗ ΤΟΥ ΠΡΟΗΓΟΥΜΕΝΟΥ MULTI-COLUMN  (≤991px)
   ΓΙΑΤΙ: οι δύο στήλες συνδέσμων είναι ακριβώς αυτό που απορρίφθηκε. Σε 21
   πραγματικά site που εξετάστηκαν, ΚΑΝΕΝΑ δεν βάζει πλοήγηση σε δύο στήλες στο
   κινητό. Καθαρίζουμε ΟΛΑ τα ίχνη: columns, column-gap, column-rule, και το
   break-inside που είχε μπει στα <li> για να μη σπάνε ανάμεσα στις στήλες.
   --------------------------------------------------------------------------- */
@media (max-width: 991.98px){

  .ag-foot .ag-foot__col .ag-foot__links{
    columns: auto;              /* shorthand: column-width:auto + column-count:auto */
    column-count: auto;
    column-width: auto;
    column-gap: normal;
    column-rule: none;
  }

  .ag-foot .ag-foot__col .ag-foot__links li{
    break-inside: auto;
    page-break-inside: auto;
    -webkit-column-break-inside: auto;
    display: block;
    margin: 0;
    padding: 0;
  }

  /* ΓΙΑΤΙ: τώρα που η γραμμή πιάνει όλο το πλάτος, ο στόχος αφής μπορεί να
     είναι κανονικός (44px, σύσταση WCAG 2.5.8 / Apple HIG) και το γράμμα
     μεγαλύτερο — δεν υπάρχει πια στενή στήλη 160px που να το περιορίζει. */
  .ag-foot .ag-foot__col .ag-foot__links li a{
    display: flex;
    align-items: center;
    box-sizing: border-box;
    min-height: 44px;
    padding: 4px 0;
    font-size: 15px;
    line-height: 1.35;
    text-decoration: none;
  }
}


/* ---------------------------------------------------------------------------
   2. ΡΥΘΜΟΣ ΕΝΟΤΗΤΩΝ ΣΤΟ ΚΙΝΗΤΟ  (≤767.98px)
   ΓΙΑΤΙ: στη στοίβα των 4 ενοτήτων χρειάζεται κάτι να δηλώνει «εδώ τελειώνει
   το ένα, αρχίζει το άλλο». Η λεπτή γραμμή 1px + σταθερό padding είναι η
   λύση του Airbnb — η πιο όμορφη λεπτομέρεια όλης της έρευνας: δίνει δομή
   χωρίς κουτιά, χωρίς πλαίσια, χωρίς διακοσμητικά.
   Ισχύει ΚΑΙ ΧΩΡΙΣ JS — δεν εξαρτάται από το accordion.
   --------------------------------------------------------------------------- */
@media (max-width: 767.98px){

  .ag-foot .ag-foot__grid{
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;                       /* τα κενά τα δίνει πλέον το padding της ενότητας */
    align-items: start;
    padding-top: 30px;
    padding-bottom: 24px;
  }

  .ag-foot .ag-foot__grid > .ag-foot__col{
    width: 100%;
    min-width: 0;
    border-top: 1px solid rgba(255, 255, 255, .10);
    padding: 18px 0;
  }

  /* ΓΙΑΤΙ: η πρώτη ενότητα δεν χρειάζεται γραμμή από πάνω — θα διάβαζε σαν
     να κόβει το λογότυπο από το υπόλοιπο site. */
  .ag-foot .ag-foot__grid > .ag-foot__col:first-child{
    border-top: 0;
    padding-top: 0;
  }

  /* Ακυρώνει το παλιό `.ag-foot__col + .ag-foot__col` (τιρκουάζ γραμμή 20%)·
     το τιρκουάζ έτραβούσε το μάτι σε κάτι που πρέπει να είναι διαχωριστικό,
     όχι στοιχείο. */
  .ag-foot .ag-foot__grid > .ag-foot__col + .ag-foot__col{
    border-top: 1px solid rgba(255, 255, 255, .10);
    padding-top: 18px;
  }

  .ag-foot .ag-foot__col > h3{
    margin: 0 0 12px;
    font-size: 13px;
    line-height: 1.25;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: #fff;
  }
}


/* ---------------------------------------------------------------------------
   3. ACCORDION — ΜΟΝΟ ΟΤΑΝ ΤΟ JS ΕΧΕΙ ΒΑΛΕΙ ΤΗΝ ΚΛΑΣΗ .ag-foot--acc
   ΓΙΑΤΙ ΕΤΣΙ: όλοι οι κανόνες σύμπτυξης ζουν κάτω από κλάση που προσθέτει το
   ίδιο το script. Αν το JS δεν φορτώσει (Autoptimize, σφάλμα αλλού, παλιά
   συσκευή), δεν κρύβεται ΑΠΟΛΥΤΩΣ ΤΙΠΟΤΑ — ο όρος «λειτουργικό χωρίς JS»
   ικανοποιείται εξ ορισμού, όχι κατά τύχη.
   --------------------------------------------------------------------------- */
@media (max-width: 767.98px){

  /* --- η γραμμή-κουμπί ---------------------------------------------------
     Ο <h3> μένει <h3> (πλοήγηση ανά επικεφαλίδα σε screen reader) και μέσα
     του μπαίνει το <button> — το μοτίβο του John Lewis, το τεχνικά σωστότερο
     δείγμα της έρευνας. Ο χρήστης ακούει «ΥΠΗΡΕΣΙΕΣ, επικεφαλίδα 3, κουμπί,
     συμπτυγμένο». */
  .ag-foot--acc .ag-foot__col > h3{
    margin: 0;
  }

  .ag-foot--acc .ag-foot__tog{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    box-sizing: border-box;
    width: 100%;
    min-height: 52px;             /* tap target πλήρους πλάτους */
    margin: 0;
    padding: 0;
    background: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-align: left;
    text-transform: inherit;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    -webkit-tap-highlight-color: transparent;
  }

  .ag-foot--acc .ag-foot__tog:focus-visible{
    outline: 2px solid #00b8b8;
    outline-offset: 3px;
    border-radius: 3px;
  }

  /* --- chevron ------------------------------------------------------------
     ΓΙΑΤΙ ::after και όχι SVG: κανένα εικονίδιο δεν μπαίνει στο HTML του
     Elementor widget — το wp_kses σβήνει ολόκληρα τα <svg> αθόρυβα. Δύο
     borders σε ένα κενό ψευδοστοιχείο είναι άτρωτα. */
  .ag-foot--acc .ag-foot__tog::after{
    content: "";
    flex: 0 0 auto;
    width: 8px;
    height: 8px;
    margin-right: 3px;
    border-right: 2px solid #00b8b8;
    border-bottom: 2px solid #00b8b8;
    transform: translateY(-2px) rotate(45deg);
    transition: transform .25s ease;
  }

  .ag-foot--acc .ag-foot__tog[aria-expanded="true"]::after{
    transform: translateY(2px) rotate(225deg);
  }

  /* --- το αναδιπλούμενο πάνελ ---------------------------------------------
     ΓΙΑΤΙ grid-template-rows 0fr→1fr: είναι ο μόνος τρόπος να κινηθεί ομαλά
     ύψος «auto» χωρίς μαγικά max-height που κόβουν ή αργούν.
     ΓΙΑΤΙ ΟΧΙ display:none: οι 22 σύνδεσμοι πρέπει να μένουν στο DOM και στο
     rendered HTML για το SEO (mobile-first indexing).
     ΓΙΑΤΙ visibility:hidden όσο είναι κλειστό: βγάζει τους κρυμμένους
     συνδέσμους από τη σειρά του Tab — αλλιώς ο χρήστης πληκτρολογίου
     ταξιδεύει μέσα από 22 αόρατους συνδέσμους (το κλασικό σφάλμα των
     CSS-only accordion). Η επαναφορά της ορατότητας γίνεται ακαριαία στο
     άνοιγμα και με καθυστέρηση .28s στο κλείσιμο, ώστε να προλάβει η κίνηση. */
  .ag-foot--acc .ag-foot__panel{
    display: grid;
    grid-template-rows: 0fr;
    overflow: hidden;
    visibility: hidden;
    transition: grid-template-rows .28s ease, visibility 0s linear .28s;
  }

  .ag-foot--acc .ag-foot__panel.is-open{
    grid-template-rows: 1fr;
    visibility: visible;
    transition: grid-template-rows .28s ease, visibility 0s linear 0s;
  }

  /* απαραίτητο για να λειτουργήσει το 0fr: το παιδί δεν επιβάλλει ύψος */
  .ag-foot--acc .ag-foot__panel > .ag-foot__links{
    min-height: 0;
    overflow: hidden;
  }

  .ag-foot--acc .ag-foot__panel.is-open > .ag-foot__links{
    padding-top: 2px;
    padding-bottom: 6px;
  }

}

/* ΓΙΑΤΙ ξεχωριστό query και όχι φωλιασμένο: το Autoptimize ελαχιστοποιεί το
   CSS και τα φωλιασμένα @media είναι το πρώτο πράγμα που χαλάει. */
@media (max-width: 767.98px) and (prefers-reduced-motion: reduce){
  .ag-foot--acc .ag-foot__panel,
  .ag-foot--acc .ag-foot__panel.is-open,
  .ag-foot--acc .ag-foot__tog::after{
    transition: none;
  }
}


/* ---------------------------------------------------------------------------
   4. ΕΠΙΚΟΙΝΩΝΙΑ — ΠΑΝΤΑ ΑΝΟΙΧΤΗ, ΔΕΥΤΕΡΗ ΑΠΟ ΠΑΝΩ  (≤767.98px)
   ΓΙΑΤΙ: το site είναι quote-only (καμία τιμή). Όποιος φτάνει στο footer
   συνήθως θέλει να ΡΩΤΗΣΕΙ — το τηλέφωνο ΕΙΝΑΙ η μετατροπή. Γι' αυτό η
   επικοινωνία δεν μπαίνει ποτέ πίσω από πάτημα, σε αντίθεση με τα e-shop που
   τη χώνουν στο «Help & Contact». Το ίδιο κάνει και το plaisio.gr: βγάζει το
   τηλέφωνο πάνω-πάνω, έξω από το accordion.
   Τη μετακίνηση της στήλης την κάνει το JS στο DOM (όχι CSS order), ώστε η
   οπτική σειρά να ταυτίζεται με τη σειρά ανάγνωσης/Tab (WCAG 1.3.2 & 2.4.3).
   --------------------------------------------------------------------------- */
@media (max-width: 767.98px){

  .ag-foot .ag-foot__ct{
    margin: 0;
    padding: 0;
  }

  .ag-foot .ag-foot__ct li{
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 2px;
    padding: 0;
    font-size: 15px;
  }

  .ag-foot .ag-foot__ct li svg{
    flex: 0 0 18px;
    width: 18px;
    height: 44px;                 /* ευθυγραμμίζεται με τον στόχο αφής δίπλα */
    color: #00b8b8;
  }

  .ag-foot .ag-foot__ct li a,
  .ag-foot .ag-foot__ct li > span{
    display: block;
    box-sizing: border-box;
    min-height: 44px;
    padding: 11px 0;
    line-height: 1.4;
    text-decoration: none;
  }

  /* ΓΙΑΤΙ: τα τηλέφωνα είναι η ενέργεια, όχι διακόσμηση — λευκά και λίγο
     πιο βαριά, ώστε να ξεχωρίζουν από τη διεύθυνση μέσα στην ίδια λίστα. */
  .ag-foot .ag-foot__ct a[href^="tel:"]{
    color: #fff !important;
    font-weight: 700;
    letter-spacing: .01em;
  }

  .ag-foot .ag-foot__map{
    width: 100%;
    max-width: 100%;
    height: 130px;
    margin-top: 14px;
    border-radius: 10px;
    overflow: hidden;
  }

  .ag-foot .ag-foot__map iframe,
  .ag-foot .ag-foot__map img{
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    object-fit: cover;
  }
}


/* ---------------------------------------------------------------------------
   5. ΚΑΤΩ ΜΠΑΡΑ  (≤767.98px)
   ΓΙΑΤΙ αριστερά και όχι κεντραρισμένα: ο ίδιος ο ιδιοκτήτης είχε πει ότι τα
   κεντραρισμένα «χάλαγαν» — κρατάμε έναν ενιαίο άξονα σάρωσης σε όλο το
   footer. Τα νομικά και ο αριθμός Ε.Ε.Ε.Π. μένουν ΠΑΝΤΑ ορατά, χωρίς πάτημα
   (σε όλα τα site της έρευνας τα νομικά μένουν έξω από το accordion).
   --------------------------------------------------------------------------- */
@media (max-width: 767.98px){

  .ag-foot .ag-foot__barin{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    padding-top: 14px;
    padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
    font-size: 12px;
    line-height: 1.45;
    color: rgba(255, 255, 255, .6);
  }

  .ag-foot .ag-foot__barin > span{
    display: block;
    width: 100%;
  }

  .ag-foot .ag-foot__eeep{
    font-size: 11.5px;
    color: rgba(255, 255, 255, .72) !important;
  }
}


/* ---------------------------------------------------------------------------
   6. ΠΟΛΥ ΣΤΕΝΕΣ ΟΘΟΝΕΣ (≤360px)
   ΓΙΑΤΙ: ακυρώνουμε ρητά και εδώ το παλιό `columns:124px 2` — αλλιώς στα
   μικρά Android θα επέστρεφαν οι δύο στήλες μέσα στο ανοιγμένο accordion.
   --------------------------------------------------------------------------- */
@media (max-width: 360px){
  .ag-foot .ag-foot__col .ag-foot__links{
    columns: auto;
    column-count: auto;
    column-width: auto;
    column-gap: normal;
    column-rule: none;
  }
  .ag-foot .ag-foot__col .ag-foot__links li a{ font-size: 14.5px; }
  .ag-foot .ag-foot__ct li{ font-size: 14.5px; }
}


/* ---------------------------------------------------------------------------
   7. ΔΙΚΤΥ ΑΣΦΑΛΕΙΑΣ ΓΙΑ TABLET & ΥΠΟΛΟΓΙΣΤΗ (≥768px)
   ΓΙΑΤΙ: αν για οποιονδήποτε λόγο μείνει υπόλειμμα του accordion στο DOM
   (χαμένο event αλλαγής μεγέθους, περιστροφή συσκευής, σφάλμα JS στη μέση),
   ΔΕΝ επιτρέπεται να δει ο υπολογιστής κρυμμένες λίστες. Εδώ ξεκλειδώνουν τα
   πάντα με !important — η τεχνική που χρησιμοποιούν IKEA και IAAPA.
   ΔΕΝ ΑΓΓΙΖΕΙ ΤΟΝ ΚΑΝΟΝΙΚΟ ΥΠΟΛΟΓΙΣΤΗ: κάθε επιλογέας απαιτεί `.ag-foot--acc`
   ή `.ag-foot__tog`, δηλαδή στοιχεία που υπάρχουν μόνο όταν τρέχει το
   accordion. Σε καθαρό desktop DOM δεν ταιριάζει κανένας από αυτούς.
   --------------------------------------------------------------------------- */
@media (min-width: 768px){

  .ag-foot--acc .ag-foot__panel{
    display: block !important;
    grid-template-rows: none !important;
    visibility: visible !important;
    overflow: visible !important;
    transition: none !important;
  }

  .ag-foot--acc .ag-foot__tog{
    display: block !important;
    width: 100%;
    min-height: 0 !important;
    margin: 0;
    padding: 0;
    background: none;
    border: 0;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    text-align: left;
    cursor: default;
    pointer-events: none;         /* παύει να είναι κουμπί — γίνεται απλός τίτλος */
    -webkit-appearance: none;
    appearance: none;
  }

  .ag-foot--acc .ag-foot__tog::after{
    display: none !important;     /* κανένα chevron στον υπολογιστή */
  }
}

/* ── Πλάτος: κείμενο στενό, πλέγματα φαρδιά ────────────────────────────────
   Η σελίδα «Νέα & Έργα» κληρονομούσε το πλάτος ΑΝΑΓΝΩΣΗΣ άρθρου (760px),
   ενώ δεν δείχνει κείμενο — δείχνει πλέγμα καρτών. Σε οθόνη 1920px έμεναν
   580px κενά δεξιά κι αριστερά, δηλαδή 60% της οθόνης άδειο, με τις κάρτες
   στριμωγμένες σε 2 στήλες των 270px.

   Ο κανόνας που ισχύει από εδώ και πέρα:
   • ΚΕΙΜΕΝΟ (παράγραφοι άρθρου, εισαγωγικό) → μένει στενό, γύρω στα 660-760px.
     Μια γραμμή 1400px δεν διαβάζεται· το μάτι χάνει τη σειρά.
   • ΠΛΕΓΜΑΤΑ (κάρτες, προϊόντα, κατηγορίες) → παίρνουν όλο το διαθέσιμο
     πλάτος, όσο το επιτρέπει η οθόνη, και αυξάνουν ΣΤΗΛΕΣ αντί να μεγαλώνουν
     τις κάρτες.
   -------------------------------------------------------------------------- */

/* Η σελίδα αρχείου βγαίνει από το πλάτος ανάγνωσης. Δύο επιλογείς: το id της
   σελίδας (σίγουρο) και το :has() (συνεχίζει να δουλεύει αν αλλάξει το id). */
body.page-id-3489 .page-content,
.ag-article .page-content:has(.ag-newsarch){
	max-width: none;
}

/* Το εισαγωγικό κείμενο ΔΕΝ ακολουθεί — μένει αναγνώσιμο και κεντραρισμένο.
   Αυτή είναι ακριβώς η διάκριση: το πλέγμα απλώνει, το κείμενο όχι. */
.ag-newsarch .ag-article__lead{ max-width: 660px; margin-left: auto; margin-right: auto; }

/* Το πλέγμα του αρχείου: όσες στήλες χωράνε, με κάρτα που δεν πέφτει κάτω από
   320px. Στα 1440px βγάζει 4 στήλες, στα 1024 τρεις, στο tablet δύο, στο
   κινητό μία — χωρίς breakpoints, το ίδιο το πλάτος αποφασίζει. */
.ag-news__grid--arch{
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
	justify-content: stretch;
}

@media (max-width: 767px){
	.ag-news__grid--arch{ grid-template-columns: minmax(0, 1fr); max-width: 520px; }
}

/* ─── Πλάτος άρθρου — 23/09/2026 ──────────────────────────────────────────
   Μετρημένο στα 1920px: το μπλοκ του άρθρου έπιανε 1038px (54% της οθόνης)
   και κάθε φωτογραφία 720px, με 363px κενά σε κάθε πλευρά.

   Η στήλη ανοίγει ώστε να μεγαλώσουν ΟΙ ΕΙΚΟΝΕΣ. Το κείμενο μένει σε
   αναγνώσιμο μέτρο (~70-75 χαρακτήρες) — μεγαλύτερο μήκος γραμμής κάνει
   το μάτι να χάνει τη σειρά. Δηλαδή: φαρδιά κολόνα, στενή παράγραφος.

   body .ag-artgrid: η ίδια δήλωση υπάρχει και σε article.css και σε
   design.css· το body ανεβάζει τη specificity ώστε να μην εξαρτάται από
   τη σειρά φόρτωσης.
   ─────────────────────────────────────────────────────────────────────── */
@media (min-width: 1280px) {
	body .ag-artgrid { grid-template-columns: 300px minmax(0, 1fr); column-gap: 52px; }
	.ag-artmain > p,
	.ag-artmain > h2,
	.ag-artmain > h3,
	.ag-artmain > h4,
	.ag-artmain > ul,
	.ag-artmain > ol,
	.ag-artmain > blockquote { max-width: 740px; }
	body .ag-readnext { max-width: 1232px; }
}
@media (min-width: 1600px) {
	body .ag-artgrid { grid-template-columns: 320px minmax(0, 1fr); column-gap: 60px; }
	.ag-artmain > p,
	.ag-artmain > h2,
	.ag-artmain > h3,
	.ag-artmain > h4,
	.ag-artmain > ul,
	.ag-artmain > ol,
	.ag-artmain > blockquote { max-width: 760px; }
	body .ag-readnext { max-width: 1404px; }
}

/* Ο πραγματικός περιοριστής: .post-content/.entry-content στα 1180px, μέσα σε
   theme container 1440px. Χωρίς αυτό, η στήλη των 1024px παραπάνω συρρικνωνόταν
   στα 800. Μόνο σε single post — το .entry-content το χρησιμοποιούν και σελίδες. */
@media (min-width: 1280px) {
	body.single-post .post-content,
	body.single-post .entry-content { max-width: 1420px; }
}

/* ─────────────────────────────────────────────────────────────────────────
   Σελίδα προϊόντος: το κενό κάτω από τις φωτογραφίες

   Η δεξιά στήλη (τίτλος + περιγραφή) είναι πολύ ψηλότερη από τη γκαλερί —
   στο Super Carnival 1059px έναντι 446px, δηλαδή 613px λευκό κενό κάτω από
   τις φωτογραφίες. Λύση: η γκαλερί μένει καρφιτσωμένη όσο διαβάζεις, και η
   «Αναλυτική Περιγραφή» γίνεται κάρτα ώστε να μη μοιάζει με ξεκρέμαστο
   κείμενο που ξεπερνάει τις εικόνες.
   ───────────────────────────────────────────────────────────────────────── */

@media (min-width: 992px) {
	/* Ο γονέας έχει align-items: flex-start, οπότε η στήλη της γκαλερί έμενε
	   509px ενώ η διπλανή 1128 — το sticky δεν είχε πού να ταξιδέψει. */
	body.single-product .elementor-element-agpmc01 { align-self: stretch; }
	body.single-product .elementor-element-agpmc01 > .elementor-widget-wrap { align-content: flex-start; }
	body.single-product .elementor-widget-porto_cp_image {
		position: sticky;
		top: 96px;
	}
}

body.single-product .ag-pdesc {
	margin: 26px 0 0;
	padding: 22px 26px 24px;
	border: 1px solid #e4eef1;
	border-top: 1px solid #e4eef1;
	border-radius: 16px;
	background: linear-gradient(180deg, #f8fcfd 0%, #f2f8fa 100%);
}

body.single-product .ag-pdesc h2 { margin-top: 0; }

body.single-product .ag-pdesc p { font-size: .93rem; line-height: 1.78; }
body.single-product .ag-pdesc > p:last-child { margin-bottom: 0; }

/* Οι παράγραφοι που λειτουργούν ως επικεφαλίδα λίστας («Τι περιλαμβάνει:») */
body.single-product .ag-pdesc p > strong:only-child {
	display: block;
	margin: 6px 0 2px;
	font-size: .82rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: #13232e;
}

body.single-product .ag-pdesc ul {
	margin: 0 0 16px;
	padding: 0;
	list-style: none;
}

body.single-product .ag-pdesc ul li {
	position: relative;
	padding: 0 0 0 26px;
	margin: 0 0 10px;
	font-size: .92rem;
	line-height: 1.7;
	color: #46555f;
}

/* Τικ αντί για κουκκίδα — ίδια γλώσσα με τα υπόλοιπα στοιχεία της σελίδας */
body.single-product .ag-pdesc ul li::before {
	content: "";
	position: absolute;
	left: 2px;
	top: .52em;
	width: 11px;
	height: 6px;
	border-left: 2px solid var(--ag-teal, #00b8b8);
	border-bottom: 2px solid var(--ag-teal, #00b8b8);
	transform: rotate(-45deg);
}

/* Σε φαρδιά οθόνη οι σύντομες γραμμές μπαίνουν σε δύο στήλες, ώστε η
   περιγραφή να μη «τρέχει» πολύ πιο κάτω από τις φωτογραφίες. */
@media (min-width: 1200px) {
	body.single-product .ag-pdesc ul {
		columns: 2;
		column-gap: 30px;
	}
	body.single-product .ag-pdesc ul li {
		break-inside: avoid;
		-webkit-column-break-inside: avoid;
	}
}

@media (max-width: 767px) {
	body.single-product .ag-pdesc { padding: 18px 18px 20px; border-radius: 14px; }
}


/* ===========================================================================
   ΜΑΚΡΙΑ ΣΤΗΛΗ ΣΥΝΔΕΣΜΩΝ ΣΤΟ FOOTER (tablet + υπολογιστής)
   Οι «Γρήγοροι σύνδεσμοι» έφτασαν τους 17 και τράβαγαν το footer σε ύψος
   ολόκληρης οθόνης. Δείχνουμε 6 και τα υπόλοιπα ανοίγουν με κουμπί.

   ΔΕΝ ΚΡΕΜΙΕΤΑΙ ΑΠΟ ΠΛΑΤΟΣ: η κλάση .ag-foot--fold μπαίνει από JS ΜΟΝΟ όταν
   και οι τέσσερις στήλες είναι στην ΙΔΙΑ ΣΕΙΡΑ — τότε μόνο η μακριά λίστα
   τραβάει όλο το footer. Σε 2 στήλες ή σε στοίβα το μάζεμα δεν κερδίζει τίποτα
   και αφήνει μια κουτσή στήλη δίπλα σε μια ολόκληρη. Από κάτω δουλεύει το accordion του κινητού
   (adamsgames-footer-accordion.js) που διπλώνει ΟΛΗ τη λίστα κάτω από τον
   τίτλο — αν έτρεχαν και τα δύο, ο χρήστης θα άνοιγε το accordion και θα
   έβλεπε μόνο 6 από τους 17 συνδέσμους.

   ΓΙΑΤΙ display:none ΚΑΙ ΟΧΙ ΑΦΑΙΡΕΣΗ: οι σύνδεσμοι μένουν στο HTML, οπότε
   η Google τους διαβάζει και τους ακολουθεί κανονικά.
   =========================================================================== */
.ag-foot--fold .ag-foot__links--fold > li:nth-child(n+7){ display: none; }
.ag-foot--fold .ag-foot__links--fold.is-open > li{ display: list-item; }

.ag-foot__more{
  display: none;                 /* στο κινητό δεν εμφανίζεται ποτέ */
  margin: 3px 0 0;
  padding: 2px 0;
  background: none;
  border: 0;
  cursor: pointer;
  font: inherit;
  font-size: 0.82rem;
  color: var(--ag-teal-bright, #00d4d4);
}
.ag-foot__more:hover{ text-decoration: underline; text-underline-offset: 3px; }
.ag-foot__more:focus-visible{
  outline: 2px solid var(--ag-teal-bright, #00d4d4);
  outline-offset: 3px;
  border-radius: 3px;
}
.ag-foot__more svg{
  width: 10px; height: 10px; margin-left: 6px; vertical-align: middle;
  transition: transform .18s ease;
}
.ag-foot__more[aria-expanded="true"] svg{ transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce){ .ag-foot__more svg{ transition: none; } }

/* Μετά τη βάση, αλλιώς το display:none από πάνω κερδίζει (ίδια ειδικότητα, σειρά αρχείου). */
.ag-foot--fold .ag-foot__more{ display: inline-block; }
