/* ============================================================
   Pine scroll story — nyatwa-style pinned slides
   ============================================================ */
.pine-story{position:relative;width:100%;background:#111111;}
.pine-story__track{position:relative;height:300vh;}
.pine-story__stage{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center;}

/* glow blobs */
.pine-story__glow{position:absolute;border-radius:50%;filter:blur(90px);opacity:.32;pointer-events:none;z-index:0;}
.pine-story__glow--pink{width:46vw;height:46vw;background:#eafc53;top:-12%;right:-8%;animation:glowDrift 14s ease-in-out infinite;}
.pine-story__glow--blue{width:44vw;height:44vw;background:#ECEFFE;bottom:-16%;left:-10%;animation:glowDrift 18s ease-in-out infinite reverse;}
@keyframes glowDrift{0%,100%{transform:translate(0,0)}50%{transform:translate(-34px,26px)}}

/* floating data widgets */
.pine-story__deco{position:absolute;z-index:2;display:flex;flex-direction:column;gap:6px;padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(8px);box-shadow:0 18px 40px rgba(0,0,0,.35);color:#fff;font-family:"Instrument Sans",Sans-serif;animation:decoFloat 9s ease-in-out infinite;pointer-events:none;}
.pine-story__deco b{font-size:13px;font-weight:700;letter-spacing:.04em;opacity:.85;}
.pine-story__deco-price{font-size:17px;font-weight:700;}
.pine-story__deco-up{font-size:12px;font-weight:700;color:#4ADE80;}
.pine-story__deco-tag{font-size:20px;font-weight:700;color:#eafc53;}
.pine-story__deco-row{display:flex;align-items:center;gap:8px;}
.pine-story__deco--1{top:16%;left:5%;animation-delay:0s;}
.pine-story__deco--2{top:13%;right:6%;animation-delay:-3s;}
.pine-story__deco--3{bottom:15%;left:9%;animation-delay:-5s;}
.pine-story__deco--4{bottom:11%;right:6%;animation-delay:-2s;}
@keyframes decoFloat{0%,100%{translate:0 0;}50%{translate:0 -16px;}}

/* slides */
.pine-story__slide{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;gap:6vw;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility 0s .8s;}
.pine-story__slide.is-active{opacity:1;visibility:visible;transition:opacity .8s ease .1s;}

/* text column */
.pine-story__text{width:min(44vw,560px);opacity:0;transform:translateX(-28px);transition:opacity .7s ease,transform .7s cubic-bezier(.22,1,.36,1);}
.pine-story__slide.is-active .pine-story__text{opacity:1;transform:none;transition-delay:.18s;}
.pine-story__eyebrow{display:inline-block;font-family:"Host Grotesk",Sans-serif;font-size:13px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#eafc53;padding:8px 16px;border:1px solid rgba(234,252,83,.35);border-radius:999px;background:rgba(234,252,83,.08);margin-bottom:22px;}
.pine-story__title{font-family:"Host Grotesk",Sans-serif;font-size:clamp(32px,4.4vw,54px);font-weight:700;line-height:1.15;letter-spacing:-.02em;color:#fff;margin:0 0 18px;}
.pine-story__desc{font-family:"Instrument Sans",Sans-serif;font-size:clamp(15px,1.2vw,18px);line-height:1.7;color:rgba(255,255,255,.8);margin:0;max-width:46ch;}

/* phone */
.pine-story__phone{position:relative;width:min(28vw,380px);z-index:4;}
.pine-story__img{width:100%;height:auto;opacity:0;transform:scale(1.16) rotate(3deg);filter:drop-shadow(0 34px 70px rgba(0,0,0,.5));transition:opacity .8s ease,transform 1.05s cubic-bezier(.22,1,.36,1);will-change:transform;}
.pine-story__slide.is-active .pine-story__img{opacity:1;transform:scale(1) rotate(0);}

/* floating bubbles */
.pine-story__bubble{position:absolute;font-family:"Instrument Sans",Sans-serif;font-size:clamp(12px,1vw,15px);font-weight:600;color:#fff;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);padding:12px 18px;border-radius:999px;backdrop-filter:blur(8px);box-shadow:0 12px 30px rgba(0,0,0,.35);white-space:nowrap;opacity:0;transform:scale(.5);transition:opacity .55s ease,transform .55s cubic-bezier(.34,1.56,.64,1);animation:bubbleFloat 6s ease-in-out infinite;animation-delay:var(--bd,0s);will-change:transform;}
.pine-story__slide.is-active .pine-story__bubble{opacity:1;transform:scale(1);transition-delay:calc(.25s + var(--bd,0s)*.4),calc(.25s + var(--bd,0s)*.4);}
.pine-story__bubble::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(120deg,rgba(234,252,83,.18),rgba(255,255,255,0) 55%);pointer-events:none;}
@keyframes bubbleFloat{0%,100%{translate:0 0;}50%{translate:0 -12px;}}

.pine-story__bubble--tl{top:-4%;left:-38%;}
.pine-story__bubble--tm{top:-10%;left:27%;}
.pine-story__bubble--tr{top:0%;right:-42%;}
.pine-story__bubble--ml{top:14%;left:-38%;}
.pine-story__bubble--mr{top:46%;right:-46%;}
.pine-story__bubble--bl{bottom:-8%;left:-34%;}
.pine-story__bubble--bm{bottom:9%;left:20%;}
.pine-story__bubble--br{bottom:-2%;right:-40%;}

/* pager + progress */
.pine-story__pager{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);display:flex;gap:10px;z-index:6;}
.pine-story__pager-item{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.22);cursor:pointer;transition:background .3s ease,transform .3s ease;}
.pine-story__pager-item.is-on{background:#FFADFD;transform:scale(1.25);}
.pine-story__progress{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);width:180px;height:3px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden;z-index:6;}
.pine-story__progress-bar{display:block;height:100%;width:100%;background:linear-gradient(90deg,#FFADFD,#ECEFFE);transform:scaleX(0);transform-origin:left;transition:transform .25s ease;}

/* reduced motion */
@media (prefers-reduced-motion: reduce){
  .pine-story__glow,.pine-story__deco,.pine-story__bubble{animation:none;}
  .pine-story__img,.pine-story__text{transition:none;}
}

/* responsiveness */
@media (max-width:1100px){
  .pine-story__slide{gap:4vw;}
  .pine-story__text{width:min(42vw,480px);}
  .pine-story__bubble--ml,.pine-story__bubble--mr{display:none;}
  .pine-story__bubble--tl{left:-26%;}
  .pine-story__bubble--tr{right:-28%;}
  .pine-story__deco--2{display:none;}
}
@media (max-width:768px){
  .pine-story__stage{flex-direction:column;}
  .pine-story__slide{flex-direction:column;justify-content:center;gap:6vh;}
  .pine-story__text{width:min(86vw,460px);text-align:center;transform:translateY(20px);}
  .pine-story__slide.is-active .pine-story__text{transform:none;}
  .pine-story__phone{width:min(46vw,240px);}
  .pine-story__bubble{font-size:12px;padding:9px 14px;}
  .pine-story__bubble--tl{top:-6%;left:-30%;}
  .pine-story__bubble--tr{top:2%;right:-30%;}
  .pine-story__bubble--bl{bottom:-8%;left:-24%;}
  .pine-story__bubble--br{bottom:-6%;right:-26%;}
  .pine-story__bubble--tm{display:none;}
  .pine-story__bubble--bm{display:none;}
  .pine-story__deco{display:none;}
}
