/* Poradniki i rankingi kategorii (30.10.2026): okładka z logo, „W skrócie”, FAQ jako rozwijane pytania, boks z linkiem.
   Używają: artykuły z polami w_skrocie / faq (narzedzia/buduj_artykuly.py) i ranking.php. Kolory marki: #0b705b, #0d3a30, #F8C618. */
.tn-okladka{margin:0}
.tn-okladka img{display:block;width:100%;height:auto;aspect-ratio:1600/840;object-fit:cover;border-radius:10px}
.article-cover.tn-pelna{height:auto;aspect-ratio:1600/840}
.tn-okladka figcaption,.tn-zrodlo{margin-top:8px;font-size:12.5px;line-height:1.4;color:#6b7772}
.tn-okladka figcaption a,.tn-zrodlo a{color:inherit;text-decoration:underline}

.tn-skrot{position:relative;overflow:hidden;margin:26px 0 0;padding:28px 32px 30px;border-radius:12px;color:#fff;
  background:radial-gradient(120% 140% at 100% 0%,#1a8a71 0%,#0b705b 38%,#0d3a30 100%);box-shadow:0 14px 40px #0d3a3026}
.tn-skrot:after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;border:34px solid #ffffff0f}
.tn-skrot-nad{margin:0 0 6px;font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#F8C618}
.tn-skrot h2{margin:0 0 16px!important;font-size:1.5rem!important;line-height:1.25;color:#fff}
.tn-skrot ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 26px}
.tn-skrot li{position:relative;margin:0;padding:0 0 0 32px;font-size:15.5px;line-height:1.5;color:#eef6f3}
.tn-skrot li:before{content:"";position:absolute;left:0;top:2px;width:21px;height:21px;border-radius:50%;background:#F8C618 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d3a30' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/13px no-repeat}
.tn-skrot li strong{color:#fff}

.tn-faq{margin:46px 0 10px;padding:30px 30px 22px;border-radius:12px;background:#eef7f3;border:1px solid #d6e9e0}
.tn-faq-nad{margin:0 0 4px!important;font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#0b705b}
.tn-faq h2{margin:0 0 18px!important}
.tn-faq details{margin:0 0 10px;background:#fff;border:1px solid #d6e9e0;border-radius:10px;transition:box-shadow .2s,border-color .2s}
.tn-faq details[open]{border-color:#0b705b;box-shadow:0 8px 24px #0b705b1a}
.tn-faq summary{position:relative;list-style:none;cursor:pointer;padding:17px 56px 17px 20px;font-weight:700;font-size:16px;line-height:1.4;color:#0e2a24}
.tn-faq summary::-webkit-details-marker{display:none}
.tn-faq summary:after{content:"+";position:absolute;right:16px;top:50%;width:28px;height:28px;margin-top:-14px;border-radius:50%;
  background:#0b705b;color:#fff;font-size:20px;line-height:27px;text-align:center;font-weight:500;transition:transform .2s,background .2s}
.tn-faq details[open] summary:after{transform:rotate(45deg);background:#0d3a30}
.tn-faq summary:hover{color:#0b705b}
.tn-faq .tn-faq-odp{padding:0 20px 18px;color:#33433e;font-size:15.5px;line-height:1.65}
.tn-faq .tn-faq-odp p{margin:0}

.tn-boks{display:flex;align-items:center;gap:18px;margin:30px 0;padding:20px 22px;border-radius:12px;background:#fff;border:1.5px solid #0b705b;box-shadow:0 8px 26px #0b705b14}
.tn-boks-ikona{flex:none;width:46px;height:46px;border-radius:50%;background:#0b705b;color:#F8C618;display:grid;place-items:center;font-size:22px}
.tn-boks p{margin:0!important;font-size:15.5px;line-height:1.5}
.tn-boks a.tn-boks-link{display:inline-block;margin-top:6px;font-weight:700;color:#0b705b;text-decoration:none}
.tn-boks a.tn-boks-link:hover{text-decoration:underline}

/* rankingi kategorii: poradnik pod listą biur */
.tn-poradnik{margin-top:28px}
.tn-poradnik .tn-skrot{margin-top:22px}
.tn-poradnik-tresc{max-width:820px;margin:8px auto 0;font-size:16.5px;line-height:1.75;color:#24332f}
.tn-poradnik-tresc h2{margin:40px 0 14px;font-size:1.65rem;line-height:1.3}
.tn-poradnik-tresc h3{margin:26px 0 8px;font-size:1.15rem}
.tn-poradnik-tresc p{margin:0 0 14px}
.tn-poradnik-tresc ul,.tn-poradnik-tresc ol{margin:0 0 16px;padding-left:22px}
.tn-poradnik-tresc li{margin:0 0 7px}
.tn-poradnik-tresc a{color:#0b705b;text-decoration:underline}
.tn-poradnik .tn-faq{max-width:820px;margin-left:auto;margin-right:auto}

@media (max-width:700px){
  .tn-skrot{padding:22px 20px 24px}
  .tn-skrot ul{grid-template-columns:minmax(0,1fr)}
  .tn-faq{padding:22px 14px 14px}
  .tn-faq summary{font-size:15px;padding:15px 50px 15px 16px}
  .tn-faq .tn-faq-odp{padding:0 16px 16px}
  .tn-boks{align-items:flex-start}
  .tn-poradnik-tresc{font-size:16px}
}