/* IPM Core – Classic (1:1 Framer clone) runtime styles. The design itself lives in uploads/ipm-framer/framer.css. */

/* WordPress / Elementor chrome must not touch the cloned layout. */
.ipm-framer-body { margin: 0; background: #fff; }
.ipm-framer-body .ipm-mobilebar,
.ipm-framer-body .ipm-skip-link,
.ipm-framer-body .entry-title { display: none !important; }
.ipm-framer-body .elementor-widget-shortcode,
.ipm-framer-body .elementor-widget:not(:last-child) { margin-block-end: 0 !important; margin-bottom: 0 !important; }
.ipm-framer-body .e-con.ipm-framer-container {
	--padding-block-start: 0; --padding-block-end: 0; --padding-inline-start: 0; --padding-inline-end: 0;
	--margin-block-start: 0; --margin-block-end: 0; --width: 100%; --content-width: 100%;
	padding: 0; margin: 0; max-width: none; width: 100%;
}
.ipm-framer-body .elementor-location-header,
.ipm-framer-body .elementor-location-footer,
.ipm-framer-body .elementor { width: 100%; }
.ipm-framer-body .elementor img { height: auto; }

/* Root wrappers: the page root keeps Framer's inline min-height; header/footer roots collapse. */
.ipm-framer-root--header, .ipm-framer-root--footer, .ipm-framer-root--nav-open { min-height: 0 !important; }
.ipm-framer-root--nav-open { display: contents !important; }

/* Phone navigation: the captured "open" state is toggled by framer-clone.js. */
[data-ipm-nav="open"][hidden], .ipm-framer-header header[hidden] { display: none !important; }
[data-ipm-nav="open"] { position: fixed; }

/* Appear animations (Framer ships elements at opacity 0 and offsets them; the runtime fades them in). */
.ipm-framer-body .ipm-appear {
	opacity: 0 !important;
	transform: var(--ipm-appear-from, translateY(20px)) !important;
	filter: var(--ipm-appear-blur, none) !important;
	transition: opacity .75s cubic-bezier(.17,.67,.3,1), transform .75s cubic-bezier(.17,.67,.3,1), filter .75s cubic-bezier(.17,.67,.3,1);
}
.ipm-framer-body .ipm-appear.ipm-appear--in { opacity: 1 !important; transform: none !important; filter: none !important; }

/* Infinite scroll sentinel (the captured "Loading" spinner). */
.ipm-framer-more { display: block; width: 100%; height: 1px; grid-column: 1 / -1; flex-basis: 100%; margin: 0; overflow: visible; }
.ipm-framer-more [data-framer-name="Spinner"] { opacity: 1 !important; animation: ipm-spin 1s linear infinite; }
@keyframes ipm-spin { to { transform: rotate(360deg); } }

/* Contact form feedback */
.ipm-framer form[data-ipm-form].is-sent > * { opacity: .35; pointer-events: none; }
.ipm-framer form[data-ipm-form] .ipm-form-message { grid-column: 1 / -1; width: 100%; font: 500 16px/1.5 "Satoshi", "Manrope", sans-serif; color: #060e24; padding: 12px 0; }
.ipm-framer form[data-ipm-form].is-sent .ipm-form-message { opacity: 1; pointer-events: auto; }
.ipm-framer-body .skip-link { position: absolute !important; left: -9999px; top: 0; }
.ipm-framer-body .site-main { display: block; width: 100%; }

/* Same inherited defaults as the Framer page (UA defaults + Framer's own body reset). */
.ipm-framer-body, .ipm-framer-body .elementor { font-family: sans-serif; font-size: 12px; color: #000; line-height: normal; }
.ipm-framer p, .ipm-framer h1, .ipm-framer h2, .ipm-framer h3, .ipm-framer h4, .ipm-framer h5, .ipm-framer h6, .ipm-framer figure { margin: 0; }
.ipm-framer img { max-width: none; }

/* Pages that have no header / footer on the Framer site */
.ipm-no-footer .elementor-location-footer, .ipm-no-footer .ipm-framer-footer { display: none !important; }
.ipm-no-header .elementor-location-header, .ipm-no-header .ipm-framer-header { display: none !important; }

/* Careers: jobs whose deadline has passed stay listed, greyed out and tagged CLOSED */
.ipm-framer a.ipm-job-closed, .ipm-framer .ipm-job-closed a { filter: grayscale(1); opacity: .55; }
.ipm-framer a.ipm-job-closed:hover { opacity: .75; }
/* Deadline field on the cards: same look as the date box on the job page; closed postings show CLOSED above the date */
.ipm-framer .ipm-job-closed .ipm-job-date { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 18px; border-radius: 12px; background: rgba(12, 74, 119, .06); border: 1px solid rgba(12, 74, 119, .08); text-align: center; }
.ipm-framer .ipm-job-status { display: block; font-size: .8em; letter-spacing: .08em; text-transform: uppercase; color: #8a94a3; }
.ipm-framer [data-framer-name="project information"] .ipm-job-closed { opacity: .7; }

/* ---------- Navigation dropdowns (WordPress sub-menu items) ---------- */
.ipm-framer .ipm-has-children { position: relative; display: inline-flex; align-items: center; }
.ipm-framer .ipm-sub-toggle { appearance: none; background: none; border: 0; padding: 0 2px; margin: 0 0 0 -2px; cursor: pointer; color: inherit; display: inline-flex; align-items: center; line-height: 0; }
.ipm-framer .ipm-chevron { width: 14px; height: 14px; color: rgb(12, 74, 119); transition: transform .2s ease; }
.ipm-framer .ipm-has-children:hover > .ipm-sub-toggle .ipm-chevron,
.ipm-framer .ipm-has-children.is-open > .ipm-sub-toggle .ipm-chevron { transform: rotate(180deg); }
.ipm-framer .ipm-submenu { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(6px); padding-top: 14px; min-width: 240px; z-index: 30; opacity: 0; visibility: hidden; transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s; }
.ipm-framer .ipm-has-children:hover > .ipm-submenu,
.ipm-framer .ipm-has-children:focus-within > .ipm-submenu,
.ipm-framer .ipm-has-children.is-open > .ipm-submenu { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); transition-delay: 0s; }
.ipm-framer .ipm-submenu-inner { display: flex; flex-direction: column; gap: 2px; padding: 8px; background: rgba(255, 255, 255, .94); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border: 1px solid #fff; border-radius: 12px; box-shadow: 0 12px 32px rgba(24, 45, 92, .14), 0 1px 4px rgba(24, 45, 92, .12); }
.ipm-framer .ipm-submenu .ipm-menu-item { display: flex; width: 100%; order: 0 !important; }
.ipm-framer .ipm-submenu .ipm-menu-item > a { width: 100%; justify-content: flex-start; padding: 10px 14px; border-radius: 8px; transition: background-color .15s ease; }
.ipm-framer .ipm-submenu .ipm-menu-item > a:hover,
.ipm-framer .ipm-submenu .ipm-menu-current > a { background-color: rgba(12, 74, 119, .07); }
.ipm-framer .ipm-submenu .ipm-submenu { left: 100%; top: 0; transform: translateY(0); padding: 0 0 0 8px; } /* third level opens to the side */
.ipm-framer .ipm-submenu .ipm-has-children:hover > .ipm-submenu { transform: translateY(0); }
.ipm-framer .ipm-submenu .ipm-chevron { transform: rotate(-90deg); }

/* Phone menu: sub-menus expand in place under their parent (tap the arrow) */
[data-ipm-nav="open"] .ipm-has-children { display: flex; flex-wrap: wrap; justify-content: center; }
[data-ipm-nav="open"] .ipm-has-children > a { flex: 0 1 auto; }
[data-ipm-nav="open"] .ipm-sub-toggle { padding: 12px; margin: 0; }
[data-ipm-nav="open"] .ipm-chevron { width: 18px; height: 18px; }
[data-ipm-nav="open"] .ipm-submenu { position: static; transform: none; padding: 0; min-width: 0; width: 100%; opacity: 1; visibility: visible; display: none; transition: none; }
[data-ipm-nav="open"] .ipm-has-children.is-open > .ipm-submenu { display: block; }
[data-ipm-nav="open"] .ipm-has-children:hover > .ipm-submenu { display: none; }
[data-ipm-nav="open"] .ipm-has-children.is-open:hover > .ipm-submenu { display: block; }
[data-ipm-nav="open"] .ipm-submenu-inner { background: rgba(12, 74, 119, .05); border: 0; box-shadow: none; border-radius: 12px; padding: 6px 8px; margin: 4px 0 8px; }
[data-ipm-nav="open"] .ipm-submenu .ipm-menu-item > a { justify-content: center; padding: 10px 14px; }
[data-ipm-nav="open"] .ipm-submenu .ipm-menu-item p { font-size: 0.95em; }

/* Footer: children are listed under their parent */
.ipm-framer-footer .ipm-has-children { display: flex; flex-direction: column; align-items: flex-start; }
.ipm-framer-footer .ipm-sub-toggle { display: none; }
.ipm-framer-footer .ipm-submenu { position: static; transform: none; padding: 6px 0 0; min-width: 0; opacity: 1; visibility: visible; transition: none; }
.ipm-framer-footer .ipm-submenu-inner { background: none; border: 0; box-shadow: none; padding: 0; gap: 6px; -webkit-backdrop-filter: none; backdrop-filter: none; }
.ipm-framer-footer .ipm-submenu .ipm-menu-item > a { padding: 0; opacity: .8; font-size: .92em; }
.ipm-framer-footer .ipm-submenu .ipm-menu-item > a:hover { background: none; opacity: 1; }
/* The Framer header clips its children (overflow:hidden for the rounded corners) – let dropdowns escape it */
.ipm-framer-header header:has(.ipm-has-children),
.ipm-framer-header header:has(.ipm-has-children) *:has(.ipm-has-children) { overflow: visible !important; }
.ipm-framer-header .framer-12gkjic-container, .ipm-framer-header .ipm-framer-root--header, .ipm-framer-header .ssr-variant { overflow: visible !important; }

/* ---------- Scroll animations (AOS) ----------
   Framer puts inline opacity/transform on most elements, so the hidden states need !important.
   The visible state is simply the element's own style (no override), reached through the AOS transition. */
html.ipm-aos .ipm-framer [data-ipm-appear]:not(.aos-animate):not(.ipm-shown) { opacity: 0 !important; } /* pre-hide what Framer reveals, before JS runs */
html.ipm-aos .ipm-framer [data-aos^="ipm-"] { transition-property: opacity, transform, filter; }
html.ipm-aos .ipm-framer [data-aos^="ipm-"]:not(.aos-animate) { opacity: 0 !important; will-change: opacity, transform; }
html.ipm-aos .ipm-framer [data-aos="ipm-reveal"]:not(.aos-animate) { transform: translate3d(0, 40px, 0) !important; }
html.ipm-aos .ipm-framer [data-aos="ipm-fade"]:not(.aos-animate) { transform: translate3d(0, 14px, 0) !important; }
html.ipm-aos .ipm-framer [data-aos="ipm-rise"]:not(.aos-animate) { transform: translate3d(0, 36px, 0) !important; }
html.ipm-aos .ipm-framer [data-aos="ipm-card"]:not(.aos-animate) { transform: translate3d(0, 28px, 0) scale(.98) !important; }
html.ipm-aos .ipm-framer [data-aos="ipm-blur"]:not(.aos-animate) { transform: translate3d(0, 8px, 0) !important; filter: blur(10px) !important; }
html.ipm-aos .ipm-framer [data-aos^="ipm-"].aos-animate { opacity: var(--ipm-o, 1); }
@media (prefers-reduced-motion: reduce) {
	html.ipm-aos .ipm-framer [data-aos], html.ipm-aos .ipm-framer [data-ipm-appear] { opacity: var(--ipm-o, 1) !important; transform: none !important; filter: none !important; transition: none !important; }
}

/* ---------- Smooth scroll (Lenis) ---------- */
html.lenis .ipm-framer-body { overscroll-behavior: none; }

/* ---------- Slideshows (Framer slider markup, driven by framer-clone.js) ----------
   Framer's own script showed the slides (its SSR ships them visibility:hidden / opacity:0), so we do that here. */
.ipm-framer .ipm-slideshow,
.ipm-framer section:has(> fieldset.framer--slideshow-controls) { opacity: 1 !important; }
.ipm-framer .ipm-slideshow *,
.ipm-framer section:has(> fieldset.framer--slideshow-controls) * { visibility: visible !important; }
.ipm-framer .ipm-slideshow ul { will-change: transform; touch-action: pan-y; }
.ipm-framer .ipm-slideshow ul > li { flex: 0 0 auto; }
.ipm-framer .ipm-slideshow .framer--slideshow-controls button { transition: opacity .2s ease, transform .2s ease; }
.ipm-framer .ipm-slideshow .framer--slideshow-controls button:hover { transform: scale(1.06); }
.ipm-framer .ipm-slideshow .framer--slideshow-controls button > div { transition: opacity .25s ease; }

/* ------------------------------------------------------------------ native Elementor pages
   Pages rebuilt with real Elementor containers/widgets still use the site's own card design:
   these rules dress the dynamic widgets (projects, logos) so they match the captured pages. */
.ipm-framer.ipm-grid--framer,
.ipm-grid--framer {
	display: grid !important;
	grid-template-columns: repeat(var(--ipm-cols, 2), minmax(0, 1fr)) !important;
	gap: var(--ipm-gap, 24px) !important;
	align-items: stretch !important;
	width: 100% !important;
	max-width: none !important;
	/* The grid carries the Framer page-root classes so the captured cards keep their styling;
	   the root also paints a white page background, which must not cover the section gradient. */
	background-color: transparent !important;
	background-image: none !important;
	min-height: 0 !important;
	padding: 0 !important;
}
.ipm-grid--framer > * { min-width: 0; }
.ipm-grid--framer > a { text-decoration: none; }
.ipm-framer-body .ipm-projects__footer { display: flex; justify-content: center; padding-top: 24px; }
.ipm-framer-body .ipm-projects__empty { font: 500 18px/28.8px Manrope, sans-serif; color: #424242; text-align: center; }
.ipm-framer-body .ipm-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	padding: 16px; border: 0; border-radius: 10px; cursor: pointer;
	background: #0C4A77; color: #fff; font: 500 15px/18px Satoshi, sans-serif;
	box-shadow: rgba(24, 45, 92, .4) 0 1px 4px; text-decoration: none;
}
.ipm-framer-body .ipm-btn--outline { background: #fff; color: #0C4A77; }
.ipm-framer-body .ipm-btn:hover { background: #09325E; color: #fff; }

/* Partner / software tiles, 1:1 with the Framer "tech and partners" cards. */
.ipm-fx-logos .ipm-logos__track { display: flex; flex-wrap: wrap; justify-content: center; gap: 24px; }
.ipm-fx-logos .ipm-logos__item {
	flex: 1 1 340px; max-width: 413px; min-height: 206px;
	display: flex; align-items: center; justify-content: center;
	padding: 5px 50px; border-radius: 16px; background: #fff; box-shadow: none;
}
.ipm-fx-logos .ipm-logos__item img { width: 100%; max-width: 250px; height: 196px; object-fit: contain; border-radius: 14px; filter: none; }
@media (max-width: 809px) {
	.ipm-fx-logos .ipm-logos__item { flex-basis: 100%; }
}
/* Small "eyebrow" pill: hugs its own content inside a full-width Elementor container. */
.ipm-fx-pill { width: auto !important; }

/* Images keep the proportions of the original design at every width. */
.ipm-fx-ar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ipm-ar-hero img { aspect-ratio: 634 / 363; }
.ipm-ar-hero-tall img { aspect-ratio: 634 / 720; }
.ipm-ar-wide img { aspect-ratio: 1184 / 920; }
.ipm-ar-half img { aspect-ratio: 582 / 448; }
.ipm-ar-square img { aspect-ratio: 1 / 1; }
.ipm-fx-carousel .swiper-slide img,
.ipm-fx-carousel .elementor-carousel-image { aspect-ratio: 421 / 294; object-fit: cover; width: 100%; }
/* Rich text: the design separates paragraphs inside one text block by 20px. */
.ipm-framer-body .elementor-widget-text-editor p + p { margin-top: 20px; }
.ipm-framer-body .elementor-widget-text-editor ul,
.ipm-framer-body .elementor-widget-text-editor ol { margin: 20px 0 0; padding-left: 22px; }
.ipm-framer-body .elementor-widget-text-editor li + li { margin-top: 8px; }
.ipm-framer.ipm-jobs--framer,
.ipm-jobs--framer {
	display: grid !important;
	grid-template-columns: repeat(var(--ipm-cols, 3), minmax(0, 1fr)) !important;
	gap: 24px !important;
	align-items: stretch !important;
	width: 100% !important;
	max-width: none !important;
	background-color: transparent !important;
	background-image: none !important;
	min-height: 0 !important;
	padding: 0 !important;
}
.ipm-jobs--framer > * { min-width: 0; }
.ipm-ar-card img { aspect-ratio: 294 / 160; }
.ipm-ar-office img { aspect-ratio: 596 / 373; }
.ipm-ar-tall img { aspect-ratio: 431 / 516; }
.ipm-fx-logos--marquee .ipm-logos__track { flex-wrap: nowrap; }
.ipm-fx-form .elementor-field-group > label { font-weight: 700; }
.ipm-ar-mid img { aspect-ratio: 431 / 253; }

/* Policy documents: the page content rendered inside a native Elementor section. */
.ipm-fx-doc h1 { margin: 0 0 24px; }
.ipm-fx-doc h2 { margin: 48px 0 24px; }
.ipm-fx-doc h3 { margin: 32px 0 16px; }
.ipm-fx-doc p { margin: 0 0 20px; }
.ipm-fx-doc ul, .ipm-fx-doc ol { margin: 0 0 20px; padding-left: 22px; }
.ipm-fx-doc li { margin-bottom: 8px; }
.ipm-fx-doc table { width: 100%; border-collapse: collapse; margin: 0 0 24px; }
.ipm-fx-doc td, .ipm-fx-doc th { padding: 16px; border: 1px solid #E9EFF5; text-align: left; vertical-align: top; }

/* Single project: the figure chips and the gallery, in the site design. */
.ipm-fx-doc h1, .ipm-fx-doc h2, .ipm-fx-doc h3 { text-transform: none; }
.ipm-fx-meta .ipm-meta__services { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.ipm-fx-meta .ipm-badge {
	display: inline-flex; align-items: center; padding: 10px; border-radius: 7px;
	background: rgba(12, 74, 119, .08); color: #0C4A77; text-decoration: none;
	font: 500 12px/14.4px Satoshi, sans-serif; letter-spacing: 1px; text-transform: uppercase;
}
.ipm-fx-meta .ipm-meta__list { display: flex; flex-wrap: wrap; gap: 16px; margin: 0; }
.ipm-fx-meta .ipm-meta__item {
	display: flex; flex-direction: column-reverse; align-items: center; gap: 4px;
	padding: 15px; border-radius: 14px; background: #fff; min-width: 150px;
}
.ipm-fx-meta .ipm-meta__item dt,
.ipm-fx-meta .ipm-meta__item dd {
	margin: 0; font: 500 12px/14.4px Satoshi, sans-serif; letter-spacing: 1px; text-align: center;
}
.ipm-fx-meta .ipm-meta__item dt { color: #969696; }
.ipm-fx-meta .ipm-meta__item dd { color: #0C4A77; }
.ipm-fx-meta .ipm-meta__item dt .ipm-icon { display: none; }
.ipm-fx-gallery .ipm-gallery { display: flex; flex-direction: column; gap: 24px; }
.ipm-fx-gallery .ipm-gallery img { width: 100%; height: auto; border-radius: 10px; object-fit: contain; }
.ipm-fx-gallery figure, .ipm-fx-gallery a { margin: 0; display: block; }

/* Header: the translucent, rounded bar that floats over the page. */
.ipm-fx-headerbar { -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.ipm-framer-body .elementor-location-header { position: relative; z-index: 100; }
.ipm-fx-nav .elementor-nav-menu--main .elementor-item { border-radius: 10px; transition: background-color .15s ease; }
.ipm-fx-nav .elementor-nav-menu--main .elementor-item:hover { background-color: rgba(12, 74, 119, .07); }
.ipm-fx-nav .elementor-nav-menu--dropdown { box-shadow: 0 12px 32px rgba(24, 45, 92, .14); border-radius: 12px; overflow: hidden; }
.ipm-fx-social .elementor-social-icon { width: 40px; height: 40px; }
.ipm-fx-logo img { height: auto; }
/* Single job: the details widget carries the description, chips and apply box. */
.ipm-fx-meta .ipm-job-details__body p { font: 500 18px/28.8px Manrope, sans-serif; color: #424242; }
.ipm-fx-meta .ipm-job-details__body li { font: 500 18px/28.8px Manrope, sans-serif; color: #424242; }