/* Design layer for jaipur.no (loaded last, after the theme and site-fixes.css).

   Type:   Marcellus (display: headings, dish names, prices, quotes)
           Josefin Sans (text and UI)
   Colour: night #0c1315, panel #121b1e, gold #c6a270, ivory #efe8dc, muted #a9a196
   Motif:  the Jaipur palace arch, used once: the phone hero.

   The theme asks for a "Caviar Dreams" heading font that was never deployed;
   wp-content/themes/laurent/assets/fonts/caviardreams_bold-webfont/*.woff2 is
   actually Marcellus (SIL Open Font License) so those requests succeed.
*/
:root {
	--jp-night: #0c1315;
	--jp-panel: #121b1e;
	--jp-gold: #c6a270;
	--jp-gold-line: rgba(198, 162, 112, .38);
	--jp-ivory: #efe8dc;
	--jp-muted: #a9a196;
	--jp-display: "Marcellus", "Iowan Old Style", Georgia, serif;
	--jp-text: "Josefin Sans", "Helvetica Neue", Arial, sans-serif;
	--jp-arch: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 125' preserveAspectRatio='none'%3E%3Cpath d='M0 125V43C0 27 12 16 26 11C38 7 46 4 50 0C54 4 62 7 74 11C88 16 100 27 100 43V125Z'/%3E%3C/svg%3E");
}

/* ---------------------------------------------------------------- type */



/* The theme's heading font (Caviar Dreams) was never deployed, so headings
   fell back to Arial/Helvetica; Elementor's text widgets default to Roboto.
   !important because the theme's selectors are long and specific. */
:root, .elementor-kit-4554 {
	--e-global-typography-primary-font-family: "Marcellus";
	--e-global-typography-secondary-font-family: "Marcellus";
	--e-global-typography-text-font-family: "Josefin Sans";
	--e-global-typography-accent-font-family: "Josefin Sans";
}
h1, h2, h3, h4, h5, h6,
.eltdf-pricing-holder .eltdf-pricing-title, .eltdf-pricing-holder .eltdf-pricing-price,
.jp-buffet-title, .jp-hours-title, .jp-contact-label, .jp-note-title {
	font-family: var(--jp-display) !important;
	font-weight: 400 !important;
}
.elementor-widget-text-editor, .elementor-text-editor, .jp-hours, .jp-hours dt, .jp-hours dd {
	font-family: var(--jp-text) !important;
}
.jp-hours dt { font-weight: 600; letter-spacing: .1em; }
.eltdf-st-title { letter-spacing: .1em; }
.eltdf-pricing-title { letter-spacing: .08em; }
.eltdf-pricing-price { letter-spacing: .02em; }
.eltdf-testimonials-holder.eltdf-testimonials-standard .eltdf-testimonial-text {
	font-family: var(--jp-display) !important;
	color: var(--jp-ivory);
	letter-spacing: .01em;
	line-height: 1.6;
}
.eltdf-pricing-desc, .jp-buffet, .jp-note, .elementor-text-editor { font-weight: 400; }

/* ---------------------------------------------------------------- shared buttons */

