:root {
  --black: #0e0e0e;
  --gold: #c8a24d;
  --light: #f6f3ee;
  --white: #ffffff;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: 'Montserrat', sans-serif;
  background: var(--black);
  color: var(--white);
}

html {
  scroll-behavior: smooth;
}

/* HERO */

.hero {
    min-height: 100vh;
    padding-top: 140px;
    padding-bottom: 60px;
    box-sizing: border-box;
    background:
      linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
      url("images/instruktor-aneta.webp") center / cover no-repeat;
  
    display: flex;
    align-items: center;
  
    justify-content: flex-start;
    text-align: left;
    
  }

  .hero-subtitle span {
    display: block;  
  }
  
  .hero-subtitle strong {
    font-weight: 600;
  }
  
  
  .hero-content {
    max-width: 600px;
  
    /* odsunięcie od lewej krawędzi */
    margin-left: 8%;
  }
  
  .hero-content h1,
  .hero-content .hero-eyebrow {
    font-family: 'Playfair Display', serif;
    font-size: 2.75rem;
    line-height: 1.3;
    color: var(--gold);
    margin-bottom: 10px;
  }

  .hero-content .hero-title {
    font-family: 'Playfair Display', serif;
    font-size: 2rem;
    line-height: 1.25;
    margin-bottom: 16px;
  }

  .hero-content .hero-subtitle {
    font-size: 0.95rem;
    line-height: 1.5;
    opacity: 0.9;
    margin-bottom: 24px;
  }

  .hero-heading-gold {
  font-family: 'Playfair Display', serif;
  font-size: 2rem;
  color: var(--gold);
}
  
  .subtitle {
    font-size: 1.1rem;
    line-height: 1.5;
  }
  
  .subtitle strong {
    font-weight: 600;
    display: block;
    margin-bottom: 6px;
  }
  
  .hero-meta {
    display: block;
    font-weight: 400;
    opacity: 0.9;
  }
  
  .btn-primary {
    display: inline-block;
    padding: 16px 40px;
    border: 1px solid var(--gold);
    color: var(--gold);
    text-decoration: none;
    transition: 0.3s;
  }
  
  .btn-primary:hover {
    background: var(--gold);
    color: var(--black);
  }
  
  .hero-socials {
    position: absolute;
    top: 30px;
    right: 40px;
    display: flex;
    gap: 14px;
    z-index: 101;
  }
  
  .hero-socials a {
    opacity: 0.6;
    transition: opacity 0.3s;
  }
  
  .hero-socials a:hover {
    opacity: 1;
  }
  
  .hero-socials .icon {
    width: 18px;
    height: 18px;
    fill: var(--gold);
  }

  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  /* ZAOKRĄGLONE CTA */

  .hero-cta {
  display: inline-block;
  text-decoration: none;
  font-size: 0.95rem;
  color: #bfa76a;
  border: 1px solid #bfa76a;
  padding: 12px 30px;
  border-radius: 30px;
  transition: all 0.25s ease;
}

.hero-cta:hover {
  background: #bfa76a;
  color: #0e0e0e;
}

  /* =========================
   MOBILE OPTIMIZATION
   ========================= */
@media (max-width: 768px) {

    /* HERO */
    .hero {
      min-height: 100vh;
      min-height: 100dvh;
      padding-top: 110px;
      padding-bottom: 50px;
      align-items: flex-end;
    }

    .hero-content {
      margin-left: 0;
      padding: 0 20px 24px;
      width: 100%;
    }
  
    .hero-content h1,
    .hero-content .hero-eyebrow {
      font-size: 2.25rem;
      line-height: 1.3;
    }

    .hero-content .hero-title {
      font-size: 1.5rem;
      line-height: 1.25;
    }

    .hero-content .hero-subtitle {
      font-size: 0.85rem;
      margin-bottom: 20px;
    }
  
    .subtitle {
      font-size: 1rem;
    }
  
    .btn-primary {
      width: 100%;
      text-align: center;
      padding: 16px 32px;
    }

    .hero {
        background:
          linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)),
          url("images/instruktor-aneta.webp") 65% center / cover no-repeat;
      }    }

      .hero-socials {
        position: absolute;
        top: 30px;
        right: 60px;
        display: flex;
        gap: 14px;
      }
      
  
    /* BENEFITS */
    .benefits {
        background: var(--light);
        color: var(--black);
        display: flex;
        justify-content: space-around;
        align-items: flex-start;
        padding: 60px 20px;
        text-align: center;
      }
      
      .benefit {
        font-weight: 500;
        max-width: 280px;
        line-height: 1.5;
      }
  
    .benefit-icon .icon {
      width: 22px;
      height: 22px;
    }
  

  /* =========================
   BENEFITS – MOBILE
   ========================= */
@media (max-width: 768px) {

    .benefits {
      flex-direction: column;
      align-items: center;
      gap: 30px;
      padding: 50px 20px;
    }
  
    .benefit {
      max-width: 100%;
      text-align: center;
      font-size: 1rem;
    }
  
    .benefit-icon .icon {
      width: 22px;
      height: 22px;
    }
  }
  
  
/* BENEFITS */
.benefits {
  background: var(--light);
  color: var(--black);
  display: flex;
  justify-content: space-around;
  padding: 40px 20px;
  text-align: center;
}

.benefit {
  font-weight: 500;
}

/* BENEFIT ICONS */
.benefit {
    max-width: 280px;
  }
  
  .benefit-icon {
    display: block;
    margin-bottom: 14px;
  }
  
  .benefit-icon svg {
    width: 26px;
    height: 26px;
    fill: var(--gold);
  }

/* BENEFIT ICONS – PREMIUM UI */
.benefit {
    font-weight: 500;
    max-width: 280px;
  }
  
  .benefit-icon {
    display: block;
    margin-bottom: 14px;
  }
  
  .benefit-icon .icon {
    width: 32px;
    height: 32px;
    color: var(--gold);
  
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

/* =========================
   SZKOLENIA PODSTAWOWE – PREMIUM
   ========================= */

   .offer-basic {
    padding: 100px 20px;
    background: var(--black);
    text-align: center;
  }
  
  /* HEADER */
  .offer-header h1 {
    font-family: 'Playfair Display', serif;
    color: var(--gold);
    margin-bottom: 12px;
  }
  
  .offer-subtitle {
    max-width: 720px;
    margin: 0 auto 70px;
    font-size: 1.05rem;
    line-height: 1.6;
    color: #ffffff;
    opacity: 0.75;
  }

  .offer-subtitle a {
    color: #bfa76a;
    font-weight: 500;
    text-decoration: none;
    transition: opacity 0.2s ease;
  }

  .offer-subtitle a:hover {
    opacity: 0.8;
  }
  
  /* GRID */
  .offer-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    max-width: 1100px;
    margin: 0 auto 50px
  }
  
  .offer-advanced .offer-card-center {
  grid-column: 1 / -1;
  max-width: 520px;
  justify-self: center;
}

