* { box-sizing: border-box; margin:0; padding:0; }
body { font-family: "Arial", sans-serif; line-height:1.6; color:#333; background:#fdfcf9; }
a { text-decoration:none; color:inherit; }

/* ========================================== */

.container { max-width:1100px; margin:0 auto; padding:0 0.5rem; }

/* ========================================== */

.site-header {
  background-color: white;
  padding: 0.5rem 1rem;
  display: flex;
  justify-content: center;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.header-content {
  width: 100%;
  max-width: 1100px;
  display: flex;
  flex-direction: column; 
  gap: 0.25rem;
  align-items: center;
}

.site-title {
  font-size: 1.75rem;
  font-weight: 700;
  text-align: center;
  color: #111;
}

.search-container {
  display: flex;
  width: 100%;
  max-width: 450px;
  border: 1px solid #ddd;
  border-radius: 9999px;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
  transition: box-shadow 0.2s;
}

.search-container:hover {
  box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}

.site-search {
  flex: 1;
  border: none;
  padding: 0.55rem 1rem;
  font-size: 1rem;
  outline: none;
}

.search-btn {
  background-color: #f5f5f5;
  border: none;
  padding: 0 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s;
  color: #555;
}

.search-btn:hover {
  background-color: #e0e0e0;
  color: #111;
}

.search-btn svg {
  width: 20px;
  height: 20px;
}

@media (min-width: 768px) {
  .header-content {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  .site-title {
    text-align: left;
  }
}

/* ========================================== */

main {
    padding:0rem 0;
}

h1 { font-size:2rem; margin-bottom:1rem; color:#333; }
h2 { font-size:1.5rem; margin:1.5rem 0 1rem; color:#444; }
p, li { margin-bottom:0.85rem; font-size:1rem; }
ul { list-style: disc inside; }


/* ========================================== */


.site-footer {
  background-color: #f8f9fa;
  padding: 1rem 1rem;
  display: flex;
  justify-content: center;
  box-shadow: inset 0 1px 0 rgba(0,0,0,0.05);
}

.footer-content {
  text-align: center;
  max-width: 1100px;
}

.footer-home {
  display: inline-block;
  font-size: 1.5rem;
  font-weight: 700;
  color: #fb923c;
  text-decoration: none;
  margin-bottom: 0.2rem;
  transition: color 0.2s;
}

.footer-home:hover {
  color: #0056b3;
}

.footer-text {
  font-size: 0.85rem;
  color: #555;
  margin: 0;
  line-height: 1.4;
}





/* ========================================== */

#fullmap {
    width:100%;
    height:500px;
    /* margin-bottom:1.5rem; */
    /* margin-top:1rem; */
    /* border-radius:6px; */
    border:1px solid #ccc;
    margin:0 auto;
    z-index: 0;
}
@media(max-width:768px){
#fullmap { 
    height:350px;
}
}

/* ========================================== */

.breadcrumbs {
    width: 100%;
    background-color: #e07b39; /* muted orange */
    padding: 0.25rem;
    overflow-x: auto; /* allow horizontal scroll if needed */
}

.breadcrumbs .con {
    display: flex;
    flex-wrap: nowrap;
    white-space: nowrap;
    align-items: center;
    max-width:1100px;
    margin:0 auto;
    padding:0 0;
}

.breadcrumbs ol {
    list-style: none;
    display: flex;
    flex-wrap: nowrap;
    padding: 0;
    margin: 0;
    font-size: 0.95em;
}

.breadcrumbs li {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    margin:0;
}

.breadcrumbs li + li:before {
    content: '';
    display: inline-block;
    margin: 0 0.4em;
    width: 8px;
    padding: 0.25rem;
    height: 9px;
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 8"><path fill="white" d="M2 0l4 4-4 4z"/></svg>') no-repeat center;

    background-color: rgba(255,255,255,0.7);
}

.breadcrumbs a {
    text-decoration: none;
    color: #fff;
    font-weight: 500;
    display: flex;
    align-items: center;
    transition: color 0.2s ease;
}

.breadcrumbs a:hover {
    color: #ffd8b0;
}

.breadcrumbs svg {
    margin-right: 0.3em;
}





/* ========================================== */


#smap { 
    width:100%;
    height:400px;
    margin:1.5rem 0 2rem;
    /* max-width:1100px; */
    margin:0 auto;
    z-index: 0;
}
@media(max-width:768px){
    #smap { 
        height:350px;
    }
}


#lista-woj{
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    padding: 1rem;
    padding-bottom: 5rem;
}

