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

   RESET / PODSTAWY

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



* {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

}



html {

  scroll-behavior: smooth;

}



section {

  scroll-margin-top: 90px;

}



body {

  font-family: 'Montserrat', sans-serif;

  color: white;

  min-height: 100vh;

  background:

    radial-gradient(circle at 75% 35%, rgba(217, 1, 102, 0.9) 0%, rgba(217, 1, 102, 0.4) 20%, transparent 50%),

    radial-gradient(circle at 25% 70%, rgba(0, 0, 128, 0.8) 0%, transparent 55%),

    #000000;

}



h1, h2, h3 {

  font-weight: 600;

}



p {

  font-weight: 400;

}



img {

  width: 100%;

  display: block;

}



.container {

  width: min(1200px, 95%);

  margin: 0 auto;

}



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

   HEADER

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



.header {

  position: fixed;

  top: 0;

  width: 100%;

  background: transparent;

  transition: 0.3s;

  z-index: 100;

}



.header.scrolled {

  background: rgba(0, 0, 0, 0.7);

  backdrop-filter: blur(10px);

}



.nav {

  width: min(1200px, 95%);

  margin: 0 auto;

  display: flex;

  justify-content: space-between;

  align-items: center;

  padding: 20px 0;

  gap: 30px;

}



.logo {

  height: 60px;

  width: auto;

}



.logo-box {

  display: flex;

  align-items: center;

  gap: 16px;

  text-decoration: none;

  color: inherit;

  flex-shrink: 0;

}



.brand-text {

  display: flex;

  flex-direction: column;

  line-height: 1.15;

}



.brand-name {

  font-size: 14px;

  font-weight: 600;

  text-transform: uppercase;

  white-space: nowrap;

}



.brand-sub {

  font-size: 12px;

  color: rgba(255,255,255,0.7);

  white-space: nowrap;

}



.links {

  display: flex;

  gap: 30px;

}



.links a {

  color: white;

  text-decoration: none;

}



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

   PRZYCISKI

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



.btn {

  background: #d90166;

  padding: 15px 25px;

  border-radius: 30px;

  color: white;

  text-decoration: none;

  width: fit-content;

  transition: 0.2s ease;

}



.btn:hover {

  background: #b80057;

}



.btn-outline {

  background: transparent;

  border: 1px solid rgba(255,255,255,0.25);

}



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

   HERO

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



.hero {

  padding-top: 100px;

}



.hero-inner {

  display: flex;

  align-items: stretch;

}



.hero-image {

  width: 46%;

}



.hero-image img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.hero-text {

  width: 54%;

  padding: 40px 60px;

  display: flex;

  flex-direction: column;

  justify-content: center;

}



.hero-label {

  font-size: 14px;

  color: rgba(255,255,255,0.7);

  margin-bottom: 14px;

}



.hero-text h1 {

  font-size: clamp(36px, 4vw, 60px);

  margin-bottom: 20px;

}



.hero-description {

  margin-bottom: 14px;

  line-height: 1.6;

}



.hero-about {

  margin-bottom: 30px;

  color: rgba(255,255,255,0.85);

  line-height: 1.6;

}



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

   OFERTA

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



.oferta {

  padding: 40px 0 80px;

}



.oferta-title {

  text-align: center;

  font-size: 36px;

  margin-bottom: 10px;

}



.oferta-subtitle {

  text-align: center;

  margin-bottom: 40px;

  color: rgba(255,255,255,0.8);

}



.grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 30px;

}



.card {

  background: rgba(255,255,255,0.05);

  border-radius: 20px;

  overflow: hidden;

  display: flex;

  flex-direction: column;

}



.card-content {

  padding: 15px 22px 22px;

  display: flex;

  flex-direction: column;

  height: 100%;

}



.card h3 {

  font-size: 22px;

  margin-bottom: 6px;

}



.subtitle {

  margin-bottom: 10px;

}



.fixed-height {

  min-height: 48px;

}



.divider {

  height: 1px;

  background: rgba(255,255,255,0.2);

  margin: 12px 0 16px;

}



.card-desc {

  font-size: 14px;

  color: rgba(255,255,255,0.75);

  line-height: 1.6;

  margin-bottom: 20px;

}



.card-btn {

  margin-top: auto;

  background: #d90166;

  padding: 14px;

  border-radius: 999px;

  text-align: center;

  color: white;

  text-decoration: none;

  transition: 0.2s ease;

}