/* GRID 2 kart */
.offer-grid-main {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
  max-width: 1100px;
  margin: 0 auto 40px;
}

/* POJEDYNCZA karta */
.offer-grid-single {
  display: flex;
  justify-content: center;
  margin-bottom: 50px;
}

.offer-grid-single .offer-card {
  max-width: 520px;
  width: 100%;
}


  /* CARD */
  .premium-card {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(212, 175, 55, 0.35);
    border-radius: 14px;
    padding: 50px 40px;
    text-align: left;
  }
  
  
  /* CARD TITLE */
  .premium-card h3 {
    font-family: 'Playfair Display', serif;
    color: #ffffff;
    margin-bottom: 16px;
  }
  
  /* DESCRIPTION */
  .offer-desc {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #ffffff;
    opacity: 0.85;
    margin-bottom: 26px;
  }
  
  /* LIST */
  .offer-list {
    list-style: none;
    padding: 0;
    margin: 0 0 34px;
  }
  
  .offer-list li {
    position: relative;
    padding-left: 18px;
    margin-bottom: 10px;
    font-size: 0.95rem;
    color: #ffffff;
    opacity: 0.8;
  }
  
  .offer-list li::before {
    content: "—";
    position: absolute;
    left: 0;
    color: var(--gold);
  }
  
  /* CTA */
  .offer-btn {
    display: inline-block;
    padding: 14px 36px;
    border: 1px solid var(--gold);
    color: var(--gold);
    text-decoration: none;
    transition: 0.3s ease;
  }
  
  .offer-btn:hover {
    background: var(--gold);
    color: var(--black);
  }

  .offer-cta-wrap {
    text-align: center;
    margin-top: 2.5rem;
    margin-bottom: 0.5rem;
  }
  
  /* NOTE */
  .offer-note {
    font-size: 0.9rem;
    line-height: 1.5;
    color: #ffffff;
    opacity: 0.6;
  }

  .offer-note a {
  color: #bfa76a;
  font-weight: 500;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.offer-note a:hover {
  opacity: 0.8;
}

  
  /* =========================
     MOBILE
     ========================= */
  @media (max-width: 768px) {
  
    .offer-basic {
      padding: 70px 20px;
    }
  
    .offer-grid {
      grid-template-columns: 1fr;
      gap: 30px;
    }
  
    .premium-card {
      padding: 40px 30px;
    }
  
    .offer-header h1 {
      font-size: 2rem;
    }
  
    .offer-subtitle {
      margin-bottom: 50px;
    }
  }
  
  

/* =========================
   ABOUT ANETA – PREMIUM
   ========================= */

   .about-aneta {
    padding: 120px 20px;
    background: var(--light);
    position: relative;
  }
  
  /* subtle divider */
  .about-aneta::before {
    content: "";
    width: 80px;
    height: 1px;
    background: var(--gold);
    opacity: 0.5;
    display: block;
    margin: 0 auto 80px;
  }
  
  /* layout */
  .about-container {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.1fr 1.2fr;
    gap: 80px;
    align-items: start;
  }
  
  /* text */
  .about-text h1 {
    font-family: 'Playfair Display', serif;
    color: var(--gold);
    margin-bottom: 12px;
  }
  
  .about-text h2 {
    font-size: 1.05rem;
    font-weight: 400;
    opacity: 0.8;
    color:black;
    margin-bottom: 40px;
  }

  .about-text h2.hero-heading-gold {
  font-family: 'Playfair Display', serif;
  font-size: 2rem;
  font-weight: 400;
  opacity: 1;
  color: var(--gold);
  margin-bottom: 10px;
}
  
  .about-text p {
    font-size: 0.95rem;
    line-height: 1.7;
    margin-bottom: 22px;
    color: var(--black);
    opacity: 0.9;
  }
  
  /* gallery */
  .about-gallery {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-top: 74px;
    justify-self: center;
  }
  
  .about-gallery img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 14px;
  }

  .about-list {
    margin: 10px 0 24px 20px;
    padding: 0;
  }
  
  .about-list li {
    margin-bottom: 8px;
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--black);
    opacity: 0.9;
  }
  
  
  /* =========================
     MOBILE
     ========================= */
  @media (max-width: 768px) {
  
    .about-aneta {
      padding: 80px 20px;
    }
  
    .about-container {
      grid-template-columns: 1fr;
      gap: 50px;
    }
  
    .about-text h1 {
      font-size: 2rem;
    }
  
    .about-gallery {
      gap: 16px;
    }
  }
  

/* =========================
   SZKOLENIA ROZWOJOWE – PREMIUM
   ========================= */

   .offer-advanced {
    padding: 100px 20px;
    background: var(--black);
    text-align: center;
  }
  
  /* INTRO */
  .offer-intro {
    max-width: 800px;
    margin: 0 auto 70px;
    font-size: 0.95rem;
    line-height: 1.7;
    color: #ffffff;
    opacity: 0.75;
  }
  
  /* DURATION LABEL */
  .offer-duration {
    display: inline-block;
    margin-left: 10px;
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--gold);
    opacity: 0.9;
  }
  
  /* HOVER – SUBTLE PREMIUM */
  .premium-card {
    transition: border-color 0.3s ease, transform 0.3s ease;
  }
  
  .premium-card:hover {
    border-color: rgba(212, 175, 55, 0.55);
    transform: translateY(-2px);
  }
  
  /* MOBILE */
  @media (max-width: 768px) {
  
    .offer-advanced {
      padding: 70px 20px;
    }
  
    .offer-intro {
      margin-bottom: 50px;
    }
  }
  

.about img {
  width: 100%;
  display: block;
}

/* =========================
   TESTIMONIALS – PREMIUM
   ========================= */

   .testimonials {
    padding: 100px 20px;
    background: var(--light);
    text-align: center;
  }
  
  /* HEADER */
  .testimonials-header h1 {
    font-family: 'Playfair Display', serif;
    color: var(--gold);
    margin-bottom: 12px;
  }
  
  .testimonials-subtitle {
    max-width: 600px;
    margin: 0 auto 70px;
    font-size: 1rem;
    line-height: 1.6;
    color: var(--black);
    opacity: 0.7;
  }
  
  /* GRID */
  .testimonials-grid {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
  }
  
  /* CARD */
  .testimonial-card {
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 14px;
    padding: 40px 32px;
    text-align: left;
  }
  
  /* TEXT */
  .testimonial-text {
    font-size: 0.95rem;
    line-height: 1.7;
    color: var(--black);
    margin-bottom: 24px;
  }
  
  /* AUTHOR */
  .testimonial-author {
    font-size: 0.85rem;
    color: var(--black);
    opacity: 0.7;
  }
  
  .testimonial-author span {
    opacity: 0.6;
  }
  
  /* =========================
     MOBILE
     ========================= */
  @media (max-width: 768px) {
  
    .testimonials {
      padding: 80px 20px;
    }
  
    .testimonials-grid {
      grid-template-columns: 1fr;
      gap: 30px;
    }
  
    .testimonial-card {
      padding: 36px 28px;
    }
  }

  /* =========================
   GRADUATES – PREMIUM
   ========================= */