#lista-woj h1 { margin-bottom: 16px; }
#lista-woj p.intro { 
    margin-bottom: 24px;
    line-height: 1.4;
    color: #555;
}
#lista-woj .woj-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  border-bottom: 1px solid #ccc;
  transition: background-color 0.2s;
}
#lista-woj .woj-row:hover { background-color: #f5f5f5; }
#lista-woj .woj-name a { font-weight: bold; text-decoration: none; color: #1a73e8; }
#lista-woj .woj-name a:hover { text-decoration: underline; }
#lista-woj .woj-stats { display: flex; gap: 20px; font-size: 0.95em; }
@media (max-width: 600px) {
  #lista-woj .woj-row { flex-direction: column; align-items: flex-start; }
  #lista-woj .woj-stats { flex-wrap: wrap; gap: 12px; margin-top: 6px; }
}





/* ========================================== */


#pmap { 
    width:100%;
    height:400px;
    margin:1.5rem 0 2rem;
    /* max-width:1100px; */
    margin:0 auto;
    z-index: 0;
}
@media(max-width:768px){
    #pmap { 
        height:350px;
    }
}

#lista-woj .intro .woj {
    text-transform: capitalize;
  }
  



.postcode-section {
padding: 0 0;

width: 100%;
max-width: 900px;
margin: 0 auto;
padding: 3rem 1rem;
padding-bottom: 5rem;
}

.postcode-section .section-header h1 {
font-size: 2rem;
margin-bottom: 6px;
}

.postcode-section .section-header .intro {
max-width: 900px;
/* color: #fcf7f7;  */
line-height: 1.45;
margin-bottom: 16px;
padding: 1rem 0 ;
}

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

.postcode-section .postcode-item {
display: block;
padding: 10px 8px;
border-bottom: 1px solid #eee;
text-decoration: none;
color: #222;
transition: background 0.15s ease;
}

.postcode-section .postcode-item:hover {
background: #f6f9ff;
}

.postcode-section .postcode-main {
display: flex;
justify-content: space-between;
align-items: baseline;
}

.postcode-section .postcode-code {
font-size: 1.05rem;
font-weight: 600;
}

.postcode-section .postcode-count {
font-size: 0.9rem;
color: #666;
white-space: nowrap;
}

.postcode-section .postcode-cities {
margin-top: 4px;
font-size: 0.9rem;
color: #555;
}

.postcode-section .postcode-cities .more {
color: #777;
margin-left: 6px;
font-size: 0.85rem;
}







/* ========================================== */








