/* ==========================================================================
   Gully Baba — MOTION LAYER (styles)

   Two jobs only:
   1. The pre-animation states (hidden / offset). These are scoped to
      html.gb-motion, a class the motion JS adds itself, so a visitor without
      JS — or with a JS error — always gets the fully visible page.
   2. Hover / focus interaction states. Those are instant and user-initiated,
      so they stay on even under prefers-reduced-motion, only without travel.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. PRE-ANIMATION STATES
   Only opacity and transform are touched, so nothing here can shift layout
   or change the measured height of a section.
   -------------------------------------------------------------------------- */
html.gb-motion [data-gb-reveal] {
	opacity: 0;
	will-change: opacity, transform;
}

html.gb-motion [data-gb-reveal="up"]    { transform: translate3d(0, 28px, 0); }
html.gb-motion [data-gb-reveal="card"]  { transform: translate3d(0, 34px, 0); }
html.gb-motion [data-gb-reveal="hero"]  { transform: translate3d(0, 24px, 0); }

/* The reveal is finished the moment JS clears the attribute, so nothing is
   left in a will-change state after the page settles. */

/* --------------------------------------------------------------------------
   2. INTERACTION STATES
   -------------------------------------------------------------------------- */

/* Buttons — a small lift plus a warm shadow in the brand orange. */
.elementor-10 .elementor-button,
.elementor-10 .elementor-widget-button a,
.header_btn a {
	transition: transform .28s cubic-bezier(.2, .7, .3, 1),
	            box-shadow .28s cubic-bezier(.2, .7, .3, 1),
	            background-color .28s ease,
	            color .28s ease;
}
.elementor-10 .elementor-button:hover,
.elementor-10 .elementor-widget-button a:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 24px -12px rgba(255, 145, 75, .75);
}

/* Cards — jury rows and package columns lift. */
.elementor-10 .gb-hover-card {
	transition: transform .35s cubic-bezier(.2, .7, .3, 1),
	            box-shadow .35s cubic-bezier(.2, .7, .3, 1);
}
.elementor-10 .gb-hover-card:not(.swiper-slide):hover {
	transform: translateY(-6px);
	box-shadow: 0 22px 45px -28px rgba(0, 0, 0, .65);
}

/* Carousel slides cannot lift: Elementor clips .e-n-carousel .swiper with
   overflow:hidden, so a slide that moves up loses its top border to the clip.
   They get a glow drawn inside their own box instead, which stays put. */
.elementor-10 .gb-hover-card__frame {
	transition: box-shadow .35s cubic-bezier(.2, .7, .3, 1),
	            background-color .35s ease;
}
.elementor-10 .gb-hover-card.swiper-slide:hover .gb-hover-card__frame {
	box-shadow: inset 0 0 0 1px rgba(255, 145, 75, .95),
	            inset 0 26px 60px -30px rgba(255, 145, 75, .28);
	background-color: rgba(255, 145, 75, .04);
}

/* Imagery — the event gallery, the winner videos and the jury portraits get a
   slow push-in. The clip has to live on the frame, not the image, or the
   scaled edges spill over the neighbouring card. */
.elementor-10 .elementor-image-carousel .swiper-slide,
.elementor-10 .gb-hover-zoom {
	overflow: hidden;
}
.elementor-10 .elementor-image-carousel .swiper-slide img,
.elementor-10 .gb-hover-zoom {
	transition: transform .6s cubic-bezier(.2, .7, .3, 1);
}
.elementor-10 .elementor-image-carousel .swiper-slide:hover img {
	transform: scale(1.05);
}
.elementor-10 .gb-hover-zoom:hover {
	transform: scale(1.03);
}

/* The three step markers on "How the Award Works". */
.elementor-10 .elementor-widget-icon-box .elementor-icon {
	transition: transform .35s cubic-bezier(.34, 1.56, .64, 1);
}
.elementor-10 .elementor-widget-icon-box:hover .elementor-icon {
	transform: translateY(-4px) scale(1.06);
}

/* --------------------------------------------------------------------------
   3. REDUCED MOTION
   Entrance animation is skipped in JS; here we make sure the interaction
   states stop travelling too, so nothing on the page moves.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.elementor-10 .elementor-button,
	.elementor-10 .elementor-widget-button a,
	.header_btn a,
	.elementor-10 .gb-hover-card,
	.elementor-10 .gb-hover-card__frame,
	.elementor-10 .gb-hover-zoom,
	.elementor-10 .elementor-image-carousel .swiper-slide img,
	.elementor-10 .elementor-widget-icon-box .elementor-icon {
		transition: box-shadow .2s ease, background-color .2s ease, color .2s ease;
	}
	.elementor-10 .elementor-button:hover,
	.elementor-10 .elementor-widget-button a:hover,
	.elementor-10 .gb-hover-card:not(.swiper-slide):hover,
	.elementor-10 .gb-hover-zoom:hover,
	.elementor-10 .elementor-image-carousel .swiper-slide:hover img,
	.elementor-10 .elementor-widget-icon-box:hover .elementor-icon {
		transform: none;
	}
}