/* Hirdetményfigyelés blocks, shared by two pages:
   - content/ads-hirdetmenyfigyeles-palyazatok.yaml (ad landing page, noindex)
   - content/service-hirdetmenyfigyeles.yaml (the indexed service page)
   Sections are scoped by id (#ertekeles 2x2 deliverables, #friss live TED list, #hol source cards).
   The file name must not contain "ads": ad blockers block such URLs and the page renders unstyled.
   Row styles come from css/notices.css, the comparison and fee blocks from css/service-subpages.css. */

/* ---------- Shared section header (#friss, #hol) ---------- */

#friss.prose-section, #hol.prose-section { padding: 72px 0 80px; }
#friss { background: var(--color-cream, #faf8f3); }
/* Without a background #hol shows the body's grey-blue gradient. */
#hol { background: #fff; }

#friss .notices-latest__head, #hol .sources-head { max-width: 640px; margin: 0 auto 2.5rem; text-align: center; }
#friss .notices-latest__head h2, #hol .sources-head h2 { margin: 0; }
/* Same face, size, tracking and ink as the ledger and fee eyebrows above. */
#friss .notices-latest__eyebrow, #hol .sources-eyebrow {
  margin: 0 0 .75rem; font-family: var(--font-mono, monospace); font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase; color: rgba(15, 23, 42, .78);
}
#friss .notices-latest__head p:last-child { margin: 1rem 0 0; font-size: 1.02rem; line-height: 1.7; color: rgba(15, 23, 42, .78); }

/* ---------- #friss: live notice list (js/notices-latest.js) ---------- */

#friss .prose-content { max-width: 880px; }

/* One white panel with the cobalt top rule the site uses on its feature cards (form, trend chart),
   rows divided by hairlines inside it, as on /aktualis-hirdetmenyek/. */
#friss .notices-latest {
  background: #fff; border: 1px solid var(--color-rule); border-top: 3px solid var(--color-cobalt);
  border-radius: 3px; overflow: hidden;
}
/* Reserve roughly five rows so the async list does not shift the page. */
#friss .notices-results { display: block; margin: 0; padding: 0; border: 0; min-height: 31rem; }
#friss .notices-latest--ready .notices-results, #friss .notices-latest--failed .notices-results { min-height: 0; }
/* The fallback path sets [hidden] on the list. */
#friss .notices-results[hidden] { display: none; }

/* Rows hidden by the script carry inline display:none, so the first visible row is always the first child
   and a top rule on every following row never doubles up. */
#friss .notice-row {
  grid-template-columns: 7.5rem 1fr; gap: 0 1.75rem; margin: 0; padding: 1.35rem 1.75rem;
  border: 0; background: none;
}
#friss .notice-row + .notice-row { border-top: 1px solid var(--color-rule); }
#friss .notice-when { padding-top: .15rem; }
#friss .notice-deadline { font-size: .84rem; }
#friss .notice-days { font-size: .76rem; }
#friss .notice-label { margin: 0 0 .35rem; font-size: .66rem; line-height: 1.5; letter-spacing: .08em; }
#friss .notice-title {
  margin: 0 0 .3rem; font-family: var(--font-display, Georgia, serif); font-size: 1.12rem; font-weight: 600;
  line-height: 1.35; color: var(--color-ink);
}
#friss .notice-buyer { margin: 0 0 .6rem; font-size: .84rem; line-height: 1.5; }
#friss .notice-link { display: inline-block; font-size: .84rem; font-weight: 600; text-decoration: none; }
#friss .notice-link::after { content: " \2192"; }
#friss .notice-link:hover { text-decoration: underline; text-underline-offset: 3px; }
#friss .notice-link:focus-visible { outline: 2px solid var(--color-cobalt); outline-offset: 3px; border-radius: 1px; }

/* "Show more" sits in the panel's footer strip. The script toggles [hidden] on the button, the strip
   collapses with it, so there is no empty band before loading, after the last batch or on failure. */
#friss .notices-latest__more-wrap {
  margin: 0; padding: 1rem 1.75rem; text-align: center;
  border-top: 1px solid var(--color-rule); background: var(--color-cream, #faf8f3);
}
#friss .notices-latest__more-wrap[hidden],
#friss .notices-latest__more-wrap:has(> .notices-latest__more[hidden]) { display: none; }
#friss .notices-latest__more {
  min-height: 44px; padding: .6rem 1.4rem; border: 1px solid var(--color-cobalt); border-radius: 2px;
  background: #fff; font-family: var(--font-body, sans-serif); font-size: .92rem; font-weight: 600;
  color: var(--color-cobalt); cursor: pointer;
}
#friss .notices-latest__more:hover { background: var(--color-cobalt); color: #fff; }
#friss .notices-latest__more:focus-visible { outline: 2px solid var(--color-cobalt); outline-offset: 2px; }

/* Feed failed: the panel itself frames the static text. */
#friss .notices-latest__fallback { margin: 0; padding: 1.5rem 1.75rem; }
#friss .notices-latest__fallback p, #friss .notices-latest noscript p { margin: 0; font-size: .98rem; line-height: 1.65; }
#friss .notices-latest noscript p { padding: 1.5rem 1.75rem; }
#friss .notices-latest__fallback a, #friss .notices-latest noscript a { color: var(--color-cobalt); text-underline-offset: 3px; }

