/*
Theme Name: Core Engine
Theme URI: https://creziastudio.com
Author: Core Team
Description: Core Engine — central logic, routing & authority layer.
Version: 1.0.0
Text Domain: core-engine
*/


/* ——— Root variables ——— */
:root {
  --crezia-header-h: 72px;
  --hero-x: 0px;
  --hero-y: 0px;
  --hero-scale: 1;
  --hero-width: 55%;
}

/* ——— Header ——— */
header, .site-header, .crezia-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 9999;
  background: #000;
  color: #fff;
  box-shadow: 0 2px 12px rgba(0,0,0,.15);
}

/* ——— Base ——— */
body {
  margin: 0;
  padding-top: var(--crezia-header-h);
  background: #fff;
  color: #000;
  font-family: Helvetica, Arial, sans-serif;
}

/* ——— Hero split layout ——— */
.hero-split {
  display: grid;
  grid-template-columns: calc(100% - var(--hero-width)) var(--hero-width);
  height: 100vh;
}

.hero-text {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
  color: #000;
}

.hero-image {
  position: relative;
  overflow: hidden;
}

.hero-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: translate(var(--hero-x), var(--hero-y)) scale(var(--hero-scale));
  transform-origin: center center;
  transition: transform .2s ease-out;
}

/* === CREZIA • Hero Words Two-Phase Motion v9.8 (higher + subtext fade) === */
.hero-words {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.25em;
  font-family: "Garamond","Times New Roman",serif;
  font-weight: 500;
  text-transform: none;        /* Title case */
  margin-left: 6vw;
  margin-top: -18vh;           /* ⬅️ ΑΡΚΕΤΑ πιο ψηλά */
}

/* αρχική κατάσταση — off-screen */
.hero-words .word {
  display: block;
  font-size: clamp(3.6rem, 5.2vw, 6.6rem);
  line-height: 1.15;
  text-transform: lowercase;
  opacity: 0;
  transform: translateX(-60vw);
  transition:
    transform 9.5s cubic-bezier(.16,1,.3,1),  /* πολύ αργό slide */
    opacity   7.5s ease;                       /* αργό, απαλό fade */
  will-change: transform, opacity;
  backface-visibility: hidden;
}

/* πρώτο γράμμα κεφαλαίο */
.hero-words .word::first-letter { text-transform: uppercase; }

/* διαδοχικές καθυστερήσεις (κρατάμε το cinematic ρυθμό) */
.hero-words .w1 { transition-delay: 1.8s; margin-left: 0; }
.hero-words .w2 { transition-delay: 4.2s; margin-left: 2vw; }
.hero-words .w3 { transition-delay: 6.6s; margin-left: 4vw; }

/* ενεργή φάση — την ενεργοποιεί το JS με .active */
.hero-words.active .word {
  opacity: 1;
  transform: translateX(0);
}

/* === CREZIA • Subtext κάτω από τις 3 λέξεις — fade μαζί με το slide === */
.hero-subtext {
  margin-left: 6vw;
  margin-top: 2.4vh;                 /* απόσταση κάτω από τις μεγάλες λέξεις */
  max-width: 40ch;
  font-family: "Garamond","Times New Roman",serif;
  font-weight: 400;
  font-size: clamp(1.2rem, 1.4vw, 1.8rem);
  line-height: 1.5;
  color: #000;

  opacity: 0;                         /* αρχικά κρυφό */
  transition: opacity 5.2s ease;      /* ομαλό fade */
  transition-delay: 1.8s;             /* ⬅️ ίδια στιγμή με την .w1 */
}

.hero-subtext p { margin: 0 0 0.9em 0; }

.hero-subtext.active { opacity: 1; }  /* το JS στο functions.php βάζει .active */

/* διαδοχικές καθυστερήσεις — πιο “κινηματογραφικές” */
.hero-words .w1 { transition-delay: 1.2s; margin-left: 0; }
.hero-words .w2 { transition-delay: 3.0s; margin-left: 2vw; }
.hero-words .w3 { transition-delay: 4.8s; margin-left: 4vw; }

/* ενεργή φάση — ήδη την ενεργοποιεί το JS με .active */
.hero-words.active .word {
  opacity: 1;
  transform: translateX(0);
}

/* Responsive */
@media (max-width: 900px) {
  .hero-split { grid-template-columns: 1fr; height: auto; }
  .hero-image { height: 50vh; }
  .hero-words { align-items: center; text-align: center; margin-left: 0; }
  .hero-words .word {
    margin-left: 0;
    font-size: clamp(1.8rem, 6vw, 2.8rem);
  }
}
/* === CREZIA • Fix: κάθετη στοίχιση και σωστή θέση subtext === */
.hero-text{
  display: flex !important;
  flex-direction: column !important;    /* ⬅️ ΣΤΗΛΗ */
  justify-content: center !important;   /* κάθετη ευθυγράμμιση μέσα στη στήλη */
  align-items: flex-start !important;   /* ⬅️ ΑΡΙΣΤΕΡΑ, όχι κέντρο */
}

/* Οι μεγάλες λέξεις πολύ ψηλά όπως θες */
.hero-words{
  margin-top: -18vh !important;         /* ή -20vh αν το θες ακόμη ψηλότερα */
  margin-left: 6vw !important;
  margin-bottom: 2.2vh !important;      /* ⬅️ χώρος ΚΑΤΩ από τις λέξεις */
}

/* Το subtext ΚΑΤΩ από τις λέξεις, αριστερά, χωρίς να “σκαρφαλώνει” */
.hero-subtext{
  align-self: flex-start !important;    /* ⬅️ ακολουθεί την αριστερή στοίχιση */
  margin-left: 6vw !important;
  margin-top: 0 !important;             /* ⬅️ ακυρώνουμε ό,τι το ανεβάζει */
  max-width: 40ch;
  opacity: 0;
  transition: opacity 5.2s ease;
  transition-delay: 1.8s;               /* να ξεκινά μαζί με την .w1 */
}

.hero-subtext.active{ opacity: 1; }
/* === CREZIA • Subtext: bigger font + tighter gap === */
.hero-subtext{
  font-size: clamp(1.6rem, 1.8vw, 2.2rem) !important; /* ⬅️ πιο μεγάλο */
  line-height: 1.35 !important;                       /* ⬅️ πιο “μαζεμένο” */
  letter-spacing: 0.01em !important;
}

.hero-subtext p{
  margin: 0 0 0.35em 0 !important; /* ⬅️ μικρότερο κενό μεταξύ των γραμμών */
}

/* αν το θέλεις ακόμη πιο σφιχτό, ξεκλείδωσε το παρακάτω */
/*
.hero-subtext{
  font-size: clamp(1.7rem, 2vw, 2.4rem) !important;
}
.hero-subtext p{
  margin-bottom: 0.25em !important;
}
*/
/* === CREZIA • Κατέβασμα subtext κάτω από τις μεγάλες λέξεις === */
.hero-subtext{
  margin-top: 2.8vh !important;   /* δοκίμασε 1.8–3.2vh ανάλογα με το μάτι */
}

/* (προαιρετικό) κράτα πιο «καθαρή» απόσταση σε κινητά */
@media (max-width: 900px){
  .hero-subtext{ margin-top: 3vh !important; }
}
/* === CREZIA • Subtext bold (clean) === */
.hero-subtext{
  font-weight: 700 !important;              /* bold */
  letter-spacing: 0.01em !important;        /* λίγο “αέρας” για το bold */
  line-height: 1.35 !important;             /* κρατάει το μαζεμένο ύψος γραμμής */
}

/* Αν το bold “μαυρίζει” πολύ, δοκίμασε ηπιότερο: */
/*
.hero-subtext{ font-weight: 600 !important; }
*/
/* === CREZIA • Speed-tunable motion (v9.9) ============================== */
/* Προεπιλογές (normal) με CSS variables */
:root{
  --cz-offset: -55vw;     /* από πόσο “έξω” ξεκινά */
  --cz-slide: 3.6s;       /* διάρκεια slide */
  --cz-fade:  2.6s;       /* διάρκεια fade */
  --cz-d1:    0.50s;      /* καθυστέρηση 1ης λέξης */
  --cz-d2:    1.30s;      /* καθυστέρηση 2ης λέξης */
  --cz-d3:    2.10s;      /* καθυστέρηση 3ης λέξης */
  --cz-dsub:  0.50s;      /* καθυστέρηση subtext */
}

/* Fast προφίλ */
body.speed-fast{
  --cz-slide: 2.4s;
  --cz-fade:  1.8s;
  --cz-d1:    0.20s;
  --cz-d2:    0.80s;
  --cz-d3:    1.40s;
  --cz-dsub:  0.20s;
}

/* Slow προφίλ (αν ποτέ το θελήσεις) */
body.speed-slow{
  --cz-slide: 4.8s;
  --cz-fade:  3.6s;
  --cz-d1:    0.80s;
  --cz-d2:    1.80s;
  --cz-d3:    2.80s;
  --cz-dsub:  0.80s;
}

/* Συνδέουμε τις μεταβλητές με τα στοιχεία */
.hero-words .word{
  transform: translateX(var(--cz-offset));
  opacity: 0;
  transition:
    transform var(--cz-slide) cubic-bezier(.16,1,.3,1),
    opacity  var(--cz-fade)  ease;
  will-change: transform, opacity;
  backface-visibility: hidden;
}
.hero-words.active .word{
  opacity: 1;
  transform: translateX(0);
}
.hero-words .w1{ transition-delay: var(--cz-d1); margin-left: 0; }
.hero-words .w2{ transition-delay: var(--cz-d2); margin-left: 2vw; }
.hero-words .w3{ transition-delay: var(--cz-d3); margin-left: 4vw; }

/* Subtext: fade μαζί με τις λέξεις */
.hero-subtext{
  opacity: 0;
  transition: opacity var(--cz-fade) ease var(--cz-dsub);
}
.hero-subtext.active{ opacity: 1; }
/* CREZIA • logo/PNG μέσα σε card: να μην κόβεται */
.crezia-cards .thumb.contain{
  object-fit: contain;
  background: #fff;     /* κρατά λευκό γύρω από το logo */
  padding: 10px;        /* μικρό περιθώριο ώστε να “αναπνέει” */
}
/* === CREZIA • 4 Cards (contained, fit 4 per row) ============ */

/* “Φιλί” με το κάτω άκρο του hero για να μην φαίνεται ραφή */
.hero-split { margin-bottom: 0 !important; }

.crezia-cards{
  position: relative;
  z-index: 1;
  background: #fff;
  margin-top: -1px;                 /* σβήνει τυχόν γραμμή */
  padding: 28px 6vw 40px;           /* ίδιο left/right με το κείμενο */
}

/* Grid 4-στηλο στα desktop, χωρίς overflow */
.crezia-cards .cards{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;                        /* μικρό κενό μεταξύ */
  align-items: stretch;
}

/* Κάρτα “flat” */
.crezia-cards .card{
  display: block;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 14px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform .2s ease, box-shadow .2s ease;
}
.crezia-cards .card:hover{
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0,0,0,.08);
}

/* Εικόνα: ίδια αναλογία για όλες ώστε να χωράνε 4/σειρά */
.crezia-cards .thumb{
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;              /* πιο “ρηχές” = δεν γίνονται τεράστιες */
  object-fit: cover;                /* γεμίζει χωρίς παραμόρφωση */
}

/* Το logo PNG να μην κόβεται */
.crezia-cards .thumb.contain{
  object-fit: contain;
  background: #fff;
  padding: 12px;
}