.graduates {
    padding: 90px 20px;
    background: var(--light);
    text-align: center;
    color: var(--black); 
  }
  
  /* HEADER */
  .graduates-header h1 {
    font-family: 'Playfair Display', serif;
    color: var(--gold);
    margin-bottom: 10px;
  }
  
  .graduates-subtitle {
    font-size: 0.95rem;
    color: var(--black);
    opacity: 0.65;
    margin-bottom: 60px;
  }
  
  /* GRID */
  .graduates-grid {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
  }
  
  /* CARD */
  .graduate-card {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 14px;
    overflow: hidden;
    text-align: left;
  }
  
    .graduate-card2 {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 14px;
    overflow: hidden;
    text-align: left;
  }

  /* IMAGE */
  .graduate-card img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
  }

    .graduate-card2 img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    object-position: center 20%;
    display: block;
  }
  
  /* INFO */
  .graduate-info {
    padding: 22px 22px 26px;
  }
  
  .graduate-name {
    font-size: 0.95rem;
    font-weight: 500;
    margin-bottom: 2px;
  }
  
  .graduate-city {
    font-size: 0.85rem;
    opacity: 0.6;
    margin-bottom: 12px;
  }
  
  /* LINK */
  .graduate-info a {
    font-size: 0.8rem;
    color: var(--black);
    opacity: 0.6;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: 0.2s ease;
  }
  
  .graduate-info a:hover {
    opacity: 0.9;
    border-bottom-color: var(--gold);
  }
  
  /* =========================
     MOBILE
     ========================= */
  @media (max-width: 768px) {
  
    .graduates {
      padding: 70px 20px;
    }
  
    .graduates-grid {
      grid-template-columns: 1fr;
      gap: 30px;
    }
  
    .graduate-card img {
      height: 200px;
    }
  }

  /* =========================
   FOR WHO – FINAL, SPOJNY
   ========================= */

.for-who {
    padding: 110px 20px;
    background: var(--black);
    color: #ffffff;
  }
  
  .for-who-header {
    text-align: center;
    margin-bottom: 70px;
  }
  
  .for-who-header h1 {
    font-family: 'Playfair Display', serif;
    color: var(--gold);
  }
  
  /* GRID */
  .for-who-grid {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
  }
  
  /* BOX */
  .for-who-box {
    padding: 40px 40px;
    border: 1px solid rgba(212, 175, 55, 0.25);
    border-radius: 14px;
  }
  
  .for-who-box.muted {
    border-color: rgba(255, 255, 255, 0.15);
  }
  
  /* HEADINGS */
  .for-who-box h2 {
    font-size: 1.05rem;
    font-weight: 500;
    margin-bottom: 26px;
  }
  
  /* LIST */
  .for-who-box ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  .for-who-box li {
    font-size: 0.95rem;
    line-height: 1.7;
    margin-bottom: 16px;
    color: #e6e6e6;
  }
  
  /* ACCENT – BEZ ROZMYCIA */
  .for-who-box .accent {
    color: var(--gold);
    font-weight: 500;
  }
  
  .for-who-box .accent.muted {
    color: #cccccc;
  }
  
  /* MOBILE */
  @media (max-width: 768px) {
    .for-who {
      padding: 80px 20px;
    }
  
    .for-who-grid {
      grid-template-columns: 1fr;
      gap: 40px;
    }
  }
  

/* =========================
   CONTACT FORM – PREMIUM
   ========================= */

   .contact-form {
    padding: 120px 20px;
    background: var(--black);
    color: #ffffff;
  }
  
  /* HEADER */
  .contact-form-header {
    max-width: 640px;
    margin: 0 auto 70px;
    text-align: center;
  }
  
  .contact-form-header h1 {
    font-family: 'Playfair Display', serif;
    color: var(--gold);
    margin-bottom: 14px;
  }
  
  .contact-form-header p {
    font-size: 1rem;
    line-height: 1.6;
    color: #e0e0e0;
    opacity: 0.85;
  }
  
  /* FORM BOX */
  .contact-form-box {
    max-width: 640px;
    margin: 0 auto;
    padding: 50px 45px;
    border: 1px solid rgba(212, 175, 55, 0.25);
    border-radius: 16px;
  }
  
  /* FIELD */
  .form-field {
    display: flex;
    flex-direction: column;
    margin-bottom: 26px;
  }
  
  .form-field label {
    font-size: 0.85rem;
    margin-bottom: 8px;
    color: #ffffff;
    opacity: 0.85;
  }
  
  /* INPUTS */
  .form-field input,
  .form-field select,
  .form-field textarea {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 10px;
    padding: 14px 16px;
    color: #ffffff;
    font-size: 0.95rem;
  }
  
  .form-field input::placeholder,
  .form-field textarea::placeholder {
    color: #b5b5b5;
  }
  
  .form-field input:focus,
  .form-field select:focus,
  .form-field textarea:focus {
    outline: none;
    border-color: var(--gold);
  }
  
.form-local-info {
  margin-top: 60px;
  text-align: center;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.form-local-info h3 {
  margin-bottom: 12px;
  font-size: 1rem;
  font-weight: 500;
}

.form-local-info p {
  font-size: 0.95rem;
  opacity: 0.8;
  line-height: 1.6;
}


  /* SMALL NOTE */
  .form-field small {
    font-size: 0.75rem;
    margin-top: 6px;
    color: #cfcfcf;
    opacity: 0.8;
  }
  
  /* BUTTON */
  .form-submit {
    width: 100%;
    margin-top: 10px;
    padding: 16px;
    border-radius: 999px;
    background: transparent;
    border: 1px solid var(--gold);
    color: var(--gold);
    font-size: 0.95rem;
    cursor: pointer;
    transition: 0.3s ease;
  }
  
  .form-submit:hover {
    background: var(--gold);
    color: var(--black);
  }
  
  /* FOOT NOTE */
  .form-note {
    margin-top: 18px;
    font-size: 0.8rem;
    text-align: center;
    color: #d0d0d0;
    opacity: 0.75;
  }

  /* FIX SELECT OPTIONS */
.contact-form select {
  background-color: transparent;
  color: #ffffff;
}

.contact-form select option {
  color: #000000;
  background-color: #ffffff;
}

  
  /* =========================
     MOBILE
     ========================= */
  @media (max-width: 768px) {
  
    .contact-form {
      padding: 90px 20px;
    }
  
    .contact-form-box {
      padding: 40px 26px;
    }
  }
  

/* =========================
   FOOTER – PREMIUM
   ========================= */

   .site-footer {
    background: var(--light);
    color: var(--black);
    padding-top: 90px;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
  }
  
  /* MAIN GRID */
  .footer-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px 80px;
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1.5fr;
    gap: 60px;
  }
  
  /* BRAND */
  .footer-brand h3 {
    font-family: 'Playfair Display', serif;
    font-size: 1.2rem;
    margin-bottom: 12px;
  }
  
  .footer-brand p {
    font-size: 0.9rem;
    opacity: 0.7;
    line-height: 1.6;
  }
  
  /* HEADINGS */
  .site-footer h4 {
    font-size: 0.85rem;
    margin-bottom: 14px;
    font-weight: 500;
  }
  
  /* CONTACT */
  .footer-contact a {
    color: var(--black);
    text-decoration: none;
    opacity: 0.8;
  }
  
  .footer-contact a:hover {
    opacity: 1;
  }
  
  /* SOCIAL */
  .footer-social-icons {
    display: flex;
    gap: 16px;
  }
  
  .social-icon {
    width: 20px;
    height: 20px;
    fill: var(--black);
    opacity: 0.6;
    transition: 0.3s ease;
  }
  
  .social-icon:hover {
    opacity: 1;
  }
  
  /* MAP */
  .map-wrapper iframe {
    width: 100%;
    height: 160px;
    border: none;
    border-radius: 12px;
  }
  
  /* BOTTOM BAR */
  .footer-bottom {
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    padding: 24px 20px;
  }
  
  .footer-bottom-inner {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
  }
  
  .footer-links a {
    font-size: 0.8rem;
    color: var(--black);
    opacity: 0.6;
    margin-right: 16px;
    text-decoration: none;
  }
  
  .footer-links a:hover {
    opacity: 1;
  }
  
  .footer-copy {
    font-size: 0.75rem;
    opacity: 0.6;
  }

  .map-wrapper {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
  }
  
  .map-wrapper iframe {
    width: 100%;
    height: 160px;
    border: none;
    border-radius: 12px;
  }
  
 /* overlay zakrywający dół mapy */
 .map-wrapper {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
}

