/* Neo Odeio presentation layer. Elementor Site Settings are the design source of truth. */
/* Shared variables, containers, typography, and components used by 2+ content types. */
.neo-site.neo-site {
  /* Colors are sourced from the Elementor kit globals (v2 palette); the hex is a
     fallback only, for when the kit CSS has not loaded. Never a bare hex.
     --neo-primary binds to Dark (#231F20, id db7ba62), not the system primary
     slot: v2's primary is pure #000000, which the palette never uses. --neo-accent
     stays on --e-global-color-accent, which the kit shadows with the custom
     'Brand' entry, so it resolves to the v2 blue Brand #536F86. Reverting the
     palette is a kit edit, not a code change. */
  --neo-primary: var(--e-global-color-db7ba62, #231F20);
  --neo-secondary: var(--e-global-color-secondary, #D9D9D9);
  --neo-text: var(--e-global-color-text, #202020);
  --neo-accent: var(--e-global-color-accent, #536F86);
  --neo-on-accent: var(--e-global-color-b41de51, #FFFFFF);
  /* Hardcoded, not read from Elementor/Astra globals: both keep drifting when
     the site's global typography settings get edited (Elementor kit or Astra
     Customizer), which silently breaks these fonts. This is the design
     system's own typography and must stay fixed regardless of kit/theme state. */
  --neo-heading-font: 'Arima', serif;
  --neo-body-font: 'Manrope', sans-serif;
  --neo-accent-font: 'Manrope', sans-serif;
  --neo-paper: var(--e-global-color-fb943bc, #F3F4F2);
  --neo-paper-deep: var(--e-global-color-95b496e, #EEF1F3);
  --neo-surface: var(--e-global-color-b41de51, #FFFFFF);
  --neo-line: color-mix(in srgb, var(--neo-primary) 16%, transparent);
  --neo-muted: color-mix(in srgb, var(--neo-text) 72%, transparent);
  --neo-shadow: 0 20px 55px color-mix(in srgb, var(--neo-primary) 9%, transparent);
  background: var(--neo-paper);
  color: var(--neo-text);
  font-family: var(--neo-body-font) !important;
  font-size: var(--e-global-typography-text-font-size, 16px);
  font-style: var(--e-global-typography-text-font-style, normal);
  font-weight: var(--e-global-typography-text-font-weight, 400);
  letter-spacing: var(--e-global-typography-text-letter-spacing, normal);
  line-height: var(--e-global-typography-text-line-height, 1.7);
  /* No overflow:clip here on purpose: any non-visible overflow on an ancestor makes it
     the positioning reference for a descendant's position:sticky, breaking .neo-post-share
     (it just tracks scroll linearly instead of sticking) since .neo-site isn't the element
     that actually scrolls. Audited every template for a resulting horizontal-scroll
     regression (2026-08-21) — none found, so the clip wasn't protecting anything real. */
}

.neo-site *, .neo-site *::before, .neo-site *::after { box-sizing: border-box; }
.neo-site a { color: inherit; text-decoration: none; }
.neo-site img { display: block; max-width: 100%; }
.neo-site p { margin: 0 0 1.15em; }
.neo-site.neo-site h1, .neo-site.neo-site h2, .neo-site.neo-site h3 {
  color: var(--neo-primary);
  font-family: var(--neo-heading-font) !important;
  font-style: var(--e-global-typography-primary-font-style, normal);
  font-weight: var(--e-global-typography-primary-font-weight, 500);
  letter-spacing: var(--e-global-typography-primary-letter-spacing, -.025em);
  line-height: var(--e-global-typography-primary-line-height, 1.1);
  margin: 0;
  text-transform: var(--e-global-typography-primary-text-transform, none);
}
/* Design-guideline heading sizes (2026-08-19). Τμήματα, Καθηγητές and Εγκαταστάσεις
   each carried an identical copy of these three clamps scoped to their own wrapper;
   they now live here once, for every template. Only Νέα differs — see
   post.css, which overrides all three. Font-family/weight/line-height come from the
   kit tokens above; only font-size is set here. */
.neo-site h1 { font-size: clamp(2.6rem, 5vw, 5.25rem); }
.neo-site h2 { font-size: clamp(1.6rem, 2.6vw, 2.6rem); }
.neo-site h3 { font-size: clamp(1.1rem, 1.5vw, 1.4rem); }
.neo-site svg { fill: none; height: 1.25em; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.45; width: 1.25em; }
.neo-container { margin-inline: auto; max-width: 1440px; width: 100%; }
/* Deliberate reach outside the neo- namespace, into Astra's own container class: the
   theme centres its content with flex and leaves .ast-container start-aligned, which
   pins our full-width templates to the left of the page on wide screens. There is no
   neo- element to target — the offending box is the theme's, wrapping ours — so this
   has to name Astra's class. Removing it shifts every template's layout. */
.ast-container { justify-content: center; }
.neo-content-flow { padding-bottom: 90px; }
.neo-kicker {
  color: var(--neo-accent);
  display: block;
  font-family: var(--neo-accent-font) !important;
  font-size: var(--e-global-typography-accent-font-size, .72rem);
  font-style: var(--e-global-typography-accent-font-style, normal);
  font-weight: var(--e-global-typography-accent-font-weight, 700);
  letter-spacing: var(--e-global-typography-accent-letter-spacing, .16em);
  line-height: var(--e-global-typography-accent-line-height, 1.3);
  margin-bottom: 17px;
  text-transform: var(--e-global-typography-accent-text-transform, uppercase);
}
.neo-lead { font-size: clamp(1.08rem, 1.8vw, 1.42rem); line-height: 1.6; max-width: 650px; }
.neo-icon { align-items: center; color: var(--neo-accent); display: inline-flex; flex: 0 0 31px; justify-content: center; }
.neo-icon svg { height: 25px; width: 25px; }
.neo-button {
  align-items: center;
  background: var(--neo-accent);
  border: 1px solid var(--neo-accent);
  border-radius: 10px !important;
  color: var(--neo-on-accent) !important;
  display: inline-flex;
  font-family: var(--neo-accent-font) !important;
  font-size: var(--e-global-typography-accent-font-size, .72rem);
  font-style: var(--e-global-typography-accent-font-style, normal);
  font-weight: var(--e-global-typography-accent-font-weight, 700);
  gap: 18px;
  justify-content: center;
  letter-spacing: var(--e-global-typography-accent-letter-spacing, .09em);
  line-height: var(--e-global-typography-accent-line-height, 1.2);
  min-height: 52px;
  padding: 13px 25px;
  text-transform: var(--e-global-typography-accent-text-transform, uppercase);
  transition: background .25s ease, color .25s ease, transform .25s ease;
}
.neo-button:hover { background: transparent; color: var(--neo-accent) !important; transform: translateY(-2px); }
.neo-button--outline { background: transparent; color: var(--neo-accent) !important; }
.neo-button--outline:hover { background: var(--neo-accent); color: var(--neo-on-accent) !important; }
.neo-text-link { align-items: center; color: var(--neo-accent) !important; display: inline-flex; font-family: var(--neo-accent-font) !important; font-size: .72rem; font-weight: 700; gap: 9px; letter-spacing: .08em; margin-top: auto; text-transform: uppercase; }
.neo-text-link svg { height: 16px; width: 16px; }


/* Hero — one layout for every content type: the tmima / egkatastasi / kathigitis
   singles, all four archives, and the Σπουδές taxonomy. Mirrors the Elementor
   "Hero section" reference block (library post 1091): a 50/50 split with a plain
   kicker, title, and lead in the left column, and a contained image in the right
   column. Fluid min-height, zero vertical padding (the image fills the column),
   no line clamps — the hero grows with its copy. No CTA button in any variant.
   The image sits only on .neo-hero__media (contain, letterboxed on paper); the
   URL comes in as --neo-hero-bg, set inline on the <section>, or is unset for
   the icon fallback. */
.neo-hero {
  align-items: center;
  display: grid;
  gap: 0 clamp(24px, 4vw, 64px);
  grid-template-columns: 1fr 1fr;
  margin-inline: auto;
  max-width: 1440px;
  min-height: 50vh;
  padding: 0 10px;
}
.neo-hero__content {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 18px;
  justify-content: center;
  position: relative;
  z-index: 1;
}
/* Hero title: the kit's TITLE 2.1 step (Arima), a size below the page-wide
   .neo-site h1 — matches 1091. Still a real <h1> (1091's heading widgets emit
   <h2>; one <h1> per page is the correct call). */
.neo-hero__content h1 {
  font-size: clamp(1.802rem, 1.3619rem + 1.4085vw, 3.052rem);
  margin: 0;
}
/* Kicker: plain eyebrow, no rule. Colour, family and uppercase come from the
   base .neo-kicker; this only pins weight/size/tracking to 1091's literal
   values (hardcoded, never read from the kit). */
.neo-hero .neo-kicker {
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 2.4px;
  margin: 0;
}
.neo-hero .neo-lead {
  font-size: clamp(0.889rem, 0.811rem + 0.25vw, 1.111rem);
  line-height: 1.6;
  margin: 0;
  max-width: 46ch;
}
.neo-hero__media {
  align-self: stretch;
  background: var(--neo-hero-bg, none) center / contain no-repeat;
  min-height: clamp(240px, 32vw, 420px);
}
/* Icon panel shown when a hero (or the Νέα featured-article card) has no image. */
.neo-hero__fallback {
  align-items: center;
  background: radial-gradient(circle, var(--neo-surface), var(--neo-paper-deep));
  color: var(--neo-accent);
  display: flex;
  height: 100%;
  justify-content: center;
  min-height: 260px;
}
.neo-hero__fallback svg { height: 90px; opacity: .3; width: 90px; }
.neo-overlap { margin-top: -46px; position: relative; z-index: 3; }

/* Info grid: shared by the Τμήματα and Εγκαταστάσεις singles. */
.neo-info-grid { background: color-mix(in srgb, var(--neo-surface) 97%, transparent); border: 1px solid var(--neo-line); border-radius: 10px !important; display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); overflow: hidden; padding: 20px; }
.neo-info-panel { background: color-mix(in srgb, var(--neo-surface) 97%, transparent); border: 1px solid var(--neo-line); border-radius: 10px !important; overflow: hidden; }
.neo-info-grid--bare { background: none; border: 0; box-shadow: none; padding: 20px; }
.neo-info-item { align-items: flex-start; border-right: 1px solid var(--neo-line); display: flex; gap: 14px; min-height: 96px; padding: 18px 22px; }
.neo-info-item:last-child { border-right: 0; }
.neo-info-item small { color: var(--neo-muted); display: block; font-family: var(--neo-accent-font) !important; font-size: .66rem; font-weight: 600; letter-spacing: .09em; margin-bottom: 5px; text-transform: uppercase; }
.neo-info-item strong { color: var(--neo-primary); display: block; font-size: .95rem; font-weight: 500; line-height: 1.42; }

/* Group divider: thin accent rule + a unique icon mark per Pods field group.
   The mark is what carries the grouping on mobile, where every section and every
   stacked column would otherwise be the same 1px --neo-line hairline. The mark
   is a circle, so the rule lines sit in the same row with zero column-gap —
   otherwise flush against it — and the label drops to a row of its own below. */
.neo-divider { align-items: center; column-gap: 0; display: grid; grid-template-columns: 1fr auto 1fr; margin: 88px 0 46px; row-gap: 13px; }
.neo-divider__line { background: color-mix(in srgb, var(--neo-accent) 42%, transparent); height: 1px; }
.neo-divider__mark {
  align-items: center;
  background: var(--neo-surface);
  border: 1px solid var(--neo-line);
  border-radius: 50% !important;
  color: var(--neo-accent);
  display: inline-flex;
  height: 54px;
  justify-content: center;
  width: 54px;
}
.neo-divider__mark svg { height: 25px; width: 25px; }
.neo-divider__label { grid-column: 1 / -1; text-align: center; }
/* Inset: sits inside a panel, so the panel's own border frames it — no side rules. */
.neo-divider--inset { grid-template-columns: 1fr; margin: 0; padding: 26px 20px 22px; }
.neo-divider--inset .neo-divider__line { display: none; }
.neo-divider--inset .neo-divider__mark { height: 44px; width: 44px; }
.neo-divider--inset .neo-divider__mark svg { height: 21px; width: 21px; }

/* A group owns its divider plus every section under it. Sections inside a group
   drop their own top rule: the divider is the break, the hairlines are noise. */
.neo-group > .neo-section { border-top: 0; margin-top: 52px; padding-top: 0; }
.neo-group > .neo-section:first-of-type { margin-top: 0; }

.neo-section { border-top: 1px solid var(--neo-line); margin-top: 72px; padding-top: 65px; }
.neo-section__heading { margin-bottom: 34px; max-width: 780px; }
.neo-section__heading--center { margin-inline: auto; text-align: center; }
.neo-prose { color: var(--neo-text); max-width: 880px; }
.neo-prose > :last-child { margin-bottom: 0; }
.neo-prose--intro { border-top: 0; font-size: clamp(1.13rem, 1.8vw, 1.48rem); line-height: 1.7; margin-inline: auto; max-width: 940px; text-align: center; }
.neo-prose ul { list-style: none; margin: 20px 0; padding: 0; }
.neo-prose li { margin-bottom: 9px; padding-left: 27px; position: relative; }
.neo-prose li::before { color: var(--neo-accent); content: "✓"; left: 0; position: absolute; top: 0; }
.neo-columns-2, .neo-rich-grid { display: grid; }
.neo-columns-2 { grid-template-columns: repeat(auto-fit, minmax(520px, 1fr)); }
.neo-columns-2 > div, .neo-rich-grid > div { border-right: 1px solid var(--neo-line); padding: 0 36px; }
.neo-columns-2 > div:first-child, .neo-rich-grid > div:nth-child(odd) { padding-left: 0; }
.neo-columns-2 > div:last-child, .neo-rich-grid > div:nth-child(even), .neo-rich-grid > div:last-child { border-right: 0; padding-right: 0; }
.neo-columns-2 h2, .neo-rich-grid h2 { font-size: clamp(1.45rem, 2.1vw, 1.9rem); margin-bottom: 22px; }
.neo-rich-grid { grid-template-columns: repeat(auto-fit, minmax(520px, 1fr)); row-gap: 60px; }
.neo-soft-panel { background: var(--neo-surface); border: 1px solid var(--neo-line); border-radius: 12px !important; box-shadow: 0 12px 40px color-mix(in srgb, var(--neo-primary) 5%, transparent); padding: 42px; }

/* 3-up everywhere: singles and archives previously disagreed (4-up default vs a
   per-type 3-column override on every archive), so the override is now the default. */
.neo-card-grid { display: grid; gap: 22px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.neo-card { background: var(--neo-surface); border: 1px solid var(--neo-line); border-radius: 10px !important; box-shadow: 0 10px 28px color-mix(in srgb, var(--neo-primary) 6%, transparent); display: flex; flex-direction: column; min-width: 0; overflow: hidden; transition: box-shadow .25s ease, transform .25s ease; }
.neo-card:hover { box-shadow: 0 20px 45px color-mix(in srgb, var(--neo-primary) 11%, transparent); transform: translateY(-4px); }
.neo-card__media { aspect-ratio: 4 / 3; background: var(--neo-paper-deep); display: block; overflow: hidden; }
.neo-card__media img { height: 100%; object-fit: cover; transition: transform .5s ease; width: 100%; }
.neo-card:hover .neo-card__media img { transform: scale(1.035); }
.neo-card__placeholder { align-items: center; color: var(--neo-accent); display: flex; height: 100%; justify-content: center; }
.neo-card__placeholder svg { height: 52px; opacity: .32; stroke-width: 1; width: 52px; }
.neo-card__body { display: flex; flex: 1; flex-direction: column; min-height: 210px; padding: 22px; }
.neo-card__body h3 { margin-bottom: 13px; }
.neo-card__body p { color: var(--neo-muted); font-size: .88rem; line-height: 1.6; }
.neo-card__meta { color: var(--neo-accent); font-family: var(--neo-accent-font) !important; font-size: .67rem; font-weight: 700; letter-spacing: .09em; margin-bottom: 12px; text-transform: uppercase; }
.neo-card--kathigitis .neo-card__media { aspect-ratio: 4 / 4.65; }
.neo-filter-item { display: flex; min-width: 0; }
.neo-filter-item > .neo-card { width: 100%; }
.neo-filter-item[hidden] { display: none !important; }

.neo-gallery { display: grid; gap: 10px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.neo-gallery a { aspect-ratio: 4 / 3; overflow: hidden; }
.neo-gallery img { height: 100%; object-fit: cover; transition: transform .4s; width: 100%; }
.neo-gallery a:hover img { transform: scale(1.04); }
.neo-video { margin: 70px auto 0; max-width: 1000px; }
.neo-video iframe { aspect-ratio: 16 / 9; height: auto; width: 100%; }

/* Archives and the Σπουδές taxonomy render the same .neo-hero as the singles
   (see the hero block above) — the only difference is that the copy comes from
   passed $title / $description instead of the loop post. */
.neo-archive-content { padding-bottom: 90px; padding-top: 70px; }
.neo-empty { border: 1px solid var(--neo-line); border-radius: 10px !important; padding: 35px; text-align: center; }
.neo-site .navigation.pagination { margin-top: 45px; }
.neo-site .nav-links { display: flex; gap: 7px; justify-content: center; }
.neo-site .page-numbers { align-items: center; border: 1px solid var(--neo-line); display: flex; height: 42px; justify-content: center; min-width: 42px; padding: 5px; }
.neo-site .page-numbers.current, .neo-site a.page-numbers:hover { background: var(--neo-accent); color: var(--neo-on-accent); }

/* Filter/search toolbar: pill category tabs + a borderless pill search field. Shared by Τμήματα and Νέα archives. */
.neo-toolbar { align-items: center; display: flex; flex-wrap: wrap; gap: 20px; justify-content: space-between; margin: 55px 0 30px; }
.neo-toolbar__tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.neo-toolbar__tabs button { background: transparent; border: 0; border-radius: 20px !important; color: var(--neo-text); cursor: pointer; font: inherit; font-size: .85rem; padding: 9px 18px; transition: background .2s ease, color .2s ease; }
.neo-toolbar__tabs button:hover { background: color-mix(in srgb, var(--neo-accent) 10%, transparent); }
.neo-toolbar__tabs button.is-active { background: var(--neo-accent); color: var(--neo-on-accent); }
.neo-toolbar__search { align-items: center; background: var(--neo-surface); border: 1px solid var(--neo-line); border-radius: 24px !important; display: flex; gap: 10px; min-width: 230px; padding: 10px 18px; }
.neo-toolbar__search svg { color: var(--neo-muted); flex: 0 0 auto; height: 16px; width: 16px; }
.neo-toolbar__search input { background: transparent; border: 0; color: var(--neo-text); flex: 1; font: inherit; min-width: 0; }
.neo-toolbar__search input:focus { outline: none; }

.neo-shortcode { background: transparent; overflow: visible; padding: 20px 0; }

.neo-lightbox { align-items: center; background: color-mix(in srgb, var(--neo-primary) 92%, transparent); display: flex; inset: 0; justify-content: center; padding: 45px; position: fixed; z-index: 999999; }
.neo-lightbox img { max-height: 90vh; max-width: 90vw; }
.neo-lightbox button { background: transparent; border: 0; color: var(--neo-on-accent); cursor: pointer; font-size: 45px; line-height: 1; position: absolute; right: 25px; top: 18px; }
.neo-lightbox-open { overflow: hidden; }

@media (max-width: 1100px) {
  .neo-info-item:nth-child(3n) { border-right: 0; }
}

/* Τμήματα single: no separators between the summary-strip info items — see tmima.css comment. */
.neo-info-grid--bare .neo-info-item { border-right: 0; }

@media (max-width: 820px) {
  .neo-site h1 { font-size: clamp(2.7rem, 11vw, 4.5rem); }
  .neo-container { padding-inline: 20px; }
  /* Hero stacks to one column: copy row, then the image row. */
  .neo-hero { grid-template-columns: 1fr; padding-inline: 20px; }
  .neo-hero__media { min-height: clamp(220px, 46vw, 340px); }
  .neo-columns-2, .neo-rich-grid { grid-template-columns: 1fr; }
  .neo-columns-2 > div, .neo-rich-grid > div, .neo-columns-2 > div:first-child, .neo-rich-grid > div:nth-child(odd), .neo-rich-grid > div:nth-child(even) { border-bottom: 1px solid var(--neo-line); border-right: 0; padding: 30px 0; }
  .neo-columns-2 > div:last-child, .neo-rich-grid > div:last-child { border-bottom: 0; }
  .neo-group .neo-columns-2 > div { border-bottom: 0; padding: 26px 0 0; }
  .neo-group .neo-columns-2 > div:first-child { padding-top: 0; }
  .neo-divider { margin: 62px 0 36px; row-gap: 16px; }
  .neo-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .neo-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .neo-ornament::after { display: none; }
}

@media (max-width: 560px) {
  .neo-site { font-size: 15px; }
  .neo-content-flow { padding-bottom: 55px; }
  .neo-toolbar__tabs { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; }
  .neo-toolbar__tabs button { flex: 0 0 auto; }
  .neo-toolbar__search { min-width: 0; width: 100%; }
  .neo-hero { min-height: 0; }
  .neo-hero__media { min-height: clamp(200px, 60vw, 300px); }
  .neo-overlap { margin-top: 0; padding-inline: 0; }
  .neo-info-grid { border-left: 0; border-right: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 8px; }
  .neo-info-item { border-bottom: 1px solid var(--neo-line); min-height: 100px; padding: 16px 10px; }
  .neo-info-item:nth-child(even) { border-right: 0; }
  .neo-info-grid--bare .neo-info-item { border-bottom: 0; }
  .neo-info-item .neo-icon { flex-basis: 23px; }
  .neo-info-item .neo-icon svg { height: 19px; width: 19px; }
  .neo-section { margin-top: 50px; padding-top: 45px; }
  .neo-group > .neo-section { margin-top: 38px; }
  .neo-info-panel { border-left: 0; border-right: 0; }
  .neo-info-grid--bare { padding: 8px; }
  .neo-divider { margin: 52px 0 30px; row-gap: 12px; }
  .neo-divider__mark { height: 46px; width: 46px; }
  .neo-divider__mark svg { height: 21px; width: 21px; }
  .neo-divider--inset { padding: 20px 14px 16px; }
  .neo-soft-panel { padding: 25px; }
  .neo-card-grid { grid-template-columns: 1fr; }
  .neo-card__media { aspect-ratio: 16 / 10; }
  .neo-card--kathigitis .neo-card__media { aspect-ratio: 4 / 4.3; }
  .neo-gallery { gap: 5px; }
  .neo-archive-content { padding-top: 45px; }
  .neo-lightbox { padding: 15px; }
}

@media (prefers-reduced-motion: reduce) {
  .neo-site *, .neo-site *::before, .neo-site *::after { scroll-behavior: auto !important; transition: none !important; }
}