/* Breakpoints: 3-cols → 2-cols → 1-col */
@media (max-width: 1200px){
  .crezia-cards .cards{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px){
  .crezia-cards{ padding: 24px 5vw 36px; }
  .crezia-cards .cards{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
}
@media (max-width: 560px){
  .crezia-cards{ padding-left: 4vw; padding-right: 4vw; }
  .crezia-cards .cards{ grid-template-columns: 1fr; }
}
/* === CREZIA • 4 photos: no gaps, flush under hero ============ */

/* μηδενίζει οποιοδήποτε κενό κάτω από το hero */
.hero-split { margin-bottom: 0 !important; }

/* ακουμπάει στο hero (αν δεις λεπτή γραμμή, κάν’ το -2px) */
.crezia-cards{
  margin-top: 8px !important;
  padding: 0 !important;
  background: #fff;
}

/* 4 στήλες ΧΩΡΙΣ κενό μεταξύ τους */
.crezia-cards .cards{
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 0 !important;
}

/* καθόλου περίγραμμα/σκιές/στρογγυλέματα για να “ενώνουν” */
.crezia-cards .card{
  display: block;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: #fff;
  overflow: hidden;
}

/* εικόνες μεγαλύτερες, ίση αναλογία, να γεμίζουν πλήρως */
.crezia-cards .thumb{
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;        /* ↑ πιο “ψηλές” (δοκίμασε και 3/2 ή 1/1) */
  object-fit: cover;          /* γεμίζει χωρίς παραμόρφωση */
}

/* το logo PNG να μην κόβεται */
.crezia-cards .thumb.contain{
  object-fit: contain !important;
  background: #fff;
  padding: 10px;              /* ελαφρύ “αέρα” γύρω από το logo */
}

/* προαιρετικό: σε mobile κρατάμε 2–1 στήλες χωρίς κενά */
@media (max-width: 1100px){
  .crezia-cards .cards{ grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 900px){
  .crezia-cards .cards{ grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 560px){
  .crezia-cards .cards{ grid-template-columns: 1fr !important; }
}
/* === CREZIA • 4 photos with small gaps & side gutters ======= */

/* Να μην υπάρχει ραφή με το hero */
.hero-split { margin-bottom: 0 !important; }

.crezia-cards{
  position: relative;
  z-index: 1;
  background: #fff;

  /* ακουμπάει στο hero από πάνω, αλλά έχει μικρά gutters στα πλάγια */
  margin-top: -1px !important;
  padding: 0 2vw 40px;         /* ←→ μικρά gutters, πάνω 0 για να ακουμπάει στο hero */
}

/* 4 στήλες με ΜΙΚΡΟ κενό μεταξύ τους */
.crezia-cards .cards{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;         /* μικρό κενό ανάμεσα στις κάρτες */
}

/* κάρτες με διακριτική γωνία/περίγραμμα */
.crezia-cards .card{
  display: block;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.crezia-cards .card:hover{
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0,0,0,.08);
}

/* εικόνες: λίγο “ψηλές” ώστε να φαίνονται γεμάτες αλλά όχι τεράστιες */
.crezia-cards .thumb{
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;          /* μπορείς να δοκιμάσεις 4/3 ή 3/2 κατά προτίμηση */
  object-fit: cover;
}

/* logo PNG να μην κόβεται */
.crezia-cards .thumb.contain{
  object-fit: contain !important;
  background: #fff;
  padding: 12px;
}

/* breakpoints: διατηρούμε μικρά gaps */
@media (max-width: 1200px){
  .crezia-cards .cards{ grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (max-width: 900px){
  .crezia-cards{ padding: 0 4vw 32px; }
  .crezia-cards .cards{ grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
}
@media (max-width: 560px){
  .crezia-cards{ padding: 0 5vw 28px; }
  .crezia-cards .cards{ grid-template-columns: 1fr !important; gap: 10px !important; }
}
/* === CREZIA • Fix: flush to hero + side gutters ============== */

/* 1) Μηδενίζει κάθε κενό κάτω από το hero */
.hero-split { margin-bottom: 0 !important; }

/* 2) Το block των 4 φωτογραφιών να ακουμπάει ΠΑΝΩ στο hero,
      αλλά με λευκά gutters αριστερά/δεξιά */
.crezia-cards{
  margin-top: -2px !important;     /* μικρό overlap για να σβήσει τη ραφή */
  padding: 0 3vw 40px !important;  /* ←→ λευκά gutters, από πάνω 0 */
  background: #fff;
}

/* Ασφάλεια να μην “κρεμάει” margin από κάποιο child */
.crezia-cards .cards{ margin: 0 !important; }

/* Μικρό κενό μεταξύ των φωτογραφιών (όχι κολλητές) */
.crezia-cards .cards{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;            /* ρύθμισε εδώ αν θες λίγο περισσότερο/λιγότερο */
}

/* Καθαρές κάρτες, χωρίς περίγραμμα που μπορεί να δημιουργεί ψευδο-γραμμές */
.crezia-cards .card{
  border: 0 !important;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
}

/* Εικόνες “γεμάτες” αλλά όχι υπερ-ψηλές */
.crezia-cards .thumb{
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;             /* μπορείς να δοκιμάσεις 4/3 ή 3/2 */
  object-fit: cover;
}

/* Το logo PNG να μην κόβεται */
.crezia-cards .thumb.contain{
  object-fit: contain !important;
  background: #fff;
  padding: 12px;
}
/* === CREZIA • Cards: tighter gutters + hard flush to hero ==== */

/* 1) Μηδενίζει Ο,ΤΙ κενό αφήνει το hero από κάτω */
.hero-split{ margin-bottom:0 !important; padding-bottom:0 !important; }
.hero-image{ margin-bottom:0 !important; }
.hero-image img{ display:block; margin:0 !important; }

/* 2) Cards block: πιο στενά πλαϊνά gutters & άμεσο “ανέβασμα” */
.crezia-cards{
  /* μικρό overlap ώστε να ακουμπήσει ΠΑΝΩ στο hero, ακόμα κι αν υπάρχει 1px ραφή */
  transform: translateY(-32px) !important;   /* ← αν θες κι άλλο, δοκίμασε -6px, -8px */
  margin-top: 0 !important;
  padding: 0 1.25vw 36px !important;        /* ←→ πιο στενά gutters (ή 1vw για ακόμη λιγότερο) */
  background: #fff;
}

/* 3) Μικρό κενό μεταξύ φωτογραφιών (όχι κολλητές), αλλά χωρίς να “τραβάνε” προς τα κάτω */
.crezia-cards .cards{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 10px !important;                      /* ← αύξησέ το/μείωσέ το κατά προτίμηση */
  margin: 0 !important;
}

/* Καθαρές κάρτες (χωρίς περίγραμμα που δημιουργεί ψευδο-γραμμές) */
.crezia-cards .card{
  border: 0 !important;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
}

/* Εικόνες “γεμάτες”, αλλά όχι υπερ-ψηλές */
.crezia-cards .thumb{
  display:block;
  width:100%;
  aspect-ratio: 3 / 2;   /* μπορείς να δοκιμάσεις 4/3 για λίγο “ψηλότερες” */
  object-fit: cover;
}

/* Το logo PNG να μην κόβεται */
.crezia-cards .thumb.contain{
  object-fit: contain !important;
  background:#fff;
  padding: 10px;
}
/* CREZIA • Last card: show top half (crop προς τα πάνω) */
.crezia-cards .cards > .card:last-child .thumb{
  object-fit: cover;          /* κρατά το frame γεμάτο */
  object-position: 50% 0%;    /* κέντρο-πάνω (top) */
}

/* Αν θέλεις λίγο πιο κάτω/πάνω, παίξε με το δεύτερο ποσοστό:
   π.χ. 50% 10% (λίγο πιο κάτω) ή 50% -5% (ακόμη πιο πάνω) */
/* CREZIA • Μεγαλύτερο logo στην 3η κάρτα (χωρίς αλλαγή container) */
.crezia-cards .cards > .card:nth-child(3){
  overflow: hidden; /* για να μην “ξεφεύγει” το scale */
}

.crezia-cards .cards > .card:nth-child(3) .thumb{
  padding: 0 !important;         /* override από προηγούμενο contain */
  object-fit: contain !important; 
  transform: scale(1.45);         /* ↑ ρυθμίζεις: 1.15–1.4 ανά γούστο */
  transform-origin: center center;
  image-rendering: auto;          /* καθαρό rendering */
}

/* Αν θες λίγο πιο μεγάλο/μικρό:
   άλλαξε μόνο το scale(1.25) π.χ. 1.35 ή 1.18 */
/* CREZIA • 3η κάρτα (logo): κέντρο κατακόρυφα + μικρό κατέβασμα */
.crezia-cards .cards > .card:nth-child(3){
  overflow: hidden;
}

.crezia-cards .cards > .card:nth-child(3) .thumb{
  object-fit: contain !important;
  object-position: 50% 55%;        /* αγκυρώνει λίγο χαμηλότερα από το κέντρο */
  transform: translateY(6%) scale(1.45);  /* μικρό κατέβασμα + το ζουμ που θες */
  transform-origin: center center;
}

/* αν θες πιο κάτω/πάνω, άλλαξε μόνο τα ποσοστά:
   object-position: 50% 58%; ή translateY(8%) κ.λπ. */

/* (προαιρετικό) σε μικρές οθόνες λίγο πιο ήπιο κατέβασμα */
@media (max-width: 560px){
  .crezia-cards .cards > .card:nth-child(3) .thumb{
    object-position: 50% 52%;
    transform: translateY(3%) scale(1.35);
  }
}
/* === CREZIA • Header brand ================================================= */

:root{
  --crezia-header-h: 72px; /* αν αλλάξεις ύψος header, άλλαξε και αυτό */
}

/* ο sticky header υπάρχει ήδη — εδώ ρυθμίζουμε εσωτερικό layout */
.crezia-header{
  height: var(--crezia-header-h);
  display: flex;
  align-items: center;
  background: #000;
  color: #fff;
}

.crezia-header__inner{
  width: 100%;
  max-width: 1200px;         /* αν θέλεις πιο φαρδύ, π.χ. 1320px */
  margin: 0 auto;
  padding: 0 20px;           /* αριστερό/δεξί “μαξιλάρι” */
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

/* brand (logo + κείμενο) */
.crezia-brand{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: #fff;
}

.crezia-brand__logo{
  width: 36px;
  height: 36px;
  border-radius: 8px;        /* αν το θέλεις τετράγωνο: 0 */
  object-fit: cover;
  display: block;
}

.crezia-brand__text{
  font-family: Helvetica, Arial, sans-serif;
  font-weight: 600;
  font-size: 18px;
  line-height: 1;
  letter-spacing: 0.2px;
  text-transform: lowercase; /* όλα μικρά… */
}
.crezia-brand__text::first-letter{
  text-transform: uppercase; /* …εκτός από το πρώτο γράμμα */
}

/* προαιρετικά: hover πιο “ήπιο” */
.crezia-brand:hover .crezia-brand__text{
  opacity: .9;
}

/* αν το περιεχόμενο κάτω από τον header ακουμπάει πολύ, έχεις ήδη:
   body { padding-top: var(--crezia-header-h); } */
/* === CREZIA • Header NON-STICKY override (definitive) === */
header, .site-header, .crezia-header {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  z-index: auto !important;
  height: auto !important;  /* μην κρατάς fixed ύψος */
}

/* Αφαίρεσε το “σπρώξιμο” της σελίδας για sticky header */
body {
  padding-top: 0 !important;
}
/* === CREZIA • Header sizing + logo (non-sticky) =============== */

/* Μη-σταθερός header (κρατάμε το override) */
header, .site-header, .crezia-header {
  position: static !important;
}

/* Ύψος header & εσωτερικά paddings */
:root{
  --crezia-header-h: 88px; /* ↑ ό,τι θες: 80–96px συνήθως */
}
.crezia-header{
  min-height: var(--crezia-header-h);
  display: flex;
  align-items: center;
  background: #000;          /* μαύρο όπως πριν */
  color: #fff;
}
.crezia-header__inner{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;           /* αριστερά/δεξιά “μαξιλάρια” */
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

/* Brand (logo + κείμενο) — μεγαλώνουμε logo & τίτλο */
.crezia-brand{
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  color: #fff;
}
.crezia-brand__logo{
  width: 48px;               /* ↑ μέγεθος logo */
  height: 48px;
  object-fit: cover;
  display: block;
  border-radius: 8px;        /* βάλε 0 αν το θες τετράγωνο */
}
.crezia-brand__text{
  font-family: Helvetica, Arial, sans-serif;
  font-weight: 600;
  font-size: 22px;           /* ↑ μέγεθος τίτλου */
  line-height: 1;
  letter-spacing: .2px;
  text-transform: lowercase;
}
.crezia-brand__text::first-letter{ text-transform: uppercase; }

/* Δεν θέλουμε πια “σπρώξιμο” του σώματος από sticky header */
body{ padding-top: 0 !important; }




/* === CREZIA • Header NON-STICKY + visible logo (override) === */
header, .site-header, .crezia-header { position: static !important; }

:root{ --crezia-header-h: 92px; }  /* ύψος header */
.crezia-header{
  min-height: var(--crezia-header-h);
  display:flex; align-items:center;
  background:#000; color:#fff;
}

.crezia-header__inner{
  width:100%; max-width:1200px; margin:0 auto;
  padding:0 24px; display:flex; align-items:center; gap:16px;
  justify-content:space-between;
}

/* Brand (logo + text) */
.crezia-brand{ display:inline-flex; align-items:center; gap:12px; color:#fff; text-decoration:none; }
.crezia-brand__logo{
  display:block !important;
  width:56px !important; height:56px !important;  /* ↑ ρύθμισε εδώ το μέγεθος */
  object-fit:contain !important;                  /* PNG με διαφάνεια φαίνεται καθαρά */
  border-radius:8px;                               /* βάλε 0 αν δε θες καμπύλες */
}
.crezia-brand__text{
  font:600 22px/1 Helvetica,Arial,sans-serif;
  letter-spacing:.2px; text-transform:lowercase;
}
.crezia-brand__text::first-letter{ text-transform:uppercase; }

/* Κατάργηση padding-top από sticky εκδοχές */
body{ padding-top:0 !important; }
/* === CREZIA • Μεγαλύτερο logo + σωστό header height ========== */
:root{
  /* ύψος header (αύξησέ το αν μεγαλώσεις πολύ το logo) */
  --crezia-header-h: 96px;   /* π.χ. 88–104px */
}

.crezia-header{
  min-height: var(--crezia-header-h);
  display: flex;
  align-items: center;
}

/* μέγεθος logo */
.crezia-brand__logo{
  width: 72px !important;    /* ↑ άλλαξέ τα για το επιθυμητό μέγεθος */
  height: 72px !important;   /* π.χ. 80px, 84px, 96px */
  object-fit: contain;
}

/* λίγο μεγαλύτερο το “Crezia”, αν θέλεις ισορροπία με το logo */
.crezia-brand__text{
  font-size: 24px;           /* π.χ. 22–26px */
  font-weight: 600;
}

/* προαιρετικά: σε mobile κάν’ το λίγο μικρότερο */
@media (max-width: 480px){
  .crezia-brand__logo{ width: 56px !important; height: 56px !important; }
  .crezia-brand__text{ font-size: 20px; }
}
/* === CREZIA • Σφίξιμο απόστασης logo–τίτλου ================== */

/* μικραίνουμε το κενό ανάμεσα στο logo και το κείμενο */
.crezia-brand{ gap: 4px !important; }   /* π.χ. 8, 6, 4px */

/* φέρνουμε το κείμενο 2px πιο “μέσα” προς το logo */
.crezia-brand__text{
  margin-left: -2px;                    /* 0 → -3px ανά γούστο */
}

/* προαιρετικά: σε mobile λίγο πιο “ανοιχτό” για αναπνοή */
@media (max-width: 480px){
  .crezia-brand{ gap: 8px !important; }
  .crezia-brand__text{ margin-left: 0; }
}
/* === CREZIA • Nav: οριζόντια με ΚΑΘΕΤΗ γραμμή ανάμεσα ============== */

.crezia-menu{
  display:flex !important;
  align-items:center;
  gap:0 !important;                 /* θα ορίσουμε απόσταση με padding */
  list-style:none; margin:0; padding:0;
}

.crezia-menu > li{
  display:flex; align-items:center;
  /* χωρίς extra margins εδώ */
}

/* Κάθετη γραμμή ανάμεσα στα items (όχι στο πρώτο) */
.crezia-menu > li + li{
  border-left:1px solid rgba(255,255,255,.42);
  margin-left:18px;                /* απόσταση αριστερά από τη γραμμή */
  padding-left:18px;               /* “αναπνοή” δεξιά από τη γραμμή */
}

/* Links */
.crezia-menu > li > a{
  color:#fff; text-decoration:none;
  font:600 14px/1 Helvetica,Arial,sans-serif;
  letter-spacing:.4px; text-transform:uppercase;
  opacity:.92; transition:opacity .2s ease;
  display:inline-block;            /* σταθερό ύψος hover-περιοχής */
  padding:8px 0;                   /* κάθετη ισορροπία */
}
.crezia-menu > li > a:hover{ opacity:1; }

/* Κράτημα στο κέντρο (όπως το έχεις με το grid) */
.crezia-nav{ justify-self:center; }

/* Responsive – λίγο πιο σφιχτό σε μικρότερες οθόνες */
@media (max-width:1100px){
  .crezia-menu > li + li{ margin-left:14px; padding-left:14px; }
  .crezia-menu > li > a{ font-size:13px; }
}
@media (max-width:900px){
  .crezia-menu > li + li{ margin-left:10px; padding-left:10px; }
  .crezia-menu > li > a{ font-size:12px; }
}
/* === CREZIA • Force logo visible (hard override) ===================== */
.crezia-header{ overflow: visible !important; }

.crezia-brand{
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;               /* όπως το κλειδώσαμε */
  overflow: visible !important;
}

.crezia-brand__logo{
  display: block !important;
  width: 72px !important;            /* ή ό,τι μέγεθος έχεις επιλέξει */
  height: 72px !important;
  object-fit: contain !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  position: relative !important;
  z-index: 2 !important;             /* μπροστά από οτιδήποτε τυχόν περνάει από πάνω */
}

/* Προληπτικά: μην “σκεπάζει” το menu την αριστερή στήλη */
.crezia-header__inner{
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;  /* brand | nav | placeholder */
  align-items: center !important;
  gap: 16px !important;
}
.crezia-nav{ position: relative; z-index: 1; }
/* === CREZIA • Fix: brand πάντα ορατό, nav κεντρικά χωρίς επικάλυψη === */

/* Grid σε 3 στήλες: brand | nav | placeholder */
.crezia-header__inner{
  display: grid !important;
  grid-template-columns: auto 1fr auto !important;
  align-items: center !important;
  gap: 16px !important;
}

/* Δεσμεύουμε “θέση” για brand & right-slot ώστε το nav να μην μπαίνει εκεί */
:root{
  --crezia-brand-w: 180px;  /* ~72px logo + κείμενο + αναπνοή */
}
.crezia-brand{
  min-width: var(--crezia-brand-w) !important;
  position: relative;
  z-index: 3; /* πάνω από οτιδήποτε */
}
.crezia-right-slot{
  min-width: var(--crezia-brand-w) !important; /* κρατά συμμετρία δεξιά */
  justify-self: end;
}

/* Το nav κέντρο και εντός διαθέσιμου χώρου */
.crezia-nav{
  justify-self: center;
  max-width: 100%;
  position: relative;
  z-index: 1;
}
.crezia-menu{
  display: flex !important;
  align-items: center;
  flex-wrap: nowrap !important; /* πάντα μία γραμμή */
  gap: 0 !important;            /* θα ρυθμίσουμε με το border spacing */
  list-style: none; margin: 0; padding: 0;
}
/* κάθετη γραμμή ανάμεσα στα items */
.crezia-menu > li + li{
  border-left: 1px solid rgba(255,255,255,.42);
  margin-left: 18px;
  padding-left: 18px;
}
.crezia-menu > li > a{
  color:#fff; text-decoration:none;
  font: 600 14px/1 Helvetica,Arial,sans-serif;
  letter-spacing:.4px; text-transform:uppercase;
  opacity:.92; transition:opacity .2s ease;
  padding: 8px 0;
}
.crezia-menu > li > a:hover{ opacity: 1; }

/* Logo/brand εμφανές & στο σωστό μέγεθος */
.crezia-header{ overflow: visible !important; }
.crezia-brand__logo{
  display: block !important;
  width: 72px !important; height: 72px !important;
  object-fit: contain !important;
  opacity: 1 !important; visibility: visible !important;
}

/* — “Σφίξιμο” όταν δεν χωράει — */
@media (max-width: 1280px){
  :root{ --crezia-brand-w: 160px; }  /* λίγο πιο σφιχτό */
  .crezia-menu > li + li{ margin-left: 14px; padding-left: 14px; }
}
@media (max-width: 1100px){
  .crezia-menu > li > a{ font-size: 13px; }
  .crezia-menu > li + li{ margin-left: 12px; padding-left: 12px; }
}
@media (max-width: 980px){
  .crezia-menu > li > a{ font-size: 12px; letter-spacing:.3px; }
  .crezia-menu > li + li{ margin-left: 10px; padding-left: 10px; }
}
/* === CREZIA • Header safe layout (brand left, nav center, no overlap) === */
:root{
  --crezia-header-h: 96px;       /* ύψος header αν θέλεις */
  --crezia-brand-pad: 200px;     /* “μαξιλάρι” αριστερά/δεξιά για να μη μπει το nav κάτω από το brand */
}

/* βασικό container header */
.crezia-header{
  position: relative;
  overflow: visible;
}
.crezia-header__inner{
  position: relative;
  min-height: var(--crezia-header-h);
  padding: 0 24px;
}

/* brand (logo + κείμενο) — Μένει όπως το έχεις */
.crezia-brand{
  position: relative;
  z-index: 3;                       /* πάνω απ’ όλα */
  display: inline-flex;
  align-items: center;
  gap: 6px;                         /* το “κλειδωμένο” gap που είχες */
  text-decoration: none;
  color: #fff;
}
.crezia-brand__logo{
  display: block !important;
  width: 62px !important;
  height: 62px !important;
  object-fit: contain !important;
  opacity: 1 !important; visibility: visible !important;
}

/* centered nav που ΔΕΝ περνάει κάτω από το brand */
.crezia-nav{
  position: absolute;
  top: 50%;
  left: 0; right: 0;
  transform: translateY(-50%);
  padding-left: var(--crezia-brand-pad);
  padding-right: var(--crezia-brand-pad);
  display: flex;
  justify-content: center;
  z-index: 2;                        /* κάτω από το brand, πάνω από φόντο */
}

/* οριζόντια items με ΚΑΘΕΤΗ γραμμή ανάμεσα */
.crezia-menu{
  display: flex;
  align-items: center;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  white-space: nowrap;
}
.crezia-menu > li + li{
  border-left: 1px solid rgba(255,255,255,.42);
  margin-left: 18px;
  padding-left: 18px;
}
.crezia-menu > li > a{
  color: #fff; text-decoration: none;
  font: 600 14px/1 Helvetica,Arial,sans-serif;
  letter-spacing: .4px; text-transform: uppercase;
  opacity: .92; transition: opacity .2s ease;
  padding: 8px 0;
}
.crezia-menu > li > a:hover{ opacity: 1; }

/* non-sticky: αν θέλεις να ΜΗΝ είναι sticky, κράτα αυτά */
header, .site-header, #site-header, .crezia-header{ position: static; }
body{ padding-top: 0; }

/* μικρές προσαρμογές όταν στενεύει το πλάτος */
@media (max-width: 1200px){
  :root{ --crezia-brand-pad: 180px; }
  .crezia-menu > li + li{ margin-left: 14px; padding-left: 14px; }
}
@media (max-width: 1024px){
  :root{ --crezia-brand-pad: 160px; }
  .crezia-menu > li > a{ font-size: 13px; letter-spacing: .35px; }
  .crezia-menu > li + li{ margin-left: 12px; padding-left: 12px; }
}
@media (max-width: 900px){
  :root{ --crezia-brand-pad: 140px; }
  .crezia-menu > li > a{ font-size: 12px; letter-spacing: .3px; }
  .crezia-menu > li + li{ margin-left: 10px; padding-left: 10px; }
}
/* === CREZIA • Nav με Poppins (latin) + Open Sans (greek fallback) === */
.crezia-menu > li > a{
  font-family: "Poppins", "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
  font-weight: 600;
  letter-spacing: .35px;    /* ελαφρύ tracking ταιριάζει στο Poppins */
  text-transform: uppercase;
}

/* αν θέλεις λίγο πιο “Poppins” feeling και για τα ελληνικά, άφησε το Open Sans fallback όπως είναι */
/* === CREZIA • Header font = Sofia Sans (με ελληνικά fallback) ========= */

/* Κληρονομιά γραμματοσειράς σε όλο το header */
.crezia-header,
.crezia-header * {
  font-family: "Sofia Sans", "Noto Sans",
               system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
}

/* Brand text “Crezia” — Κεφαλαίο το C, τα υπόλοιπα πεζά (όπως το έχεις) */
.crezia-brand__text{
  font-weight: 600;
  font-size: 24px;         /* ρυθμίζεις αν θες 22–26px */
  letter-spacing: 0.2px;
  text-transform: none;    /* κρατάμε πεζά */
}

/* Οριζόντια links στο menu */
.crezia-menu > li > a{
  font-weight: 600;
  letter-spacing: 0.4px;   /* αν το θες πιο “γεωμετρικό”, πήγαινέ το 0.45px */
  text-transform: uppercase;
}

/* Προσαρμογές σε μικρότερα πλάτη */
@media (max-width: 1024px){
  .crezia-brand__text{ font-size: 22px; }
  .crezia-menu > li > a{ font-size: 13px; letter-spacing: .35px; }
}
@media (max-width: 900px){
  .crezia-menu > li > a{ font-size: 12px; letter-spacing: .3px; }
}
/* === CREZIA • Ενιαία γραμματοσειρά στο header (Sofia Sans) ========== */
.crezia-header, .crezia-header *{
  font-family: "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Links του menu */
.crezia-menu > li > a{
  font-weight: 600;
  letter-spacing: .35px;
  text-transform: uppercase;
}

/* Αν παρ’ όλα αυτά κάποια ελληνικά φανούν λίγο πιο “ελαφριά”,
   δώσε 1 κλικ παραπάνω weight στα αμιγώς ελληνικά μέσω :lang(el) */
.crezia-menu > li > a:lang(el){
  font-weight: 700;
}
/* === CREZIA • Header layout & fonts ================================== */
:root{
  --crezia-header-h: 96px;
  --crezia-nav-pad-left: 200px;   /* “μαξιλάρι” αριστερά (brand) */
  --crezia-nav-pad-right: 200px;  /* “μαξιλάρι” δεξιά (auth links) */
}

/* Ενιαία γραμματοσειρά στο header (brand, menu, auth) */
.crezia-header, .crezia-header *{
  font-family: "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Βασικό wrapper του header σου */
.crezia-header{
  position: relative;
  overflow: visible;
}
.crezia-header__inner{
  position: relative;
  min-height: var(--crezia-header-h);
  padding: 0 24px;
  display: block; /* κρατάμε τη δική σου ροή */
}

/* Brand (όπως το έχεις) + εμφανές logo */
.crezia-brand{
  position: relative; z-index: 3;
  display: inline-flex; align-items: center; gap: 6px;
  text-decoration: none; color: #fff;
}
.crezia-brand__logo{
  display: block !important;
  width: 62px !important; height: 62px !important; /* όπως είπες */
  object-fit: contain !important;
}
.crezia-brand__text{
  font-weight: 600; font-size: 24px; letter-spacing:.2px; text-transform:none;
}

/* === Κέντρο: NAV που δεν πατάει στο brand ούτε στα auth ============== */
.crezia-nav{
  position: absolute; top:50%; left:0; right:0;
  transform: translateY(-50%);
  padding-left: var(--crezia-nav-pad-left);
  padding-right: var(--crezia-nav-pad-right);
  display: flex; justify-content: center;
  z-index: 2;
}
.crezia-menu{
  display:flex; align-items:center; gap:0;
  list-style:none; margin:0; padding:0; white-space:nowrap;
}
.crezia-menu > li + li{
  border-left:1px solid rgba(255,255,255,.42);
  margin-left:18px; padding-left:18px;
}
.crezia-menu > li > a{
  color:#fff; text-decoration:none;
  font-weight:600; letter-spacing:.35px; text-transform:uppercase;
  opacity:.92; transition:opacity .2s ease;
  padding:8px 0;
}
.crezia-menu > li > a:hover{ opacity:1; }

/* === Δεξιά άκρη: Είσοδος / Εγγραφή =================================== */
.crezia-auth{
  position:absolute; top:50%; right:24px; transform:translateY(-50%);
  display:flex; align-items:center; gap:16px;
  z-index:3; /* πάνω από το nav */
}
.crezia-auth .auth-link{
  color:#fff; text-decoration:none; font-weight:600; letter-spacing:.3px;
  opacity:.92; transition:opacity .2s ease;
  padding:8px 0;
}
.crezia-auth .auth-link:hover{ opacity:1; }

/* “Εγγραφή” ως διακριτικό button */
.crezia-auth .auth-primary{
  padding:8px 14px; border:1px solid rgba(255,255,255,.55);
  border-radius:999px;
}

/* === Responsive “σφίξιμο” ============================================ */
@media (max-width: 1280px){
  :root{
    --crezia-nav-pad-left: 180px;
    --crezia-nav-pad-right: 180px;
  }
  .crezia-menu > li + li{ margin-left:14px; padding-left:14px; }
}
@media (max-width: 1100px){
  :root{
    --crezia-nav-pad-left: 160px;
    --crezia-nav-pad-right: 160px;
  }
  .crezia-menu > li > a{ font-size:13px; letter-spacing:.32px; }
  .crezia-menu > li + li{ margin-left:12px; padding-left:12px; }
}
@media (max-width: 980px){
  :root{
    --crezia-nav-pad-left: 140px;
    --crezia-nav-pad-right: 140px;
  }
  .crezia-menu > li > a{ font-size:12px; letter-spacing:.28px; }
  .crezia-menu > li + li{ margin-left:10px; padding-left:10px; }
}
/* CREZIA • Είσοδος/Εγγραφή σε bold */
.crezia-auth .auth-link{
  font-weight: 700;            /* bold */
}

/* (προαιρετικό) κάνε την "Εγγραφή" λίγο πιο έντονη ως call-to-action */
.crezia-auth .auth-primary{
  font-weight: 700;            /* ήδη bold */
  border-width: 2px;           /* λίγο πιο “στέρεο” */
}
/* === CREZIA • Λεπτορύθμιση κατακόρυφης στοίχισης header =============== */
:root{
  /* + κατεβάζει, − ανεβάζει (δοκίμασε 4px–10px) */
  --crezia-nav-offset: 6px;
}

/* Κατέβασε ομοιόμορφα το κεντρικό nav και τα δεξιά links */
.crezia-nav{
  transform: translateY(calc(-50% + var(--crezia-nav-offset)));
}
.crezia-auth{
  transform: translateY(calc(-50% + var(--crezia-nav-offset)));
}

/* Αν θέλεις 1 κλικ ακόμη πιο κάτω ΜΟΝΟ τα links του menu (προαιρετικό) */
.crezia-menu > li > a{
  position: relative;
  top: 1px; /* παίξε 0–2px αν χρειάζεται */
}
/* === CREZIA • Centered logo separator ================================= */
:root{
  --sep-y: 48px;        /* κατακόρυφα κενά πάνω/κάτω */
  --sep-line: #e9e9e9;  /* χρώμα γραμμής */
  --sep-size: 64px;     /* μέγεθος εικονιδίου */
  --sep-gap: 20px;      /* κενό γύρω από το εικονίδιο */
  --sep-round-bg: #fff; /* φόντο “δίσκος” κάτω από το logo (λευκό) */
  --sep-round-border: #ddd;
}

.crezia-separator{
  display: flex;
  align-items: center;
  gap: var(--sep-gap);
  max-width: 1200px;
  margin: var(--sep-y) auto;       /* κέντρο σελίδας */
  padding: 0 16px;                  /* αναπνοή στα άκρα */
}

.crezia-separator__line{
  flex: 1 1 auto;
  height: 1px;
  background: var(--sep-line);
}

.crezia-separator__logo{
  display: inline-grid;
  place-items: center;
  width: calc(var(--sep-size) + 16px);
  height: calc(var(--sep-size) + 16px);
  border-radius: 999px;
  background: var(--sep-round-bg);
  border: 1px solid var(--sep-round-border);
  box-shadow: 0 2px 10px rgba(0,0,0,.05);
}

.crezia-separator__logo img{
  display: block;
  width: var(--sep-size);
  height: var(--sep-size);
  object-fit: contain;
}

/* Fine–tuning για στενά πλάτη */
@media (max-width: 900px){
  :root{
    --sep-y: 40px;
    --sep-size: 52px;
    --sep-gap: 14px;
  }
}
/* === CREZIA • Center logo only (no lines) ============================ */
:root{
  --sep-y: 44px;   /* κατακόρυφο κενό πάνω/κάτω από το logo */
  --sep-size: 80px;/* μέγεθος logo (αλλάζεις μόνο αυτό για πιο μεγάλο/μικρό) */
}

.crezia-separator{
  display: flex;
  justify-content: center;
  align-items: center;
  margin: var(--sep-y) auto;
  padding: 0;              /* χωρίς extra οριζόντιο padding */
}

.crezia-separator__logo{
  display: inline-grid;
  place-items: center;
}

.crezia-separator__logo img{
  display: block;
  width: var(--sep-size);
  height: var(--sep-size);
  object-fit: contain;     /* το JPG έχει λευκό bg, ταιριάζει με το white layout */
}

/* Προσαρμογή για mobile αν θέλεις πιο μικρό */
@media (max-width: 900px){
  :root{ --sep-size: 64px; --sep-y: 36px; }
}
/* === CREZIA • Center logo only (SVG) ================================= */
:root{
  --sep-y: 44px;     /* κενό πάνω/κάτω από το logo */
  --sep-size: 80px;  /* μέγεθος του logo */
}

.crezia-separator{
  display: flex;
  justify-content: center;
  align-items: center;
  margin: var(--sep-y) auto;
  padding: 0;
}

.crezia-separator__logo{
  display: inline-grid;
  place-items: center;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Το SVG σαν <img> — απλά δώσε του μέγεθος */
.crezia-separator__logo img{
  display: block;
  width: var(--sep-size);
  height: var(--sep-size);
}

/* Αν υπήρχαν παλιές γραμμές, τις σβήνουμε */
.crezia-separator__line{ display: none !important; }

/* Mobile fine-tune */
@media (max-width: 900px){
  :root{ --sep-size: 64px; --sep-y: 36px; }
}
/* === CREZIA • Split block (Text left / Image right) =================== */
:root{
  --walk-h: 560px;               /* ελάχιστο ύψος ενότητας (ρύθμιση) */
}

.crezia-split{
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  gap: 0;
  margin: 56px 0;               /* απόσταση από τα γύρω στοιχεία */
  min-height: var(--walk-h);
  background: #fff;
}

/* — Text side — */
.crezia-walk .split-text{
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(24px, 6vw, 80px);
  background: #fff;
  color: #000;
}
.crezia-walk .split-text-inner{ max-width: 680px; }

.crezia-walk h2{
  font-family: "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-weight: 700;
  font-size: clamp(1.8rem, 3.2vw, 2.6rem);
  line-height: 1.15;
  letter-spacing: 0.2px;
  margin: 0 0 18px;
}

.crezia-walk p{
  font-family: "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-weight: 500;
  font-size: clamp(1rem, 1.35vw, 1.25rem);
  line-height: 1.6;
  margin: 0;
}

/* — Image side — */
.crezia-walk .split-image{
  position: relative;
  overflow: hidden;
  background: #fff;
}
.crezia-walk .split-image img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;     /* γεμίζει το πάνελ δεξιά καθαρά */
}

/* Responsive */
@media (max-width: 980px){
  .crezia-split{
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .crezia-walk .split-image{
    order: 2;
    height: 42vh;       /* στα κινητά η εικόνα παίρνει ύψος παραθύρου */
  }
  .crezia-walk .split-text{
    order: 1;
    padding: 28px 22px;
  }
}
/* === CREZIA • Walk block: ίδιο μέγεθος γραμματοσειράς (≈30px) ======== */
:root{
  --walk-font: 30px;   /* παίξε 28–32px αν θες μικρορύθμιση */
  --walk-leading: 1.35;/* line-height */
  --walk-gap: 14px;    /* απόσταση τίτλου–κειμένου */
}

.crezia-walk h2,
.crezia-walk p{
  font-size: var(--walk-font);
  line-height: var(--walk-leading);
  margin: 0;
  letter-spacing: 0.2px;
  text-wrap: balance;         /* πιο όμορφα σπασίματα γραμμών (modern) */
}

/* Αν θέλεις ελαφρώς πιο “γεμάτο” τον τίτλο, κράτα μόνο το βάρος διαφορετικό */
.crezia-walk h2{ font-weight: 700; margin-bottom: var(--walk-gap); }
.crezia-walk p { font-weight: 500; }

/* Mobile (προσαρμόζεται πιο μικρό) */
@media (max-width: 980px){
  :root{
    --walk-font: 22px;
    --walk-leading: 1.4;
    --walk-gap: 12px;
  }
}
/* === CREZIA • Walk block — Uniform text (no bold) ===================== */
:root{
  --walk-font: 30px;     /* ~30px desktop */
  --walk-leading: 1.35;  /* line-height */
  --walk-weight: 500;    /* ίδια βαρύτητα και στα δύο (ή 400 αν τα θες πιο light) */
  --walk-gap: 14px;      /* απόσταση μεταξύ των δύο φράσεων */
}

.crezia-walk h2,
.crezia-walk p{
  font-family: "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: var(--walk-font);
  line-height: var(--walk-leading);
  font-weight: var(--walk-weight);
  letter-spacing: 0.2px;
  margin: 0;
  text-wrap: balance;
}

.crezia-walk h2{ margin-bottom: var(--walk-gap); }

/* Responsive */
@media (max-width: 980px){
  :root{
    --walk-font: 22px;
    --walk-leading: 1.4;
    --walk-gap: 12px;
  }
}
/* === CREZIA • Οριζόντια ευθυγράμμιση με το άνω gallery ================ */
/* Ρύθμιση: βάλε εδώ το ίδιο side gap που έχεις στις 4 φωτογραφίες */
:root{
  --gallery-side-gap: 8px; /* π.χ. 8px, 12px, 16px — ό,τι έχεις στο πάνω strip */
}

/* Εφαρμόζουμε το ίδιο οριζόντιο κενό στο split section */
.crezia-split.crezia-walk{
  padding-left: var(--gallery-side-gap);
  padding-right: var(--gallery-side-gap);
}

/* Και “φέρνουμε” την δεξιά εικόνα λίγο πιο μέσα με εσωτερικό padding */
.crezia-walk .split-image{
  padding-right: var(--gallery-side-gap);
  /* Αν βλέπεις ότι χρειάζεται και λίγο από αριστερά, ξεκλείδωσε την επόμενη: */
  /* padding-left: var(--gallery-side-gap); */
  box-sizing: border-box;
}

/* Φροντίζουμε η εικόνα να γεμίζει σωστά τον διαθέσιμο χώρο μετά το padding */
.crezia-walk .split-image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Mobile: συνήθως λίγο μικρότερο κενό δείχνει πιο καθαρό */
@media (max-width: 980px){
  :root{ --gallery-side-gap: 10px; }
}
/* CREZIA • Walk image uniform scale */
:root{
  --walk-img-scale: 0.80;   /* 0.90 = -10% (δοκίμασε 0.88–0.94) */
  --walk-img-shift-x: 0px;  /* προαιρετικό “λέπτο” κούνημα οριζόντια */
  --walk-img-shift-y: 0px;  /* προαιρετικό “λέπτο” κούνημα κάθετα  */
}

.crezia-walk .split-image{
  overflow: hidden;                 /* κρύβει τυχόν περίσσευμα */
  display: flex; align-items: center; justify-content: center;
}

.crezia-walk .split-image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: translate(var(--walk-img-shift-x), var(--walk-img-shift-y))
             scale(var(--walk-img-scale));
  transform-origin: center center;
  transition: transform .3s ease;   /* ομαλή αλλαγή αν το πειράξεις live */
  will-change: transform;
}
/* === CREZIA • Round grid of 4 images ================================= */
:root{
  --st-side-gap: 12px;   /* κενό αριστερά/δεξιά (ταιριάξ’ το με τα πάνω galleries) */
  --st-gap: 12px;        /* κενό ανάμεσα στα items */
  --st-caption-size: 16px;
  --st-caption-weight: 600;
  --st-y: 48px;          /* απόσταση πάνω/κάτω από άλλα sections */
}

.crezia-round-grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--st-gap);
  padding: 0 var(--st-side-gap);
  margin: var(--st-y) 0;
  align-items: start;
}

/* Κάρτα/στοιχείο */
.st-card{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* Στρογγυλή εικόνα */
.st-thumb{
  width: 100%;
  aspect-ratio: 1 / 1;      /* τέλειος κύκλος */
  border-radius: 9999px;
  overflow: hidden;
  background: #f3f3f3;
}

.st-thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;         /* γεμίζει τον κύκλο ομοιόμορφα */
  display: block;
}

/* Λεζάντες */
.st-caption{
  margin: 10px 8px 0;
  font-family: "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: var(--st-caption-size);
  font-weight: var(--st-caption-weight);
  line-height: 1.35;
  color: #000;
  text-wrap: balance;
}

/* — Responsive — */
@media (max-width: 1100px){
  .crezia-round-grid{ gap: 10px; }
}
@media (max-width: 900px){
  .crezia-round-grid{
    grid-template-columns: repeat(2, 1fr); /* 2-στηλες στα κινητά */
    --st-side-gap: 10px;
    --st-y: 36px;
  }
  .st-caption{ font-size: 15px; }
}
@media (max-width: 520px){
  .st-caption{ font-size: 14px; }
}
/* === CREZIA • Big centered prompt ==================================== */
:root{
  --prompt-y: 56px;                     /* κατακόρυφο κενό πάνω/κάτω */
  --prompt-size: clamp(2.2rem, 4.5vw, 4rem); /* μέγεθος γραμματοσειράς */
  --prompt-weight: 700;                 /* 700 = bold, βάλε 600 αν το θες πιο light */
  --prompt-letter: 0.2px;               /* μικρό letter-spacing */
}

.crezia-prompt{
  margin: var(--prompt-y) 0;
  display: grid;
  place-items: center;
  padding: 0 4vw;                       /* μικρό οριζόντιο cushion */
  text-align: center;
  background: #fff;
  color: #000;
}

.crezia-prompt h2{
  margin: 0;
  font-family: "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: var(--prompt-size);
  font-weight: var(--prompt-weight);
  line-height: 1.15;
  letter-spacing: var(--prompt-letter);
  text-wrap: balance;                   /* πιο όμορφα σπασίματα γραμμών */
}

/* Mobile fine-tune */
@media (max-width: 900px){
  :root{
    --prompt-y: 44px;
  }
}
/* === CREZIA • Subprompt (κάτω από το logo) =========================== */
:root{
  --subprompt-y: 44px;                         /* κάθετο κενό γύρω από τη φράση */
  --subprompt-size: clamp(1.6rem, 3vw, 2.4rem);
  --subprompt-weight: 600;                     /* 600 = semi-bold */
  --subprompt-letter: 0.2px;
}

.crezia-subprompt{
  margin: var(--subprompt-y) 0;
  display: grid;
  place-items: center;
  padding: 0 4vw;
  text-align: center;
  background: #fff;
  color: #000;
}

.crezia-subprompt h2{
  margin: 0;
  font-family: "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: var(--subprompt-size);
  font-weight: var(--subprompt-weight);
  line-height: 1.2;
  letter-spacing: var(--subprompt-letter);
  text-wrap: balance;
}

@media (max-width: 900px){
  :root{ --subprompt-y: 36px; }
}
/* === CREZIA • Subprompt down arrow =================================== */
:root{
  --arrow-size: 28px;         /* μέγεθος βέλους */
  --arrow-stroke: 2.2;        /* πάχος γραμμής */
  --arrow-color: #000;        /* χρώμα */
  --arrow-gap: 10px;          /* απόσταση κάτω από το h2 */
  --arrow-bounce: 10px;       /* ένταση ελαφρού bounce */
}

.crezia-subprompt .subprompt-arrow{
  margin-top: var(--arrow-gap);
  display: grid;
  place-items: center;
}

.crezia-subprompt .subprompt-arrow .arrow-svg{
  width: var(--arrow-size);
  height: var(--arrow-size);
  display: block;
}

.crezia-subprompt .subprompt-arrow .arrow-svg path{
  fill: none;
  stroke: var(--arrow-color);
  stroke-width: var(--arrow-stroke);
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Ελαφρύ, διακριτικό bounce για προσοχή (προαιρετικό) */
@media (prefers-reduced-motion: no-preference){
  .crezia-subprompt .subprompt-arrow{
    animation: arrowBounce 2.2s ease-in-out infinite;
  }
  @keyframes arrowBounce{
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(var(--arrow-bounce)); }
  }
}

/* Mobile fine-tune */
@media (max-width: 900px){
  :root{
    --arrow-size: 26px;
    --arrow-gap: 8px;
    --arrow-bounce: 8px;
  }
}
/* === CREZIA • 3-up video strip — CLEAN STABLE ====================== */
:root{
  --vs-side: 12px;         /* κενό αριστερά/δεξιά */
  --vs-gap: 14px;          /* κενό ανάμεσα στα 3 μεγάλα containers */
  --vs-radius: 14px;       /* στρογγύλεμα γωνιών */
  --vs-ratio-w: 2;         /* 2:1 λόγος πλευρών */
  --vs-ratio-h: 1;
}

.crezia-video-strip{
  margin: 56px 0;
  padding: 0 var(--vs-side);
}

.vs-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--vs-gap);
}

.vs-item{
  position: relative;
  aspect-ratio: var(--vs-ratio-w) / var(--vs-ratio-h); /* 2:1 */
  border-radius: var(--vs-radius);
  overflow: hidden;
  background: #f3f3f3;
}

.vs-item > video,
.vs-item > img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  background: #000;
}

/* =================== BLOCK #1 ΚΑΙ BLOCK #3 (ΙΔΙΑ) =================== */
/* Στόχευση και του 1ου ΚΑΙ του 3ου container */
.vs-grid > .vs-item:nth-child(1) .vc-grid,
.vs-grid > .vs-item:nth-child(3) .vc-grid{
  position: absolute; inset: 0;
  display: grid;
  grid-template-columns: 25% 1fr;               /* A στενό, B φαρδύ */
  grid-template-rows: calc(33.333% * 1.10) 1fr; /* πάνω ~1/3*1.1, κάτω υπόλοιπο */
  gap: var(--vs-gap);
  z-index: 1;
}

/* Πάνω σειρά: A (στενό) + B (φαρδύ) */
.vs-grid > .vs-item:nth-child(1) .vc-a,
.vs-grid > .vs-item:nth-child(3) .vc-a{ grid-area: 1 / 1 / 2 / 2; }

.vs-grid > .vs-item:nth-child(1) .vc-b,
.vs-grid > .vs-item:nth-child(3) .vc-b{ grid-area: 1 / 2 / 2 / 3; }

/* Κάτω σειρά: wrapper που πιάνει όλο το row, C & D = 50/50 */
.vs-grid > .vs-item:nth-child(1) .vc-bottom,
.vs-grid > .vs-item:nth-child(3) .vc-bottom{
  grid-area: 2 / 1 / 3 / 3;
  display: grid;
  grid-template-columns: 1fr 1fr; /* C & D 50/50 σε πλάτος */
  gap: var(--vs-gap);
  height: 100%;
}

.vs-grid > .vs-item:nth-child(1) .vc,
.vs-grid > .vs-item:nth-child(3) .vc{
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  background: #f9f9f9;
  border: 2px solid #e8e8e8; /* πλαίσιο για να φαίνονται τα όρια */
}

.vs-grid > .vs-item:nth-child(1) .vc > video,
.vs-grid > .vs-item:nth-child(3) .vc > video,
.vs-grid > .vs-item:nth-child(1) .vc > img,
.vs-grid > .vs-item:nth-child(3) .vc > img{
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}

.vs-grid > .vs-item:nth-child(1) .vc-ph,
.vs-grid > .vs-item:nth-child(3) .vc-ph{
  position: absolute; inset: 0;
  display: grid; place-items: center;
  font: 700 18px/1 "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color: #222; opacity: .9;
  background: repeating-linear-gradient(-45deg,#fafafa,#fafafa 12px,#f3f3f3 12px,#f3f3f3 24px);
}

/* =========================== BLOCK #2 (INVERTED) ===================== */
.vs-grid > .vs-item:nth-child(2) .vc2-grid{
  position: absolute; inset: 0;
  display: grid;
  grid-template-rows: 1fr calc(33.333% * 1.10); /* πάνω βαθύ, κάτω ρηχό */
  gap: var(--vs-gap);
}

/* Πάνω: C & D 50/50 */
.vs-grid > .vs-item:nth-child(2) .vc2-top{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--vs-gap);
}

.vs-grid > .vs-item:nth-child(2) .vc2-top .vc{
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  background: #f9f9f9;
  border: 2px solid #e8e8e8;
}

/* Κάτω: B φαρδύ αριστερά, A στενό δεξιά (75% / 25%) */
.vs-grid > .vs-item:nth-child(2) .vc2-b,
.vs-grid > .vs-item:nth-child(2) .vc2-a{
  border-radius: 12px;
  background: #f9f9f9;
  border: 2px solid #e8e8e8;
}

.vs-grid > .vs-item:nth-child(2) .vc2-b,
.vs-grid > .vs-item:nth-child(2) .vc2-a{
  display: grid;
}

.vs-grid > .vs-item:nth-child(2) .vc2-grid{
  grid-auto-flow: row;
}

.vs-grid > .vs-item:nth-child(2) .vc2-grid > .vc2-b,
.vs-grid > .vs-item:nth-child(2) .vc2-grid > .vc2-a{
  display: block;
}

.vs-grid > .vs-item:nth-child(2) .vc2-grid{
  /* κάτω σειρά δύο στήλες 3:1 */
}
.vs-grid > .vs-item:nth-child(2) .vc2-grid{
  /* τυλίγουμε την κάτω σειρά σε grid δύο στηλών */
}
.vs-grid > .vs-item:nth-child(2) .vc2-b,
.vs-grid > .vs-item:nth-child(2) .vc2-a{
  /* θα τοποθετηθούν με βοηθητικό grid */
}

.vs-grid > .vs-item:nth-child(2) .vc2-grid{
  /* δημιουργούμε βοηθητικό layer για την κάτω σειρά */
}
.vs-grid > .vs-item:nth-child(2) .vc2-grid{
  display: grid;
  grid-template-rows: 1fr calc(33.333% * 1.10);
}

.vs-grid > .vs-item:nth-child(2) .vc2-grid > .vc2-b,
.vs-grid > .vs-item:nth-child(2) .vc2-grid > .vc2-a{
  /* κάτω row */
  grid-row: 2;
}

.vs-grid > .vs-item:nth-child(2) .vc2-grid{
  /* ορίζουμε 2 στήλες στη 2η σειρά: 3fr | 1fr */
}
.vs-grid > .vs-item:nth-child(2) .vc2-b{ grid-column: 1 / span 1; }
.vs-grid > .vs-item:nth-child(2) .vc2-a{ grid-column: 2 / span 1; }

.vs-grid > .vs-item:nth-child(2) .vc2-grid{
  grid-template-columns: 3fr 1fr;
  gap: var(--vs-gap);
}

/* placeholder */
.vs-grid > .vs-item:nth-child(2) .vc-ph{
  position: absolute; inset: 0;
  display: grid; place-items: center;
  font: 700 18px/1 "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color: #222; opacity: .9;
  background: repeating-linear-gradient(-45deg,#fafafa,#fafafa 12px,#f3f3f3 12px,#f3f3f3 24px);
}

/* κοινό για video/img μέσα στα μικρά */
.vs-grid .vc > video, .vs-grid .vc > img{ width:100%; height:100%; object-fit:cover; display:block; }

/* — Responsive — */
@media (max-width: 900px){
  .vs-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 620px){
  .vs-grid{ grid-template-columns: 1fr; }
  :root{ --vs-side: 10px; }
}
/* === CREZIA • 3-up video strip (v3 • STRONG FRAMES, SQUARE CORNERS) === */
:root{
  --v3-side: 12px;      /* κενό αριστερά/δεξιά */
  --v3-gap: 16px;       /* κενό ανάμεσα στα 3 μεγάλα containers */
  --v3-height: 320px;   /* ύψος κάθε μεγάλου container (desktop) */
}

/* Εξωτερικό section */
.crezia-video-strip-v3{
  margin: 56px 0;
  padding: 0 var(--v3-side);
}

/* 3 στήλες ίσου πλάτους */
.crezia-video-strip-v3 .vs-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--v3-gap);
}

/* Κάθε μεγάλο container: ΜΑΥΡΟ background + ΠΑΧΥ μαύρο περίγραμμα */
.crezia-video-strip-v3 .vs-item{
  position: relative;
  height: var(--v3-height);
  min-height: var(--v3-height);
  overflow: hidden;
  background: #000;                   /* μαύρο “παράθυρο” */
  border: 3px solid #000;             /* έντονο πλαίσιο */
  outline: 0;
  border-radius: 0;                    /* ΤΕΤΡΑΓΩΝΕΣ ΓΩΝΙΕΣ */
}

/* ====== Layout A (Blocks #1 & #3) ====== */
.crezia-video-strip-v3 .vs-item.vsA .vc-grid{
  position: absolute; inset: 0;
  display: grid;
  grid-template-columns: 25% 1fr;     /* A στενό, B φαρδύ */
  grid-template-rows: 35% 1fr;        /* πάνω ~35%, κάτω υπόλοιπο */
  gap: var(--v3-gap);
}

/* Θέσεις */
.crezia-video-strip-v3 .vs-item.vsA .vc-a{ grid-area: 1 / 1 / 2 / 2; }
.crezia-video-strip-v3 .vs-item.vsA .vc-b{ grid-area: 1 / 2 / 2 / 3; }
.crezia-video-strip-v3 .vs-item.vsA .vc-bottom{
  grid-area: 2 / 1 / 3 / 3;
  display: grid;
  grid-template-columns: 1fr 1fr;     /* C & D 50/50 */
  gap: var(--v3-gap);
}

/* ====== Layout B (Block #2 — ανεστραμμένο) ====== */
.crezia-video-strip-v3 .vs-item.vsB .vc2-grid{
  position: absolute; inset: 0;
  display: grid;
  grid-template-rows: 1fr 35%;        /* επάνω βαθύ, κάτω ρηχό */
  grid-template-columns: 3fr 1fr;     /* κάτω: B 75% αριστερά, A 25% δεξιά */
  gap: var(--v3-gap);
}
.crezia-video-strip-v3 .vs-item.vsB .vc2-top{
  grid-row: 1 / 2; grid-column: 1 / 3; /* Top row: όλο το πλάτος */
  display: grid;
  grid-template-columns: 1fr 1fr;       /* C & D 50/50 επάνω */
  gap: var(--v3-gap);
}
.crezia-video-strip-v3 .vs-item.vsB .vc2-b{ grid-row: 2; grid-column: 1; }
.crezia-video-strip-v3 .vs-item.vsB .vc2-a{ grid-row: 2; grid-column: 2; }

/* ====== Κοινό για μικρά holders — ΜΑΥΡΟ φόντο + ΠΑΧΥ περίγραμμα ====== */
.crezia-video-strip-v3 .vc{
  position: relative;
  overflow: hidden;
  background: #000;                   /* ΜΑΥΡΟ ΕΣΩΤΕΡΙΚΟ */
  border: 3px solid #000;             /* ΠΑΧΥ ΜΑΥΡΟ πλαίσιο */
  border-radius: 0;                   /* τετράγωνες γωνίες */
}

/* Αν μπει βίντεο/εικόνα αργότερα */
.crezia-video-strip-v3 .vc > video,
.crezia-video-strip-v3 .vc > img{
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}

/* ====== Placeholders (A/B/C/D) — Λευκά γράμματα, έντονα, στο κέντρο ====== */
.crezia-video-strip-v3 .vc-ph{
  position: absolute; inset: 0;
  display: grid; place-items: center;
  color: #fff;                         /* ΛΕΥΚΑ ΓΡΑΜΜΑΤΑ πάνω σε μαύρο */
  background: transparent;             /* χωρίς μοτίβο, καθαρό */
  font-family: "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-weight: 800;
  font-size: clamp(28px, 4vw, 48px);   /* να φαίνεται ΚΑΘΑΡΑ */
  letter-spacing: .02em;
}

/* ====== Responsive ύψη/στήλες ====== */
@media (max-width: 1100px){
  :root{ --v3-height: 300px; }
}
@media (max-width: 900px){
  .crezia-video-strip-v3 .vs-grid{ grid-template-columns: repeat(2, 1fr); }
  :root{ --v3-height: 260px; }
}
@media (max-width: 620px){
  .crezia-video-strip-v3 .vs-grid{ grid-template-columns: 1fr; }
  :root{ --v3-side: 10px; --v3-height: 210px; }
}
/* === CREZIA • Video strip (cv3) — 3 blocks οριζόντια, καθαρά frames === */
:root{
  --cv3-side: 12px;    /* αριστερά/δεξιά κενό του section */
  --cv3-gap: 16px;     /* κενό ανάμεσα στα 3 μεγάλα containers */
  --cv3-h: 320px;      /* ύψος κάθε μεγάλου container (desktop) */
}

/* Εξωτερικό section */
.crezia-video-strip.cv3{
  margin: 56px 0;
  padding: 0 var(--cv3-side);
}

/* 3 στήλες, ίσου πλάτους */
.crezia-video-strip .cv3-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--cv3-gap);
}

/* Μεγάλο container (ένα από τα τρία) */
.crezia-video-strip .cv3-item{
  position: relative;
  height: var(--cv3-h);
  min-height: var(--cv3-h);
  background: #fff;
  border: 0;
  overflow: hidden;
}

/* ===== Layout A (Block #1 και Block #3) ===== */
.crezia-video-strip .cv3-item.cv3A .cv3A-grid{
  position: absolute; inset: 0;
  display: grid;
  grid-template-columns: 25% 1fr;  /* A στενό, B φαρδύ */
  grid-template-rows: 35% 1fr;     /* πάνω ~35%, κάτω υπόλοιπο */
  gap: var(--cv3-gap);
}

/* Θέσεις */
.crezia-video-strip .cv3-item.cv3A .cv3A-grid .a{ grid-area: 1 / 1 / 2 / 2; }
.crezia-video-strip .cv3-item.cv3A .cv3A-grid .b{ grid-area: 1 / 2 / 2 / 3; }
.crezia-video-strip .cv3-item.cv3A .cv3A-grid .cv3-bottom{
  grid-area: 2 / 1 / 3 / 3;
  display: grid;
  grid-template-columns: 1fr 1fr; /* C & D 50/50 */
  gap: var(--cv3-gap);
}

/* ===== Layout B (Block #2 — ανεστραμμένο) ===== */
.crezia-video-strip .cv3-item.cv3B .cv3B-grid{
  position: absolute; inset: 0;
  display: grid;
  grid-template-rows: 1fr 35%;     /* επάνω βαθύ, κάτω ρηχό */
  grid-template-columns: 3fr 1fr;  /* κάτω: B 75% αριστερά, A 25% δεξιά */
  gap: var(--cv3-gap);
}

/* Επάνω: C & D 50/50 */
.crezia-video-strip .cv3-item.cv3B .cv3-top{
  grid-row: 1 / 2; grid-column: 1 / 3;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--cv3-gap);
}
/* Κάτω: B αριστερά (φαρδύ), A δεξιά (στενό) */
.crezia-video-strip .cv3-item.cv3B .b{ grid-row: 2; grid-column: 1; }
.crezia-video-strip .cv3-item.cv3B .a{ grid-row: 2; grid-column: 2; }

/* ===== Κοινό στυλ για τα μικρά "holders" ===== */
.crezia-video-strip .cv3-cell{
  position: relative;
  background: #000;           /* μαύρο για να φαίνονται καθαρά */
  border: 3px solid #000;     /* έντονο πλαίσιο */
  border-radius: 0;           /* τετράγωνες γωνίες */
  overflow: hidden;
}
.crezia-video-strip .cv3-cell > video,
.crezia-video-strip .cv3-cell > img{
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}

/* Placeholder γράμμα στο κέντρο (A/B/C/D) */
.crezia-video-strip .cv3-cell > span{
  position: absolute; inset: 0;
  display: grid; place-items: center;
  color: #fff;
  font: 800 clamp(28px, 4vw, 48px)/1 "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  letter-spacing: .02em;
}

/* — Responsive προσαρμογές — */
@media (max-width: 1100px){
  :root{ --cv3-h: 300px; }
}
@media (max-width: 900px){
  .crezia-video-strip .cv3-grid{ grid-template-columns: repeat(2, 1fr); }
  :root{ --cv3-h: 260px; }
}
@media (max-width: 620px){
  .crezia-video-strip .cv3-grid{ grid-template-columns: 1fr; }
  :root{ --cv3-side: 10px; --cv3-h: 210px; }
}
/* === CREZIA • cv3 height +50% (override) === */
:root{
  /* από 320px -> 480px */
  --cv3-h: 480px;
}

/* breakpoints +50% */
@media (max-width: 1100px){
  :root{ --cv3-h: 450px; }   /* πριν 300px */
}
@media (max-width: 900px){
  :root{ --cv3-h: 390px; }   /* πριν 260px */
}
@media (max-width: 620px){
  :root{ --cv3-h: 315px; }   /* πριν 210px */
}
/* ====== CREZIA • VIDEO STRIP — HARD OVERRIDE (FINAL) ====== */
/* ΠΑΣΤΑΡΕ ΤΟ ΣΤΟ ΤΕΛΟΣ ΤΟΥ style.css  */

:root{
  --vs-side: 12px;        /* αριστερά/δεξιά κενό του section */
  --vs-gap: 14px;         /* κενό ανάμεσα στα items & εσωτερικά holders */
  --vs-radius: 12px;      /* στρογγύλεμα */
  --vs-height: 520px;     /* <<< ΡΥΘΜΙΖΕΙΣ ΥΨΟΣ ΤΩΝ 3 CONTAINERS ΕΔΩ */
}

/* Section / Grid (3 items οριζόντια) */
.crezia-video-strip{ margin:56px 0; padding:0 var(--vs-side); }
.crezia-video-strip .vs-grid{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:var(--vs-gap); align-items:stretch;
}

/* Κάθε μεγάλο container (vs-item) έχει σταθερό ύψος */
.crezia-video-strip .vs-item{
  position:relative;
  height:var(--vs-height) !important;
  min-height:var(--vs-height) !important;
  max-height:var(--vs-height) !important;
  border-radius:var(--vs-radius);
  overflow:hidden;
  background:#0a0a0a; /* σκούρο για να φαίνονται τα πλαίσια μέχρι να μπουν βίντεο */
}

/* Βίντεο/εικόνα γεμίζουν 100% */
.crezia-video-strip .vs-item > video,
.crezia-video-strip .vs-item > img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover; display:block;
}

/* ===== Block #1 & Block #3 — ίδιο layout (A/B επάνω, C&D 50/50 κάτω) ===== */
.crezia-video-strip .vs-item .vc-grid{
  position:absolute; inset:0;
  display:grid;
  grid-template-columns: 25% 1fr;     /* A στενό, B φαρδύ */
  grid-template-rows: 34% 1fr;        /* πάνω 34%, κάτω όλο το υπόλοιπο */
  gap:var(--vs-gap);
}

/* Θέσεις επάνω σειράς */
.crezia-video-strip .vs-item .vc-a{ grid-area:1 / 1 / 2 / 2; }
.crezia-video-strip .vs-item .vc-b{ grid-area:1 / 2 / 2 / 3; }

/* Κάτω σειρά: wrapper που πιάνει όλο το κάτω row */
.crezia-video-strip .vs-item .vc-bottom{
  grid-area:2 / 1 / 3 / 3;
  display:grid; grid-template-columns:1fr 1fr; /* C & D = 50/50 */
  gap:var(--vs-gap); height:100%;
}

/* ===== Block #2 — «τούμπα» =====
   Επάνω: C & D 50/50
   Κάτω:  B φαρδύ αριστερά, A στενό δεξιά
*/
.crezia-video-strip .vs-grid > .vs-item:nth-child(2) .vc2-grid{
  position:absolute; inset:0;
  display:grid; gap:var(--vs-gap);
  grid-template-rows: 1fr 34%;
  grid-template-columns: 1fr 25%;  /* B φαρδύ (αριστερά), A στενό (δεξιά) */
}

/* Επάνω 50/50 */
.crezia-video-strip .vs-grid > .vs-item:nth-child(2) .vc2-top{
  grid-area:1 / 1 / 2 / 3;
  display:grid; grid-template-columns:1fr 1fr; gap:var(--vs-gap); height:100%;
}

/* Κάτω: B αριστερά μεγάλο, A δεξιά στενό */
.crezia-video-strip .vs-grid > .vs-item:nth-child(2) .vc2-b{ grid-area:2 / 1 / 3 / 2; }
.crezia-video-strip .vs-grid > .vs-item:nth-child(2) .vc2-a{ grid-area:2 / 2 / 3 / 3; }

/* ===== Μικρά holders (A,B,C,D) — εμφανή περιγράμματα ===== */
.crezia-video-strip .vs-item .vc,
.crezia-video-strip .vs-item .vc-bottom .vc,
.crezia-video-strip .vs-grid > .vs-item:nth-child(2) .vc2-top .vc{
  position:relative; overflow:hidden;
  background:#000;
  border:2px solid rgba(255,255,255,.65);  /* δυνατό περίγραμμα για να φαίνονται καθαρά */
  border-radius:8px;
}

/* Βίντεο μέσα στα μικρά holders */
.crezia-video-strip .vs-item .vc > video,
.crezia-video-strip .vs-item .vc-bottom .vc > video,
.crezia-video-strip .vs-grid > .vs-item:nth-child(2) .vc2-top .vc > video{
  width:100%; height:100%; object-fit:cover; display:block;
}

/* ===== Responsive (μικρότερα ύψη) ===== */
@media (max-width:1180px){ :root{ --vs-height: 460px; } }
@media (max-width:980px){
  .crezia-video-strip .vs-grid{ grid-template-columns:repeat(2,1fr); }
  :root{ --vs-height: 420px; }
}
@media (max-width:680px){
  .crezia-video-strip .vs-grid{ grid-template-columns:1fr; }
  :root{ --vs-height: 360px; }
}
/* ============== CREZIA • CV3 VIDEO STRIP (isolated) ============== */
:root{
  --cv3-side: 12px;      /* κενό αριστερά/δεξιά του section */
  --cv3-gap: 14px;       /* κενό ανάμεσα στα 3 containers & εσωτερικά */
  --cv3-radius: 10px;    /* στρογγύλεμα */
  --cv3-height: 520px;   /* <<< ύψος των 3 μεγάλων containers */
  --cv3-stroke: 2px;     /* πάχος περιγράμματος στους μικρούς holders */
}

.cv3-strip{ margin:56px 0; padding:0 var(--cv3-side); }
.cv3-grid{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:var(--cv3-gap); align-items:stretch;
}

/* Μεγάλο container */
.cv3-item{
  position:relative;
  height:var(--cv3-height);
  min-height:var(--cv3-height);
  max-height:var(--cv3-height);
  background:#0b0b0b; border-radius:var(--cv3-radius);
  overflow:hidden;
}

/* = Block 1 & 3: επάνω A(στενό)/B(φαρδύ), κάτω C&D = 50/50 = */
.cv3-g1{
  position:absolute; inset:0;
  display:grid; gap:var(--cv3-gap);
  grid-template-columns:25% 1fr;   /* A στενό, B φαρδύ */
  grid-template-rows:34% 1fr;      /* επάνω 34%, κάτω το υπόλοιπο */
}
.cv3-a{ grid-area:1 / 1 / 2 / 2; }
.cv3-b{ grid-area:1 / 2 / 2 / 3; }
.cv3-bottom{
  grid-area:2 / 1 / 3 / 3;
  display:grid; grid-template-columns:1fr 1fr; gap:var(--cv3-gap);
}
.cv3-c{ grid-column:1; }
.cv3-d{ grid-column:2; }

/* = Block 2 (ανεστραμμένο) : επάνω C&D 50/50, κάτω B(φαρδύ-αριστερά) + A(στενό-δεξιά) = */
.cv3-g2{
  position:absolute; inset:0;
  display:grid; gap:var(--cv3-gap);
  grid-template-rows:1fr 34%;
  grid-template-columns:1fr 25%;   /* κάτω: B αριστερά φαρδύ, A δεξιά στενό */
}
.cv3-top{
  grid-area:1 / 1 / 2 / 3; display:grid;
  grid-template-columns:1fr 1fr; gap:var(--cv3-gap);
}
.cv3-b-wide{ grid-area:2 / 1 / 3 / 2; } /* B κάτω-αριστερά (φαρδύ) */
.cv3-a-narrow{ grid-area:2 / 2 / 3 / 3; } /* A κάτω-δεξιά (στενό) */

/* Μικροί holders */
.cv3-cell{
  position:relative; overflow:hidden;
  background:#000;
  border:var(--cv3-stroke) solid rgba(255,255,255,.85); /* έντονο πλαίσιο */
  border-radius:8px;
}
.cv3-cell > video, .cv3-cell > img{
  width:100%; height:100%; object-fit:cover; display:block;
}

/* Προσωρινά labels (για να βλέπεις καθαρά τις θέσεις) */
.cv3-ph{
  position:absolute; inset:0; display:grid; place-items:center;
  font:800 24px/1.1 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:#fff; letter-spacing:.06em;
  background:repeating-linear-gradient(-45deg,#1c1c1c,#1c1c1c 14px,#161616 14px,#161616 28px);
  text-shadow:0 2px 6px rgba(0,0,0,.6);
}

/* Responsive */
@media (max-width:1180px){ :root{ --cv3-height: 460px; } }
@media (max-width:980px){
  .cv3-grid{ grid-template-columns:repeat(2,1fr); }
  :root{ --cv3-height: 420px; }
}
@media (max-width:680px){
  .cv3-grid{ grid-template-columns:1fr; }
  :root{ --cv3-height: 360px; }
}
/* ===== CREZIA • CV3 overrides: white gaps + sharp corners + show videos ===== */
:root{
  --cv3-gap: 14px;     /* κρατάμε το ίδιο, άλλαξε το αν θέλεις πιο μικρό/μεγάλο κενό */
  --cv3-radius: 0px;   /* ⬅️ ίσιες γωνίες παντού */
}

/* Τα 3 μεγάλα containers έχουν λευκό background ώστε το gap να είναι λευκό */
.cv3-item{
  background: #fff !important;
  border-radius: 0 !important;
  overflow: hidden; /* κρατά τα εσωτερικά μέσα στα όρια */
}

/* Εσωτερικά grids (και στα δύο layouts) – δεν χρειάζεται αλλαγή εδώ, μόνο κληρονομεί το gap */
.cv3-g1, .cv3-g2, .cv3-bottom, .cv3-top{
  gap: var(--cv3-gap) !important;
}

/* Μικρά holders: ίσιες γωνίες, χωρίς περίγραμμα, τελείως «καθαρά» */
.cv3-cell{
  border: none !important;
  border-radius: 0 !important;
  background: #000;        /* μαύρο καμβάς κάτω από το video */
  overflow: hidden;
}

/* Βίντεο εμφανίζονται πάντα σωστά */
.cv3-cell > video,
.cv3-cell > img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  position: relative;
  z-index: 1;
}

/* Απενεργοποιούμε τα placeholders για να μη «σκεπάζουν» τυχόν video */
.cv3-ph{ display: none !important; }
/* === CREZIA • Rotate-only for Video Container #3 (A right, B left) === */
/* Στο 3ο .vs-item, αλλάζουμε ΜΟΝΟ την πάνω σειρά: A↔B οριζόντια */
.crezia-video-strip .vs-grid > .vs-item:nth-child(3) .vc-grid{
  /* αντιστρέφουμε το πλάτος των δύο στηλών: πρώτα το φαρδύ (B), μετά το στενό (A) */
  grid-template-columns: 1fr 25% !important;
}

/* Βάζουμε το B στην αριστερή στήλη της πάνω σειράς */
.crezia-video-strip .vs-grid > .vs-item:nth-child(3) .vc-b{
  grid-area: 1 / 1 / 2 / 2 !important;
}

/* Και το A στη δεξιά στήλη της πάνω σειράς */
.crezia-video-strip .vs-grid > .vs-item:nth-child(3) .vc-a{
  grid-area: 1 / 2 / 2 / 3 !important;
}

/* Το κάτω wrapper (C & D 50/50) μένει όπως είναι */
.crezia-video-strip .vs-grid > .vs-item:nth-child(3) .vc-bottom{
  grid-area: 2 / 1 / 3 / 3 !important;
}
/* === CREZIA • VIDEO STRIP — FINAL, STABLE, NAMESPACED ================= */

/* Ρυθμίσεις */
:root{
  --vs-side: 12px;          /* κενό αριστερά/δεξιά του strip */
  --vs-gap: 14px;           /* κενό ανάμεσα στα 3 μεγάλα containers */
  --vs-h: 460px;            /* ύψος κάθε μεγάλου container (desktop) */
  --vs-h-md: 360px;
  --vs-h-sm: 240px;
}

/* Βασικό πλαίσιο strip */
section.crezia-video-strip{
  margin: 56px 0;
  padding: 0 var(--vs-side);
  background: #fff;
}

/* 3 κολώνες σταθερά (desktop) */
.crezia-video-strip .vs-grid{
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: var(--vs-gap) !important;
  align-items: stretch !important;
}

/* Κάθε “container” (figure) έχει σταθερό ύψος και sharp γωνίες */
.crezia-video-strip .vs-item{
  position: relative !important;
  display: block !important;
  height: var(--vs-h) !important;
  min-height: var(--vs-h) !important;
  max-height: var(--vs-h) !important;
  background: #fff !important;      /* για να φαίνεται λευκό gap */
  border-radius: 0 !important;       /* sharp corners */
  overflow: hidden !important;
}

/* Κάθε περιεχόμενο μέσα σε vs-item, full-bleed */
.crezia-video-strip .vs-item > video,
.crezia-video-strip .vs-item > img{
  position: absolute; inset: 0 !important;
  width: 100% !important; height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* ================= BLOCK #1 και #3 (ίδιο layout) ===================== */
/* Εσωτερικό grid “vc-grid”: πάνω A/B, κάτω C&D 50/50 */
.crezia-video-strip .vs-item .vc-grid{
  position: absolute; inset: 0;
  display: grid;
  grid-template-columns: 25% 1fr;             /* A στενό (αριστερά), B φαρδύ (δεξιά) */
  grid-template-rows: calc(33.333% * 1.10) 1fr; /* πάνω ~1/3*1.1, κάτω το υπόλοιπο */
  gap: var(--vs-gap);
  padding: var(--vs-gap);
  background: #fff;     /* για να είναι το gap καθαρά λευκό */
}

/* πάνω σειρά */
.crezia-video-strip .vs-item .vc-a{ grid-area: 1 / 1 / 2 / 2; }
.crezia-video-strip .vs-item .vc-b{ grid-area: 1 / 2 / 2 / 3; }

/* κάτω σειρά wrapper που γεμίζει όλο το row και σπάει 50/50 */
.crezia-video-strip .vs-item .vc-bottom{
  grid-area: 2 / 1 / 3 / 3;
  display: grid;
  grid-template-columns: 1fr 1fr; /* C & D = 50/50 */
  gap: var(--vs-gap);
}

/* μικρά holders (sharp, με έντονο περίγραμμα για να φαίνονται τα όρια) */
.crezia-video-strip .vs-item .vc,
.crezia-video-strip .vs-item .vc-bottom .vc{
  position: relative;
  overflow: hidden;
  border: 2px solid #000;    /* έντονο μαύρο πλαίσιο, όπως ζήτησες */
  border-radius: 0;
  background: #000;          /* μέχρι να μπουν τα videos */
}

/* Placeholder γράμματα A/B/C/D (αν δεν έχει video) */
.crezia-video-strip .vs-item .vc-ph{
  position: absolute; inset: 0;
  display: grid; place-items: center;
  font: 700 20px/1 "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color: #fff;
  background: #000;
}

/* ================= BLOCK #2 (ανεστραμμένο 180°) ====================== */
/* Άνω row: C & D 50/50, κάτω row: B φαρδύ αριστερά, A στενό δεξιά */
.crezia-video-strip .vs-item .vc2-grid{
  position: absolute; inset: 0;
  display: grid;
  grid-template-rows: calc(33.333% * 1.10) 1fr;
  gap: var(--vs-gap);
  padding: var(--vs-gap);
  background: #fff;
}

/* Άνω 50/50 */
.crezia-video-strip .vs-item .vc2-top{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--vs-gap);
}

/* Κάτω: B φαρδύ + A στενό */
.crezia-video-strip .vs-item .vc2-b,
.crezia-video-strip .vs-item .vc2-a{
  border: 2px solid #000;
  border-radius: 0;
  background: #000;
  position: relative; overflow: hidden;
}
.crezia-video-strip .vs-item .vc2-b{ grid-row: 2; }
.crezia-video-strip .vs-item .vc2-a{ grid-row: 2; }

/* Κάτω row layout (B αριστερά φαρδύ, A δεξιά στενό) */
.crezia-video-strip .vs-item .vc2-grid{
  grid-template-columns: 1fr 25%;
}
.crezia-video-strip .vs-item .vc2-b{ grid-column: 1; }
.crezia-video-strip .vs-item .vc2-a{ grid-column: 2; }

/* Placeholder και εδώ */
.crezia-video-strip .vs-item .vc2-grid .vc-ph{
  position: absolute; inset: 0;
  display: grid; place-items: center;
  font: 700 20px/1 "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color: #fff; background: #000;
}

/* ======================== RESPONSIVE ================================= */
@media (max-width: 1100px){
  :root{ --vs-h: var(--vs-h-md); }
}
@media (max-width: 900px){
  .crezia-video-strip .vs-grid{ grid-template-columns: repeat(2,1fr) !important; }
}
@media (max-width: 620px){
  :root{ --vs-side: 10px; --vs-h: var(--vs-h-sm); }
  .crezia-video-strip .vs-grid{ grid-template-columns: 1fr !important; }
}
/* === CV3 — Final stable video strip (no conflicts) =================== */
:root{
  --cv3-side: 12px;
  --cv3-gap: 14px;
  --cv3-h: 460px;
  --cv3-h-md: 360px;
  --cv3-h-sm: 240px;
}

/* Strip wrapper */
.cv3-strip{
  margin: 56px 0;
  padding: 0 var(--cv3-side);
  background:#fff;
}

/* 3 στήλες στο desktop */
.cv3-grid{
  display:grid !important;
  grid-template-columns:repeat(3,1fr) !important;
  gap:var(--cv3-gap) !important;
  align-items:stretch !important;
}

/* Κάθε container (item) – σταθερό ύψος, sharp γωνίες */
.cv3-item{
  position:relative !important;
  display:block !important;
  height:var(--cv3-h) !important;
  min-height:var(--cv3-h) !important;
  max-height:var(--cv3-h) !important;
  background:#fff !important;
  border-radius:0 !important;
  overflow:hidden !important;
}

/* Περιεχόμενα full-bleed */
.cv3-item > video,
.cv3-item > img{
  position:absolute; inset:0 !important;
  width:100% !important; height:100% !important;
  object-fit:cover !important; display:block !important;
}

/* ===== Block layout #1 και #3 (A/B πάνω, C&D κάτω 50/50) ============ */
.cv3-item .cv3-grid-in{
  position:absolute; inset:0;
  display:grid;
  grid-template-columns:25% 1fr;
  grid-template-rows:calc(33.333% * 1.10) 1fr;
  gap:var(--cv3-gap);
  padding:var(--cv3-gap);
  background:#fff;
}

/* επάνω σειρά */
.cv3-item .cv3-a{ grid-area:1 / 1 / 2 / 2; }
.cv3-item .cv3-b{ grid-area:1 / 2 / 2 / 3; }

/* κάτω σειρά: wrapper 50/50 */
.cv3-item .cv3-bottom{
  grid-area:2 / 1 / 3 / 3;
  display:grid; grid-template-columns:1fr 1fr;
  gap:var(--cv3-gap); height:100%;
}

/* μικρά holders (έντονο περίγραμμα & μαύρο bg μέχρι να μπουν videos) */
.cv3-item .cv3-box,
.cv3-item .cv3-bottom .cv3-box{
  position:relative; overflow:hidden;
  border:2px solid #000; border-radius:0; background:#000;
}

/* placeholder γράμμα */
.cv3-item .cv3-ph{
  position:absolute; inset:0; display:grid; place-items:center;
  font:700 20px/1 "Sofia Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color:#fff; background:#000;
}

/* ===== Block layout #2 (ανεστραμμένο 180°) =========================== */
/* πάνω: C & D 50/50 — κάτω: B φαρδύ αριστερά, A στενό δεξιά */
.cv3-item .cv3-grid-in-2{
  position:absolute; inset:0;
  display:grid;
  grid-template-columns:1fr 25%;
  grid-template-rows:calc(33.333% * 1.10) 1fr;
  gap:var(--cv3-gap);
  padding:var(--cv3-gap);
  background:#fff;
}

/* πάνω row: 50/50 (C,D) */
.cv3-item .cv3-top-2{
  grid-column:1 / 3; grid-row:1 / 2;
  display:grid; grid-template-columns:1fr 1fr; gap:var(--cv3-gap);
}

/* κάτω row: B wide (αριστερά), A narrow (δεξιά) */
.cv3-item .cv3-b2{ grid-column:1 / 2; grid-row:2 / 3; }
.cv3-item .cv3-a2{ grid-column:2 / 3; grid-row:2 / 3; }
.cv3-item .cv3-b2, .cv3-item .cv3-a2{
  position:relative; overflow:hidden; border:2px solid #000; background:#000; border-radius:0;
}

/* Responsive */
@media (max-width:1100px){
  :root{ --cv3-h: var(--cv3-h-md); }
}
@media (max-width:900px){
  .cv3-grid{ grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:620px){
  :root{ --cv3-side:10px; --cv3-h: var(--cv3-h-sm); }
  .cv3-grid{ grid-template-columns:1fr !important; }
}
/* === CREZIA HEADER RESTORE POSITIONING (final clean) === */
.crezia-header {
  background: #000;              /* μαύρο φόντο */
  position: relative;            /* non-sticky */
  z-index: 50;
}

.crezia-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1280px;
  margin: 0 auto;
  padding: 20px 40px;            /* ύψος header */
  height: 80px;                  /* καθαρό ύψος */
  overflow: visible;
}

.crezia-brand {
  display: flex;
  align-items: center;
  gap: 8px;
}

.crezia-brand__logo {
  width: 62px;
  height: 62px;
  display: block;
  object-fit: contain;
  opacity: 1;
  visibility: visible;
  filter: brightness(1.3);
}

.crezia-brand__text {
  color: #fff;
  font-size: 1.3rem;
  font-weight: 600;
}

.crezia-nav {
  display: flex;
  justify-content: center;
  align-items: center;
}

.crezia-menu {
  display: flex;
  list-style: none;
  gap: 28px;
}

.crezia-menu li a {
  color: #fff;
  font-size: 1rem;
  font-weight: 500;
  text-decoration: none;
  transition: color 0.3s ease;
}

.crezia-menu li a:hover {
  color: #ccc;
}
/* === CREZIA HEADER FONT + LOGO FINAL v2.7 === */

/* Μεγάλο αλλά ισορροπημένο logo */
.crezia-brand__logo {
  width: 320px;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 0 2px rgba(255,255,255,0.9))
          drop-shadow(0 0 6px rgba(0,0,0,0.8))
          brightness(1.35)
          contrast(1.2);
}

/* Κείμενο CREZIA με Poppins, λίγο πιο μεγάλο */
.crezia-brand__text {
  font-family: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 1.35rem;   /* λίγο μεγαλύτερο από τα links */
  font-weight: 600;
  color: #fff;
  position: relative;
  top: 2px;             /* λεπτή ευθυγράμμιση με links */
  line-height: 1;
  letter-spacing: 0.03em;
}
/* === CREZIA LOGO SCALE-UP v2.8-A === */
.crezia-brand__logo {
  width: 640px;          /* Διπλάσιο από πριν */
  height: auto;
  max-height: 80px;      /* κρατά το ύψος ώστε να μη μεγαλώσει ο header */
  object-fit: contain;
  filter: drop-shadow(0 0 2px rgba(255,255,255,0.9))
          drop-shadow(0 0 6px rgba(0,0,0,0.8))
          brightness(1.35)
          contrast(1.2);
}
/* === CREZIA HEADER FINAL v3.6 — Clean & Stable === */
.crezia-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 90px;           /* σταθερό ύψος header */
  padding: 0 60px;
}