.card-btn:hover {

  background: #b80057;

  transform: translateY(-2px);

}



.card-btn.disabled {

  background: rgba(255,255,255,0.1);

  color: rgba(255,255,255,0.6);

  cursor: default;

  pointer-events: none;

}



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

   HARMONOGRAM SZKOLEŃ

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



.harmonogram {

  padding: 40px 0;

}



.harmonogram-inner {

  width: min(1200px, 95%);

  margin: 0 auto;

}



.harmonogram-title {

  text-align: center;

  font-size: 36px;

  margin-bottom: 10px;

}



.harmonogram-subtitle {

  text-align: center;

  margin-bottom: 35px;

  color: rgba(255,255,255,0.8);

}



.harmonogram-list {

  display: flex;

  flex-direction: column;

  gap: 18px;

}



.harmonogram-item {

  background: rgba(255,255,255,0.05);

  border-radius: 20px;

  padding: 22px 28px;

  display: flex;

  justify-content: space-between;

  gap: 30px;

  align-items: center;

}



.harmonogram-date {

  color: #d90166;

  font-weight: 600;

  margin-bottom: 8px;

}



.harmonogram-item h3 {

  margin: 0 0 6px;

  font-size: 22px;

}



.harmonogram-item p {

  color: rgba(255,255,255,0.8);

}



.harmonogram-meta {

  display: flex;

  align-items: center;

  gap: 20px;

  flex-shrink: 0;

}



.harmonogram-meta span {

  color: rgba(255,255,255,0.75);

  font-size: 14px;

}



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

   NEWSLETTER

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



.newsletter {

  padding: 20px 0 30px;

}



.newsletter-section-title {

  text-align: center;

  font-size: 36px;

  margin-bottom: 10px;

}



.newsletter-section-subtitle {

  text-align: center;

  color: rgba(255,255,255,0.8);

  margin-bottom: 40px;

}



.newsletter-inner {

  background: rgba(255,255,255,0.05);

  border-radius: 20px;

  padding: 50px;

}



.newsletter-grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 50px;

  align-items: center;

}



.newsletter-title {

  font-size: 36px;

  margin-bottom: 16px;

}



.newsletter-subtitle {

  margin-bottom: 14px;

  color: rgba(255,255,255,0.85);

  line-height: 1.6;

}



.newsletter-text {

  color: rgba(255,255,255,0.7);

  margin-bottom: 10px;

  line-height: 1.6;

}



.newsletter-bonus {

  margin-top: 15px;

  font-size: 14px;

  font-weight: 500;

  line-height: 1.6;

}



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

   MAILERLITE

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



#mlb2-39544779 .ml-form-embedWrapper {

  background: transparent !important;

  padding: 0 !important;

}



#mlb2-39544779 .ml-form-embedBody {

  background: transparent !important;

}



#mlb2-39544779 .ml-form-embedWrapper.embedForm {

  max-width: 100% !important;

}



#mlb2-39544779 .ml-form-checkboxRow input[type="checkbox"] {

  position: static !important;

  opacity: 1 !important;

  z-index: 1 !important;

  width: 18px !important;

  height: 18px !important;

  margin: 3px 10px 0 0 !important;

  accent-color: #d90166 !important;

  cursor: pointer !important;

}



#mlb2-39544779 .ml-form-checkboxRow label {

  display: flex !important;

  align-items: flex-start !important;

  gap: 10px !important;

  padding-left: 0 !important;

  cursor: pointer !important;

}



#mlb2-39544779 .ml-form-checkboxRow .label-description {

  position: static !important;

}



#mlb2-39544779 .ml-form-checkboxRow .label-description::before,

#mlb2-39544779 .ml-form-checkboxRow .label-description::after {

  display: none !important;

  content: none !important;

}



#mlb2-39544779 .ml-form-embedSubmit button,

#mlb2-39544779 .ml-form-embedSubmit button:focus,

#mlb2-39544779 .ml-form-embedSubmit button:active {

  background: #d90166 !important;

  color: white !important;

  border: none !important;

  outline: none !important;

  box-shadow: none !important;

}



#mlb2-39544779 .ml-form-embedSubmit button:hover {

  background: #b80057 !important;

}



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

   KONTAKT

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



.kontakt {

  padding: 50px 0;

}



.kontakt-title {

  text-align: center;

  font-size: 36px;

}