/* -------------------------------
   Layout
------------------------------- */
.container { max-width:1100px; margin:0 auto; padding:0 0.5rem; }
h1 { font-size:2rem; margin:1.5rem 0 0.5rem; }
h2 { font-size:1.4rem; margin:2.2rem 0 1rem; color:#444; }
.section { margin-bottom:2.5rem; }
.lead { font-size:1.05rem; color:#333; }

/* -------------------------------
   Map
------------------------------- */
#map { width:100%; height:450px; margin:1.5rem 0 2rem; max-width:1100px; margin:0 auto; z-index: 0;}
@media(max-width:768px){ #map { height:300px; } }

/* -------------------------------
   Lists / badges
------------------------------- */
ul.clean { list-style:none; padding:0; }
ul.clean li { margin-bottom:0.5rem; }
.city-badge { display:inline-block; background:#eef2ff; color:#3730a3; padding:0.25rem 0.6rem; border-radius:999px; font-size:0.85rem; margin:0.2rem 0.3rem 0.2rem 0; }

/* -------------------------------
   Post offices
------------------------------- */
.office { padding:0.8rem 0; border-bottom:1px solid #eee; }
.office strong { font-size:1rem; }
.office small { color:#555; }

/* -------------------------------
   Disclaimer
------------------------------- */
.disclaimer { background:#f8fafc; border:1px solid #e5e7eb; padding:1.2rem; font-size:0.9rem; color:#444; border-radius:6px; }



.postcode-intro {
    margin-bottom: 1.5em;
    line-height: 1.6;
}
.postcode-intro strong {
    color: #e63946;
}
.postcode-coverage {
    background-color: #f1f1f1;
    padding: 1em 1.5em;
    border-left: 4px solid #457b9d;
    margin-bottom: 1.5em;
}
.postcode-coverage h3 {
    margin-top: 0;
}


#pcmap { width:100%; height:450px; margin:1.5rem 0 2rem; max-width:1100px; margin:0 auto; z-index: 0;}
@media(max-width:768px){ #pcmap { height:300px; } }

.postcode-neighbours {
    margin: 2rem 0;
}
.postcode-neighbours .title {
    font-size: 1.5rem;
    margin-bottom: 0.6rem;
}
.postcode-neighbours ul {
    list-style: none;
    padding: 0;
}
.postcode-neighbours li.postcode-neighbour {
    background: #f1faee;
    border-left: 4px solid #457b9d;
    margin-bottom: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: 4px;
    transition: background 0.2s;
}
.postcode-neighbours li.postcode-neighbour:hover {
    background: #e0f2f1;
}
.postcode-neighbours a {
    text-decoration: none;
    color: #1d3557;
    font-weight: bold;
}
.postcode-neighbours a:hover {
    text-decoration: underline;
}






.po-section {
    margin: 2.5rem 0;
  }
  
  .po-title {
    font-size: 1.5rem;
    margin-bottom: 0.6rem;
  }
  
  .po-intro {
    font-size: 0.95rem;
    color: #4b5563;
    margin-bottom: 1.2rem;
    max-width: 850px;
  }
  
  .po-list {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  .po-item {
    padding: 0.9rem 0;
    border-bottom: 1px solid #e5e7eb;
  }
  
  .po-item:last-child {
    border-bottom: none;
  }
  
  .po-main {
    display: flex;
    align-items: center;
    gap: 0.6rem;
  }
  
  .po-name {
    font-size: 1rem;
  }
  
  .po-badge {
    font-size: 0.7rem;
    background: #e6f4ea;
    color: #166534;
    padding: 2px 6px;
    border-radius: 6px;
    font-weight: 600;
  }
  
  .po-address {
    font-size: 0.9rem;
    color: #374151;
    margin-top: 0.2rem;
  }
  
  .po-meta {
    font-size: 0.8rem;
    color: #6b7280;
    margin-top: 0.25rem;
  }
  
  .po-extra {
    font-size: 0.8rem;
    color: #6b7280;
    margin-top: 0.2rem;
  }
  
  .po-extra a {
    color: #2563eb;
    text-decoration: none;
  }
  
  .po-extra a:hover {
    text-decoration: underline;
  }



  .postcode-disclaimer {
    margin: 4rem 0;
    padding: 1rem 1rem;
    background: #fafafa;
    border-left: 4px solid #e0e0e0;
    font-size: 0.95rem;
    color: #555;
    line-height: 1.6;
    max-width: 960px;
  }
  
  .postcode-disclaimer p {
    margin: 0 0 12px 0;
  }
  
  .postcode-disclaimer p:last-child {
    margin-bottom: 0;
  }
  
  .postcode-disclaimer strong {
    color: #333;
    font-weight: 600;
  }
  
  .postcode-disclaimer a {
    color: #0066cc;
    text-decoration: none;
    border-bottom: 1px dotted #0066cc;
  }
  
  .postcode-disclaimer a:hover {
    text-decoration: none;
    border-bottom-style: solid;
  }
  




/* ========================================== */



.hero-bg {
  background: linear-gradient(135deg, #FFF7ED 0%, #FFFBF5 100%);
  color: #1F2937;
  padding: 0.5rem 1rem 2rem 1rem;
  text-align: center;
  font-family: 'Inter', sans-serif;
  position: relative;
  overflow: hidden;
}

.hero-bg::before {
  content: '';
  background-size: cover;
  opacity: 0.05;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}

.hero-bg h1 {
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 16px;
  max-width: 650px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.2;
  position: relative;
  z-index: 1;
}

.hero-bg p {
  font-size: 1.05rem;
  color: #4B5563;
  max-width: 550px;
  margin: 0 auto 1rem auto;
  line-height: 1.5;
  position: relative;
  z-index: 1;
}

.hero-bg .search-bar {
  display: flex;
  width: 100%;
  max-width: 480px;
  margin: 0 auto 0.25rem auto;
  border-radius: 999px;
  overflow: hidden;
  border: 2px solid #FB923C;
  background-color: #FFFFFF;
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
  position: relative;
  z-index: 1;

  flex-direction: row;
  align-items: stretch;
}

.hero-bg .search-bar input[type="text"] {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.5rem 1rem;
  border: none;
  font-size: 1rem;
  outline: none;
}

.hero-bg .search-bar button {
  flex-shrink: 0;
  background-color: #FB923C;
  border: none;
  padding: 0.75rem 1.5rem;
  font-weight: 600;
  color: #FFFFFF;
  cursor: pointer;
  transition: background 0.2s ease-in-out;
}

.hero-bg .search-bar button:hover {
  background-color: #F97316;
}

.hero-bg .stats-inline {
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: nowrap; 
  font-size: 0.9rem;
  color: #4B5563;
  position: relative;
  z-index: 1;
}

.hero-bg .stats-inline .stat-item {
  font-weight: 500;
}

.hero-bg .stats-inline .stat-item .number {
  font-weight: 700;
  color: #1F2937;
}

@media (max-width: 480px) {
  .hero-bg {
    padding: 0.25rem 0.25rem 1rem 0.25rem;
  }
  .hero-bg h1 {
    font-size: 1.8rem;
  }
  .hero-bg p {
    font-size: 0.9rem;
  }
  .hero-bg .search-bar {
    max-width: 100%;
  }
}





/* ========================================== */





#regions-section {
  font-family: Inter, system-ui, -apple-system, sans-serif;
  background: linear-gradient(180deg, #fffaf4 0%, #ffffff 100%);
  padding: 2rem 0;
}

#regions-section .regions-inner {
  max-width: 70rem;
  margin: 0 auto;
  padding: 0 0.75rem;
}

#regions-section .regions-header {
  text-align: center;
  margin-bottom: 2rem;
}

#regions-section .regions-header h2 {
  font-size: 1.9rem;
  line-height: 1.2;
  margin-bottom: 0.5rem;
  color: #1f2937;
}

#regions-section .regions-header p {
  max-width: 42rem;
  margin: 0 auto;
  font-size: 1rem;
  color: #4b5563;
}

#regions-section .regions-layout {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 1rem;
  align-items: start;
}

#regions-section .regions-map {
  height: 26rem;
  border-radius: 1.25rem;
  background:
    repeating-linear-gradient(
      45deg,
      #fff3e6,
      #fff3e6 0.75rem,
      #ffe6cc 0.75rem,
      #ffe6cc 1.5rem
    );
  border: 0.125rem dashed #fb923c;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  color: #9a3412;
  text-align: center;
}

#regions-section .regions-list {
  background: #ffffff;
  border-radius: 1.25rem;
  padding: 0.5rem;
  box-shadow: 0 0.75rem 2rem rgba(0,0,0,0.06);
}

#regions-section .regions-list h3 {
  padding: 0.5rem;
  font-size: 1.05rem;
  color: #1f2937;
}

#regions-section .regions-grid {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.25rem; 
}

#regions-section .regions-grid a {
  display: block;
  padding: 0.5rem 0.5rem;
  border-radius: 0.6rem;
  background: #fff7ed;
  color: #374151;
  text-decoration: none;
  font-size: 0.9rem;
  transition: background 0.15s ease, color 0.15s ease;
}