/* ——— Brand (logo + site name) ——— */
.crezia-brand {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  margin-left: -80px;     /* φέρνει όλο το block πιο αριστερά */
  position: relative;
  z-index: 10;
}

/* ——— Logo ——— */
.crezia-brand__logo {
  display: block !important;
  position: relative;
  width: 900px !important;        /* μεγάλο, όπως το ζητάς */
  height: auto !important;
  max-height: 90px !important;    /* δεν μεγαλώνει ο header */
  object-fit: contain !important;
  max-width: none !important;
  background: transparent !important;
  margin: 0;
  padding: 0;
  z-index: 5;
  filter: drop-shadow(0 0 2px rgba(255,255,255,0.9))
          drop-shadow(0 0 6px rgba(0,0,0,0.8))
          brightness(1.35)
          contrast(1.2);
}

/* ——— Site Name (Crezia) ——— */
.crezia-brand__text {
  font-family: "Poppins", sans-serif !important;
  font-size: 28px;          /* περίπου 1.75rem */
  font-weight: 400;         /* light */
  color: #fff;
  line-height: 1;
  letter-spacing: 0.03em;
  position: relative;
  top: 3px;                 /* τέλεια ευθυγράμμιση με links */
}
/* === CREZIA HEADER ALIGNMENT OVERRIDE v3.7 === */
.crezia-header {
  position: relative !important;
  width: 100%;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #000; /* μαύρο φόντο header */
  z-index: 999;
}

