/* ==========================================================
   Pagalbos centras: viršus, hero su paieška, kategorijos,
   naujienų blokas ir naujienų (bloginis) puslapis.
   Naujienos įrašo stiliai (.nw-type, .nw-btn, .nw-react…) iš ../css/app.css.
   ========================================================== */
:root {
  --pc-wrap: 1100px;          /* nėra DS, siūlyti į shared */
  --pc-post-gap: 40px;        /* nėra DS: tarpas tarp naujienų bloge, kompaktiškai kaip Notion */
  --pc-hero-a: #8bbcbe;       /* nėra DS, siūlyti į shared: hero gradiento pradžia (Figma) */
  --pc-hero-b: #5f9497;       /* nėra DS, siūlyti į shared: hero gradiento pabaiga (Figma) */
}

.pc-body { min-height: 100vh; background: var(--ds-white); }
.pc-wrap { width: min(var(--pc-wrap), 100% - 2 * var(--ds-space-xl)); margin-inline: auto; }

/* Viršutinė juosta */
.pc-top { display: flex; align-items: center; justify-content: space-between; height: 56px; padding: 0 var(--ds-space-2xl); background: var(--ds-teal-100); border-bottom: 1px solid var(--ds-teal-200); }
/* Logo ir „Pagalbos centras“ ant vienos bazinės linijos, kaip Figmoje (img bazinė linija yra jo apačia) */
.pc-brand { display: flex; align-items: baseline; }
.pc-brand img { display: block; }
.pc-brand__name { margin-left: 9px; color: var(--ds-teal-700); font-size: 18px; font-weight: 500; line-height: 1; text-decoration: none; } /* nėra DS */
.pc-brand__name::before { content: ''; display: inline-block; width: 5px; height: 5px; margin-right: 6px; border-radius: var(--ds-radius-full); background: currentColor; vertical-align: .24em; }
.pc-brand__name:hover { color: var(--ds-teal-800); }

/* Hero su paieška */
.pc-hero { position: relative; overflow: hidden; padding: 56px var(--ds-space-xl) 64px; background: linear-gradient(100deg, var(--pc-hero-a), var(--pc-hero-b)); text-align: center; }
.pc-hero::before, .pc-hero::after { content: ''; position: absolute; border-radius: 50%; background: rgba(255, 255, 255, .08); pointer-events: none; }
.pc-hero::before { width: 620px; height: 620px; right: -140px; top: -40px; }
.pc-hero::after { width: 380px; height: 380px; left: 12%; top: 70%; }
.pc-hero--compact { padding-block: 32px; }
.pc-hero__title { position: relative; margin-bottom: var(--ds-space-xl); color: var(--ds-white); font-size: 40px; line-height: 50px; } /* nėra DS: hero antraštė */
.pc-search { position: relative; z-index: 1; display: flex; align-items: center; width: min(560px, 100%); height: 50px; margin-inline: auto; padding: 0 var(--ds-space-md) 0 var(--ds-space-xl); border-radius: var(--ds-radius-full); background: var(--ds-white); box-shadow: 0 6px 20px rgba(15, 40, 42, .12); }
.pc-search input { flex: 1; min-width: 0; height: 100%; border: 0; background: none; font: inherit; color: var(--ds-grey-900); outline: none; }
.pc-search input::placeholder { color: var(--ds-grey-500); }
.pc-search svg { flex: 0 0 auto; color: var(--ds-teal-600); }

/* Trupiniai */
.pc-crumbs { padding: var(--ds-space-md) 0; border-bottom: 1px solid var(--ds-grey-200); font-size: var(--ds-text-sm-size); color: var(--ds-grey-500); }
.pc-crumbs a { color: var(--ds-grey-500); text-decoration: none; }
.pc-crumbs a:hover { color: var(--ds-teal-700); }

/* ---------- Pradinis ---------- */
.pc-section { padding: var(--ds-space-5xl) 0; }
.pc-section + .pc-section { padding-top: 0; }
.pc-section__head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--ds-space-lg); margin-bottom: var(--ds-space-xl); }

