@import url('https://fonts.googleapis.com/css2?family=Alegreya:ital,wght@1,400;1,500;1,700&family=Quicksand:wght@400;500;700&display=swap');

@font-face {
  font-family: Bariol;
  src: url('/data/include/cms/karty-produktowe/NIVONA-CONTENT/fonts/Bariol_Regular.otf') format('opentype');
  font-display: swap;
}
@font-face {
  font-family: EthosMediumItalic;
  src: url('/data/include/cms/karty-produktowe/NIVONA-CONTENT/fonts/Ethos-MediumItalic.otf') format('opentype');
  font-display: swap;
}

/* Szerokosc jak w opisie NIVONA 8117. Style ograniczone do opisu. */
#nivona {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: block;
  color: #3c3c3b;
  font-family: Bariol, Quicksand, sans-serif;
  font-size: 20px;
  line-height: 1.5;
}
#nivona, #nivona * { box-sizing: border-box; }
#nivona img { display: block; max-width: 100%; height: auto; }
#nivona p, #nivona li {
  font-family: Bariol, Quicksand, sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.5;
}
#nivona p { margin: 0 0 20px; }
#nivona h2, #nivona h3, #nivona h4 {
  font-family: EthosMediumItalic, Alegreya, serif;
  font-style: italic;
  font-weight: 500;
  color: #000;
  margin: 0 0 20px;
  line-height: 1.15;
}
#nivona h2 { font-size: 42px; }
#nivona h3 { font-size: 36px; }
#nivona h4 { font-size: 26px; }
#nivona .row {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  clear: both;
}
#nivona .row::before, #nivona .row::after { content: none; }
#nivona [class*='col-'] {
  float: none;
  width: auto;
  max-width: none;
  min-width: 0;
  flex: initial;
  padding: 0;
}
#nivona .head { width: 100%; padding: 30px 24px; }
#nivona .hero-product {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: center;
}
#nivona .hero-product-img img { width: 100%; max-width: 500px; margin: auto; }
#nivona .hero-product-text { text-align: center; }
#nivona .hero-product-text h2 { font-size: 64px; }
#nivona .hero-product-text h2 span { color: #e4002c; font-size: 1.3em; }
#nivona .hero-product-text h4 { font-size: 28px; }
#nivona .nivona-content { display: block; width: 100%; }
#nivona .poczatek {
  display: grid;
  grid-template-columns: 2fr 3fr;
  gap: 32px;
  align-items: center;
  padding: 40px 24px;
}
#nivona .poczatek h3 { margin: 0; }
#nivona .poczatek-text p:last-child { margin-bottom: 0; }
#nivona .cechy-ikony { padding: 10px 24px 45px; }
#nivona .cechy-ikony img { width: 100%; margin: auto; }
#nivona .barista {
  display: grid;
  grid-template-columns: 5fr 7fr;
  gap: 32px;
  align-items: center;
  padding: 40px 24px;
  background-color: #f5f0ed;
}
#nivona .barista-img img { width: 100%; max-width: 450px; margin: auto; }
#nivona .barista-text h3 { color: #e4002c; }
#nivona .barista-text p:last-child { margin-bottom: 0; }
#nivona .mid-baner img { width: 100%; }
#nivona .napoje-ikony { padding: 24px; }
#nivona .napoje-ikony img { width: 100%; max-width: 1000px; margin: auto; }
#nivona .zalety-modelu {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: center;
  padding: 35px 24px;
}
#nivona .zalety-img img { width: 100%; }
#nivona .zalety-text ul { padding-left: 24px; margin: 24px 0 0; }
#nivona .zalety-text li { margin-bottom: 16px; }
#nivona .zalety-text li::marker { color: #e4002c; }
#nivona .funkcjonalnosci-modelu {
  display: grid;
  grid-template-columns: 7fr 5fr;
  gap: 36px;
  padding: 35px 24px;
  align-items: start;
}
#nivona .funkcjonalnosci-text h4 { margin-top: 32px; color: #e4002c; }
#nivona .funkcjonalnosci-text p { margin-bottom: 12px; }
#nivona .funkcjonalnosci-img img { width: 100%; }
#nivona .funkcjonalnosci-img h3 {
  font-size: 26px;
  text-align: center;
  margin: 16px 0 36px;
}
#nivona .porownanie { padding: 35px 0; }
#nivona .porownanie img { width: 100%; }
#nivona .poczatek.nivona-podsumowanie { grid-template-columns: 1fr 1fr; align-items: start; }
#nivona footer { position: relative; width: 100%; max-width: none; display: block; }
#nivona .footer-content {
  position: absolute;
  inset: 20px 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 0 24px;
  z-index: 1;
}
#nivona .footer-img img { width: 100%; max-width: 400px; margin: auto; }
#nivona .footer-bg img { width: 100%; }

@media (max-width: 900px) {
  #nivona .hero-product, #nivona .poczatek, #nivona .barista,
  #nivona .zalety-modelu, #nivona .funkcjonalnosci-modelu,
  #nivona .poczatek.nivona-podsumowanie { grid-template-columns: 1fr; }
  #nivona .hero-product-text h2 { font-size: 54px; }
  #nivona .poczatek h3 { text-align: center; }
  #nivona .zalety-img img { max-width: 600px; margin: auto; }
  #nivona .funkcjonalnosci-img img { max-width: 600px; margin: auto; }
  #nivona .footer-content { position: static; display: block; padding: 24px; }
}
@media (max-width: 480px) {
  #nivona, #nivona p, #nivona li { font-size: 18px; }
  #nivona h2 { font-size: 32px; }
  #nivona h3 { font-size: 30px; }
  #nivona h4, #nivona .hero-product-text h4 { font-size: 24px; }
  #nivona .head, #nivona .poczatek, #nivona .barista,
  #nivona .zalety-modelu, #nivona .funkcjonalnosci-modelu { padding: 28px 16px; gap: 24px; }
  #nivona .napoje-ikony, #nivona .cechy-ikony { padding: 20px 16px; }
}