:root {
  --navy: #0a2540;
  --navy-deep: #071c33;
  --navy-soft: #143656;
  /* Accent — blue (formerly red). Kept the --red token names so every
     existing accent rule recolors at once. */
  --red: #1773d6;
  --red-dark: #1160b8;
  --blue: #2f6cb0;
  --ink: #16202c;
  --muted: #5d6b7a;
  --faint: #647180;
  --line: #e4e8ee;
  --bg: #ffffff;
  --bg-soft: #f5f7fa;
  /* Neutral skeleton behind card/image thumbnails while the photo loads —
     replaces the old blue gradient so loading doesn't flash a jarring colour. */
  --img-bg: #e9eef4;
  --maxw: 1240px;
  --radius: 4px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: "Inter", system-ui, -apple-system, sans-serif;
  color: var(--ink);
  background: var(--bg);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  /* Sticky footer: fill at least the viewport, let main grow so the footer
     never floats mid-page on short content. (.consent/.toast are fixed.) */
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
/* Ambient blue glow pinned to the viewport — stays put as the page scrolls */
body::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(120% 80% at 50% -12%, rgba(102,153,255,.38) 0%, rgba(102,153,255,0) 60%);
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
/* Suppress the alt-text flash while a thumbnail is still loading (lazy/slow net):
   the img text is transparent so only the neutral --img-bg skeleton shows until
   the photo paints. alt stays in the DOM, so screen readers still read it. */
[class*="__media"] img, [class*="__thumb"] img, [class*="cover"] img,
[class*="__img"] img, img[class*="__img"], .vfeature img, .galfig img,
.pgal__lead img, .post__avatar img, .profphotos__item img { color: transparent; }
html { scroll-behavior: smooth; }
:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; border-radius: 2px; }

h1, h2, h3, h4 { font-family: "Archivo", "Inter", sans-serif; }

.container { width: min(var(--maxw), 100% - 48px); margin-inline: auto; }

.arr { font-style: normal; }

