/* Eksploracja page styles — minimal, building on base.css */
:root {
  --tropics-green: #1f7a6f;
  --tropics-sand: #f4e9d5;
  --tropics-sky: #e8f6ff;
}

.breadcrumb { padding: 0.5rem 0; font-size: 0.9375rem; }
.breadcrumb ol { list-style: none; display: flex; gap: .5rem; flex-wrap: wrap; }
.breadcrumb li+li::before { content: "/"; margin: 0 .5rem; color: #6b7280; }

.hero { background: linear-gradient(180deg, var(--tropics-sky), #ffffff 60%); padding: 2rem 0; }
.hero__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 2rem; align-items: center; }
.hero__content .lead { margin: .75rem 0 1rem; max-width: 60ch; }
.hero__media img { width: 100%; height: auto; border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.hero__media figcaption { font-size: .875rem; color: #4b5563; margin-top: .5rem; }

.search { display: grid; gap: .5rem; margin-top: 1rem; }
.search input[type="search"] { padding: .75rem 1rem; border: 1px solid #cbd5e1; border-radius: 10px; }
.search__counter { font-size: .875rem; color: #374151; }

.quick-links { display: flex; gap: .75rem; flex-wrap: wrap; margin-top: 1rem; }
.quick-links a { padding: .5rem .75rem; border-radius: 999px; background: var(--tropics-sand); color: #0b3d3a; text-decoration: none; border: 1px solid #e5d6b8; }
.quick-links a:hover { background: #f9f0dc; }

.content { padding: 2rem 0; display: grid; gap: 1rem; }
.card { background: #ffffff; border: 1px solid #e5e7eb; border-radius: 12px; padding: 1.25rem; box-shadow: 0 4px 14px rgba(0,0,0,.06); }
.card h2 { margin-top: 0; }
.card .media img { width: 100%; height: auto; border-radius: 10px; margin: .5rem 0; }
.tips { margin: .5rem 0 0; padding-left: 1.25rem; }

.resources { padding: 2rem 0; border-top: 1px solid #e5e7eb; background: #fbfdfc; }
.resources__grid { display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.resources details { padding: .5rem 0; }
.resources .cta-inline { margin-top: .5rem; }

.callout { margin: 2rem 0; padding: 1.5rem; border-radius: 12px; background: linear-gradient(90deg, #e8fff6, #f2fbff); border: 1px solid #d9f2ea; text-align: center; }
.callout .btn { display: inline-block; margin-top: .5rem; padding: .7rem 1rem; border-radius: 10px; background: var(--tropics-green); color: #fff; text-decoration: none; }
.callout .btn:hover { filter: brightness(1.05); }

.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,1px,1px); white-space: nowrap; border: 0; }

/* Responsive */
@media (max-width: 1024px) {
  .hero__inner { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .resources__grid { grid-template-columns: 1fr; }
  .quick-links a { font-size: .9375rem; }
}