@charset "UTF-8";
/* ==========================================================================
   BHP Pro Theme — Main Styles
   Paleta: granat #1A2B4A, akcent #E8600A, białe tło, Inter + Syne
   ========================================================================== */

/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@600;700;800&family=Inter:wght@400;500;600&display=swap');

/* --------------------------------------------------------------------------
   1. TOKENS & VARIABLES
   -------------------------------------------------------------------------- */
:root {
  --navy:        #1A2B4A;
  --navy-dark:   #0F1D33;
  --navy-mid:    #243558;
  --orange:      #E8600A;
  --orange-light:#F5843A;
  --orange-pale: #FEF0E6;
  --white:       #FFFFFF;
  --gray-50:     #F7F8FA;
  --gray-100:    #ECEEF2;
  --gray-200:    #D4D8E0;
  --gray-400:    #9199AA;
  --gray-600:    #5A6273;
  --gray-900:    #1C2028;

  --font-heading: 'Syne', system-ui, sans-serif;
  --font-body:    'Inter', system-ui, sans-serif;

  --radius-sm:   6px;
  --radius-md:   12px;
  --radius-lg:   18px;
  --radius-xl:   28px;

  --shadow-card: 0 2px 12px rgba(26,43,74,0.08);
  --shadow-hover:0 6px 24px rgba(26,43,74,0.14);

  --container:   1200px;
  --gap:         clamp(1.5rem, 4vw, 3rem);
  --section-y:   clamp(3rem, 8vw, 6rem);
}

/* --------------------------------------------------------------------------
   2. RESET & BASE
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; font-size: 16px; }

body {
  font-family: var(--font-body);
  color: var(--gray-900);
  background: var(--white);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

img, video { max-width: 100%; height: auto; display: block; }

a { color: var(--orange); text-decoration: none; transition: color .2s; }
a:hover { color: var(--orange-light); }

ul, ol { list-style: none; }

/* --------------------------------------------------------------------------
   3. TYPOGRAPHY
   -------------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  color: var(--navy);
  line-height: 1.2;
  font-weight: 700;
  /* Zawijanie — tytuły nigdy nie powinny być ucinane */
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
}

h1 { font-size: clamp(2rem, 5vw, 3.5rem); }
h2 { font-size: clamp(1.6rem, 3.5vw, 2.5rem); }
h3 { font-size: clamp(1.25rem, 2.5vw, 1.75rem); }
h4 { font-size: 1.2rem; }
h5 { font-size: 1rem; }

p { margin-bottom: 1rem; color: var(--gray-600); }
p:last-child { margin-bottom: 0; }

.lead {
  font-size: 1.2rem;
  color: var(--gray-600);
  line-height: 1.7;
}

/* --------------------------------------------------------------------------
   4. LAYOUT UTILITIES
   -------------------------------------------------------------------------- */
.container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.container--narrow { max-width: 800px; }
.container--wide   { max-width: 1400px; }

.section { padding: var(--section-y) 0; }
.section--gray { background: var(--gray-50); }
.section--navy { background: var(--navy); }
.section--navy-dark { background: var(--navy-dark); }

.grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--gap); }
.grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--gap); }
.grid-4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1.5rem; }

/* Siatka sekcji "Dlaczego my" — celowo SZTYWNE 3 kolumny (nie auto-fit),
   bo przy 6 elementach auto-fit z minmax(240px,1fr) rozciągał się do
   4 kolumn na szerokich ekranach, dając nierówny układ 4+2. */
.grid-usp {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gap);
}

@media (max-width: 860px) {
  .grid-usp { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 540px) {
  .grid-usp { grid-template-columns: 1fr; }
}

.flex-center { display: flex; align-items: center; justify-content: center; }
.flex-between { display: flex; align-items: center; justify-content: space-between; }

.text-center { text-align: center; }
.text-white { color: var(--white) !important; }
.text-orange { color: var(--orange); }
.text-muted { color: var(--gray-400); }

.mt-0 { margin-top: 0; }
.mb-0 { margin-bottom: 0; }
.mt-sm { margin-top: 1rem; }
.mt-md { margin-top: 2rem; }
.mt-lg { margin-top: 3rem; }
.mb-sm { margin-bottom: 1rem; }
.mb-md { margin-bottom: 2rem; }
.mb-lg { margin-bottom: 3rem; }

/* --------------------------------------------------------------------------
   5. BUTTONS
   -------------------------------------------------------------------------- */
.btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .75rem 1.75rem;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-size: .95rem;
  font-weight: 600;
  cursor: pointer;
  border: 2px solid transparent;
  transition: all .2s ease;
  text-decoration: none;
  line-height: 1;
  white-space: nowrap;
}

.btn--primary {
  background: var(--orange);
  color: var(--white);
  border-color: var(--orange);
}
.btn--primary:hover {
  background: var(--orange-light);
  border-color: var(--orange-light);
  color: var(--white);
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(232,96,10,.35);
}

.btn--outline {
  background: transparent;
  color: var(--navy);
  border-color: var(--navy);
}
.btn--outline:hover {
  background: var(--navy);
  color: var(--white);
  transform: translateY(-1px);
}

.btn--outline-white {
  background: transparent;
  color: var(--white);
  border-color: var(--white);
}
.btn--outline-white:hover {
  background: var(--white);
  color: var(--navy);
}

.btn--lg { padding: 1rem 2.5rem; font-size: 1.05rem; }
.btn--sm { padding: .5rem 1.25rem; font-size: .875rem; }

/* --------------------------------------------------------------------------
   6. HEADER & NAVIGATION
   -------------------------------------------------------------------------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(26,43,74,0.97);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 68px;
  gap: 1rem;
}

.site-logo {
  display: flex;
  align-items: center;
  gap: .55rem;
  text-decoration: none;
  flex-shrink: 0;
}

.site-logo__mark {
  width: 30px;
  height: 30px;
  background: var(--orange);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.site-logo__mark svg { width: 17px; height: 17px; fill: var(--white); }

.site-logo__text {
  font-family: var(--font-heading);
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--white);
  letter-spacing: -.02em;
  white-space: nowrap;
}

.site-logo__text span { color: var(--orange); }

.site-nav {
  display: flex;
  align-items: center;
  gap: .1rem;
  flex-wrap: wrap;
  /* Nawigacja może oddać miejsce CTA, ale logo i CTA nigdy się nie ściskają */
  flex-shrink: 1;
  min-width: 0;
}

.site-nav a {
  color: rgba(255,255,255,0.8);
  font-size: .85rem;
  font-weight: 500;
  padding: .5rem .65rem;
  border-radius: var(--radius-sm);
  transition: all .15s;
  text-decoration: none;
  white-space: nowrap;
}

.site-nav a:hover,
.site-nav a.current-menu-item {
  color: var(--white);
  background: rgba(255,255,255,0.1);
}

.site-header__cta {
  display: flex;
  align-items: center;
  gap: .4rem;
  flex-shrink: 0;
  flex-wrap: nowrap;
}

/* Przyciski w nagłówku — celowo bardziej kompaktowe niż domyślne .btn--sm,
   bo przy 3 przyciskach jednocześnie (koszyk widoczny dynamicznie + konto + CTA)
   standardowy padding nie mieści się w jednej linii na typowych szerokościach
   desktopu (~1200–1366px), powodując łamanie logo/menu do kolejnej linii.
   Skopiowany lokalnie zamiast modyfikować globalne .btn--sm, żeby nie wpłynąć
   na inne miejsca w motywie używające tej klasy. */
.site-header__cta .btn {
  white-space: nowrap;
  padding: .45rem .85rem;
  font-size: .8rem;
  gap: .35rem;
}

.site-header__cta .btn svg {
  width: 14px !important;
  height: 14px !important;
}

.hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  padding: .5rem;
  background: none;
  border: none;
}

.hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--white);
  border-radius: 2px;
  transition: all .3s;
}

/* --------------------------------------------------------------------------
   7. HERO
   -------------------------------------------------------------------------- */
.hero {
  background: linear-gradient(135deg, var(--navy-dark) 0%, var(--navy) 60%, var(--navy-mid) 100%);
  padding: clamp(4rem, 10vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.hero::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(232,96,10,0.12) 0%, transparent 70%);
  pointer-events: none;
}

.hero::after {
  content: '';
  position: absolute;
  bottom: -30%;
  left: -10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(255,255,255,0.04) 0%, transparent 70%);
  pointer-events: none;
}

.hero__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 6vw, 5rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: rgba(232,96,10,0.15);
  border: 1px solid rgba(232,96,10,0.3);
  color: var(--orange-light);
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: .35rem .875rem;
  border-radius: 100px;
  margin-bottom: 1.5rem;
}

