/**
 * Prvi Korak / NeoWeb Studio — Wayo about section.
 * All rules scoped to the widget so existing pages and header are unaffected.
 * Original reference classes retained inside .pk-about-section.
 */
.pk-about-section {
  --pk-about-text-width:60%;
  --pk-about-reveal-duration:800ms;
  --pk-about-reveal-delay:600ms;
  --pk-about-letter-stagger:38ms;
  width:100%;
  padding-block:var(--pk-section-space,80px);
  background-color:var(--pk-light,#eef2f2);
  overflow:clip;
  position:relative;
}
.pk-about-section .base-container {
  width:100%;
  max-width:var(--pk-container,1440px);
  margin-inline:auto;
  padding-inline:15px;
  min-width:0;
}
.pk-about-section .about-section {
  display:flex;
  align-items:stretch;
  column-gap:40px;
  row-gap:30px;
  min-width:0;
}
.pk-about-section .about-text-content-box {
  flex:0 1 calc(var(--pk-about-text-width) - 20px);
  width:var(--pk-about-text-width);
  min-width:0;
}
.pk-about-section .about-title-wrapper {min-width:0;}
.pk-about-section .about-title-wrapper h2 {
  font-family:var(--pk-font-heading,"Agdasima",sans-serif);
  color:var(--pk-dark,#313432);
  font-size:var(--pk-h2-size,70px);
  line-height:1;
  font-weight:var(--pk-heading-weight,700);
  letter-spacing:-1.4px;
  text-transform:uppercase;
  margin:0;
  overflow-wrap:normal;
}
.pk-about-section .about-description-wrapper {
  display:flex;
  flex-flow:column;
  gap:12px;
  margin-block:40px 50px;
  min-width:0;
}
.pk-about-section .about-description-wrapper p {
  font-family:var(--pk-font-body,"Geist",sans-serif);
  color:var(--pk-text,#595c66);
  font-size:var(--pk-body-size,16px);
  font-weight:var(--pk-body-weight,400);
  letter-spacing:-.48px;
  line-height:1.3;
  text-align:justify;
  margin:0;
  overflow-wrap:anywhere;
}
.pk-about-section .about-image-wrapper {
  width:40%;
  flex:1 1 0;
  min-width:0;
  position:relative;
  display:flex;
  justify-content:center;
  align-items:flex-start;
  align-self:stretch;
}
.pk-about-section .image-cover {
  object-fit:cover;
  object-position:center;
  border-radius:var(--pk-border-radius,4px);
  width:100%;
  height:100%;
  min-height:0;
  display:block;
}
.pk-about-section .image-decor {
  display:block;
  position:absolute;
  top:0;
  left:50%;
  width:70%;
  max-width:300px;
  height:auto;
  transform:translateX(-50%);
  pointer-events:none;
  z-index:2;
}
.pk-about-section .button-wrapper-desk {display:flex;justify-content:flex-start;}
.pk-about-section .button-wrapper-mob {display:none;}
.pk-about-section .primary-button {
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto;
  min-height:44px;
  padding:12px 30px;
  border:1px solid var(--pk-accent,#da6f4d);
  border-radius:var(--pk-button-radius,4px);
  background-color:var(--pk-accent,#da6f4d);
  font-family:var(--pk-font-heading,"Agdasima",sans-serif);
  color:var(--pk-light,#eef2f2);
  font-size:var(--pk-body-size,16px);
  font-weight:700;
  letter-spacing:0;
  line-height:1.1;
  text-align:center;
  text-transform:uppercase;
  text-decoration:none;
  overflow:hidden;
  white-space:nowrap;
  transform:none;
  transition:background-color .25s ease,color .25s ease,border-color .25s ease;
  cursor:pointer;
}
.pk-about-section .primary-button:hover,
.pk-about-section .primary-button:focus-visible {
  background-color:var(--pk-accent,#da6f4d);
  border-color:var(--pk-accent,#da6f4d);
  color:var(--pk-light,#eef2f2);
  transform:none;
}
.pk-about-section .clip {display:block;overflow:hidden;line-height:1.2;}
.pk-about-section .button-text {display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;}
.pk-about-section .gsap_split_word {display:inline-flex;white-space:nowrap;}
.pk-about-section .gsap_split_letter {display:inline-block;will-change:transform,opacity;}
.pk-about-section .pk-about-space {display:inline;white-space:pre;}
.pk-about-section .primary-button:hover .gsap_split_letter,
.pk-about-section .primary-button:focus-visible .gsap_split_letter {
  animation:pk-about-letter-entrance .3s both cubic-bezier(.2,.7,.2,1);
  animation-delay:calc(var(--pk-about-letter-index,0) * var(--pk-about-letter-stagger,38ms));
}
@keyframes pk-about-letter-entrance {
  from {transform:translate3d(30px,0,0);opacity:0;}
  to {transform:translate3d(0,0,0);opacity:1;}
}
/* Original Wayo IX2 action a-7: each element reacts to its own viewport entry.
 * Initial: opacity 0, translateY(15px); reveal: delay 600ms, duration 800ms, ease.
 * No section-wide stagger and no horizontal slide for the image. */
.pk-about-section.pk-about-ready[data-pk-about-animate="yes"] [data-pk-reveal] {
  opacity:0;
  transform:translate3d(0,15px,0);
  transition:opacity var(--pk-about-reveal-duration,800ms) ease var(--pk-about-reveal-delay,600ms),
             transform var(--pk-about-reveal-duration,800ms) ease var(--pk-about-reveal-delay,600ms);
  will-change:opacity,transform;
}
.pk-about-section.pk-about-ready[data-pk-about-animate="yes"] [data-pk-reveal].pk-about-revealed {
  opacity:1;
  transform:translate3d(0,0,0);
}
/* Original IX2 a-24 (opacity) and a-27 (scale): both target the decorative SVG.
 * Keep translateX(-50%) from the widget's positioning while animating its scale.
 * Opacity: delay 600ms, ease 800ms. Scale: 1.2 -> 1 over 10 seconds. */
.pk-about-section.pk-about-ready[data-pk-about-animate="yes"] .image-decor {
  opacity:0;
  transform:translateX(-50%) scale(1.2);
  transition:opacity var(--pk-about-reveal-duration,800ms) ease var(--pk-about-reveal-delay,600ms),
             transform 10000ms linear;
  will-change:opacity,transform;
}
.pk-about-section.pk-about-ready[data-pk-about-animate="yes"] .image-decor.pk-about-revealed {
  opacity:1;
  transform:translateX(-50%) scale(1);
}

@media (min-width:1280px) {
  .pk-about-section .base-container {padding-inline:40px;}
  .pk-about-section .about-text-content-box {padding-bottom:100px;}
  .pk-about-section .about-description-wrapper {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:30px;
  }
}
@media (min-width:1440px) {
  .pk-about-section .about-section {min-height:550px;}
  .pk-about-section .about-text-content-box {
    flex:0 1 calc(50% - 20px);
    width:50%;
    padding-bottom:150px;
  }
  .pk-about-section .about-image-wrapper {width:50%;flex:1 1 0;min-height:550px;}
  .pk-about-section .image-decor {max-width:400px;}
}
@media (max-width:991px) {
  .pk-about-section .about-description-wrapper {margin-top:24px;margin-bottom:30px;}
  .pk-about-section .image-decor {max-width:200px;}
  .pk-about-section .about-title-wrapper h2 {font-size:clamp(42px,6vw,var(--pk-h2-size,70px));}
}
@media (max-width:767px) {
  .pk-about-section .about-section {flex-direction:column;gap:0;}
  .pk-about-section .about-text-content-box {
    width:100%;flex:auto;padding:0;
  }
  .pk-about-section .about-image-wrapper {
    width:100%;flex:none;height:300px;min-height:300px;
  }
  .pk-about-section .image-cover {object-position:center 70%;}
  .pk-about-section .image-decor {max-width:250px;}
  .pk-about-section .button-wrapper-desk {display:none;}
  .pk-about-section .button-wrapper-mob {display:flex;margin-top:30px;}
}
@media (max-width:479px) {
  .pk-about-section .about-title-wrapper {max-width:350px;}
  .pk-about-section .about-title-wrapper h2 {font-size:42px;letter-spacing:-1px;}
  .pk-about-section .about-description-wrapper p {text-align:left;}
}
@media (prefers-reduced-motion:reduce) {
  .pk-about-section [data-pk-reveal],
  .pk-about-section .image-decor {opacity:1!important;transform:none!important;transition:none!important;animation:none!important;}
  .pk-about-section .image-decor {transform:translateX(-50%)!important;}
  .pk-about-section .primary-button .gsap_split_letter {animation:none!important;}
}