/* ══════════════════════════════════════════════════════════
   3D EFFECTS — CY Consultancy Centre
   Cards, sections, images with premium 3D interactions
══════════════════════════════════════════════════════════ */

/* ── 3D CARD TILT (on hover, mouse move) ── */
.card-3d {
  transform-style: preserve-3d;
  perspective: 1000px;
  transition: transform .15s ease;
  will-change: transform;
}
.card-3d-inner {
  transform-style: preserve-3d;
  transition: transform .15s ease;
}
.card-3d:hover {
  z-index: 10;
}
/* 3D floating shine overlay */
.card-3d::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(
    135deg,
    rgba(255,255,255,.15) 0%,
    transparent 50%,
    rgba(255,255,255,.05) 100%
  );
  opacity: 0;
  transition: opacity .3s;
  pointer-events: none;
  z-index: 2;
}
.card-3d:hover::after { opacity: 1; }

/* ── WHY CARDS — 3D flip on hover ── */
.why-card {
  transform-style: preserve-3d;
  perspective: 800px;
  cursor: default;
}
.why-card:hover {
  transform: translateY(-10px) rotateX(5deg) !important;
  box-shadow: 0 28px 60px rgba(0,0,0,.22), 0 2px 0 rgba(255,255,255,.08) inset !important;
}

/* ── SERVICE CARDS — 3D rise ── */
.svc {
  transform-style: preserve-3d;
  perspective: 600px;
}
.svc:hover {
  transform: translateY(-10px) rotateX(3deg) rotateY(-2deg) !important;
  box-shadow: 0 32px 70px rgba(230,57,70,.12) !important;
}

/* ── DESTINATION CARDS — 3D scale ── */
.dest-item {
  transform-style: preserve-3d;
}
.dest-item:hover {
  transform: translateY(-8px) scale(1.03) !important;
  box-shadow: 0 24px 56px rgba(0,0,0,.14) !important;
}

/* ── UNIVERSITY CARDS — 3D tilt ── */
.uni-logo-card {
  transform-style: preserve-3d;
}
.uni-logo-card:hover {
  transform: translateY(-10px) rotateX(4deg) !important;
  box-shadow: 0 28px 64px rgba(0,0,0,.12) !important;
}

/* ── BLOG CARDS — 3D lift ── */
.blog-card {
  transform-style: preserve-3d;
}
.blog-card:hover {
  transform: translateY(-6px) rotateX(2deg) !important;
  box-shadow: 0 24px 56px rgba(0,0,0,.1) !important;
}

/* ── TESTIMONIAL CARDS — 3D rise ── */
.test-card {
  transform-style: preserve-3d;
}
.test-card:hover {
  transform: translateY(-8px) rotateX(4deg) rotateY(2deg) !important;
  box-shadow: 0 24px 56px rgba(0,0,0,.1) !important;
}

/* ── MVV CARDS — flip on hover ── */
.mvv-card {
  transform-style: preserve-3d;
}
.mvv-card:hover {
  transform: translateY(-8px) rotateX(5deg) !important;
  box-shadow: 0 28px 64px rgba(0,0,0,.08) !important;
}

/* ── HERO CARD — floating 3D ── */
.hero-card {
  transform-style: preserve-3d;
  animation: heroCardFloat 6s ease-in-out infinite;
}
@keyframes heroCardFloat {
  0%,100% { transform: translateY(0) rotateX(1deg); }
  50%      { transform: translateY(-12px) rotateX(-1deg); }
}

/* ── STATS — 3D numbers bounce in ── */
.stat-item.aos-animate .stat-num,
.stat-item.show .stat-num {
  animation: statBounce .6s cubic-bezier(.34,1.56,.64,1) both;
}
@keyframes statBounce {
  0%   { transform: scale(0) rotateX(-45deg); opacity:0; }
  60%  { transform: scale(1.15) rotateX(5deg); }
  100% { transform: none; opacity:1; }
}