.map-wrapper iframe {
  width: 100%;
  height: 160px;
  border: none;
  filter: grayscale(30%) contrast(95%) brightness(98%);
}

.map-disabled {
  pointer-events: none;
}

/* OVERLAY – TOP, SUBTELNY, ALE CZYTELNY */
.map-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 10px 12px;          /* niższy pasek */
  background: rgb(255, 255, 255); /* mocniejsze krycie */
  text-align: center;
  font-size: 0.75rem;
  color: var(--black);
  text-decoration: none;
  opacity: 0.9;
  transition: opacity 0.1s ease;
}

.map-overlay:hover {
  opacity: 1;
}

  .map-disabled {
    pointer-events: none;
  }
  
  /* =========================
     MOBILE
     ========================= */
  @media (max-width: 768px) {
  
    .footer-container {
      grid-template-columns: 1fr;
      gap: 40px;
      padding-bottom: 60px;
    }
  
    .footer-bottom-inner {
      flex-direction: column;
      text-align: center;
    }
  
    .footer-links a {
      margin-right: 10px;
    }
  }
  
  /* =========================
   NAVIGATION – PREMIUM
   ========================= */

.main-nav {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
}

.nav-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* LOGO */
@media (min-width: 769px) {
  .nav-logo img {
    height: 120px;
  }
}

/* DESKTOP LINKS */
@media (min-width: 769px) {
  .nav-links {
  list-style: none;
  display: flex;
  gap: 28px;
  margin-left: auto;
  margin-right: 20px;
}
}
.nav-links a {
  text-decoration: none;
  font-size: 0.85rem;
  color: #ffffff;
  opacity: 0.75;
  transition: opacity 0.2s ease;
}

.nav-links a:hover {
  opacity: 1;
}

/* MOBILE TOGGLE */
#nav-toggle {
  display: none;
}

.nav-toggle-label {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
}

.nav-toggle-label span {
  width: 22px;
  height: 2px;
  background: #ffffff;
  opacity: 0.8;
}

/* MOBILE MENU */
.nav-mobile {
  display: none;
  position: absolute;
  top: 70px;
  right: 20px;
  background: rgba(0, 0, 0, 0.95);
  border-radius: 12px;
  padding: 20px;
  list-style: none;
  text-align: right;
}

.nav-mobile li {
  margin-bottom: 14px;
}

.nav-mobile li:last-child {
  margin-bottom: 0;
}

.nav-mobile a {
  text-decoration: none;
  font-size: 0.9rem;
  color: #ffffff;
  opacity: 0.85;
}

/* TOGGLE MOBILE MENU */
#nav-toggle:checked + .nav-toggle-label + .nav-mobile {
  display: block;
}

/* =========================
   RESPONSIVE
   ========================= */
@media (max-width: 768px) {

  .nav-links {
    display: none;
  }

  .nav-toggle-label {
    display: flex;
  }

  /* LOGO */
  .nav-logo img {
  height: 75px;
  display: block;
}

}

/* =========================
   CLASSIC HERO
   ========================= */

.classic-hero {
  background:
    linear-gradient(
      rgba(14,14,14,0.85),
      rgba(14,14,14,0.85)
    ),
    url("classic-hero.jpg") center / cover no-repeat;

  color: #ffffff;
   min-height: 70vh;
  padding-top: 110px; /* miejsce na logo */
  

  padding: 100px 20px 80px;
}
  
  .classic-hero-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  align-items: center;
  gap: 70px;
}


.classic-hero-image img {
  width: 100%;
  max-height: 480px;
  object-fit: cover;
  filter: saturate(0.75) contrast(0.95) brightness(0.9);
}
  
  /* TEXT */
  .classic-hero-content h1 {
    font-family: 'Playfair Display', serif;
    font-size: 2.6rem;
    line-height: 1.2;
    margin-bottom: 24px;
  }
  
  .classic-subtitle {
    font-size: 1.05rem;
    line-height: 1.6;
    color: #e0e0e0;
    margin-bottom: 20px;
    max-width: 520px;
  }
  
  .classic-meta {
    font-size: 0.85rem;
    color: #bfa76a;
    letter-spacing: 0.3px;
    margin-bottom: 40px;
  }
  
  /* CTA */
  .classic-cta {
    display: inline-block;
    padding: 14px 34px;
    border: 1px solid #bfa76a;
    color: #bfa76a;
    text-decoration: none;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
    transition: all 0.25s ease;
  }
  
  .classic-cta:hover {
    background: #bfa76a;
    color: #000;
  }
  
  /* IMAGE */
  .classic-hero-image img {
    width: 100%;
    height: auto;
    border-radius: 18px;
    object-fit: cover;
  }

  /* ZAOKRĄGLONE CTA */

  
  /* =========================
     RESPONSIVE
     ========================= */
  
  @media (max-width: 768px) {
  
    .classic-hero {
      padding: 90px 20px 60px;
    }
  
    .classic-hero-inner {
      grid-template-columns: 1fr;
      gap: 40px;
    }
  
    .classic-hero-content h1 {
      font-size: 2rem;
    }
  
    .classic-subtitle {
      font-size: 1rem;
    }
  
    .classic-cta {
      padding: 12px 30px;
    }
  }
  

 /* =========================
   CLASSIC – AUDIENCE
   ========================= */

