/* ===== Strona produktu Boka TWO — układ z promocja.bokagardenroom.pl =====
   Klasy z prefiksem pm- (żeby nie kolidowały ze style.css), zmienne tylko wewnątrz .promo. */

.promo {
  --ink:#1c1c1a;
  --ink-dark:#1c1c1a;
  --ink-soft:#5a5852;
  --paper:#ffffff;
  --paper-warm:#ffffff;
  --charcoal:#22252a;
  --charcoal-soft:#3a3d42;
  --wood:#3a3d42;
  --wood-light:#cfccc3;
  --terracotta-bg:#fbeee0;
  --terracotta-icon:#c97c3e;
  --line:#e7e1d6;
  --radius:2px;
  font-family: 'Raleway', -apple-system, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--paper);
  line-height: normal;
  -webkit-font-smoothing: antialiased;
  text-wrap: pretty;
}
:where(.promo) a { color: inherit; text-decoration: none; }
:where(.promo) a:hover { color: var(--wood); }
:where(.promo) h1, :where(.promo) h2, :where(.promo) h3 { margin: 0; font-weight: 800; letter-spacing: -0.01em; font-family: inherit; text-wrap: pretty; }
:where(.promo) p { margin: 0; line-height: 1.65; }
:where(.promo) button { font-family: inherit; cursor: pointer; }

.pm-wrap{max-width:1180px; margin:0 auto; padding:0 32px;}
.pm-eyebrow{
  text-transform:uppercase; letter-spacing:0.14em; font-size:12.5px; font-weight:700;
  color:var(--wood); margin-bottom:14px; display:flex; align-items:center; gap:10px;
}
.pm-eyebrow::before{content:""; width:26px; height:1.5px; background:var(--wood); display:inline-block;}
.pm-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:16px 30px; font-size:15px; font-weight:700; letter-spacing:0.02em;
  border-radius:var(--radius); border:1.5px solid transparent; white-space:nowrap;
  transition:transform .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}
