/* ==========================================================================
   e-Agrotis — ΑΡΧΙΚΗ
   Φορτώνει ΜΟΝΟ στην αρχική.
   ========================================================================== */

/* --------------------------------------------------------------------------
   HERO CAROUSEL
   -------------------------------------------------------------------------- */
.ea-top2{ margin: 0 auto; max-width: var(--ea-max); }
.ea-hero{ position: relative; overflow: hidden; }
.ea-slides{ position: relative; }

/* Το slide είναι ΠΛΕΓΜΑ με ένα κελί: εικόνα και κείμενο στοιβάζονται
   στην ίδια θέση. Έτσι το ύψος το ορίζει ό,τι είναι μεγαλύτερο — αν ο
   τίτλος είναι μακρύς, το slide ψηλώνει και η εικόνα τεντώνεται.
   Με absolute overlay ο τίτλος ξεχείλιζε προς τα πάνω και ΚΟΒΟΤΑΝ. */
.ea-slide{ display: none; }
.ea-slide[data-on="1"]{
  display: grid; grid-template-areas: "stack";
  animation: ea-fade .45s ease;
}
@keyframes ea-fade{ from{ opacity:.35 } to{ opacity:1 } }

.ea-slide__fig{
  grid-area: stack; margin: 0; overflow: hidden;
  min-height: 340px;                 /* ώστε να μη «ζαρώνει» με κοντό τίτλο */
}
.ea-slide__fig img{
  display: block; width: 100%; height: 100%;
  min-height: 340px; object-fit: cover; background: var(--ea-surface);
}
.ea-slide__over{
  grid-area: stack; align-self: end; z-index: 2;
  padding: 60px var(--ea-pad) 58px;
  background: linear-gradient(0deg,
    rgba(4,7,3,.94) 0%, rgba(4,7,3,.74) 52%, rgba(4,7,3,0) 100%);
}
.ea-slide__over .ea-eyebrow{ color: #8ede73; }
.ea-slide__title{
  margin: 7px 0 8px;
  font-size: 27px; line-height: 1.14; font-weight: 800;
  letter-spacing: -.022em; text-wrap: balance;
  /* Πολύ μακρύς τίτλος κόβεται με «…» αντί να σπρώχνει το κάδρο.
     Τέσσερις γραμμές στα 27px χωρούν άνετα τίτλο ειδήσεων. */
  display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;
  overflow: hidden;
}
.ea-slide__title a{ color:#fff; text-decoration:none; }
.ea-slide__title a:hover{ text-decoration: underline; text-underline-offset: 3px; }
.ea-slide__lead{ display:none; }
.ea-slide__over .ea-meta{ color: rgba(255,255,255,.75); }

/* πλοήγηση carousel */
.ea-hero__nav{
  position:absolute; inset:auto 0 0 0; z-index:3;
  display:flex; align-items:center; gap:9px;
  padding: 0 var(--ea-pad) 13px; pointer-events:none;
}
.ea-dots{ display:flex; gap:6px; pointer-events:auto; }
.ea-dots button{
  appearance:none; border:0; padding:0; cursor:pointer;
  width:26px; height:3px; background: rgba(255,255,255,.38); transition: background .2s;
}
.ea-dots button[aria-selected="true"]{ background:#fff; }
.ea-dots button:focus-visible{ outline:2px solid #fff; outline-offset:3px; }

.ea-arrows{ margin-left:auto; display:flex; gap:7px; pointer-events:auto; }
.ea-arrows button{
  appearance:none; width:34px; height:34px;
  border:1px solid rgba(255,255,255,.45); background: rgba(4,7,3,.42);
  color:#fff; font-size:15px; line-height:1; cursor:pointer;
  display:grid; place-items:center; transition: background .18s;
}
.ea-arrows button:hover{ background: rgba(4,7,3,.75); }
.ea-arrows button:focus-visible{ outline:2px solid #fff; outline-offset:2px; }

/* Κορυφαία — τα στυλ .ea-rank ζουν στο base.css,
   γιατί τα χρησιμοποιεί ΚΑΙ η πλαϊνή στήλη του άρθρου. */
.ea-side{ padding: 0 var(--ea-pad); }

/* --------------------------------------------------------------------------
   ΤΑ ΔΥΟ ΕΡΓΑΛΕΙΑ: ΚΑΙΡΟΣ + ΤΙΜΕΣ
   -------------------------------------------------------------------------- */
.ea-tools{ display: grid; gap: 0; }

.ea-wx{
  background: var(--ea-surface); border-top: 3px solid var(--ea-acc);
  padding: 16px; margin-top: 20px;
}
.ea-wx__top{ display:flex; align-items:baseline; gap:10px; margin-bottom:11px; }
.ea-wx__top h2{
  margin:0; font-size:14px; font-weight:800; letter-spacing:.1em;
  text-transform:uppercase; color: var(--ea-ink);
}
.ea-wx__when{
  margin-left:auto; font-size:11px; letter-spacing:.06em; text-transform:uppercase;
  color: var(--ea-meta); font-weight:600;
}
.ea-alert{
  display:flex; gap:9px; background: var(--ea-warn-soft);
  border-left: 3px solid var(--ea-warn); padding: 9px 11px; margin-bottom: 12px;
}
.ea-alert b{
  display:block; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase;
  color: var(--ea-warn); margin-bottom:2px;
}
.ea-alert span{ font-size:13.5px; line-height:1.4; color: var(--ea-ink-2); }

.ea-temps{
  display:grid; grid-template-columns: repeat(2,1fr); gap:1px;
  background: var(--ea-rule); border: 1px solid var(--ea-rule); margin-bottom: 11px;
}
.ea-t{ background: var(--ea-ground); padding: 9px 11px; }
.ea-t .c{ font-size:12px; font-weight:600; color: var(--ea-meta); }
.ea-t .v{
  font-size:19px; font-weight:800; font-variant-numeric: tabular-nums;
  color: var(--ea-ink); margin-top:1px;
}
.ea-t .v small{ font-size:.62em; font-weight:600; color: var(--ea-meta); margin-left:3px; }

.ea-wx__fig{
  display:block; margin: 0 0 12px; overflow:hidden;
  background: var(--ea-rule); line-height:0;
}
.ea-wx__fig img{ display:block; width:100%; height:100%; object-fit: cover; aspect-ratio: 16/9; }

.ea-wx__title{ margin:0; font-size:17px; line-height:1.27; font-weight:700; }
.ea-wx__title a{ text-decoration:none; }
.ea-more{
  display:inline-block; margin-top:9px; font-size:12.5px; font-weight:700;
  color: var(--ea-acc); text-decoration:none;
}
.ea-more:hover{ text-decoration: underline; }
.ea-wx__sponsor{ margin-top:13px; padding-top:11px; border-top:1px solid var(--ea-rule); }
.ea-wx__sponsor .ea-sponsor{ margin-left:0; padding-bottom:0; }

.ea-prices{
  background: var(--ea-ground); border: 1px solid var(--ea-rule);
  border-top: 3px solid var(--ea-acc); padding: 16px; margin-top: 20px;
}
.ea-prices__top{ display:flex; align-items:baseline; gap:10px; margin-bottom:3px; }
.ea-prices__top h2{
  margin:0; font-size:14px; font-weight:800; letter-spacing:.1em;
  text-transform:uppercase; color: var(--ea-ink);
}
.ea-prices__top .ea-all{ margin-left:auto; padding-bottom:0; }
.ea-prices__src{ font-size:11px; color: var(--ea-meta); margin-bottom: 8px; }
.ea-prices .ea-card{ padding: 12px 0; }
.ea-prices .ea-card h3,
.ea-prices .ea-card__ttl{ font-size:16px; line-height:1.3; }

/* --------------------------------------------------------------------------
   ΣΤΥΛ ΕΝΟΤΗΤΩΝ — ρυθμός αντί για πέντε ίδια πλέγματα
   -------------------------------------------------------------------------- */

/* Συμπαγής λίστα: μικρή εικόνα δίπλα σε τίτλο. Χωράνε διπλάσια άρθρα. */
.ea-minilist{ display: grid; gap: 0; }
@media (min-width: 700px){
  .ea-minilist{ grid-template-columns: 1fr 1fr; gap: 0 26px; }
}
.ea-minilist .ea-card{ border-top: 1px solid var(--ea-rule); padding: 13px 0; }
.ea-minilist .ea-card:first-child{ border-top: 0; }
@media (min-width: 700px){
  /* με δύο στήλες, η δεύτερη γραμμή ξεκινά κι αυτή χωρίς διπλή γραμμή */
  .ea-minilist .ea-card:nth-child(2){ border-top: 0; }
}

/* «Πρώτο μεγάλο»: το κορυφαίο άρθρο πιάνει όλο το πλάτος με μεγάλη εικόνα. */
.ea-lead .ea-card--stacked .ea-card__img img{ aspect-ratio: 16/9; }
@media (min-width: 900px){
  .ea-lead{ margin-bottom: 6px; }
  .ea-lead .ea-card--stacked{
    display: grid; grid-template-columns: 1.25fr 1fr; gap: 0 26px; align-items: start;
  }
  .ea-lead .ea-card--stacked .ea-card__img{ grid-column: 1; }
  .ea-lead .ea-card--stacked .ea-card__txt{ grid-column: 2; }
  .ea-lead .ea-card--stacked .ea-card__ttl{ font-size: 26px; line-height: 1.18; }
  .ea-lead .ea-card__lead{ font-size: 16px; }
}

/* Στο «μεικτό», η πρώτη σειρά έχει απόσπασμα — ξεχωρίζει από τη λίστα. */
.ea-sec--mixed .ea-grid{ margin-bottom: 4px; }

/* --------------------------------------------------------------------------
   ΠΡΟΘΕΣΜΙΕΣ
   -------------------------------------------------------------------------- */
.ea-deadlines{
  border: 1px solid var(--ea-rule); border-top: 3px solid var(--ea-warn);
  padding: 15px 16px; margin-top: 20px; background: var(--ea-ground);
}
.ea-deadlines h2{
  margin: 0 0 3px; font-size:14px; font-weight:800; letter-spacing:.1em;
  text-transform:uppercase; color: var(--ea-ink);
}
.ea-deadlines__sub{ font-size:11px; color: var(--ea-meta); margin: 0 0 11px; }
.ea-dl{ list-style:none; margin:0; padding:0; }
.ea-dl__i{
  display:grid; grid-template-columns: 1fr auto; gap:10px; align-items:center;
  padding: 10px 0; border-bottom: 1px solid var(--ea-rule);
}
.ea-dl__i:last-child{ border-bottom:0; }
.ea-dl__t{ font-size:14.5px; font-weight:600; color: var(--ea-ink); line-height:1.3; }
.ea-dl__t a{ text-decoration:none; }
.ea-dl__t em{
  font-style:normal; display:block; font-size:11px; font-weight:500;
  color: var(--ea-meta); margin-top:2px;
}
.ea-pill{
  font-size:11px; font-weight:800; letter-spacing:.03em; padding:4px 9px;
  white-space:nowrap; border:1px solid var(--ea-rule);
  color: var(--ea-ink-2); background: var(--ea-surface);
}
.ea-pill--soon{ background: var(--ea-warn-soft); border-color: var(--ea-warn); color: var(--ea-warn); }
.ea-pill--now{ background: var(--ea-down); border-color: var(--ea-down); color:#fff; }
.ea-pill--open{ background: var(--ea-acc-soft); border-color: var(--ea-acc); color: var(--ea-acc); }

/* --------------------------------------------------------------------------
   ΕΙΔΟΠΟΙΗΣΕΙΣ
   -------------------------------------------------------------------------- */
.ea-push{
  display:flex; align-items:center; gap:11px;
  background: var(--ea-acc-soft); border: 1px solid var(--ea-rule);
  padding: 12px 14px; margin-top: 18px;
}
.ea-push__ic{ font-size:19px; line-height:1; }
.ea-push__tx{ flex:1; font-size:13.5px; line-height:1.35; color: var(--ea-ink); font-weight:600; }
.ea-push__tx em{
  font-style:normal; display:block; font-size:11.5px; font-weight:500; color: var(--ea-meta);
}
.ea-push__btn{
  appearance:none; border:1px solid var(--ea-acc); background: var(--ea-acc); color:#fff;
  font: inherit; font-size:12.5px; font-weight:800; padding: 7px 13px;
  cursor:pointer; white-space:nowrap;
}
.ea-push__btn:hover{ filter: brightness(1.1); }

/* --------------------------------------------------------------------------
   ΜΕ ΜΙΑ ΜΑΤΙΑ
   -------------------------------------------------------------------------- */
.ea-stories{ padding: 22px 0 4px; }
.ea-st-nav{ margin-left:auto; display:flex; gap:6px; padding-bottom:6px; flex:0 0 auto; }
.ea-st-arrow{
  appearance:none; border:1px solid var(--ea-rule); background: var(--ea-ground);
  color: var(--ea-ink-2); width:32px; height:32px; cursor:pointer;
  font-size:15px; line-height:1; display:grid; place-items:center;
  transition: border-color .15s, color .15s, opacity .15s;
}
.ea-st-arrow:hover{ border-color: var(--ea-acc); color: var(--ea-acc); }
.ea-st-arrow:focus-visible{ outline:2px solid var(--ea-acc); outline-offset:2px; }
.ea-st-arrow[disabled]{ opacity:.32; cursor:default; }
.ea-st-arrow[disabled]:hover{ border-color: var(--ea-rule); color: var(--ea-ink-2); }

.ea-st-row{
  display:flex; gap:11px; overflow-x:auto; scroll-behavior:smooth;
  padding: 0 var(--ea-pad) 4px; scrollbar-width:none;
}
.ea-st-row::-webkit-scrollbar{ display:none; }
@media (min-width: 900px){ .ea-st-row{ padding: 0 var(--ea-pad-lg) 4px; } }
.ea-st{ flex: 0 0 138px; position:relative; text-decoration:none; display:block; }
@media (min-width: 900px){ .ea-st{ flex-basis: 168px; } }
.ea-st img{
  display:block; width:100%; height:auto; aspect-ratio: 4/5; object-fit: cover;
  border:1px solid var(--ea-rule); background: var(--ea-surface); transition: opacity .18s;
}
.ea-st:hover img{ opacity:.9; }
.ea-st__ttl{
  display:block; padding: 9px 1px 0; color: var(--ea-ink);
  font-size:13px; font-weight:700; line-height:1.3; letter-spacing:-.005em;
}
.ea-st:hover .ea-st__ttl{ color: var(--ea-acc); }
.ea-st__badge{
  position:absolute; top:7px; left:7px; background: rgba(255,255,255,.93);
  color: var(--ea-ink); font-size:10px; font-weight:800; letter-spacing:.04em;
  padding: 3px 6px; font-variant-numeric: tabular-nums;
  box-shadow: 0 1px 3px rgba(0,0,0,.18);
}

/* --------------------------------------------------------------------------
   ΠΛΕΓΜΑ ΚΑΡΤΩΝ
   -------------------------------------------------------------------------- */
/* Τα .ea-grid και .ea-card--stacked ζουν στο base.css —
   τα χρειάζονται και η κατηγορία, η αναζήτηση και το 404. */

/* --------------------------------------------------------------------------
   NEWSLETTER
   -------------------------------------------------------------------------- */
.ea-nl{ background: var(--ea-ink); color: var(--ea-ground); margin-top: 24px; }
.ea-nl__in{ padding-top: 21px; padding-bottom: 21px; }
.ea-nl h2{
  margin: 0 0 7px; font-size:21px; font-weight:800;
  letter-spacing:-.018em; color: var(--ea-ground);
}
.ea-nl p{
  margin: 0 0 14px; font-family: var(--ea-serif);
  font-size:15px; line-height:1.5; color: var(--ea-ground); opacity:.8;
}
.ea-nl__form{ display:flex; gap:8px; }
.ea-nl__form input{
  flex:1; min-width:0; font: inherit; font-size:14px; padding: 11px 12px;
  border: 1px solid transparent; background: var(--ea-ground); color: var(--ea-ink);
}
.ea-nl__form input:focus-visible{ outline: 2px solid var(--ea-acc); outline-offset: 1px; }
.ea-nl__form button{
  appearance:none; border:0; background: var(--ea-acc); color:#fff; font: inherit;
  font-size:14px; font-weight:800; padding: 11px 17px; cursor:pointer;
  white-space:nowrap; transition: filter .15s;
}
.ea-nl__form button:hover{ filter: brightness(1.12); }
.ea-nl small{ display:block; margin-top:9px; font-size:11px; opacity:.55; }

/* ==========================================================================
   ΥΠΟΛΟΓΙΣΤΗΣ
   ========================================================================== */
@media (min-width: 900px){
  .ea-top2{
    display:grid; grid-template-columns: 1.75fr 1fr; gap: 30px;
    padding: 22px var(--ea-pad-lg) 0; align-items:start;
  }
  .ea-slide__fig,
  .ea-slide__fig img{ min-height: 460px; }
  .ea-slide__over{ padding: 90px var(--ea-pad-lg) 68px; }
  .ea-slide__title{
    /* ⚠ ΗΤΑΝ 17ch (bug #33, 25/8): σε γραμματοσειρά 38px βγαίνει 387px, ενώ
       το κάδρο έχει 627px διαθέσιμα και το απόσπασμα από κάτω πιάνει 543px.
       Ο τίτλος στριμωχνόταν σε τρεις κοντές γραμμές και μετά ΚΟΒΟΤΑΝ —
       «Ισπανία : Ελαιόλαδο στα 3» και τέλος. Οι ελληνικοί τίτλοι έχουν
       μακριές λέξεις και δεν χωρούν σε 17 χαρακτήρες τη γραμμή.
       Στα 26ch χωρούν ~78 χαρακτήρες σε τρεις γραμμές — όσο σχεδόν κάθε
       τίτλος ειδήσεων. Το κόψιμο μένει ως δικλείδα για τα ακραία. */
    font-size: 38px; line-height: 1.09; max-width: 26ch; -webkit-line-clamp: 3;
  }
  .ea-slide__lead{
    display:block; margin: 0 0 9px; font-family: var(--ea-serif);
    font-size:17px; line-height:1.45; color: rgba(255,255,255,.86); max-width: 52ch;
  }
  .ea-hero__nav{ padding: 0 var(--ea-pad-lg) 20px; }
  .ea-side{ border-left: 1px solid var(--ea-rule); padding: 0 0 0 24px; }

  /* Ίδιο ύψος στα δύο κουτιά. Ο πίνακας τιμών έχει 4 άρθρα και είναι
     ψηλότερος· χωρίς αυτό, κάτω από τον καιρό έμενε μεγάλο κενό. */
  .ea-tools{ grid-template-columns: 1fr 1fr; gap: 26px; align-items: stretch; }
  .ea-wx{ display:flex; flex-direction:column; }
  /* Η εικόνα είναι το μόνο στοιχείο που μεγαλώνει — τίτλος και σύνδεσμος
     κάθονται στο κάτω μέρος, στην ίδια γραμμή με το τελευταίο άρθρο τιμών. */
  /* flex-basis: 0 — ΟΧΙ auto. Με `auto` η εικόνα έδινε στο κουτί το φυσικό
     της ύψος (~290px) και μετά μεγάλωνε κι άλλο: ο καιρός γινόταν ψηλότερος
     από τις τιμές και η εικόνα τεράστια. Με basis 0 παίρνει ΜΟΝΟ ό,τι
     περισσεύει. Η img είναι absolute ώστε να μη μετράει καθόλου στη διάταξη. */
  .ea-wx__fig{ position: relative; flex: 1 1 0; min-height: 140px; }
  .ea-wx__fig img{
    position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto;
  }

  .ea-grid--3{ grid-template-columns: repeat(3, 1fr); gap: 0 26px; }
  .ea-grid--4{ grid-template-columns: repeat(4, 1fr); gap: 0 24px; }

  .ea-nl__in{
    display:grid; grid-template-columns: 1.05fr 1fr; gap: 30px; align-items:center;
    padding-top: 28px; padding-bottom: 28px;
  }
  .ea-nl h2{ font-size: 25px; }
  .ea-nl p{ margin-bottom: 0; }
}

@media (max-width: 400px){
  .ea-slide__title{ font-size: 24px; -webkit-line-clamp: 5; }
  .ea-slide__fig, .ea-slide__fig img{ min-height: 300px; }
  .ea-slide__over{ padding: 50px var(--ea-pad) 54px; }
  .ea-temps{ grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   ΠΡΟΩΘΟΥΜΕΝΟ ΑΡΘΡΟ

   Δεσμευμένο ύψος: η εικόνα φορτώνει αργότερα, ο χώρος υπάρχει από την αρχή.
   Το «χορηγούμενο» ξεχωρίζει ΟΠΤΙΚΑ (χρυσό), όχι μόνο με λέξη — ο αναγνώστης
   πρέπει να καταλαβαίνει με μια ματιά ότι είναι πληρωμένο.
   -------------------------------------------------------------------------- */
.ea-promo{
  margin-top: 16px;
  border: 1px solid var(--ea-rule);
  border-left: 3px solid var(--ea-acc);
  background: var(--ea-surface);
  /* Μετρημένο 29/8 στο local: 128px σε 1280, 121px σε 375. Το 120 είναι
     δάπεδο, όχι φράχτης — δεν κόβει τίποτα, απλώς κρατά το πλαίσιο αν λείψει
     η εικόνα. Η ΠΡΑΓΜΑΤΙΚΗ αποτροπή μετατόπισης γίνεται από την ίδια την
     εικόνα: βγαίνει με width/height (696×392) ΚΑΙ aspect-ratio 16/10, άρα ο
     browser ξέρει το ύψος πριν καν κατεβεί το αρχείο. */
  min-height: 120px;
}
.ea-promo.is-sponsored{ border-left-color: var(--ea-sponsor, #a9741a); }
.ea-promo__link{
  display: grid; grid-template-columns: 132px 1fr; gap: 13px;
  align-items: center; padding: 11px 13px; text-decoration: none; color: inherit;
}
.ea-promo__fig{ display:block; }
.ea-promo__img{
  display:block; width:100%; height:auto; aspect-ratio: 16/10; object-fit: cover;
}
.ea-promo__txt{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.ea-promo__lbl{
  font-size: 9.5px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase;
  color: var(--ea-acc);
}
.ea-promo.is-sponsored .ea-promo__lbl{ color: var(--ea-sponsor, #a9741a); }
.ea-promo__ttl{
  font-size: 17px; line-height: 1.28; font-weight: 700; color: var(--ea-ink);
}
.ea-promo__link:hover .ea-promo__ttl{ text-decoration: underline; }
.ea-promo__exc{ font-size: 13.5px; line-height: 1.45; color: var(--ea-ink-2); }
.ea-promo__meta{
  font-size: 11.5px; color: var(--ea-meta); text-transform: uppercase; letter-spacing: .05em;
}
@media (max-width: 560px){
  .ea-promo__link{ grid-template-columns: 104px 1fr; gap: 11px; padding: 10px; }
  .ea-promo__ttl{ font-size: 15.5px; }
  .ea-promo__exc{ display: none; }
}

/* --------------------------------------------------------------------------
   ΕΙΔΙΚΗ ΖΩΝΗ (καμπάνια) — inc/campaign.php · template-parts/home/campaign.php

   Μηδέν JavaScript: τα κουμπιά κυλούν με σκέτο overflow, η μπάρα προόδου
   είναι ένα πλάτος σε %. Όλα τα χρώματα από τις μεταβλητές → σωστό και στο
   σκοτεινό θέμα χωρίς δεύτερο σετ κανόνων.
   Εικόνες: 16:9 με width/height από το WordPress → CLS 0.
   -------------------------------------------------------------------------- */
.ea-cmp{ margin-top: 22px; }
.ea-cmp__box{
  background: var(--ea-surface);
  border: 1px solid var(--ea-rule); border-top: 3px solid var(--ea-acc);
}

/* — κεφαλίδα — */
.ea-cmp__head{
  display:flex; align-items:flex-start; flex-wrap:wrap; gap: 10px 14px;
  padding: 15px 16px 13px;
}
.ea-cmp__id{ flex: 1 1 250px; min-width: 0; }
.ea-cmp__eyebrow{
  display:block; font-size:11px; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; color: var(--ea-acc);
}
.ea-cmp__title{
  margin: 4px 0 0; font-size: 25px; line-height: 1.1; font-weight: 800;
  letter-spacing: -.022em; text-wrap: balance;
}
.ea-cmp__title a{ color: var(--ea-ink); text-decoration: none; }
.ea-cmp__title a:hover{ color: var(--ea-acc); }
.ea-cmp__text{
  margin: 7px 0 0; max-width: 62ch; font-family: var(--ea-serif);
  font-size: 15px; line-height: 1.45; color: var(--ea-ink-2);
}
/* Στο κινητό ο χορηγός πέφτει κάτω από τον υπότιτλο — στοίχιση αριστερά,
   αλλιώς κρέμεται μόνος του δεξιά (μετρήθηκε 13/9 στα 375px). */
.ea-cmp__head .ea-sponsor{ margin-left: 0; padding: 0; }
@media (min-width: 900px){ .ea-cmp__head .ea-sponsor{ margin-left: auto; padding: 3px 0 0; } }

.ea-cmp__body{ display: grid; }
.ea-cmp__aside{ padding: 0 16px 15px; min-width: 0; }

/* — αντίστροφη μέτρηση —
   Πλέγμα: [αριθμός] [ετικέτα / μονάδα], από κάτω μπάρα & ημερομηνίες. */
.ea-cmp__count{
  display:grid; grid-template-columns: auto 1fr; column-gap: 13px; align-items: center;
  background: var(--ea-acc); color: var(--ea-ground);
  padding: 12px 14px 11px;
}
.ea-cmp__count.is-soon{ background: var(--ea-warn); }
.ea-cmp__count.is-now { background: var(--ea-down); color: #fff; }
.ea-cmp__lbl{
  grid-column: 2; grid-row: 1; align-self: end;
  font-size: 11.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  line-height: 1.25; opacity: .92;
}
.ea-cmp__num{
  grid-column: 1; grid-row: 1 / span 2;
  font-size: 46px; line-height: .92; font-weight: 800;
  font-variant-numeric: tabular-nums; letter-spacing: -.035em;
}
.ea-cmp__num--word{ font-size: 28px; letter-spacing: -.02em; }
.ea-cmp__unit{
  grid-column: 2; grid-row: 2; align-self: start;
  font-size: 19px; font-weight: 800; line-height: 1.2;
}
.ea-cmp__bar{
  grid-column: 1 / -1; display:block; height: 4px; margin-top: 10px;
  background: color-mix(in srgb, currentColor 24%, transparent);
}
.ea-cmp__bar i{ display:block; height:100%; background: currentColor; }
.ea-cmp__dates{
  grid-column: 1 / -1; display:block; margin-top: 9px; padding-top: 8px;
  border-top: 1px solid color-mix(in srgb, currentColor 26%, transparent);
  font-size: 12.5px; font-weight: 600; line-height: 1.35;
}

/* — κουμπιά θεματικών — στο κινητό κυλούν, δεν σπάνε σε πέντε γραμμές */
.ea-cmp__chips-h{
  margin: 15px 0 7px; font-size: 11px; font-weight: 800; letter-spacing: .1em;
  text-transform: uppercase; color: var(--ea-meta);
}
.ea-cmp__chips{
  display:flex; gap: 8px; overflow-x: auto; scroll-snap-type: x proximity;
  scrollbar-width: none; margin: 0 -16px; padding: 0 16px 2px;
}
.ea-cmp__chips::-webkit-scrollbar{ display:none; }
.ea-cmp__chip{
  flex: 0 0 auto; scroll-snap-align: start;
  display:flex; align-items:center; justify-content: space-between; gap: 10px;
  min-height: 44px;                                 /* στόχος αφής */
  padding: 0 9px 0 12px; background: var(--ea-ground);
  border: 1px solid var(--ea-rule); color: var(--ea-ink); text-decoration: none;
  font-size: 14px; font-weight: 700; line-height: 1.2; white-space: nowrap;
  transition: border-color .15s, color .15s;
}
.ea-cmp__chip b{
  font-size: 12px; font-weight: 800; font-variant-numeric: tabular-nums;
  color: var(--ea-acc); background: var(--ea-acc-soft); padding: 3px 6px;
}
.ea-cmp__chip:hover{ border-color: var(--ea-acc); color: var(--ea-acc); }
.ea-cmp__chip:focus-visible{ outline: 2px solid var(--ea-acc); outline-offset: 1px; }

/* — άρθρα — */
.ea-cmp__news{
  background: var(--ea-ground); border-top: 1px solid var(--ea-rule);
  padding: 15px 16px 0; min-width: 0;
}
.ea-cmp__lead .ea-card--stacked{ border-bottom: 1px solid var(--ea-rule); padding-bottom: 14px; }
.ea-cmp__lead .ea-card--stacked .ea-card__img img{ aspect-ratio: 16/9; }
.ea-cmp__lead .ea-card__ttl{ font-size: 20px; line-height: 1.22; }
/* Κινητό: χωρίς απόσπασμα στο πρώτο άρθρο — η ζώνη έπιανε 1.151px (13/9).
   Ο τίτλος και η εικόνα αρκούν· το απόσπασμα μένει στον υπολογιστή. */
@media (max-width: 899px){ .ea-cmp__lead .ea-card__lead{ display: none; } }
.ea-cmp__list .ea-card{ padding: 12px 0; }
.ea-cmp__list .ea-card:last-child{ border-bottom: 1px solid var(--ea-rule); }
.ea-cmp__cta{
  display:flex; align-items:center; justify-content:center; gap: 6px;
  min-height: 50px; margin: 0 -16px; color: var(--ea-acc); text-decoration: none;
  font-size: 14px; font-weight: 800; letter-spacing: .01em;
  transition: background .15s;
}
.ea-cmp__cta:hover{ background: var(--ea-acc-soft); color: var(--ea-acc); }
.ea-cmp__cta:focus-visible{ outline: 2px solid var(--ea-acc); outline-offset: -2px; }

@media (min-width: 900px){
  .ea-cmp{ margin-top: 30px; }
  .ea-cmp__head{ padding: 20px 26px 16px; }
  .ea-cmp__title{ font-size: 31px; }
  .ea-cmp__text{ font-size: 16px; }

  .ea-cmp__body{ grid-template-columns: 330px 1fr; }
  .ea-cmp__aside{ padding: 0 26px 24px; }
  .ea-cmp__num{ font-size: 56px; }
  .ea-cmp__num--word{ font-size: 32px; }

  .ea-cmp__chips{
    display:grid; grid-template-columns: 1fr 1fr; overflow: visible;
    margin: 0; padding: 0;
  }
  .ea-cmp__chip{ white-space: normal; font-size: 13.5px; }

  .ea-cmp__news{ border-top: 0; border-left: 1px solid var(--ea-rule); padding: 20px 26px 0; }
  .ea-cmp__lead .ea-card--stacked{
    display:grid; grid-template-columns: 1.1fr 1fr; gap: 0 24px; align-items: start;
  }
  .ea-cmp__lead .ea-card--stacked .ea-card__img img{ margin-bottom: 0; }
  .ea-cmp__lead .ea-card__ttl{ font-size: 23px; line-height: 1.18; }
  .ea-cmp__list{ display:grid; grid-template-columns: 1fr 1fr; gap: 0 26px; }
  .ea-cmp__list .ea-card:nth-last-child(2):nth-child(odd){ border-bottom: 1px solid var(--ea-rule); }
  .ea-cmp__cta{ justify-content: flex-end; margin: 0; min-height: 48px; }
  .ea-cmp__cta:hover{ background: transparent; text-decoration: underline; text-underline-offset: 3px; }
}