.jp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 0 26px;
	border: 1px solid var(--jp-gold);
	font: 600 13px/1 var(--jp-text);
	letter-spacing: .16em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease;
}
.jp-btn-solid { background: var(--jp-gold); color: var(--jp-night); }
.jp-btn-solid:hover, .jp-btn-solid:focus-visible { background: #d6b588; color: var(--jp-night); }
.jp-btn-ghost { background: transparent; color: var(--jp-gold); }
.jp-btn-ghost:hover, .jp-btn-ghost:focus-visible { background: rgba(198, 162, 112, .12); color: var(--jp-gold); }
.jp-btn:focus-visible, .jp-tile:focus-visible { outline: 2px solid var(--jp-ivory); outline-offset: 3px; }

/* ---------------------------------------------------------------- phone hero */

.jp-hero { display: none; }

@media only screen and (max-width: 1024px) {
	/* the desktop slider is replaced by the arch hero */
	.elementor-2955 .elementor-element.elementor-element-eb9f4ad { display: none; }

	.jp-hero {
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 110px 22px 8px; /* the homepage content sits 70px under the header */
		text-align: center;
		background: var(--jp-night);
	}
	.jp-hero-arch {
		position: relative;
		width: min(74vw, 340px);
		aspect-ratio: 4 / 5;
		margin: 6px 0 30px;
	}
	.jp-hero-arch img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
		-webkit-mask: var(--jp-arch) center / 100% 100% no-repeat;
		mask: var(--jp-arch) center / 100% 100% no-repeat;
	}
	/* gold outline arch, offset from the photo */
	.jp-hero-arch::before {
		content: "";
		position: absolute;
		inset: -11px -11px 0;
		background: var(--jp-gold);
		-webkit-mask: var(--jp-arch) center / 100% 100% no-repeat;
		mask: var(--jp-arch) center / 100% 100% no-repeat;
		z-index: -1;
		opacity: .9;
	}
	.jp-hero-arch::after {
		content: "";
		position: absolute;
		inset: -10px -10px 0;
		background: var(--jp-night);
		-webkit-mask: var(--jp-arch) center / 100% 100% no-repeat;
		mask: var(--jp-arch) center / 100% 100% no-repeat;
		z-index: -1;
	}
	.jp-hero-arch { isolation: isolate; }
	.jp-hero-title {
		margin: 0 0 10px;
		max-width: 12em;
		font: 400 clamp(30px, 8.6vw, 40px)/1.12 var(--jp-display);
		color: var(--jp-ivory);
		letter-spacing: .01em;
	}
	.jp-hero-sub {
		margin: 0 0 26px;
		font: 400 16px/1.5 var(--jp-text);
		color: var(--jp-muted);
	}
	.jp-hero-book { width: 100%; max-width: 420px; }
	.jp-hero-buffets {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 10px;
		width: 100%;
		max-width: 420px;
		margin-top: 10px;
	}
	.jp-tile {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 4px;
		padding: 16px 16px 15px;
		border: 1px solid var(--jp-gold-line);
		text-align: left;
		text-decoration: none;
		transition: border-color .2s ease;
	}
	.jp-tile:hover { border-color: var(--jp-gold); }
	.jp-tile-name { font: 400 13px/1.3 var(--jp-text); color: var(--jp-muted); letter-spacing: .02em; }
	.jp-tile-price { font: 400 26px/1.15 var(--jp-display); color: var(--jp-gold); }
	.jp-tile-time { font: 400 13px/1.3 var(--jp-text); color: var(--jp-ivory); }
}

/* ---------------------------------------------------------------- phone booking bar */

.jp-actionbar { display: none; }
@media only screen and (max-width: 767px) {
	.jp-actionbar {
		position: fixed;
		left: 0; right: 0; bottom: 0;
		z-index: 9990;
		display: grid;
		grid-template-columns: 1fr auto;
		gap: 10px;
		padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
		background: rgba(12, 19, 21, .94);
		border-top: 1px solid var(--jp-gold-line);
		-webkit-backdrop-filter: blur(8px);
		backdrop-filter: blur(8px);
		transform: translateY(110%);
		transition: transform .28s ease;
	}
	.jp-actionbar.is-shown { transform: none; }
	.jp-actionbar .jp-btn { min-height: 48px; }
	.jp-actionbar .jp-btn-ghost { padding: 0 22px; }
	body { padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)); }
	/* keep the theme's back-to-top button above the bar */
	#eltdf-back-to-top { bottom: 84px !important; }
}
@media (prefers-reduced-motion: reduce) {
	.jp-actionbar { transition: none; }
}

/* ---------------------------------------------------------------- phones & tablets: page polish */

