/*
 * Hover + scroll animations for the whole site. Loaded after style.css and
 * mega-menu.css (see includes/header.php), so it only ADDS motion on top of
 * the existing look - delete this file and js/animations.js to undo it.
 *
 * Everything is transform/opacity/box-shadow based (cheap for the browser) and
 * switched off for visitors who ask for reduced motion.
 */

:root {
    --bes-orange: #ff9535;
    --bes-red: #f74949;
    --bes-navy: #12027e;
    --bes-ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- Scroll reveal (classes are added by js/animations.js) ---------- */
.bes-anim {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .7s var(--bes-ease), transform .7s var(--bes-ease);
    transition-delay: var(--bes-delay, 0s);
    will-change: opacity, transform;
}
.bes-anim.bes-from-left { transform: translateX(-34px); }
.bes-anim.bes-from-right { transform: translateX(34px); }
.bes-anim.bes-zoom { transform: scale(.92); }
.bes-anim.bes-in { opacity: 1; transform: none; }

/* ---------- Buttons: lift + light sweep ---------- */
.theme-btn {
    overflow: hidden;
    transition: transform .3s var(--bes-ease), box-shadow .3s ease, background-color .3s ease, color .3s ease, border-color .3s ease;
}
.theme-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 22px rgba(18, 2, 126, .22);
}
.theme-btn:active { transform: translateY(0); box-shadow: none; }
.btn-style-one:hover { background: var(--bes-red); border-color: var(--bes-red); color: #ffffff; }
.theme-btn::after {
    content: "";
    position: absolute;
    top: 0; left: -75%;
    width: 50%; height: 100%;
    background: linear-gradient(120deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .45), rgba(255, 255, 255, 0));
    transform: skewX(-20deg);
    pointer-events: none;
}
.theme-btn:hover::after { left: 130%; transition: left .7s ease; }

/* ---------- Logo ---------- */
.logo img, .logo-box img { transition: transform .35s var(--bes-ease); }
.logo a:hover img { transform: scale(1.05); }

/* ---------- Header: nav, mega menu, top bar ---------- */
.main-menu .navigation > li > a { transition: color .3s ease, transform .3s var(--bes-ease); }
.main-menu .navigation > li:hover > a { transform: translateY(-2px); }
.main-menu .navigation > li.mega-dropdown > ul.mega-menu {
    transform-origin: top center;
    animation: besDrop .28s var(--bes-ease);
}
@keyframes besDrop {
    from { opacity: 0; transform: translateY(10px) scale(.98); }
    to   { opacity: 1; transform: none; }
}
.main-menu .navigation > li.mega-dropdown > ul.mega-menu > li > a {
    transition: background-color .25s ease, color .25s ease, padding-left .25s var(--bes-ease);
}
.main-menu .navigation > li.mega-dropdown > ul.mega-menu > li > a:hover { padding-left: 26px; }
.main-menu .navigation > li.mega-dropdown > ul.mega-menu > li:hover > a > i.fa { transform: scale(1.25) rotate(-8deg); }
.main-menu .navigation > li.mega-dropdown > ul.mega-menu > li > a > i.fa { transition: transform .3s var(--bes-ease), color .3s ease; }
.enquiry-btn { transition: transform .3s var(--bes-ease), box-shadow .3s ease; }
.enquiry-btn:hover { transform: translateY(-3px) scale(1.04); box-shadow: 0 8px 18px rgba(247, 73, 73, .35); }

.header-top .social-icon a, .header-top .top-links li a { transition: transform .3s var(--bes-ease), color .3s ease; display: inline-block; }
.header-top .social-icon a:hover { transform: translateY(-3px) rotate(-8deg); color: var(--bes-orange); }
.header-top .top-links li a:hover { transform: translateX(3px); }

/* ---------- Cards: services, blocks, client logos ---------- */
.travel-block .inner-box {
    transition: transform .4s var(--bes-ease), box-shadow .4s ease;
}
.travel-block .inner-box:hover {
    transform: translateY(-8px);
    box-shadow: 0 18px 38px rgba(0, 0, 0, .14);
}
.travel-block .inner-box .image { overflow: hidden; border-radius: 4px 4px 0 0; }
.travel-block .inner-box .image img { transition: transform .8s var(--bes-ease), filter .4s ease; }
.travel-block .inner-box:hover .image img { transform: scale(1.1) rotate(.6deg); filter: saturate(1.15); }
.travel-block .inner-box .lower-box h3 a { transition: color .3s ease, letter-spacing .3s ease; }
.travel-block .inner-box:hover .lower-box h3 a { color: var(--bes-orange); }
.client .travel-block .inner-box:hover, .team-member-two .travel-block .inner-box:hover { transform: translateY(-5px) scale(1.03); }