.classic-audience {
  background: #f7f7f7;
  padding: 100px 20px;
  color: #111;
}

.classic-audience h2 {
  text-align: center;
  font-family: 'Playfair Display', serif;
  font-size: 2.1rem;
  margin-bottom: 70px;
}

/* GRID */
.classic-audience-grid {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
}

/* CARDS */
.classic-audience-card {
  background: #ffffff;
  border: 1px solid #e5e5e5;
  padding: 45px 40px;
  border-radius: 18px;
  border-left: 3px solid #bfa76a;
}

.classic-audience-card h3 {
  font-size: 1rem;
  font-weight: 500;
  margin-bottom: 25px;
}

.classic-audience-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.classic-audience-card li {
  font-size: 0.95rem;
  line-height: 1.6;
  margin-bottom: 16px;
}

.classic-audience-card li strong {
  font-weight: 600;
}

/* NOTE */
.classic-audience-note {
  max-width: 900px;
  margin: 60px auto 0;
  text-align: center;
  font-size: 0.85rem;
  color: #666;
  line-height: 1.6;
}

/* =========================
   RESPONSIVE
   ========================= */

@media (max-width: 768px) {

  .classic-audience {
    padding: 70px 20px;
  }

  .classic-audience h2 {
    font-size: 1.7rem;
    margin-bottom: 45px;
  }

  .classic-audience-grid {
    grid-template-columns: 1fr;
    gap: 35px;
  }

  .classic-audience-card {
    padding: 35px 30px;
  }
}

/* =========================
   CLASSIC – PROCESS
   ========================= */

   .classic-process {
    background: #ffffff;
    padding: 100px 20px;
    color: #111;
  }
  
  .classic-process h2 {
    text-align: center;
    font-family: 'Playfair Display', serif;
    font-size: 2.1rem;
    margin-bottom: 20px;
  }
  
  .classic-process-subtitle {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 70px;
    font-size: 1rem;
    line-height: 1.6;
    color: #555;
  }
  
  /* GRID */
  .classic-process-grid {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 35px;
  }
  
  /* CARD */
  .classic-process-card {
    background: #f9f9f9;
    border: 1px solid #e6e6e6;
    border-radius: 18px;
    padding: 40px 30px;
  }
  
  .classic-process-card h3 {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 14px;
  }
  
  .classic-process-card p {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #333;
  }
  
  /* NOTE */
  .classic-process-note {
    text-align: center;
    max-width: 900px;
    margin: 60px auto 0;
    font-size: 0.85rem;
    color: #666;
  }
  
  /* =========================
     RESPONSIVE
     ========================= */
  
  @media (max-width: 1024px) {
    .classic-process-grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  
  @media (max-width: 768px) {
  
    .classic-process {
      padding: 70px 20px;
    }
  
    .classic-process h2 {
      font-size: 1.7rem;
    }
  
    .classic-process-subtitle {
      margin-bottom: 45px;
      font-size: 0.95rem;
    }
  
    .classic-process-grid {
      grid-template-columns: 1fr;
      gap: 30px;
    }
  
    .classic-process-card {
      padding: 35px 28px;
    }
  }
  
  .classic-process-card {
    position: relative;
    padding-left: 36px;
  }
  
  .classic-process-card::before {
    content: '';
    position: absolute;
    left: 16px;
    top: 40px;
    bottom: 40px;
    width: 2px;
    background: #bfa76a;
    opacity: 0.4;
  }

  .process-step {
    display: block;
    font-size: 0.8rem;
    letter-spacing: 1px;
    color: #bfa76a;
    margin-bottom: 12px;
  }

  /* =========================
   CLASSIC – RESULTS
   ========================= */

.classic-results {
  background: #ffffff;
  padding: 100px 20px;
  color: #111;
}

.classic-results h2 {
  text-align: center;
  font-family: 'Playfair Display', serif;
  font-size: 2.1rem;
  margin-bottom: 25px;
}

.classic-results-intro {
  max-width: 820px;
  margin: 0 auto 70px;
  text-align: center;
  font-size: 1rem;
  line-height: 1.6;
  color: #555;
}

/* GRID */
.classic-results-grid {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 25px;
}

/* IMAGES */
.classic-results-grid img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 16px;
  display: block;

  filter: saturate(0.8) brightness(0.92) contrast(0.95);
  transition: filter 0.4s ease;
}


/* =========================
   RESPONSIVE
   ========================= */

@media (max-width: 768px) {

  .classic-results {
    padding: 70px 20px;
  }

  .classic-results h2 {
    font-size: 1.7rem;
  }

  .classic-results-intro {
    margin-bottom: 45px;
    font-size: 0.95rem;
  }

  .classic-results-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .classic-results-grid img {
    aspect-ratio: 4 / 5;
  }
}


/* =========================
   CLASSIC – BENEFITS
   ========================= */

   .classic-benefits {
    background: #ffffff;
    padding: 100px 20px;
    color: #111;
  }
  
  .classic-benefits h2 {
    text-align: center;
    font-family: 'Playfair Display', serif;
    font-size: 2.1rem;
    margin-bottom: 70px;
  }
  
  /* GRID */
  .classic-benefits-grid {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
  }
  
  /* ITEM */
  .classic-benefit {
    text-align: center;
    padding: 20px;
  }
  
  .classic-benefit-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    margin-bottom: 18px;
    color: #bfa76a;
  }
  
  .classic-benefit-icon svg {
    width: 100%;
    height: 100%;
  }
  
  .classic-benefit h3 {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 12px;
  }
  
  .classic-benefit p {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #333;
  }
  
  /* NOTE */
  .classic-benefits-note {
    max-width: 900px;
    margin: 60px auto 0;
    text-align: center;
    font-size: 0.85rem;
    color: #666;
  }
  
  /* =========================
     RESPONSIVE
     ========================= */
  
  @media (max-width: 1024px) {
    .classic-benefits-grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 35px;
    }
  }
  
  @media (max-width: 768px) {
  
    .classic-benefits {
      padding: 70px 20px;
    }
  
    .classic-benefits h2 {
      font-size: 1.7rem;
      margin-bottom: 45px;
    }
  
    .classic-benefits-grid {
      grid-template-columns: 1fr;
      gap: 30px;
    }
  
    .classic-benefit {
      padding: 10px 0;
    }
  }

  
  /* =========================
   CLASSIC – INTIMATE
   ========================= */

.classic-intimate {
  background: #f6f6f6; /* delikatne wyróżnienie tła */
  padding: 100px 20px;
  color: #111;
}

.classic-intimate h2 {
  text-align: center;
  font-family: 'Playfair Display', serif;
  font-size: 2.1rem;
  margin-bottom: 25px;
}

.classic-intimate-intro {
  max-width: 760px;
  margin: 0 auto 70px;
  text-align: center;
  font-size: 1rem;
  line-height: 1.6;
  color: #555;
}

