/* Live Dubai: phone and small-tablet layer.
 * Desktop is untouched: everything sits inside max-width media queries, apart from
 * grid minimums that are capped at 100% so columns can never be wider than the screen.
 * Collapsing is done by mobile.js adding classes; all text stays in the HTML. */

.grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--min,280px)),1fr))}
.form{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.ag-tables,.ag-people{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.ag-gallery{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.hub-tiles{grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))}
.m-bar{display:none}
button.m-acc-btn{all:unset;display:inline;cursor:text}
.m-row-btn{all:unset;display:inline}
.m-more-btn,.m-all-btn,.m-swipe-hint{display:none}
/* Tables in plain pages (privacy policy) */
.prose table{width:100%;border-collapse:collapse;margin:0 0 1.4em;font-size:16px;line-height:1.5;background:#FFFFFF;border:1px solid #E3E7EC;border-radius:14px;overflow:hidden}
.prose th,.prose td{padding:12px 14px;text-align:left;vertical-align:top;border-bottom:1px solid #E3E7EC}
.prose thead th{background:#163351;color:#FFFFFF;font-weight:400}
.prose tbody tr:last-child td{border-bottom:0}
@media (max-width:767px){.prose table{display:block;overflow-x:auto;font-size:15px}.prose th,.prose td{min-width:140px}}

/* ---------- Header and menu (up to 960px) ---------- */
@media (max-width:960px){
	.ldi-util{display:none}
	.ldi-hdr{position:sticky!important;top:0;z-index:70!important;transition:transform .28s ease,box-shadow .28s ease}
	.ldi-hdr.m-hide{transform:translateY(-101%)}
	.ldi-hdr.m-shadow{box-shadow:0 6px 18px rgba(13,31,51,.08)}
	.ldi-hdr-row{padding:10px 16px!important;flex-wrap:nowrap!important;column-gap:12px!important;min-height:64px}
	.ldi-logo{gap:10px!important}
	.ldi-logo svg{width:38px;height:36px}
	.ldi-logo>span>span:first-child{font-size:18px!important}
	.ldi-logo>span>span:last-child{font-size:8px!important;margin-top:5px!important}
	.ldi-hdr-cta{display:none!important}
	.ldi-hdr .m-menu-btn{display:inline-flex;align-items:center;gap:8px;margin-left:auto;min-height:44px;min-width:44px;padding:0 14px;border-radius:12px;border:1px solid #C3CBD4;background:#FFFFFF;color:#163351;font:inherit;font-size:16px;font-weight:500;cursor:pointer}
	.m-menu-btn:focus-visible{outline:3px solid #E3BF20;outline-offset:2px}
	.m-menu-btn path{transition:transform .2s ease,opacity .2s ease;transform-origin:12px 12px}
	.m-menu-btn[aria-expanded="true"] .m-l1{transform:translateY(5px) rotate(45deg)}
	.m-menu-btn[aria-expanded="true"] .m-l2{opacity:0}
	.m-menu-btn[aria-expanded="true"] .m-l3{transform:translateY(-5px) rotate(-45deg)}
	.ldi-nav{display:none;position:fixed;left:0;right:0;top:var(--m-hdr-h,64px);bottom:0;overflow-y:auto;overscroll-behavior:contain;background:#F7F7F7;padding:4px 16px calc(28px + env(safe-area-inset-bottom));flex:none!important;z-index:69;border-top:1px solid #E3E7EC}
	.ldi-hdr.is-open .ldi-nav{display:block}
	.ldi-hdr.is-open{transform:none}
	.ldi-nav-list{flex-direction:column;align-items:stretch!important;gap:0!important;font-size:19px!important}
	.ldi-nav-list>a,.ldi-dd>summary{display:flex!important;justify-content:space-between;align-items:center;min-height:54px;padding:12px 4px!important;border-bottom:1px solid #E3E7EC;white-space:normal!important}
	.ldi-nav-list .ldi-on{box-shadow:none;color:#7E6106}
	.ldi-dd-panel{position:static!important;min-width:0!important;box-shadow:none!important;border:0!important;background:transparent!important;padding:2px 0 10px 10px!important;margin:0!important}
	.ldi-dd-panel a{padding:10px 8px!important;font-size:17px}
	.ldi-dd-panel small{font-size:14px}
	.ldi-nav .ldi-nav-extra{display:flex;flex-direction:column;gap:12px;margin-top:18px}
	.ldi-nav-util{display:flex;flex-wrap:wrap;gap:4px 24px;font-size:17px}
	.ldi-nav-util a{display:inline-flex;align-items:center;min-height:44px;color:#163351;text-decoration:none}
	.ldi-nav-extra .btn{width:100%}
	.ldi-nav-offices{margin:8px 0 0;display:flex;flex-direction:column;gap:6px;color:#4B5A6A;font-size:15px}
	.ldi-nav-offices a{color:#163351}
	html.m-lock,html.m-lock body{overflow:hidden}
	.hub-nav,.ag-nav,.m-secnav{top:var(--m-top,0px)!important;transition:top .28s ease}
	[id].hub-anchor,.hub-anchor[id],main section[id],.m-acc-body,.m-sec-target{scroll-margin-top:calc(var(--m-hdr-h,64px) + 56px)}
	/* The theme's floating WhatsApp button gives way to the bottom bar. */
	.ldi>a[href^="https://wa.me"][style*="position: fixed"]{display:none!important}
}

/* ---------- Phones (up to 767px) ---------- */
@media (max-width:767px){
	.ldi{font-size:16.5px}
	.sec{padding:44px 16px}
	.sec-sm{padding:32px 16px}
	main#top>section{padding-top:44px!important;padding-bottom:44px!important;padding-left:16px!important;padding-right:16px!important}
	main#top>section:first-child{padding-top:22px!important}
	.h1,main h1{font-size:clamp(30px,8.4vw,36px)!important;line-height:1.12!important}
	main#top h1 span{white-space:normal!important}
	.h2,main#top h2{font-size:clamp(26px,7vw,30px)!important;line-height:1.18!important}
	.h3{font-size:22px}
	.h4{font-size:19px}
	.lead{font-size:17px;margin-top:14px}
	.eyebrow{font-size:15px;margin-bottom:10px}
	.hub-intro{font-size:17px}
	.hub-h3{font-size:20px}
	.head,.ag-sec-head{margin-bottom:22px;gap:12px 24px}
	.crumbs{margin-bottom:14px;font-size:13px}
	.card,.card-soft{padding:20px;border-radius:18px}
	.card-gold{padding:18px}
	.btns{gap:10px 18px}
	.btns>.btn{flex:1 1 auto}
	.btn{min-height:50px;padding:0 20px}
	.stat{font-size:34px}
	.row{--gap:28px}
	.prose{font-size:17px}
	.prose h2{font-size:24px;margin-top:1.2em}
	.faq summary{font-size:18px;padding:16px 0}
	.ag-faq summary{font-size:17.5px}
	.hub-table{font-size:15px}

	/* Bottom contact bar */
	.m-bar{display:flex;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.97);backdrop-filter:blur(8px);border-top:1px solid #E3E7EC;box-shadow:0 -6px 20px rgba(13,31,51,.08);transition:transform .25s ease;font-family:'Jost','Futura','Century Gothic',sans-serif}
	.m-bar.m-off{transform:translateY(110%)}
	.m-bar a{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:12px;font-size:16px;font-weight:500;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
	.m-bar-wa{flex:0 0 auto;padding:0 16px;border:1px solid #163351;color:#163351;background:#FFFFFF}
	.m-bar-wa svg{color:#1E8E4E}
	.m-bar-cta{flex:1 1 auto;min-width:0;padding:0 14px;background:#E3BF20;color:#163351}
	body.m-has-bar .ldi>footer{padding-bottom:calc(96px + env(safe-area-inset-bottom))!important}
	.joinchat{display:none!important}

	/* Homepage hero: shorter photo, search fields two to a row */
	main#top>section:first-child>div>div:nth-child(2){padding:14px 14px 0 0!important}
	main#top>section:first-child>div>div:nth-child(2) img{aspect-ratio:16/10!important}
	main#top>section:first-child>div>div:nth-child(2)>div[aria-hidden]{border-width:8px!important;bottom:30px!important;border-radius:22px!important}
	main#top>section:first-child>div{gap:28px!important}
	main#top>section:first-child p{margin-top:16px!important}
	main#top form[data-search]{margin-top:22px!important;padding:16px!important}
	main#top form[data-search]>div:nth-of-type(2){grid-template-columns:1fr 1fr!important;gap:12px!important}
	main#top form[data-search] button[type=submit]{grid-column:1/-1}
	main#top form[data-search] label{min-width:0}
	main#top form[data-search] select{width:100%;min-width:0}
	main#top>section>div>div[style*="margin-bottom"]{margin-bottom:24px!important}

	/* Inline grids with wide minimum columns: one column on phones */
	main [style*="minmax(3"],main [style*="minmax(4"],main [style*="minmax(5"]{grid-template-columns:minmax(0,1fr)!important}
	#care div[style*="display: flex"]:has(>img){overflow:hidden;max-width:100%}

	/* Long homepage link list of areas */
	#areas ul{grid-template-columns:1fr!important}
	#areas ul a{font-size:19px!important;padding:14px 0!important}

	/* Area guides index: compact cards with a small photo */
	[data-chip-target]>a.card{flex-direction:row!important;align-items:stretch;gap:0!important;min-height:112px}
	[data-chip-target]>a.card>:first-child{flex:0 0 112px;width:112px;aspect-ratio:auto!important;height:auto!important;min-height:112px;border-radius:0!important;object-fit:cover}
	[data-chip-target]>a.card>:first-child .ph-label{display:none}
	[data-chip-target]>a.card>div:last-child{padding:12px 14px!important;gap:4px!important;min-width:0}
	[data-chip-target]>a.card h2{font-size:19px!important}
	[data-chip-target]>a.card p{font-size:14.5px!important;line-height:1.4}
	[data-chip-target]>a.card>div:last-child>span:last-child{border-top:0!important;padding-top:2px!important;font-size:14px!important}
	[data-chip-target]:has(>a.card){gap:12px!important}

	/* Team: photos two to a row, people with bios side by side */
	.m-team{grid-template-columns:1fr 1fr!important;gap:22px 14px!important}
	.m-team img{aspect-ratio:4/5;height:auto!important;max-height:none!important}
	.m-team h3,.m-team .h4{font-size:17px!important}
	article.card>img[style*="width: 140px"]{width:96px!important;height:120px!important}

	/* Framed portrait photos (About, homepage): text first, shorter photo */
	main>section:first-child .row>div:has(>img.photo){order:2}
	div:has(>div[aria-hidden][style*="solid #E3BF20"]):has(>img){padding:0 0 12px 12px!important;max-width:100%!important;flex-basis:100%!important}
	div:has(>div[aria-hidden][style*="solid #E3BF20"])>img{aspect-ratio:4/3!important}
	div[aria-hidden][style*="10px solid #E3BF20"]{border-width:7px!important;top:40px!important}
	.ag-nav .wrap{padding:0 16px}

	/* Area guide hero photo and stats */
	.ag-hero-media img{aspect-ratio:16/10}
	.ag-hero{gap:22px}
	.ag-stats{margin-top:22px;gap:10px}
	.ag-stat{padding:14px}
	.ag-stat-n{font-size:24px}
	.ag-stat-l{font-size:15px}
	.ag-map{min-height:300px;height:52vh}
	.ag-dist{padding:18px}

	/* Golden Visa / UK hub service cards: two to a row */
	.m-pillars{grid-template-columns:1fr 1fr!important;gap:10px!important}
	.m-pillars>.hub-pillar{padding:16px;gap:8px;border-radius:16px}
	.m-pillars>.hub-pillar .eyebrow{font-size:11.5px;letter-spacing:.04em}
	.m-pillars>.hub-pillar h3,.m-pillars>.hub-pillar .h4{font-size:17px;line-height:1.25}
	.m-pillars>.hub-pillar p{display:none}
	.m-pillars>.hub-pillar a{font-size:15px}
	.hub-stats{grid-template-columns:1fr 1fr;border-radius:18px}
	.hub-stat{padding:18px 16px}
	.hub-stat .stat{font-size:28px}
	.hub-stat p{font-size:14.5px}
	.hub-stat small{font-size:12px}
	.hub-nav ul,.ag-nav ul{padding-left:2px;gap:6px 22px}
	.hub-nav a,.ag-nav a{padding:12px 0;font-size:15px}
	.hub-nav a.is-on,.ag-nav a.is-on,.m-secnav a.is-on{border-bottom-color:#E3BF20;font-weight:500}
	.hub-chips{--min:200px}
	.hub-chips li{padding:12px 14px;font-size:15px}
	.hub-flow li{padding:14px 16px}
	.hub-steps li{padding-bottom:16px}
	.hub-journey a,.hub-journey span.hub-j{min-height:44px;padding:0 16px;font-size:16px}

	/* Generic section jump bar built by mobile.js */
	.m-secnav{position:sticky;z-index:30;background:rgba(247,247,247,.97);backdrop-filter:blur(6px);border-top:1px solid #E3E7EC;border-bottom:1px solid #E3E7EC}
	.m-secnav ul{list-style:none;margin:0;padding:0 16px;display:flex;gap:22px;overflow-x:auto;white-space:nowrap;scrollbar-width:none}
	.m-secnav ul::-webkit-scrollbar{display:none}
	.m-secnav a{display:inline-block;padding:12px 0;color:#163351;text-decoration:none;font-size:15px;border-bottom:2px solid transparent}

	/* Accordion panels */
	.m-acc{border-top:1px solid #DCE1E7;margin:0}
	.m-acc:last-of-type{border-bottom:1px solid #DCE1E7}
	.m-acc+.m-acc{border-top:1px solid #DCE1E7}
	.m-acc>.m-acc-h{margin:0!important}
	button.m-acc-btn{all:unset;box-sizing:border-box;display:flex;width:100%;justify-content:space-between;align-items:center;gap:16px;min-height:56px;padding:14px 2px;cursor:pointer;font:inherit;font-size:18px;font-weight:400;line-height:1.3;color:inherit;-webkit-tap-highlight-color:transparent}
	button.m-acc-btn::after{content:'+';flex:none;font-size:26px;font-weight:300;line-height:1;color:#7E6106}
	button.m-acc-btn[aria-expanded="true"]::after{content:'\2212'}
	button.m-acc-btn:focus-visible,.m-row-btn:focus-visible,.m-more-btn:focus-visible,.m-all-btn:focus-visible{outline:3px solid #E3BF20;outline-offset:2px;border-radius:6px}
	.m-acc-body{padding:0 0 18px}
	.m-acc-body:not(.is-open){display:none}
	.bg-navy .m-acc,.bg-navy .m-acc+.m-acc{border-color:rgba(255,255,255,.2)}
	.bg-navy button.m-acc-btn::after{color:#E3BF20}
	/* A card that collapses keeps its card look */
	.m-card-acc{padding-top:4px!important;padding-bottom:4px!important}
	.m-card-acc>.m-acc-h{margin:0!important}
	.m-card-acc>.m-acc-body{padding-bottom:14px}
	.m-card-acc>.m-acc-h button.m-acc-btn{min-height:52px;font-size:18px}
	.m-group{margin-top:22px}

	/* Table rows that open */
	table.m-stack,table.m-stack tbody,table.m-stack tr,table.m-stack th,table.m-stack td{display:block;width:auto!important;min-width:0!important}
	table.m-stack{min-width:0!important}
	table.m-stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
	.hub-table-wrap:has(table.m-stack){overflow:visible;border-radius:16px}
	table.m-stack tr{border-bottom:1px solid #E3E7EC}
	table.m-stack tr:last-child{border-bottom:0}
	table.m-stack tbody th{background:transparent!important;width:auto!important;padding:0!important;border:0!important}
	.m-row-btn{all:unset;box-sizing:border-box;display:flex;width:100%;justify-content:space-between;align-items:center;gap:14px;min-height:52px;padding:12px 16px;cursor:pointer;font:inherit;font-weight:500;color:#163351;line-height:1.35}
	.m-row-btn::after{content:'+';flex:none;font-size:24px;font-weight:300;color:#7E6106}
	.m-row-btn[aria-expanded="true"]::after{content:'\2212'}
	table.m-stack td{display:none;border:0!important;padding:4px 16px 12px!important}
	table.m-stack tr.is-open td{display:block}
	table.m-stack td::before{content:attr(data-label);display:block;font-size:13px;font-weight:500;letter-spacing:.02em;color:#7E6106;margin-bottom:2px}
	table.m-stack tr.is-open{background:#FBFBFC}

	/* Read more */
	.m-more-wrap:not(.is-open)>.m-more-rest{display:none}
	.m-clamp:not(.is-open){display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
	.m-more-btn,.m-all-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin:4px 0 0;padding:0;background:none;border:0;font:inherit;font-size:16px;font-weight:500;color:#163351;cursor:pointer;text-decoration:underline;text-decoration-color:#E3BF20;text-decoration-thickness:2px;text-underline-offset:6px}
	.bg-navy .m-more-btn,.bg-navy .m-all-btn{color:#FFFFFF}
	.m-more-btn::after,.m-all-btn::after{content:'';width:7px;height:7px;border-right:1.6px solid #7E6106;border-bottom:1.6px solid #7E6106;transform:rotate(45deg) translateY(-3px)}
	.m-more-btn[aria-expanded="true"]::after,.m-all-btn[aria-expanded="true"]::after{transform:rotate(-135deg) translateY(-1px)}

	/* Show the first few */
	.m-limit:not(.m-all)>.m-x{display:none!important}

	/* Swipe rows */
	.m-swipe{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px!important;margin-left:-16px!important;margin-right:-16px!important;padding:0 16px 10px!important;scroll-padding:0 16px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
	.m-swipe::-webkit-scrollbar{display:none}
	.m-swipe>*{flex:0 0 min(80%,320px)!important;scroll-snap-align:start;min-width:0}
	.m-swipe.m-swipe-photos>*{flex-basis:86%!important}
	.m-swipe-hint{display:flex;justify-content:space-between;align-items:center;margin:2px 0 0;font-size:14px;color:#4B5A6A}
	.m-swipe-hint b{font-weight:500;color:#163351}

	/* Compact card lists (services, steps) */
	.m-compact{gap:10px!important}
	.m-compact>*{padding:14px 16px!important;border-radius:14px!important;gap:4px!important}
	.m-compact>.m-ic{display:grid!important;grid-template-columns:auto 1fr;align-items:start;column-gap:14px;row-gap:2px!important}
	.m-compact>.m-ic>.icon,.m-compact>.m-ic>.num{grid-row:1/span 3;width:40px;height:40px;border-radius:12px;font-size:15px}
	.m-compact>*>.num{border-radius:50%;box-shadow:0 0 0 4px rgba(227,191,32,.22)}
	.m-compact>*>.icon svg{width:20px;height:20px}
	.m-compact>*>h3,.m-compact>*>.h4{font-size:17.5px!important;margin:0!important;align-self:center}
	.m-compact>*>p{margin:0!important;font-size:15px!important;line-height:1.45}
}

/* Phone sizing pass (7 Oct, after review on iPhone): smaller stats, pills, step numbers and photos */
@media (max-width:767px){
	main dl.grid:has(dt),main dl[style*="grid-template-columns"]{grid-template-columns:1fr 1fr!important;gap:18px 16px!important;margin-top:24px!important}
	main dl dt.stat,main dl dt[style*="font-size"]{font-size:28px!important;line-height:1.05!important}
	main dl dd{font-size:14.5px!important;line-height:1.4!important;margin-top:4px!important}
	main .stat{font-size:30px}
	main [style*="font-size: clamp(64px"],main [style*="font-size: clamp(56px"],main [style*="font-size: clamp(60px"],main [style*="font-size: 64px"],main [style*="font-size: 72px"]{font-size:44px!important}
	.pills{gap:8px}
	.pill{padding:5px 12px;font-size:14px}
	.card-gold.shadow{padding:20px!important}
	button[data-car-go]{min-height:40px!important;padding:0 14px!important;font-size:14.5px!important}
	.track .num,main .num{width:36px!important;height:36px!important;font-size:15px!important;box-shadow:0 0 0 5px rgba(227,191,32,.22)!important}
	.track>li[aria-roledescription="slide"]{flex-basis:280px!important}
	.track>li[aria-roledescription="slide"] .card-gold{margin-top:16px!important;padding:16px!important}
	main#top article.m-card-acc{display:grid!important;grid-template-columns:auto 1fr;align-items:center;column-gap:12px;padding:10px 16px!important}
	main#top article.m-card-acc>:first-child:not(.m-acc-h){width:32px!important;height:32px!important;min-width:0!important;font-size:14px!important;padding:0!important;display:flex!important;align-items:center;justify-content:center;border-radius:10px!important}
	main#top article.m-card-acc>.m-acc-h{font-size:17.5px!important}
	main#top article.m-card-acc>.m-acc-body{grid-column:1/-1}
	div:has(>div[aria-hidden][style*="solid #E3BF20"])>img{aspect-ratio:3/2!important;object-position:center 22%!important}
	main h2[style*="font-size: clamp(36px"],main h2[style*="font-size: clamp(34px"]{font-size:28px!important}
}

@media (max-width:380px){
	.m-pillars{grid-template-columns:1fr!important}
	.m-bar-wa span{display:none}
	.m-bar-wa{padding:0 14px}
	.hub-stats{grid-template-columns:1fr}
	main#top form[data-search]>div:nth-of-type(2){grid-template-columns:1fr!important}
}

@media (prefers-reduced-motion:reduce){
	.ldi-hdr,.m-bar,.hub-nav,.ag-nav,.m-secnav,.m-menu-btn path{transition:none!important}
	.m-swipe{scroll-behavior:auto}
}