#regions-section .regions-grid li {
  margin: 0;
}

#regions-section .regions-grid a:hover {
  background: #ffedd5;
  color: #9a3412;
}

#regions-section .regions-text {
  max-width: 56rem;
  margin: 1rem auto 0 auto;
  font-size: 0.95rem;
  line-height: 1.65;
  color: #374151;
}

@media (max-width: 48rem) {
  #regions-section .regions-inner {
    padding: 0 0;
  }

  #regions-section .regions-layout {
    grid-template-columns: 1fr;
    gap: 1.75rem;
  }

  #regions-section .regions-map {
    height: 18rem;
    border-radius: 0;
    border-left: none;
    border-right: none;
  }

  #regions-section .regions-list {
    margin: 0 0.4rem;
    padding: 0.4rem;
  }

  #regions-section .regions-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.25rem;
  }

  #regions-section .regions-text {
    padding: 0 1rem;
  }
}








#powiaty-section {
  background: #ffffff;
  font-family: Inter, system-ui, -apple-system, sans-serif;
  padding: 4rem 0;
}

#powiaty-section .powiaty-inner {
  max-width: 70rem;
  margin: 0 auto;
  padding: 0 1.25rem;
}

#powiaty-section .powiaty-header {
  text-align: center;
  margin-bottom: 2.25rem;
}

#powiaty-section .powiaty-header h2 {
  font-size: 1.8rem;
  margin-bottom: 0.6rem;
  color: #1f2937;
}