/* ---------- Gallery / our work ---------- */
.gallery-item .inner-box .image-box { overflow: hidden; }
.gallery-item .inner-box .image-box img { transition: transform .8s var(--bes-ease); }
.gallery-item .inner-box:hover .image-box img { transform: scale(1.12); }
.gallery-item .inner-box .overlay-box .plus-icon { transition: transform .45s var(--bes-ease); }
.gallery-item .inner-box:hover .overlay-box .plus-icon { transform: rotate(90deg) scale(1.1); }

/* ---------- Home: about image, enquiry sidebar list, counters, testimonials ---------- */
.video-box .image { overflow: hidden; border-radius: 4px; }
.video-box .image img { transition: transform .9s var(--bes-ease); }
.video-box:hover .image img { transform: scale(1.06); }

.fullwidth-section .sidebar ul li a { display: block; transition: transform .3s var(--bes-ease), color .3s ease; }
.fullwidth-section .sidebar ul li a:hover { transform: translateX(8px); color: var(--bes-orange); }
.fullwidth-section .signup-form .form-group input,
.fullwidth-section .signup-form .form-group textarea,
.signup-form .form-group input,
.signup-form .form-group textarea { transition: box-shadow .3s ease, border-color .3s ease, transform .3s ease; }
.signup-form .form-group input:focus,
.signup-form .form-group textarea:focus { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(255, 149, 53, .25); }

.counter-sec .cont-icon img { transition: transform .5s var(--bes-ease); }
.counter-sec .py-4 { transition: transform .35s var(--bes-ease); }
.counter-sec .py-4:hover { transform: translateY(-6px); }
.counter-sec .py-4:hover .cont-icon img { transform: scale(1.18) rotate(8deg); }

.block-text, .person-text { transition: transform .35s var(--bes-ease), box-shadow .35s ease; }
.block-text:hover { transform: translateY(-5px); box-shadow: 0 14px 28px rgba(0, 0, 0, .18); }
.person-text img { transition: transform .4s var(--bes-ease); }
.person-text:hover img { transform: scale(1.1) rotate(4deg); }

/* ---------- Sidebar on service pages ---------- */
.sidebar-widget ul li a, .services-list li a { transition: transform .3s var(--bes-ease), color .3s ease; display: block; }
.sidebar-widget ul li a:hover, .services-list li a:hover { transform: translateX(6px); color: var(--bes-orange); }

/* ---------- FAQ ---------- */
.faq-block .accordion .at-item { transition: box-shadow .3s ease, transform .3s var(--bes-ease), border-color .3s ease; }
.faq-block .accordion .at-item:hover { transform: translateX(4px); box-shadow: 0 8px 22px rgba(0, 0, 0, .08); }
.faq-block .at-title { transition: background-color .3s ease, color .3s ease; cursor: pointer; }
.faq-block .at-title:hover h4 { color: var(--bes-orange); }
.faq-block-image { overflow: hidden; border-radius: 6px; }
.faq-block-image img { transition: transform .9s var(--bes-ease); }
.faq-block:hover .faq-block-image img { transform: scale(1.05); }

/* ---------- Footer ---------- */
.main-footer .links-widget .list li a {
    display: inline-block;
    transition: transform .3s var(--bes-ease), color .3s ease;
}
.main-footer .links-widget .list li a:hover { transform: translateX(7px); }
.main-footer .links-widget .list li a > i.fa { transition: transform .3s var(--bes-ease); }
.main-footer .links-widget .list li a:hover > i.fa { transform: scale(1.3) rotate(-8deg); }
.main-footer .footer-social li a { transition: transform .35s var(--bes-ease), background-color .3s ease; }
.main-footer .footer-social li a:hover { transform: translateY(-5px) rotate(360deg); }
.main-footer .footer-info .inner { transition: transform .3s var(--bes-ease); }
.main-footer .footer-info .inner:hover { transform: translateX(5px); }
.main-footer .logo-widget img { transition: transform .4s var(--bes-ease); }
.main-footer .logo-widget img:hover { transform: scale(1.04); }
.popular-services-strip ul li a { display: inline-block; transition: transform .25s var(--bes-ease), color .3s ease; }
.popular-services-strip ul li a:hover { transform: translateY(-2px); }
.main-footer .footer-credit a { display: inline-block; transition: transform .3s var(--bes-ease), color .3s ease; }
.main-footer .footer-credit a:hover { transform: scale(1.08); }

.scroll-to-top { transition: transform .3s var(--bes-ease), background-color .3s ease; }
.scroll-to-top:hover { transform: translateY(-6px); }

/* ---------- Content pages: sitemap, locations, career, 404, contact ---------- */
.sitemap-list li a { display: inline-block; transition: transform .25s var(--bes-ease), color .3s ease; }
.sitemap-list li a:hover { transform: translateX(6px); }
.sitemap-list li a i.fa { transition: transform .3s var(--bes-ease); }
.sitemap-list li a:hover i.fa { transform: scale(1.25) rotate(-8deg); }

.about-section-two.service ul li a, .about-section-two ul li a { transition: color .3s ease, transform .3s var(--bes-ease); }

