/* ========================================================================== 
   BY BARIŞ ORGANİZASYON — V15 CORPORATE MOTION SYSTEM
   Calm, premium motion inspired by modern corporate interfaces.
   Progressive enhancement: without JS every element remains visible.
   ========================================================================== */
body.vip-home-page{
  --bb-motion-ease:cubic-bezier(.22,1,.36,1);
  --bb-motion-fast:420ms;
  --bb-motion-normal:720ms;
  --bb-motion-slow:980ms;
  --bb-motion-gold:#bf8a3c;
  --bb-motion-ink:#092a35;
  --bb-motion-line:rgba(191,138,60,.25);
  --bb-motion-shadow:0 18px 48px rgba(7,32,41,.09);
}

/* --------------------------------------------------------------------------
   1. TYPOGRAPHY — clear, confident and consistent
   -------------------------------------------------------------------------- */
body.vip-home-page .bs-home{font-size:15px;line-height:1.65;color:#28434d}
body.vip-home-page .bs-heading h2,
body.vip-home-page .bb-platform-head h2,
body.vip-home-page .bb-ig-heading h2,
body.vip-home-page .bb-reference-head h2,
body.vip-home-page .bb-packages__head h2,
body.vip-home-page .bb-youtube__identity h2,
body.vip-home-page .bs-about__content h2{
  text-wrap:balance;
  color:#0a2b36!important;
  text-rendering:optimizeLegibility;
}
body.vip-home-page .bs-eyebrow{
  color:#a86f22!important;
  letter-spacing:.18em!important;
  font-weight:800!important;
}
body.vip-home-page .bs-process .bs-eyebrow,
body.vip-home-page .bb-youtube .bs-eyebrow{color:#d8a85d!important}
body.vip-home-page .bs-heading p,
body.vip-home-page .bb-packages__head>p,
body.vip-home-page .bb-platform-head p,
body.vip-home-page .bb-ig-heading p{max-width:720px;color:#5b6e75!important}

/* --------------------------------------------------------------------------
   2. SCROLL REVEAL — JS adds .bb-motion-ready + .bb-reveal
   -------------------------------------------------------------------------- */
body.vip-home-page.bb-motion-ready .bb-reveal{
  opacity:0;
  transform:translate3d(0,28px,0) scale(.992);
  transition:
    opacity var(--bb-motion-normal) var(--bb-motion-ease),
    transform var(--bb-motion-normal) var(--bb-motion-ease);
  transition-delay:var(--bb-delay,0ms);
}
body.vip-home-page.bb-motion-ready .bb-reveal.bb-reveal--left{transform:translate3d(-34px,0,0)}
body.vip-home-page.bb-motion-ready .bb-reveal.bb-reveal--right{transform:translate3d(34px,0,0)}
body.vip-home-page.bb-motion-ready .bb-reveal.is-visible{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
}

/* Headings appear with a refined editorial mask. */
body.vip-home-page.bb-motion-ready .bb-heading-reveal{
  opacity:0;
  transform:translate3d(0,22px,0);
  clip-path:inset(0 0 92% 0);
  transition:
    opacity 620ms var(--bb-motion-ease),
    transform 820ms var(--bb-motion-ease),
    clip-path 920ms var(--bb-motion-ease);
}
body.vip-home-page.bb-motion-ready .bb-heading-reveal.is-visible{
  opacity:1;
  transform:none;
  clip-path:inset(0 0 0 0);
}

/* Every major chapter gets a subtle animated gold hairline. */
body.vip-home-page .bs-section{position:relative!important;overflow:clip}
body.vip-home-page .bs-section::after{
  content:"";
  position:absolute;
  left:50%;top:0;
  width:min(1220px,calc(100% - 48px));height:1px;
  background:linear-gradient(90deg,transparent,rgba(191,138,60,.28),transparent);
  transform:translateX(-50%) scaleX(.18);
  transform-origin:center;
  opacity:.2;
  transition:transform 1.2s var(--bb-motion-ease),opacity .8s ease;
  pointer-events:none;
}
body.vip-home-page .bs-section.bb-section-visible::after{transform:translateX(-50%) scaleX(1);opacity:.9}
body.vip-home-page .bs-process::after,
body.vip-home-page .bb-youtube::after{background:linear-gradient(90deg,transparent,rgba(221,175,102,.5),transparent)}

/* --------------------------------------------------------------------------
   3. CORPORATE SURFACES — more substantial cards, never flashy
   -------------------------------------------------------------------------- */
body.vip-home-page .bb-service-card,
body.vip-home-page .bb-project-card,
body.vip-home-page .bb-package-card,
body.vip-home-page .bb-review-card,
body.vip-home-page .bs-journal__card,
body.vip-home-page .bs-reference{
  transition:
    transform var(--bb-motion-fast) var(--bb-motion-ease),
    box-shadow var(--bb-motion-fast) ease,
    border-color var(--bb-motion-fast) ease!important;
}
@media (hover:hover) and (pointer:fine){
  body.vip-home-page .bb-service-card:hover,
  body.vip-home-page .bb-project-card:hover,
  body.vip-home-page .bb-package-card:hover,
  body.vip-home-page .bb-review-card:hover,
  body.vip-home-page .bs-journal__card:hover{
    transform:translateY(-7px)!important;
    box-shadow:var(--bb-motion-shadow)!important;
    border-color:rgba(191,138,60,.26)!important;
  }
}

/* Images: subtle cinematic scale and contrast. */
body.vip-home-page .bb-service-card__media,
body.vip-home-page .bb-project-card__media,
body.vip-home-page .bb-package-card__media,
body.vip-home-page .bs-journal__media,
body.vip-home-page .bb-gallery-item{overflow:hidden;position:relative}
body.vip-home-page .bb-service-card__media img,
body.vip-home-page .bb-project-card__media img,
body.vip-home-page .bb-package-card__media img,
body.vip-home-page .bs-journal__media img,
body.vip-home-page .bb-gallery-item img,
body.vip-home-page .bb-youtube-card img{
  transform:translate3d(0,var(--bb-parallax-y,0),0) scale(1.002);
  transition:transform 760ms var(--bb-motion-ease),filter 620ms ease!important;
}
body.vip-home-page .bb-service-card__media::after,
body.vip-home-page .bb-project-card__media::after,
body.vip-home-page .bb-package-card__media::after,
body.vip-home-page .bs-journal__media::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(145deg,transparent 48%,rgba(255,255,255,.17) 62%,transparent 74%);
  transform:translateX(-120%);
  transition:transform 900ms var(--bb-motion-ease);
}
@media (hover:hover) and (pointer:fine){
  body.vip-home-page .bb-service-card:hover img,
  body.vip-home-page .bb-project-card:hover img,
  body.vip-home-page .bb-package-card:hover img,
  body.vip-home-page .bs-journal__card:hover img,
  body.vip-home-page .bb-gallery-item:hover img,
  body.vip-home-page .bb-youtube-card:hover img{
    transform:translate3d(0,var(--bb-parallax-y,0),0) scale(1.045);
    filter:saturate(1.035) contrast(1.025);
  }
  body.vip-home-page .bb-service-card:hover .bb-service-card__media::after,
  body.vip-home-page .bb-project-card:hover .bb-project-card__media::after,
  body.vip-home-page .bb-package-card:hover .bb-package-card__media::after,
  body.vip-home-page .bs-journal__card:hover .bs-journal__media::after{transform:translateX(120%)}
}

/* --------------------------------------------------------------------------
   4. PACKAGES — grounded, premium and conversion-focused
   -------------------------------------------------------------------------- */
body.vip-home-page .bb-packages__grid{gap:22px!important;align-items:stretch!important}
body.vip-home-page .bb-package-card{
  position:relative!important;
  isolation:isolate;
  overflow:hidden!important;
  border:1px solid rgba(8,40,51,.10)!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#fff 0%,#fbfaf7 100%)!important;
}
body.vip-home-page .bb-package-card::before{
  content:"";position:absolute;z-index:3;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,transparent 0%,#c89445 34%,#dfbd83 55%,transparent 100%);
  transform:scaleX(.32);transform-origin:center;
  transition:transform 620ms var(--bb-motion-ease);
}
body.vip-home-page .bb-package-card::after{
  content:"";position:absolute;z-index:-1;width:180px;height:180px;right:-80px;bottom:-100px;border-radius:50%;
  background:radial-gradient(circle,rgba(191,138,60,.12),transparent 68%);
  transition:transform 700ms var(--bb-motion-ease),opacity 500ms ease;
  opacity:.65;
}
body.vip-home-page .bb-package-card.is-featured{
  background:linear-gradient(160deg,#0b303c 0%,#0a2732 100%)!important;
  color:#fff!important;
  transform:translateY(-8px)!important;
}
body.vip-home-page .bb-package-card.is-featured h3,
body.vip-home-page .bb-package-card.is-featured p,
body.vip-home-page .bb-package-card.is-featured li{color:#fff!important}
body.vip-home-page .bb-package-card.is-featured li{border-color:rgba(255,255,255,.10)!important}
body.vip-home-page .bb-package-card__no{
  width:40px!important;height:40px!important;border-radius:12px!important;
  display:inline-grid!important;place-items:center!important;
  background:rgba(191,138,60,.1)!important;border:1px solid rgba(191,138,60,.2)!important;
  color:#a86f22!important;font-size:12px!important;font-weight:800!important;letter-spacing:.08em!important;
}
body.vip-home-page .bb-package-card.is-featured .bb-package-card__no{
  color:#f0c883!important;background:rgba(255,255,255,.06)!important;border-color:rgba(240,200,131,.26)!important;
}
body.vip-home-page .bb-package-card h3{margin-top:14px!important;font-size:27px!important;letter-spacing:-.025em!important}
body.vip-home-page .bb-package-card li{position:relative;padding:10px 0 10px 28px!important;border-bottom:1px solid rgba(8,40,51,.07)}
body.vip-home-page .bb-package-card li i{position:absolute;left:0;top:10px}
body.vip-home-page .bb-package-card__wa{position:relative;overflow:hidden;min-height:48px!important;border-radius:10px!important}
@media (hover:hover) and (pointer:fine){
  body.vip-home-page .bb-package-card:hover::before{transform:scaleX(1)}
  body.vip-home-page .bb-package-card:hover::after{transform:scale(1.24);opacity:1}
}

/* --------------------------------------------------------------------------
   5. PROCESS — refined timeline rhythm
   -------------------------------------------------------------------------- */
body.vip-home-page .bs-process__grid{position:relative;overflow:hidden}
body.vip-home-page .bs-process__item{position:relative!important;overflow:hidden!important}
body.vip-home-page .bs-process__item::after{
  content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;background:linear-gradient(90deg,#c99749,#e3c18a);
  transition:right 520ms var(--bb-motion-ease);
}
body.vip-home-page .bs-process__item>span{
  transition:color 360ms ease,transform 520ms var(--bb-motion-ease)!important;
}
@media (hover:hover) and (pointer:fine){
  body.vip-home-page .bs-process__item:hover::after{right:0}
  body.vip-home-page .bs-process__item:hover>span{color:#e0b56f!important;transform:translateY(-2px)}
}

/* --------------------------------------------------------------------------
   6. GALLERY / INSTAGRAM / YOUTUBE — image-first interactive polish
   -------------------------------------------------------------------------- */
body.vip-home-page .bb-gallery-item::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,transparent 58%,rgba(4,26,34,.35));
  opacity:0;transition:opacity 420ms ease;
}
body.vip-home-page .bb-gallery-item>span{z-index:2!important;transition:transform 420ms var(--bb-motion-ease),opacity 420ms ease!important}
@media (hover:hover) and (pointer:fine){
  body.vip-home-page .bb-gallery-item:hover::before{opacity:1}
  body.vip-home-page .bb-gallery-item:hover>span{transform:scale(1.08) rotate(90deg)!important}
}
body.vip-home-page .bb-ig-grid a{position:relative;overflow:hidden}
body.vip-home-page .bb-ig-grid a::after{
  content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 45%,rgba(255,255,255,.16) 62%,transparent 78%);
  transform:translateX(-130%);transition:transform 850ms var(--bb-motion-ease);pointer-events:none;
}
@media (hover:hover) and (pointer:fine){body.vip-home-page .bb-ig-grid a:hover::after{transform:translateX(130%)}}
body.vip-home-page .bb-youtube-card{transition:transform 420ms var(--bb-motion-ease),background-color 420ms ease,border-color 420ms ease!important}
@media (hover:hover) and (pointer:fine){
  body.vip-home-page .bb-youtube-card:hover{transform:translateY(-5px);background:rgba(255,255,255,.075)!important;border-color:rgba(224,181,111,.32)!important}
}

/* --------------------------------------------------------------------------
   7. BUTTONS / LINKS — polished interaction
   -------------------------------------------------------------------------- */
body.vip-home-page .bs-btn,
body.vip-home-page .bb-package-card__wa,
body.vip-home-page .bb-reservation__wa,
body.vip-site .bb-footer__whatsapp{
  position:relative;overflow:hidden;transition:transform 320ms var(--bb-motion-ease),box-shadow 320ms ease,background-color 320ms ease!important
}
body.vip-home-page .bs-btn::after,
body.vip-home-page .bb-package-card__wa::after,
body.vip-home-page .bb-reservation__wa::after{
  content:"";position:absolute;top:-70%;left:-30%;width:28%;height:240%;transform:rotate(18deg) translateX(-360%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);transition:transform 720ms var(--bb-motion-ease);pointer-events:none
}
@media (hover:hover) and (pointer:fine){
  body.vip-home-page .bs-btn:hover,
  body.vip-home-page .bb-package-card__wa:hover,
  body.vip-home-page .bb-reservation__wa:hover{transform:translateY(-2px)}
  body.vip-home-page .bs-btn:hover::after,
  body.vip-home-page .bb-package-card__wa:hover::after,
  body.vip-home-page .bb-reservation__wa:hover::after{transform:rotate(18deg) translateX(560%)}
}

/* --------------------------------------------------------------------------
   8. ABOUT / FILM — slow premium motion, not decorative bouncing
   -------------------------------------------------------------------------- */
body.vip-home-page .bs-about__visual img,
body.vip-home-page .bb-film__main>img{
  transform:translate3d(0,var(--bb-parallax-y,0),0) scale(1.018);
  will-change:transform;
}
body.vip-home-page .bs-about__seal{animation:bbSealBreath 5.8s ease-in-out infinite!important}
@keyframes bbSealBreath{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-5px) scale(1.015)}}
body.vip-home-page .bb-film__main::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 72% 28%,rgba(220,174,99,.11),transparent 28%);
  opacity:.65;animation:bbFilmGlow 6.5s ease-in-out infinite alternate;
}
@keyframes bbFilmGlow{from{opacity:.35;transform:scale(1)}to{opacity:.78;transform:scale(1.03)}}

