/* ==========================================================================
   Gully Baba — DESIGN ENHANCEMENT

   A finishing pass on the approved design, not a redesign. Playfair Display,
   Montserrat, #FF914B and the section layout are untouched. What this file
   adds is the work a print-and-ceremony subject deserves and Elementor's
   controls don't reach: real edges and depth on the package cards, the prices
   set as display type rather than UI text, and the interaction and focus
   states the comp never specified.

   Selectors are prefixed with `body` so they clear Elementor's own
   `.elementor-10 .elementor-element.elementor-element-x` specificity without
   reaching for !important.
   ========================================================================== */

body {
	/* Champagne is the ceremony metal; it separates the awards furniture from
	   the brand orange, which stays reserved for actions. */
	--gb-gold:         #E8C88A;
	--gb-gold-soft:    rgba(232, 200, 138, .22);
	--gb-orange:       #FF914B;
	--gb-orange-deep:  #E5762F;
	--gb-rule:         rgba(20, 17, 14, .12);

	/* A contact shadow, a mid diffuse layer and a wide ambient one. Three
	   stacked layers are what make a card read as lifted rather than outlined
	   in grey. */
	--gb-shadow-card:
		0 1px 2px rgba(20, 17, 14, .04),
		0 6px 14px -8px rgba(20, 17, 14, .10),
		0 22px 48px -30px rgba(20, 17, 14, .22);
	--gb-shadow-raised:
		0 2px 4px rgba(20, 17, 14, .06),
		0 12px 24px -12px rgba(20, 17, 14, .18),
		0 36px 70px -40px rgba(229, 118, 47, .35);
}

/* --------------------------------------------------------------------------
   1. FOUNDATIONS
   -------------------------------------------------------------------------- */

/* Anchor links in the nav jump to sections; land them under the fixed header
   rather than behind it. */
body .elementor-10 .e-con.e-parent {
	scroll-margin-top: 90px;
}

::selection {
	background: rgba(255, 145, 75, .26);
}

/* The design never specified a keyboard state. Without one the page is
   unusable by keyboard on a dark background. */
body .elementor-10 a:focus-visible,
body .elementor-10 button:focus-visible,
body .elementor-10 input:focus-visible,
body .elementor-10 textarea:focus-visible,
body header a:focus-visible,
body footer a:focus-visible {
	outline: 2px solid var(--gb-orange);
	outline-offset: 3px;
}

/* Playfair is a high-contrast display face; at 48px and up it sets tighter
   than its default fit. */
body .elementor-10 .elementor-heading-title {
	text-wrap: pretty;
}
body .elementor-10 h1.elementor-heading-title,
body .elementor-10 h2.elementor-heading-title {
	letter-spacing: -0.012em;
}

/* --------------------------------------------------------------------------
   2. CALLS TO ACTION
   The filled buttons carry the page's one job, so they get a real pressed
   state and a shadow tinted to the brand rather than to grey. Outline buttons
   (header, steps, Get started) are deliberately left flat — two competing
   button weights is what makes a page look busy.
   -------------------------------------------------------------------------- */