.career-role { transition: transform .35s var(--bes-ease), box-shadow .35s ease, background-color .3s ease; }
.career-role:hover { transform: translateY(-6px); box-shadow: 0 14px 30px rgba(0, 0, 0, .12); background: #ffffff; }
.career-role-icon { transition: transform .5s var(--bes-ease), background-color .3s ease; }
.career-role:hover .career-role-icon { transform: rotateY(360deg); background: var(--bes-navy); }
.career-perk { transition: transform .35s var(--bes-ease), box-shadow .35s ease, border-color .3s ease; }
.career-perk:hover { transform: translateY(-8px); box-shadow: 0 16px 32px rgba(0, 0, 0, .12); border-color: var(--bes-orange); }
.career-perk > .fa { transition: transform .5s var(--bes-ease); }
.career-perk:hover > .fa { transform: scale(1.25) rotate(-10deg); }
.career-form input, .career-form select, .career-form textarea { transition: border-color .3s ease, box-shadow .3s ease; }
.career-form input:focus, .career-form select:focus, .career-form textarea:focus { box-shadow: 0 6px 16px rgba(255, 149, 53, .22); }

.error-404-section .error-code { animation: besFloat 3.2s ease-in-out infinite; }
@keyframes besFloat {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-12px); }
}

.contact-form input, .contact-form textarea { transition: box-shadow .3s ease, border-color .3s ease; }
.contact-form input:focus, .contact-form textarea:focus { box-shadow: 0 6px 16px rgba(255, 149, 53, .22); }
.contact-info ul { transition: transform .3s var(--bes-ease); }
.contact-info ul:hover { transform: translateX(6px); }

/* Page-title banner: slow zoom so the top of every inner page feels alive */
.page-title { overflow: hidden; }
.page-title .inner-box { animation: besRise .9s var(--bes-ease) both; }
@keyframes besRise {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: none; }
}

/* ---------- Respect reduced-motion preferences ---------- */
@media (prefers-reduced-motion: reduce) {
    .bes-anim, .bes-anim.bes-in { opacity: 1 !important; transform: none !important; transition: none !important; }
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* ---------- Image hover movement (every content image on every page) ---------- */
.featured-thumbnail { overflow: hidden; border-radius: 6px; background: #ffffff; }
.featured-thumbnail img { transition: transform .6s var(--bes-ease), box-shadow .4s ease, filter .4s ease; }
.featured-imagebox { transition: transform .4s var(--bes-ease), box-shadow .4s ease; border-radius: 6px; }
.featured-imagebox:hover { transform: translateY(-7px); box-shadow: 0 16px 32px rgba(0, 0, 0, .14); }
.featured-imagebox:hover .featured-thumbnail img { transform: scale(1.12) rotate(1deg); filter: saturate(1.15); }

/* Photos inside article text (service pages, about, services): float up with a soft shadow and a tiny tilt. */
.about-section-two .content-column img,
.about-section-two .image-column img,
.about-section-two img.img-fluid,
.service-block img {
    transition: transform .5s var(--bes-ease), box-shadow .5s ease, filter .4s ease;
}
.about-section-two .content-column img:hover,
.about-section-two .image-column img:hover,
.about-section-two img.img-fluid:hover,
.service-block img:hover {
    transform: translateY(-6px) scale(1.025) rotate(-.4deg);
    box-shadow: 0 18px 36px rgba(0, 0, 0, .18);
    filter: saturate(1.12) contrast(1.03);
}
/* Keep the page-width banner/photo images that sit directly in a column from jumping out of their column. */
.about-section-two .content-column .inner img { position: relative; z-index: 1; }

/* Client logo carousel + icons: a gentle pop */
.counter-sec .cont-icon img, .client img { will-change: transform; }
.client img { transition: transform .45s var(--bes-ease); }
.client .travel-block:hover img { transform: scale(1.08); }

/* ---------- Image hover: rotate + zoom, on every page ----------
   Applies to every picture inside the page (service photos, gallery, cards,
   FAQ photos, client logos, footer logo...). The header logo, the home slider
   and the counter icons are left alone on purpose. */
.page-wrapper img { transition: transform .55s var(--bes-ease), box-shadow .4s ease, filter .4s ease; }
.page-wrapper img:hover { transform: scale(1.1) rotate(4deg) !important; filter: saturate(1.15); position: relative; z-index: 2; }
.page-wrapper .main-header img:hover,
.page-wrapper .tp-banner-container img:hover,
.page-wrapper .sticky-header img:hover { transform: none !important; filter: none; }

/* Photos that sit in a card/frame: rotate INSIDE the frame so it never spills over the neighbours. */
.faq-block-image, .featured-thumbnail, .travel-block .inner-box .image, .gallery-item .image-box,
.video-box .image, .faq-block-image-2 { overflow: hidden; }

/* Rotated photos can poke past the right edge for a moment - never show a sideways scrollbar for it. */
body { overflow-x: hidden; }