.crezia-header__inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 60px;
  height: 90px;
}

/* === CREZIA BRAND HARD LEFT ALIGN v3.9 === */
.crezia-brand {
  position: absolute !important;
  left: -330px !important;      /* απόσταση από το αριστερό άκρο */
  top: 50%;
  transform: translateY(-50%); /* κάθετη ευθυγράμμιση στο κέντρο του header */
  display: flex;
  align-items: center;
  gap: 16px;
  z-index: 20;
}
/* ——— Κρύψε τυχόν “δεύτερο” site title του theme (στο κέντρο) ——— */
.site-title,
.site-title a,
.site-branding .site-title { display: none !important; }

/* ——— ΜΟΝΟ το κείμενο “Crezia” (δίπλα στο logo) — απομόνωση & ρύθμιση ——— */
/* Ρυθμίσεις που πειράζεις γρήγορα: οριζόντια/κάθετη μετατόπιση & μέγεθος */
:root{
  --cz-text-x: -440px;   /* οριζόντια μετατόπιση του κειμένου (προς τα δεξιά) */
  --cz-text-y: 2px;    /* κάθετη μικρορύθμιση (+ κάτω / − πάνω) */
  --cz-text-size: 28px;
  --cz-text-weight: 400; /* 400 = light */
  --cz-gap: 14px;      /* βασικό gap logo–κειμένου (κρατά το logo σταθερό) */
}

/* Μην αγγίζεις το logo */
.crezia-brand__logo{
  /* τίποτα εδώ — μένει όπως είναι τώρα */
}

/* Ρυθμίζουμε ΜΟΝΟ το κείμενο */
.crezia-brand{
  display: flex !important;
  align-items: center !important;
  gap: var(--cz-gap) !important; /* το κενό logo–κειμένου, δεν μετακινεί το logo συνολικά */
}

.crezia-brand__text{
  position: relative !important;
  margin-left: var(--cz-text-x) !important;   /* οριζόντια μετακίνηση ΜΟΝΟ του κειμένου */
  top: var(--cz-text-y) !important;           /* κάθετη μικρορύθμιση ΜΟΝΟ του κειμένου */
  font-family: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
  font-size: var(--cz-text-size) !important;
  font-weight: var(--cz-text-weight) !important;
  line-height: 1 !important;
  letter-spacing: .02em !important;
  color: #fff !important;
}


/* Logo */
.crezia-brand__logo {
  display: block !important;
  width: 900px !important;
  height: auto !important;
  max-height: 90px !important;
  object-fit: contain !important;
  background: transparent !important;
  filter: brightness(1.35) contrast(1.2);
}

<?php
/**
 * CREZIA Footer (with Floating Tuner v1.2 Universal)
 */
?>
  <footer style="background:#111; color:#ccc; text-align:center; padding:40px 0; margin-top:80px;">
    <p>© <?php echo date('Y'); ?> CREZIA — All rights reserved.</p>
  </footer>

  <?php wp_footer(); ?>

<!-- === CREZIA • Floating Tuner v1.2 (Universal) === -->
<button id="cz-open" type="button"
        style="position:fixed;left:12px;bottom:12px;z-index:1000000;
               background:#222;color:#fff;border:1px solid #444;border-radius:10px;
               padding:8px 10px;font:600 12px/1 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
               cursor:pointer;">
  Tuner
</button>

<div id="cz-tuner" class="cz-tuner" style="display:none">
  <div class="cz-row"><strong>Target:</strong>
    <select id="cz-target" style="margin-left:6px;">
      <option value=".crezia-brand">Brand (logo + “CREZIA”)</option>
      <option value=".crezia-brand__logo">Logo μόνο</option>
      <option value=".crezia-brand__text">Site name “CREZIA”</option>
      <option value=".crezia-nav">Main menu</option>
      <option value=".crezia-auth">Auth (Είσοδος/Εγγραφή)</option>
      <option value="__custom">— Custom selector —</option>
    </select>
  </div>

  <div class="cz-row" id="cz-custom-row" style="display:none">
    <input id="cz-custom" type="text" placeholder=".footer-address, #id, header .class"
           style="min-width:260px">
    <button id="cz-use-custom">Use</button>
  </div>

  <div class="cz-row cz-grid">
    <button data-dx="0"  data-dy="-1">↑</button><div></div><button data-dx="0"  data-dy="1">↓</button>
    <button data-dx="-1" data-dy="0">←</button><button data-dx="1"  data-dy="0">→</button>
  </div>

  <div class="cz-row">Step:
    <input id="cz-step" type="number" value="2" min="1" max="40" style="width:60px"> px
  </div>

  <div class="cz-row">Scale:
    <button data-scale="-0.05">–</button>
    <span id="cz-scale-readout" style="display:inline-block;min-width:40px;text-align:center;">1.00</span>
    <button data-scale="0.05">+</button>
  </div>

  <div class="cz-row" style="display:flex;gap:6px;">
    <button id="cz-reset">Reset target</button>
    <button id="cz-freeze">Freeze & Copy CSS</button>
    <button id="cz-hide">Hide</button>
  </div>

  <div class="cz-help">Show/Hide: <kbd>Alt</kbd>+<kbd>T</kbd></div>
</div>

<script>
document.addEventListener('DOMContentLoaded', function(){
  try {
    const KEY = 'czTuner_v1';
    const $ = (s, r=document)=>r.querySelector(s);
    const tuner   = $('#cz-tuner');
    const openBtn = $('#cz-open');
    const sel     = $('#cz-target');
    const customR = $('#cz-custom-row');
    const customI = $('#cz-custom');
    const useC    = $('#cz-use-custom');
    const stepI   = $('#cz-step');
    const scaleR  = $('#cz-scale-readout');

    const targetsDefault = [
      '.crezia-brand',
      '.crezia-brand__logo',
      '.crezia-brand__text',
      '.crezia-nav',
      '.crezia-auth'
    ];

    // state
    const state = JSON.parse(localStorage.getItem(KEY) || '{}');

    function resolveSelector(){
      if(sel.value === '__custom'){
        return (customI.value || '').trim();
      }
      return sel.value;
    }

    function applyTransform(selector){
      if(!selector) return;
      const el = document.querySelector(selector);
      if(!el) return;

      const cs = getComputedStyle(el);
      if(cs.position === 'static') el.style.position = 'relative';

      const t = state[selector] || {x:0,y:0,s:1};
      el.style.transform = `translate(${t.x}px, ${t.y}px) scale(${t.s})`;

      document.querySelectorAll('.cz-outline').forEach(n=>n.classList.remove('cz-outline'));
      el.classList.add('cz-outline');
      scaleR.textContent = (t.s || 1).toFixed(2);
    }

    function applyAll(){
      const keys = new Set([...(state ? Object.keys(state) : []), ...targetsDefault]);
      keys.forEach(k=>{
        if(!k || k==='__lastTarget') return;
        const el = document.querySelector(k);
        if(!el) return;
        const cs = getComputedStyle(el);
        if(cs.position === 'static') el.style.position = 'relative';
        const t = state[k] || {x:0,y:0,s:1};
        el.style.transform = `translate(${t.x}px, ${t.y}px) scale(${t.s})`;
      });
    }

    function save(){ localStorage.setItem(KEY, JSON.stringify(state)); }

    // UI wiring
    openBtn.addEventListener('click', ()=>{
      tuner.style.display = (tuner.style.display==='none' || !tuner.style.display) ? 'block' : 'none';
      if(tuner.style.display!=='none') applyTransform(resolveSelector());
    });

    window.addEventListener('keydown', (e)=>{
      if(e.altKey && e.key.toLowerCase()==='t'){
        tuner.style.display = (tuner.style.display==='none' || !tuner.style.display) ? 'block' : 'none';
        if(tuner.style.display!=='none') applyTransform(resolveSelector());
      }
    });

    sel.addEventListener('change', ()=>{
      customR.style.display = (sel.value==='__custom') ? 'block' : 'none';
      state.__lastTarget = sel.value;
      save();
      applyTransform(resolveSelector());
    });

    useC.addEventListener('click', ()=>{
      const s = (customI.value || '').trim();
      if(!s) return;
      state.__lastTarget = s;
      sel.value = '__custom';
      save();
      applyTransform(s);
    });

    tuner.addEventListener('click', e=>{
      const btn = e.target.closest('button');
      if(!btn) return;

      const selector = resolveSelector();
      if(!selector) return;

      const el = document.querySelector(selector);
      if(!el) return;

      state[selector] = state[selector] || {x:0,y:0,s:1};

      if(btn.hasAttribute('data-dx')){
        const step = parseInt(stepI.value||'2',10);
        state[selector].x += (parseInt(btn.getAttribute('data-dx'),10) * step);
        state[selector].y += (parseInt(btn.getAttribute('data-dy'),10) * step);
      } else if (btn.hasAttribute('data-scale')){
        let d = parseFloat(btn.getAttribute('data-scale'));
        state[selector].s = Math.max(0.2, Math.min(4, (state[selector].s||1)+d));
      } else if (btn.id==='cz-reset'){
        state[selector] = {x:0,y:0,s:1};
      } else if (btn.id==='cz-hide'){
        tuner.style.display = 'none';
        return;
      } else if (btn.id==='cz-freeze'){
        // φτιάξε CSS κανόνες από το state
        const rules = [];
        Object.keys(state).forEach(k=>{
          if(k==='__lastTarget') return;
          const t = state[k]; if(!t) return;
          rules.push(`${k}{transform:translate(${t.x||0}px,${t.y||0}px) scale(${t.s||1}) !important;}`);
        });
        const stamp = new Date().toISOString().replace('T',' ').split('.')[0];
        const css = `/* ===== CREZIA — Locked positions from Tuner (${stamp}) ===== */\n` + rules.join('\n');

        // δείξε modal με το CSS για Copy
        const pre = document.createElement('pre');
        pre.textContent = css;
        Object.assign(pre.style,{
          position:'fixed',inset:'40px',background:'#0b0b0b',color:'#fff',
          border:'1px solid #444',padding:'14px',zIndex:1000001,overflow:'auto',
          borderRadius:'10px',font:'12px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace'
        });
        const closeBtn = document.createElement('button');
        closeBtn.textContent = 'Close';
        Object.assign(closeBtn.style,{
          position:'fixed',right:'56px',top:'48px',zIndex:1000002,
          background:'#222',color:'#fff',border:'1px solid #444',
          borderRadius:'8px',padding:'6px 10px',cursor:'pointer'
        });
        closeBtn.addEventListener('click', ()=>{ document.body.removeChild(pre); document.body.removeChild(closeBtn); });
        document.body.appendChild(pre); document.body.appendChild(closeBtn);

        // καθάρισε inline transforms (ώστε να βασίζεται στο CSS που θα κάνεις paste)
        Object.keys(state).forEach(k=>{
          if(k==='__lastTarget') return;
          const el2 = document.querySelector(k);
          if(el2) el2.style.transform = '';
        });
        // ΜΗ σβήνουμε το localStorage αυτόματα — άστο να μείνει μέχρι να κάνεις paste στο style.css
        return;
      }

      el.style.transform = `translate(${state[selector].x}px, ${state[selector].y}px) scale(${state[selector].s})`;
      scaleR.textContent = (state[selector].s||1).toFixed(2);
      save();
    });

    // first paint
    applyAll();
    if(state.__lastTarget){
      // Αν παλιά είχες επιλέξει custom, επανάφερε
      if(!targetsDefault.includes(state.__lastTarget)){
        sel.value='__custom';
        customR.style.display='block';
        customI.value = state.__lastTarget;
      }else{
        sel.value = state.__lastTarget;
        customR.style.display='none';
      }
    }
    // εμφάνισε το tuner με Alt+T
  } catch(err){
    console.error('CZ Tuner error:', err);
  }
});
</script>
</body>
</html>
/* ——— [CREZIA] Header font unify → Poppins ——— */
:root { --crezia-header-weight: 600; }

header .menu a,
header nav a,
.site-header nav a,
.site-header .menu a,
.main-navigation a,
.primary-menu a,
#site-navigation a,
.menu-item a {
  font-family: "Poppins", "Segoe UI", Roboto, Arial, sans-serif !important;
  font-weight: var(--crezia-header-weight) !important;
  letter-spacing: 0.2px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Αν υπάρχουν ειδικά “Button” links στο header */
.site-header a.button,
.site-header .menu a.button {
  font-family: "Poppins", "Segoe UI", Roboto, Arial, sans-serif !important;
  font-weight: var(--crezia-header-weight) !important;
}
/* ——— [CREZIA] CV3 — Block #1 geometry: A:B=20/80 (width), AB:CD=25/75 (height) ——— */

/* Κάνουμε τη στήλη #1 (Block 1) κανονικό 2x2 grid με ποσοστιαία ύψη/πλάτη */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in {
  display: grid !important;
  grid-template-columns: 20% 80%;
  grid-template-rows: 25% 75%;
  gap: 3px;
}

/* Θέσεις: A (row1,col1) — B (row1,col2) — κάτω σειρά (row2) span 2 cols */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-a { grid-column: 1; grid-row: 1; }
.cv3-strip .cv3-item:nth-of-type(1) .cv3-b { grid-column: 2; grid-row: 1; }
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom {
  grid-column: 1 / -1;
  grid-row: 2;
  display: grid;
  grid-template-columns: 1fr 1fr; /* C & D 50/50 */
  gap: 3px;
}

/* Για να δουλέψουν σωστά οι ποσοστιαίες σειρές, ακυρώνουμε το aspect-ratio μόνο σε αυτό το block */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-box {
  aspect-ratio: auto !important;
  height: 100% !important;
}

/* Βιντεάκια: γεμίζουν το box (χωρίς μπάρες) */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-box > video {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
/* ——— [CREZIA] CV3 white gutters (tuning aid) ——— */
/* Λευκό φόντο στους εσωτερικούς carriers, ώστε τα gaps να φαίνονται άσπρα */
.cv3-grid-in,
.cv3-grid-in-2 {
  background: #fff !important;
  padding: 3px !important;        /* λεπτό λευκό περιθώριο γύρω από το block */
  box-sizing: border-box !important;
  gap: 8px !important;             /* πιο φαρδιές λευκές λωρίδες για το tuning */
}
.cv3-top-2,
.cv3-bottom {
  background: #fff !important;
  gap: 8px !important;             /* λευκό ανάμεσα στα A–B και C–D */
}

/* Τα ίδια τα holders παραμένουν μαύρα (για αντίθεση) */
.cv3-box { background: #000 !important; }
/* ——— [CREZIA] CV3 uniform white gutters v2 ——— */

/* Όλες οι δομές του block */
.cv3-grid-in,
.cv3-grid-in-2,
.cv3-top-2,
.cv3-bottom {
  background: #fff;
  box-sizing: border-box;
  gap: 9px;            /* ίδια λουρίδα οριζόντια και κάθετα */
  padding: 9px;        /* ίδιες εξωτερικές αποστάσεις γύρω από το block */
}

/* Τοποθέτηση για να φανεί σωστά το μεσαίο όριο AB/CD */
.cv3-grid-in {
  display: grid;
  grid-template-rows: auto auto;
  gap: 9px;            /* αυτή είναι η οριζόντια λωρίδα μεταξύ AB και CD */
}

/* Μαύρα video holders */
.cv3-box {
  background: #000;
  overflow: hidden;
}
/* ——— [CREZIA] CV3 uniform white gutters v2.1 ——— */

/* ΕΞΩΤΕΡΙΚΟ περίγραμμα block: ΜΟΝΟ εδώ padding */
.cv3-grid-in,
.cv3-grid-in-2 {
  background: #fff;
  box-sizing: border-box;
  padding: 9px;          /* λευκή κορνίζα γύρω από το block */
  gap: 9px;              /* οριζόντια γραμμή μεταξύ επάνω/κάτω σειρών = 9px */
  display: grid;
  grid-template-rows: auto auto;
}

/* ΕΣΩΤΕΡΙΚΕΣ σειρές: ΚΑΘΟΛΟΥ padding, ΜΟΝΟ gap */
.cv3-top-2,
.cv3-bottom {
  background: #fff;
  box-sizing: border-box;
  padding: 0 !important; /* μηδενίζουμε για να μην διπλασιάζεται η μεσαία γραμμή */
  gap: 9px;              /* κάθετες γραμμές A–B και C–D = 9px */
}

/* Μαύρα holders για αντίθεση */
.cv3-box {
  background: #000;
  overflow: hidden;
}
/* ——— [CREZIA] CV3 uniform white gutters v2.2 (separate H/V) ——— */
.cv3-grid-in,
.cv3-grid-in-2 {
  --cv3-gap-v: 9px;    /* κάθετες λωρίδες (A–B, C–D) */
  --cv3-gap-h: 12px;   /* οριζόντια λωρίδα (μεταξύ AB και CD) */
  --cv3-frame: 9px;    /* λευκή κορνίζα γύρω από κάθε block */

  background: #fff;
  box-sizing: border-box;
  padding: var(--cv3-frame);
  display: grid;
  grid-template-rows: auto auto;
  row-gap: var(--cv3-gap-h);   /* οριζόντια λωρίδα */
}

/* Εσωτερικές σειρές: μόνο κάθετο gap */
.cv3-top-2,
.cv3-bottom {
  background: #fff;
  box-sizing: border-box;
  padding: 0 !important;
  column-gap: var(--cv3-gap-v); /* κάθετες λωρίδες */
}

/* Holders */
.cv3-box {
  background: #000;
  overflow: hidden;
}
/* ——— [CREZIA] CV3 — Match Block #1 gutters & geometry to Block #3 ——— */

/* Παίρνουμε τις ρυθμίσεις του 3ου block και τις εφαρμόζουμε στο 1ο */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in {
  display: flex !important;
  flex-direction: column;
  gap: 12px;                    /* ίδιο gap με Block #3 */
  background: #fff;
  padding: 9px;
  box-sizing: border-box;
}

/* Επάνω & κάτω σειρές όπως στο Block #3 */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  background: #fff;
}

/* Όλοι οι holders ίδιο φόντο και συμπεριφορά με το 3 */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-box {
  background: #000;
  overflow: hidden;
}

/* Τα video γεμίζουν πλήρως */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-box > video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* ——— [CREZIA] CV3 — Block #1: force A/B on top, C/D bottom ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in{
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  grid-template-areas:
    "A B"
    "bottom bottom";
  gap: 9px; /* ίδιο gutter με τα υπόλοιπα */
}

/* Θέσεις επάνω σειράς */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-a{ grid-area: A; order: 0 !important; }
.cv3-strip .cv3-item:nth-of-type(1) .cv3-b{ grid-area: B; order: 0 !important; }

/* Κάτω σειρά (C & D μέσα στο .cv3-bottom) */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom{
  grid-area: bottom;
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

/* Ασφάλεια: μηδενίζουμε τυχόν παλιά order/transform */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-a,
.cv3-strip .cv3-item:nth-of-type(1) .cv3-b,
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom{
  transform: none !important;
}
/* ——— [CREZIA] CV3 — Block #1: +50% μόνο στην ΟΡΙΖΟΝΤΙΑ λωρίδα ——— */
.cv3-strip .cv3-item:nth-of-type(1){
  --cv3-gap-v: 9px;                 /* κάθετες λωρίδες (A–B, C–D) — αφήνουμε ως έχουν */
  --cv3-gap-h: calc(var(--cv3-gap-v) * 1.5);  /* οριζόντια λωρίδα (AB ↔ CD) = +50% */
}

/* Αν το .cv3-grid-in είναι grid → χρησιμοποιούμε row-gap */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in{
  row-gap: var(--cv3-gap-h) !important;
}

/* Αν είναι flex (κάποιες εκδόσεις) → ασφαλιστικό: μεγαλώνουμε το κενό πάνω από .cv3-bottom */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom{
  margin-top: var(--cv3-gap-h) !important;
}

/* Κρατάμε τις κάθετες λωρίδες ως έχουν (π.χ. 9px) μέσα στις σειρές */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom,
.cv3-strip .cv3-item:nth-of-type(1) .cv3-top-2{
  column-gap: var(--cv3-gap-v) !important;
}
/* ——— [CREZIA] CV3 — Block #1: horizontal gutter = 10px ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in{
  display: grid !important;
  grid-template-rows: auto auto;  /* πάνω σειρά, κάτω σειρά */
  row-gap: 10px !important;       /* ΟΡΙΖΟΝΤΙΑ λωρίδα AB ↔ CD = 10px */
}

/* Κάθετες λωρίδες μέσα στις σειρές: κρατάμε την τρέχουσα τιμή (π.χ. 9px) */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom{
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  column-gap: inherit;            /* ίδιες με τις κάθετες που ήδη έχεις */
  margin-top: 0 !important;       /* αποφυγή διπλασιασμού με προηγούμενα hacks */
}
/* ——— [CREZIA] CV3 — Block #1: horizontal gutter = 14px ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in{
  display: grid !important;
  grid-template-rows: auto auto;
  row-gap: 14px !important;   /* οριζόντια λωρίδα AB ↔ CD */
}

/* Κάθετες λωρίδες: αφήνουμε όπως είναι, χωρίς πρόσθετα margins */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom{
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  margin-top: 0 !important;   /* no double spacing */
}
/* ——— [CREZIA] CV3 — Block #1: final horizontal gutter = 11px ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in {
  display: grid !important;
  grid-template-rows: auto auto;
  row-gap: 11px !important;   /* ΟΡΙΖΟΝΤΙΑ λωρίδα AB ↔ CD = 11px */
}

/* Κάθετες λωρίδες διατηρούνται όπως είναι (π.χ. 9px) */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  margin-top: 0 !important;
}
/* ——— [CREZIA] CV3 — Block #1 proportions from reference image ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in {
  display: grid !important;
  grid-template-columns: 35% 65%;   /* A:B ratio */
  grid-template-rows: 40% 60%;      /* επάνω:κάτω ύψος */
  grid-template-areas:
    "A B"
    "bottom bottom";
  row-gap: 11px !important;         /* οριζόντια λευκή λωρίδα (κλειδωμένη) */
}

/* Επάνω σειρά (A,B) */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-a { grid-area: A; }
.cv3-strip .cv3-item:nth-of-type(1) .cv3-b { grid-area: B; }

/* Κάτω σειρά (C,D) */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom {
  grid-area: bottom;
  display: grid !important;
  grid-template-columns: 45% 55%;   /* C:D ratio */
  column-gap: 9px;                  /* κάθετες λωρίδες */
}
/* ——— [CREZIA] CV3 — Block #1 overall scale −20% ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in {
  transform: scale(0.8);
  transform-origin: top left; /* να «μαζεύει» από πάνω-αριστερά */
}
/* ——— [CREZIA] CV3 — Blocks #2 & #3 overall scale −20% ——— */
.cv3-strip .cv3-item:nth-of-type(2) .cv3-grid-in-2 {
  transform: scale(0.8);
  transform-origin: top left;
}
.cv3-strip .cv3-item:nth-of-type(3) .cv3-grid-in {
  transform: scale(0.8);
  transform-origin: top left;
}
/* ——— [CREZIA] CV3 — Shift all blocks toward center (left margin ×3) ——— */
.cv3-strip {
  margin-left: 9%;   /* τριπλάσιο περίπου από το αρχικό 3% */
  transition: margin 0.3s ease; /* ομαλή μετατόπιση αν κάνεις refresh */
}
/* ——— [CREZIA] CV3 — Widen all 3 blocks +20% ——— */
.cv3-strip .cv3-item:nth-of-type(1),
.cv3-strip .cv3-item:nth-of-type(2),
.cv3-strip .cv3-item:nth-of-type(3) {
  transform: scale(1.2);
  transform-origin: top left;
}
/* ——— [CREZIA] CV3 — Uniform scale −10% for all blocks ——— */
/* Καθαρίζουμε τυχόν προηγούμενα scales */
.cv3-strip .cv3-item .cv3-grid-in,
.cv3-strip .cv3-item .cv3-grid-in-2 {
  transform: none !important;
}

/* Εφαρμόζουμε ενιαίο scale στα 3 blocks */
.cv3-strip .cv3-item {
  transform: scale(0.9);
  transform-origin: top left;
}
/* ——— [CREZIA] CV3 — Hard reset + uniform scale −20% ——— */

/* 1) Μηδενίζουμε ΟΠΟΙΟΔΗΠΟΤΕ προηγούμενο transform στα blocks */
.cv3-strip .cv3-item,
.cv3-strip .cv3-item .cv3-grid-in,
.cv3-strip .cv3-item .cv3-grid-in-2 {
  transform: none !important;
}

/* 2) Εφαρμόζουμε ενιαία κλίμακα σε ΟΛΑ τα blocks */
.cv3-strip { --cv3-scale: 0.8; } /* 0.8 = −20% */
.cv3-strip .cv3-item {
  transform: scale(var(--cv3-scale));
  transform-origin: top left;
}
/* ——— [CREZIA] CV3 precise layout pack v4 ——— */
/* Καθαρίζουμε τυχόν παλιές κλίμακες/overrides για να μην αθροίζονται */
.cv3-strip .cv3-item,
.cv3-strip .cv3-item .cv3-grid-in,
.cv3-strip .cv3-item .cv3-grid-in-2 { transform: none !important; }

/* Ενιαία «λευκή κορνίζα» & gutters για ΟΛΑ τα blocks */
.cv3-strip .cv3-grid-in,
.cv3-strip .cv3-grid-in-2 {
  --frame: 9px;       /* εξωτερική λευκή κορνίζα γύρω από το block */
  --gap-v: 9px;       /* κάθετες λευκές λωρίδες (ανάμεσα σε A–B, C–D) */
  --gap-h: 11px;      /* οριζόντια λευκή λωρίδα (ανάμεσα σε AB και CD ή μεταξύ σειρών) */

  background: #fff;
  box-sizing: border-box;
  padding: var(--frame);
}

