.accordion-container{
  max-width:1340px;
  margin: 100px auto 50px;
  font-family: Arial, sans-serif;
}

.accordion-nav{
  display:flex;
  justify-content:space-around;
  border-bottom:2px solid #ddd;
  margin-bottom:20px;
  gap:.25rem;
}

.accordion-toggle{
  flex:1;
  padding:15px 10px;
  background:none;
  border:none;
  border-bottom:3px solid transparent;
  font-size:18px;
  font-weight:600;
  cursor:pointer;
  color:#222;
  transition:border-color .25s ease, color .25s ease, background-color .25s ease;
}
.accordion-toggle:hover{ color:#d40e14; }
.accordion-toggle.active,
.accordion-toggle[aria-selected="true"]{
  color:#d40e14;
  border-bottom-color:#d40e14;
}
.accordion-toggle:focus-visible{
  outline:2px solid #0a6cff; outline-offset:2px; border-radius:4px;
}

.accordion-content{
  display:block;
  padding:15px 20px;
  background-color:#fff;
}
.accordion-content[hidden]{ display:none !important; }

.accordion-container .acc-panel-standard{
  padding: 80px 50px;
}

@media (prefers-reduced-motion:no-preference){
  .accordion-content.open{ animation:fadeIn .18s ease both; }
  @keyframes fadeIn{ from{opacity:.85} to{opacity:1} }
}

.std-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:48px 40px;
  padding:10px;
  list-style:none;
  margin:0;
  text-align:center;
}
.std-item{ display:flex; flex-direction:column; align-items:center; justify-content:flex-start; }
.std-icon{
  width:56px; height:56px; margin:0 auto 12px;
  background-color:var(--red);
  -webkit-mask: url('../images/standards/default.svg') no-repeat center / contain;
          mask: url('../images/standards/default.svg') no-repeat center / contain;
}
.std-label{
  display:block;
  font-weight:700;
  font-size:16px;
  line-height:1.3;
  text-transform:uppercase;
  letter-spacing:.01em;
}

@media (max-width:1100px){ .std-grid{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (max-width:700px) {
	.std-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:36px 24px; }
	.accordion-container .acc-panel-standard{padding: 50px 20px;}
	.accordion-nav{ flex-direction:column; align-items:stretch; }
  	.accordion-toggle{ text-align:left; }
}
.std-znakomita-lokalizacja  .std-icon{ -webkit-mask-image:url('../img/standards/znakomita-lokalizacja.svg'); mask-image:url('../img/standards/znakomita-lokalizacja.svg'); }
.std-panoramiczne-okna      .std-icon{ -webkit-mask-image:url('../img/standards/panoramiczne-okna.svg');     mask-image:url('../img/standards/panoramiczne-okna.svg'); }
.std-przestronne-i-funkcjonalne-wnetrze .std-icon{ -webkit-mask-image:url('../img/standards/przestronne-i-funkcjonalne-wnetrze.svg'); mask-image:url('../img/standards/przestronne-i-funkcjonalne-wnetrze.svg'); }
.std-duzy-taras             .std-icon{ -webkit-mask-image:url('../img/standards/duzy-taras.svg');            mask-image:url('../img/standards/duzy-taras.svg'); }
.std-materialy-najwyzszej-jakosci .std-icon{ -webkit-mask-image:url('../img/standards/materialy-najwyzszej-jakosci.svg'); mask-image:url('../img/standards/materialy-najwyzszej-jakosci.svg'); }
.std-dopracowane-szczegoly  .std-icon{ -webkit-mask-image:url('../img/standards/dopracowane-szczegoly.svg'); mask-image:url('../img/standards/dopracowane-szczegoly.svg'); }
.std-doskonala-termoizolacja .std-icon{ -webkit-mask-image:url('../img/standards/doskonala-termoizolacja.svg'); mask-image:url('../img/standards/doskonala-termoizolacja.svg'); }
.std-niskie-koszty-eksploatacji .std-icon{ -webkit-mask-image:url('../img/standards/niskie-koszty-eksploatacji.svg'); mask-image:url('../img/standards/niskie-koszty-eksploatacji.svg'); }