@media only screen and (max-width: 1024px) {
	/* thin vertical guide lines from the theme: noise on a small screen */
	.eltdf-grid-lines-holder { display: none !important; }

	/* one script label above every heading reads as template filler */
	.eltdf-section-title-holder .eltdf-st-tagline { display: none !important; }

	/* section titles: no flanking ornaments that drift when the title wraps;
	   a short gold rule underneath instead */
	.eltdf-section-title-holder .decor { display: none; }
	.eltdf-section-title-holder .eltdf-st-title-holder { display: block; }
	.eltdf-section-title-holder .eltdf-st-title {
		display: block;
		font-size: 26px;
		line-height: 1.25;
		letter-spacing: .08em;
	}
	.eltdf-section-title-holder .eltdf-st-title::after {
		content: "";
		display: block;
		width: 36px;
		height: 1px;
		margin: 16px auto 0;
		background: var(--jp-gold);
	}

	/* menu lists: name … price on one line, description underneath */
	.eltdf-pricing-holder .eltdf-pricing-item { margin-bottom: 26px; }
	.eltdf-pricing-holder .eltdf-pricing-main {
		display: flex;
		align-items: baseline;
		gap: 10px;
	}
	.eltdf-pricing-holder .eltdf-pricing-title {
		flex: 0 1 auto;
		margin: 0;
		font-size: 15px;
		line-height: 1.35;
	}
	.eltdf-pricing-holder .eltdf-pricing-lines {
		position: static;
		flex: 1 1 18px;
		min-width: 18px;
		height: 1px;
		margin: 0;
		border: 0;
		border-bottom: 1px dotted var(--jp-gold-line);
		transform: translateY(-4px);
		width: auto !important;
	}
	.eltdf-pricing-holder .eltdf-pricing-price {
		position: static;
		flex: 0 0 auto;
		font-size: 17px;
		white-space: nowrap;
	}
	.eltdf-pricing-holder .eltdf-pricing-desc {
		margin-top: 6px;
		font-size: 15px;
		line-height: 1.6;
		color: var(--jp-muted);
	}

	/* theme outline buttons ("View more", "Our menu"): full width, calmer */
	.eltdf-btn.eltdf-btn-outline {
		display: flex;
		justify-content: center;
		width: 100%;
		max-width: 420px;
		margin: 0 auto;
		padding: 17px 20px;
		border-color: var(--jp-gold-line);
		color: var(--jp-gold);
	}
	.eltdf-btn .eltdf-btn-text { font: 600 13px/1 var(--jp-text); letter-spacing: .16em; }

	/* reviews: readable serif instead of the handwriting font */
	.eltdf-testimonials-holder.eltdf-testimonials-standard .eltdf-testimonial-text { font-size: 19px !important; }

	/* phone menu panel */
	.eltdf-mobile-header .eltdf-mobile-nav {
		background: var(--jp-night);
		border-top: 1px solid var(--jp-gold-line);
	}
	.eltdf-mobile-header .eltdf-mobile-nav .eltdf-grid > ul > li > a,
	.eltdf-mobile-header .eltdf-mobile-nav .eltdf-grid > ul > li > h6 {
		padding: 15px 0;
		border-bottom: 1px solid rgba(198, 162, 112, .14);
		font: 400 22px/1.2 var(--jp-display);
		letter-spacing: .02em;
		text-transform: none;
		color: var(--jp-ivory);
	}
	.eltdf-mobile-header .eltdf-mobile-nav .eltdf-grid > ul > li.current-menu-item > a,
	.eltdf-mobile-header .eltdf-mobile-nav .eltdf-grid > ul > li > a:hover { color: var(--jp-gold); }
	.eltdf-mobile-header .eltdf-mobile-nav .eltdf-grid > ul > li > a span { text-decoration: none; }
	.eltdf-mobile-header .eltdf-mobile-nav .eltdf-grid > ul > li.jp-lang > a {
		border-bottom: 0;
		font: 600 13px/1 var(--jp-text);
		letter-spacing: .16em;
		text-transform: uppercase;
		color: var(--jp-gold);
		padding-top: 22px;
	}
}

@media only screen and (max-width: 1024px) {
	/* readable body text: the theme's 300 weight is too thin on phones */
	body { font-weight: 400; }
	.elementor-text-editor, .elementor-text-editor p { font-size: 17px; line-height: 1.65; color: var(--jp-ivory); }
	.elementor-widget-eltdf_button { width: 100% !important; }

	/* footer */
	.eltdf-page-footer .eltdf-footer-top-holder { border-top: 1px solid var(--jp-gold-line); }
	.eltdf-page-footer .textwidget p { font-size: 15px; line-height: 1.7; color: var(--jp-muted); }
	.eltdf-page-footer .widget { margin-bottom: 18px; }
}
@media only screen and (max-width: 1024px) {
	/* phone menu covers the whole screen under the header */
	.eltdf-mobile-header .eltdf-mobile-nav { min-height: calc(100vh - 70px) !important; min-height: calc(100dvh - 70px) !important; }
	.eltdf-mobile-header .eltdf-mobile-nav .eltdf-grid > ul > li > a .item_text::after,
	.eltdf-mobile-header .eltdf-mobile-nav .eltdf-grid > ul > li > a span::after,
	.eltdf-mobile-header .eltdf-mobile-nav .eltdf-grid > ul > li > a span::before { display: none !important; }
}

/* The theme fixes the content width at 600 / 420 / 300px on small screens,
   so a 390–430px phone wasted almost a quarter of its width. Fluid instead. */
@media only screen and (max-width: 768px) {
	.eltdf-container-inner,
	.eltdf-elementor-row-grid-section > .elementor-container,
	.eltdf-grid,
	.eltdf-row-grid-section,
	.eltdf-header-vertical .eltdf-container-inner,
	.eltdf-header-vertical .eltdf-grid,
	.eltdf-header-vertical .eltdf-row-grid-section {
		width: min(600px, calc(100% - 44px));
	}
	.elementor-widget-image .elementor-image img { width: 100%; height: auto; }
}