/* GRID */
.classic-intimate-grid {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 45px;
}

/* CARD */
.classic-intimate-card {
  background: #ffffff;
  border: 1px solid #e5e5e5;
  border-radius: 18px;
  padding: 45px 40px;
  border-left: 2px solid #bfa76a;
}

.classic-intimate-card h3 {
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 14px;
}

.classic-intimate-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #333;
}

/* NOTE */
.classic-intimate-note {
  max-width: 900px;
  margin: 60px auto 0;
  text-align: center;
  font-size: 0.85rem;
  color: #666;
}

/* =========================
   RESPONSIVE
   ========================= */

@media (max-width: 1024px) {
  .classic-intimate-grid {
    grid-template-columns: 1fr;
    gap: 35px;
  }
}

@media (max-width: 768px) {

  .classic-intimate {
    padding: 70px 20px;
  }

  .classic-intimate h2 {
    font-size: 1.7rem;
  }

  .classic-intimate-intro {
    margin-bottom: 45px;
    font-size: 0.95rem;
  }

  .classic-intimate-card {
    padding: 35px 30px;
  }
}


/* =========================
   CLASSIC – PRICE
   ========================= */

   .classic-price {
    background: #ffffff;
    padding: 100px 20px;
    color: #111;
  }
  
  .classic-price h2 {
    text-align: center;
    font-family: 'Playfair Display', serif;
    font-size: 2.1rem;
    margin-bottom: 60px;
  }
  
  /* CARD */
  .classic-price-card {
    max-width: 520px;
    margin: 0 auto;
    background: #f9f9f9;
    border: 1px solid #e5e5e5;
    border-radius: 22px;
    padding: 50px 45px;
    text-align: center;
  }
  
  /* NAME */
  .classic-price-name {
    font-size: 0.95rem;
    color: #555;
    margin-bottom: 16px;
  }
  
  /* PRICE */
  .classic-price-amount {
    font-family: 'Playfair Display', serif;
    font-size: 3rem;
    color: #bfa76a;
    margin-bottom: 12px;
  }
  
  /* SUB */
  .classic-price-sub {
    font-size: 0.9rem;
    color: #666;
    margin-bottom: 35px;
  }
  
  /* LIST */
  .classic-price-list {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: left;
  }
  
  .classic-price-list li {
    font-size: 0.95rem;
    line-height: 1.6;
    padding: 8px 0;
    border-bottom: 1px solid #e5e5e5;
  }

  .classic-price-list li {
    position: relative;
    padding-left: 28px;
    font-size: 0.95rem;
    line-height: 1.6;
    padding-top: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e5e5e5;
  }
  
  .classic-price-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 9px;
    color: #bfa76a;
    font-size: 0.9rem;
    font-weight: 600;
  }
  
  .classic-price-list li:last-child {
    border-bottom: none;
  }
  
  /* NOTE */
  .classic-price-note {
    margin-top: 45px;
    text-align: center;
    font-size: 0.85rem;
    color: #666;
  }
  
  /* =========================
     RESPONSIVE
     ========================= */
  
  @media (max-width: 768px) {
  
    .classic-price {
      padding: 70px 20px;
    }
  
    .classic-price h2 {
      font-size: 1.7rem;
      margin-bottom: 40px;
    }
  
    .classic-price-card {
      padding: 40px 30px;
    }
  
    .classic-price-amount {
      font-size: 2.4rem;
    }
  }

  /* =========================
   CLASSIC – UPGRADE INFO
   ========================= */

.classic-upgrade {
  padding: 60px 20px;
  background: #fafafa; /* delikatne odcięcie od sekcji ceny */
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
}

.classic-upgrade-text {
  max-width: 700px;
  margin: 0 auto;
  text-align: center;
  font-size: 0.95rem;
  line-height: 1.6;
  color: #444;
}

/* LINK */
.classic-upgrade-text a {
  display: inline-block;
  margin-top: 10px;
  text-decoration: none;
  color: #bfa76a;
  font-weight: 500;
  transition: opacity 0.2s ease;
}

.classic-upgrade-text a:hover {
  opacity: 0.7;
}

/* =========================
   RESPONSIVE
   ========================= */

@media (max-width: 768px) {

  .classic-upgrade {
    padding: 45px 20px;
  }

  .classic-upgrade-text {
    font-size: 0.9rem;
  }
}

  
/* =========================
   CLASSIC – CONTACT
   ========================= */

   .classic-contact {
    background: #f6f6f6;
    padding: 100px 20px;
    color: #111;
  }
  
  .classic-contact h2 {
    text-align: center;
    font-family: 'Playfair Display', serif;
    font-size: 2.1rem;
    margin-bottom: 20px;
  }
  
  .classic-contact-intro {
    max-width: 760px;
    margin: 0 auto 60px;
    text-align: center;
    font-size: 1rem;
    line-height: 1.6;
    color: #555;
  }
  
  /* FORM */
  .classic-contact-form {
    max-width: 520px;
    margin: 0 auto;
    background: #ffffff;
    border: 1px solid #e5e5e5;
    border-radius: 22px;
    padding: 50px 45px;
  }
  
  /* GROUP */
  .classic-form-group {
    margin-bottom: 22px;
  }
  
  .classic-form-group label {
    display: block;
    font-size: 0.85rem;
    margin-bottom: 6px;
    color: #555;
  }
  
  /* INPUTS */
  .classic-contact-form input,
  .classic-contact-form textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #dcdcdc;
    border-radius: 10px;
    font-size: 0.95rem;
    font-family: inherit;
    color: #111;
    background: #ffffff;
  }
  
  .classic-contact-form textarea {
    resize: vertical;
  }
  
  .classic-contact-form input:focus,
  .classic-contact-form textarea:focus {
    outline: none;
    border-color: #bfa76a;
  }
  
  /* BUTTON */
  .classic-contact-btn {
    width: 100%;
    margin-top: 10px;
    padding: 14px;
    border-radius: 30px;
    border: 1px solid #bfa76a;
    background: transparent;
    color: #bfa76a;
    font-size: 0.95rem;
    cursor: pointer;
    transition: all 0.25s ease;
  }
  
  .classic-contact-btn:hover {
    background: #bfa76a;
    color: #ffffff;
  }
  
  /* RODO */
  .classic-contact-rodo {
    margin-top: 25px;
    font-size: 0.75rem;
    line-height: 1.5;
    color: #777;
  }
  
  /* NOTE */
  .classic-contact-note {
    margin-top: 10px;
    text-align: center;
    font-size: 0.75rem;
    color: #777;
  }
  
  /* =========================
     RESPONSIVE
     ========================= */
  
  @media (max-width: 768px) {
  
    .classic-contact {
      padding: 70px 20px;
    }
  
    .classic-contact h2 {
      font-size: 1.7rem;
    }
  
    .classic-contact-intro {
      margin-bottom: 45px;
      font-size: 0.95rem;
    }
  
    .classic-contact-form {
      padding: 40px 30px;
    }
  }

  
  /* =========================
   CLASSIC – FAQ
   ========================= */