.hero__title {
  color: var(--white);
  /* Kolumna zajmuje ~50% szerokości w gridzie 1fr/1fr, więc bazujemy
     na mniejszej wartości vw niż dla elementów pełnoszerokich —
     poprzedni clamp(…, 5vw, …) liczył tak, jakby tekst miał całą
     szerokość viewportu, przez co łamał się nienaturalnie w środku słów. */
  font-size: clamp(1.9rem, 3.2vw + 1rem, 3.25rem);
  font-weight: 800;
  line-height: 1.15;
  margin-bottom: 1.25rem;
  /* Zapobiega łamaniu pojedynczych słów w połowie (np. "zespół" na dwie linie) */
  overflow-wrap: normal;
  word-break: keep-all;
  hyphens: none;
}

.hero__title em {
  color: var(--orange);
  font-style: normal;
}

.hero__desc {
  color: rgba(255,255,255,0.7);
  font-size: 1.1rem;
  line-height: 1.7;
  margin-bottom: 2rem;
}

.hero__actions { display: flex; gap: 1rem; flex-wrap: wrap; }

.hero__stats {
  display: flex;
  gap: 1.25rem;
  margin-top: 2.5rem;
  padding-top: 2rem;
  border-top: 1px solid rgba(255,255,255,0.1);
}

.hero__stat {
  /* Zapobiega ściskaniu pojedynczego bloku statystyki poniżej szerokości jego treści */
  min-width: 0;
}

.hero__stat-num {
  font-family: var(--font-heading);
  /* Kolumna hero zajmuje ~50% szerokości ekranu (grid 1fr/1fr), więc rozmiar
     bazowy musi być mniejszy niż dla elementów pełnoszerokich. Dodatkowo
     clamp skaluje się bezpiecznie zamiast sztywnej wartości 2rem, która na
     węższych szerokościach wymuszała łamanie "5 000+" w środku liczby. */
  font-size: clamp(1.35rem, 2vw + .7rem, 1.85rem);
  font-weight: 800;
  color: var(--white);
  line-height: 1.05;
  /* Liczby typu "5 000+" nigdy nie powinny łamać się w środku mimo spacji */
  white-space: nowrap;
}

.hero__stat-label {
  font-size: .75rem;
  color: rgba(255,255,255,0.5);
  margin-top: .3rem;
  line-height: 1.4;
}

.hero__visual {
  position: relative;
  display: flex;
  justify-content: center;
}

.hero__badge-wrap {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--radius-xl);
  padding: 2.5rem 2rem;
  width: 100%;
  max-width: 400px;
}

.hero__badge-icon {
  width: 64px;
  height: 64px;
  background: var(--orange);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
}

.hero__badge-icon svg { width: 32px; height: 32px; fill: none; stroke: var(--white); stroke-width: 1.5; }

.hero__badge-title {
  font-family: var(--font-heading);
  color: var(--white);
  font-size: 1.3rem;
  font-weight: 700;
  margin-bottom: .5rem;
}

.hero__badge-meta { color: rgba(255,255,255,0.5); font-size: .85rem; margin-bottom: 1.25rem; }

.hero__progress-bar {
  height: 6px;
  background: rgba(255,255,255,0.1);
  border-radius: 100px;
  overflow: hidden;
  margin-bottom: .5rem;
}

.hero__progress-fill {
  height: 100%;
  background: var(--orange);
  border-radius: 100px;
  width: 0;
  animation: fillBar 1.2s 0.5s ease-out forwards;
}

@keyframes fillBar { to { width: 72%; } }

.hero__progress-label { color: rgba(255,255,255,0.4); font-size: .75rem; }

/* --------------------------------------------------------------------------
   8. SECTION HEADER
   -------------------------------------------------------------------------- */
.section-header {
  max-width: 640px;
  margin-bottom: clamp(2rem, 5vw, 3.5rem);
}

.section-header--center {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.section-eyebrow {
  display: inline-block;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--orange);
  margin-bottom: .75rem;
}

.section-title { margin-bottom: .75rem; }
.section-desc { color: var(--gray-600); font-size: 1.05rem; }

/* --------------------------------------------------------------------------
   9. COURSE CARDS
   -------------------------------------------------------------------------- */
.course-card {
  background: var(--white);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all .3s ease;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  position: relative;
}

.course-card:hover {
  box-shadow: var(--shadow-hover);
  transform: translateY(-4px);
  border-color: var(--gray-200);
  color: inherit;
}

.course-card:hover .course-card__progress-fill {
  width: 100%;
  opacity: .3;
}

.course-card__thumb {
  position: relative;
  aspect-ratio: 16/9;
  background: var(--gray-100);
  overflow: hidden;
}

.course-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}

.course-card:hover .course-card__thumb img { transform: scale(1.04); }

.course-card__badge {
  position: absolute;
  top: .875rem;
  left: .875rem;
  background: var(--orange);
  color: var(--white);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: .3rem .7rem;
  border-radius: 100px;
}

.course-card__body {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.course-card__category {
  font-size: .75rem;
  font-weight: 600;
  color: var(--orange);
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-bottom: .5rem;
}

.course-card__title {
  font-family: var(--font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: .75rem;
  line-height: 1.35;
  /* Zawijanie tytułów — nigdy nie ucinaj */
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
  overflow: visible;
}

.course-card__excerpt {
  font-size: .875rem;
  color: var(--gray-600);
  line-height: 1.6;
  margin-bottom: 1.25rem;
  flex: 1;
}

.course-card__meta {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: .8rem;
  color: var(--gray-400);
  margin-bottom: 1.25rem;
}

.course-card__meta-item {
  display: flex;
  align-items: center;
  gap: .35rem;
}

.course-card__meta-item svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  stroke: currentColor;
  fill: none;
}

.course-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 1rem;
  border-top: 1px solid var(--gray-100);
}

.course-card__price {
  font-family: var(--font-heading);
  font-size: 1.3rem;
  font-weight: 800;
  color: var(--navy);
}

.course-card__price--free { color: var(--orange); }

/* Progress bar inside card on hover */
.course-card__progress-fill {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  background: var(--orange);
  width: 0;
  opacity: 0;
  transition: width .6s ease, opacity .3s ease;
}

/* --------------------------------------------------------------------------
   10. FEATURES / USP BLOCK
   -------------------------------------------------------------------------- */
.feature-item {
  display: flex;
  gap: 1.25rem;
  align-items: flex-start;
}

.feature-item__icon {
  width: 48px;
  height: 48px;
  background: var(--orange-pale);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.feature-item__icon svg {
  width: 22px;
  height: 22px;
  stroke: var(--orange);
  fill: none;
  stroke-width: 1.75;
}

.feature-item__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--navy);
  margin-bottom: .35rem;
}

.feature-item__desc {
  font-size: .875rem;
  color: var(--gray-600);
  line-height: 1.6;
}

/* Numbered steps */
.step-item {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 1rem;
  align-items: flex-start;
}

.step-num {
  width: 48px;
  height: 48px;
  background: var(--navy);
  color: var(--white);
  font-family: var(--font-heading);
  font-size: 1.1rem;
  font-weight: 800;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* --------------------------------------------------------------------------
   11. TESTIMONIALS
   -------------------------------------------------------------------------- */
.testimonial-card {
  background: var(--white);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-lg);
  padding: 1.75rem;
  position: relative;
}

.testimonial-card__quote {
  font-size: .9375rem;
  color: var(--gray-600);
  line-height: 1.7;
  margin-bottom: 1.25rem;
}

.testimonial-card__quote::before {
  content: '"';
  font-family: var(--font-heading);
  font-size: 3rem;
  color: var(--orange);
  line-height: .5;
  display: block;
  margin-bottom: .5rem;
}

.testimonial-card__author {
  display: flex;
  align-items: center;
  gap: .875rem;
}

.testimonial-card__avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--navy);
  color: var(--white);
  font-weight: 600;
  font-size: .875rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.testimonial-card__name {
  font-weight: 600;
  font-size: .9rem;
  color: var(--navy);
}

.testimonial-card__role {
  font-size: .8rem;
  color: var(--gray-400);
}

.stars { color: var(--orange); font-size: .9rem; letter-spacing: .1em; margin-bottom: .5rem; }

/* --------------------------------------------------------------------------
   12. CTA BANNER
   -------------------------------------------------------------------------- */
.cta-banner {
  background: var(--navy);
  border-radius: var(--radius-xl);
  padding: clamp(2.5rem, 6vw, 4rem) clamp(1.5rem, 5vw, 4rem);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2rem;
  align-items: center;
}

.cta-banner__title {
  color: var(--white);
  font-size: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: .5rem;
}

.cta-banner__desc { color: rgba(255,255,255,.6); margin: 0; }

.cta-banner__actions { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; }

/* --------------------------------------------------------------------------
   13. SINGLE COURSE PAGE
   -------------------------------------------------------------------------- */
.course-hero {
  background: var(--navy-dark);
  padding: clamp(3rem, 6vw, 5rem) 0 0;
}