/* Τα videos γεμίζουν τα holders */
.cv3-strip .cv3-box { position: relative; overflow: hidden; background:#000; }
.cv3-strip .cv3-box > video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }

/* ——— Block #1 ———
   Ratios από τα μέτρα σου:
   A: 10.5×7.5 (H×W), B: 7.5×10.5, C: 18×12, D: 18×12
   => A:B πλάτος = 7.5fr : 10.5fr  (≈ 41.67% : 58.33%)
      Ύψος AB:CD = 10.5fr : 18fr   (≈ 36.84% : 63.16%)
      C:D = 12fr : 12fr           (50% : 50%)
*/
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in {
  display: grid !important;
  grid-template-columns: 7.5fr 10.5fr;
  grid-template-rows: 10.5fr 18fr;
  grid-template-areas:
    "A B"
    "bottom bottom";
  column-gap: var(--gap-v);
  row-gap: var(--gap-h);
}
.cv3-strip .cv3-item:nth-of-type(1) .cv3-a { grid-area: A; }
.cv3-strip .cv3-item:nth-of-type(1) .cv3-b { grid-area: B; }
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom {
  grid-area: bottom;
  display: grid !important;
  grid-template-columns: 12fr 12fr;   /* C:D = 50/50 */
  column-gap: var(--gap-v);
}

/* ——— Block #2 (ανεστραμμένο μοτίβο) ———
   Πάνω σειρά: C & D 50/50
   Κάτω: δύο full-width σειρές (B2 επάνω, A2 κάτω)
   Με ίδια gutters: vertical = 9px, horizontal = 11px
*/
.cv3-strip .cv3-item:nth-of-type(2) .cv3-grid-in-2 {
  display: grid !important;
  grid-template-rows: auto auto auto;  /* top (C/D) + B2 + A2 */
  row-gap: var(--gap-h);
}
.cv3-strip .cv3-item:nth-of-type(2) .cv3-top-2 {
  display: grid !important;
  grid-template-columns: 1fr 1fr;      /* C | D  (50/50) */
  column-gap: var(--gap-v);
}
.cv3-strip .cv3-item:nth-of-type(2) .cv3-b2,
.cv3-strip .cv3-item:nth-of-type(2) .cv3-a2 {
  position: relative; width: 100%; /* full width rows */
}
/* (αν θέλεις συγκεκριμένη αναλογία ύψους για B2/A2 πες μου, τώρα αφήνεται responsive από τα media) */

/* ——— Block #3 ———
   Για σύγκριση με το δείγμα: ίδιο layout με Block #1
*/
.cv3-strip .cv3-item:nth-of-type(3) .cv3-grid-in {
  display: grid !important;
  grid-template-columns: 7.5fr 10.5fr;   /* ίδιο A:B */
  grid-template-rows: 10.5fr 18fr;       /* ίδιο AB:CD */
  grid-template-areas:
    "A B"
    "bottom bottom";
  column-gap: var(--gap-v);
  row-gap: var(--gap-h);
}
.cv3-strip .cv3-item:nth-of-type(3) .cv3-a { grid-area: A; }
.cv3-strip .cv3-item:nth-of-type(3) .cv3-b { grid-area: B; }
.cv3-strip .cv3-item:nth-of-type(3) .cv3-bottom {
  grid-area: bottom;
  display: grid !important;
  grid-template-columns: 12fr 12fr;     /* C:D = 50/50 */
  column-gap: var(--gap-v);
}
/* ——— [CREZIA] CV3 — Block #1: explicit height control AB=10.5 / CD=18 ——— */
.cv3-strip .cv3-item:nth-of-type(1) {
  display: flex !important;
  flex-direction: column;
  height: 100%; /* γεμίζει το block */
}

/* Επάνω σειρά (A+B) ύψος 10.5 μονάδες */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in {
  flex: 0 0 10.5fr;
  display: grid !important;
  grid-template-columns: 7.5fr 10.5fr; /* πλάτη όπως πριν */
  column-gap: 9px;
}

/* Οριζόντια λευκή λωρίδα μεταξύ σειρών */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom {
  margin-top: 11px !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  column-gap: 9px;
  flex: 0 0 18fr; /* ύψος 18 μονάδες */
}
/* ——— [CREZIA] CV3 — Block #1 responsive ratios (10.7 : 18 scaled) ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in {
  display: grid !important;
  grid-template-columns: 7.5fr 10.5fr;   /* A:B ratio = 7.5:10.5 */
  grid-template-rows: 37% 63%;           /* AB:CD ratio = 10.7:18 normalised */
  grid-template-areas:
    "A B"
    "bottom bottom";
  column-gap: 1.2%;                      /* κάθετες λευκές λωρίδες */
  row-gap: 1.2%;                         /* οριζόντια λευκή λωρίδα */
  box-sizing: border-box;
}

/* επάνω σειρά */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-a { grid-area: A; }
.cv3-strip .cv3-item:nth-of-type(1) .cv3-b { grid-area: B; }

/* κάτω σειρά */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom {
  grid-area: bottom;
  display: grid !important;
  grid-template-columns: 1fr 1fr;        /* C:D = 50:50 */
  column-gap: 1.2%;
}

/* videos γεμίζουν πλήρως χωρίς μαύρες μπάρες */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-box {
  position: relative; overflow: hidden; background: #000;
}
.cv3-strip .cv3-item:nth-of-type(1) .cv3-box > video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}
/* ——— [CREZIA] CV3 — Block #1: cut AB height by 10% ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in{
  display: grid !important;
  /* πριν: 10.5fr 18fr  → τώρα: 9.45fr 18fr (−10% στο πάνω layer) */
  grid-template-rows: 9.45fr 18fr !important;
  row-gap: 11px !important;   /* οριζόντια λευκή λωρίδα */
  column-gap: 9px !important; /* κάθετες λευκές λωρίδες */
}
/* ——— [CREZIA] CV3 — Block #1: cut bottom (C+D) height by 20% ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in {
  display: grid !important;
  /* πριν: 9.45fr 18fr → τώρα: 9.45fr 14.4fr (-20% στο κάτω layer) */
  grid-template-rows: 9.45fr 14.4fr !important;
  row-gap: 11px !important;
  column-gap: 9px !important;
}
/* ——— [CREZIA] CV3 — Block #1 reset AB + cut CD −20% + global scale −20% ——— */

/* Καθαρισμός όλων των παλιών overrides */
.cv3-strip .cv3-item:nth-of-type(1),
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in,
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom {
  transform: none !important;
  margin: 0 !important;
}
/* ——— [CREZIA] CV3 — Equalize Block #1 heights vs Blocks #2/#3 ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in {
  display: grid !important;
  grid-template-rows: 0.42fr 0.58fr !important;  /* πάνω μικρότερο, κάτω μεγαλύτερο */
  gap: 11px !important;                          /* ίδιο με των άλλων */
}

/* Εξασφαλίζουμε ότι και το κάτω section (C&D) κρατά την αναλογία */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 11px !important;
}
/* ——— [CREZIA] CV3 — Block #1: shrink AB, grow CD (reverse + compensate) ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in{
  display: grid !important;
  /* ΠΑΝΩ (A+B) μικρότερο, ΚΑΤΩ (C+D) μεγαλύτερο — πιο έντονα από πριν για αντιστροφή */
  grid-template-rows: 0.35fr 0.65fr !important;  /* πριν έγινε λάθος προς τα πάνω */
  row-gap: 11px !important;
  column-gap: 11px !important; /* ή βάλε το δικό σου αν έχεις άλλο */
  min-height: 0 !important;  /* προφυλάξεις να μην «σπρώχνουν» τα παιδιά */
}

.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  column-gap: 11px !important;
  min-height: 0 !important;
}
/* ——— [CREZIA] CV3 — Block #1 fine-tune: AB 40% / CD 60% ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in{
  display: grid !important;
  grid-template-rows: 0.40fr 0.60fr !important; /* επάνω (A+B) ↓, κάτω (C+D) ↑ */
}
/* ——— [CREZIA] CV3 — Block #1: A+B −5% / C+D +5% ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in{
  display: grid !important;
  grid-template-rows: 0.45fr 0.55fr !important; /* πάνω ↓5%, κάτω ↑5% */
}
/* ——— [CREZIA] CV3 — Block #1: A+B −10% (40%) / C+D +10% (60%) ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in{
  display: grid !important;
  grid-template-areas:
    "A B"
    "bottom bottom" !important;
  grid-template-rows: 40% 60% !important;   /* AB μικρότερο, CD μεγαλύτερο */
  row-gap: 11px !important;                 /* κράτα την οριζόντια λωρίδα σταθερή */
  align-content: stretch !important;
  align-items: stretch !important;
  min-height: 0 !important;
}

/* Βεβαιώνουμε ότι το κάτω ζεύγος γεμίζει πλήρως το 60% */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  column-gap: 11px !important;
  height: 100% !important;
  min-height: 0 !important;
}
/* ——— [CREZIA] CV3 — Horizontal centering (margin only, zero risk) ——— */
.cv3-strip {
  margin-left: 2%;   /* μετακίνησε προς τα δεξιά */
}
/* ——— [CREZIA] CV3 — Block #1: AB −10pp / CD +10pp → 26% / 74% ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in{
  display: grid !important;
  grid-template-rows: 36% 64% !important;  /* A+B μειώνεται, C+D αυξάνεται */
  row-gap: 11px !important;                /* δεν αλλάζουμε τα gaps */
}

/* εξασφαλίζουμε ότι το κάτω δίδυμο C|D γεμίζει σωστά */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  column-gap: 11px !important;
}
/* ——— [CREZIA] CV3 — Flip μόνο το Block #2 (CD πάνω 64% / AB κάτω 36%) ——— */
.cv3-strip .cv3-item:nth-of-type(2) .cv3-grid-in{
  /* ίδιο grid, απλώς αλλάζουμε τη σειρά των γραμμών και τα ύψη */
  grid-template-rows: 64% 36% !important;  /* row1=CD, row2=AB */
  row-gap: 11px !important;                /* κρατάμε το baseline gap */
}

/* το κάτω section (C&D) πάει στην 1η γραμμή */
.cv3-strip .cv3-item:nth-of-type(2) .cv3-bottom{
  grid-row: 1 !important;
}

/* τα A και B πάνε στη 2η γραμμή */
.cv3-strip .cv3-item:nth-of-type(2) .cv3-a,
.cv3-strip .cv3-item:nth-of-type(2) .cv3-b{
  grid-row: 2 !important;
}
/* ——— [CREZIA] CV3 — +10% σε όλες τις λευκές λωρίδες, ίδια εξωτερικά μεγέθη ——— */
.cv3-strip {
  --cv3-gap: 11px; /* baseline που έχουμε κλειδώσει */
}

/* Κάθετες & οριζόντιες λωρίδες μέσα στα blocks */
.cv3-strip .cv3-grid-in,
.cv3-strip .cv3-grid-in-2 {
  column-gap: calc(var(--cv3-gap) * 1.10) !important; /* +10% */
  row-gap:    calc(var(--cv3-gap) * 1.10) !important; /* +10% */
}

/* Εξασφάλιση ίδιου κάθετου gap και στα υπο-γκριτ (C|D, top-2) */
.cv3-strip .cv3-bottom,
.cv3-strip .cv3-top-2 {
  column-gap: calc(var(--cv3-gap) * 1.10) !important;
}
/* ——— [CREZIA] CV3 — Match gaps on Block #1 (+10%) ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in,
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in-2 {
  /* +10% πάνω από το baseline 11px (fallback σε 11px αν δεν υπάρχει var) */
  column-gap: calc(var(--cv3-gap, 11px) * 1.10) !important;
  row-gap:    calc(var(--cv3-gap, 11px) * 1.10) !important;
}

/* Εσωτερικά grids (C|D ή top-2) */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-bottom,
.cv3-strip .cv3-item:nth-of-type(1) .cv3-top-2 {
  column-gap: calc(var(--cv3-gap, 11px) * 1.10) !important;
}

/* Αν έχεις “κορνίζα”/padding γύρω από το block #1, αύξησέ την κι αυτή +10% */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in {
  padding: calc(var(--cv3-gap, 11px) * 1.12) !important;
}
/* ——— [CREZIA] CV3 — Block #1: adjust ONLY the horizontal gap (row-gap) ——— */
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in,
.cv3-strip .cv3-item:nth-of-type(1) .cv3-grid-in-2 {
  row-gap: calc(var(--cv3-gap, 11px) * 1.5) !important; /* αλλάξε το 1.12 κατά βούληση */
}
/* Δεν πειράζουμε καθόλου τις κάθετες (column-gap) */
/* ——— [CREZIA] CV3 clickable creator blocks ——— */
.cv3-item-link {
  display: block;
  text-decoration: none;
  color: inherit;
}
.cv3-item-link:hover { opacity: 0.96; transition: opacity 0.3s ease; }
.cv3-item-link video { pointer-events: none; } /* ώστε να μην μπλοκάρει το click */
/* ——— CREZIA • Photo trio: hard reset + match CV3 blocks ——— */

/* Reset εικόνων του trio: χωρίς scale/clip, απλά καθαρές */
.crezia-photo-trio .pt-card img{
  transform: none !important;
  clip-path: none !important;
  width: 100% !important;
  height: auto !important;
  display: block;
  object-fit: cover;           /* γεμίζει το κάδρο όπως τα video blocks */
  object-position: center center;
}

/* Στήσιμο ίδιo με τα 3 blocks επάνω */
.crezia-photo-trio .pt-row{
  display: flex;
  gap: var(--cv3-gap, 11px);   /* ίδιο gap με τα blocks */
  margin-left: 2%;             /* ίδιο offset με το CV3 strip */
  margin-right: 0;
}

.crezia-photo-trio .pt-card{
  flex: 1 1 0;                 /* 3 ίσες στήλες όπως τα blocks */
  overflow: hidden;            /* για καθαρό κάδρο όταν το cover κόψει άκρες */
}

/* Προσαρμογή σε κινητά: stack */
@media (max-width: 900px){
  .crezia-photo-trio .pt-row{
    flex-direction: column;
    margin-left: 0;
  }
}
/* ——— CREZIA • Photo trio: fix per-column widths (no zoom, no crop) ——— */
.crezia-photo-trio .pt-row{
  display: grid !important;
  gap: var(--cv3-gap, 11px) !important;
  margin-left: 2% !important;  /* ίδιο offset με τα blocks */
  margin-right: 0 !important;

  /* Μικραίνουμε το #1, μεγαλώνουμε #2 & #3.
     Ξεκίνα με αυτά και ρύθμισε 0.80↔0.90 και 1.05↔1.10 κατά βούληση. */
  grid-template-columns: 0.2fr 0.3fr 0.3fr !important;
}

/* Καθαρές εικόνες χωρίς transforms/crops */
.crezia-photo-trio .pt-card img{
  width: 100% !important;
  height: auto !important;
  object-fit: cover;      /* γεμίζει ωραία το κάδρο όπως τα video blocks */
  object-position: center;
  transform: none !important;
  clip-path: none !important;
}
/* ——— CREZIA • Photo Trio: πλήρης έλεγχος πλάτους & ύψους ——— */
.crezia-photo-trio .pt-row {
  display: flex !important;
  justify-content: center;
  align-items: flex-start;
  gap: var(--cv3-gap, 11px);
  margin-left: 2%;
  margin-right: 0;
}

/* Κάθε φωτο ανεξάρτητη */
.crezia-photo-trio .pt-card {
  overflow: hidden;
  flex: 0 0 auto !important;   /* ← ακυρώνει οποιοδήποτε flex-basis */
}

/* Πλάτη (ανεξάρτητα, τώρα ακούνε 100%) */
.crezia-photo-trio .pt-card:nth-child(1) { width: 25%; }
.crezia-photo-trio .pt-card:nth-child(2) { width: 25%; }
.crezia-photo-trio .pt-card:nth-child(3) { width: 25%; }

/* Ύψη (ανεξάρτητα) */
.crezia-photo-trio .pt-card:nth-child(1) { height: 430px; }
.crezia-photo-trio .pt-card:nth-child(2) { height: 500px; }
.crezia-photo-trio .pt-card:nth-child(3) { height: 390px; }

/* Κοινές ρυθμίσεις για τις εικόνες */
.crezia-photo-trio .pt-card img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}
/* ——— CREZIA • Photo Trio: HARD UNLOCK ——— */
/* 1) Σπάμε κάθε κληρονομημένο limit/κανόνα που “κρατάει” πλάτος/ύψος */
.crezia-photo-trio .pt-row {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: var(--cv3-gap, 11px) !important;

  width: auto !important;
  max-width: none !important;
  height: auto !important;
  max-height: none !important;

  margin-left: 2% !important;
  margin-right: 0 !important;
  overflow: visible !important;   /* καμία περικοπή από container */
}

.crezia-photo-trio .pt-card {
  /* Καμία αυτόματη κατανομή από flex */
  flex: 0 0 auto !important;
  /* Καμία επιβολή πλάτους/ύψους από αλλού */
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  overflow: visible !important;
}

/* 2) Ακυρώνουμε global κανόνες img (π.χ. max-width:100%) που σε “κλειδώνουν” */
.crezia-photo-trio .pt-card img {
  display: block !important;
  width: 100% !important;     /* γεμίζει το κάδρο που θα ορίσεις εσύ */
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;   /* ΔΕΝ κόβει πρόσωπα */
  object-position: center center !important;
  aspect-ratio: auto !important;    /* ακυρώνει τυχόν προηγούμενο aspect-ratio */
}

/* 3) Κουμπιά ελέγχου — ορίζεις ΕΣΥ πλάτος & ύψος per item, χωρίς περιορισμούς */
.crezia-photo-trio .pt-card:nth-child(1) { width: 48vw !important; height: 33vw !important; }
.crezia-photo-trio .pt-card:nth-child(2) { width: 48vw !important; height: 33vw !important; }
.crezia-photo-trio .pt-card:nth-child(3) { width: 48vw !important; height: 33vw !important; }

/* Αν προτιμάς σε px αντί για vw, απλά βάλε π.χ. 360px/280px */
/* ——— CREZIA • Photo trio: gaps = CV3 gaps & no-wrap ——— */
.crezia-photo-trio {
  /* Ορισμός τοπικού gap ίδιου με των blocks (baseline 11px) */
  --cv3-gap: 11px;
}

.crezia-photo-trio .pt-row{
  display: flex !important;
  flex-wrap: nowrap !important;         /* να μην «σπάει» γραμμή */
  gap: var(--cv3-gap) !important;       /* ίδιο κενό με τα blocks */
  margin-left: 2% !important;           /* ίδιο offset με τα blocks */
  margin-right: 0 !important;
  box-sizing: border-box;
}
/* ——— CREZIA • Photo trio gap fix (hard equalize) ——— */
.crezia-photo-trio .pt-row {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  align-items: flex-start !important;

  column-gap: 10px !important;  /* ίδιο με cv3-blocks */
  row-gap: 0 !important;
  margin-left: 2% !important;   /* ίδιο offset με blocks */
  margin-right: 0 !important;

  width: auto !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

.crezia-photo-trio .pt-card {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* Εξουδετερώνουμε τα default gaps από τις εικόνες */
.crezia-photo-trio .pt-card img {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}
/* ——— CREZIA • Photo Trio full containment ——— */
.crezia-photo-trio {
  width: 96vw !important;       /* όριο μέσα στη σελίδα */
  margin: 0 auto !important;    /* κεντράρει ολόκληρο το trio */
  overflow: hidden !important;
}

.crezia-photo-trio .pt-row {
  display: flex !important;
  justify-content: space-between !important; /* ίσα κενά */
  align-items: flex-start !important;
  flex-wrap: nowrap !important;

  width: 100% !important;
  gap: 10px !important;          /* ίδιο με blocks */
  box-sizing: border-box !important;
}

.crezia-photo-trio .pt-card {
  flex: 1 1 0 !important;        /* τρεις στήλες ίσου πλάτους */
  max-width: calc((100% - 20px) / 3) !important; /* χωράνε με τα gaps */
  aspect-ratio: 4 / 3 !important;
  overflow: hidden !important;
}

.crezia-photo-trio .pt-card img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
}
/* ——— CREZIA • Photo trio: ρυθμιζόμενο gap με auto προσαρμογή πλάτους ——— */
.crezia-photo-trio {
  /* ΒΑΣΗ: το ίδιο gap που έχουν τα blocks (αν δεν υπάρχει var, default 11px) */
  --pt-gap-base: var(--cv3-gap, 11px);

  /* ΠΟΛΛΑΠΛΑΣΙΑΣΤΗΣ: 3 = 300% (δηλ. τριπλάσιο κενό) */
  --pt-gap-mult: 3;

  /* ΤΕΛΙΚΟ κενό */
  --pt-gap: calc(var(--pt-gap-base) * var(--pt-gap-mult));
}

.crezia-photo-trio .pt-row{
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  gap: var(--pt-gap) !important;         /* κενό μεταξύ φωτογραφιών */
  margin-left: 2% !important;            /* ίδιο offset με τα blocks */
  margin-right: 0 !important;
  box-sizing: border-box !important;
  width: 100% !important;
}

/* Κάθε κάρτα παίρνει πλάτος ώστε 3 κάρτες + 2 gaps = 100% */
.crezia-photo-trio .pt-card{
  flex: 0 0 auto !important;
  width: calc((100% - (2 * var(--pt-gap))) / 3) !important; /* ✔ ακριβής προσαρμογή */
  aspect-ratio: 4 / 3;            /* κράτα καθαρό κάδρο (προσαρμόσιμο) */
  overflow: hidden;
}

.crezia-photo-trio .pt-card img{
  width: 100%; height: 100%;
  object-fit: cover;               /* ομοιόμορφο γέμισμα */
  object-position: center;
  display: block;
}

/* Προαιρετικό: σε στενές οθόνες, μείωσε λίγο το multiplier για να μη στριμώχνεται */
@media (max-width: 900px){
  .crezia-photo-trio { --pt-gap-mult: 2; } /* 200% στο κινητό */
}
/* ——— CREZIA • Split “Und1” base ——— */
.crezia-split.crezia-und{
  align-items: center;
  gap: clamp(16px, 3vw, 40px);
  margin: clamp(32px, 6vw, 80px) 0;
  padding: 0;
}

/* Τίτλος = ίδιο font/size με Hero .word */
.crezia-split.crezia-und .split-title.word{
  line-height: 1.05;
  margin: 0 0 14px 0;
}

/* Κείμενο */
.crezia-split.crezia-und .split-text p{
  font-size: clamp(16px, 1.7vw, 20px);
  line-height: 1.6;
  margin: 0 0 14px 0;
}

/* Εικόνα δεξιά */
.crezia-split.crezia-und .split-image img{
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 0;
}

/* ——— Slide-in animation (όπως Hero, on-scroll) ——— */
.js-slide{
  opacity: 0;
  transform: translateX(8vw);
  transition:
    transform 900ms cubic-bezier(.2,.7,.2,1),
    opacity 900ms ease;
  will-change: transform, opacity;
}

.js-observe.is-inview .js-slide{              /* όταν μπει στο viewport */
  opacity: 1;
  transform: translateX(0);
}

/* μικρό stagger: τίτλος 0ms, 1η παράγραφος +120ms, 2η +240ms, 3η +360ms */
.crezia-split.crezia-und .split-title.js-slide{ transition-delay: 0ms; }
.crezia-split.crezia-und .split-text p.js-slide:nth-of-type(1){ transition-delay: 120ms; }
.crezia-split.crezia-und .split-text p.js-slide:nth-of-type(2){ transition-delay: 240ms; }
.crezia-split.crezia-und .split-text p.js-slide:nth-of-type(3){ transition-delay: 360ms; }

/* Mobile: κάθετη στοίχιση */
@media (max-width: 900px){
  .crezia-split.crezia-und{ grid-template-columns: 1fr !important; }
  .crezia-split.crezia-und .split-image{ order: -1; }
}
/* ——— CREZIA • Und1 image: -10% uniform, no layout jump, aligned margins ——— */
.crezia-split.crezia-und{
  margin-left: 2% !important;   /* ίδιο αριστερό offset με τα blocks & photo trio */
  margin-right: 0 !important;
}

.crezia-split.crezia-und .split-image{
  /* Κρατάει χώρο πριν φορτώσει η εικόνα (stop layout jump) */
  aspect-ratio: 4 / 3;          /* αν η und1.png έχει άλλη αναλογία, άλλαξέ το π.χ. 16/9 */
  position: relative;
  overflow: visible;             /* να μη “κοπεί” τίποτα */
}

/* Η εικόνα: κεντραρισμένη, -10% ομοιόμορφα */
.crezia-split.crezia-und .split-image img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);  /* ακριβές κεντράρισμα */
  width: 90%;                        /* -10% στο πλάτος */
  height: auto;                      /* κρατάει αναλογία */
  max-height: 90%;                   /* -10% και στο ύψος όταν χρειαστεί */
  display: block;
  object-fit: contain;               /* καμία περικοπή */
  object-position: center center;
  opacity: 1;                        /* δεν κάνουμε fade που να αλλάζει layout */
  transition: opacity 300ms ease;    /* προαιρετικό “μαλακό” φινίρισμα χωρίς μετατόπιση */
}

/* (προαιρετικό) Αν δεις ελάχιστη απόκλιση στην ευθεία των margins:
   μικρή ρύθμιση σε συνολικό πλάτος του split */
@media (min-width: 901px){
  .crezia-split.crezia-und{ max-width: 96vw; }
}
/* ——— CREZIA • Und1 text alignment fix ——— */
.crezia-split.crezia-und .split-text {
  text-align: left !important;      /* αριστερή στοίχιση */
  padding-right: clamp(24px, 4vw, 48px); /* ελαφρύ breathing space */
  padding-left: clamp(16px, 3vw, 36px);
  overflow-wrap: break-word;        /* για πολύ μακριές λέξεις */
  max-width: 640px;                 /* αποτρέπει “ξεχείλωμα” δεξιά */
  margin-right: auto;               /* κλειδώνει το κείμενο στη στήλη */
}

.crezia-split.crezia-und .split-text-inner p {
  margin: 0 0 1.2em 0;              /* σωστά διαστήματα όπως το δείγμα σου */
  line-height: 1.7;
  font-size: clamp(16px, 1.1vw, 18px);
}
/* ——— Fix οριζόντιου scrollbar από slide-in ——— */
/* Κόβουμε τυχόν οριζόντιο overflow στα sections που έχουν .js-observe */
.js-observe{
  overflow-x: clip;         /* σύγχρονο, δεν εμφανίζει scrollbar */
  max-width: 100%;
}
@supports not (overflow: clip){
  .js-observe{ overflow-x: hidden; } /* fallback για παλαιότερα */
}

/* Extra ασφάλεια: μην επιτρέπεις να ξεχειλώνει τίποτα σε αυτά τα blocks */
.crezia-split, .crezia-cards, .cv3-strip, .crezia-photo-trio, .crezia-separator{
  max-width: 100%;
}

/* Προληπτικά για media που ίσως δηλώνουν width > 100% από styles τρίτων */
img, video{
  max-width: 100%;
  height: auto;
  display: block;
}

/* Αν έχεις slide-in και στο .crezia-walk, κόψε overflow και εκεί */
.crezia-split.crezia-walk .split-text,
.crezia-split.crezia-und  .split-text{
  overflow-x: clip;
}
@supports not (overflow: clip){
  .crezia-split.crezia-walk .split-text,
  .crezia-split.crezia-und  .split-text{ overflow-x: hidden; }
}

/* Τελική ασπίδα, μόνο αν χρειαστεί:
html, body { overflow-x: hidden; } 
*/
/* ——— Fix οριζόντιου scrollbar από slide-in ——— */
/* Κόβουμε τυχόν οριζόντιο overflow στα sections που έχουν .js-observe */
.js-observe{
  overflow-x: clip;         /* σύγχρονο, δεν εμφανίζει scrollbar */
  max-width: 100%;
}
@supports not (overflow: clip){
  .js-observe{ overflow-x: hidden; } /* fallback για παλαιότερα */
}

/* Extra ασφάλεια: μην επιτρέπεις να ξεχειλώνει τίποτα σε αυτά τα blocks */
.crezia-split, .crezia-cards, .cv3-strip, .crezia-photo-trio, .crezia-separator{
  max-width: 100%;
}

/* Προληπτικά για media που ίσως δηλώνουν width > 100% από styles τρίτων */
img, video{
  max-width: 100%;
  height: auto;
  display: block;
}

/* Αν έχεις slide-in και στο .crezia-walk, κόψε overflow και εκεί */
.crezia-split.crezia-walk .split-text,
.crezia-split.crezia-und  .split-text{
  overflow-x: clip;
}
@supports not (overflow: clip){
  .crezia-split.crezia-walk .split-text,
  .crezia-split.crezia-und  .split-text{ overflow-x: hidden; }
}

/* Τελική ασπίδα, μόνο αν χρειαστεί:
html, body { overflow-x: hidden; } 
*/
/* ——— CREZIA Footer (dark, 3x3 links, aligned gutters) ——— */
.crezia-footer{
  background:#000;                 /* ΜΑΥΡΟ footer */
  color:#fff;
  border-top:1px solid #111;
}

.crezia-footer .cf-wrap{
  /* Ευθυγράμμιση με gutters σελίδας: ίδιο αριστερό “μάτι” όπως blocks/photos */
  max-width: 1200px;
  margin: 0 auto;
  padding: 36px 24px;
  display: grid;
  grid-template-columns: 1.2fr auto;  /* αριστερά διεύθυνση, δεξιά οι τριάδες */
  align-items: start;
  gap: 24px 48px;
  box-sizing: border-box;
}

/* Λίγο πιο “μέσα” η διεύθυνση, να κάθεται στην ίδια ευθεία με τα άνω blocks */
.crezia-footer .cf-left{
  padding-left: clamp(12px, 2vw, 24px);
}

.crezia-footer .cf-address{
  font-style: normal;
  line-height: 1.6;
  font-size: 15px;
  color:#f5f5f5;
}

/* Δεξιά: 3 τριάδες, οριζόντια η μία δίπλα στην άλλη */
.crezia-footer .cf-right{
  display: flex;
  gap: clamp(16px, 3vw, 40px);   /* κενό ανάμεσα στις 3 στήλες */
}

.crezia-footer .cf-right .cf-col{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-auto-rows: min-content;   /* 3 links κάθετα */
  row-gap: 8px;
  min-width: 140px;              /* κρατάει όμορφη στήλη */
}

.crezia-footer .cf-right a{
  color:#fff;
  text-decoration: none;
  font-size: 15px;
  line-height: 1.6;
  opacity: .92;
}
.crezia-footer .cf-right a:hover,
.crezia-footer .cf-right a:focus{
  text-decoration: underline;
  opacity: 1;
  outline: none;
}

/* Κάτω λωρίδα */
.crezia-footer .cf-bottom{
  border-top:1px solid #111;
  padding: 12px 24px 16px;
  text-align: center;
  font-size: 13px;
  color:#cfcfcf;
}