.classic-faq {
  background: #ffffff;
  padding: 100px 20px;
  color: #111;
}

.classic-faq h2 {
  text-align: center;
  font-family: 'Playfair Display', serif;
  font-size: 2.1rem;
  margin-bottom: 70px;
}

/* LIST */
.classic-faq-list {
  max-width: 820px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

/* ITEM */
.classic-faq-item {
  padding-bottom: 30px;
  border-bottom: 1px solid #e5e5e5;
}

.classic-faq-item:last-child {
  border-bottom: none;
}

/* QUESTION */
.classic-faq-item h3 {
  font-size: 1.05rem;
  font-weight: 600;
  margin-bottom: 12px;
}

/* ANSWER */
.classic-faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #333;
}

/* =========================
   RESPONSIVE
   ========================= */

@media (max-width: 768px) {

  .classic-faq {
    padding: 70px 20px;
  }

  .classic-faq h2 {
    font-size: 1.7rem;
    margin-bottom: 45px;
  }

  .classic-faq-list {
    gap: 30px;
  }

  .classic-faq-item h3 {
    font-size: 1rem;
  }

  .classic-faq-item p {
    font-size: 0.93rem;
  }
}


/* =========================
   CLASSIC + WET – HERO (DARK)
   ========================= */

.classic-wet-hero {
  background: #0e0e0e; /* spójne z hero classic */
  padding: 110px 20px 90px;
  color: #ffffff;
}

.classic-wet-hero-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 70px;
  align-items: center;
}

/* TEXT */
.classic-wet-hero-text h1 {
  font-family: 'Playfair Display', serif;
  font-size: 2.4rem;
  line-height: 1.25;
  margin-bottom: 26px;
  color: #ffffff;
}

.classic-wet-hero-subtitle {
  font-size: 1.05rem;
  line-height: 1.6;
  color: #d0d0d0;
  margin-bottom: 18px;
}

.classic-wet-hero-info {
  font-size: 0.85rem;
  color: #9a9a9a;
  margin-bottom: 38px;
}

/* CTA */
.classic-wet-hero-cta {
  display: inline-block;
  text-decoration: none;
  font-size: 0.95rem;
  color: #bfa76a;
  border: 1px solid #bfa76a;
  padding: 12px 30px;
  border-radius: 30px;
  transition: all 0.25s ease;
}

.classic-wet-hero-cta:hover {
  background: #bfa76a;
  color: #0e0e0e;
}

/* IMAGE */

.classic-wet-hero-image {
  position: relative;
  height: min(65vh,520px);
  overflow: hidden;
  border-radius: 22px;
}

.classic-wet-hero-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 100%;
  display: block;

  filter: saturate(0.85) brightness(0.9);
}

.classic-wet-hero-image2 {
  position: relative;
  height: min(65vh,520px);
  overflow: hidden;
  border-radius: 22px;
}

.classic-wet-hero-image2 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  display: block;

  filter: saturate(0.85) brightness(0.9);
}

/* =========================
   RESPONSIVE
   ========================= */

@media (max-width: 1024px) {
  .classic-wet-hero-inner {
    gap: 45px;
  }
}

@media (max-width: 768px) {

  .classic-wet-hero {
    padding: 80px 20px 70px;
  }

  .classic-wet-hero-inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .classic-wet-hero-text h1 {
    font-size: 1.85rem;
  }

  .classic-wet-hero-subtitle {
    font-size: 0.95rem;
  }

  .classic-wet-hero-info {
    font-size: 0.8rem;
  }
}

.audience-note {
  margin-top: 1.5rem;
  font-size: 0.9rem;
  line-height: 1.6;
  color: inherit; /* ta sama czcionka i kolor bazowy */
}

.audience-note a {
  color: var(--gold);
  text-decoration: none;
  font-weight: 500;
  transition: opacity 0.2s ease;
}

.audience-note a:hover {
  opacity: 0.8;
}


.classic-benefit-icon img {
  width: 50px;
  height: 50px;
  display: block;
  
}


/* LEGAL CONTENT (Polityka prywatności / Cookies) */
.legal-content {
  background: #ffffff;
  color: #000000;

  max-width: 900px;
  margin: 0 auto;
  padding: 120px 20px;
  box-shadow: 0 0 0 9999px #ffffff;
}

.legal-content h1,
.legal-content h2,
.legal-content h3 {
  color: #000000;
  text-align: left;
  margin-bottom: 30px;
}

.legal-content p,
.legal-content ul,
.legal-content ol {
  color: #000000;
  text-align: left;
  line-height: 1.8;
  margin-bottom: 20px;
}

.legal-content ul {
  padding-left: 20px;
}

.legal-content a {
  color: #000000;
  text-decoration: underline;
}

.legal-content a:hover {
  opacity: 0.7;
}


/* COOKIE BANNER */
.cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: #000;
  color: #fff;
  z-index: 9999;
  box-shadow: 0 -10px 30px rgba(0,0,0,0.4);
}

.cookie-banner-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 18px 24px;
  display: flex;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.cookie-text {
  font-size: 14px;
  line-height: 1.5;
  color: #eaeaea;
  max-width: 780px;
}

.cookie-text a {
  color: var(--gold);
  text-decoration: none;
}

.cookie-text a:hover {
  text-decoration: underline;
}

.cookie-actions {
  display: flex;
  gap: 12px;
}

.cookie-btn {
  font-family: inherit;
  font-size: 14px;
  padding: 10px 18px;
  border-radius: 999px;
  cursor: pointer;
  border: 1px solid transparent;
  transition: all 0.25s ease;
}

.cookie-accept {
  background: var(--gold);
  color: #000;
}

.cookie-accept:hover {
  background: #cfa85a;
}

.cookie-decline {
  background: transparent;
  color: #fff;
  border-color: #555;
}

.cookie-decline:hover {
  border-color: #aaa;
}


.site-header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 20;

  padding: 22px 26px;
  display: flex;
  align-items: center;
}

.site-logo img {
  height: 100px;
  width: auto;
  display: block;
}

@media (max-width: 768px) {
  .site-logo img {
    height: 74px;
  }

  .site-header {
    padding: 18px 20px;
  }
}

.back-home {
  padding: 70px 20px;
  background: #fafafa;
  border-top: 1px solid #e5e5e5;
}

.back-home-text {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
  font-size: 0.95rem;
  line-height: 1.7;
  color: #444;
}

.back-home-text a {
  display: inline-block;
  margin-top: 14px;
  color: #bfa76a; /* złoto */
  font-weight: 500;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.back-home-text a:hover {
  opacity: 0.75;
}


/* =========================
   TRAININGS GRID – DOSTĘPNE TERMINY
   ========================= */

.trainings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 36px;
  max-width: 1100px;
  margin: 0 auto 50px;
  padding: 0 20px;
}