/* ---------- Tags / badges ---------- */
.tag {
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 5px 10px;
  color: #fff;
  border-radius: 2px;
}
.tag--red { background: var(--red); }
.tag--blue { background: var(--blue); }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .07em;
  text-transform: uppercase;
  padding: 14px 22px;
  border-radius: 2px;
  transition: background .15s, color .15s, transform .12s;
}
.btn--white { background: #fff; color: var(--navy); box-shadow: 0 8px 22px -10px rgba(0,0,0,.5); }
.btn--white:hover { background: #fff; box-shadow: 0 14px 30px -10px rgba(0,0,0,.55); }
.btn--white .arr, .btn--white { transition: transform .15s, box-shadow .15s; }
/* Secondary button on LIGHT cards/sidebars (katalog/kluby/wyniki CTAs, "zobacz
   wszystkie" links). Navy outline that fills on hover — was previously white-on-
   transparent, which is invisible on the white cards it's actually used on. */
.btn--outline {
  border: 1.5px solid var(--navy);
  color: var(--navy);
  background: transparent;
  justify-content: center;
}
.btn--outline:hover { background: var(--navy); color: #fff; border-color: var(--navy); }

.redlink {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--red);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
  transition: gap .15s, color .15s;
}
.redlink:hover { gap: 12px; }
.redlink .arr { transition: transform .15s; }
.redlink:hover .arr { transform: translateX(3px); }

.morelink {
  color: var(--red);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.morelink:hover { text-decoration: underline; }

/* ====================================================================
   SITE HEADER — two navy bars + top menu
   ==================================================================== */
:root {
  --nav-blue: #0b62c0;       /* accent used by the mega-menu */
  --nav-blue-ink: #0a55a8;
}
.site-header { position: sticky; top: 0; z-index: 50; }

/* ── Masthead (light navy #6699ff) ─────────────────────────────────── */
.masthead { background: #6699ff; }
.masthead__top {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 14px 0;
}
.masthead__actions { position: relative; display: flex; align-items: center; gap: 12px; margin-left: auto; }
.logo { display: flex; align-items: center; }
.logo__img { height: 44px; width: auto; display: block; }
@media (max-width: 600px) { .logo__img { height: 34px; } }

/* Action pills (Wyszukiwarka + Zaloguj) */
.search-btn,
.login-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 42px;
  padding: 0 16px;
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: .01em;
  white-space: nowrap;
  border: 0;
  cursor: pointer;
  font-family: inherit;
  border-radius: 999px;
  transition: background .15s, box-shadow .15s, transform .1s, color .15s;
}
.search-btn svg, .login-btn svg { flex: 0 0 auto; }
.search-btn {
  color: #004488;
  background: #fff;
  box-shadow: 0 2px 6px rgba(11,40,90,.18);
}
.search-btn:hover { box-shadow: 0 4px 14px rgba(11,40,90,.28); }
.search-btn:active { transform: translateY(0); }
.login-btn {
  color: #fff;
  background: #004488;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18);
}
.login-btn:hover { background: #003a75; }
.login-btn:active { transform: translateY(0); }

/* ── Top menu (inline, beside the logo) ────────────────────────────── */
.topmenu {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 2px;
}
.topmenu a {
  color: rgba(255,255,255,.92);
  font-family: "Signika", "Inter", sans-serif;
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  white-space: nowrap;
  padding: 7px 11px;
  border-radius: 999px;
  transition: color .15s, background .15s;
}
/* Hover + active both use the dark navy of the bottom bar. */
.topmenu a:hover { color: #fff; background: #004488; }
.topmenu a.is-active { color: #fff; background: #004488; }

/* CTA pill — used by the mobile drawer */
.btn-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 44px;
  padding: 0 20px;
  border-radius: 999px;
  background: var(--red);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .01em;
  white-space: nowrap;
  box-shadow: 0 6px 16px -8px rgba(23,115,214,.5);
  transition: background .15s, transform .12s, box-shadow .15s;
}
.btn-cta:hover { background: var(--red-dark); }
.btn-cta:active { transform: translateY(0); }

/* Hamburger (mobile only) */
.hamburger {
  display: none;
  flex: 0 0 auto;
  width: 40px; height: 40px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 0;
  background: transparent;
  cursor: pointer;
  padding: 0;
}
.hamburger span {
  width: 22px; height: 2px;
  border-radius: 2px;
  background: #fff;
  transition: transform .25s ease, opacity .2s ease;
}
.site-header.is-drawer-open .hamburger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.site-header.is-drawer-open .hamburger span:nth-child(2) { opacity: 0; }
.site-header.is-drawer-open .hamburger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Brand lockup (used by footer) */
.brand { display: flex; align-items: center; gap: 12px; }
.brand__mark { flex: 0 0 auto; }
.brand__text { display: flex; flex-direction: column; line-height: 1; }
.brand__text strong {
  font-family: "Archivo", sans-serif;
  font-weight: 700;
  font-size: 23px;
  color: var(--navy);
  letter-spacing: -.01em;
}
.brand__dot { color: var(--blue); }
.brand__text small {
  font-size: 9.5px;
  letter-spacing: .26em;
  color: var(--faint);
  margin-top: 4px;
  font-weight: 600;
}

/* ====================================================================
   SITE HEADER — Category bar (dark navy #004488) + mega-menu
   ==================================================================== */
.mainnav {
  background: #004488;
  position: sticky;
  top: 0;
  z-index: 50;
  box-shadow: 0 2px 10px rgba(8,28,64,.18);
}
.mainnav__list {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: space-between;
  list-style: none;
  margin: 0;
  padding: 0;
}
.mainnav__list a {
  position: relative;
  display: flex;
  align-items: center;
  padding: 7px 12px;
  color: rgba(255,255,255,.92);
  font-family: "Signika", "Inter", sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .035em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: color .15s, background .15s;
}
.mainnav__list a:hover { color: #fff; }
/* Active: just full-white text — no highlight/glow, no underline. */
.mainnav__list a.is-active { color: #fff; }
.mainnav__list li:first-child a { padding-left: 0; }
.mainnav__list li:last-child a { padding-right: 0; }

/* ── Hover mega-menu (drops below the navy bar) ────────────────────── */
.mainnav .container { position: relative; }
.mainnav__list a .chev {
  width: 13px; height: 13px; margin-left: 5px; opacity: .7;
  transition: transform .25s ease, opacity .15s ease;
}
.mainnav__list a:hover .chev { opacity: 1; }
.mainnav__list li.is-mega-active > a .chev { transform: rotate(180deg); opacity: 1; }

.mega {
  position: absolute;
  top: 100%; left: 0; right: 0;
  background: #004488;
  box-shadow: 0 28px 50px -22px rgba(0,18,44,.55);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  z-index: 60;
  overflow: hidden;
  /* visibility is delayed on close so the fade-OUT actually plays */
  transition: opacity .26s ease, transform .3s cubic-bezier(.22,.61,.36,1), visibility 0s linear .3s;
  will-change: opacity, transform;
}
.mega.is-open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition: opacity .26s ease, transform .3s cubic-bezier(.22,.61,.36,1), visibility 0s;
}
.mega__inner { display: flex; }
/* Subtle cross-fade of the panel content when switching category while open */
.mega.is-switching .mega__inner { animation: megaContentIn .26s cubic-bezier(.22,.61,.36,1); }
@keyframes megaContentIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
.mega__left {
  flex: 0 0 27%;
  background: #004488;
  border-right: 1px solid rgba(255,255,255,.12);
  padding: 12px 20px 14px;
}
.mega__right { flex: 1; padding: 12px 24px 14px; min-width: 0; }
.mega__label {
  display: block;
  font-size: 11px; font-weight: 800; letter-spacing: .12em;
  text-transform: uppercase; color: rgba(255,255,255,.55);
  margin-bottom: 10px;
}
.mega__sub { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.mega__sub a {
  display: flex; align-items: center; width: fit-content;
  font-family: "Inter", sans-serif;
  font-size: 14px; font-weight: 600; line-height: 1.2; color: rgba(255,255,255,.85);
  transition: color .15s;
}
.mega__sub a::before {
  content: ""; width: 0; height: 2px; border-radius: 2px;
  background: #6699ff;
  transition: width .25s ease, margin-right .25s ease;
}
.mega__sub a:hover { color: #fff; }
.mega__sub a:hover::before { width: 14px; margin-right: 10px; }
.mega__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.mega__head .mega__label { margin-bottom: 0; }
.mega__all {
  font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  color: #9fc2ff; display: inline-flex; align-items: center; gap: 6px;
  white-space: nowrap; transition: gap .15s, color .15s;
}
.mega__all:hover { color: #fff; gap: 9px; }
.mega__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.mega-card { display: block; }
.mega-card__media {
  display: block; height: 104px;
  border-radius: 10px; overflow: hidden; margin-bottom: 7px;
  background: rgba(255,255,255,.08);
}
.mega-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.mega-card:hover .mega-card__media img { transform: scale(1.06); }
.mega-card__cat {
  display: block; font-size: 10px; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; color: #9fc2ff; margin-bottom: 4px;
}
.mega-card__title {
  font-size: 13.5px; font-weight: 700; line-height: 1.3;
  letter-spacing: -.01em; color: #fff; transition: color .15s;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  min-height: 2.6em;
}
.mega-card:hover .mega-card__title { color: #cfe0ff; }
@media (prefers-reduced-motion: reduce) {
  .mega, .mega-card__media img, .mainnav__list a .chev { transition: none !important; }
  .mega { transform: none !important; }
  .mega.is-switching .mega__inner { animation: none !important; }
}

/* ── Mobile drawer ─────────────────────────────────────────────────── */
.drawer-backdrop { display: none; }   /* no overlay — the top collapsible is in-flow */
/* Mobile menu = a collapsible panel that expands DOWN from the header bar
   (was a right-side drawer). In-flow, so it pushes page content down — no
   overlay/backdrop and no stacking-context issues. */
.drawer {
  max-height: 0;
  overflow: hidden;
  background: #fff;
  border-top: 1px solid var(--line);
  transition: max-height .3s ease;
  box-shadow: 0 18px 36px -18px rgba(10,37,64,.4);
}
.site-header.is-drawer-open .drawer { max-height: 80vh; overflow-y: auto; }
.drawer__nav { display: flex; flex-direction: column; gap: 2px; padding: 12px 16px 20px; }
.drawer__label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--faint);
  margin: 16px 8px 6px;
}
.drawer__label:first-child { margin-top: 0; }
.drawer a {
  padding: 12px;
  border-radius: 10px;
  font-family: "Signika", "Inter", sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: var(--navy);
  transition: background .15s, color .15s;
}
.drawer a:hover { background: var(--bg-soft); }
.drawer a.is-active { color: var(--nav-blue); }
.drawer__cta { margin-top: 18px; color: #fff; justify-content: center; }
.drawer__cta:hover { color: #fff; }

/* ── Header responsive ─────────────────────────────────────────────── */
/* The inline service menu + search/login overflow the top row below ~1180px,
   so collapse the service menu into the hamburger drawer there. */
@media (max-width: 1180px) {
  .topmenu { display: none; }
  .hamburger { display: flex; }
}
@media (max-width: 1040px) {
  .mainnav__list a { font-size: 13.5px; letter-spacing: .02em; padding: 7px 9px; }
}
@media (max-width: 860px) {
  .mainnav,
  .login-btn { display: none; }
  .masthead__top { padding-bottom: 14px; }
}
/* Below 720px the .topcta (which carries margin-left:auto) is hidden, so the
   hamburger/actions cluster loses its right-push and bunches next to the logo.
   Re-anchor it to the right and tighten the row so it aligns cleanly. */
@media (max-width: 720px) {
  .masthead__top { gap: 12px; }
  .masthead__actions { margin-left: auto; }
}
@media (max-width: 560px) {
  .searchx, .searchx-slot { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .drawer,
  .drawer-backdrop,
  .topmenu a, .topmenu a::after,
  .mainnav__list a, .mainnav__list a::after,
  .hamburger span,
  .search-btn, .login-btn { transition: none !important; }
}

/* ====================================================================
   HERO
   ==================================================================== */
/* White page with a soft blue glow sitting right under the navbar. */
/* Notice / announcement card above the hero */
.notice-wrap { margin-bottom: 22px; }
.notice {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 16px 14px 18px;
  background: #eef4ff;
  border: 1px solid #cfe0ff;
  border-left: 4px solid var(--blue);
  border-radius: 10px;
  color: var(--navy);
}
.notice.is-hidden { display: none; }
.notice__icon { flex: 0 0 auto; display: grid; place-items: center; color: var(--blue); }
.notice__icon svg { width: 20px; height: 20px; }
.notice__txt { flex: 1; font-size: 14px; line-height: 1.4; }
.notice__txt strong { font-weight: 700; }
.notice__cta {
  flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  color: var(--blue); transition: gap .15s;
}
.notice__cta:hover { gap: 9px; }
.notice__close {
  flex: 0 0 auto; display: grid; place-items: center;
  width: 30px; height: 30px; padding: 0; border: 0; cursor: pointer;
  background: transparent; color: var(--muted); border-radius: 6px;
  transition: background .15s, color .15s;
}
.notice__close:hover { background: rgba(10,37,64,.08); color: var(--navy); }
.notice__close svg { width: 16px; height: 16px; }

/* Announcement placeholder — rectangle slot where news/announcements will go */
.announce-ph {
  display: flex; align-items: center; justify-content: center; text-align: center;
  min-height: 150px; padding: 24px;
  border: 2px dashed #c4d2e2; border-radius: 0;
  background: var(--bg-soft); color: var(--muted);
  font-family: "Archivo", "Inter", sans-serif; font-size: 16px; font-weight: 700; letter-spacing: .02em;
}

/* Ogłoszenia ticker bar (above the hero) — newest classifieds, horizontal scroll. */
/* ── Ogłoszenia: offer-submission form (marketplace posting rules) ─────── */
.offerwrap { max-width: 720px; margin: 34px auto 0; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 28px 30px; box-shadow: 0 12px 30px -22px rgba(10,37,64,.45); }
.offerwrap__t { font-family: "Archivo", sans-serif; font-size: 22px; font-weight: 800; color: var(--navy); margin: 0 0 6px; }
.offerwrap__sub { color: var(--muted); font-size: 14px; margin: 0 0 20px; }
.offerwrap__sub em, .of__label em { color: #c0392b; font-style: normal; }
.offerwrap__note { font-size: 12.5px; color: var(--faint); margin: 4px 0 12px; }
.of__label { display: block; font-weight: 600; font-size: .88rem; color: var(--navy); margin: 0 0 14px; }
.of__in { display: block; width: 100%; margin-top: 5px; padding: 10px 12px; border: 1px solid #cfd5db; border-radius: 8px; font: inherit; font-weight: 400; background: #fff; }
.of__in:focus { outline: 2px solid var(--navy); border-color: var(--navy); }
.of__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.of__check { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--muted); margin-top: 8px; cursor: pointer; }
.of__foot { display: flex; align-items: center; gap: 14px; }
/* Ogłoszenia photo uploader (mandatory) */
.of__hint { font-weight: 400; font-size: 12.5px; color: var(--muted); margin: 4px 0 0; }
.ofph { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 10px; margin-top: 10px; }
.ofph__add { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; aspect-ratio: 1; border: 2px dashed #cfd5db; border-radius: 10px; background: var(--bg-soft); color: var(--navy); font-size: 12.5px; font-weight: 600; cursor: pointer; transition: border-color .12s, background .12s; text-align: center; padding: 6px; }
.ofph__add:hover { border-color: var(--navy); background: #fff; }
.ofph__item { position: relative; margin: 0; aspect-ratio: 1; border-radius: 10px; overflow: hidden; border: 1px solid var(--line); background: #0a2540; }
.ofph__item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ofph__rm { position: absolute; top: 4px; right: 4px; width: 24px; height: 24px; border: 0; border-radius: 50%; background: rgba(10,37,64,.82); color: #fff; font-size: 12px; line-height: 1; cursor: pointer; display: grid; place-items: center; }
.ofph__rm:hover { background: #c0392b; }
.ofph__badge { position: absolute; left: 5px; bottom: 5px; background: #ffd54d; color: #0a2540; font-size: 10.5px; font-weight: 800; padding: 2px 7px; border-radius: 999px; }
.ofph__msg { font-size: 12.5px; color: var(--muted); margin: 8px 0 0; min-height: 1em; }
.ofph__msg--err { color: #c0392b; font-weight: 600; }
.of__msg { font-size: 14px; }
.of__msg--err { color: #c0392b; }
@media (max-width: 560px) { .of__grid { grid-template-columns: 1fr; gap: 0; } .offerwrap { padding: 20px 16px; } }

/* ── Notices row (above hero) — 3 CMS-writable info tiles ─────────────── */
.noticebar { margin: 24px 0 2px; }
.noticebar__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
/* Scoped + hard-reset: a legacy .notice component (info banner) also exists. */
.noticebar .notice { position: relative; display: flex; flex-direction: column; justify-content: center; gap: 4px; min-height: 108px; padding: 18px 22px; color: #fff; border: 0; border-radius: 0; box-shadow: 0 10px 26px -16px rgba(10,37,64,.55); margin: 0; overflow: hidden; isolation: isolate; background-size: cover; background-position: center; transition: transform .18s ease, box-shadow .18s ease; }
/* Sea photo per tile, tinted navy like the bottom category bar. */
.noticebar .notice:nth-child(1) { background-image: url(/img/sea4.jpg); }
.noticebar .notice:nth-child(2) { background-image: url(/img/sea9.jpg); }
.noticebar .notice:nth-child(3) { background-image: url(/img/sea6.jpg); }
.noticebar .notice::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(150deg, rgba(20,54,86,.72) 0%, rgba(10,37,64,.9) 100%); }
.noticebar .notice:hover { transform: translateY(-2px); box-shadow: 0 18px 34px -16px rgba(10,37,64,.7); }
.noticebar .notice:hover .notice__cta .arr { transform: translateX(3px); }
.notice__t { font-family: "Archivo", sans-serif; font-size: 15px; font-weight: 800; color: #fff; text-shadow: 0 1px 6px rgba(0,0,0,.35); }
.notice__d { font-size: 12.5px; color: rgba(255,255,255,.82); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notice__cta { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 700; color: #cfe0ff; margin-top: 5px; }
.notice__cta .arr { display: inline-block; transition: transform .15s ease; }
@media (max-width: 860px) { .noticebar__grid { grid-template-columns: 1fr; gap: 10px; } .noticebar { margin-top: 16px; } .notice__d { white-space: normal; } .noticebar .notice:nth-child(n+2) { display: none; } }

/* ── Fresh block: 3×2 grid + ad bar (left) · Najnowsze list (right) ────── */
.fresh { display: grid; grid-template-columns: 1fr 340px; gap: 40px; grid-auto-rows: min-content; }
/* The side column is clamped to the main column's height (overflow hidden +
   max-height 0-trick via grid stretch), so "Najnowsze" ends exactly where the
   ad bar ends; extra rows are simply clipped. */
.fresh__main { grid-column: 1; grid-row: 1; }
.fresh__side { grid-column: 2; grid-row: 1; border-left: 1px solid var(--line); padding-left: 28px; display: flex; flex-direction: column; overflow: hidden; height: 0; min-height: 100%; box-sizing: border-box; }
.nwlist { list-style: none; margin: 0 0 18px; padding: 0; flex: 1; overflow: hidden; min-height: 0; }
.nwlist li + li { border-top: 1px solid var(--line); }
.freshads { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 26px; }
@media (max-width: 1000px) { .fresh { grid-template-columns: 1fr; } .fresh__side { border-left: 0; padding-left: 0; } .freshads { grid-template-columns: 1fr; } }

/* ── Carousel section: two leader ads side by side under the track ─────── */
.leaderduo { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 26px; }
.leaderduo .promospot--leader { margin: 0; }
@media (max-width: 900px) { .leaderduo { grid-template-columns: 1fr; } }

/* ── Kalendarz wydarzeń (homepage) ─────────────────────────────────────── */
/* "Dodaj wydarzenie" CTA — first card of the .evgrid, same footprint as a
   regular .evcard, solid navy instead of a photo. (Selector needs .evcard.evcard--cta
   to outweigh the base .evcard rules that sit later in the file — otherwise the
   card renders white with a white, invisible button.) */
.evcard.evcard--cta { position: relative; justify-content: space-between; gap: 12px; padding: 16px; background: var(--navy); border-color: transparent; color: #fff; box-shadow: 0 14px 30px -18px rgba(10,37,64,.6); }
.evcard.evcard--cta:hover { border-color: transparent; box-shadow: 0 18px 38px -18px rgba(10,37,64,.7); transform: translateY(-2px); }
.evcta__ico { position: relative; display: flex; width: 42px; height: 42px; align-items: center; justify-content: center; border-radius: 12px; background: rgba(255,255,255,.14); box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); }
.evcta__title { position: relative; font-family: "Archivo", sans-serif; font-weight: 800; font-size: 15.5px; line-height: 1.35; letter-spacing: .01em; }
.evcta__btn { position: relative; align-self: flex-start; background: #fff; color: var(--navy); font-weight: 700; font-size: 13px; padding: 9px 18px; border-radius: 999px; white-space: nowrap; box-shadow: 0 6px 16px rgba(0,0,0,.22); transition: transform .12s, box-shadow .15s; }
.evcard--cta:hover .evcta__btn { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(0,0,0,.3); }
.homecal { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 20px 22px; box-shadow: 0 10px 26px -20px rgba(10,37,64,.4); }

/* Homepage upcoming-events: responsive grid of photo cards (no lonely scroller). */
.evgrid__h { font-family: "Archivo", sans-serif; font-size: 16px; font-weight: 800; color: var(--navy); margin: 26px 0 14px; }
.evgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 18px; }
.evgrid .evcard { flex: none; width: auto; }
.evgrid__empty { color: var(--muted); font-size: 14px; margin: 20px 0 0; }
/* Event-card scroller (variant 2): 1/4–1/5-width photo cards, arrow scroll. */
.evscroll { margin-bottom: 22px; }
.evscroll .hcarousel__track { gap: 16px; }
.evcard { flex: 0 0 clamp(190px, 21%, 250px); display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; color: var(--ink); transition: box-shadow .16s, transform .16s, border-color .16s; }
.evcard:hover { border-color: transparent; box-shadow: 0 16px 34px -18px rgba(10,37,64,.45); transform: translateY(-2px); }
.evcard__media { position: relative; display: block; aspect-ratio: 16 / 10; background: var(--img-bg); }
.evcard__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.evcard__date { position: absolute; left: 10px; top: 10px; display: flex; flex-direction: column; align-items: center; min-width: 44px; padding: 5px 8px 6px; background: #fff; border-radius: 10px; font-size: 10px; font-weight: 700; letter-spacing: .06em; color: var(--muted); box-shadow: 0 4px 12px rgba(10,37,64,.25); line-height: 1.05; }
.evcard__date strong { font-family: "Archivo", sans-serif; font-size: 19px; color: var(--navy); }
/* Finish date — same badge, pinned to the right corner. */
.evcard__date--end { left: auto; right: 10px; }
/* Full written date (with range) in the card body. */
.evcard__when { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--blue); }
.evcard__when svg { flex: 0 0 auto; opacity: .85; }
.evcard__body { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px 14px; }
.evcard__title { font-family: "Signika", "Inter", sans-serif; font-weight: 700; font-size: 14.5px; color: var(--navy); line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.evcard__loc { font-size: 12px; color: var(--muted); }

/* ── Wyniki regat: evb rows + result subpage ───────────────────────────── */
/* Compact row: leading trophy tile + title/meta/chips + chevron link.
   (.evrow.evrow--wrx — this block sits before the base .evrow rules, so the
   modifier needs the extra specificity to win.) */
.evrow.evrow--wrx { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 12px 16px; }
.evrow--wrx .evrow__body { padding: 0; gap: 4px; }
.evrow__thumb { position: relative; flex: 0 0 auto; width: 104px; height: 72px; border-radius: 12px; background: #0a2540 center/cover no-repeat; overflow: hidden; display: block; box-shadow: inset 0 0 0 1px rgba(10,37,64,.12); }
.evrow__thumb::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,37,64,0) 35%, rgba(10,37,64,.5) 100%); }
.evrow__trophy { position: absolute; left: 7px; bottom: 7px; z-index: 1; width: 30px; height: 30px; border-radius: 8px; background: rgba(10,37,64,.82); color: #ffd54d; display: grid; place-items: center; backdrop-filter: blur(2px); }
.wrx-tile__cls { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 0; }
.wrx-chip { background: var(--bg-soft); border: 1px solid var(--line); border-radius: 999px; font-size: 11.5px; font-weight: 700; color: var(--navy); padding: 3px 10px; }
.wrx-chip.is-on { background: var(--navy); border-color: var(--navy); color: #fff; }
.wrx-empty { color: var(--muted); padding: 24px 0; }
@media (max-width: 640px) { .evrow.evrow--wrx { grid-template-columns: auto minmax(0, 1fr); } .evrow__thumb { width: 84px; height: 62px; } .evrow--wrx .evrow__go { grid-column: 1 / -1; justify-content: center; } }
.rgx-desc { margin-bottom: 26px; }
.rgx-class { margin: 0 0 30px; }
.rgx-class__t { font-family: "Archivo", sans-serif; font-size: 20px; font-weight: 800; color: var(--navy); margin: 0 0 4px; }
.rgx-class__meta { margin: 0 0 12px; font-size: 13px; color: var(--muted); }

/* ── Homepage Charter banner (pre-launch teaser) ───────────────────────── */
.chome { position: relative; display: flex; align-items: center; overflow: hidden; min-height: 320px; border-radius: 16px; box-shadow: 0 20px 44px -22px rgba(10,37,64,.55); }
.chome__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.chome:hover .chome__img { transform: scale(1.03); }
.chome__scrim { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(6,20,40,.9) 0%, rgba(6,20,40,.65) 45%, rgba(6,20,40,.2) 100%); }
.chome__body { position: relative; padding: 36px 38px; max-width: 640px; color: #fff; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.chome__badge { color: #ffd54d; font-family: "Archivo", sans-serif; font-weight: 800; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.chome__title { font-family: "Archivo", sans-serif; font-size: clamp(22px, 3.4vw, 30px); font-weight: 800; line-height: 1.15; }
.chome__lead { font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,.88); }
@media (max-width: 720px) { .chome { min-height: 280px; } .chome__body { padding: 24px 20px; } }

/* ── Charter: pre-launch mockup landing ────────────────────────────────── */
.chx-hero { position: relative; overflow: hidden; border-radius: 18px; min-height: 420px; display: flex; align-items: center; box-shadow: 0 22px 48px -22px rgba(10,37,64,.6); }
.chx-hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.chx-hero__scrim { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(6,20,40,.92) 0%, rgba(6,20,40,.72) 45%, rgba(6,20,40,.35) 100%); }
.chx-hero__body { position: relative; padding: 44px 40px; max-width: 720px; color: #fff; }
.chx-hero__badge { display: inline-block; background: #ffd54d; color: #4a3800; font-family: "Archivo", sans-serif; font-weight: 800; font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; padding: 7px 16px; border-radius: 999px; margin-bottom: 16px; }
.chx-hero__title { font-family: "Archivo", sans-serif; font-size: clamp(26px, 4.5vw, 38px); font-weight: 800; margin: 0 0 12px; }
.chx-hero__lead { font-size: 15.5px; line-height: 1.6; color: rgba(255,255,255,.9); margin: 0 0 22px; }
.chx-search { display: flex; gap: 10px; flex-wrap: wrap; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25); backdrop-filter: blur(6px); border-radius: 14px; padding: 12px; opacity: .92; }
.chx-search__field { background: #fff; border-radius: 9px; padding: 8px 16px 9px; min-width: 130px; }
.chx-search__field span { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.chx-search__field strong { font-family: "Archivo", sans-serif; font-size: 14.5px; color: var(--navy); }
.chx-search__btn[disabled] { opacity: .85; cursor: not-allowed; align-self: stretch; }
.chx-hero__note { margin: 12px 0 0; font-size: 12.5px; color: rgba(255,255,255,.65); }
.chx-soonchip { background: #ffd54d; color: #4a3800; font-family: "Archivo", sans-serif; font-weight: 800; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; padding: 6px 14px; border-radius: 999px; }
.chx-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.chx-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.chx-card__media { position: relative; }
.chx-card__media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; filter: saturate(.9); }
.chx-card__soon { position: absolute; right: 10px; top: 10px; background: rgba(10,37,64,.85); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: 5px 11px; border-radius: 999px; }
.chx-card__body { padding: 16px 18px 18px; }
.chx-card__body h3 { margin: 0 0 5px; font-family: "Archivo", sans-serif; font-size: 17px; color: var(--navy); }
.chx-card__meta { margin: 0 0 8px; font-size: 13px; color: var(--muted); }
.chx-card__price { margin: 0 0 12px; font-size: 14px; color: var(--ink); }
.chx-card__price strong { font-family: "Archivo", sans-serif; font-size: 18px; color: var(--navy); }
.chx-card .btn[disabled] { opacity: .6; cursor: not-allowed; width: 100%; }
.chx-note { margin: 18px 0 0; font-size: 14px; color: var(--muted); }
@media (max-width: 900px) { .chx-grid { grid-template-columns: 1fr; } .chx-hero__body { padding: 30px 22px; } }

/* ── Ogłoszenia: pre-launch landing ─────────────────────────────────────── */
.oglx-hero { position: relative; overflow: hidden; text-align: center; background: linear-gradient(115deg, #0a2540 0%, #14406b 55%, #1a5a94 100%); color: #fff; border-radius: 18px; padding: 44px 26px 38px; box-shadow: 0 22px 48px -22px rgba(10,37,64,.6); }
.oglx-hero::after { content: ""; position: absolute; right: -80px; top: -90px; width: 320px; height: 320px; border-radius: 50%; background: radial-gradient(circle, rgba(102,153,255,.35) 0%, rgba(102,153,255,0) 70%); pointer-events: none; }
.oglx-hero__badge { display: inline-block; background: #ffd54d; color: #4a3800; font-family: "Archivo", sans-serif; font-weight: 800; font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; padding: 7px 16px; border-radius: 999px; margin-bottom: 16px; }
.oglx-hero__title { font-family: "Archivo", sans-serif; font-size: clamp(26px, 4.5vw, 40px); font-weight: 800; margin: 0 0 12px; }
.oglx-hero__lead { max-width: 640px; margin: 0 auto 22px; font-size: 15.5px; line-height: 1.6; color: rgba(255,255,255,.88); }
.oglx-hero__wait { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; position: relative; }
.oglx-hero__wait input[type=email] { width: min(340px, 100%); padding: 12px 15px; border: 0; border-radius: 10px; font: inherit; font-size: 15px; }
.oglx-hero__note { margin: 14px 0 0; font-size: 13.5px; color: rgba(255,255,255,.75); }
.oglx-feats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.oglx-feat { background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; transition: transform .15s, box-shadow .15s; }
.oglx-feat:hover { transform: translateY(-3px); box-shadow: 0 16px 32px -18px rgba(10,37,64,.4); }
.oglx-feat img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.oglx-feat__body { padding: 16px 18px 18px; }
.oglx-feat__body h3 { margin: 0 0 7px; font-family: "Archivo", sans-serif; font-size: 17px; color: var(--navy); }
.oglx-feat__body p { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--muted); }
.oglx-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 34px; align-items: start; }
.oglx-grid__info > p { font-size: 15px; line-height: 1.65; color: var(--ink); }
.oglx-usps { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.oglx-usps li { position: relative; padding: 12px 14px 12px 40px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 10px; font-size: 14px; color: var(--ink); }
.oglx-usps li::before { content: "✓"; position: absolute; left: 14px; top: 11px; color: #1d6b34; font-weight: 800; }
.oglx-grid__form.offerwrap { margin: 0; }
@media (max-width: 900px) { .oglx-feats { grid-template-columns: 1fr; } .oglx-grid { grid-template-columns: 1fr; } }

/* ── Kontakt: dane lewo, formularz prawo ───────────────────────────────── */
.ktx { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 34px; align-items: start; }
.ktx__intro { font-size: 15px; line-height: 1.65; color: var(--ink); margin: 0 0 16px; }
.ktx__card { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 18px 20px; }
.ktx__card p { margin: 0 0 12px; font-size: 14.5px; line-height: 1.65; }
.ktx__card p:last-child { margin: 0; }
@media (max-width: 900px) { .ktx { grid-template-columns: 1fr; } }

/* ── Moje konto: growing-note + change password ────────────────────────── */
.account-growing { display: flex; gap: 14px; align-items: flex-start; background: linear-gradient(115deg, #eef4ff 0%, #f5f9ff 100%); border: 1px solid #d5e3ff; border-radius: 12px; padding: 16px 18px; margin: 22px 0; }
.account-growing span { font-size: 26px; line-height: 1; }
.account-growing p { margin: 0; font-size: 14px; line-height: 1.6; color: #33507a; }
.account-growing strong { color: var(--navy); }
.account-pass { margin: 26px 0; }
.account-pass__form { max-width: 380px; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 18px; }
.account-pass__label { display: block; font-weight: 600; font-size: .88rem; color: var(--navy); margin: 0 0 12px; }
.account-pass__label input { display: block; width: 100%; margin-top: 5px; padding: 9px 11px; border: 1px solid #cfd5db; border-radius: 8px; font: inherit; font-weight: 400; box-sizing: border-box; }
.account-pass__label input:focus { outline: 2px solid var(--navy); border-color: var(--navy); }
.account-pass__foot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.account-pass__status { font-size: 13px; }

/* ── Wszystkie kluby — searchable directory ────────────────────────────── */
.allclubs__bar { display: flex; align-items: center; gap: 16px; margin: 0 0 20px; }
.allclubs__search { flex: 1; max-width: 460px; padding: 11px 14px; border: 1px solid #cfd5db; border-radius: 10px; font: inherit; font-size: 15px; background: #fff; }
.allclubs__search:focus { outline: 2px solid var(--navy); border-color: var(--navy); }
.allclubs__count { font-size: 14px; color: var(--muted); white-space: nowrap; }
.allclubs__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
.allclubs__grid .clubrow { height: 100%; box-sizing: border-box; }
.allclubs__empty { color: var(--muted); font-size: 15px; padding: 26px 0; text-align: center; }
@media (max-width: 800px) { .allclubs__grid { grid-template-columns: 1fr; } .allclubs__bar { flex-wrap: wrap; } }
.clublist__all { margin-top: 12px; list-style: none; }

/* ── Komentarze pod artykułem (moderowane) ─────────────────────────────── */
.pcm { margin: 34px 0 8px; padding-top: 22px; border-top: 1px solid var(--line); }
.pcm__h { font-family: "Archivo", sans-serif; font-size: 20px; font-weight: 800; color: var(--navy); margin: 0 0 14px; }
.pcm__count { color: var(--muted); font-size: 15px; font-weight: 700; }
.pcm__item { padding: 12px 14px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 10px; margin-bottom: 10px; }
.pcm__meta { display: flex; gap: 10px; align-items: baseline; font-size: 13px; margin-bottom: 4px; }
.pcm__meta strong { color: var(--navy); }
.pcm__meta span { color: var(--muted); font-size: 12px; }
.pcm__text { margin: 0; font-size: 14px; line-height: 1.55; color: var(--ink); }
.pcm__empty { color: var(--muted); font-size: 14px; }
.pcm__form { margin-top: 18px; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 16px; }
.pcm__fh { font-family: "Archivo", sans-serif; font-size: 15px; font-weight: 800; color: var(--navy); margin: 0 0 10px; }
.pcm__in { display: block; width: 100%; padding: 9px 11px; border: 1px solid #cfd5db; border-radius: 8px; font: inherit; font-size: 14px; margin-bottom: 10px; box-sizing: border-box; }
.pcm__in:focus { outline: 2px solid var(--navy); border-color: var(--navy); }
.pcm__row { max-width: 320px; }
.pcm__as { font-size: 13px; color: var(--muted); margin: 0 0 12px; }
.pcm__as strong { color: var(--navy); }
.pcm__login { margin-top: 18px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 12px; padding: 18px 16px; }
.pcm__login .pcm__note { margin: 4px 0 12px; }
.pcm__hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.pcm__foot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.pcm__note { font-size: 12px; color: var(--muted); }
.pcm__msg { font-size: 13px; }
.pcm__msg--ok { color: #1d6b34; }
.pcm__msg--err { color: #c0392b; }

/* ── Wydarzenia: event browser — filter sidebar + row list ─────────────── */
.evb { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 28px; align-items: start; }
.evb__side { position: sticky; top: 90px; display: flex; flex-direction: column; gap: 16px; }
/* All filters live in ONE card; groups inside are separated by hairlines. */
.evb__card { background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.evb__group { padding: 14px 16px; }
.evb__group + .evb__group { border-top: 1px solid var(--line); }
.evb__h { margin: 0 0 8px; font-family: "Archivo", sans-serif; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--navy); }
.evb__search { width: 100%; height: 38px; padding: 8px 11px 8px 34px; border: 1px solid #cfd5db; border-radius: 8px; font: inherit; font-size: 13.5px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7c93' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") 11px 50% / 15px 15px no-repeat; }
.evb__search:focus { outline: 2px solid var(--navy); border-color: var(--navy); }
.evb__opt { display: flex; align-items: center; gap: 9px; width: 100%; text-align: left; border: 0; background: transparent; font: inherit; font-size: 13.5px; color: var(--ink); padding: 7px 10px; border-radius: 8px; cursor: pointer; transition: background .12s, color .12s; }
.evb__opt + .evb__opt { margin-top: 2px; }
.evb__opt::before { content: ""; flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; border: 2px solid #b9c4d2; transition: border-color .12s, background .12s; }
.evb__opt:hover { background: var(--bg-soft); color: var(--navy); }
.evb__opt:hover::before { border-color: var(--navy); }
.evb__opt.is-active { background: var(--navy); color: #fff; font-weight: 600; }
.evb__opt.is-active::before { border-color: rgba(255,255,255,.45); background: #fff; }
.evb__check { display: flex; gap: 8px; align-items: center; font-size: 14px; cursor: pointer; }
.evb__cta { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 14px; display: flex; flex-direction: column; gap: 8px; }
.evb__cta strong { font-family: "Archivo", sans-serif; font-size: 15px; color: var(--navy); }
.evb__cta span { font-size: 13px; color: var(--muted); line-height: 1.45; }
.evb__bar { display: flex; justify-content: space-between; align-items: center; margin: 0 0 14px; }
.evb__count { font-size: 14px; color: var(--muted); }
.evb__list { display: flex; flex-direction: column; gap: 12px; }
.evrow { display: grid; grid-template-columns: 220px minmax(0, 1fr) 168px; gap: 18px; background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; transition: transform .15s, box-shadow .15s, border-color .15s; }
.evrow:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -18px rgba(10,37,64,.4); border-color: #cfd8e3; }
.evrow[hidden] { display: none; }
.evrow__media { position: relative; display: block; min-height: 100%; background: var(--img-bg); }
.evrow__media img { width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 16 / 10; }
.evrow__ribbon { position: absolute; left: 0; top: 10px; background: var(--blue); color: #fff; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: 4px 10px; border-radius: 0 6px 6px 0; }
.evrow__body { padding: 14px 0; display: flex; flex-direction: column; justify-content: center; gap: 6px; min-width: 0; }
.evrow__title { margin: 0; font-family: "Archivo", sans-serif; font-size: 18px; font-weight: 800; line-height: 1.25; }
.evrow__title--sm { font-size: 16.5px; }
.evrow__title a { color: var(--navy); transition: color .12s; }
.evrow__title a:hover { color: var(--blue); }
.evrow__meta { margin: 0; display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--muted); }
.evrow__desc { margin: 0; font-size: 13.5px; color: var(--muted); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.evrow__aside { padding: 14px 16px 14px 0; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.evrow__date { display: flex; flex-direction: column; align-items: center; min-width: 48px; padding: 6px 10px 7px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 10px; font-size: 10px; font-weight: 700; letter-spacing: .06em; color: var(--muted); line-height: 1.05; }
.evrow__date strong { font-family: "Archivo", sans-serif; font-size: 20px; color: var(--navy); }
.evrow__dateto { font-size: 12px; color: var(--muted); }
.evrow__dateto strong { color: var(--navy); }
.evrow__cta { margin-top: auto; font-size: 12.5px; padding: 8px 13px; }
/* Compact chevron link — quiet outline CTA used in row asides. */
.evrow__go { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 700; color: var(--navy); background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 8px 13px; white-space: nowrap; transition: border-color .12s, background .12s; }
.evrow__go:hover { border-color: var(--navy); background: var(--bg-soft); }
.evrow__go svg { flex: 0 0 auto; }
.evb__empty { text-align: center; color: var(--muted); padding: 30px 0; }
/* Katalog firm / kluby rows: logo tile instead of a photo. */
.evrow.evrow--firm { grid-template-columns: 120px minmax(0, 1fr) auto; align-items: center; }
.evrow__media--logo { display: grid; place-items: center; align-self: stretch; padding: 14px; background: #fff; border-right: 1px solid var(--line); }
.evrow__media--logo img { width: auto; height: auto; max-width: 100%; max-height: 64px; aspect-ratio: auto; object-fit: contain; }
.evrow__aside--firm { justify-content: center; padding: 14px 16px; }
/* Katalog firm: short 1-line teaser + a company-data row (Adres/Telefon/E-mail/WWW).
   PREMIUM firms get the blue ribbon/badge + a clickable profile (button below). */
.evrow__desc--1 { -webkit-line-clamp: 1; }
.firm-premium { display: inline-block; vertical-align: middle; background: var(--blue); color: #fff; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: 2px 8px; border-radius: 5px; margin-left: 6px; }
/* Katalog rows: the four company-data values sit inline; PREMIUM firms get a
   compact round profile icon at the far right (kept narrow so the data still
   fits on one line). */
.firmrow__data { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 8px; }
.firmrow__d { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ink); }
.firmrow__d strong { color: var(--navy); font-weight: 700; }
.firmrow__d a { color: var(--ink); }
.firmrow__d a:hover { color: var(--blue); text-decoration: underline; }
.firmrow__ico { display: inline-flex; color: var(--blue); flex: 0 0 auto; }
.firmgo { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--navy); color: #fff; flex: 0 0 auto; transition: background .14s; }
.firmgo:hover { background: var(--blue); }
[data-firms] .evrow--firm .evrow__aside--firm { padding: 14px 16px 14px 6px; }
@media (max-width: 900px) { .evrow.evrow--firm { grid-template-columns: 96px minmax(0, 1fr) auto; } .evrow--firm .evrow__aside--firm { grid-column: auto; flex-direction: column; padding: 12px 14px 12px 0; } }
@media (max-width: 900px) {
  .evb { grid-template-columns: 1fr; }
  .evb__side { position: static; }
  .evrow { grid-template-columns: 150px 1fr; }
  .evrow__aside { grid-column: 1 / -1; flex-direction: row; align-items: center; padding: 0 16px 14px; }
  .evrow__cta { margin: 0 0 0 auto; }
}
@media (max-width: 520px) {
  .evrow { grid-template-columns: 1fr; gap: 0; }
  .evrow__body { padding: 14px 16px 4px; }
  .evrow__aside { padding: 10px 16px 14px; }
}

/* Wydarzenia: Dzis / Jutro / Za 2 dni containers */
.dayrow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.daybox { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 16px 16px 18px; box-shadow: 0 10px 26px -22px rgba(10,37,64,.45); }
.daybox__t { font-family: "Archivo", sans-serif; font-size: 16px; font-weight: 800; color: var(--navy); margin: 0 0 12px; display: flex; align-items: baseline; gap: 8px; }
.daybox__date { font-family: "Inter", sans-serif; font-size: 12.5px; font-weight: 600; color: var(--muted); }
.daybox__list { display: flex; flex-direction: column; gap: 12px; }
.daybox__list .evcard { flex: none; width: 100%; }
.daybox__empty { font-size: 13px; color: var(--faint); margin: 4px 0 0; }
@media (max-width: 860px) { .dayrow { grid-template-columns: 1fr; } }

/* ── Kluby żeglarskie (homepage): feed left · ads right ────────────────── */
.clubshome { display: grid; grid-template-columns: 1fr 300px; gap: 32px; align-items: start; }
.clubshome__feed { display: flex; flex-direction: column; gap: 16px; }
.clubshome__all { align-self: flex-start; }
.clubshome__ads { display: flex; flex-direction: column; gap: 14px; }
@media (max-width: 1000px) { .clubshome { grid-template-columns: 1fr; } }

/* ── Historia: selector cards + ad (left) · active-category grid (right) ── */
/* Both columns stretch to the same height; the ad under the category cards
   grows to fill the leftover space, so column 1 and 2 start AND end together. */
.hist { display: grid; grid-template-columns: 300px 1fr; gap: 32px; align-items: stretch; }
.hist__menu { display: flex; flex-direction: column; gap: 10px; }
.hist__menu .promospot__house.histad, .hist__menu .promospot__banner.histad, .hist__menu .promospot__custom.histad { flex: 1; display: flex; flex-direction: column; justify-content: center; }
.hist__panels { min-height: 0; }
.hist__panels .histpanel { height: 100%; align-content: start; }
.histtab { position: relative; text-align: left; border: 1px solid var(--line); background: #fff; border-radius: 12px; padding: 13px 38px 13px 15px; cursor: pointer; font: inherit; transition: border-color .15s, box-shadow .15s, background .15s; }
.histtab:hover { border-color: #b9c6d6; box-shadow: 0 4px 12px rgba(11,40,90,.08); }
.histtab.is-active { background: var(--navy); border-color: var(--navy); }
.histtab__t { display: block; font-family: "Archivo", sans-serif; font-size: 15px; font-weight: 800; color: var(--navy); }
.histtab__d { display: block; font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.histtab.is-active .histtab__t { color: #fff; }
.histtab.is-active .histtab__d { color: rgba(255,255,255,.72); }
.histtab__arr { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); color: var(--red); opacity: 0; transition: opacity .15s; }
.histtab.is-active .histtab__arr { opacity: 1; color: #fff; }
@media (max-width: 1000px) { .hist { grid-template-columns: 1fr; } .hist__menu { flex-direction: row; flex-wrap: wrap; } .histtab { flex: 1 1 45%; } }

.hero {
  padding: 30px 0 12px;
}
/* Tighten the gap between the hero (latest posts) and the wind-map section
   (overrides the section's inline padding-top). */
.section:has(.mapad) { padding-top: 14px !important; }
/* Bento hero: 4 equal columns. A big card spanning 3 cols × 2 rows (top-left),
   a row of 3 beneath it, a full-width row of 4 below, and Partnerzy in column 4
   (beside the big card + the row-of-3). */
.hero__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  align-items: stretch;
}
.herorow3 { grid-column: 1 / 4; grid-row: 3; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.herorow4 { grid-column: 1 / -1; grid-row: 4; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.herorow3 > .popcard .popcard__body, .herorow4 > .popcard .popcard__body { flex: 1 1 auto; }
.herobig {
  grid-column: 1 / 4; grid-row: 1 / 3; align-self: start;
  aspect-ratio: 16 / 9;                 /* clean landscape rectangle, not grid-stretched */
  position: relative; overflow: hidden; border-radius: 14px;
  display: flex; align-items: flex-end;
}
.herobig__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.herobig:hover .herobig__img { transform: scale(1.04); }
.herobig__scrim { position: absolute; inset: 0; background: linear-gradient(to top, rgba(6,20,40,.88) 0%, rgba(6,20,40,.2) 55%, rgba(6,20,40,0) 100%); }
.herobig__body { position: relative; padding: 24px 26px; color: #fff; display: flex; flex-direction: column; gap: 8px; }
.herobig__cat { font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #cfe0ff; }
.herobig__title { font-family: "Archivo", sans-serif; font-weight: 800; font-size: 32px; line-height: 1.12; max-width: 620px; }
.herobig__lead { font-size: 14.5px; color: rgba(255,255,255,.85); max-width: 560px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hero__grid > .hero-partners { grid-column: 4; grid-row: 1 / 4; }

/* Featured */
.feature {
  position: relative;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  min-height: 520px;
  border-radius: 14px;
  box-shadow: 0 22px 50px -28px rgba(10,37,64,.5);
}
.feature__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.feature__scrim {
  position: absolute; inset: 0;
  background: linear-gradient(105deg, rgba(8,22,40,.92) 0%, rgba(8,22,40,.7) 32%, rgba(8,22,40,.12) 70%, rgba(8,22,40,0) 100%);
}
.feature__body { position: relative; z-index: 1; padding: 50px 80px 46px; color: #fff; max-width: 660px; }
.feature__nav {
  position: absolute; top: 50%; z-index: 2;
  display: grid; place-items: center;
  width: 46px; height: 46px; padding: 0; cursor: pointer;
  border: 0; border-radius: 50%;
  background: rgba(8,22,40,.55); color: #fff;
  backdrop-filter: blur(3px);
  opacity: 0; transform: translateY(-50%) scale(.9);
  transition: opacity .2s ease, transform .2s ease, background .15s ease;
}
/* Reveal controls on hover or keyboard focus within the gallery */
.feature:hover .feature__nav,
.feature:focus-within .feature__nav { opacity: 1; transform: translateY(-50%) scale(1); }
.feature__nav:hover { background: var(--blue); }
.feature__nav:active { transform: translateY(-50%) scale(.92); }
.feature__nav:focus-visible { opacity: 1; }
.feature__nav svg { width: 20px; height: 20px; }
.feature__nav--prev { left: 18px; }
.feature__nav--next { right: 18px; }
/* On touch / no-hover devices keep them visible */
@media (hover: none) {
  .feature__nav { opacity: 1; transform: translateY(-50%) scale(1); }
}
.feature__meta { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
.feature__date { font-size: 12px; font-weight: 600; letter-spacing: .08em; color: rgba(255,255,255,.82); }
.feature__title {
  font-size: 44px;
  font-weight: 800;
  line-height: 1.03;
  letter-spacing: -.025em;
  margin: 0 0 18px;
  text-shadow: 0 2px 24px rgba(0,0,0,.25);
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
  min-height: 3.09em;
}
.feature__excerpt {
  font-size: 16px; line-height: 1.6; color: rgba(255,255,255,.86);
  margin: 0 0 28px; max-width: 480px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  min-height: 3.2em;
}
.feature__dots { display: flex; gap: 9px; margin-top: 30px; }
.feature__dots .dot {
  width: 9px; height: 9px; border-radius: 100px;
  background: rgba(255,255,255,.4);
  border: 0; padding: 0; cursor: pointer;
  transition: background .2s ease, width .2s ease;
}
.feature__dots .dot:hover { background: rgba(255,255,255,.7); }
.feature__dots .dot.is-active { background: #6699ff; width: 26px; }

/* ====================================================================
   SECTION SCAFFOLD
   ==================================================================== */
.section { padding: 66px 0 0; }
.section:last-of-type { padding-bottom: 0; }
/* Breathing room between the last content and the footer, on every page */
main { padding-bottom: 72px; flex: 1 0 auto; }
.footer { flex-shrink: 0; }
@media (max-width: 720px) { main { padding-bottom: 52px; } }
.head {
  font-size: 21px; font-weight: 800; letter-spacing: .01em;
  text-transform: uppercase; color: var(--navy);
  margin: 0 0 28px; padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
  position: relative;
}
.head::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 48px; height: 3px; background: var(--red); }
.head--row { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.head__t {
  font-family: "Archivo", sans-serif;
  font-size: 19px; font-weight: 800; letter-spacing: .01em;
  text-transform: uppercase; color: var(--navy); margin: 0;
}
.head--row { padding-bottom: 14px; border-bottom: 1px solid var(--line); position: relative; margin-bottom: 22px; }
.head--row::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 48px; height: 3px; background: var(--red); }

/* ---------- Najważniejsze cards (editorial) ---------- */
.topgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; align-items: start; }
.tcard {
  display: flex; flex-direction: column;
  background: var(--bg);
  border: 1px solid var(--line);
  transition: transform .2s ease, border-color .18s, box-shadow .18s;
}
.tcard:hover { transform: translateY(-4px); border-color: #cfd8e3; box-shadow: 0 18px 36px -22px rgba(10,37,64,.5); }
.tcard__title { transition: color .15s ease; }
.tcard__media { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: var(--img-bg); }
.tcard__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease; }
.tcard:hover .tcard__media img { transform: scale(1.06); }
.tcard__cat {
  display: block; margin: 16px 18px 0;
  font-size: 11px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: var(--red);
}
.tcard__title {
  font-family: "Archivo", sans-serif; font-size: 16px; font-weight: 700;
  line-height: 1.3; color: var(--navy); margin: 8px 18px 0; flex: 1;
}
.tcard:hover .tcard__title { color: var(--blue); }
.tcard__date {
  display: block; margin: 12px 18px 16px;
  font-size: 12px; color: var(--muted);
  padding-top: 12px; border-top: 1px solid var(--line);
}

/* ---------- Hover reveal (excerpt + "czytaj dalej") on content cards ---------- */
.tcard, .popcard { position: relative; }
.card-reveal {
  position: absolute; inset: 0; z-index: 3; overflow: hidden;
  display: flex; flex-direction: column;
  padding: 20px; gap: 12px;
  background: var(--bg);
  opacity: 0; visibility: hidden;
  transform: translateY(10px);
  transition: opacity .3s ease, transform .4s cubic-bezier(.22,.61,.36,1), visibility .4s;
}
.tcard:hover .card-reveal,
.popcard:hover .card-reveal { opacity: 1; visibility: visible; transform: translateY(0); }
/* Title, excerpt and CTA slide up + fade in with a gentle stagger */
.card-reveal__title {
  font-family: "Archivo", sans-serif; font-weight: 700; font-size: 16px;
  line-height: 1.3; color: var(--navy);
  opacity: 0; transform: translateY(12px);
  transition: opacity .35s ease .04s, transform .45s cubic-bezier(.22,.61,.36,1) .04s;
}
.tcard:hover .card-reveal__title,
.popcard:hover .card-reveal__title { opacity: 1; transform: translateY(0); }
.popcard .card-reveal__title { font-size: 15px; }
/* Never let the overlay overflow its card: title clamps, excerpt is clamped
   dynamically by nav.js to the lines that fit the remaining space. */
.card-reveal__title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.popcard:not(.popcard--lead) .card-reveal__title { -webkit-line-clamp: 2; }
.card-reveal__text { min-height: 0; }
.card-reveal__text {
  flex: 1; font-size: 13.5px; line-height: 1.55; color: var(--muted);
  opacity: 0; transform: translateY(12px);
  transition: opacity .35s ease .12s, transform .45s cubic-bezier(.22,.61,.36,1) .12s;
}
.tcard:hover .card-reveal__text,
.popcard:hover .card-reveal__text { opacity: 1; transform: translateY(0); }
.card-reveal__more {
  color: var(--blue); font-weight: 700; font-size: 11px;
  letter-spacing: .05em; text-transform: uppercase;
  opacity: 0; transform: translateY(12px);
  transition: opacity .35s ease .2s, transform .45s cubic-bezier(.22,.61,.36,1) .2s;
}
.tcard:hover .card-reveal__more,
.popcard:hover .card-reveal__more { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
  .card-reveal, .card-reveal__title, .card-reveal__text, .card-reveal__more { transition: none !important; transform: none !important; }
}

/* ---------- Projekty i serwisy ---------- */
.services {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  background: linear-gradient(180deg, #f7f9fc, #f1f5f9);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 20px 0;
}
.service {
  text-align: center;
  padding: 26px 30px 24px;
  position: relative;
}
.service + .service::before {
  content: ""; position: absolute; left: 0; top: 24px; bottom: 24px;
  width: 1px; background: var(--line);
}
.service__icon {
  width: 76px; height: 76px; padding: 17px;
  margin: 0 auto 20px; display: block;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 50%;
  stroke: var(--navy);
  box-shadow: 0 6px 16px -8px rgba(10,37,64,.2);
  transition: background .18s, transform .18s, box-shadow .18s, stroke .18s;
}
.service:hover .service__icon {
  background: var(--navy);
  stroke: #fff;
  transform: translateY(-3px);
  box-shadow: 0 14px 26px -10px rgba(10,37,64,.4);
}
.service h3 { font-size: 15px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--navy); margin: 0 0 10px; }
.service p { font-size: 13.5px; color: var(--muted); margin: 0 0 16px; line-height: 1.5; }
.service .redlink { font-size: 11.5px; }

/* ====================================================================
   WIDEO + KALENDARZ
   ==================================================================== */
.media { display: grid; grid-template-columns: 1fr 420px; gap: 48px; align-items: start; }

/* Play buttons */
.playbtn {
  display: grid; place-items: center;
  width: 30px; height: 30px; border-radius: 50%;
  background: rgba(23,115,214,.92); color: #fff;
}
.playbtn svg { width: 14px; height: 14px; margin-left: 1px; }
.playbtn--lg { width: 64px; height: 64px; }
.playbtn--lg svg { width: 26px; height: 26px; }

.vfeature {
  position: relative; display: block;
  border-radius: 10px; overflow: hidden;
  height: 340px; margin-bottom: 18px;
  box-shadow: 0 14px 30px -18px rgba(10,37,64,.45);
}
.vfeature img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.vfeature:hover img { transform: scale(1.04); }
.vfeature__scrim { position: absolute; inset: 0; background: linear-gradient(to top, rgba(7,20,36,.85), rgba(7,20,36,.05) 60%); }
.vfeature .playbtn--lg { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.vfeature:hover .playbtn--lg { background: var(--red); }
.vfeature__title { position: absolute; left: 22px; bottom: 20px; z-index: 1; color: #fff; font-weight: 700; font-size: 18px; max-width: 70%; }
.vfeature__dur { position: absolute; right: 16px; bottom: 16px; z-index: 1; background: rgba(7,20,36,.8); color: #fff; font-size: 12px; font-weight: 600; padding: 3px 8px; border-radius: 3px; }

.vlist { list-style: none; margin: 0; padding: 0; }
.vrow { display: flex; gap: 14px; padding: 13px 0; border-bottom: 1px solid var(--line); align-items: center; }
.vlist li:last-child .vrow { border-bottom: 0; }
.vrow__thumb { position: relative; flex: 0 0 100px; height: 62px; border-radius: 6px; overflow: hidden; }
.vrow__thumb img { width: 100%; height: 100%; object-fit: cover; }
.vrow__thumb .playbtn { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 26px; height: 26px; }
.vrow__txt { display: flex; flex-direction: column; gap: 5px; }
.vrow__head { font-size: 14px; font-weight: 600; color: var(--ink); line-height: 1.32; }
.vrow:hover .vrow__head { color: var(--red); }
.vrow__dur { font-size: 11.5px; color: var(--faint); font-weight: 600; }

/* Calendar */
.events { list-style: none; margin: 0; padding: 0; }
.event { display: flex; align-items: center; gap: 18px; padding: 15px 4px; border-bottom: 1px solid var(--line); }
.events li:last-child .event { border-bottom: 0; }
.event__date {
  flex: 0 0 auto; width: 44px; text-align: center;
  display: flex; flex-direction: column; line-height: 1;
}
.event__date strong { font-family: "Archivo", sans-serif; font-size: 26px; font-weight: 800; color: var(--red); }
.event__date small { font-size: 10px; font-weight: 700; letter-spacing: .08em; color: var(--muted); margin-top: 3px; }
.event__txt { flex: 1; display: flex; flex-direction: column; gap: 3px; }
.event__head { font-size: 14.5px; font-weight: 600; color: var(--ink); line-height: 1.3; }
.event:hover .event__head { color: var(--red); }
.event__loc { font-size: 12.5px; color: var(--muted); }
.event__arr { color: var(--red); font-size: 18px; transition: transform .15s; }
.event:hover .event__arr { transform: translateX(4px); }

/* Events view toggle (Lista / Kalendarz) */
.eventview { display: inline-flex; gap: 4px; margin-bottom: 18px; padding: 4px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 999px; }
.eventview__btn { border: 0; background: transparent; cursor: pointer; font-family: inherit; font-size: 13px; font-weight: 700; color: var(--muted); padding: 7px 18px; border-radius: 999px; transition: background .15s, color .15s; }
.eventview__btn:hover { color: var(--navy); }
.eventview__btn.is-active { background: var(--navy); color: #fff; }

/* Calendar (month grid) */
.eventcal__month { margin-bottom: 26px; }
.eventcal__mhead { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 2px 12px; }
.eventcal__title { font-family: "Archivo", sans-serif; font-size: 19px; font-weight: 800; color: var(--navy); margin: 0; }
.eventcal__count { font-size: 12px; font-weight: 700; color: var(--blue); background: #eaf2fc; padding: 3px 10px; border-radius: 999px; white-space: nowrap; }
.eventcal__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.eventcal__dow { background: var(--navy); padding: 9px 4px; text-align: center; font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: rgba(255,255,255,.85); }
.eventcal__dow.is-weekend { color: #9fc0e8; }
.eventcal__cell { background: #fff; min-height: 92px; padding: 7px 7px 9px; display: flex; flex-direction: column; gap: 4px; transition: background .14s; }
.eventcal__cell--we { background: #fbfcfe; }
.eventcal__cell--blank { background: repeating-linear-gradient(135deg, #f6f8fb, #f6f8fb 6px, #f1f4f8 6px, #f1f4f8 12px); }
.eventcal__cell--has:hover { background: #f3f8ff; }
.eventcal__num { font-size: 12px; font-weight: 700; color: var(--faint); width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; }
.eventcal__cell--has .eventcal__num { color: var(--navy); }
.eventcal__cell.is-today .eventcal__num { background: var(--red); color: #fff; border-radius: 50%; box-shadow: 0 2px 6px rgba(192,57,43,.4); }
.eventcal__ev { display: flex; align-items: center; gap: 6px; font-size: 11.5px; line-height: 1.2; font-weight: 600; color: var(--navy); background: #eaf2fc; border-radius: 6px; padding: 4px 7px; text-decoration: none; transition: background .15s, color .15s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eventcal__ev:hover { background: var(--blue); color: #fff; }
.eventcal__ev:hover .eventcal__dot { background: #fff; }
.eventcal__ev.is-feat { background: var(--navy); color: #fff; }
.eventcal__dot { flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%; background: var(--blue); }
.eventcal__ev.is-feat .eventcal__dot, .eventcal__dot.is-feat { background: #f0b429; }
.eventcal__more { font-size: 10.5px; font-weight: 700; color: var(--muted); padding-left: 3px; }
.eventcal__legend { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 6px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 12px; color: var(--muted); }
.eventcal__legend > span { display: inline-flex; align-items: center; gap: 7px; }
.eventcal__todaykey { width: 13px; height: 13px; border-radius: 50%; background: var(--red); }
.eventcal__empty { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; padding: 34px 16px; color: var(--muted); }
.eventcal__empty svg { color: var(--faint); }
.eventcal__empty p { margin: 0; }
@media (max-width: 560px) {
  .eventcal__cell { min-height: 62px; padding: 4px; }
  .eventcal__ev { font-size: 0; gap: 0; padding: 3px; justify-content: center; }
  .eventcal__ev .eventcal__dot { width: 8px; height: 8px; }
  .eventcal__more { font-size: 9px; text-align: center; }
}
@media (max-width: 620px) {
  .eventcal__cell { min-height: 60px; padding: 4px; }
  .eventcal__dow { font-size: 9.5px; padding: 6px 2px; }
  .eventcal__num { font-size: 11px; }
  .eventcal__ev { font-size: 9.5px; padding: 2px 4px; border-radius: 4px; }
}

/* Hero partners — a white "legend" card: stacked logo wall + a become-a-partner CTA */
.hero-partners {
  position: relative;
  display: flex; flex-direction: column;
  min-height: 560px;
  border: 1px solid var(--line);
  border-radius: 0;
  background: #fff;
  padding: 22px 20px 18px;
}
.hero-partners__title {
  margin: 0 0 4px;
  font-family: "Archivo", sans-serif;
  font-size: 13px; font-weight: 800; letter-spacing: .12em;
  text-transform: uppercase; color: var(--blue);
}
.hero-partners__intro { margin: 0 0 4px; font-size: 12.5px; line-height: 1.45; color: var(--muted); }
.hero-partners__logos {
  flex: 1; display: grid; grid-template-columns: repeat(2, 1fr); grid-auto-rows: 1fr;
  gap: 1px; background: var(--line); border: 1px solid var(--line);
}
.hero-partners .partner-card {
  min-height: 78px;
  display: grid; place-items: center; padding: 12px;
  border: 0; border-radius: 0; box-shadow: none; background: #fff;
  transition: background .18s;
}
.hero-partners .partner-card:hover { transform: none; box-shadow: none; background: var(--bg-soft); }
.hero-partners .partner-card img {
  max-height: 54px; max-width: 86%; width: auto; object-fit: contain;
  opacity: .9; transition: opacity .25s ease, transform .25s ease;
}
.hero-partners .partner-card:hover img { opacity: 1; transform: scale(1.05); }
.hero-partners__join { margin-top: 12px; padding-top: 14px; border-top: 1px solid var(--line); }
.hero-partners__join-q { display: block; font-size: 12px; color: var(--muted); margin-bottom: 6px; }
.hero-partners__cta {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  font-size: 11.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  color: var(--blue); transition: gap .15s, color .15s;
}
.hero-partners__cta:hover { gap: 11px; color: var(--navy); }
.hero-partners__cta .arr { transition: transform .15s; }
.hero-partners__cta:hover .arr { transform: translateX(3px); }
@media (prefers-reduced-motion: reduce) {
  .hero-partners .partner-card img, .hero-partners__cta, .hero-partners__cta .arr { transition: none; }
}

/* ====================================================================
   PARTNERZY I PROJEKTY (logo wall)
   ==================================================================== */
.partners-section--join { padding-top: 16px; }
.partners-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.partner-card {
  display: grid;
  place-items: center;
  min-height: 150px;
  padding: 28px 36px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(10,37,64,.05);
  transition: border-color .18s, box-shadow .18s, transform .18s;
}
.partner-card:hover {
  border-color: #cdd9e6;
  box-shadow: 0 16px 34px -18px rgba(10,37,64,.28);
  transform: translateY(-4px);
}
.partner-card img {
  max-width: 100%;
  max-height: 92px;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}
@media (max-width: 640px) {
  .partners-row { grid-template-columns: 1fr; }
}
/* Logo wall: many partners (e.g. 12) in a denser responsive grid */
.partners-row--wall { grid-template-columns: repeat(4, 1fr); gap: 14px; }
.partners-row--wall .partner-card { min-height: 116px; padding: 20px 24px; }
.partners-row--wall .partner-card img { max-height: 64px; }
@media (max-width: 900px) { .partners-row--wall { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .partners-row--wall { grid-template-columns: repeat(2, 1fr); } }

/* ====================================================================
   CAROUSEL (custom component)
   ==================================================================== */
.carousel { padding: 8px 0 4px; }
.carousel__stage { display: flex; align-items: center; gap: 14px; }
.carousel__arrow {
  flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%;
  border: 1px solid var(--line); background: #fff; cursor: pointer;
  display: grid; place-items: center; color: var(--navy);
  box-shadow: 0 2px 6px rgba(10,37,64,.08);
  transition: background .15s, color .15s, border-color .15s, box-shadow .15s, opacity .15s, transform .1s;
}
.carousel__arrow svg { width: 20px; height: 20px; }
.carousel__arrow:hover { background: var(--navy); color: #fff; border-color: var(--navy); box-shadow: 0 8px 18px -8px rgba(10,37,64,.4); }
.carousel__arrow:active { transform: scale(.94); }
.carousel__arrow:disabled { opacity: .35; cursor: default; box-shadow: none; }
.carousel__arrow:disabled:hover { background: #fff; color: var(--navy); border-color: var(--line); }

.carousel__viewport { flex: 1; overflow: hidden; touch-action: pan-y; cursor: grab; }
.carousel__viewport.is-dragging { cursor: grabbing; }
.carousel__track {
  display: flex; gap: 16px; margin: 0; padding: 6px 2px; list-style: none;
  will-change: transform; user-select: none;
}
.carousel__slide { flex: 0 0 auto; box-sizing: border-box; }

.plogo {
  width: 100%; height: 100%;
  display: grid; place-items: center; text-align: center;
  min-height: 92px; padding: 18px 14px;
  background: #fff; border: 1px solid var(--line); border-radius: 12px;
  color: #8a98a8;
  font-family: "Archivo", sans-serif; font-weight: 700; font-size: 14px;
  line-height: 1.25; letter-spacing: .01em;
  box-shadow: 0 1px 2px rgba(10,37,64,.04);
  transition: color .18s, border-color .18s, box-shadow .18s, transform .18s;
}
.carousel__slide:hover .plogo { color: var(--navy); border-color: #cdd9e6; box-shadow: 0 12px 24px -14px rgba(10,37,64,.28); transform: translateY(-3px); }

.carousel__dots { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 22px; min-height: 10px; }
.carousel__dot {
  width: 8px; height: 8px; padding: 0; border: 0; cursor: pointer;
  border-radius: 999px; background: #cdd5df;
  transition: width .2s ease, background .2s ease;
}
.carousel__dot:hover { background: #9aa7b8; }
.carousel__dot.is-active { width: 24px; background: var(--navy); }
.carousel__dots:empty { display: none; }

/* ====================================================================
   NEWSLETTER BAND
   ==================================================================== */
.nlband { background: var(--navy); color: #fff; margin-top: 60px; }
.nlband__inner {
  display: flex; align-items: center; gap: 40px;
  padding: 40px 0; flex-wrap: wrap;
}
.nlband__text { flex: 1 1 260px; }
.nlband__text h2 { font-size: 22px; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; margin: 0 0 8px; }
.nlband__text p { margin: 0; color: rgba(255,255,255,.72); font-size: 14px; max-width: 320px; }
.nlband__form { display: flex; flex: 0 0 auto; }
.nlband__form input {
  height: 50px; width: 300px; border: 0; padding: 0 18px;
  font-size: 14px; outline: none; color: var(--ink);
  border-radius: 2px 0 0 2px;
}
.nlband__form button {
  height: 50px; padding: 0 26px; border: 0; cursor: pointer;
  background: var(--red); color: #fff; font-weight: 700;
  font-size: 12px; letter-spacing: .07em; text-transform: uppercase;
  border-radius: 0 2px 2px 0; transition: background .15s;
}
.nlband__form button:hover { background: var(--red-dark); }
.nlband__follow { display: flex; align-items: center; gap: 16px; }
.nlband__followlabel { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: rgba(255,255,255,.8); }
.nlband__social { display: flex; gap: 10px; }
.nlband__social a {
  width: 38px; height: 38px; border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(255,255,255,.1); color: #fff; transition: background .15s;
}
.nlband__social a:hover { background: var(--red); }
.nlband__social svg { width: 17px; height: 17px; }

/* ====================================================================
   FOOTER
   ==================================================================== */
/* Faint sailing photo behind the footer — kept very light so the white accent stays */
.footer {
  background:
    linear-gradient(180deg, rgba(245,247,250,.96) 0%, rgba(245,247,250,.9) 100%),
    url("img/footer-sailing.jpg") center / cover no-repeat;
  color: var(--muted); border-top: 1px solid var(--line);
}

/* Brand + link columns + newsletter signup */
.footer__top {
  /* 5 children in one line: brand + Serwis + Wiadomości + Informacje + newsletter/zgłoś temat */
  display: grid; grid-template-columns: 1.35fr .8fr .8fr .85fr 1.25fr; align-items: start; gap: 40px 36px;
  padding: 48px 0 38px;
}
.footer__brand { max-width: 360px; }
.footer__col { display: flex; flex-direction: column; gap: 11px; }
.footer__col-h { font-family: "Archivo", sans-serif; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--navy); margin: 0 0 5px; }
.footer__col a { font-size: 14px; color: var(--muted); transition: color .15s, padding-left .15s; }
.footer__col a:hover { color: var(--blue); }
.footer__brandlink { display: inline-block; margin-bottom: 16px; }
.footer__logo { height: 48px; width: auto; display: block; }
.footer__tagline { font-size: 14px; line-height: 1.6; color: var(--muted); margin: 0 0 18px; }
.footer__social { display: flex; gap: 10px; }
.footer__social a {
  width: 38px; height: 38px; display: grid; place-items: center;
  background: var(--bg); border: 1px solid var(--line); color: var(--navy);
  transition: background .15s, color .15s, border-color .15s;
}
.footer__social a:hover { background: var(--blue); border-color: var(--blue); color: #fff; }
.footer__social svg { width: 17px; height: 17px; }

.footer__signup { flex: 0 1 420px; }
.footer__signup h4 {
  font-family: "Archivo", sans-serif; font-size: 17px; font-weight: 800;
  color: var(--navy); margin: 0 0 6px;
}
.footer__signup p { font-size: 14px; line-height: 1.55; color: var(--muted); margin: 0 0 14px; }
.footer__news { display: flex; max-width: 420px; }
.footer__news input {
  flex: 1; min-width: 0; height: 48px; border: 1px solid var(--line); border-right: 0;
  padding: 0 14px; font-size: 14px; font-family: inherit; color: var(--ink); background: var(--bg); outline: none;
}
.footer__news input:focus { border-color: var(--blue); }
.footer__news button {
  height: 48px; padding: 0 22px; flex: 0 0 auto; border: 0; cursor: pointer; font-family: inherit;
  background: var(--navy); color: #fff; font-weight: 700; font-size: 12px;
  letter-spacing: .06em; text-transform: uppercase; transition: background .15s;
}
.footer__news button:hover { background: var(--navy-deep); }

.footer__base {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 16px 0; border-top: 1px solid var(--line); font-size: 12.5px; color: var(--faint);
}
.footer__legal { display: flex; flex-wrap: wrap; gap: 18px; }
.footer__legal a { color: var(--muted); transition: color .15s; }
.footer__legal a:hover { color: var(--navy); }
/* Footer columns: collapse to 2-up (brand + signup full-width), then single column */
@media (max-width: 920px) {
  .footer__top { grid-template-columns: 1fr 1fr 1fr; gap: 30px 36px; }
  .footer__brand, .footer__signup { grid-column: 1 / -1; max-width: none; }
}
@media (max-width: 560px) {
  .footer__top { grid-template-columns: 1fr; gap: 26px; }
  .footer__base { flex-direction: column; align-items: flex-start; }
}

/* ====================================================================
   WIREFRAME BLOCKS (ad banner, popularne+najnowsze, charter)
   ==================================================================== */
/* Media placeholders — colored panels behind imagery so cards render
   cleanly even when a photo is missing; broken <img> is hidden via .is-broken */
img.is-broken { display: none; }
.feature { background: var(--img-bg); }
.vfeature { background: var(--img-bg); }
.vrow__thumb { background: linear-gradient(135deg, #3a5a8c, #071c33); }

/* Placeholder thumbnails — render offline, no external images */
.ph-ship { width: 38%; height: auto; color: rgba(255,255,255,.85); }
.ph-ship--sm { display: inline-flex; }
.ph-ship--sm svg { width: 30px; height: 30px; color: rgba(255,255,255,.9); }

/* Na czasie — info tiles */
.infotiles { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.infotile {
  display: flex; flex-direction: column; gap: 10px;
  padding: 18px 18px 16px; min-height: 150px;
  background: var(--bg); border: 1px solid var(--line);
  border-top: 3px solid var(--blue); border-radius: var(--radius);
  transition: transform .15s, box-shadow .15s, border-color .15s;
}
.infotile:hover { box-shadow: 0 16px 32px -18px rgba(10,37,64,.4); border-color: #cfd8e3; }
.infotile__cat {
  font-size: 10px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--blue);
}
.infotile__head {
  font-family: "Archivo", sans-serif; font-size: 15px; font-weight: 700;
  line-height: 1.3; color: var(--ink); flex: 1;
}
.infotile:hover .infotile__head { color: var(--navy); }
.infotile__foot {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 12px; color: var(--muted);
}
.infotile__foot .arr { color: var(--red); font-size: 16px; transition: transform .15s; }
.infotile:hover .infotile__foot .arr { transform: translateX(4px); }

/* Two-column layout: main + side */
/* 2x2 grid so the right column's rows align with the left: row 1 = lead post |
   Najnowsze(+button); row 2 = the 2-4 card rows | 4 ads. Shared row tracks keep
   "Zobacz wszystkie" level with the lead post's bottom, and the 4 ads level with
   the 2-4 card section. */
.dual { display: grid; grid-template-columns: 1fr 340px; column-gap: 30px; row-gap: 30px; align-items: stretch; }
.dual__lead { grid-column: 1; grid-row: 1; }
.dual__news { grid-column: 2; grid-row: 1; display: flex; flex-direction: column; }
.dual__news .newswidget__all { margin-top: auto; }
.dual__rest { grid-column: 1; grid-row: 2; }
.dual__ads { grid-column: 2; grid-row: 2; display: grid; grid-template-rows: repeat(4, 1fr); gap: 14px; }
.dual__ads .promospot__house--sm { height: 100%; justify-content: center; padding: 14px 16px; gap: 3px; }
.dual__ads .promospot__house--sm .promospot__label { margin-bottom: 2px; }
.dual__ads .promospot__house--sm strong { font-size: 15px; }
/* Popularne — a lead post (full width) above two half-width posts */
.popgrid--lead > .popcard--lead { grid-column: 1 / -1; }
.popcard--lead .popcard__thumb { aspect-ratio: 21 / 9; }
.popcard--lead .popcard__head { font-size: 19px; }
.popcard--lead .popcard__body { padding: 16px 18px 20px; }
/* Najnowsze — eight standalone mini cards */
.sidecards { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.sidecard { display: flex; gap: 12px; align-items: center; padding: 8px; background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius); transition: transform .15s, box-shadow .15s, border-color .15s; }
.sidecard:hover { transform: translateY(-2px); box-shadow: 0 12px 24px -16px rgba(10,37,64,.4); border-color: #cfd8e3; }
.sidecard__thumb { flex: 0 0 64px; height: 48px; border-radius: 4px; overflow: hidden; background: linear-gradient(135deg, #3a5a8c, #071c33); }
.sidecard__thumb img { width: 100%; height: 100%; object-fit: cover; }
.sidecard__txt { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.sidecard__date { font-size: 10.5px; font-weight: 700; letter-spacing: .04em; color: var(--blue); }
.sidecard__head { font-family: "Archivo", sans-serif; font-size: 13px; font-weight: 700; line-height: 1.25; color: var(--navy); }
.sidecard:hover .sidecard__head { color: var(--blue); }
.dual--rev { grid-template-columns: 340px 1fr; }
.dual--rev .dual__side { order: -1; }

/* Popularne grid of cards */
.popgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; align-items: start; }
/* Popularne "rest" row: 2 medium (span 2) + 4 small (span 1) under the lead */
.popgrid--rest { grid-template-columns: repeat(4, 1fr); align-items: stretch; }
.popgrid--rest > .popcard:nth-child(1), .popgrid--rest > .popcard:nth-child(2) { grid-column: span 2; }
/* equal-height cards: body fills so every card finishes at the same height even when titles wrap to a different number of lines */
.popgrid--rest .popcard__body { flex: 1 1 auto; }
@media (max-width: 1180px) {
  .popgrid--rest { grid-template-columns: 1fr 1fr; }
  .popgrid--rest > .popcard:nth-child(1), .popgrid--rest > .popcard:nth-child(2) { grid-column: auto; }
}
@media (max-width: 560px) { .popgrid--rest { grid-template-columns: 1fr; } }
.popcard {
  display: flex; flex-direction: column; background: var(--bg);
  border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden;
  transition: transform .2s ease, box-shadow .15s, border-color .15s;
}
.popcard:hover { transform: translateY(-4px); box-shadow: 0 16px 32px -18px rgba(10,37,64,.45); border-color: #cfd8e3; }
.popcard__head { transition: color .15s ease; }
.popcard__thumb { aspect-ratio: 16 / 9; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.popcard__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.popcard:hover .popcard__thumb img { transform: scale(1.05); }
.popcard__thumb--a { background: var(--img-bg); }
.popcard__thumb--b { background: var(--img-bg); }
.popcard__thumb--c { background: linear-gradient(135deg, #3a5a8c, #071c33); }
.popcard__thumb--d { background: linear-gradient(135deg, #4a78b5, #1b3a6b); }
.popcard__body { padding: 14px 16px 18px; display: flex; flex-direction: column; gap: 7px; }
.popcard__date { font-size: 11px; font-weight: 700; letter-spacing: .06em; color: var(--blue); }
.popcard__head { font-family: "Archivo", sans-serif; font-size: 15px; font-weight: 700; line-height: 1.3; color: var(--ink); }
.popcard:hover .popcard__head { color: var(--navy); }
/* Hero-card category tag + author·read meta: desktop keeps the date+title look,
   so these are hidden here and only surface in the mobile news-feed layout. */
.popcard__cat, .popcard__meta { display: none; }

/* Najnowsze widget (light card) */
.newswidget {
  background: var(--bg-soft); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 20px 20px 22px;
  display: flex; flex-direction: column;
}
.newswidget__list { list-style: none; margin: 0 0 16px; padding: 0; }
.nwrow { display: flex; flex-direction: column; gap: 4px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.newswidget__list li:last-child .nwrow { border-bottom: 0; }
.nwrow__date { font-size: 11px; font-weight: 700; letter-spacing: .06em; color: var(--blue); }
.nwrow__head { font-size: 14px; font-weight: 600; line-height: 1.34; color: var(--ink); transition: color .15s; }
.nwrow:hover .nwrow__head { color: var(--red); }
/* Partner kategorii — make the placeholder read clearly as an ad space. */
#promo-category-partner { margin: 0 0 18px; }

/* Category pages: partner banner, top pagination, mobile-interleaved ads */
.galnav-top .galnav { margin: 20px 0 4px; }
.cardgrid .catad-m { display: none !important; }   /* mobile-only interleave */
.catads-side { display: flex; flex-direction: column; gap: 14px; margin-top: 18px; }
/* When the ads sit ABOVE the Najpopularniejsze widget (reklama-first order). */
.catads-side--top { margin-top: 0; margin-bottom: 30px; }
/* Sidebar Partners = the homepage hero-partners card, 1:1 (no overrides that
   would change the logo-wall proportions) — just a gap before the widget. */
.post__side .hero-partners { margin-bottom: 30px; }
/* Najpopularniejsze: plain rectangle to match. */
.post__side .newswidget { background: #fff; border: 1px solid var(--line); border-radius: 0; padding: 18px; box-shadow: none; }
@media (max-width: 860px) {
  .cardgrid .catad-m { display: flex !important; }
  .catads-side { display: none; }
  .post__side .hero-partners { display: none; }
}

/* Footer: Zgłoś temat under the newsletter */
.footer__tip { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); }
.footer__tip p { font-size: 14px; line-height: 1.55; color: var(--muted); margin: 0 0 12px; }
.footer__tipbtn { display: inline-flex; align-items: center; gap: 8px; height: 48px; padding: 0 22px; background: var(--navy); color: #fff; font-weight: 700; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; font-family: inherit; transition: background .15s; }
.footer__tipbtn:hover { background: var(--navy-deep); color: #fff; }

/* Publish hour on cards: right-aligned in the same lane as the date. */
.popcard__date, .tcard__date, .sidecard__date, .nwrow__date { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.cardtime { font-weight: 600; letter-spacing: 0; color: var(--faint); }
.newswidget__all { width: 100%; border-color: rgba(10,37,64,.25); color: var(--navy); }
.newswidget__all:hover { background: var(--navy); border-color: var(--navy); color: #fff; }

/* Charter jachtów grid */
.charter-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
/* The top-right cell holds two stacked offers, splitting it horizontally to match the promo height */
.charter-stack { grid-column: 3; grid-row: 1; display: grid; grid-template-rows: 1fr 1fr; gap: 22px; min-width: 0; }
.charter-stack .charter-offer { min-height: 0; }
.charter-promo {
  grid-column: 1 / 3; grid-row: 1; min-height: 260px;
  border-radius: var(--radius); overflow: hidden; position: relative;
  display: flex; align-items: flex-end;
  background: var(--img-bg);
}
.charter-promo__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.charter-promo__scrim { position: absolute; inset: 0; background: linear-gradient(105deg, rgba(7,20,36,.92) 0%, rgba(7,20,36,.7) 40%, rgba(7,20,36,.15) 100%); }
.charter-promo__body { position: relative; z-index: 1; padding: 34px 36px 36px; color: #fff; max-width: 540px; }
.charter-promo__head { font-size: 30px; font-weight: 800; line-height: 1.1; margin: 14px 0 12px; }
.charter-promo__txt { color: rgba(255,255,255,.85); font-size: 15px; margin: 0 0 22px; }
.charter-offer {
  position: relative; min-height: 150px; border-radius: var(--radius); overflow: hidden;
  display: flex; align-items: flex-end;
  background: linear-gradient(135deg, #3a5a8c, #071c33);
  transition: transform .15s, box-shadow .15s;
}
.charter-offer:hover { box-shadow: 0 18px 34px -18px rgba(10,37,64,.5); }
.charter-offer__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.charter-offer:hover .charter-offer__img { transform: scale(1.05); }
.charter-offer__scrim { position: absolute; inset: 0; background: linear-gradient(to top, rgba(7,20,36,.9) 6%, rgba(7,20,36,.35) 55%, rgba(7,20,36,.05) 100%); }
.charter-offer__body { position: relative; z-index: 1; padding: 16px 18px 16px; color: #fff; }
.charter-offer__head { display: block; font-family: "Archivo", sans-serif; font-weight: 700; font-size: 17px; }
.charter-offer__price { display: block; font-size: 13px; color: rgba(255,255,255,.82); margin-top: 2px; }

/* ====================================================================
   ARTICLE PAGE
   ==================================================================== */
.article { padding: 28px 0 8px; }
.crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; color: var(--muted); margin-bottom: 26px; }
.crumbs a { color: var(--blue); }
.crumbs a:hover { text-decoration: underline; }
.crumbs__sep { color: var(--faint); }
.crumbs [aria-current="page"] { color: var(--ink); font-weight: 600; }

.article__grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 40px; align-items: start; }

.post__head { margin-bottom: 26px; }
.post__title { font-size: 40px; font-weight: 800; line-height: 1.08; letter-spacing: -.02em; color: var(--navy); margin: 14px 0 16px; }
.post__lead { font-size: 19px; line-height: 1.6; color: #37434f; margin: 0 0 22px; }

/* Byline: author + date on the left, share icons on the right, single row */
.post__byline {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 12px 20px;
  padding-bottom: 20px; margin-bottom: 26px;
  border-bottom: 1px solid var(--line);
}
.post__meta { display: flex; align-items: center; gap: 12px; min-width: 0; }
.post__avatar {
  flex: 0 0 auto; display: grid; place-items: center; width: 42px; height: 42px;
  border-radius: 50%; background: var(--navy); color: #fff; font-size: 13px; font-weight: 800; letter-spacing: .02em;
  overflow: hidden;
}
.post__avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }
.post__by { display: flex; flex-direction: column; gap: 1px; min-width: 0; line-height: 1.25; }
.post__by [data-post-author] { font-family: "Archivo", "Inter", sans-serif; font-size: 15px; font-weight: 700; color: var(--navy); }
.post__by [data-post-author] a { color: inherit; text-decoration: none; }
.post__by [data-post-author] a:hover { color: var(--blue); text-decoration: underline; }
.post__pub { font-size: 13px; color: var(--muted); }
/* Secondary byline credit (co-author / source), muted, on its own line. */
.post__source { font-size: 12.5px; color: var(--muted); }
.post__dot { color: var(--faint); margin: 0 7px; }

.post__media { margin: 0 0 28px; border-radius: 12px; overflow: hidden; background: var(--img-bg); }
.post__media img { width: 100%; height: auto; display: block; aspect-ratio: 16 / 9; object-fit: cover; }
.post__media figcaption { font-size: 12.5px; color: var(--muted); padding: 10px 14px; background: var(--bg-soft); }

.post__body { font-size: 16.5px; line-height: 1.75; color: var(--ink); }
.post__body p { margin: 0 0 20px; }
.post__body h2 { font-size: 24px; font-weight: 800; color: var(--navy); margin: 34px 0 14px; }
.post__body blockquote {
  margin: 26px 0; padding: 6px 0 6px 22px;
  border-left: 4px solid var(--blue);
  font-size: 19px; line-height: 1.5; font-weight: 600; color: var(--navy);
}

.post__tags { display: flex; flex-wrap: wrap; gap: 10px; margin: 30px 0 26px; }
.chip { font-size: 13px; font-weight: 600; color: var(--blue); padding: 7px 14px; border: 1px solid var(--line); border-radius: 100px; transition: background .15s, border-color .15s; }
.chip:hover { background: var(--bg-soft); border-color: #cdd9e6; }
.post__back { font-weight: 700; }

.post__side { position: sticky; top: 96px; align-self: start; }
/* Category/author pages: sidebar scrolls with the page (not sticky). */
.post__side--cat { position: static; }
.popgrid--4 { grid-template-columns: repeat(4, 1fr); }

/* Post image gallery (top of article) — 1 lead + 3 thumbs (3rd = "show more") */
.post__gallery { margin: 0 0 28px; }
.pgal__lead { display: block; overflow: hidden; background: var(--img-bg); }
.pgal__lead img { width: 100%; height: auto; display: block; aspect-ratio: 16 / 9; object-fit: cover; transition: transform .5s ease; }
.pgal__lead:hover img { transform: scale(1.03); }
.pgal__thumbs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 10px; }
.pgal__thumb { position: relative; display: block; overflow: hidden; background: var(--img-bg); }
.pgal__thumb img { width: 100%; height: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; transition: transform .5s ease; }
.pgal__thumb:hover img { transform: scale(1.05); }
.pgal__more::after { content: ""; position: absolute; inset: 0; background: rgba(7,20,36,.62); }
.pgal__more-badge {
  position: absolute; inset: 0; z-index: 1; display: grid; place-items: center;
  color: #fff; font-family: "Archivo", sans-serif; font-weight: 800; font-size: 22px;
}
.post__gallery figcaption { font-size: 12.5px; color: var(--muted); padding: 10px 2px 0; }
.post__gallery figcaption a { color: var(--blue); }
.post__gallery figcaption a:hover { text-decoration: underline; }

/* ====================================================================
   GALLERY SUBPAGE (galeria*.html) — 3 photos per page, paginated
   ==================================================================== */
.galpage { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.galfig { margin: 0; overflow: hidden; background: var(--img-bg); }
.galfig--wide { grid-column: 1 / -1; }
.galfig img { width: 100%; height: auto; display: block; aspect-ratio: 16 / 9; object-fit: cover; }
.galfig figcaption { font-size: 13px; color: var(--muted); padding: 10px 2px 0; background: var(--bg); }
.galnav {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  margin: 26px 0 6px; padding-bottom: 20px; border-bottom: 1px solid var(--line);
}
.galnav__btn {
  display: inline-flex; align-items: center; gap: 8px; height: 46px; padding: 0 20px;
  background: var(--navy); color: #fff; font-weight: 700; font-size: 12px;
  letter-spacing: .06em; text-transform: uppercase; transition: background .15s;
}
.galnav__btn:hover { background: var(--navy-deep); }
.galnav__btn--ghost { background: transparent; color: var(--navy); border: 1px solid var(--line); }
.galnav__btn--ghost:hover { background: var(--bg-soft); }
.galnav__btn[aria-disabled="true"] { opacity: .4; pointer-events: none; }
.galnav__pos { font-size: 13px; font-weight: 600; color: var(--muted); }

/* ====================================================================
   INLINE EXPANDING SEARCH (header) — the pill stretches into a field
   ==================================================================== */
/* The slot reserves the pill's closed footprint so nothing reflows;
   the pill itself expands rightward (absolutely) and OVERLAPS Zaloguj. */
/* The slot only reserves the closed-search footprint in flow; the .searchx
   itself is positioned against .masthead__actions so it can expand right to
   cover the whole auth area (login button / user pill) at any pill width. */
.searchx-slot { flex: 0 0 auto; width: 156px; height: 42px; }
.searchx {
  position: absolute; left: 0; top: 0; z-index: 6;
  display: flex; align-items: center; width: 156px; height: 42px;
  padding: 0 16px; border-radius: 999px; overflow: hidden;
  background: #fff; color: #004488; cursor: pointer;
  box-shadow: 0 2px 6px rgba(11,40,90,.18);
  transition: width .34s cubic-bezier(.22,.61,.36,1), box-shadow .15s;
}
.searchx__text { pointer-events: none; }
.searchx__ico--close { display: none; }
.site-header.is-search-open .searchx__ico--search { display: none; }
.site-header.is-search-open .searchx__ico--close { display: block; }
.site-header.is-search-open .searchx { cursor: default; }
.site-header.is-search-open .searchx__input { cursor: text; }
.searchx__btn {
  display: grid; place-items: center; flex: 0 0 auto;
  border: 0; padding: 0; background: none; color: inherit; cursor: pointer;
}
.searchx__text { margin-left: 8px; font-size: 13.5px; font-weight: 600; white-space: nowrap; }
.searchx__input {
  flex: 1; width: 0; min-width: 0; opacity: 0; margin-left: 8px;
  border: 0; background: transparent; color: var(--ink);
  font-size: 14px; font-family: inherit; outline: none;
  transition: opacity .2s ease .1s;
}
.site-header.is-search-open .searchx { width: 100%; box-shadow: 0 8px 22px -8px rgba(11,40,90,.4); }
.site-header.is-search-open .searchx__text { display: none; }
.site-header.is-search-open .searchx__input { opacity: 1; }
/* Keep the auth control (login button / user pill) the same footprint so the
   header — and the search beside it — never shift between logged-out/in. */
@media (min-width: 861px) {
  .authbox { min-width: 110px; justify-content: flex-end; }
  .login-btn { min-width: 110px; }
  .usermenu__btn { min-width: 110px; justify-content: space-between; }
}

/* Newsletter inline confirmation */
.nlband__thanks { margin: 0; color: var(--navy); font-weight: 600; font-size: 15px; }

/* ---- Sports newsletter: alerts about new tournaments / regattas ---- */
.sportnews {
  display: flex; align-items: center; gap: 26px;
  padding: 28px 32px; border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(245,247,250,.94) 0%, rgba(245,247,250,.9) 100%),
    url("img/footer-sailing.jpg") center / cover no-repeat;
  color: var(--ink); border: 1px solid var(--line);
  box-shadow: 0 12px 32px -24px rgba(10, 37, 64, .35);
}
.sportnews__icon {
  flex: 0 0 auto; width: 60px; height: 60px; display: grid; place-items: center;
  border-radius: 16px; background: var(--navy); color: #fff;
}
.sportnews__icon svg { width: 30px; height: 30px; }
.sportnews__body { flex: 1 1 auto; min-width: 0; }
.sportnews__kicker { display: inline-block; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--blue); margin-bottom: 6px; }
.sportnews__title { font-family: "Archivo", "Inter", sans-serif; font-size: 23px; font-weight: 800; letter-spacing: -.01em; margin: 0 0 8px; color: var(--navy); }
.sportnews__sub { font-size: 14.5px; line-height: 1.55; color: var(--muted); margin: 0 0 16px; max-width: 64ch; }
.sportnews__sub strong { color: var(--navy); font-weight: 700; }
.sportnews__form { display: flex; flex-wrap: wrap; gap: 10px; }
.sportnews__form input[type=email] {
  flex: 1 1 240px; min-width: 0; height: 48px; padding: 0 18px; border: 1px solid var(--line); border-radius: 999px;
  background: #fff; color: var(--ink); font-family: inherit; font-size: 14.5px;
}
.sportnews__form input[type=email]::placeholder { color: #8a97a6; }
.sportnews__form input[type=email]:focus { outline: 2px solid var(--blue); outline-offset: 1px; border-color: var(--blue); }
.sportnews__form button {
  flex: 0 0 auto; height: 48px; padding: 0 24px; border: 0; border-radius: 999px;
  background: var(--navy); color: #fff; font-family: inherit; font-weight: 700; font-size: 14px;
  cursor: pointer; white-space: nowrap; transition: background .15s, transform .05s;
}
.sportnews__form button:hover { background: var(--navy-deep); }
.sportnews__form button:active { transform: translateY(1px); }
.sportnews__note { font-size: 12px; color: var(--muted); margin: 12px 0 0; }
.sportnews__note a { color: var(--blue); text-decoration: underline; }
.sportnews .nlband__thanks { color: var(--navy); font-size: 15.5px; }
@media (max-width: 640px) {
  .sportnews { flex-direction: column; align-items: flex-start; gap: 16px; padding: 22px 20px; }
  .sportnews__form { width: 100%; }
  .sportnews__form input[type=email], .sportnews__form button { flex: 1 1 100%; width: 100%; }
}
.drawer__login {
  margin-top: 14px; border: 0; cursor: pointer; font-family: inherit;
  background: var(--red); color: #fff; font-weight: 700; font-size: 13px;
  letter-spacing: .05em; text-transform: uppercase; padding: 12px 18px; text-align: center;
}

/* ====================================================================
   NAJCZĘŚCIEJ CZYTANE — numbered list
   ==================================================================== */
/* Najczęściej czytane — five ranked cards with thumbnails */
.rankgrid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 22px; }
.rankcard {
  display: flex; flex-direction: column; background: var(--bg);
  border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden;
  transition: transform .2s ease, box-shadow .15s, border-color .15s;
}
.rankcard:hover { transform: translateY(-4px); box-shadow: 0 16px 32px -18px rgba(10,37,64,.45); border-color: #cfd8e3; }
.rankcard__media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: linear-gradient(135deg, #3a5a8c, #071c33); }
.rankcard__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.rankcard:hover .rankcard__media img { transform: scale(1.05); }
.rankcard__media::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, rgba(7,20,36,.66), rgba(7,20,36,0) 48%); }
.rankcard__num { position: absolute; left: 10px; bottom: 2px; z-index: 2; font-family: "Archivo", sans-serif; font-size: 46px; font-weight: 800; line-height: 1; color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.55); }
.rankcard__body { padding: 12px 14px 16px; display: flex; flex-direction: column; gap: 5px; }
.rankcard__cat { font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--red); }
.rankcard__title { font-family: "Archivo", sans-serif; font-size: 14px; font-weight: 700; line-height: 1.3; color: var(--navy); transition: color .15s; }
.rankcard:hover .rankcard__title { color: var(--blue); }
@media (max-width: 900px) { .rankgrid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .rankgrid { grid-template-columns: 1fr 1fr; } }
.toprow { display: flex; align-items: center; gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.toprow__num { font-family: "Archivo", sans-serif; font-size: 32px; font-weight: 800; color: #cfd8e3; min-width: 30px; text-align: center; transition: color .15s; }
.toprow:hover .toprow__num { color: var(--red); }
.toprow__txt { display: flex; flex-direction: column; gap: 3px; }
.toprow__cat { font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--red); }
.toprow__head { font-family: "Archivo", sans-serif; font-size: 15px; font-weight: 700; line-height: 1.3; color: var(--navy); }
.toprow:hover .toprow__head { color: var(--blue); }

/* ====================================================================
   PAGE HEAD (listing/category/shop/etc.)
   ==================================================================== */
/* Subpage header: light (no navy band), title FIRST then breadcrumbs. */
.pagehead { background: transparent; color: var(--ink); padding: 28px 0 4px; }
.pagehead + section, .pagehead + .section { padding-top: 22px; }
.pagehead .crumbs { color: var(--muted); margin: 10px 0 0; }
.pagehead .crumbs a { color: var(--muted); }
.pagehead .crumbs a:hover { color: var(--navy); }
.pagehead .crumbs [aria-current="page"] { color: var(--navy); }
.pagehead__title { font-size: 36px; font-weight: 800; letter-spacing: -.02em; margin: 0; color: var(--navy); }
.pagehead__sub { margin: 8px 0 0; color: var(--muted); font-size: 15px; }
/* Light header — transparent so the page's blue glow shows through (category/author pages) */
.pagehead--light { background: transparent; color: var(--ink); }
.pagehead--light .crumbs { color: var(--muted); }
.pagehead--light .crumbs a { color: var(--muted); }
.pagehead--light .crumbs a:hover { color: var(--navy); }
.pagehead--light .crumbs [aria-current="page"] { color: var(--navy); }
.pagehead--light .pagehead__title { color: var(--navy); }
/* Category pages: breadcrumb-only compact header (title kept for SEO but hidden,
   filler subtitle removed) so content sits right under the breadcrumb */
.pagehead--mini { padding: 14px 0 4px; }
.pagehead--mini .crumbs { margin-bottom: 0; }
.pagehead--mini .pagehead__sub { display: none; }
.pagehead--mini .pagehead__title { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.pagehead--light .pagehead__sub { color: var(--muted); }

/* Filter bar */
.filterbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 26px; }
.filterchip {
  padding: 9px 16px; border: 1px solid var(--line); background: var(--bg); cursor: pointer;
  font-family: inherit; font-size: 13px; font-weight: 600; color: var(--muted); transition: all .15s;
}
.filterchip:hover { border-color: #cdd9e6; color: var(--navy); }
.filterchip.is-active { background: var(--navy); border-color: var(--navy); color: #fff; }

/* Auto card grid (listing / shop / catalog) */
.cardgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 24px; align-items: start; }
/* Two half-width category sections side by side (Znani i nieznani + Opowieści z Kubryku) */
.homeduo { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.homeduo .cardgrid--2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 860px) { .homeduo { grid-template-columns: 1fr; gap: 28px; } }
/* Horizontal carousel (homepage Regaty) */
.hcarousel { position: relative; }
.hcarousel__track { display: flex; gap: 22px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding-bottom: 6px; -webkit-overflow-scrolling: touch; }
.hcarousel__track::-webkit-scrollbar { height: 8px; }
.hcarousel__track::-webkit-scrollbar-thumb { background: var(--line); border-radius: 999px; }
.hcarousel__track > .popcard { flex: 0 0 300px; scroll-snap-align: start; }
.hcarousel__nav { position: absolute; top: 42%; transform: translateY(-50%); z-index: 2; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line); background: #fff; color: var(--navy); font-size: 22px; line-height: 1; cursor: pointer; display: grid; place-items: center; box-shadow: 0 6px 18px -8px rgba(10,37,64,.4); transition: background .15s, color .15s; }
.hcarousel__nav:hover { background: var(--navy); color: #fff; border-color: var(--navy); }
.hcarousel__nav--prev { left: -8px; }
.hcarousel__nav--next { right: -8px; }
@media (max-width: 640px) { .hcarousel__nav { display: none !important; } .hcarousel__track > .popcard { flex-basis: 80%; } }

/* ====================================================================
   CATALOG (katalog firm)
   ==================================================================== */
.firm-card { display: flex; gap: 16px; align-items: center; padding: 18px; background: var(--bg); border: 1px solid var(--line); transition: transform .15s, box-shadow .15s, border-color .15s; }
.firm-card:hover { box-shadow: 0 16px 32px -18px rgba(10,37,64,.4); border-color: #cfd8e3; }
.firm-card__logo { flex: 0 0 72px; width: 72px; height: 72px; display: grid; place-items: center; background: var(--bg-soft); border: 1px solid var(--line); }
.firm-card__logo img { max-width: 80%; max-height: 80%; object-fit: contain; }
.firm-card__body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.firm-card__name { font-family: "Archivo", sans-serif; font-size: 16px; font-weight: 700; color: var(--navy); }
.firm-card__cat { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--red); }
.firm-card__loc { font-size: 13px; color: var(--muted); }

/* ====================================================================
   CLASSIFIEDS (ogłoszenia)
   ==================================================================== */
.adlist { display: flex; flex-direction: column; gap: 14px; }
.adrow { display: flex; background: var(--bg); border: 1px solid var(--line); overflow: hidden; transition: box-shadow .15s, border-color .15s; }
.adrow:hover { box-shadow: 0 14px 28px -18px rgba(10,37,64,.4); border-color: #cfd8e3; }
.adrow__thumb { flex: 0 0 200px; aspect-ratio: 4 / 3; overflow: hidden; background: var(--img-bg); }
.adrow__thumb img { width: 100%; height: 100%; object-fit: cover; }
.adrow__body { flex: 1; padding: 16px 18px; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.adrow__cat { font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--blue); }
.adrow__title { font-family: "Archivo", sans-serif; font-size: 17px; font-weight: 700; color: var(--navy); line-height: 1.25; }
.adrow__price { font-family: "Archivo", sans-serif; font-size: 19px; font-weight: 800; color: var(--red); margin-top: auto; }
.adrow__loc { font-size: 13px; color: var(--muted); }

/* ====================================================================
   SHARP DIRECTION — square corners + footer accent
   ==================================================================== */
.feature, .partner-card, .hero-partners .partner-card,
.tcard, .tcard__media, .popcard, .popcard__thumb, .newswidget,
.infotile, .charter-promo, .charter-offer, .notice,
.services, .service__icon, .post__media, .vfeature, .vrow__thumb,
.mega-card__media, .btn, .tag, .chip,
.firm-card, .firm-card__logo, .adrow, .filterchip,
.nlband__form input, .nlband__form button { border-radius: 0; }

/* Square service icon tiles (was a circle) */
.service__icon { background: var(--bg-soft); }
.service:hover .service__icon { background: var(--navy); }


/* ====================================================================
   RESPONSIVE
   ==================================================================== */
@media (max-width: 1080px) {
  .media { grid-template-columns: 1fr; }
}
@media (max-width: 980px) {
  .dual, .dual--rev { grid-template-columns: 1fr; }
  .dual--rev .dual__side { order: 0; }
  /* stack: Popularne (lead + rest), then Najnowsze, then ads */
  .dual__lead, .dual__news, .dual__rest, .dual__ads { grid-column: 1; grid-row: auto; }
  .dual__lead { order: 1; } .dual__rest { order: 2; } .dual__news { order: 3; } .dual__ads { order: 4; }
  .dual__news .newswidget__all { margin-top: 16px; }
  .dual__ads { grid-template-rows: none; }
  .dual__ads .promospot__house--sm { height: auto; }
  .article__grid { grid-template-columns: 1fr; gap: 32px; }
  .post__side { position: static; }
}
@media (max-width: 900px) {
  /* minmax(0,…) so an inner popcard row's min-content can't inflate the single
     mobile column and blow the page out horizontally. */
  .hero__grid { grid-template-columns: minmax(0, 1fr); }
  .herobig, .hero__grid > .hero-partners, .herorow3, .herorow4 { grid-column: auto; grid-row: auto; }
  /* aspect-ratio + min-height together make the browser derive width from height
     (300*16/9 = 533px) and overflow the column — drop the ratio on mobile so the
     card just fills the cell width. */
  .herobig { aspect-ratio: auto; width: 100%; min-height: 240px; }
  .herorow3, .herorow4 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .topgrid { grid-template-columns: 1fr 1fr; }
  .charter-grid { grid-template-columns: 1fr 1fr; }
  .charter-promo { grid-column: 1 / 3; }
  .charter-stack { display: contents; }
  .charter-stack .charter-offer { min-height: 150px; }
  .infotiles { grid-template-columns: repeat(3, 1fr); }
  .popgrid--4 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .services { grid-template-columns: 1fr 1fr; gap: 24px 0; }
  .service:nth-child(3)::before, .service + .service::before { display: none; }
  .nlband__inner { flex-direction: column; align-items: flex-start; gap: 24px; }
  .nlband__form { width: 100%; }
  .nlband__form input { flex: 1; width: auto; min-width: 0; }
}
@media (max-width: 520px) {
  .topgrid { grid-template-columns: 1fr; }
  .herorow3 { grid-template-columns: 1fr; }
  .herorow4 { grid-template-columns: 1fr; }
  .popgrid { grid-template-columns: 1fr; }
  .charter-grid { grid-template-columns: 1fr; }
  .charter-promo { grid-column: 1; }
  .infotiles { grid-template-columns: 1fr 1fr; }
  .popgrid--4 { grid-template-columns: 1fr; }
  .post__title { font-size: 30px; }
  .services { grid-template-columns: 1fr; }
  .feature__title { font-size: 30px; }
  .feature__body { padding: 30px 24px 64px; }
  .feature__nav { top: auto; bottom: 16px; transform: none; }
  .feature:hover .feature__nav, .feature:focus-within .feature__nav { transform: none; }
  .feature__nav--prev { left: auto; right: 74px; }
  .notice { flex-wrap: wrap; }
  .notice__cta { order: 3; }
  .footer__top { gap: 28px; padding: 32px 0 28px; }
}
/* ─── Mobile homepage = news feed ──────────────────────────────────────────
   On phones EVERY homepage post section (hero + Sport/Rejsy/Historia) reads as
   one scannable feed: horizontal rows — thumbnail on the left, category tag +
   headline + "author · reading time" on the right — à la a mobile news app.
   The big lead card stays on top. Placed after the ≤520 rules so it wins on
   order; popgrid--3's own ≤720/≤600 column rules are reconciled below. */
@media (max-width: 600px) {
  .hero { margin-top: 4px; }
  .hero__grid { gap: 0; }
  .herobig { margin-bottom: 20px; min-height: 210px; }
  .herobig__title { font-size: 25px; line-height: 1.14; }
  .herobig__body { padding: 20px 18px; }
  .herobig__lead { -webkit-line-clamp: 2; }

  /* every homepage post grid → a single stacked feed */
  .herorow3, .herorow4, .popgrid--3, .popgrid--4 { grid-template-columns: 1fr; gap: 0; }
  .heropop {
    flex-direction: row; align-items: flex-start; gap: 13px;
    background: transparent; border: 0; border-bottom: 1px solid var(--line);
    border-radius: 0; padding: 15px 0; overflow: visible;
  }
  .herorow3 .heropop:first-child { padding-top: 2px; }
  .popgrid--3 .heropop:last-child, .popgrid--4 .heropop:last-child, .herorow4 .heropop:last-child { border-bottom: 0; }
  .heropop:hover { transform: none; box-shadow: none; border-color: var(--line); }
  .heropop:active { background: var(--bg-soft); }

  /* thumbnail, left */
  .heropop .popcard__thumb {
    flex: 0 0 116px; width: 116px; aspect-ratio: 4 / 3;
    border-radius: 10px; position: relative;
  }
  .heropop:hover .popcard__thumb img { transform: none; }
  .heropop .popcard__cat {
    display: inline-block; position: absolute; left: 0; bottom: 0; max-width: 100%;
    background: rgba(9,25,48,.9); color: #fff;
    font-size: 9px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase;
    padding: 3px 7px 2px; border-radius: 0 7px 0 0;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }

  /* text column, right */
  .heropop .popcard__body {
    flex: 1 1 auto; min-width: 0; padding: 0; gap: 6px; justify-content: center;
  }
  .heropop .popcard__date { display: none; }
  .heropop .popcard__head {
    font-size: 15.5px; line-height: 1.26; font-weight: 700; color: var(--ink);
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
  }
  .heropop .popcard__meta {
    display: block; font-size: 12px; font-weight: 500; letter-spacing: 0; color: var(--muted);
  }
}

/* ====================================================================
   PRODUCTION UI — filters, toast, cookie consent, a11y, forms
   ==================================================================== */

/* Generic hide for JS-toggled elements */
[hidden] { display: none !important; }

/* Solid fill for a bare .btn (404 button, contact submit, consent) */
.btn:not(.btn--white):not(.btn--outline):not(.btn--ghost) {
  background: var(--navy); color: #fff; border: 0; cursor: pointer; font-family: inherit;
}
.btn:not(.btn--white):not(.btn--outline):not(.btn--ghost):hover { background: var(--navy-deep); }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn--ghost {
  background: #fff; color: var(--navy); border: 1.5px solid var(--line);
  cursor: pointer; font-family: inherit;
}
.btn--ghost:hover { border-color: #cdd9e6; background: var(--bg-soft); }

/* Skip-to-content link (a11y) */
.skip-link {
  position: fixed; top: -120px; left: 16px; z-index: 1000;
  background: var(--navy); color: #fff; padding: 12px 18px;
  font-weight: 700; font-size: 14px; transition: top .18s ease;
}
.skip-link:focus { top: 16px; }

/* Filter empty-state */
.filter-empty {
  padding: 40px 0; color: var(--muted); font-size: 15px; text-align: center;
  border: 1px dashed var(--line); background: var(--bg-soft); margin-top: 4px;
}

/* ---------- Toast ---------- */
.toast {
  position: fixed; left: 50%; bottom: 28px; transform: translate(-50%, 24px);
  background: var(--navy); color: #fff; padding: 14px 22px; font-size: 14px; font-weight: 600;
  box-shadow: 0 18px 40px -16px rgba(10,37,64,.6); z-index: 300; opacity: 0;
  pointer-events: none; transition: opacity .22s ease, transform .22s ease; max-width: 90vw; text-align: center;
}
.toast.is-show { opacity: 1; transform: translate(-50%, 0); }

/* ---------- Cookie consent ---------- */
.consent {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 260;
  background: var(--navy); color: #fff; box-shadow: 0 -10px 30px -12px rgba(0,0,0,.45);
}
.consent__inner { display: flex; align-items: center; gap: 22px; padding: 16px 0; flex-wrap: wrap; }
.consent__txt { margin: 0; font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,.9); flex: 1; min-width: 260px; }
.consent__txt a { color: #9fc2ff; text-decoration: underline; }
.consent__actions { display: flex; gap: 10px; flex-shrink: 0; }
.consent .btn { padding: 11px 18px; font-size: 11px; }

/* ---------- Contact form ---------- */
.contactform { display: flex; flex-direction: column; gap: 16px; max-width: 560px; margin-top: 8px; }
.contactform label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600; color: var(--navy); }
.contactform input, .contactform textarea {
  font-family: inherit; font-size: 15px; color: var(--ink); padding: 12px 14px;
  border: 1px solid var(--line); background: #fff; width: 100%;
}
.contactform input:focus, .contactform textarea:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(47,108,176,.15); }
.contactform textarea { resize: vertical; }
.contactform .btn { align-self: flex-start; }

@media (max-width: 560px) {
  .consent__actions { width: 100%; }
  .consent .btn { flex: 1; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .toast, .consent, .skip-link { transition: none !important; }
}

/* ====================================================================
   AUTH — header user menu, login/register modal, account page
   ==================================================================== */
.authbox { display: inline-flex; align-items: center; }

/* ---- header user menu ---- */
.usermenu { position: relative; display: inline-flex; }
.usermenu__btn {
  display: inline-flex; align-items: center; gap: 6px; height: 42px; padding: 0 10px 0 6px;
  border: 0; cursor: pointer; font-family: inherit; color: #fff; font-size: 13.5px; font-weight: 600;
  background: #004488; box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); border-radius: 999px;
  transition: background .15s; max-width: 220px;
}
.usermenu__btn:hover { background: #003a75; }
.usermenu__avatar {
  flex: 0 0 auto; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 999px;
  background: var(--blue); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .02em;
}
.usermenu__name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 130px; }
/* "Zalogowany" status label */
.usermenu__status {
  display: inline-flex; align-items: center; white-space: nowrap;
  font-size: 12.5px; font-weight: 600; letter-spacing: .01em;
}
.usermenu__chev { flex: 0 0 auto; opacity: .8; }
.usermenu__panel {
  position: absolute; top: calc(100% + 10px); right: 0; width: 240px; background: #fff; color: var(--ink);
  border: 1px solid var(--line); box-shadow: 0 24px 48px -20px rgba(10,37,64,.45); z-index: 240; padding: 8px;
}
.usermenu__head { padding: 10px 12px 12px; border-bottom: 1px solid var(--line); margin-bottom: 6px; display: flex; flex-direction: column; gap: 2px; }
.usermenu__head-name { font-family: "Archivo", sans-serif; font-weight: 700; color: var(--navy); font-size: 14px; }
.usermenu__head-mail { font-size: 12px; color: var(--muted); word-break: break-all; }
.usermenu__item {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; text-align: left;
  padding: 10px 12px; border: 0; background: transparent;
  cursor: pointer; font-family: inherit; font-size: 14px; color: var(--navy); border-radius: 0;
}
.usermenu__item:hover { background: var(--bg-soft); }
.usermenu__item--club { color: var(--blue); font-weight: 600; }
.usermenu__item--logout { color: var(--red); font-weight: 600; }
.usermenu__count { display: inline-grid; place-items: center; min-width: 20px; height: 18px; padding: 0 6px; border-radius: 999px; background: var(--blue); color: #fff; font-size: 11px; font-weight: 800; }
.usermenu__count:empty { display: none; }

/* Article favourite button */
/* Favourites toggle — icon button that lives in the share group, next to the link icon */
.post__fav { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0; margin: 0 0 0 12px; border: 1px solid var(--line); border-radius: 50%; background: #fff; cursor: pointer; font-family: inherit; color: var(--navy); transition: color .15s, border-color .15s, background .15s; }
/* Divider separating the like button from the share cluster */
.post__fav::before { content: ""; position: absolute; left: -11px; top: 50%; transform: translateY(-50%); width: 1px; height: 20px; background: var(--line); }
/* Outline heart by default; turns red on hover; fills red (with a pop) when liked */
.post__fav-ico { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; flex: 0 0 auto; transition: transform .15s ease; }
.post__fav:hover { border-color: #e7bcba; background: #fff6f5; color: var(--danger); }
.post__fav:active .post__fav-ico { transform: scale(.85); }
.post__fav.is-fav { border-color: var(--danger); background: #fdeceb; color: var(--danger); }
.post__fav.is-fav .post__fav-ico { fill: currentColor; animation: favpop .34s ease; }
@keyframes favpop { 0% { transform: scale(.5); } 45% { transform: scale(1.28); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .post__fav-ico { animation: none !important; transition: none; } }
.post__fav [data-fav-label] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Account favourites list */
.account-favs { margin-top: 40px; }
.account-favs .head { max-width: 560px; }
.favlist { list-style: none; margin: 0; padding: 0; max-width: 560px; }
.favrow { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid var(--line); background: #fff; }
.favrow + .favrow { border-top: 0; }
.favrow__link { font-family: "Archivo", sans-serif; font-weight: 700; color: var(--navy); }
.favrow__link:hover { color: var(--blue); }
.favrow__rm { flex: 0 0 auto; border: 0; background: transparent; cursor: pointer; font-size: 22px; line-height: 1; color: var(--muted); padding: 0 4px; }
.favrow__rm:hover { color: var(--red); }
.favempty { color: var(--muted); margin-top: 14px; max-width: 560px; }

/* ---- drawer auth ---- */
.drawer__authbox { display: flex; flex-direction: column; gap: 4px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.drawer__user { display: flex; align-items: center; gap: 10px; padding: 6px 12px 10px; }
.drawer__user-avatar { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 999px; background: var(--blue); color: #fff; font-size: 12px; font-weight: 800; }
.drawer__user-name { font-weight: 700; color: var(--navy); }
.drawer__authlink { padding: 12px; border-radius: 10px; font-family: "Signika", "Inter", sans-serif; font-size: 15px; font-weight: 600; color: var(--navy); }
.drawer__authlink:hover { background: var(--bg-soft); }
.drawer__login { margin-top: 6px; color: #fff; justify-content: center; }

/* ---- modal ---- */
.authmodal { position: fixed; inset: 0; z-index: 400; display: grid; place-items: center; padding: 20px; }
.authmodal__backdrop { position: fixed; inset: 0; background: rgba(8,18,32,.55); backdrop-filter: blur(2px); }
.authmodal__dialog {
  position: relative; z-index: 1; width: 100%; max-width: 430px; background: #fff; border: 1px solid var(--line);
  box-shadow: 0 40px 90px -28px rgba(10,37,64,.55); padding: 30px; max-height: 92vh; overflow-y: auto;
  animation: authpop .18s ease;
}
@keyframes authpop { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }
.authmodal__x {
  position: absolute; top: 14px; right: 14px; width: 34px; height: 34px; border: 0; background: transparent;
  cursor: pointer; font-size: 26px; line-height: 1; color: var(--faint); border-radius: 999px;
}
.authmodal__x:hover { background: var(--bg-soft); color: var(--navy); }
.authmodal__tabs { display: flex; gap: 4px; background: var(--bg-soft); padding: 4px; margin-bottom: 22px; }
.authmodal__tab {
  flex: 1; padding: 10px; border: 0; background: transparent; cursor: pointer; font-family: inherit;
  font-size: 13px; font-weight: 700; letter-spacing: .02em; color: var(--muted); border-radius: 0;
}
.authmodal__tab.is-active { background: #fff; color: var(--navy); box-shadow: 0 2px 8px -3px rgba(10,37,64,.35); }
.authmodal__title { margin: 0 0 6px; font-size: 24px; color: var(--navy); }
.authmodal__sub { margin: 0 0 18px; font-size: 14px; color: var(--muted); line-height: 1.5; }
.authmodal__error {
  margin: 0 0 16px; padding: 11px 14px; background: #fdecec; border-left: 3px solid var(--red);
  color: #a01b1b; font-size: 13.5px; font-weight: 500;
}
.authform { display: flex; flex-direction: column; gap: 14px; }
.authfield { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600; color: var(--navy); }
.authfield input {
  font-family: inherit; font-size: 15px; color: var(--ink); padding: 12px 14px; border: 1px solid var(--line);
  background: #fff; width: 100%;
}
.authfield input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(47,108,176,.15); }
.authform__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.authcheck { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; font-weight: 500; color: var(--muted); cursor: pointer; line-height: 1.45; }
.authcheck input { margin-top: 2px; flex: 0 0 auto; accent-color: var(--blue); }
.authcheck--terms { font-size: 12.5px; }
.authcheck a { color: var(--blue); text-decoration: underline; }
.authlink { border: 0; background: transparent; cursor: pointer; font-family: inherit; font-size: 13px; font-weight: 600; color: var(--blue); padding: 0; text-decoration: underline; }
.authlink:hover { color: var(--red-dark); }
.authform__submit { width: 100%; justify-content: center; margin-top: 4px; }
.authform__back { align-self: center; margin-top: 8px; text-decoration: none; }
.authmodal__demo { margin: 20px 0 0; padding-top: 16px; border-top: 1px solid var(--line); font-size: 12px; color: var(--muted); line-height: 1.5; }
.authmodal__demo strong { color: var(--navy); }

/* ---- account page ---- */
.account-card { border: 1px solid var(--line); background: var(--bg); padding: 28px; max-width: 560px; display: flex; gap: 20px; align-items: center; }
.account-card__avatar { flex: 0 0 auto; width: 64px; height: 64px; display: grid; place-items: center; border-radius: 999px; background: var(--blue); color: #fff; font-family: "Archivo", sans-serif; font-size: 22px; font-weight: 800; }
.account-card__name { font-family: "Archivo", sans-serif; font-size: 20px; font-weight: 700; color: var(--navy); }
.account-card__mail { font-size: 14px; color: var(--muted); }
.account-actions { margin-top: 22px; display: flex; gap: 12px; flex-wrap: wrap; }
.account-locked { border: 1px dashed var(--line); background: var(--bg-soft); padding: 40px 28px; text-align: center; max-width: 560px; }
.account-locked p { margin: 0 0 20px; color: var(--muted); }

@media (max-width: 520px) {
  .authmodal__dialog { padding: 24px 20px; }
  .account-card { flex-direction: column; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  .authmodal__dialog { animation: none; }
  .usermenu__btn, .authmodal__x { transition: none !important; }
}

/* ---- AUTH review fixes (contrast, danger color, drawer order, mobile entry) ---- */
:root { --danger: #c0392b; }
.authmodal__x { color: var(--muted); }                 /* was --faint: failed contrast */
.usermenu__item--logout { color: var(--danger); }      /* destructive action reads red */
.drawer__authbox { margin-top: 0; padding-top: 0; border-top: 0; margin-bottom: 14px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.drawer__logout { background: var(--danger); }
/* keep a compact (icon-only) login/account control in the header down to 560px */
@media (max-width: 860px) {
  .login-btn { display: inline-flex; padding: 0; width: 42px; justify-content: center; }
  .login-btn span, .usermenu__name, .usermenu__status { display: none; }
  .usermenu__btn { padding: 0 10px 0 6px; max-width: none; }
}
@media (max-width: 560px) { .authbox { display: none; } }

/* ---- Article share bar (right side of the byline) ---- */
.post__share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; padding: 0; border: 0; }
.post__share-label { font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-right: 4px; }
.post__share a, .post__share button {
  display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px;
  border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--navy); cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
}
.post__share a:hover, .post__share button:hover { background: var(--navy); color: #fff; border-color: var(--navy); }
.post__share svg { width: 17px; height: 17px; }
/* Keep the like (favourite) button round so it reads as a separate action from
   the square share buttons (overrides the square rule above). */
.post__share .post__fav { border-radius: 50%; }

/* ---- Search / listing page ---- */
.searchpage { display: flex; gap: 10px; margin-bottom: 18px; max-width: 560px; }
.searchpage input { flex: 1; min-width: 0; font-family: inherit; font-size: 15px; padding: 12px 14px; border: 1px solid var(--line); background: #fff; }
.searchpage input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(47,108,176,.15); }
.searchpage .btn { white-space: nowrap; }
.listing-count { font-size: 14px; color: var(--muted); margin: 0 0 18px; }

/* ---- Downloads (lead magnets) ---- */
.dlcard { display: flex; align-items: center; gap: 16px; padding: 20px; background: var(--bg); border: 1px solid var(--line); transition: box-shadow .15s, border-color .15s; }
.dlcard:hover { box-shadow: 0 16px 32px -18px rgba(10,37,64,.4); border-color: #cfd8e3; }
.dlcard__icon { flex: 0 0 auto; width: 48px; height: 48px; display: grid; place-items: center; background: var(--navy); color: #fff; font-family: "Archivo", sans-serif; font-weight: 800; font-size: 13px; letter-spacing: .04em; }
.dlcard__body { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }
.dlcard__title { font-family: "Archivo", sans-serif; font-size: 16px; font-weight: 700; color: var(--navy); }
.dlcard__desc { font-size: 13.5px; color: var(--muted); line-height: 1.45; }
.dlcard__cta { flex: 0 0 auto; font-size: 13px; font-weight: 700; color: var(--blue); white-space: nowrap; }
.dlnote { margin-top: 32px; padding: 24px; background: var(--bg-soft); border: 1px solid var(--line); }
.dlnote p { color: var(--muted); margin: 0 0 16px; max-width: 640px; line-height: 1.55; }
@media (max-width: 520px) { .dlcard { flex-wrap: wrap; } .dlcard__cta { width: 100%; } }

/* ---- Featured badge + detail pages (firm / charter / event) ---- */
.feat-badge { display: inline-block; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #fff; background: var(--red); padding: 2px 7px; vertical-align: middle; margin-right: 6px; }
.firmpage, .boatpage { display: grid; gap: 28px; align-items: start; }
.firmpage { grid-template-columns: 200px 1fr; }
.boatpage { grid-template-columns: 1.1fr 1fr; }
.firmpage__logo { border: 1px solid var(--line); background: var(--bg-soft); padding: 24px; display: grid; place-items: center; }
.firmpage__logo img { max-width: 100%; max-height: 140px; object-fit: contain; }
.firmpage__cat { font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--blue); margin: 0 0 10px; }
.firmpage__body p, .boatpage__body p { line-height: 1.6; color: var(--ink); }
.firmpage__meta { list-style: none; padding: 0; margin: 18px 0; display: flex; flex-direction: column; gap: 6px; font-size: 14px; color: var(--muted); }
.firmpage__meta a { color: var(--blue); text-decoration: underline; }
.firmpage__cta, .boatpage__cta { margin-top: 20px; display: flex; gap: 12px; flex-wrap: wrap; }
.boatpage__media img { width: 100%; height: auto; border: 1px solid var(--line); }
.spec { list-style: none; padding: 0; margin: 18px 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--line); border: 1px solid var(--line); }
.spec li { background: #fff; padding: 10px 14px; font-size: 14px; color: var(--ink); display: flex; justify-content: space-between; gap: 10px; }
.spec li strong { color: var(--muted); font-weight: 600; }
@media (max-width: 720px) { .firmpage, .boatpage { grid-template-columns: 1fr; } .firmpage__logo { max-width: 240px; } }

/* ---- Monetization surfaces (sponsored + ad slots + media kit) ---- */
.spons-badge { display: inline-block; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--blue); background: rgba(10,37,64,.08); padding: 3px 9px; margin-bottom: 8px; }
.sponsored-note { border-left: 3px solid var(--blue); background: var(--bg-soft); padding: 10px 14px; font-size: 13px; color: var(--muted); margin: 0 0 18px; }
.promospot { display: block; margin: 28px 0; }
.promospot__label { display: block; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); opacity: .7; margin-bottom: 6px; }
/* Subcategory chips on category pages (3-tier taxonomy) */
.subcats { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; }
.subcat-chip { display: inline-block; padding: 6px 14px; border: 1px solid var(--line); border-radius: 999px; background: var(--bg-soft); font-size: 13px; font-weight: 600; color: var(--navy); text-decoration: none; transition: border-color .15s, background .15s, color .15s; }
.subcat-chip:hover { border-color: var(--blue); color: var(--blue); background: #fff; }

/* CMS banner creative (image ad) — same footprint as the house text ads */
.promospot__banner { display: block; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: var(--bg-soft); text-decoration: none; }
.promospot__banner .promospot__label { padding: 6px 10px 0; margin-bottom: 4px; }
.promospot__banner img { display: block; width: 100%; height: auto; }
.promospot__house { display: flex; flex-direction: column; gap: 4px; border: 1px dashed var(--line); background: var(--bg-soft); padding: 18px 20px; text-decoration: none; transition: border-color .15s, background .15s; }
.promospot__house:hover { border-color: var(--blue); background: #fff; }
.promospot__house strong { font-family: "Archivo", sans-serif; font-size: 17px; color: var(--ink); }
.promospot__house span { font-size: 14px; color: var(--muted); }
.promospot__cta { color: var(--blue); font-weight: 700; }
.promospot--leader .promospot__house { flex-direction: row; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 24px; }
/* Category-partner CTA: always break "Reklama i współpraca →" onto its own 2nd
   row (consistent regardless of category-name length). */
#promo-category-partner .promospot__cta { flex-basis: 100%; margin-top: 2px; }
.statrow { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); margin: 8px 0; }
.stat { background: #fff; padding: 20px 16px; text-align: center; }
.stat__num { font-family: "Archivo", sans-serif; font-size: 30px; font-weight: 800; color: var(--blue); line-height: 1; }
.stat__lbl { display: block; font-size: 13px; color: var(--muted); margin-top: 6px; }
.tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 8px 0; }
.pricetable { width: 100%; border-collapse: collapse; margin: 0; font-size: 14px; }
.pricetable th, .pricetable td { border: 1px solid var(--line); padding: 10px 14px; text-align: left; }
.pricetable th { background: var(--bg-soft); font-weight: 700; }
.pricetable td:last-child { white-space: nowrap; font-weight: 600; }
@media (max-width: 520px) { .pricetable { font-size: 12.5px; } .pricetable th, .pricetable td { padding: 8px 10px; } }
@media (max-width: 620px) { .statrow { grid-template-columns: 1fr 1fr; } }

/* ---- About page: team + testimonials ---- */
.team { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.member { display: flex; gap: 14px; align-items: flex-start; border: 1px solid var(--line); padding: 16px; background: #fff; }
.member__avatar { flex: 0 0 auto; width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: var(--navy); color: #fff; font-family: "Archivo", sans-serif; font-weight: 800; font-size: 17px; }
.member__name { font-family: "Archivo", sans-serif; font-weight: 700; color: var(--ink); }
.member__name a { color: inherit; }
.member__name a:hover { color: var(--blue); }
.member__role { display: block; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--blue); margin: 2px 0 6px; }
.member__bio { font-size: 13.5px; color: var(--muted); line-height: 1.5; }
.testis { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.testi { border: 1px solid var(--line); border-left: 3px solid var(--blue); background: var(--bg-soft); padding: 16px 18px; }
.testi p { margin: 0 0 10px; font-style: italic; color: var(--ink); line-height: 1.55; }
.testi__who { font-size: 13px; font-weight: 700; color: var(--muted); }
@media (max-width: 620px) { .team, .testis { grid-template-columns: 1fr; } }

/* ---- Article reading progress + table of contents ---- */
.readprog { position: fixed; top: 0; left: 0; height: 3px; width: 0; background: var(--red); z-index: 100; transition: width .1s linear; }
.post__toc { border: 1px solid var(--line); background: var(--bg-soft); padding: 14px 18px; margin: 0 0 24px; }
.post__toc-h { display: block; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-bottom: 8px; }
.post__toc ol { margin: 0; padding-left: 18px; }
.post__toc li { margin: 4px 0; }
.post__toc a { color: var(--blue); }
.post__toc a:hover { text-decoration: underline; }

/* ---- Mapa wiatru + reklama (two 50% cards under Najważniejsze) ---- */
.mapad { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.mapad__card { border: 1px solid var(--line); min-height: 380px; }
.mapad__map { position: relative; overflow: hidden; line-height: 0; background: var(--bg-soft); }
.mapad__windy { width: 100%; height: 100%; min-height: 380px; border: 0; display: block; }
.mapad__ad { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 8px; padding: 28px; background: var(--bg-soft); text-decoration: none; transition: background .15s, border-color .15s; }
.mapad__ad:hover { background: #fff; border-color: #cfd8e3; }
.mapad__ad-h { font-family: "Archivo", sans-serif; font-size: 22px; font-weight: 800; color: var(--ink); }
.mapad__ad-t { font-size: 14px; color: var(--muted); max-width: 320px; line-height: 1.5; }
@media (max-width: 760px) { .mapad { grid-template-columns: 1fr; } .mapad__card { min-height: 300px; } }

/* ---- Wyniki regat (results) — flat, sharp card ---- */
.results-card { border: 1px solid var(--line); background: #fff; }
.results-card__head { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; padding: 14px 18px; border-bottom: 1px solid var(--line); }
.results-card__pick { display: flex; align-items: center; gap: 8px; }
.results-card__pick label { font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.results-card__select { font-family: inherit; font-size: 14px; font-weight: 600; color: var(--ink); padding: 8px 32px 8px 11px; border: 1px solid var(--line); border-radius: 0; background-color: #fff; background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230a2540" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M6 9l6 6 6-6"/></svg>'); background-repeat: no-repeat; background-position: right 10px center; background-size: 13px; -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; }
.results-card__select:focus-visible { outline: 2px solid var(--blue); outline-offset: 1px; }
.results-card__meta { margin: 0 0 0 auto; font-size: 12.5px; color: var(--muted); }
.results-card__scroll { overflow-x: auto; }
.rtable { width: 100%; border-collapse: collapse; font-size: 13.5px; white-space: nowrap; }
.rtable thead th { font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); background: var(--bg-soft); padding: 10px 14px; text-align: left; border-bottom: 1px solid var(--line); }
.rtable th.rsort { cursor: pointer; user-select: none; }
.rtable th.rsort:hover { color: var(--navy); background: #eef2f7; }
.rtable th.rsort.is-sorted { color: var(--navy); }
.rtable th.rsort:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; }
.rsort__ind { display: inline-block; width: 10px; margin-left: 3px; font-size: 9px; color: var(--blue); }
.rtable td { padding: 10px 14px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.rtable tbody tr:last-child td { border-bottom: 0; }
.rtable tbody tr:hover { background: var(--bg-soft); }
.rcell-num { font-variant-numeric: tabular-nums; text-align: center; }
.rtable td.rcell-num { color: var(--muted); }
.rtable td.rcell-num.is-drop { color: var(--faint); }
.rcode { font-size: 9.5px; font-weight: 800; letter-spacing: .03em; color: #b4452b; }
.rtable__rankcell { width: 42px; }
.rnum { font-family: "Archivo", sans-serif; font-weight: 800; color: var(--faint); }
.rnum--top { color: var(--navy); }
.rnat { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--ink); }
.rnat__flag { width: 18px; height: auto; display: block; box-shadow: 0 0 0 1px rgba(10,37,64,.18); }
.rtable__name { font-family: "Archivo", sans-serif; font-weight: 700; color: var(--ink); white-space: normal; min-width: 150px; }
.rtable__club { color: var(--muted); font-size: 12.5px; white-space: normal; max-width: 220px; }
.rtable__cat { display: inline-block; font-size: 10px; font-weight: 800; letter-spacing: .04em; color: var(--blue); }
.rtable__dash { color: var(--faint); }
.rtable__score { font-variant-numeric: tabular-nums; text-align: center; font-weight: 800; color: var(--navy); font-size: 15px; }
.results-card__foot { margin: 0; padding: 10px 18px; font-size: 11.5px; color: var(--muted); border-top: 1px solid var(--line); background: var(--bg-soft); }
@media (max-width: 620px) { .results-card__meta { margin-left: 0; flex-basis: 100%; } }
/* clickable sailor name -> profile pop-up */
.rsailor { border: 0; background: transparent; padding: 0; margin: 0; font: inherit; font-family: "Archivo", sans-serif; font-weight: 700; color: var(--navy); cursor: pointer; text-align: left; }
.rsailor:hover { color: var(--blue); text-decoration: underline; }
.rsailor:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }

/* ---- Sailor profile modal ---- */
.smodal { position: fixed; inset: 0; z-index: 320; display: grid; place-items: center; padding: 24px; }
.smodal[hidden] { display: none; }
.smodal__backdrop { position: absolute; inset: 0; background: rgba(7,20,36,.82); }
.smodal__dialog { position: relative; z-index: 1; width: min(680px, 100%); max-height: 86vh; overflow: auto; background: #fff; border: 1px solid var(--line); padding: 24px; }
.smodal__close { position: absolute; top: 12px; right: 12px; width: 34px; height: 34px; display: grid; place-items: center; border: 0; background: transparent; color: var(--muted); cursor: pointer; }
.smodal__close svg { width: 22px; height: 22px; }
.smodal__close:hover { color: var(--navy); }
.smodal__head { display: flex; align-items: center; gap: 14px; padding-right: 40px; }
.smodal__head .rnat__flag { width: 30px; }
.smodal__id { display: flex; flex-direction: column; gap: 2px; }
.smodal__name { font-family: "Archivo", sans-serif; font-size: 22px; font-weight: 800; color: var(--navy); line-height: 1.1; }
.smodal__meta { font-size: 13px; color: var(--muted); }
.smodal__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); margin: 18px 0; }
.sstat { background: #fff; padding: 14px; text-align: center; }
.sstat__n { display: block; font-family: "Archivo", sans-serif; font-size: 24px; font-weight: 800; color: var(--blue); line-height: 1; }
.sstat__l { display: block; font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; margin-top: 5px; }
.smodal__h { font-family: "Archivo", sans-serif; font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--navy); margin: 0 0 10px; }
.smodal__scroll { overflow-x: auto; }
.smodal__date { font-size: 12.5px; color: var(--muted); white-space: nowrap; }

/* ---- Żeglarski.TV — YouTube channel feed ---- */
.media-yt { display: block; }
.ytfeat-wrap { max-width: 880px; margin-bottom: 8px; }
.ytfeat { display: grid; grid-template-columns: 1.7fr 1fr; gap: 30px; align-items: center; margin-bottom: 10px; }
.ytfeat__info { min-width: 0; }
.ytfeat__badge { display: inline-block; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--red); }
.ytfeat__title { font-family: "Archivo", sans-serif; font-size: 27px; font-weight: 800; color: var(--navy); line-height: 1.18; margin: 10px 0 8px; }
.ytfeat .ytdate { display: block; font-size: 13px; color: var(--muted); margin-bottom: 20px; }
.ytfeat__cta { align-self: start; }
.ytgrid-head { margin-top: 40px; }
@media (max-width: 820px) { .ytfeat { grid-template-columns: 1fr; gap: 18px; } .ytfeat__title { font-size: 22px; } }
.ytfeature { position: relative; aspect-ratio: 16 / 9; background: #000; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.ytfeature iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ythead { font-family: "Archivo", sans-serif; font-size: 19px; font-weight: 800; color: var(--navy); line-height: 1.25; margin: 14px 0 4px; }
.ytdate { font-size: 12.5px; color: var(--muted); }
.ytgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; margin-top: 30px; }
.ytcard { display: flex; flex-direction: column; }
.ytcard__media { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid var(--line); background: linear-gradient(135deg, #3a5a8c, #071c33); }
.ytcard__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.ytcard:hover .ytcard__media img { transform: scale(1.05); }
.ytcard__media .playbtn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.ytcard__title { font-family: "Archivo", sans-serif; font-size: 14px; font-weight: 700; color: var(--navy); line-height: 1.3; margin-top: 10px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ytcard:hover .ytcard__title { color: var(--blue); }
.ytcard__date { font-size: 12px; color: var(--muted); margin-top: 4px; }
.ytmore { margin-top: 28px; }
@media (max-width: 900px) { .ytgrid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 620px) { .ytgrid { grid-template-columns: 1fr 1fr; } }
/* Video pop-up (lightbox) */
.ytmodal { position: fixed; inset: 0; z-index: 300; display: grid; place-items: center; padding: 24px; }
.ytmodal[hidden] { display: none; }
.ytmodal__backdrop { position: absolute; inset: 0; background: rgba(7,20,36,.85); }
.ytmodal__dialog { position: relative; z-index: 1; width: min(960px, 100%); }
.ytmodal__frame { position: relative; aspect-ratio: 16 / 9; background: #000; box-shadow: 0 30px 80px -20px rgba(0,0,0,.7); }
.ytmodal__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ytmodal__close { position: absolute; top: -44px; right: 0; width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 0; background: transparent; color: #fff; cursor: pointer; }
.ytmodal__close svg { width: 24px; height: 24px; }
.ytmodal__close:hover { color: #9fc2ff; }
@media (max-width: 560px) { .ytmodal { padding: 16px; } .ytmodal__close { top: -40px; } }

/* ====================================================================
   KLUBY ŻEGLARSKIE (directory reuses .firm-card / .cardgrid)
   ==================================================================== */
.clubpage { display: grid; grid-template-columns: 1fr 320px; gap: 40px; align-items: start; }
.clubpage__main { min-width: 0; }
.club-cover { margin-bottom: 8px; border-radius: 4px; overflow: hidden; border: 1px solid var(--line); }
.club-cover img { width: 100%; height: 320px; object-fit: cover; display: block; }
.club-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 4px; }
.club-chip { font-size: 12.5px; font-weight: 600; color: var(--navy); background: var(--bg-soft); border: 1px solid var(--line); border-radius: 999px; padding: 5px 12px; }
.club-sec { margin-top: 34px; }
.club-ann { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.club-ann__item { display: flex; gap: 14px; padding: 16px 18px; background: var(--bg-soft); border-left: 3px solid var(--red); border-radius: 4px; }
.club-ann__date { flex: 0 0 auto; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--red); padding-top: 2px; min-width: 100px; }
.club-ann__title { display: block; font-family: "Archivo", sans-serif; font-weight: 800; color: var(--navy); font-size: 15px; margin-bottom: 3px; text-decoration: none; }
a.club-ann__title:hover, .club-post__title a:hover { color: var(--blue); }
.club-post__title a { color: inherit; text-decoration: none; }
.club-ann__text a { color: var(--blue); }
.club-ann__text { margin: 0; font-size: 14px; line-height: 1.55; color: var(--muted); }
.club-posts { display: flex; flex-direction: column; gap: 26px; }
.club-post { padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.club-post:last-child { border-bottom: 0; padding-bottom: 0; }
.club-post__date { font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--faint); margin: 0 0 6px; }
.club-post__title { font-family: "Archivo", sans-serif; font-size: 20px; font-weight: 800; color: var(--navy); margin: 0 0 8px; line-height: 1.25; }
.club-post__lead { font-size: 15px; font-weight: 600; color: var(--ink); margin: 0 0 8px; }
.club-post__body p { font-size: 15px; line-height: 1.7; color: var(--muted); margin: 0 0 10px; }
.club-info { background: var(--bg-soft); border: 1px solid var(--line); border-radius: 4px; padding: 20px; margin-bottom: 16px; }
.club-info__logo { background: #fff; border: 1px solid var(--line); border-radius: 4px; padding: 14px; display: grid; place-items: center; margin-bottom: 16px; }
.club-info__logo img { max-width: 100%; max-height: 60px; width: auto; }
.club-info .btn { width: 100%; justify-content: center; margin-top: 6px; }
.club-join { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding: 30px 34px; background: linear-gradient(135deg, var(--navy-soft), var(--navy)); border-radius: 6px; }
.club-join__title { font-family: "Archivo", sans-serif; font-size: 22px; font-weight: 800; margin: 0 0 8px; color: #fff; }
.club-join__text { margin: 0; font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,.85); max-width: 640px; }
.club-join .btn { background: #fff; color: var(--navy); flex: 0 0 auto; }
@media (max-width: 860px) {
  .clubpage { grid-template-columns: 1fr; }
  .club-cover img { height: 220px; }
}

/* ---- Kluby: panel klubu (demo dashboard) ---- */
.panellock { max-width: 560px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 6px; padding: 30px; text-align: center; }
.panellock__msg { font-size: 16px; color: var(--ink); margin: 0 0 16px; }
.panellock__demo { font-size: 12.5px; line-height: 1.6; color: var(--muted); margin: 18px 0 0; }
.panelnote { background: var(--bg-soft); border: 1px solid var(--line); border-radius: 6px; padding: 22px; font-size: 15px; color: var(--muted); }
.panelhead { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 22px; }
.panelhead__t { font-family: "Archivo", sans-serif; font-size: 24px; font-weight: 800; color: var(--navy); margin: 0 0 4px; }
.panelhead__sub { font-size: 13.5px; color: var(--muted); margin: 0; max-width: 620px; }
.pfs { border: 1px solid var(--line); border-radius: 6px; padding: 20px 22px 24px; margin: 0 0 22px; }
.pfs > legend { font-family: "Archivo", sans-serif; font-weight: 800; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--navy); padding: 0 8px; }
.pf { display: block; margin: 0 0 14px; }
.pf > span { display: block; font-size: 12.5px; font-weight: 600; color: var(--muted); margin: 0 0 5px; }
.pf input, .pf textarea { width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 4px; padding: 9px 12px; font-family: inherit; font-size: 14px; color: var(--ink); background: #fff; outline: none; }
.pf input:focus, .pf textarea:focus { border-color: var(--blue); }
.pf textarea { resize: vertical; }
/* Club-panel image field: URL input + Wgraj (upload) button + preview */
.pf-img__row { display: flex; gap: 8px; align-items: stretch; }
.pf-img__row input { flex: 1; }
.pf-img__btn { display: inline-flex; align-items: center; justify-content: center; padding: 0 14px; border: 1px solid var(--navy); border-radius: 4px; background: var(--navy); color: #fff; font-size: 12.5px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.pf-img__btn:hover { background: #14406b; }
.pf-img__btn.is-busy { opacity: .7; pointer-events: none; }
.pf-img__prev { display: block; margin-top: 8px; }
.pf-img__prev img { max-width: 160px; max-height: 100px; border-radius: 6px; border: 1px solid var(--line); object-fit: cover; display: block; }
.pf3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.pf3 .pf { margin: 0; }
.pblock { border: 1px solid var(--line); border-left: 3px solid var(--blue); border-radius: 4px; padding: 14px 16px; margin: 0 0 14px; background: var(--bg-soft); }
.pblock__row { display: flex; align-items: flex-end; gap: 12px; }
.pblock__row .pf { flex: 1; }
.pblock__rm { flex: 0 0 auto; height: 38px; border: 1px solid var(--line); background: #fff; color: var(--red); border-radius: 4px; padding: 0 14px; font: inherit; font-size: 13px; cursor: pointer; }
.pblock__rm:hover { background: var(--red); color: #fff; border-color: var(--red); }
.pfs__add { margin-top: 4px; }
.panelactions { display: flex; gap: 12px; flex-wrap: wrap; }
@media (max-width: 620px) { .pf3 { grid-template-columns: 1fr; } }

/* ---- Kluby: landing feed + list, club hero ---- */
.clubfeed { display: flex; flex-direction: column; gap: 16px; }
.clubpost-card { display: grid; grid-template-columns: 180px 1fr; gap: 20px; align-items: center; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: #fff; transition: box-shadow .16s ease, transform .16s ease, border-color .16s ease; }
.clubpost-card:hover { border-color: transparent; box-shadow: 0 16px 38px -20px rgba(10,37,64,.4); transform: translateY(-2px); }
.clubpost-card__thumb { display: block; aspect-ratio: 16 / 10; border-radius: 8px; overflow: hidden; background: var(--bg-soft); }
.clubpost-card__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.clubpost-card:hover .clubpost-card__thumb img { transform: scale(1.05); }
.clubpost-card__body { min-width: 0; }
.clubpost-card__kicker { margin: 0 0 6px; }
.clubpost-card__club { font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--blue); }
.clubpost-card__club:hover { text-decoration: underline; }
.clubpost-card__date { font-size: 12px; color: var(--faint); margin-left: 10px; }
.clubpost-card__title { font-family: "Archivo", sans-serif; font-size: 18px; font-weight: 800; line-height: 1.25; margin: 0 0 6px; }
.clubpost-card__lead { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 560px) { .clubpost-card { grid-template-columns: 1fr; } }
.clubpost-card__title a { color: var(--navy); }
.clubpost-card__title a:hover { color: var(--blue); }
.clubpost-card__lead { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--muted); }

.clubaside { background: transparent; border: 0; border-radius: 0; padding: 0; }
.club-info__t { font-family: "Archivo", sans-serif; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--navy); margin: 0 0 12px; }
.clublist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.clubrow { position: relative; display: block; border: 1px solid var(--line); border-radius: 12px; background: #fff; overflow: hidden; transition: box-shadow .16s ease, transform .16s ease, border-color .16s ease; }
.clubrow:hover { border-color: transparent; box-shadow: 0 16px 38px -20px rgba(10,37,64,.4); transform: translateY(-2px); }
.clubrow__cover { display: block; height: 64px; overflow: hidden; }
.clubrow__cover img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.clubrow:hover .clubrow__cover img { transform: scale(1.06); }
.clubrow__logo { position: absolute; top: 40px; left: 14px; width: 46px; height: 46px; background: #fff; border: 1px solid var(--line); border-radius: 10px; display: grid; place-items: center; overflow: hidden; box-shadow: 0 6px 14px -8px rgba(10,37,64,.35); }
.clubrow__logo img { max-width: 78%; max-height: 78%; width: auto; }
.clubrow__body { display: block; padding: 28px 34px 14px 14px; }
.clubrow__name { display: block; font-family: "Archivo", sans-serif; font-weight: 800; font-size: 14.5px; color: var(--navy); line-height: 1.2; }
.clubrow__meta { display: block; font-size: 12.5px; color: var(--muted); margin-top: 3px; }
.clubrow__arr { position: absolute; right: 14px; bottom: 14px; color: var(--blue); font-weight: 700; opacity: 0; transform: translateX(-4px); transition: opacity .16s, transform .16s; }
.clubrow:hover .clubrow__arr { opacity: 1; transform: translateX(0); }

.clubhero { position: relative; margin-bottom: 10px; min-height: 260px; display: flex; align-items: flex-end; overflow: hidden; background: linear-gradient(135deg, var(--navy-soft), var(--navy)); }
.clubhero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.clubhero__scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,37,64,.12) 0%, rgba(10,37,64,.55) 55%, rgba(10,37,64,.86) 100%); }
.clubhero__inner { position: relative; padding: 40px 0 30px; color: #fff; }
.clubhero__logo { width: 66px; height: 66px; background: #fff; border-radius: 10px; display: grid; place-items: center; padding: 9px; margin-bottom: 16px; box-shadow: 0 10px 26px -12px rgba(0,0,0,.6); }
.clubhero__logo img { max-width: 100%; max-height: 100%; width: auto; }
.clubhero__name { font-family: "Archivo", sans-serif; font-size: 34px; font-weight: 800; line-height: 1.08; margin: 0 0 8px; color: #fff; }
.clubhero__meta { margin: 0 0 16px; font-size: 14.5px; font-weight: 600; color: rgba(255,255,255,.92); }
.club-chips--hero { margin: 0; }
.club-chips--hero .club-chip { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.3); color: #fff; }
.club-info__cta { width: 100%; justify-content: center; margin-top: 4px; }
@media (max-width: 640px) { .clubhero { min-height: 200px; } .clubhero__name { font-size: 26px; } }

.club-chips--head { margin: 14px 0 0; }

/* ---- Sport: 4 ads (left column) + 3×2 posts grid ---- */
.sportlayout { display: grid; grid-template-columns: 300px 1fr; gap: 32px; align-items: stretch; }
.sportlayout__ads { display: flex; flex-direction: column; gap: 22px; }
.sportlayout__ads .promospot__house--sm { flex: 1 1 0; justify-content: center; }
.popgrid--3 { grid-template-columns: repeat(3, 1fr); align-items: stretch; }
.popgrid--3 .popcard__body { flex: 1 1 auto; }
@media (max-width: 900px) {
  .sportlayout { grid-template-columns: 1fr; }
  .sportlayout__ads { flex-direction: row; flex-wrap: wrap; }
  .sportlayout__ads .promospot__house--sm { flex: 1 1 45%; }
}
@media (max-width: 720px) and (min-width: 601px) { .popgrid--3 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .popgrid--3 { grid-template-columns: 1fr; } }

/* ---- Rejsy (home): 2×3 posts left + ad column (1 big + 2 small) right ---- */
.rejsylayout { display: grid; grid-template-columns: 1fr 300px; gap: 32px; align-items: stretch; }
.popgrid--2 { grid-template-columns: repeat(2, 1fr); align-items: stretch; }
.popgrid--2 .popcard__body { flex: 1 1 auto; }
.rejsylayout__ads { display: flex; flex-direction: column; gap: 22px; height: 100%; }
.rejsyad--big { flex: 1.7 1 0; min-height: 0; justify-content: center; }
.rejsylayout__ads .promospot__house--sm { flex: 1 1 0; }
@media (max-width: 900px) {
  .rejsylayout { grid-template-columns: 1fr; }
  .rejsylayout__ads { flex-direction: row; flex-wrap: wrap; }
  .rejsyad--big { flex: 1 1 100%; min-height: 150px; }
  .rejsylayout__ads .promospot__house--sm { flex: 1 1 45%; }
}
@media (max-width: 560px) { .popgrid--2 { grid-template-columns: 1fr; } }

/* ====================================================================
   KLUBY landing — SaaS-style rework (hero + features + CTA)
   ==================================================================== */
.klubhero-crumbs { padding-top: 22px; }
.klubhero { display: grid; grid-template-columns: 1.05fr .95fr; gap: 48px; align-items: center; padding: 26px 0 8px; }
.klubhero__eyebrow { display: inline-block; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--blue); margin-bottom: 14px; }
.klubhero__title { font-family: "Archivo", sans-serif; font-size: 44px; font-weight: 800; line-height: 1.05; letter-spacing: -.01em; color: var(--navy); margin: 0 0 16px; }
.klubhero__lead { font-size: 16.5px; line-height: 1.65; color: var(--muted); margin: 0 0 26px; max-width: 46ch; }
.klubhero__cta { display: flex; flex-wrap: wrap; gap: 12px; }
.klubhero__media { border-radius: 12px; overflow: hidden; border: 1px solid var(--line); box-shadow: 0 30px 60px -30px rgba(10,37,64,.4); }
.klubhero__media img { display: block; width: 100%; height: 100%; max-height: 420px; object-fit: cover; }

.klubfeatures { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; padding: 44px 0 8px; }
.klubfeature {
  position: relative; padding: 26px 24px 24px; border: 1px solid var(--line); border-radius: 12px; background: #fff; overflow: hidden;
  transition: box-shadow .16s ease, transform .16s ease, border-color .16s ease;
}
.klubfeature::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--blue), #6699ff); opacity: 0; transition: opacity .16s ease; }
.klubfeature:hover { border-color: transparent; box-shadow: 0 16px 38px -20px rgba(10,37,64,.4); transform: translateY(-2px); }
.klubfeature:hover::before { opacity: 1; }
.klubfeature__ico {
  display: inline-grid; place-items: center; width: 48px; height: 48px; margin-bottom: 16px;
  border-radius: 12px; background: rgba(23,115,214,.1); color: var(--blue);
}
.klubfeature__ico svg { width: 24px; height: 24px; }
.klubfeature__t { font-family: "Archivo", sans-serif; font-size: 17px; font-weight: 800; color: var(--navy); margin: 0 0 7px; }
.klubfeature__d { font-size: 14px; line-height: 1.65; color: var(--muted); margin: 0; }

.klubcta { display: flex; align-items: center; justify-content: space-between; gap: 28px; flex-wrap: wrap; padding: 32px 36px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg-soft); }
.klubcta__t { font-family: "Archivo", sans-serif; font-size: 24px; font-weight: 800; color: var(--navy); margin: 0 0 6px; }
.klubcta__d { font-size: 15px; line-height: 1.6; color: var(--muted); margin: 0; max-width: 62ch; }
.klubcta__btn { flex: 0 0 auto; }

@media (max-width: 860px) {
  .klubhero { grid-template-columns: 1fr; gap: 28px; padding-top: 14px; }
  .klubhero__media { order: -1; }
  .klubhero__title { font-size: 34px; }
  .klubfeatures { grid-template-columns: 1fr; gap: 22px; padding-top: 34px; }
  .klubcta { flex-direction: column; align-items: flex-start; padding: 26px; }
}

.newswidget__ad { margin-top: 16px; }

/* In-body article ad: shown only on mobile, between sections */
.promo-inbody-m { display: none; }
@media (max-width: 768px) {
  .post__body .promo-inbody-m { display: flex; margin: 26px 0; }
}

/* Header "Zgłoś temat" CTA (left of search) */
.topcta { display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 16px; margin-left: auto; margin-right: -12px; border-radius: 999px; background: #fff; color: #004488; font-weight: 600; font-size: 13.5px; letter-spacing: .01em; white-space: nowrap; box-shadow: 0 2px 6px rgba(11,40,90,.18); transition: box-shadow .15s, transform .1s; }
.topcta:hover { color: #004488; box-shadow: 0 4px 14px rgba(11,40,90,.28); }
.topcta:active { transform: translateY(1px); }
.topcta svg { flex: 0 0 auto; }
@media (max-width: 720px) { .topcta { display: none; } }

/* Inline media inside article body: photos + responsive embeds */
.post__body .post__fig { margin: 24px 0; }
.post__body .post__fig img { display: block; width: 100%; height: auto; border-radius: 6px; }
.post__body .post__fig figcaption { margin-top: 8px; font-size: 13px; line-height: 1.5; color: var(--muted); }
/* Legacy WordPress caption markup (CMS-rendered raw content) → styled like a figcaption. */
.post__body .wp-caption { max-width: 100%; margin: 24px auto; }
.post__body .wp-caption img { display: block; width: 100%; height: auto; border-radius: 6px; }
.post__body .wp-caption-text { margin-top: 8px; font-size: 13px; line-height: 1.5; color: var(--muted); text-align: center; }
.post__body img { max-width: 100%; height: auto; }
.post__body .embed { position: relative; margin: 24px 0; aspect-ratio: 16 / 9; border-radius: 6px; overflow: hidden; background: #000; border: 1px solid var(--line); }
.post__body .embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* Mega menu: media-only variant (TV) — no sub-list, 4 video cards */
.mega--media .mega__left { display: none; }
.mega__grid--4 { grid-template-columns: repeat(4, 1fr); }

/* ====================================================================
   KLUB profile page (social-org layout: cover + avatar + stats + tabs)
   ==================================================================== */
.profcrumbs { padding: 22px 0 14px; }
.profile { background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.profile__cover { height: 260px; overflow: hidden; }
.profile__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.profile__head { display: flex; align-items: flex-end; gap: 20px; padding: 0 28px; margin-top: -44px; }
.profile__avatar { flex: 0 0 auto; width: 112px; height: 112px; background: #fff; border: 4px solid #fff; border-radius: 16px; box-shadow: 0 10px 26px -14px rgba(10,37,64,.5); display: grid; place-items: center; overflow: hidden; }
.profile__avatar img { max-width: 82%; max-height: 82%; width: auto; }
.profile__id { flex: 1 1 auto; min-width: 0; padding-bottom: 6px; }
.profile__name { font-family: "Archivo", sans-serif; font-size: 26px; font-weight: 800; color: var(--navy); line-height: 1.1; margin: 0 0 4px; }
.profile__meta { margin: 0; font-size: 13.5px; color: var(--muted); }
.profile__actions { display: flex; gap: 10px; padding-bottom: 8px; flex-wrap: wrap; }
.profile__stats { display: flex; gap: 36px; padding: 18px 28px 14px; }
.profile__stat strong { display: block; font-family: "Archivo", sans-serif; font-size: 19px; font-weight: 800; color: var(--navy); line-height: 1.1; }
.profile__stat span { font-size: 12.5px; color: var(--muted); }
.profile__tabs { display: flex; gap: 4px; padding: 0 20px; border-top: 1px solid var(--line); }
.profile__tabs a { position: relative; padding: 13px 14px; font-size: 14px; font-weight: 700; color: var(--muted); }
.profile__tabs a:hover { color: var(--navy); }
.profile__tabs a:first-child { color: var(--blue); }
.profile__tabs a:first-child::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: -1px; height: 3px; border-radius: 3px 3px 0 0; background: var(--blue); }
.profbody { padding-top: 24px; }

/* feed + rail cards */
.profcard { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 20px 22px; margin-bottom: 20px; }
.profcard__t { font-family: "Archivo", sans-serif; font-size: 16px; font-weight: 800; color: var(--navy); margin: 0 0 14px; }
.proffeed__t { font-family: "Archivo", sans-serif; font-size: 16px; font-weight: 800; color: var(--navy); margin: 0 0 14px; }
.profbody .club-posts { display: flex; flex-direction: column; gap: 16px; }
.profbody .club-post { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 20px 22px 18px; }
.profbody .club-post:last-child { border-bottom: 1px solid var(--line); }
.profbody .club-ann { margin: 0; }
.profbody .clubpage__side .post__body p { font-size: 14px; line-height: 1.65; color: var(--muted); margin: 0 0 10px; }
.profbody .club-chips { margin-top: 6px; }
.profbody .firmpage__meta { margin: 0; }

@media (max-width: 760px) {
  .profile__cover { height: 170px; }
  .profile__head { flex-wrap: wrap; padding: 0 18px; margin-top: -36px; gap: 14px; }
  .profile__avatar { width: 88px; height: 88px; }
  .profile__actions { padding-bottom: 0; }
  .profile__stats { gap: 24px; padding: 14px 18px 10px; }
  .profile__tabs { overflow-x: auto; padding: 0 10px; }
  .profile__tabs a { white-space: nowrap; }
}

/* Klub profile: Zdjęcia card (3-col photo grid) */
.profphotos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.profphotos__item { display: block; aspect-ratio: 1 / 1; border-radius: 8px; overflow: hidden; background: var(--bg-soft); }
.profphotos__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.profphotos__item:hover img { transform: scale(1.07); }

/* Klub post image (feed media, FB-style) */
.club-post__img { margin: 12px 0 14px; border-radius: 8px; overflow: hidden; }
.club-post__img img { display: block; width: 100%; height: auto; max-height: 420px; object-fit: cover; }

/* Mega menu: photo-column variant (HISTORIA) — image card + scrim + copy */
.megacol { position: relative; display: block; min-height: 190px; border-radius: 10px; overflow: hidden; background: var(--navy); transition: transform .16s ease, box-shadow .16s ease; }
.megacol:hover { transform: translateY(-2px); box-shadow: 0 16px 34px -18px rgba(10,37,64,.55); }
.megacol__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.megacol:hover .megacol__img { transform: scale(1.06); }
.megacol__scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,37,64,.08) 0%, rgba(10,37,64,.55) 52%, rgba(7,28,51,.92) 100%); }
.megacol__body { position: absolute; inset: auto 0 0 0; display: flex; flex-direction: column; gap: 5px; padding: 16px 18px 14px; }
.megacol__t { font-family: "Archivo", sans-serif; font-size: 16.5px; font-weight: 800; color: #fff; line-height: 1.15; }
.megacol__d { font-size: 12.5px; line-height: 1.5; color: rgba(255,255,255,.82); }
.megacol__go { display: inline-flex; align-items: center; gap: 5px; margin-top: 4px; font-size: 12.5px; font-weight: 700; color: #9cc4ff; opacity: 0; transform: translateX(-4px); transition: opacity .16s, transform .16s; }
.megacol:hover .megacol__go { opacity: 1; transform: translateX(0); }

.listing-more { display: block; margin: 22px auto 0; }

/* Gallery hover captions (image slug/caption overlay) */
.pgal__lead, .pgal__thumb { position: relative; }
.pgal__cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 8px 12px 7px; font-size: 12px; line-height: 1.35; color: #fff; background: linear-gradient(180deg, rgba(7,28,51,0) 0%, rgba(7,28,51,.82) 100%); opacity: 0; transition: opacity .18s ease; pointer-events: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pgal__lead:hover .pgal__cap, .pgal__thumb:hover .pgal__cap { opacity: 1; }

/* Content links inside article text: blue + underlined */
.post__body p a, .post__body li a, .post__body blockquote a {
  color: var(--blue); text-decoration: underline; text-underline-offset: 2px;
}
.post__body p a:hover, .post__body li a:hover, .post__body blockquote a:hover { color: var(--red); }

/* Even card heights: clamp titles to 3 lines (full title appears in the hover overlay) */
.tcard__title { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; min-height: calc(3 * 1.3em); }
.popcard__head { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; min-height: calc(3 * 1.3em); }
.sidecard__head { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }