/* ---- Meet Popup — TNCFlow Development & AI branding ---- */
.mpop{
	--mpop-primary:#525fe8;
	--mpop-primary-soft:#eef0fd;
	--mpop-ink:#0f172a;
	--mpop-body:#475569;
	--mpop-line:#e5e7eb;
	--mpop-bg:#f5f5f5;
	--mpop-display:"Bricolage Grotesque",system-ui,sans-serif;
	--mpop-sans:"Inter Tight",system-ui,sans-serif;
	--mpop-ui:"Inter",system-ui,sans-serif;
	--mpop-ease:cubic-bezier(.22,1,.36,1);
	position:fixed;
	inset:0;
	z-index:999999;
	background:radial-gradient(ellipse 70% 45% at 50% -12%,rgba(82,95,232,.16),rgba(82,95,232,0) 70%),var(--mpop-bg);
	color:var(--mpop-ink);
	font-family:var(--mpop-sans);
	font-size:16px;
	line-height:1.5;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
	opacity:0;
	visibility:hidden;
	transition:opacity .35s var(--mpop-ease),visibility 0s linear .35s;
}
.mpop.is-open{
	opacity:1;
	visibility:visible;
	transition:opacity .35s var(--mpop-ease),visibility 0s;
}
.mpop:focus{outline:0}
.mpop *,.mpop *::before,.mpop *::after{box-sizing:border-box}

.mpop__scroller{
	position:absolute;
	inset:0;
	overflow-y:auto;
	overscroll-behavior:contain;
	-webkit-overflow-scrolling:touch;
}
.mpop__inner{
	width:100%;
	max-width:860px;
	margin:0 auto;
	padding:96px 24px 80px;
	transform:translateY(16px);
	transition:transform .5s var(--mpop-ease);
}
.mpop.is-open .mpop__inner{transform:none}

/* Header: title + description */
.mpop__head{
	margin:0 0 40px;
	text-align:center;
}
.mpop__eyebrow{
	display:inline-flex;
	align-items:center;
	gap:10px;
	padding:6px 14px 6px 12px;
	background:#fff;
	border:1px solid #e6e7eb;
	border-radius:999px;
	font:500 14px/1.5 var(--mpop-sans);
	letter-spacing:.14px;
	color:var(--mpop-body);
}
.mpop__eyebrow::before{
	content:"";
	flex:none;
	width:8px;
	height:8px;
	border-radius:50%;
	background:var(--mpop-primary);
	box-shadow:0 0 0 4px rgba(82,95,232,.15);
}
.mpop .mpop__title{
	margin:20px 0 0;
	padding:0;
	font:700 clamp(36px,5vw,56px)/1.05 var(--mpop-display);
	font-variation-settings:"opsz" 12;
	letter-spacing:-.03em;
	text-transform:none;
	color:var(--mpop-ink);
}
.mpop__head > .mpop__title:first-child{margin-top:0}
.mpop .mpop__text{
	max-width:560px;
	margin:20px auto 0;
	padding:0;
	font:400 18px/1.5 var(--mpop-sans);
	color:var(--mpop-body);
}
.mpop .mpop__text a{color:var(--mpop-primary)}
.mpop .mpop__features{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:10px 24px;
	margin:24px 0 0;
	padding:0;
	list-style:none;
}
.mpop .mpop__feature{
	display:inline-flex;
	align-items:center;
	gap:8px;
	margin:0;
	padding:0;
	list-style:none;
	font:500 15px/1.5 var(--mpop-sans);
	color:var(--mpop-ink);
}
.mpop__feature svg{
	flex:none;
	color:var(--mpop-primary);
}

/* Close */
.mpop .mpop__close{
	-webkit-appearance:none;
	appearance:none;
	position:absolute;
	top:24px;
	right:28px;
	z-index:2;
	display:flex;
	align-items:center;
	justify-content:center;
	width:44px;
	height:44px;
	margin:0;
	padding:0;
	border:1px solid var(--mpop-line);
	border-radius:50%;
	background:#fff;
	box-shadow:0 1px 2px rgba(15,23,42,.06);
	color:var(--mpop-ink);
	cursor:pointer;
	transition:background-color .3s var(--mpop-ease),border-color .3s var(--mpop-ease),color .3s var(--mpop-ease),transform .3s var(--mpop-ease);
}
.mpop .mpop__close:hover{
	background:var(--mpop-ink);
	border-color:var(--mpop-ink);
	color:#fff;
	transform:rotate(90deg);
}
.mpop .mpop__close:focus-visible{
	outline:2px solid var(--mpop-primary);
	outline-offset:3px;
}