/* ── FINDER CARDS — 3D flip ── */
.finder-card {
  transform-style: preserve-3d;
  perspective: 600px;
}
.finder-card:hover {
  transform: translateY(-8px) rotateX(8deg) !important;
  box-shadow: 0 28px 60px rgba(230,57,70,.12) !important;
}

/* ── PROCESS STEPS — 3D slide ── */
.tl-step:hover .tl-body {
  transform: translateX(12px) rotateY(-2deg) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,.1) !important;
}
.tl-step:hover .tl-num {
  transform: scale(1.15) rotateZ(10deg) !important;
}

/* ── COUNTRY ITEMS — 3D pop ── */
.country-item:hover {
  transform: translateY(-6px) scale(1.06) rotateX(5deg) !important;
  box-shadow: 0 16px 40px rgba(230,57,70,.12) !important;
}

/* ── NAV LOGO — 3D tilt ── */
.nav-logo:hover {
  transform: perspective(400px) rotateX(5deg) scale(1.02) !important;
}

/* ── PAGE HERO BADGE — 3D float ── */
.hero-badge {
  animation: badgeFloat 4s ease-in-out infinite;
}
@keyframes badgeFloat {
  0%,100% { transform: translateY(0) rotateX(0deg); }
  50%      { transform: translateY(-4px) rotateX(3deg); }
}

/* ── FLOAT TAGS — 3D bounce ── */
.float-tag {
  transform-style: preserve-3d;
}

/* ── DOC BOXES — 3D hover ── */
.doc-box:hover {
  transform: translateY(-6px) rotateX(3deg) !important;
  box-shadow: 0 20px 50px rgba(0,0,0,.08) !important;
}

/* ── BUTTONS — 3D press effect ── */
.btn:active {
  transform: translateY(1px) scale(.98) !important;
}

/* ── SFC CARDS — 3D slide ── */
.sfc:hover {
  transform: translateY(-8px) rotateX(3deg) rotateY(-2deg) !important;
  box-shadow: 0 32px 70px rgba(0,0,0,.1) !important;
}

/* ── PERSPECTIVE SECTION HEADERS ── */
.sh h2 {
  transform-style: preserve-3d;
}
.sh.aos-animate h2 {
  animation: h2DropIn .9s cubic-bezier(.16,1,.3,1) .1s both;
}
@keyframes h2DropIn {
  from { opacity:0; transform: perspective(400px) translateZ(-60px) translateY(30px) rotateX(-20deg); }
  to   { opacity:1; transform: none; }
}

/* ── ABOUT IMAGE SECTION — 3D depth ── */
.about-img-wrap {
  transform-style: preserve-3d;
  transition: transform .5s cubic-bezier(.16,1,.3,1) !important;
}
.about-img-wrap.aos-animate {
  animation: imgDepthIn .9s cubic-bezier(.16,1,.3,1) .2s both;
}
@keyframes imgDepthIn {
  from { opacity:0; transform: perspective(600px) rotateY(20deg) translateX(60px); }
  to   { opacity:1; transform: none; }
}

/* ── MOBILE: disable heavy 3D on small screens ── */
@media(max-width:768px) {
  .hero-card { animation: none !important; }
  .svc:hover, .why-card:hover, .dest-item:hover,
  .uni-logo-card:hover, .test-card:hover, .mvv-card:hover,
  .blog-card:hover, .finder-card:hover {
    transform: translateY(-4px) !important;
  }
  .about-img-wrap.aos-animate { animation: none !important; }
}

/* ── TOUCH: no 3D hover on touch devices ── */
@media(hover:none) {
  .svc:hover, .why-card:hover, .dest-item:hover,
  .uni-logo-card:hover, .test-card:hover, .mvv-card:hover,
  .hero-card, .finder-card:hover, .sfc:hover {
    transform: none !important;
    animation: none !important;
  }
}