#powiaty-section .powiaty-header p {
  max-width: 44rem;
  margin: 0 auto;
  font-size: 1rem;
  color: #4b5563;
}

#powiaty-section .powiaty-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.75rem;
}

#powiaty-section .powiat-card {
  background: #fffaf4;
  border: 1px solid #f1f5f9;
  border-radius: 0.9rem;
  padding: 0.75rem 0.9rem;
}

#powiaty-section .powiat-card a {
  display: block;
  text-decoration: none;
  color: inherit;
}

#powiaty-section .powiat-name {
  font-size: 0.95rem;
  font-weight: 600;
  color: #1f2937;
  margin-bottom: 0.15rem;
}

#powiaty-section .powiat-meta {
  font-size: 0.8rem;
  color: #6b7280;
}

#powiaty-section .powiaty-cta {
  text-align: center;
  margin-top: 2rem;
}
.regions-list .province-button {
  text-align: center;
  margin-top: 1rem;
}
.regions-list .province-button a {
  display: inline-block;
  padding: 0.5rem 1rem;
  border-radius: 999px;
  background: #fb923c;
  color: #ffffff;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
}



#powiaty-section .powiaty-cta a {
  display: inline-block;
  padding: 0.7rem 1.4rem;
  border-radius: 999px;
  background: #fb923c;
  color: #ffffff;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
}

#powiaty-section .powiaty-cta a:hover {
  background: #f97316;
}



@media (max-width: 64rem) {
  #powiaty-section .powiaty-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 40rem) {
  #powiaty-section {
    padding: 3rem 0;
  }

  #powiaty-section .powiaty-inner {
    padding: 0 1rem;
  }

  #powiaty-section .powiaty-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.6rem;
  }

  #powiaty-section .powiat-card {
    padding: 0.65rem 0.75rem;
  }
}










#top-postcodes-section {
  padding: 3rem 0;
  background: #fff;
}

#top-postcodes-section .tp-inner {
  max-width: 68rem;
  margin: 0 auto;
  padding: 0 0.5rem;
}

#top-postcodes-section .tp-header {
  max-width: 44rem;
  margin-bottom: 1.25rem;
}

#top-postcodes-section h2 {
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 1.25;
  margin-bottom: 0.4rem;
  color: #111;
}

#top-postcodes-section p {
  font-size: 0.95rem;
  line-height: 1.5;
  color: #555;
  margin: 0;
}

#top-postcodes-section .tp-divider {
  margin-top: 0.75rem;
  width: 3rem;
  height: 0.2rem;
  background: #fb923c;
  border-radius: 999px;
}

@media (min-width: 48rem) {
  #top-postcodes-section h2 {
    font-size: 1.8rem;
  }

  #top-postcodes-section p {
    font-size: 1rem;
  }
}

.container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 5px;
    font-family: Arial, sans-serif;
}
.postcode-card {
    background: #fff;
    border: 1px solid #ddd;
    border-left: 4px solid #fb923c;
    padding: 10px 15px;
    margin-bottom: 10px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    font-size: 0.9rem;
}
.postcode-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}
.postcode-header h3 {
    margin: 0;
    font-size: 1.1rem;
    color: #fb923c;
}
.address-count {
    font-weight: normal;
    font-size: 0.85rem;
    color: #555;
}
.cities-list {
    margin-top: 5px;
}
.cities-list span {
    display: inline;
}
.toggle-btn {
    display: inline-block;
    margin-top: 3px;
    font-size: 0.8rem;
    color: #fb923c;
    cursor: pointer;
    user-select: none;
}
.admin-info {
    font-size: 0.8rem;
    color: #666;
    margin-top: 5px;
}





#site-info-section {
  margin-top: 0;
  padding: 1rem 1rem;
  background: #f9f9f9;
  border-top: 1px solid #ddd;
  font-family: 'Inter', sans-serif;
}

#site-info-section .si-inner {
  max-width: 56rem;
  margin: 0 auto;
}

#site-info-section h2 {
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 1.6;
  margin-bottom: 0.5rem;
  margin-top: 0.25rem;
  color: #111;
}

#site-info-section p {
  font-size: 0.9rem;
  line-height: 1.6;
  color: #555;
  margin-bottom: 0.5rem;
}

#site-info-section a {
  color: #fb923c;
  text-decoration: none;
  font-weight: 500;
}

#site-info-section a:hover {
  text-decoration: underline;
}