/* V4 base chrome (Step 10b, Decision 10): tokens, fonts, typography,
 * buttons, utility bar, nav, footer, floating/sticky CTA + <x-price>
 * bridge. Loaded on every V4 page after the legacy CSS; logical
 * properties only. Home sections stay in home-v4.css. */
/*══════════ TOKENS (Blueprint v2 §05) ══════════*/
:root{
  --blue:#3467A7; --navy-3:#1B3660; --cyan:#1CAADD;
  --mist-2:#EAF1FA; --mist-3:#E2F5FC; --border:#D4E5F2;
  --green:#1E9E6B; --muted:#64748B;
  --navy:#0B1A30; --navy-2:#12284A; --cyan-lt:#7FD3F0; --mist:#F6F9FC; --star:#F5C451;
  --line-d:rgba(255,255,255,.10); --line-l:rgba(27,54,96,.13);
  --txt-d:rgba(234,241,250,.68);
  --f-d:'Fraunces',Georgia,serif; --f-b:'Montserrat',-apple-system,'Segoe UI',sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
  --maxw:1280px; --gut:clamp(18px,5vw,72px);
  --r-btn:14px;
}
:lang(ar){ --f-d:'Tajawal',sans-serif; --f-b:'Tajawal',sans-serif; } /* Arabic display pairing TBD after test */

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--mist);color:var(--navy-3);font-family:var(--f-b);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
img{max-inline-size:100%;display:block;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4,p,ul{margin:0;}
ul{padding:0;list-style:none;}
button,input,select,textarea{font:inherit;color:inherit;}
.icon{inline-size:1em;block-size:1em;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.flag{inline-size:30px;block-size:20px;border-radius:3px;box-shadow:0 0 0 1px rgba(0,0,0,.08);flex-shrink:0;}
:dir(rtl) .flip{transform:scaleX(-1);}
.wrap{max-inline-size:var(--maxw);margin-inline:auto;padding-inline:var(--gut);}
.band{padding-block:clamp(64px,8vw,112px);}
.sr{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip:rect(0 0 0 0);}
/* grain */
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:200;opacity:.22;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");}
@media (max-width:640px){body::after{display:none;}}
/*══════════ SECTION HEAD ══════════*/
.eyebrow{display:flex;align-items:center;gap:12px;font-size:.66rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--blue);margin-block-end:16px;}
.eyebrow::before{content:'';inline-size:30px;block-size:2px;background:var(--cyan);}
.head{margin-block-end:clamp(34px,4.5vw,58px);}
.head.c{text-align:center;display:flex;flex-direction:column;align-items:center;}
.head.c .eyebrow::after{content:'';inline-size:30px;block-size:2px;background:var(--cyan);}
.h2{font-family:var(--f-d);font-weight:300;font-size:clamp(1.9rem,3.6vw,2.95rem);line-height:1.1;letter-spacing:-.025em;color:var(--navy);max-inline-size:22ch;}
.h2 em{font-style:italic;color:var(--blue);}
.lede{margin-block-start:16px;font-size:.98rem;line-height:1.85;color:var(--muted);max-inline-size:62ch;}
.lede a,.prose a{color:var(--blue);font-weight:600;border-block-end:1px solid rgba(52,103,167,.3);}
.dark .h2{color:#fff;} .dark .h2 em{color:var(--cyan-lt);} .dark .lede{color:var(--txt-d);}
.dark .eyebrow{color:var(--cyan);} .dark .lede a{color:var(--cyan-lt);border-color:rgba(127,211,240,.35);}

/*══════════ BUTTONS ══════════*/
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:15px 24px;border-radius:var(--r-btn);font-size:.84rem;font-weight:700;letter-spacing:.02em;border:1px solid transparent;transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s,color .3s,border-color .3s;}
.btn:hover{transform:translateY(-2px);}
.btn .icon{font-size:1.05rem;}
.b-cyan{background:linear-gradient(135deg,var(--cyan),#1593C2);color:var(--navy);box-shadow:0 10px 28px rgba(28,170,221,.3);}
.b-cyan:hover{box-shadow:0 16px 38px rgba(28,170,221,.45);}
.b-blue{background:var(--blue);color:#fff;box-shadow:0 10px 26px rgba(52,103,167,.28);}
.b-blue:hover{background:var(--navy-3);}
.b-wa{background:var(--green);color:#fff;box-shadow:0 10px 26px rgba(30,158,107,.28);}
.b-wa:hover{background:#178457;}
.b-out{border-color:var(--border);color:var(--navy-3);background:#fff;}
.b-out:hover{border-color:var(--blue);color:var(--blue);}
.b-ghost{border-color:rgba(255,255,255,.25);color:#fff;background:rgba(255,255,255,.06);}
.b-ghost:hover{border-color:var(--cyan-lt);background:rgba(255,255,255,.12);}
.link-arrow{display:inline-flex;align-items:center;gap:7px;font-size:.8rem;font-weight:700;color:var(--blue);transition:gap .3s;}
.link-arrow:hover{gap:11px;}
/*══════════ UTILITY + NAV ══════════*/
.util{background:var(--navy);color:var(--txt-d);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;padding:9px var(--gut);display:flex;justify-content:center;gap:26px;flex-wrap:wrap;border-block-end:1px solid var(--line-d);}
.util b{color:var(--cyan-lt);font-weight:600;}
.pip{display:inline-block;inline-size:6px;block-size:6px;border-radius:50%;background:#37D07F;margin-inline-end:7px;vertical-align:middle;animation:pip 2.2s infinite;}
@keyframes pip{0%{box-shadow:0 0 0 0 rgba(55,208,127,.6);}70%{box-shadow:0 0 0 7px rgba(55,208,127,0);}100%{box-shadow:0 0 0 0 rgba(55,208,127,0);}}

nav.top{position:sticky;inset-block-start:0;z-index:100;background:rgba(11,26,48,.94);backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);border-block-end:1px solid var(--line-d);}
.nav-in{max-inline-size:var(--maxw);margin-inline:auto;padding-inline:var(--gut);block-size:74px;display:flex;align-items:center;justify-content:space-between;gap:20px;}
.brand{display:flex;align-items:center;gap:10px;color:#fff;}
.bm{font-family:var(--f-d);font-size:1.45rem;font-weight:400;letter-spacing:-.02em;}
.bm i{font-style:italic;color:var(--cyan);}
.bl{font-size:.52rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;background:var(--green);color:#fff;padding:3px 7px;border-radius:5px;}
.nav-links{display:flex;gap:28px;align-items:center;}
.nav-links > a,.dd > button{font-size:.8rem;font-weight:500;color:rgba(234,241,250,.78);padding-block:6px;position:relative;background:none;border:0;cursor:pointer;display:inline-flex;align-items:center;gap:5px;}
.nav-links > a::after{content:'';position:absolute;inset-inline-start:0;inset-block-end:0;block-size:2px;inline-size:0;background:var(--cyan);transition:inline-size .3s var(--ease);}
.nav-links > a:hover,.dd > button:hover{color:#fff;}
.nav-links > a:hover::after,.nav-links > a[aria-current]::after{inline-size:100%;}
.nav-links > a[aria-current]{color:#fff;}
.dd{position:relative;}
.dd-menu{position:absolute;inset-block-start:calc(100% + 12px);inset-inline-start:-14px;min-inline-size:230px;background:#fff;border-radius:14px;padding:8px;box-shadow:0 22px 50px rgba(0,0,0,.28);opacity:0;visibility:hidden;transform:translateY(-6px);transition:.25s var(--ease);}
.dd:hover .dd-menu,.dd:focus-within .dd-menu{opacity:1;visibility:visible;transform:none;}
.dd-menu a{display:block;padding:11px 14px;border-radius:9px;font-size:.84rem;font-weight:600;color:var(--navy-3);}
.dd-menu a small{display:block;font-weight:400;font-size:.72rem;color:var(--muted);margin-block-start:2px;}
.dd-menu a:hover{background:var(--mist-2);}
.nav-r{display:flex;align-items:center;gap:10px;}
.nav-lang{font-size:.78rem;color:rgba(234,241,250,.75);border:1px solid var(--line-d);padding:8px 12px;border-radius:10px;}
.nav-lang:hover{border-color:var(--cyan);color:#fff;}
.nav-tel{display:inline-flex;align-items:center;gap:7px;font-size:.8rem;font-weight:600;color:#fff;padding:9px 13px;border-radius:10px;border:1px solid var(--line-d);}
.nav-tel:hover{border-color:var(--cyan);}
.nav-wa{display:inline-flex;align-items:center;gap:7px;font-size:.8rem;font-weight:700;color:#fff;background:var(--green);padding:10px 16px;border-radius:10px;}
.nav-wa:hover{background:#178457;}
.burger{display:none;background:none;border:0;padding:8px;cursor:pointer;flex-direction:column;gap:5px;}
.burger span{inline-size:23px;block-size:2px;background:#fff;border-radius:2px;transition:.3s;}
.mnav{display:none;}
/* SEO link cloud lives in home-v4.css; footer chrome is shared. */
footer{background:#07142A;color:rgba(234,241,250,.55);padding-block:clamp(48px,5vw,70px) 0;font-size:.84rem;}
.f-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:clamp(26px,4vw,48px);padding-block-end:44px;}
.f-b .bm{color:#fff;font-size:1.55rem;}
.f-b p{margin-block:14px 18px;line-height:1.8;max-inline-size:32ch;}
.f-c{display:flex;flex-direction:column;gap:9px;}
.f-c li{display:flex;align-items:center;gap:9px;}
.f-c .icon{color:var(--cyan);}
footer h4{font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#fff;margin-block-end:16px;}
.f-l{display:flex;flex-direction:column;gap:10px;}
.f-l a{transition:color .3s;}
.f-l a:hover{color:var(--cyan-lt);}
.f-soc{display:flex;gap:8px;margin-block-start:18px;}
.f-soc a{inline-size:36px;block-size:36px;border-radius:10px;border:1px solid var(--line-d);display:grid;place-items:center;font-size:.76rem;font-weight:700;transition:.3s;}
.f-soc a:hover{border-color:var(--cyan);color:#fff;}
.f-seo{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding-block-end:44px;}
.f-seo a{display:block;font-size:.74rem;color:rgba(234,241,250,.62);border:1px solid var(--line-d);padding:7px 13px;border-radius:30px;transition:.3s;}
.f-seo a:hover{border-color:var(--cyan);color:#fff;}
.f-bot{border-block-start:1px solid var(--line-d);padding-block:22px 28px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.74rem;color:rgba(234,241,250,.38);}

/*══════════ COMPACT PAGE HERO (12a) ══════════*/
.v4-page-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--navy);color:#fff;padding-block:clamp(40px,5vw,72px) clamp(36px,4.5vw,60px);}
.v4-page-hero::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 60% 80% at 80% 0%,rgba(28,170,221,.22),transparent 60%),radial-gradient(ellipse 50% 60% at 10% 100%,rgba(52,103,167,.35),transparent 60%);}
.v4-page-hero .wrap{position:relative;}
.v4-page-hero h1{font-family:var(--f-d);font-weight:300;font-size:clamp(1.9rem,3.6vw,2.9rem);line-height:1.08;letter-spacing:-.025em;margin-block-end:14px;color:#fff;}
.v4-page-hero h1 em,.v4-page-hero h1 span{font-style:italic;color:var(--cyan-lt);}
.v4-crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:.74rem;color:rgba(234,241,250,.6);margin-block-end:18px;}
.v4-crumbs a{color:var(--cyan-lt);font-weight:600;}
.v4-crumbs [aria-current]{color:#fff;}
.v4-page-intro{font-size:.98rem;line-height:1.8;color:var(--txt-d);max-inline-size:62ch;margin-block-end:24px;}
.v4-page-intro a{color:#fff;font-weight:700;border-block-end:1px solid rgba(127,211,240,.5);}
.v4-page-intro b,.v4-page-intro strong{color:var(--cyan-lt);}
.v4-page-ctas{display:flex;gap:12px;flex-wrap:wrap;}
.v4-page-hero .stats{margin-block-start:26px;padding-block-start:20px;}

/*══════════ COMPATIBILITY (12a): legacy page sections under V4 ══════════*/
/* Restyle only: V4 tokens, fonts, radius and spacing. Body.v4 scopes every
 * rule so flag-off output stays byte-identical. */
body.v4{--font-display:'Fraunces',Georgia,serif;}
body.v4 main{padding-top:0;}
body.v4 h1,body.v4 h2,body.v4 h3{letter-spacing:-.02em;}
body.v4 h1{font-family:var(--f-d);font-weight:300;}
body.v4 h2{font-family:var(--f-d);font-weight:400;}
body.v4 h3{font-family:var(--f-d);font-weight:400;}
body.v4 .section-head h2,body.v4 .section-title{font-family:var(--f-d);font-weight:400;letter-spacing:-.02em;}
body.v4 .section-label{color:var(--blue);}
body.v4 .btn,body.v4 .btn-primary,body.v4 .btn-lg,body.v4 .btn-whatsapp,body.v4 .btn-outline,body.v4 .btn-form-submit,body.v4 .btn-solid,body.v4 .btn-pkg,body.v4 .btn-main,body.v4 .btn-primary-alt,body.v4 .btn-gold,body.v4 .btn-green,body.v4 .btn-blue,body.v4 .btn-load-more,body.v4 .btn-modal-main,body.v4 .btn-cta-wa,body.v4 .btn-cta-primary{border-radius:var(--r-btn);font-family:var(--f-b);}
body.v4 .card,body.v4 .package-card,body.v4 .visa-tier-card,body.v4 .pkg-card,body.v4 .profile-card,body.v4 .blog-card,body.v4 .step-card,body.v4 .p-card,body.v4 .nat-tab,body.v4 .plan-card,body.v4 .reason-card,body.v4 .maid-content-panel,body.v4 .maid-candidates-panel{border-radius:20px;border-color:var(--border);}
body.v4 table{border-color:var(--border);}
body.v4 th{background:rgba(52,103,167,.06);}
body.v4 .form-input,body.v4 .form-select,body.v4 .form-textarea,body.v4 .form-control,body.v4 input[type="text"],body.v4 input[type="tel"],body.v4 input[type="email"],body.v4 select,body.v4 textarea{border-radius:12px;}
body.v4 .faq-item,body.v4 .faq-card,body.v4 .fq{border-radius:16px;}
body.v4 .blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}

/* V4 post cards (shared with the home rail). */
.post{background:#fff;border:1px solid var(--border);border-radius:20px;overflow:hidden;display:flex;flex-direction:column;transition:transform .4s var(--ease),box-shadow .4s var(--ease);}
.post:hover{transform:translateY(-5px);box-shadow:0 22px 48px rgba(27,54,96,.12);}
.post-img{aspect-ratio:16/10;background:var(--mist-2);overflow:hidden;display:grid;place-items:center;}
.post-img .ph{font-family:var(--f-d);font-size:2.6rem;color:rgba(52,103,167,.22);}
.post-img img{inline-size:100%;block-size:100%;object-fit:cover;transition:transform .8s var(--ease);}
.post:hover .post-img img{transform:scale(1.05);}
.post-b{padding:22px;display:flex;flex-direction:column;flex:1;}
.post-cat{font-size:.64rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue);margin-block-end:10px;}
.post h2,.post h3{font-family:var(--f-d);font-size:1.2rem;font-weight:400;line-height:1.3;margin-block-end:10px;}
.post p{font-size:.84rem;line-height:1.75;color:var(--muted);margin-block-end:18px;flex:1;}
.post-date{font-size:.74rem;color:var(--muted);margin-block-end:12px;}

/* V4 chrome must win over legacy link/body colours. */
body.v4 nav.top .nav-links > a,body.v4 nav.top .dd > button{color:rgba(234,241,250,.78);}
body.v4 nav.top .nav-links > a:hover,body.v4 nav.top .dd > button:hover,body.v4 nav.top .nav-links > a[aria-current="page"]{color:#fff;}
body.v4 nav.top .dd-menu a{color:var(--navy-3);}
body.v4 nav.top .dd-menu a small{color:var(--muted);}
body.v4 nav.top .nav-r a{color:rgba(234,241,250,.75);}
body.v4 nav.top .nav-r a:hover{color:#fff;}
body.v4 nav.top .nav-tel{color:#fff;}
body.v4 nav.top .nav-wa,body.v4 nav.top a.nav-wa{color:#fff;}
body.v4 .dd-menu.open{opacity:1;visibility:visible;transform:none;}
body.v4 footer{color:rgba(234,241,250,.55);}
body.v4 footer a{color:inherit;}
body.v4 footer .f-l a:hover{color:var(--cyan-lt);}
body.v4 .sticky .btn{border-radius:var(--r-btn);}
body.v4 .util{color:var(--txt-d);}
/* V4 page hero: hidden duplicate legacy copy (Step 12a). When V4 is on,
 * the legacy hero shows only content the page hero does not repeat;
 * eyebrow, title and intro carry v4-dup, which display rules cannot
 * override (unlike the `hidden` attribute). */
/* Demoted duplicate H1s: same look as the original h1, no extra h1 element. */
body.v4 .v4-dup{display:none !important;}
body.v4 .page-visa .hero p.v4-h1{color:#fff;margin-bottom:16px;font-size:clamp(2rem,3.5vw,2.8rem);font-family:var(--font-display);font-weight:800;line-height:1.2;}
body.v4 .page-visa .hero p.v4-h1 span{color:var(--cyan);}
body.v4 .page-services .svc-hero-content p.v4-h1{font-family:Georgia,serif;font-size:clamp(2.4rem,4vw,3.8rem);font-weight:700;color:#fff;line-height:1.08;letter-spacing:-.02em;margin-bottom:18px;}
/*══════════ FLOATING / STICKY ══════════*/
.float{position:fixed;inset-inline-end:22px;inset-block-end:22px;z-index:120;display:flex;align-items:center;gap:10px;background:var(--green);color:#fff;padding:14px 20px;border-radius:40px;font-size:.8rem;font-weight:700;box-shadow:0 14px 40px rgba(0,0,0,.28);transition:.3s var(--ease);}
.float:hover{background:#178457;transform:translateY(-2px);}
.sticky{display:none;}
/*══════════ <x-price> bridge (Step 10a) — same tokens, logical properties only ══════════*/
.pkg-price .price-amount{font-family:var(--f-d);font-size:2.4rem;font-weight:300;letter-spacing:-.035em;line-height:1;}
.pkg-price .dirham-symbol{font-size:.78rem;font-weight:600;color:var(--muted);}
.pkg.pop .pkg-price .dirham-symbol{color:rgba(234,241,250,.55);}
.pkg-price .price-period{font-style:normal;font-size:.76rem;color:var(--muted);}
.pkg.pop .pkg-price .price-period{color:rgba(234,241,250,.6);}
.hbtn .price-amount{font-weight:700;}
.hbtn .price-period{font-weight:500;}
/* Responsive (chrome) */
@media (max-width:640px){body::after{display:none;}}
@media (max-width:1180px){
  .nav-tel{display:none;}
}
@media (max-width:1080px){
  .f-grid{grid-template-columns:1fr 1fr;}
  body.v4 .blog-grid{grid-template-columns:1fr;max-inline-size:620px;margin-inline:auto;}
}
@media (max-width:900px){
  .nav-links,.nav-wa{display:none;}
  .burger{display:flex;}
  .mnav{display:block;position:fixed;inset:74px 0 auto;z-index:99;background:var(--navy);border-block-end:1px solid var(--line-d);padding:14px var(--gut) 22px;transform:translateY(-120%);transition:transform .4s var(--ease);}
  .mnav.open{transform:none;}
  .mnav a{display:block;padding:13px 0;border-block-end:1px solid var(--line-d);color:#fff;font-weight:600;}
}
@media (max-width:640px){
  .util span:not(:first-child){display:none;}
  .f-grid{grid-template-columns:1fr;}
  .float{display:none;}
  .sticky{display:grid;grid-template-columns:1fr 1.3fr;gap:8px;position:fixed;inset-inline:0;inset-block-end:0;z-index:120;background:var(--navy);border-block-start:1px solid rgba(28,170,221,.3);padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));}
  .sticky .btn{padding:14px 10px;}
  body{padding-block-end:74px;}
}

/* 12a review: the full-time hero lost its heading to the V4 hero, so drop the legacy 90vh height. */
body.v4 .page-services .svc-hero{min-height:0;}
/* 12a review: legacy rules re-showed the desktop links on inner pages under 900px; the tier grid used auto-min columns that overflow at 1024px. */
@media (max-width:900px){body.v4 nav.top .nav-links,body.v4 nav.top .nav-wa{display:none !important;}}
body.v4 .visa-tiers-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
@media (max-width:992px){body.v4 .visa-tiers-grid{grid-template-columns:minmax(0,1fr);}}
body.v4 .visa-tier-card .btn{white-space:normal !important;min-width:0 !important;max-inline-size:100%;padding-inline:20px !important;}

/* Dirham sign (<x-aed>, AED_MODE=font): V4 pages do not load the legacy
   styles.css that carried this @font-face, so declare it here too. */
@font-face{font-family:"UAESymbol";src:url("../fonts/dirham.woff2") format("woff2"),url("../fonts/dirham.woff") format("woff"),url("../fonts/dirham.ttf") format("truetype");font-weight:normal;font-style:normal;font-display:swap;}
.dirham-symbol{font-family:"UAESymbol"!important;font-style:normal!important;font-weight:normal!important;display:inline!important;text-transform:none!important;direction:ltr!important;}
.dirham-symbol::after{content:"\200E"!important;}

/* Shared V4 contact section (partials/v4/sections/contact) — same look on
   every page; home-v4.css keeps its own copy for the homepage. */
.v4-contact .contact-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(26px,4vw,52px);align-items:start;}
.v4-contact .office-card{background:#fff;border:1px solid var(--border);border-radius:22px;padding:26px;margin-block-start:26px;}
.v4-contact .office-card h3{display:flex;align-items:center;gap:8px;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin:0 0 16px;}
.v4-contact .oc-row{display:flex;gap:12px;align-items:flex-start;font-size:.86rem;line-height:1.6;padding-block:10px;border-block-end:1px solid var(--border);}
.v4-contact .oc-row:last-of-type{border-block-end:0;}
.v4-contact .oc-row .icon{color:var(--blue);margin-block-start:4px;flex:none;}
.v4-contact .oc-row a{color:inherit;text-decoration:none;}
.v4-contact .oc-row a:hover{color:var(--blue);}
.v4-contact .oc-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-block-start:18px;}
.v4-contact .map-frame{margin-block-start:14px;border-radius:16px;overflow:hidden;border:1px solid var(--border);background:#fff;}
.v4-contact .map-frame iframe{display:block;inline-size:100%;block-size:240px;border:0;}
.v4-contact .map-link{display:flex;align-items:center;gap:10px;margin-block-start:14px;padding:16px 18px;border-radius:16px;background:#fff;font-size:.84rem;font-weight:600;color:var(--navy-3);text-decoration:none;}
.v4-contact .map-link:hover{background:var(--mist-3);}
.v4-contact .form{background:linear-gradient(165deg,var(--navy-3),var(--navy));color:#fff;border-radius:24px;padding:clamp(26px,3vw,38px);margin:0;}
.v4-contact .form h3{font-family:var(--f-d);font-size:1.6rem;font-weight:300;margin:0 0 6px;color:#fff;}
.v4-contact .form > p{font-size:.84rem;color:var(--txt-d);margin:0 0 22px;}
.v4-contact .fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.v4-contact .fgrid .full{grid-column:1/-1;}
.v4-contact .form label{display:block;font-size:.72rem;font-weight:600;color:rgba(234,241,250,.75);margin-block-end:6px;}
.v4-contact .form input,.v4-contact .form select,.v4-contact .form textarea{inline-size:100%;box-sizing:border-box;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:13px 14px;font:inherit;font-size:.88rem;color:#fff;transition:border-color .3s,background .3s;}
.v4-contact .form select option{color:var(--navy);}
.v4-contact .form input:focus,.v4-contact .form select:focus,.v4-contact .form textarea:focus{outline:none;border-color:var(--cyan);background:rgba(255,255,255,.1);}
.v4-contact .form textarea{min-block-size:96px;resize:vertical;}
.v4-contact .form .btn{inline-size:100%;margin-block-start:18px;}
.v4-contact .form-errors{background:rgba(255,255,255,.08);border:1px solid rgba(255,120,120,.5);border-radius:12px;padding:14px 16px;margin-block-end:18px;font-size:.82rem;}
.v4-contact .form-errors ul{margin:8px 0 0;display:flex;flex-direction:column;gap:4px;}
@media (max-width:1080px){.v4-contact .contact-grid{grid-template-columns:1fr;}}
@media (max-width:640px){.v4-contact .fgrid,.v4-contact .oc-btns{grid-template-columns:1fr;}}

/* Floating sidebar (x-sticky-cta) — same look as the live site's
   partials/sticky_social: right edge, slides out on hover. */
.sticky-actions{position:fixed;top:50%;right:0;transform:translateY(-50%);display:flex;flex-direction:column;gap:6px;z-index:99;direction:ltr;}
.sticky-actions a{display:flex;align-items:center;text-decoration:none;color:#fff;white-space:nowrap;border-radius:50px 0 0 50px;box-shadow:-2px 4px 16px rgba(0,0,0,.18);transform:translateX(calc(100% - 52px));transition:transform .35s cubic-bezier(.4,0,.2,1),box-shadow .25s;will-change:transform;}
.sticky-actions .sa-icon{width:52px;height:52px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .35s cubic-bezier(.4,0,.2,1);}
.sticky-actions .sa-icon .icon{width:20px;height:20px;}
.sticky-actions .sa-label{padding:0 18px 0 6px;font-size:.8rem;font-weight:700;font-family:'Montserrat',sans-serif;letter-spacing:.03em;}
.sticky-actions a:hover,.sticky-actions a:focus-visible{transform:translateX(0);box-shadow:-4px 6px 22px rgba(0,0,0,.24);}
.sticky-actions a:hover .sa-icon{transform:rotate(360deg);}
.sticky-actions .sa-wa{background:#25D366;}
.sticky-actions .sa-call{background:linear-gradient(135deg,#3467A7 0%,#1CAADD 100%);}
.sticky-actions .sa-loc{background:linear-gradient(135deg,#e53935 0%,#ff5252 100%);}
@media (max-width:640px){.sticky-actions{display:none !important;}}

/* <x-page-hero> stats row (home-v4.css styles the homepage copy). */
.v4-page-hero .stats{display:flex;flex-wrap:wrap;gap:clamp(18px,3vw,40px);border-block-start:1px solid var(--line-d);}
.v4-page-hero .stat b{display:block;font-family:var(--f-d);font-size:clamp(1.35rem,2vw,1.7rem);font-weight:400;letter-spacing:-.02em;line-height:1.1;color:#fff;}
.v4-page-hero .stat > span{display:block;margin-block-start:4px;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(234,241,250,.52);}

/* /candidate-profiles on phones: shorter hero, compact cards (small photo
   beside name/nationality/salary, details + actions full width below). */
@media (max-width:640px){
  body.v4 #profiles-page .v4-page-hero .stats{display:none;}
  body.v4 #profiles-page .p-card{display:grid;grid-template-columns:96px minmax(0,1fr);column-gap:12px;padding:12px;align-items:start;min-height:0;}
  body.v4 #profiles-page .p-card-head{min-height:0;height:120px;border-radius:12px;grid-row:1;grid-column:1;}
  body.v4 #profiles-page .p-card-photo{height:100%;}
  body.v4 #profiles-page .p-card-badges{transform:scale(.58);transform-origin:top left;}
  html[dir="rtl"] body.v4 #profiles-page .p-card-badges{transform-origin:top right;}
  body.v4 #profiles-page .p-card-body{display:contents;}
  body.v4 #profiles-page .p-card-head-row{grid-row:1;grid-column:2;flex-direction:column;align-items:flex-start;gap:8px;padding:0;margin:0;}
  body.v4 #profiles-page .p-card-body > :not(.p-card-head-row){grid-column:1/-1;margin-inline:0;}
  body.v4 #profiles-page .p-card-details{margin-block-start:12px;}
}

/* Contact layout: heading + map (stretches) | office card above the form,
   so both columns end level. Phones: heading, office, form, then map. */
.v4-contact .contact-grid{align-items:stretch;}
.v4-contact .ct-side{display:flex;flex-direction:column;}
.v4-contact .ct-side .map-frame{flex:1 1 auto;display:flex;min-block-size:240px;margin-block-start:26px;}
.v4-contact .ct-side .map-frame iframe{block-size:auto;flex:1 1 auto;min-block-size:240px;}
.v4-contact .ct-main{display:flex;flex-direction:column;gap:18px;}
.v4-contact .ct-main .office-card{margin-block-start:0;}
@media (max-width:1080px){
  .v4-contact .ct-side,.v4-contact .ct-main{display:contents;}
  .v4-contact .ct-side .head{order:1;}
  .v4-contact .ct-main .office-card{order:2;}
  .v4-contact .ct-main .form{order:3;}
  .v4-contact .ct-side .map-frame{order:4;margin-block-start:0;flex:none;}
  .v4-contact .ct-side .map-frame iframe{block-size:260px;}
  .v4-contact .ct-side .map-link{order:5;margin-block-start:-8px;}
  .v4-contact .contact-grid{gap:18px;}
}

/* Unified page width: legacy section containers on V4 pages (full-time,
   maid-visa, …) and the /candidate-profiles layout use the homepage's
   .wrap width and gutter. */
body.v4 main > section > .container,
body.v4 .page-services > section > .container,
body.v4 main > .trust-strip > .container{max-width:var(--maxw);padding-inline:var(--gut);margin-inline:auto;box-sizing:border-box;}
body.v4 #profiles-page .main-layout{max-width:var(--maxw);padding-inline:var(--gut);margin-inline:auto;box-sizing:border-box;}
/* Legacy section{padding-inline:5%} must not narrow the shared contact band. */
body.v4 section.v4-contact{padding-inline:0;}

/* <x-page-hero bgImage>: page image behind a navy overlay (blog posts). */
.v4-page-hero.has-bg{background:linear-gradient(100deg,rgba(11,30,54,.94) 0%,rgba(11,30,54,.82) 45%,rgba(11,30,54,.55) 100%),var(--ph-bg) center/cover no-repeat,var(--navy);padding-block:clamp(56px,7vw,110px) clamp(44px,5.5vw,80px);}
html[dir="rtl"] .v4-page-hero.has-bg{background:linear-gradient(260deg,rgba(11,30,54,.94) 0%,rgba(11,30,54,.82) 45%,rgba(11,30,54,.55) 100%),var(--ph-bg) center/cover no-repeat,var(--navy);}
.v4-page-hero.has-bg .v4-page-intro{max-inline-size:720px;}
.v4-page-extra{margin-block-start:22px;display:flex;flex-direction:column;gap:16px;}
.v4-page-extra .ph-meta{display:flex;flex-wrap:wrap;gap:18px;font-size:.82rem;color:rgba(234,241,250,.75);}
.v4-page-extra .ph-meta i{margin-inline-end:6px;color:var(--cyan);}
.v4-page-extra .ph-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;}
.v4-page-extra .ph-back{display:inline-flex;align-items:center;gap:8px;color:#fff;text-decoration:none;font-size:.84rem;font-weight:600;padding:10px 16px;border:1px solid rgba(255,255,255,.25);border-radius:999px;}
.v4-page-extra .ph-back:hover{background:rgba(255,255,255,.08);}
.v4-page-extra .ph-share{display:flex;gap:8px;}
.v4-page-extra .ph-share a,.v4-page-extra .ph-share button{inline-size:38px;block-size:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);color:#fff;cursor:pointer;text-decoration:none;font-size:.9rem;}
.v4-page-extra .ph-share a:hover,.v4-page-extra .ph-share button:hover{background:var(--cyan);border-color:var(--cyan);}