/* --------------------------------------------------------------------------
   9. REFERENCES / CTA / FOOTER — premium close
   -------------------------------------------------------------------------- */
body.vip-home-page .bs-reference{position:relative;overflow:hidden!important}
body.vip-home-page .bs-reference::after{
  content:"";position:absolute;left:18%;right:18%;bottom:0;height:2px;background:#c7964b;transform:scaleX(0);transition:transform 420ms var(--bb-motion-ease)
}
@media (hover:hover) and (pointer:fine){body.vip-home-page .bs-reference:hover::after{transform:scaleX(1)}}
body.vip-home-page .bs-cta{position:relative;overflow:hidden}
body.vip-home-page .bs-cta::before{
  content:"";position:absolute;inset:-35%;pointer-events:none;
  background:radial-gradient(circle at 25% 40%,rgba(214,166,91,.14),transparent 28%),radial-gradient(circle at 77% 62%,rgba(255,255,255,.06),transparent 24%);
  animation:bbCtaDrift 14s ease-in-out infinite alternate;
}
@keyframes bbCtaDrift{from{transform:translate3d(-1.5%,0,0) scale(1)}to{transform:translate3d(1.5%,-1%,0) scale(1.025)}}
body.vip-home-page .bs-cta__inner{position:relative;z-index:1}