body .elementor-10 .elementor-element.elementor-element-9edbe7a .elementor-button,
body .elementor-10 .elementor-element.elementor-element-c780efc .elementor-button,
body .elementor-10 .elementor-element.elementor-element-407ab6d .elementor-button,
body .elementor-10 .elementor-element.elementor-element-3131246 .elementor-button {
	background-image: linear-gradient(180deg, #FFA162 0%, var(--gb-orange) 42%, var(--gb-orange-deep) 100%);
	box-shadow: 0 1px 2px rgba(20, 17, 14, .10),
	            0 10px 22px -14px rgba(229, 118, 47, .85);
	border: 0;
}
body .elementor-10 .elementor-element.elementor-element-9edbe7a .elementor-button:hover,
body .elementor-10 .elementor-element.elementor-element-c780efc .elementor-button:hover,
body .elementor-10 .elementor-element.elementor-element-407ab6d .elementor-button:hover,
body .elementor-10 .elementor-element.elementor-element-3131246 .elementor-button:hover {
	background-image: linear-gradient(180deg, #FFAE74 0%, #FF9755 42%, #EE7C33 100%);
	box-shadow: 0 2px 4px rgba(20, 17, 14, .12),
	            0 16px 30px -16px rgba(229, 118, 47, .95);
}
body .elementor-10 .elementor-button:active {
	transform: translateY(0);
	box-shadow: 0 1px 2px rgba(20, 17, 14, .18) inset;
}

/* --------------------------------------------------------------------------
   3. PACKAGES — where the decision is made, so this is where the detail goes
   -------------------------------------------------------------------------- */

/* Edges first. A hairline plus three shadow layers reads as a printed card;
   the 1px grey outline it replaces reads as a wireframe. */
body .elementor-10 .elementor-element.elementor-element-e4a03db,
body .elementor-10 .elementor-element.elementor-element-bf5e6d1 {
	border: 1px solid var(--gb-rule);
	box-shadow: var(--gb-shadow-card);
	background-color: #FFF;
}

/* The Trailblazer tier is the one being recommended, and it is already the
   orange card. Depth does the tiering — no ribbon needed. */
body .elementor-10 .elementor-element.elementor-element-d147d73 {
	box-shadow: var(--gb-shadow-raised);
	border: 1px solid rgba(229, 118, 47, .55);
}

/* The three tiers are compared across, not read down: a one-line strapline in
   two cards and a two-line one in the third pushed that card's price out of
   the row. Reserving the taller of the three keeps every price on one
   baseline, at the cost of 14px of white space in the shorter two. */
body .elementor-10 .elementor-element.elementor-element-da397bc,
body .elementor-10 .elementor-element.elementor-element-f1ee13f,
body .elementor-10 .elementor-element.elementor-element-d7f6af4 {
	min-height: 62px;
}

/* Prices are the page's other display moment, so they are set in the display
   face with lining tabular figures — the three tiers then line up digit for
   digit down the row. */
body .elementor-10 .elementor-element.elementor-element-8348ea6 .elementor-heading-title,
body .elementor-10 .elementor-element.elementor-element-9092a8d .elementor-heading-title,
body .elementor-10 .elementor-element.elementor-element-95cd20c .elementor-heading-title {
	font-family: "Playfair Display", Georgia, serif;
	font-weight: 600;
	letter-spacing: -0.015em;
	font-variant-numeric: tabular-nums lining-nums;
	font-feature-settings: "tnum" 1, "lnum" 1;
}

/* The GST note is a footnote to the price, not a second price. */
body .elementor-10 .elementor-element.elementor-element-d3a8ee6 .elementor-heading-title,
body .elementor-10 .elementor-element.elementor-element-04846ec .elementor-heading-title,
body .elementor-10 .elementor-element.elementor-element-0d653f8 .elementor-heading-title {
	font-size: 15px;
	line-height: 24px;
	opacity: .72;
}

/* "What's included" opens the list; a short rule under it does the separating
   that a heavier weight would otherwise have to do. */
body .elementor-10 .elementor-element.elementor-element-f308a76 .elementor-heading-title,
body .elementor-10 .elementor-element.elementor-element-0f883d3 .elementor-heading-title {
	position: relative;
	padding-bottom: 10px;
}
body .elementor-10 .elementor-element.elementor-element-f308a76 .elementor-heading-title::after,
body .elementor-10 .elementor-element.elementor-element-0f883d3 .elementor-heading-title::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 34px;
	height: 2px;
	background: var(--gb-gold);
}

/* Checklists: the tick belongs on the first line of its item, not centred
   against a three-line paragraph. */
body .elementor-10 .elementor-element.elementor-element-8c22270 .elementor-icon-list-item {
	align-items: flex-start;
}
body .elementor-10 .elementor-element.elementor-element-8c22270 .elementor-icon-list-icon {
	margin-top: 2px;
}

/* --------------------------------------------------------------------------
   4. JURY, TESTIMONIALS, GALLERY — edge work only
   -------------------------------------------------------------------------- */

/* A champagne hairline separates each jury card from the near-black section
   behind it, which the flat navy panels currently melt into. */
body .elementor-10 .elementor-element.elementor-element-d4709bb,
body .elementor-10 .elementor-element.elementor-element-51955b9,
body .elementor-10 .elementor-element.elementor-element-911b244 {
	box-shadow: inset 0 0 0 1px var(--gb-gold-soft);
}

/* Portraits carry a warm cast from the section; a cool hairline keeps them
   from bleeding into the panel. */
body .elementor-10 .elementor-element.elementor-element-2c93ec6,
body .elementor-10 .elementor-element.elementor-element-1e58046,
body .elementor-10 .elementor-element.elementor-element-3c32d8e {
	box-shadow: inset -1px 0 0 rgba(255, 255, 255, .10);
}

/* Testimonial avatars get a thin brand ring so the face reads as a portrait
   rather than a cropped snapshot. */
body .elementor-10 .elementor-element.elementor-element-a1b17c0 .elementor-widget-image img {
	box-shadow: 0 0 0 2px rgba(255, 145, 75, .38);
}

/* The pull-quote panel under the jury is the page's quietest surface; a gold
   left rule marks it as a quotation. */
body .elementor-10 .elementor-element.elementor-element-cdd4582 {
	border-left: 3px solid var(--gb-gold);
}

/* --------------------------------------------------------------------------
   5. THE FORM — the last step before a nomination
   -------------------------------------------------------------------------- */
body .elementor-10 .elementor-element.elementor-element-3131246 .elementor-field-textual {
	border: 1px solid transparent;
	transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}
body .elementor-10 .elementor-element.elementor-element-3131246 .elementor-field-textual:hover {
	background-color: #F1F1F1;
}
body .elementor-10 .elementor-element.elementor-element-3131246 .elementor-field-textual:focus {
	background-color: #FFF;
	border-color: var(--gb-orange);
	box-shadow: 0 0 0 3px rgba(255, 145, 75, .18);
	outline: none;
}
/* #777 on #F6F6F6 sits at 4.2:1 — under the 4.5:1 floor for body text. */
body .elementor-10 .elementor-element.elementor-element-3131246 .elementor-field-textual::placeholder {
	color: #6A6A6A;
	opacity: 1;
}
body .elementor-10 .elementor-element.elementor-element-3131246 textarea.elementor-field-textual {
	resize: vertical;
}

/* --------------------------------------------------------------------------
   6. FOOTER
   -------------------------------------------------------------------------- */
body footer .elementor-icon-list-item a {
	transition: color .2s ease;
}
body footer .elementor-icon-list-item a:hover {
	color: var(--gb-orange);
}
body footer .elementor-social-icon {
	transition: transform .25s cubic-bezier(.2, .7, .3, 1), filter .25s ease;
}
body footer .elementor-social-icon:hover {
	transform: translateY(-2px);
	filter: brightness(1.08);
}

@media (prefers-reduced-motion: reduce) {
	body footer .elementor-social-icon:hover,
	body .elementor-10 .elementor-button:active {
		transform: none;
	}
}

/* ==========================================================================
   7. INTERACTION LAYER
   Everything below answers something the visitor does. The classes are set by
   enhance.js, so none of it applies if the script never runs.
   ========================================================================== */

/* --------------------------------------------------------------------------
   The header dresses for the section behind it

   It is already fixed, but its 60% black wash was made for the hero banner and
   all but disappears over the white sections below. Past the hero it takes
   solid ground, a champagne hairline and a soft drop, so the nav and the
   nomination CTA stay legible the whole way down.
   -------------------------------------------------------------------------- */
header.elementor-location-header .elementor-element.e-con.e-parent {
	transition: background-color .3s ease, box-shadow .3s ease, border-color .3s ease;
}
header.gb-header--pinned .elementor-element.e-con.e-parent {
	background-color: rgba(8, 10, 14, .92);
	backdrop-filter: saturate(1.4) blur(8px);
	border-bottom-color: rgba(232, 200, 138, .28);
	box-shadow: 0 10px 30px -22px rgba(0, 0, 0, .9);
}
html.gb-smooth-scroll {
	scroll-behavior: smooth;
}

/* --------------------------------------------------------------------------
   Packages — the hover shows which card the click will act on
   -------------------------------------------------------------------------- */
body .elementor-10 .elementor-element.elementor-element-56f3393 .elementor-button,
body .elementor-10 .elementor-element.elementor-element-c542598 .elementor-button {
	transition: background-color .3s ease, color .3s ease, border-color .3s ease;
}
body .elementor-10 .elementor-element.elementor-element-e4a03db:hover .elementor-element-56f3393 .elementor-button,
body .elementor-10 .elementor-element.elementor-element-bf5e6d1:hover .elementor-element-c542598 .elementor-button {
	background-color: var(--gb-orange);
	border-color: var(--gb-orange);
	color: #FFF;
}
/* The Trailblazer button is white on orange, so it inverts the other way. */
body .elementor-10 .elementor-element.elementor-element-d147d73:hover .elementor-element-59aa493 .elementor-button {
	background-color: #FFF;
	color: var(--gb-orange-deep);
}

/* --------------------------------------------------------------------------
   Jury — the portrait leans in and the social links take brand colour
   -------------------------------------------------------------------------- */
body .elementor-10 .elementor-element.elementor-element-2c93ec6,
body .elementor-10 .elementor-element.elementor-element-1e58046,
body .elementor-10 .elementor-element.elementor-element-3c32d8e {
	background-size: cover;
	transition: background-size .6s cubic-bezier(.2, .7, .3, 1);
}
body .elementor-10 .elementor-element.elementor-element-d4709bb:hover .elementor-element-2c93ec6,
body .elementor-10 .elementor-element.elementor-element-51955b9:hover .elementor-element-1e58046,
body .elementor-10 .elementor-element.elementor-element-911b244:hover .elementor-element-3c32d8e {
	background-size: 112% auto;
}
body .elementor-10 .elementor-element.elementor-element-51ded35 .elementor-social-icon {
	transition: background-color .25s ease, border-color .25s ease, transform .25s ease;
}
body .elementor-10 .elementor-element.elementor-element-51ded35 .elementor-social-icon:hover {
	background-color: var(--gb-orange);
	border-color: var(--gb-orange);
	transform: translateY(-2px);
}
body .elementor-10 .elementor-element.elementor-element-51ded35 .elementor-social-icon:hover i,
body .elementor-10 .elementor-element.elementor-element-51ded35 .elementor-social-icon:hover svg {
	color: #FFF;
	fill: #FFF;
}

/* --------------------------------------------------------------------------
   Winner logos — colour arrives on approach

   Five logos in five different palettes fight each other at rest. Holding
   them back a little lets the strip read as one row, and hovering restores
   the brand it belongs to.
   -------------------------------------------------------------------------- */
body .elementor-10 .elementor-element.elementor-element-50bfd85 .swiper-slide-image {
	filter: saturate(.55) contrast(.95);
	opacity: .82;
	transition: filter .35s ease, opacity .35s ease, transform .35s ease;
}
body .elementor-10 .elementor-element.elementor-element-50bfd85 .swiper-slide:hover .swiper-slide-image {
	filter: none;
	opacity: 1;
}

/* --------------------------------------------------------------------------
   Winner videos — the play target grows under the cursor
   -------------------------------------------------------------------------- */
body .elementor-10 .elementor-element.elementor-element-797cca9 .elementor-custom-embed-play,
body .elementor-10 .elementor-element.elementor-element-797cca9 .e-hosted-video ~ .elementor-custom-embed-play {
	transition: transform .35s cubic-bezier(.34, 1.56, .64, 1), opacity .3s ease;
}
body .elementor-10 .elementor-element.elementor-element-797cca9 .swiper-slide:hover .elementor-custom-embed-play {
	transform: translate(-50%, -50%) scale(1.12);
}

/* --------------------------------------------------------------------------
   Legacy Makers — a cover you can almost pick up

   The tilt angles come from the pointer; the transform lives here so that a
   visitor without JS, or with reduced motion, simply gets a still cover.
   -------------------------------------------------------------------------- */
body .elementor-10 .gb-tilt {
	--gb-tilt-x: 0deg;
	--gb-tilt-y: 0deg;
	transform: perspective(900px) rotateX(var(--gb-tilt-x)) rotateY(var(--gb-tilt-y));
	transform-style: preserve-3d;
	transition: transform .4s cubic-bezier(.2, .7, .3, 1), box-shadow .4s ease;
	will-change: transform;
}
body .elementor-10 .gb-tilt:hover {
	box-shadow: 0 30px 60px -34px rgba(20, 17, 14, .55);
}

/* The two feature rows beside it warm up on approach. */
body .elementor-10 .elementor-element.elementor-element-5fa4859 .elementor-widget-image img {
	transition: transform .3s cubic-bezier(.34, 1.56, .64, 1);
}
body .elementor-10 .elementor-element.elementor-element-5fa4859 .e-con:hover .elementor-widget-image img {
	transform: scale(1.08);
}

/* --------------------------------------------------------------------------
   Steps — the marker answers the hover, the rule under the step title thickens
   -------------------------------------------------------------------------- */
body .elementor-10 .elementor-element.elementor-element-76ecc45 .elementor-icon-box-title {
	text-decoration-thickness: 1px;
	text-underline-offset: 4px;
	transition: text-decoration-thickness .25s ease, text-underline-offset .25s ease;
}
body .elementor-10 .elementor-element.elementor-element-76ecc45 .elementor-widget-icon-box:hover .elementor-icon-box-title {
	text-decoration-thickness: 2px;
	text-underline-offset: 6px;
}

@media (prefers-reduced-motion: reduce) {
	header.elementor-location-header .elementor-element.e-con.e-parent,
	body .elementor-10 .gb-tilt {
		transition: none;
	}
	body .elementor-10 .elementor-element.elementor-element-51ded35 .elementor-social-icon:hover,
	body .elementor-10 .elementor-element.elementor-element-797cca9 .swiper-slide:hover .elementor-custom-embed-play,
	body .elementor-10 .elementor-element.elementor-element-5fa4859 .e-con:hover .elementor-widget-image img {
		transform: none;
	}
}

/* ==========================================================================
   8. SMALL SCREENS
   Two things the desktop comp could not have anticipated.
   ========================================================================== */

/* The fixed header overlaps the hero, whose copy is centred inside the
   full-height banner — which put the first line underneath the bar. The padding
   clears the 56px bar and leaves a little air; min-height already counts it, so
   the hero does not grow. */
@media (max-width: 767px) {
	body .elementor-10 .elementor-element.elementor-element-848268a {
		padding-top: 64px;
	}
}

/* The bar's height is the logo's height — there is no padding holding it open.
   at 80px, held open by the container's own min-height, the mark eats a tenth
   of a phone screen before the page has said anything. Phone: 44px mark in a
   56px bar. Tablet: 56 in 72. The desktop lockup is untouched. */
@media (max-width: 767px) {
	body .elementor-388 .elementor-element.elementor-element-43e9acde img {
		height: 44px;
		width: auto;
	}
	body .elementor-388 .elementor-element.elementor-element-71ef58ae {
		--min-height: 56px;
	}
}
@media (min-width: 768px) and (max-width: 1024px) {
	body .elementor-388 .elementor-element.elementor-element-43e9acde img {
		height: 56px;
		width: auto;
	}
	body .elementor-388 .elementor-element.elementor-element-71ef58ae {
		--min-height: 72px;
	}
}

/* On a tablet the "What You Get" row keeps its three desktop columns inside a
   688px container, so both text columns ran straight across the trophy in the
   middle. Two things fix it: the row stacks, and the section's background —
   a 1440-wide starfield being cover-scaled into a 768x1270 box, which blew the
   watermark trophy up to fill the screen — is darkened so the copy sits on
   ground rather than on a giant gold base. */
@media (min-width: 768px) and (max-width: 1024px) {
	body .elementor-10 .elementor-element.elementor-element-3035f8c:not(.elementor-motion-effects-element-type-background) {
		/* The :not() mirrors Elementor's own background rule, which outranks a
		   plain class selector.

		   nom.png is 1440x754. Cover-scaling it into a 768-wide, 1180-tall box
		   magnifies it 1.6x, so its watermark trophy lands on the copy and its
		   gold base lands under the last three benefits. Fitted to the width and
		   veiled — transparent at the top where the starfield should read, solid
		   by the time the list starts — the section keeps its atmosphere and the
		   foreground trophy becomes the only trophy on screen. */
		background-image:
			linear-gradient(180deg,
				rgba(14, 0, 4, .35) 0%,
				rgba(14, 0, 4, .82) 26%,
				#0E0004 42%),
			url("/wp-content/uploads/2025/11/nom.png");
		background-size: auto, 100% auto;
		background-position: center, center top;
		background-repeat: no-repeat, no-repeat;
		background-color: #0E0004;
	}
	body .elementor-10 .elementor-element.elementor-element-1bed82f {
		--flex-direction: column;
		--align-items: center;
		--gap: 40px 40px;
		--row-gap: 40px;
	}
	body .elementor-10 .elementor-element.elementor-element-0c44d2c,
	body .elementor-10 .elementor-element.elementor-element-30d56c5,
	body .elementor-10 .elementor-element.elementor-element-a88740e {
		--width: 100%;
	}
	/* Stacked, the mirrored right/left alignment of the two columns reads as a
	   mistake; centred, the six benefits line up as one list. They are icon-box
	   widgets, so the alignment lives on the box wrapper. */
	body .elementor-10 .elementor-element.elementor-element-0c44d2c .elementor-icon-box-wrapper,
	body .elementor-10 .elementor-element.elementor-element-30d56c5 .elementor-icon-box-wrapper,
	body .elementor-10 .elementor-element.elementor-element-0c44d2c .elementor-icon-box-content,
	body .elementor-10 .elementor-element.elementor-element-30d56c5 .elementor-icon-box-content {
		text-align: center;
	}

	/* Left to itself the trophy render fills the stacked column — 688px of
	   gold. Held to the width it has on the phone, it reads as an object on a
	   stage again. */
	body .elementor-10 .elementor-element.elementor-element-465e570 img {
		max-width: 300px;
		height: auto;
		margin-inline: auto;
		display: block;
	}
	body .elementor-10 .elementor-element.elementor-element-a88740e {
		min-height: 0;
	}
}