.kontakt-subtitle {

  text-align: center;

  margin-bottom: 40px;

  color: rgba(255,255,255,0.8);

  line-height: 1.6;

}



.kontakt-grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 40px;

}



.kontakt-left {

  background: rgba(255,255,255,0.05);

  padding: 40px 30px;

  border-radius: 20px;

  display: flex;

  flex-direction: column;

  align-items: center; 

  text-align: center;

}



.kontakt-brand {

  text-align: center;

  margin-bottom: 30px;

}



.kontakt-logo {

  height: 80px;

  width: auto;

  margin: 0 auto 16px;

  display: block;

}



.kontakt-brand-text {

  display: flex;

  flex-direction: column;

  gap: 4px;

}



.kontakt-name {

  font-size: 16px;

  font-weight: 600;

  text-transform: uppercase;

  letter-spacing: 1px;

}



.kontakt-sub {

  font-size: 13px;

  color: rgba(255,255,255,0.75);

}



.kontakt-details {

  display: flex;

  flex-direction: column;

  gap: 24px;

  align-items: center;

}



.kontakt-item {

  display: flex;

  flex-direction: column;

  gap: 6px;

  align-items: center;

}



.kontakt-label {

  font-size: 12px;

  color: rgba(255,255,255,0.6);

  text-transform: uppercase;

  letter-spacing: 1px;

}



.kontakt-item a,

.kontakt-item a:visited,

.kontakt-item p {

  color: white;

  text-decoration: none;

  font-size: 18px;

  line-height: 1.5;

  margin: 0;

}



.kontakt-item a:hover {

  color: #d90166;

}



.socials {

  display: flex;

  gap: 12px;

  margin-top: 20px;

  justify-content: center;

}



.social-link {

  width: 44px;

  height: 44px;

  background: rgba(255,255,255,0.08);

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  color: white;

  text-decoration: none;

  font-size: 18px;

  transition: 0.2s ease;

}



.social-link:hover {

  background: #d90166;

}



.map-box {

  height: 100%;

  min-height: 400px;

  border-radius: 20px;

  overflow: hidden;

}



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

   FOOTER

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



.footer {

  padding: 10px 0 30px;

  margin-top: 20px;

  text-align: center;

}



.footer-copy {

  font-size: 12px;

  color: rgba(255,255,255,0.5);

}



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

   PODSTRONY SZKOLEŃ

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



.szkolenie-hero {

  padding: 160px 0 80px;

}



.szkolenie-hero-inner {

  width: min(1200px, 95%);

  margin: 0 auto;

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 50px;

  align-items: center;

}



.szkolenie-image img {

  width: 100%;

  border-radius: 20px;

}



.szkolenie-text h1 {

  font-size: clamp(36px, 4vw, 56px);

  margin-bottom: 10px;

}



.szkolenie-label {

  font-size: 14px;

  text-transform: uppercase;

  letter-spacing: 1px;

  color: rgba(255,255,255,0.7);

  margin-bottom: 14px;

}



.szkolenie-subtitle {

  font-size: 20px;

  color: rgba(255,255,255,0.85);

  margin-bottom: 20px;

}



.szkolenie-description {

  font-size: 18px;

  line-height: 1.7;

  color: rgba(255,255,255,0.9);

  margin-bottom: 30px;

}



.szkolenie-section {

  padding: 24px 0;

}



.szkolenie-container {

  width: min(1200px, 95%);

  margin: 0 auto;

}



.szkolenie-section h2,

.szkolenie-cta h2 {

  font-size: clamp(28px, 3vw, 40px);

  margin-bottom: 20px;

  text-align: left;

}



.szkolenie-list {

  list-style: none;

  padding: 0;

  margin: 16px 0 0;

}



.szkolenie-list li {

  position: relative;

  padding-left: 28px;

  margin-bottom: 12px;

  line-height: 1.6;

}



.szkolenie-list li::before {

  content: "✔";

  position: absolute;

  left: 0;

  color: #d90166;

  font-weight: 700;

}



.szkolenie-paragraph {

  font-size: 18px;

  line-height: 1.7;

  color: rgba(255,255,255,0.9);

  max-width: 800px;

}



.szkolenie-cta {

  padding: 30px 0 70px;

}



.szkolenie-buttons {

  display: flex;

  gap: 16px;

  flex-wrap: wrap;

  margin-top: 24px;

}



.program-list {

  display: flex;

  flex-direction: column;

  gap: 18px;

}