/* --------------------------------------------------------------------------
   10. Responsive discipline — motion becomes calmer on touch devices
   -------------------------------------------------------------------------- */
@media(max-width:991px){
  body.vip-home-page .bb-package-card.is-featured{transform:none!important}
  body.vip-home-page.bb-motion-ready .bb-reveal{transform:translate3d(0,18px,0) scale(.996)}
  body.vip-home-page.bb-motion-ready .bb-reveal.is-visible{transform:none}
}
@media(max-width:767px){
  body.vip-home-page .bs-section::after{width:calc(100% - 30px)}
  body.vip-home-page .bb-package-card h3{font-size:24px!important}
  body.vip-home-page .bb-package-card{border-radius:14px!important}
  body.vip-home-page .bs-about__seal,
  body.vip-home-page .bb-film__main::after,
  body.vip-home-page .bs-cta::before{animation:none!important}
}

/* Accessibility and performance: remove motion when the user asks for it. */
@media(prefers-reduced-motion:reduce){
  body.vip-home-page.bb-motion-ready .bb-reveal,
  body.vip-home-page.bb-motion-ready .bb-heading-reveal,
  body.vip-home-page .bs-section::after,
  body.vip-home-page .bb-service-card,
  body.vip-home-page .bb-project-card,
  body.vip-home-page .bb-package-card,
  body.vip-home-page .bb-review-card,
  body.vip-home-page .bs-journal__card,
  body.vip-home-page .bs-reference,
  body.vip-home-page .bb-service-card img,
  body.vip-home-page .bb-project-card img,
  body.vip-home-page .bb-package-card img,
  body.vip-home-page .bb-gallery-item img,
  body.vip-home-page .bb-youtube-card img,
  body.vip-home-page .bs-about__seal,
  body.vip-home-page .bb-film__main::after,
  body.vip-home-page .bs-cta::before{
    transition:none!important;animation:none!important;transform:none!important;opacity:1!important;clip-path:none!important
  }
}