/* ——— Bazowe ustawienia ——— */
body{
  margin:0;
  font-size:20px;
  line-height:1.5;
  font-family:Arial, Helvetica, sans-serif;
}

header{
  text-align:center;
  color:#fff;
  background:#000;
}

main{
  max-width:800px;
  margin:auto;
  padding:0 20px;
}

/* p{ color:#666; } */
/* .faded{ opacity:.7; } */

/* Obrazy */
img{ max-width:100%; height:auto; }

/* Nagłówki */
h1{ border-bottom:5px solid #000; }
h2{ /* zostawione do własnych ustawień */ }

/* Stopka */
footer{
  color:#fff;
  background:#000;
  padding:20px;
  text-align:justify;
  margin-top:60px;
}

/* ——— Linki w CAŁYM serwisie ———
   Beż (#B87B5E) → hover/focus: biały na granacie (#375260),
   bez pogrubiania i bez „podskakiwania”. */
a, a:visited{
  color:#B87B5E;
  text-decoration:none;
  font-weight:400;
  background:transparent;
  transition:background-color .15s ease, color .15s ease;
}
a:hover,
a:focus{
  color:#fff;
  background:#375260;
  text-decoration:none;
  outline:none;
}
a:active{
  color:#fff;
  background:#375260;
  text-decoration:none;
  font-weight:400;
}
/* (opcjonalnie) focus z klawiatury */
a:focus-visible{
  outline:2px solid #375260;
  outline-offset:2px;
}

/* Bloki banera (obraz 800px, centrowany) */
.hero{ text-align:center; }
.hero img{
  width:800px;
  max-width:100%;
  height:auto;
  display:inline-block;
}

/* Mobile — nic nie powiększamy, tylko gwarantujemy białe tło */
@media (max-width:600px){
  html{ font-size:clamp(16px, 1.6vw + 12px, 18px); }
  body{ background:#fff; }
}

/* ===== Tabela LSO: lewo-just, bez kresek, delikatne cieniowanie ===== */
.tabela-lso{
  width: 100%;
  table-layout: fixed;          /* ładne łamanie długich fraz */
  border-collapse: separate;    /* rozdziel wiersze, żeby było „miękko” */
  border-spacing: 0 8px;        /* odstęp między wierszami (pion) */
}

.tabela-lso th,
.tabela-lso td{
  text-align: left;             /* wszystko do lewego brzegu */
  vertical-align: top;
  padding: .6rem .8rem;
  word-wrap: break-word;
  overflow-wrap: anywhere;
  /* bez ramek */
  border: 0;
}

/* Nagłówek – granat + białe litery */
.tabela-lso thead tr{
  background: #375260;                    /* var(--brand-navy) */
  color: #fff;
}
.tabela-lso thead th{
  font-weight: 700;
}
.tabela-lso thead th:first-child{ border-top-left-radius: 10px; }
.tabela-lso thead th:last-child { border-top-right-radius: 10px; }

/* Wiersze – delikatne tła (naprzemiennie granat/beż bardzo jasno) */
.tabela-lso tbody tr{
  /* fallback dla starszych przeglądarek */
  background: rgba(55,82,96,.06);
  /* nowocześniej (jeśli dostępne): */
  background: color-mix(in srgb, #375260 8%, #fff);
}
.tabela-lso tbody tr:nth-child(even){
  background: rgba(184,123,94,.06);
  background: color-mix(in srgb, #B87B5E 10%, #fff);
}

/* Zaokrąglone „pigułki” dla wierszy */
.tabela-lso tbody td:first-child{ border-bottom-left-radius: 10px; border-top-left-radius: 10px; }
.tabela-lso tbody td:last-child { border-bottom-right-radius: 10px; border-top-right-radius: 10px; }

/* Subtelny hover dla czytelności (opcjonalnie) */
.tabela-lso tbody tr:hover{
  background: rgba(55,82,96,.12);
  background: color-mix(in srgb, #375260 16%, #fff);
}

/* Wciągnięte Google Docs */
.gdoc img{ max-width:100%; height:auto; }
.gdoc table{ width:100%; border-collapse:collapse; }
.gdoc h1:first-child{ margin-top:0; }  /* jeśli w docu zaczyna się H1, niech nie „odjeżdża” */
.gdoc a, .gdoc a:visited{ color:#B87B5E; text-decoration:none; }
.gdoc a:hover, .gdoc a:focus{ color:#fff; background:#375260; }

/* Na bardzo wąskich ekranach – pozwól przewinąć, jeśli doc jest szeroki */
.gdoc{ overflow-x:auto; -webkit-overflow-scrolling:touch; }

/* ===== Stopka strony głównej i podstron ===== */

.site-footer{
  background: #000;
  color: #fff;
  margin-top: 60px;
  padding: 20px 0;
}

.site-footer .wrap{
  max-width: 800px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box;
}

.site-footer h2{
  margin: 0 0 12px 0;
}

.contact-list{
  list-style: none;
  padding: 0;
  margin: 0;
}

.contact-list li{
  margin: 6px 0;
}

.site-footer a{
  color: #B87B5E;
  text-decoration: none;
  font-weight: bold;
}

.site-footer a:hover{
  background: #375260;
  color: #fff;
  border-radius: 6px;
  padding: 2px 6px;
}

.footer-meta{
  margin-top: 14px;
  opacity: .85;
  font-size: .95em;
}


/* link button (pasuje do Twoich kolorów) */

.gdoc-open{
  max-width: 800px;
  margin: 10px auto 0 auto;
  padding: 0 20px;
  box-sizing: border-box;
}

.btn{
  display: inline-block;
  padding: .55rem .85rem;
  border-radius: 10px;
  background: #375260;
  color: #fff;
  text-decoration: none;
}

/* najważniejsze: na telefonie NIE osadzamy iframe,
   bo to on kradnie scroll – pokazujemy tylko przycisk */
@media (max-width: 600px){
  .gdoc-embed{ display:none; }
  .gdoc-open{ display:block; }
}

@media print{
  header, nav, .btn { display:none !important; }
  main{ max-width: 100% !important; padding: 0 !important; }
  body{ font-size: 18pt; color:#000; }
  h1{ border:0; }
}

/* --- Google Docs embeds: desktop OK, mobile = link only --- */

.gdoc-embed{ max-width:800px; margin:0 auto; padding:0 20px; box-sizing:border-box; }
.gdoc-iframe{ display:block; width:100%; height:360px; border:0; }
.gdoc-iframe--tall{ height:860px; }

.gdoc-open{ max-width:800px; margin:10px auto 0; padding:0 20px; box-sizing:border-box; }
.btn{
  display:inline-block;
  padding:.55rem .85rem;
  border-radius:10px;
  background:#375260;
  color:#fff;
  text-decoration:none;
}

/* Mobile: zabijamy iframe bez litości. */
@media (max-width: 800px){
  .gdoc-embed{ display:none !important; }
  .gdoc-open{ display:block !important; }
  iframe{ max-width:100% !important; }
}

/* --- Szerokość 800 niby-inkludów (iframe) intencji i ogłoszeń --- */

.gdoc-container {
  width: 800px;      /* dokładnie jak reszta strony */
  margin: 0 auto;        /* wyśrodkowanie */
  padding: 0;
}

.gdoc-container iframe {
  width: 800px;           /* zawsze dopasowane do kontenera */
  border: none;
  display: block;
  min-height: 600px;     /* startowa wysokość */
}

/* Na telefonie trochę mniejsze marginesy */
@media (max-width: 800px) {
  .gdoc-container {
    max-width: 800px;
    padding: 0 10px;
  }
}