.course-hero__inner {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 3rem;
  align-items: start;
}

.course-hero__breadcrumb {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .8rem;
  color: rgba(255,255,255,.5);
  margin-bottom: 1.5rem;
}

.course-hero__breadcrumb a { color: rgba(255,255,255,.5); }
.course-hero__breadcrumb a:hover { color: var(--orange); }
.course-hero__breadcrumb svg { width: 12px; height: 12px; stroke: currentColor; fill: none; }

.course-hero__category {
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--orange);
  margin-bottom: .75rem;
}

.course-hero__title { color: var(--white); margin-bottom: 1rem; }

.course-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
  margin-bottom: 1.5rem;
  font-size: .875rem;
  color: rgba(255,255,255,.6);
}

.course-hero__meta-item {
  display: flex;
  align-items: center;
  gap: .4rem;
}

.course-hero__meta-item svg {
  width: 15px;
  height: 15px;
  stroke: var(--orange);
  fill: none;
}

.course-hero__desc { color: rgba(255,255,255,.7); font-size: 1rem; line-height: 1.7; }

/* Buy card */
.course-buy-card {
  background: var(--white);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(0,0,0,.25);
  position: sticky;
  top: 88px;
}

.course-buy-card__thumb {
  aspect-ratio: 16/9;
  background: var(--gray-100);
  overflow: hidden;
}

.course-buy-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.course-buy-card__body { padding: 1.5rem; }

.course-buy-card__price {
  font-family: var(--font-heading);
  font-size: 2rem;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: .25rem;
}

.course-buy-card__price--free { color: var(--orange); }
.course-buy-card__price-note { font-size: .8rem; color: var(--gray-400); margin-bottom: 1.25rem; }

.course-buy-card .btn { width: 100%; justify-content: center; margin-bottom: .75rem; }

.course-buy-card__includes { margin-top: 1.25rem; }
.course-buy-card__includes-title {
  font-weight: 600;
  font-size: .85rem;
  color: var(--navy);
  margin-bottom: .75rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.course-buy-card__includes li {
  display: flex;
  align-items: center;
  gap: .6rem;
  font-size: .85rem;
  color: var(--gray-600);
  padding: .4rem 0;
  border-bottom: 1px solid var(--gray-100);
}

.course-buy-card__includes li:last-child { border-bottom: none; }

.course-buy-card__includes svg {
  width: 15px;
  height: 15px;
  stroke: var(--orange);
  fill: none;
  flex-shrink: 0;
}

/* Course content tabs */
.course-tabs {
  background: var(--white);
  padding: 3rem 0;
}

.course-tabs__nav {
  display: flex;
  gap: 0;
  border-bottom: 2px solid var(--gray-100);
  margin-bottom: 2.5rem;
  overflow-x: auto;
}

.course-tabs__btn {
  padding: .875rem 1.5rem;
  font-weight: 600;
  font-size: .9rem;
  color: var(--gray-400);
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  cursor: pointer;
  white-space: nowrap;
  transition: all .2s;
  font-family: var(--font-body);
}

.course-tabs__btn:hover { color: var(--navy); }
.course-tabs__btn.active { color: var(--orange); border-bottom-color: var(--orange); }

.course-tabs__panel { display: none; }
.course-tabs__panel.active { display: block; }

/* Curriculum accordion */
.curriculum-section { margin-bottom: 1rem; }

.curriculum-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  background: var(--gray-50);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: background .15s;
}

.curriculum-section__header:hover { background: var(--gray-100); }
.curriculum-section__header.open { border-radius: var(--radius-md) var(--radius-md) 0 0; }

.curriculum-section__title {
  font-weight: 600;
  font-size: .95rem;
  color: var(--navy);
}

.curriculum-section__count {
  font-size: .8rem;
  color: var(--gray-400);
}

.curriculum-section__chevron {
  width: 18px;
  height: 18px;
  stroke: var(--gray-400);
  fill: none;
  transition: transform .3s;
}

.curriculum-section__header.open .curriculum-section__chevron { transform: rotate(180deg); }

.curriculum-lessons {
  border: 1px solid var(--gray-100);
  border-top: none;
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  display: none;
}

.curriculum-lessons.open { display: block; }

.curriculum-lesson {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: .875rem 1.25rem;
  border-bottom: 1px solid var(--gray-50);
  font-size: .875rem;
}

.curriculum-lesson:last-child { border-bottom: none; }

.curriculum-lesson__icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--orange-pale);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.curriculum-lesson__icon svg {
  width: 13px;
  height: 13px;
  stroke: var(--orange);
  fill: none;
}

.curriculum-lesson__title { flex: 1; color: var(--gray-600); }
.curriculum-lesson__duration { color: var(--gray-400); font-size: .8rem; }

/* --------------------------------------------------------------------------
   14. ABOUT PAGE
   -------------------------------------------------------------------------- */
.about-hero {
  background: var(--navy);
  padding: clamp(4rem, 8vw, 7rem) 0;
  text-align: center;
}

.about-hero__title { color: var(--white); }
.about-hero__desc { color: rgba(255,255,255,.7); max-width: 600px; margin: 1rem auto 0; font-size: 1.1rem; }

.stats-bar {
  background: var(--orange);
  padding: 2.5rem 0;
}

.stats-bar__inner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  text-align: center;
}

.stats-bar__num {
  font-family: var(--font-heading);
  font-size: 2.25rem;
  font-weight: 800;
  color: var(--white);
  line-height: 1;
  margin-bottom: .25rem;
}

.stats-bar__label { font-size: .85rem; color: rgba(255,255,255,.75); font-weight: 500; }

.team-card {
  text-align: center;
}

.team-card__photo {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: var(--navy);
  color: var(--white);
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1rem;
  overflow: hidden;
}

.team-card__photo img { width: 100%; height: 100%; object-fit: cover; }

.team-card__name { font-size: 1.1rem; font-weight: 700; color: var(--navy); margin-bottom: .25rem; }
.team-card__role { font-size: .875rem; color: var(--gray-400); }

/* Certifications */
.cert-item {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.25rem;
  background: var(--white);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-md);
}

.cert-item__icon {
  width: 48px;
  height: 48px;
  background: var(--orange-pale);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.cert-item__icon svg { width: 24px; height: 24px; stroke: var(--orange); fill: none; }
.cert-item__name { font-weight: 600; color: var(--navy); font-size: .95rem; }
.cert-item__issuer { font-size: .8rem; color: var(--gray-400); }

/* --------------------------------------------------------------------------
   15. CONTACT PAGE
   -------------------------------------------------------------------------- */
.contact-hero {
  background: var(--navy);
  padding: clamp(3rem, 6vw, 5rem) 0;
  text-align: center;
}

.contact-hero__title { color: var(--white); }
.contact-hero__desc { color: rgba(255,255,255,.65); margin: .75rem auto 0; max-width: 520px; }

.contact-grid {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 3rem;
  align-items: start;
}

.contact-info { display: flex; flex-direction: column; gap: 1.5rem; }

.contact-info-item {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}

.contact-info-item__icon {
  width: 44px;
  height: 44px;
  background: var(--orange-pale);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.contact-info-item__icon svg {
  width: 20px;
  height: 20px;
  stroke: var(--orange);
  fill: none;
}

.contact-info-item__label {
  font-size: .8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--gray-400);
  margin-bottom: .3rem;
}

.contact-info-item__value {
  font-weight: 600;
  color: var(--navy);
  font-size: .95rem;
}

.contact-form-wrap {
  background: var(--white);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-lg);
  padding: 2.5rem;
}

/* Form styles */
.form-group { margin-bottom: 1.25rem; }

.form-label {
  display: block;
  font-size: .85rem;
  font-weight: 600;
  color: var(--navy);
  margin-bottom: .4rem;
}

.form-control {
  width: 100%;
  padding: .75rem 1rem;
  border: 1.5px solid var(--gray-200);
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: .95rem;
  color: var(--gray-900);
  background: var(--white);
  transition: border-color .2s;
  appearance: none;
}

.form-control:focus {
  outline: none;
  border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(232,96,10,.12);
}

.form-control::placeholder { color: var(--gray-400); }

textarea.form-control { resize: vertical; min-height: 140px; }

select.form-control { cursor: pointer; }

.form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

/* WooCommerce / Sensei overrides */
.woocommerce-form input[type="email"],
.woocommerce-form input[type="text"],
.woocommerce-form input[type="password"],
.woocommerce-form textarea,
.sensei-login-form input {
  width: 100%;
  padding: .75rem 1rem;
  border: 1.5px solid var(--gray-200);
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: .95rem;
  color: var(--gray-900);
  background: var(--white);
  transition: border-color .2s;
}

.woocommerce-form input:focus,
.sensei-login-form input:focus {
  outline: none;
  border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(232,96,10,.12);
}

