/* Νέα (blog) — native WP post archive + single. Loaded only on is_home() / is_singular('post'). */

/* Astra's Blog/Single Posts customizer width (750px) narrows .ast-container
   on single posts only, overriding it site-wide via base.css's .ast-container
   rule wouldn't work since that's shared with every other template. */
body.single-post .ast-container { max-width: 1440px; }

.neo-archive--post h1, .neo-single--post h1 { font-size: clamp(2.5rem, 4.6vw, 4.6rem); }
.neo-archive--post h2, .neo-single--post h2 { font-size: clamp(1.6rem, 2.6vw, 2.5rem); }
.neo-archive--post h3, .neo-single--post h3 { font-size: clamp(1.1rem, 1.5vw, 1.35rem); }

.neo-card--post .neo-card__media { aspect-ratio: 3 / 4; }
.neo-card--post .neo-text-link { align-items: center; background: var(--neo-surface); border: 1px solid var(--neo-line); border-radius: 50% !important; color: var(--neo-accent) !important; display: inline-flex; font-size: 0; gap: 0; height: 34px; justify-content: center; margin-top: auto; padding: 0; width: 34px; }
.neo-card--post .neo-text-link svg { height: 15px; width: 15px; }
.neo-card--post .neo-text-link:hover { background: var(--neo-accent); }
.neo-card--post .neo-text-link:hover svg { color: var(--neo-on-accent); }

/* The hero is the shared .neo-hero (base.css) — same as every other archive.
   Only the featured-article panel below it is specific to Νέα. */
.neo-featured-wrap { padding-top: 70px; }

/* Featured-article panel: media column sized for portrait/poster imagery, not a landscape crop. */
.neo-featured-article { background: var(--neo-paper-deep); border: 1px solid var(--neo-line); border-radius: 16px !important; display: grid; grid-template-columns: minmax(0, .36fr) minmax(0, .64fr); overflow: hidden; }
.neo-featured-article__media { aspect-ratio: 3 / 4; display: block; }
.neo-featured-article__media img { height: 100%; object-fit: cover; width: 100%; }
.neo-featured-article__body { display: flex; flex-direction: column; justify-content: center; padding: 50px 55px; }
.neo-featured-article__body h2 { margin: 14px 0 16px; }
.neo-featured-article__body h2 a { color: inherit; }
.neo-featured-article__body p { color: var(--neo-muted); margin: 0; }
.neo-featured-article__meta { color: var(--neo-muted); font-family: var(--neo-accent-font) !important; font-size: .68rem; font-weight: 700; letter-spacing: .08em; margin-top: 22px; }
.neo-featured-article__body .neo-text-link { margin-top: 16px; }

/* Category tabs + search toolbar: .neo-toolbar (base.css) is shared with the Τμήματα archive. */

/* Single post header. */
.neo-post-header { padding-top: 24px; }
.neo-post-header h1 { margin: 12px 0 16px; }
.neo-post-header__lead { color: var(--neo-muted); font-size: clamp(1rem, 1.3vw, 1.15rem); max-width: 720px; }
.neo-post-meta { color: var(--neo-muted); display: flex; font-family: var(--neo-accent-font) !important; font-size: .72rem; font-weight: 700; gap: 10px; letter-spacing: .05em; margin-top: 24px; text-transform: uppercase; }

/* Featured image floats left inside the article body — text wraps around it from the right,
   sized for portrait/poster imagery instead of a full-width landscape banner. Wrapped in a
   data-elementor-open-lightbox link so it opens in Elementor's own lightbox (its frontend.js
   runs sitewide already, via the Elementor header/footer, so this works on our PHP templates
   without any lightbox JS of our own). */
.neo-post-figure { float: left; margin: 6px 34px 20px 0; max-width: 340px; width: 42%; }
.neo-post-figure a { border-bottom: 0 !important; cursor: zoom-in; display: block; }
.neo-post-figure img { aspect-ratio: 3 / 4; border-radius: 10px 10px 46px 10px !important; object-fit: cover; width: 100%; }
.neo-post-figure figcaption { color: var(--neo-muted); font-size: .78rem; font-style: italic; margin-top: 10px; }
.neo-post-body h2, .neo-post-body blockquote, .neo-post-body ul, .neo-post-body ol, .neo-post-body figure:not(.neo-post-figure) { clear: left; }

/* Share column used to be a zero-width sticky anchor with its icon stack absolutely
   positioned into the page's side margin (right: 100%, offset by a calc() sized for a
   1440px container). Two things broke that: .neo-site has `overflow: clip`, which
   painting-clips anything positioned outside its own box no matter how it's placed —
   and the real container (.ast-container) caps at 1000px here, not 1440px, so the
   calc()'d offset didn't land where it assumed either. Simplest fix that survives both:
   keep the icon stack in flow, as a real flex column next to the body, instead of
   escaping the layout box at all. */
.neo-post-layout { display: flex; gap: 36px; margin-top: 50px; }
.neo-post-body { flex: 1 1 auto; min-width: 0; }
/* align-self:flex-start overrides the row's default align-items:stretch on purpose: a
   sticky element can only travel within the free space between its own height and its
   containing block's height, and .neo-post-layout's height is set by .neo-post-body (the
   taller sibling) — so stretching .neo-post-share to match would leave it exactly as
   tall as its own travel range, i.e. zero room to move, and it'd never visibly stick at
   all (confirmed: this is what silently broke it before). Kept at its own natural
   (short) content height instead, it sticks at top:110 through the free space and
   releases on its own once the bottom of the row (the end of the article) catches up to
   it — no explicit height or JS needed for either end of that behavior. */
