:root{
    --ink:#26313D;
    --ink-soft:#57626C;
    --canvas:#F1F3F4;
    --canvas-alt:#E3E8E9;
    --navy:#34455E;
    --navy-deep:#283548;
    --turq:#86C9C7;
    --turq-deep:#3F7A78;
    --line:rgba(52,69,94,0.16);
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Manrope', sans-serif;
    background:var(--canvas);
    color:var(--ink);
    line-height:1.6;
    font-size:16px;
  }
  h1,h2,h3{
    font-family:'LINE Seed JP', sans-serif;
    font-weight:500;
    line-height:1.15;
    color:var(--navy);
  }
  h1{font-size:clamp(1.9rem, 5vw, 2.6rem); font-weight:700;}
  h2{font-size:clamp(1.5rem, 5vw, 2.2rem);}
  h3{font-size:1.15rem; font-weight:600;}
  a{color:inherit; text-decoration:none;}
  img,.ph{display:block; width:100%;}
  .wrap{max-width:1100px; margin:0 auto; padding-left:1.25rem; padding-right:1.25rem;}
  section{padding-top:4.5rem; padding-bottom:4.5rem;}

  /* placeholder photo blocks */
  .ph{
    background:linear-gradient(135deg, var(--canvas-alt), #D6E8E7);
    border:1px solid var(--line);
    border-radius:0;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:.5rem; color:var(--ink-soft); text-align:center;
    aspect-ratio:4/5;
  }
  .ph.wide{aspect-ratio:16/9;}
  .ph.square{aspect-ratio:1/1;}
  .ph svg{width:34px; height:34px; opacity:.55;}
  .ph img{width:100%; height:100%; object-fit:cover; display:block;}
  .ph span{font-size:.75rem; letter-spacing:.02em;}
  .bleed{border-left:none; border-right:none;}

  /* header */
  header{position:sticky; top:0; z-index:20; background:#FFFFFF; border-bottom:1px solid var(--line);}
  header .wrap{display:flex; align-items:center; justify-content:space-between; padding:.9rem 1.25rem;}
  .logo{display:flex; align-items:center;}
  .logo img{height:38px; width:auto; display:block;}
  .btn{
    display:inline-block; padding:.75rem 1.5rem; border-radius:0;
    font-weight:500; font-size:.9rem; border:1px solid var(--navy);
  }
  .btn-solid{background:var(--navy); color:var(--canvas);}
  .btn-solid:active{background:var(--navy-deep);}
  .btn-ghost{color:var(--navy);}

  .header-right{display:flex; align-items:center; gap:1.25rem;}
  .navtoggle{
    display:flex; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:.4rem;
  }
  .navtoggle span{width:22px; height:2px; background:var(--navy); display:block;}
  nav.menu{
    position:fixed; inset:0; top:68px; background-color:var(--canvas); z-index:19;
    transform:translate3d(100%,0,0); transition:transform .25s ease;
    padding:2rem 1.25rem; border-top:1px solid var(--line);
    -webkit-backface-visibility:hidden; backface-visibility:hidden;
    will-change:transform;
  }
  nav.menu.open{transform:translate3d(0,0,0);}
  nav.menu ul{list-style:none; display:flex; flex-direction:column; gap:1.5rem;}
  nav.menu a{font-family:'LINE Seed JP', sans-serif; font-size:1.4rem; color:var(--navy);}

  /* scroll-expand hero */
  .scroll-expand{position:relative; width:100%;}
  .scroll-expand__track{position:relative; width:100%;}
  .scroll-expand__stage{position:sticky; top:0; width:100%; overflow:hidden; min-height:70vh; --se-title-size:2.6rem;}
  .scroll-expand__frame{position:absolute; inset:0; will-change:clip-path;}
  .scroll-expand__media{
    position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
    will-change:transform; transform-origin:center; user-select:none; -webkit-user-drag:none;
  }
  .scroll-expand__media--placeholder{
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.75rem;
    background:linear-gradient(135deg, var(--canvas-alt), #D6E8E7); color:var(--ink-soft);
  }
  .scroll-expand__media--placeholder svg{width:44px; height:44px; opacity:.5;}
  .scroll-expand__scrim{
    position:absolute; inset:0; pointer-events:none;
    background:linear-gradient(to top, rgba(40,53,72,0.8), rgba(40,53,72,0.1) 45%, rgba(40,53,72,0.4));
    opacity:0;
  }
  .scroll-expand__overlay{
    position:absolute; inset:0; display:flex; flex-direction:column; align-items:center;
    justify-content:center; text-align:center; padding:8%; gap:1.25rem; will-change:opacity, transform;
  }
  .scroll-expand__lead{color:#fff; font-size:1.1rem; max-width:32rem; text-shadow:0 2px 16px rgba(0,0,0,0.35);}
  .scroll-expand__actions{display:flex; flex-direction:column; gap:.75rem;}
  .btn-ghost-light{
    display:inline-block; padding:.75rem 1.5rem; border-radius:0;
    font-weight:500; font-size:.9rem; border:1px solid rgba(255,255,255,0.6); color:#fff;
  }
  .scroll-expand__title{
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    margin:0; padding:0 8%; text-align:center; font-size:var(--se-title-size); font-weight:700;
    line-height:1.1; color:#fff; text-shadow:0 2px 24px rgba(0,0,0,0.45);
    pointer-events:none; will-change:opacity, transform; font-family:'LINE Seed JP', sans-serif;
  }
  .scroll-expand__hint{
    position:absolute; left:0; right:0; bottom:1.5rem; text-align:center;
    font-size:.8rem; letter-spacing:.04em; color:rgba(255,255,255,0.7); pointer-events:none;
    will-change:opacity, transform;
  }

  /* hero */
  .hero{padding:2.5rem 0 3rem;}
  .hero .ph{aspect-ratio:3/4; margin:0 -1.25rem 1.75rem; width:calc(100% + 2.5rem);}
  .hero-text{perspective:600px;}
  .hero .eyebrow{font-size:.8rem; letter-spacing:.12em; text-transform:uppercase; color:var(--turq-deep); font-weight:600; margin-bottom:.75rem;}
  .hero p.lead{color:var(--ink-soft); font-size:1.05rem; margin:1rem 0 1.75rem; max-width:32rem;}
  .hero .actions{display:flex; flex-direction:column; gap:.75rem;}

  /* credentials plaque - signature element */
  .plaque{background:var(--navy-deep); color:var(--canvas);}
  .plaque .wrap{
    display:flex; flex-direction:column; gap:1.25rem; padding:2.25rem 1.25rem;
    text-align:center;
  }
  .plaque .item p{font-family:'LINE Seed JP', sans-serif; font-size:1.6rem; font-weight:500;}
  .plaque .item span{
    display:block; font-size:.7rem; letter-spacing:.14em; text-transform:uppercase;
    color:#AFCDCB; margin-top:.25rem;
  }

  /* intro */
  .intro .grid{display:flex; flex-direction:column; gap:2rem;}
  .intro .ph{aspect-ratio:5/4;}
  .intro p{color:var(--ink-soft); margin-top:1rem;}

  /* offer band */
  .offer{background:var(--canvas);}
  .offer .card{
    border:1px solid var(--line); border-radius:0; background:#FFFFFF;
    padding:1.75rem; text-align:left;
    display:flex; flex-direction:column; gap:1.25rem;
  }
  .offer .card .ph{
    aspect-ratio:4/3; margin:0;
  }
  .offer .card .ph svg{width:26px; height:26px;}
  .offer .tag{
    display:inline-block; background:var(--turq); color:var(--navy-deep); font-size:.7rem;
    letter-spacing:.1em; text-transform:uppercase; padding:.3rem .75rem; border-radius:0;
    margin-bottom:1rem; font-weight:600;
  }
  .offer p{color:var(--ink-soft); margin:.75rem 0 1.5rem;}

  @media (min-width:640px){
    .offer .card{flex-direction:row; align-items:stretch;}
    .offer .card .ph{width:220px; flex-shrink:0; aspect-ratio:auto; height:auto;}
    .offer .card .text{flex:1; display:flex; flex-direction:column; justify-content:center; align-items:flex-start;}
  }

  /* services teaser */
  .services{background:var(--canvas-alt);}
  .services p{color:var(--ink-soft); margin:1rem 0 1.5rem; max-width:36rem;}

  /* gallery - masonry: each photo keeps its natural proportions, no forced cropping.
     Click a real photo to open it enlarged (lightbox). */
  .gallery .grid.masonry{
    display:block; columns:2; column-gap:.5rem; margin:2rem 0 0;
  }
  .gallery .ph{
    width:100%; display:inline-block; break-inside:avoid; margin:0 0 .5rem;
    border:1px solid var(--line); overflow:hidden; background:none;
    aspect-ratio:auto; border-radius:0;
  }
  .gallery .ph img{width:100%; height:auto; object-fit:unset; display:block; cursor:zoom-in;}
  .gallery .ph-placeholder{
    aspect-ratio:4/3; background:linear-gradient(135deg, var(--canvas-alt), #D6E8E7);
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:.5rem; color:var(--ink-soft); text-align:center; padding:1rem;
  }
  .gallery .ph-placeholder svg{width:34px; height:34px; opacity:.55;}
  .gallery .ph-placeholder span{font-size:.75rem; letter-spacing:.02em;}

  /* lightbox */
  .lightbox{
    position:fixed; inset:0; background:rgba(21,29,26,0.94); z-index:200;
    display:flex; align-items:center; justify-content:center;
    opacity:0; pointer-events:none; transition:opacity .2s ease; padding:2rem;
  }
  .lightbox.open{opacity:1; pointer-events:auto;}
  .lightbox img{max-width:100%; max-height:100%; object-fit:contain;}
  .lightbox-close{
    position:absolute; top:1.25rem; right:1.25rem; background:none; border:none;
    color:#fff; font-size:1.5rem; cursor:pointer; line-height:1; padding:.5rem;
  }

  /* testimonials */
  .testimonials-track{overflow:hidden; margin-top:2rem; -webkit-mask-image:linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); mask-image:linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);}
  .testimonials-scroll{display:flex; gap:1.5rem; width:max-content; animation:marquee 38s linear infinite;}
  .testimonials-track:hover .testimonials-scroll{animation-play-state:paused;}
  .testimonials blockquote{
    font-family:'LINE Seed JP', sans-serif; font-size:1.15rem; font-weight:400;
    color:var(--navy); border-left:3px solid var(--turq); padding-left:1.25rem;
    width:340px; flex-shrink:0;
  }
  .testimonials cite{display:block; margin-top:.75rem; font-family:'Manrope'; font-style:normal; font-size:.85rem; color:var(--ink-soft);}
  .testimonials-count{margin-top:2rem; font-weight:600; color:var(--navy);}
  .testimonials-more{display:inline-block; margin-top:.35rem; color:var(--turq-deep); font-weight:600; font-size:.9rem;}
  @keyframes marquee{from{transform:translateX(0);} to{transform:translateX(-50%);}}
  @media (prefers-reduced-motion: reduce){
    .testimonials-scroll{animation:none; flex-wrap:wrap; width:auto;}
    .testimonials-track{overflow:visible; mask-image:none; -webkit-mask-image:none;}
  }

  /* footer */
  footer{background:var(--navy-deep); color:var(--canvas); padding:3rem 0 2rem;}
  .footer-cta{display:flex; flex-direction:column; gap:.75rem; margin-bottom:2rem;}
  .footer-cta .btn-solid{background:var(--turq); color:var(--navy-deep); border-color:var(--turq);}
  .btn-ghost-light{
    display:inline-block; padding:.75rem 1.5rem; border-radius:0;
    font-weight:500; font-size:.9rem; border:1px solid rgba(255,255,255,0.4); color:var(--canvas);
  }
  footer h3{color:var(--canvas); font-size:1.3rem; margin-bottom:1rem;}
  footer p{color:#AFCDCB; font-size:.9rem; margin-bottom:.4rem;}
  footer p a{color:#AFCDCB; text-decoration:underline; text-underline-offset:2px;}
  footer .cols{display:flex; flex-direction:column; gap:2rem; margin-top:2rem;}

  /* desktop */
  @media (min-width:820px){
    .hero .wrap{display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center;}
    .hero .ph{aspect-ratio:4/5; margin:0; width:100%;}
    .gallery .grid.masonry{columns:3; column-gap:.75rem;}
    .gallery .ph{margin:0 0 .75rem;}
    .footer-cta{flex-direction:row;}
    .hero .actions{flex-direction:row;}
    .plaque .wrap{flex-direction:row; justify-content:space-between; text-align:left;}
    .intro .grid{flex-direction:row; align-items:center; gap:3rem;}
    .intro .ph{flex:1; aspect-ratio:4/3;}
    .intro .text{flex:1;}
    footer .cols{flex-direction:row; justify-content:space-between;}
    .navtoggle{display:none;}
    nav.menu{
      position:static; inset:auto; transform:none; padding:0; border:none; background:none;
    }
    nav.menu ul{flex-direction:row; gap:2rem;}
    nav.menu a{font-family:'Manrope', sans-serif; font-size:.95rem; font-weight:500;}
  }

/* cennik page */
.page-header{padding:6rem 0 1rem; text-align:center;}
.page-header p{color:var(--ink-soft); max-width:36rem; margin:.75rem auto 0;}
.price-category{margin-bottom:1rem;}
.price-category h2{margin-bottom:1rem;}
.price-row{
  display:flex; flex-direction:column; gap:.15rem;
  border-top:1px solid var(--line); padding:1rem 0;
}
.price-row .top{display:flex; justify-content:space-between; gap:1rem; align-items:baseline;}
.price-row .name{font-weight:500; color:var(--navy);}
.price-row .price{font-family:'LINE Seed JP', sans-serif; font-weight:500; white-space:nowrap;}
.price-row .desc{color:var(--ink-soft); font-size:.9rem;}
.price-row .time{color:var(--ink-soft); font-size:.8rem;}

/* team page */
.team-grid{display:flex; flex-direction:column; gap:2.5rem; margin-top:2rem;}
.team-card{display:flex; flex-direction:column; gap:1rem;}
.team-card .ph{aspect-ratio:1/1;}
.team-card h3{font-size:1.875rem; margin-bottom:.15rem;}
.team-card .role{color:var(--turq-deep); font-size:.85rem; font-weight:600; margin-bottom:.5rem;}
.team-card p{color:var(--ink-soft); font-size:.95rem;}

/* generic content page (kontakt, blog) */
.content-page .wrap{padding-top:1rem;}
.content-page p{color:var(--ink-soft); margin-bottom:1rem;}

@media (min-width:820px){
  .team-grid{flex-direction:row; flex-wrap:wrap;}
  .team-card{flex:1 1 28%;}
}

/* reveal-on-scroll: elementy startują niewidoczne TYLKO gdy JS faktycznie
   animuje (klasa dodawana przez reveal.js) — bez JS treść jest zawsze widoczna */
.js-anim-ready .reveal{opacity:0;}

/* kontakt page */
.kontakt-main{display:flex; flex-direction:column; gap:2rem; padding-top:1rem;}
.kontakt-main .ph{aspect-ratio:4/5;}
.kontakt-details p{color:var(--ink-soft); margin-bottom:1rem;}
.kontakt-facts p a{color:var(--navy); font-weight:500; text-decoration:underline; text-underline-offset:3px;}
.kontakt-actions{display:flex; flex-direction:column; gap:.75rem; margin-top:1.5rem;}

@media (min-width:820px){
  .kontakt-main{flex-direction:row; align-items:flex-start; gap:3rem;}
  .kontakt-main .ph{flex:0 0 38%;}
  .kontakt-details{flex:1;}
  .kontakt-actions{flex-direction:row;}
}

/* extra breathing room between page hero and main content on subpages */
.page-header{padding-bottom:2rem;}
.price-category:not(:first-child){margin-top:3rem; padding-top:1rem; border-top:1px solid var(--line);}

/* services icons row */
.services-inner{display:flex; flex-direction:column; align-items:flex-start; gap:1.5rem;}
.services-icons{display:flex; gap:1rem; order:-1;}
.kf-icon{width:44px; height:44px; color:var(--turq-deep); flex-shrink:0;}
@media (min-width:640px){
  .services-icons{gap:1.5rem; order:0;}
  .kf-icon{width:60px; height:60px;}
  .services-inner{flex-direction:row; align-items:center; justify-content:space-between; gap:1.5rem;}
}

/* team bio - pełny tekst, akapity oddzielone odstępem */
.team-card p + p{margin-top:.75rem;}

/* ScrollSmoother — CSS aktywne TYLKO gdy JS potwierdzi że biblioteka się wczytała
   (klasa dodawana w reveal.js). Bez tego zabezpieczenia strona przestałaby się
   scrollować, gdyby GSAP z jakiegoś powodu się nie wczytał. */
.smooth-scroll-ready #smooth-wrapper{
  position:fixed; top:0; left:0; width:100%; height:100%; overflow:hidden;
}
.smooth-scroll-ready #smooth-content{overflow:visible; width:100%;}

/* hero-static - jedno statyczne zdjęcie, inne kadrowanie/kolor tekstu mobile vs desktop */
.hero-static{position:relative; background:var(--canvas); padding:0;}
.hero-static__stage{position:relative; width:100%; overflow:hidden; height:560px;}
.hero-static__media{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  object-position:65% center; display:block;
}
.hero-static__scrim{
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to right, rgba(21,29,26,0.6) 0%, rgba(21,29,26,0.25) 55%, rgba(21,29,26,0.05) 85%);
}
.hero-static__overlay{
  position:absolute; inset:0; display:flex; flex-direction:column; align-items:flex-start;
  justify-content:center; padding-top:3rem; padding-bottom:3rem; perspective:600px;
}
.hero-static__overlay h1{
  color:#fff; text-shadow:0 2px 20px rgba(0,0,0,0.5); max-width:18ch;
}
.hero-static__overlay .lead{
  color:rgba(255,255,255,0.95); font-size:1.05rem; margin:1rem 0 1.75rem; max-width:26rem;
  text-shadow:0 2px 14px rgba(0,0,0,0.5);
}
.hero-static__overlay .actions{display:flex; flex-direction:row; flex-wrap:wrap; gap:.75rem;}

@media (min-width:820px){
  .hero-static__stage{height:640px;}
  .hero-static__media{object-position:center center;}
  .hero-static__scrim{
    background:linear-gradient(to right, var(--canvas) 0%, var(--canvas) 30%, rgba(241,243,244,0.55) 45%, rgba(241,243,244,0) 60%);
  }
  .hero-static__overlay h1{color:var(--navy); text-shadow:none;}
  .hero-static__overlay .lead{color:var(--ink-soft); text-shadow:none;}
}

.btn-white{
  display:inline-block; padding:.75rem 1.5rem; border-radius:0;
  font-weight:500; font-size:.9rem; border:1px solid var(--navy); background:#fff; color:var(--navy);
}

/* footer legal link */
.footer-legal{margin-top:2rem; padding-top:1.5rem; border-top:1px solid rgba(255,255,255,0.12);}
.footer-legal a{color:#AFCDCB; font-size:.8rem; text-decoration:underline; text-underline-offset:2px;}

/* cennik regulamin notice */
.cennik-notice{
  background:var(--canvas-alt); border-left:3px solid var(--turq); padding:.9rem 1.1rem;
  font-size:.9rem; color:var(--ink-soft);
}
.cennik-notice a{color:var(--navy); font-weight:600; text-decoration:underline; text-underline-offset:2px;}

/* skeyndor partner mention */
.skeyndor{padding-top:3rem; padding-bottom:3rem; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.skeyndor-inner{display:flex; flex-direction:column; gap:1.25rem; align-items:flex-start;}
.skeyndor-word{font-family:'LINE Seed JP', sans-serif; font-size:1.8rem; font-weight:700; letter-spacing:.04em; color:var(--navy); white-space:nowrap;}
.skeyndor-word span{font-size:.9rem; vertical-align:super;}
.eyebrow-alt{font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; color:var(--turq-deep); font-weight:600; margin-bottom:.4rem;}
.skeyndor-text p:not(.eyebrow-alt){color:var(--ink-soft); max-width:38rem;}

@media (min-width:768px){
  .skeyndor-inner{flex-direction:row; align-items:center; gap:3rem;}
}

/* mniejszy odstęp między dwoma kartami typu "offer" (Nowość + Skeyndor) */
.offer-nowosc{padding-bottom:1rem;}
.offer-skeyndor{padding-top:1rem;}

/* blog post - featured image + inline images */
.post-featured-image{border:1px solid var(--line); overflow:hidden; margin-bottom:1rem;}
.post-featured-image img{width:100%; height:auto; display:block; max-height:480px; object-fit:cover;}
.post-body img{width:100%; height:auto; display:block; margin:1.5rem 0; border:1px solid var(--line);}
.post-body h2, .post-body h3{margin-top:2rem;}
.post-body p{margin-bottom:1rem;}
.post-body ul, .post-body ol{margin:0 0 1.5rem 1.25rem;}
.post-body li{margin-bottom:.4rem;}
.post-body blockquote{border-left:3px solid var(--turq); padding-left:1.25rem; color:var(--ink-soft); margin:1.5rem 0;}

/* blog listing with thumbnails */
.blog-list-item{
  display:flex; flex-direction:column; gap:1rem;
  border-top:1px solid var(--line); padding:1.5rem 0;
}
.blog-list-thumb{display:block; flex-shrink:0; width:100%; aspect-ratio:4/3; overflow:hidden; border:1px solid var(--line);}
.blog-list-thumb img{width:100%; height:100%; object-fit:cover; display:block;}

@media (min-width:640px){
  .blog-list-item{flex-direction:row; align-items:flex-start;}
  .blog-list-thumb{width:200px; aspect-ratio:4/3;}
}