/* Bibliotēkas lapa: centrētas cilnes, plaukti, rīki, saites, kurss, laika josla, galerija. */

.tabs {
  position: sticky; top: 72px; z-index: 30; background: rgba(244, 243, 239, .92);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border-top: 1px solid var(--ink); border-bottom: 1px solid var(--rule);
}
.tabs .wrap { display: flex; justify-content: center; gap: 4px; overflow-x: auto; scrollbar-width: none; padding-top: 10px; padding-bottom: 10px; }
.tabs .wrap::-webkit-scrollbar { display: none; }
.tabs a { flex: none; padding: 8px 14px; border-radius: 999px; font-size: 14px; font-weight: 600; color: var(--ink-2); transition: background .2s, color .2s; }
.tabs a:hover { color: var(--ink); background: rgba(26, 26, 24, .05); }
.tabs a.is-on { background: var(--ink); color: var(--paper); }
@media (max-width: 760px) { .tabs .wrap { justify-content: flex-start; } }

.lib { max-width: 1040px; }
.lib-sec { padding: clamp(56px, 7vw, 96px) 0 0; scroll-margin-top: 140px; }
.lib-sec:last-child { padding-bottom: var(--section); }
.lib-h { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; padding-bottom: 18px; margin-bottom: 28px; border-bottom: 1px solid var(--rule); }
.lib-intro { margin: -12px 0 28px; font-size: 15px; }

/* Tagad */
.now { display: grid; grid-template-columns: 160px minmax(0, 1fr); margin: 0; }
.now dt, .now dd { padding: 16px 0; border-bottom: 1px solid var(--rule-soft); margin: 0; }
.now dt { font-weight: 700; font-size: 12px; letter-spacing: .09em; text-transform: uppercase; color: var(--rust); padding-top: 20px; }
.now dd { font-size: 17px; line-height: 1.55; color: var(--ink); }
@media (max-width: 620px) { .now { grid-template-columns: 1fr; } .now dt { border: 0; padding-bottom: 0; } }

/* Plaukti bibliotēkā ar aprakstu */
.shelf--lib { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }

/* Rīki */
.tools { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.tool { background: var(--card); border: 1px solid var(--rule-soft); border-radius: 8px; padding: 22px; display: flex; flex-direction: column; gap: 8px; transition: border-color .2s, transform .3s var(--ease); }
.tool:hover { border-color: var(--rule); transform: translateY(-2px); }
.tool .k { font-weight: 700; font-size: 11.5px; letter-spacing: .09em; text-transform: uppercase; color: var(--rust); }
.tool b { font-weight: 600; font-size: 18px; letter-spacing: -0.02em; }
.tool p { font-size: 14.5px; color: var(--ink-2); margin: 0; line-height: 1.55; }
@media (max-width: 860px) { .tools { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .tools { grid-template-columns: 1fr; } }

/* Saites */
.marks li { border-bottom: 1px solid var(--rule-soft); }
.marks a { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr) auto; gap: 20px; align-items: baseline; padding: 16px 0; }
.marks b { font-weight: 600; font-size: 16.5px; letter-spacing: -0.015em; }
.marks span { font-size: 14.5px; color: var(--ink-2); }
.marks i { font-style: normal; color: var(--muted); font-size: 13px; }
.marks a:hover b { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
@media (max-width: 620px) { .marks a { grid-template-columns: minmax(0, 1fr) auto; } .marks span { grid-column: 1 / -1; grid-row: 2; } }

/* Kurss */
.lessons { counter-reset: l; }
.lessons li { counter-increment: l; display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: 16px; align-items: baseline; padding: 18px 0; border-bottom: 1px solid var(--rule-soft); }
.lessons li::before { content: counter(l, decimal-leading-zero); font-weight: 700; font-size: 13px; color: var(--rust); }
.lessons b { display: block; font-weight: 600; font-size: 17.5px; letter-spacing: -0.015em; }
.lessons span { font-size: 14.5px; color: var(--ink-2); }
.lessons em { font-style: normal; font-size: 13.5px; color: var(--muted); white-space: nowrap; }

/* Laika josla */
.timeline { position: relative; padding-left: 0; }
.timeline li { display: grid; grid-template-columns: 120px 24px minmax(0, 1fr); gap: 0 16px; padding-bottom: 28px; position: relative; }
.timeline li::before { content: ""; grid-column: 2; grid-row: 1 / span 2; justify-self: center; width: 1px; background: var(--rule); margin-top: 18px; }
.timeline li:last-child::before { display: none; }
.timeline .y { grid-column: 1; grid-row: 1; font-weight: 700; font-size: 15px; letter-spacing: -0.01em; padding-top: 1px; }
.timeline .n { grid-column: 2; grid-row: 1; justify-self: center; width: 11px; height: 11px; border-radius: 50%; border: 2px solid var(--rust); background: var(--paper); margin-top: 6px; position: relative; z-index: 1; }
.timeline li:first-child .n { background: var(--rust); }
.timeline .b { grid-column: 3; grid-row: 1 / span 2; }
.timeline b { display: block; font-weight: 600; font-size: 17.5px; letter-spacing: -0.015em; }
.timeline p { margin: 4px 0 0; font-size: 15px; color: var(--ink-2); }
@media (max-width: 560px) { .timeline li { grid-template-columns: 76px 20px minmax(0, 1fr); gap: 0 10px; } }

/* Galerija */
.gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.gallery button { display: block; border-radius: 6px; overflow: hidden; background: var(--bone); aspect-ratio: 1; }
.gallery button.wide { grid-column: span 2; grid-row: span 2; }
.gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.gallery button:hover img { transform: scale(1.03); }
@media (max-width: 760px) { .gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 480px) { .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } }