/* =========================================================
   Nesaj "Register your interest" landing (body.nesaj-landing)
   — nesaj-register-your-interest
   Values taken from the live Elementor CSS (pages 61501 / 61519).
   Markup: src/seed/fix-nesaj-register-interest.ts
   The landing has its own bar and footer, so the site header
   and footer are hidden here.
   ========================================================= */

body.nesaj-landing { padding-top: 0 !important; background-color: #f4f3f1 !important; }
body.nesaj-landing #header,
body.nesaj-landing .site-footer { display: none !important; }
/* the page's background photo (its URL is set inline by the markup) */
.nsj-bg { position: fixed; inset: 0; z-index: -1; background-position: center; background-size: cover; background-repeat: no-repeat; pointer-events: none; }

/* main is one grid: bar across, title | form, footer across.
   The HTML blocks' wrappers step aside so their children join the grid. */
.nsj-main {
	--nsj-ink: #2C2C2C; --nsj-brown: #85553A; --nsj-side: 50px;
	position: relative; z-index: 0; /* own stacking context, so .nsj-bg (z-index -1, inside main) stays above the page ground */
	display: grid;
	grid-template-columns: var(--nsj-side) minmax(0, 1fr) minmax(0, 1fr) var(--nsj-side);
	grid-template-rows: auto minmax(62vh, auto) auto;
	min-height: 100vh;
	color: var(--nsj-ink);
}
.nsj-main > .cms-section { display: contents; }
.nsj-main img { display: block; max-width: 100%; height: auto; }

/* ---------- top bar ---------- */
.nsj-top {
	grid-column: 1 / -1; grid-row: 1;
	display: grid; grid-template-columns: minmax(0, 93.064%) minmax(0, 6.936%); align-items: center;
	margin-top: 2%;
	position: relative; z-index: 9;
}
.nsj-top__line { align-self: end; height: 1px; margin: 45px 20px 15px; background: #000; }
.nsj-top__logo { margin: 2% 2% 0 0; }
.nsj-top__logo img { width: 70%; }

.nsj-lang {
	position: fixed; top: 0; inset-inline-start: 0; z-index: 99;
	display: inline-flex; align-items: center; gap: 0;
	padding: 5px 10px;
	font-family: '29LTAzer-Light', sans-serif; font-size: 15px; line-height: 1.5; color: #000;
	transition: color .3s;
}
.nsj-lang:hover, .nsj-lang:focus-visible { color: var(--nsj-brown); }
.nsj-lang img { width: 18px; height: 12px; }
.nsj-lang span { padding: 0 5px; }
.rtl .nsj-lang { font-family: 'Marcellus', serif; }

/* ---------- title + form ---------- */
.nsj-title {
	grid-column: 2; grid-row: 2; align-self: start;
	margin: 30px 0 0; /* 20px band padding + 10px column margin */
	font-family: 'Lucky Beauty new', 'Lucky Beauty', serif; font-size: 80px; font-weight: 400; line-height: 81px; color: var(--nsj-ink);
}
.nsj-title--img { margin-top: 10px; }
.nsj-title--img img { width: 800px; }

.nsj-main > .cms-form-section { grid-column: 3; grid-row: 2; align-self: center; padding: 20px 10% 0; }
.nsj-main > .cms-form-section .container { max-width: 490px; margin: 0; padding: 0; }
.nsj-main > .cms-form-section .section-title,
.nsj-main > .cms-form-section .cms-form-section__intro { display: none; }

.nsj-main .lead-form { grid-template-columns: 1fr; gap: 10px; padding: 0; border: 0; background: transparent; font-family: 'Marcellus', serif; }
.rtl .nsj-main .lead-form { font-family: '29LTAzer-Light', sans-serif; }
/* WordPress shows the fields without labels (placeholders only) */
.nsj-main .lead-form .flbl { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.nsj-main .lead-form label, .nsj-main .lead-form .fselect, .nsj-main .lead-form .fphone { gap: 0; }
.nsj-main .lead-form input, .nsj-main .lead-form select, .nsj-main .lead-form textarea,
.nsj-main .lead-form .ss-trigger {
	min-height: 40px; padding: 5px 14px;
	border: 1px solid #7A7A7A6E; border-radius: 0; background: transparent;
	font-size: 14px; line-height: 1.4; color: #000;
}
.nsj-main .lead-form :is(input, select, textarea):focus, .nsj-main .lead-form .ss-trigger:focus-visible { border-color: var(--nsj-ink); }
/* phone: one outlined box, country picker and number inside */
.nsj-main .lead-form .pi { border-color: #7A7A7A6E; background: transparent; }
.nsj-main .lead-form .pi:focus-within { border-color: var(--nsj-ink); }
.nsj-main .lead-form .pi .pi-num, .nsj-main .lead-form .pi .ss-trigger { border: 0; background: transparent; }
.nsj-main .lead-form .pi .ss-trigger { border-inline-end: 1px solid #7A7A7A6E; }
.nsj-main .lead-form ::placeholder, .nsj-main .lead-form .ss-ph { color: #7A7A7A; opacity: 1; }
/* Arabic: every field reads from the right, the ltr ones (phone, email) included, as on WordPress */
.rtl .nsj-main .lead-form input, .rtl .nsj-main .lead-form textarea { text-align: right; }
/* LeadSource and channel are tracking selects WordPress keeps out of sight; so is Project of Interest */
.nsj-main .lead-form .fselect:has(input[name="projectOfInterestcustom"]) { display: none; }
.nsj-main .lead-form .fselect:has(input[name="LeadSource"]),
.nsj-main .lead-form .fselect:has(input[name="channel"]) { position: absolute; z-index: 0; opacity: 0; visibility: hidden; }

.nsj-main .lead-form .btn-solid {
	justify-self: stretch !important; justify-content: center; width: 100%;
	padding: 15px 30px; border: 0; border-radius: 0; background: #53585B;
	font-family: 'Marcellus', serif; font-size: 16px; font-weight: 500; letter-spacing: 0; text-transform: none; color: #fff;
	transition: background-color .3s;
}
.nsj-main .lead-form .btn-solid:hover, .nsj-main .lead-form .btn-solid:focus-visible { background: var(--nsj-ink); color: #fff; }
.rtl .nsj-main .lead-form .btn-solid { font-family: '29LTAzer-Light', sans-serif; }
.nsj-main .lead-form .btn-solid .arr { display: none; }

/* ---------- footer ---------- */
.nsj-foot {
	grid-column: 2 / 4; grid-row: 3;
	display: flex; justify-content: space-between; align-items: flex-end; gap: 20px;
	min-height: 15vh; padding-bottom: 20px;
}
.nsj-foot__logo img { width: 103px; }
.nsj-social { display: flex; align-items: center; gap: 5px; margin: 5px 0 0; padding: 0; list-style: none; }
.nsj-social a { display: flex; align-items: center; justify-content: center; min-width: 22px; padding: 0 2px; font-size: 18px; color: var(--nsj-ink); transition: color .3s; }
.nsj-social a:hover, .nsj-social a:focus-visible { color: var(--nsj-brown); }

/* ---------- responsive (Elementor breakpoints 1200 / 880 / 767) ---------- */
@media (max-width: 1200px) {
	.nsj-main { --nsj-side: 0px; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto auto; }
	.nsj-top { grid-template-columns: minmax(0, 85%) minmax(0, 15%); margin-top: 0; padding-inline-start: 20px; }
	.nsj-top__logo img { width: 70%; }
	/* the title moves above the form */
	.nsj-title { grid-column: 1; grid-row: 2; margin: 0; padding: 10% 10% 0; font-size: 49px; line-height: 1.2; }
	.nsj-title--img img { width: min(800px, 100%); }
	.nsj-main > .cms-form-section { grid-column: 1; grid-row: 3; align-self: start; padding: 10% 10% 10%; }
	.nsj-foot { grid-column: 1; grid-row: 4; padding: 0 50px 20px; }
	.nsj-foot__logo img { width: 55px; }
	.nsj-main .lead-form input, .nsj-main .lead-form select, .nsj-main .lead-form .ss-trigger { font-size: 13px; }
}

@media (max-width: 767px) {
	.nsj-top { grid-template-columns: minmax(0, 70%) minmax(0, 30%); margin-top: 10px; padding-inline-start: 0; }
	.nsj-top__logo { margin: 5% 2% 0; padding-inline-start: 10%; }
	.nsj-top__logo img { width: 80%; }
	.nsj-title { margin-top: 20px; padding: 30px 20px 0; font-size: 36px; line-height: 40px; }
	.nsj-main > .cms-form-section { padding: 15px 20px 10px; }
	.nsj-main > .cms-form-section .container { max-width: none; }
	.nsj-foot { flex-wrap: wrap; justify-content: center; align-items: center; min-height: 0; padding: 20px 20px 30px; }
	.nsj-foot__logo, .nsj-social { flex: 1 1 100%; display: flex; justify-content: center; }
	.nsj-foot__logo img { width: 56px; }
}