/* The public visa-services page (/visa, owner 2026-10-12) in Manara's navy and blue. Frappe's own navbar and footer step
   aside on this page; everything is scoped under .mvs. */
body:has(.mvs) .navbar, body:has(.mvs) header.web-header, body:has(.mvs) .web-footer, body:has(.mvs) footer.web-footer { display: none !important; }
body:has(.mvs) .page_content, body:has(.mvs) .page-content-wrapper, body:has(.mvs) main { padding: 0 !important; margin: 0 !important; }
body:has(.mvs) .page-content-wrapper > .container, body:has(.mvs) main > .container { max-width: none !important; padding: 0 !important; }
body:has(.mvs) { background: #F4F6F9; }
.mvs { --navy: #10233F; --navy-deep: #0A1B33; --blue: #2C5EA8; --ink: #17243A; --muted: #627188; --line: #E2E7EF; --soft: #EAF1FC;
	--gold: #BC9856; font-family: Inter, "IBM Plex Sans Arabic", system-ui, -apple-system, "Segoe UI", sans-serif; color: var(--ink); }
.mvs *, .mvs *::before, .mvs *::after { box-sizing: border-box; }
.mvs a { text-decoration: none; }
.mvs h1, .mvs h2, .mvs h3, .mvs h4 { color: var(--navy); letter-spacing: -.01em; margin: 0; }

.mvs-top { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 20px; padding: 12px max(20px, calc(50% - 580px));
	background: rgba(255, 255, 255, .96); backdrop-filter: blur(8px); box-shadow: 0 1px 0 var(--line); }
.mvs-logo { display: inline-flex; align-items: center; gap: 10px; color: var(--navy); font-weight: 700; font-size: 1.1rem; }
.mvs-mark { width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(140deg, var(--navy), var(--blue)); position: relative; }
.mvs-mark::after { content: ""; position: absolute; inset: 8px; border: 2px solid #fff; border-radius: 4px; box-shadow: inset 0 -5px 0 -3px #fff; }
.mvs-nav { display: flex; gap: 4px; margin-inline-start: 12px; }
.mvs-nav a { color: var(--ink); font-weight: 500; padding: 8px 12px; border-radius: 999px; }
.mvs-nav a:hover { background: var(--soft); color: var(--blue); }
.mvs-signin { margin-inline-start: auto; padding: 9px 18px; border-radius: 999px; color: #fff; font-weight: 600;
	background: linear-gradient(110deg, var(--navy), var(--blue)); }
.mvs-signin:hover { color: #fff; }
@media (max-width: 860px) { .mvs-nav { display: none; } }

.mvs-hero { position: relative; color: #fff; padding: 72px max(20px, calc(50% - 580px)) 56px;
	background: linear-gradient(95deg, rgba(10, 27, 51, .9) 0%, rgba(10, 27, 51, .62) 50%, rgba(10, 27, 51, .25) 100%),
		url("https://images.unsplash.com/photo-1512453979798-5ea266f8880c?auto=format&fit=crop&w=1800&q=75") center / cover var(--navy); }
.mvs-hero-in { max-width: 680px; }
.mvs-eyebrow { display: inline-block; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: #E2C483; margin-bottom: 14px; }
.mvs-hero h1 { color: #fff; font-size: clamp(2rem, 4vw, 3.1rem); line-height: 1.1; font-weight: 700; margin-bottom: 16px; }
.mvs-hero p { color: rgba(255, 255, 255, .86); font-size: 1.1rem; margin: 0 0 26px; }
.mvs-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.mvs-btn { display: inline-flex; align-items: center; padding: 12px 22px; border-radius: 12px; font-weight: 600; color: #fff;
	background: linear-gradient(110deg, var(--navy), var(--blue)); box-shadow: 0 10px 22px -12px var(--blue); transition: transform .15s; }
.mvs-btn:hover { color: #fff; transform: translateY(-1px); }
.mvs-hero .mvs-btn { background: #fff; color: var(--navy); }
.mvs-hero .mvs-btn:hover { color: var(--navy); }
.mvs-btn-ghost, .mvs-hero .mvs-btn-ghost { background: transparent; color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .7); }
.mvs-hero .mvs-btn-ghost:hover { color: #fff; background: rgba(255, 255, 255, .1); }
.mvs-stats { display: flex; gap: 14px; flex-wrap: wrap; list-style: none; padding: 0; margin: 40px 0 0; }
.mvs-stats li { display: flex; flex-direction: column; padding: 14px 20px; border-radius: 14px; background: rgba(255, 255, 255, .1);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18); min-width: 150px; }
.mvs-stats b { font-size: 1.5rem; color: #fff; }
.mvs-stats span { font-size: .85rem; color: rgba(255, 255, 255, .78); }

.mvs-section { max-width: 1200px; margin: 0 auto; padding: 48px 20px 8px; }
.mvs-head { margin-bottom: 20px; }
.mvs-head h2 { font-size: 1.7rem; font-weight: 700; margin-bottom: 6px; }
.mvs-head p, .mvs-muted { color: var(--muted); margin: 0; }
.mvs-cat { font-size: 1.05rem; font-weight: 700; margin: 24px 0 12px; color: var(--blue); }
.mvs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 16px; }
.mvs-card { display: flex; flex-direction: column; gap: 10px; padding: 18px; border-radius: 16px; border: 1px solid transparent;
	background: linear-gradient(#fff, #fff) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--blue) 55%, #fff), var(--line) 60%) border-box;
	box-shadow: 0 10px 24px -20px rgba(16, 35, 63, .4); }
.mvs-card h4 { font-size: 1.05rem; font-weight: 600; }
.mvs-facts { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.mvs-facts li { font-size: .8rem; background: var(--soft); color: var(--navy); border-radius: 999px; padding: 3px 10px; }
.mvs-needs { font-size: .85rem; color: var(--muted); margin: 0; }
.mvs-price { margin-top: auto; display: flex; align-items: baseline; gap: 6px; }
.mvs-price small { color: var(--muted); }
.mvs-price strong { font-size: 1.35rem; color: var(--navy); font-variant-numeric: tabular-nums; }

.mvs-steps { list-style: none; counter-reset: s; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 16px; }
.mvs-steps li { counter-increment: s; display: flex; flex-direction: column; gap: 6px; padding: 20px; background: #fff; border-radius: 16px; box-shadow: inset 0 0 0 1px var(--line); }
.mvs-steps li::before { content: counter(s); width: 36px; height: 36px; border-radius: 12px; display: grid; place-items: center; font-weight: 700; color: #fff;
	background: linear-gradient(140deg, var(--navy), var(--blue)); margin-bottom: 6px; }
.mvs-steps b, .mvs-features b { color: var(--navy); }
.mvs-steps span, .mvs-features span { color: var(--muted); font-size: .92rem; }
.mvs-features { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 16px; margin-bottom: 22px; }
.mvs-features div { display: flex; flex-direction: column; gap: 6px; padding: 20px; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1px var(--line); }

.mvs-foot { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 28px; margin-top: 56px; padding: 44px max(20px, calc(50% - 580px)) 24px;
	background: var(--navy); color: rgba(255, 255, 255, .78); }
.mvs-foot strong { color: #fff; font-size: 1.1rem; }
.mvs-foot p { margin: 8px 0 0; max-width: 340px; }
.mvs-foot-col { display: flex; flex-direction: column; gap: 8px; }
.mvs-foot-col b { color: #fff; }
.mvs-foot a { color: rgba(255, 255, 255, .85); }
.mvs-foot a:hover { color: #fff; }
.mvs-legal { grid-column: 1 / -1; border-top: 1px solid rgba(255, 255, 255, .12); padding-top: 16px; font-size: .85rem; }
@media (max-width: 760px) { .mvs-foot { grid-template-columns: 1fr; } }
.mvs-whatsapp { position: fixed; inset-inline-end: 20px; inset-block-end: 20px; z-index: 30; width: 56px; height: 56px; border-radius: 50%;
	background: #25D366 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 0 1-11.8 7L3 21l2-5.6A8 8 0 1 1 21 12z'/%3E%3C/svg%3E") center / 26px no-repeat;
	box-shadow: 0 10px 24px -8px rgba(0, 0, 0, .45); }