.woocommerce input.button,
.woocommerce button.button,
.woocommerce-page input.button,
.woocommerce-page button.button,
/* Complete Lesson / lesson navigation buttons — wszystkie warianty Sensei */
.sensei-complete-lesson-button,
.complete-lesson,
a.complete-lesson,
button.complete-lesson,
.sensei-stop-lesson,
.lesson-complete-link,
.sensei-lesson-buttons a,
.sensei-lesson-actions a,
.sensei-lesson-actions button,
#sensei-complete-lesson,
a[href*="lesson_complete"],
input[name="quiz_complete"],
.sensei-complete-lesson,
.wp-block-sensei-lms-lesson-actions a,
.wp-block-sensei-lms-lesson-actions button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .5rem !important;
  padding: .875rem 2rem !important;
  border-radius: var(--radius-md) !important;
  font-family: var(--font-body) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  border: 2px solid var(--orange) !important;
  background: var(--orange) !important;
  color: var(--white) !important;
  transition: all .2s ease !important;
  text-decoration: none !important;
  box-shadow: none !important;
  outline: none !important;
}

.sensei-complete-lesson-button:hover,
.complete-lesson:hover,
a.complete-lesson:hover,
button.complete-lesson:hover,
.sensei-lesson-buttons a:hover,
.sensei-lesson-actions a:hover,
.sensei-lesson-actions button:hover,
.wp-block-sensei-lms-lesson-actions a:hover,
.wp-block-sensei-lms-lesson-actions button:hover {
  background: var(--orange-light) !important;
  border-color: var(--orange-light) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 16px rgba(232,96,10,.35) !important;
  color: var(--white) !important;
}



.woocommerce .woocommerce-message,
.woocommerce .woocommerce-error,
.woocommerce .woocommerce-info {
  border-top-color: var(--orange);
  border-radius: var(--radius-md);
}

/* Sensei progress */
.sensei-course-progress { margin: 1.5rem 0; }

.sensei-course-progress-bar {
  height: 8px;
  background: var(--gray-100);
  border-radius: 100px;
  overflow: hidden;
}

.sensei-course-progress-bar-inner {
  height: 100%;
  background: var(--orange);
  border-radius: 100px;
  transition: width .6s ease;
}

/* --------------------------------------------------------------------------
   16. LEGAL / POLICY PAGES (simple)
   -------------------------------------------------------------------------- */
.legal-page {
  padding: 3rem 0 5rem;
}

.legal-page__header {
  padding: 3rem 0 2rem;
  border-bottom: 1px solid var(--gray-100);
  margin-bottom: 3rem;
}

.legal-page__title { color: var(--navy); }
.legal-page__meta { font-size: .875rem; color: var(--gray-400); margin-top: .5rem; }

.legal-content h2 {
  font-size: 1.3rem;
  margin: 2.5rem 0 .875rem;
  color: var(--navy);
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--gray-100);
}

.legal-content h3 {
  font-size: 1.05rem;
  margin: 1.75rem 0 .5rem;
  color: var(--navy-mid);
}

.legal-content p { color: var(--gray-600); margin-bottom: 1rem; line-height: 1.8; }

.legal-content ul, .legal-content ol {
  margin: .75rem 0 1.25rem 1.5rem;
  list-style: disc;
}

.legal-content li { color: var(--gray-600); margin-bottom: .4rem; line-height: 1.7; }

.legal-content a { color: var(--orange); }
.legal-content a:hover { text-decoration: underline; }

.legal-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.25rem 0;
  font-size: .875rem;
}

.legal-content th {
  background: var(--gray-50);
  font-weight: 600;
  color: var(--navy);
  padding: .75rem 1rem;
  text-align: left;
  border: 1px solid var(--gray-200);
}

.legal-content td {
  padding: .75rem 1rem;
  border: 1px solid var(--gray-200);
  color: var(--gray-600);
}

/* --------------------------------------------------------------------------
   17. FOOTER
   -------------------------------------------------------------------------- */
.site-footer {
  background: var(--navy-dark);
  color: rgba(255,255,255,.65);
  padding: clamp(3rem, 6vw, 5rem) 0 0;
}

.site-footer__grid {
  display: grid;
  grid-template-columns: 1.5fr 2fr 1fr;
  gap: 3rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

/* Środkowa kolumna kursy — 2 wewnętrzne kolumny */
.site-footer__col--courses {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  align-items: start;
}

/* Ukryty nagłówek drugiej kolumny kursów — zajmuje miejsce dla wyrównania */
.site-footer__col--courses-right { padding-top: 2.1rem; }

.site-footer__brand .site-logo { margin-bottom: 1rem; }
.site-footer__tagline { font-size: .875rem; line-height: 1.7; }

.site-footer__col-title {
  font-family: var(--font-heading);
  font-size: .85rem;
  font-weight: 700;
  color: var(--white);
  text-transform: uppercase;
  letter-spacing: .1em;
  margin-bottom: 1.25rem;
}

.site-footer__links { display: flex; flex-direction: column; gap: .5rem; }

.site-footer__links a {
  color: rgba(255,255,255,.5);
  font-size: .875rem;
  text-decoration: none;
  transition: color .15s;
}

.site-footer__links a:hover { color: var(--white); }

.site-footer__newsletter p { font-size: .875rem; margin-bottom: 1rem; }

.newsletter-form { display: flex; gap: .5rem; }

.newsletter-form input {
  flex: 1;
  padding: .65rem .875rem;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: var(--radius-sm);
  color: var(--white);
  font-size: .875rem;
  font-family: var(--font-body);
}

.newsletter-form input::placeholder { color: rgba(255,255,255,.3); }
.newsletter-form input:focus { outline: none; border-color: var(--orange); }

.newsletter-form button {
  padding: .65rem 1.25rem;
  background: var(--orange);
  color: var(--white);
  border: none;
  border-radius: var(--radius-sm);
  font-weight: 600;
  font-size: .875rem;
  cursor: pointer;
  font-family: var(--font-body);
  transition: background .2s;
}

.newsletter-form button:hover { background: var(--orange-light); }

.site-footer__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.5rem 0;
  font-size: .8rem;
  color: rgba(255,255,255,.35);
  flex-wrap: wrap;
  gap: .75rem;
}

.site-footer__bottom-links { display: flex; gap: 1.5rem; }

.site-footer__bottom-links a {
  color: rgba(255,255,255,.35);
  text-decoration: none;
  transition: color .15s;
}

.site-footer__bottom-links a:hover { color: rgba(255,255,255,.65); }

/* --------------------------------------------------------------------------
   18. MOBILE NAV
   -------------------------------------------------------------------------- */
.mobile-nav {
  display: none;
  position: fixed;
  inset: 0;
  background: var(--navy-dark);
  z-index: 200;
  padding: 2rem;
  flex-direction: column;
  gap: 1.5rem;
}

.mobile-nav.open { display: flex; }

.mobile-nav__close {
  align-self: flex-end;
  background: none;
  border: none;
  color: var(--white);
  cursor: pointer;
  padding: .5rem;
}

.mobile-nav__links { display: flex; flex-direction: column; gap: .75rem; }