.program-item {

  background: rgba(255,255,255,0.04);

  padding: 16px 18px;

  border-radius: 14px;

}



.program-title {

  font-weight: 600;

  margin-bottom: 6px;

}



.program-desc {

  font-size: 14px;

  color: rgba(255,255,255,0.75);

  line-height: 1.5;

}



.szkolenie-intro-strong {

  font-weight: 500;

  margin-bottom: 12px;

}



.szkolenie-intro {

  font-size: 16px;

  color: rgba(255,255,255,0.85);

  margin-bottom: 10px;

}



.price-box {

  margin: 24px 0 30px;

  padding: 20px;

  border-radius: 16px;

  background: rgba(255,255,255,0.05);

}



.price-label {

  font-size: 14px;

  color: rgba(255,255,255,0.6);

}



.price-value {

  font-size: 32px;

  font-weight: 600;

}



.szkolenie-note {

  margin-top: 14px;

  color: rgba(255,255,255,0.75);

}



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

   IKONY NA PODSTRONACH

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



.info-grid {

  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 20px;

  margin-top: 30px;

}



.info-item {

  display: flex;

  gap: 18px;

  align-items: center;

  background: rgba(255,255,255,0.05);

  padding: 22px 24px;

  border-radius: 16px;

}



.info-icon {

  width: 56px;

  min-width: 56px;

  display: flex;

  align-items: center;

  justify-content: center;

}



.info-icon svg {

  width: 56px;

  height: 56px;

}



.info-text {

  display: flex;

  flex-direction: column;

}



.info-title {

  font-weight: 600;

  font-size: 18px;

  margin-bottom: 4px;

}



.info-desc {

  color: rgba(255,255,255,0.78);

  font-size: 15px;

  line-height: 1.5;

}



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

   MOBILE

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

.menu-toggle {
  display: none;
}

@media (max-width: 900px) {
  section {
    scroll-margin-top: 80px;
  }

  .header {
    background: #000;
  }

  .nav {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 14px 0;
    gap: 14px;
  }

  .logo-box {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-shrink: 1;
  }

  .logo {
    width: 90px;
    height: auto;
  }

  .brand-text {
    display: flex;
    flex-direction: column;
    line-height: 1.15;
  }

  .brand-name {
    font-size: 11px;
  }

  .brand-sub {
    font-size: 10px;
  }

  .menu-toggle {
    display: block;
    margin-left: auto;
    background: transparent;
    color: white;
    border: none;
    font-size: 34px;
    cursor: pointer;
    line-height: 1;
  }

  .links {
    display: none;
    position: fixed;
    top: 58px;
    left: 0;
    width: 100%;
    background: #000;
    border-top: 1px solid rgba(255,255,255,0.12);
    border-radius: 0 0 24px 24px;
    padding: 28px 20px;
    flex-direction: column;
    align-items: center;
    gap: 22px;
    text-align: center;
    z-index: 1000;
  }

  .links a {
    font-size: 16px;
  }

  .links.active {
    display: flex;
  }

  .hero {
    padding-top: 110px;
  }

  .hero-inner {
    flex-direction: column;
  }

  .hero-image,
  .hero-text {
    width: 100%;
  }

  .hero-text {
    padding: 30px 0 10px;
  }

  .grid,
  .newsletter-grid,
  .kontakt-grid,
  .info-grid {
    grid-template-columns: 1fr;
  }

  .newsletter-inner {
    padding: 30px 20px;
  }

  .harmonogram-item {
    flex-direction: column;
    align-items: flex-start;
  }

  .harmonogram-meta {
    flex-direction: column;
    align-items: flex-start;
  }

  .info-item {
    padding: 20px;
  }

  .szkolenie-hero-inner {
    grid-template-columns: 1fr;
  }

  .szkolenie-hero {
    padding: 130px 0 60px;
  }
}
/* =====================
   POPRAWKA: NAGŁÓWKI CZĘŚĆ TEORETYCZNA / PRAKTYCZNA
===================== */

.szkolenie-section .szkolenie-container > h3 {
  display: block !important;
  width: 100% !important;
  font-size: 30px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  margin: 42px 0 18px !important;
  padding: 0 !important;
  color: #ffffff !important;
}

.szkolenie-section .szkolenie-container > h3 + .program-list {
  width: 100% !important;
}

@media (max-width: 900px) {
  .szkolenie-section .szkolenie-container > h3 {
    font-size: 24px !important;
    margin: 34px 0 14px !important;
  }
}