/* Naujienų blokas pradiniame: kuklus, po kategorijomis */
.pc-whatsnew { position: relative; display: grid; grid-template-columns: 1fr 300px; align-items: center; gap: var(--ds-space-2xl); overflow: hidden; min-height: 176px; padding: var(--ds-space-2xl) var(--ds-space-3xl); border-radius: var(--ds-radius-xl); background: var(--ds-teal-100); box-shadow: inset 0 0 0 1px var(--ds-teal-200); color: inherit; text-decoration: none; }
.pc-whatsnew__body { display: grid; justify-items: start; gap: 6px; }
.pc-whatsnew__eyebrow { display: inline-flex; align-items: center; gap: var(--ds-space-sm); margin-bottom: 4px; font-size: var(--ds-text-sm-size); font-weight: 600; color: var(--ds-grey-700); }
.pc-whatsnew__title { font-size: 20px; line-height: 28px; transition: color var(--ds-duration-fast); }
.pc-whatsnew__sub { color: var(--ds-grey-600); }
.pc-whatsnew .pc-more { margin-top: 6px; }
.pc-whatsnew:hover .pc-whatsnew__title { color: var(--ds-teal-700); }
.pc-whatsnew:hover .pc-more svg { transform: translateX(2px); }
/* Naujausių vaizdų „krūvelė“, išlindusi iš apačios */
.pc-whatsnew__stack { position: relative; align-self: stretch; margin: 0 0 calc(-1 * var(--ds-space-2xl)); }
.pc-whatsnew__stack img { position: absolute; left: 50%; bottom: calc(var(--i) * 18px - 40px); width: 250px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--ds-radius-lg); box-shadow: 0 0 0 3px var(--ds-white), 0 0 0 4px var(--nw-line), 0 8px 24px -6px rgba(15, 40, 42, .18); transform: translateX(-50%) scale(calc(1 - var(--i) * .07)); transform-origin: 50% 0; transition: transform var(--ds-duration) var(--ds-ease); }
.pc-whatsnew:hover .pc-whatsnew__stack img { transform: translateX(-50%) translateY(-4px) scale(calc(1 - var(--i) * .07)); }
.pc-more { display: inline-flex; align-items: center; gap: 4px; color: var(--ds-teal-600); font-weight: 600; text-decoration: none; white-space: nowrap; }
.pc-more:hover { color: var(--ds-teal-800); }
.pc-more svg { width: 14px; height: 14px; transition: transform var(--ds-duration-fast); }
.pc-more:hover svg { transform: translateX(2px); }

/* Kategorijos, kaip Figmoje */
.pc-cats { display: grid; grid-template-columns: 1fr 1fr; gap: var(--ds-space-4xl) var(--ds-space-5xl); }
.pc-cat h2 { padding-bottom: var(--ds-space-md); border-bottom: 1px solid var(--ds-grey-200); font-size: 22px; line-height: 30px; } /* nėra DS */
.pc-cat ul { margin: 0; padding: 0; list-style: none; }
.pc-cat li { border-bottom: 1px solid var(--ds-grey-200); }
.pc-cat li a { display: block; padding: var(--ds-space-lg) 0; color: var(--ds-grey-800); text-decoration: none; }
.pc-cat li a:hover { color: var(--ds-teal-700); }
.pc-cat .pc-more { margin-top: var(--ds-space-lg); }

/* ---------- Naujienų puslapis ---------- */
.pc-layout { display: grid; grid-template-columns: 260px 1fr; gap: var(--ds-space-4xl); padding: var(--ds-space-4xl) 0 var(--ds-space-6xl); }

/* Kairysis meniu, kaip pagalbos centro straipsnyje */
.pc-nav { position: sticky; top: var(--ds-space-xl); align-self: start; padding-right: var(--ds-space-xl); border-right: 1px solid var(--ds-grey-200); }
.pc-nav__group { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: var(--ds-space-sm) 0; border: 0; background: none; color: var(--ds-grey-900); font: inherit; font-weight: 600; text-align: left; text-decoration: none; }
.pc-nav__group:hover { color: var(--ds-teal-700); }
.pc-nav__group svg { width: 16px; height: 16px; color: var(--ds-grey-500); }
.pc-nav__sub { display: grid; gap: 2px; margin: 4px 0 var(--ds-space-md); }
.pc-nav__sub button { display: flex; align-items: center; justify-content: space-between; padding: var(--ds-space-sm) var(--ds-space-lg); border: 0; border-radius: var(--ds-radius-md); background: none; color: var(--ds-grey-600); font: inherit; text-align: left; transition: background var(--ds-duration-fast), color var(--ds-duration-fast); }
.pc-nav__sub button:hover { background: var(--ds-teal-100); color: var(--ds-grey-900); }
.pc-nav__sub button.is-on { background: var(--ds-teal-200); color: var(--ds-grey-900); }
.pc-nav__sub small { font-size: var(--ds-text-xs-size); color: var(--ds-grey-500); font-variant-numeric: tabular-nums; }

