/* Biologicznie24 – strona główna */
.bz-home { background: #fff; }
.bz-home *, .bz-home *::before, .bz-home *::after { box-sizing: border-box; }
.bz-home img { max-width: 100%; height: auto; }
.bz-sec { padding: 3.5rem 0; }
.bz-head { max-width: 760px; margin-bottom: 1.8rem; }
.bz-head h2 { font-size: clamp(1.5rem, 2.6vw, 2.1rem); margin: .2rem 0 .5rem; color: var(--bz-night); }
.bz-head p { color: var(--bz-muted); margin: 0; }
.bz-kicker { display: inline-flex; align-items: center; gap: .45rem; font-family: var(--font-serif); font-weight: 600; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--bz-safr); margin: 0; }
.bz-dot { width: .6rem; height: .6rem; border-radius: 50%; background: var(--bz-amber); box-shadow: 0 0 0 3px rgba(224,169,59,.25); }

/* 1. Hero */
.bz-hero { background: var(--bz-agar); padding: 3rem 0 3.5rem; border-bottom: 1px solid var(--bz-line); overflow: hidden; }
.bz-hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 2.5rem; align-items: center; }
.bz-hero__h1 { font-size: clamp(2rem, 4.2vw, 3.2rem); line-height: 1.08; margin: .6rem 0 1rem; color: var(--bz-night); }
.bz-hero__lead { font-size: 1.1rem; color: #3A3756; max-width: 560px; }
.bz-search { display: flex; gap: .5rem; margin: 1.4rem 0 1rem; max-width: 560px; }
.bz-search input { flex: 1; min-width: 0; padding: .8rem 1.1rem; border: 2px solid var(--bz-violet); border-radius: 999px; font: inherit; background: #fff; }
.bz-search input:focus { outline: 3px solid var(--bz-amber); outline-offset: 1px; }
.bz-hero__tags { display: flex; flex-wrap: wrap; gap: .4rem .6rem; align-items: center; font-size: .9rem; color: var(--bz-muted); }
.bz-hero__tags a { padding: .25rem .7rem; border: 1px dashed var(--bz-violet); border-radius: 999px; color: var(--bz-violet); text-decoration: none; }
.bz-hero__tags a:hover { background: var(--bz-violet); color: #fff; border-style: solid; }
.bz-scope { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; justify-items: center; }
.bz-scope__svg { width: 100%; max-width: 400px; height: auto; filter: drop-shadow(0 18px 30px rgba(28,26,71,.18)); }
.bz-cell { fill: rgba(224,169,59,.18); stroke: #B9922F; stroke-width: 3; }
.bz-org { cursor: pointer; outline: none; }
.bz-org__nuc { fill: #C9C5EC; stroke: var(--bz-violet); stroke-width: 3; }
.bz-org__chl { fill: #7FB04A; stroke: #2F5D1E; stroke-width: 2.5; }
.bz-org__mit { fill: #F2B8A3; stroke: var(--bz-safr-dark); stroke-width: 2.5; }
.bz-org__bac { fill: #F5C7BB; stroke: var(--bz-safr); stroke-width: 2.5; }
.bz-org__lys { fill: #FFE1A3; stroke: #A9781A; stroke-width: 2.5; }
.bz-org__vac { fill: rgba(140,180,220,.45); stroke: #3E6E9E; stroke-width: 2.5; }
.bz-org__lbl { font: 600 12px var(--font-sans); fill: var(--bz-night); text-anchor: middle; opacity: 0; transition: opacity .15s; pointer-events: none; }
.bz-org:hover .bz-org__lbl, .bz-org:focus .bz-org__lbl, .bz-org.is-on .bz-org__lbl { opacity: 1; }
.bz-org:hover > :first-child, .bz-org:focus > :first-child, .bz-org.is-on > :first-child { stroke-width: 4.5; }
.bz-scope__card { width: 100%; max-width: 420px; min-height: 7.5rem; background: #fff; border: 2px solid var(--bz-violet); border-radius: 14px; padding: .9rem 1.1rem; }
.bz-scope__card p { margin: 0 0 .35rem; }
.bz-scope__hint { color: var(--bz-muted); font-size: .92rem; }
.bz-scope__org { font-family: var(--font-serif); color: var(--bz-violet); }

/* 2. Układ okresowy */
.bz-elements { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .6rem; }
.bz-el a { position: relative; display: flex; flex-direction: column; justify-content: flex-end; aspect-ratio: 1 / 1; padding: .6rem; border: 2px solid var(--bz-violet); border-radius: 6px; text-decoration: none; color: var(--bz-night); background: #fff; transition: transform .15s ease, background .15s ease; }
.bz-el--1 a { background: var(--bz-lav); }
.bz-el--2 a { background: #FBEAE4; border-color: var(--bz-safr); }
.bz-el--3 a { background: var(--bz-agar); border-color: #B9922F; }
.bz-el a:hover { transform: translateY(-3px); background: var(--bz-violet); color: #fff; border-color: var(--bz-violet); }
.bz-el__no { position: absolute; top: .45rem; left: .55rem; font-size: .78rem; font-weight: 600; }
.bz-el__cnt { position: absolute; top: .45rem; right: .55rem; font-size: .78rem; opacity: .8; }
.bz-el__sym { font-family: var(--font-serif); font-size: clamp(1.6rem, 3vw, 2.4rem); font-weight: 700; line-height: 1; }
.bz-el__name { font-size: .82rem; line-height: 1.2; margin-top: .3rem; }

/* 3. Skala */
.bz-scale { background: var(--bz-night); color: #E9E7F7; }
.bz-scale .bz-head h2 { color: #fff; }
.bz-scale .bz-head p { color: #C3C0E0; }
.bz-scale .bz-kicker { color: var(--bz-amber); }
.bz-scale__box { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.16); border-radius: 14px; padding: 1.4rem 1.4rem 1.6rem; }
.bz-scale__box input[type=range] { width: 100%; accent-color: var(--bz-amber); }
.bz-scale__ticks { list-style: none; margin: .3rem 0 1.2rem; padding: 0; display: flex; justify-content: space-between; font-size: .72rem; color: #A9A6CC; }
.bz-scale__item h3 { color: #fff; font-size: 1.5rem; margin: .1rem 0 .3rem; }
.bz-scale__pow { color: var(--bz-amber); font-family: var(--font-serif); font-weight: 600; margin: 0; }
.bz-scale__item .bz-link { color: var(--bz-amber); }

/* 4. Najnowsze */
.bz-new__grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 2rem; }
.bz-new__img { display: block; border-radius: 12px; overflow: hidden; aspect-ratio: 16 / 9; background: var(--bz-lav); }
.bz-new__img img { width: 100%; height: 100%; object-fit: cover; }
.bz-new__lead h3 { font-size: 1.45rem; margin: .3rem 0 .4rem; }
.bz-new__lead h3 a { color: var(--bz-night); text-decoration: none; }
.bz-tag { display: inline-block; margin: .8rem 0 0; font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--bz-safr); }
.bz-new__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.bz-new__list a { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: .8rem; align-items: center; text-decoration: none; color: var(--bz-night); font-weight: 600; line-height: 1.3; padding-bottom: .7rem; border-bottom: 1px solid var(--bz-line); }
.bz-new__list img, .bz-new__list .bz-noimg { width: 84px; height: 64px; object-fit: cover; border-radius: 8px; display: block; background: var(--bz-lav); }
.bz-new__list small { display: block; font-weight: 400; color: var(--bz-safr); font-size: .76rem; text-transform: uppercase; letter-spacing: .06em; }
.bz-new__list a:hover { color: var(--bz-safr); }

/* 5. Kalkulator */
.bz-calc { background: var(--bz-lav); }
.bz-calc__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2.5rem; align-items: start; }
.bz-calc h2 { color: var(--bz-night); }
.bz-calc__note { font-size: .88rem; color: var(--bz-muted); }
.bz-calc__form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; background: #fff; border-radius: 14px; padding: 1.3rem; border: 2px solid var(--bz-violet); }
.bz-calc__form label { display: flex; flex-direction: column; font-weight: 600; font-size: .9rem; gap: .3rem; }
.bz-calc__form label span { font-weight: 400; color: var(--bz-muted); }
.bz-calc__form input { width: 100%; padding: .6rem .7rem; border: 1px solid var(--bz-line); border-radius: 8px; font: inherit; }
.bz-calc__out { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; }
.bz-calc__out span { background: var(--bz-agar); border-radius: 10px; padding: .7rem; font-size: .85rem; color: var(--bz-muted); }
.bz-calc__out b { display: block; font-family: var(--font-serif); font-size: 1.3rem; color: var(--bz-violet); }

/* 6. Pary */
.bz-pairs__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.bz-pair { border: 1px solid var(--bz-line); border-radius: 14px; padding: 1rem 1.1rem; background: #fff; }
.bz-pair__sw { display: flex; align-items: center; gap: .4rem; margin-bottom: .7rem; }
.bz-pair__sw span { font-size: .8rem; color: var(--bz-muted); }
.bz-pair__sw button { flex: 1; min-width: 0; padding: .45rem .5rem; border: 2px solid var(--bz-violet); background: #fff; color: var(--bz-violet); border-radius: 999px; font: 600 .9rem var(--font-serif); cursor: pointer; }
.bz-pair__sw button[aria-selected=true] { background: var(--bz-violet); color: #fff; }
.bz-pair p { margin: 0; font-size: .95rem; }

/* 7. Domeny */
.bz-scroll { overflow-x: auto; }
.bz-domtab { width: 100%; border-collapse: separate; border-spacing: 0; min-width: 620px; font-size: .95rem; }
.bz-domtab th, .bz-domtab td { padding: .7rem .9rem; border-bottom: 1px solid var(--bz-line); text-align: left; vertical-align: top; }
.bz-domtab thead th { background: var(--bz-night); color: #fff; font-family: var(--font-serif); }
.bz-domtab thead th:first-child { border-radius: 10px 0 0 0; }
.bz-domtab thead th:last-child { border-radius: 0 10px 0 0; }
.bz-domtab tbody th { color: var(--bz-violet); }

/* 8. Archiwum – szkiełka preparatów */
.bz-archive { background: var(--bz-agar); }
.bz-slides { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.bz-slides a { display: flex; flex-direction: column; gap: .4rem; height: 100%; padding: 1rem; border-radius: 4px; background: linear-gradient(90deg, #E6E3D5 0 18%, #fff 18%); border: 1px solid #D6D0B9; text-decoration: none; color: var(--bz-night); padding-left: calc(18% + .8rem); position: relative; }
.bz-slides a::after { content: ""; position: absolute; right: .8rem; top: 50%; width: 1.4rem; height: 1.4rem; margin-top: -.7rem; border-radius: 50%; background: rgba(178,58,30,.18); border: 2px solid var(--bz-safr); }
.bz-slides__no { font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; color: var(--bz-safr); font-weight: 600; }
.bz-slides__t { font-weight: 600; line-height: 1.3; padding-right: 1.8rem; }
.bz-slides__c { font-size: .8rem; color: var(--bz-muted); margin-top: auto; }
.bz-slides a:hover { border-color: var(--bz-violet); }

/* 9. Quiz */
.bz-quiz__list { margin: 0; padding: 0 0 0 1.2rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 2rem; }
.bz-quiz__list li { padding: .3rem 0 .8rem; border-bottom: 1px dashed var(--bz-line); }
.bz-quiz__list li > p { margin: 0 0 .5rem; font-weight: 600; }
.bz-quiz__btns { display: flex; gap: .5rem; }
.bz-quiz__btns button { padding: .4rem 1rem; border-radius: 6px; border: 2px solid var(--bz-violet); background: #fff; color: var(--bz-violet); font: 600 .9rem var(--font-serif); cursor: pointer; }
.bz-quiz__btns button:disabled { cursor: default; opacity: .55; }
.bz-quiz__btns button.is-ok { background: #2F6B3A; border-color: #2F6B3A; color: #fff; opacity: 1; }
.bz-quiz__btns button.is-bad { background: var(--bz-safr); border-color: var(--bz-safr); color: #fff; opacity: 1; }
.bz-quiz__exp { margin: .5rem 0 0; font-size: .92rem; color: var(--bz-muted); }
.bz-quiz__score { font-family: var(--font-serif); font-weight: 600; color: var(--bz-violet); font-size: 1.1rem; }

/* 10. Lista */
.bz-check { background: var(--bz-lav); }
.bz-check__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 2rem; align-items: start; }
.bz-check__progress { font-family: var(--font-serif); font-size: 2rem; font-weight: 700; color: var(--bz-violet); margin: .5rem 0; }
.bz-check__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.bz-check__list label { display: flex; gap: .7rem; align-items: flex-start; background: #fff; border-radius: 10px; padding: .7rem .9rem; border: 1px solid var(--bz-line); cursor: pointer; }
.bz-check__list input { width: 1.15rem; height: 1.15rem; margin-top: .15rem; accent-color: var(--bz-safr); flex: none; }
.bz-check__list input:checked + span { text-decoration: line-through; color: var(--bz-muted); }

/* 11. Z działów */
.bz-cols__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.4rem; }
.bz-col h3 { font-size: 1.1rem; padding-bottom: .4rem; border-bottom: 3px solid var(--bz-amber); }
.bz-col h3 a { color: var(--bz-night); text-decoration: none; }
.bz-col ul { list-style: none; margin: 0; padding: 0; }
.bz-col li { padding: .5rem 0; border-bottom: 1px solid var(--bz-line); }
.bz-col li a { color: var(--bz-text); text-decoration: none; }
.bz-col li a:hover { color: var(--bz-safr); }

/* 12. FAQ */
.bz-faq__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem 1.4rem; }
.bz-faq details { border: 2px solid var(--bz-lav); border-radius: 12px; padding: .8rem 1rem; background: #fff; }
.bz-faq details[open] { border-color: var(--bz-violet); }
.bz-faq summary { cursor: pointer; font-weight: 600; font-family: var(--font-serif); color: var(--bz-night); list-style: none; display: flex; justify-content: space-between; gap: .8rem; }
.bz-faq summary::-webkit-details-marker { display: none; }
.bz-faq summary::after { content: "+"; color: var(--bz-safr); font-size: 1.3rem; line-height: 1; }
.bz-faq details[open] summary::after { content: "−"; }
.bz-faq details p { margin: .6rem 0 0; color: #3A3756; }

/* 13. O redakcji */
.bz-about { padding-top: 1rem; }
.bz-about__box { display: flex; gap: 1.4rem; align-items: flex-start; background: var(--bz-agar); border: 2px dashed #C9B47A; border-radius: 16px; padding: 1.5rem 1.6rem; }
.bz-about__ico { width: 56px; height: 56px; color: var(--bz-violet); flex: none; }
.bz-about h2 { margin: 0 0 .4rem; font-size: 1.4rem; color: var(--bz-night); }

/* Responsywność */
@media (max-width: 1024px) {
	.bz-elements { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.bz-slides { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bz-cols__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bz-pairs__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
	.bz-hero__grid, .bz-new__grid, .bz-calc__grid, .bz-check__grid { grid-template-columns: minmax(0, 1fr); }
	.bz-quiz__list, .bz-faq__grid { grid-template-columns: minmax(0, 1fr); }
	.bz-scope__svg { max-width: 280px; }
	.bz-scope__card { min-height: 0; }
}
@media (max-width: 560px) {
	.bz-sec { padding: 2.4rem 0; }
	.bz-elements { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.bz-slides, .bz-cols__grid, .bz-pairs__grid { grid-template-columns: minmax(0, 1fr); }
	.bz-calc__form, .bz-calc__out { grid-template-columns: minmax(0, 1fr); }
	.bz-search { flex-direction: column; }
	.bz-scale__ticks li:nth-child(even) { display: none; }
	.bz-about__box { flex-direction: column; }
}