.mobile-nav__links a {
  color: var(--white);
  font-size: 1.5rem;
  font-family: var(--font-heading);
  font-weight: 700;
  text-decoration: none;
  padding: .5rem 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

/* --------------------------------------------------------------------------
   19. RESPONSIVE
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .site-footer__grid { grid-template-columns: 1fr 1fr; }
  .course-hero__inner { grid-template-columns: 1fr; }
  .course-buy-card { position: static; }
  .contact-grid { grid-template-columns: 1fr; }
  .cta-banner { grid-template-columns: 1fr; text-align: center; }
  .cta-banner__actions { justify-content: center; }
}

@media (max-width: 768px) {
  .hero__inner { grid-template-columns: 1fr; }
  .hero__visual { display: none; }
  .hero__stats { gap: 1.25rem; }
  .site-nav { display: none; }
  .site-header__cta .btn--outline-white { display: none; }
  .hamburger { display: flex; }
  .stats-bar__inner { grid-template-columns: repeat(2, 1fr); }
  .site-footer__grid { grid-template-columns: 1fr; }
  .form-grid-2 { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   20. WORDPRESS PAGE BUILDER & WC COMPAT
   -------------------------------------------------------------------------- */
.wp-block-group { margin: 0; }
.alignwide { max-width: calc(var(--container) + 4rem); }
.alignfull { max-width: 100%; }

.woocommerce-breadcrumb { font-size: .875rem; color: var(--gray-400); margin-bottom: 1.5rem; }
.woocommerce-breadcrumb a { color: var(--gray-400); }

.sensei-breadcrumb { font-size: .875rem; color: var(--gray-400); margin-bottom: 1.5rem; }

.entry-content { max-width: 760px; }
.entry-content p { color: var(--gray-600); line-height: 1.8; margin-bottom: 1.25rem; }
.entry-content ul, .entry-content ol { margin: .75rem 0 1.25rem 1.5rem; list-style: disc; }
.entry-content li { color: var(--gray-600); margin-bottom: .4rem; }
.entry-content h2, .entry-content h3 { margin-top: 2rem; margin-bottom: .75rem; }

/* WC entry-content override — full width, no max-width cap.
   Selektor złożony (.entry-content.entry-content--wc zamiast samego
   .entry-content--wc) celowo zwiększa specyficzność z 0-1-0 do 0-2-0,
   żeby wygrywać z .entry-content NIEZALEŻNIE od kolejności reguł w pliku
   — poleganie wyłącznie na kolejności źródłowej przy równej specyficzności
   jest kruche (np. przy przyszłym przenoszeniu/sortowaniu sekcji CSS). */
.entry-content.entry-content--wc { max-width: 100%; }
.section--wc { padding-top: 2.5rem; padding-bottom: 4rem; }

/* --------------------------------------------------------------------------
   21. SVG ICON SAFETY — prevent inline SVGs from stretching
   -------------------------------------------------------------------------- */
/* Any SVG that isn't given an explicit size class stays small */
nav svg, button svg, a svg, .btn svg,
.breadcrumb svg, .site-nav svg, .site-logo svg,
.course-card__meta-item svg,
.feature-item__icon svg,
.contact-info-item__icon svg,
.cert-item__icon svg,
.curriculum-lesson__icon svg,
.course-buy-card__includes svg,
.course-hero__meta-item svg,
.footer-icon,
.hero__eyebrow svg {
  width: 16px !important;
  height: 16px !important;
  flex-shrink: 0;
  display: inline-block;
  vertical-align: middle;
}

/* Breadcrumb separator chevron */
.breadcrumb-sep {
  width: 12px !important;
  height: 12px !important;
  opacity: .5;
  display: inline-block;
  vertical-align: middle;
}

/* Buttons – slightly larger */
.btn svg { width: 18px !important; height: 18px !important; }

/* Feature / cert icons – their container controls visual size */
.feature-item__icon svg,
.contact-info-item__icon svg,
.cert-item__icon svg,
.course-buy-card__includes svg,
.course-hero__meta-item svg,
.curriculum-lesson__icon svg {
  width: 20px !important;
  height: 20px !important;
}

/* Hero badge icon – stays big as intended */
.hero__badge-icon svg {
  width: 32px !important;
  height: 32px !important;
}

/* Site logo mark */
.site-logo__mark svg {
  width: 20px !important;
  height: 20px !important;
}

/* --------------------------------------------------------------------------
   22. WOOCOMMERCE – MY ACCOUNT / CART / CHECKOUT
   -------------------------------------------------------------------------- */

/* My Account layout — flex (nie grid, bo WooCommerce/Sensei na tej instalacji
   nadpisuje grid własnym display; flex potwierdzone jako działające) */
.woocommerce-account .woocommerce,
.woocommerce-page.woocommerce-account .woocommerce {
  display: flex;
  flex-direction: row;
  gap: 2.5rem;
  align-items: flex-start;
  max-width: 100%;
}

/* Nav sidebar */
.woocommerce-account .woocommerce-MyAccount-navigation {
  background: var(--gray-50);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li {
  border-bottom: 1px solid var(--gray-100);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child {
  border-bottom: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
  display: block;
  padding: .75rem 1.25rem;
  color: var(--gray-600);
  font-size: .9rem;
  font-weight: 500;
  text-decoration: none;
  transition: all .15s;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
  background: var(--orange-pale);
  color: var(--orange);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
  font-weight: 600;
  border-left: 3px solid var(--orange);
}

/* Content area */
.woocommerce-account .woocommerce-MyAccount-content {
  min-width: 0;
  background: var(--white);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-lg);
  padding: 1.75rem 2rem;
}

.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3 {
  font-size: 1.3rem;
  color: var(--navy);
  margin-bottom: 1.25rem;
  padding-bottom: .75rem;
  border-bottom: 1px solid var(--gray-100);
}

.woocommerce-account .woocommerce-MyAccount-content p {
  color: var(--gray-600);
  font-size: .95rem;
  line-height: 1.75;
  margin-bottom: 1rem;
}

.woocommerce-account .woocommerce-MyAccount-content p:last-child {
  margin-bottom: 0;
}

.woocommerce-account .woocommerce-MyAccount-content p a {
  color: var(--orange);
  font-weight: 600;
  text-decoration: none;
}

.woocommerce-account .woocommerce-MyAccount-content p a:hover {
  color: var(--orange-light);
  text-decoration: underline;
}

.woocommerce-account .woocommerce-MyAccount-content strong {
  color: var(--navy);
}

/* Pusty wrapper na powiadomienia WC (np. po edycji adresu) — nie zajmuje
   miejsca gdy pusty, ale gdy WooCommerce wstrzyknie do niego komunikat,
   dostaje odstęp od reszty treści. */
.woocommerce-account .woocommerce-notices-wrapper:not(:empty) {
  margin-bottom: 1.5rem;
}

/* Tables in My Account */
.woocommerce-account table.woocommerce-orders-table,
.woocommerce-account table.shop_table {
  width: 100%;
  border-collapse: collapse;
  font-size: .9rem;
}

.woocommerce-account table.woocommerce-orders-table th,
.woocommerce-account table.shop_table th {
  background: var(--gray-50);
  padding: .75rem 1rem;
  text-align: left;
  font-weight: 600;
  color: var(--navy);
  border-bottom: 2px solid var(--gray-200);
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.woocommerce-account table.woocommerce-orders-table td,
.woocommerce-account table.shop_table td {
  padding: .875rem 1rem;
  border-bottom: 1px solid var(--gray-100);
  color: var(--gray-600);
}

.woocommerce-account table.woocommerce-orders-table tr:last-child td,
.woocommerce-account table.shop_table tr:last-child td {
  border-bottom: none;
}

/* Welcome message */
.woocommerce-account .woocommerce-MyAccount-content > p:first-child {
  background: var(--orange-pale);
  border: 1px solid rgba(232,96,10,.2);
  border-radius: var(--radius-md);
  padding: 1rem 1.25rem;
  font-size: .9rem;
  color: var(--gray-600);
  margin-bottom: 1.5rem;
}

/* Cart page */
.woocommerce-cart .woocommerce,
.woocommerce-checkout .woocommerce {
  max-width: 100%;
}

.woocommerce table.shop_table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 2rem;
}

.woocommerce table.shop_table th {
  background: var(--gray-50);
  padding: .875rem 1rem;
  text-align: left;
  font-weight: 600;
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--navy);
  border-bottom: 2px solid var(--gray-200);
}

.woocommerce table.shop_table td {
  padding: 1rem;
  border-bottom: 1px solid var(--gray-100);
  vertical-align: middle;
}

/* Checkout columns */
.woocommerce-checkout .woocommerce .col2-set {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  align-items: start;
}

/* Cart total box */
.woocommerce .cart_totals,
.woocommerce-page .cart_totals {
  background: var(--gray-50);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-lg);
  padding: 1.5rem;
  margin-top: 2rem;
}

.woocommerce .cart_totals h2 {
  font-size: 1.2rem;
  margin-bottom: 1rem;
  color: var(--navy);
}

/* WC notices */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
  border-radius: var(--radius-md);
  padding: 1rem 1.25rem;
  margin-bottom: 1.5rem;
  font-size: .9rem;
  list-style: none;
}

.woocommerce-message { background: #EAF3DE; color: #3B6D11; border: 1px solid #97C459; }
.woocommerce-error   { background: #FCEBEB; color: #A32D2D; border: 1px solid #F09595; }
.woocommerce-info    { background: var(--orange-pale); color: var(--orange); border: 1px solid rgba(232,96,10,.3); }

/* WC My Account — mobile */
@media (max-width: 768px) {
  .woocommerce-account .woocommerce,
  .woocommerce-page.woocommerce-account .woocommerce {
    flex-direction: column;
  }
  .woocommerce-checkout .woocommerce .col2-set {
    grid-template-columns: 1fr;
  }
}

/* --------------------------------------------------------------------------
   23. SINGLE PRODUCT PAGE (WooCommerce) — BHP Pro
   Używamy prefiksu bhp- żeby nie kolidować z klasami WC/Sensei
   -------------------------------------------------------------------------- */

.bhp-product-page { background: var(--white); }

/* Breadcrumb */
.product-breadcrumb {
  display: flex;
  align-items: center;
  gap: .4rem;
  flex-wrap: wrap;
  font-size: .8rem;
  color: var(--gray-400);
  padding: 1.75rem 0 0;
  margin-bottom: 1.5rem;
}
.product-breadcrumb a { color: var(--gray-400); text-decoration: none; }
.product-breadcrumb a:hover { color: var(--orange); }
.product-breadcrumb .bc-sep { opacity: .5; }

.product-hero { padding: 0 0 3rem; }

/* ═══ 2-KOLUMNOWY GRID ═══ */
.bhp-product-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: start;
}

/* ═══ GALERIA ═══ */
.bhp-product-gallery {}

.bhp-gallery-main {
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--gray-50);
  aspect-ratio: 4/3;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bhp-gallery-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.bhp-gallery-placeholder {
  flex-direction: column;
  gap: .75rem;
}

.bhp-gallery-placeholder__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  color: var(--gray-400);
  font-size: .875rem;
}