/* Responsive: στο mobile οι 3 στήλες γίνονται 2 + wrap (να μη γίνει “ουρανοξύστης”) */
@media (max-width: 900px){
  .crezia-footer .cf-wrap{
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .crezia-footer .cf-right{
    flex-wrap: wrap;
    gap: 16px 24px;
  }
  .crezia-footer .cf-right .cf-col{
    min-width: 44%;
  }
}

/* Ασφάλεια να μη βγάζει οριζόντιο scroll */
.crezia-footer, .crezia-footer .cf-wrap{ max-width: 100%; }
/* ——— CREZIA Header: ΕΙΣΟΔΟΣ & ΕΓΓΡΑΦΗ (ίδιο pill + hover states) ——— */

/* 1) Βάση: και τα δύο links σε ίδιο “pill” outline */
.site-header nav a[href*="/login"],
.site-header nav a[href*="/register"],
.site-header nav a[href*="/eisodos"],
.site-header nav a[href*="/eggrafi"]{
  display:inline-block;
  padding: 8px 16px;
  border:1px solid #fff;
  border-radius: 9999px;
  color:#fff;
  line-height:1;
  text-decoration:none;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease;
  /* αν υπάρχει τυχόν υπάρχον style, υπερισχύουμε διακριτικά: */
  background: transparent;
}

/* 2) Hover/focus — ΕΙΣΟΔΟΣ: Άσπρο φόντο, μαύρα γράμματα */
.site-header nav a[href*="/login"]:hover,
.site-header nav a[href*="/login"]:focus,
.site-header nav a[href*="/eisodos"]:hover,
.site-header nav a[href*="/eisodos"]:focus{
  background:#fff;
  color:#000;
  border-color:#fff;
  outline:none;
}

/* 3) Hover/focus — ΕΓΓΡΑΦΗ: Μαύρο φόντο, άσπρα γράμματα (pill διατηρείται) */
.site-header nav a[href*="/register"]:hover,
.site-header nav a[href*="/register"]:focus,
.site-header nav a[href*="/eggrafi"]:hover,
.site-header nav a[href*="/eggrafi"]:focus{
  background:#000;
  color:#fff;
  border-color:#000;
  outline:none;
  /* λεπτό “δαχτυλίδι” για να ξεχωρίζει πάνω σε μαύρο header */
  box-shadow: 0 0 0 1px #fff inset;
}

/* 4) Προαιρετικά: ελαφρώς πιο “έντονο” το ΕΓΓΡΑΦΗ σε normal state */
.site-header nav a[href*="/register"],
.site-header nav a[href*="/eggrafi"]{
  font-weight:600;
}
/* ——— CREZIA Header Buttons Fix (Login + Register uniform pill + hover) ——— */
.site-header nav a[href*="/login"],
.site-header nav a[href*="/eisodos"],
.site-header nav a[href*="/register"],
.site-header nav a[href*="/eggrafi"] {
  display: inline-block !important;
  padding: 8px 18px !important;
  border: 1px solid #fff !important;
  border-radius: 9999px !important;
  background: #000 !important;     /* default black background */
  color: #fff !important;          /* white text */
  text-decoration: none !important;
  line-height: 1 !important;
  transition: all .25s ease-in-out !important;
}

/* Hover / focus — λευκό φόντο, μαύρα γράμματα */
.site-header nav a[href*="/login"]:hover,
.site-header nav a[href*="/eisodos"]:hover,
.site-header nav a[href*="/register"]:hover,
.site-header nav a[href*="/eggrafi"]:hover,
.site-header nav a[href*="/login"]:focus,
.site-header nav a[href*="/eisodos"]:focus,
.site-header nav a[href*="/register"]:focus,
.site-header nav a[href*="/eggrafi"]:focus {
  background: #fff !important;
  color: #000 !important;
  border-color: #000 !important;
  box-shadow: 0 0 0 1px #000 inset !important;
  cursor: pointer !important;
}
/* ——— CREZIA Header Auth buttons (Είσοδος / Εγγραφή) ——— */
.site-header a.auth-link,
.site-header a.auth-link.auth-primary{
  display:inline-block !important;
  padding: 8px 18px !important;
  border: 1px solid #fff !important;   /* λευκό περίγραμμα (default) */
  border-radius: 9999px !important;     /* pill */
  background: #000 !important;          /* μαύρο φόντο (default) */
  color: #fff !important;               /* λευκά γράμματα (default) */
  text-decoration: none !important;
  line-height: 1 !important;
  transition: background-color .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease !important;
  /* προαιρετικά για ομοιομορφία ύψους αν υπάρχουν διαφορετικά paddings */
  min-height: 36px !important;
}

/* Hover / Focus: λευκό φόντο, μαύρα γράμματα, μαύρο περίγραμμα (και για τα 2) */
.site-header a.auth-link:hover,
.site-header a.auth-link:focus,
.site-header a.auth-link.auth-primary:hover,
.site-header a.auth-link.auth-primary:focus{
  background: #fff !important;
  color: #000 !important;
  border-color: #000 !important;
  box-shadow: 0 0 0 1px #000 inset !important;
  outline: none !important;
}

/* (προαιρετικό) Ελαφρύ “tap” feedback */
.site-header a.auth-link:active,
.site-header a.auth-link.auth-primary:active{
  transform: translateY(0.5px);
}
/* ——— CREZIA Header Auth buttons (definitive selectors) ——— */
header.crezia.header .crezia-header_inner .crezia.auth a.auth-link,
header.crezia.header .crezia-header_inner .crezia.auth a.auth-link.auth-primary{
  display:inline-block !important;
  padding:8px 18px !important;
  border:1px solid #fff !important;     /* λευκό ring */
  border-radius:9999px !important;       /* pill */
  background:#000 !important;            /* default: μαύρο */
  color:#fff !important;                 /* default: λευκό */
  text-decoration:none !important;
  line-height:1 !important;
  transition: background-color .25s, color .25s, border-color .25s, box-shadow .25s !important;
}

/* Hover / Focus: λευκό φόντο, μαύρα γράμματα, μαύρο περίγραμμα (και στα 2) */
header.crezia.header .crezia-header_inner .crezia.auth a.auth-link:hover,
header.crezia.header .crezia-header_inner .crezia.auth a.auth-link:focus,
header.crezia.header .crezia-header_inner .crezia.auth a.auth-link.auth-primary:hover,
header.crezia.header .crezia-header_inner .crezia.auth a.auth-link.auth-primary:focus{
  background:#fff !important;
  color:#000 !important;
  border-color:#000 !important;
  box-shadow:0 0 0 1px #000 inset !important; /* ορατό outline πάνω στο λευκό */
  outline:none !important;
}

/* Προαιρετικό: μικρό “tap” feedback */
header.crezia.header .crezia-header_inner .crezia.auth a.auth-link:active,
header.crezia.header .crezia-header_inner .crezia.auth a.auth-link.auth-primary:active{
  transform: translateY(0.5px);
}



/* ——— CREZIA Header: ΕΙΣΟΔΟΣ & ΕΓΓΡΑΦΗ (ίδιο pill + ίδιο hover) ——— */

/* Selectors για τα δύο links (πρόσθεσε/αλλάξε αν έχεις άλλα slugs) */
.site-header nav a[href*="/login"],
.site-header nav a[href*="/eisodos"],
.site-header nav a[href*="/register"],
.site-header nav a[href*="/eggrafi"]{
  display:inline-block;
  padding: 8px 16px;
  border:1px solid #fff;           /* λευκό περίγραμμα */
  border-radius: 9999px;           /* pill */
  background:#000;                 /* μαύρο φόντο (default) */
  color:#fff;                      /* λευκά γράμματα */
  line-height:1;
  text-decoration:none;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease;
}

/* Hover / Focus: λευκό φόντο, μαύρα γράμματα, μαύρο περίγραμμα */
.site-header nav a[href*="/login"]:hover,
.site-header nav a[href*="/login"]:focus,
.site-header nav a[href*="/eisodos"]:hover,
.site-header nav a[href*="/eisodos"]:focus,
.site-header nav a[href*="/register"]:hover,
.site-header nav a[href*="/register"]:focus,
.site-header nav a[href*="/eggrafi"]:hover,
.site-header nav a[href*="/eggrafi"]:focus{
  background:#fff;
  color:#000;
  border-color:#000;
  outline:none;
}

/* Προαιρετικά: active state λίγο πιο «σφιχτό» */
.site-header nav a[href*="/login"]:active,
.site-header nav a[href*="/eisodos"]:active,
.site-header nav a[href*="/register"]:active,
.site-header nav a[href*="/eggrafi"]:active{
  transform: translateY(0.5px);
}
/* === CREZIA • Auth Buttons FINAL FIX ===================== */
/* Εφαρμόζεται σωστά για τη .crezia-auth περιοχή του header */

.crezia-auth .auth-link,
.crezia-auth .auth-primary {
  display: inline-block;
  padding: 8px 18px;
  border: 1px solid #fff;
  border-radius: 9999px;
  background: #000;
  color: #fff;
  font: 600 14px/1 Helvetica, Arial, sans-serif;
  letter-spacing: .3px;
  text-transform: uppercase;
  text-decoration: none;
  transition: all 0.25s ease-in-out;
  cursor: pointer;
}

/* Hover: λευκό φόντο, μαύρα γράμματα */
.crezia-auth .auth-link:hover,
.crezia-auth .auth-primary:hover {
  background: #fff;
  color: #000;
  border-color: #000;
  box-shadow: 0 0 0 1px #000 inset;
}
/* =========================================================
   CREZIA Hero — Clean Start Template (no crop, full image)
   ========================================================= */

.creators-hero {
  display: block;
  width: 100%;
  overflow: visible;      /* τίποτα δεν κόβεται */
  margin: 0;
  padding: 0;
  line-height: 0;
  background: #000;       /* φόντο για να ξεχωρίζει το πλαίσιο */
}

.creators-hero img {
  display: block;
  width: 100%;
  height: auto;           /* κρατά το φυσικό ύψος */
  max-width: 100%;
  max-height: none;
  object-fit: none;       /* καμία περικοπή */
  margin: 0;
  padding: 0;
}
/* ===== Creators Info — Hero (no crop, full image) ===== */
.creators-hero {
  width: 100%;
  margin: 0;
  padding: 0;
  line-height: 0;
  background: #000;
  overflow: visible;
}

.creators-hero img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: none;
  margin: 0;
  padding: 0;
}
/* =========================================================
   CREZIA — Footer & Hero overlap fix
   ========================================================= */

/* εξουδετερώνει πιθανό overlap του footer πάνω στο hero */
.creators-info-page {
  position: relative;
  z-index: 1;
  background: #000;
  overflow: visible;
}

/* βεβαιώνει ότι το hero είναι κάτω από το header αλλά πάνω από τον footer */
.creators-hero {
  position: relative;
  z-index: 2;
  width: 100%;
  margin: 0;
  padding: 0;
  line-height: 0;
  background: #000;
}

.creators-hero img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;   /* ✅ κρατά ολόκληρη την εικόνα */
  margin: 0;
  padding: 0;
}

/* footer να μην «ανεβαίνει» πάνω από το hero */
.site-footer,
footer {
  position: relative;
  z-index: 1;
  margin-top: 0;
  padding-top: 40px;    /* κράτα λίγο χώρο αν χρειάζεται */
  clear: both;
}
/* =========================================================
   CREZIA — Footer deflate (compact v1.1)
   Μικραίνει ύψη/κενά, χωρίς να χαλάει τη διάταξη
   ========================================================= */

:root{
  --footer-pad-y: 28px;     /* κάθετο padding πάνω/κάτω */
  --footer-pad-x: 8%;       /* οριζόντιο padding */
  --footer-gap-x: 96px;     /* κενό ανάμεσα στις 2 στήλες δεξιά */
  --footer-font: 14px;      /* βασικό μέγεθος κειμένου στο footer */
  --footer-line: 1.45;      /* line-height */
  --footer-logo-w: 120px;   /* πλάτος λογότυπου */
}

/* βασικό wrapper (αυτό που ανέφερες: .cf-wrap 399×355) */
footer .cf-wrap,
.crezia-footer .cf-wrap{
  box-sizing: border-box;
  padding: var(--footer-pad-y) var(--footer-pad-x);
  margin: 0 auto;
  max-width: 1400px;
}

/* layout δεξιά/αριστερά */
.crezia-footer,
footer.crezia-footer{
  background: #000; color:#fff;
}
.crezia-footer .footer-left,
.crezia-footer .footer-right{
  display: flex;
}
.crezia-footer .footer-left{
  flex-direction: column;
  gap: 10px;                /* μικρό «αέρα» κάτω από το logo */
}
.crezia-footer .footer-right{
  margin-left: auto;
  gap: var(--footer-gap-x);
}

/* logo */
.crezia-footer .footer-logo img{
  width: var(--footer-logo-w);
  height: auto;
  display: block;
  margin: 0;
}

/* κείμενα/λίστες — κόβουμε έξτρα κενά */
.crezia-footer .footer-address,
.crezia-footer .footer-column{
  font-size: var(--footer-font);
  line-height: var(--footer-line);
}
.crezia-footer .footer-address p{
  margin: 0;                /* μηδενισμός default margin */
}
.crezia-footer .footer-column{
  display: flex; flex-direction: column;
  gap: 6px;                 /* μικρότερο κάθετο κενό ανά link */
}
.crezia-footer .footer-column a{
  color:#fff; text-decoration:none;
}
.crezia-footer .footer-column a:hover{ opacity:.75; }

/* καθάρισμα πιθανών «φουσκωμάτων» από αλλού */
.crezia-footer p,
.crezia-footer ul,
.crezia-footer li{
  margin-top: 0;
  margin-bottom: 0;
  padding: 0;
}

/* Φρένο σε υπερβολικά ύψη: δεν αφήνουμε min-height να φουσκώνει */
.crezia-footer,
.crezia-footer *{
  min-height: 0 !important;
}

/* Responsive συμπύκνωση */
@media (max-width: 1024px){
  :root{
    --footer-pad-y: 24px;
    --footer-gap-x: 56px;
    --footer-logo-w: 108px;
  }
}
@media (max-width: 640px){
  footer .cf-wrap,
  .crezia-footer .cf-wrap{ padding: 22px 24px; }
  .crezia-footer .footer-right{ gap: 28px; flex-direction: column; margin-top: 12px; }
  :root{ --footer-font: 13px; }
}
/* =========================================================
   CREZIA — Footer compact + logo restore v1.2
   ========================================================= */

