/* =====================  ΕΚΔΗΛΩΣΕΙΣ  ===================== */
.ev-intro {
  display: block; text-align: center; max-width: 88ch;
  margin: clamp(28px, 3vw, 56px) auto 0;
  font-size: clamp(15px, .94vw, 18px); line-height: 1.7; color: var(--c-secondary);
}

/* Δύο κατοπτρικές ενότητες: εικόνα full-bleed από τη μία πλευρά, λίστα από την άλλη */
.evsplit {
  display: grid; align-items: center;
  gap: clamp(24px, 3vw, 64px);
  grid-template-columns: 1fr 1fr;
  padding-block: clamp(40px, 4.5vw, 88px);
}
.evsplit__media img { width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 16 / 11; }
.evsplit__body { padding-inline: var(--page-margin); max-width: 720px; }
/* Το grid-row: 1 δεν είναι περιττό.
   Στο --right η εικόνα είναι ΠΡΩΤΗ στο markup αλλά μπαίνει στη 2η στήλη.
   Η αυτόματη τοποθέτηση του grid δεν γυρίζει ποτέ πίσω, οπότε το κείμενο —
   που έρχεται δεύτερο και ζητά την 1η στήλη — έπεφτε σε ΔΕΥΤΕΡΗ γραμμή,
   δηλαδή από κάτω αντί για δίπλα. Καρφώνοντας τη γραμμή, κάθονται μαζί. */
.evsplit--left  .evsplit__media { grid-column: 1; grid-row: 1; }
.evsplit--left  .evsplit__body  { grid-column: 2; grid-row: 1; }
.evsplit--right .evsplit__media { grid-column: 2; grid-row: 1; }
.evsplit--right .evsplit__body  { grid-column: 1; grid-row: 1; justify-self: end; }

.evlist { list-style: none; margin: clamp(20px, 2vw, 34px) 0; padding: 0; display: grid; gap: clamp(18px, 1.8vw, 30px); }
.evlist__item { position: relative; padding-left: 62px; }
/* Η παύλα πριν από κάθε τίτλο, όπως στο design */
.evlist__item::before {
  content: ""; position: absolute; left: 0; top: .7em; width: 40px; height: 1px;
  background: var(--c-gold);
}
.evlist__title { margin: 0 0 6px; font-family: var(--f-sans); font-size: clamp(15px, 1.04vw, 20px); font-weight: 600; color: var(--c-white); }
.evlist__text { margin: 0; font-size: clamp(14px, .89vw, 17px); line-height: 1.7; color: var(--c-secondary); }

/* Κάτοψη */
.evplan { padding-block: clamp(40px, 4.5vw, 88px); }
.evplan__frame { overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
.evplan__img { width: 100%; height: auto; display: block; background: #eef4f6; }
@media (max-width: 899px) {
  /* Ελάχιστο πλάτος ώστε να διαβάζονται οι ενδείξεις· ο χρήστης σύρει. */
  .evplan__img { min-width: 760px; }
}
.evplan__missing {
  margin: 0; padding: clamp(40px, 6vw, 90px) 24px; text-align: center;
  border: 1px dashed rgb(255 255 255 / .25); color: var(--c-secondary);
  font-size: 15px;
}

/* Τοποθεσία */
.evloc { padding-block: clamp(40px, 4.5vw, 88px); }
.evloc__grid { display: grid; gap: clamp(24px, 3vw, 56px); grid-template-columns: 1fr 1.35fr; align-items: start; }
.evloc__text { border: 1px solid rgb(255 255 255 / .12); padding: clamp(22px, 2.4vw, 40px); }
.evloc__text p { margin: 0 0 1em; font-size: clamp(14px, .89vw, 17px); line-height: 1.75; color: var(--c-white); }
.evloc__text p:last-of-type { margin-bottom: clamp(18px, 2vw, 30px); }
.evloc__text strong { font-weight: 600; }

/* Gallery */
.evgal { padding-block: clamp(40px, 4.5vw, 88px); }
.evgal__grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: clamp(12px, 1.4vw, 26px);
  grid-template-columns: repeat(3, 1fr);
}
.evgal__grid img { width: 100%; aspect-ratio: 576 / 389; object-fit: cover; display: block; }

@media (max-width: 899px) {
  .evsplit { grid-template-columns: 1fr; }
  /* Σε μία στήλη ξεκαρφώνουμε τη γραμμή, αλλιώς εικόνα και κείμενο θα
     στοιβάζονταν το ένα πάνω στο άλλο. */
  .evsplit--left .evsplit__media, .evsplit--right .evsplit__media,
  .evsplit--left .evsplit__body,  .evsplit--right .evsplit__body { grid-column: 1; grid-row: auto; }
  .evsplit--right .evsplit__body { justify-self: start; }
  .evloc__grid { grid-template-columns: 1fr; }
  .evgal__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .evgal__grid { grid-template-columns: 1fr; }
  .evlist__item { padding-left: 40px; }
  .evlist__item::before { width: 24px; }
}

/* Ο στόχος του «Ζητήστε προσφορά».
   Το header είναι sticky, οπότε χωρίς scroll-margin ο τίτλος της φόρμας
   θα κατέληγε από κάτω του. Το ύψος του header αλλάζει στο κινητό. */
#ev-form { scroll-margin-top: calc(var(--header-h-mobile) + 16px); }
@media (min-width: 900px) {
  #ev-form { scroll-margin-top: calc(var(--header-h) + 24px); }
}