.pc-feed__head { display: grid; gap: var(--ds-space-sm); margin-bottom: var(--ds-space-xl); }
.pc-feed__intro { max-width: 760px; text-wrap: pretty; color: var(--ds-grey-600); }

/* Mėnesio grupė: data kairėje, įrašai dešinėje (kaip changelog) */
.pc-month { display: grid; grid-template-columns: 140px 1fr; gap: var(--ds-space-2xl); padding-top: var(--pc-post-gap); border-top: 1px solid var(--ds-grey-200); }
.pc-month__label { position: sticky; top: var(--ds-space-xl); align-self: start; padding-top: 2px; font-size: var(--ds-text-sm-size); font-weight: 600; color: var(--ds-grey-500); }
.pc-post { display: grid; gap: var(--ds-space-lg); padding-bottom: var(--pc-post-gap); scroll-margin-top: var(--ds-space-xl); }
.pc-post + .pc-post { padding-top: var(--pc-post-gap); border-top: 1px solid var(--nw-line); }
.pc-post .nw-entry__date { margin-left: 0; }
/* Artumas (Gestalt): vidiniai tarpai aiškiai mažesni už tarpą tarp įrašų */
.pc-post .nw-entry__img { margin: var(--ds-space-xs) 0; }
.pc-post .nw-entry__foot { margin-top: var(--ds-space-xl); }
.pc-post .nw-entry__foot.is-bare { margin-top: var(--ds-space-xs); }
.pc-post__title { font-size: 22px; line-height: 30px; letter-spacing: -.01em; } /* nėra DS */
.pc-post__title a { color: inherit; text-decoration: none; }
.pc-post__title a:hover { color: var(--ds-teal-700); }
.pc-post .nw-entry__text, .pc-post .nw-entry__points { font-size: 15px; line-height: 24px; } /* nėra DS: ilgesnis skaitymas */
.pc-post .nw-entry__points li::before { top: 11px; }

/* Srauto pabaiga */
.pc-end__body { display: grid; justify-items: start; gap: var(--ds-space-sm); padding-bottom: var(--ds-space-xl); }
.pc-end__ico { display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: var(--ds-space-xs); border-radius: var(--ds-radius-full); background: var(--ds-green-100); color: var(--ds-green-600); }
.pc-end__ico svg { width: 22px; height: 22px; overflow: visible; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
/* Daigelis kartais palinguoja, kaip nuo vėjelio */
.pc-end__ico svg { animation: pc-sway 6s var(--ds-ease) 1s infinite; transform-origin: 50% 95%; }
@keyframes pc-sway { 0%, 80%, 100% { transform: rotate(0); } 85% { transform: rotate(-7deg); } 92% { transform: rotate(5deg); } }
@media (prefers-reduced-motion: reduce) { .pc-end__ico svg { animation: none; } }
.pc-end__title { font-size: 16px; line-height: 24px; } /* nėra DS */
.pc-end__text { color: var(--ds-grey-600); text-wrap: pretty; }
.pc-end .nw-btn { margin-top: var(--ds-space-sm); }

.pc-empty { display: grid; justify-items: start; gap: var(--ds-space-md); padding: var(--ds-space-3xl) 0; border-top: 1px solid var(--ds-grey-200); color: var(--ds-grey-600); }


@media (max-width: 900px) {
  .pc-layout { grid-template-columns: 1fr; gap: var(--ds-space-xl); }
  .pc-nav { position: static; padding-right: 0; border-right: 0; }
  .pc-nav__groups { display: none; }
}
@media (max-width: 640px) {
  .pc-top { padding: 0 var(--ds-space-lg); }
  .pc-brand__name { display: none; }
  .pc-hero__title { font-size: 28px; line-height: 36px; }
  .pc-cats { grid-template-columns: 1fr; }
  .pc-whatsnew { grid-template-columns: 1fr; padding: var(--ds-space-xl); }
  .pc-whatsnew__stack { display: none; }
  .pc-month { grid-template-columns: 1fr; gap: var(--ds-space-md); }
  .pc-month__label { position: static; }
  :root { --pc-post-gap: var(--ds-space-4xl); }
}