/* PAKHI INFOTECH | Compact 3D refresh (October 2026)
   Works with the existing Bootstrap components and original page-specific CSS. */
:root { --depth-shadow: 0 16px 34px rgba(20, 76, 117, .10), 0 3px 10px rgba(20, 76, 117, .05); }
html { scroll-behavior: smooth; }
.pakhi-site, .erp-site { max-width: 100%; overflow-x: clip; }
.pakhi-site .container, .erp-site .container { max-width: 1200px; }
.pakhi-site .section, .pakhi-site .section-padding {
  padding-top: clamp(42px, 5vw, 68px) !important;
  padding-bottom: clamp(42px, 5vw, 68px) !important;
}
.pakhi-site .py-5 { padding-top: clamp(40px, 4.6vw, 62px) !important; padding-bottom: clamp(40px, 4.6vw, 62px) !important; }
.pakhi-site .row.g-5 { --bs-gutter-y: 1.65rem; --bs-gutter-x: 2rem; }
.pakhi-site .row.g-4 { --bs-gutter-y: 1.25rem; --bs-gutter-x: 1.25rem; }
.pakhi-site section { isolation: isolate; }
.pakhi-site .hero-section, .pakhi-site .about-hero, .pakhi-site .hero-small,
.pakhi-site .contact-hero, .pakhi-site .contact-hero-section {
  position: relative; overflow: hidden;
}
.page-home .hero-section { min-height: clamp(490px, 65vh, 670px) !important; padding-block: clamp(45px, 6vw, 76px) !important; }
.page-about .about-hero { min-height: 0 !important; padding-block: clamp(55px, 7vw, 88px) !important; }
.page-services .hero-small { min-height: 0 !important; padding-block: clamp(60px, 7vw, 88px) !important; }
.page-contact .contact-hero { min-height: 0 !important; padding-block: clamp(50px, 6vw, 78px) !important; }
.page-about .about-company-section, .page-services .why-choose,
.page-portfolio .products-section, .page-home .client-modern-section {
  padding-block: clamp(44px, 5vw, 68px) !important;
}
.pakhi-site .section-header, .pakhi-site .products-header,
.pakhi-site .team-header { margin-bottom: clamp(20px, 3vw, 36px) !important; }
/* 3D visual depth — transforms only on fine-pointer devices, no perspective skew on phones */
.pakhi-site :is(.service-card-modern,.modern-card,.product-card,.info-card,.feature-card,.benefit-card,
.company-stat-card,.about-highlight,.modern-team-card,.trusted-box,.contact-box,.erp-planner-shell) {
  position: relative;
  border-radius: clamp(16px, 2vw, 24px);
  box-shadow: var(--depth-shadow);
  transform: translateZ(0);
  backface-visibility: hidden;
  transition: transform .35s cubic-bezier(.2,.75,.25,1),box-shadow .35s ease,border-color .25s ease;
}
.pakhi-site :is(.service-card-modern,.modern-card,.product-card,.info-card,.feature-card,.benefit-card,
.company-stat-card,.about-highlight,.modern-team-card,.trusted-box,.contact-box) {
  border: 1px solid rgba(33,135,184,.13);
}
.pakhi-site :is(.service-card-modern,.modern-card,.product-card,.info-card,.feature-card,.benefit-card,
.company-stat-card,.about-highlight,.modern-team-card,.trusted-box,.contact-box)::before {
  pointer-events:none;
  content:""; position:absolute; inset:0 0 auto 0; height:35%; border-radius:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,0));
  z-index:0;
}
.pakhi-site :is(.service-card-modern,.modern-card,.product-card,.info-card,.feature-card,.benefit-card,.company-stat-card) img {
  max-width:100%; height:auto;
}
.pakhi-site :is(.modern-btn,.product-btn,.service-read-toggle,.about-outline-btn,.btn) { transition: transform .24s ease, box-shadow .24s ease, background .24s ease; }
@media (hover:hover) and (pointer:fine) {
  .pakhi-site :is(.service-card-modern,.modern-card,.product-card,.info-card,.feature-card,.benefit-card,.company-stat-card,.about-highlight,.trusted-box):hover {
    transform: perspective(950px) rotateX(2deg) rotateY(-2deg) translateY(-7px);
    box-shadow: 0 28px 54px rgba(12,83,133,.17),0 7px 16px rgba(12,83,133,.08);
  }
  .pakhi-site :is(.modern-btn,.product-btn,.about-outline-btn,.btn):hover { transform:translateY(-3px); }
}
.pakhi-site h1,.pakhi-site h2,.pakhi-site h3 { text-wrap: balance; }
.pakhi-site p { overflow-wrap: break-word; }
.pakhi-site .footer-modern { padding-top: clamp(32px, 4.5vw, 55px) !important; }
.pakhi-site .footer-modern .row { --bs-gutter-y: 1.25rem; }
.pakhi-site img { max-width:100%; }
@media(max-width:991.98px) {
 .pakhi-site .container { width:calc(100% - 32px); }
 .pakhi-site .section,.pakhi-site .section-padding { padding-block:46px !important; }
 .page-home .hero-section { min-height:0 !important; padding-block:65px !important; }
 .page-about .about-hero { padding-block:58px !important; }
 .pakhi-site .footer-modern { padding-block:38px 18px !important; }
 .pakhi-site .navbar-nav { flex-wrap:wrap; }
}
@media(max-width:575.98px) {
 .pakhi-site .container { width:calc(100% - 28px); padding-inline:0; }
 .pakhi-site .section,.pakhi-site .section-padding,.pakhi-site .py-5 { padding-block:34px !important; }
 .page-home .hero-section { min-height:0 !important; padding-block:46px !important; }
 .page-about .about-hero,.page-services .hero-small,.page-contact .contact-hero { padding-block:42px !important; }
 .page-about .about-company-section,.page-services .why-choose,.page-portfolio .products-section,.page-home .client-modern-section { padding-block:34px !important; }
 .pakhi-site h1 { font-size:clamp(1.95rem,9vw,2.75rem) !important; line-height:1.15; }
 .pakhi-site h2 { font-size:clamp(1.55rem,7vw,2.15rem); line-height:1.2; }
 .pakhi-site .row.g-4,.pakhi-site .row.g-5 { --bs-gutter-x:1rem; --bs-gutter-y:1rem; }
 .pakhi-site .footer-modern { padding-top:30px !important; }
 .pakhi-site :is(.service-card-modern,.modern-card,.product-card,.info-card,.feature-card,.benefit-card,.company-stat-card) { transform:none !important; }
 .pakhi-site .hero-glass-card { padding:clamp(19px,5vw,30px) !important; }
 .pakhi-site .d-flex.gap-4 { gap:1rem !important; flex-wrap:wrap; }
 .pakhi-site .btn,.pakhi-site a { max-width:100%; }
}
@media(prefers-reduced-motion:reduce) {
 html { scroll-behavior:auto; }
 .pakhi-site :is(.service-card-modern,.modern-card,.product-card,.info-card,.feature-card,.benefit-card,.company-stat-card,.btn) { transition:none !important; transform:none !important; }
}

/* Pakhi home-page coding-video hero. The content stays above the video/overlay. */
.page-home .hero-section .hero-bg-video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 1;
  pointer-events: none;
  background: #061b2a url('../video/pakhi-coding-poster.jpg') center/cover no-repeat;
}
.page-home .hero-section .hero-overlay { z-index: 2; }
.page-home .hero-section > .container { position: relative; z-index: 3; }
@media (max-width: 767.98px) {
  .page-home .hero-section .hero-bg-video { object-position: 58% center; }
}
@media (prefers-reduced-motion: reduce) {
  .page-home .hero-section .hero-bg-video { display: none; }
  .page-home .hero-section { background: #061b2a url('../video/pakhi-coding-poster.jpg') center/cover no-repeat; }
}