/* ======================================================
   Organizatorzy – standalone stylesheet
   - Minimalist, delicate card/grid styling
   - Re-declares project palette locally (no dependency on other CSS)
   - No external frameworks required
   - Image paths in HTML remain img/... relative to the HTML file
     (If you add background images here later, use ../img/... from this CSS file)
   ====================================================== */

/* 0) Design tokens (aligned with project) */
:root {
  /* Core palette */
  --navy: #34516e;        /* project navy */
  --navy-600: #223449;    /* deeper navy for emphasis */
  --muted: #6b7785;       /* subtle gray text */
  --accent: #ff9e2a;      /* soft orange accent */
  --surface: #ffffff;     /* card/page background */
  --border: #e9edf3;      /* delicate borders */

  /* Effects */
  --radius: 14px;         /* soft rounding for cards */
  --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.12);

  /* Type scale baseline */
  font-size: 100%;
}

/* 1) Base and helpers (standalone-safe) */
html { scrollbar-gutter: stable; }
html, body { min-height: 100%; }
body {
  margin: 0;
  padding: 0;
  font-family: Arial, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", sans-serif;
  line-height: 1.6;
  background: var(--surface);
  color: #2d435e; /* readable default body color */
  font-size: 1.125rem; /* 18px baseline */
}

img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
a:focus-visible, button:focus-visible { outline: 2px solid #e9eef4; outline-offset: 2px; }

/* Optional container helpers (match existing markup) */
.w3-container { max-width: 1200px; margin: 0 auto; padding: 0 15px; box-sizing: border-box; }
.w3-center { text-align: center; }
.w3-padding { padding: 1rem; }
/* Alias without w3- prefix for gradual migration */
.container { max-width: 1200px; margin: 0 auto; padding: 0 15px; box-sizing: border-box; }

/* Horizontal rule used on the page */
hr { width: 30%; margin: 2rem auto; border: none; border-top: 1px solid var(--border); }

/* 2) Headings */
.lz-title,
h1.lz-title, h2.lz-title {
  font-size: 2rem;
  line-height: 2rem;
  margin: 1.5rem 0 0.25rem;
  text-align: center;
  color: var(--navy);
  font-weight: 400; /* consistent with project (not bold) */
}
.lz-title a { color: inherit; font-weight: inherit; text-decoration: none; }

/* Generic h1/h2 if .lz-title is not used */
h1, h2 { color: var(--navy); font-weight: 400; margin: 1rem 0 0.5rem; }

/* Heading spacing (responsive) */
.liga-header h1.lz-title { margin-bottom: 0.85rem; }
.liga-header h2.lz-title { margin-top: 1.75rem; margin-bottom: 0.85rem; }
@media (min-width: 768px) {
  .liga-header h1.lz-title { margin-bottom: 1rem; }
  .liga-header h2.lz-title { margin-top: 2rem; margin-bottom: 1rem; }
}
@media (min-width: 1200px) {
  .liga-header h1.lz-title { margin-bottom: 1.25rem; }
  .liga-header h2.lz-title { margin-top: 2.25rem; margin-bottom: 1.25rem; }
}

/* 3) Organizer grid & cards */
/* Grid container */
.box-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 980px;         /* narrower for a clean center line */
  padding: 0 1rem 2rem;     /* small inner gutter */
  margin: 0 auto;           /* center the grid */
  align-items: stretch;
}
/* Centered single-column variant (if needed) */
.box-grid--center { grid-template-columns: minmax(260px, 780px); justify-content: center; }

/* Mobile: single column */
@media (max-width: 768px) {
  .box-grid { grid-template-columns: 1fr; gap: 0.8rem; }
}

/* Wide screens: three columns for a denser layout */
@media (min-width: 1200px) {
  .box-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1200px; }
}

/* Grid cell */
.box-grid > .box-col { display: flex; width: 100%; min-width: 0; }