.pm-btn:hover{transform:translateY(-1px);}
.pm-btn-primary{background:var(--ink-dark); color:#fff;}
.pm-btn-primary:hover{background:#000; color:#fff;}
.pm-btn-outline{background:transparent; color:var(--ink); border-color:var(--ink);}
.pm-btn-outline:hover{background:var(--ink); color:#fff;}
.pm-btn-light{background:#fff; color:var(--ink);}
.pm-section{padding:96px 0;}
.pm-section-tight{padding:64px 0;}
.pm-divider{height:1px; background:var(--line); border:none; margin:0;}
.pm-grid{display:grid; gap:28px;}

/* hero */
.pm-hero{background:var(--paper-warm); overflow:hidden;}
.pm-hero-inner{
  max-width:1180px; margin:0 auto; padding:76px 32px 0;
  display:grid; grid-template-columns:0.95fr 1.05fr; gap:56px; align-items:center;
}
.pm-badge-urgent{
  display:inline-flex; align-items:center; gap:8px; background:#fff;
  border:1.5px solid; font-weight:800; font-size:12.5px;
  letter-spacing:0.05em; text-transform:uppercase; padding:8px 14px; border-radius:var(--radius);
  margin-bottom:22px;
}
.pm-badge-urgent .pm-dot{width:7px; height:7px; border-radius:50%; flex:none;}
.pm-hero h1{font-size:clamp(2.3rem, 4.1vw, 3.4rem); line-height:1.08;}
.pm-hero-sub{font-size:17px; color:var(--ink-soft); margin-top:22px; max-width:52ch;}
.pm-price-block{
  margin-top:32px; display:flex; align-items:baseline; gap:14px; flex-wrap:wrap;
}
.pm-price-new{font-size:clamp(2.1rem,3.4vw,2.8rem); font-weight:900; color:var(--ink);}
.pm-price-net{font-size:13.5px; color:var(--ink-soft); width:100%; margin-top:2px;}
.pm-hero-ctas{display:flex; gap:16px; margin-top:30px; flex-wrap:wrap;}
.pm-hero-trust{
  margin-top:34px; padding-top:22px; border-top:1px solid var(--line);
  display:flex; gap:26px; flex-wrap:wrap; font-size:13px; color:var(--ink-soft); font-weight:600;
}
.pm-hero-trust span{display:flex; align-items:center; gap:8px;}
.pm-hero-media{position:relative;}
.pm-hero-media img{width:100%; height:auto; display:block; border-radius:var(--radius); transform:scale(1.265);}

/* full-bleed image bands */
.pm-parallax-band{position:relative; height:380px; overflow:hidden;}
.pm-band-img{
  position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover;
}
.pm-parallax-band-scroll{background-size:cover; background-position:center; background-attachment:fixed;}
.pm-spec-band-img{background-image:url('../img/promo/gallery-band.jpg');}
@media (max-width: 900px){
  .pm-parallax-band{height:260px;}
  .pm-parallax-band-scroll{background-attachment:scroll;}
}

/* section heads */
.pm-section-head{max-width:640px; margin-bottom:52px;}
.pm-section-head.pm-center{margin-left:auto; margin-right:auto; text-align:center;}
.pm-section-head h2{font-size:clamp(1.7rem,2.6vw,2.35rem); line-height:1.15;}
.pm-section-head p{margin-top:16px; color:var(--ink-soft); font-size:16px;}

/* o modelu */
.pm-about-grid{display:grid; grid-template-columns:1.15fr 0.85fr; gap:56px; align-items:start;}
.pm-about-grid img{border-radius:var(--radius);}
.pm-video-frame{position:relative; width:100%; padding-bottom:56.25%; height:0; border-radius:var(--radius); overflow:hidden; background:#000;}
.pm-video-frame iframe{position:absolute; top:0; left:0; width:100%; height:100%; border:0;}
.pm-embed-placeholder{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  border:0; padding:24px; cursor:pointer; background:#1c1c1a; font-family:inherit;
}
.pm-embed-placeholder img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0.5;}
.pm-embed-placeholder .pm-ep-inner{position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:12px; color:#fff; text-align:center;}
.pm-embed-placeholder .pm-ep-icon{width:60px; height:60px; border-radius:50%; background:#fff; color:var(--ink); display:flex; align-items:center; justify-content:center; font-size:22px; font-weight:800;}
.pm-embed-placeholder .pm-ep-label{font-size:14px; font-weight:700;}
.pm-embed-placeholder .pm-ep-note{font-size:12.5px; color:#d8d5cd; max-width:36ch;}
.pm-map-frame .pm-embed-placeholder{background:var(--paper-warm);}
.pm-map-frame .pm-embed-placeholder .pm-ep-icon{background:var(--ink); color:#fff;}
.pm-map-frame .pm-embed-placeholder .pm-ep-inner{color:var(--ink);}
.pm-map-frame .pm-embed-placeholder .pm-ep-note{color:var(--ink-soft);}

/* wizyta / mapa */
.pm-visit-card{background:var(--paper); border-radius:var(--radius); padding:44px; display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center;}
.pm-visit-card .pm-eyebrow::before{background:var(--wood);}
.pm-visit-copy p{margin-top:16px; color:var(--ink-soft); font-size:16px;}
.pm-map-frame{position:relative; width:100%; padding-bottom:78%; height:0; border-radius:var(--radius); overflow:hidden;}
.pm-map-frame iframe{position:absolute; top:0; left:0; width:100%; height:100%; border:0;}
@media (max-width:900px){ .pm-visit-card{grid-template-columns:1fr; padding:28px;} }

.pm-model-gallery{display:flex; flex-direction:column; gap:12px;}
.pm-model-gallery .pm-gallery-main{width:100%; height:auto; aspect-ratio:4/3; object-fit:cover;}
.pm-gallery-thumbs{display:grid; grid-template-columns:repeat(7,1fr); gap:10px;}
.pm-gallery-thumbs img{width:100%; height:78px; object-fit:cover; cursor:pointer; opacity:0.7; border:2px solid transparent; transition:opacity .15s ease, border-color .15s ease; box-sizing:border-box;}
.pm-gallery-thumbs img:hover{opacity:0.9;}
.pm-gallery-thumbs img.thumb-active{opacity:1; border-color:var(--ink);}
.pm-fn-chips{display:flex; gap:10px; flex-wrap:wrap; margin-top:26px;}
.pm-fn-chip{
  border:1.5px solid var(--line); padding:9px 16px; border-radius:30px; font-size:13.5px;
  font-weight:700; color:var(--ink);
}

/* usp cards */
.pm-usp-grid{grid-template-columns:repeat(3,1fr);}
.pm-usp-card{
  background:var(--paper-warm); padding:34px 28px; border-radius:var(--radius);
  border:1px solid var(--line);
}
.pm-usp-icon{
  width:52px; height:52px; border-radius:50%; background:var(--terracotta-bg);
  display:flex; align-items:center; justify-content:center; margin-bottom:20px;
}
.pm-usp-icon svg{width:24px; height:24px; stroke:var(--terracotta-icon);}
.pm-usp-card h3{font-size:18px; font-weight:700;}
.pm-usp-card p{margin-top:10px; font-size:14.5px; color:var(--ink-soft);}

/* spec */
.pm-spec-grid{grid-template-columns:repeat(3,1fr);}
.pm-spec-item{display:flex; gap:16px; align-items:flex-start;}
.pm-spec-icon{
  width:46px; height:46px; border-radius:50%; background:var(--terracotta-bg);
  display:flex; align-items:center; justify-content:center; flex:none;
}
.pm-spec-icon svg{width:20px; height:20px; stroke:var(--terracotta-icon);}
.pm-spec-item h3{font-size:15.5px; font-weight:700;}
.pm-spec-item p{font-size:13.5px; color:var(--ink-soft); margin-top:4px;}
.pm-spec-cta{
  margin-top:44px; display:flex; align-items:center; justify-content:center; gap:16px; flex-wrap:wrap;
  padding-top:36px; border-top:1px solid var(--line); text-align:center;
}
.pm-spec-cta p{font-size:14px; color:var(--ink-soft);}

.pm-model-gallery .pm-gallery-main{display:none;}
.pm-model-gallery .pm-gallery-main.active{display:block;}

@media (max-width: 900px){
  .pm-hero-inner{grid-template-columns:1fr; padding-top:44px;}
  .pm-hero-media{order:-1;}
  .pm-about-grid{grid-template-columns:1fr; gap:36px;}
  .pm-gallery-thumbs img{height:60px;}
  .pm-usp-grid, .pm-spec-grid{grid-template-columns:1fr !important;}
  .pm-section{padding:64px 0;}
  .pm-wrap{padding:0 20px;}
}

/* karta "Dopasujemy do Twoich potrzeb" w sekcji Inne modele (style kart: style.css) */
.pc-custom .thumb { display: flex; align-items: center; justify-content: center; color: var(--color-text-muted); }

/* okruszki w hero: powrót do strony głównej */
.pm-crumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 26px; font-size: 13px; font-weight: 600; color: var(--ink-soft); }
.pm-crumbs a:hover { color: var(--ink); }
.pm-crumbs [aria-current] { color: var(--ink); font-weight: 800; }
.pm-crumbs-back { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; color: var(--ink); border-bottom: 1.5px solid var(--ink); padding-bottom: 2px; }

/* specyfikacja pod sekcją "O modelu" — pełna szerokość */
.pm-spec-block { margin-top: 56px; }
.pm-spec-block .pm-usp-grid { margin-bottom: 44px; }
.pm-model-gallery .pm-gallery-main { cursor: zoom-in; }

/* galeria: scena z podpisem na zdjęciu */
.pm-gallery-stage { position: relative; }
.pm-model-gallery .pm-gallery-contain { object-fit: contain; background: #fff; }
.pm-model-gallery .pm-gallery-contain.pm-gallery-contain-dark { background: #14110d; }
.pm-gallery-caption { position: absolute; left: 0; right: 0; bottom: 0; padding: 30px 18px 14px; color: #fff; font-size: 14px; font-weight: 600; line-height: 1.4; background: linear-gradient(rgba(28,28,26,0), rgba(28,28,26,.88) 45%); pointer-events: none; }

/* podpis zdjęcia w lightboxie */
.lightbox .lb-caption { position: absolute; left: 50%; bottom: 28px; transform: translateX(-50%); max-width: min(92vw, 720px); margin: 0; padding: 12px 22px; background: rgba(0,0,0,.65); color: #fff; font-size: 1rem; font-weight: 600; line-height: 1.4; text-align: center; border-radius: 4px; }
.lightbox .lb-caption[hidden] { display: none; }

/* film w galerii (miniatura z ikoną odtwarzania, odtwarzacz w miejscu dużego zdjęcia) */
.pm-model-gallery .pm-gallery-video { position: relative; background: #000; }
.pm-gallery-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.pm-gallery-thumbs .pm-thumb-video { position: relative; display: block; padding: 0; border: 0; background: none; }
.pm-thumb-video:hover img { opacity: .9; }
.pm-thumb-video.thumb-active img { opacity: 1; border-color: var(--ink); }
.pm-thumb-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 24px; height: 24px; border-radius: 50%; background: #fff; color: var(--ink); display: flex; align-items: center; justify-content: center; font-size: 10px; pointer-events: none; }
@media (max-width: 640px) { .pm-gallery-thumbs { grid-template-columns: repeat(4, 1fr); } }

/* nazwa modelu w nagłówku hero — nieco jaśniejsza */
.pm-h1-model { display: block; margin-bottom: .16em; color: var(--ink-soft); }

/* plakietka "Dostępny od ręki" nad zdjęciem biura (zdjęcie jest powiększone o 26,5%, stąd większy dolny margines) */
.pm-hero-media .pm-badge-urgent { display: flex; width: fit-content; margin: 0 auto calc(11% + 8px); position: relative; z-index: 1; }

/* spacer 360 na pełną szerokość strony */
.pm-spacer-frame { height: clamp(380px, 78vh, 820px); padding-bottom: 0; border-radius: 0; }
.pm-spacer-frame .pm-embed-placeholder img { opacity: .7; }
.pm-spacer-frame .pm-ep-inner { text-shadow: 0 1px 10px rgba(0,0,0,.7); }
.pm-spacer-frame .pm-ep-note { color: #fff; }

/* film w galerii: plakat bez przycinania; film w lightboxie */
.pm-gallery-video .pm-embed-placeholder img { object-fit: contain; }
.lightbox .lb-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 84px; height: 84px; border: 0; border-radius: 50%; background: #fff; color: var(--color-accent-dark); font-size: 1.6rem; padding-left: 6px; cursor: pointer; }
.lightbox .lb-play[hidden] { display: none; }
.lightbox #lbVideo { width: min(92vw, calc(86vh * 16 / 9)); aspect-ratio: 16 / 9; border: 0; background: #000; }


/* dodatkowe opcje (np. Sauna BOX) pod parametrami */
.pm-options { margin-top: 40px; padding: 28px 32px; border: 1px solid var(--line); border-radius: var(--radius); }
.pm-options h3 { font-size: 18px; font-weight: 800; }
.pm-options ul { margin: 14px 0 0; padding-left: 18px; columns: 2; column-gap: 48px; color: var(--ink-soft); font-size: 14.5px; line-height: 1.7; }
.pm-options li { break-inside: avoid; }
@media (max-width: 900px) { .pm-options { padding: 22px 20px; } .pm-options ul { columns: 1; } }

/* hero produktów: treść na pełnoekranowym tle z paralaksą */
.pm-hero-parallax{
  position:relative; display:flex; align-items:center; color:#fff;
  min-height:calc((100vh - 76px) * .8 - 150px); min-height:calc((100svh - 76px) * .8 - 150px);
  background:#1c1c1a center/cover fixed;
}
.pm-hero-two{background-image:url('../img/promo/hero-interior-boka-two.jpg');}
.pm-hero-one{background-image:url('../img/one/one-27.jpg');}
.pm-hero-sauna{background-image:url('../img/sauna/hero-sauna.jpg');}
.pm-hero-parallax::before{content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(0,0,0,.74), rgba(0,0,0,.4) 60%, rgba(0,0,0,.22));}
.pm-hero-parallax .pm-hero-inner{position:relative; width:100%; padding:56px 32px;}
.pm-hero-parallax h1, .pm-hero-parallax .pm-price-new, .pm-hero-parallax .pm-crumbs a, .pm-hero-parallax .pm-crumbs [aria-current]{color:#fff;}
.pm-hero-parallax .pm-crumbs{color:rgba(255,255,255,.8);}
.pm-hero-parallax .pm-crumbs-back{border-bottom-color:#fff;}
.pm-hero-parallax .pm-h1-model{color:rgba(255,255,255,.78);}
.pm-hero-parallax .pm-hero-sub, .pm-hero-parallax .pm-price-net, .pm-hero-parallax .pm-hero-trust{color:rgba(255,255,255,.88);}
.pm-hero-parallax .pm-hero-trust{border-top-color:rgba(255,255,255,.32);}
.pm-hero-parallax .pm-btn-primary{background:#fff; color:var(--ink);}
.pm-hero-parallax .pm-btn-primary:hover{background:#f0efea; color:var(--ink);}
.pm-hero-parallax .pm-btn-outline{color:#fff; border-color:#fff;}
.pm-hero-parallax .pm-btn-outline:hover{background:#fff; color:var(--ink);}
@media (max-width: 900px){
  .pm-hero-parallax{background-attachment:scroll;}
  .pm-hero-parallax .pm-hero-inner{padding:36px 20px;}
}
.pm-hero-parallax .pm-hero-inner{grid-template-columns:1fr;}
.pm-hero-parallax .pm-badge-urgent{margin-bottom:22px;}

/* galeria: lekko zaokrąglone rogi */
.pm-model-gallery .pm-gallery-main{border-radius:6px;}
.pm-model-gallery .pm-gallery-video{overflow:hidden;}
.pm-gallery-thumbs img{border-radius:4px;}