/* Ι.Ν. ΚΟΙΜΗΣΕΩΣ ΤΗΣ ΘΕΟΤΟΚΟΥ, 40 ΕΚΚΛΗΣΙΕΣ — ΚΟΜΜΑΤΙ A1 (12/10/2026): η πρώτη οθόνη: ο ναός ολόκληρος, το γυάλινο πλαίσιο «Σήμερα», ένα κόκκινο κουμπί (μαζί με το proti.js).
   Φορτώνεται ΜΟΝΟ στη δημόσια σελίδα, μετά το selida.css.
   Χρώματα μόνο από το xromata.css (η γραμμή από κάτω μένει πρώτη). Κάθε κανόνας μέσα σε «@media screen».

   Ο λόγος του Bill (12/10/2026): «αυτο που θελει ο κοσμος ειναι να βλεπουν το ιμηδιαφανο πλαισιο με το προογραμμα και το cta κουμπι … εκεινο το
   κοκκινο»· «η εκκλησια ειναι ωραι να ειναι μεγαλη αλλα οχι τοσο zoomed»· «δεν χρειαζεται κατι στο κινητο» (κάτω από το όνομα)· «το πως εμφανιζεται
   μισο διαφανες το πρωτο ειναι καλυτερο».

   ΠΩΣ ΕΙΝΑΙ ΣΤΗΜΕΝΗ. Κάθε κανόνας εδώ θέλει την κλάση .proti-nea πάνω στην ενότητα (τη γράφει το enoria.html, μαζί με τη φωτογραφία,
   το κουτί .proti-omada και το κουμπί· το proti.js μόνο μετρά).
     στοίβα   (ως 900px πλάτος, ή παράθυρο πιο ψηλό από 5:4): ο ναός πάνω, ολόκληρος· από κάτω του, πάνω στην πλατεία, ετικέτα, όνομα, πλαίσιο, κουμπί.
     πλάτος   (από 901px και πλαγιαστό παράθυρο): ο ναός δεξιά, ολόκληρος· αριστερά, πάνω στα πεύκα, όνομα, ετικέτα, πρόταση, πλαίσιο, κουμπί.
   ΤΑ ΔΥΟ ΚΑΔΡΑ (data-kadro στην ενότητα): «konta» = όσο μεγάλος χωρά· «anoixto» = ένα βήμα πιο πίσω.

   Οι μετρήσεις (--proti-…) ορίζονται εδώ και μόνο εδώ· το --proti-keimeno το γράφει το proti.js (το ύψος των γραμμάτων). Κάθε var() τους έχει
   τιμή ανάγκης, για να στέκει η οθόνη και πριν τρέξει το σενάριο.
   Το όρθιο κόψιμο (naos-katharo-orthio, 3450×4234 του μητρικού): ο ναός πιάνει το 46% του πλάτους του, με τον άξονά του στη μέση· οι σταυροί στο
   21,3% του ύψους του, το τελευταίο σκαλί στο 61,2%· ύψος ναού = 1,0655 × πλάτος ναού. */
@import url("xromata.css") screen;