/* Εμφανίζει ξανά το logo ακόμη κι αν είναι κρυφό */
footer .footer-logo,
.crezia-footer .footer-logo {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

footer .footer-logo img,
.crezia-footer .footer-logo img {
  display: block;
  width: 110px;     /* μείωσε αν θέλεις ακόμη μικρότερο */
  height: auto;
  margin: 0;
  padding: 0;
}

/* Συμπίεση καθέτων paddings */
footer .cf-wrap,
.crezia-footer .cf-wrap {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

/* Συμπίεση αποστάσεων μεταξύ blocks */
footer .footer-left,
footer .footer-right,
.crezia-footer .footer-left,
.crezia-footer .footer-right {
  margin: 0 !important;
  gap: 40px !important;
}

/* Γενική μείωση vertical space */
footer,
.crezia-footer {
  background: #000;
  color: #fff;
  font-size: 14px;
  line-height: 1.4;
  min-height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Responsive - ακόμα πιο μαζεμένος σε mobile */
@media (max-width: 768px) {
  footer .cf-wrap,
  .crezia-footer .cf-wrap {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }
  footer .footer-logo img,
  .crezia-footer .footer-logo img {
    width: 96px;
  }
}
/* =========================================================
   CREZIA — Global Footer v1.2 (compact, logo-heart, color fix)
   ========================================================= */

.crezia-footer {
  background: #000;
  color: #fff;
  font-family: "Poppins", "Sofia Sans", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.4;
  margin: 0;
  padding: 0;
}

/* Κρατάει τον footer λεπτό και ισορροπημένο */
.crezia-footer .cf-wrap {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 26px 8%;
  gap: 100px;
  max-width: 1400px;
  margin: 0 auto;
  box-sizing: border-box;
}

/* --- Αριστερή πλευρά --- */
.crezia-footer .footer-left {
  display: flex;
  flex-direction: row;        /* logo και κείμενο στην ίδια ευθεία */
  align-items: center;        /* κάθετη στοίχιση */
  gap: 16px;                  /* απόσταση logo–κειμένου */
}

.crezia-footer .footer-logo img {
  display: block;
  width: 95px;                /* μικρότερο logo */
  height: auto;
  margin: 0;
}

.crezia-footer .footer-address {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.crezia-footer .footer-address p {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.4;
}

/* --- Δεξιά πλευρά (στήλες links) --- */
.crezia-footer .footer-right {
  display: flex;
  flex-direction: row;
  gap: 80px;
  margin-top: 2px;
}
.crezia-footer .footer-col {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* --- Χρώματα links --- */
.crezia-footer a {
  color: #fff !important;
  text-decoration: none !important;
  transition: opacity 0.25s ease;
}
.crezia-footer a:hover { opacity: .7; }

/* --- Κάτω γραμμή --- */
.crezia-footer .cf-bottom {
  text-align: center;
  border-top: 1px solid rgba(255,255,255,0.12);
  padding: 10px 0 16px;
  font-size: 13px;
  opacity: 0.85;
}

/* --- Responsive προσαρμογή --- */
@media (max-width: 1024px) {
  .crezia-footer .cf-wrap {
    flex-direction: column;
    gap: 28px;
    padding: 24px 6%;
  }
  .crezia-footer .footer-right {
    gap: 48px;
    flex-wrap: wrap;
  }
}
@media (max-width: 640px) {
  .crezia-footer .cf-wrap {
    padding: 20px 24px;
    gap: 20px;
  }
  .crezia-footer .footer-left {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  .crezia-footer .footer-right {
    flex-direction: column;
    gap: 20px;
  }
}
/* CREZIA — Footer: bring address closer to logo */
:root{
  --footer-left-gap:0.12px;   /* δοκίμασε 6px–12px */
}

.crezia-footer .footer-left{
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--footer-left-gap) !important; /* ↓ μειώνει την απόσταση logo–διεύθυνσης */
}

/* Μηδενίζουμε τυχόν αριστερό margin στο address block */
.crezia-footer .footer-address,
.crezia-footer .footer-address p{
  margin-left: 0 !important;
}

/* Λεπτό «σκούντημα» για τέλεια ευθυγράμμιση (προαιρετικό) */
@media (min-width: 641px){
  .crezia-footer .footer-address{ transform: translateX(-2px); } /* ρύθμισε -1px..-4px αν χρειαστεί */
}
/* =========================================================
   CREZIA — Footer alignment to header (gutters + group nudge)
   ========================================================= */

/* 1) Ισοφάρισε τα gutters του footer με του header  */
/* ADJUST HERE: βάλ' το ίδιο gutter που έχει ο header σου (px ή %) */
.crezia-footer .cf-wrap{
  padding-left: 6%;
  padding-right: 6%;
  max-width: 1400px;
  margin: 0 auto;
  box-sizing: border-box;
}

/* 2) Μετατόπιση ΟΛΟΥ του group (logo+address) με pixel-ακρίβεια */
/* ADJUST HERE: αρνητικό = πιο αριστερά, θετικό = πιο δεξιά */
.crezia-footer .footer-left{
  position: relative;
  transform: translateX(-18px);
}

/* (προστασία: μην κληρονομηθεί άλλο left/margin από πριν) */
.crezia-footer .footer-left{ left: 0 !important; margin-left: 0 !important; }

/* μικρό gap logo–διεύθυνσης (αν το θες πιο κοντά, κατέβασέ το) */
.crezia-footer .footer-left{ gap: 10px; }

/* διατηρούμε το logo και τη διεύθυνση στην ίδια ευθεία baseline */
.crezia-footer .footer-left{ align-items: center; }
.crezia-footer .footer-logo img{ display:block; width:95px; height:auto; }
.crezia-footer .footer-address p{ margin:0; line-height:1.4; font-size:13.5px; }

/* ασφάλεια: λευκά links, χωρίς υπογραμμίσεις */
.crezia-footer a{ color:#fff !important; text-decoration:none !important; }
.crezia-footer a:hover{ opacity:.75; }

/* προαιρετικό: μη κόβεται τίποτα σε σπάνια layouts */
.crezia-footer{ overflow: visible; }
/* ===== CREZIA — Footer logo settings (same as header) with position fix ===== */
.crezia-footer .footer-logo {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 16px;   /* διατηρεί απόσταση logo–διεύθυνσης */
}

.crezia-footer .footer-logo img {
  display: block !important;
  width: 900px !important;       /* logo width */
  height: auto !important;
  max-height: 90px !important;   /* max height */
  object-fit: contain !important;/* maintains aspect ratio */
  background: transparent !important;
  filter: brightness(1.35) contrast(1.2);
}

/* Διεύθυνση ευθυγραμμισμένη δίπλα στο logo */
.crezia-footer .footer-address {
  margin-top: 0;
  font-size: 13.5px;
  line-height: 1.4;
  color: #fff;
  margin-left: 0;
}
/* ===== CREZIA — Footer logo settings (same as header) with position fix ===== */
.crezia-footer .footer-logo {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 6px;   /* διατηρεί απόσταση logo–διεύθυνσης */
}

.crezia-footer .footer-logo img {
  display: block !important;
  width: 900px !important;       /* logo width */
  height: auto !important;
  max-height: 90px !important;   /* max height */
  object-fit: contain !important;/* maintains aspect ratio */
  background: transparent !important;
  filter: brightness(1.35) contrast(1.2);
}

/* Διεύθυνση ευθυγραμμισμένη δίπλα στο logo */
.crezia-footer .footer-address {
  margin-top: 0;
  font-size: 13.5px;
  line-height: 1.4;
  color: #fff;
  margin-left: 0;
}
/* CREZIA — Footer logo position control */
:root{
  --footer-logo-align: flex-start; /* Αλλαγή με flex-start (αριστερά), center (κέντρο), ή flex-end (δεξιά) */
}

/* Κινητήρας τοποθέτησης logo */
.crezia-footer .footer-logo {
  display: flex;
  justify-content: var(--footer-logo-align);
  align-items: center;
  gap: 16px;
}
/* CREZIA — Footer logo (bring it to the left margin) */
.crezia-footer .footer-logo {
  margin-left: 0 !important;       /* Απομακρύνουμε το οποιοδήποτε margin */
  padding-left: 0 !important;      /* Μηδενίζουμε το padding για να φέρουμε το logo κοντά */
  display: flex;
  justify-content: flex-start;     /* Ευθυγράμμιση αριστερά */
  align-items: center;
}

.crezia-footer .footer-logo img {
  width: 95px !important;          /* Ρύθμιση πλάτους του logo */
  height: auto !important;
  object-fit: contain !important;
  margin-left: 0 !important;       /* Εξασφαλίζουμε ότι δεν υπάρχει περιθώριο αριστερά */
}
/* CREZIA — Footer logo tiny nudge further left */
.crezia-footer .footer-left{
  position: relative;
  transform: translateX(-14px); /* ← make more negative for further left (e.g. -18px, -22px) */
}

/* (optional) if you still need a tad more, trim the left gutter a touch */
.crezia-footer .cf-wrap{
  padding-left: 5.5% !important;  /* try 5.0% or 4.5% if needed */
  box-sizing: border-box;
}
/* CREZIA — Footer logo/address: stronger left nudge */
.crezia-footer .footer-left{
  position: relative;
  transform: translateX(-70px); /* ← αν θες κι άλλο: -28px, -32px */
}

.crezia-footer .cf-wrap{
  padding-left: 5% !important;   /* ↓ λίγο μικρότερο gutter αριστερά */
  box-sizing: border-box;
  overflow: visible;
}

/* Μην «ξεφύγει» σε πολύ μικρές οθόνες */
@media (max-width: 640px){
  .crezia-footer .footer-left{ transform: translateX(-10px); }
  .crezia-footer .cf-wrap{ padding-left: 6% !important; }
}
/* CREZIA — Footer address: Move slightly down */
.crezia-footer .footer-address {
  margin-top: 20px;  /* Ρύθμισε το margin-top: 15px ή 20px αν θέλεις να την κατεβάσεις πιο κάτω */
}
/* CREZIA — Footer address: Move slightly left */
.crezia-footer .footer-address {
  margin-left: 0px;  /* Ρύθμισε το από -4px μέχρι -10px για να την φέρεις κοντά στο logo */
}
/* CREZIA — Footer address: Move further left */
.crezia-footer .footer-address {
  transform: translateX(-19px);  /* Αλλάξτε το -12px με μικρότερα/μεγαλύτερα τιμή (π.χ. -16px ή -8px) */
}
/* CREZIA — Footer links: Move slightly left */
.crezia-footer .footer-right {
  transform: translateX(-54px);  /* Μπορείς να το κάνεις και -8px αν είναι υπερβολικό */
}
/* CREZIA — Footer links vertical alignment with address */
.crezia-footer .footer-right {
  transform: translateX(-54px) translateY(40px);  /* Μετακίνηση αριστερά και κατέβασμα προς ευθυγράμμιση */
}
/* =========================================================
   CREZIA — CR Placeholders (px-based, clean baseline)
   ========================================================= */

/* Σταθερό κεντρικό container */
.cr-container {
  width: 1200px;           /* σταθερό πλάτος εργασίας */
  max-width: 1200px;
  margin: 0 auto;
  box-sizing: border-box;
}

/* Ενότητα */
.cr-section {
  background: #fff;
  padding: 80px 0;         /* κάθετος αέρας ανά ενότητα */
  border: 0;
}

/* Δίστηλο grid με σταθερό gap */
.cr-grid {
  display: grid;
  grid-template-columns: 1fr 1fr; /* αριστερά/δεξιά */
  column-gap: 60px;               /* σταθερό οριζόντιο gap */
  align-items: center;
}

/* Reverse διάταξη για ζιγκ-ζαγκ (CR2) */
.cr-grid.cr-grid--reverse {
  direction: rtl;                 /* αντιστρέφει οπτικά τις στήλες */
}
.cr-grid.cr-grid--reverse > * {
  direction: ltr;                 /* ώστε τα περιεχόμενα να μένουν φυσιολογικά */
}

/* ===== Text holder (σταθερά px) ===== */
.cr-text {
  padding-left: 0;
  padding-right: 0;
}
.cr-title {
  margin: 0 0 16px 0;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 600;
  font-size: 28px;
  line-height: 34px; /* καθαρό line-height σε px */
  color: #111;
}
.cr-body {
  margin: 0;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 300;
  font-size: 16px;
  line-height: 24px; /* καθαρό σε px */
  letter-spacing: 0;
  color: #222;
}

/* ===== Image placeholder (σταθερό πλαίσιο) =====
   - Σταθερό πλάτος 540 px
   - Σταθερή αναλογία (portrait 11.64:15.88)
   - object-fit: contain -> να φαίνεται ΟΛΗ η εικόνα (no crop)
*/
.cr-media {}
.cr-imgbox {
  width: 540px;                     /* σταθερό πλάτος κάσας */
  height: auto;
  aspect-ratio: 11.64 / 15.88;      /* σταθερή αναλογία */
  background: #000;                 /* φόντο για τυχόν κενό */
  overflow: hidden;
  position: relative;
}
.cr-imgbox img {
  width: 100%;
  height: 100%;
  object-fit: contain;              /* ΔΕΝ κόβει — πλήρης εικόνα */
  display: block;
}

/* ===== Ζιγκ-ζαγκ πλευρές (R-L-R σε desktop) ===== */
.cr1 .cr-grid { /* Text left, Image right */ }
.cr2 .cr-grid.cr-grid--reverse { /* Image left, Text right */ }
.cr3 .cr-grid { /* Text left, Image right */ }

/* ===== Responsiveness (χωρίς % — μόνο breakpoints) ===== */
@media (max-width: 1240px) {
  .cr-container { width: 1000px; max-width: 1000px; }
}
@media (max-width: 1040px) {
  .cr-container { width: 900px; max-width: 900px; }
  .cr-imgbox { width: 480px; }
  .cr-grid { column-gap: 48px; }
  .cr-title { font-size: 26px; line-height: 32px; }
}
@media (max-width: 920px) {
  .cr-container { width: 760px; max-width: 760px; }
  .cr-imgbox { width: 440px; }
  .cr-grid { column-gap: 40px; }
}
@media (max-width: 800px) {
  .cr-container { width: 92vw; max-width: none; }
  .cr-grid { grid-template-columns: 1fr; row-gap: 28px; }
  .cr-imgbox { width: 520px; margin: 0 auto; }
  .cr-section { padding: 56px 0; }
}
@media (max-width: 560px) {
  .cr-imgbox { width: 420px; }
  .cr-title { font-size: 24px; line-height: 30px; }
  .cr-body { font-size: 15px; line-height: 22px; }
}
@media (max-width: 440px) {
  .cr-imgbox { width: 340px; }
}
/* =========================================================
   CREZIA — CR2 left align + CR3 hard crop (top & bottom)
   ========================================================= */

/* CR2: η εικόνα κολλάει αριστερά στο container */
.cr2 .cr-grid.cr-grid--reverse { direction: rtl; }    /* ήδη από πριν */
.cr2 .cr-grid.cr-grid--reverse > * { direction: ltr; }/* ήδη από πριν */
.cr2 .cr-media { justify-self: start; }               /* ⬅️ αριστερά, όχι κέντρο */
.cr2 .cr-imgbox { margin-left: 0; }                   /* χωρίς extra κενά */

/* CR1/CR3 (προαιρετικό για συνέπεια): οι εικόνες δεξιά */
.cr1 .cr-media,
.cr3 .cr-media { justify-self: end; }

/* ---------- CR3: crop όπως πριν (πάνω & κάτω) ---------- */
/* knobs για λεπτορύθμιση */
:root{
  --cr3-zoom: 1.08;   /* 1.04–1.12 ανάλογα πόσο “γεμάτο” το θέλεις */
  --cr3-pos: 0%;      /* κάθετη μετατόπιση: αρνητικό=πάνω, θετικό=κάτω (π.χ. -6%) */
}

/* διατηρούμε την ίδια κάσα */
.cr3 .cr-imgbox {
  width: 540px;
  aspect-ratio: 11.64 / 15.88;
  overflow: hidden;
  background: #000;
  position: relative;
}

/* η εικόνα γεμίζει την κάσα με crop + μικρό zoom */
.cr3 .cr-imgbox img {
  width: 100%;
  height: 100%;
  object-fit: cover;                     /* ✅ crop πάνω/κάτω */
  object-position: center var(--cr3-pos);/* καδράρισμα κεφαλιού */
  transform: scale(var(--cr3-zoom));     /* μικρό ζουμ όπως παλιά */
  display: block;
}
/* === CREZIA — Force CR2 image to the left === */
.cr2 .cr-media { 
  justify-self: start !important;   /* ⬅️ κολλάει στην αριστερή πλευρά της στήλης */
}
.cr2 .cr-imgbox {
  margin-left: 0 !important;
  margin-right: auto !important;    /* σπρώχνει προς τα αριστερά */
}

/* Αν για κάποιο λόγο το grid κεντράρει το παιδί του, ξεκεντράρουμε ρητά */
.cr2 .cr-grid {
  justify-items: stretch !important;
}
.cr2 .cr-media,
.cr2 .cr-text {
  justify-self: start !important;
}
/* === CREZIA — FORCE CR2 IMAGE TO LEFT (grid-areas override) === */
.cr2 .cr-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  grid-template-areas: "media text" !important;  /* ⬅️ εικόνα αριστερά, κείμενο δεξιά */
  justify-items: stretch !important;
  align-items: center !important;
}

/* ορισμός περιοχών */
.cr2 .cr-media { 
  grid-area: media !important;
  justify-self: start !important;      /* κολλάει στην αριστερή πλευρά */
}
.cr2 .cr-text  { 
  grid-area: text !important;
}

/* ακύρωση οποιουδήποτε centering/rtl/auto-margins που την κρατάνε δεξιά */
.cr2 .cr-grid.cr-grid--reverse { direction: ltr !important; }
.cr2 .cr-media,
.cr2 .cr-imgbox,
.cr2 .cr-imgbox img {
  margin: 0 !important;
}
.cr2 .cr-imgbox {
  margin-left: 0 !important;
  margin-right: auto !important;        /* σπρώξε προς τα αριστερά */
}

/* (προαιρετικό) αν θέλεις να έρθει ακόμα πιο "έξω" */
 /* .cr2 .cr-imgbox { transform: translateX(-10px); } */
/* =========================================================
   CREZIA — CR Placeholders (px-based, two text holders)
   ========================================================= */

/* Σταθερό container */
.cr-container { width: 1200px; max-width: 1200px; margin: 0 auto; box-sizing: border-box; }

/* Ενότητες */
.cr-section { background: #fff; padding: 80px 0; border: 0; }

/* Δίστηλο grid */
.cr-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 60px;
  align-items: center;
}

/* ===== 2 Text holders ===== */
.cr-text { display: block; }
.cr-text-title { margin: 0 0 14px 0; }
.cr-text-title h3 {
  margin: 0;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 600;
  font-size: 28px;
  line-height: 34px;
  color: #111;
}
.cr-text-body p {
  margin: 0;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 300;
  font-size: 16px;
  line-height: 24px;
  color: #222;
}

/* ===== Εικόνες (placeholders) ===== */
.cr-imgbox {
  width: 540px;
  aspect-ratio: 11.64 / 15.88;
  background: #000;
  overflow: hidden;
  position: relative;
}
.cr-imgbox img {
  width: 100%;
  height: 100%;
  object-fit: contain;   /* default: ολόκληρη εικόνα */
  display: block;
}

/* ===== Ζιγκ-ζαγκ (R-L-R) ===== */
/* CR1: Text left, Image right (ήδη με το grid) */
/* CR2: Εικόνα αριστερά, Κείμενο δεξιά — FORCE με grid areas */
.cr2 .cr-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  grid-template-areas: "media text" !important;
  justify-items: stretch !important;
  align-items: center !important;
}
.cr2 .cr-media { grid-area: media !important; justify-self: start !important; }
.cr2 .cr-text  { grid-area: text  !important; }
.cr2 .cr-imgbox { margin-left: 0 !important; margin-right: auto !important; }

/* CR3: εικόνα δεξιά με crop πάνω/κάτω όπως ζήτησες */
:root { --cr3-zoom: 1.08; --cr3-pos: 0%; }
.cr3 .cr-imgbox img {
  object-fit: cover;                     /* crop */
  object-position: center var(--cr3-pos);
  transform: scale(var(--cr3-zoom));
}

/* ===== Responsive (μόνο breakpoints, όχι %) ===== */
@media (max-width: 1240px) {
  .cr-container { width: 1000px; max-width: 1000px; }
}
@media (max-width: 1040px) {
  .cr-container { width: 900px; max-width: 900px; }
  .cr-imgbox { width: 480px; }
  .cr-grid { column-gap: 48px; }
  .cr-text-title h3 { font-size: 26px; line-height: 32px; }
}
@media (max-width: 920px) {
  .cr-container { width: 760px; max-width: 760px; }
  .cr-imgbox { width: 440px; }
  .cr-grid { column-gap: 40px; }
}
@media (max-width: 800px) {
  .cr-container { width: 92vw; max-width: none; }
  .cr-grid { grid-template-columns: 1fr; row-gap: 28px; }
  .cr-imgbox { width: 520px; margin: 0 auto; }
  .cr-section { padding: 56px 0; }
}
@media (max-width: 560px) {
  .cr-imgbox { width: 420px; }
  .cr-text-title h3 { font-size: 24px; line-height: 30px; }
  .cr-text-body p   { font-size: 15px; line-height: 22px; }
}
@media (max-width: 440px) {
  .cr-imgbox { width: 340px; }
}
/* =========================================================
   CREZIA — Raise all titles & text to align with top of image
   ========================================================= */

/* σε όλα τα sections (CR1–CR3) */
.cr-section .cr-grid {
  align-items: start !important;  /* το grid στοιχίζει τα στοιχεία στην κορυφή */
}

/* ρυθμιστικό για το πόσο “ψηλά” ξεκινά το κείμενο */
:root {
  --cr-text-top-shift: -20px;   /* αρνητικό = ανεβαίνει, θετικό = κατεβαίνει */
}

/* ανεβάζουμε τίτλο + σώμα ελαφρώς */
.cr-text {
  position: relative;
  top: var(--cr-text-top-shift);
}
/* === CR3: force right-only image visible & cropped === */
.cr3 .cr-grid{ grid-template-columns: 1fr 1fr !important; align-items: center !important; }
.cr3 .cr-media{ justify-self: end !important; }

.cr3 .cr-imgbox{
  width: 540px !important;
  aspect-ratio: 11.64 / 15.88 !important;
  overflow: hidden !important;
  background: #000 !important;
  position: relative !important;
}
.cr3 .cr-imgbox img{
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;              /* crop πάνω/κάτω */
  object-position: center var(--cr3-pos, 0%) !important;
  transform: scale(var(--cr3-zoom, 1.08)) !important;
}

/* αν κάτι παλιό την είχε “κρυμμένη”, το αναιρούμε */
.cr3 .cr-media,
.cr3 .cr-imgbox,
.cr3 .cr-imgbox img{
  opacity: 1 !important;
  visibility: visible !important;
}
/* === CREZIA — CR1: nudge title + text a bit lower (~5%) === */
.cr1 .cr-text {
  margin-top: 36px; /* ~5% του ύψους της εικόνας (~737px) */
}

/* λίγο μικρότερη μετατόπιση σε μικρότερες οθόνες */
@media (max-width: 800px) {
  .cr1 .cr-text { margin-top: 20px; }
}
/* === CREZIA — CR2: nudge title + text a bit lower (~5%) === */
.cr2 .cr-text {
  margin-top: 36px; /* ίδιο offset με CR1 */
}

/* πιο μαλακό offset σε tablet/mobile */
@media (max-width: 800px) {
  .cr2 .cr-text { margin-top: 20px; }
}
/* === CREZIA — HERO full image, no crop === */
.creators-hero {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #000;
  margin: 0;
  padding: 0;
}
.creators-hero .hero-img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: center center;
}

/* Overlay layer πάνω από την εικόνα */
.creators-hero .hero-overlay {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: 1fr 1fr; /* αριστερά subtext, δεξιά headline */
  align-items: end;
  padding: 12vh 6%;
  box-sizing: border-box;
  pointer-events: none; /* να μη "πιάνει" κλικ */
}

/* Αριστερό subtext (σταθερό) */
.creators-hero .hero-subtext {
  align-self: start;
  max-width: 560px;
  color: #fff;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 300;
  font-size: 18px;
  line-height: 1.34;
  letter-spacing: -0.01em;
  text-shadow: 0 2px 10px rgba(0,0,0,.25);
  margin-top: 18vh; /* πόσο χαμηλά ξεκινά */
}

/* Δεξί μεγάλο headline (αναδυόμενο) */
.creators-hero .hero-title {
  justify-self: end;
  text-align: left;
  padding-left: 18%;
  margin: 0;
  color: #fff;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 600;
  font-size: 46px;
  line-height: 1.05;
  text-shadow: 0 3px 14px rgba(0,0,0,.25);

  opacity: 0;
  transform: translateY(40px);
  animation: heroRise 900ms ease 120ms forwards;
}

@keyframes heroRise {
  to { opacity: 1; transform: translateY(0); }
}

/* Responsive tweaks */
@media (max-width: 1200px) {
  .creators-hero .hero-title { font-size: 42px; padding-left: 12%; }
  .creators-hero .hero-subtext { font-size: 17px; margin-top: 14vh; }
}
@media (max-width: 1024px) {
  .creators-hero .hero-overlay {
    grid-template-columns: 1fr;
    align-items: start;
    row-gap: 24px;
    padding: 12vh 6% 8vh;
  }
  .creators-hero .hero-title {
    justify-self: start;
    padding-left: 0;
    font-size: 36px;
  }
  .creators-hero .hero-subtext { margin-top: 2vh; }
}
@media (max-width: 640px) {
  .creators-hero .hero-title { font-size: 30px; }
  .creators-hero .hero-subtext { font-size: 16px; line-height: 1.38; }
}

/* === CR1/CR2 μικρό “κατέβασμα” ~5% όπως ζητήθηκε === */
.cr1 .cr-text { margin-top: 36px; }
.cr2 .cr-text { margin-top: 36px; }
@media (max-width: 800px) {
  .cr1 .cr-text, .cr2 .cr-text { margin-top: 20px; }
}

/* === CR2 αριστερά εικόνα — force === */
.cr2 .cr-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  grid-template-areas: "media text" !important;
  justify-items: stretch !important;
  align-items: center !important;
}
.cr2 .cr-media { grid-area: media !important; justify-self: start !important; }
.cr2 .cr-text  { grid-area: text  !important; }
.cr2 .cr-imgbox { margin-left: 0 !important; margin-right: auto !important; }

/* === CR3 εικόνα cropped δεξιά (όπως πριν) === */
:root { --cr3-zoom: 1.08; --cr3-pos: 0%; }
.cr3 .cr-imgbox img {
  object-fit: cover;
  object-position: center var(--cr3-pos);
  transform: scale(var(--cr3-zoom));
}
/* === CREZIA — HERO (SMOOTH GLIDE MOTION) === */

.creators-hero .hero-title {
  justify-self: end;
  text-align: left;
  padding-left: 18%;
  margin: 0;
  color: #fff;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 600;
  font-size: 46px;
  line-height: 1.05;
  text-shadow: 0 3px 14px rgba(0,0,0,.25);

  opacity: 0;
  transform: translateY(100vh);
  animation: heroGlideUp 4.5s cubic-bezier(0.19, 1, 0.22, 1) 0.2s forwards;
  position: relative;
  top: -10vh;
}

/* Ομαλή συνεχόμενη κύλιση */
@keyframes heroGlideUp {
  0%   { opacity: 0; transform: translateY(100vh); }
  10%  { opacity: 0.2; }
  40%  { opacity: 0.6; }
  100% { opacity: 1; transform: translateY(0); }
}
/* =========================================================
   CREZIA — HERO (final smooth glide version)
   ========================================================= */
.creators-hero {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #000;
  margin: 0;
  padding: 0;
}

/* HERO IMAGE */
.creators-hero .hero-img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: center center;
}

/* OVERLAY GRID */
.creators-hero .hero-overlay {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: start;
  padding: 10vh 6%;
  box-sizing: border-box;
  pointer-events: none;
}

/* ΑΡΙΣΤΕΡΟ ΚΕΙΜΕΝΟ */
.creators-hero .hero-subtext {
  align-self: start;
  max-width: 560px;
  color: #fff;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 300;
  font-size: 18px;
  line-height: 1.34;
  text-shadow: 0 2px 10px rgba(0,0,0,.25);
  margin-top: 46vh; /* πιο χαμηλά */
}

/* ΔΕΞΙΟΣ ΤΙΤΛΟΣ — ομαλή συνεχόμενη κύλιση */
.creators-hero .hero-title {
  justify-self: end;
  text-align: left;
  padding-left: 18%;
  margin: 0;
  color: #fff;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 600;
  font-size: 46px;
  line-height: 1.05;
  text-shadow: 0 3px 14px rgba(0,0,0,.25);

  opacity: 0;
  transform: translateY(100vh);
  animation: heroGlideUp 4.5s cubic-bezier(0.19, 1, 0.22, 1) 0.2s forwards;
  position: relative;
  top: -10vh;
}

/* === SMOOTH GLIDE ANIMATION === */
@keyframes heroGlideUp {
  0%   { opacity: 0; transform: translateY(100vh); }
  10%  { opacity: 0.2; }
  40%  { opacity: 0.6; }
  100% { opacity: 1; transform: translateY(0); }
}

/* === RESPONSIVE TUNING === */
@media (max-width: 1200px) {
  .creators-hero .hero-title {
    font-size: 42px;
    animation: heroGlideUp 4s cubic-bezier(0.19,1,0.22,1) 0.25s forwards;
  }
  .creators-hero .hero-subtext { margin-top: 40vh; }
}
@media (max-width: 1024px) {
  .creators-hero .hero-overlay {
    grid-template-columns: 1fr;
    row-gap: 24px;
    padding: 10vh 6% 8vh;
  }
  .creators-hero .hero-title {
    justify-self: start;
    padding-left: 0;
    font-size: 36px;
    animation: heroGlideUp 3.6s cubic-bezier(0.19,1,0.22,1) 0.2s forwards;
  }
  .creators-hero .hero-subtext { margin-top: 30vh; }
}
@media (max-width: 640px) {
  .creators-hero .hero-title {
    font-size: 30px;
    animation: heroGlideUp 3s cubic-bezier(0.19,1,0.22,1) 0.15s forwards;
  }
  .creators-hero .hero-subtext {
    font-size: 16px;
    margin-top: 24vh;
  }
}
/* === CREZIA — HERO: slower entrance (override) === */
.creators-hero .hero-title{
  animation: heroGlideUp 6s cubic-bezier(0.19, 1, 0.22, 1) 0.25s forwards !important;
}

/* πιο αργά και στα breakpoints */
@media (max-width: 1200px){
  .creators-hero .hero-title{
    animation: heroGlideUp 5.2s cubic-bezier(0.19,1,0.22,1) 0.22s forwards !important;
  }
}
@media (max-width: 1024px){
  .creators-hero .hero-title{
    animation: heroGlideUp 4.6s cubic-bezier(0.19,1,0.22,1) 0.18s forwards !important;
  }
}
@media (max-width: 640px){
  .creators-hero .hero-title{
    animation: heroGlideUp 4.2s cubic-bezier(0.19,1,0.22,1) 0.12s forwards !important;
  }
}
/* === CREZIA — HERO: subtext size/legibility override === */
.creators-hero .hero-subtext{
  font-size: 22px !important;
  line-height: 1.36 !important;
  text-shadow: 0 2px 12px rgba(0,0,0,0.35), 0 0 1px rgba(0,0,0,0.6) !important; /* λίγο πιο έντονη ευκρίνεια */
}
/* === CREZIA — HERO: subtext lower & lighter size (no extra weight) === */
.creators-hero .hero-subtext{
  font-weight: inherit !important;   /* κράτα το default του theme (όχι πιο βαρύ) */
  font-size: 20px !important;        /* από 22px → λίγο πιο χαμηλά */
  line-height: 1.34 !important;
  margin-top: 52vh !important;       /* πιο κάτω, περίπου στο ύψος εκκίνησης του headline */
  text-shadow: 0 2px 12px rgba(0,0,0,0.35), 0 0 1px rgba(0,0,0,0.55) !important;
}

/* προσαρμογές σε μικρότερες οθόνες */
@media (max-width: 1200px){
  .creators-hero .hero-subtext{ font-size: 19px !important; margin-top: 46vh !important; }
}
@media (max-width: 1024px){
  .creators-hero .hero-subtext{ font-size: 18px !important; margin-top: 34vh !important; }
}
@media (max-width: 640px){
  .creators-hero .hero-subtext{ font-size: 17px !important; margin-top: 26vh !important; }
}
/* === CREZIA — HERO: shift subtext further left (away from white area) === */
.creators-hero .hero-subtext{
  margin-left: -60px !important; /* σπρώχνει το κείμενο πιο αριστερά */
}

/* πιο ήπιο σε μικρότερες οθόνες */
@media (max-width: 1200px){
  .creators-hero .hero-subtext{ margin-left: -40px !important; }
}
@media (max-width: 1024px){
  .creators-hero .hero-subtext{ margin-left: -24px !important; }
}
@media (max-width: 640px){
  .creators-hero .hero-subtext{ margin-left: 0 !important; } /* στο mobile μένει μέσα στα paddings */
}
/* === CREZIA — HERO: subtle lift for subtext === */
.creators-hero .hero-subtext{
  margin-top: 34vh !important; /* πριν ήταν 52vh — ένα “κλικ” πιο πάνω */
}
/* === CREZIA — CTA κάτω από CR3 === */
.cr-cta-register{
  background:#fff;
  margin-top: 36px;           /* «ένα κλικ» πιο χαμηλά από την CR3 */
  padding: 24px 0 80px;       /* επιπλέον κάτω «αέρας» */
}
.cr-cta-register .cr-cta-wrap{
  display:flex;
  justify-content:center;
  align-items:center;
}

.cr-btn{
  display:inline-block;
  font-family:"Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight:600;
  font-size:16px;
  line-height:1;
  padding:14px 28px;
  border-radius:999px;
  text-decoration:none;
  transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease, border-color .18s ease;
}

/* εμφάνιση παρόμοια με το header CTA, αλλά αυτοτελής */
.cr-btn--primary{
  background:#111;
  color:#fff;
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 8px 24px rgba(0,0,0,.14);
}
.cr-btn--primary:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 28px rgba(0,0,0,.18);
}
.cr-btn--primary:active{
  transform:translateY(0);
  box-shadow:0 6px 18px rgba(0,0,0,.14);
}

/* μικρή ενίσχυση σε mobile */
@media (max-width: 640px){
  .cr-btn{ font-size:15px; padding:13px 24px; }
}
/* === CREZIA — Fix: black strip between CR3 & CTA + white outlined button === */

/* 1) Καθάρισε background/περιθώρια για να μη βγαίνει μαύρη λωρίδα */
body, .site, main.creators-info-page,
.cr-section, .cr3, .cr-cta-register {
  background:#fff !important;
}

.cr3, .cr-cta-register {
  margin:0 !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
}

/* αν κάποιο container της εικόνας είχε χρώμα */
.cr3 .cr-container, .cr3 .cr-grid, .cr3 .cr-media, .cr3 .cr-imgbox {
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

/* δώσε μόνο λίγο «αέρα» πριν το CTA */
.cr-cta-register {
  padding: 28px 0 80px !important; /* πάνω | κάτω */
}

/* 2) Button = άσπρο με μαύρο περίγραμμα, μαύρα γράμματα
      και hover → μαύρο φόντο, άσπρα γράμματα */
.cr-cta-register .cr-cta-wrap{
  display:flex;
  justify-content:center;
  align-items:center;
}

.cr-btn{
  display:inline-block;
  font-family:"Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight:600;
  font-size:16px;
  line-height:1;
  padding:14px 28px;
  border-radius:999px;
  text-decoration:none;
  transition:background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.cr-btn--primary{
  background:#fff !important;
  color:#111 !important;
  border:2px solid #111 !important;
  box-shadow:none !important;
}

.cr-btn--primary:hover{
  background:#111 !important;
  color:#fff !important;
  transform:translateY(-1px);
}

.cr-btn--primary:active{
  transform:translateY(0);
}

/* ελαφρύ fine-tune σε mobile */
@media (max-width:640px){
  .cr-btn{ font-size:15px; padding:13px 24px; }
}
/* === CREZIA — HERO: lower final stop for headline === */
.creators-hero .hero-title{
  top: -6vh !important;  /* ήταν -10vh → κατεβαίνει λίγο */
}

/* κρατάμε αναλογία και στα breakpoints */
@media (max-width: 1200px){
  .creators-hero .hero-title{ top: -5vh !important; }
}
@media (max-width: 1024px){
  .creators-hero .hero-title{ top: -4vh !important; }
}
@media (max-width: 640px){
  .creators-hero .hero-title{ top: -3vh !important; }
}
/* === CREZIA — Original Coming Soon === */
.crezia-comingsoon{
  background:#000;
  color:#fff;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  flex-direction:column;
  padding:40px 6%;
}
.crezia-comingsoon .cs-logo img{
  width:120px;
  height:auto;
  margin-bottom:20px;
  filter:brightness(1.4);
}
.crezia-comingsoon .cs-title{
  font-family:"Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-size:26px;
  font-weight:600;
  margin:10px 0;
}
.crezia-comingsoon .cs-subtitle{
  font-size:17px;
  font-weight:300;
  color:#ccc;
  margin:0;
}
/* === CREZIA — Coming Soon (White Version) === */
.cs-white-page {
  background: #fff;
  color: #111;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 60px 6%;
  box-sizing: border-box;
}

.cs-white-wrap {
  max-width: 640px;
  margin: 0 auto;
}

.cs-logo-heart img {
  width: 128px;
  height: auto;
  animation: pulseHeart 2.8s ease-in-out infinite;
  margin-bottom: 28px;
}

@keyframes pulseHeart {
  0%   { transform: scale(1); opacity: 1; }
  50%  { transform: scale(1.05); opacity: 0.85; }
  100% { transform: scale(1); opacity: 1; }
}

.cs-title-en {
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 600;
  font-size: 30px;
  line-height: 1.2;
  margin: 0 0 14px 0;
}

.cs-title-gr {
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 300;
  font-size: 22px;
  line-height: 1.3;
  margin: 0;
  color: #444;
}

/* Mobile adjustments */
@media (max-width: 640px) {
  .cs-logo-heart img { width: 96px; margin-bottom: 20px; }
  .cs-title-en { font-size: 26px; }
  .cs-title-gr { font-size: 18px; }
}
/* === CREZIA — Coming Soon (white, GR top • logo • EN bottom) === */
.cs-white-page{
  background:#fff;
  color:#111;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:60px 6%;
  box-sizing:border-box;
}
.cs-white-wrap{
  text-align:center;
  max-width:720px;
  margin:0 auto;
}

/* Κοινό στυλ τίτλων (ίδια γραμματοσειρά/ύφος με το αγγλικό) */
.cs-title{
  font-family:"Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight:600;          /* ίδιο weight και για τα δύο */
  font-size:30px;
  line-height:1.25;
  margin:0;
}

/* Αποστάσεις */
.cs-title--gr{ margin-bottom:18px; }  /* πάνω από το logo */
.cs-title--en{ margin-top:18px; }     /* κάτω από το logo */

/* Logo στη μέση με pulsing effect */
.cs-logo-heart img{
  width:128px;
  height:auto;
  margin:0 auto;
  display:block;
  animation:pulseHeart 2.8s ease-in-out infinite;
}
@keyframes pulseHeart{
  0%{ transform:scale(1); opacity:1; }
  50%{ transform:scale(1.05); opacity:0.9; }
  100%{ transform:scale(1); opacity:1; }
}

/* Mobile fine-tune */
@media (max-width:640px){
  .cs-title{ font-size:26px; }
  .cs-logo-heart img{ width:96px; }
  .cs-title--gr{ margin-bottom:14px; }
  .cs-title--en{ margin-top:14px; }
}
/* === CREZIA — Creators Info: "Why" divider (raised + tighter) === */
.cr-why{
  background:#fff;
  padding:38px 6% 32px;   /* μειώσαμε ακόμη ~60 % το vertical spacing */
}
.cr-why .cr-why-wrap{
  max-width:980px;
  margin:0 auto;
  text-align:center;
  transform: translateY(-40px); /* ✳️ ανεβάζει οπτικά το block πιο πάνω */
}
.cr-why h3{
  margin:0;
  font-family:"Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight:600;
  font-size:28px;
  line-height:1.22;
  letter-spacing:-0.01em;
}

@media (max-width:640px){
  .cr-why{
    padding:30px 6% 24px;
  }
  .cr-why .cr-why-wrap{
    transform: translateY(-24px);
  }
  .cr-why h3{
    font-size:24px;
  }
}
/* === CR4/CR5: φυσική αναλογία εικόνας (καμία αναγκαστική κάσα) === */
.cr-imgbox--auto{
  width: 540px;          /* κράτα σταθερό πλάτος για ομοιομορφία */
  max-width: 100%;
  /* χωρίς aspect-ratio → αφήνουμε τη φωτογραφία να δώσει ύψος */
  background: none;
  overflow: visible;
  display: block;
}
.cr-imgbox--auto img{
  display: block;
  width: 100%;
  height: auto;          /* φυσική αναλογία, καμία παραμόρφωση */
  object-fit: contain;   /* καμία περικοπή */
}

/* μικρότερο padding σε mobile για “ανάσα” */
@media (max-width: 1024px){
  .cr-section.cr4,
  .cr-section.cr5{ padding: 48px 6%; }
}
@media (max-width: 640px){
  .cr-section.cr4,
  .cr-section.cr5{ padding: 40px 6%; }
}
/* === CR4 → CR5 ultra-tight gap (3 clicks closer) === */
.cr-section.cr4 {
  padding-bottom: 4px !important;   /* πριν 16px → τώρα πολύ κοντά */
}
.cr-section.cr5 {
  padding-top: 6px !important;      /* πριν 18px */
}

/* κρατάμε λίγο χώρο στο τέλος της σελίδας */
.cr-section.cr5 {
  padding-bottom: 56px !important;
}

/* προαιρετικά: μειώνουμε και το εσωτερικό gap του grid για συνοχή */
.cr4 .cr-grid,
.cr5 .cr-grid {
  gap: 32px;
}
/* === CR4–CR5: tighter vertical proximity (step 2) === */
.cr-section.cr4 {
  padding-bottom: 0 !important;
  margin-bottom: -230px !important;   /* ακόμη πιο κοντά */
}
.cr-section.cr5 {
  padding-top: 0 !important;
  margin-top: -230px !important;
}

/* προστασία overlap */
.cr4 img, .cr5 img {
  display: block !important;
  position: relative !important;
  z-index: 1 !important;
}
/* === Divider (full-bleed, λεπτή μαύρη γραμμή) === */
.cr-divider {
  background: #fff;
  padding: 16px 0 12px;             /* λίγο αέρας πάνω/κάτω από τη γραμμή */
}
.cr-divider-line {
  height: 1px;
  width: 100vw;                     /* full-bleed από άκρη σε άκρη */
  margin-left: calc(50% - 50vw);    /* ξεχειλώνει εκτός container */
  background: #111;
  opacity: 0.9;
}

/* μικρότερο padding σε mobile */
@media (max-width: 640px){
  .cr-divider { padding: 12px 0 8px; }
}
/* === CR4 paragraph spacing fix === */
.cr4 .cr4-text p {
  margin: 0 0 26px 0 !important; /* 👈 πιο μεγάλο κενό ανά πρόταση */
}
/* === CR4 image visibility fix === */
.cr4 .cr-imgbox img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  visibility: visible !important;
  opacity: 1 !important;
}
/* === CR4 image + text correction === */
.cr4 .cr-imgbox img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.cr4 .cr-text {
  color: #111;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 300;
  font-size: 17px;
  line-height: 1.48;
  margin-left: 60px; /* ✅ φέρνει το κείμενο λίγο μέσα από την εικόνα */
}
/* CR4 visibility + proper side-by-side alignment */
.cr4 .cr-imgbox img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  opacity: 1;
  visibility: visible;
}

.cr4 .cr-text {
  margin-left: 60px;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-size: 17px;
  line-height: 1.48;
  color: #111;
}
/* Force CR4: image left, text right (ανεξάρτητα από άλλα grid rules) */
.cr4 .cr-media { order: 1 !important; }
.cr4 .cr-text  { order: 2 !important; }

/* Εγγύηση ορατότητας εικόνας CR4 */
.cr4 .cr-imgbox img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
  opacity:1 !important;
  visibility:visible !important;
}

/* Κενά μεταξύ παραγράφων CR4 όπως τα ήθελες */
.cr4 .cr4-text p{ margin:0 0 26px 0 !important; }
/* === CR4 image +10% upscale (height & width) === */
.cr4 .cr-imgbox img {
  transform: scale(1.1);
  transform-origin: center center;
  transition: transform 0.4s ease;
}
/* === CR5 image +10% upscale (same as CR4) === */
.cr5 .cr-imgbox { 
  overflow: hidden;           /* safety, μην ξεχειλίσει */
}
.cr5 .cr-imgbox img {
  transform: scale(1.3);      /* +10% σε πλάτος/ύψος */
  transform-origin: center center;
  transition: transform 0.4s ease;
  object-fit: contain;        /* χωρίς crop */
  width: 100%;
  height: auto;
  display: block;
}
/* =========================================================
   CREZIA — Page Creators New
   ========================================================= */

.page-creators-new {
  background:#fff;
  color:#111;
  font-family:"Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
}

/* ---------- HERO ---------- */
.pcn-hero {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background:#000;
}
.pcn-hero__img {
  display:block;
  width:100%;
  height:auto;
  object-fit: contain;     /* πλήρης εικόνα, χωρίς crop */
  object-position:center center;
}
.pcn-hero__overlay {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: start;
  padding: 10vh 6%;
  box-sizing: border-box;
  pointer-events: none;
}
.pcn-hero__subtext {
  max-width: 560px;
  color:#fff;
  font-weight:300;
  font-size:18px;
  line-height:1.34;
  text-shadow:0 2px 10px rgba(0,0,0,.25);
  margin-top: 34vh;        /* χαμηλά αριστερά, όπως στο ζητούμενο */
}
.pcn-hero__title {
  justify-self: end;
  text-align:left;
  padding-left: 18%;
  margin:0;
  color:#fff;
  font-weight:600;
  font-size:46px;
  line-height:1.05;
  text-shadow:0 3px 14px rgba(0,0,0,.25);
  position: relative;
  top:-10vh;               /* να φαίνεται αμέσως στο fold */
}

/* ---------- Rows (CR1–CR6) ---------- */
.pcn-row {
  display:grid;
  grid-template-columns: 1fr 1fr;
  align-items:center;
  gap:60px;
  padding: 80px 6%;
  box-sizing: border-box;
}
.pcn-row--reverse { direction: rtl; }
.pcn-row--reverse > * { direction: ltr; } /* κρατά το κείμενο σωστά */
.pcn-row__media .pcn-imgbox {
  width: min(36vw, 540px);
  aspect-ratio: 11.64 / 15.88;
  overflow:hidden;
  background:#000;
  display:grid;
  place-items:center;
}
.pcn-row__media img {
  display:block;
  width:100%;
  height:100%;
  object-fit: cover;      /* ελαφρύ crop για “sharp” look */
  transform: scale(1.06); /* διακριτικό zoom όπως στη σελίδα-δείγμα */
  transform-origin:center center;
}
.pcn-row__text .pcn-row__title {
  margin: 0 0 18px 0;
  font-weight:600;
  font-size:32px;
  line-height:1.18;
  letter-spacing:-0.01em;
}
.pcn-row__text .pcn-row__body p {
  margin:0 0 14px 0;
  font-weight:300;
  font-size:17px;
  line-height:1.48;
  letter-spacing:-0.005em;
}