#friss .notices-latest__note {
  max-width: 640px; margin: 1.5rem auto 0; text-align: center;
  font-size: .9rem; line-height: 1.6; color: rgba(15, 23, 42, .62);
}

/* ---------- #hol: three official sources + a note ---------- */

#hol .prose-content { max-width: 980px; }

/* Three columns between two hairlines, divided by vertical rules: the same ruled language as the
   ledger in #ertekeles, rather than another set of boxed cards. */
#hol .source-cards {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--color-ink); border-bottom: 1px solid var(--color-rule);
}
#hol .source-card { display: flex; flex-direction: column; margin: 0; padding: 1.75rem 2rem 1.9rem; }
#hol .source-card + .source-card { border-left: 1px solid var(--color-rule); }
#hol .source-card:first-child { padding-left: 0; }
#hol .source-card:last-child { padding-right: 0; }
#hol .source-card__tag {
  margin: 0 0 1rem; font-family: var(--font-mono, monospace); font-size: .7rem; font-weight: 600;
  line-height: 1.5; letter-spacing: .1em; text-transform: uppercase; color: var(--color-cobalt);
}
/* An <h3>: main.css sets h3 to 1.875rem and primary blue, restate both. */
#hol .source-card__name {
  margin: 0 0 .75rem; font-family: var(--font-display, Georgia, serif); font-size: 1.5rem; font-weight: 600;
  line-height: 1.2; letter-spacing: -.01em; color: var(--color-ink);
}
#hol .source-card__body { margin: 0; font-size: .95rem; line-height: 1.65; color: rgba(15, 23, 42, .75); }

/* #kinek and the form are both cream shared blocks: a hairline keeps them from running together. */
#kinek + #kapcsolat { border-top: 1px solid var(--color-rule); }

/* ---------- Responsive ---------- */

@media (max-width: 899px) {
  #hol .source-cards { grid-template-columns: 1fr; border-bottom: 0; }
  #hol .source-card, #hol .source-card:first-child, #hol .source-card:last-child { padding: 1.5rem 0 1.6rem; }
  #hol .source-card + .source-card { border-left: 0; border-top: 1px solid var(--color-rule); }
  #hol .source-card:last-child { border-bottom: 1px solid var(--color-rule); }
  #hol .source-card__body { margin-bottom: 1rem; max-width: 60ch; }
}

@media (max-width: 767px) {
  #friss.prose-section, #hol.prose-section { padding: 48px 0 56px; }
  #friss .notices-latest__head, #hol .sources-head { margin-bottom: 1.75rem; }
  #friss .notices-results { min-height: 44rem; }
  #friss .notice-row { grid-template-columns: 1fr; gap: .45rem; padding: 1.1rem 1.1rem 1.15rem; }
  #friss .notice-when { flex-direction: row; align-items: baseline; gap: .6rem; padding-top: 0; }
  #friss .notice-title { font-size: 1.05rem; }
  #friss .notice-link { padding: .35rem 0; }
  #friss .notices-latest__more-wrap { padding: .9rem 1.1rem; }
  #friss .notices-latest__more { width: 100%; }
  #friss .notices-latest__fallback, #friss .notices-latest noscript p { padding: 1.25rem 1.1rem; }
  #hol .source-card__name { font-size: 1.35rem; }
}

/* Mobile: the site centres hero content, which leaves the bullets floating at different
   offsets in this list. Keep the rows left-aligned inside the box. */
@media (max-width: 767px) {
  .page-hero .proof-list, .page-hero .proof-item { text-align: left; justify-content: flex-start; justify-items: start; }
}

/* In-page anchors (hero "Mit ajánlunk" → #dijak, form links → #kapcsolat): clear the fixed navbar. */
#ertekeles, #dijak, #dijszabas, #mit-kap, #friss, #hol, #kinek, #kapcsolat { scroll-margin-top: 80px; }

/* #ertekeles on desktop: the four deliverables as a 2x2 grid (kicker stacked above the title),
   split by a centre hairline like the on-demand-services grid. Mobile keeps the single ledger. */
@media (min-width: 900px) {
  #ertekeles .prose-content { max-width: 1040px; }
  #ertekeles .alternatives-ledger__list { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 3rem; }
  #ertekeles .alternatives-ledger__list::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; background: var(--color-rule); }
  #ertekeles .alternatives-ledger__row { display: block; padding: 1.75rem 1.25rem 1.75rem 1.25rem; }
  #ertekeles .alternatives-ledger .alternatives-ledger__kicker, #ertekeles .alternatives-ledger__kicker { margin: 0 0 .6rem; }
  #ertekeles .alternatives-ledger__title { font-size: 1.2rem; }
}

/* Service page only: link from the five-row preview to the full aktuális hirdetmények list. */
#friss .notices-latest__all { margin: 1.25rem 0 0; text-align: center; }
#friss .notices-latest__all a { display: inline-block; padding: .35rem 0; font-weight: 600; color: var(--color-cobalt); text-decoration: none; }
#friss .notices-latest__all a:hover { text-decoration: underline; text-underline-offset: 3px; }