.bhp-gallery-thumbs {
  display: flex;
  gap: .5rem;
  margin-top: .75rem;
  flex-wrap: wrap;
}

.bhp-gallery-thumb {
  width: 64px;
  height: 64px;
  border: 2px solid var(--gray-100);
  border-radius: var(--radius-sm);
  overflow: hidden;
  cursor: pointer;
  transition: border-color .2s;
}

.bhp-gallery-thumb img { width: 100%; height: 100%; object-fit: cover; }
.bhp-gallery-thumb:hover { border-color: var(--gray-400); }
.bhp-gallery-thumb.active { border-color: var(--orange); }

/* ═══ PANEL INFORMACJI ═══ */
.bhp-product-info {}

.bhp-product-cats {
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--orange);
  margin-bottom: .6rem;
}
.bhp-product-cats a { color: var(--orange); text-decoration: none; }

.bhp-product-title {
  font-family: var(--font-heading);
  font-size: clamp(1.6rem, 3vw, 2.25rem);
  font-weight: 800;
  color: var(--navy);
  line-height: 1.2;
  margin-bottom: 1rem;
}

.bhp-product-excerpt {
  color: var(--gray-600);
  font-size: .975rem;
  line-height: 1.7;
  margin-bottom: 1.25rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--gray-100);
}
.bhp-product-excerpt p { color: inherit; margin-bottom: .5rem; }

/* CENA */
.bhp-product-price {
  margin-bottom: 1.25rem;
}

.bhp-product-price .woocommerce-Price-amount,
.bhp-product-price .amount {
  font-family: var(--font-heading);
  font-size: 2rem;
  font-weight: 800;
  color: var(--navy);
  line-height: 1;
}

.bhp-product-price del .amount { color: var(--gray-400); font-size: 1.2rem; }
.bhp-product-price ins { text-decoration: none; }
.bhp-product-price ins .amount { color: var(--orange); }

.bhp-product-price__vat {
  display: block;
  font-size: .78rem;
  color: var(--gray-400);
  margin-top: .25rem;
}

/* ═══ SEKCJA ZAKUPU — do_action(woocommerce_single_product_summary) ═══
   Po usunięciu tytułu/ceny/ratingu zostaje tu tylko:
   - formularz add-to-cart (WooCommerce)
   - przycisk zapisu na kurs (Sensei)
   - meta (SKU, kategorie)
*/
.bhp-product-buy {
  margin-bottom: 1.5rem;
}

/* Schowaj duplikaty które mogą zostać mimo remove_action */
.bhp-product-buy .woocommerce-product-rating,
.bhp-product-buy .price:first-child,
.bhp-product-buy .woocommerce-product-details__short-description,
.bhp-product-buy p.price { display: none !important; }

/* Formularz add-to-cart */
.bhp-product-buy form.cart {
  display: flex;
  gap: .75rem;
  align-items: center;
  flex-wrap: wrap;
  margin: 0 0 1rem;
}

/* Pole ilości */
.bhp-product-buy .quantity { display: flex; align-items: center; }

.bhp-product-buy input[type="number"].qty,
.bhp-product-buy input.qty {
  width: 72px;
  height: 52px;
  padding: .5rem .75rem;
  border: 1.5px solid var(--gray-200);
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  text-align: center;
  color: var(--navy);
  background: var(--white);
  -moz-appearance: textfield;
}

.bhp-product-buy input.qty::-webkit-outer-spin-button,
.bhp-product-buy input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.bhp-product-buy input.qty:focus {
  outline: none;
  border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(232,96,10,.12);
}

/* Główny przycisk dodania do koszyka */
.bhp-product-buy button.single_add_to_cart_button,
.bhp-product-buy a.single_add_to_cart_button {
  flex: 1;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .875rem 2rem;
  min-height: 52px;
  background: var(--orange) !important;
  color: var(--white) !important;
  border: none !important;
  border-radius: var(--radius-md) !important;
  font-family: var(--font-body) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  cursor: pointer;
  transition: all .2s ease;
  text-decoration: none;
  white-space: nowrap;
  letter-spacing: .01em;
}

.bhp-product-buy button.single_add_to_cart_button:hover,
.bhp-product-buy a.single_add_to_cart_button:hover {
  background: var(--orange-light) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(232,96,10,.35);
}

/* Przycisk Sensei "Dołącz do kursu" / "Wznów kurs" */
.bhp-product-buy .sensei-course-enrolment-actions a,
.bhp-product-buy .sensei-enrolment-button,
.bhp-product-buy .woocommerce-form-coupon-toggle,
.bhp-product-buy a.button:not(.product_type_simple) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .875rem 2rem;
  background: var(--orange);
  color: var(--white) !important;
  border-radius: var(--radius-md);
  font-weight: 700;
  font-size: 1rem;
  text-decoration: none;
  transition: all .2s ease;
  width: 100%;
}

.bhp-product-buy .sensei-course-enrolment-actions a:hover { background: var(--orange-light); }

/* Checklist "co zawiera" */
.bhp-product-perks {
  list-style: none;
  padding: 1.25rem;
  margin: 0 0 1rem;
  background: var(--gray-50);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-md);
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

.bhp-product-perks li {
  display: flex;
  align-items: center;
  gap: .6rem;
  font-size: .875rem;
  color: var(--gray-600);
}

.bhp-product-perks svg {
  flex-shrink: 0;
  color: var(--orange);
}

/* ═══ TABS SECTION ═══ */
.product-tabs-section {
  background: var(--white);
  border-top: 1px solid var(--gray-100);
  padding: 0 0 4rem;
}

.product-tabs-inner { padding-top: 2.5rem; }

/* Course meta grid in tabs */
.course-meta-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.course-meta-item {
  display: flex;
  gap: .75rem;
  align-items: center;
  background: var(--gray-50);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-md);
  padding: .875rem 1rem;
}

.course-meta-item__icon {
  width: 36px;
  height: 36px;
  background: var(--orange-pale);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--orange);
}

.course-meta-item__icon svg {
  width: 18px !important;
  height: 18px !important;
  stroke: var(--orange);
}

.course-meta-item__label {
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--gray-400);
  margin-bottom: .15rem;
}

.course-meta-item__val {
  font-weight: 600;
  color: var(--navy);
  font-size: .9rem;
}

/* Responsive */
@media (max-width: 900px) {
  .bhp-product-layout { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   24. ZAKUP GRUPOWY — przełącznik trybu + selektor liczby miejsc
   -------------------------------------------------------------------------- */

/* Przełącznik "Kupuję dla siebie" / "Kupuję dla grupy" */
.bhp-purchase-mode {
  margin-bottom: 1rem;
}

.bhp-mode-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .75rem;
}

.bhp-mode-option {
  position: relative;
  cursor: pointer;
}

.bhp-mode-radio {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}

.bhp-mode-option__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  padding: .7rem .75rem;
  border: 1.5px solid var(--gray-200);
  border-radius: var(--radius-md);
  font-size: .85rem;
  font-weight: 600;
  color: var(--gray-600);
  background: var(--white);
  transition: all .15s ease;
  text-align: center;
}

.bhp-mode-option__inner svg {
  flex-shrink: 0;
  color: var(--gray-400);
  transition: color .15s ease;
}

.bhp-mode-radio:checked + .bhp-mode-option__inner {
  border-color: var(--orange);
  background: var(--orange-pale);
  color: var(--orange);
}

.bhp-mode-radio:checked + .bhp-mode-option__inner svg {
  color: var(--orange);
}

.bhp-mode-radio:focus-visible + .bhp-mode-option__inner {
  outline: 2px solid var(--orange);
  outline-offset: 2px;
}

.bhp-mode-option:hover .bhp-mode-option__inner {
  border-color: var(--gray-400);
}

.bhp-mode-radio:checked + .bhp-mode-option__inner:hover {
  border-color: var(--orange);
}

/* Selektor liczby miejsc — widoczny tylko w trybie "dla grupy" (JS) */
.bhp-seats-selector {
  background: var(--orange-pale);
  border: 1px solid rgba(232,96,10,.2);
  border-radius: var(--radius-md);
  padding: 1rem 1.25rem;
  margin-bottom: 1rem;
}