/* ---------- Divider + mid title ---------- */
.pcn-divider {
  height:1px;
  background:#111;
  opacity:.12;
  margin: 60px 6% 26px;
}
.pcn-midtitle {
  padding: 0 6%;
}
.pcn-midtitle h4 {
  margin: 0 0 6px 0;
  font-weight:600;
  font-size:22px;
  letter-spacing:-0.01em;
}

/* ---------- Gallery (CR7–CR18) ---------- */
.pcn-gallery {
  padding: 30px 6% 90px;
}
.pcn-gallery__grid {
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:22px;
}
.pcn-tile {
  margin:0;
  aspect-ratio: 11.64 / 15.88; /* ίδιες αναλογίες */
  overflow:hidden;
  background:#000;
}
.pcn-tile img {
  display:block;
  width:100%;
  height:100%;
  object-fit: cover;
  transform: scale(1.04);       /* διακριτικό zoom */
  transition: transform .6s ease, opacity .6s ease;
}
.pcn-tile:hover img {
  transform: scale(1.08);
}

/* ---------- CTA ---------- */
.pcn-cta {
  display:grid;
  place-items:center;
  padding: 30px 0 90px;
}
.pcn-btn {
  display:inline-block;
  padding: 12px 22px;
  border-radius: 999px;
  text-decoration:none;
  font-weight:600;
  font-size:14px;
  line-height:1;
  letter-spacing:.02em;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.pcn-btn--ghost {
  background:#fff;
  color:#111;
  border: 1.5px solid #111;
}
.pcn-btn--ghost:hover {
  background:#111;
  color:#fff;
  border-color:#111;
}

/* ---------- Scroll reveal (όπως στο δείγμα: smooth fade/zoom-on-enter) ---------- */
.js-reveal {
  opacity: 0;
  transform: translateY(26px) scale(.98);
  transition: opacity .9s ease, transform .9s cubic-bezier(.19,1,.22,1);
}
.js-reveal.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* ---------- Responsive ---------- */
@media (max-width: 1200px){
  .pcn-hero__title { font-size:42px; top:-8vh; }
  .pcn-hero__subtext { margin-top: 28vh; }
}
@media (max-width: 1024px){
  .pcn-hero__overlay{
    grid-template-columns:1fr;
    row-gap:28px;
    padding: 10vh 6% 8vh;
  }
  .pcn-hero__title{
    justify-self:start;
    padding-left:0;
    font-size:36px;
    top:-6vh;
  }
  .pcn-hero__subtext { margin-top:6vh; }

  .pcn-row{
    grid-template-columns:1fr;
    gap:26px;
    padding: 60px 6%;
  }
  .pcn-row__media .pcn-imgbox{
    width: min(64vw, 560px);
  }

  .pcn-gallery__grid{
    grid-template-columns: repeat(2, 1fr);
    gap:18px;
  }
}
@media (max-width: 640px){
  .pcn-hero__title { font-size:30px; top:-4vh; }
  .pcn-hero__subtext { font-size:16px; line-height:1.38; margin-top:4vh; }

  .pcn-row__text .pcn-row__title{ font-size:26px; }
  .pcn-row__text .pcn-row__body p{ font-size:15px; }

  .pcn-gallery__grid{ grid-template-columns:1fr; }
}
/* ---------- Interlude (μεταξύ CR5 και CR6) ---------- */
.pcn-interlude {
  padding: 90px 6% 100px;           /* άφθονος “αέρας” πάνω/κάτω */
  background: #fff;
  display: grid;
  place-items: center;
}
.pcn-interlude__inner {
  max-width: 880px;                 /* στενό για καλύτερη ανάγνωση */
  text-align: center;               /* στο κέντρο όπως ζήτησες */
}
.pcn-interlude__inner p {
  margin: 0 0 16px 0;
  font-weight: 300;
  font-size: 18px;
  line-height: 1.55;
  letter-spacing: -0.005em;
  color: #111;
}
.pcn-interlude__inner h4 {
  margin: 22px 0 12px 0;
  font-weight: 600;
  font-size: 22px;
  letter-spacing: -0.01em;
  color: #111;
}
.pcn-interlude__list {
  list-style: disc;
  margin: 0 auto;
  padding-left: 1.2em;              /* μικρή εσοχή για bullets */
  display: inline-block;            /* ώστε να κεντραριστεί με text-align:center */
  text-align: left;                 /* αλλά το ίδιο το list να μένει “αριστερό” */
}
.pcn-interlude__list li {
  margin: 6px 0;
  font-weight: 400;
  font-size: 17px;
  line-height: 1.5;
  color: #111;
}

/* μικρότερο padding σε mobile */
@media (max-width: 1024px){
  .pcn-interlude { padding: 70px 6% 80px; }
}
@media (max-width: 640px){
  .pcn-interlude { padding: 56px 6% 70px; }
  .pcn-interlude__inner p { font-size: 16px; }
  .pcn-interlude__list li { font-size: 16px; }
}
/* ===== Centered divider + headings (μετά την CR6) ===== */
.pcn-divider{
  width: 100%;
  height: 1px;
  border: 0;
  background: #111;
  opacity: .18;
  margin: 56px 0 36px;
}

.pcn-center{
  width: 100%;
  padding: 0 6%;
  display: grid;
  place-items: center;
  text-align: center;
  background: #fff;
}

.pcn-center--narrow .pcn-center__body,
.pcn-center--narrow .pcn-center__subtitle{
  max-width: 880px;
}

.pcn-center__title{
  margin: 0 0 18px 0;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 600;
  font-size: 30px;
  line-height: 1.18;
  letter-spacing: -0.01em;
  color: #111;
}

.pcn-center__subtitle{
  margin: 10px 0 12px 0;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 600;
  font-size: 24px;
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: #111;
}

.pcn-center__body{
  margin: 4px 0 0 0;
}

.pcn-center__body p{
  margin: 0 0 14px 0;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 300;
  font-size: 18px;
  line-height: 1.55;
  letter-spacing: -0.005em;
  color: #111;
}

/* μικρότερες οθόνες */
@media (max-width: 1024px){
  .pcn-divider{ margin: 48px 0 28px; }
  .pcn-center__title{ font-size: 26px; }
  .pcn-center__subtitle{ font-size: 22px; }
  .pcn-center__body p{ font-size: 16px; }
}
@media (max-width: 640px){
  .pcn-divider{ margin: 40px 0 24px; }
  .pcn-center__title{ font-size: 24px; }
  .pcn-center__subtitle{ font-size: 20px; }
}
/* ===== CENTERING FIX (hard-center, independent of surrounding grids) ===== */
.pcn-center{
  position: relative;
  clear: both;                 /* δεν «τραβιέται» από προηγούμενα floats/grids */
  width: 100%;
  background: #fff;
  padding: 0;                  /* το padding πάει στον inner για τέλειο centering */
  display: block;              /* όχι grid εδώ – αποφεύγουμε τυχόν κληρονομιές */
}

.pcn-center__inner{
  max-width: 980px;            /* ρυθμίζεις αν θες πιο στενό/φαρδύ */
  margin-left: auto;
  margin-right: auto;
  padding: 0 16px;             /* εσωτερικά gutters */
  text-align: center;          /* κεντραρισμένο ΟΛΟ το κείμενο */
  box-sizing: border-box;
}

.pcn-divider{
  width: 100%;
  max-width: 980px;            /* ίσο με το inner πλάτος για οπτική ευθυγράμμιση */
  height: 1px;
  border: 0;
  background: #111;
  opacity: .18;
  margin: 56px auto 36px;      /* auto = σωστό κέντρο */
}

/* Τίτλοι/σώμα */
.pcn-center__title{
  margin: 0 0 18px 0;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 600;
  font-size: 30px;
  line-height: 1.18;
  letter-spacing: -0.01em;
  color: #111;
}

.pcn-center__subtitle{
  margin: 10px 0 12px 0;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 600;
  font-size: 24px;
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: #111;
}

.pcn-center__body{
  margin: 4px 0 0 0;
}

.pcn-center__body p{
  margin: 0 0 14px 0;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight: 300;
  font-size: 18px;
  line-height: 1.55;
  letter-spacing: -0.005em;
  color: #111;
}

/* Responsive tweaks */
@media (max-width: 1024px){
  .pcn-divider{ margin: 48px auto 28px; }
  .pcn-center__title{ font-size: 26px; }
  .pcn-center__subtitle{ font-size: 22px; }
  .pcn-center__body p{ font-size: 16px; }
}
@media (max-width: 640px){
  .pcn-divider{ margin: 40px auto 24px; }
  .pcn-center__title{ font-size: 24px; }
  .pcn-center__subtitle{ font-size: 20px; }
}
/* === CREZIA — Gallery image badges (CR7–CR18) === */
.pcn-gallery__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
  padding: 60px 6% 80px;
  background: #fff;
}

.pcn-tile {
  position: relative;
  overflow: hidden;
}

.pcn-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s ease;
}

.pcn-tile:hover img {
  transform: scale(1.04);
}

/* Overlay badge */
.pcn-imgbox {
  position: relative;
  display: block;
}

.pcn-badge {
  position: absolute;
  left: 14px;
  bottom: 14px;
  padding: 7px 14px;
  border-radius: 999px;
  background: rgba(0,0,0,0.55);
  color: #fff;
  font-family: "Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.01em;
  pointer-events: none;
  user-select: none;
  backdrop-filter: saturate(120%) blur(2px);
  transition: background .3s ease;
}

.pcn-tile:hover .pcn-badge {
  background: rgba(0,0,0,0.7);
}

/* Responsive fine-tune */
@media (max-width: 1024px){
  .pcn-gallery__grid{ gap: 10px; padding: 40px 5% 60px; }
  .pcn-badge{ font-size: 13px; padding: 6px 12px; left: 10px; bottom: 10px; }
}
@media (max-width: 640px){
  .pcn-gallery__grid{ gap: 8px; padding: 36px 4% 48px; }
  .pcn-badge{ font-size: 12px; padding: 5px 10px; left: 8px; bottom: 8px; }
}
/* === CREZIA — Pre-CTA big title === */
.pcn-precta{
  background:#fff;
  padding: 48px 6% 12px;   /* αέρας από το gallery, μικρό κενό πριν το CTA */
  text-align:center;
}
.pcn-precta__title{
  margin:0;
  font-family:"Poppins","Sofia Sans",Helvetica,Arial,sans-serif;
  font-weight:700;          /* bold */
  font-size:42px;           /* “μεγάλα γράμματα” */
  line-height:1.08;
  letter-spacing:-0.01em;
  color:#111;
}

@media (max-width:1024px){
  .pcn-precta{ padding: 40px 5% 8px; }
  .pcn-precta__title{ font-size:36px; }
}
@media (max-width:640px){
  .pcn-precta{ padding: 32px 4% 6px; }
  .pcn-precta__title{ font-size:30px; }
}
.crezia-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.crezia-menu {
  display: flex;
  gap: 18px; /* λίγο μεγαλύτερο κενό μεταξύ links */
  flex-wrap: nowrap;
}

.crezia-auth {
  display: flex;
  gap: 12px;          /* κενό ανάμεσα σε Είσοδος/Εγγραφή */
  margin-left: 12px;  /* έξτρα αέρας από το menu */
  white-space: nowrap;
}

@media (max-width: 900px) {
  .crezia-menu { gap: 14px; }
  .crezia-auth { gap: 10px; }
}
/* CREATORS header layout */
.crezia-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.crezia-auth--creators {
  display: flex;
  gap: 12px;
  white-space: nowrap;
}

.auth-link.auth-primary {
  padding: 6px 12px;
  border: 1px solid currentColor;
  border-radius: 999px;
}

/* Optional: λίγο πιο σφιχτό σε στενά πλάτη */
@media (max-width: 900px) {
  .crezia-auth--creators { gap: 10px; }
}
.crezia-brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: inherit;
}
.crezia-brand:hover { text-decoration: none; opacity: .96; }
.crezia-brand__logo { display:block; pointer-events:none; }
/* --- CREZIA Creators Hero Fix --- */

.pcn-hero {
  position: relative;
  height: 100vh; /* κρατάει ολόκληρο το ύψος */
  overflow: hidden;
}

.pcn-hero__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center; /* ✅ φέρνει το περιεχόμενο στο κέντρο κάθετα */
  flex-direction: row-reverse; /* κρατάει δεξιά το headline */
  padding: 0 5%;
}

.pcn-hero__title {
  font-size: clamp(2rem, 3.2vw, 3.8rem);
  line-height: 1.1;
  text-align: right;
  max-width: 40%;
  transform: translateY(20px); /* ✅ μικρή καθοδική μετατόπιση */
}
.pcn-hero__subtext {
  position: absolute;
  left: 5%;
  bottom: 20%;
  max-width: 28ch; /* ✅ περιορίζει το πλάτος σε 28 χαρακτήρες */
  font-size: 1.1rem;
  line-height: 1.4;
  color: rgba(255,255,255,0.9);
}

.pcn-hero__subtext p {
  margin: 0;
  text-align: left;
  white-space: normal;
}
/* === CREZIA — CREATORS HERO: right-align headline === */
.pcn-hero__overlay{
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: flex-end;   /* ✅ σπρώχνει το περιεχόμενο δεξιά */
  align-items: center;         /* κάθετα στο κέντρο */
  padding: 0 5%;
}

.pcn-hero__title{
  text-align: right;
  max-width: 40ch;
  margin-left: auto;           /* ✅ «κολλάει» δεξιά */
  transform: translateY(20px); /* μικρή καθοδική μετατόπιση */
}

/* Προαιρετικά: μικρότερο padding σε πολύ στενές οθόνες */
@media (max-width: 700px){
  .pcn-hero__overlay{ padding: 0 3.5%; }
  .pcn-hero__title{ max-width: 32ch; }
}
.cr-image-side {
  position: relative;
  flex:1 1 50%;
  background:#f8f8f8;
  display:flex; justify-content:center; align-items:center;
  min-height: 100vh;
}
.cr-image-side img {
  width:100%; height:100%;
  object-fit:cover; object-position:center;
}
@media(max-width:900px){
  .cr-register-wrap { flex-direction:column; }
  .cr-image-side { order:-1; min-height: 300px; }
  .cr-image-side img { height:100%; }
}
/* ===== FIX: Remove leftover Coming Soon logo ===== */
.cs-wrap,
.logo-fallback,
svg.arc {
  display: none !important;
  visibility: hidden !important;
  position: absolute !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
}
/* ===============================
   Heart Icon – Option B
   Outline → Solid Black on hover
=============================== */

.auth-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 14px;
  cursor: pointer;
}

.auth-heart svg {
  transition: 0.25s ease;
  stroke: #000;
  fill: transparent;
}

.auth-heart:hover svg {
  fill: #000;
  stroke: #000;
}
/* ===============================
   FIX: Header Auth Buttons
   Always visible on black header
=============================== */

.auth-btn {
  display: inline-block;
  padding: 8px 18px;
  border-radius: 8px;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  border: 1.5px solid rgba(255,255,255,0.80);
  color: #fff !important;           /* <<< ALWAYS WHITE */
  background: transparent;
  transition: 0.25s ease;
}

.auth-btn:hover {
  background: #fff;                 /* <<< Hover becomes white */
  color: #000 !important;           /* <<< Text becomes black */
  border-color: #fff;
}

/* Primary version (Εγγραφή / Creator Room) */
.auth-btn--primary {
  background: #fff;
  color: #000 !important;           /* <<< Black text on white */
  border-color: #fff;
}

.auth-btn--primary:hover {
  background: #000;                 /* <<< Invert */
  color: #fff !important;
  border-color: #000;
}

/* Heart icon stays white */
.auth-heart svg {
  stroke: #fff !important;
  fill: transparent;
}

.auth-heart:hover svg {
  fill: #fff !important;
  stroke: #fff !important;
}
/* ============================================================
   CREZIA — MOBILE HEADER (Option A)
   Logo left + Auth buttons right • Menu hidden
============================================================ */

@media (max-width: 768px) {

  /* Header container */
  .crezia-header__inner {
    padding: 10px 16px;
    gap: 12px;
  }

  /* Brand smaller */
  .crezia-brand__logo {
    height: 26px;
    width: auto;
  }

  .crezia-brand__text {
    font-size: 18px;
  }

  /* Hide center menu completely */
  .crezia-nav {
    display: none !important;
  }

  /* Auth section inline right */
  .crezia-auth {
    display: flex;
    gap: 8px;
    margin-left: auto;
  }

  /* Buttons become smaller/cleaner */
  .auth-btn {
    font-size: 13px;
    padding: 6px 12px;
    border-radius: 6px;
  }

  .auth-btn--primary {
    padding: 6px 12px;
  }

  /* Heart icon (if user logged in) */
  .auth-heart svg {
    width: 20px;
    height: 20px;
  }
}
/* ==============================================================
   FIX — Mobile logo always full brightness (no dim, no overlay)
================================================================ */
.crezia-brand__logo {
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}
@media (max-width: 768px) {
  .crezia-brand__logo {
    opacity: 1 !important;
    filter: none !important;
    mix-blend-mode: normal !important;
  }
}
/* ==========================================================
   FIX — Make SVG logo white on dark header (mobile & desktop)
========================================================== */
.crezia-brand__logo {
  filter: brightness(0) invert(1) !important; /* force white */
}
/* ============================================================
   CREZIA — Mobile Fix: Animated Text (Lifestyle / Creators / Shopping)
   Prevents clipping of the first line ONLY on small screens
=========================================================== */
@media (max-width: 768px) {

  /* The container must be tall enough for the first line */
  .hero-words {
    height: auto !important;
    min-height: 36px !important; /* safe height for 1 line */
    overflow: visible !important;
    transform: none !important; /* remove upward offset */
    margin-top: 8px !important; /* a bit breathing space */
  }

  /* Each line visible in its natural position */
  .hero-words .word {
    display: block;
    line-height: 1.2;
    transform: none !important; /* resets animation offset */
    opacity: 1 !important;
  }
}
/* ============================================================
   CREZIA — Mobile Menu Cleanup (Only "Shop" + "Creators")
=========================================================== */
@media (max-width: 768px) {

  /* κρύβει όλα τα menu items */
  .crezia-menu li {
    display: none !important;
  }

  /* δείχνει ΜΟΝΟ αυτά τα δύο */
  .crezia-menu li:nth-child(2),   /* SHOP */
  .crezia-menu li:nth-child(4) {  /* Creators */
    display: inline-block !important;
  }

  /* λίγο πιο μικρά γράμματα στο mobile header */
  .crezia-menu a {
    font-size: 14px !important;
    padding: 6px 8px !important;
  }

}
/* ===================================================================
   HARD OVERRIDE — MOBILE HEADER FIX (Guaranteed)
   Eliminates double-line header, fixes logo, hides extra menu items
=================================================================== */
@media (max-width: 768px) {

  /* Force header height stabilization */
  .crezia-header {
    padding: 0 !important;
  }

  .crezia-header__inner {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 10px !important;
    height: auto !important;
    padding: 10px 16px !important;
  }

  /* BRAND always visible */
  .crezia-brand {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
  }

  .crezia-brand__logo {
    width: 26px !important;
    height: auto !important;
    opacity: 1 !important;
    filter: brightness(0) invert(1) !important; /* full white */
  }

  .crezia-brand__text {
    font-size: 18px !important;
    color: #fff !important;
  }

  /* ========== HIDE ALL MENU ITEMS (unconditionally) ========== */
  .crezia-nav {
    display: none !important;
  }

  /* ========== AUTH (Login/Signup) RIGHT SIDE ========== */
  .crezia-auth {
    display: flex !important;
    flex-direction: row !important;
    gap: 8px !important;
    margin-left: auto !important;
  }

  .auth-btn {
    font-size: 13px !important;
    padding: 6px 12px !important;
    white-space: nowrap !important;
  }

}

/* ============================================================
   MOBILE FIX — FORCE CORRECT HEADER + ANIMATED TEXT
   ============================================================ */

@media (max-width: 820px) {

  /* --- HEADER: κρύβουμε όλα τα links εκτός από SHOP & CREATORS --- */
  .crezia-menu li:nth-child(1),
  .crezia-menu li:nth-child(3),
  .crezia-menu li:nth-child(5) {
    display: none !important;
  }

  /* δείχνουμε μόνο SHOP (2) και CREATORS (4) */
  .crezia-menu li:nth-child(2),
  .crezia-menu li:nth-child(4) {
    display: inline-block !important;
  }

  /* logo + brand */
  .crezia-brand__logo {
    width: 32px !important;
    height: auto !important;
  }

  .crezia-brand__text {
    font-size: 20px !important;
    line-height: 1 !important;
    margin-left: 6px !important;
  }

  /* auth buttons */
  .crezia-auth {
    gap: 6px !important;
  }

  .crezia-auth .auth-btn {
    padding: 5px 12px !important;
    font-size: 14px !important;
  }

  /* --- ANIMATED TEXT: μην κόβεται το πρώτο (Lifestyle) --- */
  .hero-words {
    margin-top: 18vh !important;
  }
}

/* ============================================================
   LANDSCAPE MODE FIX — Κινητό οριζόντιο
   ============================================================ */

@media (max-height: 480px) {

  .hero-words {
    margin-top: 26vh !important;
  }

  .crezia-header {
    height: 60px !important;
  }

  .crezia-brand__logo {
    width: 22px !important;
  }

  .crezia-brand__text {
    font-size: 16px !important;
  }
}
/* ================================
   CREZIA — MOBILE FIX PACK (Dec2025)
   ================================ */

/* 1) Το Hero να μην πηγαίνει κάτω */
@media (max-width: 768px) {
  .hero-split {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    padding-top: 20px;
  }

  /* Hero image ALWAYS on top */
  .hero-image {
    order: -1;
    width: 100%;
    text-align: center;
    margin-bottom: 12px;
  }

  .hero-image img {
    width: 70%;
    height: auto;
  }
}

/* 2) Fix overlap με header — κατεβάζουμε λίγο το text */
@media (max-width: 768px) {
  .hero-text {
    width: 100%;
    text-align: center;
    margin-top: 30px;
  }
}

/* 3) Το “Lifestyle” εξαφανίζεται → φτιάχνουμε τα heights */
@media (max-width: 768px) {
  .hero-words {
    margin-top: 0;
    padding-top: 10px;
  }

  .hero-words .word {
    display: block;
    font-size: 32px;
    line-height: 1.1;
  }
}

/* 4) Mobile navigation cleanup — να μην σπρώχνει το logo */
@media (max-width: 768px) {
  .crezia-nav ul {
    display: flex;
    gap: 12px;
  }

  /* Κρύβουμε ΟΛΑ εκτός από SHOP + CREATORS */
  .crezia-nav li:nth-child(1), /* Ανακάλυψε */
  .crezia-nav li:nth-child(3), /* Προσφορές */
  .crezia-nav li:nth-child(5)  /* Brands */
  {
    display: none !important;
  }
}

/* 5) Logo fix — να ΜΗΝ ξεθωριάζει / εξαφανίζεται */
@media (max-width: 768px) {
  .crezia-brand__logo {
    opacity: 1 !important;
    filter: none !important;
  }
}

/* 6) Title “Crezia” να μην ακουμπάει στο logo */
@media (max-width: 768px) {
  .crezia-brand__text {
    margin-left: 8px;
    font-size: 18px;
  }
}
/* RESET — CREZIA LOGO BACK TO ORIGINAL COLORS (ALL SCREENS) */
.crezia-brand__logo {
  filter: none !important;
  opacity: 1 !important;
  mix-blend-mode: normal !important;
}
/* ==========================
   CREZIA MOBILE HEADER FIX
   ========================== */

@media (max-width: 768px) {

  /* 1) Μείωση ύψους header */
  .crezia-header {
    padding: 10px 14px;
    height: auto;
  }

  /* 2) Logo + Crezia text εμφανή και σωστά */
  .crezia-brand {
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .crezia-brand__logo {
    width: 32px;
    height: auto;
    opacity: 1 !important;
    filter: none !important;
  }

  .crezia-brand__text {
    font-size: 18px;
    font-weight: 600;
    margin: 0;
  }

  /* 3) Κρατάμε μόνο SHOP + CREATORS */
  .crezia-nav li:nth-child(1), /* Ανακάλυψε */
  .crezia-nav li:nth-child(3), /* Προσφορές */
  .crezia-nav li:nth-child(5)  /* Brands */
  {
    display: none !important;
  }

  /* 4) Να μην πιέζει τον τίτλο */
  .crezia-nav ul {
    gap: 14px;
  }

  /* 5) Auth buttons ευθυγραμμισμένα δεξιά */
  .crezia-auth {
    display: flex;
    gap: 8px;
  }

  .crezia-auth .auth-btn {
    padding: 8px 14px;
    font-size: 14px;
  }
}
/* ==========================
   CREZIA MOBILE HERO FIX
   ========================== */
@media (max-width: 768px) {

  .hero-split {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 90px; /* Για να μην μπαίνει κάτω από τον header */
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
  }

  /* Hero image πάνω από όλα */
  .hero-image {
    order: -1;
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
  }

  .hero-image img {
    width: 70%;
    height: auto;
  }

  /* Hero text κέντρο */
  .hero-text {
    width: 100%;
    text-align: center;
  }
}
/* ==========================
   CREZIA MOBILE ANIMATED TEXT FIX
   ========================== */
@media (max-width: 768px) {

  .hero-words {
    margin-top: 10px;
    padding-top: 0;
  }

  .hero-words .word {
    font-size: 34px;
    line-height: 1.1;
    display: block;
  }
}
/* =========================================================
   CREZIA — KΛEIΔΩMA για PUBLIC CREATOR HEADER
   ΥΠΟΧΡΕΩΤΙΚΟ override για να μην κόβεται η μπάρα.
   ========================================================= */

body.crezia-creators-body header,
body.crezia-creators-body .creators-header {
    height: 80px !important;       /* ίδιο με homepage */
    min-height: 80px !important;
    max-height: 80px !important;
    line-height: 80px !important;
    display: flex !important;
    align-items: center !important;
    overflow: visible !important;
}

.creators-header-inner {
    height: 80px !important;
    min-height: 80px !important;
}

/* Logo fix */
.creators-center-logo {
    height: 40px !important;
}

/* Buttons fix (για να μην κόβονται) */
.creators-btn {
    line-height: 1.2 !important;
    padding: 8px 18px !important;
}

/* =========================================================
   FOOTER GAP FIX (εξαφανίζει την λευκή λουρίδα)
   ========================================================= */
.creators-footer {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border: none !important;
}

body.crezia-creators-body {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}
<style>

  /* ===============================
     CREATOR HEADER — HARD OVERRIDE
     =============================== */

  body.crezia-creators-body {
    padding-top: 0 !important;
  }

  /* Να ΜΗΝ επηρεάζει ο global header */
  header.creators-header {
    height: 140px !important;    /* ίδιο ύψος με homepage */
    line-height: 140px !important;
    display: flex !important;
    align-items: center !important;
  }

  /* Κέντρο logo */
  .creators-center-brand {
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
  }

  /* Logo σωστό μέγεθος */
  .creators-center-logo {
    height: 62px !important;
    width: auto !important;
  }

  /* Text σωστό */
  .creators-center-text {
    font-size: 28px !important;
    font-weight: 600 !important;
  }

  /* Δεξιά κουμπιά σωστό ύψος */
  .creators-right a {
    font-size: 15px !important;
    padding: 10px 22px !important;
  }

  /* Spacer ίδιο με header */
  .creators-header-spacer {
    height: 140px !important;
  }
/* ===============================
   Core Engine • Homepage CTA Button
   =============================== */

.ce-home-cta{
  padding: 110px 20px 90px;
  text-align: center;
  background: transparent;
}

.ce-home-cta-title{
  margin: 0 0 36px;
  font-size: 34px;
  line-height: 1.2;
  font-weight: 600;
}

.ce-home-cta-btn{
  appearance: none;
  -webkit-appearance: none;
  border: 2px solid #000;
  background: #000;
  color: #fff;

  padding: 16px 48px;
  border-radius: 999px;

  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.02em;
  cursor: pointer;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.ce-home-cta-btn:hover{
  background: #fff;
  color: #000;
  border-color: #000;
}

</style>
/* =================================================
   HERO TEXT — FULL ANIMATION RESTORE (LOCKED)
   ================================================= */
/* =========================================================
   CREZIA — HERO ANIMATION (WORDS + SUBTEXT) — RESTORED (NO FLASH)
   Goal:
   - Words slide in from left with stagger (staircase), then stay visible.
   - Subtext appears as one block after words.
   - No infinite flashing / pulsing.
   ========================================================= */

/* Ensure hero text is not hidden under fixed header */
.hero-text{
  padding-top:12px;
}

/* WORDS: visible after animation */
.hero-words .word{
  display:block;
  opacity:0;
  transform:translateX(-44px);
  will-change:transform, opacity;
  animation:creziaHeroWordIn .95s cubic-bezier(.2,.85,.2,1) forwards;
}

/* Stagger timing (staircase) */
.hero-words .w1{ animation-delay:.10s; }
.hero-words .w2{ animation-delay:.35s; }
.hero-words .w3{ animation-delay:.60s; }

/* SUBTEXT: one block, no per-line animation */
.hero-subtext{
  opacity:0;
  transform:translateY(14px);
  will-change:transform, opacity;
  animation:creziaHeroSubIn .9s ease forwards;
  animation-delay:1.05s;
}

/* Keep subtext readable even if other rules override */
.hero-subtext,
.hero-subtext p{
  color:#ffffff;
}

/* Keyframes */
@keyframes creziaHeroWordIn{
  from{ opacity:0; transform:translateX(-44px); }
  to{   opacity:1; transform:translateX(0); }
}
@keyframes creziaHeroSubIn{
  from{ opacity:0; transform:translateY(14px); }
  to{   opacity:1; transform:translateY(0); }
}

/* Mobile: keep animation (do NOT disable) */
@media (max-width: 768px){
  .hero-words .word{ transform:translateX(-28px); }
}
/* =====================================================
   FIX — HERO UNDER TEXT VISIBILITY & ANIMATION
   (Non-destructive, additive only)
===================================================== */

.hero-subtext {
  opacity: 0;
  transform: translateY(20px);
  animation: heroSubtextIn 0.9s ease-out forwards;
  animation-delay: 1.8s; /* έρχεται ΜΕΤΑ τα 3 words */
}

@keyframes heroSubtextIn {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* =====================================================
   AUDIT FIX — FORCE HERO UNDER TEXT VISIBILITY
   (Layout / stacking correction only)
===================================================== */

.hero-text {
  position: relative;
  z-index: 5;
}

.hero-subtext {
  position: relative;
  z-index: 6;

  display: block !important;
  opacity: 1 !important;

  margin-top: 22px;

  transform: none !important;
  visibility: visible !important;
}

/* Αν parent κόβει περιεχόμενο */
.hero-text,
.hero-words {
  overflow: visible !important;
}
/* FIX — Hero undertext color */
.hero-subtext,
.hero-subtext p {
  color: #000000 !important;
}