/* ==========================================================================
   JLS Computers — Contact + Request a Quote pages (8 Oct 2026)
   Markup lives in the page content (.jls-cpage); loaded by inc/jls-pages.php.
   ========================================================================== */

html body.jls-styled-page .inside-article { padding: 0 !important; background: transparent !important; box-shadow: none !important; }
html body.jls-styled-page .entry-content { margin-top: 0 !important; }

.jls-cpage { max-width: var(--jls-wrap, 1440px); margin: 0 auto; padding: 24px 24px 64px; box-sizing: border-box; font-family: var(--jls-font, "Inter", sans-serif); color: var(--a-text); }

/* Hero */
.jls-cpage__hero {
	margin: 0 0 22px; padding: 40px 44px 38px; border-radius: var(--a-radius-lg, 18px); color: #fff;
	background: radial-gradient(130% 140% at 100% 0%, #2C5697 0%, #1F3361 52%, #15203A 100%);
	box-shadow: 0 10px 30px rgba(21, 32, 58, .16);
}
.jls-cpage__eyebrow { display: inline-flex; margin-bottom: 14px; padding: 6px 12px; border-radius: 999px; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .22); font-size: 12.5px; font-weight: 600; color: #fff; }
html body .jls-cpage__hero h1 { margin: 0 0 10px !important; font-family: var(--jls-font-heading) !important; font-size: clamp(30px, 3.6vw, 44px) !important; font-weight: 800 !important; line-height: 1.12 !important; letter-spacing: var(--jls-heading-tracking, -.01em); text-transform: none !important; color: #fff !important; }
.jls-cpage__hero > p { max-width: 640px; margin: 0 !important; font-size: 16px; line-height: 1.6; color: #C9D3E8; }
.jls-cpage__cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
html body .jls-cpage__cta .jls-btn { gap: 8px; text-decoration: none !important; }
html body .jls-cpage__wa { background: #fff !important; color: var(--a-navy) !important; box-shadow: 0 8px 24px rgba(0, 0, 0, .18); }
html body .jls-cpage__wa svg { color: #1FA855; }
html body .jls-cpage__ghost { background: rgba(255, 255, 255, .08) !important; border: 1.5px solid rgba(255, 255, 255, .35) !important; color: #fff !important; }
.jls-cpage__perks { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 22px 0 0 !important; padding: 0 !important; list-style: none !important; }
.jls-cpage__perks li { display: inline-flex; align-items: center; gap: 8px; margin: 0 !important; font-size: 14px; font-weight: 600; color: #E6ECF7; }
.jls-cpage__perks svg { color: #7FB2FF; }

/* Layout */
.jls-cpage__grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 22px; align-items: start; }
.jls-cpage__side { display: flex; flex-direction: column; gap: 18px; }
.jls-cpage .jls-card { padding: 24px; }
html body .jls-cpage h2 { margin: 0 0 4px !important; font-family: var(--jls-font-heading) !important; font-size: 22px !important; font-weight: 800 !important; text-transform: none !important; color: var(--a-ink) !important; }
html body .jls-cpage h3 { margin: 0 0 12px !important; font-family: var(--jls-font-heading) !important; font-size: 16px !important; font-weight: 800 !important; text-transform: none !important; color: var(--a-ink) !important; }
.jls-cpage__lead { margin: 0 0 18px !important; font-size: 14.5px; color: var(--a-muted); }

/* Facts list */
.jls-cpage__facts { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.jls-cpage__facts li { display: flex; gap: 12px; margin: 0 !important; padding: 14px 0; border-top: 1px solid var(--a-line-2); font-size: 14px; line-height: 1.5; }
.jls-cpage__facts li:first-child { border-top: 0; padding-top: 0; }
.jls-cpage__facts li:last-child { padding-bottom: 0; }
.jls-cpage__facts strong { display: block; color: var(--a-ink); font-size: 14px; }
.jls-cpage__facts small { display: block; margin-top: 4px; font-size: 12.5px; color: var(--a-muted); }
html body .jls-cpage__facts a { color: var(--a-navy) !important; font-weight: 600; text-decoration: none !important; }
.jls-cpage__fico { flex: 0 0 auto; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--a-navy-50); color: var(--a-navy); }

/* Quick links */
.jls-cpage__links { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.jls-cpage__links li { margin: 0 !important; }
html body .jls-cpage__links a { display: flex; align-items: center; gap: 12px; padding: 10px 8px; margin: 0 -8px; border-radius: 10px; color: var(--a-ink) !important; font-size: 14.5px; font-weight: 600; text-decoration: none !important; }
html body .jls-cpage__links a:hover { background: var(--a-soft); color: var(--a-navy) !important; }
.jls-cpage__lico { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: var(--a-soft); color: var(--a-navy); }
.jls-cpage__arrow { margin-left: auto; color: #A7B0C4; display: inline-flex; }

/* Steps */
.jls-cpage__steps { list-style: none !important; margin: 0 !important; padding: 0 !important; counter-reset: none; }
.jls-cpage__steps li { display: flex; gap: 12px; margin: 0 0 14px !important; font-size: 14px; line-height: 1.5; }
.jls-cpage__steps li:last-child { margin-bottom: 0 !important; }
.jls-cpage__steps strong { display: block; color: var(--a-ink); }
.jls-cpage__num { flex: 0 0 auto; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--a-navy); color: #fff; font: 700 13px/1 var(--jls-font, "Inter", sans-serif); }

/* Tip card */
.jls-cpage__tip { display: flex; gap: 14px; background: var(--a-navy-50) !important; border-color: #DCE6F4 !important; box-shadow: none !important; }
.jls-cpage__tip .jls-cpage__fico { background: #fff; }
.jls-cpage__tip p { margin: 0 0 10px !important; font-size: 14px; line-height: 1.55; }
html body .jls-cpage__textlink { display: inline-flex; align-items: center; gap: 6px; color: var(--a-navy) !important; font-weight: 700; font-size: 14px; text-decoration: none !important; }

.jls-cpage__legal { margin: 22px 0 0 !important; text-align: center; font-size: 12.5px; color: var(--a-muted); }

/* ---------- Gravity Forms (Orbital theme vars + legacy fallbacks) ---------- */
.jls-cpage .gform_wrapper {
	--gf-color-primary: #2C5697;
	--gf-color-primary-rgb: 44, 86, 151;
	--gf-color-primary-darker: #234578;
	--gf-color-in-ctrl: #fff;
	--gf-ctrl-border-color: #D5DDEB;
	--gf-ctrl-border-color-hover: #AFC0DD;
	--gf-ctrl-border-color-focus: #2C5697;
	--gf-radius: 10px;
	--gf-ctrl-size: 46px;
	--gf-font-family-base: var(--jls-font, "Inter", sans-serif);
	--gf-ctrl-label-color-primary: #15203A;
	--gf-ctrl-font-size: 15px;
	--gf-form-gap-y: 18px;
	margin: 0 !important;
}
.jls-cpage .gform_wrapper .gfield_label, .jls-cpage .gform_wrapper legend.gfield_label { font-size: 13.5px !important; font-weight: 600 !important; color: var(--a-ink) !important; text-transform: none !important; letter-spacing: 0 !important; }
.jls-cpage .gform_wrapper input[type="text"], .jls-cpage .gform_wrapper input[type="email"], .jls-cpage .gform_wrapper input[type="tel"],
.jls-cpage .gform_wrapper input[type="number"], .jls-cpage .gform_wrapper input[type="url"], .jls-cpage .gform_wrapper select, .jls-cpage .gform_wrapper textarea {
	box-sizing: border-box; width: 100% !important; min-height: 46px; padding: 11px 14px !important;
	border: 1px solid #D5DDEB !important; border-radius: 10px !important; background: #fff !important;
	font: 15px/1.4 var(--jls-font, "Inter", sans-serif) !important; color: var(--a-ink) !important; box-shadow: none !important;
}
.jls-cpage .gform_wrapper textarea { min-height: 140px; }
.jls-cpage .gform_wrapper input:focus, .jls-cpage .gform_wrapper select:focus, .jls-cpage .gform_wrapper textarea:focus { border-color: var(--a-navy) !important; outline: none !important; box-shadow: 0 0 0 3px rgba(44, 86, 151, .14) !important; }
.jls-cpage .gform_wrapper .gfield_radio .gchoice, .jls-cpage .gform_wrapper .gfield_checkbox .gchoice { margin-bottom: 6px; }
.jls-cpage .gform_wrapper .gform_footer, .jls-cpage .gform_wrapper .gform_page_footer { margin-top: 8px !important; padding: 0 !important; }
.jls-cpage .gform_wrapper .gform_button, .jls-cpage .gform_wrapper input[type="submit"], .jls-cpage .gform_wrapper button[type="submit"] {
	min-height: 50px !important; padding: 0 28px !important; border: 0 !important; border-radius: 12px !important;
	background: var(--a-navy) !important; color: #fff !important; font: 700 15px/1 var(--jls-font, "Inter", sans-serif) !important;
	text-transform: none !important; letter-spacing: 0 !important; cursor: pointer; box-shadow: 0 6px 16px rgba(44, 86, 151, .25) !important;
}
.jls-cpage .gform_wrapper .gform_button:hover { background: var(--a-navy-600, #234578) !important; }
.jls-cpage .gform_wrapper .gform_confirmation_message { padding: 18px 20px; border-radius: 14px; background: #E9F6EF; border: 1px solid #CBEAD8; color: #14532D; font-weight: 600; }
.jls-cpage .gform_wrapper .gfield_validation_message, .jls-cpage .gform_wrapper .validation_message { font-size: 13px; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
	.jls-cpage__grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	.jls-cpage { padding: 16px 16px 48px; }
	.jls-cpage__hero { padding: 26px 20px 24px; }
	.jls-cpage__hero > p { font-size: 15px; }
	.jls-cpage__cta .jls-btn { flex: 1 1 100%; justify-content: center; }
	.jls-cpage__perks { flex-direction: column; gap: 8px; }
	.jls-cpage .jls-card { padding: 20px 18px; }
	.jls-cpage .gform_wrapper .gform_button { width: 100% !important; }
}