.bhp-seats-selector__label {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-weight: 600;
  font-size: .9rem;
  color: var(--navy);
  margin-bottom: .35rem;
}

.bhp-seats-selector__label svg { color: var(--orange); flex-shrink: 0; }

.bhp-seats-selector__hint {
  font-size: .8rem;
  color: var(--gray-600);
  margin-bottom: .75rem;
}

.bhp-seats-selector__total {
  font-size: .9rem;
  color: var(--gray-600);
  padding-top: .75rem;
  border-top: 1px solid rgba(232,96,10,.2);
}

.bhp-seats-selector__total strong {
  font-family: var(--font-heading);
  color: var(--navy);
  font-size: 1.1rem;
}

/* --------------------------------------------------------------------------
   25. STRONA DOŁĄCZANIA DO SZKOLENIA (/dolacz-do-szkolenia/)
   -------------------------------------------------------------------------- */
.bhp-join-card {
  background: var(--white);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-xl);
  padding: clamp(2rem, 5vw, 3rem);
  text-align: center;
  box-shadow: var(--shadow-card);
}

.bhp-join-card h1 {
  font-size: clamp(1.4rem, 3vw, 1.8rem);
  margin-bottom: .75rem;
}

.bhp-join-card p {
  margin-bottom: 1.5rem;
  color: var(--gray-600);
}

.bhp-join-card__icon {
  width: 56px;
  height: 56px;
  background: var(--orange-pale);
  color: var(--orange);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.25rem;
}

.bhp-join-card--error .bhp-join-card__icon,
.bhp-join-card__icon--error {
  background: #FCEBEB;
  color: #A32D2D;
}

.bhp-join-card__badge {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: var(--gray-50);
  border-radius: 100px;
  padding: .4rem 1rem;
  font-size: .8rem;
  font-weight: 600;
  color: var(--navy);
  margin-bottom: 1.25rem;
}

.bhp-join-card__badge svg { width: 16px !important; height: 16px !important; color: var(--orange); }

.bhp-join-card__course {
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--orange);
  margin-bottom: 1.5rem !important;
}

.bhp-join-card__info {
  background: var(--gray-50);
  border-radius: var(--radius-md);
  padding: 1rem;
  font-size: .875rem;
  color: var(--gray-600);
  margin-bottom: 1.5rem;
  text-align: left;
}

.bhp-join-form { text-align: left; }
.bhp-join-form .form-group { margin-bottom: 1.1rem; }

/* --------------------------------------------------------------------------
   26. PANEL PRACODAWCY — lista grup
   -------------------------------------------------------------------------- */
.bhp-groups-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.bhp-group-card {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  background: var(--white);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-lg);
  padding: 1.5rem;
  text-decoration: none;
  transition: all .2s;
}

.bhp-group-card:hover {
  border-color: var(--orange);
  box-shadow: var(--shadow-card);
  transform: translateY(-2px);
}

.bhp-group-card__main { flex: 1; min-width: 0; }

.bhp-group-card__title {
  font-weight: 700;
  color: var(--navy);
  font-size: 1.05rem;
  margin-bottom: .2rem;
}

.bhp-group-card__company {
  font-size: .8rem;
  color: var(--gray-400);
  margin-bottom: .75rem;
}

.bhp-group-card__bar {
  height: 6px;
  background: var(--gray-100);
  border-radius: 100px;
  overflow: hidden;
  margin-bottom: .5rem;
}

.bhp-group-card__bar-fill {
  height: 100%;
  background: var(--orange);
  border-radius: 100px;
}

.bhp-group-card__stats {
  font-size: .8rem;
  color: var(--gray-600);
}

.bhp-group-card__arrow {
  color: var(--gray-400);
  flex-shrink: 0;
}

.bhp-group-card:hover .bhp-group-card__arrow { color: var(--orange); }

/* --------------------------------------------------------------------------
   27. PANEL PRACODAWCY — widok pojedynczej grupy
   -------------------------------------------------------------------------- */
.bhp-back-link {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-size: .85rem;
  color: var(--gray-400);
  text-decoration: none;
  margin-bottom: 1.25rem;
}

.bhp-back-link:hover { color: var(--orange); }

.bhp-group-actions {
  display: flex;
  gap: .75rem;
  flex-wrap: wrap;
  margin-bottom: 1.5rem;
}

.bhp-bulk-invite-form {
  background: var(--gray-50);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-lg);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}

.bhp-bulk-invite-form textarea.form-control { font-family: var(--font-body); }

/* Tabela miejsc */
.bhp-seats-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-lg);
}

.bhp-seats-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .875rem;
  min-width: 640px;
}

.bhp-seats-table th {
  background: var(--gray-50);
  padding: .75rem 1rem;
  text-align: left;
  font-weight: 600;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--navy);
  border-bottom: 2px solid var(--gray-200);
  white-space: nowrap;
}

.bhp-seats-table td {
  padding: .875rem 1rem;
  border-bottom: 1px solid var(--gray-100);
  color: var(--gray-600);
  vertical-align: middle;
}

.bhp-seats-table tr:last-child td { border-bottom: none; }
.bhp-seats-table tr:hover td { background: var(--gray-50); }

/* Status badges */
.bhp-badge {
  display: inline-block;
  padding: .25rem .7rem;
  border-radius: 100px;
  font-size: .75rem;
  font-weight: 600;
  white-space: nowrap;
}