/* Card (anchor acts as the card wrapper) */
.doc-box {
  border: 1px solid var(--border);
  background: #f7f9fc;     /* very light silver */
  border-radius: var(--radius);
  overflow: hidden;         /* clean edges */
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  color: inherit;
  text-decoration: none;
  transition: box-shadow 0.12s ease, transform 0.12s ease;
}
.doc-box:hover,
.doc-box:focus-visible {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

/* Card header */
.doc-box__header {
  background: #e0e4e9;     /* neutral header */
  color: var(--navy);
  padding: 0.7rem 0.95rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid #d4d9e0;
}
/* Ghost header variant (even lighter, no fill) */
.doc-box--ghost .doc-box__header {
  background: transparent;
  color: var(--navy);
  border-bottom: 1px solid var(--border);
}

.doc-box__title {
  margin: 0;
  font-size: 1rem;
  line-height: 1.35;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;   /* allow long words to wrap and not stretch columns */
  word-break: break-word;
}
/* Header-only variant (no divider) */
.doc-box--headeronly .doc-box__header { border-bottom: none; }

/* Card body */
.doc-box__body {
  background: #fff;
  color: #2d435e;
  padding: 0.8rem 1rem;
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Optional footer/tab if you add one later */
.doc-box__footer { border-top: 1px solid var(--border); background: #fefefe; }
.doc-box__link {
  display: flex; align-items: center; gap: 0.6rem;
  padding: 0.65rem 1rem; color: var(--navy);
}
.doc-box__link:hover { background: #f2f5f9; } /* neutral hover for optional footer link */

/* Organizer logos (inside .doc-box__body) */
.org-card__logo {
  display: block;
  height: 68px;         /* compact on small screens */
  width: auto;
  margin: 0.25rem auto;
  object-fit: contain;
}
@media (min-width: 768px) {
  .org-card__logo { height: 92px; }
}
/* Logo helpers for different artwork types */
.org-card__logo--softbg {
  background: #eef3f8;                /* soft bg for transparent/low-contrast logos */
  border: 1px solid #dbe3ee;
  padding: 6px 8px;
  border-radius: 10px;
}
.org-card__logo--outline {
  filter: drop-shadow(0 0 0.75px rgba(0,0,0,0.5))
          drop-shadow(0 0 0.75px rgba(0,0,0,0.25));
}
.org-card__logo--framed {
  border: 1px solid #dfe4ea;
  border-radius: 12px;
  padding: 4px; /* keep border off the graphic */
}

/* Section wrappers for headings and featured organizer */
.section-heading { padding: 1.25rem 0; }
.section-heading--primary { padding-top: 1.6rem; padding-bottom: 1.1rem; }
/* Titles inside the padded wrapper should not add extra margins */
.section-heading .lz-title { margin: 0; }

/* Featured organizer block (below the primary heading) */
.org-feature { padding: 0.6rem 0 1.1rem; text-align: center; }
.org-title {
  margin: 0.2rem 0 0.6rem;
  font-weight: 600;            /* bolder font as requested */
  color: var(--navy);
  line-height: 1.35;
  font-size: 1.6rem;
}
.org-title a { color: inherit; text-decoration: none; }
.org-title a:hover, .org-title a:focus-visible {
  text-decoration: none; /* override earlier underline rule */
  background: #f7f9fc;               /* soft silver wash */
  box-shadow: inset 0 -2px 0 #d4d9e0; /* thin silver underline effect */
  outline: none;
}
/* Subtle external-link indicator */
.org-title a[href^="http"]::after {
  content: '↗';
  font-size: 0.9rem;
  margin-left: 0.35rem;
  opacity: 0.45;
  transition: opacity 0.15s ease;
}
.org-title a:hover::after,
.org-title a:focus-visible::after { opacity: 0.7; }

/* Card title accent (non-underline) on hover */
.doc-box--ghost:hover .doc-box__header {
  background: #f2f5f9;   /* neutral silver wash */
}
.doc-box--ghost:hover .doc-box__title {
  color: var(--navy-600); /* slightly deeper navy, no orange */
}

/* Accessible focus for entire card */
.doc-box:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px #dfe4ea, var(--shadow-md); /* neutral silver focus ring */
}

/* Equal-height cards */
@media (min-width: 768px) { .doc-box { min-height: 220px; } }
@media (min-width: 1200px) { .doc-box { min-height: 240px; } }

@media (min-width: 768px) {
  .section-heading { padding: 1.75rem 0 1.1rem; }
  .section-heading--primary { padding-top: 2rem; }
  .org-title { font-size: 1.9rem; }
}
@media (min-width: 1200px) {
  .section-heading { padding: 2rem 0 1.25rem; }
  .section-heading--primary { padding-top: 2.25rem; }
  .org-title { font-size: 2rem; }
}

/* 4) Minor utilities */
.mt-0 { margin-top: 0; }
.mb-0 { margin-bottom: 0; }
.center { text-align: center; }

/* 5) Mobile/iframe scrolling safety */
html, body { height: auto !important; overflow-y: auto !important; }
body { -webkit-overflow-scrolling: touch; touch-action: pan-y; }