/* Form: brand colours on top of the booking form's own styles */
.mpop .gform_wrapper{
	max-width:780px;
	margin-left:auto;
	margin-right:auto;
}
.mpop .tnca-booking-form_wrapper,
.mpop .tnca-picker{
	--tnca-accent:var(--mpop-primary);
	--tnca-ink:var(--mpop-ink);
	--tnca-text:var(--mpop-ink);
	--tnca-muted:#64748b;
	--tnca-line:var(--mpop-line);
}
body .mpop .gform_wrapper.tnca-booking-form_wrapper{
	border-color:var(--mpop-line);
	box-shadow:0 1px 2px rgba(15,23,42,.04),0 24px 60px -28px rgba(15,23,42,.22);
	font-family:var(--mpop-sans);
}
body .mpop .gform_wrapper.tnca-booking-form_wrapper .gf_page_steps .gf_step_label{font-family:var(--mpop-display)}
body .mpop .gform_wrapper .gform_footer .button,
body .mpop .gform_wrapper .gform_footer input[type=submit],
body .mpop .gform_wrapper .gform_page_footer .button{
	border-radius:6px;
	font-family:var(--mpop-ui);
	letter-spacing:-.32px;
	transition:background-color .3s var(--mpop-ease),border-color .3s var(--mpop-ease),color .3s var(--mpop-ease),box-shadow .3s var(--mpop-ease);
}
body .mpop .gform_wrapper .gform_footer .button:not(.gform_previous_button):hover,
body .mpop .gform_wrapper .gform_footer input[type=submit]:hover,
body .mpop .gform_wrapper .gform_page_footer .button:not(.gform_previous_button):hover{
	background:var(--mpop-ink);
	border-color:var(--mpop-ink);
	filter:none;
}

/* Request a Quote: labels already end in "*", so hide Gravity Forms' "(Required)" like /request-a-quote/ does */
body .mpop--quote .gform_wrapper .gfield_required{display:none}

/* Confirmation card for forms without the booking plugin's own (e.g. Request a Quote) */
.mpop--quote .gform_confirmation_message{
	max-width:780px;
	margin:0 auto;
	padding:40px 36px;
	background:#fff;
	border:1px solid var(--mpop-line);
	border-radius:20px;
	box-shadow:0 1px 2px rgba(15,23,42,.04),0 24px 60px -28px rgba(15,23,42,.22);
	font:400 16px/1.6 var(--mpop-sans);
	color:var(--mpop-body);
	text-align:center;
}
.mpop--quote .gform_confirmation_message::before{
	content:"";
	display:block;
	width:56px;
	height:56px;
	margin:0 auto 16px;
	border-radius:50%;
	background:#dcfce7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%2316a34a'%3E%3Cpath d='M8.1 13.6 4.6 10l1.3-1.3 2.2 2.2 5.9-5.9 1.3 1.3z'/%3E%3C/svg%3E") center/30px no-repeat;
}

/* Scroll lock */
html.mpop-lock,
html.mpop-lock body{overflow:hidden!important}
html.mpop-lock body{padding-right:var(--mpop-sbw,0)}

@media (max-width:767px){
	.mpop__inner{padding:76px 16px 48px}
	.mpop__head{margin-bottom:28px}
	.mpop .mpop__title{font-size:clamp(32px,9vw,44px);letter-spacing:-.025em}
	.mpop .mpop__text{margin-top:16px;font-size:16px}
	.mpop .mpop__features{margin-top:20px;gap:8px 18px}
	.mpop .mpop__feature{font-size:14px}
	.mpop--quote .gform_confirmation_message{padding:28px 18px}
	.mpop .mpop__close{top:16px;right:16px;width:40px;height:40px}
}

@media (prefers-reduced-motion:reduce){
	.mpop,.mpop.is-open,.mpop__inner,.mpop .mpop__close{transition:none}
	.mpop__inner{transform:none}
	.mpop .mpop__close:hover{transform:none}
}
