/*
Theme Name: Zróbmy coś dobrego
Theme URI: https://zrobmycosdobrego.org.pl/
Author: Fundacja Zróbmy coś dobrego
Description: Autorski motyw blokowy Fundacji Zróbmy coś dobrego. Przyjazny, dostępny i łatwy do edycji w Edytorze witryny.
Version: 1.0.0
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
Text Domain: zrobmy-cos-dobrego
*/

:root {
  --zcd-shadow: 0 18px 55px rgba(3, 40, 80, 0.10);
  --zcd-shadow-soft: 0 10px 32px rgba(3, 40, 80, 0.08);
}

html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
a { text-underline-offset: .18em; }

.zcd-header {
  position: relative;
  z-index: 20;
  border-bottom: 1px solid rgba(3, 40, 80, .08);
  background: rgba(255,255,255,.96);
  box-shadow: 0 3px 18px rgba(3, 40, 80, .04);
}

.zcd-header__inner {
  min-height: 92px;
}

.zcd-brand img {
  display: block;
  width: min(390px, 44vw);
  height: auto;
}

.zcd-header .wp-block-navigation-item__content {
  padding: .45rem .1rem;
  text-decoration: none;
}

.zcd-header .wp-block-navigation-item__content:hover,
.zcd-header .current-menu-item > .wp-block-navigation-item__content {
  color: var(--wp--preset--color--blue);
}

.zcd-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 87% 18%, rgba(21,128,197,.17), transparent 28%),
    radial-gradient(circle at 8% 83%, rgba(91,183,48,.15), transparent 30%),
    linear-gradient(135deg, #f5fbff 0%, #ffffff 54%, #f8fff4 100%);
}

.zcd-hero::after {
  content: "";
  position: absolute;
  right: -7rem;
  bottom: -11rem;
  width: 28rem;
  height: 28rem;
  border: 3.5rem solid rgba(255,166,0,.08);
  border-radius: 50%;
  pointer-events: none;
}

.zcd-hero__grid { position: relative; z-index: 1; }
.zcd-hero__logo img {
  filter: drop-shadow(0 20px 35px rgba(3,40,80,.12));
}

.zcd-eyebrow {
  display: inline-flex;
  width: fit-content;
  border-radius: 999px;
  padding: .48rem .85rem;
  background: rgba(21,128,197,.10);
  color: #075991;
  font-weight: 750;
  letter-spacing: .04em;
}

.zcd-card {
  height: 100%;
  border: 1px solid rgba(3,40,80,.08);
  border-radius: 22px;
  box-shadow: var(--zcd-shadow-soft);
  transition: transform .2s ease, box-shadow .2s ease;
}

.zcd-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--zcd-shadow);
}

.zcd-card__icon {
  display: grid;
  place-items: center;
  width: 3.1rem;
  height: 3.1rem;
  border-radius: 16px;
  font-size: 1.45rem;
  line-height: 1;
}

.zcd-card--green { border-top: 4px solid var(--wp--preset--color--green); }
.zcd-card--blue { border-top: 4px solid var(--wp--preset--color--blue); }
.zcd-card--orange { border-top: 4px solid var(--wp--preset--color--orange); }
.zcd-card--navy { border-top: 4px solid var(--wp--preset--color--navy); }
.zcd-card--green .zcd-card__icon { background: rgba(91,183,48,.13); }
.zcd-card--blue .zcd-card__icon { background: rgba(21,128,197,.12); }
.zcd-card--orange .zcd-card__icon { background: rgba(255,166,0,.14); }
.zcd-card--navy .zcd-card__icon { background: rgba(3,40,80,.10); }

.zcd-panel {
  border-radius: 28px;
  overflow: hidden;
  box-shadow: var(--zcd-shadow);
}

.zcd-panel--blue {
  background: linear-gradient(135deg, #053a6f 0%, #086aa8 100%);
}

.zcd-panel--green {
  background: linear-gradient(135deg, #397d1d 0%, #60b735 100%);
}

.zcd-metric {
  border-left: 3px solid var(--wp--preset--color--orange);
  padding-left: 1rem;
}

.zcd-post-card {
  border: 1px solid rgba(3,40,80,.08);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: var(--zcd-shadow-soft);
  background: #fff;
}

.zcd-post-card .wp-block-post-featured-image img {
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.zcd-page-hero {
  background: linear-gradient(135deg, #f2f9ff 0%, #f8fff4 100%);
  border-bottom: 1px solid rgba(3,40,80,.08);
}

.zcd-content > * + * { margin-block-start: 1.35rem; }

.zcd-footer a { color: inherit; }
.zcd-footer a:hover { color: var(--wp--preset--color--orange); }

.wp-block-button__link {
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.wp-block-button__link:hover {
  transform: translateY(-2px);
  box-shadow: 0 9px 20px rgba(3,40,80,.16);
}

@media (max-width: 900px) {
  .zcd-header__inner { min-height: 76px; }
  .zcd-brand img { width: min(340px, 64vw); }
  .zcd-hero__logo { max-width: 360px !important; margin-inline: auto !important; }
}

@media (max-width: 600px) {
  .zcd-brand img { width: min(275px, 70vw); }
  .zcd-hero { text-align: center; }
  .zcd-hero .wp-block-buttons { justify-content: center; }
  .zcd-eyebrow { margin-inline: auto; }
  .zcd-panel { border-radius: 22px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}