.bhp-badge--gray   { background: var(--gray-100); color: var(--gray-400); }
.bhp-badge--orange { background: var(--orange-pale); color: var(--orange); }
.bhp-badge--green  { background: #EAF3DE; color: #3B6D11; }

/* Mini progress bar inline in table */
.bhp-mini-bar {
  width: 60px;
  height: 5px;
  background: var(--gray-100);
  border-radius: 100px;
  overflow: hidden;
  display: inline-block;
  vertical-align: middle;
  margin-right: .4rem;
}

.bhp-mini-bar__fill {
  height: 100%;
  background: var(--orange);
  border-radius: 100px;
}

/* Action links in table */
.bhp-seat-actions { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }

.bhp-link-btn {
  background: none;
  border: none;
  color: var(--orange);
  font-size: .8rem;
  font-weight: 600;
  cursor: pointer;
  padding: 0;
  font-family: var(--font-body);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.bhp-link-btn:hover { color: var(--orange-light); }
.bhp-link-btn--danger { color: #A32D2D; }
.bhp-link-btn--danger:hover { color: #C44; }

/* Single invite overlay */
.bhp-single-invite-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15,29,51,.6);
  z-index: 300;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
}

.bhp-single-invite-box {
  background: var(--white);
  border-radius: var(--radius-lg);
  padding: 2rem;
  width: 100%;
  max-width: 400px;
}

.bhp-single-invite-box h3 {
  font-size: 1.15rem;
  margin-bottom: 1.25rem;
}

/* Responsive */
@media (max-width: 600px) {
  .bhp-group-card { flex-direction: column; align-items: stretch; gap: .75rem; }
  .bhp-group-card__arrow { display: none; }
  .bhp-group-actions { flex-direction: column; }
  .bhp-group-actions .btn { width: 100%; justify-content: center; }
}

/* --------------------------------------------------------------------------
   28. FORMULARZ ZAKUPU NA STRONIE KURSU (course-buy-card)
   Wstrzykiwany przez bhp_tg_render_purchase_form() w single-course.php.
   Węższy kontekst niż strona produktu (sidebar ~380px), więc pole ilości
   i przycisk układają się pionowo zamiast w rzędzie.
   -------------------------------------------------------------------------- */
.bhp-course-buy-form {
  margin-bottom: .75rem;
}

.bhp-course-buy-form form.cart {
  display: flex;
  flex-direction: column;
  gap: .75rem;
  margin: 0;
}

.bhp-course-buy-form .quantity {
  width: 100%;
}

.bhp-course-buy-form input.qty {
  width: 100%;
  height: 50px;
  padding: .5rem .75rem;
  border: 1.5px solid var(--gray-200);
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  text-align: center;
  color: var(--navy);
  background: var(--white);
}

.bhp-course-buy-form input.qty:focus {
  outline: none;
  border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(232,96,10,.12);
}

.bhp-course-buy-form button.single_add_to_cart_button,
.bhp-course-buy-form a.single_add_to_cart_button {
  width: 100%;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .875rem 1.5rem;
  min-height: 50px;
  background: var(--orange) !important;
  color: var(--white) !important;
  border: none !important;
  border-radius: var(--radius-md) !important;
  font-family: var(--font-body) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  cursor: pointer;
  transition: all .2s ease;
  text-decoration: none;
  white-space: nowrap;
}

.bhp-course-buy-form button.single_add_to_cart_button:hover,
.bhp-course-buy-form a.single_add_to_cart_button:hover {
  background: var(--orange-light) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(232,96,10,.35);
}

/* Selektor liczby miejsc w wąskim kontekście — mniejsze odstępy niż na stronie produktu */
.bhp-course-buy-form .bhp-seats-selector {
  margin-bottom: 0;
}

.bhp-course-buy-form .bhp-seats-selector__hint {
  font-size: .75rem;
}

.bhp-course-buy-form .bhp-seats-selector__total {
  font-size: .85rem;
}

.bhp-course-buy-form .bhp-seats-selector__total strong {
  font-size: 1rem;
}

/* Przełącznik trybu w wąskim sidebarze (380px) — dwa przyciski obok siebie
   bywają zbyt ciasne z ikoną + tekstem, więc układamy je pionowo. */
.bhp-course-buy-form .bhp-mode-switch {
  grid-template-columns: 1fr;
}

.bhp-course-buy-form .bhp-mode-option__inner {
  justify-content: flex-start;
  padding: .65rem .9rem;
}

/* --------------------------------------------------------------------------
   29. WOOCOMMERCE MY ACCOUNT — TWARDE NADPISANIE NA KOŃCU PLIKU
   -------------------------------------------------------------------------- */
/*
 * Mimo poprawnej specyficzności reguł w sekcji 22, layout strony
 * "Moje konto" (renderowanej przez shortcode [woocommerce_my_account])
 * w niektórych konfiguracjach wciąż rozjeżdżał się — sidebar i treść
 * stawały jedna pod drugą zamiast obok siebie, a kolumna treści kurczyła
 * się do absurdalnie wąskiej szerokości zamiast zająć dostępne 1fr.
 *
 * Dokładna przyczyna nie została jednoznacznie ustalona przez analizę
 * statyczną pliku (CSS na serwerze jest identyczny z lokalnym, struktura
 * HTML poprawna, konkurencyjne arkusze stylów wykluczone). Możliwe że to
 * inna wtyczka wstrzykuje styl inline lub z wyższą specyficznością którego
 * nie udało się namierzyć bez dalszej, czasochłonnej analizy przez devtools.
 *
 * Zamiast dalej szukać, ta sekcja na samym końcu pliku (więc wygrywa przez
 * kolejność źródłową przy równej specyficzności) wymusza poprawny layout
 * przez !important na kluczowych właściwościach. Defensywne, ale skuteczne
 * niezależnie od źródła kolizji.
 */
body.woocommerce-account .woocommerce > div:not(.woocommerce-notices-wrapper) {
  box-sizing: border-box !important;
}

body.woocommerce-account .woocommerce {
  display: flex !important;
  flex-direction: row !important;
  gap: 2.5rem !important;
  align-items: flex-start !important;
  width: 100% !important;
  max-width: 100% !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation {
  width: 240px !important;
  min-width: 240px !important;
  max-width: 240px !important;
  flex-shrink: 0 !important;
}

body.woocommerce-account .woocommerce-MyAccount-content {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: 1 1 auto !important;
}

/* Wymuś szerokość elementów wewnątrz treści */
body.woocommerce-account .woocommerce-MyAccount-content > * {
  max-width: 100% !important;
}

@media (max-width: 768px) {
  body.woocommerce-account .woocommerce {
    flex-direction: column !important;
  }
  body.woocommerce-account .woocommerce-MyAccount-navigation {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
  }
}

/* ==========================================================================
   CHECKOUT — własny template BHP Pro
   ========================================================================== */

/* Grid: formularz | podsumowanie */
.bhp-checkout-grid {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 3rem;
  align-items: start;
  max-width: 100%;
}

.bhp-checkout-form {
  min-width: 0;
}

.bhp-checkout-summary {
  position: sticky;
  top: 90px;
}

.bhp-checkout-summary__title {
  font-size: 1.1rem !important;
  color: var(--navy) !important;
  font-weight: 700 !important;
  margin: 0 0 .75rem !important;
  padding-bottom: .75rem !important;
  border-bottom: 1px solid var(--gray-100) !important;
}

#order_review {
  background: var(--white);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-lg);
  padding: 1.5rem;
  overflow: hidden;
}

/* Pola formularza */
.woocommerce-checkout .form-row {
  margin-bottom: 1rem !important;
  padding: 0 !important;
}

.woocommerce-checkout .form-row label {
  display: block !important;
  font-size: .85rem !important;
  font-weight: 600 !important;
  color: var(--navy) !important;
  margin-bottom: .35rem !important;
}

.woocommerce-checkout .form-row .required { color: var(--orange) !important; }

.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row input[type="email"],
.woocommerce-checkout .form-row input[type="tel"],
.woocommerce-checkout .form-row input[type="number"],
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea {
  width: 100% !important;
  padding: .75rem 1rem !important;
  border: 1.5px solid var(--gray-200) !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-body) !important;
  font-size: .9rem !important;
  color: var(--gray-900, #111) !important;
  background: var(--white) !important;
  box-sizing: border-box !important;
  height: auto !important;
  display: block !important;
}

.woocommerce-checkout .form-row input:focus,
.woocommerce-checkout .form-row select:focus {
  outline: none !important;
  border-color: var(--orange) !important;
  box-shadow: 0 0 0 3px rgba(232,96,10,.12) !important;
}

/* Half-width */
.woocommerce-checkout .form-row-first { float: left !important; width: calc(50% - .5rem) !important; clear: left !important; }
.woocommerce-checkout .form-row-last  { float: right !important; width: calc(50% - .5rem) !important; }
.woocommerce-checkout .form-row-wide  { clear: both !important; width: 100% !important; float: none !important; }
.woocommerce-billing-fields__field-wrapper { overflow: hidden; }

/* Nagłówki sekcji */
.woocommerce-billing-fields > h3,
.woocommerce-shipping-fields > h3,
.woocommerce-additional-fields > h3 {
  font-size: 1.1rem !important;
  color: var(--navy) !important;
  font-weight: 700 !important;
  padding-bottom: .75rem !important;
  border-bottom: 1px solid var(--gray-100) !important;
  margin: 1.75rem 0 1.25rem !important;
}
.woocommerce-billing-fields > h3 { margin-top: 0 !important; }

/* Sekcja faktura */
#bhp-invoice-section {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--gray-100);
}
#bhp-invoice-section h3 {
  font-size: 1.1rem !important;
  color: var(--navy) !important;
  font-weight: 700 !important;
  padding-bottom: .75rem !important;
  border-bottom: 1px solid var(--gray-100) !important;
  margin: 0 0 1.25rem !important;
}

/* Płatność */
#payment {
  background: var(--gray-50) !important;
  border: 1px solid var(--gray-100) !important;
  border-radius: var(--radius-lg) !important;
  padding: 1.5rem !important;
  margin-top: 1.5rem !important;
}

#payment .wc_payment_methods {
  list-style: none !important;
  margin: 0 0 1rem !important;
  padding: 0 !important;
}

#payment .wc_payment_methods li {
  padding: 1rem 1.25rem !important;
  background: var(--white) !important;
  border: 1.5px solid var(--gray-200) !important;
  border-radius: var(--radius-md) !important;
  margin-bottom: .5rem !important;
}

#payment .wc_payment_methods label { font-weight: 600; color: var(--navy); cursor: pointer; }

#payment .payment_box {
  background: transparent !important;
  border: none !important;
  padding: .5rem 0 0 !important;
  font-size: .875rem !important;
  color: var(--gray-600) !important;
}

#payment .woocommerce-privacy-policy-text {
  font-size: .8rem;
  color: var(--gray-400);
  margin: 1rem 0;
}

/* Checkbox T&C */
#payment .woocommerce-form__label-for-checkbox {
  display: flex !important;
  align-items: flex-start !important;
  gap: .6rem !important;
  font-size: .875rem !important;
  color: var(--gray-600) !important;
  font-weight: 400 !important;
  cursor: pointer !important;
  margin-bottom: 1.25rem !important;
}

#payment input#terms {
  width: 16px !important; height: 16px !important;
  flex-shrink: 0 !important;
  margin-top: 2px !important;
  accent-color: var(--orange) !important;
}

/* Przycisk */
#place_order {
  display: block !important;
  width: 100% !important;
  padding: 1rem 2rem !important;
  background: var(--orange) !important;
  color: var(--white) !important;
  border: none !important;
  border-radius: var(--radius-md) !important;
  font-family: var(--font-body) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: all .2s !important;
  letter-spacing: .02em !important;
}

#place_order:hover {
  background: var(--orange-light) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 16px rgba(232,96,10,.35) !important;
}

/* Responsive */
@media (max-width: 900px) {
  .bhp-checkout-grid {
    grid-template-columns: 1fr;
  }
  .bhp-checkout-summary { position: static; }
  .woocommerce-checkout .form-row-first,
  .woocommerce-checkout .form-row-last {
    float: none !important;
    width: 100% !important;
    clear: both !important;
  }
}