.training-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(212, 175, 55, 0.3);
  border-radius: 14px;
  padding: 40px 36px;
  text-align: left;
  transition: border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}

.training-card:hover {
  border-color: rgba(212, 175, 55, 0.5);
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
}

.training-card-title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  color: #ffffff;
  margin: 0 0 18px 0;
  line-height: 1.3;
}

.training-card-date {
  font-size: 0.95rem;
  color: var(--gold);
  margin-bottom: 14px;
  opacity: 0.95;
}

.training-card-price {
  font-size: 1.1rem;
  font-weight: 500;
  color: var(--gold);
  margin-bottom: 14px;
}

.training-card-places {
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.8);
  margin-bottom: 24px;
}

.training-card-btn {
  display: inline-block;
  padding: 14px 32px;
  border: 1px solid var(--gold);
  color: var(--gold);
  text-decoration: none;
  font-size: 0.8rem;
  letter-spacing: 0.5px;
  font-weight: 500;
  transition: 0.3s ease;
  text-align: center;
}

.training-card-btn:hover {
  background: var(--gold);
  color: var(--black);
}

.training-card-btn.disabled {
  border-color: rgba(255, 255, 255, 0.2);
  color: rgba(255, 255, 255, 0.4);
  cursor: not-allowed;
  pointer-events: none;
}

.training-card-btn.disabled:hover {
  background: transparent;
  color: rgba(255, 255, 255, 0.4);
}

.trainings-error,
.trainings-empty {
  max-width: 600px;
  margin: 0 auto;
  padding: 40px 24px;
  text-align: center;
  color: rgba(255, 255, 255, 0.8);
  font-size: 1rem;
  line-height: 1.6;
}

/* =========================
   CALENDAR – DOSTĘPNE TERMINY
   ========================= */

.calendar-wrap {
  max-width: 560px;
  margin: 0 auto 48px;
  padding: 32px 24px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(212, 175, 55, 0.3);
  border-radius: 14px;
}

.calendar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
  gap: 16px;
}

.calendar-month-title {
  font-family: 'Playfair Display', serif;
  font-size: 1.5rem;
  font-weight: 400;
  color: var(--gold);
  margin: 0;
}

.calendar-nav {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  background: transparent;
  border: 1px solid rgba(212, 175, 55, 0.4);
  color: var(--gold);
  font-size: 1.25rem;
  cursor: pointer;
  transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease;
  border-radius: 8px;
}

.calendar-nav:hover {
  background: rgba(212, 175, 55, 0.15);
  border-color: rgba(212, 175, 55, 0.6);
}

.calendar-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
  margin-bottom: 8px;
  text-align: center;
  font-size: 0.75rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.6);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.calendar-weekdays span {
  padding: 6px 0;
}

.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
}

.calendar-day {
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.4);
  border-radius: 8px;
  min-height: 40px;
}

.calendar-day--available {
  color: var(--gold);
  border: 1px solid rgba(212, 175, 55, 0.4);
  cursor: pointer;
  transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}

.calendar-day--available:hover {
  background: rgba(212, 175, 55, 0.15);
  border-color: rgba(212, 175, 55, 0.6);
}

.calendar-day--selected {
  background: rgba(212, 175, 55, 0.25);
  border: 1px solid var(--gold);
  color: #fff;
  cursor: pointer;
}

.calendar-day--selected:hover {
  background: rgba(212, 175, 55, 0.3);
}

.calendar-day--current {
  color: rgba(255, 255, 255, 0.7);
}

.calendar-no-dates {
  margin-top: 20px;
  margin-bottom: 0;
}

/* Panel szczegółów szkolenia */
.training-detail-panel {
  max-width: 560px;
  margin: 0 auto 50px;
  padding: 0 20px;
}

.training-detail-card {
  margin: 0;
}

.training-card-duration {
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.8);
  margin-bottom: 14px;
}

/* Harmonogram szkolenia – przycisk i rozwijana sekcja */
.training-schedule-trigger {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 24px;
  padding: 0;
  background: none;
  border: none;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--gold);
  cursor: pointer;
  transition: color 0.25s ease, opacity 0.25s ease;
}

.training-schedule-trigger:hover {
  opacity: 0.9;
  color: var(--gold);
}

.schedule-arrow {
  display: inline-block;
  transition: transform 0.25s ease;
}

.training-schedule-trigger[aria-expanded="true"] .schedule-arrow {
  transform: rotate(-180deg);
}

.training-schedule-wrap {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
  border-top: 1px solid rgba(212, 175, 55, 0.2);
}

.training-schedule-wrap.is-open {
  max-height: 1200px;
  padding-top: 20px;
  padding-bottom: 8px;
}

.training-schedule-main-title {
  font-family: 'Playfair Display', serif;
  font-size: 1.1rem;
  color: var(--gold);
  margin: 0 0 20px 0;
  line-height: 1.3;
}

.training-schedule-day-heading {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.95rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.95);
  margin: 18px 0 12px 0;
  line-height: 1.4;
}

.training-schedule-day-heading:first-of-type {
  margin-top: 0;
}

.training-schedule-list {
  list-style: none;
  padding-left: 0;
  margin: 0 0 8px 0;
}

.training-schedule-item {
  position: relative;
  padding-left: 18px;
  margin-bottom: 14px;
  font-size: 0.9rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.9);
}

.training-schedule-item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold);
}

.training-schedule-time {
  font-weight: 500;
  color: var(--gold);
}

.training-schedule-item-title {
  color: rgba(255, 255, 255, 0.95);
}

.training-schedule-item-desc {
  color: rgba(255, 255, 255, 0.8);
}

/* =========================
   TRAININGS – MOBILE
   ========================= */
@media (max-width: 768px) {
  .trainings-grid {
    grid-template-columns: 1fr;
    gap: 28px;
    margin-bottom: 40px;
  }

  .training-card {
    padding: 32px 28px;
  }

  .training-card-title {
    font-size: 1.15rem;
  }

  .calendar-wrap {
    padding: 24px 16px;
    margin-bottom: 36px;
  }

  .calendar-month-title {
    font-size: 1.25rem;
  }

  .calendar-nav {
    width: 36px;
    height: 36px;
    font-size: 1.1rem;
  }

  .calendar-day {
    font-size: 0.8rem;
    min-height: 36px;
  }

  .training-detail-panel {
    padding: 0 16px;
    margin-bottom: 40px;
  }

  .training-schedule-trigger {
    margin-top: 20px;
    font-size: 0.85rem;
  }

  .training-schedule-main-title {
    font-size: 1rem;
    margin-bottom: 16px;
  }

  .training-schedule-day-heading {
    font-size: 0.9rem;
    margin: 14px 0 10px 0;
  }

  .training-schedule-item {
    font-size: 0.85rem;
    margin-bottom: 12px;
    padding-left: 16px;
  }

  .training-schedule-item::before {
    width: 5px;
    height: 5px;
    top: 0.6em;
  }
}