@media screen {
  /* ───────── ΚΟΙΝΑ ───────── */
  .iroas.proti-nea { display: block; min-height: 0; overflow: hidden; }
  .iroas.proti-nea .foto { inset: 0; height: auto; bottom: 0; }
  .iroas.proti-nea .foto picture { display: contents; }
  /* η φωτογραφία ΣΤΕΚΕΤΑΙ: ούτε ζουμ ούτε μετατόπιση· μόνο το φως της, μία φορά (iroas-fos, 650ms, του dimosia.css) */
  .iroas.proti-nea .foto img { transform: none; filter: none; }

  .iroas.proti-nea .wrap { display: flex; flex-direction: column; justify-content: flex-end; gap: 0; grid-template-columns: none; grid-template-rows: none; }
  .iroas.proti-nea .wrap::before { content: none; }
  .iroas.proti-nea .wrap > div:first-child { display: flex; flex-direction: column; flex-wrap: nowrap; padding-top: 0; }
  .iroas.proti-nea .wrap > div:first-child > * { flex: none; }

  /* ΤΟ ΚΟΥΤΙ: πλαίσιο και κουμπί, ένας στόχος. Ο σύνδεσμος του κουμπιού απλώνεται (::after) πάνω σε όλο το κουτί. */
  .proti-omada { position: relative; display: flex; flex-direction: column; }
  /* ΤΟ ΔΕΥΤΕΡΟ ΠΕΠΛΟ ΜΟΝΟ ΠΑΝΩ ΑΠΟ ΤΟ ΠΛΑΙΣΙΟ: η χρυσή ετικέτα και το όνομα θέλουν περισσότερο σκούρο από το γυαλί. Κρέμεται από την κορυφή του
     πλαισίου προς τα πάνω και σβήνει μέσα στην πρώτη του γραμμή (την ημερομηνία): πίσω από τις σειρές του πλαισίου μένει ΕΝΑ πέπλο, για να φαίνεται η εικόνα από μέσα του. */
  .iroas.proti-nea .wrap > div:first-child { position: relative; z-index: 0; }
  .proti-omada::before {
    content: ""; position: absolute; z-index: -1; left: -100vw; right: -100vw; bottom: calc(100% - 46px); height: 226px; pointer-events: none;
    background: linear-gradient(180deg, transparent 0, var(--gyali-peplo) 20%, var(--gyali-peplo) 78%, transparent 100%);
  }
  .proti-omada .proti-koumpi::after { content: ""; position: absolute; inset: 0; border-radius: var(--gyali-aktina); }
  .iroas.proti-nea .proti-koumpi:focus-visible { outline: none; }
  .iroas.proti-nea .proti-koumpi:focus-visible::after { outline: 3px solid var(--xryso-fos); outline-offset: 3px; }

  /* ΤΟ ΓΥΑΛΙ. Το υλικό του δείγματος της 13/9 (λευκό γέμισμα, θόλωμα 8px, λεπτό φωτεινό περίγραμμα), με το φωτεινό γέμισμα (16%)· πίσω του ΕΝΑ
     μόνο σκούρο πέπλο, ποτέ κόκκινο: η πλατεία, ο δρόμος και τα πεύκα φαίνονται θολά από μέσα του. Για να διαβάζονται πάνω σε τόσο φως, ΟΛΑ τα
     γράμματα του πλαισίου είναι τα υπόλευκα (--gyali-keimeno)· το χρυσό μένει στο περίγραμμα κάτω από τον δείκτη. */
  .iroas.proti-nea .simera {
    grid-column: auto; grid-row: auto; width: auto; margin: 0;
    padding: 12px 16px 10px;
    background: var(--gyali-fonto-fotino);
    border: 1px solid var(--gyali-perigramma); border-radius: var(--gyali-aktina);
    -webkit-backdrop-filter: blur(var(--gyali-tholoma)); backdrop-filter: blur(var(--gyali-tholoma));
    color: var(--gyali-keimeno);
    animation: iroas-anodos 500ms cubic-bezier(.22, .61, .36, 1) both; animation-delay: 200ms;
    transition: border-color 420ms cubic-bezier(.22, .61, .36, 1);
  }
  .proti-omada:hover .simera, .proti-omada:focus-within .simera { border-color: var(--gyali-etiketa); }
  .iroas.proti-nea .simera h3 { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 2px 14px; font-size: 23px; line-height: 1.15; color: var(--gyali-keimeno); }
  .iroas.proti-nea .simera h3 small { font-family: var(--etiketa); font-size: 15px; letter-spacing: .1em; text-transform: uppercase; color: var(--gyali-keimeno); }
  /* ΤΟ ΕΣΩΤΕΡΙΚΟ ΤΟΥ ΠΛΑΙΣΙΟΥ, σε δύο μορφές (25/10/2026, ο Bill 00:26: «Βάλε το Α και φτιάξε και το Β…»). Το ζωγραφίζει ο διακομιστής και το
     κρατά σωστό το simera.js· τα σχέδια του mediatab-rebuild-2010/ekklisia-simera, με τα ίδια μεγέθη. Όλες οι κλάσεις αρχίζουν με «sm-».
     ΤΑ ΓΡΑΜΜΑΤΑ ΠΑΝΩ ΣΤΟ ΓΥΑΛΙ μένουν όλα τα υπόλευκα (--gyali-keimeno), όπως όλο το πλαίσιο από τις 12/10: πάνω σε φωτογραφία ούτε το χρυσό ούτε το δεύτερο
     γκρι διαβάζονται στο 4,5· το χρυσό του σχεδίου μένει στις κουκκίδες, στη γραμμή και στο περίγραμμα. Και ό,τι διαβάζεται 16px και πάνω (7/10/2026).
     Ο ΠΑΛΜΟΣ της κουκκίδας που «τελείται τώρα» τον παίζει το simera.js (element.animate): η πρώτη οθόνη δεν έχει δικά της καρέ στο φύλλο.
     ΚΟΙΝΑ: η ημερομηνία, η εορτή, η μικρή χρυσή λέξη («Επόμενη · σε 25 λεπτά», «Τελείται τώρα»), ο εφημέριος και τα ωράρια. */
  .iroas.proti-nea .simera { border-color: var(--xryso-akri); }
  /* ΤΟ ΚΟΥΤΙ ΜΕΝΕΙ ΕΝΑΣ ΣΥΝΔΕΣΜΟΣ, ΤΟ ΔΙΠΛΩΜΑ ΤΟΥ Β ΑΝΟΙΓΕΙ ΣΤΗ ΘΕΣΗ ΤΟΥ: το πλαίσιο στέκεται πάνω από τον απλωμένο σύνδεσμο του κουμπιού αλλά δεν πιάνει
     κανένα πάτημα (το πάτημα περνά στον σύνδεσμο, όπως πριν)· μόνο η γραμμή του διπλώματος πιάνει το δικό της. */
  .iroas.proti-nea .simera { position: relative; z-index: 1; pointer-events: none; }
  .iroas.proti-nea .simera summary { pointer-events: auto; }
  .iroas.proti-nea .proti-omada:is(:hover, :focus-within) .simera { border-color: var(--gyali-etiketa); }
  .iroas.proti-nea .simera :is(p, ol, dl, dd) { margin: 0; }
  .iroas.proti-nea .simera .sm-eort { margin-top: 6px; font-size: 16px; line-height: 1.35; }
  .iroas.proti-nea .simera .sm-eort b { font-weight: 400; font-style: italic; color: var(--gyali-keimeno); }
  .iroas.proti-nea .simera .sm-pin { flex: none; width: 11px; height: 15px; margin-right: 7px; vertical-align: -2px; }
  .iroas.proti-nea .simera .sm-nw { white-space: nowrap; }
  .iroas.proti-nea .simera .sm-lexi { display: flex; align-items: center; gap: 8px; font: 400 13px/1.25 var(--etiketa); letter-spacing: .12em; text-transform: uppercase; color: var(--gyali-keimeno); }
  .iroas.proti-nea .simera .sm-lexi::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--xryso-fos); }
  .iroas.proti-nea .simera .sm-lexi.sm-ola::before { background: var(--gyali-keimeno); opacity: .6; }
  .iroas.proti-nea .simera .sm-lexi.sm-ola { color: var(--gyali-keimeno); }
  .iroas.proti-nea .simera .sm-keno { margin-top: 9px; padding-top: 9px; border-top: 1px solid var(--gyali-grammi); font-size: 17px; line-height: 1.35; }
  .iroas.proti-nea .simera .st-egine { opacity: .5; }
  /* ο εφημέριος και τα ωράρια, ετικέτα και τιμή */
  .iroas.proti-nea .simera .sm-info { display: grid; gap: 5px; margin-top: 10px; padding-top: 9px; border-top: 1px solid var(--gyali-perigramma); }
  .iroas.proti-nea .simera .sm-info > div { display: grid; grid-template-columns: 92px minmax(0, 1fr); column-gap: 12px; align-items: baseline; }
  .iroas.proti-nea .simera .sm-info dt { font: 400 13px/1.3 var(--etiketa); letter-spacing: .1em; text-transform: uppercase; color: var(--gyali-keimeno); }
  .iroas.proti-nea .simera .sm-info dd { font-size: 16px; line-height: 1.35; color: var(--gyali-keimeno); }
  .iroas.proti-nea .simera .sm-info .sm-iereas dd { font: 400 19px/1.2 var(--titlos); }
  .iroas.proti-nea .simera .sm-info.sm-dyo { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 10px 14px; }
  .iroas.proti-nea .simera .sm-info.sm-dyo > div { display: block; }
  .iroas.proti-nea .simera .sm-info.sm-dyo > .sm-platy { grid-column: 1 / -1; }
  .iroas.proti-nea .simera .sm-info.sm-dyo dd { margin-top: 2px; }

  /* Α · Η ΓΡΑΜΜΗ ΤΗΣ ΜΕΡΑΣ: οι ακολουθίες πάνω σε μια κάθετη γραμμή· όσες έγιναν σβήνουν, η επόμενη ανάβει χρυσή */
  .iroas.proti-nea .simera .sm-topos-enas { display: flex; align-items: center; margin-top: 6px; font-size: 16px; color: var(--gyali-keimeno); }
  .iroas.proti-nea .simera .sm-gr { list-style: none; margin: 9px 0 0; padding: 2px 0 0; border-top: 1px solid var(--gyali-grammi); }
  .iroas.proti-nea .simera .sm-gr li { position: relative; display: grid; grid-template-columns: 50px 22px minmax(0, 1fr); column-gap: 8px; padding: 8px 0; border: 0; font-size: 17px; line-height: 1.3; }
  .iroas.proti-nea .simera .sm-gr li::before { content: ""; position: absolute; left: 68.5px; top: 0; bottom: 0; width: 1px; background: var(--gyali-perigramma); }
  .iroas.proti-nea .simera .sm-gr li:first-child::before { top: 19px; }
  .iroas.proti-nea .simera .sm-gr li:last-child::before { bottom: calc(100% - 19px); }
  .iroas.proti-nea .simera .sm-gr li:only-child::before { content: none; }
  .iroas.proti-nea .simera .sm-gr time { font: 400 17px/1.3 var(--etiketa); font-variant-numeric: tabular-nums; text-align: right; }
  .iroas.proti-nea .simera :is(.sm-gr, .sm-mikri) time small { display: block; font-size: 16px; color: var(--gyali-keimeno); }
  .iroas.proti-nea .simera .sm-kouk { position: relative; }
  .iroas.proti-nea .simera .sm-kouk::after { content: ""; position: absolute; left: 50%; top: 7px; width: 9px; height: 9px; margin-left: -4.5px; border-radius: 50%; background: var(--sm-kouk-fonto); border: 1.5px solid var(--sm-kouk-akri); box-sizing: border-box; }
  .iroas.proti-nea .simera .st-egine .sm-kouk::after { background: var(--sm-kouk-akri); }
  .iroas.proti-nea .simera :is(.st-epomeni, .st-tora) .sm-kouk::after { top: 5px; width: 13px; height: 13px; margin-left: -6.5px; background: var(--xryso-fos); border-color: var(--xryso-fos); box-shadow: 0 0 0 5px var(--xryso-alos); }
  .iroas.proti-nea .simera .sm-on { display: block; }
  .iroas.proti-nea .simera .sm-gr :is(.st-epomeni, .st-tora) .sm-on { margin-top: 3px; font: 400 21px/1.15 var(--titlos); }
  .iroas.proti-nea .simera .sm-topos { display: flex; align-items: center; margin-top: 2px; font-size: 16px; color: var(--gyali-keimeno); }
  .iroas.proti-nea .simera .sm-gr + .sm-ola { margin-top: 4px; }

  /* Β · Η ΕΠΟΜΕΝΗ ΠΡΩΤΑ: μεγάλη μόνο η ακολουθία που έρχεται· οι άλλες διπλώνουν και ανοίγουν στη θέση τους (ένα <details>) */
  .iroas.proti-nea .simera .sm-kyria { margin-top: 10px; padding-top: 11px; border-top: 1px solid var(--gyali-grammi); }
  .iroas.proti-nea .simera .sm-kyria-grammi { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 14px; align-items: baseline; margin-top: 7px; }
  .iroas.proti-nea .simera .sm-kyria-grammi b { font: 400 38px/1 var(--titlos); font-variant-numeric: tabular-nums; }
  .iroas.proti-nea .simera .sm-kyria-grammi span { font: 400 23px/1.15 var(--titlos); }
  .iroas.proti-nea .simera .sm-kyria-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 14px; margin-top: 7px; font-size: 16px; color: var(--gyali-keimeno); }
  .iroas.proti-nea .simera .sm-kyria-meta:empty { display: none; }
  .iroas.proti-nea .simera .sm-kyria-meta span { display: inline-flex; align-items: center; }
  .iroas.proti-nea .simera .sm-kyria-ola { margin-top: 6px; font: 400 22px/1.2 var(--titlos); }
  .iroas.proti-nea .simera .sm-ptyxi { margin-top: 12px; border: 1px solid var(--gyali-perigramma); border-radius: 6px; background: var(--sm-ptyxi-fonto); interpolate-size: allow-keywords; }
  .iroas.proti-nea .simera .sm-ptyxi > summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2px 12px; padding: 10px 14px; list-style: none; cursor: pointer; color: var(--gyali-keimeno); }
  .iroas.proti-nea .simera .sm-ptyxi > summary::-webkit-details-marker { display: none; }
  .iroas.proti-nea .simera .sm-ptyxi > summary:focus-visible { outline: 3px solid var(--xryso-fos); outline-offset: 2px; border-radius: 6px; }
  .iroas.proti-nea .simera .sm-p-titlos { font: 400 17px/1.25 var(--etiketa); letter-spacing: .04em; }
  .iroas.proti-nea .simera .sm-p-anoixto, .iroas.proti-nea .simera .sm-ptyxi[open] .sm-p-kleisto { display: none; }
  .iroas.proti-nea .simera .sm-ptyxi[open] .sm-p-anoixto { display: inline; }
  .iroas.proti-nea .simera .sm-p-ores { grid-column: 1; font: 400 16px/1.3 var(--etiketa); letter-spacing: .03em; color: var(--gyali-keimeno); font-variant-numeric: tabular-nums; }
  .iroas.proti-nea .simera .sm-ptyxi[open] .sm-p-ores { display: none; }
  .iroas.proti-nea .simera .sm-velaki { grid-row: 1 / 3; grid-column: 2; width: 9px; height: 9px; margin: 0 4px 4px; border-right: 1.5px solid; border-bottom: 1.5px solid; transform: rotate(45deg); transition: transform .35s cubic-bezier(.22, .61, .36, 1); }
  .iroas.proti-nea .simera .sm-ptyxi[open] .sm-velaki { transform: translateY(4px) rotate(-135deg); }
  .iroas.proti-nea .simera .sm-ptyxi::details-content { height: 0; overflow: clip; transition: height .4s cubic-bezier(.22, .61, .36, 1), content-visibility .4s allow-discrete; }
  .iroas.proti-nea .simera .sm-ptyxi[open]::details-content { height: auto; }
  .iroas.proti-nea .simera .sm-mikri { list-style: none; margin: 0; padding: 0 14px 4px; }
  .iroas.proti-nea .simera .sm-mikri li { display: grid; grid-template-columns: 50px minmax(0, 1fr); column-gap: 14px; align-items: baseline; padding: 7px 0; border-top: 1px solid var(--gyali-grammi); font-size: 17px; line-height: 1.3; }
  .iroas.proti-nea .simera .sm-mikri time { font: 400 17px/1.3 var(--etiketa); font-variant-numeric: tabular-nums; text-align: right; }
  .iroas.proti-nea .simera .sm-mikri .sm-lexi { margin-bottom: 2px; }

  /* ΤΟ ΕΝΑ ΚΟΥΜΠΙ: το κόκκινο του ναού, γεμάτο, με τα υπόλευκα γράμματα του. Έρχεται μόνο με διαφάνεια (iroas-fos), ποτέ με μετατόπιση: ένα
     transform πάνω του θα έκλεινε τον απλωμένο σύνδεσμο μέσα στο κουμπί και το πλαίσιο δεν θα πατιόταν. */
  .iroas.proti-nea .drasi { display: flex; grid-column: auto; grid-row: auto; flex-direction: column; align-items: stretch; gap: 0; margin: 12px 0 0; animation: iroas-fos 500ms cubic-bezier(.22, .61, .36, 1) both; animation-delay: 300ms; }
  .iroas.proti-nea .proti-koumpi { justify-content: center; gap: 12px; min-height: 52px; padding: 12px 22px; background: var(--kokkino-vathy); border: 1px solid var(--kokkino-vathy); color: var(--fyllo); font-size: 18px; letter-spacing: .06em; white-space: nowrap; transition: background-color 420ms cubic-bezier(.22, .61, .36, 1), border-color 420ms cubic-bezier(.22, .61, .36, 1); }
  .proti-omada:hover .proti-koumpi { filter: none; background: var(--kokkino-nyxta); border-color: var(--kokkino-nyxta); }
  .iroas.proti-nea .proti-koumpi:active { background: var(--kokkino-nyxta); border-color: var(--kokkino-nyxta); }
  .proti-velos { display: inline-block; font-family: var(--keimeno); letter-spacing: 0; transition: transform 420ms cubic-bezier(.22, .61, .36, 1); }
  .proti-omada:hover .proti-velos { transform: translateX(4px); }

  /* ───────── ΣΤΟΙΒΑ: κινητό, όρθιο τάμπλετ ───────── */
  @media not all and (min-width: 901px) and (min-aspect-ratio: 5/4) {
    .iroas.proti-nea {
      --proti-megisto: 92vw;
      /* (24/10/2026, ο Bill: «όταν γράφουν πολλά η εικόνα γίνεται μικρή και τετράγωνη· πρέπει αυτά να πηγαίνουν πιο κάτω») η ενότητα ψηλώνει όσο
         χρειάζεται για να χωρά ο ναός ΣΤΟ ΠΛΗΡΕΣ ΤΟΥ ΜΕΓΕΘΟΣ πάνω από τα γράμματα: ο ναός έχει πάντα το ίδιο μέγεθος, όσες ακολουθίες κι αν έχει η μέρα,
         και το πλαίσιο με το κουμπί πάνε από κάτω (και κάτω από την πρώτη οθόνη, αν χρειαστεί). */
      --proti-ypsos: max(100vh - 73px, var(--proti-keimeno, 400px) + var(--proti-megisto, 92vw) * 1.0655 + 22px);
      --proti-eleythero: calc(var(--proti-ypsos, 100vh) - var(--proti-keimeno, 400px));
      /* το ύψος του ναού: όσο χωρά πάνω από τα γράμματα (8px αέρας πάνω από τους σταυρούς, 8px κάτω από τα σκαλιά), ως το πλάτος του κάδρου */
      --proti-naos: min(var(--proti-megisto, 92vw) * 1.0655, var(--proti-eleythero, 50vh) - 22px);
      min-height: var(--proti-ypsos, 100vh);
    }
    .iroas.proti-nea[data-kadro="anoixto"] { --proti-megisto: 66vw; }
    @supports (height: 100svh) {
      .iroas.proti-nea { --proti-ypsos: max(100svh - 73px, var(--proti-keimeno, 400px) + var(--proti-megisto, 92vw) * 1.0655 + 22px); }
    }
    /* η εικόνα έχει πλάτος = ύψος ναού × 2,0403 και ύψος = ύψος ναού × 2,5039· το τελευταίο σκαλί (61,2% του ύψους της) κάθεται 8px πάνω από
       την ετικέτα. Το κάτω άκρο της σβήνει μέσα στο σκούρο της ενότητας: εκεί τελειώνει το ίδιο το αρχείο. */
    .iroas.proti-nea .foto img {
      position: absolute; max-width: none; object-fit: fill;
      width: calc(var(--proti-naos, 80vw) * 2.0403); height: calc(var(--proti-naos, 80vw) * 2.5039);
      left: calc(50% - var(--proti-naos, 80vw) * 1.02015);
      top: calc(var(--proti-eleythero, 50vh) - 14px - var(--proti-naos, 80vw) * 1.5324);
      -webkit-mask-image: linear-gradient(180deg, black 90%, transparent 100%); mask-image: linear-gradient(180deg, black 90%, transparent 100%);
    }
    /* το πέπλο αρχίζει στο τελευταίο σκαλί: πάνω από εκεί ο ναός είναι ανέγγιχτος. ΕΝΑ πέπλο πίσω από το πλαίσιο· το σκούρο του κάτω άκρου
       αρχίζει κάτω από το πλαίσιο, πίσω από το κουμπί μόνο */
    .iroas.proti-nea .foto::after {
      background:
        linear-gradient(180deg, transparent calc(var(--proti-eleythero, 50vh) - 44px), var(--gyali-peplo) calc(var(--proti-eleythero, 50vh) - 2px)),
        linear-gradient(180deg, transparent calc(100% - 74px), var(--menou-pisw) 100%);
    }
    .iroas.proti-nea .wrap { min-height: var(--proti-ypsos, 100vh); padding: 0 0 14px; }
    .iroas.proti-nea .wrap > div:first-child { width: 100%; max-width: 560px; margin-inline: auto; }
    .iroas.proti-nea .etiketa { order: 0; margin: 0 0 8px; font-size: 13.5px; letter-spacing: .12em; line-height: 1.4; }
    .iroas.proti-nea h1 { order: 1; font-size: min(7.8vw, 40px); }
    .iroas.proti-nea .ypo { order: 2; margin: 14px 0 0; }
    .iroas.proti-nea .proti-omada { order: 3; margin-top: 12px; }

    /* ΟΙ ΓΕΜΑΤΕΣ ΜΕΡΕΣ (12/10/2026, δεύτερος έλεγχος του look 1): με ωράριο στο πλαίσιο ή με τρεις ακολουθίες και πάνω, τα γράμματα θέλουν περισσότερο ύψος.
       (24/10/2026) Ο ναός ΔΕΝ μικραίνει πια για αυτές: κρατά το μέγεθός του και το πλαίσιο πάει πιο κάτω (ο Bill, 24/10). Μένει μόνο το πιο σφιχτό
       διάστιχο του πλαισίου. Τα γράμματα μένουν 17px.
       (14/10/2026, σημείο 2 του Bill) Το ίδιο όταν τρέχει η ταινία των ανακοινώσεων (.me-tainia, από το tainia.js): «δεν θα χρειαζεται ομως να κανει scroll
       down καποιος για να εμφανιστει». Σε χαμηλό κινητό ο ναός μικραίνει, για να χωρούν κουμπί ΚΑΙ ταινία στην πρώτη οθόνη. */
    .iroas.proti-nea.me-tainia { --proti-ypsos: max(100vh - 73px, var(--proti-keimeno, 400px) + 20vw + 22px); }
    @supports (height: 100svh) {
      .iroas.proti-nea.me-tainia { --proti-ypsos: max(100svh - 73px, var(--proti-keimeno, 400px) + 20vw + 22px); }
    }
    /* όταν ο ναός μικρύνει κάτω από το πλάτος της οθόνης, η φωτογραφία σβήνει και στα δύο πλάγια άκρα της μέσα στο σκούρο: ποτέ κομμένη σαν κουτί */
    .iroas.proti-nea:has(.simera .sm-info) .foto img {
      -webkit-mask-image: linear-gradient(180deg, black 90%, transparent 100%), linear-gradient(90deg, transparent 0, black 14%, black 86%, transparent 100%);
      mask-image: linear-gradient(180deg, black 90%, transparent 100%), linear-gradient(90deg, transparent 0, black 14%, black 86%, transparent 100%);
      -webkit-mask-composite: source-in; mask-composite: intersect;
    }
    .iroas.proti-nea.me-tainia .foto img {
      -webkit-mask-image: linear-gradient(180deg, black 90%, transparent 100%), linear-gradient(90deg, transparent 0, black 14%, black 86%, transparent 100%);
      mask-image: linear-gradient(180deg, black 90%, transparent 100%), linear-gradient(90deg, transparent 0, black 14%, black 86%, transparent 100%);
      -webkit-mask-composite: source-in; mask-composite: intersect;
    }
  }
  /* ΧΑΜΗΛΟ ΚΙΝΗΤΟ (ως 700px ύψος): όλα πιο σφιχτά, για να χωρούν ναός, όνομα, πλαίσιο και κουμπί στην πρώτη οθόνη. Τα γράμματα μένουν 17px. */
  @media (max-width: 900px) and (max-height: 700px) {
    .iroas.proti-nea .wrap { padding-bottom: 10px; }
    .iroas.proti-nea .etiketa { margin-bottom: 4px; font-size: 13px; }
    .iroas.proti-nea .proti-omada { margin-top: 8px; }
    .iroas.proti-nea .simera { padding: 8px 14px 7px; }
    .iroas.proti-nea .simera .sm-gr li { padding: 5px 0; }
    .iroas.proti-nea .simera .sm-info { margin-top: 8px; padding-top: 7px; }
    .iroas.proti-nea .drasi { margin-top: 8px; }
    .iroas.proti-nea .proti-koumpi { min-height: 48px; padding-block: 8px; }
  }
  /* ΣΤΟ ΚΙΝΗΤΟ, ΤΙΠΟΤΑ ΚΑΤΩ ΑΠΟ ΤΟ ΟΝΟΜΑ: η πρόταση «Από το 1929…» δεν φαίνεται ως τα 900px. Από εκεί και πάνω μένει όπως είναι. */
  @media (max-width: 900px) {
    .iroas.proti-nea .ypo { display: none; }
  }

  /* ───────── ΠΛΑΤΟΣ: υπολογιστής ───────── */
  @media (min-width: 901px) and (min-aspect-ratio: 5/4) {
    .iroas.proti-nea { min-height: calc(100vh - 73px); min-height: calc(100svh - 73px); }
    /* κοντινό κάδρο (naos-katharo-konta, λόγος 1,761): ο άξονας του ναού στο 69% του πλάτους, οι σταυροί στο 8% του ύψους, τα σκαλιά στο 84%.
       Σε πιο στενό παράθυρο κόβεται κυρίως το αριστερό (τα πεύκα)· σε πιο πλατύ, κυρίως το κάτω (ο δρόμος). */
    .iroas.proti-nea .foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 80% 20%; }
    /* (24/10/2026) Η ΦΩΤΟΓΡΑΦΙΑ ΚΡΑΤΑ ΤΟ ΥΨΟΣ ΤΗΣ ΠΡΩΤΗΣ ΟΘΟΝΗΣ: όταν μια γεμάτη μέρα ψηλώσει την ενότητα, ο ναός δεν ζουμάρει· η ενότητα συνεχίζει από κάτω
       στο σκούρο της, και η φωτογραφία σβήνει μέσα του σε όσο ύψος περίσσεψε (ως 90px). Σε μέρα που χωρά, το σβήσιμο είναι μηδέν: η οθόνη ίδια pixel προς pixel. */
    .iroas.proti-nea .foto img { bottom: auto; height: calc(100vh - 73px); height: calc(100svh - 73px); }
    .iroas.proti-nea .foto {
      -webkit-mask-image: linear-gradient(180deg, black calc(100svh - 73px - clamp(0px, 100% - 100svh + 73px, 90px)), transparent calc(100svh - 73px));
      mask-image: linear-gradient(180deg, black calc(100svh - 73px - clamp(0px, 100% - 100svh + 73px, 90px)), transparent calc(100svh - 73px));
    }
    /* ανοιχτό κάδρο (naos-katharo-platy, όλο το πλάτος του μητρικού): άξονας στο 58,5%, σταυροί στο 10%, σκαλιά στο 70% */
    .iroas.proti-nea[data-kadro="anoixto"] .foto img { object-position: 62% 25%; }
    @media (min-aspect-ratio: 2/1) {
      .iroas.proti-nea .foto img { object-position: 62% 25%; }
    }
    /* ΤΟ ΠΕΠΛΟ ΑΚΟΛΟΥΘΕΙ ΤΑ ΓΡΑΜΜΑΤΑ, όχι την οθόνη: κρέμεται πίσω από τη στήλη τους, απλώνεται ως το αριστερό άκρο και σβήνει αργά (270px προς τα δεξιά,
       120px προς τα πάνω, πάνω από το όνομα), για να μη φαίνεται άκρη του πάνω στον ουρανό. ΕΝΑ πέπλο, όπως στο κινητό. Έτσι σκουραίνουν μόνο τα πεύκα πίσω από τα γράμματα, σε κάθε πλάτος παραθύρου· ο ναός και ο ουρανός μένουν ανέγγιχτοι. */
    .iroas.proti-nea .foto::after { background: none; }
    .proti-omada::before { right: -170px; height: 366px; background: linear-gradient(180deg, transparent 0, var(--gyali-peplo) 26%, var(--gyali-peplo) 86%, transparent 100%); -webkit-mask-image: linear-gradient(90deg, black calc(100% - 270px), transparent 100%); mask-image: linear-gradient(90deg, black calc(100% - 270px), transparent 100%); }
    .iroas.proti-nea .wrap > div:first-child::before {
      content: ""; position: absolute; z-index: -1; inset: -130px -170px -44px -100vw; pointer-events: none;
      background: linear-gradient(90deg, var(--gyali-peplo) calc(100% - 270px), transparent 100%);
      -webkit-mask-image: linear-gradient(180deg, transparent 0, black 120px); mask-image: linear-gradient(180deg, transparent 0, black 120px);
    }
    /* ΤΟ ΠΕΠΛΟ ΤΗΣ ΣΤΗΛΗΣ ΦΤΑΝΕΙ ΟΛΟΚΛΗΡΟ ΩΣ ΤΗΝ ΚΟΡΥΦΗ ΤΟΥ ΟΝΟΜΑΤΟΣ και σβήνει πιο ψηλά, ΙΔΙΟ ΚΑΙ ΣΤΙΣ ΔΥΟ ΦΩΤΟΓΡΑΦΙΕΣ. Η μέρα έχει φωτεινά σύννεφα πάνω
       αριστερά, εκεί που στέκεται το όνομα· το βράδυ, στο ανοιχτό κάδρο, η πρώτη σειρά του ονόματος φτάνει στον πιο ανοιχτό ουρανό πάνω από τον λόφο.
       Ένα πέπλο για τις δύο σημαίνει και ότι τη στιγμή της αλλαγής (στο λυκόφως και στην ανατολή) δεν αλλάζει τίποτα πίσω από τα γράμματα: αλλάζει μόνο η φωτογραφία,
       αργά. Μετρημένο στα 1280×800 πάνω στα ίδια τα pixel τους, και στα δύο κάδρα. (Ο κανόνας είναι ο από πάνω: αρχίζει 130px πάνω από τη στήλη και
       είναι ολόκληρος 10px πάνω από το όνομα.) */

    .iroas.proti-nea .wrap { min-height: calc(100vh - 73px); min-height: calc(100svh - 73px); padding: 40px 0 44px; align-items: flex-start; }
    .iroas.proti-nea .wrap > div:first-child { width: min(500px, 39vw); }
    .iroas.proti-nea :is(h1, .etiketa, .ypo) { text-shadow: 0 1px 14px var(--menou-pisw); }
    .iroas.proti-nea[data-kadro="anoixto"] .wrap > div:first-child { width: min(440px, 34.5vw); }
    .iroas.proti-nea[data-kadro="anoixto"] h1 { font-size: clamp(30px, 3.05vw, 40px); }
    /* όπως σήμερα στον υπολογιστή: πρώτα το όνομα, από κάτω του η ετικέτα, μετά η πρόταση */
    .iroas.proti-nea h1 { order: 0; grid-column: auto; grid-row: auto; font-size: clamp(32px, 3.5vw, 46px); }
    .iroas.proti-nea .etiketa { order: 1; grid-column: auto; grid-row: auto; margin: 12px 0 0; letter-spacing: .1em; text-wrap: balance; }
    .iroas.proti-nea .ypo { order: 2; grid-column: auto; grid-row: auto; align-self: auto; max-width: none; margin: 16px 0 0; }
    .iroas.proti-nea .proti-omada { order: 3; margin-top: 26px; }
    .iroas.proti-nea .simera { padding: 20px 22px 16px; }
    .iroas.proti-nea .drasi { margin-top: 14px; }

    /* ΟΙ ΓΕΜΑΤΕΣ ΜΕΡΕΣ (12/10/2026, δεύτερος έλεγχος του look 1): όταν ο ναός δώσει ωράριο (η γραμμή «Ναός · Γραφείο») ή η μέρα έχει τρεις ακολουθίες και πάνω,
       το πλαίσιο μαζεύεται για να μένουν πλαίσιο ΚΑΙ κόκκινο κουμπί μέσα στην πρώτη οθόνη (μετρημένο στα 1280×800, και με τα δύο μαζί): ο χώρος κάθε ακολουθίας
       στην ίδια γραμμή με το όνομά της, λιγότερος αέρας ανάμεσα στις γραμμές. Τα γράμματα μένουν 17px. Στο κινητό δεν χρειάζεται: εκεί ανεβαίνει το όνομα. */
    .iroas.proti-nea .wrap:has(.simera .sm-info) { padding: 28px 0 30px; }
    .iroas.proti-nea .wrap:has(.simera .sm-info) .ypo { margin-top: 12px; }
    .iroas.proti-nea .wrap:has(.simera .sm-info) .proti-omada { margin-top: 18px; }
    .iroas.proti-nea .simera:has(.sm-info) { padding: 14px 22px 12px; }
  }
}

/* Local dark backing keeps the small light link legible even over a white photo pixel. */
.iroas.proti-nea .simera a.eort-syndesmos { color: var(--gyali-keimeno); background: transparent; text-decoration: underline; text-underline-offset: 3px; }

@media screen {
  /* Κρατάμε χώρο για την ταινία, αλλά το περιεχόμενο μπορεί πάντα να ψηλώσει. */
  .iroas.proti-nea.me-tainia { display: flex; flex-direction: column; }
  .iroas.proti-nea.me-tainia .wrap { flex: 1 0 auto; min-height: 0; }
}