.neo-post-share { align-self: flex-start; flex: 0 0 auto; position: sticky; top: 110px; }
.neo-post-share__inner { align-items: center; display: flex; flex-direction: column; gap: 14px; white-space: nowrap; }
.neo-post-share span { color: var(--neo-muted); font-family: var(--neo-accent-font) !important; font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; writing-mode: vertical-rl; }
.neo-post-share a { align-items: center; border: 1px solid var(--neo-line); border-radius: 50% !important; color: var(--neo-primary); display: flex; height: 38px; justify-content: center; transition: background .2s ease, border-color .2s ease, color .2s ease; width: 38px; }
.neo-post-share a svg { height: 16px; width: 16px; }
.neo-post-share a:hover { background: var(--neo-accent); border-color: var(--neo-accent); color: var(--neo-on-accent); }

.neo-post-body > p:first-of-type::first-letter { color: var(--neo-accent); float: left; font-family: var(--neo-heading-font) !important; font-size: 4.4rem; font-weight: 500; line-height: .85; padding: 6px 10px 0 0; }
.neo-post-body h2 { margin: 46px 0 16px; }
.neo-post-body img { border-radius: 8px !important; }
.neo-post-body a { border-bottom: 1px solid var(--neo-accent); color: var(--neo-accent); }
.neo-post-body blockquote { border-left: 3px solid var(--neo-accent); font-family: var(--neo-heading-font) !important; font-size: clamp(1.2rem, 1.8vw, 1.55rem); font-style: italic; line-height: 1.5; margin: 40px 0; padding: 4px 0 4px 30px; }
.neo-post-body blockquote::before { color: var(--neo-accent); content: "\201C"; display: block; font-size: 2.2rem; line-height: 1; margin-bottom: 6px; }
.neo-post-body blockquote p:last-child { margin-bottom: 0; }

.neo-post-tags { align-items: center; border-top: 1px solid var(--neo-line); display: flex; flex-wrap: wrap; gap: 16px; justify-content: space-between; margin-top: 50px; padding-top: 30px; }
.neo-post-tags__list { display: flex; flex-wrap: wrap; gap: 8px; }
.neo-post-tags__list a { background: var(--neo-surface); border: 1px solid var(--neo-line); border-radius: 20px !important; color: var(--neo-text); font-size: .78rem; padding: 7px 15px; }
.neo-post-tags__share { align-items: center; display: flex; gap: 10px; }
.neo-post-tags__share span { color: var(--neo-muted); font-size: .78rem; }
.neo-post-tags__share a { align-items: center; border: 1px solid var(--neo-line); border-radius: 50% !important; color: var(--neo-primary); display: flex; height: 34px; justify-content: center; width: 34px; }
.neo-post-tags__share a svg { height: 15px; width: 15px; }
.neo-post-tags__share a:hover { background: var(--neo-accent); border-color: var(--neo-accent); color: var(--neo-on-accent); }

.neo-post-nav { display: grid; gap: 0; grid-template-columns: 1fr 1fr; margin-top: 46px; }
.neo-post-nav a { border-top: 1px solid var(--neo-line); display: block; padding: 24px 0; }
.neo-post-nav__prev { padding-right: 30px; }
.neo-post-nav__next { border-left: 1px solid var(--neo-line); padding-left: 30px; text-align: right; }
.neo-post-nav small { align-items: center; color: var(--neo-accent); display: flex; font-family: var(--neo-accent-font) !important; font-size: .68rem; font-weight: 700; gap: 8px; letter-spacing: .08em; text-transform: uppercase; }
.neo-post-nav__prev small svg { transform: rotate(180deg); }
.neo-post-nav__next small { justify-content: flex-end; }
.neo-post-nav strong { color: var(--neo-primary); display: block; font-family: var(--neo-heading-font) !important; font-size: 1.02rem; font-weight: 500; margin-top: 8px; }

/* Now that the icon stack sits in flow instead of bleeding into the side margin, it no
   longer needs a wide viewport to have room for — the tags-row share links (below the
   article) are the fallback once the layout starts stacking at the tablet breakpoint. */
@media (max-width: 820px) {
  .neo-post-share { display: none; }
  .neo-featured-article { grid-template-columns: 1fr; }
  .neo-featured-article__media { aspect-ratio: 16 / 11; }
  .neo-featured-article__body { padding: 34px 28px; }
  .neo-post-figure { max-width: 260px; }
}

@media (max-width: 560px) {
  .neo-post-figure { float: none; margin: 0 0 24px; max-width: none; width: 100%; }
  .neo-post-figure img { aspect-ratio: 16 / 11; }
  .neo-post-nav { grid-template-columns: 1fr; }
  .neo-post-nav__next { border-left: 0; border-top: 1px solid var(--neo-line); padding-left: 0; text-align: left; }
  .neo-post-nav__next small { justify-content: flex-start; }
  .neo-post-tags { align-items: flex-start; flex-direction: column; }
}
